/* =========================================================
   GLOBAL VARIABLES
========================================================= */

:root {
    --primary-blue: #11158f;
    --primary-blue-dark: #080b68;
    --primary-blue-light: #171ca8;
    --orange: #ff7a00;
    --orange-dark: #ff5200;
    --white: #ffffff;
    --light-blue: #f4f6ff;
    --text-dark: #071d56;
}


/* =========================================================
   TOP CONTACT BAR
========================================================= */

.top-bar {
    background: var(--primary-blue);
    min-height: 76px;
    color: var(--white);
}

.top-bar .container-fluid {
    min-height: 76px;
}

.top-content {
    position: relative;
    min-height: 76px;

    display: flex;
    align-items: center;
    justify-content: space-between;
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 14px;

    color: var(--white);
    font-size: 16px;
    text-decoration: none;
    white-space: nowrap;
}

.contact-item:hover {
    color: var(--white);
}

.icon-circle {
    width: 44px;
    height: 44px;

    border: 2px solid var(--white);
    border-radius: 50%;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;
    font-size: 20px;
}


/* Center Email */

.top-content > .contact-item:nth-child(2) {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}


/* Social Icons */

.social-links {
    display: flex;
    align-items: center;
    gap: 12px;
}

.social-links a {
    width: 44px;
    height: 44px;

    border: 2px solid var(--white);
    border-radius: 50%;

    color: var(--white);

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 19px;
    text-decoration: none;

    transition: 0.3s ease;
}

.social-links a:hover {
    background: var(--white);
    color: var(--primary-blue);
}


/* =========================================================
   INSTITUTE HEADER
========================================================= */

.institute-header {
    background: linear-gradient(
        110deg,
        #ffffff 0%,
        #f8f9ff 50%,
        #eef1ff 100%
    );

    padding: 28px 0 24px;
    overflow: hidden;
}


/* Logo */

.institute-logo-box {
    height: 252px;

    background: var(--white);
    border: 1px solid #e3e5f2;
    border-radius: 25px;

    display: flex;
    align-items: center;
    justify-content: center;

    box-shadow: 0 8px 25px rgba(27, 38, 100, 0.08);

    overflow: hidden;
}

.institute-logo {
    width: 225px;
    height: 225px;
    object-fit: contain;
}


/* Center Content */

.institute-content {
    width: 100%;
}


/* Education Tag */

.education-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    background: #f0f1fb;
    border: 1px solid #d7d9ef;
    border-radius: 25px;

    padding: 8px 18px;

    color: #080f8d;

    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.4px;

    margin-bottom: 8px;
}

.education-tag i {
    color: var(--orange);
    font-size: 15px;
}


/* Institute Title */

.institute-title {
    margin: 0;

    color: var(--text-dark);

    font-size: 37px;
    font-weight: 900;
    line-height: 1.15;

    letter-spacing: 0.3px;
}


/* Trust */

.trust-name {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 12px;

    color: #222;

    font-size: 17px;
    font-weight: 500;

    margin-top: 4px;
    margin-bottom: 18px;
}

.trust-name span {
    width: 42px;
    height: 2px;

    background: var(--primary-blue);

    display: block;
}


/* Recognition Box */

.recognized-box {
    background: var(--white);

    border-left: 5px solid #2119a5;
    border-radius: 0 14px 14px 0;

    padding: 11px 16px;

    box-shadow: 0 5px 20px rgba(27, 38, 100, 0.05);
}


/* Recognition Title */

.recognized-title {
    display: flex;
    align-items: center;
    gap: 10px;

    color: #080f91;

    font-size: 14px;
    font-weight: 800;

    letter-spacing: 0.4px;

    margin-bottom: 5px;
}

.recognized-title i {
    color: #ff7200;
}


/* Recognition List */

.recognized-list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;

    color: #111;
    font-size: 14px;
}

.recognized-list b {
    color: #ff6b00;
}


/* =========================================================
   RIGHT RECOGNITION CARD
========================================================= */

.recognition-card {
    background: var(--white);

    border-radius: 22px;

    min-height: 218px;

    padding: 18px 15px 16px;

    box-shadow: 0 8px 25px rgba(27, 38, 100, 0.08);

    display: flex;
    flex-direction: column;
    justify-content: center;
}

.recognition-heading {
    color: #080f91;

    font-size: 14px;
    font-weight: 800;

    letter-spacing: 0.5px;

    text-align: center;

    margin-bottom: 25px;
}

.recognition-heading i {
    color: #ff7200;
    margin-right: 8px;
}


/* Recognition Logos */

