:root {
    --primary-gradient: linear-gradient(135deg, #E31837 0%, #1E3A8A 50%, #DC2626 100%); /* Bold red to blue gradient */
    --secondary-gradient: linear-gradient(135deg, #DC2626, #1E40AF); /* Red to deep blue gradient */
    --header-gradient: rgba(255, 255, 255, 0.98); /* White navbar background - makes logo pop */
    --nav-mobile-gradient: rgba(255, 255, 255, 0.98); /* White mobile nav background */
    --primary-red: #E31837; /* Bold red for primary elements */
    --primary-blue: #1E3A8A; /* Deep blue for accents */
    --accent-red: #DC2626; /* Bright red for highlights */
    --text-dark: #000000; /* Pure black text */
    --text-medium: #374151; /* Dark gray text */
    --text-light: #6B7280; /* Medium gray text */
    --bg-light: #F3F4F6; /* Light gray for backgrounds */
    --white: #FFFFFF; /* Pure white */
    --black: #000000; /* Pure black */
    --shadow-light: rgba(0, 0, 0, 0.1); /* Subtle shadow */
    --shadow-medium: rgba(0, 0, 0, 0.2); /* Medium shadow */
    --shadow-heavy: rgba(0, 0, 0, 0.3); /* Stronger shadow */
    --overlay-dark: rgba(0, 0, 0, 0.3); /* Dark overlay */
    --overlay-light: rgba(227, 24, 55, 0.3); /* Red overlay for scrollbar track */
    --hover-bg: rgba(255, 255, 255, 0.2); /* Hover effect */
    --scrollbar-thumb: rgba(227, 24, 55, 0.7); /* Red thumb */
    --scrollbar-thumb-hover: rgba(227, 24, 55, 0.9); /* Red thumb hover */
    --nav-link-color: #E31837; /* Red for nav links - will use gradient in actual implementation */
    --nav-link-hover: var(--accent-red); /* Red for nav link hover */
    --nav-link-active: var(--primary-blue); /* Blue for active nav link */
}