.nw-clr {
    color: #3682bf !important;
}

.sb-clr {
    color: #da1c33 !important;
}


a {
    text-decoration: none;
}


body {
    font-family: popins, sans-serif !important;
}

p {
    font-family: popins, sans-serif !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: popins, sans-serif !important;
}


/* =============================================
MAIN HEADER SECTION START
================================================ */
/*========================
    HEADER
========================*/

.rs-header {
    position: relative;
    z-index: 9999;
    font-family: 'Poppins', sans-serif;
}

/*========================
    TOP BAR
========================*/

.rs-topbar {
    background: #d79a06;
    padding: 10px 0;
}

.rs-topbar-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.rs-top-left {
    color: #fff;
    font-size: 14px;
    font-weight: 500;
}

.rs-top-right {
    display: flex;
    align-items: center;
    gap: 10px;
}

.rs-top-right a {
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
}

.rs-top-right span {
    color: #fff;
}

.rs-social {
    display: flex;
    gap: 8px;
    margin-left: 10px;
}

.rs-social a {
    width: 28px;
    height: 28px;
    background: #003b8f;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    transition: .3s;
}

.rs-social a:hover {
    transform: translateY(-3px);
}

/*========================
    NAVBAR
========================*/

.rs-navbar {
    background: #fff;
    box-shadow: 0 2px 15px rgba(0, 0, 0, .08);
}

.rs-navbar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 90px;
}

.rs-logo img {
    max-height: 70px;
    width: auto;
}

/*========================
    MENU
========================*/

.rs-nav ul {
    display: flex;
    align-items: center;
    gap: 15px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.rs-nav ul li a {
    text-decoration: none;
    color: #15346a;
    font-size: 16px;
    font-weight: 600;
    position: relative;
    transition: .3s;
    cursor: pointer;
}

.rs-nav ul li a:hover,
.rs-nav ul li a.active {
    color: #15346a;
}

.rs-nav ul li a.active::after {
    content: "";
    position: absolute;
    bottom: -12px;
    left: 0;
    width: 100%;
    height: 3px;
    background: #d79a06;
    border-radius: 30px;
}

/*========================
    BUTTON
========================*/

.rs-enquire-btn {
    background: #003b8f;
    color: #fff;
    text-decoration: none;
    padding: 14px 30px;
    border-radius: 40px;
    font-size: 15px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    transition: .3s;
}

.rs-enquire-btn:hover {
    color: #fff;
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0, 59, 143, .30);
}

/*========================
    MOBILE
========================*/

.rs-toggle {
    display: none;
}

@media(max-width:991px) {

    .rs-topbar-inner {
        justify-content: center;
        text-align: center;
        gap: 10px;
    }

    .rs-navbar-inner {
        min-height: 80px;
    }

    .rs-nav {
        display: none;
    }

    .rs-btn-wrap {
        display: none;
    }

    .rs-toggle {
        display: block;
        border: none;
        background: none;
    }

    .rs-toggle span {
        display: block;
        width: 25px;
        height: 3px;
        background: #15346a;
        margin: 5px 0;
        border-radius: 20px;
    }

    .rs-logo img {
        max-height: 55px;
    }
}

/* ==================================
NAV HOVER LINE 
============================= */
.rs-nav ul li a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -12px;
    width: 100%;
    height: 3px;
    background: #d79a06;
    border-radius: 30px;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .4s ease;
}

.rs-nav ul li a:hover::after,
.rs-nav ul li a.active::after {
    transform: scaleX(1);
}

/* ==========================================
   ABOUT DROPDOWN
========================================== */

.rs-about-item {
    position: relative;
}

.rs-about-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.rs-about-icon {
    font-size: 11px;
    transition: transform .3s ease;
}


/* Dropdown */

.rs-about-dropdown {
    position: absolute !important;

    top: calc(100% + 18px);
    left: 0;

    min-width: 235px;

    display: block !important;

    padding: 8px 0 !important;
    margin: 0 !important;

    background: #fff;

    border-top: 3px solid #d79a06;

    box-shadow: 0 10px 30px rgba(0, 0, 0, .15);

    opacity: 0;
    visibility: hidden;

    transform: translateY(10px);

    transition: all .3s ease;

    z-index: 99999;
}


/* Dropdown items */

.rs-about-dropdown li {
    display: block !important;

    width: 100%;

    margin: 0 !important;
    padding: 0 !important;
}


/* Dropdown links */

.rs-about-dropdown li a {
    display: block !important;

    width: 100%;

    padding: 12px 20px !important;

    color: #15346a !important;

    font-size: 14px !important;

    font-weight: 500 !important;

    text-decoration: none;

    white-space: nowrap;

    transition: all .3s ease;
}


/* Remove main menu hover line from dropdown */

.rs-about-dropdown li a::after {
    display: none !important;
}


/* Dropdown hover */

.rs-about-dropdown li a:hover {
    color: #fff !important;

    background: #003b8f;
}


/* Open Dropdown */

.rs-about-item.rs-dropdown-open>.rs-about-dropdown {
    opacity: 1;

    visibility: visible;

    transform: translateY(0);
}


/* Arrow rotate */

.rs-about-item.rs-dropdown-open .rs-about-icon {
    transform: rotate(180deg);
}


/* ==========================================
   TOP BAR RESPONSIVE
========================================== */

@media (max-width: 991px) {

    .rs-topbar {
        padding: 8px 15px;
    }

    .rs-topbar-inner {
        width: 100%;
    }

    .rs-top-left {
        width: 100%;

        font-size: 12px;

        text-align: center;
    }

    .rs-top-right {
        width: 100%;

        justify-content: center;

        flex-wrap: wrap;

        gap: 7px;

        font-size: 12px;
    }

    .rs-top-right a {
        font-size: 12px;
    }

    .rs-social {
        margin-left: 5px;
    }

}


/* ==========================================
   MOBILE HEADER
========================================== */
/* ==========================================
   MOBILE NAVBAR
========================================== */

@media (max-width: 991px) {

    .rs-navbar-inner {
        position: relative;
        min-height: 80px;
    }

    /* Hamburger */
    .rs-toggle {
        display: block;
        border: none;
        background: transparent;
        padding: 5px;
        cursor: pointer;
        z-index: 10001;
    }

    .rs-toggle span {
        display: block;
        width: 27px;
        height: 3px;
        background: #15346a;
        margin: 5px 0;
        border-radius: 20px;
        transition: all .3s ease;
    }

    /* Mobile Nav Open */
    .rs-nav {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: #fff;
        box-shadow: 0 10px 25px rgba(0, 0, 0, .12);
        z-index: 9999;
        padding: 10px 0;
    }

    .rs-nav.rs-mobile-open {
        display: block;
    }

    /* Main Menu */
    .rs-nav>ul {
        display: block;
        width: 100%;
        margin: 0;
        padding: 0;
    }

    .rs-nav>ul>li {
        width: 100%;
        border-bottom: 1px solid #eee;
    }

    .rs-nav>ul>li>a {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        padding: 14px 20px;
        font-size: 15px;
    }

    /* Active line remove on mobile */
    .rs-nav ul li a::after {
        display: none !important;
    }

    /* ==========================================
       ABOUT DROPDOWN MOBILE
    ========================================== */

    .rs-about-dropdown {
        position: static !important;

        display: none !important;

        width: 100%;
        min-width: 100%;

        padding: 0 !important;
        margin: 0 !important;

        background: #f7f9fc;

        border-top: none;
        box-shadow: none;

        opacity: 1;
        visibility: visible;
        transform: none;
    }

    .rs-about-item.rs-dropdown-open>.rs-about-dropdown {
        display: block !important;
    }

    .rs-about-dropdown li {
        width: 100%;
    }

    .rs-about-dropdown li a {
        padding: 12px 35px !important;
        font-size: 14px !important;
    }

    /* About arrow */
    .rs-about-icon {
        transition: transform .3s ease;
    }

    .rs-about-item.rs-dropdown-open .rs-about-icon {
        transform: rotate(180deg);
    }

    /* ==========================================
       HAMBURGER ANIMATION
    ========================================== */

    .rs-toggle.rs-menu-open span:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }

    .rs-toggle.rs-menu-open span:nth-child(2) {
        opacity: 0;
    }

    .rs-toggle.rs-menu-open span:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
    }

}

/* ==========================================
   SMALL MOBILE
========================================== */

@media (max-width: 575px) {

    .rs-topbar {
        padding: 7px 10px;
    }

    .rs-top-left {
        font-size: 11px;
    }

    .rs-top-right {
        gap: 5px;
    }

    .rs-top-right a {
        font-size: 11px;
    }

    .rs-top-right span {
        font-size: 10px;
    }

    .rs-social {
        gap: 5px;
        margin-left: 3px;
    }

    .rs-social a {
        width: 25px;
        height: 25px;
    }


    .rs-navbar-inner {
        min-height: 70px;

        padding: 0 10px;
    }

    .rs-logo img {
        max-height: 50px;
    }

}

/* ==========================================
   ABOUT HOVER DROPDOWN
========================================== */

.rs-about-item {
    position: relative;
}

/* Dropdown hidden */
.rs-about-dropdown {
    position: absolute !important;
    top: calc(100% + 15px);
    left: 0;

    min-width: 235px;

    display: block !important;

    margin: 0 !important;
    padding: 8px 0 !important;

    background: #fff;

    border-top: 3px solid #d79a06;

    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);

    opacity: 0;
    visibility: hidden;

    transform: translateY(10px);

    transition: all 0.3s ease;

    z-index: 99999;
}


/* About hover par dropdown open */
.rs-about-item:hover>.rs-about-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}


/* Dropdown items */
.rs-about-dropdown li {
    display: block !important;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
}


/* Dropdown links */
.rs-about-dropdown li a {
    display: block !important;

    width: 100%;

    padding: 12px 20px !important;

    color: #15346a !important;

    font-size: 14px !important;
    font-weight: 500 !important;

    text-decoration: none;

    white-space: nowrap;

    transition: all 0.3s ease;
}


/* Dropdown ke links par main nav ki line remove */
.rs-about-dropdown li a::after {
    display: none !important;
}


/* Dropdown item hover */
.rs-about-dropdown li a:hover {
    color: #fff !important;
    background: #003b8f;
}


/* About arrow */
.rs-about-icon {
    transition: transform 0.3s ease;
}


/* Hover par arrow rotate */
.rs-about-item:hover .rs-about-icon {
    transform: rotate(180deg);
}


/* ==========================================
   MOBILE
   Hover ki jagah click/JS kaam karega
========================================== */

@media (max-width: 991px) {

    .rs-about-dropdown {
        position: static !important;

        display: none !important;

        opacity: 1;
        visibility: visible;

        transform: none;

        min-width: 100%;

        border-top: none;

        box-shadow: none;

        background: #f7f9fc;
    }

    /* Mobile JS se open */
    .rs-about-item.rs-dropdown-open>.rs-about-dropdown {
        display: block !important;
    }

}

/* =============================================
MAIN HEADER SECTION END
================================================ */

/* =========================================================================
NEW CSS START 9/9/2026
========================================================================= */
/* all h2 sub headings   */
.sub-heading-item {
    color: #004484;
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 15px;
    border-left: 5px solid #f1b038;
    padding-left: 15px;
}

/* ==========================================
HEADER LOGO CSS START 
================================================= */

.header.dark .top-bar {
    background-color: #f1b038;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    color: #dfdfdf;
}

.logo-header img {
    width: 300px !important;
    height: auto !important;

    border-radius: 12px;
    padding: 10px;
    transition: transform 0.4s ease-in-out, box-shadow 0.4s ease-in-out;
}

.logo-header img:hover {
    transform: translateX(8px);

    box-shadow: rgba(5, 75, 132, 0.25) 0px 54px 55px,
        rgba(5, 75, 132, 0.12) 0px -12px 30px,
        rgba(5, 75, 132, 0.12) 0px 4px 6px,
        rgba(5, 75, 132, 0.17) 0px 12px 13px,
        rgba(5, 75, 132, 0.09) 0px -3px 5px;
}

.left-about-logo {

    align-content: center;
}

.site-header {
    width: 100%;
    height: auto;
}

.header.dark,
.header.dark .main-bar {
    background: #004484;

}


/* ===========================
ICONS 
============================= */

.h-contact .service-list li {
    display: flex;
    align-items: center;
    gap: 12px;
}

.h-contact ul li i {
    background-color: #004484;
    border-radius: 50%;
    padding: 2px 8px;
    font-size: 25px;
}

.h-contact .service-list li i {
    flex-shrink: 0;

}

.h-contact .service-list li .title {
    margin: 0;
}

/* ==========================================
HEADER LOGO CSS END
================================================= */


/* =============================================
BREADCRUMB IMG ALL PAGES START
====================================== */


.breadcrumb-banner {
    position: relative;
    width: 100%;
    min-height: 230px;
    background-image: url("../images/banner/new-banner.png") !important;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;

    display: flex;
    align-items: center;

    overflow: hidden;
    margin-bottom: 30px;
}


/* =========================================
   OVERLAY
========================================= */

.breadcrumb-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(90deg,
            rgba(5, 75, 132, 0.95) 0%,
            rgba(5, 75, 132, 0.78) 45%,
            rgba(5, 75, 132, 0.45) 100%);

    z-index: 1;
}


/* =========================================
   CONTAINER
========================================= */

.breadcrumb-container {
    position: relative;
    z-index: 2;

    max-width: 1400px;
    margin: 0 auto;

    padding: 110px 50px;
}


/* =========================================
   CONTENT
========================================= */

.breadcrumb-content {
    max-width: 900px;

    border-left: 4px solid #ffffff;
    padding-left: 22px;

    animation: breadcrumbFade 0.8s ease;
}


/* Small heading */

.breadcrumb-small-title {
    display: block;

    color: rgba(255, 255, 255, 0.85);

    font-size: 13px;
    font-weight: 500;

    text-transform: uppercase;
    letter-spacing: 2px;

    margin-bottom: 7px;
}


/* =========================================
   PAGE TITLE
========================================= */

.page-title {
    margin: 0 0 15px;

    color: #ffffff;

    font-size: 38px;
    line-height: 1.2;

    font-weight: 700;

    letter-spacing: 0.3px;

    text-shadow: 0 3px 10px rgba(0, 0, 0, 0.20);
}


/* =========================================
   BREADCRUMB
========================================= */

.breadcrumb-nav ul {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    list-style: none;

    margin: 0;
    padding: 0;

    gap: 0;
}


/* Individual item */

.breadcrumb-nav ul li {
    display: flex;
    align-items: center;

    color: rgba(255, 255, 255, 0.85);

    font-size: 14px;
    font-weight: 400;
}


/* Links */

.breadcrumb-nav ul li a {
    color: #ffffff;

    text-decoration: none;

    transition:
        color 0.3s ease,
        opacity 0.3s ease;
}


/* Hover */

.breadcrumb-nav ul li a:hover {
    color: #d9efff;
    opacity: 0.85;
}


/* =========================================
   SEPARATOR
========================================= */

.breadcrumb-nav ul li:not(:last-child)::after {
    content: "›";

    display: inline-block;

    margin: 0 12px;

    color: rgba(255, 255, 255, 0.60);

    font-size: 20px;
    font-weight: 300;
}


/* Current page */

#breadcrumb-current {
    color: #dceeff;
    font-weight: 500;
}


/* =========================================
   SUBTLE ANIMATION
========================================= */

@keyframes breadcrumbFade {

    from {
        opacity: 0;
        transform: translateX(-15px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }

}


/* =========================================
   TABLET
========================================= */

@media (max-width: 768px) {

    .breadcrumb-banner {
        min-height: 210px;
    }

    .breadcrumb-container {
        padding: 40px 25px;
    }

    .breadcrumb-content {
        padding-left: 17px;
    }

    .page-title {
        font-size: 30px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 480px) {

    .breadcrumb-banner {
        min-height: 200px;
    }

    .breadcrumb-container {
        padding: 35px 18px;
    }

    .breadcrumb-content {
        border-left-width: 3px;
        padding-left: 14px;
    }

    .breadcrumb-small-title {
        font-size: 11px;
        letter-spacing: 1.5px;
    }

    .page-title {
        font-size: 25px;
        margin-bottom: 12px;
    }

    .breadcrumb-nav ul li {
        font-size: 13px;
    }

    .breadcrumb-nav ul li:not(:last-child)::after {
        margin: 0 7px;
        font-size: 17px;
    }

}


/* =============================================
BREADCRUMB IMG ALL PAGES END
====================================== */

/* ================================================
HOME PAGE MAIN SLIDER CSS START
====================================================== */
.slider {
    width: 100%;
    /* height: 760px; */
    overflow: hidden;
    position: relative;
}

.slides {
    width: 300%;
    /* 200% se 300% */
    height: 100%;
    display: flex;
}

.slides input {
    display: none;
}

.slide {
    width: 33.333%;
    /* 50% se 33.333% */
    transition: 0.8s;
}

.slide img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* Manual navigation */

.navigation-manual {
    position: absolute;
    width: 100%;
    bottom: 20px;
    display: flex;
    justify-content: center;
    gap: 10px;
    z-index: 10;
}

.manual-btn {
    border: 2px solid #fff;
    padding: 5px;
    border-radius: 50%;
    cursor: pointer;
    transition: 0.3s;
}

.manual-btn:hover {
    background: #fff;
}

/* Radio button movement */

#radio1:checked~.first {
    margin-left: 0;
}

#radio2:checked~.first {
    margin-left: -33.333%;
}

#radio3:checked~.first {
    margin-left: -66.666%;
}

/* Auto navigation */

.navigation-auto {
    position: absolute;
    width: 100%;
    bottom: 20px;
    display: flex;
    justify-content: center;
    gap: 10px;
}

.navigation-auto div {
    border: 2px solid #fff;
    padding: 5px;
    border-radius: 50%;
}

#radio1:checked~.navigation-auto .auto-btn1 {
    background: #fff;
}

#radio2:checked~.navigation-auto .auto-btn2 {
    background: #fff;
}

#radio3:checked~.navigation-auto .auto-btn3 {
    background: #fff;
}



/* ================================================
HOME PAGE MAIN SLIDER CSS END
====================================================== */

/* ===============================================
FOOTER SECTION START
============================================== */
/* =========================================================
   PREMIUM SCHOOL FOOTER
========================================================= */

.new-school-footer {

    position: relative;

    overflow: hidden;

    color: #ffffff;

    background:
        linear-gradient(110deg,
            rgba(0, 38, 91, 0.97),
            rgba(0, 74, 132, 0.94),
            rgba(4, 48, 100, 0.96)),
        url("../images/footer/footer-bg.jpg");

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

}


/* =========================================================
   FOOTER MAIN
========================================================= */

.new-school-footer__main {
    position: relative;

    min-height: 600px;

    padding: 70px 0 95px;

    background-image: url("../images/background/footer-rs.jpeg");

    background-repeat: no-repeat;

    background-size: cover;

    background-position: center center;

    overflow: hidden;
}

/* DARK OVERLAY */

.new-school-footer__main::before {

    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(90deg,
            rgba(0, 35, 82, 0.78),
            rgba(0, 65, 120, 0.65),
            rgba(2, 36, 78, 0.78));

    pointer-events: none;

    z-index: -1;
}


/* =========================================================
   LEFT INTRO
========================================================= */

.new-school-footer__intro {

    position: relative;


}


/* =========================================================
   LOGO
========================================================= */

.new-school-footer__logo {

    width: 200px;

    height: 190px;

    margin-bottom: 18px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #ffffff;

    border-radius: 14px;

    padding: 12px;

    box-shadow:
        0 12px 35px rgba(0, 0, 0, 0.20);

    overflow: hidden;

    justify-self: center;
}


.new-school-footer__logo img {

    width: 100%;

    height: 100%;

    object-fit: contain;

    display: block;

    transition:
        transform 0.4s ease,
        filter 0.4s ease;
}


.new-school-footer__logo:hover img {

    transform: scale(1.04);

    filter:
        drop-shadow(0 5px 10px rgba(255, 193, 7, 0.25));
}


/* =========================================================
   SCHOOL NAME
========================================================= */

.new-school-footer__school-name {

    margin: 0 0 6px;

    color: #ffffff;

    font-size: 28px;

    line-height: 1.25;

    font-weight: 700;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    text-align: center;
}


/* =========================================================
   TAGLINE
========================================================= */

.new-school-footer__tagline {

    margin: 0;

    color: #e4edf7;

    font-size: 15px;

    font-weight: 500;

    line-height: 1.5;

    text-align: center;
}


/* =========================================================
   MAIN YELLOW LINE
========================================================= */

