:root {
  /* Colors */
  --color-bg-primary: #242222;
  --color-bg-dark: #2b2929;
  --color-accent: #ffb375;
  --color-white: #f5f1ea;
  --color-btn-gradient: linear-gradient(180deg, #ffc07f 0%, #ffa66e 100%);
  --color-btn-secondary-border: #c99b5e;
  --color-text: #a8a19a;
  --color-heading: #f7c879;
  --color-btn-text: #211d1f;
  --color-overlay: rgba(0, 0, 0, 0.6);
  --color-card-bg: #2b2929;
  --color-border: rgba(199, 155, 94, 0.2);

  /* Typography */
  --font-family: 'Montserrat', sans-serif;
  --font-size-base: 15px;
  --font-size-sm: 14px;
  --font-size-h1: clamp(28px, 4vw, 44px);
  --font-size-h2: clamp(22px, 3vw, 32px);
  --font-size-h3: clamp(18px, 2vw, 24px);
  --line-height: 1.6;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;

  /* Spacing */
  --section-gap: 56px;
  --card-gap: 20px;
  --paragraph-gap: 20px;
  --h2-gap: 20px;
  --h3-gap: 16px;
  --faq-gap: 14px;
  --card-padding: 24px;
  --container-max: 1440px;

  /* Borders */
  --border-radius: 6px;
  --border-radius-lg: 10px;

  /* Transitions */
  --transition: 0.25s ease;
  --transition-slow: 0.4s ease;

  /* Shadows */
  --shadow-card: 0 4px 20px rgba(0, 0, 0, 0.3);
  --shadow-hover: 0 8px 32px rgba(0, 0, 0, 0.4);
}