/* ==========================================================================
   Eat Better Meals - chef-cooked meal delivery, Long Island NY
   Palette: warm cream + deep herb green + terracotta. Fresh editorial.
   Display: Newsreader (variable opsz/wght). Text: Hanken Grotesk (variable).
   ========================================================================== */

/* ---------- fonts ---------- */
@font-face{font-family:'Newsreader';font-style:normal;font-weight:300 700;font-display:swap;
  src:url('/assets/fonts/newsreader-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Newsreader';font-style:normal;font-weight:300 700;font-display:swap;
  src:url('/assets/fonts/newsreader-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Newsreader';font-style:italic;font-weight:300 600;font-display:swap;
  src:url('/assets/fonts/newsreader-italic-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+FEFF,U+FFFD;}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400 700;font-display:swap;
  src:url('/assets/fonts/hanken-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400 700;font-display:swap;
  src:url('/assets/fonts/hanken-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
/* metric-matched fallbacks so the swap does not reflow */
@font-face{font-family:'Hanken Fallback';src:local('Arial'),local('Helvetica Neue'),local('Roboto'),local('Liberation Sans');size-adjust:97%;ascent-override:99%;descent-override:29%;line-gap-override:0%;}
@font-face{font-family:'Newsreader Fallback';src:local('Georgia'),local('Noto Serif'),local('Liberation Serif'),local('Times New Roman');size-adjust:98%;ascent-override:96%;descent-override:26%;line-gap-override:0%;}

/* ---------- tokens ---------- */
:root{
  /* primitives */
  --c-paper:#FBF7EF;
  --c-paper-2:#F4ECDC;
  --c-paper-3:#EADFC9;
  --c-herb:#14562C;
  --c-herb-2:#1E7038;
  --c-herb-3:#0C3B1D;
  --c-herb-4:#083016;
  --c-leaf:#2C8A45;
  --c-leaf-lite:#8FD79B;
  --c-terra:#C6552F;
  --c-terra-deep:#A8431F;
  --c-terra-lite:#E79366;
  --c-ink:#23281C;
  --c-ink-2:#55604B;

  /* semantic */
  --surface:var(--c-paper);
  --surface-alt:var(--c-paper-2);
  --surface-deep:var(--c-herb);
  --text:var(--c-ink);
  --text-muted:var(--c-ink-2);
  --text-invert:#FCF8F0;
  --text-invert-muted:#CFDBC8;
  --accent:var(--c-terra);
  --accent-text:var(--c-terra-deep);
  --accent-invert:var(--c-terra-lite);
  --green-text:#1a6a33;
  /* vivid lime-green sampled from the client logo, tuned for contrast */
  --c-pop:#3F7F12;        /* headline accent on light grounds  (4.5:1 on cream) */
  --c-pop-v:#63B01A;      /* vivid underline / decoration      */
  --c-pop-lite:#A8E86A;   /* headline accent on dark grounds   */
  --line:rgba(35,40,28,.16);
  --line-soft:rgba(35,40,28,.09);
  --line-invert:rgba(252,248,240,.20);

  /* component */
  --btn-radius:999px;
  --card-radius:20px;
  --shadow-1:0 1px 2px rgba(20,40,20,.05),0 6px 18px rgba(20,40,20,.06);
  --shadow-2:0 2px 4px rgba(20,40,20,.06),0 18px 44px rgba(20,40,20,.11);
  --shadow-3:0 30px 70px rgba(12,40,20,.20);

  --pad-section:clamp(3.25rem,4.6vw,5.25rem);
  --gap-head:1.1rem;
  --container:1240px;
  --t-fast:140ms;--t-base:240ms;--t-slow:420ms;
  --ease-out:cubic-bezier(.16,.84,.44,1);
  --ease-io:cubic-bezier(.65,.05,.36,1);
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--c-herb-4);
  scroll-padding-top:126px}
body{margin:0;background:var(--surface);color:var(--text);
  font-family:'Hanken Grotesk','Hanken Fallback',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:clamp(1rem,.97rem + .15vw,1.125rem);line-height:1.65;
  font-synthesis-weight:none;-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
button{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:'Newsreader','Newsreader Fallback',Georgia,serif;font-weight:600;
  text-wrap:balance;margin:0;letter-spacing:-.018em}
h1{font-size:clamp(2.5rem,1.55rem + 3.4vw,4.6rem);line-height:1.05;letter-spacing:-.028em;
  font-variation-settings:'opsz' 72}
h2{font-size:clamp(1.95rem,1.4rem + 1.9vw,3.15rem);line-height:1.12;letter-spacing:-.022em;
  font-variation-settings:'opsz' 48}
h3{font-size:clamp(1.35rem,1.15rem + .9vw,1.9rem);line-height:1.22;
  font-variation-settings:'opsz' 30}
h4{font-size:1.0625rem;line-height:1.35;font-variation-settings:'opsz' 18}
p{margin:0 0 1.1em}
h2+p,h2+ul,h2+ol,h2+.lede,h3+p,h3+ul,h3+ol,h4+p{margin-top:var(--gap-head)}
h2{margin-bottom:var(--gap-head)}h3{margin-bottom:.8rem}h4{margin-bottom:.55rem}
ul,ol{margin:0 0 1.1em;padding-left:1.15em}
li{margin:0 0 .45em}
strong{font-weight:700}
em{font-style:italic}
/* accent word in a headline: vivid color + a highlighter sweep that animates in.
   Uses background layers (not pseudo-elements) so the accent can wrap across lines. */
h1 .hl,h2 .hl,h3 .hl,.hl{font-style:italic;font-weight:600;color:var(--c-pop);
  padding-inline:.06em;border-radius:.16em;
  background-repeat:no-repeat;
  background-image:linear-gradient(90deg,var(--c-pop-v),#9FE058),
                   linear-gradient(96deg,rgba(99,176,26,.20),rgba(159,224,88,.30));
  background-position:0 97%,0 88%;
  background-size:0% .085em,0% .36em;
  transition:background-size .85s var(--ease-out) .12s}
.hl[data-lit]{background-size:100% .085em,100% .36em}
.t-herb .hl,.cta-panel .hl,.ftr .hl,.hero .hl,.phero .hl{color:var(--c-pop-lite);
  background-image:linear-gradient(90deg,var(--c-pop-lite),#D6F5A8),
                   linear-gradient(96deg,rgba(168,232,106,.20),rgba(214,245,168,.28))}
@media(prefers-reduced-motion:reduce){
  h1 .hl,h2 .hl,h3 .hl,.hl{transition:none !important;
    background-size:100% .085em,100% .36em !important}}
::selection{background:var(--c-terra);color:#fff}
:focus-visible{outline:3px solid var(--c-terra);outline-offset:3px;border-radius:4px}
:target{scroll-margin-top:132px}
[id]{scroll-margin-top:132px}
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--c-herb);color:var(--text-invert);
  padding:14px 22px;border-radius:0 0 12px 0;font-weight:600}
.skip:focus{left:0}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- layout ---------- */
.wrap{width:min(100% - 2.5rem,var(--container));margin-inline:auto}
@media(max-width:600px){.wrap{width:min(100% - 2rem,var(--container))}}
.section{padding-block:var(--pad-section);position:relative}
.section--tight{padding-block:clamp(2.5rem,4vw,3.75rem)}
.t-cream{background:var(--c-paper);color:var(--text)}
.t-sand{background:var(--c-paper-2);color:var(--text)}
.t-sand-grad{background:linear-gradient(179deg,var(--c-paper) 0%,var(--c-paper-2) 46%,var(--c-paper-3) 100%);color:var(--text)}
.t-cream-grad{background:linear-gradient(179deg,#fff 0%,var(--c-paper) 60%,var(--c-paper-2) 100%);color:var(--text)}
.t-herb{background:radial-gradient(125% 105% at 12% 0%,var(--c-herb-2) 0%,var(--c-herb) 46%,var(--c-herb-3) 100%);color:var(--text-invert)}
.t-herb h1,.t-herb h2,.t-herb h3,.t-herb h4{color:var(--text-invert)}
.t-herb p,.t-herb li{color:var(--text-invert-muted)}
.rule{height:1px;background:var(--line);border:0;margin:0}

.head{max-width:56ch}
.head--wide{max-width:72ch}
.head p{color:var(--text-muted);font-size:1.0625rem;margin-top:var(--gap-head);max-width:60ch}
.t-herb .head p{color:var(--text-invert-muted)}
.head--center{margin-inline:auto;text-align:center}
.head--center p{margin-inline:auto}
.grid{display:grid;gap:clamp(1.25rem,2.4vw,2rem)}
.grid>*,.split>*,.ftr-grid>*,.steps>*,.trust>*{min-width:0}
.lede{font-size:clamp(1.0625rem,1rem + .4vw,1.35rem);line-height:1.5;color:var(--text-muted);max-width:56ch}
.t-herb .lede{color:var(--text-invert-muted)}
.small{font-size:.875rem;line-height:1.55}
.mono-num{font-variant-numeric:tabular-nums}
.label{font-size:.75rem;font-weight:700;letter-spacing:.10em;text-transform:uppercase;color:var(--accent-text)}
.t-herb .label{color:var(--c-terra-lite)}

/* ---------- reveal (JS-gated, never opacity:0 in raw CSS) ---------- */
.js [data-reveal]{opacity:0;transform:translateY(18px);
  transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.js [data-reveal="left"]{transform:translateX(-22px)}
.js [data-reveal="right"]{transform:translateX(22px)}
.js [data-reveal="scale"]{transform:scale(.965)}
[data-reveal][data-shown]{opacity:1 !important;transform:none !important}
@media(prefers-reduced-motion:reduce){.js [data-reveal]{opacity:1 !important;transform:none !important;transition:none}}

/* ---------- buttons ---------- */
.btn{--bg1:var(--c-herb-2);--bg2:var(--c-herb);
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  min-height:54px;padding:.85rem 1.9rem;border-radius:var(--btn-radius);border:1px solid transparent;
  font-weight:600;font-size:1rem;letter-spacing:-.005em;text-decoration:none;cursor:pointer;
  position:relative;overflow:hidden;isolation:isolate;
  background-image:linear-gradient(177deg,var(--bg1),var(--bg2));color:var(--text-invert);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 1px 2px rgba(12,40,20,.14),0 10px 24px rgba(12,40,20,.18);
  transition:transform var(--t-fast) var(--ease-out),box-shadow var(--t-base) var(--ease-out)}
.btn svg{flex:none;width:19px;height:19px}
.btn::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(105deg,transparent 32%,rgba(255,255,255,.32) 48%,transparent 64%);transform:translateX(-120%)}
@media(hover:hover) and (pointer:fine){
  .btn:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 2px 4px rgba(12,40,20,.14),0 16px 34px rgba(12,40,20,.24)}
  .btn:hover::after{animation:sheen 620ms var(--ease-out) 1 forwards}
}
.btn:focus-visible::after{animation:sheen 620ms var(--ease-out) 1 forwards}
.btn:active{transform:translateY(0) scale(.988)}
@keyframes sheen{from{transform:translateX(-120%)}to{transform:translateX(120%)}}
.btn--accent{--bg1:var(--c-herb-2);--bg2:var(--c-herb);color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(12,40,20,.2),0 10px 26px rgba(20,86,44,.32)}
.cta-panel .btn--accent,.t-herb .btn--accent{--bg1:#FCF8F0;--bg2:#EFE6D5;color:var(--c-herb-3);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 2px 4px rgba(12,40,20,.28),0 14px 32px rgba(12,40,20,.34)}
.btn--ghost{background-image:none;background-color:transparent;color:var(--text);border-color:var(--line);box-shadow:none;font-weight:600}
.btn--ghost::after{display:none}
@media(hover:hover) and (pointer:fine){.btn--ghost:hover{background-color:rgba(35,40,28,.05);border-color:rgba(35,40,28,.28);transform:translateY(-1px)}}
.t-herb .btn--ghost,.hero .btn--ghost,.phero .btn--ghost,.cta-panel .btn--ghost{color:var(--text-invert);border-color:rgba(252,248,240,.55);background-color:rgba(10,40,20,.30)}
@media(hover:hover) and (pointer:fine){.t-herb .btn--ghost:hover,.hero .btn--ghost:hover,.phero .btn--ghost:hover,.cta-panel .btn--ghost:hover{background-color:rgba(252,248,240,.18);border-color:rgba(252,248,240,.75)}}
.btn--sm{min-height:46px;padding:.6rem 1.35rem;font-size:.9375rem}
.btn--wide{width:100%}
.actions{display:flex;flex-wrap:wrap;gap:.85rem;align-items:center}
.tlink{display:inline-flex;align-items:center;gap:.45rem;font-weight:600;color:var(--accent-text);
  text-decoration:none;border-bottom:1.5px solid rgba(198,85,47,.36);padding-bottom:2px;
  transition:border-color var(--t-base) ease}
.tlink svg{width:16px;height:16px;transition:transform var(--t-base) var(--ease-out)}
@media(hover:hover) and (pointer:fine){.tlink:hover{border-color:var(--c-terra)}.tlink:hover svg{transform:translateX(3px)}}
.t-herb .tlink{color:var(--c-leaf-lite);border-color:rgba(143,215,155,.4)}

/* ---------- header ---------- */
.hdr{position:fixed;inset:0 0 auto;z-index:90;height:106px;display:flex;align-items:center;isolation:isolate;
  background:transparent;border-bottom:1px solid transparent;
  transition:background-color var(--t-slow) ease,border-color var(--t-slow) ease,box-shadow var(--t-slow) ease,backdrop-filter var(--t-slow) ease}
.hdr::before{content:'';position:absolute;inset:0 0 -26px;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(8,44,22,.78) 0%,rgba(8,44,22,.34) 62%,rgba(8,44,22,0) 100%);
  transition:opacity var(--t-slow) ease}
.hdr[data-stuck]::before{opacity:0}
.hdr[data-stuck]{background:rgba(251,247,239,.90);backdrop-filter:blur(14px) saturate(1.3);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);border-bottom-color:var(--line-soft);box-shadow:0 1px 24px rgba(20,40,20,.07)}
@media(max-width:900px){.hdr{height:90px}}
.hdr .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:1.25rem;width:min(100% - 2.5rem,1400px)}
.brand{display:grid;align-items:center;justify-items:start;text-decoration:none;line-height:0}
.brand>picture{grid-area:1/1;display:block;transition:opacity var(--t-slow) ease}
.brand img{height:70px;width:auto;display:block}
.brand-logo--on-light{opacity:0}
.hdr[data-stuck] .brand-logo--on-dark{opacity:0}
.hdr[data-stuck] .brand-logo--on-light{opacity:1}
@media(max-width:900px){.brand img{height:57px}}
@media(max-width:420px){.brand img{height:49px}}
.drawer-brand{display:block;line-height:0}
.drawer-brand img{height:40px;width:auto}
.nav{display:flex;align-items:center;justify-content:center;gap:clamp(.15rem,1.1vw,1.15rem)}
.nav a{position:relative;text-decoration:none;font-size:.9375rem;font-weight:600;color:var(--text-invert);
  padding:.6rem .8rem;border-radius:10px;transition:background-color var(--t-base) ease,color var(--t-base) ease}
.hdr[data-stuck] .nav a{color:var(--text)}
.nav a::after{content:'';position:absolute;left:.8rem;right:.8rem;bottom:.34rem;height:2px;
  background:var(--c-terra);transform:scaleX(0);transform-origin:left;border-radius:2px;transition:transform var(--t-base) var(--ease-out)}
@media(hover:hover) and (pointer:fine){.nav a:hover::after{transform:scaleX(1)}}
.nav a[aria-current="page"]::after{transform:scaleX(1)}
.hdr-cta{display:flex;align-items:center;justify-content:flex-end;gap:.7rem;flex:none}
.hdr-tel{display:inline-flex;align-items:center;gap:.45rem;text-decoration:none;font-weight:700;
  font-size:.9375rem;font-variant-numeric:tabular-nums;padding:.5rem .3rem;color:var(--text-invert)}
.hdr[data-stuck] .hdr-tel{color:var(--text)}
.hdr-tel svg{width:17px;height:17px;color:var(--c-leaf-lite)}
.hdr[data-stuck] .hdr-tel svg{color:var(--accent-text)}
@media(max-width:1180px){.hdr-tel{display:none}}
@media(max-width:1040px){.nav{display:none}}
.burger{display:none;width:48px;height:48px;align-items:center;justify-content:center;
  background:rgba(252,248,240,.12);border:1px solid var(--line-invert);border-radius:12px;cursor:pointer;color:var(--text-invert)}
.hdr[data-stuck] .burger{background:transparent;border-color:var(--line);color:var(--text)}
.burger svg{width:22px;height:22px}
@media(max-width:1040px){.burger{display:inline-flex}.hdr-cta .btn{display:none}}

/* drawer */
.drawer{position:fixed;inset:0;z-index:100;display:none;background:var(--c-paper)}
.drawer[data-open]{display:flex;flex-direction:column}
.drawer-top{height:90px;display:flex;align-items:center;justify-content:space-between;flex:none;
  padding-inline:1.5rem;border-bottom:1px solid var(--line-soft)}
.drawer-close{width:46px;height:46px;display:inline-flex;align-items:center;justify-content:center;
  background:transparent;border:1px solid var(--line);border-radius:12px;cursor:pointer}
.drawer-close svg{width:22px;height:22px}
.drawer-body{flex:1;overflow-y:auto;padding:1rem 1.5rem 1.5rem;-webkit-overflow-scrolling:touch}
.drawer-body a{display:flex;align-items:center;min-height:56px;text-decoration:none;font-size:1.15rem;
  font-weight:600;border-bottom:1px solid var(--line-soft);color:var(--text)}
.drawer-body a[aria-current="page"]{color:var(--accent-text)}
.drawer-foot{flex:none;padding:1.25rem 1.5rem calc(1.5rem + env(safe-area-inset-bottom));
  border-top:1px solid var(--line-soft);display:grid;gap:.7rem;background:var(--c-paper-2)}

/* ---------- hero ---------- */
.hero{position:relative;min-height:90vh;min-height:90svh;display:flex;align-items:center;
  overflow:hidden;background:var(--c-herb-3);isolation:isolate}
@media(max-width:768px){.hero{min-height:84vh;min-height:84svh}}
.hero-media{position:absolute;inset:0;z-index:-2}
.hero-media img,.hero-media video{width:100%;height:100%;object-fit:cover;object-position:50% 42%}
.hero-scrim{position:absolute;inset:0;z-index:-1;
  background:linear-gradient(103deg,rgba(8,44,22,.93) 0%,rgba(8,44,22,.78) 30%,rgba(8,44,22,.26) 60%,rgba(8,44,22,0) 100%),
  linear-gradient(0deg,rgba(6,22,13,.58) 0%,rgba(6,22,13,0) 38%)}
.hero .wrap{width:min(100% - 2.5rem,1400px);
  padding-block:calc(106px + clamp(.5rem,2vh,1.5rem)) clamp(1.5rem,4vh,2.75rem)}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(1.5rem,3vw,3rem);align-items:center}
@media(max-width:940px){.hero-grid{grid-template-columns:1fr}}
.hero-copy{color:var(--text-invert);max-width:min(100%,44rem)}
.hero-copy h1{color:var(--text-invert);text-shadow:0 2px 30px rgba(6,30,15,.35)}
.hero-copy .lede{color:#eef3e8;margin:1.2rem 0 1.9rem;max-width:48ch;font-size:clamp(1.08rem,1rem+.5vw,1.4rem)}
.hero .actions{margin-bottom:1.6rem}
/* trust rail */
.trust{display:flex;flex-wrap:wrap;gap:1.35rem;align-items:center;color:var(--text-invert)}
.trust .ti{display:flex;align-items:center;gap:.5rem;font-size:.94rem;font-weight:600}
.trust .ti svg{width:18px;height:18px;color:var(--c-leaf-lite);flex:none}
.trust .stars{color:#F4C551;letter-spacing:1px}
.trust .sep{width:1px;height:26px;background:var(--line-invert)}
@media(max-width:560px){.trust .sep{display:none}.trust{gap:.75rem 1.25rem}}
/* floating menu card */
.menu-card{background:rgba(251,247,239,.97);border-radius:22px;padding:1.15rem 1.15rem 1.25rem;
  box-shadow:var(--shadow-3);border:1px solid rgba(255,255,255,.5);backdrop-filter:blur(6px);max-width:400px;justify-self:end;width:100%}
@media(max-width:940px){.menu-card{justify-self:stretch;max-width:none}}
.menu-card h2{font-size:1.15rem;line-height:1.2;color:var(--c-herb);margin:0}
.menu-card .mc-sub{font-size:.82rem;color:var(--text-muted);margin:.15rem 0 .9rem;font-weight:600;letter-spacing:.02em}
.mc-item{display:grid;grid-template-columns:64px 1fr auto;gap:.85rem;align-items:center;padding:.55rem 0;border-top:1px solid var(--line-soft)}
.mc-item img{width:64px;height:64px;border-radius:13px;object-fit:cover}
.mc-name{font-weight:700;font-size:.98rem;color:var(--text);line-height:1.2}
.mc-tag{font-size:.78rem;color:var(--text-muted)}
.mc-price{font-family:'Newsreader','Newsreader Fallback',serif;font-weight:600;font-size:1.15rem;color:var(--accent-text);font-variant-numeric:tabular-nums}
.menu-card .btn{margin-top:.95rem}

/* ---------- feature cards / icons ---------- */
.ico-plate{width:54px;height:54px;border-radius:15px;display:grid;place-items:center;flex:none;
  background:linear-gradient(160deg,#EAF3E5,#DCEBD3);border:1px solid rgba(20,86,44,.14);color:var(--c-herb)}
.ico-plate.alt{background:linear-gradient(160deg,#FBE7DC,#F6D8C6);border-color:rgba(166,67,31,.16);color:var(--c-terra-deep)}
.ico-plate svg{width:27px;height:27px;stroke-width:1.75}
.t-herb .ico-plate{background:rgba(252,248,240,.10);border-color:rgba(252,248,240,.18);color:var(--c-leaf-lite)}
.t-herb .ico-plate.alt{background:rgba(231,147,102,.16);border-color:rgba(231,147,102,.3);color:var(--c-terra-lite)}

.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.6rem)}
@media(max-width:860px){.cards3{grid-template-columns:1fr;max-width:560px;margin-inline:auto}}
.card{background:var(--c-paper);border:1px solid var(--line-soft);border-radius:var(--card-radius);
  padding:1.6rem 1.5rem;box-shadow:var(--shadow-1);transition:transform var(--t-base) var(--ease-out),box-shadow var(--t-base) var(--ease-out)}
.card h3{margin:1rem 0 .5rem;font-size:1.28rem}
.card p{margin:0;color:var(--text-muted);font-size:1rem}
@media(hover:hover) and (pointer:fine){.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-2)}}
.t-herb .card{background:rgba(252,248,240,.06);border-color:var(--line-invert)}
.t-herb .card p{color:var(--text-invert-muted)}
/* value cards asymmetric (hero card + supporting) */
.valuegrid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(1rem,2vw,1.5rem)}
@media(max-width:900px){.valuegrid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.valuegrid{grid-template-columns:1fr}}
.valuegrid .card--wide{grid-row:span 2;display:flex;flex-direction:column;justify-content:space-between}
@media(max-width:900px){.valuegrid .card--wide{grid-column:1 / -1;grid-row:auto}}
.card--photo{padding:0;overflow:hidden}
.card--photo .cp-media{aspect-ratio:4/3;overflow:hidden}
.card--photo img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-out)}
@media(hover:hover) and (pointer:fine){.card--photo:hover img{transform:scale(1.05)}}
.card--photo .cp-body{padding:1.35rem 1.4rem 1.5rem}

/* ---------- menu grid (dishes with price tags) ---------- */
.dish-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.5rem)}
@media(max-width:860px){.dish-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.dish-grid{grid-template-columns:1fr;max-width:420px;margin-inline:auto}}
.dish{background:var(--c-paper);border:1px solid var(--line-soft);border-radius:var(--card-radius);overflow:hidden;
  box-shadow:var(--shadow-1);transition:transform var(--t-base) var(--ease-out),box-shadow var(--t-base) var(--ease-out);position:relative}
.dish .dish-media{aspect-ratio:4/3;overflow:hidden;position:relative}
.dish img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-out)}
.dish .price{position:absolute;top:.7rem;right:.7rem;background:rgba(251,247,239,.96);color:var(--accent-text);
  font-weight:700;font-size:.95rem;padding:.3rem .65rem;border-radius:999px;box-shadow:var(--shadow-1);font-variant-numeric:tabular-nums}
