/* ============================================================
   TAURIST — EFFECTS: gradients, shadows, blur, motion
   The signature element is the four-stop spectrum gradient. It runs
   magenta → red → orange → yellow and appears on primary CTAs, accents,
   and the logo mark. Glass panels use translucent white + backdrop-blur.
   ============================================================ */
:root {
  /* ---- Signature spectrum gradient ---- */
  /* Canonical left-to-right spectrum */
  --gradient-spectrum: linear-gradient(90deg,
      #F222B0 0%, #F22248 38%, #F26422 72%, #EEC936 100%); /* @kind color */
  /* Button angle used across the marketing site (-86deg, warm on the right) */
  --gradient-cta: linear-gradient(-86deg,
      #EEC936 -5%, #F26422 25%, #F22248 53%, #F22248 80%, #F222B0 106%); /* @kind color */
  /* Soft radial wash for hero / section backgrounds on black */
  --gradient-wash: radial-gradient(120% 120% at 80% 0%,
      rgba(242,34,176,0.35) 0%, rgba(242,34,72,0.18) 32%,
      rgba(242,100,34,0.10) 55%, rgba(0,0,0,0) 75%); /* @kind color */
  /* Glass sheen used inside translucent cards */
  --gradient-glass: linear-gradient(157deg,
      rgba(255,255,255,0.20) 18%, rgba(255,255,255,0.01) 84%); /* @kind color */

  /* ---- Blur ---- */
  --blur-glass: 30px;   /* @kind other */
  --blur-panel: 48px;   /* @kind other */

  /* ---- Shadows ---- */
  /* On dark: soft lift used by floating glass cards */
  --shadow-glass: 0 4px 23px -1px rgba(0,0,0,0.20);
  --shadow-card: 0 2px 14px -1px rgba(0,0,0,0.18);
  /* On light: product UI elevation */
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.06);
  --shadow-md: 0 6px 20px -4px rgba(0,0,0,0.10);
  --shadow-lg: 0 18px 48px -12px rgba(0,0,0,0.22);
  /* Brand glow — colored CTA halo */
  --shadow-glow: 0 8px 28px -6px rgba(242,34,72,0.45);
  /* Inset hairline used on dark cards & glass nav */
  --ring-dark: inset 0 0 0 1px var(--neutral-700);
  --ring-light: inset 0 0 0 1px var(--neutral-200);
  --ring-glass: inset 0 0 0 1px rgba(255,255,255,0.18); /* @kind shadow */

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);    /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --dur-fast: 120ms;   /* @kind other */
  --dur-base: 200ms;   /* @kind other */
  --dur-slow: 360ms;   /* @kind other */
}