:root {
  /* ─── PRIMARY: WARM BEIGE ─── */
  --beige-primary: #D4A574;
  --beige-light: #E8D4C0;
  --beige-dark: #C09460;

  /* ─── SECONDARY: SOFT BROWN ─── */
  --brown-secondary: #8B6914;
  --brown-light: #A8845F;
  --brown-dark: #6B5410;

  /* ─── BACKGROUND: CREAM GRADIENTS ─── */
  --cream: #FDF8F0;
  --cream-mid: #F9F4ED;
  --cream-dark: #F5F1E8;
  --white: #FFFFFF;

  /* ─── ACCENT: TERRACOTTA ─── */
  --terracotta: #C17767;
  --terracotta-light: #D89483;
  --terracotta-dark: #A85C52;

  /* ─── TEXT: DARK COFFEE ─── */
  --coffee: #3E2723;
  --coffee-mid: #5D4037;
  --coffee-light: #795548;

  /* ─── SUPPORTING COLORS ─── */
  --sage-green: #9CAF88;
  --sage-green-light: #B8C79F;
  --sage-green-dark: #7A8B6F;

  --amber: #D4A031;
  --amber-light: #E8B947;
  --amber-dark: #B8841F;

  --taupe-border: #D7CCC8;
  --warm-gray: #A89080;
  --warm-gray-light: #C4B5A8;
  --olive-green: #6B8E23;

  /* ─── TYPOGRAPHY ─── */
  --font-display: 'Playfair Display', serif;
  --font-body: 'Inter', sans-serif;

  /* ─── BORDER RADIUS ─── */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-pill: 100px;

  /* ─── SHADOWS ─── */
  --shadow-sm: 0 1px 3px rgba(62, 39, 35, 0.12);
  --shadow-md: 0 4px 12px rgba(62, 39, 35, 0.15);
  --shadow-lg: 0 12px 28px rgba(62, 39, 35, 0.18);
  --shadow-xl: 0 20px 40px rgba(62, 39, 35, 0.2);

  /* ─── SPACING ─── */
  --section-pad-desktop: 100px 80px;
  --section-pad-mobile: 64px 20px;
  --container-pad-desktop: 0 80px;
  --container-pad-mobile: 0 20px;
  --card-pad-desktop: 32px;
  --card-pad-mobile: 20px;
}