/* ============================================================
   SYTE.bio — Effects: shadows, blur, gradients, motion
   On dark surfaces, elevation reads through hairline borders +
   soft ambient shadow + faint top highlight, not heavy drop
   shadows. Cobalt glow is reserved for active/focus states.
   ============================================================ */

:root {
  /* Elevation (dark-surface tuned) */
  --shadow-none: none;
  --shadow-xs:  0 1px 2px rgba(0, 0, 0, 0.40);
  --shadow-sm:  0 2px 6px rgba(0, 0, 0, 0.45);
  --shadow-md:  0 8px 24px rgba(0, 0, 0, 0.50);
  --shadow-lg:  0 18px 48px rgba(0, 0, 0, 0.55);
  --shadow-xl:  0 32px 80px rgba(0, 0, 0, 0.60);

  /* Hairline inner highlight for elevated cards on dark */
  --edge-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.06); /* @kind shadow */

  /* Accent glow — active rings, hero focal points */
  --glow-cobalt: 0 0 0 1px rgba(63, 92, 214, 0.40), 0 8px 30px rgba(30, 64, 200, 0.35);
  --glow-soft:   0 0 40px rgba(30, 64, 200, 0.25);

  /* Focus ring */
  --ring: 0 0 0 3px var(--focus-ring);

  /* Blur (glass overlays, sticky nav) */
  --blur-sm: 8px;
  --blur-md: 16px;
  --blur-lg: 28px;

  /* Brand gradients */
  --grad-spectrum: linear-gradient(
    100deg,
    var(--spectrum-violet) 0%,
    var(--spectrum-blue) 22%,
    var(--spectrum-teal) 44%,
    var(--spectrum-green) 64%,
    var(--spectrum-gold) 82%,
    var(--spectrum-red) 100%
  );
  --grad-cobalt: linear-gradient(140deg, var(--cobalt-400) 0%, var(--cobalt-600) 100%);
  --grad-core:   radial-gradient(120% 120% at 50% -10%, var(--ink-800) 0%, var(--ink-950) 55%, var(--black) 100%);
  /* Protection scrim for text over imagery/video */
  --scrim-bottom: linear-gradient(to top, rgba(5, 7, 10, 0.92) 0%, rgba(5, 7, 10, 0.55) 45%, rgba(5, 7, 10, 0) 100%); /* @kind other */
  --scrim-full:   linear-gradient(to top, rgba(5, 7, 10, 0.85), rgba(5, 7, 10, 0.45)); /* @kind other */

  /* Motion — calm, scientific. Ease-out for entrances. */
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --ease-in-out:cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --dur-fast:   140ms; /* @kind other */
  --dur-base:   240ms; /* @kind other */
  --dur-slow:   420ms; /* @kind other */
  --dur-slower: 720ms; /* @kind other */
  --transition-base: all var(--dur-base) var(--ease-standard); /* @kind other */
}