/* ============================================================
   Carbon Blast Auto — Effects: radii, borders, shadows, motion
   Clean, precise, premium. Soft neutral shadows on light;
   restrained glow only for the blue accent.
   ============================================================ */
:root {
  /* ---- Corner radii ---- */
  --r-xs:    4px;
  --r-sm:    8px;
  --r-md:    12px;   /* default card / input */
  --r-lg:    18px;   /* feature cards */
  --r-xl:    24px;   /* large panels */
  --r-2xl:   32px;
  --r-pill:  999px;  /* buttons, chips, eyebrows */
  --r-round: 50%;

  /* ---- Border widths ---- */
  --bw-hair:  1px;    /* @kind other */
  --bw:       1.5px;  /* @kind other */
  --bw-bold:  2px;    /* @kind other */

  /* ---- Shadows (light context) — soft, cool-neutral ---- */
  --shadow-xs:  0 1px 2px rgba(11,13,15,0.06);
  --shadow-sm:  0 2px 8px rgba(11,13,15,0.07);
  --shadow-md:  0 8px 24px rgba(11,13,15,0.09);
  --shadow-lg:  0 18px 48px rgba(11,13,15,0.12);
  --shadow-xl:  0 28px 70px rgba(11,13,15,0.16);

  /* ---- Shadows (dark context) — depth + faint blue lift ---- */
  --shadow-dark:    0 16px 40px rgba(0,0,0,0.55);
  --shadow-dark-lg: 0 30px 70px rgba(0,0,0,0.65);

  /* ---- Accent glow (use sparingly: primary CTA, active icon) ---- */
  --glow-blue:     0 8px 28px rgba(56,182,255,0.35);
  --glow-blue-sm:  0 4px 14px rgba(56,182,255,0.28);

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

  /* ---- 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:    140ms; /* @kind other */
  --dur:         220ms; /* @kind other */
  --dur-slow:    420ms; /* @kind other */

  /* ---- Gradients ---- */
  --grad-ice:    linear-gradient(135deg, #5EC5FF 0%, #38B6FF 45%, #1E9DE8 100%); /* @kind other */
  --grad-dark:   linear-gradient(180deg, #14171A 0%, #000000 100%); /* @kind other */
  --grad-fade-dark: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.85) 100%); /* @kind other */
  --grad-hairline:  linear-gradient(90deg, transparent, var(--cb-blue-line), transparent); /* @kind other */
}
