/* ==================== CSS Variables ==================== */

@font-face {
    font-family: 'Accia Piano';
    src: url('../media/fonts/AcciaPiano-Light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

:root {
    /* Typography */
    --font-display: 'Accia Piano', Georgia, 'Times New Roman', serif;
    --font-body: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;

    /* Primary Colors - Red */
    --primary-color: #e63946;
    --primary-dark: #c41e3a;
    --primary-light: #ff5765;
    --primary-rgb: 230, 57, 70;

    /* Accent Colors - Navy */
    --accent-color: #1a2f4a;
    --accent-light: #2c4a6f;
    --accent-dark: #0f1e30;
    --accent-rgb: 26, 47, 74;

    /* Neutral Colors */
    --text-dark: #2b2b2b;
    --text-medium: #555555;
    --text-light: #777777;
    --white: #ffffff;
    --off-white: #f7f8fa;
    --gray-light: #e9ecef;
    --gray-medium: #adb5bd;
    --gray-dark: #495057;

    /* Gradients */
    --gradient-hero: linear-gradient(180deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.35) 100%);
    --gradient-accent: linear-gradient(135deg, var(--accent-color) 0%, var(--accent-light) 100%);

    /* Effects */
    --shadow-xs: 0 1px 3px rgba(0, 0, 0, 0.06);
    --shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.12);
    --shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.15);
    --transition: all 0.3s ease;
    --transition-slow: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
    --border-radius: 8px;
    --border-radius-lg: 16px;
    --border-radius-xl: 24px;

    /* Spacing */
    --section-padding: 100px 0;
    --section-padding-sm: 60px 0;
    --container-max: 1200px;
    --header-height: 72px;
}