/* Custom CSS for Arhyuday University */
:root {
    --primary-color: #1a237e;
    --secondary-color: #ffb300;
    --text-color: #333333;
    --text-light: #666666;
    --bg-light: #f8f9fa;
    --white: #ffffff;
    --transition: all 0.3s ease;
    --font-heading: 'Montserrat', sans-serif;
    --font-body: 'Montserrat', sans-serif;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    font-family: var(--font-body);
    color: var(--text-color);
    line-height: 140%;
    overflow-x: hidden !important;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow-wrap: break-word;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 1rem;
    color: var(--primary-color);
}

a {
    text-decoration: none;
    color: var(--primary-color);
    transition: var(--transition);
}

a:hover {
    color: var(--secondary-color);
}

ul {
    list-style: none;
}

img {
    max-width: 100%;
    height: auto;
}

.container {
    width: 100%;
    max-width: 100%;
    padding: 0 40px;
}

.section-padding {
    padding: 80px 0;
}

.bg-light { background-color: var(--bg-light); }
.text-center { text-align: center; }
.text-primary { color: var(--primary-color); }
.text-muted { color: var(--text-light); }
.mb-0 { margin-bottom: 0 !important; }
.mb-2 { margin-bottom: 0.5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mt-5 { margin-top: 3rem !important; }
.w-100 { width: 100% !important; }
.d-flex { display: flex; }
.justify-content-between { justify-content: space-between; }
.align-items-center { align-items: center; }
.align-items-end { align-items: flex-end; }
.rounded { border-radius: 8px; }
.rounded-circle { border-radius: 50%; }
.mr-3 { margin-right: 1rem; }
.border-top { border-top: 1px solid #eaeaea; }

/* Buttons */
.btn {
    display: inline-block;
    padding: 12px 24px;
    border-radius: 4px;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    transition: var(--transition);
    font-family: var(--font-body);
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: none;
}
.btn i { margin-left: 8px; font-size: 12px; }

.btn-primary {
    background-color: var(--primary-color);
    color: var(--white);
}
.btn-primary:hover {
    background-color: #121858;
    color: var(--white);
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(26, 35, 126, 0.3);
}

.btn-outline {
    background-color: transparent;
    color: var(--white);
    border: 1px solid var(--white);
}
.btn-outline:hover {
    background-color: var(--white);
    color: var(--primary-color);
}

.btn-outline-white {
    background-color: transparent;
    color: var(--white);
    border: 1px solid var(--white);
}
.btn-outline-white:hover {
    background-color: var(--white);
    color: var(--primary-color);
}
.btn-block { display: block; width: 100%; }

.sub-heading {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 10px;
}

.view-all-link {
    font-size: 14px;
    font-weight: 600;
    color: var(--primary-color);
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
}
.view-all-link i { margin-left: 5px; transition: transform 0.3s; }
.view-all-link:hover i { transform: translateX(5px); }

/* Header */
.main-header {
    background-color: transparent;
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 1000;
    transition: all 0.3s ease;
}
.main-header.scrolled {
    background-color: var(--white);
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}
.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 40px;
    transition: all 0.3s ease;
    position: relative;
}
.main-header.scrolled .header-container { padding: 5px 40px; }
.logo { flex-shrink: 0; }
.logo img { height: 95px; width: auto; object-fit: contain; transition: all 0.3s ease; }
.main-header.scrolled .logo img { height: 75px; }
.main-nav ul { display: flex; gap: 20px; }
.main-nav li { position: relative; }
.main-nav li.position-static { position: static; }
.main-nav .dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    background: var(--white);
    min-width: 240px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 10px 0;
    border-radius: 4px;
    z-index: 100;
}
.main-nav li:hover .dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.main-nav .dropdown li { width: 100%; }
.main-nav .dropdown a {
    color: var(--text-color) !important;
    padding: 12px 20px;
    font-size: 14px;
    text-transform: none;
    font-weight: 500;
    display: block;
    width: 100%;
}
.main-nav .dropdown a:hover {
    background: rgba(0,0,0,0.03);
    color: var(--secondary-color) !important;
    padding-left: 25px;
}
.main-nav a {
    color: var(--white);
    font-weight: 500;
    font-size: 14px;
    padding: 10px 5px;
    transition: all 0.3s ease;
}
.main-header.scrolled .main-nav a { color: var(--text-color); }
.main-nav a i {
    font-size: 10px;
    margin-left: 4px;
    opacity: 0.8;
}
.main-nav a:hover, .main-header.scrolled .main-nav a:hover, .main-nav a.active { color: var(--secondary-color); }

/* Admissions Open Badge */
.nav-admission {
    position: relative;
    /* Removed inline-flex to fix vertical alignment issue with other menu items */
}
.badge-open {
    position: absolute;
    top: -5px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 9px;
    font-weight: 800;
    background: linear-gradient(135deg, #dcb55c, #dcb55c); /* Bright vibrant red/pink to stand out */
    color: #1a237e;
    padding: 3px 7px;
    border-radius: 5px;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 5px rgba(255, 71, 87, 0.4);
    animation: pulseBadge 2s infinite;
}

@keyframes pulseBadge {
    0% { box-shadow: 0 0 0 0 rgba(255, 71, 87, 0.7); }
    70% { box-shadow: 0 0 0 6px rgba(255, 71, 87, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 71, 87, 0); }
}

/* Modern Light Grid Dropdown */
.main-nav .has-dropdown {
    position: relative;
}

/* Dark Glass SaaS Dropdown - Single Column */
.dark-glass-dropdown {
    position: absolute;
    top: calc(100% + 40px);
    left: 0;
    min-width: 330px;
    background: #111221;
    border-radius: 12px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 20px 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px);
    transition: all 0.3s ease;
    z-index: 1000;
}

.dark-glass-dropdown.grid-2-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 24px;
    min-width: 720px;
    padding: 22px;
    left: auto;
    right: -152px;
}

.dark-glass-dropdown.grid-3-col {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 15px 30px;
    min-width: 1050px;
    padding: 25px;
    left: 50%;
    transform: translate(-50%, 15px);
    top: calc(100% + 10px);
}
.main-header.scrolled .dark-glass-dropdown.grid-3-col {
    top: calc(100% + 20px);
}

.dark-glass-dropdown::before {
    content: '';
    position: absolute;
    top: -35px;
    left: 0;
    width: 100%;
    height: 35px;
}

.main-nav .has-dropdown:hover .dark-glass-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    top: calc(100% + 30px);
}

/* Maintain centering and tight spacing on hover for the mega menu */
.main-nav .has-dropdown:hover .dark-glass-dropdown.grid-3-col {
    transform: translate(-50%, 0);
    top: calc(100% - 20px);
}
/* Adjust spacing when header is scrolled */
.main-header.scrolled .main-nav .has-dropdown:hover .dark-glass-dropdown.grid-3-col {
    top: calc(100% + -5px);
}

.md-item-simple {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 16px 20px;
    border-radius: 10px;
    text-decoration: none !important;
    transition: all 0.3s ease;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.03);
}
.md-item-simple:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.1);
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}
.md-item-simple.active {
    background: rgba(255, 255, 255, 0.08);
    box-shadow: inset 4px 0 0 var(--secondary-color), 0 5px 15px rgba(0, 0, 0, 0.1);
    border-color: rgba(255, 255, 255, 0.08);
}
.md-icon-simple {
    color: #ffffff; /* White normally */
    font-size: 22px !important;
    width: 45px;
    transition: all 0.2s;
}
img.md-icon-img {
    height: 30px;
    object-fit: contain;
    filter: brightness(0) invert(1); /* White normally */
    transition: all 0.2s;
}
.md-item-simple:hover .md-icon-simple {
    color: var(--secondary-color); /* Gold on hover */
}
.md-item-simple:hover img.md-icon-img {
    /* Precise filter for #dcb55c / Gold */
    filter: brightness(0) saturate(100%) invert(85%) sepia(18%) saturate(1518%) hue-rotate(356deg) brightness(90%) contrast(90%);
}
.md-item-simple.active .md-icon-simple {
    color: var(--secondary-color);
}
.md-title-simple {
    color: #e0e0e0;
    font-family: var(--font-body);
    font-size: 15px;
    font-weight: 600;
    flex-grow: 1;
    transition: color 0.2s;
}
.md-item-simple:hover .md-title-simple {
    color: var(--secondary-color);
}
.md-item-simple.active .md-title-simple {
    color: #ffffff;
}
.md-chevron-simple {
    color: #666;
    font-size: 12px;
    margin-left: 10px;
    transition: transform 0.2s, color 0.2s;
}
.md-item-simple:hover .md-chevron-simple, .md-item-simple.active .md-chevron-simple {
    transform: translateX(4px);
    color: #fff;
}

.header-actions { display: flex; align-items: center; gap: 20px; }
.search-icon { color: var(--white); font-size: 18px; transition: all 0.3s ease; }
.main-header.scrolled .search-icon { color: var(--text-color); }
.mobile-menu-toggle {
    display: none;
    background: none;
    border: none;
    font-size: 24px;
    color: var(--primary-color);
    cursor: pointer;
}

/* Hero Section */
.hero-section {
    position: relative;
    padding: 140px 0 20px 0;
    min-height: 100vh; /* Full height */
    display: flex;
    align-items: center;
    background: url('../images/AU-biluding2.jpg') center/cover no-repeat;
}

