:root{
  --brand:#0ea5e9;        /* sky-500  */
  --brand-dark:#0284c7;   /* sky-600  */
  --accent:#22c55e;       /* green-500*/
  --ink:#0b1220;
  --ink-weak:#334155;     /* slate-600 */
  --ring:#e2e8f0;         /* slate-200 */
  --radius:1.25rem;
}
html,body{ font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji"; }
.container{ max-width:1152px }
.heading-grad{ background-image:linear-gradient(90deg,var(--brand),var(--accent)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.section-title{ font-weight:800; letter-spacing:-.01em; }
.btn-grad{ background-image:linear-gradient(90deg,var(--brand),var(--accent)); color:#fff; }
.btn-grad:hover{ filter:brightness(.95)}
.btn-outline{ border:1px solid #cbd5e1 }
.btn-outline:hover{ background:#f8fafc }
.card{ border-radius:var(--radius); background:rgba(255,255,255,.8); border:1px solid var(--ring); box-shadow:0 8px 30px -12px rgba(2,132,199,.25) }
.chip{ padding:.25rem .75rem; border-radius:999px; font-size:.75rem; font-weight:600 }
.chip-sky{ background:#e0f2fe; color:#0369a1 }
.chip-emerald{ background:#d1fae5; color:#047857 }
.chip-indigo{ background:#e0e7ff; color:#4338ca }
.chip-amber{ background:#fef3c7; color:#b45309 }
/* Glassmorphism helpers */
.glass{ background:linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.35)); backdrop-filter:blur(12px) saturate(140%); }
.glass-strong{ background:rgba(255,255,255,.72); backdrop-filter:blur(14px) saturate(160%); }
/* Aurora background */
.bg-aurora{
  background:
   radial-gradient(1200px 600px at 10% -10%, rgba(14,165,233,.16), transparent 60%),
   radial-gradient(1200px 600px at 90% -10%, rgba(34,197,94,.16), transparent 60%);
}
/* Reveal on view */
@keyframes fadeUp { from { opacity:0; transform:translateY(16px)} to { opacity:1; transform:translateY(0)} }
.reveal{ opacity:0; animation:fadeUp .7s ease forwards; will-change:transform,opacity }
.reveal.d1{ animation-delay:.06s } .reveal.d2{ animation-delay:.12s } .reveal.d3{ animation-delay:.18s } .reveal.d4{ animation-delay:.24s }
@media (prefers-reduced-motion:reduce){ .reveal{ animation:none; opacity:1 } }
/* Toggle */
.toggle input:checked + div .dot{ transform:translateX(1.5rem) }
.toggle input:checked + div{ background-color:#0ea5e9 }
/* Lottie demo sizes */
.lottie-base{ width:360px; height:360px }
@media (min-width:1024px){ .lottie-base{ width:420px; height:420px } }
.lottie-boost{ --zoom:1.8; transform:scale(var(--zoom)); transform-origin:center }
@media (max-width:768px){ .lottie-boost{ --zoom:1.3 } }
/* Dark mode overrides */
.dark .card{ background:rgba(15,23,42,.6); border-color:rgba(255,255,255,.08) }
.dark .glass{ background:linear-gradient(180deg, rgba(15,23,42,.7), rgba(15,23,42,.55)); }
.dark .glass-strong{ background:rgba(15,23,42,.7) }
.dark .btn-outline{ border-color:rgba(255,255,255,.15) }
.dark .btn-outline:hover{ background:rgba(255,255,255,.05) }
/* Focus styles (accessible) */
:focus-visible{ outline:2px solid var(--brand); outline-offset:2px; border-radius:.5rem }

/* fun animations */
@keyframes floaty { 0%{transform:translateY(0)} 50%{transform:translateY(-6px)} 100%{transform:translateY(0)} }
@keyframes shimmer { 0%{background-position:0% 50%} 100%{background-position:200% 50%} }
@keyframes pop { 0%{transform:scale(.98);opacity:0} 100%{transform:scale(1);opacity:1} }
.fast-card:hover .ring-anim { opacity: 1; transform: scale(1.1); }
.fast-icon { animation: floaty 4s ease-in-out infinite; }
.gradient-title { background: linear-gradient(90deg,#0ea5e9,#22c55e,#a855f7); -webkit-background-clip:text; background-clip:text; color:transparent; }
.fastfacts-bg { position:relative; overflow:hidden; }
.fastfacts-bg::before {
  content:""; position:absolute; inset:-40%;
  background:linear-gradient(90deg,rgba(14,165,233,.08),rgba(34,197,94,.08),rgba(99,102,241,.08));
  filter:blur(50px); animation:shimmer 10s linear infinite; background-size:200% 200%; z-index:0;
}
.fast-card { animation: pop .45s ease both; }

.blob-sky {
  background: radial-gradient(closest-side, rgba(14,165,233,.35), transparent 70%);
}
.blob-emerald {
  background: radial-gradient(closest-side, rgba(34,197,94,.35), transparent 70%);
}

.w-68p { width: 68%; }

.ring-bg-sky {
  background: radial-gradient(600px 80px at 10% -10%, rgba(14,165,233,0.18), transparent 60%),
              radial-gradient(600px 80px at 110% 110%, rgba(99,102,241,0.18), transparent 60%);
}
.ring-bg-emerald {
  background: radial-gradient(600px 80px at 10% -10%, rgba(34,197,94,0.18), transparent 60%),
              radial-gradient(600px 80px at 110% 110%, rgba(20,184,166,0.18), transparent 60%);
}
.ring-bg-indigo {
  background: radial-gradient(600px 80px at 10% -10%, rgba(99,102,241,0.18), transparent 60%),
              radial-gradient(600px 80px at 110% 110%, rgba(168,85,247,0.18), transparent 60%);
}

.anim-delay-300 { animation-delay: .3s; }
.anim-delay-600 { animation-delay: .6s; }

.finder-border-gradient {
  background: linear-gradient(120deg, rgba(14,165,233,.6), rgba(34,197,94,.6));
}
.finder-hover-glow {
  background: radial-gradient(800px 200px at 20% 10%, rgba(14,165,233,.15), transparent 70%),
              radial-gradient(800px 200px at 80% 90%, rgba(34,197,94,.15), transparent 70%);
}