/* UMBER · a modern apothecary printed on good paper. Bone and paper grounds, umber ink for the text and the two dark
   sections (the botanicals banner, the footer), amber (the glass) for links and a few small accents, never a large flat
   area; the six label colors of the catalog only as the thin band of a product's card, its facts panel header and the
   ingredient index dots (set inline as --c). Bodoni Moda for display (optical sizes: refined hairlines at large sizes),
   Instrument Sans for text, tabular figures in the Supplement Facts panel. The motif: the thin label band, and a hairline
   drop line. No gradients but the photo veils, no glow, no badges, no seals, no stars, no leaf icons. Mobile first, 16 px
   gutters, AA contrast. Fonts: SIL Open Font License, self-hosted (latin + latin-ext). */

@font-face{font-family:"Bodoni Moda";font-style:normal;font-weight:400 900;font-display:swap;src:url(/assets/fonts/bodoni-moda-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:"Bodoni Moda";font-style:normal;font-weight:400 900;font-display:swap;src:url(/assets/fonts/bodoni-moda-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Bodoni Moda";font-style:italic;font-weight:400 900;font-display:swap;src:url(/assets/fonts/bodoni-moda-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+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:"Bodoni Moda";font-style:italic;font-weight:400 900;font-display:swap;src:url(/assets/fonts/bodoni-moda-italic-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Instrument Sans";font-style:normal;font-weight:400 700;font-stretch:75% 100%;font-display:swap;src:url(/assets/fonts/instrument-sans-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:"Instrument Sans";font-style:normal;font-weight:400 700;font-stretch:75% 100%;font-display:swap;src:url(/assets/fonts/instrument-sans-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Instrument Sans";font-style:italic;font-weight:400 700;font-stretch:75% 100%;font-display:swap;src:url(/assets/fonts/instrument-sans-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+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:"Instrument Sans";font-style:italic;font-weight:400 700;font-stretch:75% 100%;font-display:swap;src:url(/assets/fonts/instrument-sans-italic-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* metric-matched fallbacks, so the swap to the real faces barely moves the text */
@font-face{font-family:"Bodoni Fallback";src:local("Didot"),local("Bodoni 72"),local("Georgia"),local("Times New Roman");size-adjust:93%;ascent-override:96%;descent-override:26%}
@font-face{font-family:"Instrument Fallback";src:local("Helvetica Neue"),local("Arial");size-adjust:98%;ascent-override:96%;descent-override:25%}

:root{
  --bone:#EEE8DF;--paper:#F6F2EC;--sand:#E7E0D5;--label:#FBF8F3;
  --ink:#2A1F18;--ink2:#4A3A2F;--muted:#6B5444;--line:#D9D0C4;--line2:#C8BCAD;
  --amber:#9A5B22;--amber-ink:#8A5020;--amber-l:#C68B4E;
  --dark:#2A1F18;--dark2:#35291F;--dark-ink:#EEE8DF;--dark-muted:#B9AA98;
  --serif:"Bodoni Moda","Bodoni Fallback",Didot,Georgia,serif;
  --sans:"Instrument Sans","Instrument Fallback","Helvetica Neue",Arial,system-ui,sans-serif;
  --hdr:64px;--gut:16px;--ease:cubic-bezier(.2,.7,.2,1)
}
@media (min-width:760px){:root{--gut:28px}}
@media (min-width:1100px){:root{--hdr:72px;--gut:48px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--hdr) + 16px);background:var(--bone)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--bone);color:var(--ink);font:400 16px/1.62 var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:hidden}
html.lock,html.lock body{overflow:hidden}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.2em}
p{margin:0 0 1em}
h1,h2,h3,h4{margin:0;font-weight:400}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--amber-ink);outline-offset:3px}
.ftr :focus-visible,.bot :focus-visible{outline-color:var(--amber-l)}
::selection{background:#D9C3A6;color:var(--ink)}
[hidden]{display:none!important}
.defs{position:absolute;width:0;height:0;overflow:hidden}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:var(--bone);padding:10px 14px;text-decoration:none}
.skip:focus{top:12px}
.nw{white-space:nowrap}
.num{font-variant-numeric:tabular-nums lining-nums}
.muted{color:var(--muted)}
.wrap{width:100%;max-width:1360px;margin:0 auto;padding:0 var(--gut)}
.narrow{max-width:820px}