.recognition-logos {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.recognition-logo {
    height: 112px;

    border: 1px solid #777;
    background: var(--white);

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;
}

.recognition-logo img {
    width: 100%;
    height: 100%;

    object-fit: contain;
    padding: 5px;
}


/* =========================================================
   PREMIUM MENU
========================================================= */

.premium-menu-bar {
    width: 100%;

    background: linear-gradient(
        90deg,
        var(--primary-blue-dark),
        var(--primary-blue),
        var(--primary-blue-light)
    );

    position: relative;
    z-index: 9999;

    box-shadow: 0 6px 18px rgba(10, 15, 100, 0.20);
}


/* Top Highlight */

.premium-menu-bar::before {
    content: "";

    position: absolute;
    left: 0;
    right: 0;
    top: 0;

    height: 2px;

    background: linear-gradient(
        90deg,
        transparent,
        #ffffff,
        transparent
    );

    opacity: 0.35;
}


/* Menu Container */

.premium-menu-container {
    max-width: 1400px;
    margin: auto;
    padding: 0 25px;
}


/* Navigation */

.premium-navigation {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 68px;
}

.premium-navigation ul {
    list-style: none;

    padding: 0;
    margin: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 4px;
}


/* Main Menu Items */

.premium-navigation > ul > li {
    position: relative;
}

.premium-navigation > ul > li > a {
    position: relative;

    display: flex;
    align-items: center;
    gap: 7px;

    color: var(--white);
    text-decoration: none;

    font-family: "Poppins", Arial, sans-serif;
    font-size: 14px;
    font-weight: 600;

    padding: 24px 18px;

    transition: all 0.3s ease;
}


/* Hover Bottom Line */

.premium-navigation > ul > li > a::after {
    content: "";

    position: absolute;

    bottom: 13px;
    left: 18px;
    right: 18px;

    height: 3px;

    background: var(--orange);
    border-radius: 20px;

    transform: scaleX(0);
    transform-origin: center;

    transition: 0.3s ease;
}

.premium-navigation > ul > li > a:hover::after,
.premium-navigation > ul > li.active > a::after {
    transform: scaleX(1);
}

.premium-navigation > ul > li > a:hover {
    color: var(--white);
    background: rgba(255, 255, 255, 0.07);
}


/* Dropdown Arrow */

.dropdown-arrow {
    font-size: 10px;
    transition: 0.3s ease;
}

.dropdown:hover .dropdown-arrow {
    transform: rotate(180deg);
}


/* =========================================================
   DROPDOWN
========================================================= */

.premium-dropdown {
    position: absolute;

    top: 100%;
    left: 0;

    min-width: 285px;

    background: var(--white);

    padding: 10px;

    border-radius: 0 0 14px 14px;

    box-shadow: 0 18px 40px rgba(7, 13, 90, 0.18);

    opacity: 0;
    visibility: hidden;

    transform: translateY(12px);

    transition:
        opacity 0.25s ease,
        transform 0.25s ease,
        visibility 0.25s ease;
}

.dropdown:hover > .premium-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.premium-dropdown li {
    width: 100%;
}

.premium-dropdown li a {
    display: flex;
    align-items: center;
    gap: 11px;

    padding: 12px 14px;

    color: #17204f;
    text-decoration: none;

    font-family: "Poppins", Arial, sans-serif;
    font-size: 13px;
    font-weight: 500;

    border-radius: 9px;

    transition: all 0.25s ease;
}

.premium-dropdown li a i {
    color: var(--primary-blue);
    font-size: 15px;
    width: 18px;
}

.premium-dropdown li a:hover {
    color: var(--primary-blue);
    background: var(--light-blue);
    padding-left: 20px;
}

.premium-dropdown li a:hover i {
    color: var(--orange);
}

.course-dropdown {
    min-width: 330px;
}


/* =========================================================
   ADMISSION BUTTON
========================================================= */

.premium-admission-link {
    margin-left: 10px;

    background: linear-gradient(
        135deg,
        var(--orange),
        var(--orange-dark)
    ) !important;

    border-radius: 50px !important;

    padding: 12px 22px !important;

    box-shadow: 0 7px 18px rgba(255, 100, 0, 0.30);

    transition: all 0.3s ease !important;
}

.premium-navigation > ul > li > a.premium-admission-link::after {
    display: none;
}

.premium-admission-link:hover {
    background: linear-gradient(
        135deg,
        #ff8d25,
        #ff5c0a
    ) !important;

    transform: translateY(-2px);

    box-shadow: 0 10px 25px rgba(255, 100, 0, 0.40);
}


/* =========================================================
   MOBILE MENU BUTTON
========================================================= */

.premium-mobile-button {
    display: none;

    width: 48px;
    height: 48px;

    border: 0;
    outline: 0;
    border-radius: 10px;

    background: rgba(255, 255, 255, 0.12);

    color: var(--white);

    font-size: 25px;

    cursor: pointer;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1199px) {

    .institute-title {
        font-size: 30px;
    }

    .recognized-list {
        font-size: 12px;
    }

    .recognition-logo {
        height: 90px;
    }

    .premium-navigation > ul > li > a {
        padding-left: 12px;
        padding-right: 12px;
        font-size: 13px;
    }
}


/* =========================================================
   MOBILE / TABLET MENU
========================================================= */

@media (max-width: 991px) {

    /* Top Bar */

    .top-bar {
        padding: 15px 0;
    }

    .top-bar .container-fluid {
        min-height: auto;
    }

    .top-content {
        min-height: auto;
        flex-direction: column;
        gap: 15px;
    }

    .top-content > .contact-item:nth-child(2) {
        position: static;
        transform: none;
    }

    .contact-item {
        white-space: normal;
        justify-content: center;
        text-align: center;
        font-size: 14px;
    }

    .social-links {
        justify-content: center;
    }


    /* Institute Header */

    .institute-header {
        padding: 20px 0;
    }

    .institute-logo-box {
        height: 220px;
        max-width: 260px;
        margin: auto;
    }

    .institute-logo {
        width: 195px;
        height: 195px;
    }

    .institute-content {
        text-align: center;
    }

    .education-tag {
        font-size: 12px;
    }

    .institute-title {
        font-size: 27px;
    }

    .recognized-box {
        text-align: left;
    }

    .recognition-card {
        margin-top: 10px;
    }


    /* Menu */

    .premium-menu-container {
        padding: 10px 18px;
    }

    .premium-navigation {
        min-height: auto;
        justify-content: flex-end;
    }

    .premium-mobile-button {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .premium-navigation > ul {
        position: absolute;

        left: 15px;
        right: 15px;
        top: 68px;

        display: none;

        flex-direction: column;
        align-items: stretch;

        background: var(--white);

        padding: 12px;

        border-radius: 0 0 16px 16px;

        box-shadow: 0 15px 35px rgba(0, 0, 0, 0.18);
    }

    .premium-navigation > ul.show {
        display: flex;
    }

    .premium-navigation > ul > li > a {
        color: #101750;
        padding: 14px 16px;
        border-radius: 8px;
    }

    .premium-navigation > ul > li > a:hover {
        background: #f1f4ff;
        color: var(--primary-blue);
    }

    .premium-navigation > ul > li > a::after {
        display: none;
    }


    /* Mobile Dropdown */

    .premium-dropdown {
        position: static;

        min-width: 100%;

        display: none;

        opacity: 1;
        visibility: visible;

        transform: none;

        box-shadow: none;

        border-radius: 8px;

        background: #f7f8ff;

        padding: 5px;
    }

    .dropdown.open > .premium-dropdown {
        display: block;
    }

    .premium-dropdown li a {
        padding: 11px 14px;
    }

    .premium-admission-link {
        margin: 5px 0 0 !important;

        justify-content: center;

        color: var(--white) !important;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575px) {

    .institute-header {
        padding: 15px 0;
    }

    .institute-logo-box {
        height: 200px;
        border-radius: 20px;
    }

    .institute-logo {
        width: 175px;
        height: 175px;
    }

    .education-tag {
        font-size: 10px;
        padding: 7px 12px;
    }

    .institute-title {
        font-size: 22px;
    }

    .trust-name {
        font-size: 14px;
    }

    .recognized-list {
        font-size: 12px;
    }

    .recognition-logo {
        height: 100px;
    }

    .recognition-logos {
        grid-template-columns: repeat(2, 1fr);
        gap: 5px;
    }

    .premium-menu-container {
        padding: 8px 12px;
    }

    .premium-navigation > ul {
        left: 10px;
        right: 10px;
    }
}
/* =====================================================
   BAHS THEME COLORS
===================================================== */

:root{
    --bahs-navy:#11158F;
    --bahs-deep:#080C72;
    --bahs-orange:#FF7200;
    --bahs-light:#F4F5FF;
    --bahs-text:#102C62;
    --bahs-white:#ffffff;
}


/* =====================================================
   PREMIUM SLIDER
===================================================== */

.bahs-slider{
    width:100%;
    overflow:hidden;
    background:var(--bahs-light);
}

.bahs-slide{
        min-height:500px;
    height:500px;
    position:relative;
    display:flex;
    align-items:center;
    background-size:cover;
    background-position:center;
}


/* =====================================================
   SLIDE 01
===================================================== */

.slide-one{

    background-image:

    linear-gradient(
        90deg,
        rgba(8,12,114,.97) 0%,
        rgba(17,21,143,.92) 38%,
        rgba(17,21,143,.62) 65%,
        rgba(17,21,143,.15) 100%
    ),

    url("https://images.unsplash.com/photo-1600959907703-125ba1374a12?auto=format&fit=crop&w=2200&q=90");

}


/* =====================================================
   SLIDE 02
===================================================== */

.slide-two{

    background-image:

    linear-gradient(
        90deg,
        rgba(8,12,114,.97) 0%,
        rgba(17,21,143,.90) 40%,
        rgba(17,21,143,.55) 70%,
        rgba(17,21,143,.12) 100%
    ),

    url("https://images.unsplash.com/photo-1579684385127-1ef15d508118?auto=format&fit=crop&w=2200&q=90");

}


/* =====================================================
   SLIDE 03
===================================================== */

.slide-three{

    background-image:

    linear-gradient(
        90deg,
        rgba(8,12,114,.97) 0%,
        rgba(17,21,143,.91) 42%,
        rgba(17,21,143,.52) 72%,
        rgba(17,21,143,.10) 100%
    ),

    url("https://images.unsplash.com/photo-1532187863486-abf9dbad1b69?auto=format&fit=crop&w=2200&q=90");

}


/* =====================================================
   CONTENT
===================================================== */

.bahs-content{
    max-width:820px;
    color:#fff;
    position:relative;
    z-index:5;
}


/* =====================================================
   TOP LABEL
===================================================== */

.bahs-tag{

    display:inline-flex;
    align-items:center;
    gap:9px;

    padding:10px 19px;

    border-radius:50px;

    background:rgba(255,255,255,.10);

    border:1px solid rgba(255,255,255,.30);

    backdrop-filter:blur(14px);

    color:#fff;

    font-size:13px;

    font-weight:800;

    letter-spacing:.4px;

    margin-bottom:22px;

}

.bahs-tag i{
    color:var(--bahs-orange);
    font-size:16px;
}


/* =====================================================
   TITLE
===================================================== */

.bahs-title{

    font-size:clamp(25px,5.3vw,42px);

    line-height:1.05;

    font-weight:800;

    letter-spacing:-2px;

    margin-bottom:23px;

}

.bahs-title span{
    color:var(--bahs-orange);
}


/* =====================================================
   DESCRIPTION
===================================================== */

.bahs-description{

    max-width:680px;

    font-size:16px;

    line-height:1.8;

    color:rgba(255,255,255,.88);

    margin-bottom:32px;

}


/* =====================================================
   PRIMARY BUTTON
===================================================== */

.bahs-btn-primary{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:15px 25px;

    border-radius:50px;

    background:var(--bahs-orange);

    color:#fff;

    font-size:14px;

    font-weight:800;

    box-shadow:0 12px 30px rgba(255,114,0,.30);

    transition:.3s;

    text-decoration:none;

}

.bahs-btn-primary:hover{

    background:#ff850f;

    transform:translateY(-3px);

    color:#fff;

    box-shadow:0 18px 35px rgba(255,114,0,.40);

}


/* =====================================================
   OUTLINE BUTTON
===================================================== */

.bahs-btn-outline{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:14px 24px;

    border-radius:50px;

    border:1px solid rgba(255,255,255,.55);

    background:rgba(255,255,255,.08);

    backdrop-filter:blur(10px);

    color:#fff;

    font-size:14px;

    font-weight:800;

    transition:.3s;

    text-decoration:none;

}

.bahs-btn-outline:hover{

    background:#fff;

    color:var(--bahs-navy);

    border-color:#fff;

}


/* =====================================================
   FLOATING CARD
===================================================== */

.bahs-floating{

    position:absolute;

    right:6%;

    bottom:65px;

    width:320px;

    padding:24px;

    border-radius:20px;

    background:rgba(255,255,255,.12);

    border:1px solid rgba(255,255,255,.28);

    backdrop-filter:blur(18px);

    box-shadow:0 25px 60px rgba(0,0,0,.25);

    color:#fff;

    z-index:6;

}

.bahs-floating small{

    color:#ff9b50;

    font-weight:800;

    text-transform:uppercase;

    font-size:10px;

    letter-spacing:1.5px;

}

.bahs-floating h4{

    font-size:19px;

    font-weight:800;

    margin:8px 0 17px;

}

.bahs-mini{

    display:flex;

    align-items:center;

    gap:12px;

    margin:11px 0;

    font-size:13px;

    color:rgba(255,255,255,.94);

}

.bahs-mini-icon{

    width:40px;

    height:40px;

    border-radius:11px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:rgba(255,114,0,.15);

    color:var(--bahs-orange);

    border:1px solid rgba(255,114,0,.25);

    font-size:17px;

}


/* =====================================================
   SLIDE NUMBER
===================================================== */

.bahs-number{

    position:absolute;

    right:7%;

    top:50%;

    transform:translateY(-50%);

    writing-mode:vertical-rl;

    color:rgba(255,255,255,.55);

    font-size:11px;

    font-weight:700;

    letter-spacing:3px;

    z-index:4;

}


/* =====================================================
   INDICATORS
===================================================== */

.bahs-slider .carousel-indicators{

    justify-content:flex-start;

    left:calc((100% - 1320px)/2);

    bottom:28px;

    margin:0;

}

.bahs-slider .carousel-indicators button{

    width:42px;

    height:4px;

    border:0;

    border-radius:20px;

    margin-right:7px;

    background:rgba(255,255,255,.45);

    opacity:1;

}

.bahs-slider .carousel-indicators .active{

    background:var(--bahs-orange);

    width:60px;

}


/* =====================================================
   ARROWS
===================================================== */

.bahs-slider .carousel-control-prev,
.bahs-slider .carousel-control-next{

    width:48px;

    height:48px;

    top:50%;

    transform:translateY(-50%);

    border-radius:50%;

    background:rgba(17,21,143,.40);

    border:1px solid rgba(255,255,255,.40);

    backdrop-filter:blur(10px);

    opacity:1;

    transition:.3s;

}

.bahs-slider .carousel-control-prev{
    left:25px;
}

.bahs-slider .carousel-control-next{
    right:25px;
}

.bahs-slider .carousel-control-prev:hover,
.bahs-slider .carousel-control-next:hover{

    background:var(--bahs-orange);

    border-color:var(--bahs-orange);

}


/* =====================================================
   ANIMATION
===================================================== */

.carousel-item.active .bahs-tag{
    animation:bahsFadeUp .8s ease both;
}

.carousel-item.active .bahs-title{
    animation:bahsFadeUp .9s .1s ease both;
}

.carousel-item.active .bahs-description{
    animation:bahsFadeUp 1s .2s ease both;
}

.carousel-item.active .bahs-buttons{
    animation:bahsFadeUp 1s .3s ease both;
}

@keyframes bahsFadeUp{

    from{
        opacity:0;
        transform:translateY(30px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}


/* =====================================================
   MOBILE
===================================================== */

@media(max-width:1100px){

    .bahs-floating{
        display:none;
    }

    .bahs-title{
        font-size:54px;
    }

}

@media(max-width:768px){

    .bahs-slide{
        min-height:620px;
        background-position:center;
    }

    .bahs-content{
        padding:25px 20px;
    }

    .bahs-title{
        font-size:42px;
        letter-spacing:-1.3px;
    }

    .bahs-description{
        font-size:15px;
    }

    .bahs-slider .carousel-indicators{
        left:20px;
    }

    .bahs-slider .carousel-control-prev,
    .bahs-slider .carousel-control-next{
        display:none;
    }

}

@media(max-width:480px){

    .bahs-slide{
        min-height:600px;
    }

    .bahs-title{
        font-size:36px;
    }

    .bahs-buttons{
        flex-direction:column;
        align-items:flex-start;
    }

}

/* =========================================================
   PREMIUM ABOUT US
========================================================= */

.bahs-about{

    position:relative;

    padding:100px 0;

    background:#fff;

    overflow:hidden;

}


/* =========================================================
   BACKGROUND DECORATION
========================================================= */

.bahs-about::before{

    content:"";

    position:absolute;

    width:500px;

    height:500px;

    right:-250px;

    top:-200px;

    border-radius:50%;

    background:

        radial-gradient(
            circle,
            rgba(23,21,143,.07) 0%,
            rgba(23,21,143,.025) 45%,
            transparent 70%
        );

    pointer-events:none;

}


.bahs-about::after{

    content:"";

    position:absolute;

    width:280px;

    height:280px;

    left:-150px;

    bottom:-150px;

    border-radius:50%;

    border:1px solid rgba(23,21,143,.08);

    pointer-events:none;

}


/* =========================================================
   IMAGE WRAPPER
========================================================= */

.bahs-about-image-wrap{

    position:relative;

    padding:15px;

}


/* =========================================================
   MAIN IMAGE
========================================================= */

.bahs-about-image{

    position:relative;

    width:100%;

    height:560px;

    overflow:hidden;

    border-radius:28px;

    background:#f1f3ff;

    box-shadow:

        0 25px 60px rgba(17,21,143,.15);

}


.bahs-about-image::after{

    content:"";

    position:absolute;

    inset:0;

    background:

        linear-gradient(
            180deg,
            transparent 55%,
            rgba(8,12,114,.30) 100%
        );

}


.bahs-about-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;

    transition:transform .7s ease;

}


.bahs-about-image-wrap:hover
.bahs-about-image img{

    transform:scale(1.05);

}


/* =========================================================
   ORANGE BORDER EFFECT
========================================================= */

.bahs-about-image-wrap::before{

    content:"";

    position:absolute;

    width:180px;

    height:180px;

    left:-3px;

    top:-3px;

    border-left:5px solid var(--bahs-orange);

    border-top:5px solid var(--bahs-orange);

    border-radius:25px 0 0 0;

    z-index:2;

}


.bahs-about-image-wrap::after{

    content:"";

    position:absolute;

    width:180px;

    height:180px;

    right:-3px;

    bottom:-3px;

    border-right:5px solid var(--bahs-orange);

    border-bottom:5px solid var(--bahs-orange);

    border-radius:0 0 25px 0;

    z-index:2;

}


/* =========================================================
   EXPERIENCE CARD
========================================================= */

.bahs-about-experience{

    position:absolute;

    left:-5px;

    bottom:55px;

    z-index:5;

    display:flex;

    align-items:center;

    gap:14px;

    padding:18px 22px;

    min-width:300px;

    background:#fff;

    border-radius:16px;

    box-shadow:

        0 20px 45px rgba(17,21,143,.20);

}


.bahs-exp-icon{

    width:52px;

    height:52px;

    min-width:52px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:14px;

    background:var(--bahs-orange);

    color:#fff;

    font-size:23px;

}


.bahs-about-experience strong{

    display:block;

    color:var(--bahs-navy);

    font-size:16px;

    font-weight:800;

}


.bahs-about-experience span{

    display:block;

    margin-top:3px;

    color:#777;

    font-size:11px;

    font-weight:600;

}


/* =========================================================
   DECORATIVE CIRCLE
========================================================= */

.bahs-about-circle{

    position:absolute;

    width:90px;

    height:90px;

    right:-15px;

    top:35px;

    border-radius:50%;

    background:var(--bahs-orange);

    opacity:.12;

}


/* =========================================================
   SECTION LABEL
========================================================= */

.bahs-section-label{

    display:flex;

    align-items:center;

    gap:10px;

    color:var(--bahs-orange);

    font-size:12px;

    font-weight:800;

    letter-spacing:1.5px;

    margin-bottom:17px;

}


.bahs-section-label span{

    width:35px;

    height:3px;

    border-radius:20px;

    background:var(--bahs-orange);

}


/* =========================================================
   TITLE
========================================================= */

.bahs-about-title{

    max-width:650px;

    color:var(--bahs-navy);

    font-size:clamp(34px,4vw,51px);

    line-height:1.13;

    font-weight:800;

    letter-spacing:-1.7px;

    margin-bottom:23px;

}


.bahs-about-title span{

    color:var(--bahs-orange);

}


/* =========================================================
   TEXT
========================================================= */

.bahs-about-text{

    max-width:650px;

    color:#626878;

    font-size:15px;

    line-height:1.85;

    margin-bottom:15px;

}


.bahs-about-text strong{

    color:var(--bahs-navy);

    font-weight:800;

}


/* =========================================================
   FEATURE GRID
========================================================= */

.bahs-about-features{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:18px;

    margin-top:27px;

    margin-bottom:30px;

}


.bahs-about-feature{

    display:flex;

    align-items:flex-start;

    gap:13px;

    padding:16px;

    border-radius:14px;

    background:#f7f8ff;

    border:1px solid #eaebf7;

    transition:all .3s ease;

}


.bahs-about-feature:hover{

    transform:translateY(-4px);

    background:#fff;

    border-color:rgba(255,114,0,.25);

    box-shadow:

        0 12px 30px rgba(17,21,143,.09);

}


/* =========================================================
   FEATURE ICON
========================================================= */

.bahs-feature-icon{

    width:42px;

    height:42px;

    min-width:42px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:11px;

    background:rgba(255,114,0,.10);

    color:var(--bahs-orange);

    font-size:18px;

}


.bahs-about-feature h5{

    color:var(--bahs-navy);

    font-size:14px;

    font-weight:800;

    margin:2px 0 5px;

}


.bahs-about-feature p{

    color:#777;

    font-size:11px;

    line-height:1.55;

    margin:0;

}


/* =========================================================
   BUTTON
========================================================= */

.bahs-btn-about{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:14px 25px;

    border-radius:50px;

    background:var(--bahs-navy);

    color:#fff;

    text-decoration:none;

    font-size:13px;

    font-weight:800;

    transition:all .3s ease;

    box-shadow:

        0 10px 25px rgba(17,21,143,.20);

}


.bahs-btn-about:hover{

    background:var(--bahs-orange);

    color:#fff;

    transform:translateY(-3px);

    box-shadow:

        0 14px 30px rgba(255,114,0,.25);

}


.bahs-btn-about i{

    transition:.3s;

}


.bahs-btn-about:hover i{

    transform:translateX(4px);

}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:991px){

    .bahs-about{

        padding:75px 0;

    }


    .bahs-about-image{

        height:480px;

    }


    .bahs-about-content{

        padding-top:20px;

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:767px){

    .bahs-about{

        padding:60px 0;

    }


    .bahs-about-image{

        height:400px;

        border-radius:20px;

    }


    .bahs-about-experience{

        left:0;

        bottom:35px;

        min-width:260px;

        padding:14px 16px;

    }


    .bahs-exp-icon{

        width:45px;

        height:45px;

        min-width:45px;

        font-size:19px;

    }


    .bahs-about-title{

        font-size:35px;

        letter-spacing:-1px;

    }


    .bahs-about-text{

        font-size:14px;

        line-height:1.75;

    }


    .bahs-about-features{

        grid-template-columns:1fr;

        gap:12px;

    }


    .bahs-about-image-wrap::before,
    .bahs-about-image-wrap::after{

        width:100px;

        height:100px;

    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media(max-width:480px){

    .bahs-about-image{

        height:350px;

    }


    .bahs-about-experience{

        min-width:235px;

        left:5px;

    }


    .bahs-about-experience strong{

        font-size:14px;

    }


    .bahs-about-experience span{

        font-size:10px;

    }


    .bahs-about-title{

        font-size:31px;

    }

}



<!-- =========================================================
     PREMIUM COURSE CSS
========================================================= -->

/* =========================================================
   PREMIUM COURSE OFFERINGS
   BLUE + ORANGE THEME
========================================================= */

.premium-courses-section {
    position: relative;
    padding: 110px 0;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 8% 10%,
            rgba(255,255,255,.10),
            transparent 28%
        ),
        radial-gradient(
            circle at 90% 85%,
            rgba(255,255,255,.08),
            transparent 30%
        ),
        linear-gradient(
            90deg,
            var(--primary-blue-dark),
            var(--primary-blue),
            var(--primary-blue-light)
        );
}


/* decorative background */

.premium-courses-section::before {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    right: -180px;
    top: -180px;
    border-radius: 50%;
    border: 70px solid rgba(255,255,255,.05);
}

.premium-courses-section::after {
    content: "";
    position: absolute;
    width: 260px;
    height: 260px;
    left: -130px;
    bottom: -130px;
    border-radius: 50%;
    border: 45px solid rgba(255,255,255,.04);
}


/* =========================================================
   HEADING
========================================================= */

.courses-heading {
    position: relative;
    z-index: 2;
    max-width: 780px;
    margin: 0 auto 65px;
}

.courses-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    padding: 9px 18px;
    margin-bottom: 18px;

    border: 1px solid rgba(255,255,255,.20);
    border-radius: 50px;

    background: rgba(255,255,255,.10);
    backdrop-filter: blur(10px);

    color: #fff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.8px;
}

.courses-eyebrow i {
    color: var(--orange);
    font-size: 15px;
}


.courses-heading h2 {
    margin: 0;

    color: #fff;
    font-size: clamp(36px, 4vw, 56px);
    font-weight: 850;
    line-height: 1.12;
    letter-spacing: -1.5px;
}

.courses-heading h2 span {
    color: var(--orange);
}

.courses-heading p {
    max-width: 680px;
    margin: 20px auto 0;

    color: rgba(255,255,255,.78);
    font-size: 16px;
    line-height: 1.8;
}


/* =========================================================
   COURSE CARD
========================================================= */

.course-card {
    position: relative;
    z-index: 2;

    height: 100%;
    padding: 14px;

    overflow: hidden;

    border: 1px solid rgba(255,255,255,.18);
    border-radius: 24px;

    background: rgba(255,255,255,.97);

    box-shadow:
        0 20px 50px rgba(0,0,0,.15);

    transition:
        transform .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
}

.course-card:hover {
    transform: translateY(-10px);

    border-color: var(--orange);

    box-shadow:
        0 28px 65px rgba(0,0,0,.23);
}


/* =========================================================
   SMALL COURSE IMAGE
========================================================= */

.course-image-wrap {
    position: relative;

    width: 100%;
    height: 155px;

    overflow: hidden;

    border-radius: 17px;

    margin-bottom: 22px;
}

.course-image-wrap img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    display: block;

    transition: transform .5s ease;
}

.course-card:hover .course-image-wrap img {
    transform: scale(1.08);
}


/* dark image overlay */

.course-image-wrap::after {
    content: "";

    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            transparent 40%,
            rgba(0,0,0,.38)
        );

    pointer-events: none;
}


/* image icon */

.course-image-badge {
    position: absolute;

    z-index: 2;

    right: 12px;
    bottom: 12px;

    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 11px;

    background:
        linear-gradient(
            135deg,
            var(--orange),
            var(--orange-dark)
        );

    color: #fff;

    font-size: 16px;

    box-shadow: 0 8px 20px rgba(0,0,0,.20);
}


/* =========================================================
   COURSE CONTENT
========================================================= */

.course-card > *:not(.course-image-wrap) {
    margin-left: 12px;
    margin-right: 12px;
}


/* =========================================================
   TOP
========================================================= */

.course-top {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 18px;
}

.course-icon {
    width: 56px;
    height: 56px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 16px;

    background:
        linear-gradient(
            90deg,
            var(--primary-blue-dark),
            var(--primary-blue),
            var(--primary-blue-light)
        );

    color: #fff;

    font-size: 23px;

    box-shadow:
        0 10px 24px rgba(0,0,0,.14);
}

.course-number {
    color: #e5e9ef;

    font-size: 30px;
    font-weight: 900;
}


/* =========================================================
   TAG
========================================================= */

.course-tag {
    display: inline-flex;

    align-items: center;

    padding: 6px 11px;

    margin-bottom: 10px;

    border-radius: 7px;

    background: rgba(255,115,0,.10);

    color: var(--orange-dark);

    font-size: 9px;
    font-weight: 900;

    letter-spacing: 1.2px;
}


/* =========================================================
   TITLE
========================================================= */

.course-card h3 {
    min-height: 58px;

    margin-top: 0;
    margin-bottom: 12px;

    color: var(--primary-blue-dark);

    font-size: 21px;
    font-weight: 800;

    line-height: 1.3;
}

.course-card p {
    min-height: 78px;

    margin-bottom: 22px;

    color: #687786;

    font-size: 13.5px;

    line-height: 1.75;
}


/* =========================================================
   DURATION
========================================================= */

.course-duration {
    display: inline-flex;

    align-items: center;
    gap: 8px;

    padding: 8px 13px;

    margin-bottom: 15px;

    border-radius: 9px;

    background: rgba(0,0,0,.04);

    color: var(--primary-blue);

    font-size: 12px;
}

.course-duration i {
    color: var(--orange);
}


/* =========================================================
   FOOTER
========================================================= */

.course-footer {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 12px;

    padding-top: 17px;
    padding-bottom: 8px;

    border-top: 1px solid #edf0f4;
}

.course-footer span {
    display: flex;

    align-items: center;

    gap: 6px;

    color: #7b8794;

    font-size: 11px;
    font-weight: 700;
}

.course-footer span i {
    color: var(--orange);
}


.course-footer a {
    display: inline-flex;

    align-items: center;
    gap: 6px;

    padding: 8px 12px;

    border-radius: 8px;

    background:
        linear-gradient(
            135deg,
            var(--orange),
            var(--orange-dark)
        );

    color: #fff;

    text-decoration: none;

    font-size: 11px;
    font-weight: 800;

    transition: .3s ease;
}

.course-footer a:hover {
    color: #fff;

    transform: translateY(-2px);

    box-shadow:
        0 8px 18px rgba(0,0,0,.16);
}


/* =========================================================
   POPULAR COURSE
========================================================= */

.featured-course {
    border: 2px solid var(--orange);
}

.featured-course::before {
    content: "POPULAR";

    position: absolute;

    z-index: 5;

    top: 128px;
    left: -38px;

    width: 130px;

    padding: 6px 0;

    text-align: center;

    background:
        linear-gradient(
            135deg,
            var(--orange),
            var(--orange-dark)
        );

    color: #fff;

    font-size: 8px;
    font-weight: 900;

    letter-spacing: 1px;

    transform: rotate(-45deg);
}


/* =========================================================
   CTA
========================================================= */

.courses-cta {
    position: relative;
    z-index: 2;

    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 30px;

    margin-top: 65px;

    padding: 27px 32px;

    border: 1px solid rgba(255,255,255,.18);

    border-radius: 20px;

    background:
        linear-gradient(
            135deg,
            var(--orange),
            var(--orange-dark)
        );

    box-shadow:
        0 20px 50px rgba(0,0,0,.18);
}


.cta-content {
    display: flex;

    align-items: center;

    gap: 17px;
}

.cta-icon {
    width: 52px;
    height: 52px;

    flex-shrink: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 14px;

    background: rgba(255,255,255,.18);

    color: #fff;

    font-size: 21px;
}

.cta-content span {
    color: rgba(255,255,255,.85);

    font-size: 9px;
    font-weight: 900;

    letter-spacing: 1.5px;
}

.cta-content h3 {
    margin: 4px 0 0;

    color: #fff;

    font-size: 20px;
    font-weight: 800;
}


.cta-button {
    display: inline-flex;

    align-items: center;
    gap: 9px;

    padding: 13px 21px;

    border-radius: 10px;

    background: #fff;

    color: var(--primary-blue-dark);

    text-decoration: none;

    font-size: 12px;
    font-weight: 900;

    white-space: nowrap;

    transition: .3s ease;
}

.cta-button:hover {
    color: var(--primary-blue-dark);

    transform: translateY(-3px);

    box-shadow:
        0 10px 25px rgba(0,0,0,.18);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 991px) {

    .premium-courses-section {
        padding: 80px 0;
    }

    .courses-cta {
        flex-direction: column;
        align-items: flex-start;
    }

}


@media (max-width: 575px) {

    .premium-courses-section {
        padding: 65px 0;
    }

    .course-image-wrap {
        height: 145px;
    }

    .course-card {
        padding: 11px;
        border-radius: 20px;
    }

    .course-card h3 {
        font-size: 20px;
    }

    .course-card p {
        min-height: auto;
    }

    .course-footer {
        align-items: flex-start;
    }

    .courses-cta {
        padding: 23px;
    }

    .cta-content {
        align-items: flex-start;
    }

    .cta-content h3 {
        font-size: 17px;
    }

    .cta-button {
        width: 100%;
        justify-content: center;
    }

}
/* =========================================================
   PREMIUM COURSE OFFERINGS
   BLUE + ORANGE THEME
========================================================= */

.premium-course-section {

    --background:
        linear-gradient(
            90deg,
            var(--primary-blue-dark),
            var(--primary-blue),
            var(--primary-blue-light)
        );

    position: relative;

    padding: 110px 0;

    overflow: hidden;

    background: var(--background);
}


/* =========================================================
   BACKGROUND DECORATION
========================================================= */

.premium-course-section::before {

    content: "";

    position: absolute;

    width: 480px;
    height: 480px;

    right: -240px;
    top: -240px;

    border-radius: 50%;

    border: 80px solid rgba(255,255,255,.055);

}

.premium-course-section::after {

    content: "";

    position: absolute;

    width: 300px;
    height: 300px;

    left: -150px;
    bottom: -150px;

    border-radius: 50%;

    border: 55px solid rgba(255,255,255,.045);

}


/* =========================================================
   HEADING
========================================================= */

.course-section-heading {

    position: relative;

    z-index: 2;

    max-width: 780px;

    margin: 0 auto 65px;

    text-align: center;
}


.course-heading-badge {

    display: inline-flex;

    align-items: center;

    gap: 8px;

    padding: 9px 18px;

    margin-bottom: 18px;

    border: 1px solid rgba(255,255,255,.22);

    border-radius: 50px;

    background: rgba(255,255,255,.10);

    backdrop-filter: blur(12px);

    color: #fff;

    font-size: 10px;

    font-weight: 900;

    letter-spacing: 1.7px;
}


.course-heading-badge i {

    color: var(--orange);

    font-size: 15px;
}


.course-section-heading h2 {

    margin: 0;

    color: #fff;

    font-size: clamp(38px, 4vw, 56px);

    font-weight: 850;

    line-height: 1.12;

    letter-spacing: -1.5px;
}


.course-section-heading h2 span {

    color: var(--orange);
}


.course-section-heading p {

    max-width: 680px;

    margin: 20px auto 0;

    color: rgba(255,255,255,.78);

    font-size: 15px;

    line-height: 1.8;
}


/* =========================================================
   COURSE CARD
========================================================= */

.premium-course-card {

    position: relative;

    z-index: 2;

    height: 100%;

    padding: 12px;

    overflow: hidden;

    border: 1px solid rgba(255,255,255,.20);

    border-radius: 24px;

    background: rgba(255,255,255,.97);

    box-shadow:
        0 20px 55px rgba(0,0,0,.16);

    transition:
        transform .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
}


.premium-course-card:hover {

    transform: translateY(-10px);

    border-color: var(--orange);

    box-shadow:
        0 30px 70px rgba(0,0,0,.25);
}


/* =========================================================
   IMAGE
========================================================= */

.course-image {

    position: relative;

    height: 165px;

    overflow: hidden;

    border-radius: 17px;
}


.course-image img {

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition: transform .6s ease;
}


.premium-course-card:hover .course-image img {

    transform: scale(1.09);
}


.course-image::after {

    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            transparent 40%,
            rgba(0,0,0,.45)
        );
}


/* =========================================================
   COURSE LEVEL
========================================================= */

.course-level {

    position: absolute;

    z-index: 3;

    left: 12px;
    top: 12px;

    padding: 6px 10px;

    border-radius: 7px;

    background:
        linear-gradient(
            135deg,
            var(--primary-blue-dark),
            var(--primary-blue)
        );

    color: #fff;

    font-size: 8px;

    font-weight: 900;

    letter-spacing: 1px;
}


.orange-level {

    background:
        linear-gradient(
            135deg,
            var(--orange),
            var(--orange-dark)
        );
}


.university-level {

    background:
        linear-gradient(
            135deg,
            var(--orange),
            var(--orange-dark)
        );
}


/* =========================================================
   IMAGE ICON
========================================================= */

.course-image-icon {

    position: absolute;

    z-index: 4;

    right: 12px;
    bottom: 12px;

    width: 40px;
    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 11px;

    background:
        linear-gradient(
            135deg,
            var(--orange),
            var(--orange-dark)
        );

    color: #fff;

    font-size: 16px;

    box-shadow:
        0 8px 20px rgba(0,0,0,.22);
}


/* =========================================================
   POPULAR RIBBON
========================================================= */

.popular-ribbon {

    position: absolute;

    z-index: 5;

    top: 18px;
    right: -32px;

    width: 115px;

    padding: 6px 0;

    text-align: center;

    background:
        linear-gradient(
            135deg,
            var(--orange),
            var(--orange-dark)
        );

    color: #fff;

    font-size: 8px;

    font-weight: 900;

    letter-spacing: 1px;

    transform: rotate(45deg);
}


/* =========================================================
   CONTENT
========================================================= */

.course-content {

    position: relative;

    padding: 23px 14px 12px;
}


.course-number {

    position: absolute;

    right: 13px;
    top: 16px;

    color: #e9edf3;

    font-size: 32px;

    font-weight: 900;
}


.course-content h3 {

    position: relative;

    z-index: 2;

    min-height: 55px;

    max-width: 90%;

    margin: 0 0 12px;

    color: var(--primary-blue-dark);

    font-size: 21px;

    font-weight: 800;

    line-height: 1.3;
}


.course-content p {

    min-height: 76px;

    margin: 0 0 18px;

    color: #6d7a88;

    font-size: 13px;

    line-height: 1.75;
}


/* =========================================================
   COURSE INFO
========================================================= */

.course-info {

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 8px;

    margin-bottom: 17px;
}


.course-info span {

    display: inline-flex;

    align-items: center;

    gap: 6px;

    padding: 7px 9px;

    border-radius: 7px;

    background: #f5f7fa;

    color: #687786;

    font-size: 10px;

    font-weight: 700;
}


.course-info i {

    color: var(--orange);

    font-size: 12px;
}


/* =========================================================
   DURATION
========================================================= */

.duration-box {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    padding: 9px 13px;

    margin-bottom: 15px;

    border-radius: 10px;

    background: rgba(255,122,0,.08);

    color: var(--orange-dark);
}


.duration-box > i {

    font-size: 17px;
}


.duration-box div {

    display: flex;

    flex-direction: column;

    gap: 2px;
}


.duration-box small {

    font-size: 7px;

    font-weight: 900;

    letter-spacing: 1px;
}


.duration-box strong {

    font-size: 13px;

    color: var(--primary-blue-dark);
}


/* =========================================================
   UNIVERSITY
========================================================= */

.university-name {

    display: flex;

    align-items: center;

    gap: 7px;

    margin-bottom: 17px;

    padding: 9px 12px;

    border-left: 3px solid var(--orange);

    background: #f7f9fc;

    color: var(--primary-blue-dark);

    font-size: 11px;

    font-weight: 800;
}


.university-name i {

    color: var(--orange);

    font-size: 14px;
}


/* =========================================================
   COURSE LINK
========================================================= */

.course-link {

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding-top: 15px;

    border-top: 1px solid #edf0f4;

    color: var(--primary-blue);

    text-decoration: none;

    font-size: 12px;

    font-weight: 900;

    transition: .3s ease;
}


.course-link i {

    width: 30px;
    height: 30px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 8px;

    background:
        linear-gradient(
            135deg,
            var(--orange),
            var(--orange-dark)
        );

    color: #fff;

    transition: .3s ease;
}


.course-link:hover {

    color: var(--orange-dark);
}


.course-link:hover i {

    transform: translate(3px,-3px);
}


/* =========================================================
   CTA
========================================================= */

.course-bottom-cta {

    position: relative;

    z-index: 2;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 25px;

    margin-top: 65px;

    padding: 28px 32px;

    border-radius: 21px;

    background:
        linear-gradient(
            135deg,
            var(--orange),
            var(--orange-dark)
        );

    box-shadow:
        0 22px 55px rgba(0,0,0,.20);
}


.cta-left {

    display: flex;

    align-items: center;

    gap: 17px;
}


.cta-icon {

    width: 52px;
    height: 52px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 14px;

    background: rgba(255,255,255,.18);

    color: #fff;

    font-size: 21px;
}


.cta-left span {

    color: rgba(255,255,255,.85);

    font-size: 9px;

    font-weight: 900;

    letter-spacing: 1.5px;
}


.cta-left h3 {

    margin: 4px 0 0;

    color: #fff;

    font-size: 20px;

    font-weight: 800;
}


.cta-button {

    display: inline-flex;

    align-items: center;

    gap: 9px;

    padding: 14px 22px;

    border-radius: 10px;

    background: #fff;

    color: var(--primary-blue-dark);

    text-decoration: none;

    font-size: 12px;

    font-weight: 900;

    white-space: nowrap;

    transition: .3s ease;
}


.cta-button:hover {

    color: var(--primary-blue-dark);

    transform: translateY(-3px);

    box-shadow:
        0 10px 25px rgba(0,0,0,.20);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 991px) {

    .premium-course-section {

        padding: 80px 0;
    }

    .course-bottom-cta {

        flex-direction: column;

        align-items: flex-start;
    }

}


@media (max-width: 575px) {

    .premium-course-section {

        padding: 65px 0;
    }

    .course-section-heading {

        margin-bottom: 42px;
    }

    .course-section-heading h2 {

        font-size: 36px;
    }

    .course-image {

        height: 150px;
    }

    .premium-course-card {

        border-radius: 20px;
    }

    .course-content h3 {

        font-size: 20px;
    }

    .course-content p {

        min-height: auto;
    }

    .course-bottom-cta {

        padding: 24px;

    }

    .cta-left {

        align-items: flex-start;
    }

    .cta-left h3 {

        font-size: 17px;
    }

    .cta-button {

        width: 100%;

        justify-content: center;
    }

}


/* ---------------------------------------------------------
   THEME
--------------------------------------------------------- */

:root {
    --primary-blue-dark: #082b59;
    --primary-blue: #0d4f91;
    --primary-blue-light: #176db8;

    --orange: #f58220;
    --orange-dark: #e56d0a;

    --why-light: #f5f9fd;
    --why-text: #172b4d;
    --why-muted: #667085;
}


/* ---------------------------------------------------------
   SECTION
--------------------------------------------------------- */

.why-choose-section {
    position: relative;
    padding: 100px 0;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 90% 10%,
            rgba(245,130,32,0.08),
            transparent 28%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f6faff 100%
        );
}


