/* ---------- tokens: light (default) ---------- */
:root{
  --ground:#F2F4F1;
  --surface:#FFFFFF;
  --ink:#131A16;
  --muted:#5C6862;
  --faint:#8A968F;
  --line:#D8DED9;
  --pine:#1B5C43;
  --brass:#8A6614;
  --focus:#1B5C43;
  --measure:34rem;
  --step--1:0.815rem;
  --step-0:1rem;
  --step-1:1.27rem;
  --step-2:1.62rem;
  --step-3:2.3rem;
  --step-4:clamp(2.6rem,1.6rem + 4.4vw,4.4rem);
  --sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --serif:ui-serif,Georgia,Cambria,"Times New Roman",Times,serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
}
/* ---------- tokens: dark via system preference ---------- */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ground:#0F1512;
    --surface:#161E1A;
    --ink:#E7EDE9;
    --muted:#9CA9A2;
    --faint:#6D7C75;
    --line:#27322D;
    --pine:#5FAF8B;
    --brass:#D2A03C;
    --focus:#5FAF8B;
  }
}
/* ---------- tokens: dark via explicit choice ---------- */
:root[data-theme="dark"]{
  --ground:#0F1512;
  --surface:#161E1A;
  --ink:#E7EDE9;
  --muted:#9CA9A2;
  --faint:#6D7C75;
  --line:#27322D;
  --pine:#5FAF8B;
  --brass:#D2A03C;
  --focus:#5FAF8B;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--ground);
  color:var(--ink);
  font-family:var(--serif);
  font-size:var(--step-0);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--ink);text-decoration:underline;text-underline-offset:.22em;text-decoration-color:var(--line);text-decoration-thickness:1px;}
a:hover{text-decoration-color:var(--pine);}
a:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:2px;}

.wrap{width:min(100% - 2.5rem,64rem);margin-inline:auto;}

/* ---------- masthead ---------- */
.masthead{padding-block:2rem 0;}
.mark{display:inline-flex;align-items:center;gap:.85rem;text-decoration:none;color:inherit;}
.mark:hover .name{color:var(--pine);}
.mark svg{display:block;flex:none;}
.mark .name{
  font-family:var(--sans);
  font-weight:600;
  font-size:var(--step-0);
  letter-spacing:.19em;
  text-transform:uppercase;
}

/* ---------- hero ---------- */
.hero{
  display:grid;
  grid-template-columns:1fr;
  gap:3rem;
  padding-block:clamp(3.5rem,10vw,7rem) clamp(3.5rem,9vw,6rem);
  border-bottom:1px solid var(--line);
}
@media (min-width:56rem){
  .hero{grid-template-columns:minmax(0,1fr) 15rem;align-items:end;gap:4rem;}
}
.hero h1{font-size:var(--step-4);}
h1{
  font-family:var(--serif);
  font-weight:400;
  font-size:var(--step-3);
  line-height:1.06;
  letter-spacing:-.018em;
  text-wrap:balance;
  margin:0 0 1.5rem;
}
.fan{width:100%;max-width:15rem;height:auto;color:var(--brass);opacity:.9;}
.fan .ray{stroke:currentColor;stroke-width:1.5;stroke-linecap:round;}
.fan .arc{stroke:var(--line);stroke-width:1;fill:none;}
.fan .hub{fill:var(--pine);}

/* ---------- sections ---------- */
section{
  padding-block:clamp(2.75rem,6vw,4rem);
  border-bottom:1px solid var(--line);
}
section:last-of-type{border-bottom:0;}
.sec-head{
  font-family:var(--sans);
  font-size:var(--step--1);
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--faint);
  margin:0 0 1.75rem;
}
@media (min-width:56rem){
  .cols{display:grid;grid-template-columns:11rem minmax(0,1fr);gap:3rem;align-items:start;}
  .cols .sec-head{margin:.35rem 0 0;}
}
h2{
  font-family:var(--serif);
  font-weight:400;
  font-size:var(--step-2);
  line-height:1.2;
  letter-spacing:-.01em;
  margin:0 0 1rem;
}
h3{
  font-family:var(--sans);
  font-weight:600;
  font-size:var(--step-0);
  letter-spacing:.005em;
  margin:1.9rem 0 .5rem;
}
h3:first-of-type{margin-top:0;}
p{max-width:var(--measure);margin:0 0 1rem;}
p:last-child{margin-bottom:0;}
.body-sm{font-size:var(--step--1);line-height:1.7;color:var(--muted);}

/* ---------- register data ---------- */
dl.reg{
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  margin:0;
  max-width:44rem;
}
@media (min-width:34rem){
  dl.reg{grid-template-columns:13rem minmax(0,1fr);}
}
dl.reg dt{
  font-family:var(--sans);
  font-size:var(--step--1);
  color:var(--faint);
  padding:.6rem 0 0;
  border-top:1px solid var(--line);
}
dl.reg dd{
  margin:0;
  padding:.6rem 0 .85rem;
  font-size:var(--step-0);
}
@media (min-width:34rem){
  dl.reg dd{border-top:1px solid var(--line);padding-top:.6rem;}
}
dl.reg dd.code{
  font-family:var(--mono);
  font-size:.9em;
  font-variant-numeric:tabular-nums;
  letter-spacing:.01em;
}

/* ---------- footer ---------- */
footer{
  padding-block:2.5rem 3.5rem;
  font-family:var(--sans);
  font-size:var(--step--1);
  color:var(--faint);
  display:flex;
  flex-wrap:wrap;
  gap:.5rem 1.5rem;
  align-items:baseline;
  justify-content:space-between;
  border-top:1px solid var(--line);
}
footer nav{display:flex;gap:1.25rem;flex-wrap:wrap;}

@media (prefers-reduced-motion:no-preference){
  .fade{animation:fade .7s ease both;}
  @keyframes fade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
}

/* ---------- legal pages ---------- */
.page{padding-block:clamp(2.5rem,7vw,4.5rem) 0;}
.page h1{margin:0 0 2rem;}
.page .updated{
  font-family:var(--sans);
  font-size:var(--step--1);
  color:var(--faint);
  margin:-1.4rem 0 2.25rem;
}