:root {
  --ink:#141414;
  --muted:#686868;
  --line:#d7d7d2;
  --paper:#f3f3f0;
  --panel:#fff;
  --accent:#1d1d1d;
  --accent-2:#505050;
  --soft:#ededeb;
  --shadow-xs:0 2px 6px rgba(20,20,20,.05);
  --shadow-sm:0 6px 16px rgba(20,20,20,.07);
  --shadow-md:0 14px 32px rgba(20,20,20,.10);
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:18px;
  font-family:Inter, Segoe UI, Arial, sans-serif;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0;
  color:var(--ink);
  background:
    linear-gradient(180deg,#ececea 0,#f3f3f0 255px),
    var(--paper);
  line-height:1.5;
  font-variant-numeric:tabular-nums;
}
a { color:inherit; text-decoration:none; }
.wrap { width:min(1180px,calc(100% - 32px)); margin:0 auto; }
header {
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 9% 16%,rgba(0,0,0,.16),transparent 28%),
    radial-gradient(circle at 82% 0%,rgba(0,0,0,.13),transparent 32%),
    linear-gradient(135deg,rgba(255,255,255,.94),rgba(245,245,242,.88)),
    #fff;
  border-bottom:1px solid var(--line);
  box-shadow:var(--shadow-sm);
}
header:after {
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:4px;
  background:linear-gradient(90deg,var(--accent),var(--accent-2),#777);
  opacity:.82;
}
.topbar {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  align-items:center;
  gap:16px;
  padding:16px 0 20px;
}
.brand { display:flex; align-items:center; gap:13px; min-width:0; font-weight:950; }
.mark {
  display:grid;
  place-items:center;
  width:50px;
  height:50px;
  border-radius:10px;
  color:#fff;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  box-shadow:var(--shadow-md);
  font-weight:950;
}
.brand span span {
  display:block;
  margin-top:2px;
  color:var(--muted);
  font-size:.76rem;
  font-weight:850;
  letter-spacing:.08em;
  text-transform:uppercase;
}
nav { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; }
nav a,.button,.button-secondary {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  border-radius:var(--radius-sm);
  padding:10px 14px;
  font-size:.84rem;
  font-weight:900;
  text-decoration:none;
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease, background .14s ease;
}
nav a { color:var(--muted); border:1px solid transparent; }
nav a:hover { color:var(--ink); border-color:rgba(20,20,20,.12); background:rgba(20,20,20,.04); }
.button {
  color:#fff;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  border:1px solid rgba(20,20,20,.16);
  box-shadow:var(--shadow-sm);
}
.button-secondary {
  color:var(--ink);
  border:1px solid rgba(20,20,20,.13);
  background:#fff;
}
.button:hover,.button-secondary:hover { transform:translateY(-1px); box-shadow:var(--shadow-sm); }
.hero {
  color:#f7f7f4;
  padding:clamp(42px,7vw,82px) 0;
  background:
    radial-gradient(circle at 10% 10%,rgba(255,255,255,.08),transparent 26rem),
    linear-gradient(135deg,#171717,#262626);
}
.hero .wrap { display:grid; gap:18px; }
.eyebrow {
  margin:0 0 9px;
  color:#858580;
  font-size:.76rem;
  font-weight:950;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.hero .eyebrow { color:#d9d9d1; }
h1,h2,h3,p { margin-top:0; }
h1 {
  max-width:940px;
  margin-bottom:14px;
  font-size:clamp(2.7rem,6vw,5.4rem);
  line-height:.88;
  letter-spacing:-.08em;
}
h2 {
  margin-bottom:10px;
  font-size:clamp(1.9rem,3.4vw,3.1rem);
  line-height:.94;
  letter-spacing:-.064em;
}
h3 { margin-bottom:8px; line-height:1.08; letter-spacing:-.035em; }
.lead,.plain { max-width:860px; color:var(--muted); line-height:1.58; }
.action-row { margin-top:14px; }
.hero .lead,.hero .plain { color:rgba(255,255,255,.74); }
.hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:10px; }
.hero .button-secondary { color:#f7f7f4; border-color:rgba(255,255,255,.18); background:rgba(255,255,255,.08); }
.hero-strip {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-top:12px;
}
.hero-chip,.metric,.card,.step,.source-card {
  border:1px solid rgba(20,20,20,.11);
  border-radius:var(--radius-md);
  background:#fbfbf9;
  padding:15px;
  min-width:0;
}
.hero-chip {
  border-color:rgba(255,255,255,.13);
  background:rgba(255,255,255,.07);
}
.hero-chip span,.metric span,.card span,.step span,.source-card span {
  display:block;
  color:var(--muted);
  font-size:.80rem;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.hero-chip span { color:rgba(255,255,255,.58); }
.hero-chip strong { display:block; margin-top:4px; color:#fff; line-height:1.12; }
.section {
  padding:clamp(42px,7vw,82px) 0;
  background:var(--paper);
}
.section:nth-of-type(odd) { background:#fff; }
.section.dark {
  color:#f7f7f4;
  background:linear-gradient(135deg,#171717,#292929);
}
.section.dark .plain,.section.dark .lead,.section.dark .card p,.section.dark .metric small,.section.dark .step span { color:rgba(255,255,255,.70); }
.section.dark .card,.section.dark .metric,.section.dark .step,.section.dark .source-card {
  border-color:rgba(255,255,255,.13);
  background:rgba(255,255,255,.07);
}
.section.dark .card strong,.section.dark .metric strong,.section.dark .source-card strong { color:#fff; }
.grid-2,.grid-3,.grid-4,.grid-5 { display:grid; gap:12px; margin-top:14px; }
.grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.grid-4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.grid-5 { grid-template-columns:repeat(5,minmax(0,1fr)); }
.metric strong {
  display:block;
  margin-top:7px;
  color:var(--ink);
  font-size:clamp(1.5rem,2.8vw,2.3rem);
  line-height:.98;
  letter-spacing:-.06em;
}
.metric small,.card p,.source-card p {
  display:block;
  margin:8px 0 0;
  color:var(--muted);
  line-height:1.45;
  font-size:.92rem;
}
.card strong,.source-card strong {
  display:block;
  margin-top:7px;
  color:var(--ink);
  line-height:1.1;
  letter-spacing:-.035em;
}
.step { display:grid; grid-template-columns:38px minmax(0,1fr); gap:11px; align-items:start; }
.step b {
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:var(--radius-sm);
  background:#1d1d1d;
  color:#fff;
}
table {
  width:100%;
  border-collapse:collapse;
  margin-top:14px;
  border:1px solid rgba(20,20,20,.10);
  background:#fff;
  border-radius:var(--radius-md);
  overflow:hidden;
}
th,td {
  padding:12px;
  border-bottom:1px solid rgba(20,20,20,.08);
  text-align:left;
  vertical-align:top;
}
th { font-size:.78rem; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; }
footer {
  padding:18px 0 32px;
  color:var(--muted);
  border-top:1px solid var(--line);
  background:#fff;
  font-size:.86rem;
}
footer a { color:var(--ink); text-decoration:underline; text-underline-offset:3px; font-weight:800; }
@media (max-width:1040px) {
  .topbar,.hero-strip,.grid-2,.grid-3,.grid-4,.grid-5 { grid-template-columns:1fr 1fr; }
  nav { justify-content:flex-start; }
}
@media (max-width:680px) {
  .wrap { width:min(100% - 22px,1180px); }
  .topbar,.hero-strip,.grid-2,.grid-3,.grid-4,.grid-5 { grid-template-columns:1fr; }
  h1 { font-size:clamp(2.5rem,15vw,4.1rem); }
}
@media print {
  header,.hero-actions { display:none!important; }
  body,.section,.section.dark,.hero { background:#fff; color:#111; }
  .hero .lead,.hero .plain,.section.dark .plain,.section.dark .lead { color:#111; }
  .card,.metric,.step,.source-card { break-inside:avoid; box-shadow:none; }
}