/* Fix exact full height on desktop/laptop */
@media (min-width: 992px) {
    .hero-section {
        height: 100vh;
        overflow: hidden; /* Prevents overflow if content gets too tall on small laptops */
    }
}
.hero-background {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to right, rgba(26,35,126,0.9) 0%, rgba(26,35,126,0.7) 50%, rgba(26,35,126,0.3) 100%);
    z-index: 1;
}
.hero-container {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.hero-content { max-width: 600px; color: var(--white); }
.badge {
    display: inline-block;
    background-color: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.3);
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 20px;
    letter-spacing: 1px;
}
.hero-title { font-size: 3.5rem; color: var(--white); margin-bottom: 20px; }
.hero-title span { color: var(--secondary-color); }
.hero-subtitle { font-size: 1.1rem; margin-bottom: 40px; opacity: 0.9; }
.hero-buttons { display: flex; gap: 15px; }
.hero-social-icons {
    display: flex;
    gap: 15px;
    margin-top: 40px;
}
.hero-social-icons a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: var(--white);
    color: var(--primary-color);
    font-size: 1.2rem;
    transition: var(--transition);
    text-decoration: none;
}
.hero-social-icons a:hover {
    background-color: var(--secondary-color);
    color: var(--white);
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

/* Vertical Testimonial Slider */
.hero-testimonial-slider {
    position: relative;
    width: 450px;
    height: 650px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
    perspective: 1000px;
}

.testi-card {
    position: absolute;
    width: 400px;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 15px;
    padding: 30px 25px 30px 20px;
    display: flex;
    align-items: center;
    gap: 18px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 0;
    pointer-events: none;
    transform: translateY(120px) scale(0.7);
    z-index: 1;
}

.testi-img {
    width: 65px;
    height: 65px;
    border-radius: 10px;
    object-fit: cover;
    border: 2px solid #fff;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.testi-info {
    flex-grow: 1;
    text-align: left;
}

.testi-info h4 {
    margin: 0;
    font-size: 17px;
    color: #333;
    font-weight: 700;
    margin-bottom: 5px;
}

.testi-info p {
    margin: 0;
    font-size: 14px;
    color: #555;
    line-height: 1.4;
}

.testi-follow {
    background: linear-gradient(135deg, #a48df7, #729cf0);
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 25px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.3s, box-shadow 0.3s;
}

.testi-follow:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(114, 156, 240, 0.4);
}

.testi-card.active {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
    background: #ffffff;
    z-index: 3;
    box-shadow: 0 15px 40px rgba(0,0,0,0.15);
}

.testi-card.prev {
    opacity: 0.5;
    transform: translateY(-150px) scale(0.85);
    z-index: 2;
    background: rgba(255,255,255,0.6);
}

.testi-card.next {
    opacity: 0.5;
    transform: translateY(150px) scale(0.85);
    z-index: 2;
    background: rgba(255,255,255,0.6);
}

@media (max-width: 991px) {
    .hero-testimonial-slider {
        display: none; /* Hide on mobile/tablet to save space */
    }
}
.hero-social-icons a {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.4);
    background: rgba(0, 0, 0, 0.2);
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--white);
    font-size: 18px;
    text-decoration: none;
    transition: var(--transition);
}
.hero-social-icons a:hover {
    background: var(--white);
    color: var(--primary-color);
    border-color: var(--white);
    transform: translateY(-3px);
}
.enquiry-form-card {
    background-color: var(--white);
    padding: 30px;
    border-radius: 8px;
    width: 380px;
    box-shadow: 0 15px 30px rgba(0,0,0,0.15);
}
.enquiry-form-card h3 { margin-bottom: 10px; font-size: 1.5rem; }
.enquiry-form-card p { font-size: 14px; color: var(--text-light); margin-bottom: 20px; }
.form-group { margin-bottom: 15px; }
.form-group input, .form-group select {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-family: var(--font-body);
    font-size: 14px;
    outline: none;
    transition: border-color 0.3s;
}
.form-group input:focus, .form-group select:focus { border-color: var(--primary-color); }

/* Recognized Excellence Section */
.font-serif {
    font-family: 'Playfair Display', serif;
}
.recognized-excellence-section {
    background-color: #f6f7fa;
    padding: 50px 0;
    position: relative;
    overflow: hidden;
    z-index: 3;
}
.re-bg-watermark {
    display: none;
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: url('../images/AU-biluding2.jpg') center/cover no-repeat;
    opacity: 0.05;
    z-index: 0;
    pointer-events: none;
}
.re-container {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.re-title {
    color: #1a2456;
    font-size: 38px;
    font-weight: 700;
    margin-bottom: 50px;
    letter-spacing: 1px;
    text-align: center;
}
/* .re-medals-pill {
    background: #ffffff;
    border-radius: 150px;
    padding: 25px 100px;
    display: flex;
    justify-content: center;
    gap: 100px;
    width: 100%;
    max-width: 900px;
    box-shadow: 0 10px 40px rgba(223, 199, 133, 0.4);
    border: 1px solid rgba(223, 199, 133, 0.5);
    margin-bottom: 70px;
    position: relative;
} */

.re-medals-pill {
    background: #ffffff;
    border-radius: 350px;
    padding: 21px;
    display: flex;
    justify-content: center;
    gap: 100px;
    width: 100%;
    max-width: 820px;
    box-shadow: 0 10px 40px rgba(223, 199, 133, 0.4);
    border: 1px solid rgba(223, 199, 133, 0.5);
    margin-bottom: 80px;
    position: relative;
}
.re-medal-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    position: relative;
}
.re-medal-img {
    width: 136px;
    height: 136px;
    border-radius: 50%;
    background: #fff;
    border: 4px solid #dfc785;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.re-medal-img img {
    width: 80%;
    height: 80%;
    object-fit: contain;
}
.re-medal-item span {
    font-weight: 700;
    color: #1a2456;
    font-family: var(--font-heading);
    font-size: 18px;
}
.has-tooltip .re-tooltip {
    position: absolute;
    top: -50px;
    background: #1a2456;
    color: #fff;
    font-size: 12px;
    padding: 6px 14px;
    border-radius: 4px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    white-space: nowrap;
}
.has-tooltip .re-tooltip::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 50%;
    transform: translateX(-50%);
    border-width: 5px 5px 0;
    border-style: solid;
    border-color: #1a2456 transparent transparent transparent;
}
.re-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    width: 100%;
    max-width: 1200px;
}

/* Screenshot-exact card design */
.re-card {
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    min-height: 160px;
    box-shadow: 0 2px 18px rgba(0,0,0,0.07), 0 1px 3px rgba(0,0,0,0.04);
    border: 1px solid #e8eaf2;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.re-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 32px rgba(0,0,0,0.11);
}

/* Left icon panel — white background with right divider */
.re-card-icon {
    flex-shrink: 0;
    width: 135px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    border-right: 1px solid #e0e3ee;
    padding: 18px;
}
.re-card-icon img {
    width: 120px;
    height: 120px;
    object-fit: contain;
    display: block;
}
.re-card-icon i {
    font-size: 48px;
    color: var(--primary-color);
    filter: drop-shadow(0 2px 6px rgba(0,0,0,0.2));
}

/* Right text panel */
.re-card-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 20px 24px;
    text-align: left;
    gap: 0;
}
.re-card-content h4 {
    color: #1a2456;
    font-size: 15px;
    font-weight: 800;
    margin-bottom: 6px;
    letter-spacing: 0.2px;
    line-height: 1.3;
}
.re-card-content p {
    color: #5a6a85;
    font-size: 12.5px;
    margin-bottom: 14px;
    line-height: 1.5;
    font-weight: 500;
}

/* Outline button — matches hero 'Know More' style */
.re-btn {
    background: transparent;
    color: var(--primary-color);
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 12.5px;
    padding: 9px 20px;
    border-radius: 4px;
    border: 1px solid var(--primary-color);
    text-decoration: none;
    transition: all 0.25s ease;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    letter-spacing: 0.3px;
    width: fit-content;
    text-transform: uppercase;
}
.re-btn:hover {
    background: var(--primary-color);
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(26,35,126,0.25);
    transform: translateY(-2px);
}

/* Schools Grid Layout */
.schools-grid { 
    display: grid; 
    grid-template-columns: repeat(4, 1fr); 
    gap: 24px; 
    margin-top: 40px; 
}

