/** Shopify CDN: Minification failed

Line 6:0 Unexpected "<"

**/
<style>
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
:root{
  --g:    #2C4A35;
  --gm:   #3D6147;
  --gl:   #5C7A4E;
  --sage: #A8BFA0;
  --sp:   #E8F2E4;
  --sp2:  #F2F8EF;
  --terra:#B8633A;
  --tp:   #FAF0E8;
  --w:    #FFFFFF;
  --off:  #F6F7F4;
  --bdr:  #E6EBE3;
  --text: #1A2418;
  --tm:   #4A5548;
  --tl:   #8A9888;
  --star: #E8A020;
  --red:  #C62828;
  --sans: 'Plus Jakarta Sans',sans-serif;
  --serif:'Lora',Georgia,serif;
  --r:    10px;
  --rl:   18px;
  --rp:   999px;
  --s1:   0 1px 4px rgba(26,36,24,.07);
  --s2:   0 4px 20px rgba(26,36,24,.09),0 1px 4px rgba(26,36,24,.05);
  --s3:   0 20px 60px rgba(26,36,24,.13),0 4px 16px rgba(26,36,24,.07);
}
body{font-family:var(--sans);color:var(--text);background:var(--w);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{cursor:pointer;font-family:var(--sans);border:none;background:none}
img{display:block;max-width:100%}

/* ─── TOPBAR ─── */
.topbar{
  background:var(--g);color:rgba(255,255,255,.9);
  padding:9px 20px;font-size:clamp(12.00px, 3.200vw, 16.00px);font-weight:500;
  display:flex;align-items:center;justify-content:center;gap:16px;
  letter-spacing:.01em;text-align:center;flex-wrap:wrap;
}
.topbar b{color:white;font-weight:700}
.tb-pipe{color:rgba(255,255,255,.2);display:none}
@media(min-width:600px){.tb-pipe{display:inline}}

/* ─── NAV ─── */
nav{
  background:var(--w);border-bottom:1px solid var(--bdr);
  position:sticky;top:0;z-index:200;box-shadow:var(--s1);
  transition:box-shadow .3s;
}
nav.scrolled{box-shadow:0 2px 20px rgba(26,36,24,.1)}
.nav-in{
  max-width:1360px;margin:0 auto;
  padding:0 20px;height:60px;
  display:flex;align-items:center;gap:12px;
}
.logo{
  font-family:var(--serif);font-size:clamp(16.00px, 5.333vw, 26.00px);font-weight:500;color:var(--g);
  display:flex;align-items:center;gap:8px;flex-shrink:0;
}
.logo-mark{
  width:30px;height:30px;background:var(--g);border-radius:8px;
  display:grid;place-items:center;
  transition:transform .5s cubic-bezier(.34,1.56,.64,1);
}
.logo:hover .logo-mark{transform:rotate(-12deg) scale(1.08)}
.logo-mark svg{width:16px;height:16px}
.logo-plant{font-weight:600;color:var(--g)}
.logo-today{font-weight:400;font-style:italic;color:var(--gl)}
.nav-links{display:none;gap:1px;flex:1;margin-left:8px}
@media(min-width:900px){.nav-links{display:flex}}
.nav-links a{
  font-size:clamp(12.00px, 3.467vw, 17.00px);font-weight:500;color:var(--tm);
  padding:6px 12px;border-radius:8px;transition:all .14s;
}
.nav-links a:hover{color:var(--g);background:var(--sp2)}
.nav-r{display:flex;align-items:center;gap:8px;margin-left:auto}
.nav-icon{
  width:36px;height:36px;border-radius:50%;
  border:1.5px solid var(--bdr);display:grid;place-items:center;
  font-size:clamp(12.60px, 3.733vw, 18.00px);color:var(--tm);transition:all .14s;
}
.nav-icon:hover{background:var(--sp2);border-color:var(--sage);color:var(--g)}
.nav-cart{
  background:var(--g);color:white;
  height:36px;padding:0 14px;border-radius:var(--rp);
  font-size:clamp(12.00px, 3.467vw, 17.00px);font-weight:700;
  display:flex;align-items:center;gap:7px;
  box-shadow:0 2px 10px rgba(44,74,53,.22);
  transition:all .16s;
}
.nav-cart:hover{background:var(--text);transform:translateY(-1px)}
.cart-pill{
  background:var(--terra);color:white;
  min-width:18px;height:18px;padding:0 5px;border-radius:var(--rp);
  font-size:clamp(10.00px, 2.667vw, 14.00px);font-weight:800;display:grid;place-items:center;
}

/* ─── SECTION WRAPPER ─── */
.wrap{max-width:1360px;margin:0 auto;padding:0 20px}
@media(min-width:960px){.wrap{padding:0 48px}}

/* ─── SECTION LABEL ─── */
.sec-label{
  font-size:clamp(10.00px, 2.667vw, 14.00px);font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gl);margin-bottom:10px;
  display:flex;align-items:center;gap:8px;
}
.sec-label::before{content:'';width:14px;height:1.5px;background:var(--sage);border-radius:2px;flex-shrink:0}