/* ---------------------------------------------------------
   IMAGE AREA
--------------------------------------------------------- */

.why-image-wrap {
    position: relative;
    padding: 15px 25px 35px 15px;
}

.why-image-box {
    position: relative;
    overflow: hidden;
    border-radius: 28px;

    box-shadow:
        0 25px 60px rgba(8,43,89,0.20);

    z-index: 2;
}

.why-image-box img {
    width: 100%;
    height: 520px;
    object-fit: cover;
    display: block;

    transition: transform 0.7s ease;
}

.why-image-box:hover img {
    transform: scale(1.06);
}


/* ---------------------------------------------------------
   IMAGE OVERLAY
--------------------------------------------------------- */

.why-image-box::after {
    content: "";
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            135deg,
            rgba(8,43,89,0.18),
            transparent 55%,
            rgba(245,130,32,0.20)
        );

    pointer-events: none;
}


/* ---------------------------------------------------------
   EXPERIENCE BADGE
--------------------------------------------------------- */

.experience-badge {
    position: absolute;
    right: 0;
    bottom: 55px;

    width: 170px;
    height: 170px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            var(--orange),
            var(--orange-dark)
        );

    color: #fff;

    border: 8px solid #fff;

    box-shadow:
        0 20px 45px rgba(245,130,32,0.35);

    z-index: 5;
}