@media (max-width: 1024px) {
    .schools-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .schools-grid {
        grid-template-columns: 1fr;
    }
}
.school-card {
    position: relative;
    border-radius: 12px;
    padding: 22px 20px;
    height: 145px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    color: var(--white);
    transition: transform 0.3s, box-shadow 0.3s;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    cursor: pointer;
    text-align: left;
    border: 1px solid rgba(0,0,0,0.03);
}
.school-card.dark {
    background: linear-gradient(135deg, #101c38 0%, #1e3158 100%);
}
.school-card.purple-medium {
    background: linear-gradient(135deg, #a47edb 0%, #7d4bbb 100%);
    color: var(--white);
}
.school-card.purple-light {
    background: linear-gradient(135deg, #fbf7ff 0%, #e8d4ff 100%);
    color: #1a2456;
}
.school-card.purple-light h4 {
    color: #1a2456;
}
.school-card h4 {
    font-size: 19px;
    font-weight: 700;
    margin: 0;
    position: relative;
    z-index: 2;
    color: var(--white);
    line-height: 1.3;
    letter-spacing: -0.2px;
}
.school-card .course-count {
    font-size: 14px;
    font-weight: 600;
    margin: 0;
    position: relative;
    z-index: 2;
    opacity: 0.85;
    color: #656262;
}
.card-icon-bg {
    position: absolute;
    bottom: -25px;
    right: -25px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.02) 100%);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: inset 0 4px 6px rgba(255,255,255,0.1);
    backdrop-filter: blur(5px);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
}
.school-card.purple-light .card-icon-bg {
    background: linear-gradient(135deg, rgba(139, 77, 220, 0.08) 0%, rgba(139, 77, 220, 0.02) 100%);
    border: 1px solid rgba(139, 77, 220, 0.15);
    box-shadow: inset 0 4px 6px rgba(139, 77, 220, 0.05);
}
.card-icon-bg i {
    font-size: 55px;
    color: #ffffff;
    transform: translate(-10px, -10px);
    text-shadow: 2px 4px 6px rgba(0,0,0,0.15);
    background: linear-gradient(135deg, #ffffff 0%, #e0e0e0 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.school-card.purple-light .card-icon-bg i {
    color: #6c2ba8;
    text-shadow: 2px 4px 6px rgba(108, 43, 168, 0.1);
    background: linear-gradient(135deg, #8b4ddc 0%, #511b96 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.school-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
}
.school-card p { font-size: 13px; color: var(--text-light); }

/* Empower Section */
.empower-container { display: flex; gap: 50px; align-items: center; }
.empower-content { flex: 1; }
.empower-features { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.feature-item { display: flex; gap: 15px; }
.icon-box {
    width: 50px; height: 50px;
    background-color: rgba(26, 35, 126, 0.1);
    color: var(--primary-color);
    border-radius: 50%;
    display: flex; justify-content: center; align-items: center;
    font-size: 20px; flex-shrink: 0;
}
.feature-item h4 { font-size: 16px; margin-bottom: 5px; font-family: var(--font-body); }
.feature-item p { font-size: 13px; color: var(--text-light); }

/* ============ EXPLORE OUR PROGRAMS SECTION ============ */
.programs-section {
    background: #081226;
    padding: 80px 0;
    position: relative;
    overflow: hidden;
}
.programs-header {
    margin-bottom: 90px;
}
.programs-header h2 {
    font-family: var(--font-heading);
    font-size: 38px;
    letter-spacing: 2px;
    margin: 0;
}
.programs-header .text-white {
    color: #ffffff;
    font-weight: 300;
}
.programs-header .gold-line {
    color: #d4af37;
    margin: 0 15px;
    font-weight: 300;
}
.programs-header .gold-text {
    color: #d4af37;
    font-weight: 600;
}

.programs-grid-3d {
    position: relative;
    width: 100%;
    height: 420px;
    margin: 40px auto;
    perspective: 1400px;
    transform-style: preserve-3d;
}

/* Hide radio inputs if any remain */
.programs-grid-3d input[type=radio] {
    display: none;
}

.program-card {
    position: absolute;
    width: 380px;
    height: 100%;
    left: calc(50% - 190px);
    top: 0;
    background: linear-gradient(180deg, rgba(20, 32, 65, 0.4) 0%, rgba(20, 32, 65, 0.95) 100%);
    border-radius: 16px;
    border: 1px solid rgba(212, 175, 55, 0.4);
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    transition: transform 500ms ease, opacity 500ms ease, box-shadow 500ms ease, filter 500ms ease;
    cursor: pointer;
    /* Default Hidden State (cards not in the active 5) */
    opacity: 0;
    z-index: 1;
    transform: translate3d(0%, 0, -500px) scale(0.6);
    pointer-events: none;
}

/* Base styles for active (center) */
.program-card.active {
    transform: translate3d(0%, 0, 0px) scale(1.1);
    opacity: 1;
    z-index: 5;
    filter: brightness(1);
    border: 1px solid rgba(212, 175, 55, 1);
    box-shadow: 0 0 50px rgba(212, 175, 55, 0.25), inset 0 0 20px rgba(212, 175, 55, 0.15);
    background: linear-gradient(180deg, rgba(20, 32, 65, 0.8) 0%, rgba(60, 45, 150, 0.6) 100%);
    pointer-events: auto;
}

/* Next Slide */
.program-card.next-1 {
    transform: translate3d(85%, 0, -100px) scale(0.95);
    opacity: 0.9;
    z-index: 4;
    filter: brightness(0.8);
    pointer-events: auto;
}

/* Next to Next Slide */
.program-card.next-2 {
    transform: translate3d(165%, 0, -150px) scale(0.85);
    opacity: 0.6;
    z-index: 3;
    filter: brightness(0.5);
    pointer-events: auto;
}

/* Previous Slide */
.program-card.prev-1 {
    transform: translate3d(-85%, 0, -100px) scale(0.95);
    opacity: 0.9;
    z-index: 4;
    filter: brightness(0.8);
    pointer-events: auto;
}

/* Previous to Previous Slide */
.program-card.prev-2 {
    transform: translate3d(-165%, 0, -150px) scale(0.85);
    opacity: 0.6;
    z-index: 3;
    filter: brightness(0.5);
    pointer-events: auto;
}

/* Make slider responsive */
/* Tablet View (Max 1024px) */
@media (max-width: 1024px) {
    .programs-grid-3d {
        height: 400px;
    }
    .program-card {
        width: 320px;
        left: calc(50% - 160px);
    }
    .program-card.next-1 { transform: translate3d(70%, 0, -100px) scale(0.95); }
    .program-card.next-2 { transform: translate3d(120%, 0, -150px) scale(0.85); opacity: 0.4; }
    .program-card.prev-1 { transform: translate3d(-70%, 0, -100px) scale(0.95); }
    .program-card.prev-2 { transform: translate3d(-120%, 0, -150px) scale(0.85); opacity: 0.4; }
}

/* Mobile View (Max 768px) */
@media (max-width: 768px) {
    .programs-grid-3d {
        width: 100%;
        height: 380px;
    }
    .program-card {
        width: 260px;
        left: calc(50% - 130px);
    }
    .program-card.next-1 { transform: translate3d(55%, 0, -120px) scale(0.9); opacity: 0.8; }
    /* Hide the second neighbor on small screens to prevent overflow and clutter */
    .program-card.next-2 { transform: translate3d(90%, 0, -200px) scale(0.7); opacity: 0; pointer-events: none; }
    
    .program-card.prev-1 { transform: translate3d(-55%, 0, -120px) scale(0.9); opacity: 0.8; }
    .program-card.prev-2 { transform: translate3d(-90%, 0, -200px) scale(0.7); opacity: 0; pointer-events: none; }
}

/* Small Mobile View (Max 480px) */
@media (max-width: 480px) {
    .program-card {
        width: 240px;
        left: calc(50% - 120px);
    }
    .program-card.next-1 { transform: translate3d(45%, 0, -120px) scale(0.85); }
    .program-card.prev-1 { transform: translate3d(-45%, 0, -120px) scale(0.85); }
}

.program-img-wrapper {
    position: relative;
    height: 220px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 100px; /* Swooping curve */
    overflow: visible;
    margin-bottom: 40px;
}
.program-img-wrapper::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border-bottom-right-radius: 100px;
    box-shadow: inset -2px -2px 0px #d4af37;
    pointer-events: none;
    border-top-right-radius:15px;
}
.program-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 100px;
}

.duration-badge {
    position: absolute;
    bottom: -35px;
    right: 40px;
    width: 70px;
    height: 70px;
    background: radial-gradient(circle, #fde493 0%, #c49a31 100%);
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #2a1a00;
    box-shadow: 0 6px 15px rgba(0,0,0,0.4);
    border: 2px solid rgba(255,255,255,0.2);
    z-index: 3;
}
.program-card.highlighted .duration-badge {
    width: 80px;
    height: 80px;
    bottom: -40px;
}
.duration-badge .num {
    font-size: 24px;
    font-weight: 800;
    line-height: 1;
}
.program-card.highlighted .duration-badge .num { font-size: 28px; }
.duration-badge .text {
    font-size: 11px;
    font-weight: 700;
}

.program-info {
    padding: 0 30px;
    text-align: left;
}
.program-info h3 {
    color: #d4af37;
    font-size: 32px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    margin-bottom: 5px;
    letter-spacing: 1px;
}
.program-card.highlighted .program-info h3 { font-size: 48px; }
.program-info h3 .sub-title {
    font-size: 18px;
    font-family: var(--font-body);
    font-weight: 500;
}
.program-info p {
    color: #ffffff;
    font-size: 14px;
    opacity: 0.9;
    line-height: 1.4;
    margin: 0;
}

.learn-more-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #e0e0e0;
    text-decoration: none;
    font-size: 13px;
    margin-top: 20px;
    transition: 0.3s;
}
.learn-more-btn:hover { color: #d4af37; }
.learn-more-btn i {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,0.4);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 10px;
    transition: 0.3s;
}
.learn-more-btn:hover i { border-color: #d4af37; }

/* We also need to hide/show the 'Learn More' button */
.program-card .learn-more-btn { display: none; }
.program-card.active .learn-more-btn {
    display: inline-flex;
}

.view-all-pill {
    display: inline-block;
    background: linear-gradient(135deg, #fde493 0%, #c49a31 100%);
    color: #2a1a00;
    padding: 10px 30px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    transition: all 0.3s;
    box-shadow: 0 4px 15px rgba(196, 154, 49, 0.3);
}
.view-all-pill:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(196, 154, 49, 0.5);
    color: #000;
}

/* Placements */
.placements-grid {
    display: flex; gap: 20px; overflow-x: auto;
    padding-bottom: 20px; scrollbar-width: none;
}
.placements-grid::-webkit-scrollbar { display: none; }
.placement-card {
    min-width: 220px;
    background: var(--white);
    border-radius: 8px;
    padding: 30px 20px;
    text-align: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    position: relative;
    margin-top: 40px;
}
.student-img {
    width: 80px; height: 80px;
    border-radius: 50%;
    border: 3px solid var(--white);
    position: absolute;
    top: -40px; left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 5px 10px rgba(0,0,0,0.1);
}
.placement-card h4 { margin-top: 30px; font-size: 18px; margin-bottom: 5px; }
.placement-card .company { font-size: 12px; font-weight: 700; color: var(--text-light); letter-spacing: 1px; margin-bottom: 15px; }
.placement-card .package { font-size: 24px; color: var(--primary-color); margin-bottom: 5px; }
.placement-card .role { font-size: 13px; color: var(--text-light); }

.placement-stats-banner {
    background: var(--primary-color);
    border-radius: 8px;
    padding: 30px;
    display: flex;
    justify-content: space-around;
    color: var(--white);
}
.p-stat { text-align: center; }
.p-stat h3 { color: var(--white); font-size: 2rem; margin-bottom: 5px; font-family: var(--font-body); }
.p-stat p { font-size: 14px; opacity: 0.8; }

/* Campus Life */
.campus-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 15px; }
.campus-card { position: relative; border-radius: 8px; overflow: hidden; height: 250px; }
.campus-card img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; }
.campus-card:hover img { transform: scale(1.1); }
.campus-overlay {
    position: absolute; bottom: 0; left: 0; width: 100%;
    padding: 20px; background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
    color: var(--white);
}
.campus-overlay h4 { color: var(--white); margin-bottom: 0; font-size: 16px; font-family: var(--font-body); }

/* News & Events */
.news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.event-item {
    display: flex; gap: 15px; margin-bottom: 20px;
    background: var(--white); padding: 15px;
    border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.03);
}
.date-box {
    background: rgba(26, 35, 126, 0.1); color: var(--primary-color);
    padding: 10px; border-radius: 6px; text-align: center;
    min-width: 60px; display: flex; flex-direction: column; justify-content: center;
}
.date-box .day { font-size: 20px; font-weight: 700; line-height: 1; }
.date-box .month { font-size: 12px; font-weight: 600; text-transform: uppercase; }
.event-info h5 { font-size: 15px; margin-bottom: 5px; font-family: var(--font-body); }
.event-info p { font-size: 12px; color: var(--text-light); margin-bottom: 0; }
.news-item { display: flex; gap: 15px; margin-bottom: 20px; }
.news-item img { width: 80px; height: 80px; border-radius: 8px; object-fit: cover; }
.news-info h5 { font-size: 15px; margin-bottom: 5px; font-family: var(--font-body); line-height: 1.4; }
.news-info .date { font-size: 12px; color: var(--text-light); }
.story-card h5 { font-size: 18px; margin-bottom: 10px; }
.story-card p { font-size: 14px; color: var(--text-light); margin-bottom: 15px; }
.read-more { font-size: 14px; font-weight: 600; }
.news-events-section{padding: 55px 0;}
.section-header{margin-bottom: 30px;}




/* Faculty */
.faculty-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.faculty-card h5 { font-size: 16px; font-family: var(--font-body); }
.faculty-card p { font-size: 13px; color: var(--text-light); }

/* Testimonials */
.testimonial-card {
    background: var(--white);
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    position: relative;
}
.quote-icon {
    position: absolute; top: -20px; right: 40px;
    width: 50px; height: 50px;
    background: var(--secondary-color); color: var(--white);
    border-radius: 50%; display: flex; justify-content: center; align-items: center;
    font-size: 20px;
}
.testimonial-text { font-size: 16px; font-style: italic; color: var(--text-light); line-height: 1.8; }

/* Partners */
.partners-logos {
    display: flex; justify-content: center; align-items: center;
    gap: 40px; flex-wrap: wrap; opacity: 0.6;
}
.partners-logos img { height: 40px; width: auto; filter: grayscale(100%); transition: var(--transition); }
.partners-logos img:hover { filter: grayscale(0%); opacity: 1; }

