/* The Wildlife Line — design system. Every value below comes from these tokens. */
@font-face{font-family:"Frank Ruhl Libre";src:url(/assets/fonts/frankruhl-var.woff2) format("woff2");font-weight:300 900;font-display:swap}
@font-face{font-family:"Public Sans";src:url(/assets/fonts/publicsans-var.woff2) format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:"Frank Ruhl Fallback";src:local("Georgia Bold"),local("Georgia-Bold"),local("Georgia");size-adjust:88.6%;ascent-override:108%;descent-override:37.7%;line-gap-override:0%}
@font-face{font-family:"Public Sans Fallback";src:local("Arial");size-adjust:101%;ascent-override:94%;descent-override:22%}

:root{
  /* palette: day (dusk field guide) */
  --paper:#F5F1E6; --sand:#E7E0CE; --sand-2:#DDD4BE; --line:#CFC5AC;
  --ink:#1F2A24; --ink-soft:#3A4640; --muted:#5B6359; --moss:#3E5640;
  --cta:#9A4A1C; --cta-hover:#843E16; --cta-ink:#FFFFFF;
  --lamp:#E8B04B; --night:#121A16; --night-2:#1A241F; --night-ink:#ECE7DA; --night-muted:#A9B3A6;
  --focus:#2F6FA8; --link:var(--cta); --link-hover:var(--cta-hover); --night-moss:#9DBB97; --lamp-ink:#16201B; --lamp-hover:#F0C068; --night-soft:#D3CFC3; --dusk:#2A3530; --night-line:#2E3B34; --err:#A3311E; --err-night:#F08C7A; --river:#6F9AA3; --hud:#E9F1E4;
  /* type: 1.25 modular scale, 6 sizes */
  --font-head:"Frank Ruhl Libre","Frank Ruhl Fallback",Georgia,serif;
  --font-body:"Public Sans","Public Sans Fallback",Arial,sans-serif;
  --fs-xs:0.8125rem; --fs-base:1.0625rem; --fs-md:1.3125rem; --fs-lg:1.625rem; --fs-xl:2.5rem; --fs-hero:clamp(2.5rem,1.6rem + 3.6vw,4rem);
  /* spacing: 4/8 scale */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px; --s9:96px; --s10:128px;
  --section:clamp(64px,8vw,128px);
  --measure:68ch; --wrap:1200px;
  /* radii by role */
  --r-btn:7px; --r-card:14px; --r-pill:999px;
  --shadow-1:0 1px 2px rgba(31,42,36,.08),0 2px 8px rgba(31,42,36,.06);
  --shadow-2:0 8px 28px rgba(31,42,36,.14);
  --ease:cubic-bezier(.22,.61,.36,1); --dur:200ms;
}
/* night line: after local sunset, OS dark mode, or the toggle */
:root[data-theme="night"]{
  --paper:#121A16; --sand:#1A241F; --sand-2:#22302A; --line:#2E3B34;
  --ink:#ECE7DA; --ink-soft:#D3CFC3; --muted:#A9B3A6; --moss:#9DBB97;
  --cta:#E8B04B; --cta-hover:#F0C068; --cta-ink:#16201B; --focus:#8EC5F0; --link:#E8B04B; --link-hover:#F0C068;
  --shadow-1:none; --shadow-2:0 0 0 1px var(--line);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:88px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-body);font-size:var(--fs-base);line-height:1.6;transition:background-color 600ms var(--ease),color 600ms var(--ease)}
