/* =========================================================
   Άριστος V2 — Market Poster
   Tokens mirror DESIGN.md (designmd export css-tailwind)
   ========================================================= */
:root{
  --color-primary:#2a7a1c;
  --color-secondary:#f4c92b;
  --color-tertiary:#7cc242;
  --color-neutral:#fbf7ec;
  --color-surface:#ffffff;
  --color-on-surface:#142615;
  --color-muted:#56634f;
  --color-rule:#ddd6c2;
  --color-error:#b3331d;

  --font-display:"Sofia Sans Extra Condensed","Arial Narrow",sans-serif;
  --font-body:"Sofia Sans","Segoe UI",sans-serif;
  --font-accent:"Literata",Georgia,serif;

  --text-display:320px;
  --text-headline-lg:112px;
  --text-headline-md:56px;
  --text-accent:28px;
  --text-body-lg:20px;
  --text-body-md:16px;
  --text-label-sm:13px;
  --tracking-label-sm:0.14em;

  --radius-md:14px;
  --radius-lg:28px;
  --radius-full:9999px;

  --spacing-xs:4px;
  --spacing-sm:8px;
  --spacing-md:16px;
  --spacing-lg:32px;
  --spacing-xl:64px;
  --spacing-xxl:120px;
  --spacing-gutter:24px;
  --spacing-margin:48px;
  --spacing-vine:112px;

  --ink:var(--color-on-surface);
  --line:2px solid var(--color-on-surface);
  --ease:cubic-bezier(.16,1,.3,1);
  --spring:cubic-bezier(.34,1.56,.64,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--color-neutral);color:var(--ink);font-family:var(--font-body);font-size:var(--text-body-md);line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden;position:relative}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p,dl,dd,ol,ul,figure,blockquote{margin:0;padding:0}
ol,ul{list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
::selection{background:var(--color-secondary);color:var(--ink)}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
html[lang="el"] body [lang="en"],html[lang="en"] body [lang="el"]{display:none !important}

/* paper speckle, like the jar label stock */
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:radial-gradient(circle at 20% 30%,rgba(20,38,21,.10) 0 1px,transparent 1.5px),radial-gradient(circle at 70% 60%,rgba(20,38,21,.07) 0 1px,transparent 1.5px),radial-gradient(circle at 45% 85%,rgba(20,38,21,.08) 0 .8px,transparent 1.3px);
  background-size:37px 41px,53px 47px,29px 31px}

section,.marquee,footer{position:relative;z-index:1}
section{padding:var(--spacing-xxl) var(--spacing-margin) var(--spacing-xxl) calc(var(--spacing-margin) + var(--spacing-vine))}
.paper{background:transparent}
.green{background:var(--color-primary);color:var(--color-neutral)}
.lemon{background:var(--color-secondary);color:var(--ink)}
.tint{background:color-mix(in srgb,var(--color-tertiary) 20%,var(--color-neutral))}

/* type */
.label{font-size:var(--text-label-sm);font-weight:700;letter-spacing:var(--tracking-label-sm);text-transform:uppercase;line-height:1.2}
.kicker{display:inline-flex;align-items:center;gap:10px;margin-bottom:var(--spacing-lg)}
.kicker::before{content:"";width:12px;height:12px;border-radius:50%;background:currentColor}
.h-xl,.h-lg,.h-md{font-family:var(--font-display);font-weight:800;text-transform:none;margin:0}
.h-xl{font-size:clamp(88px,12.5vw,200px);line-height:.84;color:var(--color-primary)}
.h-lg{font-size:clamp(64px,7.6vw,var(--text-headline-lg));line-height:.88}
.h-md{font-size:clamp(40px,3.8vw,var(--text-headline-md));line-height:.95}
.paper .h-lg,.tint .h-lg{color:var(--color-primary)}
.accent{font-family:var(--font-accent);font-style:italic;font-size:var(--text-accent);line-height:1.3}
mark{background:none;color:inherit;position:relative;white-space:nowrap}
mark::after{content:"";position:absolute;left:-.04em;right:-.04em;bottom:.06em;height:.36em;background:var(--color-secondary);z-index:-1;border-radius:4px;transform:scaleX(0);transform-origin:left;transition:transform 1.1s var(--ease) .3s}
.in mark::after,.no-js mark::after{transform:none}

.logo-mask{display:block;background-color:currentColor;aspect-ratio:456/405;-webkit-mask:url(../img/logo-mask.png) center/contain no-repeat;mask:url(../img/logo-mask.png) center/contain no-repeat}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;padding:18px 28px;border-radius:var(--radius-full);border:2px solid var(--ink);background:var(--ink);color:var(--color-neutral);text-decoration:none;cursor:pointer;font-size:var(--text-label-sm);font-weight:700;letter-spacing:var(--tracking-label-sm);text-transform:uppercase;line-height:1;transition:background .3s,color .3s,border-color .3s,transform .5s var(--spring)}
.btn::after{content:"→";transition:transform .4s var(--ease)}
.btn:hover{background:var(--color-primary);border-color:var(--color-primary);transform:translateY(-3px)}
.btn:hover::after{transform:translateX(5px)}
.btn--line{background:transparent;color:var(--ink)}
.btn--line::after{content:none}
.btn--line:hover{background:var(--ink);border-color:var(--ink);color:var(--color-neutral)}
.btn--accent{background:var(--color-secondary);border-color:var(--color-secondary);color:var(--ink)}
.btn--accent:hover{background:var(--color-neutral);border-color:var(--color-neutral);color:var(--ink)}
.lemon .btn:hover{background:var(--color-primary);border-color:var(--color-primary)}
.ctas{display:flex;gap:var(--spacing-md);flex-wrap:wrap}