/* Footer */
.main-footer {
    background-color: #0b1138;
    color: var(--white);
    padding-top: 80px;
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.main-footer::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background-image: url('../images/footer-bg22.png');
    background-size: cover;
    background-position: center bottom;
    opacity: 0.2; /* Reduced opacity */
    z-index: -1;
    pointer-events: none;
}
.footer-container { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 1.5fr; gap: 30px; margin-bottom: 30px; position: relative; z-index: 2; }
.footer-logo { max-height: 120px; margin-bottom: 20px; background-color: transparent; object-fit: contain; }
.brand-col p { font-size: 13px; opacity: 0.9; margin-bottom: 25px; line-height: 1.5; font-family: var(--font-body); }
.social-links { display: flex; gap: 10px; position: relative; z-index: 2; }
.social-links a {
    width: 32px; height: 32px;
    border: 1px solid rgba(255,255,255,0.2);
    background: transparent;
    border-radius: 50%;
    display: flex; justify-content: center; align-items: center; color: var(--white);
    font-size: 14px; transition: var(--transition);
}
.social-links a:hover { transform: translateY(-3px); background: var(--primary-color); border-color: var(--primary-color); }
.footer-col h4 { color: var(--white); font-size: 14px; margin-bottom: 20px; font-family: var(--font-body); letter-spacing: 0.5px; }
.footer-col ul { position: relative; z-index: 2; }
.footer-col ul li { margin-bottom: 12px; }
.footer-col ul li a { color: rgba(255,255,255,0.8); font-size: 13px; }
.footer-col ul li a:hover { color: var(--white); padding-left: 3px; opacity: 1; }
.contact-col ul li { display: flex; gap: 15px; color: rgba(255,255,255,0.8); font-size: 13px; margin-bottom: 15px; line-height: 1.4; }
.contact-col ul li i { color: var(--white); font-size: 14px; margin-top: 3px; opacity: 0.8; }

/* ========================================= */
/* Abhyuday Elite 3D Success Gallery */
/* ========================================= */
/* ===== 3D FAN GALLERY ===== */
  :root{
    --card-dark:#1c2650;
    --card-darker:#242a3a;
    --gold:#e8cf8a;
    --gold-line:#d9c07f;
    --navy-footer:#0e1836;
  }

/* ===== ELITE 3D SUCCESS GALLERY ===== */
:root{
    --card-dark:#111827;
    --card-darker:#0f172a;
    --gold:#fcd34d;
    --gold-line:#fbbf24;
    --navy-footer:#0e1836;
}

.elite-gallery-section {
    position: relative;
    padding: 60px 0 60px;
    background: url('../images/AU-biluding2.jpg') center/cover no-repeat;
    background-attachment: fixed; /* Parallax feel, optional but nice */
    overflow: hidden;
    color: #fff;
}
.elite-gallery-section::before {
    content: '';
    position: absolute;
    inset: 0;
    /* Light Gray to Soft Violet gradient overlay */
    background: linear-gradient(135deg, rgba(227, 230, 239, 0.599) 0%, rgba(193, 179, 242, 0.88) 100%);
    z-index: 1;
}
.elite-section-header, .stage, .placement-stats-banner {
    position: relative;
    z-index: 10;
}
@keyframes floatUp {
    from { transform: translateY(0); }
    to { transform: translateY(-300px); }
}
 
.elite-section-header {
    position: relative;
    z-index: 3;
    text-align: center;
    margin-bottom: 60px;
}
.elite-view-btn {
    font-size: 14px;
    font-weight: 600;
    color: #1b2272;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all 0.3s ease;
    margin-bottom: 5px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.elite-view-btn i {
    transition: transform 0.3s ease;
}
.elite-view-btn:hover {
    color: #ffb300; /* Matches the global theme secondary hover color */
}
.elite-view-btn:hover i {
    transform: translateX(4px);
}
.elite-title {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    font-size: clamp(32px, 4vw, 52px);
    color: #ffffff;
    text-shadow: 0 0 20px rgba(255, 255, 255, 0.4), 0 0 40px rgba(252, 211, 77, 0.2);
    margin: 0 0 10px;
}
.elite-subtitle {
    margin: 0 auto;
    font-size: clamp(16px, 1.8vw, 20px);
    color: #cbd5e1;
    font-family: 'Montserrat', sans-serif;
    font-weight: 300;
    max-width: 600px;
}
 
/* Interactive 3D Stage */
.stage {
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: 1600px;
    margin: 100px auto;
    height: 250px;
    perspective: 1800px;
    -webkit-perspective: 1800px;
    perspective-origin: 50% 40%;
    -webkit-perspective-origin: 50% 40%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.track {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    /* Rotation controlled by JS for smooth linear infinite rotation */
}
 
/* Match the exact image UI */
.card {
    position: absolute;
    width: 150px;
    height: 170px;
    border-radius: 8px;
    /* Gradient: Blue top to Dark Charcoal bottom */
    background: linear-gradient(to bottom, #2b3a7a 0%, #1e1e24 100%);
    border: 1px solid #d4af37;
    box-shadow: 0 10px 20px rgba(0,0,0,0.5);
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 8px 6px;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    
    /* CSS Vars for dynamic 3D */
    --a: 0deg;
    --z: 600px; /* Radius adjusted to 600px */
    --s: 1;
    --glow: 0;
    
    transform: rotateY(var(--a)) translateZ(var(--z)) scale(var(--s));
    -webkit-transform: rotateY(var(--a)) translateZ(var(--z)) scale(var(--s));
    transition: --s 0.6s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.6s ease, filter 0.6s ease, -webkit-transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
    
    /* Breathing animation */
    animation: breathing 4s ease-in-out infinite alternate;
    cursor: pointer;
    /* Side cards fade slightly */
    filter: brightness(0.7) blur(1px);
}

@property --s {
  syntax: '<number>';
  initial-value: 1;
  inherits: true;
}

@keyframes breathing {
    0% { margin-top: 0px; }
    100% { margin-top: -8px; }
}

/* Hover Effect */
.card:hover {
    --s: 1.15 !important;
    box-shadow: 0 15px 30px rgba(0,0,0,0.7), 0 0 15px rgba(212, 175, 55, 0.4);
    filter: brightness(1.2) blur(0) !important;
}

/* Center Highlighted Card */
.card.center {
    --s: 1.35;
    filter: brightness(1) blur(0);
    box-shadow: 0 15px 25px rgba(0,0,0,0.8), 0 0 30px 5px rgba(212, 175, 55, 0.25);
    z-index: 100;
}
 
.card .photo {
    width: 65px;
    height: 65px;
    border-radius: 8px; /* Square with rounded corners like the image */
    object-fit: cover;
    border: 1.5px solid #d4af37; /* Thin gold border */
    margin-top: 0; /* Default no overlap */
    margin-bottom: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.4);
    transition: transform 0.4s ease, margin-top 0.4s ease;
    position: relative;
    z-index: 2;
    background: #1e1e24;
}
.card:hover .photo {
    transform: scale(1.05);
}
.card.center .photo {
    margin-top: -25px; /* Image pops out on active/center card */
    transform: scale(1.05);
}

.card .name {
    font-family: 'Inter', 'Helvetica Neue', Arial, sans-serif;
    font-size: 13px;
    font-weight: 700;
    margin: 0 0 2px;
    line-height: 1.1;
    text-align: center;
    color: #ffffff;
}

.card .package-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-size: 11px;
    color: #e2c178; /* Muted gold matching the image */
    font-weight: 500;
    margin-bottom: 4px;
    line-height: 1;
    font-family: 'Inter', 'Helvetica Neue', Arial, sans-serif;
}

.card .logo-badge {
    background: #fff;
    border-radius: 3px;
    padding: 2px 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 16px;
    margin-top: auto;
}
.card .logo-badge img {
    height: 10px;
    object-fit: contain;
}

.card .blurb {
    font-family: 'Inter', 'Helvetica Neue', Arial, sans-serif;
    font-size: 8px;
    line-height: 1.05;
    color: #d1d5db;
    text-align: center;
    padding: 0 2px;
    opacity: 0;
    transition: opacity 0.4s ease, margin-bottom 0.4s ease;
    height: 0;
    overflow: hidden;
}
.card.center .blurb, .card:hover .blurb {
    opacity: 1;
    height: auto;
    margin-bottom: 6px;
}
 
@media (max-width:900px) {
    .stage { height: 250px; perspective: 1200px; }
    .card { 
        --z: 400px; /* Reduce radius for small screens */
    }
    .elite-title { font-size: 28px; }
}


.footer-bottom { 
    border-top: 1px solid rgba(255,255,255,0.1); 
    padding: 20px 0; 
    font-size: 12px; 
    color: rgba(255,255,255,0.6); 
    position: relative;
    z-index: 2;
}
.footer-bottom p { margin: 0; }
.footer-bottom a { color: rgba(255,255,255,0.6); }
.footer-bottom a:hover { color: #e6c875; }

/* Responsive */
@media (max-width: 1024px) {
    .empower-container { flex-direction: column; }
    .programs-grid { grid-template-columns: repeat(2, 1fr); }
    .campus-grid { grid-template-columns: repeat(3, 1fr); }
    .news-grid { grid-template-columns: repeat(2, 1fr); }
    .footer-container { grid-template-columns: repeat(3, 1fr); }
    
    /* Recognized Excellence */
    .re-cards-grid { grid-template-columns: repeat(2, 1fr); }
    .re-medals-pill { flex-wrap: wrap; gap: 40px; padding: 30px; justify-content: center; }
}
@media (max-width: 768px) {
    .main-nav { 
        display: none; 
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: var(--white);
        box-shadow: 0 10px 20px rgba(0,0,0,0.1);
        padding: 20px;
    }
    .main-nav.active { display: block; }
    .main-nav ul { flex-direction: column; gap: 0; }
    .main-nav a { 
        color: var(--text-color); 
        font-size: 16px; 
        padding: 15px 10px; 
        display: block;
        border-bottom: 1px solid #eee;
    }
    .main-header.scrolled .main-nav a { color: var(--text-color); }
    .header-actions .btn, .header-actions .search-icon { display: none; }
    .mobile-menu-toggle { display: block; }
    
    .hero-container { flex-direction: column; text-align: center; gap: 40px; }
    .hero-buttons { justify-content: center; }
    .enquiry-form-card { width: 100%; max-width: 400px; margin: 0 auto; }
    .stats-container { gap: 20px; justify-content: center; }
    .stat-item { width: 45%; }
    .school-card { min-width: calc(50% - 10px); }
    .empower-features { grid-template-columns: 1fr; }
    .placement-stats-banner { flex-wrap: wrap; gap: 20px; }
    .p-stat { width: 45%; }
    .campus-grid { grid-template-columns: repeat(2, 1fr); }
    .news-grid { grid-template-columns: 1fr; }
    .faculty-grid { grid-template-columns: repeat(2, 1fr); }
    .footer-container { grid-template-columns: 1fr 1fr; }
    
    /* Recognized Excellence */
    .re-cards-grid { grid-template-columns: 1fr; }
    .re-medals-pill { flex-direction: column; gap: 30px; padding: 40px 20px; border-radius: 40px; align-items: center; }
    .re-title { font-size: 28px; text-align: center; }
    .re-card { flex-direction: column; text-align: center; align-items: center; }
    .re-card-icon { width: 100%; border-right: none; border-bottom: 1px solid #e0e3ee; padding: 20px; }
    .re-card-content { align-items: center; text-align: center; }
    
    .event-tabs { flex-wrap: wrap; justify-content: center; gap: 5px; }
    .e-tab-btn { font-size: 13px; padding: 8px 16px; }

    .col-md-6 { width: 100% !important; padding: 0 !important; float: none !important; margin-bottom: 40px; }
}
@media (max-width: 480px) {
    .hero-title { font-size: 2.2rem; }
    .stat-item { width: 100%; justify-content: center; }
    .programs-grid, .campus-grid, .faculty-grid, .footer-container { grid-template-columns: 1fr; }
    .school-card { min-width: 100%; }
    .re-medals-pill { border-radius: 30px; }
    .p-stat { width: 100%; }
    .header-container { padding: 10px 15px; }
    .hero-section { padding-top: 140px; }
}

/* =================================================
   INFO CARDS SECTION (Skill Dev / Gazette / Community)
   ================================================= */
.info-cards-section {
    background: #f0f4f8;
    padding: 50px 30px 60px;
}
.info-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    max-width: 1300px;
    margin: 0 auto;
}

/* Individual card — split design */
.info-card {
    display: flex;
    align-items: stretch;
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(0,20,80,0.07), 0 1px 4px rgba(0,0,0,0.04);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    min-height: 160px;
}
.info-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 36px rgba(0,20,80,0.12);
}

/* Left icon panel — warm gold gradient */
.info-card-icon {
    flex-shrink: 0;
    width: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #f5e6c0 0%, #e8d08a 40%, #d4b96a 100%);
    padding: 20px;
}
.info-card-icon i {
    font-size: 48px;
    color: #2b3990;
    filter: drop-shadow(2px 4px 6px rgba(0,0,0,0.18));
}

/* Right text panel */
.info-card-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 22px 24px;
    gap: 8px;
}
.info-card-body h3 {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 800;
    color: #1a2456;
    margin: 0;
    letter-spacing: 0.3px;
    line-height: 1.3;
}
.info-card-body p {
    font-family: var(--font-body);
    font-size: 13px;
    color: #5a6a85;
    margin: 0;
    line-height: 1.5;
}

