h2 {
    font-family: montserrat, "Gill Sans", sans-serif;
    font-weight: 400;
}
/* ============================================ */
/* =======           UTILITY            ======= */
/* ============================================ */
.remove {
    display: none;
}
.hide {
    opacity: 0;
}
.rotate {
    transform: rotate(180deg);
}
.scale-0 {
    transform: scale(0);
}
.translateDown-5 {
    transform: translateY(5%);
}
.translateDown-8 {
    transform: translateY(8%);
}
.translateDown-12 {
    transform: translateY(12%);
}

/* ============================================ */
/* =======          COMPONENTS          ======= */
/* ============================================ */

.dark_card {
    background-color: var(--dark-shade);
    color: var(--text-color);
    border-radius: 8px;
    padding: 24px 16px;
}
.light_card {
    background-color: var(--light-color);
    color: var(--dark-color);
    border-radius: 8px;
    padding: 16px 24px;
}

.glass_card {
    background-color: rgba(178, 91, 16, 0.464);
    backdrop-filter: blur(8px);
    border-radius: 12px;
    box-shadow: 1px 5px 10px 8px #00000057;
    border: 1px solid rgba(215, 16, 16, 0.187);
    padding: 16px 8px;
}
/* =====================INDEX.HTML=============== */

.aboutUSwrapper {
    background-color: var(--dark-color);
    border: 1px solid var(--dark-color);
    transform: translateY(-1px);
    width: 100%;
}
.aboutUs {
    color: var(--text-color);
    padding: var(--section-pedding);
    margin: 0px;
    overflow: hidden;
    box-sizing: border-box;
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
}
.aboutUs .sec--seprator {
    width: 75%;
    display: block;
    margin: 0 auto;
    height: 45px;
}
.aboutUs__label {
    font-size: var(--section-label-size);
    text-transform: capitalize;
    text-align: center;
    margin-top: 8px;
}
.aboutUs__heading {
    margin-top: 24px;
    text-align: center;
    font-size: 2rem;
    letter-spacing: 1px;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    transition: opacity 0.3s ease-out;
}
.aboutUs__collapseButton_text_wrapper {
    /* border-top: 1px solid var(--text-color); */
    border-bottom: 1px solid var(--text-color);
    transition: opacity 0.3s 0.2s ease-out;
    /* background-color: #b0050f; */
    margin-top: 18px;
}
.aboutUs__explainGrid {
    display: grid;
    grid-template-rows: 0fr;
    overflow: hidden;
    transition: grid-template-rows 0.6s ease-out;
}
.aboutUs__grid_item {
    min-height: 0px;
    max-width: 90%;
    margin: auto;
}
.aboutUs__collapse_button {
    font-family: montserrat, "Gill Sans", sans-serif;
    font-weight: 400;
    text-transform: capitalize;
    font-size: 1.4rem;
    /* margin-top: 24px; */
    /* padding: 12px; */
    padding-bottom: 6px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.aboutUs__collapse_button span {
    transition: opacity 0.2s ease-out;
}
.aboutUs__collapse_button_svg {
    width: 15px;
    margin-right: 2px;
    display: block;
    height: auto;
    object-fit: contain;
}
.aboutUs_collapse_button--pressed {
    grid-template-rows: 1fr;
}
.aboutUs__card_wrapper {
    margin-top: 32px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    text-align: center;
}
.aboutUs .aboutUS__card1 {
    transition:
        opacity 0.4s 0.2s ease-out,
        transform 0.5s 0.3s ease-out;
}
.aboutUs .aboutUS__card2 {
    transition:
        opacity 0.4s 0.4s ease-out,
        transform 0.5s 0.6s ease-out;
}
.aboutUs .aboutUS__card3 {
    transition:
        opacity 0.4s 0.8s ease-out,
        transform 0.5s 0.9s ease-out;
}

.heading_svg_wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
}
.aboutUs__cardImage {
    width: 40px;

    overflow: hidden;
    /* display: none; */
}
.aboutUs__cardImage img {
    width: 100%;
    /* height: auto; */
    object-fit: cover;
    display: block;
    margin-top: 5px;
}
.aboutUs__cardHeading {
    font-size: 1.6rem;
    margin-bottom: 5px;
    margin-top: 12px;
    padding: 0px;
    /* line-height: 12px; */
}
.aboutUs__cardExp {
    font-size: 1.4rem;
    margin-top: 0px;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 8px;
}
.aboutUs__directionImage {
    height: 30px;
}

