/* ============================================================
   Montari — Effects: glow, shadow, blur, grain, motion
   Shadows on void black are mostly absence-of-light + blue bloom.
   ============================================================ */

:root {
  /* ---- Electric glow (the energy) ---- */
  --glow-xs: 0 0 8px rgba(59, 158, 255, 0.30);
  --glow-sm: 0 0 14px rgba(59, 158, 255, 0.38);
  --glow-md: 0 0 26px rgba(59, 158, 255, 0.45);
  --glow-lg: 0 0 48px rgba(59, 158, 255, 0.50);
  --glow-xl: 0 0 90px rgba(59, 158, 255, 0.45);   /* core bloom */
  /* Layered glow for hero objects / primary CTA */
  --glow-bloom: 0 0 24px rgba(59,158,255,0.45), 0 0 80px rgba(20,102,216,0.35);
  /* Text glow on the one key word */
  --glow-text: 0 0 20px rgba(124, 196, 255, 0.55);

  /* ---- Depth shadows (black on black) ---- */
  --shadow-sm: 0 4px 16px -6px rgba(0, 0, 0, 0.7);
  --shadow-md: 0 16px 40px -16px rgba(0, 0, 0, 0.8);
  --shadow-lg: 0 30px 80px -24px rgba(0, 0, 0, 0.9);
  --shadow-xl: 0 50px 120px -30px rgba(0, 0, 0, 0.95);
  /* Chrome plate: top highlight + bottom shade, gives the metal lip */
  --shadow-chrome: inset 0 1px 0 rgba(255,255,255,0.55), inset 0 -1px 0 rgba(0,0,0,0.35), 0 8px 24px -10px rgba(0,0,0,0.8);
  /* Inset hairline lip for glass cards */
  --shadow-inset-line: inset 0 0 0 1px rgba(255,255,255,0.06);

  /* ---- Borders ---- */
  --border-hairline: 1px solid var(--line);
  --border-glow: 1px solid rgba(59, 158, 255, 0.40); /* @kind other */

  /* ---- Blur / glass ---- */
  --blur-glass: 16px; /* @kind other */
  --blur-strong: 28px; /* @kind other */
  --backdrop-glass: blur(16px) saturate(1.15); /* @kind other */

  /* ---- Grain / noise overlay (path-independent SVG turbulence) ---- */
  --grain: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); /* @kind other */
  --grain-opacity: 0.05; /* @kind other */

  /* ---- Motion: easing (never linear) ---- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --ease-out-soft: cubic-bezier(0.22, 1, 0.36, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --ease-magnetic: cubic-bezier(0.34, 1.56, 0.64, 1); /* @kind other */

  /* ---- Motion: duration (0.4s–0.8s window) ---- */
  --dur-fast: 0.3s; /* @kind other */
  --dur-base: 0.5s; /* @kind other */
  --dur-slow: 0.8s; /* @kind other */
  --transition: all var(--dur-base) var(--ease-out); /* @kind other */
  --transition-fast: all var(--dur-fast) var(--ease-out); /* @kind other */
}