/* ==========================================================================
   vfx.vedri.studio — brand tokens
   Derived from the vedrí brand guidelines. The VFX arm shares the palette
   and type; its distinction lives in motion (see motion.css / js).
   ========================================================================== */

:root {
  /* Neutrals */
  --ink: #111118;          /* primary background — deep near-black, cool blue undertone */
  --charcoal: #2A2B2A;     /* cards, surfaces */
  --grey-light: #C2C1C0;   /* dividers, subtle UI */
  --grey-dim: #8A8A8E;     /* muted text */
  --white: #FFFFFF;

  /* Brand greens */
  --green: #9FCC3B;        /* core accent */
  --lime: #B8E040;         /* gradients, highlights */
  --yellow-green: #D2EF4A; /* sparing glow */

  /* Signature gradient glows (7–20% opacity per brand spec) */
  --glow-a: rgba(159, 204, 59, 0.14);
  --glow-b: rgba(184, 224, 64, 0.09);

  /* Type */
  --font-display: 'Space Grotesk', Arial, sans-serif;
  --font-body: 'Space Grotesk', Arial, sans-serif;

  /* Scale */
  --step--1: clamp(0.83rem, 0.8rem + 0.15vw, 0.94rem);
  --step-0: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --step-1: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
  --step-2: clamp(1.6rem, 1.4rem + 1vw, 2.2rem);
  --step-3: clamp(2.2rem, 1.8rem + 2vw, 3.4rem);
  --step-4: clamp(3rem, 2.2rem + 4vw, 5.6rem);

  /* Layout */
  --container: 1200px;
  --gutter: clamp(1.25rem, 4vw, 3rem);

  /* Motion — the VFX arm's distinction */
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 220ms;
  --dur-med: 480ms;
  --dur-slow: 900ms;
}