.new-school-footer__line {

    display: block;

    width: 60px;

    height: 4px;

    margin: 16px 0 18px;

    background: #ffc107;

    border-radius: 20px;

    box-shadow:
        0 0 12px rgba(255, 193, 7, 0.45);

    justify-self: center;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.new-school-footer__description {

    max-width: 380px;

    margin: 0 0 22px;

    color: #dce8f4;

    font-size: 14px;

    line-height: 1.75;

    font-weight: 400;

    text-align: justify;
}


/* =========================================================
   BUTTONS
========================================================= */

.new-school-footer__buttons {

    display: flex;

    align-items: center;

    /* flex-wrap: wrap; */

    gap: 5px;
}


.new-school-footer__btn {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    min-height: 46px;

    padding: 0 10px;

    border-radius: 30px;

    text-decoration: none;

    font-size: 12px;

    font-weight: 700;

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease,
        color 0.3s ease;
}


/* PRIMARY */

.new-school-footer__btn--primary {

    color: #07366b;

    background: #ffc107;

    border: 1px solid #ffc107;

    box-shadow:
        0 8px 20px rgba(255, 193, 7, 0.20);
    width: 100%;
}


.new-school-footer__btn--primary:hover {

    color: #07366b;

    background: #ffd34e;

    transform: translateY(-3px);

    box-shadow:
        0 12px 25px rgba(255, 193, 7, 0.30);
}


/* OUTLINE */

.new-school-footer__btn--outline {

    color: #ffffff;

    background: transparent;

    border: 1px solid rgba(255, 255, 255, 0.75);
    width: 100%;
}


.new-school-footer__btn--outline:hover {

    color: #07366b;

    background: #ffffff;

    transform: translateY(-3px);

    box-shadow:
        0 10px 25px rgba(0, 0, 0, 0.15);
}


/* =========================================================
   FOOTER COLUMNS
========================================================= */

.new-school-footer__column {

    height: 100%;

    position: relative;

    padding-left: 20px;

    border-left:
        1px solid rgba(255, 255, 255, 0.14);
}


/* =========================================================
   COLUMN HEADING
========================================================= */

.new-school-footer__heading {

    display: flex;

    align-items: center;

    gap: 14px;

    margin-bottom: 10px;
}


.new-school-footer__heading-icon {

    width: 58px;

    height: 58px;

    flex: 0 0 58px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #06428a;

    background: #ffc107;

    border-radius: 50%;

    font-size: 23px;

    box-shadow:
        0 8px 20px rgba(0, 0, 0, 0.12);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


.new-school-footer__column:hover .new-school-footer__heading-icon {

    transform: translateY(-4px);

    box-shadow:
        0 12px 25px rgba(255, 193, 7, 0.18);
}


.new-school-footer__heading h4 {

    margin: 0;

    color: #ffffff;

    font-size: 19px;

    line-height: 1.2;

    font-weight: 700;
}


/* =========================================================
   SMALL YELLOW LINE
========================================================= */

.new-school-footer__small-line {

    display: block;

    width: 38px;

    height: 4px;

    margin:
        0 0 18px 72px;

    background: #ffc107;

    border-radius: 20px;
}


/* =========================================================
   LINKS
========================================================= */

.new-school-footer__links {

    margin: 0;

    padding: 0;

    list-style: none;
}


.new-school-footer__links li {

    margin-bottom: 10px;
}


.new-school-footer__links a {

    display: inline-flex;

    align-items: center;

    gap: 8px;

    color: #dce8f5;

    text-decoration: none;

    font-size: 13px;

    line-height: 1.5;

    transition:
        color 0.3s ease,
        transform 0.3s ease;
}


.new-school-footer__links a i {

    color: #ffc107;

    font-size: 10px;

    transition:
        transform 0.3s ease;
}


.new-school-footer__links a:hover {

    color: #ffc107;

    transform: translateX(4px);
}


.new-school-footer__links a:hover i {

    transform: translateX(3px);
}


/* =========================================================
   CONTACT
========================================================= */

.new-school-footer__contact-item {

    display: flex;

    align-items: flex-start;

    gap: 14px;

    margin-bottom: 17px;
}


/* CONTACT ICON */

.new-school-footer__contact-icon {

    width: 45px;

    height: 45px;

    flex: 0 0 45px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #07366b;

    background:
        rgba(255, 255, 255, 0.08);

    border:
        1px solid #ffc107;

    border-radius: 50%;

    font-size: 17px;

    transition:
        background 0.3s ease,
        transform 0.3s ease-in-out;
    box-shadow:
        0 0 15px rgba(255, 193, 7, 0.35),
        0 0 30px rgba(255, 193, 7, 0.22),
        0 0 50px rgba(255, 193, 7, 0.12);

    background: #ffc107;

}


.new-school-footer__contact-item:hover .new-school-footer__contact-icon {

    /* background: #ffc107; */

    color: #fff;

    transform: scale(1.08);

    border: 1px solid #fff;

    padding: 3px;
}


/* CONTACT TEXT */

.new-school-footer__contact-text {

    display: flex;

    flex-direction: column;

    gap: 3px;

    min-width: 0;
}


.new-school-footer__contact-text strong {

    color: #ffffff;

    font-size: 13px;

    font-weight: 700;
}


.new-school-footer__contact-text span,
.new-school-footer__contact-text a {

    color: #dce8f5;

    font-size: 12px;

    line-height: 1.55;

    text-decoration: none;

    word-break: break-word;
}


.new-school-footer__contact-text a:hover {

    color: #ffc107;
}


/* =========================================================
   SOCIAL MEDIA
========================================================= */

.new-school-footer__social {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-top: 22px;
}


.new-school-footer__social-link {

    width: 50px;

    height: 50px;

    display: flex;

    align-items: center;

    justify-content: center;

    border:
        1px solid rgba(255, 255, 255, 0.55);

    border-radius: 50%;

    color: #ffffff;

    text-decoration: none;

    font-size: 20px;

    background:
        rgba(255, 255, 255, 0.04);

    transition:
        transform 0.35s ease,
        background 0.35s ease,
        border-color 0.35s ease,
        box-shadow 0.35s ease;
}


.new-school-footer__social-link:hover {

    transform:
        translateY(-6px) scale(1.04);

    color: #ffffff;

    border-color: transparent;

    box-shadow:
        0 10px 25px rgba(0, 0, 0, 0.18);
}


/* SOCIAL COLORS */

.new-school-footer__social-link.facebook {
    background: #1877f2;
}

.new-school-footer__social-link.instagram {
    background:
        linear-gradient(135deg,
            #833ab4,
            #fd1d1d,
            #fcb045);
}

.new-school-footer__social-link.youtube {
    background: #ff0000;
}

.new-school-footer__social-link.whatsapp {
    background: #25d366;
}


/* =========================================================
   BOTTOM FOOTER
========================================================= */

.new-school-footer__bottom {

    display: flex;

    align-items: center;

    padding: 25px 0 18px;

    color: #07366b;

    background: #ffc107;

    position: relative;
}


/* =========================================================
   WAVE TOP
========================================================= */



/* SECOND WAVE */

.new-school-footer__bottom::after {

    content: "";

    position: absolute;

    left: 0;

    top: -18px;

    width: 100%;

    height: 25px;

    background:
        rgba(255, 255, 255, 0.12);

    clip-path:
        polygon(0 50%,
            10% 30%,
            20% 60%,
            30% 35%,
            40% 65%,
            50% 30%,
            60% 60%,
            70% 35%,
            80% 65%,
            90% 35%,
            100% 55%,
            100% 100%,
            0 100%);

    pointer-events: none;
}


/* =========================================================
   BOTTOM LEFT
========================================================= */

.new-school-footer__bottom-left {

    color: #07366b;

    font-size: 12px;

    font-weight: 700;

    line-height: 1.5;
}


/* =========================================================
   BOTTOM CENTER
========================================================= */

.new-school-footer__bottom-center {

    text-align: center;

    color: #07366b;

    font-size: 12px;

    font-weight: 700;

    line-height: 1.5;
}


.new-school-footer__bottom-center i {

    margin: 0 4px;

    color: #e63946;

    font-size: 14px;
}


.new-school-footer__bottom-center a {

    color: #07366b;

    text-decoration: none;

    font-weight: 800;
}


.new-school-footer__bottom-center a:hover {

    color: #ffffff;
}


/* =========================================================
   BOTTOM RIGHT
========================================================= */

.new-school-footer__bottom-right {

    display: flex;

    justify-content: flex-end;

    align-items: center;

    flex-wrap: wrap;

    gap: 8px;

    color: #07366b;

    font-size: 12px;

    font-weight: 700;
}


.new-school-footer__bottom-right a {

    color: #07366b;

    text-decoration: none;

    transition:
        color 0.3s ease;
}


.new-school-footer__bottom-right a:hover {

    color: #ffffff;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1199px) {

    .new-school-footer__main {

        padding-top: 60px;

        padding-bottom: 85px;
    }

    .new-school-footer__school-name {

        font-size: 24px;
    }

    .new-school-footer__heading h4 {

        font-size: 18px;
    }

    .new-school-footer__heading-icon {

        width: 50px;

        height: 50px;

        flex-basis: 50px;

        font-size: 20px;
    }

    .new-school-footer__small-line {

        margin-left: 64px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 991px) {

    .new-school-footer__intro {

        padding-right: 0;

        margin-bottom: 15px;
    }

    .new-school-footer__column {

        padding-left: 0;

        border-left: none;
    }

    .new-school-footer__bottom {

        padding:
            25px 0 20px;
    }

    .new-school-footer__bottom::before {

        top: -28px;

        height: 50px;
    }

    .new-school-footer__bottom-left,
    .new-school-footer__bottom-center,
    .new-school-footer__bottom-right {

        text-align: center;

        justify-content: center;

        margin-bottom: 10px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575px) {

    .new-school-footer__main {

        padding:
            50px 0 70px;
    }

    .new-school-footer__logo {

        width: 175px;

        height: 165px;
    }

    .new-school-footer__school-name {

        font-size: 23px;
    }

    .new-school-footer__description {

        font-size: 13px;
    }

    .new-school-footer__buttons {

        flex-direction: column;

        align-items: flex-start;
    }

    .new-school-footer__btn {

        width: auto;

        min-height: 44px;

        padding: 0 19px;
    }

    .new-school-footer__heading-icon {

        width: 48px;

        height: 48px;

        flex-basis: 48px;
    }

    .new-school-footer__social-link {

        width: 45px;

        height: 45px;

        font-size: 18px;
    }

    .new-school-footer__bottom-right {

        font-size: 11px;
    }

}

/* =========================================
NEW CSS start 9/9/2026
===================================== */
/* =========================================
   FOOTER BACKGROUND RESPONSIVE FIX
========================================= */

.new-school-footer__main {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 991px) {

    .new-school-footer__main {
        background-size: cover;
        background-position: center center;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 575px) {

    .new-school-footer__main {
        background-size: cover;

        /* Image ka important center portion visible rahega */
        background-position: center center;

        background-repeat: no-repeat;

        /* Content ke according height */
        min-height: auto;

        padding: 45px 0 60px;
    }

}


/* =========================================
   VERY SMALL MOBILE
========================================= */

@media (max-width: 375px) {

    .new-school-footer__main {
        background-size: cover;
        background-position: center center;

        padding: 40px 0 55px;
    }

}


/* ===============================================
FOOTER SECTION END
============================================== */


/* ========================================
HOME PAGE TOP 3 CARDS SCETION START
================================================ */
/* =========================================
   TOP SLIDER CARDS
========================================= */


.top-slider-cards {
    position: relative;
    z-index: 99;
    width: 100%;
    height: 16px;
}

/* about page  start */
.tp-slider-cards {
    height: 200px;
}

.tp-about-grid {
    transform: translateY(0px);
}

/* about page end */

/* MAIN GRID */
.tsc-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 34px;

    width: 100%;
    max-width: 1620px;

    margin: 0 auto;

    transform: translateY(-85px);
}


/* =========================================
   CARD
========================================= */

.tsc-card {
    position: relative;

    height: 280px;
    min-height: 280px;

    padding: 25px 40px;

    border-radius: 17px;

    overflow: hidden;

    background: rgba(255, 255, 255, 0.82);

    border: 2px solid transparent;

    box-shadow: none;

    transition: transform 0.35s ease,
        box-shadow 0.35s ease;
}


/* ANIMATION ROTATION  START */
/* =========================================
   CLEAN ROTATING COLOR BORDER
========================================= */

.tsc-card {
    position: relative;
    z-index: 1;

    border: none;


    isolation: isolate;

    --border-angle: 0deg;
    justify-items: center;
    text-align: center;
}


/* =========================================
   ANIMATED BORDER
========================================= */

.tsc-card::before {
    content: "";

    position: absolute;

    inset: 0;

    padding: 2px;

    border-radius: 17px;

    background: conic-gradient(from var(--border-angle),

            transparent 0deg,
            transparent 55deg,

            currentColor 85deg,
            currentColor 100deg,

            transparent 130deg,
            transparent 180deg,

            currentColor 215deg,
            currentColor 230deg,

            transparent 260deg,
            transparent 360deg);

    /*
       Only the border remains visible.
       Center of card stays completely clean.
    */
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    -webkit-mask-composite: xor;

    mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    mask-composite: exclude;

    pointer-events: none;

    z-index: 10;
}


/* =========================================
   ROTATE ONLY THE COLOR
========================================= */

@keyframes tscBorderRotate {

    from {
        --border-angle: 0deg;
    }

    to {
        --border-angle: 360deg;
    }

}


/* =========================================
   CARD COLORS
========================================= */

.tsc-purple {
    --border-angle: 0deg;
    color: #9b4de8;
    box-shadow:
        0 0 10px rgba(155, 77, 232, 0.20),
        0 0 20px rgba(155, 77, 232, 0.30),
        0 0 35px rgba(155, 77, 232, 0.40);


}

.tsc-gold {
    --border-angle: 0deg;
    color: #e7a900;
    box-shadow:
        0 0 10px rgba(231, 169, 0, 0.20),
        0 0 20px rgba(231, 169, 0, 0.30),
        0 0 35px rgba(231, 169, 0, 0.40);
}

.tsc-red {
    --border-angle: 0deg;
    color: #ef4059;
    box-shadow:
        0 0 10px rgba(239, 64, 89, 0.20),
        0 0 20px rgba(239, 64, 89, 0.30),
        0 0 35px rgba(239, 64, 89, 0.40);
}

.tsc-blue {
    --border-angle: 0deg;
    color: #3c8ce7;
    box-shadow:
        0 0 10px rgba(60, 140, 231, 0.20),
        0 0 20px rgba(60, 140, 231, 0.30),
        0 0 35px rgba(60, 140, 231, 0.40);
}


/* =========================================
   ENABLE ANIMATION
========================================= */

.tsc-card::before {
    animation: tscBorderRotate 5s linear infinite;
}


/* =========================================
   REGISTER CSS VARIABLE
========================================= */

@property --border-angle {

    syntax: "<angle>";

    initial-value: 0deg;

    inherits: false;
}

/* ANIMATION ROTATION  END */




/* HOVER */
.tsc-card:hover {
    transform: translateY(-7px);
}


/* =========================================
   BIG BACKGROUND ICON
========================================= */

.tsc-bg-icon {
    position: absolute;

    right: -2px;
    top: 48px;

    font-size: 105px;

    line-height: 1;

    opacity: 0.075;

    pointer-events: none;

    z-index: 0;
}


/* =========================================
   SMALL ROUND ICON
========================================= */

.tsc-icon {
    position: relative;
    z-index: 2;

    width: 72px;
    height: 72px;

    margin-bottom: 14px;

    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 32px;

    line-height: 1;
}


/* =========================================
   HEADING
========================================= */

.tsc-card h3 {
    position: relative;
    z-index: 2;

    margin: 0 0 5px 0;

    font-size: 24px;
    line-height: 1.2;

    font-weight: 700;

    color: #092d69;
}


/* =========================================
   PARAGRAPH
========================================= */

.tsc-card p {
    position: relative;
    z-index: 2;

    max-width: 270px;

    margin: 0;

    font-size: 16px;
    line-height: 1.45;

    font-weight: 400;

    color: #53617a;
}


/* =========================================
   ARROW BUTTON
========================================= */

.tsc-arrow {
    position: absolute;

    left: 40px;
    bottom: 18px;

    width: 55px;
    height: 55px;

    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    text-decoration: none;

    color: #fff;

    font-size: 23px;

    z-index: 5;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.tsc-arrow:hover {
    color: #fff;

    transform: translateX(5px);

    box-shadow: 0 7px 18px rgba(0, 0, 0, 0.15);
}


/* =========================================
   PURPLE CARD
========================================= */

.tsc-purple {
    color: #9b4de8;

    background:
        linear-gradient(135deg,
            rgba(255, 255, 255, 0.95),
            rgba(249, 243, 255, 0.95));

    border-color: rgba(155, 77, 232, 0.35);
}

.tsc-purple .tsc-icon {
    background: rgba(155, 77, 232, 0.13);
    color: #8f35e7;
}

.tsc-purple .tsc-bg-icon {
    color: #9b4de8;
}

.tsc-purple .tsc-arrow {
    background: #9639e9;
}


/* =========================================
   GOLD CARD
========================================= */

.tsc-gold {
    color: #e7a900;

    background:
        linear-gradient(135deg,
            rgba(255, 255, 255, 0.95),
            rgba(255, 250, 235, 0.95));

    border-color: rgba(231, 169, 0, 0.35);
}

.tsc-gold .tsc-icon {
    background: rgba(231, 169, 0, 0.14);
    color: #dca000;
}

.tsc-gold .tsc-bg-icon {
    color: #e7a900;
}

.tsc-gold .tsc-arrow {
    background: #e8a900;
}


/* =========================================
   RED CARD
========================================= */

.tsc-red {
    color: #ef4059;

    background:
        linear-gradient(135deg,
            rgba(255, 255, 255, 0.95),
            rgba(255, 244, 246, 0.95));

    border-color: rgba(239, 64, 89, 0.35);
}

.tsc-red .tsc-icon {
    background: rgba(239, 64, 89, 0.13);
    color: #ee2948;
}

.tsc-red .tsc-bg-icon {
    color: #ef4059;
}

.tsc-red .tsc-arrow {
    background: #ef304d;
}


/* =========================================
   BLUE CARD
========================================= */

.tsc-blue {
    color: #3c8ce7;

    background:
        linear-gradient(135deg,
            rgba(255, 255, 255, 0.95),
            rgba(241, 248, 255, 0.95));

    border-color: rgba(60, 140, 231, 0.35);
}

.tsc-blue .tsc-icon {
    background: rgba(60, 140, 231, 0.13);
    color: #267ddd;
}

.tsc-blue .tsc-bg-icon {
    color: #3c8ce7;
}

.tsc-blue .tsc-arrow {
    background: #3289e6;
}


/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 1399px) {

    .tsc-grid {
        max-width: 1180px;
        gap: 20px;
    }

    .tsc-card {
        padding-left: 30px;
        padding-right: 30px;
    }

    .tsc-card h3 {
        font-size: 25px;
    }

    .tsc-card p {
        font-size: 15px;
    }

    .tsc-arrow {
        left: 30px;
    }
}


/* TABLET */
@media (max-width: 991px) {

    .tsc-grid {
        grid-template-columns: repeat(2, 1fr);

        transform: none;

        max-width: 720px;

        gap: 20px;
    }

    .tsc-card {
        height: 300px;
        min-height: 300px;
    }
}


/* MOBILE */
@media (max-width: 575px) {

    .tsc-grid {
        grid-template-columns: 1fr;

        max-width: 380px;

        gap: 18px;

        padding: 0 15px;
    }

    .tsc-card {
        height: 300px;
        min-height: 300px;

        padding: 25px 28px;
    }

    .tsc-card h3 {
        font-size: 25px;
    }

    .tsc-card p {
        font-size: 15px;
    }

    .tsc-arrow {
        left: 28px;
        bottom: 18px;
    }
}

/* =========================================
   TOP SLIDER CARDS - RESPONSIVE FIX
========================================= */


.top-slider-cards {
    position: relative;
    z-index: 99;
    width: 100%;
    height: auto;
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 991px) {

    .top-slider-cards {
        height: auto;
        padding: 30px 0 40px;
    }

    .tsc-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;

        width: 100%;
        max-width: 720px;

        margin: 0 auto;

        transform: none;
    }

    .tsc-card {
        width: 100%;
        height: 280px;
        min-height: 280px;

        padding: 25px 30px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 575px) {

    .top-slider-cards {
        height: auto;

        /* Cards ko next section ke upar overlap
           hone se rokega */
        padding: 25px 0 40px;

        overflow: visible;
    }

    .tsc-grid {
        display: grid;
        grid-template-columns: 1fr;

        width: 100%;
        max-width: 100%;

        margin: 0 auto;

        gap: 20px;

        padding: 0 15px;

        /* IMPORTANT */
        transform: none;
    }

    .tsc-card {
        width: 100%;

        height: auto;
        min-height: 270px;

        padding: 25px 28px;

        margin: 0;

        box-sizing: border-box;
    }

    .tsc-card h3 {
        font-size: 22px;
        line-height: 1.3;
    }

    .tsc-card p {
        max-width: 100%;

        font-size: 14px;
        line-height: 1.5;
    }

    .tsc-bg-icon {
        right: 0;
        top: 45px;
        font-size: 90px;
    }

    .tsc-icon {
        width: 65px;
        height: 65px;

        font-size: 28px;

        margin-bottom: 15px;
    }

    .tsc-arrow {
        left: 28px;
        bottom: 18px;

        width: 50px;
        height: 50px;

        font-size: 20px;
    }

}


/* =========================================
   VERY SMALL MOBILE
========================================= */

@media (max-width: 375px) {

    .top-slider-cards {
        padding: 20px 0 35px;
    }

    .tsc-grid {
        padding: 0 12px;
        gap: 16px;
    }

    .tsc-card {
        min-height: 255px;
        padding: 22px 24px;
        border-radius: 15px;
    }

    .tsc-card h3 {
        font-size: 20px;
    }

    .tsc-card p {
        font-size: 13px;
        max-width: 90%;
    }

    .tsc-icon {
        width: 60px;
        height: 60px;
        font-size: 26px;
    }

    .tsc-arrow {
        left: 24px;
        bottom: 16px;

        width: 48px;
        height: 48px;
    }

}

/* ========================================
HOME PAGE TOP 3 CARDS SCETION END
================================================ */

/* ================================================
ABOUT SECTION ON HOME PAGE START
================================================== */
/* =========================================================
   ABOUT US SECTION
========================================================= */

.about-uss {
    position: relative;
    overflow: hidden;
    padding: 25px 0px 30px 0px !important;
    background: #ffffff;

}

/* about page  */
.about-pg {
    padding-top: 1px;
}

/* =============================
FOR ABOUT PAGE MEIN SECTION  START
========================= */

.about-pg {
    position: relative;
    overflow: hidden;
    padding: 5px 0px 20px 0px;
    background: #ffffff;

}

/* =============================
FOR ABOUT PAGE MEIN SECTION  END
========================= */

/* =========================================================
   ABOUT TOP HEADING
========================================================= */

.about-top-head {
    width: 100%;
    padding-top: 50px;
    padding-bottom: 25px;
    background: #ffffff;
}


/* Inner Content */

.about-top-head__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
    text-align: center;
    justify-items: center;
}


/* Main Heading */

.about-top-head__title {
    margin: 0;

    color: #f5b417;

    font-size: 28px;
    line-height: 1.2;

    font-weight: 700;

    letter-spacing: 0.5px;
}


/* Small Decorative Line */

.about-top-head__line {
    display: block;

    width: 55px;
    height: 3px;

    margin-top: 9px;
    margin-bottom: 13px;

    background: #063d73;

    border-radius: 10px;
}


/* Paragraph */

.about-top-head__text {
    max-width: 850px;

    margin: 0;

    color: #555555;

    font-size: 15px;
    line-height: 1.7;

    font-weight: 400;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .about-top-head {
        padding-top: 40px;
        padding-bottom: 20px;
    }

    .about-top-head__title {
        font-size: 26px;
    }

    .about-top-head__text {
        max-width: 750px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .about-top-head {
        padding-top: 35px;
        padding-bottom: 20px;
    }

    .about-top-head__title {
        font-size: 24px;
    }

    .about-top-head__text {
        font-size: 14px;
        line-height: 1.65;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575px) {

    .about-top-head {
        padding-top: 30px;
    }

    .about-top-head__inner {
        padding: 0 15px;
    }

    .about-top-head__title {
        font-size: 22px;
    }

    .about-top-head__line {
        width: 45px;
        height: 3px;
    }

    .about-top-head__text {
        font-size: 14px;
    }
}

/* =========================================================
   MAIN ROW
========================================================= */

.about-uss__row {
    position: relative;
}


/* =========================================================
   LEFT LOGO
========================================================= */
/* =========================================================
   LEFT LOGO
========================================================= */

.about-uss__logo-wrap {
    display: flex;
    align-items: center;
    justify-content: center;

    position: relative;
    z-index: 2;
}


/* =========================================================
   ANIMATED LOGO
========================================================= */

.about-uss__logo {
    position: relative;

    width: 285px;
    height: 285px;

    padding: 8px;

    border-radius: 50%;

    background: #ffffff;

    border: 2px solid #ffffff;

    display: flex;
    align-items: center;
    justify-content: center;

    /*
       Slow continuous rotation
       + Multi-color glow
    */
    animation:
        aboutLogoRotate 14s linear infinite,
        aboutLogoGlow 10s ease-in-out infinite;

    transform-origin: center center;

    will-change: transform, box-shadow;

    transition: box-shadow 0.4s ease;
}


/* =========================================================
   LOGO IMAGE
========================================================= */

.about-uss__logo img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    border-radius: 50%;
}


/* =========================================================
   360 DEGREE ROTATION
========================================================= */

@keyframes aboutLogoRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


/* =========================================================
   MULTI-COLOR GLOW
========================================================= */

@keyframes aboutLogoGlow {

    0% {

        box-shadow:
            0 0 10px rgba(155, 77, 232, 0.20),
            0 0 20px rgba(155, 77, 232, 0.30),
            0 0 35px rgba(155, 77, 232, 0.40);
    }


    25% {

        box-shadow:
            0 0 10px rgba(231, 169, 0, 0.20),
            0 0 20px rgba(231, 169, 0, 0.30),
            0 0 35px rgba(231, 169, 0, 0.40);
    }


    50% {

        box-shadow:
            0 0 10px rgba(239, 64, 89, 0.20),
            0 0 20px rgba(239, 64, 89, 0.30),
            0 0 35px rgba(239, 64, 89, 0.40);
    }


    75% {

        box-shadow:
            0 0 10px rgba(60, 140, 231, 0.20),
            0 0 20px rgba(60, 140, 231, 0.30),
            0 0 35px rgba(60, 140, 231, 0.40);
    }


    100% {

        box-shadow:
            0 0 10px rgba(155, 77, 232, 0.20),
            0 0 20px rgba(155, 77, 232, 0.30),
            0 0 35px rgba(155, 77, 232, 0.40);
    }

}


/* =========================================================
   HOVER
========================================================= */

.about-uss__logo:hover {
    animation-play-state: paused;

    transform: scale(1.04);

    box-shadow:
        0 0 15px rgba(155, 77, 232, 0.30),
        0 0 30px rgba(231, 169, 0, 0.35),
        0 0 45px rgba(60, 140, 231, 0.35);
}


/* =========================================================
   MIDDLE CONTENT
========================================================= */

.about-uss__content {
    padding: 10px 25px 10px 20px;
}


/* Small Heading */

.about-uss__subtitle {
    display: block;

    margin-bottom: 5px;

    color: #e4a900;

    font-size: 15px;
    font-weight: 700;

    letter-spacing: 1.5px;
    text-transform: uppercase;
}


/* Main Heading */

.about-uss__title {
    margin: 0;

    color: #063d73;

    font-size: 38px;
    line-height: 1.15;

    font-weight: 700;
}


/* Heading Line */

.about-uss__line {
    display: block;

    width: 55px;
    height: 3px;

    margin: 14px 0 18px;

    background: #e4a900;

    border-radius: 10px;
}


/* Paragraph */

.about-uss__content p {
    margin-bottom: 14px;

    color: #555555;

    font-size: 14px;
    line-height: 1.7;

    text-align: justify;
}


/* Highlight */

.about-uss__highlight {
    color: #06457c;
    font-weight: 600;
}


/* =========================================================
   BUTTON
========================================================= */

.about-uss__btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    margin-top: 8px;
    padding: 12px 24px;

    color: #ffffff;
    background: #e8a900;

    border-radius: 30px;

    font-size: 14px;
    font-weight: 600;

    text-decoration: none;

    transition: all 0.35s ease;

    text-align: center;
}



.about-uss__btn i {
    font-size: 15px;

    transition: transform 0.3s ease;
}

.about-uss__btn:hover {
    color: #ffffff;
    background: #063d73;

    transform: translateY(-3px);

    box-shadow: 0 8px 20px rgba(6, 61, 115, 0.20);
}

.about-uss__btn:hover i {
    transform: translateX(5px);
}


/* =========================================================
   RIGHT IMAGE AREA
========================================================= */

.about-uss__image-box {
    position: relative;

    min-height: 360px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 25px 15px;
}


/* =========================================================
   DECORATIVE BLUE/YELLOW SHAPE
========================================================= */

.about-uss__shape {
    position: absolute;

    width: 94%;
    height: 88%;

    right: 0;
    top: 6%;

    background: #063d73;

    border-radius: 25px 85px 25px 85px;

    transform: rotate(-4deg);

    z-index: 0;
}


/* Yellow accent */

.about-uss__shape::after {
    content: "";

    position: absolute;

    width: 100%;
    height: 100%;

    top: 8px;
    left: 8px;

    border-radius: 25px 85px 25px 85px;

    border: 6px solid #e8a900;

    z-index: -1;
}


/* =========================================================
   IMAGE
========================================================= */

.about-uss__image {
    position: relative;

    width: 88%;
    height: 285px;

    overflow: hidden;

    border-radius: 12px 55px 12px 55px;

    background: #ffffff;

    padding: 7px;

    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.14);

    z-index: 2;

    transform: rotate(1deg);

    transition: all 0.4s ease;
}

.about-uss__image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    border-radius: 7px 48px 7px 48px;
}


/* Image Hover */

.about-uss__image:hover {
    transform: rotate(0deg) translateY(-5px);

    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.18);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199px) {

    .about-uss {
        padding: 60px 0;
    }

    .about-uss__logo {
        width: 245px;
        height: 245px;
    }

    .about-uss__content {
        padding-left: 10px;
        padding-right: 10px;
    }

    .about-uss__title {
        font-size: 34px;
    }

    .about-uss__image {
        width: 90%;
        height: 255px;
    }
}


@media (max-width: 991px) {

    .about-uss {
        padding: 60px 0;
    }

    .about-uss__logo-wrap {
        margin-bottom: 35px;
    }

    .about-uss__content {
        padding: 0;
    }

    .about-uss__image-box {
        margin-top: 45px;
        min-height: 350px;
    }

    .about-uss__image {
        width: 75%;
        height: 290px;
    }

    .about-uss__shape {
        width: 78%;
        right: 11%;
    }
}


@media (max-width: 767px) {

    .about-uss {
        padding: 50px 0;
    }

    .about-uss__logo {
        width: 220px;
        height: 220px;
    }

    .about-uss__title {
        font-size: 30px;
    }

    .about-uss__content p {
        font-size: 14px;
        line-height: 1.65;
    }

    .about-uss__image-box {
        min-height: 300px;
        margin-top: 35px;
    }

    .about-uss__image {
        width: 82%;
        height: 245px;
    }

    .about-uss__shape {
        width: 85%;
        right: 7%;
    }
}


@media (max-width: 575px) {

    .about-uss {
        padding: 45px 15px;
    }

    .about-uss__logo {
        width: 200px;
        height: 200px;
    }

    .about-uss__subtitle {
        font-size: 13px;
    }

    .about-uss__title {
        font-size: 28px;
    }

    .about-uss__line {
        margin-top: 10px;
        margin-bottom: 15px;
    }

    .about-uss__image-box {
        min-height: 260px;
    }

    .about-uss__image {
        width: 90%;
        height: 220px;
    }

    .about-uss__shape {
        width: 92%;
        right: 4%;
    }
}

/* ================================================
ABOUT SECTION ONE HONE PAGE END
================================================== */

/* ==============================================
MANAGEMENT SECTION START 
============================================== */
/* heading */
.management-mg-heading {
    color: #004484;
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 15px;
    border-left: 5px solid #f1b038;
    padding-left: 15px;
}


/* text  pargraph */
.managemet-msg-text {
    flex: 3;
    min-width: 300px;
    background: #ffffff;
    padding: 30px 40px;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* ==============================================
MANAGEMENT SECTION  END
============================================== */

/* ============================================
ABOUT SECTION  START
============================================= */
/* =========================================================
   ABOUT US SECTION
========================================================= */

.about-uss {
    position: relative;
    overflow: hidden;

    padding: 180px 0 30px 0;

    background: #ffffff;

    background-image:
        linear-gradient(rgb(255, 255, 255, 0.80),
            rgba(255, 255, 255, 0.80)),
        url("../images/background/meassages.png");
}



/* =========================================================
   ABOUT PAGE VERSION
========================================================= */

.about-pg {
    position: relative;
    overflow: hidden;

    padding: 5px 0 20px 0;

    background: #ffffff;
}


/* =========================================================
   TOP HEADING
========================================================= */

.about-top-head {
    width: 100%;

    padding-top: 50px;
    padding-bottom: 25px;

    background: transparent;
}


.about-top-head__inner {
    max-width: 1200px;

    margin: 0 auto;
    padding: 0 15px;

    text-align: center;

    justify-items: center;
}


.about-top-head__title {
    margin: 0;

    color: #f5b417;

    font-size: 28px;
    line-height: 1.2;

    font-weight: 700;

    letter-spacing: 0.5px;
}


.about-top-head__line {
    display: block;

    width: 55px;
    height: 3px;

    margin-top: 9px;
    margin-bottom: 13px;

    background: #063d73;

    border-radius: 10px;
}


.about-top-head__text {
    max-width: 850px;

    margin: 0;

    color: #555555;

    font-size: 15px;
    line-height: 1.7;

    font-weight: 400;
}


/* =========================================================
   MAIN ROW
========================================================= */

.about-uss__row {
    position: relative;
}


/* =========================================================
   LEFT LOGO WRAPPER
========================================================= */

.about-uss__logo-wrap {
    position: relative;

    display: flex;

    align-items: center;
    justify-content: center;

    z-index: 2;

    width: 100%;
}


/* =========================================================
   LOGO CONTAINER
========================================================= */

.about-uss__logo {
    position: relative;

    width: 285px;
    height: 285px;

    padding: 8px;

    border-radius: 50%;

    background: #ffffff;

    /*
       No rotation on this element.
       Logo will remain completely fixed.
    */

    display: flex;
    align-items: center;
    justify-content: center;

    z-index: 2;

    /*
       Default glow
    */

    /* box-shadow:
        0 0 10px rgba(155, 77, 232, 0.20),
        0 0 20px rgba(155, 77, 232, 0.30),
        0 0 35px rgba(155, 77, 232, 0.40); */
    box-shadow:
        0 0 10px rgba(231, 169, 0, 0.30),
        0 0 20px rgba(239, 64, 89, 0.35),
        0 0 35px rgba(60, 140, 231, 0.45),
        0 12px 20px rgba(231, 169, 0, 0.25),
        0 -5px 10px rgba(239, 64, 89, 0.20);

    transition:
        transform 0.35s ease,
        box-shadow 0.5s ease;
}


/* =========================================================
   ROTATING COLOR BORDER
   IMPORTANT:
   ONLY ::before ROTATES
   LOGO ITSELF DOES NOT ROTATE
========================================================= */

.about-uss__logo::before {
    content: "";

    position: absolute;

    inset: -5px;

    border-radius: 50%;

    background: conic-gradient(from 0deg,

            #9b4de8 0deg,
            #9b4de8 70deg,

            transparent 90deg,

            #e7a900 120deg,
            #e7a900 190deg,

            transparent 210deg,

            #ef4059 240deg,
            #ef4059 310deg,

            transparent 330deg,

            #3c8ce7 350deg,
            #3c8ce7 360deg);

    /*
       Make only the outer border visible
    */

    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    -webkit-mask-composite: xor;

    mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    mask-composite: exclude;

    padding: 3px;

    pointer-events: none;

    z-index: -1;

    /*
       ONLY THIS LAYER ROTATES
    */

    animation: aboutLogoBorderRotate 8s linear infinite;
}


/* =========================================================
   ROTATING BORDER ANIMATION
========================================================= */

@keyframes aboutLogoBorderRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


/* =========================================================
   MULTI-COLOR GLOW
   LOGO STAYS FIXED
========================================================= */

.about-uss__logo {
    animation: aboutLogoGlow 10s ease-in-out infinite;
}


@keyframes aboutLogoGlow {

    /* PURPLE */

    0% {
        box-shadow:
            0 0 10px rgba(155, 77, 232, 0.20),
            0 0 20px rgba(155, 77, 232, 0.30),
            0 0 35px rgba(155, 77, 232, 0.40);
    }


    /* GOLD */

    25% {
        box-shadow:
            0 0 10px rgba(231, 169, 0, 0.20),
            0 0 20px rgba(231, 169, 0, 0.30),
            0 0 35px rgba(231, 169, 0, 0.40);
    }


    /* RED */

    50% {
        box-shadow:
            0 0 10px rgba(239, 64, 89, 0.20),
            0 0 20px rgba(239, 64, 89, 0.30),
            0 0 35px rgba(239, 64, 89, 0.40);
    }


    /* BLUE */

    75% {
        box-shadow:
            0 0 10px rgba(60, 140, 231, 0.20),
            0 0 20px rgba(60, 140, 231, 0.30),
            0 0 35px rgba(60, 140, 231, 0.40);
    }


    /* BACK TO PURPLE */

    100% {
        box-shadow:
            0 0 10px rgba(155, 77, 232, 0.20),
            0 0 20px rgba(155, 77, 232, 0.30),
            0 0 35px rgba(155, 77, 232, 0.40);
    }

}


/* =========================================================
   LOGO IMAGE
   COMPLETELY FIXED
========================================================= */

.about-uss__logo img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    border-radius: 50%;

    /*
       IMPORTANT:
       No transform
       No rotation
    */

    transform: none;

    position: relative;

    z-index: 5;
}


/* =========================================================
   LOGO HOVER
========================================================= */

.about-uss__logo:hover {
    transform: translateY(-7px) scale(1.02);
}


/* =========================================================
   MIDDLE CONTENT
========================================================= */

.about-uss__content {
    padding: 10px 25px 10px 20px;
}


/* =========================================================
   SUBTITLE
========================================================= */

.about-uss__subtitle {
    display: block;

    margin-bottom: 5px;

    color: #e4a900;

    font-size: 15px;

    font-weight: 700;

    letter-spacing: 1.5px;

    text-transform: uppercase;
}


/* =========================================================
   MAIN TITLE
========================================================= */

.about-uss__title {
    margin: 0;

    color: #063d73;

    font-size: 38px;

    line-height: 1.15;

    font-weight: 700;
}


/* =========================================================
   TITLE LINE
========================================================= */

.about-uss__line {
    display: block;

    width: 55px;
    height: 3px;

    margin: 14px 0 18px;

    background: #e4a900;

    border-radius: 10px;
}


/* =========================================================
   PARAGRAPH
========================================================= */

.about-uss__content p {
    margin-bottom: 14px;

    color: #555555;

    font-size: 14px;

    line-height: 1.7;

    text-align: justify;
}


/* =========================================================
   HIGHLIGHT
========================================================= */

.about-uss__highlight {
    color: #06457c;

    font-weight: 600;
}


/* =========================================================
   BUTTON
========================================================= */

.about-uss__btn {
    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-top: 8px;

    padding: 12px 24px;

    color: #ffffff;

    background: #e8a900;

    border-radius: 30px;

    font-size: 14px;

    font-weight: 600;

    text-decoration: none;

    transition: all 0.35s ease;

    text-align: center;
}


.about-uss__btn i {
    font-size: 15px;

    transition: transform 0.3s ease;
}


.about-uss__btn:hover {
    color: #ffffff;

    background: #063d73;

    transform: translateY(-3px);

    box-shadow:
        0 8px 20px rgba(6, 61, 115, 0.20);
}


.about-uss__btn:hover i {
    transform: translateX(5px);
}


/* =========================================================
   RIGHT IMAGE AREA
========================================================= */

.about-uss__image-box {
    position: relative;

    min-height: 360px;

    display: flex;

    align-items: center;
    justify-content: center;

    padding: 25px 15px;
}


/* =========================================================
   BLUE DECORATIVE SHAPE
========================================================= */

.about-uss__shape {
    position: absolute;

    width: 94%;
    height: 88%;

    right: 0;
    top: 6%;

    background: #063d73;

    border-radius:
        25px 85px 25px 85px;

    transform: rotate(-4deg);

    z-index: 0;
}


/* =========================================================
   YELLOW ACCENT
========================================================= */

.about-uss__shape::after {
    content: "";

    position: absolute;

    width: 100%;
    height: 100%;

    top: 8px;
    left: 8px;

    border-radius:
        25px 85px 25px 85px;

    border: 6px solid #e8a900;

    z-index: -1;
}


/* =========================================================
   RIGHT IMAGE
========================================================= */

.about-uss__image {
    position: relative;

    width: 88%;
    height: 285px;

    overflow: hidden;

    border-radius:
        12px 55px 12px 55px;

    background: #ffffff;

    padding: 7px;

    box-shadow:
        0 15px 35px rgba(0, 0, 0, 0.14);

    z-index: 2;

    transform: rotate(1deg);

    transition: all 0.4s ease;
}


.about-uss__image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    border-radius:
        7px 48px 7px 48px;
}


/* =========================================================
   IMAGE HOVER
========================================================= */

.about-uss__image:hover {
    transform:
        rotate(0deg) translateY(-5px);

    box-shadow:
        0 20px 45px rgba(0, 0, 0, 0.18);
}


/* =========================================================
   TABLET — 1199px
========================================================= */

@media (max-width: 1199px) {

    .about-uss {
        padding: 60px 0;
    }

    .about-uss__logo {
        width: 245px;
        height: 245px;
    }

    .about-uss__content {
        padding-left: 10px;
        padding-right: 10px;
    }

    .about-uss__title {
        font-size: 34px;
    }

    .about-uss__image {
        width: 90%;
        height: 255px;
    }

}


/* =========================================================
   TABLET — 991px
========================================================= */

@media (max-width: 991px) {

    .about-uss {
        padding: 60px 0;
    }

    .about-uss__logo-wrap {
        margin-bottom: 35px;
    }

    .about-uss__content {
        padding: 0;
    }

    .about-uss__image-box {
        margin-top: 45px;

        min-height: 350px;
    }

    .about-uss__image {
        width: 75%;
        height: 290px;
    }

    .about-uss__shape {
        width: 78%;

        right: 11%;
    }

}


/* =========================================================
   MOBILE — 767px
========================================================= */

@media (max-width: 767px) {

    .about-uss {
        padding: 50px 0;
    }

    .about-uss__logo {
        width: 220px;
        height: 220px;
    }

    .about-uss__title {
        font-size: 30px;
    }

    .about-uss__content p {
        font-size: 14px;

        line-height: 1.65;
    }

    .about-uss__image-box {
        min-height: 300px;

        margin-top: 35px;
    }

    .about-uss__image {
        width: 82%;

        height: 245px;
    }

    .about-uss__shape {
        width: 85%;

        right: 7%;
    }

}


/* =========================================================
   SMALL MOBILE — 575px
========================================================= */

@media (max-width: 575px) {

    .about-uss {
        padding: 45px 15px;
    }

    .about-uss__logo {
        width: 200px;
        height: 200px;
    }

    .about-uss__subtitle {
        font-size: 13px;
    }

    .about-uss__title {
        font-size: 28px;
    }

    .about-uss__line {
        margin-top: 10px;

        margin-bottom: 15px;
    }

    .about-uss__image-box {
        min-height: 260px;
    }

    .about-uss__image {
        width: 90%;

        height: 220px;
    }

    .about-uss__shape {
        width: 92%;

        right: 4%;
    }

}

/* ============================================
ABOUT SECTION END
============================================= */

/* ============================================
ADMISSION PAGE FORM START
================================================ */
/*===================================
  SCHOOL ADMISSION FORM
===================================*/

.school-admission {
    padding: 80px 0;
    background: linear-gradient(135deg, #f5f9ff, #eef5ff);
    position: relative;
    overflow: hidden;
    justify-self: center;
}

.school-admission .form-card {
    background: #ffffff;
    border-radius: 25px;
    padding: 45px;
    box-shadow: rgba(8, 75, 129, 0.15) 0px 15px 40px;
    border-top: 5px solid #f1b038;
    position: relative;

}

.school-admission .form-card::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 220px;
    /* height: 220px; */
    background: rgba(241, 176, 56, 0.08);
    border-radius: 50%;
    transform: translate(50%, -50%);
}

.school-admission .frm-header {
    text-align: center;
    margin-bottom: 40px;
    position: relative;
    z-index: 2;
}

.school-admission .frm-header h1 {
    font-size: 42px;
    font-weight: 700;
    color: #004484;
    margin-bottom: 10px;
}

.school-admission .frm-header p {
    max-width: 750px;
    margin: auto;
    font-size: 15px;
    line-height: 1.8;
    color: #666;
}

.school-admission .req {
    color: #dc3545;
}

/*==============================
 SECTION TITLE
==============================*/

.school-admission .form-section {
    margin-bottom: 40px;
}

.school-admission .section-title {
    position: relative;
    font-size: 24px;
    font-weight: 700;
    color: #004484;
    margin-bottom: 25px;
    padding-bottom: 12px;
}

.school-admission .section-title::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 70px;
    height: 4px;
    background: #f1b038;
    border-radius: 50px;
}

