:root {
  /* -------------------- Brand colors -------------------- */
  --color-gold: #e7b54a;
  --color-gold-hover: rgba(224, 176, 72, 0.925);
  --color-tan: #c9a273;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-bronze: #b66730;
  --color-champagne: #e5c777;

  /* -------------------- Gradients -------------------- */
  --gradient-social-border: linear-gradient(135deg, var(--color-bronze), var(--color-champagne));

  /* -------------------- Overlays / surfaces -------------------- */
  --color-overlay: rgba(0, 0, 0, 0.5);
  --color-popup-bg: rgba(8, 8, 8, 0.94);

  /* -------------------- Border colors -------------------- */
  --border-color-light: rgba(255, 255, 255, 0.85);
  --border-color-subtle: rgba(255, 255, 255, 0.25);
  --border-color-gold: rgba(201, 168, 118, 0.35);

  /* -------------------- Text colors -------------------- */
  --color-text-primary: #ffffff;
  --color-text-secondary: rgba(255, 255, 255, 0.82);

  /* -------------------- Scrollbar colors -------------------- */
  --scrollbar-track: #f1ecef;
  --scrollbar-thumb: #c4a96a;
  --scrollbar-thumb-hover: #d3a73f;

  /* -------------------- Font weights -------------------- */
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-bold: 700;
  --fw-black: 900;

 /* -------------------- Responsive Font Size Scale -------------------- */

--font-11: clamp(0.6875rem, 0.65rem + 0.15vw, 0.7rem);   /* 11px */
--font-12: clamp(0.6875rem, 0.65rem + 0.15vw, 0.7rem);   /* 11px */
--font-14: clamp(0.8125rem, 0.75rem + 0.25vw, 0.875rem); /* 14px */
--font-16: clamp(0.875rem, 0.8rem + 0.3vw, 1rem);         /* 16px */
--font-17: clamp(0.9375rem, 0.85rem + 0.35vw, 1.1rem);    /* 17.6px */
--font-18: clamp(1rem, 0.9rem + 0.4vw, 1.125rem);        /* 18px */
--font-20: clamp(1.0625rem, 0.95rem + 0.45vw, 1.25rem);  /* 20px */
--font-22: clamp(1.125rem, 1rem + 0.5vw, 1.375rem);      /* 22px */
--font-24: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);       /* 24px */
--font-26: clamp(1.375rem, 1.2rem + 0.65vw, 1.625rem);   /* 26px */
--font-28: clamp(1.5rem, 1.3rem + 0.7vw, 1.75rem);       /* 28px */
--font-30: clamp(1.625rem, 1.4rem + 0.75vw, 1.875rem);   /* 30px */
--font-32: clamp(1.75rem, 1.5rem + 0.8vw, 2rem);         /* 32px */
--font-34: clamp(1.875rem, 1.6rem + 0.85vw, 2.125rem);   /* 34px */
--font-36: clamp(2rem, 1.7rem + 0.9vw, 2.25rem);         /* 36px */
--font-38: clamp(2rem, 1.7rem + 1.1vw, 2.375rem);
--font-40: clamp(2.125rem, 1.8rem + 1vw, 2.5rem);        /* 40px */
--font-44: clamp(2.375rem, 2rem + 1vw, 2.75rem);         /* 44px */
--font-46: clamp(2.5rem, 2.1rem + 1vw, 2.875rem);        /* 46px */
--font-48: clamp(2.625rem, 2.2rem + 1.1vw, 3rem);        /* 48px */
--font-50: clamp(2rem, 1.8rem + 1.5vw, 3.125rem);        /* 48px */
--font-56: clamp(3rem, 2.5rem + 1.5vw, 3.5rem);          /* 56px */
}