:root {
     --clr-primary: #c1121f;
     /* Crimson Red */
     --clr-primary-dark: #780000;
     /* Deep Burgundy */
     --clr-accent: #ffb703;
     /* Premium Gold */
     --clr-accent-light: #ffedd5;
     --clr-bg: #f9f9f9;
     /* Requested User Background */
     --clr-text-main: #1e293b;
     --clr-text-muted: #64748b;
     --clr-white: #ffffff;

     --shadow-sm: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
     --shadow-md: 0 10px 30px -3px rgba(120, 0, 0, 0.08);
     --shadow-lg: 0 20px 40px -5px rgba(0, 0, 0, 0.1);
     --shadow-hover: 0 25px 50px -12px rgba(193, 18, 31, 0.15);

     --radius-md: 16px;
     --radius-lg: 24px;
     --radius-xl: 32px;

     --transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
 }

 body {
     font-family: 'Plus Jakarta Sans', sans-serif;
     color: var(--clr-text-main);
     background-color: var(--clr-bg);
     overflow-x: hidden;
     -webkit-font-smoothing: antialiased;
 }

 h1,
 h2,
 h3,
 h4,
 h5,
 h6,
 .font-serif {
     font-family: 'Merriweather', serif;
     color: var(--clr-primary-dark);
 }

 /* Fluid Typography */
 .display-hero {
     font-size: clamp(2.5rem, 5vw, 4.5rem);
     font-weight: 900;
     line-height: 1.1;
 }

 .heading-section {
     font-size: clamp(2rem, 3vw, 3rem);
     font-weight: 800;
 }

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

 /* Custom Scrollbar */
 ::-webkit-scrollbar {
     width: 10px;
 }

 ::-webkit-scrollbar-track {
     background: var(--clr-bg);
 }

 ::-webkit-scrollbar-thumb {
     background: var(--clr-primary);
     border-radius: 10px;
 }

 ::-webkit-scrollbar-thumb:hover {
     background: var(--clr-primary-dark);
 }

 /* --- BUTTONS --- */
 .btn-custom {
     padding: 14px 32px;
     border-radius: 50px;
     font-weight: 600;
     letter-spacing: 0.5px;
     transition: var(--transition);
     display: inline-flex;
     align-items: center;
     gap: 8px;
     position: relative;
     overflow: hidden;
     z-index: 1;
     text-decoration: none;
 }

 .btn-primary-custom {
     background-color: var(--clr-primary);
     color: var(--clr-white) !important;
     border: none;
     text-decoration: none;
     box-shadow: 0 8px 20px rgba(193, 18, 31, 0.3);
 }

 .btn-primary-custom:hover {
     background-color: var(--clr-primary-dark);
     transform: translateY(-3px);
     box-shadow: 0 12px 25px rgba(120, 0, 0, 0.4);
 }

 .btn-accent {
     background-color: var(--clr-accent);
     color: var(--clr-primary-dark) !important;
     border: none;
     box-shadow: 0 8px 20px rgba(255, 183, 3, 0.3);
 }

 .btn-accent:hover {
     background-color: #e5a400;
     transform: translateY(-3px);
     text-decoration: none;
 }

 /* =========================================
   HEADER & NAVIGATION (SINGLE RESPONSIVE NAVBAR)
========================================= */

 /* ---------- TOP BAR ---------- */
 .top-bar {
     background: var(--clr-primary-dark);
     color: rgba(255, 255, 255, 0.9);
     padding: 8px 0;
     font-size: 0.85rem;
     font-weight: 500;
     border-bottom: 2px solid var(--clr-accent);
 }

 .top-bar span {
     white-space: nowrap;
 }

 .top-bar a {
     color: rgba(255, 255, 255, 0.9);
     text-decoration: none;
     transition: var(--transition);
 }

 .top-bar a:hover {
     color: var(--clr-accent);
 }

 /* Hide Top Bar on Mobile */
 @media (max-width: 767px) {
     .top-bar {
         display: none;
     }
 }


 /* ---------- NAVBAR ---------- */
 .navbar {
     background: rgba(255, 255, 255, 0.92);
     backdrop-filter: blur(12px);
     -webkit-backdrop-filter: blur(12px);
     border-bottom: 1px solid rgba(0, 0, 0, 0.05);
     padding: 14px 0;
     transition: all 0.3s ease;
     z-index: 999;
 }

 /* On Scroll Effect */
 .navbar.scrolled {
     padding: 8px 0;
     background: rgba(255, 255, 255, 0.98);
     box-shadow: 0 8px 25px rgba(0, 0, 0, 0.06);
 }


 /* ---------- LOGO ---------- */
 .navbar-brand img,
 .brand-logo {
     height: 70px;
     max-width: 100%;
     transition: all 0.3s ease;
     border-radius: 8px;
     object-fit: contain;
 }

 .navbar.scrolled .navbar-brand img {
     height: 60px;
 }

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

     .navbar-brand img,
     .brand-logo {
         height: 55px;
     }
 } */


 /* ---------- NAV LINKS ---------- */
 .navbar-nav {
     align-items: center;
 }

 /* Default Link */
 .nav-link {
     font-weight: 600;
     color: var(--clr-text-main) !important;
     /* padding: 4px 4px !important; */
     margin: 4px 2px;
     border-radius: 8px;
     transition: all 0.25s ease;
     font-size: 15.5px;
     position: relative;
 }

 /* Hover & Active */
 .nav-link:hover,
 .nav-link.active {
     color: var(--clr-primary) !important;
     background: var(--clr-accent-light);
 }


 /* ---------- DESKTOP OPTIMIZATION ---------- */
 @media (min-width: 1200px) {
     .nav-link {
         font-size: 16px;
         padding: 10px 10px !important;
     }
 }

 /* Tablet */
 @media (max-width: 1199px) and (min-width: 992px) {
     .nav-link {
         font-size: 14px;
         /* padding: 6px 10px !important;  */
     }
 }


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

     .navbar-collapse {
         background: #ffffff;
         padding: 20px 0;
         margin-top: 15px;
         border-radius: 12px;
         box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
     }

     .navbar-nav {
         flex-direction: column;
         align-items: flex-start;
     }

     .nav-link {
         width: 100%;
         font-size: 1rem;
         padding: 12px 20px !important;
         margin: 0;
         border-radius: 0;
         border-bottom: 1px solid rgba(0, 0, 0, 0.05);
     }

     .nav-link:last-child {
         border-bottom: none;
     }

     .btn-primary-custom {
         width: 100%;
         margin-top: 15px;
         justify-content: center;
     }
 }


 /* ---------- NAVBAR TOGGLER ---------- */
 .navbar-toggler {
     outline: none !important;
     box-shadow: none !important;
     border: none;
 }

 .navbar-toggler:focus {
     box-shadow: none !important;
 }

 /* .brand-logo {
    border: 2px solid red;
} */
 /* Extra Large Screen Alignment */
 /* @media (min-width: 1400px) {
    .navbar .container {
        max-width: 1320px;
    }
} */

 /* --- HERO SECTION --- */
 /* .hero-section {
     position: relative;
     height: 100vh;
     min-height: 750px;
     background-color: var(--clr-primary-dark);
 }





 .swiper-hero {
     height: 100%;
     width: 100%;
 }

 .hero-slide-bg {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     object-fit: cover;
     transform: scale(1.1);
     transition: transform 10s ease-out;
 }

 .swiper-slide-active .hero-slide-bg {
     transform: scale(1);
 }

 .hero-overlay {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: linear-gradient(90deg, rgba(120, 0, 0, 0.9) 0%, rgba(193, 18, 31, 0.6) 50%, rgba(0, 0, 0, 0.4) 100%);
 }

 .hero-content {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     z-index: 10;
     color: var(--clr-white);
     width: 100%;
 }

 .hero-badge {
     background: rgba(255, 255, 255, 0.1);
     backdrop-filter: blur(4px);
     border: 1px solid rgba(255, 255, 255, 0.2);
     color: var(--clr-accent);
     padding: 8px 20px;
     border-radius: 50px;
     font-weight: 700;
     letter-spacing: 1px;
     display: inline-block;
     margin-bottom: 20px;
 }

 .custom-shape-divider-bottom {
     position: absolute;
     bottom: -1px;
     left: 0;
     width: 100%;
     overflow: hidden;
     line-height: 0;
     transform: rotate(180deg);
     z-index: 5;
 }

 .custom-shape-divider-bottom svg {
     position: relative;
     display: block;
     width: calc(100% + 1.3px);
     height: 70px;
 }

 .custom-shape-divider-bottom .shape-fill {
     fill: var(--clr-bg);
 }

 
 .pillars-wrapper {
     position: relative;
     z-index: 20;
     margin-top: -120px;
   
     padding-bottom: 60px;
 }

 .pillar-card {
     background: var(--clr-white);
     border-radius: var(--radius-lg);
     padding: 40px 30px;
     height: 100%;
     text-align: center;
     box-shadow: var(--shadow-md);
     border-bottom: 4px solid transparent;
     transition: var(--transition);
     position: relative;
     overflow: hidden;
 }

 .pillar-card:hover {
     transform: translateY(-10px);
     box-shadow: var(--shadow-hover);
     border-bottom-color: var(--clr-primary);
 }

 .pillar-icon-wrapper {
     width: 80px;
     height: 80px;
     background: var(--clr-bg);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     margin: 0 auto 25px;
     font-size: 2rem;
     color: var(--clr-primary);
     transition: var(--transition);
     border: 2px solid dashed var(--clr-accent-light);
 }

 .pillar-card:hover .pillar-icon-wrapper {
     background: var(--clr-primary);
     color: var(--clr-white);
     border-color: var(--clr-primary);
     transform: scale(1.1);
 }


 .section-header {
     text-align: center;
     margin-bottom: 60px;
 }

 .section-subtitle {
     color: var(--clr-primary);
     font-weight: 700;
     letter-spacing: 2px;
     text-transform: uppercase;
     font-size: 0.9rem;
     display: block;
     margin-bottom: 10px;
 }

 .title-underline {
     width: 60px;
     height: 4px;
     background: var(--clr-accent);
     margin: 20px auto 0;
     border-radius: 2px;
     position: relative;
 }

 .title-underline::after {
     content: '';
     position: absolute;
     width: 20px;
     height: 4px;
     background: var(--clr-primary);
     right: -30px;
     border-radius: 2px;
 } */

 /* ============ ROOT VARIABLES ============ */
 :root {
     --grad: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     --red: #c1121f;
     --gold: #ffb703;
     --dark: #1a1a2e;
     --text: #2d2d2d;
     --muted: #6c757d;
     --light-bg: #fafafa;
     --card-shadow: 0 8px 40px rgba(0, 0, 0, 0.08);
     --card-hover: 0 20px 60px rgba(193, 18, 31, 0.12);
     --radius: 16px;
 }

 /* ============ BASE ============ */
 * {
     box-sizing: border-box;
 }


 /* ============ GRADIENT TEXT ============ */
 .grad-text {
     background: var(--grad);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
 }

 /* ============ SECTION SPACING ============ */
 .bn-section {
     padding: 100px 0;
 }

 .bn-section-sm {
     padding: 70px 0;
 }

 /* ============ SECTION LABEL ============ */
 .bn-label {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     font-size: 12px;
     font-weight: 600;
     letter-spacing: 2.5px;
     text-transform: uppercase;
     color: var(--red);
     margin-bottom: 14px;
 }

 .bn-label::before {
     content: '';
     width: 28px;
     height: 2px;
     background: var(--grad);
     display: inline-block;
 }

 /* ============ SECTION TITLE ============ */
 .bn-title {
     font-size: clamp(2rem, 4vw, 2.8rem);
     font-weight: 800;
     line-height: 1.2;
     color: var(--dark);
 }

 .bn-subtitle {
     font-size: 1.05rem;
     color: var(--muted);
     max-width: 580px;
 }

 /* ============ BUTTONS ============ */
 .btn-bn-primary {
     background: var(--grad);
     color: #fff;
     border: none;
     padding: 14px 32px;
     border-radius: 50px;
     font-weight: 600;
     font-size: 0.95rem;
     letter-spacing: 0.5px;
     transition: all 0.3s ease;
     box-shadow: 0 6px 24px rgba(193, 18, 31, 0.28);
     text-decoration: none;
     display: inline-block;
 }

 .btn-bn-primary:hover {
     transform: translateY(-3px);
     box-shadow: 0 12px 32px rgba(193, 18, 31, 0.38);
     color: #fff;
 }

 .btn-bn-secondary {
     background: transparent;
     /* color: var(--red); */
     color: white;
     border: 2px solid transparent;
     background-clip: padding-box;
     padding: 12px 30px;
     border-radius: 50px;
     font-weight: 600;
     font-size: 0.95rem;
     transition: all 0.3s ease;
     text-decoration: none;
     display: inline-block;
     position: relative;
 }

 .btn-bn-secondary::before {
     content: '';
     position: absolute;
     inset: -2px;
     border-radius: 50px;
     background: var(--grad);
     z-index: -1;
 }

 .btn-bn-secondary:hover {
     background: var(--grad);
     color: #fff;
     transform: translateY(-3px);
 }


 @media(max-width:576px) {
     .btn-bn-primary {
         background: var(--grad);
         color: #fff;
         border: none;
         padding: 10px 15px;
         border-radius: 50px;
         font-weight: 600;
         font-size: 0.95rem;
         letter-spacing: 0.5px;
         transition: all 0.3s ease;
         box-shadow: 0 6px 24px rgba(193, 18, 31, 0.28);
         text-decoration: none;
         display: inline-block;
     }

     .btn-bn-secondary {
         background: transparent;
         /* color: var(--red); */
         color: white;
         border: 2px solid transparent;
         background-clip: padding-box;
         padding: 10px 15px;
         border-radius: 50px;
         font-weight: 600;
         font-size: 0.95rem;
         transition: all 0.3s ease;
         text-decoration: none;
         display: inline-block;
         position: relative;
     }

 }

 /* ============ ADMISSION BADGE ============ */
 .bn-admission-badge {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     background: linear-gradient(135deg, #fff8e1, #fff3e0);
     border: 1.5px solid var(--gold);
     color: #b45309;
     padding: 8px 18px;
     border-radius: 50px;
     font-size: 0.8rem;
     font-weight: 700;
     letter-spacing: 1.5px;
     text-transform: uppercase;
     margin-bottom: 20px;
     animation: pulse-badge 2s ease-in-out infinite;
 }

 .bn-admission-badge .dot {
     width: 8px;
     height: 8px;
     background: #f59e0b;
     border-radius: 50%;
     animation: blink 1.4s ease-in-out infinite;
 }

 @keyframes blink {

     0%,
     100% {
         opacity: 1
     }

     50% {
         opacity: 0.3
     }
 }

 @keyframes pulse-badge {

     0%,
     100% {
         box-shadow: 0 0 0 0 rgba(255, 183, 3, 0.4)
     }

     50% {
         box-shadow: 0 0 0 8px rgba(255, 183, 3, 0)
     }
 }

 /* ============ HERO ============ */
 #bn-hero {
     padding: 60px 0 1px;
     background: #fff;
     overflow: hidden;
     position: relative;
 }

 #bn-hero::before {
     content: '';
     position: absolute;
     top: -80px;
     right: -80px;
     width: 500px;
     height: 500px;
     background: radial-gradient(circle, rgba(255, 183, 3, 0.06) 0%, transparent 70%);
     pointer-events: none;
 }

 .bn-hero-img-wrap {
     position: relative;
     border-radius: 20px;
     overflow: hidden;
 }

 .bn-hero-img-wrap img {
     width: 100%;
     height: 520px;
     object-fit: cover;
     border-radius: 20px;
     box-shadow: 0 30px 80px rgba(0, 0, 0, 0.18);
     transition: transform 0.6s ease;
 }

 .bn-hero-img-wrap:hover img {
     transform: scale(1.03);
 }

 .bn-hero-img-badge {
     position: absolute;
     bottom: 24px;
     left: 24px;
     background: rgba(255, 255, 255, 0.96);
     backdrop-filter: blur(10px);
     border-radius: 12px;
     padding: 14px 20px;
     box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15);
     border-left: 4px solid var(--red);
 }

 .bn-hero-img-badge .badge-num {
     font-family: 'Playfair Display', serif;
     font-size: 1.8rem;
     font-weight: 800;
     line-height: 1;
     background: var(--grad);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
 }

 .bn-hero-img-badge .badge-label {
     font-size: 0.7rem;
     color: var(--muted);
     font-weight: 500;
 }

 .bn-hero-stat-row {
     display: flex;
     gap: 32px;
     margin-top: 32px;
 }



 .bn-hero-stat .num {
     font-family: 'Playfair Display', serif;
     font-size: 2rem;
     font-weight: 800;
     background: var(--grad);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
 }

 .bn-hero-stat .lbl {
     font-size: 0.75rem;
     color: var(--muted);
     font-weight: 500;
     text-transform: uppercase;
     letter-spacing: 1px;
 }

 @media (max-width:576px) {
     .bn-hero-stat .num {
         font-family: 'Playfair Display', serif;
         font-size: 1rem;
         font-weight: 800;
         background: var(--grad);
         -webkit-background-clip: text;
         -webkit-text-fill-color: transparent;
         background-clip: text;
     }

     .bn-hero-stat .lbl {
         font-size: 0.75rem;
         color: var(--muted);
         font-weight: 500;
         text-transform: uppercase;
         letter-spacing: 1px;
     }

     .bn-hero-stat-row {
         display: flex;
         gap: 20px;
         margin-top: 12px;
     }

 }


 /* ============ PHILOSOPHY STRIP ============ */
 /* .bn-philosophy-strip {
     background: var(--grad);
     border-radius: 20px;
     padding: 28px 40px;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 40px;
     flex-wrap: wrap;
     margin-top: 50px;
     box-shadow: 0 16px 50px rgba(193, 18, 31, 0.2);
 }

 .bn-phil-item {
     display: flex;
     flex-direction: column;
     align-items: center;
     color: #fff;
 }

 .bn-phil-item .icon {
     font-size: 2rem;
     margin-bottom: 6px;
 }

 .bn-phil-item .text {
     font-family: 'Playfair Display', serif;
     font-size: 1.1rem;
     font-weight: 700;
 }

 .bn-phil-divider {
     width: 1px;
     height: 60px;
     background: rgba(255, 255, 255, 0.3);
 } */


 /* --- ABOUT SECTION --- */
 .about-image-wrapper {
     position: relative;
     z-index: 1;
     padding-right: 30px;
     padding-bottom: 30px;
 }

 .about-img-main {
     border-radius: var(--radius-lg);
     box-shadow: var(--shadow-md);
     width: 100%;
     height: auto;
     object-fit: cover;
 }

 .about-img-float {
     position: absolute;
     bottom: 0;
     right: 0;
     width: 55%;
     border: 8px solid var(--clr-bg);
     border-radius: var(--radius-lg);
     box-shadow: var(--shadow-lg);
     z-index: 2;
 }

 .experience-badge {
     position: absolute;
     top: 30px;
     left: -20px;
     background: var(--clr-accent);
     color: var(--clr-primary-dark);
     padding: 20px;
     border-radius: var(--radius-md);
     box-shadow: var(--shadow-md);
     z-index: 3;
     text-align: center;
     animation: float 6s ease-in-out infinite;
 }

 @keyframes float {
     0% {
         transform: translateY(0px);
     }

     50% {
         transform: translateY(-15px);
     }

     100% {
         transform: translateY(0px);
     }
 }

 .feature-list {
     list-style: none;
     padding: 0;
 }

 .feature-list li {
     display: flex;
     align-items: flex-start;
     margin-bottom: 20px;
     background: var(--clr-white);
     padding: 15px 20px;
     border-radius: var(--radius-md);
     box-shadow: var(--shadow-sm);
     transition: var(--transition);
 }

 .feature-list li:hover {
     transform: translateX(10px);
     box-shadow: var(--shadow-md);
     border-left: 4px solid var(--clr-primary);
 }

 .feature-icon {
     background: var(--clr-accent-light);
     color: var(--clr-primary);
     width: 40px;
     height: 40px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
     margin-right: 15px;
     font-size: 1.1rem;
 }

 /* --- MESSAGES SECTION --- */
 .message-card {
     background: var(--clr-white);
     border-radius: var(--radius-xl);
     padding: 40px;
     box-shadow: var(--shadow-md);
     position: relative;
     z-index: 1;
     overflow: hidden;
     height: 100%;
     border: 1px solid rgba(0, 0, 0, 0.03);
 }

 .message-card::before {
     content: '\f10d';
     font-family: 'Font Awesome 6 Free';
     font-weight: 900;
     position: absolute;
     top: -10px;
     right: 20px;
     font-size: 120px;
     color: var(--clr-bg);
     z-index: -1;
     opacity: 0.5;
 }

 .profile-img {
     width: 90px;
     height: 90px;
     border-radius: 50%;
     object-fit: cover;
     border: 3px solid var(--clr-accent);
     padding: 3px;
 }

 /* --- FACILITIES BENTO GRID --- */
 /* .facilities-section {
     background: var(--clr-white);
     padding: 100px 0;
     border-radius: 40px 40px 0 0;
 }

 .facility-box {
     background: var(--clr-bg);
     border-radius: var(--radius-md);
     padding: 25px 20px;
     text-align: center;
     transition: var(--transition);
     border: 1px solid rgba(0, 0, 0, 0.03);
     height: 100%;
 }

 .facility-box:hover {
     background: var(--clr-primary-dark);
     color: var(--clr-white);
     transform: translateY(-5px);
     box-shadow: var(--shadow-md);
 }

 .facility-box i {
     font-size: 2.5rem;
     color: var(--clr-primary);
     margin-bottom: 15px;
     transition: var(--transition);
 }

 .facility-box:hover i {
     color: var(--clr-accent);
     transform: scale(1.1);
 }

 .facility-box h6 {
     font-family: 'Plus Jakarta Sans', sans-serif;
     font-weight: 700;
     margin: 0;
     color: inherit;
 } */

 /* --- DISCLOSURE SECTION --- */
 .disclosure-card {
     background: var(--clr-white);
     border-radius: var(--radius-xl);
     overflow: hidden;
     box-shadow: var(--shadow-md);
     border: 1px solid rgba(0, 0, 0, 0.05);
 }

 .disclosure-header {
     background: var(--clr-primary-dark);
     padding: 20px 30px;
     color: white;
 }

 .disclosure-row {
     display: flex;
     padding: 20px 30px;
     border-bottom: 1px solid var(--clr-bg);
     align-items: center;
     transition: background 0.2s;
 }

 .disclosure-row:hover {
     background: var(--clr-bg);
 }

 .disclosure-label {
     width: 35%;
     font-weight: 700;
     color: var(--clr-primary-dark);
 }

 .disclosure-value {
     width: 65%;
     color: var(--clr-text-main);
 }

 .doc-btn {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 8px 16px;
     background: var(--clr-bg);
     border: 1px solid #e2e8f0;
     border-radius: 8px;
     color: var(--clr-primary-dark);
     font-size: 0.85rem;
     font-weight: 600;
     transition: var(--transition);
 }

 .doc-btn:hover {
     background: var(--clr-primary);
     color: white;
     border-color: var(--clr-primary);
 }

 /* --- FOOTER --- */
 .footer {
     /* background: linear-gradient(to bottom, #111827, #020617); */
     /* background: linear-gradient(135deg,
                   #0E1D76 0%,
                    #3453A8 50%,
                    #2648A6 100%); */
     background-color: var(--clr-primary);
     color: #cbd5e1;
     padding: 80px 0 0;
     position: relative;
 }

 .footer-top-wave {
     position: absolute;
     top: -1px;
     left: 0;
     width: 100%;
     overflow: hidden;
     line-height: 0;
 }

 .footer-top-wave svg {
     position: relative;
     display: block;
     width: calc(100% + 1.3px);
     height: 40px;
 }

 .footer-top-wave .shape-fill {
     fill: var(--clr-bg);
 }

 /* Matches section above it */

 .footer-brand img {
     height: 80px;
     background: white;
     padding: 5px;
     border-radius: 12px;
     margin-bottom: 20px;
 }

 .footer-heading {
     color: white;
     font-family: 'Plus Jakarta Sans', sans-serif;
     font-weight: 700;
     font-size: 1.2rem;
     /* margin-bottom: 25px; */
     position: relative;
     padding-bottom: 10px;
 }

 .footer-heading::after {
     content: '';
     position: absolute;
     left: 0;
     bottom: 0;
     width: 40px;
     height: 3px;
     background: var(--clr-primary);
     border-radius: 2px;
 }

 .footer-links {
     list-style: none;
     padding: 0;
 }

 .footer-links li {
     margin-bottom: 2px;
     list-style: none;
     text-decoration: none;

 }

 .footer-links a {
     color: white;
     transition: var(--transition);
     display: inline-flex;
     align-items: center;
     /* gap: 8px;  */
     /* margin-bottom: 0px; */
     text-decoration: none;
 }

 .footer-links a::before {
     content: '›';
     color: var(--clr-primary);
     font-size: 1.2rem;
     font-weight: bold;
 }

 .footer-links a:hover {
     color: var(--clr-accent);
     transform: translateX(5px);
 }

 .social-links a {
     width: 40px;
     height: 40px;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     /* background: rgba(255, 255, 255, 0.05);
     color: white; */

     color: var(--clr-primary);
     /* color: white;  */
     background: white;
     border-radius: 50%;
     margin-right: 10px;
     transition: var(--transition);
     text-decoration: none;
     border: 1px solid rgba(255, 255, 255, 0.1);
 }

 .social-links a:hover {
     /* color: var(--clr-primary);
     background: white; */
     background: #ffb703;
     color: white;
     transform: translateY(-3px);
     border-color: var(--clr-primary);
 }

 .newsletter-box {
     background: rgba(255, 255, 255, 0.15);
     border: 1px solid rgba(255, 255, 255, 0.05);
     padding: 20px;
     border-radius: var(--radius-md);
 }

 .newsletter-input {
     background: rgb(255, 255, 255) !important;
     border: 1px solid rgba(255, 255, 255, 0.1) !important;
     color: rgb(0, 0, 0) !important;
 }

 .newsletter-input:focus {
     box-shadow: none;
     border-color: var(--clr-accent) !important;
 }

 .footer-bottom {
     border-top: 1px solid rgba(255, 255, 255, 0.05);
     padding: 20px 0;
     margin-top: 10px;
     font-size: 0.9rem;
     color: white;
 }


 @media (max-width: 991px) {
     .pillars-wrapper {
         margin-top: -60px;
     }

     .about-image-wrapper {
         padding-right: 0;

     }

     .experience-badge {
         padding: 10px;
         left: -10px;
     }

     .disclosure-row {
         flex-direction: column;
         align-items: flex-start;
     }

     .disclosure-label,
     .disclosure-value {
         width: 100%;
     }

     .disclosure-value {
         margin-top: 5px;
     }
 }

 @media (max-width: 768px) {
     .top-bar {
         display: none;
     }

     .pillars-wrapper {
         margin-top: 30px;
     }

     .hero-section {
         min-height: 400px;
         height: 115vh;
     }

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






 /* Section Background */
 .about-section {
     /* background: #f8f9fa; */
 }

 /* Gradient Title */
 .text-gradient {
     /* background: linear-gradient(90deg, #ff7a18, #6f42c1); */
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
 }

 /* Main Gradient Card */
 .about-main-card {
     /* background: linear-gradient(135deg, #ff7a18, #6f42c1);  */
     /* background: linear-gradient(135deg, #c1121f 0%, #ff4d00 71%, #ffb703 100%);   */
     /* background: linear-gradient(90deg, #c40000 0%, #ff3c00 40%, #ffb000 100%); */
     /* background: linear-gradient(135deg, #c40000, #ff6a00, #ffb300, #0077b6); */
     /* background: linear-gradient(135deg, #c40000 0%, #ff6a00 50%, #ffb300 75%); */
     /* background: linear-gradient(135deg, #c1121f, #ffb300); */
     /* background: linear-gradient(90deg, #c1121f, #ffb300); */
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);

     color: #fff;
     border-radius: 20px;
 }

 .about-main-card p {
     opacity: 0.95;
     font-weight: 600;
 }

 /* Feature Cards */
 .about-feature-card {
     background: #fff;
     border-radius: 20px;
     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
     transition: 0.3s ease;
 }

 .about-feature-card:hover {
     transform: translateY(-5px);
 }

 /* Icon Circle */
 .icon-circle {
     width: 60px;
     height: 60px;
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     color: #fff;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     margin: 0 auto;
     font-size: 20px;
 }

 /* Image Wrapper */
 .about-image-wrapper img {
     border-radius: 25px;
 }

 .about-img {
     width: 100%;
     height: 500px;
     /* Increase this value */
     object-fit: cover;
     border-radius: 25px;
 }




 /* ================================
   ELITE VISION & MISSION DESIGN
================================ */

 .bn-vm-elite-section {
     background: #ffffff;
     position: relative;
 }

 /* ===== Section Header ===== */

 .bn-vm-subtitle {
     font-size: 14px;
     letter-spacing: 3px;
     font-weight: 600;
     color: #c1121f;
     margin-bottom: 10px;
 }

 .bn-vm-title {
     font-size: 42px;
     font-weight: 800;
     color: #111;
 }

 .bn-vm-divider {
     width: 90px;
     height: 4px;
     margin: 18px auto 0;
     border-radius: 50px;
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
 }

 /* ===== Card Styling ===== */

 .bn-vm-elite-card {
     position: relative;
     padding: 50px 40px;
     border-radius: 24px;
     background: #ffffff;
     box-shadow:
         0 10px 30px rgba(0, 0, 0, 0.06),
         0 30px 60px rgba(0, 0, 0, 0.08);
     transition: all 0.4s ease;
     overflow: hidden;
 }

 /* Gradient Border Effect */
 .bn-vm-elite-card::before {
     content: "";
     position: absolute;
     inset: 0;
     border-radius: 24px;
     padding: 2px;
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     -webkit-mask:
         linear-gradient(#000 0 0) content-box,
         linear-gradient(#000 0 0);
     -webkit-mask-composite: xor;
     mask-composite: exclude;
     opacity: 0;
     transition: 0.4s ease;
 }

 .bn-vm-elite-card:hover::before {
     opacity: 1;
 }

 .bn-vm-elite-card:hover {
     transform: translateY(-12px);
 }

 /* Icon Badge */

 .bn-vm-badge {
     width: 70px;
     height: 70px;
     border-radius: 18px;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 28px;
     color: #fff;
     margin-bottom: 25px;
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     box-shadow: 0 15px 30px rgba(193, 18, 31, 0.3);
     transition: 0.4s ease;
 }

 .bn-vm-elite-card:hover .bn-vm-badge {
     transform: rotate(-8deg) scale(1.1);
 }

 /* Headings */

 .bn-vm-card-heading {
     font-size: 26px;
     font-weight: 700;
     margin-bottom: 18px;
     color: #111;
 }

 /* Content */

 .bn-vm-card-content {
     font-size: 16px;
     line-height: 1.8;
     color: #555;
 }

 .bn-vm-card-content span {
     font-weight: 600;
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
 }

 /* Bottom Decorative Line */

 .bn-vm-bottom-line {
     width: 60px;
     height: 3px;
     margin-top: 30px;
     border-radius: 50px;
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     transition: 0.4s ease;
 }

 .bn-vm-elite-card:hover .bn-vm-bottom-line {
     width: 120px;
 }

 /* Responsive */

 @media (max-width: 992px) {
     .bn-vm-title {
         font-size: 32px;
     }

     .bn-vm-elite-card {
         padding: 35px 25px;
     }
 }



 /* USP Section Styles */
 .bn-usp-section {
     position: relative;
     /* background-color: #f9f9f9; */
     /* Matches your background preference */
     overflow: hidden;
     /* padding: 80px 0; */
 }

 /* Background Decorative Shape */
 .bn-usp-bg-shape {
     position: absolute;
     top: -10%;
     right: -5%;
     width: 400px;
     height: 400px;
     background: radial-gradient(circle, rgba(0, 123, 255, 0.05) 0%, transparent 70%);
     z-index: 0;
     pointer-events: none;
 }

 /* Grid Layout */
 .bn-usp-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
     gap: 25px;
     position: relative;
     z-index: 1;
 }

 /* Card Styling */
 .bn-usp-card {
     background: #ffffff;
     border: 1px solid rgba(0, 0, 0, 0.03);
     border-radius: 20px;
     transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
     display: flex;
     flex-direction: column;
     align-items: flex-start;
     /* Aligned left for a modern look */
     position: relative;
 }

 .bn-usp-card:hover {
     transform: translateY(-10px);
     box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
     /* border-color: rgba(0, 123, 255, 0.2); */
 }

 /* Decorative Number */
 .bn-usp-number {
     position: absolute;
     top: 20px;
     right: 25px;
     font-size: 2.5rem;
     font-weight: 800;
     color: rgba(0, 0, 0, 0.35);
     line-height: 1;
     user-select: none;
 }

 /* Icon Container */
 .bn-usp-icon-box {
     width: 60px;
     height: 60px;
     background: #c1121f;
     color: #ffffff;
     border-radius: 12px;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 1.5rem;
     margin-bottom: 1.5rem;
     transition: 0.3s ease;
 }

 .bn-usp-card:hover .bn-usp-icon-box {
     transform: translateX(5px);

 }

 .bn-usp-card:hover .bn-usp-number {
     color: #c1121f;
 }

 /* Typography */
 .bn-usp-h4 {
     font-size: 1.25rem;
     font-weight: 700;
     color: #212529;
     margin-bottom: 0.75rem;
     line-height: 1.3;
 }

 .bn-usp-p {
     color: #6c757d;
     font-size: 0.95rem;
     line-height: 1.6;
     margin-bottom: 0;
 }

 /* Gradient Text for Headings */
 /* .text-gradient {
    background: linear-gradient(135deg, #007bff, #6610f2); 
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
} */




 /* Responsive Adjustments */
 @media (max-width: 768px) {
     .bn-usp-section {
         /* padding: 50px 0; */
     }

     .bn-usp-card {
         padding: 1.5rem !important;
     }
 }





 /* :root {
     --bn-msg-red: #b91c1c;
     --bn-msg-gold: #fbbf24;
     --bn-msg-bg: #f9f9f9;
    
     --bn-msg-dark: #0f172a;
     --bn-msg-muted: #64748b;
 }

 .bn-msg-section {

     font-family: 'Inter', sans-serif;
 }


 .bn-msg-card {
     background: #ffffff;
     border-radius: 0;
     border: none;
     overflow: hidden;
     box-shadow: 0 20px 50px rgba(0, 0, 0, 0.04);
     margin-bottom: 80px;
     display: flex;
     flex-direction: column;
 }

 @media (min-width: 992px) {
     .bn-msg-card {
         flex-direction: row;
         min-height: 500px;
     }

     .bn-msg-card.reverse {
         flex-direction: row-reverse;
     }
 }


 .bn-msg-image-side {
     flex: 0 0 40%;
     position: relative;
     background-color: #e2e8f0;

     min-height: 400px;
 }

 
 .bn-msg-portrait {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;
 }

 .bn-msg-image-overlay {
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     padding: 40px;
     background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
     color: #fff;
 }

 .bn-msg-name {
     font-family: 'Playfair Display', serif;
     font-size: 1.8rem;
     margin-bottom: 5px;
     font-weight: 700;
 }

 .bn-msg-designation {
     font-size: 0.9rem;
     text-transform: uppercase;
     letter-spacing: 2px;
     color: var(--bn-msg-gold);
     font-weight: 600;
 }



 /* --- Content Side --- */
 /* .bn-msg-content-side {
     flex: 0 0 60%;
     padding: 60px;
     display: flex;
     flex-direction: column;
     justify-content: center;
     position: relative;
 }

 .bn-msg-quote-icon {
     position: absolute;
     top: 40px;
     right: 60px;
     font-size: 4rem;
     color: rgba(185, 28, 28, 0.05);
     font-family: 'Playfair Display', serif;
 }

 .bn-msg-title-label {
     color: var(--bn-msg-red);
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 3px;
     font-size: 0.8rem;
     margin-bottom: 25px;
     display: block;
 }

 .bn-msg-text {
     font-family: 'Playfair Display', serif;
     font-size: 1.25rem;
     line-height: 1.6;
     color: var(--bn-msg-dark);
     font-style: italic;
 }

 .bn-msg-signature {
     margin-top: 30px;
     padding-top: 20px;
     border-top: 1px solid #f1f5f9;
 }


 .bn-msg-philosophy {
     display: inline-flex;
     gap: 15px;
     margin-top: 20px;
 }

 .bn-msg-s-tag {
     background: rgba(185, 28, 28, 0.05);
     color: var(--bn-msg-red);
     padding: 5px 15px;
     font-size: 0.75rem;
     font-weight: 700;
     border-radius: 50px;
     border: 1px solid rgba(185, 28, 28, 0.1);
 }

 @media (max-width: 768px) {
     .bn-msg-content-side {
         padding: 40px 30px;
     }

     .bn-msg-text {
         font-size: 1.1rem;
     }
 }


 @media (max-width:5769px){
    .bn-msg-s-tag {
   
     padding: 2px;
    
 }
 }  */
 */ :root {
     --bn-red: #b91c1c;
     --bn-gold: #fbbf24;
     --bn-bg: #f9f9f9;
     /* User defined background */
     --bn-text-dark: #1e293b;
     --bn-text-muted: #64748b;
 }

 .bn-facilities-section {
     /* background-color: var(--bn-bg);  */
     /* padding: 100px 0;  */
     font-family: 'Inter', sans-serif;
 }

 /* --- Header Styling (Matching Screenshot) --- */
 .bn-fac-header {
     text-align: center;
     /* margin-bottom: 70px; */
 }

 .bn-fac-top-label {
     color: var(--bn-red);
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 3px;
     font-size: 0.85rem;
     display: block;
     margin-bottom: 15px;
 }

 .bn-fac-main-title {
     font-family: 'Crimson Pro', serif;
     font-size: clamp(2.5rem, 5vw, 3.5rem);
     font-weight: 800;
     color: var(--bn-text-dark);
     margin-bottom: 25px;
     position: relative;
 }

 /* The decorative underline from screenshot */
 .bn-fac-title-underline {
     display: flex;
     justify-content: center;
     gap: 8px;
     margin-top: -10px;
 }

 .bn-fac-line-gold {
     width: 60px;
     height: 4px;
     background-color: var(--bn-gold);
     border-radius: 2px;
 }

 .bn-fac-line-red {
     width: 20px;
     height: 4px;
     background-color: var(--bn-red);
     border-radius: 2px;
 }

 .bn-fac-intro-text {
     max-width: 900px;
     /* margin: 30px auto 0;  */
     color: var(--bn-text-muted);
     font-size: 1.1rem;
     line-height: 1.7;
 }

 /* --- Facilities Grid --- */
 .bn-fac-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 25px;
     margin-top: 50px;
 }

 .bn-fac-card {
     background: #ffffff;
     /* padding: 40px 30px;  */
     border-radius: 12px;
     text-align: center;
     transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
     border: 1px solid rgba(0, 0, 0, 0.03);
     display: flex;
     flex-direction: column;
     align-items: center;
     height: 100%;
 }

 .bn-fac-card:hover {
     transform: translateY(-10px);
     box-shadow: 0 20px 40px rgba(0, 0, 0, 0.06);
     border-color: rgba(185, 28, 28, 0.1);
 }

 .bn-fac-icon-box {
     width: 70px;
     height: 70px;
     background-color: #fff1f2;
     /* Very light red tint */
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 15px;
     transition: 0.3s;
 }

 .bn-fac-card:hover .bn-fac-icon-box {
     background-color: var(--bn-red);
 }

 .bn-fac-icon-box i {
     font-size: 1.8rem;
     color: var(--bn-red);
     transition: 0.3s;
 }

 .bn-fac-card:hover .bn-fac-icon-box i {
     color: #ffffff;
 }

 .bn-fac-name {
     font-size: 1.27rem;
     font-weight: 700;
     /* color: var(--bn-text-dark);  */
     color: var(--bn-red);
     margin-bottom: 5px;
     line-height: 1.3;
 }

 .bn-fac-desc {
     font-size: 0.9rem;
     color: var(--bn-text-muted);
     line-height: 1.6;
     margin: 0;
 }

 /* --- Responsive Queries --- */
 @media (max-width: 1200px) {
     .bn-fac-grid {
         grid-template-columns: repeat(3, 1fr);
     }
 }

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

     .bn-facilities-section {
         /* padding: 80px 20px;  */
     }
 }

 @media (max-width: 576px) {
     .bn-fac-grid {
         grid-template-columns: 1fr;
     }

     .bn-fac-card {
         padding: 35px 20px;
     }
 }








 :root {
     --bn-red: #b91c1c;
     --bn-gold: #fbbf24;
     --bn-bg: #f9f9f9;
     --bn-slate: #0f172a;
     --bn-white: #ffffff;
     --bn-text-muted: #64748b;
     --bn-border: rgba(15, 23, 42, 0.08);
     --bn-transition: all 0.5s cubic-bezier(0.2, 1, 0.3, 1);
 }

 /* body {
     background-color: var(--bn-bg);
     color: var(--bn-slate);
     margin: 0;
     padding: 0;
 } */

 .bn-career-section {
     /* background-color: var(--bn-bg); */
     /* padding: 80px 0;  */
     font-family: 'Inter', sans-serif;
     overflow: hidden;
 }

 /* --- Section Header --- */
 .bn-career-header {
     text-align: center;
     margin-bottom: 60px;
 }

 .bn-career-pre {
     font-size: 0.8rem;
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 5px;
     color: var(--bn-red);
     display: block;
     margin-bottom: 15px;
 }

 .bn-career-main-title {
     font-family: 'Crimson Pro', serif;
     font-size: clamp(2.2rem, 5vw, 3.8rem);
     font-weight: 800;
     color: var(--bn-slate);
     line-height: 1.1;
 }

 /* --- Subsection 1: Career Development Cell --- */
 /* .bn-career-cell-wrap {
     background: #ffffff;
     border: 1px solid var(--bn-border);
     margin-bottom: 40px;
     display: grid;
     grid-template-columns: 4fr 8fr;
     border-radius: 20px;
     overflow: hidden;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.02);
 }

 .bn-side-identity {
     background-color: var(--bn-red);
     color: #ffffff;
     padding: 60px;
     display: flex;
     flex-direction: column;
     justify-content: center;
 }

 .bn-side-identity i {
     font-size: 3rem;
     color: var(--bn-gold);
     margin-bottom: 30px;
 }

 .bn-side-identity h3 {
     font-family: 'Crimson Pro', serif;
     font-size: 2.2rem;
     font-weight: 700;
     margin: 0;
 }

 .bn-timeline-grid {
     padding: 60px;
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     gap: 40px;
 }

 .bn-timeline-item {
     position: relative;
     padding-left: 25px;
     border-left: 2px solid #f1f5f9;
     transition: var(--bn-transition);
 }

 .bn-timeline-item::before {
     content: "";
     position: absolute;
     left: -7px;
     top: 0;
     width: 12px;
     height: 12px;
     background: #cbd5e1;
     border-radius: 50%;
     transition: var(--bn-transition);
 }

 .bn-timeline-item:hover {
     border-left-color: var(--bn-red);
 }

 .bn-timeline-item:hover::before {
     background: var(--bn-red);
     box-shadow: 0 0 0 5px rgba(185, 28, 28, 0.1);
 }

 .bn-timeline-title {
     font-size: 0.75rem;
     font-weight: 700;
     text-transform: uppercase;
     color: var(--bn-red);
     margin-bottom: 8px;
     display: block;
 }

 .bn-timeline-text {
     font-size: 1.05rem;
     font-weight: 600;
     color: var(--bn-slate);
     margin: 0;
     line-height: 1.4;
 } */

 /* --- Subsection 2: Communication Lab --- */
 .bn-comm-lab-wrap {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     gap: 30px;
     margin-bottom: 40px;
 }

 .bn-comm-card {
     background: #ffffff;
     padding: 60px;
     border: 1px solid var(--bn-border);
     position: relative;
     display: flex;
     flex-direction: column;
     justify-content: center;
     border-radius: 20px;
 }

 .bn-comm-card::before,
 .bn-comm-card::after {
     content: "";
     position: absolute;
     width: 30px;
     height: 30px;
     border: 2px solid var(--bn-gold);
     transition: var(--bn-transition);
 }

 .bn-comm-card::before {
     top: 30px;
     left: 30px;
     border-right: 0;
     border-bottom: 0;
 }

 .bn-comm-card::after {
     bottom: 30px;
     right: 30px;
     border-left: 0;
     border-top: 0;
 }

 .bn-comm-card:hover::before,
 .bn-comm-card:hover::after {
     width: 50px;
     height: 50px;
 }

 .bn-comm-title {
     font-family: 'Crimson Pro', serif;
     font-size: 2.8rem;
     font-weight: 700;
     margin-bottom: 10px;
 }

 .bn-comm-features {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 20px;
     padding: 60px;
     background: #ffffff;
     border: 1px solid var(--bn-border);
     border-radius: 20px;
 }

 .bn-feature-pill {
     padding: 15px 20px;
     background: var(--bn-bg);
     border-radius: 50px;
     font-weight: 600;
     font-size: 0.85rem;
     display: flex;
     align-items: center;
     gap: 12px;
     transition: var(--bn-transition);
     border: 1px solid transparent;
 }

 .bn-feature-pill:hover {
     background: var(--bn-red);
     color: #ffffff;
     transform: scale(1.05);
     border-color: var(--bn-red);
 }

 .bn-feature-pill i {
     color: var(--bn-gold);
 }

 .bn-feature-pill:hover i {
     color: #ffffff;
 }

 /* --- Subsection 3: APEC --- */
 .bn-section-label {
     display: flex;
     align-items: center;
     gap: 20px;
     margin-bottom: 40px;
 }

 .bn-section-label h3 {
     font-family: 'Crimson Pro', serif;
     font-size: 2.2rem;
     font-weight: 700;
     margin: 0;
 }

 .bn-label-line {
     flex-grow: 1;
     height: 1px;
     background: linear-gradient(90deg, var(--bn-gold), transparent);
 }

 .bn-apec-grid-v2 {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     gap: 30px;
 }

 .bn-apec-card-v2 {
     display: flex;
     gap: 25px;
     align-items: center;
     /* padding: 40px;  */
     /* background: var(--bn-white); */
     /* background: #c10f12;  */
     /* background: linear-gradient(90deg, #ff7a18, #6f42c1);  */
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     border-radius: 30px;
     /* border: 1px solid var(--bn-border);  */
     transition: var(--bn-transition);
 }

 .bn-apec-card-v2:hover {
     box-shadow: 0 20px 40px rgba(0, 0, 0, 0.06);
     border-color: #ffb703;
     transform: translateY(-5px);
 }

 .bn-apec-icon-v2 {
     font-size: 2.5rem;
     /* color: var(--bn-gold);  */
     color: #ffb703;
     opacity: 1.0;
     flex-shrink: 0;
 }

 .bn-apec-h4 {
     font-family: 'Crimson Pro', serif;
     font-size: 1.7rem;
     font-weight: 700;
     margin-bottom: 10px;
     color: white;
 }

 .bn-apec-p {
     font-size: 0.95rem;
     color: var(--bn-text-muted);
     line-height: 1.6;
     margin: 0;
 }

 /* --- Fully Responsive Media Queries --- */
 @media (max-width: 1199px) {
     .bn-side-identity {
         padding: 40px;
     }

     .bn-timeline-grid {
         padding: 40px;
     }
 }

 @media (max-width: 991px) {
     .bn-career-cell-wrap {
         grid-template-columns: 1fr;
     }

     .bn-side-identity {
         text-align: center;
         align-items: center;
         padding: 50px 30px;
     }

     .bn-comm-lab-wrap {
         grid-template-columns: 1fr;
     }

     .bn-apec-grid-v2 {
         grid-template-columns: 1fr;
     }

     .bn-comm-card {
         padding: 50px 30px;
         text-align: center;
     }

     .bn-comm-features {
         padding: 40px 30px;
     }
 }

 @media (max-width: 767px) {
     .bn-career-section {
         /* padding: 60px 0; */
     }

     .bn-timeline-grid {
         grid-template-columns: 1fr;
         gap: 30px;
     }

     .bn-comm-features {
         grid-template-columns: 1fr;
     }

     .bn-apec-card-v2 {
         flex-direction: column;
         text-align: center;
         align-items: center;
     }

     .bn-feature-pill {
         justify-content: center;
     }

     .bn-section-label {
         flex-direction: column;
         text-align: center;
     }

     .bn-label-line {
         width: 100%;
         height: 2px;
     }
 }

 @media (max-width: 480px) {
     .bn-career-main-title {
         font-size: 2rem;
     }

     .bn-side-identity h3 {
         font-size: 1.8rem;
     }

     .bn-comm-title {
         font-size: 2.2rem;
     }

     .bn-apec-h4 {
         font-size: 1.4rem;
     }
 }


 /* =========================================
   ROOT VARIABLES
========================================= */

 /* =========================================
   ROOT VARIABLES
========================================= */

