/*
  Design tokens — Jazzy Slime
  Palette keeps the brand's established pink/purple/aqua identity from the
  mockup (it's already correct for this audience) but tuned for a more
  premium finish: deeper ink for text instead of flat black, a softer
  lilac-white surface tone instead of stark white, and a slightly more
  saturated aqua for punch against large white sections.
*/
:root {
  /* Brand core */
  --pink: #ec3f9c;
  --pink-bright: #ff3d9a;
  --purple: #7b3ff2;
  --purple-deep: #5b2fc9;
  --purple-ink: #3a2a5e;
  --lilac: #a259f5;
  --aqua: #2ec5e8;
  --aqua-deep: #1f9dc4;
  --sun: #ffb400;

  /* Neutrals */
  --ink: #2e2350;
  --ink-soft: #5b4b7a;
  --ink-faint: #8c7aa8;
  --surface: #faf7ff;
  --surface-pink: #fff6fb;
  --surface-aqua: #f0faff;
  --white: #ffffff;
  --line: #f0e2ff;
  --line-pink: #ffe0ef;
  --line-aqua: #c9e9f8;

  /* Gradients */
  --grad-hero: linear-gradient(135deg, #f2e4ff 0%, #fde3f3 45%, #e5f3ff 100%);
  --grad-cta-pink: linear-gradient(135deg, #ff3d9a, #ec3f9c);
  --grad-cta-pink-hover: linear-gradient(135deg, #c62ff0, #7b3ff2);
  --grad-cta-purple: linear-gradient(135deg, #8b46f0, #6b2fd6);
  --grad-band: linear-gradient(120deg, #f7d9f0, #e3d4ff 55%, #d9ecff);
  --grad-footer: linear-gradient(120deg, #7b3ff2, #6b2fd6 60%, #8b46f0);
  --grad-rainbow: linear-gradient(90deg, #ff3d9a, #ffd23f, #7fd83c, #35b6e8, #a259f5, #ff7a3c);

  /* Type */
  --font-display: 'Baloo 2', system-ui, sans-serif;
  --font-body: 'Nunito', system-ui, sans-serif;

  /* Radius + shadow — soft, rounded, premium */
  --r-sm: 12px;
  --r-md: 18px;
  --r-lg: 24px;
  --r-xl: 32px;
  --r-pill: 999px;
  --shadow-sm: 0 6px 18px rgba(120, 60, 190, .08);
  --shadow-md: 0 12px 30px rgba(120, 60, 190, .12);
  --shadow-lg: 0 22px 50px rgba(100, 50, 170, .18);
  --shadow-pink: 0 12px 26px rgba(236, 63, 156, .3);
  --shadow-purple: 0 12px 26px rgba(107, 47, 214, .28);

  /* Layout */
  --container: 1320px;
  --gutter: clamp(20px, 4vw, 46px);
  --header-h: 92px;
  --header-h-scrolled: 72px;

  /* Motion */
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --dur-fast: 180ms;
  --dur-mid: 320ms;
  --dur-slow: 560ms;
}