.experience-number {
    font-size: 42px;
    line-height: 1;
    font-weight: 800;
}

.experience-text {
    margin-top: 8px;

    font-size: 13px;
    line-height: 1.35;
    font-weight: 600;
    text-align: center;

    text-transform: uppercase;
    letter-spacing: 0.7px;
}


/* ---------------------------------------------------------
   DECORATION
--------------------------------------------------------- */

.orange-shape {
    position: absolute;

    left: -5px;
    bottom: 5px;

    width: 110px;
    height: 110px;

    border-radius: 22px;

    background:
        linear-gradient(
            135deg,
            var(--orange),
            var(--orange-dark)
        );

    transform: rotate(-12deg);

    z-index: 1;
}

.orange-shape::before,
.orange-shape::after {
    content: "";

    position: absolute;

    border: 2px solid rgba(255,255,255,0.35);
    border-radius: 50%;
}

.orange-shape::before {
    width: 55px;
    height: 55px;
    left: 27px;
    top: 27px;
}

.orange-shape::after {
    width: 25px;
    height: 25px;
    left: 42px;
    top: 42px;
}


/* ---------------------------------------------------------
   CONTENT
--------------------------------------------------------- */

.why-content {
    padding-left: 25px;
}

.why-subtitle {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    color: var(--orange);

    font-size: 13px;
    font-weight: 800;

    letter-spacing: 2px;
}