.dish .dish-body{padding:1rem 1.1rem 1.15rem}
.dish h3{font-size:1.18rem;margin:0 0 .3rem}
.dish p{margin:0;color:var(--text-muted);font-size:.92rem;line-height:1.5}
.dish .tag{display:inline-block;margin-top:.6rem;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--green-text)}
@media(hover:hover) and (pointer:fine){.dish:hover{transform:translateY(-3px);box-shadow:var(--shadow-2)}.dish:hover img{transform:scale(1.05)}}

/* ---------- steps / how it works ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2vw,1.5rem);position:relative;counter-reset:step}
@media(max-width:880px){.steps{grid-template-columns:1fr;max-width:520px;margin-inline:auto}}
.step{position:relative;padding:1.4rem 1.35rem;background:var(--c-paper);border:1px solid var(--line-soft);
  border-radius:var(--card-radius);box-shadow:var(--shadow-1)}
.t-herb .step{background:rgba(252,248,240,.06);border-color:var(--line-invert)}
.step .n{font-family:'Newsreader','Newsreader Fallback',serif;font-weight:600;font-size:2.4rem;line-height:1;
  color:var(--c-terra);font-variant-numeric:tabular-nums;display:block;margin-bottom:.55rem}
.step h3{font-size:1.18rem;margin:0 0 .4rem}
.step p{margin:0;color:var(--text-muted);font-size:.95rem}
.t-herb .step p{color:var(--text-invert-muted)}
.step .connect{position:absolute;top:2.1rem;right:-webkit-calc(-.75rem - 1px);right:calc(-.75rem - 1px);width:1.5rem;height:2px;background:repeating-linear-gradient(90deg,var(--c-terra) 0 6px,transparent 6px 11px)}
@media(max-width:880px){.step .connect{top:auto;bottom:-webkit-calc(-.75rem - 1px);bottom:calc(-.75rem - 1px);right:auto;left:2rem;width:2px;height:1.5rem;background:repeating-linear-gradient(180deg,var(--c-terra) 0 6px,transparent 6px 11px)}}
.steps>.step:last-child .connect{display:none}

/* ---------- signature: Build Your Box ---------- */
.bbx{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(1.5rem,3vw,2.75rem);align-items:start}
@media(max-width:940px){.bbx{grid-template-columns:1fr}}
.bbx-menu{display:grid;grid-template-columns:repeat(3,1fr);gap:.85rem}
@media(max-width:620px){.bbx-menu{grid-template-columns:repeat(2,1fr)}}
.bbx-item{position:relative;text-align:left;background:var(--c-paper);border:1px solid var(--line-soft);border-radius:16px;
  overflow:hidden;cursor:pointer;box-shadow:var(--shadow-1);color:var(--text);padding:0;
  transition:transform var(--t-base) var(--ease-out),box-shadow var(--t-base) var(--ease-out),border-color var(--t-base) ease}
