* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--sans); font-size: 16px; line-height: 1.55; overflow-x: hidden; }
body::selection { background: var(--primary); color: white; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
.container { width: min(calc(100% - 48px), var(--container)); margin: 0 auto; }
.section { position: relative; padding: 124px 0; }
.eyebrow { color: #c4b5fd; font: 500 11px/1.2 var(--mono); letter-spacing: .12em; margin: 0 0 18px; }
.section-heading { max-width: 650px; margin-bottom: 56px; }
.section-heading h2 { margin: 0; font-size: clamp(2.25rem, 4.4vw, 4.2rem); line-height: 1.08; letter-spacing: -.06em; }
.section-heading > p:last-child { color: var(--muted); max-width: 520px; margin: 20px 0 0; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 18px; min-height: 48px; padding: 0 21px; border-radius: 11px; border: 1px solid transparent; color: #fff; background: linear-gradient(100deg, var(--primary), var(--primary-bright)); font-weight: 700; font-size: 14px; box-shadow: 0 12px 30px rgba(124, 58, 237, .22); transition: transform .2s, box-shadow .2s, filter .2s; }
.button:hover { transform: translateY(-2px); filter: brightness(1.1); box-shadow: 0 16px 34px rgba(124, 58, 237, .35); }
.button span { font-size: 18px; line-height: 1; }
.button-large { min-height: 57px; padding: 0 25px; }
.button-small { min-height: 39px; padding: 0 15px; border-radius: 9px; font-size: 13px; }
.button-outline { background: transparent; border-color: #35394c; box-shadow: none; }
.button-outline:hover { border-color: var(--primary); background: rgba(139, 92, 246, .08); }
.reveal { opacity: 0; transform: translateY(16px); transition: opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }
.delay-1 { transition-delay: .1s; }.delay-2 { transition-delay: .2s; }.delay-3 { transition-delay: .3s; }
@media (max-width: 720px) { .container { width: min(calc(100% - 32px), var(--container)); } .section { padding: 82px 0; } .section-heading { margin-bottom: 38px; } }