@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/InterVariable.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
:root {
  --midnight: #0F2D6B;
  --brand: #007BFF;
  --light: #1EC6FF;
  --ice: #EAF4FF;
  --white: #FFFFFF;
  --ink: #0A1D3A;
  --muted: #5E6F86;
  --line: #DCE9F7;
  --radius: 20px;
  --shadow: 0 22px 70px rgba(15,45,107,.12);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; color: var(--ink); background: var(--white);
  font-family: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px; line-height: 1.65;
}
a { color: inherit; }
.site-header {
  position: sticky; top: 0; z-index: 50; display:flex; align-items:center; justify-content:space-between;
  max-width: 1440px; margin:auto; padding: 16px 5vw; background:rgba(255,255,255,.9);
  backdrop-filter: blur(16px); border-bottom:1px solid rgba(220,233,247,.65);
}
.brand img { width: 168px; max-height: 58px; object-fit:contain; object-position:left center; display:block; }
nav { display:flex; align-items:center; gap:28px; }
nav a { text-decoration:none; color:#31445f; font-weight:600; font-size:.94rem; }
nav a:hover { color:var(--brand); }
.hero {
  min-height: 78vh; display:grid; grid-template-columns: 1.05fr .95fr; gap:6vw; align-items:center;
  max-width:1440px; margin:auto; padding: 100px 6vw 90px; overflow:hidden;
}
.eyebrow { color:var(--brand); font-size:.78rem; font-weight:800; letter-spacing:.18em; margin-bottom:18px; }
.eyebrow-light { color:#8FDFFF; }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:clamp(3.5rem,7vw,7.2rem); line-height:.92; letter-spacing:-.055em; color:var(--midnight); margin-bottom:30px; }
h1 span { color:var(--light); }
h2 { font-size:clamp(2.3rem,4vw,4.7rem); line-height:1.03; letter-spacing:-.04em; color:var(--midnight); margin-bottom:22px; }
h3 { color:var(--midnight); font-size:1.45rem; line-height:1.15; }
.hero-lead { max-width:760px; color:#42556f; font-size:clamp(1.08rem,1.55vw,1.35rem); }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; margin:34px 0 20px; }
.button {
  display:inline-flex; justify-content:center; align-items:center; gap:10px; min-height:52px; padding:13px 24px;
  border-radius:12px; border:1px solid var(--brand); background:var(--brand); color:#fff; text-decoration:none;
  font-weight:800; font:inherit; cursor:pointer; transition:.2s ease;
}
.button:hover { transform:translateY(-1px); box-shadow:0 12px 32px rgba(0,123,255,.2); }
.button-secondary,.button-ghost { background:#fff; color:var(--midnight); border-color:var(--line); }
.button-small { min-height:42px; padding:8px 17px; font-size:.9rem; }
.button-light { background:#fff; color:var(--midnight); border-color:#fff; }
.microcopy { color:#7788a0; font-size:.85rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.hero-visual { min-height:570px; position:relative; display:grid; place-items:center; }
.hero-visual:before {
  content:""; position:absolute; width:460px; height:460px; border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#fff 0,#EAF4FF 32%,rgba(30,198,255,.18) 60%,transparent 72%);
}
.orbit { position:absolute; border:1px solid rgba(0,123,255,.18); border-radius:50%; transform:rotate(-25deg); }
.orbit-one { width:560px; height:280px; }
.orbit-two { width:420px; height:640px; }
.spark { position:absolute; color:var(--light); font-size:4rem; filter:drop-shadow(0 8px 20px rgba(0,123,255,.18)); }
.spark-a { top:15%; right:12%; }.spark-b { bottom:18%; left:9%; font-size:2.4rem; }.spark-c { top:24%; left:21%; font-size:1.5rem; }
.glass-card {
  position:relative; width:min(420px,88%); padding:38px; border:1px solid rgba(255,255,255,.8); border-radius:26px;
  background:rgba(255,255,255,.78); backdrop-filter:blur(24px); box-shadow:var(--shadow);
}
.glass-card strong { display:block; font-size:2rem; line-height:1.12; color:var(--midnight); margin:12px 0 18px; }
.card-label { color:var(--brand); font-size:.72rem; font-weight:800; letter-spacing:.15em; }
.section { max-width:1440px; margin:auto; padding:100px 6vw; }
.section-intro { display:grid; grid-template-columns:.75fr 1.25fr; gap:8vw; border-top:1px solid var(--line); }
.intro-copy { font-size:1.25rem; color:#42556f; max-width:800px; }
.section-heading { max-width:760px; margin-bottom:54px; }
.section-heading>p { color:var(--muted); font-size:1.15rem; }
.feature-grid,.audience-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.feature-card,.audience-grid article {
  padding:34px; border:1px solid var(--line); border-radius:var(--radius); background:#fff;
}
.feature-card { min-height:300px; display:flex; flex-direction:column; }
.feature-card p,.audience-grid p { color:var(--muted); }
.feature-number { margin-bottom:auto; color:var(--light); font-weight:800; font-size:1rem; }
.statement {
  max-width:none; background:var(--midnight); color:#fff; text-align:center; position:relative; overflow:hidden;
}
.statement blockquote {
  max-width:1100px; margin:auto; font-size:clamp(2.2rem,4vw,4.6rem); line-height:1.1; font-weight:750; letter-spacing:-.04em;
}
.statement blockquote span { color:var(--light); }
.statement-stars { color:var(--light); font-size:2rem; letter-spacing:.5em; margin-bottom:32px; }
.audience-icon { display:inline-grid; place-items:center; width:48px; height:48px; border-radius:14px; background:var(--ice); color:var(--brand); font-weight:800; margin-bottom:30px; }
.teaser { display:grid; grid-template-columns:1fr 1fr; gap:7vw; align-items:center; }
.teaser>div>p { color:var(--muted); font-size:1.12rem; }
.teaser-panel { display:flex; flex-wrap:wrap; gap:12px; align-content:center; padding:32px; background:var(--ice); border-radius:28px; min-height:330px; }
.teaser-panel span { background:#fff; border:1px solid #d5e7fa; padding:12px 16px; border-radius:999px; color:var(--midnight); font-weight:700; }
.login-section {
  max-width:none; background:linear-gradient(120deg,var(--midnight),#0B438C); color:white;
  display:flex; justify-content:space-between; align-items:center; gap:40px; padding-left:max(6vw,calc((100vw - 1440px)/2 + 6vw)); padding-right:max(6vw,calc((100vw - 1440px)/2 + 6vw));
}
.login-section h2 { color:#fff; margin-bottom:12px; }
.login-section p { color:#c9ddf6; margin:0; }
.contact-section { display:grid; grid-template-columns:.8fr 1.2fr; gap:8vw; }
.contact-copy p { color:var(--muted); font-size:1.15rem; }
.email-link { font-weight:800; color:var(--brand); text-decoration:none; font-size:1.2rem; }
.contact-form { display:grid; gap:16px; padding:34px; background:#f8fbff; border:1px solid var(--line); border-radius:24px; }
label { display:grid; gap:7px; color:var(--midnight); font-weight:700; font-size:.92rem; }
input,textarea,select {
  width:100%; border:1px solid #cfdff1; background:#fff; border-radius:10px; padding:13px 14px; color:var(--ink);
  font:inherit; outline:none;
}
input:focus,textarea:focus,select:focus { border-color:var(--brand); box-shadow:0 0 0 3px rgba(0,123,255,.1); }
.consent { grid-template-columns:auto 1fr; align-items:start; font-weight:500; color:var(--muted); }
.consent input { width:auto; margin-top:5px; }
.consent a { color:var(--brand); }
.honeypot { position:absolute; left:-9999px; }
.form-status { min-height:24px; margin:0; font-weight:700; color:var(--midnight); }
.site-footer {
  max-width:1440px; margin:auto; border-top:1px solid var(--line); padding:48px 6vw;
  display:grid; grid-template-columns:1fr auto auto; gap:50px; align-items:end;
}
.footer-brand { text-decoration:none; display:grid; width:max-content; }
.footer-brand strong { color:var(--midnight); font-size:1.7rem; line-height:1; }
.footer-brand strong span { color:var(--light); }
.footer-brand small { margin-top:8px; color:var(--muted); }
.footer-links { display:flex; flex-wrap:wrap; gap:20px; }
.footer-links a { text-decoration:none; color:var(--muted); font-weight:650; }
.footer-meta { color:#94a0b1; font-size:.88rem; }
.legal-header { position:relative; }
.legal-content { max-width:900px; margin:auto; padding:80px 6vw 120px; }
.legal-content h1 { font-size:clamp(3rem,7vw,5.5rem); }
.legal-content h2 { font-size:1.45rem; margin-top:48px; }
.legal-content p { color:#455970; }
.legal-warning { color:#9f4a16; font-weight:700; }
.legal-note { margin-top:50px; padding:24px; border-radius:16px; background:#fff6ed; border:1px solid #f3d4bc; color:#74411f; }
code { background:var(--ice); padding:2px 7px; border-radius:6px; }

/* ---------- Responsive navigation ---------- */
.menu-toggle {
  display:none;
  width:44px;
  height:44px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#fff;
  cursor:pointer;
}
.menu-toggle span {
  display:block;
  height:2px;
  margin:5px 0;
  border-radius:99px;
  background:var(--midnight);
  transition:transform .2s ease, opacity .2s ease;
}

@media (max-width: 1180px) {
  .site-header { padding-left:4vw; padding-right:4vw; }
  nav { gap:18px; }
  .hero { gap:3vw; padding-left:5vw; padding-right:5vw; }
  .section { padding-left:5vw; padding-right:5vw; }
  .hero-visual { min-height:500px; }
  .orbit-one { width:500px; }
  .orbit-two { height:570px; }
  .feature-card,.audience-grid article { padding:28px; }
}

@media (max-width: 900px) {
  body.menu-open { overflow:hidden; }
  .site-header { padding:12px 24px; min-height:72px; }
  .brand img { width:150px; }
  .menu-toggle { display:block; position:relative; z-index:70; }
  body.menu-open .menu-toggle span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
  body.menu-open .menu-toggle span:nth-child(2) { opacity:0; }
  body.menu-open .menu-toggle span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
  #main-nav {
    position:fixed; inset:72px 0 auto 0; z-index:60; display:flex; flex-direction:column; align-items:stretch; gap:0;
    padding:18px 24px 26px; background:rgba(255,255,255,.98); border-bottom:1px solid var(--line);
    box-shadow:0 24px 50px rgba(15,45,107,.12); transform:translateY(-130%); opacity:0; pointer-events:none;
    transition:transform .22s ease, opacity .22s ease;
  }
  body.menu-open #main-nav { transform:translateY(0); opacity:1; pointer-events:auto; }
  #main-nav > a { display:block; padding:14px 4px; border-bottom:1px solid #edf4fb; font-size:1rem; }
  #main-nav .button { margin-top:14px; border-bottom:none; }
  .hero,.section-intro,.teaser,.contact-section { grid-template-columns:1fr; }
  .hero { min-height:auto; padding-top:68px; padding-bottom:64px; }
  .hero-copy { max-width:760px; }
  .hero-visual { min-height:400px; margin-top:10px; }
  .section { padding-top:78px; padding-bottom:78px; }
  .section-intro { gap:30px; }
  .intro-copy { font-size:1.1rem; }
  .feature-grid,.audience-grid { grid-template-columns:1fr; }
  .feature-card { min-height:0; }
  .feature-number { margin-bottom:30px; }
  .teaser { gap:38px; }
  .teaser-panel { min-height:0; }
  .login-section { flex-direction:column; align-items:flex-start; }
  .contact-section { gap:38px; }
  .contact-form { max-width:none; }
  .site-footer { grid-template-columns:1fr; gap:26px; align-items:start; }
}

@media (max-width: 640px) {
  .site-header { padding-left:18px; padding-right:18px; }
  .brand img { width:128px; }
  .hero,.section { padding-left:20px; padding-right:20px; }
  .hero { padding-top:52px; padding-bottom:52px; }
  h1 { font-size:clamp(3rem,16vw,4.5rem); line-height:.94; }
  h2 { font-size:clamp(2.15rem,11vw,3.4rem); }
  .hero-lead,.section-heading>p,.contact-copy p { font-size:1rem; }
  .hero-actions { display:grid; grid-template-columns:1fr; width:100%; }
  .hero-actions .button { width:100%; }
  .hero-visual { min-height:330px; }
  .hero-visual:before { width:310px; height:310px; }
  .orbit-one { width:340px; height:170px; }
  .orbit-two { width:250px; height:360px; }
  .glass-card { width:92%; padding:26px; border-radius:20px; }
  .glass-card strong { font-size:1.55rem; }
  .spark-a { right:2%; }
  .spark-b { left:1%; }
  .section { padding-top:64px; padding-bottom:64px; }
  .feature-card,.audience-grid article,.contact-form { padding:22px; }
  .statement { padding-left:20px; padding-right:20px; }
  .statement blockquote { font-size:clamp(2rem,10vw,3.2rem); }
  .teaser-panel { padding:22px; border-radius:20px; }
  .teaser-panel span { padding:10px 12px; font-size:.9rem; }
  .login-section { padding-left:20px; padding-right:20px; }
  .login-section .button,.contact-form .button { width:100%; }
  .footer-links { flex-direction:column; gap:12px; }
  .legal-content { padding:60px 20px 90px; }
  input, textarea, select { font-size:16px; }
}

@media (max-width: 390px) {
  .brand img { width:116px; }
  .menu-toggle { width:42px; height:42px; }
  h1 { font-size:2.9rem; }
  h2 { font-size:2.15rem; }
  .hero,.section { padding-left:16px; padding-right:16px; }
  .hero-visual { min-height:300px; }
  .glass-card { padding:22px; }
  .feature-card,.audience-grid article,.contact-form { padding:19px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after {
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}