body {
    font-family: 'Lato', sans-serif;
}
.primary {
    background-color: #003865;
    z-index: 100;
}
@keyframes shake {
    0%, 100% {
        transform: translateX(0);
    }

    20%, 60% {
        transform: translateX(-10px);
    }

    40%, 80% {
        transform: translateX(10px);
    }
}

.animate-shake {
    animation: shake 0.5s ease;
}
.swiper, .hero-banner {
    position: relative;
    z-index: 10;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'Montserrat', sans-serif;
}

/* NAV SHINE EFFECT */
nav#desktop-nav a,
nav#desktop-nav button {
    position: relative;
    overflow: hidden;
    transition: color 0.3s ease;
}

    nav#desktop-nav a::before,
    nav#desktop-nav button::before {
        content: '';
        position: absolute;
        bottom: 0;
        left: -100%;
        width: 100%;
        height: 2px;
        background: linear-gradient(120deg, #00c6ff, #0072ff);
        transition: left 0.4s ease;
    }

    nav#desktop-nav a:hover::before,
    nav#desktop-nav button:hover::before {
        left: 0;
    }

    nav#desktop-nav a::after,
    nav#desktop-nav button::after {
        content: '';
        position: absolute;
        top: 0;
        left: -75%;
        width: 50%;
        height: 100%;
        background: linear-gradient(120deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0.2) 100%);
        transform: skewX(-25deg);
    }

    nav#desktop-nav a:hover::after,
    nav#desktop-nav button:hover::after {
        animation: shine 0.75s forwards;
    }

@keyframes shine {
    100% {
        left: 125%;
    }
}

/* SHINE + GLOW for buttons */
.button, button {
    position: relative;
    overflow: hidden;
    z-index: 1;
    color: white;
    background-color: #007bff;
    transition: all 0.4s ease;
    border-radius: 0.375rem;
}

    /* GLOW EFFECT ON HOVER */
    .button:hover, button:hover {
        box-shadow: 0 0 12px rgba(0, 174, 255, 0.7), 0 0 24px rgba(0, 174, 255, 0.5);
    }

    /* SHINE EFFECT */
    .button::after, button::after {
        content: "";
        position: absolute;
        top: 0;
        left: -75%;
        height: 100%;
        width: 50%;
        background: linear-gradient(120deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0.1) 100%);
        transform: skewX(-20deg);
        z-index: 2;
    }

    /* Animate shine on hover */
    .button:hover::after, button:hover::after {
        animation: btn-shine 0.9s ease forwards;
    }

@keyframes btn-shine {
    100% {
        left: 125%;
    }
}


.primary {
    background-color: #003865;
}


<!-- Start of Tawk.to Script-- >
<!-- End of Tawk.to Script-- >


.dropdown-submenu {
    position: relative;
}

.dropdown-submenu a::after {
    transform: rotate(-90deg);
    position: absolute;
    right: 6px;
    top: .8em;
}

.dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-left: .1rem;
    margin-right: .1rem;
}

.primary {
    background-color: #003865;
}

.primary-text {
    color: #003865;
}

.hamburger-line {
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.hamburger-open .line1 {
    transform: rotate(45deg) translate(5px, 5px);
}

.hamburger-open .line2 {
    opacity: 0;
}

.hamburger-open .line3 {
    transform: rotate(-45deg) translate(5px, -5px);
}

#sidebar {
    background-color: #003865;
    color: white;
    width: 240px;
    height: 100vh;
    position: fixed;
    top: 56px;
    left: 0;
    overflow-y: auto;
    transition: transform 0.3s ease;
    z-index: 50;
    transform: translateX(-100%);
}

    #sidebar.open {
        transform: translateX(0);
    }

#overlay {
    position: fixed;
    top: 56px;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 40;
    display: none;
}

    #overlay.active {
        display: block;
    }

#desktop-nav {
    display: none;
}

@media (min-width: 768px) {
    #desktop-nav {
        display: flex;
        gap: 1.5rem;
    }

    #sidebar,
    #sidebar-toggle {
        display: none;
    }
}

.swiper-button-prev,
.swiper-button-next {
    color: white;
    top: 50%;
    width: 2.5rem;
    height: 2.5rem;
    margin-top: -1.25rem;
    opacity: 0.8;
    transition: opacity 0.3s ease;
    z-index: 10;
}

    .swiper-button-prev:hover,
    .swiper-button-next:hover {
        opacity: 1;
    }

@media(min-width: 768px) {
    .swiper-button-prev,
    .swiper-button-next {
        display: none;
    }
}

.swiper-pagination-bullet {
    background: white;
    opacity: 0.7;
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: #003865;
}



@keyframes shake {
    0%, 100%

{
    transform: translateX(0);
}

20%, 60% {
    transform: translateX(-5px);
}

40%, 80% {
    transform: translateX(5px);
}

}

.shake-animation {
    animation: shake 0.6s ease-in-out infinite;
}



@keyframes fadeSlideUp {
    0%

{
    opacity: 0;
    transform: translateY(10px);
}

100% {
    opacity: 1;
    transform: translateY(0);
}

}

.whatsapp-popup {
    display: none;
    animation: fadeSlideUp 0.3s ease-out forwards;
}

.whatsapp-container:hover .whatsapp-popup {
    display: block;
}