
*/

:root {
/* ==========================================================================
Color Palette
========================================================================== */

/* Primary & Accent Colors */
--color-saffron-deep: #D96B27;
--color-saffron-light: #F39C12;
--color-saffron-hover: #BF581A;

--color-burgundy-deep: #4A0E17;
--color-burgundy-dark: #2D080E;
--color-burgundy-light: #7A1C2B;

--color-gold-accent: #D4AF37;
--color-gold-light: #F3E5AB;
--color-gold-hover: #AA8C2C;

/* Dark Surface & Backgrounds */
--color-bg-main: #0F0D0E;
--color-bg-surface: #1A1618;
--color-bg-surface-elevated: #262124;
--color-bg-surface-glass: rgba(26, 22, 24, 0.85);

/* Typography Colors */
--color-text-primary: #FAF6F0;
--color-text-secondary: #C5BCB6;
--color-text-muted: #8C827A;
--color-text-accent: var(--color-gold-accent);
--color-text-inverse: #0F0D0E;

/* UI Feedback State Colors */
--color-success: #2E7D32;
--color-error: #C62828;
--color-info: #0288D1;

/* Border Colors */
--color-border-subtle: rgba(212, 175, 55, 0.15);
--color-border-strong: rgba(212, 175, 55, 0.4);

/* ==========================================================================
Typography
========================================================================== */

/* Font Families */
--font-family-serif: 'Playfair Display', 'Cinzel', Georgia, serif;
--font-family-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
--font-family-accent: 'Cormorant Garamond', serif;

/* Font Weights */
--font-weight-regular: 400;
--font-weight-medium: 500;
--font-weight-semibold: 600;
--font-weight-bold: 700;

/* Font Sizes /
--font-size-xs: 0.75rem;    / 12px /
--font-size-sm: 0.875rem;   / 14px /
--font-size-md: 1rem;       / 16px /
--font-size-lg: 1.125rem;   / 18px /
--font-size-xl: 1.25rem;    / 20px /
--font-size-2xl: 1.5rem;    / 24px /
--font-size-3xl: 2rem;      / 32px /
--font-size-4xl: 2.75rem;   / 44px /
--font-size-5xl: 3.5rem;    / 56px */

/* Line Heights */
--line-height-tight: 1.2;
--line-height-normal: 1.5;
--line-height-relaxed: 1.75;

/* ==========================================================================
Spacing (Responsive Token Scale)
========================================================================== */

--space-2xs: 0.25rem;  /* 4px /
--space-xs: 0.5rem;    / 8px /
--space-sm: 0.75rem;   / 12px /
--space-md: 1rem;      / 16px /
--space-lg: 1.5rem;    / 24px /
--space-xl: 2rem;      / 32px /
--space-2xl: 3rem;     / 48px /
--space-3xl: 4.5rem;   / 72px */

/* Section Layout Padding */
--section-padding-y: clamp(3rem, 6vw, 6rem);
--container-max-width: 1280px;

/* ==========================================================================
Elevations & Shadows
========================================================================== */

--shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.4);
--shadow-md: 0 4px 12px rgba(0, 0, 0, 0.6);
--shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.8);
--shadow-gold-glow: 0 0 20px rgba(212, 175, 55, 0.25);
--shadow-saffron-glow: 0 0 20px rgba(217, 107, 39, 0.3);

/* ==========================================================================
Borders & Radii
========================================================================== */

--radius-sm: 4px;
--radius-md: 8px;
--radius-lg: 16px;
--radius-full: 9999px;

/* ==========================================================================
Transitions & Animation
========================================================================== */

--transition-fast: 150ms ease-in-out;
--transition-normal: 300ms ease-in-out;
--transition-slow: 500ms ease-in-out;
}