/* nav */
.nav{position:fixed;z-index:50;top:14px;left:var(--spacing-margin);right:var(--spacing-margin);display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-lg);padding:8px 10px 8px 22px;border-radius:var(--radius-full);background:var(--color-surface);border:var(--line);transition:transform .6s var(--ease)}
.nav.is-hidden{transform:translateY(-140%)}
.nav__brand .logo-mask{width:58px}
.nav__links{display:flex;gap:var(--spacing-lg)}
.nav__links a{text-decoration:none;font-weight:700;font-size:15px;padding:6px 0;background:linear-gradient(var(--color-secondary),var(--color-secondary)) 0 85%/0 8px no-repeat;transition:background-size .4s var(--ease)}
.nav__links a:hover,.nav__links a.is-current{background-size:100% 8px}
.nav__end{display:flex;align-items:center;gap:var(--spacing-md)}
.nav .btn{padding:14px 20px}
.lang{display:flex;gap:2px}
.lang button{background:none;border:0;cursor:pointer;font-weight:700;font-size:13px;letter-spacing:.08em;padding:8px 10px;border-radius:var(--radius-full)}
.lang button[aria-pressed="true"]{background:var(--color-secondary)}

/* vine */
.vine{position:absolute;top:0;left:calc(var(--spacing-margin) - 26px);width:var(--spacing-vine);z-index:4;pointer-events:none;overflow:visible}
.vine__stem{fill:none;stroke:var(--ink);stroke-width:3;stroke-linecap:round}
.vine__curl{fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-dasharray:1 1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s var(--ease)}
.vine__curl.on{stroke-dashoffset:0}
.vleaf{transform-box:fill-box;transform-origin:50% 100%;transform:scale(0) rotate(-30deg);transition:transform .9s var(--spring)}
.vleaf.on{transform:none}
.vleaf .leaf__fill{fill:var(--color-tertiary);stroke:var(--ink);stroke-linejoin:round}
.vleaf .leaf__vein,.vleaf .leaf__stem{fill:none;stroke:var(--ink);stroke-linecap:round}
.vleaf .leaf__edge{display:none}

/* hero */
.hero{min-height:100vh;min-height:100svh;display:grid;grid-template-rows:auto 1fr auto;padding-top:112px;padding-bottom:var(--spacing-xl);overflow:hidden}
.hero__top{display:flex;justify-content:space-between;color:var(--color-muted)}
.hero__stage{position:relative;display:grid;align-content:center;min-height:0}
.hero__word{font-family:var(--font-display);font-weight:800;font-size:min(19.5vw,37vh,var(--text-display));line-height:.8;color:var(--color-primary);position:relative;z-index:2;letter-spacing:-.01em}
.hero__word > span{display:block}
.hero__word .w1,.hero__word .w2{display:block}
.hero__word .w2{padding-left:.22em}
.hero__top > span:last-child{display:none}
.js .hero__word .w1{transform:translateX(-110%);transition:transform 1.3s var(--ease) .1s}
.js .hero__word .w2{transform:translateX(110%);transition:transform 1.3s var(--ease) .2s}
.is-ready .hero__word .w1,.is-ready .hero__word .w2{transform:none}
.hero__sun{position:absolute;left:79%;top:50%;width:min(40vw,76vh);aspect-ratio:1;border-radius:50%;background:var(--color-secondary);translate:-50% -50%;z-index:1}
.js .hero__sun{scale:0;transition:scale 1.2s var(--spring) .35s}
.is-ready .hero__sun{scale:1}
.hero__jar{position:absolute;left:79%;top:50%;height:min(78vh,165%);width:auto;translate:-50% -47%;z-index:3;filter:drop-shadow(0 30px 24px rgba(20,38,21,.28))}
.js .hero__jar{opacity:0;translate:-50% -20%;transition:opacity .8s ease .6s,translate 1.4s var(--ease) .6s}
.is-ready .hero__jar{opacity:1;translate:-50% -47%}
.seal{position:absolute;right:0;top:-3%;width:clamp(120px,11vw,170px);z-index:4}
.seal__bg{fill:var(--color-surface);stroke:var(--ink);stroke-width:2}
.seal__spin{transform-origin:100px 100px;animation:spin 22s linear infinite}
.seal__spin text{font-family:var(--font-body);font-weight:700;font-size:15.2px;letter-spacing:3.4px;fill:var(--ink)}
.seal__num{font-family:var(--font-display);font-weight:800;font-size:78px;fill:var(--color-primary)}
.seal__sub{font-family:var(--font-body);font-weight:700;font-size:11px;letter-spacing:2px;fill:var(--ink)}
.js .seal{scale:0;rotate:-60deg;transition:scale .9s var(--spring) 1.1s,rotate 1.2s var(--ease) 1.1s}
.is-ready .seal{scale:1;rotate:0deg}
@keyframes spin{to{transform:rotate(360deg)}}
.hero__foot{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--spacing-gutter);align-items:end;position:relative;z-index:5}
.hero__say{grid-column:1 / span 4;font-size:clamp(22px,2vw,var(--text-accent))}
.hero__deck{grid-column:5 / span 4;display:grid;gap:var(--spacing-md)}
.hero__deck p{font-size:18px}
.js .hero__foot,.js .hero__top{opacity:0;transition:opacity 1s ease .9s}
.is-ready .hero__foot,.is-ready .hero__top{opacity:1}

/* marquee */
.marquee{overflow:hidden;border-block:var(--line);padding:18px 0;transform:rotate(-1.2deg) scale(1.02);z-index:6}
.marquee__track{display:flex;align-items:center;gap:var(--spacing-lg);width:max-content;animation:slide 36s linear infinite;font-family:var(--font-display);font-weight:800;font-size:44px;line-height:1}
.marquee i{width:18px;height:18px;border-radius:50%;background:var(--color-secondary);flex:none}
@keyframes slide{to{transform:translateX(-50%)}}

/* intro */
.intro__text{font-family:var(--font-accent);font-size:clamp(30px,3.5vw,52px);line-height:1.2;letter-spacing:-.01em;max-width:24ch;max-width:min(1100px,100%)}
.intro__text em{font-style:italic;background:linear-gradient(var(--color-secondary),var(--color-secondary)) 0 88%/100% .32em no-repeat}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-gutter);margin-top:var(--spacing-xl)}
.tile{background:var(--color-surface);border:var(--line);border-radius:var(--radius-lg);padding:var(--spacing-lg);display:grid;gap:var(--spacing-sm);align-content:start;transition:background .3s,rotate .6s var(--spring),translate .6s var(--spring)}
.tile:hover{rotate:-1.5deg;translate:0 -6px}
.tile b{font-family:var(--font-display);font-weight:800;font-size:clamp(72px,7.5vw,120px);line-height:.85;color:var(--color-primary)}
.tile .label{color:var(--color-muted)}
.tile--lemon{background:var(--color-secondary)}
.tile--lemon b,.tile--lemon .label{color:var(--ink)}

