html { background: var(--color-bg-deep); }
body { min-width: 20rem; overflow-x: hidden; background: var(--color-bg); color: var(--color-text); font-family: var(--font-sans); font-size: var(--text-base); line-height: 1.65; text-rendering: optimizeLegibility; }
main:focus { outline: none; }
a { color: inherit; text-decoration-thickness: .08em; text-underline-offset: .22em; }
a:hover { text-decoration-color: var(--color-accent); }
:focus-visible { outline: .2rem solid var(--color-focus); outline-offset: .25rem; }
::selection { background: var(--color-accent); color: var(--color-text); }
.container { width: min(calc(100% - 2rem), var(--content-wide)); margin-inline: auto; }
.section { position: relative; padding-block: clamp(4.5rem, 9vw, var(--space-10)); }
.section--light { background: var(--color-surface-light); color: var(--color-ink); }
.section--deep { background: var(--color-bg-deep); }
.technical-grid { background-image: linear-gradient(rgb(67 102 139 / 6%) 1px, transparent 1px), linear-gradient(90deg, rgb(67 102 139 / 6%) 1px, transparent 1px); background-size: 8rem 8rem; }
.section-kicker, .eyebrow { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-4); color: var(--color-accent); font-size: var(--text-xs); font-weight: 750; letter-spacing: .16em; line-height: 1.3; text-transform: uppercase; }
.section-kicker::before { width: 2rem; height: 1px; background: currentColor; content: ""; }
h1, h2, h3 { font-weight: 720; letter-spacing: -.035em; line-height: 1.08; text-wrap: balance; }
h2 { max-width: 16ch; font-size: var(--text-h2); }
h3 { font-size: var(--text-h3); }
p { text-wrap: pretty; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.skip-link { position: fixed; z-index: 10000; top: 0; left: 50%; max-width: calc(100vw - 2rem); padding: var(--space-3) var(--space-4); transform: translate(-50%, -150%); border: 2px solid var(--color-focus); border-radius: var(--radius-sm); background: var(--color-text); color: var(--color-ink); font-weight: 700; white-space: nowrap; }
.skip-link:focus, .skip-link:focus-visible { top: var(--space-3); transform: translateX(-50%); }
.anchor-target { position: absolute; bottom: 0; }
@media (min-width: 48rem) { .container { width: min(calc(100% - 4rem), var(--content-wide)); } }
@media (min-width: 90rem) { .container { width: min(calc(100% - 8rem), var(--content-wide)); } }
