/* ============================================================
   US DEMOLITION — SPACING, RADIUS, SHADOW, MOTION
   Hard-edged industrial: small radii, heavy shadows, gold rules.
   ============================================================ */
:root {
  /* --- Spacing scale (4px base) --- */
  --sp-0:  0;       /* @kind spacing */
  --sp-1:  0.25rem;   /* 4 */
  --sp-2:  0.5rem;    /* 8 */
  --sp-3:  0.75rem;   /* 12 */
  --sp-4:  1rem;      /* 16 */
  --sp-5:  1.5rem;    /* 24 */
  --sp-6:  2rem;      /* 32 */
  --sp-7:  3rem;      /* 48 */
  --sp-8:  4rem;      /* 64 */
  --sp-9:  6rem;      /* 96 */
  --sp-10: 8rem;      /* 128 */

  /* --- Radii (industrial = sharp; gentle softening only) --- */
  --r-none: 0;      /* @kind radius */
  --r-xs:   2px;
  --r-sm:   4px;     /* default control */
  --r-md:   6px;     /* card */
  --r-lg:   10px;    /* large panel */
  --r-pill: 999px;   /* badges, chips */

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

  /* --- Shadows: deep, contact-heavy on dark --- */
  --sh-sm:  0 1px 2px rgba(0,0,0,0.5);
  --sh-md:  0 4px 14px rgba(0,0,0,0.55);
  --sh-lg:  0 12px 34px rgba(0,0,0,0.6);
  --sh-xl:  0 24px 60px rgba(0,0,0,0.7);
  --sh-gold: 0 6px 22px rgba(224,168,46,0.28);   /* glow on gold CTA */
  --sh-inset-top: inset 0 1px 0 rgba(255,255,255,0.06); /* steel top bevel */
  --sh-inset-gold: inset 0 1px 0 rgba(244,210,122,0.5); /* foil bevel */

  /* --- Motion --- */
  --ease-out:  cubic-bezier(0.2, 0.7, 0.2, 1);     /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);   /* @kind other */
  --ease-snap: cubic-bezier(0.34, 1.4, 0.5, 1);    /* @kind other */
  --dur-fast:  120ms;   /* @kind other */
  --dur-base:  200ms;   /* @kind other */
  --dur-slow:  360ms;   /* @kind other */

  /* --- Layout --- */
  --container:   1200px;       /* @kind spacing */
  --container-wide: 1440px;    /* @kind spacing */
  --gutter:      var(--sp-5);  /* @kind spacing */

  /* --- Textures / effects --- */
  --grad-fade-top: linear-gradient(to bottom, rgba(6,6,6,0.85) 0%, rgba(6,6,6,0) 100%);      /* @kind color */
  --grad-fade-bottom: linear-gradient(to top, rgba(6,6,6,0.92) 0%, rgba(6,6,6,0) 100%);      /* @kind color */
  --scrim-hero: linear-gradient(90deg, rgba(6,6,6,0.9) 0%, rgba(6,6,6,0.55) 45%, rgba(6,6,6,0.15) 100%); /* @kind color */
}