/* formats */
.lineup{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--spacing-gutter);margin-top:var(--spacing-xl);align-items:end}
.lineup__shelf{grid-column:1 / span 7;display:grid;grid-template-columns:1.25fr 1fr .8fr;align-items:end;gap:var(--spacing-md);border-bottom:3px solid var(--color-neutral);padding-bottom:0}
.pack{background:none;border:0;padding:0;cursor:pointer;display:grid;justify-items:center;gap:var(--spacing-md);color:inherit;position:relative}
.pack__obj{height:380px;display:flex;align-items:flex-end;justify-content:center;position:relative;transition:transform .7s var(--spring);transform-origin:50% 100%}
.pack__obj::before{content:"";position:absolute;bottom:-6%;left:50%;width:118%;aspect-ratio:1;border-radius:50%;background:var(--color-secondary);translate:-50% 0;scale:0;transition:scale .7s var(--spring);z-index:0}
.pack__obj > *{position:relative;z-index:1;height:100%;width:auto}
.pack__obj--5{height:300px}
.pack__obj--300{height:210px}
.pack:hover .pack__obj{transform:rotate(-3deg)}
.pack[aria-selected="true"] .pack__obj{transform:scale(1.04)}
.pack[aria-selected="true"] .pack__obj::before{scale:1}
.pack__name{font-family:var(--font-display);font-weight:800;font-size:40px;line-height:1;padding:10px 18px 14px;order:2;opacity:.55;transition:opacity .3s}
.pack[aria-selected="true"] .pack__name{opacity:1}
.lineup__shelf{overflow:hidden;padding-top:var(--spacing-lg)}
.pack{padding-bottom:0}
.pack__obj{order:1;margin-bottom:-2px}
.lineup__detail{grid-column:9 / span 4;display:grid;gap:var(--spacing-lg);align-content:end}
.lineup__detail article{display:none;gap:var(--spacing-md);justify-items:start}
.lineup[data-active="10"] [data-pack-detail="10"],.lineup[data-active="5"] [data-pack-detail="5"],.lineup[data-active="300"] [data-pack-detail="300"]{display:grid;animation:rise .7s var(--ease)}
.lineup__detail article p{font-size:var(--text-body-lg);max-width:34ch}
@keyframes rise{from{opacity:0;transform:translateY(24px)}}
.spec{display:grid;border-top:2px solid currentColor}
.spec div{display:flex;justify-content:space-between;gap:var(--spacing-md);padding:12px 0;border-bottom:1px solid color-mix(in srgb,currentColor 35%,transparent)}
.spec dt{font-size:var(--text-label-sm);font-weight:700;letter-spacing:var(--tracking-label-sm);text-transform:uppercase;opacity:.75;flex:none}
.spec dd{text-align:right}

/* harvest */
.harvest{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--spacing-gutter);align-items:center}
.harvest__dial{grid-column:1 / span 6;position:relative}
.harvest__dial svg{width:100%;max-width:620px;margin-inline:auto;overflow:visible}
.harvest__text{grid-column:8 / span 5}
.dial__ring{fill:none;stroke:var(--color-surface);stroke-width:64}
.dial__edge{fill:none;stroke:var(--ink);stroke-width:2}
.dial__harvest{fill:none;stroke:var(--color-secondary);stroke-width:64}
.dial__tick{stroke:var(--ink);stroke-width:2}
.dial__m{font-family:var(--font-body);font-weight:700;font-size:15px;letter-spacing:2px;fill:var(--color-muted);text-anchor:middle}
.dial__m.is-h{fill:var(--ink)}
.dial__spin{transition:transform .2s linear}
.dial__big{font-family:var(--font-display);font-weight:800;font-size:92px;fill:var(--color-primary);text-anchor:middle}
.dial__small{font-family:var(--font-body);font-weight:700;font-size:13px;letter-spacing:3px;fill:var(--ink);text-anchor:middle}
.dial__hand{fill:var(--ink)}
.steps{display:grid;margin-top:var(--spacing-lg);border-top:var(--line)}
.steps li{display:grid;grid-template-columns:72px 1fr;align-items:start;padding:18px 0;border-bottom:1px solid var(--color-rule)}
.steps b{font-family:var(--font-display);font-weight:800;font-size:56px;line-height:.9;color:var(--color-primary)}
.steps h3{font-size:22px;font-weight:700}
.steps p{color:var(--color-muted)}