/* Discover More button */
.info-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 4px;
    padding: 8px 20px;
    background: linear-gradient(135deg, #f0dea0 0%, #d4b96a 100%);
    color: #1a2456;
    font-size: 12.5px;
    font-weight: 700;
    font-family: var(--font-body);
    border-radius: 50px;
    text-decoration: none;
    border: 1px solid rgba(200,170,80,0.4);
    width: fit-content;
    transition: all 0.2s ease;
    letter-spacing: 0.2px;
}
.info-btn:hover {
    background: linear-gradient(135deg, #d4b96a 0%, #b89840 100%);
    color: #fff;
    box-shadow: 0 4px 12px rgba(180,150,60,0.35);
}

/* Responsive */
@media (max-width: 900px) {
    .info-cards-grid { grid-template-columns: 1fr; gap: 16px; }
}
@media (max-width: 600px) {
    .info-card-icon { width: 90px; }
    .info-card-icon i { font-size: 36px; }
}

/* =================================================
   GLOBAL NETWORK SECTION — Fresh from scratch
   ================================================= */


/* Section wrapper */
.gn-section {
    padding: 70px 0 90px;
    background: linear-gradient(135deg, #dfe8f5 0%, #e4ecf7 40%, #d8e4f2 100%);
    font-family: var(--font-body);
    overflow: hidden;
}

/* Outer container holding the entire diagram */
.gn-diagram {
    position: relative;
    width: 100%;
    max-width: 1300px;
    height: 760px;
    margin: 40px auto 0;
}

/* ---- SVG line layer (behind everything) ---- */
.gn-lines-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 1;
    overflow: visible;
}
.gn-lines-svg path {
    fill: none;
    stroke: #c9b67a;
    stroke-width: 1.6;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
    transition: stroke 0.3s, stroke-width 0.3s, filter 0.3s;
}
/* Hover — matching line glows gold */
.gn-diagram:has(.gn-card-l1:hover) .gn-line-l1,
.gn-diagram:has(.gn-card-l2:hover) .gn-line-l2,
.gn-diagram:has(.gn-card-l3:hover) .gn-line-l3,
.gn-diagram:has(.gn-card-l4:hover) .gn-line-l4,
.gn-diagram:has(.gn-card-l5:hover) .gn-line-l5,
.gn-diagram:has(.gn-card-r1:hover) .gn-line-r1,
.gn-diagram:has(.gn-card-r2:hover) .gn-line-r2,
.gn-diagram:has(.gn-card-r3:hover) .gn-line-r3,
.gn-diagram:has(.gn-card-r4:hover) .gn-line-r4,
.gn-diagram:has(.gn-card-r5:hover) .gn-line-r5 {
    stroke: #f5ca00;
    stroke-width: 3;
    filter: drop-shadow(0 0 8px rgba(245, 202, 0, 0.85));
}

/* ---- Center logo (blue sphere) — exact reference match ---- */
.gn-center-logo {
    position: absolute;
    top: 42%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: radial-gradient(circle at 38% 32%, #6680d8 0%, #2541a0 45%, #1a2f7a 70%, #0e1b50 100%);
    border: 6px solid #ffffff;
    box-shadow:
        inset -14px -14px 28px rgba(0,0,0,0.5),
        inset 10px 10px 20px rgba(255,255,255,0.1),
        0 0 0 12px rgba(100,140,230,0.18),
        0 0 50px rgba(60,100,220,0.35),
        0 20px 50px rgba(10,25,80,0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px;
}
.gn-center-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    filter: brightness(1.3) drop-shadow(0 2px 6px rgba(0,0,0,0.45));
}

/* ---- Center text block ---- */
.gn-center-caption {
    position: absolute;
    top: 70%;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    white-space: nowrap;
    z-index: 10;
    pointer-events: none;
}
.gn-center-caption .cap-title {
    display: block;
    font-family: var(--font-heading);
    font-size: 30px;
    font-weight: 800;
    color: #1a2456;
    letter-spacing: 0.5px;
    line-height: 1.2;
    margin-bottom: 2px;
    font-style: italic;
}
.gn-center-caption .cap-city {
    display: block;
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 600;
    color: #1a2456;
    letter-spacing: 4px;
    text-transform: uppercase;
    margin-bottom: 5px;
}
.gn-center-caption .cap-sub {
    display: block;
    font-family: var(--font-body);
    font-size: 11.5px;
    font-weight: 700;
    color: #2b3990;
    letter-spacing: 3.5px;
    text-transform: uppercase;
}

/* ---- University cards (absolute nodes) ---- */
.gn-node {
    position: absolute;
    z-index: 5;
    transform: translateY(-50%);
    width: 30%;
}

/* ---- Card (rectangular with soft corners — matches reference) ---- */
.gn-card {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #ffffff;
    border: 1.5px solid rgba(220,228,245,0.9);
    border-radius: 14px;
    padding: 11px 14px 11px 11px;
    box-shadow: 0 4px 18px rgba(0,20,80,0.07), 0 1px 4px rgba(0,0,0,0.04);
    cursor: pointer;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    text-decoration: none;
    color: inherit;
}
.gn-card:hover {
    transform: translateY(-3px) scale(1.015);
    box-shadow: 0 10px 28px rgba(0,20,80,0.11), 0 0 16px rgba(220,190,90,0.35);
    border-color: #d4a843;
}

/* Card logo circle */
.gn-logo {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #f0f3fb;
    border: 1.5px solid #dde4f0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.gn-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 5px;
}

/* Card text */
.gn-info {
    flex-grow: 1;
    min-width: 0;
    text-align: left;
}
.gn-info strong {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: #111827;
    line-height: 1.35;
    margin-bottom: 3px;
    font-family: var(--font-body);
}
.gn-info span {
    display: block;
    font-size: 10.5px;
    color: #6b7280;
    font-weight: 500;
    font-family: var(--font-body);
}

/* Flag */
.gn-flag {
    flex-shrink: 0;
    width: 30px;
    height: 20px;
    border-radius: 3px;
    overflow: hidden;
    border: 1px solid rgba(0,0,0,0.08);
    box-shadow: 0 1px 5px rgba(0,0,0,0.14);
}

/* ============ Responsive ============ */
@media (max-width: 1100px) {
    .gn-diagram {
        height: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 14px;
        padding: 20px 16px;
    }
    .gn-node {
        position: static;
        transform: none;
        width: 90%;
        max-width: 400px;
    }
    .gn-lines-svg { display: none; }
    .gn-center-logo {
        position: static;
        transform: none;
        margin: 24px auto 8px;
    }
    .gn-center-caption {
        position: static;
        transform: none;
        white-space: normal;
        margin-bottom: 20px;
    }
}

.gn-premium-layout {
    position: relative;
    width: 100%;
    max-width: 1300px;
    height: 780px;
    margin: 0 auto;
}

/* ---- SVG Lines ---- */
.gn-svg-lines {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    z-index: 1;
    pointer-events: none;
    overflow: visible;
}
.gn-svg-lines path {
    stroke: #d4bc7a;
    stroke-width: 1.8;
    fill: none;
    vector-effect: non-scaling-stroke;
    stroke-linecap: round;
    transition: stroke 0.3s ease, stroke-width 0.3s ease, filter 0.3s ease;
}

/* Hover glow on matching line */
.gn-premium-layout:has(.gn-node-l1:hover) .gn-path-l1,
.gn-premium-layout:has(.gn-node-l2:hover) .gn-path-l2,
.gn-premium-layout:has(.gn-node-l3:hover) .gn-path-l3,
.gn-premium-layout:has(.gn-node-l4:hover) .gn-path-l4,
.gn-premium-layout:has(.gn-node-l5:hover) .gn-path-l5,
.gn-premium-layout:has(.gn-node-r1:hover) .gn-path-r1,
.gn-premium-layout:has(.gn-node-r2:hover) .gn-path-r2,
.gn-premium-layout:has(.gn-node-r3:hover) .gn-path-r3,
.gn-premium-layout:has(.gn-node-r4:hover) .gn-path-r4,
.gn-premium-layout:has(.gn-node-r5:hover) .gn-path-r5 {
    stroke: #f5d020;
    stroke-width: 3;
    filter: drop-shadow(0 0 6px rgba(245, 208, 32, 0.8));
}

/* ---- Center Logo ---- */
.gn-simple-logo-wrapper {
    position: absolute;
    top: 44%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    width: 200px;
    height: 200px;
    display: flex;
    justify-content: center;
    align-items: center;
    filter: drop-shadow(0 8px 30px rgba(30, 50, 120, 0.35));
}
.gn-simple-logo-wrapper img {
    width: 200px;
    height: 200px;
    object-fit: contain;
}

/* ---- Center Text (below logo) ---- */
.gn-center-text {
    position: absolute;
    top: 71%;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    width: 320px;
    z-index: 10;
    pointer-events: none;
}
.gn-center-text h2 {
    font-family: var(--font-heading);
    color: #1a2456;
    font-size: 26px;
    font-weight: 800;
    margin: 0 0 4px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}
.gn-center-text h3 {
    font-family: var(--font-heading);
    color: #1a2456;
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 8px;
    letter-spacing: 3px;
    text-transform: uppercase;
}
.gn-center-text p {
    font-family: var(--font-body);
    color: #2b3a70;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    margin: 0;
}

/* ---- Nodes (absolute positioned) ---- */
.gn-premium-node {
    position: absolute;
    z-index: 5;
    transform: translateY(-50%);
}

/* ---- Cards ---- */
.gn-premium-card {
    background: rgba(255, 255, 255, 0.96);
    border-radius: 60px;
    padding: 10px 14px 10px 10px;
    display: flex;
    align-items: center;
    gap: 11px;
    box-shadow: 0 6px 22px rgba(0, 0, 30, 0.08);
    border: 1.5px solid rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(8px);
    transition: all 0.3s ease;
    cursor: pointer;
    min-width: 220px;
}
.gn-premium-card:hover {
    transform: translateY(-2px) scale(1.015);
    box-shadow: 0 12px 32px rgba(0,0,0,0.12), 0 0 18px rgba(245, 208, 32, 0.35);
    border-color: #f5d020;
}

/* University logo circle inside card */
.gn-p-logo {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: #f7f8fc;
    box-shadow: 0 2px 8px rgba(0,0,0,0.09);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    padding: 5px;
    border: 1.5px solid #ebebeb;
    overflow: hidden;
}
.gn-p-logo img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

/* Text info */
.gn-p-info {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    min-width: 0;
}
.gn-p-info h4 {
    font-size: 11px;
    font-weight: 700;
    color: #111827;
    margin: 0 0 3px 0;
    line-height: 1.35;
    font-family: var(--font-body);
}
.gn-p-info p {
    font-size: 10px;
    color: #6b7280;
    margin: 0;
    font-weight: 500;
    font-family: var(--font-body);
}

/* Flag */
.gn-p-flag {
    width: 26px;
    height: 18px;
    border-radius: 3px;
    box-shadow: 0 1px 5px rgba(0,0,0,0.18);
    flex-shrink: 0;
    border: 1px solid rgba(0,0,0,0.08);
    overflow: hidden;
}

/* ---- Responsive ---- */
@media (max-width: 1100px) {
    .gn-premium-layout {
        height: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 18px;
        padding: 20px 0;
    }
    .gn-premium-node {
        position: static;
        width: 85% !important;
        transform: none;
    }
    .gn-svg-lines { display: none; }
    .gn-simple-logo-wrapper {
        position: static;
        transform: none;
        margin: 20px auto;
        width: 150px;
        height: 150px;
    }
    .gn-simple-logo-wrapper img { width: 150px; height: 150px; }
    .gn-center-text {
        position: static;
        transform: none;
        margin: 10px auto 20px;
        width: 90%;
    }
}


/* ========================================= */
/* Events Tabs */
/* ========================================= */
.event-tabs {
    display: flex;
    background: #f0f0f0;
    border-radius: 30px;
    padding: 5px;
    margin-bottom: 10px;
}
.e-tab-btn {
    border: none;
    background: transparent;
    padding: 8px 24px;
    border-radius: 25px;
    font-weight: 600;
    font-size: 14px;
    color: #333;
    cursor: pointer;
    transition: all 0.3s ease;
}
.e-tab-btn.active {
    background: var(--primary-color);
    color: #fff;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.e-tab-content {
    display: none;
}
.e-tab-content.active {
    display: block;
    animation: fadeInTab 0.5s ease;
}
@keyframes fadeInTab {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.events-gallery-section{
background-color: #dce7f4;
}

/* ========================================= */
/* Events Pill Accordion Slider (Like Screenshot) */
/* ========================================= */
.options {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    overflow: hidden;
    width: 100%;
    height: 500px;
    margin: 20px 0;
}

.option {
    position: relative;
    overflow: hidden;
    min-width: 60px;
    margin: 10px;
    background-color: #E6E9ED;
    background-image: var(--optionBackground);
    background-size: cover;
    -webkit-background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
    -webkit-transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
    -moz-transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
    -ms-transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
    -o-transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -webkit-transform: translateZ(0); /* Safari fix for overflow:hidden */
    transform: translateZ(0);
}

.option.active {
    flex-grow: 10000;
    -webkit-box-flex: 10000;
    transform: scale(1) translateZ(0);
    -webkit-transform: scale(1) translateZ(0);
    -moz-transform: scale(1) translateZ(0);
    -ms-transform: scale(1) translateZ(0);
    -o-transform: scale(1) translateZ(0);
    max-width: 100%;
    margin: 0px;
    border-radius: 40px;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    background-size: cover;
    -webkit-background-size: cover;
}
.option:not(.active) {
    flex-grow: 1;
    -webkit-box-flex: 1;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
}

/* Blur effect for inactive tabs */
.option::after {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
    background: rgba(255,255,255,0);
    transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
    -webkit-transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
    -moz-transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
    -ms-transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
    -o-transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
    z-index: 1;
    pointer-events: none;
}
.option:not(.active)::after {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    background: rgba(255, 255, 255, 0.15); /* Slight white tint */
}

.option.active .shadow {
    box-shadow: inset 0 -120px 120px -120px black, inset 0 -120px 120px -100px black;
}
.option:not(.active) .shadow {
    bottom: -40px;
    box-shadow: inset 0 -120px 0px -120px black, inset 0 -120px 0px -100px black;
}
.option .shadow {
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 120px;
    transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
    z-index: 2; /* Above blur overlay */
}

.option .label {
    display: flex;
    position: absolute;
    right: 0px;
    height: 40px;
    transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
    z-index: 3; /* Above blur overlay */
}
.option.active .label {
    bottom: 20px;
    left: 20px;
}
.option:not(.active) .label {
    bottom: 10px;
    left: 10px;
}

.option .label .icon {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    min-width: 40px;
    max-width: 40px;
    height: 40px;
    border-radius: 100%;
    background-color: white;
    color: var(--primary-color, #1a237e);
}

.option .label .info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-left: 10px;
    color: white;
    white-space: pre;
}
.option .label .info > div {
    position: relative;
    transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95), opacity 0.5s ease-out;
}
.option.active .label .info > div {
    left: 0px;
    opacity: 1;
}
.option:not(.active) .label .info > div {
    left: 20px;
    opacity: 0;
}
.option .label .info .main {
    font-weight: bold;
    font-size: 1.2rem;
}
.option .label .info .sub {
    transition-delay: 0.1s;
    font-size: 0.85rem;
}

@media screen and (max-width: 768px) {
    .options {
        flex-direction: column;
        height: 600px;
        margin: 10px 0;
    }
    .option {
        min-width: 100%;
        min-height: 65px;
        margin: 5px 0;
        background-size: cover;
    }
    .option.active {
        max-width: 100%;
        max-height: 100%;
    }
    .option .label {
        height: auto;
        min-height: 40px;
        right: auto;
        left: 10px !important;
        bottom: 10px !important;
    }
    .option .label .info {
        white-space: normal;
        padding-right: 10px;
    }
    .option .label .info .main {
        font-size: 1rem;
    }
    .option .label .info .sub {
        font-size: 0.75rem;
        line-height: 1.2;
        margin-top: 2px;
    }
}

/* ===== GLOBAL COLLABORATIONS SECTION ===== */
.global-network-section {
    position: relative;
    padding: 70px 0 140px;
    background: linear-gradient(135deg, rgb(223, 232, 245) 0%, rgb(228, 236, 247) 40%, rgb(216, 228, 242) 100%);
    overflow: hidden;
    font-family: var(--font-body);
}
.gn-background {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 800px;
    height: 800px;
    background: radial-gradient(circle, rgba(106, 124, 255, 0.05) 0%, transparent 50%);
    z-index: 0;
    pointer-events: none;
}
.gn-scale-wrapper {
    width: 100%;
    position: relative;
    overflow: visible;
    /* Height will be dynamically set by Javascript to collapse the gap */
}
.gn-interactive-area {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -625px; /* Half of 1250px */
    width: 1250px;
    z-index: 10;
    transform-origin: top center;
    /* Transform scaling is dynamically updated by JS */
}
.gn-lines {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
}
.gn-path {
    fill: none;
    stroke: rgba(212, 175, 55, 0.5); /* Distinct gold base */
    stroke-width: 1.5px;
    filter: drop-shadow(0 0 3px rgba(212, 175, 55, 0.3));
    transition: stroke 0.4s ease, filter 0.4s ease, stroke-width 0.4s ease;
}
.gn-path.active {
    stroke: #d4af37; /* Bright Golden Glow on hover */
    stroke-width: 2.5px;
    filter: drop-shadow(0 0 12px rgba(212, 175, 55, 1));
}
.gn-grid {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 2;
}
.gn-col {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 350px;
}
.gn-center {
    width: 350px;
    align-items: center;
    justify-content: center;
    display: flex;
    flex-direction: column;
    position: relative;
}

/* Center Hub */
.gn-hub {
    position: relative;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 50px rgba(106, 124, 255, 0.3);
    animation: floatHub 6s ease-in-out infinite alternate;
}
.gn-hub img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    filter: drop-shadow(0 5px 15px rgba(0,0,0,0.3));
}

@keyframes floatHub {
    0% { transform: translateY(-8px); }
    100% { transform: translateY(8px); }
}

/* Cards */
.gn-card {
    width: 350px;
    min-height: 80px;
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border-radius: 22px;
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-bottom: 4px solid #e2e4e8;
    box-shadow: 0 10px 20px rgba(0,0,0,0.05), 0 25px 50px rgba(0, 0, 0, 0.1), inset 0 2px 4px rgba(255, 255, 255, 1);
    display: flex;
    align-items: center;
    padding: 12px 18px;
    gap: 15px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
    position: relative;
    animation: floatCard 8s ease-in-out infinite alternate;
}
/* Stagger animations */
.gn-card:nth-child(odd) { animation-delay: -2s; animation-duration: 9s; }
.gn-card:nth-child(3n) { animation-delay: -4s; animation-duration: 7s; }

/* Card Staggering (Convex Shape) */
.gn-left .gn-card:nth-child(1) { left: 0px; }
.gn-left .gn-card:nth-child(2) { left: -40px; }
.gn-left .gn-card:nth-child(3) { left: -80px; }
.gn-left .gn-card:nth-child(4) { left: -40px; }
.gn-left .gn-card:nth-child(5) { left: 0px; }

.gn-right .gn-card:nth-child(1) { left: 0px; }
.gn-right .gn-card:nth-child(2) { left: 40px; }
.gn-right .gn-card:nth-child(3) { left: 80px; }
.gn-right .gn-card:nth-child(4) { left: 40px; }
.gn-right .gn-card:nth-child(5) { left: 0px; }

@keyframes floatCard {
    0% { transform: translateY(-3px); }
    100% { transform: translateY(3px); }
}

.gn-card:hover {
    border-color: #d4af37;
    border-width: 2px;
    border-bottom: 4px solid #d4af37;
    transform: scale(1.05) translateY(-5px);
    box-shadow: 0 15px 30px rgba(31, 37, 94, 0.15), 0 35px 60px rgba(212, 175, 55, 0.25), inset 0 2px 4px rgba(255, 255, 255, 1);
    z-index: 10;
    animation-play-state: paused;
}

.gn-card-logo {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 10px rgba(0,0,0,0.06), inset 0 1px 2px rgba(255,255,255,1);
    border: 1px solid #eaeaea;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.gn-card-logo span {
    font-size: 11px;
    font-weight: 700;
    color: #1F255E;
}

.gn-card-info {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
}
.gn-card-name {
    font-size: 13px;
    font-weight: 700;
    color: #111827;
    line-height: 1.25;
    margin-bottom: 4px;
}
.gn-card-loc {
    font-size: 11px;
    color: #6b7280;
    font-weight: 500;
}

.gn-card-flag {
    width: 40px;
    height: 30px;
    border-radius: 3px;
    overflow: hidden;
    flex-shrink: 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.15);
}
.gn-card-flag img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Titles */
.gn-titles {
    position: absolute;
    bottom: -140px; /* Increased to give more space between logo and text */
    width: 100%;
    text-align: center;
}
.gn-main-title {
    font-family: 'Playfair Display', serif;
    font-size: 28px;
    font-weight: 700;
    color: #172154;
    line-height: 1.25;
    margin: 0 0 8px;
    letter-spacing: 0.5px;
    text-shadow: 0 4px 10px rgba(0,0,0,0.04);
}
.gn-main-title span {
    font-size: 24px;
}
.gn-sub-title {
    font-size: 14px;
    font-weight: 600;
    color: #172154;
    letter-spacing: 2px;
    text-transform: uppercase;
}