/* ═══════════════════════════════════
   HERO
═══════════════════════════════════ */
.hero{
  position:relative;overflow:hidden;
  min-height:90svh;
  display:flex;flex-direction:column;
  background:
    radial-gradient(ellipse 80% 60% at 15% 10%, rgba(168,191,160,.28) 0%, transparent 65%),
    radial-gradient(ellipse 60% 50% at 85% 80%, rgba(44,74,53,.1) 0%, transparent 60%),
    linear-gradient(175deg, #e8f2e4 0%, #f2f8ef 35%, #f6f7f4 70%, #ffffff 100%);
}
/* Subtle noise */
.hero::before{
  content:'';position:absolute;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  opacity:.5;pointer-events:none;z-index:0;
}

.hero-inner{
  position:relative;z-index:1;
  max-width:1200px;margin:0 auto;padding:0 20px;
  flex:1;display:flex;flex-direction:column;
  padding-top:52px;padding-bottom:40px;
  gap:32px;
}
@media(min-width:960px){
  .hero-inner{
    flex-direction:row;align-items:center;
    padding:80px 48px 80px;gap:64px;
  }
}

/* Hero text */
.hero-text{flex:1;max-width:620px}

.hero-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  background:#E8420A;border:none;
  color:#fff;border-radius:var(--rp);
  padding:8px 18px;font-size:clamp(13px, 3.4vw, 15px);font-weight:700;
  letter-spacing:.01em;text-transform:none;
  margin-bottom:22px;
  box-shadow:0 3px 16px rgba(232,66,10,.35);
}
.hero-eyebrow-dot{
  width:6px;height:6px;border-radius:50%;background:#fff;
  animation:pulse 2.4s ease-in-out infinite;
}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.7)}}

.hero-h1{
  font-family:var(--serif);
  font-size:clamp(36px, 9vw, 72px);
  line-height:1.04;
  font-weight:600;
  color:var(--text);
  letter-spacing:-.02em;
  margin-bottom:20px;
}
.hero-h1 em{
  font-style:italic;
  color:var(--g);
  /* Subtle text texture */
  background:linear-gradient(135deg, var(--g) 0%, var(--gl) 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
}

.hero-tagline{
  font-size:clamp(15px,2vw,18px);
  font-weight:600;color:var(--g);margin-bottom:10px;
}
.hero-sub{
  font-size:clamp(15px,2.5vw,18px);
  line-height:1.7;color:var(--tm);
  margin-bottom:28px;max-width:460px;
}
.hero-sub strong{color:var(--text);font-weight:700}

/* Hero CTAs */
.hero-ctas{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:32px}
@media(max-width:640px){.hero-ctas a{width:100%;justify-content:center;text-align:center;}}
.btn-primary{
  display:inline-flex;align-items:center;gap:9px;
  background:var(--g);color:white;
  height:52px;padding:0 24px;border-radius:var(--rp);
  font-size:clamp(13.50px, 4.000vw, 19.00px);font-weight:700;letter-spacing:.02em;
  box-shadow:0 6px 20px rgba(44,74,53,.28),0 2px 6px rgba(44,74,53,.14);
  transition:all .2s;position:relative;overflow:hidden;
}
.btn-primary::before{
  content:'';position:absolute;top:0;left:-80%;width:50%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);
  transition:left .55s;
}
.btn-primary:hover::before{left:160%}
.btn-primary:hover{background:var(--text);transform:translateY(-2px);box-shadow:0 10px 28px rgba(44,74,53,.3)}
.btn-secondary{
  display:inline-flex;align-items:center;gap:8px;
  height:52px;padding:0 22px;border-radius:var(--rp);
  font-size:clamp(13.50px, 4.000vw, 19.00px);font-weight:600;color:var(--g);
  border:1.5px solid rgba(44,74,53,.2);background:rgba(255,255,255,.7);
  backdrop-filter:blur(8px);transition:all .18s;
}
.btn-secondary:hover{border-color:var(--g);background:white;box-shadow:var(--s2)}