.why-subtitle span {
    display: inline-block;

    width: 35px;
    height: 3px;

    border-radius: 10px;

    background: var(--orange);
}


.why-title {
    margin-top: 18px;
    margin-bottom: 18px;

    max-width: 680px;

    color: var(--primary-blue-dark);

    font-size: clamp(34px, 4vw, 48px);

    line-height: 1.15;
    font-weight: 700;

    letter-spacing: -1.2px;
}

.why-title strong {
    display: inline;

    color: var(--primary-blue);
}


.why-description {
    max-width: 680px;

    color: var(--why-muted);

    font-size: 16px;
    line-height: 1.8;

    margin-bottom: 10px;
}


/* ---------------------------------------------------------
   FEATURE CARD
--------------------------------------------------------- */

.why-feature {
    height: 100%;

    display: flex;
    align-items: flex-start;

    gap: 16px;

    padding: 22px;

    border-radius: 18px;

    background: #fff;

    border: 1px solid rgba(13,79,145,0.08);

    box-shadow:
        0 8px 25px rgba(8,43,89,0.06);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}

.why-feature:hover {
    transform: translateY(-6px);

    border-color: rgba(245,130,32,0.25);

    box-shadow:
        0 18px 38px rgba(8,43,89,0.12);
}


/* ---------------------------------------------------------
   FEATURE ICON
--------------------------------------------------------- */