.school-admission .section-title::after {
    content: "";
    position: absolute;
    left: 80px;
    bottom: 0;
    width: 15px;
    height: 4px;
    background: #004484;
    border-radius: 50px;
}

/*==============================
 GRID
==============================*/

.school-admission .grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 22px;
}

.school-admission .span-2 {
    grid-column: span 2;
}

/*==============================
 LABELS
==============================*/

.school-admission label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #004484;
    margin-bottom: 8px;
}

/*==============================
 INPUTS
==============================*/

.school-admission input,
.school-admission select,
.school-admission textarea {
    width: 100%;
    height: 54px;
    border: 1px solid #d8e4f3;
    border-radius: 12px;
    padding: 0 16px;
    background: #fff;
    font-size: 14px;
    color: #333;
    transition: all .4s ease;
}

.school-admission textarea {
    height: 130px;
    resize: none;
    padding-top: 14px;
}

.school-admission input:focus,
.school-admission select:focus,
.school-admission textarea:focus {
    outline: none;
    border-color: #004484;
    box-shadow: rgba(8, 75, 129, 0.12) 0px 0px 0px 5px;
}

/*==============================
 HOVER EFFECT
==============================*/

.school-admission input:hover,
.school-admission select:hover,
.school-admission textarea:hover {
    border-color: #004484;
}

/*==============================
 RADIO
==============================*/

.school-admission .row-inline {
    display: flex;
    gap: 25px;
    flex-wrap: wrap;
    min-height: 54px;
    align-items: center;
}

.school-admission .radio {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 0;
    color: #444;
    cursor: pointer;
}

.school-admission .radio input {
    width: auto;
    height: auto;
}

/*==============================
 FILE INPUT
==============================*/

.school-admission input[type="file"] {
    padding: 12px;
    cursor: pointer;
}

/*==============================
 CHECKBOX
==============================*/

.school-admission input[type="checkbox"] {
    width: auto;
    height: auto;
    margin-right: 8px;
}

.school-admission .span-2 label input[type="checkbox"] {
    position: relative;
    top: 2px;
}

/*==============================
 BUTTONS
==============================*/

.school-admission .actions {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 40px;
    flex-wrap: wrap;
}

.school-admission .btn-light,
.school-admission .btn-primary {
    min-width: 220px;
    padding: 14px 30px;
    border: none;
    border-radius: 50px;
    font-size: 15px;
    font-weight: 600;
    transition: all .4s ease;
}

.school-admission .btn-light {
    background: #eef4fb;
    color: #004484;
}

.school-admission .btn-light:hover {
    transform: translateY(-5px);
    box-shadow: rgba(8, 75, 129, 0.15) 0px 10px 20px;
}

.school-admission .btn-primary {
    color: #fff;
    background: linear-gradient(135deg, #004484, #054b84);
}

.school-admission .btn-primary:hover {
    background: linear-gradient(135deg, #f1b038, #d79a20);
    transform: translateY(-5px);
    box-shadow: rgba(241, 176, 56, 0.35) 0px 12px 25px;
}

/*==============================
 PLACEHOLDER
==============================*/

.school-admission ::placeholder {
    color: #999;
}

/*==============================
 RESPONSIVE
==============================*/

@media (max-width:991px) {

    .school-admission .grid {
        grid-template-columns: 1fr;
    }

    .school-admission .span-2 {
        grid-column: span 1;
    }

    .school-admission .form-card {
        padding: 35px 25px;
    }

    .school-admission .frm-header h1 {
        font-size: 34px;
    }
}

@media (max-width:767px) {

    .school-admission {
        padding: 60px 0;
    }

    .school-admission .frm-header h1 {
        font-size: 28px;
    }

    .school-admission .section-title {
        font-size: 20px;
    }

    .school-admission .row-inline {
        gap: 15px;
    }

    .school-admission .actions {
        flex-direction: column;
    }

    .school-admission .btn-light,
    .school-admission .btn-primary {
        width: 100%;
        min-width: 100%;
    }
}

@media (max-width:576px) {

    .school-admission .form-card {
        padding: 20px;
        border-radius: 18px;
    }

    .school-admission input,
    .school-admission select,
    .school-admission textarea {
        font-size: 13px;
    }

    .school-admission .frm-header p {
        font-size: 14px;
    }
}

/* ============================================
ADMISSION PAGE FORM END
================================================ */
/* ===============================================
MANDATORY DISCLOSER SECTION START
============================================== */
.responsive-table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;

}

.responsive-result-table {
    width: 100%;
    min-width: 850px;
    border-collapse: collapse;
    table-layout: auto;

}

/* Table Heading */
.responsive-result-table thead th {
    padding: 14px 15px;
    font-size: 17px;
    font-weight: 700;
    text-align: left;
    white-space: nowrap;
    vertical-align: middle;
    border: 1px solid #ddd;
}

/* Table Data */
.responsive-result-table tbody td {
    padding: 13px 15px;
    font-size: 15px;
    text-align: left;
    vertical-align: middle;
    border: 1px solid #ddd;
    height: 48px;
}

/* First Column */
.responsive-result-table th:first-child,
.responsive-result-table td:first-child {
    text-align: center;
    width: 90px;
}

/* Year */
.responsive-result-table th:nth-child(2),
.responsive-result-table td:nth-child(2) {
    min-width: 100px;
}

/* Registered Students */
.responsive-result-table th:nth-child(3),
.responsive-result-table td:nth-child(3) {
    min-width: 220px;
}

/* Passed Students */
.responsive-result-table th:nth-child(4),
.responsive-result-table td:nth-child(4) {
    min-width: 210px;
}

/* Percentage */
.responsive-result-table th:nth-child(5),
.responsive-result-table td:nth-child(5) {
    min-width: 170px;
}

/* Remarks */
.responsive-result-table th:nth-child(6),
.responsive-result-table td:nth-child(6) {
    min-width: 150px;
}


/* =========================
   TABLET
========================= */

@media screen and (max-width: 991px) {

    .responsive-result-table {
        min-width: 800px;
    }

    .responsive-result-table thead th {
        padding: 12px;
        font-size: 16px;
    }

    .responsive-result-table tbody td {
        padding: 12px;
        font-size: 14px;
    }
}


/* =========================
   MOBILE
========================= */

@media screen and (max-width: 767px) {

    .responsive-table-wrap {
        width: 100%;
        overflow-x: auto;
    }

    .responsive-result-table {
        min-width: 750px;
    }

    .responsive-result-table thead th {
        padding: 11px 12px;
        font-size: 14px;
    }

    .responsive-result-table tbody td {
        padding: 10px 12px;
        font-size: 13px;
    }
}


/* =========================
   SMALL MOBILE
========================= */

@media screen and (max-width: 480px) {

    .responsive-result-table {
        min-width: 700px;
    }

    .responsive-result-table thead th {
        padding: 10px;
        font-size: 13px;
    }

    .responsive-result-table tbody td {
        padding: 9px 10px;
        font-size: 12px;
    }
}

/* ===============================================
MANDATORY DISCLOSER SECTION END
============================================== */

/* =============================================
ACTIVITY SECTION START
============================================== */

/* activity page img ================= */
.activity-img {
    border: 3px solid #FCD00B;

}

.activity-border {
    border: 1px solid #FCD00B;
    border-radius: 10px;
    padding-top: 20px;
}

.root-heading {
    color: #004484;
}

/* =============================================
ACTIVITY SECTION END
============================================== */

/* ================================
HOME PAGE GALLERY SECTION START
================================ */
/* =========================================================
   OUR GALLERY
========================================================= */

.our-gallery {
    position: relative;
    overflow: hidden;

    padding: 85px 0 !important;


    background: #ffffff;
    background-image: linear-gradient(rgb(255, 255, 255, 0.80), rgba(18, 71, 127, 0.80)), url("../images/background/meassages.png");
    background-size: cover;
    background-repeat: no-repeat;
}


/* =========================================================
   HEADER
========================================================= */

.our-gallery__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 30px;

    margin-bottom: 30px;
}


.our-gallery__heading {
    max-width: 850px;
}


/* Small title */

.our-gallery__title {
    display: block;

    margin-bottom: 7px;

    color: #16447b;

    font-size: 30px;
    line-height: 1.1;
    font-weight: 800;

    text-transform: uppercase;
}

.our-gallery__title span {
    color: #e5aa22;
}


/* Heading */

.our-gallery__heading-text {
    margin: 0 0 8px;

    color: #173f73;

    font-size: 24px;
    font-weight: 700;
}


/* Description */

.our-gallery__text {
    max-width: 700px;

    margin: 0;

    color: #697586;

    font-size: 15px;
    line-height: 1.6;
}


/* =========================================================
   VIEW ALL BUTTON
========================================================= */

.our-gallery__button-wrap {
    flex-shrink: 0;
}


.our-gallery__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;

    min-width: 145px;

    padding: 13px 22px;

    color: #ffffff;

    background: #12477f;

    border-radius: 50px;

    font-size: 14px;
    font-weight: 700;

    text-decoration: none;

    box-shadow: 0 8px 20px rgba(18, 71, 127, 0.18);

    transition: all 0.35s ease;
}


.our-gallery__button i {
    font-size: 16px;

    transition: transform 0.35s ease;
}


.our-gallery__button:hover {
    color: #ffffff;

    background: #e4a91f;

    transform: translateY(-3px);

    box-shadow: 0 12px 25px rgba(228, 169, 31, 0.25);
}


.our-gallery__button:hover i {
    transform: translateX(5px);
}


/* =========================================================
   GALLERY ITEM
========================================================= */

.our-gallery__item {
    position: relative;

    height: 230px;

    overflow: hidden;

    border-radius: 12px;

    background: #eeeeee;

    box-shadow: 0 5px 18px rgba(0, 0, 0, 0.08);

    cursor: pointer;
}


/* Image */

.our-gallery__item>img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform 0.6s ease,
        filter 0.5s ease;
}


/* =========================================================
   OVERLAY
========================================================= */

.our-gallery__overlay {
    position: absolute;

    inset: 0;

    display: flex;
    align-items: flex-end;

    padding: 20px;

    background:
        linear-gradient(to top,
            rgba(5, 36, 70, 0.94) 0%,
            rgba(5, 36, 70, 0.72) 40%,
            rgba(5, 36, 70, 0.05) 100%);

    opacity: 0;

    transform: translateY(15px);

    transition:
        opacity 0.4s ease,
        transform 0.4s ease;
}