/* Hero social proof pills */
.hero-proof{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.hp-item{
  display:flex;align-items:center;gap:6px;
  font-size:clamp(12.00px, 3.200vw, 16.00px);font-weight:600;color:var(--tm);
}
.hp-stars{color:var(--star);font-size:clamp(10.00px, 2.933vw, 15.00px);letter-spacing:.06em}
.hp-sep{width:1px;height:14px;background:var(--bdr)}

/* Hero visual — right side */
.hero-visual{
  flex-shrink:0;
  width:100%;max-width:440px;
  margin:0 auto;
}
@media(min-width:960px){.hero-visual{width:420px;margin:0}}

.hero-card-stack{position:relative;height:460px}
@media(min-width:960px){.hero-card-stack{height:520px}}


/* Main product card floating */
.hc-main{
  position:absolute;
  top:0;left:0;right:0;
  border-radius:24px;overflow:hidden;
  background:var(--w);box-shadow:var(--s3);
  border:1.5px solid var(--bdr);
  transition:transform .3s ease;
}
.hc-main:hover{transform:translateY(-6px) rotate(-0.5deg)}
.hc-img{
  aspect-ratio:1/1.1;
  background:
    radial-gradient(ellipse 70% 60% at 35% 20%, rgba(168,191,160,.4) 0%, transparent 65%),
    linear-gradient(160deg, #d4e8c8 0%, #e8f2e4 50%, #f0f5ec 100%);
  display:flex;align-items:center;justify-content:center;
  font-size:clamp(109.20px, 37.333vw, 151.20px);position:relative;overflow:hidden;
}
.hc-emoji{
  transition:transform .6s cubic-bezier(.34,1.05,.64,1);
  filter:drop-shadow(0 20px 32px rgba(26,36,24,.2));
}
.hc-main:hover .hc-emoji{transform:scale(1.06) translateY(-8px)}

/* Floating badges on card */
.hc-badge-tl{
  position:absolute;top:14px;left:14px;
  background:rgba(44,74,53,.88);color:white;
  font-size:clamp(10.00px, 2.667vw, 14.00px);font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  padding:5px 12px;border-radius:var(--rp);
  backdrop-filter:blur(8px);
}
.hc-badge-tr{
  position:absolute;top:14px;right:14px;
  background:rgba(255,255,255,.92);border:1.5px solid rgba(232,237,230,.7);
  width:38px;height:38px;border-radius:50%;
  display:grid;place-items:center;font-size:clamp(13.50px, 4.000vw, 19.00px);
  backdrop-filter:blur(4px);
}
.hc-info{padding:14px 16px 16px}
.hc-name{font-size:clamp(13.50px, 4.000vw, 19.00px);font-weight:700;color:var(--text);margin-bottom:2px}
.hc-latin{font-size:clamp(10.00px, 2.933vw, 15.00px);color:var(--tl);font-style:italic;margin-bottom:10px}
.hc-bot{display:flex;align-items:center;justify-content:space-between}
.hc-price{font-size:clamp(18.00px, 5.867vw, 28.00px);font-weight:800;color:var(--text);letter-spacing:-.02em}
.hc-was{font-size:clamp(12.00px, 3.467vw, 17.00px);color:var(--tl);text-decoration:line-through;margin-left:6px;font-weight:500}
.hc-add{
  width:38px;height:38px;border-radius:50%;
  background:var(--g);color:white;font-size:clamp(14.00px, 4.800vw, 24.00px);
  display:grid;place-items:center;
  box-shadow:0 4px 12px rgba(44,74,53,.3);
  transition:all .17s;
}
.hc-add:hover{background:var(--text);transform:scale(1.1)}

/* Floating mini cards */
.hc-float{
  position:absolute;
  border-radius:16px;background:var(--w);
  box-shadow:var(--s2);border:1.5px solid var(--bdr);
  padding:10px 13px;
  animation:float 6s ease-in-out infinite;
}
.hc-float-a{
  bottom:80px;right:-10px;
  width:140px;
  animation-delay:0s;
}
.hc-float-b{
  bottom:10px;left:-10px;
  width:160px;
  animation-delay:3s;
}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.hf-title{font-size:clamp(10.00px, 2.933vw, 15.00px);font-weight:700;color:var(--text);margin-bottom:3px}
.hf-stars{color:var(--star);font-size:clamp(10.00px, 2.667vw, 14.00px);letter-spacing:.06em}
.hf-sub{font-size:clamp(10.00px, 2.667vw, 14.00px);color:var(--tl);margin-top:2px}
.hf-icon{font-size:clamp(16.00px, 5.333vw, 26.00px);margin-bottom:4px}
.hf-green{color:var(--gl);font-size:clamp(10.00px, 2.667vw, 14.00px);font-weight:700}

/* ─── TRUST BAR ─── */
.trust-bar{
  background:var(--g);overflow:hidden;
}

/* ── Desktop layout ── */
.trust-bar-desktop{
  display:none;
  max-width:1360px;margin:0 auto;padding:14px 20px;
  align-items:center;justify-content:center;
  gap:24px;flex-wrap:wrap;
}
@media(min-width:640px){
  .trust-bar-desktop{display:flex}
  .trust-bar-ticker{display:none}
}

.tb-item{
  display:flex;align-items:center;gap:7px;
  color:rgba(255,255,255,.85);font-size:clamp(12.00px, 3.200vw, 16.00px);font-weight:600;
  white-space:nowrap;
}
.tb-item-icon{font-size:14px}
.tb-item b{color:white}
.tb-div{width:1px;height:14px;background:rgba(255,255,255,.15);display:none}
@media(min-width:640px){.tb-div{display:block}}

/* ── Mobiel ticker ── */
.trust-bar-ticker{
  padding:11px 0;
  overflow:hidden;
  width:100%;
}
.ticker-track{
  display:flex;align-items:center;gap:0;
  width:max-content;
  animation:ticker-scroll 28s linear infinite;
}
.ticker-track:hover{animation-play-state:paused}
.ticker-item{
  display:inline-flex;align-items:center;gap:6px;
  color:rgba(255,255,255,.9);font-size:13px;font-weight:600;
  white-space:nowrap;padding:0 4px;
}
.ticker-item b{color:#fff;font-weight:700}
.ticker-dot{
  color:rgba(255,255,255,.3);font-size:18px;padding:0 14px;
  flex-shrink:0;
}
@keyframes ticker-scroll{
  0%  {transform:translateX(0)}
  100%{transform:translateX(-50%)}
}


/* ═══════════════════════════════════
   CATEGORIES
═══════════════════════════════════ */
.categories{padding:56px 0}
.categories-hd{margin-bottom:24px}
.categories-hd h2{
  font-family:var(--serif);font-size:clamp(24px,4vw,36px);
  font-weight:600;line-height:1.15;color:var(--text);
}
.categories-hd h2 em{font-style:italic;color:var(--g)}

.cat-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:10px;
}
@media(max-width:520px){.cat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}}
@media(min-width:640px){.cat-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:960px){.cat-grid{grid-template-columns:repeat(6,1fr);gap:12px}}
@media(min-width:1024px){
  .cat-grid{
    grid-template-columns:repeat(7,1fr)!important;
    flex-wrap:nowrap!important;
  }
  .cat .cat-name{
    font-size:clamp(11px, 1.1vw, 15px);
  }
}

.cat{
  border-radius:var(--rl);overflow:hidden;
  border:1.5px solid var(--bdr);background:var(--w);
  cursor:pointer;transition:all .22s;
  display:flex;flex-direction:column;
}
.cat:hover{box-shadow:var(--s2);transform:translateY(-4px);border-color:var(--sage)}
.cat-img{
  aspect-ratio:1/1;
  display:flex;align-items:center;justify-content:center;
  font-size:clamp(35.20px, 11.733vw, 49.28px);transition:transform .3s cubic-bezier(.34,1.2,.64,1);
}
.cat:hover .cat-img-em{transform:scale(1.15) translateY(-4px)}
.cat-img-em{display:block;transition:transform .3s cubic-bezier(.34,1.2,.64,1)}
.cat-body{padding:10px 12px 13px;flex:1;display:flex;flex-direction:column}
.cat-name{font-size:clamp(12.00px, 3.467vw, 17.00px);font-weight:700;color:var(--text);margin-bottom:2px}
.cat-ct{font-size:clamp(10.00px, 2.933vw, 15.00px);color:var(--tl)}
.cat-arrow{
  margin-top:auto;padding-top:8px;
  font-size:clamp(10.00px, 2.933vw, 15.00px);font-weight:700;color:var(--gl);
  display:flex;align-items:center;gap:4px;
}

/* ═══════════════════════════════════
   BESTSELLERS
═══════════════════════════════════ */
.bestsellers{padding:56px 0;background:var(--off)}

.section-hd{
  display:flex;align-items:flex-end;justify-content:space-between;
  margin-bottom:24px;flex-wrap:wrap;gap:12px;
}
.section-hd-left h2{
  font-family:var(--serif);font-size:clamp(24px,4vw,36px);
  font-weight:600;line-height:1.15;color:var(--text);
}
.section-hd-left h2 em{font-style:italic;color:var(--g)}
.section-hd-left p{font-size:clamp(12.60px, 3.733vw, 18.00px);color:var(--tl);margin-top:4px}
.see-all{
  font-size:clamp(12.00px, 3.467vw, 17.00px);font-weight:700;color:var(--gl);
  border-bottom:1px solid rgba(92,122,78,.25);
  padding-bottom:1px;white-space:nowrap;flex-shrink:0;
  transition:color .14s;
}
.see-all:hover{color:var(--g)}

/* Product cards */
.prod-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
}
@media(min-width:640px){.prod-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:960px){.prod-grid{grid-template-columns:repeat(4,1fr);gap:16px}}

