/* css/modern/variables.css (Updated Content) */
:root {
    /* Brand Primary Colors */
    --brand-blue: #0055a4;         /* Deep navy blue - primary brand color */
    --brand-dark-grey: #343a40;    /* Dark charcoal grey - secondary/text */

    /* Main Color Scheme */
    --primary-color: var(--brand-blue);
    --primary-dark: #003d7a;                  /* Darker blue for hover states */
    --secondary-color: var(--brand-dark-grey); /* Changed from red */
    --tertiary-color: #6c757d;                /* Medium grey for accents/text */

    /* Accent Colors (Simplified) */
    --accent-gold: #c0b283;                   /* Muted gold for subtle highlights */
    --accent-light-blue: #e7f0f7;             /* Very light blue for backgrounds */

    /* Wood-Inspired Neutral Colors (Kept for potential use) */
    --wood-dark: #5d4037;
    --wood-medium: #8d6e63;
    --wood-light: #bcaaa4;
    --wood-beige: #d7ccc8;

    /* UI Background Colors */
    --background-primary: #ffffff;            /* Main background color */
    --background-secondary: #f8f9fa;          /* Light grey for secondary bg */
    --background-tertiary: #e9ecef;           /* Slightly darker grey */
    --background-dark: #212529;               /* Very dark grey/near black */

    /* Text Colors */
    --text-color: #212529;                    /* Primary text color - very dark grey */
    --text-light: #495057;                    /* Secondary text color - dark grey */
    --text-lighter: #6c757d;                  /* Tertiary text color - medium gray */
    --white: #ffffff;                         /* White */
    --text-on-dark: rgba(255, 255, 255, 0.85); /* Text on dark backgrounds */
    --text-on-dark-muted: rgba(255, 255, 255, 0.65);

    /* UI Feedback Colors */
    --success-color: #28a745;                 /* Success green */
    --warning-color: #ffc107;                 /* Warning yellow */
    --error-color: #dc3545;                   /* Error red */
    --info-color: #17a2b8;                    /* Info cyan */

    /* Gradient Backgrounds (Updated) */
    --gradient-primary: linear-gradient(45deg, var(--brand-blue), #007bff); /* Blue gradient */
    --gradient-grey: linear-gradient(45deg, var(--brand-dark-grey), #495057); /* Grey gradient */
    --gradient-dark: linear-gradient(45deg, #212529, #343a40); /* Dark gradient */
    --gradient-gold: linear-gradient(45deg, #c0b283, #d4c190); /* Muted gold gradient */

    /* Overlay Colors (Updated) */
    --overlay-dark: rgba(33, 37, 41, 0.8); /* Dark grey overlay */
    --overlay-light: rgba(255, 255, 255, 0.9);
    --overlay-blue: rgba(0, 85, 164, 0.75);
    --overlay-gradient: linear-gradient(to bottom, rgba(33, 37, 41, 0.6), rgba(33, 37, 41, 0.9));

    /* Border Colors (Updated) */
    --border-color: #dee2e6;                  /* Light gray for borders */
    --border-medium: #ced4da;                 /* Medium gray for borders */
    --border-dark: #495057;                   /* Dark border color */

    /* Shadow Colors (Updated) */
    --shadow-color: rgba(0, 0, 0, 0.1);       /* Shadow color */
    --shadow-dark: rgba(0, 0, 0, 0.2);       /* Darker shadow */
    --shadow-primary: rgba(0, 85, 164, 0.15); /* Primary color shadow */
    --shadow-secondary: rgba(52, 58, 64, 0.15); /* Secondary color shadow */

    /* Typography */
    --heading-font: 'Montserrat', sans-serif;
    --body-font: 'Montserrat', sans-serif;
    --accent-font: 'Playfair Display', serif; /* Kept for potential specific use */

    /* Font Sizes (Adjusted slightly for better hierarchy) */
    --font-size-xs: 0.75rem;          /* 12px */
    --font-size-sm: 0.875rem;         /* 14px */
    --font-size-base: 1rem;           /* 16px */
    --font-size-md: 1.125rem;         /* 18px */
    --font-size-lg: 1.25rem;          /* 20px */
    --font-size-xl: 1.6rem;           /* ~26px */
    --font-size-2xl: 2rem;            /* 32px */
    --font-size-3xl: 2.5rem;          /* 40px */
    --font-size-4xl: 3rem;            /* 48px */
    --font-size-5xl: 3.75rem;         /* 60px */
    --font-size-6xl: 4.5rem;          /* 72px */

    /* Font Weights */
    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    /* Spacing */
    --spacing-xs: 0.25rem;            /* 4px */
    --spacing-sm: 0.5rem;             /* 8px */
    --spacing-md: 1rem;               /* 16px */
    --spacing-lg: 1.5rem;             /* 24px */
    --spacing-xl: 2rem;               /* 32px */
    --spacing-2xl: 2.5rem;            /* 40px */
    --spacing-3xl: 3rem;              /* 48px */
    --spacing-4xl: 4rem;              /* 64px */
    --spacing-5xl: 6rem;              /* 96px */

    /* Border Radius */
    --border-radius-sm: 4px;  /* Slightly increased default roundness */
    --border-radius-md: 6px;
    --border-radius-lg: 8px;
    --border-radius-xl: 12px;
    --border-radius-full: 50px; /* Adjusted for pill shape */

    /* Transitions */
    --transition-fast: 0.2s ease-in-out;
    --transition-normal: 0.3s ease-in-out;
    --transition-slow: 0.5s ease-in-out;
    --transition-bezier: 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);

    /* Z-index layers */
    --z-back: -1;
    --z-normal: 1;
    --z-tooltip: 10;
    --z-fixed: 100;
    --z-modal: 1000;

    /* Box shadows (Subtler) */
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
    --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.07), 0 2px 4px -1px rgba(0,0,0,0.04);
    --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.07), 0 4px 6px -2px rgba(0,0,0,0.03);
    --shadow-xl: 0 20px 25px -5px rgba(0,0,0,0.07), 0 10px 10px -5px rgba(0,0,0,0.02);
    --shadow-inset: inset 0 2px 4px 0 rgba(0,0,0,0.04);
    --shadow-button: 0 4px 14px 0 var(--shadow-primary);
    --shadow-button-secondary: 0 4px 14px 0 var(--shadow-secondary);

    /* Custom values for animations */
    --animation-curve: cubic-bezier(0.65, 0, 0.35, 1);
    --animation-curve-bounce: cubic-bezier(0.68, -0.6, 0.32, 1.6);

    /* Component-specific variables */
    --header-height: 80px; /* Slightly reduced */
    --header-height-mobile: 65px;
    --header-height-scroll: 65px;
    --footer-padding-top: 80px;
    --footer-padding-bottom: 25px;
}
