:root { color-scheme: dark; background: #151614; color: #f3f0e7; font-family: system-ui, -apple-system, sans-serif; }
* { box-sizing: border-box; }
body { max-width: 720px; margin: 0 auto; padding: 36px clamp(18px, 6vw, 54px); }
.brand { display: flex; align-items: center; gap: 10px; color: #f3c774; font-size: .85rem; font-weight: 750; letter-spacing: .14em; }
.brand img { border: 1px solid #383a33; border-radius: 8px; }
h1 { max-width: 13ch; font-size: clamp(2.25rem, 7vw, 4rem); line-height: 1.04; letter-spacing: -.045em; margin: 28px 0 14px; }
h2 { font-size: 1.15rem; margin: 23px 0 8px; }
p { line-height: 1.55; color: #b3b1a6; margin: 0 0 14px; }
.lede { max-width: 49ch; font-size: 1.12rem; }
.workflow { margin: 30px 0 18px; padding: 0; list-style: none; counter-reset: steps; }
.workflow li { counter-increment: steps; display: grid; grid-template-columns: 2.15rem minmax(0,1fr); gap: 5px 11px; padding: 13px 0; border-top: 1px solid #383a33; }
.workflow li::before { content: counter(steps, decimal-leading-zero); grid-row: span 2; color: #f3c774; font-variant-numeric: tabular-nums; }
.workflow li span { color: #b3b1a6; }
.availability { border-top: 1px solid #383a33; padding-top: 16px; }
footer { display: flex; flex-wrap: wrap; gap: 10px 20px; margin-top: 20px; }
a { color: #f3c774; display: inline-flex; align-items: center; min-height: 48px; text-underline-offset: 3px; }
a:focus-visible { outline: 2px solid #f3c774; outline-offset: 3px; }
.static-page h1 { max-width: none; font-size: clamp(2rem, 6vw, 3rem); }