@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');
:root {
    --accord-blue: #1A237E;
    --accord-yellow: #FFD600;
    --accord-red: #D32F2F;
    --accord-white: #FFFFFF;
    --accord-black: #000000;
    --accord-gray: #f8f9fa;
    --accord-dark-gray: #3949ab;
}
body {
    background-color: var(--accord-gray);
    font-family: 'Inter', Arial, sans-serif;
    color: #222;
    font-size: 1.08rem;
    line-height: 1.7;
}

.navbar, .footer, footer.bg-dark {
    background-color: var(--accord-blue) !important;
}

.navbar .navbar-brand, .navbar .nav-link {
    color: var(--accord-blue) !important;
}

.navbar .nav-link.active, .navbar .nav-link:hover {
    color: var(--accord-black) !important;
    background: var(--accord-yellow) !important;
    border-radius: 2rem;
}

.btn-warning, .btn-warning:focus, .btn-warning:active {
    background-color: var(--accord-yellow) !important;
    color: var(--accord-blue) !important;
    border: none;
    border-radius: 2rem;
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(26,35,126,0.08);
}

.btn-outline-primary {
    border-color: var(--accord-blue) !important;
    color: var(--accord-blue) !important;
    border-radius: 2rem;
    font-weight: 600;
}

.btn-outline-primary:hover {
    background-color: var(--accord-blue) !important;
    color: var(--accord-white) !important;
}

.btn-outline-success {
    border-color: var(--accord-yellow) !important;
    color: var(--accord-yellow) !important;
    border-radius: 2rem;
    font-weight: 600;
}

.btn-outline-success:hover {
    background-color: var(--accord-yellow) !important;
    color: var(--accord-blue) !important;
}

.badge.bg-primary {
    background-color: var(--accord-blue) !important;
}

.text-danger, .btn-danger {
    color: var(--accord-red) !important;
}

a {
    color: var(--accord-blue);
    transition: color 0.2s;
}
a:hover {
    color: var(--accord-yellow);
}

/* Animations */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: none; }
}
@keyframes fadeInLeft {
    from { opacity: 0; transform: translateX(-30px); }
    to { opacity: 1; transform: none; }
}
@keyframes fadeInZoom {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}
.animated {
    opacity: 0;
    will-change: opacity, transform;
}
.animated.fadeInUp.visible { animation: fadeInUp 0.8s cubic-bezier(0.4,0,0.2,1) forwards; }
.animated.fadeInLeft.visible { animation: fadeInLeft 0.8s cubic-bezier(0.4,0,0.2,1) forwards; }
.animated.fadeInZoom.visible { animation: fadeInZoom 0.8s cubic-bezier(0.4,0,0.2,1) forwards; }

/* Card modern style */
.card {
    border-radius: 1.5rem;
    box-shadow: 0 4px 24px rgba(26,35,126,0.08);
    transition: transform 0.3s cubic-bezier(0.4,0,0.2,1), box-shadow 0.3s cubic-bezier(0.4,0,0.2,1);
    background: #fff;
    border: none;
}
.card:hover {
    transform: translateY(-10px) scale(1.03);
    box-shadow: 0 12px 40px rgba(26,35,126,0.14);
}

/* Section backgrounds */
.section-bg {
    background: #fff;
    border-radius: 2rem;
    box-shadow: 0 4px 32px rgba(26,35,126,0.06);
    padding: 3rem 2rem;
    margin-bottom: 3rem;
}
.section-alt {
    background: linear-gradient(90deg, #f8f9fa 60%, #e3e7fd 100%);
    border-radius: 2rem;
    box-shadow: 0 4px 32px rgba(26,35,126,0.04);
    padding: 3rem 2rem;
    margin-bottom: 3rem;
}

/* Button transitions */
.btn, .btn:focus, .btn:active {
    border-radius: 2rem;
    font-weight: 600;
    transition: background 0.2s, color 0.2s, box-shadow 0.2s, transform 0.2s;
    box-shadow: 0 2px 8px rgba(26,35,126,0.06);
}
.btn-warning, .btn-warning:focus, .btn-warning:active {
    background-color: var(--accord-yellow) !important;
    color: var(--accord-blue) !important;
    border: none;
}
.btn-warning:hover {
    background: linear-gradient(90deg, #FFD600 60%, #fffde7 100%) !important;
    color: var(--accord-blue) !important;
    transform: scale(1.06) translateY(-2px);
    box-shadow: 0 6px 24px rgba(26,35,126,0.12);
}
.btn-outline-primary, .btn-outline-success {
    border-radius: 2rem;
    font-weight: 600;
}
.btn-outline-primary:hover {
    background-color: var(--accord-blue) !important;
    color: var(--accord-white) !important;
    transform: scale(1.06);
    box-shadow: 0 6px 24px rgba(26,35,126,0.12);
}
.btn-outline-success:hover {
    background-color: var(--accord-yellow) !important;
    color: var(--accord-blue) !important;
    transform: scale(1.06);
    box-shadow: 0 6px 24px rgba(26,35,126,0.12);
}

main > section, .section-bg, .section-alt, .card {
    margin-bottom: 2.5rem;
}

footer.footer {
    background: linear-gradient(90deg, #1A237E 60%, #3949ab 100%);
    border-top-left-radius: 2rem;
    border-top-right-radius: 2rem;
    box-shadow: 0 -2px 16px rgba(26,35,126,0.08);
    padding-top: 3rem;
    padding-bottom: 2rem;
}
.footer .social-icons a {
    color: #FFD600;
    font-size: 1.5rem;
    margin: 0 10px;
    transition: color 0.2s, transform 0.2s;
}
.footer .social-icons a:hover {
    color: #fff;
    transform: scale(1.2) rotate(-8deg);
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Inter', Arial, sans-serif;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 1.2rem;
}

.hero, .feature-section {
    background: linear-gradient(120deg, #e3e7fd 0%, #f8f9fa 100%);
    border-radius: 2rem;
    box-shadow: 0 4px 32px rgba(26,35,126,0.06);
    padding: 4rem 2rem 3rem 2rem;
    margin-bottom: 3rem;
}