img,svg,video{display:block;max-width:100%}
img,video{height:auto}
a{color:var(--link);text-underline-offset:3px;text-decoration-thickness:1px;transition:color var(--dur) var(--ease)}
a:hover{color:var(--link-hover)}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
h1,h2,h3{font-family:var(--font-head);font-weight:680;line-height:1.1;letter-spacing:-0.006em;margin:0 0 var(--s4);text-wrap:balance}
h1{font-size:var(--fs-hero);letter-spacing:-0.012em;line-height:1.05}
h2{font-size:var(--fs-xl)}
h3{font-size:var(--fs-md);line-height:1.2;font-weight:620;text-wrap:pretty}
p{margin:0 0 var(--s4);max-width:var(--measure)}
ul,ol{max-width:var(--measure);padding-left:1.2em;margin:0 0 var(--s4)}
li{margin-bottom:var(--s2)}
.eyebrow{font-family:var(--font-body);font-size:var(--fs-xs);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--moss);margin:0 0 var(--s3)}
.lede{font-size:var(--fs-md);line-height:1.5;color:var(--ink-soft)}
.small{font-size:var(--fs-xs);color:var(--muted);line-height:1.5}
.muted{color:var(--muted)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--s5)}
.section{padding:var(--section) 0}
.section--sand{background:var(--sand)}
.section--night{background:var(--night);color:var(--night-ink)}
.section--night .eyebrow{color:var(--night-moss)}
.section--night .muted,.section--night .small{color:var(--night-muted)}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--paper);padding:var(--s3) var(--s4);z-index:100}
.skip:focus{left:var(--s4);top:var(--s4)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* links on dark surfaces (night sections, verdicts, the house after dusk) */
.section--night,.verdict,.site-footer,.house[data-step="2"],.house[data-step="3"],.house[data-step="4"],.house[data-step="5"]{--link:var(--lamp);--link-hover:var(--lamp-hover)}

/* buttons: built once */
.btn{display:inline-flex;align-items:center;gap:var(--s2);font-family:var(--font-body);font-size:var(--fs-base);font-weight:650;line-height:1;padding:15px 22px;border-radius:var(--r-btn);border:1.5px solid transparent;text-decoration:none;cursor:pointer;transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease),transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.btn svg{width:18px;height:18px;flex:none}
.btn--primary{background:var(--cta);color:var(--cta-ink)}
.btn--primary:hover{background:var(--cta-hover);color:var(--cta-ink);transform:translateY(-1px);box-shadow:var(--shadow-1)}
.btn--ghost{background:transparent;color:var(--ink);border-color:currentColor}
.btn--ghost:hover{color:var(--ink);background:color-mix(in srgb,var(--ink) 7%,transparent);transform:translateY(-1px)}
.section--night .btn--primary{background:var(--lamp);color:var(--lamp-ink)}
.section--night .btn--primary:hover{background:var(--lamp-hover)}
.section--night .btn--ghost{color:var(--night-ink)}
.sponsor-cta{margin-top:var(--s5)}
.sponsor-cta .cta-row{margin-top:var(--s2)}
.ad-label{display:block;margin:0 0 var(--s2);font-size:.8125rem;line-height:1.4;color:var(--muted)}
.ad-label b{display:inline-block;margin-right:var(--s2);padding:0 6px;border:1px solid currentColor;border-radius:4px;font-size:.6875rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);line-height:1.5}
.section--night .ad-label,.verdict .ad-label,.site-footer .ad-label,.house[data-step="2"] .ad-label,.house[data-step="3"] .ad-label,.house[data-step="4"] .ad-label,.house[data-step="5"] .ad-label{color:var(--night-muted)}
.section--night .ad-label b,.verdict .ad-label b,.site-footer .ad-label b,.house[data-step="2"] .ad-label b,.house[data-step="3"] .ad-label b,.house[data-step="4"] .ad-label b,.house[data-step="5"] .ad-label b{color:var(--night-soft)}
.card > .ad-label + h2{margin-top:var(--s2)}
.ad-label a,.site-footer .ad-label a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
.ad-label a:hover{text-decoration-thickness:2px}
.ad-chip{margin-left:var(--s2);padding:0 5px;border:1px solid currentColor;border-radius:4px;font-size:.625rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;line-height:1.5;opacity:.85}
.btn .nowrap{white-space:nowrap}
.cta-row{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center;margin-top:var(--s5)}
.trust{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);margin-top:var(--s4);font-size:var(--fs-xs);color:var(--muted);line-height:1.4}
.trust span{display:inline-flex;align-items:center;gap:6px}
.trust svg{width:15px;height:15px;color:var(--moss);flex:none}
.section--night .trust{color:var(--night-muted)}
.section--night .trust svg{color:var(--night-moss)}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:saturate(1.2) blur(8px);border-bottom:1px solid var(--line);transition:background-color 600ms var(--ease)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);height:72px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-family:var(--font-head);font-weight:650;font-size:1.3125rem;letter-spacing:-.005em}
.brand:hover{color:var(--ink)}
.brand svg{width:34px;height:34px;flex:none}
.nav{display:flex;align-items:center;gap:var(--s5)}
.nav a{color:var(--ink-soft);text-decoration:none;font-size:.9375rem;font-weight:550}
.nav a:hover,.nav a[aria-current="page"]{color:var(--ink);text-decoration:underline}
.header-actions{display:flex;align-items:center;gap:var(--s3)}
.header-actions .btn{padding:11px 16px;font-size:.9375rem}
.theme-toggle,.nav-toggle{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:var(--r-btn);border:1.5px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;transition:border-color var(--dur) var(--ease),background-color var(--dur) var(--ease)}
.theme-toggle:hover,.nav-toggle:hover{border-color:var(--ink)}
.theme-toggle svg,.nav-toggle svg{width:20px;height:20px}
.theme-toggle .i-sun{display:none}
:root[data-theme="night"] .theme-toggle .i-sun{display:block}
:root[data-theme="night"] .theme-toggle .i-moon{display:none}
.nav-toggle{display:none}
@media (max-width:900px){
  .nav{display:none;position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;background:var(--paper);border-bottom:1px solid var(--line);padding:var(--s3) var(--s5) var(--s5)}
  .nav.is-open{display:flex}
  .nav a{display:block;width:100%;padding:var(--s3) 0;font-size:var(--fs-base);border-bottom:1px solid var(--line)}
  .nav-toggle{display:inline-grid}
  .header-actions .btn{display:none}
}

