:root {
  /* Color Palette - Authentic Surabi Ma'suar */
  --color-bg-dark: #1a0f0a;
  --color-card-dark: #231208;
  --color-vision-dark: #2d1a10;
  --color-footer-dark: #0e0704;
  --color-bg-cream: #fbf3e8;

  /* Accent & Brand Colors */
  --color-primary: #e8903a;
  --color-primary-hover: #d37925;
  --color-primary-light: rgba(232, 144, 58, 0.15);
  --color-primary-border: rgba(232, 144, 58, 0.3);
  --color-primary-glow: rgba(232, 144, 58, 0.25);

  /* Typography Colors - On Dark */
  --color-text-light: #fbf3e8;
  --color-text-muted-light: #c8a882;
  --color-text-subtle-light: #a07860;

  /* Typography Colors - On Cream */
  --color-text-dark: #1a0f0a;
  --color-text-muted-dark: #4a2c1a;
  --color-text-subtle-dark: #7a4a2e;

  /* Status & Action Colors */
  --color-whatsapp: #25d366;
  --color-whatsapp-hover: #20bd5a;
  --color-white: #ffffff;
  --color-black: #000000;

  /* Typography Stack */
  --font-heading: 'DM Serif Display', Georgia, serif;
  --font-body: 'Nunito', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-accent: 'Outfit', sans-serif;

  /* Type Scale */
  --text-xs: 0.75rem;    /* 12px */
  --text-sm: 0.875rem;   /* 14px */
  --text-base: 1rem;     /* 16px */
  --text-lg: 1.125rem;   /* 18px */
  --text-xl: 1.25rem;    /* 20px */
  --text-2xl: 1.5rem;    /* 24px */
  --text-3xl: 2rem;      /* 32px */
  --text-4xl: 2.5rem;    /* 40px */
  --text-5xl: 3rem;      /* 48px */
  --text-hero: clamp(2.75rem, 7vw, 6rem); /* 44px - 96px */

  /* Radii */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-card: 0 20px 60px rgba(26, 15, 10, 0.25);
  --shadow-badge: 0 8px 15px rgba(232, 144, 58, 0.4);
  --shadow-glow: 0 0 40px rgba(232, 144, 58, 0.2);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.15);

  /* Layout Containers */
  --max-width-site: 1152px;
  --section-padding-y: 96px;
  --section-padding-x: 24px;

  /* Transitions */
  --transition-fast: 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-normal: 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