.bbx-item .bi-media{aspect-ratio:1/1;overflow:hidden}
.bbx-item img{width:100%;height:100%;object-fit:cover}
.bbx-item .bi-b{padding:.6rem .7rem .75rem}
.bbx-item .bi-name{font-weight:700;font-size:.86rem;line-height:1.2;display:block}
.bbx-item .bi-price{font-size:.82rem;color:var(--accent-text);font-weight:700;font-variant-numeric:tabular-nums;margin-top:.15rem;display:block}
.bbx-item .bi-add{position:absolute;top:.5rem;right:.5rem;width:30px;height:30px;border-radius:50%;
  background:rgba(251,247,239,.95);color:var(--c-herb);display:grid;place-items:center;box-shadow:var(--shadow-1);font-weight:700;transition:background var(--t-base) ease,color var(--t-base) ease}
.bbx-item .bi-add svg{width:16px;height:16px}
.bbx-item[data-qty]:not([data-qty="0"]){border-color:var(--c-leaf);box-shadow:0 0 0 2px rgba(44,138,69,.35),var(--shadow-1)}
.bbx-item[data-qty]:not([data-qty="0"]) .bi-add{background:var(--c-herb);color:#fff}
@media(hover:hover) and (pointer:fine){.bbx-item:hover{transform:translateY(-2px);box-shadow:var(--shadow-2)}}
.bbx-qtybadge{position:absolute;top:.5rem;left:.5rem;background:var(--c-herb);color:#fff;font-size:.75rem;font-weight:700;
  min-width:22px;height:22px;border-radius:999px;display:none;place-items:center;padding:0 .3rem}
.bbx-item[data-qty]:not([data-qty="0"]) .bbx-qtybadge{display:grid}
/* summary panel */
.bbx-sum{background:linear-gradient(178deg,#fff,var(--c-paper-2));border:1px solid var(--line-soft);border-radius:22px;
  padding:1.4rem 1.4rem 1.5rem;box-shadow:var(--shadow-2);position:sticky;top:126px}
@media(max-width:940px){.bbx-sum{position:static}}
.bbx-sum h3{font-size:1.35rem;margin:0 0 .2rem}
.bbx-sum .bs-sub{font-size:.9rem;color:var(--text-muted);margin:0 0 1rem}
.bs-row{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:.5rem 0;border-top:1px solid var(--line-soft);font-size:.98rem}
.bs-row .v{font-weight:700;font-variant-numeric:tabular-nums}
.bs-total{display:flex;justify-content:space-between;align-items:baseline;margin-top:.4rem;padding-top:.8rem;border-top:2px solid var(--line)}
.bs-total .l{font-weight:700;font-size:1.05rem}
.bs-total .v{font-family:'Newsreader','Newsreader Fallback',serif;font-weight:600;font-size:1.9rem;color:var(--c-herb);font-variant-numeric:tabular-nums}
.bs-deliver{margin-top:1rem;padding:.85rem 1rem;border-radius:14px;background:#EAF3E5;border:1px solid rgba(20,86,44,.14);
  font-size:.92rem;color:var(--c-herb-3);display:flex;gap:.6rem;align-items:flex-start}
.bs-deliver svg{width:19px;height:19px;flex:none;color:var(--c-herb);margin-top:1px}
.bs-deliver strong{color:var(--c-herb)}
.bbx-sum .btn{margin-top:1.1rem}
.bbx-empty{color:var(--text-muted);font-size:.92rem;margin:.2rem 0 0}
.bbx-note{font-size:.78rem;color:var(--text-muted);margin:.7rem 0 0;text-align:center}

/* ---------- delivery schedule mini-calendar ---------- */
.sched{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
@media(max-width:760px){.sched{grid-template-columns:1fr}}
.sched-card{background:var(--c-paper);border:1px solid var(--line-soft);border-radius:var(--card-radius);padding:1.5rem;box-shadow:var(--shadow-1)}
.sched-card h3{font-size:1.25rem;margin:0 0 1rem;display:flex;align-items:center;gap:.6rem}
.sched-card h3 .dot{width:12px;height:12px;border-radius:50%;flex:none}
.dot--order{background:var(--c-terra)}.dot--deliver{background:var(--c-herb)}
.week{display:grid;grid-template-columns:repeat(7,1fr);gap:.4rem}
.day{aspect-ratio:1/1;min-width:0;border-radius:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:var(--c-paper-2);border:1px solid var(--line-soft);font-size:.8rem;font-weight:700;color:var(--c-ink-2);gap:.15rem}
.day .dl{font-size:.62rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--c-ink-2)}
.day--order{background:#FBE7DC;border-color:rgba(166,67,31,.3)}
.day--order .dl{color:#8a3517}
.day--deliver{background:#DEEFD6;border-color:rgba(20,86,44,.32)}
.day--deliver .dl{color:#0C3B1D}
.day svg{color:var(--c-herb)}
@media(max-width:430px){.sched-card{padding:1.15rem}.week{gap:.3rem}.day{font-size:.72rem}.day .dl{font-size:.55rem;letter-spacing:.01em}.day svg{width:13px !important;height:13px !important}}
.sched-legend{display:flex;gap:1.25rem;flex-wrap:wrap;margin-top:1.1rem;font-size:.85rem;font-weight:600}
.sched-legend span{display:inline-flex;align-items:center;gap:.4rem}
.sched-legend i{width:12px;height:12px;border-radius:4px;display:inline-block}

/* ---------- reviews ---------- */
.rev-head{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.5rem;margin-bottom:2rem}
.rev-score{display:flex;align-items:center;gap:.8rem}
.rev-score .num{font-family:'Newsreader','Newsreader Fallback',serif;font-weight:600;font-size:3rem;line-height:1;color:var(--c-herb);font-variant-numeric:tabular-nums}
.rev-score .stars{color:#7E5700;font-size:1.2rem;letter-spacing:2px}
.rev-score .cnt{font-size:.9rem;color:var(--text-muted)}
.t-herb .rev-score .num{color:var(--text-invert)}.t-herb .rev-score .cnt{color:var(--text-invert-muted)}
.rev-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1rem,2vw,1.5rem)}
@media(max-width:760px){.rev-grid{grid-template-columns:1fr}}
.review{background:var(--c-paper);border:1px solid var(--line-soft);border-radius:var(--card-radius);padding:1.5rem;box-shadow:var(--shadow-1)}
.t-herb .review{background:rgba(252,248,240,.06);border-color:var(--line-invert)}
.review .stars{color:#7E5700;letter-spacing:2px;font-size:.95rem;margin-bottom:.6rem}
.review p{font-size:1.02rem;line-height:1.6;color:var(--text)}
.t-herb .review p{color:var(--text-invert)}
.review .who{display:flex;align-items:center;gap:.7rem;margin-top:1rem}
.review .mono{width:42px;height:42px;border-radius:50%;background:linear-gradient(150deg,var(--c-herb-2),var(--c-herb));color:#fff;
  display:grid;place-items:center;font-weight:700;font-size:1rem;flex:none}
.review .wn{font-weight:700;font-size:.95rem}
.review .wm{font-size:.8rem;color:var(--text-muted)}
.t-herb .review .wm{color:var(--text-invert-muted)}
.rev-note{font-size:.82rem;color:var(--text-muted);margin-top:1.5rem}
.t-herb .rev-note{color:var(--text-invert-muted)}

/* ---------- split / who-it-is-for ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,3vw,3rem);align-items:center}
@media(max-width:860px){.split{grid-template-columns:1fr}}
.split--media img{border-radius:var(--card-radius);box-shadow:var(--shadow-2);width:100%}
.media-frame{border-radius:var(--card-radius);overflow:hidden;box-shadow:var(--shadow-2);position:relative}
.media-frame img{width:100%;display:block}
.forwho{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
@media(max-width:620px){.forwho{grid-template-columns:1fr}}
.forwho .fw{background:var(--c-paper);border:1px solid var(--line-soft);border-radius:var(--card-radius);padding:1.4rem;box-shadow:var(--shadow-1)}
.forwho .fw h3{font-size:1.2rem;display:flex;align-items:center;gap:.55rem;margin-bottom:.7rem}
.forwho .fw ul{margin:0;padding:0;list-style:none}
.forwho .fw li{position:relative;padding-left:1.7rem;margin-bottom:.6rem;font-size:.98rem;color:var(--text-muted)}
.forwho .fw li::before{content:'';position:absolute;left:0;top:.5em;width:16px;height:16px;background-size:contain;background-repeat:no-repeat}
.fw--yes li::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%231E7038' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10.5l4 4 8-9'/%3E%3C/svg%3E")}
.fw--no li::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23A8431F' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M5 5l10 10M15 5L5 15'/%3E%3C/svg%3E")}
.fw--yes h3{color:var(--green-text)}.fw--no h3{color:var(--accent-text)}

/* ---------- comparison ---------- */
.cmp{width:100%;border-collapse:separate;border-spacing:0;font-size:.98rem}
.cmp-wrap{overflow:hidden;border-radius:var(--card-radius);border:1px solid var(--line-soft);box-shadow:var(--shadow-1)}
.cmp th,.cmp td{padding:1rem 1.15rem;text-align:left;border-bottom:1px solid var(--line-soft);vertical-align:top}
.cmp thead th{background:var(--c-paper-2);font-weight:700;font-size:.92rem}
.cmp thead th.win{background:var(--c-herb);color:#fff}
.cmp td.win{background:rgba(20,86,44,.06);font-weight:600}
.cmp tbody tr:last-child td{border-bottom:0}
.cmp .rowlabel{font-weight:700;color:var(--text)}
.cmp .yes{color:var(--green-text);font-weight:700}
.cmp .no{color:var(--text-muted)}
.cmp-cards{display:none}
@media(max-width:720px){
  .cmp-wrap{display:none}
  .cmp-cards{display:grid;gap:1rem}
  .cmp-card{background:var(--c-paper);border:1px solid var(--line-soft);border-radius:var(--card-radius);padding:1.25rem;box-shadow:var(--shadow-1)}
  .cmp-card.win{border-color:var(--c-herb);box-shadow:0 0 0 2px rgba(20,86,44,.25),var(--shadow-1)}
  .cmp-card h3{font-size:1.15rem;margin-bottom:.2rem}
  .cmp-card .badge{display:inline-block;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--c-herb);padding:.15rem .5rem;border-radius:999px;margin-left:.5rem;vertical-align:middle}
  .cmp-card dl{margin:0}
  .cmp-card dt,.cmp-card dd{margin:0}
  .cmp-card .cl{font-size:.78rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;margin-top:.7rem}
  .cmp-card .cv{font-size:.98rem}
}

/* ---------- cost factors ---------- */
.cost{display:grid;gap:1rem;max-width:760px}
.cost-row{display:grid;grid-template-columns:200px 1fr;gap:1rem;align-items:center}
@media(max-width:620px){.cost-row{grid-template-columns:1fr;gap:.3rem}}
.cost-row .cl{font-weight:700;font-size:.98rem}
.cost-bar{height:34px;border-radius:999px;background:var(--c-paper-2);border:1px solid var(--line-soft);position:relative;overflow:hidden}
.cost-bar .fill{position:absolute;inset:0;width:var(--w,50%);background:linear-gradient(90deg,var(--c-leaf),var(--c-herb));border-radius:999px}
.cost-bar .cnote{position:absolute;right:.8rem;top:50%;transform:translateY(-50%);font-size:.8rem;font-weight:700;color:var(--text);z-index:1}

/* ---------- FAQ ---------- */
.faq{max-width:820px;margin-inline:auto}
.faq-i{border-bottom:1px solid var(--line-soft)}
.faq-i[data-more]{display:none}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  background:transparent;border:0;cursor:pointer;text-align:left;padding:1.15rem .25rem;
  font-family:'Newsreader','Newsreader Fallback',serif;font-weight:600;font-size:clamp(1.1rem,1rem + .4vw,1.3rem);color:var(--text)}
.faq-q .ico{width:30px;height:30px;flex:none;border-radius:50%;background:var(--c-paper-2);display:grid;place-items:center;transition:background var(--t-base) ease}
.faq-q .ico svg{width:16px;height:16px;transition:transform var(--t-base) var(--ease-out)}
.faq-q[aria-expanded="true"] .ico{background:var(--c-herb);color:#fff}
.faq-q[aria-expanded="true"] .ico svg{transform:rotate(45deg)}
.faq-p{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--t-base) var(--ease-io)}
.faq-p[data-open]{grid-template-rows:1fr}
.faq-p>.inner{overflow:hidden;min-height:0}
.faq-p>.inner{padding:0 .25rem 1.25rem;color:var(--text-muted);max-width:70ch}
.faq-more-wrap{text-align:center;margin-top:2rem}

/* ---------- CTA panel ---------- */
.cta-panel{position:relative;overflow:hidden;border-radius:28px;padding:clamp(2.25rem,4vw,3.5rem);
  background:radial-gradient(120% 130% at 12% 0%,var(--c-herb-2),var(--c-herb) 52%,var(--c-herb-3));color:var(--text-invert);box-shadow:var(--shadow-3)}
.cta-panel::after{content:'';position:absolute;right:-8%;bottom:-30%;width:52%;height:150%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(143,215,155,.25),transparent 70%)}
.cta-panel h2{color:var(--text-invert);max-width:20ch}
.cta-panel p{color:var(--text-invert-muted);max-width:52ch}
.cta-panel .actions{margin-top:1.6rem;position:relative;z-index:1}

/* ---------- forms ---------- */
.form{display:grid;gap:1.1rem;max-width:560px}
.field{display:grid;gap:.4rem}
.field label{font-weight:700;font-size:.9rem}
.field input,.field select,.field textarea{width:100%;min-height:52px;padding:.75rem .9rem;border-radius:12px;
  border:1px solid var(--line);background:#fff;font:inherit;color:var(--text);transition:border-color var(--t-base) ease,box-shadow var(--t-base) ease}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--c-herb);box-shadow:0 0 0 3px rgba(20,86,44,.15)}
.form-note{font-size:.82rem;color:var(--text-muted)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
@media(max-width:560px){.form-row{grid-template-columns:1fr}}

/* ---------- contact info + map ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,3vw,3rem);align-items:start}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr}}
.info-list{display:grid;gap:1.1rem;margin:0;padding:0;list-style:none}
.info-list li{display:flex;gap:.9rem;align-items:flex-start}
.info-list .ico-plate{width:46px;height:46px;border-radius:12px}
.info-list .ico-plate svg{width:22px;height:22px}
.info-list a{color:var(--text);text-decoration:none;font-weight:600;display:inline-block;padding-block:.15rem}
.info-list .l{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}
.map-frame{border-radius:var(--card-radius);overflow:hidden;box-shadow:var(--shadow-2);border:1px solid var(--line-soft);min-height:340px}
.map-frame iframe{width:100%;height:100%;min-height:340px;border:0;display:block}

/* ---------- links page ---------- */
.links-wrap{max-width:520px;margin-inline:auto;text-align:center}
.links-mark{width:min(100%,340px);margin:0 auto 1.1rem}
.links-mark img{width:100%;height:auto}
.links-list{display:grid;gap:.85rem;margin-top:2rem}
.link-btn{display:flex;align-items:center;gap:.9rem;padding:1rem 1.2rem;border-radius:16px;text-decoration:none;
  background:var(--c-paper);border:1px solid var(--line-soft);box-shadow:var(--shadow-1);color:var(--text);font-weight:700;
  transition:transform var(--t-base) var(--ease-out),box-shadow var(--t-base) var(--ease-out)}
.link-btn .ico-plate{width:42px;height:42px;border-radius:11px}
.link-btn .ico-plate svg{width:20px;height:20px}
.link-btn .lt{text-align:left;flex:1}
.link-btn .lt small{display:block;font-weight:500;color:var(--text-muted);font-size:.8rem}
.link-btn .arr{color:var(--text-muted)}
@media(hover:hover) and (pointer:fine){.link-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-2)}}
.link-btn--primary{background:linear-gradient(177deg,var(--c-herb-2),var(--c-herb));color:#fff}
.link-btn--primary .lt small{color:rgba(252,248,240,.8)}.link-btn--primary .arr{color:rgba(252,248,240,.8)}
.link-btn--primary .ico-plate{background:rgba(252,248,240,.15);color:#fff;border-color:rgba(252,248,240,.2)}
.qr-box{margin-top:2.25rem;padding:1.4rem;background:var(--c-paper);border:1px solid var(--line-soft);border-radius:var(--card-radius);box-shadow:var(--shadow-1)}
.qr-box img{width:180px;height:180px;margin:0 auto .6rem;border-radius:12px}

/* ---------- blog ---------- */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.6rem)}
@media(max-width:860px){.post-grid{grid-template-columns:1fr;max-width:560px;margin-inline:auto}}
.post-card{background:var(--c-paper);border:1px solid var(--line-soft);border-radius:var(--card-radius);overflow:hidden;box-shadow:var(--shadow-1);
  transition:transform var(--t-base) var(--ease-out),box-shadow var(--t-base) var(--ease-out)}
.post-card .pc-media{aspect-ratio:16/10;overflow:hidden}
.post-card img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-out)}
.post-card .pc-body{padding:1.3rem 1.35rem 1.5rem}
.post-card h3{font-size:1.25rem;margin:0 0 .5rem}
.post-card p{margin:0;color:var(--text-muted);font-size:.95rem}
.post-card a.stretch::after{content:'';position:absolute;inset:0}
.post-card{position:relative}
@media(hover:hover) and (pointer:fine){.post-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-2)}.post-card:hover img{transform:scale(1.05)}}
.article{max-width:720px;margin-inline:auto}
.article h2{margin-top:2.2rem}
.article h3{margin-top:1.6rem}
.article p,.article li{color:var(--text);font-size:1.075rem;line-height:1.72}
.article .lede{color:var(--text-muted)}
.article img{border-radius:var(--card-radius);box-shadow:var(--shadow-1);margin:1.5rem 0}
.article-meta{color:var(--text-muted);font-size:.9rem;margin-bottom:1.5rem}

