.glass-nav {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.nav-link-hover {
    position: relative;
}

.nav-link-hover::after {
    content: '';
    position: absolute;
    width: 0%;
    height: 2px;
    bottom: -4px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #2563eb;
    transition: width 0.3s ease;
    border-radius: 2px;
}

.nav-link-hover:hover::after,
.group:hover .nav-link-hover::after {
    width: 100%;
}

.waviy-logo span {
            font-weight: 700;
            position: relative;
            display: inline-block;
            animation: flip 4.5s infinite;
            animation-delay: calc(.2s * var(--i));
        }

        @keyframes flip {

            0%,
            80% {
                transform: rotateY(360deg);
            }
        }

        @media (max-width:575px){
            .waviy-logo span{
                font-size:.8rem;
            }
        }

.mobile-submenu {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s ease-in-out;
}

.mobile-submenu-inner {
    overflow: hidden;
}

.mobile-submenu.is-expanded {
    grid-template-rows: 1fr;
}

.dropdown-menu {
    transform-origin: top center;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}


/* hero section */

.hero-banner-section {
    width: 100%;
    /* Changed from 21/9 to 24/9 to reduce the height specifically on desktop */
    aspect-ratio: 24 / 9;
    position: relative;
    margin-bottom: 0rem;
}

/* Keep the mobile and tablet sizing exactly as it was */
@media (max-width: 768px) {
    .hero-banner-section {
        aspect-ratio: 16 / 10;
    }
}

.swiper {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    background-color: #000;
}

.swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
    display: block;
    /* Zoom effect CSS has been completely removed */
}

/* Pagination Styling */
.swiper-pagination {
    bottom: 30px !important;
}

.swiper-pagination-bullet {
    background: #ffffff;
    opacity: 0.4;
    width: 12px;
    height: 4px;
    border-radius: 4px;
    transition: all 0.4s ease;
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: #ffffff;
    width: 32px;
}

.mySwiperVertical .swiper-pagination {
    right: 30px !important;
    left: auto !important;
    bottom: auto !important;
    top: 50% !important;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Make the vertical dots tall instead of wide */
.mySwiperVertical .swiper-pagination-bullet {
    width: 4px;
    height: 12px;
}

.mySwiperVertical .swiper-pagination-bullet-active {
    height: 32px;
    width: 4px;
}

@media screen and (max-width: 400px) {
    .g-recaptcha {
        transform: scale(0.80);
        transform-origin: left top;
    }
}

/* crm-software tools and technology section */
@keyframes tech-slide {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
.marquee-container {
    overflow: hidden;
    width: 100%;
    position: relative;
    mask-image: linear-gradient(to right, transparent, black 5%, black 95%, transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, black 5%, black 95%, transparent);
}
.marquee-track {
    display: flex;
    width: max-content;
    gap: 2rem; /* Increased gap for wider cards */
    animation: tech-slide 25s linear infinite; /* Adjusted speed for wider view */
}
.marquee-track:hover {
    animation-play-state: paused;
}


/* training page css */

@keyframes gradientBlob {
                0% { transform: translate(0px, 0px) scale(1); }
                33% { transform: translate(60px, -60px) scale(1.1); }
                66% { transform: translate(-40px, 40px) scale(0.9); }
                100% { transform: translate(0px, 0px) scale(1); }
            }
            .animate-gradient-blob {
                animation: gradientBlob 15s infinite alternate ease-in-out;
            }


            @keyframes benefitBlob1 {
                0%, 100% { transform: translate(0px, 0px) scale(1); }
                33% { transform: translate(-70px, 60px) scale(1.1); }
                66% { transform: translate(30px, -50px) scale(0.95); }
            }
            @keyframes benefitBlob2 {
                0%, 100% { transform: translate(0px, 0px) scale(1); }
                33% { transform: translate(60px, -70px) scale(1.15); }
                66% { transform: translate(-40px, 30px) scale(0.9); }
            }
            @keyframes benefitBlob3 {
                0%, 100% { transform: translate(-50%, -50%) scale(1); }
                50% { transform: translate(-55%, -45%) scale(1.2); }
            }
            .animate-benefit-blob-1 { animation: benefitBlob1 15s infinite ease-in-out; }
            .animate-benefit-blob-2 { animation: benefitBlob2 18s infinite ease-in-out; }
            .animate-benefit-blob-3 { animation: benefitBlob3 13s infinite ease-in-out; }


/* LEAP page css */
@keyframes leapBlob {
                0%, 100% { transform: translate(0px, 0px) scale(1); }
                33% { transform: translate(-50px, 40px) scale(1.1); }
                66% { transform: translate(40px, -30px) scale(0.95); }
            }
            .animate-leap-blob { animation: leapBlob 18s infinite ease-in-out; }
            
            @keyframes moveDown {
                0% { top: -10%; opacity: 0; }
                50% { opacity: 1; }
                100% { top: 110%; opacity: 0; }
            }