.services {
    width: 100%;
    overflow: hidden;
    /* aspect-ratio: 9/16; */
    height: 900px;
    background-image: url(/images/campus2.png);
    background-repeat: no-repeat;
    background-size: cover;
    border: none;
    box-sizing: border-box;
    transform: translateY(-2px);
    padding: var(--section-pedding);
}
/* .spacer {
    width: 100%;
    height: 25px;

    background-color: var(--dark-color);
    transform: translateY(-1px);

    position: relative;
    z-index: 100;
} */
.services__glass {
    max-width: 528px;
    width: 100%;
    height: 92%;
    background-color: rgba(255, 255, 255, 0.092);
    margin: 50px auto;
    backdrop-filter: blur(2px);
    border-left: 1px solid rgba(255, 255, 255, 0.451);
    border-top: 1px solid rgba(255, 255, 255, 0.451);
    border-radius: 20px;
    box-shadow: -1px 14px 6px 6px #00000057;
    color: var(--text-color);
    display: flex;
    flex-direction: column;
}
.services__intro {
    /* background-color: rgba(178, 91, 16, 0.464); */
    /* backdrop-filter: blur(8px); */
    /* border-radius: 12px; */
    width: 90%;
    padding: 16px 8px;
    text-align: center;
    /* box-shadow: 1px 5px 10px 8px #00000057;
    border: 1px solid rgba(215, 16, 16, 0.187); */
    margin: 16px;
    margin-top: 32px;
    h1 {
        font-size: 2rem;
    }
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}
.services__cta {
    color: var(--text-color);
    border-radius: 20px;
    /* border: 1px solid linear-gradient(135deg,  #ff6b6b); */
    border: 1px solid #ffb32f;
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: fit-content;
    /* margin-top: 40px; */
    /* box-shadow: 1px 5px 10px 8px #00000057; */
    background: linear-gradient(135deg, #ffad3ba7, #fa561f86);
    padding: 12px 24px;
    box-shadow: 0 8px 22px rgba(58, 34, 12, 0.804);
    margin-top: auto;
    margin-bottom: 32px;

    /* background: linear-gradient(135deg, #ff3b3b4d, #ff6b6b47); */
}
.services__card_wrapper {
    width: 100%;
    display: flex;
    overflow-x: auto;
    /* background-color: aqua; */
    padding: 24px 16px;
    scroll-padding-inline: 16px;
    overscroll-behavior-inline: contain;
    /* scroll-snap-type: inline mandatory; */
    scroll-snap-type: inline mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
    margin-top: 40px;
    /* gap: 16px;  */
}
.services__card_wrapper::-webkit-scrollbar {
    display: none;
}

.services__mainCards {
    flex: 0 0 87%;
    margin-right: 16px;
    padding: 24px 8px 24px 24px;
    scroll-snap-align: center;
    max-width: 400px;
}
.services__svg {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 1px solid #ffb32f;
}
.services__svg img {
    width: 80%;
    height: auto;
    margin: auto;
    display: block;
    margin-top: 10px;
}
.services__cardHeading {
    font-size: 1.8rem;
    margin-top: 56px;
}
.destinations {
    transform: translateY(-3px);
    background-color: var(--dark-color);
    padding: var(--section-pedding);
    color: var(--text-color);
    text-align: center;
}
.destinations__cardWrapper {
    display: flex;
    overflow-x: auto;
    gap: 16px;
    overscroll-behavior-inline: contain;
    /* scroll-snap-type: inline mandatory; */
    scroll-snap-type: inline mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
    margin-top: 150px;
}
.destinations__card {
    flex: 0 0 87%;
    border-radius: 12px;
    /* padding: 16px; */
    position: relative;
    overflow: hidden;
    height: 420px;
    z-index: -2;
    scroll-snap-align: center;
    max-width: 400px;
}
.destination__backgroundImage {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
}
.destination__backgroundImage img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.destinations__heading_text_wrapper {
    padding: 16px;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
}
.flag_name_wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    /* color: var(--dark-color); */
    gap: 12px;
    color: var(--dark-color);
}
.flag_img {
    width: 80px;
    height: 40px;
}
.destinations__country_intro {
    text-align: start;
    margin-bottom: 50px;
    width: 80%;
    margin-left: 16px;
}
.destinations__Europe .flag_name_wrapper {
    text-align: center;
    h1 {
        width: 100%;
    }
}
.destinations__World .flag_name_wrapper {
    text-align: center;
    background-color: #e30615ed;
    transform: translateY(-30%);
    border-radius: 24px;
    h1 {
        width: 100%;
        /* color: var(--primary-color); */
        color: var(--text-color);
    }
}
.consultation {
    position: relative;
    padding: 80px 16px;
    background: url("/images/takeoff.png") center/cover no-repeat;
    text-align: center;
    width: 100%;
    aspect-ratio: 9/16.2;
    min-height: 700px;
    overflow: hidden;
    color: var(--text-color);
    max-height: 800px;
}