.pc{
  border-radius:var(--rl);background:var(--w);
  border:1.5px solid var(--bdr);overflow:hidden;
  cursor:pointer;transition:all .22s;
  display:flex;flex-direction:column;
}
.pc:hover{box-shadow:var(--s3);transform:translateY(-5px);border-color:var(--sage)}
.pc-img{
  aspect-ratio:1/1.05;
  display:flex;align-items:center;justify-content:center;
  font-size:clamp(49.92px, 17.067vw, 69.12px);position:relative;overflow:hidden;
}
.pc-em{
  transition:transform .35s cubic-bezier(.34,1.2,.64,1);
  filter:drop-shadow(0 8px 16px rgba(26,36,24,.12));
}
.pc:hover .pc-em{transform:scale(1.1) translateY(-5px)}

/* Badges on card */
.pc-badges{position:absolute;top:10px;left:10px;display:flex;flex-direction:column;gap:4px}
.pc-badge{
  font-size:clamp(10.00px, 2.400vw, 13.00px);font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  padding:3px 9px;border-radius:var(--rp);line-height:1.4;
}
.pc-badge--sale{background:#E8855A;color:white}
.pc-badge--new{background:var(--terra);color:white}
.pc-badge--best{background:var(--g);color:white}

.pc-body{padding:12px 14px 14px;flex:1;display:flex;flex-direction:column}
.pc-name{font-size:clamp(12.60px, 3.733vw, 18.00px);font-weight:700;color:var(--text);margin-bottom:1px;line-height:1.3}
.pc-latin{font-size:clamp(10.00px, 2.933vw, 15.00px);color:var(--tl);font-style:italic;margin-bottom:7px}
.pc-stars{display:flex;align-items:center;gap:4px;margin-bottom:9px}
.pc-stars-i{color:var(--star);font-size:11px}
.pc-stars-ct{font-size:clamp(10.00px, 2.933vw, 15.00px);color:var(--tl)}
.pc-bot{display:flex;align-items:center;justify-content:space-between;margin-top:auto}
.pc-price{display:flex;align-items:baseline;gap:5px}
.pc-now{font-size:clamp(14.00px, 4.800vw, 24.00px);font-weight:800;color:var(--text);letter-spacing:-.01em}
.pc-was{font-size:clamp(12.00px, 3.200vw, 16.00px);color:var(--tl);text-decoration:line-through;font-weight:500}
.pc-add{
  width:32px;height:32px;border-radius:50%;
  background:var(--g);color:white;font-size:clamp(15.30px, 4.533vw, 21.00px);
  display:grid;place-items:center;
  box-shadow:0 3px 10px rgba(44,74,53,.25);
  transition:all .16s;flex-shrink:0;
}
.pc-add:hover{background:var(--terra);transform:scale(1.12)}

/* Delivery chip on card */
.pc-ship{
  display:flex;align-items:center;gap:4px;
  font-size:clamp(10.00px, 2.667vw, 14.00px);font-weight:700;color:var(--gl);
  margin-bottom:8px;
}
.pc-ship::before{content:'🚚';font-size:10px}


/* ═══════════════════════════════════
   NOAH & TON STORY
═══════════════════════════════════ */
.story{
  padding:64px 0;
  background:var(--g);
  position:relative;overflow:hidden;
}
/* Subtle leaf pattern */
.story::before{
  content:'🌿';
  position:absolute;right:-40px;top:20px;
  font-size:clamp(218.40px, 74.667vw, 302.40px);opacity:.06;
  transform:rotate(20deg);pointer-events:none;
  line-height:1;
}
.story::after{
  content:'🌿';
  position:absolute;left:-60px;bottom:-20px;
  font-size:clamp(187.20px, 64.000vw, 259.20px);opacity:.04;
  transform:rotate(-30deg) scaleX(-1);pointer-events:none;
}
.story-in{
  position:relative;z-index:1;
  display:flex;flex-direction:column;gap:40px;
}
@media(min-width:960px){
  .story-in{flex-direction:row;align-items:center;gap:80px}
}

/* Visual side */
.story-visual{flex-shrink:0;width:100%}
@media(min-width:960px){.story-visual{width:420px}}
.story-photo-wrap{
  border-radius:24px;overflow:hidden;
  aspect-ratio:4/3.2;
  background:
    radial-gradient(ellipse 70% 60% at 30% 25%, rgba(168,191,160,.25) 0%,transparent 65%),
    linear-gradient(155deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,.05) 100%);
  border:1px solid rgba(255,255,255,.12);
  display:flex;align-items:center;justify-content:center;
  position:relative;
}
.story-emoji{font-size:clamp(78.00px, 26.667vw, 108.00px);filter:drop-shadow(0 16px 28px rgba(0,0,0,.2))}
.story-caption{
  position:absolute;bottom:14px;left:14px;right:14px;
  background:rgba(0,0,0,.35);backdrop-filter:blur(10px);
  border-radius:10px;padding:10px 14px;
  font-size:clamp(10.00px, 2.933vw, 15.00px);color:rgba(255,255,255,.85);font-style:italic;
  font-family:var(--serif);line-height:1.5;
  border:1px solid rgba(255,255,255,.08);
}