:root {
    --elite-red: #c1121f;
    --elite-gold: #fbbf24;
    --elite-dark: #0f172a;
    --elite-bg: #f9f9f9;
    --elite-white: #ffffff;
    --font-main: 'Hanken Grotesk', sans-serif;
    --font-display: 'Crimson Pro', serif;
    --transition-smooth: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Prevent horizontal scroll */
body {
    overflow-x: hidden;
}

/* =========================================
   SECTION BASE
========================================= */

.elite-usp-section {
    font-family: var(--font-main);
    color: var(--elite-dark);
    position: relative;
    overflow: visible;
}

/* Decorative radial blur */
.elite-accent-blur {
    position: absolute;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(193, 18, 31, 0.05) 0%, transparent 70%);
    top: -15%;
    left: -10%;
    z-index: 0;
    pointer-events: none;
}

/* =========================================
   LEFT SIDE (Sticky)
========================================= */

.elite-sticky-pane {
    position: sticky;
    top: 120px;
    align-self: flex-start; /* Added for proper sticky inside flex */
}

.elite-kicker {
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 4px;
    text-transform: uppercase;
    color: var(--elite-red);
    margin-bottom: 20px;
    display: inline-block;
}

.elite-main-title {
    font-size: clamp(2.5rem, 5vw, 4.0rem);
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    line-height: 1.1;
    margin-bottom: 25px;
    color: #0f172a;
}