/* type */
.h1{font:400 clamp(2.6rem,1.5rem + 4.6vw,5.4rem)/1.02 var(--serif);letter-spacing:-.012em}
.h2{font:400 clamp(2.05rem,1.45rem + 2.3vw,3.4rem)/1.06 var(--serif);letter-spacing:-.01em}
.h3{font:400 clamp(1.4rem,1.2rem + .6vw,1.75rem)/1.18 var(--serif)}
.h4{font:600 15.5px/1.35 var(--sans);letter-spacing:.005em}
.eyebrow{font:500 12px/1.35 var(--sans);letter-spacing:.17em;text-transform:uppercase;color:var(--muted);margin:0 0 16px}
.eyebrow--light{color:var(--dark-muted)}
.label{font:500 11.5px/1.35 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
.lede{color:var(--ink2);font-size:17px;line-height:1.6}
.lede p{margin:0 0 .8em}
.lede p:last-child{margin-bottom:0}
.fine{font-size:13px;line-height:1.55;color:var(--muted)}
.fine a,.lede a,.note a,.acc__b a,.legal a,.co__terms a,.summary a:not(.btn):not(.tlink){color:var(--amber-ink)}

/* the hairline drop line: a fine amber line ending in a small drop */
.dl{display:block;position:relative;width:1px;height:34px;background:var(--amber);margin:0 0 22px 4px}
.dl::after{content:"";position:absolute;left:-3px;bottom:-6px;width:7px;height:7px;background:var(--amber);border-radius:0 50% 50% 50%;transform:rotate(45deg)}
.dl--light{background:var(--amber-l)}
.dl--light::after{background:var(--amber-l)}
.dl--li{flex:none;width:6px;height:6px;margin:.62em 2px 0 1px;background:none}
.dl--li::after{left:0;bottom:auto;top:0;width:6px;height:6px;background:var(--amber)}
.mk{display:block;width:16px;height:auto;color:var(--ink);overflow:visible}

/* buttons and links */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border:1px solid var(--ink);border-radius:2px;background:var(--ink);color:var(--bone);font:500 15px/1.1 var(--sans);letter-spacing:.012em;text-decoration:none;cursor:pointer;transition:background-color .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease);white-space:nowrap;-webkit-tap-highlight-color:transparent}
.btn:hover{background:var(--amber-ink);border-color:var(--amber-ink);color:var(--bone)}
.btn--lg{min-height:54px;padding:0 26px;font-size:15.5px}
.btn--line{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--line:hover{background:transparent;color:var(--amber-ink);border-color:var(--amber-ink)}
.btn--full{width:100%}
.btn--grow{flex:1;min-width:0}
.btn[disabled],.btn[disabled]:hover{background:#D3C8BA;border-color:#D3C8BA;color:var(--ink2);cursor:not-allowed}
.btn__sep{width:1px;height:18px;background:rgba(238,232,223,.38)}
.btn svg{flex:none}
.tlink{display:inline-flex;align-items:center;gap:8px;color:var(--amber-ink);font:500 14.5px/1.3 var(--sans);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px;transition:color .2s,gap .25s var(--ease)}
.tlink:hover{color:var(--ink);gap:11px}
.tlink--center{display:flex;justify-content:center;border:0;margin-top:14px}
.iconbtn{display:inline-grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:none;cursor:pointer;color:var(--ink)}
.iconbtn--line{border:1px solid var(--line2);border-radius:2px}
.iconbtn--line:disabled{opacity:.35;cursor:default}

/* header */
.hdr{position:sticky;top:0;z-index:60;background:rgba(238,232,223,.94);border-bottom:1px solid transparent;transition:border-color .3s,background-color .3s}
@supports (backdrop-filter:blur(8px)){.hdr{background:rgba(238,232,223,.82);backdrop-filter:saturate(1.2) blur(12px);-webkit-backdrop-filter:saturate(1.2) blur(12px)}}
.hdr.is-scrolled{border-bottom-color:var(--line)}
.hdr__in{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;height:var(--hdr);gap:8px}
.hdr__burger{margin-left:-10px}
.hdr__burger .i-close,body.navon .hdr__burger .i-menu{display:none}
body.navon .hdr__burger .i-close{display:block}
.logo{justify-self:center;display:block;color:var(--ink);text-decoration:none;line-height:0}
.logo .lk{height:18px;width:auto;overflow:visible}
.hdr__end{justify-self:end;display:flex;align-items:center}
.cartbtn{position:relative;display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 0 0 8px;color:var(--ink);text-decoration:none;font:500 14px var(--sans)}
.cartbtn__t{display:none}
.cartbtn__n{position:absolute;top:5px;right:-7px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--ink);color:var(--bone);font:600 11px/18px var(--sans);text-align:center;font-variant-numeric:tabular-nums}
.cartbtn.bump .cartbtn__n{animation:bump .45s var(--ease)}
@keyframes bump{40%{transform:scale(1.25)}}
.nav{position:fixed;left:0;right:0;top:var(--navtop,var(--hdr));bottom:0;z-index:55;background:var(--bone);padding:12px var(--gut) 40px;overflow-y:auto;visibility:hidden;opacity:0;transform:translateY(-8px);transition:opacity .25s,transform .3s var(--ease),visibility 0s .3s}
body.navon .nav{visibility:visible;opacity:1;transform:none;transition:opacity .25s,transform .3s var(--ease)}
.nav__main{list-style:none;margin:0 0 28px;padding:0;border-top:1px solid var(--line)}
.nav__main li{border-bottom:1px solid var(--line)}
.nav__main a{display:block;padding:16px 0;font:400 30px/1.1 var(--serif);text-decoration:none}
.nav__main a[aria-current]{color:var(--amber-ink)}
.nav__lbl{font:500 11.5px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:24px 0 8px}
.nav__sub{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.nav__sub a{display:block;padding:7px 0;font-size:15.5px;text-decoration:none;color:var(--ink2)}
.nav__tag{display:flex;align-items:center;gap:12px;margin:36px 0 0;font:italic 400 19px var(--serif);color:var(--muted)}
.nav__mark{width:14px}
@media (min-width:1100px){
  .hdr__in{grid-template-columns:auto 1fr auto;gap:40px}
  .hdr__burger{display:none}
  .logo{justify-self:start}
  .logo .lk{height:20px}
  .nav{position:static;visibility:visible;opacity:1;transform:none;background:none;padding:0;overflow:visible;transition:none}
  .nav__main{display:flex;gap:30px;margin:0;border:0;justify-content:center}
  .nav__main li{border:0}
  .nav__main a{padding:8px 0;font:500 14px/1 var(--sans);letter-spacing:.01em;border-bottom:1px solid transparent}
  .nav__main a:hover{border-bottom-color:var(--ink)}
  .nav__main a[aria-current]{color:var(--ink);border-bottom-color:var(--amber)}
  .nav__x{display:none}
  .cartbtn__t{display:inline}
  .cartbtn__n{position:static;margin-left:2px}
}

/* sections */
.sec{padding:72px 0}
.sec--paper{background:var(--paper)}
.sec--sand{background:var(--sand)}
.sec--tight{padding:40px 0}
.sec--flush{padding-top:0}
@media (min-width:760px){.sec{padding:96px 0}.sec--tight{padding:48px 0}.sec--flush{padding-top:0}}
@media (min-width:1100px){.sec{padding:124px 0}.sec--tight{padding:56px 0}.sec--flush{padding-top:0}}
.sec__head{display:grid;gap:22px;margin-bottom:40px}
.sec__head .h2{max-width:17ch}
.sec__side{display:grid;gap:18px;justify-items:start}
.sec__side .lede{max-width:46ch;color:var(--muted)}
@media (min-width:900px){
  .sec__head{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:end;gap:56px;margin-bottom:60px}
  .sec__head--stack{grid-template-columns:1fr;gap:20px}
}
.note{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;color:var(--muted);margin:36px 0 0;max-width:60ch}
.note__m{width:13px;flex:none;margin-top:3px}

/* placeholders while a photograph is missing */
.ph{display:grid;place-items:center;width:100%;height:100%;background:var(--paper);color:var(--ink);overflow:hidden}
.ph svg{width:72%;height:auto;fill:none;stroke:currentColor;stroke-width:1.2;opacity:.42}
.ph svg .t{fill:var(--c,#C8BCAD);stroke:none;opacity:1}
.ph svg .s{stroke-dasharray:2 4}
.ph--r2 svg,.ph--r4 svg{width:92%}
.ph--life{background:var(--sand)}
.ph--dark{background:var(--dark2);color:var(--dark-muted)}
.ph__mark{width:40px;opacity:.55}

/* hero: a light photograph, dark ink text on its calm side */
.hero{position:relative;display:flex;min-height:min(calc(100svh - var(--hdr)),820px);overflow:hidden;background:var(--bone)}
.hero__media,.hero__media picture{position:absolute;inset:0}
.hero__img{width:100%;height:100%;object-fit:cover;object-position:50% 100%}
.hero__veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(238,232,223,.96) 0%,rgba(238,232,223,.82) 30%,rgba(238,232,223,.18) 56%,rgba(238,232,223,0) 70%)}
.hero__in{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:28px;padding-top:36px;padding-bottom:18px}
.hero__txt{max-width:36rem}
.hero__h1{max-width:11ch;margin:0 0 18px}
.hero__sub{max-width:40ch;color:var(--ink2);font-size:16.5px;margin:0 0 26px}
.hero__cta{display:flex;flex-wrap:wrap;gap:10px}
.hero__meta{align-self:flex-end;display:inline-flex;align-items:center;gap:10px;padding:10px 14px;background:rgba(246,242,236,.9);color:var(--ink);font-size:13px;text-decoration:none;border-radius:2px;max-width:100%}
.hero__meta .band{width:18px;height:3px}
.hero__meta-k{color:var(--muted)}
.hero__meta-n{font:400 15px var(--serif)}
.hero__meta:hover .hero__meta-n{text-decoration:underline}
@media (max-width:480px){.hero__cta .btn{flex:1 1 auto}.hero__meta-k{display:none}}
/* phones and tablets: the text on bone, then the vertical photograph at the full width, its calm wall fading in just
   under the buttons, so the hand and the dropper never sit behind the text however long it wraps (no layout shift:
   the picture box has its height before the image loads) */
@media (max-width:899px){
  .hero{flex-direction:column;min-height:0}
  .hero__in{order:1;position:static;padding-bottom:0}
  .hero__txt{position:relative;z-index:2}
  .hero .eyebrow{text-wrap:balance}
  .hero__media{order:2;position:relative;inset:auto;width:100%;height:min(125vw,760px);margin-top:max(-16vw,-48px)}
  .hero__media picture{position:absolute;inset:0}
  .hero__img{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 20%);mask-image:linear-gradient(180deg,transparent 0,#000 20%)}
  .hero__veil{display:none}
  .hero__meta{position:absolute;right:var(--gut);bottom:18px;z-index:2}
}
@media (min-width:900px){
  .hero{min-height:min(calc(100svh - var(--hdr)),880px)}
  .hero__img{object-position:58% 50%}
  .hero__veil{background:linear-gradient(90deg,rgba(238,232,223,.94) 0%,rgba(238,232,223,.78) 26%,rgba(238,232,223,.2) 48%,rgba(238,232,223,0) 60%)}
  .hero__in{justify-content:center;padding-top:72px;padding-bottom:40px}
  .hero__sub{font-size:18px}
  .hero__meta{position:absolute;right:var(--gut);bottom:28px}
}

/* chips under the hero */
.chips-sec{background:var(--bone);border-bottom:1px solid var(--line)}
.chips-l{list-style:none;margin:0;padding:0;display:grid}
.chips-l li{display:flex;align-items:center;gap:14px;padding:15px 0;border-top:1px solid var(--line);font-size:14.5px;color:var(--ink2)}
.chips-l li:first-child{border-top:0}
.chips-l svg{flex:none;color:var(--amber-ink)}
@media (min-width:760px){
  .chips-l{grid-template-columns:repeat(3,1fr)}
  .chips-l li{padding:24px 24px;border-top:0;border-left:1px solid var(--line)}
  .chips-l li:first-child{border-left:0;padding-left:0}
}

/* product cards */
.card{position:relative;display:flex;flex-direction:column;min-width:0}
.card__media{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;background:var(--paper)}
.card__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .6s var(--ease),transform 1.4s var(--ease)}
.card__media .ph{position:absolute;inset:0}
.card__alt{opacity:0}
@media (hover:hover){.card:hover .card__alt{opacity:1}.card:hover .card__img{transform:scale(1.015)}}
.band{display:block;height:3px;background:var(--c)}
.card__band{width:100%}
.card__body{display:block;padding:14px 0 0;text-decoration:none;color:var(--ink)}
.card__name{font:400 clamp(1.2rem,1.05rem + .5vw,1.45rem)/1.15 var(--serif);margin:0 0 6px}
.card__body:hover .card__name{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
.card__meta{font-size:13px;line-height:1.45;color:var(--muted);margin:0 0 6px}
.card__count{font-size:13px;color:var(--muted);margin:0 0 8px}
.card__keys{font-size:13px;line-height:1.45;color:var(--ink2);margin:0 0 8px}
.card__kl{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-right:2px}
.card__for{display:none;font:italic 400 15.5px/1.4 var(--serif);color:var(--muted);margin:0 0 8px}
.card__price{font:500 15.5px var(--sans);font-variant-numeric:tabular-nums;margin:8px 0 0}
@media (min-width:760px){.card__for{display:block}}
.grid{display:grid;gap:34px 14px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:900px){.grid{gap:48px 26px;grid-template-columns:repeat(3,minmax(0,1fr))}}
.grid--pairs{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--pairs .card:nth-child(3){display:none}
@media (min-width:760px){.grid--pairs{grid-template-columns:repeat(3,minmax(0,1fr))}.grid--pairs .card:nth-child(3){display:flex}}

/* the six, grouped */
.lu__g + .lu__g{margin-top:56px}
.lu__h{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 22px;border-top:1px solid var(--ink);padding-top:16px;margin-bottom:26px}
.lu__cat{display:flex;align-items:baseline;gap:12px;font:400 30px/1.1 var(--serif)}
.lu__n{font:500 12px var(--sans);letter-spacing:.12em;color:var(--muted)}
.lu__intro{flex:1 1 260px;margin:0;color:var(--muted);font-size:15px}
.lu__h .tlink{margin-left:auto}
.grid--lu{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:900px){.grid--lu{grid-template-columns:repeat(4,minmax(0,1fr))}}
.lu__note{grid-column:1/-1;display:flex;gap:14px;align-items:flex-start;align-self:start;padding:22px 22px;background:var(--paper);font:italic 400 19px/1.4 var(--serif);color:var(--ink2)}
.lu__note p{margin:0}
.lu__mk{width:15px;flex:none;margin-top:4px}
@media (min-width:900px){.lu__g--softgels .lu__note{grid-column:span 2;align-self:end;padding:30px 32px;font-size:22px}}

/* product row */
.row{position:relative}
.row__track{display:grid;grid-auto-flow:column;grid-auto-columns:64%;gap:14px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(-1 * var(--gut));padding:0 var(--gut) 4px;scroll-padding:0 var(--gut)}
.row__track::-webkit-scrollbar{display:none}
.card--row{scroll-snap-align:start}
.row__nav{display:none}
@media (min-width:760px){.row__track{grid-auto-columns:calc((100% - 2 * var(--gut) - 28px) / 3)}}
@media (min-width:1100px){
  .row__track{grid-auto-columns:calc((100% - 2 * var(--gut) - 78px) / 4);gap:26px}
  .row__nav{display:flex;justify-content:flex-end;gap:8px;margin-top:24px}
  .row--static .row__nav{display:none}
}

/* spotlight */
.spot{display:grid;gap:44px}
.spot__media{position:relative;padding:0 10% 26% 0}
.spot__m{display:block;overflow:hidden;background:var(--bone)}
.spot__m img{width:100%;height:100%;object-fit:cover}
.spot__m--1{aspect-ratio:4/5}
.spot__m--2{position:absolute;right:0;bottom:0;width:36%;aspect-ratio:4/5;outline:10px solid var(--paper)}
.spot__items{list-style:none;margin:30px 0 30px;padding:0}
.spot__items li{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:18px 0;border-top:1px solid var(--line2)}
.spot__n{font:italic 400 22px/1.1 var(--serif);color:var(--amber-ink)}
.spot__items h3{margin:0 0 4px}
.spot__cb p{margin:0;color:var(--ink2);font-size:15px}
.spot__buy{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--ink);padding-top:22px}
.spot__price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin:0}
.spot__price span:first-child{font:400 22px var(--serif)}
.spot__price .num{font-weight:500;font-size:16px}
.pnote{font-size:12.5px;color:var(--muted)}
@media (min-width:1024px){.spot{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:88px;align-items:center}.spot__txt .h2{max-width:13ch}}

/* the botanicals banner: dark umber, bone text */
.bot{position:relative;display:flex;align-items:flex-end;min-height:min(92svh,880px);overflow:hidden;background:var(--dark);color:var(--dark-ink)}
.bot__media{position:absolute;inset:0}
.bot__media img,.bot__media .ph{width:100%;height:100%;object-fit:cover;object-position:68% 50%}
.bot__veil{position:absolute;inset:0;background:linear-gradient(0deg,rgba(42,31,24,.96) 0%,rgba(42,31,24,.84) 42%,rgba(42,31,24,.25) 72%,rgba(42,31,24,.1) 100%)}
.bot__in{position:relative;padding-top:120px;padding-bottom:64px}
.bot__txt{max-width:34rem}
.bot__t{color:var(--dark-ink);margin:0 0 24px;max-width:12ch}
.bot__b p{color:#E4DACD;font-size:17px;line-height:1.65;max-width:44ch}
/* phones: the crop moves toward the calm left of the still life (the bright calendula leaves the frame) and the scrim is deeper behind the title, so the bone hairlines keep their contrast */
@media (max-width:759px){.bot__media img{object-position:30% 50%}.bot__veil{background:linear-gradient(0deg,rgba(42,31,24,.96) 0%,rgba(42,31,24,.9) 54%,rgba(42,31,24,.5) 76%,rgba(42,31,24,.18) 100%)}}
@media (min-width:900px){
  .bot{align-items:center}
  .bot__veil{background:linear-gradient(90deg,rgba(42,31,24,.95) 0%,rgba(42,31,24,.86) 30%,rgba(42,31,24,.3) 56%,rgba(42,31,24,0) 72%)}
  .bot__in{padding-top:110px;padding-bottom:110px}
}

/* the ingredient index */
.idx-bar{display:grid;gap:14px;margin-bottom:30px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.idx-bar__n{margin:0;font-size:13px;color:var(--muted)}
@media (min-width:900px){.idx-bar{grid-template-columns:1fr auto;align-items:center}}
.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 calc(-1 * var(--gut));padding:2px var(--gut)}
.chips::-webkit-scrollbar{display:none}
@media (min-width:760px){.chips{flex-wrap:wrap;overflow:visible;margin:0;padding:0}}
.fchip{flex:none;display:inline-flex;align-items:center;gap:9px;min-height:40px;padding:0 14px;border:1px solid var(--line2);border-radius:2px;background:transparent;color:var(--ink);font:500 13.5px/1 var(--sans);cursor:pointer;transition:background-color .2s,border-color .2s,color .2s}
.fchip:hover{border-color:var(--ink)}
.fchip .num{font-size:12px;color:var(--muted)}
.fchip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--bone)}
.fchip[aria-pressed="true"] .num{color:var(--dark-muted)}
.dot{display:inline-block;flex:none;width:9px;height:9px;border-radius:50%;background:var(--c)}
.idx{list-style:none;margin:0;padding:0;column-gap:52px}
@media (min-width:760px){.idx{columns:2}}
@media (min-width:1100px){.idx{columns:3}}
.idx__g[hidden],.idx__i[hidden]{display:none}
.idx__l{break-after:avoid;font:400 38px/1 var(--serif);color:var(--amber-ink);margin:0;padding:18px 0 10px;border-top:1px solid var(--ink)}
.idx__g:first-child .idx__l{padding-top:4px;border-top:0}
.idx__list{list-style:none;margin:0 0 18px;padding:0}
.idx__i{break-inside:avoid;padding:12px 0;border-top:1px solid var(--line)}
.idx__n{margin:0;font:600 15px/1.35 var(--sans)}
.idx__m{margin:3px 0 0;font-size:13px;line-height:1.45;color:var(--muted)}
.idx__lat{font:italic 400 15px/1.3 var(--serif);color:var(--ink2)}
.idx__refs{display:grid;gap:3px;margin-top:8px}
.idx__ref{display:flex;align-items:center;gap:9px;font-size:13.5px;color:var(--ink2);text-decoration:none}
.idx__p{flex:1;min-width:0}
.idx__ref:hover .idx__p{text-decoration:underline;text-underline-offset:.18em}
.idx__amt{color:var(--muted);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.idx-more{display:none;margin:22px 0 0}
@media (max-width:759px){.js .idx:not(.is-open) .is-more{display:none}.js .idx-more{display:block}.js .idx.is-open + .idx-more{display:none}.idx-more .btn{width:100%}}

/* how to read a label */
.lbl{display:grid;gap:44px}
.lbl__panel{max-width:27rem}
.lbl__cap{margin:18px 0 0}
.lbl__l{list-style:none;margin:0;padding:0;display:grid}
.lbl__i{display:grid;grid-template-columns:42px 1fr;gap:12px;padding:22px 0;border-top:1px solid var(--line2)}
.lbl__i h3{margin:2px 0 6px}
.lbl__b p{margin:0;color:var(--ink2);font-size:15px}
@media (min-width:760px){.lbl__l{grid-template-columns:1fr 1fr;column-gap:40px}}
@media (min-width:1000px){.lbl{grid-template-columns:minmax(0,26rem) minmax(0,1fr);gap:80px;align-items:start}.lbl__panel{position:sticky;top:calc(var(--hdr) + 28px)}}
.sfm{display:inline-grid;place-items:center;width:19px;height:19px;margin:0 7px 0 0;border-radius:50%;background:var(--amber-ink);color:var(--bone);font:600 11px/1 var(--sans);vertical-align:2px;font-stretch:100%}
.sfm--lg{width:30px;height:30px;margin:0;font-size:13.5px;vertical-align:0}

/* the Supplement Facts panel, like a real FDA label: hairline box, bold condensed title, the thick rules, bold row
   names, right-aligned amounts in tabular figures, the dagger, indented sub lines */
.sf{margin:0;max-width:26rem;color:#1E1611;font-family:var(--sans)}
.sf__box{position:relative;background:var(--label);border:1.5px solid #1E1611;padding:15px 12px 9px}
.sf__box::before{content:"";position:absolute;left:-1.5px;right:-1.5px;top:-1.5px;height:7px;background:var(--c)}
.sf__t{margin:2px 0 2px;padding-bottom:3px;border-bottom:1px solid #1E1611;font:700 clamp(30px,8.4vw,37px)/1.02 var(--sans);font-stretch:75%;letter-spacing:-.005em}
.sf__ss,.sf__sp{margin:0;font-size:14px;line-height:1.38}
.sf__ss{padding-top:3px}
.sf__ss b,.sf__sp b{font-weight:700}
.sf__sp{padding-bottom:4px;border-bottom:8px solid #1E1611}
.sf__tb{width:100%;border-collapse:collapse;font-size:13.5px;line-height:1.3;font-variant-numeric:tabular-nums lining-nums}
.sf__tb thead th{padding:4px 0 3px;font-weight:700;font-size:12px;border-bottom:3px solid #1E1611;text-align:left}
.sf__tb thead .sf__dv{text-align:right}
.sf__tb tbody th{text-align:left;font-weight:700;padding:5px 8px 5px 0;vertical-align:top}
.sf__tb td{padding:5px 0;vertical-align:top}
.sf__tb .sf__a{text-align:right;white-space:nowrap;padding-right:10px}
.sf__tb .sf__dv{text-align:right;white-space:nowrap;width:4.4em;font-weight:700}
.sf__r th,.sf__r td{border-top:1px solid #1E1611}
.sf__tb tbody tr:first-child th,.sf__tb tbody tr:first-child td{border-top:0}
.sf__g th{padding:7px 0 2px;font-size:12px;font-weight:700;letter-spacing:.02em;border-top:1px solid #1E1611}
.sf__tb .sf__s th{font-weight:400;font-size:12.5px;line-height:1.32;padding:1px 0 2px 14px}
.sf__s + .sf__r th,.sf__s + .sf__r td{border-top:1px solid #1E1611}
.sf__tb tr.sf__bar>th,.sf__tb tr.sf__bar>td{border-top:3px solid #1E1611}
.sf__fn{margin:0;padding-top:5px;border-top:8px solid #1E1611;font-size:12px;line-height:1.4}
.sf__oi,.sf__ct{margin:11px 0 0;font-size:13px;line-height:1.5}
.sf__oi b,.sf__ct b{font-weight:700}
.sf__oi--p{color:var(--muted)}
.sf__note{margin:10px 0 0;font-size:12px;line-height:1.5;color:var(--muted)}
.sf i{font-style:italic}
.dg{font-family:var(--serif);font-weight:700;font-style:normal}
.sf .sfm{vertical-align:1px}
.fda{display:flex;gap:10px;align-items:flex-start;max-width:26rem;margin:18px 0 0;font-size:12.5px;line-height:1.55;color:var(--muted)}
.fda svg{flex:none;margin-top:2px}

/* daily */
.days{list-style:none;margin:0;padding:0;display:grid;gap:44px}
.day__media{aspect-ratio:4/5;overflow:hidden;background:var(--paper)}
.day__media img,.day__media .ph{width:100%;height:100%;object-fit:cover}
.day__txt{padding-top:18px}
.day__n{font-size:12px;letter-spacing:.14em;color:var(--muted)}
.day__txt h3{margin:6px 0 10px}
.day__b p{margin:0;color:var(--ink2);font-size:15px}
@media (min-width:900px){.days{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}}

/* comparison */
.cmp-wrap{position:relative}
.cmp-wrap::after{content:"";position:absolute;top:0;right:0;bottom:0;width:36px;background:linear-gradient(90deg,rgba(246,242,236,0),var(--paper));pointer-events:none;transition:opacity .3s}
.cmp-wrap.is-end::after{opacity:0}
.cmp{overflow-x:auto;overscroll-behavior-x:contain;border-top:1px solid var(--ink);scrollbar-width:thin;scrollbar-color:var(--line2) transparent}
.cmp:focus-visible{outline-offset:-2px}
.cmp__t{width:100%;min-width:900px;table-layout:fixed;border-collapse:collapse;font-size:14px;line-height:1.45}
.cmp__t th[scope="row"]{position:sticky;left:0;z-index:1;background:var(--paper);text-align:left;vertical-align:top;min-width:118px;width:118px;padding:16px 14px 16px 0;font:500 11.5px/1.4 var(--sans);letter-spacing:.13em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line)}
.cmp__t td{vertical-align:top;padding:16px 14px;border-bottom:1px solid var(--line);border-left:1px solid var(--line);color:var(--ink2)}
.cmp__t thead th{vertical-align:top;text-align:left;padding:22px 14px 16px;border-left:1px solid var(--line);border-bottom:1px solid var(--line2)}
.cmp__corner{position:sticky;left:0;z-index:2;width:118px;background:var(--paper);border-bottom:1px solid var(--line2)}
.cmp__t td.cmp__corner{border-left:0}
.cmp__corner::before,.cmp__t th[scope="row"]::before{content:"";position:absolute;top:0;bottom:-1px;left:-6px;width:6px;background:var(--paper)}
.cmp__corner::before{width:8px}
.cmp__p{display:block;text-decoration:none;color:var(--ink)}
.cmp__img{display:block;width:100%;max-width:132px;aspect-ratio:4/5;overflow:hidden;background:var(--bone);margin-bottom:12px}
.cmp__img img{width:100%;height:100%;object-fit:cover}
.cmp__band{width:36px;margin-bottom:10px}
.cmp__n{display:block;font:400 17px/1.2 var(--serif)}
.cmp__p:hover .cmp__n{text-decoration:underline}
.cmp__price td{font:600 15px var(--sans);color:var(--ink);font-variant-numeric:tabular-nums}
.cmp__note{margin-top:22px}

/* before you start (an allowed place for the safety words) */
.before{display:grid;gap:34px}
.before__media{margin:0;aspect-ratio:4/5;overflow:hidden;background:var(--paper)}
.before__media img,.before__media .ph{width:100%;height:100%;object-fit:cover}
.before__txt .h2{margin:0 0 18px;max-width:14ch}
.before__l{list-style:none;margin:26px 0 0;padding:0}
.before__l li{display:flex;gap:14px;padding:15px 0;border-top:1px solid var(--line2);font-size:15.5px;color:var(--ink)}
.before__l li:last-child{border-bottom:1px solid var(--line2)}
.before__links{display:flex;flex-wrap:wrap;gap:14px 26px;margin:26px 0 0}
@media (min-width:900px){.before{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:88px;align-items:center}}

/* promises */
.promises{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 18px}
.promise__ic{display:block;color:var(--amber-ink)}
.promises h3{margin:14px 0 6px}
.promise__b p{margin:0;font-size:14px;color:var(--muted)}
@media (min-width:1000px){.promises{grid-template-columns:repeat(4,minmax(0,1fr));gap:44px;border-top:1px solid var(--line);padding-top:36px}}

/* FAQ */
.faq{display:grid;gap:30px}
.faq__head .h2{margin:0 0 16px}
.faq__head .lede{font-size:15.5px;color:var(--muted);max-width:36ch}
.acc{border-bottom:1px solid var(--line2)}
.acc__i{border-top:1px solid var(--line2)}
.acc__i summary{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:19px 0;cursor:pointer;list-style:none;font:500 16.5px/1.42 var(--sans)}
.acc__i summary::-webkit-details-marker{display:none}
.acc__i summary i{position:relative;flex:none;width:14px;height:14px;margin-top:5px}
.acc__i summary i::before,.acc__i summary i::after{content:"";position:absolute;left:0;top:6.5px;width:14px;height:1px;background:var(--ink);transition:transform .3s var(--ease)}
.acc__i summary i::after{transform:rotate(90deg)}
.acc__i[open] summary i::after{transform:rotate(0)}
.acc__i summary:hover span{color:var(--amber-ink)}
.acc__b{padding:0 0 22px;color:var(--ink2);max-width:64ch}
.acc__b p{margin:0 0 10px}
@media (min-width:1000px){.faq{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:88px}.faq__head{position:sticky;top:calc(var(--hdr) + 28px);align-self:start}}

/* final */
.final{padding:96px 0 104px;background:var(--bone);text-align:center;border-top:1px solid var(--line)}
.final__mk{width:26px;margin:0 auto 26px}
.final__t{max-width:15ch;margin:0 auto 20px}
.final .lede{max-width:44ch;margin:0 auto 30px;color:var(--muted)}
@media (min-width:1100px){.final{padding:140px 0 150px}}

/* footer */
.ftr{--amber:var(--amber-l);background:var(--dark);color:var(--dark-ink);padding:64px 0 34px;font-size:14px}
.ftr a{color:var(--dark-ink);text-decoration:none}
.ftr a:hover{text-decoration:underline;text-underline-offset:.2em}
.ftr__top{display:grid;gap:44px}
.logo--ftr{justify-self:start;color:var(--dark-ink)}
.logo--ftr .lk{height:22px}
.ftr__tag{font:italic 400 21px/1.3 var(--serif);margin:22px 0 10px;color:var(--dark-ink)}
.ftr__meaning{color:var(--dark-muted);max-width:38ch;margin:0 0 18px;line-height:1.6}
.ftr__mail a{display:inline-flex;align-items:center;gap:8px;color:var(--dark-ink)}
.ftr__col h2{font:500 11.5px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--dark-muted);margin:0 0 16px}
.ftr__col ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ftr__col--info ul{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px}
.ftr__fda{margin-top:52px;padding:18px 0;border-top:1px solid rgba(238,232,223,.16);border-bottom:1px solid rgba(238,232,223,.16)}
.fda--ftr{max-width:none;margin:0;color:var(--dark-muted)}
.ftr__bot{display:grid;gap:18px;margin-top:24px;font-size:12.5px;line-height:1.6;color:var(--dark-muted)}
.ftr__bot p{margin:0 0 6px}
.ftr__safe{color:var(--dark-ink)}
@media (min-width:760px){.ftr__top{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr) minmax(0,.9fr)}.ftr__col--info{grid-column:1/-1}}
@media (min-width:1100px){.ftr{padding:88px 0 40px}.ftr__top{grid-template-columns:minmax(0,1.25fr) minmax(0,.55fr) minmax(0,.7fr) minmax(0,1.35fr);gap:56px}.ftr__col--info{grid-column:auto}.ftr__bot{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:56px}}

/* page heads */
.pagehead{padding:44px 0 34px}
.pagehead__in{display:grid;gap:20px}
.pagehead .h1{max-width:14ch}
.pagehead--sm{padding:36px 0 24px}
.pagehead--sm .h1{font-size:clamp(2.3rem,1.7rem + 2.4vw,3.6rem)}
.pagehead--sm .lede{margin-top:14px;max-width:56ch;color:var(--muted)}
@media (min-width:900px){.pagehead{padding:72px 0 52px}.pagehead__in{grid-template-columns:minmax(0,1fr) minmax(0,.8fr);align-items:end;gap:56px}}

/* shop */
.shopbar{display:grid;gap:12px;align-items:center;padding:14px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);margin-bottom:22px}
.shopbar__n{margin:0;font-size:13px;color:var(--muted)}
@media (min-width:760px){.shopbar{grid-template-columns:1fr auto}}
.shopintro p{margin:0 0 26px;color:var(--muted);max-width:60ch}
.grid--shop{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:900px){.grid--shop{grid-template-columns:repeat(3,minmax(0,1fr))}}
.card.in-filter{animation:fade .5s var(--ease)}
@keyframes fade{from{opacity:0;transform:translateY(6px)}}
.note--shop{margin-top:56px}

/* product page */
.crumb{display:flex;flex-wrap:wrap;gap:8px;padding:14px 0 16px;font-size:12.5px;color:var(--muted)}
.crumb a{text-decoration:none}
.crumb a:hover{text-decoration:underline}
.pdp{display:grid;gap:30px;padding-bottom:48px}
@media (min-width:1024px){.pdp{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:72px;align-items:start;padding-bottom:72px}}
.gal{position:relative;min-width:0}
@media (min-width:1024px){.gal{position:sticky;top:calc(var(--hdr) + 12px)}}
.gal__main{display:grid;grid-auto-flow:column;grid-auto-columns:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;background:var(--paper);margin:0 calc(-1 * var(--gut))}
.gal__main::-webkit-scrollbar{display:none}
@media (min-width:760px){.gal__main{margin:0}}
.gal__slide{position:relative;aspect-ratio:4/5;scroll-snap-align:start;overflow:hidden}
.gal__slide img,.gal__slide .ph{width:100%;height:100%;object-fit:cover}
.gal__bar{position:relative;height:2px;margin:12px 0 0;background:var(--line);overflow:hidden}
.gal__bar i{position:absolute;left:0;top:0;bottom:0;width:calc(100% / var(--n));background:var(--amber);transform:translateX(calc(var(--i,0) * 100%));transition:transform .4s var(--ease)}
.gal__count{position:absolute;top:12px;right:12px;margin:0;padding:3px 8px;background:rgba(246,242,236,.88);font-size:12px;color:var(--ink2);border-radius:2px}
@media (min-width:760px){.gal__count{display:none}}
.gal__thumbs{display:none}
@media (min-width:760px){
  .gal__thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:12px}
  .gal__thumbs button{display:block;padding:0;aspect-ratio:4/5;overflow:hidden;border:1px solid transparent;background:var(--paper);cursor:pointer;opacity:.7;transition:opacity .2s,border-color .2s}
  .gal__thumbs button:hover{opacity:1}
  .gal__thumbs button.on{border-color:var(--ink);opacity:1}
  .gal__thumbs img,.gal__thumbs .ph{width:100%;height:100%;object-fit:cover}
}
.gal__note{margin:12px 0 0;font-size:12px;color:var(--muted)}
.gal__note--d{display:none}
.gal__note--m{margin-top:18px}
@media (min-width:1024px){.gal__note--d{display:block}.gal__note--m{display:none}}
.buy__in{position:relative}
.buy__band{width:56px;margin:4px 0 18px}
.buy__cat{margin:0 0 10px}
.buy__cat a{font:500 12px var(--sans);letter-spacing:.17em;text-transform:uppercase;color:var(--muted);text-decoration:none}
.buy__h1{font:400 clamp(2.5rem,1.9rem + 2.4vw,3.8rem)/1.02 var(--serif);letter-spacing:-.01em;margin:0 0 12px}
.buy__sub{font-size:16px;color:var(--ink2);margin:0 0 20px;max-width:42ch}
.buy__price{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin:0 0 22px}
.buy__price .num{font:500 25px var(--sans)}
.glance{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 0 22px;border-top:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.glance__c{padding:12px 12px 12px 0;min-width:0}
.glance__c + .glance__c{padding-left:12px;border-left:1px solid var(--line)}
.glance dt{font:500 10.5px/1.3 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}
.glance dd{margin:5px 0 0;font-size:14px;line-height:1.35;font-weight:500}
.buy__tag{font:italic 400 19px/1.45 var(--serif);color:var(--ink2);margin:0 0 22px;max-width:36ch}
.buyrow{display:flex;gap:10px}
.qty{display:flex;align-items:center;flex:none;height:54px;border:1px solid var(--line2);border-radius:2px;background:var(--paper)}
.qty button{display:grid;place-items:center;width:40px;height:100%;border:0;background:none;cursor:pointer}
.qty input{width:30px;border:0;background:none;text-align:center;font:500 16px var(--sans);color:var(--ink);padding:0}
.qty--sm{height:38px}
.qty--sm button{width:32px}
.qty--sm input{width:24px;font-size:14px}
.buy__pending{margin:12px 0 0;font-size:13px;color:var(--muted)}
.buy__facts{margin:18px 0 0}
.buy__facts .tlink svg{color:var(--amber-ink)}
.eta{display:flex;gap:12px;align-items:flex-start;margin:20px 0 0;padding:14px 16px;background:var(--paper);font-size:14px;line-height:1.5}
.eta p{margin:0}
.eta small{display:block;margin-top:4px;color:var(--muted);font-size:12.5px;line-height:1.5}
.pulse{flex:none;width:7px;height:7px;margin-top:8px;border-radius:50%;background:var(--amber)}
.trust{list-style:none;margin:20px 0 0;padding:0;border-top:1px solid var(--line)}
.trust li{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--line);font-size:13.5px;line-height:1.45}
.trust svg{flex:none;color:var(--amber-ink)}
.trust b{display:block;font-weight:600;color:var(--ink)}
.trust span{color:var(--muted)}
.trust__a{text-decoration:none}
.trust__a:hover b{text-decoration:underline}
.buy__links{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:18px 0 0;font-size:13.5px}
.buy__links .label{margin:0 6px 0 0}
.buy__links a{color:var(--amber-ink)}
.pinfo{display:grid;gap:34px}
.pinfo__lead{font:400 clamp(1.2rem,1.04rem + .7vw,1.6rem)/1.42 var(--serif);margin:0 0 20px;max-width:40ch}
.pinfo__r p{color:var(--ink2);max-width:62ch}
.ticks{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:0;max-width:56ch}
.ticks li{display:flex;gap:14px;padding:12px 0;border-top:1px solid var(--line);font-size:15px}
.box{background:var(--paper);padding:22px 22px 10px}
.box__l{list-style:none;margin:0;padding:0}
.box__l li{display:flex;gap:12px;padding:0 0 12px;font-size:15px}
@media (min-width:1000px){.pinfo{grid-template-columns:minmax(0,1.45fr) minmax(0,.55fr);gap:88px;align-items:start}}
.facts{display:grid;gap:44px}
.facts__panel{min-width:0}
.facts__side .h3{margin:0 0 18px}
.ing{margin:0}
.ing__i{padding:17px 0;border-top:1px solid var(--line2)}
.ing__i:last-child{border-bottom:1px solid var(--line2)}
.ing dt{font:600 15px/1.4 var(--sans)}
.ing dt i{font:italic 400 16px var(--serif)}
.ing dd{margin:5px 0 0;color:var(--ink2);font-size:15px;max-width:60ch}
@media (min-width:1000px){.facts{grid-template-columns:minmax(0,26rem) minmax(0,1fr);gap:88px;align-items:start}.facts__panel{position:sticky;top:calc(var(--hdr) + 24px)}.facts--solo{grid-template-columns:minmax(0,26rem)}}
.use{display:grid;gap:34px}
.use__media{aspect-ratio:4/5;overflow:hidden;background:var(--paper)}
.use__media img,.use__media .ph{width:100%;height:100%;object-fit:cover}
.use__blk .h2{margin:0}
.use__l{list-style:none;margin:26px 0 0;padding:0}
.use__l li{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:16px 0;border-top:1px solid var(--line)}
.use__l li:last-child{border-bottom:1px solid var(--line)}
.use__n{font:italic 400 22px/1.15 var(--serif);color:var(--amber-ink)}
.use__l p{margin:0;font-size:15.5px}
.use__blk--care{margin-top:44px}
.use__blk--care .h3{margin:0 0 12px}
.care{list-style:none;margin:0;padding:0}
.care li{display:flex;gap:14px;padding:12px 0;border-top:1px solid var(--line);font-size:15px;color:var(--ink2)}
@media (min-width:900px){.use{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:88px;align-items:center}}
.specs-wrap{display:grid;gap:26px}
.specs-wrap__h .h2{margin:0}
.specs__note{margin-top:14px;max-width:36ch}
.specs{width:100%;border-collapse:collapse;font-size:15px;line-height:1.5}
.specs th{width:36%;padding:14px 16px 14px 0;text-align:left;vertical-align:top;font-weight:500;color:var(--muted);border-bottom:1px solid var(--line)}
.specs td{padding:14px 0;vertical-align:top;border-bottom:1px solid var(--line)}
.specs tr:first-child th,.specs tr:first-child td{border-top:1px solid var(--ink)}
@media (min-width:900px){.specs-wrap{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:88px}}
.safety{background:var(--paper);border:1px solid var(--line2);border-top:3px solid var(--ink);padding:28px 20px 24px}
.safety__hd .h2{margin:0 0 22px}
.safety__l{list-style:none;margin:0;padding:0;display:grid}
.safety__l li{display:grid;grid-template-columns:32px 1fr;gap:10px;padding:13px 0;border-top:1px solid var(--line);font-size:15px;line-height:1.55}
.safety__n{padding-top:2px;font-size:12px;color:var(--muted)}
.safety__ft{display:grid;gap:4px;margin-top:20px;padding-top:16px;border-top:1px solid var(--line2)}
.safety__ft .fine{margin:0 0 4px;color:var(--ink2);font-size:13.5px}
.safety__links{display:flex;flex-wrap:wrap;gap:14px 28px;margin:12px 0 0}
@media (min-width:760px){.safety{padding:44px 48px 36px}}
@media (min-width:1000px){.safety__l{grid-template-columns:1fr 1fr;column-gap:48px}}
.stickybar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px var(--gut) calc(10px + env(safe-area-inset-bottom));background:rgba(246,242,236,.97);border-top:1px solid var(--line2);transform:translateY(110%);transition:transform .35s var(--ease)}
.stickybar.on{transform:none}
.stickybar__t{display:flex;align-items:center;gap:10px;min-width:0;font-size:14px}
.stickybar__t b{font:400 17px var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stickybar__band{width:4px;height:26px;flex:none}
.stickybar .btn{flex:none}
@media (min-width:1024px){.stickybar{display:none}}
body.has-stickybar .ftr{padding-bottom:96px}
@media (min-width:1024px){body.has-stickybar .ftr{padding-bottom:40px}}

/* about */
.aboutHero__in{display:grid;gap:22px;padding-top:48px;padding-bottom:36px}
.aboutHero__txt .h1{max-width:12ch}
.aboutHero__lede{max-width:46ch;color:var(--ink2)}
.aboutHero__media{margin:0;aspect-ratio:16/9;overflow:hidden;background:var(--sand)}
.aboutHero__media img,.aboutHero__media .ph{width:100%;height:100%;object-fit:cover}
@media (max-width:759px){.aboutHero__wrap{padding:0}}
@media (min-width:900px){.aboutHero__in{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:end;gap:56px;padding-top:80px;padding-bottom:56px}}
.aboutx{display:grid;gap:0}
.aboutEd{display:grid;gap:12px;padding:30px 0;border-top:1px solid var(--line2)}
.aboutEd:last-child{border-bottom:1px solid var(--line2)}
.aboutEd__h{display:flex;align-items:baseline;gap:14px}
.aboutEd__n{font-size:12px;letter-spacing:.14em;color:var(--muted)}
.aboutEd__b p{color:var(--ink2);max-width:62ch}
@media (min-width:900px){.aboutEd{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px;padding:44px 0}}
.specs--co{margin-top:8px}
.co__link{margin:22px 0 0}

/* drawer */
.drawer{position:fixed;inset:0;z-index:90;visibility:hidden;pointer-events:none}
.drawer.on{visibility:visible;pointer-events:auto}
.drawer__bg{position:absolute;inset:0;background:rgba(42,31,24,.38);opacity:0;transition:opacity .3s}
.drawer.on .drawer__bg{opacity:1}
.drawer__pan{position:absolute;top:0;right:0;bottom:0;width:min(440px,100%);display:flex;flex-direction:column;background:var(--bone);transform:translateX(100%);transition:transform .38s var(--ease);outline:0}
.drawer.on .drawer__pan{transform:none}
.drawer__hd{display:flex;align-items:center;justify-content:space-between;padding:12px 12px 12px var(--gut);border-bottom:1px solid var(--line)}
.drawer__t{font:400 24px var(--serif)}
.drawer__t .num{font:500 13px var(--sans);color:var(--muted);margin-left:6px}
.drawer__bd{flex:1;overflow-y:auto;padding:0 var(--gut)}
.drawer__ft{padding:18px var(--gut) calc(18px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--paper)}
@media (min-width:760px){.drawer__hd,.drawer__bd,.drawer__ft{padding-left:28px;padding-right:28px}.drawer__hd{padding-right:16px}}
.lines{list-style:none;margin:0;padding:0}
.ci{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}
.ci__img{display:block;aspect-ratio:4/5;overflow:hidden;background:var(--paper)}
.ci__img img,.ci__img .ph{width:100%;height:100%;object-fit:cover}
.ci__name{font:400 18px/1.2 var(--serif);text-decoration:none}
.ci__name:hover{text-decoration:underline}
.ci__meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:4px 0 10px;font-size:12.5px;color:var(--muted)}
.ci__ctl{display:flex;align-items:center;gap:14px}
.ci__rm{padding:0;border:0;background:none;font-size:12.5px;color:var(--muted);text-decoration:underline;text-underline-offset:.2em;cursor:pointer}
.ci__rm:hover{color:var(--ink)}
.ci__tot{margin:0;font-weight:500;font-size:15px}
.ci__band{display:inline-block;width:14px;height:3px;background:var(--c)}
.empty{padding:44px 0;text-align:center}
.empty__t{font:400 26px var(--serif);margin:0 0 8px}
.empty p{color:var(--muted)}
.tots{margin:0}
.tot{display:flex;justify-content:space-between;gap:16px;padding:6px 0;font-size:14.5px}
.tot dt{color:var(--ink2)}
.tot dd{margin:0}
.tot--big{margin-top:6px;padding-top:12px;border-top:1px solid var(--line2);font-size:17px;font-weight:600}
.tot--big small{display:block;font-size:12px;font-weight:400;color:var(--muted)}
.summary__eta{display:flex;gap:10px;align-items:flex-start;margin:14px 0 16px;font-size:13.5px;line-height:1.5;color:var(--ink2)}
.summary__eta svg{flex:none;margin-top:1px;color:var(--amber-ink)}
.summary__eta b{font-weight:600}

/* cart and checkout pages */
.cartpage{display:grid;gap:32px;padding-bottom:72px}
.cartpage.is-empty{display:block}
.cartpage__more{margin:22px 0 0}
.summary{align-self:start;padding:24px 20px;background:var(--paper);border-top:3px solid var(--ink)}
.summary__t{font:400 24px var(--serif);margin:0 0 14px}
.mini-trust{list-style:none;margin:16px 0 0;padding:14px 0 0;border-top:1px solid var(--line);display:grid;gap:10px;font-size:13px;color:var(--ink2)}
.mini-trust li{display:flex;gap:10px;align-items:center}
.mini-trust svg{color:var(--amber-ink);flex:none}
@media (min-width:1000px){.cartpage{grid-template-columns:minmax(0,1fr) minmax(0,25rem);gap:64px}.summary{position:sticky;top:calc(var(--hdr) + 20px);padding:30px 28px}}
.cartpage--co{gap:40px}
@media (min-width:1000px){.cartpage--co{grid-template-columns:minmax(0,1fr) minmax(0,25rem);grid-template-areas:"a s" "b s"}.co--a{grid-area:a}.co--b{grid-area:b}.cartpage--co .summary{grid-area:s;grid-row:1 / span 2}}
.co__h{font:400 26px var(--serif);margin:0 0 14px;padding-bottom:12px;border-bottom:1px solid var(--ink)}
.co__scroll{overflow-x:auto}
.co__items{width:100%;min-width:480px;border-collapse:collapse;font-size:14.5px}
.co__items th{padding:10px 8px 10px 0;text-align:left;font:500 11.5px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line)}
.co__items td{padding:14px 8px 14px 0;border-bottom:1px solid var(--line);vertical-align:middle}
.co__items .num{text-align:right}
.co__it{display:flex;gap:14px;align-items:center}
.co__it .ci__img{width:56px;flex:none}
.co__it b{display:block;font:400 17px/1.2 var(--serif)}
.co__meta{display:block;font-size:12.5px;color:var(--muted)}
.co__unit{display:none}
.co__sum{display:flex;justify-content:space-between;margin:16px 0 0;font-size:17px;font-weight:600}
.co__terms{margin:0}
.co__row{display:grid;gap:4px;padding:16px 0;border-bottom:1px solid var(--line)}
.co__row dt{font:500 11.5px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.co__row dd{margin:0;font-size:14.5px;line-height:1.6;color:var(--ink2)}
@media (min-width:760px){.co__row{grid-template-columns:11rem 1fr;gap:24px}}
.co__eta b{font-weight:600}
.co__links{display:flex;flex-direction:column;gap:2px;margin-top:6px}
@media (min-width:760px){.co__links{flex-direction:row;flex-wrap:wrap}.co__links a+a::before{content:"\00B7";display:inline-block;margin:0 .65em;color:var(--muted);text-decoration:none}}
.co__taxline{margin:10px 0 0}
.co__line{display:flex;gap:10px;align-items:flex-start;margin:0 0 10px;font-size:13.5px;line-height:1.5;color:var(--ink2)}
.co__line svg{flex:none;color:var(--amber-ink);margin-top:1px}
.notice{display:flex;gap:12px;align-items:flex-start;margin:16px 0;padding:16px;background:var(--bone);border:1px solid var(--line2);font-size:13.5px;line-height:1.55}
.notice svg{flex:none;color:var(--amber-ink)}
.notice p{margin:0}
.notice__t{font-weight:600;margin-bottom:4px!important}
.fda--co{margin:0 0 16px;max-width:none}
.summary .btn{margin-top:4px}
.summary .fine{margin:14px 0 0}
.emptypicks{padding-top:24px;padding-bottom:88px}
.emptypicks__l{margin-bottom:20px}
@media (max-width:759px){.co__items{min-width:0}.co__items thead{display:none}.co__items td:not(:first-child){display:none}.co__unit{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--ink2);margin-top:2px}.co__unit b{display:inline;font:600 14px/1.3 var(--sans);font-variant-numeric:tabular-nums;color:var(--ink)}.co__it>span:last-child{flex:1;min-width:0}}

/* toast */
.toast{position:fixed;left:50%;bottom:24px;z-index:95;max-width:calc(100% - 32px);padding:12px 18px;background:var(--ink);color:var(--bone);font-size:14px;border-radius:2px;transform:translate(-50%,140%);opacity:0;transition:transform .35s var(--ease),opacity .35s;pointer-events:none}
.toast.on{transform:translate(-50%,0);opacity:1}
.toast.is-quiet{bottom:auto;top:calc(var(--hdr) + 10px);transform:translate(-50%,-40%)}
.toast.is-quiet.on{transform:translate(-50%,0)}

/* policy pages */
.legalwrap{display:grid;gap:28px;padding-top:28px;padding-bottom:96px}
@media (min-width:1024px){.legalwrap{grid-template-columns:16.5rem minmax(0,1fr);gap:80px;padding-top:56px}}
.legalside{font-size:14px;min-width:0}
@media (min-width:1024px){.legalside{position:sticky;top:calc(var(--hdr) + 24px);align-self:start;max-height:calc(100vh - var(--hdr) - 48px);overflow-y:auto}}
.toc{margin:0 0 24px}
.toc summary{cursor:pointer;list-style:none}
.toc summary::-webkit-details-marker{display:none}
.toc ol{margin:8px 0 0;padding:0 0 0 30px;display:grid;gap:6px;color:var(--ink2)}
.toc a{text-decoration:none}
.toc a:hover{text-decoration:underline}
.toc--d{display:none}
@media (min-width:1024px){.toc--d{display:block}.toc--m{display:none}}
.toc--m{margin:20px 0 28px;padding:14px 16px;background:var(--paper)}
.toc--m summary{display:flex;align-items:center;justify-content:space-between;margin:0}
.toc--m summary::after{content:"+";font:400 20px/1 var(--sans);color:var(--ink);transition:transform .25s var(--ease)}
.toc--m[open] summary::after{transform:rotate(45deg)}
.toc--m ol{margin-top:12px}
.legalnav{display:none}
@media (min-width:1024px){.legalnav{display:block;padding-top:20px;border-top:1px solid var(--line)}}
.legalnav ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.legalnav a{text-decoration:none;color:var(--ink2)}
.legalnav a[aria-current]{color:var(--ink);font-weight:600}
.legal{max-width:46rem;min-width:0;font-size:16px;line-height:1.7;color:var(--ink2);overflow-wrap:break-word}
.legal h1{font:400 clamp(2.3rem,1.7rem + 2.4vw,3.6rem)/1.05 var(--serif);color:var(--ink);margin:0 0 12px}
.legal__upd{font-size:13px;color:var(--muted);margin:0 0 22px}
.legal h2{font:400 clamp(1.55rem,1.3rem + .8vw,2rem)/1.2 var(--serif);color:var(--ink);margin:52px 0 14px;padding-top:20px;border-top:1px solid var(--line)}
.legal h3{font:600 16.5px/1.4 var(--sans);color:var(--ink);margin:30px 0 8px}
.legal ul,.legal ol{padding-left:20px}
.legal li{margin:0 0 8px}
.legal strong{color:var(--ink)}
.tblwrap{overflow-x:auto;margin:18px 0 24px}
.legal table{width:100%;border-collapse:collapse;font-size:14.5px}
.legal th,.legal td{padding:11px 12px 11px 0;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.legal th{width:36%;font-weight:600;color:var(--ink)}
.legal thead th{font:500 11.5px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
/* tables of 3 or more columns (build.py policy_table): columns share the width by their content on a large screen,
   and each row becomes a short card on a phone, the column name above each value */
.legal .tbl--cols th{width:auto}
.legal .tbl--cols tbody th{min-width:8.5rem}
@media (max-width:699px){
  .legal .tbl--cols,.legal .tbl--cols tbody,.legal .tbl--cols tr,.legal .tbl--cols th,.legal .tbl--cols td{display:block;width:auto;min-width:0}
  .legal .tbl--cols thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .legal .tbl--cols tr{padding:14px 0 12px;border-bottom:1px solid var(--line)}
  .legal .tbl--cols tr:first-child{border-top:1px solid var(--line)}
  .legal .tbl--cols th,.legal .tbl--cols td{padding:0;border:0}
  .legal .tbl--cols td{margin-top:10px}
  .legal .tbl--cols td::before{content:attr(data-label);display:block;font:500 11px/1.5 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
}

/* 404 */
.nf{padding:72px 0 112px}
.nf__wrap{display:grid;gap:36px;justify-items:start}
.nf__mk{width:64px}
.nf .lede{max-width:44ch;margin:18px 0 28px}
.nf__cta{display:flex;flex-wrap:wrap;gap:10px}
@media (min-width:900px){.nf{padding:120px 0 160px}.nf__wrap{grid-template-columns:auto 1fr;gap:72px;align-items:center}.nf__mk{width:96px}}

/* scroll reveal: opacity and transform only, never a layout change */
.js .reveal{opacity:0;transform:translateY(14px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none}*{animation:none!important;transition-duration:0s!important}}
@media print{.hdr,.ftr,.drawer,.stickybar,.toast{display:none}.js .reveal{opacity:1;transform:none}}