/* hero */
.hero{position:relative;padding:clamp(48px,7vw,104px) 0 clamp(56px,7vw,96px);overflow:hidden;background:linear-gradient(180deg,var(--paper) 0%,var(--sand) 100%)}
.hero .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:var(--s8);align-items:center}
.hero h1{max-width:15ch}
.hero .lede{max-width:44ch}
.hero-topo{position:absolute;inset:0;pointer-events:none;color:var(--line);opacity:.9}
.hero-topo svg{position:relative;width:100%;height:100%}
.hero-topo svg path{transition:opacity 1.4s var(--ease)}
.topo-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1.4s var(--ease)}
.hero-topo.is-live .topo-canvas{opacity:1}
.hero-topo.is-live svg path:not(.river):not(.river-flow){opacity:0}
.river-flow{stroke-dasharray:1 26;opacity:.9;animation:river-flow 7s linear infinite}
@keyframes river-flow{to{stroke-dashoffset:-270}}
@media (prefers-reduced-motion:reduce){.river-flow{display:none}}
.hero-card{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--s5);box-shadow:var(--shadow-2)}
.hero-card h2{font-size:var(--fs-lg);margin-bottom:var(--s2)}
@media (max-width:900px){.hero .wrap{grid-template-columns:minmax(0,1fr);gap:var(--s6)}}

/* waveform glyph */
.wave{display:flex;align-items:center;gap:3px;height:44px}
.wave i{display:block;width:4px;border-radius:2px;background:currentColor;opacity:.85;height:var(--h,40%);transform-origin:center}
@media (prefers-reduced-motion:no-preference){
  .is-active .wave i,.wave.is-live i{animation:wave 1.1s var(--ease) infinite alternate;animation-delay:calc(var(--i) * -90ms)}
}
@keyframes wave{from{transform:scaleY(.35)}to{transform:scaleY(1)}}

/* animal line icons (drawn to match the house) */
.ani{display:inline-block;width:48px;height:48px;flex:none;color:var(--ink)}
.ani svg{width:100%;height:100%;display:block}
.sound .ani-row{display:flex;align-items:center;gap:var(--s4)}
.sound[aria-pressed="true"] .ani{color:var(--cta)}
.step .ani{width:44px;height:44px;color:currentColor;margin-bottom:var(--s2)}
.eyebrow .ani{width:28px;height:28px;vertical-align:-9px;margin-right:var(--s2);color:var(--moss)}

