/* ============================================================
   Rivera Construction — Design Tokens
   ============================================================ */

:root {
  /* ── Colors ─────────────────────────────────────── */
  --color-bg:          #0D2137;
  --color-bg-mid:      #091a2d;
  --color-bg-deep:     #060f1a;
  --color-surface:     #112840;
  --color-surface-2:   #163250;

  --color-accent:      #E8640A;
  --color-accent-lt:   #f47c2a;
  --color-accent-warm: #c44f00;
  --color-accent-dim:  rgba(232, 100, 10, 0.15);

  --color-text:        #e8edf4;
  --color-text-muted:  #8ba3bd;
  --color-text-dim:    #5a7a96;
  --color-heading:     #ffffff;
  --color-border:      rgba(255, 255, 255, 0.08);
  --color-border-acc:  rgba(232, 100, 10, 0.35);

  /* ── Typography ──────────────────────────────────── */
  --font-heading: 'Poppins', sans-serif;
  --font-body:    'Inter', sans-serif;

  --fs-xs:   0.75rem;
  --fs-sm:   0.875rem;
  --fs-base: 1rem;
  --fs-md:   1.125rem;
  --fs-lg:   1.25rem;
  --fs-xl:   1.5rem;
  --fs-2xl:  2rem;
  --fs-3xl:  2.5rem;
  --fs-4xl:  3.5rem;

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semi:    600;
  --fw-bold:    700;
  --fw-black:   800;

  --lh-tight:  1.1;
  --lh-snug:   1.3;
  --lh-normal: 1.6;
  --lh-loose:  1.8;

  /* ── Spacing ─────────────────────────────────────── */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* ── Section padding ─────────────────────────────── */
  --section-pad: clamp(4rem, 8vw, 7rem);

  /* ── Border radius ───────────────────────────────── */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-full: 9999px;

  /* ── Shadows ─────────────────────────────────────── */
  --shadow-sm:  0 1px 4px rgba(0, 0, 0, 0.3);
  --shadow-md:  0 4px 16px rgba(0, 0, 0, 0.4);
  --shadow-lg:  0 8px 32px rgba(0, 0, 0, 0.5);
  --shadow-xl:  0 16px 56px rgba(0, 0, 0, 0.6);
  --shadow-card: 0 4px 24px rgba(0, 0, 0, 0.45);

  /* ── Glow (accent-based) ─────────────────────────── */
  --glow-accent:     0 0 32px rgba(232, 100, 10, 0.55);
  --glow-accent-sm:  0 0 12px rgba(232, 100, 10, 0.35);
  --glow-accent-lg:  0 0 56px rgba(232, 100, 10, 0.45), 0 0 100px rgba(232, 100, 10, 0.2);
  --glow-accent-btn: 0 4px 20px rgba(232, 100, 10, 0.55);

  /* ── Motion ──────────────────────────────────────── */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast:    150ms;
  --dur-base:    280ms;
  --dur-slow:    500ms;
  --dur-reveal:  700ms;

  /* ── Nav ─────────────────────────────────────────── */
  --nav-h: 72px;
  --nav-h-mobile: 64px;

  /* ── Container ───────────────────────────────────── */
  --container-max: 1240px;
  --container-pad: clamp(1.25rem, 4vw, 2rem);
}