/* Story stats */
.story-stats{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:rgba(255,255,255,.1);
  border-radius:14px;overflow:hidden;margin-top:14px;
}
.st-stat{
  background:rgba(255,255,255,.06);
  padding:14px 10px;text-align:center;
}
.st-num{font-size:clamp(20.00px, 6.400vw, 30.00px);font-weight:800;color:white;line-height:1;display:block;margin-bottom:2px}
.st-label{font-size:clamp(10.00px, 2.667vw, 14.00px);color:rgba(168,191,160,.8);font-weight:600;letter-spacing:.04em}

/* Text side */
.story-text{flex:1;color:white}
.story-eyebrow{
  font-size:clamp(10.00px, 2.667vw, 14.00px);font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(168,191,160,.8);margin-bottom:14px;
  display:flex;align-items:center;gap:8px;
}
.story-eyebrow::before{content:'';width:14px;height:1.5px;background:rgba(168,191,160,.5);border-radius:2px;flex-shrink:0}
.story-h2{
  font-family:var(--serif);
  font-size:clamp(26px,4vw,42px);
  font-weight:600;line-height:1.1;
  color:white;margin-bottom:18px;
  letter-spacing:-.01em;
}
.story-h2 em{
  font-style:italic;
  color:rgba(168,191,160,.9);
}
.story-p{
  font-size:clamp(13.50px, 4.000vw, 19.00px);line-height:1.8;
  color:rgba(255,255,255,.75);margin-bottom:14px;
}
.story-p strong{color:white;font-weight:700}
.story-quote{
  border-left:2.5px solid rgba(168,191,160,.4);
  padding:12px 0 12px 18px;margin:20px 0;
  font-family:var(--serif);font-style:italic;
  font-size:clamp(14.40px, 4.267vw, 20.00px);color:rgba(255,255,255,.85);line-height:1.65;
}
.story-quote cite{
  display:block;margin-top:8px;
  font-size:clamp(10.00px, 2.933vw, 15.00px);font-style:normal;
  color:rgba(168,191,160,.7);font-family:var(--sans);font-weight:700;letter-spacing:.04em;
}
.story-cta{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.2);
  color:white;height:46px;padding:0 22px;border-radius:var(--rp);
  font-size:clamp(12.60px, 3.733vw, 18.00px);font-weight:700;
  transition:all .18s;backdrop-filter:blur(4px);
}
.story-cta:hover{background:rgba(255,255,255,.2);transform:translateY(-1px)}


/* ═══════════════════════════════════
   SOCIAL PROOF
═══════════════════════════════════ */
.social{padding:56px 0}

.review-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  margin-top:24px;
}
@media(min-width:640px){.review-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:960px){.review-grid{grid-template-columns:repeat(3,1fr);gap:16px}}

/* Big score card */
.score-card{
  background:var(--g);border-radius:var(--rl);
  padding:28px 24px;
  display:flex;flex-direction:column;justify-content:space-between;
  min-height:180px;
}
.sc-score{font-size:clamp(49.92px, 17.067vw, 69.12px);font-weight:800;color:white;line-height:1;letter-spacing:-.03em}
.sc-stars{color:var(--star);font-size:clamp(14.00px, 4.800vw, 24.00px);margin:6px 0}
.sc-ct{font-size:clamp(12.00px, 3.467vw, 17.00px);color:rgba(168,191,160,.8);font-weight:600}
.sc-bars{margin-top:14px;display:flex;flex-direction:column;gap:4px}
.scb-row{display:flex;align-items:center;gap:6px}
.scb-lbl{font-size:clamp(10.00px, 2.667vw, 14.00px);color:rgba(255,255,255,.5);width:8px;text-align:right}
.scb-track{flex:1;height:4px;background:rgba(255,255,255,.1);border-radius:2px;overflow:hidden}
.scb-fill{height:100%;border-radius:2px;background:var(--star)}