/* sound picker */
.picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4);margin-top:var(--s6)}
.sound{display:flex;flex-direction:column;gap:var(--s3);text-align:left;font:inherit;color:var(--ink);background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r-card);padding:var(--s5);cursor:pointer;transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.sound:hover{border-color:var(--ink);transform:translateY(-2px);box-shadow:var(--shadow-1)}
.sound[aria-pressed="true"]{border-color:var(--cta);box-shadow:0 0 0 1px var(--cta)}
.sound .wave{color:var(--moss)}
.sound[aria-pressed="true"] .wave{color:var(--cta)}
.sound strong{font-family:var(--font-head);font-size:1.375rem;font-weight:620;line-height:1.2;text-wrap:pretty}
.sound span{font-size:.9375rem;color:var(--muted);line-height:1.45}
.verdict{margin-top:var(--s5);border-radius:var(--r-card);background:var(--night);color:var(--night-ink);padding:var(--s6);display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--s6);align-items:start}
.verdict[hidden]{display:none}
.verdict h3{font-size:var(--fs-lg);color:var(--night-ink)}
.verdict p,.verdict li{color:var(--night-soft)}
.verdict .eyebrow{color:var(--night-moss)}
.verdict-photo{margin:0 0 var(--s4);border-radius:var(--r-btn);overflow:hidden;aspect-ratio:3/2;background:var(--night-2)}
.verdict-photo img{width:100%;height:100%;object-fit:cover}
.verdict .btn--primary{background:var(--lamp);color:var(--lamp-ink)}
.verdict .btn--primary:hover{background:var(--lamp-hover)}
.verdict .trust{color:var(--night-muted)}
.verdict .trust svg{color:var(--night-moss)}
@media (max-width:900px){.picker{grid-template-columns:1fr 1fr}.verdict{grid-template-columns:minmax(0,1fr);padding:var(--s5)}}
@media (max-width:560px){.picker{grid-template-columns:minmax(0,1fr)}}

/* the house: scroll-driven cutaway */
.house{position:relative;background:var(--sky,var(--sand));transition:background-color 700ms var(--ease);color:var(--ink)}
.house[data-step="2"],.house[data-step="3"]{--sky:var(--dusk);color:var(--night-ink)}
.house[data-step="4"],.house[data-step="5"]{--sky:var(--night);color:var(--night-ink)}
.house[data-step="2"] .eyebrow,.house[data-step="3"] .eyebrow,.house[data-step="4"] .eyebrow,.house[data-step="5"] .eyebrow{color:var(--night-moss)}
.house-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s8)}
.house-stage{position:sticky;top:96px;height:calc(100vh - 128px);max-height:720px;display:grid;place-items:center}
.house-stage svg{width:100%;height:100%;overflow:visible}
.house-steps{padding:20vh 0 30vh}
.step{min-height:70vh;display:flex;flex-direction:column;justify-content:center;opacity:.35;transition:opacity 400ms var(--ease)}
.step.is-active{opacity:1}
.step h3{font-size:var(--fs-xl);line-height:1.12}
.step .wave{color:currentColor;margin:var(--s3) 0 var(--s4)}
.step .facts{list-style:none;padding:0;margin:0 0 var(--s4)}
.step .facts li{padding-left:22px;position:relative}
.step .facts li::before{content:"";position:absolute;left:0;top:.62em;width:10px;height:2px;background:currentColor;opacity:.6}
.house .btn--primary{background:var(--cta);color:var(--cta-ink)}
.house[data-step="2"] .btn--primary,.house[data-step="3"] .btn--primary,.house[data-step="4"] .btn--primary,.house[data-step="5"] .btn--primary{background:var(--lamp);color:var(--lamp-ink)}
.house .btn--ghost{color:currentColor}
/* svg zones */
.hz{transition:opacity 500ms var(--ease)}
.hz-glow{opacity:0;transition:opacity 500ms var(--ease)}
.house[data-step="1"] .hz-glow[data-z="1"],.house[data-step="2"] .hz-glow[data-z="2"],.house[data-step="3"] .hz-glow[data-z="3"],.house[data-step="4"] .hz-glow[data-z="4"],.house[data-step="5"] .hz-glow[data-z="5"]{opacity:1}
.h-window{transition:fill 700ms var(--ease)}
.house[data-step="2"] .h-window,.house[data-step="3"] .h-window,.house[data-step="4"] .h-window,.house[data-step="5"] .h-window{fill:var(--lamp)}
.h-moon{opacity:0;transition:opacity 700ms var(--ease)}
.house[data-step="3"] .h-moon,.house[data-step="4"] .h-moon,.house[data-step="5"] .h-moon{opacity:1}
.h-sky{transition:fill 700ms var(--ease)}
@media (max-width:900px){
  .house-grid{grid-template-columns:minmax(0,1fr);gap:0}
  /* phones: the sticky panel ends exactly at the house's ground line, so text scrolling up
     disappears cleanly under the bottom of the house; the last 18px of the panel fades out */
  .house-stage{top:72px;height:auto;max-height:none;display:block;z-index:2;padding:var(--s2) 0 18px;overflow:hidden;
    background:linear-gradient(var(--sky,var(--sand)) calc(100% - 18px),transparent);transition:background-color 700ms var(--ease)}
  .house-stage svg{display:block;width:100%;height:36vh;margin-bottom:calc(36vh * -40 / 620)}
  .house-steps{padding:4vh 0 10vh}
  .step{min-height:auto;padding:var(--s7) 0;opacity:1}
}