.feature-icon {
    flex: 0 0 55px;

    width: 55px;
    height: 55px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 15px;

    color: #fff;

    font-size: 23px;

    background:
        linear-gradient(
            135deg,
            var(--primary-blue),
            var(--primary-blue-dark)
        );

    box-shadow:
        0 8px 20px rgba(13,79,145,0.22);
}

.feature-icon.orange-icon {
    background:
        linear-gradient(
            135deg,
            var(--orange),
            var(--orange-dark)
        );

    box-shadow:
        0 8px 20px rgba(245,130,32,0.22);
}


/* ---------------------------------------------------------
   FEATURE TEXT
--------------------------------------------------------- */

.feature-content h4 {
    margin: 2px 0 7px;

    color: var(--primary-blue-dark);

    font-size: 17px;
    font-weight: 750;
}

.feature-content p {
    margin: 0;

    color: #7a869a;

    font-size: 13px;
    line-height: 1.6;
}


/* ---------------------------------------------------------
   CTA
--------------------------------------------------------- */

.why-cta {
    margin-top: 28px;

    display: flex;
    align-items: center;
    gap: 15px;

    padding: 14px 16px;

    border-radius: 18px;

    background:
        linear-gradient(
            110deg,
            var(--primary-blue-dark),
            var(--primary-blue)
        );

    box-shadow:
        0 15px 35px rgba(8,43,89,0.18);
}

.cta-icon {
    flex: 0 0 48px;

    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    background: rgba(255,255,255,0.13);

    color: var(--orange);

    font-size: 21px;
}

.cta-text {
    display: flex;
    flex-direction: column;

    flex: 1;
}

.cta-text strong {
    color: #fff;

    font-size: 15px;
}

.cta-text span {
    margin-top: 3px;

    color: rgba(255,255,255,0.68);

    font-size: 12px;
}


.why-btn {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    padding: 13px 20px;

    border-radius: 12px;

    color: #fff !important;

    background:
        linear-gradient(
            135deg,
            var(--orange),
            var(--orange-dark)
        );

    text-decoration: none;

    font-size: 13px;
    font-weight: 700;

    white-space: nowrap;

    box-shadow:
        0 8px 20px rgba(245,130,32,0.25);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.why-btn:hover {
    transform: translateY(-2px);

    box-shadow:
        0 12px 28px rgba(245,130,32,0.35);
}

.why-btn i {
    transition: transform 0.3s ease;
}

.why-btn:hover i {
    transform: translateX(4px);
}


/* ---------------------------------------------------------
   RESPONSIVE
--------------------------------------------------------- */

@media (max-width: 991px) {

    .why-choose-section {
        padding: 75px 0;
    }

    .why-content {
        padding-left: 0;
    }

    .why-image-box img {
        height: 450px;
    }

    .experience-badge {
        right: 15px;
    }
}


@media (max-width: 767px) {

    .why-choose-section {
        padding: 60px 0;
    }

    .why-image-wrap {
        padding: 10px 15px 35px 5px;
    }

    .why-image-box {
        border-radius: 22px;
    }

    .why-image-box img {
        height: 380px;
    }

    .experience-badge {
        width: 135px;
        height: 135px;

        bottom: 45px;
        right: 0;

        border-width: 6px;
    }

    .experience-number {
        font-size: 34px;
    }

    .experience-text {
        font-size: 10px;
    }

    .orange-shape {
        width: 75px;
        height: 75px;
    }

    .orange-shape::before {
        width: 38px;
        height: 38px;
        left: 18px;
        top: 18px;
    }

    .orange-shape::after {
        width: 18px;
        height: 18px;
        left: 28px;
        top: 28px;
    }

    .why-title {
        font-size: 34px;
    }

    .why-description {
        font-size: 14px;
    }

    .why-feature {
        padding: 18px;
    }

    .why-cta {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .cta-text {
        min-width: calc(100% - 65px);
    }

    .why-btn {
        width: 100%;
        justify-content: center;
    }
}
/* =========================================================
   TESTIMONIAL SECTION
========================================================= */

.testimonials-section {
    position: relative;
    padding: 105px 0;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 10% 20%,
            rgba(13,79,145,0.08),
            transparent 30%
        ),
        radial-gradient(
            circle at 90% 80%,
            rgba(245,130,32,0.08),
            transparent 28%
        ),
        #f7faff;
}


/* =========================================================
   DECORATIVE ORBS
========================================================= */

.testimonial-orb {
    position: absolute;
    border-radius: 50%;

    pointer-events: none;
}

.orb-one {
    width: 220px;
    height: 220px;

    left: -110px;
    top: 80px;

    border: 35px solid rgba(13,79,145,0.035);
}

.orb-two {
    width: 280px;
    height: 280px;

    right: -140px;
    bottom: 30px;

    border: 45px solid rgba(245,130,32,0.035);
}


/* =========================================================
   HEADING
========================================================= */

.testimonial-heading {
    position: relative;
    z-index: 2;

    max-width: 760px;
    margin: 0 auto;
}

.testimonial-subtitle {
    display: inline-flex;
    align-items: center;
    gap: 12px;

    color: #f58220;

    font-size: 12px;
    font-weight: 800;

    letter-spacing: 2.5px;
}

.testimonial-subtitle span {
    width: 32px;
    height: 2px;

    display: inline-block;

    border-radius: 10px;

    background: #f58220;
}

.testimonial-heading h2 {
    margin: 16px 0 15px;

    color: #082b59;

    font-size: clamp(36px, 4vw, 50px);
    line-height: 1.15;

    font-weight: 700;

    letter-spacing: -1px;
}

.testimonial-heading h2 strong {
    color: #0d4f91;
}

.testimonial-heading p {
    max-width: 650px;

    margin: 0 auto;

    color: #6d7b91;

    font-size: 15px;
    line-height: 1.8;
}


/* =========================================================
   TESTIMONIAL CARD
========================================================= */

.testimonial-card {
    position: relative;

    height: 100%;

    padding: 34px 30px 28px;

    border-radius: 24px;

    background: rgba(255,255,255,0.95);

    border: 1px solid rgba(13,79,145,0.08);

    box-shadow:
        0 12px 40px rgba(8,43,89,0.07);

    overflow: hidden;

    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease,
        border-color 0.4s ease;
}

.testimonial-card:hover {
    transform: translateY(-9px);

    border-color: rgba(245,130,32,0.25);

    box-shadow:
        0 25px 55px rgba(8,43,89,0.13);
}


/* =========================================================
   FEATURED CARD
========================================================= */

.testimonial-featured {
    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f4f9ff
        );

    border-top: 4px solid #f58220;
}


/* =========================================================
   QUOTE ICON
========================================================= */

.quote-icon {
    position: absolute;

    top: 22px;
    right: 25px;

    width: 52px;
    height: 52px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 15px;

    background:
        linear-gradient(
            135deg,
            rgba(13,79,145,0.09),
            rgba(245,130,32,0.12)
        );

    color: #f58220;

    font-size: 30px;

    line-height: 1;
}


/* =========================================================
   STARS
========================================================= */

.testimonial-stars {
    display: flex;
    gap: 4px;

    margin-bottom: 20px;
}

.testimonial-stars i {
    color: #f58220;

    font-size: 14px;
}


/* =========================================================
   TEXT
========================================================= */

.testimonial-text {
    position: relative;

    margin: 0;

    min-height: 155px;

    color: #536276;

    font-size: 14px;

    line-height: 1.9;
}


/* =========================================================
   USER
========================================================= */