/* Review cards */
.rv{
  background:var(--w);border:1.5px solid var(--bdr);
  border-radius:var(--rl);padding:20px;
  transition:box-shadow .2s;
}
.rv:hover{box-shadow:var(--s2)}
.rv-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.rv-stars{color:var(--star);font-size:clamp(12.00px, 3.467vw, 17.00px);letter-spacing:.06em}
.rv-verified{
  font-size:clamp(10.00px, 2.400vw, 13.00px);font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:#2E7D32;background:#E8F5E9;padding:2px 8px;border-radius:var(--rp);
}
.rv-title{font-size:clamp(12.60px, 3.733vw, 18.00px);font-weight:700;color:var(--text);margin-bottom:7px;line-height:1.3}
.rv-body{
  font-size:clamp(12.00px, 3.467vw, 17.00px);line-height:1.7;color:var(--tm);margin-bottom:14px;
}
.rv-body em{
  font-style:italic;font-family:var(--serif);font-size:clamp(12.60px, 3.733vw, 18.00px);color:var(--g);
}
.rv-foot{display:flex;align-items:center;gap:8px}
.rv-av{
  width:28px;height:28px;border-radius:50%;
  background:var(--sp);display:grid;place-items:center;
  font-size:clamp(12.00px, 3.200vw, 16.00px);font-weight:800;color:var(--g);flex-shrink:0;
}
.rv-name{font-size:clamp(12.00px, 3.200vw, 16.00px);font-weight:700;color:var(--text)}
.rv-date{font-size:clamp(10.00px, 2.933vw, 15.00px);color:var(--tl)}
.rv-product{font-size:clamp(10.00px, 2.667vw, 14.00px);font-weight:700;color:var(--gl);margin-left:auto}


/* ═══════════════════════════════════
   USPs — WAAROM PLANT TODAY
═══════════════════════════════════ */
.usps{padding:64px 0;background:var(--off)}
.usps-hd{margin-bottom:32px}
.usps-hd h2{
  font-family:var(--serif);font-size:clamp(24px,4vw,38px);
  font-weight:600;color:var(--text);line-height:1.15;
}
.usps-hd h2 em{font-style:italic;color:var(--g)}
.usps-hd p{font-size:clamp(12.60px, 3.733vw, 18.00px);color:var(--tl);margin-top:6px;max-width:500px}

.usp-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
@media(min-width:640px){.usp-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:960px){.usp-grid{grid-template-columns:repeat(4,1fr);gap:16px}}

.usp{
  background:var(--w);border:1.5px solid var(--bdr);
  border-radius:var(--rl);padding:22px 20px;
  transition:all .2s;
}
.usp:hover{border-color:var(--sage);box-shadow:var(--s2);transform:translateY(-3px)}
.usp-icon{
  width:46px;height:46px;border-radius:12px;
  background:var(--sp);display:grid;place-items:center;
  font-size:clamp(18.00px, 5.867vw, 28.00px);margin-bottom:14px;
  transition:transform .25s cubic-bezier(.34,1.4,.64,1);
}
.usp:hover .usp-icon{transform:scale(1.1) rotate(-5deg)}
.usp-title{font-size:clamp(13.50px, 4.000vw, 19.00px);font-weight:700;color:var(--text);margin-bottom:7px;line-height:1.3}
.usp-body{font-size:clamp(12.00px, 3.467vw, 17.00px);line-height:1.65;color:var(--tm)}
.usp-body strong{color:var(--g);font-weight:700}