/* private label */
.pl{overflow:hidden}
.studio{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--spacing-gutter);align-items:center;margin-top:var(--spacing-lg)}
.studio__preview{grid-column:1 / span 6;position:relative;height:min(76vh,700px);display:grid;place-items:center}
.studio__disc{position:absolute;width:min(92%,640px);aspect-ratio:1;border-radius:50%;background:var(--color-surface);border:var(--line)}
.mock{grid-area:1/1;height:86%;width:auto;position:relative;transition:opacity .5s ease,transform .8s var(--spring)}
.studio__preview[data-pack="300"] .mock--pail,.studio__preview:not([data-pack="300"]) .mock--jar{opacity:0;transform:translateY(40px) scale(.9);pointer-events:none}
.studio__preview[data-pack="5"] .mock--pail{transform:scale(.84) translateY(8%)}
.studio__switch{position:absolute;left:50%;bottom:0;translate:-50% 0;display:flex;background:var(--color-surface);border:var(--line);border-radius:var(--radius-full);padding:4px;z-index:3}
.studio__switch button{border:0;background:none;cursor:pointer;padding:10px 16px;border-radius:var(--radius-full);font-size:var(--text-label-sm);font-weight:700;letter-spacing:.1em;text-transform:uppercase;transition:background .3s,color .3s}
.studio__switch button[aria-pressed="true"]{background:var(--ink);color:var(--color-neutral)}
.studio__controls{grid-column:8 / span 5;display:grid;gap:var(--spacing-lg)}
.bigfield{display:grid;gap:10px}
.bigfield input{width:100%;background:transparent;border:0;border-bottom:3px solid var(--ink);border-radius:0;padding:4px 0 10px;font-family:var(--font-accent);font-style:italic;font-size:clamp(34px,3.4vw,52px);outline:none}
.bigfield input::placeholder{color:var(--ink);opacity:.38}
.chips{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.chips legend{width:100%;margin-bottom:12px;padding:0}
.chips label{cursor:pointer}
.chips input{position:absolute;opacity:0;pointer-events:none}
.chips label > span{display:inline-block;padding:10px 18px;border-radius:var(--radius-full);border:var(--line);font-weight:700;background:transparent;transition:background .25s,color .25s,transform .4s var(--spring)}
.chips label:hover > span{transform:translateY(-2px)}
.chips input:checked + span{background:var(--ink);color:var(--color-neutral)}
.chips input:focus-visible + span{outline:3px solid var(--ink);outline-offset:3px}
.swatches label > span{width:46px;height:46px;padding:0;background:linear-gradient(135deg,var(--a) 50%,var(--b) 50%)}
.swatches input:checked + span{background:linear-gradient(135deg,var(--a) 50%,var(--b) 50%);box-shadow:0 0 0 3px var(--color-secondary),0 0 0 6px var(--ink)}
.t-italic{font-family:var(--font-accent);font-style:italic;font-weight:400 !important}
.t-serif{font-family:var(--font-accent);font-weight:400 !important}
.pl__points{display:grid;gap:8px;padding-top:var(--spacing-md);border-top:var(--line)}
.pl__points li{display:flex;gap:12px;align-items:baseline}
.pl__points li::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--ink);flex:none}
.studio__controls .btn{justify-self:start}

/* range */
.prod{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--spacing-gutter);align-items:center;margin-top:var(--spacing-xl)}
.prod__art{grid-column:1 / span 5;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;border:var(--line);overflow:hidden;transition:rotate .9s var(--spring)}
.prod:hover .prod__art{rotate:-4deg}
.prod__art--lemon{background:var(--color-secondary)}
.prod__art--leaf{background:color-mix(in srgb,var(--color-tertiary) 45%,var(--color-neutral))}
.prod__art svg{width:66%;height:auto}
.prod__body{grid-column:7 / span 6;display:grid;gap:var(--spacing-md);justify-items:start}
.prod__body .label{color:var(--color-muted)}
.prod__body .h-md{color:var(--color-primary);font-size:clamp(48px,5vw,80px)}
.prod__body p{font-size:var(--text-body-lg);max-width:46ch}
.prod__body .spec{width:100%;max-width:560px}
.prod--flip .prod__art{grid-column:8 / span 5;order:2}
.prod--flip .prod__body{grid-column:1 / span 6;order:1}

/* origins */
.origins{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--spacing-gutter);align-items:center;overflow:hidden}
.origins__text{grid-column:1 / span 5;display:grid;justify-items:start}
.origins__list{display:grid;width:100%;margin:var(--spacing-lg) 0;border-top:var(--line)}
.origins__list li{display:flex;justify-content:space-between;align-items:baseline;gap:var(--spacing-md);padding:16px 12px;border-bottom:1px solid color-mix(in srgb,var(--ink) 25%,transparent);border-radius:var(--radius-md);transition:background .25s}
.origins__list b{font-size:22px}
.origins__list li.is-on{background:var(--color-secondary)}
.origins__map{grid-column:7 / span 6}
.origins__map svg{width:100%;height:auto;max-height:100vh;overflow:hidden}
.origins .land{fill:var(--color-tertiary);stroke:var(--ink);stroke-width:2;stroke-linejoin:round}
.origins .routes path{fill:none;stroke:var(--ink);stroke-width:2.5;stroke-dasharray:3 12;stroke-linecap:round;animation:march 30s linear infinite}
@keyframes march{to{stroke-dashoffset:-600}}
.pin{cursor:pointer}
.pin circle{fill:var(--ink)}
.pin .pin__disc{fill:var(--color-secondary);stroke:var(--ink);stroke-width:2;transform-box:fill-box;transform-origin:center;transition:transform .5s var(--spring)}
.pin.is-on .pin__disc{transform:scale(1.5)}
.pin text{font-family:var(--font-display);font-weight:800;font-size:44px;fill:var(--ink)}

/* story */
.story .h-xl{margin-bottom:var(--spacing-xl)}
.story__grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--spacing-gutter);align-items:start}
.story__lead{grid-column:1 / span 5;font-size:var(--text-body-lg)}
.snap{background:var(--color-surface);border:var(--line);padding:14px 14px 0;display:grid;gap:10px;transition:rotate .6s var(--spring),translate .6s var(--spring)}
.snap:hover{rotate:0deg !important;translate:0 -8px}
.snap__img{aspect-ratio:4/5;background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--color-tertiary) 30%,var(--color-neutral)) 0 16px,var(--color-neutral) 16px 32px)}
.snap figcaption{font-family:var(--font-accent);font-style:italic;font-size:15px;padding:0 0 14px;color:var(--color-muted)}
.snap--a{grid-column:7 / span 3;rotate:-3deg}
.snap--b{grid-column:10 / span 3;rotate:2.5deg;margin-top:var(--spacing-xl)}
.story__quote{grid-column:1 / span 6;margin-top:var(--spacing-lg);font-size:clamp(26px,2.5vw,38px);line-height:1.25;color:var(--color-primary)}
.timeline{display:flex;align-items:center;gap:var(--spacing-md);margin-top:var(--spacing-xl);font-family:var(--font-display);font-weight:800;font-size:56px;line-height:1;color:var(--color-primary)}
.timeline i{flex:1;height:0;border-top:3px dashed var(--ink);position:relative}
.timeline i::after{content:"";position:absolute;right:-2px;top:-11px;width:18px;height:18px;border-radius:50%;background:var(--color-secondary);border:var(--line)}