/* Content */

.our-gallery__overlay-content {
    width: 100%;

    transform: translateY(20px);

    transition: transform 0.45s ease;
}


/* Category */

.our-gallery__category {
    display: inline-block;

    margin-bottom: 4px;

    color: #f2bd32;

    font-size: 10px;
    font-weight: 700;

    letter-spacing: 1.5px;
    text-transform: uppercase;
}


/* Overlay heading */

.our-gallery__overlay-content h3 {
    margin: 0 0 5px;

    color: #ffffff;

    font-size: 18px;
    line-height: 1.25;
    font-weight: 700;
}


/* Overlay text */

.our-gallery__overlay-content p {
    max-width: 90%;

    margin: 0;

    color: rgba(255, 255, 255, 0.85);

    font-size: 11px;
    line-height: 1.45;
}


/* View icon */

.our-gallery__view {
    position: absolute;

    top: 18px;
    right: 18px;

    width: 36px;
    height: 36px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #164b83;

    background: #ffffff;

    border-radius: 50%;

    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);

    transform: scale(0.6);

    transition: transform 0.4s ease;
}


.our-gallery__view i {
    font-size: 15px;
}


/* =========================================================
   HOVER EFFECT
========================================================= */

.our-gallery__item:hover>img {
    transform: scale(1.10);

    filter: brightness(0.75);
}


.our-gallery__item:hover .our-gallery__overlay {
    opacity: 1;

    transform: translateY(0);
}


.our-gallery__item:hover .our-gallery__overlay-content {
    transform: translateY(0);
}


.our-gallery__item:hover .our-gallery__view {
    transform: scale(1);
}


/* =========================================================
   SLIGHT DIFFERENT HOVER BORDER
========================================================= */

.our-gallery__item::before {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 3;

    border: 2px solid transparent;

    border-radius: 12px;

    pointer-events: none;

    transition: border-color 0.35s ease;
}


.our-gallery__item:hover::before {
    border-color: rgba(242, 189, 50, 0.8);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 991px) {

    .our-gallery {
        padding: 70px 0 !important;
    }

    .our-gallery__header {
        align-items: flex-start;
    }

    .our-gallery__title {
        font-size: 27px;
    }

    .our-gallery__item {
        height: 210px;
    }
}


@media (max-width: 767px) {

    .our-gallery {
        padding: 60px 0 !important;
    }

    .our-gallery__header {
        flex-direction: column;

        align-items: flex-start;

        gap: 20px;
    }

    .our-gallery__title {
        font-size: 26px;
    }

    .our-gallery__heading-text {
        font-size: 21px;
    }

    .our-gallery__text {
        font-size: 14px;
    }

    .our-gallery__item {
        height: 220px;
    }
}


@media (max-width: 575px) {

    .our-gallery__item {
        height: 240px;
    }

    .our-gallery__overlay {
        padding: 18px;
    }

    .our-gallery__overlay-content h3 {
        font-size: 17px;
    }

    .our-gallery__overlay-content p {
        font-size: 11px;
    }
}

/* ================================
HOME PAGE GALLERY SECTION END
================================ */

/* ================================
MISSION SECTION HOME PAGE START
=================================== */
/* =========================================================
   MISSION / VISION / VALUES SECTION
========================================================= */

.mission-vision-section {
    position: relative;

    width: 100%;

    padding: 80px 0 90px;

    overflow: hidden;

    background: #ffffff;
    /* background-image:
        linear-gradient(rgba(193, 193, 193, 0.8),
            rgba(252, 234, 234, 0.8)),
        url("../images/background/meassages.png"); */
    background-image: url("../images/background/meassages.png");
    background-repeat: no-repeat;
    background-size: cover;
}


/* =========================================================
   SECTION HEADING
========================================================= */

.mission-vision-heading {
    max-width: 950px;

    margin: 0 auto 45px;

    text-align: center;
}


/* =========================================================
   SMALL TITLE
========================================================= */

.mission-vision-subtitle {
    position: relative;

    display: inline-block;

    margin-bottom: 10px;

    padding: 0 70px;

    color: #31527d;

    font-size: 15px;

    font-weight: 700;

    letter-spacing: 4px;

    text-transform: uppercase;
}


/* Left Line */

.mission-vision-subtitle::before {
    content: "";

    position: absolute;

    width: 55px;
    height: 3px;

    left: 0;
    top: 50%;

    transform: translateY(-50%);

    background: #e5ad22;

    border-radius: 20px;
}


/* Right Line */

.mission-vision-subtitle::after {
    content: "";

    position: absolute;

    width: 55px;
    height: 3px;

    right: 0;
    top: 50%;

    transform: translateY(-50%);

    background: #e5ad22;

    border-radius: 20px;
}


/* =========================================================
   MAIN HEADING
========================================================= */

.mission-vision-heading h2 {
    margin: 0 0 10px;

    color: #073d73;

    font-size: 46px;

    line-height: 1.2;

    font-weight: 700;
}


/* Gold Heading Part */

.mission-vision-heading h2 span {
    color: #e5a900;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.mission-vision-heading p {
    max-width: 850px;

    margin: 0 auto;

    color: #53617a;

    font-size: 17px;

    line-height: 1.6;

    font-weight: 400;
}


/* =========================================================
   CARD
========================================================= */

.mission-vision-card {
    position: relative;

    height: 350px;

    padding: 27px 55px;

    overflow: hidden;

    border-radius: 17px;

    background: rgba(255, 255, 255, 0.88);

    isolation: isolate;

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}


/* =========================================================
   CARD HOVER
========================================================= */

.mission-vision-card:hover {
    transform: translateY(-7px);
}


/* =========================================================
   ANIMATED BORDER
========================================================= */

.mission-vision-card::before {
    content: "";

    position: absolute;

    inset: 0;

    padding: 2px;

    border-radius: 17px;

    background: conic-gradient(from var(--mv-border-angle),

            transparent 0deg,
            transparent 50deg,

            currentColor 80deg,
            currentColor 105deg,

            transparent 135deg,
            transparent 180deg,

            currentColor 215deg,
            currentColor 240deg,

            transparent 270deg,
            transparent 320deg,

            currentColor 345deg,
            currentColor 360deg);

    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    -webkit-mask-composite: xor;

    mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    mask-composite: exclude;

    pointer-events: none;

    z-index: 10;

    animation:
        missionVisionBorder 6s linear infinite;
}


/* =========================================================
   BORDER ROTATION
========================================================= */

@property --mv-border-angle {

    syntax: "<angle>";

    initial-value: 0deg;

    inherits: false;
}


@keyframes missionVisionBorder {

    from {
        --mv-border-angle: 0deg;
    }

    to {
        --mv-border-angle: 360deg;
    }

}


/* =========================================================
   CARD BACKGROUND ICON
========================================================= */

.mission-vision-bg-icon {
    position: absolute;

    right: 25px;
    top: 25px;

    font-size: 115px;

    line-height: 1;

    opacity: 0.075;

    pointer-events: none;

    z-index: -1;
}


/* =========================================================
   MAIN ICON
========================================================= */

.mission-vision-icon {
    position: relative;

    width: 90px;
    height: 90px;

    margin-bottom: 16px;

    border-radius: 50%;

    display: flex;

    align-items: center;
    justify-content: center;

    z-index: 2;
}


/* Icon Image */

.mission-vision-icon img {
    width: 60px;
    height: 60px;

    object-fit: contain;

    display: block;
}


/* =========================================================
   CARD HEADING
========================================================= */

.mission-vision-card h4 {
    position: relative;

    z-index: 2;

    margin: 0 0 16px;

    color: #083b73;

    font-size: 28px;

    line-height: 1.2;

    font-weight: 700;

    text-transform: capitalize;
}


/* =========================================================
   CARD TEXT
========================================================= */

.mission-vision-card p {
    position: relative;

    z-index: 2;

    max-width: 390px;

    margin: 0;

    color: #53617a;

    font-size: 16px;

    line-height: 1.65;

    font-weight: 400;
}


/* =========================================================
   BOTTOM LINE
========================================================= */

.mission-vision-line {
    position: absolute;

    left: 55px;
    bottom: 28px;

    width: 68px;
    height: 5px;

    border-radius: 20px;

    z-index: 2;
}


/* =========================================================
   MISSION — RED
========================================================= */

.mission-card {

    --mv-border-angle: 0deg;

    color: #ef4059;

    background:
        linear-gradient(135deg,
            rgba(255, 255, 255, 0.96),
            rgba(255, 244, 246, 0.96));
}


.mission-card .mission-vision-icon {
    background: rgba(239, 64, 89, 0.12);
}


.mission-card .mission-vision-bg-icon {
    color: #ef4059;
}


.mission-card .mission-vision-line {
    background: #ef4059;
}


/* =========================================================
   VISION — BLUE
========================================================= */

.vision-card {

    --mv-border-angle: 0deg;

    color: #3c8ce7;

    background:
        linear-gradient(135deg,
            rgba(255, 255, 255, 0.96),
            rgba(242, 248, 255, 0.96));
}


.vision-card .mission-vision-icon {
    background: rgba(60, 140, 231, 0.12);
}


.vision-card .mission-vision-bg-icon {
    color: #3c8ce7;
}


.vision-card .mission-vision-line {
    background: #247de0;
}


/* =========================================================
   VALUES — GREEN
========================================================= */

.values-card {

    --mv-border-angle: 0deg;

    color: #19a463;

    background:
        linear-gradient(135deg,
            rgba(255, 255, 255, 0.96),
            rgba(242, 252, 247, 0.96));
}


.values-card .mission-vision-icon {
    background: rgba(25, 164, 99, 0.12);
}


.values-card .mission-vision-bg-icon {
    color: #19a463;
}


.values-card .mission-vision-line {
    background: #15975a;
}


/* =========================================================
   RESPONSIVE — 1199px
========================================================= */

@media (max-width: 1199px) {

    .mission-vision-section {
        padding: 70px 0 80px;
    }

    .mission-vision-heading h2 {
        font-size: 42px;
    }

    .mission-vision-card {
        height: 390px;

        padding: 25px 35px;
    }

    .mission-vision-line {
        left: 35px;
    }

}


/* =========================================================
   TABLET — 991px
========================================================= */

@media (max-width: 991px) {

    .mission-vision-heading {
        margin-bottom: 35px;
    }

    .mission-vision-heading h2 {
        font-size: 38px;
    }

    .mission-vision-heading p {
        font-size: 16px;

        padding: 0 20px;
    }

    .mission-vision-card {
        height: 390px;

        padding: 25px 30px;
    }

    .mission-vision-line {
        left: 30px;
    }

}


/* =========================================================
   MOBILE — 767px
========================================================= */

@media (max-width: 767px) {

    .mission-vision-section {
        padding: 55px 0 65px;
    }

    .mission-vision-subtitle {
        padding: 0 50px;

        font-size: 13px;

        letter-spacing: 3px;
    }

    .mission-vision-subtitle::before,
    .mission-vision-subtitle::after {
        width: 38px;
    }

    .mission-vision-heading h2 {
        font-size: 32px;
    }

    .mission-vision-heading p {
        font-size: 15px;

        line-height: 1.6;
    }

    .mission-vision-card {
        height: 365px;

        padding: 25px 30px;
    }

    .mission-vision-icon {
        width: 80px;
        height: 80px;
    }

    .mission-vision-card h4 {
        font-size: 26px;
    }

    .mission-vision-card p {
        font-size: 15px;
    }

}


/* =========================================================
   SMALL MOBILE — 575px
========================================================= */

@media (max-width: 575px) {

    .mission-vision-section {
        padding: 45px 15px 55px;
    }

    .mission-vision-subtitle {
        padding: 0 40px;

        font-size: 12px;

        letter-spacing: 2px;
    }

    .mission-vision-subtitle::before,
    .mission-vision-subtitle::after {
        width: 30px;
    }

    .mission-vision-heading h2 {
        font-size: 28px;
    }

    .mission-vision-heading p {
        font-size: 14px;
    }

    .mission-vision-card {
        height: auto;
        min-height: 350px;

        padding: 25px;
    }

    .mission-vision-card h4 {
        font-size: 24px;
    }

    .mission-vision-card p {
        font-size: 15px;
    }

    .mission-vision-line {
        left: 25px;
        bottom: 25px;
    }

}

/* =====================================
OUR MESSAGES SECTION ON HOME PAGE START
======================================== */
/* =========================================================
   OUR MESSAGES SECTION
========================================================= */

.our-messages {
    position: relative;
    overflow: hidden;

    padding: 20px 0;

    background-color: #ffffff;

    background: #ffffff;
    background-image: linear-gradient(rgb(255, 255, 255, 0.80), rgba(255, 255, 255, 0.80)), url("../images/background/meassages.png");
    background-size: cover;
    background-repeat: no-repeat;
}


/* =========================================================
   SECTION HEADER
========================================================= */

.our-messages__header {
    max-width: 850px;
    margin: 0 auto;
}

.our-messages__subtitle {
    position: relative;

    display: inline-flex;
    align-items: center;
    gap: 18px;

    margin-bottom: 8px;

    color: #1c4175;

    font-size: 13px;
    font-weight: 700;
    letter-spacing: 4px;
    text-transform: uppercase;
}

.our-messages__subtitle::before,
.our-messages__subtitle::after {
    content: "";

    width: 55px;
    height: 2px;

    background: #e7b32b;
}


.our-messages__title {
    margin: 0 0 10px;

    color: #123b70;

    font-size: 40px;
    line-height: 1.2;
    font-weight: 700;
}

.our-messages__title span {
    color: #e6a91f;
}


.our-messages__intro {
    max-width: 750px;

    margin: 0 auto;

    color: #667085;

    font-size: 15px;
    line-height: 1.7;
}


/* =========================================================
   MESSAGE CARD
========================================================= */

.our-messages__card {
    position: relative;

    display: flex;
    align-items: stretch;

    min-height: 345px;

    padding: 20px;

    background: rgba(255, 255, 255, 0.96);

    border: 1px solid rgba(20, 55, 100, 0.08);

    border-radius: 18px;

    overflow: hidden;

    box-shadow:
        0 15px 45px rgba(17, 53, 92, 0.10);

    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease;
}

.our-messages__card:hover {
    transform: translateY(-7px);

    box-shadow:
        0 22px 55px rgba(17, 53, 92, 0.16);
}


/* =========================================================
   IMAGE AREA
========================================================= */

.our-messages__image-wrap {
    position: relative;

    flex: 0 0 43%;

    min-height: 300px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 2px;
}


/* Colored shade behind image */

.our-messages__image-wrap::before {
    content: "";

    position: absolute;

    width: 90%;
    height: 90%;

    left: 0;
    top: 5%;

    border-radius: 18px;

    background: #dcecff;

    z-index: 0;

    transition: 0.4s ease;
}


/* Manager blue shade */
.our-messages__card--manager {
    border-left: 4px solid #4e9ce6;
    border-radius: 12px;
}

.our-messages__card--manager .our-messages__image-wrap::before {
    background: rgba(82, 154, 232, 0.22);
}


/* Principal golden shade */

.our-messages__card--principal {
    border-left: 4px solid #e6b42d;
    border-radius: 12px;
}

.our-messages__card--principal .our-messages__image-wrap::before {
    background: rgba(238, 191, 76, 0.24);
}


/* Offset border */

.our-messages__image-border {
    position: absolute;

    width: 90%;
    height: 90%;

    left: 7px;
    top: 10px;

    border: 2px solid #4f9de8;

    border-radius: 18px;

    z-index: 1;

    transition: 0.4s ease;
}


/* Principal border */

.our-messages__card--principal .our-messages__image-border {
    border-color: #e8b52d;
}


/* Image */

.our-messages__image {
    position: relative;

    width: 87%;
    height: 88%;

    z-index: 2;

    overflow: hidden;

    border-radius: 14px;

    background: #f4f4f4;

    box-shadow:
        0 10px 25px rgba(0, 0, 0, 0.12);
}

.our-messages__image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition: transform 0.5s ease;
}


.our-messages__card:hover .our-messages__image img {
    transform: scale(1.04);
}


/* =========================================================
   CONTENT
========================================================= */

.our-messages__content {
    flex: 1;

    position: relative;

    padding: 12px 8px 10px 22px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    text-align: justify;
}


/* =========================================================
   QUOTE ICON
========================================================= */

.our-messages__quote {
    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 10px;

    border-radius: 10px;

    background: rgba(43, 132, 220, 0.12);
}

.our-messages.our-messages__quote {
    font-size: 27px;
    line-height: 1;

    color: #287fd1;
}


/* Principal quote */

.our-messages__card--principal .our-messages__quote {
    background: rgba(224, 168, 32, 0.14);
}

.our-messages__card--principal .our-messages.our-messages__quote {
    color: #dfa51c;
}


/* =========================================================
   MESSAGE HEADING
========================================================= */

.our-messages__content h3 {
    margin: 0 0 9px;

    color: #173f73;

    font-size: 21px;
    line-height: 1.3;
    font-weight: 700;
}


/* =========================================================
   MESSAGE TEXT
========================================================= */

.our-messages__text {
    margin: 0 0 15px;

    color: #697586;

    font-size: 13px;
    line-height: 1.65;
    text-align: justify;
}


/* =========================================================
   SIGNATURE / NAME
========================================================= */

.our-messages__signature {
    margin-top: auto;
}

.our-messages__signature span {
    display: block;

    color: #17467e;

    font-size: 14px;
    font-weight: 800;

    text-transform: uppercase;
}

.our-messages__signature small {
    display: block;

    margin-top: 2px;

    color: #6d7886;

    font-size: 12px;
    font-weight: 500;
}


/* =========================================================
   DECORATIVE BOTTOM LINE
========================================================= */

.our-messages__card::after {
    content: "";

    position: absolute;

    left: 20px;
    bottom: 0;

    width: 0;
    height: 3px;

    border-radius: 10px;

    background: #2d83d4;

    transition: width 0.4s ease;
}

.our-messages__card--principal::after {
    background: #e5ae27;
}

.our-messages__card:hover::after {
    width: calc(100% - 40px);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199px) {

    .our-messages__card {
        min-height: 330px;
        padding: 16px;
    }

    .our-messages__content {
        padding-left: 18px;
    }

    .our-messages__text {
        font-size: 12px;
    }

    .our-messages__content h3 {
        font-size: 19px;
    }
}


@media (max-width: 991px) {

    .our-messages {
        padding: 70px 0 !important;
    }

    .our-messages__title {
        font-size: 36px;
    }

    .our-messages__card {
        min-height: 340px;
    }
}


@media (max-width: 767px) {

    .our-messages {
        padding: 60px 0 !important;
    }

    .our-messages__title {
        font-size: 30px;
    }

    .our-messages__subtitle {
        font-size: 11px;
        letter-spacing: 3px;
    }

    .our-messages__subtitle::before,
    .our-messages__subtitle::after {
        width: 35px;
    }

    .our-messages__card {
        flex-direction: column;

        min-height: auto;

        padding: 15px;
    }

    .our-messages__image-wrap {
        flex: none;

        width: 100%;
        height: 300px;

        min-height: 300px;
    }

    .our-messages__content {
        padding: 20px 8px 10px;
    }

    .our-messages__signature {
        margin-top: 8px;
    }

    .our-messages__card::after {
        left: 15px;
    }

    .our-messages__card:hover::after {
        width: calc(100% - 30px);
    }
}


@media (max-width: 480px) {

    .our-messages__title {
        font-size: 27px;
    }

    .our-messages__intro {
        font-size: 14px;
    }

    .our-messages__image-wrap {
        height: 270px;
        min-height: 270px;
    }

    .our-messages__content h3 {
        font-size: 18px;
    }

    .our-messages__text {
        font-size: 13px;
    }
}

/* =====================================
OUR MESSAGES SECTION ON HOME PAGE END
======================================== */

/* =========================================
OUR SERVICESS SECTION START
============================================== */
/* =====================================
   ACADEMICS SECTION
   ===================================== */

.academics.academics-section {
    padding: 75px 0;
    background: #ffffff;
    overflow: hidden;
    /* background: #ffffff;
    background-image: linear-gradient(rgb(255, 255, 255, 0.80), rgba(229, 170, 34, 0.18)); */
}

/* Heading */

.academics.academics-heading {
    max-width: 850px;
    margin: 0 auto 35px;
}

.academics.academics-subtitle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #23477d;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 3px;
    margin-bottom: 5px;
}

.academics.academics-subtitle i {
    color: #d9a72c;
    font-size: 18px;
    line-height: 0;
}

.academics.academics-title {
    margin: 0 0 10px;
    color: #123765;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.15;
}

.academics.academics-title span {
    color: #d69a19;
}

.academics.academics-intro {
    max-width: 760px;
    margin: 0 auto;
    color: #606b7b;
    font-size: 15px;
    line-height: 1.65;
}


/* =====================================
   CARD
   ===================================== */

.academics.academics-card {
    position: relative;
    min-height: 230px;
    margin: 0 10px 20px;
    padding: 25px 22px 22px;
    border: 1px solid rgba(30, 70, 120, 0.12);
    border-top: 2px solid;
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
    transition: all 0.35s ease;
    box-shadow: 0 8px 25px rgba(20, 45, 80, 0.07);
}

/* glowing top border */

.academics.academics-card::before {
    content: "";
    position: absolute;
    top: -3px;
    left: 15%;
    width: 70%;
    height: 5px;
    border-radius: 50%;
    filter: blur(5px);
    opacity: 0.85;
}

/* Hover */

.academics.academics-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 15px 35px rgba(30, 60, 100, 0.13);
}


/* =====================================
   ICON
   ===================================== */

.academics.academics-icon {
    width: 58px;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin-bottom: 15px;
    position: relative;
    z-index: 2;
}

.academics.academics-icon i {
    font-size: 25px;
}


/* =====================================
   CONTENT
   ===================================== */

.academics.academics-content {
    position: relative;
    z-index: 2;
    max-width: 90%;
}

.academics.academics-content h3 {
    margin: 0 0 9px;
    color: #173b70;
    font-size: 19px;
    font-weight: 800;
}

.academics.academics-content p {
    margin: 0;
    color: #657080;
    font-size: 14px;
    line-height: 1.55;
}

.academics.academics-line {
    display: block;
    width: 42px;
    height: 3px;
    border-radius: 10px;
    margin-top: 14px;
}


/* =====================================
   BACKGROUND ICON
   ===================================== */

.academics.academics-bg-icon {
    position: absolute;
    right: 15px;
    top: 35px;
    font-size: 90px;
    opacity: 0.055;
    transform: rotate(-8deg);
    transition: 0.4s ease;
}

.academics.academics-card:hover .academics.academics-bg-icon {
    transform: rotate(0deg) scale(1.08);
    opacity: 0.09;
}


/* =====================================
   RED
   ===================================== */