/* Comparison strip */
.vs-strip{
  margin-top:32px;
  border:1.5px solid var(--bdr);border-radius:var(--rl);overflow:hidden;
  background:var(--w);
}
.vs-header{
  display:grid;grid-template-columns:1fr 1fr 1fr;
  background:var(--g);
}
.vs-col-hd{
  padding:12px 16px;text-align:center;
  font-size:clamp(12.00px, 3.200vw, 16.00px);font-weight:700;color:white;letter-spacing:.04em;
}
.vs-col-hd.mid{
  background:rgba(255,255,255,.1);border-left:1px solid rgba(255,255,255,.1);border-right:1px solid rgba(255,255,255,.1);
}
.vs-col-hd span{font-style:italic;font-family:var(--serif);font-size:14px}
.vs-row{
  display:grid;grid-template-columns:1fr 1fr 1fr;
  border-bottom:1px solid var(--bdr);
}
.vs-row:last-child{border-bottom:none}
.vs-cell{
  padding:11px 14px;font-size:clamp(12.00px, 3.200vw, 16.00px);text-align:center;color:var(--tm);
  display:flex;align-items:center;justify-content:center;gap:4px;
}
.vs-cell.mid{background:var(--sp2);border-left:1px solid var(--bdr);border-right:1px solid var(--bdr);font-weight:700;color:var(--g)}
.vs-check{color:#2E7D32;font-size:clamp(12.60px, 3.733vw, 18.00px);font-weight:900}
.vs-cross{color:#B71C1C;font-size:14px}
.vs-maybe{color:var(--tl);font-size:14px}

@media (max-width: 749px) {
  .vs-strip {
    border-radius:var(--r);
  }
  .vs-header {
    grid-template-columns:repeat(3,1fr);
  }
  .vs-col-hd {
    padding:10px 8px;
    font-size:13px;
    line-height:1.3;
    letter-spacing:.03em;
  }
  .vs-col-hd span {
    font-size:13px;
  }
  .vs-row {
    grid-template-columns:repeat(3,1fr);
  }
  .vs-cell {
    padding:6px 8px;
    font-size:12px;
    line-height:1.35;
    gap:6px;
    text-align:center;
    white-space:normal;
  }
  .vs-cell.mid {
    font-size:12px;
  }
  .vs-check,
  .vs-cross,
  .vs-maybe {
    font-size:12px;
    line-height:1;
  }
}


/* ═══════════════════════════════════
   TRUST BADGES INLINE
═══════════════════════════════════ */
.pt-inline-trust{
  padding:56px 0;
  background:var(--w);
}
.pt-inline-trust-head{
  text-align:center;
  max-width:640px;
  margin:0 auto 32px;
}
.pt-inline-trust-head h2{
  font-family:var(--serif);
  font-size:clamp(24px,4vw,36px);
  font-weight:600;
  color:var(--text);
  line-height:1.2;
}
.pt-inline-trust-head h2 em{font-style:italic;color:var(--g)}
.pt-inline-trust-head p{
  font-size:clamp(12.60px, 3.733vw, 18.00px);
  color:var(--tm);
  line-height:1.7;
  margin-top:8px;
}
.pt-inline-trust-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:12px;
}
.pt-inline-trust-card{
  border:1.5px solid var(--bdr);
  border-radius:var(--rl);
  padding:18px 16px;
  background:var(--sp);
  display:flex;
  gap:12px;
  align-items:flex-start;
  box-shadow:var(--s1);
}
.pt-inline-trust-icon{
  width:40px;height:40px;
  border-radius:12px;
  background:var(--w);
  display:grid;place-items:center;
  font-size:clamp(16.00px, 5.333vw, 26.00px);
  color:var(--g);
  flex-shrink:0;
}
.pt-inline-trust-title{
  font-size:clamp(12.60px, 3.733vw, 18.00px);
  font-weight:700;
  color:var(--text);
  margin-bottom:4px;
}
.pt-inline-trust-desc{
  font-size:clamp(12.00px, 3.200vw, 16.00px);
  line-height:1.6;
  color:var(--tm);
}
@media(max-width:640px){
  .pt-inline-trust{
    padding:48px 0;
  }
  .pt-inline-trust-grid{
    display:flex;
    overflow-x:auto;
    gap:10px;
    padding-bottom:6px;
    scroll-snap-type:x mandatory;
  }
  .pt-inline-trust-card{
    min-width:260px;
    scroll-snap-align:start;
  }
}

/* ═══════════════════════════════════
   FINAL CTA BAND
═══════════════════════════════════ */
.cta-band{
  padding:64px 0;
  background:
    radial-gradient(ellipse 70% 60% at 20% 30%, rgba(168,191,160,.25) 0%,transparent 65%),
    radial-gradient(ellipse 50% 50% at 80% 70%, rgba(44,74,53,.08) 0%,transparent 60%),
    linear-gradient(170deg, #e8f2e4 0%, #f6f7f4 60%, #ffffff 100%);
  position:relative;overflow:hidden;
}
.cta-band::before{
  content:'🌿';position:absolute;right:-20px;bottom:-20px;
  font-size:clamp(156.00px, 53.333vw, 216.00px);opacity:.06;pointer-events:none;
  transform:rotate(15deg);
}
.cta-band-in{
  position:relative;z-index:1;
  text-align:center;max-width:640px;margin:0 auto;
}
.cta-band-label{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(232,66,10,.08);border:1px solid rgba(232,66,10,.2);
  color:#E8420A;border-radius:var(--rp);
  padding:5px 13px;font-size:clamp(10.00px, 2.933vw, 15.00px);font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;margin-bottom:18px;
}
.cta-band h2{
  font-family:var(--serif);
  font-size:clamp(28px,5vw,48px);
  font-weight:600;line-height:1.1;
  color:var(--text);margin-bottom:14px;
  letter-spacing:-.01em;
}
.cta-band h2 em{font-style:italic;color:var(--g)}
.cta-band p{font-size:clamp(13.50px, 4.000vw, 19.00px);line-height:1.7;color:var(--tm);margin-bottom:28px}
.cta-band-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.cta-countdown{
  margin-top:16px;
  font-size:clamp(12.00px, 3.467vw, 17.00px);font-weight:600;color:var(--tm);
  display:flex;align-items:center;justify-content:center;gap:7px;
}
.cta-countdown-dot{width:7px;height:7px;border-radius:50%;background:#4CAF50;animation:pulse 2.4s ease-in-out infinite}
.cta-countdown b{color:var(--g);font-variant-numeric:tabular-nums}


/* ═══════════════════════════════════
   FOOTER
═══════════════════════════════════ */
footer{background:var(--text);color:rgba(255,255,255,.6);padding:48px 0 24px}
.footer-in{
  max-width:1360px;margin:0 auto;padding:0 20px;
}
@media(min-width:960px){.footer-in{padding:0 48px}}
.footer-top{
  display:grid;grid-template-columns:1fr;gap:32px;
  margin-bottom:40px;
}
@media(min-width:640px){.footer-top{grid-template-columns:1.5fr 1fr 1fr}}
@media(min-width:960px){.footer-top{grid-template-columns:2fr 1fr 1fr 1fr}}

.footer-brand .logo{margin-bottom:14px}
.footer-brand .logo-plant{color:white}
.footer-brand .logo-today{color:rgba(168,191,160,.8)}
.footer-brand .logo-mark{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15)}
.footer-brand p{font-size:clamp(12.00px, 3.467vw, 17.00px);line-height:1.7;color:rgba(255,255,255,.5);max-width:260px}
.footer-brand-links{display:flex;gap:8px;margin-top:16px}
.footer-social{
  width:34px;height:34px;border-radius:50%;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);
  display:grid;place-items:center;font-size:clamp(12.60px, 3.733vw, 18.00px);
  transition:background .14s;
}
.footer-social:hover{background:rgba(255,255,255,.12)}

.footer-col h4{font-size:clamp(12.00px, 3.200vw, 16.00px);font-weight:700;color:white;letter-spacing:.06em;text-transform:uppercase;margin-bottom:14px}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:8px}
.footer-col ul li a{font-size:clamp(12.00px, 3.467vw, 17.00px);color:rgba(255,255,255,.5);transition:color .14s}
.footer-col ul li a:hover{color:rgba(255,255,255,.9)}

