@import url("fonts.css");

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#f6f4ee;color:#1d2b22;font-family:'Work Sans',Helvetica,Arial,sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
a{color:#2f5a3d;text-decoration:none}
a:hover{color:#b4622f}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
img{max-width:100%;display:block}
::selection{background:#d9e2d2}

.skip-link{position:absolute;left:-9999px;top:0;background:#1d3527;color:#fff;padding:12px 18px;z-index:100}
.skip-link:focus{left:12px;top:12px}

@keyframes zaRise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes zaSlide{from{transform:translateX(100%)}to{transform:none}}
@keyframes zaFade{from{opacity:0}to{opacity:1}}

.cover-img{width:100%;height:100%;object-fit:cover}

/* ---------- header / nav ---------- */
.nav-links{display:flex;gap:24px;margin-left:auto;font-size:15px}
.nav-links a{background:none;border:0;padding:4px 0;color:#26382c}
.nav-toggle{display:none;background:none;border:1px solid #cfc9b6;border-radius:2px;padding:9px 12px;margin-left:auto;color:#1d3527;font-size:14px}
.mobile-menu{display:none;flex-direction:column;gap:2px;background:#fbfaf6;border-top:1px solid #e0dccd}
.mobile-menu a{display:block;padding:14px 32px;color:#26382c;border-bottom:1px solid #ece8dc;font-size:15px}
.mobile-menu.open{display:flex}

/* ---------- responsive grids (retrofit onto inline-styled layout) ---------- */
@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr!important}
  .split-grid-a{grid-template-columns:1fr!important}
  .detail-grid{grid-template-columns:1fr!important}
  .checkout-grid{grid-template-columns:1fr!important}
  .grid-4{grid-template-columns:repeat(2,1fr)!important}
  .grid-5{grid-template-columns:repeat(2,1fr)!important}
  .grid-3{grid-template-columns:repeat(2,1fr)!important}
  .footer-grid{grid-template-columns:1fr 1fr!important}
  .stats-grid{grid-template-columns:repeat(2,1fr)!important}
  h1{font-size:38px!important}
  .hero-h1{font-size:42px!important}
}
@media (max-width:640px){
  .grid-2{grid-template-columns:1fr!important}
  .grid-3{grid-template-columns:1fr!important}
  .grid-4{grid-template-columns:1fr!important}
  .grid-5{grid-template-columns:1fr!important}
  .footer-grid{grid-template-columns:1fr!important}
  .stats-grid{grid-template-columns:1fr 1fr!important}
  .nav-links{display:none}
  .nav-toggle{display:inline-block}
  .topbar-extra{display:none!important}
  .page-title{font-size:32px!important}
  .hero-h1{font-size:32px!important}
  .section-h2{font-size:32px!important}
  section{padding-left:20px!important;padding-right:20px!important}
  .container{padding-left:20px!important;padding-right:20px!important}
  .cart-drawer-panel{width:100%!important;max-width:100%!important}
}

/* ---------- cart drawer ---------- */
.cart-overlay{position:fixed;inset:0;z-index:60;display:none}
.cart-overlay.open{display:flex;justify-content:flex-end}
.cart-backdrop{position:absolute;inset:0;background:rgba(23,38,29,0.42)}
.cart-drawer-panel{position:relative;width:440px;max-width:92vw;background:#f6f4ee;height:100%;display:flex;flex-direction:column;animation:zaSlide 0.28s ease both;box-shadow:-18px 0 40px rgba(23,38,29,0.16)}

/* ---------- cookie banner ---------- */
.cookie-banner{position:fixed;left:0;right:0;bottom:0;z-index:70;background:#12241a;color:#dfe7d5;padding:20px 32px;box-shadow:0 -12px 30px rgba(18,36,26,0.25);display:none}
.cookie-banner.open{display:block}

/* ---------- faq ---------- */
.faq-item summary{list-style:none;cursor:pointer;width:100%;padding:22px 0;font-family:'Newsreader',Georgia,serif;font-size:23px;color:#1d3527;position:relative;padding-right:30px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'+';position:absolute;right:0;top:20px;font-size:24px;color:#b4622f}
.faq-item[open] summary::after{content:'\2212'}
.faq-item p{margin:0 0 22px;font-size:16px;color:#3f4c42}
.faq-item{border-bottom:1px solid #e0dccd}

/* ---------- misc ---------- */
.badge-pill{background:#b4622f;color:#fbfaf6;font-size:11px;letter-spacing:0.1em;text-transform:uppercase;padding:5px 9px;font-family:ui-monospace,Menlo,monospace}
.qty-btn{background:none;border:0;padding:5px 11px;color:#2f5a3d}
.form-msg{border:1px solid #2f5a3d;padding:24px;background:#f0f3ea}
.cat-btn{background:#fbfaf6;border:1px solid #d5cfbd;padding:9px 18px;font-size:14px;color:#26382c;border-radius:2px}
.cat-btn.active{border-color:#2f5a3d;color:#1d3527}
.cat-btn .dot{color:#b4622f}
.product-card{border:1px solid #e0dccd;background:#fbfaf6;display:flex;flex-direction:column}
.product-card .thumb{position:relative;height:190px;overflow:hidden}
.js-only{display:none}
.no-js .js-only{display:none!important}