:root {
    --Lexend: "Lexend", sans-serif;
    --Hind: "Hind", sans-serif;
    --night: #111111;
    --mid-night: #808080;
    --green: #55CD6C;
    --Vanila-Light: #F9F5E6;
    --Gamboge: #ED8322;
    --cta: #BA0001;
    --white: #ffffff;
    --grey: #BBBBBB;
    --disable-grey: #AFAFAF;
    --border-color: #EFEFEF;
    --fs-18: 16px;
    --fs-16: 14px;
    --fs-14: 12px;
    --border-radius-10: 10px;
    --shadow: 0px 3px 16px 0px #EBEBEB;
}

@media (min-width:768px) {
    :root {
        --fs-18: 18px;
        --fs-16: 16px;
        --fs-14: 14px;
    }
}

h1 {
    font-size: 28px;
    font-weight: 700;
    color: var(--night);
    font-family: var(--Lexend);
}

h2 {
    font-size: 24px;
    font-family: var(--Lexend);
}

h3,
.h3 {
    font-size: 20px;
    font-family: var(--Lexend);
}

h4 {
    font-size: 16px;
    font-family: var(--Lexend);
}

p,
span,
strong,
li {
    font-size: 14px;
}

a,
button {
    font-size: 12px;
}

.py-72 {
    padding: 36px 0;
}

@media (min-width:768px) {
    h1 {
        font-size: 36px;
    }

    h2 {
        font-size: 28px;
    }

    h3,
    .h3 {
        font-size: 24px;
    }

    h3 {
        font-size: 18px;
    }

    p,
    span,
    strong,
    li {
        font-size: 16px;
    }

    a,
    button {
        font-size: 14px;
    }

    .py-72 {
        padding: 72px 0;
    }
}

.cta-button {
    padding: 12px 24px;
    background: var(--cta);
    color: var(--white);
    text-decoration: none;
    border-radius: 10px;
    display: inline-block;
    text-transform: uppercase;
    font-size: var(--fs-14);
    font-weight: 700;
    font-family: var(--Hind);
    text-align: center;
    border: 1px solid var(--cta);
}

.cta-button:hover {
    color: var(--cta);
    background: var(--white);
}

.navbar {
    background: var(--white);
    border-bottom: 1px solid var(--border-color);
}

.navbar .nav-item .nav-link {
    font-size: var(--fs-16);
    color: var(--mid-night);
    font-weight: 400;
    font-family: var(--Hind);
}

.banner-section {
    /* padding: 72px 0; */
    padding-top: 36px;
    background: var(--Vanila-Light);
    /* height: 456px; */
}
/* .banner-section .col{
    background-image: url('../img/banner.png');
    background-repeat: no-repeat;
} */

.banner-section h1 span {
    font-size: 28px;
    font-weight: 700;
    color: var(--Gamboge);
}

@media (min-width:768px) {
    .banner-section h1 span {
        font-size: 34px;
    }
}

.course-section .sub-heading {
    font-size: var(--fs-16);
    color: var(--mid-night);
    font-weight: 700;
    font-family: var(--Hind);
    text-transform: uppercase;
}

.course-section .heading,
.course-section .heading span {
    font-size: 24px;
    color: var(--night);
    font-weight: 700;
    font-family: var(--Gamboge);
}

.course-section .heading span {
    color: var(--Gamboge);
}

.course-section .course-card {
    border: 1px solid var(--border-color);
    border-radius: 15px;
}

.course-section .course-card .h3 {
    font-size: 18px !important;
    font-family: var(--Hind);
    font-weight: 700;
    color: var(--night);
    margin: 0;
}

.course-section .course-card ul li {
    list-style-position: inside;
    color: var(--mid-night);
    font-size: var(--fs-14);
}

.domains-section .sub-heading {
    font-size: var(--fs-16);
    color: var(--mid-night);
    font-weight: 700;
    font-family: var(--Hind);
    text-transform: uppercase;
}

.domains-section .heading,
.domains-section .heading span {
    font-size: 24px;
    color: var(--night);
    font-weight: 700;
    font-family: var(--Gamboge);
}

.domains-section .heading span {
    color: var(--Gamboge);
}

.domains-section .domains-card {
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-10);
    color: var(--mid-night);
    font-weight: 500;
    font-family: var(--Hind);
    transition: .1s ease-in;
}

.domains-section .domains-card:hover {
    border: 1px solid var(--Gamboge);
    color: var(--Gamboge);
}

.talk-to-us .sub-heading {
    font-size: var(--fs-16);
    color: var(--mid-night);
    font-weight: 700;
    font-family: var(--Hind);
    text-transform: uppercase;
}

.talk-to-us .heading,
.talk-to-us .heading span {
    font-size: 24px;
    color: var(--night);
    font-weight: 700;
    font-family: var(--Gamboge);
}

.talk-to-us .heading span {
    color: var(--Gamboge);
}

.talk-to-us p {
    font-size: var(--fs-16);
    color: var(--night);
    font-family: var(--Hind);
    margin: 0;
}

.talk-to-us .cta-button-two {
    background: var(--green);
    border: 1px solid var(--green);
}

.talk-to-us .cta-button-two:hover {
    background: var(--white);
    color: var(--green);
}