.footer-bottom{
  border-top:1px solid rgba(255,255,255,.07);
  padding-top:20px;
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;
}
.footer-bottom p{font-size:clamp(12.00px, 3.200vw, 16.00px);color:rgba(255,255,255,.3)}
.footer-kiyoh{
  display:flex;align-items:center;gap:7px;
  font-size:clamp(12.00px, 3.200vw, 16.00px);color:rgba(255,255,255,.4);
}
.footer-kiyoh-score{font-weight:800;color:white;font-size:14px}
.footer-kiyoh-stars{color:var(--star);font-size:11px}


/* ─── MOBILE STICKY SHOP BAR ─── */
.mob-shop-bar{
  display:flex;
  position:fixed;bottom:0;left:0;right:0;z-index:200;
  background:rgba(255,255,255,.96);border-top:1px solid var(--bdr);
  padding:10px 16px;padding-bottom:calc(10px + env(safe-area-inset-bottom));
  gap:10px;align-items:center;
  box-shadow:0 -4px 20px rgba(26,36,24,.1);
  backdrop-filter:blur(12px);
}
@media(min-width:960px){.mob-shop-bar{display:none}}
.msb-text{font-size:clamp(12.00px, 3.200vw, 16.00px);color:var(--tm);font-weight:600;flex:1;line-height:1.3}
.msb-text b{color:var(--text);display:block;font-size:13px}
.msb-btn{
  background:var(--g);color:white;
  height:44px;padding:0 20px;border-radius:var(--rp);
  font-size:clamp(12.60px, 3.733vw, 18.00px);font-weight:700;
  display:flex;align-items:center;gap:7px;flex-shrink:0;
  box-shadow:0 4px 14px rgba(44,74,53,.28);
}


/* ─── SCROLL REVEAL ─── */
@keyframes reveal{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.reveal{opacity:0;animation:reveal .6s ease both}
.reveal-d1{animation-delay:.05s}
.reveal-d2{animation-delay:.12s}
.reveal-d3{animation-delay:.19s}
.reveal-d4{animation-delay:.26s}
.reveal-d5{animation-delay:.33s}
.reveal-d6{animation-delay:.40s}
.hero-text,.hero-visual{animation:reveal .7s ease both}
.hero-visual{animation-delay:.15s}

@media (min-width: 768px) {
  .hero {
    min-height: unset !important;
    height: auto !important;
    padding-top: 80px !important;
    padding-bottom: 80px !important;
    display: flex;
    align-items: center;
  }

  .hero-inner {
    min-height: auto;
  }
}


/* ═══════════════════════════════════
   MOBILE-FIRST FIXES — hero & layout
   Breakpoint ≤959px
═══════════════════════════════════ */
@media (max-width: 959px) {

  /* Hero: don't force 90vh on mobile — allow natural height */
  .hero {
    min-height: auto;
  }
  .hero-inner {
    flex-direction: column;
    padding-top: 48px;
    padding-bottom: 40px;
    gap: 24px;
  }

  /* Hero text: full width, center on mobile */
  .hero-text {
    max-width: 100%;
    text-align: center;
  }
  .hero-eyebrow { margin-left: auto; margin-right: auto; }
  .hero-h1 { font-size: clamp(32px, 8vw, 48px); }
  .hero-sub { max-width: 100%; }
  .hero-proof { justify-content: center; }
  .hero-ctas { justify-content: center; }
  .hero-ctas a { max-width: 280px; }

  /* Hero visual: smaller + centered */
  .hero-visual {
    width: 100%;
    max-width: 360px;
    margin: 0 auto;
  }

  /* Card stack: reduce height */
  .hero-card-stack {
    height: 340px;
  }

  /* Floating mini cards: reposition to fit smaller stack */
  .hc-float-a {
    right: 0px;
    bottom: 60px;
    width: 130px;
    font-size: 12px;
  }
  .hc-float-b {
    left: 0px;
    bottom: 0px;
    width: 148px;
    font-size: 12px;
  }

  /* Category grid: 2 columns on mobile */
  .cat-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }

  /* USP grid: 2 columns on mobile */
  .usp-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  /* Reviews: single column */
  .reviews-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  /* Product grid: 2 columns on mobile */
  .pt-product-grid,
  .products-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }

  /* Compare table: hide on mobile, show stacked version */
  .vs-table { font-size: 12px; }
  .vs-head, .vs-row { display: grid; grid-template-columns: 1fr 1fr 1fr; }

  /* Trust band: 2 items per row */
  .trust-bar-in {
    gap: 12px;
    justify-content: flex-start;
    padding: 0 4px;
  }
  .tb-div { display: none; }

  /* Sections: reduce vertical padding */
  .cat-section,
  .usp-section,
  .reviews-section,
  .products-section,
  .pt-inline-trust {
    padding-top: 40px;
    padding-bottom: 40px;
  }

  /* Section headings: smaller on mobile */
  .section-head h2,
  .usp-head h2 {
    font-size: clamp(22px, 6vw, 32px);
  }

  /* Mobile sticky shop bar: ensure safe area */
  .mob-shop-bar {
    display: flex;
  }
}

/* Extra small phones */
@media (max-width: 400px) {
  .hero-h1 { font-size: 28px; }
  .hero-card-stack { height: 300px; }
  .hc-float-a { display: none; }
  .hc-float-b { display: none; }
  .cat-grid { grid-template-columns: repeat(2, 1fr); }
}