@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@300;400;500&family=Manrope:wght@300;400;500;600&family=Newsreader:ital,wght@0,400;0,500;1,400&display=swap");

:root { --paper:#f5f3f0; --paper-2:#ece8e2; --ink:#2a2824; --muted:#6b665e; --warm:#8b7d6d; --green:#607664; --line:#d4ccc4; --sans:"Manrope",sans-serif; --serif:"Newsreader",serif; --mono:"DM Mono",monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); letter-spacing:0; }
body.dialog-open { overflow:hidden; }
a { color:inherit; }
button { color:inherit; font:inherit; }
img { display:block; max-width:100%; }
:focus-visible { outline:3px solid var(--green); outline-offset:3px; }
.skip-link { position:fixed; top:10px; left:10px; z-index:1000; padding:10px 12px; background:var(--ink); color:white; transform:translateY(-160%); }
.skip-link:focus { transform:none; }
.site-header { position:sticky; top:0; z-index:60; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; min-height:76px; padding:0 28px; border-bottom:1px solid var(--line); background:rgba(245,243,240,.94); backdrop-filter:blur(16px); }
.wordmark { display:flex; align-items:baseline; gap:12px; width:fit-content; text-decoration:none; }
.wordmark span { font:500 23px/1 var(--serif); }
.wordmark small { color:var(--muted); font:400 9px/1 var(--mono); }
.desktop-nav { display:flex; align-items:center; gap:30px; }
.desktop-nav a { position:relative; font-size:11px; text-decoration:none; text-transform:uppercase; }
.desktop-nav a::after { content:""; position:absolute; left:0; right:100%; bottom:-7px; height:1px; background:var(--ink); transition:right 220ms ease; }
.desktop-nav a:hover::after { right:0; }
.routine-button { justify-self:end; display:inline-flex; align-items:center; gap:10px; min-height:42px; padding:0 14px; border:1px solid var(--ink); background:transparent; cursor:pointer; font-size:11px; text-transform:uppercase; }
.routine-button:hover { background:var(--ink); color:var(--paper); }
.routine-button svg { width:14px; }
.menu-button,.mobile-nav { display:none; }
.hero { position:relative; min-height:calc(100vh - 76px); padding:54px clamp(24px,5vw,76px); border-bottom:1px solid var(--line); }
.hero-index { display:flex; justify-content:space-between; font:400 10px/1 var(--mono); }
.hero-copy { display:grid; place-items:center; min-height:60vh; text-align:center; }
.eyebrow { margin:0 0 20px; color:var(--warm); font:500 10px/1.2 var(--mono); text-transform:uppercase; }
.hero h1 { margin:0; font:400 108px/.92 var(--serif); }
.hero h1 em { color:var(--warm); font-weight:400; }
.hero-intro { max-width:590px; margin:32px auto 0; color:var(--muted); font-size:15px; line-height:1.8; }
.hero-foot { display:flex; justify-content:space-between; align-items:end; gap:30px; font-size:12px; line-height:1.6; }
.hero-foot p { margin:0; color:var(--muted); }
.hero-foot a { display:inline-flex; align-items:center; gap:10px; text-decoration:none; }
.hero-foot svg { width:15px; }
.registration { position:absolute; right:0; top:44%; display:grid; width:100px; padding:14px; border:1px solid var(--line); border-right:0; background:var(--paper-2); }
.registration span,.registration small { font:400 8px/1.4 var(--mono); }
.registration strong { margin:8px 0 20px; font:500 30px/1 var(--serif); }
.protocol { display:grid; grid-template-columns:210px minmax(0,1fr); border-bottom:1px solid var(--line); }
.section-aside { display:flex; flex-direction:column; min-height:100%; padding:38px 26px; border-right:1px solid var(--line); background:var(--paper-2); }
.section-aside p,.section-aside span { margin:0 0 8px; font:400 9px/1.3 var(--mono); text-transform:uppercase; }
.section-aside strong { margin:8px 0 38px; font:400 56px/1 var(--serif); }
.section-aside span { color:var(--muted); }
.section-main { min-width:0; }
.section-heading { display:flex; justify-content:space-between; gap:40px; padding:70px clamp(24px,5vw,70px) 50px; }
.section-heading h2,.formula-copy h2,.ingredients h2,.evidence h2,.notes h2 { margin:0; font:400 64px/1 var(--serif); }
.section-heading > p { max-width:390px; margin:28px 0 0; color:var(--muted); font-size:13px; line-height:1.7; }
.protocol-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }
.protocol-step { position:relative; min-width:0; padding:26px; border-right:1px solid var(--line); transition:background 180ms ease; }
.protocol-step:last-child { border-right:0; }
.protocol-step.is-active { background:#ebe6df; }
.step-number { display:block; height:78px; color:rgba(42,40,36,.13); font:400 86px/.8 var(--serif); }
.product-crop { aspect-ratio:1/1; overflow:hidden; margin-bottom:25px; background:#e9e5df; }
.product-crop img { width:100%; height:100%; object-fit:cover; filter:grayscale(.65) saturate(.55); mix-blend-mode:multiply; }
.crop-one img { object-position:14% 50%; }
.crop-two img { object-position:50% 50%; }
.crop-three img { object-position:86% 50%; }
.formula-code { margin:0 0 9px; color:var(--warm); font:400 9px/1 var(--mono); }
.protocol-step h3 { min-height:54px; margin:0; font:400 23px/1.12 var(--serif); }
.protocol-step dl { margin:24px 0; border-top:1px solid var(--line); }
.protocol-step dl div { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px solid var(--line); }
.protocol-step dt,.protocol-step dd { margin:0; font:400 9px/1.4 var(--mono); }
.protocol-step dd { color:var(--muted); }
.protocol-step button { display:flex; align-items:center; gap:10px; padding:0; border:0; background:transparent; cursor:pointer; font-size:11px; }
.protocol-step button svg { width:14px; }
.formula-sheet { display:grid; grid-template-columns:1fr 1fr; min-height:920px; border-bottom:1px solid var(--line); }
.formula-copy { display:flex; flex-direction:column; padding:90px clamp(28px,6vw,100px); }
.formula-id { display:flex; justify-content:space-between; align-items:end; padding-bottom:16px; border-bottom:1px solid var(--ink); }
.formula-id span { font:400 72px/1 var(--serif); }
.formula-id small { font:400 9px/1 var(--mono); }
.formula-copy h2 { margin-top:48px; }
.formula-copy > p:not(.eyebrow) { max-width:540px; margin:28px 0 40px; color:var(--muted); font-size:14px; line-height:1.75; }
.ingredient-table { margin-top:auto; }
.ingredient-row { display:grid; grid-template-columns:1fr auto; gap:20px; padding:13px 0; border-top:1px dashed var(--line); font:400 10px/1.3 var(--mono); }
.ingredient-row:last-child { border-bottom:1px dashed var(--line); }
.formula-actions { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:30px; }
.formula-actions button { min-height:46px; padding:0 18px; border:1px solid var(--ink); background:var(--ink); color:var(--paper); cursor:pointer; }
.formula-actions span { color:var(--muted); font:400 9px/1 var(--mono); }
.formula-visual { position:relative; margin:0; overflow:hidden; border-left:1px solid var(--line); background:var(--paper-2); }
.formula-visual > img { width:100%; height:100%; object-fit:cover; filter:grayscale(.7) sepia(.1) saturate(.55); }
.formula-visual figcaption { position:absolute; inset:auto 0 0; display:flex; justify-content:space-between; padding:18px 22px; background:rgba(245,243,240,.9); border-top:1px solid var(--line); font:400 9px/1 var(--mono); }
.batch-label { position:absolute; top:24px; right:24px; display:grid; min-width:128px; padding:15px; border:1px solid var(--ink); background:rgba(245,243,240,.92); }
.batch-label span,.batch-label small { font:400 8px/1.3 var(--mono); }
.batch-label strong { margin:8px 0 18px; font:400 40px/1 var(--serif); }
.ingredients { padding:90px clamp(24px,6vw,100px); border-bottom:1px solid var(--line); }
.compact-heading { padding:0 0 55px; }
.accordion { border-top:1px solid var(--ink); }
.ingredient-item { border-bottom:1px solid var(--line); }
.ingredient-item > button { display:grid; grid-template-columns:60px 1fr 220px 32px; align-items:center; width:100%; min-height:82px; padding:0; border:0; background:transparent; cursor:pointer; text-align:left; }
.ingredient-item > button span,.ingredient-item > button small { font:400 9px/1 var(--mono); }
.ingredient-item > button small { color:var(--muted); }
.ingredient-item > button strong { font:500 18px/1.2 var(--sans); }
.ingredient-item > button svg { transition:transform 180ms ease; }
.ingredient-item.is-open > button svg { transform:rotate(45deg); }
.ingredient-detail { display:grid; grid-template-columns:repeat(3,1fr); gap:50px; padding:26px 32px 34px 60px; background:#e8e4de; }
.ingredient-detail p { margin:0; color:var(--muted); font-size:12px; line-height:1.7; }
.ingredient-detail b { display:block; margin-bottom:8px; color:var(--ink); font:500 9px/1 var(--mono); text-transform:uppercase; }
.evidence { display:grid; grid-template-columns:280px 1fr; padding:90px clamp(24px,6vw,100px); border-bottom:1px solid var(--line); }
.evidence > header { padding-right:48px; }
.evidence > header p:last-child { color:var(--muted); font-size:12px; line-height:1.7; }
.evidence-grid { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); }
.evidence-grid article { min-height:270px; padding:28px 22px; border-right:1px solid var(--line); }
.evidence-grid article:last-child { border-right:0; }
.evidence-grid strong { display:block; color:var(--green); font:400 58px/1 var(--serif); }
.evidence-grid span { display:block; margin:50px 0 12px; font:500 9px/1 var(--mono); text-transform:uppercase; }
.evidence-grid p { margin:0; color:var(--muted); font-size:11px; line-height:1.6; }
.evidence-note { grid-column:2; display:flex; justify-content:space-between; gap:30px; padding:18px 0; border-bottom:1px solid var(--line); }
.evidence-note span { font:400 9px/1.4 var(--mono); }
.evidence-note p { max-width:620px; margin:0; color:var(--muted); font-size:11px; line-height:1.6; }
.notes { display:grid; grid-template-columns:1fr 1fr 1fr; gap:0; padding:90px clamp(24px,6vw,100px); }
.notes > div { min-height:300px; padding-right:48px; }
.note-entry { padding:20px 36px!important; border-left:1px solid var(--line); }
.note-entry span { font:400 10px/1 var(--mono); }
.note-entry h3 { margin:70px 0 16px; font:400 25px/1.15 var(--serif); }
.note-entry p { color:var(--muted); font-size:12px; line-height:1.7; }
.note-entry a { display:inline-flex; align-items:center; gap:8px; margin-top:24px; font-size:11px; text-decoration:none; }
.note-entry svg { width:14px; }
.site-footer { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:50px; padding:70px clamp(24px,5vw,76px); background:var(--ink); color:var(--paper); }
.site-footer > div { display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.site-footer p,.site-footer a,.site-footer button { margin:0; color:rgba(245,243,240,.62); font-size:11px; line-height:1.5; }
.site-footer a { text-decoration:none; }
.site-footer button { padding:0; border:0; background:none; cursor:pointer; }
.site-footer strong,.footer-record span { font:500 9px/1 var(--mono); text-transform:uppercase; }
.footer-mark { margin-bottom:22px; color:var(--paper); }
.footer-mark small { color:rgba(245,243,240,.5); }
.footer-record strong { color:var(--paper); font:400 26px/1 var(--serif); }
dialog { padding:0; border:0; }
dialog::backdrop { background:rgba(42,40,36,.6); backdrop-filter:blur(6px); }
.routine-dialog { width:min(760px,calc(100vw - 28px)); max-height:calc(100vh - 28px); background:var(--paper); color:var(--ink); }
.dialog-head { display:flex; align-items:center; justify-content:space-between; min-height:58px; padding:0 18px; border-bottom:1px solid var(--ink); font:400 9px/1 var(--mono); }
.dialog-head button { display:grid; place-items:center; width:42px; height:42px; border:0; background:transparent; cursor:pointer; }
.dialog-body { padding:clamp(28px,6vw,70px); }
.dialog-body h2 { max-width:520px; margin:0 0 35px; font:400 64px/.96 var(--serif); }
.condition-options { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--ink); }
.condition-options button { min-height:90px; padding:14px; border:0; border-right:1px solid var(--ink); background:transparent; cursor:pointer; }
.condition-options button:last-child { border-right:0; }
.condition-options button:hover,.condition-options button.is-selected { background:var(--ink); color:var(--paper); }
.routine-result { min-height:130px; margin-top:28px; padding:24px; background:var(--paper-2); border:1px solid var(--line); }
.routine-result span { font:500 9px/1 var(--mono); }
.routine-result p { margin:18px 0 0; font:400 22px/1.35 var(--serif); }
.dialog-disclaimer { color:var(--muted); font-size:10px; line-height:1.6; }
@media (max-width:1000px) { .protocol{grid-template-columns:150px 1fr}.formula-sheet{min-height:760px}.evidence{grid-template-columns:1fr}.evidence>header{padding:0 0 40px}.evidence-note{grid-column:1}.evidence-grid{grid-template-columns:repeat(2,1fr)}.evidence-grid article:nth-child(2){border-right:0}.evidence-grid article:nth-child(-n+2){border-bottom:1px solid var(--line)}.notes{grid-template-columns:1fr 1fr}.notes>div:first-child{grid-column:1/-1;min-height:220px}.site-footer{grid-template-columns:2fr 1fr 1fr}.footer-record{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.16);padding-top:28px}}
@media (max-width:720px) { .site-header{grid-template-columns:1fr auto;min-height:66px;padding:0 16px}.desktop-nav,.routine-button{display:none}.menu-button{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--ink);background:transparent}.mobile-nav{position:absolute;top:66px;left:0;right:0;display:grid;padding:20px;background:var(--paper);border-bottom:1px solid var(--ink)}.mobile-nav[hidden]{display:none}.mobile-nav a,.mobile-nav button{padding:14px 0;border:0;border-bottom:1px solid var(--line);background:transparent;text-align:left;text-decoration:none}.hero{min-height:760px;padding:34px 18px 80px}.hero-copy{min-height:520px}.hero h1{font-size:clamp(52px,16vw,76px)}.registration{display:none}.hero-foot{align-items:flex-start;flex-direction:column}.protocol{display:block}.section-aside{min-height:0;border-right:0;border-bottom:1px solid var(--line)}.section-aside strong{margin-bottom:18px}.section-heading{flex-direction:column;padding:55px 18px 35px}.section-heading>p{margin:0}.protocol-grid{display:block}.protocol-step{border-right:0;border-bottom:1px solid var(--line)}.protocol-step:last-child{border-bottom:0}.product-crop{aspect-ratio:4/3}.formula-sheet{display:block}.formula-copy{padding:70px 18px}.formula-visual{min-height:560px;border-left:0;border-top:1px solid var(--line)}.ingredients,.evidence,.notes{padding:70px 18px}.compact-heading{padding:0 0 38px}.ingredient-item>button{grid-template-columns:36px 1fr 28px}.ingredient-item>button small{display:none}.ingredient-detail{grid-template-columns:1fr;gap:18px;padding:22px}.evidence-grid{grid-template-columns:1fr}.evidence-grid article,.evidence-grid article:nth-child(2){border-right:0;border-bottom:1px solid var(--line)}.evidence-grid article:last-child{border-bottom:0}.evidence-note{flex-direction:column}.notes{grid-template-columns:1fr}.notes>div:first-child{grid-column:1;min-height:190px}.note-entry{padding:30px 0!important;border-left:0;border-top:1px solid var(--line)}.note-entry h3{margin-top:50px}.site-footer{grid-template-columns:1fr 1fr;gap:40px 24px}.site-footer>div:first-child,.footer-record{grid-column:1/-1}.condition-options{grid-template-columns:1fr}.condition-options button{min-height:58px;border-right:0;border-bottom:1px solid var(--ink)}.condition-options button:last-child{border-bottom:0}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media (max-width:720px){.hero h1{font-size:64px}.section-heading h2,.formula-copy h2,.ingredients h2,.evidence h2,.notes h2{font-size:48px}.evidence-grid strong{font-size:50px}.dialog-body h2{font-size:48px}}