/* trail cam */
.cam{position:relative;border-radius:var(--r-card);overflow:hidden;background:#000;aspect-ratio:16/9}
.cam video,.cam img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.15) brightness(.95) sepia(.25) hue-rotate(50deg)}
.cam::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.55) 100%),repeating-linear-gradient(0deg,rgba(255,255,255,.03) 0 1px,transparent 1px 3px)}
.cam-hud{position:absolute;z-index:1;left:var(--s4);right:var(--s4);top:var(--s3);display:flex;justify-content:space-between;font:600 var(--fs-xs)/1 ui-monospace,"SFMono-Regular",Menlo,monospace;letter-spacing:.08em;color:var(--hud);text-shadow:0 1px 2px #000}
.cam-hud{gap:var(--s3);line-height:1.35}
.cam-hud [data-clock]{white-space:nowrap}
.cam-hud .rec::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--lamp);margin-right:6px;vertical-align:0}
.cam-cap{position:absolute;z-index:1;left:var(--s4);bottom:var(--s3);font-size:var(--fs-xs);color:var(--night-muted);text-shadow:0 1px 2px #000}
.cams{display:grid;grid-template-columns:2fr 1fr;gap:var(--s4);margin-top:var(--s6)}
/* one pause/play control for all cams (WCAG 2.2.2), in the HUD's type */
.cam-toggle{grid-column:1/-1;justify-self:end;display:inline-flex;align-items:center;gap:var(--s2);min-height:36px;padding:0 var(--s4);font:600 var(--fs-xs)/1 ui-monospace,"SFMono-Regular",Menlo,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--hud);background:#000;border:1px solid var(--night-line);border-radius:var(--r-btn);cursor:pointer;transition:border-color var(--dur) var(--ease)}
.cam-toggle:hover{border-color:var(--lamp)}
.cam-toggle::before{content:"";width:10px;height:12px;border-left:3px solid var(--lamp);border-right:3px solid var(--lamp)}
.cam-toggle[aria-pressed="true"]::before{width:0;height:0;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent var(--lamp)}
.cam-toggle[hidden]{display:none}
.cams .stack{display:grid;grid-template-rows:1fr 1fr;gap:var(--s4)}
.cams .stack .cam{aspect-ratio:auto;min-height:0}
@media (max-width:900px){.cams{grid-template-columns:minmax(0,1fr)}.cams .stack{grid-template-columns:1fr 1fr}.cams .stack .cam{aspect-ratio:16/9}}
@media (max-width:600px){.cams .stack{grid-template-columns:minmax(0,1fr)}.cam-hud{font-size:11px}}

/* cards + grids */
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5)}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s7)}
@media (max-width:900px){.grid-3,.grid-2{grid-template-columns:minmax(0,1fr);gap:var(--s5)}}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--s5)}
.section--sand .card{background:var(--paper)}
.card h3{margin-bottom:var(--s2)}
.card p:last-child{margin-bottom:0}
.tile{display:flex;flex-direction:column;justify-content:space-between;gap:var(--s4);text-decoration:none;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--s5);min-height:180px;transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.tile:hover{color:var(--ink);border-color:var(--ink);transform:translateY(-2px);box-shadow:var(--shadow-1)}
.tile h3{margin:0}
.tile .go{display:inline-flex;align-items:center;gap:6px;font-weight:650;font-size:.9375rem;color:var(--cta)}
:root[data-theme="night"] .tile .go{color:var(--lamp)}
.tile .go svg{width:16px;height:16px;transition:transform var(--dur) var(--ease)}
.tile:hover .go svg{transform:translateX(3px)}
.steps-3{counter-reset:s;list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5);max-width:none}
.steps-3 li{counter-increment:s;border-top:2px solid var(--ink);padding-top:var(--s4);margin:0}
.steps-3 li::before{content:counter(s,decimal-leading-zero);display:block;font-family:var(--font-head);font-size:var(--fs-lg);font-weight:680;color:var(--moss);margin-bottom:var(--s2)}
.steps-3 strong{display:block;font-size:var(--fs-md);font-family:var(--font-head);font-weight:620;margin-bottom:var(--s1)}
@media (max-width:900px){.steps-3{grid-template-columns:minmax(0,1fr)}}
.notice{border-left:3px solid var(--cta);background:var(--sand);padding:var(--s4) var(--s5);border-radius:0 var(--r-btn) var(--r-btn) 0;margin:var(--s5) 0}
.notice p{margin:0}
.notice p+p{margin-top:var(--s2)}
:root[data-theme="night"] .notice{border-left-color:var(--lamp)}
.big-num{font-family:var(--font-head);font-size:var(--fs-xl);font-weight:680;line-height:1;color:var(--moss);margin-bottom:var(--s2);letter-spacing:-.01em}