/* Responsive */
@media (max-width: 1300px) {
}
.global-network-section { overflow-x: hidden; }


/* ========================================= */
/* Award-Winning Faculty Showcase Hero */
/* ========================================= */
.faculty-showcase-section {
    position: relative;
    width: 100%;
    height: 100vh;
    min-height: 800px;
    background: linear-gradient(135deg, #0B0B0D 0%, #161214 50%, #241917 100%);
    color: #FFFFFF;
    overflow: hidden;
    display: flex;
    align-items: center;
    font-family: 'Inter', sans-serif;
}

/* Ambient Effects */
.fs-ambient-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(120px);
    z-index: 0;
    pointer-events: none;
}
.fs-ambient-glow.glow-1 {
    top: -10%; left: -10%;
    width: 50vw; height: 50vw;
    background: radial-gradient(circle, rgba(245, 199, 106, 0.08) 0%, transparent 70%);
}
.fs-ambient-glow.glow-2 {
    bottom: -20%; right: -10%;
    width: 60vw; height: 60vw;
    background: radial-gradient(circle, rgba(62, 64, 149, 0.15) 0%, transparent 70%);
}
.fs-grain-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.05'/%3E%3C/svg%3E");
    pointer-events: none;
    z-index: 1;
    mix-blend-mode: overlay;
}