/* trade */
.buyers{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-gutter);margin-top:var(--spacing-xl)}
.buyers li{background:var(--color-neutral);color:var(--ink);border-radius:var(--radius-lg);padding:var(--spacing-lg);min-height:220px;display:grid;grid-template-rows:auto 1fr auto;gap:var(--spacing-sm);transition:background .3s,translate .5s var(--spring),rotate .5s var(--spring)}
.buyers li:hover{background:var(--color-secondary);translate:0 -8px;rotate:-1deg}
.buyers i{font-style:normal;font-family:var(--font-display);font-weight:800;font-size:34px;color:var(--color-primary);line-height:1}
.buyers b{font-family:var(--font-display);font-weight:800;font-size:clamp(34px,3vw,46px);line-height:.95;align-self:end;text-transform:uppercase}
.buyers li > span{font-size:var(--text-label-sm);font-weight:700;letter-spacing:var(--tracking-label-sm);text-transform:uppercase;color:var(--color-muted)}
.buyers li:hover > span{color:var(--ink)}
.terms{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-gutter);margin-top:var(--spacing-xl);border-top:2px solid var(--color-neutral);padding-top:var(--spacing-lg)}
.terms dt{font-size:var(--text-label-sm);font-weight:700;letter-spacing:var(--tracking-label-sm);text-transform:uppercase;color:var(--color-secondary);margin-bottom:8px}
.terms dd{font-size:18px;max-width:34ch}

/* quote */
.quote{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--spacing-gutter);align-items:start}
.quote__side{grid-column:1 / span 5;display:grid;gap:var(--spacing-md);justify-items:start}
.quote__side p{font-size:var(--text-body-lg)}
.contact{display:grid;gap:10px;margin-top:var(--spacing-md)}
.contact a{font-family:var(--font-display);font-weight:800;font-size:40px;line-height:1;text-decoration:none;background:linear-gradient(var(--color-secondary),var(--color-secondary)) 0 90%/0 .3em no-repeat;transition:background-size .5s var(--ease)}
.contact a:hover{background-size:100% .3em}
.qform{grid-column:7 / span 6;display:grid;gap:var(--spacing-lg);background:var(--color-surface);border:var(--line);padding:var(--spacing-xl) var(--spacing-lg);border-radius:var(--radius-lg)}
.qform__row{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-lg)}
.field{display:grid;gap:8px}
.field .label{color:var(--color-muted)}
.field input,.field select,.field textarea{width:100%;background:var(--color-neutral);border:2px solid var(--color-rule);border-radius:var(--radius-md);padding:14px 16px;font-size:17px;outline:none;transition:border-color .2s,background .2s}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--ink);background:var(--color-surface)}
.field textarea{resize:vertical}
.is-invalid input,.is-invalid select{border-color:var(--color-error)}
.is-invalid > .label,.check.is-invalid{color:var(--color-error)}
.qform__end{display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-lg)}
.check{display:flex;gap:12px;font-size:14px;color:var(--color-muted);max-width:42ch;cursor:pointer}
.check input{accent-color:var(--color-primary);width:18px;height:18px;margin-top:2px;flex:none}
.qform__msg{min-height:1.2em;font-weight:700;color:var(--color-primary)}
.qform__msg.err{color:var(--color-error)}
.qform.is-sent > *:not(.qform__msg){opacity:.3;pointer-events:none}

/* footer */
.foot{padding:var(--spacing-xxl) var(--spacing-margin) var(--spacing-lg) calc(var(--spacing-margin) + var(--spacing-vine));display:grid;gap:var(--spacing-xl);border-top:var(--line)}
.foot__top{display:flex;align-items:center;gap:var(--spacing-xl)}
.foot__mark{width:min(34vw,460px);flex:none}
.foot__top .accent{font-size:clamp(34px,4vw,60px);line-height:1.1}
.foot__cols{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-gutter);border-top:var(--line);padding-top:var(--spacing-lg)}
.foot__cols .label{display:block;margin-bottom:var(--spacing-md)}
.foot__cols p{line-height:1.9}
.foot__cols a{text-decoration:none}
.foot__cols a:hover{text-decoration:underline}
.foot__base{display:flex;justify-content:space-between;border-top:var(--line);padding-top:var(--spacing-md)}

/* reveal */
.js .reveal{opacity:0;transform:translateY(46px);transition:opacity .8s ease,transform 1.1s var(--ease)}
.js .reveal.in{opacity:1;transform:none}
.js .facts .reveal:nth-child(2),.js .buyers .reveal:nth-child(3n+2),.js .steps .reveal:nth-child(2){transition-delay:.1s}
.js .facts .reveal:nth-child(3),.js .buyers .reveal:nth-child(3n),.js .steps .reveal:nth-child(3){transition-delay:.2s}
.js .h-lg,.js .h-xl{clip-path:inset(0 0 100% 0);transform:translateY(.25em);transition:clip-path 1.1s var(--ease),transform 1.1s var(--ease)}
.js .h-lg.in,.js .h-xl.in{clip-path:inset(-10% -5% -10% -5%);transform:none}
.botanic .d{stroke-dasharray:1 1;stroke-dashoffset:1}
.in .botanic .d{stroke-dashoffset:0;transition:stroke-dashoffset var(--dur,1.6s) var(--ease) var(--d,0s)}

@media (max-width:1100px){
  :root{--spacing-vine:0px;--spacing-margin:24px;--spacing-xxl:88px}
  .vine{display:none}
  .nav__links{display:none}
  .hero__say,.hero__deck{grid-column:1 / -1}
  .facts,.buyers,.terms{grid-template-columns:1fr}
  .lineup__shelf,.lineup__detail,.harvest__dial,.harvest__text,.studio__preview,.studio__controls,.prod__art,.prod__body,.prod--flip .prod__art,.prod--flip .prod__body,.origins__text,.origins__map,.story__lead,.snap--a,.snap--b,.story__quote,.quote__side,.qform{grid-column:1 / -1}
  .pack__obj{height:240px}.pack__obj--5{height:190px}.pack__obj--300{height:140px}
  .qform__row{grid-template-columns:1fr}
  .qform__end{flex-direction:column;align-items:flex-start}
  .foot__top{flex-direction:column;align-items:flex-start}
  .foot__cols{grid-template-columns:1fr 1fr}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important}
  .js .reveal,.js .hero__word .w1,.js .hero__word .w2,.js .hero__foot,.js .hero__top{opacity:1;transform:none}
  .js .hero__sun,.js .seal{scale:1;rotate:0deg}
  .js .hero__jar{opacity:1;translate:-50% -47%}
  .js .h-lg,.js .h-xl{clip-path:none;transform:none}
  .vleaf{transform:none}
  .vine__curl,.botanic .d{stroke-dasharray:none;stroke-dashoffset:0}
  mark::after{transform:none}
}