/* article layout for symptom pages */
.article{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:var(--s8);align-items:start}
.article h2{font-size:var(--fs-lg);margin-top:var(--s7)}
.article h2:first-child{margin-top:0}
.aside{position:sticky;top:96px;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s4)}
@media (max-width:1000px){.article{grid-template-columns:minmax(0,1fr)}.aside{position:static}}
.crumbs{font-size:var(--fs-xs);color:var(--muted);margin-bottom:var(--s4)}
.crumbs a{color:var(--muted)}
.crumbs ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:0}
.crumbs li{margin:0}
.crumbs li+li::before{content:"/";margin-right:6px;opacity:.6}
.page-head{padding:clamp(40px,6vw,80px) 0 clamp(32px,4vw,56px);background:linear-gradient(180deg,var(--paper),var(--sand));position:relative;overflow:hidden}
.page-head .wrap{position:relative}
.page-head h1{max-width:20ch}
.page-head .lede{max-width:58ch}
.table{width:100%;border-collapse:collapse;margin:var(--s4) 0 var(--s5);font-size:.9375rem}
.table th,.table td{text-align:left;vertical-align:top;padding:var(--s3) var(--s3) var(--s3) 0;border-bottom:1px solid var(--line)}
.table th{font-size:var(--fs-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
.table sup{font-size:.7em;line-height:0;margin-left:1px}
.table a[href^="tel:"]{white-space:nowrap}
.sources{padding-left:1.4em;margin:var(--s3) 0 var(--s4)}
.sources li{margin-bottom:var(--s2)}
.faq details{border-bottom:1px solid var(--line);padding:var(--s4) 0}
.faq summary{cursor:pointer;font-family:var(--font-head);font-size:var(--fs-md);font-weight:620;list-style:none;display:flex;justify-content:space-between;gap:var(--s4)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--font-body);font-weight:400;color:var(--muted);transition:transform var(--dur) var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:var(--s3) 0 0}

.photo{margin:0 0 var(--s6);border-radius:var(--r-card);overflow:hidden;background:var(--sand);aspect-ratio:16/9}
.photo img{width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(1.04) sepia(.08)}
:root[data-theme="night"] .photo img{filter:saturate(.75) brightness(.82) contrast(1.05)}

/* map */
.map svg{width:100%;height:auto}
.map .river{fill:none;stroke:var(--river);stroke-width:3;stroke-linecap:round}
.map .county{fill:none;stroke:var(--line);stroke-width:1.5;stroke-dasharray:6 6}
.map .town circle{fill:var(--ink)}
.map .town.core circle{fill:var(--cta)}
:root[data-theme="night"] .map .town.core circle{fill:var(--lamp)}
.map .town text{font-family:var(--font-body);font-size:13px;fill:var(--ink-soft)}
.map .town.core text{font-weight:700;fill:var(--ink)}
.map .clabel{font-family:var(--font-head);font-size:18px;font-weight:650;fill:var(--muted);letter-spacing:.04em}
.town-list{columns:2;column-gap:var(--s6);list-style:none;padding:0}
.town-list li{break-inside:avoid}

/* form */
.form{display:grid;gap:var(--s4)}
.field{display:grid;gap:6px}
.field label{font-weight:600;font-size:.9375rem}
.field input,.field select,.field textarea{font:inherit;color:var(--ink);background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r-btn);padding:12px 14px;width:100%;transition:border-color var(--dur) var(--ease)}
.field textarea{min-height:96px;resize:vertical}
.field input:hover,.field textarea:hover,.field select:hover{border-color:var(--muted)}
.field input:focus-visible,.field textarea:focus-visible,.field select:focus-visible{outline:3px solid var(--focus);outline-offset:1px;border-color:var(--ink)}
.form .btn{justify-content:center;width:100%}
.form-status{font-size:.9375rem;margin:0}
.form-status[data-state="ok"]{color:var(--moss);font-weight:600}
.form-status[data-state="err"]{color:var(--err);font-weight:600}
:root[data-theme="night"] .form-status[data-state="err"]{color:var(--err-night)}
.hp{position:absolute;left:-9999px}

