:root{--leading:28px;--half:14px;--edge:clamp(20px,5vw,72px);--measure:60ch}
body{margin:0;background:radial-gradient(1200px 720px at 82% -160px,color-mix(in srgb, var(--color-accent-900) 75%, transparent), transparent 60%),radial-gradient(1100px 800px at -10% 100%,color-mix(in srgb, black 30%, transparent), transparent 55%),var(--color-bg);text-wrap:pretty}
.wrap{max-width:1100px;margin:0 auto;padding:0 var(--edge)}
.kicker{position:relative;display:block;font-size:13px;line-height:var(--half);letter-spacing:0.06em;text-transform:uppercase;color:var(--color-accent);margin:0 0 calc(var(--leading) - var(--half))}
.page-hero{padding:calc(2.8*var(--leading)) 0 calc(2*var(--leading))}
.page-hero h1{font-size:clamp(34px,4.4vw,52px);letter-spacing:-0.015em;margin:0}
.page-hero .sub{font-size:16px;line-height:var(--leading);max-width:var(--measure);margin:calc(1*var(--leading) - 1cap) 0 0;color:color-mix(in srgb, var(--color-text) 82%, transparent)}
.plats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--leading);padding-bottom:calc(2*var(--leading))}
.plat{border:1px solid var(--color-neutral-800);background:var(--color-surface);border-radius:var(--radius-lg);padding:var(--space-8) var(--space-6);text-align:center}
.plat .pt{font-size:19px;margin:var(--space-3) 0 var(--space-2)}
.plat .pd{font-size:14px;color:color-mix(in srgb, var(--color-text) 72%, transparent);margin:0 0 var(--space-4)}
.badge{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--color-neutral-700);border-radius:999px;padding:5px 14px;font-size:12.5px;letter-spacing:0.02em;color:color-mix(in srgb, var(--color-text) 75%, transparent)}
.badge .dot{width:6px;height:6px;border-radius:50%;background:var(--color-accent)}
@media (max-width:820px){.plats{grid-template-columns:1fr}}
.note{padding:0 0 calc(2.5*var(--leading));max-width:var(--measure)}
.note p{font-size:15px;line-height:var(--leading);color:color-mix(in srgb, var(--color-text) 82%, transparent)}
.section{padding:var(--leading) 0}
.section h2{font-size:22px;margin:0 0 var(--space-3)}
.section p,.steps li{font-size:15.5px;line-height:var(--leading);color:color-mix(in srgb, var(--color-text) 82%, transparent);max-width:64ch}
.section a{color:var(--color-accent-300)}
.page-hero .sub a{color:var(--color-accent-300)}
.callout{border:1px solid var(--color-accent-700);background:color-mix(in srgb, var(--color-accent-900) 55%, transparent);border-radius:var(--radius-md);padding:var(--space-6);margin:var(--leading) 0}
.callout b{color:var(--color-accent-300)}
.callout p{margin:var(--space-2) 0 0;font-size:14.5px;max-width:64ch}
.label{margin:var(--space-4) 0 var(--space-1);font-size:13px;letter-spacing:0.06em;text-transform:uppercase;color:color-mix(in srgb, var(--color-text) 60%, transparent)}
pre.copy{margin:0;padding:var(--space-3) var(--space-4);border:1px solid var(--color-neutral-700);border-radius:var(--radius-sm);background:var(--color-surface);font-size:14px;line-height:1.5;color:var(--color-text)}
.steps{padding-left:1.4em}
.beta{border:1px solid var(--color-accent-700);border-radius:var(--radius-lg);background:color-mix(in srgb, var(--color-accent) 8%, var(--color-surface));padding:var(--space-8);margin:0 0 calc(2*var(--leading));max-width:720px}
.beta h2{font-size:20px;margin:0 0 var(--space-3)}
.beta p{font-size:15px;line-height:1.6;margin:0 0 var(--space-6);color:color-mix(in srgb, var(--color-text) 84%, transparent)}