/* ============================================================
   LexusFX — Spacing, radius, shadow
   8px base scale for product/UI work, plus brand radius + shadow.
   ============================================================ */
:root {
  /* ---- Space scale (8px base) ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  /* ---- Radius ----
     Carbon/app world is ROUNDED & soft. Paper/editorial world is SHARP.
     Pick per surface; both are first-class. */
  --radius-xs:  6px;
  --radius-sm:  10px;   /* LFX badge */
  --radius-md:  16px;   /* buttons (carbon) */
  --radius-lg:  24px;
  --radius-xl:  32px;   /* post cards (carbon) */
  --radius-pill: 999px;
  --radius-sharp: 0px;  /* post cards & buttons (paper / editorial) */

  /* ---- Shadow ---- */
  --shadow-soft:  0 6px 24px rgba(0,0,0,.16);
  --shadow-card:  0 12px 44px rgba(0,0,0,.22);
  --shadow-flame: 0 14px 40px rgba(255,106,0,.28);

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(.2, .7, .2, 1); /* @kind other */
  --dur-fast: 140ms; /* @kind other */
  --dur-base: 240ms; /* @kind other */
}