/* ==========================================================================
   PRIMITIVES — corporate constants shared by EVERY brand in the ecosystem.
   These never change per brand: spacing, radii, the type scale, motion, and
   the *shape* of shadows. Brand-varying values (color, font family, tinted
   glows) live in themes/<brand>.css instead.

   Naming: everything is `--ds-*` (design system). Components reference these
   plus the semantic brand tokens defined by the active theme.
   ========================================================================== */
:root {
  /* ---- Weights ---- */
  --ds-weight-regular: 400;
  --ds-weight-medium: 500;
  --ds-weight-semibold: 600;
  --ds-weight-bold: 700;
  --ds-weight-extrabold: 800;
  --ds-weight-black: 900;

  /* ---- Display type scale (fluid clamps) ---- */
  --ds-text-hero: clamp(44px, 5.5vw, 72px);
  --ds-text-page-title: clamp(36px, 4.5vw, 60px);
  --ds-text-section: clamp(28px, 3.5vw, 44px);
  --ds-text-display-sm: 24px;

  /* ---- Body / UI type scale ---- */
  --ds-text-lg: 17px;
  --ds-text-md: 16px;
  --ds-text-base: 15px;
  --ds-text-sm: 14px;
  --ds-text-xs: 13px;
  --ds-text-2xs: 12px;
  --ds-text-micro: 11px;

  /* ---- Tracking ---- */
  --ds-track-hero: -2.5px;
  --ds-track-title: -1.5px;
  --ds-track-tight: -0.5px;
  --ds-track-label: 0.08em;
  --ds-track-badge: 0.05em;

  /* ---- Line heights ---- */
  --ds-leading-tight: 1.05;
  --ds-leading-snug: 1.3;
  --ds-leading-body: 1.7;

  /* ---- Radii ---- */
  --ds-radius-sm: 6px;
  --ds-radius-md: 12px;
  --ds-radius-lg: 16px;
  --ds-radius-xl: 20px;
  --ds-radius-2xl: 24px;
  --ds-radius-pill: 100px;
  --ds-radius-round: 50%;

  /* ---- Spacing scale ---- */
  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 12px;
  --ds-space-4: 16px;
  --ds-space-5: 20px;
  --ds-space-6: 24px;
  --ds-space-8: 32px;
  --ds-space-10: 40px;
  --ds-space-12: 48px;
  --ds-space-14: 56px;
  --ds-space-20: 80px;

  /* ---- Layout ---- */
  --ds-container: 1200px;
  --ds-gutter: 24px;
  --ds-nav-height: 68px;

  /* ---- Motion ---- */
  --ds-ease: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --ds-duration: 0.22s; /* @kind other */
  --ds-duration-slow: 0.4s; /* @kind other */
  --ds-transition: var(--ds-duration) var(--ds-ease); /* @kind other */

  /* ---- Elevation: neutral shadow SHAPES (brand-tinted glows live in themes) ---- */
  --ds-shadow-nav: 0 2px 20px rgba(0, 0, 0, 0.08);
  --ds-shadow-card: 0 16px 48px rgba(0, 0, 0, 0.09);
  --ds-shadow-promo: 0 32px 80px rgba(0, 0, 0, 0.20);
  --ds-shadow-promo-hover: 0 48px 120px rgba(0, 0, 0, 0.28);

  /* ---- Hover-lift distances ---- */
  --ds-lift-sm: -1px;
  --ds-lift-md: -4px;
  --ds-lift-lg: -6px;
}