/* ============================================================
   IBS ROHTAK — GLOBAL THEME
   Matches the new homepage design:
   - Headings : Freight Big Light
   - Body     : Lato
   - Buttons  : Roboto
   - Colours  : deep navy (#0a2540) + gold (#c5a55a) + white
   - Rhythm   : white / navy alternating sections
   ============================================================ */

/* ===== 1. INNER PAGE BACKGROUND SEQUENCE (white / navy, same as homepage) ===== */
.about-page {
    background: var(--white);
}

/* every section starts white, every second one becomes the deep navy band */
.about-page > section {
    background-color: var(--white);
}

.about-page > section:nth-of-type(even) {
    background-color: var(--blue-primary);
    color: var(--white);
}

/* The accreditation / membership strip always stays light so the navy CTA below stays distinct */
.about-page > section.about-memberships {
    background-color: var(--white);
    color: var(--dark);
}

/* Sections that contain tables (disclosure) always stay white so the table reads cleanly */
.about-page > section.disclosure-section {
    background-color: var(--white);
    color: var(--dark);
}

/* subtle divider between two consecutive white table sections */
.about-page > section.disclosure-section + section.disclosure-section {
    border-top: 1px solid #e6eaef;
}

/* The visit / CTA band is always navy */
.about-page > section.about-journey-cta {
    background-color: var(--blue-primary);
    color: var(--white);
}

/* Hero banner fallback (image sits on top) */
.about-page > section.about-hero {
    background-color: var(--blue-primary);
    color: var(--white);
}

/* ===== 2. TEXT COLOURS ON THE NAVY BANDS ===== */
.about-page > section:nth-of-type(even) .tag-highlight {
    color: var(--yellow);
}

.about-page > section:nth-of-type(even) .tag-text {
    color: var(--white);
}

.about-page > section:nth-of-type(even) .breadcrumb-menu ul li a {
    color: var(--white);
}

.about-page > section:nth-of-type(even) .breadcrumb-menu ul li a:hover {
    color: var(--yellow);
}

.about-page > section:nth-of-type(even) .breadcrumb-menu ul li span {
    color: var(--white-80);
}

.about-page > section:nth-of-type(even) .about-intro-copy p {
    color: var(--white-80);
}

.about-page > section:nth-of-type(even) .about-intro-title {
    color: var(--white);
}

/* --- Section headings (edge / academics / locations / memberships) --- */
.about-page > section:nth-of-type(even) .about-edge-content h2,
.about-page > section:nth-of-type(even) .about-edge-content h4,
.about-page > section:nth-of-type(even) .about-section-heading h2 {
    color: var(--white);
}

/* Table sections stay white, so their headings stay navy */
.about-page > section.disclosure-section h2 {
    color: var(--blue-primary);
}

/* Table header tint in the brand gold instead of the old bluish grey */
.about-page .disclosure-section .table thead th {
    background: #faf7f0;
    color: var(--dark);
    font-family: var(--font-button);
    font-weight: 700;
}

.about-page > section:nth-of-type(even) .about-edge-lead,
.about-page > section:nth-of-type(even) .about-section-heading p {
    color: var(--white-80);
}

.about-page > section:nth-of-type(even) .about-feature-item {
    border-bottom-color: rgba(255, 255, 255, 0.18);
}

.about-page > section:nth-of-type(even) .about-feature-item h3 {
    color: var(--white);
}

.about-page > section:nth-of-type(even) .about-feature-item p {
    color: var(--white-80);
}

/* Keep white cards / image frames readable on the navy bands */
.about-page > section:nth-of-type(even) .about-academic-card,
.about-page > section:nth-of-type(even) .about-edge-image,
.about-page > section:nth-of-type(even) .about-pill-nav,
.about-page > section:nth-of-type(even) .card,
.about-page > section:nth-of-type(even) .form-box,
.about-page > section:nth-of-type(even) .contact-box,
.about-page > section:nth-of-type(even) .right {
    color: var(--dark);
}

.about-page > section:nth-of-type(even) .about-academic-card .about-academic-body h3 {
    color: #141414;
}

.about-page > section:nth-of-type(even) .about-academic-card .about-academic-body p {
    color: #454545;
}

/* --- Downloads / disclosure tables (kept on a white sheet so they stay readable) --- */
.about-page > section:nth-of-type(even) .table {
    --bs-table-bg: #ffffff;
    --bs-table-color: #141414;
    background-color: var(--white);
}