.elite-intro-text {
    font-size: 1.1rem;
    line-height: 1.7;
    color: #475569;
    margin-bottom: 40px;
    max-width: 500px;
}

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

.philosophy-card {
    background: var(--elite-red);
    color: var(--elite-white);
    border-radius: 18px;
    padding: 40px;
    box-shadow: 0 25px 60px -15px rgba(0, 0, 0, 0.15);
    transition: var(--transition-smooth);
}

.philosophy-card:hover {
    transform: translateY(-5px);
}

.phil-label {
    font-family: var(--font-display);
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--elite-gold);
    margin-bottom: 20px;
    display: block;
}

.phil-items {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.phil-pill {
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 600;
}

.phil-pill span {
    width: 10px;
    height: 10px;
    background: var(--elite-gold);
    transform: rotate(45deg);
}

/* =========================================
   RIGHT SIDE FEATURES
========================================= */

.feature-stack {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.feature-item {
    background: var(--elite-white);
    padding: 35px;
    border-radius: 16px;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 25px;
    align-items: center;
    border: 1px solid rgba(0, 0, 0, 0.05);
    transition: var(--transition-smooth);
}

.feature-item:hover {
    transform: translateY(-8px);
    border-color: var(--elite-gold);
    box-shadow: 0 25px 50px -15px rgba(0, 0, 0, 0.1);
}

.feature-icon {
    width: 60px;
    height: 60px;
    background: #fff1f2;
    color: var(--elite-red);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    transition: var(--transition-smooth);
}

.feature-item:hover .feature-icon {
    background: var(--elite-red);
    color: white;
    transform: rotateY(180deg);
}

.feature-title {
    font-size: 1.15rem;
    font-weight: 700;
    margin: 0;
}

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

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

    .elite-usp-section {
        /* padding: 70px 0; */
    }

    /* Sticky REMOVED from here so it works on tablet */

    .elite-intro-text {
        max-width: 100%;
    }
}

/* Mobile */
@media (max-width: 767px) {

    .elite-sticky-pane {
        position: relative;
        top: 0;
    }

    .elite-usp-section {
        overflow: visible; /* removed hidden to prevent sticky conflict */
    }

    .elite-main-title {
        font-size: 2.2rem;
    }

    .elite-intro-text {
        font-size: 1rem;
    }

    .philosophy-card {
        padding: 30px 25px;
    }

    .feature-item {
        display: flex;
        flex-direction: column;
        text-align: center;
        gap: 18px;
        padding: 28px 20px;
    }

    .feature-icon {
        width: 55px;
        height: 55px;
        font-size: 1.2rem;
    }

    .feature-title {
        font-size: 1.05rem;
    }
}

@media (max-width:576px) {

    .elite-accent-blur {
        position: absolute;
        width: 80vw;
        height: 80vw;
        max-width: 600px;
        max-height: 600px;
        background: radial-gradient(circle, rgba(193, 18, 31, 0.05) 0%, transparent 70%);
        top: -20%;
        left: -30%;
        z-index: 0;
        pointer-events: none;
    }

    html,
    body {
        overflow-x: hidden !important;
    }
}


 /* 
 :root {
     --bn-red: #b91c1c;
     --bn-gold: #fbbf24;
     --bn-bg: #f9f9f9;
     --bn-text: #1a1a1a;
     --bn-text-muted: #666666;
 }



 .admission-section {
   
 }


 .section-heading {
     font-family: 'Playfair Display', serif;
     font-weight: 700;
     font-size: clamp(2.5rem, 5vw, 3.5rem);
     color: var(--bn-text);
     margin-bottom: 10px;
 }

 .section-subtitle {
     font-size: 1.1rem;
     color: var(--bn-red);
     font-weight: 500;
     margin-bottom: 60px;
     display: block;
 }


 .stage-card {
     background: #ffffff;
 
     border: 1px solid rgba(0, 0, 0, 0.06);
     border-radius: 12px;
 
     height: 100%;
     transition: all 0.4s ease;
     display: flex;
     flex-direction: column;
     justify-content: center;
     box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
 }

 .stage-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
   
 }


 .stage-icon {
     font-size: 2.2rem;
     margin-bottom: 15px;
     display: inline-block;
     transition: transform 0.4s ease;
 }


 .stage-card:hover .stage-icon {
     transform: scale(1.15) rotate(5deg);
 }

 .stage-card {
     transition: all 0.3s ease;
 }

 .card-title {
     font-family: 'Playfair Display', serif;
     font-size: 1.5rem;
     font-weight: 700;
     margin-bottom: 12px;
     color: #c1121f;
 }

 .card-desc {
     font-size: 1rem;
     line-height: 1.6;
     color: var(--bn-text-muted);
     margin: 0;
 }

 .stage-card:hover .card-desc {

     color: #000000;

 }



 .mb-grid {
     margin-bottom: 30px;
 }

 @media (max-width: 768px) {
     .admission-section {
         padding: 60px 0;
     }

     .stage-card {
         padding: 30px;
     }
 } */

 /* =========================================================
   ③ CLASSES
   ========================================================= */


 :root {
     --red: #c1121f;
     --gold: #ffb703;
     --dark: #0d0d14;
     --ink: #1c1c2e;
     --text: #2a2a3a;
     --muted: #6b7280;
     --light: #f8f7f4;
     --border: #e8e4de;

     --grad: linear-gradient(135deg, #c1121f 0%, #e85d04 55%, #ffb703 100%);
     --grad-soft: linear-gradient(135deg, rgba(193, 18, 31, .07) 0%, rgba(255, 183, 3, .07) 100%);

     --shadow: 0 8px 30px rgba(0, 0, 0, .06);
     --shadow-lg: 0 20px 70px rgba(0, 0, 0, .12);
     --hover-up: 0 30px 80px rgba(193, 18, 31, .15);

     --r: 18px;
     --r-lg: 26px;
 }


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

 .class-card {
     background: #ffffff;
     border-radius: var(--r);
     padding: 0;
     overflow: hidden;
     box-shadow: var(--shadow);
     border: 1px solid var(--border);
     transition: transform .35s ease, box-shadow .35s ease;
     height: 100%;
 }

 .class-card:hover {
     transform: translateY(-8px);
     box-shadow: var(--shadow-lg);
 }


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

 .class-card-img {
     height: 220px;
     /* slightly taller for better visual */
     overflow: hidden;
     position: relative;
     background: #000;
     /* prevents faded edge effect */
 }

 .class-card-img img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;

     /* prevents blur on scale */
     transform: scale(1.01);
     transition: transform .6s ease;

     /* subtle clarity boost */
     filter: contrast(1.05) saturate(1.05);
 }

 .class-card:hover .class-card-img img {
     transform: scale(1.08);
 }


 /* ================= LEVEL TAG ================= */

 .class-card-img .class-level-tag {
     position: absolute;
     top: 14px;
     left: 14px;
     background: var(--grad);
     color: #fff;
     font-size: .7rem;
     font-weight: 700;
     letter-spacing: 1.2px;
     text-transform: uppercase;
     padding: 6px 16px;
     border-radius: 50px;
     box-shadow: 0 6px 18px rgba(0, 0, 0, .15);
 }


 /* ================= BODY ================= */

 .class-card-body {
     padding: 22px 22px 24px;
 }

 .class-card-body h5 {
     font-size: 1.05rem;
     font-weight: 700;
     margin-bottom: 6px;
     color: var(--ink);
 }

 .class-card-body p {
     font-size: .85rem;
     color: var(--muted);
     margin: 0;
     line-height: 1.5;
 }


 /* ================= OPEN STATUS ================= */

 .class-card-body .class-open {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     margin-top: 14px;
     font-size: .75rem;
     font-weight: 700;
     color: var(--red);
     letter-spacing: .8px;
     text-transform: uppercase;
 }

 .class-card-body .class-open::before {
     content: '';
     width: 7px;
     height: 7px;
     background: var(--red);
     border-radius: 50%;
     animation: dot-blink 1.3s infinite;
 }


 /* ================= DOT ANIMATION ================= */

 @keyframes dot-blink {

     0%,
     100% {
         opacity: 1;
     }

     50% {
         opacity: .3;
     }
 }


 :root {
     --primary-gold: #b08d57;
     --text-dark: #2c3e50;
     --text-muted: #546e7a;
     --bg-light: #f9f9f9;
     --card-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
     --transition: all 0.3s ease;
 }

 /* 
 body {
     background: var(--bg-light);
     font-family: 'Inter', sans-serif;
     color: var(--text-dark);
 } */

 .admission-section {
     /* padding: 100px 0;  */
 }

 .section-title {
     font-family: 'Playfair Display', serif;
     font-size: 2.6rem;
     margin-bottom: 1rem;
 }

 .section-subtitle {
     font-size: 1.1rem;
     color: var(--text-muted);
     margin-bottom: 4rem;
 }

 /* Timeline */
 .timeline {
     position: relative;
 }

 .timeline::before {
     content: '';
     position: absolute;
     top: 0;
     left: 50%;
     width: 2px;
     height: 100%;
     background: #e0e0e0;
     transform: translateX(-50%);
 }

 /* Step */
 .timeline-step {
     position: relative;
     margin-bottom: 60px;
 }

 /* Badge */
 .step-badge {
     position: absolute;
     top: 0;
     left: 50%;
     transform: translate(-50%, -50%);
     width: 55px;
     height: 55px;
     /* background: #fff; */
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     border: 2px solid var(--primary-gold);
     color: #fff;
     border-radius: 50%;
     font-size: 18px;
     display: flex;
     align-items: center;
     justify-content: center;
     font-weight: 600;
     z-index: 2;
     transition: var(--transition);
 }

 /* Card */
 .step-card {
     /* background: #fff;  */
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     /* padding: 35px;  */
     border-radius: 12px;
     box-shadow: var(--card-shadow);
     transition: var(--transition);
     color: #fff;
 }

 .step-card:hover {
     transform: translateY(-6px);
     box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
 }

 .step-card h3 {
     font-family: 'Playfair Display', serif;
     font-size: 1.4rem;
     margin-bottom: 12px;
     font-weight: 800;
 }

 .step-card p {
     font-size: 0.95rem;
     color: #fff;
     margin: 0;
     line-height: 1.6;
 }

 /* Desktop Alternating */
 @media (min-width: 992px) {

     .timeline-step:nth-child(odd) .col-lg-6 {
         padding-right: 60px;
         text-align: right;
     }

     .timeline-step:nth-child(even) .col-lg-6 {
         margin-left: auto;
         padding-left: 60px;
         text-align: left;
     }
 }

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

     .timeline::before {
         left: 25px;
     }

     .step-badge {
         left: 3px;
         transform: translateY(-50%);
         width: 45px;
         height: 45px;
     }

     .timeline-step .col-lg-6 {
         margin-left: 70px;
         text-align: left !important;
     }

     .section-title {
         font-size: 2rem;
     }

     .admission-section {
         /* padding: 70px 0; */
     }
 }


 /* Horizontal connector line */
 .timeline-step::before {
     content: '';
     position: absolute;
     top: 50%;
     /* aligns with badge center */
     width: 60px;
     height: 2px;
     background: #e0e0e0;
     z-index: 1;
 }


 @media (min-width: 992px) {

     /* Odd steps (card on left) */
     .timeline-step:nth-child(odd)::before {
         left: 50%;
         transform: translateX(-100%);
     }

     /* Even steps (card on right) */
     .timeline-step:nth-child(even)::before {
         left: 50%;
     }
 }

 @media (max-width:770px) {
     .timeline-step::before {
         content: '';
         position: absolute;
         top: 50%;
         /* aligns with badge center */
         width: 45px;
         left: 25px;
         height: 3px;
         background: #e0e0e0;
         z-index: 1;
     }
 }



 :root {
     --bn-red: #b91c1c;
     --bn-gold: #fbbf24;
     --bn-bg: #f9f9f9;
     --bn-slate: #0f172a;
     --bn-muted: #64748b;
     --bn-white: #ffffff;
     --bn-card-shadow: 0 10px 40px rgba(0, 0, 0, 0.03);
     --bn-bezier: cubic-bezier(0.16, 1, 0.3, 1);
 }

 /* 
 body {
     background-color: var(--bn-bg);
     font-family: 'Inter', sans-serif;
     color: var(--bn-slate);
     margin: 0;
     overflow-x: hidden;
 } */

 /* Section Wrapper */
 .bn-docs-wrapper {
     position: relative;
 }

 /* ===============================
   Header Styling
=================================*/

 .bn-docs-header {
     text-align: center;
     max-width: 800px;
     margin: 0 auto 80px;
 }

 .bn-docs-tag {
     font-size: 0.8rem;
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 0.4em;
     color: var(--bn-red);
     display: block;
     margin-bottom: 20px;
 }

 .bn-docs-title {
     font-family: 'Playfair Display', serif;
     /* font-size: clamp(2.5rem, 5vw, 4rem); */
     font-size: 35px;
     font-weight: 800;
     line-height: 1.1;
     color: var(--bn-slate);
     /* margin-bottom: 25px;  */
 }

 .bn-docs-para {
     font-size: 1.15rem;
     color: var(--bn-muted);
     line-height: 1.8;
     margin: 2px;
     /* max-width: 650px;  */
 }

 /* Decorative Divider */
 /* .bn-docs-divider {
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, var(--bn-red), var(--bn-gold));
    margin: 30px auto;
    border-radius: 10px;
} */

 /* ===============================
   Card Styling
=================================*/

 .doc-card {
     background: var(--bn-white);
     border: 1px solid rgba(0, 0, 0, 0.04);

     text-align: center;
     transition: all 0.6s var(--bn-bezier);
     position: relative;
     z-index: 1;
     border-radius: 25px;
     overflow: hidden;
     /* box-shadow: var(--bn-card-shadow);  */
     /* box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;  */
     box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
 }


 /* Hover Glow Effect */
 /* .doc-card::before {
    content: "";
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(185, 28, 28, 0.03) 0%, transparent 70%);
    opacity: 0;
    transition: opacity 0.6s var(--bn-bezier);
    z-index: -1;
} */

 .doc-card:hover {
     transform: translateY(-12px);
     border-color: var(--bn-red);
     box-shadow: 0 30px 60px -15px rgba(185, 28, 28, 0.08);
 }

 .doc-card:hover::before {
     opacity: 1;
 }

 /* Category Label */
 .bn-doc-cat {
     font-size: 0.65rem;
     font-weight: 800;
     text-transform: uppercase;
     letter-spacing: 0.15em;
     color: var(--bn-muted);
     margin-bottom: 20px;
     padding: 4px 12px;
     /* background: #f1f5f9;  */
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     color: white;
     border-radius: 50px;
     display: inline-block;
 }

 .doc-card:hover .bn-doc-cat {
     background: var(--bn-red);
     color: var(--bn-white);
 }

 /* Icon Styling */
 .bn-doc-icon {
     width: 64px;
     height: 64px;
     /* background: #f8fafc;  */
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     border-radius: 18px;
     display: flex;
     align-items: center;
     justify-content: center;
     margin: 0 auto 15px;
     transition: all 0.5s var(--bn-bezier);
 }

 .bn-doc-icon i {
     font-size: 1.6rem;
     color: white;
     transition: all 0.5s var(--bn-bezier);
 }

 .doc-card:hover .bn-doc-icon {
     background: var(--bn-red);
     transform: rotate(-5deg);
 }

 .doc-card:hover .bn-doc-icon i {
     color: var(--bn-white);
 }

 /* Title */
 .bn-doc-name {
     font-size: 1.1rem;
     font-weight: 700;
     /* color: var(--bn-slate); */

     line-height: 1.3;
     margin-bottom: 8px;
 }

 /* Note */
 .bn-doc-note {
     font-size: 0.8rem;
     color: var(--bn-muted);

     font-weight: 500;
 }

 /* ===============================
   Mobile Adjustments
=================================*/

 @media (max-width: 576px) {
     .bn-docs-title {
         font-size: 2.2rem;
     }
 }



 /* :root {
     --primary-dark: #0f172a;
     --accent-gold: #c5a059;
     --accent-red: #b91c1c;
     --soft-bg: #f9f9f9;
     --glass-white: rgba(255, 255, 255, 0.85);
 }

 .elite-section {
 
     position: relative;
     overflow: hidden;
 }

 .ambient-glow {
     position: absolute;
     width: 300px;
     height: 300px;
     background: radial-gradient(circle, rgba(185, 28, 28, 0.05) 0%, rgba(249, 249, 249, 0) 70%);
     top: 5%;
     right: 5%;
     z-index: 0;
     pointer-events: none;
 }

 .criteria-container {
     background: white;
     backdrop-filter: blur(20px);
     -webkit-backdrop-filter: blur(20px);
     border: 1px solid rgba(255, 255, 255, 0.5);
     border-radius: 24px;

     box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
     position: relative;
     z-index: 1;
 }

 .category-label {
     font-size: 10px;
     letter-spacing: 5px;
     text-transform: uppercase;
     color: var(--accent-gold);
     font-weight: 700;
     margin-bottom: 20px;
     display: block;
 }

 .main-title {
     font-family: 'Playfair Display', serif;
     font-size: clamp(2rem, 5vw, 4.5rem);
     line-height: 1;
     margin-bottom: 20px;
     color: var(--primary-dark);
     font-weight: 900;
 }

 .main-title span {
     color: #c1121f;
     font-style: italic;
     font-weight: 700;
 }

 .description {
     font-size: 1.2rem;
     line-height: 1.5;
     color: #475569;
     font-weight: 300;
 }

 .status-pane {
     background: #ffffff;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     padding: 30px;
     text-align: center;
     position: relative;
 }

 .seal-wrapper {
     position: relative;
     width: 150px;
     height: 150px;
     margin-bottom: 25px;
 }

 .seal-border {
     position: absolute;
     inset: 0;
     border: 1px dashed var(--accent-gold);
     border-radius: 50%;
     animation: rotate 20s linear infinite;
 }

 .seal-content {
     position: absolute;
     inset: 15px;

     background: #c1121f;
     border-radius: 50%;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     color: #fff;
     box-shadow: 0 15px 35px rgba(15, 23, 42, 0.2);
 }

 .seal-content i {
     font-size: 1.8rem;
     margin-bottom: 8px;
     color: var(--accent-gold);
 }

 .norm-text {
     font-size: 10px;
     letter-spacing: 2px;
     font-weight: 700;
     text-transform: uppercase;
 }

 .cbse-text {
     font-family: 'Playfair Display', serif;
     font-size: 1rem;
     font-weight: 700;
 }

 .status-footer {
     font-size: 1.0rem;
     color: #94a3b8;
     margin-top: 15px;
     font-style: italic;
 }

 @keyframes rotate {
     from {
         transform: rotate(0deg);
     }

     to {
         transform: rotate(360deg);
     }
 }

 .vertical-watermark {
     position: absolute;
     right: -40px;
     top: 50%;
     transform: translateY(-50%) rotate(90deg);
     font-size: 60px;
     font-weight: 900;
     color: rgba(0, 0, 0, 0.03);
     pointer-events: none;
     font-family: 'Playfair Display', serif;
 }

 @media (max-width: 992px) {
     .vertical-watermark {
         display: none;
     }

     .main-title {
         font-size: 2.5rem;
     }

     .description {
         font-size: 0.95rem;
     }

     .seal-wrapper {
         width: 130px;
         height: 130px;
     }
 }

 @media (max-width: 576px) {
     .main-title {
         font-size: 2rem;
     }

     .description {
         font-size: 0.9rem;
     }

     .seal-wrapper {
         width: 110px;
         height: 110px;
     }
 }




 :root {
     --bg-base: #f9f9f9;
     --primary: #0f172a;
     --accent: #c0a080;
 }

 .page-wrapper {
   
     color: var(--primary);
     margin: 0;

     display: flex;
     align-items: center;
     justify-content: center;
     overflow-x: hidden;
     box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
 }

 .serif {
     font-family: 'Playfair Display', serif;
 }


 .ambient-orb {
     position: fixed;
     border-radius: 50%;
     filter: blur(100px);
     z-index: -1;
     opacity: 0.4;
     animation: pulse 10s alternate infinite ease-in-out;
 }

 .orb-1 {
     width: 50vw;
     height: 50vw;
     background: rgba(192, 160, 128, 0.3);
     top: -10%;
     left: -10%;
 }

 .orb-2 {
     width: 40vw;
     height: 40vw;
     background: rgba(15, 23, 42, 0.15);
     bottom: -10%;
     right: -10%;
     animation-delay: -5s;
 }

 @keyframes pulse {
     0% {
         transform: scale(1) translate(0, 0);
     }

     100% {
         transform: scale(1.2) translate(5%, 5%);
     }
 }


 .glass-wrapper {
     background: rgba(255, 255, 255, 0.6);
     backdrop-filter: blur(24px);
     -webkit-backdrop-filter: blur(24px);
     border: 1px solid rgba(255, 255, 255, 0.8);
     box-shadow: 0 40px 100px -20px rgba(15, 23, 42, 0.1);
     border-radius: 2.5rem;
     overflow: hidden;
     width: 100%;
     max-width: 1200px;
     position: relative;
 }

 
 .abstract-bullet {
     width: 8px;
     height: 8px;
     background-color:#ffb703;
     border-radius: 50%;
     display: inline-block;
     margin-right: 1.5rem;
     flex-shrink: 0;
     position: relative;
     box-shadow: 0 0 10px rgba(192, 160, 128, 0.5);
 }

 .abstract-bullet::after {
     content: '';
     position: absolute;
     top: -4px;
     left: -4px;
     right: -4px;
     bottom: -4px;
     border: 1px solid #ffb703;
     border-radius: 50%;
     opacity: 0;
     transition: all 0.3s ease;
 }

 .list-item:hover .abstract-bullet::after {
     opacity: 1;
     transform: scale(1.5);
 }


 .list-item {
     transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
     border-left: 2px solid transparent; 
     position: relative;
 }

 .list-item::before {
     content: '';
     position: absolute;
     left: -2px;
     top: 0;
     height: 100%;
     width: 2px;
     background: var(--accent);
     transform: scaleY(0);
     transform-origin: top;
     transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
 }

 .list-group:hover .list-item {
     opacity: 0.4;
 }

 .list-group .list-item:hover {
     opacity: 1;
     transform: translateX(10px);
     background: rgba(255, 255, 255, 0.5);
   
 }

 .list-group .list-item:hover::before {
     transform: scaleY(1);
 }

 .reveal {
     opacity: 0;
     transform: translateY(30px);
     animation: fadeInUp 1.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
 }

 @keyframes fadeInUp {
     to {
         opacity: 1;
         transform: translateY(0);
     }
 }

 */



 /* =========================================================
   ⑤ DOCUMENTS & ⑥ AGE
   ========================================================= */

 :root {
     --red: #c1121f;
     --gold: #ffb703;
     --dark: #0d0d14;
     --ink: #1c1c2e;
     --text: #2a2a3a;
     --muted: #6b7280;
     --light: #f8f7f4;
     --border: #e8e4de;
     --grad: linear-gradient(135deg, #c1121f 0%, #e85d04 55%, #ffb703 100%);
     --grad-soft: linear-gradient(135deg, rgba(193, 18, 31, .07) 0%, rgba(255, 183, 3, .07) 100%);
     --shadow: 0 4px 30px rgba(0, 0, 0, .07);
     --shadow-lg: 0 20px 70px rgba(0, 0, 0, .11);
     --hover-up: 0 28px 80px rgba(193, 18, 31, .13);
     --r: 18px;
     --r-lg: 26px;
 }

 /* Age card */
 .age-card {
     background: #fff;
     border-radius: var(--r-lg);
     box-shadow: var(--shadow);
     border: 1px solid var(--border);
     overflow: hidden;
 }

 .age-header {
     /* padding: 28px 32px;
            background: linear-gradient(135deg, #fff8e1, #fff3e0);
            border-bottom: 1px solid rgba(255, 183, 3, .3); */
     background: var(--grad);
     padding: 28px 32px;
     color: #fff;
 }

 .age-table-wrap {
     padding: 0 32px 8px
 }

 .age-table {
     width: 100%;
     border-collapse: collapse;
     font-size: .87rem
 }

 .age-table th {
     padding: 12px 14px;
     font-weight: 700;
     font-size: .75rem;
     text-transform: uppercase;
     letter-spacing: .8px;
     color: var(--red);
     border-bottom: 2px solid rgba(193, 18, 31, .12);
 }

 .age-table td {
     padding: 13px 14px;
     color: var(--text);
     border-bottom: 1px solid var(--border)
 }

 .age-table tr:last-child td {
     border-bottom: none
 }

 .age-table tr:hover td {
     background: rgba(193, 18, 31, .03)
 }

 /* Fee card */
 .fee-card {
     background: #fff;
     border-radius: var(--r-lg);
     box-shadow: var(--shadow);
     border: 1px solid var(--border);
     overflow: hidden;
     position: relative;
 }

 .fee-card-header {
     background: var(--grad);
     padding: 28px 32px;
     color: #fff;
     position: relative;
     overflow: hidden;
 }

 .fee-card-header::after {
     content: '₹';
     position: absolute;
     right: -10px;
     top: -15px;
     font-size: 7rem;
     font-family: 'Cormorant Garamond', serif;
     font-weight: 700;
     color: rgba(255, 255, 255, .06);
 }

 .fee-card-header h3 {
     font-family: 'DM Sans', sans-serif;
     font-size: 1.3rem;
     font-weight: 700;
     margin: 0
 }

 .fee-card-header p {
     font-size: .82rem;
     opacity: .7;
     color: white;
     margin: 4px 0 0
 }

 .fee-row {
     display: flex;
     align-items: center;
     gap: 14px;
     padding: 16px 32px;
     border-bottom: 1px solid var(--border);
     font-size: .9rem;
     color: var(--text);
 }

 .fee-row:last-child {
     border-bottom: none
 }

 .fee-row i {
     color: var(--gold);
     font-size: 1.05rem;
     flex-shrink: 0
 }

 .fee-row span strong {
     color: var(--ink)
 }


 /* Section Background */
 /* .bn-transport-section {
    background: linear-gradient(to right, #f8f9fa, #ffffff);
    position: relative;
    overflow: hidden;
} */

 /* Title Styling */

 /* 

 .bn-transport-content p {
     color: #555;
     line-height: 1.8;
 }


 .bn-transport-features {
     display: flex;
     flex-direction: column;
     gap: 10px;
 }

 .bn-feature-item {
     background: #ffffff;
     padding: 10px 15px;
     border-radius: 8px;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
     font-size: 0.95rem;
     transition: all 0.3s ease;
 }

 .bn-feature-item:hover {
     transform: translateX(5px);
     box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
 }


 .bn-transport-image-wrapper {
     position: relative;
 }

 .bn-transport-img {
     border-radius: 15px;
     box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
     transition: transform 0.5s ease;
 }

 .bn-transport-img:hover {
     transform: scale(1.03);
 }


 .bn-floating-card {
     position: absolute;
     bottom: 20px;
     left: -30px;
     background: rgba(255, 255, 255, 0.85);
     backdrop-filter: blur(10px);
     padding: 20px;
     border-radius: 15px;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
     max-width: 250px;
     animation: floatCard 3s ease-in-out infinite;
 }

 .bn-floating-card h5 {
     font-weight: 600;
     margin-bottom: 5px;
 }

 @keyframes floatCard {
     0% {
         transform: translateY(0);
     }

     50% {
         transform: translateY(-8px);
     }

     100% {
         transform: translateY(0);
     }
 }

 
 @media (max-width: 991px) {
     .bn-floating-card {
         left: 20px;
         bottom: -20px;
     }
 } */
 /* =========================================================
   ⑧ TRANSPORT
   ========================================================= */


 .transport-dual {
     display: grid;
     grid-template-columns: 1fr 1fr;
     grid-template-rows: 280px 200px;
     gap: 14px;
     border-radius: var(--r-lg);
     overflow: hidden;
 }

 .transport-dual img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: transform .55s ease, filter .5s;
     filter: brightness(.95);
 }

 .transport-dual img:hover {
     transform: scale(1.05);
     filter: brightness(1.02)
 }

 .transport-dual .td-main {
     grid-row: span 2
 }

 .transport-stat-pill {
     display: inline-flex;
     flex-direction: column;
     align-items: center;
     background: var(--grad-soft);
     border: 1px solid rgba(193, 18, 31, .12);
     border-radius: 14px;
     padding: 18px 26px;
     min-width: 100px;
 }

 .transport-stat-pill .ts-n {
     font-family: 'Cormorant Garamond', serif;
     font-size: 2.4rem;
     font-weight: 700;
     line-height: 1;
     background: var(--grad);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
 }

 .transport-stat-pill .ts-l {
     font-size: .7rem;
     text-transform: uppercase;
     letter-spacing: 1.2px;
     color: var(--muted);
     margin-top: 4px;
 }

 .transport-list {
     list-style: none;
     padding: 0;
     margin: 0
 }

 .transport-list li {
     display: flex;
     align-items: flex-start;
     gap: 12px;
     padding: 12px 0;
     border-bottom: 1px solid var(--border);
     font-size: .9rem;
     color: var(--text);
 }

 .transport-list li:last-child {
     border-bottom: none
 }

 .transport-list li i {
     color: var(--red);
     font-size: 1rem;
     margin-top: 3px;
     flex-shrink: 0
 }


 /* ─── CSS Variables ─── */
 :root {
     --crimson: #c1121f;
     --gold: #ffb703;
     --crimson-dark: #8b0d16;
     --gold-dark: #e09e00;
     --white: #ffffff;
     --off-white: #fdf8f0;
     --text-dark: #1a1a2e;
     --text-mid: #3d3d5c;
     --text-light: #7a7a99;
     --grad-main: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     --grad-subtle: linear-gradient(135deg, rgba(193, 18, 31, 0.08) 0%, rgba(255, 183, 3, 0.08) 100%);
     --shadow-lift: 0 24px 64px rgba(193, 18, 31, 0.14), 0 8px 24px rgba(0, 0, 0, 0.08);
     --shadow-card: 0 8px 40px rgba(193, 18, 31, 0.08), 0 2px 12px rgba(0, 0, 0, 0.06);
     --radius-card: 24px;
 }

 /* ─── Global Reset ─── */
 /* *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } */

 /* body { font-family: 'Poppins', sans-serif; background: var(--off-white); color: var(--text-dark); overflow-x: hidden; } */

 /* ─── Section Wrapper ─── */
 /* .bn-msg-section {
  position: relative;
  padding: 110px 0 120px; 
  background: var(--off-white); 
  overflow: hidden;
} */

 /* ─── Background Decorations ─── */
 .bn-bg-orb {
     position: absolute;
     border-radius: 50%;
     filter: blur(80px);
     pointer-events: none;
     z-index: 0;
 }

 .bn-bg-orb--1 {
     width: 600px;
     height: 600px;
     top: -180px;
     left: -160px;
     background: radial-gradient(circle, rgba(193, 18, 31, 0.10) 0%, transparent 70%);
 }

 .bn-bg-orb--2 {
     width: 500px;
     height: 500px;
     bottom: -120px;
     right: -120px;
     background: radial-gradient(circle, rgba(255, 183, 3, 0.12) 0%, transparent 70%);
 }

 .bn-bg-orb--3 {
     width: 300px;
     height: 300px;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     background: radial-gradient(circle, rgba(193, 18, 31, 0.04) 0%, transparent 70%);
 }

 .bn-bg-pattern {
     position: absolute;
     inset: 0;
     background-image:
         radial-gradient(circle, rgba(193, 18, 31, 0.06) 1px, transparent 1px);
     background-size: 44px 44px;
     z-index: 0;
     pointer-events: none;
 }

 /* ─── Section Header ─── */
 .bn-section-header {
     position: relative;
     z-index: 2;
     text-align: center;
     margin-bottom: 72px;
 }

 .bn-eyebrow {
     display: inline-block;
     font-family: 'Poppins', sans-serif;
     font-size: 0.72rem;
     font-weight: 600;
     letter-spacing: 0.28em;
     text-transform: uppercase;
     background: var(--grad-main);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     margin-bottom: 16px;
     position: relative;
 }

 .bn-eyebrow::before,
 .bn-eyebrow::after {
     content: '';
     display: inline-block;
     width: 28px;
     height: 1px;
     background: var(--grad-main);
     vertical-align: middle;
     margin: 0 10px;
     opacity: 0.7;
 }

 .bn-section-title {
     font-family: 'Playfair Display', serif;
     font-size: clamp(2rem, 4.5vw, 3.2rem);
     font-weight: 900;
     color: var(--text-dark);
     line-height: 1.15;
     margin-bottom: 18px;
 }

 .bn-section-title span {
     background: var(--grad-main);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
 }

 .bn-title-line {
     display: block;
     width: 64px;
     height: 4px;
     border-radius: 4px;
     background: var(--grad-main);
     margin: 0 auto;
     position: relative;
     overflow: hidden;
 }

 .bn-title-line::after {
     content: '';
     position: absolute;
     top: 0;
     left: -100%;
     width: 100%;
     height: 100%;
     background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.8), transparent);
     animation: shimmerLine 2.4s ease-in-out infinite;
 }

 @keyframes shimmerLine {
     0% {
         left: -100%;
     }

     100% {
         left: 200%;
     }
 }

 .bn-section-subtitle {
     font-size: 0.95rem;
     color: var(--text-light);
     margin-top: 14px;
     font-weight: 400;
     letter-spacing: 0.02em;
 }

 /* ─── Philosophy Pills (top) ─── */
 .bn-philosophy-pills {
     display: flex;
     gap: 10px;
     flex-wrap: wrap;
     justify-content: center;
     margin-top: 24px;
 }

 .bn-pill {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     padding: 6px 18px;
     border-radius: 50px;
     font-size: 0.75rem;
     font-weight: 600;
     letter-spacing: 0.06em;
     text-transform: uppercase;
     border: 1.5px solid transparent;
     background: linear-gradient(var(--off-white), var(--off-white)) padding-box,
         var(--grad-main) border-box;
     color: var(--crimson);
     transition: all 0.3s ease;
     cursor: default;
 }

 .bn-pill:hover {
     background: var(--grad-main);
     color: #fff;
     transform: translateY(-2px);
     box-shadow: 0 8px 20px rgba(193, 18, 31, 0.2);
 }

 .bn-pill-dot {
     width: 6px;
     height: 6px;
     border-radius: 50%;
     background: var(--grad-main);
     transition: background 0.3s;
 }

 .bn-pill:hover .bn-pill-dot {
     background: rgba(255, 255, 255, 0.8);
 }

 /* ─── Cards Row ─── */
 .bn-cards-row {
     position: relative;
     z-index: 2;
 }

 /* ─── Message Card ─── */
 .bn-msg-card {
     position: relative;
     background: #fff;
     border-radius: var(--radius-card);
     padding: 0;
     box-shadow: var(--shadow-card);
     overflow: hidden;
     transition: transform 0.45s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.45s ease;
     height: 100%;
 }

 .bn-msg-card:hover {
     transform: translateY(-10px) scale(1.012);
     box-shadow: var(--shadow-lift);
 }

 /* Animated gradient border */
 .bn-msg-card::before {
     content: '';
     position: absolute;
     inset: 0;
     border-radius: var(--radius-card);
     padding: 2px;
     background: var(--grad-main);
     -webkit-mask: linear-gradient(#fff 0 0) content-box,
         linear-gradient(#fff 0 0);
     -webkit-mask-composite: xor;
     mask-composite: exclude;
     opacity: 0;
     transition: opacity 0.4s ease;
     pointer-events: none;
     z-index: 1;
 }

 .bn-msg-card:hover::before {
     opacity: 1;
 }

 /* Card top accent bar */
 .bn-card-accent {
     height: 5px;
     background: var(--grad-main);
     border-radius: var(--radius-card) var(--radius-card) 0 0;
     position: relative;
     overflow: hidden;
 }

 .bn-card-accent::after {
     content: '';
     position: absolute;
     top: 0;
     left: -100%;
     width: 60%;
     height: 100%;
     background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.6), transparent);
     animation: shimmerAccent 3s ease-in-out infinite;
 }

 @keyframes shimmerAccent {
     0% {
         left: -60%;
     }

     100% {
         left: 160%;
     }
 }

 /* Card body inner */
 .bn-card-body {
     padding: 44px 40px 40px;
     position: relative;
 }

 /* Floating decorative shape inside card */
 .bn-card-deco {
     position: absolute;
     top: -20px;
     right: -20px;
     width: 160px;
     height: 160px;
     border-radius: 50%;
     background: var(--grad-subtle);
     pointer-events: none;
     z-index: 0;
     transition: transform 0.5s ease;
 }

 .bn-msg-card:hover .bn-card-deco {
     transform: scale(1.25) translate(6px, -6px);
 }

 /* ─── Avatar ─── */
 .bn-avatar-wrap {
     position: relative;
     display: inline-block;
     margin-bottom: 24px;
     z-index: 1;
 }

 .bn-avatar {
     width: 84px;
     height: 84px;
     border-radius: 50%;
     background: var(--grad-main);
     display: flex;
     align-items: center;
     justify-content: center;
     font-family: 'Playfair Display', serif;
     font-size: 1.7rem;
     font-weight: 900;
     color: #fff;
     letter-spacing: 0.04em;
     position: relative;
     z-index: 2;
     box-shadow: 0 8px 28px rgba(193, 18, 31, 0.32);
     transition: box-shadow 0.4s ease, transform 0.4s ease;
 }

 .bn-msg-card:hover .bn-avatar {
     transform: scale(1.07);
     box-shadow: 0 12px 36px rgba(193, 18, 31, 0.45);
 }

 /* Rotating ring */
 .bn-avatar-ring {
     position: absolute;
     inset: -6px;
     border-radius: 50%;
     border: 2px solid transparent;
     background: conic-gradient(var(--crimson) 0deg, var(--gold) 120deg, transparent 160deg, transparent 360deg) border-box;
     -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
     -webkit-mask-composite: xor;
     mask-composite: exclude;
     animation: ringRotate 3.6s linear infinite paused;
     transition: opacity 0.3s;
     opacity: 0;
     z-index: 1;
 }

 .bn-msg-card:hover .bn-avatar-ring {
     opacity: 1;
     animation-play-state: running;
 }

 @keyframes ringRotate {
     from {
         transform: rotate(0deg);
     }

     to {
         transform: rotate(360deg);
     }
 }

 /* Glow behind avatar */
 .bn-avatar-glow {
     position: absolute;
     inset: -16px;
     border-radius: 50%;
     background: radial-gradient(circle, rgba(255, 183, 3, 0.18) 0%, transparent 70%);
     z-index: 0;
     opacity: 0;
     transition: opacity 0.4s ease;
 }

 .bn-msg-card:hover .bn-avatar-glow {
     opacity: 1;
 }

 /* ─── Name & Designation ─── */
 .bn-person-name {
     font-family: 'Playfair Display', serif;
     font-size: 1.45rem;
     font-weight: 700;
     color: var(--text-dark);
     margin-bottom: 4px;
     position: relative;
     z-index: 1;
 }

 .bn-designation {
     font-size: 0.78rem;
     font-weight: 600;
     letter-spacing: 0.14em;
     text-transform: uppercase;
     background: var(--grad-main);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     margin-bottom: 20px;
     position: relative;
     z-index: 1;
 }

 /* Separator */
 .bn-sep {
     display: flex;
     align-items: center;
     gap: 10px;
     margin-bottom: 24px;
     position: relative;
     z-index: 1;
 }

 .bn-sep-line {
     flex: 1;
     height: 1px;
     background: linear-gradient(90deg, var(--crimson), var(--gold), transparent);
     max-width: 120px;
 }

 .bn-sep-diamond {
     width: 8px;
     height: 8px;
     background: var(--grad-main);
     transform: rotate(45deg);
     border-radius: 1px;
     flex-shrink: 0;
 }

 /* ─── Quote Block ─── */
 .bn-quote-wrap {
     position: relative;
     z-index: 1;
     margin-bottom: 20px;
 }

 .bn-quote-icon {
     font-family: 'Playfair Display', serif;
     font-size: 5.5rem;
     line-height: 0.7;
     background: var(--grad-main);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     display: block;
     margin-bottom: 8px;
     animation: floatQuote 4s ease-in-out infinite;
     opacity: 0.22;
     user-select: none;
 }

 @keyframes floatQuote {

     0%,
     100% {
         transform: translateY(0px);
     }

     50% {
         transform: translateY(-6px);
     }
 }

 .bn-msg-label {
     font-size: 1.3rem;
     font-weight: bold;
     letter-spacing: 0.22em;
     text-transform: uppercase;
     color: var(--text-dark);
     margin-bottom: 10px;
     display: block;
 }

 .bn-msg-text {
     font-size: 0.935rem;
     line-height: 1.82;
     color: var(--text-mid);
     font-weight: 400;
     position: relative;
     z-index: 1;
 }

 /* ─── Philosophy Tags ─── */
 .bn-tag-row {
     display: flex;
     flex-wrap: wrap;
     gap: 8px;
     margin-top: 26px;
     position: relative;
     z-index: 1;
 }

 .bn-tag {
     padding: 5px 14px;
     border-radius: 50px;
     font-size: 0.7rem;
     font-weight: 600;
     letter-spacing: 0.08em;
     text-transform: uppercase;
     transition: all 0.3s ease;
     cursor: default;
 }

 .bn-tag--solid {
     background: var(--grad-main);
     color: #fff;
     box-shadow: 0 4px 14px rgba(193, 18, 31, 0.22);
 }

 .bn-tag--outline {
     background: transparent;
     border: 1.5px solid rgba(193, 18, 31, 0.3);
     color: var(--crimson);
 }

 .bn-tag:hover {
     transform: translateY(-2px) scale(1.05);
     box-shadow: 0 8px 20px rgba(193, 18, 31, 0.24);
 }

 .bn-tag--outline:hover {
     background: var(--grad-main);
     color: #fff;
     border-color: transparent;
 }

 /* ─── CTA Button ─── */
 .bn-cta {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     margin-top: 28px;
     padding: 11px 26px;
     border-radius: 50px;
     font-size: 0.8rem;
     font-weight: 600;
     letter-spacing: 0.08em;
     text-transform: uppercase;
     background: transparent;
     border: 1.5px solid rgba(193, 18, 31, 0.35);
     color: var(--crimson);
     text-decoration: none;
     position: relative;
     z-index: 2;
     overflow: hidden;
     transition: color 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
 }

 .bn-cta::before {
     content: '';
     position: absolute;
     inset: 0;
     background: var(--grad-main);
     transform: scaleX(0);
     transform-origin: left;
     transition: transform 0.35s ease;
     border-radius: 50px;
     z-index: -1;
 }

 .bn-cta:hover {
     color: #fff;
     border-color: transparent;
     box-shadow: 0 8px 24px rgba(193, 18, 31, 0.28);
 }

 .bn-cta:hover::before {
     transform: scaleX(1);
 }

 .bn-cta-arrow {
     display: inline-block;
     transition: transform 0.3s ease;
 }

 .bn-cta:hover .bn-cta-arrow {
     transform: translateX(4px);
 }

 /* ─── Card-specific color variant (alternate gold) ─── */
 .bn-msg-card--alt .bn-card-accent {
     background: linear-gradient(135deg, #ffb703 0%, #c1121f 100%);
 }

 /* ─── Section Divider ─── */
 .bn-divider-top {
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     overflow: hidden;
     line-height: 0;
     pointer-events: none;
 }

 .bn-divider-top svg {
     display: block;
     width: 100%;
 }

 /* ─── Floating badge ─── */
 .bn-float-badge {
     position: absolute;
     top: 28px;
     right: 28px;
     background: var(--grad-main);
     color: #fff;
     font-size: 0.64rem;
     font-weight: 700;
     letter-spacing: 0.1em;
     text-transform: uppercase;
     padding: 5px 12px;
     border-radius: 50px;
     z-index: 3;
     box-shadow: 0 4px 14px rgba(193, 18, 31, 0.3);
 }

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

     /* .bn-msg-section { padding: 80px 0 90px; } */
     .bn-card-body {
         padding: 36px 30px 34px;
     }
 }

 @media (max-width: 767px) {

     /* .bn-msg-section { padding: 60px 0 70px; } */
     .bn-section-header {
         margin-bottom: 52px;
     }

     .bn-card-body {
         padding: 28px 22px 26px;
     }

     .bn-avatar {
         width: 72px;
         height: 72px;
         font-size: 1.4rem;
     }

     .bn-msg-card {
         margin-bottom: 0;
     }

     .bn-float-badge {
         top: 16px;
         right: 16px;
     }
 }

 @media (max-width: 480px) {
     .bn-card-body {
         padding: 24px 18px 22px;
     }

     .bn-person-name {
         font-size: 1.2rem;
     }
 }






 /* 
 :root {
     --bn-primary: #b91c1c;
     --bn-accent: #fbbf24;
     --bn-bg: #f9f9f9;
     --bn-dark: #0f172a;
     --bn-border: rgba(0, 0, 0, 0.06);
     --bn-transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
 }



 .bn-aca-wrapper {

     font-family: 'Inter', sans-serif;
 }

 
  .bn-aca-header {
     margin-bottom: 100px;
     border-left: 1px solid var(--bn-border);
     padding-left: 40px;
 }

 .bn-aca-subtitle {
     font-size: 0.75rem;
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 0.4em;
     color: var(--bn-primary);
     display: block;
     margin-bottom: 20px;
 }

 .bn-aca-title {
     font-family: 'Crimson Pro', serif;
     font-size: clamp(3rem, 6vw, 4.5rem);
     font-weight: 800;
     line-height: 0.95;
     letter-spacing: -3px;
     color: var(--bn-dark);
 }

 .bn-aca-main-split {
     display: grid;
     grid-template-columns: 5fr 7fr;
     gap: 80px;
     align-items: start;
 }


 .bn-aca-sticky-pane {
     position: sticky;
     top: 100px;
 }

 .bn-aca-scope-card {
     background: #ffffff;
     padding: 50px;
     border: 1px solid var(--bn-border);
     position: relative;
 }

 .bn-aca-scope-card::before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 4px;
     background: linear-gradient(90deg, var(--bn-primary), var(--bn-accent));
 }

 .bn-aca-scope-label {
     font-size: 0.8rem;
     font-weight: 600;
     text-transform: uppercase;
     color: var(--bn-primary);
     margin-bottom: 15px;
     display: block;
 }

 .bn-aca-scope-val {
     font-family: 'Crimson Pro', serif;
     font-size: 2.5rem;
     font-weight: 700;
     margin-bottom: 40px;
     line-height: 1.1;
 }

 .bn-aca-stream-list {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .bn-aca-stream-item {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 20px 0;
     border-top: 1px solid #f1f5f9;
     font-weight: 600;
     font-size: 0.9rem;
     color: var(--bn-dark);
     transition: var(--bn-transition);
 }

 .bn-aca-stream-item:hover {
     color: var(--bn-primary);
     padding-left: 10px;
 }

 .bn-aca-stream-item i {
     font-size: 0.7rem;
     color: var(--bn-accent);
 }


 .bn-aca-pillars-list {
     display: flex;
     flex-direction: column;
     gap: 20px;
 }

 .bn-aca-pillar-sheet {
     background: #ffffff;
     padding: 25px 25px;
     border: 1px solid var(--bn-border);
     display: grid;
     grid-template-columns: 80px 1fr;
     gap: 40px;
     transition: var(--bn-transition);
     position: relative;
     overflow: hidden;
 }

 .bn-aca-pillar-sheet::after {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 0;
     height: 100%;
     background-color: var(--bn-primary);
     transition: var(--bn-transition);
     z-index: 1;
     opacity: 0.02;
 }

 .bn-aca-pillar-sheet:hover {
     transform: scale(1.02);
     border-color: var(--bn-primary);
     box-shadow: 0 30px 60px -20px rgba(0, 0, 0, 0.08);
 }

 .bn-aca-pillar-sheet:hover::after {
     width: 100%;
 }

 .bn-aca-num {
     font-family: 'Crimson Pro', serif;
     font-size: 3.5rem;
     font-weight: 800;
     line-height: 1;
     color: #e2e8f0;
     transition: var(--bn-transition);
     position: relative;
     z-index: 2;
 }

 .bn-aca-pillar-sheet:hover .bn-aca-num {
     color: var(--bn-primary);
     transform: translateY(-5px);
 }

 .bn-aca-pillar-content {
     position: relative;
     z-index: 2;
 }

 .bn-aca-pillar-title {
     font-family: 'Crimson Pro', serif;
     font-size: 1.8rem;
     font-weight: 700;
     margin-bottom: 15px;
     color: var(--bn-dark);
 }

 .bn-aca-pillar-desc {
     font-size: 1rem;
     line-height: 1.7;
     color: #64748b;
     margin: 0;
     max-width: 90%;
 }


 .bn-aca-footer {
     margin-top: 40px;

     border-top: 1px solid var(--bn-border);
     text-align: center;
 }

 .bn-aca-quote {
     font-family: 'Crimson Pro', serif;
     font-size: clamp(2rem, 4vw, 2rem);
     font-style: italic;
     font-weight: 500;
     line-height: 1.3;
     max-width: 1100px;
     margin: 0 auto;

     color: white;
     padding: 30px;
     border-radius: 25px;
     position: relative;
     background: linear-gradient(90deg, var(--bn-primary), var(--bn-accent));
 }

 .bn-aca-quote strong {
     font-weight: bolder;
     
     font-style: normal;

 }

 .bn-aca-quote::before {
     content: "“";
     position: absolute;
     top: -60px;
     left: 50%;
     transform: translateX(-50%);
     font-size: 10rem;
     color: var(--bn-accent);
     opacity: 0.15;
     font-family: serif;
 }


 @media (max-width: 991px) {
     .bn-aca-main-split {
         grid-template-columns: 1fr;
         gap: 40px;
     }

     .bn-aca-sticky-pane {
         position: relative;
         top: 0;
     }

     .bn-aca-pillar-sheet {
         padding: 40px;
         grid-template-columns: 60px 1fr;
         gap: 20px;
     }

     .bn-aca-num {
         font-size: 2.5rem;
     }

     .bn-aca-title {
         font-size: 3.5rem;
     }
 } */

 /* @media (max-width: 767px) {
     .bn-aca-wrapper {
         
     }

     .bn-aca-pillar-sheet {
         grid-template-columns: 1fr;
     }

     .bn-aca-num {
         margin-bottom: 10px;
     }

     .bn-aca-header {
         padding-left: 20px;
     }

     .bn-aca-title {
         font-size: 2.8rem;
         letter-spacing: -1px;
     }
 } */

 :root {

     --text-main: #2c3e50;
     --text-muted: #546e7a;
     --bg-light: #f9f9f9;
     /* User preference matching */
     --white: #ffffff;
     --transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
 }

 /* body {
            font-family: 'Inter', sans-serif;
            background-color: var(--bg-light);
            color: var(--text-main);
            overflow-x: hidden;
        }

        h1,
        h2,
        h3,
        .font-heading {
            font-family: 'Outfit', sans-serif;
            font-weight: 700;
        } */

 #academics {
     /* padding: 100px 0; */
     position: relative;
 }

 /* Section Header */
 .section-tag {
     display: inline-block;
     padding: 6px 16px;
     background: rgba(26, 35, 126, 0.08);
     color: var(--primary-blue);
     font-weight: 600;
     font-size: 0.85rem;
     text-transform: uppercase;
     letter-spacing: 2px;
     border-radius: 50px;
     margin-bottom: 1.2rem;
 }

 .aca-main-heading {
     font-size: 1.45rem;
     color: #c1121f;
     margin-bottom: 2.0rem;
     line-height: 1.3;
 }

 .description-text {
     font-size: 1.1rem;
     line-height: 1.8;
     color: var(--text-muted);
     margin-bottom: 2.5rem;
 }

 /* Image Side (Left) */
 .academic-visuals {
     display: flex;
     flex-direction: column;
     gap: 20px;
 }

 .img-wrapper {
     position: relative;
     border-radius: 24px;
     overflow: hidden;
     box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
     transition: var(--transition);
 }

 .img-wrapper img {
     width: 100%;
     height: 320px;
     object-fit: cover;
     transition: transform 0.8s ease;
 }

 .img-wrapper:hover {
     transform: translateY(-10px);
 }

 .img-wrapper:hover img {
     transform: scale(1.05);
 }

 /* Content Side (Right) */
 .academic-features-grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 15px;
 }

 .feature-item {
     display: flex;
     align-items: center;
     background: var(--white);
     padding: 1.2rem;
     border-radius: 16px;
     border: 1px solid rgba(0, 0, 0, 0.03);
     box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);
     transition: var(--transition);
 }

 .feature-item:hover {
     background: var(--white);
     border-color: #c10f12;
     box-shadow: 0 10px 25px rgba(26, 35, 126, 0.08);
 }

 .feature-icon {
     width: 40px;
     height: 40px;
     /* background: rgba(98, 0, 234, 0.05);  */
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100% 100%);
     color: white;
     border-radius: 10px;
     display: flex;
     align-items: center;
     justify-content: center;
     margin-right: 12px;
     font-size: 1.2rem;
 }

 .feature-label {
     font-weight: 600;
     font-size: 0.95rem;
     margin: 0;
     color: var(--text-main);
 }

 .closing-box-premium {
     margin-top: 3rem;
     padding: 1.5rem;
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100% 100%);
     color: var(--white);
     border-radius: 20px;
     position: relative;
     overflow: hidden;
 }

 .closing-box-premium::before {
     content: "\F10D";
     /* Quote icon */
     font-family: "bootstrap-icons";
     position: absolute;
     top: -10px;
     right: 20px;
     font-size: 5rem;
     opacity: 0.1;
 }

 .closing-box-premium p {
     font-size: 1.2rem;
     font-weight: 700;
     line-height: 1.6;
     margin: 0;
     font-style: italic;
 }

 /* Responsive */
 @media (max-width: 991px) {
     .main-heading {
         font-size: 2.5rem;
     }

     .academic-visuals {
         margin-bottom: 50px;
     }

     .img-wrapper img {
         height: 250px;
     }
 }

 @media (max-width: 576px) {
     .academic-features-grid {
         grid-template-columns: 1fr;
     }

     .main-heading {
         font-size: 2rem;
         text-align: center;
     }

     .section-tag,
     .description-text {
         text-align: center;
         display: block;
         margin-left: auto;
         margin-right: auto;
     }

     #academics {
         /* padding: 60px 0; */
     }
 }

 /* ===============================
   Contact Section Background
=================================*/
 /* .contact-section {
    background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
    position: relative;
    overflow: hidden;
    color: #fff;
} */

 /* Section Title */
 .section-title {
     font-weight: 700;
     font-size: 2.5rem;
     color: #fff;
 }

 .contact-subtitle {
     opacity: 0.9;
     font-size: 1rem;
 }

 /* ===============================
   Map Styling
=================================*/
 .contact-map-wrapper {
     height: 100%;
     min-height: 420px;
     border-radius: 20px;
     overflow: hidden;
     box-shadow: 0 15px 40px rgba(0, 0, 0, 0.2);
 }

 .contact-map-wrapper iframe {
     width: 100%;
     height: 100%;
     border: 0;
 }

 /* ===============================
   Form Card (Glass Effect)
=================================*/
 .contact-form-card {
     background: rgba(255, 255, 255, 0.95);
     backdrop-filter: blur(10px);
     border-radius: 20px;
     padding: 40px;
     box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2);
     /* border-top: 6px solid #ffb703;  */
 }

 /* Floating Labels */
 .form-floating>.form-control {
     border-radius: 12px;
     border: 1px solid #ddd;
 }

 .form-floating>.form-control:focus {
     border-color: #c1121f;
     box-shadow: 0 0 0 0.2rem rgba(193, 18, 31, 0.2);
 }

 /* ===============================
   Premium Button
=================================*/
 .send-bt {
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     color: #fff;
     padding: 10px 25px;
     border-radius: 50px;
     font-weight: 600;
     border: none;
     font-size: 1.1rem;
     transition: 0.4s ease;
 }

 /* .premium-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.25);
} */

 /* ===============================
   Responsive Improvements
=================================*/
 @media (max-width: 992px) {
     .contact-form-card {
         padding: 30px;
     }

     .section-title {
         font-size: 2rem;
     }
 }




 /* 
.contact-form{
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;

}

.send-btn{
    background: #c1121f;
    color:white;
} */


 .bn-filter-btn {
     border: none;
     background: transparent;
     font-weight: 500;
     padding: 8px 18px;
     margin: 5px;
     border-radius: 30px;
     transition: 0.3s;
     color: #333;
 }

 .bn-filter-btn.active,
 .bn-filter-btn:hover {
     background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     color: #fff;
 }

 .bn-gallery-item {
     overflow: hidden;
     border-radius: 12px;
 }

 .bn-gallery-item img {
     width: 100%;
     height: 260px;
     object-fit: cover;
     transition: 0.5s;
     cursor: pointer;
 }

 .bn-gallery-item:hover img {
     transform: scale(1.08);
 }

 .gallery-item {
     transition: 0.4s ease;
 }

 @media(max-width:768px) {
     h2 {
         font-size: 28px;
     }
 }





 /* =========================================================
   ④ ADMISSION PROCEDURE
   ========================================================= */
 :root {
     --red: #c1121f;
     --gold: #ffb703;
     --dark: #0d0d14;
     --ink: #1c1c2e;
     --text: #2a2a3a;
     --muted: #6b7280;
     --light: #f8f7f4;
     --border: #e8e4de;
     --grad: linear-gradient(135deg, #c1121f 0%, #e85d04 55%, #ffb703 100%);
     --grad-soft: linear-gradient(135deg, rgba(193, 18, 31, .07) 0%, rgba(255, 183, 3, .07) 100%);
     --shadow: 0 4px 30px rgba(0, 0, 0, .07);
     --shadow-lg: 0 20px 70px rgba(0, 0, 0, .11);
     --hover-up: 0 28px 80px rgba(193, 18, 31, .13);
     --r: 18px;
     --r-lg: 26px;
 }

 .timeline-wrap {
     position: relative;
     padding: 20px 0
 }

 .timeline-spine {
     position: absolute;
     left: 35px;
     top: 0;
     bottom: 0;
     width: 2px;
     background: linear-gradient(to bottom, var(--red), var(--gold));
     z-index: 0;
 }

 .timeline-step {
     display: flex;
     gap: 28px;
     align-items: flex-start;
     position: relative;
     z-index: 1;
     margin-bottom: 36px;
 }


 .sec .timeline-step::before {
     content: '';
     position: absolute;
     top: 0;
     width: 0px;
     height: 0px;
     background: #ffffff;
     z-index: 1;
 }

 .timeline-step:last-child {
     margin-bottom: 0
 }

 .t-num {
     flex-shrink: 0;
     width: 70px;
     height: 70px;
     border-radius: 50%;
     background: var(--grad);
     color: #fff;
     display: flex;
     align-items: center;
     justify-content: center;
     font-family: 'Cormorant Garamond', serif;
     font-size: 1.6rem;
     font-weight: 700;
     box-shadow: 0 8px 28px rgba(193, 18, 31, .3);
     border: 4px solid #fff;
     transition: transform .3s ease;
     cursor: default;
 }

 .timeline-step:hover .t-num {
     transform: scale(1.1)
 }

 .t-content {
     background: #fff;
     border-radius: var(--r);
     padding: 22px 26px;
     flex: 1;
     box-shadow: var(--shadow);
     border: 1px solid var(--border);
     border-left: 3px solid transparent;
     background-clip: padding-box;
     position: relative;
     transition: all .32s ease;
 }

 .t-content::before {
     content: '';
     position: absolute;
     left: -3px;
     top: 0;
     bottom: 0;
     background: var(--grad);
     border-radius: 3px;
     width: 3px;
     transform: scaleY(0);
     transition: transform .32s ease;
     transform-origin: top;
 }

 .timeline-step:hover .t-content {
     transform: translateX(8px);
     box-shadow: var(--hover-up);
 }

 .timeline-step:hover .t-content::before {
     transform: scaleY(1)
 }

 .t-content h5 {
     font-size: 1rem;
     font-weight: 700;
     margin-bottom: 6px;
     color: var(--ink)
 }

 .t-content p {
     font-size: .85rem;
     color: var(--muted);
     margin: 0
 }

 /* Procedure side image collage */
 .proc-collage {
     position: relative;
     height: 520px;
 }

 .proc-img-a {
     position: absolute;
     top: 0;
     right: 0;
     width: 80%;
     height: 340px;
     border-radius: var(--r-lg);
     overflow: hidden;
     box-shadow: var(--shadow-lg);
 }

 .proc-img-a img {
     width: 100%;
     height: 100%;
     object-fit: cover
 }

 .proc-img-b {
     position: absolute;
     bottom: 0;
     left: 0;
     width: 58%;
     height: 220px;
     border-radius: var(--r);
     overflow: hidden;
     box-shadow: 0 20px 50px rgba(0, 0, 0, .15);
     border: 5px solid #fff;
 }

 .proc-img-b img {
     width: 100%;
     height: 100%;
     object-fit: cover
 }

 .proc-float-stat {
     position: absolute;
     top: 50%;
     right: -12px;
     transform: translateY(-50%);
     background: #fff;
     border-radius: 14px;
     padding: 18px 22px;
     text-align: center;
     box-shadow: 0 12px 40px rgba(0, 0, 0, .14);
     border-top: 3px solid var(--red);
     z-index: 5;
 }

 .proc-float-stat .big {
     font-family: 'Cormorant Garamond', serif;
     font-size: 2.2rem;
     font-weight: 700;
     line-height: 1;
     background: var(--grad);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
 }

 .proc-float-stat .sm {
     font-size: .7rem;
     color: var(--muted);
     letter-spacing: 1px;
     text-transform: uppercase
 }

 @media (max-width:576px) {
     .proc-float-stat {
         position: absolute;
         top: 50%;
         right: -12px;
         transform: translateY(-50%);
         background: #fff;
         border-radius: 14px;
         padding: 18px 22px;
         text-align: center;
         box-shadow: 0 12px 40px rgba(0, 0, 0, .14);
         border-top: 3px solid var(--red);
         z-index: 5;
         display: none;
     }
 }

 :root {
     --school-gradient: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     --deep-red: #c1121f;
     --gold: #ffb703;
     --bg-light: #f9f9f9;
     --text-main: #1a1a1a;
     --text-muted: #555;
 }

 /* body {
            font-family: 'Plus Jakarta Sans', sans-serif;
            background-color: var(--bg-light);
            color: var(--text-main);
        } */

 /* .contact-section {
            padding: 100px 0;
            background-color: #ffffff;
        } */

 .section-header {
     max-width: 700px;
     margin: 0 auto 60px;
 }

 .main-heading {
     font-family: 'Playfair Display', serif;
     font-size: 3rem;
     font-weight: 700;
     color: var(--text-main);
     margin-bottom: 15px;
     position: relative;
 }

 .sub-heading {
     font-size: 1.15rem;
     color: var(--text-muted);
     line-height: 1.6;
 }

 /* Card Styling */
 .contact-card {
     /* background: #ffffff;  */
     /* background: linear-gradient(135deg, #c1121f 30%, #ffb703 100%); */
     /* background: linear-gradient(135deg, #f4978e 30%, #ffe8a1 100%); */
     background: linear-gradient(135deg, #ee3b52 30%, #ffd166 100%);

     border: 1px solid rgba(0, 0, 0, 0.05);
     border-radius: 24px;
     /* padding: 45px 30px;  */
     text-align: center;
     height: 100%;
     transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
     display: flex;
     flex-direction: column;
     align-items: center;
 }

 .contact-card:hover {
     transform: translateY(-10px);
     box-shadow: 0 20px 40px rgba(193, 18, 31, 0.08);
     border-color: rgba(193, 18, 31, 0.1);
 }

 .icon-wrapper {
     width: 80px;
     height: 80px;
     background: white;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 25px;
     transition: all 0.4s ease;
 }

 .contact-card:hover .icon-wrapper {
     background: var(--school-gradient);
     transform: rotateY(360deg);
 }

 .icon-wrapper i {
     font-size: 2rem;
     /* color: var(--deep-red);   */
     transition: all 0.4s ease;
 }

 .contact-card:hover .icon-wrapper i {
     color: #ffffff;
 }

 .card-title {
     font-size: 1.4rem;
     font-weight: 700;
     margin-bottom: 15px;
     color: white !important;
 }

 .card-details {
     font-size: 0.95rem;
     color: white !important;
     line-height: 1.7;
     margin-bottom: 0;
 }

 /* CTA Button */
 .cta-container {
     margin-top: 60px;
 }

 .btn-visit {
     background: var(--school-gradient);
     color: #fff;
     padding: 16px 45px;
     border-radius: 100px;
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 1px;
     text-decoration: none;
     display: inline-block;
     transition: all 0.3s ease;
     box-shadow: 0 10px 20px rgba(193, 18, 31, 0.2);
     border: none;
 }

 .btn-visit:hover {
     transform: scale(1.05);
     box-shadow: 0 15px 30px rgba(193, 18, 31, 0.3);
     color: #fff;
 }

 /* Responsive Tweaks */
 @media (max-width: 991px) {
     .main-heading {
         font-size: 2.5rem;
     }

     .contact-card {
         padding: 35px 20px;
     }
 }

 @media (max-width: 767px) {
     .contact-section {
         /* padding: 70px 0; */
     }

     .main-heading {
         font-size: 2rem;
     }

     .g-4>div {
         margin-bottom: 10px;
     }
 }





 /* =========================================================
   PHILOSOPHY RIBBON
   ========================================================= */
 .phil-ribbon {
     background: var(--grad);
     border-radius: 22px;
     padding: 32px 50px;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 44px;
     flex-wrap: wrap;
     margin: 60px 0 0;
     box-shadow: 0 20px 60px rgba(193, 18, 31, .22);
 }

 .phil-item {
     display: flex;
     flex-direction: column;
     align-items: center;
     color: #fff;
     gap: 6px;
 }

 .phil-item .pi {
     font-size: 1.9rem
 }

 .phil-item .pt {
     font-family: 'Cormorant Garamond', serif;
     font-size: 1.3rem;
     font-weight: 700
 }

 .phil-div {
     width: 1px;
     height: 64px;
     background: rgba(255, 255, 255, .25)
 }


 @media(max-width:576px) {
     .phil-ribbon {
         background: var(--grad);
         border-radius: 15px;
         padding: 5px;
         display: flex;
         align-items: center;
         justify-content: center;
         gap: 14px;
         flex-wrap: wrap;
         margin: 30px 0 0;
         box-shadow: none;
     }

     .phil-item {
         display: flex;
         flex-direction: column;
         align-items: center;
         color: #fff;
         gap: 6px;
     }

     .phil-item .pi {
         font-size: 1.9rem
     }

     .phil-item .pt {
         font-family: 'Cormorant Garamond', serif;
         font-size: 1.3rem;
         font-weight: 700
     }

     .phil-div {
         width: none;
         height: none;
         background: none;
     }
 }


 :root {
     --accent-color: #c1121f;
     --text-dark: #1f2937;
 }

 /* ───────────────────────────── */
 /* Timeline Base */
 /* ───────────────────────────── */
 .bn-vtimeline {
     position: relative;
 }

 /* Vertical Line */
 .bn-vtimeline::before {
     content: '';
     position: absolute;
     left: 7px;
     top: 4px;
     bottom: 4px;
     width: 2px;
     background: linear-gradient(to bottom, var(--accent-color), #f28b91);
 }

 /* Timeline Item */
 .bn-timeline-item {
     position: relative;
     padding-left: 40px;
     margin-bottom: 28px;
 }

 .bn-timeline-item:last-child {
     margin-bottom: 0;
 }

 /* Dot */
 .bn-timeline-item::before {
     content: '';
     position: absolute;
     left: 0;
     top: 6px;
     width: 14px;
     height: 14px;
     border-radius: 50%;
     background: var(--accent-color);
     border: 3px solid #fff;
     box-shadow: 0 0 0 2px var(--accent-color);
     transition: transform 0.2s ease;
 }

 .bn-timeline-item:hover::before {
     transform: scale(1.2);
 }

 /* Card */
 .bn-timeline-card {
     background: #faf8f8;
     border-radius: 12px;
     padding: 16px 20px;
     border-left: 3px solid var(--accent-color);
     transition: all 0.25s ease;
 }

 .bn-timeline-item:hover .bn-timeline-card {
     transform: translateX(6px);
     background: #f7eeee;
 }

 /* Title */
 .bn-timeline-title {
     display: block;
     font-weight: 700;
     color: var(--accent-color);
     text-transform: uppercase;
     font-size: 0.8rem;
     letter-spacing: 1px;
     margin-bottom: 5px;
 }

 /* Text */
 .bn-timeline-text {
     margin: 0;
     font-size: 0.95rem;
     color: var(--text-dark);
     line-height: 1.6;
 }

 /* Improve mobile spacing */
 @media (max-width: 575.98px) {
     .bn-timeline-card {
         padding: 14px 16px;
     }
 }



 :root {
     --bg-white: #ffffff;
     --primary-navy: #1a2a44;
     --accent-yellow: #f1c40f;
     --text-main: #333333;
     --text-light: #666666;
     --border-color: #eeeeee;
     --shadow-card: 0 4px 20px rgba(0, 0, 0, 0.05);
 }



 /* .comm-lab-section {
            padding: 80px 0;
            background-color: var(--bg-white);
        } */

 .header-content h2 {
     font-family: 'Playfair Display', serif;
     font-size: clamp(2rem, 5vw, 2.8rem);
     color: var(--primary-navy);
     margin-bottom: 20px;
 }

 .header-content p {
     font-size: 1.1rem;
     color: var(--text-light);
     font-weight: 300;
     max-width: 800px;
     margin: 0 auto;
 }

 .comm-card {
     background: var(--bg-white);
     padding: 40px 25px;
     border-radius: 16px;
     text-align: center;
     border: 1px solid var(--border-color);
     transition: all 0.3s ease;
     box-shadow: var(--shadow-card);
     height: 100%;
     display: flex;
     flex-direction: column;
     align-items: center;
 }

 .comm-card:hover {
     transform: translateY(-10px);
     /* border-color: var(--accent-yellow); */
     border-color: #ffb703;
 }

 .comm-card .icon-wrapper {
     font-size: 2.5rem;
     /* color: var(--accent-yellow); */
     /* color: #ffb703; */
     /* color: #ff3c00 ;  */
     color: #ff6a00;
     margin-bottom: 20px;
 }

 .comm-card h3 {
     font-size: 1.2rem;
     font-weight: 600;
     color: var(--primary-navy);
     margin-bottom: 12px;
 }

 .comm-card p {
     font-size: 0.95rem;
     color: var(--text-light);
     line-height: 1.5;
     margin-bottom: 0;
 }

 /* Adjustments for Bootstrap grid spacing */
 .g-4-custom {
     --bs-gutter-x: 1.5rem;
     --bs-gutter-y: 1.5rem;
 }




 .bn-hero-video-wrap {
     overflow: hidden;
     border-radius: 20px;
 }

 .bn-hero-video-wrap video {
     height: 420px;
     object-fit: cover;
 }

 @media (max-width: 992px) {
     .bn-hero-video-wrap video {
         height: 300px;
     }
 }

 /* =========================================================
       CSS VARIABLES — B N Public School Brand System
       Theme: Crimson Red → Amber Gold
    ========================================================= */
 :root {
     --bn-deep: #1a0508;
     --bn-navy: #3d0f0f;
     --bn-primary: #c1121f;
     --bn-amber: #ffb703;
     --bn-primary-soft: #fde8ea;
     --bn-amber-soft: #fff8e1;
     --bn-grad: linear-gradient(135deg, #c1121f 30%, #ffb703 100%);
     --bn-grad-rev: linear-gradient(135deg, #ffb703 0%, #c1121f 100%);
     --bn-white: #ffffff;
     --bn-off: #fdf6f6;
     --bn-muted: #7a5a5a;
     --bn-text: #2a0a0a;
     --bn-border: rgba(193, 18, 31, .09);
     --bn-shadow-sm: 0 4px 18px rgba(193, 18, 31, .07);
     --bn-shadow-md: 0 12px 40px rgba(193, 18, 31, .13);
     --bn-shadow-lg: 0 24px 64px rgba(193, 18, 31, .18);
     --bn-radius: 18px;
     --ff-display: 'Playfair Display', serif;
     --ff-body: 'DM Sans', sans-serif;
     --transition: all .35s cubic-bezier(.4, 0, .2, 1);
 }

 /* =========================================================
       SECTION WRAPPER
    ========================================================= */
 .bn-home-admission-section {
     background: white; 
     position: relative;
     overflow: hidden;
     /* padding: 100px 0 110px;  */
     font-family: var(--ff-body);
 }

 

 /* =========================================================
       BADGE
    ========================================================= */
 .bn-badge {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     background: linear-gradient(135deg, var(--bn-amber-soft) 0%, #fff3cc 100%);
     border: 1.5px solid rgba(255, 183, 3, .4);
     color: #9a6200;
     font-family: var(--ff-body);
     font-size: 0.78rem;
     font-weight: 600;
     letter-spacing: .12em;
     text-transform: uppercase;
     padding: 6px 16px;
     border-radius: 50px;
     margin-bottom: 22px;
 }

 .bn-badge .pulse-dot {
     width: 7px;
     height: 7px;
     border-radius: 50%;
     background: var(--bn-primary);
     animation: pulse-dot 1.6s ease-in-out infinite;
 }

 @keyframes pulse-dot {

     0%,
     100% {
         transform: scale(1);
         opacity: 1;
     }

     50% {
         transform: scale(1.5);
         opacity: .6;
     }
 }

 /* =========================================================
       HEADLINE
    ========================================================= */
 .bn-headline {
     font-family: var(--ff-display);
     font-size: clamp(2.4rem, 5vw, 3.6rem);
     font-weight: 800;
     line-height: 1.1;
     color: var(--bn-deep);
     margin-bottom: 20px;
     letter-spacing: -.01em;
 }

 .bn-headline .gradient-word {
     background: var(--bn-grad);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
 }

 /* =========================================================
       LEAD PARAGRAPH
    ========================================================= */
 .bn-lead {
     font-size: 1.05rem;
     font-weight: 400;
     color: var(--bn-muted);
     line-height: 1.75;
     max-width: 500px;
     margin-bottom: 30px;
 }

 /* =========================================================
       BULLET POINTS
    ========================================================= */
 .bn-features {
     list-style: none;
     padding: 0;
     margin: 0 0 38px;
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 12px 20px;
 }

 .bn-features li {
     display: flex;
     align-items: center;
     gap: 10px;
     font-size: 0.92rem;
     font-weight: 500;
     color: var(--bn-text);
 }

 .bn-features li .feat-icon {
     flex-shrink: 0;
     width: 30px;
     height: 30px;
     border-radius: 8px;
     background: linear-gradient(135deg, var(--bn-primary-soft), #fad4d7);
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--bn-primary);
     font-size: .85rem;
 }

 /* =========================================================
       TRUST LINE
    ========================================================= */
 .bn-trust-line {
     font-size: 0.8rem;
     color: var(--bn-muted);
     font-style: italic;
     margin-bottom: 10px;
     letter-spacing: .02em;
 }

 /* =========================================================
       CTA BUTTON
    ========================================================= */
 .bn-cta-btn {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     background: var(--bn-grad);
     color: #fff !important;
     text-decoration: none !important;
     font-family: var(--ff-body);
     font-size: 1rem;
     font-weight: 600;
     letter-spacing: .02em;
     padding: 15px 34px;
     border-radius: 50px;
     border: none;
     box-shadow: 0 8px 28px rgba(193, 18, 31, .35);
     transition: var(--transition);
     position: relative;
     overflow: hidden;
 }

 .bn-cta-btn::before {
     content: '';
     position: absolute;
     inset: 0;
     background: var(--bn-grad-rev);
     opacity: 0;
     transition: var(--transition);
 }

 .bn-cta-btn:hover {
     transform: translateY(-3px);
     box-shadow: 0 14px 38px rgba(193, 18, 31, .45);
     color: #fff !important;
 }

 .bn-cta-btn:hover::before {
     opacity: 1;
 }

 .bn-cta-btn span,
 .bn-cta-btn i {
     position: relative;
     z-index: 1;
 }

 .bn-cta-btn i {
     transition: transform .3s ease;
 }

 .bn-cta-btn:hover i {
     transform: translateX(4px);
 }

 /* =========================================================
       RIGHT WRAPPER
    ========================================================= */
 .bn-right-wrapper {
     position: relative;
     display: flex;
     flex-direction: column;
     gap: 20px;
 }

 /* Main dark card */
 .bn-main-card {
     /* background: linear-gradient(145deg, #2d0a0d 0%, #1a0508 100%); */
     background: var(--bn-grad);
     border-radius: var(--bn-radius);
     padding: 40px 36px;
     /* box-shadow: var(--bn-shadow-lg); */
     position: relative;
     overflow: hidden;
     color: #fff;
 }

 .bn-main-card::before {
     content: '';
     position: absolute;
     top: -60px;
     right: -60px;
     width: 220px;
     height: 220px;
     border-radius: 50%;
     background: rgba(193, 18, 31, .28);
 }

 .bn-main-card::after {
     content: '';
     position: absolute;
     bottom: -40px;
     left: -40px;
     width: 160px;
     height: 160px;
     border-radius: 50%;
     background: rgba(255, 183, 3, .18);
 }

 .bn-main-card .card-stripe {
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 4px;
     background: var(--bn-grad);
     border-radius: var(--bn-radius) var(--bn-radius) 0 0;
     z-index: 2;
 }

 .bn-main-card .card-label {
     font-size: 0.72rem;
     font-weight: 600;
     letter-spacing: .14em;
     text-transform: uppercase;
     color: rgba(255, 255, 255, .85);
     margin-bottom: 10px;
     position: relative;
     z-index: 1;
 }

 .bn-main-card .card-title {
     font-family: var(--ff-display);
     font-size: 1.7rem;
     font-weight: 700;
     color: #fff;
     line-height: 1.25;
     margin-bottom: 6px;
     position: relative;
     z-index: 1;
 }

 .bn-main-card .card-title span {
     background: white;
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
 }

 .bn-main-card .card-sub {
     font-size: 0.85rem;
     color: rgba(255, 255, 255, .85);
     position: relative;
     z-index: 1;
 }

 .bn-main-card .divider {
     height: 1px;
     background: rgba(255, 255, 255, .1);
     margin: 22px 0;
     position: relative;
     z-index: 1;
 }

 .bn-stat-row {
     display: grid;
     grid-template-columns: 1fr 1fr 1fr;
     gap: 10px;
     position: relative;
     z-index: 1;
 }

 .bn-stat-item {
     text-align: center;
 }

 .bn-stat-item .val {
     font-family: var(--ff-display);
     font-size: 1.6rem;
     font-weight: 700;
     /* color: var(--bn-amber);  */
     color: #ffb703;
     line-height: 1;
 }

 .bn-stat-item .lbl {
     font-size: 0.68rem;
     color: rgba(255, 255, 255, .95);
     margin-top: 4px;
     letter-spacing: .04em;
     text-transform: uppercase;
 }

 /* Floating info cards */
 .bn-float-cards {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 14px;
 }

 .bn-float-card {
     background: var(--bn-white);
     border: 1.5px solid var(--bn-border);
     border-radius: 14px;
     padding: 18px 16px;
     box-shadow: var(--bn-shadow-sm);
     transition: var(--transition);
     display: flex;
     align-items: flex-start;
     gap: 12px;
 }

 .bn-float-card:hover {
     transform: translateY(-4px);
     box-shadow: var(--bn-shadow-md);
     border-color: rgba(193, 18, 31, .22);
 }

 .bn-float-card .fc-icon {
     width: 36px;
     height: 36px;
     border-radius: 10px;
     background: var(--bn-primary-soft);
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--bn-primary);
     font-size: 1rem;
     flex-shrink: 0;
 }

 .bn-float-card .fc-icon.amber {
     /* background: var(--bn-amber-soft);  */
     background: #fff6e3;
     color: #ffb703;
 }

 .bn-float-card .fc-title {
     font-size: 0.82rem;
     font-weight: 600;
     color: var(--bn-deep);
     margin-bottom: 2px;
 }

 .bn-float-card .fc-desc {
     font-size: 0.72rem;
     color: var(--bn-muted);
     line-height: 1.4;
 }

 /* =========================================================
       BOTTOM INFO STRIP
    ========================================================= */
 .bn-info-strip {
     background: var(--bn-white);
     border: 1.5px solid var(--bn-border);
     border-radius: 14px;
     padding: 16px 28px;
     box-shadow: var(--bn-shadow-sm);
     display: flex;
     align-items: center;
     justify-content: space-between;
     flex-wrap: wrap;
     gap: 14px;
     margin-top: 40px;
     position: relative;
     overflow: hidden;
 }

 .bn-info-strip::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 3px;
     background: var(--bn-grad);
 }

 .bn-info-strip .strip-item {
     display: flex;
     align-items: center;
     gap: 10px;
     font-size: 0.85rem;
     color: var(--bn-text);
     font-weight: 500;
 }

 .bn-info-strip .strip-item i {
     color: var(--bn-primary);
     font-size: 1rem;
 }

 .bn-info-strip .strip-divider {
     width: 1px;
     height: 24px;
     background: var(--bn-border);
 }

 /* =========================================================
       EYEBROW
    ========================================================= */
 .bn-section-eyebrow {
     text-align: center;
     margin-bottom: 64px;
 }

 .bn-section-eyebrow .eyebrow-line {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 14px;
     color: var(--bn-muted);
     font-size: 0.78rem;
     font-weight: 600;
     letter-spacing: .12em;
     text-transform: uppercase;
 }

 .bn-section-eyebrow .eyebrow-line::before,
 .bn-section-eyebrow .eyebrow-line::after {
     content: '';
     flex: 1;
     max-width: 80px;
     height: 1px;
     background: var(--bn-border);
 }

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

     /* .bn-home-admission-section { padding: 72px 0 80px; }  */
     .bn-lead {
         max-width: 100%;
     }

     .bn-cta-btn {
         width: 100%;
         justify-content: center;
     }

     .bn-right-wrapper {
         margin-top: 44px;
     }
 }

 @media (max-width: 576px) {
     .bn-features {
         grid-template-columns: 1fr;
     }

     .bn-stat-row {
         grid-template-columns: 1fr 1fr 1fr;
     }

     .bn-info-strip {
         flex-direction: column;
         align-items: flex-start;
         margin-top: 20px;
     }

     .bn-info-strip .strip-divider {
         display: none;
     }
 }


 .fac-para {
    font-weight:100;
    font-family: 'Poppins', sans-serif;
 }