/* generic leaf drawing colours */
.leaf__fill{fill:var(--color-tertiary)}
.leaf__edge,.leaf__vein,.leaf__stem{fill:none;stroke:var(--color-on-surface);stroke-linecap:round;stroke-linejoin:round}

/* inner pages */
.more{font-weight:700;text-decoration:none;justify-self:start;background:linear-gradient(currentColor,currentColor) 0 100%/100% 2px no-repeat;padding-bottom:4px}
.more:hover{background-size:0 2px;background-position:100% 100%;transition:background-size .5s var(--ease)}
.crumbs{display:flex;gap:10px;align-items:center;color:var(--color-muted);margin-bottom:var(--spacing-lg)}
.crumbs a{text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.crumbs i{font-style:normal;opacity:.5}
.lemon .crumbs{color:var(--ink)}
.phero{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--spacing-gutter);align-items:center;padding-top:150px;min-height:92vh;overflow:hidden}
.phero__text{grid-column:1 / span 8;display:grid;gap:var(--spacing-lg);justify-items:start;position:relative;z-index:2}
.phero .h-xl{font-size:clamp(80px,10.4vw,176px)}
.phero .accent{max-width:26ch}
.phero__art{grid-column:9 / span 4;position:relative;display:grid;place-items:center;min-height:70vh}
.phero__sun{position:absolute;width:min(40vw,640px);aspect-ratio:1;border-radius:50%;background:var(--color-secondary)}
.phero__art img{position:relative;height:min(72vh,680px);width:auto;rotate:4deg;filter:drop-shadow(0 30px 24px rgba(20,38,21,.28))}
.prose__cols{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-xl);margin-top:var(--spacing-xl);font-size:var(--text-body-lg);max-width:1100px}
.sheet{display:grid;grid-template-columns:repeat(3,1fr);margin-top:var(--spacing-xl);background:var(--color-surface);border:var(--line);border-radius:var(--radius-lg);overflow:hidden}
.sheet div{padding:var(--spacing-lg);border-right:1px solid var(--color-rule);border-bottom:1px solid var(--color-rule);display:grid;gap:8px;align-content:start}
.sheet dt{font-size:var(--text-label-sm);font-weight:700;letter-spacing:var(--tracking-label-sm);text-transform:uppercase;color:var(--color-muted)}
.sheet dd{font-family:var(--font-display);font-weight:800;font-size:34px;line-height:1;color:var(--color-primary);text-transform:uppercase}
.use .h-xl{color:var(--ink)}
.use__text{font-size:clamp(22px,2vw,28px);max-width:34ch;margin-top:var(--spacing-lg);line-height:1.4}
.faq__list{margin-top:var(--spacing-xl);max-width:980px;border-top:var(--line)}
.faq details{border-bottom:1px solid var(--color-rule)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:var(--spacing-lg);align-items:center;padding:22px 0;font-size:24px;font-weight:700}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;width:40px;height:40px;border-radius:50%;border:var(--line);display:grid;place-items:center;font-size:24px;line-height:1;transition:background .25s,rotate .4s var(--spring)}
.faq details[open] summary::after{background:var(--color-secondary);rotate:45deg}
.faq summary:hover::after{background:var(--color-secondary)}
.faq details p{padding:0 64px 26px 0;font-size:var(--text-body-lg);max-width:60ch;color:var(--color-muted)}
.plhero{padding-top:150px;overflow:hidden}
.plhero .h-xl{color:var(--ink)}
.plhero__deck{font-size:var(--text-body-lg);max-width:52ch;margin-top:var(--spacing-lg)}
.how__steps{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-gutter);margin-top:var(--spacing-xl)}
.how__steps li{border-top:3px solid var(--color-neutral);padding-top:var(--spacing-md);display:grid;gap:8px;align-content:start}
.how__steps b{font-family:var(--font-display);font-weight:800;font-size:120px;line-height:.85;color:var(--color-secondary)}
.how__steps h3{font-family:var(--font-display);font-weight:800;font-size:44px;line-height:1;text-transform:uppercase}
.how__steps p{font-size:18px;max-width:24ch}
.who__chips{display:flex;flex-wrap:wrap;gap:var(--spacing-md);margin-top:var(--spacing-xl)}
.who__chips li{font-family:var(--font-display);font-weight:800;font-size:clamp(36px,3.6vw,56px);line-height:1;text-transform:uppercase;padding:18px 30px 22px;border:var(--line);border-radius:var(--radius-full);background:var(--color-surface);transition:background .25s,rotate .5s var(--spring)}
.who__chips li:nth-child(even){background:var(--color-tertiary)}
.who__chips li:hover{background:var(--color-secondary);rotate:-2deg}
@media (max-width:1100px){
  .phero__text,.phero__art{grid-column:1 / -1}
  .prose__cols,.sheet,.how__steps{grid-template-columns:1fr}
}