/* Layout Container */
.fs-container {
    display: flex;
    width: 100%;
    height: 100%;
    max-width: 1800px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    padding: 0 5%;
}

/* Top Labels */
.fs-top-labels {
    position: absolute;
    top: 50px;
    left: 5%;
    right: 5%;
    display: flex;
    justify-content: space-between;
    z-index: 10;
    pointer-events: none;
}
.fs-label-left {
    font-size: 13px;
    font-weight: 700;
    color: #FFFFFF;
    letter-spacing: 2px;
}
.fs-label-right {
    font-size: 10px;
    font-weight: 600;
    color: #999999;
    letter-spacing: 2px;
}

/* Left Side (40%) */
.fs-left {
    flex: 0 0 45%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-right: 40px;
}
.fs-info-wrapper {
    max-width: 600px;
}
.fs-title {
    font-family: 'Inter', sans-serif;
    font-size: 130px;
    line-height: 0.9;
    font-weight: 400;
    color: #D6CA96;
    margin-bottom: 30px;
    letter-spacing: -5px;
}
.fs-dynamic-content {
    min-height: 80px;
    position: relative;
}
.fs-desc {
    font-size: 18px;
    line-height: 1.5;
    color: #CCCCCC;
    margin-bottom: 40px;
    font-weight: 400;
    transition: opacity 600ms ease, transform 600ms ease;
}

/* Button */
.fs-actions {
    display: flex;
    margin-top: 40px;
}
.fs-btn-outline {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    padding: 6px 24px 6px 6px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 50px;
    text-decoration: none;
    transition: all 0.3s ease;
}
.fs-btn-outline:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.3);
}
.fs-icon-circle {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    display: flex;
    justify-content: center;
    align-items: center;
    color: #FFF;
    font-size: 12px;
}
.fs-btn-text {
    color: #FFF;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1px;
}

/* Right Side Gallery (60%) */
.fs-right {
    flex: 0 0 55%;
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    perspective: 1800px;
}
.fs-gallery-wrapper {
    width: 100%;
    height: 80%;
    position: relative;
    transform-style: preserve-3d;
    transition: transform 0.6s ease-out; /* For mouse parallax */
}
.fs-scene {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0; left: 0;
    transform-style: preserve-3d;
}

/* Bottom Navigation */
.fs-navigation-bottom {
    position: absolute;
    bottom: 50px;
    right: 5%;
    display: flex;
    align-items: center;
    gap: 20px;
    z-index: 20;
}
.fs-nav-btn {
    background: none;
    border: none;
    color: #A0A0A0;
    font-size: 14px;
    cursor: pointer;
    transition: color 0.3s ease;
}
.fs-nav-btn:hover {
    color: #FFFFFF;
}
.fs-counter {
    font-size: 13px;
    font-weight: 500;
    color: #A0A0A0;
    letter-spacing: 2px;
}
.fs-counter #fs-current {
    color: #FFFFFF;
}

/* Portrait Cards */
.fs-card {
    position: absolute;
    top: 50%; left: 50%;
    width: 340px; height: 380px;
    margin: -190px 0 0 -170px;
    border-radius: 20px;
    background: transparent;
    overflow: hidden;
    transform-style: preserve-3d;
    transition: all 800ms cubic-bezier(0.25, 1, 0.5, 1);
    cursor: pointer;
    will-change: transform, filter, opacity;
}
.fs-card img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: all 800ms ease;
    opacity: 0.9;
}
.fs-card.active img {
    opacity: 1;
}
.fs-card.active {
    box-shadow: 0 40px 80px rgba(0,0,0,0.5);
    z-index: 100;
}

/* Float Animations for Cards */
@keyframes fsFloatUp {
    0% { margin-top: -190px; }
    100% { margin-top: -210px; }
}
@keyframes fsFloatDown {
    0% { margin-top: -190px; }
    100% { margin-top: -170px; }
}

@media (max-width: 1024px) {
    .faculty-showcase-section { height: auto; padding: 120px 0; }
    .fs-container { flex-direction: column; }
    .fs-left, .fs-right { flex: 0 0 100%; width: 100%; }
    .fs-left { padding-right: 0; margin-bottom: 60px; }
    .fs-info-wrapper { margin: 0; text-align: left; }
    .fs-actions { justify-content: flex-start; }
    .fs-title { font-size: 80px; }
    .fs-right { height: 500px; }
    .fs-card { width: 260px; height: 320px; margin: -160px 0 0 -130px; }
    .fs-navigation-bottom { bottom: 20px; right: 20px; }
}

/* Enquiry Form Popup Modal */
.enquiry-modal {
    display: none; 
    position: fixed; 
    z-index: 999999; 
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    overflow-y: auto; 
    overflow-x: hidden;
    background-color: rgba(0,0,0,0.65); 
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.enquiry-modal.show {
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
}

.enquiry-modal-content {
    background-color: transparent;
    padding: 0;
    position: relative;
    margin: auto;
    width: 100%;
    max-width: 650px;
    animation: modalSlideUp 0.4s ease-out forwards;
}

@keyframes modalSlideUp {
    from { transform: translateY(50px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.close-modal {
    color: var(--text-color, #333);
    position: absolute;
    right: 20px;
    top: 15px;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
    transition: color 0.3s;
    z-index: 10;
    line-height: 1;
}

.close-modal:hover,
.close-modal:focus {
    color: var(--secondary-color, #ffb300);
    text-decoration: none;
}

.modal-form-card {
    margin: 0 auto !important;
    width: 100% !important;
    max-width: 100% !important; /* Forces it to use the new 650px from parent */
    padding: 40px !important; /* Adds generous padding to the larger form */
    box-shadow: 0 15px 40px rgba(0,0,0,0.3) !important;
    position: relative;
    z-index: 1;
}

@media (max-width: 768px) {
    .enquiry-modal-content {
        max-width: 90%;
    }
    .modal-form-card {
        padding: 30px 20px !important;
    }
}

html.modal-active, body.modal-active {
    overflow: hidden !important;
    height: 100vh !important;
    touch-action: none;
}

/* =================================================
   SWUP SPA PAGE TRANSITIONS
   ================================================= */
html.is-animating .transition-fade {
    opacity: 0;
    transform: translateY(-20px);
}
.transition-fade {
    transition: opacity 0.4s ease, transform 0.4s ease;
    opacity: 1;
    transform: translateY(0);
}

/* =================================================
   GLOBAL FOOTPRINT SECTION
   ================================================= */
.global-footprint-section {
    background-color: #1b2272;
    padding: 40px 0 20px 0;
    position: relative;
    overflow: hidden;
    font-family: 'Montserrat', sans-serif;
}
.gf-title {
    color: #ffffff;
    font-size: 42px;
    font-weight: 700;
    margin-bottom: 15px;
}
.gf-title span {
    color: #d4af37;
}
.gf-map-container {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    height: 520px;
}
.gf-world-map {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: invert(1) sepia(1) saturate(5) hue-rotate(175deg) opacity(0.3);
}
.gf-lines-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 2;
}
.gf-curved-line {
    fill: none;
    stroke: url(#lineGrad);
    stroke-width: 2;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    animation: gfLineDraw 3s infinite linear;
}
@keyframes gfLineDraw {
    to { stroke-dashoffset: 0; }
}

.gf-node {
    position: absolute;
    z-index: 3;
    cursor: pointer;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
}
.gf-dot {
    width: 12px;
    height: 12px;
    background-color: #d4af37;
    border-radius: 50%;
    box-shadow: 0 0 10px #d4af37, 0 0 20px #d4af37;
    animation: gfPulse 2s infinite;
}
.gf-flag {
    position: absolute;
    top: -25px;
    font-size: 20px;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.5));
}
.center-node {
    width: 80px;
    height: 80px;
    background: rgba(27, 34, 114, 0.8);
    border: 2px solid #d4af37;
    border-radius: 50%;
    padding: 10px;
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.5);
}
.center-node img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.gf-pulse {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 2px solid #d4af37;
    animation: gfRipple 2s infinite;
}
@keyframes gfPulse {
    0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(212, 175, 55, 0.7); }
    70% { transform: scale(1.2); box-shadow: 0 0 0 15px rgba(212, 175, 55, 0); }
    100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(212, 175, 55, 0); }
}
@keyframes gfRipple {
    0% { transform: scale(1); opacity: 1; }
    100% { transform: scale(1.5); opacity: 0; }
}

/* Glassmorphism Card */
.gf-info-card {
    position: absolute;
    top: 20%;
    right: 5%;
    width: 320px;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    padding: 15px;
    z-index: 10;
    box-shadow: 0 15px 35px rgba(0,0,0,0.3);
    color: #fff;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.4s ease;
    pointer-events: none;
}
.gf-info-card.active {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
.gf-card-img {
    width: 100%;
    height: 140px;
    object-fit: cover;
    border-radius: 8px;
    margin-bottom: 15px;
}
.gf-partner-head {
    display: flex;
    gap: 15px;
    align-items: center;
    margin-bottom: 15px;
}
.gf-partner-logo {
    width: 50px;
    height: 50px;
    background: #fff;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.gf-partner-head h4 {
    font-size: 14px;
    margin: 0 0 5px 0;
    font-weight: 700;
    line-height: 1.3;
}
.gf-partner-head p {
    font-size: 11px;
    margin: 0;
    color: #b0c4de;
}
.gf-partner-perks {
    list-style: none;
    padding: 0;
    margin: 0;
}
.gf-partner-perks li {
    font-size: 12px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #e2e8f0;
}
.gf-partner-perks li i {
    color: #4db8ff;
    width: 15px;
}

.gf-flag-img {
    position: absolute;
    top: -20px;
    width: 24px;
    height: auto;
    border-radius: 2px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.5);
    transition: transform 0.3s ease;
}
.gf-node:hover .gf-flag-img {
    transform: scale(1.3) translateY(-5px);
}
.gf-student-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 15px;
    max-height: 250px;
    overflow-y: auto;
}
/* Custom Scrollbar for list */
.gf-student-list::-webkit-scrollbar { width: 4px; }
.gf-student-list::-webkit-scrollbar-thumb { background: #d4af37; border-radius: 4px; }

.gf-student-item {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(0,0,0,0.2);
    padding: 8px;
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,0.05);
}
.gf-student-img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #d4af37;
}
.gf-student-name {
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    line-height: 1.2;
}