.blog-section .sub-heading {
    font-size: var(--fs-16);
    color: var(--mid-night);
    font-weight: 700;
    font-family: var(--Hind);
    text-transform: uppercase;
}

.blog-section .heading,
.blog-section .heading span {
    font-size: 24px;
    color: var(--night);
    font-weight: 700;
    font-family: var(--Gamboge);
}

.blog-section .heading span {
    color: var(--Gamboge);
}

.blog-section .blog-card {
    border: 1px solid var(--border-color);
    border-radius: 15px;
}

.blog-section .blog-card .h3 {
    font-size: var(--fs-18) !important;
    font-family: var(--Hind);
    font-weight: 700;
    color: var(--night);
    margin: 0;
}

.blog-section .blog-card .views {
    color: var(--mid-night);
    font-size: var(--fs-14);
    padding: 4px 12px;
    background: var(--border-color);
    border-radius: var(--border-radius-10);
}


.testimonial-section .sub-heading {
    font-size: var(--fs-16);
    color: var(--mid-night);
    font-weight: 700;
    font-family: var(--Hind);
    text-transform: uppercase;
}

.testimonial-section .heading,
.testimonial-section .heading span {
    font-size: 24px;
    color: var(--night);
    font-weight: 700;
    font-family: var(--Gamboge);
}

.testimonial-section .heading span {
    color: var(--Gamboge);
}

.testimonial-section .testimonial-card {
    border: 1px solid var(--border-color);
    border-radius: 15px;
    font-family: var(--Hind);
}

.testimonial-section .testimonial-card:hover {
    box-shadow: var(--shadow);
}

.testimonial-section .testimonial-card img {
    width: 72px;
    height: 72px;
    border-radius: 72px;
    display: block;
    margin: auto;
    object-fit: cover;
    object-position: top;
}

.testimonial-section .testimonial-card .h3 {
    font-size: var(--fs-18) !important;
    font-weight: 700;
    color: var(--night);
    margin: 0;
}

.testimonial-section .testimonial-card span {
    color: var(--mid-night);
    font-size: var(--fs-14);
}

.testimonial-section .testimonial-card p {
    color: var(--night);
    font-size: var(--fs-16);
    margin: 0;
}


.faq-section .sub-heading {
    font-size: var(--fs-16);
    color: var(--mid-night);
    font-weight: 700;
    font-family: var(--Hind);
    text-transform: uppercase;
}

.faq-section .heading,
.faq-section .heading span {
    font-size: 24px;
    color: var(--night);
    font-weight: 700;
    font-family: var(--Gamboge);
}

.faq-section .heading span {
    color: var(--Gamboge);
}

.faq-section .faq-item {
    border: 1px solid var(--grey);
    border-radius: var(--border-radius-10);
    font-family: var(--Hind);
    overflow: hidden;
}

.faq-section .faq-title {
    background: var(--border-color);
    font-size: var(--fs-18);
    font-weight: 700;
    color: var(--mid-night);
    padding: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    position: relative;
}

.faq-section .faq-title::after {
    content: '';
    background: url('../img/arrow-circle.png') no-repeat center;
    background-size: contain;
    width: 20px;
    height: 20px;
    transition: transform 0.3s ease;
}

.faq-section .faq-item.active .faq-title::after {
    transform: rotate(180deg);
}

.faq-content {
    transform: scaleY(0);
    transform-origin: top;
    display: block;
    opacity: 0;
    pointer-events: none;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease, padding 0.3s ease;
    padding: 0 16px;
}

.faq-item.active .faq-content {
    transform: scaleY(1);
    opacity: 1;
    max-height: 1000px;
    /* big enough for your largest FAQ */
    padding: 16px;
    pointer-events: auto;
}

footer {
    background: var(--night);
}

footer .footer-col h3 {
    color: var(--white);
}

footer .footer-col p {
    font-size: var(--fs-14);
    color: var(--disable-grey);
    font-family: var(--Hind);
}

footer .footer-col ul {
    padding: 0;
    margin-top: 16px;
}

footer .footer-col ul li {
    list-style: none;
}

footer .footer-col ul li a {
    font-size: var(--fs-14);
    font-weight: 400;
    color: var(--disable-grey);
    font-family: var(--Hind);
    text-decoration: none;
}

footer .footer-col-three ul {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

footer .footer-col-three ul li::after {
    content: '|';
    color: var(--disable-grey);
    font-size: var(--fs-14);
    margin-left: 8px;
}

footer .footer-col-three ul li:last-child::after {
    content: '';
}

.form-control{
    border: 1px solid var(--grey);
    background: var(--border-color);
    color: var(--mid-night);
    padding: 8px;
    font-size: var(--fs-16);
    font-weight: 500;
}
.form-control:focus{
    box-shadow: none;
    background: var(--white);
    border: 1px solid var(--grey);
}
.swiper-button-next,
.swiper-button-prev {
    width: 35px !important;
    height: 35px !important;
    border-radius: 35px !important;
    overflow: hidden;
    background: var(--cta);
    box-shadow: var(--shadow);
}

@media (max-width:768px) {

    .swiper-button-next,
    .swiper-button-prev{
        display: none!important;
    }
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-size: var(--fs-16) !important;
    color: var(--white) !important;
    font-weight: 600;
}