/* ---------- footer ---------- */
.ftr{background:radial-gradient(120% 120% at 82% 0%,var(--c-herb-3) 0%,var(--c-herb-4) 70%);color:var(--text-invert);padding-block:clamp(3rem,5vw,4.5rem) 2rem;position:relative}
.ftr a{color:var(--text-invert-muted);text-decoration:none;transition:color var(--t-base) ease}
@media(hover:hover) and (pointer:fine){.ftr a:hover{color:var(--text-invert)}}
.ftr-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:2rem;padding-bottom:2.5rem;border-bottom:1px solid var(--line-invert)}
@media(max-width:900px){.ftr-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.ftr-grid{grid-template-columns:1fr}}
.ftr-brand .brand{margin:0 0 1.1rem}
.ftr .brand img{height:78px}
@media(max-width:560px){.ftr .brand img{height:68px}}
.ftr-brand p{color:var(--text-invert-muted);max-width:34ch;font-size:.98rem}
.ftr .ftr-h{color:var(--text-invert);font-family:'Hanken Grotesk','Hanken Fallback',sans-serif;font-size:.78rem;
  text-transform:uppercase;letter-spacing:.1em;font-weight:700;margin-bottom:1rem}
.ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.ftr ul li a{display:inline-block;padding-block:.22rem}
.ftr-bottom a{display:inline-block;padding-block:.22rem}
.ftr-contact li{display:flex;gap:.6rem;align-items:flex-start;font-size:.95rem;color:var(--text-invert-muted)}
.ftr-contact svg{width:18px;height:18px;flex:none;color:var(--c-leaf-lite);margin-top:2px}
.ftr-social{display:flex;gap:.6rem;margin-top:1rem}
.ftr-social a{width:42px;height:42px;border-radius:11px;background:rgba(252,248,240,.08);border:1px solid var(--line-invert);
  display:grid;place-items:center;color:var(--text-invert)}