@media (max-width: 992px) {
    .gf-map-container { height: 400px; }
    .gf-info-card { right: 50%; transform: translateX(50%) translateY(20px); top: auto; bottom: -50px; }
    .gf-info-card.active { transform: translateX(50%) translateY(0); }
}

/* =================================================
   EXPLORE PROGRAMS PAGE
   ================================================= */
.program-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: flex-start;
}
.filter-btn {
    background: #fff;
    border: 1px solid #ddd;
    padding: 8px 18px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    cursor: pointer;
    transition: all 0.3s ease;
}
.filter-btn:hover, .filter-btn.active {
    background: #1b2272;
    color: #fff;
    border-color: #1b2272;
}

.schools-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}
.school-card-box {
    background: #f0f2fa;
    border-radius: 12px;
    padding: 20px;
    position: relative;
    overflow: hidden;
    min-height: 180px;
    cursor: pointer;
    transition: all 0.3s ease;
    border: 1px solid rgba(27, 34, 114, 0.1);
}
.sc-content h4 {
    color: #1b2272;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 30px;
    position: relative;
    z-index: 2;
}
.course-count {
    font-size: 14px;
    color: #555;
    position: absolute;
    bottom: 20px;
    left: 20px;
    margin: 0;
    font-weight: 500;
    z-index: 2;
}
.sc-bg-icon {
    position: absolute;
    bottom: -10px;
    right: -10px;
    font-size: 100px;
    color: rgba(27, 34, 114, 0.05);
    z-index: 1;
    transition: all 0.3s ease;
}
.sc-hover-details {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: #1b2272;
    color: #fff;
    padding: 20px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 3;
    display: flex;
    flex-direction: column;
}
.sc-hover-details h4 {
    color: #d4af37;
    font-size: 16px;
    margin-bottom: 15px;
    border-bottom: 1px solid rgba(255,255,255,0.2);
    padding-bottom: 10px;
}
.sc-hover-details ul {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 13px;
    line-height: 1.8;
}
.sc-hover-details ul li::before {
    content: "•";
    color: #d4af37;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
}
.school-card-box:hover .sc-hover-details {
    opacity: 1;
    visibility: visible;
}
.school-card-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

/* Placement & Corporate */
.placement-graph-card {
    background: #fff;
    border-radius: 12px;
    padding: 30px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}
.placement-percent {
    font-size: 48px;
    font-weight: 800;
    color: #1b2272;
    margin: 0;
    line-height: 1;
}
.placement-label {
    font-size: 16px;
    color: #666;
    margin-bottom: 20px;
    font-weight: 600;
}
.chart-wrapper { margin-top: 20px; }
.chart-labels {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: #999;
    margin-top: 10px;
}
.corporate-logos-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
}
.logo-box {
    background: transparent;
    padding: 10px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.logo-box img { max-width: 100%; max-height: 35px; filter: grayscale(100%); opacity: 0.7; transition: 0.3s; }
.logo-box:hover img { filter: grayscale(0%); opacity: 1; }

.story-card {
    background: #fdfdfd;
    padding: 15px;
    border-radius: 12px;
    border: 1px solid #eaeaea;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.story-text { font-size: 11px; color: #555; margin-bottom: 15px; line-height: 1.5; }
.student-meta { display: flex; align-items: center; gap: 10px; }
.student-meta img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.student-meta h6 { margin: 0; font-size: 14px; font-weight: 700; color: #333; }
.student-meta span { font-size: 11px; color: #888; }

/* Faculty Spotlight */
.faculty-card-new {
    background: #fff;
    border: 1px solid #c5c1c1;
    border-radius: 12px;
    padding: 24px;
    height: 100%;
    min-height: 250px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.3s ease;
}
.faculty-card-new:hover {
    border-color: #1b2272;
    box-shadow: 0 10px 20px rgba(27,34,114,0.05);
}
.fac-head { display: flex; align-items: center; gap: 15px; margin-bottom: 15px; }
.fac-head img { width: 55px; height: 55px; border-radius: 50%; object-fit: cover; }
.fac-head h5 { margin: 0; font-size: 16px; font-weight: 700; color: #1b2272; }
.fac-head span { font-size: 12px; color: #666; font-weight: 600; text-transform: uppercase; }
.fac-desc { font-size: 14px; color: #555; line-height: 1.6; margin-bottom: 15px; }
.fac-research { font-size: 13px; color: #333; margin-top: 10px;}

/* Explore Programs Isolated Grid (Decoupled from Home Page) */
.explore-grid { 
    display: grid; 
    grid-template-columns: repeat(4, 1fr); 
    gap: 24px; 
    margin-top: 40px; 
}

@media (max-width: 1024px) {
    .explore-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .explore-grid {
        grid-template-columns: 1fr;
    }
}
.explore-card {
    position: relative;
    border-radius: 12px;
    padding: 22px 20px;
    height: 145px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    color: var(--white);
    transition: transform 0.3s, box-shadow 0.3s;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    cursor: pointer;
    text-align: left;
    border: 1px solid rgba(0,0,0,0.03);
}
.explore-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 25px rgba(0,0,0,0.15);
}
.explore-card:hover .card-icon-bg {
    transform: scale(1.15) rotate(10deg);
}
.explore-card.dark {
    background: linear-gradient(135deg, #101c38 0%, #1e3158 100%);
}
.explore-card.purple-medium {
    background: linear-gradient(135deg, #a47edb 0%, #7d4bbb 100%);
    color: var(--white);
}
.explore-card.purple-light {
    background: linear-gradient(135deg, #fbf7ff 0%, #e8d4ff 100%);
    color: #1a2456;
}
.explore-card.purple-light h4 {
    color: #1a2456;
}
.explore-card h4 {
    font-size: 19px;
    font-weight: 700;
    margin: 0;
    position: relative;
    z-index: 2;
    color: var(--white);
    line-height: 1.3;
    letter-spacing: -0.2px;
}
.explore-card .course-count {
    font-size: 14px;
    font-weight: 600;
    margin: 0;
    position: relative;
    z-index: 2;
    opacity: 0.85;
    color: #656262;
}
.explore-card .card-icon-bg {
    position: absolute;
    bottom: -25px;
    right: -25px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.02) 100%);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: inset 0 4px 6px rgba(255,255,255,0.1);
    backdrop-filter: blur(5px);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.explore-card.purple-light .card-icon-bg {
    background: linear-gradient(135deg, rgba(139, 77, 220, 0.08) 0%, rgba(139, 77, 220, 0.02) 100%);
    border: 1px solid rgba(139, 77, 220, 0.15);
    box-shadow: inset 0 4px 6px rgba(139, 77, 220, 0.05);
}
.explore-card .card-icon-bg i {
    font-size: 55px;
    color: #ffffff;
    transform: translate(-10px, -10px);
    text-shadow: 2px 4px 6px rgba(0,0,0,0.15);
    background: linear-gradient(135deg, #ffffff 0%, #e0e0e0 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.explore-card.purple-light .card-icon-bg i {
    color: #6c2ba8;
    text-shadow: 2px 4px 6px rgba(108, 43, 168, 0.1);
    background: linear-gradient(135deg, #8b4ddc 0%, #511b96 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Placement Section CSS */
.placement-percent {
    font-size: 52px;
    font-weight: 800;
    color: #331566;
    margin: 0;
    line-height: 1;
    font-family: 'Montserrat', sans-serif;
}
.placement-label {
    font-size: 15px;
    font-weight: 700;
    color: #333;
    margin-top: 5px;
    margin-bottom: 0;
}
.chart-wrapper {
    position: relative;
    width: 100%;
    margin-top: 20px;
}
.chart-labels {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
    padding: 0 5px;
}
.chart-labels span {
    font-size: 11px;
    font-weight: 700;
    color: #666;
    text-transform: uppercase;
}
.corporate-logos-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
    align-items: center;
}
.logo-box {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
}
.logo-box img {
    max-width: 100%;
    max-height: 35px;
    object-fit: contain;
    transition: transform 0.3s ease;
}
.logo-box:hover img {
    transform: scale(1.05);
}

@media (max-width: 768px) {
    .corporate-logos-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Custom Slider Navigation Buttons */
.custom-slider-btn {
    background: #f1f1f1;
    border: none;
    border-radius: 6px;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #111;
    cursor: pointer;
    transition: all 0.3s ease;
}
.custom-slider-btn + .custom-slider-btn {
    margin-left: 10px;
}
.custom-slider-btn:hover {
    background: #e2e2e2;
    color: #1b2272;
}
.custom-slider-btn i {
    font-size: 14px;
}