*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--surface-0); }
body { margin: 0; color: var(--ink-0); background: var(--surface-0); font-family: var(--sans); line-height: 1.6; text-rendering: optimizeLegibility; }
body::before { content: ""; position: fixed; inset: 0; z-index: -2; background: radial-gradient(circle at 72% 4%, rgba(23, 117, 146, 0.18), transparent 31rem), linear-gradient(180deg, #0b1016 0, var(--surface-0) 40rem); }
body::after { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: 0.12; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(to bottom, black, transparent 60%); }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
img { display: block; max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { letter-spacing: -0.045em; line-height: 1.02; text-wrap: balance; }
h1 { font-size: clamp(3.7rem, 7.8vw, 7rem); }
h2 { font-size: clamp(2.6rem, 5vw, 4.8rem); }
h3 { line-height: 1.25; }
p { color: var(--ink-1); }
code { font-family: var(--mono); }
::selection { color: var(--surface-0); background: var(--cyan); }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }
.skip-link { position: fixed; top: 1rem; left: 1rem; z-index: 100; padding: .7rem 1rem; color: var(--surface-0); background: var(--cyan); border-radius: var(--radius-sm); transform: translateY(-180%); }
.skip-link:focus { transform: translateY(0); }
.eyebrow { margin-bottom: 1.3rem; color: var(--cyan); font: 700 .76rem/1.2 var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.text-link { display: inline-flex; align-items: center; gap: .5rem; color: var(--ink-0); font-weight: 650; }
.text-link span { color: var(--cyan); transition: transform .2s ease; }
.text-link:hover span { transform: translateX(.2rem); }