.ftr-social svg{width:20px;height:20px}
@media(hover:hover) and (pointer:fine){.ftr-social a:hover{background:rgba(252,248,240,.16)}}
.ftr-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;align-items:center;padding-top:1.6rem;font-size:.86rem;color:var(--text-invert-muted)}
.ftr-bottom .legal{display:flex;flex-wrap:wrap;gap:1rem}
.attn{font-weight:600}
.attn a{color:var(--c-leaf-lite);text-decoration:none;text-shadow:0 0 18px rgba(143,215,155,.45)}
.attn a:hover{color:#fff}

/* ---------- sticky mobile CTA ---------- */
.mcta{position:fixed;left:0;right:0;bottom:0;z-index:80;display:none;gap:.6rem;padding:.6rem;
  padding-bottom:calc(.6rem + env(safe-area-inset-bottom));background:rgba(251,247,239,.94);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line-soft);box-shadow:0 -6px 24px rgba(20,40,20,.10)}
.mcta .btn{flex:1;min-height:50px;padding:.7rem 1rem}
@media(max-width:768px){.mcta{display:flex}body{padding-bottom:74px}}

/* ---------- page hero (interior) ---------- */
.phero{position:relative;padding-top:132px;overflow:hidden;background:var(--c-herb-3);color:var(--text-invert);isolation:isolate}
.phero-media{position:absolute;inset:0;z-index:-2}
.phero-media img,.phero-media video{width:100%;height:100%;object-fit:cover;object-position:50% 45%}
.phero-scrim{position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(8,44,22,.95) 0%,rgba(8,44,22,.87) 42%,rgba(8,44,22,.52) 72%,rgba(8,44,22,.10) 100%),
  linear-gradient(0deg,rgba(6,22,13,.45) 0%,rgba(6,22,13,0) 42%)}
