/* =========================================
   GLOBAL SMOOTH SCROLL
========================================= */
html {
  scroll-behavior: smooth;
}

html, body {
    overflow-x: hidden;
}

/* ===== ANIMATIONS ===== */
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(94px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeDown {
    from {
        opacity: 0;
        transform: translate3d(0, -12vh, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeLeft {
    from {
        opacity: 0;
        transform: translate3d(-12vw, 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeRight {
    from {
        opacity: 0;
        transform: translate3d(15vw, 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

.form-text {
    opacity: 0;
}
.degrees-section {
    opacity: 0;
}

.degrees-section.in-view {
    animation: fadeUp 1.6s ease forwards;
}


/* Activated on scroll */
.form-text.in-view {
    animation: fadeLeft 1.6s ease forwards;
}

.form-card {
    opacity: 0;
}
.form-card.in-view {
    animation: fadeRight 1.6s ease forwards;
}
.faq-title {
    opacity: 0;
}
.faq-title.in-view {
    animation: fadeUp 1.6s ease forwards;
}
.why-header {
    opacity: 0;
}
.why-header.in-view {
    animation: fadeLeft 1.6s ease forwards;
}

.why-card {
    opacity: 0;
}
.why-card.in-view {
    animation: fadeRight 1.6s ease forwards;
}
.cta-header {
    opacity: 0;
}
.cta-header.in-view {
       animation: fadeLeft 1.6s ease forwards;
}
.branches-header {
    opacity: 0;
}
.branches-header.in-view {
       animation: fadeDown 1.6s ease forwards;
}
.spec-header {
    opacity: 0;
}
.spec-header.in-view {
    animation: fadeLeft 1.6s ease forwards;
}
.accred-title {
    opacity: 0;
}
.accred-title.in-view {
    animation: fadeLeft 1.6s ease forwards;
}
.section-title{
    opacity: 0;
}
.section-title.in-view {
    animation: fadeDown 1.6s ease forwards;
}
.testimonial-card {
    opacity: 0;
}
.testimonial-card.left.in-view {
    animation: fadeLeft 1.6s ease forwards;
}
.testimonial-card.right.in-view {
    animation: fadeRight 1.6s ease forwards;
}


.mba-section {
    opacity: 0;
}
.mba-section.in-view {
    animation: fadeUp 1.6s ease forwards;
}
.istec-watermark-section {
    opacity: 0;
}
.istec-watermark-section.in-view {
    animation: fadeDown 1.6s ease forwards;
}
@keyframes fadeFromRight {
    from {
        opacity: 0;
        transform: translate3d(12vw, 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeFromLeft {
    from {
        opacity: 0;
        transform: translate3d(-12vw, 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}
.spec-accordion > .spec-item  {
    opacity: 0;
}
/* ODD → from RIGHT */
.spec-accordion > .spec-item:nth-child(odd).in-view {
    animation: fadeFromRight 1.4s cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* EVEN → from LEFT */
.spec-accordion > .spec-item:nth-child(even).in-view {
    animation: fadeFromLeft 1.4s cubic-bezier(0.22, 1, 0.36, 1) both;
}


.bnr-call {
    background: #212121;
    position: absolute;
    left: 0;
    z-index: 111;
    padding: 10px 20px;
    animation: bounce 2s infinite;
    -webkit-animation: bounce 4s infinite;
    -moz-animation: bounce 4s infinite;
    -o-animation: bounce 4s infinite;
    cursor: pointer;
    display: none;
}

.bnr-call i {
    font-size: 30px;
    color: #fff
}

.bnr-whatsapp {
    background: #25D366;
    position: absolute;
    right: 0;
    top:50px;
    z-index: 111;
    cursor: pointer;
    padding: 10px 20px;
    animation: bounce 4s infinite;
    -webkit-animation: bounce 4s infinite;
    -moz-animation: bounce 4s infinite;
    -o-animation: bounce 4s infinite
}

.bnr-whatsapp i {
    font-size: 30px;
    color: #fff
}
.fixme {
    width: 100%;
    z-index: 111;
    position: fixed;
    top: 150px;
    left: 0px;
}

@media (max-width: 767px) {
    .bnr-call {
        padding: 10px 8px;
        background: rgba(33,33,33,.8);
        display: block;
    }

    .bnr-call i {
        font-size: 23px
    }

    .bnr-whatsapp {
        padding: 10px 10px;
        
        left: 0;
        margin-top: 10px;
        right: inherit
    }

    .bnr-whatsapp i {
        font-size: 23px
    }
}








