/* FutureWave Solutions design tokens: "Aurora".

   Midnight navy carries the brand; the vibrant colors only ever glow.
   NIGHT    = brand surfaces: header, hero, page heads, closer, footer.
   SPECTRUM = cyan -> violet -> magenta. The 3D wave, the true number, primary actions.
   AMBER    = a correction: amounts taken off the seller's story.
   ACCENT-INK = the spectrum's readable form on white (fees, links, checks). */
:root {
  --night: #070b1a;
  --night-2: #0d1530;
  --night-3: #18224a;
  --cyan: #22e6ff;
  --violet: #8b6cff;
  --magenta: #ff4fd8;
  --amber: #ffb35c;
  --spectrum: linear-gradient(100deg, #22e6ff 0%, #8b6cff 50%, #ff4fd8 100%);
  --spectrum-soft: linear-gradient(100deg, #b9f6ff 0%, #d6cbff 50%, #ffc9f1 100%);

  --white: #ffffff;
  --mist: #f4f5fb;
  --line: #dfe2f0;
  --ink: #0b1026;
  --ink-2: #3a3f5c;
  --muted: #5c6180;
  --accent-ink: #5b3fd6;
  --on-night: #d5daf0;
  --on-night-muted: #9aa3c7;
  --line-night: rgba(213, 218, 240, 0.16);

  --display: 'Anton', Impact, 'Arial Narrow', sans-serif;
  --sans: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --t-xs: 0.8rem;
  --t-sm: 0.92rem;
  --t-base: 1.0625rem;
  --t-lg: 1.25rem;
  --t-xl: 1.75rem;
  --t-2xl: clamp(2.6rem, 6vw, 5rem);
  --t-hero: clamp(3.6rem, 13vw, 11.5rem);

  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.25rem;
  --s-6: 1.5rem;
  --s-8: 2rem;
  --s-10: 2.5rem;
  --s-12: 3rem;
  --s-16: 4rem;
  --s-24: 6rem;

  --r-md: 18px;
  --r-pill: 999px;

  --maxw: 1280px;
  --measure: 62ch;
  --gutter: 20px;
}

@media (min-width: 768px) {
  :root {
    --gutter: 40px;
  }
}