/* Explain: CSS variables for site styling and color tokens. */
:root {
    --primary-color: #4F46E5;
    --primary-hover: #4338CA;
    --secondary-color: #6366F1;
    --accent-color: #E31837;
    --logo-subtitle-color: #4F46E5;
    --button-color: #E31837;
    --background-color: #C7D2FE;
    --surface-color: #E0E7FF;
    --footer-bg: #312E81;
    --text-color: #0F172A;
    --text-muted: #334155;
    --border-color: rgba(67, 56, 202, 0.15);
    --glass-bg: rgba(224, 231, 255, 0.85);
    --glass-border: rgba(67, 56, 202, 0.25);
    --nav-bg: rgba(199, 210, 254, 0.9);
    --field-bg: #FFFFFF;
    --brand-soft: rgba(227, 24, 55, 0.15);
    --brand-dark: #A10F23;
    --shadow-soft: 0 22px 70px rgba(0, 51, 102, 0.08);
            --shadow-button: 0 16px 36px rgba(227, 24, 55, 0.3);
        --heading-color: #C026D3;
        --font-heading: 'Lora', serif;
    --font-body: 'Montserrat', sans-serif;
    --font-logo: 'Playfair Display', serif;
}