.testimonial-user {
    display: flex;
    align-items: center;

    gap: 13px;

    padding-top: 20px;

    margin-top: 20px;

    border-top: 1px solid rgba(8,43,89,0.08);
}

.user-avatar {
    width: 52px;
    height: 52px;

    flex: 0 0 52px;

    overflow: hidden;

    border-radius: 50%;

    border: 3px solid #fff;

    box-shadow:
        0 5px 15px rgba(8,43,89,0.15);
}

.user-avatar img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.user-info {
    flex: 1;
}

.user-info h4 {
    margin: 0 0 3px;

    color: #082b59;

    font-size: 15px;
    font-weight: 750;
}

.user-info span {
    color: #8793a5;

    font-size: 11px;
}

.verified {
    color: #0d4f91;

    font-size: 20px;
}


/* =========================================================
   TRUST AREA
========================================================= */

.testimonial-trust {
    position: relative;
    z-index: 2;

    margin-top: 45px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;

    padding: 22px 25px;

    border-radius: 20px;

    background:
        linear-gradient(
            110deg,
            #082b59,
            #0d4f91
        );

    box-shadow:
        0 18px 45px rgba(8,43,89,0.17);
}


/* =========================================================
   TRUST CONTENT
========================================================= */

.trust-content {
    display: flex;
    align-items: center;

    gap: 14px;
}

.trust-icon {
    width: 48px;
    height: 48px;

    flex: 0 0 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 14px;

    background: rgba(245,130,32,0.16);

    color: #f58220;

    font-size: 19px;
}

.trust-content strong {
    display: block;

    color: #fff;

    font-size: 15px;
}

.trust-content span {
    display: block;

    margin-top: 3px;

    color: rgba(255,255,255,0.65);

    font-size: 12px;
}


/* =========================================================
   RATING
========================================================= */

.trust-rating {
    display: flex;
    align-items: center;

    gap: 12px;
}

.rating-number {
    color: #fff;

    font-size: 30px;
    line-height: 1;

    font-weight: 800;
}

.rating-details {
    display: flex;
    flex-direction: column;
}

.rating-stars {
    color: #f58220;

    font-size: 15px;

    letter-spacing: 2px;
}

.rating-details span {
    color: rgba(255,255,255,0.62);

    font-size: 10px;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 991px) {

    .testimonials-section {
        padding: 80px 0;
    }

    .testimonial-text {
        min-height: auto;
    }

    .testimonial-trust {
        flex-direction: column;
        align-items: flex-start;
    }

    .trust-rating {
        width: 100%;

        padding-top: 15px;

        border-top: 1px solid rgba(255,255,255,0.12);
    }
}


@media (max-width: 767px) {

    .testimonials-section {
        padding: 65px 0;
    }

    .testimonial-heading h2 {
        font-size: 34px;
    }

    .testimonial-heading p {
        font-size: 14px;
    }

    .testimonial-card {
        padding: 28px 22px 24px;
    }

    .quote-icon {
        width: 45px;
        height: 45px;

        font-size: 25px;
    }

    .testimonial-text {
        font-size: 13px;
        line-height: 1.8;
    }

    .testimonial-trust {
        padding: 20px;

        gap: 20px;
    }

}



/* =========================================================
   FOOTER VARIABLES
========================================================= */

:root {
    --footer-navy: #061f42;
    --footer-blue: #082b59;
    --footer-blue-light: #0d4f91;

    --footer-orange: #f58220;
    --footer-orange-dark: #e66d0a;

    --footer-text: #aebdd0;
}


/* =========================================================
   FOOTER
========================================================= */

.premium-footer {
    position: relative;

    color: #fff;

    background:
        radial-gradient(
            circle at 15% 20%,
            rgba(13,79,145,0.30),
            transparent 30%
        ),
        radial-gradient(
            circle at 90% 70%,
            rgba(245,130,32,0.08),
            transparent 25%
        ),
        var(--footer-navy);

    overflow: hidden;
}


/* =========================================================
   TOP CTA
========================================================= */

.footer-cta-wrap {
    position: relative;

    padding-top: 70px;
}

.footer-cta {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;

    padding: 30px 35px;

    border-radius: 24px;

    background:
        linear-gradient(
            110deg,
            #0d4f91,
            #082b59
        );

    border: 1px solid rgba(255,255,255,0.10);

    box-shadow:
        0 25px 55px rgba(0,0,0,0.25);

    overflow: hidden;
}

.footer-cta::after {
    content: "";

    position: absolute;

    width: 250px;
    height: 250px;

    right: -100px;
    top: -120px;

    border-radius: 50%;

    border: 45px solid rgba(245,130,32,0.08);
}

.footer-cta-content {
    position: relative;

    display: flex;
    align-items: center;

    gap: 20px;

    z-index: 2;
}

.footer-cta-icon {
    width: 65px;
    height: 65px;

    flex: 0 0 65px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 18px;

    color: #fff;

    background:
        linear-gradient(
            135deg,
            var(--footer-orange),
            var(--footer-orange-dark)
        );

    font-size: 27px;

    box-shadow:
        0 12px 28px rgba(245,130,32,0.25);
}

.footer-cta-label {
    display: block;

    margin-bottom: 5px;

    color: #f58220;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 2px;
}

.footer-cta h3 {
    margin: 0;

    color: #fff;

    font-size: 25px;

    font-weight: 700;
}

.footer-cta h3 strong {
    color: #f58220;
}

.footer-cta p {
    margin: 6px 0 0;

    color: rgba(255,255,255,0.65);

    font-size: 13px;
}


/* =========================================================
   ADMISSION BUTTON
========================================================= */

.footer-admission-btn {
    position: relative;
    z-index: 2;

    display: inline-flex;
    align-items: center;
    gap: 10px;

    padding: 15px 22px;

    border-radius: 13px;

    color: #fff !important;

    background:
        linear-gradient(
            135deg,
            var(--footer-orange),
            var(--footer-orange-dark)
        );

    text-decoration: none;

    font-size: 13px;

    font-weight: 700;

    white-space: nowrap;

    box-shadow:
        0 10px 25px rgba(245,130,32,0.25);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.footer-admission-btn:hover {
    color: #fff;

    transform: translateY(-3px);

    box-shadow:
        0 15px 32px rgba(245,130,32,0.35);
}

.footer-admission-btn i {
    transition: transform .3s ease;
}

.footer-admission-btn:hover i {
    transform: translateX(4px);
}


/* =========================================================
   MAIN FOOTER
========================================================= */

.footer-main {
    padding: 75px 0 55px;
}


/* =========================================================
   BRAND
========================================================= */

.footer-logo {
    display: inline-flex;
    align-items: center;

    gap: 12px;

    text-decoration: none;

    margin-bottom: 22px;
}

.footer-logo-mark {
    width: 52px;
    height: 52px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 15px;

    color: #fff;

    background:
        linear-gradient(
            135deg,
            var(--footer-orange),
            var(--footer-orange-dark)
        );

    font-size: 23px;

    box-shadow:
        0 10px 25px rgba(245,130,32,0.20);
}

.footer-logo-text {
    display: flex;
    flex-direction: column;
}

.footer-logo-text strong {
    color: #fff;

    font-size: 25px;

    line-height: 1;

    letter-spacing: 1px;
}

.footer-logo-text strong span {
    color: var(--footer-orange);
}

.footer-logo-text small {
    margin-top: 5px;

    color: rgba(255,255,255,0.52);

    font-size: 7px;

    font-weight: 700;

    letter-spacing: 1.1px;
}

.footer-about {
    max-width: 390px;

    margin: 0 0 24px;

    color: var(--footer-text);

    font-size: 13px;

    line-height: 1.9;
}


/* =========================================================
   SOCIAL
========================================================= */

.footer-social {
    display: flex;
    gap: 9px;
}

.footer-social a {
    width: 39px;
    height: 39px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 11px;

    color: #b9c7d9;

    background: rgba(255,255,255,0.06);

    border: 1px solid rgba(255,255,255,0.07);

    text-decoration: none;

    font-size: 14px;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease;
}

.footer-social a:hover {
    color: #fff;

    background: var(--footer-orange);

    border-color: var(--footer-orange);

    transform: translateY(-4px);
}


/* =========================================================
   FOOTER COLUMNS
========================================================= */

.footer-column h4 {
    margin: 0;

    color: #fff;

    font-size: 16px;

    font-weight: 700;
}

.footer-line {
    display: block;

    width: 35px;
    height: 3px;

    margin: 12px 0 20px;

    border-radius: 5px;

    background: var(--footer-orange);
}


/* =========================================================
   FOOTER LINKS
========================================================= */

.footer-column ul {
    list-style: none;

    padding: 0;
    margin: 0;
}

.footer-column ul li {
    margin-bottom: 11px;
}

.footer-column ul li a {
    display: inline-flex;
    align-items: center;

    gap: 7px;

    color: var(--footer-text);

    text-decoration: none;

    font-size: 12px;

    transition:
        color .3s ease,
        padding-left .3s ease;
}

.footer-column ul li a i {
    color: var(--footer-orange);

    font-size: 9px;
}

.footer-column ul li a:hover {
    color: #fff;

    padding-left: 5px;
}


/* =========================================================
   CONTACT
========================================================= */

.footer-contact {
    display: flex;

    align-items: flex-start;

    gap: 13px;

    margin-bottom: 20px;
}

.contact-icon {
    width: 38px;
    height: 38px;

    flex: 0 0 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 10px;

    color: var(--footer-orange);

    background: rgba(245,130,32,0.09);

    font-size: 14px;
}

.footer-contact span {
    display: block;

    margin-bottom: 3px;

    color: rgba(255,255,255,0.45);

    font-size: 9px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 1px;
}

.footer-contact p {
    margin: 0;

    color: var(--footer-text);

    font-size: 12px;

    line-height: 1.6;
}

.footer-contact a {
    color: var(--footer-text);

    text-decoration: none;

    font-size: 12px;

    transition: color .3s ease;
}

.footer-contact a:hover {
    color: var(--footer-orange);
}


/* =========================================================
   FOOTER BOTTOM
========================================================= */

.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.07);

    background: rgba(0,0,0,0.14);
}