.consult-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(rgba(0, 0, 0, 0.053), rgba(0, 0, 0, 0.322));
}

.consult-container {
    position: relative;
    max-width: 420px;
    margin: auto;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 100%;
}

.consult-title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 10px;
}

.consult-sub {
    font-size: 14px;
    opacity: 0.85;
    margin-bottom: 22px;
}

/* Glass Form */

.consult-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 22px;
    border-radius: 18px;
    backdrop-filter: blur(2px);
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.consult-form input,
.consult-form select,
.consult-form textarea {
    color: rgb(115, 110, 110);

    padding: 12px 14px;
    border-radius: 10px;
    /* border: none; */
    border: 1px solid rgba(255, 255, 255, 0.771);
    outline: none;
    font-size: 14px;
    background-color: rgba(255, 255, 255, 0.519);
}

.consult-form textarea {
    min-height: 80px;
    resize: none;
}

.consult-form button {
    background: #e30613;
    color: #fff;
    padding: 13px;
    border-radius: 12px;
    border: none;
    font-weight: 600;
    cursor: pointer;
}

.consult-form button:hover {
    background: #b0050f;
}

/* WhatsApp CTA */

.whatsapp-cta {
    display: inline-block;
    margin-top: 16px;
    padding: 12px 18px;
    border-radius: 12px;
    background: #25d366;
    color: #fff;
    font-size: 14px;
    text-decoration: none;
}
.footer {
    background-color: var(--dark-color);
    padding: var(--section-pedding);
    color: var(--text-color);
    margin-top: 3px;
    text-align: center;
}
.achievements__heading,
.contactUs__heading {
    font-size: 2.4rem;
    margin-bottom: 30px;
    margin-top: 80px;
}
.achievements .dark_card {
    width: 76%;
    margin: auto;
    margin-bottom: 32px;
    position: relative;
    max-width: 350px;
}
.achievements .dark_card h1 {
    margin-top: 8px;
    margin-bottom: 8px;
}
.achievements__progressbar {
    width: 100%;
    height: 3px;
    background-image: linear-gradient(
        to right,
        var(--primary-color),
        var(--dark-shade)
    );
    position: absolute;
    bottom: 0px;
    left: 0px;
}
.contactUs .dark_card {
    margin: auto;
    margin-bottom: 24px;
    width: 90%;
    display: flex;
    gap: 16px;
    align-items: flex-start;
    text-align: start;
    max-width: 400px;
}
.contactUs__svg {
    width: 40px;
    height: 40px;
}
.contactUs__svg img {
    width: 100%;
    height: auto;
}
.contactUs .dark_card h2 {
    margin-top: 0px;
}
/* ============================================ */
/* =======          MODIFIERS          ======== */
/* ============================================ */

.services__introCard--spin {
    animation: spin 0.4s 0.2s linear forwards;
}

@keyframes spin {
    from {
        transform: rotateY(0deg);
        opacity: 0;
    }
    to {
        transform: rotateY(720deg);
        opacity: 1;
    }
}

@media (min-width: 560px) {
    .destinations__intro {
        max-width: 480px;
        margin-left: auto;
        margin-right: auto;
    }
    .destinations__cardWrapper {
        max-width: 524px;
        margin-left: auto;
        margin-right: auto;
        background-color: var(--dark-shade);
        position: relative;
        z-index: -1;
        padding: 24px 16px;
        border-radius: 30px;
    }
}
@media (min-width: 890px) {
    .hero {
        aspect-ratio: 16/9;
    }
    .hero__image_container {
        aspect-ratio: 16/9;
        transition: transform 0.2s ease-out;
    }
    .hero__image_container img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}