/* more pages */
main > section:first-child:not(.hero):not(.phero):not(.plhero){padding-top:170px}
.more--block{display:inline-block;margin-top:var(--spacing-xl)}
.phero__sun--leaf{background:color-mix(in srgb,var(--color-tertiary) 45%,var(--color-neutral));border:var(--line)}
.phero__sun--lemon{border:var(--line)}
.phero__art svg{position:relative;width:min(78%,400px);height:auto}
.prod__art{text-decoration:none}
.prod__art img{height:82%;width:auto;rotate:5deg;filter:drop-shadow(0 20px 18px rgba(20,38,21,.25))}
.plist .h-xl,.legal .h-xl{margin-bottom:0}
.plist .plhero__deck{margin-bottom:var(--spacing-lg)}
.who.green .who__chips li{color:var(--ink)}
.band{display:grid;justify-items:start;gap:var(--spacing-lg)}
.band .h-xl{color:var(--ink)}
.band .use__text{margin-top:0}
.how__steps--3{grid-template-columns:repeat(3,1fr)}
.facts--4{grid-template-columns:repeat(4,1fr)}
a.tile{text-decoration:none;color:inherit}
a.tile:hover{background:var(--color-secondary)}
.tile__sm{font-size:clamp(34px,3vw,48px) !important;line-height:1 !important;text-transform:uppercase}
.tile__xs{font-size:clamp(24px,2vw,32px) !important;text-transform:none;word-break:break-all}
.legal{max-width:calc(900px + var(--spacing-margin) + var(--spacing-vine))}
.legal__note{margin:var(--spacing-lg) 0 var(--spacing-xl);padding:var(--spacing-md) var(--spacing-lg);background:var(--color-secondary);border-radius:var(--radius-md);font-weight:700}
.legal h2{color:var(--color-primary);margin:var(--spacing-xl) 0 var(--spacing-md);scroll-margin-top:120px}
.legal p{font-size:var(--text-body-lg);margin-bottom:var(--spacing-md);max-width:62ch}
.cookie{position:fixed;left:var(--spacing-lg);bottom:var(--spacing-lg);z-index:60;max-width:440px;background:var(--color-surface);border:var(--line);border-radius:var(--radius-lg);padding:var(--spacing-lg);display:grid;gap:var(--spacing-md);font-size:15px;translate:0 24px;opacity:0;transition:translate .7s var(--spring),opacity .4s}
.cookie[hidden]{display:none}
.cookie.is-in{translate:0 0;opacity:1}
.cookie div{display:flex;gap:10px;flex-wrap:wrap}
.cookie .btn{padding:13px 18px}
.cookie .btn::after{content:none}
@media (max-width:1100px){.how__steps--3,.facts--4{grid-template-columns:1fr}}

