*,*::before,*::after{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);font-size:var(--body);line-height:1.6;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--font-display);line-height:1.2;color:var(--text);font-weight:700;letter-spacing:-.005em}
h1{font-size:var(--h1)} h2{font-size:var(--h2)} h3{font-size:var(--h3);font-weight:600} h4{font-size:var(--h4);font-weight:600}
p{color:var(--text-secondary)}
a{color:var(--primary);text-decoration:none;transition:color var(--dur) var(--ease)}
a:hover{color:var(--primary-dark)}
img{max-width:100%;display:block}
ul{list-style:none;padding:0}
.container{max-width:var(--container);margin-inline:auto;padding-inline:var(--pad)}
.section{padding-block:var(--s128)}
.section--tight{padding-block:var(--s96)}
.eyebrow{font-size:var(--small);font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--honey-deep)}
.section-head{text-align:center;max-width:660px;margin:0 auto var(--s48)}
.section-head p{margin-top:var(--s12)}
.section-head h2::after{content:"";display:block;width:52px;height:3px;background:var(--honey);border-radius:2px;margin:var(--s16) auto 0}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
::selection{background:var(--accent);color:#1c1c1c}
/* Themed page scrollbar — driven by tokens, so it recolors per data-intensity (Invisible/Workshop/Field) */
html{scrollbar-color:var(--primary) var(--surface);scrollbar-width:thin}
::-webkit-scrollbar{width:13px;height:13px}
::-webkit-scrollbar-track{background:var(--surface)}
::-webkit-scrollbar-thumb{background:var(--primary);border-radius:999px;border:3px solid var(--surface)}
::-webkit-scrollbar-thumb:hover{background:var(--primary-dark)}
.price{font-variant-numeric:tabular-nums;font-weight:700;font-size:var(--price)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media (max-width:849px){:root{--pad:16px} .section{padding-block:var(--s64)} .section--tight{padding-block:var(--s48)} .section-head{margin-bottom:var(--s32)}}
