/* reset + base */
*,*::before,*::after{box-sizing:border-box;}
html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--header-h-mobile) + 12px);
}
body,h1,h2,h3,h4,p,figure,blockquote,dl,dd,ul,ol{margin:0;}
figure{margin:0;}
ul,ol{padding-left:0;list-style:none;}
img,svg,video,iframe{max-width:100%;display:block;}
button,input,select,textarea{font:inherit;color:inherit;}
button{background:transparent;border:0;cursor:pointer;}
a{color:inherit;text-decoration:none;}
[hidden]{display:none !important;}

body{
  font-family:var(--ff-body);
  background:var(--bg);
  background-image:radial-gradient(120% 80% at 50% 0%, color-mix(in srgb,var(--accent) 5%,var(--bg)) 0%, var(--bg) 60%);
  background-attachment:fixed;
  color:var(--text);
  font-size:var(--fs-body);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:clip;
  min-height:100dvh;
}

h1,h2,h3,h4{font-family:var(--ff-display);color:var(--text);line-height:1.15;font-weight:500;}
h1{font-size:var(--fs-h1);letter-spacing:-0.005em;}
h2{font-size:var(--fs-h2);letter-spacing:-0.003em;}
h3{font-size:var(--fs-h3);}
p{color:var(--text-2);}
em{font-style:italic;color:var(--accent);}
strong{font-weight:600;color:var(--text);}

/* micro details */
::selection{background:var(--accent);color:var(--bg);}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px;}
::placeholder{color:var(--text-mute);opacity:1;}
*::-webkit-scrollbar{width:8px;height:8px;}
*::-webkit-scrollbar-track{background:transparent;}
*::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--accent) 45%, transparent);border-radius:4px;}
*::-webkit-scrollbar-thumb:hover{background:var(--accent);}

/* container */
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 20px;}
@media (min-width:768px){.container{padding:0 32px;}}

/* section padding mobile-first */
section{padding:48px 0;}
@media (min-width:768px){section{padding:80px 0;}}

/* eyebrow shared */
.eyebrow{
  font-family:var(--ff-ui);
  text-transform:uppercase;
  letter-spacing:0.18em;
  font-size:var(--fs-eyebrow);
  color:var(--accent);
  font-weight:600;
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.eyebrow::before{content:"";width:32px;height:1px;background:var(--accent);}

/* anchor offset */
[id]{scroll-margin-top:calc(var(--header-h-mobile) + 12px);}
@media (min-width:768px){[id]{scroll-margin-top:calc(var(--header-h) + 12px);}}

/* utility */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}