*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--header-h); background: var(--surface); }
body { margin: 0; background: var(--surface); color: var(--text-primary); font-family: var(--font-sans); font-size: 16px; line-height: 1.65; overflow-x: hidden; transition: background .35s, color .35s; }
body.menu-open { overflow: hidden; }
img, picture, svg, canvas { display: block; max-width: 100%; }
button, input, textarea, select { font: inherit; }
button, a { color: inherit; }
a { text-decoration: none; }
p { margin: 0 0 1rem; color: var(--text-secondary); }
h1, h2, h3, h4 { margin: 0; line-height: 1.03; letter-spacing: -.015em; }
h1 { font-size: clamp(3.45rem, 7vw, 7.8rem); }
h2 { font-size: clamp(2.65rem, 5vw, 5.65rem); max-width: 16ch; }
h3 { font-size: clamp(1.2rem, 2vw, 1.65rem); }
em { font-family: var(--font-serif); font-weight: 400; }
.wrap { width: var(--wrap); margin-inline: auto; }
.section { position: relative; padding: clamp(96px, 12vw, 180px) 0; }
.section-dark { background: var(--navy-950); color: var(--white); }
.section-dark p { color: #aabbd2; }
.section-blue { background: var(--blue-600); color: var(--white); }
.section-blue p { color: #dbeaff; }
.eyebrow { display: flex; align-items: center; gap: .55rem; margin-bottom: 2rem; color: var(--blue-600); font-size: 0.8rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.section-dark .eyebrow, .section-blue .eyebrow { color: var(--cyan-400); }
.eyebrow::before { content: ''; width: 26px; height: 1px; background: currentColor; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 999; top: 10px; left: 10px; padding: 12px 18px; background: var(--white); color: var(--navy-950); transform: translateY(-160%); transition: .2s; }
.skip-link:focus { transform: none; }
:focus-visible { outline: 3px solid var(--cyan-400); outline-offset: 4px; }
.honeypot { position: absolute !important; left: -9999px !important; }
.page-progress { position: fixed; z-index: 150; top: 0; left: 0; width: 100%; height: 2px; pointer-events: none; }
.page-progress span { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, var(--cyan-400), var(--blue-500), var(--indigo-400)); transform: scaleX(0); transform-origin: left; }
/* Minimum readable type size */
small, sub, sup { font-size:0.8rem; }