*{box-sizing:border-box}
html,body{height:100%}
html{scroll-behavior:smooth}

body{
  margin:0;
  min-height:100%;
  overflow-x:hidden;
  font-family: "Inter", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  background:
    radial-gradient(1200px 700px at 20% -10%, rgba(59,130,246,.18), transparent 60%),
    radial-gradient(900px 520px at 90% 0%, rgba(0,255,245,.12), transparent 50%),
    radial-gradient(900px 520px at 20% 90%, rgba(16,185,129,.08), transparent 55%),
    var(--color-bg-primary);
  color:var(--color-text-primary);
  line-height:1.55;
}
a{color:inherit;text-decoration:none}
a:hover{color:var(--color-accent)}
code,pre,kbd,samp{font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;}
img{max-width:100%;height:auto}
.container{max-width:var(--container-max);margin:0 auto;padding:0 clamp(16px, 3vw, var(--space-6))}
.muted{color:var(--color-text-secondary)}
.tiny{font-size:12px;color:var(--color-text-tertiary)}
.kicker{letter-spacing:.12em;text-transform:uppercase;font-size:12px;color:var(--color-text-tertiary)}
.h1{
  font-family: "Space Grotesk", "Inter", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size:clamp(44px, 5vw, 76px);
  line-height:1.03;
  letter-spacing:-.03em;
  margin:0;
  font-weight:800;
  white-space:pre-line;
}
.h2{
  font-family: "Space Grotesk", "Inter", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size:clamp(28px, 3.2vw, 44px);
  line-height:1.12;
  margin:0;
  font-weight:800;
  letter-spacing:-.02em;
}
.h3{font-size:20px;line-height:1.3;margin:0;font-weight:800;letter-spacing:-.01em}
.p{margin:0;color:var(--color-text-secondary)}
.lead{margin:0;color:var(--color-text-secondary);font-size:clamp(16px, 1.4vw, 18px);line-height:1.65}
.mono{font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;}
.preline{white-space:pre-line}
hr.sep{border:none;border-top:1px solid var(--color-border-secondary);margin:var(--space-10) 0}
.grid{display:grid;gap:var(--space-6)}
@media (min-width: 900px){
  .grid-2{grid-template-columns:1.1fr .9fr}
  .grid-3{grid-template-columns:repeat(3,1fr)}
  .grid-4{grid-template-columns:repeat(4,1fr)}
}