.about-page > section:nth-of-type(even) .table thead th {
    background: #f4f6fb;
    color: var(--dark);
}

.about-page > section:nth-of-type(even) .dl-btn {
    background: var(--yellow);
    color: var(--dark);
}

.about-page > section:nth-of-type(even) .dl-btn:hover {
    background: var(--white);
    color: var(--blue-primary);
}

/* --- Admission process timeline --- */
.about-page > section:nth-of-type(even).admission-process .title {
    color: var(--white);
}

.about-page > section:nth-of-type(even).admission-process .timeline::before {
    background: rgba(255, 255, 255, 0.35);
}

.about-page > section:nth-of-type(even).admission-process .circle {
    background: var(--yellow);
    color: var(--blue-primary);
}

.about-page > section:nth-of-type(even).admission-process .card h3 {
    color: #141414;
}

.about-page > section:nth-of-type(even).admission-process .card p {
    color: #454545;
}

/* --- Enquiry section --- */
.about-page > section:nth-of-type(even).ib-enquiry .left,
.about-page > section:nth-of-type(even).ib-enquiry .left h2 {
    color: var(--white);
}

.about-page > section:nth-of-type(even).ib-enquiry .sub,
.about-page > section:nth-of-type(even).ib-enquiry .features li {
    color: var(--white-80);
}

.about-page > section:nth-of-type(even).ib-enquiry .right h3,
.about-page > section:nth-of-type(even).ib-enquiry .right label {
    color: var(--dark);
}

.about-page > section:nth-of-type(even).ib-enquiry .right .form-sub {
    color: #666;
}

/* --- Contact form --- */
.about-page > section:nth-of-type(even).message-us h2 {
    color: var(--white);
}

.about-page > section:nth-of-type(even).message-us .sub {
    color: var(--white-80);
}

.about-page > section:nth-of-type(even).message-us .form-box {
    color: var(--dark);
}

.about-page > section:nth-of-type(even).message-us label {
    color: #333;
}

.about-page > section:nth-of-type(even).message-us input,
.about-page > section:nth-of-type(even).message-us textarea {
    color: var(--dark);
}

/* --- Map section --- */
.about-page > section:nth-of-type(even).map-section h2 {
    color: var(--white);
}

.about-page > section:nth-of-type(even).map-section .sub {
    color: var(--white-80);
}

/* --- Advisors (leadership page) --- */
.about-page > section:nth-of-type(even) .advisors-title {
    color: var(--white);
}

.about-page > section:nth-of-type(even) .advisor-name {
    color: var(--white);
}

.about-page > section:nth-of-type(even) .advisor-role {
    color: var(--yellow);
}

.about-page > section:nth-of-type(even) .advisor-desc {
    color: var(--white-80);
}

.about-page > section:nth-of-type(even) .name-advisor {
    border-bottom-color: rgba(255, 255, 255, 0.18);
}

/* --- Memberships strip --- */
.about-page .about-membership-single img {
    display: block;
    width: 100%;
    height: auto;
}

/* the old tile grid is hidden, but its display:grid would override [hidden] */
.about-membership-strip[hidden] {
    display: none !important;
}

.about-page > section:nth-of-type(even).about-memberships .about-section-heading h2 {
    color: var(--blue-primary);
}

.about-page > section:nth-of-type(even).about-memberships .about-section-heading p {
    color: #454545;
}

.about-page > section:nth-of-type(even).about-memberships .about-membership-strip {
    background: transparent;
}

.about-page > section:nth-of-type(even).about-memberships .about-membership-logo {
    background: var(--white);
    color: #5f7387;
}

.about-page > section:nth-of-type(even).about-memberships .about-membership-logo h4 {
    color: #141414;
}

/* The white pill navigation sits on top of both light and dark bands */
.about-page > section.about-introduction .about-pill-nav a {
    font-family: var(--font-button);
}

/* ===== 3. BANNER (HERO) OVERLAY — same strong scrim on every page ===== */
/*.about-page .about-hero-overlay {
    background:
        linear-gradient(180deg, rgba(10, 37, 64, 0.35) 0%, rgba(10, 37, 64, 0.45) 50%, rgba(10, 37, 64, 0.70) 100%),
        linear-gradient(90deg, rgba(10, 37, 64, 0.35) 0%, rgba(10, 37, 64, 0.10) 50%, rgba(10, 37, 64, 0.35) 100%);
}
*/
.about-page .about-hero-inner h1,
.about-page .about-hero-inner p {
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.45);
}

