:root{
  --black:#0a0a0a;
  --charcoal:#111111;
  --surface:#161616;
  --elevated:#1c1c1c;
  --hairline:rgba(245,245,245,0.10);
  --hairline-strong:rgba(245,245,245,0.16);
  --white:#f5f5f5;
  --silver:#9c9c97;
  --gold:#d4af37;
  --gold-soft:#e6c761;
  --gold-dim:rgba(212,175,55,0.14);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--black);
  color:var(--white);
  font-family:'Inter',ui-sans-serif,system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.font-serif-display{font-family:'Playfair Display',serif;}

.grain{
  position:absolute; inset:0; pointer-events:none; opacity:0.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

#nav{
  backdrop-filter:blur(0px);
  background:linear-gradient(to bottom, rgba(10,10,10,0.0), rgba(10,10,10,0.0));
  border-bottom:1px solid transparent;
  transition:background-color 320ms ease, border-color 320ms ease, backdrop-filter 320ms ease;
}
#nav.scrolled{
  background-color:rgba(10,10,10,0.78);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--hairline);
}

.nav-link{
  position:relative; color:var(--white); font-size:13px; letter-spacing:0.10em;
  text-transform:uppercase; font-weight:500;
  transition:color 220ms ease;
}
.nav-link:hover{color:var(--white);}
.nav-link::after{
  content:''; position:absolute; left:0; bottom:-6px; width:0%; height:1px; background:var(--gold);
  transition:width 260ms cubic-bezier(.2,.8,.2,1);
}
.nav-link:hover::after{width:100%;}

.btn-primary{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--gold); color:#0a0a0a; font-weight:600; font-size:13px;
  letter-spacing:0.10em; text-transform:uppercase;
  padding:16px 30px; border-radius:999px;
  box-shadow:0 1px 0 rgba(255,255,255,0.25) inset, 0 12px 30px -10px rgba(212,175,55,0.55);
  transition:transform 240ms cubic-bezier(.2,.8,.2,1), box-shadow 240ms ease, background-color 240ms ease;
}
.btn-primary:hover{
  transform:translateY(-2px);
  background:var(--gold-soft);
  box-shadow:0 1px 0 rgba(255,255,255,0.3) inset, 0 18px 40px -10px rgba(212,175,55,0.65);
}
.btn-primary:active{transform:translateY(0px) scale(0.98);}
.btn-primary:focus-visible{outline:2px solid var(--gold-soft); outline-offset:3px;}

.hairline{border-color:var(--hairline);}

@keyframes fadeUp{
  from{opacity:0; transform:translateY(28px);}
  to{opacity:1; transform:translateY(0);}
}
.reveal{opacity:1;}
.reveal.animate{animation:fadeUp 800ms cubic-bezier(.2,.8,.2,1) both;}

.label-kicker{
  font-size:12px; letter-spacing:0.22em; text-transform:uppercase; color:var(--gold);
  font-weight:600;
}

::selection{background:var(--gold); color:#0a0a0a;}

/* TOC sidebar */
.toc-link{
  display:block; position:relative; padding:9px 0 9px 18px; font-size:13px;
  color:var(--silver); border-left:1px solid var(--hairline);
  transition:color 220ms ease, border-color 220ms ease;
}
.toc-link:hover{color:var(--white);}
.toc-link.is-active{color:var(--gold); border-color:var(--gold);}

/* legal content */
.legal-section{scroll-margin-top:110px;}
.legal-section h2{
  font-family:'Playfair Display',serif; font-size:22px; color:var(--white);
  margin-bottom:14px;
}
.legal-section p, .legal-section li{
  color:var(--silver); font-size:14.5px; line-height:1.8;
}
.legal-section li{margin-bottom:6px;}
.legal-section + .legal-section{
  margin-top:40px; padding-top:40px; border-top:1px solid var(--hairline);
}