.academics.academics-card-red {
    border-top-color: #e45b68;
    background: linear-gradient(145deg, #fff, #fff8f8);
    box-shadow:
        0 0 12px rgba(228, 91, 104, 0.35),
        0 0 25px rgba(228, 91, 104, 0.22),
        0 0 45px rgba(228, 91, 104, 0.12);
}

.academics.academics-card-red::before {
    background: #e45b68;
    box-shadow: 0 0 12px #e45b68;
}

.academics.academics-card-red .academics-icon {
    color: #d9283f;
    background: rgba(217, 40, 63, 0.10);
}

.academics.academics-card-red .academics-line {
    background: #d9283f;
}

.academics.academics-card-red .academics-bg-icon {
    color: #d9283f;
}


/* =====================================
   BLUE
   ===================================== */

.academics.academics-card-blue {
    border-top-color: #5394e8;
    background: linear-gradient(145deg, #fff, #f7fbff);
    box-shadow:
        0 0 12px rgba(83, 148, 232, 0.35),
        0 0 25px rgba(83, 148, 232, 0.22),
        0 0 45px rgba(83, 148, 232, 0.12);
}

.academics.academics-card-blue::before {
    background: #5394e8;
    box-shadow: 0 0 12px #5394e8;
}

.academics.academics-card-blue .academics-icon {
    color: #1765c0;
    background: rgba(23, 101, 192, 0.10);
}

.academics.academics-card-blue .academics-line {
    background: #1765c0;
}

.academics.academics-card-blue .academics-bg-icon {
    color: #1765c0;
}


/* =====================================
   GREEN
   ===================================== */

.academics.academics-card-green {
    border-top-color: #56bd82;
    background: linear-gradient(145deg, #fff, #f7fff9);
    box-shadow:
        0 0 12px rgba(86, 189, 130, 0.35),
        0 0 25px rgba(86, 189, 130, 0.22),
        0 0 45px rgba(86, 189, 130, 0.12);
}

.academics.academics-card-green::before {
    background: #56bd82;
    box-shadow: 0 0 12px #56bd82;
}

.academics.academics-card-green .academics-icon {
    color: #139447;
    background: rgba(19, 148, 71, 0.10);
}

.academics.academics-card-green .academics-line {
    background: #139447;
}

.academics.academics-card-green .academics-bg-icon {
    color: #139447;
}


/* =====================================
   PURPLE
   ===================================== */

.academics.academics-card-purple {
    border-top-color: #a16bd7;
    background: linear-gradient(145deg, #fff, #fcf8ff);
    box-shadow:
        0 0 12px rgba(161, 107, 215, 0.35),
        0 0 25px rgba(161, 107, 215, 0.22),
        0 0 45px rgba(161, 107, 215, 0.12);
}

.academics.academics-card-purple::before {
    background: #a16bd7;
    box-shadow: 0 0 12px #a16bd7;
}

.academics.academics-card-purple .academics-icon {
    color: #7627c7;
    background: rgba(118, 39, 199, 0.10);
}

.academics.academics-card-purple .academics-line {
    background: #7627c7;
}

.academics.academics-card-purple .academics-bg-icon {
    color: #7627c7;
}


/* =====================================
   YELLOW
   ===================================== */

.academics.academics-card-yellow {
    border-top-color: #e7c45b;
    background: linear-gradient(145deg, #fff, #fffdf5);
    box-shadow:
        0 0 12px rgba(231, 196, 91, 0.35),
        0 0 25px rgba(231, 196, 91, 0.22),
        0 0 45px rgba(231, 196, 91, 0.12);
}

.academics.academics-card-yellow::before {
    background: #e7c45b;
    box-shadow: 0 0 12px #e7c45b;
}

.academics.academics-card-yellow .academics-icon {
    color: #c99708;
    background: rgba(201, 151, 8, 0.11);
}

.academics.academics-card-yellow .academics-line {
    background: #c99708;
}

.academics.academics-card-yellow .academics-bg-icon {
    color: #c99708;
}


/* =====================================
   PINK
   ===================================== */

.academics.academics-card-pink {
    border-top-color: #df76a7;
    background: linear-gradient(145deg, #fff, #fff8fc);
    box-shadow:
        0 0 12px rgba(223, 118, 167, 0.35),
        0 0 25px rgba(223, 118, 167, 0.22),
        0 0 45px rgba(223, 118, 167, 0.12);
}

.academics.academics-card-pink::before {
    background: #df76a7;
    box-shadow: 0 0 12px #df76a7;
}

.academics.academics-card-pink .academics-icon {
    color: #cf2e72;
    background: rgba(207, 46, 114, 0.10);
}

.academics.academics-card-pink .academics-line {
    background: #cf2e72;
}

.academics.academics-card-pink .academics-bg-icon {
    color: #cf2e72;
}


/* =====================================
   SKY
   ===================================== */

.academics.academics-card-sky {
    border-top-color: #63b4df;
    background: linear-gradient(145deg, #fff, #f7fcff);
    box-shadow:
        0 0 12px rgba(99, 180, 223, 0.35),
        0 0 25px rgba(99, 180, 223, 0.22),
        0 0 45px rgba(99, 180, 223, 0.12);
}

.academics.academics-card-sky::before {
    background: #63b4df;
    box-shadow: 0 0 12px #63b4df;
}

.academics.academics-card-sky .academics-icon {
    color: #0879bb;
    background: rgba(8, 121, 187, 0.10);
}

.academics.academics-card-sky .academics-line {
    background: #0879bb;
}

.academics.academics-card-sky .academics-bg-icon {
    color: #0879bb;
}


/* =====================================
   ORANGE
   ===================================== */

.academics.academics-card-orange {
    border-top-color: #eca25b;
    background: linear-gradient(145deg, #fff, #fffaf5);
    box-shadow:
        0 0 12px rgba(236, 162, 91, 0.35),
        0 0 25px rgba(236, 162, 91, 0.22),
        0 0 45px rgba(236, 162, 91, 0.12);
}

.academics.academics-card-orange::before {
    background: #eca25b;
    box-shadow: 0 0 12px #eca25b;
}

.academics.academics-card-orange .academics-icon {
    color: #e27617;
    background: rgba(226, 118, 23, 0.11);
}

.academics.academics-card-orange .academics-line {
    background: #e27617;
}

.academics.academics-card-orange .academics-bg-icon {
    color: #e27617;
}


/* =====================================
   RESPONSIVE
   ===================================== */

@media (max-width: 991px) {

    .academics.academics-section {
        padding: 60px 0;
    }

    .academics.academics-title {
        font-size: 36px;
    }

    .academics.academics-card {
        min-height: 220px;
        margin: 0 7px 15px;
    }
}


@media (max-width: 575px) {

    .academics.academics-section {
        padding: 50px 0;
    }

    .academics.academics-heading {
        margin-bottom: 25px;
        padding: 0 10px;
    }

    .academics.academics-subtitle {
        font-size: 11px;
        letter-spacing: 2px;
    }

    .academics.academics-title {
        font-size: 30px;
    }

    .academics.academics-intro {
        font-size: 14px;
    }

    .academics.academics-card {
        min-height: 205px;
        padding: 22px 23px;
        margin: 0 0 15px;
    }

    .academics.academics-content h3 {
        font-size: 18px;
    }

    .academics.academics-content p {
        font-size: 13.5px;
    }

    .academics.academics-bg-icon {
        font-size: 75px;
    }
}

/* =========================================
OUR SERVICESS SECTION END
============================================== */

/* =============================================
WHAT WE DO SECTION START ON HOME PAGE 
=============================================== */
/* =========================================================
   WHAT WE PROVIDE SECTION
========================================================= */

.privide {
    position: relative;
    overflow: hidden;

    padding: 70px 0 75px;

    background-color: #ffffff;


    background-image:
        linear-gradient(rgba(255, 255, 255, 0.80),
            rgba(255, 255, 255, 0.80)),
        url("../images/background/meassages.png");

    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}


/* =========================================================
   SECTION HEADING
========================================================= */

.privide__head {
    max-width: 760px;

    margin: 0 auto 35px;
}


/* Main heading */

.privide__subtitle {
    display: block;

    color: #063d73;

    font-size: 30px;
    line-height: 1.2;

    font-weight: 700;

    letter-spacing: 0.3px;
}


/* Yellow line */

.privide__line {
    display: block;

    width: 48px;
    height: 4px;

    margin: 9px auto 12px;

    background: #f5b417;

    border-radius: 20px;
}


/* Description */

.privide__intro {
    max-width: 680px;

    margin: 0 auto;

    color: #52606d;

    font-size: 14px;
    line-height: 1.65;
}


/* =========================================================
   CARDS ROW
========================================================= */

.privide__row {
    position: relative;
    z-index: 2;
}


/* =========================================================
   CARD
========================================================= */

.privide__card {
    position: relative;

    min-height: 125px;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    padding: 18px 15px;

    text-align: center;

    border-radius: 10px;

    border: 1px solid rgba(35, 70, 100, 0.12);

    box-shadow:
        0 5px 18px rgba(20, 50, 80, 0.08);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}


/* =========================================================
   SOFT CARD BACKGROUNDS
========================================================= */

.privide__card--yellow {
    background: rgba(255, 250, 236, 0.96);
}

.privide__card--blue {
    background: rgba(239, 248, 255, 0.96);
}

.privide__card--green {
    background: rgba(239, 251, 246, 0.96);
}

.privide__card--purple {
    background: rgba(247, 244, 255, 0.96);
}

.privide__card--violet {
    background: rgba(248, 244, 255, 0.96);
}

.privide__card--red {
    background: rgba(255, 244, 244, 0.96);
}

.privide__card--sky {
    background: rgba(241, 249, 255, 0.96);
}

.privide__card--orange {
    background: rgba(255, 249, 237, 0.96);
}


/* =========================================================
   ICON CIRCLE
========================================================= */

.privide__icon {
    width: 80px;
    height: 80px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 10px;

    border-radius: 50%;

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;

}

.privide__icon i {
    font-size: 40px;
}

/* Bootstrap Icon */

.privide__icon i.privide {
    font-size: 21px;
    line-height: 1;
}


/* Individual icon colors */

.privide__card--yellow .privide__icon {
    color: #d99400;
    background: rgba(245, 180, 23, 0.16);
}

.privide__card--blue .privide__icon {
    color: #1681cf;
    background: rgba(22, 129, 207, 0.13);
}

.privide__card--green .privide__icon {
    color: #159c72;
    background: rgba(21, 156, 114, 0.13);
}

.privide__card--purple .privide__icon {
    color: #7063d8;
    background: rgba(112, 99, 216, 0.13);
}

.privide__card--violet .privide__icon {
    color: #7952c7;
    background: rgba(121, 82, 199, 0.13);
}

.privide__card--red .privide__icon {
    color: #e44747;
    background: rgba(228, 71, 71, 0.13);
}

.privide__card--sky .privide__icon {
    color: #1678b7;
    background: rgba(22, 120, 183, 0.13);
}

.privide__card--orange .privide__icon {
    color: #e79a16;
    background: rgba(231, 154, 22, 0.14);
}


/* =========================================================
   CARD HEADING
========================================================= */

.privide__card h3 {
    margin: 0;

    color: #153d63;

    font-size: 30px;
    line-height: 1.35;

    font-weight: 700;
}


/* =========================================================
   HOVER
========================================================= */

.privide__card:hover {
    transform: translateY(-6px);

    box-shadow:
        0 12px 28px rgba(20, 50, 80, 0.14);
}


.privide__card:hover .privide__icon {
    transform: translateY(-3px) scale(1.08);

    box-shadow:
        0 5px 12px rgba(0, 0, 0, 0.08);
}


/* =========================================================
   RESPONSIVE - TABLET
========================================================= */

@media (max-width: 991px) {

    .privide {
        padding: 60px 0 65px;
    }

    .privide__head {
        margin-bottom: 30px;
    }

    .privide__subtitle {
        font-size: 28px;
    }

    .privide__card {
        min-height: 120px;
    }
}


/* =========================================================
   RESPONSIVE - MOBILE
========================================================= */

@media (max-width: 767px) {

    .privide {
        padding: 50px 0 55px;
    }

    .privide__subtitle {
        font-size: 25px;
    }

    .privide__intro {
        padding: 0 15px;

        font-size: 14px;
    }

    .privide__card {
        min-height: 120px;
    }

    .privide__card h3 {
        font-size: 14px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575px) {

    .privide {
        padding: 45px 15px 50px;
    }

    .privide__subtitle {
        font-size: 23px;
    }

    .privide__line {
        width: 42px;
        height: 3px;
    }

    .privide__card {
        min-height: 115px;

        padding: 15px 8px;

        border-radius: 9px;
    }

    .privide__icon {
        width: 44px;
        height: 44px;

        margin-bottom: 8px;
    }

    .privide__icon i.privide {
        font-size: 19px;
    }

    .privide__card h3 {
        font-size: 13px;
    }
}

/* =============================================
WHAT WE DO SECTION END ON HOME PAGE 
=============================================== */


/* =========================================
HOME PAGE SLIDER SECTION START
=========================================== */
/* =========================================================
   TESTIMONIAL SECTION
========================================================= */

.hm-testimonial {
    position: relative;
    overflow: hidden;

    padding: 65px 0 55px;

    background:
        linear-gradient(rgba(255, 252, 244, 0.96),
            rgba(255, 252, 244, 0.96)),
        #ffffff;
}

.hm-testimonial i {
    color: white;
    font-size: 25px;
}


/* =========================================================
   HEADING
========================================================= */

.hm-testimonial__head {
    margin-bottom: 35px;
}

.hm-testimonial__title {
    margin: 0;

    color: #f5b417;

    font-size: 30px;
    line-height: 1.2;
    font-weight: 700;
}

.hm-testimonial__title span {
    color: #063d73;
}

.hm-testimonial__line {
    position: relative;

    display: block;

    width: 48px;
    height: 3px;

    margin: 8px auto 6px;

    background: #f5b417;

    border-radius: 20px;
}

.hm-testimonial__subtitle {
    margin: 0;

    color: #52606d;

    font-size: 13px;
    font-weight: 500;
}


/* =========================================================
   SLIDER
========================================================= */

.hm-testimonial__slider {
    position: relative;

    padding: 0 42px;
}


/* Owl item */

.hm-testimonial__slider .owl-item {
    padding: 5px 7px 12px;
}


/* =========================================================
   CARD
========================================================= */

.hm-testimonial__card {
    position: relative;

    height: 321px;

    padding: 35px 28px 20px 52px;

    background: #ffffff;

    border: 1px solid rgba(6, 61, 115, 0.06);

    border-radius: 13px;

    box-shadow:
        0 7px 25px rgba(25, 55, 90, 0.09);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;

}

/* ==================
CARDS BORDER START
===================== */

.hm-crd-1 {
    border-bottom: 4px solid #044f90;

}

.hm-crd-2 {
    border-bottom: 4px solid #e45b68;

}

.hm-crd-3 {
    border-bottom: 4px solid #139447;

}

.hm-crd-4 {
    border-bottom: 4px solid #7627c7;


}

/* ==================
    CARDS BORDER START
    ===================== */

.hm-testimonial__card:hover {
    transform: translateY(-5px);

    box-shadow:
        0 15px 35px rgba(25, 55, 90, 0.14);
}


/* =========================================================
   QUOTE
========================================================= */

.hm-testimonial__quote {
    position: absolute;

    top: 17px;
    left: 20px;

    width: 36px;
    height: 36px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #f5b417;

    border-radius: 50%;

    box-shadow:
        0 4px 10px rgba(245, 180, 23, 0.25);

    z-index: 5;
}


/* IMPORTANT ICON SELECTOR */

.hm-testimonial__quote i.hm-testimonial {
    color: #fff;

    font-size: 25px;

    line-height: 1;
}



/* =========================================================
   CONTENT
========================================================= */

.hm-testimonial__content {
    height: 100%;

    display: flex;
    flex-direction: column;
}

.hm-testimonial__content p {
    margin: 0 0 15px;

    color: #53606d;

    font-size: 16px;

    line-height: 1.65;

    padding-left: 20px;

    padding-top: 25px;
}


/* =========================================================
   AUTHOR
========================================================= */

.hm-testimonial__author {
    display: flex;
    align-items: center;

    gap: 12px;

    margin-top: auto;
}


.hm-testimonial__author-image {
    width: 48px;
    height: 48px;

    flex: 0 0 48px;

    overflow: hidden;

    border-radius: 50%;

    border: 3px solid #ffffff;

    background: #eeeeee;

    box-shadow:
        0 3px 10px rgba(0, 0, 0, 0.15);
}


.hm-testimonial__author-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
}


.hm-testimonial__author-info h5 {
    margin: 0 0 3px;

    color: #063d73;

    font-size: 16px;

    font-weight: 700;
}


.hm-testimonial__author-info span {
    display: block;

    color: #929292;

    font-size: 14px;
}


/* =========================================================
   OWL ARROWS
========================================================= */

.hm-testimonial__slider .owl-nav {
    display: block !important;

    margin: 0 !important;
}


/* Both arrows */

.hm-testimonial__slider .owl-nav button.owl-prev,
.hm-testimonial__slider .owl-nav button.owl-next {
    position: absolute;

    top: 50%;

    width: 38px;
    height: 38px;

    margin: 0 !important;

    display: flex !important;
    align-items: center;
    justify-content: center;

    transform: translateY(-50%);

    background: #f5b417 !important;

    color: #ffffff !important;

    border: none !important;

    border-radius: 50% !important;

    box-shadow:
        0 5px 15px rgba(245, 180, 23, 0.25);

    transition: all 0.3s ease;
}


/* Left */

.hm-testimonial__slider .owl-nav button.owl-prev {
    left: -5px;
}


/* Right */

.hm-testimonial__slider .owl-nav button.owl-next {
    right: -5px;
}


/* Arrow */

.hm-testimonial__slider .owl-nav button span {
    color: #ffffff !important;

    font-size: 25px;

    line-height: 1;
}


/* Hover */

.hm-testimonial__slider .owl-nav button:hover {
    background: #063d73 !important;

    transform:
        translateY(-50%) scale(1.08);
}


/* =========================================================
   DOTS
========================================================= */

.hm-testimonial__slider .owl-dots {
    margin-top: 15px !important;

    text-align: center;
}


.hm-testimonial__slider .owl-dots .owl-dot {
    margin: 0 3px;
}


.hm-testimonial__slider .owl-dots .owl-dot span {
    width: 8px;
    height: 8px;

    margin: 0;

    background: #d8dce1;

    border-radius: 50%;

    transition: all 0.3s ease;
}


.hm-testimonial__slider .owl-dots .owl-dot.active span {
    width: 21px;

    border-radius: 20px;

    background: #063d73;
}


/* =========================================================
   BACKGROUND DECORATION
========================================================= */

.hm-testimonial::before {
    content: "";

    position: absolute;

    width: 280px;
    height: 280px;

    left: -190px;
    top: 50%;

    transform: translateY(-50%);

    border: 1px solid rgba(6, 61, 115, 0.04);

    border-radius: 50%;

    box-shadow:
        0 0 0 35px rgba(6, 61, 115, 0.012),
        0 0 0 70px rgba(6, 61, 115, 0.008);

    pointer-events: none;
}


.hm-testimonial::after {
    content: "";

    position: absolute;

    width: 240px;
    height: 240px;

    right: -150px;
    bottom: -130px;

    border-radius: 50%;

    background: rgba(245, 180, 23, 0.035);

    pointer-events: none;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .hm-testimonial__slider {
        padding: 0 35px;
    }

    .hm-testimonial__card {
        height: 215px;

        padding-left: 48px;
    }

    .hm-testimonial__slider .owl-nav button.owl-prev {
        left: -2px;
    }

    .hm-testimonial__slider .owl-nav button.owl-next {
        right: -2px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .hm-testimonial {
        padding: 50px 0;
    }

    .hm-testimonial__title {
        font-size: 27px;
    }

    .hm-testimonial__slider {
        padding: 0 30px;
    }

    .hm-testimonial__card {
        height: 220px;

        padding:
            35px 20px 20px 45px;
    }

    .hm-testimonial__slider .owl-nav button.owl-prev {
        left: -2px;
    }

    .hm-testimonial__slider .owl-nav button.owl-next {
        right: -2px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575px) {

    .hm-testimonial__title {
        font-size: 24px;
    }

    .hm-testimonial__slider {
        padding: 0 25px;
    }

    .hm-testimonial__card {
        height: 225px;

        padding:
            35px 17px 20px 42px;
    }

    .hm-testimonial__content p {
        font-size: 11px;

    }

    .hm-testimonial__author-info h5 {
        font-size: 12px;
    }

    .hm-testimonial__slider .owl-nav button.owl-prev,
    .hm-testimonial__slider .owl-nav button.owl-next {
        width: 32px;
        height: 32px;
    }
}

/* =========================================
HOME PAGE SLIDER SECTION END TESTIMONIAL
=========================================== */


/* =============================================
POP_UP FORM SECTION START
============================================== */


.popup-form-section {
    z-index: 9999 !important;
    border: 1px solid green;
    position: relative;

}

.popup-form {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    background: rgba(0, 0, 0, 0.6);
    z-index: 999;
    animation: fadeBg 0.3s ease;
    overflow-y: auto;
    padding: 0 15px 0 15px;
}

/* Box */
.form-box {
    background: #fff;
    width: 100%;
    max-width: 960px;
    margin: 25px auto;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 25px 50px rgba(47, 111, 255, 0.30),
        0 10px 20px rgba(47, 111, 255, 0.20),
        0 0 25px rgba(47, 111, 255, 0.18);

    max-height: calc(100vh - 50px);
    /* Main Fix */
    display: flex;
    align-items: stretch;

    padding: 4px;

    transform: translateY(-30px);
    opacity: 0;
    animation: slideIn .5s ease forwards;
}


.form-box .row {
    width: 100%;
    margin: 0;
    align-items: stretch;
}

/* Left side */
.form-left {
    background-image: url('../images/background/popUp-image.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;

    color: #fff;
    border-radius: 18px 0 0 18px;
    box-shadow: rgba(0, 0, 0, .25) 0 5px 15px;

    display: flex;
    flex-direction: column;
    justify-content: flex-start;

    padding: 30px;
    padding-top: 25px;
    min-height: 100%;
}

.form-left img {
    width: 300px;
    max-width: 100%;
    background: #fff;
    padding: 10px;
    border-radius: 8px;
    /* margin: 0 auto 20px; */
    display: block;
}


.form-left h5 {
    color: #fff;
    font-size: 34px;
    line-height: 1.15;
    font-weight: 700;


}

.form-left h5 span {
    color: #ffb000;
}

.left-line {
    width: 75px;
    height: 4px;
    margin: 10px 0 18px;
}

.form-left p {
    color: #fff;
    font-size: 14px;
    line-height: 1.6;
    margin-top: -18px;
    text-align: justify;
    max-width: 95%;
}

.left-line-p2 {
    padding-top: 10px;
}

/* ==============right side  */


.form-right {
    background: #fff;
    border-radius: 0 18px 18px 0;
    padding: 25px 30px;

    display: flex;
    flex-direction: column;

    position: relative;

    max-height: calc(100vh - 50px);
    overflow-y: auto;
}

.form-right h2 {
    font-size: 25px;
    font-weight: 700;
    color: #11265d;

    margin-bottom: 8px;
}

.sub-title {
    color: #666;
    font-size: 15px;
    margin-bottom: 15px;
}

.title-line {
    width: 70px;
    height: 4px;
    /* background: #ffb000; */
    background: #FFB000;
    background: linear-gradient(90deg, rgba(255, 176, 0, 1) 0%, rgba(255, 176, 0, 1) 18%, rgba(192, 4, 3, 1) 100%);
    border-radius: 20px;

}

.close {
    position: absolute;
    right: 25px;
    top: 25px;
    width: 42px;
    height: 42px;
    background: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 8px 25px rgba(0, 0, 0, .12);
    cursor: pointer;
    transition: .3s;
}

.close:hover {
    transform: rotate(90deg);
    color: #ff6200;
}

/* input form popup */

.form-row-custom {
    display: flex;
    gap: 10px;
}

.input-group-custom {
    display: flex;
    align-items: center;

    border: 1px solid #e6e6e6;
    border-radius: 12px;

    margin-bottom: 12px;
    background: #fff;
    overflow: hidden;
    transition: .3s;
}

.input-group-custom {
    padding: 2px;

}

.input-group-custom:hover,
.input-group-custom:focus-within {
    border-color: #ff6200;
    box-shadow: 0 5px 20px rgba(255, 98, 0, .12);
}

.input-group-custom span {
    width: 60px;
    text-align: center;
    color: #666;
    font-size: 20px;
}

.input-group-custom input,
.input-group-custom select,
.input-group-custom textarea {

    border: none;
    outline: none;
    width: 100%;
    padding: 13px 16px;
    background: transparent;
    font-size: 15px;
}

.input-group-custom textarea {
    resize: none;
}

.textarea-group {
    align-items: flex-start;
}

.textarea-group span {
    padding-top: 18px;
}

.textarea-group textarea {
    height: 90px;
}

.submit-btn {

    width: 100%;
    border: none;
    border-radius: 12px;
    padding: 14px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    transition: .3s;
    background: #020024;
    background: linear-gradient(90deg,
            rgba(2, 0, 36, 1) 0%,
            rgba(9, 9, 121, 1) 35%,
            #b90504 100%);
    color: #fff;

}

.submit-btn:hover {
    background: linear-gradient(90deg, rgba(2, 0, 36, 1) 0%, rgba(9, 9, 121, 1) 35%, rgba(0, 212, 255, 1) 100%);

    transform: translateY(-2px);

    box-shadow: 0 15px 30px rgba(255, 98, 0, .35);

}

.privacy-text {

    text-align: center;
    margin-top: 12px;
    color: #777;
    font-size: 14px;
}

.privacy-text i {

    color: #777;
    margin-right: 6px;
}

/* Animations */
@keyframes fadeBg {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideIn {
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Responsive tweaks */
@media (max-width: 768px) {
    .form-box {
        /* margin: 10% auto; */
        padding: 10px;
    }

    .form-left {
        margin-bottom: 20px;
        text-align: center !important;
    }

    .form-right h2 {
        text-align: center;
    }

    .my-mb {
        margin: 5px 15px 5px 15px;
    }
}

/* ///////logo popup form */
.logo-img img {
    /* margin-left: 2rem; */
    margin: auto;
    width: 100px;
    height: 80px;
}


@media(max-width:991px) {

    .form-box {
        display: block;
        max-width: 95%;
        max-height: 95vh;
        margin: 15px auto;
        overflow-y: auto;
    }

    .form-left {
        border-radius: 18px 18px 0 0;
        padding: 30px 25px;
        text-align: center;
    }

    .form-left img {
        width: 220px;
    }

    .form-left h5 {
        font-size: 34px;
        text-align: center !important;
    }

    .form-left p {
        text-align: center;
    }

    .form-right {
        max-height: none;
        overflow: visible;
        border-radius: 0 0 18px 18px;
        padding: 25px;
    }

    .form-right h2 {
        font-size: 28px;
    }

    .close {
        top: 18px;
        right: 18px;
    }
}

@media(max-width:576px) {

    .popup-form {
        padding: 10px;
    }

    .form-box {
        max-width: 100%;
        border-radius: 15px;
        margin: 10px auto;
    }

    .form-left {
        padding: 25px 18px;
    }

    .form-left img {
        width: 180px;
    }

    .form-left h5 {
        font-size: 28px;
    }

    .form-left p {
        font-size: 14px;
        line-height: 1.7;
    }

    .form-right {
        padding: 20px 15px;
    }

    .form-right h2 {
        font-size: 24px;
    }

    .sub-title {
        font-size: 14px;
    }

    .title-line {
        margin-bottom: 20px;
    }

    .input-group-custom {
        margin-bottom: 10px;
    }

    .input-group-custom span {
        width: 46px;
        font-size: 17px;
    }

    .input-group-custom input,
    .input-group-custom select,
    .input-group-custom textarea {
        padding: 12px;
        font-size: 14px;
    }

    .submit-btn {
        padding: 13px;
        font-size: 15px;
    }

    .privacy-text {
        font-size: 12px;
        margin-top: 10px;
    }
}

/* =============================================
POP_UP FORM SECTION END
============================================== */

/* =================================
SCHOOL RULES SECTION START 
=============================== */
.school-rule-crd {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 34px;

    width: 100%;
    max-width: 1620px;

    margin: 0 auto;

    transform: translateY(-2px);
    padding: 20px 2px 30px 2px;
}

.school-rule-crd h3 {
    font-size: 19px;
    font-weight: 700;
}

/* =================
BoTTOM LINE  IN CARDS 
====================== */
.tsc-line {
    width: 35px;
    height: 3px;
    background-color: currentColor;
    border-radius: 2px;
    margin-top: 20px;
}

/* =================================
SCHOOL RULES SECTION END
=============================== */
/* ===================================================
GENERAL RULES SECTION ON SCHOOL RULES PAGE START
======================================= */

/* ==========================================
   GENERAL SCHOOL RULES
========================================== */
.general-rules {
    position: relative;
    padding: 65px 0;
    overflow: hidden;

    background:
        linear-gradient(135deg,
            rgba(226, 241, 255, 0.35) 0%,
            rgba(255, 255, 255, 0.45) 50%,
            rgba(225, 246, 235, 0.35) 100%),
        url("../images/background/meassages.png");

    background-repeat: no-repeat, no-repeat;
    /* background-position: center, center; */
    background-size: cover, cover;
}

/* LEFT RULES CARD */

.general-rules__list-card {
    height: 100%;
    overflow: hidden;
    background: #fffefa;
    border: 1px solid rgba(20, 61, 116, 0.08);
    border-radius: 18px;
    box-shadow: 0 8px 30px rgba(20, 49, 82, 0.07);
}

/* HEADER */

.general-rules__header {
    display: flex;
    align-items: center;
    gap: 17px;
    padding: 17px 30px;
    background: linear-gradient(110deg, #17447f, #0e3269);
    color: #fff;
}

.general-rules__header>i {
    font-size: 27px;
    line-height: 1;
}

.general-rules__header h2 {
    margin: 0;
    font-size: 25px;
    line-height: 1.3;
    font-weight: 700;
    color: #fff;
}

/* RULES LIST */

.general-rules__list {
    padding: 7px 30px 12px;
}

.general-rules__item {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 12px 0;
    border-bottom: 1px solid #e9e9e9;
}

.general-rules__item:last-child {
    border-bottom: none;
}

.general-rules__number {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #ffdf83;
    color: #173d73;
    font-size: 13px;
    font-weight: 800;
    box-shadow: 0 2px 7px rgba(222, 164, 36, 0.13);
}

.general-rules__content {
    flex: 1;
    min-width: 0;
}

.general-rules__content h3 {
    margin: 0 0 4px;
    color: #153c75;
    font-size: 16px;
    line-height: 1.3;
    font-weight: 750;
}

.general-rules__content p {
    margin: 0;
    color: #686868;
    font-size: 13px;
    line-height: 1.6;
}

/* RIGHT SIDE CARD */

.general-rules__side-card {
    height: 100%;
    min-height: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: #eaf5ff;
    border-radius: 18px;
    box-shadow: 0 8px 28px rgba(20, 49, 82, 0.09);
}

/* TOP IMAGE */

.general-rules__image-top {
    position: relative;
    height: 235px;
    flex-shrink: 0;
    overflow: hidden;
    background: #e9eff2;
}

.general-rules__image-top img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
    transition: transform 0.5s ease;
}

.general-rules__side-card:hover .general-rules__image-top img {
    transform: scale(1.04);
}

.general-rules__image-label {
    position: absolute;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 8px 24px;
    background: rgba(255, 249, 233, 0.94);
    border-radius: 5px;
    box-shadow: 0 5px 18px rgba(0, 0, 0, 0.12);
}

.general-rules__image-label span {
    color: #1c2635;
    font-family: Georgia, serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.12;
}

/* QUOTE AREA */

.general-rules__quote-area {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 25px 24px 0;
    background: linear-gradient(180deg, #edf7ff 0%, #e0f1ff 100%);
}

.general-rules__quote {
    display: flex;
    align-items: flex-start;
    gap: 13px;
}

.general-rules__quote-icon {
    flex: 0 0 39px;
    width: 39px;
    height: 39px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #45a9eb;
    color: #fff;
    font-size: 25px;
}

.general-rules__quote p {
    margin: 0;
    color: #174681;
    font-family: Georgia, serif;
    font-size: 25px;
    line-height: 1.4;
    font-style: italic;
    font-weight: 600;
}

.general-rules__gold-line {
    width: 42%;
    height: 6px;
    margin: 15px 0 8px 52px;
    border-radius: 50%;
    background: #f5bc19;
    transform: rotate(-3deg);
}

/* STUDENTS IMAGE */

.general-rules__students {
    position: relative;
    flex: 1;
    min-height: 225px;
    margin: 0 -24px;
    overflow: hidden;
}

.general-rules__students img {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    object-position: center bottom;
}

.general-rules__habits {
    position: absolute;
    z-index: 2;
    top: 13%;
    right: 5%;
    display: flex;
    flex-direction: column;
    color: #174681;
    font-family: Georgia, serif;
    font-size: 21px;
    line-height: 1.2;
    font-weight: 700;
    font-style: italic;
    transform: rotate(-5deg);
}

/* ==========================================
   TABLET RESPONSIVE
========================================== */

@media (max-width: 991.98px) {
    .general-rules {
        padding: 45px 0;
    }

    .general-rules__side-card {
        min-height: 600px;
    }

    .general-rules__image-top {
        height: 300px;
    }

    .general-rules__quote-area {
        padding-top: 28px;
    }

    .general-rules__quote p {
        font-size: 27px;
    }

    .general-rules__students {
        min-height: 320px;
    }

    .general-rules__habits {
        right: 8%;
        font-size: 25px;
    }
}

/* ==========================================
   MOBILE RESPONSIVE
========================================== */

@media (max-width: 575.98px) {
    .general-rules {
        padding: 35px 0;
    }

    .general-rules .container {
        padding-left: 14px;
        padding-right: 14px;
    }

    .general-rules__list-card {
        border-radius: 13px;
    }

    .general-rules__header {
        gap: 12px;
        padding: 17px 18px;
    }

    .general-rules__header>i {
        font-size: 23px;
    }

    .general-rules__header h2 {
        font-size: 20px;
    }

    .general-rules__list {
        padding: 7px 16px 10px;
    }

    .general-rules__item {
        align-items: flex-start;
        gap: 12px;
        padding: 14px 0;
    }

    .general-rules__number {
        flex-basis: 35px;
        width: 35px;
        height: 35px;
        font-size: 12px;
        margin-top: 1px;
    }

    .general-rules__content h3 {
        font-size: 15px;
        margin-bottom: 5px;
    }

    .general-rules__content p {
        font-size: 12px;
        line-height: 1.65;
    }

    .general-rules__side-card {
        border-radius: 13px;
        min-height: auto;
    }

    .general-rules__image-top {
        height: 230px;
    }

    .general-rules__image-label {
        bottom: 15px;
        padding: 7px 20px;
    }

    .general-rules__image-label span {
        font-size: 25px;
    }

    .general-rules__quote-area {
        padding: 23px 18px 0;
    }

    .general-rules__quote {
        gap: 11px;
    }

    .general-rules__quote-icon {
        flex-basis: 34px;
        width: 34px;
        height: 34px;
        font-size: 22px;
    }

    .general-rules__quote p {
        font-size: 23px;
        line-height: 1.4;
    }

    .general-rules__gold-line {
        margin: 15px 0 8px 45px;
        height: 5px;
    }

    .general-rules__students {
        min-height: 260px;
        margin: 0 -18px;
    }

    .general-rules__habits {
        top: 10%;
        right: 4%;
        font-size: 18px;
    }
}

/* SMALL MOBILE */

@media (max-width: 360px) {
    .general-rules__header h2 {
        font-size: 18px;
    }

    .general-rules__list {
        padding-left: 12px;
        padding-right: 12px;
    }

    .general-rules__item {
        gap: 10px;
    }

    .general-rules__content h3 {
        font-size: 14px;
    }

    .general-rules__content p {
        font-size: 11px;
    }

    .general-rules__quote p {
        font-size: 20px;
    }

    .general-rules__students {
        min-height: 220px;
    }
}

/* ===================================================
GENERAL RULES SECTION ON SCHOOL RULES PAGE END
======================================= */


/* ============================================
ENVIRONMENT SECTION  ON SCHOOL RULE PAGE START
============================================= */

/* ==========================================
   ENVIRONMENT RULE SECTION
========================================== */

.environment-rule {
    position: relative;
    padding: 30px 0px 30px 0;
    overflow: hidden;
    background: linear-gradient(180deg,
            #ffffff 0%,
            #fffefa 55%,
            #f8fcfa 100%);
    margin-bottom: 10px;
}

/* SECTION WRAPPER */

.environment-rule__wrapper {
    position: relative;
    z-index: 1;
}

/* HEADER */

.environment-rule__header {
    text-align: center;
    max-width: 1050px;
    margin: 0 auto 34px;
}

.environment-rule__eyebrow {
    display: inline-block;
    margin-bottom: 10px;
    color: #174681;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.environment-rule__title {
    margin: 0 0 14px;
    color: #173e78;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(28px, 3.2vw, 43px);
    line-height: 1.25;
    font-weight: 700;
}

.environment-rule__title span {
    color: #dba52c;
}

.environment-rule__description {
    max-width: 900px;
    margin: 0 auto;
    color: #687387;
    font-size: 15px;
    line-height: 1.8;
}

/* CARD ROW */

.environment-rule__row {
    align-items: stretch;
}

/* COMMON CARD DESIGN */

.environment-rule__card {
    position: relative;
    height: 100%;
    min-height: 160px;
    padding: 25px 14px 22px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    border: 1px solid transparent;
    border-radius: 17px;
    overflow: hidden;
    isolation: isolate;
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}

/* SHINING BORDER EFFECT */

.environment-rule__card::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 1.5px;
    border-radius: inherit;
    background: linear-gradient(125deg,
            transparent 5%,
            var(--rule-color) 25%,
            #ffffff 45%,
            var(--rule-color) 65%,
            transparent 90%);
    background-size: 250% 250%;
    animation: environmentRuleShine 5s linear infinite;

    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;

    pointer-events: none;
    z-index: -1;
}

/* SOFT COLOR GLOW */

.environment-rule__card::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: var(--rule-glow);
    opacity: 0.55;
    z-index: -2;
    pointer-events: none;
}

@keyframes environmentRuleShine {
    0% {
        background-position: 100% 0%;
    }

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

/* CARD 1 - BLUE */

.environment-rule__card--blue {
    --rule-color: #174b96;
    --rule-glow: linear-gradient(135deg,
            #edf4ff,
            #f5f8ff);

    background: #f0f5ff;
    border-color: rgba(23, 75, 150, 0.2);
    box-shadow:
        0 5px 18px rgba(23, 75, 150, 0.10),
        0 0 12px rgba(23, 75, 150, 0.06);
}

.environment-rule__card--blue .environment-rule__icon {
    color: #174b96;
}

/* CARD 2 - RED */

.environment-rule__card--red {
    --rule-color: #e51c48;
    --rule-glow: linear-gradient(135deg,
            #fff0f3,
            #fff6f7);

    background: #fff1f4;
    border-color: rgba(229, 28, 72, 0.18);
    box-shadow:
        0 5px 18px rgba(229, 28, 72, 0.09),
        0 0 12px rgba(229, 28, 72, 0.05);
}

.environment-rule__card--red .environment-rule__icon {
    color: #e51c48;
}

/* CARD 3 - NAVY */

.environment-rule__card--navy {
    --rule-color: #14529a;
    --rule-glow: linear-gradient(135deg,
            #edf5ff,
            #f4f8ff);

    background: #eff5ff;
    border-color: rgba(20, 82, 154, 0.2);
    box-shadow:
        0 5px 18px rgba(20, 82, 154, 0.09),
        0 0 12px rgba(20, 82, 154, 0.05);
}

.environment-rule__card--navy .environment-rule__icon {
    color: #14529a;
}

/* CARD 4 - GREEN */

.environment-rule__card--green {
    --rule-color: #16a05a;
    --rule-glow: linear-gradient(135deg,
            #edfff4,
            #f6fff9);

    background: #f1fcf5;
    border-color: rgba(22, 160, 90, 0.19);
    box-shadow:
        0 5px 18px rgba(22, 160, 90, 0.09),
        0 0 12px rgba(22, 160, 90, 0.05);
}

.environment-rule__card--green .environment-rule__icon {
    color: #16a05a;
}

/* ICONS */

.environment-rule__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 14px;
    font-size: 43px;
    line-height: 1;
    transition: transform 0.35s ease;
}

/* CARD TEXT */

.environment-rule__card h3 {
    margin: 0 0 5px;
    color: #17345f;
    font-size: 16px;
    line-height: 1.4;
    font-weight: 800;
}

.environment-rule__card p {
    margin: 0;
    color: #687386;
    font-size: 14px;
    line-height: 1.5;
}

/* HOVER EFFECT */

.environment-rule__card:hover {
    transform: translateY(-6px);
    border-color: var(--rule-color);
    box-shadow:
        0 8px 24px var(--rule-color),
        0 0 16px var(--rule-color);
}

.environment-rule__card:hover .environment-rule__icon {
    transform: scale(1.12);
}

/* ==========================================
   TABLET RESPONSIVE
========================================== */

@media (max-width: 991.98px) {
    .environment-rule {
        padding: 50px 0;
    }

    .environment-rule__header {
        margin-bottom: 28px;
    }

    .environment-rule__title {
        font-size: 34px;
    }

    .environment-rule__card {
        min-height: 155px;
    }
}

/* ==========================================
   MOBILE RESPONSIVE
========================================== */

@media (max-width: 575.98px) {
    .environment-rule {
        padding: 40px 0;
    }

    .environment-rule__header {
        margin-bottom: 25px;
    }

    .environment-rule__eyebrow {
        font-size: 10px;
        letter-spacing: 2px;
    }

    .environment-rule__title {
        font-size: 27px;
        line-height: 1.35;
    }

    .environment-rule__description {
        font-size: 13px;
        line-height: 1.7;
        padding: 0 5px;
    }

    .environment-rule__row {
        --bs-gutter-x: 12px;
        --bs-gutter-y: 14px;
    }

    .environment-rule__card {
        min-height: 145px;
        padding: 20px 8px;
        border-radius: 13px;
    }

    .environment-rule__icon {
        font-size: 35px;
        margin-bottom: 12px;
    }

    .environment-rule__card h3 {
        font-size: 14px;
    }

    .environment-rule__card p {
        font-size: 12px;
    }
}

/* REDUCE MOTION FOR ACCESSIBILITY */

@media (prefers-reduced-motion: reduce) {

    .environment-rule__card,
    .environment-rule__icon {
        transition: none;
    }

    .environment-rule__card::before {
        animation: none;
    }
}

/* ============================================
ENVIRONMENT SECTION  ON SCHOOL RULE PAGE END
============================================= */

/* =========================================
RULES BOTTOM STRIP ON SCHOOL RULES PAGE  START
=========================================== */
/* Section Background */
.rules-strip {
    /* Replace 'your-background-image.jpg' with your actual image path */
    background: url('../images/banner/bottom-strip-school-rules.jpeg') no-repeat center center;
    background-size: cover;
    position: relative;
}

/* Optional: Add a subtle overlay to make the center box pop out more against the background */
.rules-strip::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.2);
    z-index: 1;
}

.rules-strip .container {
    position: relative;
    z-index: 2;
}

/* Center White Card Style */
.rules-card {
    background-color: #ffffff;
    border-radius: 20px;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

/* Typography Colors */
.text-navy {
    color: #0d233a;
    /* Deep Navy Blue matching the image */
}

.text-warning-custom {
    color: #f39c12;
    /* Golden/Orange matching the image */
}

/* Custom Button Styles */
.btn-warning-custom {
    background-color: #f1c40f;
    border-color: #f1c40f;
    transition: all 0.3s ease-in-out;
}

.btn-warning-custom:hover {
    background-color: #d4ac0d;
    border-color: #d4ac0d;
    color: #ffffff;
    transform: translateY(-2px);
}

/* =========================================
RULES BOTTOM STRIP ON SCHOOL RULES PAGE  END
=========================================== */

/* ===========================================
TOP 4 CARDS START ON TECAHERS ENQUIRY PAGE START
============================================= */

/* ==========================================
   TEACHERS ENVIRONMENT SECTION
========================================== */

.teachers-en {
    position: relative;
    padding: 20px 0px 30px 0px;
    background: #ffffff;
    overflow: hidden;
    margin-bottom: 10px;
}

.teachers-en__row {
    align-items: stretch;
    margin-left: 0;
    margin-right: 0;
}

/* CARD BASE */

.teachers-en__card {
    --teacher-color: #3196e8;
    --teacher-bg: #f1f8ff;

    position: relative;
    isolation: isolate;
    display: flex;
    align-items: flex-start;
    gap: 13px;
    height: 100%;
    min-height: 90px;
    padding: 30px 14px;

    background: var(--teacher-bg);
    border: 1px solid rgba(0, 0, 0, 0.04);
    border-radius: 11px;
    overflow: hidden;

    box-shadow:
        0 3px 10px rgba(0, 0, 0, 0.035),
        0 0 8px rgba(0, 0, 0, 0.02);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

/* ANIMATED SHINING BORDER */

.teachers-en__card::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 1.3px;
    border-radius: inherit;

    background: linear-gradient(115deg,
            transparent 10%,
            var(--teacher-color) 35%,
            #ffffff 50%,
            var(--teacher-color) 65%,
            transparent 90%);

    background-size: 250% 250%;
    animation: teachersEnShine 4s linear infinite;

    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;

    pointer-events: none;
    z-index: -1;
}

/* SOFT COLOR GLOW */

.teachers-en__card::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: var(--teacher-bg);
    opacity: 0.4;
    z-index: -2;
    pointer-events: none;
}

@keyframes teachersEnShine {
    0% {
        background-position: 100% 0%;
    }

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

/* CARD COLORS */

.teachers-en__card--blue {
    --teacher-color: #2699ed;
    --teacher-bg: #f1f8ff;
}

.teachers-en__card--gold {
    --teacher-color: #f2b51b;
    --teacher-bg: #fffaf0;
}

.teachers-en__card--pink {
    --teacher-color: #ed4775;
    --teacher-bg: #fff3f7;
}

.teachers-en__card--green {
    --teacher-color: #19ad62;
    --teacher-bg: #f0fbf4;
}

/* ICON */

.teachers-en__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 27px;
    width: 27px;
    height: 27px;
    margin-top: 1px;

    color: var(--teacher-color);
    font-size: 15px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.85);

    box-shadow: 0 0 9px rgba(0, 0, 0, 0.035);
    transition: transform 0.3s ease;
}

.teachers-en__icon i {
    font-size: 30px;
}

/* TEXT CONTENT */

.teachers-en__content {
    flex: 1;
    min-width: 0;
}

.teachers-en__content h3 {
    margin: 0 0 5px;
    color: #153b73;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.25;
}

.teachers-en__content p {
    margin: 0;
    color: #626b79;
    font-size: 11px;
    line-height: 1.55;
}

/* HOVER */

.teachers-en__card:hover {
    transform: translateY(-3px);
    box-shadow:
        0 5px 15px rgba(0, 0, 0, 0.05),
        0 0 12px color-mix(in srgb,
            var(--teacher-color) 22%,
            transparent);
}

.teachers-en__card:hover .teachers-en__icon {
    transform: scale(1.1);
}

/* ==========================================
   TABLET
========================================== */

@media (max-width: 991.98px) {
    .teachers-en {
        padding: 15px 0;
    }

    .teachers-en__card {
        min-height: 95px;
        padding: 14px 12px;
        gap: 11px;
    }

    .teachers-en__content h3 {
        font-size: 14px;
    }

    .teachers-en__content p {
        font-size: 12px;
    }
}

/* ==========================================
   MOBILE
========================================== */

@media (max-width: 575.98px) {
    .teachers-en {
        padding: 12px 0;
    }

    .teachers-en__row {
        --bs-gutter-x: 10px;
        --bs-gutter-y: 12px;
    }

    .teachers-en__card {
        min-height: 105px;
        padding: 13px 10px;
        gap: 9px;
        border-radius: 9px;
    }

    .teachers-en__icon {
        flex-basis: 24px;
        width: 24px;
        height: 24px;
        font-size: 13px;
    }

    .teachers-en__content h3 {
        font-size: 13px;
        line-height: 1.3;
    }

    .teachers-en__content p {
        font-size: 11px;
        line-height: 1.45;
    }
}

/* ACCESSIBILITY */

@media (prefers-reduced-motion: reduce) {

    .teachers-en__card,
    .teachers-en__icon {
        transition: none;
    }

    .teachers-en__card::before {
        animation: none;
    }
}

/* ===========================================
TOP 4 CARDS START ON TECAHERS ENQUIRY PAGE END
============================================= */
/* =============================================
TEACHERS ENQUIRY FORM ON TECHERS ENQUIRY PAGE START
=============================================== */
/* ==========================================
   ENQUIRY SECTION
========================================== */

.enquiry-t {
    position: relative;
    padding: 65px 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 0% 100%,
            rgba(83, 190, 242, 0.12),
            transparent 25%),
        radial-gradient(circle at 100% 100%,
            rgba(255, 190, 35, 0.12),
            transparent 25%),
        #ffffff;
    background-image: url("../images/background/meassages.png");
    background-repeat: no-repeat;
    background-size: cover;
}


/* Main Card */

.enquiry-t .enquiry-t__card {
    height: 100%;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #e8edf4;
    border-radius: 19px;
    box-shadow:
        0 8px 28px rgba(13, 50, 91, 0.07),
        0 2px 6px rgba(13, 50, 91, 0.03);
    transition:
        box-shadow 0.35s ease,
        transform 0.35s ease;
}

.enquiry-t .enquiry-t__card:hover {
    box-shadow:
        0 14px 38px rgba(13, 50, 91, 0.12),
        0 4px 12px rgba(13, 50, 91, 0.05);
}


/* ==========================================
   CARD HEADERS
========================================== */

.enquiry-t .enquiry-t__header {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    min-height: 94px;
    padding: 19px 24px 17px;
}

.enquiry-t .enquiry-t__header--blue {
    color: #ffffff;
    background: linear-gradient(120deg,
            #073b83 0%,
            #0754a8 100%);
}

.enquiry-t .enquiry-t__header--gold {
    color: #103d78;
    background: linear-gradient(120deg,
            #fff1ca 0%,
            #fff8e8 100%);
}


/* Header Icons */

.enquiry-t .enquiry-t__header-icon {
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 19px;
}

.enquiry-t .enquiry-t__header--blue .enquiry-t__header-icon {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.22);
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
}

.enquiry-t .enquiry-t__header--gold .enquiry-t__header-icon {
    color: #ffffff;
    background: linear-gradient(145deg, #ffd65b, #efa900);
    box-shadow: 0 4px 12px rgba(227, 165, 0, 0.22);
}


/* Header Text */

.enquiry-t .enquiry-t__header-content {
    flex: 1;
    min-width: 0;
}

.enquiry-t .enquiry-t__title {
    margin: 0 0 5px;

    font-size: 17px;
    font-weight: 700;
    line-height: 1.4;
}

.enquiry-t .enquiry-t__header--blue .enquiry-t__title {
    color: #ffffff;
}

.enquiry-t .enquiry-t__header--gold .enquiry-t__title {
    color: #10427f;
}

.enquiry-t .enquiry-t__description {
    margin: 0;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.6;
}

.enquiry-t .enquiry-t__header--blue .enquiry-t__description {
    color: rgba(255, 255, 255, 0.88);
}

.enquiry-t .enquiry-t__header--gold .enquiry-t__description {
    color: #687383;
}


/* ==========================================
   FORM BODY
========================================== */

.enquiry-t .enquiry-t__body {
    position: relative;
    padding: 21px 22px 23px;
    background: #ffffff;
    border-radius: 17px 17px 0 0;

}

.enquiry-t .enquiry-t__body--other {
    padding: 21px 22px 26px;
}


/* Labels */

.enquiry-t .enquiry-t__label {
    display: block;
    margin-bottom: 6px;
    color: #123b75;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.4;
}

.enquiry-t .enquiry-t__label span {
    color: #e33d47;
    font-weight: 700;
}


/* Input Fields */

.enquiry-t .enquiry-t__input,
.enquiry-t .enquiry-t__textarea,
.enquiry-t .enquiry-t__file {
    width: 100%;
    min-width: 0;
    border: 1px solid #dce3ec;
    border-radius: 7px;
    background-color: #ffffff;
    color: #263b56;
    font-family: Arial, sans-serif;
    font-size: 11px;
    box-shadow: none;
    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background-color 0.25s ease;
}

.enquiry-t .enquiry-t__input {
    height: 34px;
    padding: 6px 10px;
}

.enquiry-t .enquiry-t__textarea {
    min-height: 53px;
    padding: 10px;
    resize: vertical;
}

.enquiry-t .enquiry-t__message {
    min-height: 76px;
}

.enquiry-t .enquiry-t__file {
    min-height: 35px;
    padding: 4px 8px;
}


/* Placeholder */

.enquiry-t .enquiry-t__input::placeholder,
.enquiry-t .enquiry-t__textarea::placeholder {
    color: #a3acb9;
    opacity: 1;
}


/* Focus Effect */

.enquiry-t .enquiry-t__input:focus,
.enquiry-t .enquiry-t__textarea:focus,
.enquiry-t .enquiry-t__file:focus {
    border-color: #3984d6;
    background-color: #ffffff;
    box-shadow: 0 0 0 3px rgba(30, 104, 190, 0.09);
    outline: none;
}


/* Select Fields */

.enquiry-t .enquiry-t__input.form-select {
    padding-right: 30px;
    cursor: pointer;
}


/* File Input */

.enquiry-t .enquiry-t__file::file-selector-button {
    margin: -1px 9px -1px -5px;
    padding: 5px 10px;
    border: none;
    border-radius: 5px;
    background: #edf1f6;
    color: #263b56;
    font-size: 11px;
    cursor: pointer;
}


/* Helper Text */

.enquiry-t .enquiry-t__help {
    display: block;
    margin-top: 5px;
    color: #7c8796;
    font-size: 9px;
    line-height: 1.5;
}


/* ==========================================
   SUBMIT BUTTONS
========================================== */

.enquiry-t .enquiry-t__submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-width: 205px;
    min-height: 42px;
    padding: 11px 24px;
    border: none;
    border-radius: 30px;
    font-family: Georgia, serif;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease;
}

.enquiry-t .enquiry-t__submit--yellow {
    color: #123d78;
    background: linear-gradient(110deg,
            #ffc928 0%,
            #ffb900 55%,
            #f5a900 100%);
    box-shadow: 0 5px 13px rgba(242, 175, 0, 0.17);
}

.enquiry-t .enquiry-t__submit--yellow:hover {
    color: #10356b;
    background: linear-gradient(110deg,
            #ffdc62,
            #ffbd15);
    box-shadow: 0 8px 20px rgba(242, 175, 0, 0.30);
    transform: translateY(-2px);
}

.enquiry-t .enquiry-t__submit--blue {
    color: #ffffff;
    background: linear-gradient(110deg,
            #08428d 0%,
            #0753a9 100%);
    box-shadow: 0 5px 14px rgba(5, 63, 133, 0.17);
}

.enquiry-t .enquiry-t__submit--blue:hover {
    color: #ffffff;
    background: linear-gradient(110deg,
            #0754ac,
            #0866c6);
    box-shadow: 0 8px 22px rgba(5, 63, 133, 0.28);
    transform: translateY(-2px);
}


/* Button Icon */

.enquiry-t .enquiry-t__submit .enquiry-t__icon {
    font-size: 13px;
    transition: transform 0.3s ease;
}

.enquiry-t .enquiry-t__submit:hover .enquiry-t__icon {
    transform: translateX(4px);
}


/* Other Form Button Spacing */

.enquiry-t .enquiry-t__other-button {
    padding-top: 5px;
}


/* ==========================================
   RESPONSIVE DESIGN
========================================== */

@media (min-width: 992px) {

    .enquiry-t .enquiry-t__card--other {
        height: 100%;
    }

}


@media (max-width: 991px) {

    .enquiry-t {
        padding: 50px 0;
    }

    .enquiry-t .enquiry-t__header {
        padding: 18px 20px;
    }

    .enquiry-t .enquiry-t__body,
    .enquiry-t .enquiry-t__body--other {
        padding: 22px 20px;
    }

}


@media (max-width: 575px) {

    .enquiry-t {
        padding: 35px 0;
    }

    .enquiry-t .row.g-4 {
        --bs-gutter-x: 14px;
        --bs-gutter-y: 20px;
    }

    .enquiry-t .enquiry-t__header {
        gap: 10px;
        padding: 17px 15px;
    }

    .enquiry-t .enquiry-t__header-icon {
        flex-basis: 34px;
        width: 34px;
        height: 34px;
        font-size: 17px;
    }

    .enquiry-t .enquiry-t__title {
        font-size: 15px;
    }

    .enquiry-t .enquiry-t__description {
        font-size: 10px;
    }

    .enquiry-t .enquiry-t__body,
    .enquiry-t .enquiry-t__body--other {
        padding: 19px 15px 22px;
    }

    .enquiry-t .enquiry-t__label {
        font-size: 11px;
    }

    .enquiry-t .enquiry-t__submit {
        width: 100%;
        max-width: 260px;
    }

}

/* =================
new css
=================== */
/* =====================================
   ENQUIRY SELECT - FINAL FIX
===================================== */

.enquiry-t .enquiry-t__body select.enquiry-t__input.form-select {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 34px !important;
    box-sizing: border-box !important;
    padding: 6px 32px 6px 10px !important;
    margin: 0 !important;

    font-family: Arial, sans-serif !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
    color: #263b56 !important;

    background-color: #fff !important;
    cursor: pointer !important;
    vertical-align: middle !important;
}

/* Reset globally applied option styling */

.enquiry-t .enquiry-t__body select.enquiry-t__input.form-select option {
    position: static !important;
    display: block !important;
    float: none !important;

    width: auto !important;
    height: auto !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 4px 8px !important;

    color: #263b56 !important;
    background-color: #fff !important;

    font-family: Arial, sans-serif !important;
    font-size: 13px !important;
    line-height: normal !important;
    transform: none !important;
}

/* Prevent form columns from overflowing */

.enquiry-t .enquiry-t__body,
.enquiry-t .enquiry-t__body form,
.enquiry-t .enquiry-t__body .row,
.enquiry-t .enquiry-t__body [class*="col-"] {
    min-width: 0;
}

.enquiry-t .enquiry-t__card {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

/* =============================================
TEACHERS ENQUIRY FORM ON TECHERS ENQUIRY PAGE END
=============================================== */
/* ==============================================
TECHERS ENQUIRY PAGE JOIN US SECTION START
============================================= */
/* ==========================================
   JOIN US BOTTOM STRIP
========================================== */

.join-us {
    position: relative;
    width: 100%;
    padding: 8px 0;
    overflow: hidden;


}


/* Main Wrapper */

.join-us .join-us__wrapper {
    position: relative;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    border: 1px solid rgba(216, 231, 243, 0.8);
    border-radius: 12px;
}


/* ==========================================
   LEFT SCHOOL IMAGE
========================================== */

.join-us .join-us__image-box {
    position: relative;
    width: 100%;
    height: 164px;
    overflow: hidden;
    border-radius: 12px;
    background: #e8f2f8;
}

.join-us .join-us__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;

    transition: transform 0.5s ease;
}

.join-us .join-us__image-box:hover .join-us__image {
    transform: scale(1.04);
}


/* ==========================================
   MIDDLE CONTENT
========================================== */

.join-us .join-us__content {
    position: relative;
    padding: 18px 28px;
}


/* Subtitle */

.join-us .join-us__subtitle {
    display: block;
    margin-bottom: 1px;

    color: #123d79;
    font-family: Georgia, serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.25;
}


/* Main Heading */

.join-us .join-us__title {
    margin: 0;

    color: #e8a900;
    font-family: Georgia, serif;
    font-size: 21px;
    font-weight: 700;
    line-height: 1.25;
}


/* Decorative Divider */

.join-us .join-us__divider {
    width: 62px;
    height: 3px;
    margin: 10px 0 11px;

    border-radius: 10px;
    background: linear-gradient(90deg,
            #ffc928,
            #f0a900);
}


/* Paragraph */

.join-us .join-us__text {
    margin: 0;

    color: #657184;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.7;
}


/* ==========================================
   RIGHT BENEFITS BOX
========================================== */

.join-us .join-us__benefits {
    position: relative;
    margin: 10px 16px 10px 0;
    padding: 12px 20px;

    background: linear-gradient(125deg,
            #eef7ff 0%,
            #f4f9ff 100%);

    border: 1px solid #e4eef8;
    border-radius: 10px;

    box-shadow: 0 4px 15px rgba(32, 92, 145, 0.04);
}


/* Benefits Heading */

.join-us .join-us__benefits-title {
    margin: 0 0 9px;

    color: #103d7c;
    font-family: Georgia, serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
}


/* Benefits List */

.join-us .join-us__list {
    display: flex;
    flex-direction: column;
    gap: 7px;

    margin: 0;
    padding: 0;

    list-style: none;
}


/* Individual List Item */

.join-us .join-us__item {
    display: flex;
    align-items: center;
    gap: 9px;

    min-width: 0;
}


/* Yellow Check Circle */

.join-us .join-us__check {
    display: inline-flex;
    flex: 0 0 13px;

    align-items: center;
    justify-content: center;

    width: 13px;
    height: 13px;

    color: #ffffff;
    background: linear-gradient(145deg,
            #ffd44c,
            #f2a900);

    border-radius: 50%;

    box-shadow: 0 2px 5px rgba(239, 173, 0, 0.15);
}


/* Check Icon */

.join-us .join-us__icon {
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
}


/* List Text */

.join-us .join-us__item-text {
    color: #596579;
    font-size: 10.5px;
    font-weight: 400;
    line-height: 1.5;

    transition: color 0.25s ease;
}


/* Subtle Hover Effect */

.join-us .join-us__item:hover .join-us__item-text {
    color: #123f7e;
}


/* ==========================================
   RESPONSIVE DESIGN
========================================== */

/* Tablets */

@media (max-width: 991px) {

    .join-us {
        padding: 15px 0;
    }

    .join-us .join-us__image-box {
        height: 190px;
    }

    .join-us .join-us__content {
        padding: 20px 24px;
    }

    .join-us .join-us__benefits {
        margin: 8px 15px 15px;
        padding: 17px 20px;
    }

    .join-us .join-us__title {
        font-size: 20px;
    }

    .join-us .join-us__text {
        font-size: 12px;
    }

    .join-us .join-us__item-text {
        font-size: 12px;
    }

}


/* Mobile */

@media (max-width: 575px) {

    .join-us {
        padding: 15px 0;
    }

    .join-us .join-us__wrapper {
        border-radius: 10px;
    }

    .join-us .join-us__image-box {
        height: 210px;
        border-radius: 10px;
    }

    .join-us .join-us__content {
        padding: 22px 18px;
    }

    .join-us .join-us__subtitle {
        font-size: 19px;
    }

    .join-us .join-us__title {
        font-size: 21px;
    }

    .join-us .join-us__text {
        font-size: 12px;
        line-height: 1.8;
    }

    .join-us .join-us__benefits {
        margin: 0 12px 12px;
        padding: 18px 16px;
    }

    .join-us .join-us__benefits-title {
        font-size: 15px;
    }

    .join-us .join-us__list {
        gap: 10px;
    }

    .join-us .join-us__item {
        align-items: flex-start;
        gap: 10px;
    }

    .join-us .join-us__check {
        margin-top: 2px;
    }

    .join-us .join-us__item-text {
        font-size: 12px;
        line-height: 1.6;
    }

}

/* ==============================================
TECHERS ENQUIRY PAGE JOIN US SECTION END
============================================= */

/* ===================================================
PRINCIPAL  MEIN SECTION START ON PRINCAPL MSG PAGE
===================================================== */

.our-messages {
    --om-gold: #f5c51b !important;
    --om-blue: #123778 !important;
    --om-orange: #d99a08 !important;

    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 20px 0;
    background:
        linear-gradient(110deg,
            rgba(255, 255, 255, 0.91) 0%,
            rgba(255, 255, 255, 0.96) 50%,
            rgba(255, 252, 241, 0.90) 100%),
        url("../images/background-img/principal-message.png");

    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}


/* Soft background glow */

.our-messages::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;

    background:
        radial-gradient(circle at 0% 45%,
            rgba(113, 204, 187, 0.12),
            transparent 25%),
        radial-gradient(circle at 100% 100%,
            rgba(255, 196, 95, 0.15),
            transparent 28%);
}

/* Main Layout */

.our-messages__wrapper {
    display: grid;
    grid-template-columns: 0.92fr 1.08fr;
    align-items: center;
    gap: 65px;
}

/* ==========================================
   LEFT IMAGE
========================================== */

.our-messages__left {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    padding: 12px;
}

.our-messages__image-frame {
    position: relative;
    width: 100%;
    max-width: 490px;
    padding: 9px;
    border-radius: 48px 38px 45px 40px;

    background: linear-gradient(135deg,
            #ffdb29 0%,
            #fff3a3 17%,
            #ffffff 28%,
            #f4bd12 45%,
            #ffffff 55%,
            #1673c9 72%,
            #ffdc29 88%,
            #f4b900 100%);

    box-shadow:
        0 0 0 2px rgba(255, 213, 37, 0.25),
        0 0 12px rgba(255, 198, 0, 0.35),
        0 0 25px rgba(255, 198, 0, 0.20),
        0 15px 35px rgba(22, 42, 83, 0.12);

    transform: rotate(-1deg);
    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease;
}

.our-messages__image-frame::before {
    content: "";
    position: absolute;
    inset: -5px;
    z-index: -1;
    border-radius: 52px 42px 48px 45px;

    border: 2px solid rgba(255, 202, 15, 0.55);

    box-shadow:
        0 0 12px rgba(255, 204, 0, 0.25),
        inset 0 0 10px rgba(255, 255, 255, 0.65);
}

.our-messages__image-frame:hover {
    transform: rotate(0deg) translateY(-5px);

    box-shadow:
        0 0 12px rgba(255, 204, 0, 0.55),
        0 0 30px rgba(255, 204, 0, 0.32),
        0 18px 40px rgba(22, 42, 83, 0.16);
}

.our-messages__image-inner {
    position: relative;
    overflow: hidden;
    height: 480px;
    border: 3px solid #fff;
    border-radius: 40px 31px 38px 32px;
    background: #f5f1e7;
}

.our-messages__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    transition: transform 0.6s ease;
}

.our-messages__image-frame:hover .our-messages__image {
    transform: scale(1.035);
}

/* Principal Name Plate */

.our-messages__name-plate {
    position: absolute;
    bottom: 20px;
    left: 28px;
    min-width: 205px;
    padding: 12px 25px;

    color: #f9d86c;
    background: linear-gradient(135deg, #171717, #303030);

    border: 2px solid rgba(255, 216, 101, 0.75);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.22);

    font-family: Georgia, "Times New Roman", serif;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 1px;
    text-align: center;
}

/* ==========================================
   RIGHT CONTENT
========================================== */

.our-messages__right {
    min-width: 0;
    padding: 10px 0;
}

.our-messages__eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;

    color: #28344c;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 4px;
    text-transform: uppercase;
}

.our-messages__eyebrow span {
    position: absolute;
    width: 33px;
    height: 3px;
    margin-top: 26px;
    border-radius: 5px;

    background: linear-gradient(90deg,
            #f4c51c,
            #e5a700);
}

/* Two-Color Heading */

.our-messages__heading {
    margin: 0 0 20px;
    color: var(--om-blue) !important;
    font-size: clamp(30px, 3.1vw, 43px);
    font-weight: 700;
    line-height: 1.18;
}

.our-messages__heading span {
    display: block;
    margin-top: 3px;
    color: var(--om-orange) !important;
}

/* Paragraphs */

.our-messages__content {
    color: #626262;
    font-size: 15px;
    line-height: 1.75;
}

.our-messages__content p {
    margin: 0 0 14px;
}

.our-messages__content .our-messages__greeting {
    margin-bottom: 8px;
    color: #555;
    font-weight: 500;
}

/* Signature */

.our-messages__signature {
    margin-top: 23px;
}

.our-messages__signature p {
    margin: 0 0 7px;
    color: #646464;
    font-size: 15px;
}

.our-messages__signature h3 {
    margin: 0 0 4px;
    color: var(--om-blue);

    font-family: Georgia, "Times New Roman", serif;
    font-size: 21px;
    font-weight: 700;
}

.our-messages__signature span {
    color: #686868;
    font-size: 14px;
}

/* ==========================================
   TABLET RESPONSIVE
========================================== */

@media (max-width: 991px) {
    .our-messages {
        padding: 60px 0;
    }

    .our-messages__wrapper {
        grid-template-columns: 0.85fr 1.15fr;
        gap: 30px;
    }

    .our-messages__left {
        padding: 7px;
    }

    .our-messages__image-frame {
        padding: 6px;
        border-radius: 32px;
    }

    .our-messages__image-inner {
        height: 390px;
        border-radius: 27px;
    }

    .our-messages__name-plate {
        bottom: 15px;
        left: 15px;
        min-width: 0;
        padding: 9px 16px;
        font-size: 17px;
    }

    .our-messages__heading {
        font-size: 32px;
    }

    .our-messages__content {
        font-size: 14px;
        line-height: 1.7;
    }

    .our-messages__content p {
        margin-bottom: 11px;
    }

    .our-messages__eyebrow {
        letter-spacing: 2.5px;
    }
}

/* ==========================================
   MOBILE RESPONSIVE
========================================== */

@media (max-width: 767px) {
    .our-messages {
        padding: 45px 0;
        background-position: center;
    }

    .our-messages__wrapper {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .our-messages__left {
        padding: 5px 10px;
    }

    .our-messages__image-frame {
        width: 100%;
        max-width: 390px;
        padding: 6px;
        border-radius: 35px;
    }

    .our-messages__image-inner {
        height: 390px;
        border-radius: 29px;
    }

    .our-messages__name-plate {
        bottom: 15px;
        left: 18px;
        padding: 9px 20px;
        font-size: 18px;
    }

    .our-messages__right {
        padding: 0 3px;
    }

    .our-messages__eyebrow {
        margin-bottom: 14px;
        font-size: 10px;
        letter-spacing: 3px;
    }

    .our-messages__eyebrow span {
        margin-top: 24px;
        width: 28px;
    }

    .our-messages__heading {
        margin-bottom: 17px;
        font-size: clamp(29px, 7vw, 36px);
        line-height: 1.2;
    }

    .our-messages__content {
        font-size: 14px;
        line-height: 1.8;
    }

    .our-messages__content p {
        margin-bottom: 13px;
    }

    .our-messages__signature {
        margin-top: 22px;
    }

    .our-messages__signature h3 {
        font-size: 20px;
    }
}

/* Small Mobile */

@media (max-width: 400px) {
    .our-messages {
        padding: 35px 0;
    }

    .our-messages__image-inner {
        height: 330px;
    }

    .our-messages__image-frame {
        border-radius: 28px;
    }

    .our-messages__name-plate {
        left: 13px;
        bottom: 12px;
        padding: 8px 14px;
        font-size: 15px;
    }

    .our-messages__heading {
        font-size: 28px;
    }

    .our-messages__content {
        font-size: 13px;
    }
}

/* ===================================================
PRINCIPAL  MEIN SECTION END ON PRINCAPL MSG PAGE
===================================================== */


/* =======================================================
PRINCIPAL PAGE 4 CARDS SECTION START 
======================================================= */
```css .principal-messages {
    position: relative;
    z-index: 99;
    width: 100%;
    height: auto;
}

/* =========================================
   TABLET
========================================= */

@media (max-width: 991px) {

    .principal-messages {
        height: auto;
        padding: 30px 0 40px;
    }

    .tsc-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
        width: 100%;
        max-width: 720px;
        margin: 0 auto;
        transform: none;
    }

    .tsc-card {
        width: 100%;
        height: 280px;
        min-height: 280px;
        padding: 25px 30px;
    }
}

/* =========================================
   MOBILE
========================================= */

@media (max-width: 575px) {

    .principal-messages {
        height: auto;
        padding: 25px 0 40px;
        overflow: visible;
    }

    .tsc-grid {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
        gap: 20px;
        padding: 0 15px;
        transform: none;
    }

    .tsc-card {
        width: 100%;
        height: auto;
        min-height: 270px;
        padding: 25px 28px;
        margin: 0;
        box-sizing: border-box;
    }

    .tsc-card h3 {
        font-size: 22px;
        line-height: 1.3;
    }

    .tsc-card p {
        max-width: 100%;
        font-size: 14px;
        line-height: 1.5;
    }

    .tsc-bg-icon {
        right: 0;
        top: 45px;
        font-size: 90px;
    }

    .tsc-icon {
        width: 65px;
        height: 65px;
        font-size: 28px;
        margin-bottom: 15px;
    }

    .tsc-arrow {
        left: 28px;
        bottom: 18px;
        width: 50px;
        height: 50px;
        font-size: 20px;
    }
}

/* =========================================
   VERY SMALL MOBILE
========================================= */

@media (max-width: 375px) {

    .principal-messages {
        padding: 20px 0 35px;
    }

    .tsc-grid {
        padding: 0 12px;
        gap: 16px;
    }

    .tsc-card {
        min-height: 255px;
        padding: 22px 24px;
        border-radius: 15px;
    }

    .tsc-card h3 {
        font-size: 20px;
    }

    .tsc-card p {
        font-size: 13px;
        max-width: 90%;
    }

    .tsc-icon {
        width: 60px;
        height: 60px;
        font-size: 26px;
    }

    .tsc-arrow {
        left: 24px;
        bottom: 16px;
        width: 48px;
        height: 48px;
    }
}

/* =======================================================
PRINCIPAL PAGE 4 CARDS SECTION END 
======================================================= */



/* =============================================
POP_UP FORM SECTION START
============================================== */


.popup-form-section {
    z-index: 9999 !important;
    border: 1px solid green;
    position: relative;

}

.popup-form {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    background: rgba(0, 0, 0, 0.6);
    z-index: 999;
    animation: fadeBg 0.3s ease;
    overflow-y: auto;
    padding: 0 15px 0 15px;
}

/* Box */
.form-box {
    background: #fff;
    width: 100%;
    max-width: 960px;
    margin: 25px auto;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 25px 50px rgba(47, 111, 255, 0.30),
        0 10px 20px rgba(47, 111, 255, 0.20),
        0 0 25px rgba(47, 111, 255, 0.18);

    max-height: calc(100vh - 50px);
    /* Main Fix */
    display: flex;
    align-items: stretch;

    padding: 4px;

    transform: translateY(-30px);
    opacity: 0;
    animation: slideIn .5s ease forwards;
}


.form-box .row {
    width: 100%;
    margin: 0;
    align-items: stretch;
}

/* Left side */
.form-left {
    background-image: url('../images/background/popUp-image.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;

    color: #fff;
    border-radius: 18px 0 0 18px;
    box-shadow: rgba(0, 0, 0, .25) 0 5px 15px;

    display: flex;
    flex-direction: column;
    justify-content: flex-start;

    padding: 30px;
    padding-top: 25px;
    min-height: 100%;
}

.form-left img {
    width: 120px;
    max-width: 100%;
    background: #fff;
    padding: 10px;
    border-radius: 8px;
    /* margin: 0 auto 20px; */
    display: block;
}


.form-left h5 {
    color: #fff;
    font-size: 34px;
    line-height: 1.15;
    font-weight: 700;


}

.form-left h5 span {
    color: #ffb000;
}

.left-line {
    width: 75px;
    height: 4px;
    margin: 10px 0 18px;
}

.form-left p {
    color: #fff;
    font-size: 14px;
    line-height: 1.6;
    margin-top: -18px;
    text-align: justify;
    max-width: 95%;
}

.left-line-p2 {
    padding-top: 10px;
}

/* ==============right side  */


.form-right {
    background: #fff;
    border-radius: 0 18px 18px 0;
    padding: 25px 30px;

    display: flex;
    flex-direction: column;

    position: relative;

    max-height: calc(100vh - 50px);
    overflow-y: auto;
}

.form-right h2 {
    font-size: 25px;
    font-weight: 700;
    color: #11265d;

    margin-bottom: 8px;
}

.sub-title {
    color: #666;
    font-size: 15px;
    margin-bottom: 15px;
}

.title-line {
    width: 70px;
    height: 4px;
    /* background: #ffb000; */
    background: #FFB000;
    background: linear-gradient(90deg, rgba(255, 176, 0, 1) 0%, rgba(255, 176, 0, 1) 18%, rgba(192, 4, 3, 1) 100%);
    border-radius: 20px;

}

.close {
    position: absolute;
    right: 25px;
    top: 25px;
    width: 42px;
    height: 42px;
    background: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 8px 25px rgba(0, 0, 0, .12);
    cursor: pointer;
    transition: .3s;
}

.close:hover {
    transform: rotate(90deg);
    color: #ff6200;
}

/* input form popup */

.form-row-custom {
    display: flex;
    gap: 10px;
}

.input-group-custom {
    display: flex;
    align-items: center;
    border: 1px solid #e6e6e6;
    border-radius: 12px;
    margin-bottom: 12px;
    background: #fff;
    overflow: visible;
    transition: .3s;
}

/* ===============
=================== */
.input-group-custom .select-content {
    width: 100%;
}

.input-group-custom .select-content select {
    width: 100%;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: #333;
    padding: 13px 16px;
    appearance: auto;
    cursor: pointer;
}

/* ===============
=================== */

.input-group-custom {
    padding: 2px;

}

.input-group-custom:hover,
.input-group-custom:focus-within {
    border-color: #ff6200;
    box-shadow: 0 5px 20px rgba(255, 98, 0, .12);
}

.input-group-custom span {
    width: 60px;
    text-align: center;
    color: #666;
    font-size: 20px;
}

.input-group-custom input,
.input-group-custom select,
.input-group-custom textarea {

    border: none;
    outline: none;
    width: 100%;
    padding: 13px 16px;
    background: transparent;
    font-size: 15px;
}

.input-group-custom textarea {
    resize: none;
}

.textarea-group {
    align-items: flex-start;
}

.textarea-group span {
    padding-top: 18px;
}

.textarea-group textarea {
    height: 90px;
}

.submit-btn {

    width: 100%;
    border: none;
    border-radius: 12px;
    padding: 14px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    transition: .3s;
    background: #020024;
    background: linear-gradient(90deg,
            rgba(2, 0, 36, 1) 0%,
            rgba(9, 9, 121, 1) 35%,
            #b90504 100%);
    color: #fff;

}

.submit-btn:hover {
    background: linear-gradient(90deg, rgba(2, 0, 36, 1) 0%, rgba(9, 9, 121, 1) 35%, rgba(0, 212, 255, 1) 100%);

    transform: translateY(-2px);

    box-shadow: 0 15px 30px rgba(255, 98, 0, .35);

}

.privacy-text {

    text-align: center;
    margin-top: 12px;
    color: #777;
    font-size: 14px;
}

.privacy-text i {

    color: #777;
    margin-right: 6px;
}

/* Animations */
@keyframes fadeBg {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideIn {
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Responsive tweaks */
@media (max-width: 768px) {
    .form-box {
        /* margin: 10% auto; */
        padding: 10px;
    }

    .form-left {
        margin-bottom: 20px;
        text-align: center !important;
    }

    .form-right h2 {
        text-align: center;
    }

    .my-mb {
        margin: 5px 15px 5px 15px;
    }
}

/* ///////logo popup form */
.logo-img img {
    /* margin-left: 2rem; */
    margin: auto;
    width: 100px;
    height: 80px;
}


@media(max-width:991px) {

    .form-box {
        display: block;
        max-width: 95%;
        max-height: 95vh;
        margin: 15px auto;
        overflow-y: auto;
    }

    .form-left {
        border-radius: 18px 18px 0 0;
        padding: 30px 25px;
        text-align: center;
    }

    .form-left img {
        width: 220px;
    }

    .form-left h5 {
        font-size: 34px;
        text-align: center !important;
    }

    .form-left p {
        text-align: center;
    }

    .form-right {
        max-height: none;
        overflow: visible;
        border-radius: 0 0 18px 18px;
        padding: 25px;
    }

    .form-right h2 {
        font-size: 28px;
    }

    .close {
        top: 18px;
        right: 18px;
    }
}

@media(max-width:576px) {

    .popup-form {
        padding: 10px;
    }

    .form-box {
        max-width: 100%;
        border-radius: 15px;
        margin: 10px auto;
    }

    .form-left {
        padding: 25px 18px;
    }

    .form-left img {
        width: 180px;
    }

    .form-left h5 {
        font-size: 28px;
    }

    .form-left p {
        font-size: 14px;
        line-height: 1.7;
    }

    .form-right {
        padding: 20px 15px;
    }

    .form-right h2 {
        font-size: 24px;
    }

    .sub-title {
        font-size: 14px;
    }

    .title-line {
        margin-bottom: 20px;
    }

    .input-group-custom {
        margin-bottom: 10px;
    }

    .input-group-custom span {
        width: 46px;
        font-size: 17px;
    }

    .input-group-custom input,
    .input-group-custom select,
    .input-group-custom textarea {
        padding: 12px;
        font-size: 14px;
    }

    .submit-btn {
        padding: 13px;
        font-size: 15px;
    }

    .privacy-text {
        font-size: 12px;
        margin-top: 10px;
    }
}

/* input add new cs */
.input-group-custom .select-content {
    width: 100%;
}

.input-group-custom .select-content select {
    width: 100%;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: #333;
    padding: 0;
    appearance: auto;
    cursor: pointer;
}

/* =============================================
POP_UP FORM SECTION END
============================================== */

/* ================================================
FACILITIES CARDS SECTION START ON FACILITIES PAGE
========================================= */

/* =========================================
   FACILITIES CARDS SECTION
========================================= */

.facilities-cards {
    --fc-heading: #103d78;
    --fc-text: #61758e;

    position: relative;
    padding: 40px 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 10% 10%,
            rgba(64, 145, 255, 0.055),
            transparent 32%),
        radial-gradient(circle at 90% 90%,
            rgba(255, 193, 7, 0.055),
            transparent 32%),
        #fafdff;
}

.facilities-cards,
.facilities-cards * {
    box-sizing: border-box;
}

.facilities-cards__container {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding-left: 35px;
    padding-right: 35px;
}


/* =========================================
   MAIN CARD
========================================= */

.facilities-cards__item {
    --fc-color: #1684ff;
    --fc-light: rgba(22, 132, 255, 0.13);
    --fc-border: rgba(22, 132, 255, 0.48);

    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;

    height: 100%;
    min-width: 0;
    padding: 20px 22px 18px;

    background: linear-gradient(145deg,
            #ffffff 0%,
            #fcfdff 65%,
            var(--fc-light) 150%);

    border: 1px solid var(--fc-border);
    border-radius: 15px;

    box-shadow:
        0 0 5px var(--fc-border),
        0 5px 15px var(--fc-light),
        inset 0 0 12px rgba(255, 255, 255, 0.85);

    overflow: hidden;

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}


/* Shining border layer */

.facilities-cards__item::before {
    content: "";
    position: absolute;
    inset: -1px;
    z-index: -1;
    border-radius: inherit;

    background: linear-gradient(120deg,
            transparent 15%,
            rgba(255, 255, 255, 0.95) 30%,
            var(--fc-color) 43%,
            transparent 57%,
            transparent 100%);

    background-size: 250% 250%;
    background-position: 100% 0;

    opacity: 0.15;
    pointer-events: none;

    transition:
        opacity 0.35s ease,
        background-position 0.65s ease;
}


/* Soft internal glow */

.facilities-cards__item::after {
    content: "";
    position: absolute;
    top: -65px;
    right: -65px;

    width: 130px;
    height: 130px;

    background: var(--fc-light);
    border-radius: 50%;
    filter: blur(8px);

    pointer-events: none;
    z-index: -1;
}


/* Hover shine */

.facilities-cards__item:hover {
    transform: translateY(-6px);

    border-color: var(--fc-color);

    box-shadow:
        0 0 8px var(--fc-border),
        0 0 22px var(--fc-light),
        0 12px 26px var(--fc-light),
        inset 0 0 12px rgba(255, 255, 255, 0.9);
}

.facilities-cards__item:hover::before {
    opacity: 0.65;
    background-position: 0 100%;
}


/* =========================================
   ICON - 3D GRADIENT LOOK
========================================= */

.facilities-cards__icon {
    position: relative;
    isolation: isolate;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 58px;
    height: 58px;
    flex: 0 0 58px;

    margin-bottom: 13px;

    color: var(--fc-color);
    font-size: 27px;

    border: 1px solid var(--fc-color);
    border-radius: 50%;

    background: linear-gradient(145deg,
            #ffffff 0%,
            var(--fc-light) 28%,
            var(--fc-color) 170%);

    box-shadow:
        inset 2px 2px 5px rgba(255, 255, 255, 0.95),
        inset -3px -4px 7px var(--fc-light),
        0 3px 7px var(--fc-light),
        0 0 9px var(--fc-light);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}

.facilities-cards__icon::before {
    content: "";
    position: absolute;
    top: 4px;
    left: 9px;

    width: 22px;
    height: 9px;

    background: rgba(255, 255, 255, 0.75);
    border-radius: 50%;
    filter: blur(3px);

    pointer-events: none;
}

.facilities-cards__item:hover .facilities-cards__icon {
    transform: translateY(-2px) scale(1.06);

    box-shadow:
        inset 2px 2px 5px rgba(255, 255, 255, 0.95),
        0 0 10px var(--fc-border),
        0 5px 15px var(--fc-light);
}


/* =========================================
   CARD HEADING
========================================= */

.facilities-cards__title {
    margin: 0 0 8px;

    color: var(--fc-heading);
    font-family: inherit;
    font-size: 17px;
    font-weight: 750;
    line-height: 1.4;
    letter-spacing: -0.2px;
}


/* =========================================
   CARD DESCRIPTION
========================================= */

.facilities-cards__text {
    margin: 0 0 8px;

    color: var(--fc-text);
    font-family: inherit;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.55;

    overflow-wrap: anywhere;
}


/* Small colored underline */

.facilities-cards__line {
    display: block;
    width: 27px;
    height: 2px;
    flex-shrink: 0;

    margin-bottom: 12px;

    background: var(--fc-color);
    border-radius: 5px;

    box-shadow: 0 0 7px var(--fc-border);

    transition:
        width 0.35s ease,
        box-shadow 0.35s ease;
}

.facilities-cards__item:hover .facilities-cards__line {
    width: 48px;
    box-shadow: 0 0 12px var(--fc-color);
}


/* =========================================
   CARD IMAGE
========================================= */

.facilities-cards__image {
    position: relative;

    width: 100%;
    height: 115px;
    flex-shrink: 0;

    margin-top: auto;

    overflow: hidden;
    border-radius: 9px;

    background: var(--fc-light);
    border: 1px solid rgba(255, 255, 255, 0.85);

    box-shadow:
        0 2px 8px var(--fc-light),
        0 0 0 1px var(--fc-border);
}

.facilities-cards__image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    transition:
        transform 0.55s ease,
        filter 0.4s ease;
}

.facilities-cards__item:hover .facilities-cards__image img {
    transform: scale(1.07);
    filter: saturate(1.08);
}


/* Image shine on hover */

.facilities-cards__image::after {
    content: "";
    position: absolute;
    top: 0;
    left: -120%;

    width: 65%;
    height: 100%;

    background: linear-gradient(100deg,
            transparent,
            rgba(255, 255, 255, 0.42),
            transparent);

    transform: skewX(-20deg);
    pointer-events: none;
}

.facilities-cards__item:hover .facilities-cards__image::after {
    left: 150%;
    transition: left 0.75s ease;
}


/* =========================================
   CARD COLOR THEMES
========================================= */

/* Blue */

.facilities-cards__item--blue {
    --fc-color: #1684ff;
    --fc-light: rgba(22, 132, 255, 0.12);
    --fc-border: rgba(22, 132, 255, 0.48);
}

/* Gold */

.facilities-cards__item--gold {
    --fc-color: #e8a900;
    --fc-light: rgba(255, 193, 7, 0.15);
    --fc-border: rgba(255, 193, 7, 0.58);
}

/* Red */

.facilities-cards__item--red {
    --fc-color: #ff3859;
    --fc-light: rgba(255, 56, 89, 0.12);
    --fc-border: rgba(255, 56, 89, 0.48);
}

/* Green */

.facilities-cards__item--green {
    --fc-color: #12b981;
    --fc-light: rgba(18, 185, 129, 0.12);
    --fc-border: rgba(18, 185, 129, 0.48);
}

/* Purple */

.facilities-cards__item--purple {
    --fc-color: #9747ff;
    --fc-light: rgba(151, 71, 255, 0.13);
    --fc-border: rgba(151, 71, 255, 0.5);
}

/* Cyan */

.facilities-cards__item--cyan {
    --fc-color: #08b9c9;
    --fc-light: rgba(8, 185, 201, 0.13);
    --fc-border: rgba(8, 185, 201, 0.5);
}

/* Orange */

.facilities-cards__item--orange {
    --fc-color: #ff762e;
    --fc-light: rgba(255, 118, 46, 0.13);
    --fc-border: rgba(255, 118, 46, 0.5);
}


/* =========================================
   RESPONSIVE DESIGN
========================================= */

/* Large laptops */

@media (min-width: 1200px) {
    .facilities-cards__container {
        padding-left: 45px;
        padding-right: 45px;
    }

    .facilities-cards__item {
        padding: 20px 22px 18px;
    }
}


/* Tablets */

@media (max-width: 991px) {
    .facilities-cards {
        padding: 35px 0;
    }

    .facilities-cards__container {
        padding-left: 24px;
        padding-right: 24px;
    }

    .facilities-cards__item {
        padding: 19px;
    }

    .facilities-cards__title {
        font-size: 16px;
    }

    .facilities-cards__text {
        font-size: 13px;
    }

    .facilities-cards__image {
        height: 125px;
    }
}


/* Mobile */

@media (max-width: 575px) {
    .facilities-cards {
        padding: 28px 0;
    }

    .facilities-cards__container {
        padding-left: 18px;
        padding-right: 18px;
    }

    .facilities-cards .row {
        --bs-gutter-x: 16px;
        --bs-gutter-y: 18px;
    }

    .facilities-cards__item {
        padding: 17px;
        border-radius: 13px;
    }

    .facilities-cards__icon {
        width: 52px;
        height: 52px;
        flex-basis: 52px;
        margin-bottom: 12px;
        font-size: 24px;
    }

    .facilities-cards__title {
        font-size: 16px;
        margin-bottom: 7px;
    }

    .facilities-cards__text {
        font-size: 13px;
        line-height: 1.55;
    }

    .facilities-cards__image {
        height: 145px;
    }
}


/* Small phones */

@media (max-width: 380px) {
    .facilities-cards__container {
        padding-left: 14px;
        padding-right: 14px;
    }

    .facilities-cards__item {
        padding: 15px;
    }

    .facilities-cards__image {
        height: 125px;
    }
}


/* Respect reduced motion preferences */

@media (prefers-reduced-motion: reduce) {

    .facilities-cards__item,
    .facilities-cards__icon,
    .facilities-cards__line,
    .facilities-cards__image img {
        transition: none !important;
    }
}

/* ================================================
FACILITIES CARDS SECTION END ON FACILITIES PAGE
========================================= */

/* =================================
Why Facilities Section START
==================================== */

/* =====================================
   WHY FACILITIES SECTION
===================================== */

.why-facilities {
    position: relative;
    width: 100%;
    padding: 42px 0;
    overflow: hidden;

    background: linear-gradient(115deg,
            #f4f9fd 0%,
            #ffffff 50%,
            #f0f7fc 100%);
}

/* LEFT CONTENT */

.why-facilities .why-facilities__content {
    position: relative;
    z-index: 2;
    padding-right: 35px;
}

.why-facilities .why-facilities__subtitle {
    display: block;
    margin-bottom: 8px;

    color: #173f77;
    font-size: 20px !important;
    font-weight: 800;
    letter-spacing: 4px;
    line-height: 1.5;
}

.why-facilities .why-facilities__heading {
    margin: 0 0 10px;

    color: #123f7c;
    font-size: 30px !important;
    font-weight: 800;
    line-height: 1.3;
}

.why-facilities .why-facilities__heading span {
    display: block;
    position: relative;

    color: #f5b900;
    font-size: 30px !important;
    font-weight: 800;
}

.why-facilities .why-facilities__heading span::before {
    content: "";
    display: inline-block;

    width: 18px;
    height: 3px;
    margin-right: 9px;
    margin-bottom: 5px;

    background: #f5b900;
    border-radius: 5px;
}

.why-facilities .why-facilities__text {
    max-width: 440px;
    margin: 0 0 15px;

    color: #526d91;
    font-size: 15px !important;
    font-weight: 400;
    line-height: 1.65;
}

/* EXPLORE BUTTON */

.why-facilities .why-facilities__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 10px 20px;
    min-height: 32px;

    color: #173f77;
    background: #ffc400;

    border: 1px solid #ffc400;
    border-radius: 30px;

    font-size: 10px;
    font-weight: 800;
    text-decoration: none;

    box-shadow: 0 5px 14px rgba(245, 185, 0, 0.20);

    transition: all 0.35s ease;
}

.why-facilities .why-facilities__btn:hover {
    color: #ffffff;
    background: #17477f;
    border-color: #17477f;

    transform: translateY(-3px);

    box-shadow: 0 8px 20px rgba(18, 63, 124, 0.22);
}

.why-facilities .why-facilities__icon {
    font-size: 12px;
    transition: transform 0.3s ease;
}

.why-facilities .why-facilities__btn:hover .why-facilities__icon {
    transform: translateX(4px);
}

/* RIGHT VISUAL */

.why-facilities .why-facilities__visual {
    position: relative;
    width: 100%;
    max-width: 655px !important;
    height: 350px;

    margin: 0 auto;
}

/* MAIN IMAGE FRAME */

.why-facilities .why-facilities__image {
    position: absolute;
    top: 24px;
    left: 5px;

    width: 76%;
    height: 155px;

    overflow: hidden;

    border: 3px solid #ffffff;
    border-radius: 20px;

    transform: rotate(-8deg);

    box-shadow:
        0 9px 22px rgba(37, 75, 118, 0.13),
        0 0 0 1px rgba(255, 255, 255, 0.8);

    z-index: 3;
}

.why-facilities .why-facilities__image img {
    display: block;
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    border-radius: 16px;

    transition: transform 0.6s ease;
}

.why-facilities .why-facilities__image:hover img {
    transform: scale(1.06);
}

/* YELLOW DECORATIVE SHAPES */

.why-facilities .why-facilities__shape {
    position: absolute;
    display: block;

    background: #ffda57;
    border-radius: 15px;

    z-index: 1;
}

.why-facilities .why-facilities__shape--back {
    top: 34px;
    left: 2px;

    width: 68%;
    height: 150px;

    transform: rotate(-12deg);
    opacity: 0.95;
}

.why-facilities .why-facilities__shape--front {
    right: 12%;
    bottom: 4px;

    width: 65%;
    height: 88px;

    transform: rotate(7deg);
    opacity: 0.95;
}

/* RIGHT HANDWRITTEN TAGLINE */

.why-facilities .why-facilities__tagline {
    position: absolute;
    top: 8px;
    right: 0;

    display: flex;
    flex-direction: column;
    align-items: flex-start;

    color: #123f7c;

    font-family: "Comic Sans MS", cursive;
    font-size: 18px;
    font-weight: 700;
    font-style: italic;
    line-height: 1.25;

    transform: rotate(-8deg);

    z-index: 4;
}

.why-facilities .why-facilities__tagline span:nth-child(2) {
    margin-left: 12px;
}

.why-facilities .why-facilities__underline {
    display: block;

    width: 88px;
    height: 4px;
    margin-top: 7px;
    margin-left: 36px;

    background: #ffc400;
    border-radius: 10px;

    transform: rotate(-8deg);
}

/* =====================================
   RESPONSIVE DESIGN
===================================== */

@media (min-width: 1200px) {
    .why-facilities .why-facilities__heading {
        font-size: 22px;
    }

    .why-facilities .why-facilities__visual {
        max-width: 470px;
    }
}

@media (max-width: 991px) {
    .why-facilities {
        padding: 35px 0;
    }

    .why-facilities .why-facilities__content {
        padding-right: 10px;
    }

    .why-facilities .why-facilities__heading {
        font-size: 20px;
    }

    .why-facilities .why-facilities__heading span {
        font-size: 19px;
    }

    .why-facilities .why-facilities__visual {
        height: 220px;
    }

    .why-facilities .why-facilities__tagline {
        right: -3px;
        font-size: 15px;
    }
}

@media (max-width: 767px) {
    .why-facilities {
        padding: 38px 0 25px;
    }

    .why-facilities .why-facilities__content {
        padding-right: 0;
    }

    .why-facilities .why-facilities__subtitle {
        font-size: 10px;
        letter-spacing: 3px;
    }

    .why-facilities .why-facilities__heading {
        font-size: 25px;
    }

    .why-facilities .why-facilities__heading span {
        font-size: 22px;
    }

    .why-facilities .why-facilities__text {
        max-width: 100%;
        font-size: 13px;
        line-height: 1.7;
    }

    .why-facilities .why-facilities__visual {
        max-width: 440px;
        height: 250px;
        margin-top: 25px;
    }

    .why-facilities .why-facilities__image {
        top: 45px;
        left: 2%;
        width: 76%;
        height: 160px;
    }

    .why-facilities .why-facilities__shape--back {
        top: 48px;
        left: 2%;
    }

    .why-facilities .why-facilities__shape--front {
        bottom: 15px;
        right: 8%;
    }

    .why-facilities .why-facilities__tagline {
        top: 10px;
        right: 1%;
        font-size: 16px;
    }
}

@media (max-width: 420px) {
    .why-facilities .why-facilities__heading {
        font-size: 22px;
    }

    .why-facilities .why-facilities__heading span {
        font-size: 20px;
    }

    .why-facilities .why-facilities__visual {
        height: 220px;
    }

    .why-facilities .why-facilities__image {
        top: 48px;
        height: 135px;
    }

    .why-facilities .why-facilities__shape--back {
        height: 125px;
    }

    .why-facilities .why-facilities__shape--front {
        height: 70px;
    }

    .why-facilities .why-facilities__tagline {
        font-size: 13px;
    }

    .why-facilities .why-facilities__underline {
        width: 65px;
    }
}

/* =================================
Why Facilities Section END
==================================== */

/* ==================================================
EXPlORE OUR FACILITIES SECTION  ON FACILITES PAGE START
======================================= */
/* =====================================
   EXPLORE FACILITIES SECTION
===================================== */

.explore-facilities {
    position: relative;
    padding: 35px 0 35px;
    overflow: hidden;

    background: linear-gradient(120deg,
            #f1f8fd 0%,
            #ffffff 50%,
            #f2f8fd 100%);
}

/* SECTION HEADER */

.explore-facilities .explore-facilities__header {
    margin-bottom: 20px;
}

.explore-facilities .explore-facilities__eyebrow {
    display: block;
    margin-bottom: 5px;

    color: #17477f;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 4px;
}

.explore-facilities .explore-facilities__title {
    margin: 0;

    color: #123f7c;
    font-size: 40px;
    font-weight: 800;
    line-height: 1.3;
}

.explore-facilities .explore-facilities__title span {
    color: #f5b900;
}

/* FIVE EQUAL COLUMNS */

@media (min-width: 992px) {
    .explore-facilities .col-lg-2-4 {
        flex: 0 0 auto;
        width: 20%;
    }
}

/* CARD */

.explore-facilities .explore-facilities__card {
    position: relative;
    height: 100%;
    overflow: hidden;

    background: #ffffff;
    border: 1px solid rgba(18, 63, 124, 0.08);
    border-radius: 12px;

    box-shadow: 0 5px 15px rgba(18, 63, 124, 0.08);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}

.explore-facilities .explore-facilities__card:hover {
    transform: translateY(-5px);

    border-color: #f5c12b;

    box-shadow:
        0 10px 25px rgba(18, 63, 124, 0.14),
        0 0 0 2px rgba(245, 185, 0, 0.10);
}

/* CARD IMAGE */

.explore-facilities .explore-facilities__image {
    position: relative;
    height: 200px;
    overflow: hidden;
    background: #eaf1f8;
}

.explore-facilities .explore-facilities__image img {
    display: block;
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    transition: transform 0.55s ease;
}

.explore-facilities .explore-facilities__card:hover .explore-facilities__image img {
    transform: scale(1.08);
}

/* HOVER DETAILS */

.explore-facilities .explore-facilities__details {
    position: absolute;
    inset: 0;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;

    padding: 12px;

    background: linear-gradient(135deg,
            rgba(12, 45, 85, 0.94),
            rgba(3, 31, 66, 0.88));

    opacity: 0;
    transform: translateY(20px);

    transition:
        opacity 0.35s ease,
        transform 0.35s ease;

    z-index: 2;
}

.explore-facilities .explore-facilities__card:hover .explore-facilities__details {
    opacity: 1;
    transform: translateY(0);
}

.explore-facilities .explore-facilities__details h3 {
    margin: 0 0 7px;

    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}

.explore-facilities .explore-facilities__details p {
    margin: 0 0 10px;

    color: #eef5ff;
    font-size: 11px;
    line-height: 1.5;
}

.explore-facilities .explore-facilities__link {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    padding: 7px 12px;

    color: #173f77;
    background: #ffc400;

    border-radius: 30px;

    font-size: 10px;
    font-weight: 700;
    text-decoration: none;

    transition: all 0.3s ease;
}

.explore-facilities .explore-facilities__link:hover {
    color: #ffffff;
    background: #17477f;
}

.explore-facilities .explore-facilities__icon {
    font-size: 12px;
    transition: transform 0.3s ease;
}

.explore-facilities .explore-facilities__link:hover .explore-facilities__icon {
    transform: translateX(3px);
}

/* BLUE BOTTOM LABEL */

.explore-facilities .explore-facilities__footer {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    min-height: 34px;
    padding: 7px 8px;

    background: linear-gradient(110deg,
            #164c8c,
            #06428b);

    color: #ffffff;
}

.explore-facilities .explore-facilities__card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: #ffffff;
    font-size: 14px;

    transition:
        color 0.3s ease,
        transform 0.3s ease;
}

.explore-facilities .explore-facilities__footer h3 {
    margin: 0;

    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.3;
}

.explore-facilities .explore-facilities__card:hover .explore-facilities__card-icon {
    color: #ffcf26;
    transform: scale(1.12);
}

/* =====================================
   TABLET RESPONSIVE
===================================== */

@media (max-width: 991px) {
    .explore-facilities {
        padding: 35px 0;
    }

    .explore-facilities .explore-facilities__title {
        font-size: 27px;
    }

    .explore-facilities .explore-facilities__image {
        height: 150px;
    }

    .explore-facilities .explore-facilities__footer {
        min-height: 42px;
    }

    .explore-facilities .explore-facilities__footer h3 {
        font-size: 12px;
    }

    .explore-facilities .explore-facilities__details {
        padding: 10px;
    }

    .explore-facilities .explore-facilities__details h3 {
        font-size: 13px;
    }

    .explore-facilities .explore-facilities__details p {
        font-size: 10px;
    }
}

/* =====================================
   MOBILE RESPONSIVE
===================================== */

@media (max-width: 575px) {
    .explore-facilities {
        padding: 30px 0;
    }

    .explore-facilities .explore-facilities__header {
        margin-bottom: 20px;
    }

    .explore-facilities .explore-facilities__eyebrow {
        font-size: 9px;
        letter-spacing: 3px;
    }

    .explore-facilities .explore-facilities__title {
        font-size: 23px;
    }

    .explore-facilities .explore-facilities__image {
        height: 135px;
    }

    .explore-facilities .explore-facilities__footer {
        min-height: 38px;
        gap: 7px;
        padding: 7px 4px;
    }

    .explore-facilities .explore-facilities__footer h3 {
        font-size: 11px;
    }

    .explore-facilities .explore-facilities__card-icon {
        font-size: 13px;
    }
}

/* TOUCH DEVICES: DETAILS VISIBLE ON FOCUS */

@media (hover: none) {
    .explore-facilities .explore-facilities__card:focus-within .explore-facilities__details {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ==================================================
EXPlORE OUR FACILITIES SECTION  ON FACILITES PAGE END
======================================= */