/* ===== 4. BUTTON TYPOGRAPHY CONSISTENCY ===== */
.dl-btn,
.blue-btn,
.yellow-btn,
.btn-blue,
.about-journey-btn,
.ib-enquiry button,
.message-us button {
    font-family: var(--font-button);
    letter-spacing: 0.02em;
}

/* ===== 4. INNER PAGE SPACING RHYTHM (same feel as the homepage) ===== */
.about-page .about-section-heading h2,
.about-page .about-edge-content h2 {
    line-height: 1.05;
}

.about-page .about-section-heading {
    margin-bottom: 30px;
}

/* ===== 5. LINK / FOCUS POLISH ===== */
.about-page a:focus-visible,
.about-page button:focus-visible {
    outline: 2px solid var(--yellow);
    outline-offset: 3px;
}

/* ===== 6. OLD BLUE / YELLOW -> NEW PALETTE (navy #0a2540 + gold #c5a55a) ===== */
/* "Join the IBS Journey" CTA band (was a bright blue gradient) */
.about-page > section.about-journey-cta,
.about-journey-cta {
    background: var(--blue-primary);
}

/* Leadership page chairman card */
.chairman-information {
    background: var(--blue-primary);
}

/* Admission process timeline */
.admission-process .title {
    color: var(--blue-primary);
}

.admission-process .timeline::before,
.admission-process .circle {
    background: var(--blue-primary);
}

/* Enquiry section */
.ib-enquiry .left,
.ib-enquiry .contact-box p {
    color: var(--blue-primary);
}

.ib-enquiry .icon-circle,
.ib-enquiry button {
    background: var(--blue-primary);
}

/* Contact / locations / map */
.message-us h2,
.map-section h2,
.our-locations .note {
    color: var(--blue-primary);
}

.message-us input:focus,
.message-us textarea:focus {
    border-color: var(--blue-primary);
}

.message-us button,
.about-page .blue-btn {
    background: var(--blue-primary);
}

.about-page .yellow-btn {
    background: var(--yellow);
    color: var(--dark);
}

.our-locations .content small,
.our-locations .content ul li i,
.advisors-title {
    color: var(--blue-primary);
}

/* Gallery slider arrows */
.gallerySwiper .swiper-button-next,
.gallerySwiper .swiper-button-prev {
    color: var(--blue-primary);
}

/* ===== 7. OLD ACCENTS (old yellow / old blues) -> NEW GOLD + NAVY ===== */
.top-nav-link:hover {
    color: var(--yellow);
}

.btn-cta-yellow:hover,
.hero-banner-btn:hover,
.tour-btn-gold:hover {
    background: #b08f44;
    color: var(--dark);
}

.hero-banner-btn {
    box-shadow: 0 4px 15px rgba(197, 165, 90, 0.3);
}

.custom-arrow {
    background: var(--yellow);
}

.our-locations .badge {
    background: var(--yellow);
    color: var(--dark);
}

.message-us button:hover {
    background: #123a5e;
}

.program-card-cta-golden {
    background: linear-gradient(135deg, #f0e6cf 0%, #e0d0a8 40%, #c5a55a 100%);
}

.about-intro-title span,
.advisor-role {
    color: var(--blue-primary);
}

/* Old light-blue surfaces -> new palette */
body,
body.inner-page,
body.index2-page {
    background: var(--white);
}

.about-content-section,
.edge-section > .container-fluid {
    background: var(--white);
}

.wing-age {
    background: rgba(197, 165, 90, 0.18);
    color: var(--blue-primary);
}

.testimonial-avatar {
    background: var(--yellow);
    color: var(--blue-primary);
}

/* ===== 8. MOBILE TWEAKS ===== */
@media (max-width: 768px) {
    .about-page > section.about-introduction,
    .about-page > section.about-edge,
    .about-page > section.about-academics {
        padding-left: 0;
        padding-right: 0;
    }

    .about-page > section:is(.about-introduction, .about-edge, .about-academics):nth-of-type(even) .about-feature-item p {
        text-align: left;
    }
}
