@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Montserrat:wght@400;500;600;700&family=Inter:wght@400;500&display=swap');

:root {
  /* ── Brand Colors ── */
  --ink:       #0D1A0E;
  --green:     #1B3A1D;
  --green-md:  #2A5230;
  --green-lt:  #3D7042;
  --gold:      #C4931A;
  --gold-lt:   #F5E8C2;
  --gold-md:   #DBA82A;
  --cream:     #FAF8F4;
  --warm:      #F0EBE3;
  --stone:     #4C4C48;
  --border:    #DDD8CE;
  --white:     #FFFFFF;

  /* ── Typography ── */
  --font-display: 'Bebas Neue', sans-serif;
  --font-head:    'Montserrat', sans-serif;
  --font-body:    'Inter', sans-serif;

  /* ── Type Scale ── */
  --text-xs:   11px;
  --text-sm:   13px;
  --text-base: 16px;
  --text-md:   18px;
  --text-lg:   20px;
  --text-xl:   24px;
  --text-2xl:  32px;
  --text-3xl:  clamp(32px, 4vw, 48px);
  --text-4xl:  clamp(42px, 6vw, 68px);
  --text-5xl:  clamp(48px, 7vw, 72px);
  --text-hero: clamp(58px, 9vw, 100px);

  /* ── Spacing Scale ── */
  --sp-2:   4px;
  --sp-3:   8px;
  --sp-4:  12px;
  --sp-5:  16px;
  --sp-6:  20px;
  --sp-7:  24px;
  --sp-8:  28px;
  --sp-10: 40px;
  --sp-12: 52px;
  --sp-14: 56px;
  --sp-16: 64px;
  --sp-20: 80px;
  --sp-24: 96px;

  /* ── Layout ── */
  --max-w:     1140px;
  --pad-x:     28px;
  --radius:    4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;

  /* ── Shadows ── */
  --shadow-sm: 0 1px 8px rgba(0,0,0,.06);
  --shadow-md: 0 4px 20px rgba(0,0,0,.09);
  --shadow-lg: 0 8px 40px rgba(0,0,0,.13);

  /* ── Transitions ── */
  --ease: .18s ease;
}