.footer-bottom-inner {
    min-height: 72px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;
}

.footer-bottom p {
    margin: 0;

    color: rgba(255,255,255,0.45);

    font-size: 11px;
}

.footer-bottom p strong {
    color: rgba(255,255,255,0.75);
}

.footer-bottom-links {
    display: flex;
    align-items: center;

    gap: 12px;
}

.footer-bottom-links a {
    color: rgba(255,255,255,0.45);

    text-decoration: none;

    font-size: 10px;

    transition: color .3s ease;
}

.footer-bottom-links a:hover {
    color: var(--footer-orange);
}

.footer-bottom-links span {
    width: 3px;
    height: 3px;

    border-radius: 50%;

    background: var(--footer-orange);
}


/* =========================================================
   BACK TO TOP
========================================================= */

.back-to-top {
    position: fixed;

    right: 25px;
    bottom: 25px;

    width: 45px;
    height: 45px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    color: #fff !important;

    background:
        linear-gradient(
            135deg,
            var(--footer-orange),
            var(--footer-orange-dark)
        );

    text-decoration: none;

    box-shadow:
        0 10px 25px rgba(0,0,0,0.20);

    z-index: 999;

    transition:
        transform .3s ease,
        opacity .3s ease;
}

.back-to-top:hover {
    transform: translateY(-4px);
}

.back-to-top i {
    font-size: 17px;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 991px) {

    .footer-cta {
        flex-direction: column;
        align-items: flex-start;
    }

    .footer-admission-btn {
        width: 100%;
        justify-content: center;
    }

    .footer-main {
        padding: 60px 0 45px;
    }

    .footer-bottom-inner {
        padding: 20px 0;

        flex-direction: column;

        justify-content: center;

        text-align: center;
    }
}


@media (max-width: 767px) {

    .footer-cta-wrap {
        padding-top: 55px;
    }

    .footer-cta {
        padding: 25px 20px;

        border-radius: 20px;
    }

    .footer-cta-content {
        align-items: flex-start;
    }

    .footer-cta-icon {
        width: 52px;
        height: 52px;

        flex-basis: 52px;

        font-size: 21px;
    }

    .footer-cta h3 {
        font-size: 20px;
    }

    .footer-cta p {
        font-size: 11px;
        line-height: 1.6;
    }

    .footer-main {
        padding: 50px 0 35px;
    }

    .footer-logo-text strong {
        font-size: 22px;
    }

    .footer-bottom-links {
        flex-wrap: wrap;
        justify-content: center;
    }

    .back-to-top {
        width: 40px;
        height: 40px;

        right: 15px;
        bottom: 15px;
    }
}


/* =========================================================
   PLACEMENT SECTION
========================================================= */

.placement-section {

    position: relative;

    overflow: hidden;

    padding: 55px 0 60px;

    background:

        radial-gradient(
            circle at 10% 20%,
            rgba(22, 80, 180, .035),
            transparent 30%
        ),

        radial-gradient(
            circle at 90% 80%,
            rgba(255, 90, 70, .035),
            transparent 30%
        ),

        linear-gradient(
            135deg,
            #f8fbff 0%,
            #ffffff 50%,
            #fff9fb 100%
        );

}



/* =========================================================
   HEADER
========================================================= */

.placement-header {

    margin-bottom: 58px;

}



.placement-title {

    margin: 0;

    color: #10158f;

    font-size: 31px;

    font-weight: 800;

    letter-spacing: -.5px;

}



.placement-title i {

    margin-right: 8px;

    color: #ff423b;

    font-size: 30px;

}



.placement-subtitle {

    margin: 12px 0 0;

    color: #71809a;

    font-size: 16px;

    font-weight: 400;

}



/* =========================================================
   CAROUSEL
========================================================= */

.placement-carousel {

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 100%;

}



/* =========================================================
   VIEWPORT
========================================================= */

.placement-viewport {

    width: calc(100% - 150px);

    max-width: 1450px;

    overflow: hidden;

}



/* =========================================================
   TRACK
========================================================= */

.placement-track {

    display: flex;

    gap: 27px;

    transition:
        transform .55s cubic-bezier(.4,0,.2,1);

    will-change: transform;

}



/* =========================================================
   CARD
========================================================= */

.placement-card {

    position: relative;

    flex: 0 0 calc(
        (100% - 108px) / 5
    );

    height: 180px;

    overflow: hidden;

    border-radius: 21px;

    background: #ffffff;

    border:
        1px solid #e2e7f0;

    box-shadow:

        0 9px 27px
        rgba(28, 42, 78, .055);

    transition:

        transform .35s ease,

        box-shadow .35s ease,

        border-color .35s ease;

}



/* =========================================================
   CARD HOVER
========================================================= */

.placement-card:hover {

    transform:
        translateY(-7px);

    border-color:
        rgba(16, 21, 143, .16);

    box-shadow:

        0 17px 38px
        rgba(28, 42, 78, .11);

}



/* =========================================================
   CARD LINK
========================================================= */

.placement-card-link {

    position: relative;

    width: 100%;

    height: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

    text-decoration: none;

}



/* =========================================================
   LOGO
========================================================= */

.placement-logo {

    width: 100%;

    height: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 25px;

}



/* =========================================================
   IMAGE
========================================================= */

.placement-logo img {

    display: block;

    max-width: 82%;

    max-height: 105px;

    width: auto;

    height: auto;

    object-fit: contain;

    transition:

        transform .4s ease,

        filter .4s ease;

}



/* =========================================================
   IMAGE HOVER
========================================================= */

.placement-card:hover
.placement-logo img {

    transform:
        scale(1.06);

}



/* =========================================================
   ARROWS
========================================================= */

.placement-arrow {

    position: absolute;

    z-index: 10;

    top: 50%;

    transform:
        translateY(-50%);

    width: 58px;

    height: 58px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: none;

    border-radius: 50%;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #17129d,
            #2116b7
        );

    box-shadow:

        0 12px 27px
        rgba(24, 18, 160, .22);

    cursor: pointer;

    transition:

        transform .3s ease,

        box-shadow .3s ease,

        background .3s ease;

}



.placement-arrow i {

    font-size: 23px;

    line-height: 1;

}



/* Left */

.placement-prev {

    left: 0;

}



/* Right */

.placement-next {

    right: 0;

}



/* =========================================================
   ARROW HOVER
========================================================= */

.placement-arrow:hover {

    transform:
        translateY(-50%)
        scale(1.08);

    background:
        linear-gradient(
            135deg,
            #0e087e,
            #17129d
        );

    box-shadow:

        0 16px 34px
        rgba(24, 18, 160, .32);

}



.placement-arrow:active {

    transform:
        translateY(-50%)
        scale(.96);

}



/* =========================================================
   DOTS
========================================================= */

.placement-dots {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    margin-top: 37px;

}



.placement-dot {

    width: 9px;

    height: 9px;

    padding: 0;

    border: none;

    border-radius: 50%;

    background: #cbd3e3;

    cursor: pointer;

    transition:

        width .35s ease,

        background .35s ease,

        border-radius .35s ease;

}



/* Active dot */

.placement-dot.active {

    width: 30px;

    border-radius: 20px;

    background:
        #17129d;

}



/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1200px) {

    .placement-card {

        flex-basis:
            calc(
                (100% - 81px) / 4
            );

    }

}



/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .placement-section {

        padding:
            50px 0 55px;

    }


    .placement-header {

        margin-bottom:
            45px;

    }


    .placement-title {

        font-size:
            29px;

    }


    .placement-subtitle {

        font-size:
            14px;

    }


    .placement-viewport {

        width:
            calc(100% - 120px);

    }


    .placement-card {

        flex-basis:
            calc(
                (100% - 54px) / 3
            );

        height:
            165px;

    }


    .placement-arrow {

        width:
            52px;

        height:
            52px;

    }


    .placement-arrow i {

        font-size:
            20px;

    }

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .placement-section {

        padding:
            45px 0 50px;

    }


    .placement-header {

        margin-bottom:
            38px;

    }


    .placement-title {

        font-size:
            25px;

    }


    .placement-title i {

        font-size:
            23px;

    }


    .placement-subtitle {

        margin-top:
            8px;

        font-size:
            13px;

    }


    .placement-carousel {

        padding:
            0 38px;

    }


    .placement-viewport {

        width:
            100%;

    }


    .placement-track {

        gap:
            16px;

    }


    .placement-card {

        flex-basis:
            calc(
                (100% - 16px) / 2
            );

        height:
            140px;

        border-radius:
            17px;

    }


    .placement-logo {

        padding:
            17px;

    }


    .placement-logo img {

        max-height:
            80px;

        max-width:
            88%;

    }


    .placement-arrow {

        width:
            42px;

        height:
            42px;

    }


    .placement-arrow i {

        font-size:
            17px;

    }


    .placement-prev {

        left:
            0;

    }


    .placement-next {

        right:
            0;

    }


    .placement-dots {

        margin-top:
            25px;

        gap:
            7px;

    }

}



/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .placement-title {

        font-size:
            23px;

    }


    .placement-title i {

        font-size:
            21px;

    }


    .placement-subtitle {

        font-size:
            12px;

    }


    .placement-carousel {

        padding:
            0 31px;

    }


    .placement-card {

        flex-basis:
            100%;

        height:
            145px;

    }


    .placement-track {

        gap:
            0;

    }


    .placement-arrow {

        width:
            38px;

        height:
            38px;

    }


    .placement-arrow i {

        font-size:
            15px;

    }

}



/* =========================================================
   ACCESSIBILITY
========================================================= */

.placement-card-link:focus-visible {

    outline:
        3px solid
        rgba(255, 66, 59, .4);

    outline-offset:
        -5px;

}



.placement-arrow:focus-visible {

    outline:
        3px solid
        rgba(255, 66, 59, .45);

    outline-offset:
        3px;

}



/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .placement-track {

        transition:
            none;

    }

    .placement-card,
    .placement-logo img,
    .placement-arrow {

        transition:
            none;

    }

}