:root {
    --color-bg: oklch(15% 0.02 260);
    --color-bg-soft: oklch(18% 0.026 265);
    --color-card: oklch(22% 0.05 290);
    --color-card-soft: oklch(25% 0.055 292);
    --color-border: oklch(48% 0.09 300 / 0.4);
    --color-text: oklch(96% 0.01 260);
    --color-muted: oklch(72% 0.02 260 / 0.86);
    --color-subtle: oklch(61% 0.02 260 / 0.78);
    --color-violet: oklch(62% 0.21 300);
    --color-pink: oklch(70% 0.18 345);
    --color-blue: oklch(65% 0.17 250);
    --gradient-brand: linear-gradient(120deg, var(--color-blue), var(--color-violet) 55%, var(--color-pink));
    --font-display: "Space Grotesk", sans-serif;
    --font-body: "Manrope", sans-serif;
    --font-mono: "JetBrains Mono", monospace;
    --container: 1440px;
    --header-height: 82px;
    --radius-sm: 12px;
    --radius-md: 18px;
    --radius-lg: 26px;
    --shadow-card: 0 30px 80px -32px oklch(5% 0.03 280 / 0.9);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-height) + 24px); }
html.has-smooth-scroll { scroll-behavior: auto; }
body { margin: 0; overflow-x: hidden; background: var(--color-bg); color: var(--color-text); font-family: var(--font-body); font-size: 16px; line-height: 1.65; }
body.menu-open { overflow: hidden; }
img, svg, canvas { display: block; max-width: 100%; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
p { margin: 0; color: var(--color-muted); }
h1, h2, h3, h4 { margin: 0; color: var(--color-text); font-family: var(--font-display); line-height: 1.1; letter-spacing: -0.025em; }
h1 { font-size: clamp(2.6rem, 5vw, 4.25rem); }
h2 { max-width: 760px; font-size: clamp(2rem, 3.4vw, 2.8rem); }
h3 { font-size: 1.16rem; }
ul { margin: 0; padding: 0; list-style: none; }
::selection { background: oklch(62% 0.21 300 / 0.5); color: white; }
:focus-visible { outline: 2px solid var(--color-pink); outline-offset: 4px; }

.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; margin: -1px; padding: 0; white-space: nowrap; clip-path: inset(50%); border: 0; }
.skip-link { position: fixed; top: 12px; left: 12px; z-index: 200; padding: 10px 16px; transform: translateY(-160%); border-radius: 10px; background: white; color: #111; font-weight: 700; }
.skip-link:focus { transform: translateY(0); }
.container { width: min(calc(100% - 80px), var(--container)); margin-inline: auto; }
.narrow-container { max-width: 980px; }
.section { position: relative; padding-block: 112px; }
.section-compact { position: relative; padding-block: 42px; }
.section-heading { margin-bottom: 52px; }
.section-heading h2 { margin-top: 14px; }
.section-heading-center { text-align: center; }
.section-heading-center h2 { margin-inline: auto; }
.section-heading-center .eyebrow { justify-content: center; }
.eyebrow { display: flex; align-items: center; gap: 11px; margin-bottom: 16px; color: oklch(78% 0.15 320); font-size: 0.73rem; font-weight: 700; letter-spacing: 0.17em; text-transform: uppercase; }
.eyebrow::before { width: 25px; height: 1px; background: var(--gradient-brand); content: ""; }
.gradient-text { background: var(--gradient-brand); background-clip: text; color: transparent; -webkit-background-clip: text; }
.mono { font-family: var(--font-mono); }
.lead { max-width: 590px; font-size: clamp(1.02rem, 1.7vw, 1.16rem); }
.button-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: 0 23px; border: 1px solid transparent; border-radius: 12px; cursor: pointer; font-size: 0.91rem; font-weight: 700; line-height: 1; transition: transform 180ms ease, color 180ms ease, background 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--gradient-brand); box-shadow: 0 12px 32px -12px oklch(62% 0.21 300 / 0.72); color: oklch(14% 0.03 275); }
.button-primary:hover { box-shadow: 0 15px 38px -10px oklch(62% 0.21 300 / 0.9); }
.button-secondary { border-color: var(--color-border); background: oklch(22% 0.04 285 / 0.45); color: var(--color-text); backdrop-filter: blur(10px); }
.button-secondary:hover { border-color: var(--color-pink); color: var(--color-pink); }