@media (max-width:560px){.cta-row .btn{flex:1 1 100%;justify-content:center}}
@media (max-width:380px){.brand{font-size:1.125rem}.brand span{white-space:nowrap}}
@media (max-width:900px){.verdict > div:last-child{display:flex;flex-direction:column}.verdict .sponsor-cta{order:-1;margin:0 0 var(--s5)}}

/* footer */
.site-footer{background:var(--night);color:var(--night-ink);padding:var(--s9) 0 var(--s8)}
.site-footer a{color:var(--night-ink)}
.site-footer a:hover{color:var(--lamp)}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--s6)}
.footer-grid h2,.footer-grid h3{font-family:var(--font-body);font-size:var(--fs-xs);letter-spacing:.14em;text-transform:uppercase;color:var(--night-moss);margin-bottom:var(--s3)}
.footer-grid h3{margin-top:var(--s5);color:var(--night-muted)}
.footer-grid ul{list-style:none;padding:0;margin:0}
.footer-grid li{margin-bottom:var(--s2)}
.footer-grid a{text-decoration:none;font-size:.9375rem}
.footer-grid a:hover{text-decoration:underline}
.site-footer .brand{color:var(--night-ink);margin-bottom:var(--s4)}
.footer-legal{border-top:1px solid var(--night-line);margin-top:var(--s7);padding-top:var(--s5);font-size:var(--fs-xs);color:var(--night-muted);display:grid;gap:var(--s2)}
.footer-legal p{max-width:none;margin:0}
@media (max-width:900px){.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}}

/* mobile CTA bar */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:none;flex-wrap:wrap;gap:var(--s1) var(--s2);padding:var(--s2) var(--s3) calc(var(--s2) + env(safe-area-inset-bottom));background:var(--paper);border-top:1px solid var(--line);transform:translateY(110%);transition:transform 250ms var(--ease)}
.mbar.is-on{transform:none}
.mbar .btn{flex:1;justify-content:center;padding:13px 10px}
.mbar-tag{flex:1 1 100%;margin:0;text-align:center;font-size:.75rem;color:var(--muted);line-height:1.4}
.mbar-tag b{margin-right:6px;padding:0 5px;border:1px solid currentColor;border-radius:4px;font-size:.625rem;letter-spacing:.1em;text-transform:uppercase}
@media (max-width:900px){.mbar{display:flex}body{padding-bottom:104px}}

/* entrance motion (decorative only) */
@media (prefers-reduced-motion:no-preference){
  .rise{opacity:0;transform:translateY(14px);transition:opacity 700ms var(--ease),transform 700ms var(--ease)}
  .rise.is-in{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation:none!important}
}