.phero .wrap{padding-block:clamp(2.5rem,7vh,5rem)}
.phero h1{color:var(--text-invert);max-width:20ch}
.phero .lede{color:#eef3e8;max-width:56ch;margin-top:1rem}
.phero .actions{margin-top:1.6rem}

/* misc */
.center{text-align:center}
.mt-2{margin-top:2rem}.mt-1{margin-top:1rem}
.two-col{columns:2;column-gap:2.5rem}
@media(max-width:640px){.two-col{columns:1}}
.badge-inline{display:inline-flex;align-items:center;gap:.4rem;font-weight:700;color:var(--green-text);font-size:.95rem}
.badge-inline svg{width:18px;height:18px}

/* ---------- print (contact) ---------- */
@media print{
  .hdr,.mcta,.drawer,.ftr .ftr-social,.cta-panel{display:none !important}
  body{padding:0}
  a{color:#000;text-decoration:underline}
  .phero{padding-top:0;color:#000}
}

/* drawer craft */
.drawer-body a{gap:.85rem}
.drawer-body .fi{width:20px;height:20px;flex:none;color:var(--c-herb);opacity:.75;
  transition:transform var(--t-base) var(--ease-out),color var(--t-base) ease}
.drawer-body a[aria-current="page"] .fi{color:var(--accent-text);opacity:1}
.drawer-foot .btn--ghost{border-color:rgba(35,40,28,.26);background-color:rgba(255,255,255,.55)}

/* ==========================================================================
   v2 polish - hero typography, headline motion, button craft, footer map
   ========================================================================== */
.hero-copy h1{font-size:clamp(2.35rem,1.3rem + 3.1vw,4.05rem);line-height:1.06}
.h1-lines{text-wrap:nowrap}
.h1-lines .ln{display:block}
@media(max-width:620px){.h1-lines{text-wrap:balance}.h1-lines .ln{display:block}
  .hero-copy h1{font-size:clamp(1.95rem,7.6vw,2.6rem)}}

.menu-card{align-self:start}
@media(max-width:940px){.menu-card{align-self:stretch;margin-top:.5rem}}
.mc-item{border-radius:12px;transition:background-color var(--t-base) ease}
@media(hover:hover) and (pointer:fine){
  .mc-item:hover{background-color:rgba(20,86,44,.05)}
  .mc-item img{transition:transform var(--t-base) var(--ease-out)}
  .mc-item:hover img{transform:scale(1.05)}}

@keyframes ebmRise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media(min-width:621px){
  .js .hero-copy .h1-lines .ln{animation:ebmRise .95s var(--ease-out) both}
  .js .hero-copy .h1-lines .ln:nth-child(1){animation-delay:.06s}
  .js .hero-copy .h1-lines .ln:nth-child(2){animation-delay:.17s}
  .js .hero-copy .h1-lines .ln:nth-child(3){animation-delay:.28s}
}
@media(max-width:620px){.js .hero-copy h1{animation:ebmRise .9s var(--ease-out) .06s both}}
.js .hero-copy .lede{animation:ebmRise .9s var(--ease-out) .40s both}
.js .hero .actions{animation:ebmRise .9s var(--ease-out) .50s both}
.js .hero .trust{animation:ebmRise .9s var(--ease-out) .60s both}
.js .menu-card{animation:ebmRise 1s var(--ease-out) .30s both}
@media(prefers-reduced-motion:reduce){
  .js .hero-copy h1,.js .hero-copy .h1-lines .ln,.js .hero-copy .lede,
  .js .hero .actions,.js .hero .trust,.js .menu-card{animation:none}}

.btn{letter-spacing:-.004em;border-color:rgba(255,255,255,.12)}
.btn .ar{transition:transform var(--t-base) var(--ease-out)}
.btn:focus-visible{outline:3px solid var(--c-terra);outline-offset:3px}
@media(hover:hover) and (pointer:fine){
  .btn:hover .ar{transform:translateX(4px)}
  .btn--accent:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 2px 6px rgba(120,40,20,.22),0 18px 40px rgba(166,67,31,.36)}
  .btn--ghost:hover .ar{transform:translateX(3px)}}
.btn--ghost{border-width:1.5px}
.hero .btn--ghost,.t-herb .btn--ghost,.cta-panel .btn--ghost{backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.btn[disabled]{cursor:not-allowed}
.tlink:focus-visible{outline-offset:5px}

.nav a::after{background:linear-gradient(90deg,var(--c-terra),var(--c-terra-lite))}
.hdr[data-stuck] .nav a::after{background:linear-gradient(90deg,var(--c-pop-v),var(--c-terra))}
@media(hover:hover) and (pointer:fine){.nav a:hover{background-color:rgba(252,248,240,.10)}
  .hdr[data-stuck] .nav a:hover{background-color:rgba(35,40,28,.05)}}

.ftr{isolation:isolate}
.ftr::before{content:'';position:absolute;inset:0 0 auto;height:3px;
  background:linear-gradient(90deg,var(--c-herb-2) 0%,var(--c-pop-v) 46%,var(--c-terra) 100%)}
.ftr ul li a{display:inline-flex;align-items:center;gap:.6rem}
.ftr .fi{width:17px;height:17px;flex:none;color:var(--c-leaf-lite);opacity:.85;
  transition:transform var(--t-base) var(--ease-out),color var(--t-base) ease,opacity var(--t-base) ease}
@media(hover:hover) and (pointer:fine){
  .ftr ul li a:hover .fi{color:var(--c-pop-lite);opacity:1;transform:translateX(2px)}}
.ftr .btn{color:var(--text-invert)}

.ftr-map{position:relative;margin-top:2.5rem;border-radius:22px;overflow:hidden;
  border:1px solid var(--line-invert);box-shadow:var(--shadow-3);min-height:280px;background:var(--c-herb-4)}
.ftr-map iframe{width:100%;height:100%;min-height:280px;border:0;display:block;filter:saturate(.92) contrast(1.02)}
.ftr-map-card{position:absolute;left:1.1rem;bottom:1.1rem;max-width:min(330px,calc(100% - 2.2rem));
  background:rgba(8,48,22,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid var(--line-invert);border-radius:16px;padding:1.05rem 1.15rem 1.15rem;box-shadow:var(--shadow-2)}
.ftr-map-card .fm-label{display:block;font-size:.72rem;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--c-pop-lite);margin-bottom:.35rem}
.ftr-map-card .fm-addr{margin:0 0 .85rem;color:var(--text-invert);font-size:.98rem;line-height:1.4}
.ftr-map-card .btn{width:100%}
@media(max-width:560px){
  .ftr-map{min-height:400px}
  .ftr-map iframe{min-height:400px}
  .ftr-map-card{left:.75rem;right:.75rem;bottom:.75rem;max-width:none}}

p,.lede,.head p{text-wrap:pretty}
.dish .price{background:linear-gradient(178deg,#fff,var(--c-paper));border:1px solid rgba(166,67,31,.18)}
@media(hover:hover) and (pointer:fine){
  .card:hover .ico-plate{transform:rotate(-4deg) scale(1.04)}
  .link-btn:hover .arr{transform:translateX(3px)}}
.ico-plate{transition:transform var(--t-base) var(--ease-out)}
.link-btn .arr{transition:transform var(--t-base) var(--ease-out)}
.trust .stars{text-shadow:0 1px 10px rgba(244,197,81,.35)}
.mcta{box-shadow:0 -8px 30px rgba(20,40,20,.14)}
.mcta .btn--ghost{border-color:rgba(35,40,28,.22)}
.faq-q:focus-visible{outline-offset:-2px}
.hero .hl{transition-delay:.62s}

.hero-grid>*{min-width:0}

.cta-panel{isolation:isolate}
.cta-panel::before{content:'';position:absolute;right:3%;top:50%;transform:translateY(-50%);z-index:-1;
  width:min(36%,300px);aspect-ratio:1;pointer-events:none;opacity:.09;
  background:url('/assets/branding/mark-light.webp') center/contain no-repeat}
@media(max-width:760px){.cta-panel::before{right:-6%;opacity:.07}}

.drawer-body a{gap:.85rem}
.drawer-body .fi{width:20px;height:20px;flex:none;color:var(--c-herb);opacity:.75;
  transition:transform var(--t-base) var(--ease-out),color var(--t-base) ease}
.drawer-body a[aria-current="page"] .fi{color:var(--accent-text);opacity:1}
.drawer-foot .btn--ghost{border-color:rgba(35,40,28,.26);background-color:rgba(255,255,255,.55)}

/* ---------- audit fixes ---------- */
/* ghost buttons were nearly invisible on cream */
.btn--ghost{border-color:rgba(35,40,28,.30)}
.t-herb .btn--ghost,.hero .btn--ghost,.cta-panel .btn--ghost{border-color:rgba(252,248,240,.42)}
/* Build Your Box tiles kept different heights when a meal name wrapped */
.bbx-menu{grid-auto-rows:1fr}
.bbx-item{display:flex;flex-direction:column}
.bbx-item .bi-media{flex:none}
.bbx-item .bi-b{flex:1;display:flex;flex-direction:column;justify-content:flex-start}
.bbx-item .bi-name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.1em}
/* the embedded map can be slow or blocked - never show an empty well */
.ftr-map{background:#0B3018 url('/assets/posters/kitchen.webp') center/cover no-repeat}
.ftr-map::before{content:'';position:absolute;inset:0;background:linear-gradient(100deg,rgba(8,44,22,.86),rgba(8,44,22,.55))}
.ftr-map iframe{position:relative;z-index:1}
.ftr-map-card{z-index:2}

/* ---------- QA round 2 ---------- */
/* reveal-from-right pushed elements past the viewport before they revealed */
main{overflow-x:clip}
/* a 4.7 rating should not render as five solid stars */
.star-p{background:linear-gradient(90deg,currentColor 70%,rgba(255,255,255,.28) 70%);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.rev-score .star-p{background:linear-gradient(90deg,#7E5700 70%,rgba(35,40,28,.22) 70%);
  -webkit-background-clip:text;background-clip:text}
.trust .star-p{background:linear-gradient(90deg,#F4C551 70%,rgba(252,248,240,.32) 70%);
  -webkit-background-clip:text;background-clip:text}
/* a disabled CTA must not look tappable */
.btn[disabled],.btn[aria-disabled="true"]{filter:grayscale(.55);opacity:.5;cursor:not-allowed;box-shadow:none}
.btn[disabled] .ar{display:none}
/* the running total should stay in view while you build a box */
@media(min-width:941px){.bbx-sum{position:sticky;top:126px}}
/* a link-in-bio page is already nothing but call/order buttons */
.links-page .mcta{display:none}
.links-page body{padding-bottom:0}
/* inline icon + label must not break apart mid-sentence */
.inline-ico{display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap}
.inline-ico svg{width:17px;height:17px;flex:none}
/* collapsed accordion answers are hidden from assistive tech too (see site.js) */
.faq-p[hidden]{display:none}
/* Build Your Box: dedicated remove control (buttons cannot nest, so it sits beside the tile) */
.bbx-cell{position:relative;display:flex}
.bbx-cell>.bbx-item{flex:1}
.bi-sub{position:absolute;top:.5rem;right:2.4rem;width:30px;height:30px;border-radius:50%;
  background:rgba(251,247,239,.95);color:var(--c-terra-deep);border:1px solid rgba(166,67,31,.28);
  display:none;place-items:center;cursor:pointer;box-shadow:var(--shadow-1);padding:0;z-index:2}
.bi-sub svg{width:16px;height:16px}
.bbx-cell:has(.bbx-item[data-qty]:not([data-qty="0"])) .bi-sub{display:grid}
@media(hover:hover) and (pointer:fine){.bi-sub:hover{background:var(--c-terra);color:#fff;border-color:var(--c-terra)}}
/* form: errors reported in text, required fields marked */
.field-err{margin:.35rem 0 0;font-size:.85rem;font-weight:600;color:#8A3517}
.field .req{color:var(--accent-text);font-weight:700}
.field .opt{color:var(--text-muted);font-weight:500;font-size:.82em}
.form-req-note{font-size:.82rem;color:var(--text-muted);margin:0}
.form-note--top{font-size:.9rem;color:var(--text-muted);max-width:56ch;margin-bottom:1.2rem}
.form-note--top a{color:var(--accent-text);font-weight:600}

/* ---------- header / hero rebalance ---------- */
.nav a{padding:.6rem clamp(.5rem,.9vw,1rem)}
.nav a::after{left:clamp(.5rem,.9vw,1rem);right:clamp(.5rem,.9vw,1rem)}
@media(max-width:1240px){.hdr .wrap{gap:.75rem}}
@media(max-width:1040px){.hdr .wrap{grid-template-columns:auto 1fr}}
@media(max-width:900px){.hero .wrap{padding-block:calc(90px + 1rem) clamp(1.25rem,3vh,2rem)}}
/* the menu card rides with the copy rather than hanging off the top */
.menu-card{align-self:center}
@media(max-width:940px){.menu-card{align-self:stretch;margin-top:.5rem}}
/* brand left, nav dead-center, actions right */
.hdr .brand{justify-self:start}
.hdr .hdr-cta{justify-self:end}

/* ---------- a11y round 3 ---------- */
/* a terracotta focus ring measured 1.3-2.9:1 over the hero; invert it on dark grounds */
.hero :focus-visible,.phero :focus-visible,.cta-panel :focus-visible,
.t-herb :focus-visible,.ftr :focus-visible,.hdr:not([data-stuck]) :focus-visible{
  outline:3px solid #FCF8F0;outline-offset:3px;
  box-shadow:0 0 0 6px rgba(8,44,22,.92)}
.ftr-map iframe:focus-visible,.map-frame iframe:focus-visible{outline:3px solid #FCF8F0;outline-offset:-3px}
/* keyboard focus must not land under the fixed header or the sticky mobile bar */
:where(a,button,input,select,textarea,summary,iframe,[tabindex]){scroll-margin-top:126px}
@media(max-width:768px){:where(a,button,input,select,textarea,summary,iframe,[tabindex]){scroll-margin-bottom:88px}}
/* a disabled CTA has to stay readable - it is still announced */
.btn[aria-disabled="true"]{filter:none;opacity:1;background-image:none;background-color:#DCD8CE;
  color:#414736;border-color:rgba(35,40,28,.18);box-shadow:none}
.btn[aria-disabled="true"] .ar{display:none}
/* background-clip:text has no graceful degradation - give the glyph a real color if unsupported */
@supports not ((-webkit-background-clip:text) or (background-clip:text)){
  .star-p{color:#7E5700;-webkit-text-fill-color:currentColor;background:none}
  .trust .star-p{color:#F4C551}}
/* the sticky mobile bar covers the bottom 71px - reserve it so focus never lands behind it */
@media(max-width:768px){html{scroll-padding-bottom:88px}}
@media(max-width:900px){html{scroll-padding-top:110px}}

/* social icon row: footer brand column, /contact info list, /links hero */
.social{display:flex;flex-wrap:wrap;gap:.6rem;list-style:none;margin:0;padding:0}
.social a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line);color:var(--text);background-color:transparent;transition:transform var(--t-base) var(--ease-out),border-color var(--t-base) ease,background-color var(--t-base) ease}
.social svg{width:20px;height:20px}
.social--inline{margin-top:.35rem}
.social--center{justify-content:center;margin-top:1.1rem}
.ftr .social{display:flex;flex-direction:row;gap:.6rem;margin-top:1.15rem}
.ftr .social li a,.ftr ul.social li a{display:inline-flex;padding:0}
.ftr .social a,.social--on-dark a,.t-herb .social a{border-color:rgba(252,248,240,.42);color:var(--text-invert);background-color:rgba(10,40,20,.30)}
@media(hover:hover) and (pointer:fine){
  .social a:hover{transform:translateY(-2px);border-color:var(--c-herb-2);color:var(--c-herb-2)}
  .ftr .social a:hover,.social--on-dark a:hover,.t-herb .social a:hover{background-color:rgba(252,248,240,.16);border-color:rgba(252,248,240,.8);color:var(--text-invert)}
}
@media(prefers-reduced-motion:reduce){.social a{transition:none}.social a:hover{transform:none}}