.site-effects { position: fixed; inset: 0; z-index: -5; pointer-events: none; }
.background-grid { position: absolute; inset: 0; opacity: 0.22; background-image: linear-gradient(oklch(60% 0.1 300 / 0.055) 1px, transparent 1px), linear-gradient(90deg, oklch(60% 0.1 300 / 0.055) 1px, transparent 1px); background-size: 58px 58px; mask-image: linear-gradient(to bottom, black, transparent 80%); }
.grain { position: absolute; inset: 0; opacity: 0.06; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E"); }
.cursor-glow { position: fixed; top: 0; left: 0; width: 560px; height: 560px; opacity: 0; border-radius: 50%; background: radial-gradient(circle, oklch(64% 0.22 310 / 0.14), transparent 67%); filter: blur(8px); transition: opacity 300ms ease; will-change: transform; }
.scroll-progress { position: fixed; top: 0; left: 0; z-index: 110; width: 0; height: 2px; background: var(--gradient-brand); box-shadow: 0 0 16px var(--color-violet); }

.site-header { position: fixed; top: 0; right: 0; left: 0; z-index: 100; padding: 14px 0; pointer-events: none; transition: padding 220ms ease; }
.site-header.is-scrolled { padding-top: 8px; }
.nav-shell { position: relative; display: flex; width: min(calc(100% - 80px), var(--container)); min-height: var(--header-height); align-items: center; justify-content: space-between; margin-inline: auto; padding: 0 20px 0 26px; border: 1px solid oklch(48% 0.09 300 / 0.34); border-radius: 18px; background: oklch(13.5% 0.027 272 / 0.82); box-shadow: 0 24px 65px -38px black, inset 0 1px 0 oklch(100% 0 0 / 0.025); pointer-events: auto; backdrop-filter: blur(22px) saturate(1.15); transition: min-height 220ms ease, background 220ms ease, border-color 220ms ease, box-shadow 220ms ease; }
.site-header.is-scrolled .nav-shell { min-height: 68px; border-color: oklch(56% 0.11 305 / 0.42); background: oklch(12.5% 0.03 275 / 0.93); box-shadow: 0 22px 58px -30px black, 0 0 40px -32px var(--color-violet); }
.brand { color: var(--color-text); font-family: var(--font-display); font-size: 1.3rem; font-weight: 700; letter-spacing: -0.04em; }
.brand span { color: var(--color-pink); }
.primary-nav { display: flex; align-items: center; gap: 4px; margin-left: auto; color: var(--color-muted); font-size: 0.84rem; font-weight: 600; }
.primary-nav > a, .nav-trigger { min-height: 42px; padding: 0 14px; border: 0; border-radius: 10px; background: transparent; color: inherit; cursor: pointer; }
.primary-nav > a { display: inline-flex; align-items: center; }
.primary-nav > a:hover, .nav-trigger:hover, .nav-trigger[aria-expanded="true"] { background: oklch(30% 0.04 290 / 0.3); color: var(--color-text); }
.nav-group { position: relative; }
.nav-menu-item { position: relative; }
.nav-menu-item::after { position: absolute; right: 14px; bottom: -20px; left: 14px; height: 2px; border-radius: 99px; opacity: 0; background: linear-gradient(90deg, transparent, var(--color-pink), var(--color-violet), transparent); box-shadow: 0 -8px 25px 7px oklch(65% 0.2 330 / 0.35); transform: scaleX(0.45); transition: opacity 180ms ease, transform 220ms ease; content: ""; pointer-events: none; }
.nav-menu-item:hover::after, .nav-menu-item.is-current::after, .nav-menu-item:has(.nav-trigger[aria-expanded="true"])::after { opacity: 1; transform: scaleX(1); }
.nav-trigger { display: flex; align-items: center; gap: 8px; }
.caret { width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform 180ms ease; }
.nav-trigger[aria-expanded="true"] .caret { transform: rotate(-135deg); }
.language-trigger[aria-expanded="true"] .caret { transform: rotate(-135deg); }
.dropdown { position: absolute; top: calc(100% + 20px); left: 0; display: grid; min-width: 240px; padding: 14px; visibility: hidden; border: 1px solid oklch(48% 0.09 300 / 0.42); border-radius: 16px; opacity: 0; background: linear-gradient(160deg, oklch(18% 0.04 286 / 0.98), oklch(14% 0.03 276 / 0.99)); box-shadow: 0 28px 70px -24px black, 0 0 42px -32px var(--color-pink); transform: translateY(10px); transition: opacity 180ms ease, transform 180ms ease, visibility 180ms; }
.nav-group:hover .dropdown, .nav-group:focus-within .dropdown, .nav-trigger[aria-expanded="true"] + .dropdown { visibility: visible; opacity: 1; transform: translateY(0); }
.language-trigger[aria-expanded="true"] + .dropdown { visibility: visible; opacity: 1; transform: translateY(0); }
.dropdown a { padding: 10px 13px; border-radius: 9px; color: var(--color-muted); }
.dropdown a:hover { background: oklch(34% 0.06 300 / 0.58); color: var(--color-text); }
.nav-actions { display: flex; align-items: center; gap: 10px; margin-left: 22px; }
.language-trigger { display: inline-flex; min-height: 44px; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid oklch(48% 0.09 300 / 0.3); border-radius: 10px; background: oklch(20% 0.035 280 / 0.5); color: var(--color-text); cursor: pointer; font-size: 0.78rem; font-weight: 650; transition: color 180ms ease, border-color 180ms ease, background 180ms ease; }
.language-trigger:hover, .language-trigger[aria-expanded="true"] { border-color: oklch(68% 0.18 330 / 0.62); background: oklch(28% 0.055 295 / 0.62); color: white; }
.language-trigger svg { width: 17px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.language-trigger .caret { margin-left: 2px; }
.language-dropdown { right: 0; left: auto; min-width: 180px; }
.language-dropdown a { display: flex; align-items: center; gap: 12px; }
.language-dropdown a > span { display: grid; width: 30px; height: 25px; place-items: center; border: 1px solid var(--color-border); border-radius: 7px; color: var(--color-subtle); font-family: var(--font-mono); font-size: 0.61rem; }
.language-dropdown a.is-selected { background: oklch(34% 0.06 300 / 0.48); color: var(--color-text); }
.language-dropdown a.is-selected > span { border-color: var(--color-pink); color: var(--color-pink); }
.menu-toggle { display: none; width: 44px; height: 44px; place-content: center; gap: 6px; border: 1px solid var(--color-border); border-radius: 11px; background: oklch(24% 0.04 280 / 0.6); cursor: pointer; }
.menu-toggle > span:not(.sr-only) { display: block; width: 20px; height: 2px; background: var(--color-text); transition: transform 180ms ease; }
.menu-toggle[aria-expanded="true"] > span:nth-child(2) { transform: translateY(4px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] > span:nth-child(3) { transform: translateY(-4px) rotate(-45deg); }

.glow-card { position: relative; border: 1px solid var(--color-border); box-shadow: var(--shadow-card); }
.glow-card::before { position: absolute; inset: 0; z-index: 0; border-radius: inherit; opacity: 0; background: radial-gradient(440px circle at var(--mouse-x, 50%) var(--mouse-y, 50%), oklch(66% 0.2 310 / 0.12), transparent 42%); pointer-events: none; transition: opacity 250ms ease; content: ""; }
.glow-card:hover::before { opacity: 1; }
.glow-card > * { position: relative; z-index: 1; }
.reveal { opacity: 0; transform: translateY(28px); transition: opacity 700ms cubic-bezier(.2,.7,.2,1), transform 700ms cubic-bezier(.2,.7,.2,1); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.animate-in { animation: rise-in 800ms cubic-bezier(.2,.7,.2,1) both; }
.animate-in.delay-1 { animation-delay: 100ms; }
.animate-in.delay-2 { animation-delay: 200ms; }
.animate-in.delay-3 { animation-delay: 300ms; }
@keyframes rise-in { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: none; } }
.aurora { background: radial-gradient(38% 50% at 20% 25%, oklch(42% 0.23 305 / 0.55), transparent 62%), radial-gradient(30% 42% at 80% 18%, oklch(48% 0.21 350 / 0.42), transparent 62%), radial-gradient(46% 55% at 62% 78%, oklch(42% 0.19 255 / 0.5), transparent 65%), conic-gradient(from 220deg at 55% 40%, transparent, oklch(38% 0.2 325 / 0.3), transparent 58%); animation: aurora-drift 20s ease-in-out infinite alternate; filter: blur(60px) saturate(1.25); }
@keyframes aurora-drift { to { transform: rotate(6deg) scale(1.12) translateY(-4%); } }

.cta-panel { position: relative; overflow: hidden; padding: 78px 40px; border-radius: var(--radius-lg); background: linear-gradient(145deg, oklch(24% 0.07 295 / 0.78), oklch(18% 0.035 265 / 0.92)); text-align: center; }
.cta-panel .aurora { position: absolute; inset: -80%; opacity: 0.65; }
.cta-content { position: relative; z-index: 2; }
.cta-content .eyebrow { justify-content: center; }
.cta-content h2 { margin-inline: auto; }
.cta-content > p:not(.eyebrow) { max-width: 580px; margin: 18px auto 0; }
.cta-content .button-row { justify-content: center; }

.site-footer { padding: 72px 0 28px; border-top: 1px solid oklch(48% 0.09 300 / 0.25); background: oklch(12% 0.02 265); }
.footer-grid { display: grid; grid-template-columns: 2fr repeat(3, 1fr); gap: 46px; }
.footer-brand p { max-width: 330px; margin: 17px 0 12px; font-size: 0.92rem; }
.footer-email { color: var(--color-pink); font-size: 0.88rem; }
.footer-column { display: flex; flex-direction: column; gap: 10px; }
.footer-column h2 { margin-bottom: 5px; font-size: 0.79rem; letter-spacing: 0.1em; text-transform: uppercase; }
.footer-column a { color: var(--color-subtle); font-size: 0.86rem; }
.footer-column a:hover { color: var(--color-text); }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; margin-top: 64px; padding-top: 24px; border-top: 1px solid oklch(48% 0.09 300 / 0.2); color: var(--color-subtle); font-size: 0.78rem; }
.footer-legal-links { display: flex; flex-wrap: wrap; gap: 20px; }
.footer-legal-links a:hover { color: var(--color-pink); }
.social-links { display: flex; gap: 10px; }
.social-links a { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid var(--color-border); border-radius: 9px; font-family: var(--font-mono); font-size: 0.7rem; }
.social-links a:hover { border-color: var(--color-pink); color: var(--color-pink); }

@media (max-width: 980px) {
    .container, .nav-shell { width: min(calc(100% - 44px), var(--container)); }
    .header-cta { display: none; }
    .nav-actions { margin-left: auto; }
    .menu-toggle { display: grid; order: 4; margin-left: 8px; }
    .primary-nav { position: fixed; top: calc(var(--header-height) + 30px); right: 22px; left: 22px; display: none; max-height: calc(100vh - var(--header-height) - 48px); align-items: stretch; margin-left: 0; padding: 18px 18px 24px; overflow-y: auto; border: 1px solid var(--color-border); border-radius: 16px; background: oklch(13% 0.028 270 / 0.98); box-shadow: 0 28px 70px -25px black; }
    .primary-nav.is-open { display: grid; }
    .primary-nav > a, .nav-trigger { width: 100%; justify-content: space-between; padding-inline: 14px; }
    .dropdown { position: static; display: none; min-width: 0; margin: 5px 0 8px 12px; visibility: visible; border: 0; opacity: 1; background: transparent; box-shadow: none; transform: none; }
    .nav-trigger[aria-expanded="true"] + .dropdown { display: grid; }
    .nav-group:hover .dropdown:not(:focus-within) { display: none; }
    .nav-group:hover .nav-trigger[aria-expanded="true"] + .dropdown { display: grid; }
    .primary-nav .nav-menu-item::after { right: 14px; bottom: 1px; left: 14px; }
    .footer-grid { grid-template-columns: 2fr 1fr 1fr; }
    .footer-brand { grid-row: span 2; }
}

@media (max-width: 680px) {
    :root { --header-height: 72px; }
    .container, .nav-shell { width: min(calc(100% - 24px), var(--container)); }
    .site-header { padding-top: 8px; }
    .nav-shell { min-height: 66px; padding: 0 10px 0 16px; border-radius: 14px; }
    .site-header.is-scrolled .nav-shell { min-height: 62px; }
    .language-trigger { min-height: 40px; padding: 0 10px; }
    .language-trigger svg { display: none; }
    .primary-nav { top: 82px; right: 12px; left: 12px; }
    .section { padding-block: 78px; }
    .section-heading { margin-bottom: 36px; }
    .button-row { align-items: stretch; }
    .button-row .button { flex: 1 1 auto; }
    .cta-panel { padding: 58px 20px; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 38px 24px; }
    .footer-brand { grid-column: 1 / -1; grid-row: auto; }
    .footer-bottom { align-items: flex-start; flex-direction: column; gap: 20px; }
}

@media (pointer: coarse) { .cursor-glow { display: none; } }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: 0.01ms !important; }
    .reveal { opacity: 1; transform: none; }
}
