﻿
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
--red:#02331A;--rd:#014724;--gold:#F5821F;--gl:#F8A157;--gp:#FEECDD;
--cream:#FAF7F2;--white:#fff;--ink:#1C1C1E;--mid:#6B6B75;--lg:#E8E5DF;--pale:#F2EEE8;
--b:rgba(28,28,30,.12);--br:rgba(1,102,51,.25);--bg:rgba(245,130,31,.35);
--s1:0 2px 12px rgba(28,28,30,.08);--s2:0 8px 32px rgba(28,28,30,.12);--s3:0 20px 60px rgba(28,28,30,.18);
--fd:'Playfair Display',Georgia,serif;--fs:'Cormorant Garamond',Georgia,serif;--fb:'Inter',sans-serif;--fm:'DM Mono',monospace;
--e:cubic-bezier(.25,.46,.45,.94)
}
html{scroll-behavior:smooth}
body{font-family:var(--fb);font-size:15px;line-height:1.6;color:var(--ink);background:var(--cream);overflow-x:hidden}
a,button{cursor:pointer}a{text-decoration:none;color:inherit}
button{border:none;background:none;font:inherit;color:inherit}
input,select{font:inherit}
img{display:block;max-width:100%}

#app{position:relative}
.page{display:none}
.page.show{display:block;animation:fadeUp .28s var(--e) both}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* ── ANNOUNCE ── */
.ann{background:var(--red);color:#fff;text-align:center;padding:8px 12px;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}

/* ── TOP NAV ── */
.nav{background:var(--white);border-bottom:1px solid var(--b);padding:4px clamp(12px,3vw,40px);display:flex;align-items:center;gap:14px;flex-wrap:wrap;position:sticky;top:0;z-index:200;box-shadow:var(--s1)}
.logo{display:flex;align-items:center;flex-shrink:0;cursor:pointer;text-decoration:none;width:260px}
.site-logo{width:90%;height:auto;display:block;object-fit:contain}
@media(max-width:600px){.logo{width:172px}}
@media(max-width:380px){.logo{width:136px}}
#srch-wrap{flex:1 1 260px;min-width:0;max-width:560px;display:flex;order:3}
.sbar{flex:1 1 100%;min-width:0;display:flex;align-items:center;border:1.5px solid var(--lg);border-radius:6px;overflow:hidden;background:var(--pale)}
.sbar:focus-within{border-color:var(--red)}
.sbar select{background:var(--lg);color:var(--mid);border:none;border-right:1.5px solid var(--lg);padding:0 8px;height:42px;font-size:11px;outline:none;-webkit-appearance:none;flex-shrink:0;max-width:100px}
.sbar input{flex:1;background:none;border:none;padding:0 12px;height:42px;font-size:14px;color:var(--ink);outline:none;min-width:0}
.sbar input::placeholder{color:var(--mid)}
.sbtn{background:var(--red);padding:0 16px;height:42px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .2s}
.sbtn:hover{background:var(--rd)}
.sbtn svg{width:14px;height:14px;stroke:#fff;fill:none;stroke-width:2.2}
.nacts{display:flex;align-items:center;gap:14px;flex-shrink:0;margin-left:auto;order:2}
.nib{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:var(--mid);cursor:pointer;transition:color .2s;position:relative}
.nib svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.6}
.nib:hover{color:var(--red)}
.nbdg{position:absolute;top:-4px;right:-6px;background:var(--red);color:#fff;width:15px;height:15px;border-radius:50%;font-size:9px;font-weight:700;display:flex;align-items:center;justify-content:center}

/* ── HAMBURGER (shown on mobile, hidden on desktop) ── */
.mnav-toggle{
  display:none;flex-shrink:0;width:44px;height:44px;padding:0;
  border:1.5px solid var(--lg);border-radius:6px;background:var(--pale);
  cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  -webkit-appearance:none;appearance:none
}
.mnav-toggle span{display:block;width:20px;height:2.5px;background:var(--ink);border-radius:2px;transition:transform .25s,opacity .2s}
.mnav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.mnav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.mnav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

@media(min-width:760px){
  #srch-wrap{order:0;margin-left:24px}
  .nacts{order:0}
}
@media(max-width:759px){
  .nav{padding:4px 12px}
  .logo{order:0;max-width:calc(100% - 120px)}
  .nacts{order:1}
  .nib span{display:none}
  .nib .nbdg{display:flex}
  /* row 2: standalone hamburger, gap, then the search bar */
  .mnav-toggle{order:2;margin-top:4px}
  #srch-wrap{order:3;flex:1 1 0;min-width:0;max-width:none;margin-top:4px}
}
/* Mobile: hamburger is its own component, separate from the search bar */
@media(max-width:900px){
  .mnav-toggle{display:flex}
  #srch-wrap{order:3}
  .sbar select{display:none}
}
@media(min-width:760px) and (max-width:900px){
  #srch-wrap{margin-left:12px}
}

/* ── MEGA NAV ── */
.mnav{background:#F4811F;display:flex;align-items:center;padding:0 clamp(12px,3vw,40px);overflow-x:auto;scrollbar-width:none;position:relative;z-index:190}
.mnav::-webkit-scrollbar{display:none}
.catwrap{position:relative;flex-shrink:0}
.cbtn{display:flex;align-items:center;gap:7px;padding:12px 16px;background:var(--red);color:#fff;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;flex-shrink:0;transition:background .2s;white-space:nowrap;border:none;cursor:pointer}
.cbtn:hover,.catwrap.opn .cbtn{background:var(--rd)}
.cbtn svg.chev{width:11px;height:11px;stroke:#fff;fill:none;stroke-width:2.5;transition:transform .2s;margin-left:2px}
.catwrap.opn .chev{transform:rotate(180deg)}
.catmenu{
  position:fixed;top:0;left:0;min-width:300px;max-width:340px;background:var(--white);
  border:1px solid var(--b);border-radius:10px;box-shadow:var(--s3);
  z-index:999;opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .2s var(--e),transform .2s var(--e),visibility .2s;
  padding:10px;max-height:70vh;overflow-y:auto;
}
.catwrap.opn .catmenu{opacity:1;visibility:visible;transform:translateY(0)}
.catitem{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:7px;font-size:13px;font-weight:600;color:var(--ink);transition:background .15s,color .15s;cursor:pointer;background:none;border:none;width:100%;text-align:left}
.catitem:hover{background:var(--pale);color:var(--red)}
.catitem .ci-ic{font-size:18px;width:26px;text-align:center;flex-shrink:0}
.catitem .ci-cnt{margin-left:auto;font-family:var(--fm);font-size:10px;color:var(--gold)}
.catdiv{height:1px;background:var(--b);margin:6px 4px}

.mls{display:flex;list-style:none}
.mls li button,.mls li a{display:block;padding:12px 13px;font-size:11px;font-weight:500;color:#fff;white-space:nowrap;background:none;border:none;cursor:pointer;transition:color .2s,text-decoration-color .2s;text-decoration:none}
.mls li button:hover,.mls li button.act,.mls li a:hover,.mls li a.act{color:#fff;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.fbdg{margin-left:auto;background:#25D366;color:#fff;padding:6px 14px 6px 30px;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;flex-shrink:0;text-decoration:none;position:relative;transition:background .2s}
.fbdg::before{content:'';position:absolute;left:11px;top:50%;transform:translateY(-50%);width:13px;height:13px;background-repeat:no-repeat;background-position:center;background-size:contain;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23fff' d='M16 3C9 3 3 9 3 16c0 2.5.7 4.9 2 7L3 29l6.2-2c2 1.1 4.3 1.7 6.8 1.7 7 0 13-6 13-13S23 3 16 3zm7.5 18.6c-.3.9-1.7 1.7-2.9 1.9-.8.2-1.8.3-5.2-1.1-4.4-1.8-7.2-6.3-7.4-6.6-.2-.3-1.8-2.4-1.8-4.5s1.1-3.2 1.5-3.6c.4-.4.8-.5 1.1-.5h.8c.3 0 .6 0 .9.7.3.8 1.1 2.8 1.2 3 .1.2.2.5 0 .7-.1.3-.2.4-.4.6l-.6.7c-.2.2-.4.4-.2.8.2.4 1 1.6 2.1 2.6 1.4 1.3 2.6 1.7 3 1.9.4.2.6.1.8-.1l1.2-1.4c.3-.4.6-.3.9-.2l2.7 1.3c.3.2.6.3.6.5.1.3.1 1-.2 1.9z'/%3E%3C/svg%3E")}
.fbdg:hover{background:#1ebc59}

/* Mega nav — collapses into a hamburger drawer on smaller screens */
@media(max-width:900px){
  .mnav{
    position:fixed;top:0;left:0;bottom:0;width:min(320px,86vw);z-index:400;
    flex-direction:column;align-items:stretch;overflow-y:auto;overflow-x:hidden;
    padding:0;gap:0;background:var(--rd);
    transform:translateX(-100%);transition:transform .28s var(--e);
    box-shadow:0 0 40px rgba(0,0,0,.35)
  }
  .mnav.open{transform:translateX(0)}

  .mnav-backdrop{
    position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:399;
    opacity:0;pointer-events:none;transition:opacity .28s
  }
  .mnav-backdrop.show{opacity:1;pointer-events:auto}

  .catwrap{order:1;width:100%}
  .cbtn{width:100%;justify-content:flex-start;padding:15px 20px;font-size:12px}
  .cbtn .chev{margin-left:auto}
  /* dropdown renders inline inside the drawer instead of fixed-position */
  .catmenu{
    position:static !important;opacity:1;visibility:visible;transform:none;
    min-width:0;max-width:none;border:none;border-radius:0;box-shadow:none;
    background:rgba(255,255,255,.06);max-height:0;overflow:hidden;padding:0;
    transition:max-height .28s var(--e)
  }
  .catwrap.opn .catmenu{max-height:60vh;overflow-y:auto;padding:6px}
  .catitem{color:#fff}
  .catitem:hover{background:rgba(255,255,255,.1);color:#fff}

  .mls{order:2;flex-direction:column;width:100%;padding:6px 0}
  .mls li{width:100%}
  .mls li a,.mls li button{
    width:100%;padding:14px 20px;font-size:13px;font-weight:600;
    border-bottom:1px solid rgba(255,255,255,.08);white-space:normal
  }
  .mls li a:hover,.mls li a.act,.mls li button:hover,.mls li button.act{
    background:rgba(255,255,255,.08);text-decoration:none
  }

  .fbdg{
    order:3;margin:14px 20px 24px;width:calc(100% - 40px);
    justify-content:center;padding:13px 16px;font-size:11px;border-radius:8px;
    display:flex;align-items:center
  }
  .fbdg::before{position:static;transform:none;margin-right:8px}
}

/* ── SHARED ── */
.sec{padding:clamp(28px,5vw,56px) clamp(12px,3vw,40px)}
.sec-alt{background:var(--pale)}
.sec-dark{background:var(--ink)}
.sh{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:24px;gap:12px;flex-wrap:wrap}
.slbl{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--red);font-weight:700;margin-bottom:5px;display:flex;align-items:center;gap:6px}
.slbl::before{content:'';width:14px;height:2px;background:var(--red)}
.sec-dark .slbl{color:var(--gold)}.sec-dark .slbl::before{background:var(--gold)}
.sttl{font-family:var(--fd);font-size:clamp(24px,4vw,40px);font-weight:900;line-height:1;letter-spacing:-.02em;color:var(--ink)}
.sec-dark .sttl{color:#fff}
.sva{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--red);border-bottom:1px solid var(--br);padding-bottom:2px;cursor:pointer;white-space:nowrap;background:none;border-left:none;border-right:none;border-top:none;text-decoration:none;display:inline-block}
.sec-dark .sva{color:var(--gold);border-bottom-color:var(--bg);border-left:none;border-right:none;border-top:none}
.vwa-wrap{display:flex;justify-content:center;margin-top:clamp(20px,3vw,32px)}
.vwa-btn{display:inline-block;padding:13px 32px;border:1.5px solid var(--red);border-radius:30px;color:var(--red);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;transition:background .2s,color .2s}
.vwa-btn:hover{background:var(--red);color:#fff}
.dvdr{height:3px;background:linear-gradient(90deg,var(--red),var(--gold),var(--red));opacity:.7}

/* ── PRODUCT CARD ── */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.pc{background:var(--white);border:1.5px solid var(--b);border-radius:10px;overflow:hidden;cursor:pointer;transition:all .22s var(--e);display:flex;flex-direction:column;position:relative}
.pc:hover{border-color:var(--red);transform:translateY(-4px);box-shadow:var(--s3)}
.sec-dark .pc{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.08)}
.sec-dark .pc:hover{border-color:var(--gold)}
.pbdg{position:absolute;top:10px;left:10px;z-index:2;font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:3px}
.bs{background:var(--red);color:#fff}.bn{background:var(--gold);color:#fff}.bh{background:var(--ink);color:#fff}.bg-green{background:#16a34a;color:#fff}
.pc .bg-green{opacity:0;transition:opacity .2s var(--e)}
.pc:hover .bg-green{opacity:1}
.pimg{height:180px;background:var(--pale);display:flex;align-items:center;justify-content:center;transition:background .2s;overflow:hidden;padding:0;text-decoration:none;color:inherit}
.pimg img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;font-size:0;color:transparent}
.pimg>span{font-size:48px;display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.pc:hover .pimg{background:var(--gp)}
/* Feed-sack placeholder for products with no uploaded image */
.feed-ph-svg{width:100%;height:100%;display:block;object-fit:cover}
.pimg .feed-ph-svg,.product-img .feed-ph-svg{width:100%;height:100%}
.gallery-main .feed-ph-svg{width:100%;height:100%;border-radius:6px}
.thumb .feed-ph-svg{width:100%;height:100%;border-radius:6px}
.pbdy{padding:13px;flex:1;display:flex;flex-direction:column;border-top:1px solid var(--b)}
.sec-dark .pbdy{border-top-color:rgba(255,255,255,.07)}
.pvnd{font-size:10px;color:var(--red);letter-spacing:.12em;text-transform:uppercase;font-weight:700;margin-bottom:3px}
.sec-dark .pvnd{color:var(--gold)}
.pnm{font-size:12px;font-weight:500;line-height:1.4;margin-bottom:7px;color:var(--ink);flex:1}
.sec-dark .pnm{color:rgba(255,255,255,.85)}
.pst{display:flex;align-items:center;gap:2px;margin-bottom:7px;font-size:11px;color:var(--gold)}
.prv{font-size:10px;color:var(--mid);margin-left:3px}
.ppr{display:flex;align-items:baseline;gap:6px;margin-bottom:10px}
.cp{font-family:var(--fm);font-size:14px;font-weight:500;color:var(--red)}
.sec-dark .cp{color:var(--gold)}
.op{font-size:11px;color:var(--mid);text-decoration:line-through;font-family:var(--fm)}
.atcb{width:100%;padding:8px;background:transparent;border:1.5px solid var(--br);color:var(--red);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;border-radius:5px;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:5px;cursor:pointer}
.atcb:hover{background:var(--red);color:#fff;border-color:var(--red)}
.sec-dark .atcb{border-color:var(--bg);color:var(--gold)}
.sec-dark .atcb:hover{background:var(--gold);color:#fff}
.atcb svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2}

/* ── HOME: HERO (Happy Feeds-pattern layout) ── */
.bp{background:var(--red);color:#fff;padding:11px 24px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:4px;transition:all .2s;display:inline-flex;align-items:center;gap:6px;border:none;cursor:pointer;text-decoration:none}
.bp:hover{background:var(--rd);transform:translateY(-2px);box-shadow:0 8px 24px rgba(1,102,51,.4)}
.bp svg{width:13px;height:13px;stroke:#fff;fill:none;stroke-width:2.5}
.bg{background:transparent;color:#fff;padding:11px 24px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:4px;border:1.5px solid rgba(255,255,255,.4);transition:all .2s;cursor:pointer;text-decoration:none}
.bg:hover{background:rgba(255,255,255,.1);transform:translateY(-2px)}
@media(max-width:480px){
  .bp,.bg{padding:9px 18px;font-size:10px}
}

.hf-hero{position:relative}
.hf-hero-band{position:relative;min-height:calc(100svh - 178px);box-sizing:border-box;display:flex;align-items:center;overflow:hidden;background:linear-gradient(135deg,#1C1C1E 0%,#2a2a2e 100%);background-size:cover;background-position:center 40%;background-repeat:no-repeat;padding:clamp(28px,5vw,48px) clamp(16px,4vw,48px) clamp(60px,9vw,90px)}
.hf-hero-band::before{content:'';position:absolute;inset:0;background:linear-gradient(100deg,rgba(15,35,26,.62) 0%,rgba(15,35,26,.48) 42%,rgba(15,35,26,.22) 70%,rgba(15,35,26,.08) 100%)}
.hf-hero-main{position:relative;z-index:1;width:100%;max-width:1240px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:clamp(24px,4vw,56px);flex-wrap:wrap}
.hf-hero-copy{flex:1 1 420px;max-width:560px}
.hf-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.14);backdrop-filter:blur(4px);color:#fff;font-size:12px;font-weight:700;letter-spacing:.03em;padding:7px 14px 7px 10px;border-radius:30px;margin-bottom:14px;border:1px solid rgba(255,255,255,.2)}
.hf-badge-ic{display:flex;color:var(--gl)}
.hf-hero-copy h1{font-family:var(--fd);font-size:clamp(26px,3.6vw,46px);font-weight:900;line-height:1.08;letter-spacing:-.02em;color:#fff;margin-bottom:12px;text-shadow:0 2px 16px rgba(0,0,0,.45),0 1px 3px rgba(0,0,0,.5)}
.hf-hero-copy p{font-size:14px;line-height:1.6;color:rgba(255,255,255,.92);max-width:460px;margin-bottom:20px;text-shadow:0 1px 8px rgba(0,0,0,.4)}
.hf-hero-acts{display:flex;gap:12px;flex-wrap:wrap}
.hf-btn-solid{background:var(--red);color:#fff;padding:14px 28px;font-size:13px;font-weight:700;letter-spacing:.02em;border-radius:8px;display:inline-flex;align-items:center;gap:8px;border:none;cursor:pointer;text-decoration:none;transition:all .2s}
.hf-btn-solid:hover{background:var(--rd);transform:translateY(-2px);box-shadow:0 10px 26px rgba(1,102,51,.3)}
.hf-btn-outline{background:#25D366;color:#fff;padding:14px 26px;font-size:13px;font-weight:700;letter-spacing:.02em;border-radius:8px;display:inline-flex;align-items:center;gap:8px;border:none;cursor:pointer;text-decoration:none;transition:all .2s}
.hf-btn-outline:hover{background:#1ebc59;transform:translateY(-2px)}

.hf-hero-pattern{position:absolute;left:0;right:0;bottom:-1px;z-index:1;height:clamp(46px,7vw,80px);background-image:url("../images/hero-pattern.svg");background-repeat:repeat-x;background-size:auto 100%;background-position:bottom center;pointer-events:none}

@media(max-width:820px){
  .hf-hero-main{flex-direction:column;align-items:stretch}
}
@media(max-width:480px){
  .hf-hero-band{min-height:calc(100svh - 148px);padding:24px 16px 56px}
  .hf-hero-acts{flex-direction:column;align-items:stretch}
  .hf-hero-acts a{justify-content:center}
  .hf-hero-pattern{height:34px}
}

/* ── COUNTDOWN ── */
.cdb{background:var(--red);padding:13px clamp(12px,3vw,40px);display:flex;align-items:center;justify-content:center;gap:clamp(10px,3vw,28px);flex-wrap:wrap}
.cdl{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#fff}
.cdt{display:flex;gap:5px;align-items:center}
.tb{text-align:center;background:rgba(0,0,0,.18);border-radius:4px;padding:3px 8px;min-width:44px}
.tn{font-family:var(--fd);font-size:24px;line-height:1;color:#fff;font-weight:900}
.tl{font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.ts{font-size:20px;color:rgba(255,255,255,.6);margin-bottom:6px;font-weight:700}

/* ── TRUST ── */
.trust{background:var(--pale);border-top:1px solid var(--b);border-bottom:1px solid var(--b);display:grid;grid-template-columns:repeat(5,1fr);overflow-x:auto}
@media(max-width:700px){.trust{grid-template-columns:repeat(3,1fr)}}
@media(max-width:440px){.trust{grid-template-columns:repeat(2,1fr)}}
.ti{display:flex;align-items:center;gap:10px;padding:15px clamp(9px,2vw,20px);border-right:1px solid var(--b)}
.ti:last-child{border-right:none}
.tic{width:36px;height:36px;background:var(--red);border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.tic svg{width:15px;height:15px;stroke:#fff;fill:none;stroke-width:1.6}
.tit h4{font-size:11px;font-weight:700;color:var(--ink)}
.tit p{font-size:10px;color:var(--mid)}

/* ── CATEGORIES ── */
.cgr{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:9px}
.cc{background:var(--white);border:1.5px solid var(--b);border-radius:10px;padding:14px 7px;display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer;transition:all .22s var(--e);text-align:center}
.cc:hover{border-color:var(--red);transform:translateY(-3px);box-shadow:var(--s2)}
.cico{width:44px;height:44px;background:var(--pale);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:19px;transition:background .2s}
.cc:hover .cico{background:rgba(1,102,51,.1)}
.cnm{font-size:10px;font-weight:700;color:var(--ink);letter-spacing:.03em}
.cct{font-size:9px;color:var(--gold);font-family:var(--fm)}

/* ── TAB BAR ── */
.tabbar{display:flex;border-bottom:2px solid var(--lg);margin-bottom:22px;overflow-x:auto;scrollbar-width:none}
.tabbar::-webkit-scrollbar{display:none}
.tbtn{padding:10px 18px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mid);border-bottom:2px solid transparent;margin-bottom:-2px;cursor:pointer;white-space:nowrap;background:none;border-left:none;border-right:none;border-top:none;transition:all .2s}
.tbtn.act{color:var(--red);border-bottom-color:var(--red)}
.tbtn:hover:not(.act){color:var(--ink)}

/* ── PROMO ── */
.promo{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){.promo{grid-template-columns:1fr}}
.prcard{border:1.5px solid var(--b);border-radius:12px;padding:clamp(20px,3vw,40px);position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;min-height:200px;cursor:pointer;transition:all .25s var(--e);text-decoration:none;color:inherit}
.prcard:hover{transform:translateY(-3px);box-shadow:var(--s3)}
.prcard.rc{background:var(--red)}.prcard.gc{background:var(--ink)}
.prbe{position:absolute;right:14px;bottom:6px;font-size:100px;opacity:.1;transform:rotate(-10deg);user-select:none;pointer-events:none;transition:all .3s}
.prcard:hover .prbe{opacity:.16;transform:rotate(-5deg) scale(1.06)}
.prtg{font-size:9px;color:var(--gold);letter-spacing:.2em;text-transform:uppercase;font-weight:700;margin-bottom:7px}
.prcard.rc .prtg{color:rgba(255,255,255,.7)}
.prttl{font-family:var(--fd);font-size:clamp(20px,3vw,32px);font-weight:900;line-height:1;margin-bottom:9px;color:var(--ink)}
.prcard.rc .prttl,.prcard.gc .prttl{color:#fff}
.prsb{font-size:12px;margin-bottom:16px;color:var(--mid)}
.prcard.rc .prsb{color:rgba(255,255,255,.7)}.prcard.gc .prsb{color:rgba(255,255,255,.55)}
.prlnk{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--red)}
.prcard.rc .prlnk{color:#fff}.prcard.gc .prlnk{color:var(--gold)}

/* ── NEWSLETTER ── */
.nl{background:var(--ink);padding:clamp(36px,6vw,64px) clamp(12px,3vw,40px);display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
@media(max-width:680px){.nl{grid-template-columns:1fr;gap:24px}}
.nllb{font-size:10px;color:var(--gold);letter-spacing:.2em;text-transform:uppercase;font-weight:700;margin-bottom:10px;display:flex;align-items:center;gap:6px}
.nllb::before{content:'';width:14px;height:2px;background:var(--gold)}
.nl h2{font-family:var(--fd);font-size:clamp(26px,4vw,44px);font-weight:900;line-height:.95;letter-spacing:-.02em;color:#fff;margin-bottom:10px}
.nl h2 span{color:var(--gold)}
.nl p{font-size:13px;color:rgba(255,255,255,.5);line-height:1.7}
.nli{display:flex;border:1.5px solid rgba(255,255,255,.12);border-radius:6px;overflow:hidden;margin-bottom:9px}
.nli input{flex:1;padding:0 14px;height:46px;background:rgba(255,255,255,.06);border:none;color:#fff;font-size:13px;outline:none;min-width:0}
.nli input::placeholder{color:rgba(255,255,255,.35)}
.nli button{background:var(--red);color:#fff;padding:0 18px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;border:none;cursor:pointer;flex-shrink:0;transition:background .2s}
.nli button:hover{background:var(--rd)}
.nlnt{font-size:11px;color:rgba(255,255,255,.35)}

/* ── PRODUCT PAGE ── */
.bc{padding:11px clamp(12px,3vw,40px);display:flex;align-items:center;gap:6px;font-size:11px;color:var(--mid);background:var(--white);border-bottom:1px solid var(--b);flex-wrap:wrap}
.bc button,.bc a{font-size:11px;color:var(--mid);background:none;border:none;cursor:pointer;transition:color .2s;padding:0;text-decoration:none}
.bc button:hover,.bc a:hover{color:var(--red)}
.bc span{color:var(--ink);font-weight:600}.bcs{opacity:.4}
.pp{max-width:1260px;margin:0 auto;padding:clamp(18px,3vw,36px) clamp(12px,3vw,40px)}
.pmn{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,52px);align-items:start}
@media(max-width:820px){.pmn{grid-template-columns:1fr}}

/* GALLERY */
.gal{position:sticky;top:78px;display:flex;flex-direction:column;gap:10px}
.gm{position:relative;background:var(--pale);border-radius:12px;overflow:hidden;border:1.5px solid var(--b);aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;cursor:zoom-in}
.gem{font-size:130px;transition:transform .35s var(--e);user-select:none}
.gm:hover .gem{transform:scale(1.07)}
.gbdgs{position:absolute;top:11px;left:11px;display:flex;flex-direction:column;gap:5px;z-index:2}
.gbdg{font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:4px}
.gbdg.s{background:var(--red);color:#fff}.gbdg.n{background:var(--gold);color:#fff}
.gwsh{position:absolute;top:11px;right:11px;width:34px;height:34px;background:var(--white);border:1.5px solid var(--b);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;z-index:2;box-shadow:var(--s1)}
.gwsh:hover,.gwsh.act{border-color:var(--red);color:var(--red)}
.gwsh svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.8}
.gwsh.act svg{fill:var(--red);stroke:var(--red)}
.gths{display:flex;gap:7px;flex-wrap:wrap}
.gth{width:58px;height:58px;background:var(--pale);border:2px solid var(--b);border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:24px;cursor:pointer;transition:all .2s;flex-shrink:0}
.gth:hover,.gth.act{border-color:var(--red)}
.gth.act{background:var(--gp)}
.gshr{display:flex;align-items:center;gap:7px}
.gshr span{font-size:10px;color:var(--mid);font-weight:600;letter-spacing:.07em;text-transform:uppercase}
.shrb{width:28px;height:28px;border:1.5px solid var(--b);border-radius:5px;display:flex;align-items:center;justify-content:center;color:var(--mid);transition:all .2s;cursor:pointer;background:none}
.shrb:hover{border-color:var(--red);color:var(--red)}
.shrb svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.6}

/* PRODUCT INFO */
.pinf{display:flex;flex-direction:column}
.pvr{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.pvbr{font-size:10px;color:var(--red);font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.pvsk{font-family:var(--fm);font-size:10px;color:var(--mid)}
.ptl{font-family:var(--fd);font-size:clamp(20px,3vw,34px);font-weight:900;line-height:1.05;letter-spacing:-.02em;margin-bottom:11px;color:var(--ink)}
.rr{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.sg{display:flex;align-items:center;gap:2px;font-size:13px;color:var(--gold)}
.rn{font-size:12px;font-weight:700;color:var(--ink)}
.rc{font-size:12px;color:var(--mid)}
.rdv{width:1px;height:12px;background:var(--b)}
.is{display:flex;align-items:center;gap:5px;font-size:11px;color:#2E7D32;font-weight:600}
.isd{width:6px;height:6px;border-radius:50%;background:#2E7D32;flex-shrink:0}
.bvf{background:rgba(46,125,50,.1);color:#2E7D32;font-size:9px;font-weight:700;padding:2px 8px;border-radius:20px;letter-spacing:.05em;border:1px solid rgba(46,125,50,.25)}
/* PRICE BLOCK */
.prbl{background:var(--pale);border:1.5px solid var(--b);border-radius:10px;padding:16px 18px;margin-bottom:18px}
.prro{display:flex;align-items:baseline;gap:9px;margin-bottom:5px}
.prc{font-family:var(--fm);font-size:clamp(24px,3.5vw,36px);font-weight:500;color:var(--red)}
.pro{font-family:var(--fm);font-size:15px;color:var(--mid);text-decoration:line-through}
.prs{background:var(--red);color:#fff;font-size:9px;font-weight:800;padding:3px 8px;border-radius:4px;letter-spacing:.05em}
.prtx{font-size:10px;color:var(--mid);margin-bottom:8px}
.prmt{display:flex;gap:12px;flex-wrap:wrap;padding-top:9px;border-top:1px solid var(--b)}
.pmi{display:flex;align-items:center;gap:4px;font-size:10px;color:var(--mid)}
.pmi svg{width:11px;height:11px;stroke:var(--gold);fill:none;stroke-width:2}
/* OPTIONS */
.opts{display:flex;flex-direction:column;gap:14px;margin-bottom:18px}
.olbl{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink);margin-bottom:7px;display:flex;align-items:center;justify-content:space-between}
.olbl a{font-size:10px;color:var(--red);text-transform:none;letter-spacing:0;font-weight:500;cursor:pointer;background:none;border:none}
.swg{display:flex;gap:6px;flex-wrap:wrap}
.sw{width:32px;height:32px;border-radius:50%;border:2.5px solid var(--b);cursor:pointer;transition:all .2s;position:relative}
.sw.act{border-color:var(--ink)}.sw.act::after{content:'';position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--ink)}
.swtg{display:flex;gap:6px;flex-wrap:wrap}
.swt{padding:6px 12px;border:1.5px solid var(--b);border-radius:6px;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s;color:var(--ink);background:none}
.swt:hover{border-color:var(--red);color:var(--red)}
.swt.act{border-color:var(--red);background:var(--red);color:#fff}
.swt.dis{opacity:.4;cursor:not-allowed;text-decoration:line-through}
.qg{display:flex;align-items:center;gap:9px}
.qc{display:flex;align-items:center;border:1.5px solid var(--b);border-radius:8px;overflow:hidden}
.qbtn{width:36px;height:38px;display:flex;align-items:center;justify-content:center;font-size:17px;color:var(--mid);transition:all .2s;background:var(--pale);border:none;cursor:pointer}
.qbtn:hover{background:var(--red);color:#fff}
.qv{width:44px;height:38px;text-align:center;border:none;border-left:1.5px solid var(--b);border-right:1.5px solid var(--b);font-size:14px;font-weight:700;color:var(--ink);background:var(--white);outline:none}
.qn{font-size:11px;color:var(--mid)}
/* IN STOCK DETAIL BADGE */
.instock-detail-row{display:flex;align-items:center;gap:8px;padding:9px 14px;background:rgba(46,125,50,0.08);border:1.5px solid rgba(46,125,50,0.22);border-radius:6px;width:fit-content;margin-bottom:18px}
.instock-detail-row .stock-dot{width:8px;height:8px;border-radius:50%;background:#16a34a;flex-shrink:0;animation:pulse-dot 1.6s ease-in-out infinite}
@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:.4}}
.instock-detail-row span:last-child{font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#16a34a}
/* ACTION BTNS */
.ab{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}
.badd{display:flex;align-items:center;justify-content:center;gap:8px;padding:13px;background:var(--red);color:#fff;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;border-radius:6px;transition:all .2s;width:100%;border:none;cursor:pointer}
.badd:hover{background:var(--rd);transform:translateY(-2px);box-shadow:0 8px 28px rgba(1,102,51,.3)}
.badd svg{width:16px;height:16px;stroke:#fff;fill:none;stroke-width:2}
.bbn{display:flex;align-items:center;justify-content:center;padding:13px;background:var(--ink);color:#fff;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;border-radius:6px;transition:background .2s;width:100%;border:none;cursor:pointer}
.bbn:hover{background:#2A2A2E}
.bsr2{display:flex;gap:8px}
.bwl,.bcmp{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px;border:1.5px solid var(--b);border-radius:6px;font-size:11px;font-weight:600;color:var(--mid);transition:all .2s;background:none;cursor:pointer}
.bwl:hover{border-color:var(--red);color:var(--red)}
.bcmp:hover{border-color:var(--gold);color:var(--gold)}
.bwl svg,.bcmp svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.8}
/* HIGHLIGHTS */
.hlb{margin-bottom:18px}
.hli{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid var(--b)}
.hli:last-child{border-bottom:none}
.hlic{width:24px;height:24px;border-radius:50%;background:rgba(245,130,31,.12);border:1px solid var(--bg);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.hlic svg{width:11px;height:11px;stroke:var(--gold);fill:none;stroke-width:2}
.hlt{font-size:12px;color:var(--ink)}
/* DELIVERY */
.dlvb{background:var(--white);border:1.5px solid var(--b);border-radius:10px;overflow:hidden;margin-bottom:18px}
.dlvhd{padding:11px 15px;border-bottom:1px solid var(--b);font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink)}
.dlvr{display:flex;align-items:flex-start;gap:11px;padding:11px 15px;border-bottom:1px solid var(--b)}
.dlvr:last-child{border-bottom:none}
.dic{width:30px;height:30px;background:rgba(1,102,51,.08);border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.dic svg{width:13px;height:13px;stroke:var(--red);fill:none;stroke-width:1.8}
.di h4{font-size:12px;font-weight:600;color:var(--ink);margin-bottom:2px}
.di p{font-size:11px;color:var(--mid);line-height:1.4}
.dpinr{display:flex;gap:6px;align-items:center;padding:9px 15px;background:var(--pale)}
.dpinr input{flex:1;border:1.5px solid var(--b);border-radius:5px;padding:6px 9px;font-size:12px;outline:none;background:var(--white)}
.dpinr input:focus{border-color:var(--red)}
.dpinr button{background:var(--red);color:#fff;padding:6px 12px;border-radius:5px;font-size:11px;font-weight:700;border:none;cursor:pointer;transition:background .2s}
.dpinr button:hover{background:var(--rd)}
/* CONTENT TABS */
.ctabs{margin-top:clamp(24px,4vw,44px)}
.ctnav{display:flex;border-bottom:2px solid var(--lg);overflow-x:auto;scrollbar-width:none}
.ctnav::-webkit-scrollbar{display:none}
.ctbtn{padding:11px 18px;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--mid);border-bottom:2px solid transparent;margin-bottom:-2px;cursor:pointer;white-space:nowrap;background:none;border-left:none;border-right:none;border-top:none;transition:all .2s}
.ctbtn.act{color:var(--red);border-bottom-color:var(--red)}
.ctbtn:hover:not(.act){color:var(--ink)}
.ctpn{display:none;padding:clamp(18px,3vw,32px) 0}
.ctpn.act{display:block}
.dgr{display:grid;grid-template-columns:1fr 280px;gap:28px;align-items:start}
@media(max-width:720px){.dgr{grid-template-columns:1fr}}
.dt h3{font-family:var(--fd);font-size:20px;font-weight:900;margin-bottom:11px}
.dt p{font-size:13px;color:var(--mid);line-height:1.8;margin-bottom:12px}
.dfl{list-style:none;display:flex;flex-direction:column;gap:8px}
.dfl li{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--ink)}
.dfl li::before{content:'✓';color:var(--red);font-weight:800;flex-shrink:0}
.dcd{background:var(--pale);border:1.5px solid var(--b);border-radius:12px;padding:18px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px}
.dcd .be{font-size:72px}
.dcd h4{font-family:var(--fd);font-size:15px;font-weight:900;color:var(--ink)}
.dcd p{font-size:11px;color:var(--mid)}
.spill{background:var(--red);color:#fff;font-size:9px;font-weight:700;padding:3px 9px;border-radius:20px;letter-spacing:.05em}
.stbl{width:100%;border-collapse:collapse;border:1.5px solid var(--b);border-radius:10px;overflow:hidden}
.stbl tr:nth-child(even){background:var(--pale)}
.stbl tr{border-bottom:1px solid var(--b)}
.stbl tr:last-child{border-bottom:none}
.stbl td{padding:10px 15px;font-size:12px}
.stbl td:first-child{font-weight:700;color:var(--ink);width:35%;background:rgba(245,130,31,.06)}
.stbl td:last-child{color:var(--mid)}
/* REVIEWS */
.rvl{display:grid;grid-template-columns:260px 1fr;gap:24px;align-items:start}
@media(max-width:680px){.rvl{grid-template-columns:1fr}}
.rvsm{background:var(--white);border:1.5px solid var(--b);border-radius:12px;padding:20px;text-align:center}
.rsbg{font-family:var(--fd);font-size:58px;font-weight:900;color:var(--ink);line-height:1}
.rsst{display:flex;justify-content:center;gap:3px;margin:5px 0;font-size:17px;color:var(--gold)}
.rscn{font-size:12px;color:var(--mid);margin-bottom:14px}
.rsbr{display:flex;flex-direction:column;gap:6px;text-align:left}
.rsbar{display:flex;align-items:center;gap:8px;font-size:11px}
.rslb{width:24px;color:var(--mid);flex-shrink:0;text-align:right}
.rstr{flex:1;height:5px;background:var(--lg);border-radius:3px;overflow:hidden}
.rsfl{height:100%;background:var(--gold);border-radius:3px}
.rspc{width:26px;color:var(--mid);font-size:10px}
.rvls{display:flex;flex-direction:column;gap:12px}
.rvcd{background:var(--white);border:1.5px solid var(--b);border-radius:10px;padding:16px}
.rvch{display:flex;align-items:flex-start;justify-content:space-between;gap:9px;margin-bottom:9px;flex-wrap:wrap}
.rvcu{display:flex;align-items:center;gap:9px}
.rvav{width:36px;height:36px;border-radius:50%;background:var(--red);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff;flex-shrink:0}
.rvnm{font-size:13px;font-weight:700;color:var(--ink)}
.rvdt{font-size:10px;color:var(--mid)}
.rvst{display:flex;gap:2px;font-size:12px;color:var(--gold)}
.rvvf{background:rgba(46,125,50,.1);color:#2E7D32;font-size:9px;font-weight:700;padding:2px 7px;border-radius:20px}
.rvtl{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:5px}
.rvbd{font-size:12px;color:var(--mid);line-height:1.7}
.rvmt{display:flex;align-items:center;gap:11px;margin-top:9px;padding-top:9px;border-top:1px solid var(--b);font-size:11px;color:var(--mid)}
.rvmt button{font-size:11px;color:var(--red);font-weight:600;cursor:pointer;background:none;border:none}
.wrvb{display:flex;align-items:center;justify-content:center;gap:7px;padding:10px;border:1.5px dashed var(--br);border-radius:8px;color:var(--red);font-size:12px;font-weight:600;cursor:pointer;transition:all .2s;margin-bottom:12px;width:100%;background:none}
.wrvb:hover{background:rgba(1,102,51,.04)}
.wrvb svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}
/* QA */
.qal{display:flex;flex-direction:column;gap:11px}
.qai{background:var(--white);border:1.5px solid var(--b);border-radius:10px;overflow:hidden}
.qaq{padding:14px 16px;display:flex;align-items:flex-start;gap:9px;cursor:pointer;transition:background .2s;background:none;border:none;width:100%;text-align:left}
.qaq:hover{background:var(--pale)}
.qaqi{width:24px;height:24px;background:var(--red);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;flex-shrink:0;margin-top:1px}
.qaqt{flex:1;font-size:13px;font-weight:600;color:var(--ink)}
.qach{width:15px;height:15px;stroke:var(--mid);fill:none;stroke-width:2;transition:transform .2s;flex-shrink:0}
.qai.opn .qach{transform:rotate(180deg)}
.qaa{display:none;padding:0 16px 14px 50px;font-size:12px;color:var(--mid);line-height:1.7}
.qai.opn .qaa{display:block}
.qaab{display:flex;align-items:center;gap:7px;padding:10px;border:1.5px dashed var(--b);border-radius:8px;color:var(--mid);font-size:12px;font-weight:600;cursor:pointer;transition:all .2s;margin-top:11px;background:none;border-left:1.5px dashed var(--b)}
.qaab:hover{border-color:var(--gold);color:var(--gold)}
.qaab svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2}
/* STICKY */
.stky{position:fixed;bottom:0;left:0;right:0;background:var(--white);border-top:2px solid var(--red);padding:9px clamp(12px,3vw,40px);display:flex;align-items:center;gap:12px;z-index:150;box-shadow:0 -8px 32px rgba(28,28,30,.12);transform:translateY(100%);transition:transform .3s var(--e)}
.stky.vis{transform:translateY(0)}
.stkp{display:flex;align-items:center;gap:9px;flex:1;min-width:0}
.stkt{width:38px;height:38px;background:var(--pale);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:17px;border:1px solid var(--b);flex-shrink:0}
.stkn{font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stkpr{font-family:var(--fm);font-size:14px;color:var(--red);white-space:nowrap}
.stka{display:flex;align-items:center;gap:6px;padding:9px 18px;background:var(--red);color:#fff;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;border-radius:6px;transition:background .2s;border:none;cursor:pointer}
.stka:hover{background:var(--rd)}
.stka svg{width:13px;height:13px;stroke:#fff;fill:none;stroke-width:2}

/* ── CART ── */
.cov{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:300;opacity:0;pointer-events:none;transition:opacity .3s;backdrop-filter:blur(3px)}
.cov.opn{opacity:1;pointer-events:all}
.csb{position:fixed;top:0;right:0;bottom:0;width:min(370px,92vw);background:var(--white);border-left:3px solid var(--red);z-index:301;transform:translateX(100%);transition:transform .32s var(--e);display:flex;flex-direction:column;box-shadow:var(--s3)}
.csb.opn{transform:translateX(0)}
.csh{padding:16px 18px;border-bottom:1px solid var(--b);display:flex;align-items:center;justify-content:space-between;background:var(--red)}
.csh h3{font-family:var(--fd);font-size:20px;font-weight:900;color:#fff}
.cscl{width:30px;height:30px;border:1.5px solid rgba(255,255,255,.35);border-radius:6px;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;transition:all .2s;background:none}
.cscl:hover{background:rgba(255,255,255,.2)}
.citms{flex:1;overflow-y:auto;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.cit{display:flex;gap:10px;align-items:flex-start;padding:10px;background:var(--pale);border:1px solid var(--b);border-radius:7px}
.citim{width:42px;height:42px;background:var(--lg);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0;overflow:hidden}
.citim img{width:100%;height:100%;object-fit:cover;border-radius:6px}
.citin{flex:1;min-width:0}
.citin h4{font-size:12px;font-weight:600;color:var(--ink);margin-bottom:5px}
/* qty controls inside cart item */
.ciqr{display:flex;align-items:center;gap:5px}
.ciqb{width:22px;height:22px;border:1.5px solid var(--b);border-radius:4px;font-size:13px;font-weight:700;color:var(--mid);display:flex;align-items:center;justify-content:center;cursor:pointer;background:var(--white);transition:all .2s;line-height:1;flex-shrink:0}
.ciqb:hover{background:var(--red);color:#fff;border-color:var(--red)}
.ciqv{font-size:12px;font-weight:700;min-width:18px;text-align:center;color:var(--ink)}
/* right column: price + delete */
.citr{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0}
.citpr{font-family:var(--fm);font-size:12px;color:var(--red)}
.citdl{width:20px;height:20px;border-radius:4px;font-size:16px;line-height:1;color:var(--mid);display:flex;align-items:center;justify-content:center;cursor:pointer;background:none;border:none;transition:color .2s;padding:0}
.citdl:hover{color:var(--red)}
.cft{padding:14px;border-top:1px solid var(--b);background:var(--pale);flex-shrink:0}
.ctr{display:flex;justify-content:space-between;margin-bottom:11px;align-items:baseline}
.ctr span:first-child{font-size:10px;color:var(--mid);text-transform:uppercase;letter-spacing:.1em;font-weight:700}
.ctr span:last-child{font-family:var(--fd);font-size:24px;color:var(--red);font-weight:900}
.chkb{display:block;width:100%;padding:12px;background:var(--red);color:#fff;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-align:center;border-radius:5px;border:none;cursor:pointer;margin-bottom:6px;transition:background .2s;text-decoration:none}
.chkb:hover{background:var(--rd)}
.cclr{width:100%;padding:7px;border:1.5px solid rgba(1,102,51,.25);color:var(--red);font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;border-radius:5px;cursor:pointer;background:none;transition:all .2s;margin-bottom:6px}
.cclr:hover{background:rgba(1,102,51,.07)}
.cntb{width:100%;padding:9px;border:1.5px solid var(--b);color:var(--mid);font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;border-radius:5px;cursor:pointer;background:none;transition:all .2s}
.cntb:hover{border-color:var(--ink);color:var(--ink)}

/* ── TOAST ── */
.tst{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(80px);background:var(--ink);border:1.5px solid var(--bg);color:#fff;padding:10px 18px;border-radius:6px;font-size:12px;font-weight:500;z-index:500;transition:transform .28s var(--e);white-space:nowrap;display:flex;align-items:center;gap:8px;box-shadow:var(--s3)}
.tst.sh{transform:translateX(-50%) translateY(0)}
.tsti{color:var(--gold);font-size:13px}

/* ── ZOOM ── */
.zmv{position:fixed;inset:0;background:rgba(0,0,0,.9);z-index:600;display:none;align-items:center;justify-content:center}
.zmv.opn{display:flex}
.zme{font-size:180px;user-select:none}
.zmcl{position:absolute;top:18px;right:18px;width:36px;height:36px;border:2px solid rgba(255,255,255,.3);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;font-size:16px;background:none;border-left:2px solid rgba(255,255,255,.3)}
.zmcl:hover{background:var(--red);border-color:var(--red)}

/* ── FOOTER ── */
footer{background:#111113;padding:clamp(28px,4vw,44px) clamp(12px,3vw,40px) 18px;border-top:3px solid var(--red)}
.fgr{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:clamp(14px,3vw,36px);margin-bottom:28px}
@media(max-width:820px){.fgr{grid-template-columns:1fr 1fr}}
@media(max-width:440px){.fgr{grid-template-columns:1fr}}
.flm{font-family:var(--fd);font-size:20px;font-weight:900;color:#fff;margin-bottom:3px}
.flm span{color:var(--red)}
.flogo{height:44px;width:auto;display:block;margin-bottom:10px}
.fls{font-family:var(--fs);font-size:9px;letter-spacing:.2em;color:#fff;text-transform:uppercase;margin-bottom:10px}
.fbp{font-size:12px;color:#fff;line-height:1.75;margin-bottom:14px;max-width:200px}
.fsoc{display:flex;gap:6px}
.fsb{width:30px;height:30px;border:1px solid rgba(255,255,255,.1);border-radius:6px;display:flex;align-items:center;justify-content:center;color:#fff;transition:all .2s;cursor:pointer;background:none}
.fsb:hover{border-color:var(--red);color:var(--red)}
.fsb svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.5}
.fc h4{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-bottom:12px;color:#fff}
.fls2{list-style:none;display:flex;flex-direction:column;gap:7px}
.fls2 li button,.fls2 li a{font-size:12px;color:#fff;transition:all .2s;display:block;cursor:pointer;background:none;border:none;text-align:left;padding:0;text-decoration:none}
.fls2 li button:hover,.fls2 li a:hover{color:var(--gold);padding-left:4px}
.fbt{border-top:1px solid rgba(255,255,255,.07);padding-top:16px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
.fbt p{font-size:11px;color:#fff}
.pays{display:flex;gap:5px;flex-wrap:wrap}
.pay{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:3px;padding:3px 7px;font-size:8px;font-weight:800;letter-spacing:.06em;color:#fff}
.crafted-by{flex-basis:100%;text-align:center;margin-top:10px;padding-top:12px;border-top:1px solid rgba(255,255,255,.06);font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.4);text-decoration:none;transition:color .2s}
.crafted-by:hover{color:var(--gold)}

@media(max-width:560px){.bsr2{flex-direction:column}.stkn{display:none}}

/* ─── INFO PAGES ─── */
.info-nav{background:var(--white);border-bottom:1px solid var(--b);padding:10px clamp(12px,3vw,40px);display:flex;align-items:center;justify-content:space-between;gap:14px;position:sticky;top:0;z-index:200;box-shadow:var(--s1)}
.info-back{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--mid);background:none;border:none;cursor:pointer;transition:color .2s}
.info-back:hover{color:var(--red)}
.info-hero{background:var(--ink) url('../images/info-hero-bg.jpg') center 42%/cover no-repeat;padding:clamp(40px,6vw,72px) clamp(12px,3vw,40px);text-align:center;position:relative;overflow:hidden}
.info-hero::before{content:'';position:absolute;inset:0;background:rgba(8,16,13,.58);z-index:0}
.info-hero-lbl{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);font-weight:700;margin-bottom:10px;position:relative;z-index:1}
.info-hero h1{font-family:var(--fd);font-size:clamp(28px,5vw,52px);font-weight:900;color:#fff;letter-spacing:-.02em;line-height:1;margin-bottom:12px;position:relative;z-index:1;text-shadow:0 2px 10px rgba(0,0,0,.4)}
.info-hero p{font-size:14px;color:rgba(255,255,255,.85);max-width:480px;margin:0 auto;position:relative;z-index:1;text-shadow:0 1px 6px rgba(0,0,0,.4)}
.info-body{max-width:860px;margin:0 auto;padding:clamp(32px,5vw,64px) clamp(16px,3vw,40px)}
.info-last-updated{font-size:11px;color:var(--mid);font-family:var(--fm);margin-bottom:28px;display:inline-block;background:var(--pale);border:1px solid var(--b);padding:5px 12px;border-radius:4px}
.info-section{margin-bottom:36px}
.info-section h2{font-family:var(--fd);font-size:clamp(18px,2.5vw,24px);font-weight:900;color:var(--ink);margin-bottom:10px;padding-bottom:8px;border-bottom:2px solid var(--pale)}
.info-section h3{font-size:14px;font-weight:700;color:var(--ink);margin:14px 0 5px}
.info-section p,.info-section li{font-size:13.5px;color:var(--mid);line-height:1.85}
.info-section ul,.info-section ol{padding-left:20px;margin:8px 0}
.info-section li{margin-bottom:5px}
.info-section a{color:var(--red);text-decoration:none;font-weight:600}
.info-section a:hover{text-decoration:underline}
/* About page */
.about-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--b);border:1.5px solid var(--b);border-radius:10px;overflow:hidden;margin-top:20px}
.about-stat{background:var(--white);padding:22px 12px;text-align:center}
.about-stat .num{font-family:var(--fd);font-size:30px;font-weight:900;color:var(--red);line-height:1}
.about-stat p{font-size:11px;color:var(--mid);margin-top:5px}
.about-values{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-top:16px}
.about-value-card{background:var(--pale);border-radius:10px;padding:20px 16px;text-align:center;border:1.5px solid var(--b)}
.avc-icon{font-size:28px;margin-bottom:10px}
.about-value-card h3{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:6px}
.about-value-card p{font-size:12px;color:var(--mid);line-height:1.7}
@media(max-width:560px){.about-stats{grid-template-columns:1fr 1fr}}

/* ─── ABOUT PAGE — "Our Story" layout ─── */
.story-hero{position:relative;min-height:clamp(320px,46vw,520px);display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;background:var(--ink)}
.story-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%}
.story-hero::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,12,.45) 0%,rgba(10,10,12,.68) 100%);z-index:1}
.story-hero-in{position:relative;z-index:2;padding:0 20px}
.story-hero-lbl{font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gl);font-weight:700;margin-bottom:14px}
.story-hero h1{font-family:var(--fd);font-size:clamp(34px,6vw,64px);font-weight:900;color:#fff;letter-spacing:-.01em;line-height:1.05;margin-bottom:14px;text-shadow:0 2px 14px rgba(0,0,0,.45)}
.story-hero p{font-size:clamp(14px,1.6vw,16.5px);color:rgba(255,255,255,.92);max-width:560px;margin:0 auto;line-height:1.6;text-shadow:0 1px 8px rgba(0,0,0,.4)}

.story-narrative{max-width:760px;margin:0 auto;padding:clamp(48px,7vw,80px) clamp(16px,4vw,40px);text-align:center}
.story-narrative .section-eyebrow{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.25em;text-transform:uppercase;color:var(--red);margin-bottom:16px}
.story-narrative h2{font-family:var(--fd);font-size:clamp(24px,3.4vw,32px);font-weight:900;color:var(--ink);line-height:1.25;margin-bottom:18px}
.story-narrative p{font-size:14.5px;color:var(--mid);line-height:1.9;margin-bottom:14px}
.story-narrative p:last-child{margin-bottom:0}

.story-grid3{max-width:1180px;margin:0 auto;padding:0 clamp(16px,4vw,40px) clamp(48px,7vw,80px);display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.story-g3-card{text-align:center}
.story-g3-media{position:relative;aspect-ratio:3/4;border-radius:12px;overflow:hidden;margin-bottom:18px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.story-g3-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.story-g3-card h3{font-family:var(--fd);font-size:17px;font-weight:700;color:var(--ink);margin-bottom:8px}
.story-g3-card p{font-size:13px;color:var(--mid);line-height:1.75;max-width:280px;margin:0 auto}
@media(max-width:860px){.story-grid3{grid-template-columns:1fr;max-width:420px}}

.story-split{background:var(--pale);padding:clamp(48px,7vw,80px) clamp(16px,4vw,40px)}
.story-split-in{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:28px}
.story-split-card{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:4/5;display:flex;align-items:flex-end;text-align:center}
.story-split-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.story-split-card:hover img{transform:scale(1.04)}
.story-split-card::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,12,0) 40%,rgba(10,10,12,.78) 100%);z-index:1}
.ssc-body{position:relative;z-index:2;padding:clamp(24px,4vw,36px);width:100%}
.ssc-eyebrow{font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:var(--gl);font-weight:700;margin-bottom:8px}
.ssc-body h3{font-family:var(--fd);font-size:clamp(20px,2.6vw,26px);font-weight:900;color:#fff;margin-bottom:6px}
.ssc-body p{font-size:13px;color:rgba(255,255,255,.88);margin-bottom:16px}
.ssc-body .btn-orange{background:var(--gold);color:#fff;font-size:13px;font-weight:700;padding:11px 24px;border-radius:6px;text-decoration:none;border:none;cursor:pointer;display:inline-block;letter-spacing:.02em;transition:background .2s}
.ssc-body .btn-orange:hover{background:#d96b0e}
@media(max-width:720px){.story-split-in{grid-template-columns:1fr}}

.story-contact{max-width:1180px;margin:0 auto;padding:0 clamp(16px,4vw,40px) clamp(48px,7vw,80px)}
.story-contact-in{background:var(--ink);border-radius:16px;padding:clamp(36px,5vw,56px);display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center}
.story-contact-h{font-family:var(--fd);font-size:clamp(22px,3vw,28px);font-weight:900;color:#fff;margin-bottom:8px}
.story-contact-p{font-size:13.5px;color:rgba(255,255,255,.75);line-height:1.8}
.story-contact-p strong{color:#fff}
.story-contact-p a{color:var(--gl);text-decoration:none;font-weight:600}
.story-contact-p a:hover{text-decoration:underline}
.story-contact-actions{display:flex;flex-direction:column;gap:10px;flex-shrink:0}
.story-contact-actions a{white-space:nowrap;text-align:center}
.story-contact-actions .btn-orange{background:var(--gold);color:#fff;font-size:13.5px;font-weight:700;padding:13px 26px;border-radius:7px;text-decoration:none;border:none;cursor:pointer;transition:background .2s}
.story-contact-actions .btn-orange:hover{background:#d96b0e}
.story-contact-actions .btn-ghost-dark{background:transparent;color:#fff;font-size:13.5px;font-weight:600;padding:12px 26px;border-radius:7px;border:1.5px solid rgba(255,255,255,.3);text-decoration:none;transition:border-color .2s}
.story-contact-actions .btn-ghost-dark:hover{border-color:#fff}
@media(max-width:720px){.story-contact-in{grid-template-columns:1fr;text-align:center}.story-contact-actions{align-items:center}}
/* Contact page */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin-bottom:36px}
.contact-card{background:var(--white);border:1.5px solid var(--b);border-radius:10px;padding:20px 16px;display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.cc-icon{width:40px;height:40px;background:var(--red);border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}
.cc-icon svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2}
.contact-card h3{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);margin:0}
.contact-card p,.contact-card a{font-size:13px;color:var(--mid);line-height:1.7;margin:0}
.contact-card a{color:var(--red);font-weight:600;text-decoration:none}
.contact-card a:hover{text-decoration:underline}
.cform-wrap{background:var(--white);border:1.5px solid var(--b);border-radius:12px;padding:clamp(20px,4vw,38px)}
.cform-wrap h2{font-family:var(--fd);font-size:22px;font-weight:900;margin-bottom:5px;color:var(--ink)}
.cform-wrap>p{font-size:13px;color:var(--mid);margin-bottom:22px}
.cform-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cform-group{display:flex;flex-direction:column;gap:5px;margin-bottom:14px}
.cform-group label{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink)}
.cform-group input,.cform-group select,.cform-group textarea{border:1.5px solid var(--lg);border-radius:6px;padding:10px 12px;font-size:13px;color:var(--ink);background:var(--pale);outline:none;font-family:inherit;transition:border-color .2s;width:100%;box-sizing:border-box}
.cform-group input:focus,.cform-group select:focus,.cform-group textarea:focus{border-color:var(--red)}
.cform-group textarea{resize:vertical;min-height:110px}
.cform-submit{background:var(--red);color:#fff;padding:12px 28px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;border:none;border-radius:6px;cursor:pointer;transition:background .2s;display:inline-flex;align-items:center;gap:8px}
.cform-submit:hover{background:var(--rd)}
@media(max-width:560px){.cform-row{grid-template-columns:1fr}}
/* ═══════════════════════════════════════════
   HOME PAGE — REFERENCE LAYOUT
═══════════════════════════════════════════ */
#pg-home{--green:#02331A;--green-dark:#02331A;--green-deeper:#02331A;--green-light:#017a3d;--green-mist:#e8f4ed;--orange:#F4811F;--orange-dark:#d96b0e;--orange-light:#f9a456;--r-white:#fff;--r-ink:#111a14;--r-ink-soft:#6b7c70;--r-ink-muted:#9aab9e;--r-surface:#f7faf8;--r-border:#dae8de}
#pg-home .serif{font-family:'Playfair Display',Georgia,serif}

/* HERO — auto-scrolling image carousel, 5 slides, each with its own caption */
#pg-home .hero{
  background-color:var(--ink);
  position:relative;overflow:hidden;min-height:560px
}
#pg-home .hero-slide{
  position:absolute;inset:0;
  opacity:0;transition:opacity 1.2s ease-in-out;will-change:opacity;z-index:0
}
#pg-home .hero-slide.is-active{opacity:1;z-index:1}
@media(prefers-reduced-motion:reduce){
  #pg-home .hero-slide{transition:none}
}
/* Photo fills the entire hero slide — 100% of the section's width and
   height, no gaps or bars — cropping evenly from the sides as needed. */
#pg-home .hero-slide-img{position:absolute;inset:0;z-index:0}
#pg-home .hero-slide-img img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center
}
/* Left-side scrim on every slide — keeps the photo's subject fully visible
   on the right while giving the caption enough contrast to read on the left. */
#pg-home .hero-slide::before{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(10,10,12,0.82) 0%,rgba(10,10,12,0.66) 38%,rgba(10,10,12,0.28) 62%,rgba(10,10,12,0) 78%)
}
#pg-home .hero-inner{max-width:1180px;margin:0 auto;display:flex;align-items:center;min-height:560px;padding:80px clamp(16px,4vw,48px);position:relative;z-index:2;height:100%;box-sizing:border-box}
#pg-home .hero-content{max-width:620px}
#pg-home .hero-title{text-shadow:0 2px 6px rgba(0,0,0,0.75),0 4px 20px rgba(0,0,0,0.5)}
#pg-home .hero-desc{text-shadow:0 1px 3px rgba(0,0,0,0.85),0 2px 12px rgba(0,0,0,0.6)}
#pg-home .hero-eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,0.15);border:1px solid rgba(255,255,255,0.35);color:#fff;font-size:12px;font-weight:600;padding:6px 14px;border-radius:100px;margin-bottom:24px;letter-spacing:0.3px}
#pg-home .hero-eyebrow-dot{width:6px;height:6px;background:var(--orange);border-radius:50%}
#pg-home .hero-title{font-family:'Playfair Display',serif;font-size:clamp(34px,5vw,54px);font-weight:700;color:#fff;line-height:1.12;margin-bottom:22px;letter-spacing:-0.5px}
#pg-home .hero-title em{font-style:italic;color:var(--orange-light)}
#pg-home .hero-desc{font-size:16px;line-height:1.8;color:#fff;max-width:460px;margin-bottom:38px;font-weight:400}
#pg-home .hero-actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
#pg-home .btn-orange{background:var(--orange);color:#fff;font-size:14.5px;font-weight:600;padding:14px 30px;border-radius:6px;text-decoration:none;border:none;cursor:pointer;display:inline-block;transition:background .2s}
#pg-home .btn-orange:hover{background:var(--orange-dark)}
#pg-home .btn-ghost-white{background:transparent;color:rgba(255,255,255,0.8);font-size:14.5px;font-weight:500;padding:14px 28px;border-radius:6px;border:1.5px solid rgba(255,255,255,0.25);text-decoration:none;cursor:pointer;display:inline-block;transition:border-color .2s,color .2s}
#pg-home .btn-ghost-white:hover{border-color:rgba(255,255,255,0.5);color:#fff}
/* Dot navigation */
#pg-home .hero-dots{position:absolute;left:0;right:0;bottom:22px;z-index:3;display:flex;align-items:center;justify-content:center;gap:9px}
#pg-home .hero-dot{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,0.4);border:none;padding:0;cursor:pointer;transition:background .2s,transform .2s}
#pg-home .hero-dot:hover{background:rgba(255,255,255,0.7)}
#pg-home .hero-dot.is-active{background:var(--orange);transform:scale(1.25)}
@media(max-width:900px){
  #pg-home .hero-inner{padding:56px clamp(16px,4vw,48px) 72px;min-height:0}
  #pg-home .hero{min-height:480px}
  #pg-home .hero-slide-img img{opacity:.55}
  #pg-home .hero-slide::before{background:linear-gradient(90deg,rgba(10,10,12,0.88) 0%,rgba(10,10,12,0.8) 50%,rgba(10,10,12,0.6) 100%)}
}

/* TRUST STRIP */
#pg-home .trust-strip{background:var(--orange);padding:0 clamp(16px,4vw,48px)}
#pg-home .trust-strip-inner{max-width:1180px;margin:0 auto;display:flex;align-items:stretch;gap:0}
#pg-home .trust-item{display:flex;align-items:center;gap:10px;padding:18px 0;flex:1;border-right:1px solid rgba(255,255,255,0.12);padding-right:28px;margin-right:28px}
#pg-home .trust-item:last-child{border-right:none;margin-right:0;padding-right:0}
#pg-home .trust-icon{width:34px;height:34px;background:rgba(255,255,255,0.1);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
#pg-home .trust-icon svg{width:15px;height:15px}
#pg-home .trust-text{font-size:13px;color:rgba(255,255,255,0.85);font-weight:500;line-height:1.35}
#pg-home .trust-text strong{display:block;color:#fff;font-weight:600;font-size:13px}
@media(max-width:860px){
  #pg-home .trust-strip-inner{flex-wrap:wrap}
  #pg-home .trust-item{flex:1 1 45%;border-right:none;margin-right:0;padding-right:0}
}

/* SECTIONS */
#pg-home .section{padding:clamp(48px,8vw,88px) clamp(16px,4vw,48px)}
#pg-home .section-center{text-align:center}
#pg-home .section-bg{background:var(--r-surface)}
#pg-home .section-label{display:inline-block;font-size:11.5px;font-weight:600;color:var(--green);letter-spacing:2px;text-transform:uppercase;margin-bottom:12px;position:relative}
#pg-home .section-label::before,#pg-home .section-label::after{content:'';position:absolute;top:50%;width:24px;height:1px;background:var(--orange);transform:translateY(-50%)}
#pg-home .section-label::before{right:calc(100% + 10px)}
#pg-home .section-label::after{left:calc(100% + 10px)}
#pg-home .section-h{font-family:'Playfair Display',serif;font-size:clamp(28px,4vw,36px);font-weight:700;color:var(--r-ink);line-height:1.2;max-width:540px;margin:0 auto 48px}
#pg-home .section-h.left{margin:0 0 48px;max-width:none}

/* CATEGORIES (dynamic #pop-cats) — carousel of large portrait image cards, one card per category */
#pg-home .cat-carousel{position:relative;display:flex;align-items:center;gap:12px;max-width:1180px;margin:0 auto}
#pg-home .cc-viewport{overflow:hidden;flex:1;min-width:0}
#pg-home .cc-track{--cc-visible:4;--cc-gap:22px;display:flex;gap:var(--cc-gap);will-change:transform;align-items:flex-start}
#pg-home .cc-track > .cc{
  flex:0 0 calc((100% - (var(--cc-visible) - 1) * var(--cc-gap)) / var(--cc-visible));
  max-width:calc((100% - (var(--cc-visible) - 1) * var(--cc-gap)) / var(--cc-visible))
}
#pg-home .cc-track > p{flex:1}
#pg-home #pop-cats .cc{cursor:pointer;display:flex;flex-direction:column;gap:14px;text-align:center}
#pg-home #pop-cats .cc-title{font-family:'Playfair Display',serif;font-size:clamp(15px,1.6vw,18px);font-weight:600;color:var(--r-ink);letter-spacing:0;line-height:1.3}
#pg-home #pop-cats .cc-media{position:relative;width:100%;aspect-ratio:3/4;border-radius:10px;overflow:hidden;background:var(--green-mist);box-shadow:0 1px 3px rgba(0,0,0,.08);transition:transform .3s,box-shadow .3s}
#pg-home #pop-cats .cc:hover .cc-media{transform:translateY(-4px);box-shadow:0 16px 36px rgba(1,102,51,0.16)}
#pg-home #pop-cats .cc-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
#pg-home #pop-cats .cc:hover .cc-media img{transform:scale(1.04)}
#pg-home #pop-cats .cc-media svg{position:absolute;inset:0;width:100%;height:100%}
#pg-home #pop-cats .cc-scrim{position:absolute;left:0;right:0;bottom:0;height:46%;background:linear-gradient(to top,rgba(10,10,12,.78) 0%,rgba(10,10,12,.35) 55%,rgba(10,10,12,0) 100%);pointer-events:none}
#pg-home #pop-cats .cc-shop{position:absolute;left:0;right:0;bottom:18px;display:flex;align-items:center;justify-content:center;gap:6px;color:#fff;font-size:12.5px;font-weight:600;letter-spacing:.3px;text-decoration:none}
#pg-home #pop-cats .cc-shop:hover{text-decoration:underline}
#pg-home #pop-cats .cc-shop svg{position:static;width:13px;height:13px;flex-shrink:0}
@media(max-width:1100px){#pg-home .cc-track{--cc-visible:3}}
@media(max-width:720px){#pg-home .cc-track{--cc-visible:2}}
@media(max-width:480px){
  #pg-home .cc-track{--cc-visible:1;--cc-gap:14px}
  #pg-home .cat-carousel{gap:6px}
  #pg-home .fc-arrow{width:34px;height:34px}
}

/* FEATURED PRODUCTS (home) — carousel, 5 cards visible, same card size as category.php */
#pg-home .products-inner{max-width:1180px;margin:0 auto}
#pg-home .products-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:36px;gap:12px;flex-wrap:wrap}
#pg-home .view-all-link{font-size:13.5px;font-weight:600;color:var(--green);text-decoration:none;display:flex;align-items:center;gap:5px}
#pg-home .view-all-link:hover{text-decoration:underline}

#pg-home .featured-carousel{position:relative;display:flex;align-items:center;gap:12px}
#pg-home .fc-viewport{overflow:hidden;flex:1;min-width:0}
#pg-home .fc-track{--fc-visible:5;--fc-gap:14px;display:flex;gap:var(--fc-gap);will-change:transform}
#pg-home .fc-track > .pc{
  flex:0 0 calc((100% - (var(--fc-visible) - 1) * var(--fc-gap)) / var(--fc-visible));
  max-width:calc((100% - (var(--fc-visible) - 1) * var(--fc-gap)) / var(--fc-visible))
}
#pg-home .fc-track > div:only-child{flex:1}
#pg-home .fc-arrow{
  flex-shrink:0;width:40px;height:40px;border-radius:50%;
  background:var(--white);border:1.5px solid var(--r-border);color:var(--green);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  transition:background .2s,color .2s,border-color .2s,box-shadow .2s
}
#pg-home .fc-arrow svg{width:18px;height:18px}
#pg-home .fc-arrow:hover{background:var(--green);color:#fff;border-color:var(--green);box-shadow:0 8px 20px rgba(1,102,51,0.18)}
@media(max-width:1100px){#pg-home .fc-track{--fc-visible:4}}
@media(max-width:860px){#pg-home .fc-track{--fc-visible:3}}
@media(max-width:640px){#pg-home .fc-track{--fc-visible:2}}
@media(max-width:460px){
  #pg-home .fc-track{--fc-visible:1}
  #pg-home .fc-arrow{width:34px;height:34px}
}

/* WHY CHOOSE — redesigned */
#pg-home .why-section{
  position:relative;overflow:hidden;isolation:isolate;
  padding-top:clamp(38px,6.4vw,70px);padding-bottom:clamp(38px,6.4vw,70px);
  background:linear-gradient(135deg,var(--green-deeper) 0%,var(--green-dark) 50%,var(--green) 100%);
  background-attachment:fixed
}
@media(max-width:900px){
  #pg-home .why-section{background-attachment:scroll}
}
/* Strong dark scrim so white text keeps high contrast over the photo */
#pg-home .why-section::before{
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(2,8,5,0.86) 0%,rgba(1,20,12,0.80) 50%,rgba(2,8,5,0.88) 100%)
}
#pg-home .why-inner{max-width:1180px;margin:0 auto;position:relative;z-index:1}
#pg-home .why-head{text-align:center;max-width:640px;margin:0 auto 38px}
#pg-home .why-head .section-label{color:var(--orange-light)}
#pg-home .why-head .section-label::before,#pg-home .why-head .section-label::after{background:var(--orange)}
#pg-home .why-head .section-h{margin-bottom:16px;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,0.55)}
#pg-home .why-intro{font-size:15px;line-height:1.8;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,0.5)}
#pg-home .why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
#pg-home .why-card{
  position:relative;background:rgba(3,18,11,0.62);border:1px solid rgba(255,255,255,0.14);border-radius:14px;
  padding:26px 22px;overflow:hidden;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  transition:transform .25s var(--e),box-shadow .25s var(--e),border-color .25s,background .25s
}
#pg-home .why-card::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--green-light),var(--orange));transform:scaleX(0);transform-origin:left;transition:transform .35s var(--e)}
#pg-home .why-card:hover{transform:translateY(-4px);box-shadow:0 22px 46px rgba(0,0,0,0.45);border-color:rgba(244,129,31,0.45);background:rgba(3,18,11,0.78)}
#pg-home .why-card:hover::after{transform:scaleX(1)}
#pg-home .why-card-icon{width:46px;height:46px;border-radius:12px;background:rgba(244,129,31,0.18);color:var(--orange-light);display:flex;align-items:center;justify-content:center;margin-bottom:14px;transition:background .25s,color .25s}
#pg-home .why-card-icon svg{width:22px;height:22px}
#pg-home .why-card:hover .why-card-icon{background:var(--orange);color:#fff}
#pg-home .why-card-title{font-family:'Playfair Display',serif;font-size:16px;font-weight:600;color:#fff;line-height:1.35;margin-bottom:8px}
#pg-home .why-card-desc{font-size:13px;line-height:1.65;color:#fff}
#pg-home .why-foot{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:35px}
#pg-home .why-foot-link{font-size:13.5px;font-weight:500;color:#fff;text-decoration:none}
#pg-home .why-foot-link:hover{color:var(--orange-light)}
@media(max-width:1000px){#pg-home .why-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){#pg-home .why-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:460px){#pg-home .why-grid{grid-template-columns:1fr}}

/* METRICS STRIP */
#pg-home .metrics-strip{background:var(--orange-dark);padding:0 clamp(16px,4vw,48px)}
#pg-home .metrics-strip-inner{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr)}
#pg-home .metric-strip-item{padding:36px 24px;text-align:center;border-right:1px solid rgba(255,255,255,0.1)}
#pg-home .metric-strip-item:last-child{border-right:none}
#pg-home .metric-strip-n{font-family:'Playfair Display',serif;font-size:40px;font-weight:700;color:#fff;line-height:1}
#pg-home .metric-strip-l{font-size:13px;color:rgba(255,255,255,0.85);margin-top:6px;font-weight:400}
@media(max-width:700px){
  #pg-home .metrics-strip-inner{grid-template-columns:1fr 1fr}
  #pg-home .metric-strip-item:nth-child(2){border-right:none}
}

/* ABOUT US (home) */
#pg-home .about-home{background:var(--r-white)}
#pg-home .about-home-inner{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.15fr 0.85fr;gap:56px;align-items:stretch}
#pg-home .about-home-lead{font-size:16px;line-height:1.75;color:var(--r-ink);font-weight:500;margin-bottom:16px;max-width:560px}
#pg-home .about-home-body{font-size:14.5px;line-height:1.8;color:var(--r-ink-soft);margin-bottom:28px;max-width:560px}
#pg-home .about-home-values{display:grid;grid-template-columns:1fr 1fr;gap:20px 28px;margin-bottom:32px}
#pg-home .about-home-value{display:flex;gap:12px;align-items:flex-start}
#pg-home .ahv-icon{font-size:22px;line-height:1;flex-shrink:0;width:40px;height:40px;background:var(--green-mist);border-radius:10px;display:flex;align-items:center;justify-content:center}
#pg-home .ahv-title{font-family:'Playfair Display',serif;font-size:15px;font-weight:600;color:var(--r-ink);margin-bottom:3px}
#pg-home .ahv-desc{font-size:12.5px;line-height:1.6;color:var(--r-ink-soft)}
#pg-home .about-home-media{
  position:relative;border-radius:16px;overflow:hidden;min-height:380px;
  background:var(--orange-dark) url('../images/5524309.png') center/cover no-repeat
}
#pg-home .about-home-media::before{content:'';position:absolute;inset:0;background:linear-gradient(160deg,rgba(20,10,0,0.18) 0%,rgba(20,10,0,0.55) 100%)}
#pg-home .about-home-badge{position:absolute;left:24px;bottom:24px;right:24px;background:rgba(40,20,0,0.65);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,0.16);border-radius:12px;padding:20px 22px}
#pg-home .ahb-n{font-size:38px;font-weight:700;color:#fff;line-height:1}
#pg-home .ahb-l{font-size:13px;color:#fff;margin-top:4px}
@media(max-width:900px){
  #pg-home .about-home-inner{grid-template-columns:1fr;gap:32px}
  #pg-home .about-home-media{min-height:260px;order:-1}
}
@media(max-width:520px){
  #pg-home .about-home-values{grid-template-columns:1fr}
}

/* TESTIMONIALS */
#pg-home .testi-section{
  background:linear-gradient(135deg,var(--orange-dark) 0%,var(--orange) 100%);
  background-attachment:fixed;
  padding:88px clamp(16px,4vw,48px);position:relative;overflow:hidden
}
@media(max-width:900px){
  #pg-home .testi-section{background-attachment:scroll}
}
#pg-home .testi-section::before{content:'';position:absolute;inset:0;background:rgba(0,0,0,0.30);pointer-events:none}
#pg-home .testi-inner{max-width:1180px;margin:0 auto;position:relative;z-index:2}
#pg-home .testi-header{text-align:center;margin-bottom:56px}
#pg-home .testi-header .section-label{color:#fff}
#pg-home .testi-header .section-label::before,#pg-home .testi-header .section-label::after{background:#fff}
#pg-home .testi-header .section-h{color:#fff}
#pg-home .testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
#pg-home .testi-card{background:rgba(40,20,0,0.35);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,0.14);border-radius:14px;padding:32px 28px;display:flex;flex-direction:column;gap:20px;transition:background .25s,border-color .25s}
#pg-home .testi-card:hover{background:rgba(40,20,0,0.5);border-color:rgba(255,255,255,0.45)}
#pg-home .testi-stars{display:flex;gap:3px}
#pg-home .testi-star{color:#ffe2b8;font-size:16px}
#pg-home .testi-quote{font-family:'Playfair Display',serif;font-size:15.5px;font-style:italic;color:rgba(255,255,255,0.82);line-height:1.75;flex:1}
#pg-home .testi-footer{display:flex;align-items:center;gap:14px;padding-top:20px;border-top:1px solid rgba(255,255,255,0.1)}
#pg-home .testi-avatar{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Playfair Display',serif;font-size:16px;font-weight:700;color:#fff;flex-shrink:0}
#pg-home .testi-name{font-size:14px;font-weight:600;color:#fff;margin-bottom:2px}
#pg-home .testi-role{font-size:12px;color:rgba(255,255,255,0.45)}
@media(max-width:900px){#pg-home .testi-grid{grid-template-columns:1fr}}

/* CTA BANNER */
#pg-home .cta-section{background:var(--orange);padding:72px clamp(16px,4vw,48px);position:relative;overflow:hidden}
#pg-home .cta-section::after{content:'';position:absolute;right:-60px;top:-60px;width:320px;height:320px;border-radius:50%;background:rgba(255,255,255,0.07);pointer-events:none}
#pg-home .cta-inner{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1fr auto;gap:48px;align-items:center;position:relative;z-index:2}
#pg-home .cta-title{font-family:'Playfair Display',serif;font-size:clamp(28px,4vw,34px);font-weight:700;color:#fff;margin-bottom:10px;line-height:1.2}
#pg-home .cta-desc{font-size:15.5px;color:rgba(255,255,255,0.75);line-height:1.7;max-width:500px}
#pg-home .cta-actions{display:flex;flex-direction:column;align-items:flex-end;gap:14px;flex-shrink:0}
#pg-home .cta-phone-wrap{text-align:right}
#pg-home .cta-phone-label{font-size:11px;color:rgba(255,255,255,0.55);text-transform:uppercase;letter-spacing:1px;margin-bottom:4px}
#pg-home .cta-phone{font-family:'Playfair Display',serif;font-size:22px;font-weight:700;color:#fff;text-decoration:none}
#pg-home .btn-white{background:#fff;color:var(--green);padding:13px 28px;border-radius:6px;font-size:14.5px;font-weight:600;text-decoration:none;border:none;cursor:pointer;display:inline-block;transition:background .2s}
#pg-home .btn-white:hover{background:var(--green-mist)}
@media(max-width:760px){
  #pg-home .cta-inner{grid-template-columns:1fr;gap:28px}
  #pg-home .cta-actions{align-items:flex-start}
  #pg-home .cta-phone-wrap{text-align:left}
}

/* DELIVERY ACROSS KENYA */
#pg-home .delivery-section{background:#fff;overflow:hidden;padding-left:0;padding-right:0}
#pg-home .delivery-head{text-align:center;max-width:660px;margin:0 auto 36px;padding:0 clamp(16px,4vw,48px)}
#pg-home .delivery-head .section-h{margin-bottom:16px}
#pg-home .delivery-intro{font-size:15px;line-height:1.8;color:var(--r-ink-soft)}
#pg-home .delivery-intro strong{color:var(--green);font-weight:700}
#pg-home .delivery-marquee{
  display:flex;flex-direction:column;gap:16px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)
}
#pg-home .dm-row{display:flex;width:max-content}
#pg-home .dm-track{display:flex;gap:14px;padding-right:14px;flex-shrink:0;will-change:transform}
#pg-home .dm-row-a .dm-track{animation:dm-scroll-left 40s linear infinite}
#pg-home .dm-row-b .dm-track{animation:dm-scroll-right 46s linear infinite}
#pg-home .delivery-marquee:hover .dm-track{animation-play-state:paused}
@keyframes dm-scroll-left{from{transform:translateX(0)}to{transform:translateX(-100%)}}
@keyframes dm-scroll-right{from{transform:translateX(-100%)}to{transform:translateX(0)}}
#pg-home .dm-chip{
  display:inline-flex;align-items:center;gap:7px;white-space:nowrap;
  background:var(--green-mist);color:var(--green-dark);
  border:1.5px solid var(--r-border);border-radius:100px;
  padding:12px 22px;font-size:14px;font-weight:600;letter-spacing:0.2px
}
#pg-home .dm-row-b .dm-chip{background:var(--orange-pale);color:var(--orange-dark);border-color:#f6d9bd}
#pg-home .delivery-foot{text-align:center;margin-top:36px;padding:0 clamp(16px,4vw,48px);display:flex;flex-direction:column;align-items:center;gap:16px}
#pg-home .delivery-foot-note{font-size:14px;color:var(--r-ink-soft);line-height:1.6;max-width:520px}
#pg-home .wa-cta{
  display:inline-flex;align-items:center;gap:10px;
  background:#25D366;color:#fff;
  font-size:14px;font-weight:700;letter-spacing:0.6px;text-transform:uppercase;
  padding:15px 32px;border-radius:100px;text-decoration:none;
  box-shadow:0 8px 24px rgba(37,211,102,0.32);
  transition:background .2s,transform .2s,box-shadow .2s
}
#pg-home .wa-cta:hover{background:#1ebc59;transform:translateY(-2px);box-shadow:0 12px 30px rgba(37,211,102,0.4)}
#pg-home .wa-cta svg{width:20px;height:20px}
@media(prefers-reduced-motion:reduce){
  #pg-home .dm-track{animation:none !important}
  #pg-home .dm-row{flex-wrap:wrap;width:auto;justify-content:center}
  #pg-home .dm-row .dm-track:nth-child(2){display:none}
  #pg-home .dm-track{flex-wrap:wrap;justify-content:center}
}
@media(max-width:560px){
  #pg-home .dm-chip{padding:10px 18px;font-size:13px}
}

/* ── WHATSAPP BUTTON ── */
#gms-wa{position:fixed;bottom:24px;right:24px;z-index:9998;display:flex;align-items:center;cursor:pointer}
#gms-wa-ic{width:56px;height:56px;background:#25D366;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:transform .2s,box-shadow .2s;animation:gms-wa-pulse 2.4s ease-in-out infinite;flex-shrink:0}
#gms-wa-ic img{width:30px;height:30px}
#gms-wa-tip{position:absolute;right:68px;background:#25D366;color:#fff;font-size:13px;font-weight:700;white-space:nowrap;padding:8px 14px;border-radius:6px;pointer-events:none;opacity:0;transform:translateX(8px);transition:opacity .2s,transform .2s;font-family:Inter,sans-serif;line-height:1.4;box-shadow:0 4px 14px rgba(37,211,102,.35)}
#gms-wa-tip::after{content:'';position:absolute;right:-6px;top:50%;transform:translateY(-50%);border:6px solid transparent;border-right:none;border-left-color:#25D366}
#gms-wa:hover #gms-wa-ic{transform:scale(1.08);box-shadow:0 6px 24px rgba(37,211,102,.65);animation:none}
#gms-wa:hover #gms-wa-tip{opacity:1;transform:translateX(0)}
@media(max-width:560px){#gms-wa-tip{display:none}}
@keyframes gms-wa-pulse{0%,100%{box-shadow:0 4px 16px rgba(37,211,102,.45)}50%{box-shadow:0 4px 28px rgba(37,211,102,.75),0 0 0 8px rgba(37,211,102,.12)}}
