*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-body);color:var(--ink);background:var(--surface)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);border-bottom:1px solid var(--border);backdrop-filter:none}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;padding:16px 24px}
.site-nav{display:flex;gap:32px;align-items:center}
.site-nav a{font-size:.92rem;font-weight:600;color:var(--ink-soft);text-decoration:none;position:relative;padding:4px 0}
.site-nav a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--sky);transition:width .2s ease}
.site-nav a:hover{color:var(--blue)}
.site-nav a:hover::after{width:100%}
.site-nav a.active{color:var(--blue)}
.site-nav a.active::after{width:100%;background:var(--blue)}
a{color:var(--blue)}
a:hover{color:var(--blue-ink)}

.hero{position:relative;overflow:hidden;border-radius:0 0 var(--r-lg) var(--r-lg);color:#fff;padding:96px 24px 104px;isolation:isolate}
.hero-bg{position:absolute;inset:0;z-index:-2;background:linear-gradient(120deg,var(--blue-ink),var(--blue) 45%,var(--sky) 100%);background-size:220% 220%;animation:heroDrift 18s ease-in-out infinite}
.hero-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 75% 20%,rgba(255,255,255,.18),transparent 55%)}
@keyframes heroDrift{0%{background-position:0% 30%}50%{background-position:100% 70%}100%{background-position:0% 30%}}
.hero-symbol{position:absolute;right:-8%;top:-14%;width:52%;max-width:560px;opacity:.14;z-index:-1;animation:symbolFloat 12s ease-in-out infinite}
@keyframes symbolFloat{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-14px) rotate(2deg)}}
.hero .wrap{position:relative;text-align:center;display:flex;flex-direction:column;align-items:center}
.hero-badges{display:flex;gap:10px;margin-bottom:28px;flex-wrap:wrap;justify-content:center}
.hero-badges>*{white-space:nowrap;flex-shrink:0}
.badge-on-dark>span{color:#fff!important;border-color:rgba(255,255,255,.6)!important}
.hero h1{font-family:var(--font-display);font-weight:400;font-size:clamp(2.4rem,5vw,3.6rem);margin:0 0 8px;letter-spacing:.5px}
.hero .tagline{font-size:1rem;opacity:.85;margin:0 0 28px;font-style:italic}
.hero p.lede{font-size:1.15rem;max-width:680px;margin:0 auto 12px;opacity:.94;text-wrap:pretty}
.hero p.lede.small{font-size:1rem;opacity:.8;max-width:640px}

section{padding:72px 24px}
.section-title{font-family:var(--font-display);font-weight:400;font-size:2rem;margin:0 0 12px}
.section-lede{color:var(--ink-soft);font-size:1.05rem;max-width:680px;margin:0 0 40px;text-wrap:pretty}

.cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.cta-card{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);padding:40px;box-shadow:var(--shadow-card);transition:transform .25s ease,box-shadow .25s ease;display:flex;flex-direction:column;gap:16px}
.cta-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-raised)}
.cta-card .icon-dot{width:52px;height:52px;border-radius:var(--r-md);background:var(--sky-soft);display:flex;align-items:center;justify-content:center}
.cta-card .icon-dot svg{width:26px;height:26px;stroke:var(--blue)}
.cta-card h3{font-family:var(--font-display);font-weight:400;font-size:1.4rem;margin:0}
.cta-card p{color:var(--ink-soft);margin:0;flex:1}

.site-footer{background:var(--surface-muted);padding:64px 24px 40px}
.footer-links{display:flex;gap:28px;margin:28px 0;flex-wrap:wrap}
.footer-links a{font-size:.9rem;color:var(--ink-soft);text-decoration:none;font-weight:600}
.footer-meta{color:var(--ink-soft);font-size:.8rem;margin-top:24px}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:translateY(0)}

@media (max-width:820px){.cta-grid{grid-template-columns:1fr}.site-nav{gap:18px}.site-nav a{font-size:.82rem}}