/* mobile pass */
.nav__toggle,.mbar{display:none}
@media (max-width:1100px){
  .nav{flex-wrap:wrap}
  .nav__toggle{display:grid;place-content:center;gap:6px;width:46px;height:46px;border-radius:50%;border:var(--line);background:var(--color-secondary);cursor:pointer;padding:0}
  .nav__toggle i{display:block;width:18px;height:2px;background:var(--ink);transition:transform .35s var(--ease)}
  .nav.is-open .nav__toggle i:first-child{transform:translateY(4px) rotate(45deg)}
  .nav.is-open .nav__toggle i:last-child{transform:translateY(-4px) rotate(-45deg)}
  .nav{border-radius:34px}
  .nav.is-open .nav__links{display:flex;flex-direction:column;gap:0;order:3;width:100%;padding:8px 4px 10px;border-top:1px solid var(--color-rule);margin-top:8px}
  .nav.is-open .nav__links a{font-family:var(--font-display);font-weight:800;font-size:34px;line-height:1;text-transform:uppercase;padding:12px 8px;border-bottom:1px solid var(--color-rule)}
  .nav.is-open .nav__links a:last-child{border-bottom:0}
  .nav.is-open{transform:none !important}
}
@media (max-width:700px){
  :root{--spacing-margin:18px;--spacing-xxl:72px;--spacing-xl:40px;--spacing-lg:24px}
  body{font-size:16px}
  .nav{top:10px;left:10px;right:10px;padding:6px 6px 6px 14px;gap:8px}
  .nav__brand .logo-mask{width:46px}
  .nav__end{gap:6px}
  .nav__end > .btn{display:none}
  .lang button{padding:8px}
  .h-xl,.phero .h-xl{font-size:16.5vw;line-height:.86}
  .h-lg{font-size:12.6vw;line-height:.9}
  .h-md,.prod__body .h-md{font-size:10vw}
  .accent{font-size:22px}
  .kicker{margin-bottom:var(--spacing-md)}
  .btn{padding:16px 22px}
  main > section:first-child:not(.hero):not(.phero):not(.plhero),.phero,.plhero{padding-top:104px}

  /* hero */
  .hero{min-height:0;padding-top:96px;padding-bottom:var(--spacing-xl);display:block}
  .hero__top{font-size:11px;margin-bottom:var(--spacing-md)}
  .hero__stage{display:block;padding-bottom:104vw}
  .hero__word{font-size:26vw}
  .hero__word .w2{padding-left:0}
  .hero__sun{left:50%;top:auto;bottom:6vw;width:84vw;translate:-50% 0}
  .hero__jar,.js .hero__jar,.is-ready .hero__jar{left:50%;top:auto;bottom:0;height:98vw;translate:-50% 0}
  .seal{right:0;top:auto;bottom:66vw;width:104px}
  .hero__foot{display:grid;gap:var(--spacing-lg);margin-top:var(--spacing-lg)}
  .hero__deck p{font-size:17px}
  .ctas{gap:10px}
  .marquee{padding:12px 0}
  .marquee__track{font-size:28px;gap:var(--spacing-md)}
  .marquee i{width:12px;height:12px}

  .intro__text{font-size:27px}
  .tile{padding:22px}
  .tile b{font-size:72px}

  /* formats */
  .lineup{margin-top:var(--spacing-lg);gap:var(--spacing-lg)}
  .lineup__shelf{grid-template-columns:1.2fr 1fr .8fr;gap:6px}
  .pack__obj{height:150px}.pack__obj--5{height:118px}.pack__obj--300{height:92px}
  .pack__name{font-size:26px;padding:8px 6px 10px}
  .lineup__detail article p,.prod__body p,.story__lead,.quote__side p,.legal p,.faq details p,.plhero__deck{font-size:17px}
  .spec div{flex-direction:column;gap:2px}
  .spec dd{text-align:left}

  /* harvest */
  .harvest{gap:var(--spacing-lg)}
  .dial__big{font-size:84px}
  .steps li{grid-template-columns:52px 1fr}
  .steps b{font-size:44px}

  /* studio */
  .studio{gap:var(--spacing-lg)}
  .studio__preview{height:112vw}
  .studio__disc{width:92%}
  .bigfield input{font-size:30px}
  .chips label > span{padding:10px 15px}
  .studio__switch button{padding:10px 12px;font-size:11px}

  /* products */
  .prod{margin-top:var(--spacing-lg);gap:var(--spacing-md)}
  .prod__art,.prod--flip .prod__art{order:0;max-width:78vw;margin-inline:auto;width:100%}
  .prod--flip .prod__body{order:1}

  /* origins */
  .origins__list li{flex-direction:column;gap:2px;padding:12px 8px}
  .pin text{font-size:56px}

  /* story */
  .story .h-xl{margin-bottom:var(--spacing-lg)}
  .snap{max-width:72vw}
  .snap--b{margin-top:0;margin-left:auto}
  .story__quote{font-size:24px;margin-top:0}
  .timeline{font-size:34px;margin-top:var(--spacing-lg)}

  /* trade */
  .buyers{margin-top:var(--spacing-lg);gap:12px}
  .buyers li{min-height:0;padding:20px;grid-template-rows:auto auto auto}
  .buyers b{font-size:32px}
  .terms{margin-top:var(--spacing-lg);gap:var(--spacing-md)}

  /* quote */
  .qform{padding:var(--spacing-lg) 18px;border-radius:20px;gap:18px}
  .qform__row{gap:18px}
  .contact a{font-size:30px;word-break:break-word}
  .qform .btn{width:100%;justify-content:center}

  /* inner pages */
  .phero{min-height:0;gap:var(--spacing-lg)}
  .phero__art{min-height:88vw}
  .phero__sun{width:82vw}
  .phero__art img{height:92vw}
  .prose__cols{gap:var(--spacing-md);margin-top:var(--spacing-lg);font-size:17px}
  .sheet{margin-top:var(--spacing-lg);border-radius:20px}
  .sheet div{padding:18px;border-right:0}
  .sheet dd{font-size:28px}
  .use__text{font-size:20px}
  .faq__list{margin-top:var(--spacing-lg)}
  .faq summary{font-size:19px;padding:18px 0;gap:var(--spacing-md)}
  .faq details p{padding-right:0}
  .how__steps{margin-top:var(--spacing-lg)}
  .how__steps b{font-size:84px}
  .how__steps h3{font-size:36px}
  .who__chips{gap:10px;margin-top:var(--spacing-lg)}
  .who__chips li{font-size:28px;padding:12px 20px 15px}
  .facts{margin-top:var(--spacing-lg);gap:12px}
  .tile__sm{font-size:36px !important}
  .tile__xs{font-size:24px !important}
  .legal__note{margin:var(--spacing-md) 0 var(--spacing-lg)}
  .legal h2{margin-top:var(--spacing-lg)}
  .crumbs{flex-wrap:wrap;margin-bottom:var(--spacing-md);font-size:11px}

  /* footer + fixed bars */
  .foot{padding:var(--spacing-xxl) var(--spacing-margin) 96px}
  .foot__mark{width:62vw}
  .foot__top .accent{font-size:30px}
  .foot__cols{grid-template-columns:1fr;gap:var(--spacing-lg)}
  .foot__base{flex-direction:column;gap:6px}
  .mbar{display:grid;grid-template-columns:1fr 1fr 1.25fr;position:fixed;left:10px;right:10px;bottom:10px;z-index:55;background:var(--color-surface);border:var(--line);border-radius:var(--radius-full);padding:4px;gap:4px}
  .mbar a{display:grid;place-items:center;min-height:46px;border-radius:var(--radius-full);text-decoration:none;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
  .mbar__main{background:var(--ink);color:var(--color-neutral)}
  .cookie{left:10px;right:10px;bottom:76px;max-width:none;padding:18px;border-radius:20px}
}
@media (max-width:1100px){
  .harvest__text{display:contents}
  .harvest__text > *{grid-column:1 / -1}
  .harvest__text .kicker{order:1;margin-bottom:0;justify-self:start}
  .harvest__text .h-lg{order:2}
  .harvest__dial{order:3}
  .harvest__text .steps{order:4;margin-top:0}
}
@media (max-width:700px){
  .studio__switch{white-space:nowrap}
  .studio__switch button{padding:10px 11px;letter-spacing:.06em}
}

/* nutrition */
.nutri{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--spacing-xl);margin-top:var(--spacing-xl);align-items:start}
.nutri__card{background:var(--color-surface);border:var(--line);border-radius:var(--radius-lg);overflow:hidden}
.nutri table{width:100%;border-collapse:collapse}
.nutri caption{caption-side:top;background:var(--color-primary);color:var(--color-surface);padding:18px var(--spacing-lg);text-align:left}
.nutri caption b{font-family:var(--font-display);font-weight:800;font-size:34px;line-height:1;text-transform:uppercase}
.nutri caption > span{float:right;line-height:34px;font-size:var(--text-label-sm);font-weight:700;letter-spacing:var(--tracking-label-sm);text-transform:uppercase;white-space:nowrap}
.nutri th,.nutri td{padding:14px var(--spacing-lg);border-top:1px solid var(--color-rule);text-align:left;font-weight:700}
.nutri td{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--color-primary)}
.nutri tr.sub th,.nutri tr.sub td{border-top:0;padding-top:0;font-weight:400;color:var(--color-muted)}
.nutri tr.sub th{padding-left:calc(var(--spacing-lg) + 16px)}
.nutri__keep .h-md{color:var(--color-primary)}
.nutri__keep ul{list-style:none;margin-top:var(--spacing-md);font-size:var(--text-body-lg)}
.nutri__keep li{padding:14px 0 14px 30px;border-bottom:1px solid var(--color-rule);position:relative}
.nutri__keep li::before{content:"";position:absolute;left:4px;top:1.25em;width:10px;height:10px;border-radius:50%;background:var(--color-secondary);border:2px solid var(--ink)}
.nutri__src{margin-top:var(--spacing-md);font-size:var(--text-label-sm);color:var(--color-muted)}
@media (max-width:1100px){.nutri{grid-template-columns:1fr;gap:var(--spacing-lg)}}
@media (max-width:700px){
  .nutri{margin-top:var(--spacing-lg)}
  .nutri__card{border-radius:20px}
  .nutri caption{padding:14px 18px}
  .nutri caption b{font-size:26px}
  .nutri caption > span{line-height:26px}
  .nutri th,.nutri td{padding:12px 18px}
  .nutri tr.sub th{padding-left:30px}
  .nutri tr.sub th,.nutri tr.sub td{padding-top:0}
  .nutri__keep ul{font-size:17px}
}
