:where(*, *:before, *:after) {
    margin: 0;
    padding: 0;
}

body {
    margin: 0;
    padding: 0;
    font-family: "Poppins", sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    --p-c: #0057A1;
    --s-c: #2AD2C1;
    --acc-c: #0E327C;
    --para-c: #374151;
    --bg-w: white;
    --bg-d: #374151;
    --t-c-l: white;
    --t-c-d: #00203B;
    --acc-1: #134175;
    --acc-2: #F5F7FF;
    --acc-3: #1E2D52;
    --acc-4: #0058A1;
    --acc-5: #004C8D;
}

.font-poppins {
    font-family: "Poppins", sans-serif !important;
}

.font-pt-san {
    font-family: "PT Sans Caption", sans-serif;
}

.maskimage.hoverLevel-1:hover {
    background-color: var(--h, var(--bg)) !important;
}

*:hover>.maskimage.hoverLevel-2 {
    background-color: var(--h, var(--bg)) !important;
}

*:hover>*>.maskimage.hoverLevel-3 {
    background-color: var(--h, var(--bg)) !important;
}

.header-pc {
    background-image: linear-gradient(to right, var(--p-c) 0%, var(--p-c) 20%, rgba(255, 255, 255, 0) 20%);
}

.gra-1 {
    background-image: linear-gradient(to right, #28BCD0, #2BEFAD);
}

.gra-2 {
    background: linear-gradient(132deg, #0058A1, #046BC0);
}

.gra-3 {
    background: linear-gradient(132deg, #2AD2C1, #046BC0);
}

.gra-5 {
    background: linear-gradient(132deg, #2495f1 5%, #2AD2C1);
}

.gra-4 {
    background: linear-gradient(132deg, #F7B04F, #EF5630);
}

.gra-1,
.gra-3,
.gra-5,
.gra-4 {
    background-size: 100% 100%;
    background-position: left;
    transition: background-size 0.5s ease, background-position 0.5s ease, all 3s;
}

[class^="gra-"]:hover {
    background-size: 200% 100%;
    background-position: right;
}

.color-mix {
    background-color: color-mix(in srgb, var(--c) var(--o), rgba(255, 255, 255, 0));
}


/* top bar start */
.top-one {
    clip-path: polygon(0% 0%, 90% 0%, 100% 100%, 0% 100%, 0% 0%);
}

/* top bar end */


/* hero sectio swiper start */

.hero-section-bg {
    background-image: url(../new-images/banner/bg-1.png);
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
}

.swiper-slide.swiper-slide-active .slider-group-image {
    height: 100%;
    width: 100%;
    transform: translateY(9px) scale(1.05);
    background-image: url(../new-images/banner/doc/f-5.png), url(../new-images/banner/doc/f-4.png), url(../new-images/banner/doc/f-3.png), url(../new-images/banner/doc/f-2.png), url(../new-images/banner/doc/f-11.png);
    background-position: center 1000px, -1000px center, 1000px center, center 1000px, 1000px center;
    background-repeat: no-repeat;
    background-size: contain;
    animation: back-ani 2s forwards;
}

@keyframes back-ani {
    0% {
        background-position: center 1000px, -1000px center, 1000px center, center 1000px, 1000px center;
    }

    20% {
        background-position: center 1000px, -1000px center, 1000px center, center 1000px, center;
    }

    40% {
        background-position: center 1000px, -1000px center, 1000px center, center, center;
    }

    60% {
        background-position: center 1000px, -1000px center, center, center, center;
    }

    80% {
        background-position: center 1000px, center, center, center, center;
    }

    100% {
        background-position: center, center, center, center, center;
    }
}

.hero-sec-pag.custom-pagination.swiper-pagination-bullets {
    top: 50% !important;
    left: 0 !important;
    right: auto !important;
    bottom: auto !important;
    width: max-content !important;
    gap: 10px !important;
    transform: translateY(-50%)translateX(500%);
    z-index: 99 !important;
}

@media (max-width: 1700px) {
    .hero-sec-pag.custom-pagination.swiper-pagination-bullets {
        transform: translateY(-50%) translateX(20px);
    }

}

.custom-pagination.swiper-pagination-bullets {
    gap: 3px !important;
}

.custom-pagination .swiper-pagination-bullet {
    position: relative;
    width: 8px;
    height: 8px;
    background-color: color-mix(in srgb, var(--acc-4) 100%, rgba(255, 255, 255, 0));
    opacity: 0.7;
}

.custom-pagination .swiper-pagination-bullet-active {
    opacity: 1;
    background-color: var(--acc-4);
}

.custom-pagination .swiper-pagination-bullet-active::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    border: .5px solid var(--acc-4);
    border-radius: 100vh;
    transform: scale(2);
}

.hero-section-content p,
.hero-section-content h1,
.hero-section-content h3 {
    opacity: 0;
    transform: translateY(var(--pos));
}

.hero-btn {
    opacity: 0;
    transform: translateY(var(--pos));
}

.swiper-slide.swiper-slide-active .hero-btn {
    animation: HeroAnimate .6s var(--d) forwards;
}

.swiper-slide.swiper-slide-active .hero-section-content p,
.swiper-slide.swiper-slide-active .hero-section-content h1,
.swiper-slide.swiper-slide-active .hero-section-content h3 {
    animation: HeroAnimate .6s var(--d) forwards;
}

@keyframes HeroAnimate {
    0% {
        opacity: 0;
        transform: translateY(var(--pos));
    }

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



/* hero sectio swiper end */

/* header menu start */


@media (min-width: 1028px) {
    .nav-link-pc::after {
        content: "";
        position: absolute;
        width: 8px;
        height: 8px;
        background-color: var(--t-c-d);
        mask-image: url(../new-images/icons/ar-d.svg);
        mask-position: center;
        mask-repeat: no-repeat;
        mask-size: contain;
        left: 100%;
        top: 50%;
        transform: translate(70%, -50%);

    }

    .drop-down-wrapper .nav-link-pc::after {
        left: 0%;
        top: 50%;
        background-color: var(--p-c);
        transform: translate(-150%, -60%) rotate(-90deg);

    }

    .nav-link-pc::before {
        content: "";
        position: absolute;
        height: 2px;
        background-color: var(--p-c);
        bottom: -2px;
        left: 0;
        width: 100%;
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 0.3s linear, transform-origin 0s linear;
    }

    .nav-link-pc:hover::before {
        transform: scaleX(1);
        transform-origin: left;
    }

    .nav-link-pc:not(:hover)::before {
        transform: scaleX(0);
        transform-origin: right;
    }

    .nav-link-pc.active::before {
        transform: scaleX(1);
        transform-origin: left;
    }

    /* drop down start */
    .drop-down-wrapper {
        width: max-content;
        background-color: var(--bg-w);
        top: 100%;
        left: 50%;
        transform: translate(-50%, 50%);
        transition: .4s;
        opacity: 0;
        pointer-events: none;
        z-index: 9;
    }

    .drop-down-parent:hover .drop-down-wrapper {
        transform: translate(-50%, 0%);
        opacity: 1;
        pointer-events: all;

    }

    /* drop down end */
}

@media (max-width: 1028px) {
    .swiper-slide.swiper-slide-active .slider-group-image {
        width: 80% !important;
        aspect-ratio: 1 !important;
        transform: translateY(9px) scale(1);
        background-image: url(../new-images/banner/doc/f-5.png), url(../new-images/banner/doc/f-4.png), url(../new-images/banner/doc/f-3.png), url(../new-images/banner/doc/f-2.png), url(../new-images/banner/doc/f-1.png);
    }

    .drop-down-wrapper .nav-link-pc {
        transform: translateX(15px);

    }

    .drop-down-wrapper .nav-link-pc::after {
        content: "";
        position: absolute;
        width: 10px;
        height: 10px;
        background-color: var(--t-c-d);
        mask-image: url(../new-images/icons/ar-d.svg);
        mask-position: center;
        mask-repeat: no-repeat;
        mask-size: contain;
        left: 0;
        top: 50%;
        transform: translate(-150%, -50%) rotate(-90deg);

    }

    .mobile-menu {
        height: 100vh;
        width: 90%;
        background-color: white;
        z-index: 99999999;
        top: 0;
        right: -100%;
        transition: .4s;
    }

    .mobile-menu.isOpen {
        right: 0;
    }

    .mobile-menu-child {
        overflow-y: auto;
        scrollbar-width: none;
    }

    .close-btn-mob {
        position: absolute;
        top: 10px;
        right: 10px;
    }

}

@media (max-width: 768px) {
    .swiper-slide.swiper-slide-active .slider-group-image {
        width: 100% !important;
        aspect-ratio: 1 !important;
        transform: translateY(9px) scale(1);
        background-image: url(../new-images/banner/doc/f-5.png), url(../new-images/banner/doc/f-4.png), url(../new-images/banner/doc/f-3.png), url(../new-images/banner/doc/f-2.png), url(../new-images/banner/doc/f-1.png);
    }
}

/* header menu end */

/* courses start */
.courses-sec:hover img,
.blogs-sec:hover img {
    transform: scale(1.15);

}

/* courses end */

/* top rankers start */
.top-badge {
    top: 0;
    left: 6%;
    mask-image: url(../new-images/icons/shape-1.svg);
    mask-position: center top;
    mask-size: contain;
    mask-repeat: no-repeat;
}

.side-badge {
    top: 0;
    left: 6%;
    mask-image: url(../new-images/icons/shape-1.svg);
    mask-position: center;
    mask-size: contain;
    mask-repeat: no-repeat;
}

/* top rankers end */

/* rankerVideo start */
.rankersVideoSwiper,
.blogSwiper {
    padding-block: 30px !important;
    padding-inline: 20px !important;
}

.rankers-wrapper::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    z-index: 8;
}

@media (max-width:575px) {
    .rankersVideoSwiper {
        padding-block: 10px !important;
        padding-inline: 10px !important;
    }

    .custom-pagination.swiper-pagination-bullets {
        gap: 2px !important;
    }

    .custom-pagination .swiper-pagination-bullet {
        width: 7px;
        height: 7px;
    }

    .hero-section-bg {
        background-position: 38% top;
    }
}

/* rankerVideo end */

/* footer start */
.footer-sec {
    background-image: linear-gradient(to right, #0e337cf9, #0e337cf9), url(../new-images/footer/footer.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.fh-text::after {
    position: absolute;
    content: "";
    width: 40px;
    height: 10px;
    background-image: url(../new-images/icons/wave.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    left: 0;
    top: 100%;
}

.fl-text::after {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    mask-image: url(../new-images/icons/ar-d.svg);
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
    left: 0%;
    top: 50%;
    background-color: var(--s-c);
    transform: translate(-150%, -60%) rotate(-90deg);
}

.news-letter-sec {
    top: 0;
    left: 0;
    transform: translateY(-50%);
    background-image: url(../new-images/footer/f-1.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* footer end */