@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

* { font-family: 'Inter', sans-serif; }

:root {
    --primary: #0F3B5E;
    --primary-light: #1A5276;
    --accent: #2ECC71;
    --accent-light: #A8E6CF;
    --emergency: #E74C3C;
    --gray-light: #F8FAFC;
    --text-dark: #1A202C;
}

html { scroll-behavior: smooth; }
body { background: white; color: var(--text-dark); }
.container-custom { max-width: 1280px; margin: 0 auto; padding: 0 1.5rem; }

/* Visually Impaired Mode */
body.visually-impaired { background: #000 !important; color: #fff !important; }
body.visually-impaired * { background: #000 !important; color: #fff !important; border-color: #fff !important; }
body.visually-impaired .text-accent { color: #FFD700 !important; }

/* Buttons & Cards */
.card-hover { transition: transform 0.3s ease, box-shadow 0.3s ease; }
.card-hover:hover { transform: translateY(-8px); box-shadow: 0 20px 40px rgba(15, 59, 94, 0.15); }

.btn-primary { background: var(--primary); color: white; padding: 0.75rem 2rem; border-radius: 50px; font-weight: 600; display: inline-block; }
.btn-outline { border: 2px solid var(--primary); color: var(--primary); padding: 0.75rem 2rem; border-radius: 50px; font-weight: 600; display: inline-block; }
.btn-emergency { background: var(--emergency); color: white; padding: 0.75rem 2rem; border-radius: 50px; font-weight: 700; display: inline-block; animation: pulse-emergency 2s infinite; }

@keyframes pulse-emergency {
    0%, 100% { box-shadow: 0 0 0 0 rgba(231, 76, 60, 0.5); }
    50% { box-shadow: 0 0 0 15px rgba(231, 76, 60, 0); }
}

.bg-gradient-hero { background: linear-gradient(135deg, #0F3B5E 0%, #1A5276 50%, #2ECC71 100%); }
.bg-gradient-about { background: linear-gradient(135deg, #F8FAFC 0%, #E8F5E9 100%); }
.stat-number { font-size: 3rem; font-weight: 800; color: var(--primary); }
.department-icon { font-size: 3.5rem; display: block; margin-bottom: 1rem; }

/* Mobile menu container style */
#mobile-menu { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: white; z-index: 1000; padding: 2rem; }
#mobile-menu.active { display: block; }
#mobile-menu .close-btn { position: absolute; top: 1rem; right: 1.5rem; font-size: 2rem; }