/* ===== Reset & Base ===== */
    *, *::before, *::after {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }

    html {
        overflow-x: hidden;
        max-width: 100%;
        /* Public header height; JS sets exact px for fixed bar + body offset */
        --site-head-h: 132px;
    }
    /* overflow-x: hidden on html can still affect sticky; clip fixes it where supported */
    @supports (overflow: clip) {
        html {
            overflow-x: clip;
        }
    }

    body {
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        background-color: #f4f6f9;
        color: #333;
        min-height: 100vh;
        display: flex;
        flex-direction: column;
        /* Do not set overflow-x here — can break fixed/sticky header behavior for descendants */
        max-width: 100vw;
        padding-top: var(--site-head-h);
        transition: padding-top 0.38s cubic-bezier(0.33, 1, 0.68, 1);
    }

    /* Accessible hide (keeps SEO/a11y text available) */
    .sr-only {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        padding: 0 !important;
        margin: -1px !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        white-space: nowrap !important;
        border: 0 !important;
    }

    a {
        text-decoration: none;
        color: inherit;
    }

    ul {
        list-style: none;
    }

    /* ===== Top Announcement Bar ===== */
    /* Fixed wrapper: top announcement bar stays visible; main nav slot collapses on scroll (desktop, JS). */
    .site-head-sticky {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1000;
        width: 100%;
        max-width: 100vw;
    }

    /* Only wraps the main <header>; max-height driven by --site-nav-h from JS */
    .site-head-nav-wrap {
        flex-shrink: 0;
        transition: max-height 0.38s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.22s ease;
        max-height: var(--site-nav-h, 180px);
        overflow: visible;
    }

    .site-head-sticky.site-head-sticky--nav-collapsed .site-head-nav-wrap {
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        pointer-events: none;
    }

    @media (prefers-reduced-motion: reduce) {
        .site-head-nav-wrap {
            transition-duration: 0.15s;
        }
        body {
            transition-duration: 0.15s;
        }
    }

    .topbar {
        background-color: #1a2a6c;
        color: #ffffff;
        font-size: 13px;
        width: 100%;
        max-width: 100vw;
        overflow: hidden;
        z-index: 1000;
        flex-shrink: 0;
    }

    .topbar-inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        max-width: 1440px;
        width: 100%;
        margin: 0 auto;
        padding: 7px 20px;
        gap: 16px;
        box-sizing: border-box;
    }

    /* Announcement badge */
    .topbar-badge {
        background-color: #e84118;
        color: #ffffff;
        font-size: 15px;
        font-weight: 700;
        padding: 4px 12px;
        border-radius: 3px;
        white-space: nowrap;
        letter-spacing: 0.5px;
        flex-shrink: 0;
    }

    /* Marquee wrapper */
    .topbar-left {
        display: flex;
        align-items: center;
        gap: 12px;
        flex: 1;
        min-width: 0;
        overflow: hidden;
    }

    .topbar-marquee-wrap {
        flex: 1;
        overflow: hidden;
        min-width: 0;
    }

    .topbar-marquee {
        color: #d6e4f7;
        font-size: 16px;
        width: 100%;
        white-space: nowrap;
        overflow: hidden;
    }

    .topbar-marquee strong {
        color: #ffffff;
    }

    .topbar-marquee__track {
        display: flex;
        width: max-content;
        min-width: 100%;
        animation: topbarTicker 28s linear infinite;
    }

    .topbar-marquee__set {
        display: inline-flex;
        align-items: center;
        flex-shrink: 0;
        padding-right: 44px;
    }

    .topbar-marquee__item {
        display: inline-flex;
        align-items: center;
    }

    .topbar-marquee__sep {
        color: #9fb7df;
        font-weight: 700;
    }

    .marquee-new-badge {
        display: inline-block;
        vertical-align: middle;
        width: 48px;
        height: auto;
        margin-right: 8px;
        object-fit: contain;
        flex-shrink: 0;
        mix-blend-mode: screen;
    }

    /* Contact info (right side) */
    .topbar-right {
        display: flex;
        align-items: center;
        gap: 20px;
        flex-shrink: 0;
    }

    .topbar-contact {
        display: flex;
        align-items: center;
        gap: 7px;
        color: #d6e4f7;
        font-size: 16px;
        white-space: nowrap;
        transition: color 0.2s;
    }

    .topbar-contact:hover {
        color: #ffffff;
    }

    .topbar-contact i {
        font-size: 12px;
        color: #e84118;
    }

    @keyframes topbarTicker {
        0% { transform: translateX(0); }
        100% { transform: translateX(-50%); }
    }

    @media (prefers-reduced-motion: reduce) {
        .topbar-marquee__track {
            animation: none;
            transform: none;
        }
    }

    /* ===== Main Site Header & Navbar (modern) ===== */
    .site-header--modern {
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.97) 0%, rgba(248, 250, 252, 0.98) 100%);
        backdrop-filter: saturate(160%) blur(14px);
        -webkit-backdrop-filter: saturate(160%) blur(14px);
        box-shadow:
            0 1px 0 rgba(15, 23, 42, 0.06),
            0 12px 40px rgba(13, 27, 94, 0.08);
        border-bottom: none;
        position: relative;
        z-index: 1;
        width: 100%;
        max-width: 100vw;
    }

    .site-header__accent {
        height: 3px;
        width: 100%;
        background: linear-gradient(90deg, #c9a227 0%, #f5b800 35%, #ffc94d 50%, #f5b800 65%, #c9a227 100%);
        background-size: 200% 100%;
        animation: siteHeaderAccentShift 8s ease-in-out infinite;
    }

    @media (prefers-reduced-motion: reduce) {
        .site-header__accent {
            animation: none;
            background: linear-gradient(90deg, #f5b800, #ffc94d, #f5b800);
        }
    }

    @keyframes siteHeaderAccentShift {
        0%, 100% { background-position: 0% 50%; }
        50% { background-position: 100% 50%; }
    }

    .main-nav--modern {
        width: 100%;
    }

    .nav-container {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        max-width: 1680px;
        margin: 0 auto;
        padding: 0 clamp(16px, 3vw, 28px);
        height: 88px;
        gap: 16px;
        box-sizing: border-box;
    }

    /* ---- Brand (wordmark) ---- */
    .nav-brand {
        flex-shrink: 0;
        min-width: 0;
    }

    .nav-brand__link {
        display: flex;
        align-items: center;
        gap: 14px;
        text-decoration: none;
        color: inherit;
        min-width: 0;
    }

    .nav-brand__mark {
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 64px;
        height: 64px;
        border-radius: 16px;
        background: linear-gradient(145deg, #fff 0%, #f1f5f9 100%);
        border: 1px solid rgba(13, 27, 94, 0.08);
        box-shadow:
            0 1px 0 rgba(255, 255, 255, 0.9) inset,
            0 8px 24px rgba(13, 27, 94, 0.08);
        transition: box-shadow 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
    }

    .nav-brand__link:hover .nav-brand__mark,
    .nav-brand__link:focus-visible .nav-brand__mark {
        border-color: rgba(245, 184, 0, 0.55);
        box-shadow:
            0 1px 0 rgba(255, 255, 255, 0.9) inset,
            0 12px 32px rgba(13, 27, 94, 0.12);
    }

    .nav-brand__copy {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 3px;
        min-width: 0;
        line-height: 1.15;
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    }

    /* Short name (AAMS) */
    .nav-brand__title {
        font-size: clamp(1.35rem, 2.5vw, 1.85rem);
        font-weight: 800;
        letter-spacing: -0.02em;
        line-height: 1;
        background: linear-gradient(115deg, #0d1b5e 0%, #1e40af 45%, #0d1b5e 100%);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        -webkit-text-fill-color: transparent;
    }

    /* Full institution name — below short name */
    .nav-brand__full {
        display: block;
        font-family: inherit;
        font-size: clamp(14px, 1.55vw, 17px);
        font-weight: 700;
        letter-spacing: 0.02em;
        color: #0d1b5e;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: min(380px, 42vw);
    }

    .nav-brand__link:hover .nav-brand__title,
    .nav-brand__link:focus-visible .nav-brand__title {
        filter: brightness(1.08);
    }

    .nav-brand__link:focus-visible {
        outline: 2px solid #f5b800;
        outline-offset: 4px;
        border-radius: 12px;
    }

    .nav-logo-img {
        width: 52px;
        height: 52px;
        object-fit: contain;
        display: block;
        border-radius: 12px;
        transition: transform 0.28s ease;
        flex-shrink: 0;
    }

    .nav-brand__link:hover .nav-logo-img {
        transform: scale(1.04);
    }

    /* ---- Nav Collapse Wrapper ---- */
    .nav-collapse {
        display: flex;
        align-items: center;
        gap: 12px;
        flex: 1;
        justify-content: flex-end;
        min-width: 0;
    }

    /* ---- Nav Menu — flat bar (no heavy “pill rail”) ---- */
    .nav-menu {
        display: flex;
        align-items: center;
        gap: 2px;
        list-style: none;
        margin: 0;
        padding: 0;
        flex-wrap: nowrap;
        flex-shrink: 1;
        min-width: 0;
        background: transparent;
        border: none;
        border-radius: 0;
    }

    .site-header--modern .nav-link {
        display: block;
        color: #334155;
        font-size: 13px;
        font-weight: 700;
        padding: 8px 12px;
        border-radius: 10px;
        text-decoration: none;
        letter-spacing: 0.01em;
        text-transform: none;
        position: relative;
        transition: color 0.2s, background 0.2s;
        white-space: nowrap;
    }

    .site-header--modern .nav-link::after {
        display: none;
    }

    .site-header--modern .nav-link:hover,
    .site-header--modern .nav-link:focus-visible,
    .site-header--modern .nav-link.active {
        color: #0d1b5e;
        background: rgba(13, 27, 94, 0.06);
        box-shadow: none;
    }

    .site-header--modern .nav-link:focus-visible {
        outline: 2px solid #f5b800;
        outline-offset: 2px;
    }

    /* ---- Contact Us CTA Button ---- */
    .site-header--modern .nav-cta {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1e3a8a 100%);
        color: #f8fafc;
        font-size: 13px;
        font-weight: 700;
        padding: 10px 20px;
        border-radius: 999px;
        text-decoration: none;
        text-transform: none;
        letter-spacing: 0.02em;
        white-space: nowrap;
        margin-left: 8px;
        box-shadow: 0 4px 16px rgba(13, 27, 94, 0.28);
        border: 1px solid rgba(255, 255, 255, 0.12);
        transition: background 0.25s, transform 0.2s, box-shadow 0.25s, color 0.2s;
        flex-shrink: 0;
    }

    .site-header--modern .nav-cta i {
        font-size: 13px;
        color: #f5b800;
    }

    .site-header--modern .nav-cta:hover {
        background: linear-gradient(135deg, #f5b800 0%, #e8940a 100%);
        color: #0d1b5e;
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(245, 184, 0, 0.35);
    }

    .site-header--modern .nav-cta:hover i {
        color: #0d1b5e;
    }

    /* ---- Hamburger Toggle ---- */
    .nav-toggle {
        display: none;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 5px;
        background: transparent;
        border: 2px solid rgba(245, 184, 0, 0.5);
        border-radius: 6px;
        cursor: pointer;
        padding: 8px;
        width: 44px;
        height: 44px;
        flex-shrink: 0;
        transition: border-color 0.25s;
    }

    .nav-toggle--modern {
        border: 1px solid rgba(13, 27, 94, 0.12);
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.92);
        box-shadow: 0 2px 10px rgba(13, 27, 94, 0.08);
    }

    .nav-toggle--modern:hover {
        border-color: rgba(245, 184, 0, 0.65);
        background: #fff;
    }

    .nav-toggle--modern .bar {
        background: #0d1b5e;
    }

    .nav-toggle:hover {
        border-color: #f5b800;
    }

    .bar {
        display: block;
        width: 22px;
        height: 2px;
        background-color: #f5b800;
        border-radius: 2px;
        transition: transform 0.35s ease, opacity 0.25s ease;
        transform-origin: center;
    }

    /* Animate hamburger → X */
    .nav-toggle--open .bar:nth-child(1) {
        transform: translateY(7px) rotate(45deg);
    }

    .nav-toggle--open .bar:nth-child(2) {
        opacity: 0;
        transform: scaleX(0);
    }

    .nav-toggle--open .bar:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg);
    }

    /* ===== Responsive: Topbar ===== */
    @media (max-width: 900px) {
        .topbar-right {
            display: none;
        }

        .topbar-inner {
            padding: 6px 14px;
        }
    }

    /* ===== Responsive: Main Navbar ===== */

    /*
    Breakpoint map (CSS viewport widths — no max-width cap on container):
    > 1560px  → full desktop (52px AAMS, default padding) — container grows with viewport
    1367–1560 → medium compression (40px AAMS, 13px links) — covers 90% on 1366px (≈1518px CSS)
    1101–1366 → tight (32px AAMS, 12px links) — covers 100% on 1366px
    < 1100px  → hamburger menu
    */

    /* 1560px — first step of compression (catches 90% zoom on 1366px screens) */
    @media (max-width: 1560px) {
        .nav-container {
            padding: 0 16px;
        }
        .nav-brand__mark {
            width: 58px;
            height: 58px;
        }
        .nav-logo-img {
            width: 48px;
            height: 48px;
        }
        .nav-brand__full {
            font-size: clamp(13px, 1.45vw, 16px);
            max-width: min(340px, 38vw);
        }
        .nav-brand__title {
            font-size: clamp(1.2rem, 2.3vw, 1.65rem);
        }
        .site-header--modern .nav-link {
            font-size: 12.5px;
            padding: 8px 11px;
        }
        .site-header--modern .nav-cta {
            padding: 9px 16px;
            font-size: 12.5px;
            margin-left: 0;
        }
        .nav-collapse {
            gap: 10px;
        }
    }

    /* 1366px — 100% zoom on 1366px laptops AND 90% zoom on 1280px screens */
    @media (max-width: 1366px) {
        .nav-container {
            max-width: 100%;
            padding: 0 12px;
            height: 80px;
        }
        .nav-brand__mark {
            width: 54px;
            height: 54px;
        }
        .nav-logo-img {
            width: 44px;
            height: 44px;
        }
        .nav-brand__full {
            font-size: clamp(12px, 1.35vw, 15px);
            max-width: min(300px, 36vw);
        }
        .nav-brand__title {
            font-size: clamp(1.1rem, 2.1vw, 1.45rem);
        }
        .site-header--modern .nav-link {
            font-size: 13px;
            padding: 7px 9px;
        }
        .site-header--modern .nav-cta {
            padding: 8px 12px;
            font-size: 12px;
            margin-left: 0;
        }
        .nav-collapse {
            gap: 8px;
        }
    }

    /* 1200px — smaller laptops */
    @media (max-width: 1200px) {
        .nav-brand__full {
            max-width: min(220px, 32vw);
        }
        .nav-brand__title {
            font-size: clamp(1.05rem, 2vw, 1.3rem);
        }
        .site-header--modern .nav-link {
            font-size: 11px;
            padding: 7px 8px;
        }
        .site-header--modern .nav-cta {
            padding: 7px 10px;
            font-size: 11px;
        }
        .nav-collapse {
            gap: 6px;
        }
    }

    /* 1100px — hamburger kicks in */
    @media (max-width: 1100px) {
        .nav-toggle {
            display: flex;
        }

        .nav-container {
            height: 72px;
            padding: 0 16px;
            position: relative;
        }

        /*
        * Mobile brand: do NOT flex-grow the copy column — that stretched it full height and
        * pinned the wordmark to the top while logo + menu stayed vertically centered.
        * Keep a compact stack next to the logo, optically centered via align-items on the link.
        */
        .nav-brand__link {
            align-items: center;
            gap: 10px;
            min-width: 0;
        }

        .nav-brand__copy {
            align-items: flex-start;
            text-align: left;
            justify-content: center;
        }

        .nav-menu {
            background: transparent;
            border: none;
            border-radius: 0;
            padding: 0;
            gap: 0;
        }

        .nav-collapse {
            display: none;
            position: absolute;
            top: 100%;
            left: 0;
            width: 100%;
            flex-direction: column;
            align-items: stretch;
            background: linear-gradient(165deg, #0d1b5e 0%, #152a6e 45%, #0f1f4d 100%);
            border-top: 1px solid rgba(245, 184, 0, 0.35);
            box-shadow: 0 24px 48px rgba(13, 27, 94, 0.35);
            padding: 12px 0 20px;
            gap: 0;
            z-index: 998;
            border-radius: 0 0 20px 20px;
        }

        .nav-collapse.nav-collapse--open {
            display: flex;
        }

        .nav-menu {
            flex-direction: column;
            align-items: stretch;
            width: 100%;
            gap: 0;
        }

        .nav-menu li {
            width: 100%;
        }

        .site-header--modern .nav-link {
            padding: 14px 22px;
            font-size: 14px;
            border-radius: 0;
            border-bottom: 1px solid rgba(255, 255, 255, 0.08);
            color: rgba(248, 250, 252, 0.95);
        }

        .site-header--modern .nav-link:hover,
        .site-header--modern .nav-link:focus-visible,
        .site-header--modern .nav-link.active {
            background: rgba(245, 184, 0, 0.12);
            color: #f5b800;
            box-shadow: none;
            padding-left: 26px;
        }

        .site-header--modern .nav-cta {
            margin: 16px 20px 0;
            justify-content: center;
            border-radius: 999px;
        }
    }

    @media (max-width: 480px) {
        .topbar-badge {
            font-size: 11px;
            padding: 3px 9px;
        }

        .topbar-marquee {
            font-size: 12px;
        }

        .marquee-new-badge {
            width: 36px;
            margin-right: 6px;
        }

        .nav-brand__link {
            gap: 10px;
        }
        .nav-brand__mark {
            width: 48px;
            height: 48px;
            border-radius: 12px;
        }
        .nav-logo-img {
            width: 38px;
            height: 38px;
            border-radius: 10px;
        }
        .nav-brand__full {
            font-size: 12px;
            max-width: min(200px, 52vw);
        }
        .nav-brand__title {
            font-size: 1.05rem;
        }

        .nav-container {
            height: 66px;
        }
    }

    /* Why AAMS workflow responsive */
    @media (max-width: 1024px) {
        .co-why-grid { gap: 16px 40px; }
        .co-why-card:nth-child(odd)::after { right: -26px; }
        .co-why-card:nth-child(even)::after { left: -26px; }
    }

    @media (max-width: 768px) {
        .co-why-grid { grid-template-columns: 1fr; gap: 16px; }
        .co-why-grid::before { display: none; }
        .co-why-card::after { left: 18px; right: auto; top: 24px; }
        .co-why-icon::after { left: 56px; }
    }

    @media (prefers-reduced-motion: reduce) {
        .co-why-card { animation: none !important; }
    }

    /* ================================================================
    ABOUT US DROPDOWN MENU
    ================================================================ */

    /* ---- Parent list item ---- */
    .nav-item-dropdown {
        position: relative;
    }

    /* ---- Dropdown trigger link ---- */
    .nav-link-dropdown {
        display: inline-flex;
        align-items: center;
        gap: 6px;
    }

    .nav-dropdown-arrow {
        font-size: 10px;
        transition: transform 0.3s ease;
    }

    /* Rotate arrow on hover / open */
    .nav-item-dropdown:hover .nav-dropdown-arrow,
    .nav-item-dropdown.dropdown--open .nav-dropdown-arrow {
        transform: rotate(180deg);
        color: #f5b800;
    }

    /* ---- Dropdown Panel ---- */
    .site-header--modern .nav-dropdown {
        position: absolute;
        top: calc(100% + 6px);
        left: 50%;
        transform: translateX(-50%) translateY(-8px);
        width: 328px;
        background: #fff;
        border-radius: 20px;
        box-shadow:
            0 24px 64px rgba(13, 27, 94, 0.14),
            0 4px 20px rgba(0, 0, 0, 0.06);
        border: 1px solid rgba(226, 232, 240, 0.95);
        overflow: hidden;
        opacity: 0;
        pointer-events: none;
        visibility: hidden;
        transition: opacity 0.28s ease, transform 0.28s ease, visibility 0.28s;
        z-index: 1100;
    }

    .site-header--modern .nav-dropdown::before {
        content: '';
        position: absolute;
        top: -7px;
        left: 50%;
        transform: translateX(-50%);
        width: 14px;
        height: 14px;
        background: #0d1b5e;
        clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
        box-shadow: 0 -2px 0 rgba(245, 184, 0, 0.35);
    }

    /* Show on hover OR when JS toggle class is present (desktop) */
    .nav-item-dropdown:hover .nav-dropdown,
    .nav-item-dropdown.dropdown--open .nav-dropdown {
        opacity: 1;
        pointer-events: all;
        visibility: visible;
        transform: translateX(-50%) translateY(0);
    }

    .site-header--modern .nav-item-dropdown.dropdown--open > .nav-link-dropdown,
    .site-header--modern .nav-item-dropdown:hover > .nav-link-dropdown {
        background: rgba(13, 27, 94, 0.06);
        box-shadow: none;
        color: #0d1b5e;
    }

    /* ---- Dropdown Inner ---- */
    .nav-dropdown-inner {
        display: flex;
        flex-direction: column;
    }

    /* ---- Dropdown Header ---- */
    .nav-dropdown-header {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        padding: 14px 20px;
        display: flex;
        align-items: center;
        position: relative;
        overflow: hidden;
    }

    .nav-dropdown-header::after {
        content: '';
        position: absolute;
        inset: 0;
        background-image: radial-gradient(rgba(245,184,0,0.1) 1px, transparent 1px);
        background-size: 16px 16px;
        pointer-events: none;
    }

    .nav-dropdown-header span {
        font-size: 11px;
        font-weight: 800;
        color: #f5b800;
        text-transform: uppercase;
        letter-spacing: 1.5px;
        position: relative;
        z-index: 1;
    }

    .site-header--modern .nav-dropdown-header {
        background: linear-gradient(125deg, #0d1b5e 0%, #1e3a8a 55%, #152a70 100%);
        padding: 16px 20px;
        display: flex;
        align-items: center;
        position: relative;
        overflow: hidden;
    }

    .site-header--modern .nav-dropdown-header span {
        font-size: 10px;
        font-weight: 800;
        color: #fde68a;
        text-transform: uppercase;
        letter-spacing: 0.18em;
        position: relative;
        z-index: 1;
    }

    .site-header--modern .nav-dropdown-link {
        padding: 12px 18px;
        gap: 14px;
        border-radius: 0;
    }

    .site-header--modern .nav-dropdown-link:hover {
        background: linear-gradient(90deg, rgba(13, 27, 94, 0.06), rgba(255, 255, 255, 0));
    }

    .site-header--modern .nav-dropdown-icon {
        width: 38px;
        height: 38px;
        border-radius: 12px;
        box-shadow: 0 2px 8px rgba(13, 27, 94, 0.15);
    }

    .site-header--modern .nav-dropdown-text strong {
        font-size: 13px;
        font-weight: 700;
        color: #0f172a;
    }

    .site-header--modern .nav-dropdown-text em {
        font-size: 11px;
        color: #64748b;
    }

    /* ---- Dropdown List ---- */
    .nav-dropdown-list {
        list-style: none;
        padding: 8px 0;
        margin: 0;
    }

    /* Keep opacity: 1 so submenu links stay clickable while staggered animation runs (opacity:0 broke taps/clicks). */
    .nav-dropdown-list li {
        opacity: 1;
        transform: translateX(-8px);
        animation: none;
    }

    /* Stagger slide-in when dropdown opens */
    .nav-item-dropdown:hover .nav-dropdown-list li,
    .nav-item-dropdown.dropdown--open .nav-dropdown-list li {
        animation: dropItemIn 0.25s ease forwards;
    }

    .nav-item-dropdown:hover .nav-dropdown-list li:nth-child(1),
    .nav-item-dropdown.dropdown--open .nav-dropdown-list li:nth-child(1) { animation-delay: 0.04s; }
    .nav-item-dropdown:hover .nav-dropdown-list li:nth-child(2),
    .nav-item-dropdown.dropdown--open .nav-dropdown-list li:nth-child(2) { animation-delay: 0.08s; }
    .nav-item-dropdown:hover .nav-dropdown-list li:nth-child(3),
    .nav-item-dropdown.dropdown--open .nav-dropdown-list li:nth-child(3) { animation-delay: 0.12s; }
    .nav-item-dropdown:hover .nav-dropdown-list li:nth-child(4),
    .nav-item-dropdown.dropdown--open .nav-dropdown-list li:nth-child(4) { animation-delay: 0.16s; }
    .nav-item-dropdown:hover .nav-dropdown-list li:nth-child(5),
    .nav-item-dropdown.dropdown--open .nav-dropdown-list li:nth-child(5) { animation-delay: 0.20s; }
    .nav-item-dropdown:hover .nav-dropdown-list li:nth-child(6),
    .nav-item-dropdown.dropdown--open .nav-dropdown-list li:nth-child(6) { animation-delay: 0.24s; }
    .nav-item-dropdown:hover .nav-dropdown-list li:nth-child(7),
    .nav-item-dropdown.dropdown--open .nav-dropdown-list li:nth-child(7) { animation-delay: 0.28s; }
    .nav-item-dropdown:hover .nav-dropdown-list li:nth-child(8),
    .nav-item-dropdown.dropdown--open .nav-dropdown-list li:nth-child(8) { animation-delay: 0.32s; }

    @keyframes dropItemIn {
        from { transform: translateX(-10px); }
        to   { transform: translateX(0); }
    }

    /* ---- Dropdown Link ---- */
    .nav-dropdown-link {
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 10px 18px;
        text-decoration: none;
        transition: background 0.2s ease, padding-left 0.2s ease;
        border-left: 3px solid transparent;
        position: relative;
        z-index: 1;
        cursor: pointer;
    }

    .nav-dropdown-link:hover {
        background: linear-gradient(90deg, rgba(13,27,94,0.05), transparent);
        border-left-color: #f5b800;
        padding-left: 22px;
    }

    /* Icon circle */
    .nav-dropdown-icon {
        width: 36px;
        height: 36px;
        border-radius: 10px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 14px;
        flex-shrink: 0;
        transition: transform 0.25s ease, background 0.25s ease;
    }

    .nav-dropdown-link:hover .nav-dropdown-icon {
        transform: scale(1.1) rotate(-5deg);
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
    }

    /* Text block */
    .nav-dropdown-text {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .nav-dropdown-text strong {
        font-size: 13px;
        font-weight: 700;
        color: #0d1b5e;
        line-height: 1.3;
        transition: color 0.2s ease;
    }

    .nav-dropdown-text em {
        font-size: 11px;
        font-style: normal;
        color: #9ca3af;
        line-height: 1.3;
    }

    .nav-dropdown-link:hover .nav-dropdown-text strong {
        color: #0d1b5e;
    }

    /* ================================================================
    DROPDOWN — MOBILE (≤1100px)
    ================================================================ */
    @media (max-width: 1100px) {

        .nav-dropdown {
            position: static;
            transform: none;
            width: 100%;
            border-radius: 0;
            box-shadow: none;
            border: none;
            border-top: 1px solid rgba(255,255,255,0.08);
            background: rgba(255,255,255,0.04);
            max-height: 0;
            overflow: hidden;
            opacity: 1;
            visibility: visible;
            pointer-events: none;
            transition: max-height 0.4s ease;
        }

        .nav-dropdown::before {
            display: none;
        }

        .nav-item-dropdown.dropdown--open .nav-dropdown {
            max-height: 600px;
            pointer-events: all;
        }

        /* Disable CSS hover on mobile — JS class controls open state */
        .nav-item-dropdown:hover .nav-dropdown {
            max-height: 0;
            pointer-events: none;
            opacity: 1;
            visibility: visible;
            transform: none;
        }

        /* JS open state wins over :hover on mobile */
        .nav-item-dropdown.dropdown--open .nav-dropdown,
        .nav-item-dropdown.dropdown--open:hover .nav-dropdown {
            max-height: 700px;
            pointer-events: all;
        }

        .nav-dropdown-header {
            padding: 10px 20px;
        }

        .nav-dropdown-link {
            padding: 10px 28px;
            border-left: none;
            border-bottom: 1px solid rgba(255,255,255,0.05);
        }

        .nav-dropdown-link:hover {
            padding-left: 34px;
        }

        .nav-dropdown-icon {
            width: 30px;
            height: 30px;
            font-size: 12px;
        }

        .nav-dropdown-text strong {
            color: #dce8ff;
        }

        .nav-dropdown-text em {
            color: rgba(255,255,255,0.45);
        }

        .nav-dropdown-list li {
            opacity: 1;
            transform: none;
            animation: none !important;
        }
    }

    /* ================================================================
    ADMISSION DROPDOWN — wider panel + right-aligned so it
    doesn't overflow the left edge on smaller desktops
    ================================================================ */
    .nav-item-admission .nav-dropdown {
        width: 300px;
        left: auto;
        right: 0;
        transform: translateX(0) translateY(-10px);
    }

    .nav-item-admission .nav-dropdown::before {
        left: auto;
        right: 28px;
        transform: translateX(0);
    }

    .nav-item-admission:hover .nav-dropdown,
    .nav-item-admission.dropdown--open .nav-dropdown {
        transform: translateX(0) translateY(0);
    }

    /* Extra stagger delay for the 6-item admission list */
    .nav-item-admission:hover .nav-dropdown-list li:nth-child(6),
    .nav-item-admission.dropdown--open .nav-dropdown-list li:nth-child(6) { animation-delay: 0.24s; }

    /* Mobile: allow admission dropdown to expand fully (6 items) */
    @media (max-width: 1100px) {
        .nav-item-admission .nav-dropdown {
            position: static;
            width: 100%;
            transform: none;
        }
        .nav-item-admission:hover .nav-dropdown {
            max-height: 0;
            pointer-events: none;
        }
        .nav-item-admission.dropdown--open .nav-dropdown,
        .nav-item-admission.dropdown--open:hover .nav-dropdown {
            max-height: 520px;
            pointer-events: all;
        }
    }

    /* ================================================================
    PLACEMENT DROPDOWN — right-aligned so it doesn't overflow
    the viewport on smaller desktops (5 items)
    ================================================================ */
    .nav-item-placement .nav-dropdown {
        width: 300px;
        left: auto;
        right: 0;
        transform: translateX(0) translateY(-10px);
    }

    .nav-item-placement .nav-dropdown::before {
        left: auto;
        right: 28px;
        transform: translateX(0);
    }

    .nav-item-placement:hover .nav-dropdown,
    .nav-item-placement.dropdown--open .nav-dropdown {
        transform: translateX(0) translateY(0);
    }

    /* Stagger delays for the 5-item placement list */
    .nav-item-placement:hover .nav-dropdown-list li:nth-child(1),
    .nav-item-placement.dropdown--open .nav-dropdown-list li:nth-child(1) { animation-delay: 0.04s; }
    .nav-item-placement:hover .nav-dropdown-list li:nth-child(2),
    .nav-item-placement.dropdown--open .nav-dropdown-list li:nth-child(2) { animation-delay: 0.08s; }
    .nav-item-placement:hover .nav-dropdown-list li:nth-child(3),
    .nav-item-placement.dropdown--open .nav-dropdown-list li:nth-child(3) { animation-delay: 0.12s; }
    .nav-item-placement:hover .nav-dropdown-list li:nth-child(4),
    .nav-item-placement.dropdown--open .nav-dropdown-list li:nth-child(4) { animation-delay: 0.16s; }
    .nav-item-placement:hover .nav-dropdown-list li:nth-child(5),
    .nav-item-placement.dropdown--open .nav-dropdown-list li:nth-child(5) { animation-delay: 0.20s; }

    /* Mobile: allow placement dropdown to expand fully (5 items) */
    @media (max-width: 1100px) {
        .nav-item-placement .nav-dropdown {
            position: static;
            width: 100%;
            transform: none;
        }
        .nav-item-placement:hover .nav-dropdown {
            max-height: 0;
            pointer-events: none;
        }
        .nav-item-placement.dropdown--open .nav-dropdown,
        .nav-item-placement.dropdown--open:hover .nav-dropdown {
            max-height: 450px;
            pointer-events: all;
        }
    }

    /* ================================================================
    DEPARTMENT DROPDOWN — grouped Computer Science + departments
    ================================================================ */
    .nav-item-department .nav-dropdown {
        width: 320px;
        left: auto;
        right: 0;
        transform: translateX(0) translateY(-10px);
    }

    .nav-item-department .nav-dropdown::before {
        left: auto;
        right: 28px;
        transform: translateX(0);
    }

    .nav-item-department:hover .nav-dropdown,
    .nav-item-department.dropdown--open .nav-dropdown {
        transform: translateX(0) translateY(0);
    }

    /* Non-link group heading (Computer Science) */
    .nav-dropdown-group-label {
        list-style: none;
        margin: 0;
        padding: 10px 18px 6px;
        border-bottom: 1px solid #eef1f8;
        background: linear-gradient(90deg, rgba(13, 27, 94, 0.04), rgba(245, 184, 0, 0.06));
    }

    .nav-dropdown-group-title {
        display: block;
        font-size: 10px;
        font-weight: 900;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: #0d1b5e;
        padding-left: 4px;
        border-left: 3px solid #f5b800;
    }

    /* Indented CS sub-links */
    .nav-dropdown-link--nested {
        padding-left: 22px;
        border-left: 3px solid transparent;
    }

    .nav-dropdown-link--nested:hover {
        padding-left: 26px;
        border-left-color: #e84118;
    }

    .nav-dropdown-link--nested .nav-dropdown-icon {
        width: 32px;
        height: 32px;
        font-size: 12px;
        border-radius: 8px;
    }

    .nav-item-department:hover .nav-dropdown-list li:nth-child(1),
    .nav-item-department.dropdown--open .nav-dropdown-list li:nth-child(1) { animation-delay: 0.04s; }
    .nav-item-department:hover .nav-dropdown-list li:nth-child(2),
    .nav-item-department.dropdown--open .nav-dropdown-list li:nth-child(2) { animation-delay: 0.08s; }
    .nav-item-department:hover .nav-dropdown-list li:nth-child(3),
    .nav-item-department.dropdown--open .nav-dropdown-list li:nth-child(3) { animation-delay: 0.12s; }
    .nav-item-department:hover .nav-dropdown-list li:nth-child(4),
    .nav-item-department.dropdown--open .nav-dropdown-list li:nth-child(4) { animation-delay: 0.16s; }
    .nav-item-department:hover .nav-dropdown-list li:nth-child(5),
    .nav-item-department.dropdown--open .nav-dropdown-list li:nth-child(5) { animation-delay: 0.2s; }
    .nav-item-department:hover .nav-dropdown-list li:nth-child(6),
    .nav-item-department.dropdown--open .nav-dropdown-list li:nth-child(6) { animation-delay: 0.24s; }

    @media (max-width: 1100px) {
        .nav-item-department .nav-dropdown {
            position: static;
            width: 100%;
            transform: none;
        }
        .nav-item-department:hover .nav-dropdown {
            max-height: 0;
            pointer-events: none;
        }
        .nav-item-department.dropdown--open .nav-dropdown,
        .nav-item-department.dropdown--open:hover .nav-dropdown {
            max-height: 560px;
            pointer-events: all;
        }
        .nav-dropdown-group-label {
            background: rgba(255, 255, 255, 0.04);
            border-bottom-color: rgba(255, 255, 255, 0.08);
        }
        .nav-dropdown-group-title {
            color: #f5b800;
            border-left-color: #f5b800;
        }
        .nav-dropdown-link--nested {
            padding-left: 36px;
        }
        .nav-dropdown-link--nested:hover {
            padding-left: 42px;
        }
    }

    /* ===== Main Content ===== */
    .main-content {
        flex: 1;
    }

    /* ===== Container ===== */
    .container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
    }

    /* ================================================================
    BANNER SLIDER SECTION — Full-Width Gradient Overlay Design
    ================================================================ */

    /* ---- Wrapper ---- */
    .banner-section {
        position: relative;
        overflow: hidden;
    }

    /* ---- Force Owl Carousel height ---- */
    .banner-section .owl-stage-outer { height: 530px; }
    .banner-section .owl-stage,
    .banner-section .owl-item        { height: 100%; }

    /* ================================================================
    SLIDE — full-width, image fills background
    ================================================================ */

    .banner-slide {
        position: relative;
        height: 530px;
        overflow: hidden;
        background-color: #0a1864;
        background-image: url('../img/banner/banner-bg.jpg');
        background-size: cover;
        background-position: center center;
        display: flex;
        align-items: center;
    }

    /* ================================================================
    GRADIENT OVERLAY
    Opaque deep-blue on the left, fades to near-transparent on right
    so the image is visible on the right side of the banner.
    ================================================================ */

    .banner-overlay {
        position: absolute;
        inset: 0;
        background: linear-gradient(
            100deg,
            rgba(6, 15, 72, 0.97)  0%,
            rgba(6, 15, 72, 0.90) 38%,
            rgba(6, 15, 72, 0.55) 60%,
            rgba(6, 15, 72, 0.10) 100%
        );
        z-index: 0;
    }

    /* ================================================================
    CONTENT BLOCK — sits on the left side above the overlay
    ================================================================ */

    .banner-content {
        position: relative;
        z-index: 1;
        max-width: 620px;
        padding: 0 56px;
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    /* Category / status label above heading */
    .banner-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(245, 184, 0, 0.15);
        border: 1px solid rgba(245, 184, 0, 0.45);
        color: #f5b800;
        font-size: 12px;
        font-weight: 700;
        padding: 6px 18px;
        border-radius: 50px;
        letter-spacing: 0.7px;
        text-transform: uppercase;
        width: fit-content;
    }

    .banner-tag i { font-size: 11px; }

    /* Main heading */
    .banner-title {
        font-size: clamp(28px, 3.8vw, 50px);
        font-weight: 900;
        color: #ffffff;
        line-height: 1.2;
        letter-spacing: 0.5px;
        margin: 0;
    }

    .banner-title-highlight {
        color: #f5b800;
        position: relative;
        display: inline-block;
    }

    .banner-title-highlight::after {
        content: "";
        position: absolute;
        left: -0.06em;
        right: -0.06em;
        bottom: 0.06em;
        height: 0.42em;
        border-radius: 999px;
        background: linear-gradient(90deg, rgba(245, 184, 0, 0.36), rgba(245, 184, 0, 0.06));
        z-index: -1;
        transform: skewX(-10deg);
        background-size: 180% 100%;
    }

    /* Sub-description */
    .banner-desc {
        font-size: 15px;
        color: rgba(255, 255, 255, 0.82);
        line-height: 1.75;
        margin: 0;
        max-width: 520px;
    }

    /* CTA row */
    .banner-actions {
        display: flex;
        align-items: center;
        gap: 14px;
        flex-wrap: wrap;
    }

    .banner-btn-primary {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: linear-gradient(135deg, #f5b800 0%, #d97b00 100%);
        color: #0c1a55;
        font-size: 14px;
        font-weight: 700;
        padding: 13px 30px;
        border-radius: 50px;
        text-decoration: none;
        letter-spacing: 0.3px;
        box-shadow: 0 6px 20px rgba(245, 184, 0, 0.42);
        transition: transform 0.22s, box-shadow 0.22s, background 0.22s;
        white-space: nowrap;
    }

    .banner-btn-primary:hover {
        background: linear-gradient(135deg, #ffd000 0%, #f5b800 100%);
        transform: translateY(-3px);
        box-shadow: 0 10px 26px rgba(245, 184, 0, 0.55);
        color: #060f3a;
        text-decoration: none;
    }

    .banner-btn-outline {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: transparent;
        color: #ffffff;
        font-size: 14px;
        font-weight: 700;
        padding: 12px 30px;
        border-radius: 50px;
        border: 2px solid rgba(255, 255, 255, 0.50);
        text-decoration: none;
        letter-spacing: 0.3px;
        transition: background 0.22s, border-color 0.22s, transform 0.22s;
        white-space: nowrap;
    }

    .banner-btn-outline:hover {
        background: rgba(255, 255, 255, 0.12);
        border-color: #ffffff;
        transform: translateY(-3px);
        color: #ffffff;
        text-decoration: none;
    }

    /* Trust badges row */
    .banner-badges {
        display: flex;
        align-items: center;
        gap: 20px;
        flex-wrap: wrap;
    }

    .banner-badge {
        display: flex;
        align-items: center;
        gap: 7px;
        color: rgba(255, 255, 255, 0.75);
        font-size: 13px;
        font-weight: 500;
    }

    .banner-badge i { color: #f5b800; font-size: 13px; }

    /* ================================================================
    HERO TEXT ANIMATION — replays per active slide
    ================================================================ */
    .banner-section .owl-item .banner-tag,
    .banner-section .owl-item .banner-title,
    .banner-section .owl-item .banner-desc,
    .banner-section .owl-item .banner-actions,
    .banner-section .owl-item .banner-badges {
        opacity: 0;
        transform: translateY(10px);
    }

    .banner-section .owl-item.active .banner-tag {
        animation: heroRise 650ms cubic-bezier(.2,.8,.2,1) 40ms both;
    }

    .banner-section .owl-item.active .banner-title {
        animation: heroRise 720ms cubic-bezier(.2,.8,.2,1) 120ms both;
    }

    .banner-section .owl-item.active .banner-title .banner-title-highlight::after {
        animation: heroSweep 1.2s ease-in-out 420ms both;
    }

    .banner-section .owl-item.active .banner-desc {
        animation: heroRise 760ms cubic-bezier(.2,.8,.2,1) 210ms both;
    }

    .banner-section .owl-item.active .banner-actions {
        animation: heroRise 820ms cubic-bezier(.2,.8,.2,1) 300ms both;
    }

    .banner-section .owl-item.active .banner-badges {
        animation: heroRise 900ms cubic-bezier(.2,.8,.2,1) 380ms both;
    }

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

    @keyframes heroSweep {
        from { background-position: 0% 50%; opacity: 0.55; }
        to   { background-position: 100% 50%; opacity: 1; }
    }

    @media (prefers-reduced-motion: reduce) {
        .banner-section .owl-item .banner-tag,
        .banner-section .owl-item .banner-title,
        .banner-section .owl-item .banner-desc,
        .banner-section .owl-item .banner-actions,
        .banner-section .owl-item .banner-badges {
            opacity: 1;
            transform: none;
            animation: none !important;
        }

        .banner-section .owl-item.active .banner-title .banner-title-highlight::after {
            animation: none !important;
        }
    }

    /* ================================================================
    OWL CAROUSEL — NAV ARROWS
    ================================================================ */

    .banner-section .owl-nav {
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        transform: translateY(-50%);
        display: flex;
        justify-content: space-between;
        pointer-events: none;
        padding: 0 18px;
        z-index: 10;
        margin: 0;
    }

    .banner-section .owl-nav button {
        pointer-events: all;
        width: 48px;
        height: 48px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.13) !important;
        border: 2px solid rgba(255, 255, 255, 0.38) !important;
        font-size: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: background 0.22s, border-color 0.22s, transform 0.22s;
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
    }

    .banner-section .owl-nav button:hover {
        background: rgba(245, 184, 0, 0.90) !important;
        border-color: #f5b800 !important;
        transform: scale(1.12);
    }

    .banner-nav-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 17px;
        color: #ffffff;
        pointer-events: none;
    }

    .banner-section .owl-nav button:hover .banner-nav-icon { color: #060f3a; }

    /* ================================================================
    OWL CAROUSEL — DOTS
    ================================================================ */

    .banner-section .owl-dots {
        position: absolute;
        bottom: 20px;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        gap: 7px;
        z-index: 10;
        margin: 0;
    }

    .banner-section .owl-dot span {
        width: 9px !important;
        height: 9px !important;
        border-radius: 50% !important;
        background: rgba(255, 255, 255, 0.42) !important;
        transition: all 0.3s ease !important;
        margin: 0 !important;
        display: block;
    }

    .banner-section .owl-dot.active span {
        background: #f5b800 !important;
        width: 28px !important;
        border-radius: 5px !important;
    }

    /* ================================================================
    STATS BAR
    ================================================================ */

    .banner-stats {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        background: linear-gradient(135deg, #060f3a 0%, #0d1b5e 100%);
        border-top: 3px solid #f5b800;
    }

    .stat-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 28px 20px;
        gap: 8px;
        text-align: center;
        border-right: 1px solid rgba(245, 184, 0, 0.15);
        transition: background 0.28s;
        cursor: default;
    }

    .stat-card:last-child { border-right: none; }
    .stat-card:hover      { background: rgba(245, 184, 0, 0.07); }

    .stat-icon {
        width: 50px;
        height: 50px;
        border-radius: 50%;
        background: rgba(245, 184, 0, 0.12);
        border: 1px solid rgba(245, 184, 0, 0.30);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 19px;
        margin-bottom: 4px;
    }

    .stat-number {
        font-size: 34px;
        font-weight: 800;
        color: #f5b800;
        line-height: 1;
        letter-spacing: -1px;
    }

    .stat-label {
        font-size: 13px;
        color: #8faadb;
        font-weight: 500;
        letter-spacing: 0.3px;
    }

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

    /* Tablet landscape */
    @media (max-width: 1024px) {
        .banner-section .owl-stage-outer { height: 460px; }
        .banner-slide                    { height: 460px; }
        .banner-content                  { padding: 0 40px; max-width: 580px; }
    }

    /* Tablet portrait */
    @media (max-width: 768px) {
        .banner-section .owl-stage-outer { height: auto !important; }
        .banner-section .owl-stage,
        .banner-section .owl-item        { height: auto !important; }

        .banner-slide {
            height: auto;
            min-height: 420px;
            background-position: 70% center;
            padding: 40px 0;
        }

        .banner-overlay {
            background: linear-gradient(
                100deg,
                rgba(6, 15, 72, 0.97) 0%,
                rgba(6, 15, 72, 0.94) 50%,
                rgba(6, 15, 72, 0.80) 100%
            );
        }

        .banner-content  { padding: 0 28px; max-width: 100%; }
        .banner-desc     { font-size: 14px; }

        .banner-section .owl-nav { display: none; }

        .banner-stats { grid-template-columns: repeat(2, 1fr); }
        .stat-card { border-bottom: 1px solid rgba(245, 184, 0, 0.15); }
        .stat-card:nth-child(2),
        .stat-card:nth-child(4) { border-right: none; }
        .stat-card:nth-child(3),
        .stat-card:nth-child(4) { border-bottom: none; }
    }

    /* Mobile */
    @media (max-width: 480px) {
        .banner-slide        { min-height: 380px; background-position: 65% center; }
        .banner-content      { padding: 0 18px; gap: 14px; }
        .banner-tag          { font-size: 11px; padding: 5px 14px; }
        .banner-title        { font-size: clamp(24px, 7vw, 32px); }
        .banner-desc         { font-size: 13px; display: none; }
        .banner-btn-primary,
        .banner-btn-outline  { padding: 10px 22px; font-size: 13px; }
        .banner-badges       { gap: 12px; }
        .banner-badge        { font-size: 12px; }
        .stat-number         { font-size: 28px; }
        .stat-label          { font-size: 12px; }
        .stat-icon           { width: 42px; height: 42px; font-size: 16px; }
        .stat-card           { padding: 20px 12px; }
    }

    /* ===== Cards ===== */
    .card {
        background-color: #ffffff;
        border-radius: 8px;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
        padding: 24px;
        margin-bottom: 24px;
    }

    .card h2 {
        margin-bottom: 16px;
        font-size: 20px;
        color: #2c3e50;
        border-bottom: 2px solid #1abc9c;
        padding-bottom: 8px;
    }

    /* ===== Buttons ===== */
    .btn {
        display: inline-block;
        padding: 9px 20px;
        border: none;
        border-radius: 5px;
        font-size: 14px;
        cursor: pointer;
        transition: opacity 0.2s;
    }

    .btn:hover {
        opacity: 0.85;
    }

    .btn-primary {
        background-color: #1abc9c;
        color: #fff;
    }

    .btn-danger {
        background-color: #e74c3c;
        color: #fff;
    }

    .btn-secondary {
        background-color: #95a5a6;
        color: #fff;
    }

    /* ===== Forms ===== */
    .form-group {
        margin-bottom: 18px;
    }

    .form-group label {
        display: block;
        margin-bottom: 6px;
        font-weight: 600;
        font-size: 14px;
        color: #555;
    }

    .form-group input,
    .form-group select,
    .form-group textarea {
        width: 100%;
        padding: 9px 12px;
        border: 1px solid #ccc;
        border-radius: 5px;
        font-size: 14px;
        background-color: #fafafa;
        transition: border-color 0.2s;
    }

    .form-group input:focus,
    .form-group select:focus,
    .form-group textarea:focus {
        outline: none;
        border-color: #1abc9c;
        background-color: #fff;
    }

    /* ===== Tables ===== */
    table {
        width: 100%;
        border-collapse: collapse;
        font-size: 14px;
    }

    table thead {
        background-color: #2c3e50;
        color: #fff;
    }

    table thead th {
        padding: 12px 14px;
        text-align: left;
    }

    table tbody tr {
        border-bottom: 1px solid #e0e0e0;
        transition: background 0.15s;
    }

    table tbody tr:hover {
        background-color: #f0faf7;
    }

    table tbody td {
        padding: 11px 14px;
    }

    /* ===== Alerts ===== */
    .alert {
        padding: 12px 16px;
        border-radius: 5px;
        margin-bottom: 16px;
        font-size: 14px;
    }

    .alert-success {
        background-color: #d4edda;
        color: #155724;
        border: 1px solid #c3e6cb;
    }

    .alert-danger {
        background-color: #f8d7da;
        color: #721c24;
        border: 1px solid #f5c6cb;
    }

    .alert-info {
        background-color: #d1ecf1;
        color: #0c5460;
        border: 1px solid #bee5eb;
    }

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

    .about-section {
        background-color: #ffffff;
        padding: 40px 0;
        position: relative;
        overflow: hidden;
    }

    /* Subtle background pattern */
    .about-section::before {
        content: '';
        position: absolute;
        top: -120px;
        right: -120px;
        width: 420px;
        height: 420px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(13, 27, 94, 0.04) 0%, transparent 70%);
        pointer-events: none;
    }

    .about-section::after {
        content: '';
        position: absolute;
        bottom: -100px;
        left: -100px;
        width: 340px;
        height: 340px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(245, 184, 0, 0.06) 0%, transparent 70%);
        pointer-events: none;
    }

    /* ---- Layout Grid ---- */
    .about-container {
        display: grid;
        grid-template-columns: 1fr 1fr;
        align-items: stretch;
        gap: 36px;
        max-width: 1400px;
        margin: 0 auto;
        padding: 0 24px;
        position: relative;
        z-index: 1;
    }

    /* ================================================================
    LEFT: IMAGE BLOCK
    ================================================================ */
    .about-img-block {
        position: relative;
        display: flex;
        flex-direction: column;
    }

    .about-img-frame {
        position: relative;
        border-radius: 16px;
        overflow: visible;
        flex: 1;
        display: flex;
        flex-direction: column;
    }

    /* Gold decorative corner border */
    .about-img-frame::before {
        content: '';
        position: absolute;
        top: -14px;
        left: -14px;
        width: 60%;
        height: 60%;
        border-top: 4px solid #f5b800;
        border-left: 4px solid #f5b800;
        border-radius: 12px 0 0 0;
        z-index: 2;
        pointer-events: none;
    }

    .about-img-frame::after {
        content: '';
        position: absolute;
        bottom: -14px;
        right: -14px;
        width: 60%;
        height: 60%;
        border-bottom: 4px solid #0d1b5e;
        border-right: 4px solid #0d1b5e;
        border-radius: 0 0 12px 0;
        z-index: 2;
        pointer-events: none;
    }

    .about-img {
        width: 100%;
        height: 100%;
        min-height: 260px;
        object-fit: cover;
        border-radius: 16px;
        display: block;
        flex: 1;
        box-shadow: 0 20px 50px rgba(13, 27, 94, 0.15);
    }

    /* Experience Badge */
    .about-badge {
        position: absolute;
        top: 24px;
        right: -20px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        color: #ffffff;
        border-radius: 14px;
        padding: 16px 20px;
        text-align: center;
        box-shadow: 0 8px 24px rgba(13, 27, 94, 0.35);
        z-index: 3;
        min-width: 90px;
    }

    .about-badge-year {
        display: block;
        font-size: 28px;
        font-weight: 800;
        color: #f5b800;
        line-height: 1;
    }

    .about-badge-text {
        display: block;
        font-size: 11px;
        color: #b8cbee;
        margin-top: 4px;
        letter-spacing: 0.5px;
        text-transform: uppercase;
    }

    /* Floating Award Card */
    .about-float-card {
        position: absolute;
        bottom: -22px;
        left: -20px;
        display: flex;
        align-items: center;
        gap: 12px;
        background: #ffffff;
        border-radius: 12px;
        padding: 14px 18px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
        border-left: 4px solid #f5b800;
        z-index: 3;
        animation: floatCard 4s ease-in-out infinite;
    }

    .about-float-card i {
        font-size: 26px;
        color: #f5b800;
        flex-shrink: 0;
    }

    .about-float-card div {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .about-float-card strong {
        font-size: 13px;
        font-weight: 700;
        color: #0d1b5e;
        line-height: 1.3;
    }

    .about-float-card span {
        font-size: 11px;
        color: #6b7280;
    }

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

    /* ================================================================
    RIGHT: TEXT CONTENT
    ================================================================ */
    .about-content {
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    /* Section Tag */
    .section-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13, 27, 94, 0.06);
        border: 1px solid rgba(13, 27, 94, 0.15);
        color: #0d1b5e;
        font-size: 13px;
        font-weight: 700;
        padding: 6px 16px;
        border-radius: 30px;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        width: fit-content;
    }

    .section-tag i {
        color: #f5b800;
        font-size: 13px;
    }

    /* Heading */
    .about-heading {
        font-size: clamp(26px, 3vw, 40px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.25;
        margin: 0;
    }

    .about-heading-accent {
        color: #f5b800;
        position: relative;
        display: inline-block;
    }

    .about-heading-accent::after {
        content: '';
        position: absolute;
        left: 0;
        bottom: -4px;
        width: 100%;
        height: 3px;
        background: linear-gradient(90deg, #f5b800, transparent);
        border-radius: 2px;
    }

    /* Paragraphs */
    .about-text {
        font-size: 15.5px;
        color: #4b5563;
        line-height: 1.8;
        margin: 0;
    }

    .about-text strong {
        color: #0d1b5e;
        font-weight: 700;
    }

    /* ---- Highlights Grid ---- */
    .about-highlights {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .about-highlight-item {
        display: flex;
        align-items: flex-start;
        gap: 14px;
        background: #f8faff;
        border: 1px solid #e8edf8;
        border-radius: 12px;
        padding: 16px;
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

    .about-highlight-item:hover {
        transform: translateY(-4px);
        box-shadow: 0 8px 24px rgba(13, 27, 94, 0.1);
        border-color: #f5b800;
    }

    .about-highlight-icon {
        width: 44px;
        height: 44px;
        border-radius: 10px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 17px;
        flex-shrink: 0;
    }

    .about-highlight-item div {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .about-highlight-item strong {
        font-size: 14px;
        font-weight: 700;
        color: #0d1b5e;
        line-height: 1.3;
    }

    .about-highlight-item p {
        font-size: 12.5px;
        color: #6b7280;
        margin: 0;
        line-height: 1.5;
    }

    /* ---- Know More Button ---- */
    .about-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        color: #ffffff;
        font-size: 15px;
        font-weight: 700;
        padding: 14px 32px;
        border-radius: 50px;
        text-decoration: none;
        letter-spacing: 0.3px;
        width: fit-content;
        box-shadow: 0 6px 20px rgba(13, 27, 94, 0.3);
        transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
        position: relative;
        overflow: hidden;
    }

    .about-btn::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        transition: left 0.35s ease;
        z-index: 0;
    }

    .about-btn:hover::before {
        left: 0;
    }

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

    .about-btn:hover {
        color: #0d1b5e;
        transform: translateY(-3px);
        box-shadow: 0 10px 28px rgba(245, 184, 0, 0.4);
    }

    .about-btn i {
        transition: transform 0.25s ease;
    }

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

    /* ================================================================
    ABOUT SECTION RESPONSIVE
    ================================================================ */
    @media (max-width: 1024px) {
        .about-container {
            gap: 28px;
            padding: 0 20px;
        }

        .about-img {
            min-height: 240px;
        }
    }

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

        .about-container {
            grid-template-columns: 1fr;
            align-items: start;
            gap: 40px;
            padding: 0 16px;
        }

        /* Back to fixed height on single column — equal height not needed */
        .about-img-block {
            margin: 0 12px;
            display: block;
        }

        .about-img-frame {
            display: block;
        }

        .about-img {
            height: 220px;
            min-height: unset;
            flex: unset;
        }

        .about-badge {
            right: 10px;
            top: 16px;
        }

        .about-float-card {
            left: 0;
            bottom: -26px;
        }

        .about-highlights {
            grid-template-columns: 1fr;
        }
    }

    @media (max-width: 480px) {
        .about-section {
            padding: 24px 0;
        }

        .about-img-block {
            margin: 0 8px;
        }

        .about-img {
            height: 180px;
        }

        .about-float-card {
            padding: 10px 14px;
        }

        .about-float-card strong {
            font-size: 12px;
        }

        .about-btn {
            width: 100%;
            justify-content: center;
        }
    }

    /* ================================================================
    FACILITIES SECTION
    ================================================================ */
    .facilities-section {
        background-color: #f4f7ff;
        background-image:
            linear-gradient(160deg, rgba(13, 27, 94, 0.03) 0%, rgba(245, 184, 0, 0.04) 100%),
            linear-gradient(rgba(13, 27, 94, 0.06) 1px, transparent 1px),
            linear-gradient(90deg, rgba(13, 27, 94, 0.06) 1px, transparent 1px);
        background-size: 100% 100%, 40px 40px, 40px 40px;
        background-position: 0 0, 0 0, 0 0;
        padding: 19px 0 19px;
        position: relative;
        overflow: hidden;
    }

    /* Decorative background blobs */
    .facilities-section::before {
        content: '';
        position: absolute;
        top: -80px;
        left: -80px;
        width: 360px;
        height: 360px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(13,27,94,0.05) 0%, transparent 70%);
        pointer-events: none;
    }

    .facilities-section::after {
        content: '';
        position: absolute;
        bottom: -60px;
        right: -60px;
        width: 300px;
        height: 300px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(245,184,0,0.08) 0%, transparent 70%);
        pointer-events: none;
    }

    /* ---- Section Header ---- */
    .facilities-header {
        text-align: center;
        max-width: 680px;
        margin: 0 auto 52px;
        padding: 0 20px;
        position: relative;
        z-index: 1;
    }

    .facilities-tag {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(13, 27, 94, 0.07);
        border: 1px solid rgba(13, 27, 94, 0.15);
        color: #0d1b5e;
        font-size: 12.5px;
        font-weight: 700;
        padding: 5px 16px;
        border-radius: 30px;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        margin-bottom: 14px;
    }

    .facilities-tag i {
        color: #f5b800;
        font-size: 11px;
    }

    .facilities-heading {
        font-size: clamp(28px, 3.5vw, 42px);
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 14px;
        letter-spacing: -0.5px;
        line-height: 1.2;
    }

    .facilities-heading-accent {
        color: #f5b800;
        position: relative;
        display: inline-block;
    }

    .facilities-heading-accent::after {
        content: '';
        position: absolute;
        left: 0;
        bottom: -5px;
        width: 100%;
        height: 3px;
        background: linear-gradient(90deg, #f5b800, transparent);
        border-radius: 2px;
    }

    .facilities-subtext {
        font-size: 15px;
        color: #6b7280;
        line-height: 1.7;
    }

    /* ---- Facilities Grid ---- */
    .facilities-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
        max-width: 1280px;
        margin: 0 auto;
        padding: 0 32px;
        position: relative;
        z-index: 1;
    }

    /* ---- Facility Card ---- */
    .facility-card {
        position: relative;
        background: #ffffff;
        border-radius: 20px;
        padding: 36px 22px 28px;
        text-align: center;
        border: 1.5px solid #e8edf8;
        overflow: hidden;
        cursor: default;
        animation: facilityFadeUp 0.6s ease both;
        animation-delay: var(--delay, 0s);
        transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    }

    .facility-card:hover {
        transform: translateY(-8px);
        box-shadow: 0 20px 48px rgba(13, 27, 94, 0.13);
        border-color: #f5b800;
    }

    /* Shimmer line on top of card */
    .facility-card::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 3px;
        background: linear-gradient(90deg, #0d1b5e, #f5b800, #0d1b5e);
        background-size: 200% 100%;
        opacity: 0;
        transition: opacity 0.3s ease;
        animation: shimmerLine 2.5s linear infinite;
    }

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

    @keyframes shimmerLine {
        0%   { background-position: 200% 0; }
        100% { background-position: -200% 0; }
    }

    /* ---- Icon Wrapper ---- */
    .facility-icon-wrap {
        width: 72px;
        height: 72px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 18px;
        font-size: 28px;
        color: #ffffff;
        position: relative;
        z-index: 1;
        transition: transform 0.3s ease;
    }

    .facility-card:hover .facility-icon-wrap {
        transform: scale(1.12) rotate(-5deg);
    }

    /* Individual icon gradients */
    .facility-icon--sports   { background: linear-gradient(135deg, #2196f3, #0d47a1); }
    .facility-icon--library  { background: linear-gradient(135deg, #43a047, #1b5e20); }
    .facility-icon--canteen  { background: linear-gradient(135deg, #f5b800, #e07b00); }
    .facility-icon--hostel   { background: linear-gradient(135deg, #8e24aa, #4a148c); }
    .facility-icon--transport{ background: linear-gradient(135deg, #1e88e5, #0d1b5e); }
    .facility-icon--computer { background: linear-gradient(135deg, #00acc1, #006064); }
    .facility-icon--health   { background: linear-gradient(135deg, #00c853, #1b5e20); }
    .facility-icon--placement{ background: linear-gradient(135deg, #0d1b5e, #1a2f8a); }

    /* ---- Glow blob behind icon ---- */
    .facility-glow {
        position: absolute;
        top: 18px;
        left: 50%;
        transform: translateX(-50%);
        width: 90px;
        height: 90px;
        border-radius: 50%;
        opacity: 0;
        filter: blur(22px);
        transition: opacity 0.35s ease;
        pointer-events: none;
        z-index: 0;
    }

    .facility-card:hover .facility-glow {
        opacity: 0.35;
    }

    .facility-glow--sports    { background: #2196f3; }
    .facility-glow--library   { background: #43a047; }
    .facility-glow--canteen   { background: #f5b800; }
    .facility-glow--hostel    { background: #8e24aa; }
    .facility-glow--transport { background: #1e88e5; }
    .facility-glow--computer  { background: #00acc1; }
    .facility-glow--health    { background: #00c853; }
    .facility-glow--placement { background: #1a2f8a; }

    /* ---- Card Text ---- */
    .facility-name {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        text-transform: uppercase;
        letter-spacing: 0.8px;
        margin-bottom: 10px;
    }

    .facility-desc {
        font-size: 13px;
        color: #6b7280;
        line-height: 1.65;
        margin: 0;
    }

    /* ---- Entrance Animation ---- */
    @keyframes facilityFadeUp {
        from { opacity: 0; transform: translateY(30px); }
        to   { opacity: 1; transform: translateY(0); }
    }

    /* ================================================================
    FACILITIES RESPONSIVE
    ================================================================ */
    @media (max-width: 1024px) {
        .facilities-grid {
            grid-template-columns: repeat(4, 1fr);
            gap: 18px;
            padding: 0 20px;
        }

        .facility-icon-wrap {
            width: 62px;
            height: 62px;
            font-size: 24px;
        }
    }

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

        .facilities-grid {
            grid-template-columns: repeat(2, 1fr);
            gap: 16px;
            padding: 0 16px;
        }

        .facilities-header {
            margin-bottom: 36px;
        }
    }

    @media (max-width: 480px) {
        .facilities-section {
            padding: 40px 0 50px;
        }

        .facilities-grid {
            grid-template-columns: repeat(2, 1fr);
            gap: 12px;
            padding: 0 12px;
        }

        .facility-card {
            padding: 26px 14px 20px;
        }

        .facility-icon-wrap {
            width: 54px;
            height: 54px;
            font-size: 20px;
        }

        .facility-name {
            font-size: 13px;
        }

        .facility-desc {
            display: none;
        }
    }

    /* ================================================================
    COURSES SECTION
    ================================================================ */
    .courses-section {
        /* Background image + overlays (keeps text readable) */
        background-color: #0a1540;
        background-image: url('../img/courses/courses-bg.png');
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        padding: 15px 0 10px;
        position: relative;
        overflow: hidden;
    }

    /* Gradient + lightweight shadow/vignette above the image */
    .courses-section::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background:
            linear-gradient(135deg, rgba(10, 21, 64, 0.88) 0%, rgba(13, 27, 94, 0.68) 45%, rgba(245, 184, 0, 0.12) 100%),
            radial-gradient(circle at 20% 20%, rgba(245, 184, 0, 0.20), transparent 52%),
            radial-gradient(circle at 85% 75%, rgba(255, 255, 255, 0.10), transparent 54%);
        box-shadow:
            inset 0 80px 110px rgba(0, 0, 0, 0.30),
            inset 0 -90px 140px rgba(0, 0, 0, 0.35);
    }

    /* Subtle dot-grid texture */
    .courses-bg-dots {
        position: absolute;
        inset: 0;
        background-image: radial-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px);
        background-size: 28px 28px;
        pointer-events: none;
        z-index: 1;
        opacity: 0.55;
    }

    /* ---- Section Header ---- */
    .courses-header {
        text-align: center;
        max-width: 680px;
        margin: 0 auto 54px;
        padding: 0 20px;
        position: relative;
        z-index: 1;
    }

    .courses-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(245, 184, 0, 0.12);
        border: 1px solid rgba(245, 184, 0, 0.35);
        color: #f5b800;
        font-size: 12px;
        font-weight: 700;
        padding: 6px 18px;
        border-radius: 50px;
        letter-spacing: 0.7px;
        text-transform: uppercase;
        margin-bottom: 16px;
    }

    .courses-tag i { font-size: 11px; }

    .courses-heading {
        font-size: clamp(26px, 3.5vw, 40px);
        font-weight: 800;
        color: #ffffff;
        line-height: 1.2;
        margin: 0 0 14px;
        letter-spacing: 0.2px;
    }

    .courses-heading-accent {
        color: #f5b800;
    }

    .courses-subtext {
        font-size: 15px;
        color: rgba(255, 255, 255, 0.62);
        line-height: 1.75;
        margin: 0;
    }

    /* ---- Carousel Wrapper ---- */
    .courses-carousel-wrap {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 24px 24px;
        position: relative;
        z-index: 1;
    }

    @media (max-width: 768px) {
        .courses-section {
            background-position: 35% center;
        }
    }

    @media (max-width: 480px) {
        .courses-section {
            background-position: 30% center;
        }
    }

    /* ---- Owl Nav ---- */
    .courses-owl .owl-nav {
        display: flex;
        justify-content: center;
        gap: 12px;
        margin-top: 32px;
    }

    .courses-owl .owl-nav button {
        width: 44px;
        height: 44px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.10) !important;
        border: 2px solid rgba(255, 255, 255, 0.22) !important;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 0;
        transition: background 0.22s, border-color 0.22s, transform 0.22s;
    }

    .courses-owl .owl-nav button:hover {
        background: rgba(245, 184, 0, 0.90) !important;
        border-color: #f5b800 !important;
        transform: scale(1.1);
    }

    .owl-nav-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 15px;
        color: #ffffff;
        pointer-events: none;
    }

    .courses-owl .owl-nav button:hover .owl-nav-icon { color: #0d1b5e; }

    /* ---- Owl Dots ---- */
    .courses-owl .owl-dots {
        display: flex;
        justify-content: center;
        gap: 7px;
        margin-top: 20px;
    }

    .courses-owl .owl-dot span {
        width: 9px !important;
        height: 9px !important;
        border-radius: 50% !important;
        background: rgba(255, 255, 255, 0.28) !important;
        margin: 0 !important;
        transition: all 0.3s !important;
        display: block;
    }

    .courses-owl .owl-dot.active span {
        background: #f5b800 !important;
        width: 26px !important;
        border-radius: 5px !important;
    }

    /* ================================================================
    STUDENT COUNSELLING (Admission) — Owl topic carousel
    ================================================================ */
    .sc-counselling-page {
        overflow-x: hidden;
    }
    .sc-counselling-page .sc-hero-prog-strip {
        margin-top: 20px;
        max-width: 900px;
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        align-items: center;
    }
    .sc-counselling-page .sc-hero-prog-chip {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 8px 14px;
        border-radius: 999px;
        font-size: 13px;
        font-weight: 600;
        color: #0d1b5e;
        background: rgba(255, 255, 255, 0.92);
        border: 1px solid rgba(255, 255, 255, 0.55);
        text-decoration: none;
        transition: background 0.2s, transform 0.2s, box-shadow 0.2s;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
        max-width: 100%;
        text-align: center;
        word-break: break-word;
        hyphens: auto;
    }
    .sc-counselling-page .sc-hero-prog-chip:hover {
        background: #f5b800;
        border-color: #f5b800;
        color: #0d1b5e;
        transform: translateY(-1px);
    }
    .sc-counselling-page .sc-hero-empty {
        margin-top: 16px;
        color: rgba(248, 250, 252, 0.92);
        max-width: 560px;
    }
    .sc-counselling-page .sc-hero-empty a {
        color: #f5b800;
        font-weight: 600;
    }

    .sc-carousel-section {
        padding: 48px 0 56px;
        background: linear-gradient(180deg, #f1f5f9 0%, #e8eef8 100%);
    }
    .sc-carousel-inner {
        max-width: 1100px;
        margin: 0 auto;
        padding: 0 20px;
    }
    .sc-carousel-head {
        text-align: center;
        margin-bottom: 22px;
    }
    .sc-carousel-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: #0d1b5e;
        background: rgba(13, 27, 94, 0.08);
        padding: 6px 14px;
        border-radius: 999px;
    }
    .sc-carousel-title {
        font-size: clamp(1.45rem, 3vw, 2rem);
        color: #0f172a;
        margin: 14px 0 8px;
        line-height: 1.25;
    }
    .sc-carousel-accent {
        color: #0d1b5e;
    }
    .sc-carousel-lead {
        color: #475569;
        font-size: 15px;
        line-height: 1.55;
        max-width: 640px;
        margin: 0 auto;
    }

    .sc-jump-nav {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
        margin-bottom: 22px;
    }
    .sc-jump-btn {
        font-size: 12px;
        font-weight: 600;
        padding: 8px 12px;
        border-radius: 999px;
        border: 1px solid #cbd5e1;
        background: #fff;
        color: #334155;
        cursor: pointer;
        transition: background 0.2s, border-color 0.2s, color 0.2s;
        touch-action: manipulation;
    }
    .sc-jump-btn:hover {
        border-color: #0d1b5e;
        color: #0d1b5e;
        background: #f8fafc;
    }
    .sc-jump-btn.sc-jump-btn--active {
        background: linear-gradient(135deg, #0d1b5e 0%, #1e3a8a 100%);
        border-color: #0d1b5e;
        color: #fff;
        box-shadow: 0 4px 14px rgba(13, 27, 94, 0.35);
    }
    .sc-jump-btn.sc-jump-btn--active:hover {
        background: linear-gradient(135deg, #152a7a 0%, #1d4ed8 100%);
        border-color: #152a7a;
        color: #fff;
    }
    .sc-jump-btn:focus-visible {
        outline: 2px solid #f5b800;
        outline-offset: 2px;
    }

    .sc-counselling-owl .owl-stage-outer {
        overflow: hidden;
        width: 100%;
    }
    .sc-counselling-owl .sc-slide {
        padding: 4px 6px 12px;
        box-sizing: border-box;
        max-width: 100%;
    }
    .sc-slide-card {
        background: #fff;
        border-radius: 18px;
        box-shadow: 0 12px 40px rgba(15, 23, 42, 0.1);
        border: 1px solid #e2e8f0;
        overflow: hidden;
        min-height: 280px;
        display: flex;
        flex-direction: column;
    }
    .sc-slide-card-head {
        display: flex;
        gap: 16px;
        align-items: flex-start;
        padding: 22px 22px 16px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1e3a8a 100%);
        color: #f8fafc;
    }
    .sc-slide-icon {
        width: 48px;
        height: 48px;
        border-radius: 14px;
        background: rgba(245, 184, 0, 0.2);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        flex-shrink: 0;
    }
    .sc-slide-title {
        margin: 0 0 6px;
        font-size: 1.25rem;
        line-height: 1.3;
    }
    .sc-slide-kicker {
        margin: 0;
        font-size: 13px;
        opacity: 0.9;
        line-height: 1.45;
    }
    .sc-slide-body {
        padding: 18px 22px 22px;
        overflow-x: auto;
        overflow-y: visible;
        flex: 1;
        font-size: 15px;
        line-height: 1.65;
        color: #334155;
        max-width: 100%;
        -webkit-overflow-scrolling: touch;
    }
    .sc-slide-body img {
        max-width: 100%;
        height: auto;
    }
    .sc-slide-body a {
        color: #0d1b5e;
        font-weight: 600;
    }

    .sc-prog-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
        gap: 16px;
        align-items: stretch;
        width: 100%;
        min-width: 0;
    }
    .sc-prog-grid--faculty {
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    }
    .sc-prog-card {
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 14px;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        min-height: 100%;
    }
    .sc-prog-card__head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 10px;
        padding: 14px 16px;
        background: linear-gradient(180deg, #fff 0%, #f1f5f9 100%);
        border-bottom: 1px solid #e2e8f0;
    }
    .sc-prog-card__title {
        margin: 0;
        font-size: 1rem;
        line-height: 1.35;
        color: #0f172a;
        flex: 1;
        min-height: calc(2 * 1.35em);
        min-width: 0;
    }
    .sc-prog-card__title--solo {
        padding: 14px 16px 0;
        min-height: calc(2 * 1.35em);
    }
    .sc-prog-card__link {
        flex-shrink: 0;
        font-size: 12px;
        font-weight: 700;
        color: #0d1b5e !important;
        text-decoration: none;
        white-space: nowrap;
    }
    .sc-prog-card__link:hover {
        text-decoration: underline;
    }
    .sc-prog-card__body {
        padding: 14px 16px 16px;
        flex: 1;
    }
    .sc-prog-card__muted {
        margin: 0;
        font-size: 14px;
        color: #64748b;
        line-height: 1.5;
    }
    .sc-prog-card__note {
        margin: 10px 0 0;
        font-size: 13px;
        color: #475569;
    }
    .sc-prog-inline-link {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        margin-top: 10px;
        font-size: 13px;
        font-weight: 600;
        color: #0d1b5e !important;
    }
    .sc-html--compact {
        font-size: 14px;
        line-height: 1.55;
    }
    .sc-html--compact p {
        margin: 0 0 0.5em;
    }
    .sc-html--compact p:last-child {
        margin-bottom: 0;
    }
    .sc-list--compact {
        margin-top: 8px;
    }
    .sc-list--compact li {
        padding: 4px 0 4px 24px;
        font-size: 14px;
        border-bottom: none;
    }
    .sc-list--compact li + li {
        border-top: 1px solid #e2e8f0;
    }
    .sc-list--compact .fa-circle-check {
        top: 8px;
        font-size: 13px;
    }
    .sc-facts--compact {
        margin-top: 10px;
        font-size: 14px;
    }
    .sc-facts--compact li {
        margin: 4px 0;
    }
    .sc-excerpt--in-card {
        margin-top: 10px;
        font-size: 14px;
        line-height: 1.55;
        color: #475569;
    }
    .sc-details-more--tight {
        margin-top: 10px;
        padding: 8px 12px;
    }
    .sc-cta--small {
        padding: 8px 12px;
        font-size: 13px;
        margin-top: 0;
        margin-bottom: 6px;
    }
    .sc-fee-summary--inline {
        margin-bottom: 8px;
    }
    .sc-after-grid {
        margin-top: 8px;
    }
    .sc-faculty-actions--stack {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        padding: 0 16px 16px;
    }
    .sc-prog-card--faculty {
        background: #fff;
    }
    .sc-prose .sc-html--boxed {
        margin-top: 12px;
        padding: 14px;
        background: #f8fafc;
        border-radius: 12px;
        border: 1px solid #e2e8f0;
    }
    .sc-prose .sc-html ul,
    .sc-prose .sc-html ol {
        margin: 0.5em 0 0.5em 1.1em;
        padding: 0;
    }
    .sc-list {
        list-style: none;
        margin: 12px 0 0;
        padding: 0;
    }
    .sc-list li {
        position: relative;
        padding: 6px 0 6px 28px;
        border-bottom: 1px solid #f1f5f9;
    }
    .sc-list li:last-child {
        border-bottom: none;
    }
    .sc-list .fa-circle-check {
        position: absolute;
        left: 0;
        top: 10px;
        color: #0d1b5e;
        font-size: 14px;
    }
    .sc-facts {
        margin: 14px 0 0;
        padding-left: 1.1rem;
        color: #475569;
    }
    .sc-facts li {
        margin: 6px 0;
    }
    .sc-note {
        font-size: 13px;
        color: #64748b;
        margin-top: 14px;
    }
    .sc-excerpt {
        margin: 12px 0 0;
    }
    .sc-details-more {
        margin-top: 14px;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        padding: 10px 14px;
        background: #fafafa;
    }
    .sc-details-more summary {
        cursor: pointer;
        font-weight: 600;
        color: #0d1b5e;
    }
    .sc-cta {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        margin-top: 10px;
        margin-right: 8px;
        padding: 10px 16px;
        border-radius: 10px;
        background: #0d1b5e;
        color: #fff !important;
        font-size: 14px;
        font-weight: 600;
        text-decoration: none;
        border: 2px solid #0d1b5e;
    }
    .sc-cta:hover {
        background: #1e3a8a;
        border-color: #1e3a8a;
    }
    .sc-cta--ghost {
        background: transparent;
        color: #0d1b5e !important;
        border-color: #cbd5e1;
    }
    .sc-cta--ghost:hover {
        background: #f1f5f9;
        border-color: #0d1b5e;
    }

    .sc-hostel-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr));
        gap: 10px;
        margin: 14px 0;
        min-width: 0;
    }
    .sc-hostel-chip {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        font-weight: 600;
        padding: 10px 12px;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        color: #334155;
    }
    .sc-hostel-chip i {
        color: #0d1b5e;
    }

    .sc-slide-body .sc-hostel-grid + .sc-note {
        margin-top: 12px;
    }
    .sc-slide-body .sc-note + .sc-list--compact {
        margin-top: 8px;
    }

    .sc-fee-summary {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        margin-bottom: 12px;
    }
    .sc-fee-pill {
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        padding: 12px 16px;
        min-width: 140px;
        box-sizing: border-box;
    }
    .sc-fee-pill span {
        display: block;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: #64748b;
        margin-bottom: 4px;
    }
    .sc-fee-pill strong {
        font-size: 1.1rem;
        color: #0f172a;
    }

    .sc-campus-list {
        list-style: none;
        margin: 0;
        padding: 0;
    }
    .sc-campus-list li {
        padding: 12px 0;
        border-bottom: 1px solid #f1f5f9;
    }
    .sc-campus-list li:last-child {
        border-bottom: none;
    }
    .sc-campus-snippet {
        display: block;
        margin-top: 4px;
        font-size: 14px;
        color: #64748b;
        font-weight: 400;
    }

    .sc-faculty-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 8px;
    }

    .sc-counselling-owl .owl-nav {
        display: flex;
        justify-content: center;
        gap: 14px;
        margin-top: 20px;
    }
    .sc-counselling-owl .owl-nav button {
        width: 46px;
        height: 46px;
        border-radius: 50%;
        background: #fff !important;
        border: 2px solid #cbd5e1 !important;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: background 0.2s, border-color 0.2s, transform 0.2s;
    }
    .sc-counselling-owl .owl-nav button:hover {
        background: #f5b800 !important;
        border-color: #f5b800 !important;
        transform: scale(1.06);
    }
    .sc-owl-nav-icon {
        font-size: 16px;
        color: #0d1b5e;
        pointer-events: none;
    }
    .sc-counselling-owl .owl-nav button:hover .sc-owl-nav-icon {
        color: #0d1b5e;
    }
    .sc-counselling-owl .owl-dots {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 14px;
    }
    .sc-counselling-owl .owl-dot span {
        width: 8px !important;
        height: 8px !important;
        margin: 0 !important;
        background: #cbd5e1 !important;
        border-radius: 50% !important;
    }
    .sc-counselling-owl .owl-dot.active span {
        background: #0d1b5e !important;
        width: 22px !important;
        border-radius: 999px !important;
    }

    .sc-cta-section {
        background: #0d1b5e;
        padding: 44px 20px 52px;
        text-align: center;
    }
    .sc-cta-inner {
        max-width: 720px;
        margin: 0 auto;
    }
    .sc-cta-title {
        color: #fff;
        font-size: clamp(1.35rem, 2.5vw, 1.75rem);
        margin: 0 0 10px;
    }
    .sc-cta-text {
        color: rgba(248, 250, 252, 0.88);
        font-size: 15px;
        line-height: 1.6;
        margin: 0 0 20px;
    }
    .sc-cta-btns {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
    }
    .sc-cta--light {
        background: #f5b800;
        border-color: #f5b800;
        color: #0d1b5e !important;
    }
    .sc-cta--light:hover {
        filter: brightness(1.06);
        background: #f5b800;
        border-color: #f5b800;
    }
    .sc-cta--on-dark {
        border-color: rgba(255, 255, 255, 0.45);
        color: #fff !important;
    }
    .sc-cta--on-dark:hover {
        background: rgba(255, 255, 255, 0.12);
        border-color: #fff;
    }

    @media (max-width: 767px) {
        .sc-carousel-section {
            padding: 32px 0 40px;
        }
        .sc-carousel-inner {
            padding: 0 clamp(12px, 4vw, 20px);
            max-width: 100%;
        }
        .sc-carousel-lead {
            font-size: 14px;
        }
        .sc-jump-nav {
            flex-wrap: nowrap;
            justify-content: flex-start;
            overflow-x: auto;
            overflow-y: hidden;
            -webkit-overflow-scrolling: touch;
            scrollbar-width: thin;
            gap: 8px;
            padding: 4px 2px 10px;
            margin: 0 -4px 18px;
        }
        .sc-jump-btn {
            flex: 0 0 auto;
            min-height: 44px;
            padding: 10px 14px;
            font-size: 13px;
        }
        .sc-slide-card-head {
            padding: 16px 16px 14px;
            gap: 12px;
        }
        .sc-slide-icon {
            width: 42px;
            height: 42px;
            font-size: 19px;
            border-radius: 12px;
        }
        .sc-slide-title {
            font-size: 1.1rem;
        }
        .sc-slide-kicker {
            font-size: 12px;
        }
        .sc-slide-body {
            padding: 14px 16px 18px;
            font-size: 14px;
        }
        .sc-counselling-page .sc-hero-prog-strip {
            justify-content: center;
        }
        .sc-counselling-page .sc-hero-prog-chip {
            font-size: 12px;
            padding: 9px 12px;
        }
        .sc-cta-section {
            padding: 36px clamp(14px, 4vw, 20px) 44px;
        }
        .sc-cta-btns {
            flex-direction: column;
            align-items: stretch;
        }
        .sc-cta-section .sc-cta {
            width: 100%;
            justify-content: center;
            margin-right: 0;
            box-sizing: border-box;
        }
    }

    @media (max-width: 640px) {
        .sc-prog-grid,
        .sc-prog-grid--faculty {
            grid-template-columns: 1fr;
        }
        .sc-prog-card__head {
            flex-direction: column;
            align-items: stretch;
            gap: 10px;
        }
        .sc-prog-card__link {
            align-self: flex-start;
            white-space: normal;
        }
        .sc-prog-card__title {
            min-height: 0;
        }
        .sc-hostel-grid {
            grid-template-columns: 1fr;
        }
        .sc-fee-summary--inline {
            flex-direction: column;
        }
        .sc-fee-pill {
            width: 100%;
            min-width: 0;
        }
        .sc-faculty-actions {
            flex-direction: column;
        }
        .sc-faculty-actions .sc-cta {
            width: 100%;
            justify-content: center;
            box-sizing: border-box;
        }
        .sc-slide-body .sc-cta {
            display: flex;
            width: 100%;
            max-width: 100%;
            margin-right: 0;
            justify-content: center;
            box-sizing: border-box;
        }
    }

    @media (max-width: 480px) {
        .sc-slide-card {
            border-radius: 14px;
            min-height: 0;
        }
        .sc-slide-card-head {
            flex-direction: column;
            align-items: flex-start;
        }
        .sc-slide-icon {
            margin-bottom: 2px;
        }
        .sc-counselling-owl .owl-nav button {
            width: 48px;
            height: 48px;
        }
    }

    /* ================================================================
    PROGRAMME CARD — new design
    ================================================================ */
    .prog-card {
        background: #ffffff;
        border-radius: 16px;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        margin: 8px 0 16px;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
        transition: transform 0.28s ease, box-shadow 0.28s ease;
    }

    .prog-card:hover {
        transform: translateY(-8px);
        box-shadow: 0 18px 48px rgba(0, 0, 0, 0.22);
    }

    /* ---- Card Header (coloured panel) ---- */
    .prog-card-header {
        padding: 28px 24px;
        display: flex;
        align-items: center;
        gap: 18px;
    }

    /* Per-programme header gradients */
    .prog-hdr--bba  { background: linear-gradient(135deg, #1a237e 0%, #3949ab 100%); }
    .prog-hdr--bca  { background: linear-gradient(135deg, #00695c 0%, #00acc1 100%); }
    .prog-hdr--bsw  { background: linear-gradient(135deg, #6a1b9a 0%, #ab47bc 100%); }
    .prog-hdr--pmir { background: linear-gradient(135deg, #bf360c 0%, #ff7043 100%); }
    .prog-hdr--msw  { background: linear-gradient(135deg, #1b5e20 0%, #43a047 100%); }
    .prog-hdr--default { background: linear-gradient(135deg, #0d1b5e 0%, #3949ab 100%); }

    /* Icon circle */
    .prog-icon-wrap {
        width: 62px;
        height: 62px;
        min-width: 62px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.18);
        border: 2px solid rgba(255, 255, 255, 0.30);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
        color: #ffffff;
        transition: transform 0.28s ease;
    }

    .prog-card:hover .prog-icon-wrap {
        transform: rotate(-8deg) scale(1.10);
    }

    /* Abbreviation + level text */
    .prog-hdr-info {
        display: flex;
        flex-direction: column;
        gap: 5px;
    }

    .prog-abbr {
        font-size: 26px;
        font-weight: 900;
        color: #ffffff;
        letter-spacing: 2px;
        line-height: 1;
        text-transform: uppercase;
    }

    .prog-level {
        display: inline-flex;
        align-items: center;
        background: rgba(255, 255, 255, 0.18);
        color: rgba(255, 255, 255, 0.90);
        font-size: 11px;
        font-weight: 700;
        padding: 3px 10px;
        border-radius: 50px;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        width: fit-content;
    }

    /* ---- Card Body ---- */
    .prog-card-body {
        padding: 20px 22px 14px;
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .prog-title {
        font-size: 17px;
        font-weight: 700;
        color: #0d1b5e;
        line-height: 1.35;
        margin: 0;
    }

    .prog-desc {
        font-size: 13.5px;
        color: #5a6782;
        line-height: 1.72;
        margin: 0;
        flex: 1;
    }

    /* CKEditor / safe HTML from `courses.short_description` on homepage */
    .prog-desc--rich {
        font-size: 13.5px;
        color: #5a6782;
        line-height: 1.65;
        margin: 0;
        flex: 1;
    }
    .prog-desc--rich p {
        margin: 0 0 0.5em;
    }
    .prog-desc--rich p:last-child {
        margin-bottom: 0;
    }
    .prog-desc--rich ul,
    .prog-desc--rich ol {
        margin: 0.35em 0 0.5em 1.1em;
        padding: 0;
    }
    .prog-desc--rich li {
        margin: 0.2em 0;
    }
    .prog-desc--rich strong,
    .prog-desc--rich b {
        color: #0d1b5e;
        font-weight: 700;
    }

    .prog-chip--focus {
        background: #eef6ff;
    }

    /* Chips row */
    .prog-chips {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 4px;
    }

    .prog-chip {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        background: #f0f4ff;
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 600;
        padding: 4px 12px;
        border-radius: 50px;
        white-space: nowrap;
    }

    .prog-chip i { color: #0d1b5e; font-size: 11px; }

    /* UG/PG approval chips */
    .prog-chip--ug {
        background: rgba(13, 27, 94, 0.09);
        color: #0d1b5e;
        font-weight: 700;
    }

    .prog-chip--pg {
        background: rgba(191, 54, 12, 0.09);
        color: #bf360c;
        font-weight: 700;
    }

    /* ---- Card Footer ---- */
    .prog-card-foot {
        padding: 14px 22px 22px;
        border-top: 1px solid #f0f2f8;
    }

    .prog-cta {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        color: #0d1b5e;
        font-size: 13.5px;
        font-weight: 700;
        text-decoration: none;
        letter-spacing: 0.2px;
        transition: gap 0.22s, color 0.22s;
    }

    .prog-cta i {
        font-size: 12px;
        transition: transform 0.22s;
    }

    .prog-cta:hover {
        color: #e07b00;
        gap: 14px;
        text-decoration: none;
    }

    .prog-cta:hover i { transform: translateX(3px); }

    /* ================================================================
    COURSES RESPONSIVE
    ================================================================ */
    @media (max-width: 768px) {
        .courses-section         { padding: 52px 0 60px; }
        .courses-header          { margin-bottom: 38px; }
        .courses-carousel-wrap   { padding: 0 16px 16px; }
    }

    @media (max-width: 480px) {
        .courses-section         { padding: 40px 0 50px; }
        .courses-carousel-wrap   { padding: 0 12px 12px; }
        .prog-abbr               { font-size: 22px; }
        .prog-icon-wrap          { width: 52px; height: 52px; min-width: 52px; font-size: 20px; }
        .prog-title              { font-size: 15px; }
        .prog-cta                { font-size: 13px; }
    }

    /* ================================================================
    SOCIAL SECTION (Facebook + Instagram embeds)
    ================================================================ */
    .social-section {
        background: linear-gradient(145deg, #f4f7ff 0%, #ffffff 55%, #f8fafc 100%);
        padding: 74px 0;
        position: relative;
        overflow: hidden;
    }

    .social-section::before {
        content: "";
        position: absolute;
        inset: -2px;
        pointer-events: none;
        background:
            radial-gradient(circle at 15% 10%, rgba(245,184,0,0.14), transparent 55%),
            radial-gradient(circle at 85% 70%, rgba(13,27,94,0.10), transparent 55%);
    }

    .social-inner {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 24px;
        position: relative;
        z-index: 1;
    }

    .social-head {
        text-align: center;
        max-width: 820px;
        margin: 0 auto 34px;
    }

    .social-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 6px 16px;
        border-radius: 999px;
        background: rgba(245,184,0,0.14);
        border: 1px solid rgba(245,184,0,0.35);
        color: #9a5c00;
        font-size: 12px;
        font-weight: 800;
        letter-spacing: 0.7px;
        text-transform: uppercase;
        margin-bottom: 14px;
    }

    .social-title {
        margin: 0 0 12px;
        font-size: clamp(26px, 3.2vw, 42px);
        font-weight: 900;
        color: #0d1b5e;
        letter-spacing: -0.3px;
        line-height: 1.15;
        text-wrap: balance;
    }

    .social-accent { color: #f5b800; }

    .social-subtitle {
        margin: 0;
        color: #4b5563;
        font-size: 15.5px;
        line-height: 1.8;
    }

    .social-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 22px;
        align-items: start;
    }

    .social-card {
        background: rgba(255, 255, 255, 0.75);
        border: 1px solid rgba(13,27,94,0.12);
        border-radius: 18px;
        overflow: hidden;
        box-shadow: 0 18px 46px rgba(0,0,0,0.12);
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
    }

    .social-card-head {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 14px 16px;
        background: linear-gradient(135deg, rgba(13,27,94,0.96) 0%, rgba(26,47,138,0.96) 100%);
        color: #ffffff;
        font-weight: 800;
        letter-spacing: 0.2px;
    }

    .social-card-head i {
        width: 34px;
        height: 34px;
        border-radius: 10px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: rgba(255,255,255,0.12);
        border: 1px solid rgba(255,255,255,0.18);
        flex-shrink: 0;
    }

    .social-card-head-brand {
        display: flex;
        flex-direction: column;
        gap: 3px;
        min-width: 0;
    }

    .social-card-head-title {
        font-weight: 800;
        letter-spacing: 0.2px;
        line-height: 1.2;
    }

    .social-card-head-meta {
        font-weight: 600;
        font-size: 12.5px;
        line-height: 1.35;
        color: rgba(255, 255, 255, 0.78);
        letter-spacing: 0.02em;
    }

    .social-embed {
        position: relative;
        width: 100%;
        aspect-ratio: 4 / 5;
        background: #ffffff;
        overflow: hidden;
    }

    .social-embed--facebook,
    .social-embed--instagram {
        background: #ffffff;
    }

    .social-iframe {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        border: 0;
    }

    .social-iframe--instagram {
        /* Instagram embed page can show a thin edge; clip to card radius parent */
        transform: translateZ(0);
    }

    .social-link {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        padding: 12px 14px;
        text-decoration: none;
        font-weight: 800;
        font-size: 14px;
        color: #0d1b5e;
        background: linear-gradient(135deg, rgba(245,184,0,0.18) 0%, rgba(245,184,0,0.08) 100%);
        border-top: 1px solid rgba(13,27,94,0.10);
        transition: transform 0.2s ease, background 0.2s ease;
    }

    .social-link:hover {
        transform: translateY(-1px);
        background: linear-gradient(135deg, rgba(245,184,0,0.24) 0%, rgba(245,184,0,0.10) 100%);
        text-decoration: none;
    }

    .social-link:focus-visible {
        outline: 3px solid rgba(245, 184, 0, 0.6);
        outline-offset: 3px;
    }

    @media (max-width: 768px) {
        .social-section { padding: 58px 0; }
        .social-inner { padding: 0 16px; }
        .social-grid { grid-template-columns: 1fr; }
        .social-embed { aspect-ratio: 16 / 10; }
    }

    @media (max-width: 480px) {
        .social-section { padding: 48px 0; }
        .social-embed { aspect-ratio: 16 / 12; }
    }

    /* ================================================================
    ADMISSION OPEN SECTION  — NEW DESIGN
    ================================================================ */
    .admission-section {
        background-color: #f4f7ff;
        background-image:
            linear-gradient(135deg, rgba(13,27,94,0.04) 0%, rgba(245,184,0,0.05) 100%),
            linear-gradient(rgba(13,27,94,0.07) 1px, transparent 1px),
            linear-gradient(90deg, rgba(13,27,94,0.07) 1px, transparent 1px);
        background-size: 100% 100%, 40px 40px, 40px 40px;
        background-position: 0 0, 0 0, 0 0;
        padding: 30px 0 11px;
        position: relative;
        overflow: hidden;
    }

    /* Top-left gold radial glow */
    .admission-section::before {
        content: '';
        position: absolute;
        top: -100px;
        left: -100px;
        width: 420px;
        height: 420px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(245,184,0,0.08) 0%, transparent 65%);
        pointer-events: none;
        z-index: 0;
    }

    /* Bottom-right navy radial glow */
    .admission-section::after {
        content: '';
        position: absolute;
        bottom: -80px;
        right: -80px;
        width: 360px;
        height: 360px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(13,27,94,0.06) 0%, transparent 65%);
        pointer-events: none;
        z-index: 0;
    }

    /* ---- Floating Particles ---- */
    .adm-particles {
        position: absolute;
        inset: 0;
        pointer-events: none;
        z-index: 0;
    }

    .adm-particle {
        position: absolute;
        border-radius: 50%;
        background: rgba(13,27,94,0.1);
        animation: particleFloat linear infinite;
    }

    .adm-p1 { width:12px; height:12px; top:15%;  left:8%;  animation-duration:7s;  animation-delay:0s;   }
    .adm-p2 { width:8px;  height:8px;  top:70%;  left:5%;  animation-duration:9s;  animation-delay:1s;   }
    .adm-p3 { width:16px; height:16px; top:30%;  right:6%; animation-duration:11s; animation-delay:2s;   }
    .adm-p4 { width:6px;  height:6px;  top:80%;  right:10%;animation-duration:8s;  animation-delay:0.5s; }
    .adm-p5 { width:10px; height:10px; top:50%;  left:50%; animation-duration:6s;  animation-delay:3s;   }
    .adm-p6 { width:14px; height:14px; top:10%;  right:30%;animation-duration:10s; animation-delay:1.5s; }

    @keyframes particleFloat {
        0%   { transform: translateY(0)   rotate(0deg);   opacity: 0.6; }
        50%  { transform: translateY(-40px) rotate(180deg); opacity: 1;   }
        100% { transform: translateY(0)   rotate(360deg); opacity: 0.6; }
    }

    /* ---- Inner Wrapper ---- */
    .adm-inner {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
        position: relative;
        z-index: 1;
    }

    /* ---- Two-Column Grid ---- */
    .adm-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        align-items: center;
        gap: 64px;
    }

    /* ================================================================
    LEFT CONTENT
    ================================================================ */
    .adm-left {
        display: flex;
        flex-direction: column;
        gap: 24px;
    }

    /* ================================================================
    LEFT IMAGE (replaces text block when needed)
    ================================================================ */
    .adm-left--image {
        gap: 0;
    }

    .adm-figure {
        margin: 0;
        position: relative;
        border-radius: 26px;
        overflow: hidden;
        box-shadow: 0 24px 64px rgba(0, 0, 0, 0.22);
        border: 1px solid rgba(13, 27, 94, 0.12);
        background: linear-gradient(135deg, rgba(13, 27, 94, 0.06), rgba(245, 184, 0, 0.06));
        transform: translateZ(0);
        animation: admImgIn 0.85s cubic-bezier(.2,.8,.2,1) both;
    }

    .adm-figure::after {
        content: "";
        position: absolute;
        inset: 0;
        background:
            radial-gradient(circle at 15% 20%, rgba(245, 184, 0, 0.18), transparent 55%),
            radial-gradient(circle at 85% 70%, rgba(13, 27, 94, 0.18), transparent 55%),
            linear-gradient(180deg, rgba(0, 0, 0, 0.06), rgba(0, 0, 0, 0.02));
        opacity: 0.85;
        pointer-events: none;
    }

    .adm-hero-img {
        display: block;
        width: 100%;
        height: clamp(320px, 36vw, 520px);
        object-fit: cover;
        transform: scale(1.01);
        transition: transform 500ms ease;
    }

    .adm-figure:hover .adm-hero-img {
        transform: scale(1.04);
    }

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

    @media (prefers-reduced-motion: reduce) {
        .adm-figure,
        .adm-hero-img {
            animation: none !important;
            transition-duration: 0.001ms !important;
        }
    }

    /* ---- Live / Status Badge ---- */
    .adm-live-badge {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, rgba(245,184,0,0.16) 0%, rgba(245,184,0,0.07) 100%);
        border: 1.5px solid rgba(245,184,0,0.45);
        color: #9a5c00;
        font-size: 12px;
        font-weight: 800;
        padding: 7px 20px;
        border-radius: 50px;
        letter-spacing: 0.8px;
        text-transform: uppercase;
        width: fit-content;
    }

    .adm-live-dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: #e84118;
        flex-shrink: 0;
        animation: livePulse 1.5s ease-in-out infinite;
    }

    @keyframes livePulse {
        0%, 100% { box-shadow: 0 0 0 0 rgba(232,65,24,0.5); }
        50%       { box-shadow: 0 0 0 7px rgba(232,65,24,0); }
    }

    /* ---- Heading ---- */
    .adm-heading {
        font-size: clamp(30px, 4vw, 52px);
        font-weight: 900;
        line-height: 1.2;
        color: #0d1b5e;
        margin: 0;
        letter-spacing: -0.5px;
    }

    .adm-heading-accent {
        display: block;
        color: #f5b800;
        position: relative;
        width: fit-content;
    }

    .adm-heading-accent::after {
        content: '';
        position: absolute;
        left: 0;
        bottom: -5px;
        width: 65%;
        height: 4px;
        background: linear-gradient(90deg, #f5b800, transparent);
        border-radius: 2px;
    }

    /* ---- Description ---- */
    .adm-desc {
        font-size: 15px;
        color: #4b5563;
        line-height: 1.82;
        margin: 0;
        max-width: 500px;
    }

    .adm-desc strong {
        color: #0d1b5e;
        font-weight: 700;
    }

    /* ---- Feature Checklist ---- */
    .adm-checklist {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 13px;
    }

    .adm-check-item {
        display: flex;
        align-items: center;
        gap: 13px;
        font-size: 14.5px;
        color: #1f2937;
        font-weight: 500;
        line-height: 1.4;
    }

    .adm-check-icon {
        width: 28px;
        height: 28px;
        min-width: 28px;
        border-radius: 50%;
        background: rgba(13,27,94,0.08);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        font-size: 14px;
    }

    /* ---- Programme Pills Row ---- */
    .adm-prog-row {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 8px;
    }

    .adm-prog-pill {
        font-size: 11.5px;
        font-weight: 800;
        padding: 5px 15px;
        border-radius: 50px;
        letter-spacing: 1px;
        text-transform: uppercase;
    }

    .adm-pp--bba  { background: rgba(26,35,126,0.09);  color: #1a237e; border: 1px solid rgba(26,35,126,0.22);  }
    .adm-pp--bca  { background: rgba(0,105,92,0.09);   color: #00695c; border: 1px solid rgba(0,105,92,0.22);   }
    .adm-pp--bsw  { background: rgba(106,27,154,0.09); color: #6a1b9a; border: 1px solid rgba(106,27,154,0.22); }
    .adm-pp--pmir { background: rgba(191,54,12,0.09);  color: #bf360c; border: 1px solid rgba(191,54,12,0.22);  }
    .adm-pp--msw  { background: rgba(27,94,32,0.09);   color: #1b5e20; border: 1px solid rgba(27,94,32,0.22);   }

    /* ---- CTA Buttons ---- */
    .adm-cta-row {
        display: flex;
        align-items: center;
        gap: 14px;
        flex-wrap: wrap;
    }

    .adm-btn {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        font-size: 14.5px;
        font-weight: 700;
        padding: 13px 30px;
        border-radius: 50px;
        text-decoration: none;
        letter-spacing: 0.3px;
        transition: transform 0.25s, box-shadow 0.25s, background 0.25s, border-color 0.25s;
        white-space: nowrap;
    }

    .adm-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        box-shadow: 0 6px 20px rgba(245,184,0,0.38);
    }

    .adm-btn--primary:hover {
        background: linear-gradient(135deg, #ffd000 0%, #f5b800 100%);
        transform: translateY(-3px);
        box-shadow: 0 10px 28px rgba(245,184,0,0.55);
        color: #060f3a;
        text-decoration: none;
    }

    .adm-btn--outline {
        background: transparent;
        color: #0d1b5e;
        border: 2px solid rgba(13,27,94,0.28);
    }

    .adm-btn--outline:hover {
        background: rgba(13,27,94,0.06);
        border-color: #0d1b5e;
        transform: translateY(-3px);
        color: #0d1b5e;
        text-decoration: none;
    }

    /* ================================================================
    RIGHT: COURSE CARD
    ================================================================ */
    .adm-right {
        position: relative;
        animation: admSlideRight 0.8s ease 0.2s both;
    }

    @keyframes admSlideRight {
        from { opacity:0; transform: translateX(40px); }
        to   { opacity:1; transform: translateX(0); }
    }

    /* Decorative spinning ring */
    .adm-card-ring {
        position: absolute;
        top: -30px;
        right: -30px;
        width: 200px;
        height: 200px;
        border-radius: 50%;
        border: 2px dashed rgba(245,184,0,0.2);
        animation: spinRing 20s linear infinite;
        pointer-events: none;
    }

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

    /* Main Course Card */
    .adm-card {
        background: #ffffff;
        border-radius: 24px;
        overflow: hidden;
        box-shadow: 0 24px 64px rgba(0,0,0,0.35);
        border: 1px solid rgba(255,255,255,0.1);
        position: relative;
    }

    /* ---- Card Header ---- */
    .adm-card-header {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        padding: 22px 24px;
        display: flex;
        align-items: center;
        gap: 16px;
        position: relative;
        overflow: hidden;
    }

    .adm-card-header::after {
        content: '';
        position: absolute;
        inset: 0;
        background-image: radial-gradient(rgba(245,184,0,0.07) 1px, transparent 1px);
        background-size: 20px 20px;
        pointer-events: none;
    }

    .adm-card-logo {
        width: 56px;
        height: 56px;
        object-fit: contain;
        flex-shrink: 0;
        filter: drop-shadow(0 2px 8px rgba(0,0,0,0.4));
        position: relative;
        z-index: 1;
    }

    .adm-card-header-text {
        position: relative;
        z-index: 1;
    }

    .adm-card-header-text h3 {
        font-size: 16px;
        font-weight: 800;
        color: #ffffff;
        margin: 0 0 4px;
    }

    .adm-card-header-text p {
        font-size: 12.5px;
        color: #f5b800;
        margin: 0;
        font-weight: 600;
        letter-spacing: 0.4px;
    }

    /* ---- Card Section ---- */
    .adm-card-section {
        padding: 20px 24px;
    }

    .adm-card-label {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        font-size: 11.5px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.8px;
        padding: 4px 12px;
        border-radius: 20px;
        margin-bottom: 14px;
    }

    .adm-card-label--ug {
        background: rgba(13,27,94,0.08);
        color: #0d1b5e;
    }

    .adm-card-label--pg {
        background: rgba(245,184,0,0.12);
        color: #b36a00;
    }

    .adm-card-label i {
        font-size: 11px;
    }

    /* Course list inside card */
    .adm-card-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .adm-card-list li {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 9px 12px;
        border-radius: 10px;
        background: #f8faff;
        border: 1px solid #edf0fb;
        font-size: 13px;
        color: #374151;
        transition: background 0.2s, border-color 0.2s, transform 0.2s;
    }

    .adm-card-list li:hover {
        background: #eef2ff;
        border-color: #c7d3f7;
        transform: translateX(4px);
    }

    .adm-card-abbr {
        font-size: 13px;
        font-weight: 900;
        color: #0d1b5e;
        min-width: 44px;
        letter-spacing: 0.4px;
        flex-shrink: 0;
    }

    .adm-card-dur {
        margin-left: auto;
        font-size: 11.5px;
        color: #9ca3af;
        font-weight: 600;
        background: #edf0fb;
        padding: 2px 8px;
        border-radius: 10px;
        flex-shrink: 0;
    }

    /* Card Divider */
    .adm-card-divider {
        height: 1px;
        background: linear-gradient(90deg, transparent, #e8edf8, transparent);
        margin: 0 24px;
    }

    /* Card Footer Button */
    .adm-card-footer-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        font-size: 14px;
        font-weight: 800;
        padding: 16px 24px;
        text-decoration: none;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        transition: background 0.25s ease, letter-spacing 0.25s ease;
    }

    .adm-card-footer-btn i {
        font-size: 13px;
        transition: transform 0.25s ease;
    }

    .adm-card-footer-btn:hover {
        background: linear-gradient(135deg, #ffd000 0%, #f5b800 100%);
        color: #060f3a;
        letter-spacing: 0.8px;
    }

    .adm-card-footer-btn:hover i {
        transform: translateX(5px);
    }

    /* ================================================================
    ADMISSION RESPONSIVE
    ================================================================ */
    @media (max-width: 1024px) {
        .adm-grid {
            gap: 44px;
        }

        .adm-inner {
            padding: 0 24px;
        }
    }

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

        .adm-inner {
            padding: 0 16px;
        }

        .adm-grid {
            grid-template-columns: 1fr;
            gap: 40px;
        }

        .adm-heading {
            font-size: clamp(28px, 8vw, 44px);
        }

        .adm-card-ring {
            display: none;
        }
    }

    @media (max-width: 480px) {
        .admission-section {
            padding: 48px 0 56px;
        }

        .adm-check-item {
            font-size: 13.5px;
        }

        .adm-cta-row {
            flex-direction: column;
            align-items: stretch;
        }

        .adm-btn {
            justify-content: center;
        }
    }

    /* ---- old detail-icon kept for any leftover refs ---- */
    .adm-detail-icon {
        width: 48px;
        height: 48px;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        color: #ffffff;
        flex-shrink: 0;
    }

    .adm-detail-icon--bba  { background: linear-gradient(135deg, #1e88e5, #0d1b5e); }
    .adm-detail-icon--bca  { background: linear-gradient(135deg, #43a047, #1b5e20); }
    .adm-detail-icon--bsw  { background: linear-gradient(135deg, #f5b800, #e07b00); }
    .adm-detail-icon--pmir { background: linear-gradient(135deg, #8e24aa, #4a148c); }
    .adm-detail-icon--msw  { background: linear-gradient(135deg, #e53935, #b71c1c); }

    .adm-detail-body h4 {
        font-size: 14px;
        font-weight: 700;
        color: #0d1b5e;
        margin-bottom: 8px;
        line-height: 1.4;
    }

    .adm-detail-body h4 span {
        color: #374151;
        font-weight: 600;
    }

    .adm-detail-body p {
        font-size: 13.5px;
        color: #6b7280;
        line-height: 1.7;
        margin: 0;
    }

    /* ================================================================
    ADMISSION RESPONSIVE
    ================================================================ */
    @media (max-width: 1024px) {
        .adm-detail-grid {
            grid-template-columns: repeat(2, 1fr);
        }

        .adm-detail-grid--pg {
            grid-template-columns: repeat(2, 1fr);
            max-width: 100%;
        }
    }

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

        .adm-inner {
            padding: 0 16px;
        }

        .adm-banner {
            padding: 32px 20px;
        }

        .adm-split {
            grid-template-columns: 1fr;
        }

        .adm-col--ug {
            border-right: none;
            border-bottom: 1px solid #f0f2f8;
        }

        .adm-col--pg {
            border-left: none;
            border-top: 1px solid #f0f2f8;
        }

        .adm-center-logo {
            padding: 24px;
            border-top: 1px solid #f0f2f8;
            border-bottom: 1px solid #f0f2f8;
        }

        .adm-divider-line {
            display: none;
        }

        .adm-logo-ring {
            width: 90px;
            height: 90px;
        }

        .adm-logo-img {
            width: 72px;
            height: 72px;
        }

        .adm-detail-grid,
        .adm-detail-grid--pg {
            grid-template-columns: 1fr;
        }
    }

    @media (max-width: 480px) {
        .adm-banner-title {
            font-size: 26px;
        }

        .adm-apply-btn {
            width: 100%;
            justify-content: center;
            padding: 12px 24px;
        }

        .adm-col {
            padding: 24px 18px;
        }

        .adm-detail-card {
            flex-direction: column;
            gap: 12px;
        }
    }

    /* ================================================================
    SITE FOOTER
    ================================================================ */

    /* ================================================================
    GALLERY SECTION
    ================================================================ */
    .gallery-section {
        background: linear-gradient(180deg, #e7ecf7 0%, #eef1f8 100%);
        padding: 0;
        position: relative;
        /* Let header + marquee + footer stack naturally; 100vh + overflow:hidden clipped at 100% zoom */
        overflow-x: hidden;
        overflow-y: visible;
        min-height: 100vh;
        display: flex;
        align-items: stretch;
    }

    /* Subtle diagonal stripe background */
    .gallery-section::before {
        content: '';
        position: absolute;
        inset: 0;
        background-image:
            linear-gradient(135deg, rgba(13,27,94,0.03) 25%, transparent 25%),
            linear-gradient(225deg, rgba(13,27,94,0.03) 25%, transparent 25%),
            linear-gradient(315deg, rgba(13,27,94,0.03) 25%, transparent 25%),
            linear-gradient(45deg,  rgba(13,27,94,0.03) 25%, transparent 25%);
        background-size: 40px 40px;
        pointer-events: none;
        z-index: 0;
    }

    .gallery-inner {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 24px;
        position: relative;
        z-index: 1;
        width: 100%;
        display: flex;
        flex-direction: column;
        padding-top: clamp(28px, 5vh, 52px);
        padding-bottom: clamp(24px, 4vh, 56px);
    }

    /* ---- Section Header ---- */
    .gallery-header {
        text-align: center;
        max-width: 680px;
        margin: 0 auto clamp(14px, 2.4vh, 22px);
    }

    .gallery-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13, 27, 94, 0.07);
        border: 1px solid rgba(13, 27, 94, 0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 700;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 16px;
    }

    .gallery-tag i { font-size: 11px; }

    .gallery-heading {
        font-size: clamp(26px, 3.5vw, 40px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.2;
        margin: 0 0 14px;
    }

    .gallery-heading-accent { color: #f5b800; }

    .gallery-subtext {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.75;
        margin: 0;
    }

    /* ================================================================
    GALLERY — full-screen two-row marquee
    ================================================================ */
    .gallery-carousel {
        max-width: 1240px;
        margin: 0 auto;
        width: 100%;
        flex: 0 0 auto;
        display: flex;
        align-items: center;
    }

    .gallery-marquee {
        width: 100%;
        display: grid;
        gap: clamp(12px, 2.4vh, 18px);
    }

    .gallery-row {
        position: relative;
        overflow: hidden;
        border-radius: 18px;
        border: 1px solid rgba(226, 232, 246, 0.95);
        box-shadow: 0 18px 52px rgba(13, 27, 94, 0.12);
        background: rgba(255, 255, 255, 0.72);
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
    }

    .gallery-track {
        display: flex;
        gap: 12px;
        padding: 12px;
        width: 200%;
        will-change: transform;
        transform: translate3d(0,0,0);
    }

    .gallery-row--rtl .gallery-track { justify-content: flex-end; }

    .gallery-row--ltr .gallery-track { animation: galleryMarqueeLtr 26s linear infinite; }
    .gallery-row--rtl .gallery-track { animation: galleryMarqueeRtl 28s linear infinite; }

    .gallery-row:hover .gallery-track { animation-play-state: paused; }

    @keyframes galleryMarqueeLtr {
        0%   { transform: translate3d(-50%, 0, 0); }
        100% { transform: translate3d(0%, 0, 0); }
    }

    @keyframes galleryMarqueeRtl {
        0%   { transform: translate3d(0%, 0, 0); }
        100% { transform: translate3d(-50%, 0, 0); }
    }

    .gallery-slide {
        margin: 0;
        position: relative;
        height: clamp(180px, 22vh, 300px);
        background: #d0d8e8;
        border-radius: 14px;
        overflow: hidden;
        flex: 0 0 clamp(240px, 34vw, 420px);
    }

    .gallery-slide-link {
        display: block;
        height: 100%;
        position: relative;
        text-decoration: none;
        color: inherit;
    }

    .gallery-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transition: transform 0.55s ease, filter 0.35s ease;
    }

    /* Old owl divider not used in marquee layout */

    .gallery-slide-link::after {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(180deg, rgba(0,0,0,0.08) 0%, rgba(0,0,0,0.06) 45%, rgba(0,0,0,0.56) 100%);
        opacity: 0.55;
        transition: opacity 0.28s ease;
    }

    .gallery-slide-cap {
        position: absolute;
        left: 16px;
        right: 16px;
        bottom: 14px;
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        justify-content: space-between;
        gap: 8px 12px;
        color: #ffffff;
        z-index: 1;
    }

    .gallery-slide-title {
        font-size: 16px;
        font-weight: 900;
        letter-spacing: 0.2px;
    }

    .gallery-slide-meta {
        font-size: 11px;
        font-weight: 900;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: rgba(255, 255, 255, 0.88);
    }

    .gallery-slide-link:hover img {
        transform: scale(1.06);
        filter: saturate(1.04) contrast(1.02);
    }

    .gallery-slide-link:hover::after {
        opacity: 0.72;
    }

    /* Owl dots not used in marquee layout */

    /* ================================================================
    VIEW ALL BUTTON
    ================================================================ */
    .gallery-footer-row {
        display: flex;
        justify-content: center;
        margin-top: clamp(20px, 3.5vh, 36px);
    }

    .gallery-view-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        color: #ffffff;
        font-size: 14.5px;
        font-weight: 700;
        padding: 14px 34px;
        border-radius: 50px;
        text-decoration: none;
        letter-spacing: 0.3px;
        box-shadow: 0 6px 22px rgba(13, 27, 94, 0.30);
        transition: transform 0.25s, box-shadow 0.25s, background 0.25s;
    }

    .gallery-view-btn:hover {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        transform: translateY(-3px);
        box-shadow: 0 10px 28px rgba(245, 184, 0, 0.42);
        text-decoration: none;
    }

    .gallery-view-btn i:last-child {
        font-size: 12px;
        transition: transform 0.22s;
    }

    .gallery-view-btn:hover i:last-child { transform: translateX(4px); }

    /* ================================================================
    GALLERY RESPONSIVE
    ================================================================ */
    @media (max-width: 1024px) {
        .gallery-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
    }

    @media (max-width: 768px) {
        .gallery-section  { min-height: 100vh; }
        .gallery-inner    { padding: 0 16px; padding-top: 36px; padding-bottom: 30px; }
        .gallery-header   { margin-bottom: 32px; }

        .gallery-tabs { gap: 8px; }
        .gallery-tab  { font-size: 12.5px; padding: 8px 16px; }

        .gallery-grid {
            grid-template-columns: repeat(2, 1fr);
            gap: 12px;
        }

        .gallery-track { padding: 10px; gap: 10px; }
        .gallery-row--ltr .gallery-track { animation-duration: 22s; }
        .gallery-row--rtl .gallery-track { animation-duration: 24s; }
    }

    @media (max-width: 480px) {
        .gallery-section { min-height: 100vh; }
        .gallery-inner   { padding: 0 14px; padding-top: 32px; padding-bottom: 26px; }

        .gallery-tabs { gap: 6px; margin-bottom: 24px; }
        .gallery-tab  { font-size: 12px; padding: 7px 13px; }
        .gallery-tab i { display: none; }

        .gallery-view-btn { font-size: 13.5px; padding: 12px 24px; }
    }

    @media (prefers-reduced-motion: reduce) {
        .gallery-row--ltr .gallery-track,
        .gallery-row--rtl .gallery-track {
            animation: none !important;
            transform: none !important;
        }
    }

    /* ================================================================
    WHY CHOOSE US (wcu-*) — Home Page
    Navy #0d1b5e · Blue #1a2f8a · Gold #f5b800 · Accent #e84118
    ================================================================ */
    .wcu-section {
        position: relative;
        padding: 78px 0 86px;
        background: linear-gradient(180deg, #eef1f8 0%, #e7ecf7 100%);
        overflow: hidden;
    }

    .wcu-section::before {
        content: '';
        position: absolute;
        inset: 0;
        background:
            radial-gradient(900px 380px at 12% 0%, rgba(245, 184, 0, 0.18) 0%, transparent 55%),
            radial-gradient(850px 420px at 92% 12%, rgba(26, 47, 138, 0.10) 0%, transparent 60%),
            linear-gradient(135deg, rgba(232, 65, 24, 0.06) 0%, transparent 45%);
        pointer-events: none;
    }

    .wcu-section::after {
        content: '';
        position: absolute;
        inset: -2px;
        background: linear-gradient(120deg, rgba(245, 184, 0, 0.24), rgba(26, 47, 138, 0.14), rgba(232, 65, 24, 0.16), rgba(13, 27, 94, 0.20));
        background-size: 240% 240%;
        filter: blur(22px);
        opacity: 0.35;
        animation: wcuBgShift 9s ease-in-out infinite;
        pointer-events: none;
    }

    .wcu-inner {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 24px;
        position: relative;
        z-index: 1;
    }

    .wcu-head {
        text-align: center;
        max-width: 820px;
        margin: 0 auto 42px;
    }

    .wcu-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 12px;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: #0d1b5e;
        padding: 7px 18px;
        border-radius: 999px;
        background: linear-gradient(135deg, rgba(245, 184, 0, 0.22) 0%, rgba(13, 27, 94, 0.06) 100%);
        border: 1px solid rgba(245, 184, 0, 0.25);
        margin-bottom: 14px;
    }

    .wcu-title {
        font-size: clamp(26px, 3.6vw, 44px);
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1.18;
        margin: 0 0 14px;
        letter-spacing: -0.02em;
    }

    .wcu-accent {
        background: linear-gradient(90deg, #f5b800 0%, #e84118 45%, #1a2f8a 100%);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .wcu-subtitle {
        font-size: 15.5px;
        line-height: 1.8;
        color: #5a6782;
        margin: 0;
    }

    .wcu-workflow {
        max-width: 1100px;
        margin: 0 auto;
    }

    .wcu-flow {
        list-style: none;
        margin: 0;
        padding: 6px 0 0;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 18px 22px;
        position: relative;
    }

    /* animated gradient connector */
    .wcu-flow::before {
        content: '';
        position: absolute;
        left: 50%;
        top: 0;
        bottom: 0;
        width: 3px;
        transform: translateX(-50%);
        border-radius: 99px;
        background: linear-gradient(180deg, rgba(245, 184, 0, 0.9), rgba(232, 65, 24, 0.7), rgba(26, 47, 138, 0.8), rgba(245, 184, 0, 0.75));
        background-size: 100% 220%;
        animation: wcuLineFlow 4.5s ease-in-out infinite;
        opacity: 0.55;
    }

    .wcu-step {
        display: grid;
        grid-template-columns: 76px 1fr;
        gap: 14px;
        align-items: start;
        position: relative;
    }

    /* alternate sides */
    .wcu-step:nth-child(odd) {
        grid-column: 1;
        padding-right: 24px;
    }

    .wcu-step:nth-child(even) {
        grid-column: 2;
        padding-left: 24px;
    }

    .wcu-step--cta {
        grid-column: 1 / -1;
        max-width: 980px;
        margin: 10px auto 0;
        padding: 0;
    }

    .wcu-step--cta .wcu-step-mark {
        position: relative;
        top: auto;
    }

    .wcu-step-mark {
        position: sticky;
        top: 18px;
        display: grid;
        gap: 10px;
        justify-items: center;
    }

    .wcu-step-num {
        font-size: 11px;
        font-weight: 900;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        color: #0d1b5e;
        padding: 6px 10px;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.82);
        border: 1px solid rgba(226, 232, 246, 0.95);
        box-shadow: 0 10px 24px rgba(13, 27, 94, 0.10);
    }

    .wcu-step-ico {
        width: 52px;
        height: 52px;
        border-radius: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #ffffff;
        background: linear-gradient(145deg, #0d1b5e 0%, #1a2f8a 70%, rgba(245, 184, 0, 0.65) 160%);
        box-shadow: 0 16px 38px rgba(13, 27, 94, 0.18);
        position: relative;
    }

    .wcu-step-ico::after {
        content: '';
        position: absolute;
        inset: -10px;
        border-radius: 22px;
        background: radial-gradient(circle at 30% 20%, rgba(245, 184, 0, 0.35), transparent 55%);
        filter: blur(10px);
        opacity: 0.9;
        animation: wcuPulse 2.8s ease-in-out infinite;
        pointer-events: none;
    }

    .wcu-step-ico i {
        font-size: 18px;
        position: relative;
        z-index: 1;
    }

    .wcu-step-card {
        background: rgba(255, 255, 255, 0.92);
        border: 1px solid rgba(226, 232, 246, 0.95);
        border-radius: 18px;
        padding: 18px 18px 16px;
        box-shadow: 0 12px 30px rgba(13, 27, 94, 0.08);
        position: relative;
        overflow: hidden;
        transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.28s ease, border-color 0.25s ease;
    }

    .wcu-step-card::before {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(135deg, rgba(245, 184, 0, 0.10), rgba(26, 47, 138, 0.04) 55%, rgba(232, 65, 24, 0.06));
        opacity: 0;
        transition: opacity 0.28s ease;
        pointer-events: none;
    }

    .wcu-step-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 22px 52px rgba(13, 27, 94, 0.12);
        border-color: rgba(245, 184, 0, 0.40);
    }

    .wcu-step-card:hover::before {
        opacity: 1;
    }

    .wcu-step-title {
        font-size: 16px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 8px;
        position: relative;
        z-index: 1;
    }

    .wcu-step-text {
        margin: 0 0 12px;
        font-size: 14.5px;
        line-height: 1.7;
        color: #4b5563;
        position: relative;
        z-index: 1;
    }

    .wcu-step-points {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        position: relative;
        z-index: 1;
    }

    .wcu-step-points li {
        font-size: 11px;
        font-weight: 900;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: #0d1b5e;
        padding: 7px 10px;
        border-radius: 999px;
        background: rgba(13, 27, 94, 0.05);
        border: 1px solid rgba(13, 27, 94, 0.10);
    }

    .wcu-step--cta .wcu-step-card {
        background: linear-gradient(125deg, #0a1440 0%, #0d1b5e 45%, #1a2f8a 100%);
        border-color: rgba(255, 255, 255, 0.14);
        text-align: center;
    }

    .wcu-step--cta .wcu-step-card::before {
        opacity: 1;
        background: radial-gradient(ellipse at 30% 0%, rgba(245, 184, 0, 0.20) 0%, transparent 55%);
    }

    .wcu-step--cta .wcu-step-title {
        color: #ffffff;
    }

    .wcu-step--cta .wcu-step-text {
        color: rgba(255, 255, 255, 0.82);
    }

    .wcu-step--cta .wcu-step-points li {
        background: rgba(255, 255, 255, 0.12);
        border-color: rgba(255, 255, 255, 0.18);
        color: rgba(255, 255, 255, 0.92);
    }

    .wcu-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 16px;
        position: relative;
        z-index: 1;
    }

    .wcu-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 13.5px;
        font-weight: 900;
        padding: 12px 18px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s ease, box-shadow 0.25s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    }

    .wcu-btn--primary {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 8px 20px rgba(245, 184, 0, 0.30);
    }

    .wcu-btn--primary:hover {
        transform: translateY(-2px);
        color: #0a1440;
    }

    .wcu-btn--ghost {
        background: transparent;
        color: #ffffff;
        border: 2px solid rgba(255, 255, 255, 0.45);
    }

    .wcu-btn--ghost:hover {
        border-color: #f5b800;
        color: #f5b800;
    }

    @media (max-width: 1024px) {
        .wcu-flow {
            grid-template-columns: 1fr;
            gap: 14px;
        }
        .wcu-flow::before {
            left: 26px;
            transform: none;
        }
        .wcu-step,
        .wcu-step:nth-child(odd),
        .wcu-step:nth-child(even) {
            grid-column: 1;
            padding: 0;
        }

        .wcu-step--cta {
            max-width: none;
            margin-top: 0;
        }
    }

    @media (max-width: 640px) {
        .wcu-section {
            padding: 56px 0 64px;
        }
        .wcu-inner {
            padding: 0 14px;
        }
        .wcu-head {
            margin-bottom: 28px;
        }
        .wcu-flow::before {
            left: 22px;
        }
        .wcu-step {
            grid-template-columns: 64px 1fr;
            gap: 12px;
        }
        .wcu-step-mark {
            top: 10px;
        }
        .wcu-step-ico {
            width: 46px;
            height: 46px;
            border-radius: 16px;
        }
        .wcu-step-ico i {
            font-size: 16px;
        }
        .wcu-actions {
            flex-direction: column;
        }
        .wcu-btn {
            width: 100%;
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .wcu-section::after,
        .wcu-flow::before,
        .wcu-step-ico::after {
            animation: none;
        }
        .wcu-step-card:hover,
        .wcu-btn--primary:hover {
            transform: none;
        }
        .wcu-step-card,
        .wcu-btn {
            transition: none;
        }
    }

    @keyframes wcuBgShift {
        0% { background-position: 0% 40%; }
        50% { background-position: 100% 60%; }
        100% { background-position: 0% 40%; }
    }

    @keyframes wcuLineFlow {
        0% { background-position: 50% 0%; }
        50% { background-position: 50% 100%; }
        100% { background-position: 50% 0%; }
    }

    @keyframes wcuPulse {
        0%, 100% { transform: scale(0.96); opacity: 0.75; }
        50% { transform: scale(1.05); opacity: 1; }
    }

    /* ================================================================
    OUR RECRUITERS (rcr-*) — Home Page
    Navy #0d1b5e · Blue #1a2f8a · Gold #f5b800 · Accent #e84118
    ================================================================ */
    .rcr-section {
        position: relative;
        padding: 78px 0 86px;
        background: linear-gradient(180deg, #e7ecf7 0%, #eef1f8 100%);
        overflow: hidden;
    }

    .rcr-section::before {
        content: '';
        position: absolute;
        inset: 0;
        background:
            radial-gradient(900px 420px at 15% 0%, rgba(26, 47, 138, 0.10) 0%, transparent 60%),
            radial-gradient(900px 420px at 85% 0%, rgba(245, 184, 0, 0.16) 0%, transparent 58%),
            linear-gradient(135deg, rgba(232, 65, 24, 0.06) 0%, transparent 50%);
        pointer-events: none;
    }

    .rcr-inner {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 24px;
        position: relative;
        z-index: 1;
    }

    .rcr-head {
        text-align: center;
        max-width: 860px;
        margin: 0 auto 34px;
    }

    .rcr-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 12px;
        font-weight: 900;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: #0d1b5e;
        padding: 7px 18px;
        border-radius: 999px;
        background: linear-gradient(135deg, rgba(26, 47, 138, 0.10) 0%, rgba(245, 184, 0, 0.18) 100%);
        border: 1px solid rgba(26, 47, 138, 0.18);
        margin-bottom: 14px;
    }

    .rcr-title {
        font-size: clamp(26px, 3.4vw, 42px);
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1.18;
        margin: 0 0 12px;
        letter-spacing: -0.02em;
    }

    .rcr-accent {
        background: linear-gradient(90deg, #1a2f8a 0%, #f5b800 45%, #e84118 100%);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .rcr-subtitle {
        margin: 0;
        font-size: 15.5px;
        line-height: 1.8;
        color: #5a6782;
    }

    .rcr-grid {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        gap: 14px;
        margin: 0 auto 28px;
        max-width: 1100px;
    }

    .rcr-item {
        grid-column: span 3;
        background: rgba(255, 255, 255, 0.92);
        border: 1px solid rgba(226, 232, 246, 0.95);
        border-radius: 16px;
        padding: 14px 14px 14px;
        display: flex;
        flex-direction: column;
        gap: 6px;
        justify-content: center;
        min-height: 92px;
        box-shadow: 0 10px 24px rgba(13, 27, 94, 0.07);
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
        position: relative;
        overflow: hidden;
    }

    .rcr-item::before {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(135deg, rgba(245, 184, 0, 0.10), rgba(26, 47, 138, 0.04) 55%, rgba(232, 65, 24, 0.06));
        opacity: 0;
        transition: opacity 0.25s ease;
        pointer-events: none;
    }

    .rcr-item:hover {
        transform: translateY(-3px);
        box-shadow: 0 20px 46px rgba(13, 27, 94, 0.12);
        border-color: rgba(245, 184, 0, 0.40);
    }

    .rcr-item:hover::before {
        opacity: 1;
    }

    .rcr-badge {
        display: inline-flex;
        width: fit-content;
        font-size: 10px;
        font-weight: 900;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: #1a2f8a;
        padding: 6px 10px;
        border-radius: 999px;
        background: rgba(26, 47, 138, 0.08);
        border: 1px solid rgba(26, 47, 138, 0.14);
        position: relative;
        z-index: 1;
    }

    .rcr-name {
        font-size: 14px;
        font-weight: 900;
        color: #0d1b5e;
        letter-spacing: 0.2px;
        position: relative;
        z-index: 1;
    }

    .rcr-foot {
        max-width: 1100px;
        margin: 0 auto;
    }

    .rcr-foot-card {
        border-radius: 20px;
        overflow: hidden;
        background: linear-gradient(125deg, #0a1440 0%, #0d1b5e 45%, #1a2f8a 100%);
        position: relative;
        padding: 26px 22px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 16px 18px;
    }

    .rcr-foot-card::after {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at 30% 0%, rgba(245, 184, 0, 0.18) 0%, transparent 55%);
        pointer-events: none;
    }

    .rcr-foot-copy,
    .rcr-foot-actions {
        position: relative;
        z-index: 1;
    }

    .rcr-foot-title {
        font-size: 18px;
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 6px;
    }

    .rcr-foot-text {
        margin: 0;
        font-size: 14.5px;
        color: rgba(255, 255, 255, 0.80);
        line-height: 1.65;
        max-width: 520px;
    }

    .rcr-foot-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .rcr-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 13.5px;
        font-weight: 900;
        padding: 12px 18px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s ease, box-shadow 0.25s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    }

    .rcr-btn--primary {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 8px 20px rgba(245, 184, 0, 0.30);
    }

    .rcr-btn--primary:hover {
        transform: translateY(-2px);
        color: #0a1440;
    }

    .rcr-btn--ghost {
        background: transparent;
        color: #ffffff;
        border: 2px solid rgba(255, 255, 255, 0.45);
    }

    .rcr-btn--ghost:hover {
        border-color: #f5b800;
        color: #f5b800;
    }

    @media (max-width: 1024px) {
        .rcr-grid {
            gap: 12px;
        }
        .rcr-item {
            grid-column: span 4;
        }
    }

    @media (max-width: 768px) {
        .rcr-item {
            grid-column: span 6;
        }
        .rcr-foot-card {
            text-align: center;
            justify-content: center;
        }
        .rcr-foot-actions {
            justify-content: center;
        }
    }

    @media (max-width: 480px) {
        .rcr-section {
            padding: 56px 0 64px;
        }
        .rcr-inner {
            padding: 0 14px;
        }
        .rcr-item {
            grid-column: span 12;
        }
        .rcr-foot-actions {
            flex-direction: column;
            width: 100%;
        }
        .rcr-btn {
            width: 100%;
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .rcr-item:hover,
        .rcr-btn--primary:hover {
            transform: none;
        }
        .rcr-item,
        .rcr-btn {
            transition: none;
        }
    }

    /* ================================================================
    OVERVIEW PAGE — Page Hero
    ================================================================ */
    .page-hero {
        position: relative;
        min-height: 280px;
        background: linear-gradient(135deg, #060f3a 0%, #0d1b5e 50%, #1a2f8a 100%);
        display: flex;
        align-items: center;
        overflow: hidden;
    }

    .page-hero::after {
        content: '';
        position: absolute;
        inset: 0;
        background-image: radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1px);
        background-size: 28px 28px;
        pointer-events: none;
    }

    .page-hero-overlay {
        position: absolute;
        inset: 0;
        background: linear-gradient(100deg,
            rgba(6,15,72,0.60) 0%,
            rgba(245,184,0,0.08) 100%);
        z-index: 0;
    }

    .page-hero-inner {
        position: relative;
        z-index: 1;
        max-width: 1240px;
        margin: 0 auto;
        padding: 56px 32px 48px;
    }

    /* Breadcrumb */
    .page-breadcrumb ol {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 6px;
        list-style: none;
        padding: 0;
        margin: 0 0 18px;
    }

    .page-breadcrumb li {
        display: flex;
        align-items: center;
        font-size: 13px;
        color: rgba(255,255,255,0.60);
    }

    .page-breadcrumb a {
        color: rgba(255,255,255,0.70);
        text-decoration: none;
        transition: color 0.2s;
    }

    .page-breadcrumb a:hover { color: #f5b800; }

    .page-breadcrumb li[aria-current="page"] { color: #f5b800; font-weight: 600; }

    .page-breadcrumb i { font-size: 9px; margin: 0 2px; }

    .page-hero-title {
        font-size: clamp(32px, 5vw, 54px);
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 12px;
        line-height: 1.15;
        letter-spacing: 0.5px;
    }

    .page-hero-accent { color: #f5b800; }

    .page-hero-subtitle {
        font-size: 16px;
        color: rgba(255,255,255,0.72);
        margin: 0;
        max-width: 580px;
        line-height: 1.65;
    }

    .page-hero--cover {
        background-size: cover;
        background-position: center;
        background-image: var(--page-hero-cover);
    }

    .page-hero--cover .page-hero-overlay {
        background: linear-gradient(100deg,
            rgba(6,15,72,0.78) 0%,
            rgba(13,27,94,0.72) 100%);
    }

    .page-hero--with-logos {
        flex-direction: column;
        justify-content: space-between;
        align-items: stretch;
        min-height: 340px;
    }

    .page-hero--with-logos .page-hero-inner {
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    /* ================================================================
    SHARED OVERVIEW UTILITIES
    ================================================================ */
    .ov-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }

    .ov-accent { color: #f5b800; }

    .ov-section-header {
        text-align: center;
        max-width: 680px;
        margin: 0 auto 52px;
    }

    .ov-section-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 700;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 16px;
    }

    .ov-section-tag i { font-size: 11px; }

    .ov-section-heading {
        font-size: clamp(26px, 3.5vw, 40px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.2;
        margin: 0 0 14px;
    }

    .ov-section-sub {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.75;
        margin: 0;
    }

    /* ================================================================
    INTRO SECTION
    ================================================================ */
    .ov-intro-section {
        background: #ffffff;
        padding: 80px 0 90px;
    }

    .ov-intro-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 64px;
        align-items: center;
    }

    .ov-intro-content { display: flex; flex-direction: column; gap: 18px; }

    .ov-intro-heading {
        font-size: clamp(26px, 3.2vw, 40px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.25;
        margin: 0;
    }

    .ov-intro-text {
        font-size: 15px;
        color: #4b5563;
        line-height: 1.82;
        margin: 0;
    }

    .ov-intro-text strong { color: #0d1b5e; font-weight: 700; }

    .ov-intro-pills {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 4px;
    }

    .ov-pill {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 13px;
        font-weight: 600;
        padding: 6px 16px;
        border-radius: 50px;
    }

    .ov-pill i { color: #f5b800; font-size: 12px; }

    /* Right visual */
    .ov-intro-visual { position: relative; }

    .ov-intro-img-wrap {
        position: relative;
        border-radius: 20px;
        overflow: visible;
    }

    .ov-intro-img {
        width: 100%;
        height: 420px;
        object-fit: cover;
        border-radius: 20px;
        display: block;
        box-shadow: 0 24px 60px rgba(13,27,94,0.18);
    }

    /* Floating badge */
    .ov-intro-badge {
        position: absolute;
        bottom: -22px;
        left: -22px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        border-radius: 16px;
        padding: 16px 22px;
        display: flex;
        align-items: center;
        gap: 12px;
        box-shadow: 0 8px 28px rgba(245,184,0,0.45);
    }

    .ov-badge-num {
        font-size: 36px;
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1;
    }

    .ov-badge-text {
        font-size: 13px;
        font-weight: 700;
        color: #0d1b5e;
        line-height: 1.4;
    }

    /* ================================================================
    INSPIRATION FEATURE (A.P.J. Abdul Kalam) — modern animated design
    Logo: Navy #0d1b5e · Blue #1a2a6c · Gold #f5b800
    ================================================================ */
    .ov-stats-section {
        --ov-blue: #1a2a6c;
        --ov-navy: #0d1b5e;
        --ov-gold: #f5b800;
        --ov-ink: #060f3a;
        position: relative;
        overflow: hidden;
        padding: 30px 0 14px;
        border-top: 3px solid var(--ov-gold);
        background:
            linear-gradient(135deg, rgba(26,42,108,0.94) 0%, rgba(13,27,94,0.94) 46%, rgba(6,15,58,0.94) 100%),
            radial-gradient(900px 520px at 12% 8%, rgba(245,184,0,0.22) 0%, transparent 60%),
            radial-gradient(880px 520px at 92% 78%, rgba(255,255,255,0.12) 0%, transparent 60%);
        background-size: 100% 100%, 200% 200%, 200% 200%;
        animation: ovInspireBg 16s ease-in-out infinite;
    }

    .ov-stats-section::before {
        content: "";
        position: absolute;
        inset: -2px;
        pointer-events: none;
        z-index: 0;
        background:
            radial-gradient(circle at 18% 78%, rgba(255,255,255,0.10) 0%, transparent 44%),
            radial-gradient(circle at 34% 18%, rgba(245,184,0,0.20) 0%, transparent 54%),
            radial-gradient(circle at 72% 56%, rgba(255,255,255,0.08) 0%, transparent 52%),
            radial-gradient(circle at 92% 16%, rgba(245,184,0,0.12) 0%, transparent 50%);
        filter: blur(2px);
        opacity: 0.95;
        animation: ovInspireBubbles 14s ease-in-out infinite;
    }

    .ov-stats-section::after {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        z-index: 0;
        background:
            radial-gradient(rgba(255,255,255,0.10) 1px, transparent 1px),
            linear-gradient(180deg, rgba(0,0,0,0.30) 0%, rgba(0,0,0,0.12) 45%, rgba(0,0,0,0.38) 100%);
        background-size: 28px 28px, 100% 100%;
        opacity: 0.32;
        animation: ovInspireGrid 20s linear infinite;
    }

    @keyframes ovInspireBg {
        0%, 100% { background-position: 0% 0%, 0% 35%, 100% 70%; }
        50%      { background-position: 0% 0%, 100% 60%, 0% 40%; }
    }

    @keyframes ovInspireBubbles {
        0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
        50%      { transform: translate3d(10px, -10px, 0) scale(1.02); }
    }

    @keyframes ovInspireGrid {
        0%   { background-position: 0 0, 0 0; }
        100% { background-position: 28px 28px, 0 0; }
    }

    .ov-amb-grid {
        position: relative;
        z-index: 1;
        display: grid;
        grid-template-columns: 0.92fr 1.08fr;
        gap: 48px;
        align-items: center;
    }

    .ov-amb-media {
        margin: 0;
        position: relative;
        border-radius: 26px;
        overflow: hidden;
        border: 1px solid rgba(255,255,255,0.18);
        box-shadow: 0 32px 90px rgba(0,0,0,0.42);
        background: rgba(255,255,255,0.06);
        transform: translateZ(0);
        animation: ovInspireIn 900ms cubic-bezier(.2,.8,.2,1) both;
    }

    .ov-amb-media::before {
        content: "";
        position: absolute;
        inset: -40px -40px auto auto;
        width: 220px;
        height: 220px;
        border-radius: 999px;
        background: radial-gradient(circle at 30% 30%, rgba(245,184,0,0.28), rgba(245,184,0,0.00) 62%);
        filter: blur(2px);
        opacity: 0.9;
        pointer-events: none;
        animation: ovInspireOrb 10s ease-in-out infinite;
    }

    .ov-amb-media::after {
        /* keep image clean: no dark overlay */
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(circle at 18% 18%, rgba(245,184,0,0.12), transparent 56%);
        opacity: 0.25;
        pointer-events: none;
    }

    @keyframes ovInspireOrb {
        0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
        50%      { transform: translate3d(-14px, 10px, 0) scale(1.06); }
    }

    .ov-amb-img {
        display: block;
        width: 100%;
        height: 299px;
        object-fit: cover;
        transform: scale(1.03);
        filter: contrast(1.04) saturate(1.04);
        transition: transform 700ms ease;
    }

    .ov-amb-media:hover .ov-amb-img { transform: scale(1.07); }

    .ov-amb-chip {
        position: absolute;
        left: 16px;
        right: 16px;
        bottom: 16px;
        width: fit-content;
        max-width: 100%;
        padding: 8px 14px;
        border-radius: 999px;
        background: rgba(255,255,255,0.10);
        border: 1px solid rgba(255,255,255,0.24);
        color: rgba(255,255,255,0.92);
        font-size: 12px;
        font-weight: 900;
        letter-spacing: 0.3px;
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        box-shadow: 0 14px 40px rgba(0,0,0,0.30);
        z-index: 2;
        animation: ovInspireChip 1.1s cubic-bezier(.2,.8,.2,1) 250ms both;
    }

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

    .ov-amb-content {
        position: relative;
        animation: ovInspireIn 900ms cubic-bezier(.2,.8,.2,1) 120ms both;
    }

    /* Glass quote panel behind text */
    .ov-amb-content::before {
        content: "";
        position: absolute;
        inset: -18px -18px -18px -18px;
        border-radius: 24px;
        background: rgba(255,255,255,0.06);
        border: 1px solid rgba(255,255,255,0.14);
        box-shadow: 0 22px 70px rgba(0,0,0,0.22);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }

    .ov-amb-text {
        position: relative;
        z-index: 1;
    }

    /* Quote styling without changing HTML */
    .ov-amb-text {
        margin: 0;
        color: rgba(255,255,255,0.88);
        font-size: clamp(18px, 2.0vw, 30px);
        line-height: 1.45;
        max-width: 30ch;
        font-weight: 950;
        letter-spacing: -0.2px;
        padding: 18px 18px;
        border-radius: 20px;
        background: linear-gradient(135deg, rgba(255,255,255,0.07), rgba(255,255,255,0.03));
        border: 1px solid rgba(255,255,255,0.16);
        box-shadow: 0 22px 70px rgba(0,0,0,0.22);
    }

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

    @media (max-width: 1024px) {
        .ov-stats-section { padding: 72px 0 76px; }
        .ov-amb-grid { grid-template-columns: 1fr; gap: 28px; }
        .ov-amb-img { height: clamp(280px, 56vw, 420px); }
        .ov-amb-content::before { inset: -14px; }
        .ov-amb-text { max-width: 44ch; }
    }

    @media (max-width: 480px) {
        .ov-stats-section { padding: 60px 0 64px; }
        .ov-amb-chip { left: 12px; right: 12px; bottom: 12px; font-size: 11.5px; }
        .ov-amb-text { font-size: clamp(17px, 5.2vw, 22px); padding: 16px 14px; }
    }

    @media (prefers-reduced-motion: reduce) {
        .ov-stats-section,
        .ov-stats-section::before,
        .ov-stats-section::after,
        .ov-amb-media,
        .ov-amb-media::before,
        .ov-amb-content {
            animation: none !important;
        }
        .ov-amb-img { transition: none !important; }
        .ov-amb-chip { animation: none !important; }
    }
    /* ================================================================
    VISION & MISSION SECTION
    ================================================================ */
    .ov-vm-section {
        background: #f0f5ff;
        padding: 80px 0 90px;
    }

    .ov-vm-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

    .ov-vm-card {
        background: #ffffff;
        border-radius: 18px;
        padding: 36px 30px;
        display: flex;
        flex-direction: column;
        gap: 16px;
        box-shadow: 0 4px 24px rgba(13,27,94,0.08);
        border-top: 4px solid transparent;
        transition: transform 0.28s, box-shadow 0.28s;
    }

    .ov-vm-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 16px 40px rgba(13,27,94,0.14);
    }

    .ov-vm-card--vision  { border-top-color: #0d1b5e; }
    .ov-vm-card--mission { border-top-color: #f5b800; }
    .ov-vm-card--values  { border-top-color: #43a047; }

    .ov-vm-icon {
        width: 58px;
        height: 58px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
    }

    .ov-vm-card--vision  .ov-vm-icon { background: rgba(13,27,94,0.09);  color: #0d1b5e; }
    .ov-vm-card--mission .ov-vm-icon { background: rgba(245,184,0,0.14); color: #d97b00; }
    .ov-vm-card--values  .ov-vm-icon { background: rgba(67,160,71,0.10); color: #2e7d32; }

    .ov-vm-title {
        font-size: 20px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0;
    }

    .ov-vm-text {
        font-size: 14.5px;
        color: #5a6782;
        line-height: 1.75;
        margin: 0;
        flex: 1;
    }

    .ov-vm-points {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 9px;
    }

    .ov-vm-points li {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 13.5px;
        color: #374151;
        font-weight: 500;
    }

    .ov-vm-points i { color: #0d1b5e; font-size: 14px; flex-shrink: 0; }

    .ov-vm-card--mission .ov-vm-points i { color: #d97b00; }
    .ov-vm-card--values  .ov-vm-points i { color: #2e7d32; }

    /* ================================================================
    WHY AAMS SECTION
    ================================================================ */
    .ov-why-section {
        background: #ffffff;
        padding: 80px 0 90px;
    }

    .ov-why-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

    .ov-why-card {
        background: #f8faff;
        border: 1px solid #e4eaf8;
        border-radius: 16px;
        padding: 32px 26px;
        display: flex;
        flex-direction: column;
        gap: 14px;
        transition: transform 0.28s, box-shadow 0.28s, border-color 0.28s;
    }

    .ov-why-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 14px 36px rgba(13,27,94,0.12);
        border-color: rgba(13,27,94,0.20);
    }

    .ov-why-icon-wrap {
        width: 56px;
        height: 56px;
        border-radius: 14px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        color: #ffffff;
        transition: transform 0.28s;
    }

    .ov-why-card:hover .ov-why-icon-wrap { transform: rotate(-8deg) scale(1.1); }

    .ov-why-title {
        font-size: 17px;
        font-weight: 700;
        color: #0d1b5e;
        margin: 0;
    }

    .ov-why-text {
        font-size: 14px;
        color: #5a6782;
        line-height: 1.72;
        margin: 0;
    }

    /* ================================================================
    PROGRAMMES SECTION
    ================================================================ */
    .ov-prog-section {
        background: #f0f5ff;
        padding: 80px 0 90px;
    }

    .ov-prog-grid {
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    .ov-prog-card {
        display: flex;
        align-items: center;
        gap: 20px;
        background: #ffffff;
        border: 1px solid #e4eaf8;
        border-radius: 14px;
        padding: 20px 24px;
        text-decoration: none;
        transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s;
    }

    .ov-prog-card:hover {
        transform: translateX(6px);
        box-shadow: 0 8px 28px rgba(13,27,94,0.12);
        border-color: rgba(13,27,94,0.22);
        text-decoration: none;
    }

    .ov-prog-code {
        width: 62px;
        min-width: 62px;
        height: 62px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 13px;
        font-weight: 900;
        color: #ffffff;
        letter-spacing: 1px;
    }

    .ov-prog-code--bba  { background: linear-gradient(135deg, #1a237e, #3949ab); }
    .ov-prog-code--bca  { background: linear-gradient(135deg, #00695c, #00acc1); }
    .ov-prog-code--bsw  { background: linear-gradient(135deg, #6a1b9a, #ab47bc); }
    .ov-prog-code--pmir { background: linear-gradient(135deg, #bf360c, #ff7043); }
    .ov-prog-code--msw  { background: linear-gradient(135deg, #1b5e20, #43a047); }
    .ov-prog-code--default { background: linear-gradient(135deg, #0d1b5e, #3949ab); }

    .ov-prog-info { flex: 1; }

    .ov-prog-title {
        font-size: 16px;
        font-weight: 700;
        color: #0d1b5e;
        margin: 0 0 8px;
        line-height: 1.3;
    }

    .ov-prog-meta {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 12px;
    }

    .ov-prog-meta span {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        font-size: 12.5px;
        color: #6b7280;
        font-weight: 500;
    }

    .ov-prog-meta i { color: #0d1b5e; font-size: 11px; }

    .ov-prog-level {
        background: rgba(13,27,94,0.09);
        color: #0d1b5e;
        font-size: 11px;
        font-weight: 800;
        padding: 2px 10px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .ov-prog-level--pg {
        background: rgba(191,54,12,0.09);
        color: #bf360c;
    }

    .ov-prog-arrow {
        width: 38px;
        height: 38px;
        border-radius: 50%;
        background: rgba(13,27,94,0.07);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        font-size: 14px;
        flex-shrink: 0;
        transition: background 0.22s, transform 0.22s;
    }

    .ov-prog-card:hover .ov-prog-arrow {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        transform: translateX(4px);
    }

    /* ================================================================
    AFFILIATIONS SECTION
    ================================================================ */
    .ov-aff-section {
        background: #ffffff;
        padding: 80px 0 90px;
    }

    .ov-aff-grid {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        gap: 20px;
    }

    .ov-aff-card {
        background: #f8faff;
        border: 1.5px solid #e4eaf8;
        border-radius: 16px;
        padding: 30px 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 12px;
        transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s;
    }

    .ov-aff-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 12px 32px rgba(13,27,94,0.12);
        border-color: #0d1b5e;
    }

    .ov-aff-icon {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        background: linear-gradient(135deg, rgba(13,27,94,0.10) 0%, rgba(13,27,94,0.04) 100%);
        border: 1.5px solid rgba(13,27,94,0.14);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        color: #0d1b5e;
        transition: background 0.25s, color 0.25s;
    }

    .ov-aff-card:hover .ov-aff-icon {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        border-color: transparent;
    }

    .ov-aff-name {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0;
    }

    .ov-aff-desc {
        font-size: 12.5px;
        color: #6b7280;
        margin: 0;
        line-height: 1.5;
    }

    /* ================================================================
    CTA BANNER SECTION
    ================================================================ */
    .ov-cta-section {
        position: relative;
        background: linear-gradient(135deg, #060f3a 0%, #0d1b5e 50%, #1535a8 100%);
        padding: 72px 0;
        overflow: hidden;
    }

    .ov-cta-section::before {
        content: '';
        position: absolute;
        inset: 0;
        background-image: radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1px);
        background-size: 28px 28px;
        pointer-events: none;
    }

    .ov-cta-overlay {
        position: absolute;
        top: -80px; right: -80px;
        width: 400px; height: 400px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(245,184,0,0.12) 0%, transparent 65%);
        pointer-events: none;
    }

    .ov-cta-inner {
        position: relative;
        z-index: 1;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 40px;
        flex-wrap: wrap;
    }

    .ov-cta-text { flex: 1; min-width: 280px; }

    .ov-cta-heading {
        font-size: clamp(22px, 3vw, 36px);
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 12px;
        line-height: 1.25;
    }

    .ov-cta-sub {
        font-size: 15px;
        color: rgba(255,255,255,0.72);
        line-height: 1.75;
        margin: 0;
    }

    .ov-cta-actions {
        display: flex;
        align-items: center;
        gap: 14px;
        flex-wrap: wrap;
        flex-shrink: 0;
    }

    .ov-cta-btn {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        font-size: 14.5px;
        font-weight: 700;
        padding: 14px 30px;
        border-radius: 50px;
        text-decoration: none;
        letter-spacing: 0.3px;
        white-space: nowrap;
        transition: transform 0.25s, box-shadow 0.25s, background 0.25s;
    }

    .ov-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        box-shadow: 0 6px 20px rgba(245,184,0,0.40);
    }

    .ov-cta-btn--primary:hover {
        background: linear-gradient(135deg, #ffd000 0%, #f5b800 100%);
        transform: translateY(-3px);
        box-shadow: 0 10px 28px rgba(245,184,0,0.55);
        color: #060f3a;
        text-decoration: none;
    }

    .ov-cta-btn--outline {
        background: transparent;
        color: #ffffff;
        border: 2px solid rgba(255,255,255,0.45);
    }

    .ov-cta-btn--outline:hover {
        background: rgba(255,255,255,0.10);
        border-color: #ffffff;
        transform: translateY(-3px);
        color: #ffffff;
        text-decoration: none;
    }

    /* ================================================================
    OVERVIEW PAGE RESPONSIVE
    ================================================================ */
    @media (max-width: 1024px) {
        .ov-stats-grid    { grid-template-columns: repeat(3, 1fr); }
        .ov-stat-card:nth-child(3) { border-right: none; }
        .ov-aff-grid      { grid-template-columns: repeat(3, 1fr); }
    }

    @media (max-width: 768px) {
        .page-hero-inner  { padding: 44px 20px 36px; }
        .page-hero-title  { font-size: clamp(26px, 8vw, 38px); }

        .ov-container     { padding: 0 20px; }

        .ov-intro-section { padding: 52px 0 60px; }
        .ov-intro-grid    { grid-template-columns: 1fr; gap: 40px; }
        .ov-intro-img     { height: 300px; }
        .ov-intro-badge   { left: 12px; bottom: -16px; }

        .ov-stats-section { padding: 44px 0; }
        .ov-stats-grid    { grid-template-columns: repeat(2, 1fr); }
        .ov-stat-card:nth-child(3) { border-right: 1px solid rgba(245,184,0,0.15); }
        .ov-stat-card:nth-child(2),
        .ov-stat-card:nth-child(4) { border-right: none; }

        .ov-vm-section    { padding: 52px 0 60px; }
        .ov-vm-grid       { grid-template-columns: 1fr; }

        .ov-why-section   { padding: 52px 0 60px; }
        .ov-why-grid      { grid-template-columns: repeat(2, 1fr); }

        .ov-prog-section  { padding: 52px 0 60px; }

        .ov-aff-section   { padding: 52px 0 60px; }
        .ov-aff-grid      { grid-template-columns: repeat(2, 1fr); }

        .ov-cta-section   { padding: 52px 0; }
        .ov-cta-inner     { flex-direction: column; align-items: flex-start; gap: 28px; }
    }

    @media (max-width: 480px) {
        .ov-container     { padding: 0 16px; }

        .ov-intro-img     { height: 230px; }

        .ov-stats-grid    { grid-template-columns: repeat(2, 1fr); }
        .ov-stat-num      { font-size: 30px; }
        .ov-stat-icon     { width: 44px; height: 44px; font-size: 17px; }

        .ov-why-grid      { grid-template-columns: 1fr; }
        .ov-aff-grid      { grid-template-columns: repeat(2, 1fr); }

        .ov-prog-card     { flex-wrap: wrap; }
        .ov-prog-arrow    { display: none; }

        .ov-cta-btn       { padding: 12px 22px; font-size: 13.5px; }
        .ov-cta-actions   { width: 100%; flex-direction: column; }
        .ov-cta-btn       { justify-content: center; }
    }

    /* ---- Public lead capture modal (footer) ---- */
    body.aams-lead-modal-open {
        overflow: hidden;
    }

    .aams-lead-modal {
        position: fixed;
        inset: 0;
        z-index: 10050;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 20px;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 0.28s ease, visibility 0.28s ease;
    }

    .aams-lead-modal.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    .aams-lead-modal__backdrop {
        position: absolute;
        inset: 0;
        background: rgba(13, 27, 94, 0.55);
        backdrop-filter: blur(4px);
    }

    .aams-lead-modal__dialog {
        position: relative;
        width: 100%;
        max-width: 440px;
        max-height: min(92vh, 640px);
        overflow-y: auto;
        background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
        border-radius: 18px;
        box-shadow: 0 24px 64px rgba(13, 27, 94, 0.35);
        border: 1px solid rgba(245, 184, 0, 0.35);
        padding: 22px 22px 18px;
    }

    .aams-lead-modal__close {
        position: absolute;
        top: 10px;
        right: 12px;
        width: 36px;
        height: 36px;
        border: none;
        border-radius: 10px;
        background: rgba(13, 27, 94, 0.06);
        color: #0d1b5e;
        font-size: 22px;
        line-height: 1;
        cursor: pointer;
        transition: background 0.2s, color 0.2s;
    }

    .aams-lead-modal__close:hover {
        background: rgba(245, 184, 0, 0.25);
        color: #0d1b5e;
    }

    .aams-lead-modal__title {
        font-size: 1.35rem;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 36px 6px 0;
        letter-spacing: -0.02em;
    }

    .aams-lead-modal__sub {
        margin: 0 0 16px;
        font-size: 14px;
        color: #64748b;
        line-height: 1.45;
    }

    .aams-lead-modal__form {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .aams-lead-modal__label {
        display: flex;
        flex-direction: column;
        gap: 5px;
        font-size: 13px;
        font-weight: 600;
        color: #334155;
    }

    .aams-lead-modal__req {
        color: #c2410c;
    }

    .aams-lead-modal__opt {
        font-weight: 500;
        color: #94a3b8;
        font-size: 12px;
    }

    .aams-lead-modal__input,
    .aams-lead-modal__textarea,
    .aams-lead-modal__select {
        width: 100%;
        border: 1px solid rgba(13, 27, 94, 0.15);
        border-radius: 10px;
        padding: 10px 12px;
        font-size: 14px;
        font-family: inherit;
        background: #fff;
        color: #0f172a;
        transition: border-color 0.2s, box-shadow 0.2s;
    }

    .aams-lead-modal__textarea {
        resize: vertical;
        min-height: 72px;
    }

    .aams-lead-modal__input:focus,
    .aams-lead-modal__textarea:focus,
    .aams-lead-modal__select:focus {
        outline: none;
        border-color: rgba(245, 184, 0, 0.85);
        box-shadow: 0 0 0 3px rgba(245, 184, 0, 0.22);
    }

    .aams-lead-modal__hp {
        position: absolute;
        left: -9999px;
        width: 1px;
        height: 1px;
        overflow: hidden;
    }

    .aams-lead-modal__err {
        margin: 0;
        font-size: 13px;
        font-weight: 600;
        color: #b91c1c;
    }

    .aams-lead-modal__actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        justify-content: flex-end;
        margin-top: 4px;
    }

    .aams-lead-modal__btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 10px 18px;
        border-radius: 999px;
        font-size: 14px;
        font-weight: 700;
        cursor: pointer;
        border: none;
        font-family: inherit;
        transition: transform 0.15s, box-shadow 0.2s, background 0.2s;
    }

    .aams-lead-modal__btn:disabled {
        opacity: 0.65;
        cursor: not-allowed;
    }

    .aams-lead-modal__btn--ghost {
        background: transparent;
        color: #475569;
        border: 1px solid rgba(100, 116, 139, 0.35);
    }

    .aams-lead-modal__btn--ghost:hover {
        background: rgba(148, 163, 184, 0.12);
    }

    .aams-lead-modal__btn--primary {
        background: linear-gradient(135deg, #0d1b5e 0%, #1e3a8a 100%);
        color: #fff;
        box-shadow: 0 4px 14px rgba(13, 27, 94, 0.28);
    }

    .aams-lead-modal__btn--primary:hover:not(:disabled) {
        transform: translateY(-1px);
        box-shadow: 0 6px 20px rgba(13, 27, 94, 0.35);
    }

    @media (max-width: 480px) {
        .aams-lead-modal__dialog {
            padding: 18px 16px 14px;
            border-radius: 16px;
        }

        .aams-lead-modal__actions {
            flex-direction: column-reverse;
        }

        .aams-lead-modal__btn {
            width: 100%;
        }
    }

    /* ---- Wave Divider ---- */
    .footer-wave {
        display: block;
        line-height: 0;
        margin-bottom: -29px;
        background: #f0f5ff;
    }

    .footer-wave svg {
        width: 100%;
        height: 80px;
        display: block;
    }

    /* ---- Footer Body ---- */
    .site-footer {
        background: linear-gradient(160deg, #060f3a 0%, #0d1b5e 40%, #112270 70%, #0a1845 100%);
        background-size: 200% 200%;
        background-position: 0% 50%;
        animation: footerBgShift 22s ease-in-out infinite;
        position: relative;
        overflow: hidden;
    }

    @keyframes footerBgShift {
        0%, 100% { background-position: 0% 45%; }
        50%      { background-position: 100% 55%; }
    }

    /* Dot grid overlay */
    .site-footer::before {
        content: '';
        position: absolute;
        inset: 0;
        background-image: radial-gradient(rgba(255,255,255,0.04) 1px, transparent 1px);
        background-size: 26px 26px;
        background-position: 0 0;
        animation: footerDotsDrift 28s linear infinite;
        pointer-events: none;
        z-index: 0;
    }

    @keyframes footerDotsDrift {
        0%   { background-position: 0 0; }
        100% { background-position: 26px 26px; }
    }

    /* Glowing orbs */
    .site-footer::after {
        content: '';
        position: absolute;
        bottom: -100px;
        right: -100px;
        width: 400px;
        height: 400px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(245,184,0,0.07) 0%, transparent 65%);
        pointer-events: none;
        z-index: 0;
        animation: footerOrbFloat 16s ease-in-out infinite;
    }

    @keyframes footerOrbFloat {
        0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.85; }
        50%      { transform: translate(-24px, -18px) scale(1.06); opacity: 1; }
    }

    .footer-body {
        padding: 64px 0 48px;
        position: relative;
        z-index: 1;
    }

    /* Soft “bubble” blobs + rising dots (decorative only; no extra DOM) */
    .footer-body::before {
        content: '';
        position: absolute;
        inset: 0;
        pointer-events: none;
        z-index: 0;
        background:
            radial-gradient(circle at 12% 78%, rgba(255, 255, 255, 0.07) 0%, transparent 42%),
            radial-gradient(circle at 88% 35%, rgba(245, 184, 0, 0.06) 0%, transparent 38%),
            radial-gradient(circle at 52% 12%, rgba(255, 255, 255, 0.05) 0%, transparent 36%);
        animation: footerBlobPulse 18s ease-in-out infinite;
    }

    @keyframes footerBlobPulse {
        0%, 100% { transform: translateY(0) scale(1); opacity: 0.85; }
        50%      { transform: translateY(-10px) scale(1.03); opacity: 1; }
    }

    .footer-body::after {
        content: '';
        position: absolute;
        left: 8%;
        bottom: -8px;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.12);
        box-shadow:
            18vw 0 0 2px rgba(255, 255, 255, 0.06),
            32vw -6vh 0 3px rgba(255, 255, 255, 0.05),
            48vw -14vh 0 2px rgba(245, 184, 0, 0.08),
            62vw -8vh 0 4px rgba(255, 255, 255, 0.04),
            78vw -18vh 0 2px rgba(255, 255, 255, 0.06),
            90vw -4vh 0 3px rgba(245, 184, 0, 0.06);
        pointer-events: none;
        z-index: 0;
        animation: footerBubbleRise 14s linear infinite;
    }

    @keyframes footerBubbleRise {
        0%   { transform: translateY(0) translateZ(0); opacity: 0.55; }
        85%  { opacity: 0.75; }
        100% { transform: translateY(-120px) translateZ(0); opacity: 0; }
    }

    /* ---- Container ---- */
    .footer-container {
        max-width: 1280px;
        margin: 0 auto;
        padding: 0 32px;
    }

    /* ---- 4-column Grid ---- */
    .footer-body .footer-container {
        position: relative;
        z-index: 1;
        display: grid;
        grid-template-columns: 1.6fr 1fr 1.3fr 1.3fr;
        gap: 48px;
        align-items: start;
    }

    /* ---- Column Title ---- */
    .footer-col-title {
        font-size: 15px;
        font-weight: 800;
        color: #ffffff;
        text-transform: uppercase;
        letter-spacing: 1px;
        margin-bottom: 22px;
        padding-bottom: 10px;
        position: relative;
    }

    .footer-col-title::after {
        content: '';
        position: absolute;
        left: 0;
        bottom: 0;
        width: 36px;
        height: 3px;
        background: linear-gradient(90deg, #f5b800, transparent);
        border-radius: 2px;
    }

    /* ================================================================
    COL 1: BRAND
    ================================================================ */
    .footer-logo-link {
        display: inline-block;
        margin-bottom: 14px;
    }

    .footer-logo-img {
        width: 80px;
        height: 80px;
        object-fit: contain;
        filter: drop-shadow(0 4px 12px rgba(0,0,0,0.4));
        transition: transform 0.3s ease;
    }

    .footer-logo-img:hover {
        transform: scale(1.06);
    }

    .footer-brand-name {
        font-size: 17px;
        font-weight: 800;
        color: #ffffff;
        line-height: 1.3;
        margin-bottom: 12px;
    }

    .footer-brand-desc {
        font-size: 13.5px;
        color: #8faadb;
        line-height: 1.75;
        margin-bottom: 22px;
    }

    /* Social Buttons */
    .footer-social {
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
    }

    .footer-social-btn {
        width: 38px;
        height: 38px;
        border-radius: 50%;
        background: rgba(255,255,255,0.07);
        border: 1px solid rgba(255,255,255,0.12);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #b8cbee;
        font-size: 14px;
        text-decoration: none;
        transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease, border-color 0.25s ease;
    }

    .footer-social-btn:hover {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        border-color: transparent;
        transform: translateY(-4px);
    }

    /* ================================================================
    COL 2 & 3: NAV LISTS
    ================================================================ */
    .footer-nav-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .footer-nav-link {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        color: #8faadb;
        font-size: 13.5px;
        text-decoration: none;
        transition: color 0.22s ease, gap 0.22s ease;
    }

    .footer-nav-link i {
        font-size: 10px;
        color: #f5b800;
        transition: transform 0.22s ease;
    }

    .footer-nav-link:hover {
        color: #f5b800;
        gap: 12px;
    }

    .footer-nav-link:hover i {
        transform: translateX(3px);
    }

    /* ================================================================
    COL 4: CONTACT
    ================================================================ */
    .footer-contact-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

    .footer-contact-item {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        font-size: 13.5px;
        color: #8faadb;
        line-height: 1.6;
        font-style: normal;
    }

    .footer-contact-icon {
        width: 34px;
        height: 34px;
        border-radius: 8px;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.25);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 14px;
        flex-shrink: 0;
        margin-top: 1px;
        transition: background 0.25s ease;
    }

    .footer-contact-item:hover .footer-contact-icon {
        background: rgba(245,184,0,0.22);
    }

    .footer-contact-link {
        color: #8faadb;
        text-decoration: none;
        transition: color 0.22s ease;
    }

    .footer-contact-link:hover {
        color: #f5b800;
    }

    /* ================================================================
    FOOTER BOTTOM BAR
    ================================================================ */
    .footer-bottom {
        background: rgba(0,0,0,0.3);
        border-top: 1px solid rgba(245,184,0,0.15);
        padding: 18px 0;
        position: relative;
        z-index: 1;
    }

    .footer-bottom-inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 12px;
    }

    .footer-copy {
        font-size: 15px;
        color: #6b84b8;
        margin: 0;
    }

    .footer-copy-link {
        color: #f5b800;
        text-decoration: none;
        font-weight: 600;
        transition: color 0.2s ease;
    }

    .footer-copy-link:hover {
        color: #ffd000;
    }

    .footer-bottom-links {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        align-items: center;
        gap: 20px;
        flex-wrap: wrap;
    }

    .footer-bottom-link {
        font-size: 12.5px;
        color: #6b84b8;
        text-decoration: none;
        transition: color 0.22s ease;
        position: relative;
    }

    .footer-bottom-link::after {
        content: '';
        position: absolute;
        left: 0;
        bottom: -2px;
        width: 0;
        height: 1px;
        background: #f5b800;
        transition: width 0.25s ease;
    }

    .footer-bottom-link:hover {
        color: #f5b800;
    }

    .footer-bottom-link:hover::after {
        width: 100%;
    }

    /* ================================================================
    SCROLL TO TOP BUTTON
    ================================================================ */
    .scroll-top-btn {
        position: fixed;
        bottom: 28px;
        right: 28px;
        width: 46px;
        height: 46px;
        border-radius: 50%;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        border: none;
        cursor: pointer;
        font-size: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 6px 20px rgba(245,184,0,0.45);
        opacity: 0;
        transform: translateY(20px);
        pointer-events: none;
        transition: opacity 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
        z-index: 9999;
    }

    .scroll-top-btn--visible {
        opacity: 1;
        transform: translateY(0);
        pointer-events: all;
    }

    .scroll-top-btn:hover {
        box-shadow: 0 10px 28px rgba(245,184,0,0.6);
        transform: translateY(-4px);
    }

    /* ================================================================
    FOOTER RESPONSIVE
    ================================================================ */
    @media (max-width: 1024px) {
        .footer-body .footer-container {
            grid-template-columns: 1fr 1fr;
            gap: 36px;
        }

        .footer-brand {
            grid-column: 1 / -1;
            display: grid;
            grid-template-columns: auto 1fr;
            gap: 20px 28px;
            align-items: start;
        }

        .footer-brand .footer-logo-link {
            grid-row: 1 / 3;
            margin-bottom: 0;
        }

        .footer-brand .footer-brand-desc {
            margin-bottom: 12px;
        }
    }

    @media (max-width: 768px) {
        .footer-wave svg {
            height: 50px;
        }

        .footer-body {
            padding: 48px 0 36px;
        }

        .footer-body .footer-container {
            grid-template-columns: 1fr;
            gap: 32px;
        }

        .footer-brand {
            grid-column: auto;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
        }

        .footer-bottom-inner {
            flex-direction: column;
            text-align: center;
            gap: 10px;
        }

        .footer-bottom-links {
            justify-content: center;
        }
    }

    @media (max-width: 480px) {
        .footer-container {
            padding: 0 16px;
        }

        .scroll-top-btn {
            bottom: 16px;
            right: 16px;
            width: 40px;
            height: 40px;
            font-size: 14px;
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .site-footer {
            animation: none !important;
            background-size: 100% 100%;
        }

        .site-footer::before,
        .site-footer::after,
        .footer-body::before,
        .footer-body::after {
            animation: none !important;
        }
    }

    /* ================================================================
    GOVERNING BODY PAGE
    ================================================================ */

    /* ---- Introduction Section ---- */
    .gb-intro-section {
        padding: 80px 0 60px;
        background: #f8f9fc;
    }
    .gb-intro-wrap {
        display: flex;
        gap: 36px;
        align-items: flex-start;
    }
    .gb-intro-icon-col {
        display: flex;
        flex-direction: column;
        align-items: center;
        flex-shrink: 0;
    }
    .gb-intro-icon-ring {
        width: 72px;
        height: 72px;
        border-radius: 50%;
        background: linear-gradient(135deg, #0d1b5e, #1e3a8a);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 28px;
        box-shadow: 0 8px 24px rgba(13, 27, 94, 0.25);
        flex-shrink: 0;
    }
    .gb-intro-vline {
        width: 3px;
        flex: 1;
        min-height: 60px;
        background: linear-gradient(to bottom, #0d1b5e22, transparent);
        margin-top: 12px;
        border-radius: 2px;
    }
    .gb-intro-body {
        flex: 1;
        padding-top: 8px;
    }
    .gb-intro-heading {
        font-size: clamp(26px, 3vw, 36px);
        font-weight: 800;
        color: #0d1b5e;
        margin: 10px 0 18px;
        line-height: 1.2;
    }
    .gb-intro-text {
        color: #4a5568;
        font-size: 16px;
        line-height: 1.8;
        margin-bottom: 16px;
    }
    .gb-intro-highlights {
        display: flex;
        flex-wrap: wrap;
        gap: 14px;
        margin-top: 24px;
    }
    .gb-intro-hl {
        display: flex;
        align-items: center;
        gap: 8px;
        background: #fff;
        border: 1.5px solid #e2e8f0;
        border-radius: 50px;
        padding: 8px 18px;
        font-size: 14px;
        font-weight: 600;
        color: #0d1b5e;
        box-shadow: 0 2px 8px rgba(13, 27, 94, 0.06);
    }
    .gb-intro-hl i {
        color: #f5b800;
        font-size: 15px;
    }

    /* ---- Chairman Section ---- */
    .gb-chair-section {
        padding: 60px 0;
        background: #fff;
    }
    .gb-chair-card {
        display: flex;
        gap: 48px;
        align-items: flex-start;
        background: linear-gradient(135deg, #0d1b5e 0%, #1e3a8a 60%, #0d1b5e 100%);
        border-radius: 20px;
        padding: 50px 48px;
        position: relative;
        overflow: hidden;
        box-shadow: 0 20px 60px rgba(13, 27, 94, 0.3);
    }
    .gb-chair-card::before {
        content: '';
        position: absolute;
        top: -60px;
        right: -60px;
        width: 260px;
        height: 260px;
        border-radius: 50%;
        background: rgba(245, 184, 0, 0.08);
        pointer-events: none;
    }
    .gb-chair-card::after {
        content: '';
        position: absolute;
        bottom: -80px;
        left: 30%;
        width: 300px;
        height: 300px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.04);
        pointer-events: none;
    }
    .gb-chair-avatar {
        width: 120px;
        height: 120px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        position: relative;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
        border: 4px solid rgba(255, 255, 255, 0.2);
        overflow: hidden;
        background: linear-gradient(135deg, rgba(245,184,0,0.90), rgba(13,27,94,0.65));
    }

    .gb-chair-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transform: scale(1.02);
    }
    .gb-chair-badge {
        position: absolute;
        bottom: 0;
        right: 0;
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        font-size: 14px;
        border: 3px solid #0d1b5e;
    }
    .gb-chair-content {
        flex: 1;
    }
    .gb-chair-role {
        display: inline-block;
        background: rgba(245, 184, 0, 0.15);
        color: #f5b800;
        border: 1px solid rgba(245, 184, 0, 0.35);
        border-radius: 50px;
        padding: 4px 16px;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.8px;
        text-transform: uppercase;
        margin-bottom: 10px;
    }
    .gb-chair-name {
        font-size: clamp(22px, 2.8vw, 32px);
        font-weight: 800;
        color: #ffffff;
        margin: 0 0 6px;
        line-height: 1.2;
    }
    .gb-chair-qual {
        font-size: 14px;
        color: rgba(255, 255, 255, 0.65);
        margin-bottom: 20px;
    }
    .gb-chair-quote {
        position: relative;
        margin: 0 0 20px;
        padding-left: 20px;
        border-left: 3px solid #f5b800;
    }
    .gb-chair-quote p {
        font-size: 15px;
        line-height: 1.75;
        color: rgba(255, 255, 255, 0.85);
        font-style: italic;
        margin: 0;
    }
    .gb-quote-icon {
        color: #f5b800;
        font-size: 20px;
        margin-bottom: 8px;
        display: block;
    }
    .gb-chair-tags {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
    }
    .gb-tag {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        background: rgba(255, 255, 255, 0.1);
        color: rgba(255, 255, 255, 0.8);
        border-radius: 50px;
        padding: 6px 14px;
        font-size: 13px;
        font-weight: 500;
        border: 1px solid rgba(255, 255, 255, 0.15);
    }
    .gb-tag i {
        color: #f5b800;
    }

    /* ---- Members Section ---- */
    .gb-members-section {
        padding: 80px 0;
        background: #f8f9fc;
    }
    .gb-members-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
        margin-top: 48px;
    }
    .gb-member-card {
        background: #fff;
        border-radius: 16px;
        padding: 28px 24px;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 16px;
        box-shadow: 0 4px 16px rgba(13, 27, 94, 0.07);
        border: 1.5px solid #e8edf5;
        transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
        position: relative;
        overflow: hidden;
    }
    .gb-member-card::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 4px;
        background: linear-gradient(90deg, #0d1b5e, #f5b800);
        opacity: 0;
        transition: opacity 0.3s ease;
    }
    .gb-member-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 16px 40px rgba(13, 27, 94, 0.14);
        border-color: #0d1b5e22;
    }
    .gb-member-card:hover::before {
        opacity: 1;
    }
    .gb-member-card--featured {
        border-color: rgba(245, 184, 0, 0.4);
        background: linear-gradient(135deg, #fff 60%, #fffbeb);
    }
    .gb-member-card--featured::before {
        opacity: 1;
    }
    .gb-member-avatar {
        width: 80px;
        height: 80px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        font-weight: 800;
        color: #fff;
        flex-shrink: 0;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    }
    /* Avatar colours */
    .gb-av--blue   { background: linear-gradient(135deg, #0d1b5e, #1e3a8a); }
    .gb-av--gold   { background: linear-gradient(135deg, #d4950a, #f5b800); color: #0d1b5e; }
    .gb-av--teal   { background: linear-gradient(135deg, #0d9488, #14b8a6); }
    .gb-av--purple { background: linear-gradient(135deg, #6d28d9, #8b5cf6); }
    .gb-av--orange { background: linear-gradient(135deg, #c2410c, #f97316); }
    .gb-av--green  { background: linear-gradient(135deg, #15803d, #22c55e); }
    .gb-av--red    { background: linear-gradient(135deg, #b91c1c, #ef4444); }
    .gb-member-info {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 5px;
        width: 100%;
    }
    .gb-member-name {
        font-size: 16px;
        font-weight: 700;
        color: #0d1b5e;
        margin: 0;
        line-height: 1.3;
    }
    .gb-member-role {
        display: inline-block;
        background: #eef2ff;
        color: #0d1b5e;
        border-radius: 50px;
        padding: 3px 14px;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.5px;
        text-transform: uppercase;
    }
    .gb-member-role.gb-role--primary {
        background: #fffbeb;
        color: #92400e;
        border: 1px solid #f5b80055;
    }
    .gb-member-role.gb-role--exofficio {
        background: #f5f3ff;
        color: #5b21b6;
    }
    .gb-member-qual {
        font-size: 13px;
        color: #64748b;
        margin: 2px 0 0;
    }
    .gb-member-org {
        font-size: 12px;
        color: #94a3b8;
        display: flex;
        align-items: center;
        gap: 5px;
        margin: 2px 0 0;
    }
    .gb-member-org i {
        color: #f5b800;
        font-size: 11px;
    }

    /* ---- Committees Section ---- */
    .gb-committee-section {
        --gb-blue: #0d1b5e;
        --gb-blue2: #1a2a6c;
        --gb-gold: #f5b800;
        padding: 80px 0;
        background:
            radial-gradient(900px 520px at 10% 0%, rgba(245,184,0,0.10) 0%, transparent 60%),
            radial-gradient(900px 520px at 95% 75%, rgba(13,27,94,0.08) 0%, transparent 60%),
            linear-gradient(180deg, #ffffff 0%, #f6f8ff 100%);
        position: relative;
        overflow: hidden;
    }
    .gb-committee-grid {
        counter-reset: gbStep;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 22px 56px;
        margin-top: 48px;
        position: relative;
    }

    /* Center workflow line (desktop/tablet) */
    .gb-committee-grid::before {
        content: "";
        position: absolute;
        top: 10px;
        bottom: 10px;
        left: 50%;
        width: 2px;
        transform: translateX(-50%);
        background: linear-gradient(180deg, transparent, rgba(13,27,94,0.20), rgba(245,184,0,0.25), rgba(13,27,94,0.20), transparent);
        border-radius: 999px;
        pointer-events: none;
    }
    .gb-committee-card {
        counter-increment: gbStep;
        background:
            linear-gradient(135deg, rgba(13,27,94,0.04) 0%, rgba(245,184,0,0.05) 100%),
            #ffffff;
        border-radius: 18px;
        padding: 30px 28px 28px;
        border: 1px solid rgba(13, 27, 94, 0.10);
        box-shadow: 0 16px 46px rgba(13, 27, 94, 0.10);
        transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
        position: relative;
        overflow: hidden;
        isolation: isolate;
        animation: gbStepIn 800ms cubic-bezier(.2,.8,.2,1) both;
    }

    /* top gradient bar */
    .gb-committee-card::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        height: 4px;
        background: linear-gradient(90deg, var(--gb-blue), var(--gb-gold));
        opacity: 0.9;
    }

    /* connector dot on workflow line */
    .gb-committee-card::after {
        content: "";
        position: absolute;
        top: 26px;
        width: 14px;
        height: 14px;
        border-radius: 999px;
        background: linear-gradient(135deg, var(--gb-gold), #e07b00);
        box-shadow: 0 10px 26px rgba(245,184,0,0.26);
        border: 3px solid rgba(255,255,255,0.95);
        z-index: 2;
    }

    /* Left column dots sit on center line */
    .gb-committee-card:nth-child(odd)::after {
        right: -35px;
    }

    /* Right column dots sit on center line */
    .gb-committee-card:nth-child(even)::after {
        left: -35px;
    }

    /* Step number pill (attached to icon) */
    .gb-committee-icon {
        position: relative;
    }

    .gb-committee-icon::after {
        content: "Step " counter(gbStep);
        position: absolute;
        left: 62px;
        top: 50%;
        transform: translateY(-50%);
        padding: 6px 10px;
        border-radius: 999px;
        background: rgba(13,27,94,0.06);
        border: 1px solid rgba(13,27,94,0.10);
        color: var(--gb-blue);
        font-size: 11px;
        font-weight: 900;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        white-space: nowrap;
    }
    .gb-committee-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 22px 60px rgba(13, 27, 94, 0.14);
        border-color: rgba(245,184,0,0.45);
    }
    .gb-committee-card:hover .gb-committee-icon { transform: translateY(-1px); }
    .gb-committee-icon {
        width: 60px;
        height: 60px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
        color: #fff;
        margin-bottom: 20px;
        box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15);
        transition: transform 0.28s ease;
    }
    .gb-ci--blue   { background: linear-gradient(135deg, #0d1b5e, #1e3a8a); }
    .gb-ci--gold   { background: linear-gradient(135deg, #d4950a, #f5b800); }
    .gb-ci--green  { background: linear-gradient(135deg, #15803d, #22c55e); }
    .gb-ci--purple { background: linear-gradient(135deg, #6d28d9, #8b5cf6); }
    .gb-ci--orange { background: linear-gradient(135deg, #c2410c, #f97316); }
    .gb-ci--red    { background: linear-gradient(135deg, #b91c1c, #ef4444); }
    .gb-committee-title {
        font-size: 18px;
        font-weight: 700;
        color: #0d1b5e;
        margin: 0 0 12px;
    }
    .gb-committee-desc {
        font-size: 14px;
        line-height: 1.7;
        color: #64748b;
        margin-bottom: 18px;
    }
    .gb-committee-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    .gb-committee-list li {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        color: #475569;
        font-weight: 500;
    }
    .gb-committee-list li i {
        color: #f5b800;
        font-size: 11px;
    }

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

    .gb-committee-card:nth-child(1) { animation-delay: 0ms; }
    .gb-committee-card:nth-child(2) { animation-delay: 60ms; }
    .gb-committee-card:nth-child(3) { animation-delay: 120ms; }
    .gb-committee-card:nth-child(4) { animation-delay: 180ms; }
    .gb-committee-card:nth-child(5) { animation-delay: 240ms; }
    .gb-committee-card:nth-child(6) { animation-delay: 300ms; }

    /* ================================================================
    GOVERNING BODY — RESPONSIVE
    ================================================================ */
    @media (max-width: 991px) {
        .gb-members-grid,
        .gb-committee-grid {
            grid-template-columns: repeat(2, 1fr);
        }
        .gb-chair-card {
            flex-direction: column;
            align-items: center;
            text-align: center;
            padding: 40px 28px;
            gap: 28px;
        }
        .gb-chair-quote {
            text-align: left;
        }
        .gb-chair-tags {
            justify-content: center;
        }
    }

    @media (max-width: 767px) {
        .gb-intro-section {
            padding: 50px 0 40px;
        }
        .gb-intro-wrap {
            flex-direction: column;
            gap: 20px;
        }
        .gb-intro-icon-col {
            flex-direction: row;
            align-items: center;
            gap: 14px;
        }
        .gb-intro-vline {
            width: 60px;
            height: 3px;
            min-height: unset;
            margin: 0;
            flex: none;
            background: linear-gradient(to right, #0d1b5e22, transparent);
        }
        .gb-intro-highlights {
            flex-direction: column;
        }
        .gb-intro-hl {
            border-radius: 10px;
        }
        .gb-chair-section {
            padding: 40px 0;
        }
        .gb-chair-card {
            padding: 32px 20px;
            border-radius: 14px;
        }
        .gb-chair-avatar {
            width: 90px;
            height: 90px;
            font-size: 26px;
        }
        .gb-members-section,
        .gb-committee-section {
            padding: 50px 0;
        }
        .gb-members-grid,
        .gb-committee-grid {
            grid-template-columns: 1fr;
            gap: 16px;
        }
        .gb-committee-grid::before { display: none; }

        .gb-committee-card::after {
            /* connector dot becomes a left marker on mobile */
            left: 18px;
            right: auto;
            top: 22px;
        }

        .gb-committee-icon::after {
            left: 66px;
        }
        .gb-member-card {
            flex-direction: row;
            text-align: left;
            align-items: center;
            padding: 20px;
            gap: 16px;
        }
        .gb-member-card::before {
            width: 4px;
            height: 100%;
            top: 0;
            right: unset;
            bottom: 0;
        }
        .gb-member-info {
            align-items: flex-start;
        }
        .gb-member-avatar {
            width: 60px;
            height: 60px;
            font-size: 18px;
            flex-shrink: 0;
        }
        .gb-committee-card {
            padding: 24px 20px;
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .gb-committee-card {
            animation: none !important;
        }
    }

    /* ================================================================
    OVERVIEW PAGE — Founder Message Teaser
    ================================================================ */
    .ov-founder-section {
        background: linear-gradient(180deg, #ffffff 0%, #f6f8ff 100%);
        padding: 28px 0;
    }

    .ov-founder-card {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 22px 22px;
        border-radius: 16px;
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        box-shadow: 0 14px 40px rgba(13, 27, 94, 0.10);
    }

    .ov-founder-icon {
        width: 54px;
        height: 54px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        background: linear-gradient(135deg, rgba(245,184,0,0.30), rgba(245,184,0,0.12));
        border: 1px solid rgba(245, 184, 0, 0.35);
        flex-shrink: 0;
    }

    .ov-founder-icon i { font-size: 20px; }

    .ov-founder-content { flex: 1; min-width: 0; }

    .ov-founder-title {
        font-size: 18px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 6px;
    }

    .ov-founder-text {
        font-size: 14px;
        color: #5a6782;
        margin: 0;
        line-height: 1.7;
        max-width: 680px;
    }

    .ov-founder-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 800;
        font-size: 14px;
        padding: 12px 16px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,0.06);
        box-shadow: 0 10px 24px rgba(245, 184, 0, 0.24);
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
        white-space: nowrap;
    }

    .ov-founder-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.30);
        filter: brightness(1.02);
    }

    .ov-founder-btn i { font-size: 13px; transition: transform 0.2s; }
    .ov-founder-btn:hover i { transform: translateX(3px); }

    @media (max-width: 767px) {
        .ov-founder-section { padding: 22px 0; }
        .ov-founder-card {
            flex-direction: column;
            align-items: flex-start;
            padding: 18px 16px;
            border-radius: 14px;
        }
        .ov-founder-btn { width: 100%; justify-content: center; }
    }

    /* ================================================================
    FOUNDER MESSAGE PAGE
    ================================================================ */
    .fm-section {
        background: linear-gradient(180deg, #ffffff 0%, #f4f6ff 100%);
        padding: 80px 0 90px;
    }

    .fm-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }

    .fm-header {
        text-align: center;
        max-width: 860px;
        margin: 0 auto 52px;
    }

    .fm-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 800;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }

    .fm-tag i { font-size: 11px; color: #f5b800; }

    .fm-title {
        font-size: clamp(26px, 3.6vw, 42px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .fm-accent { color: #f5b800; }

    .fm-subtitle {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.8;
        margin: 0;
    }

    .fm-grid {
        display: grid;
        grid-template-columns: 360px 1fr;
        gap: 28px;
        align-items: start;
    }

    .fm-profile { position: relative; }

    /* ================================================================
    PROFILE CARD — REDESIGNED MODERN ANIMATED
    ================================================================ */
    @keyframes fm-ring-spin {
        from { transform: rotate(0deg); }
        to   { transform: rotate(360deg); }
    }
    @keyframes fm-glow-pulse {
        0%, 100% { opacity: 0.22; transform: scale(1); }
        50%       { opacity: 0.42; transform: scale(1.12); }
    }
    @keyframes fm-card-in {
        from { opacity: 0; transform: translateY(20px); }
        to   { opacity: 1; transform: translateY(0); }
    }
    @keyframes fm-avatar-pop {
        0%   { transform: scale(0.82); opacity: 0; }
        70%  { transform: scale(1.06); }
        100% { transform: scale(1);    opacity: 1; }
    }
    @keyframes fmAvatarGlow {
        0%, 100% { background-position: 10% 40%; }
        50%      { background-position: 90% 60%; }
    }

    /* Shared white card base (used by side-card, message-card, cta) */
    .fm-side-card,
    .fm-message-card,
    .fm-cta {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13,27,94,0.10);
    }

    /* ── Profile card: dark gradient hero ── */
    .fm-profile-card {
        position: relative;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 28px 22px 22px;
        border-radius: 20px;
        background: linear-gradient(150deg, #0d1b5e 0%, #1a2a6c 50%, #101e6e 100%);
        border: 1px solid rgba(245,184,0,0.22);
        box-shadow:
            0 20px 50px rgba(13,27,94,0.45),
            0 0 0 1px rgba(255,255,255,0.05) inset;
        animation: fm-card-in 0.6s cubic-bezier(0.22,1,0.36,1) both;
        gap: 0;
    }

    /* Background glow blob */
    .fm-pc-glow {
        position: absolute;
        top: -40px; left: 50%;
        transform: translateX(-50%);
        width: 200px; height: 200px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(245,184,0,0.18) 0%, transparent 70%);
        filter: blur(36px);
        pointer-events: none;
        animation: fm-glow-pulse 6s ease-in-out infinite;
    }
    .fm-pc-glow::after {
        content: "";
        position: absolute;
        bottom: -80px; right: -30px;
        width: 160px; height: 160px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(57,73,171,0.3) 0%, transparent 70%);
        filter: blur(30px);
        animation: fm-glow-pulse 8s ease-in-out infinite reverse;
    }

    /* Avatar wrapper (for ring positioning) */
    .fm-pc-avatar-wrap {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 16px;
    }

    /* Spinning gold gradient ring */
    .fm-pc-ring {
        position: absolute;
        inset: -5px;
        border-radius: 50%;
        background: conic-gradient(
            from 0deg,
            #f5b800 0%,
            #ffd740 25%,
            rgba(13,27,94,0.3) 50%,
            #f5b800 75%,
            #ffd740 100%
        );
        animation: fm-ring-spin 6s linear infinite;
        z-index: 0;
    }
    .fm-pc-ring::after {
        content: "";
        position: absolute;
        inset: 4px;
        border-radius: 50%;
        background: linear-gradient(150deg, #0d1b5e 0%, #1a2a6c 100%);
    }

    /* Avatar circle */
    .fm-avatar {
        position: relative;
        z-index: 1;
        width: 84px;
        height: 84px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c 0%, #0d1b5e 100%);
        display: flex;
        align-items: center;
        justify-content: center;
        border: 3px solid rgba(245,184,0,0.5);
        box-shadow: 0 8px 24px rgba(13,27,94,0.5);
        animation: fm-avatar-pop 0.7s cubic-bezier(0.22,1,0.36,1) 0.2s both;
        flex-shrink: 0;
    }

    .fm-avatar-img {
        width: 100%;
        height: 100%;
        border-radius: 50%;
        object-fit: cover;
        display: block;
    }

    .fm-avatar-text {
        font-size: 30px;
        font-weight: 900;
        color: #f5b800;
        line-height: 1;
        letter-spacing: -1px;
        user-select: none;
    }

    /* Body text */
    .fm-pc-body {
        position: relative;
        z-index: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 4px;
    }

    /* Role tag pill */
    .fm-pc-tag {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        padding: 3px 12px;
        background: rgba(245,184,0,0.15);
        border: 1px solid rgba(245,184,0,0.35);
        border-radius: 50px;
        font-size: 10.5px;
        font-weight: 800;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        color: #f5b800;
        margin-bottom: 6px;
    }
    .fm-pc-tag i { font-size: 10px; }

    .fm-name {
        margin: 0;
        font-size: 15.5px;
        font-weight: 900;
        color: #fff;
        letter-spacing: -0.2px;
        line-height: 1.3;
    }

    .fm-role {
        margin: 0;
        font-size: 12px;
        font-weight: 600;
        color: rgba(255,255,255,0.58);
        line-height: 1.4;
    }

    /* Separator accent line */
    .fm-profile-card::before {
        content: "";
        position: absolute;
        bottom: 0; left: 20%; right: 20%;
        height: 2px;
        background: linear-gradient(90deg, transparent, #f5b800, transparent);
        border-radius: 2px;
        pointer-events: none;
    }

    /* Profile meta (kept for layout compat) */
    .fm-profile-meta { position: relative; z-index: 1; }

    /* Badges */
    .fm-profile-badges {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 12px;
    }
    .fm-badge {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        font-size: 12.5px;
        font-weight: 700;
        color: #0d1b5e;
        background: rgba(13,27,94,0.06);
        border: 1px solid rgba(13,27,94,0.10);
        padding: 7px 10px;
        border-radius: 999px;
    }
    .fm-badge i { color: #f5b800; font-size: 11px; }

    /* Reduced motion */
    @media (prefers-reduced-motion: reduce) {
        .fm-pc-ring       { animation: none !important; }
        .fm-pc-glow       { animation: none !important; }
        .fm-avatar        { animation: none !important; opacity: 1 !important; transform: none !important; }
        .fm-profile-card  { animation: none !important; opacity: 1 !important; }
    }

    /* Responsive */
    @media (max-width: 480px) {
        .fm-profile-card { padding: 22px 16px 18px; }
        .fm-avatar { width: 72px; height: 72px; }
        .fm-avatar-text { font-size: 26px; }
        .fm-name { font-size: 14.5px; }
    }

    .fm-side-card {
        margin-top: 14px;
        padding: 18px 18px;
    }

    .fm-side-title {
        margin: 0 0 12px;
        font-size: 15px;
        font-weight: 900;
        color: #0d1b5e;
    }

    .fm-side-link {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 10px;
        border-radius: 12px;
        color: #0d1b5e;
        font-weight: 700;
        font-size: 14px;
        transition: background 0.2s, transform 0.2s;
    }

    .fm-side-link i { color: #f5b800; }

    .fm-side-link:hover {
        background: rgba(245,184,0,0.12);
        transform: translateX(2px);
    }

    .fm-message-card { padding: 26px 26px; }

    .fm-lead {
        font-size: 16px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
    }

    .fm-paragraph {
        font-size: 15px;
        color: #475569;
        line-height: 1.9;
        margin: 0 0 14px;
    }

    .fm-paragraph strong { color: #0d1b5e; font-weight: 800; }

    .fm-quote {
        margin: 18px 0 22px;
        padding: 18px 18px;
        border-radius: 16px;
        background: linear-gradient(135deg, rgba(13,27,94,0.07), rgba(245,184,0,0.10));
        border: 1px solid rgba(13,27,94,0.10);
        display: flex;
        gap: 12px;
        align-items: flex-start;
    }

    .fm-quote i { color: #f5b800; font-size: 18px; margin-top: 2px; }
    .fm-quote p { margin: 0; color: #0d1b5e; font-weight: 800; line-height: 1.7; }

    .fm-h3 {
        font-size: 18px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 18px 0 12px;
    }

    .fm-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: grid;
        gap: 10px;
    }

    .fm-list li {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 14px;
        font-weight: 650;
        color: #475569;
    }

    .fm-list li i { color: #f5b800; font-size: 12px; }

    .fm-signature {
        margin-top: 22px;
        padding-top: 16px;
        border-top: 1px dashed rgba(13, 27, 94, 0.20);
    }

    .fm-closing { margin: 0 0 10px; color: #475569; font-weight: 700; }
    .fm-sig-name { margin: 0; color: #0d1b5e; font-weight: 900; font-size: 16px; }
    .fm-sig-org { margin: 6px 0 0; color: #6b7280; font-weight: 700; font-size: 13px; }

    .fm-cta {
        margin-top: 16px;
        padding: 22px 22px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-color: rgba(245,184,0,0.22);
    }

    .fm-cta-title {
        margin: 0 0 8px;
        color: #ffffff;
        font-weight: 900;
        font-size: 18px;
    }

    .fm-cta-sub {
        margin: 0;
        color: rgba(255,255,255,0.78);
        line-height: 1.7;
        font-size: 14px;
        max-width: 520px;
    }

    .fm-cta-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }

    .fm-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        border-radius: 12px;
        padding: 12px 16px;
        font-weight: 900;
        font-size: 14px;
        border: 1px solid transparent;
        transition: transform 0.2s, box-shadow 0.2s, background 0.2s, color 0.2s;
        white-space: nowrap;
    }

    .fm-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.30);
    }

    .fm-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 18px 44px rgba(245, 184, 0, 0.34); }

    .fm-btn--outline {
        background: rgba(255,255,255,0.06);
        border-color: rgba(255,255,255,0.22);
        color: #ffffff;
    }

    .fm-btn--outline:hover {
        transform: translateY(-2px);
        background: rgba(255,255,255,0.10);
        border-color: rgba(255,255,255,0.32);
    }

    @media (max-width: 991px) {
        .fm-grid { grid-template-columns: 1fr; }
    }

    @media (max-width: 767px) {
        .fm-section { padding: 56px 0 64px; }
        .fm-container { padding: 0 18px; }
        .fm-message-card { padding: 20px 18px; border-radius: 16px; }
        .fm-profile-card { padding: 18px; border-radius: 16px; }
        .fm-cta {
            flex-direction: column;
            align-items: flex-start;
            padding: 18px 16px;
            border-radius: 16px;
        }
        .fm-cta-actions { width: 100%; }
        .fm-btn { width: 100%; justify-content: center; }
    }

    /* ================================================================
    FOUNDERS MESSAGE PAGE — Premium Two-Founder Layout
    ================================================================ */

    /* ----- Section wrapper ----- */
    .fnd-section {
        position: relative;
        background: linear-gradient(160deg, #f4f6ff 0%, #ffffff 50%, #fdfaf0 100%);
        padding: 60px 0 70px;
        overflow: hidden;
    }

    /* Subtle decorative background dots */
    .fnd-bg-decor {
        position: absolute;
        inset: 0;
        background-image:
            radial-gradient(circle, rgba(13,27,94,0.055) 1px, transparent 1px);
        background-size: 32px 32px;
        pointer-events: none;
        z-index: 0;
    }

    .fnd-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
        position: relative;
        z-index: 1;
    }

    /* ----- Section header ----- */
    .fnd-header {
        text-align: center;
        max-width: 760px;
        margin: 0 auto 40px;
    }

    .fnd-tag {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(245,184,0,0.12);
        color: #c48a00;
        font-size: 12px;
        font-weight: 800;
        letter-spacing: 1.2px;
        text-transform: uppercase;
        padding: 6px 18px;
        border-radius: 30px;
        border: 1px solid rgba(245,184,0,0.3);
        margin-bottom: 18px;
    }

    .fnd-tag i { font-size: 10px; color: #f5b800; }

    .fnd-title {
        font-size: clamp(28px, 3.8vw, 46px);
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1.18;
        margin: 0 0 14px;
        letter-spacing: -0.5px;
    }

    .fnd-accent { color: #f5b800; }

    .fnd-subtitle {
        font-size: 16px;
        color: #5a6782;
        line-height: 1.7;
        margin: 0 0 28px;
    }

    .fnd-header-line {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 14px;
    }

    .fnd-header-line span {
        display: block;
        width: 60px;
        height: 2px;
        background: linear-gradient(90deg, transparent, #f5b800);
        border-radius: 2px;
    }

    .fnd-header-line span:last-child {
        background: linear-gradient(90deg, #f5b800, transparent);
    }

    .fnd-header-line i {
        color: #f5b800;
        font-size: 20px;
    }

    /* ----- Founders Grid ----- */
    .fnd-grid {
        display: grid;
        grid-template-columns: 1fr auto 1fr;
        gap: 0 24px;
        align-items: start;
        margin-bottom: 40px;
    }

    /* ----- Center divider ----- */
    .fnd-center-divider {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 12px;
        padding-top: 60px;
    }

    .fnd-center-divider span {
        display: block;
        width: 2px;
        height: 50px;
        background: linear-gradient(180deg, transparent, #dde1f5 50%, transparent);
        border-radius: 2px;
    }

    .fnd-center-icon {
        width: 48px;
        height: 48px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 6px 20px rgba(245,184,0,0.35);
        flex-shrink: 0;
    }

    .fnd-center-icon i {
        color: #0b1027;
        font-size: 18px;
    }

    /* ----- Individual Card ----- */
    .fnd-card {
        background: #ffffff;
        border-radius: 24px;
        overflow: hidden;
        box-shadow: 0 8px 40px rgba(13, 27, 94, 0.10);
        border: 1px solid rgba(13, 27, 94, 0.07);
        transition: transform 0.35s cubic-bezier(.25,.8,.25,1), box-shadow 0.35s ease;
        display: flex;
        flex-direction: column;
        position: relative;
    }

    /* Gold top accent strip */
    .fnd-card::before {
        content: '';
        position: absolute;
        top: 0; left: 0; right: 0;
        height: 4px;
        background: linear-gradient(90deg, #f5b800, #e07b00, #f5b800);
        background-size: 200% 100%;
        z-index: 3;
        border-radius: 24px 24px 0 0;
        transition: background-position 0.5s ease;
    }

    .fnd-card--alt::before {
        background: linear-gradient(90deg, #1a2a6c, #0d1b5e, #1a2a6c);
        background-size: 200% 100%;
    }

    .fnd-card:hover {
        transform: translateY(-10px);
        box-shadow: 0 28px 64px rgba(13, 27, 94, 0.18);
    }

    .fnd-card:hover::before {
        background-position: 100% 0;
    }

    /* ----- Photo area ----- */
    .fnd-photo-wrap {
        position: relative;
        width: 100%;
        aspect-ratio: 3 / 2;
        overflow: hidden;
    }

    .fnd-photo {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: top center;
        display: block;
        transition: transform 0.5s cubic-bezier(.25,.8,.25,1);
    }

    .fnd-card:hover .fnd-photo {
        transform: scale(1.06);
    }

    /* Dark gradient over photo for text readability */
    .fnd-photo-overlay {
        position: absolute;
        inset: 0;
        background: linear-gradient(
            180deg,
            transparent 35%,
            rgba(10,18,60,0.55) 65%,
            rgba(10,18,60,0.92) 100%
        );
        pointer-events: none;
    }

    /* Name/role overlay on photo */
    .fnd-photo-info {
        position: absolute;
        bottom: 0; left: 0; right: 0;
        padding: 14px 18px 16px;
        z-index: 2;
    }

    .fnd-badge {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-size: 9px;
        font-weight: 800;
        padding: 3px 10px;
        border-radius: 20px;
        letter-spacing: 1.2px;
        text-transform: uppercase;
        margin-bottom: 7px;
    }

    .fnd-badge i { font-size: 9px; }

    .fnd-badge--alt {
        background: rgba(255,255,255,0.15);
        color: #f5b800;
        border: 1px solid rgba(245,184,0,0.5);
        backdrop-filter: blur(4px);
    }

    .fnd-photo-name {
        margin: 0 0 2px;
        font-size: 18px;
        font-weight: 900;
        color: #ffffff;
        line-height: 1.2;
        text-shadow: 0 2px 12px rgba(0,0,0,0.4);
    }

    .fnd-photo-role {
        margin: 0;
        font-size: 13px;
        color: rgba(255,255,255,0.72);
        font-weight: 600;
        letter-spacing: 0.3px;
    }

    /* Corner accent ribbon */
    .fnd-card-accent {
        position: absolute;
        top: 18px;
        right: -22px;
        width: 80px;
        height: 80px;
        background: rgba(245,184,0,0.12);
        border-radius: 50%;
        pointer-events: none;
        z-index: 1;
    }

    .fnd-card-accent--alt {
        background: rgba(13,27,94,0.10);
    }

    /* ----- Body content ----- */
    .fnd-body {
        padding: 20px 22px 22px;
        display: flex;
        flex-direction: column;
        flex: 1;
        position: relative;
    }

    /* Giant decorative quote mark behind content */
    .fnd-body-deco {
        position: absolute;
        top: 4px;
        right: 12px;
        font-size: 90px;
        line-height: 1;
        font-family: Georgia, 'Times New Roman', serif;
        color: rgba(245,184,0,0.07);
        font-weight: 900;
        pointer-events: none;
        user-select: none;
        z-index: 0;
    }

    .fnd-quote {
        margin: 0 0 14px;
        padding: 0;
        border: none;
        position: relative;
        z-index: 1;
    }

    .fnd-quote-text {
        margin: 0;
        font-size: 14px;
        color: #334155;
        line-height: 1.75;
        font-style: italic;
        font-weight: 500;
    }

    /* Gold divider with icon */
    .fnd-divider {
        display: flex;
        align-items: center;
        gap: 12px;
        margin: 0 0 14px;
        position: relative;
        z-index: 1;
    }

    .fnd-divider span {
        flex: 1;
        height: 1px;
        background: linear-gradient(90deg, #f5b800, rgba(245,184,0,0.15));
        border-radius: 1px;
    }

    .fnd-divider span:last-child {
        background: linear-gradient(90deg, rgba(245,184,0,0.15), #f5b800);
    }

    .fnd-divider i {
        color: #f5b800;
        font-size: 14px;
        opacity: 0.7;
    }

    /* Highlight list */
    .fnd-highlights {
        list-style: none;
        padding: 0;
        margin: 0 0 16px;
        display: flex;
        flex-direction: column;
        gap: 7px;
        position: relative;
        z-index: 1;
    }

    .fnd-highlights li {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 13px;
        color: #1e293b;
        font-weight: 600;
        background: linear-gradient(90deg, #f8f9ff 0%, #fefefe 100%);
        border-left: 3px solid #f5b800;
        border-radius: 0 10px 10px 0;
        padding: 8px 12px;
        transition: background 0.2s ease, transform 0.2s ease;
    }

    .fnd-highlights li:hover {
        background: linear-gradient(90deg, #eef1ff 0%, #f8f9ff 100%);
        transform: translateX(4px);
    }

    .fnd-hl-icon {
        width: 22px;
        height: 22px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }

    .fnd-hl-icon i {
        color: #0b1027;
        font-size: 9px;
    }

    /* Signature */
    .fnd-sig {
        display: flex;
        align-items: center;
        gap: 12px;
        margin-top: auto;
        padding-top: 14px;
        border-top: 1px solid #eef0f8;
        position: relative;
        z-index: 1;
    }

    .fnd-sig-monogram {
        width: 42px;
        height: 42px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
        font-weight: 900;
        color: #0b1027;
        flex-shrink: 0;
        box-shadow: 0 4px 14px rgba(245,184,0,0.32);
        font-family: Georgia, serif;
    }

    .fnd-sig-monogram--alt {
        background: linear-gradient(135deg, #1a2a6c 0%, #0d1b5e 100%);
        color: #f5b800;
        box-shadow: 0 4px 16px rgba(13,27,94,0.3);
    }

    .fnd-sig-greeting {
        margin: 0 0 2px;
        font-size: 11px;
        color: #9ca3af;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.6px;
    }

    .fnd-sig-name {
        margin: 0 0 2px;
        font-size: 16px;
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1.2;
    }

    .fnd-sig-role {
        margin: 0;
        font-size: 12px;
        color: #9ca3af;
        font-weight: 600;
    }

    /* ----- CTA bar ----- */
    .fnd-cta {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 60%, #102260 100%);
        border-radius: 20px;
        padding: 36px 40px;
        box-shadow: 0 16px 48px rgba(13,27,94,0.22);
        position: relative;
        overflow: hidden;
    }

    .fnd-cta::before {
        content: '';
        position: absolute;
        top: -40px; right: -40px;
        width: 200px;
        height: 200px;
        background: rgba(245,184,0,0.07);
        border-radius: 50%;
        pointer-events: none;
    }

    .fnd-cta::after {
        content: '';
        position: absolute;
        bottom: -60px; left: -30px;
        width: 160px;
        height: 160px;
        background: rgba(245,184,0,0.05);
        border-radius: 50%;
        pointer-events: none;
    }

    .fnd-cta-inner {
        display: flex;
        align-items: center;
        gap: 28px;
        position: relative;
        z-index: 1;
    }

    .fnd-cta-icon {
        width: 64px;
        height: 64px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        border-radius: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        box-shadow: 0 8px 24px rgba(245,184,0,0.35);
    }

    .fnd-cta-icon i {
        font-size: 26px;
        color: #0b1027;
    }

    .fnd-cta-text { flex: 1; min-width: 0; }

    .fnd-cta-title {
        margin: 0 0 6px;
        font-size: 20px;
        font-weight: 900;
        color: #ffffff;
        line-height: 1.25;
    }

    .fnd-cta-sub {
        margin: 0;
        font-size: 14px;
        color: rgba(255,255,255,0.72);
        line-height: 1.6;
    }

    .fnd-cta-actions {
        display: flex;
        align-items: center;
        gap: 12px;
        flex-shrink: 0;
    }

    .fnd-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 14px;
        font-weight: 800;
        padding: 13px 24px;
        border-radius: 10px;
        border: 2px solid transparent;
        text-decoration: none;
        white-space: nowrap;
        transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
        letter-spacing: 0.3px;
    }

    .fnd-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        border-color: transparent;
    }

    .fnd-btn--primary:hover {
        transform: translateY(-3px);
        box-shadow: 0 16px 40px rgba(245,184,0,0.38);
        color: #0b1027;
    }

    .fnd-btn--outline {
        background: rgba(255,255,255,0.07);
        color: #ffffff;
        border-color: rgba(255,255,255,0.25);
    }

    .fnd-btn--outline:hover {
        transform: translateY(-3px);
        background: rgba(255,255,255,0.14);
        color: #ffffff;
    }

    /* ----- Responsive ----- */
    @media (max-width: 1024px) {
        .fnd-grid {
            grid-template-columns: 1fr 1fr;
            grid-template-rows: auto auto;
            gap: 20px;
        }

        .fnd-center-divider { display: none; }

        .fnd-cta-inner { flex-wrap: wrap; gap: 16px; }

        .fnd-cta-actions { width: 100%; }

        .fnd-btn { flex: 1; justify-content: center; }
    }

    @media (max-width: 767px) {
        .fnd-section { padding: 44px 0 52px; }

        .fnd-container { padding: 0 16px; }

        .fnd-header { margin-bottom: 28px; }

        .fnd-grid {
            grid-template-columns: 1fr;
            gap: 20px;
            margin-bottom: 28px;
        }

        .fnd-center-divider { display: none; }

        .fnd-photo-wrap { aspect-ratio: 16 / 9; }

        .fnd-body { padding: 16px 15px 18px; }

        .fnd-cta { padding: 22px 16px; border-radius: 14px; }

        .fnd-cta-icon { display: none; }

        .fnd-cta-title { font-size: 16px; }
    }

    @media (max-width: 480px) {
        .fnd-photo-name { font-size: 15px; }

        .fnd-photo-role { font-size: 11px; }

        .fnd-quote-text { font-size: 13px; }

        .fnd-highlights li { font-size: 12px; padding: 7px 10px; }

        .fnd-sig-monogram { width: 36px; height: 36px; font-size: 15px; }

        .fnd-btn { padding: 10px 14px; font-size: 13px; }
    }

    @media (prefers-reduced-motion: reduce) {
        .fnd-card,
        .fnd-photo,
        .fnd-highlights li,
        .fnd-btn { transition: none !important; transform: none !important; }
    }

    /* ================================================================
    OVERVIEW PAGE — Principal Message Teaser (Responsive)
    ================================================================ */
    .ov-principal-section {
        background: linear-gradient(180deg, #ffffff 0%, #f6f8ff 100%);
        padding: 28px 0;
    }

    .ov-principal-card {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 22px 22px;
        border-radius: 16px;
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        box-shadow: 0 14px 40px rgba(13, 27, 94, 0.10);
    }

    .ov-principal-icon {
        width: 54px;
        height: 54px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        background: linear-gradient(135deg, rgba(245,184,0,0.30), rgba(245,184,0,0.12));
        border: 1px solid rgba(245, 184, 0, 0.35);
        flex-shrink: 0;
    }

    .ov-principal-icon i { font-size: 20px; }

    .ov-principal-content { flex: 1; min-width: 0; }

    .ov-principal-title {
        font-size: 18px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 6px;
    }

    .ov-principal-text {
        font-size: 14px;
        color: #5a6782;
        margin: 0;
        line-height: 1.7;
        max-width: 680px;
    }

    .ov-principal-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 800;
        font-size: 14px;
        padding: 12px 16px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,0.06);
        box-shadow: 0 10px 24px rgba(245, 184, 0, 0.24);
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
        white-space: nowrap;
    }

    .ov-principal-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.30);
        filter: brightness(1.02);
    }

    .ov-principal-btn i { font-size: 13px; transition: transform 0.2s; }
    .ov-principal-btn:hover i { transform: translateX(3px); }

    @media (max-width: 767px) {
        .ov-principal-section { padding: 22px 0; }
        .ov-principal-card {
            flex-direction: column;
            align-items: flex-start;
            padding: 18px 16px;
            border-radius: 14px;
        }
        .ov-principal-btn { width: 100%; justify-content: center; }
    }

    /* ================================================================
    OVERVIEW PAGE — Academic Head Message Teaser
    ================================================================ */
    .ov-academic-section {
        background: linear-gradient(180deg, #ffffff 0%, #f6f8ff 100%);
        padding: 28px 0;
    }

    .ov-academic-card {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 22px 22px;
        border-radius: 16px;
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        box-shadow: 0 14px 40px rgba(13, 27, 94, 0.10);
    }

    .ov-academic-icon {
        width: 54px;
        height: 54px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        background: linear-gradient(135deg, rgba(13,27,94,0.22), rgba(245,184,0,0.10));
        border: 1px solid rgba(13, 27, 94, 0.16);
        flex-shrink: 0;
    }

    .ov-academic-icon i { font-size: 20px; color: #f5b800; }

    .ov-academic-content { flex: 1; min-width: 0; }

    .ov-academic-title {
        font-size: 18px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 6px;
    }

    .ov-academic-text {
        font-size: 14px;
        color: #5a6782;
        margin: 0;
        line-height: 1.7;
        max-width: 680px;
    }

    .ov-academic-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 800;
        font-size: 14px;
        padding: 12px 16px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,0.06);
        box-shadow: 0 10px 24px rgba(245, 184, 0, 0.24);
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
        white-space: nowrap;
    }

    .ov-academic-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.30);
        filter: brightness(1.02);
    }

    .ov-academic-btn i { font-size: 13px; transition: transform 0.2s; }
    .ov-academic-btn:hover i { transform: translateX(3px); }

    @media (max-width: 767px) {
        .ov-academic-section { padding: 22px 0; }
        .ov-academic-card {
            flex-direction: column;
            align-items: flex-start;
            padding: 18px 16px;
            border-radius: 14px;
        }
        .ov-academic-btn { width: 100%; justify-content: center; }
    }

    /* ================================================================
    OVERVIEW PAGE — Establishment Teaser
    ================================================================ */
    .ov-establish-section {
        background: linear-gradient(180deg, #ffffff 0%, #f6f8ff 100%);
        padding: 28px 0;
    }

    .ov-establish-card {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 22px 22px;
        border-radius: 16px;
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        box-shadow: 0 14px 40px rgba(13, 27, 94, 0.10);
    }

    .ov-establish-icon {
        width: 54px;
        height: 54px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        background: linear-gradient(135deg, rgba(13,27,94,0.22), rgba(245,184,0,0.10));
        border: 1px solid rgba(13, 27, 94, 0.16);
        flex-shrink: 0;
    }

    .ov-establish-icon i { font-size: 20px; color: #f5b800; }

    .ov-establish-content { flex: 1; min-width: 0; }

    .ov-establish-title {
        font-size: 18px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 6px;
    }

    .ov-establish-text {
        font-size: 14px;
        color: #5a6782;
        margin: 0;
        line-height: 1.7;
        max-width: 680px;
    }

    .ov-establish-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 800;
        font-size: 14px;
        padding: 12px 16px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,0.06);
        box-shadow: 0 10px 24px rgba(245, 184, 0, 0.24);
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
        white-space: nowrap;
    }

    .ov-establish-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.30);
        filter: brightness(1.02);
    }

    .ov-establish-btn i { font-size: 13px; transition: transform 0.2s; }
    .ov-establish-btn:hover i { transform: translateX(3px); }

    @media (max-width: 767px) {
        .ov-establish-section { padding: 22px 0; }
        .ov-establish-card {
            flex-direction: column;
            align-items: flex-start;
            padding: 18px 16px;
            border-radius: 14px;
        }
        .ov-establish-btn { width: 100%; justify-content: center; }
    }

    /* ================================================================
    ESTABLISHMENT PAGE
    ================================================================ */
    .es-hero-logos {
        position: relative;
        z-index: 1;
        width: 100%;
        padding: 0 32px;
    }

    .es-hero-logos__bar {
        max-width: 800px;
        margin: 0 auto;
        background: rgba(255, 255, 255, 0.97);
        border-radius: 18px 18px 0 0;
        box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.18);
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0 32px;
        padding: 16px 36px;
    }

    .es-hero-logos__heading {
        display: flex;
        align-items: center;
        gap: 7px;
        margin: 0;
        white-space: nowrap;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.7px;
        text-transform: uppercase;
        color: #0d1b5e;
        padding-right: 32px;
        border-right: 2px solid rgba(13, 27, 94, 0.14);
    }

    .es-hero-logos__heading i {
        color: #f5b800;
        font-size: 14px;
    }

    .es-hero-logos__list {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: 0;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .es-hero-logos__divider {
        width: 1px;
        height: 44px;
        background: rgba(13, 27, 94, 0.12);
        flex-shrink: 0;
        margin: 0 28px;
    }

    .es-hero-logos__item {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 6px;
    }

    .es-hero-logos__item img {
        display: block;
        height: 48px;
        width: auto;
        max-width: 140px;
        object-fit: contain;
        filter: grayscale(15%);
        transition: filter 0.25s, transform 0.25s;
    }

    .es-hero-logos__item:hover img {
        filter: grayscale(0%);
        transform: scale(1.06);
    }

    .es-hero-logos__label {
        font-size: 10.5px;
        font-weight: 700;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        color: #0d1b5e;
        opacity: 0.70;
    }

    .es-grid {
        display: grid;
        gap: 18px;
    }

    .es-grid--2 {
        grid-template-columns: 1fr 1fr;
    }

    .es-card {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.10);
        padding: 22px 22px;
    }

    .es-card-title {
        color: #0d1b5e;
        font-weight: 900;
        font-size: 18px;
        margin: 0 0 10px;
    }

    .es-card-text {
        color: #475569;
        font-size: 14px;
        line-height: 1.8;
        margin: 0 0 14px;
    }

    .es-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: grid;
        gap: 10px;
    }

    .es-list li {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 14px;
        font-weight: 650;
        color: #475569;
    }

    .es-list li i { color: #f5b800; font-size: 12px; }

    .es-chips {
        margin-top: 18px;
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        gap: 12px;
    }

    .es-chip {
        background: rgba(13,27,94,0.06);
        border: 1px solid rgba(13,27,94,0.12);
        border-radius: 16px;
        padding: 14px 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        color: #0d1b5e;
        font-weight: 900;
    }

    .es-chip i {
        color: #f5b800;
        font-size: 14px;
    }

    .es-cta {
        margin-top: 22px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 22px 22px;
        border-radius: 18px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border: 1px solid rgba(245,184,0,0.22);
    }

    .es-cta-title {
        margin: 0 0 8px;
        color: #ffffff;
        font-weight: 900;
        font-size: 18px;
    }

    .es-cta-sub {
        margin: 0;
        color: rgba(255,255,255,0.78);
        line-height: 1.7;
        font-size: 14px;
        max-width: 520px;
    }

    .es-cta-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }

    @media (max-width: 991px) {
        .es-grid--2 { grid-template-columns: 1fr; }
        .es-chips { grid-template-columns: repeat(3, 1fr); }
        .es-cta { flex-direction: column; align-items: flex-start; }
        .es-cta-actions { width: 100%; }
    }

    @media (max-width: 767px) {
        .es-chips { grid-template-columns: repeat(2, 1fr); }
        .es-card { padding: 18px 16px; border-radius: 16px; }
        .es-cta {
            padding: 18px 16px;
            border-radius: 16px;
        }
        .es-cta-actions { flex-direction: column; align-items: stretch; }
        .es-cta-actions .fm-btn { width: 100%; justify-content: center; }
        .es-hero-logos { padding: 0 16px; }
        .es-hero-logos__bar {
            flex-direction: column;
            align-items: center;
            gap: 14px;
            padding: 16px 20px;
            border-radius: 14px 14px 0 0;
        }
        .es-hero-logos__heading {
            padding-right: 0;
            border-right: none;
            padding-bottom: 10px;
            border-bottom: 2px solid rgba(13, 27, 94, 0.14);
            width: 100%;
            justify-content: center;
        }
        .es-hero-logos__list { justify-content: center; }
        .es-hero-logos__divider {
            height: 36px;
            margin: 0 18px;
        }
        .es-hero-logos__item img {
            height: 38px;
            max-width: 110px;
        }
    }

    /* ================================================================
    OVERVIEW PAGE — Committee Rule Teaser
    ================================================================ */
    .ov-committee-section {
        background: linear-gradient(180deg, #ffffff 0%, #f6f8ff 100%);
        padding: 28px 0;
    }

    .ov-committee-card {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 22px 22px;
        border-radius: 16px;
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        box-shadow: 0 14px 40px rgba(13, 27, 94, 0.10);
    }

    .ov-committee-icon {
        width: 54px;
        height: 54px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        background: linear-gradient(135deg, rgba(13,27,94,0.22), rgba(245,184,0,0.10));
        border: 1px solid rgba(13, 27, 94, 0.16);
        flex-shrink: 0;
    }

    .ov-committee-icon i { font-size: 20px; color: #f5b800; }

    .ov-committee-content { flex: 1; min-width: 0; }

    .ov-committee-title {
        font-size: 18px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 6px;
    }

    .ov-committee-text {
        font-size: 14px;
        color: #5a6782;
        margin: 0;
        line-height: 1.7;
        max-width: 680px;
    }

    .ov-committee-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 800;
        font-size: 14px;
        padding: 12px 16px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,0.06);
        box-shadow: 0 10px 24px rgba(245, 184, 0, 0.24);
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
        white-space: nowrap;
    }

    .ov-committee-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.30);
        filter: brightness(1.02);
    }

    .ov-committee-btn i { font-size: 13px; transition: transform 0.2s; }
    .ov-committee-btn:hover i { transform: translateX(3px); }

    @media (max-width: 767px) {
        .ov-committee-section { padding: 22px 0; }
        .ov-committee-card {
            flex-direction: column;
            align-items: flex-start;
            padding: 18px 16px;
            border-radius: 14px;
        }
        .ov-committee-btn { width: 100%; justify-content: center; }
    }

    /* ================================================================
    COMMITTEE RULES PAGE
    ================================================================ */
    /* ================================================================
    COMMITTEE RULES — REDESIGNED MODERN ANIMATED
    ================================================================ */
    @keyframes cr-glow-pulse {
        0%, 100% { opacity: 0.18; transform: scale(1); }
        50%       { opacity: 0.35; transform: scale(1.1); }
    }
    @keyframes cr-card-up {
        from { opacity: 0; transform: translateY(30px); }
        to   { opacity: 1; transform: translateY(0); }
    }
    @keyframes cr-mini-up {
        from { opacity: 0; transform: translateY(20px); }
        to   { opacity: 1; transform: translateY(0); }
    }
    .cr-section {
        position: relative;
        overflow: hidden;
        padding: 72px 0 80px;
        background-color: #f4f6ff;
        background-image:
            linear-gradient(rgba(13,27,94,0.055) 1px, transparent 1px),
            linear-gradient(90deg, rgba(13,27,94,0.055) 1px, transparent 1px);
        background-size: 38px 38px;
    }
    .cr-section-bg {
        position: absolute;
        inset: 0;
        pointer-events: none;
        background:
            radial-gradient(ellipse 60% 50% at 5% 15%,  rgba(13,27,94,0.06)  0%, transparent 55%),
            radial-gradient(ellipse 55% 50% at 95% 85%, rgba(245,184,0,0.07) 0%, transparent 55%);
    }
    .cr-section-bg::before {
        content: "";
        position: absolute;
        width: 300px; height: 300px;
        top: -80px; left: -60px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(26,42,108,0.08) 0%, transparent 70%);
        filter: blur(50px);
        animation: cr-glow-pulse 8s ease-in-out infinite;
    }
    .cr-section-bg::after {
        content: "";
        position: absolute;
        width: 260px; height: 260px;
        bottom: -60px; right: -40px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(245,184,0,0.1) 0%, transparent 70%);
        filter: blur(44px);
        animation: cr-glow-pulse 10s ease-in-out infinite reverse;
    }
    .cr-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
        position: relative;
        z-index: 2;
    }
    .cr-header {
        text-align: center;
        max-width: 820px;
        margin: 0 auto 44px;
        animation: cr-card-up 0.7s ease both;
    }
    .cr-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.16);
        color: #0d1b5e;
        font-size: 11.5px;
        font-weight: 900;
        padding: 5px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }
    .cr-tag i { font-size: 11px; color: #f5b800; }
    .cr-title {
        font-size: clamp(24px, 3vw, 38px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.22;
        letter-spacing: -0.4px;
    }
    .cr-accent {
        background: linear-gradient(90deg, #1a2a6c, #3949ab, #0d1b5e);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }
    .cr-subtitle {
        font-size: 14.5px;
        color: #5a6782;
        line-height: 1.8;
        margin: 0;
    }
    .cr-grid { display: grid; gap: 22px; }
    .cr-grid--2 { grid-template-columns: 1fr 1fr; }
    .cr-grid--3 { grid-template-columns: repeat(3, 1fr); margin-top: 22px; }
    .cr-card {
        position: relative;
        overflow: hidden;
        border-radius: 20px;
        padding: 0 0 24px;
        background: linear-gradient(155deg, #1a2a6c 0%, #0d1b5e 55%, #101e6e 100%);
        border: 1px solid rgba(245,184,0,0.18);
        box-shadow: 0 18px 50px rgba(13,27,94,0.45);
        animation: cr-card-up 0.65s cubic-bezier(0.22,1,0.36,1) both;
        transition: transform 0.28s cubic-bezier(0.22,1,0.36,1), box-shadow 0.28s ease;
    }
    .cr-card:first-child { animation-delay: 0.05s; }
    .cr-card:last-child  { animation-delay: 0.15s; }
    .cr-card:hover {
        transform: translateY(-6px) scale(1.008);
        box-shadow: 0 26px 65px rgba(13,27,94,0.55), 0 0 28px rgba(245,184,0,0.1);
    }
    .cr-card-glow {
        position: absolute;
        top: -40px; right: -30px;
        width: 180px; height: 180px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(57,73,171,0.45) 0%, transparent 70%);
        filter: blur(32px);
        pointer-events: none;
        animation: cr-glow-pulse 7s ease-in-out infinite;
    }
    .cr-card-glow--gold {
        background: radial-gradient(circle, rgba(245,184,0,0.25) 0%, transparent 70%);
        animation-direction: reverse;
    }
    .cr-card-top-bar {
        height: 4px;
        width: 100%;
        background: linear-gradient(90deg, #1a2a6c, #3949ab, #f5b800, #3949ab);
    }
    .cr-card-top-bar--gold {
        background: linear-gradient(90deg, #f5b800, #ffd740, #e07b00, #f5b800);
    }
    .cr-card-icon-wrap {
        width: 48px; height: 48px;
        border-radius: 14px;
        background: rgba(255,255,255,0.08);
        border: 1px solid rgba(57,73,171,0.5);
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 20px 22px 14px;
        color: #7c90d4;
        font-size: 20px;
    }
    .cr-card-icon-wrap--gold { border-color: rgba(245,184,0,0.4); color: #f5b800; }
    .cr-card-title {
        color: #fff;
        font-weight: 900;
        font-size: 17px;
        margin: 0 0 10px;
        padding: 0 22px;
        position: relative;
        z-index: 1;
    }
    .cr-card-text {
        color: rgba(255,255,255,0.68);
        font-size: 13.5px;
        line-height: 1.75;
        margin: 0 0 16px;
        padding: 0 22px;
        position: relative;
        z-index: 1;
    }
    .cr-list {
        list-style: none;
        padding: 0 22px;
        margin: 0;
        display: grid;
        gap: 9px;
        position: relative;
        z-index: 1;
    }
    .cr-list li {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 13.5px;
        font-weight: 600;
        color: rgba(255,255,255,0.8);
    }
    .cr-list li i { color: #f5b800; font-size: 12px; flex-shrink: 0; }
    /* ── Mini Policy Cards — Redesigned ── */
    .cr-mini-card {
        position: relative;
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 18px;
        padding: 22px 22px 20px;
        overflow: hidden;
        box-shadow: 0 4px 20px rgba(13,27,94,0.07);
        transition: transform 0.26s cubic-bezier(0.22,1,0.36,1),
                    box-shadow 0.26s ease,
                    border-color 0.26s ease;
        animation: cr-mini-up 0.6s cubic-bezier(0.22,1,0.36,1) both;
    }
    .cr-mini-card:nth-child(1) { animation-delay: 0.1s; }
    .cr-mini-card:nth-child(2) { animation-delay: 0.2s; }
    .cr-mini-card:nth-child(3) { animation-delay: 0.3s; }
    .cr-mini-card:hover {
        transform: translateY(-7px);
        box-shadow: 0 18px 44px rgba(13,27,94,0.13);
        border-color: rgba(245,184,0,0.45);
    }

    /* Large decorative background number */
    .cr-mini-num {
        position: absolute;
        top: -8px;
        right: 14px;
        font-size: 72px;
        font-weight: 900;
        line-height: 1;
        color: rgba(13,27,94,0.05);
        pointer-events: none;
        user-select: none;
        font-family: 'Arial Black', sans-serif;
        letter-spacing: -3px;
    }

    /* Head row: icon + badge */
    .cr-mini-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 16px;
    }

    /* Icon box */
    .cr-mini-icon {
        width: 52px;
        height: 52px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        flex-shrink: 0;
        transition: transform 0.26s ease;
    }
    .cr-mini-card:hover .cr-mini-icon { transform: scale(1.08) rotate(-4deg); }

    .cr-mini-icon--1 {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 100%);
        color: #f5b800;
        box-shadow: 0 6px 18px rgba(13,27,94,0.28);
    }
    .cr-mini-icon--2 {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        box-shadow: 0 6px 18px rgba(245,184,0,0.32);
    }
    .cr-mini-icon--3 {
        background: linear-gradient(135deg, #1a2a6c 0%, #3949ab 100%);
        color: #f5b800;
        box-shadow: 0 6px 18px rgba(26,42,108,0.28);
    }

    /* Small pill badge */
    .cr-mini-badge {
        display: inline-flex;
        align-items: center;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        color: #1a2a6c;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.12);
        padding: 3px 9px;
        border-radius: 50px;
    }

    /* Text */
    .cr-mini-title {
        font-size: 16px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 8px;
        line-height: 1.3;
    }
    .cr-mini-text {
        font-size: 13px;
        color: #5a6782;
        line-height: 1.7;
        margin: 0 0 18px;
    }

    /* Bottom gradient accent bar */
    .cr-mini-bar {
        height: 3px;
        border-radius: 3px;
        width: 100%;
    }
    .cr-mini-bar--1 { background: linear-gradient(90deg, #0d1b5e, #3949ab, rgba(13,27,94,0.1)); }
    .cr-mini-bar--2 { background: linear-gradient(90deg, #f5b800, #ffd740, rgba(245,184,0,0.1)); }
    .cr-mini-bar--3 { background: linear-gradient(90deg, #1a2a6c, #283593, rgba(26,42,108,0.1)); }

    /* ── Committee rules: PDF download cards ── */
    .cr-dl-section {
        margin-top: 40px;
        padding-top: 36px;
        border-top: 1px solid rgba(13, 27, 94, 0.1);
    }
    .cr-dl-header {
        text-align: center;
        max-width: 720px;
        margin: 0 auto 28px;
    }
    .cr-dl-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(57, 73, 171, 0.1);
        border: 1px solid rgba(57, 73, 171, 0.2);
        color: #1a2a6c;
        font-size: 11px;
        font-weight: 900;
        padding: 5px 16px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.75px;
        margin-bottom: 12px;
    }
    .cr-dl-tag i { font-size: 12px; color: #c62828; }
    .cr-dl-title {
        font-size: clamp(22px, 2.6vw, 32px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 10px;
        line-height: 1.2;
        letter-spacing: -0.35px;
    }
    .cr-dl-title-pdf {
        font-weight: 800;
        color: #3949ab;
    }
    .cr-dl-subtitle {
        font-size: 14px;
        color: #5a6782;
        margin: 0;
        line-height: 1.65;
    }
    .cr-dl-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
    }

    .es-dl-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
        gap: 24px;
        /* max-width: 1200px; */
        margin: 0 auto;
    }

    .es-dl-grid--3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .es-dl-card .cr-dl-card-body {
        gap: 12px;
    }

    .es-dl-card .cr-dl-card-desc {
        margin-bottom: 0;
        flex: 0 0 auto;
    }

    .es-fee-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 8px;
        width: 100%;
    }

    .es-fee-list__item {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 10px 12px;
        background: rgba(13, 27, 94, 0.04);
        border: 1px solid rgba(13, 27, 94, 0.1);
        border-radius: 10px;
    }

    .es-fee-list__info {
        display: flex;
        flex-direction: column;
        gap: 3px;
        min-width: 0;
        flex: 1 1 auto;
    }

    .es-fee-list__name {
        display: block;
        font-size: 14px;
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.35;
    }

    .es-fee-list__session {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        font-size: 11px;
        font-weight: 600;
        color: #5a6782;
    }

    .es-fee-list__session i {
        color: #f5b800;
        font-size: 10px;
    }

    .es-fee-list__btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        flex: 0 0 auto;
        width: auto;
        margin: 0;
        padding: 8px 12px;
        border-radius: 8px;
        font-size: 12px;
        font-weight: 800;
        text-decoration: none;
        border: none;
        cursor: pointer;
        white-space: nowrap;
        transition: transform 0.2s ease, filter 0.2s ease;
    }

    .es-fee-list__btn--blue {
        background: linear-gradient(135deg, #1a2a6c 0%, #0d1b5e 100%);
        color: #fff;
        box-shadow: 0 4px 12px rgba(13, 27, 94, 0.22);
    }

    .es-fee-list__btn--amber {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        box-shadow: 0 4px 12px rgba(224, 123, 0, 0.22);
    }

    .es-fee-list__btn--green {
        background: linear-gradient(135deg, #15803d 0%, #0d4f3c 100%);
        color: #fff;
        box-shadow: 0 4px 12px rgba(21, 128, 61, 0.22);
    }

    .es-fee-list__btn--purple {
        background: linear-gradient(135deg, #6d28d9 0%, #4c1d95 100%);
        color: #fff;
        box-shadow: 0 4px 12px rgba(76, 29, 149, 0.22);
    }

    .es-fee-list__btn:hover:not(.es-fee-list__btn--disabled) {
        transform: translateY(-1px);
        filter: brightness(1.05);
    }

    .es-fee-list__btn--disabled {
        background: #e8ecf5;
        color: #7a8699;
        cursor: not-allowed;
        box-shadow: none;
    }

    .es-fee-list__btn i {
        font-size: 12px;
    }

    @media (max-width: 420px) {
        .es-fee-list__item {
            flex-direction: column;
            align-items: stretch;
        }
        .es-fee-list__btn {
            width: 100%;
        }
    }

    .es-dl-card-head {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 12px;
        margin-bottom: 12px;
    }

    .es-dl-card-head .cr-dl-card-title {
        margin: 0;
        flex: 1 1 auto;
        min-width: 0;
    }

    .es-dl-card-head .cr-dl-icon {
        margin-bottom: 0;
        flex-shrink: 0;
        width: 48px;
        height: 48px;
    }

    .es-dl-card-logo {
        width: 48px;
        height: 48px;
        border-radius: 12px;
        background: rgba(13, 27, 94, 0.06);
        border: 1px solid rgba(13, 27, 94, 0.1);
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 0;
        flex-shrink: 0;
        overflow: hidden;
    }

    .es-dl-card-logo img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: 6px;
    }

    .es-dl-card-session {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        margin: 0 0 10px;
        font-size: 12px;
        font-weight: 700;
        color: #3949ab;
    }

    .es-dl-card-session i {
        color: #f5b800;
        font-size: 12px;
    }

    .es-dl-doc-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    .es-dl-doc-item {
        list-style: none;
    }

    .es-dl-doc-btn {
        margin-top: 0;
        width: 100%;
    }

    @media (max-width: 991px) {
        .es-dl-grid--3 {
            grid-template-columns: 1fr;
        }
    }

    @media (max-width: 767px) {
        .es-dl-grid {
            grid-template-columns: 1fr;
        }
    }

    .cr-dl-card {
        position: relative;
        background: #fff;
        border-radius: 18px;
        border: 1px solid rgba(13, 27, 94, 0.1);
        box-shadow: 0 8px 28px rgba(13, 27, 94, 0.08);
        overflow: hidden;
        display: flex;
        flex-direction: column;
        min-height: 100%;
        animation: cr-mini-up 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
        transition: transform 0.26s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.26s ease;
    }
    .cr-dl-card:nth-child(1) { animation-delay: 0.06s; }
    .cr-dl-card:nth-child(2) { animation-delay: 0.12s; }
    .cr-dl-card:nth-child(3) { animation-delay: 0.18s; }
    .cr-dl-card:nth-child(4) { animation-delay: 0.24s; }
    .cr-dl-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 18px 44px rgba(13, 27, 94, 0.14);
    }
    .cr-dl-card-topbar {
        height: 5px;
        width: 100%;
        flex-shrink: 0;
    }
    .cr-dl-card--blue .cr-dl-card-topbar {
        background: linear-gradient(90deg, #0d1b5e, #283593, #3949ab);
    }
    .cr-dl-card--amber .cr-dl-card-topbar {
        background: linear-gradient(90deg, #e65100, #f5b800, #ffd740);
    }
    .cr-dl-card--green .cr-dl-card-topbar {
        background: linear-gradient(90deg, #0d4f3c, #15803d, #22c55e);
    }
    .cr-dl-card--purple .cr-dl-card-topbar {
        background: linear-gradient(90deg, #4c1d95, #6d28d9, #a78bfa);
    }
    .cr-dl-card-body {
        padding: 20px 20px 18px;
        display: flex;
        flex-direction: column;
        flex: 1;
        gap: 0;
    }
    .cr-dl-icon {
        width: 48px;
        height: 48px;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        margin-bottom: 14px;
    }
    .cr-dl-icon--blue {
        background: rgba(13, 27, 94, 0.09);
        color: #1a2a6c;
    }
    .cr-dl-icon--amber {
        background: rgba(245, 184, 0, 0.18);
        color: #b45309;
    }
    .cr-dl-icon--green {
        background: rgba(21, 128, 61, 0.12);
        color: #15803d;
    }
    .cr-dl-icon--purple {
        background: rgba(109, 40, 217, 0.12);
        color: #6d28d9;
    }
    .cr-dl-card-title {
        font-size: 16px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 8px;
        line-height: 1.3;
    }
    .cr-dl-card-desc {
        font-size: 13px;
        color: #5a6782;
        line-height: 1.65;
        margin: 0 0 18px;
        flex: 1;
    }
    .cr-dl-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: 100%;
        margin-top: auto;
        padding: 12px 14px;
        border-radius: 12px;
        font-size: 13px;
        font-weight: 800;
        text-decoration: none;
        border: none;
        cursor: pointer;
        transition: transform 0.2s ease, filter 0.2s ease, box-shadow 0.2s ease;
    }
    .cr-dl-btn i { font-size: 14px; }
    .cr-dl-btn--blue {
        background: linear-gradient(135deg, #1a2a6c 0%, #0d1b5e 100%);
        color: #fff;
        box-shadow: 0 6px 18px rgba(13, 27, 94, 0.28);
    }
    .cr-dl-btn--amber {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        box-shadow: 0 6px 18px rgba(224, 123, 0, 0.28);
    }
    .cr-dl-btn--green {
        background: linear-gradient(135deg, #15803d 0%, #0d4f3c 100%);
        color: #fff;
        box-shadow: 0 6px 18px rgba(21, 128, 61, 0.28);
    }
    .cr-dl-btn--purple {
        background: linear-gradient(135deg, #6d28d9 0%, #4c1d95 100%);
        color: #fff;
        box-shadow: 0 6px 18px rgba(76, 29, 149, 0.28);
    }
    .cr-dl-btn:hover:not(.cr-dl-btn--disabled) {
        transform: translateY(-2px);
        filter: brightness(1.05);
    }
    .cr-dl-btn--disabled {
        background: #e8ecf5;
        color: #7a8699;
        cursor: not-allowed;
        box-shadow: none;
    }

    /* ── FAQ Accordion — Redesigned ── */
    @keyframes cr-faq-open {
        from { opacity: 0; transform: translateY(-8px); }
        to   { opacity: 1; transform: translateY(0); }
    }

    .cr-accordion {
        position: relative;
        margin-top: 28px;
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 20px;
        padding: 24px 26px;
        box-shadow: 0 6px 28px rgba(13,27,94,0.08);
        overflow: hidden;
    }

    /* Left gradient accent strip */
    .cr-accordion::before {
        content: "";
        position: absolute;
        top: 0; left: 0; bottom: 0;
        width: 4px;
        background: linear-gradient(180deg, #0d1b5e 0%, #1a2a6c 50%, #f5b800 100%);
        border-radius: 4px 0 0 4px;
    }

    /* Header row */
    .cr-acc-header {
        display: flex;
        align-items: center;
        gap: 14px;
        margin-bottom: 20px;
        padding-bottom: 16px;
        border-bottom: 1px solid rgba(13,27,94,0.08);
    }
    .cr-acc-header-icon {
        width: 46px; height: 46px;
        border-radius: 13px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 100%);
        border: 1px solid rgba(245,184,0,0.28);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 20px;
        flex-shrink: 0;
        box-shadow: 0 5px 16px rgba(13,27,94,0.28);
    }
    .cr-acc-header-text { flex: 1; }
    .cr-acc-title {
        color: #0d1b5e;
        font-weight: 900;
        font-size: 17px;
        margin: 0 0 2px;
    }
    .cr-acc-subtitle {
        font-size: 12px;
        color: #8a98bb;
        font-weight: 500;
        margin: 0;
    }
    .cr-acc-count {
        display: inline-flex;
        align-items: center;
        padding: 4px 12px;
        background: linear-gradient(90deg, rgba(13,27,94,0.07), rgba(26,42,108,0.1));
        border: 1px solid rgba(13,27,94,0.12);
        border-radius: 50px;
        font-size: 11px;
        font-weight: 800;
        color: #1a2a6c;
        letter-spacing: 0.4px;
        white-space: nowrap;
    }

    /* Each FAQ item */
    .cr-detail {
        background: #f8f9fe;
        border: 1.5px solid rgba(13,27,94,0.08);
        border-radius: 13px;
        margin-bottom: 10px;
        overflow: hidden;
        transition: border-color 0.28s ease, box-shadow 0.28s ease, background 0.28s ease;
    }
    .cr-detail:last-child { margin-bottom: 0; }
    .cr-detail[open] {
        background: #fff;
        border-color: rgba(245,184,0,0.55);
        box-shadow: 0 6px 24px rgba(245,184,0,0.13), 0 2px 8px rgba(13,27,94,0.06);
    }

    /* Summary row */
    .cr-summary {
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 15px 16px;
        list-style: none;
        transition: background 0.22s ease;
    }
    .cr-summary::-webkit-details-marker { display: none; }
    .cr-summary::marker { display: none; }
    .cr-detail[open] .cr-summary {
        background: linear-gradient(90deg, rgba(13,27,94,0.04) 0%, transparent 100%);
    }

    /* Number badge */
    .cr-summary-num {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 28px; height: 28px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 100%);
        color: #f5b800;
        font-size: 10.5px;
        font-weight: 900;
        border-radius: 8px;
        flex-shrink: 0;
        letter-spacing: 0.3px;
        transition: background 0.25s ease;
    }
    .cr-detail[open] .cr-summary-num {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
    }

    /* Question text */
    .cr-summary-text {
        flex: 1;
        font-size: 13.5px;
        font-weight: 700;
        color: #0d1b5e;
        line-height: 1.45;
    }

    /* Toggle icon — gold circle button */
    .cr-summary-icon {
        width: 30px; height: 30px;
        border-radius: 50%;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        box-shadow: 0 3px 10px rgba(245,184,0,0.35);
        transition: box-shadow 0.25s ease;
    }
    .cr-summary-icon i {
        color: #0d1b5e;
        font-size: 11px;
        transition: transform 0.3s cubic-bezier(0.22,1,0.36,1);
    }
    .cr-detail[open] .cr-summary-icon {
        box-shadow: 0 4px 14px rgba(245,184,0,0.45);
    }
    .cr-detail[open] .cr-summary-icon i { transform: rotate(45deg); }

    /* Answer body */
    .cr-detail-body {
        animation: cr-faq-open 0.3s ease both;
    }
    .cr-detail-text {
        margin: 0;
        padding: 2px 16px 16px 56px;
        color: #5a6782;
        line-height: 1.8;
        font-size: 13.5px;
    }
    .cr-callout {
        position: relative;
        overflow: hidden;
        margin-top: 24px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 24px 28px;
        border-radius: 20px;
        background: linear-gradient(135deg, #f5b800 0%, #ffd740 45%, #e07b00 100%);
        box-shadow: 0 16px 48px rgba(245,184,0,0.28);
    }
    .cr-callout-glow {
        position: absolute;
        top: -30px; right: -20px;
        width: 180px; height: 180px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(255,255,255,0.25) 0%, transparent 70%);
        filter: blur(28px);
        pointer-events: none;
        animation: cr-glow-pulse 5s ease-in-out infinite;
    }
    .cr-callout-icon {
        position: relative; z-index: 1;
        width: 52px; height: 52px;
        border-radius: 14px;
        display: flex; align-items: center; justify-content: center;
        background: rgba(13,27,94,0.18);
        border: 1.5px solid rgba(13,27,94,0.25);
        flex-shrink: 0;
    }
    .cr-callout-icon i { color: #0d1b5e; font-size: 22px; }
    .cr-callout-body { position: relative; z-index: 1; flex: 1; }
    .cr-callout-title { margin: 0 0 5px; color: #0d1b5e; font-weight: 900; font-size: 17px; line-height: 1.3; }
    .cr-callout-text  { margin: 0; color: rgba(13,27,94,0.75); line-height: 1.6; font-size: 13.5px; }
    .cr-callout-actions { flex-shrink: 0; position: relative; z-index: 1; }
    .cr-link-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 100%);
        color: #f5b800;
        font-weight: 900;
        font-size: 13.5px;
        padding: 11px 20px;
        border-radius: 10px;
        border: 1px solid rgba(245,184,0,0.25);
        box-shadow: 0 8px 24px rgba(13,27,94,0.35);
        text-decoration: none;
        white-space: nowrap;
        transition: transform 0.22s ease, box-shadow 0.22s ease;
    }
    .cr-link-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 36px rgba(13,27,94,0.45); color: #ffd740; }
    @media (prefers-reduced-motion: reduce) {
        .cr-card, .cr-mini-card, .cr-header, .cr-dl-card { animation: none !important; opacity: 1 !important; transform: none !important; }
        .cr-section-bg::before, .cr-section-bg::after, .cr-card-glow, .cr-callout-glow { animation: none !important; }
        .cr-mini-icon { transition: none !important; transform: none !important; }
    }
    @media (max-width: 991px) {
        .cr-grid--2 { grid-template-columns: 1fr; }
        .cr-grid--3 { grid-template-columns: repeat(2, 1fr); }
        .cr-dl-grid { grid-template-columns: repeat(2, 1fr); }
        .cr-header  { margin-bottom: 36px; }
        .cr-callout { flex-direction: column; align-items: flex-start; }
        .cr-callout-actions { width: 100%; }
        .cr-link-btn { width: 100%; justify-content: center; }
    }
    @media (max-width: 767px) {
        .cr-container { padding: 0 18px; }
        .cr-section   { padding: 50px 0 58px; }
        .cr-grid--3   { grid-template-columns: 1fr; }
        .cr-dl-grid   { grid-template-columns: 1fr; }
        .cr-accordion { padding: 18px 16px; }
        .cr-acc-count { display: none; }
        .cr-detail-text { padding-left: 16px; }
        .cr-acc-header { flex-wrap: wrap; }
        .cr-card      { border-radius: 16px; }
        .cr-mini-card { border-radius: 14px; padding: 20px 16px; }
        .cr-callout   { padding: 18px 18px; border-radius: 16px; }
    }

    /* ================================================================
    OVERVIEW PAGE — Contact Us Teaser
    ================================================================ */
    .ov-contact-section {
        background: linear-gradient(180deg, #ffffff 0%, #f6f8ff 100%);
        padding: 28px 0;
    }

    .ov-contact-card {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 22px 22px;
        border-radius: 16px;
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        box-shadow: 0 14px 40px rgba(13, 27, 94, 0.10);
    }

    .ov-contact-icon {
        width: 54px;
        height: 54px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        background: linear-gradient(135deg, rgba(13,27,94,0.22), rgba(245,184,0,0.10));
        border: 1px solid rgba(13, 27, 94, 0.16);
        flex-shrink: 0;
    }

    .ov-contact-icon i { font-size: 20px; color: #f5b800; }

    .ov-contact-content { flex: 1; min-width: 0; }

    .ov-contact-title {
        font-size: 18px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 6px;
    }

    .ov-contact-text {
        font-size: 14px;
        color: #5a6782;
        margin: 0;
        line-height: 1.7;
        max-width: 680px;
    }

    .ov-contact-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 800;
        font-size: 14px;
        padding: 12px 16px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,0.06);
        box-shadow: 0 10px 24px rgba(245, 184, 0, 0.24);
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
        white-space: nowrap;
    }

    .ov-contact-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.30);
        filter: brightness(1.02);
    }

    .ov-contact-btn i { font-size: 13px; transition: transform 0.2s; }
    .ov-contact-btn:hover i { transform: translateX(3px); }

    @media (max-width: 767px) {
        .ov-contact-section { padding: 22px 0; }
        .ov-contact-card {
            flex-direction: column;
            align-items: flex-start;
            padding: 18px 16px;
            border-radius: 14px;
        }
        .ov-contact-btn { width: 100%; justify-content: center; }
    }

    /* ================================================================
    CONTACT PAGE
    ================================================================ */
    .ct-section {
        background: linear-gradient(180deg, #ffffff 0%, #f4f6ff 100%);
        padding: 80px 0 90px;
    }

    .ct-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }

    .ct-header {
        text-align: center;
        max-width: 860px;
        margin: 0 auto 52px;
    }

    .ct-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }

    .ct-tag i { font-size: 11px; color: #f5b800; }

    .ct-title {
        font-size: clamp(26px, 3.4vw, 42px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .ct-accent { color: #f5b800; }

    .ct-subtitle {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.8;
        margin: 0;
    }

    .ct-cards {
        --ct-blue: #1a2a6c;
        --ct-navy: #0d1b5e;
        --ct-gold: #f5b800;
        --ct-ice: #f4f7ff;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
        gap: 18px;
        margin-bottom: 32px;
        padding-top: 4px;
        padding-bottom: 4px;
    }

    .ct-card {
        background: linear-gradient(135deg, rgb(45 78 234) 0%, rgb(100 120 210) 40%, rgb(70 90 200) 100%);
        border: 1px solid rgba(13,27,94,0.14);
        border-radius: 20px;
        box-shadow: 0 12px 36px rgba(13, 27, 94, 0.14);
        padding: 20px 18px;
        display: flex;
        align-items: flex-start;
        gap: 14px;
        position: relative;
        transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
        color: inherit;
        overflow: hidden;
        min-width: 0;
    }

    .ct-card::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background:
            radial-gradient(260px 150px at 12% 0%, rgba(245,184,0,0.22) 0%, transparent 62%),
            radial-gradient(260px 150px at 100% 100%, rgba(13,27,94,0.16) 0%, transparent 64%);
        opacity: 0.9;
    }

    .ct-card::after {
        content: "";
        position: absolute;
        inset: -1px;
        pointer-events: none;
        background: linear-gradient(135deg, rgba(245,184,0,0.35), rgba(13,27,94,0.18), rgba(245,184,0,0.22));
        opacity: 0.28;
        filter: blur(14px);
    }

    .ct-card:hover {
        transform: translateY(-4px);
        border-color: rgba(245,184,0,0.70);
        box-shadow: 0 22px 60px rgba(13, 27, 94, 0.18);
    }

    .ct-card--static:hover { transform: none; }

    .ct-card-icon {
        width: 52px;
        height: 52px;
        min-width: 52px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, rgba(13,27,94,0.22), rgba(245,184,0,0.18));
        border: 1px solid rgba(255,255,255,0.18);
        flex-shrink: 0;
        position: relative;
        z-index: 1;
    }

    .ct-card-icon i { font-size: 20px; color: var(--ct-gold); }

    .ct-card-body { position: relative; z-index: 1; min-width: 0; flex: 1; }
    .ct-card-title { margin: 0 0 6px; color: #fff; font-weight: 900; font-size: 15px; }
    .ct-card-text { margin: 0; color: rgba(255,255,255,0.92); font-weight: 700; letter-spacing: 0.2px; font-size: 13.5px; word-break: break-word; }
    .ct-card-text--multiline { line-height: 1.55; }
    .ct-card-text--lines { line-height: 1.65; }
    .ct-card-inline-link { color: inherit; text-decoration: none; }
    .ct-card-inline-link:hover { text-decoration: underline; color: #fff; }
    .ct-card-meta { display: block; margin-top: 6px; color: rgba(255,255,255,0.62); font-weight: 600; font-size: 12px; }

    .ct-card-arrow {
        position: absolute;
        right: 14px;
        top: 16px;
        color: rgba(255,255,255,0.55);
        z-index: 1;
    }

    .ct-card:hover .ct-card-arrow i { transform: translateX(3px); }
    .ct-card-arrow i { transition: transform 0.22s ease; }

    /* 2-column on tablet */
    @media (max-width: 1024px) {
        .ct-cards { grid-template-columns: repeat(2, 1fr); }
    }

    /* 1-column on mobile */
    @media (max-width: 560px) {
        .ct-cards { grid-template-columns: 1fr; }
    }

    .ct-grid {
        display: grid;
        grid-template-columns: 1.05fr 0.95fr;
        gap: 20px;
        align-items: start;
    }

    .ct-form-card,
    .ct-map-card {
        background:
            linear-gradient(135deg, rgba(13,27,94,0.05) 0%, rgba(26,42,108,0.03) 55%, rgba(245,184,0,0.05) 100%),
            rgba(255,255,255,0.86);
        border: 1px solid rgba(13, 27, 94, 0.14);
        border-radius: 20px;
        box-shadow: 0 22px 64px rgba(13, 27, 94, 0.12);
        padding: 24px 24px;
        position: relative;
        overflow: hidden;
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }

    .ct-form-card::before,
    .ct-map-card::before {
        content: "";
        position: absolute;
        inset: -2px;
        pointer-events: none;
        background:
            radial-gradient(340px 220px at 10% 0%, rgba(245,184,0,0.22) 0%, transparent 60%),
            radial-gradient(320px 220px at 100% 100%, rgba(13,27,94,0.14) 0%, transparent 62%);
        opacity: 0.85;
        animation: ctCardGlow 12s ease-in-out infinite;
    }

    .ct-form-card::after,
    .ct-map-card::after {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: radial-gradient(rgba(13,27,94,0.10) 1px, transparent 1px);
        background-size: 26px 26px;
        opacity: 0.16;
        animation: ctCardDots 22s linear infinite;
    }

    @keyframes ctCardGlow {
        0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
        50%      { transform: translate3d(10px, -10px, 0) scale(1.02); }
    }

    @keyframes ctCardDots {
        0%   { background-position: 0 0; }
        100% { background-position: 26px 26px; }
    }

    .ct-box-title {
        margin: 0 0 8px;
        color: #0d1b5e;
        font-weight: 900;
        font-size: 18px;
        position: relative;
        z-index: 1;
    }

    .ct-box-sub {
        margin: 0 0 16px;
        color: #5a6782;
        line-height: 1.8;
        font-size: 14px;
        position: relative;
        z-index: 1;
    }

    .ct-form { display: grid; gap: 14px; }

    .ct-form-row { display: grid; gap: 8px; }
    .ct-form-row--2 { grid-template-columns: 1fr 1fr; gap: 12px; }

    .ct-label {
        font-size: 13px;
        font-weight: 800;
        color: #0d1b5e;
        position: relative;
        z-index: 1;
    }

    .ct-input,
    .ct-textarea {
        width: 100%;
        border-radius: 16px;
        border: 1px solid rgba(13, 27, 94, 0.18);
        background: rgba(255,255,255,0.92);
        padding: 12px 12px;
        font-size: 14px;
        outline: none;
        transition: box-shadow 0.2s, border-color 0.2s;
        position: relative;
        z-index: 1;
    }

    .ct-input:focus,
    .ct-textarea:focus {
        border-color: rgba(245,184,0,0.60);
        box-shadow: 0 0 0 4px rgba(245,184,0,0.18);
    }

    .ct-input::placeholder,
    .ct-textarea::placeholder {
        color: rgba(13,27,94,0.50);
        font-weight: 650;
    }

    .ct-textarea { resize: vertical; min-height: 120px; }

    .ct-submit {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 16px;
        padding: 13px 16px;
        border: 1px solid rgba(0,0,0,0.06);
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 55%, #ffd000 100%);
        color: #0d1b5e;
        font-weight: 900;
        font-size: 14px;
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.26);
        cursor: pointer;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
        position: relative;
        z-index: 1;
    }

    .ct-submit:hover {
        transform: translateY(-2px);
        box-shadow: 0 18px 44px rgba(245, 184, 0, 0.34);
        filter: brightness(1.02);
    }

    .ct-privacy {
        margin: 8px 0 0;
        color: #6b7280;
        font-size: 12.5px;
        line-height: 1.6;
        position: relative;
        z-index: 1;
    }

    .ct-map {
        border-radius: 16px;
        overflow: hidden;
        border: 1px solid rgba(13, 27, 94, 0.12);
        background: rgba(13,27,94,0.03);
        position: relative;
        z-index: 1;
    }

    .ct-map iframe {
        width: 100%;
        height: 340px;
        border: 0;
        display: block;
    }

    .ct-map-actions {
        display: flex;
        gap: 10px;
        margin-top: 14px;
        flex-wrap: wrap;
        position: relative;
        z-index: 1;
    }

    .ct-map-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 12px;
        padding: 12px 14px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 900;
        font-size: 14px;
        border: 1px solid rgba(0,0,0,0.06);
        box-shadow: 0 12px 30px rgba(245, 184, 0, 0.22);
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
    }

    .ct-map-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 16px 40px rgba(245, 184, 0, 0.30);
        filter: brightness(1.02);
    }

    .ct-map-btn--outline {
        background: #ffffff;
        color: #0d1b5e;
        border-color: rgba(13, 27, 94, 0.14);
        box-shadow: none;
    }

    .ct-map-btn--outline:hover {
        background: rgba(245,184,0,0.12);
        transform: translateY(-2px);
    }

    @media (max-width: 991px) {
        .ct-grid { grid-template-columns: 1fr; }
    }

    @media (max-width: 767px) {
        .ct-section { padding: 56px 0 64px; }
        .ct-container { padding: 0 18px; }
        .ct-form-card,
        .ct-map-card { padding: 18px 16px; border-radius: 16px; }
        .ct-form-row--2 { grid-template-columns: 1fr; }
        .ct-map iframe { height: 280px; }
        .ct-map-btn { width: 100%; }
    }

    @media (prefers-reduced-motion: reduce) {
        .ct-form-card::before,
        .ct-map-card::before,
        .ct-form-card::after,
        .ct-map-card::after {
            animation: none !important;
        }
    }

    /* ================================================================
    OVERVIEW PAGE — Admission Teaser
    ================================================================ */
    .ov-admission-section {
        background: linear-gradient(180deg, #ffffff 0%, #f6f8ff 100%);
        padding: 28px 0;
    }

    .ov-admission-card {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 22px 22px;
        border-radius: 16px;
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        box-shadow: 0 14px 40px rgba(13, 27, 94, 0.10);
    }

    .ov-admission-icon {
        width: 54px;
        height: 54px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        background: linear-gradient(135deg, rgba(13,27,94,0.22), rgba(245,184,0,0.10));
        border: 1px solid rgba(13, 27, 94, 0.16);
        flex-shrink: 0;
    }

    .ov-admission-icon i { font-size: 20px; color: #f5b800; }

    .ov-admission-content { flex: 1; min-width: 0; }

    .ov-admission-title {
        font-size: 18px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 6px;
    }

    .ov-admission-text {
        font-size: 14px;
        color: #5a6782;
        margin: 0;
        line-height: 1.7;
        max-width: 680px;
    }

    .ov-admission-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 800;
        font-size: 14px;
        padding: 12px 16px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,0.06);
        box-shadow: 0 10px 24px rgba(245, 184, 0, 0.24);
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
        white-space: nowrap;
    }

    .ov-admission-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.30);
        filter: brightness(1.02);
    }

    .ov-admission-btn i { font-size: 13px; transition: transform 0.2s; }
    .ov-admission-btn:hover i { transform: translateX(3px); }

    @media (max-width: 767px) {
        .ov-admission-section { padding: 22px 0; }
        .ov-admission-card {
            flex-direction: column;
            align-items: flex-start;
            padding: 18px 16px;
            border-radius: 14px;
        }
        .ov-admission-btn { width: 100%; justify-content: center; }
    }

    /* ================================================================
    ADMISSION PAGE
    ================================================================ */
    .ad-section {
        background: linear-gradient(180deg, #ffffff 0%, #f4f6ff 100%);
        padding: 80px 0 0;
    }

    .ad-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }

    .ad-header {
        text-align: center;
        max-width: 860px;
        margin: 0 auto 52px;
    }

    .ad-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }

    .ad-tag i { font-size: 11px; color: #f5b800; }

    .ad-title {
        font-size: clamp(26px, 3.4vw, 44px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .ad-accent { color: #f5b800; }

    .ad-subtitle {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.85;
        margin: 0;
    }

    .ad-programmes-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 18px;
        padding-bottom: 54px;
    }

    .ad-prog-card {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.10);
        padding: 22px 22px;
    }

    .ad-prog-icon {
        width: 60px;
        height: 60px;
        border-radius: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, rgba(13,27,94,0.22), rgba(245,184,0,0.10));
        border: 1px solid rgba(13, 27, 94, 0.16);
        margin-bottom: 14px;
    }

    .ad-prog-icon i { font-size: 22px; color: #f5b800; }

    .ad-prog-title {
        margin: 0 0 10px;
        color: #0d1b5e;
        font-weight: 900;
        font-size: 18px;
    }

    .ad-prog-list {
        list-style: none;
        padding: 0;
        margin: 0 0 12px;
        display: grid;
        gap: 10px;
    }

    .ad-prog-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        color: #475569;
        font-weight: 750;
        font-size: 14px;
    }

    .ad-prog-list li i { color: #f5b800; font-size: 12px; margin-top: 4px; }

    .ad-prog-li-body {
        flex: 1;
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

    .ad-prog-short {
        font-weight: 500;
        font-size: 13px;
        line-height: 1.55;
        color: #64748b;
    }
    .ad-prog-short--html :is(p, ul, ol) {
        margin: 0;
    }
    .ad-prog-short--html ul,
    .ad-prog-short--html ol {
        padding-left: 1.15em;
    }
    .ad-prog-short--html p + p {
        margin-top: 0.35em;
    }

    a.ad-prog-link {
        color: inherit;
        text-decoration: none;
        border-bottom: 1px solid rgba(245, 184, 0, 0.45);
        transition: color 0.15s ease, border-color 0.15s ease;
        line-height: 1.45;
    }
    a.ad-prog-link:hover {
        color: #0d1b5e;
        border-bottom-color: #f5b800;
    }

    .ad-prog-empty {
        grid-column: 1 / -1;
        margin: 0;
        padding: 18px 20px;
        background: rgba(13, 27, 94, 0.04);
        border-radius: 14px;
        border: 1px dashed rgba(13, 27, 94, 0.15);
        color: #475569;
        font-size: 14px;
        line-height: 1.65;
    }
    .ad-prog-empty a {
        font-weight: 800;
        color: #0d1b5e;
        text-decoration: none;
        border-bottom: 2px solid rgba(245, 184, 0, 0.55);
    }
    .ad-prog-empty a:hover {
        border-bottom-color: #f5b800;
    }

    .ad-prog-note {
        margin: 0;
        color: #5a6782;
        font-weight: 700;
        line-height: 1.7;
        font-size: 14px;
    }

    .ad-process-section {
        padding: 64px 0;
        background: #ffffff;
    }

    .ad-section-header {
        text-align: center;
        max-width: 860px;
        margin: 0 auto 44px;
    }

    .ad-section-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }

    .ad-section-tag i { font-size: 11px; color: #f5b800; }

    .ad-section-title {
        font-size: clamp(24px, 3vw, 40px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .ad-section-subtitle {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.85;
        margin: 0;
    }

    .ad-steps-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 14px;
    }

    .ad-step {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.08);
        padding: 18px 16px;
    }

    .ad-step-num {
        width: 52px;
        height: 52px;
        border-radius: 16px;
        background: rgba(245,184,0,0.16);
        border: 1px solid rgba(245,184,0,0.35);
        color: #0d1b5e;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 1000;
        margin-bottom: 12px;
    }

    .ad-step-title {
        margin: 0 0 8px;
        color: #0d1b5e;
        font-weight: 900;
        font-size: 16px;
    }

    .ad-step-text {
        margin: 0;
        color: #475569;
        font-weight: 700;
        line-height: 1.75;
        font-size: 14px;
    }

    .ad-elig-section {
        padding: 64px 0;
        background: linear-gradient(180deg, #ffffff 0%, #f4f6ff 100%);
    }

    .ad-two-col {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 18px;
        align-items: start;
    }

    .ad-panel {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.08);
        padding: 22px 22px;
    }

    .ad-panel-title {
        margin: 0 0 10px;
        color: #0d1b5e;
        font-weight: 1000;
        font-size: 20px;
    }

    .ad-panel-sub {
        margin: 0 0 16px;
        color: #5a6782;
        line-height: 1.75;
        font-size: 14px;
        font-weight: 750;
    }

    .ad-elig-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px;
    }

    .ad-elig-card {
        border-radius: 16px;
        border: 1px solid rgba(13, 27, 94, 0.10);
        background: rgba(13,27,94,0.02);
        padding: 16px 14px;
    }

    .ad-elig-title {
        margin: 0 0 10px;
        color: #0d1b5e;
        font-weight: 900;
        font-size: 15px;
    }

    .ad-elig-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: grid;
        gap: 10px;
    }

    .ad-elig-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        color: #475569;
        font-weight: 750;
        font-size: 14px;
        line-height: 1.55;
    }

    .ad-elig-list li i { color: #f5b800; font-size: 12px; margin-top: 3px; flex-shrink: 0; }

    .ad-elig-program {
        margin-top: 14px;
        padding-top: 14px;
        border-top: 1px solid rgba(13, 27, 94, 0.08);
    }
    .ad-elig-program:first-of-type {
        margin-top: 0;
        padding-top: 0;
        border-top: 0;
    }
    .ad-elig-program-name {
        margin: 0 0 8px;
        color: #0d1b5e;
        font-weight: 850;
        font-size: 14px;
    }
    .ad-elig-program .ad-elig-list {
        margin-bottom: 8px;
    }

    .ad-elig-short {
        margin: 0 0 10px;
        font-size: 13px;
        font-weight: 500;
        color: #64748b;
        line-height: 1.55;
    }
    .ad-elig-short--html :is(p, ul, ol) {
        margin: 0;
    }
    .ad-elig-short--html ul,
    .ad-elig-short--html ol {
        padding-left: 1.15em;
    }
    .ad-elig-short--html p + p {
        margin-top: 0.35em;
    }

    .ad-elig-pdf {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 13px;
        font-weight: 800;
        color: #0d1b5e;
        text-decoration: none;
        border-bottom: 2px solid rgba(245, 184, 0, 0.55);
        padding-bottom: 2px;
    }
    .ad-elig-pdf:hover {
        border-bottom-color: #f5b800;
        color: #1a2f8a;
    }
    .ad-elig-empty {
        margin: 0;
        padding: 16px 18px;
        background: rgba(13, 27, 94, 0.04);
        border-radius: 14px;
        border: 1px dashed rgba(13, 27, 94, 0.15);
        color: #475569;
        font-size: 14px;
        line-height: 1.65;
    }
    .ad-elig-empty a {
        font-weight: 800;
        color: #0d1b5e;
        text-decoration: none;
        border-bottom: 2px solid rgba(245, 184, 0, 0.55);
    }
    .ad-elig-empty a:hover {
        border-bottom-color: #f5b800;
    }

    .ad-doc-body--rte {
        color: #475569;
        font-size: 14px;
        line-height: 1.65;
        font-weight: 650;
    }
    .ad-doc-body--rte :is(ul, ol) {
        margin: 0;
        padding-left: 1.2em;
    }
    .ad-doc-body--rte li {
        margin-bottom: 8px;
    }
    .ad-doc-body--rte li:last-child {
        margin-bottom: 0;
    }
    .ad-doc-body--rte p {
        margin: 0 0 10px;
    }
    .ad-doc-body--rte p:last-child {
        margin-bottom: 0;
    }

    .ad-doc-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: grid;
        gap: 10px;
    }

    .ad-doc-list li {
        display: flex;
        align-items: center;
        gap: 10px;
        color: #475569;
        font-weight: 750;
        font-size: 14px;
    }

    .ad-doc-list li i { color: #f5b800; font-size: 12px; }

    .ad-faq-section {
        padding: 64px 0;
        background: #ffffff;
    }

    .ad-faq {
        max-width: 980px;
        margin: 0 auto;
    }

    .ad-detail {
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        background: #ffffff;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.05);
        margin-bottom: 14px;
        overflow: hidden;
    }

    .ad-detail:last-child { margin-bottom: 0; }

    .ad-summary {
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: 16px 16px;
        color: #0d1b5e;
        font-weight: 950;
        font-size: 15px;
    }

    .ad-summary::-webkit-details-marker { display: none; }

    .ad-summary-icon i {
        color: #f5b800;
        transition: transform 0.2s;
        font-size: 12px;
    }

    .ad-detail[open] .ad-summary {
        background: rgba(245,184,0,0.08);
    }

    .ad-detail[open] .ad-summary-icon i {
        transform: rotate(45deg);
    }

    .ad-detail-text {
        margin: 0;
        padding: 0 16px 16px 16px;
        color: #475569;
        line-height: 1.8;
        font-size: 14px;
        font-weight: 750;
    }

    .ad-apply-section {
        padding: 70px 0 90px;
        background: linear-gradient(180deg, #ffffff 0%, #f4f6ff 100%);
    }

    .ad-apply-grid {
        display: grid;
        grid-template-columns: 1.05fr 0.95fr;
        gap: 18px;
        align-items: start;
    }

    .ad-apply-head {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.08);
        padding: 22px 22px;
    }

    .ad-apply-title {
        margin: 0 0 10px;
        color: #0d1b5e;
        font-weight: 1000;
        font-size: 20px;
        line-height: 1.3;
    }

    .ad-apply-sub {
        margin: 0 0 16px;
        color: #5a6782;
        line-height: 1.75;
        font-weight: 750;
        font-size: 14px;
    }

    .ad-apply-badges {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .ad-badge {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 8px 12px;
        border-radius: 999px;
        background: rgba(13,27,94,0.06);
        border: 1px solid rgba(13,27,94,0.12);
        color: #0d1b5e;
        font-weight: 900;
        font-size: 13px;
    }

    .ad-badge i { color: #f5b800; font-size: 12px; }

    .ad-form {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.08);
        padding: 22px 22px;
    }

    .ad-form-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px;
    }

    .ad-form-row { display: grid; gap: 8px; }

    .ad-form-label {
        color: #0d1b5e;
        font-weight: 900;
        font-size: 13px;
    }

    .ad-form-input,
    .ad-form-textarea {
        width: 100%;
        border-radius: 14px;
        border: 1px solid rgba(13, 27, 94, 0.16);
        background: #ffffff;
        padding: 12px 12px;
        outline: none;
        font-size: 14px;
        font-weight: 750;
        transition: box-shadow 0.2s, border-color 0.2s;
    }

    .ad-form-input:focus,
    .ad-form-textarea:focus {
        border-color: rgba(245,184,0,0.60);
        box-shadow: 0 0 0 4px rgba(245,184,0,0.18);
    }

    .ad-form-textarea { resize: vertical; min-height: 120px; }

    .ad-submit {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 14px;
        padding: 13px 16px;
        border: 1px solid rgba(0,0,0,0.06);
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 1000;
        font-size: 14px;
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.26);
        cursor: pointer;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
        width: 100%;
        margin-top: 14px;
    }

    .ad-submit:hover {
        transform: translateY(-2px);
        box-shadow: 0 18px 44px rgba(245, 184, 0, 0.34);
        filter: brightness(1.02);
    }

    .ad-privacy {
        margin: 10px 0 0;
        color: #6b7280;
        font-size: 12.5px;
        line-height: 1.6;
        font-weight: 700;
    }

    @media (max-width: 991px) {
        .ad-programmes-grid { grid-template-columns: 1fr; }
        .ad-steps-grid { grid-template-columns: repeat(2, 1fr); }
        .ad-two-col { grid-template-columns: 1fr; }
        .ad-elig-grid { grid-template-columns: 1fr; }
        .ad-apply-grid { grid-template-columns: 1fr; }
        .ad-form-grid { grid-template-columns: 1fr 1fr; }
    }

    @media (max-width: 767px) {
        .ad-container { padding: 0 18px; }
        .ad-section-title { font-size: 26px; }
        .ad-section { padding: 50px 0 0; }
        .ad-programmes-grid { padding-bottom: 44px; }
        .ad-steps-grid { grid-template-columns: 1fr; }
        .ad-form-grid { grid-template-columns: 1fr; }
        .ad-apply-section { padding: 56px 0 72px; }
    }

    /* ================================================================
    OVERVIEW PAGE — Academics Teaser
    ================================================================ */
    .ov-academics-section {
        background: linear-gradient(180deg, #ffffff 0%, #f6f8ff 100%);
        padding: 28px 0;
    }

    .ov-academics-card {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 22px 22px;
        border-radius: 16px;
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        box-shadow: 0 14px 40px rgba(13, 27, 94, 0.10);
    }

    .ov-academics-icon {
        width: 54px;
        height: 54px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        background: linear-gradient(135deg, rgba(13,27,94,0.22), rgba(245,184,0,0.10));
        border: 1px solid rgba(13, 27, 94, 0.16);
        flex-shrink: 0;
    }

    .ov-academics-icon i { font-size: 20px; color: #f5b800; }

    .ov-academics-content { flex: 1; min-width: 0; }

    .ov-academics-title {
        font-size: 18px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 6px;
    }

    .ov-academics-text {
        font-size: 14px;
        color: #5a6782;
        margin: 0;
        line-height: 1.7;
        max-width: 680px;
    }

    .ov-academics-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 800;
        font-size: 14px;
        padding: 12px 16px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,0.06);
        box-shadow: 0 10px 24px rgba(245, 184, 0, 0.24);
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
        white-space: nowrap;
    }

    .ov-academics-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.30);
        filter: brightness(1.02);
    }

    .ov-academics-btn i { font-size: 13px; transition: transform 0.2s; }
    .ov-academics-btn:hover i { transform: translateX(3px); }

    @media (max-width: 767px) {
        .ov-academics-section { padding: 22px 0; }
        .ov-academics-card {
            flex-direction: column;
            align-items: flex-start;
            padding: 18px 16px;
            border-radius: 14px;
        }
        .ov-academics-btn { width: 100%; justify-content: center; }
    }

    /* ================================================================
    ACADEMICS PAGE
    ================================================================ */
    .ac-section {
        background: linear-gradient(180deg, #ffffff 0%, #f4f6ff 100%);
        padding: 80px 0 90px;
    }

    .ac-section--programmes { padding: 80px 0 74px; }
    .ac-section--learning { background: #ffffff; }
    .ac-section--industry { padding: 74px 0 90px; }
    .ac-section--faq { background: #ffffff; padding-top: 74px; padding-bottom: 88px; }

    .ac-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }

    .ac-header {
        text-align: center;
        max-width: 860px;
        margin: 0 auto 44px;
    }

    .ac-header--left {
        text-align: left;
        margin-left: 0;
        margin-right: 0;
    }

    .ac-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }

    .ac-tag i { font-size: 11px; color: #f5b800; }

    .ac-title {
        font-size: clamp(26px, 3.4vw, 44px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .ac-accent { color: #f5b800; }

    .ac-subtitle {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.85;
        margin: 0;
    }

    .ac-prog-grid {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        gap: 14px;
    }

    .ac-prog-card {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.06);
        padding: 18px 16px;
        transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
    }

    .ac-prog-card:hover {
        transform: translateY(-3px);
        border-color: rgba(245,184,0,0.35);
        box-shadow: 0 22px 64px rgba(13, 27, 94, 0.12);
    }

    .ac-prog-icon {
        width: 58px;
        height: 58px;
        border-radius: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, rgba(13,27,94,0.22), rgba(245,184,0,0.10));
        border: 1px solid rgba(13, 27, 94, 0.16);
        margin-bottom: 12px;
    }

    .ac-prog-icon i { font-size: 22px; color: #f5b800; }

    .ac-prog-title {
        color: #0d1b5e;
        font-weight: 1000;
        font-size: 16px;
        margin: 0 0 6px;
    }

    .ac-prog-text {
        margin: 0 0 12px;
        color: #475569;
        font-weight: 800;
        font-size: 13.5px;
        line-height: 1.5;
    }

    .ac-prog-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: grid;
        gap: 8px;
    }

    .ac-prog-list li {
        display: flex;
        align-items: center;
        gap: 8px;
        color: #475569;
        font-weight: 750;
        font-size: 13px;
    }

    .ac-prog-list li i { color: #f5b800; font-size: 11px; }

    .ac-prog-link {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        margin-top: 14px;
        padding: 10px 12px;
        border-radius: 14px;
        background: rgba(13,27,94,0.04);
        border: 1px solid rgba(13,27,94,0.10);
        color: #0d1b5e;
        font-weight: 900;
        font-size: 13.5px;
        text-decoration: none;
        transition: transform 0.2s, border-color 0.2s, background 0.2s;
        white-space: nowrap;
    }

    .ac-prog-link:hover {
        transform: translateY(-2px);
        border-color: rgba(245,184,0,0.40);
        background: rgba(245,184,0,0.10);
    }

    .ac-feature-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 14px;
    }

    .ac-feature-card {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.06);
        padding: 18px 16px;
    }

    .ac-feature-icon {
        width: 58px;
        height: 58px;
        border-radius: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, rgba(13,27,94,0.22), rgba(245,184,0,0.10));
        border: 1px solid rgba(13, 27, 94, 0.16);
        margin-bottom: 12px;
    }

    .ac-feature-icon i { font-size: 22px; color: #f5b800; }

    .ac-feature-title {
        color: #0d1b5e;
        font-weight: 1000;
        font-size: 16px;
        margin: 0 0 8px;
    }

    .ac-feature-text {
        margin: 0;
        color: #475569;
        font-weight: 800;
        line-height: 1.8;
        font-size: 13.5px;
    }

    .ac-industry-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 18px;
        align-items: start;
    }

    .ac-industry-card {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.06);
        padding: 22px 18px;
    }

    .ac-industry-card--primary {
        border-color: rgba(245,184,0,0.30);
    }

    .ac-industry-title {
        margin: 0 0 10px;
        color: #0d1b5e;
        font-weight: 1000;
        font-size: 16px;
    }

    .ac-industry-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: grid;
        gap: 10px;
    }

    .ac-industry-list li {
        display: flex;
        align-items: center;
        gap: 10px;
        color: #475569;
        font-weight: 800;
        font-size: 14px;
    }

    .ac-industry-list li i { color: #f5b800; font-size: 12px; }

    .ac-accordion {
        max-width: 980px;
        margin: 0 auto;
    }

    .ac-detail {
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        background: #ffffff;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.05);
        margin-bottom: 14px;
        overflow: hidden;
    }

    .ac-detail:last-child { margin-bottom: 0; }

    .ac-summary {
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: 16px 16px;
        color: #0d1b5e;
        font-weight: 950;
        font-size: 15px;
    }

    .ac-summary::-webkit-details-marker { display: none; }

    .ac-summary-icon i {
        color: #f5b800;
        transition: transform 0.2s;
        font-size: 12px;
    }

    .ac-detail[open] .ac-summary {
        background: rgba(245,184,0,0.08);
    }

    .ac-detail[open] .ac-summary-icon i {
        transform: rotate(45deg);
    }

    .ac-detail-text {
        margin: 0;
        padding: 0 16px 16px 16px;
        color: #475569;
        line-height: 1.85;
        font-size: 14px;
        font-weight: 800;
    }

    .ac-cta-section {
        padding: 60px 0 84px;
    }

    .ac-cta {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 55%, rgba(245,184,0,0.10) 110%);
        border-radius: 22px;
        border: 1px solid rgba(245,184,0,0.20);
        padding: 26px 24px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        flex-wrap: wrap;
    }

    .ac-cta-title {
        margin: 0 0 10px;
        color: #ffffff;
        font-weight: 1000;
        font-size: 22px;
        line-height: 1.25;
    }

    .ac-cta-sub {
        margin: 0;
        color: rgba(255,255,255,0.78);
        line-height: 1.8;
        font-size: 14px;
        font-weight: 750;
        max-width: 560px;
    }

    .ac-cta-actions { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }

    .ac-cta-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 14px;
        padding: 13px 16px;
        font-weight: 1000;
        font-size: 14px;
        white-space: nowrap;
        border: 1px solid transparent;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s, background 0.2s, border-color 0.2s;
        text-decoration: none;
    }

    .ac-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.26);
    }

    .ac-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 18px 44px rgba(245, 184, 0, 0.34);
        filter: brightness(1.02);
    }

    .ac-cta-btn--outline {
        background: rgba(255,255,255,0.06);
        color: #ffffff;
        border-color: rgba(255,255,255,0.20);
    }

    .ac-cta-btn--outline:hover {
        transform: translateY(-2px);
        background: rgba(255,255,255,0.10);
        border-color: rgba(255,255,255,0.30);
    }

    @media (max-width: 991px) {
        .ac-prog-grid { grid-template-columns: repeat(2, 1fr); }
        .ac-feature-grid { grid-template-columns: repeat(2, 1fr); }
        .ac-industry-grid { grid-template-columns: 1fr; }
    }

    @media (max-width: 767px) {
        .ac-container { padding: 0 18px; }
        .ac-header { margin-bottom: 32px; }
        .ac-prog-grid { grid-template-columns: 1fr; }
        .ac-feature-grid { grid-template-columns: 1fr; }
        .ac-cta { padding: 18px 16px; }
        .ac-cta-actions { width: 100%; }
        .ac-cta-btn { width: 100%; }
        .ac-cta-section { padding: 56px 0 70px; }
    }

    /* ================================================================
    OVERVIEW PAGE — Examination Teaser
    ================================================================ */
    .ov-exam-section {
        background: linear-gradient(180deg, #ffffff 0%, #f6f8ff 100%);
        padding: 28px 0;
    }

    .ov-exam-card {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 22px 22px;
        border-radius: 16px;
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        box-shadow: 0 14px 40px rgba(13, 27, 94, 0.10);
    }

    .ov-exam-icon {
        width: 54px;
        height: 54px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        background: linear-gradient(135deg, rgba(13,27,94,0.22), rgba(245,184,0,0.10));
        border: 1px solid rgba(13, 27, 94, 0.16);
        flex-shrink: 0;
    }

    .ov-exam-icon i { font-size: 20px; color: #f5b800; }

    .ov-exam-content { flex: 1; min-width: 0; }

    .ov-exam-title {
        font-size: 18px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 6px;
    }

    .ov-exam-text {
        font-size: 14px;
        color: #5a6782;
        margin: 0;
        line-height: 1.7;
        max-width: 680px;
    }

    .ov-exam-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 800;
        font-size: 14px;
        padding: 12px 16px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,0.06);
        box-shadow: 0 10px 24px rgba(245, 184, 0, 0.24);
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
        white-space: nowrap;
    }

    .ov-exam-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.30);
        filter: brightness(1.02);
    }

    .ov-exam-btn i { font-size: 13px; transition: transform 0.2s; }
    .ov-exam-btn:hover i { transform: translateX(3px); }

    @media (max-width: 767px) {
        .ov-exam-section { padding: 22px 0; }
        .ov-exam-card {
            flex-direction: column;
            align-items: flex-start;
            padding: 18px 16px;
            border-radius: 14px;
        }
        .ov-exam-btn { width: 100%; justify-content: center; }
    }

    /* ================================================================
    EXAMINATION PAGE
    ================================================================ */
    .ex-section {
        background: linear-gradient(180deg, #ffffff 0%, #f4f6ff 100%);
        padding: 80px 0 74px;
    }

    .ex-steps-section {
        background: #ffffff;
        padding: 64px 0;
    }

    .ex-policy-section {
        background: linear-gradient(180deg, #ffffff 0%, #f4f6ff 100%);
        padding: 64px 0;
    }

    .ex-faq-section {
        background: #ffffff;
        padding: 64px 0 88px;
    }

    .ex-cta-section {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 60%, rgba(245,184,0,0.10) 110%);
        padding: 70px 0 90px;
    }

    .ex-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }

    .ex-header {
        text-align: center;
        max-width: 860px;
        margin: 0 auto 44px;
    }

    .ex-section-header {
        text-align: center;
        max-width: 860px;
        margin: 0 auto 44px;
    }

    .ex-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }

    .ex-tag i { font-size: 11px; color: #f5b800; }

    .ex-title {
        font-size: clamp(26px, 3.4vw, 42px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .ex-accent { color: #f5b800; }

    .ex-subtitle {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.85;
        margin: 0;
    }

    .ex-cards {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 18px;
        padding-bottom: 44px;
    }

    .ex-card {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.06);
        padding: 22px 22px;
    }

    .ex-card-icon {
        width: 60px;
        height: 60px;
        border-radius: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, rgba(13,27,94,0.22), rgba(245,184,0,0.10));
        border: 1px solid rgba(13, 27, 94, 0.16);
        margin-bottom: 12px;
    }

    .ex-card-icon i { font-size: 22px; color: #f5b800; }

    .ex-card-title {
        color: #0d1b5e;
        font-weight: 900;
        font-size: 18px;
        margin: 0 0 10px;
    }

    .ex-card-text {
        color: #475569;
        font-size: 14px;
        line-height: 1.85;
        font-weight: 750;
        margin: 0 0 14px;
    }

    .ex-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: grid;
        gap: 10px;
    }

    .ex-list li {
        display: flex;
        align-items: center;
        gap: 10px;
        color: #475569;
        font-weight: 750;
        font-size: 14px;
    }

    .ex-list li i { color: #f5b800; font-size: 12px; }

    .ex-step-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 14px;
    }

    .ex-step {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.06);
        padding: 18px 16px;
    }

    .ex-step-num {
        width: 52px;
        height: 52px;
        border-radius: 16px;
        background: rgba(245,184,0,0.16);
        border: 1px solid rgba(245,184,0,0.35);
        color: #0d1b5e;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 1000;
        margin-bottom: 12px;
    }

    .ex-step-title {
        margin: 0 0 8px;
        color: #0d1b5e;
        font-weight: 900;
        font-size: 16px;
    }

    .ex-step-text {
        margin: 0;
        color: #475569;
        font-weight: 750;
        line-height: 1.75;
        font-size: 14px;
    }

    .ex-policy-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 18px;
    }

    .ex-policy-card {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.06);
        padding: 22px 22px;
    }

    .ex-policy-title {
        margin: 0 0 12px;
        color: #0d1b5e;
        font-weight: 1000;
        font-size: 18px;
    }

    .ex-accordion {
        max-width: 980px;
        margin: 0 auto;
    }

    .ex-detail {
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        background: #ffffff;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.05);
        margin-bottom: 14px;
        overflow: hidden;
    }

    .ex-detail:last-child { margin-bottom: 0; }

    .ex-summary {
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: 16px 16px;
        color: #0d1b5e;
        font-weight: 950;
        font-size: 15px;
    }

    .ex-summary::-webkit-details-marker { display: none; }

    .ex-summary-icon i {
        color: #f5b800;
        transition: transform 0.2s;
        font-size: 12px;
    }

    .ex-detail[open] .ex-summary {
        background: rgba(245,184,0,0.08);
    }

    .ex-detail[open] .ex-summary-icon i {
        transform: rotate(45deg);
    }

    .ex-detail-text {
        margin: 0;
        padding: 0 16px 16px 16px;
        color: #475569;
        line-height: 1.85;
        font-size: 14px;
        font-weight: 800;
    }

    .ex-cta {
        background: transparent;
    }

    .ex-cta-left {
        max-width: 620px;
    }

    .ex-cta-title {
        margin: 0 0 10px;
        color: #ffffff;
        font-weight: 1000;
        font-size: 26px;
        line-height: 1.25;
    }

    .ex-cta-sub {
        margin: 0;
        color: rgba(255,255,255,0.78);
        line-height: 1.8;
        font-size: 14px;
        font-weight: 750;
    }

    .ex-cta-actions {
        display: flex;
        gap: 12px;
        align-items: center;
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    .ex-cta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        max-width: 1240px;
        margin: 0 auto;
    }

    .ex-cta-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 14px;
        padding: 13px 16px;
        font-weight: 1000;
        font-size: 14px;
        white-space: nowrap;
        border: 1px solid transparent;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s, background 0.2s, border-color 0.2s;
        text-decoration: none;
    }

    .ex-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.26);
    }

    .ex-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 18px 44px rgba(245, 184, 0, 0.34);
        filter: brightness(1.02);
    }

    .ex-cta-btn--outline {
        background: rgba(255,255,255,0.06);
        color: #ffffff;
        border-color: rgba(255,255,255,0.20);
    }

    .ex-cta-btn--outline:hover {
        transform: translateY(-2px);
        background: rgba(255,255,255,0.10);
        border-color: rgba(255,255,255,0.30);
    }

    @media (max-width: 991px) {
        .ex-cards { grid-template-columns: 1fr; }
        .ex-step-grid { grid-template-columns: repeat(2, 1fr); }
        .ex-policy-grid { grid-template-columns: 1fr; }
        .ex-cta { flex-direction: column; align-items: flex-start; }
        .ex-cta-actions { width: 100%; justify-content: flex-start; }
    }

    @media (max-width: 767px) {
        .ex-container { padding: 0 18px; }
        .ex-section { padding: 56px 0 0; }
        .ex-steps-section { padding: 50px 0; }
        .ex-policy-section { padding: 50px 0; }
        .ex-faq-section { padding: 50px 0 70px; }
        .ex-cta-section { padding: 56px 0 70px; }
        .ex-cards { padding-bottom: 20px; }
        .ex-step-grid { grid-template-columns: 1fr; }
        .ex-cta-actions { flex-direction: column; width: 100%; gap: 10px; }
        .ex-cta-btn { width: 100%; }
    }

    /* ================================================================
    OVERVIEW PAGE — Department & Placement Teasers
    ================================================================ */
    .ov-dept-section,
    .ov-placement-section {
        background: linear-gradient(180deg, #ffffff 0%, #f6f8ff 100%);
        padding: 28px 0;
    }

    .ov-dept-card,
    .ov-placement-card {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 22px 22px;
        border-radius: 16px;
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        box-shadow: 0 14px 40px rgba(13, 27, 94, 0.10);
    }

    .ov-dept-icon,
    .ov-placement-icon {
        width: 54px;
        height: 54px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        background: linear-gradient(135deg, rgba(13,27,94,0.22), rgba(245,184,0,0.10));
        border: 1px solid rgba(13, 27, 94, 0.16);
        flex-shrink: 0;
    }

    .ov-dept-icon i,
    .ov-placement-icon i { font-size: 20px; color: #f5b800; }

    .ov-dept-content,
    .ov-placement-content { flex: 1; min-width: 0; }

    .ov-dept-title,
    .ov-placement-title {
        font-size: 18px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 6px;
    }

    .ov-dept-text,
    .ov-placement-text {
        font-size: 14px;
        color: #5a6782;
        margin: 0;
        line-height: 1.7;
        max-width: 680px;
    }

    .ov-dept-btn,
    .ov-placement-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 800;
        font-size: 14px;
        padding: 12px 16px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,0.06);
        box-shadow: 0 10px 24px rgba(245, 184, 0, 0.24);
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
        white-space: nowrap;
        text-decoration: none;
    }

    .ov-dept-btn:hover,
    .ov-placement-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.30);
        filter: brightness(1.02);
    }

    .ov-dept-btn i,
    .ov-placement-btn i { font-size: 13px; transition: transform 0.2s; }
    .ov-dept-btn:hover i,
    .ov-placement-btn:hover i { transform: translateX(3px); }

    @media (max-width: 767px) {
        .ov-dept-section,
        .ov-placement-section { padding: 22px 0; }
        .ov-dept-card,
        .ov-placement-card {
            flex-direction: column;
            align-items: flex-start;
            padding: 18px 16px;
            border-radius: 14px;
        }
        .ov-dept-btn,
        .ov-placement-btn { width: 100%; justify-content: center; }
    }

    /* ================================================================
    DEPARTMENT PAGE
    ================================================================ */
    .dp-section {
        background: linear-gradient(180deg, #ffffff 0%, #f4f6ff 100%);
        padding: 80px 0 0;
    }

    .dp-dept-section {
        padding: 0 0 64px;
        background: linear-gradient(180deg, #ffffff 0%, #f4f6ff 100%);
    }

    .dp-staff-section {
        padding: 64px 0 56px;
        background: linear-gradient(180deg, #f4f6ff 0%, #ffffff 100%);
    }

    .dp-staff-dept-block {
        margin-bottom: 40px;
    }

    .dp-staff-dept-block:last-child {
        margin-bottom: 0;
    }

    .dp-staff-dept-title {
        margin: 0 0 22px;
        font-size: 1.18rem;
        font-weight: 800;
        color: #0d1b5e;
        padding-bottom: 12px;
        border-bottom: 2px solid rgba(245, 184, 0, 0.45);
        display: flex;
        align-items: center;
        gap: 10px;
    }
    .dp-staff-dept-title::before {
        content: "";
        display: inline-block;
        width: 4px;
        height: 1.15em;
        background: linear-gradient(180deg, #f5b800, #e07b00);
        border-radius: 3px;
        flex-shrink: 0;
    }

    /* ---- Staff grid ---- */
    .dp-staff-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
    }
    @media (max-width: 1100px) { .dp-staff-grid { grid-template-columns: repeat(3, 1fr); } }
    @media (max-width: 760px)  { .dp-staff-grid { grid-template-columns: repeat(2, 1fr); } }
    @media (max-width: 420px)  { .dp-staff-grid { grid-template-columns: 1fr; } }

    /* ---- Staff card ---- */
    .dp-staff-card {
        background: #fff;
        border-radius: 18px;
        overflow: hidden;
        border: 1px solid rgba(26, 42, 108, 0.09);
        box-shadow: 0 2px 18px rgba(13, 27, 94, 0.07);
        display: flex;
        flex-direction: column;
        transition: transform 0.22s ease, box-shadow 0.22s ease;
    }
    .dp-staff-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 14px 36px rgba(13, 27, 94, 0.14);
    }

    /* ---- Card header (photo + dept badge) ---- */
    .dp-staff-card__header {
        position: relative;
        background: linear-gradient(140deg, #0d1b5e 0%, #1f3491 55%, #0d2480 100%);
        padding: 28px 16px 36px;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0;
    }
    .dp-staff-card__header::after {
        content: "";
        position: absolute;
        bottom: -1px;
        left: 0;
        right: 0;
        height: 22px;
        background: #fff;
        border-radius: 22px 22px 0 0;
    }

    /* Decorative dots in header */
    .dp-staff-card__header::before {
        content: "";
        position: absolute;
        top: 10px;
        right: 14px;
        width: 56px;
        height: 56px;
        border-radius: 50%;
        background: rgba(245, 184, 0, 0.08);
        pointer-events: none;
    }

    .dp-staff-card__avatar-wrap {
        position: relative;
        z-index: 1;
    }
    .dp-staff-card__avatar {
        width: 88px;
        height: 88px;
        border-radius: 50%;
        border: 3px solid rgba(245, 184, 0, 0.7);
        box-shadow: 0 0 0 4px rgba(245, 184, 0, 0.15);
        background: rgba(255, 255, 255, 0.1);
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        flex-shrink: 0;
    }
    .dp-staff-card__avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center top;
        display: block;
        border-radius: 50%;
    }
    .dp-staff-card__initials {
        font-size: 1.6rem;
        font-weight: 900;
        color: #f5b800;
        letter-spacing: 0.02em;
        line-height: 1;
        user-select: none;
    }

    .dp-staff-card__dept-badge {
        position: relative;
        z-index: 1;
        margin-top: 10px;
        display: inline-block;
        background: rgba(245, 184, 0, 0.18);
        color: #f5b800;
        font-size: 0.7rem;
        font-weight: 700;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        border-radius: 999px;
        padding: 4px 12px;
        border: 1px solid rgba(245, 184, 0, 0.35);
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* ---- Card body ---- */
    .dp-staff-card__body {
        padding: 14px 18px 20px;
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .dp-staff-card__name {
        font-size: 0.97rem;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 8px;
        line-height: 1.35;
    }
    .dp-staff-card__profile {
        font-size: 0.78rem;
        color: #5a6a8a;
        line-height: 1.6;
        margin: 0;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    @media (prefers-reduced-motion: reduce) {
        .dp-staff-card { transition: none; }
    }

    /* Department dropdown pages — Faculty Details tab */
    .csdept-panel .dept-faculty-grid.dp-staff-grid {
        margin-top: 4px;
    }

    .csdept-panel .dept-faculty-empty {
        text-align: center;
        padding: 28px 20px;
        color: #5a6a8a;
        font-size: 0.92rem;
        line-height: 1.6;
        background: rgba(26, 42, 108, 0.04);
        border: 1px dashed rgba(26, 42, 108, 0.15);
        border-radius: 12px;
    }

    .csdept-panel .dp-staff-card__profile {
        -webkit-line-clamp: 5;
    }

    .dp-focus-section {
        padding: 64px 0 88px;
        background: #ffffff;
    }

    .dp-cta-section {
        padding: 0 0 90px;
        background: linear-gradient(180deg, #f4f6ff 0%, #ffffff 100%);
    }

    .dp-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }

    .dp-header {
        text-align: center;
        max-width: 860px;
        margin: 0 auto 44px;
    }

    .dp-section-header {
        text-align: center;
        max-width: 860px;
        margin: 0 auto 44px;
    }

    .dp-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }

    .dp-tag i { font-size: 11px; color: #f5b800; }

    .dp-title {
        font-size: clamp(26px, 3.4vw, 42px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .dp-accent { color: #f5b800; }

    .dp-subtitle {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.85;
        margin: 0;
    }

    .dp-dept-grid {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        gap: 16px;
    }

    .dp-dept-card {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.08);
        padding: 20px 16px;
        transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
    }

    .dp-dept-card:hover {
        transform: translateY(-3px);
        border-color: rgba(245,184,0,0.35);
        box-shadow: 0 22px 64px rgba(13, 27, 94, 0.12);
    }

    .dp-dept-icon {
        width: 56px;
        height: 56px;
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, rgba(13,27,94,0.22), rgba(245,184,0,0.10));
        border: 1px solid rgba(13, 27, 94, 0.16);
        margin-bottom: 12px;
    }

    .dp-dept-icon i { font-size: 22px; color: #f5b800; }

    .dp-dept-title {
        margin: 0 0 8px;
        color: #0d1b5e;
        font-weight: 1000;
        font-size: 17px;
    }

    .dp-dept-text {
        margin: 0 0 14px;
        color: #475569;
        font-size: 13.5px;
        line-height: 1.7;
        font-weight: 750;
    }

    .dp-dept-link {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        color: #0d1b5e;
        font-weight: 900;
        font-size: 13.5px;
        text-decoration: none;
        transition: color 0.2s, transform 0.2s;
    }

    .dp-dept-link:hover {
        color: #f5b800;
        transform: translateX(3px);
    }

    .dp-focus-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 16px;
    }

    .dp-focus-card {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 18px 55px rgba(13, 27, 94, 0.06);
        padding: 22px 18px;
    }

    .dp-focus-icon {
        width: 52px;
        height: 52px;
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(245,184,0,0.14);
        border: 1px solid rgba(245,184,0,0.35);
        margin-bottom: 12px;
    }

    .dp-focus-icon i { font-size: 20px; color: #0d1b5e; }

    .dp-focus-title {
        margin: 0 0 8px;
        color: #0d1b5e;
        font-weight: 900;
        font-size: 17px;
    }

    .dp-focus-text {
        margin: 0;
        color: #475569;
        font-size: 14px;
        line-height: 1.75;
        font-weight: 750;
    }

    .dp-cta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 26px 24px;
        border-radius: 22px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border: 1px solid rgba(245,184,0,0.22);
        flex-wrap: wrap;
    }

    .dp-cta-title {
        margin: 0 0 8px;
        color: #ffffff;
        font-weight: 1000;
        font-size: 22px;
    }

    .dp-cta-sub {
        margin: 0;
        color: rgba(255,255,255,0.78);
        line-height: 1.75;
        font-size: 14px;
        max-width: 520px;
    }

    .dp-cta-actions {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
    }

    .dp-cta-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 14px;
        padding: 13px 18px;
        font-weight: 1000;
        font-size: 14px;
        text-decoration: none;
        border: 1px solid transparent;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s, background 0.2s, border-color 0.2s;
    }

    .dp-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.26);
    }

    .dp-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 18px 44px rgba(245, 184, 0, 0.34);
        filter: brightness(1.02);
    }

    .dp-cta-btn--outline {
        background: rgba(255,255,255,0.06);
        color: #ffffff;
        border-color: rgba(255,255,255,0.22);
    }

    .dp-cta-btn--outline:hover {
        transform: translateY(-2px);
        background: rgba(255,255,255,0.10);
        border-color: rgba(255,255,255,0.32);
    }

    @media (max-width: 991px) {
        .dp-dept-grid { grid-template-columns: repeat(2, 1fr); }
        .dp-focus-grid { grid-template-columns: 1fr; }
        .dp-cta { flex-direction: column; align-items: flex-start; }
        .dp-cta-actions { width: 100%; }
    }

    @media (max-width: 767px) {
        .dp-container { padding: 0 18px; }
        .dp-section { padding: 56px 0 0; }
        .dp-dept-section { padding-bottom: 48px; }
        .dp-focus-section { padding: 48px 0 64px; }
        .dp-cta-section { padding-bottom: 70px; }
        .dp-dept-grid { grid-template-columns: 1fr; }
        .dp-cta-actions { flex-direction: column; width: 100%; }
        .dp-cta-btn { width: 100%; }
    }

    /* ================================================================
    PLACEMENT PAGE
    ================================================================ */
    .pl-section {
        padding: 72px 0;
    }

    .pl-section--intro {
        background: linear-gradient(180deg, #ffffff 0%, #f4f6ff 100%);
        padding-top: 56px;
    }

    .pl-section--services {
        background: #ffffff;
    }

    .pl-section--process {
        background: linear-gradient(180deg, #f8faff 0%, #ffffff 50%, #f4f6ff 100%);
    }

    .pl-section--stats {
        padding: 48px 0;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 55%, #152a6e 100%);
    }

    .pl-section--sectors {
        background: #ffffff;
    }

    .pl-section--cta {
        padding: 0 0 90px;
        background: linear-gradient(180deg, #f4f6ff 0%, #ffffff 100%);
    }

    .pl-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }

    .pl-header,
    .pl-section-header {
        text-align: center;
        max-width: 860px;
        margin: 0 auto 40px;
    }

    .pl-section-header--left {
        text-align: left;
        margin-left: 0;
        margin-right: 0;
    }

    .pl-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13, 27, 94, 0.07);
        border: 1px solid rgba(13, 27, 94, 0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }

    .pl-tag i { font-size: 11px; color: #f5b800; }

    .pl-title {
        font-size: clamp(26px, 3.2vw, 40px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .pl-accent { color: #f5b800; }

    .pl-subtitle {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.85;
        margin: 0;
    }

    .pl-intro-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 18px;
    }

    .pl-intro-card {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        box-shadow: 0 16px 48px rgba(13, 27, 94, 0.07);
        padding: 24px 20px;
        transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
    }

    .pl-intro-card:hover {
        transform: translateY(-4px);
        border-color: rgba(245, 184, 0, 0.35);
        box-shadow: 0 22px 56px rgba(13, 27, 94, 0.11);
    }

    .pl-intro-icon {
        width: 52px;
        height: 52px;
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 14px;
        background: linear-gradient(135deg, rgba(13, 27, 94, 0.18), rgba(245, 184, 0, 0.12));
        border: 1px solid rgba(13, 27, 94, 0.14);
    }

    .pl-intro-icon i { font-size: 21px; color: #f5b800; }

    .pl-intro-card-title {
        margin: 0 0 8px;
        font-size: 17px;
        font-weight: 900;
        color: #0d1b5e;
    }

    .pl-intro-card-text {
        margin: 0;
        font-size: 14px;
        line-height: 1.75;
        color: #475569;
        font-weight: 650;
    }

    .pl-services-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 18px;
    }

    .pl-service-card {
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        padding: 22px 20px;
        box-shadow: 0 14px 42px rgba(13, 27, 94, 0.06);
        transition: border-color 0.2s, box-shadow 0.2s;
    }

    .pl-service-card:hover {
        border-color: rgba(13, 27, 94, 0.18);
        box-shadow: 0 18px 50px rgba(13, 27, 94, 0.09);
    }

    .pl-service-icon {
        width: 48px;
        height: 48px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(245, 184, 0, 0.14);
        border: 1px solid rgba(245, 184, 0, 0.28);
        margin-bottom: 12px;
    }

    .pl-service-icon i { font-size: 19px; color: #0d1b5e; }

    .pl-service-title {
        margin: 0 0 8px;
        font-size: 17px;
        font-weight: 900;
        color: #0d1b5e;
    }

    .pl-service-text {
        margin: 0;
        font-size: 13.5px;
        line-height: 1.7;
        color: #475569;
        font-weight: 650;
    }

    .pl-process-list {
        list-style: none;
        margin: 0;
        padding: 0;
        max-width: 900px;
        margin-left: auto;
        margin-right: auto;
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

    .pl-process-step {
        display: flex;
        align-items: flex-start;
        gap: 18px;
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        padding: 22px 22px;
        box-shadow: 0 12px 36px rgba(13, 27, 94, 0.05);
    }

    .pl-process-num {
        flex-shrink: 0;
        width: 44px;
        height: 44px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 900;
        font-size: 16px;
        color: #0b1027;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        border: 1px solid rgba(0, 0, 0, 0.06);
        box-shadow: 0 8px 20px rgba(245, 184, 0, 0.22);
    }

    .pl-process-body { flex: 1; min-width: 0; }

    .pl-process-title {
        margin: 0 0 6px;
        font-size: 17px;
        font-weight: 900;
        color: #0d1b5e;
    }

    .pl-process-text {
        margin: 0;
        font-size: 14px;
        line-height: 1.75;
        color: #5a6782;
    }

    .pl-stats-banner {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 16px;
        align-items: stretch;
    }

    .pl-stats-item {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 16px 14px;
        border-radius: 16px;
        background: rgba(255, 255, 255, 0.08);
        border: 1px solid rgba(245, 184, 0, 0.22);
    }

    .pl-stats-icon {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(245, 184, 0, 0.16);
        color: #f5b800;
        flex-shrink: 0;
    }

    .pl-stats-icon i { font-size: 18px; }

    .pl-stats-label {
        font-size: 13.5px;
        font-weight: 800;
        color: #ffffff;
        line-height: 1.4;
    }

    .pl-sectors-split {
        display: grid;
        grid-template-columns: 1.15fr 0.85fr;
        gap: 28px;
        align-items: start;
    }

    .pl-sectors-content .pl-subtitle {
        max-width: none;
    }

    .pl-sector-tags {
        list-style: none;
        margin: 20px 0 0;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .pl-sector-tags li {
        display: inline-flex;
        align-items: center;
        padding: 8px 14px;
        border-radius: 50px;
        font-size: 13px;
        font-weight: 800;
        color: #0d1b5e;
        background: rgba(13, 27, 94, 0.06);
        border: 1px solid rgba(13, 27, 94, 0.10);
    }

    .pl-sectors-aside { position: relative; }

    .pl-aside-card {
        background: linear-gradient(180deg, #f8f9ff 0%, #ffffff 100%);
        border: 1px solid rgba(13, 27, 94, 0.10);
        border-radius: 18px;
        padding: 24px 22px;
        box-shadow: 0 16px 44px rgba(13, 27, 94, 0.07);
    }

    .pl-aside-title {
        margin: 0 0 14px;
        font-size: 17px;
        font-weight: 900;
        color: #0d1b5e;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .pl-aside-title i { color: #f5b800; font-size: 18px; }

    .pl-aside-list {
        margin: 0;
        padding-left: 1.15rem;
        color: #475569;
        font-size: 14px;
        line-height: 1.85;
    }

    .pl-cta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 26px 24px;
        border-radius: 22px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border: 1px solid rgba(245, 184, 0, 0.22);
        flex-wrap: wrap;
    }

    .pl-cta-title {
        margin: 0 0 8px;
        color: #ffffff;
        font-weight: 1000;
        font-size: 22px;
    }

    .pl-cta-sub {
        margin: 0;
        color: rgba(255, 255, 255, 0.78);
        line-height: 1.75;
        font-size: 14px;
        max-width: 520px;
    }

    .pl-cta-actions {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
    }

    .pl-cta-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 14px;
        padding: 13px 18px;
        font-weight: 1000;
        font-size: 14px;
        text-decoration: none;
        border: 1px solid transparent;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s, background 0.2s, border-color 0.2s;
    }

    .pl-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        box-shadow: 0 14px 34px rgba(245, 184, 0, 0.26);
    }

    .pl-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 18px 44px rgba(245, 184, 0, 0.34);
        filter: brightness(1.02);
    }

    .pl-cta-btn--outline {
        background: rgba(255, 255, 255, 0.06);
        color: #ffffff;
        border-color: rgba(255, 255, 255, 0.22);
    }

    .pl-cta-btn--outline:hover {
        transform: translateY(-2px);
        background: rgba(255, 255, 255, 0.10);
        border-color: rgba(255, 255, 255, 0.32);
    }

    @media (max-width: 991px) {
        .pl-intro-grid { grid-template-columns: 1fr; }
        .pl-services-grid { grid-template-columns: repeat(2, 1fr); }
        .pl-stats-banner { grid-template-columns: repeat(2, 1fr); }
        .pl-sectors-split { grid-template-columns: 1fr; }
        .pl-cta { flex-direction: column; align-items: flex-start; }
        .pl-cta-actions { width: 100%; }
    }

    @media (max-width: 767px) {
        .pl-container { padding: 0 18px; }
        .pl-section { padding: 48px 0; }
        .pl-section--intro { padding-top: 40px; }
        .pl-section--stats { padding: 36px 0; }
        .pl-section--cta { padding-bottom: 70px; }
        .pl-services-grid { grid-template-columns: 1fr; }
        .pl-stats-banner { grid-template-columns: 1fr; }
        .pl-stats-item { flex-direction: column; align-items: flex-start; text-align: left; }
        .pl-cta-actions { flex-direction: column; width: 100%; }
        .pl-cta-btn { width: 100%; }
    }

    /* ================================================================
    OUR RECRUITERS PAGE  (rec-*)
    Colors: #0d1b5e (navy), #1a2f8a (blue), #f5b800 (gold), #e84118 (red)
    ================================================================ */

    /* ---- Layout ---- */
    .rec-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 32px;
    }

    /* ---- Section base ---- */
    .rec-section {
        padding: 72px 0;
    }

    .rec-section--intro {
        background: #ffffff;
    }

    .rec-section--companies {
        background: #f4f6f9;
    }

    .rec-section--sectors {
        background: #ffffff;
    }

    .rec-section--process {
        background: linear-gradient(160deg, #f0f3ff 0%, #f9fafe 100%);
    }

    .rec-section--partner {
        background: #ffffff;
    }

    .rec-section--cta {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 60%, #2a3f9e 100%);
        padding: 70px 0;
    }

    /* ---- Tag pill ---- */
    .rec-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.8px;
        margin-bottom: 14px;
    }

    .rec-tag i {
        font-size: 11px;
        color: #f5b800;
    }

    /* ---- Titles ---- */
    .rec-title {
        font-size: clamp(22px, 3vw, 32px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
        margin-bottom: 16px;
    }

    .rec-accent {
        color: #f5b800;
    }

    .rec-subtitle,
    .rec-intro-text {
        font-size: 15px;
        color: #4b5563;
        line-height: 1.8;
        max-width: 700px;
        margin-bottom: 14px;
    }

    /* ---- Section Header (centred) ---- */
    .rec-section-header {
        text-align: center;
        margin-bottom: 50px;
    }

    .rec-section-header .rec-subtitle {
        margin: 0 auto;
    }

    /* ================================================================
    INTRO SECTION
    ================================================================ */
    .rec-intro-grid {
        display: grid;
        grid-template-columns: 1fr 340px;
        gap: 60px;
        align-items: start;
    }

    .rec-intro-content .rec-tag {
        display: inline-flex;
    }

    .rec-intro-highlights {
        display: flex;
        flex-direction: column;
        gap: 12px;
        margin-top: 24px;
    }

    .rec-highlight-item {
        display: flex;
        align-items: center;
        gap: 12px;
        font-size: 14px;
        font-weight: 600;
        color: #1e293b;
    }

    .rec-highlight-item i {
        color: #f5b800;
        font-size: 16px;
        flex-shrink: 0;
    }

    /* Stats panel */
    .rec-intro-stats {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }

    .rec-stat-card {
        background: #ffffff;
        border: 1px solid #e5eaf5;
        border-radius: 16px;
        padding: 24px 18px;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 8px;
        box-shadow: 0 4px 18px rgba(13,27,94,0.07);
        transition: transform 0.25s ease, box-shadow 0.25s ease;
    }

    .rec-stat-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 10px 30px rgba(13,27,94,0.12);
    }

    .rec-stat-icon {
        width: 48px;
        height: 48px;
        border-radius: 12px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 18px;
        flex-shrink: 0;
    }

    .rec-stat-num {
        font-size: 26px;
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1;
    }

    .rec-stat-num sup {
        font-size: 14px;
        font-weight: 700;
        color: #f5b800;
        vertical-align: super;
    }

    .rec-stat-label {
        font-size: 12px;
        font-weight: 600;
        color: #6b7280;
        text-align: center;
        line-height: 1.4;
    }

    /* ================================================================
    COMPANY CARDS GRID
    ================================================================ */
    .rec-companies-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
        gap: 20px;
    }

    .rec-company-card {
        background: #ffffff;
        border: 1px solid #e5eaf5;
        border-radius: 16px;
        padding: 22px 20px;
        display: flex;
        align-items: center;
        gap: 16px;
        box-shadow: 0 4px 16px rgba(13,27,94,0.06);
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
        position: relative;
        overflow: hidden;
    }

    .rec-company-card::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 4px;
        height: 100%;
        background: linear-gradient(180deg, #f5b800, #e07b00);
        transform: scaleY(0);
        transform-origin: bottom;
        transition: transform 0.3s ease;
        border-radius: 0 0 0 0;
    }

    .rec-company-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 36px rgba(13,27,94,0.13);
        border-color: #c0caf5;
    }

    .rec-company-card:hover::before {
        transform: scaleY(1);
    }

    .rec-company-logo-wrap {
        width: 50px;
        height: 50px;
        border-radius: 12px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 20px;
        flex-shrink: 0;
        transition: background 0.25s ease;
    }

    .rec-company-logo-wrap img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        background: #ffffff;
        border-radius: 12px;
        padding: 6px;
        display: block;
    }

    .rec-company-card:hover .rec-company-logo-wrap {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
    }

    .rec-company-info {
        flex: 1;
        min-width: 0;
    }

    .rec-company-name {
        font-size: 14px;
        font-weight: 700;
        color: #0d1b5e;
        margin-bottom: 4px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .rec-company-sector {
        font-size: 11px;
        font-weight: 500;
        color: #6b7280;
    }

    /* Badge */
    .rec-company-badge {
        flex-shrink: 0;
        font-size: 10px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        padding: 4px 9px;
        border-radius: 20px;
        background: rgba(13,27,94,0.08);
        color: #0d1b5e;
    }

    .rec-company-badge--ngo {
        background: rgba(34,197,94,0.12);
        color: #15803d;
    }

    .rec-company-badge--govt {
        background: rgba(232,65,24,0.1);
        color: #b91c1c;
    }

    /* ================================================================
    SECTOR CARDS
    ================================================================ */
    .rec-sectors-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

    .rec-sector-card {
        background: #ffffff;
        border: 1px solid #e5eaf5;
        border-radius: 20px;
        padding: 32px 28px;
        text-align: center;
        box-shadow: 0 4px 18px rgba(13,27,94,0.06);
        transition: transform 0.25s ease, box-shadow 0.25s ease;
    }

    .rec-sector-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 16px 40px rgba(13,27,94,0.12);
    }

    .rec-sector-icon {
        width: 64px;
        height: 64px;
        border-radius: 18px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 24px;
        margin: 0 auto 18px;
        transition: background 0.3s ease, transform 0.3s ease;
    }

    .rec-sector-card:hover .rec-sector-icon {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        transform: scale(1.1) rotate(-5deg);
    }

    .rec-sector-name {
        font-size: 15px;
        font-weight: 700;
        color: #0d1b5e;
        margin-bottom: 10px;
    }

    .rec-sector-desc {
        font-size: 13px;
        color: #6b7280;
        line-height: 1.7;
    }

    /* ================================================================
    RECRUITMENT PROCESS TRACK
    ================================================================ */
    .rec-process-track {
        display: flex;
        flex-direction: column;
        gap: 0;
        max-width: 780px;
        margin: 0 auto;
    }

    .rec-process-step {
        display: flex;
        align-items: flex-start;
        gap: 28px;
    }

    .rec-process-connector {
        width: 2px;
        height: 40px;
        background: linear-gradient(180deg, #f5b800, rgba(245,184,0,0.2));
        margin-left: 37px;
    }

    .rec-process-circle {
        position: relative;
        width: 76px;
        height: 76px;
        border-radius: 50%;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 22px;
        flex-shrink: 0;
        box-shadow: 0 6px 20px rgba(13,27,94,0.25);
        transition: transform 0.3s ease;
    }

    .rec-process-step:hover .rec-process-circle {
        transform: scale(1.07);
    }

    .rec-process-num {
        position: absolute;
        top: -8px;
        right: -8px;
        width: 24px;
        height: 24px;
        border-radius: 50%;
        background: #f5b800;
        color: #0d1b5e;
        font-size: 10px;
        font-weight: 900;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .rec-process-body {
        padding-top: 10px;
        padding-bottom: 16px;
    }

    .rec-process-title {
        font-size: 17px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 8px;
    }

    .rec-process-text {
        font-size: 14px;
        color: #4b5563;
        line-height: 1.8;
        max-width: 560px;
    }

    /* ================================================================
    PARTNER WITH US
    ================================================================ */
    .rec-partner-split {
        display: grid;
        grid-template-columns: 1fr 380px;
        gap: 60px;
        align-items: start;
    }

    .rec-partner-text {
        font-size: 15px;
        color: #4b5563;
        line-height: 1.8;
        margin-bottom: 24px;
    }

    .rec-partner-benefits {
        list-style: none;
        padding: 0;
        margin: 0 0 32px;
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    .rec-partner-benefits li {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        font-size: 14px;
        color: #1e293b;
        line-height: 1.6;
    }

    .rec-partner-benefits li i {
        color: #f5b800;
        font-size: 14px;
        margin-top: 2px;
        flex-shrink: 0;
    }

    .rec-partner-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        color: #f5b800;
        font-size: 14px;
        font-weight: 700;
        padding: 14px 30px;
        border-radius: 50px;
        text-decoration: none;
        letter-spacing: 0.4px;
        transition: background 0.3s ease, transform 0.25s ease, box-shadow 0.25s ease;
        box-shadow: 0 6px 20px rgba(13,27,94,0.2);
    }

    .rec-partner-btn:hover {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        transform: translateY(-2px);
        box-shadow: 0 10px 28px rgba(245,184,0,0.3);
    }

    /* Contact card */
    .rec-contact-card {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 20px;
        overflow: hidden;
        box-shadow: 0 12px 40px rgba(13,27,94,0.22);
    }

    .rec-contact-card-header {
        background: rgba(245,184,0,0.12);
        padding: 18px 24px;
        display: flex;
        align-items: center;
        gap: 12px;
        border-bottom: 1px solid rgba(255,255,255,0.1);
    }

    .rec-contact-card-header i {
        font-size: 22px;
        color: #f5b800;
    }

    .rec-contact-card-header span {
        font-size: 14px;
        font-weight: 800;
        color: #ffffff;
        text-transform: uppercase;
        letter-spacing: 1px;
    }

    .rec-contact-list {
        list-style: none;
        padding: 20px 24px;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .rec-contact-list li {
        display: flex;
        align-items: flex-start;
        gap: 14px;
    }

    .rec-contact-list li > i {
        color: #f5b800;
        font-size: 16px;
        margin-top: 2px;
        flex-shrink: 0;
        width: 18px;
        text-align: center;
    }

    .rec-contact-list li > div {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .rec-contact-list li strong {
        font-size: 11px;
        font-weight: 700;
        color: rgba(255,255,255,0.5);
        text-transform: uppercase;
        letter-spacing: 0.8px;
    }

    .rec-contact-list li span,
    .rec-contact-list li a {
        font-size: 14px;
        color: #dce8ff;
        text-decoration: none;
        transition: color 0.2s;
    }

    .rec-contact-list li a:hover {
        color: #f5b800;
    }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .rec-cta-banner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 40px;
    }

    .rec-cta-title {
        font-size: clamp(20px, 3vw, 28px);
        font-weight: 800;
        color: #ffffff;
        margin-bottom: 10px;
    }

    .rec-cta-sub {
        font-size: 15px;
        color: rgba(220,232,255,0.85);
        line-height: 1.7;
        max-width: 520px;
    }

    .rec-cta-actions {
        display: flex;
        gap: 14px;
        flex-shrink: 0;
        flex-wrap: wrap;
    }

    .rec-cta-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        font-size: 14px;
        font-weight: 700;
        padding: 14px 28px;
        border-radius: 50px;
        text-decoration: none;
        letter-spacing: 0.4px;
        transition: background 0.3s ease, color 0.3s ease, transform 0.25s ease, box-shadow 0.25s ease;
        white-space: nowrap;
    }

    .rec-cta-btn--primary {
        background: #f5b800;
        color: #0d1b5e;
        box-shadow: 0 6px 20px rgba(245,184,0,0.35);
    }

    .rec-cta-btn--primary:hover {
        background: #e5a800;
        transform: translateY(-2px);
        box-shadow: 0 10px 28px rgba(245,184,0,0.45);
    }

    .rec-cta-btn--outline {
        background: transparent;
        color: #ffffff;
        border: 2px solid rgba(255,255,255,0.4);
    }

    .rec-cta-btn--outline:hover {
        background: rgba(255,255,255,0.1);
        border-color: rgba(255,255,255,0.8);
        transform: translateY(-2px);
    }

    /* ================================================================
    RESPONSIVE — TABLET (≤1024px)
    ================================================================ */
    @media (max-width: 1024px) {
        .rec-intro-grid {
            grid-template-columns: 1fr;
            gap: 40px;
        }

        .rec-intro-stats {
            grid-template-columns: repeat(4, 1fr);
        }

        .rec-sectors-grid {
            grid-template-columns: repeat(2, 1fr);
        }

        .rec-partner-split {
            grid-template-columns: 1fr;
            gap: 40px;
        }
    }

    /* ================================================================
    RESPONSIVE — MOBILE (≤768px)
    ================================================================ */
    @media (max-width: 768px) {
        .rec-container {
            padding: 0 18px;
        }

        .rec-section {
            padding: 48px 0;
        }

        .rec-section--cta {
            padding: 52px 0;
        }

        .rec-intro-stats {
            grid-template-columns: 1fr 1fr;
        }

        .rec-companies-grid {
            grid-template-columns: 1fr;
        }

        .rec-sectors-grid {
            grid-template-columns: 1fr;
        }

        .rec-process-connector {
            margin-left: 33px;
        }

        .rec-process-circle {
            width: 68px;
            height: 68px;
            font-size: 18px;
        }

        .rec-cta-banner {
            flex-direction: column;
            align-items: flex-start;
            gap: 28px;
        }

        .rec-cta-actions {
            flex-direction: column;
            width: 100%;
        }

        .rec-cta-btn {
            width: 100%;
            justify-content: center;
        }

        .rec-partner-btn {
            width: 100%;
            justify-content: center;
        }
    }

    /* ================================================================
    RESPONSIVE — SMALL MOBILE (≤480px)
    ================================================================ */
    @media (max-width: 480px) {
        .rec-intro-stats {
            grid-template-columns: 1fr 1fr;
        }

        .rec-stat-card {
            padding: 18px 12px;
        }

        .rec-stat-num {
            font-size: 22px;
        }

        .rec-company-card {
            flex-wrap: wrap;
        }

        .rec-process-step {
            gap: 18px;
        }

        .rec-process-circle {
            width: 58px;
            height: 58px;
            font-size: 16px;
        }

        .rec-process-connector {
            margin-left: 28px;
        }
    }

    /* ================================================================
    MOCK RESULT PAGE  (mr-*)
    Colors: #0d1b5e (navy) · #1a2f8a (blue) · #f5b800 (gold) · #e84118 (red)
    ================================================================ */

    /* ---- Layout ---- */
    .mr-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 32px;
    }

    /* ---- Section base ---- */
    .mr-section {
        padding: 72px 0;
    }

    .mr-section--intro      { background: #ffffff; }
    .mr-section--categories { background: #f4f6f9; }
    .mr-section--results    { background: #ffffff; }
    .mr-section--improve    { background: linear-gradient(160deg, #f0f3ff 0%, #f9fafe 100%); }
    .mr-section--schedule   { background: #ffffff; }
    .mr-section--faq        { background: #f4f6f9; }
    .mr-section--cta {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 60%, #2a3f9e 100%);
        padding: 70px 0;
    }

    /* ---- Tag pill ---- */
    .mr-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.8px;
        margin-bottom: 14px;
    }

    .mr-tag i { font-size: 11px; color: #f5b800; }

    /* ---- Titles ---- */
    .mr-title {
        font-size: clamp(22px, 3vw, 32px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
        margin-bottom: 16px;
    }

    .mr-accent { color: #f5b800; }

    .mr-subtitle,
    .mr-intro-text {
        font-size: 15px;
        color: #4b5563;
        line-height: 1.8;
        max-width: 700px;
        margin-bottom: 14px;
    }

    /* ---- Section Header (centred) ---- */
    .mr-section-header {
        text-align: center;
        margin-bottom: 50px;
    }

    .mr-section-header .mr-subtitle { margin: 0 auto; }

    /* ================================================================
    INTRO SECTION
    ================================================================ */
    .mr-intro-grid {
        display: grid;
        grid-template-columns: 1fr 320px;
        gap: 60px;
        align-items: start;
    }

    .mr-intro-features {
        display: flex;
        flex-direction: column;
        gap: 16px;
        margin-top: 28px;
    }

    .mr-feature-item {
        display: flex;
        align-items: flex-start;
        gap: 16px;
        background: #f8faff;
        border: 1px solid #e5eaf5;
        border-radius: 12px;
        padding: 14px 18px;
        transition: box-shadow 0.25s ease, transform 0.25s ease;
    }

    .mr-feature-item:hover {
        box-shadow: 0 6px 20px rgba(13,27,94,0.08);
        transform: translateX(4px);
    }

    .mr-feature-icon {
        width: 42px;
        height: 42px;
        border-radius: 10px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 16px;
        flex-shrink: 0;
    }

    .mr-feature-body {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .mr-feature-body strong {
        font-size: 14px;
        font-weight: 700;
        color: #0d1b5e;
    }

    .mr-feature-body span {
        font-size: 12px;
        color: #6b7280;
    }

    /* Aside card */
    .mr-aside-card {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 20px;
        overflow: hidden;
        box-shadow: 0 12px 40px rgba(13,27,94,0.22);
        position: sticky;
        top: 100px;
    }

    .mr-aside-header {
        background: rgba(245,184,0,0.12);
        padding: 16px 24px;
        display: flex;
        align-items: center;
        gap: 12px;
        border-bottom: 1px solid rgba(255,255,255,0.1);
    }

    .mr-aside-header i  { font-size: 20px; color: #f5b800; }
    .mr-aside-header span {
        font-size: 13px;
        font-weight: 800;
        color: #ffffff;
        text-transform: uppercase;
        letter-spacing: 1px;
    }

    .mr-aside-stat-list {
        list-style: none;
        padding: 20px 24px;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .mr-aside-stat-list li {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 14px 0;
        border-bottom: 1px solid rgba(255,255,255,0.07);
    }

    .mr-aside-stat-list li:last-child { border-bottom: none; }

    .mr-aside-stat-num {
        font-size: 22px;
        font-weight: 900;
        color: #f5b800;
        line-height: 1;
    }

    .mr-aside-stat-num sup {
        font-size: 12px;
        vertical-align: super;
        color: #f5b800;
    }

    .mr-aside-stat-label {
        font-size: 13px;
        color: #dce8ff;
        text-align: right;
        max-width: 160px;
        line-height: 1.4;
    }

    /* ================================================================
    CATEGORY CARDS
    ================================================================ */
    .mr-categories-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

    .mr-category-card {
        background: #ffffff;
        border-radius: 20px;
        overflow: hidden;
        border: 1px solid #e5eaf5;
        box-shadow: 0 4px 18px rgba(13,27,94,0.06);
        transition: transform 0.25s ease, box-shadow 0.25s ease;
        display: flex;
        flex-direction: column;
    }

    .mr-category-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 16px 44px rgba(13,27,94,0.13);
    }

    .mr-category-header {
        padding: 28px 24px 20px;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
    }

    .mr-category-card--aptitude .mr-category-header  { background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%); }
    .mr-category-card--gd .mr-category-header         { background: linear-gradient(135deg, #1a4a6e 0%, #1a6e9e 100%); }
    .mr-category-card--interview .mr-category-header  { background: linear-gradient(135deg, #2a1a5e 0%, #4a1a8a 100%); }

    .mr-category-icon-wrap {
        width: 54px;
        height: 54px;
        border-radius: 14px;
        background: rgba(245,184,0,0.15);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 22px;
    }

    .mr-category-badge {
        font-size: 10px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        padding: 5px 12px;
        border-radius: 20px;
        background: rgba(255,255,255,0.15);
        color: #ffffff;
        white-space: nowrap;
    }

    .mr-category-body {
        padding: 20px 24px 24px;
        display: flex;
        flex-direction: column;
        flex: 1;
    }

    .mr-category-title {
        font-size: 17px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 10px;
    }

    .mr-category-desc {
        font-size: 13px;
        color: #4b5563;
        line-height: 1.7;
        margin-bottom: 18px;
    }

    .mr-category-topics {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-top: auto;
    }

    .mr-category-topics li {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 13px;
        font-weight: 600;
        color: #374151;
    }

    .mr-category-topics li i {
        color: #f5b800;
        font-size: 8px;
        flex-shrink: 0;
    }

    /* ================================================================
    RESULTS TABLE
    ================================================================ */
    .mr-table-wrap {
        overflow-x: auto;
        border-radius: 16px;
        box-shadow: 0 4px 24px rgba(13,27,94,0.08);
        border: 1px solid #e5eaf5;
        margin-bottom: 20px;
    }

    .mr-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 14px;
        min-width: 700px;
    }

    .mr-table-caption {
        text-align: left;
        font-size: 12px;
        color: #9ca3af;
        padding: 10px 20px;
        caption-side: bottom;
    }

    .mr-table thead tr {
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
    }

    .mr-table thead th {
        color: #f5b800;
        font-size: 11px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.8px;
        padding: 16px 18px;
        text-align: left;
        white-space: nowrap;
    }

    .mr-table tbody tr {
        border-bottom: 1px solid #f0f3fa;
        transition: background 0.2s ease;
    }

    .mr-table tbody tr:last-child { border-bottom: none; }

    .mr-table tbody tr:hover { background: #f8faff; }

    .mr-table tbody td {
        padding: 14px 18px;
        color: #374151;
        vertical-align: middle;
    }

    /* Round pill */
    .mr-round-pill {
        display: inline-block;
        font-size: 11px;
        font-weight: 800;
        padding: 4px 12px;
        border-radius: 20px;
        background: rgba(13,27,94,0.08);
        color: #0d1b5e;
        white-space: nowrap;
    }

    .mr-round-pill--new {
        background: rgba(245,184,0,0.18);
        color: #92610a;
    }

    /* Score badges */
    .mr-score {
        font-weight: 700;
        font-size: 13px;
        color: #374151;
    }

    .mr-score--mid  { color: #1d4ed8; }
    .mr-score--high { color: #15803d; }

    /* Status badges */
    .mr-status {
        display: inline-block;
        font-size: 11px;
        font-weight: 700;
        padding: 4px 12px;
        border-radius: 20px;
        white-space: nowrap;
    }

    .mr-status--done {
        background: rgba(21,128,61,0.1);
        color: #15803d;
    }

    .mr-status--upcoming {
        background: rgba(245,184,0,0.15);
        color: #92610a;
    }

    .mr-table-note {
        font-size: 13px;
        color: #6b7280;
        display: flex;
        align-items: flex-start;
        gap: 8px;
        line-height: 1.6;
    }

    .mr-table-note i { color: #1a2f8a; margin-top: 2px; flex-shrink: 0; }
    .mr-table-note a { color: #1a2f8a; font-weight: 600; text-decoration: underline; }
    .mr-table-note a:hover { color: #f5b800; }

    /* ================================================================
    IMPROVE SECTION
    ================================================================ */
    .mr-improve-split {
        display: grid;
        grid-template-columns: 1fr 360px;
        gap: 60px;
        align-items: start;
    }

    .mr-improve-text {
        font-size: 15px;
        color: #4b5563;
        line-height: 1.8;
        margin-bottom: 32px;
    }

    .mr-improve-steps {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 4px;
    }

    .mr-improve-step {
        display: flex;
        align-items: flex-start;
        gap: 22px;
        padding: 20px 0;
        border-bottom: 1px dashed #e5eaf5;
    }

    .mr-improve-step:last-child { border-bottom: none; }

    .mr-step-num {
        font-size: 28px;
        font-weight: 900;
        color: #e5eaf5;
        line-height: 1;
        flex-shrink: 0;
        width: 48px;
        text-align: right;
        letter-spacing: -1px;
        font-style: italic;
        transition: color 0.25s ease;
    }

    .mr-improve-step:hover .mr-step-num { color: #f5b800; }

    .mr-step-body { flex: 1; }

    .mr-step-title {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 6px;
    }

    .mr-step-text {
        font-size: 13px;
        color: #4b5563;
        line-height: 1.7;
    }

    /* Tips card */
    .mr-tips-card {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 20px;
        overflow: hidden;
        box-shadow: 0 12px 40px rgba(13,27,94,0.22);
        position: sticky;
        top: 100px;
    }

    .mr-tips-header {
        background: rgba(245,184,0,0.12);
        padding: 16px 22px;
        display: flex;
        align-items: center;
        gap: 10px;
        border-bottom: 1px solid rgba(255,255,255,0.1);
    }

    .mr-tips-header i    { font-size: 18px; color: #f5b800; }
    .mr-tips-header span {
        font-size: 13px;
        font-weight: 800;
        color: #ffffff;
        text-transform: uppercase;
        letter-spacing: 1px;
    }

    .mr-tips-list {
        list-style: none;
        padding: 18px 22px;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    .mr-tips-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13px;
        color: #dce8ff;
        line-height: 1.6;
    }

    .mr-tips-list li i { color: #f5b800; font-size: 13px; margin-top: 2px; flex-shrink: 0; }

    .mr-tips-divider {
        height: 1px;
        background: rgba(255,255,255,0.1);
        margin: 0 22px;
    }

    .mr-tips-contact { padding: 18px 22px; }

    .mr-tips-contact-label {
        font-size: 11px;
        font-weight: 700;
        color: rgba(255,255,255,0.5);
        text-transform: uppercase;
        letter-spacing: 0.8px;
        margin-bottom: 10px;
    }

    .mr-tips-contact-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        font-weight: 600;
        color: #f5b800;
        text-decoration: none;
        transition: color 0.2s;
        word-break: break-all;
    }

    .mr-tips-contact-btn:hover { color: #ffffff; }

    /* ================================================================
    SCHEDULE CARDS
    ================================================================ */
    .mr-schedule-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .mr-schedule-card {
        background: #ffffff;
        border: 1px solid #e5eaf5;
        border-radius: 16px;
        padding: 22px 24px;
        display: grid;
        grid-template-columns: 80px 1fr auto;
        align-items: center;
        gap: 20px;
        box-shadow: 0 4px 16px rgba(13,27,94,0.06);
        transition: transform 0.25s ease, box-shadow 0.25s ease;
    }

    .mr-schedule-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 34px rgba(13,27,94,0.11);
    }

    .mr-schedule-date {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        border-radius: 12px;
        padding: 10px 6px;
        min-width: 72px;
    }

    .mr-schedule-day {
        font-size: 26px;
        font-weight: 900;
        color: #f5b800;
        line-height: 1;
    }

    .mr-schedule-month {
        font-size: 10px;
        font-weight: 700;
        color: rgba(255,255,255,0.75);
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin-top: 4px;
    }

    .mr-schedule-title {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 6px;
    }

    .mr-schedule-meta,
    .mr-schedule-venue {
        font-size: 12px;
        color: #6b7280;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 4px;
        line-height: 1.6;
        margin-bottom: 3px;
    }

    .mr-schedule-meta i,
    .mr-schedule-venue i {
        color: #1a2f8a;
        font-size: 11px;
    }

    /* Status badges */
    .mr-schedule-status {
        font-size: 10px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        padding: 5px 12px;
        border-radius: 20px;
        white-space: nowrap;
        align-self: flex-start;
    }

    .mr-schedule-status--upcoming {
        background: rgba(245,184,0,0.15);
        color: #92610a;
    }

    .mr-schedule-status--tentative {
        background: rgba(99,102,241,0.1);
        color: #4338ca;
    }

    /* ================================================================
    FAQ ACCORDION
    ================================================================ */
    .mr-faq-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
        max-width: 1100px;
        margin: 0 auto;
    }

    .mr-faq-item {
        background: #ffffff;
        border: 1px solid #e5eaf5;
        border-radius: 14px;
        overflow: hidden;
        box-shadow: 0 2px 10px rgba(13,27,94,0.05);
        transition: box-shadow 0.25s ease;
    }

    .mr-faq-item:hover,
    .mr-faq-item--open {
        box-shadow: 0 8px 28px rgba(13,27,94,0.1);
    }

    .mr-faq-item--open {
        border-color: #c0caf5;
    }

    .mr-faq-question {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: 18px 22px;
        background: none;
        border: none;
        cursor: pointer;
        text-align: left;
        font-size: 14px;
        font-weight: 700;
        color: #0d1b5e;
        line-height: 1.5;
        transition: background 0.2s;
    }

    .mr-faq-question:hover { background: #f8faff; }

    .mr-faq-item--open .mr-faq-question { background: #f0f3ff; }

    .mr-faq-arrow {
        font-size: 11px;
        color: #6b7280;
        flex-shrink: 0;
        transition: transform 0.3s ease, color 0.3s ease;
    }

    .mr-faq-item--open .mr-faq-arrow {
        transform: rotate(180deg);
        color: #f5b800;
    }

    .mr-faq-answer {
        padding: 0 22px 18px;
        font-size: 13px;
        color: #4b5563;
        line-height: 1.8;
        border-top: 1px solid #f0f3fa;
    }

    .mr-faq-answer p { margin: 12px 0 0; }
    .mr-faq-answer a { color: #1a2f8a; font-weight: 600; text-decoration: underline; }
    .mr-faq-answer a:hover { color: #f5b800; }

    .mr-faq-answer[hidden] { display: none; }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .mr-cta-banner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 40px;
    }

    .mr-cta-title {
        font-size: clamp(20px, 3vw, 28px);
        font-weight: 800;
        color: #ffffff;
        margin-bottom: 10px;
    }

    .mr-cta-sub {
        font-size: 15px;
        color: rgba(220,232,255,0.85);
        line-height: 1.7;
        max-width: 520px;
    }

    .mr-cta-actions {
        display: flex;
        gap: 14px;
        flex-shrink: 0;
        flex-wrap: wrap;
    }

    .mr-cta-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        font-size: 14px;
        font-weight: 700;
        padding: 14px 28px;
        border-radius: 50px;
        text-decoration: none;
        letter-spacing: 0.4px;
        transition: background 0.3s ease, color 0.3s ease, transform 0.25s ease, box-shadow 0.25s ease;
        white-space: nowrap;
    }

    .mr-cta-btn--primary {
        background: #f5b800;
        color: #0d1b5e;
        box-shadow: 0 6px 20px rgba(245,184,0,0.35);
    }

    .mr-cta-btn--primary:hover {
        background: #e5a800;
        transform: translateY(-2px);
        box-shadow: 0 10px 28px rgba(245,184,0,0.45);
    }

    .mr-cta-btn--outline {
        background: transparent;
        color: #ffffff;
        border: 2px solid rgba(255,255,255,0.4);
    }

    .mr-cta-btn--outline:hover {
        background: rgba(255,255,255,0.1);
        border-color: rgba(255,255,255,0.8);
        transform: translateY(-2px);
    }

    /* ================================================================
    RESPONSIVE — TABLET (≤1024px)
    ================================================================ */
    @media (max-width: 1024px) {
        .mr-intro-grid      { grid-template-columns: 1fr; gap: 40px; }
        .mr-improve-split   { grid-template-columns: 1fr; gap: 40px; }
        .mr-categories-grid { grid-template-columns: 1fr 1fr; }
        .mr-faq-grid        { grid-template-columns: 1fr; }

        .mr-aside-card,
        .mr-tips-card { position: static; }
    }

    /* ================================================================
    RESPONSIVE — MOBILE (≤768px)
    ================================================================ */
    @media (max-width: 768px) {
        .mr-container { padding: 0 18px; }
        .mr-section   { padding: 48px 0; }
        .mr-section--cta { padding: 52px 0; }

        .mr-categories-grid { grid-template-columns: 1fr; }
        .mr-schedule-grid   { grid-template-columns: 1fr; }

        .mr-schedule-card {
            grid-template-columns: 72px 1fr;
            grid-template-rows: auto auto;
        }

        .mr-schedule-status {
            grid-column: 2;
            justify-self: start;
        }

        .mr-cta-banner {
            flex-direction: column;
            align-items: flex-start;
            gap: 28px;
        }

        .mr-cta-actions {
            flex-direction: column;
            width: 100%;
        }

        .mr-cta-btn { width: 100%; justify-content: center; }
    }

    /* ================================================================
    RESPONSIVE — SMALL MOBILE (≤480px)
    ================================================================ */
    @media (max-width: 480px) {
        .mr-table { min-width: 0; }

        /* Responsive table — stack cells */
        .mr-table thead { display: none; }

        .mr-table tbody tr {
            display: block;
            border: 1px solid #e5eaf5;
            border-radius: 12px;
            margin-bottom: 12px;
            padding: 12px;
            box-shadow: 0 2px 8px rgba(13,27,94,0.05);
        }

        .mr-table tbody td {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 8px 4px;
            border-bottom: 1px solid #f0f3fa;
            font-size: 13px;
        }

        .mr-table tbody td:last-child { border-bottom: none; }

        .mr-table tbody td::before {
            content: attr(data-label);
            font-size: 10px;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: 0.6px;
            color: #9ca3af;
            flex-shrink: 0;
            margin-right: 10px;
        }

        .mr-table-wrap { box-shadow: none; border: none; border-radius: 0; }

        .mr-schedule-card {
            grid-template-columns: 64px 1fr;
        }

        .mr-improve-step { gap: 14px; }
        .mr-step-num { font-size: 22px; width: 36px; }
    }

    /* ================================================================
    INTERNSHIP PAGE  (int-*)
    Colors: #0d1b5e (navy) · #1a2f8a (blue) · #f5b800 (gold) · #e84118 (red)
    ================================================================ */

    /* ---- Layout ---- */
    .int-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 32px;
    }

    /* ---- Section base ---- */
    .int-section          { padding: 72px 0; }
    .int-section--intro   { background: #ffffff; }
    .int-section--why     { background: #f4f6f9; }
    .int-section--programmes { background: #ffffff; }
    .int-section--process { background: linear-gradient(160deg, #f0f3ff 0%, #f9fafe 100%); }
    .int-section--openings   { background: #f4f6f9; }
    .int-section--guidelines { background: #ffffff; }
    .int-section--testimonials { background: linear-gradient(160deg, #0d1b5e 0%, #1a2f8a 100%); }
    .int-section--cta {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        padding: 70px 0;
    }

    /* ---- Tag pill ---- */
    .int-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.8px;
        margin-bottom: 14px;
    }
    .int-tag i { font-size: 11px; color: #f5b800; }

    .int-section--testimonials .int-tag {
        background: rgba(255,255,255,0.1);
        border-color: rgba(255,255,255,0.2);
        color: #f5b800;
    }

    /* ---- Titles ---- */
    .int-title {
        font-size: clamp(22px, 3vw, 32px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
        margin-bottom: 16px;
    }

    .int-section--testimonials .int-title { color: #ffffff; }

    .int-accent { color: #f5b800; }

    .int-subtitle,
    .int-intro-text {
        font-size: 15px;
        color: #4b5563;
        line-height: 1.8;
        max-width: 700px;
        margin-bottom: 14px;
    }

    /* ---- Section Header (centred) ---- */
    .int-section-header {
        text-align: center;
        margin-bottom: 50px;
    }
    .int-section-header .int-subtitle { margin: 0 auto; }
    .int-section-header .int-tag { display: inline-flex; }

    /* ================================================================
    INTRO SECTION
    ================================================================ */
    .int-intro-grid {
        display: grid;
        grid-template-columns: 1fr 300px;
        gap: 60px;
        align-items: start;
    }

    /* Pills row */
    .int-intro-pills {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 28px;
    }

    .int-pill {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: #f0f3ff;
        border: 1px solid #c0caf5;
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 700;
        padding: 7px 16px;
        border-radius: 50px;
    }

    .int-pill i { color: #f5b800; font-size: 11px; }

    /* Stats panel */
    .int-intro-stats {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }

    .int-stat-card {
        background: #ffffff;
        border: 1px solid #e5eaf5;
        border-radius: 16px;
        padding: 22px 14px;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 8px;
        box-shadow: 0 4px 16px rgba(13,27,94,0.06);
        transition: transform 0.25s ease, box-shadow 0.25s ease;
    }

    .int-stat-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 10px 28px rgba(13,27,94,0.12);
    }

    .int-stat-icon {
        width: 46px;
        height: 46px;
        border-radius: 12px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 18px;
        flex-shrink: 0;
    }

    .int-stat-num {
        font-size: 24px;
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1;
    }
    .int-stat-num sup {
        font-size: 13px;
        font-weight: 700;
        color: #f5b800;
        vertical-align: super;
    }

    .int-stat-label {
        font-size: 11px;
        font-weight: 600;
        color: #6b7280;
        line-height: 1.4;
    }

    /* ================================================================
    WHY INTERNSHIP GRID
    ================================================================ */
    .int-why-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

    .int-why-card {
        background: #ffffff;
        border: 1px solid #e5eaf5;
        border-radius: 20px;
        padding: 30px 24px;
        text-align: center;
        box-shadow: 0 4px 16px rgba(13,27,94,0.05);
        transition: transform 0.25s ease, box-shadow 0.25s ease;
        position: relative;
        overflow: hidden;
    }

    .int-why-card::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 3px;
        background: linear-gradient(90deg, #f5b800, #e07b00);
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 0.3s ease;
    }

    .int-why-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 16px 40px rgba(13,27,94,0.11);
    }

    .int-why-card:hover::after { transform: scaleX(1); }

    .int-why-icon {
        width: 60px;
        height: 60px;
        border-radius: 16px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 22px;
        margin: 0 auto 18px;
        transition: background 0.3s ease, transform 0.3s ease;
    }

    .int-why-card:hover .int-why-icon {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        transform: scale(1.08) rotate(-5deg);
    }

    .int-why-title {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 10px;
    }

    .int-why-text {
        font-size: 13px;
        color: #4b5563;
        line-height: 1.7;
    }

    /* ================================================================
    PROGRAMME CARDS
    ================================================================ */
    .int-prog-list {
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    .int-prog-card {
        background: #ffffff;
        border: 1px solid #e5eaf5;
        border-radius: 18px;
        padding: 28px 28px;
        display: grid;
        grid-template-columns: 72px 1fr auto;
        align-items: center;
        gap: 24px;
        box-shadow: 0 4px 16px rgba(13,27,94,0.06);
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

    .int-prog-card:hover {
        transform: translateX(6px);
        box-shadow: 0 10px 32px rgba(13,27,94,0.1);
        border-color: #c0caf5;
    }

    /* Programme code badge */
    .int-prog-code {
        width: 68px;
        height: 68px;
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 13px;
        font-weight: 900;
        color: #ffffff;
        flex-shrink: 0;
        letter-spacing: 0.5px;
    }

    .int-prog-code--bba  { background: linear-gradient(135deg, #0d1b5e, #1a2f8a); }
    .int-prog-code--bca  { background: linear-gradient(135deg, #1a4a6e, #1a7aae); }
    .int-prog-code--bsw  { background: linear-gradient(135deg, #1a5e2a, #1a9e4a); }
    .int-prog-code--pmir { background: linear-gradient(135deg, #5e1a2e, #9e1a4e); }
    .int-prog-code--msw  { background: linear-gradient(135deg, #5e3a0d, #9e6a1a); }

    .int-prog-title {
        font-size: 16px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 8px;
    }

    .int-prog-desc {
        font-size: 13px;
        color: #4b5563;
        line-height: 1.7;
        margin-bottom: 12px;
    }

    .int-prog-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 16px;
    }

    .int-prog-meta span {
        display: flex;
        align-items: center;
        gap: 6px;
        font-size: 12px;
        color: #6b7280;
        font-weight: 600;
    }

    .int-prog-meta span i { color: #1a2f8a; font-size: 11px; }

    /* Sector tags (right column) */
    .int-prog-sectors {
        display: flex;
        flex-direction: column;
        gap: 6px;
        flex-shrink: 0;
        min-width: 110px;
    }

    .int-prog-sectors span {
        font-size: 11px;
        font-weight: 700;
        padding: 4px 12px;
        border-radius: 20px;
        background: rgba(13,27,94,0.07);
        color: #0d1b5e;
        text-align: center;
        white-space: nowrap;
    }

    /* ================================================================
    PROCESS GRID
    ================================================================ */
    .int-process-grid {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        gap: 0;
        flex-wrap: nowrap;
        overflow-x: auto;
    }

    .int-process-card {
        background: #ffffff;
        border: 1px solid #e5eaf5;
        border-radius: 20px;
        padding: 30px 20px 24px;
        text-align: center;
        box-shadow: 0 4px 16px rgba(13,27,94,0.06);
        flex: 1;
        min-width: 160px;
        max-width: 200px;
        transition: transform 0.25s ease, box-shadow 0.25s ease;
        position: relative;
    }

    .int-process-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 14px 36px rgba(13,27,94,0.12);
    }

    .int-process-num {
        position: absolute;
        top: -14px;
        left: 50%;
        transform: translateX(-50%);
        width: 28px;
        height: 28px;
        border-radius: 50%;
        background: #f5b800;
        color: #0d1b5e;
        font-size: 11px;
        font-weight: 900;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .int-process-icon {
        width: 58px;
        height: 58px;
        border-radius: 16px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 22px;
        margin: 0 auto 14px;
        transition: background 0.3s ease;
    }

    .int-process-card:hover .int-process-icon {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
    }

    .int-process-title {
        font-size: 13px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 8px;
        line-height: 1.4;
    }

    .int-process-text {
        font-size: 12px;
        color: #6b7280;
        line-height: 1.7;
    }

    .int-process-arrow {
        display: flex;
        align-items: center;
        padding: 0 8px;
        padding-top: 30px;
        color: #c0caf5;
        font-size: 16px;
        flex-shrink: 0;
    }

    /* ================================================================
    OPENINGS LIST
    ================================================================ */
    .int-openings-list {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

    .int-opening-card {
        background: #ffffff;
        border: 1px solid #e5eaf5;
        border-radius: 16px;
        padding: 22px 24px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
        box-shadow: 0 3px 14px rgba(13,27,94,0.05);
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

    .int-opening-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 30px rgba(13,27,94,0.1);
        border-color: #c0caf5;
    }

    .int-opening-left {
        display: flex;
        align-items: center;
        gap: 18px;
        flex: 1;
        min-width: 0;
    }

    .int-opening-icon {
        width: 50px;
        height: 50px;
        border-radius: 12px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 18px;
        flex-shrink: 0;
        transition: background 0.25s ease;
    }

    .int-opening-card:hover .int-opening-icon {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
    }

    .int-opening-title {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 8px;
    }

    .int-opening-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
    }

    .int-opening-meta span {
        display: flex;
        align-items: center;
        gap: 5px;
        font-size: 12px;
        color: #6b7280;
        font-weight: 500;
    }

    .int-opening-meta span i { color: #1a2f8a; font-size: 11px; }

    .int-opening-right {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 10px;
        flex-shrink: 0;
    }

    /* Status badges */
    .int-opening-badge {
        font-size: 10px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        padding: 4px 12px;
        border-radius: 20px;
        white-space: nowrap;
    }

    .int-opening-badge--open    { background: rgba(21,128,61,0.1); color: #15803d; }
    .int-opening-badge--limited { background: rgba(245,184,0,0.15); color: #92610a; }
    .int-opening-badge--closed  { background: rgba(156,163,175,0.15); color: #6b7280; }

    /* Apply buttons */
    .int-opening-apply {
        display: inline-flex;
        align-items: center;
        font-size: 12px;
        font-weight: 700;
        padding: 8px 18px;
        border-radius: 50px;
        text-decoration: none;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        color: #f5b800;
        transition: background 0.25s ease, transform 0.2s ease;
        white-space: nowrap;
    }

    .int-opening-apply:hover {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        transform: translateY(-1px);
    }

    .int-opening-apply--disabled {
        background: #e5eaf5;
        color: #9ca3af;
        cursor: not-allowed;
        pointer-events: none;
    }

    /* ================================================================
    GUIDELINES SPLIT
    ================================================================ */
    .int-guidelines-split {
        display: grid;
        grid-template-columns: 1fr 360px;
        gap: 60px;
        align-items: start;
    }

    .int-guidelines-text {
        font-size: 15px;
        color: #4b5563;
        line-height: 1.8;
        margin-bottom: 28px;
    }

    .int-guide-blocks {
        display: flex;
        flex-direction: column;
        gap: 24px;
    }

    .int-guide-block {
        background: #f8faff;
        border: 1px solid #e5eaf5;
        border-radius: 16px;
        padding: 22px 24px;
    }

    .int-guide-block-title {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 14px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 14px;
    }

    .int-guide-block-title i { color: #f5b800; font-size: 14px; }

    .int-guide-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .int-guide-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13px;
        color: #374151;
        line-height: 1.6;
        padding-left: 18px;
        position: relative;
    }

    .int-guide-list li::before {
        content: '';
        position: absolute;
        left: 0;
        top: 8px;
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #f5b800;
        flex-shrink: 0;
    }

    /* Apply contact card */
    .int-apply-card {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 20px;
        overflow: hidden;
        box-shadow: 0 12px 40px rgba(13,27,94,0.22);
        position: sticky;
        top: 100px;
    }

    .int-apply-card-top {
        background: rgba(245,184,0,0.12);
        padding: 18px 24px;
        display: flex;
        align-items: center;
        gap: 12px;
        border-bottom: 1px solid rgba(255,255,255,0.1);
    }

    .int-apply-card-top i    { font-size: 20px; color: #f5b800; }
    .int-apply-card-top span {
        font-size: 13px;
        font-weight: 800;
        color: #ffffff;
        text-transform: uppercase;
        letter-spacing: 1px;
    }

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

    .int-apply-card-desc {
        font-size: 13px;
        color: rgba(220,232,255,0.85);
        line-height: 1.7;
        margin-bottom: 20px;
    }

    .int-apply-contact-list {
        list-style: none;
        padding: 0;
        margin: 0 0 24px;
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    .int-apply-contact-list li {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        font-size: 13px;
        color: #dce8ff;
    }

    .int-apply-contact-list li i {
        color: #f5b800;
        font-size: 14px;
        margin-top: 1px;
        flex-shrink: 0;
        width: 16px;
        text-align: center;
    }

    .int-apply-contact-list li a {
        color: #dce8ff;
        text-decoration: none;
        transition: color 0.2s;
    }

    .int-apply-contact-list li a:hover { color: #f5b800; }

    .int-apply-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        background: #f5b800;
        color: #0d1b5e;
        font-size: 14px;
        font-weight: 700;
        padding: 14px 20px;
        border-radius: 12px;
        text-decoration: none;
        transition: background 0.25s ease, transform 0.2s ease;
    }

    .int-apply-btn:hover {
        background: #e5a800;
        transform: translateY(-2px);
    }

    /* ================================================================
    TESTIMONIALS
    ================================================================ */
    .int-testimonials-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

    .int-testimonial-card {
        background: rgba(255,255,255,0.06);
        border: 1px solid rgba(255,255,255,0.12);
        border-radius: 20px;
        padding: 28px 24px;
        display: flex;
        flex-direction: column;
        gap: 18px;
        transition: background 0.25s ease, transform 0.25s ease;
    }

    .int-testimonial-card:hover {
        background: rgba(255,255,255,0.1);
        transform: translateY(-4px);
    }

    .int-testimonial-quote i {
        font-size: 24px;
        color: #f5b800;
        opacity: 0.7;
    }

    .int-testimonial-text {
        font-size: 14px;
        color: rgba(220,232,255,0.9);
        line-height: 1.8;
        flex: 1;
        font-style: italic;
    }

    .int-testimonial-author {
        display: flex;
        align-items: center;
        gap: 14px;
        padding-top: 14px;
        border-top: 1px solid rgba(255,255,255,0.1);
    }

    .int-testimonial-avatar {
        width: 42px;
        height: 42px;
        border-radius: 50%;
        background: rgba(245,184,0,0.2);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 18px;
        flex-shrink: 0;
    }

    .int-testimonial-info {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .int-testimonial-info strong {
        font-size: 14px;
        font-weight: 800;
        color: #ffffff;
    }

    .int-testimonial-info span {
        font-size: 12px;
        color: rgba(220,232,255,0.6);
    }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .int-cta-banner {
        display: flex;
        align-items: center;
        gap: 32px;
    }

    .int-cta-icon {
        width: 72px;
        height: 72px;
        border-radius: 20px;
        background: rgba(13,27,94,0.15);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        font-size: 28px;
        flex-shrink: 0;
    }

    .int-cta-text { flex: 1; }

    .int-cta-title {
        font-size: clamp(18px, 2.5vw, 26px);
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 8px;
    }

    .int-cta-sub {
        font-size: 14px;
        color: rgba(13,27,94,0.75);
        line-height: 1.7;
    }

    .int-cta-actions {
        display: flex;
        gap: 14px;
        flex-shrink: 0;
        flex-wrap: wrap;
    }

    .int-cta-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        font-size: 14px;
        font-weight: 700;
        padding: 14px 26px;
        border-radius: 50px;
        text-decoration: none;
        letter-spacing: 0.3px;
        transition: background 0.3s ease, color 0.3s ease, transform 0.25s ease, box-shadow 0.25s ease;
        white-space: nowrap;
    }

    .int-cta-btn--primary {
        background: #0d1b5e;
        color: #f5b800;
        box-shadow: 0 6px 20px rgba(13,27,94,0.25);
    }

    .int-cta-btn--primary:hover {
        background: #1a2f8a;
        transform: translateY(-2px);
        box-shadow: 0 10px 28px rgba(13,27,94,0.35);
    }

    .int-cta-btn--outline {
        background: transparent;
        color: #0d1b5e;
        border: 2px solid rgba(13,27,94,0.35);
    }

    .int-cta-btn--outline:hover {
        background: rgba(13,27,94,0.08);
        border-color: #0d1b5e;
        transform: translateY(-2px);
    }

    /* ================================================================
    RESPONSIVE — TABLET (≤1024px)
    ================================================================ */
    @media (max-width: 1024px) {
        .int-intro-grid       { grid-template-columns: 1fr; gap: 40px; }
        .int-intro-stats      { grid-template-columns: repeat(4, 1fr); }
        .int-why-grid         { grid-template-columns: repeat(2, 1fr); }
        .int-guidelines-split { grid-template-columns: 1fr; gap: 40px; }
        .int-testimonials-grid{ grid-template-columns: 1fr 1fr; }
        .int-apply-card       { position: static; }

        .int-prog-card {
            grid-template-columns: 68px 1fr;
            grid-template-rows: auto auto;
        }

        .int-prog-sectors {
            grid-column: 1 / -1;
            flex-direction: row;
            flex-wrap: wrap;
        }
    }

    /* ================================================================
    RESPONSIVE — MOBILE (≤768px)
    ================================================================ */
    @media (max-width: 768px) {
        .int-container { padding: 0 18px; }
        .int-section   { padding: 48px 0; }
        .int-section--cta { padding: 52px 0; }

        .int-intro-stats       { grid-template-columns: 1fr 1fr; }
        .int-why-grid          { grid-template-columns: 1fr; }
        .int-testimonials-grid { grid-template-columns: 1fr; }

        .int-process-grid {
            flex-direction: column;
            align-items: center;
            gap: 24px;
            overflow: visible;
        }

        .int-process-card { max-width: 100%; width: 100%; }

        .int-process-arrow {
            transform: rotate(90deg);
            padding: 0;
            padding-left: 30px;
        }

        .int-opening-card {
            flex-direction: column;
            align-items: flex-start;
        }

        .int-opening-right {
            align-items: flex-start;
            flex-direction: row;
            flex-wrap: wrap;
        }

        .int-cta-banner {
            flex-direction: column;
            align-items: flex-start;
            gap: 24px;
        }

        .int-cta-actions {
            flex-direction: column;
            width: 100%;
        }

        .int-cta-btn { width: 100%; justify-content: center; }
    }

    /* ================================================================
    RESPONSIVE — SMALL MOBILE (≤480px)
    ================================================================ */
    @media (max-width: 480px) {
        .int-intro-stats    { grid-template-columns: 1fr 1fr; }
        .int-prog-card      { grid-template-columns: 1fr; }
        .int-prog-code      { width: 56px; height: 56px; font-size: 12px; }
        .int-prog-sectors   { flex-direction: row; flex-wrap: wrap; }
        .int-opening-left   { flex-wrap: wrap; }
        .int-opening-icon   { width: 44px; height: 44px; font-size: 16px; }
        .int-cta-icon       { display: none; }
    }

    /* ================================================================
    COURSES OFFERED PAGE  (co-*)
    ================================================================ */

    /* ---- Layout ---- */
    .co-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }

    /* ---- Shared tag pill ---- */
    .co-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }
    .co-tag i { font-size: 11px; color: #f5b800; }

    .co-tag--ug { background: rgba(13,27,94,0.09); border-color: rgba(13,27,94,0.18); }
    .co-tag--pg { background: rgba(245,184,0,0.15); border-color: rgba(245,184,0,0.38); color: #f5b800; }
    .co-tag--pg i { color: #f5b800; }

    /* ---- Shared accent ---- */
    .co-accent { color: #f5b800; }

    /* ---- Sections ---- */
    .co-intro-section {
        background: linear-gradient(180deg, #ffffff 0%, #eef2fb 100%);
        padding: 52px 0 44px;
    }

    .co-section {
        padding: 72px 0;
    }
    .co-section--ug   { background: #ffffff; }
    .co-section--pg   { background: linear-gradient(145deg, #06104a 0%, #0d1b5e 45%, #1a2a6c 75%, #0d1b5e 100%); position: relative; overflow: hidden; }
    .co-section--compare { background: #ffffff; }
    .co-section--why  { background: linear-gradient(180deg, #f4f6ff 0%, #ffffff 100%); }
    .co-section--cta  { padding: 0 0 90px; background: linear-gradient(180deg, #eef2fb 0%, #ffffff 100%); }

    /* ---- Page / section headers ---- */
    .co-page-header {
        text-align: center;
        max-width: 840px;
        margin: 0 auto 32px;
    }

    .co-section-header {
        text-align: center;
        max-width: 840px;
        margin: 0 auto 44px;
    }

    .co-page-title,
    .co-section-title {
        font-size: clamp(26px, 3.2vw, 40px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .co-page-subtitle,
    .co-section-sub {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.85;
        margin: 0;
    }

    /* ---- Overview pills ---- */
    .co-overview-row {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
    }

    .co-overview-pill {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        padding: 10px 20px;
        border-radius: 50px;
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.12);
        box-shadow: 0 6px 20px rgba(13,27,94,0.06);
    }

    .co-overview-pill-icon {
        width: 34px;
        height: 34px;
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, rgba(13,27,94,0.18), rgba(245,184,0,0.10));
        border: 1px solid rgba(13,27,94,0.12);
        color: #f5b800;
        font-size: 15px;
        flex-shrink: 0;
    }

    .co-overview-pill-label {
        font-size: 13.5px;
        font-weight: 800;
        color: #0d1b5e;
    }

    /* ================================================================
    UG COURSE CARDS
    ================================================================ */
    .co-cards-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 22px;
    }

    .co-course-card {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 22px;
        overflow: hidden;
        box-shadow: 0 16px 50px rgba(13,27,94,0.07);
        display: flex;
        flex-direction: column;
        transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s;
    }

    .co-course-card:hover {
        transform: translateY(-5px);
        border-color: rgba(245,184,0,0.35);
        box-shadow: 0 24px 64px rgba(13,27,94,0.12);
    }

    /* Card top colour band — default for all UG programmes; slug modifiers optional */
    .co-card-top {
        position: relative;
        padding: 26px 22px 22px;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
    }

    .co-card-top--bba { background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%); }
    .co-card-top--bca { background: linear-gradient(135deg, #1a3a6e 0%, #0d2a5e 100%); }
    .co-card-top--bsw { background: linear-gradient(135deg, #163060 0%, #2040a0 100%); }
    .co-card-top--bscitm,
    .co-card-top--bscds { background: linear-gradient(135deg, #122a6e 0%, #1e3a8a 100%); }

    .co-card-icon {
        width: 54px;
        height: 54px;
        border-radius: 16px;
        background: rgba(255,255,255,0.15);
        border: 1.5px solid rgba(255,255,255,0.25);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 22px;
    }

    .co-card-badge {
        font-size: 10px;
        font-weight: 900;
        letter-spacing: 1px;
        text-transform: uppercase;
        color: #0d1b5e;
        background: #f5b800;
        padding: 4px 10px;
        border-radius: 50px;
    }

    .co-card-body {
        padding: 20px 22px 0;
        flex: 1;
    }

    .co-card-title {
        font-size: 28px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 4px;
        line-height: 1;
    }

    .co-card-fullname {
        font-size: 13px;
        color: #5a6782;
        font-weight: 700;
        margin: 0 0 16px;
    }

    .co-card-meta {
        list-style: none;
        margin: 0 0 14px;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 7px;
    }

    .co-card-meta li {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        color: #475569;
    }

    .co-card-meta li i {
        color: #f5b800;
        font-size: 12px;
        width: 14px;
        flex-shrink: 0;
    }

    .co-card-meta li span {
        font-weight: 800;
        color: #0d1b5e;
        margin-right: 2px;
    }

    .co-card-desc {
        font-size: 13.5px;
        line-height: 1.75;
        color: #475569;
        margin: 0 0 14px;
    }

    .co-card-desc--rich p {
        margin: 0 0 0.55em;
    }
    .co-card-desc--rich p:last-child {
        margin-bottom: 0;
    }
    .co-card-desc--rich ol {
        margin: 0 0 0.65em;
        padding-left: 1.25em;
    }
    .co-card-desc--rich ol > li {
        margin-bottom: 0.2em;
    }
    .co-card-desc--rich strong,
    .co-card-desc--rich b {
        color: #334155;
        font-weight: 800;
    }

    .co-card-desc--rich {
        max-height: 280px;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding-right: 4px;
    }

    .co-card-outcomes {
        list-style: none;
        margin: 0 5px 18px;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

    .co-card-outcomes li {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        color: #334155;
        font-weight: 700;
    }

    .co-card-outcomes li i {
        color: #f5b800;
        font-size: 12px;
        flex-shrink: 0;
    }

    .co-card-footer {
        padding: 16px 22px 22px;
        display: flex;
        flex-direction: row;
        align-items: stretch;
        justify-content: stretch;
        flex-wrap: nowrap;
        gap: 10px;
        border-top: 1px solid rgba(13,27,94,0.07);
        margin-top: auto;
    }

    .co-card-footer .co-card-btn,
    .co-card-footer .co-card-link--download {
        flex: 1 1 0;
        min-width: 0;
        justify-content: center;
    }

    /* Shared CTA buttons (also used by PG cards) */
    .co-card-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 900;
        font-size: 13px;
        padding: 10px 16px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,0.06);
        box-shadow: 0 8px 22px rgba(245,184,0,0.22);
        text-decoration: none;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
    }

    .co-card-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 12px 30px rgba(245,184,0,0.30);
        filter: brightness(1.03);
        color: #0b1027;
    }

    .co-card-link {
        font-size: 13px;
        font-weight: 800;
        color: #0d1b5e;
        text-decoration: none;
        transition: color 0.2s;
    }

    .co-card-link:hover { color: #f5b800; }

    /* Download syllabus button style */
    .co-card-link--download {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 10px;
        border-radius: 12px;
        background: rgba(13,27,94,0.06);
        border: 1px solid rgba(13,27,94,0.12);
        color: #0d1b5e;
        font-weight: 900;
        font-size: 12px;
        box-shadow: 0 10px 26px rgba(13,27,94,0.08);
        transition: transform 0.2s, box-shadow 0.2s, background 0.2s, border-color 0.2s, color 0.2s;
        text-align: center;
        line-height: 1.25;
    }

    .co-card-link--download i {
        color: #f5b800;
        font-size: 14px;
    }

    .co-card-link--download:hover {
        color: #0d1b5e;
        background: rgba(245,184,0,0.14);
        border-color: rgba(245,184,0,0.35);
        transform: translateY(-2px);
        box-shadow: 0 14px 34px rgba(245,184,0,0.22);
        text-decoration: none;
    }

    .co-card-link--download:focus-visible {
        outline: 3px solid rgba(245,184,0,0.55);
        outline-offset: 3px;
    }

    @media (max-width: 480px) {
        .co-card-footer {
            flex-direction: column;
            flex-wrap: nowrap;
            align-items: stretch;
        }
        .co-card-footer .co-card-btn,
        .co-card-footer .co-card-link--download {
            flex: none;
            width: 100%;
        }
    }

    /* ================================================================
    PG CARDS (horizontal split)
    ================================================================ */
    /* ── PG Section animated bg ── */
    @keyframes co-pg-glow-pulse {
        0%, 100% { opacity: 0.15; transform: scale(1); }
        50%       { opacity: 0.28; transform: scale(1.07); }
    }
    @keyframes co-pg-card-in {
        from { opacity: 0; transform: translateY(28px); }
        to   { opacity: 1; transform: translateY(0); }
    }
    @keyframes co-pg-item-in {
        from { opacity: 0; transform: translateX(-12px); }
        to   { opacity: 1; transform: translateX(0); }
    }

    .co-pg-section-bg {
        position: absolute;
        inset: 0;
        background:
            radial-gradient(ellipse 70% 70% at 10% 20%, rgba(245,184,0,0.07) 0%, transparent 60%),
            radial-gradient(ellipse 60% 60% at 90% 80%, rgba(57,73,171,0.25) 0%, transparent 60%);
        pointer-events: none;
    }
    .co-pg-section-bg::before {
        content: "";
        position: absolute;
        width: 300px; height: 300px;
        top: -80px; left: -60px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(245,184,0,0.1) 0%, transparent 70%);
        filter: blur(50px);
        animation: co-pg-glow-pulse 8s ease-in-out infinite;
        pointer-events: none;
    }
    .co-pg-section-bg::after {
        content: "";
        position: absolute;
        width: 260px; height: 260px;
        bottom: -60px; right: -40px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(57,73,171,0.22) 0%, transparent 70%);
        filter: blur(45px);
        animation: co-pg-glow-pulse 10s ease-in-out infinite reverse;
        pointer-events: none;
    }

    .co-pg-wrap { position: relative; z-index: 2; }

    /* Section header on dark bg */
    .co-pg-header {
        text-align: center;
        margin-bottom: 30px;
    }
    .co-pg-section-title {
        font-size: clamp(22px, 3vw, 32px);
        font-weight: 900;
        color: #fff;
        margin: 10px 0 8px;
        letter-spacing: -0.4px;
        line-height: 1.2;
    }
    .co-pg-gold {
        background: linear-gradient(90deg, #f5b800, #ffd740, #e07b00);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }
    .co-pg-section-sub {
        font-size: 13.5px;
        color: rgba(255,255,255,0.65);
        max-width: 560px;
        margin: 0 auto;
        line-height: 1.65;
    }

    /* ── Grid — 2 columns side-by-side ── */
    .co-pg-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }

    /* ── Card shell ── */
    .co-pg-card {
        background: #fff;
        border-radius: 18px;
        overflow: hidden;
        border: 1px solid rgba(245,184,0,0.18);
        box-shadow: 0 16px 48px rgba(13,27,94,0.35);
        animation: co-pg-card-in 0.6s cubic-bezier(0.22,1,0.36,1) both;
        transition: transform 0.28s cubic-bezier(0.22,1,0.36,1), box-shadow 0.28s ease;
    }
    .co-pg-card:first-child { animation-delay: 0.05s; }
    .co-pg-card:last-child  { animation-delay: 0.18s; }
    .co-pg-card:hover {
        transform: translateY(-6px) scale(1.008);
        box-shadow: 0 24px 60px rgba(13,27,94,0.45), 0 0 28px rgba(245,184,0,0.14);
    }

    /* ── Card gradient band (top header) ── */
    .co-pg-band {
        position: relative;
        display: flex;
        align-items: center;
        gap: 16px;
        padding: 18px 22px;
        overflow: hidden;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 50%, #283593 100%);
    }
    .co-pg-band--pmir {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 50%, #283593 100%);
    }
    .co-pg-band--msw {
        background: linear-gradient(135deg, #101e60 0%, #1a2a6c 45%, #1e3a8a 100%);
    }

    /* Glow overlay inside band */
    .co-pg-band-glow {
        position: absolute;
        top: -30px; right: -20px;
        width: 130px; height: 130px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(57,73,171,0.5) 0%, transparent 70%);
        filter: blur(24px);
        pointer-events: none;
        animation: co-pg-glow-pulse 6s ease-in-out infinite;
    }
    .co-pg-band-glow--gold {
        background: radial-gradient(circle, rgba(245,184,0,0.28) 0%, transparent 70%);
        animation-direction: reverse;
    }

    /* Icon circle */
    .co-pg-band-icon {
        width: 52px; height: 52px;
        border-radius: 14px;
        background: rgba(255,255,255,0.1);
        border: 1.5px solid rgba(245,184,0,0.35);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 22px;
        flex-shrink: 0;
        backdrop-filter: blur(6px);
    }

    /* Band text */
    .co-pg-band-info { flex: 1; min-width: 0; }

    .co-pg-badge {
        display: inline-block;
        font-size: 9.5px;
        font-weight: 900;
        letter-spacing: 1.2px;
        text-transform: uppercase;
        color: #0d1b5e;
        background: linear-gradient(90deg, #f5b800, #ffd740);
        padding: 2px 10px;
        border-radius: 50px;
        margin-bottom: 5px;
    }

    .co-pg-title {
        font-size: 26px;
        font-weight: 900;
        color: #fff;
        margin: 0 0 2px;
        line-height: 1;
        letter-spacing: -0.5px;
    }

    .co-pg-fullname {
        font-size: 11.5px;
        color: rgba(255,255,255,0.68);
        font-weight: 600;
        margin: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* ── Card body ── */
    .co-pg-body {
        padding: 16px 20px 18px;
    }

    /* Meta chips row */
    .co-pg-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        margin-bottom: 12px;
    }
    .co-pg-chip {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        padding: 4px 10px;
        background: linear-gradient(90deg, #eef0fa, #f4f6ff);
        border: 1px solid rgba(26,42,108,0.12);
        border-radius: 50px;
        font-size: 11.5px;
        font-weight: 700;
        color: #1a2a6c;
    }
    .co-pg-chip i { color: #f5b800; font-size: 10px; }

    /* Description */
    .co-pg-desc {
        font-size: 12.5px;
        line-height: 1.65;
        color: #475569;
        margin: 0 0 12px;
    }

    .co-pg-desc--rich p {
        margin: 0 0 0.5em;
    }
    .co-pg-desc--rich p:last-child {
        margin-bottom: 0;
    }
    .co-pg-desc--rich ol {
        margin: 0 0 0.55em;
        padding-left: 1.2em;
    }
    .co-pg-desc--rich ol > li {
        margin-bottom: 0.18em;
    }
    .co-pg-desc--rich strong,
    .co-pg-desc--rich b {
        color: #334155;
        font-weight: 800;
    }

    .co-pg-desc--rich {
        max-height: 260px;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding-right: 4px;
    }

    /* Outcomes */
    .co-pg-outcomes {
        list-style: none;
        padding: 0;
        margin: 0 0 14px;
        display: flex;
        flex-direction: column;
        gap: 4px;
    }
    .co-pg-outcomes li {
        display: flex;
        align-items: center;
        gap: 7px;
        font-size: 12.5px;
        font-weight: 700;
        color: #1a2a6c;
        opacity: 0;
        animation: co-pg-item-in 0.4s ease both;
    }
    .co-pg-card:first-child .co-pg-outcomes li:nth-child(1) { animation-delay: 0.25s; }
    .co-pg-card:first-child .co-pg-outcomes li:nth-child(2) { animation-delay: 0.33s; }
    .co-pg-card:first-child .co-pg-outcomes li:nth-child(3) { animation-delay: 0.41s; }
    .co-pg-card:last-child  .co-pg-outcomes li:nth-child(1) { animation-delay: 0.38s; }
    .co-pg-card:last-child  .co-pg-outcomes li:nth-child(2) { animation-delay: 0.46s; }
    .co-pg-card:last-child  .co-pg-outcomes li:nth-child(3) { animation-delay: 0.54s; }
    .co-pg-outcomes li i { color: #f5b800; font-size: 11px; flex-shrink: 0; }

    /* Action buttons */
    .co-pg-actions {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        flex-wrap: wrap;
    }
    .co-pg-btn {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        padding: 8px 18px;
        background: linear-gradient(90deg, #0d1b5e, #1a2a6c);
        color: #f5b800;
        font-size: 12.5px;
        font-weight: 800;
        border-radius: 8px;
        text-decoration: none;
        border: 1.5px solid rgba(245,184,0,0.3);
        transition: background 0.22s ease, box-shadow 0.22s ease, transform 0.22s ease;
        letter-spacing: 0.2px;
    }
    .co-pg-btn:hover {
        background: linear-gradient(90deg, #1a2a6c, #283593);
        box-shadow: 0 6px 20px rgba(13,27,94,0.3);
        transform: translateY(-2px);
        color: #ffd740;
    }
    .co-pg-btn-outline {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 7px 14px;
        background: transparent;
        color: #1a2a6c;
        font-size: 12px;
        font-weight: 700;
        border-radius: 8px;
        text-decoration: none;
        border: 1.5px solid rgba(26,42,108,0.25);
        transition: border-color 0.22s ease, color 0.22s ease, background 0.22s ease;
    }
    .co-pg-btn-outline:hover {
        border-color: #f5b800;
        color: #0d1b5e;
        background: rgba(245,184,0,0.08);
    }

    /* Reduced motion */
    @media (prefers-reduced-motion: reduce) {
        .co-pg-card,
        .co-pg-outcomes li,
        .co-pg-band-glow,
        .co-pg-section-bg::before,
        .co-pg-section-bg::after {
            animation: none !important;
            opacity: 1 !important;
            transform: none !important;
        }
    }

    /* ── Responsive ── */
    @media (max-width: 900px) {
        .co-pg-grid { grid-template-columns: 1fr; gap: 16px; }
        .co-pg-fullname { white-space: normal; }
    }
    @media (max-width: 600px) {
        .co-pg-band { padding: 14px 16px; gap: 12px; }
        .co-pg-band-icon { width: 44px; height: 44px; font-size: 18px; border-radius: 10px; }
        .co-pg-title { font-size: 22px; }
        .co-pg-body { padding: 14px 16px 16px; }
        .co-pg-actions { flex-direction: column; align-items: flex-start; }
        .co-pg-btn, .co-pg-btn-outline { width: 100%; justify-content: center; }
    }

    /* ================================================================
    COMPARISON TABLE
    ================================================================ */
    .co-table-wrap {
        overflow-x: auto;
        border-radius: 16px;
        box-shadow: 0 16px 50px rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.10);
    }

    .co-table {
        width: 100%;
        border-collapse: collapse;
        background: #ffffff;
        font-size: 14px;
    }

    .co-table thead tr {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
    }

    .co-table thead th {
        padding: 16px 20px;
        text-align: left;
        color: #ffffff;
        font-size: 12px;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        white-space: nowrap;
    }

    .co-table tbody tr {
        border-bottom: 1px solid rgba(13,27,94,0.07);
        transition: background 0.2s;
    }

    .co-table tbody tr:last-child { border-bottom: none; }

    .co-table tbody tr:hover { background: rgba(13,27,94,0.03); }

    .co-table td {
        padding: 15px 20px;
        color: #334155;
        vertical-align: middle;
    }

    .co-table td:first-child {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .co-table-prog {
        font-size: 15px;
        font-weight: 900;
        color: #0d1b5e;
    }

    .co-table td:first-child span {
        font-size: 12px;
        color: #5a6782;
    }

    .co-table-badge {
        display: inline-block;
        padding: 3px 10px;
        border-radius: 50px;
        font-size: 11px;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .co-table-badge--ug {
        background: rgba(13,27,94,0.09);
        color: #0d1b5e;
        border: 1px solid rgba(13,27,94,0.16);
    }

    .co-table-badge--pg {
        background: rgba(245,184,0,0.14);
        color: #7a5000;
        border: 1px solid rgba(245,184,0,0.30);
    }

    /* ================================================================
    WHY AAMS GRID
    ================================================================ */
    .co-why-grid {
        --co-blue: #0d1b5e;
        --co-blue2: #1a2a6c;
        --co-gold: #f5b800;
        counter-reset: coWhyStep;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px 56px;
        position: relative;
    }

    .co-why-grid::before {
        content: "";
        position: absolute;
        top: 12px;
        bottom: 12px;
        left: 50%;
        width: 2px;
        transform: translateX(-50%);
        background: linear-gradient(180deg, transparent, rgba(13,27,94,0.18), rgba(245,184,0,0.28), rgba(13,27,94,0.18), transparent);
        border-radius: 999px;
        pointer-events: none;
    }

    .co-why-card {
        counter-increment: coWhyStep;
        background:
            linear-gradient(135deg, rgba(13,27,94,0.04) 0%, rgba(245,184,0,0.05) 100%),
            #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 18px;
        padding: 26px 22px 24px;
        box-shadow: 0 14px 44px rgba(13,27,94,0.07);
        transition: transform 0.25s, border-color 0.25s, box-shadow 0.25s;
        position: relative;
        overflow: hidden;
        animation: coWhyIn 700ms cubic-bezier(.2,.8,.2,1) both;
    }

    .co-why-card::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        height: 4px;
        background: linear-gradient(90deg, var(--co-blue), var(--co-gold));
        opacity: 0.9;
    }

    .co-why-card::after {
        content: "";
        position: absolute;
        top: 26px;
        width: 14px;
        height: 14px;
        border-radius: 999px;
        background: linear-gradient(135deg, var(--co-gold), #e07b00);
        box-shadow: 0 10px 24px rgba(245,184,0,0.20);
        border: 3px solid rgba(255,255,255,0.95);
    }

    .co-why-card:nth-child(odd)::after { right: -35px; }
    .co-why-card:nth-child(even)::after { left: -35px; }

    .co-why-card:hover {
        transform: translateY(-4px);
        border-color: rgba(245,184,0,0.32);
        box-shadow: 0 20px 52px rgba(13,27,94,0.10);
    }

    .co-why-icon {
        width: 50px;
        height: 50px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, rgba(13,27,94,0.18), rgba(245,184,0,0.16));
        border: 1px solid rgba(13,27,94,0.14);
        color: var(--co-blue);
        font-size: 20px;
        margin-bottom: 14px;
        position: relative;
        transition: transform 0.25s ease;
    }

    .co-why-icon::after {
        content: "Step " counter(coWhyStep);
        position: absolute;
        left: 56px;
        top: 50%;
        transform: translateY(-50%);
        padding: 6px 10px;
        border-radius: 999px;
        background: rgba(13,27,94,0.06);
        border: 1px solid rgba(13,27,94,0.10);
        color: var(--co-blue);
        font-size: 11px;
        font-weight: 900;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .co-why-card:hover .co-why-icon { transform: translateY(-1px); }

    .co-why-title {
        font-size: 16px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 8px;
    }

    .co-why-text {
        font-size: 13.5px;
        line-height: 1.75;
        color: #475569;
        margin: 0;
    }

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

    .co-why-card:nth-child(1) { animation-delay: 0ms; }
    .co-why-card:nth-child(2) { animation-delay: 60ms; }
    .co-why-card:nth-child(3) { animation-delay: 120ms; }
    .co-why-card:nth-child(4) { animation-delay: 180ms; }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .co-cta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 28px 26px;
        border-radius: 22px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border: 1px solid rgba(245,184,0,0.22);
        flex-wrap: wrap;
    }

    .co-cta-title {
        margin: 0 0 8px;
        color: #ffffff;
        font-weight: 1000;
        font-size: 22px;
    }

    .co-cta-sub {
        margin: 0;
        color: rgba(255,255,255,0.78);
        line-height: 1.75;
        font-size: 14px;
        max-width: 520px;
    }

    .co-cta-actions {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
    }

    .co-cta-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 14px;
        padding: 13px 20px;
        font-weight: 1000;
        font-size: 14px;
        text-decoration: none;
        border: 1px solid transparent;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s, background 0.2s, border-color 0.2s;
    }

    .co-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        box-shadow: 0 12px 30px rgba(245,184,0,0.26);
    }

    .co-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 16px 40px rgba(245,184,0,0.34);
        filter: brightness(1.03);
        color: #0b1027;
    }

    .co-cta-btn--outline {
        background: rgba(255,255,255,0.07);
        color: #ffffff;
        border-color: rgba(255,255,255,0.22);
    }

    .co-cta-btn--outline:hover {
        transform: translateY(-2px);
        background: rgba(255,255,255,0.12);
        border-color: rgba(255,255,255,0.34);
    }

    /* ================================================================
    RESPONSIVE
    ================================================================ */
    @media (max-width: 1100px) {
        .co-why-grid { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 991px) {
        .co-cards-grid { grid-template-columns: repeat(2, 1fr); }
        .co-pg-card { flex-direction: column; }
        .co-pg-card-left {
            width: 100%;
            flex-direction: row;
            justify-content: flex-start;
            padding: 18px 22px 0;
            gap: 12px;
        }
        .co-pg-card-right {
            padding: 16px 22px 22px;
            border-left: none;
            border-top: 1px solid rgba(13,27,94,0.07);
        }
        .co-cta { flex-direction: column; align-items: flex-start; }
        .co-cta-actions { width: 100%; }
    }

    @media (max-width: 767px) {
        .co-container { padding: 0 18px; }
        .co-intro-section { padding: 40px 0 30px; }
        .co-section { padding: 48px 0; }
        .co-section--cta { padding-bottom: 70px; }
        .co-cards-grid { grid-template-columns: 1fr; }
        .co-why-grid { grid-template-columns: 1fr; }
        .co-overview-row { flex-direction: column; align-items: center; }
        .co-overview-pill { width: 100%; max-width: 340px; justify-content: center; }
        .co-cta-actions { flex-direction: column; width: 100%; }
        .co-cta-btn { width: 100%; justify-content: center; }
        .co-table thead th,
        .co-table td { padding: 12px 14px; font-size: 13px; }
    }

    /* ================================================================
    COURSE DETAIL PAGE (course.php)  (.cd-*)
    ================================================================ */
    .cd-page .cd-hero-actions { margin-top: 18px; }
    .cd-page .cd-hero-kicker {
        display: inline-block;
        font-size: 12px;
        font-weight: 800;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: rgba(255,255,255,0.92);
        background: rgba(255,255,255,0.12);
        border: 1px solid rgba(255,255,255,0.22);
        padding: 6px 14px;
        border-radius: 50px;
        margin-bottom: 12px;
    }
    .cd-page .cd-hero-lead {
        max-width: 720px;
        margin: 0 auto;
        font-size: clamp(15px, 1.9vw, 17px);
        line-height: 1.65;
        color: rgba(255,255,255,0.94);
    }
    .cd-page .cd-hero-lead p { margin: 0 0 10px; }
    .cd-page .cd-hero-lead p:last-child { margin-bottom: 0; }

    .cd-hero-fullname {
        max-width: 720px;
        margin: 0 auto 14px;
        font-size: clamp(16px, 2.1vw, 20px);
        font-weight: 600;
        line-height: 1.45;
        color: rgba(255,255,255,0.96);
        letter-spacing: 0.01em;
    }

    .cd-page .cd-hero-lead--richtext h2,
    .cd-page .cd-hero-lead--richtext h3,
    .cd-page .cd-hero-lead--richtext h4 {
        margin: 0 0 10px;
        font-weight: 800;
        line-height: 1.25;
        color: #ffffff;
        text-shadow: 0 1px 12px rgba(0,0,0,0.25);
    }
    .cd-page .cd-hero-lead--richtext h2 { font-size: clamp(18px, 2.4vw, 22px); }
    .cd-page .cd-hero-lead--richtext h3 { font-size: clamp(16px, 2vw, 19px); }
    .cd-page .cd-hero-lead--richtext h4 { font-size: clamp(15px, 1.8vw, 17px); }
    .cd-page .cd-hero-lead--richtext ul,
    .cd-page .cd-hero-lead--richtext ol {
        margin: 8px 0 0;
        padding-left: 1.15em;
        text-align: left;
    }
    .cd-page .cd-hero-lead--richtext li { margin-bottom: 6px; }
    .cd-page .cd-hero-lead--richtext blockquote {
        margin: 12px 0 0;
        padding: 10px 14px;
        border-left: 3px solid rgba(245,184,0,0.85);
        background: rgba(0,0,0,0.18);
        border-radius: 0 10px 10px 0;
        font-size: 0.95em;
    }

    .cd-hero--cover {
        position: relative;
        background-color: #0d1b5e;
        background-image: linear-gradient(105deg, rgba(13,27,94,0.92) 0%, rgba(13,27,94,0.78) 42%, rgba(13,27,94,0.55) 100%), var(--cd-cover);
        background-size: cover;
        background-position: center;
    }

    .cd-main {
        padding: 56px 0 72px;
        background: linear-gradient(180deg, #f4f6fb 0%, #ffffff 40%);
    }

    .cd-container {
        max-width: 1180px;
        margin: 0 auto;
        padding: 0 24px;
    }

    .cd-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
        gap: 32px;
        align-items: start;
    }

    .cd-content {
        background: #ffffff;
        border-radius: 18px;
        border: 1px solid rgba(13,27,94,0.08);
        box-shadow: 0 14px 40px rgba(13,27,94,0.08);
        padding: clamp(22px, 3vw, 34px);
    }

    .cd-content--richtext {
        position: relative;
        overflow: hidden;
    }
    .cd-content--richtext::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 4px;
        height: 100%;
        background: linear-gradient(180deg, #f5b800 0%, #e07b00 55%, rgba(224,123,0,0.35) 100%);
        border-radius: 4px 0 0 4px;
        pointer-events: none;
    }

    .cd-prose {
        font-size: 16px;
        line-height: 1.75;
        color: #3a455d;
    }
    .cd-prose p { margin: 0 0 14px; }
    .cd-prose ul, .cd-prose ol { margin: 0 0 14px 1.1em; padding: 0; }
    .cd-prose li { margin-bottom: 6px; }
    .cd-prose strong { color: #0d1b5e; }

    /* Programme detail: CKEditor / rich body */
    .cd-prose--course {
        max-width: 52rem;
        font-size: 16px;
        line-height: 1.78;
        color: #374151;
    }
    .cd-prose--course > p:first-child {
        font-size: 1.05em;
        color: #1e293b;
    }
    .cd-prose--course h2,
    .cd-prose--course h3,
    .cd-prose--course h4 {
        margin: 1.65em 0 0.55em;
        font-weight: 800;
        line-height: 1.25;
        color: #0d1b5e;
        letter-spacing: -0.02em;
    }
    .cd-prose--course h2:first-child,
    .cd-prose--course h3:first-child,
    .cd-prose--course h4:first-child {
        margin-top: 0;
    }
    .cd-prose--course h2 { font-size: clamp(1.35rem, 2.5vw, 1.65rem); }
    .cd-prose--course h3 { font-size: clamp(1.15rem, 2vw, 1.35rem); }
    .cd-prose--course h4 { font-size: 1.08rem; }
    .cd-prose--course p { margin: 0 0 1em; }
    .cd-prose--course p:last-child { margin-bottom: 0; }

    .cd-prose--course ul,
    .cd-prose--course ol {
        margin: 0 0 1.15em;
        padding: 0;
        list-style: none;
    }
    .cd-prose--course ul > li,
    .cd-prose--course ol > li {
        position: relative;
        margin-bottom: 0.55em;
        padding-left: 1.35em;
        line-height: 1.65;
    }
    .cd-prose--course ul > li::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0.55em;
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: linear-gradient(135deg, #f5b800, #e07b00);
        box-shadow: 0 0 0 2px rgba(245,184,0,0.2);
    }
    .cd-prose--course ol {
        counter-reset: cd-ol;
    }
    .cd-prose--course ol > li {
        counter-increment: cd-ol;
        padding-left: 1.6em;
    }
    .cd-prose--course ol > li::before {
        content: counter(cd-ol) '.';
        position: absolute;
        left: 0;
        top: 0;
        font-weight: 800;
        font-size: 0.9em;
        color: #c2410c;
        width: 1.35em;
        text-align: left;
    }

    .cd-prose--course blockquote {
        margin: 1.25em 0;
        padding: 14px 18px 14px 20px;
        border-left: 4px solid #f5b800;
        background: linear-gradient(90deg, rgba(245,184,0,0.1) 0%, rgba(13,27,94,0.04) 100%);
        border-radius: 0 14px 14px 0;
        color: #334155;
        font-size: 0.98em;
    }
    .cd-prose--course blockquote p { margin: 0 0 0.5em; }
    .cd-prose--course blockquote p:last-child { margin-bottom: 0; }

    .cd-prose--course hr {
        margin: 1.75em 0;
        border: none;
        height: 1px;
        background: linear-gradient(90deg, transparent, rgba(13,27,94,0.15) 20%, rgba(13,27,94,0.15) 80%, transparent);
    }

    .cd-prose--course strong,
    .cd-prose--course b {
        color: #0d1b5e;
        font-weight: 700;
    }

    .cd-prose--course ul ul,
    .cd-prose--course ol ol,
    .cd-prose--course ul ol,
    .cd-prose--course ol ul {
        margin-top: 0.45em;
        margin-bottom: 0.35em;
    }

    .cd-muted { color: #6b7289; margin: 0; font-size: 15px; }

    .cd-aside-card {
        background: linear-gradient(160deg, #0d1b5e 0%, #1a2f8a 100%);
        color: #ffffff;
        border-radius: 18px;
        padding: 22px 22px 24px;
        box-shadow: 0 18px 44px rgba(13,27,94,0.28);
        position: sticky;
        top: 100px;
    }

    .cd-aside-title {
        margin: 0 0 16px;
        font-size: 14px;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: rgba(255,255,255,0.88);
    }

    .cd-facts { margin: 0; }
    .cd-fact {
        display: grid;
        grid-template-columns: 110px 1fr;
        gap: 8px 12px;
        padding: 10px 0;
        border-bottom: 1px solid rgba(255,255,255,0.12);
        font-size: 14px;
    }
    .cd-fact:last-of-type { border-bottom: none; }
    .cd-fact dt {
        margin: 0;
        font-weight: 700;
        color: rgba(255,255,255,0.65);
    }
    .cd-fact dd { margin: 0; font-weight: 600; }

    .cd-aside-actions {
        display: flex;
        flex-direction: column;
        gap: 10px;
        margin-top: 20px;
    }

    .cd-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 12px 18px;
        border-radius: 12px;
        font-size: 14px;
        font-weight: 700;
        text-decoration: none;
        text-align: center;
        transition: transform 0.2s, box-shadow 0.2s, background 0.2s, color 0.2s;
    }
    .cd-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        box-shadow: 0 6px 18px rgba(245,184,0,0.35);
    }
    .cd-btn--primary:hover {
        transform: translateY(-2px);
        color: #0b1027;
    }
    .cd-btn--outline {
        background: transparent;
        color: #ffffff;
        border: 1px solid rgba(255,255,255,0.45);
    }
    .cd-btn--outline:hover {
        background: rgba(255,255,255,0.1);
    }
    .cd-btn--ghost {
        background: rgba(255,255,255,0.08);
        color: #ffffff;
        border: 1px solid rgba(255,255,255,0.2);
        font-size: 13px;
    }
    .cd-btn--ghost:hover { background: rgba(255,255,255,0.14); }

    .co-table-detail {
        display: inline-block;
        margin-top: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #1a2f8a;
        text-decoration: none;
    }
    .co-table-detail:hover { text-decoration: underline; }

    @media (max-width: 991px) {
        .cd-layout { grid-template-columns: 1fr; }
        .cd-aside-card { position: static; }
    }

    @media (max-width: 767px) {
        .cd-main { padding: 40px 0 56px; }
        .cd-container { padding: 0 18px; }
        .cd-fact { grid-template-columns: 1fr; gap: 2px; }
    }

    /* ================================================================
    ADMISSION PROCEDURE PAGE  (ap-*)
    ================================================================ */

    /* ---- Layout ---- */
    .ap-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }

    /* ---- Tag pill ---- */
    .ap-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }
    .ap-tag i { font-size: 11px; color: #f5b800; }

    /* ---- Accent ---- */
    .ap-accent { color: #f5b800; }

    /* ---- Intro section ---- */
    .ap-intro-section {
        background: linear-gradient(180deg, #ffffff 0%, #eef2fb 100%);
        padding: 52px 0 44px;
    }

    /* ---- Generic sections ---- */
    .ap-section            { padding: 72px 0; }
    .ap-section--steps     { background: #ffffff; }
    .ap-section--elig      { background: linear-gradient(180deg, #f4f6ff 0%, #ffffff 100%); }
    .ap-section--docs      { background: #ffffff; }
    .ap-section--dates     { background: linear-gradient(180deg, #f4f6ff 0%, #ffffff 100%); }
    .ap-section--faq       { background: #ffffff; }
    .ap-section--cta       { padding: 0 0 90px; background: linear-gradient(180deg, #eef2fb 0%, #ffffff 100%); }

    /* ---- Headers ---- */
    .ap-page-header,
    .ap-section-header {
        text-align: center;
        max-width: 840px;
        margin: 0 auto 40px;
    }

    .ap-page-title,
    .ap-section-title {
        font-size: clamp(26px, 3.2vw, 40px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .ap-page-subtitle,
    .ap-section-sub {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.85;
        margin: 0;
    }

    /* ---- Highlight row ---- */
    .ap-highlights-row {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 14px;
    }

    .ap-highlight {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 16px 18px;
        border-radius: 16px;
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        box-shadow: 0 8px 28px rgba(13,27,94,0.06);
    }

    .ap-highlight-icon {
        width: 46px;
        height: 46px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        font-size: 18px;
        color: #f5b800;
        background: linear-gradient(135deg, rgba(13,27,94,0.18), rgba(245,184,0,0.10));
        border: 1px solid rgba(13,27,94,0.12);
    }

    .ap-highlight-text {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .ap-highlight-text strong {
        font-size: 13.5px;
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1.3;
    }

    .ap-highlight-text span {
        font-size: 12px;
        color: #5a6782;
    }

    /* ================================================================
    STEP TIMELINE
    ================================================================ */
    .ap-steps-timeline {
        max-width: 860px;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .ap-step-item {
        display: grid;
        grid-template-columns: 64px 1fr;
        gap: 0 20px;
    }

    .ap-step-marker {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .ap-step-num {
        width: 46px;
        height: 46px;
        border-radius: 14px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        color: #ffffff;
        font-size: 16px;
        font-weight: 900;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        box-shadow: 0 8px 22px rgba(13,27,94,0.22);
        position: relative;
        z-index: 1;
    }

    .ap-step-num--final {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        box-shadow: 0 8px 22px rgba(245,184,0,0.30);
    }

    .ap-step-line {
        flex: 1;
        width: 2px;
        background: linear-gradient(180deg, rgba(13,27,94,0.20) 0%, rgba(13,27,94,0.06) 100%);
        margin: 4px 0;
    }

    .ap-step-item--last .ap-step-marker { justify-content: flex-start; }

    .ap-step-content {
        padding: 0 0 40px;
    }

    .ap-step-item--last .ap-step-content { padding-bottom: 0; }

    .ap-step-icon {
        width: 48px;
        height: 48px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.28);
        color: #0d1b5e;
        font-size: 19px;
        margin-bottom: 12px;
    }

    .ap-step-icon--final {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        border-color: transparent;
        color: #0b1027;
    }

    .ap-step-title {
        font-size: 18px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 8px;
    }

    .ap-step-text {
        font-size: 14.5px;
        line-height: 1.8;
        color: #475569;
        margin: 0 0 14px;
    }

    .ap-step-link {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13.5px;
        font-weight: 900;
        color: #0d1b5e;
        text-decoration: none;
        transition: color 0.2s, gap 0.2s;
    }

    .ap-step-link:hover { color: #f5b800; gap: 12px; }

    /* Step pills */
    .ap-step-pills {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .ap-pill {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 6px 14px;
        border-radius: 50px;
        font-size: 12.5px;
        font-weight: 800;
        background: rgba(13,27,94,0.07);
        color: #0d1b5e;
        border: 1px solid rgba(13,27,94,0.12);
    }

    .ap-pill i { font-size: 11px; color: #f5b800; }

    .ap-pill--success {
        background: rgba(22,163,74,0.08);
        color: #166534;
        border-color: rgba(22,163,74,0.20);
    }

    .ap-pill--success i { color: #16a34a; }

    /* Step doc mini list */
    .ap-doc-mini {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

    .ap-doc-mini li {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 13.5px;
        color: #475569;
        font-weight: 650;
    }

    .ap-doc-mini li i { color: #f5b800; font-size: 10px; flex-shrink: 0; }

    /* ================================================================
    ELIGIBILITY CARDS
    ================================================================ */
    .ap-elig-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 22px;
    }

    .ap-elig-card {
        border-radius: 22px;
        overflow: hidden;
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        box-shadow: 0 16px 50px rgba(13,27,94,0.07);
    }

    .ap-elig-card-top {
        padding: 26px 26px 20px;
    }

    .ap-elig-card--ug .ap-elig-card-top {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
    }

    .ap-elig-card--pg .ap-elig-card-top {
        background: linear-gradient(135deg, #163060 0%, #2040a0 100%);
    }

    .ap-elig-card--other .ap-elig-card-top {
        background: linear-gradient(135deg, #1e3a5f 0%, #2d4a6e 100%);
    }

    .ap-elig-icon {
        width: 52px;
        height: 52px;
        border-radius: 16px;
        background: rgba(255,255,255,0.15);
        border: 1.5px solid rgba(255,255,255,0.25);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 22px;
        margin-bottom: 12px;
    }

    .ap-elig-heading {
        font-size: 20px;
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 4px;
    }

    .ap-elig-sub {
        font-size: 13px;
        color: rgba(255,255,255,0.70);
        margin: 0;
    }

    .ap-elig-list {
        list-style: none;
        margin: 0;
        padding: 22px 26px;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .ap-elig-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 14px;
        color: #334155;
        line-height: 1.6;
    }

    .ap-elig-list li i { color: #f5b800; font-size: 13px; margin-top: 2px; flex-shrink: 0; }

    .ap-elig-body {
        background: #ffffff;
    }

    .ap-elig-program {
        padding: 18px 26px 20px;
        border-top: 1px solid rgba(13, 27, 94, 0.08);
    }
    .ap-elig-program:first-of-type {
        border-top: 0;
    }

    .ap-elig-program-name {
        margin: 0 0 10px;
        font-size: 15px;
        font-weight: 850;
        color: #0d1b5e;
        line-height: 1.35;
    }

    .ap-elig-list--program {
        padding: 0;
        margin: 0 0 10px;
    }

    .ap-elig-short {
        margin: 0 0 12px;
        font-size: 13px;
        font-weight: 500;
        color: #64748b;
        line-height: 1.55;
    }
    .ap-elig-short--html :is(p, ul, ol) {
        margin: 0;
    }
    .ap-elig-short--html ul,
    .ap-elig-short--html ol {
        padding-left: 1.15em;
    }
    .ap-elig-short--html p + p {
        margin-top: 0.35em;
    }

    .ap-elig-pdf {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 13px;
        font-weight: 800;
        color: #0d1b5e;
        text-decoration: none;
        border-bottom: 2px solid rgba(245, 184, 0, 0.55);
        padding-bottom: 2px;
    }
    .ap-elig-pdf:hover {
        color: #1a2f8a;
        border-bottom-color: #f5b800;
    }

    .ap-elig-empty {
        grid-column: 1 / -1;
        margin: 0;
        padding: 20px 22px;
        background: rgba(13, 27, 94, 0.04);
        border-radius: 18px;
        border: 1px dashed rgba(13, 27, 94, 0.15);
        color: #475569;
        font-size: 14px;
        line-height: 1.65;
        font-weight: 650;
    }
    .ap-elig-empty a {
        font-weight: 800;
        color: #0d1b5e;
        text-decoration: none;
        border-bottom: 2px solid rgba(245, 184, 0, 0.55);
    }
    .ap-elig-empty a:hover {
        border-bottom-color: #f5b800;
    }

    /* ================================================================
    DOCUMENTS GRID
    ================================================================ */
    .ap-docs-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 18px;
    }

    .ap-doc-card {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 18px;
        padding: 24px 20px;
        box-shadow: 0 12px 40px rgba(13,27,94,0.06);
        transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
    }

    .ap-doc-card:hover {
        transform: translateY(-4px);
        border-color: rgba(245,184,0,0.32);
        box-shadow: 0 20px 52px rgba(13,27,94,0.10);
    }

    .ap-doc-icon {
        width: 50px;
        height: 50px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.26);
        color: #0d1b5e;
        font-size: 20px;
        margin-bottom: 14px;
    }

    .ap-doc-title {
        font-size: 16px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 8px;
    }

    .ap-doc-text {
        font-size: 13.5px;
        line-height: 1.75;
        color: #475569;
        margin: 0;
    }

    /* ================================================================
    DATES TABLE
    ================================================================ */
    .ap-dates-table-wrap {
        overflow-x: auto;
        border-radius: 16px;
        box-shadow: 0 16px 48px rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.10);
        margin-bottom: 16px;
    }

    .ap-dates-table {
        width: 100%;
        border-collapse: collapse;
        background: #ffffff;
        font-size: 14px;
    }

    .ap-dates-table thead tr {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
    }

    .ap-dates-table thead th {
        padding: 15px 20px;
        text-align: left;
        color: #ffffff;
        font-size: 12px;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        white-space: nowrap;
    }

    .ap-dates-table tbody tr {
        border-bottom: 1px solid rgba(13,27,94,0.07);
        transition: background 0.2s;
    }

    .ap-dates-table tbody tr:last-child { border-bottom: none; }
    .ap-dates-table tbody tr:hover { background: rgba(13,27,94,0.025); }

    .ap-dates-table td {
        padding: 15px 20px;
        color: #334155;
        vertical-align: middle;
    }

    .ap-dates-table td strong { color: #0d1b5e; font-weight: 800; }

    .ap-dates-detail {
        line-height: 1.55;
        vertical-align: top;
    }
    .ap-dates-doc {
        display: inline-block;
        margin-top: 8px;
        font-size: 13px;
        font-weight: 800;
        color: #0d1b5e;
        text-decoration: none;
        border-bottom: 2px solid rgba(245, 184, 0, 0.55);
        padding-bottom: 1px;
    }
    .ap-dates-doc:hover {
        color: #1a2f8a;
        border-bottom-color: #f5b800;
    }
    .ap-dates-empty {
        text-align: center;
        padding: 28px 20px !important;
        color: #64748b;
        font-size: 14px;
        line-height: 1.65;
    }

    .ap-status {
        display: inline-block;
        padding: 4px 12px;
        border-radius: 50px;
        font-size: 12px;
        font-weight: 900;
        white-space: nowrap;
    }

    .ap-status--open     { background: rgba(22,163,74,0.10); color: #166534; border: 1px solid rgba(22,163,74,0.22); }
    .ap-status--soon     { background: rgba(245,184,0,0.14); color: #7a5000; border: 1px solid rgba(245,184,0,0.28); }
    .ap-status--upcoming { background: rgba(13,27,94,0.08); color: #0d1b5e; border: 1px solid rgba(13,27,94,0.16); }
    .ap-status--ended    { background: rgba(100,116,139,0.12); color: #475569; border: 1px solid rgba(100,116,139,0.22); }

    .ap-dates-note {
        font-size: 13px;
        color: #5a6782;
        margin: 0;
    }

    .ap-dates-note i { color: #f5b800; margin-right: 6px; }

    /* ================================================================
    FAQ ACCORDION
    ================================================================ */
    .ap-faq-list {
        max-width: 860px;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .ap-faq-item {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 16px;
        overflow: hidden;
        box-shadow: 0 8px 28px rgba(13,27,94,0.05);
        transition: border-color 0.2s, box-shadow 0.2s;
    }

    .ap-faq-item[open] {
        border-color: rgba(245,184,0,0.35);
        box-shadow: 0 12px 36px rgba(13,27,94,0.09);
    }

    .ap-faq-summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: 18px 22px;
        cursor: pointer;
        list-style: none;
        outline: none;
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        transition: background 0.2s;
    }

    .ap-faq-summary::-webkit-details-marker { display: none; }

    .ap-faq-summary:hover { background: rgba(13,27,94,0.02); }

    .ap-faq-item[open] .ap-faq-summary { background: rgba(13,27,94,0.03); }

    .ap-faq-icon {
        width: 32px;
        height: 32px;
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        background: rgba(13,27,94,0.07);
        color: #0d1b5e;
        font-size: 13px;
        transition: background 0.2s, transform 0.3s, color 0.2s;
    }

    .ap-faq-item[open] .ap-faq-icon {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        transform: rotate(45deg);
    }

    .ap-faq-answer {
        padding: 0 22px 18px;
        border-top: 1px solid rgba(13,27,94,0.06);
    }

    .ap-faq-answer p {
        margin: 14px 0 0;
        font-size: 14px;
        line-height: 1.8;
        color: #475569;
    }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .ap-cta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 28px 26px;
        border-radius: 22px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border: 1px solid rgba(245,184,0,0.22);
        flex-wrap: wrap;
    }

    .ap-cta-title {
        margin: 0 0 8px;
        color: #ffffff;
        font-weight: 1000;
        font-size: 22px;
    }

    .ap-cta-sub {
        margin: 0;
        color: rgba(255,255,255,0.78);
        line-height: 1.75;
        font-size: 14px;
        max-width: 520px;
    }

    .ap-cta-actions {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
    }

    .ap-cta-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 14px;
        padding: 13px 20px;
        font-weight: 1000;
        font-size: 14px;
        text-decoration: none;
        border: 1px solid transparent;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s, background 0.2s, border-color 0.2s;
    }

    .ap-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        box-shadow: 0 12px 30px rgba(245,184,0,0.26);
    }

    .ap-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 16px 40px rgba(245,184,0,0.34);
        filter: brightness(1.03);
        color: #0b1027;
    }

    .ap-cta-btn--outline {
        background: rgba(255,255,255,0.07);
        color: #ffffff;
        border-color: rgba(255,255,255,0.22);
    }

    .ap-cta-btn--outline:hover {
        transform: translateY(-2px);
        background: rgba(255,255,255,0.12);
        border-color: rgba(255,255,255,0.34);
    }

    /* ================================================================
    RESPONSIVE
    ================================================================ */
    @media (max-width: 991px) {
        .ap-highlights-row { grid-template-columns: repeat(2, 1fr); }
        .ap-elig-grid       { grid-template-columns: 1fr; }
        .ap-docs-grid       { grid-template-columns: repeat(2, 1fr); }
        .ap-cta             { flex-direction: column; align-items: flex-start; }
        .ap-cta-actions     { width: 100%; }
    }

    @media (max-width: 767px) {
        .ap-container        { padding: 0 18px; }
        .ap-intro-section    { padding: 40px 0 30px; }
        .ap-section          { padding: 48px 0; }
        .ap-section--cta     { padding-bottom: 70px; }
        .ap-highlights-row   { grid-template-columns: 1fr; }
        .ap-docs-grid        { grid-template-columns: 1fr; }
        .ap-step-item        { grid-template-columns: 48px 1fr; }
        .ap-step-num         { width: 38px; height: 38px; font-size: 14px; border-radius: 12px; }
        .ap-cta-actions      { flex-direction: column; width: 100%; }
        .ap-cta-btn          { width: 100%; justify-content: center; }
        .ap-dates-table thead th,
        .ap-dates-table td   { padding: 12px 14px; font-size: 13px; }
        .ap-faq-summary      { font-size: 14px; padding: 15px 18px; }
        .ap-faq-answer       { padding: 0 18px 15px; }
    }

    /* ================================================================
    SEAT MATRIX PAGE  (sm-*)
    ================================================================ */

    /* ---- Layout ---- */
    .sm-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }

    /* ---- Tag ---- */
    .sm-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }
    .sm-tag i { font-size: 11px; color: #f5b800; }

    /* ---- Accent ---- */
    .sm-accent { color: #f5b800; }

    /* ---- Intro ---- */
    .sm-intro-section {
        background: linear-gradient(180deg, #ffffff 0%, #eef2fb 100%);
        padding: 52px 0 44px;
    }

    /* ---- Sections ---- */
    .sm-section             { padding: 72px 0; }
    .sm-section--cards      { background: #ffffff; }
    .sm-section--table      { background: linear-gradient(180deg, #f4f6ff 0%, #ffffff 100%); }
    .sm-section--reservation{ background: #ffffff; }
    .sm-section--info       { background: linear-gradient(180deg, #f4f6ff 0%, #ffffff 100%); }
    .sm-section--cta        { padding: 0 0 90px; background: linear-gradient(180deg, #eef2fb 0%, #ffffff 100%); }

    /* ---- Headers ---- */
    .sm-page-header,
    .sm-section-header {
        text-align: center;
        max-width: 840px;
        margin: 0 auto 44px;
    }

    .sm-page-title,
    .sm-section-title {
        font-size: clamp(26px, 3.2vw, 40px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .sm-page-subtitle,
    .sm-section-sub {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.85;
        margin: 0;
    }

    /* ---- Notice bar ---- */
    .sm-notice-bar {
        display: flex;
        align-items: flex-start;
        gap: 14px;
        padding: 16px 22px;
        border-radius: 14px;
        background: rgba(245,184,0,0.10);
        border: 1.5px solid rgba(245,184,0,0.35);
        max-width: 840px;
        margin: 0 auto;
    }

    .sm-notice-icon {
        font-size: 18px;
        color: #c98a00;
        flex-shrink: 0;
        margin-top: 2px;
    }

    .sm-notice-bar p {
        margin: 0;
        font-size: 13.5px;
        line-height: 1.7;
        color: #5a4000;
        font-weight: 700;
    }

    /* ================================================================
    SEAT CARDS
    ================================================================ */
    .sm-cards-grid {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        gap: 18px;
    }

    .sm-seat-card {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 20px;
        overflow: hidden;
        box-shadow: 0 14px 44px rgba(13,27,94,0.07);
        display: flex;
        flex-direction: column;
        transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s;
    }

    .sm-seat-card:hover {
        transform: translateY(-5px);
        border-color: rgba(245,184,0,0.35);
        box-shadow: 0 22px 60px rgba(13,27,94,0.12);
    }

    /* Card top colour bands */
    .sm-seat-card-top {
        padding: 20px 18px 16px;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
    }

    .sm-seat-card-top--bba  { background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%); }
    .sm-seat-card-top--bca  { background: linear-gradient(135deg, #1a3a6e 0%, #0d2a5e 100%); }
    .sm-seat-card-top--bsw  { background: linear-gradient(135deg, #163060 0%, #2040a0 100%); }
    .sm-seat-card-top--pmir { background: linear-gradient(135deg, #0d1b5e 0%, #2a1870 100%); }
    .sm-seat-card-top--msw  { background: linear-gradient(135deg, #14246e 0%, #1a3a7e 100%); }

    .sm-seat-icon {
        width: 48px;
        height: 48px;
        border-radius: 14px;
        background: rgba(255,255,255,0.14);
        border: 1.5px solid rgba(255,255,255,0.24);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 20px;
    }

    .sm-seat-type-badge {
        font-size: 10px;
        font-weight: 900;
        letter-spacing: 1px;
        text-transform: uppercase;
        color: #0d1b5e;
        background: #f5b800;
        padding: 3px 9px;
        border-radius: 50px;
    }

    .sm-seat-type-badge--pg {
        background: rgba(255,255,255,0.22);
        color: #ffffff;
        border: 1px solid rgba(255,255,255,0.35);
    }

    .sm-seat-card-body {
        padding: 18px 18px 0;
        flex: 1;
    }

    .sm-seat-abbr {
        font-size: 26px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 3px;
        line-height: 1;
    }

    .sm-seat-fullname {
        font-size: 12px;
        color: #5a6782;
        font-weight: 700;
        margin: 0 0 16px;
        line-height: 1.4;
    }

    .sm-seat-count-wrap {
        display: flex;
        align-items: center;
        gap: 0;
        background: linear-gradient(135deg, rgba(13,27,94,0.05), rgba(245,184,0,0.06));
        border: 1px solid rgba(13,27,94,0.08);
        border-radius: 12px;
        overflow: hidden;
        margin-bottom: 14px;
    }

    .sm-seat-count-item {
        flex: 1;
        padding: 10px 8px;
        text-align: center;
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .sm-seat-count-num {
        font-size: 22px;
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1;
    }

    .sm-seat-count-label {
        font-size: 10px;
        font-weight: 800;
        color: #5a6782;
        text-transform: uppercase;
        letter-spacing: 0.4px;
    }

    .sm-seat-divider {
        width: 1px;
        align-self: stretch;
        background: rgba(13,27,94,0.10);
    }

    /* Progress bar */
    .sm-seat-bar-wrap {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 14px;
    }

    .sm-seat-bar {
        flex: 1;
        height: 7px;
        background: rgba(13,27,94,0.08);
        border-radius: 50px;
        overflow: hidden;
    }

    .sm-seat-bar-fill {
        height: 100%;
        width: var(--fill, 0%);
        background: linear-gradient(90deg, #0d1b5e, #f5b800);
        border-radius: 50px;
        transition: width 1s ease;
    }

    .sm-seat-bar-label {
        font-size: 11px;
        font-weight: 800;
        color: #5a6782;
        white-space: nowrap;
    }

    /* Availability badge */
    .sm-avail-badge {
        display: inline-flex;
        align-items: center;
        padding: 4px 12px;
        border-radius: 50px;
        font-size: 11px;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        margin-bottom: 4px;
    }

    .sm-avail-badge--open   { background: rgba(22,163,74,0.10); color: #166534; border: 1px solid rgba(22,163,74,0.22); }
    .sm-avail-badge--limited{ background: rgba(245,184,0,0.14); color: #7a5000; border: 1px solid rgba(245,184,0,0.28); }
    .sm-avail-badge--full   { background: rgba(220,38,38,0.08); color: #991b1b; border: 1px solid rgba(220,38,38,0.18); }

    .sm-seat-card-footer {
        padding: 14px 18px 18px;
        border-top: 1px solid rgba(13,27,94,0.07);
        margin-top: auto;
    }

    .sm-apply-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        justify-content: center;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 900;
        font-size: 13px;
        padding: 10px 14px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,0.06);
        box-shadow: 0 6px 18px rgba(245,184,0,0.20);
        text-decoration: none;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
    }

    .sm-apply-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 26px rgba(245,184,0,0.28);
        filter: brightness(1.03);
        color: #0b1027;
    }

    /* ================================================================
    DETAILED TABLE
    ================================================================ */
    .sm-table-wrap {
        overflow-x: auto;
        border-radius: 16px;
        box-shadow: 0 16px 50px rgba(13,27,94,0.08);
        border: 1px solid rgba(13,27,94,0.10);
        margin-bottom: 16px;
    }

    .sm-table {
        width: 100%;
        border-collapse: collapse;
        background: #ffffff;
        font-size: 14px;
    }

    .sm-table thead tr {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
    }

    .sm-table thead th {
        padding: 15px 18px;
        text-align: left;
        color: #ffffff;
        font-size: 12px;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        white-space: nowrap;
    }

    .sm-table tbody tr {
        border-bottom: 1px solid rgba(13,27,94,0.07);
        transition: background 0.2s;
    }

    .sm-table tbody tr:last-child { border-bottom: none; }
    .sm-table tbody tr:hover { background: rgba(13,27,94,0.025); }

    .sm-table td {
        padding: 14px 18px;
        color: #334155;
        vertical-align: middle;
    }

    .sm-table td:nth-child(2) {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .sm-table-sl {
        font-weight: 900;
        color: #9ca3af;
        font-size: 13px;
    }

    .sm-table-prog {
        font-size: 15px;
        font-weight: 900;
        color: #0d1b5e;
    }

    .sm-table td:nth-child(2) span {
        font-size: 12px;
        color: #5a6782;
    }

    .sm-table-seats {
        font-size: 18px;
        font-weight: 900;
        color: #0d1b5e;
    }

    .sm-table-badge {
        display: inline-block;
        padding: 3px 10px;
        border-radius: 50px;
        font-size: 11px;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        white-space: nowrap;
    }

    .sm-table-badge--ug { background: rgba(13,27,94,0.08); color: #0d1b5e; border: 1px solid rgba(13,27,94,0.14); }
    .sm-table-badge--pg { background: rgba(245,184,0,0.13); color: #7a5000; border: 1px solid rgba(245,184,0,0.28); }

    .sm-table-status {
        display: inline-block;
        padding: 4px 12px;
        border-radius: 50px;
        font-size: 11px;
        font-weight: 900;
        white-space: nowrap;
    }

    .sm-table-status--open   { background: rgba(22,163,74,0.10); color: #166534; border: 1px solid rgba(22,163,74,0.20); }
    .sm-table-status--closed { background: rgba(220,38,38,0.08); color: #991b1b; border: 1px solid rgba(220,38,38,0.16); }
    .sm-table-status--soon   { background: rgba(217,119,6,0.10); color: #9a3412; border: 1px solid rgba(217,119,6,0.22); }

    .sm-table tfoot .sm-table-total {
        background: linear-gradient(90deg, rgba(13,27,94,0.04), rgba(245,184,0,0.04));
        border-top: 2px solid rgba(13,27,94,0.12);
    }

    .sm-table-total td {
        font-size: 14px;
        color: #0d1b5e;
        padding: 14px 18px;
    }

    .sm-table-total .sm-table-seats {
        font-size: 20px;
        color: #0d1b5e;
    }

    .sm-table-note {
        font-size: 13px;
        color: #5a6782;
        margin: 0;
    }

    .sm-table-note i { color: #f5b800; margin-right: 6px; }

    /* ================================================================
    RESERVATION GRID
    ================================================================ */
    .sm-res-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 18px;
        margin-bottom: 22px;
    }

    .sm-res-card {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 18px;
        padding: 24px 20px;
        box-shadow: 0 12px 38px rgba(13,27,94,0.06);
        transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
    }

    .sm-res-card:hover {
        transform: translateY(-4px);
        border-color: rgba(245,184,0,0.30);
        box-shadow: 0 18px 50px rgba(13,27,94,0.10);
    }

    .sm-res-icon {
        width: 48px;
        height: 48px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.26);
        color: #0d1b5e;
        font-size: 19px;
        margin-bottom: 14px;
    }

    .sm-res-title {
        font-size: 16px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 8px;
    }

    .sm-res-text {
        font-size: 13.5px;
        line-height: 1.75;
        color: #475569;
        margin: 0;
    }

    .sm-res-note {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding: 14px 20px;
        background: rgba(13,27,94,0.04);
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 12px;
        font-size: 13.5px;
        color: #334155;
        line-height: 1.65;
    }

    .sm-res-note i { color: #f5b800; font-size: 16px; flex-shrink: 0; margin-top: 2px; }

    /* ================================================================
    KEY INFO GRID
    ================================================================ */
    .sm-info-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 18px;
        max-width: 960px;
        margin: 0 auto;
    }

    .sm-info-item {
        display: flex;
        gap: 16px;
        align-items: flex-start;
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 16px;
        padding: 22px 20px;
        box-shadow: 0 10px 32px rgba(13,27,94,0.05);
    }

    .sm-info-num {
        font-size: 28px;
        font-weight: 900;
        color: rgba(13,27,94,0.12);
        line-height: 1;
        flex-shrink: 0;
        width: 44px;
        text-align: right;
    }

    .sm-info-title {
        font-size: 16px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 6px;
    }

    .sm-info-text {
        font-size: 13.5px;
        line-height: 1.75;
        color: #475569;
        margin: 0;
    }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .sm-cta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 28px 26px;
        border-radius: 22px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border: 1px solid rgba(245,184,0,0.22);
        flex-wrap: wrap;
    }

    .sm-cta-title {
        margin: 0 0 8px;
        color: #ffffff;
        font-weight: 1000;
        font-size: 22px;
    }

    .sm-cta-sub {
        margin: 0;
        color: rgba(255,255,255,0.78);
        line-height: 1.75;
        font-size: 14px;
        max-width: 520px;
    }

    .sm-cta-actions {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
    }

    .sm-cta-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 14px;
        padding: 13px 20px;
        font-weight: 1000;
        font-size: 14px;
        text-decoration: none;
        border: 1px solid transparent;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s, background 0.2s, border-color 0.2s;
    }

    .sm-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        box-shadow: 0 12px 28px rgba(245,184,0,0.26);
    }

    .sm-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 16px 38px rgba(245,184,0,0.34);
        filter: brightness(1.03);
        color: #0b1027;
    }

    .sm-cta-btn--outline {
        background: rgba(255,255,255,0.07);
        color: #ffffff;
        border-color: rgba(255,255,255,0.22);
    }

    .sm-cta-btn--outline:hover {
        transform: translateY(-2px);
        background: rgba(255,255,255,0.12);
        border-color: rgba(255,255,255,0.34);
    }

    /* ================================================================
    RESPONSIVE
    ================================================================ */
    @media (max-width: 1100px) {
        .sm-cards-grid  { grid-template-columns: repeat(3, 1fr); }
        .sm-res-grid    { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 991px) {
        .sm-cards-grid  { grid-template-columns: repeat(2, 1fr); }
        .sm-info-grid   { grid-template-columns: 1fr; }
        .sm-cta         { flex-direction: column; align-items: flex-start; }
        .sm-cta-actions { width: 100%; }
    }

    @media (max-width: 767px) {
        .sm-container    { padding: 0 18px; }
        .sm-intro-section{ padding: 40px 0 28px; }
        .sm-section      { padding: 48px 0; }
        .sm-section--cta { padding-bottom: 70px; }
        .sm-cards-grid   { grid-template-columns: 1fr; }
        .sm-res-grid     { grid-template-columns: 1fr; }
        .sm-cta-actions  { flex-direction: column; width: 100%; }
        .sm-cta-btn      { width: 100%; justify-content: center; }
        .sm-table thead th,
        .sm-table td     { padding: 11px 13px; font-size: 13px; }
    }

    /* ================================================================
    COURSE FEES PAGE  (cf-*)
    ================================================================ */

    /* ---- Layout ---- */
    .cf-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }

    /* ---- Tag ---- */
    .cf-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }
    .cf-tag i { font-size: 11px; color: #f5b800; }
    .cf-tag--ug { background: rgba(13,27,94,0.09); border-color: rgba(13,27,94,0.18); }
    .cf-tag--pg { background: rgba(245,184,0,0.10); border-color: rgba(245,184,0,0.28); color: #7a5000; }
    .cf-tag--pg i { color: #c98a00; }

    /* ---- Accent ---- */
    .cf-accent { color: #f5b800; }

    /* ---- Intro ---- */
    .cf-intro-section {
        background: linear-gradient(180deg, #ffffff 0%, #eef2fb 100%);
        padding: 52px 0 44px;
    }

    /* ---- Sections ---- */
    .cf-section            { padding: 72px 0; }
    .cf-section--ug        { background: #ffffff; }
    .cf-section--pg        { background: linear-gradient(180deg, #f4f6ff 0%, #ffffff 100%); }
    .cf-section--table     { background: #ffffff; }
    .cf-section--scholarship { background: linear-gradient(180deg, #f4f6ff 0%, #ffffff 100%); }
    .cf-section--payment   { background: #ffffff; }
    .cf-section--cta       { padding: 0 0 90px; background: linear-gradient(180deg, #eef2fb 0%, #ffffff 100%); }

    /* ---- Headers ---- */
    .cf-page-header,
    .cf-section-header {
        text-align: center;
        max-width: 840px;
        margin: 0 auto 44px;
    }
    .cf-section-header--left { text-align: left; margin-left: 0; margin-right: 0; }

    .cf-page-title,
    .cf-section-title {
        font-size: clamp(26px, 3.2vw, 40px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }
    .cf-page-subtitle,
    .cf-section-sub {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.85;
        margin: 0;
    }

    /* ---- Intro highlights ---- */
    .cf-intro-highlights {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 14px;
        margin-bottom: 28px;
    }
    .cf-intro-highlight {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 16px 18px;
        border-radius: 16px;
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        box-shadow: 0 8px 26px rgba(13,27,94,0.06);
    }
    .cf-intro-highlight-icon {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        font-size: 18px;
        color: #f5b800;
        background: linear-gradient(135deg, rgba(13,27,94,0.18), rgba(245,184,0,0.10));
        border: 1px solid rgba(13,27,94,0.12);
    }
    .cf-intro-highlight-text { display: flex; flex-direction: column; gap: 2px; }
    .cf-intro-highlight-text strong { font-size: 13.5px; font-weight: 900; color: #0d1b5e; }
    .cf-intro-highlight-text span   { font-size: 12px; color: #5a6782; }

    /* ---- Disclaimer bar ---- */
    .cf-disclaimer-bar {
        display: flex;
        align-items: flex-start;
        gap: 14px;
        padding: 16px 22px;
        border-radius: 14px;
        background: rgba(245,184,0,0.09);
        border: 1.5px solid rgba(245,184,0,0.34);
        max-width: 840px;
        margin: 0 auto;
    }
    .cf-disclaimer-icon { font-size: 18px; color: #c98a00; flex-shrink: 0; margin-top: 2px; }
    .cf-disclaimer-bar p { margin: 0; font-size: 13.5px; line-height: 1.7; color: #5a4000; font-weight: 700; }

    /* ================================================================
    UG FEE CARDS
    ================================================================ */
    .cf-fee-cards-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 22px;
    }

    /* Course fee matrix (replaces card grid on course-fees.php) */
    .cf-fee-matrix-table { min-width: 920px; }
    .cf-fee-matrix-table__course {
        min-width: 200px;
        max-width: 260px;
        text-align: left;
        vertical-align: top;
    }
    .cf-fee-matrix-table thead .cf-fee-matrix-table__course {
        min-width: 200px;
    }
    .cf-fee-matrix-table__pdf {
        width: 1%;
        white-space: nowrap;
        text-align: center;
    }
    .cf-fee-matrix-course__abbr {
        display: block;
        font-size: 15px;
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1.25;
    }
    .cf-fee-matrix-course__full {
        display: block;
        font-size: 11.5px;
        font-weight: 600;
        color: #5a6782;
        line-height: 1.35;
        margin-top: 4px;
    }
    .cf-fee-matrix-course__badge {
        display: inline-block;
        margin-top: 8px;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        color: #0d1b5e;
        background: rgba(245,184,0,0.35);
        padding: 3px 8px;
        border-radius: 50px;
    }
    .cf-fee-matrix-table tbody th.cf-fee-matrix-table__course {
        padding: 14px 18px;
        background: rgba(13,27,94,0.03);
        border-right: 1px solid rgba(13,27,94,0.07);
    }
    .cf-fee-matrix-table td {
        text-align: center;
        font-weight: 700;
        font-size: 13.5px;
    }
    .cf-fee-matrix-muted { color: #9ca3af; font-weight: 600; }
    .cf-fee-matrix-pdf-wrap .cf-enquire-btn {
        padding: 8px 12px;
        font-size: 11.5px;
        white-space: nowrap;
    }
    .cf-enquire-btn--pdf-sm {
        padding: 7px 11px !important;
        font-size: 11px !important;
    }

    .cf-fee-card {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 22px;
        overflow: hidden;
        box-shadow: 0 16px 50px rgba(13,27,94,0.07);
        display: flex;
        flex-direction: column;
        transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s;
    }
    .cf-fee-card:hover {
        transform: translateY(-5px);
        border-color: rgba(245,184,0,0.35);
        box-shadow: 0 24px 64px rgba(13,27,94,0.11);
    }

    /* Card header colour bands */
    .cf-fee-card-header {
        padding: 22px 22px 18px;
        display: flex;
        align-items: center;
        gap: 14px;
        flex-wrap: wrap;
    }
    .cf-fee-card-header--bba,
    .cf-fee-card-header--default { background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%); }
    .cf-fee-card-header--bca { background: linear-gradient(135deg, #1a3a6e 0%, #0d2a5e 100%); }
    .cf-fee-card-header--bsw { background: linear-gradient(135deg, #163060 0%, #2040a0 100%); }
    .cf-fee-card-header--pmir { background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%); }
    .cf-fee-card-header--msw { background: linear-gradient(135deg, #163060 0%, #2040a0 100%); }

    .cf-fee-icon {
        width: 50px;
        height: 50px;
        border-radius: 14px;
        background: rgba(255,255,255,0.14);
        border: 1.5px solid rgba(255,255,255,0.24);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 20px;
        flex-shrink: 0;
    }

    .cf-fee-card-title-group { flex: 1; min-width: 0; }
    .cf-fee-prog-abbr  { font-size: 22px; font-weight: 900; color: #ffffff; margin: 0 0 2px; }
    .cf-fee-prog-full  { font-size: 11.5px; color: rgba(255,255,255,0.75); margin: 0; line-height: 1.35; }

    .cf-fee-type-badge {
        font-size: 10px;
        font-weight: 900;
        letter-spacing: 0.7px;
        text-transform: uppercase;
        color: #0d1b5e;
        background: #f5b800;
        padding: 4px 10px;
        border-radius: 50px;
        white-space: nowrap;
        align-self: flex-start;
    }

    /* Card body */
    .cf-fee-card-body { padding: 20px 22px 0; flex: 1; }

    .cf-fee-amount-row {
        display: flex;
        gap: 0;
        background: linear-gradient(135deg, rgba(13,27,94,0.05), rgba(245,184,0,0.05));
        border: 1px solid rgba(13,27,94,0.08);
        border-radius: 14px;
        overflow: hidden;
        margin-bottom: 18px;
    }
    .cf-fee-amount-row--pg { max-width: 380px; }

    .cf-fee-amount-block {
        flex: 1;
        padding: 14px 12px;
        text-align: center;
        display: flex;
        flex-direction: column;
        gap: 4px;
        border-right: 1px solid rgba(13,27,94,0.08);
    }
    .cf-fee-amount-block:last-child { border-right: none; }

    .cf-fee-amount-label {
        font-size: 10px;
        font-weight: 800;
        color: #5a6782;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    .cf-fee-amount-val {
        font-size: 16px;
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1.2;
    }
    .cf-fee-amount-val--sm { font-size: 13px; color: #5a6782; font-weight: 700; }

    /* Fee includes list */
    .cf-fee-includes {
        list-style: none;
        margin: 0 0 18px;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 7px;
    }
    .cf-fee-includes--inline {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 6px 18px;
        margin-bottom: 16px;
    }
    .cf-fee-includes li {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 13.5px;
        color: #334155;
        font-weight: 700;
    }
    .cf-fee-includes li i { color: #f5b800; font-size: 12px; flex-shrink: 0; }

    /* Rich-text fee breakdown (CKEditor) on course fees cards */
    .cf-fee-includes--html {
        margin: 0 0 18px;
        font-size: 13.5px;
        color: #334155;
        font-weight: 700;
        line-height: 1.5;
    }
    .cf-fee-includes--html p { margin: 0 0 8px; }
    .cf-fee-includes--html p:last-child { margin-bottom: 0; }
    .cf-fee-includes--html ul,
    .cf-fee-includes--html ol {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 7px;
    }
    .cf-fee-includes--html li {
        display: flex;
        align-items: flex-start;
        gap: 8px;
    }
    .cf-fee-includes--html li::before {
        content: '\2713';
        color: #f5b800;
        font-size: 12px;
        line-height: 1.4;
        flex-shrink: 0;
        margin-top: 2px;
        font-weight: 900;
    }
    .cf-fee-includes--html ul ul,
    .cf-fee-includes--html ol ol { margin-top: 6px; padding-left: 8px; }

    /* Card footer / enquire button */
    .cf-fee-card-footer {
        padding: 14px 22px 20px;
        border-top: 1px solid rgba(13,27,94,0.07);
        margin-top: auto;
    }

    .cf-enquire-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        justify-content: center;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        color: #ffffff;
        font-weight: 900;
        font-size: 13px;
        padding: 11px 16px;
        border-radius: 12px;
        border: none;
        box-shadow: 0 8px 22px rgba(13,27,94,0.20);
        text-decoration: none;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
    }
    .cf-enquire-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 12px 30px rgba(13,27,94,0.28);
        filter: brightness(1.08);
        color: #ffffff;
    }
    .cf-enquire-btn--pg { width: auto; }

    /* Fee card: download PDF (course-fees.php) */
    .cf-enquire-btn--pdf {
        background: linear-gradient(135deg, #991b1b 0%, #b91c1c 48%, #7f1d1d 100%);
        box-shadow: 0 8px 22px rgba(153, 27, 27, 0.22);
    }
    .cf-enquire-btn--pdf:hover {
        box-shadow: 0 12px 30px rgba(153, 27, 27, 0.30);
        filter: brightness(1.06);
    }

    /* ================================================================
    PG FEE CARDS
    ================================================================ */
    .cf-pg-fee-grid {
        display: flex;
        flex-direction: column;
        gap: 22px;
    }

    .cf-pg-fee-card {
        display: flex;
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 22px;
        overflow: hidden;
        box-shadow: 0 16px 50px rgba(13,27,94,0.07);
        transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s;
    }
    .cf-pg-fee-card:hover {
        transform: translateY(-4px);
        border-color: rgba(245,184,0,0.35);
        box-shadow: 0 22px 60px rgba(13,27,94,0.11);
    }

    .cf-pg-fee-left {
        width: 100px;
        flex-shrink: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        padding: 26px 14px;
        gap: 12px;
    }
    .cf-pg-fee-left--pmir { background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%); }
    .cf-pg-fee-left--msw  { background: linear-gradient(135deg, #163060 0%, #2040a0 100%); }

    .cf-pg-fee-icon {
        width: 56px;
        height: 56px;
        border-radius: 16px;
        background: rgba(255,255,255,0.14);
        border: 1.5px solid rgba(255,255,255,0.24);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 22px;
    }
    .cf-pg-type-badge {
        font-size: 10px;
        font-weight: 900;
        letter-spacing: 1px;
        text-transform: uppercase;
        color: #0d1b5e;
        background: #f5b800;
        padding: 3px 9px;
        border-radius: 50px;
    }

    .cf-pg-fee-right {
        flex: 1;
        padding: 24px 26px;
        border-left: 1px solid rgba(13,27,94,0.07);
    }
    .cf-pg-fee-title-row { margin-bottom: 16px; }
    .cf-pg-fee-abbr { font-size: 24px; font-weight: 900; color: #0d1b5e; margin: 0 0 3px; line-height: 1; }
    .cf-pg-fee-full { font-size: 13px; color: #5a6782; font-weight: 700; margin: 0 0 8px; }
    .cf-pg-duration-pill {
        display: inline-block;
        padding: 3px 10px;
        border-radius: 50px;
        font-size: 11px;
        font-weight: 800;
        background: rgba(13,27,94,0.07);
        color: #0d1b5e;
        border: 1px solid rgba(13,27,94,0.12);
    }

    /* ================================================================
    FEE COMPONENTS TABLE
    ================================================================ */
    .cf-table-wrap {
        overflow-x: auto;
        border-radius: 16px;
        box-shadow: 0 16px 50px rgba(13,27,94,0.08);
        border: 1px solid rgba(13,27,94,0.10);
        margin-bottom: 16px;
    }
    .cf-table {
        width: 100%;
        border-collapse: collapse;
        background: #ffffff;
        font-size: 14px;
    }
    .cf-table thead tr { background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%); }
    .cf-table thead th {
        padding: 15px 18px;
        text-align: left;
        color: #ffffff;
        font-size: 12px;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        white-space: nowrap;
    }
    .cf-table tbody tr { border-bottom: 1px solid rgba(13,27,94,0.07); transition: background 0.2s; }
    .cf-table tbody tr:last-child { border-bottom: none; }
    .cf-table tbody tr:hover { background: rgba(13,27,94,0.025); }
    .cf-table td { padding: 14px 18px; color: #334155; vertical-align: middle; }
    .cf-table td strong { color: #0d1b5e; font-weight: 800; }
    .cf-table-sl { font-weight: 900; color: #9ca3af; font-size: 13px; }

    .cf-freq-badge {
        display: inline-block;
        padding: 3px 10px;
        border-radius: 50px;
        font-size: 11px;
        font-weight: 900;
        white-space: nowrap;
    }
    .cf-freq-badge--sem  { background: rgba(13,27,94,0.08); color: #0d1b5e; border: 1px solid rgba(13,27,94,0.14); }
    .cf-freq-badge--ann  { background: rgba(245,184,0,0.13); color: #7a5000; border: 1px solid rgba(245,184,0,0.28); }
    .cf-freq-badge--once { background: rgba(22,163,74,0.09); color: #166534; border: 1px solid rgba(22,163,74,0.20); }

    .cf-table-note { font-size: 13px; color: #5a6782; margin: 0; }
    .cf-table-note i { color: #f5b800; margin-right: 6px; }

    /* ================================================================
    SCHOLARSHIP GRID
    ================================================================ */
    .cf-scholar-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 18px;
    }
    .cf-scholar-card {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 18px;
        padding: 24px 20px;
        box-shadow: 0 12px 38px rgba(13,27,94,0.06);
        transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
    }
    .cf-scholar-card:hover {
        transform: translateY(-4px);
        border-color: rgba(245,184,0,0.30);
        box-shadow: 0 18px 50px rgba(13,27,94,0.10);
    }
    .cf-scholar-icon {
        width: 50px;
        height: 50px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.26);
        color: #0d1b5e;
        font-size: 20px;
        margin-bottom: 14px;
    }
    .cf-scholar-title { font-size: 16px; font-weight: 900; color: #0d1b5e; margin: 0 0 8px; }
    .cf-scholar-text  { font-size: 13.5px; line-height: 1.75; color: #475569; margin: 0; }

    /* ================================================================
    PAYMENT SPLIT LAYOUT
    ================================================================ */
    .cf-payment-split {
        display: grid;
        grid-template-columns: 1fr 360px;
        gap: 32px;
        align-items: start;
    }

    .cf-pay-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 16px;
    }
    .cf-pay-list li {
        display: flex;
        align-items: flex-start;
        gap: 14px;
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.09);
        border-radius: 14px;
        padding: 18px 20px;
        box-shadow: 0 8px 26px rgba(13,27,94,0.05);
    }
    .cf-pay-icon {
        width: 42px;
        height: 42px;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.24);
        color: #0d1b5e;
        font-size: 17px;
        flex-shrink: 0;
        margin-top: 1px;
    }
    .cf-pay-text { display: flex; flex-direction: column; gap: 4px; }
    .cf-pay-text strong { font-size: 14.5px; font-weight: 900; color: #0d1b5e; }
    .cf-pay-text span   { font-size: 13.5px; line-height: 1.7; color: #475569; }

    /* Contact aside card */
    .cf-contact-card {
        background: linear-gradient(180deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 22px;
        padding: 26px 24px;
        border: 1px solid rgba(245,184,0,0.20);
        box-shadow: 0 20px 56px rgba(13,27,94,0.22);
    }
    .cf-contact-card-top {
        display: flex;
        align-items: center;
        gap: 12px;
        margin-bottom: 12px;
    }
    .cf-contact-card-top i {
        font-size: 22px;
        color: #f5b800;
    }
    .cf-contact-card-top h3 {
        font-size: 17px;
        font-weight: 900;
        color: #ffffff;
        margin: 0;
        line-height: 1.3;
    }
    .cf-contact-card p {
        font-size: 13.5px;
        color: rgba(255,255,255,0.72);
        line-height: 1.7;
        margin: 0 0 18px;
    }
    .cf-contact-list {
        list-style: none;
        margin: 0 0 20px;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .cf-contact-list li {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 13.5px;
        color: rgba(255,255,255,0.85);
    }
    .cf-contact-list li i { color: #f5b800; font-size: 14px; width: 16px; flex-shrink: 0; }
    .cf-contact-list li a {
        color: rgba(255,255,255,0.85);
        text-decoration: none;
        transition: color 0.2s;
    }
    .cf-contact-list li a:hover { color: #f5b800; }
    .cf-contact-card-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        justify-content: center;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 900;
        font-size: 14px;
        padding: 12px 18px;
        border-radius: 12px;
        text-decoration: none;
        box-shadow: 0 8px 22px rgba(245,184,0,0.26);
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
    }
    .cf-contact-card-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 12px 30px rgba(245,184,0,0.34);
        filter: brightness(1.03);
        color: #0b1027;
    }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .cf-cta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 28px 26px;
        border-radius: 22px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border: 1px solid rgba(245,184,0,0.22);
        flex-wrap: wrap;
    }
    .cf-cta-title { margin: 0 0 8px; color: #ffffff; font-weight: 1000; font-size: 22px; }
    .cf-cta-sub   { margin: 0; color: rgba(255,255,255,0.78); line-height: 1.75; font-size: 14px; max-width: 520px; }
    .cf-cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }
    .cf-cta-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 14px;
        padding: 13px 20px;
        font-weight: 1000;
        font-size: 14px;
        text-decoration: none;
        border: 1px solid transparent;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s, background 0.2s, border-color 0.2s;
    }
    .cf-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        box-shadow: 0 12px 28px rgba(245,184,0,0.26);
    }
    .cf-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 16px 38px rgba(245,184,0,0.34);
        filter: brightness(1.03);
        color: #0b1027;
    }
    .cf-cta-btn--outline {
        background: rgba(255,255,255,0.07);
        color: #ffffff;
        border-color: rgba(255,255,255,0.22);
    }
    .cf-cta-btn--outline:hover {
        transform: translateY(-2px);
        background: rgba(255,255,255,0.12);
        border-color: rgba(255,255,255,0.34);
    }

    /* ================================================================
    RESPONSIVE
    ================================================================ */
    @media (max-width: 1100px) {
        .cf-scholar-grid      { grid-template-columns: repeat(2, 1fr); }
        .cf-payment-split     { grid-template-columns: 1fr; }
    }
    @media (max-width: 991px) {
        .cf-intro-highlights  { grid-template-columns: repeat(2, 1fr); }
        .cf-fee-cards-grid    { grid-template-columns: repeat(2, 1fr); }
        .cf-pg-fee-card       { flex-direction: column; }
        .cf-pg-fee-left       {
            width: 100%;
            flex-direction: row;
            justify-content: flex-start;
            padding: 18px 22px 0;
            gap: 12px;
        }
        .cf-pg-fee-right      { border-left: none; border-top: 1px solid rgba(13,27,94,0.07); padding: 18px 22px 22px; }
        .cf-cta               { flex-direction: column; align-items: flex-start; }
        .cf-cta-actions       { width: 100%; }
    }
    @media (max-width: 767px) {
        .cf-container         { padding: 0 18px; }
        .cf-intro-section     { padding: 40px 0 30px; }
        .cf-section           { padding: 48px 0; }
        .cf-section--cta      { padding-bottom: 70px; }
        .cf-intro-highlights  { grid-template-columns: 1fr; }
        .cf-fee-cards-grid    { grid-template-columns: 1fr; }
        .cf-scholar-grid      { grid-template-columns: 1fr; }
        .cf-fee-amount-row    { flex-direction: column; }
        .cf-fee-amount-block  { border-right: none; border-bottom: 1px solid rgba(13,27,94,0.08); }
        .cf-fee-amount-block:last-child { border-bottom: none; }
        .cf-cta-actions       { flex-direction: column; width: 100%; }
        .cf-cta-btn           { width: 100%; justify-content: center; }
        .cf-table thead th,
        .cf-table td          { padding: 11px 13px; font-size: 13px; }
        .cf-fee-matrix-table,
        .cf-fee-matrix-table thead,
        .cf-fee-matrix-table tbody,
        .cf-fee-matrix-table tr,
        .cf-fee-matrix-table th,
        .cf-fee-matrix-table td { display: block; width: 100%; }
        .cf-fee-matrix-table thead { display: none; }
        .cf-fee-matrix-table tbody tr {
            margin-bottom: 18px;
            border: 1px solid rgba(13,27,94,0.10);
            border-radius: 14px;
            overflow: hidden;
            background: #fff;
        }
        .cf-fee-matrix-table tbody th.cf-fee-matrix-table__course,
        .cf-fee-matrix-table tbody td {
            display: block;
            text-align: left;
            border: none;
            padding: 12px 16px;
        }
        .cf-fee-matrix-table tbody td::before {
            content: attr(data-label);
            display: block;
            font-size: 10px;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: 0.4px;
            color: #5a6782;
            margin-bottom: 4px;
        }
        .cf-fee-matrix-table tbody th.cf-fee-matrix-table__course::before { content: none; }
        .cf-fee-matrix-table__pdf { text-align: left; }
    }

    /* ================================================================
    APPLICATION FORM PAGE  (af-*)
    ================================================================ */

    /* ---- Layout ---- */
    .af-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }

    /* ---- Tag ---- */
    .af-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }
    .af-tag i { font-size: 11px; color: #f5b800; }

    /* ---- Accent / required star ---- */
    .af-accent        { color: #f5b800; }
    .af-required-star { color: #dc2626; font-weight: 900; }

    /* ---- Intro section ---- */
    .af-intro-section {
        background: linear-gradient(180deg, #ffffff 0%, #eef2fb 100%);
        padding: 52px 0 48px;
    }

    .af-intro-grid {
        display: grid;
        grid-template-columns: 1fr 400px;
        gap: 36px;
        align-items: start;
    }

    .af-intro-title {
        font-size: clamp(24px, 3vw, 38px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 14px;
        line-height: 1.2;
    }

    .af-intro-text {
        font-size: 15px;
        line-height: 1.85;
        color: #475569;
        margin: 0 0 20px;
    }

    .af-intro-promises {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 9px;
    }
    .af-intro-promises li {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 14px;
        font-weight: 700;
        color: #334155;
    }
    .af-intro-promises li i { color: #f5b800; font-size: 13px; flex-shrink: 0; }

    /* Steps aside card */
    .af-steps-card {
        background: linear-gradient(180deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 20px;
        padding: 24px 22px;
        border: 1px solid rgba(245,184,0,0.20);
        box-shadow: 0 20px 56px rgba(13,27,94,0.22);
    }
    .af-steps-card-title {
        font-size: 15px;
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 18px;
        display: flex;
        align-items: center;
        gap: 10px;
    }
    .af-steps-card-title i { color: #f5b800; }

    .af-steps-mini-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 12px;
        counter-reset: none;
    }
    .af-steps-mini-list li {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        font-size: 13.5px;
        color: rgba(255,255,255,0.82);
        line-height: 1.5;
    }
    .af-mini-step-num {
        width: 26px;
        height: 26px;
        border-radius: 8px;
        background: rgba(245,184,0,0.22);
        border: 1.5px solid rgba(245,184,0,0.45);
        color: #f5b800;
        font-size: 12px;
        font-weight: 900;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }

    /* ---- Generic sections ---- */
    .af-section         { padding: 72px 0; }
    .af-section--form   { background: linear-gradient(180deg, #f4f6ff 0%, #ffffff 100%); }
    .af-section--why    { background: #ffffff; }
    .af-section--cta    { padding: 0 0 90px; background: linear-gradient(180deg, #eef2fb 0%, #ffffff 100%); }

    /* ---- Section header ---- */
    .af-section-header {
        text-align: center;
        max-width: 840px;
        margin: 0 auto 44px;
    }
    .af-section-title {
        font-size: clamp(26px, 3.2vw, 40px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }
    .af-section-sub {
        font-size: 15px;
        color: #5a6782;
        line-height: 1.85;
        margin: 0;
    }

    /* ================================================================
    FORM + SIDEBAR LAYOUT
    ================================================================ */
    .af-form-layout {
        display: grid;
        grid-template-columns: 1fr 320px;
        gap: 28px;
        align-items: start;
    }

    /* ---- Form panel ---- */
    .af-form-panel {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 24px;
        overflow: hidden;
        box-shadow: 0 20px 60px rgba(13,27,94,0.08);
    }

    .af-form-panel-header {
        padding: 28px 32px 0;
    }
    .af-form-panel-title {
        font-size: 26px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 6px;
        line-height: 1.2;
    }
    .af-form-panel-sub {
        font-size: 13px;
        color: #5a6782;
        margin: 0 0 4px;
    }

    /* ---- Form ---- */
    .af-form { padding: 24px 32px 32px; }

    /* Fieldset */
    .af-fieldset {
        border: none;
        margin: 0 0 28px;
        padding: 0;
    }
    .af-legend {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 14px;
        font-weight: 900;
        color: #0d1b5e;
        padding: 0;
        margin-bottom: 16px;
        width: 100%;
        border-bottom: 2px solid rgba(13,27,94,0.08);
        padding-bottom: 10px;
    }
    .af-legend i { color: #f5b800; font-size: 15px; }

    /* Form grid */
    .af-form-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }
    .af-field      { display: flex; flex-direction: column; gap: 6px; }
    .af-field--full{ grid-column: 1 / -1; }

    .af-label {
        font-size: 13px;
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
    }
    .af-input {
        padding: 11px 14px;
        border: 1.5px solid rgba(13,27,94,0.14);
        border-radius: 12px;
        font-size: 14px;
        color: #1e293b;
        background: #fafbff;
        outline: none;
        transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
        width: 100%;
        box-sizing: border-box;
        font-family: inherit;
    }
    .af-input:focus {
        border-color: #0d1b5e;
        background: #ffffff;
        box-shadow: 0 0 0 3px rgba(13,27,94,0.10);
    }
    .af-input::placeholder { color: #94a3b8; }
    .af-select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%230d1b5e' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 36px; cursor: pointer; }
    .af-textarea { resize: vertical; min-height: 80px; }

    /* ---- Radio group ---- */
    .af-radio-group {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }
    .af-radio-label {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        cursor: pointer;
        font-size: 13.5px;
        font-weight: 700;
        color: #334155;
        padding: 8px 14px;
        border-radius: 50px;
        border: 1.5px solid rgba(13,27,94,0.14);
        background: #fafbff;
        transition: border-color 0.2s, background 0.2s, color 0.2s;
        user-select: none;
    }
    .af-radio { display: none; }
    .af-radio-custom {
        width: 16px;
        height: 16px;
        border-radius: 50%;
        border: 2px solid rgba(13,27,94,0.25);
        background: #ffffff;
        display: inline-block;
        flex-shrink: 0;
        transition: border-color 0.2s, background 0.2s;
        position: relative;
    }
    .af-radio:checked + .af-radio-custom {
        border-color: #0d1b5e;
        background: #0d1b5e;
        box-shadow: inset 0 0 0 3px #ffffff;
    }
    .af-radio:checked ~ span:last-child { color: #0d1b5e; }
    .af-radio-label:has(.af-radio:checked) {
        border-color: rgba(13,27,94,0.35);
        background: rgba(13,27,94,0.05);
        color: #0d1b5e;
    }

    /* ---- Declaration checkbox ---- */
    .af-declaration { margin-bottom: 22px; }
    .af-checkbox-label {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        cursor: pointer;
        font-size: 13.5px;
        color: #475569;
        line-height: 1.65;
        user-select: none;
    }
    .af-checkbox { display: none; }
    .af-checkbox-custom {
        width: 20px;
        height: 20px;
        border-radius: 6px;
        border: 2px solid rgba(13,27,94,0.25);
        background: #fafbff;
        flex-shrink: 0;
        margin-top: 2px;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: border-color 0.2s, background 0.2s;
        position: relative;
    }
    .af-checkbox:checked + .af-checkbox-custom {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        border-color: #f5b800;
    }
    .af-checkbox:checked + .af-checkbox-custom::after {
        content: '';
        width: 5px;
        height: 9px;
        border: 2.5px solid #0d1b5e;
        border-top: none;
        border-left: none;
        transform: rotate(45deg) translateY(-1px);
        display: block;
    }

    /* ---- Submit row ---- */
    .af-submit-row {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
        margin-bottom: 16px;
    }
    .af-submit-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 900;
        font-size: 15px;
        padding: 14px 28px;
        border-radius: 14px;
        border: none;
        box-shadow: 0 12px 30px rgba(245,184,0,0.26);
        cursor: pointer;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
    }
    .af-submit-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 16px 38px rgba(245,184,0,0.34);
        filter: brightness(1.04);
    }
    .af-reset-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.06);
        color: #0d1b5e;
        font-weight: 800;
        font-size: 14px;
        padding: 14px 22px;
        border-radius: 14px;
        border: 1.5px solid rgba(13,27,94,0.14);
        cursor: pointer;
        transition: background 0.2s, border-color 0.2s;
    }
    .af-reset-btn:hover {
        background: rgba(13,27,94,0.10);
        border-color: rgba(13,27,94,0.24);
    }
    .af-privacy-note {
        font-size: 12.5px;
        color: #9ca3af;
        display: flex;
        align-items: center;
        gap: 6px;
        margin: 0;
    }
    .af-privacy-note i { color: #0d1b5e; font-size: 12px; }

    /* ================================================================
    SIDEBAR
    ================================================================ */
    .af-sidebar {
        display: flex;
        flex-direction: column;
        gap: 18px;
        position: sticky;
        top: 90px;
    }

    .af-sidebar-card {
        border-radius: 18px;
        padding: 22px 20px;
        box-shadow: 0 12px 40px rgba(13,27,94,0.08);
    }

    .af-sidebar-card--contact {
        background: linear-gradient(180deg, #0d1b5e 0%, #1a2f8a 100%);
        border: 1px solid rgba(245,184,0,0.20);
    }
    .af-sidebar-card--contact .af-sidebar-card-top {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 10px;
    }
    .af-sidebar-card--contact .af-sidebar-card-top i { font-size: 20px; color: #f5b800; }
    .af-sidebar-card--contact .af-sidebar-card-top h3 { font-size: 16px; font-weight: 900; color: #ffffff; margin: 0; }
    .af-sidebar-card--contact p { font-size: 13px; color: rgba(255,255,255,0.70); margin: 0 0 14px; line-height: 1.65; }

    .af-sidebar-contact-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 9px;
    }
    .af-sidebar-contact-list li {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        color: rgba(255,255,255,0.82);
    }
    .af-sidebar-contact-list li i { color: #f5b800; font-size: 13px; width: 14px; flex-shrink: 0; }
    .af-sidebar-contact-list li a { color: rgba(255,255,255,0.82); text-decoration: none; }
    .af-sidebar-contact-list li a:hover { color: #f5b800; }

    .af-sidebar-card--docs,
    .af-sidebar-card--links {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
    }

    .af-sidebar-sub-title {
        font-size: 14px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 14px;
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .af-sidebar-sub-title i { color: #f5b800; }

    .af-sidebar-doc-list {
        list-style: none;
        margin: 0 0 14px;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 7px;
    }
    .af-sidebar-doc-list li {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        color: #475569;
        font-weight: 650;
    }
    .af-sidebar-doc-list li i { color: #f5b800; font-size: 9px; flex-shrink: 0; }

    .af-sidebar-link {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        font-weight: 900;
        color: #0d1b5e;
        text-decoration: none;
        transition: color 0.2s, gap 0.2s;
    }
    .af-sidebar-link:hover { color: #f5b800; gap: 12px; }

    .af-sidebar-quick-links {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 0;
    }
    .af-sidebar-quick-links li a {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 9px 6px;
        font-size: 13.5px;
        font-weight: 700;
        color: #334155;
        text-decoration: none;
        border-bottom: 1px solid rgba(13,27,94,0.06);
        transition: color 0.2s, padding-left 0.2s;
    }
    .af-sidebar-quick-links li:last-child a { border-bottom: none; }
    .af-sidebar-quick-links li a:hover { color: #0d1b5e; padding-left: 12px; }
    .af-sidebar-quick-links li a i { font-size: 10px; color: #f5b800; }

    /* ================================================================
    WHY CARDS
    ================================================================ */
    .af-why-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 18px;
    }
    .af-why-card {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 18px;
        padding: 24px 20px;
        box-shadow: 0 12px 38px rgba(13,27,94,0.06);
        transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
    }
    .af-why-card:hover {
        transform: translateY(-4px);
        border-color: rgba(245,184,0,0.30);
        box-shadow: 0 20px 52px rgba(13,27,94,0.10);
    }
    .af-why-icon {
        width: 50px;
        height: 50px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.26);
        color: #0d1b5e;
        font-size: 20px;
        margin-bottom: 14px;
    }
    .af-why-title { font-size: 16px; font-weight: 900; color: #0d1b5e; margin: 0 0 8px; }
    .af-why-text  { font-size: 13.5px; line-height: 1.75; color: #475569; margin: 0; }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .af-cta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 28px 26px;
        border-radius: 22px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border: 1px solid rgba(245,184,0,0.22);
        flex-wrap: wrap;
    }
    .af-cta-title { margin: 0 0 8px; color: #ffffff; font-weight: 1000; font-size: 22px; }
    .af-cta-sub   { margin: 0; color: rgba(255,255,255,0.78); line-height: 1.75; font-size: 14px; max-width: 520px; }
    .af-cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }
    .af-cta-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 14px;
        padding: 13px 20px;
        font-weight: 1000;
        font-size: 14px;
        text-decoration: none;
        border: 1px solid transparent;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s, background 0.2s, border-color 0.2s;
    }
    .af-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        box-shadow: 0 12px 28px rgba(245,184,0,0.26);
    }
    .af-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 16px 38px rgba(245,184,0,0.34);
        filter: brightness(1.03);
        color: #0b1027;
    }
    .af-cta-btn--outline {
        background: rgba(255,255,255,0.07);
        color: #ffffff;
        border-color: rgba(255,255,255,0.22);
    }
    .af-cta-btn--outline:hover {
        transform: translateY(-2px);
        background: rgba(255,255,255,0.12);
        border-color: rgba(255,255,255,0.34);
    }

    /* ================================================================
    RESPONSIVE
    ================================================================ */
    @media (max-width: 1100px) {
        .af-why-grid { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 991px) {
        .af-intro-grid    { grid-template-columns: 1fr; }
        .af-form-layout   { grid-template-columns: 1fr; }
        .af-sidebar       { position: static; }
        .af-cta           { flex-direction: column; align-items: flex-start; }
        .af-cta-actions   { width: 100%; }
    }
    @media (max-width: 767px) {
        .af-container     { padding: 0 18px; }
        .af-intro-section { padding: 40px 0 32px; }
        .af-section       { padding: 48px 0; }
        .af-section--cta  { padding-bottom: 70px; }
        .af-form          { padding: 18px 20px 24px; }
        .af-form-panel-header { padding: 22px 20px 0; }
        .af-form-grid     { grid-template-columns: 1fr; }
        .af-field--full   { grid-column: 1; }
        .af-why-grid      { grid-template-columns: 1fr; }
        .af-submit-row    { flex-direction: column; }
        .af-submit-btn,
        .af-reset-btn     { width: 100%; justify-content: center; }
        .af-cta-actions   { flex-direction: column; width: 100%; }
        .af-cta-btn       { width: 100%; justify-content: center; }
        .af-radio-group   { gap: 8px; }
    }

    /* ================================================================
    HOSTEL APPLICATION PAGE  (ha-*)
    ================================================================ */

    /* ---- Layout helpers ---- */
    .ha-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }
    .ha-container--narrow {
        max-width: 860px;
    }

    /* ---- Tag ---- */
    .ha-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }
    .ha-tag i { font-size: 11px; color: #f5b800; }

    /* ---- Accent ---- */
    .ha-accent        { color: #f5b800; }
    .ha-required-star { color: #dc2626; font-weight: 900; }

    /* ================================================================
    HIGHLIGHTS STRIP
    ================================================================ */
    .ha-highlights-section {
        background: #ffffff;
        padding: 0;
        margin-top: -2px;
        border-bottom: 1px solid rgba(13,27,94,0.08);
    }
    .ha-highlights-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
    }
    .ha-highlight-card {
        display: flex;
        align-items: center;
        gap: 16px;
        padding: 22px 24px;
        border-right: 1px solid rgba(13,27,94,0.08);
        transition: background 0.2s;
    }
    .ha-highlight-card:last-child { border-right: none; }
    .ha-highlight-card:hover { background: rgba(245,184,0,0.05); }
    .ha-highlight-icon {
        width: 46px;
        height: 46px;
        border-radius: 13px;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.26);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        font-size: 18px;
        flex-shrink: 0;
    }
    .ha-highlight-body { display: flex; flex-direction: column; gap: 2px; }
    .ha-highlight-body strong { font-size: 14px; font-weight: 900; color: #0d1b5e; }
    .ha-highlight-body span  { font-size: 12.5px; color: #64748b; line-height: 1.5; }

    /* ================================================================
    INTRO SECTION
    ================================================================ */
    .ha-section         { padding: 72px 0; }
    .ha-section--intro  { background: linear-gradient(180deg, #eef2fb 0%, #ffffff 100%); }
    .ha-section--form   { background: linear-gradient(180deg, #f4f6ff 0%, #ffffff 100%); }
    .ha-section--fees   { background: linear-gradient(180deg, #eef2fb 0%, #ffffff 100%); }
    .ha-section--rules  { background: #ffffff; }
    .ha-section--faq    { background: linear-gradient(180deg, #eef2fb 0%, #ffffff 100%); }
    .ha-section--cta    { padding: 0 0 90px; background: #ffffff; }

    .ha-section--fees{
        position: relative;
        overflow: clip;
    }
    .ha-section--fees::before{
        content: "";
        position: absolute;
        inset: 0;
        background:
            radial-gradient(600px 220px at 10% 20%, rgba(245,184,0,0.18), transparent 60%),
            radial-gradient(560px 240px at 85% 15%, rgba(26,47,138,0.18), transparent 62%),
            radial-gradient(640px 280px at 35% 95%, rgba(13,27,94,0.10), transparent 55%);
        pointer-events: none;
        opacity: 0.95;
        animation: haFeesGlow 10s ease-in-out infinite alternate;
    }
    .ha-section--fees::after{
        content: "";
        position: absolute;
        inset: -2px;
        background-image: radial-gradient(rgba(13,27,94,0.12) 1px, transparent 1px);
        background-size: 18px 18px;
        mask-image: radial-gradient(circle at 50% 50%, rgba(0,0,0,0.8), transparent 62%);
        opacity: 0.25;
        pointer-events: none;
        animation: haFeesDots 18s linear infinite;
    }

    .ha-section--fees .ha-container{ position: relative; z-index: 1; }

    .ha-fees-grid{
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        gap: 18px;
        margin-top: 18px;
    }
    .ha-fee-card{
        grid-column: span 4;
        border-radius: 22px;
        border: 1px solid rgba(13,27,94,0.12);
        background: rgba(255,255,255,0.78);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        box-shadow: 0 18px 56px rgba(13,27,94,0.10);
        overflow: hidden;
        position: relative;
        transform: translateY(10px);
        opacity: 0;
        animation: haFeesIn 700ms ease forwards;
    }
    .ha-fee-card:nth-child(2){ animation-delay: 90ms; }
    .ha-fee-card:nth-child(3){ animation-delay: 180ms; }

    .ha-fee-card::before{
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(320px 220px at 20% 10%, rgba(245,184,0,0.18), transparent 60%);
        opacity: 0.9;
        pointer-events: none;
    }
    .ha-fee-card::after{
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(135deg, rgba(13,27,94,0.00) 0%, rgba(13,27,94,0.06) 100%);
        pointer-events: none;
    }
    .ha-fee-card:hover{
        transform: translateY(-4px);
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
        border-color: rgba(245,184,0,0.30);
        box-shadow: 0 26px 70px rgba(13,27,94,0.14);
    }

    .ha-fee-card--boys{
        background: linear-gradient(180deg, rgba(13,27,94,0.95) 0%, rgba(26,47,138,0.95) 100%);
        border-color: rgba(255,255,255,0.14);
    }
    .ha-fee-card--boys::before{
        background:
            radial-gradient(340px 220px at 15% 10%, rgba(245,184,0,0.26), transparent 60%),
            radial-gradient(380px 260px at 100% 0%, rgba(255,255,255,0.08), transparent 65%);
    }
    .ha-fee-card--girls{
        background: linear-gradient(135deg, rgba(26,47,138,0.95) 0%, rgba(13,27,94,0.95) 100%);
        border-color: rgba(255,255,255,0.14);
    }
    .ha-fee-card--girls::before{
        background:
            radial-gradient(340px 220px at 15% 10%, rgba(245,184,0,0.24), transparent 60%),
            radial-gradient(380px 260px at 100% 0%, rgba(255,255,255,0.08), transparent 65%);
    }

    .ha-fee-top{
        display: grid;
        grid-template-columns: auto 1fr auto;
        gap: 14px;
        align-items: start;
        padding: 20px 18px 10px;
        position: relative;
        z-index: 1;
    }
    .ha-fee-icon{
        width: 50px;
        height: 50px;
        border-radius: 16px;
        display: grid;
        place-items: center;
        background: rgba(245,184,0,0.14);
        border: 1px solid rgba(245,184,0,0.30);
        color: #f5b800;
        font-size: 22px;
        box-shadow: 0 10px 30px rgba(245,184,0,0.18);
        animation: haFeeIconFloat 4.2s ease-in-out infinite;
    }
    .ha-fee-title{
        margin: 0 0 2px;
        font-size: 18px;
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1.2;
    }
    .ha-fee-sub{
        margin: 0;
        font-size: 12.5px;
        line-height: 1.55;
        color: rgba(13,27,94,0.70);
    }
    .ha-fee-price{
        font-weight: 900;
        color: #0d1b5e;
        letter-spacing: 0.2px;
        white-space: nowrap;
        padding-top: 2px;
    }
    .ha-fee-price span{
        display: block;
        font-weight: 800;
        font-size: 11px;
        color: rgba(13,27,94,0.65);
        text-align: right;
    }

    .ha-fee-includes{
        list-style: none;
        margin: 0;
        padding: 8px 18px 18px;
        display: grid;
        gap: 9px;
        position: relative;
        z-index: 1;
    }
    .ha-fee-includes li{
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 13px;
        line-height: 1.55;
        color: rgba(13,27,94,0.82);
    }
    .ha-fee-includes li i{
        color: #f5b800;
        font-size: 12px;
        flex-shrink: 0;
    }

    .ha-fee-card--boys .ha-fee-title,
    .ha-fee-card--girls .ha-fee-title{ color: #ffffff; }
    .ha-fee-card--boys .ha-fee-sub,
    .ha-fee-card--girls .ha-fee-sub{ color: rgba(255,255,255,0.72); }
    .ha-fee-card--boys .ha-fee-price,
    .ha-fee-card--girls .ha-fee-price{ color: #f5b800; }
    .ha-fee-card--boys .ha-fee-price span,
    .ha-fee-card--girls .ha-fee-price span{ color: rgba(255,255,255,0.62); }
    .ha-fee-card--boys .ha-fee-includes li,
    .ha-fee-card--girls .ha-fee-includes li{ color: rgba(255,255,255,0.80); }

    .ha-fee-card--note{
        grid-column: span 4;
        background: rgba(255,255,255,0.88);
    }
    .ha-fee-note{
        padding: 20px 18px 18px;
        position: relative;
        z-index: 1;
    }
    .ha-fee-notes{
        margin: 10px 0 16px;
        padding-left: 18px;
        color: #475569;
        line-height: 1.8;
        font-size: 14px;
    }
    .ha-fee-notes li{ margin: 6px 0; }
    .ha-fee-actions{
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }
    .ha-fee-btn{
        display: inline-flex;
        align-items: center;
        gap: 10px;
        padding: 12px 14px;
        border-radius: 14px;
        font-weight: 900;
        text-decoration: none;
        border: 1px solid rgba(13,27,94,0.16);
        transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
    }
    .ha-fee-btn i{ font-size: 14px; }
    .ha-fee-btn--primary{
        background: linear-gradient(135deg, #f5b800 0%, #ffd25a 100%);
        color: #0d1b5e;
        border-color: rgba(245,184,0,0.42);
        box-shadow: 0 16px 42px rgba(245,184,0,0.22);
    }
    .ha-fee-btn--ghost{
        background: rgba(13,27,94,0.06);
        color: #0d1b5e;
    }
    .ha-fee-btn:hover{
        transform: translateY(-2px);
        box-shadow: 0 18px 48px rgba(13,27,94,0.16);
        border-color: rgba(245,184,0,0.34);
    }

    @keyframes haFeesIn{
        from { opacity: 0; transform: translateY(12px); }
        to   { opacity: 1; transform: translateY(0); }
    }
    @keyframes haFeesGlow{
        from { transform: translate3d(0,0,0) scale(1); filter: saturate(1); }
        to   { transform: translate3d(0,-10px,0) scale(1.02); filter: saturate(1.08); }
    }
    @keyframes haFeesDots{
        from { transform: translate3d(0,0,0); }
        to   { transform: translate3d(0,-24px,0); }
    }
    @keyframes haFeeIconFloat{
        0%, 100% { transform: translateY(0); }
        50%      { transform: translateY(-6px); }
    }

    @media (max-width: 992px){
        .ha-fee-card{ grid-column: span 6; }
        .ha-fee-card--note{ grid-column: span 12; }
    }
    @media (max-width: 640px){
        .ha-section{ padding: 56px 0; }
        .ha-fees-grid{ gap: 14px; }
        .ha-fee-card{ grid-column: span 12; }
        .ha-fee-top{ grid-template-columns: auto 1fr; }
        .ha-fee-price{ grid-column: 1 / -1; padding-left: 64px; }
        .ha-fee-price span{ text-align: left; }
    }

    @media (prefers-reduced-motion: reduce){
        .ha-section--fees::before,
        .ha-section--fees::after,
        .ha-fee-card,
        .ha-fee-icon{
            animation: none !important;
            transition: none !important;
        }
    }

    .ha-intro-grid {
        display: grid;
        grid-template-columns: 1fr 400px;
        gap: 36px;
        align-items: start;
    }

    .ha-intro-title {
        font-size: clamp(24px, 3vw, 38px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 14px;
        line-height: 1.2;
    }
    .ha-intro-text {
        font-size: 15px;
        line-height: 1.85;
        color: #475569;
        margin: 0 0 16px;
    }

    /* Amenities chip grid */
    .ha-amenities-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 10px;
        margin-top: 20px;
    }
    .ha-amenity {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 6px;
        padding: 14px 10px;
        border-radius: 14px;
        background: rgba(13,27,94,0.04);
        border: 1px solid rgba(13,27,94,0.09);
        text-align: center;
        transition: background 0.2s, border-color 0.2s;
    }
    .ha-amenity:hover {
        background: rgba(245,184,0,0.08);
        border-color: rgba(245,184,0,0.26);
    }
    .ha-amenity i    { font-size: 18px; color: #0d1b5e; }
    .ha-amenity span { font-size: 11.5px; font-weight: 800; color: #334155; line-height: 1.3; }

    /* ---- Hostel type cards ---- */
    .ha-hostel-types {
        display: flex;
        flex-direction: column;
        gap: 18px;
    }
    .ha-type-card {
        border-radius: 20px;
        padding: 22px 20px;
        box-shadow: 0 16px 46px rgba(13,27,94,0.10);
        border: 1px solid rgba(13,27,94,0.12);
    }
    .ha-type-card--boys { background: linear-gradient(180deg, #0d1b5e 0%, #1a2f8a 100%); }
    .ha-type-card--girls { background: linear-gradient(135deg, #1a2f8a 0%, #0d1b5e 100%); }

    .ha-type-card-top {
        display: flex;
        align-items: center;
        gap: 14px;
        margin-bottom: 14px;
    }
    .ha-type-icon {
        width: 48px;
        height: 48px;
        border-radius: 14px;
        background: rgba(245,184,0,0.18);
        border: 1.5px solid rgba(245,184,0,0.35);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        color: #f5b800;
        flex-shrink: 0;
    }
    .ha-type-title {
        font-size: 18px;
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 4px;
    }
    .ha-type-badge {
        font-size: 11px;
        font-weight: 800;
        color: rgba(255,255,255,0.65);
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    .ha-type-features {
        list-style: none;
        margin: 0 0 16px;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 7px;
    }
    .ha-type-features li {
        display: flex;
        align-items: center;
        gap: 9px;
        font-size: 13px;
        color: rgba(255,255,255,0.78);
    }
    .ha-type-features li i { color: #f5b800; font-size: 12px; flex-shrink: 0; }

    .ha-type-fee {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 12px 14px;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.26);
        border-radius: 12px;
    }
    .ha-type-fee-label  { font-size: 12px; font-weight: 800; color: rgba(255,255,255,0.65); text-transform: uppercase; letter-spacing: 0.4px; }
    .ha-type-fee-amount { font-size: 15px; font-weight: 900; color: #f5b800; }
    .ha-type-fee-amount em { font-size: 12px; font-style: normal; font-weight: 700; color: rgba(255,255,255,0.60); margin-left: 2px; }

    /* ================================================================
    FORM + SIDEBAR LAYOUT
    ================================================================ */
    .ha-form-layout {
        display: grid;
        grid-template-columns: 1fr 300px;
        gap: 28px;
        align-items: start;
    }

    /* ---- Form panel ---- */
    .ha-form-panel {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 24px;
        overflow: hidden;
        box-shadow: 0 20px 60px rgba(13,27,94,0.08);
    }
    .ha-form-panel-header { padding: 28px 32px 0; }
    .ha-form-panel-title {
        font-size: 26px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 6px;
        line-height: 1.2;
    }
    .ha-form-panel-sub { font-size: 13px; color: #5a6782; margin: 0 0 4px; }

    /* ---- Form internals ---- */
    .ha-form { padding: 24px 32px 32px; }

    .ha-fieldset { border: none; margin: 0 0 28px; padding: 0; }
    .ha-legend {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 14px;
        font-weight: 900;
        color: #0d1b5e;
        padding: 0 0 10px;
        margin-bottom: 16px;
        width: 100%;
        border-bottom: 2px solid rgba(13,27,94,0.08);
    }
    .ha-legend i { color: #f5b800; font-size: 15px; }

    .ha-form-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }
    .ha-field      { display: flex; flex-direction: column; gap: 6px; }
    .ha-field--full{ grid-column: 1 / -1; }

    .ha-label { font-size: 13px; font-weight: 800; color: #0d1b5e; line-height: 1.3; }

    .ha-input {
        padding: 11px 14px;
        border: 1.5px solid rgba(13,27,94,0.14);
        border-radius: 12px;
        font-size: 14px;
        color: #1e293b;
        background: #fafbff;
        outline: none;
        transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
        width: 100%;
        box-sizing: border-box;
        font-family: inherit;
    }
    .ha-input:focus {
        border-color: #0d1b5e;
        background: #ffffff;
        box-shadow: 0 0 0 3px rgba(13,27,94,0.10);
    }
    .ha-input::placeholder { color: #94a3b8; }
    .ha-select {
        appearance: none;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%230d1b5e' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 14px center;
        padding-right: 36px;
        cursor: pointer;
    }
    .ha-textarea { resize: vertical; min-height: 72px; }

    /* Declaration checkbox */
    .ha-declaration { margin-bottom: 22px; }
    .ha-checkbox-label {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        cursor: pointer;
        font-size: 13.5px;
        color: #475569;
        line-height: 1.65;
        user-select: none;
    }
    .ha-checkbox { display: none; }
    .ha-checkbox-custom {
        width: 20px;
        height: 20px;
        border-radius: 6px;
        border: 2px solid rgba(13,27,94,0.25);
        background: #fafbff;
        flex-shrink: 0;
        margin-top: 2px;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: border-color 0.2s, background 0.2s;
        position: relative;
    }
    .ha-checkbox:checked + .ha-checkbox-custom {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        border-color: #f5b800;
    }
    .ha-checkbox:checked + .ha-checkbox-custom::after {
        content: '';
        width: 5px;
        height: 9px;
        border: 2.5px solid #0d1b5e;
        border-top: none;
        border-left: none;
        transform: rotate(45deg) translateY(-1px);
        display: block;
    }

    /* Submit row */
    .ha-submit-row {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
        margin-bottom: 16px;
    }
    .ha-submit-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-weight: 900;
        font-size: 15px;
        padding: 14px 28px;
        border-radius: 14px;
        border: none;
        box-shadow: 0 12px 30px rgba(245,184,0,0.26);
        cursor: pointer;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
    }
    .ha-submit-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 16px 38px rgba(245,184,0,0.34);
        filter: brightness(1.04);
    }
    .ha-reset-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.06);
        color: #0d1b5e;
        font-weight: 800;
        font-size: 14px;
        padding: 14px 22px;
        border-radius: 14px;
        border: 1.5px solid rgba(13,27,94,0.14);
        cursor: pointer;
        transition: background 0.2s, border-color 0.2s;
    }
    .ha-reset-btn:hover {
        background: rgba(13,27,94,0.10);
        border-color: rgba(13,27,94,0.24);
    }
    .ha-privacy-note {
        font-size: 12.5px;
        color: #9ca3af;
        display: flex;
        align-items: center;
        gap: 6px;
        margin: 0;
    }
    .ha-privacy-note i { color: #0d1b5e; font-size: 12px; }

    /* ================================================================
    SIDEBAR
    ================================================================ */
    .ha-sidebar {
        display: flex;
        flex-direction: column;
        gap: 16px;
        position: sticky;
        top: 90px;
    }
    .ha-sidebar-card {
        border-radius: 18px;
        padding: 20px 18px;
        box-shadow: 0 10px 36px rgba(13,27,94,0.08);
    }
    .ha-sidebar-card--contact {
        background: linear-gradient(180deg, #0d1b5e 0%, #1a2f8a 100%);
        border: 1px solid rgba(245,184,0,0.20);
    }
    .ha-sidebar-card--contact .ha-sidebar-card-top {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 10px;
    }
    .ha-sidebar-card--contact .ha-sidebar-card-top i { font-size: 20px; color: #f5b800; }
    .ha-sidebar-card--contact .ha-sidebar-card-top h3 { font-size: 16px; font-weight: 900; color: #ffffff; margin: 0; }
    .ha-sidebar-card--contact p { font-size: 13px; color: rgba(255,255,255,0.70); margin: 0 0 14px; line-height: 1.65; }
    .ha-sidebar-contact-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 9px;
    }
    .ha-sidebar-contact-list li {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        color: rgba(255,255,255,0.82);
    }
    .ha-sidebar-contact-list li i { color: #f5b800; font-size: 13px; width: 14px; flex-shrink: 0; }
    .ha-sidebar-contact-list li a { color: rgba(255,255,255,0.82); text-decoration: none; }
    .ha-sidebar-contact-list li a:hover { color: #f5b800; }

    .ha-sidebar-card--docs,
    .ha-sidebar-card--rules,
    .ha-sidebar-card--links { background: #ffffff; border: 1px solid rgba(13,27,94,0.10); }

    .ha-sidebar-sub-title {
        font-size: 14px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .ha-sidebar-sub-title i { color: #f5b800; }

    .ha-sidebar-doc-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 7px;
    }
    .ha-sidebar-doc-list li {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        color: #475569;
        font-weight: 650;
    }
    .ha-sidebar-doc-list li i { color: #f5b800; font-size: 9px; flex-shrink: 0; }

    .ha-sidebar-rules-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 8px;
        counter-reset: srule;
    }
    .ha-sidebar-rules-list li {
        font-size: 12.5px;
        color: #475569;
        line-height: 1.6;
        padding-left: 16px;
        position: relative;
    }
    .ha-sidebar-rules-list li::before {
        content: "•";
        position: absolute;
        left: 0;
        color: #f5b800;
        font-weight: 900;
    }

    .ha-sidebar-quick-links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0; }
    .ha-sidebar-quick-links li a {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 9px 6px;
        font-size: 13.5px;
        font-weight: 700;
        color: #334155;
        text-decoration: none;
        border-bottom: 1px solid rgba(13,27,94,0.06);
        transition: color 0.2s, padding-left 0.2s;
    }
    .ha-sidebar-quick-links li:last-child a { border-bottom: none; }
    .ha-sidebar-quick-links li a:hover { color: #0d1b5e; padding-left: 12px; }
    .ha-sidebar-quick-links li a i { font-size: 10px; color: #f5b800; }

    /* ================================================================
    RULES SECTION
    ================================================================ */
    .ha-section-header {
        text-align: center;
        max-width: 820px;
        margin: 0 auto 44px;
    }
    .ha-section-title {
        font-size: clamp(26px, 3.2vw, 40px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }
    .ha-section-sub { font-size: 15px; color: #5a6782; line-height: 1.85; margin: 0; }

    .ha-rules-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 18px;
    }
    .ha-rule-card {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 20px;
        padding: 24px 20px;
        box-shadow: 0 12px 38px rgba(13,27,94,0.06);
        transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
    }
    .ha-rule-card:hover {
        transform: translateY(-4px);
        border-color: rgba(245,184,0,0.30);
        box-shadow: 0 22px 54px rgba(13,27,94,0.10);
    }
    .ha-rule-icon {
        width: 48px;
        height: 48px;
        border-radius: 14px;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.26);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        font-size: 20px;
        margin-bottom: 14px;
    }
    .ha-rule-title { font-size: 16px; font-weight: 900; color: #0d1b5e; margin: 0 0 12px; }
    .ha-rule-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 7px;
    }
    .ha-rule-list li {
        font-size: 13px;
        color: #475569;
        line-height: 1.6;
        padding-left: 14px;
        position: relative;
    }
    .ha-rule-list li::before {
        content: "–";
        position: absolute;
        left: 0;
        color: #f5b800;
        font-weight: 900;
    }

    /* ================================================================
    FAQ ACCORDION
    ================================================================ */
    .ha-faq-list {
        display: flex;
        flex-direction: column;
        gap: 0;
    }
    .ha-faq-item {
        border-bottom: 1px solid rgba(13,27,94,0.10);
    }
    .ha-faq-item:first-child { border-top: 1px solid rgba(13,27,94,0.10); }
    .ha-faq-q {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 14px;
        padding: 18px 4px;
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        cursor: pointer;
        list-style: none;
        outline: none;
        transition: color 0.2s;
    }
    .ha-faq-q::-webkit-details-marker { display: none; }
    .ha-faq-q::after {
        content: '\f078';
        font-family: 'Font Awesome 6 Free';
        font-weight: 900;
        font-size: 13px;
        color: #f5b800;
        transition: transform 0.25s ease;
        flex-shrink: 0;
    }
    .ha-faq-item[open] .ha-faq-q { color: #f5b800; }
    .ha-faq-item[open] .ha-faq-q::after { transform: rotate(180deg); }
    .ha-faq-a {
        padding: 0 4px 18px;
        animation: haFaqOpen 0.25s ease;
    }
    .ha-faq-a p { font-size: 14.5px; color: #475569; line-height: 1.85; margin: 0; }
    @keyframes haFaqOpen {
        from { opacity: 0; transform: translateY(-6px); }
        to   { opacity: 1; transform: translateY(0); }
    }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .ha-cta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 28px 26px;
        border-radius: 22px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border: 1px solid rgba(245,184,0,0.22);
        flex-wrap: wrap;
    }
    .ha-cta-title { margin: 0 0 8px; color: #ffffff; font-weight: 1000; font-size: 22px; }
    .ha-cta-sub   { margin: 0; color: rgba(255,255,255,0.78); line-height: 1.75; font-size: 14px; max-width: 480px; }
    .ha-cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }
    .ha-cta-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 14px;
        padding: 13px 20px;
        font-weight: 1000;
        font-size: 14px;
        text-decoration: none;
        border: 1px solid transparent;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s, background 0.2s, border-color 0.2s;
    }
    .ha-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        box-shadow: 0 12px 28px rgba(245,184,0,0.26);
    }
    .ha-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 16px 38px rgba(245,184,0,0.34);
        filter: brightness(1.03);
        color: #0b1027;
    }
    .ha-cta-btn--outline {
        background: rgba(255,255,255,0.07);
        color: #ffffff;
        border-color: rgba(255,255,255,0.22);
    }
    .ha-cta-btn--outline:hover {
        transform: translateY(-2px);
        background: rgba(255,255,255,0.12);
        border-color: rgba(255,255,255,0.34);
    }

    /* ================================================================
    RESPONSIVE
    ================================================================ */
    @media (max-width: 1100px) {
        .ha-rules-grid       { grid-template-columns: repeat(2, 1fr); }
        .ha-amenities-grid   { grid-template-columns: repeat(4, 1fr); }
    }
    @media (max-width: 991px) {
        .ha-highlights-grid  { grid-template-columns: repeat(2, 1fr); }
        .ha-highlight-card   { border-right: none; border-bottom: 1px solid rgba(13,27,94,0.08); }
        .ha-intro-grid       { grid-template-columns: 1fr; }
        .ha-amenities-grid   { grid-template-columns: repeat(4, 1fr); }
        .ha-form-layout      { grid-template-columns: 1fr; }
        .ha-sidebar          { position: static; }
        .ha-cta              { flex-direction: column; align-items: flex-start; }
        .ha-cta-actions      { width: 100%; }
    }
    @media (max-width: 767px) {
        .ha-container        { padding: 0 18px; }
        .ha-section          { padding: 48px 0; }
        .ha-section--cta     { padding-bottom: 70px; }
        .ha-highlights-grid  { grid-template-columns: 1fr 1fr; }
        .ha-form             { padding: 18px 20px 24px; }
        .ha-form-panel-header{ padding: 22px 20px 0; }
        .ha-form-grid        { grid-template-columns: 1fr; }
        .ha-field--full      { grid-column: 1; }
        .ha-amenities-grid   { grid-template-columns: repeat(2, 1fr); }
        .ha-rules-grid       { grid-template-columns: 1fr; }
        .ha-submit-row       { flex-direction: column; }
        .ha-submit-btn,
        .ha-reset-btn        { width: 100%; justify-content: center; }
        .ha-cta-actions      { flex-direction: column; width: 100%; }
        .ha-cta-btn          { width: 100%; justify-content: center; }
    }

    /* ================================================================
    ACADEMICS DROPDOWN — narrower panel, centred under the trigger
    ================================================================ */

    /* Desktop: compact 260 px panel, centred on the nav-link */
    .nav-item-academics .nav-dropdown {
        width: 260px;
        left: 50%;
        right: auto;
        transform: translateX(-50%) translateY(-10px);
    }

    /* Re-point the arrow caret to the centre */
    .nav-item-academics .nav-dropdown::before {
        left: 50%;
        right: auto;
        transform: translateX(-50%);
    }

    /* Hover / JS-open states — keep X centred, remove Y offset */
    .nav-item-academics:hover .nav-dropdown,
    .nav-item-academics.dropdown--open .nav-dropdown {
        transform: translateX(-50%) translateY(0);
    }

    /* Mobile: collapse to full-width static block (matches admission pattern) */
    @media (max-width: 1100px) {
        .nav-item-academics .nav-dropdown {
            position: static;
            width: 100%;
            transform: none;
        }

        .nav-item-academics:hover .nav-dropdown {
            max-height: 0;
            pointer-events: none;
        }

        .nav-item-academics.dropdown--open .nav-dropdown,
        .nav-item-academics.dropdown--open:hover .nav-dropdown {
            max-height: 280px;   /* enough for 3 items */
            pointer-events: all;
        }
    }

    /* ================================================================
    EXAMINATION DROPDOWN — centred panel under the trigger
    ================================================================ */

    /* Desktop: compact panel, centred on the nav-link */
    .nav-item-examination .nav-dropdown {
        width: 290px;
        left: 50%;
        right: auto;
        transform: translateX(-50%) translateY(-10px);
    }

    /* Re-point the arrow caret to the centre */
    .nav-item-examination .nav-dropdown::before {
        left: 50%;
        right: auto;
        transform: translateX(-50%);
    }

    /* Hover / JS-open states — keep X centred, remove Y offset */
    .nav-item-examination:hover .nav-dropdown,
    .nav-item-examination.dropdown--open .nav-dropdown {
        transform: translateX(-50%) translateY(0);
    }

    /* Extra stagger delays for items 4 & 5 */
    .nav-item-examination:hover .nav-dropdown-list li:nth-child(4),
    .nav-item-examination.dropdown--open .nav-dropdown-list li:nth-child(4) { animation-delay: 0.16s; }
    .nav-item-examination:hover .nav-dropdown-list li:nth-child(5),
    .nav-item-examination.dropdown--open .nav-dropdown-list li:nth-child(5) { animation-delay: 0.20s; }

    /* Mobile: collapse to full-width static block */
    @media (max-width: 1100px) {
        .nav-item-examination .nav-dropdown {
            position: static;
            width: 100%;
            transform: none;
        }

        .nav-item-examination:hover .nav-dropdown {
            max-height: 0;
            pointer-events: none;
        }

        .nav-item-examination.dropdown--open .nav-dropdown,
        .nav-item-examination.dropdown--open:hover .nav-dropdown {
            max-height: 420px; /* enough for 5 items */
            pointer-events: all;
        }
    }

    /* ================================================================
    SYLLABUS PAGE  (sy-*)
    ================================================================ */

    /* ---- Layout helpers ---- */
    .sy-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }
    .sy-container--narrow { max-width: 860px; }

    /* ---- Tag ---- */
    .sy-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }
    .sy-tag i { font-size: 11px; color: #f5b800; }

    /* ---- Accent ---- */
    .sy-accent { color: #f5b800; }

    /* ================================================================
    INTRO PILLS STRIP
    ================================================================ */
    .sy-intro-section {
        background: #ffffff;
        border-bottom: 1px solid rgba(13,27,94,0.08);
        padding: 0;
    }
    .sy-intro-pills {
        display: flex;
        align-items: stretch;
        justify-content: center;
    }
    .sy-pill {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 18px 28px;
        border-right: 1px solid rgba(13,27,94,0.08);
        font-size: 14px;
        font-weight: 800;
        color: #0d1b5e;
        transition: background 0.2s;
        flex: 1;
        justify-content: center;
    }
    .sy-pill:last-child { border-right: none; }
    .sy-pill:hover { background: rgba(245,184,0,0.06); }
    .sy-pill i { font-size: 17px; color: #f5b800; flex-shrink: 0; }

    /* ================================================================
    SECTION DEFAULTS
    ================================================================ */
    .sy-section        { padding: 72px 0; }
    .sy-section--main  { background: linear-gradient(180deg, #eef2fb 0%, #ffffff 100%); }
    .sy-section--eval  { background: #ffffff; }
    .sy-section--note  { background: linear-gradient(180deg, #f4f6ff 0%, #ffffff 100%); padding: 56px 0; }
    .sy-section--cta   { padding: 0 0 90px; background: #ffffff; }

    .sy-section-header {
        text-align: center;
        max-width: 820px;
        margin: 0 auto 44px;
    }
    .sy-section-title {
        font-size: clamp(26px, 3.2vw, 40px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }
    .sy-section-sub { font-size: 15px; color: #5a6782; line-height: 1.85; margin: 0; }

    /* ================================================================
    PROGRAMME TABS
    ================================================================ */
    .sy-tabs {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-bottom: 28px;
    }
    .sy-tab {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 10px 20px;
        border-radius: 12px;
        border: 1.5px solid rgba(13,27,94,0.14);
        background: #ffffff;
        color: #475569;
        font-size: 13.5px;
        font-weight: 800;
        cursor: pointer;
        transition: background 0.2s, border-color 0.2s, color 0.2s, box-shadow 0.2s;
        white-space: nowrap;
    }
    .sy-tab i { font-size: 13px; flex-shrink: 0; }
    .sy-tab:hover {
        border-color: rgba(13,27,94,0.28);
        color: #0d1b5e;
        background: rgba(13,27,94,0.04);
    }
    .sy-tab--active {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-color: transparent;
        color: #ffffff;
        box-shadow: 0 8px 22px rgba(13,27,94,0.22);
    }
    .sy-tab--active i { color: #f5b800; }

    /* ================================================================
    SYLLABUS PANELS
    ================================================================ */
    .sy-panel { display: none; }
    .sy-panel--active { display: block; animation: syPanelIn 0.28s ease; }
    @keyframes syPanelIn {
        from { opacity: 0; transform: translateY(10px); }
        to   { opacity: 1; transform: translateY(0); }
    }

    /* Panel intro row */
    .sy-panel-intro {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 20px;
        padding: 28px 30px;
        margin-bottom: 24px;
        border: 1px solid rgba(245,184,0,0.18);
    }
    .sy-panel-badge {
        display: inline-block;
        font-size: 11px;
        font-weight: 900;
        padding: 4px 14px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin-bottom: 10px;
    }
    .sy-panel-badge--ug {
        background: rgba(245,184,0,0.18);
        border: 1px solid rgba(245,184,0,0.35);
        color: #f5b800;
    }
    .sy-panel-badge--pg {
        background: rgba(245,184,0,0.28);
        border: 1px solid rgba(245,184,0,0.50);
        color: #ffd040;
    }
    .sy-panel-title {
        font-size: clamp(18px, 2.5vw, 24px);
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 10px;
        line-height: 1.3;
    }
    .sy-panel-short { font-weight: 700; color: rgba(255,255,255,0.65); font-size: 0.85em; }
    .sy-panel-desc { font-size: 14px; color: rgba(255,255,255,0.75); line-height: 1.75; margin: 0 0 16px; max-width: 780px; }
    .sy-panel-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 14px;
    }
    .sy-panel-meta span {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        font-size: 13px;
        font-weight: 800;
        color: rgba(255,255,255,0.80);
        background: rgba(255,255,255,0.08);
        padding: 6px 14px;
        border-radius: 50px;
        border: 1px solid rgba(255,255,255,0.12);
    }
    .sy-panel-meta span i { color: #f5b800; font-size: 12px; }

    /* ---- Year grid ---- */
    .sy-year-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 18px;
        margin-bottom: 20px;
    }

    .sy-panel-empty {
        grid-column: 1 / -1;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        padding: 22px 24px;
        background: rgba(255, 255, 255, 0.95);
        border: 1px dashed rgba(13, 27, 94, 0.2);
        border-radius: 16px;
        color: #475569;
        font-size: 14px;
        line-height: 1.65;
    }
    .sy-panel-empty > i {
        font-size: 28px;
        color: #f5b800;
    }
    .sy-panel-empty p { margin: 0; max-width: 52ch; }
    .sy-panel-empty-link {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-weight: 800;
        font-size: 13px;
        color: #0d1b5e;
        text-decoration: none;
        border-bottom: 2px solid rgba(245, 184, 0, 0.55);
        padding-bottom: 2px;
    }
    .sy-panel-empty-link:hover {
        color: #1a2f8a;
        border-bottom-color: #f5b800;
    }

    .sy-year-card--full { grid-column: 1 / -1; }

    .sy-year-card {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 18px;
        overflow: hidden;
        box-shadow: 0 10px 34px rgba(13,27,94,0.07);
        transition: transform 0.2s, box-shadow 0.2s;
    }
    .sy-year-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 18px 48px rgba(13,27,94,0.11);
    }
    .sy-year-header {
        display: flex;
        align-items: center;
        gap: 12px;
        background: linear-gradient(90deg, rgba(13,27,94,0.06) 0%, rgba(13,27,94,0.02) 100%);
        border-bottom: 1px solid rgba(13,27,94,0.08);
        padding: 14px 20px;
    }
    .sy-year-label {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        font-size: 11px;
        font-weight: 900;
        padding: 4px 12px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        white-space: nowrap;
        flex-shrink: 0;
    }
    .sy-year-title {
        font-size: 14px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0;
    }

    /* Semesters two-column inside card */
    .sy-semesters {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0;
        padding: 0;
    }
    .sy-semester {
        padding: 16px 18px;
        border-right: 1px solid rgba(13,27,94,0.07);
    }
    .sy-semester:last-child { border-right: none; }

    .sy-sem-label {
        font-size: 11px;
        font-weight: 900;
        color: #0d1b5e;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin-bottom: 10px;
        padding-bottom: 7px;
        border-bottom: 2px solid rgba(245,184,0,0.35);
    }

    .sy-subject-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 6px;
    }
    .sy-subject-list li {
        font-size: 13px;
        color: #475569;
        line-height: 1.55;
        padding-left: 14px;
        position: relative;
        font-weight: 600;
    }
    .sy-subject-list li::before {
        content: "";
        position: absolute;
        left: 0;
        top: 8px;
        width: 5px;
        height: 5px;
        border-radius: 50%;
        background: #f5b800;
        flex-shrink: 0;
    }

    /* ---- Download bar ---- */
    .sy-download-bar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: 14px 20px;
        background: rgba(13,27,94,0.04);
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 14px;
        flex-wrap: wrap;
    }
    .sy-download-info {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13px;
        color: #5a6782;
        line-height: 1.65;
        flex: 1;
    }
    .sy-download-info i { color: #0d1b5e; font-size: 14px; margin-top: 2px; flex-shrink: 0; }
    .sy-download-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        color: #ffffff;
        font-size: 13.5px;
        font-weight: 900;
        padding: 10px 20px;
        border-radius: 10px;
        text-decoration: none;
        white-space: nowrap;
        transition: transform 0.2s, box-shadow 0.2s;
        box-shadow: 0 6px 18px rgba(13,27,94,0.18);
    }
    .sy-download-btn i { color: #f5b800; font-size: 14px; }
    .sy-download-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 26px rgba(13,27,94,0.26);
        color: #ffffff;
    }

    .sy-download-actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-end;
        gap: 10px;
    }

    .sy-download-btn--secondary {
        background: #ffffff;
        color: #0d1b5e;
        border: 1.5px solid rgba(13,27,94,0.22);
        box-shadow: 0 4px 14px rgba(13,27,94,0.08);
    }
    .sy-download-btn--secondary i { color: #c2410c; }
    .sy-download-btn--secondary:hover {
        background: rgba(245,184,0,0.12);
        border-color: rgba(245,184,0,0.45);
        color: #0b1027;
    }

    /* ================================================================
    EVALUATION PATTERN
    ================================================================ */
    .sy-eval-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }
    .sy-eval-card {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 20px;
        padding: 28px 24px;
        text-align: center;
        box-shadow: 0 12px 38px rgba(13,27,94,0.07);
        transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
    }
    .sy-eval-card:hover {
        transform: translateY(-4px);
        border-color: rgba(245,184,0,0.30);
        box-shadow: 0 22px 54px rgba(13,27,94,0.11);
    }
    .sy-eval-card--gold {
        background: linear-gradient(180deg, #0d1b5e 0%, #1a2f8a 100%);
        border-color: rgba(245,184,0,0.22);
    }
    .sy-eval-icon {
        width: 52px;
        height: 52px;
        border-radius: 16px;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.26);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        font-size: 20px;
        margin: 0 auto 16px;
    }
    .sy-eval-card--gold .sy-eval-icon {
        background: rgba(245,184,0,0.16);
        color: #f5b800;
    }
    .sy-eval-score {
        font-size: 48px;
        font-weight: 1000;
        color: #0d1b5e;
        line-height: 1;
        margin-bottom: 8px;
    }
    .sy-eval-score span { font-size: 24px; font-weight: 900; }
    .sy-eval-card--gold .sy-eval-score { color: #f5b800; }
    .sy-eval-title {
        font-size: 16px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 8px;
    }
    .sy-eval-card--gold .sy-eval-title { color: #ffffff; }
    .sy-eval-text {
        font-size: 13.5px;
        color: #5a6782;
        line-height: 1.75;
        margin: 0;
    }
    .sy-eval-card--gold .sy-eval-text { color: rgba(255,255,255,0.72); }

    /* ================================================================
    NOTE BOX
    ================================================================ */
    .sy-note-box {
        display: flex;
        gap: 20px;
        align-items: flex-start;
        background: #fff9e6;
        border: 1.5px solid rgba(245,184,0,0.45);
        border-left: 5px solid #f5b800;
        border-radius: 16px;
        padding: 24px 26px;
    }
    .sy-note-icon {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        background: rgba(245,184,0,0.18);
        border: 1px solid rgba(245,184,0,0.35);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #c97d00;
        font-size: 18px;
        flex-shrink: 0;
        margin-top: 2px;
    }
    .sy-note-title {
        font-size: 17px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 8px;
    }
    .sy-note-content p {
        font-size: 14px;
        color: #475569;
        line-height: 1.75;
        margin: 0 0 12px;
    }
    .sy-note-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 7px;
    }
    .sy-note-list li {
        font-size: 13.5px;
        color: #475569;
        line-height: 1.65;
        padding-left: 16px;
        position: relative;
        font-weight: 650;
    }
    .sy-note-list li::before {
        content: "→";
        position: absolute;
        left: 0;
        color: #f5b800;
        font-weight: 900;
    }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .sy-cta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 28px 26px;
        border-radius: 22px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border: 1px solid rgba(245,184,0,0.22);
        flex-wrap: wrap;
    }
    .sy-cta-title { margin: 0 0 8px; color: #ffffff; font-weight: 1000; font-size: 22px; }
    .sy-cta-sub   { margin: 0; color: rgba(255,255,255,0.78); line-height: 1.75; font-size: 14px; max-width: 520px; }
    .sy-cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }
    .sy-cta-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 14px;
        padding: 13px 20px;
        font-weight: 1000;
        font-size: 14px;
        text-decoration: none;
        border: 1px solid transparent;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s, background 0.2s, border-color 0.2s;
    }
    .sy-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        box-shadow: 0 12px 28px rgba(245,184,0,0.26);
    }
    .sy-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 16px 38px rgba(245,184,0,0.34);
        filter: brightness(1.03);
        color: #0b1027;
    }
    .sy-cta-btn--outline {
        background: rgba(255,255,255,0.07);
        color: #ffffff;
        border-color: rgba(255,255,255,0.22);
    }
    .sy-cta-btn--outline:hover {
        transform: translateY(-2px);
        background: rgba(255,255,255,0.12);
        border-color: rgba(255,255,255,0.34);
        color: #ffffff;
    }

    /* ================================================================
    RESPONSIVE
    ================================================================ */
    @media (max-width: 1100px) {
        .sy-eval-grid { grid-template-columns: repeat(3, 1fr); }
    }
    @media (max-width: 991px) {
        .sy-intro-pills  { flex-wrap: wrap; }
        .sy-pill         { flex: 1 1 48%; border-right: none; border-bottom: 1px solid rgba(13,27,94,0.08); }
        .sy-eval-grid    { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
        .sy-cta          { flex-direction: column; align-items: flex-start; }
        .sy-cta-actions  { width: 100%; }
    }
    @media (max-width: 767px) {
        .sy-container    { padding: 0 18px; }
        .sy-section      { padding: 48px 0; }
        .sy-section--cta { padding-bottom: 70px; }
        .sy-pill         { flex: 1 1 100%; justify-content: flex-start; padding: 14px 18px; }
        .sy-tabs         { gap: 6px; }
        .sy-tab          { padding: 9px 14px; font-size: 13px; }
        .sy-year-grid    { grid-template-columns: 1fr; }
        .sy-year-card--full { grid-column: 1; }
        .sy-semesters    { grid-template-columns: 1fr; }
        .sy-semester     { border-right: none; border-bottom: 1px solid rgba(13,27,94,0.07); }
        .sy-semester:last-child { border-bottom: none; }
        .sy-download-bar { flex-direction: column; align-items: flex-start; }
        .sy-download-actions { width: 100%; flex-direction: column; align-items: stretch; }
        .sy-download-btn,
        .sy-download-btn--secondary { width: 100%; justify-content: center; }
        .sy-panel-meta   { gap: 8px; }
        .sy-note-box     { flex-direction: column; }
        .sy-cta-actions  { flex-direction: column; width: 100%; }
        .sy-cta-btn      { width: 100%; justify-content: center; }
    }

    /* ================================================================
    ACADEMIC CALENDAR PAGE  (ac-*)
    ================================================================ */

    /* ---- Layout helpers ---- */
    .ac-container {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 32px;
    }
    .ac-container--narrow { max-width: 860px; }

    /* ---- Tag ---- */
    .ac-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.7px;
        margin-bottom: 14px;
    }
    .ac-tag i { font-size: 11px; color: #f5b800; }

    /* ---- Accent ---- */
    .ac-accent { color: #f5b800; }

    /* ================================================================
    STATS STRIP
    ================================================================ */
    .ac-stats-section {
        background: #ffffff;
        border-bottom: 1px solid rgba(13,27,94,0.08);
        padding: 0;
    }
    .ac-stats-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
    }
    .ac-stat-card {
        display: flex;
        align-items: center;
        gap: 16px;
        padding: 22px 28px;
        border-right: 1px solid rgba(13,27,94,0.08);
        transition: background 0.2s;
    }
    .ac-stat-card:last-child { border-right: none; }
    .ac-stat-card:hover { background: rgba(245,184,0,0.05); }
    .ac-stat-icon {
        width: 48px;
        height: 48px;
        border-radius: 14px;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.26);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        font-size: 20px;
        flex-shrink: 0;
    }
    .ac-stat-body { display: flex; flex-direction: column; gap: 2px; }
    .ac-stat-val   { font-size: 26px; font-weight: 1000; color: #0d1b5e; line-height: 1; }
    .ac-stat-label { font-size: 12.5px; font-weight: 700; color: #64748b; line-height: 1.4; }

    /* ================================================================
    SECTION DEFAULTS
    ================================================================ */
    .ac-section           { padding: 72px 0; }
    .ac-section--timeline { background: linear-gradient(180deg, #eef2fb 0%, #ffffff 100%); }
    .ac-section--table    { background: #ffffff; }
    .ac-section--holidays { background: linear-gradient(180deg, #f4f6ff 0%, #ffffff 100%); }
    .ac-section--events   { background: #ffffff; }
    .ac-section--dates    { background: linear-gradient(180deg, #eef2fb 0%, #ffffff 100%); }
    .ac-section--download { background: #ffffff; padding: 0 0 56px; }
    .ac-section--cta      { padding: 0 0 90px; background: #ffffff; }

    .ac-section-header {
        text-align: center;
        max-width: 820px;
        margin: 0 auto 44px;
    }
    .ac-section-title {
        font-size: clamp(26px, 3.2vw, 40px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }
    .ac-section-sub { font-size: 15px; color: #5a6782; line-height: 1.85; margin: 0; }

    /* ================================================================
    SEMESTER TIMELINE
    ================================================================ */
    .ac-timeline {
        max-width: 820px;
        margin: 0 auto;
        position: relative;
        display: flex;
        flex-direction: column;
        gap: 0;
    }
    .ac-timeline::before {
        content: '';
        position: absolute;
        left: 27px;
        top: 0;
        bottom: 0;
        width: 2px;
        background: linear-gradient(180deg, #f5b800 0%, rgba(13,27,94,0.15) 100%);
        z-index: 0;
    }

    .ac-tl-item {
        display: flex;
        gap: 24px;
        align-items: flex-start;
        position: relative;
        padding-bottom: 28px;
    }
    .ac-tl-item:last-child { padding-bottom: 0; }

    .ac-tl-marker {
        width: 56px;
        height: 56px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
        flex-shrink: 0;
        z-index: 1;
        border: 3px solid #ffffff;
        box-shadow: 0 4px 18px rgba(13,27,94,0.14);
        position: relative;
    }
    .ac-tl-marker--start { background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%); color: #f5b800; }
    .ac-tl-marker--sem   { background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%); color: #0b1027; }
    .ac-tl-marker--exam  { background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%); color: #ffffff; }
    .ac-tl-marker--break { background: linear-gradient(135deg, #475569 0%, #334155 100%); color: #f5b800; }
    .ac-tl-marker--end   { background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%); color: #f5b800; }

    .ac-tl-content {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 16px;
        padding: 18px 22px;
        flex: 1;
        box-shadow: 0 6px 24px rgba(13,27,94,0.06);
        transition: transform 0.2s, box-shadow 0.2s;
        margin-top: 4px;
    }
    .ac-tl-content:hover {
        transform: translateX(4px);
        box-shadow: 0 12px 36px rgba(13,27,94,0.10);
    }
    .ac-tl-date {
        display: inline-block;
        font-size: 11.5px;
        font-weight: 900;
        color: #f5b800;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin-bottom: 6px;
    }
    .ac-tl-title {
        font-size: 17px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 6px;
    }
    .ac-tl-desc {
        font-size: 13.5px;
        color: #5a6782;
        line-height: 1.75;
        margin: 0;
    }

    /* ================================================================
    MONTHLY TABLE
    ================================================================ */
    .ac-table-wrap {
        overflow-x: auto;
        border-radius: 18px;
        box-shadow: 0 14px 46px rgba(13,27,94,0.08);
        border: 1px solid rgba(13,27,94,0.10);
    }
    .ac-table {
        width: 100%;
        border-collapse: collapse;
        background: #ffffff;
        font-size: 13.5px;
    }
    .ac-table thead tr {
        background: linear-gradient(90deg, #0d1b5e 0%, #1a2f8a 100%);
    }
    .ac-table thead th {
        padding: 16px 18px;
        text-align: left;
        color: #ffffff;
        font-weight: 900;
        font-size: 13px;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        white-space: nowrap;
    }
    .ac-table thead th:first-child { border-radius: 17px 0 0 0; }
    .ac-table thead th:last-child  { border-radius: 0 17px 0 0; }

    .ac-table tbody tr { border-bottom: 1px solid rgba(13,27,94,0.06); transition: background 0.15s; }
    .ac-table tbody tr:last-child { border-bottom: none; }
    .ac-table tbody tr:hover { background: rgba(245,184,0,0.05); }

    .ac-table td {
        padding: 14px 18px;
        color: #475569;
        line-height: 1.65;
        vertical-align: top;
    }
    .ac-td-month { width: 130px; vertical-align: middle; }

    .ac-month-badge {
        display: inline-block;
        font-size: 12px;
        font-weight: 900;
        padding: 5px 12px;
        border-radius: 50px;
        white-space: nowrap;
    }
    .ac-month-badge--odd   { background: rgba(13,27,94,0.08);   color: #0d1b5e; border: 1px solid rgba(13,27,94,0.16); }
    .ac-month-badge--even  { background: rgba(22,163,74,0.10);  color: #166534; border: 1px solid rgba(22,163,74,0.22); }
    .ac-month-badge--exam  { background: rgba(220,38,38,0.10);  color: #991b1b; border: 1px solid rgba(220,38,38,0.22); }
    .ac-month-badge--break { background: rgba(245,184,0,0.14);  color: #92400e; border: 1px solid rgba(245,184,0,0.30); }

    /* ================================================================
    HOLIDAYS SECTION
    ================================================================ */
    .ac-holidays-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
        margin-bottom: 20px;
    }
    .ac-holiday-group {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 18px;
        padding: 22px 20px;
        box-shadow: 0 10px 34px rgba(13,27,94,0.07);
    }
    .ac-holiday-group-title {
        display: flex;
        align-items: center;
        gap: 9px;
        font-size: 14px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 16px;
        padding-bottom: 12px;
        border-bottom: 2px solid rgba(245,184,0,0.30);
    }
    .ac-holiday-group-title i { color: #f5b800; }

    .ac-holiday-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 0;
    }
    .ac-holiday-list li {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 9px 0;
        border-bottom: 1px solid rgba(13,27,94,0.06);
        gap: 10px;
    }
    .ac-holiday-list li:last-child { border-bottom: none; }
    .ac-hday-date {
        font-size: 12px;
        font-weight: 900;
        color: #f5b800;
        white-space: nowrap;
        flex-shrink: 0;
    }
    .ac-hday-name {
        font-size: 13px;
        color: #334155;
        font-weight: 700;
        text-align: right;
        flex: 1;
    }
    .ac-holidays-note {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13px;
        color: #5a6782;
        line-height: 1.65;
        padding: 14px 18px;
        background: rgba(13,27,94,0.04);
        border: 1px solid rgba(13,27,94,0.09);
        border-radius: 12px;
        margin-top: 4px;
    }
    .ac-holidays-note i { color: #0d1b5e; flex-shrink: 0; margin-top: 2px; }

    /* ================================================================
    EVENTS GRID
    ================================================================ */
    .ac-events-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 18px;
    }
    .ac-event-card {
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        border-radius: 18px;
        padding: 22px 18px;
        box-shadow: 0 10px 34px rgba(13,27,94,0.06);
        transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
    }
    .ac-event-card:hover {
        transform: translateY(-4px);
        border-color: rgba(245,184,0,0.28);
        box-shadow: 0 20px 52px rgba(13,27,94,0.11);
    }
    .ac-event-icon {
        width: 48px;
        height: 48px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        margin-bottom: 14px;
    }
    .ac-event-icon--blue { background: rgba(13,27,94,0.07); border: 1px solid rgba(13,27,94,0.14); color: #0d1b5e; }
    .ac-event-icon--gold { background: rgba(245,184,0,0.14); border: 1px solid rgba(245,184,0,0.28); color: #c97d00; }
    .ac-event-month {
        font-size: 11px;
        font-weight: 900;
        color: #f5b800;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin-bottom: 7px;
    }
    .ac-event-title { font-size: 15px; font-weight: 900; color: #0d1b5e; margin: 0 0 8px; }
    .ac-event-desc  { font-size: 13px; color: #5a6782; line-height: 1.72; margin: 0; }

    /* ================================================================
    IMPORTANT DATES GRID
    ================================================================ */
    .ac-dates-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 14px;
    }
    .ac-date-item {
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 16px 18px;
        border-radius: 14px;
        background: #ffffff;
        border: 1px solid rgba(13,27,94,0.10);
        box-shadow: 0 6px 22px rgba(13,27,94,0.06);
        transition: transform 0.2s, border-color 0.2s;
    }
    .ac-date-item:hover {
        transform: translateY(-2px);
        border-color: rgba(13,27,94,0.20);
    }
    .ac-date-item--start { border-left: 4px solid #0d1b5e; }
    .ac-date-item--exam  { border-left: 4px solid #dc2626; }
    .ac-date-item--end   { border-left: 4px solid #475569; }

    .ac-date-icon {
        width: 38px;
        height: 38px;
        border-radius: 10px;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.24);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #0d1b5e;
        font-size: 15px;
        flex-shrink: 0;
    }
    .ac-date-item--exam .ac-date-icon  { background: rgba(220,38,38,0.08); border-color: rgba(220,38,38,0.20); color: #dc2626; }
    .ac-date-item--start .ac-date-icon { background: rgba(13,27,94,0.08);  border-color: rgba(13,27,94,0.18);  color: #0d1b5e; }

    .ac-date-info { display: flex; flex-direction: column; gap: 2px; }
    .ac-date-val   { font-size: 14px; font-weight: 900; color: #0d1b5e; line-height: 1.2; }
    .ac-date-label { font-size: 12px; color: #64748b; font-weight: 700; line-height: 1.4; }

    /* ================================================================
    DOWNLOAD BOX
    ================================================================ */
    .ac-download-box {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 24px 28px;
        border-radius: 18px;
        background: linear-gradient(135deg, #fff9e6 0%, #fffbf0 100%);
        border: 1.5px solid rgba(245,184,0,0.40);
        border-left: 5px solid #f5b800;
        flex-wrap: wrap;
    }
    .ac-download-left {
        display: flex;
        align-items: center;
        gap: 18px;
        flex: 1;
    }
    .ac-download-icon {
        width: 52px;
        height: 52px;
        border-radius: 14px;
        background: rgba(220,38,38,0.10);
        border: 1px solid rgba(220,38,38,0.20);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        color: #dc2626;
        flex-shrink: 0;
    }
    .ac-download-title { font-size: 17px; font-weight: 900; color: #0d1b5e; margin: 0 0 4px; }
    .ac-download-sub   { font-size: 13px; color: #5a6782; margin: 0; line-height: 1.6; }
    .ac-download-btn {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        color: #ffffff;
        font-size: 14px;
        font-weight: 900;
        padding: 12px 24px;
        border-radius: 12px;
        text-decoration: none;
        white-space: nowrap;
        box-shadow: 0 8px 22px rgba(13,27,94,0.20);
        transition: transform 0.2s, box-shadow 0.2s;
    }
    .ac-download-btn i { color: #f5b800; }
    .ac-download-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 12px 30px rgba(13,27,94,0.28);
        color: #ffffff;
    }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .ac-cta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        padding: 28px 26px;
        border-radius: 22px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border: 1px solid rgba(245,184,0,0.22);
        flex-wrap: wrap;
    }
    .ac-cta-title { margin: 0 0 8px; color: #ffffff; font-weight: 1000; font-size: 22px; }
    .ac-cta-sub   { margin: 0; color: rgba(255,255,255,0.78); line-height: 1.75; font-size: 14px; max-width: 520px; }
    .ac-cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }
    .ac-cta-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 14px;
        padding: 13px 20px;
        font-weight: 1000;
        font-size: 14px;
        text-decoration: none;
        border: 1px solid transparent;
        transition: transform 0.2s, box-shadow 0.2s, filter 0.2s, background 0.2s, border-color 0.2s;
    }
    .ac-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0b1027;
        box-shadow: 0 12px 28px rgba(245,184,0,0.26);
    }
    .ac-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 16px 38px rgba(245,184,0,0.34);
        filter: brightness(1.03);
        color: #0b1027;
    }
    .ac-cta-btn--outline {
        background: rgba(255,255,255,0.07);
        color: #ffffff;
        border-color: rgba(255,255,255,0.22);
    }
    .ac-cta-btn--outline:hover {
        transform: translateY(-2px);
        background: rgba(255,255,255,0.12);
        border-color: rgba(255,255,255,0.34);
        color: #ffffff;
    }

    /* ================================================================
    RESPONSIVE
    ================================================================ */
    @media (max-width: 1100px) {
        .ac-events-grid { grid-template-columns: repeat(2, 1fr); }
        .ac-dates-grid  { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 991px) {
        .ac-stats-grid    { grid-template-columns: repeat(2, 1fr); }
        .ac-stat-card     { border-right: none; border-bottom: 1px solid rgba(13,27,94,0.08); }
        .ac-holidays-grid { grid-template-columns: 1fr; }
        .ac-cta           { flex-direction: column; align-items: flex-start; }
        .ac-cta-actions   { width: 100%; }
        .ac-download-box  { flex-direction: column; align-items: flex-start; }
        .ac-download-btn  { width: 100%; justify-content: center; }
    }
    @media (max-width: 767px) {
        .ac-container     { padding: 0 18px; }
        .ac-section       { padding: 48px 0; }
        .ac-section--cta  { padding-bottom: 70px; }
        .ac-stats-grid    { grid-template-columns: 1fr 1fr; }
        .ac-timeline::before { left: 22px; }
        .ac-tl-marker     { width: 46px; height: 46px; font-size: 15px; }
        .ac-events-grid   { grid-template-columns: 1fr; }
        .ac-dates-grid    { grid-template-columns: 1fr 1fr; }
        .ac-cta-actions   { flex-direction: column; width: 100%; }
        .ac-cta-btn       { width: 100%; justify-content: center; }
        .ac-table thead th,
        .ac-table td      { padding: 11px 13px; font-size: 12.5px; }
        .ac-td-month      { width: 100px; }
    }

    /* ================================================================
    FORM FILLUP NOTICE PAGE  (ff-*)
    Colors: Primary #0d1b5e | Accent gold #f5b800 | Text #333
    ================================================================ */

    /* ---- Shared Container ---- */
    .ff-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 28px;
    }

    /* ---- Shared Section Tag ---- */
    .ff-section-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 800;
        padding: 6px 18px;
        border-radius: 50px;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        margin-bottom: 14px;
    }

    /* ---- Shared Section Header ---- */
    .ff-section-header {
        text-align: center;
        margin-bottom: 48px;
    }

    .ff-section-heading {
        font-size: clamp(26px, 4vw, 36px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 14px;
        line-height: 1.25;
    }

    .ff-section-sub {
        font-size: 15.5px;
        color: #555;
        max-width: 640px;
        margin: 0 auto;
        line-height: 1.8;
    }

    .ff-accent {
        color: #f5b800;
    }

    /* ================================================================
    ALERT / LIVE NOTICE BANNER
    ================================================================ */
    .ff-alert-section {
        padding: 24px 0;
        background: #fff8e7;
        border-bottom: 2px solid #f5b800;
    }

    .ff-alert {
        display: flex;
        align-items: center;
        gap: 18px;
        background: #ffffff;
        border: 2px solid #f5b800;
        border-radius: 14px;
        padding: 20px 24px;
        box-shadow: 0 4px 18px rgba(245,184,0,0.14);
        flex-wrap: wrap;
    }

    .ff-alert-icon {
        width: 52px;
        height: 52px;
        background: linear-gradient(135deg, #f5b800, #e07b00);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        color: #fff;
        font-size: 22px;
        animation: ff-bell-ring 1.8s ease infinite;
    }

    @keyframes ff-bell-ring {
        0%, 100% { transform: rotate(0); }
        15%       { transform: rotate(14deg); }
        30%       { transform: rotate(-12deg); }
        45%       { transform: rotate(10deg); }
        60%       { transform: rotate(-6deg); }
        75%       { transform: rotate(3deg); }
    }

    .ff-alert-body {
        flex: 1;
        min-width: 0;
        font-size: 14.5px;
        color: #333;
        line-height: 1.7;
    }

    .ff-alert-title {
        color: #c8700a;
        font-size: 13px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin-right: 6px;
    }

    .ff-alert-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        color: #fff;
        font-size: 13px;
        font-weight: 700;
        padding: 11px 22px;
        border-radius: 30px;
        text-decoration: none;
        white-space: nowrap;
        flex-shrink: 0;
        transition: background 0.25s, transform 0.2s, box-shadow 0.25s;
        box-shadow: 0 3px 10px rgba(13,27,94,0.28);
    }

    .ff-alert-btn:hover {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        transform: translateY(-2px);
        box-shadow: 0 6px 18px rgba(245,184,0,0.35);
    }

    /* ================================================================
    INTRO SECTION
    ================================================================ */
    .ff-intro-section {
        padding: 80px 0;
        background: #f4f6f9;
    }

    .ff-intro-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 52px;
        align-items: start;
    }

    .ff-intro-heading {
        font-size: clamp(24px, 3.5vw, 34px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 18px;
        line-height: 1.25;
    }

    .ff-intro-text {
        font-size: 15px;
        color: #555;
        line-height: 1.85;
        margin-bottom: 16px;
    }

    .ff-intro-pills {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 24px;
    }

    .ff-pill {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: #ffffff;
        border: 1.5px solid rgba(13,27,94,0.16);
        color: #0d1b5e;
        font-size: 12.5px;
        font-weight: 700;
        padding: 7px 16px;
        border-radius: 50px;
        box-shadow: 0 2px 8px rgba(13,27,94,0.07);
    }

    /* ---- Info Cards (right side) ---- */
    .ff-intro-cards {
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    .ff-info-card {
        display: flex;
        align-items: flex-start;
        gap: 18px;
        background: #ffffff;
        border-radius: 16px;
        padding: 22px 24px;
        box-shadow: 0 4px 20px rgba(13,27,94,0.08);
        border: 1px solid rgba(13,27,94,0.08);
        transition: transform 0.25s, box-shadow 0.25s;
    }

    .ff-info-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 32px rgba(13,27,94,0.14);
    }

    .ff-info-card-icon {
        width: 50px;
        height: 50px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #ffffff;
        font-size: 20px;
        flex-shrink: 0;
    }

    .ff-info-card-icon--yellow {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #fff;
    }

    .ff-info-card-icon--green {
        background: linear-gradient(135deg, #1aa34a 0%, #15803d 100%);
    }

    .ff-info-card-title {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 6px;
    }

    .ff-info-card-text {
        font-size: 13.5px;
        color: #666;
        line-height: 1.7;
        margin: 0;
    }

    /* ================================================================
    IMPORTANT DATES TABLE
    ================================================================ */
    .ff-dates-section {
        padding: 80px 0;
        background: #ffffff;
    }

    .ff-dates-table-wrap {
        overflow-x: auto;
        border-radius: 18px;
        box-shadow: 0 6px 30px rgba(13,27,94,0.1);
        border: 1px solid rgba(13,27,94,0.1);
    }

    .ff-dates-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 14.5px;
        min-width: 600px;
    }

    .ff-table-caption {
        font-size: 13px;
        color: #888;
        text-align: left;
        padding: 14px 20px 8px;
        caption-side: top;
    }

    .ff-dates-table thead tr {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        color: #ffffff;
    }

    .ff-dates-table thead th {
        padding: 16px 20px;
        font-size: 13px;
        font-weight: 800;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        text-align: left;
        white-space: nowrap;
    }

    .ff-dates-table thead th:first-child {
        border-radius: 18px 0 0 0;
    }

    .ff-dates-table thead th:last-child {
        border-radius: 0 18px 0 0;
    }

    .ff-dates-table tbody tr {
        border-bottom: 1px solid rgba(13,27,94,0.07);
        transition: background 0.2s;
    }

    .ff-dates-table tbody tr:last-child {
        border-bottom: none;
    }

    .ff-dates-table tbody tr:hover {
        background: rgba(13,27,94,0.03);
    }

    .ff-dates-table tbody td {
        padding: 15px 20px;
        color: #333;
        vertical-align: middle;
    }

    .ff-dates-table tbody td:first-child {
        font-weight: 700;
        color: #0d1b5e;
    }

    /* Status badges */
    .ff-badge {
        display: inline-flex;
        align-items: center;
        font-size: 12px;
        font-weight: 700;
        padding: 4px 14px;
        border-radius: 50px;
        letter-spacing: 0.3px;
    }

    .ff-badge--open {
        background: rgba(26,163,74,0.12);
        color: #1aa34a;
        border: 1.5px solid rgba(26,163,74,0.3);
    }

    .ff-badge--upcoming {
        background: rgba(13,27,94,0.08);
        color: #1a2f8a;
        border: 1.5px solid rgba(13,27,94,0.18);
    }

    .ff-badge--closed {
        background: rgba(220,38,38,0.08);
        color: #dc2626;
        border: 1.5px solid rgba(220,38,38,0.2);
    }

    /* Responsive table — show labels on mobile */
    @media (max-width: 600px) {
        .ff-dates-table thead { display: none; }

        .ff-dates-table tbody,
        .ff-dates-table tr,
        .ff-dates-table td {
            display: block;
            width: 100%;
        }

        .ff-dates-table tbody tr {
            border: 1px solid rgba(13,27,94,0.1);
            border-radius: 12px;
            margin-bottom: 14px;
            padding: 4px 0;
        }

        .ff-dates-table tbody td {
            padding: 10px 16px;
            text-align: right;
            position: relative;
        }

        .ff-dates-table tbody td::before {
            content: attr(data-label);
            position: absolute;
            left: 16px;
            font-weight: 700;
            color: #0d1b5e;
            font-size: 12px;
            text-transform: uppercase;
        }
    }

    /* ================================================================
    STEP-BY-STEP PROCESS
    ================================================================ */
    .ff-steps-section {
        padding: 80px 0;
        background: linear-gradient(160deg, #f0f3fa 0%, #e8ecf8 100%);
    }

    .ff-steps-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 28px;
    }

    .ff-step-card {
        background: #ffffff;
        border-radius: 20px;
        padding: 32px 28px;
        box-shadow: 0 4px 22px rgba(13,27,94,0.09);
        border: 1px solid rgba(13,27,94,0.08);
        position: relative;
        overflow: hidden;
        transition: transform 0.25s, box-shadow 0.25s;
    }

    .ff-step-card::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 4px;
        background: linear-gradient(90deg, #0d1b5e, #f5b800);
        border-radius: 20px 20px 0 0;
    }

    .ff-step-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 14px 40px rgba(13,27,94,0.15);
    }

    .ff-step-num {
        position: absolute;
        top: 18px;
        right: 20px;
        font-size: 52px;
        font-weight: 900;
        color: rgba(13,27,94,0.05);
        line-height: 1;
        user-select: none;
    }

    .ff-step-icon {
        width: 58px;
        height: 58px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 24px;
        margin-bottom: 20px;
    }

    .ff-step-title {
        font-size: 17px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 12px;
    }

    .ff-step-text {
        font-size: 14px;
        color: #666;
        line-height: 1.75;
        margin: 0;
    }

    /* ================================================================
    DOCUMENTS + FEE PANEL
    ================================================================ */
    .ff-docs-section {
        padding: 80px 0;
        background: #ffffff;
    }

    .ff-docs-grid {
        display: grid;
        grid-template-columns: 1fr 360px;
        gap: 48px;
        align-items: start;
    }

    .ff-docs-heading {
        font-size: clamp(24px, 3.5vw, 34px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 14px;
        line-height: 1.25;
    }

    .ff-docs-sub {
        font-size: 15px;
        color: #555;
        line-height: 1.8;
        margin-bottom: 32px;
    }

    .ff-doc-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

    .ff-doc-item {
        display: flex;
        align-items: flex-start;
        gap: 14px;
        padding: 16px 20px;
        background: #f8f9fd;
        border-radius: 12px;
        border-left: 4px solid #0d1b5e;
        transition: border-color 0.2s, background 0.2s;
    }

    .ff-doc-item:hover {
        background: #eef1fb;
        border-left-color: #f5b800;
    }

    .ff-doc-icon {
        color: #1aa34a;
        font-size: 18px;
        flex-shrink: 0;
        margin-top: 2px;
    }

    .ff-doc-text {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .ff-doc-text strong {
        font-size: 14.5px;
        color: #0d1b5e;
        font-weight: 700;
    }

    .ff-doc-text span {
        font-size: 13px;
        color: #777;
        line-height: 1.6;
    }

    /* ---- Fee Panel ---- */
    .ff-fee-panel {
        background: linear-gradient(160deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 22px;
        padding: 30px 28px;
        color: #ffffff;
        position: sticky;
        top: 100px;
        box-shadow: 0 12px 40px rgba(13,27,94,0.3);
    }

    .ff-fee-header {
        display: flex;
        align-items: center;
        gap: 12px;
        margin-bottom: 24px;
        padding-bottom: 18px;
        border-bottom: 1.5px solid rgba(255,255,255,0.14);
    }

    .ff-fee-header i {
        font-size: 26px;
        color: #f5b800;
    }

    .ff-fee-title {
        font-size: 17px;
        font-weight: 800;
        color: #ffffff;
        margin: 0;
    }

    .ff-fee-list {
        list-style: none;
        padding: 0;
        margin: 0 0 24px;
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .ff-fee-item {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 13px 0;
        border-bottom: 1px solid rgba(255,255,255,0.1);
        gap: 10px;
    }

    .ff-fee-item:last-child {
        border-bottom: none;
    }

    .ff-fee-item--total .ff-fee-label {
        font-weight: 800;
        color: #f5b800;
    }

    .ff-fee-item--total .ff-fee-amount {
        font-weight: 900;
        color: #f5b800;
        font-size: 15px;
    }

    .ff-fee-label {
        font-size: 13.5px;
        color: rgba(255,255,255,0.82);
    }

    .ff-fee-amount {
        font-size: 14px;
        font-weight: 700;
        color: #ffffff;
        white-space: nowrap;
    }

    .ff-fee-note {
        font-size: 12px;
        color: rgba(255,255,255,0.58);
        line-height: 1.65;
        margin-bottom: 22px;
        display: flex;
        gap: 8px;
    }

    .ff-fee-note i {
        color: #f5b800;
        flex-shrink: 0;
        margin-top: 2px;
    }

    .ff-fee-contact-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        font-size: 14px;
        font-weight: 800;
        padding: 13px 0;
        border-radius: 30px;
        text-decoration: none;
        width: 100%;
        transition: transform 0.2s, box-shadow 0.25s;
        box-shadow: 0 4px 16px rgba(245,184,0,0.4);
    }

    .ff-fee-contact-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(245,184,0,0.55);
        color: #0a1440;
    }

    /* ================================================================
    DOWNLOAD NOTICES
    ================================================================ */
    .ff-download-section {
        padding: 80px 0;
        background: #f4f6f9;
    }

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

    .ff-download-card {
        display: flex;
        align-items: center;
        gap: 18px;
        background: #ffffff;
        border-radius: 16px;
        padding: 22px 24px;
        box-shadow: 0 4px 18px rgba(13,27,94,0.08);
        border: 1px solid rgba(13,27,94,0.08);
        transition: transform 0.25s, box-shadow 0.25s;
    }

    .ff-download-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 32px rgba(13,27,94,0.14);
    }

    .ff-download-icon {
        width: 52px;
        height: 52px;
        background: linear-gradient(135deg, #e84118 0%, #c0320d 100%);
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #ffffff;
        font-size: 22px;
        flex-shrink: 0;
    }

    .ff-download-icon--blue   { background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%); }
    .ff-download-icon--green  { background: linear-gradient(135deg, #1aa34a 0%, #15803d 100%); }
    .ff-download-icon--purple { background: linear-gradient(135deg, #7c3aed 0%, #5b21b6 100%); }
    .ff-download-icon--orange { background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%); }

    .ff-download-info {
        flex: 1;
        min-width: 0;
    }

    .ff-download-title {
        font-size: 14.5px;
        font-weight: 700;
        color: #0d1b5e;
        margin: 0 0 7px;
        line-height: 1.4;
    }

    .ff-download-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        font-size: 12px;
        color: #888;
    }

    .ff-download-meta span {
        display: flex;
        align-items: center;
        gap: 5px;
    }

    .ff-download-btn {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        color: #f5b800;
        font-size: 13px;
        font-weight: 700;
        padding: 10px 18px;
        border-radius: 30px;
        text-decoration: none;
        white-space: nowrap;
        flex-shrink: 0;
        transition: background 0.25s, transform 0.2s, box-shadow 0.25s;
        box-shadow: 0 3px 10px rgba(13,27,94,0.2);
    }

    .ff-download-btn:hover {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        transform: translateY(-2px);
        box-shadow: 0 6px 18px rgba(245,184,0,0.35);
    }

    /* ================================================================
    RULES & GUIDELINES
    ================================================================ */
    .ff-rules-section {
        padding: 80px 0;
        background: #ffffff;
    }

    .ff-rules-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 28px;
    }

    .ff-rule-card {
        background: #f8f9fd;
        border-radius: 20px;
        padding: 32px 28px;
        border: 1px solid rgba(13,27,94,0.08);
        transition: transform 0.25s, box-shadow 0.25s;
    }

    .ff-rule-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 36px rgba(13,27,94,0.12);
        background: #fff;
    }

    .ff-rule-icon {
        width: 56px;
        height: 56px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 22px;
        margin-bottom: 20px;
    }

    .ff-rule-title {
        font-size: 17px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 16px;
    }

    .ff-rule-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .ff-rule-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13.5px;
        color: #555;
        line-height: 1.6;
    }

    .ff-rule-list li i {
        color: #f5b800;
        font-size: 11px;
        flex-shrink: 0;
        margin-top: 4px;
    }

    /* ================================================================
    FAQ ACCORDION
    ================================================================ */
    .ff-faq-section {
        padding: 80px 0;
        background: linear-gradient(160deg, #f0f3fa 0%, #e8ecf8 100%);
    }

    .ff-accordion {
        max-width: 800px;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    .ff-detail {
        background: #ffffff;
        border-radius: 14px;
        border: 1px solid rgba(13,27,94,0.1);
        box-shadow: 0 2px 12px rgba(13,27,94,0.06);
        overflow: hidden;
        transition: box-shadow 0.25s;
    }

    .ff-detail[open] {
        box-shadow: 0 6px 24px rgba(13,27,94,0.12);
    }

    .ff-summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 20px 24px;
        cursor: pointer;
        font-size: 15px;
        font-weight: 700;
        color: #0d1b5e;
        list-style: none;
        user-select: none;
        transition: background 0.2s;
    }

    .ff-summary::-webkit-details-marker { display: none; }

    .ff-summary:hover {
        background: rgba(13,27,94,0.03);
    }

    .ff-detail[open] .ff-summary {
        color: #1a2f8a;
        border-bottom: 1px solid rgba(13,27,94,0.08);
    }

    .ff-summary-icon {
        width: 30px;
        height: 30px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 12px;
        flex-shrink: 0;
        transition: background 0.25s;
    }

    .ff-detail[open] .ff-summary-icon {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
    }

    .ff-detail-body {
        padding: 18px 24px;
    }

    .ff-detail-body p {
        font-size: 14.5px;
        color: #555;
        line-height: 1.8;
        margin: 0;
    }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .ff-cta-section {
        padding: 90px 0;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 60%, #2a4aad 100%);
        position: relative;
        overflow: hidden;
        text-align: center;
    }

    .ff-cta-overlay {
        position: absolute;
        inset: 0;
        background:
            radial-gradient(ellipse at 20% 50%, rgba(245,184,0,0.12) 0%, transparent 60%),
            radial-gradient(ellipse at 80% 20%, rgba(255,255,255,0.06) 0%, transparent 50%);
        pointer-events: none;
    }

    .ff-cta-inner {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 28px;
        position: relative;
        z-index: 1;
    }

    .ff-cta-icon {
        width: 78px;
        height: 78px;
        background: rgba(245,184,0,0.15);
        border: 2px solid rgba(245,184,0,0.35);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 32px;
    }

    .ff-cta-heading {
        font-size: clamp(26px, 4vw, 40px);
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .ff-cta-sub {
        font-size: 16px;
        color: rgba(255,255,255,0.78);
        line-height: 1.8;
        max-width: 560px;
        margin: 0;
    }

    .ff-cta-text { max-width: 620px; }

    .ff-cta-actions {
        display: flex;
        gap: 16px;
        flex-wrap: wrap;
        justify-content: center;
    }

    .ff-cta-btn {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        font-size: 14.5px;
        font-weight: 700;
        padding: 14px 32px;
        border-radius: 50px;
        text-decoration: none;
        transition: transform 0.2s, box-shadow 0.25s, background 0.25s;
    }

    .ff-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        box-shadow: 0 4px 16px rgba(245,184,0,0.45);
    }

    .ff-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 28px rgba(245,184,0,0.6);
        color: #0a1440;
    }

    .ff-cta-btn--outline {
        background: transparent;
        color: #ffffff;
        border: 2px solid rgba(255,255,255,0.45);
    }

    .ff-cta-btn--outline:hover {
        background: rgba(255,255,255,0.1);
        border-color: rgba(255,255,255,0.8);
        transform: translateY(-2px);
        color: #ffffff;
    }

    /* ================================================================
    RESPONSIVE — FORM FILLUP PAGE
    ================================================================ */
    @media (max-width: 1024px) {
        .ff-docs-grid    { grid-template-columns: 1fr; }
        .ff-fee-panel    { position: static; }
    }

    @media (max-width: 900px) {
        .ff-intro-grid   { grid-template-columns: 1fr; gap: 36px; }
        .ff-steps-grid   { grid-template-columns: repeat(2, 1fr); }
        .ff-rules-grid   { grid-template-columns: repeat(2, 1fr); }
        .ff-download-grid { grid-template-columns: 1fr; }
    }

    @media (max-width: 640px) {
        .ff-container    { padding: 0 18px; }
        .ff-intro-section,
        .ff-dates-section,
        .ff-steps-section,
        .ff-docs-section,
        .ff-download-section,
        .ff-rules-section,
        .ff-faq-section  { padding: 56px 0; }
        .ff-cta-section  { padding: 60px 0; }
        .ff-steps-grid   { grid-template-columns: 1fr; }
        .ff-rules-grid   { grid-template-columns: 1fr; }
        .ff-alert        { flex-direction: column; align-items: flex-start; gap: 14px; }
        .ff-alert-btn    { width: 100%; justify-content: center; }
        .ff-download-card { flex-wrap: wrap; }
        .ff-download-btn { width: 100%; justify-content: center; }
        .ff-cta-btn      { width: 100%; justify-content: center; }
        .ff-section-header { margin-bottom: 32px; }
        .ff-docs-sub     { margin-bottom: 22px; }
        .ff-summary      { font-size: 14px; padding: 16px 18px; }
        .ff-detail-body  { padding: 14px 18px; }
    }

    /* ================================================================
    EXAMINATION DEPARTMENT PAGE  (exd-*)
    Colors: #0d1b5e navy | #f5b800 gold | #1aa34a green | bg #f4f6f9
    ================================================================ */

    /* ---- Container ---- */
    .exd-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 28px;
    }

    /* ---- Shared accent ---- */
    .exd-accent { color: #f5b800; }

    /* ---- Section tag ---- */
    .exd-section-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 800;
        padding: 6px 18px;
        border-radius: 50px;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        margin-bottom: 14px;
    }

    /* ---- Shared section header ---- */
    .exd-section-header {
        text-align: center;
        margin-bottom: 52px;
    }

    .exd-section-heading {
        font-size: clamp(26px, 4vw, 36px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 14px;
        line-height: 1.25;
    }

    .exd-section-sub {
        font-size: 15.5px;
        color: #555;
        max-width: 640px;
        margin: 0 auto;
        line-height: 1.8;
    }

    /* ================================================================
    STATS BAR
    ================================================================ */
    .exd-stats-bar {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        padding: 0;
        border-bottom: 3px solid #f5b800;
    }

    .exd-stats-row {
        display: flex;
        align-items: stretch;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .exd-stat-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 22px 20px;
        flex: 1;
        min-width: 140px;
        gap: 4px;
        transition: background 0.25s;
    }

    .exd-stat-item:hover {
        background: rgba(245,184,0,0.09);
    }

    .exd-stat-num {
        font-size: clamp(22px, 3vw, 30px);
        font-weight: 900;
        color: #f5b800;
        line-height: 1;
    }

    .exd-stat-label {
        font-size: 12px;
        color: rgba(255,255,255,0.75);
        text-align: center;
        line-height: 1.4;
        letter-spacing: 0.2px;
    }

    .exd-stat-divider {
        width: 1px;
        background: rgba(255,255,255,0.12);
        align-self: stretch;
        margin: 14px 0;
    }

    /* ================================================================
    ABOUT THE DEPARTMENT
    ================================================================ */
    .exd-about-section {
        padding: 88px 0;
        background: #f4f6f9;
    }

    .exd-about-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 56px;
        align-items: start;
    }

    .exd-about-heading {
        font-size: clamp(24px, 3.5vw, 34px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 20px;
        line-height: 1.25;
    }

    .exd-about-text {
        font-size: 15px;
        color: #555;
        line-height: 1.85;
        margin-bottom: 16px;
    }

    .exd-about-features {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 26px;
    }

    .exd-feature-chip {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: #ffffff;
        border: 1.5px solid rgba(13,27,94,0.15);
        color: #0d1b5e;
        font-size: 12.5px;
        font-weight: 700;
        padding: 7px 16px;
        border-radius: 50px;
        box-shadow: 0 2px 8px rgba(13,27,94,0.07);
        transition: background 0.2s, border-color 0.2s;
    }

    .exd-feature-chip:hover {
        background: #0d1b5e;
        color: #f5b800;
        border-color: #0d1b5e;
    }

    /* ---- Highlight Cards ---- */
    .exd-about-visual {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .exd-highlight-card {
        display: flex;
        align-items: flex-start;
        gap: 18px;
        padding: 24px 26px;
        border-radius: 18px;
        transition: transform 0.25s, box-shadow 0.25s;
    }

    .exd-highlight-card:hover {
        transform: translateX(6px);
        box-shadow: 0 10px 32px rgba(0,0,0,0.12);
    }

    .exd-highlight-card--primary {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
    }

    .exd-highlight-card--gold {
        background: linear-gradient(135deg, #c8700a 0%, #f5b800 100%);
    }

    .exd-highlight-card--green {
        background: linear-gradient(135deg, #155b30 0%, #1aa34a 100%);
    }

    .exd-highlight-icon {
        width: 50px;
        height: 50px;
        background: rgba(255,255,255,0.15);
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #ffffff;
        font-size: 22px;
        flex-shrink: 0;
    }

    .exd-highlight-body h3 {
        font-size: 16px;
        font-weight: 800;
        color: #ffffff;
        margin: 0 0 6px;
    }

    .exd-highlight-body p {
        font-size: 13.5px;
        color: rgba(255,255,255,0.82);
        line-height: 1.65;
        margin: 0;
    }

    /* ================================================================
    ROLES & RESPONSIBILITIES
    ================================================================ */
    .exd-roles-section {
        padding: 88px 0;
        background: #ffffff;
    }

    .exd-roles-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 28px;
    }

    .exd-role-card {
        background: #f8f9fd;
        border-radius: 20px;
        padding: 32px 28px;
        border: 1px solid rgba(13,27,94,0.08);
        position: relative;
        overflow: hidden;
        transition: transform 0.25s, box-shadow 0.25s, background 0.25s;
    }

    .exd-role-card::after {
        content: '';
        position: absolute;
        top: 0; left: 0; right: 0;
        height: 4px;
        background: linear-gradient(90deg, #0d1b5e, #f5b800);
        border-radius: 20px 20px 0 0;
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 0.3s ease;
    }

    .exd-role-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 14px 42px rgba(13,27,94,0.14);
        background: #ffffff;
    }

    .exd-role-card:hover::after {
        transform: scaleX(1);
    }

    .exd-role-icon {
        width: 58px;
        height: 58px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 24px;
        margin-bottom: 20px;
    }

    .exd-role-title {
        font-size: 17px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 12px;
    }

    .exd-role-text {
        font-size: 13.5px;
        color: #666;
        line-height: 1.75;
        margin-bottom: 16px;
    }

    .exd-role-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .exd-role-list li {
        display: flex;
        align-items: center;
        gap: 9px;
        font-size: 13px;
        color: #555;
    }

    .exd-role-list li i {
        color: #1aa34a;
        font-size: 12px;
        flex-shrink: 0;
    }

    /* ================================================================
    DEPARTMENT TEAM
    ================================================================ */
    .exd-team-section {
        padding: 88px 0;
        background: linear-gradient(160deg, #f0f3fa 0%, #e8ecf8 100%);
    }

    .exd-team-grid {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        gap: 24px;
        align-items: start;
    }

    /* Featured card spans full width of first column */
    .exd-team-card {
        background: #ffffff;
        border-radius: 20px;
        padding: 30px 26px;
        box-shadow: 0 4px 22px rgba(13,27,94,0.09);
        border: 1px solid rgba(13,27,94,0.08);
        transition: transform 0.25s, box-shadow 0.25s;
    }

    .exd-team-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 14px 40px rgba(13,27,94,0.15);
    }

    .exd-team-card--featured {
        grid-column: span 2;
        display: flex;
        gap: 26px;
        align-items: flex-start;
        border: 2px solid rgba(245,184,0,0.4);
        background: linear-gradient(135deg, #fefdf5 0%, #fffef8 100%);
    }

    /* Avatar */
    .exd-team-avatar {
        width: 72px;
        height: 72px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        position: relative;
    }

    .exd-team-card--featured .exd-team-avatar {
        width: 90px;
        height: 90px;
    }

    .exd-team-avatar--blue   { background: linear-gradient(135deg, #1e40af 0%, #3b82f6 100%); }
    .exd-team-avatar--green  { background: linear-gradient(135deg, #155b30 0%, #1aa34a 100%); }
    .exd-team-avatar--purple { background: linear-gradient(135deg, #5b21b6 0%, #8b5cf6 100%); }

    .exd-avatar-initials {
        font-size: 22px;
        font-weight: 900;
        color: #ffffff;
        letter-spacing: 1px;
    }

    .exd-team-card--featured .exd-avatar-initials {
        font-size: 28px;
    }

    .exd-team-badge {
        position: absolute;
        bottom: -2px;
        right: -2px;
        width: 24px;
        height: 24px;
        background: linear-gradient(135deg, #f5b800, #e07b00);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #ffffff;
        font-size: 10px;
        border: 2px solid #ffffff;
    }

    .exd-team-info { flex: 1; min-width: 0; }

    .exd-team-name {
        font-size: 17px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 4px;
    }

    .exd-team-card--featured .exd-team-name { font-size: 20px; }

    .exd-team-role {
        display: inline-block;
        font-size: 12px;
        font-weight: 700;
        color: #c8700a;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.3);
        padding: 3px 12px;
        border-radius: 50px;
        margin-bottom: 12px;
        letter-spacing: 0.3px;
    }

    .exd-team-bio {
        font-size: 13.5px;
        color: #666;
        line-height: 1.7;
        margin-bottom: 16px;
    }

    .exd-team-contact {
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

    .exd-team-contact-link {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        color: #1a2f8a;
        font-weight: 600;
        text-decoration: none;
        transition: color 0.2s;
    }

    .exd-team-contact-link:hover { color: #c8700a; }

    .exd-team-contact-link i {
        width: 18px;
        text-align: center;
        color: #f5b800;
        font-size: 12px;
    }

    /* ================================================================
    EXAMINATION TIMELINE / CALENDAR
    ================================================================ */
    .exd-timeline-section {
        padding: 88px 0;
        background: #ffffff;
    }

    .exd-timeline {
        position: relative;
        max-width: 820px;
        margin: 0 auto;
        padding-left: 40px;
    }

    .exd-timeline::before {
        content: '';
        position: absolute;
        left: 18px;
        top: 0;
        bottom: 0;
        width: 3px;
        background: linear-gradient(to bottom, #0d1b5e, rgba(13,27,94,0.1));
        border-radius: 2px;
    }

    .exd-tl-item {
        display: flex;
        gap: 24px;
        margin-bottom: 32px;
        align-items: flex-start;
        position: relative;
    }

    .exd-tl-item:last-child { margin-bottom: 0; }

    .exd-tl-marker {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 15px;
        flex-shrink: 0;
        position: absolute;
        left: -40px;
        top: 4px;
        background: rgba(13,27,94,0.12);
        color: #0d1b5e;
        border: 3px solid #ffffff;
        box-shadow: 0 0 0 2px rgba(13,27,94,0.2);
        z-index: 1;
    }

    .exd-tl-marker--active {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #ffffff;
        box-shadow: 0 0 0 2px rgba(245,184,0,0.5);
        animation: exd-pulse 2s ease infinite;
    }

    .exd-tl-marker--upcoming {
        background: #f4f6f9;
        color: rgba(13,27,94,0.4);
        box-shadow: 0 0 0 2px rgba(13,27,94,0.1);
    }

    .exd-tl-item--done .exd-tl-marker {
        background: linear-gradient(135deg, #1aa34a, #15803d);
        color: #ffffff;
        box-shadow: 0 0 0 2px rgba(26,163,74,0.4);
    }

    @keyframes exd-pulse {
        0%, 100% { box-shadow: 0 0 0 2px rgba(245,184,0,0.5); }
        50%       { box-shadow: 0 0 0 6px rgba(245,184,0,0.2); }
    }

    .exd-tl-card {
        background: #f8f9fd;
        border-radius: 16px;
        padding: 22px 24px;
        border: 1px solid rgba(13,27,94,0.08);
        flex: 1;
        transition: transform 0.2s, box-shadow 0.2s;
    }

    .exd-tl-card:hover {
        transform: translateX(4px);
        box-shadow: 0 6px 24px rgba(13,27,94,0.1);
    }

    .exd-tl-card--active {
        background: #fffdf0;
        border: 2px solid rgba(245,184,0,0.4);
    }

    .exd-tl-date {
        display: inline-block;
        font-size: 11.5px;
        font-weight: 700;
        color: #888;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        margin-bottom: 6px;
    }

    .exd-tl-title {
        font-size: 16px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 8px;
    }

    .exd-tl-text {
        font-size: 13.5px;
        color: #666;
        line-height: 1.7;
        margin: 0 0 12px;
    }

    /* Timeline badges */
    .exd-tl-badge {
        display: inline-flex;
        align-items: center;
        font-size: 11px;
        font-weight: 700;
        padding: 3px 12px;
        border-radius: 50px;
        letter-spacing: 0.3px;
    }

    .exd-tl-badge--done {
        background: rgba(26,163,74,0.12);
        color: #1aa34a;
        border: 1.5px solid rgba(26,163,74,0.3);
    }

    .exd-tl-badge--active {
        background: rgba(245,184,0,0.15);
        color: #c8700a;
        border: 1.5px solid rgba(245,184,0,0.4);
    }

    .exd-tl-badge--upcoming {
        background: rgba(13,27,94,0.07);
        color: #1a2f8a;
        border: 1.5px solid rgba(13,27,94,0.15);
    }

    /* ================================================================
    KEY POLICIES
    ================================================================ */
    .exd-policy-section {
        padding: 88px 0;
        background: #f4f6f9;
    }

    .exd-policy-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 28px;
    }

    .exd-policy-card {
        background: #ffffff;
        border-radius: 20px;
        padding: 34px 30px;
        border: 1px solid transparent;
        transition: transform 0.25s, box-shadow 0.25s;
        position: relative;
        overflow: hidden;
    }

    .exd-policy-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 14px 40px rgba(13,27,94,0.12);
    }

    .exd-policy-card--blue  { border-left: 5px solid #0d1b5e; }
    .exd-policy-card--gold  { border-left: 5px solid #f5b800; }
    .exd-policy-card--green { border-left: 5px solid #1aa34a; }
    .exd-policy-card--red   { border-left: 5px solid #dc2626; }

    .exd-policy-icon {
        width: 56px;
        height: 56px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        margin-bottom: 20px;
        color: #ffffff;
    }

    .exd-policy-card--blue  .exd-policy-icon { background: linear-gradient(135deg, #0d1b5e, #1a2f8a); }
    .exd-policy-card--gold  .exd-policy-icon { background: linear-gradient(135deg, #c8700a, #f5b800); }
    .exd-policy-card--green .exd-policy-icon { background: linear-gradient(135deg, #155b30, #1aa34a); }
    .exd-policy-card--red   .exd-policy-icon { background: linear-gradient(135deg, #991b1b, #dc2626); }

    .exd-policy-title {
        font-size: 18px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 12px;
    }

    .exd-policy-text {
        font-size: 14px;
        color: #666;
        line-height: 1.8;
        margin: 0;
    }

    /* ================================================================
    SERVICES AT A GLANCE
    ================================================================ */
    .exd-services-section {
        padding: 88px 0;
        background: #ffffff;
    }

    .exd-services-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 22px;
    }

    .exd-service-item {
        background: #f8f9fd;
        border-radius: 18px;
        padding: 28px 22px;
        text-align: center;
        border: 1px solid rgba(13,27,94,0.07);
        transition: transform 0.25s, box-shadow 0.25s, background 0.25s;
    }

    .exd-service-item:hover {
        transform: translateY(-5px);
        box-shadow: 0 12px 36px rgba(13,27,94,0.12);
        background: #ffffff;
    }

    .exd-service-icon {
        width: 62px;
        height: 62px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 24px;
        margin: 0 auto 18px;
        transition: transform 0.3s ease;
    }

    .exd-service-item:hover .exd-service-icon {
        transform: scale(1.1) rotate(-5deg);
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
    }

    .exd-service-title {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 10px;
    }

    .exd-service-text {
        font-size: 13px;
        color: #777;
        line-height: 1.7;
        margin: 0;
    }

    /* ================================================================
    CONTACT THE DEPARTMENT
    ================================================================ */
    .exd-contact-section {
        padding: 88px 0;
        background: linear-gradient(160deg, #f0f3fa 0%, #e8ecf8 100%);
    }

    .exd-contact-grid {
        display: grid;
        grid-template-columns: 1fr 380px;
        gap: 44px;
        align-items: start;
    }

    .exd-contact-details {
        display: flex;
        flex-direction: column;
        gap: 24px;
    }

    .exd-contact-item {
        display: flex;
        gap: 18px;
        align-items: flex-start;
        background: #ffffff;
        border-radius: 16px;
        padding: 22px 24px;
        box-shadow: 0 3px 14px rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.07);
        transition: transform 0.2s, box-shadow 0.2s;
    }

    .exd-contact-item:hover {
        transform: translateX(4px);
        box-shadow: 0 8px 28px rgba(13,27,94,0.12);
    }

    .exd-contact-icon {
        width: 50px;
        height: 50px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 20px;
        flex-shrink: 0;
    }

    .exd-contact-icon--gold   { background: linear-gradient(135deg, #c8700a, #f5b800); color: #ffffff; }
    .exd-contact-icon--green  { background: linear-gradient(135deg, #155b30, #1aa34a); color: #ffffff; }
    .exd-contact-icon--blue   { background: linear-gradient(135deg, #1e40af, #3b82f6); color: #ffffff; }

    .exd-contact-label {
        font-size: 13px;
        font-weight: 800;
        color: #888;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin: 0 0 6px;
    }

    .exd-contact-value {
        font-size: 14.5px;
        color: #333;
        line-height: 1.75;
        margin: 0;
    }

    .exd-contact-link {
        color: #1a2f8a;
        font-weight: 600;
        text-decoration: none;
        transition: color 0.2s;
    }

    .exd-contact-link:hover { color: #c8700a; }

    /* ---- Quick Links Panel ---- */
    .exd-quick-panel {
        background: linear-gradient(160deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 22px;
        padding: 28px 26px;
        box-shadow: 0 12px 40px rgba(13,27,94,0.3);
        position: sticky;
        top: 100px;
    }

    .exd-quick-header {
        display: flex;
        align-items: center;
        gap: 12px;
        padding-bottom: 18px;
        margin-bottom: 20px;
        border-bottom: 1.5px solid rgba(255,255,255,0.12);
    }

    .exd-quick-header i {
        color: #f5b800;
        font-size: 20px;
    }

    .exd-quick-title {
        font-size: 17px;
        font-weight: 800;
        color: #ffffff;
        margin: 0;
    }

    .exd-quick-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

    .exd-quick-link {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 12px 14px;
        border-radius: 12px;
        text-decoration: none;
        transition: background 0.2s;
    }

    .exd-quick-link:hover {
        background: rgba(255,255,255,0.09);
    }

    .exd-quick-link-icon {
        width: 36px;
        height: 36px;
        background: rgba(245,184,0,0.15);
        border-radius: 9px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 14px;
        flex-shrink: 0;
    }

    .exd-quick-link-text {
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .exd-quick-link-text strong {
        font-size: 13.5px;
        color: #ffffff;
        font-weight: 700;
    }

    .exd-quick-link-text em {
        font-size: 11.5px;
        color: rgba(255,255,255,0.55);
        font-style: normal;
    }

    .exd-quick-arrow {
        color: rgba(255,255,255,0.3);
        font-size: 11px;
        transition: color 0.2s, transform 0.2s;
    }

    .exd-quick-link:hover .exd-quick-arrow {
        color: #f5b800;
        transform: translateX(3px);
    }

    /* ================================================================
    FAQ ACCORDION
    ================================================================ */
    .exd-faq-section {
        padding: 88px 0;
        background: #ffffff;
    }

    .exd-accordion {
        max-width: 800px;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    .exd-detail {
        background: #f8f9fd;
        border-radius: 14px;
        border: 1px solid rgba(13,27,94,0.09);
        overflow: hidden;
        transition: box-shadow 0.25s;
    }

    .exd-detail[open] {
        background: #ffffff;
        box-shadow: 0 6px 24px rgba(13,27,94,0.11);
    }

    .exd-summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 20px 24px;
        cursor: pointer;
        font-size: 15px;
        font-weight: 700;
        color: #0d1b5e;
        list-style: none;
        user-select: none;
        transition: background 0.2s;
    }

    .exd-summary::-webkit-details-marker { display: none; }
    .exd-summary:hover { background: rgba(13,27,94,0.03); }

    .exd-detail[open] .exd-summary {
        border-bottom: 1px solid rgba(13,27,94,0.08);
    }

    .exd-summary-icon {
        width: 30px;
        height: 30px;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 12px;
        flex-shrink: 0;
        transition: background 0.25s;
    }

    .exd-detail[open] .exd-summary-icon {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
    }

    .exd-detail-body {
        padding: 18px 24px;
    }

    .exd-detail-body p {
        font-size: 14.5px;
        color: #555;
        line-height: 1.8;
        margin: 0;
    }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .exd-cta-section {
        padding: 90px 0;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 60%, #2a4aad 100%);
        position: relative;
        overflow: hidden;
        text-align: center;
    }

    .exd-cta-overlay {
        position: absolute;
        inset: 0;
        background:
            radial-gradient(ellipse at 15% 60%, rgba(245,184,0,0.12) 0%, transparent 55%),
            radial-gradient(ellipse at 85% 20%, rgba(255,255,255,0.06) 0%, transparent 50%);
        pointer-events: none;
    }

    .exd-cta-inner {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 24px;
        position: relative;
        z-index: 1;
    }

    .exd-cta-icon-wrap {
        width: 80px;
        height: 80px;
        background: rgba(245,184,0,0.14);
        border: 2px solid rgba(245,184,0,0.35);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 32px;
    }

    .exd-cta-heading {
        font-size: clamp(26px, 4vw, 40px);
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .exd-cta-sub {
        font-size: 16px;
        color: rgba(255,255,255,0.78);
        line-height: 1.8;
        max-width: 560px;
        margin: 0;
    }

    .exd-cta-text { max-width: 640px; }

    .exd-cta-actions {
        display: flex;
        gap: 16px;
        flex-wrap: wrap;
        justify-content: center;
    }

    .exd-cta-btn {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        font-size: 14.5px;
        font-weight: 700;
        padding: 14px 32px;
        border-radius: 50px;
        text-decoration: none;
        transition: transform 0.2s, box-shadow 0.25s, background 0.25s;
    }

    .exd-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        box-shadow: 0 4px 16px rgba(245,184,0,0.45);
    }

    .exd-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 28px rgba(245,184,0,0.6);
        color: #0a1440;
    }

    .exd-cta-btn--outline {
        background: transparent;
        color: #ffffff;
        border: 2px solid rgba(255,255,255,0.45);
    }

    .exd-cta-btn--outline:hover {
        background: rgba(255,255,255,0.1);
        border-color: rgba(255,255,255,0.8);
        transform: translateY(-2px);
        color: #ffffff;
    }

    /* ================================================================
    RESPONSIVE — EXAMINATION DEPARTMENT PAGE
    ================================================================ */
    @media (max-width: 1100px) {
        .exd-team-grid     { grid-template-columns: 1fr 1fr; }
        .exd-team-card--featured { grid-column: span 2; }
        .exd-services-grid { grid-template-columns: repeat(4, 1fr); }
    }

    @media (max-width: 1024px) {
        .exd-contact-grid  { grid-template-columns: 1fr; }
        .exd-quick-panel   { position: static; }
    }

    @media (max-width: 900px) {
        .exd-about-grid    { grid-template-columns: 1fr; gap: 36px; }
        .exd-roles-grid    { grid-template-columns: repeat(2, 1fr); }
        .exd-team-grid     { grid-template-columns: 1fr 1fr; }
        .exd-team-card--featured { grid-column: span 2; }
        .exd-policy-grid   { grid-template-columns: 1fr 1fr; }
        .exd-services-grid { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 640px) {
        .exd-container     { padding: 0 18px; }
        .exd-about-section,
        .exd-roles-section,
        .exd-team-section,
        .exd-timeline-section,
        .exd-policy-section,
        .exd-services-section,
        .exd-contact-section,
        .exd-faq-section   { padding: 56px 0; }
        .exd-cta-section   { padding: 60px 0; }
        .exd-roles-grid    { grid-template-columns: 1fr; }
        .exd-team-grid     { grid-template-columns: 1fr; }
        .exd-team-card--featured { grid-column: span 1; flex-direction: column; }
        .exd-policy-grid   { grid-template-columns: 1fr; }
        .exd-services-grid { grid-template-columns: repeat(2, 1fr); }
        .exd-section-header { margin-bottom: 34px; }
        .exd-stat-divider  { display: none; }
        .exd-stats-row     { gap: 0; }
        .exd-stat-item     { min-width: 50%; border-bottom: 1px solid rgba(255,255,255,0.08); }
        .exd-timeline      { padding-left: 32px; }
        .exd-tl-marker     { width: 34px; height: 34px; left: -34px; font-size: 13px; }
        .exd-summary       { font-size: 14px; padding: 16px 18px; }
        .exd-detail-body   { padding: 14px 18px; }
        .exd-cta-btn       { width: 100%; justify-content: center; }
    }

    @media (max-width: 420px) {
        .exd-services-grid { grid-template-columns: 1fr; }
    }

    /* ================================================================
    PREVIOUS YEAR QUESTION PAPERS PAGE  (pyq-*)
    Colors: #0d1b5e navy | #f5b800 gold | #1aa34a green | bg #f4f6f9
    ================================================================ */

    /* ---- Container ---- */
    .pyq-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 28px;
    }

    .pyq-accent { color: #f5b800; }

    /* ---- Section tag ---- */
    .pyq-section-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 800;
        padding: 6px 18px;
        border-radius: 50px;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        margin-bottom: 14px;
    }

    /* ---- Shared section header ---- */
    .pyq-section-header {
        text-align: center;
        margin-bottom: 50px;
    }

    .pyq-section-heading {
        font-size: clamp(26px, 4vw, 36px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 14px;
        line-height: 1.25;
    }

    .pyq-section-sub {
        font-size: 15.5px;
        color: #555;
        max-width: 640px;
        margin: 0 auto;
        line-height: 1.8;
    }

    /* ================================================================
    STATS BAR
    ================================================================ */
    .pyq-stats-bar {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
        border-bottom: 3px solid #f5b800;
    }

    .pyq-stats-row {
        display: flex;
        align-items: stretch;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .pyq-stat-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 22px 20px;
        flex: 1;
        min-width: 130px;
        gap: 4px;
        transition: background 0.25s;
    }

    .pyq-stat-item:hover { background: rgba(245,184,0,0.09); }

    .pyq-stat-num {
        font-size: clamp(22px, 3vw, 30px);
        font-weight: 900;
        color: #f5b800;
        line-height: 1;
    }

    .pyq-stat-label {
        font-size: 12px;
        color: rgba(255,255,255,0.72);
        text-align: center;
        line-height: 1.4;
    }

    .pyq-stat-divider {
        width: 1px;
        background: rgba(255,255,255,0.12);
        align-self: stretch;
        margin: 14px 0;
    }

    /* ================================================================
    WHY PYQs SECTION
    ================================================================ */
    .pyq-why-section {
        padding: 88px 0;
        background: #f4f6f9;
    }

    .pyq-why-grid {
        display: grid;
        grid-template-columns: 1fr 380px;
        gap: 52px;
        align-items: start;
    }

    .pyq-why-heading {
        font-size: clamp(24px, 3.5vw, 34px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 18px;
        line-height: 1.25;
    }

    .pyq-why-text {
        font-size: 15px;
        color: #555;
        line-height: 1.85;
        margin-bottom: 32px;
    }

    /* ---- Benefit Items ---- */
    .pyq-benefit-list {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .pyq-benefit-item {
        display: flex;
        align-items: flex-start;
        gap: 16px;
        background: #ffffff;
        border-radius: 14px;
        padding: 18px 20px;
        box-shadow: 0 3px 14px rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.07);
        transition: transform 0.22s, box-shadow 0.22s;
    }

    .pyq-benefit-item:hover {
        transform: translateX(5px);
        box-shadow: 0 8px 28px rgba(13,27,94,0.12);
    }

    .pyq-benefit-icon {
        width: 46px;
        height: 46px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 18px;
        flex-shrink: 0;
    }

    .pyq-benefit-icon--gold   { background: linear-gradient(135deg, #c8700a, #f5b800); color: #fff; }
    .pyq-benefit-icon--green  { background: linear-gradient(135deg, #155b30, #1aa34a); color: #fff; }
    .pyq-benefit-icon--purple { background: linear-gradient(135deg, #5b21b6, #8b5cf6); color: #fff; }

    .pyq-benefit-body h3 {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 5px;
    }

    .pyq-benefit-body p {
        font-size: 13.5px;
        color: #666;
        line-height: 1.7;
        margin: 0;
    }

    /* ---- Tips Card ---- */
    .pyq-tips-card {
        background: linear-gradient(160deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 22px;
        padding: 30px 28px;
        color: #fff;
        box-shadow: 0 14px 44px rgba(13,27,94,0.3);
        position: sticky;
        top: 100px;
    }

    .pyq-tips-header {
        display: flex;
        align-items: center;
        gap: 14px;
        padding-bottom: 20px;
        margin-bottom: 24px;
        border-bottom: 1.5px solid rgba(255,255,255,0.12);
    }

    .pyq-tips-header-icon {
        width: 48px;
        height: 48px;
        background: rgba(245,184,0,0.18);
        border: 2px solid rgba(245,184,0,0.35);
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 20px;
        flex-shrink: 0;
    }

    .pyq-tips-title {
        font-size: 18px;
        font-weight: 800;
        color: #fff;
        margin: 0;
    }

    .pyq-tips-list {
        list-style: none;
        padding: 0;
        margin: 0 0 24px;
        display: flex;
        flex-direction: column;
        gap: 16px;
        counter-reset: none;
    }

    .pyq-tip-item {
        display: flex;
        align-items: flex-start;
        gap: 14px;
    }

    .pyq-tip-num {
        font-size: 11px;
        font-weight: 900;
        color: #f5b800;
        background: rgba(245,184,0,0.15);
        border: 1px solid rgba(245,184,0,0.3);
        border-radius: 6px;
        padding: 3px 8px;
        flex-shrink: 0;
        letter-spacing: 0.5px;
        margin-top: 2px;
    }

    .pyq-tip-text {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .pyq-tip-text strong {
        font-size: 13.5px;
        color: #fff;
        font-weight: 700;
    }

    .pyq-tip-text span {
        font-size: 12.5px;
        color: rgba(255,255,255,0.6);
        line-height: 1.6;
    }

    .pyq-tips-link {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 9px;
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        font-size: 14px;
        font-weight: 800;
        padding: 13px;
        border-radius: 30px;
        text-decoration: none;
        transition: transform 0.2s, box-shadow 0.25s;
        box-shadow: 0 4px 16px rgba(245,184,0,0.4);
    }

    .pyq-tips-link:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(245,184,0,0.55);
        color: #0a1440;
    }

    /* ================================================================
    QUESTION PAPERS SECTION — TABS + ACCORDION
    ================================================================ */
    .pyq-papers-section {
        padding: 88px 0;
        background: #ffffff;
    }

    /* ---- Tabs ---- */
    .pyq-tabs {
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
        margin-bottom: 36px;
        border-bottom: 2px solid rgba(13,27,94,0.1);
        padding-bottom: 0;
    }

    .pyq-tab {
        background: transparent;
        border: none;
        font-size: 14px;
        font-weight: 700;
        color: #888;
        padding: 12px 26px;
        border-radius: 8px 8px 0 0;
        cursor: pointer;
        position: relative;
        transition: color 0.2s, background 0.2s;
        letter-spacing: 0.4px;
        margin-bottom: -2px;
    }

    .pyq-tab::after {
        content: '';
        position: absolute;
        bottom: 0; left: 0; right: 0;
        height: 3px;
        background: transparent;
        border-radius: 2px 2px 0 0;
        transition: background 0.25s;
    }

    .pyq-tab:hover { color: #0d1b5e; background: rgba(13,27,94,0.05); }

    .pyq-tab--active {
        color: #0d1b5e;
        background: rgba(13,27,94,0.06);
    }

    .pyq-tab--active::after { background: #f5b800; }

    /* ---- Programme header ---- */
    .pyq-programme-header {
        display: flex;
        align-items: center;
        gap: 18px;
        margin-bottom: 28px;
        padding: 20px 24px;
        background: linear-gradient(135deg, #f0f3fa, #e8ecf8);
        border-radius: 16px;
        border-left: 5px solid #0d1b5e;
    }

    .pyq-prog-badge {
        width: 56px;
        height: 56px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 14px;
        font-weight: 900;
        color: #fff;
        letter-spacing: 0.5px;
        flex-shrink: 0;
    }

    .pyq-prog-badge--bba  { background: linear-gradient(135deg, #0d1b5e, #1a2f8a); }
    .pyq-prog-badge--bca  { background: linear-gradient(135deg, #1e40af, #3b82f6); }
    .pyq-prog-badge--bsw  { background: linear-gradient(135deg, #155b30, #1aa34a); }
    .pyq-prog-badge--pmir { background: linear-gradient(135deg, #c8700a, #f5b800); color: #0d1b5e; }
    .pyq-prog-badge--msw  { background: linear-gradient(135deg, #5b21b6, #8b5cf6); }

    .pyq-prog-title {
        font-size: 18px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 4px;
    }

    .pyq-prog-meta {
        font-size: 13px;
        color: #888;
        margin: 0;
    }

    /* ---- Semester Accordion ---- */
    .pyq-sem-block {
        margin-bottom: 12px;
        border: 1px solid rgba(13,27,94,0.1);
        border-radius: 14px;
        overflow: hidden;
    }

    .pyq-sem-toggle {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 16px 22px;
        background: #f8f9fd;
        border: none;
        cursor: pointer;
        font-size: 15px;
        font-weight: 700;
        color: #0d1b5e;
        text-align: left;
        transition: background 0.2s;
        gap: 12px;
    }

    .pyq-sem-toggle:hover { background: #eef1fb; }

    .pyq-sem-toggle[aria-expanded="true"] {
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        color: #f5b800;
        border-radius: 14px 14px 0 0;
    }

    .pyq-sem-label {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .pyq-sem-label i { font-size: 14px; }

    .pyq-sem-arrow {
        font-size: 13px;
        transition: transform 0.3s ease;
        flex-shrink: 0;
    }

    .pyq-sem-toggle[aria-expanded="true"] .pyq-sem-arrow {
        transform: rotate(180deg);
    }

    .pyq-sem-panel {
        padding: 20px;
        background: #fff;
        border-top: 1px solid rgba(13,27,94,0.08);
    }

    /* ---- Papers Grid (by year) ---- */
    .pyq-papers-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 18px;
    }

    .pyq-year-group { display: flex; flex-direction: column; gap: 10px; }

    .pyq-year-label {
        font-size: 12px;
        font-weight: 800;
        color: #0d1b5e;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        padding: 6px 12px;
        background: rgba(13,27,94,0.07);
        border-radius: 6px;
        margin: 0 0 4px;
    }

    .pyq-paper-card {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 12px 14px;
        background: #f8f9fd;
        border-radius: 10px;
        border: 1px solid rgba(13,27,94,0.08);
        transition: background 0.2s, transform 0.2s, box-shadow 0.2s;
    }

    .pyq-paper-card:hover {
        background: #fff;
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(13,27,94,0.1);
    }

    .pyq-paper-icon {
        font-size: 20px;
        color: #e84118;
        flex-shrink: 0;
    }

    .pyq-paper-info { flex: 1; min-width: 0; }

    .pyq-paper-title {
        font-size: 12.5px;
        font-weight: 700;
        color: #0d1b5e;
        margin: 0 0 3px;
        line-height: 1.4;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .pyq-paper-meta {
        font-size: 11px;
        color: #999;
        margin: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .pyq-paper-btn {
        width: 30px;
        height: 30px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 12px;
        text-decoration: none;
        flex-shrink: 0;
        transition: background 0.2s, transform 0.2s;
    }

    .pyq-paper-btn:hover {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        transform: scale(1.1);
    }

    /* ---- Tab panel visibility ---- */
    .pyq-tab-panel { display: none; }
    .pyq-tab-panel--active { display: block; }

    /* ================================================================
    EXAM PATTERN
    ================================================================ */
    .pyq-pattern-section {
        padding: 88px 0;
        background: linear-gradient(160deg, #f0f3fa 0%, #e8ecf8 100%);
    }

    .pyq-pattern-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 28px;
    }

    .pyq-pattern-card {
        background: #ffffff;
        border-radius: 20px;
        overflow: hidden;
        box-shadow: 0 4px 22px rgba(13,27,94,0.09);
        border: 1px solid rgba(13,27,94,0.08);
        transition: transform 0.25s, box-shadow 0.25s;
    }

    .pyq-pattern-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 14px 40px rgba(13,27,94,0.14);
    }

    .pyq-pattern-top {
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 24px 26px 20px;
        border-bottom: 1px solid rgba(13,27,94,0.08);
    }

    .pyq-pattern-icon {
        width: 50px;
        height: 50px;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        color: #fff;
        flex-shrink: 0;
    }

    .pyq-pattern-card--theory    .pyq-pattern-icon { background: linear-gradient(135deg, #0d1b5e, #1a2f8a); }
    .pyq-pattern-card--practical .pyq-pattern-icon { background: linear-gradient(135deg, #155b30, #1aa34a); }
    .pyq-pattern-card--project   .pyq-pattern-icon { background: linear-gradient(135deg, #c8700a, #f5b800); }

    .pyq-pattern-title {
        font-size: 17px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0;
    }

    .pyq-pattern-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
    }

    .pyq-pattern-list li {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 12px 26px;
        border-bottom: 1px solid rgba(13,27,94,0.06);
        gap: 12px;
    }

    .pyq-pattern-list li:last-child { border-bottom: none; }

    .pyq-pl-label {
        font-size: 13.5px;
        color: #666;
    }

    .pyq-pl-val {
        font-size: 13.5px;
        font-weight: 700;
        color: #0d1b5e;
        text-align: right;
    }

    /* ================================================================
    RELATED RESOURCES
    ================================================================ */
    .pyq-resources-section {
        padding: 88px 0;
        background: #ffffff;
    }

    .pyq-resources-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 22px;
    }

    .pyq-resource-card {
        display: flex;
        align-items: center;
        gap: 16px;
        padding: 22px 20px;
        background: #f8f9fd;
        border-radius: 16px;
        border: 1px solid rgba(13,27,94,0.08);
        text-decoration: none;
        transition: transform 0.25s, box-shadow 0.25s, background 0.25s;
    }

    .pyq-resource-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 32px rgba(13,27,94,0.13);
        background: #ffffff;
    }

    .pyq-resource-icon {
        width: 50px;
        height: 50px;
        border-radius: 13px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        color: #fff;
        flex-shrink: 0;
        transition: transform 0.25s;
    }

    .pyq-resource-card:hover .pyq-resource-icon { transform: scale(1.1) rotate(-5deg); }

    .pyq-resource-icon--blue   { background: linear-gradient(135deg, #0d1b5e, #1a2f8a); }
    .pyq-resource-icon--gold   { background: linear-gradient(135deg, #c8700a, #f5b800); }
    .pyq-resource-icon--green  { background: linear-gradient(135deg, #155b30, #1aa34a); }
    .pyq-resource-icon--red    { background: linear-gradient(135deg, #991b1b, #e84118); }
    .pyq-resource-icon--purple { background: linear-gradient(135deg, #5b21b6, #8b5cf6); }
    .pyq-resource-icon--teal   { background: linear-gradient(135deg, #0e7490, #06b6d4); }

    .pyq-resource-body { flex: 1; min-width: 0; }

    .pyq-resource-title {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 5px;
    }

    .pyq-resource-text {
        font-size: 13px;
        color: #777;
        line-height: 1.6;
        margin: 0;
    }

    .pyq-resource-arrow {
        color: rgba(13,27,94,0.25);
        font-size: 14px;
        transition: color 0.2s, transform 0.2s;
        flex-shrink: 0;
    }

    .pyq-resource-card:hover .pyq-resource-arrow {
        color: #f5b800;
        transform: translateX(3px);
    }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .pyq-cta-section {
        padding: 90px 0;
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 60%, #2a4aad 100%);
        position: relative;
        overflow: hidden;
        text-align: center;
    }

    .pyq-cta-overlay {
        position: absolute;
        inset: 0;
        background:
            radial-gradient(ellipse at 20% 60%, rgba(245,184,0,0.12) 0%, transparent 55%),
            radial-gradient(ellipse at 80% 20%, rgba(255,255,255,0.06) 0%, transparent 50%);
        pointer-events: none;
    }

    .pyq-cta-inner {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 24px;
        position: relative;
        z-index: 1;
    }

    .pyq-cta-icon {
        width: 80px;
        height: 80px;
        background: rgba(245,184,0,0.14);
        border: 2px solid rgba(245,184,0,0.35);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 32px;
    }

    .pyq-cta-heading {
        font-size: clamp(26px, 4vw, 40px);
        font-weight: 900;
        color: #fff;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .pyq-cta-sub {
        font-size: 16px;
        color: rgba(255,255,255,0.78);
        line-height: 1.8;
        max-width: 560px;
        margin: 0;
    }

    .pyq-cta-text { max-width: 640px; }

    .pyq-cta-actions {
        display: flex;
        gap: 16px;
        flex-wrap: wrap;
        justify-content: center;
    }

    .pyq-cta-btn {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        font-size: 14.5px;
        font-weight: 700;
        padding: 14px 32px;
        border-radius: 50px;
        text-decoration: none;
        transition: transform 0.2s, box-shadow 0.25s, background 0.25s;
    }

    .pyq-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800 0%, #e07b00 100%);
        color: #0d1b5e;
        box-shadow: 0 4px 16px rgba(245,184,0,0.45);
    }

    .pyq-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 28px rgba(245,184,0,0.6);
        color: #0a1440;
    }

    .pyq-cta-btn--outline {
        background: transparent;
        color: #fff;
        border: 2px solid rgba(255,255,255,0.45);
    }

    .pyq-cta-btn--outline:hover {
        background: rgba(255,255,255,0.1);
        border-color: rgba(255,255,255,0.8);
        transform: translateY(-2px);
        color: #fff;
    }

    /* ================================================================
    RESPONSIVE — PREVIOUS YEAR QUESTION PAPERS PAGE
    ================================================================ */
    @media (max-width: 1100px) {
        .pyq-papers-grid    { grid-template-columns: repeat(2, 1fr); }
        .pyq-resources-grid { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 1024px) {
        .pyq-why-grid    { grid-template-columns: 1fr; gap: 36px; }
        .pyq-tips-card   { position: static; }
        .pyq-pattern-grid { grid-template-columns: 1fr 1fr; }
    }

    @media (max-width: 900px) {
        .pyq-pattern-grid { grid-template-columns: 1fr; }
        .pyq-papers-grid  { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 640px) {
        .pyq-container      { padding: 0 18px; }
        .pyq-why-section,
        .pyq-papers-section,
        .pyq-pattern-section,
        .pyq-resources-section { padding: 56px 0; }
        .pyq-cta-section    { padding: 60px 0; }
        .pyq-section-header { margin-bottom: 32px; }
        .pyq-stat-divider   { display: none; }
        .pyq-stat-item      { min-width: 50%; border-bottom: 1px solid rgba(255,255,255,0.08); }
        .pyq-papers-grid    { grid-template-columns: 1fr; }
        .pyq-resources-grid { grid-template-columns: 1fr; }
        .pyq-tabs           { gap: 6px; }
        .pyq-tab            { padding: 10px 16px; font-size: 13px; }
        .pyq-cta-btn        { width: 100%; justify-content: center; }
        .pyq-programme-header { flex-direction: column; align-items: flex-start; gap: 12px; }
    }

    /* ================================================================
    MCQ PAGE  (mcq-*)
    Colors: #0d1b5e navy | #f5b800 gold | #1aa34a green | bg #f4f6f9
    ================================================================ */

    .mcq-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 28px;
    }
    .mcq-accent { color: #f5b800; }

    .mcq-section-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 800;
        padding: 6px 18px;
        border-radius: 50px;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        margin-bottom: 14px;
    }

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

    .mcq-section-heading {
        font-size: clamp(26px,4vw,36px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 14px;
        line-height: 1.25;
    }

    .mcq-section-sub {
        font-size: 15.5px;
        color: #555;
        max-width: 640px;
        margin: 0 auto;
        line-height: 1.8;
    }

    /* ================================================================
    STATS BAR
    ================================================================ */
    .mcq-stats-bar {
        background: linear-gradient(135deg,#0d1b5e 0%,#1a2f8a 100%);
        border-bottom: 3px solid #f5b800;
    }
    .mcq-stats-row {
        display: flex;
        align-items: stretch;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .mcq-stat-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 22px 20px;
        flex: 1;
        min-width: 130px;
        gap: 4px;
        transition: background 0.25s;
    }
    .mcq-stat-item:hover { background: rgba(245,184,0,0.09); }
    .mcq-stat-num {
        font-size: clamp(22px,3vw,30px);
        font-weight: 900;
        color: #f5b800;
        line-height: 1;
    }
    .mcq-stat-label { font-size: 12px; color: rgba(255,255,255,0.72); text-align: center; line-height: 1.4; }
    .mcq-stat-divider { width: 1px; background: rgba(255,255,255,0.12); align-self: stretch; margin: 14px 0; }

    /* ================================================================
    ABOUT MCQ
    ================================================================ */
    .mcq-about-section { padding: 88px 0; background: #f4f6f9; }

    .mcq-about-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 52px;
        align-items: start;
    }

    .mcq-about-heading {
        font-size: clamp(24px,3.5vw,34px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 18px;
        line-height: 1.25;
    }

    .mcq-about-text { font-size: 15px; color: #555; line-height: 1.85; margin-bottom: 16px; }

    .mcq-about-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }

    .mcq-chip {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: #fff;
        border: 1.5px solid rgba(13,27,94,0.15);
        color: #0d1b5e;
        font-size: 12.5px;
        font-weight: 700;
        padding: 7px 16px;
        border-radius: 50px;
        box-shadow: 0 2px 8px rgba(13,27,94,0.07);
        transition: background 0.2s, color 0.2s;
    }
    .mcq-chip:hover { background: #0d1b5e; color: #f5b800; }

    /* Feature Cards */
    .mcq-about-cards { display: flex; flex-direction: column; gap: 18px; }

    .mcq-feature-card {
        display: flex;
        align-items: flex-start;
        gap: 18px;
        padding: 22px 24px;
        border-radius: 18px;
        transition: transform 0.22s, box-shadow 0.22s;
    }
    .mcq-feature-card:hover { transform: translateX(6px); box-shadow: 0 10px 30px rgba(0,0,0,0.12); }
    .mcq-feature-card { background: linear-gradient(135deg,#0d1b5e 0%,#1a2f8a 100%); }
    .mcq-feature-card--gold { background: linear-gradient(135deg,#c8700a 0%,#f5b800 100%); }
    .mcq-feature-card--green { background: linear-gradient(135deg,#155b30 0%,#1aa34a 100%); }

    .mcq-feature-icon {
        width: 50px; height: 50px;
        background: rgba(255,255,255,0.15);
        border-radius: 12px;
        display: flex; align-items: center; justify-content: center;
        color: #fff; font-size: 22px; flex-shrink: 0;
    }
    .mcq-feature-body h3 { font-size: 16px; font-weight: 800; color: #fff; margin: 0 0 6px; }
    .mcq-feature-body p  { font-size: 13.5px; color: rgba(255,255,255,0.82); line-height: 1.65; margin: 0; }

    /* ================================================================
    HOW TO USE — STEPS
    ================================================================ */
    .mcq-howto-section { padding: 88px 0; background: #fff; }

    .mcq-steps-row {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        gap: 0;
        flex-wrap: nowrap;
    }

    .mcq-step {
        flex: 1;
        text-align: center;
        padding: 32px 20px;
        background: #f8f9fd;
        border-radius: 20px;
        border: 1px solid rgba(13,27,94,0.08);
        position: relative;
        transition: transform 0.25s, box-shadow 0.25s;
        max-width: 240px;
    }
    .mcq-step:hover { transform: translateY(-5px); box-shadow: 0 14px 38px rgba(13,27,94,0.13); }

    .mcq-step-num {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 36px; height: 36px;
        background: linear-gradient(135deg,#f5b800,#e07b00);
        color: #0d1b5e;
        font-size: 13px;
        font-weight: 900;
        border-radius: 50%;
        margin-bottom: 14px;
    }

    .mcq-step-icon {
        width: 58px; height: 58px;
        background: linear-gradient(135deg,#0d1b5e,#1a2f8a);
        border-radius: 16px;
        display: flex; align-items: center; justify-content: center;
        color: #f5b800; font-size: 24px;
        margin: 0 auto 16px;
    }

    .mcq-step-title { font-size: 15px; font-weight: 800; color: #0d1b5e; margin: 0 0 10px; }
    .mcq-step-text  { font-size: 13px; color: #666; line-height: 1.7; margin: 0; }

    .mcq-step-connector {
        display: flex;
        align-items: center;
        justify-content: center;
        color: rgba(13,27,94,0.25);
        font-size: 20px;
        padding: 0 8px;
        margin-top: 60px;
        flex-shrink: 0;
    }

    /* ================================================================
    MCQ BANK — TABS + ACCORDION
    ================================================================ */
    .mcq-bank-section { padding: 88px 0; background: #f4f6f9; }

    /* ---- Tabs ---- */
    .mcq-tabs {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
        margin-bottom: 32px;
    }

    .mcq-tab {
        background: #fff;
        border: 2px solid rgba(13,27,94,0.12);
        border-radius: 12px;
        padding: 10px 18px;
        cursor: pointer;
        transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
    }
    .mcq-tab:hover { border-color: #0d1b5e; transform: translateY(-2px); box-shadow: 0 6px 18px rgba(13,27,94,0.12); }
    .mcq-tab--active { border-color: #f5b800; box-shadow: 0 4px 16px rgba(245,184,0,0.3); }

    .mcq-tab-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 54px; height: 30px;
        border-radius: 8px;
        font-size: 13px;
        font-weight: 900;
        color: #fff;
        letter-spacing: 0.5px;
    }
    .mcq-tab-badge--bba  { background: linear-gradient(135deg,#0d1b5e,#1a2f8a); }
    .mcq-tab-badge--bca  { background: linear-gradient(135deg,#1e40af,#3b82f6); }
    .mcq-tab-badge--bsw  { background: linear-gradient(135deg,#155b30,#1aa34a); }
    .mcq-tab-badge--pmir { background: linear-gradient(135deg,#c8700a,#f5b800); color: #0d1b5e; }
    .mcq-tab-badge--msw  { background: linear-gradient(135deg,#5b21b6,#8b5cf6); }

    /* ---- Programme header ---- */
    .mcq-prog-header {
        display: flex;
        align-items: center;
        gap: 18px;
        flex-wrap: wrap;
        padding: 20px 24px;
        background: #fff;
        border-radius: 16px;
        border-left: 5px solid #0d1b5e;
        box-shadow: 0 3px 14px rgba(13,27,94,0.07);
        margin-bottom: 22px;
    }

    .mcq-prog-badge {
        width: 56px; height: 56px;
        border-radius: 14px;
        display: flex; align-items: center; justify-content: center;
        font-size: 13px; font-weight: 900; color: #fff; flex-shrink: 0;
    }
    .mcq-prog-badge--bba  { background: linear-gradient(135deg,#0d1b5e,#1a2f8a); }
    .mcq-prog-badge--bca  { background: linear-gradient(135deg,#1e40af,#3b82f6); }
    .mcq-prog-badge--bsw  { background: linear-gradient(135deg,#155b30,#1aa34a); }
    .mcq-prog-badge--pmir { background: linear-gradient(135deg,#c8700a,#f5b800); color: #0d1b5e; }
    .mcq-prog-badge--msw  { background: linear-gradient(135deg,#5b21b6,#8b5cf6); }

    .mcq-prog-meta-wrap { flex: 1; min-width: 0; }
    .mcq-prog-title { font-size: 18px; font-weight: 800; color: #0d1b5e; margin: 0 0 4px; }
    .mcq-prog-meta  { font-size: 13px; color: #888; margin: 0; }

    .mcq-prog-legend {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
        margin-left: auto;
    }

    .mcq-diff-badge {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        font-size: 11.5px;
        font-weight: 700;
        padding: 4px 12px;
        border-radius: 50px;
    }
    .mcq-diff--easy   { background: rgba(26,163,74,0.12);  color: #1aa34a; border: 1.5px solid rgba(26,163,74,0.3); }
    .mcq-diff--medium { background: rgba(245,184,0,0.12);  color: #c8700a; border: 1.5px solid rgba(245,184,0,0.3); }
    .mcq-diff--hard   { background: rgba(220,38,38,0.1);   color: #dc2626; border: 1.5px solid rgba(220,38,38,0.25); }

    /* ---- Semester Accordion ---- */
    .mcq-sem-block { margin-bottom: 10px; border: 1px solid rgba(13,27,94,0.1); border-radius: 14px; overflow: hidden; }

    .mcq-sem-toggle {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 15px 22px;
        background: #fff;
        border: none;
        cursor: pointer;
        gap: 12px;
        transition: background 0.2s;
    }
    .mcq-sem-toggle:hover { background: #f0f3fa; }
    .mcq-sem-toggle[aria-expanded="true"] {
        background: linear-gradient(135deg,#0d1b5e,#1a2f8a);
        border-radius: 14px 14px 0 0;
    }

    .mcq-sem-label-wrap { display: flex; align-items: center; gap: 14px; }

    .mcq-sem-num {
        width: 28px; height: 28px;
        background: rgba(13,27,94,0.1);
        border-radius: 8px;
        display: flex; align-items: center; justify-content: center;
        font-size: 12px; font-weight: 900; color: #0d1b5e; flex-shrink: 0;
    }
    .mcq-sem-toggle[aria-expanded="true"] .mcq-sem-num { background: rgba(245,184,0,0.2); color: #f5b800; }

    .mcq-sem-name {
        display: flex; align-items: center; gap: 8px;
        font-size: 15px; font-weight: 700; color: #0d1b5e;
    }
    .mcq-sem-toggle[aria-expanded="true"] .mcq-sem-name { color: #f5b800; }

    .mcq-sem-info { display: flex; align-items: center; gap: 12px; }

    .mcq-sem-count {
        font-size: 12px; font-weight: 700;
        color: #888; background: rgba(13,27,94,0.07);
        padding: 3px 10px; border-radius: 50px;
    }
    .mcq-sem-toggle[aria-expanded="true"] .mcq-sem-count { background: rgba(245,184,0,0.15); color: #f5b800; }

    .mcq-sem-arrow {
        font-size: 13px; color: #888;
        transition: transform 0.3s ease;
        flex-shrink: 0;
    }
    .mcq-sem-toggle[aria-expanded="true"] .mcq-sem-arrow { color: rgba(255,255,255,0.6); }

    .mcq-sem-panel { padding: 20px; background: #fafbfe; border-top: 1px solid rgba(13,27,94,0.07); }

    /* ---- Subject Cards Grid ---- */
    .mcq-subjects-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 16px;
    }

    .mcq-subject-card {
        background: #fff;
        border-radius: 14px;
        padding: 18px 18px 14px;
        border: 1px solid rgba(13,27,94,0.08);
        box-shadow: 0 2px 10px rgba(13,27,94,0.05);
        transition: transform 0.2s, box-shadow 0.2s;
        display: flex;
        flex-direction: column;
        gap: 14px;
    }
    .mcq-subject-card:hover { transform: translateY(-3px); box-shadow: 0 8px 26px rgba(13,27,94,0.12); }

    .mcq-subject-top { display: flex; align-items: flex-start; gap: 12px; }

    .mcq-subject-icon {
        width: 40px; height: 40px;
        background: linear-gradient(135deg,#0d1b5e,#1a2f8a);
        border-radius: 10px;
        display: flex; align-items: center; justify-content: center;
        color: #f5b800; font-size: 16px; flex-shrink: 0;
    }

    .mcq-subject-name { font-size: 13.5px; font-weight: 700; color: #0d1b5e; margin: 0 0 4px; line-height: 1.35; }
    .mcq-subject-meta { font-size: 11.5px; color: #999; margin: 0; }

    .mcq-subject-actions { display: flex; gap: 6px; flex-wrap: wrap; }

    .mcq-action-btn {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        font-size: 11.5px;
        font-weight: 700;
        padding: 5px 11px;
        border-radius: 50px;
        text-decoration: none;
        transition: transform 0.2s, box-shadow 0.2s;
        flex: 1;
        justify-content: center;
        white-space: nowrap;
    }
    .mcq-action-btn--easy   { background: rgba(26,163,74,0.12);  color: #1aa34a; border: 1.5px solid rgba(26,163,74,0.25); }
    .mcq-action-btn--medium { background: rgba(245,184,0,0.12);  color: #c8700a; border: 1.5px solid rgba(245,184,0,0.3); }
    .mcq-action-btn--hard   { background: rgba(220,38,38,0.1);   color: #dc2626; border: 1.5px solid rgba(220,38,38,0.2); }
    .mcq-action-btn:hover   { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }

    .mcq-download-all {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        background: linear-gradient(135deg,#0d1b5e,#1a2f8a);
        color: #f5b800;
        font-size: 12px;
        font-weight: 700;
        padding: 9px;
        border-radius: 10px;
        text-decoration: none;
        transition: background 0.2s, transform 0.2s;
    }
    .mcq-download-all:hover { background: linear-gradient(135deg,#f5b800,#e07b00); color: #0d1b5e; transform: translateY(-1px); }

    .mcq-tab-panel { display: none; }
    .mcq-tab-panel--active { display: block; }

    /* ================================================================
    SAMPLE MCQ QUIZ
    ================================================================ */
    .mcq-sample-section { padding: 88px 0; background: #fff; }

    .mcq-quiz-wrap {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
        margin-bottom: 28px;
    }

    .mcq-q-card {
        background: #f8f9fd;
        border-radius: 18px;
        padding: 26px 24px;
        border: 1px solid rgba(13,27,94,0.09);
        transition: box-shadow 0.2s;
    }
    .mcq-q-card:hover { box-shadow: 0 8px 28px rgba(13,27,94,0.1); }

    .mcq-q-header {
        display: flex;
        align-items: center;
        gap: 12px;
        margin-bottom: 14px;
    }

    .mcq-q-num {
        width: 36px; height: 36px;
        background: linear-gradient(135deg,#0d1b5e,#1a2f8a);
        border-radius: 10px;
        display: flex; align-items: center; justify-content: center;
        color: #f5b800; font-size: 13px; font-weight: 900; flex-shrink: 0;
    }

    .mcq-q-tag { font-size: 11.5px; font-weight: 700; color: #888; }

    .mcq-q-text { font-size: 15px; font-weight: 700; color: #0d1b5e; margin: 0 0 18px; line-height: 1.6; }

    .mcq-options { display: flex; flex-direction: column; gap: 10px; }

    .mcq-option {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 12px 16px;
        background: #fff;
        border: 2px solid rgba(13,27,94,0.1);
        border-radius: 10px;
        cursor: pointer;
        font-size: 14px;
        color: #333;
        text-align: left;
        transition: border-color 0.2s, background 0.2s, transform 0.15s;
        width: 100%;
    }
    .mcq-option:hover:not(:disabled) { border-color: #0d1b5e; background: #eef1fb; transform: translateX(3px); }
    .mcq-option:disabled { cursor: default; }

    .mcq-opt-key {
        width: 28px; height: 28px;
        background: rgba(13,27,94,0.08);
        border-radius: 8px;
        display: flex; align-items: center; justify-content: center;
        font-size: 12px; font-weight: 900; color: #0d1b5e; flex-shrink: 0;
    }

    .mcq-option--correct { border-color: #1aa34a; background: rgba(26,163,74,0.07); }
    .mcq-option--correct .mcq-opt-key { background: #1aa34a; color: #fff; }
    .mcq-option--wrong   { border-color: #dc2626; background: rgba(220,38,38,0.07); }
    .mcq-option--wrong .mcq-opt-key   { background: #dc2626; color: #fff; }

    .mcq-q-result { margin-top: 14px; }
    .mcq-q-explanation {
        display: flex;
        gap: 10px;
        padding: 14px 16px;
        background: rgba(13,27,94,0.05);
        border-left: 4px solid #f5b800;
        border-radius: 8px;
        font-size: 13.5px;
        color: #444;
        line-height: 1.7;
    }
    .mcq-q-explanation i { color: #f5b800; flex-shrink: 0; margin-top: 2px; }

    .mcq-quiz-controls { text-align: center; }

    .mcq-reset-btn {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        background: rgba(13,27,94,0.07);
        border: 2px solid rgba(13,27,94,0.15);
        color: #0d1b5e;
        font-size: 14px;
        font-weight: 700;
        padding: 12px 28px;
        border-radius: 50px;
        cursor: pointer;
        transition: background 0.2s, border-color 0.2s, transform 0.2s;
    }
    .mcq-reset-btn:hover { background: #0d1b5e; color: #f5b800; border-color: #0d1b5e; transform: translateY(-2px); }

    /* ================================================================
    TIPS GRID
    ================================================================ */
    .mcq-tips-section { padding: 88px 0; background: linear-gradient(160deg,#f0f3fa 0%,#e8ecf8 100%); }

    .mcq-tips-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

    .mcq-tip-card {
        background: #fff;
        border-radius: 18px;
        padding: 30px 26px;
        border: 1px solid rgba(13,27,94,0.07);
        transition: transform 0.25s, box-shadow 0.25s;
    }
    .mcq-tip-card:hover { transform: translateY(-5px); box-shadow: 0 14px 38px rgba(13,27,94,0.12); }

    .mcq-tip-icon {
        width: 58px; height: 58px;
        background: linear-gradient(135deg,#0d1b5e,#1a2f8a);
        border-radius: 14px;
        display: flex; align-items: center; justify-content: center;
        color: #f5b800; font-size: 22px;
        margin-bottom: 18px;
        transition: transform 0.3s;
    }
    .mcq-tip-card:hover .mcq-tip-icon { transform: scale(1.1) rotate(-5deg); }

    .mcq-tip-icon--gold   { background: linear-gradient(135deg,#c8700a,#f5b800); color: #fff; }
    .mcq-tip-icon--green  { background: linear-gradient(135deg,#155b30,#1aa34a); color: #fff; }
    .mcq-tip-icon--purple { background: linear-gradient(135deg,#5b21b6,#8b5cf6); color: #fff; }
    .mcq-tip-icon--red    { background: linear-gradient(135deg,#991b1b,#e84118); color: #fff; }
    .mcq-tip-icon--teal   { background: linear-gradient(135deg,#0e7490,#06b6d4); color: #fff; }

    .mcq-tip-title { font-size: 17px; font-weight: 800; color: #0d1b5e; margin: 0 0 10px; }
    .mcq-tip-text  { font-size: 14px; color: #666; line-height: 1.75; margin: 0; }

    /* ================================================================
    RELATED RESOURCES
    ================================================================ */
    .mcq-resources-section { padding: 88px 0; background: #fff; }

    .mcq-res-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
    }

    .mcq-res-card {
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 20px 18px;
        background: #f8f9fd;
        border-radius: 16px;
        border: 1px solid rgba(13,27,94,0.08);
        text-decoration: none;
        transition: transform 0.22s, box-shadow 0.22s, background 0.22s;
    }
    .mcq-res-card:hover { transform: translateY(-3px); box-shadow: 0 10px 30px rgba(13,27,94,0.12); background: #fff; }

    .mcq-res-icon {
        width: 48px; height: 48px;
        border-radius: 12px;
        display: flex; align-items: center; justify-content: center;
        font-size: 20px; color: #fff; flex-shrink: 0;
        transition: transform 0.25s;
    }
    .mcq-res-card:hover .mcq-res-icon { transform: scale(1.1) rotate(-5deg); }

    .mcq-res-icon--navy { background: linear-gradient(135deg,#0d1b5e,#1a2f8a); }
    .mcq-res-icon--blue { background: linear-gradient(135deg,#1e40af,#3b82f6); }
    .mcq-res-icon--green{ background: linear-gradient(135deg,#155b30,#1aa34a); }
    .mcq-res-icon--gold { background: linear-gradient(135deg,#c8700a,#f5b800); }

    .mcq-res-body { flex: 1; min-width: 0; }
    .mcq-res-body h3 { font-size: 14px; font-weight: 800; color: #0d1b5e; margin: 0 0 4px; }
    .mcq-res-body p  { font-size: 12.5px; color: #777; line-height: 1.6; margin: 0; }

    .mcq-res-arrow { color: rgba(13,27,94,0.2); font-size: 13px; flex-shrink: 0; transition: color 0.2s, transform 0.2s; }
    .mcq-res-card:hover .mcq-res-arrow { color: #f5b800; transform: translateX(3px); }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .mcq-cta-section {
        padding: 90px 0;
        background: linear-gradient(135deg,#0d1b5e 0%,#1a2f8a 60%,#2a4aad 100%);
        position: relative; overflow: hidden; text-align: center;
    }
    .mcq-cta-overlay {
        position: absolute; inset: 0;
        background: radial-gradient(ellipse at 20% 60%,rgba(245,184,0,0.12) 0%,transparent 55%),
                    radial-gradient(ellipse at 80% 20%,rgba(255,255,255,0.06) 0%,transparent 50%);
        pointer-events: none;
    }
    .mcq-cta-inner { display: flex; flex-direction: column; align-items: center; gap: 24px; position: relative; z-index: 1; }
    .mcq-cta-icon {
        width: 80px; height: 80px;
        background: rgba(245,184,0,0.14);
        border: 2px solid rgba(245,184,0,0.35);
        border-radius: 50%;
        display: flex; align-items: center; justify-content: center;
        color: #f5b800; font-size: 32px;
    }
    .mcq-cta-text { max-width: 640px; }
    .mcq-cta-heading { font-size: clamp(26px,4vw,40px); font-weight: 900; color: #fff; margin: 0 0 12px; line-height: 1.2; }
    .mcq-cta-sub { font-size: 16px; color: rgba(255,255,255,0.78); line-height: 1.8; max-width: 560px; margin: 0; }
    .mcq-cta-actions { display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; }

    .mcq-cta-btn {
        display: inline-flex; align-items: center; gap: 9px;
        font-size: 14.5px; font-weight: 700; padding: 14px 32px;
        border-radius: 50px; text-decoration: none;
        transition: transform 0.2s, box-shadow 0.25s, background 0.25s;
    }
    .mcq-cta-btn--primary { background: linear-gradient(135deg,#f5b800 0%,#e07b00 100%); color: #0d1b5e; box-shadow: 0 4px 16px rgba(245,184,0,0.45); }
    .mcq-cta-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(245,184,0,0.6); color: #0a1440; }
    .mcq-cta-btn--outline { background: transparent; color: #fff; border: 2px solid rgba(255,255,255,0.45); }
    .mcq-cta-btn--outline:hover { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.8); transform: translateY(-2px); color: #fff; }

    /* ================================================================
    RESPONSIVE — MCQ PAGE
    ================================================================ */
    @media (max-width: 1100px) {
        .mcq-res-grid       { grid-template-columns: repeat(2,1fr); }
        .mcq-subjects-grid  { grid-template-columns: repeat(2,1fr); }
    }
    @media (max-width: 1024px) {
        .mcq-about-grid     { grid-template-columns: 1fr; gap: 36px; }
        .mcq-quiz-wrap      { grid-template-columns: 1fr; }
    }
    @media (max-width: 900px) {
        .mcq-steps-row      { flex-wrap: wrap; justify-content: center; gap: 16px; }
        .mcq-step           { max-width: 100%; flex: 0 0 calc(50% - 8px); }
        .mcq-step-connector { display: none; }
        .mcq-tips-grid      { grid-template-columns: repeat(2,1fr); }
        .mcq-subjects-grid  { grid-template-columns: repeat(2,1fr); }
    }
    @media (max-width: 640px) {
        .mcq-container      { padding: 0 18px; }
        .mcq-about-section, .mcq-howto-section, .mcq-bank-section,
        .mcq-sample-section, .mcq-tips-section,
        .mcq-resources-section { padding: 56px 0; }
        .mcq-cta-section    { padding: 60px 0; }
        .mcq-section-header { margin-bottom: 32px; }
        .mcq-stat-divider   { display: none; }
        .mcq-stat-item      { min-width: 50%; border-bottom: 1px solid rgba(255,255,255,0.08); }
        .mcq-steps-row      { flex-direction: column; align-items: center; }
        .mcq-step           { max-width: 100%; flex: 1; width: 100%; }
        .mcq-tips-grid      { grid-template-columns: 1fr; }
        .mcq-subjects-grid  { grid-template-columns: 1fr; }
        .mcq-res-grid       { grid-template-columns: 1fr; }
        .mcq-cta-btn        { width: 100%; justify-content: center; }
        .mcq-prog-header    { flex-direction: column; align-items: flex-start; gap: 12px; }
        .mcq-prog-legend    { margin-left: 0; }
        .mcq-q-card         { padding: 20px 18px; }
    }

    /* ================================================================
    PRACTICAL EXAMINATION PAGE  (prc-*)
    Colors: #0d1b5e navy | #f5b800 gold | #1aa34a green | bg #f4f6f9
    ================================================================ */

    .prc-container { max-width: 1200px; margin: 0 auto; padding: 0 28px; }
    .prc-accent    { color: #f5b800; }

    .prc-section-tag {
        display: inline-flex; align-items: center; gap: 8px;
        background: rgba(13,27,94,0.07); border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e; font-size: 12px; font-weight: 800;
        padding: 6px 18px; border-radius: 50px;
        letter-spacing: 0.6px; text-transform: uppercase; margin-bottom: 14px;
    }

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

    .prc-section-heading {
        font-size: clamp(26px,4vw,36px); font-weight: 900;
        color: #0d1b5e; margin: 0 0 14px; line-height: 1.25;
    }

    .prc-section-sub {
        font-size: 15.5px; color: #555; max-width: 640px;
        margin: 0 auto; line-height: 1.8;
    }

    /* ================================================================
    STATS BAR
    ================================================================ */
    .prc-stats-bar { background: linear-gradient(135deg,#0d1b5e 0%,#1a2f8a 100%); border-bottom: 3px solid #f5b800; }
    .prc-stats-row { display: flex; align-items: stretch; justify-content: space-between; flex-wrap: wrap; }
    .prc-stat-item {
        display: flex; flex-direction: column; align-items: center; justify-content: center;
        padding: 22px 20px; flex: 1; min-width: 130px; gap: 4px; transition: background 0.25s;
    }
    .prc-stat-item:hover { background: rgba(245,184,0,0.09); }
    .prc-stat-num   { font-size: clamp(20px,2.5vw,28px); font-weight: 900; color: #f5b800; line-height: 1; }
    .prc-stat-label { font-size: 12px; color: rgba(255,255,255,0.72); text-align: center; line-height: 1.4; }
    .prc-stat-divider { width: 1px; background: rgba(255,255,255,0.12); align-self: stretch; margin: 14px 0; }

    /* ================================================================
    ABOUT
    ================================================================ */
    .prc-about-section { padding: 88px 0; background: #f4f6f9; }

    .prc-about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 52px; align-items: start; }

    .prc-about-heading {
        font-size: clamp(24px,3.5vw,34px); font-weight: 900;
        color: #0d1b5e; margin: 0 0 18px; line-height: 1.25;
    }
    .prc-about-text { font-size: 15px; color: #555; line-height: 1.85; margin-bottom: 16px; }

    .prc-about-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
    .prc-chip {
        display: inline-flex; align-items: center; gap: 7px;
        background: #fff; border: 1.5px solid rgba(13,27,94,0.15);
        color: #0d1b5e; font-size: 12.5px; font-weight: 700;
        padding: 7px 16px; border-radius: 50px;
        box-shadow: 0 2px 8px rgba(13,27,94,0.07);
        transition: background 0.2s, color 0.2s;
    }
    .prc-chip:hover { background: #0d1b5e; color: #f5b800; }

    /* Highlight cards */
    .prc-about-visual { display: flex; flex-direction: column; gap: 18px; }
    .prc-highlight-card {
        display: flex; align-items: flex-start; gap: 18px;
        padding: 24px 26px; border-radius: 18px;
        transition: transform 0.22s, box-shadow 0.22s;
    }
    .prc-highlight-card:hover { transform: translateX(6px); box-shadow: 0 10px 30px rgba(0,0,0,0.12); }
    .prc-highlight-card--navy  { background: linear-gradient(135deg,#0d1b5e,#1a2f8a); }
    .prc-highlight-card--gold  { background: linear-gradient(135deg,#c8700a,#f5b800); }
    .prc-highlight-card--green { background: linear-gradient(135deg,#155b30,#1aa34a); }

    .prc-hl-icon {
        width: 50px; height: 50px; background: rgba(255,255,255,0.15);
        border-radius: 12px; display: flex; align-items: center; justify-content: center;
        color: #fff; font-size: 22px; flex-shrink: 0;
    }
    .prc-hl-body h3 { font-size: 16px; font-weight: 800; color: #fff; margin: 0 0 6px; }
    .prc-hl-body p  { font-size: 13.5px; color: rgba(255,255,255,0.82); line-height: 1.65; margin: 0; }

    /* ================================================================
    EVALUATION PATTERN
    ================================================================ */
    .prc-eval-section { padding: 88px 0; background: #fff; }

    .prc-eval-grid { display: grid; grid-template-columns: 420px 1fr; gap: 44px; align-items: start; }

    /* Marks Card */
    .prc-marks-card {
        background: linear-gradient(160deg,#0d1b5e 0%,#1a2f8a 100%);
        border-radius: 22px; padding: 30px 28px;
        box-shadow: 0 12px 40px rgba(13,27,94,0.3); position: sticky; top: 100px;
    }
    .prc-marks-header {
        display: flex; align-items: center; gap: 12px;
        padding-bottom: 18px; margin-bottom: 24px;
        border-bottom: 1.5px solid rgba(255,255,255,0.12);
    }
    .prc-marks-header i { font-size: 24px; color: #f5b800; }
    .prc-marks-header h3 { font-size: 17px; font-weight: 800; color: #fff; margin: 0; }

    .prc-marks-list { list-style: none; padding: 0; margin: 0 0 22px; display: flex; flex-direction: column; gap: 16px; }

    .prc-marks-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
    .prc-marks-left { display: flex; align-items: center; gap: 10px; }

    .prc-marks-dot {
        width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0;
    }
    .prc-marks-dot--navy  { background: #a5b4fc; }
    .prc-marks-dot--gold  { background: #f5b800; }
    .prc-marks-dot--green { background: #4ade80; }
    .prc-marks-dot--total { background: #fff; }

    .prc-marks-label { font-size: 13px; color: rgba(255,255,255,0.82); }
    .prc-marks-right { display: flex; align-items: center; gap: 10px; }

    .prc-marks-bar-wrap {
        width: 100px; height: 6px; background: rgba(255,255,255,0.12);
        border-radius: 6px; overflow: hidden;
    }
    .prc-marks-bar {
        height: 100%; width: var(--prc-bar-w,0%);
        background: #a5b4fc; border-radius: 6px;
        transition: width 1.2s ease;
    }
    .prc-marks-bar--gold  { background: #f5b800; }
    .prc-marks-bar--green { background: #4ade80; }
    .prc-marks-bar--total { background: #fff; }

    .prc-marks-val { font-size: 13.5px; font-weight: 700; color: #fff; white-space: nowrap; min-width: 64px; text-align: right; }

    .prc-marks-item--total .prc-marks-label { font-weight: 800; color: #f5b800; font-size: 14px; }
    .prc-marks-item--total .prc-marks-val   { font-size: 15px; font-weight: 900; color: #f5b800; }

    .prc-marks-note {
        font-size: 12px; color: rgba(255,255,255,0.55); line-height: 1.65;
        display: flex; gap: 8px;
    }
    .prc-marks-note i { color: #f5b800; flex-shrink: 0; margin-top: 2px; }

    /* Evaluation component cards */
    .prc-eval-components { display: flex; flex-direction: column; gap: 22px; }

    .prc-eval-card {
        display: flex; align-items: flex-start; gap: 18px;
        background: #f8f9fd; border-radius: 18px; padding: 24px 22px;
        border: 1px solid rgba(13,27,94,0.08);
        transition: transform 0.22s, box-shadow 0.22s;
    }
    .prc-eval-card:hover { transform: translateX(5px); box-shadow: 0 8px 28px rgba(13,27,94,0.1); }

    .prc-eval-icon {
        width: 52px; height: 52px; border-radius: 14px;
        display: flex; align-items: center; justify-content: center;
        font-size: 22px; color: #fff; flex-shrink: 0;
    }
    .prc-eval-icon--navy  { background: linear-gradient(135deg,#0d1b5e,#1a2f8a); }
    .prc-eval-icon--gold  { background: linear-gradient(135deg,#c8700a,#f5b800); }
    .prc-eval-icon--green { background: linear-gradient(135deg,#155b30,#1aa34a); }

    .prc-eval-body h3 { font-size: 16px; font-weight: 800; color: #0d1b5e; margin: 0 0 8px; }
    .prc-eval-body p  { font-size: 13.5px; color: #666; line-height: 1.7; margin-bottom: 12px; }

    .prc-eval-checklist { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
    .prc-eval-checklist li { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #555; }
    .prc-eval-checklist li i { color: #1aa34a; font-size: 11px; flex-shrink: 0; }

    /* ================================================================
    PROGRAMME-WISE PRACTICAL SUBJECTS
    ================================================================ */
    .prc-prog-section { padding: 88px 0; background: #f4f6f9; }

    .prc-prog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }

    .prc-prog-card {
        background: #fff; border-radius: 20px; overflow: hidden;
        box-shadow: 0 4px 20px rgba(13,27,94,0.08);
        border: 1px solid rgba(13,27,94,0.08);
        transition: transform 0.25s, box-shadow 0.25s;
    }
    .prc-prog-card:hover { transform: translateY(-5px); box-shadow: 0 14px 40px rgba(13,27,94,0.14); }

    .prc-prog-card-header {
        display: flex; align-items: center; gap: 14px;
        padding: 20px 22px; color: #fff;
    }
    .prc-prog-card-header--bba  { background: linear-gradient(135deg,#0d1b5e,#1a2f8a); }
    .prc-prog-card-header--bca  { background: linear-gradient(135deg,#1e40af,#3b82f6); }
    .prc-prog-card-header--bsw  { background: linear-gradient(135deg,#155b30,#1aa34a); }
    .prc-prog-card-header--pmir { background: linear-gradient(135deg,#c8700a,#f5b800); }
    .prc-prog-card-header--msw  { background: linear-gradient(135deg,#5b21b6,#8b5cf6); }

    .prc-prog-badge {
        width: 48px; height: 48px; border-radius: 12px;
        background: rgba(255,255,255,0.2);
        display: flex; align-items: center; justify-content: center;
        font-size: 12px; font-weight: 900; color: #fff;
        flex-shrink: 0; letter-spacing: 0.5px;
    }
    .prc-prog-card-header--pmir .prc-prog-badge { color: #0d1b5e; background: rgba(255,255,255,0.3); }

    .prc-prog-title { font-size: 15px; font-weight: 800; color: #fff; margin: 0 0 3px; line-height: 1.3; }
    .prc-prog-meta  { font-size: 12px; color: rgba(255,255,255,0.75); margin: 0; }

    .prc-subject-list { list-style: none; padding: 14px 20px; margin: 0; display: flex; flex-direction: column; gap: 10px; }

    .prc-subject-item {
        display: flex; align-items: center; gap: 12px;
        padding: 10px 14px; background: #f8f9fd; border-radius: 10px;
        border: 1px solid rgba(13,27,94,0.07);
        transition: background 0.2s;
    }
    .prc-subject-item:hover { background: #eef1fb; }

    .prc-sem-chip {
        display: inline-flex; align-items: center; justify-content: center;
        background: rgba(13,27,94,0.1); color: #0d1b5e;
        font-size: 10.5px; font-weight: 800; padding: 3px 10px;
        border-radius: 50px; white-space: nowrap; flex-shrink: 0;
        letter-spacing: 0.3px;
    }

    .prc-subject-name { font-size: 13.5px; font-weight: 600; color: #333; line-height: 1.4; }

    /* ================================================================
    SCHEDULE TABLE
    ================================================================ */
    .prc-schedule-section { padding: 88px 0; background: #fff; }

    .prc-schedule-table-wrap {
        overflow-x: auto; border-radius: 18px;
        box-shadow: 0 6px 30px rgba(13,27,94,0.1);
        border: 1px solid rgba(13,27,94,0.1);
        margin-bottom: 18px;
    }

    .prc-schedule-table { width: 100%; border-collapse: collapse; font-size: 14px; min-width: 700px; }

    .prc-table-caption { font-size: 13px; color: #888; text-align: left; padding: 14px 20px 8px; caption-side: top; }

    .prc-schedule-table thead tr { background: linear-gradient(135deg,#0d1b5e,#1a2f8a); color: #fff; }
    .prc-schedule-table thead th {
        padding: 15px 18px; font-size: 12.5px; font-weight: 800;
        letter-spacing: 0.5px; text-transform: uppercase; text-align: left; white-space: nowrap;
    }
    .prc-schedule-table thead th:first-child { border-radius: 18px 0 0 0; }
    .prc-schedule-table thead th:last-child  { border-radius: 0 18px 0 0; }

    .prc-schedule-table tbody tr { border-bottom: 1px solid rgba(13,27,94,0.06); transition: background 0.2s; }
    .prc-schedule-table tbody tr:last-child { border-bottom: none; }
    .prc-schedule-table tbody tr:hover { background: rgba(13,27,94,0.03); }
    .prc-schedule-table tbody td { padding: 13px 18px; color: #333; vertical-align: middle; }
    .prc-schedule-table tbody td:first-child { font-weight: 700; color: #0d1b5e; }

    /* Programme pills in table */
    .prc-prog-pill {
        display: inline-flex; align-items: center; justify-content: center;
        font-size: 11.5px; font-weight: 800; padding: 3px 12px; border-radius: 50px; color: #fff;
    }
    .prc-prog-pill--bba  { background: linear-gradient(135deg,#0d1b5e,#1a2f8a); }
    .prc-prog-pill--bca  { background: linear-gradient(135deg,#1e40af,#3b82f6); }
    .prc-prog-pill--bsw  { background: linear-gradient(135deg,#155b30,#1aa34a); }
    .prc-prog-pill--pmir { background: linear-gradient(135deg,#c8700a,#f5b800); color: #0d1b5e; }
    .prc-prog-pill--msw  { background: linear-gradient(135deg,#5b21b6,#8b5cf6); }

    /* Status badges */
    .prc-status {
        display: inline-flex; align-items: center;
        font-size: 11.5px; font-weight: 700; padding: 3px 12px; border-radius: 50px;
    }
    .prc-status--open     { background: rgba(26,163,74,0.12); color: #1aa34a; border: 1.5px solid rgba(26,163,74,0.3); }
    .prc-status--upcoming { background: rgba(13,27,94,0.08);  color: #1a2f8a; border: 1.5px solid rgba(13,27,94,0.18); }
    .prc-status--done     { background: rgba(156,163,175,0.15); color: #6b7280; border: 1.5px solid rgba(156,163,175,0.3); }

    .prc-schedule-note {
        display: flex; gap: 10px; align-items: flex-start;
        font-size: 13px; color: #888; line-height: 1.65;
    }
    .prc-schedule-note i { color: #f5b800; flex-shrink: 0; margin-top: 2px; }

    /* Responsive table */
    @media (max-width: 640px) {
        .prc-schedule-table thead { display: none; }
        .prc-schedule-table tbody,
        .prc-schedule-table tr,
        .prc-schedule-table td { display: block; width: 100%; }
        .prc-schedule-table tbody tr { border: 1px solid rgba(13,27,94,0.1); border-radius: 12px; margin-bottom: 14px; padding: 4px 0; }
        .prc-schedule-table tbody td { padding: 9px 16px; text-align: right; position: relative; }
        .prc-schedule-table tbody td::before {
            content: attr(data-label); position: absolute; left: 16px;
            font-weight: 700; color: #0d1b5e; font-size: 11.5px; text-transform: uppercase;
        }
    }

    /* ================================================================
    LAB RECORD GUIDELINES
    ================================================================ */
    .prc-record-section { padding: 88px 0; background: linear-gradient(160deg,#f0f3fa 0%,#e8ecf8 100%); }

    .prc-record-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; }

    .prc-record-card {
        background: #fff; border-radius: 20px; padding: 32px 28px;
        border: 1px solid rgba(13,27,94,0.08);
        position: relative; overflow: hidden;
        transition: transform 0.25s, box-shadow 0.25s;
    }
    .prc-record-card:hover { transform: translateY(-4px); box-shadow: 0 14px 40px rgba(13,27,94,0.12); }

    .prc-record-step {
        position: absolute; top: 16px; right: 20px;
        font-size: 60px; font-weight: 900;
        color: rgba(13,27,94,0.05); line-height: 1; user-select: none;
    }

    .prc-record-icon {
        width: 58px; height: 58px;
        background: linear-gradient(135deg,#0d1b5e,#1a2f8a);
        border-radius: 14px; display: flex; align-items: center; justify-content: center;
        color: #f5b800; font-size: 24px; margin-bottom: 18px;
    }
    .prc-record-icon--gold   { background: linear-gradient(135deg,#c8700a,#f5b800); color: #fff; }
    .prc-record-icon--green  { background: linear-gradient(135deg,#155b30,#1aa34a); color: #fff; }
    .prc-record-icon--purple { background: linear-gradient(135deg,#5b21b6,#8b5cf6); color: #fff; }

    .prc-record-title { font-size: 17px; font-weight: 800; color: #0d1b5e; margin: 0 0 14px; }

    .prc-record-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
    .prc-record-list li {
        display: flex; align-items: flex-start; gap: 10px;
        font-size: 13.5px; color: #555; line-height: 1.6;
    }
    .prc-record-list li i { color: #f5b800; font-size: 11px; flex-shrink: 0; margin-top: 4px; }

    /* ================================================================
    PREPARATION TIPS
    ================================================================ */
    .prc-tips-section { padding: 88px 0; background: #fff; }

    .prc-tips-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }

    .prc-tip-card {
        background: #f8f9fd; border-radius: 20px; padding: 30px 26px;
        border: 1px solid rgba(13,27,94,0.07);
        transition: transform 0.25s, box-shadow 0.25s, background 0.25s;
    }
    .prc-tip-card:hover { transform: translateY(-5px); box-shadow: 0 14px 38px rgba(13,27,94,0.12); background: #fff; }

    .prc-tip-icon {
        width: 58px; height: 58px;
        background: linear-gradient(135deg,#0d1b5e,#1a2f8a);
        border-radius: 14px; display: flex; align-items: center; justify-content: center;
        color: #f5b800; font-size: 22px; margin-bottom: 18px;
        transition: transform 0.3s;
    }
    .prc-tip-card:hover .prc-tip-icon { transform: scale(1.1) rotate(-5deg); }

    .prc-tip-icon--gold   { background: linear-gradient(135deg,#c8700a,#f5b800); color: #fff; }
    .prc-tip-icon--green  { background: linear-gradient(135deg,#155b30,#1aa34a); color: #fff; }
    .prc-tip-icon--purple { background: linear-gradient(135deg,#5b21b6,#8b5cf6); color: #fff; }
    .prc-tip-icon--red    { background: linear-gradient(135deg,#991b1b,#e84118); color: #fff; }
    .prc-tip-icon--teal   { background: linear-gradient(135deg,#0e7490,#06b6d4); color: #fff; }

    .prc-tip-title { font-size: 16px; font-weight: 800; color: #0d1b5e; margin: 0 0 10px; }
    .prc-tip-text  { font-size: 13.5px; color: #666; line-height: 1.75; margin: 0; }

    /* ================================================================
    RULES + QUICK PANEL
    ================================================================ */
    .prc-rules-section { padding: 88px 0; background: #f4f6f9; }

    .prc-rules-inner { display: grid; grid-template-columns: 1fr 340px; gap: 48px; align-items: start; }

    .prc-rules-heading {
        font-size: clamp(24px,3.5vw,34px); font-weight: 900;
        color: #0d1b5e; margin: 0 0 14px; line-height: 1.25;
    }
    .prc-rules-sub { font-size: 15px; color: #555; line-height: 1.8; margin-bottom: 30px; }

    .prc-rules-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 14px; }

    .prc-rule-item {
        display: flex; align-items: flex-start; gap: 14px;
        padding: 16px 20px; border-radius: 14px;
        border: 1px solid transparent;
    }
    .prc-rule-item--must {
        background: rgba(26,163,74,0.05);
        border-color: rgba(26,163,74,0.18);
    }
    .prc-rule-item--must-not {
        background: rgba(220,38,38,0.05);
        border-color: rgba(220,38,38,0.18);
    }

    .prc-rule-icon { font-size: 20px; flex-shrink: 0; margin-top: 2px; color: #1aa34a; }
    .prc-rule-icon--red { color: #dc2626; }

    .prc-rule-item div { display: flex; flex-direction: column; gap: 3px; }
    .prc-rule-item strong { font-size: 14.5px; color: #0d1b5e; font-weight: 700; }
    .prc-rule-item span   { font-size: 13px; color: #666; line-height: 1.65; }

    /* Quick Panel */
    .prc-quick-panel {
        background: linear-gradient(160deg,#0d1b5e 0%,#1a2f8a 100%);
        border-radius: 22px; padding: 28px 26px;
        box-shadow: 0 12px 40px rgba(13,27,94,0.3);
        position: sticky; top: 100px;
    }
    .prc-quick-header {
        display: flex; align-items: center; gap: 12px;
        padding-bottom: 18px; margin-bottom: 20px;
        border-bottom: 1.5px solid rgba(255,255,255,0.12);
    }
    .prc-quick-header i { color: #f5b800; font-size: 20px; }
    .prc-quick-header h3 { font-size: 17px; font-weight: 800; color: #fff; margin: 0; }

    .prc-quick-items { display: flex; flex-direction: column; gap: 0; margin-bottom: 22px; }

    .prc-quick-item {
        display: flex; justify-content: space-between; align-items: center;
        padding: 11px 0; border-bottom: 1px solid rgba(255,255,255,0.09);
    }
    .prc-quick-item:last-child { border-bottom: none; }
    .prc-quick-label { font-size: 13px; color: rgba(255,255,255,0.7); }
    .prc-quick-value { font-size: 13.5px; font-weight: 700; color: #fff; text-align: right; }

    .prc-quick-contact {
        display: flex; align-items: center; justify-content: center; gap: 8px;
        background: linear-gradient(135deg,#f5b800,#e07b00);
        color: #0d1b5e; font-size: 14px; font-weight: 800;
        padding: 13px; border-radius: 30px; text-decoration: none;
        transition: transform 0.2s, box-shadow 0.25s;
        box-shadow: 0 4px 16px rgba(245,184,0,0.4); width: 100%;
    }
    .prc-quick-contact:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(245,184,0,0.55); color: #0a1440; }

    /* ================================================================
    RELATED RESOURCES
    ================================================================ */
    .prc-resources-section { padding: 88px 0; background: #fff; }

    .prc-res-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }

    .prc-res-card {
        display: flex; align-items: center; gap: 14px;
        padding: 20px 18px; background: #f8f9fd; border-radius: 16px;
        border: 1px solid rgba(13,27,94,0.08); text-decoration: none;
        transition: transform 0.22s, box-shadow 0.22s, background 0.22s;
    }
    .prc-res-card:hover { transform: translateY(-3px); box-shadow: 0 10px 30px rgba(13,27,94,0.12); background: #fff; }

    .prc-res-icon {
        width: 48px; height: 48px; border-radius: 12px;
        display: flex; align-items: center; justify-content: center;
        font-size: 20px; color: #fff; flex-shrink: 0; transition: transform 0.25s;
    }
    .prc-res-card:hover .prc-res-icon { transform: scale(1.1) rotate(-5deg); }
    .prc-res-icon--navy   { background: linear-gradient(135deg,#0d1b5e,#1a2f8a); }
    .prc-res-icon--gold   { background: linear-gradient(135deg,#c8700a,#f5b800); }
    .prc-res-icon--green  { background: linear-gradient(135deg,#155b30,#1aa34a); }
    .prc-res-icon--purple { background: linear-gradient(135deg,#5b21b6,#8b5cf6); }

    .prc-res-body h3 { font-size: 14px; font-weight: 800; color: #0d1b5e; margin: 0 0 4px; }
    .prc-res-body p  { font-size: 12.5px; color: #777; line-height: 1.6; margin: 0; }

    .prc-res-arrow { color: rgba(13,27,94,0.2); font-size: 13px; flex-shrink: 0; transition: color 0.2s, transform 0.2s; }
    .prc-res-card:hover .prc-res-arrow { color: #f5b800; transform: translateX(3px); }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .prc-cta-section {
        padding: 90px 0;
        background: linear-gradient(135deg,#0d1b5e 0%,#1a2f8a 60%,#2a4aad 100%);
        position: relative; overflow: hidden; text-align: center;
    }
    .prc-cta-overlay {
        position: absolute; inset: 0;
        background: radial-gradient(ellipse at 20% 60%,rgba(245,184,0,0.12) 0%,transparent 55%),
                    radial-gradient(ellipse at 80% 20%,rgba(255,255,255,0.06) 0%,transparent 50%);
        pointer-events: none;
    }
    .prc-cta-inner { display: flex; flex-direction: column; align-items: center; gap: 24px; position: relative; z-index: 1; }
    .prc-cta-icon {
        width: 80px; height: 80px; background: rgba(245,184,0,0.14);
        border: 2px solid rgba(245,184,0,0.35); border-radius: 50%;
        display: flex; align-items: center; justify-content: center;
        color: #f5b800; font-size: 32px;
    }
    .prc-cta-text   { max-width: 640px; }
    .prc-cta-heading { font-size: clamp(26px,4vw,40px); font-weight: 900; color: #fff; margin: 0 0 12px; line-height: 1.2; }
    .prc-cta-sub    { font-size: 16px; color: rgba(255,255,255,0.78); line-height: 1.8; max-width: 560px; margin: 0; }
    .prc-cta-actions { display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; }

    .prc-cta-btn {
        display: inline-flex; align-items: center; gap: 9px;
        font-size: 14.5px; font-weight: 700; padding: 14px 32px;
        border-radius: 50px; text-decoration: none;
        transition: transform 0.2s, box-shadow 0.25s, background 0.25s;
    }
    .prc-cta-btn--primary { background: linear-gradient(135deg,#f5b800,#e07b00); color: #0d1b5e; box-shadow: 0 4px 16px rgba(245,184,0,0.45); }
    .prc-cta-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(245,184,0,0.6); color: #0a1440; }
    .prc-cta-btn--outline { background: transparent; color: #fff; border: 2px solid rgba(255,255,255,0.45); }
    .prc-cta-btn--outline:hover { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.8); transform: translateY(-2px); color: #fff; }

    /* ================================================================
    RESPONSIVE — PRACTICAL PAGE
    ================================================================ */
    @media (max-width: 1100px) {
        .prc-prog-grid   { grid-template-columns: repeat(2, 1fr); }
        .prc-res-grid    { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 1024px) {
        .prc-eval-grid   { grid-template-columns: 1fr; }
        .prc-marks-card  { position: static; }
        .prc-rules-inner { grid-template-columns: 1fr; }
        .prc-quick-panel { position: static; }
    }
    @media (max-width: 900px) {
        .prc-about-grid  { grid-template-columns: 1fr; gap: 36px; }
        .prc-tips-grid   { grid-template-columns: repeat(2, 1fr); }
        .prc-record-grid { grid-template-columns: 1fr; }
    }
    @media (max-width: 640px) {
        .prc-container      { padding: 0 18px; }
        .prc-about-section,
        .prc-eval-section,
        .prc-prog-section,
        .prc-schedule-section,
        .prc-record-section,
        .prc-tips-section,
        .prc-rules-section,
        .prc-resources-section { padding: 56px 0; }
        .prc-cta-section    { padding: 60px 0; }
        .prc-section-header { margin-bottom: 32px; }
        .prc-stat-divider   { display: none; }
        .prc-stat-item      { min-width: 50%; border-bottom: 1px solid rgba(255,255,255,0.08); }
        .prc-prog-grid      { grid-template-columns: 1fr; }
        .prc-tips-grid      { grid-template-columns: 1fr; }
        .prc-res-grid       { grid-template-columns: 1fr; }
        .prc-cta-btn        { width: 100%; justify-content: center; }
        .prc-eval-card      { flex-direction: column; }
        .prc-highlight-card { flex-direction: column; }
    }

    /* ================================================================
    PLACEMENT RECORD PAGE  (plr-*)
    Colors: #0d1b5e (navy), #1a2f8a (blue), #f5b800 (gold),
            #e84118 (red), #f4f6f9 (bg-light), #ffffff (white)
    ================================================================ */

    /* ---- Layout ---- */
    .plr-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 32px;
    }

    /* ---- Section base ---- */
    .plr-section {
        padding: 80px 0;
    }

    /* ---- Tag pill ---- */
    .plr-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13,27,94,0.07);
        border: 1px solid rgba(13,27,94,0.14);
        color: #0d1b5e;
        font-size: 12px;
        font-weight: 900;
        padding: 6px 18px;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 0.8px;
        margin-bottom: 16px;
    }

    .plr-tag i { font-size: 11px; color: #f5b800; }

    .plr-tag--light {
        background: rgba(255,255,255,0.12);
        border-color: rgba(255,255,255,0.25);
        color: #fff;
    }

    /* ---- Titles ---- */
    .plr-title {
        font-size: clamp(22px, 3vw, 34px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
        margin-bottom: 16px;
    }

    .plr-title--light { color: #ffffff; }

    .plr-accent { color: #f5b800; }

    .plr-subtitle,
    .plr-text {
        font-size: 15.5px;
        color: #4b5563;
        line-height: 1.85;
        max-width: 720px;
        margin-bottom: 16px;
    }

    .plr-text--light { color: rgba(255,255,255,0.82); }

    /* ---- Section Header (centred) ---- */
    .plr-section-header {
        text-align: center;
        margin-bottom: 56px;
    }

    .plr-section-header .plr-subtitle {
        margin: 0 auto;
    }

    /* ================================================================
    METRICS STRIP
    ================================================================ */
    .plr-metrics-strip {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 55%, #2a4aad 100%);
        padding: 0;
        position: relative;
        overflow: hidden;
    }

    .plr-metrics-strip::before {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at 15% 50%, rgba(245,184,0,0.12) 0%, transparent 55%),
                    radial-gradient(ellipse at 85% 30%, rgba(255,255,255,0.05) 0%, transparent 50%);
        pointer-events: none;
    }

    .plr-metrics-inner {
        display: flex;
        align-items: stretch;
        justify-content: center;
        flex-wrap: wrap;
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 32px;
        position: relative;
        z-index: 1;
    }

    .plr-metric-item {
        display: flex;
        align-items: center;
        gap: 18px;
        padding: 32px 28px;
        flex: 1;
        min-width: 160px;
    }

    .plr-metric-icon {
        width: 56px;
        height: 56px;
        background: rgba(245,184,0,0.14);
        border: 1.5px solid rgba(245,184,0,0.3);
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 22px;
        flex-shrink: 0;
    }

    .plr-metric-data {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .plr-metric-num {
        font-size: clamp(26px, 3vw, 34px);
        font-weight: 900;
        color: #ffffff;
        line-height: 1;
        letter-spacing: -0.5px;
    }

    .plr-metric-num sup {
        font-size: 55%;
        vertical-align: super;
        font-weight: 700;
        color: #f5b800;
    }

    .plr-metric-label {
        font-size: 12.5px;
        font-weight: 600;
        color: rgba(255,255,255,0.65);
        text-transform: uppercase;
        letter-spacing: 0.6px;
    }

    .plr-metric-divider {
        width: 1px;
        background: rgba(255,255,255,0.1);
        margin: 20px 0;
        flex-shrink: 0;
    }

    /* ================================================================
    ABOUT SECTION
    ================================================================ */
    .plr-section--about {
        background: #ffffff;
    }

    .plr-about-grid {
        display: grid;
        grid-template-columns: 1fr 380px;
        gap: 64px;
        align-items: start;
    }

    .plr-about-badges {
        display: flex;
        flex-direction: column;
        gap: 12px;
        margin-top: 28px;
    }

    .plr-badge-item {
        display: flex;
        align-items: center;
        gap: 12px;
        font-size: 14.5px;
        font-weight: 600;
        color: #0d1b5e;
    }

    .plr-badge-item i {
        color: #f5b800;
        font-size: 16px;
        flex-shrink: 0;
    }

    /* Visual card (right) */
    .plr-about-visual {
        position: sticky;
        top: 100px;
    }

    .plr-visual-card {
        background: linear-gradient(145deg, #0d1b5e 0%, #1a2f8a 100%);
        border-radius: 20px;
        padding: 48px 36px;
        text-align: center;
        position: relative;
        overflow: hidden;
    }

    .plr-visual-icon-wrap {
        width: 80px;
        height: 80px;
        background: rgba(245,184,0,0.18);
        border: 2px solid rgba(245,184,0,0.4);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 34px;
        margin: 0 auto 20px;
        position: relative;
        z-index: 1;
    }

    .plr-visual-title {
        font-size: 22px;
        font-weight: 800;
        color: #ffffff;
        margin-bottom: 12px;
        position: relative;
        z-index: 1;
    }

    .plr-visual-sub {
        font-size: 14px;
        color: rgba(255,255,255,0.72);
        line-height: 1.7;
        position: relative;
        z-index: 1;
    }

    .plr-visual-rings {
        position: absolute;
        inset: 0;
        pointer-events: none;
    }

    .plr-ring {
        position: absolute;
        border-radius: 50%;
        border: 1px solid rgba(245,184,0,0.12);
    }

    .plr-ring--1 { width: 200px; height: 200px; top: -60px; right: -60px; }
    .plr-ring--2 { width: 140px; height: 140px; bottom: -40px; left: -40px; }
    .plr-ring--3 { width: 80px;  height: 80px;  bottom: 60px; right: -20px; }

    /* ================================================================
    YEAR-WISE STATISTICS TABLE
    ================================================================ */
    .plr-section--yearwise {
        background: #f4f6f9;
    }

    .plr-table-wrap {
        overflow-x: auto;
        border-radius: 14px;
        box-shadow: 0 4px 24px rgba(13,27,94,0.08);
        -webkit-overflow-scrolling: touch;
    }

    .plr-table {
        width: 100%;
        border-collapse: collapse;
        background: #ffffff;
        min-width: 700px;
    }

    .plr-table thead tr {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 100%);
    }

    .plr-table thead th {
        color: #ffffff;
        font-size: 13px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        padding: 18px 20px;
        text-align: left;
        white-space: nowrap;
    }

    .plr-table thead th:first-child { border-radius: 14px 0 0 0; }
    .plr-table thead th:last-child  { border-radius: 0 14px 0 0; }

    .plr-table tbody tr {
        border-bottom: 1px solid #e8ecf4;
        transition: background 0.2s;
    }

    .plr-table tbody tr:last-child { border-bottom: none; }

    .plr-table tbody tr:hover {
        background: #f0f4ff;
    }

    .plr-table-highlight {
        background: #fffbf0;
    }

    .plr-table-highlight:hover {
        background: #fff6d6 !important;
    }

    .plr-table tbody td {
        padding: 16px 20px;
        font-size: 14.5px;
        color: #374151;
        vertical-align: middle;
    }

    .plr-table-badge {
        display: inline-block;
        font-size: 10px;
        font-weight: 800;
        padding: 2px 10px;
        border-radius: 20px;
        margin-left: 8px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        vertical-align: middle;
    }

    .plr-badge--latest {
        background: #f5b800;
        color: #0d1b5e;
    }

    /* Placement percentage pill */
    .plr-pct-pill {
        display: inline-block;
        font-size: 13px;
        font-weight: 800;
        padding: 4px 14px;
        border-radius: 20px;
    }

    .plr-pct--high   { background: #d1fae5; color: #065f46; }
    .plr-pct--mid    { background: #dbeafe; color: #1e3a8a; }
    .plr-pct--base   { background: #fef3c7; color: #78350f; }

    .plr-table-note {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-top: 16px;
        font-size: 13px;
        color: #6b7280;
        font-style: italic;
    }

    .plr-table-note i { color: #f5b800; }

    /* ================================================================
    GROWTH BAR CHART
    ================================================================ */
    .plr-section--growth {
        background: linear-gradient(160deg, #f0f4ff 0%, #f9fafe 100%);
    }

    .plr-bars-grid {
        display: flex;
        align-items: flex-end;
        justify-content: center;
        gap: 20px;
        height: 260px;
        padding: 0 20px;
    }

    .plr-bar-wrap {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 12px;
        flex: 1;
        max-width: 120px;
        height: 100%;
    }

    .plr-bar-track {
        flex: 1;
        width: 100%;
        display: flex;
        align-items: flex-end;
        background: rgba(13,27,94,0.06);
        border-radius: 8px 8px 0 0;
        overflow: hidden;
        position: relative;
    }

    .plr-bar {
        width: 100%;
        height: var(--bar-h, 0%);
        background: linear-gradient(180deg, #1a2f8a 0%, #0d1b5e 100%);
        border-radius: 8px 8px 0 0;
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding-top: 10px;
        transition: height 1s cubic-bezier(0.4, 0, 0.2, 1);
        position: relative;
    }

    .plr-bar--latest {
        background: linear-gradient(180deg, #f5b800 0%, #e07b00 100%);
    }

    .plr-bar-val {
        font-size: 12.5px;
        font-weight: 800;
        color: #ffffff;
    }

    .plr-bar--latest .plr-bar-val {
        color: #0d1b5e;
    }

    .plr-bar-year {
        font-size: 11.5px;
        font-weight: 700;
        color: #6b7280;
        text-align: center;
        white-space: nowrap;
    }

    .plr-bar-wrap--latest .plr-bar-year {
        color: #0d1b5e;
        font-weight: 900;
    }

    /* ================================================================
    PROGRAMME-WISE PLACEMENT
    ================================================================ */
    .plr-section--programme {
        background: #ffffff;
    }

    .plr-prog-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

    .plr-prog-card {
        background: #f9fafe;
        border: 1px solid #e2e8f6;
        border-radius: 16px;
        padding: 28px 24px;
        transition: transform 0.25s, box-shadow 0.25s;
        position: relative;
        overflow: hidden;
    }

    .plr-prog-card::before {
        content: '';
        position: absolute;
        top: 0; left: 0; right: 0;
        height: 4px;
        background: linear-gradient(90deg, #0d1b5e, #1a2f8a);
        border-radius: 16px 16px 0 0;
    }

    .plr-prog-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 16px 40px rgba(13,27,94,0.13);
    }

    .plr-prog-card-top {
        display: flex;
        align-items: center;
        gap: 14px;
        margin-bottom: 20px;
        flex-wrap: wrap;
    }

    .plr-prog-icon {
        width: 48px;
        height: 48px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 20px;
        flex-shrink: 0;
    }

    .plr-prog-icon--bca  { background: linear-gradient(135deg, #1a2f8a, #2a4aad); }
    .plr-prog-icon--bsw  { background: linear-gradient(135deg, #065f46, #047857); }
    .plr-prog-icon--pmir { background: linear-gradient(135deg, #78350f, #b45309); }
    .plr-prog-icon--msw  { background: linear-gradient(135deg, #4a1d96, #7c3aed); }

    .plr-prog-name {
        font-size: 22px;
        font-weight: 900;
        color: #0d1b5e;
        letter-spacing: -0.5px;
    }

    .plr-prog-full {
        width: 100%;
        font-size: 12.5px;
        color: #6b7280;
        font-weight: 500;
        margin-top: -8px;
        line-height: 1.4;
    }

    .plr-prog-stats {
        display: flex;
        gap: 8px;
        margin-bottom: 18px;
    }

    .plr-prog-stat {
        flex: 1;
        text-align: center;
        background: #ffffff;
        border: 1px solid #dde4f2;
        border-radius: 10px;
        padding: 10px 6px;
    }

    .plr-prog-stat-val {
        display: block;
        font-size: 16px;
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1;
        margin-bottom: 4px;
    }

    .plr-prog-stat-lbl {
        display: block;
        font-size: 10.5px;
        color: #9ca3af;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.4px;
    }

    .plr-prog-bar-track {
        height: 6px;
        background: #e2e8f6;
        border-radius: 6px;
        overflow: hidden;
    }

    .plr-prog-bar {
        height: 100%;
        width: var(--prog-w, 0%);
        background: linear-gradient(90deg, #0d1b5e, #1a2f8a);
        border-radius: 6px;
        transition: width 1.2s ease;
    }

    .plr-prog-bar--bca  { background: linear-gradient(90deg, #1a2f8a, #3b5bdb); }
    .plr-prog-bar--bsw  { background: linear-gradient(90deg, #047857, #10b981); }
    .plr-prog-bar--pmir { background: linear-gradient(90deg, #b45309, #f59e0b); }
    .plr-prog-bar--msw  { background: linear-gradient(90deg, #7c3aed, #a78bfa); }

    /* ================================================================
    PLACEMENT HIGHLIGHTS
    ================================================================ */
    .plr-section--highlights {
        background: #f4f6f9;
    }

    .plr-highlights-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
    }

    .plr-highlight-card {
        border-radius: 16px;
        padding: 32px 24px;
        text-align: center;
        position: relative;
        overflow: hidden;
        transition: transform 0.25s, box-shadow 0.25s;
    }

    .plr-highlight-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 20px 48px rgba(0,0,0,0.12);
    }

    .plr-highlight-card--gold   { background: linear-gradient(145deg, #fffbeb, #fef3c7); border: 1px solid #fde68a; }
    .plr-highlight-card--blue   { background: linear-gradient(145deg, #eff6ff, #dbeafe); border: 1px solid #bfdbfe; }
    .plr-highlight-card--green  { background: linear-gradient(145deg, #f0fdf4, #dcfce7); border: 1px solid #bbf7d0; }
    .plr-highlight-card--purple { background: linear-gradient(145deg, #faf5ff, #ede9fe); border: 1px solid #ddd6fe; }

    .plr-highlight-icon {
        width: 64px;
        height: 64px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 26px;
        margin: 0 auto 18px;
    }

    .plr-highlight-card--gold   .plr-highlight-icon { background: rgba(245,184,0,0.2); color: #d97706; }
    .plr-highlight-card--blue   .plr-highlight-icon { background: rgba(59,130,246,0.15); color: #2563eb; }
    .plr-highlight-card--green  .plr-highlight-icon { background: rgba(16,185,129,0.15); color: #059669; }
    .plr-highlight-card--purple .plr-highlight-icon { background: rgba(124,58,237,0.15); color: #7c3aed; }

    .plr-highlight-title {
        font-size: 14px;
        font-weight: 700;
        color: #374151;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        margin-bottom: 10px;
    }

    .plr-highlight-val {
        font-size: clamp(18px, 2.5vw, 26px);
        font-weight: 900;
        color: #0d1b5e;
        margin-bottom: 10px;
        line-height: 1.2;
    }

    .plr-highlight-desc {
        font-size: 13.5px;
        color: #6b7280;
        line-height: 1.65;
    }

    /* ================================================================
    TOP RECRUITERS SHOWCASE
    ================================================================ */
    .plr-section--recruiters {
        background: #ffffff;
    }

    .plr-recruiters-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
        margin-bottom: 40px;
    }

    .plr-recruiter-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
        padding: 28px 16px 22px;
        background: #f9fafe;
        border: 1px solid #e2e8f6;
        border-radius: 14px;
        text-align: center;
        transition: transform 0.22s, box-shadow 0.22s, border-color 0.22s;
    }

    .plr-recruiter-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 32px rgba(13,27,94,0.12);
        border-color: #f5b800;
    }

    .plr-recruiter-icon {
        width: 56px;
        height: 56px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 22px;
        margin-bottom: 4px;
    }

    .plr-recruiter-name {
        font-size: 14.5px;
        font-weight: 800;
        color: #0d1b5e;
    }

    .plr-recruiter-sector {
        font-size: 11.5px;
        color: #9ca3af;
        font-weight: 500;
    }

    .plr-recruiters-cta {
        text-align: center;
    }

    .plr-view-all-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: transparent;
        color: #0d1b5e;
        border: 2px solid #0d1b5e;
        font-size: 14.5px;
        font-weight: 700;
        padding: 13px 32px;
        border-radius: 50px;
        text-decoration: none;
        letter-spacing: 0.3px;
        transition: background 0.25s, color 0.25s, transform 0.2s;
    }

    .plr-view-all-btn:hover {
        background: #0d1b5e;
        color: #f5b800;
        transform: translateY(-2px);
    }

    /* ================================================================
    PLACEMENT PROCESS
    ================================================================ */
    .plr-section--process {
        background: linear-gradient(160deg, #f0f4ff 0%, #f9fafe 100%);
    }

    .plr-process-grid {
        display: flex;
        align-items: flex-start;
        gap: 0;
    }

    .plr-process-card {
        flex: 1;
        background: #ffffff;
        border: 1px solid #e2e8f6;
        border-radius: 16px;
        padding: 32px 24px;
        text-align: center;
        transition: transform 0.25s, box-shadow 0.25s;
        position: relative;
    }

    .plr-process-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 16px 36px rgba(13,27,94,0.12);
    }

    .plr-process-num {
        font-size: 11px;
        font-weight: 900;
        color: #f5b800;
        text-transform: uppercase;
        letter-spacing: 1px;
        margin-bottom: 12px;
    }

    .plr-process-icon {
        width: 60px;
        height: 60px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 22px;
        margin: 0 auto 16px;
    }

    .plr-process-title {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 10px;
        line-height: 1.35;
    }

    .plr-process-text {
        font-size: 13.5px;
        color: #6b7280;
        line-height: 1.7;
    }

    .plr-process-connector {
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 18px;
        padding: 0 4px;
        padding-top: 48px;
        flex-shrink: 0;
    }

    /* ================================================================
    CONTACT SECTION
    ================================================================ */
    .plr-section--contact {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 60%, #2a4aad 100%);
        position: relative;
        overflow: hidden;
    }

    .plr-section--contact::before {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at 10% 70%, rgba(245,184,0,0.1) 0%, transparent 55%),
                    radial-gradient(ellipse at 90% 20%, rgba(255,255,255,0.05) 0%, transparent 50%);
        pointer-events: none;
    }

    .plr-contact-split {
        display: grid;
        grid-template-columns: 1fr 360px;
        gap: 64px;
        align-items: start;
        position: relative;
        z-index: 1;
    }

    .plr-contact-links {
        display: flex;
        flex-direction: column;
        gap: 16px;
        margin: 28px 0;
    }

    .plr-contact-link {
        display: flex;
        align-items: center;
        gap: 16px;
        text-decoration: none;
        color: inherit;
        transition: opacity 0.2s;
    }

    .plr-contact-link:hover { opacity: 0.85; }

    .plr-contact-link-icon {
        width: 46px;
        height: 46px;
        background: rgba(245,184,0,0.15);
        border: 1.5px solid rgba(245,184,0,0.3);
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 18px;
        flex-shrink: 0;
    }

    .plr-contact-link-text {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .plr-contact-link-text strong {
        font-size: 13px;
        font-weight: 700;
        color: rgba(255,255,255,0.6);
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .plr-contact-link-text span,
    .plr-contact-link-text a {
        font-size: 15px;
        font-weight: 600;
        color: #ffffff;
        text-decoration: none;
    }

    .plr-contact-btns {
        display: flex;
        gap: 14px;
        flex-wrap: wrap;
        margin-top: 8px;
    }

    /* ---- Buttons ---- */
    .plr-cta-btn {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        font-size: 14.5px;
        font-weight: 700;
        padding: 13px 28px;
        border-radius: 50px;
        text-decoration: none;
        transition: transform 0.2s, box-shadow 0.25s, background 0.25s;
    }

    .plr-cta-btn--primary {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 16px rgba(245,184,0,0.4);
    }

    .plr-cta-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 28px rgba(245,184,0,0.55);
        color: #0a1440;
    }

    .plr-cta-btn--outline {
        background: transparent;
        color: #ffffff;
        border: 2px solid rgba(255,255,255,0.4);
    }

    .plr-cta-btn--outline:hover {
        background: rgba(255,255,255,0.1);
        border-color: rgba(255,255,255,0.8);
        transform: translateY(-2px);
        color: #ffffff;
    }

    /* ---- Aside panel ---- */
    .plr-contact-aside {
        background: rgba(255,255,255,0.07);
        border: 1px solid rgba(255,255,255,0.15);
        border-radius: 18px;
        padding: 32px 28px;
        backdrop-filter: blur(8px);
    }

    .plr-aside-title {
        font-size: 16px;
        font-weight: 800;
        color: #ffffff;
        margin-bottom: 20px;
        padding-bottom: 14px;
        border-bottom: 1px solid rgba(255,255,255,0.12);
    }

    .plr-aside-links {
        display: flex;
        flex-direction: column;
        gap: 6px;
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .plr-aside-link {
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 13px 14px;
        border-radius: 10px;
        text-decoration: none;
        color: rgba(255,255,255,0.82);
        font-size: 14px;
        font-weight: 600;
        transition: background 0.2s, color 0.2s;
    }

    .plr-aside-link i:first-child {
        color: #f5b800;
        font-size: 15px;
        width: 18px;
        text-align: center;
    }

    .plr-aside-link span { flex: 1; }

    .plr-aside-arrow {
        font-size: 11px;
        color: rgba(255,255,255,0.3);
        transition: color 0.2s, transform 0.2s;
    }

    .plr-aside-link:hover {
        background: rgba(245,184,0,0.1);
        color: #ffffff;
    }

    .plr-aside-link:hover .plr-aside-arrow {
        color: #f5b800;
        transform: translateX(3px);
    }

    /* ================================================================
    CTA BANNER
    ================================================================ */
    .plr-cta-section {
        padding: 90px 0;
        background: linear-gradient(135deg, #0a1440 0%, #0d1b5e 50%, #1a2f8a 100%);
        position: relative;
        overflow: hidden;
        text-align: center;
    }

    .plr-cta-overlay {
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at 20% 60%, rgba(245,184,0,0.12) 0%, transparent 55%),
                    radial-gradient(ellipse at 80% 20%, rgba(255,255,255,0.05) 0%, transparent 50%);
        pointer-events: none;
    }

    .plr-cta-inner {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 24px;
        position: relative;
        z-index: 1;
    }

    .plr-cta-icon {
        width: 80px;
        height: 80px;
        background: rgba(245,184,0,0.14);
        border: 2px solid rgba(245,184,0,0.35);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 32px;
    }

    .plr-cta-text { max-width: 640px; }

    .plr-cta-heading {
        font-size: clamp(24px, 4vw, 40px);
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .plr-cta-sub {
        font-size: 16px;
        color: rgba(255,255,255,0.78);
        line-height: 1.8;
        margin: 0;
    }

    .plr-cta-actions {
        display: flex;
        gap: 16px;
        flex-wrap: wrap;
        justify-content: center;
    }

    /* ================================================================
    RESPONSIVE — PLACEMENT RECORD PAGE
    ================================================================ */
    @media (max-width: 1100px) {
        .plr-prog-grid        { grid-template-columns: repeat(2, 1fr); }
        .plr-highlights-grid  { grid-template-columns: repeat(2, 1fr); }
        .plr-recruiters-grid  { grid-template-columns: repeat(4, 1fr); }
    }

    @media (max-width: 1024px) {
        .plr-about-grid       { grid-template-columns: 1fr; gap: 40px; }
        .plr-about-visual     { position: static; }
        .plr-contact-split    { grid-template-columns: 1fr; gap: 40px; }
        .plr-process-grid     { flex-wrap: wrap; }
        .plr-process-card     { min-width: calc(50% - 20px); }
        .plr-process-connector { display: none; }
    }

    @media (max-width: 900px) {
        .plr-recruiters-grid  { grid-template-columns: repeat(2, 1fr); }
        .plr-bars-grid        { gap: 10px; height: 220px; }
    }

    @media (max-width: 768px) {
        .plr-metrics-inner    { flex-wrap: wrap; }
        .plr-metric-item      { min-width: calc(50% - 64px); padding: 22px 16px; }
        .plr-metric-divider   { display: none; }
        .plr-prog-grid        { grid-template-columns: 1fr; }
        .plr-highlights-grid  { grid-template-columns: repeat(2, 1fr); }
        .plr-bars-grid        { gap: 8px; height: 200px; padding: 0 8px; }
    }

    @media (max-width: 640px) {
        .plr-container        { padding: 0 18px; }
        .plr-section          { padding: 56px 0; }
        .plr-section-header   { margin-bottom: 36px; }
        .plr-highlights-grid  { grid-template-columns: 1fr; }
        .plr-recruiters-grid  { grid-template-columns: repeat(2, 1fr); }
        .plr-process-card     { min-width: 100%; }
        .plr-cta-section      { padding: 64px 0; }
        .plr-cta-btn          { width: 100%; justify-content: center; }
        .plr-contact-btns     { flex-direction: column; }
        .plr-bars-grid        { gap: 6px; height: 180px; padding: 0; }
        .plr-bar-year         { font-size: 9px; }
        .plr-bar-val          { font-size: 10px; }
        .plr-metric-item      { min-width: calc(50% - 32px); }

        /* Responsive table */
        .plr-table,
        .plr-table thead,
        .plr-table tbody,
        .plr-table th,
        .plr-table td,
        .plr-table tr { display: block; }

        .plr-table thead tr { position: absolute; top: -9999px; left: -9999px; }

        .plr-table tbody tr {
            border: 1px solid #e2e8f6;
            border-radius: 12px;
            margin-bottom: 14px;
            background: #ffffff;
            padding: 4px 0;
        }

        .plr-table tbody td {
            border-bottom: 1px solid #f1f5f9;
            position: relative;
            padding-left: 50%;
            text-align: right;
            font-size: 14px;
        }

        .plr-table tbody td:last-child { border-bottom: none; }

        .plr-table tbody td::before {
            content: attr(data-label);
            position: absolute;
            left: 16px;
            top: 50%;
            transform: translateY(-50%);
            font-weight: 700;
            font-size: 12px;
            color: #6b7280;
            text-transform: uppercase;
            letter-spacing: 0.4px;
            white-space: nowrap;
        }

        .plr-table-wrap {
            overflow-x: visible;
            border-radius: 0;
            box-shadow: none;
        }

        .plr-table { min-width: unset; }
    }

    /* ================================================================
    ALUMNI GALLERY PAGE — redesigned (alg-*)
    Navy #0d1b5e · Blue #1a2f8a · Gold #f5b800 · Accent #e84118
    ================================================================ */

    .alg-page { background: #f4f6f9; }

    .alg-container {
        max-width: 1180px;
        margin: 0 auto;
        padding: 0 32px;
    }

    /* ---- Hero variant (extends .page-hero) ---- */
    .alg-page-hero {
        min-height: 0;
        padding-bottom: 72px;
        clip-path: polygon(0 0, 100% 0, 100% 94%, 100% 100%, 0 100%, 0 78%);
    }

    .alg-page-hero-pattern {
        position: absolute;
        inset: 0;
        background-image:
            linear-gradient(115deg, rgba(245, 184, 0, 0.07) 0%, transparent 42%),
            repeating-linear-gradient(-12deg, transparent, transparent 48px, rgba(255, 255, 255, 0.03) 48px, rgba(255, 255, 255, 0.03) 49px);
        pointer-events: none;
        z-index: 0;
    }

    .alg-page-hero-overlay {
        background: linear-gradient(125deg, rgba(6, 15, 58, 0.75) 0%, rgba(13, 27, 94, 0.55) 45%, rgba(245, 184, 0, 0.12) 100%);
    }

    .alg-page-hero-inner {
        max-width: 1180px;
    }

    .alg-page-hero-grid {
        display: grid;
        grid-template-columns: 1fr minmax(220px, 300px);
        gap: 40px;
        align-items: end;
    }

    .alg-page-hero-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 12px;
        font-weight: 800;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: #f5b800;
        margin: 0 0 10px;
    }

    .alg-page-hero-eyebrow i { font-size: 13px; }

    .alg-page-hero-lead {
        max-width: 560px;
    }

    .alg-page-hero-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        margin-top: 22px;
    }

    .alg-chip-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13.5px;
        font-weight: 700;
        padding: 11px 20px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s, box-shadow 0.25s, background 0.25s, color 0.2s;
    }

    .alg-chip-btn--gold {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 18px rgba(245, 184, 0, 0.35);
    }

    .alg-chip-btn--gold:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 26px rgba(245, 184, 0, 0.5);
        color: #0a1440;
    }

    .alg-chip-btn--ghost {
        background: rgba(255, 255, 255, 0.08);
        color: #ffffff;
        border: 1px solid rgba(255, 255, 255, 0.35);
    }

    .alg-chip-btn--ghost:hover {
        background: rgba(255, 255, 255, 0.16);
        border-color: rgba(245, 184, 0, 0.55);
        color: #f5b800;
    }

    .alg-page-hero-aside {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .alg-hero-stat-card {
        background: rgba(255, 255, 255, 0.08);
        border: 1px solid rgba(255, 255, 255, 0.18);
        border-radius: 14px;
        padding: 16px 18px;
        backdrop-filter: blur(6px);
    }

    .alg-hero-stat-card--accent {
        background: linear-gradient(135deg, rgba(245, 184, 0, 0.22), rgba(245, 184, 0, 0.08));
        border-color: rgba(245, 184, 0, 0.45);
    }

    .alg-hero-stat-num {
        display: block;
        font-size: 26px;
        font-weight: 900;
        color: #ffffff;
        line-height: 1.1;
        letter-spacing: -0.5px;
    }

    .alg-hero-stat-num sup {
        font-size: 55%;
        color: #f5b800;
        font-weight: 800;
        vertical-align: super;
    }

    .alg-hero-stat-lbl {
        display: block;
        font-size: 11.5px;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.65);
        text-transform: uppercase;
        letter-spacing: 0.06em;
        margin-top: 4px;
    }

    /* ---- Rail under hero ---- */
    .alg-rail-wrap {
        position: relative;
        z-index: 2;
        margin-top: -52px;
        padding-bottom: 8px;
    }

    .alg-rail {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 0;
        background: #ffffff;
        border-radius: 16px;
        box-shadow: 0 18px 50px rgba(13, 27, 94, 0.12);
        border: 1px solid #e5e9f2;
        overflow: hidden;
    }

    .alg-rail-item {
        display: flex;
        flex-direction: column;
        gap: 4px;
        padding: 22px 20px;
        border-right: 1px solid #eef1f8;
    }

    .alg-rail-item:last-child { border-right: none; }

    .alg-rail-icon {
        width: 40px;
        height: 40px;
        border-radius: 10px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 17px;
        margin-bottom: 4px;
    }

    .alg-rail-strong {
        font-size: 14px;
        font-weight: 800;
        color: #0d1b5e;
    }

    .alg-rail-muted {
        font-size: 12.5px;
        color: #6b7280;
        line-height: 1.45;
    }

    /* ---- Bands (sections) ---- */
    .alg-band { padding: 72px 0; }

    .alg-band--paper {
        background: #faf7f2;
        border-top: 1px solid #ebe4d8;
    }

    .alg-band--mist { background: #eef2fb; }

    .alg-band--white { background: #ffffff; }

    .alg-band--deck {
        background: linear-gradient(160deg, #0a1440 0%, #0d1b5e 40%, #1a2f8a 100%);
        position: relative;
        overflow: hidden;
    }

    .alg-band--deck::after {
        content: '';
        position: absolute;
        right: -20%;
        top: -30%;
        width: 55%;
        height: 120%;
        background: radial-gradient(ellipse, rgba(245, 184, 0, 0.09) 0%, transparent 70%);
        pointer-events: none;
    }

    .alg-band--sage {
        background: linear-gradient(90deg, #f0f4ff 0%, #f7faf9 50%, #fff9f0 100%);
        border-top: 1px solid #e2e8f6;
        border-bottom: 1px solid #e2e8f6;
    }

    .alg-band--finale {
        background: #0d1b5e;
        padding: 64px 0 80px;
    }

    /* ---- Editorial block ---- */
    .alg-editorial {
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 40px 48px;
        align-items: start;
    }

    .alg-editorial-mark {
        font-size: clamp(52px, 8vw, 96px);
        font-weight: 900;
        line-height: 0.85;
        letter-spacing: -0.04em;
        color: rgba(13, 27, 94, 0.08);
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        user-select: none;
    }

    .alg-headline {
        font-size: clamp(26px, 3.6vw, 40px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.2;
        margin: 0 0 18px;
        letter-spacing: -0.02em;
    }

    .alg-headline em {
        font-style: normal;
        color: #e84118;
        border-bottom: 3px solid #f5b800;
        padding-bottom: 2px;
    }

    .alg-headline--sm {
        font-size: clamp(22px, 2.8vw, 30px);
    }

    .alg-headline--on-dark {
        color: #ffffff;
    }

    .alg-headline--on-dark em {
        color: #f5b800;
        border-bottom-color: rgba(245, 184, 0, 0.6);
    }

    .alg-lede {
        font-size: 16px;
        color: #4b5563;
        line-height: 1.85;
        margin: 0 0 16px;
        max-width: 720px;
    }

    .alg-lede--tight { margin-bottom: 0; }

    /* ---- Band headers ---- */
    .alg-band-header {
        margin-bottom: 40px;
    }

    .alg-band-header--center {
        text-align: center;
        max-width: 640px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 44px;
    }

    .alg-kicker {
        display: inline-block;
        font-size: 11px;
        font-weight: 900;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: #1a2f8a;
        background: rgba(26, 47, 138, 0.08);
        padding: 6px 14px;
        border-radius: 6px;
        margin-bottom: 12px;
    }

    .alg-kicker--on-dark {
        color: #f5b800;
        background: rgba(245, 184, 0, 0.12);
    }

    .alg-band-lead {
        font-size: 15px;
        color: #6b7280;
        line-height: 1.75;
        margin: 12px 0 0;
    }

    /* ---- Voices (alternating) ---- */
    .alg-voices {
        display: flex;
        flex-direction: column;
        gap: 28px;
    }

    .alg-voice {
        display: grid;
        grid-template-columns: 140px 1fr;
        gap: 28px;
        align-items: center;
        background: #ffffff;
        border-radius: 20px;
        padding: 28px 32px;
        border: 1px solid #e2e8f6;
        box-shadow: 0 10px 36px rgba(13, 27, 94, 0.06);
        transition: box-shadow 0.25s, transform 0.25s;
    }

    .alg-voice:hover {
        box-shadow: 0 16px 48px rgba(13, 27, 94, 0.1);
        transform: translateY(-2px);
    }

    .alg-voice--right {
        direction: rtl;
    }

    .alg-voice--right > * {
        direction: ltr;
    }

    .alg-voice-visual {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .alg-voice-icon {
        width: 100px;
        height: 100px;
        border-radius: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 38px;
        color: #ffffff;
        background: linear-gradient(145deg, #1a2f8a, #0d1b5e);
        border: 3px solid #f5b800;
    }

    .alg-voice--right .alg-voice-icon {
        background: linear-gradient(145deg, #2a4aad, #1a2f8a);
    }

    .alg-voice:nth-child(3) .alg-voice-icon {
        background: linear-gradient(145deg, #047857, #065f46);
    }

    .alg-voice-name {
        font-size: 19px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 6px;
    }

    .alg-voice-role {
        font-size: 12.5px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: #e84118;
        margin: 0 0 14px;
    }

    .alg-voice-quote {
        margin: 0;
        padding: 0;
        border: none;
        position: relative;
    }

    .alg-voice-quote p {
        font-size: 15px;
        color: #374151;
        line-height: 1.8;
        margin: 0;
        padding-left: 18px;
        border-left: 4px solid #f5b800;
    }

    /* ---- Alumni gallery: curated collections (light grid + cards) ---- */
    @keyframes alg-collection-shimmer {
        0% { background-position: 0% 50%; }
        100% { background-position: 200% 50%; }
    }

    @keyframes alg-collection-icon-float {
        0%, 100% { transform: translateY(0); }
        50% { transform: translateY(-5px); }
    }

    @keyframes alg-collection-grid-drift {
        0% { background-position: 0 0, 0 0, 0 0; }
        100% { background-position: 32px 32px, 32px 32px, 48px 48px; }
    }

    @keyframes alg-collection-glow-pulse {
        0%, 100% { opacity: 0.45; }
        50% { opacity: 0.7; }
    }

    .alg-band-collection {
        position: relative;
        isolation: isolate;
        overflow: hidden;
        padding: 80px 0 92px;
        background-color: #eef2fb;
        background-image: linear-gradient(180deg, #f8faff 0%, #eef2fb 45%, #f5f7fb 100%);
        border-top: 1px solid #e2e8f6;
        border-bottom: 1px solid #dde4f2;
    }

    /* Lightweight colour grid (CSS only, no images) */
    .alg-band-collection::before {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background-image:
            repeating-linear-gradient(
                90deg,
                transparent 0,
                transparent 31px,
                rgba(13, 27, 94, 0.045) 31px,
                rgba(13, 27, 94, 0.045) 32px
            ),
            repeating-linear-gradient(
                0deg,
                transparent 0,
                transparent 31px,
                rgba(26, 47, 138, 0.04) 31px,
                rgba(26, 47, 138, 0.04) 32px
            ),
            repeating-linear-gradient(
                90deg,
                transparent 0,
                transparent 127px,
                rgba(245, 184, 0, 0.065) 127px,
                rgba(245, 184, 0, 0.065) 128px
            );
        background-size: 32px 32px, 32px 32px, 128px 128px;
        background-position: 0 0, 0 0, 0 0;
        animation: alg-collection-grid-drift 80s linear infinite;
        opacity: 0.95;
    }

    .alg-band-collection::after {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background:
            radial-gradient(ellipse 70% 55% at 12% 18%, rgba(245, 184, 0, 0.12) 0%, transparent 55%),
            radial-gradient(ellipse 55% 50% at 88% 72%, rgba(26, 47, 138, 0.1) 0%, transparent 50%),
            radial-gradient(ellipse 40% 40% at 50% 100%, rgba(232, 65, 24, 0.05) 0%, transparent 45%);
        animation: alg-collection-glow-pulse 14s ease-in-out infinite;
    }

    .alg-collection-container {
        position: relative;
        z-index: 1;
    }

    .alg-collection-header {
        text-align: center;
        max-width: 680px;
        margin: 0 auto 44px;
    }

    .alg-collection-kicker {
        display: inline-block;
        font-size: 11px;
        font-weight: 900;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        color: #0d1b5e;
        background: linear-gradient(135deg, rgba(245, 184, 0, 0.35), rgba(255, 255, 255, 0.9));
        border: 1px solid rgba(13, 27, 94, 0.12);
        padding: 7px 16px;
        border-radius: 999px;
        margin-bottom: 14px;
    }

    .alg-collection-title {
        font-size: clamp(24px, 3.4vw, 36px);
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1.2;
        margin: 0 0 14px;
        letter-spacing: -0.02em;
    }

    .alg-collection-title em {
        font-style: normal;
        background: linear-gradient(90deg, #1a2f8a, #f5b800, #e84118, #1a2f8a);
        background-size: 220% auto;
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        animation: alg-collection-shimmer 7s linear infinite;
    }

    .alg-collection-lead {
        font-size: 15px;
        line-height: 1.75;
        color: #4b5563;
        margin: 0;
    }

    .alg-collection-grid {
        display: grid;
        grid-template-columns: minmax(260px, 1.15fr) repeat(2, 1fr);
        grid-template-rows: auto auto auto;
        gap: 20px;
    }

    .alg-collection-card {
        position: relative;
        border-radius: 18px;
        background: #ffffff;
        border: 1px solid rgba(13, 27, 94, 0.08);
        box-shadow: 0 10px 28px rgba(13, 27, 94, 0.06);
        overflow: hidden;
        display: flex;
        flex-direction: column;
        transition: transform 0.32s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.32s ease, border-color 0.25s ease;
    }

    .alg-collection-card::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 4px;
        z-index: 3;
        border-radius: 18px 18px 0 0;
        background: linear-gradient(90deg, #0d1b5e, #1a2f8a, #f5b800, #e84118, #1a2f8a);
        background-size: 200% 100%;
        animation: alg-collection-shimmer 10s linear infinite;
    }

    .alg-collection-card--hero::before {
        background: linear-gradient(90deg, #0d1b5e, #f5b800, #2a4aad, #f5b800, #0d1b5e);
        background-size: 200% 100%;
    }

    .alg-collection-card--placement::before {
        background: linear-gradient(90deg, #b45309, #f5b800, #e84118, #f5b800);
        background-size: 200% 100%;
    }

    .alg-collection-card--reunion::before {
        background: linear-gradient(90deg, #ea580c, #f5b800, #1a2f8a);
        background-size: 200% 100%;
    }

    .alg-collection-card--lead::before {
        background: linear-gradient(90deg, #0d1b5e, #2563eb, #f5b800, #0d1b5e);
        background-size: 200% 100%;
    }

    .alg-collection-card--sports::before {
        background: linear-gradient(90deg, #065f46, #059669, #f5b800);
        background-size: 200% 100%;
    }

    .alg-collection-card--community::before {
        background: linear-gradient(90deg, #4c1d95, #e84118, #f5b800, #7c3aed);
        background-size: 200% 100%;
    }

    .alg-collection-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 22px 48px rgba(13, 27, 94, 0.12);
        border-color: rgba(245, 184, 0, 0.45);
    }

    .alg-collection-card--hero {
        grid-column: 1;
        grid-row: 1 / span 2;
    }

    .alg-collection-card--placement {
        grid-column: 2;
        grid-row: 1;
    }

    .alg-collection-card--reunion {
        grid-column: 3;
        grid-row: 1;
    }

    .alg-collection-card--lead {
        grid-column: 2 / span 2;
        grid-row: 2;
    }

    .alg-collection-card--sports {
        grid-column: 1;
        grid-row: 3;
    }

    .alg-collection-card--community {
        grid-column: 2 / span 2;
        grid-row: 3;
    }

    .alg-collection-visual {
        position: relative;
        z-index: 1;
        min-height: 118px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }

    .alg-collection-card--hero .alg-collection-visual {
        min-height: 210px;
        flex: 1;
    }

    .alg-collection-visual::before {
        content: '';
        position: absolute;
        inset: 0;
        opacity: 0.94;
        background-size: 200% 200%;
        animation: alg-collection-shimmer 16s ease-in-out infinite alternate;
    }

    .alg-collection-visual--convocation::before {
        background-image: linear-gradient(128deg, #0d1b5e 0%, #1a2f8a 38%, #3b5bdb 68%, #0d1b5e 100%);
    }

    .alg-collection-visual--placement::before {
        background-image: linear-gradient(130deg, #7c2d12 0%, #b45309 32%, #f5b800 62%, #7c2d12 100%);
    }

    .alg-collection-visual--reunion::before {
        background-image: linear-gradient(135deg, #9a3412 0%, #ea580c 48%, #fb923c 100%);
    }

    .alg-collection-visual--lead::before {
        background-image: linear-gradient(118deg, #0d1b5e 0%, #2563eb 48%, #1a2f8a 100%);
    }

    .alg-collection-visual--sports::before {
        background-image: linear-gradient(135deg, #064e3b 0%, #059669 52%, #0d1b5e 100%);
    }

    .alg-collection-visual--community::before {
        background-image: linear-gradient(140deg, #4c1d95 0%, #7c3aed 40%, #e84118 70%, #4c1d95 100%);
    }

    .alg-collection-visual::after {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at 50% 0%, rgba(255, 255, 255, 0.28) 0%, transparent 58%);
        pointer-events: none;
    }

    .alg-collection-icon {
        position: relative;
        z-index: 1;
        width: 62px;
        height: 62px;
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 25px;
        color: #0d1b5e;
        background: linear-gradient(145deg, rgba(255, 255, 255, 0.95), rgba(245, 184, 0, 0.35));
        border: 1px solid rgba(255, 255, 255, 0.65);
        box-shadow: 0 6px 18px rgba(13, 27, 94, 0.15);
        animation: alg-collection-icon-float 4.2s ease-in-out infinite;
    }

    .alg-collection-card--placement .alg-collection-icon { animation-delay: 0.35s; }
    .alg-collection-card--reunion .alg-collection-icon { animation-delay: 0.75s; }
    .alg-collection-card--lead .alg-collection-icon { animation-delay: 0.2s; }
    .alg-collection-card--sports .alg-collection-icon { animation-delay: 0.95s; }
    .alg-collection-card--community .alg-collection-icon { animation-delay: 0.55s; }

    .alg-collection-card--hero .alg-collection-icon {
        width: 74px;
        height: 74px;
        font-size: 30px;
        border-radius: 20px;
    }

    .alg-collection-body {
        position: relative;
        z-index: 1;
        padding: 16px 18px 18px;
        background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
        border-top: 1px solid #eef1f8;
        flex-grow: 0;
    }

    .alg-collection-name {
        font-size: 16px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 8px;
        line-height: 1.25;
    }

    .alg-collection-desc {
        font-size: 13.5px;
        color: #4b5563;
        line-height: 1.6;
        margin: 0 0 12px;
    }

    .alg-collection-cta {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 12.5px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        color: #1a2f8a;
        text-decoration: none;
        padding: 6px 0 2px;
        background-image: linear-gradient(90deg, #f5b800, #e84118, #f5b800);
        background-size: 200% 2px;
        background-repeat: no-repeat;
        background-position: 0 100%;
        transition: color 0.2s ease, background-position 1s ease;
    }

    .alg-collection-cta:hover {
        color: #e84118;
        background-position: 100% 100%;
    }

    @media (prefers-reduced-motion: reduce) {
        .alg-band-collection::before,
        .alg-band-collection::after,
        .alg-collection-title em,
        .alg-collection-card::before,
        .alg-collection-visual::before,
        .alg-collection-icon {
            animation: none !important;
        }
        .alg-collection-card:hover {
            transform: none;
        }
    }

    /* ---- Milestone deck ---- */
    .alg-deck {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 18px;
        position: relative;
        z-index: 1;
    }

    .alg-deck-card {
        background: rgba(255, 255, 255, 0.06);
        border: 1px solid rgba(255, 255, 255, 0.14);
        border-radius: 16px;
        padding: 24px 22px;
        transition: background 0.25s, border-color 0.25s, transform 0.2s;
    }

    .alg-deck-card:hover {
        background: rgba(255, 255, 255, 0.1);
        border-color: rgba(245, 184, 0, 0.35);
        transform: translateY(-3px);
    }

    .alg-deck-card--featured {
        background: linear-gradient(145deg, rgba(245, 184, 0, 0.18), rgba(245, 184, 0, 0.05));
        border-color: rgba(245, 184, 0, 0.4);
    }

    .alg-deck-num {
        display: block;
        font-size: 11px;
        font-weight: 900;
        letter-spacing: 0.12em;
        color: #f5b800;
        margin-bottom: 10px;
    }

    .alg-deck-title {
        font-size: 15px;
        font-weight: 800;
        color: #ffffff;
        margin: 0 0 10px;
        line-height: 1.35;
    }

    .alg-deck-text {
        font-size: 13.5px;
        color: rgba(255, 255, 255, 0.72);
        line-height: 1.65;
        margin: 0;
    }

    /* ---- Themes split ---- */
    .alg-themes-split {
        display: grid;
        grid-template-columns: 1fr 340px;
        gap: 48px;
        align-items: start;
    }

    .alg-theme-list {
        list-style: none;
        margin: 0;
        padding: 24px 26px;
        background: #ffffff;
        border-radius: 16px;
        border: 1px solid #e2e8f6;
        box-shadow: 0 12px 36px rgba(13, 27, 94, 0.06);
    }

    .alg-theme-list li {
        display: flex;
        align-items: center;
        gap: 14px;
        font-size: 14.5px;
        font-weight: 700;
        color: #0d1b5e;
        padding: 12px 0;
        border-bottom: 1px solid #f1f5f9;
    }

    .alg-theme-list li:last-child { border-bottom: none; }

    .alg-theme-list i {
        color: #f5b800;
        width: 22px;
        text-align: center;
    }

    /* ---- Finale CTA ---- */
    .alg-finale {
        display: grid;
        grid-template-columns: 1fr 260px;
        gap: 48px;
        align-items: start;
    }

    .alg-finale-title {
        font-size: clamp(24px, 3.2vw, 34px);
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 14px;
        line-height: 1.2;
    }

    .alg-finale-text {
        font-size: 15px;
        color: rgba(255, 255, 255, 0.75);
        line-height: 1.8;
        margin: 0 0 22px;
        max-width: 620px;
    }

    .alg-finale-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
    }

    .alg-finale-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 14px;
        font-weight: 700;
        padding: 12px 22px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s, box-shadow 0.25s, background 0.2s;
    }

    .alg-finale-btn--primary {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 18px rgba(245, 184, 0, 0.35);
    }

    .alg-finale-btn--primary:hover {
        transform: translateY(-2px);
        color: #0a1440;
    }

    .alg-finale-btn--quiet {
        background: rgba(255, 255, 255, 0.1);
        color: #ffffff;
        border: 1px solid rgba(255, 255, 255, 0.25);
    }

    .alg-finale-btn--quiet:hover {
        background: rgba(255, 255, 255, 0.16);
        border-color: #f5b800;
        color: #f5b800;
    }

    .alg-finale-nav {
        background: rgba(255, 255, 255, 0.06);
        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 14px;
        padding: 22px 20px;
    }

    .alg-finale-nav-title {
        font-size: 12px;
        font-weight: 900;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        color: #f5b800;
        margin: 0 0 14px;
    }

    .alg-finale-links {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .alg-finale-links li { border-bottom: 1px solid rgba(255, 255, 255, 0.08); }

    .alg-finale-links li:last-child { border-bottom: none; }

    .alg-finale-links a {
        display: block;
        padding: 11px 0;
        font-size: 14px;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.88);
        text-decoration: none;
        transition: color 0.2s, padding-left 0.2s;
    }

    .alg-finale-links a:hover {
        color: #f5b800;
        padding-left: 6px;
    }

    /* ---- Responsive ---- */
    @media (max-width: 1024px) {
        .alg-page-hero-grid { grid-template-columns: 1fr; }
        .alg-page-hero-aside {
            flex-direction: row;
            flex-wrap: wrap;
        }
        .alg-hero-stat-card { flex: 1; min-width: 140px; }
        .alg-rail { grid-template-columns: repeat(2, 1fr); }
        .alg-rail-item { border-right: none; border-bottom: 1px solid #eef1f8; }
        .alg-rail-item:nth-child(odd) { border-right: 1px solid #eef1f8; }
        .alg-editorial { grid-template-columns: 1fr; }
        .alg-editorial-mark {
            writing-mode: horizontal-tb;
            transform: none;
            font-size: 42px;
            opacity: 0.35;
        }
        .alg-voice,
        .alg-voice--right {
            direction: ltr;
            grid-template-columns: 100px 1fr;
            padding: 22px;
        }
        .alg-voice-icon { width: 88px; height: 88px; font-size: 32px; }
        .alg-collection-grid {
            grid-template-columns: repeat(2, 1fr);
            grid-template-rows: none;
        }
        .alg-collection-card--hero {
            grid-column: 1 / -1;
        }
        .alg-collection-card--placement,
        .alg-collection-card--reunion,
        .alg-collection-card--lead,
        .alg-collection-card--sports,
        .alg-collection-card--community {
            grid-column: auto;
            grid-row: auto;
        }
        .alg-collection-card--hero .alg-collection-visual {
            min-height: 200px;
        }
        .alg-collection-card--lead {
            grid-column: 1 / -1;
        }
        .alg-deck { grid-template-columns: repeat(2, 1fr); }
        .alg-themes-split { grid-template-columns: 1fr; }
        .alg-finale { grid-template-columns: 1fr; }
    }

    @media (max-width: 768px) {
        .alg-page-hero { clip-path: none; padding-bottom: 48px; }
        .alg-rail-wrap { margin-top: -32px; }
        .alg-rail { grid-template-columns: 1fr; }
        .alg-rail-item {
            border-right: none;
            border-bottom: 1px solid #eef1f8;
            flex-direction: row;
            flex-wrap: wrap;
            align-items: center;
            gap: 12px 16px;
        }
        .alg-rail-item:nth-child(odd) { border-right: none; }
        .alg-rail-icon { margin-bottom: 0; }
        .alg-voice { grid-template-columns: 1fr; text-align: center; }
        .alg-voice-visual { justify-content: center; }
        .alg-voice-quote p {
            padding-left: 0;
            border-left: none;
            padding-top: 14px;
            border-top: 3px solid #f5b800;
            text-align: left;
        }
        .alg-collection-grid {
            grid-template-columns: 1fr;
        }
        .alg-band-collection {
            padding: 64px 0 72px;
        }
        .alg-collection-header {
            margin-bottom: 36px;
        }
        .alg-deck { grid-template-columns: 1fr; }
    }

    @media (max-width: 640px) {
        .alg-container { padding: 0 18px; }
        .alg-band { padding: 52px 0; }
        .alg-band.alg-band-collection { padding-top: 56px; padding-bottom: 68px; }
        .alg-page-hero-inner { padding-top: 44px; }
        .alg-chip-btn { width: 100%; justify-content: center; }
        .alg-page-hero-actions { flex-direction: column; }
        .alg-finale-actions { flex-direction: column; }
        .alg-finale-btn { width: 100%; justify-content: center; }
    }

    /* ================================================================
    COMPUTER SCIENCE — COURSE VIEW PAGE (dpcv-*)
    Navy #0d1b5e · Blue #1a2f8a · Gold #f5b800 · Accent #e84118
    ================================================================ */

    .dpcv-page { background: #f4f6f9; }

    .dpcv-container {
        max-width: 1180px;
        margin: 0 auto;
        padding: 0 32px;
    }

    /* ---- Stats strip under hero ---- */
    .dpcv-strip {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2f8a 55%, #243a9e 100%);
        border-bottom: 3px solid #f5b800;
        position: relative;
        overflow: hidden;
    }

    .dpcv-strip::before {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at 20% 50%, rgba(245, 184, 0, 0.12) 0%, transparent 50%),
                    radial-gradient(ellipse at 80% 30%, rgba(255, 255, 255, 0.06) 0%, transparent 45%);
        pointer-events: none;
    }

    .dpcv-strip-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 0;
        position: relative;
        z-index: 1;
    }

    .dpcv-strip-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 6px;
        padding: 22px 16px;
        border-right: 1px solid rgba(255, 255, 255, 0.1);
    }

    .dpcv-strip-item:last-child { border-right: none; }

    .dpcv-strip-icon {
        width: 42px;
        height: 42px;
        border-radius: 12px;
        background: rgba(245, 184, 0, 0.15);
        border: 1px solid rgba(245, 184, 0, 0.35);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 17px;
    }

    .dpcv-strip-val {
        font-size: 15px;
        font-weight: 800;
        color: #ffffff;
        letter-spacing: 0.02em;
    }

    .dpcv-strip-lbl {
        font-size: 11px;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.65);
        text-transform: uppercase;
        letter-spacing: 0.06em;
    }

    /* ---- Sections ---- */
    .dpcv-section { padding: 72px 0; }

    .dpcv-section--intro { background: #ffffff; }

    .dpcv-section--outcomes {
        background: linear-gradient(180deg, #f0f4ff 0%, #f9fafe 100%);
    }

    .dpcv-section--curriculum { background: #ffffff; }

    .dpcv-section--subjects { background: #f4f6f9; }

    .dpcv-section--labs {
        background: linear-gradient(135deg, #0a1440 0%, #0d1b5e 45%, #1a2f8a 100%);
        position: relative;
        overflow: hidden;
    }

    .dpcv-section--labs::before {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at 70% 80%, rgba(245, 184, 0, 0.1) 0%, transparent 55%);
        pointer-events: none;
    }

    .dpcv-section--cta {
        background: #ffffff;
        padding-bottom: 88px;
    }

    .dpcv-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 11px;
        font-weight: 900;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: #0d1b5e;
        background: rgba(13, 27, 94, 0.06);
        border: 1px solid rgba(13, 27, 94, 0.1);
        padding: 6px 14px;
        border-radius: 999px;
        margin-bottom: 14px;
    }

    .dpcv-tag i { color: #f5b800; font-size: 11px; }

    .dpcv-tag--light {
        background: rgba(255, 255, 255, 0.1);
        border-color: rgba(255, 255, 255, 0.2);
        color: #ffffff;
    }

    .dpcv-tag--light i { color: #f5b800; }

    .dpcv-title {
        font-size: clamp(22px, 3vw, 32px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.25;
        margin: 0 0 16px;
        letter-spacing: -0.02em;
    }

    .dpcv-title--light { color: #ffffff; }

    .dpcv-accent { color: #f5b800; }

    .dpcv-text,
    .dpcv-lead {
        font-size: 15.5px;
        line-height: 1.82;
        color: #4b5563;
        margin: 0 0 14px;
    }

    .dpcv-text--light { color: rgba(255, 255, 255, 0.82); }

    .dpcv-lead { max-width: 640px; }

    .dpcv-section-head { margin-bottom: 40px; }

    .dpcv-section-head--center {
        text-align: center;
        max-width: 680px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 44px;
    }

    .dpcv-section-head--center .dpcv-lead { margin-left: auto; margin-right: auto; }

    /* ---- Intro grid ---- */
    .dpcv-intro-grid {
        display: grid;
        grid-template-columns: 1fr minmax(280px, 340px);
        gap: 48px;
        align-items: start;
    }

    .dpcv-intro-panel {
        background: linear-gradient(160deg, #f0f4ff 0%, #ffffff 100%);
        border: 1px solid #e2e8f6;
        border-radius: 18px;
        padding: 28px 26px;
        box-shadow: 0 12px 36px rgba(13, 27, 94, 0.06);
    }

    .dpcv-panel-title {
        font-size: 16px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 16px;
        padding-bottom: 12px;
        border-bottom: 2px solid #f5b800;
    }

    .dpcv-panel-list {
        list-style: none;
        margin: 0 0 22px;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .dpcv-panel-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 14.5px;
        font-weight: 600;
        color: #374151;
    }

    .dpcv-panel-list i {
        color: #f5b800;
        margin-top: 3px;
        flex-shrink: 0;
    }

    .dpcv-panel-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13.5px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: #0d1b5e;
        background: linear-gradient(135deg, #f5b800, #e8a400);
        padding: 12px 20px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s, box-shadow 0.25s;
    }

    .dpcv-panel-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 22px rgba(245, 184, 0, 0.45);
        color: #0a1440;
    }

    /* ---- Outcome cards ---- */
    .dpcv-outcome-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
    }

    .dpcv-outcome-card {
        background: #ffffff;
        border: 1px solid #e2e8f6;
        border-radius: 16px;
        padding: 26px 22px;
        transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s;
    }

    .dpcv-outcome-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 16px 40px rgba(13, 27, 94, 0.1);
        border-color: rgba(245, 184, 0, 0.45);
    }

    .dpcv-outcome-icon {
        width: 48px;
        height: 48px;
        border-radius: 12px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        margin-bottom: 14px;
    }

    .dpcv-outcome-title {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 8px;
        line-height: 1.3;
    }

    .dpcv-outcome-text {
        font-size: 13.5px;
        color: #6b7280;
        line-height: 1.6;
        margin: 0;
    }

    /* ---- Curriculum ---- */
    .dpcv-curriculum-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 28px;
        margin-bottom: 20px;
    }

    .dpcv-curriculum-col {
        background: #f9fafe;
        border: 1px solid #e2e8f6;
        border-radius: 16px;
        padding: 26px 24px;
    }

    .dpcv-curriculum-phase {
        font-size: 14px;
        font-weight: 800;
        color: #e84118;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        margin: 0 0 16px;
    }

    .dpcv-curriculum-list {
        margin: 0;
        padding: 0 0 0 18px;
        color: #374151;
        font-size: 14.5px;
        line-height: 1.75;
    }

    .dpcv-curriculum-list li { margin-bottom: 8px; }

    .dpcv-note {
        font-size: 13px;
        color: #6b7280;
        font-style: italic;
        display: flex;
        align-items: flex-start;
        gap: 8px;
        margin: 0;
    }

    .dpcv-note i { color: #f5b800; margin-top: 2px; flex-shrink: 0; }

    .dpcv-note a {
        color: #1a2f8a;
        font-weight: 700;
        text-decoration: underline;
    }

    /* ---- Subject grid ---- */
    .dpcv-subject-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 18px;
    }

    .dpcv-subject-card {
        background: #ffffff;
        border: 1px solid #e2e8f6;
        border-radius: 14px;
        padding: 22px 20px;
        border-top: 3px solid #f5b800;
        transition: box-shadow 0.25s, transform 0.25s;
    }

    .dpcv-subject-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 14px 36px rgba(13, 27, 94, 0.1);
    }

    .dpcv-subject-name {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 8px;
    }

    .dpcv-subject-desc {
        font-size: 13.5px;
        color: #6b7280;
        line-height: 1.6;
        margin: 0;
    }

    /* ---- Labs split ---- */
    .dpcv-labs-split {
        display: grid;
        grid-template-columns: 1fr 360px;
        gap: 48px;
        align-items: center;
        position: relative;
        z-index: 1;
    }

    .dpcv-labs-list {
        list-style: none;
        margin: 20px 0 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .dpcv-labs-list li {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 14.5px;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.9);
    }

    .dpcv-labs-list i { color: #f5b800; }

    .dpcv-labs-cards {
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    .dpcv-labs-mini {
        background: rgba(255, 255, 255, 0.07);
        border: 1px solid rgba(255, 255, 255, 0.14);
        border-radius: 14px;
        padding: 16px 18px;
        display: flex;
        flex-direction: column;
        gap: 4px;
    }

    .dpcv-labs-mini strong {
        font-size: 14px;
        font-weight: 800;
        color: #ffffff;
    }

    .dpcv-labs-mini span {
        font-size: 12.5px;
        color: rgba(255, 255, 255, 0.68);
        line-height: 1.45;
    }

    .dpcv-labs-mini-icon {
        width: 38px;
        height: 38px;
        border-radius: 10px;
        background: rgba(245, 184, 0, 0.18);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 16px;
        margin-bottom: 6px;
    }

    /* ---- CTA box ---- */
    .dpcv-cta-box {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 28px;
        background: linear-gradient(135deg, #f0f4ff 0%, #fff9f0 50%, #f0f4ff 100%);
        border: 1px solid #e2e8f6;
        border-radius: 20px;
        padding: 36px 40px;
        box-shadow: 0 14px 40px rgba(13, 27, 94, 0.08);
    }

    .dpcv-cta-title {
        font-size: clamp(20px, 2.5vw, 26px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 8px;
    }

    .dpcv-cta-text {
        font-size: 15px;
        color: #4b5563;
        margin: 0;
        max-width: 480px;
        line-height: 1.7;
    }

    .dpcv-cta-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
    }

    .dpcv-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13.5px;
        font-weight: 700;
        padding: 12px 20px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s, box-shadow 0.25s, background 0.2s;
    }

    .dpcv-btn--primary {
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        color: #f5b800;
        box-shadow: 0 4px 16px rgba(13, 27, 94, 0.25);
    }

    .dpcv-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(13, 27, 94, 0.35);
        color: #ffd54a;
    }

    .dpcv-btn--outline {
        background: #ffffff;
        color: #0d1b5e;
        border: 2px solid #0d1b5e;
    }

    .dpcv-btn--outline:hover {
        background: #0d1b5e;
        color: #f5b800;
        border-color: #0d1b5e;
    }

    /* ---- Responsive ---- */
    @media (max-width: 1024px) {
        .dpcv-intro-grid { grid-template-columns: 1fr; }
        .dpcv-outcome-grid { grid-template-columns: repeat(2, 1fr); }
        .dpcv-labs-split { grid-template-columns: 1fr; }
    }

    @media (max-width: 768px) {
        .dpcv-strip-list { grid-template-columns: repeat(2, 1fr); }
        .dpcv-strip-item { border-right: none; border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
        .dpcv-strip-item:nth-child(odd) { border-right: 1px solid rgba(255, 255, 255, 0.08); }
        .dpcv-curriculum-grid { grid-template-columns: 1fr; }
        .dpcv-subject-grid { grid-template-columns: repeat(2, 1fr); }
        .dpcv-cta-box { flex-direction: column; align-items: stretch; text-align: center; }
        .dpcv-cta-text { max-width: none; }
        .dpcv-cta-actions { justify-content: center; }
    }

    @media (max-width: 640px) {
        .dpcv-container { padding: 0 18px; }
        .dpcv-section { padding: 52px 0; }
        .dpcv-strip-list { grid-template-columns: 1fr; }
        .dpcv-strip-item:nth-child(odd) { border-right: none; }
        .dpcv-outcome-grid,
        .dpcv-subject-grid { grid-template-columns: 1fr; }
        .dpcv-btn { flex: 1; min-width: 140px; justify-content: center; }
    }

    /* ================================================================
    COMPUTER SCIENCE — HOD MESSAGE PAGE (cshm-*)
    Navy #0d1b5e · Blue #1a2f8a · Gold #f5b800 · Accent #e84118
    ================================================================ */

    .cshm-page { background: #eef2fb; }

    .cshm-shell {
        position: relative;
        padding: 0 0 88px;
    }

    .cshm-shell::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 100px;
        background: linear-gradient(180deg, rgba(13, 27, 94, 0.05) 0%, transparent 100%);
        pointer-events: none;
    }

    .cshm-container {
        max-width: 1100px;
        margin: 0 auto;
        padding: 0 28px;
        position: relative;
    }

    /* ---- Intro band ---- */
    .cshm-intro {
        margin-top: -48px;
        margin-bottom: 36px;
        position: relative;
        z-index: 2;
    }

    .cshm-intro-head {
        background: #ffffff;
        border-radius: 18px;
        padding: 32px 36px 34px;
        border: 1px solid #e2e8f6;
        box-shadow: 0 20px 50px rgba(13, 27, 94, 0.1);
    }

    .cshm-kicker {
        display: inline-block;
        font-size: 10px;
        font-weight: 900;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: #1a2f8a;
        background: rgba(26, 47, 138, 0.08);
        padding: 5px 12px;
        border-radius: 6px;
        margin-bottom: 12px;
    }

    .cshm-kicker--outline {
        background: transparent;
        border: 1px solid rgba(26, 47, 138, 0.2);
    }

    .cshm-intro-title {
        font-size: clamp(22px, 2.8vw, 30px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.2;
        margin: 0 0 14px;
        letter-spacing: -0.02em;
    }

    .cshm-intro-title em {
        font-style: normal;
        color: #e84118;
    }

    .cshm-intro-lead {
        font-size: 15.5px;
        line-height: 1.78;
        color: #4b5563;
        margin: 0;
        max-width: 820px;
    }

    /* ---- Letter layout ---- */
    .cshm-letter {
        margin-bottom: 52px;
    }

    .cshm-letter-grid {
        display: grid;
        grid-template-columns: minmax(220px, 280px) 1fr;
        gap: 0;
        background: #ffffff;
        border-radius: 20px;
        overflow: hidden;
        border: 1px solid #e2e8f6;
        box-shadow: 0 14px 40px rgba(13, 27, 94, 0.07);
    }

    .cshm-letter-aside {
        background: linear-gradient(180deg, #0d1b5e 0%, #1a2f8a 50%, #243a9e 100%);
        color: #ffffff;
        padding: 32px 26px 36px;
        border-right: 4px solid #f5b800;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .cshm-portrait {
        width: 100px;
        height: 100px;
        border-radius: 50%;
        background: rgba(245, 184, 0, 0.18);
        border: 3px solid #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 40px;
        color: #f5b800;
        margin-bottom: 18px;
    }

    .cshm-portrait-caption {
        margin: 0 0 22px;
        display: flex;
        flex-direction: column;
        gap: 4px;
    }

    .cshm-portrait-role {
        font-size: 15px;
        font-weight: 800;
        color: #ffffff;
    }

    .cshm-portrait-dept {
        font-size: 12px;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.75);
        text-transform: uppercase;
        letter-spacing: 0.06em;
    }

    .cshm-aside-facts {
        list-style: none;
        margin: 0;
        padding: 0;
        width: 100%;
        text-align: left;
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .cshm-aside-facts li {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 13px;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.88);
        padding: 10px 12px;
        background: rgba(255, 255, 255, 0.06);
        border-radius: 10px;
        border: 1px solid rgba(255, 255, 255, 0.1);
    }

    .cshm-aside-facts i {
        color: #f5b800;
        width: 1.1em;
        flex-shrink: 0;
    }

    .cshm-letter-body {
        padding: 36px 40px 40px;
        min-width: 0;
    }

    .cshm-letter-content {
        font-size: 15.5px;
        line-height: 1.85;
        color: #374151;
    }

    .cshm-letter-content p {
        margin: 0 0 16px;
    }

    .cshm-letter-content p:last-of-type {
        margin-bottom: 0;
    }

    .cshm-letter-content a {
        color: #1a2f8a;
        font-weight: 700;
        text-decoration: underline;
        text-underline-offset: 2px;
    }

    .cshm-letter-content a:hover {
        color: #e84118;
    }

    .cshm-signature {
        margin-top: 28px;
        padding-top: 24px;
        border-top: 2px solid #eef1f8;
    }

    .cshm-signature-line {
        font-size: 14px;
        color: #6b7280;
        margin: 0 0 8px;
        font-style: italic;
    }

    .cshm-signature-name {
        font-size: 16px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 4px;
    }

    .cshm-signature-org {
        font-size: 13.5px;
        color: #6b7280;
        margin: 0;
    }

    /* ---- Priority cards ---- */
    .cshm-priorities {
        margin-bottom: 48px;
    }

    .cshm-section-head {
        text-align: center;
        max-width: 640px;
        margin: 0 auto 28px;
    }

    .cshm-section-title {
        font-size: clamp(22px, 2.6vw, 28px);
        font-weight: 800;
        color: #0d1b5e;
        margin: 0;
        line-height: 1.22;
    }

    .cshm-section-title em {
        font-style: normal;
        color: #e84118;
    }

    .cshm-priority-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }

    .cshm-priority-card {
        background: #ffffff;
        border: 1px solid #e2e8f6;
        border-radius: 16px;
        padding: 26px 22px;
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s;
    }

    .cshm-priority-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 16px 40px rgba(13, 27, 94, 0.1);
        border-color: rgba(245, 184, 0, 0.45);
    }

    .cshm-priority-icon {
        width: 48px;
        height: 48px;
        border-radius: 12px;
        background: linear-gradient(135deg, #f5b800, #e8a400);
        color: #0d1b5e;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        margin-bottom: 14px;
    }

    .cshm-priority-title {
        font-size: 16px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 8px;
    }

    .cshm-priority-text {
        font-size: 14px;
        color: #6b7280;
        line-height: 1.65;
        margin: 0;
    }

    /* ---- Navy band ---- */
    .cshm-band {
        margin-bottom: 44px;
        border-radius: 18px;
        overflow: hidden;
        background: linear-gradient(125deg, #0a1440 0%, #0d1b5e 45%, #1a2f8a 100%);
        position: relative;
    }

    .cshm-band::after {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at 80% 20%, rgba(245, 184, 0, 0.12) 0%, transparent 45%);
        pointer-events: none;
    }

    .cshm-band-inner {
        position: relative;
        z-index: 1;
        display: grid;
        grid-template-columns: 1.2fr 1fr;
        gap: 32px;
        align-items: center;
        padding: 36px 36px 38px;
    }

    .cshm-band-title {
        font-size: clamp(20px, 2.4vw, 26px);
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .cshm-band-title span {
        color: #f5b800;
    }

    .cshm-band-text {
        font-size: 15px;
        line-height: 1.75;
        color: rgba(255, 255, 255, 0.82);
        margin: 0;
    }

    .cshm-band-list {
        margin: 0;
        padding: 0;
        list-style: none;
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .cshm-band-list li {
        position: relative;
        padding-left: 22px;
        font-size: 14.5px;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.9);
        line-height: 1.5;
    }

    .cshm-band-list li::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0.55em;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: #f5b800;
        box-shadow: 0 0 0 2px rgba(245, 184, 0, 0.35);
    }

    /* ---- Quote ---- */
    .cshm-quote {
        margin: 0 0 44px;
        padding: 0;
        background: linear-gradient(135deg, #fff9f0 0%, #f0f4ff 55%, #ffffff 100%);
        border: 1px solid #e2e8f6;
        border-radius: 16px;
        border-left: 4px solid #e84118;
        overflow: hidden;
    }

    .cshm-quote blockquote {
        margin: 0;
        padding: 28px 32px 12px;
    }

    .cshm-quote blockquote p {
        margin: 0;
        font-size: clamp(17px, 2vw, 20px);
        font-weight: 600;
        font-style: italic;
        color: #0d1b5e;
        line-height: 1.55;
    }

    .cshm-quote-caption {
        padding: 0 32px 24px;
        font-size: 13px;
        font-weight: 700;
        color: #1a2f8a;
        text-transform: uppercase;
        letter-spacing: 0.06em;
    }

    /* ---- Related ---- */
    .cshm-related {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 22px 24px;
        background: #ffffff;
        border-radius: 14px;
        border: 1px dashed rgba(26, 47, 138, 0.28);
        margin-bottom: 40px;
    }

    .cshm-related-title {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0;
    }

    .cshm-related-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 10px 22px;
    }

    .cshm-related-list a {
        font-size: 14px;
        font-weight: 700;
        color: #1a2f8a;
        text-decoration: none;
        border-bottom: 2px solid transparent;
        transition: color 0.2s, border-color 0.2s;
    }

    .cshm-related-list a:hover {
        color: #e84118;
        border-bottom-color: #f5b800;
    }

    /* ---- CTA ---- */
    .cshm-cta {
        border-radius: 18px;
        background: #ffffff;
        border: 1px solid #e2e8f6;
        padding: 36px 32px;
        text-align: center;
        box-shadow: 0 10px 36px rgba(13, 27, 94, 0.06);
    }

    .cshm-cta-inner {
        max-width: 560px;
        margin: 0 auto;
    }

    .cshm-cta-title {
        font-size: clamp(21px, 2.5vw, 26px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 10px;
    }

    .cshm-cta-text {
        font-size: 15px;
        color: #6b7280;
        margin: 0 0 22px;
        line-height: 1.65;
    }

    .cshm-cta-btns {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
    }

    .cshm-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 13.5px;
        font-weight: 800;
        padding: 12px 22px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s, box-shadow 0.25s, background 0.2s, color 0.2s, border-color 0.2s;
    }

    .cshm-btn--gold {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 16px rgba(245, 184, 0, 0.35);
    }

    .cshm-btn--gold:hover {
        transform: translateY(-2px);
        color: #0a1440;
    }

    .cshm-btn--ghost {
        background: transparent;
        color: #0d1b5e;
        border: 2px solid #0d1b5e;
    }

    .cshm-btn--ghost:hover {
        background: #0d1b5e;
        color: #f5b800;
        border-color: #0d1b5e;
    }

    /* ---- Responsive ---- */
    @media (max-width: 900px) {
        .cshm-letter-grid {
            grid-template-columns: 1fr;
        }
        .cshm-letter-aside {
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: center;
            text-align: center;
            border-right: none;
            border-bottom: 4px solid #f5b800;
            padding: 28px 22px;
        }
        .cshm-portrait { margin-bottom: 0; }
        .cshm-portrait-caption { margin-bottom: 16px; width: 100%; }
        .cshm-aside-facts {
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: center;
        }
        .cshm-aside-facts li { flex: 1 1 200px; }
        .cshm-priority-grid { grid-template-columns: 1fr; }
        .cshm-band-inner { grid-template-columns: 1fr; }
    }

    @media (max-width: 640px) {
        .cshm-container { padding: 0 18px; }
        .cshm-intro { margin-top: -36px; }
        .cshm-intro-head { padding: 24px 20px; }
        .cshm-letter-body { padding: 26px 20px 28px; }
        .cshm-letter-aside {
            flex-direction: column;
            align-items: center;
        }
        .cshm-aside-facts { flex-direction: column; }
        .cshm-aside-facts li { flex: none; }
        .cshm-band-inner { padding: 28px 22px; }
        .cshm-quote blockquote { padding: 22px 20px 10px; }
        .cshm-quote-caption { padding: 0 20px 20px; }
        .cshm-related { flex-direction: column; align-items: flex-start; }
        .cshm-cta-btns { flex-direction: column; }
        .cshm-btn { width: 100%; }
    }

    /* ================================================================
    COMPUTER SCIENCE — FACULTY DETAILS PAGE (csff-*)
    Navy #0d1b5e · Blue #1a2f8a · Gold #f5b800 · Accent #e84118
    Clean academic layout — readable, responsive, SEO-friendly
    ================================================================ */

    .csff-page {
        background: #eef1f8;
    }

    .csff-wrap {
        position: relative;
        padding: 0 0 88px;
    }

    .csff-wrap::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 120px;
        background: linear-gradient(180deg, rgba(13, 27, 94, 0.04) 0%, transparent 100%);
        pointer-events: none;
    }

    .csff-inner {
        max-width: 1060px;
        margin: 0 auto;
        padding: 0 28px;
        position: relative;
    }

    /* ---- Shared labels ---- */
    .csff-kicker {
        display: inline-block;
        font-size: 10px;
        font-weight: 900;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: #1a2f8a;
        background: rgba(26, 47, 138, 0.08);
        padding: 5px 12px;
        border-radius: 6px;
        margin-bottom: 12px;
    }

    .csff-kicker--dark {
        color: #f5b800;
        background: rgba(13, 27, 94, 0.12);
    }

    /* ---- Intro card (overlaps hero) ---- */
    .csff-intro {
        margin-top: -52px;
        margin-bottom: 40px;
        position: relative;
        z-index: 2;
    }

    .csff-intro-card {
        background: #ffffff;
        border-radius: 20px;
        padding: 36px 40px 38px;
        border: 1px solid #e4e9f2;
        box-shadow: 0 20px 50px rgba(13, 27, 94, 0.1);
    }

    .csff-intro-title {
        font-size: clamp(22px, 2.8vw, 30px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.2;
        margin: 0 0 14px;
        letter-spacing: -0.02em;
    }

    .csff-intro-title em {
        font-style: normal;
        color: #e84118;
    }

    .csff-intro-text {
        font-size: 15.5px;
        line-height: 1.78;
        color: #4b5563;
        margin: 0;
        max-width: 780px;
    }

    /* ---- Highlight pills ---- */
    .csff-highlights {
        margin-bottom: 44px;
    }

    .csff-highlight-row {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 14px;
    }

    .csff-highlight-item {
        background: #ffffff;
        border: 1px solid #e2e8f6;
        border-radius: 14px;
        padding: 18px 16px;
        display: flex;
        flex-direction: column;
        gap: 6px;
        transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
    }

    .csff-highlight-item:hover {
        border-color: rgba(245, 184, 0, 0.55);
        box-shadow: 0 10px 28px rgba(13, 27, 94, 0.08);
        transform: translateY(-2px);
    }

    .csff-highlight-icon {
        width: 40px;
        height: 40px;
        border-radius: 10px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 17px;
        margin-bottom: 4px;
    }

    .csff-highlight-label {
        font-size: 13px;
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
    }

    .csff-highlight-text {
        font-size: 12.5px;
        color: #6b7280;
        line-height: 1.5;
    }

    /* ---- Faculty section ---- */
    .csff-faculty {
        margin-bottom: 48px;
    }

    .csff-section-head {
        text-align: center;
        max-width: 560px;
        margin: 0 auto 36px;
    }

    .csff-section-title {
        font-size: clamp(22px, 2.6vw, 28px);
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 10px;
        line-height: 1.2;
    }

    .csff-section-title span {
        background: linear-gradient(90deg, #1a2f8a, #f5b800);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .csff-section-lead {
        font-size: 15px;
        color: #6b7280;
        margin: 0;
        line-height: 1.65;
    }

    .csff-card-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 22px;
    }

    .csff-card {
        background: #ffffff;
        border: 1px solid #e2e8f6;
        border-radius: 18px;
        padding: 24px 22px 26px;
        box-shadow: 0 4px 20px rgba(13, 27, 94, 0.04);
        transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s ease, border-color 0.3s ease;
    }

    .csff-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 16px 40px rgba(13, 27, 94, 0.1);
        border-color: rgba(245, 184, 0, 0.4);
    }

    .csff-card-top {
        display: flex;
        align-items: flex-start;
        gap: 14px;
        margin-bottom: 14px;
    }

    .csff-card-avatar {
        flex-shrink: 0;
        width: 52px;
        height: 52px;
        border-radius: 14px;
        background: linear-gradient(145deg, #0d1b5e 0%, #1a2f8a 100%);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
    }

    .csff-card-head {
        min-width: 0;
    }

    .csff-card-name {
        font-size: 17px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 4px;
        line-height: 1.25;
    }

    .csff-card-role {
        font-size: 11.5px;
        font-weight: 800;
        color: #e84118;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        margin: 0;
    }

    .csff-card-qual {
        font-size: 13.5px;
        color: #6b7280;
        line-height: 1.55;
        margin: 0 0 14px;
    }

    .csff-card-tags {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
    }

    .csff-card-tags li {
        font-size: 11.5px;
        font-weight: 600;
        color: #1a2f8a;
        background: #f1f5f9;
        border: 1px solid #e2e8f6;
        padding: 5px 10px;
        border-radius: 999px;
    }

    /* ---- Leadership strip ---- */
    .csff-leadership {
        margin-top: 24px;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
        padding: 26px 28px;
        border-radius: 18px;
        background: linear-gradient(120deg, #0d1b5e 0%, #1a2f8a 48%, #243a9e 100%);
        border: 1px solid rgba(245, 184, 0, 0.35);
        box-shadow: 0 14px 40px rgba(13, 27, 94, 0.2);
    }

    .csff-leadership-main {
        display: flex;
        align-items: center;
        gap: 18px;
        flex: 1;
        min-width: 240px;
    }

    .csff-leadership-avatar {
        width: 56px;
        height: 56px;
        border-radius: 14px;
        background: linear-gradient(135deg, #f5b800, #e8a400);
        color: #0d1b5e;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
        flex-shrink: 0;
    }

    .csff-leadership-title {
        font-size: 18px;
        font-weight: 800;
        color: #ffffff;
        margin: 0 0 4px;
    }

    .csff-leadership-role {
        font-size: 12px;
        font-weight: 700;
        color: #f5b800;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin: 0 0 8px;
    }

    .csff-leadership-text {
        font-size: 14px;
        color: rgba(255, 255, 255, 0.82);
        line-height: 1.6;
        margin: 0;
        max-width: 520px;
    }

    .csff-leadership-action {
        flex-shrink: 0;
    }

    /* ---- Support band ---- */
    .csff-support {
        margin-bottom: 44px;
    }

    .csff-support-inner {
        display: grid;
        grid-template-columns: 1.15fr 1fr;
        gap: 32px;
        align-items: start;
        padding: 32px 32px 34px;
        border-radius: 18px;
        background: linear-gradient(135deg, #ffffff 0%, #f4f7fc 50%, #fff9f0 100%);
        border: 1px solid #e2e8f6;
    }

    .csff-support-title {
        font-size: clamp(20px, 2.3vw, 24px);
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .csff-support-title span {
        color: #e84118;
    }

    .csff-support-text {
        font-size: 15px;
        color: #4b5563;
        line-height: 1.75;
        margin: 0;
    }

    .csff-support-list {
        margin: 0;
        padding: 0;
        list-style: none;
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .csff-support-list li {
        position: relative;
        padding-left: 22px;
        font-size: 14.5px;
        font-weight: 600;
        color: #374151;
        line-height: 1.45;
    }

    .csff-support-list li::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0.55em;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: linear-gradient(135deg, #f5b800, #e84118);
    }

    /* ---- Bottom: contact + explore ---- */
    .csff-bottom {
        display: grid;
        grid-template-columns: 1.35fr 1fr;
        gap: 20px;
        margin-bottom: 28px;
    }

    .csff-contact {
        background: #ffffff;
        border: 1px solid #e2e8f6;
        border-radius: 16px;
        padding: 26px 26px 28px;
        border-left: 4px solid #f5b800;
        box-shadow: 0 6px 24px rgba(13, 27, 94, 0.05);
    }

    .csff-contact-title {
        font-size: 18px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 10px;
    }

    .csff-contact-text {
        font-size: 14.5px;
        color: #6b7280;
        line-height: 1.65;
        margin: 0 0 18px;
    }

    .csff-contact-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .csff-explore {
        background: #ffffff;
        border: 1px dashed rgba(26, 47, 138, 0.28);
        border-radius: 16px;
        padding: 22px 24px;
    }

    .csff-explore-title {
        font-size: 12px;
        font-weight: 900;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: #0d1b5e;
        margin: 0 0 14px;
        font-family: inherit;
    }

    .csff-explore-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .csff-explore-list a {
        display: block;
        font-size: 14px;
        font-weight: 700;
        color: #1a2f8a;
        text-decoration: none;
        padding: 10px 0;
        border-bottom: 1px solid #eef1f8;
        transition: color 0.2s ease, padding-left 0.2s ease;
    }

    .csff-explore-list li:last-child a {
        border-bottom: none;
    }

    .csff-explore-list a:hover {
        color: #e84118;
        padding-left: 4px;
    }

    /* ---- CTA ---- */
    .csff-cta {
        border-radius: 18px;
        overflow: hidden;
        background: linear-gradient(135deg, #0a1440 0%, #0d1b5e 40%, #1a2f8a 100%);
        padding: 36px 28px;
        text-align: center;
        position: relative;
    }

    .csff-cta::after {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at 50% 0%, rgba(245, 184, 0, 0.12) 0%, transparent 55%);
        pointer-events: none;
    }

    .csff-cta-inner {
        position: relative;
        z-index: 1;
        max-width: 480px;
        margin: 0 auto;
    }

    .csff-cta-title {
        font-size: clamp(21px, 2.5vw, 26px);
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 8px;
    }

    .csff-cta-text {
        font-size: 15px;
        color: rgba(255, 255, 255, 0.78);
        margin: 0 0 20px;
        line-height: 1.6;
    }

    .csff-cta-actions {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
    }

    /* ---- Buttons ---- */
    .csff-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 13.5px;
        font-weight: 800;
        padding: 12px 22px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s ease, box-shadow 0.25s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    }

    .csff-btn--primary {
        background: linear-gradient(135deg, #f5b800, #e8a400);
        color: #0d1b5e;
        box-shadow: 0 4px 16px rgba(245, 184, 0, 0.35);
    }

    .csff-btn--primary:hover {
        transform: translateY(-2px);
        color: #0a1440;
    }

    .csff-btn--gold {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 14px rgba(245, 184, 0, 0.35);
    }

    .csff-btn--gold:hover {
        transform: translateY(-2px);
        color: #0a1440;
    }

    .csff-btn--outline {
        background: rgba(255, 255, 255, 0.1);
        color: #ffffff;
        border: 2px solid rgba(255, 255, 255, 0.45);
    }

    .csff-btn--outline:hover {
        border-color: #f5b800;
        color: #f5b800;
    }

    .csff-contact .csff-btn--outline {
        background: transparent;
        color: #0d1b5e;
        border: 2px solid #0d1b5e;
    }

    .csff-contact .csff-btn--outline:hover {
        background: #0d1b5e;
        color: #f5b800;
        border-color: #0d1b5e;
    }

    .csff-btn--ghost {
        background: transparent;
        color: #ffffff;
        border: 2px solid rgba(255, 255, 255, 0.5);
    }

    .csff-btn--ghost:hover {
        background: rgba(255, 255, 255, 0.1);
        border-color: #f5b800;
        color: #f5b800;
    }

    @media (prefers-reduced-motion: reduce) {
        .csff-highlight-item:hover,
        .csff-card:hover,
        .csff-btn--primary:hover,
        .csff-btn--gold:hover {
            transform: none;
        }
    }

    /* ---- Responsive ---- */
    @media (max-width: 960px) {
        .csff-highlight-row {
            grid-template-columns: repeat(2, 1fr);
        }
        .csff-card-grid {
            grid-template-columns: 1fr;
        }
        .csff-support-inner {
            grid-template-columns: 1fr;
        }
        .csff-bottom {
            grid-template-columns: 1fr;
        }
        .csff-leadership {
            flex-direction: column;
            align-items: stretch;
            text-align: center;
        }
        .csff-leadership-main {
            flex-direction: column;
            text-align: center;
        }
        .csff-leadership-action {
            width: 100%;
        }
        .csff-leadership-action .csff-btn {
            width: 100%;
        }
    }

    @media (max-width: 640px) {
        .csff-inner {
            padding: 0 18px;
        }
        .csff-intro {
            margin-top: -40px;
        }
        .csff-intro-card {
            padding: 26px 22px;
        }
        .csff-highlight-row {
            grid-template-columns: 1fr;
        }
        .csff-contact-actions,
        .csff-cta-actions {
            flex-direction: column;
        }
        .csff-btn {
            width: 100%;
        }
    }

    /* ================================================================
    BUSINESS MANAGEMENT DEPARTMENT PAGE (bbmg-*)
    Navy #0d1b5e · Blue #1a2f8a · Gold #f5b800 · Accent #e84118
    ================================================================ */

    .bbmg-page {
        background: #eef1f8;
    }

    .bbmg-wrap {
        position: relative;
        padding: 0 0 88px;
    }

    .bbmg-wrap::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 120px;
        background: linear-gradient(180deg, rgba(13, 27, 94, 0.05) 0%, transparent 100%);
        pointer-events: none;
    }

    .bbmg-inner {
        max-width: 1060px;
        margin: 0 auto;
        padding: 0 28px;
        position: relative;
    }

    .bbmg-kicker {
        display: inline-block;
        font-size: 10px;
        font-weight: 900;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: #1a2f8a;
        background: rgba(26, 47, 138, 0.08);
        padding: 5px 12px;
        border-radius: 6px;
        margin-bottom: 12px;
    }

    .bbmg-kicker--outline {
        background: transparent;
        border: 1px solid rgba(26, 47, 138, 0.22);
    }

    .bbmg-kicker--dark {
        color: #f5b800;
        background: rgba(13, 27, 94, 0.15);
    }

    /* ---- Intro ---- */
    .bbmg-intro {
        margin-top: -52px;
        margin-bottom: 40px;
        position: relative;
        z-index: 2;
    }

    .bbmg-intro-card {
        background: #ffffff;
        border-radius: 20px;
        padding: 36px 40px 38px;
        border: 1px solid #e4e9f2;
        box-shadow: 0 20px 50px rgba(13, 27, 94, 0.1);
    }

    .bbmg-intro-title {
        font-size: clamp(22px, 2.8vw, 30px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.2;
        margin: 0 0 14px;
        letter-spacing: -0.02em;
    }

    .bbmg-intro-title em {
        font-style: normal;
        color: #e84118;
    }

    .bbmg-intro-text {
        font-size: 15.5px;
        line-height: 1.78;
        color: #4b5563;
        margin: 0;
        max-width: 800px;
    }

    /* ---- Highlights ---- */
    .bbmg-highlights {
        margin-bottom: 44px;
    }

    .bbmg-highlight-grid {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 16px;
    }

    .bbmg-highlight-card {
        background: #ffffff;
        border: 1px solid #e2e8f6;
        border-radius: 16px;
        padding: 20px 18px;
        display: flex;
        flex-direction: column;
        gap: 8px;
        transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.25s ease;
    }

    .bbmg-highlight-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 14px 36px rgba(13, 27, 94, 0.1);
        border-color: rgba(245, 184, 0, 0.45);
    }

    .bbmg-highlight-icon {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
    }

    .bbmg-highlight-title {
        font-size: 14px;
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
    }

    .bbmg-highlight-text {
        font-size: 12.5px;
        color: #6b7280;
        line-height: 1.55;
    }

    /* ---- Section heads ---- */
    .bbmg-section-head {
        margin-bottom: 24px;
    }

    .bbmg-section-head--center {
        text-align: center;
        max-width: 560px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 28px;
    }

    .bbmg-section-title {
        font-size: clamp(22px, 2.6vw, 28px);
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 10px;
        line-height: 1.2;
    }

    .bbmg-section-title span {
        background: linear-gradient(90deg, #1a2f8a, #f5b800);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .bbmg-section-title em {
        font-style: normal;
        color: #e84118;
    }

    .bbmg-section-lead {
        font-size: 15px;
        color: #6b7280;
        margin: 0;
        line-height: 1.65;
        max-width: 620px;
    }

    .bbmg-section-head--center .bbmg-section-lead {
        margin-left: auto;
        margin-right: auto;
    }

    /* ---- BBA track ---- */
    .bbmg-track {
        margin-bottom: 48px;
        background: #ffffff;
        border: 1px solid #e2e8f6;
        border-radius: 20px;
        padding: 36px 32px 32px;
        box-shadow: 0 8px 32px rgba(13, 27, 94, 0.05);
    }

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

    .bbmg-track-step {
        display: grid;
        grid-template-columns: 64px 1fr;
        gap: 18px;
        align-items: start;
        padding: 18px 0;
        border-bottom: 1px solid #eef1f8;
    }

    .bbmg-track-step:last-child {
        border-bottom: none;
    }

    .bbmg-track-body {
        min-width: 0;
    }

    .bbmg-track-badge {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 52px;
        height: 52px;
        border-radius: 14px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        color: #f5b800;
        font-size: 13px;
        font-weight: 900;
        letter-spacing: 0.04em;
    }

    .bbmg-track-title {
        font-size: 16px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 6px;
    }

    .bbmg-track-desc {
        font-size: 14.5px;
        color: #4b5563;
        line-height: 1.65;
        margin: 0;
    }

    .bbmg-footnote {
        margin: 18px 0 0;
        font-size: 13px;
        color: #6b7280;
    }

    .bbmg-footnote a {
        color: #1a2f8a;
        font-weight: 700;
        text-decoration: underline;
    }

    /* ---- Outcomes ---- */
    .bbmg-outcomes {
        margin-bottom: 44px;
    }

    .bbmg-outcome-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 18px;
    }

    .bbmg-outcome-card {
        background: linear-gradient(165deg, #ffffff 0%, #f6f8fc 100%);
        border: 1px solid #e2e8f6;
        border-radius: 16px;
        padding: 22px 18px;
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

    .bbmg-outcome-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 14px 36px rgba(13, 27, 94, 0.09);
        border-color: rgba(245, 184, 0, 0.4);
    }

    .bbmg-outcome-icon {
        width: 46px;
        height: 46px;
        border-radius: 12px;
        background: linear-gradient(135deg, #f5b800, #e8a400);
        color: #0d1b5e;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 19px;
        margin-bottom: 12px;
    }

    .bbmg-outcome-title {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 8px;
        line-height: 1.3;
    }

    .bbmg-outcome-text {
        font-size: 13px;
        color: #6b7280;
        line-height: 1.6;
        margin: 0;
    }

    /* ---- Career band ---- */
    .bbmg-career {
        margin-bottom: 40px;
        border-radius: 20px;
        overflow: hidden;
        background: linear-gradient(125deg, #0a1440 0%, #0d1b5e 45%, #1a2f8a 100%);
        position: relative;
    }

    .bbmg-career::after {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at 90% 20%, rgba(245, 184, 0, 0.12) 0%, transparent 45%);
        pointer-events: none;
    }

    .bbmg-career-inner {
        position: relative;
        z-index: 1;
        display: grid;
        grid-template-columns: 1.2fr 1fr;
        gap: 28px;
        align-items: center;
        padding: 34px 32px 36px;
    }

    .bbmg-career-title {
        font-size: clamp(20px, 2.4vw, 26px);
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .bbmg-career-title span {
        color: #f5b800;
    }

    .bbmg-career-text {
        font-size: 15px;
        line-height: 1.75;
        color: rgba(255, 255, 255, 0.82);
        margin: 0;
    }

    .bbmg-career-tags {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .bbmg-career-tags li {
        font-size: 13.5px;
        font-weight: 700;
        color: #0d1b5e;
        background: rgba(255, 255, 255, 0.95);
        border: 1px solid rgba(245, 184, 0, 0.35);
        padding: 10px 14px;
        border-radius: 999px;
    }

    /* ---- Related ---- */
    .bbmg-related {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 22px 24px;
        background: #ffffff;
        border-radius: 16px;
        border: 1px dashed rgba(26, 47, 138, 0.28);
        margin-bottom: 28px;
    }

    .bbmg-related-title {
        font-size: 14px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0;
    }

    .bbmg-related-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 10px 20px;
    }

    .bbmg-related-list a {
        font-size: 14px;
        font-weight: 700;
        color: #1a2f8a;
        text-decoration: none;
        border-bottom: 2px solid transparent;
        transition: color 0.2s ease, border-color 0.2s ease;
    }

    .bbmg-related-list a:hover {
        color: #e84118;
        border-bottom-color: #f5b800;
    }

    /* ---- CTA ---- */
    .bbmg-cta {
        border-radius: 18px;
        background: linear-gradient(135deg, #fff9f0 0%, #ffffff 45%, #f0f4ff 100%);
        border: 1px solid #e2e8f6;
        padding: 36px 28px;
        text-align: center;
        box-shadow: 0 10px 36px rgba(13, 27, 94, 0.06);
    }

    .bbmg-cta-inner {
        max-width: 520px;
        margin: 0 auto;
    }

    .bbmg-cta-title {
        font-size: clamp(21px, 2.5vw, 26px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 10px;
    }

    .bbmg-cta-text {
        font-size: 15px;
        color: #6b7280;
        margin: 0 0 20px;
        line-height: 1.65;
    }

    .bbmg-cta-actions {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
    }

    .bbmg-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 13.5px;
        font-weight: 800;
        padding: 12px 22px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s ease, box-shadow 0.25s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    }

    .bbmg-btn--gold {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 16px rgba(245, 184, 0, 0.35);
    }

    .bbmg-btn--gold:hover {
        transform: translateY(-2px);
        color: #0a1440;
    }

    .bbmg-btn--ghost {
        background: transparent;
        color: #0d1b5e;
        border: 2px solid #0d1b5e;
    }

    .bbmg-btn--ghost:hover {
        background: #0d1b5e;
        color: #f5b800;
        border-color: #0d1b5e;
    }

    @media (prefers-reduced-motion: reduce) {
        .bbmg-highlight-card:hover,
        .bbmg-outcome-card:hover,
        .bbmg-btn--gold:hover {
            transform: none;
        }
    }

    @media (max-width: 960px) {
        .bbmg-highlight-grid {
            grid-template-columns: repeat(2, 1fr);
        }
        .bbmg-outcome-grid {
            grid-template-columns: repeat(2, 1fr);
        }
        .bbmg-career-inner {
            grid-template-columns: 1fr;
        }
    }

    @media (max-width: 640px) {
        .bbmg-inner {
            padding: 0 18px;
        }
        .bbmg-intro {
            margin-top: -40px;
        }
        .bbmg-intro-card {
            padding: 26px 22px;
        }
        .bbmg-highlight-grid,
        .bbmg-outcome-grid {
            grid-template-columns: 1fr;
        }
        .bbmg-track {
            padding: 28px 20px;
        }
        .bbmg-track-step {
            grid-template-columns: 52px 1fr;
            gap: 14px;
        }
        .bbmg-track-badge {
            width: 46px;
            height: 46px;
            font-size: 11px;
        }
        .bbmg-related {
            flex-direction: column;
            align-items: flex-start;
        }
        .bbmg-cta-actions {
            flex-direction: column;
        }
        .bbmg-btn {
            width: 100%;
        }
    }

    /* ================================================================
    SOCIAL WORK DEPARTMENT PAGE (swdp-*)
    Navy #0d1b5e · Blue #1a2f8a · Gold #f5b800 · Accent #e84118
    ================================================================ */

    .swdp-page {
        background: #eef1f8;
    }

    .swdp-wrap {
        position: relative;
        padding: 0 0 88px;
    }

    .swdp-wrap::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 120px;
        background: linear-gradient(180deg, rgba(13, 27, 94, 0.05) 0%, transparent 100%);
        pointer-events: none;
    }

    .swdp-inner {
        max-width: 1060px;
        margin: 0 auto;
        padding: 0 28px;
        position: relative;
    }

    .swdp-kicker {
        display: inline-block;
        font-size: 10px;
        font-weight: 900;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: #1a2f8a;
        background: rgba(26, 47, 138, 0.08);
        padding: 5px 12px;
        border-radius: 6px;
        margin-bottom: 12px;
    }

    .swdp-kicker--outline {
        background: transparent;
        border: 1px solid rgba(26, 47, 138, 0.22);
    }

    .swdp-kicker--dark {
        color: #f5b800;
        background: rgba(13, 27, 94, 0.15);
    }

    /* ---- Intro ---- */
    .swdp-intro {
        margin-top: -52px;
        margin-bottom: 40px;
        position: relative;
        z-index: 2;
    }

    .swdp-intro-card {
        background: #ffffff;
        border-radius: 20px;
        padding: 36px 40px 38px;
        border: 1px solid #e4e9f2;
        box-shadow: 0 20px 50px rgba(13, 27, 94, 0.1);
    }

    .swdp-intro-title {
        font-size: clamp(22px, 2.8vw, 30px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.2;
        margin: 0 0 14px;
        letter-spacing: -0.02em;
    }

    .swdp-intro-title em {
        font-style: normal;
        color: #e84118;
    }

    .swdp-intro-text {
        font-size: 15.5px;
        line-height: 1.78;
        color: #4b5563;
        margin: 0;
        max-width: 820px;
    }

    /* ---- Pillars ---- */
    .swdp-pillars {
        margin-bottom: 44px;
    }

    .swdp-pillar-grid {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 16px;
    }

    .swdp-pillar-card {
        background: #ffffff;
        border: 1px solid #e2e8f6;
        border-radius: 16px;
        padding: 22px 18px;
        display: flex;
        flex-direction: column;
        gap: 10px;
        text-align: center;
        transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.25s ease;
    }

    .swdp-pillar-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 14px 36px rgba(13, 27, 94, 0.1);
        border-color: rgba(245, 184, 0, 0.45);
    }

    .swdp-pillar-icon {
        width: 48px;
        height: 48px;
        margin: 0 auto;
        border-radius: 14px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
    }

    .swdp-pillar-title {
        font-size: 14px;
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
    }

    .swdp-pillar-text {
        font-size: 12.5px;
        color: #6b7280;
        line-height: 1.55;
    }

    /* ---- Section heads ---- */
    .swdp-section-head {
        margin-bottom: 22px;
    }

    .swdp-section-head--center {
        text-align: center;
        max-width: 580px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 28px;
    }

    .swdp-section-title {
        font-size: clamp(22px, 2.6vw, 28px);
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 10px;
        line-height: 1.2;
    }

    .swdp-section-title span {
        background: linear-gradient(90deg, #1a2f8a, #f5b800);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .swdp-section-title em {
        font-style: normal;
        color: #e84118;
    }

    .swdp-section-lead {
        font-size: 15px;
        color: #6b7280;
        margin: 0;
        line-height: 1.65;
        max-width: 640px;
    }

    .swdp-section-head--center .swdp-section-lead {
        margin-left: auto;
        margin-right: auto;
    }

    /* ---- Programme cards ---- */
    .swdp-programmes {
        margin-bottom: 44px;
    }

    .swdp-prog-cards {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .swdp-prog-card {
        background: linear-gradient(165deg, #ffffff 0%, #f6f8fc 100%);
        border: 1px solid #e2e8f6;
        border-radius: 18px;
        padding: 28px 26px 26px;
        display: flex;
        flex-direction: column;
        gap: 12px;
        transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.25s ease;
    }

    .swdp-prog-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 16px 40px rgba(13, 27, 94, 0.1);
        border-color: rgba(245, 184, 0, 0.4);
    }

    .swdp-prog-card--accent {
        background: linear-gradient(145deg, #fff9f0 0%, #ffffff 55%, #f0f4ff 100%);
        border-color: rgba(232, 65, 24, 0.2);
    }

    .swdp-prog-name {
        font-size: 18px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0;
    }

    .swdp-prog-desc {
        font-size: 14.5px;
        color: #5b6470;
        line-height: 1.7;
        margin: 0;
        flex: 1;
    }

    .swdp-prog-link {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 14px;
        font-weight: 800;
        color: #1a2f8a;
        text-decoration: none;
        margin-top: 4px;
        transition: color 0.2s ease, gap 0.25s ease;
    }

    .swdp-prog-link:hover {
        color: #e84118;
        gap: 12px;
    }

    /* ---- Field work band ---- */
    .swdp-field {
        margin-bottom: 44px;
        border-radius: 20px;
        overflow: hidden;
        background: linear-gradient(135deg, #ffffff 0%, #f4f7fd 40%, #fff9f0 100%);
        border: 1px solid #e2e8f6;
        box-shadow: 0 10px 36px rgba(13, 27, 94, 0.06);
    }

    .swdp-field-inner {
        display: grid;
        grid-template-columns: 1.15fr 1fr;
        gap: 28px;
        align-items: start;
        padding: 32px 32px 34px;
    }

    .swdp-field-title {
        font-size: clamp(20px, 2.4vw, 26px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 12px;
        line-height: 1.2;
    }

    .swdp-field-title span {
        color: #e84118;
    }

    .swdp-field-text {
        font-size: 15px;
        color: #4b5563;
        line-height: 1.75;
        margin: 0;
    }

    .swdp-field-steps {
        margin: 0;
        padding: 0;
        list-style: none;
        display: flex;
        flex-direction: column;
        gap: 12px;
        counter-reset: swdp-step;
    }

    .swdp-field-steps li {
        position: relative;
        padding: 12px 14px 12px 44px;
        background: #ffffff;
        border: 1px solid #e8edf5;
        border-radius: 12px;
        font-size: 14px;
        font-weight: 600;
        color: #374151;
        line-height: 1.45;
    }

    .swdp-field-steps li::before {
        counter-increment: swdp-step;
        content: counter(swdp-step);
        position: absolute;
        left: 12px;
        top: 50%;
        transform: translateY(-50%);
        width: 26px;
        height: 26px;
        border-radius: 8px;
        background: linear-gradient(135deg, #0d1b5e, #1a2f8a);
        color: #f5b800;
        font-size: 11px;
        font-weight: 900;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* ---- Outcomes ---- */
    .swdp-outcomes {
        margin-bottom: 40px;
    }

    .swdp-outcome-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 18px;
    }

    .swdp-outcome-card {
        background: #ffffff;
        border: 1px solid #e2e8f6;
        border-radius: 16px;
        padding: 22px 18px;
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

    .swdp-outcome-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 14px 36px rgba(13, 27, 94, 0.09);
        border-color: rgba(245, 184, 0, 0.4);
    }

    .swdp-outcome-icon {
        width: 46px;
        height: 46px;
        border-radius: 12px;
        background: linear-gradient(135deg, #f5b800, #e8a400);
        color: #0d1b5e;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 19px;
        margin-bottom: 12px;
    }

    .swdp-outcome-title {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 8px;
        line-height: 1.3;
    }

    .swdp-outcome-text {
        font-size: 13px;
        color: #6b7280;
        line-height: 1.6;
        margin: 0;
    }

    /* ---- Related ---- */
    .swdp-related {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 22px 24px;
        background: #ffffff;
        border-radius: 16px;
        border: 1px dashed rgba(26, 47, 138, 0.28);
        margin-bottom: 28px;
    }

    .swdp-related-title {
        font-size: 14px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0;
    }

    .swdp-related-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 10px 20px;
    }

    .swdp-related-list a {
        font-size: 14px;
        font-weight: 700;
        color: #1a2f8a;
        text-decoration: none;
        border-bottom: 2px solid transparent;
        transition: color 0.2s ease, border-color 0.2s ease;
    }

    .swdp-related-list a:hover {
        color: #e84118;
        border-bottom-color: #f5b800;
    }

    /* ---- CTA ---- */
    .swdp-cta {
        border-radius: 18px;
        background: linear-gradient(125deg, #0a1440 0%, #0d1b5e 48%, #1a2f8a 100%);
        padding: 36px 28px;
        text-align: center;
        position: relative;
        overflow: hidden;
    }

    .swdp-cta::after {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at 30% 0%, rgba(245, 184, 0, 0.12) 0%, transparent 50%);
        pointer-events: none;
    }

    .swdp-cta-inner {
        position: relative;
        z-index: 1;
        max-width: 520px;
        margin: 0 auto;
    }

    .swdp-cta-title {
        font-size: clamp(21px, 2.5vw, 26px);
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 10px;
    }

    .swdp-cta-text {
        font-size: 15px;
        color: rgba(255, 255, 255, 0.78);
        margin: 0 0 20px;
        line-height: 1.65;
    }

    .swdp-cta-actions {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
    }

    .swdp-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 13.5px;
        font-weight: 800;
        padding: 12px 22px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s ease, box-shadow 0.25s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    }

    .swdp-btn--gold {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 16px rgba(245, 184, 0, 0.35);
    }

    .swdp-btn--gold:hover {
        transform: translateY(-2px);
        color: #0a1440;
    }

    .swdp-btn--ghost {
        background: transparent;
        color: #ffffff;
        border: 2px solid rgba(255, 255, 255, 0.5);
    }

    .swdp-btn--ghost:hover {
        border-color: #f5b800;
        color: #f5b800;
    }

    @media (prefers-reduced-motion: reduce) {
        .swdp-pillar-card:hover,
        .swdp-prog-card:hover,
        .swdp-outcome-card:hover,
        .swdp-btn--gold:hover {
            transform: none;
        }
    }

    @media (max-width: 960px) {
        .swdp-pillar-grid {
            grid-template-columns: repeat(2, 1fr);
        }
        .swdp-prog-cards {
            grid-template-columns: 1fr;
        }
        .swdp-field-inner {
            grid-template-columns: 1fr;
        }
        .swdp-outcome-grid {
            grid-template-columns: repeat(2, 1fr);
        }
    }

    @media (max-width: 640px) {
        .swdp-inner {
            padding: 0 18px;
        }
        .swdp-intro {
            margin-top: -40px;
        }
        .swdp-intro-card {
            padding: 26px 22px;
        }
        .swdp-pillar-grid,
        .swdp-outcome-grid {
            grid-template-columns: 1fr;
        }
        .swdp-related {
            flex-direction: column;
            align-items: flex-start;
        }
        .swdp-cta-actions {
            flex-direction: column;
        }
        .swdp-btn {
            width: 100%;
        }
    }

    /* ================================================================
    CAMPUS GALLERY PAGE (glyn-*) - split intro + tabs + masonry
    Navy #0d1b5e | Blue #1a2f8a | Gold #f5b800 | Accent #e84118
    ================================================================ */

    .main-content.glyn-page {
        background: #eef1f8;
    }

    .glyn-page .page-hero-inner {
        padding-bottom: 74px;
    }

    .glyn-page .page-hero-subtitle {
        max-width: 720px;
    }

    .glyn-wrap {
        position: relative;
        /* padding: 0 0 96px; */
    }

    .glyn-wrap::before {
        content: '';
        position: absolute;
        inset: 0;
        background:
            radial-gradient(800px 340px at 15% 0%, rgba(245, 184, 0, 0.18) 0%, transparent 55%),
            radial-gradient(900px 420px at 90% 10%, rgba(26, 47, 138, 0.10) 0%, transparent 60%),
            linear-gradient(180deg, rgba(13, 27, 94, 0.06) 0%, transparent 22%);
        pointer-events: none;
    }

    .glyn-container {
        max-width: 1180px;
        margin: 0 auto;
        padding: 0 28px;
        position: relative;
    }

    /* ---- Intro split ---- */
    .glyn-intro {
        margin-top: -28px;
        margin-bottom: 26px;
        position: relative;
        z-index: 2;
    }

    .glyn-intro-grid {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 520px);
        gap: 22px 34px;
        padding: 34px 36px;
        border-radius: 24px;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(248, 250, 252, 0.98) 100%);
        border: 1px solid rgba(226, 232, 246, 0.95);
        box-shadow: 0 28px 70px rgba(13, 27, 94, 0.12);
        overflow: hidden;
    }

    .glyn-intro-grid::before {
        content: '';
        position: absolute;
        inset: 0;
        background:
            linear-gradient(135deg, rgba(245, 184, 0, 0.12) 0%, rgba(26, 47, 138, 0.06) 45%, rgba(232, 65, 24, 0.08) 100%);
        pointer-events: none;
    }

    .glyn-intro-copy,
    .glyn-collage {
        position: relative;
        z-index: 1;
    }

    .glyn-kicker {
        display: inline-block;
        font-size: 10px;
        font-weight: 900;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        color: #0d1b5e;
        background: linear-gradient(135deg, rgba(245, 184, 0, 0.30), rgba(26, 47, 138, 0.08));
        border: 1px solid rgba(245, 184, 0, 0.25);
        padding: 7px 14px;
        border-radius: 999px;
        margin-bottom: 14px;
    }

    .glyn-title {
        font-size: clamp(22px, 3vw, 34px);
        font-weight: 900;
        color: #0d1b5e;
        line-height: 1.12;
        margin: 0 0 12px;
        letter-spacing: -0.03em;
    }

    .glyn-title span {
        background: linear-gradient(90deg, #e84118 0%, #f5b800 55%, #1a2f8a 100%);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .glyn-lead {
        font-size: 15.5px;
        line-height: 1.78;
        color: #4b5563;
        margin: 0 0 18px;
        max-width: 720px;
    }

    .glyn-metrics {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .glyn-metric {
        display: inline-flex;
        align-items: baseline;
        gap: 10px;
        padding: 10px 12px;
        border-radius: 14px;
        border: 1px solid rgba(226, 232, 246, 0.95);
        background: rgba(255, 255, 255, 0.7);
        backdrop-filter: blur(6px);
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

    .glyn-metric:hover {
        transform: translateY(-2px);
        box-shadow: 0 16px 38px rgba(13, 27, 94, 0.12);
        border-color: rgba(245, 184, 0, 0.35);
    }

    .glyn-metric-num {
        font-size: 18px;
        font-weight: 900;
        color: #1a2f8a;
        letter-spacing: -0.02em;
    }

    .glyn-metric-lbl {
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: #6b7280;
    }

    /* ---- Featured collage ---- */
    .glyn-collage {
        display: grid;
        grid-template-columns: 1.25fr 1fr;
        grid-auto-rows: 158px;
        gap: 12px;
    }

    .glyn-collage-item {
        margin: 0;
        border-radius: 18px;
        overflow: hidden;
        border: 1px solid rgba(226, 232, 246, 0.95);
        box-shadow: 0 14px 40px rgba(13, 27, 94, 0.10);
        background: #ffffff;
        position: relative;
    }

    .glyn-collage-item--main {
        grid-row: span 2;
    }

    .glyn-collage-link {
        display: block;
        height: 100%;
        text-decoration: none;
        color: inherit;
    }

    .glyn-collage-link img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transform: scale(1.01);
        transition: transform 0.5s ease, filter 0.35s ease;
    }

    .glyn-collage-link:hover img {
        transform: scale(1.05);
        filter: saturate(1.03) contrast(1.02);
    }

    .glyn-collage-cap {
        position: absolute;
        left: 12px;
        right: 12px;
        bottom: 12px;
        margin: 0;
        padding: 10px 12px;
        border-radius: 14px;
        font-size: 13px;
        font-weight: 800;
        color: #0a1440;
        background: rgba(255, 255, 255, 0.92);
        box-shadow: 0 10px 26px rgba(13, 27, 94, 0.18);
    }

    /* ---- Tabs + panels ---- */
    .glyn-gallery {
        margin-bottom: 26px;
    }

    .glyn-tabs {
        position: relative;
    }

    .glyn-tab {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    .glyn-pill {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 12.5px;
        font-weight: 900;
        letter-spacing: 0.02em;
        color: #1a2f8a;
        padding: 10px 18px;
        border-radius: 999px;
        border: 1px solid rgba(226, 232, 246, 0.95);
        background: rgba(255, 255, 255, 0.9);
        box-shadow: 0 10px 26px rgba(13, 27, 94, 0.06);
        cursor: pointer;
        user-select: none;
        transition: transform 0.2s ease, box-shadow 0.25s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
        margin: 0 10px 10px 0;
    }

    .glyn-pill:hover {
        transform: translateY(-1px);
        border-color: rgba(245, 184, 0, 0.35);
        background: linear-gradient(135deg, rgba(245, 184, 0, 0.18) 0%, rgba(26, 47, 138, 0.06) 75%, rgba(232, 65, 24, 0.06) 100%);
        color: #0d1b5e;
    }

    .glyn-tab:focus-visible + .glyn-pill {
        outline: 3px solid rgba(245, 184, 0, 0.65);
        outline-offset: 3px;
    }

    .glyn-tab:checked + .glyn-pill {
        color: #0a1440;
        border-color: rgba(245, 184, 0, 0.55);
        background: linear-gradient(135deg, rgba(245, 184, 0, 0.38) 0%, rgba(255, 255, 255, 0.88) 40%, rgba(26, 47, 138, 0.08) 100%);
        box-shadow: 0 18px 40px rgba(13, 27, 94, 0.12);
    }

    .glyn-panels {
        margin-top: 6px;
        padding-top: 14px;
        border-top: 1px solid rgba(226, 232, 246, 0.9);
    }

    .glyn-panel {
        display: none;
        animation: glynFadeIn 0.28s ease both;
    }

    #glyn-tab-all:checked ~ .glyn-panels #glyn-panel-all,
    #glyn-tab-campus:checked ~ .glyn-panels #glyn-panel-campus,
    #glyn-tab-classrooms:checked ~ .glyn-panels #glyn-panel-classrooms,
    #glyn-tab-events:checked ~ .glyn-panels #glyn-panel-events,
    #glyn-tab-sports:checked ~ .glyn-panels #glyn-panel-sports,
    #glyn-tab-facilities:checked ~ .glyn-panels #glyn-panel-facilities {
        display: block;
    }

    /* Alumni gallery (alumni-gallery.php) — category slugs from admin differ from campus gallery */
    .alg-page .glyn-tabs:has(#glyn-tab-all:checked) #glyn-panel-all,
    .alg-page .glyn-tabs:has(#glyn-tab-activites:checked) #glyn-panel-activites,
    .alg-page .glyn-tabs:has(#glyn-tab-campus:checked) #glyn-panel-campus,
    .alg-page .glyn-tabs:has(#glyn-tab-events:checked) #glyn-panel-events,
    .alg-page .glyn-tabs:has(#glyn-tab-classroom:checked) #glyn-panel-classroom,
    .alg-page .glyn-tabs:has(#glyn-tab-facilities:checked) #glyn-panel-facilities {
        display: block;
    }

    /* Default visible panel when JS/CSS :has() is unavailable */
    .alg-page .glyn-panels > #glyn-panel-all {
        display: block;
    }

    /* Main gallery page — alumni category slugs from aams_db / admin */
    .glyn-page .glyn-tabs:has(#glyn-tab-all:checked) #glyn-panel-all,
    .glyn-page .glyn-tabs:has(#glyn-tab-activites:checked) #glyn-panel-activites,
    .glyn-page .glyn-tabs:has(#glyn-tab-campus:checked) #glyn-panel-campus,
    .glyn-page .glyn-tabs:has(#glyn-tab-events:checked) #glyn-panel-events,
    .glyn-page .glyn-tabs:has(#glyn-tab-classroom:checked) #glyn-panel-classroom,
    .glyn-page .glyn-tabs:has(#glyn-tab-facilities:checked) #glyn-panel-facilities {
        display: block;
    }

    .glyn-page .glyn-panels > #glyn-panel-all {
        display: block;
    }

    .alg-gallery-empty {
        text-align: center;
        padding: 48px 24px;
        background: #fff;
        border-radius: 16px;
        border: 1px dashed #cbd5e1;
        color: #475569;
        max-width: 560px;
        margin: 0 auto;
    }

    .alg-gallery-empty i {
        font-size: 2.25rem;
        color: #94a3b8;
        margin-bottom: 12px;
    }

    .alg-gallery-empty p {
        margin: 0 0 16px;
        line-height: 1.6;
    }

    .glyn-panel-head {
        display: flex;
        flex-direction: column;
        gap: 6px;
        margin: 0 0 16px;
    }

    .glyn-panel-title {
        font-size: clamp(18px, 2.1vw, 22px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0;
    }

    .glyn-panel-sub {
        margin: 0;
        font-size: 14px;
        color: #6b7280;
        line-height: 1.55;
        max-width: 720px;
    }

    /* ---- Masonry (CSS columns) ---- */
    .glyn-masonry {
        columns: 3;
        column-gap: 18px;
    }

    .glyn-card {
        margin: 0 0 18px;
        break-inside: avoid;
        border-radius: 18px;
        overflow: hidden;
        background: #ffffff;
        border: 1px solid rgba(226, 232, 246, 0.95);
        box-shadow: 0 10px 28px rgba(13, 27, 94, 0.07);
        transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.28s ease, border-color 0.25s ease;
    }

    .glyn-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 22px 50px rgba(13, 27, 94, 0.12);
        border-color: rgba(245, 184, 0, 0.40);
    }

    .glyn-card-link {
        display: block;
        text-decoration: none;
        color: inherit;
    }

    .glyn-card-link img {
        width: 100%;
        height: auto;
        display: block;
        transition: transform 0.45s ease;
    }

    .glyn-card:hover img {
        transform: scale(1.03);
    }

    .glyn-card-cap {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        justify-content: space-between;
        gap: 8px 12px;
        padding: 14px 16px 16px;
        background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    }

    .glyn-card-title {
        font-size: 14.5px;
        font-weight: 900;
        color: #0d1b5e;
    }

    .glyn-card-tag {
        font-size: 10px;
        font-weight: 800;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        color: #e84118;
    }

    /* ---- Note ---- */
    .glyn-note {
        margin-bottom: 28px;
        padding: 18px 22px;
        border-radius: 16px;
        background: rgba(26, 47, 138, 0.05);
        border: 1px solid rgba(26, 47, 138, 0.12);
    }

    .glyn-note-text {
        margin: 0;
        font-size: 14.5px;
        color: #4b5563;
        line-height: 1.7;
    }

    .glyn-note-text a {
        color: #1a2f8a;
        font-weight: 800;
        text-decoration: underline;
    }

    .glyn-note-text a:hover {
        color: #e84118;
    }

    /* ---- CTA ---- */
    .glyn-cta {
        border-radius: 24px;
        overflow: hidden;
        background: linear-gradient(125deg, #0a1440 0%, #0d1b5e 45%, #1a2f8a 100%);
        position: relative;
    }

    .glyn-cta::after {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at 30% 0%, rgba(245, 184, 0, 0.18) 0%, transparent 55%);
        pointer-events: none;
    }

    .glyn-cta-inner {
        position: relative;
        z-index: 1;
        padding: 34px 28px;
        text-align: center;
        max-width: 720px;
        margin: 0 auto;
    }

    .glyn-cta-title {
        font-size: clamp(22px, 2.6vw, 30px);
        font-weight: 900;
        color: #ffffff;
        margin: 0 0 10px;
    }

    .glyn-cta-text {
        margin: 0 0 18px;
        font-size: 15px;
        color: rgba(255, 255, 255, 0.80);
        line-height: 1.6;
    }

    .glyn-cta-actions {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
    }

    .glyn-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 13.5px;
        font-weight: 900;
        padding: 12px 20px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s ease, box-shadow 0.25s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    }

    .glyn-btn--primary {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 6px 18px rgba(245, 184, 0, 0.35);
    }

    .glyn-btn--primary:hover {
        transform: translateY(-2px);
        color: #0a1440;
    }

    .glyn-btn--ghost {
        background: transparent;
        color: #ffffff;
        border: 2px solid rgba(255, 255, 255, 0.45);
    }

    .glyn-btn--ghost:hover {
        border-color: #f5b800;
        color: #f5b800;
    }

    @media (prefers-reduced-motion: reduce) {
        .glyn-panel {
            animation: none;
        }
        .glyn-metric:hover,
        .glyn-pill:hover,
        .glyn-btn--primary:hover,
        .glyn-card:hover {
            transform: none;
        }
    }

    @media (max-width: 980px) {
        .glyn-intro-grid {
            grid-template-columns: 1fr;
        }
        .glyn-collage {
            grid-template-columns: 1fr 1fr;
            grid-auto-rows: 170px;
        }
        .glyn-masonry {
            columns: 2;
        }
    }

    @media (max-width: 640px) {
        .glyn-container {
            padding: 0 18px;
        }
        .glyn-intro {
            margin-top: -16px;
        }
        .glyn-intro-grid {
            padding: 26px 22px;
        }
        .glyn-page .page-hero-inner {
            padding-bottom: 54px;
        }
        .glyn-collage {
            grid-template-columns: 1fr;
            grid-auto-rows: 180px;
        }
        .glyn-collage-item--main {
            grid-row: auto;
        }
        .glyn-masonry {
            columns: 1;
        }
        .glyn-pill {
            margin-right: 8px;
        }
        .glyn-cta-actions {
            flex-direction: column;
        }
        .glyn-btn {
            width: 100%;
        }
    }

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

    /* ================================================================
    BSW – BACHELOR OF SOCIAL WORK PROGRAMME PAGE
    Brand: Navy #0d1b5e · Blue #1a2a6c · Gold #f5b800
    ================================================================ */

    .bsw-page { background-color: #f4f6f9; }

    .bsw-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
    }

    /* ---- Hero ---- */
    .bsw-hero {
        background:
            linear-gradient(135deg, rgba(13,27,94,0.95) 0%, rgba(26,42,108,0.92) 52%, rgba(57,73,171,0.88) 100%),
            linear-gradient(to bottom right, #0d1b5e, #3949ab);
        background-blend-mode: multiply, normal;
    }

    .bsw-hero-badge {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(245,184,0,0.18);
        border: 1px solid rgba(245,184,0,0.45);
        color: #f5b800;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        padding: 6px 16px;
        border-radius: 999px;
        margin-bottom: 18px;
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
    }

    .bsw-hero-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 14px;
        margin-top: 28px;
    }

    .bsw-hero-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 14.5px;
        font-weight: 700;
        padding: 13px 28px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.22s ease, box-shadow 0.22s ease, color 0.22s ease;
    }

    .bsw-hero-btn--primary {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 6px 20px rgba(245,184,0,0.40);
    }

    .bsw-hero-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 28px rgba(245,184,0,0.55);
        color: #0a1440;
    }

    .bsw-hero-btn--ghost {
        background: transparent;
        color: #fff;
        border: 2px solid rgba(255,255,255,0.50);
    }

    .bsw-hero-btn--ghost:hover {
        border-color: #f5b800;
        color: #f5b800;
        transform: translateY(-2px);
    }

    /* ---- Stats Strip ---- */
    .bsw-strip {
        background: #fff;
        border-top: 3px solid #f5b800;
        box-shadow: 0 4px 22px rgba(13,27,94,0.08);
    }

    .bsw-strip-list {
        list-style: none;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        margin: 0;
        padding: 0;
    }

    .bsw-strip-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 6px;
        padding: 28px 16px;
        border-right: 1px solid #e8ecf4;
        text-align: center;
        transition: background 0.2s ease;
    }

    .bsw-strip-item:last-child { border-right: none; }
    .bsw-strip-item:hover { background: #f0f4ff; }

    .bsw-strip-icon {
        width: 52px;
        height: 52px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #3949ab);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        box-shadow: 0 4px 14px rgba(26,42,108,0.22);
    }

    .bsw-strip-val {
        font-size: 17px;
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.2;
    }

    .bsw-strip-lbl {
        font-size: 12px;
        color: #5a6a8a;
        font-weight: 500;
    }

    /* ---- Sections ---- */
    .bsw-section { padding: 72px 0; }

    .bsw-section-head { margin-bottom: 44px; max-width: 700px; }

    .bsw-section-head--center {
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }

    /* ---- Tags ---- */
    .bsw-tag {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(26,42,108,0.08);
        color: #1a2a6c;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        padding: 5px 14px;
        border-radius: 999px;
        margin-bottom: 14px;
    }

    .bsw-tag--dark  { background: rgba(13,27,94,0.10); color: #0d1b5e; }
    .bsw-tag--light {
        background: rgba(255,255,255,0.14);
        color: rgba(255,255,255,0.95);
        border: 1px solid rgba(255,255,255,0.30);
    }

    /* ---- Typography ---- */
    .bsw-title {
        font-size: clamp(22px, 3vw, 30px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
        margin: 0 0 16px;
    }

    .bsw-accent        { color: #f5b800; }
    .bsw-accent--light { color: #ffd54f; }

    .bsw-text {
        font-size: 15px;
        color: #4a5568;
        line-height: 1.8;
        margin-bottom: 14px;
    }

    .bsw-lead {
        font-size: 15.5px;
        color: #5a6a8a;
        line-height: 1.75;
        margin: 0;
    }

    .bsw-note {
        margin-top: 28px;
        font-size: 13.5px;
        color: #5a6a8a;
        background: rgba(26,42,108,0.05);
        border-left: 3px solid #f5b800;
        padding: 12px 18px;
        border-radius: 0 8px 8px 0;
    }

    .bsw-note a { color: #1a2a6c; font-weight: 700; text-decoration: underline; }
    .bsw-note a:hover { color: #f5b800; }

    /* ---- Buttons ---- */
    .bsw-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13.5px;
        font-weight: 700;
        padding: 11px 22px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
        border: 2px solid transparent;
    }

    .bsw-btn--lg { padding: 14px 30px; font-size: 15px; }

    .bsw-btn--gold {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 16px rgba(245,184,0,0.35);
    }

    .bsw-btn--gold:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 22px rgba(245,184,0,0.50);
        color: #0a1440;
    }

    .bsw-btn--ghost {
        background: transparent;
        color: rgba(255,255,255,0.90);
        border-color: rgba(255,255,255,0.45);
    }

    .bsw-btn--ghost:hover {
        border-color: #f5b800;
        color: #f5b800;
        transform: translateY(-2px);
    }

    .bsw-btn--outline-light {
        background: transparent;
        color: rgba(255,255,255,0.90);
        border-color: rgba(255,255,255,0.50);
    }

    .bsw-btn--outline-light:hover {
        background: rgba(255,255,255,0.12);
        border-color: #f5b800;
        color: #f5b800;
        transform: translateY(-2px);
    }

    /* ================================================================
    OVERVIEW
    ================================================================ */
    .bsw-section--overview { background: #fff; }

    .bsw-overview-grid {
        display: grid;
        grid-template-columns: 1fr 360px;
        gap: 48px;
        align-items: start;
    }

    .bsw-overview-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 20px;
    }

    .bsw-chip {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        background: #f0f4ff;
        color: #1a2a6c;
        font-size: 12.5px;
        font-weight: 600;
        padding: 6px 14px;
        border-radius: 999px;
        border: 1px solid #c7d2f0;
    }

    .bsw-chip i { color: #f5b800; }

    .bsw-overview-panel {
        background: linear-gradient(160deg, #0d1b5e 0%, #1a2a6c 55%, #253580 100%);
        border-radius: 18px;
        padding: 30px 28px 28px;
        color: #fff;
        box-shadow: 0 16px 48px rgba(13,27,94,0.28);
        position: sticky;
        top: 80px;
    }

    .bsw-panel-title {
        font-size: 16px;
        font-weight: 800;
        color: #f5b800;
        margin-bottom: 20px;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .bsw-panel-list {
        list-style: none;
        padding: 0;
        margin: 0 0 22px;
    }

    .bsw-panel-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13.5px;
        color: rgba(255,255,255,0.88);
        padding: 9px 0;
        border-bottom: 1px solid rgba(255,255,255,0.10);
        line-height: 1.5;
    }

    .bsw-panel-list li:last-child { border-bottom: none; }

    .bsw-panel-list i { color: #f5b800; margin-top: 3px; flex-shrink: 0; font-size: 11px; }
    .bsw-panel-list strong { color: rgba(255,255,255,0.70); font-weight: 600; }

    .bsw-panel-actions { display: flex; flex-direction: column; gap: 10px; }

    .bsw-panel-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        font-size: 13px;
        font-weight: 700;
        padding: 10px 16px;
        border-radius: 999px;
        text-decoration: none;
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 12px rgba(245,184,0,0.30);
        transition: transform 0.2s ease, color 0.2s ease;
    }

    .bsw-panel-btn:hover { transform: translateY(-2px); color: #0a1440; }

    .bsw-panel-btn--ghost {
        background: transparent;
        color: rgba(255,255,255,0.85);
        border: 2px solid rgba(255,255,255,0.35);
        box-shadow: none;
    }

    .bsw-panel-btn--ghost:hover { border-color: #f5b800; color: #f5b800; }

    /* ================================================================
    HIGHLIGHTS
    ================================================================ */
    .bsw-section--highlights { background: #f4f6f9; }

    .bsw-highlights-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
    }

    .bsw-highlight-card {
        background: #fff;
        border-radius: 16px;
        padding: 32px 24px;
        text-align: center;
        box-shadow: 0 4px 20px rgba(13,27,94,0.07);
        border-top: 3px solid transparent;
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

    .bsw-highlight-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 12px 36px rgba(13,27,94,0.13);
        border-top-color: #f5b800;
    }

    .bsw-highlight-icon {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #3949ab);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        margin: 0 auto 18px;
        box-shadow: 0 4px 14px rgba(26,42,108,0.25);
        transition: transform 0.25s ease;
    }

    .bsw-highlight-card:hover .bsw-highlight-icon { transform: scale(1.10) rotate(-4deg); }

    .bsw-highlight-title { font-size: 15.5px; font-weight: 800; color: #0d1b5e; margin-bottom: 10px; }
    .bsw-highlight-text  { font-size: 13.5px; color: #5a6a8a; line-height: 1.75; }

    /* ================================================================
    CURRICULUM TIMELINE
    ================================================================ */
    .bsw-section--curriculum { background: #fff; }

    .bsw-curriculum-timeline {
        display: grid;
        grid-template-columns: 1fr 40px 1fr 40px 1fr;
        align-items: start;
        margin-top: 8px;
    }

    .bsw-curriculum-step {
        background: #f9faff;
        border-radius: 16px;
        padding: 28px 24px;
        border: 1px solid #e0e7f3;
        transition: transform 0.22s ease, box-shadow 0.22s ease;
    }

    .bsw-curriculum-step:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 32px rgba(13,27,94,0.11);
    }

    .bsw-curriculum-step-head {
        display: flex;
        align-items: center;
        gap: 14px;
        margin-bottom: 18px;
    }

    .bsw-curriculum-badge {
        width: 54px;
        height: 54px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #3949ab);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        box-shadow: 0 4px 14px rgba(26,42,108,0.28);
    }

    .bsw-curriculum-badge--gold { background: linear-gradient(135deg, #f5b800, #e07b00); }
    .bsw-curriculum-badge--navy { background: linear-gradient(135deg, #0d1b5e, #1a2a6c); }

    .bsw-curriculum-badge span {
        font-size: 15px;
        font-weight: 900;
        color: #fff;
    }

    .bsw-curriculum-badge--gold span { color: #0d1b5e; }

    .bsw-curriculum-phase {
        font-size: 14.5px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 3px;
    }

    .bsw-curriculum-phase-desc {
        font-size: 11.5px;
        color: #7a8ab0;
        font-weight: 600;
        margin: 0;
    }

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

    .bsw-curriculum-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13px;
        color: #4a5568;
        padding: 7px 0;
        border-bottom: 1px dashed #e0e7f3;
        line-height: 1.55;
    }

    .bsw-curriculum-list li:last-child { border-bottom: none; }

    .bsw-curriculum-list li::before {
        content: "\f00c";
        font-family: "Font Awesome 6 Free";
        font-weight: 900;
        color: #f5b800;
        font-size: 10px;
        margin-top: 4px;
        flex-shrink: 0;
    }

    .bsw-curriculum-connector {
        display: flex;
        align-items: center;
        justify-content: center;
        padding-top: 50px;
    }

    .bsw-curriculum-connector::after {
        content: "";
        display: block;
        width: 28px;
        height: 2px;
        background: linear-gradient(90deg, #1a2a6c, #f5b800);
        border-radius: 2px;
    }

    /* ================================================================
    SUBJECTS
    ================================================================ */
    .bsw-section--subjects { background: #f4f6f9; }

    .bsw-subject-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
    }

    .bsw-subject-card {
        background: #fff;
        border-radius: 14px;
        padding: 22px 20px;
        border-left: 4px solid #1a2a6c;
        box-shadow: 0 2px 12px rgba(13,27,94,0.07);
        transition: transform 0.22s ease, border-left-color 0.22s ease, box-shadow 0.22s ease;
    }

    .bsw-subject-card:hover {
        transform: translateY(-4px);
        border-left-color: #f5b800;
        box-shadow: 0 10px 28px rgba(13,27,94,0.12);
    }

    .bsw-subject-name { font-size: 14px; font-weight: 800; color: #0d1b5e; margin-bottom: 8px; line-height: 1.35; }
    .bsw-subject-desc { font-size: 13px; color: #5a6a8a; line-height: 1.65; margin: 0; }

    /* ================================================================
    CAREERS
    ================================================================ */
    .bsw-section--careers {
        background: linear-gradient(135deg, rgba(13,27,94,0.96) 0%, rgba(26,42,108,0.94) 50%, rgba(57,73,171,0.92) 100%);
        position: relative;
        overflow: hidden;
    }

    .bsw-section--careers::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(circle at 15% 25%, rgba(245,184,0,0.18) 0%, transparent 55%),
                    radial-gradient(circle at 80% 70%, rgba(255,255,255,0.06) 0%, transparent 50%);
        pointer-events: none;
    }

    .bsw-careers-inner {
        position: relative;
        z-index: 1;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 56px;
        align-items: center;
    }

    .bsw-careers-title {
        font-size: clamp(22px, 3vw, 30px);
        font-weight: 800;
        color: #fff;
        line-height: 1.3;
        margin-bottom: 16px;
    }

    .bsw-careers-text {
        font-size: 15px;
        color: rgba(255,255,255,0.82);
        line-height: 1.8;
        margin-bottom: 26px;
    }

    .bsw-careers-actions { display: flex; flex-wrap: wrap; gap: 12px; }

    .bsw-careers-tags-wrap {
        background: rgba(255,255,255,0.08);
        border: 1px solid rgba(255,255,255,0.16);
        border-radius: 20px;
        padding: 28px 24px;
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
    }

    .bsw-careers-tags-title {
        font-size: 13px;
        font-weight: 700;
        color: #f5b800;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        margin-bottom: 18px;
    }

    .bsw-careers-tags {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .bsw-careers-tag {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.35);
        color: rgba(255,255,255,0.92);
        font-size: 12.5px;
        font-weight: 600;
        padding: 7px 14px;
        border-radius: 999px;
        transition: background 0.2s ease, transform 0.2s ease;
    }

    .bsw-careers-tag:hover { background: rgba(245,184,0,0.25); transform: translateY(-2px); }
    .bsw-careers-tag i { color: #f5b800; font-size: 10px; }

    /* ================================================================
    CTA
    ================================================================ */
    .bsw-section--cta {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 48%, #3949ab 100%);
        padding: 64px 0;
    }

    .bsw-cta-box {
        text-align: center;
        max-width: 780px;
        margin: 0 auto;
    }

    .bsw-cta-icon {
        width: 72px;
        height: 72px;
        border-radius: 50%;
        background: rgba(245,184,0,0.15);
        border: 2px solid rgba(245,184,0,0.45);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 26px;
        margin: 0 auto 22px;
    }

    .bsw-cta-title {
        font-size: clamp(22px, 3.5vw, 32px);
        font-weight: 800;
        color: #fff;
        margin-bottom: 14px;
        line-height: 1.3;
    }

    .bsw-cta-text {
        font-size: 15.5px;
        color: rgba(255,255,255,0.80);
        line-height: 1.8;
        margin-bottom: 32px;
    }

    .bsw-cta-actions {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 14px;
    }

    /* ================================================================
    RESPONSIVE — TABLET ≤ 1024px
    ================================================================ */
    @media (max-width: 1024px) {
        .bsw-highlights-grid    { grid-template-columns: repeat(2, 1fr); }
        .bsw-subject-grid       { grid-template-columns: repeat(2, 1fr); }
        .bsw-overview-grid      { grid-template-columns: 1fr; }
        .bsw-overview-panel     { position: static; }
        .bsw-careers-inner      { grid-template-columns: 1fr; gap: 36px; }

        .bsw-curriculum-timeline { grid-template-columns: 1fr; }

        .bsw-curriculum-connector {
            padding: 12px 0;
            justify-content: flex-start;
            padding-left: 26px;
        }

        .bsw-curriculum-connector::after {
            width: 2px;
            height: 28px;
            background: linear-gradient(180deg, #1a2a6c, #f5b800);
        }
    }

    /* ================================================================
    RESPONSIVE — MOBILE ≤ 768px
    ================================================================ */
    @media (max-width: 768px) {
        .bsw-container  { padding: 0 16px; }
        .bsw-section    { padding: 52px 0; }

        .bsw-strip-list { grid-template-columns: repeat(2, 1fr); }

        .bsw-strip-item {
            border-right: none;
            border-bottom: 1px solid #e8ecf4;
            padding: 20px 12px;
        }

        .bsw-strip-item:nth-child(odd) { border-right: 1px solid #e8ecf4; }

        .bsw-hero-actions    { flex-direction: column; align-items: flex-start; }

        .bsw-hero-btn {
            width: 100%;
            justify-content: center;
            max-width: 280px;
        }

        .bsw-cta-actions     { flex-direction: column; align-items: center; }

        .bsw-btn--lg {
            width: 100%;
            justify-content: center;
            max-width: 280px;
        }
    }

    /* ================================================================
    RESPONSIVE — SMALL MOBILE ≤ 480px
    ================================================================ */
    @media (max-width: 480px) {
        .bsw-strip-list { grid-template-columns: 1fr; }

        .bsw-strip-item {
            border-right: none !important;
            border-bottom: 1px solid #e8ecf4;
        }

        .bsw-highlights-grid { grid-template-columns: 1fr; }
        .bsw-subject-grid    { grid-template-columns: 1fr; }
        .bsw-panel-actions   { flex-direction: column; }
    }

    @media (prefers-reduced-motion: reduce) {
        .bsw-highlight-card,
        .bsw-subject-card,
        .bsw-curriculum-step,
        .bsw-hero-btn,
        .bsw-btn,
        .bsw-panel-btn,
        .bsw-careers-tag { transition: none; }

        .bsw-highlight-card:hover .bsw-highlight-icon { transform: none; }
    }

    /* ================================================================
    BBA – BACHELOR OF BUSINESS ADMINISTRATION PROGRAMME PAGE
    Brand: Navy #0d1b5e · Blue #1a2a6c · Gold #f5b800
    ================================================================ */

    /* ---- Page wrapper ---- */
    .bba-page {
        background-color: #f4f6f9;
    }

    /* ---- Container ---- */
    .bba-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
    }

    /* ---- Hero override ---- */
    .bba-hero {
        background:
            linear-gradient(135deg, rgba(13,27,94,0.93) 0%, rgba(26,42,108,0.90) 50%, rgba(57,73,171,0.88) 100%),
            linear-gradient(to bottom right, #1a237e, #3949ab);
        background-blend-mode: multiply, normal;
    }

    .bba-hero-badge {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(245,184,0,0.18);
        border: 1px solid rgba(245,184,0,0.45);
        color: #f5b800;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        padding: 6px 16px;
        border-radius: 999px;
        margin-bottom: 18px;
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
    }

    .bba-hero-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 14px;
        margin-top: 28px;
    }

    .bba-hero-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 14.5px;
        font-weight: 700;
        padding: 13px 28px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.22s ease, box-shadow 0.22s ease, background 0.22s ease;
    }

    .bba-hero-btn--primary {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 6px 20px rgba(245,184,0,0.40);
    }

    .bba-hero-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 28px rgba(245,184,0,0.55);
        color: #0a1440;
    }

    .bba-hero-btn--ghost {
        background: transparent;
        color: #fff;
        border: 2px solid rgba(255,255,255,0.50);
    }

    .bba-hero-btn--ghost:hover {
        border-color: #f5b800;
        color: #f5b800;
        transform: translateY(-2px);
    }

    /* ---- Stats Strip ---- */
    .bba-strip {
        background: #ffffff;
        border-top: 3px solid #f5b800;
        box-shadow: 0 4px 22px rgba(13,27,94,0.08);
    }

    .bba-strip-list {
        list-style: none;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 0;
        margin: 0;
        padding: 0;
    }

    .bba-strip-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 6px;
        padding: 28px 16px;
        border-right: 1px solid #e8ecf4;
        text-align: center;
        transition: background 0.2s ease;
    }

    .bba-strip-item:last-child { border-right: none; }

    .bba-strip-item:hover { background: #f0f4ff; }

    .bba-strip-icon {
        width: 52px;
        height: 52px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #3949ab);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        box-shadow: 0 4px 14px rgba(26,42,108,0.22);
    }

    .bba-strip-val {
        font-size: 17px;
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.2;
    }

    .bba-strip-lbl {
        font-size: 12px;
        color: #5a6a8a;
        font-weight: 500;
    }

    /* ---- Shared section base ---- */
    .bba-section {
        padding: 72px 0;
    }

    .bba-section-head {
        margin-bottom: 44px;
        max-width: 700px;
    }

    .bba-section-head--center {
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }

    /* ---- Tags / kickers ---- */
    .bba-tag {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(26,42,108,0.08);
        color: #1a2a6c;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        padding: 5px 14px;
        border-radius: 999px;
        margin-bottom: 14px;
    }

    .bba-tag--dark {
        background: rgba(13,27,94,0.10);
        color: #0d1b5e;
    }

    .bba-tag--light {
        background: rgba(255,255,255,0.14);
        color: rgba(255,255,255,0.95);
        border: 1px solid rgba(255,255,255,0.30);
    }

    /* ---- Typography ---- */
    .bba-title {
        font-size: clamp(22px, 3vw, 30px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
        margin: 0 0 16px;
    }

    .bba-accent {
        color: #f5b800;
        position: relative;
    }

    .bba-accent--light {
        color: #ffd54f;
    }

    .bba-text {
        font-size: 15px;
        color: #4a5568;
        line-height: 1.8;
        margin-bottom: 14px;
    }

    .bba-lead {
        font-size: 15.5px;
        color: #5a6a8a;
        line-height: 1.75;
        margin: 0;
    }

    .bba-note {
        margin-top: 28px;
        font-size: 13.5px;
        color: #5a6a8a;
        background: rgba(26,42,108,0.05);
        border-left: 3px solid #f5b800;
        padding: 12px 18px;
        border-radius: 0 8px 8px 0;
    }

    .bba-note a {
        color: #1a2a6c;
        font-weight: 700;
        text-decoration: underline;
    }

    .bba-note a:hover { color: #f5b800; }

    /* ---- Buttons ---- */
    .bba-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13.5px;
        font-weight: 700;
        padding: 11px 22px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
        border: 2px solid transparent;
    }

    .bba-btn--lg { padding: 14px 30px; font-size: 15px; }

    .bba-btn--primary {
        background: linear-gradient(135deg, #1a2a6c, #3949ab);
        color: #fff;
        box-shadow: 0 4px 16px rgba(26,42,108,0.28);
    }

    .bba-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 22px rgba(26,42,108,0.38);
        color: #fff;
    }

    .bba-btn--gold {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 16px rgba(245,184,0,0.35);
    }

    .bba-btn--gold:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 22px rgba(245,184,0,0.50);
        color: #0a1440;
    }

    .bba-btn--outline {
        background: transparent;
        color: #1a2a6c;
        border-color: #1a2a6c;
    }

    .bba-btn--outline:hover {
        background: #1a2a6c;
        color: #fff;
        transform: translateY(-2px);
    }

    .bba-btn--ghost {
        background: transparent;
        color: rgba(255,255,255,0.90);
        border-color: rgba(255,255,255,0.45);
    }

    .bba-btn--ghost:hover {
        border-color: #f5b800;
        color: #f5b800;
        transform: translateY(-2px);
    }

    .bba-btn--outline-light {
        background: transparent;
        color: rgba(255,255,255,0.90);
        border-color: rgba(255,255,255,0.50);
    }

    .bba-btn--outline-light:hover {
        background: rgba(255,255,255,0.12);
        border-color: #f5b800;
        color: #f5b800;
        transform: translateY(-2px);
    }

    /* ================================================================
    OVERVIEW SECTION
    ================================================================ */
    .bba-section--overview {
        background: #fff;
    }

    .bba-overview-grid {
        display: grid;
        grid-template-columns: 1fr 360px;
        gap: 48px;
        align-items: start;
    }

    .bba-overview-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 20px;
    }

    .bba-chip {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        background: #f0f4ff;
        color: #1a2a6c;
        font-size: 12.5px;
        font-weight: 600;
        padding: 6px 14px;
        border-radius: 999px;
        border: 1px solid #c7d2f0;
    }

    .bba-chip i { color: #f5b800; }

    .bba-overview-panel {
        background: linear-gradient(160deg, #0d1b5e 0%, #1a2a6c 50%, #253580 100%);
        border-radius: 18px;
        padding: 30px 28px 28px;
        color: #fff;
        box-shadow: 0 16px 48px rgba(13,27,94,0.28);
        position: sticky;
        top: 80px;
    }

    .bba-panel-title {
        font-size: 16px;
        font-weight: 800;
        color: #f5b800;
        margin-bottom: 20px;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .bba-panel-list {
        list-style: none;
        padding: 0;
        margin: 0 0 22px;
    }

    .bba-panel-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13.5px;
        color: rgba(255,255,255,0.88);
        padding: 9px 0;
        border-bottom: 1px solid rgba(255,255,255,0.10);
        line-height: 1.5;
    }

    .bba-panel-list li:last-child { border-bottom: none; }

    .bba-panel-list i {
        color: #f5b800;
        margin-top: 3px;
        flex-shrink: 0;
        font-size: 11px;
    }

    .bba-panel-list strong { color: rgba(255,255,255,0.70); font-weight: 600; }

    .bba-panel-actions {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .bba-panel-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        font-size: 13px;
        font-weight: 700;
        padding: 10px 16px;
        border-radius: 999px;
        text-decoration: none;
        text-align: center;
        transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease;
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 12px rgba(245,184,0,0.30);
    }

    .bba-panel-btn:hover {
        transform: translateY(-2px);
        color: #0a1440;
    }

    .bba-panel-btn--ghost {
        background: transparent;
        color: rgba(255,255,255,0.85);
        border: 2px solid rgba(255,255,255,0.35);
        box-shadow: none;
    }

    .bba-panel-btn--ghost:hover {
        border-color: #f5b800;
        color: #f5b800;
    }

    /* ================================================================
    HIGHLIGHTS / WHY CHOOSE
    ================================================================ */
    .bba-section--highlights {
        background: #f4f6f9;
    }

    .bba-highlights-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
    }

    .bba-highlight-card {
        background: #fff;
        border-radius: 16px;
        padding: 32px 24px;
        text-align: center;
        box-shadow: 0 4px 20px rgba(13,27,94,0.07);
        border-top: 3px solid transparent;
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

    .bba-highlight-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 12px 36px rgba(13,27,94,0.14);
        border-top-color: #f5b800;
    }

    .bba-highlight-icon {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #3949ab);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        margin: 0 auto 18px;
        box-shadow: 0 4px 14px rgba(26,42,108,0.25);
        transition: transform 0.25s ease;
    }

    .bba-highlight-card:hover .bba-highlight-icon {
        transform: scale(1.10) rotate(-4deg);
    }

    .bba-highlight-title {
        font-size: 15.5px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 10px;
    }

    .bba-highlight-text {
        font-size: 13.5px;
        color: #5a6a8a;
        line-height: 1.75;
    }

    /* ================================================================
    CURRICULUM TIMELINE
    ================================================================ */
    .bba-section--curriculum {
        background: #fff;
    }

    .bba-curriculum-timeline {
        display: grid;
        grid-template-columns: 1fr 40px 1fr 40px 1fr;
        gap: 0 0;
        align-items: start;
        margin-top: 8px;
    }

    .bba-curriculum-step {
        background: #f9faff;
        border-radius: 16px;
        padding: 28px 24px;
        border: 1px solid #e0e7f3;
        transition: box-shadow 0.22s ease, transform 0.22s ease;
    }

    .bba-curriculum-step:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 32px rgba(13,27,94,0.11);
    }

    .bba-curriculum-step-head {
        display: flex;
        align-items: center;
        gap: 14px;
        margin-bottom: 18px;
    }

    .bba-curriculum-badge {
        width: 56px;
        height: 56px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #3949ab);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        box-shadow: 0 4px 14px rgba(26,42,108,0.28);
    }

    .bba-curriculum-badge--gold {
        background: linear-gradient(135deg, #f5b800, #e07b00);
    }

    .bba-curriculum-badge--navy {
        background: linear-gradient(135deg, #0d1b5e, #1a2a6c);
    }

    .bba-curriculum-badge-year {
        font-size: 16px;
        font-weight: 900;
        color: #fff;
        letter-spacing: 0.5px;
    }

    .bba-curriculum-badge--gold .bba-curriculum-badge-year {
        color: #0d1b5e;
    }

    .bba-curriculum-step-meta { flex: 1; }

    .bba-curriculum-phase {
        font-size: 14.5px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 3px;
        line-height: 1.3;
    }

    .bba-curriculum-phase-desc {
        font-size: 11.5px;
        color: #7a8ab0;
        font-weight: 600;
        margin: 0;
    }

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

    .bba-curriculum-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13px;
        color: #4a5568;
        padding: 7px 0;
        border-bottom: 1px dashed #e0e7f3;
        line-height: 1.55;
    }

    .bba-curriculum-list li:last-child { border-bottom: none; }

    .bba-curriculum-list li::before {
        content: "\f00c";
        font-family: "Font Awesome 6 Free";
        font-weight: 900;
        color: #f5b800;
        font-size: 10px;
        margin-top: 4px;
        flex-shrink: 0;
    }

    .bba-curriculum-connector {
        display: flex;
        align-items: center;
        justify-content: center;
        padding-top: 50px;
    }

    .bba-curriculum-connector::after {
        content: "";
        display: block;
        width: 28px;
        height: 2px;
        background: linear-gradient(90deg, #1a2a6c, #f5b800);
        border-radius: 2px;
        position: relative;
    }

    /* ================================================================
    SUBJECTS GRID
    ================================================================ */
    .bba-section--subjects {
        background: #f4f6f9;
    }

    .bba-subject-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
    }

    .bba-subject-card {
        background: #fff;
        border-radius: 14px;
        padding: 22px 20px;
        border-left: 4px solid #1a2a6c;
        box-shadow: 0 2px 12px rgba(13,27,94,0.07);
        transition: transform 0.22s ease, border-left-color 0.22s ease, box-shadow 0.22s ease;
    }

    .bba-subject-card:hover {
        transform: translateY(-4px);
        border-left-color: #f5b800;
        box-shadow: 0 10px 28px rgba(13,27,94,0.12);
    }

    .bba-subject-name {
        font-size: 14px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 8px;
        line-height: 1.35;
    }

    .bba-subject-desc {
        font-size: 13px;
        color: #5a6a8a;
        line-height: 1.65;
        margin: 0;
    }

    /* ================================================================
    OUTCOMES GRID
    ================================================================ */
    .bba-section--outcomes {
        background: #fff;
    }

    .bba-outcome-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
    }

    .bba-outcome-card {
        background: linear-gradient(160deg, #f9faff 0%, #eef2ff 100%);
        border-radius: 16px;
        padding: 28px 22px;
        border: 1px solid #dce4f8;
        text-align: center;
        transition: transform 0.22s ease, box-shadow 0.22s ease;
    }

    .bba-outcome-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 12px 32px rgba(26,42,108,0.12);
    }

    .bba-outcome-icon {
        width: 56px;
        height: 56px;
        border-radius: 50%;
        background: linear-gradient(135deg, #0d1b5e, #1a2a6c);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        margin: 0 auto 16px;
        box-shadow: 0 4px 12px rgba(13,27,94,0.22);
    }

    .bba-outcome-title {
        font-size: 14.5px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 10px;
    }

    .bba-outcome-text {
        font-size: 13px;
        color: #5a6a8a;
        line-height: 1.7;
        margin: 0;
    }

    /* ================================================================
    CAREER SECTION
    ================================================================ */
    .bba-section--careers {
        background:
            linear-gradient(135deg, rgba(13,27,94,0.96) 0%, rgba(26,42,108,0.94) 50%, rgba(57,73,171,0.92) 100%);
        position: relative;
        overflow: hidden;
    }

    .bba-section--careers::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(circle at 15% 25%, rgba(245,184,0,0.18) 0%, transparent 55%),
                    radial-gradient(circle at 80% 70%, rgba(255,255,255,0.06) 0%, transparent 50%);
        pointer-events: none;
    }

    .bba-careers-inner {
        position: relative;
        z-index: 1;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 56px;
        align-items: center;
    }

    .bba-careers-title {
        font-size: clamp(22px, 3vw, 30px);
        font-weight: 800;
        color: #fff;
        line-height: 1.3;
        margin-bottom: 16px;
    }

    .bba-careers-text {
        font-size: 15px;
        color: rgba(255,255,255,0.82);
        line-height: 1.8;
        margin-bottom: 26px;
    }

    .bba-careers-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
    }

    .bba-careers-tags-wrap {
        background: rgba(255,255,255,0.07);
        border: 1px solid rgba(255,255,255,0.15);
        border-radius: 20px;
        padding: 28px 24px;
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
    }

    .bba-careers-tags-title {
        font-size: 13px;
        font-weight: 700;
        color: #f5b800;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        margin-bottom: 18px;
    }

    .bba-careers-tags {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .bba-careers-tag {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.35);
        color: rgba(255,255,255,0.92);
        font-size: 12.5px;
        font-weight: 600;
        padding: 7px 14px;
        border-radius: 999px;
        transition: background 0.2s ease, transform 0.2s ease;
    }

    .bba-careers-tag:hover {
        background: rgba(245,184,0,0.25);
        transform: translateY(-2px);
    }

    .bba-careers-tag i {
        color: #f5b800;
        font-size: 10px;
    }

    /* ================================================================
    ADMISSION STEPS
    ================================================================ */
    .bba-section--admission {
        background: #f4f6f9;
    }

    .bba-admission-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
        margin-bottom: 36px;
    }

    .bba-admission-step {
        background: #fff;
        border-radius: 16px;
        padding: 28px 22px;
        text-align: center;
        box-shadow: 0 4px 18px rgba(13,27,94,0.07);
        border-bottom: 3px solid #e8ecf4;
        transition: transform 0.22s ease, box-shadow 0.22s ease, border-bottom-color 0.22s ease;
        position: relative;
        overflow: hidden;
    }

    .bba-admission-step:hover {
        transform: translateY(-5px);
        box-shadow: 0 14px 36px rgba(13,27,94,0.13);
        border-bottom-color: #f5b800;
    }

    .bba-admission-step-num {
        font-size: 38px;
        font-weight: 900;
        color: rgba(26,42,108,0.10);
        line-height: 1;
        margin-bottom: 14px;
        font-variant-numeric: tabular-nums;
        letter-spacing: -1px;
    }

    .bba-admission-step-title {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 10px;
    }

    .bba-admission-step-text {
        font-size: 13px;
        color: #5a6a8a;
        line-height: 1.7;
        margin: 0;
    }

    .bba-admission-links {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 14px;
    }

    /* ================================================================
    CTA SECTION
    ================================================================ */
    .bba-section--cta {
        background:
            linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 45%, #3949ab 100%);
        padding: 64px 0;
    }

    .bba-cta-box {
        text-align: center;
        max-width: 820px;
        margin: 0 auto;
    }

    .bba-cta-icon {
        width: 72px;
        height: 72px;
        border-radius: 50%;
        background: rgba(245,184,0,0.15);
        border: 2px solid rgba(245,184,0,0.45);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 26px;
        margin: 0 auto 22px;
    }

    .bba-cta-title {
        font-size: clamp(22px, 3.5vw, 32px);
        font-weight: 800;
        color: #fff;
        margin-bottom: 14px;
        line-height: 1.3;
    }

    .bba-cta-text {
        font-size: 15.5px;
        color: rgba(255,255,255,0.80);
        line-height: 1.8;
        margin-bottom: 32px;
    }

    .bba-cta-actions {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 14px;
    }

    /* ================================================================
    RESPONSIVE — TABLET  ≤ 1024px
    ================================================================ */
    @media (max-width: 1024px) {
        .bba-highlights-grid {
            grid-template-columns: repeat(2, 1fr);
        }

        .bba-subject-grid {
            grid-template-columns: repeat(3, 1fr);
        }

        .bba-outcome-grid {
            grid-template-columns: repeat(2, 1fr);
        }

        .bba-curriculum-timeline {
            grid-template-columns: 1fr;
            gap: 0;
        }

        .bba-curriculum-connector {
            padding: 12px 0;
            justify-content: flex-start;
            padding-left: 26px;
        }

        .bba-curriculum-connector::after {
            width: 2px;
            height: 28px;
            background: linear-gradient(180deg, #1a2a6c, #f5b800);
        }

        .bba-overview-grid {
            grid-template-columns: 1fr;
        }

        .bba-overview-panel {
            position: static;
        }

        .bba-admission-grid {
            grid-template-columns: repeat(2, 1fr);
        }

        .bba-careers-inner {
            grid-template-columns: 1fr;
            gap: 36px;
        }
    }

    /* ================================================================
    RESPONSIVE — MOBILE  ≤ 768px
    ================================================================ */
    @media (max-width: 768px) {
        .bba-container {
            padding: 0 16px;
        }

        .bba-section {
            padding: 52px 0;
        }

        .bba-strip-list {
            grid-template-columns: repeat(2, 1fr);
        }

        .bba-strip-item {
            border-right: none;
            border-bottom: 1px solid #e8ecf4;
            padding: 20px 12px;
        }

        .bba-strip-item:nth-child(odd) {
            border-right: 1px solid #e8ecf4;
        }

        .bba-highlights-grid {
            grid-template-columns: 1fr 1fr;
        }

        .bba-subject-grid {
            grid-template-columns: repeat(2, 1fr);
        }

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

        .bba-hero-actions {
            flex-direction: column;
            align-items: flex-start;
        }

        .bba-hero-btn {
            width: 100%;
            justify-content: center;
            max-width: 280px;
        }

        .bba-cta-actions {
            flex-direction: column;
            align-items: center;
        }

        .bba-btn--lg {
            width: 100%;
            justify-content: center;
            max-width: 280px;
        }

        .bba-admission-links {
            flex-direction: column;
            align-items: center;
        }
    }

    /* ================================================================
    RESPONSIVE — SMALL MOBILE  ≤ 480px
    ================================================================ */
    @media (max-width: 480px) {
        .bba-strip-list {
            grid-template-columns: 1fr;
        }

        .bba-strip-item {
            border-right: none !important;
            border-bottom: 1px solid #e8ecf4;
        }

        .bba-highlights-grid {
            grid-template-columns: 1fr;
        }

        .bba-subject-grid {
            grid-template-columns: 1fr;
        }

        .bba-outcome-grid {
            grid-template-columns: 1fr;
        }

        .bba-panel-actions {
            flex-direction: column;
        }
    }

    /* ================================================================
    REDUCED MOTION
    ================================================================ */
    @media (prefers-reduced-motion: reduce) {
        .bba-highlight-card,
        .bba-subject-card,
        .bba-outcome-card,
        .bba-admission-step,
        .bba-curriculum-step,
        .bba-hero-btn,
        .bba-btn,
        .bba-panel-btn,
        .bba-careers-tag {
            transition: none;
        }

        .bba-highlight-card:hover .bba-highlight-icon {
            transform: none;
        }
    }

    /* ================================================================
    BCA – BACHELOR OF COMPUTER APPLICATIONS PROGRAMME PAGE
    Brand: Navy #0d1b5e · Blue #1a2a6c · Indigo #283593 · Gold #f5b800
    ================================================================ */

    /* ---- Page wrapper ---- */
    .bca-page {
        background-color: #f4f6f9;
    }

    /* ---- Container ---- */
    .bca-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
    }

    /* ---- Hero ---- */
    .bca-hero {
        background:
            linear-gradient(120deg, rgba(13,27,94,0.96) 0%, rgba(26,42,108,0.93) 48%, rgba(40,53,147,0.90) 100%),
            linear-gradient(to bottom right, #0d1b5e, #283593);
        background-blend-mode: multiply, normal;
    }

    .bca-hero-badge {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(245,184,0,0.18);
        border: 1px solid rgba(245,184,0,0.45);
        color: #f5b800;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        padding: 6px 16px;
        border-radius: 999px;
        margin-bottom: 18px;
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
    }

    .bca-hero-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 14px;
        margin-top: 28px;
    }

    .bca-hero-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 14.5px;
        font-weight: 700;
        padding: 13px 28px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.22s ease, box-shadow 0.22s ease, background 0.22s ease, color 0.22s ease;
    }

    .bca-hero-btn--primary {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 6px 20px rgba(245,184,0,0.40);
    }

    .bca-hero-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 28px rgba(245,184,0,0.55);
        color: #0a1440;
    }

    .bca-hero-btn--ghost {
        background: transparent;
        color: #fff;
        border: 2px solid rgba(255,255,255,0.50);
    }

    .bca-hero-btn--ghost:hover {
        border-color: #f5b800;
        color: #f5b800;
        transform: translateY(-2px);
    }

    /* ---- Stats Strip ---- */
    .bca-strip {
        background: #ffffff;
        border-top: 3px solid #1a2a6c;
        box-shadow: 0 4px 22px rgba(13,27,94,0.08);
    }

    .bca-strip-list {
        list-style: none;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 0;
        margin: 0;
        padding: 0;
    }

    .bca-strip-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 6px;
        padding: 28px 16px;
        border-right: 1px solid #e8ecf4;
        text-align: center;
        transition: background 0.2s ease;
    }

    .bca-strip-item:last-child { border-right: none; }
    .bca-strip-item:hover { background: #f0f4ff; }

    .bca-strip-icon {
        width: 52px;
        height: 52px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #283593);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        box-shadow: 0 4px 14px rgba(26,42,108,0.22);
    }

    .bca-strip-val {
        font-size: 17px;
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.2;
    }

    .bca-strip-lbl {
        font-size: 12px;
        color: #5a6a8a;
        font-weight: 500;
    }

    /* ---- Shared section base ---- */
    .bca-section {
        padding: 72px 0;
    }

    .bca-section-head {
        margin-bottom: 44px;
        max-width: 700px;
    }

    .bca-section-head--center {
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }

    /* ---- Tags / kickers ---- */
    .bca-tag {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(26,42,108,0.08);
        color: #1a2a6c;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        padding: 5px 14px;
        border-radius: 999px;
        margin-bottom: 14px;
    }

    .bca-tag--dark {
        background: rgba(13,27,94,0.10);
        color: #0d1b5e;
    }

    .bca-tag--light {
        background: rgba(255,255,255,0.14);
        color: rgba(255,255,255,0.95);
        border: 1px solid rgba(255,255,255,0.30);
    }

    /* ---- Typography ---- */
    .bca-title {
        font-size: clamp(22px, 3vw, 30px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
        margin: 0 0 16px;
    }

    .bca-accent        { color: #f5b800; }
    .bca-accent--light { color: #ffd54f; }

    .bca-text {
        font-size: 15px;
        color: #4a5568;
        line-height: 1.8;
        margin-bottom: 14px;
    }

    .bca-lead {
        font-size: 15.5px;
        color: #5a6a8a;
        line-height: 1.75;
        margin: 0;
    }

    .bca-note {
        margin-top: 28px;
        font-size: 13.5px;
        color: #5a6a8a;
        background: rgba(26,42,108,0.05);
        border-left: 3px solid #f5b800;
        padding: 12px 18px;
        border-radius: 0 8px 8px 0;
    }

    .bca-note a {
        color: #1a2a6c;
        font-weight: 700;
        text-decoration: underline;
    }

    .bca-note a:hover { color: #f5b800; }

    /* ---- Buttons ---- */
    .bca-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13.5px;
        font-weight: 700;
        padding: 11px 22px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
        border: 2px solid transparent;
    }

    .bca-btn--lg { padding: 14px 30px; font-size: 15px; }

    .bca-btn--primary {
        background: linear-gradient(135deg, #1a2a6c, #283593);
        color: #fff;
        box-shadow: 0 4px 16px rgba(26,42,108,0.28);
    }

    .bca-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 22px rgba(26,42,108,0.38);
        color: #fff;
    }

    .bca-btn--gold {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 16px rgba(245,184,0,0.35);
    }

    .bca-btn--gold:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 22px rgba(245,184,0,0.50);
        color: #0a1440;
    }

    .bca-btn--outline {
        background: transparent;
        color: #1a2a6c;
        border-color: #1a2a6c;
    }

    .bca-btn--outline:hover {
        background: #1a2a6c;
        color: #fff;
        transform: translateY(-2px);
    }

    .bca-btn--ghost {
        background: transparent;
        color: rgba(255,255,255,0.90);
        border-color: rgba(255,255,255,0.45);
    }

    .bca-btn--ghost:hover {
        border-color: #f5b800;
        color: #f5b800;
        transform: translateY(-2px);
    }

    .bca-btn--outline-light {
        background: transparent;
        color: rgba(255,255,255,0.90);
        border-color: rgba(255,255,255,0.50);
    }

    .bca-btn--outline-light:hover {
        background: rgba(255,255,255,0.12);
        border-color: #f5b800;
        color: #f5b800;
        transform: translateY(-2px);
    }

    /* ================================================================
    OVERVIEW SECTION
    ================================================================ */
    .bca-section--overview {
        background: #fff;
    }

    .bca-overview-grid {
        display: grid;
        grid-template-columns: 1fr 360px;
        gap: 48px;
        align-items: start;
    }

    .bca-overview-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 20px;
    }

    .bca-chip {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        background: #f0f4ff;
        color: #1a2a6c;
        font-size: 12.5px;
        font-weight: 600;
        padding: 6px 14px;
        border-radius: 999px;
        border: 1px solid #c7d2f0;
    }

    .bca-chip i { color: #f5b800; }

    .bca-overview-panel {
        background: linear-gradient(160deg, #0d1b5e 0%, #1a2a6c 50%, #283593 100%);
        border-radius: 18px;
        padding: 30px 28px 28px;
        color: #fff;
        box-shadow: 0 16px 48px rgba(13,27,94,0.28);
        position: sticky;
        top: 80px;
    }

    .bca-panel-title {
        font-size: 16px;
        font-weight: 800;
        color: #f5b800;
        margin-bottom: 20px;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .bca-panel-list {
        list-style: none;
        padding: 0;
        margin: 0 0 22px;
    }

    .bca-panel-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13.5px;
        color: rgba(255,255,255,0.88);
        padding: 9px 0;
        border-bottom: 1px solid rgba(255,255,255,0.10);
        line-height: 1.5;
    }

    .bca-panel-list li:last-child { border-bottom: none; }

    .bca-panel-list i {
        color: #f5b800;
        margin-top: 3px;
        flex-shrink: 0;
        font-size: 11px;
    }

    .bca-panel-list strong { color: rgba(255,255,255,0.70); font-weight: 600; }

    .bca-panel-actions {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .bca-panel-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        font-size: 13px;
        font-weight: 700;
        padding: 10px 16px;
        border-radius: 999px;
        text-decoration: none;
        text-align: center;
        transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease;
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 12px rgba(245,184,0,0.30);
    }

    .bca-panel-btn:hover {
        transform: translateY(-2px);
        color: #0a1440;
    }

    .bca-panel-btn--ghost {
        background: transparent;
        color: rgba(255,255,255,0.85);
        border: 2px solid rgba(255,255,255,0.35);
        box-shadow: none;
    }

    .bca-panel-btn--ghost:hover {
        border-color: #f5b800;
        color: #f5b800;
    }

    /* ================================================================
    HIGHLIGHTS / WHY CHOOSE
    ================================================================ */
    .bca-section--highlights {
        background: #f4f6f9;
    }

    .bca-highlights-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
    }

    .bca-highlight-card {
        background: #fff;
        border-radius: 16px;
        padding: 32px 24px;
        text-align: center;
        box-shadow: 0 4px 20px rgba(13,27,94,0.07);
        border-top: 3px solid transparent;
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

    .bca-highlight-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 12px 36px rgba(13,27,94,0.14);
        border-top-color: #f5b800;
    }

    .bca-highlight-icon {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #283593);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        margin: 0 auto 18px;
        box-shadow: 0 4px 14px rgba(26,42,108,0.25);
        transition: transform 0.25s ease;
    }

    .bca-highlight-card:hover .bca-highlight-icon {
        transform: scale(1.10) rotate(-4deg);
    }

    .bca-highlight-title {
        font-size: 15.5px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 10px;
    }

    .bca-highlight-text {
        font-size: 13.5px;
        color: #5a6a8a;
        line-height: 1.75;
    }

    /* ================================================================
    CURRICULUM TIMELINE
    ================================================================ */
    .bca-section--curriculum {
        background: #fff;
    }

    .bca-curriculum-timeline {
        display: grid;
        grid-template-columns: 1fr 40px 1fr 40px 1fr;
        gap: 0;
        align-items: start;
        margin-top: 8px;
    }

    .bca-curriculum-step {
        background: #f9faff;
        border-radius: 16px;
        padding: 28px 24px;
        border: 1px solid #e0e7f3;
        transition: box-shadow 0.22s ease, transform 0.22s ease;
    }

    .bca-curriculum-step:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 32px rgba(13,27,94,0.11);
    }

    .bca-curriculum-step-head {
        display: flex;
        align-items: center;
        gap: 14px;
        margin-bottom: 18px;
    }

    .bca-curriculum-badge {
        width: 56px;
        height: 56px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #283593);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        box-shadow: 0 4px 14px rgba(26,42,108,0.28);
    }

    .bca-curriculum-badge--gold {
        background: linear-gradient(135deg, #f5b800, #e07b00);
    }

    .bca-curriculum-badge--teal {
        background: linear-gradient(135deg, #0d1b5e, #1a2a6c);
    }

    .bca-curriculum-badge-year {
        font-size: 16px;
        font-weight: 900;
        color: #fff;
        letter-spacing: 0.5px;
    }

    .bca-curriculum-badge--gold .bca-curriculum-badge-year {
        color: #0d1b5e;
    }

    .bca-curriculum-step-meta { flex: 1; }

    .bca-curriculum-phase {
        font-size: 14.5px;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 3px;
        line-height: 1.3;
    }

    .bca-curriculum-phase-desc {
        font-size: 11.5px;
        color: #7a8ab0;
        font-weight: 600;
        margin: 0;
    }

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

    .bca-curriculum-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13px;
        color: #4a5568;
        padding: 7px 0;
        border-bottom: 1px dashed #e0e7f3;
        line-height: 1.55;
    }

    .bca-curriculum-list li:last-child { border-bottom: none; }

    .bca-curriculum-list li::before {
        content: "\f00c";
        font-family: "Font Awesome 6 Free";
        font-weight: 900;
        color: #f5b800;
        font-size: 10px;
        margin-top: 4px;
        flex-shrink: 0;
    }

    .bca-curriculum-connector {
        display: flex;
        align-items: center;
        justify-content: center;
        padding-top: 50px;
    }

    .bca-curriculum-connector::after {
        content: "";
        display: block;
        width: 28px;
        height: 2px;
        background: linear-gradient(90deg, #1a2a6c, #f5b800);
        border-radius: 2px;
    }

    /* ================================================================
    SUBJECTS GRID
    ================================================================ */
    .bca-section--subjects {
        background: #f4f6f9;
    }

    .bca-subject-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
    }

    .bca-subject-card {
        background: #fff;
        border-radius: 14px;
        padding: 22px 20px;
        border-left: 4px solid #1a2a6c;
        box-shadow: 0 2px 12px rgba(13,27,94,0.07);
        transition: transform 0.22s ease, border-left-color 0.22s ease, box-shadow 0.22s ease;
    }

    .bca-subject-card:hover {
        transform: translateY(-4px);
        border-left-color: #f5b800;
        box-shadow: 0 10px 28px rgba(13,27,94,0.12);
    }

    .bca-subject-name {
        font-size: 14px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 8px;
        line-height: 1.35;
    }

    .bca-subject-desc {
        font-size: 13px;
        color: #5a6a8a;
        line-height: 1.65;
        margin: 0;
    }

    /* ================================================================
    LABS SECTION
    ================================================================ */
    .bca-section--labs {
        background:
            linear-gradient(120deg, rgba(13,27,94,0.97) 0%, rgba(26,42,108,0.95) 50%, rgba(40,53,147,0.92) 100%);
        position: relative;
        overflow: hidden;
    }

    .bca-section--labs::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(circle at 10% 20%, rgba(245,184,0,0.18) 0%, transparent 50%),
                    radial-gradient(circle at 85% 75%, rgba(255,255,255,0.07) 0%, transparent 48%);
        pointer-events: none;
    }

    .bca-labs-inner {
        position: relative;
        z-index: 1;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 56px;
        align-items: center;
    }

    .bca-labs-title {
        font-size: clamp(22px, 3vw, 30px);
        font-weight: 800;
        color: #fff;
        line-height: 1.3;
        margin-bottom: 16px;
    }

    .bca-labs-text {
        font-size: 15px;
        color: rgba(255,255,255,0.82);
        line-height: 1.8;
        margin-bottom: 24px;
    }

    .bca-labs-checklist {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .bca-labs-checklist li {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 14px;
        color: rgba(255,255,255,0.88);
        font-weight: 500;
    }

    .bca-labs-checklist i {
        width: 22px;
        height: 22px;
        border-radius: 50%;
        background: rgba(245,184,0,0.20);
        border: 1px solid rgba(245,184,0,0.50);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 10px;
        flex-shrink: 0;
    }

    .bca-labs-cards {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }

    .bca-labs-mini {
        background: rgba(255,255,255,0.10);
        border: 1px solid rgba(255,255,255,0.18);
        border-radius: 14px;
        padding: 20px 18px;
        display: flex;
        flex-direction: column;
        gap: 8px;
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
        transition: background 0.22s ease, transform 0.22s ease;
    }

    .bca-labs-mini:hover {
        background: rgba(255,255,255,0.16);
        transform: translateY(-3px);
    }

    .bca-labs-mini-icon {
        width: 40px;
        height: 40px;
        border-radius: 10px;
        background: rgba(245,184,0,0.18);
        border: 1px solid rgba(245,184,0,0.40);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 17px;
    }

    .bca-labs-mini strong {
        font-size: 13.5px;
        font-weight: 800;
        color: #fff;
        display: block;
    }

    .bca-labs-mini span {
        font-size: 12.5px;
        color: rgba(255,255,255,0.72);
        line-height: 1.5;
        display: block;
    }

    /* ================================================================
    OUTCOMES GRID
    ================================================================ */
    .bca-section--outcomes {
        background: #fff;
    }

    .bca-outcome-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
    }

    .bca-outcome-card {
        background: linear-gradient(160deg, #f9faff 0%, #eef2ff 100%);
        border-radius: 16px;
        padding: 28px 22px;
        border: 1px solid #dce4f8;
        text-align: center;
        transition: transform 0.22s ease, box-shadow 0.22s ease;
    }

    .bca-outcome-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 12px 32px rgba(26,42,108,0.12);
    }

    .bca-outcome-icon {
        width: 56px;
        height: 56px;
        border-radius: 50%;
        background: linear-gradient(135deg, #0d1b5e, #1a2a6c);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        margin: 0 auto 16px;
        box-shadow: 0 4px 12px rgba(13,27,94,0.22);
    }

    .bca-outcome-title {
        font-size: 14.5px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 10px;
    }

    .bca-outcome-text {
        font-size: 13px;
        color: #5a6a8a;
        line-height: 1.7;
        margin: 0;
    }

    /* ================================================================
    CAREER SECTION
    ================================================================ */
    .bca-section--careers {
        background:
            linear-gradient(120deg, rgba(13,27,94,0.97) 0%, rgba(26,42,108,0.95) 50%, rgba(40,53,147,0.92) 100%);
        position: relative;
        overflow: hidden;
    }

    .bca-section--careers::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(circle at 15% 25%, rgba(245,184,0,0.18) 0%, transparent 55%),
                    radial-gradient(circle at 80% 70%, rgba(255,255,255,0.06) 0%, transparent 50%);
        pointer-events: none;
    }

    .bca-careers-inner {
        position: relative;
        z-index: 1;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 56px;
        align-items: center;
    }

    .bca-careers-title {
        font-size: clamp(22px, 3vw, 30px);
        font-weight: 800;
        color: #fff;
        line-height: 1.3;
        margin-bottom: 16px;
    }

    .bca-careers-text {
        font-size: 15px;
        color: rgba(255,255,255,0.82);
        line-height: 1.8;
        margin-bottom: 26px;
    }

    .bca-careers-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
    }

    .bca-careers-tags-wrap {
        background: rgba(255,255,255,0.08);
        border: 1px solid rgba(255,255,255,0.16);
        border-radius: 20px;
        padding: 28px 24px;
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
    }

    .bca-careers-tags-title {
        font-size: 13px;
        font-weight: 700;
        color: #f5b800;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        margin-bottom: 18px;
    }

    .bca-careers-tags {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .bca-careers-tag {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.35);
        color: rgba(255,255,255,0.92);
        font-size: 12.5px;
        font-weight: 600;
        padding: 7px 14px;
        border-radius: 999px;
        transition: background 0.2s ease, transform 0.2s ease;
    }

    .bca-careers-tag:hover {
        background: rgba(245,184,0,0.25);
        transform: translateY(-2px);
    }

    .bca-careers-tag i {
        color: #f5b800;
        font-size: 10px;
    }

    /* ================================================================
    ADMISSION STEPS
    ================================================================ */
    .bca-section--admission {
        background: #f4f6f9;
    }

    .bca-admission-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
        margin-bottom: 36px;
    }

    .bca-admission-step {
        background: #fff;
        border-radius: 16px;
        padding: 28px 22px;
        text-align: center;
        box-shadow: 0 4px 18px rgba(13,27,94,0.07);
        border-bottom: 3px solid #e8ecf4;
        transition: transform 0.22s ease, box-shadow 0.22s ease, border-bottom-color 0.22s ease;
    }

    .bca-admission-step:hover {
        transform: translateY(-5px);
        box-shadow: 0 14px 36px rgba(13,27,94,0.13);
        border-bottom-color: #f5b800;
    }

    .bca-admission-step-num {
        font-size: 38px;
        font-weight: 900;
        color: rgba(26,42,108,0.10);
        line-height: 1;
        margin-bottom: 14px;
        letter-spacing: -1px;
    }

    .bca-admission-step-title {
        font-size: 15px;
        font-weight: 800;
        color: #0d1b5e;
        margin-bottom: 10px;
    }

    .bca-admission-step-text {
        font-size: 13px;
        color: #5a6a8a;
        line-height: 1.7;
        margin: 0;
    }

    .bca-admission-links {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 14px;
    }

    /* ================================================================
    CTA SECTION
    ================================================================ */
    .bca-section--cta {
        background: linear-gradient(120deg, #0d1b5e 0%, #1a2a6c 48%, #283593 100%);
        padding: 64px 0;
    }

    .bca-cta-box {
        text-align: center;
        max-width: 820px;
        margin: 0 auto;
    }

    .bca-cta-icon {
        width: 72px;
        height: 72px;
        border-radius: 50%;
        background: rgba(245,184,0,0.15);
        border: 2px solid rgba(245,184,0,0.45);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 26px;
        margin: 0 auto 22px;
    }

    .bca-cta-title {
        font-size: clamp(22px, 3.5vw, 32px);
        font-weight: 800;
        color: #fff;
        margin-bottom: 14px;
        line-height: 1.3;
    }

    .bca-cta-text {
        font-size: 15.5px;
        color: rgba(255,255,255,0.80);
        line-height: 1.8;
        margin-bottom: 32px;
    }

    .bca-cta-actions {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 14px;
    }

    /* ================================================================
    RESPONSIVE — TABLET  ≤ 1024px
    ================================================================ */
    @media (max-width: 1024px) {
        .bca-highlights-grid {
            grid-template-columns: repeat(2, 1fr);
        }

        .bca-subject-grid {
            grid-template-columns: repeat(3, 1fr);
        }

        .bca-outcome-grid {
            grid-template-columns: repeat(2, 1fr);
        }

        .bca-curriculum-timeline {
            grid-template-columns: 1fr;
            gap: 0;
        }

        .bca-curriculum-connector {
            padding: 12px 0;
            justify-content: flex-start;
            padding-left: 26px;
        }

        .bca-curriculum-connector::after {
            width: 2px;
            height: 28px;
            background: linear-gradient(180deg, #1a2a6c, #f5b800);
        }

        .bca-overview-grid {
            grid-template-columns: 1fr;
        }

        .bca-overview-panel {
            position: static;
        }

        .bca-admission-grid {
            grid-template-columns: repeat(2, 1fr);
        }

        .bca-careers-inner,
        .bca-labs-inner {
            grid-template-columns: 1fr;
            gap: 36px;
        }
    }

    /* ================================================================
    RESPONSIVE — MOBILE  ≤ 768px
    ================================================================ */
    @media (max-width: 768px) {
        .bca-container {
            padding: 0 16px;
        }

        .bca-section {
            padding: 52px 0;
        }

        .bca-strip-list {
            grid-template-columns: repeat(2, 1fr);
        }

        .bca-strip-item {
            border-right: none;
            border-bottom: 1px solid #e8ecf4;
            padding: 20px 12px;
        }

        .bca-strip-item:nth-child(odd) {
            border-right: 1px solid #e8ecf4;
        }

        .bca-highlights-grid {
            grid-template-columns: 1fr 1fr;
        }

        .bca-subject-grid {
            grid-template-columns: repeat(2, 1fr);
        }

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

        .bca-hero-actions {
            flex-direction: column;
            align-items: flex-start;
        }

        .bca-hero-btn {
            width: 100%;
            justify-content: center;
            max-width: 280px;
        }

        .bca-cta-actions {
            flex-direction: column;
            align-items: center;
        }

        .bca-btn--lg {
            width: 100%;
            justify-content: center;
            max-width: 280px;
        }

        .bca-admission-links {
            flex-direction: column;
            align-items: center;
        }

        .bca-labs-cards {
            grid-template-columns: 1fr;
        }
    }

    /* ================================================================
    RESPONSIVE — SMALL MOBILE  ≤ 480px
    ================================================================ */
    @media (max-width: 480px) {
        .bca-strip-list {
            grid-template-columns: 1fr;
        }

        .bca-strip-item {
            border-right: none !important;
            border-bottom: 1px solid #e8ecf4;
        }

        .bca-highlights-grid {
            grid-template-columns: 1fr;
        }

        .bca-subject-grid {
            grid-template-columns: 1fr;
        }

        .bca-outcome-grid {
            grid-template-columns: 1fr;
        }

        .bca-panel-actions {
            flex-direction: column;
        }
    }

    /* ================================================================
    REDUCED MOTION
    ================================================================ */
    @media (prefers-reduced-motion: reduce) {
        .bca-highlight-card,
        .bca-subject-card,
        .bca-outcome-card,
        .bca-admission-step,
        .bca-curriculum-step,
        .bca-hero-btn,
        .bca-btn,
        .bca-panel-btn,
        .bca-careers-tag,
        .bca-labs-mini {
            transition: none;
        }

        .bca-highlight-card:hover .bca-highlight-icon {
            transform: none;
        }
    }

    /* ================================================================
    PMIR – PERSONNEL MANAGEMENT & INDUSTRIAL RELATIONS PROGRAMME PAGE
    Brand: Navy #0d1b5e · Blue #1a2a6c · Gold #f5b800
    ================================================================ */

    .pmir-page { background-color: #f4f6f9; }

    .pmir-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
    }

    /* ---- Hero ---- */
    .pmir-hero {
        background:
            linear-gradient(135deg, rgba(13,27,94,0.96) 0%, rgba(26,42,108,0.93) 50%, rgba(40,53,147,0.89) 100%),
            linear-gradient(to bottom right, #0d1b5e, #283593);
        background-blend-mode: multiply, normal;
    }

    .pmir-hero-badge {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(245,184,0,0.18);
        border: 1px solid rgba(245,184,0,0.45);
        color: #f5b800;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        padding: 6px 16px;
        border-radius: 999px;
        margin-bottom: 18px;
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
    }

    .pmir-hero-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 14px;
        margin-top: 28px;
    }

    .pmir-hero-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 14.5px;
        font-weight: 700;
        padding: 13px 28px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.22s ease, box-shadow 0.22s ease, color 0.22s ease;
    }

    .pmir-hero-btn--primary {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 6px 20px rgba(245,184,0,0.40);
    }

    .pmir-hero-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 28px rgba(245,184,0,0.55);
        color: #0a1440;
    }

    .pmir-hero-btn--ghost {
        background: transparent;
        color: #fff;
        border: 2px solid rgba(255,255,255,0.50);
    }

    .pmir-hero-btn--ghost:hover {
        border-color: #f5b800;
        color: #f5b800;
        transform: translateY(-2px);
    }

    /* ---- Stats Strip ---- */
    .pmir-strip {
        background: #fff;
        border-top: 3px solid #f5b800;
        box-shadow: 0 4px 22px rgba(13,27,94,0.08);
    }

    .pmir-strip-list {
        list-style: none;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        margin: 0;
        padding: 0;
    }

    .pmir-strip-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 6px;
        padding: 28px 16px;
        border-right: 1px solid #e8ecf4;
        text-align: center;
        transition: background 0.2s ease;
    }

    .pmir-strip-item:last-child { border-right: none; }
    .pmir-strip-item:hover { background: #f0f4ff; }

    .pmir-strip-icon {
        width: 52px;
        height: 52px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #283593);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        box-shadow: 0 4px 14px rgba(26,42,108,0.22);
    }

    .pmir-strip-val { font-size: 17px; font-weight: 800; color: #0d1b5e; line-height: 1.2; }
    .pmir-strip-lbl { font-size: 12px; color: #5a6a8a; font-weight: 500; }

    /* ---- Sections ---- */
    .pmir-section { padding: 72px 0; }
    .pmir-section-head { margin-bottom: 44px; max-width: 700px; }
    .pmir-section-head--center { text-align: center; margin-left: auto; margin-right: auto; }

    /* ---- Tags ---- */
    .pmir-tag {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(26,42,108,0.08);
        color: #1a2a6c;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        padding: 5px 14px;
        border-radius: 999px;
        margin-bottom: 14px;
    }

    .pmir-tag--dark  { background: rgba(13,27,94,0.10); color: #0d1b5e; }
    .pmir-tag--light {
        background: rgba(255,255,255,0.14);
        color: rgba(255,255,255,0.95);
        border: 1px solid rgba(255,255,255,0.30);
    }

    /* ---- Typography ---- */
    .pmir-title {
        font-size: clamp(22px, 3vw, 30px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
        margin: 0 0 16px;
    }

    .pmir-accent        { color: #f5b800; }
    .pmir-accent--light { color: #ffd54f; }

    .pmir-text { font-size: 15px; color: #4a5568; line-height: 1.8; margin-bottom: 14px; }
    .pmir-lead { font-size: 15.5px; color: #5a6a8a; line-height: 1.75; margin: 0; }

    .pmir-note {
        margin-top: 28px;
        font-size: 13.5px;
        color: #5a6a8a;
        background: rgba(26,42,108,0.05);
        border-left: 3px solid #f5b800;
        padding: 12px 18px;
        border-radius: 0 8px 8px 0;
    }

    .pmir-note a { color: #1a2a6c; font-weight: 700; text-decoration: underline; }
    .pmir-note a:hover { color: #f5b800; }

    /* ---- Buttons ---- */
    .pmir-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13.5px;
        font-weight: 700;
        padding: 11px 22px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
        border: 2px solid transparent;
    }

    .pmir-btn--lg { padding: 14px 30px; font-size: 15px; }

    .pmir-btn--gold {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 16px rgba(245,184,0,0.35);
    }

    .pmir-btn--gold:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 22px rgba(245,184,0,0.50);
        color: #0a1440;
    }

    .pmir-btn--ghost {
        background: transparent;
        color: rgba(255,255,255,0.90);
        border-color: rgba(255,255,255,0.45);
    }

    .pmir-btn--ghost:hover { border-color: #f5b800; color: #f5b800; transform: translateY(-2px); }

    .pmir-btn--outline-light {
        background: transparent;
        color: rgba(255,255,255,0.90);
        border-color: rgba(255,255,255,0.50);
    }

    .pmir-btn--outline-light:hover {
        background: rgba(255,255,255,0.12);
        border-color: #f5b800;
        color: #f5b800;
        transform: translateY(-2px);
    }

    /* ================================================================
    OVERVIEW
    ================================================================ */
    .pmir-section--overview { background: #fff; }

    .pmir-overview-grid {
        display: grid;
        grid-template-columns: 1fr 360px;
        gap: 48px;
        align-items: start;
    }

    .pmir-overview-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }

    .pmir-chip {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        background: #f0f4ff;
        color: #1a2a6c;
        font-size: 12.5px;
        font-weight: 600;
        padding: 6px 14px;
        border-radius: 999px;
        border: 1px solid #c7d2f0;
    }

    .pmir-chip i { color: #f5b800; }

    .pmir-overview-panel {
        background: linear-gradient(160deg, #0d1b5e 0%, #1a2a6c 55%, #283593 100%);
        border-radius: 18px;
        padding: 30px 28px 28px;
        color: #fff;
        box-shadow: 0 16px 48px rgba(13,27,94,0.28);
        position: sticky;
        top: 80px;
    }

    .pmir-panel-title {
        font-size: 16px;
        font-weight: 800;
        color: #f5b800;
        margin-bottom: 20px;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .pmir-panel-list { list-style: none; padding: 0; margin: 0 0 22px; }

    .pmir-panel-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13.5px;
        color: rgba(255,255,255,0.88);
        padding: 9px 0;
        border-bottom: 1px solid rgba(255,255,255,0.10);
        line-height: 1.5;
    }

    .pmir-panel-list li:last-child { border-bottom: none; }
    .pmir-panel-list i { color: #f5b800; margin-top: 3px; flex-shrink: 0; font-size: 11px; }
    .pmir-panel-list strong { color: rgba(255,255,255,0.70); font-weight: 600; }

    .pmir-panel-actions { display: flex; flex-direction: column; gap: 10px; }

    .pmir-panel-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        font-size: 13px;
        font-weight: 700;
        padding: 10px 16px;
        border-radius: 999px;
        text-decoration: none;
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 12px rgba(245,184,0,0.30);
        transition: transform 0.2s ease, color 0.2s ease;
    }

    .pmir-panel-btn:hover { transform: translateY(-2px); color: #0a1440; }

    .pmir-panel-btn--ghost {
        background: transparent;
        color: rgba(255,255,255,0.85);
        border: 2px solid rgba(255,255,255,0.35);
        box-shadow: none;
    }

    .pmir-panel-btn--ghost:hover { border-color: #f5b800; color: #f5b800; }

    /* ================================================================
    HIGHLIGHTS
    ================================================================ */
    .pmir-section--highlights { background: #f4f6f9; }

    .pmir-highlights-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
    }

    .pmir-highlight-card {
        background: #fff;
        border-radius: 16px;
        padding: 32px 24px;
        text-align: center;
        box-shadow: 0 4px 20px rgba(13,27,94,0.07);
        border-top: 3px solid transparent;
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

    .pmir-highlight-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 12px 36px rgba(13,27,94,0.13);
        border-top-color: #f5b800;
    }

    .pmir-highlight-icon {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #283593);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        margin: 0 auto 18px;
        box-shadow: 0 4px 14px rgba(26,42,108,0.25);
        transition: transform 0.25s ease;
    }

    .pmir-highlight-card:hover .pmir-highlight-icon { transform: scale(1.10) rotate(-4deg); }

    .pmir-highlight-title { font-size: 15.5px; font-weight: 800; color: #0d1b5e; margin-bottom: 10px; }
    .pmir-highlight-text  { font-size: 13.5px; color: #5a6a8a; line-height: 1.75; }

    /* ================================================================
    CURRICULUM TIMELINE (2-year — 2 columns)
    ================================================================ */
    .pmir-section--curriculum { background: #fff; }

    .pmir-curriculum-timeline {
        display: grid;
        grid-template-columns: 1fr 48px 1fr;
        align-items: start;
        margin-top: 8px;
        gap: 0;
    }

    .pmir-curriculum-step {
        background: #f9faff;
        border-radius: 16px;
        padding: 28px 24px;
        border: 1px solid #e0e7f3;
        transition: transform 0.22s ease, box-shadow 0.22s ease;
    }

    .pmir-curriculum-step:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 32px rgba(13,27,94,0.11);
    }

    .pmir-curriculum-step-head {
        display: flex;
        align-items: center;
        gap: 14px;
        margin-bottom: 18px;
    }

    .pmir-curriculum-badge {
        width: 54px;
        height: 54px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #283593);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        box-shadow: 0 4px 14px rgba(26,42,108,0.28);
    }

    .pmir-curriculum-badge--gold { background: linear-gradient(135deg, #f5b800, #e07b00); }

    .pmir-curriculum-badge span { font-size: 15px; font-weight: 900; color: #fff; }
    .pmir-curriculum-badge--gold span { color: #0d1b5e; }

    .pmir-curriculum-phase { font-size: 14.5px; font-weight: 800; color: #0d1b5e; margin: 0 0 3px; }
    .pmir-curriculum-phase-desc { font-size: 11.5px; color: #7a8ab0; font-weight: 600; margin: 0; }

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

    .pmir-curriculum-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13px;
        color: #4a5568;
        padding: 7px 0;
        border-bottom: 1px dashed #e0e7f3;
        line-height: 1.55;
    }

    .pmir-curriculum-list li:last-child { border-bottom: none; }

    .pmir-curriculum-list li::before {
        content: "\f00c";
        font-family: "Font Awesome 6 Free";
        font-weight: 900;
        color: #f5b800;
        font-size: 10px;
        margin-top: 4px;
        flex-shrink: 0;
    }

    .pmir-curriculum-connector {
        display: flex;
        align-items: center;
        justify-content: center;
        padding-top: 50px;
    }

    .pmir-curriculum-connector::after {
        content: "";
        display: block;
        width: 32px;
        height: 2px;
        background: linear-gradient(90deg, #1a2a6c, #f5b800);
        border-radius: 2px;
    }

    /* ================================================================
    SUBJECTS
    ================================================================ */
    .pmir-section--subjects { background: #f4f6f9; }

    .pmir-subject-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
    }

    .pmir-subject-card {
        background: #fff;
        border-radius: 14px;
        padding: 22px 20px;
        border-left: 4px solid #1a2a6c;
        box-shadow: 0 2px 12px rgba(13,27,94,0.07);
        transition: transform 0.22s ease, border-left-color 0.22s ease, box-shadow 0.22s ease;
    }

    .pmir-subject-card:hover {
        transform: translateY(-4px);
        border-left-color: #f5b800;
        box-shadow: 0 10px 28px rgba(13,27,94,0.12);
    }

    .pmir-subject-name { font-size: 14px; font-weight: 800; color: #0d1b5e; margin-bottom: 8px; line-height: 1.35; }
    .pmir-subject-desc { font-size: 13px; color: #5a6a8a; line-height: 1.65; margin: 0; }

    /* ================================================================
    CAREERS
    ================================================================ */
    .pmir-section--careers {
        background: linear-gradient(135deg, rgba(13,27,94,0.97) 0%, rgba(26,42,108,0.95) 50%, rgba(40,53,147,0.92) 100%);
        position: relative;
        overflow: hidden;
    }

    .pmir-section--careers::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(circle at 15% 25%, rgba(245,184,0,0.18) 0%, transparent 55%),
                    radial-gradient(circle at 80% 70%, rgba(255,255,255,0.06) 0%, transparent 50%);
        pointer-events: none;
    }

    .pmir-careers-inner {
        position: relative;
        z-index: 1;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 56px;
        align-items: center;
    }

    .pmir-careers-title { font-size: clamp(22px, 3vw, 30px); font-weight: 800; color: #fff; line-height: 1.3; margin-bottom: 16px; }
    .pmir-careers-text  { font-size: 15px; color: rgba(255,255,255,0.82); line-height: 1.8; margin-bottom: 26px; }
    .pmir-careers-actions { display: flex; flex-wrap: wrap; gap: 12px; }

    .pmir-careers-tags-wrap {
        background: rgba(255,255,255,0.08);
        border: 1px solid rgba(255,255,255,0.16);
        border-radius: 20px;
        padding: 28px 24px;
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
    }

    .pmir-careers-tags-title {
        font-size: 13px;
        font-weight: 700;
        color: #f5b800;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        margin-bottom: 18px;
    }

    .pmir-careers-tags { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 10px; }

    .pmir-careers-tag {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.35);
        color: rgba(255,255,255,0.92);
        font-size: 12.5px;
        font-weight: 600;
        padding: 7px 14px;
        border-radius: 999px;
        transition: background 0.2s ease, transform 0.2s ease;
    }

    .pmir-careers-tag:hover { background: rgba(245,184,0,0.25); transform: translateY(-2px); }
    .pmir-careers-tag i { color: #f5b800; font-size: 10px; }

    /* ================================================================
    CTA
    ================================================================ */
    .pmir-section--cta {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 48%, #283593 100%);
        padding: 64px 0;
    }

    .pmir-cta-box { text-align: center; max-width: 780px; margin: 0 auto; }

    .pmir-cta-icon {
        width: 72px;
        height: 72px;
        border-radius: 50%;
        background: rgba(245,184,0,0.15);
        border: 2px solid rgba(245,184,0,0.45);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 26px;
        margin: 0 auto 22px;
    }

    .pmir-cta-title { font-size: clamp(22px, 3.5vw, 32px); font-weight: 800; color: #fff; margin-bottom: 14px; line-height: 1.3; }
    .pmir-cta-text  { font-size: 15.5px; color: rgba(255,255,255,0.80); line-height: 1.8; margin-bottom: 32px; }
    .pmir-cta-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }

    /* ================================================================
    RESPONSIVE — TABLET ≤ 1024px
    ================================================================ */
    @media (max-width: 1024px) {
        .pmir-highlights-grid      { grid-template-columns: repeat(2, 1fr); }
        .pmir-subject-grid         { grid-template-columns: repeat(2, 1fr); }
        .pmir-overview-grid        { grid-template-columns: 1fr; }
        .pmir-overview-panel       { position: static; }
        .pmir-careers-inner        { grid-template-columns: 1fr; gap: 36px; }

        .pmir-curriculum-timeline  { grid-template-columns: 1fr; }

        .pmir-curriculum-connector {
            padding: 12px 0;
            justify-content: flex-start;
            padding-left: 26px;
        }

        .pmir-curriculum-connector::after {
            width: 2px;
            height: 28px;
            background: linear-gradient(180deg, #1a2a6c, #f5b800);
        }
    }

    /* ================================================================
    RESPONSIVE — MOBILE ≤ 768px
    ================================================================ */
    @media (max-width: 768px) {
        .pmir-container { padding: 0 16px; }
        .pmir-section   { padding: 52px 0; }

        .pmir-strip-list { grid-template-columns: repeat(2, 1fr); }

        .pmir-strip-item {
            border-right: none;
            border-bottom: 1px solid #e8ecf4;
            padding: 20px 12px;
        }

        .pmir-strip-item:nth-child(odd) { border-right: 1px solid #e8ecf4; }

        .pmir-hero-actions { flex-direction: column; align-items: flex-start; }

        .pmir-hero-btn {
            width: 100%;
            justify-content: center;
            max-width: 280px;
        }

        .pmir-cta-actions { flex-direction: column; align-items: center; }

        .pmir-btn--lg {
            width: 100%;
            justify-content: center;
            max-width: 280px;
        }
    }

    /* ================================================================
    RESPONSIVE — SMALL MOBILE ≤ 480px
    ================================================================ */
    @media (max-width: 480px) {
        .pmir-strip-list { grid-template-columns: 1fr; }

        .pmir-strip-item {
            border-right: none !important;
            border-bottom: 1px solid #e8ecf4;
        }

        .pmir-highlights-grid { grid-template-columns: 1fr; }
        .pmir-subject-grid    { grid-template-columns: 1fr; }
        .pmir-panel-actions   { flex-direction: column; }
    }

    @media (prefers-reduced-motion: reduce) {
        .pmir-highlight-card,
        .pmir-subject-card,
        .pmir-curriculum-step,
        .pmir-hero-btn,
        .pmir-btn,
        .pmir-panel-btn,
        .pmir-careers-tag { transition: none; }

        .pmir-highlight-card:hover .pmir-highlight-icon { transform: none; }
    }

    /* ================================================================
    MSW – MASTER OF SOCIAL WORK PROGRAMME PAGE
    Brand: Navy #0d1b5e · Blue #1a2a6c · Gold #f5b800
    ================================================================ */

    .msw-page { background-color: #f4f6f9; }

    .msw-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
    }

    /* ---- Hero ---- */
    .msw-hero {
        background:
            linear-gradient(135deg, rgba(13,27,94,0.96) 0%, rgba(26,42,108,0.93) 50%, rgba(57,73,171,0.89) 100%),
            linear-gradient(to bottom right, #0d1b5e, #3949ab);
        background-blend-mode: multiply, normal;
    }

    .msw-hero-badge {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(245,184,0,0.18);
        border: 1px solid rgba(245,184,0,0.45);
        color: #f5b800;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        padding: 6px 16px;
        border-radius: 999px;
        margin-bottom: 18px;
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
    }

    .msw-hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }

    .msw-hero-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 14.5px;
        font-weight: 700;
        padding: 13px 28px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.22s ease, box-shadow 0.22s ease, color 0.22s ease;
    }

    .msw-hero-btn--primary {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 6px 20px rgba(245,184,0,0.40);
    }

    .msw-hero-btn--primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 28px rgba(245,184,0,0.55);
        color: #0a1440;
    }

    .msw-hero-btn--ghost {
        background: transparent;
        color: #fff;
        border: 2px solid rgba(255,255,255,0.50);
    }

    .msw-hero-btn--ghost:hover { border-color: #f5b800; color: #f5b800; transform: translateY(-2px); }

    /* ---- Stats Strip ---- */
    .msw-strip {
        background: #fff;
        border-top: 3px solid #f5b800;
        box-shadow: 0 4px 22px rgba(13,27,94,0.08);
    }

    .msw-strip-list {
        list-style: none;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        margin: 0;
        padding: 0;
    }

    .msw-strip-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 6px;
        padding: 28px 16px;
        border-right: 1px solid #e8ecf4;
        text-align: center;
        transition: background 0.2s ease;
    }

    .msw-strip-item:last-child { border-right: none; }
    .msw-strip-item:hover { background: #f0f4ff; }

    .msw-strip-icon {
        width: 52px;
        height: 52px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #3949ab);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        box-shadow: 0 4px 14px rgba(26,42,108,0.22);
    }

    .msw-strip-val { font-size: 17px; font-weight: 800; color: #0d1b5e; line-height: 1.2; }
    .msw-strip-lbl { font-size: 12px; color: #5a6a8a; font-weight: 500; }

    /* ---- Sections ---- */
    .msw-section { padding: 72px 0; }
    .msw-section-head { margin-bottom: 44px; max-width: 700px; }
    .msw-section-head--center { text-align: center; margin-left: auto; margin-right: auto; }

    /* ---- Tags ---- */
    .msw-tag {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(26,42,108,0.08);
        color: #1a2a6c;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        padding: 5px 14px;
        border-radius: 999px;
        margin-bottom: 14px;
    }

    .msw-tag--dark  { background: rgba(13,27,94,0.10); color: #0d1b5e; }
    .msw-tag--light {
        background: rgba(255,255,255,0.14);
        color: rgba(255,255,255,0.95);
        border: 1px solid rgba(255,255,255,0.30);
    }

    /* ---- Typography ---- */
    .msw-title {
        font-size: clamp(22px, 3vw, 30px);
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
        margin: 0 0 16px;
    }

    .msw-accent        { color: #f5b800; }
    .msw-accent--light { color: #ffd54f; }

    .msw-text { font-size: 15px; color: #4a5568; line-height: 1.8; margin-bottom: 14px; }
    .msw-lead { font-size: 15.5px; color: #5a6a8a; line-height: 1.75; margin: 0; }

    .msw-note {
        margin-top: 28px;
        font-size: 13.5px;
        color: #5a6a8a;
        background: rgba(26,42,108,0.05);
        border-left: 3px solid #f5b800;
        padding: 12px 18px;
        border-radius: 0 8px 8px 0;
    }

    .msw-note a { color: #1a2a6c; font-weight: 700; text-decoration: underline; }
    .msw-note a:hover { color: #f5b800; }

    /* ---- Buttons ---- */
    .msw-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13.5px;
        font-weight: 700;
        padding: 11px 22px;
        border-radius: 999px;
        text-decoration: none;
        transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
        border: 2px solid transparent;
    }

    .msw-btn--lg { padding: 14px 30px; font-size: 15px; }

    .msw-btn--gold {
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 16px rgba(245,184,0,0.35);
    }

    .msw-btn--gold:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(245,184,0,0.50); color: #0a1440; }

    .msw-btn--ghost {
        background: transparent;
        color: rgba(255,255,255,0.90);
        border-color: rgba(255,255,255,0.45);
    }

    .msw-btn--ghost:hover { border-color: #f5b800; color: #f5b800; transform: translateY(-2px); }

    .msw-btn--outline-light {
        background: transparent;
        color: rgba(255,255,255,0.90);
        border-color: rgba(255,255,255,0.50);
    }

    .msw-btn--outline-light:hover {
        background: rgba(255,255,255,0.12);
        border-color: #f5b800;
        color: #f5b800;
        transform: translateY(-2px);
    }

    /* ================================================================
    OVERVIEW
    ================================================================ */
    .msw-section--overview { background: #fff; }

    .msw-overview-grid {
        display: grid;
        grid-template-columns: 1fr 360px;
        gap: 48px;
        align-items: start;
    }

    .msw-overview-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }

    .msw-chip {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        background: #f0f4ff;
        color: #1a2a6c;
        font-size: 12.5px;
        font-weight: 600;
        padding: 6px 14px;
        border-radius: 999px;
        border: 1px solid #c7d2f0;
    }

    .msw-chip i { color: #f5b800; }

    .msw-overview-panel {
        background: linear-gradient(160deg, #0d1b5e 0%, #1a2a6c 55%, #3949ab 100%);
        border-radius: 18px;
        padding: 30px 28px 28px;
        color: #fff;
        box-shadow: 0 16px 48px rgba(13,27,94,0.28);
        position: sticky;
        top: 80px;
    }

    .msw-panel-title {
        font-size: 16px;
        font-weight: 800;
        color: #f5b800;
        margin-bottom: 20px;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .msw-panel-list { list-style: none; padding: 0; margin: 0 0 22px; }

    .msw-panel-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13.5px;
        color: rgba(255,255,255,0.88);
        padding: 9px 0;
        border-bottom: 1px solid rgba(255,255,255,0.10);
        line-height: 1.5;
    }

    .msw-panel-list li:last-child { border-bottom: none; }
    .msw-panel-list i { color: #f5b800; margin-top: 3px; flex-shrink: 0; font-size: 11px; }
    .msw-panel-list strong { color: rgba(255,255,255,0.70); font-weight: 600; }

    .msw-panel-actions { display: flex; flex-direction: column; gap: 10px; }

    .msw-panel-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        font-size: 13px;
        font-weight: 700;
        padding: 10px 16px;
        border-radius: 999px;
        text-decoration: none;
        background: linear-gradient(135deg, #f5b800, #e07b00);
        color: #0d1b5e;
        box-shadow: 0 4px 12px rgba(245,184,0,0.30);
        transition: transform 0.2s ease, color 0.2s ease;
    }

    .msw-panel-btn:hover { transform: translateY(-2px); color: #0a1440; }

    .msw-panel-btn--ghost {
        background: transparent;
        color: rgba(255,255,255,0.85);
        border: 2px solid rgba(255,255,255,0.35);
        box-shadow: none;
    }

    .msw-panel-btn--ghost:hover { border-color: #f5b800; color: #f5b800; }

    /* ================================================================
    HIGHLIGHTS
    ================================================================ */
    .msw-section--highlights { background: #f4f6f9; }

    .msw-highlights-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
    }

    .msw-highlight-card {
        background: #fff;
        border-radius: 16px;
        padding: 32px 24px;
        text-align: center;
        box-shadow: 0 4px 20px rgba(13,27,94,0.07);
        border-top: 3px solid transparent;
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

    .msw-highlight-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 12px 36px rgba(13,27,94,0.13);
        border-top-color: #f5b800;
    }

    .msw-highlight-icon {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #3949ab);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        margin: 0 auto 18px;
        box-shadow: 0 4px 14px rgba(26,42,108,0.25);
        transition: transform 0.25s ease;
    }

    .msw-highlight-card:hover .msw-highlight-icon { transform: scale(1.10) rotate(-4deg); }

    .msw-highlight-title { font-size: 15.5px; font-weight: 800; color: #0d1b5e; margin-bottom: 10px; }
    .msw-highlight-text  { font-size: 13.5px; color: #5a6a8a; line-height: 1.75; }

    /* ================================================================
    CURRICULUM — REDESIGNED MODERN ANIMATED SECTION
    ================================================================ */

    /* Keyframes */
    @keyframes msw-curric-floatup {
        from { opacity: 0; transform: translateY(40px); }
        to   { opacity: 1; transform: translateY(0); }
    }
    @keyframes msw-curric-fadein {
        from { opacity: 0; }
        to   { opacity: 1; }
    }
    @keyframes msw-curric-pulse-glow {
        0%, 100% { opacity: 0.18; transform: scale(1); }
        50%       { opacity: 0.32; transform: scale(1.08); }
    }
    @keyframes msw-curric-conn-flow {
        0%   { background-position: -200% center; }
        100% { background-position:  200% center; }
    }
    @keyframes msw-curric-item-in {
        from { opacity: 0; transform: translateX(-18px); }
        to   { opacity: 1; transform: translateX(0); }
    }

    /* Section wrapper */
    .msw-curric {
        position: relative;
        padding: 90px 0 80px;
        overflow: hidden;
        background: linear-gradient(145deg, #06104a 0%, #0d1b5e 40%, #1a2a6c 70%, #0d1b5e 100%);
    }

    /* Animated background mesh */
    .msw-curric-bg {
        position: absolute;
        inset: 0;
        background:
            radial-gradient(ellipse 80% 60% at 15% 30%,  rgba(245,184,0,0.07) 0%, transparent 60%),
            radial-gradient(ellipse 70% 50% at 85% 70%,  rgba(26,42,108,0.45) 0%, transparent 60%),
            radial-gradient(ellipse 50% 80% at 50% 100%, rgba(13,27,94,0.6)   0%, transparent 70%);
        pointer-events: none;
    }
    .msw-curric-bg::before,
    .msw-curric-bg::after {
        content: "";
        position: absolute;
        border-radius: 50%;
        filter: blur(70px);
        pointer-events: none;
    }
    .msw-curric-bg::before {
        width: 420px; height: 420px;
        top: -100px; left: -80px;
        background: radial-gradient(circle, rgba(245,184,0,0.12) 0%, transparent 70%);
        animation: msw-curric-pulse-glow 7s ease-in-out infinite;
    }
    .msw-curric-bg::after {
        width: 380px; height: 380px;
        bottom: -80px; right: -60px;
        background: radial-gradient(circle, rgba(57,73,171,0.28) 0%, transparent 70%);
        animation: msw-curric-pulse-glow 9s ease-in-out infinite reverse;
    }

    /* Container */
    .msw-curric-wrap { position: relative; z-index: 2; }

    /* Light tag variant for dark bg */
    .msw-tag--light {
        background: rgba(245,184,0,0.15);
        color: #f5b800;
        border: 1px solid rgba(245,184,0,0.35);
    }

    /* Section header */
    .msw-curric-header {
        text-align: center;
        margin-bottom: 56px;
        animation: msw-curric-fadein 0.8s ease both;
    }
    .msw-curric-title {
        font-size: clamp(28px, 4.5vw, 42px);
        font-weight: 900;
        color: #fff;
        line-height: 1.22;
        margin: 14px 0 16px;
        letter-spacing: -0.5px;
    }
    .msw-curric-accent {
        background: linear-gradient(90deg, #f5b800, #ffd740, #e07b00);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }
    .msw-curric-lead {
        font-size: 15.5px;
        color: rgba(255,255,255,0.72);
        max-width: 600px;
        margin: 0 auto;
        line-height: 1.75;
    }

    /* Grid: [card] [connector] [card] */
    .msw-curric-grid {
        display: grid;
        grid-template-columns: 1fr 80px 1fr;
        align-items: center;
        gap: 0;
        margin-bottom: 40px;
    }

    /* ── Cards ── */
    .msw-curric-card {
        position: relative;
        border-radius: 24px;
        padding: 36px 32px 28px;
        overflow: hidden;
        animation: msw-curric-floatup 0.75s cubic-bezier(0.22,1,0.36,1) both;
        transition: transform 0.32s cubic-bezier(0.22,1,0.36,1),
                    box-shadow 0.32s ease;
    }
    .msw-curric-card:hover {
        transform: translateY(-8px) scale(1.01);
    }

    /* Y1 — Navy/Blue gradient card */
    .msw-curric-card--y1 {
        background: linear-gradient(160deg, #1e3a8a 0%, #1a2a6c 45%, #0d1b5e 100%);
        border: 1px solid rgba(245,184,0,0.2);
        box-shadow: 0 24px 60px rgba(13,27,94,0.55), 0 0 0 1px rgba(255,255,255,0.06) inset;
        animation-delay: 0.1s;
    }
    .msw-curric-card--y1:hover {
        box-shadow: 0 32px 80px rgba(13,27,94,0.65), 0 0 32px rgba(245,184,0,0.12);
    }

    /* Y2 — Richer dark with gold accent */
    .msw-curric-card--y2 {
        background: linear-gradient(160deg, #162060 0%, #0d1b5e 45%, #0a1450 100%);
        border: 1px solid rgba(245,184,0,0.35);
        box-shadow: 0 24px 60px rgba(13,27,94,0.55), 0 0 0 1px rgba(245,184,0,0.1) inset;
        animation-delay: 0.3s;
    }
    .msw-curric-card--y2:hover {
        box-shadow: 0 32px 80px rgba(13,27,94,0.65), 0 0 40px rgba(245,184,0,0.22);
    }

    /* Glow blobs inside cards */
    .msw-curric-card-glow {
        position: absolute;
        width: 220px; height: 220px;
        top: -60px; right: -50px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(57,73,171,0.45) 0%, transparent 70%);
        filter: blur(40px);
        pointer-events: none;
        animation: msw-curric-pulse-glow 6s ease-in-out infinite;
    }
    .msw-curric-card-glow--gold {
        background: radial-gradient(circle, rgba(245,184,0,0.3) 0%, transparent 70%);
        animation-duration: 8s;
        animation-direction: reverse;
    }

    /* Decorative watermark number */
    .msw-curric-card-watermark {
        position: absolute;
        top: -10px; right: 18px;
        font-size: 120px;
        font-weight: 900;
        line-height: 1;
        color: rgba(255,255,255,0.04);
        pointer-events: none;
        user-select: none;
        letter-spacing: -4px;
        font-family: 'Arial Black', sans-serif;
    }

    /* Card top row */
    .msw-curric-card-top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 18px;
    }

    /* Year pill badge */
    .msw-curric-year-pill {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        padding: 6px 16px;
        border-radius: 999px;
        font-size: 12.5px;
        font-weight: 800;
        letter-spacing: 0.5px;
        text-transform: uppercase;
    }
    .msw-curric-year-pill--blue {
        background: linear-gradient(90deg, #3949ab, #1a2a6c);
        color: #fff;
        border: 1px solid rgba(255,255,255,0.2);
        box-shadow: 0 4px 14px rgba(57,73,171,0.45);
    }
    .msw-curric-year-pill--gold {
        background: linear-gradient(90deg, #f5b800, #e07b00);
        color: #0d1b5e;
        border: 1px solid rgba(245,184,0,0.5);
        box-shadow: 0 4px 14px rgba(245,184,0,0.4);
    }

    /* Semester label */
    .msw-curric-sems {
        font-size: 11px;
        font-weight: 700;
        color: rgba(255,255,255,0.45);
        text-transform: uppercase;
        letter-spacing: 1px;
    }

    /* Phase heading */
    .msw-curric-phase {
        font-size: 22px;
        font-weight: 900;
        color: #fff;
        margin: 0 0 22px;
        line-height: 1.3;
        letter-spacing: -0.3px;
    }
    .msw-curric-card--y1 .msw-curric-phase span { color: #7c90d4; }
    .msw-curric-card--y2 .msw-curric-phase span { color: #f5b800; }

    /* Items list */
    .msw-curric-list {
        list-style: none;
        padding: 0;
        margin: 0 0 24px;
    }

    .msw-curric-item {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 11px 0;
        font-size: 14px;
        color: rgba(255,255,255,0.82);
        line-height: 1.5;
        border-bottom: 1px solid rgba(255,255,255,0.07);
        opacity: 0;
        animation: msw-curric-item-in 0.5s ease both;
    }
    .msw-curric-item:last-child { border-bottom: none; }

    /* Stagger list items */
    .msw-curric-card--y1 .msw-curric-item:nth-child(1) { animation-delay: 0.35s; }
    .msw-curric-card--y1 .msw-curric-item:nth-child(2) { animation-delay: 0.45s; }
    .msw-curric-card--y1 .msw-curric-item:nth-child(3) { animation-delay: 0.55s; }
    .msw-curric-card--y1 .msw-curric-item:nth-child(4) { animation-delay: 0.65s; }
    .msw-curric-card--y1 .msw-curric-item:nth-child(5) { animation-delay: 0.75s; }
    .msw-curric-card--y2 .msw-curric-item:nth-child(1) { animation-delay: 0.55s; }
    .msw-curric-card--y2 .msw-curric-item:nth-child(2) { animation-delay: 0.65s; }
    .msw-curric-card--y2 .msw-curric-item:nth-child(3) { animation-delay: 0.75s; }
    .msw-curric-card--y2 .msw-curric-item:nth-child(4) { animation-delay: 0.85s; }
    .msw-curric-card--y2 .msw-curric-item:nth-child(5) { animation-delay: 0.95s; }

    /* Dot bullet */
    .msw-curric-item-dot {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 8px; height: 8px;
        border-radius: 50%;
        background: linear-gradient(135deg, #3949ab, #7c90d4);
        flex-shrink: 0;
        box-shadow: 0 0 6px rgba(57,73,171,0.7);
    }
    .msw-curric-item-dot--gold {
        background: linear-gradient(135deg, #f5b800, #ffd740);
        box-shadow: 0 0 6px rgba(245,184,0,0.7);
    }

    /* Card footer bar */
    .msw-curric-card-footer {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 10px 14px;
        background: rgba(255,255,255,0.06);
        border: 1px solid rgba(255,255,255,0.1);
        border-radius: 10px;
        font-size: 12.5px;
        font-weight: 700;
        color: rgba(255,255,255,0.65);
        backdrop-filter: blur(8px);
    }
    .msw-curric-card-footer i { color: #7c90d4; font-size: 14px; }
    .msw-curric-card-footer--gold { border-color: rgba(245,184,0,0.25); }
    .msw-curric-card-footer--gold i { color: #f5b800; }

    /* ── Connector ── */
    .msw-curric-connector {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0;
        height: 100%;
        min-height: 200px;
        justify-content: center;
        animation: msw-curric-fadein 0.9s ease 0.4s both;
    }
    .msw-curric-conn-line {
        flex: 1;
        width: 2px;
        min-height: 40px;
        background: linear-gradient(180deg,
            rgba(245,184,0,0)    0%,
            rgba(245,184,0,0.7) 40%,
            rgba(57,73,171,0.7) 60%,
            rgba(57,73,171,0)  100%);
        background-size: 100% 400%;
        animation: msw-curric-conn-flow 3s linear infinite;
    }
    .msw-curric-conn-icon {
        width: 44px; height: 44px;
        border-radius: 50%;
        background: linear-gradient(135deg, #1a2a6c, #3949ab);
        border: 2px solid rgba(245,184,0,0.45);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 14px;
        box-shadow: 0 0 20px rgba(245,184,0,0.25), 0 4px 16px rgba(13,27,94,0.5);
        flex-shrink: 0;
        animation: msw-curric-pulse-glow 3s ease-in-out infinite;
    }

    /* Note bar */
    .msw-curric-note {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        font-size: 13.5px;
        color: rgba(255,255,255,0.55);
        background: rgba(255,255,255,0.06);
        border: 1px solid rgba(255,255,255,0.1);
        border-radius: 12px;
        padding: 14px 22px;
        max-width: 600px;
        margin: 0 auto;
        backdrop-filter: blur(10px);
        line-height: 1.6;
        text-align: center;
    }
    .msw-curric-note i { color: #f5b800; font-size: 16px; flex-shrink: 0; }
    .msw-curric-note a { color: #f5b800; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
    .msw-curric-note a:hover { color: #ffd740; }

    /* Reduced-motion */
    @media (prefers-reduced-motion: reduce) {
        .msw-curric-card,
        .msw-curric-item,
        .msw-curric-header,
        .msw-curric-connector,
        .msw-curric-bg::before,
        .msw-curric-bg::after,
        .msw-curric-card-glow,
        .msw-curric-conn-icon {
            animation: none !important;
            opacity: 1 !important;
            transform: none !important;
        }
        .msw-curric-conn-line { animation: none !important; }
    }

    /* ── Responsive ── */
    @media (max-width: 1024px) {
        .msw-curric { padding: 70px 0 60px; }
        .msw-curric-card { padding: 28px 24px 22px; }
        .msw-curric-phase { font-size: 19px; }
    }

    @media (max-width: 768px) {
        .msw-curric-grid {
            grid-template-columns: 1fr;
            gap: 0;
        }
        .msw-curric-connector {
            flex-direction: row;
            min-height: auto;
            height: 56px;
            justify-content: center;
        }
        .msw-curric-conn-line {
            flex: 1;
            height: 2px;
            width: auto;
            min-height: 0;
            background: linear-gradient(90deg,
                rgba(245,184,0,0)    0%,
                rgba(245,184,0,0.7) 40%,
                rgba(57,73,171,0.7) 60%,
                rgba(57,73,171,0)  100%);
            background-size: 400% 100%;
            animation: msw-curric-conn-flow 3s linear infinite;
        }
        .msw-curric-conn-icon { transform: rotate(90deg); }
        .msw-curric-card--y1,
        .msw-curric-card--y2 { animation-delay: 0s; }
        .msw-curric-card-watermark { font-size: 90px; }
        .msw-curric-header { margin-bottom: 40px; }
        .msw-curric-note { flex-direction: column; text-align: center; gap: 6px; }
    }

    @media (max-width: 480px) {
        .msw-curric { padding: 56px 0 48px; }
        .msw-curric-card { padding: 22px 18px 18px; border-radius: 18px; }
        .msw-curric-phase { font-size: 17px; }
        .msw-curric-item { font-size: 13px; }
        .msw-curric-card-watermark { display: none; }
    }

    /* ================================================================
    SUBJECTS
    ================================================================ */
    .msw-section--subjects { background: #f4f6f9; }

    .msw-subject-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
    }

    .msw-subject-card {
        background: #fff;
        border-radius: 14px;
        padding: 22px 20px;
        border-left: 4px solid #1a2a6c;
        box-shadow: 0 2px 12px rgba(13,27,94,0.07);
        transition: transform 0.22s ease, border-left-color 0.22s ease, box-shadow 0.22s ease;
    }

    .msw-subject-card:hover {
        transform: translateY(-4px);
        border-left-color: #f5b800;
        box-shadow: 0 10px 28px rgba(13,27,94,0.12);
    }

    .msw-subject-name { font-size: 14px; font-weight: 800; color: #0d1b5e; margin-bottom: 8px; line-height: 1.35; }
    .msw-subject-desc { font-size: 13px; color: #5a6a8a; line-height: 1.65; margin: 0; }

    /* ================================================================
    CAREERS
    ================================================================ */
    .msw-section--careers {
        background: linear-gradient(135deg, rgba(13,27,94,0.97) 0%, rgba(26,42,108,0.95) 50%, rgba(57,73,171,0.92) 100%);
        position: relative;
        overflow: hidden;
    }

    .msw-section--careers::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(circle at 15% 25%, rgba(245,184,0,0.18) 0%, transparent 55%),
                    radial-gradient(circle at 80% 70%, rgba(255,255,255,0.06) 0%, transparent 50%);
        pointer-events: none;
    }

    .msw-careers-inner {
        position: relative;
        z-index: 1;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 56px;
        align-items: center;
    }

    .msw-careers-title { font-size: clamp(22px, 3vw, 30px); font-weight: 800; color: #fff; line-height: 1.3; margin-bottom: 16px; }
    .msw-careers-text  { font-size: 15px; color: rgba(255,255,255,0.82); line-height: 1.8; margin-bottom: 26px; }
    .msw-careers-actions { display: flex; flex-wrap: wrap; gap: 12px; }

    .msw-careers-tags-wrap {
        background: rgba(255,255,255,0.08);
        border: 1px solid rgba(255,255,255,0.16);
        border-radius: 20px;
        padding: 28px 24px;
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
    }

    .msw-careers-tags-title {
        font-size: 13px;
        font-weight: 700;
        color: #f5b800;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        margin-bottom: 18px;
    }

    .msw-careers-tags { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 10px; }

    .msw-careers-tag {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(245,184,0,0.12);
        border: 1px solid rgba(245,184,0,0.35);
        color: rgba(255,255,255,0.92);
        font-size: 12.5px;
        font-weight: 600;
        padding: 7px 14px;
        border-radius: 999px;
        transition: background 0.2s ease, transform 0.2s ease;
    }

    .msw-careers-tag:hover { background: rgba(245,184,0,0.25); transform: translateY(-2px); }
    .msw-careers-tag i { color: #f5b800; font-size: 10px; }

    /* ================================================================
    CTA
    ================================================================ */
    .msw-section--cta {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 48%, #3949ab 100%);
        padding: 64px 0;
    }

    .msw-cta-box { text-align: center; max-width: 780px; margin: 0 auto; }

    .msw-cta-icon {
        width: 72px;
        height: 72px;
        border-radius: 50%;
        background: rgba(245,184,0,0.15);
        border: 2px solid rgba(245,184,0,0.45);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 26px;
        margin: 0 auto 22px;
    }

    .msw-cta-title { font-size: clamp(22px, 3.5vw, 32px); font-weight: 800; color: #fff; margin-bottom: 14px; line-height: 1.3; }
    .msw-cta-text  { font-size: 15.5px; color: rgba(255,255,255,0.80); line-height: 1.8; margin-bottom: 32px; }
    .msw-cta-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }

    /* ================================================================
    RESPONSIVE — TABLET ≤ 1024px
    ================================================================ */
    @media (max-width: 1024px) {
        .msw-highlights-grid     { grid-template-columns: repeat(2, 1fr); }
        .msw-subject-grid        { grid-template-columns: repeat(2, 1fr); }
        .msw-overview-grid       { grid-template-columns: 1fr; }
        .msw-overview-panel      { position: static; }
        .msw-careers-inner       { grid-template-columns: 1fr; gap: 36px; }
        .msw-curriculum-timeline { grid-template-columns: 1fr; }

        .msw-curriculum-connector {
            padding: 12px 0;
            justify-content: flex-start;
            padding-left: 26px;
        }

        .msw-curriculum-connector::after {
            width: 2px;
            height: 28px;
            background: linear-gradient(180deg, #1a2a6c, #f5b800);
        }
    }

    /* ================================================================
    RESPONSIVE — MOBILE ≤ 768px
    ================================================================ */
    @media (max-width: 768px) {
        .msw-container { padding: 0 16px; }
        .msw-section   { padding: 52px 0; }

        .msw-strip-list { grid-template-columns: repeat(2, 1fr); }

        .msw-strip-item {
            border-right: none;
            border-bottom: 1px solid #e8ecf4;
            padding: 20px 12px;
        }

        .msw-strip-item:nth-child(odd) { border-right: 1px solid #e8ecf4; }

        .msw-hero-actions { flex-direction: column; align-items: flex-start; }

        .msw-hero-btn {
            width: 100%;
            justify-content: center;
            max-width: 280px;
        }

        .msw-cta-actions { flex-direction: column; align-items: center; }

        .msw-btn--lg {
            width: 100%;
            justify-content: center;
            max-width: 280px;
        }
    }

    /* ================================================================
    RESPONSIVE — SMALL MOBILE ≤ 480px
    ================================================================ */
    @media (max-width: 480px) {
        .msw-strip-list { grid-template-columns: 1fr; }

        .msw-strip-item {
            border-right: none !important;
            border-bottom: 1px solid #e8ecf4;
        }

        .msw-highlights-grid { grid-template-columns: 1fr; }
        .msw-subject-grid    { grid-template-columns: 1fr; }
        .msw-panel-actions   { flex-direction: column; }
    }

    @media (prefers-reduced-motion: reduce) {
        .msw-highlight-card,
        .msw-subject-card,
        .msw-curriculum-step,
        .msw-hero-btn,
        .msw-btn,
        .msw-panel-btn,
        .msw-careers-tag { transition: none; }

        .msw-highlight-card:hover .msw-highlight-icon { transform: none; }
    }


    /* ============================================================
    COMPUTER SCIENCE DEPARTMENT PAGE  (computer-science.php)
    Brand palette: Navy #0d1b5e · Blue #1a2a6c · Gold #f5b800
    ============================================================ */

    /* --- wrap & inner ------------------------------------------ */
    .csdept-wrap {
        background: #f4f6ff;
        padding: 3rem 0 4rem;
    }
    .csdept-inner {
        max-width: 1080px;
        margin: 0 auto;
        padding: 0 1.25rem;
        display: flex;
        flex-direction: column;
        gap: 3.5rem;
    }

    /* --- intro card -------------------------------------------- */
    .csdept-intro-card {
        background: #fff;
        border-left: 5px solid #f5b800;
        border-radius: 12px;
        padding: 2.25rem 2.5rem;
        box-shadow: 0 4px 24px rgba(13,27,94,.08);
        position: relative;
        overflow: hidden;
    }
    .csdept-intro-card::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(135deg, rgba(26,42,108,.03) 0%, transparent 60%);
        pointer-events: none;
    }
    .csdept-kicker {
        display: inline-block;
        font-size: .72rem;
        font-weight: 700;
        letter-spacing: .1em;
        text-transform: uppercase;
        color: #f5b800;
        background: rgba(245,184,0,.12);
        border: 1px solid rgba(245,184,0,.35);
        border-radius: 30px;
        padding: .25rem .9rem;
        margin-bottom: 1rem;
    }
    .csdept-kicker--outline {
        color: #1a2a6c;
        background: rgba(26,42,108,.07);
        border-color: rgba(26,42,108,.25);
    }
    .csdept-kicker--dark {
        color: #fff;
        background: #0d1b5e;
        border-color: #0d1b5e;
    }
    .csdept-intro-title {
        font-size: 1.7rem;
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
        margin: 0 0 1rem;
    }
    .csdept-intro-title em {
        font-style: normal;
        color: #1a2a6c;
        border-bottom: 3px solid #f5b800;
        padding-bottom: 2px;
    }
    .csdept-intro-text {
        font-size: 1.02rem;
        color: #374469;
        line-height: 1.8;
        margin: 0;
    }

    /* --- highlights grid --------------------------------------- */
    .csdept-highlight-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 1.25rem;
        list-style: none;
        padding: 0;
        margin: 0;
    }
    .csdept-highlight-card {
        background: #fff;
        border-radius: 14px;
        padding: 1.75rem 1.25rem;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: .6rem;
        box-shadow: 0 2px 14px rgba(13,27,94,.07);
        border-top: 4px solid transparent;
        background-clip: padding-box;
        transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
        cursor: default;
    }
    .csdept-highlight-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 10px 30px rgba(13,27,94,.14);
        border-top-color: #f5b800;
    }
    .csdept-highlight-icon {
        width: 52px;
        height: 52px;
        border-radius: 50%;
        background: linear-gradient(135deg, #0d1b5e, #1a2a6c);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.2rem;
        color: #f5b800;
        flex-shrink: 0;
        transition: transform .28s ease;
    }
    .csdept-highlight-card:hover .csdept-highlight-icon {
        transform: rotate(10deg) scale(1.1);
    }
    .csdept-highlight-title {
        font-size: .95rem;
        font-weight: 700;
        color: #0d1b5e;
    }
    .csdept-highlight-text {
        font-size: .84rem;
        color: #5a6a8a;
        line-height: 1.6;
    }

    /* --- learning track ---------------------------------------- */
    .csdept-section-head {
        margin-bottom: 2rem;
    }
    .csdept-section-head--center { text-align: center; }
    .csdept-section-title {
        font-size: 1.55rem;
        font-weight: 800;
        color: #0d1b5e;
        margin: .4rem 0 .6rem;
    }
    .csdept-section-title span {
        color: #1a2a6c;
        position: relative;
    }
    .csdept-section-title span::after {
        content: "";
        position: absolute;
        left: 0; right: 0; bottom: -4px;
        height: 3px;
        background: linear-gradient(90deg, #f5b800, transparent);
        border-radius: 2px;
    }
    .csdept-section-lead {
        font-size: .92rem;
        color: #5a6a8a;
        line-height: 1.7;
        margin: 0;
    }
    .csdept-track-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 0;
        position: relative;
    }
    .csdept-track-list::before {
        content: "";
        position: absolute;
        left: 26px;
        top: 26px;
        bottom: 26px;
        width: 2px;
        background: linear-gradient(180deg, #f5b800, #1a2a6c, #f5b800);
        border-radius: 2px;
    }
    .csdept-track-step {
        display: flex;
        align-items: flex-start;
        gap: 1.25rem;
        padding: 1.5rem 1.5rem 1.5rem 0;
        position: relative;
        background: #fff;
        border-radius: 12px;
        margin-bottom: 1rem;
        box-shadow: 0 2px 12px rgba(13,27,94,.07);
        padding-left: 1.5rem;
        transition: box-shadow .25s ease, transform .25s ease;
    }
    .csdept-track-step:hover {
        box-shadow: 0 6px 24px rgba(13,27,94,.13);
        transform: translateX(4px);
    }
    .csdept-track-badge {
        min-width: 52px;
        height: 52px;
        border-radius: 50%;
        background: linear-gradient(135deg, #0d1b5e, #1a2a6c);
        color: #f5b800;
        font-size: .9rem;
        font-weight: 800;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        position: relative;
        z-index: 1;
        box-shadow: 0 0 0 4px #fff, 0 0 0 6px rgba(245,184,0,.3);
    }
    .csdept-track-title {
        font-size: 1.05rem;
        font-weight: 700;
        color: #0d1b5e;
        margin: 0 0 .35rem;
    }
    .csdept-track-desc {
        font-size: .88rem;
        color: #5a6a8a;
        line-height: 1.65;
        margin: 0;
    }
    .csdept-footnote {
        font-size: .85rem;
        color: #5a6a8a;
        margin-top: .5rem;
    }
    .csdept-footnote a {
        color: #1a2a6c;
        font-weight: 600;
        text-decoration: underline;
        text-underline-offset: 3px;
    }
    .csdept-footnote a:hover { color: #f5b800; }

    /* --- outcomes grid ----------------------------------------- */
    .csdept-outcome-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 1.25rem;
        margin-top: 1.5rem;
    }
    .csdept-outcome-card {
        background: linear-gradient(145deg, #0d1b5e, #1a2a6c);
        border-radius: 14px;
        padding: 2rem 1.4rem;
        text-align: center;
        color: #fff;
        position: relative;
        overflow: hidden;
        transition: transform .28s ease, box-shadow .28s ease;
    }
    .csdept-outcome-card::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at top right, rgba(245,184,0,.12), transparent 60%);
        pointer-events: none;
    }
    .csdept-outcome-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 14px 36px rgba(13,27,94,.28);
    }
    .csdept-outcome-icon {
        width: 52px;
        height: 52px;
        border-radius: 50%;
        background: rgba(245,184,0,.15);
        border: 2px solid rgba(245,184,0,.4);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.2rem;
        color: #f5b800;
        margin: 0 auto 1rem;
        transition: background .25s ease, transform .25s ease;
    }
    .csdept-outcome-card:hover .csdept-outcome-icon {
        background: rgba(245,184,0,.28);
        transform: scale(1.1);
    }
    .csdept-outcome-title {
        font-size: .95rem;
        font-weight: 700;
        color: #f5b800;
        margin: 0 0 .5rem;
    }
    .csdept-outcome-text {
        font-size: .83rem;
        color: rgba(255,255,255,.82);
        line-height: 1.6;
        margin: 0;
    }

    /* --- careers ----------------------------------------------- */
    .csdept-career-inner {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 100%);
        border-radius: 16px;
        padding: 2.5rem 2.5rem;
        display: flex;
        align-items: flex-start;
        gap: 3rem;
        position: relative;
        overflow: hidden;
    }
    .csdept-career-inner::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at bottom left, rgba(245,184,0,.12), transparent 55%);
        pointer-events: none;
    }
    .csdept-career-copy { flex: 1; }
    .csdept-career-title {
        font-size: 1.55rem;
        font-weight: 800;
        color: #fff;
        margin: 0 0 .9rem;
    }
    .csdept-career-title span {
        color: #f5b800;
    }
    .csdept-career-text {
        font-size: .95rem;
        color: rgba(255,255,255,.82);
        line-height: 1.8;
        margin: 0;
    }
    .csdept-career-tags {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: .6rem;
        min-width: 220px;
    }
    .csdept-career-tags li {
        background: rgba(255,255,255,.1);
        border: 1px solid rgba(245,184,0,.3);
        border-radius: 30px;
        padding: .5rem 1.1rem;
        font-size: .85rem;
        color: #f5b800;
        font-weight: 600;
        text-align: center;
        transition: background .22s ease, border-color .22s ease;
    }
    .csdept-career-tags li:hover {
        background: rgba(245,184,0,.18);
        border-color: #f5b800;
    }

    /* --- related links ----------------------------------------- */
    .csdept-related {
        background: #fff;
        border-radius: 14px;
        padding: 2rem 2.25rem;
        box-shadow: 0 2px 14px rgba(13,27,94,.07);
    }
    .csdept-related-title {
        font-size: 1.05rem;
        font-weight: 700;
        color: #0d1b5e;
        margin: 0 0 1.1rem;
    }
    .csdept-related-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-wrap: wrap;
        gap: .6rem;
    }
    .csdept-related-list a {
        display: inline-block;
        padding: .4rem 1rem;
        border-radius: 30px;
        background: rgba(26,42,108,.08);
        color: #1a2a6c;
        font-size: .84rem;
        font-weight: 600;
        text-decoration: none;
        transition: background .22s ease, color .22s ease;
    }
    .csdept-related-list a:hover {
        background: #0d1b5e;
        color: #f5b800;
    }

    /* --- CTA --------------------------------------------------- */
    .csdept-cta-inner {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 100%);
        border-radius: 16px;
        padding: 3rem 2.5rem;
        text-align: center;
        position: relative;
        overflow: hidden;
    }
    .csdept-cta-inner::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at center top, rgba(245,184,0,.12), transparent 60%);
        pointer-events: none;
    }
    .csdept-cta-title {
        font-size: 1.55rem;
        font-weight: 800;
        color: #fff;
        margin: 0 0 .75rem;
    }
    .csdept-cta-text {
        font-size: .95rem;
        color: rgba(255,255,255,.8);
        margin: 0 0 1.75rem;
    }
    .csdept-cta-actions {
        display: flex;
        gap: 1rem;
        justify-content: center;
        flex-wrap: wrap;
    }
    .csdept-btn {
        display: inline-flex;
        align-items: center;
        gap: .5rem;
        padding: .75rem 1.8rem;
        border-radius: 50px;
        font-size: .93rem;
        font-weight: 700;
        text-decoration: none;
        transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
    }
    .csdept-btn--gold {
        background: linear-gradient(135deg, #f5b800, #e0a800);
        color: #0d1b5e;
    }
    .csdept-btn--gold:hover {
        transform: translateY(-3px);
        box-shadow: 0 8px 22px rgba(245,184,0,.4);
        color: #0d1b5e;
    }
    .csdept-btn--ghost {
        background: rgba(255,255,255,.1);
        color: #fff;
        border: 2px solid rgba(255,255,255,.4);
    }
    .csdept-btn--ghost:hover {
        background: rgba(255,255,255,.2);
        border-color: #fff;
        transform: translateY(-3px);
        color: #fff;
    }

    /* --- Responsive -------------------------------------------- */
    @media (max-width: 1024px) {
        .csdept-highlight-grid  { grid-template-columns: repeat(2, 1fr); }
        .csdept-outcome-grid    { grid-template-columns: repeat(2, 1fr); }
        .csdept-career-inner    { flex-direction: column; gap: 1.5rem; }
        .csdept-career-tags     { flex-direction: row; flex-wrap: wrap; min-width: unset; }
        .csdept-career-tags li  { text-align: left; }
    }
    @media (max-width: 768px) {
        .csdept-highlight-grid  { grid-template-columns: 1fr 1fr; }
        .csdept-outcome-grid    { grid-template-columns: 1fr 1fr; }
        .csdept-track-list::before { display: none; }
        .csdept-intro-card      { padding: 1.5rem 1.25rem; }
        .csdept-career-inner    { padding: 2rem 1.5rem; }
        .csdept-cta-inner       { padding: 2rem 1.25rem; }
    }
    @media (max-width: 480px) {
        .csdept-highlight-grid  { grid-template-columns: 1fr; }
        .csdept-outcome-grid    { grid-template-columns: 1fr; }
        .csdept-intro-title     { font-size: 1.35rem; }
        .csdept-career-title    { font-size: 1.25rem; }
        .csdept-cta-title       { font-size: 1.25rem; }
        .csdept-cta-actions     { flex-direction: column; align-items: center; }
    }

    @media (prefers-reduced-motion: reduce) {
        .csdept-highlight-card,
        .csdept-track-step,
        .csdept-outcome-card,
        .csdept-career-tags li,
        .csdept-btn { transition: none; }
        .csdept-highlight-card:hover .csdept-highlight-icon,
        .csdept-outcome-card:hover .csdept-outcome-icon { transform: none; }
    }

    /* ============================================================
    SHARED SITE-WIDE FAQ SECTION  (.site-faq-*)
    Two-column layout: left = accordion, right = image
    Brand: Navy #0d1b5e · Blue #1a2a6c · Gold #f5b800
    ============================================================ */

    /* ----- layout ------------------------------------------------ */
    .site-faq-layout {
        display: grid;
        grid-template-columns: 1fr 400px;
        gap: 3.5rem;
        align-items: start;
    }

    /* ----- left column ------------------------------------------- */
    .site-faq-header {
        margin-bottom: 2rem;
    }
    .site-faq-tag {
        display: inline-flex;
        align-items: center;
        gap: .5rem;
        font-size: .72rem;
        font-weight: 700;
        letter-spacing: .1em;
        text-transform: uppercase;
        color: #f5b800;
        background: rgba(245,184,0,.12);
        border: 1px solid rgba(245,184,0,.35);
        border-radius: 30px;
        padding: .28rem 1rem;
        margin-bottom: 1rem;
    }
    .site-faq-title {
        font-size: 1.65rem;
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.3;
        margin: 0 0 .65rem;
    }
    .site-faq-accent { color: #f5b800; }
    .site-faq-subtitle {
        font-size: .95rem;
        color: #5a6a8a;
        line-height: 1.7;
        margin: 0;
    }

    /* ----- accordion items --------------------------------------- */
    .site-faq-accordion {
        display: flex;
        flex-direction: column;
        gap: .75rem;
    }
    .site-faq-item {
        background: #fff;
        border: 1px solid rgba(26,42,108,.1);
        border-radius: 14px;
        overflow: hidden;
        box-shadow: 0 2px 10px rgba(13,27,94,.06);
        transition: box-shadow .25s ease, border-color .25s ease;
    }
    .site-faq-item[open] {
        border-color: rgba(245,184,0,.5);
        box-shadow: 0 6px 24px rgba(13,27,94,.12);
    }
    .site-faq-q {
        cursor: pointer;
        list-style: none;
        display: flex;
        align-items: center;
        gap: .85rem;
        padding: 1.1rem 1.25rem;
        user-select: none;
        -webkit-user-select: none;
    }
    .site-faq-q::-webkit-details-marker { display: none; }
    .site-faq-q::marker { display: none; }
    .site-faq-item[open] .site-faq-q {
        background: linear-gradient(135deg, rgba(13,27,94,.04), rgba(26,42,108,.02));
        border-bottom: 1px solid rgba(26,42,108,.08);
    }
    .site-faq-q-num {
        min-width: 34px;
        height: 34px;
        border-radius: 50%;
        background: linear-gradient(135deg, #0d1b5e, #1a2a6c);
        color: #f5b800;
        font-size: .7rem;
        font-weight: 800;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        transition: background .25s ease;
    }
    .site-faq-item[open] .site-faq-q-num {
        background: linear-gradient(135deg, #f5b800, #e0a800);
        color: #0d1b5e;
    }
    .site-faq-q-text {
        flex: 1;
        font-size: .95rem;
        font-weight: 600;
        color: #0d1b5e;
        line-height: 1.45;
    }
    .site-faq-q-icon {
        width: 30px;
        height: 30px;
        border-radius: 50%;
        border: 2px solid rgba(26,42,108,.2);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        color: #1a2a6c;
        font-size: .7rem;
        transition: background .25s ease, border-color .25s ease, transform .3s ease;
    }
    .site-faq-item[open] .site-faq-q-icon {
        background: #f5b800;
        border-color: #f5b800;
        color: #0d1b5e;
        transform: rotate(45deg);
    }
    .site-faq-a {
        padding: 1rem 1.25rem 1.2rem 1.25rem;
        font-size: .9rem;
        color: #374469;
        line-height: 1.75;
        animation: sfaqFadeIn .25s ease;
    }
    .site-faq-a p { margin: 0; }
    .site-faq-a a { color: #1a2a6c; font-weight: 600; text-underline-offset: 3px; }
    .site-faq-a a:hover { color: #f5b800; }
    .site-faq-a strong { color: #0d1b5e; }

    @keyframes sfaqFadeIn {
        from { opacity: 0; transform: translateY(-6px); }
        to   { opacity: 1; transform: translateY(0); }
    }

    /* ----- right column: image ----------------------------------- */
    .site-faq-right {
        position: sticky;
        top: 110px;
        display: flex;
        flex-direction: column;
        gap: 1.25rem;
    }
    .site-faq-img-wrap {
        position: relative;
        border-radius: 20px;
        overflow: hidden;
        box-shadow: 0 12px 40px rgba(13,27,94,.18);
        line-height: 0;
    }
    .site-faq-img-wrap::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(
            160deg,
            rgba(13,27,94,.35) 0%,
            transparent 50%,
            rgba(13,27,94,.2) 100%
        );
        z-index: 1;
        pointer-events: none;
    }
    .site-faq-img {
        width: 100%;
        height: 340px;
        object-fit: cover;
        display: block;
        transition: transform .5s ease;
    }
    .site-faq-img-wrap:hover .site-faq-img {
        transform: scale(1.04);
    }
    .site-faq-img-badge {
        position: absolute;
        top: 1.25rem;
        left: 1.25rem;
        z-index: 2;
        background: rgba(13,27,94,.7);
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
        border: 1px solid rgba(245,184,0,.35);
        border-radius: 30px;
        display: inline-flex;
        align-items: center;
        gap: .5rem;
        padding: .4rem 1rem;
        color: #f5b800;
        font-size: .75rem;
        font-weight: 700;
        letter-spacing: .06em;
        text-transform: uppercase;
    }
    .site-faq-float-card {
        background: #fff;
        border-radius: 14px;
        box-shadow: 0 4px 20px rgba(13,27,94,.1);
        border: 1px solid rgba(26,42,108,.1);
        padding: 1.25rem 1.4rem;
        display: flex;
        align-items: center;
        gap: 1rem;
        transition: box-shadow .25s ease;
    }
    .site-faq-float-card:hover {
        box-shadow: 0 8px 28px rgba(13,27,94,.16);
    }
    .site-faq-float-icon {
        width: 46px;
        height: 46px;
        border-radius: 50%;
        background: linear-gradient(135deg, #0d1b5e, #1a2a6c);
        color: #f5b800;
        font-size: 1.1rem;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }
    .site-faq-float-text {
        display: flex;
        flex-direction: column;
        gap: .2rem;
    }
    .site-faq-float-text strong {
        font-size: .9rem;
        color: #0d1b5e;
        font-weight: 700;
    }
    .site-faq-float-text span {
        font-size: .8rem;
        color: #5a6a8a;
    }
    .site-faq-float-text a {
        color: #1a2a6c;
        font-weight: 600;
        text-decoration: underline;
        text-underline-offset: 3px;
    }
    .site-faq-float-text a:hover { color: #f5b800; }

    /* ----- Responsive -------------------------------------------- */
    @media (max-width: 1024px) {
        .site-faq-layout {
            grid-template-columns: 1fr 340px;
            gap: 2.5rem;
        }
        .site-faq-img { height: 280px; }
        .site-faq-right { position: static; }
    }
    @media (max-width: 768px) {
        .site-faq-layout {
            grid-template-columns: 1fr;
            gap: 2rem;
        }
        .site-faq-right { order: -1; }
        .site-faq-img { height: 220px; }
        .site-faq-title { font-size: 1.35rem; }
    }
    @media (max-width: 480px) {
        .site-faq-q { gap: .6rem; padding: .9rem 1rem; }
        .site-faq-q-num { min-width: 28px; height: 28px; font-size: .65rem; }
        .site-faq-a { padding: .75rem 1rem 1rem; }
        .site-faq-img { height: 180px; }
    }
    @media (prefers-reduced-motion: reduce) {
        .site-faq-item,
        .site-faq-q-icon,
        .site-faq-q-num,
        .site-faq-img { transition: none; }
        .site-faq-img-wrap:hover .site-faq-img { transform: none; }
        .site-faq-a { animation: none; }
    }

    /* ============================================================
    COMING SOON PAGE  (.cs-*)
    Used by: placement-record.php (and any future coming-soon pages)
    Brand: Navy #0d1b5e · Blue #1a2a6c · Gold #f5b800
    ============================================================ */

    /* ----- section & background --------------------------------- */
    .cs-section {
        min-height: calc(100vh - 80px);
        position: relative;
        overflow: hidden;
        background: linear-gradient(145deg, #060e30 0%, #0d1b5e 45%, #1a2a6c 100%);
        display: flex;
        align-items: center;
        padding: 4rem 0 5rem;
    }

    /* animated blobs */
    .cs-bg { position: absolute; inset: 0; pointer-events: none; z-index: 0; }

    .cs-blob {
        position: absolute;
        border-radius: 50%;
        filter: blur(90px);
        opacity: .25;
        animation: csBlobFloat 8s ease-in-out infinite alternate;
    }
    .cs-blob--1 {
        width: 520px; height: 520px;
        background: radial-gradient(circle, #f5b800, transparent 70%);
        top: -160px; left: -160px;
        animation-duration: 9s;
    }
    .cs-blob--2 {
        width: 400px; height: 400px;
        background: radial-gradient(circle, #1a2a6c, transparent 70%);
        bottom: -100px; right: -80px;
        animation-duration: 11s;
        animation-delay: -3s;
    }
    .cs-blob--3 {
        width: 300px; height: 300px;
        background: radial-gradient(circle, rgba(245,184,0,.6), transparent 70%);
        top: 50%; right: 15%;
        animation-duration: 13s;
        animation-delay: -6s;
    }
    @keyframes csBlobFloat {
        from { transform: translate(0, 0) scale(1); }
        to   { transform: translate(30px, 40px) scale(1.08); }
    }

    /* subtle dot grid overlay */
    .cs-grid {
        position: absolute;
        inset: 0;
        background-image: radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px);
        background-size: 36px 36px;
    }

    /* ----- container -------------------------------------------- */
    .cs-container {
        max-width: 860px;
        margin: 0 auto;
        padding: 0 1.5rem;
        position: relative;
        z-index: 1;
    }

    /* ----- breadcrumb ------------------------------------------- */
    .cs-breadcrumb {
        margin-bottom: 2.5rem;
    }
    .cs-breadcrumb ol {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: .4rem;
        font-size: .8rem;
    }
    .cs-breadcrumb a {
        color: rgba(255,255,255,.6);
        text-decoration: none;
        transition: color .2s;
    }
    .cs-breadcrumb a:hover { color: #f5b800; }
    .cs-breadcrumb li { color: rgba(255,255,255,.45); }
    .cs-breadcrumb li:last-child { color: rgba(255,255,255,.7); }
    .cs-breadcrumb i { font-size: .65rem; color: rgba(255,255,255,.3); }

    /* ----- content (centered) ----------------------------------- */
    .cs-content {
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 1.75rem;
    }

    /* ----- animated icon ---------------------------------------- */
    .cs-icon-wrap {
        position: relative;
        width: 110px;
        height: 110px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }
    .cs-icon-ring {
        position: absolute;
        inset: 0;
        border-radius: 50%;
        border: 2px solid rgba(245,184,0,.35);
        animation: csRingPulse 3s ease-in-out infinite;
    }
    .cs-icon-ring--inner {
        inset: 12px;
        border-color: rgba(245,184,0,.55);
        animation-delay: -1.5s;
    }
    @keyframes csRingPulse {
        0%,100% { transform: scale(1);    opacity: .7; }
        50%      { transform: scale(1.12); opacity: .2; }
    }
    .cs-icon-core {
        width: 72px;
        height: 72px;
        border-radius: 50%;
        background: linear-gradient(135deg, #f5b800 0%, #e0a800 100%);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.8rem;
        color: #0d1b5e;
        box-shadow: 0 0 0 8px rgba(245,184,0,.15), 0 8px 28px rgba(245,184,0,.3);
        animation: csIconBob 4s ease-in-out infinite;
        position: relative;
        z-index: 1;
    }
    @keyframes csIconBob {
        0%,100% { transform: translateY(0); }
        50%      { transform: translateY(-8px); }
    }

    /* ----- badge ------------------------------------------------ */
    .cs-badge {
        display: inline-flex;
        align-items: center;
        gap: .45rem;
        padding: .35rem 1.1rem;
        border-radius: 30px;
        background: rgba(245,184,0,.15);
        border: 1px solid rgba(245,184,0,.4);
        color: #f5b800;
        font-size: .75rem;
        font-weight: 700;
        letter-spacing: .1em;
        text-transform: uppercase;
    }
    .cs-badge i { font-size: .7rem; }

    /* ----- heading ---------------------------------------------- */
    .cs-title {
        display: flex;
        /* flex-direction: column; */
        align-items: center;
        justify-content: center;
        gap: 0.12em;
        font-size: clamp(2rem, 6vw, 3.2rem);
        font-weight: 900;
        color: #fff;
        line-height: 1.2;
        margin: 0;
        letter-spacing: -.02em;
        text-align: center;
    }
    .cs-title-accent {
        display: inline-block;
        background: linear-gradient(90deg, #f5b800, #ffe066, #f5b800);
        background-size: 200% auto;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        animation: csShine 3s linear infinite;
    }
    @keyframes csShine {
        to { background-position: 200% center; }
    }

    /* ----- lead text -------------------------------------------- */
    .cs-lead {
        font-size: 1.05rem;
        color: rgba(255,255,255,.72);
        line-height: 1.8;
        max-width: 560px;
        margin: 0;
    }

    /* ----- animated dots ---------------------------------------- */
    .cs-dots {
        display: flex;
        gap: .6rem;
        align-items: center;
    }
    .cs-dot {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: #f5b800;
        animation: csDotBounce .9s ease-in-out infinite;
    }
    .cs-dot:nth-child(2) { animation-delay: .15s; background: rgba(245,184,0,.6); }
    .cs-dot:nth-child(3) { animation-delay: .3s;  background: rgba(245,184,0,.35); }
    @keyframes csDotBounce {
        0%,80%,100% { transform: scale(1); opacity: 1; }
        40%         { transform: scale(1.5); opacity: .7; }
    }

    /* ----- info cards ------------------------------------------- */
    .cs-cards {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1.25rem;
        width: 100%;
        margin-top: .5rem;
    }
    .cs-card {
        background: rgba(255,255,255,.06);
        border: 1px solid rgba(255,255,255,.1);
        border-radius: 16px;
        padding: 1.75rem 1.25rem;
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        transition: background .28s ease, transform .28s ease, border-color .28s ease;
        text-align: center;
    }
    .cs-card:hover {
        background: rgba(255,255,255,.1);
        border-color: rgba(245,184,0,.4);
        transform: translateY(-6px);
    }
    .cs-card-icon {
        width: 52px;
        height: 52px;
        border-radius: 50%;
        background: linear-gradient(135deg, rgba(245,184,0,.2), rgba(245,184,0,.05));
        border: 1.5px solid rgba(245,184,0,.35);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.2rem;
        color: #f5b800;
        margin: 0 auto 1rem;
        transition: background .25s ease, transform .25s ease;
    }
    .cs-card:hover .cs-card-icon {
        background: linear-gradient(135deg, rgba(245,184,0,.35), rgba(245,184,0,.1));
        transform: scale(1.1);
    }
    .cs-card-title {
        font-size: .95rem;
        font-weight: 700;
        color: #fff;
        margin: 0 0 .5rem;
    }
    .cs-card-text {
        font-size: .82rem;
        color: rgba(255,255,255,.6);
        line-height: 1.65;
        margin: 0;
    }

    /* ----- CTA buttons ------------------------------------------ */
    .cs-actions {
        display: flex;
        gap: 1rem;
        flex-wrap: wrap;
        justify-content: center;
        margin-top: .25rem;
    }
    .cs-btn {
        display: inline-flex;
        align-items: center;
        gap: .55rem;
        padding: .8rem 1.9rem;
        border-radius: 50px;
        font-size: .93rem;
        font-weight: 700;
        text-decoration: none;
        transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
        white-space: nowrap;
    }
    .cs-btn--primary {
        background: linear-gradient(135deg, #f5b800, #e0a800);
        color: #0d1b5e;
    }
    .cs-btn--primary:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 28px rgba(245,184,0,.45);
        color: #0d1b5e;
    }
    .cs-btn--ghost {
        background: rgba(255,255,255,.08);
        color: #fff;
        border: 2px solid rgba(255,255,255,.3);
    }
    .cs-btn--ghost:hover {
        background: rgba(255,255,255,.16);
        border-color: rgba(255,255,255,.6);
        transform: translateY(-3px);
        color: #fff;
    }

    /* ----- Responsive ------------------------------------------- */
    @media (max-width: 768px) {
        .cs-section { padding: 3rem 0 4rem; min-height: auto; }
        .cs-cards { grid-template-columns: 1fr; max-width: 400px; margin-left: auto; margin-right: auto; }
        .cs-title { font-size: clamp(1.7rem, 8vw, 2.4rem); }
        .cs-lead   { font-size: .95rem; }
    }
    @media (max-width: 480px) {
        .cs-actions { flex-direction: column; align-items: center; }
        .cs-btn { width: 100%; justify-content: center; max-width: 280px; }
        .cs-icon-wrap { width: 88px; height: 88px; }
        .cs-icon-core { width: 58px; height: 58px; font-size: 1.4rem; }
    }

    @media (prefers-reduced-motion: reduce) {
        .cs-blob,
        .cs-icon-ring,
        .cs-icon-core,
        .cs-dot,
        .cs-title-accent { animation: none; }
        .cs-card,
        .cs-btn,
        .cs-card-icon { transition: none; }
        .cs-title-accent {
            -webkit-text-fill-color: #f5b800;
            color: #f5b800;
        }
    }

    /* ============================================================
    MCQ DOWNLOAD – UNAVAILABLE / COMING SOON STATES
    ============================================================ */
    .mcq-action-btn--unavail {
        opacity: .45;
        cursor: not-allowed;
        pointer-events: none;
    }
    /* ============================================================
    COMPUTER SCIENCE – SIDEBAR + TAB LAYOUT  (.csdept-tab-*)
    Navy #0d1b5e · Blue #1a2a6c · Gold #f5b800
    ============================================================ */

    /* ----- outer layout ---------------------------------------- */
    .csdept-tab-layout {
        display: flex;
        align-items: flex-start;
        gap: 2rem;
        max-width: 1240px;
        margin: 0 auto;
        padding: 3rem 1.5rem 5rem;
        background: #f4f6ff;
    }

    /* ----- sidebar --------------------------------------------- */
    .csdept-sidebar {
        width: 260px;
        flex-shrink: 0;
        position: sticky;
        top: 90px;
        align-self: flex-start;
    }
    .csdept-sidebar-inner {
        background: linear-gradient(160deg, #0d1b5e 0%, #1a2a6c 100%);
        border-radius: 16px;
        overflow: hidden;
        box-shadow: 0 8px 32px rgba(13,27,94,.22);
    }
    .csdept-sidebar-header {
        display: flex;
        align-items: center;
        gap: .75rem;
        padding: 1.4rem 1.4rem 1.2rem;
        background: rgba(0,0,0,.2);
        color: #f5b800;
        border-bottom: 1px solid rgba(245,184,0,.18);
        font-weight: 800;
        font-size: .95rem;
        letter-spacing: .05em;
        text-transform: uppercase;
    }
    .csdept-sidebar-header i { font-size: 1.1rem; }

    /* ----- sidenav buttons ------------------------------------- */
    .csdept-sidenav {
        display: flex;
        flex-direction: column;
        padding: .6rem 0 .8rem;
    }
    .csdept-sidenav-btn {
        display: flex;
        align-items: center;
        gap: .8rem;
        padding: .82rem 1.35rem;
        background: transparent;
        border: none;
        border-left: 3px solid transparent;
        color: rgba(255,255,255,.68);
        font-size: .88rem;
        font-family: inherit;
        font-weight: 500;
        text-align: left;
        cursor: pointer;
        width: 100%;
        transition: background .2s ease, color .2s ease, border-color .2s ease;
    }
    .csdept-sidenav-btn i {
        width: 18px;
        font-size: .9rem;
        flex-shrink: 0;
        color: rgba(245,184,0,.5);
        transition: color .2s ease;
    }
    .csdept-sidenav-btn:hover {
        background: rgba(255,255,255,.07);
        color: #fff;
        border-left-color: rgba(245,184,0,.45);
    }
    .csdept-sidenav-btn:hover i { color: #f5b800; }
    .csdept-sidenav-btn.is-active {
        background: rgba(245,184,0,.11);
        color: #f5b800;
        border-left-color: #f5b800;
        font-weight: 700;
    }
    .csdept-sidenav-btn.is-active i { color: #f5b800; }

    /* ----- tab content area ------------------------------------ */
    .csdept-tab-content { flex: 1; min-width: 0; }

    .csdept-panel { display: none; }
    .csdept-panel.is-active {
        display: block;
        animation: csdept-fadein .3s ease;
    }
    @keyframes csdept-fadein {
        from { opacity: 0; transform: translateY(10px); }
        to   { opacity: 1; transform: translateY(0); }
    }

    /* ----- panel heading --------------------------------------- */
    .csdept-panel-heading {
        display: flex;
        align-items: center;
        gap: 1rem;
        margin-bottom: 1.75rem;
        padding-bottom: 1.1rem;
        border-bottom: 2px solid rgba(26,42,108,.1);
    }
    .csdept-panel-heading-icon {
        width: 48px;
        height: 48px;
        border-radius: 12px;
        background: linear-gradient(135deg, #0d1b5e, #1a2a6c);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 1.1rem;
        flex-shrink: 0;
    }
    .csdept-panel-title {
        font-size: 1.45rem;
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.2;
        margin: 0;
    }
    .csdept-panel-subtitle {
        font-size: .85rem;
        color: #5a6a8a;
        margin: .2rem 0 0;
    }

    /* ----- banner inside each tab panel ------------------------ */
    .csdept-panel-banner {
        height: 213px;
        border-radius: 18px;
        background:
        linear-gradient(134deg, rgb(13 27 94 / 0%) 0%, rgb(245 184 0 / 0%) 100%), var(--csdept-banner);
        background-size: cover;
        background-position: center;
        border: 1px solid rgba(13,27,94,.10);
        box-shadow: 0 8px 26px rgba(13,27,94,.10);
        margin: 0 0 18px;
        position: relative;
        overflow: hidden;
    }
    .csdept-panel-banner::after {
        content: '';
        position: absolute;
        inset: 0;
        background-image: radial-gradient(rgba(255,255,255,0.06) 1px, transparent 1px);
        background-size: 26px 26px;
        opacity: 0.55;
        pointer-events: none;
    }
    .csdept-panel-banner--alt  { filter: saturate(1.05) contrast(1.02); }
    .csdept-panel-banner--alt2 { filter: saturate(1.1)  contrast(1.03); }
    .csdept-panel-banner--alt3 { filter: saturate(1.06) contrast(1.02); }

    /* ----- overview stats row ---------------------------------- */
    .csdept-overview-stats {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 1rem;
        margin-top: 1.5rem;
    }
    .csdept-stat-card {
        background: #fff;
        border-radius: 14px;
        padding: 1.4rem 1rem;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: .45rem;
        box-shadow: 0 2px 14px rgba(13,27,94,.07);
        border-top: 3px solid #f5b800;
        transition: transform .25s ease, box-shadow .25s ease;
    }
    .csdept-stat-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 8px 24px rgba(13,27,94,.13);
    }
    .csdept-stat-card i {
        font-size: 1.4rem;
        color: #1a2a6c;
        margin-bottom: .1rem;
    }
    .csdept-stat-val {
        font-size: 1.05rem;
        font-weight: 800;
        color: #0d1b5e;
    }
    .csdept-stat-lbl {
        font-size: .76rem;
        color: #5a6a8a;
        line-height: 1.4;
    }

    /* ----- quick links grid ------------------------------------ */
    .csdept-quicklinks-grid {
        display: flex;
        flex-direction: column;
        gap: .9rem;
    }
    .csdept-quicklink-card {
        display: flex;
        align-items: center;
        gap: 1rem;
        background: #fff;
        border-radius: 14px;
        padding: 1.15rem 1.4rem;
        text-decoration: none;
        color: inherit;
        box-shadow: 0 2px 12px rgba(13,27,94,.07);
        border: 1px solid rgba(26,42,108,.07);
        transition: box-shadow .22s ease, border-color .22s ease, transform .22s ease;
    }
    .csdept-quicklink-card:hover {
        box-shadow: 0 6px 24px rgba(13,27,94,.14);
        border-color: rgba(245,184,0,.5);
        transform: translateX(4px);
        color: inherit;
    }
    .csdept-quicklink-icon {
        width: 44px;
        height: 44px;
        border-radius: 10px;
        background: linear-gradient(135deg, #0d1b5e, #1a2a6c);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 1rem;
        flex-shrink: 0;
    }
    .csdept-quicklink-body {
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: .15rem;
    }
    .csdept-quicklink-title {
        font-size: .95rem;
        font-weight: 700;
        color: #0d1b5e;
    }
    .csdept-quicklink-desc {
        font-size: .8rem;
        color: #5a6a8a;
    }
    .csdept-quicklink-arrow {
        color: rgba(26,42,108,.3);
        font-size: .8rem;
        flex-shrink: 0;
        transition: color .2s ease, transform .2s ease;
    }
    .csdept-quicklink-card:hover .csdept-quicklink-arrow {
        color: #f5b800;
        transform: translateX(3px);
    }

    /* ----- admissions info cards ------------------------------- */
    .csdept-admission-info {
        display: flex;
        flex-direction: column;
        gap: .8rem;
        margin-top: 1.5rem;
    }
    .csdept-admission-card {
        display: flex;
        align-items: center;
        gap: 1rem;
        background: #fff;
        border-radius: 12px;
        padding: 1rem 1.25rem;
        box-shadow: 0 2px 10px rgba(13,27,94,.06);
        border: 1px solid rgba(26,42,108,.08);
    }
    .csdept-admission-card > i {
        font-size: 1.15rem;
        color: #1a2a6c;
        width: 24px;
        text-align: center;
        flex-shrink: 0;
    }
    .csdept-admission-card > div {
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: .1rem;
    }
    .csdept-admission-card-title {
        font-size: .9rem;
        font-weight: 700;
        color: #0d1b5e;
    }
    .csdept-admission-card-text {
        font-size: .78rem;
        color: #5a6a8a;
    }
    .csdept-admission-link {
        display: inline-flex;
        align-items: center;
        padding: .35rem .9rem;
        background: rgba(245,184,0,.12);
        border: 1px solid rgba(245,184,0,.4);
        color: #0d1b5e;
        font-size: .8rem;
        font-weight: 700;
        border-radius: 30px;
        text-decoration: none;
        transition: background .2s ease, border-color .2s ease;
    }
    .csdept-admission-link:hover {
        background: #f5b800;
        border-color: #f5b800;
        color: #0d1b5e;
    }

    /* ----- responsive ------------------------------------------ */
    @media (max-width: 960px) {
        .csdept-tab-layout {
            flex-direction: column;
            padding: 2rem 1rem 4rem;
            gap: 1.25rem;
        }
        .csdept-sidebar {
            width: 100%;
            position: static;
        }
        .csdept-sidebar-inner { border-radius: 12px; }
        .csdept-sidebar-header { display: none; }
        .csdept-sidenav {
            flex-direction: row;
            flex-wrap: wrap;
            padding: .5rem .5rem .4rem;
            gap: .3rem;
        }
        .csdept-sidenav-btn {
            flex: 1 1 auto;
            min-width: 120px;
            padding: .6rem .8rem;
            border-left: none;
            border-bottom: 3px solid transparent;
            border-radius: 8px;
            font-size: .8rem;
            justify-content: center;
            text-align: center;
        }
        .csdept-sidenav-btn.is-active {
            border-bottom-color: #f5b800;
            border-left-color: transparent;
        }
        .csdept-overview-stats { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 600px) {
        .csdept-overview-stats { grid-template-columns: 1fr 1fr; }
        .csdept-sidenav-btn { min-width: 90px; font-size: .75rem; }
        .csdept-sidenav-btn i { display: none; }
    }
    @media (max-width: 400px) {
        .csdept-overview-stats { grid-template-columns: 1fr; }
    }
    @media (prefers-reduced-motion: reduce) {
        .csdept-panel.is-active { animation: none; }
        .csdept-stat-card,
        .csdept-quicklink-card,
        .csdept-admission-link,
        .csdept-sidenav-btn { transition: none; }
    }

    .mcq-download-all--unavail {
        opacity: .55;
        cursor: not-allowed;
        pointer-events: none;
        background: rgba(13,27,94,.06);
        border-color: rgba(13,27,94,.15);
        color: #8a95b0;
        font-style: italic;
    }

    /* ============================================================
    DEPARTMENT PAGES — HOD MESSAGE  (.dept-hod-*)
    Shared across CS · BM · SW department pages
    Navy #0d1b5e · Blue #1a2a6c · Gold #f5b800
    ============================================================ */

    .dept-hod-card {
        background: #fff;
        border-radius: 16px;
        box-shadow: 0 4px 24px rgba(13,27,94,.09);
        overflow: hidden;
        border: 1px solid rgba(26,42,108,.08);
    }
    .dept-hod-top-bar {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 100%);
        padding: 1.5rem 2rem;
        display: flex;
        align-items: center;
        gap: 1.5rem;
    }
    .dept-hod-avatar {
        width: 72px;
        height: 72px;
        border-radius: 50%;
        background: rgba(255,255,255,.1);
        border: 3px solid rgba(245,184,0,.6);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 1.8rem;
        flex-shrink: 0;
        overflow: hidden;
    }
    .dept-hod-avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center top;
        display: block;
        border-radius: 50%;
    }
    .dept-hod-identity { display: flex; flex-direction: column; gap: .2rem; }
    .dept-hod-role-badge {
        display: inline-block;
        font-size: .68rem;
        font-weight: 700;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: #f5b800;
        background: rgba(245,184,0,.15);
        border: 1px solid rgba(245,184,0,.3);
        border-radius: 30px;
        padding: .2rem .75rem;
        margin-bottom: .2rem;
        width: fit-content;
    }
    .dept-hod-identity-name {
        font-size: 1.05rem;
        font-weight: 800;
        color: #fff;
        margin: 0;
    }
    .dept-hod-identity-dept {
        font-size: .8rem;
        color: rgba(255,255,255,.65);
        margin: 0;
    }
    .dept-hod-facts {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-wrap: wrap;
        gap: .5rem 1.25rem;
        margin-top: .5rem;
    }
    .dept-hod-facts li {
        font-size: .78rem;
        color: rgba(255,255,255,.7);
        display: flex;
        align-items: center;
        gap: .4rem;
    }
    .dept-hod-facts li i { color: #f5b800; font-size: .75rem; }

    .dept-hod-message-body {
        padding: 2rem 2rem 1.75rem;
    }
    .dept-hod-quote-icon {
        display: block;
        color: rgba(245,184,0,.28);
        font-size: 3rem;
        line-height: 1;
        margin-bottom: .25rem;
    }
    .dept-hod-msg-title {
        font-size: 1.2rem;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 1.1rem;
    }
    .dept-hod-msg-text {
        font-size: .93rem;
        color: #374469;
        line-height: 1.85;
        margin: 0 0 .85rem;
    }
    .dept-hod-msg-text:last-of-type { margin-bottom: 0; }
    .dept-hod-msg-text a { color: #1a2a6c; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
    .dept-hod-msg-text a:hover { color: #f5b800; }
    .dept-hod-sig {
        display: flex;
        align-items: flex-start;
        gap: .75rem;
        margin-top: 1.5rem;
        padding-top: 1.1rem;
        border-top: 1px solid rgba(26,42,108,.1);
    }
    .dept-hod-sig-bar {
        width: 32px;
        height: 3px;
        background: #f5b800;
        border-radius: 2px;
        flex-shrink: 0;
        margin-top: .45rem;
    }
    .dept-hod-sig-name {
        font-size: .85rem;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0;
    }
    .dept-hod-sig-org {
        font-size: .77rem;
        color: #5a6a8a;
        margin: .1rem 0 0;
    }

    .dept-hod-priorities { margin-top: 1.75rem; }
    .dept-hod-priorities-label {
        font-size: .7rem;
        font-weight: 700;
        letter-spacing: .1em;
        text-transform: uppercase;
        color: #5a6a8a;
        margin: 0 0 .85rem;
    }
    .dept-hod-priority-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1rem;
    }
    .dept-hod-priority-card {
        background: rgba(26,42,108,.04);
        border: 1px solid rgba(26,42,108,.1);
        border-radius: 12px;
        padding: 1.15rem 1.1rem;
        transition: background .2s ease, border-color .2s ease;
    }
    .dept-hod-priority-card:hover {
        background: rgba(26,42,108,.07);
        border-color: rgba(245,184,0,.4);
    }
    .dept-hod-priority-icon {
        width: 36px;
        height: 36px;
        border-radius: 8px;
        background: linear-gradient(135deg, #0d1b5e, #1a2a6c);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: .85rem;
        margin-bottom: .65rem;
    }
    .dept-hod-priority-title {
        font-size: .88rem;
        font-weight: 700;
        color: #0d1b5e;
        margin: 0 0 .3rem;
    }
    .dept-hod-priority-text {
        font-size: .77rem;
        color: #5a6a8a;
        line-height: 1.55;
        margin: 0;
    }

    /* ============================================================
    DEPARTMENT PAGES — FACULTY DETAILS  (.dept-faculty-*)
    ============================================================ */

    .dept-faculty-intro {
        background: rgba(26,42,108,.04);
        border: 1px solid rgba(26,42,108,.1);
        border-radius: 12px;
        padding: 1.1rem 1.35rem;
        display: flex;
        align-items: flex-start;
        gap: .85rem;
        margin-bottom: 1.5rem;
    }
    .dept-faculty-intro-icon {
        width: 36px;
        height: 36px;
        border-radius: 8px;
        background: linear-gradient(135deg, #0d1b5e, #1a2a6c);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: .85rem;
        flex-shrink: 0;
    }
    .dept-faculty-intro-text {
        font-size: .87rem;
        color: #374469;
        line-height: 1.65;
        margin: 0;
    }
    .dept-faculty-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1.25rem;
    }
    .dept-faculty-card {
        background: #fff;
        border-radius: 16px;
        overflow: hidden;
        box-shadow: 0 2px 16px rgba(13,27,94,.08);
        border: 1px solid rgba(26,42,108,.07);
        display: flex;
        flex-direction: column;
        transition: transform .25s ease, box-shadow .25s ease;
    }
    .dept-faculty-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 30px rgba(13,27,94,.14);
    }
    .dept-faculty-card-top {
        background: linear-gradient(135deg, #0d1b5e 0%, #1a2a6c 100%);
        padding: 1.75rem 1.25rem 1rem;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: .5rem;
        position: relative;
    }
    .dept-faculty-card-top::after {
        content: "";
        position: absolute;
        bottom: -1px;
        left: 0;
        right: 0;
        height: 18px;
        background: #fff;
        border-radius: 18px 18px 0 0;
    }
    .dept-faculty-avatar {
        width: 76px;
        height: 76px;
        border-radius: 50%;
        background: rgba(255,255,255,.1);
        border: 3px solid rgba(245,184,0,.55);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f5b800;
        font-size: 1.75rem;
        overflow: hidden;
        flex-shrink: 0;
    }
    .dept-faculty-avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center top;
        display: block;
        border-radius: 50%;
    }
    .dept-faculty-initials {
        font-size: 1.4rem;
        font-weight: 800;
        color: #f5b800;
        letter-spacing: .02em;
        line-height: 1;
        user-select: none;
    }
    .dept-faculty-card-body {
        padding: .9rem 1.25rem 1.4rem;
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .dept-faculty-name {
        font-size: .98rem;
        font-weight: 800;
        color: #0d1b5e;
        margin: 0 0 .2rem;
    }
    .dept-faculty-role {
        font-size: .8rem;
        font-weight: 600;
        color: #1a2a6c;
        margin: 0;
    }
    .dept-faculty-qual {
        font-size: .76rem;
        color: #5a6a8a;
        margin: .35rem 0 0;
    }
    .dept-faculty-divider {
        width: 36px;
        height: 2px;
        background: #f5b800;
        border-radius: 2px;
        margin: .7rem auto;
    }
    .dept-faculty-tags {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: .35rem;
        width: 100%;
    }
    .dept-faculty-tags li {
        font-size: .75rem;
        color: #374469;
        background: rgba(26,42,108,.06);
        border-radius: 30px;
        padding: .3rem .75rem;
        text-align: center;
    }

    /* ----- Responsive ------------------------------------------ */
    @media (max-width: 900px) {
        .dept-hod-priority-grid { grid-template-columns: repeat(2, 1fr); }
        .dept-faculty-grid      { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 600px) {
        .dept-hod-top-bar       { padding: 1.25rem; gap: 1rem; }
        .dept-hod-avatar        { width: 58px; height: 58px; font-size: 1.4rem; }
        .dept-hod-message-body  { padding: 1.4rem; }
        .dept-hod-priority-grid { grid-template-columns: 1fr; }
        .dept-faculty-grid      { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 400px) {
        .dept-faculty-grid { grid-template-columns: 1fr; }
    }
    @media (prefers-reduced-motion: reduce) {
        .dept-faculty-card,
        .dept-hod-priority-card { transition: none; }
    }

    /* ============================================================
    Course Programme Detail Page  (.cpd-page)
    Extends existing .bba-* classes — minimal additions only
    ============================================================ */

    /* Hero cover variant */
    .cpd-hero--cover {
        background-size: cover;
        background-position: center;
        background-image: var(--cpd-cover);
    }
    .cpd-hero--cover .page-hero-overlay {
        background: linear-gradient(100deg,rgba(6,15,72,.78) 0%,rgba(13,27,94,.72) 100%);
    }

    /* ---- Fee section ---- */
    .cpd-section--fees { padding-bottom: 56px; }

    .cpd-fees-grid {
        display: flex;
        flex-direction: column;
        gap: 28px;
        max-width: 860px;
        margin: 0 auto;
    }

    .cpd-fees-cards {
        display: flex;
        gap: 20px;
        flex-wrap: wrap;
    }

    .cpd-fee-card {
        flex: 1;
        min-width: 200px;
        display: flex;
        align-items: center;
        gap: 16px;
        background: #fff;
        border-radius: 16px;
        padding: 24px 28px;
        box-shadow: 0 8px 28px rgba(13,27,94,.10);
        border: 1px solid rgba(26,42,108,.08);
    }

    .cpd-fee-card--annual { border-top: 3px solid #f5b800; }
    .cpd-fee-card--sem    { border-top: 3px solid #3949ab; }

    .cpd-fee-card-icon {
        width: 52px;
        height: 52px;
        flex-shrink: 0;
        border-radius: 50%;
        background: linear-gradient(135deg,#1a2a6c,#3949ab);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        box-shadow: 0 4px 14px rgba(26,42,108,.22);
    }

    .cpd-fee-card-label {
        font-size: 12px;
        color: #5a6a8a;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: .5px;
        margin-bottom: 4px;
    }

    .cpd-fee-card-amount {
        font-size: 22px;
        font-weight: 800;
        color: #0d1b5e;
        line-height: 1.2;
    }

    .cpd-fee-bullets {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .cpd-fee-bullets li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 15px;
        color: #374151;
        line-height: 1.55;
    }

    .cpd-fee-bullets li i {
        color: #f5b800;
        margin-top: 3px;
        flex-shrink: 0;
    }

    .cpd-fee-breakdown {
        background: #fff;
        border-radius: 14px;
        padding: 28px 32px;
        box-shadow: 0 6px 22px rgba(13,27,94,.08);
        border: 1px solid rgba(26,42,108,.07);
    }

    .cpd-fee-actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 14px;
    }

    .cpd-fee-disclaimer {
        width: 100%;
        font-size: 12.5px;
        color: #6b7280;
        line-height: 1.6;
        margin: 4px 0 0;
        display: flex;
        align-items: flex-start;
        gap: 6px;
    }

    .cpd-fee-disclaimer i { color: #3949ab; margin-top: 2px; flex-shrink: 0; }

    /* ---- Related programmes ---- */
    .cpd-related-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
        gap: 14px;
    }

    .cpd-related-card { display: flex; }

    .cpd-related-link {
        flex: 1;
        display: flex;
        align-items: center;
        gap: 16px;
        background: #fff;
        border-radius: 14px;
        padding: 18px 20px;
        border: 1px solid rgba(26,42,108,.10);
        box-shadow: 0 3px 12px rgba(13,27,94,.06);
        text-decoration: none;
        transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
    }

    .cpd-related-link:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 28px rgba(13,27,94,.13);
        border-color: #f5b800;
    }

    .cpd-related-icon {
        width: 44px;
        height: 44px;
        flex-shrink: 0;
        border-radius: 50%;
        background: linear-gradient(135deg,#1a2a6c,#3949ab);
        color: #f5b800;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 17px;
    }

    .cpd-related-body {
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: 2px;
        min-width: 0;
    }

    .cpd-related-title {
        font-size: 14.5px;
        font-weight: 700;
        color: #0d1b5e;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .cpd-related-fullname {
        font-size: 12px;
        color: #4a5568;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .cpd-related-meta {
        font-size: 11.5px;
        color: #6b7280;
        font-weight: 500;
    }

    .cpd-related-arrow {
        color: #3949ab;
        font-size: 13px;
        transition: transform .2s ease;
    }

    .cpd-related-link:hover .cpd-related-arrow { transform: translateX(4px); }

    /* ---- Responsive ---- */
    @media (max-width: 768px) {
        .cpd-fees-cards { flex-direction: column; }
        .cpd-fee-card   { min-width: unset; }
        .cpd-fee-breakdown { padding: 20px; }
    }

    @media (max-width: 480px) {
        .cpd-related-list { grid-template-columns: 1fr; }
    }

    @media (prefers-reduced-motion: reduce) {
        .cpd-related-link { transition: none; }
    }

    /* ============================================================
    Career job detail (/careers/{slug}) — career-details.php
    ============================================================ */
    .cjob-shell {
        background: linear-gradient(180deg, #f1f5fb 0%, #f8fafc 38%, #fff 100%);
        padding: 0 0 72px;
    }

    .cjob-container {
        max-width: 1180px;
        margin: 0 auto;
        padding: 0 18px;
    }

    .cjob-hero-cta {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        margin-top: 20px;
        padding: 12px 22px;
        border-radius: 999px;
        font-weight: 700;
        font-size: 14px;
        text-decoration: none;
        color: #0d1b5e;
        background: #fff;
        border: 2px solid rgba(255, 255, 255, 0.85);
        box-shadow: 0 8px 28px rgba(13, 27, 94, 0.18);
        transition: transform .2s ease, box-shadow .2s ease;
    }

    .cjob-hero-cta:hover {
        color: #0d1b5e;
        transform: translateY(-2px);
        box-shadow: 0 12px 32px rgba(13, 27, 94, 0.24);
    }

    .cjob-hero-cta i { font-size: 15px; color: #f5b800; }

    .cjob-meta-row {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 18px;
    }

    .cjob-chip {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 8px 14px;
        border-radius: 999px;
        font-size: 13px;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.95);
        background: rgba(255, 255, 255, 0.12);
        border: 1px solid rgba(255, 255, 255, 0.22);
        backdrop-filter: blur(6px);
    }

    .cjob-chip i {
        font-size: 13px;
        color: #f5b800;
        opacity: 0.95;
    }

    .cjob-grid {
        display: grid;
        gap: 28px 40px;
        margin-top: -28px;
        position: relative;
        z-index: 2;
        align-items: start;
    }

    @media (min-width: 1024px) {
        .cjob-grid {
            grid-template-columns: 1fr minmax(300px, 360px);
        }
    }

    .cjob-lead {
        font-size: clamp(1rem, 2.2vw, 1.125rem);
        line-height: 1.65;
        color: #334155;
        margin: 0 0 28px;
        padding: 22px 24px;
        background: #fff;
        border-radius: 16px;
        border: 1px solid #e2e8f0;
        box-shadow: 0 4px 24px rgba(13, 27, 94, 0.06);
    }

    .cjob-section-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: #0d1b5e;
        margin-bottom: 10px;
    }

    .cjob-section-tag i {
        color: #f5b800;
        font-size: 12px;
    }

    .cjob-h2 {
        font-size: clamp(1.35rem, 3vw, 1.65rem);
        font-weight: 800;
        color: #0f172a;
        margin: 0 0 16px;
        line-height: 1.25;
    }

    .cjob-prose {
        font-size: 16px;
        line-height: 1.8;
        color: #334155;
    }

    .cjob-prose p { margin: 0 0 1em; }
    .cjob-prose p:last-child { margin-bottom: 0; }
    .cjob-prose ul, .cjob-prose ol { margin: 0 0 1em; padding-left: 1.35em; }
    .cjob-prose li { margin-bottom: 0.4em; }

    .cjob-prose-html a {
        color: #1a2a6c;
        font-weight: 600;
        text-decoration: underline;
        text-underline-offset: 2px;
    }

    .cjob-prose-html a:hover {
        color: #0d1b5e;
    }

    .cjob-role-card {
        background: #fff;
        border-radius: 20px;
        border: 1px solid #e2e8f0;
        padding: 28px 26px 32px;
        box-shadow: 0 12px 40px rgba(13, 27, 94, 0.07);
    }

    /* Sidebar */
    .cjob-aside-inner {
        position: sticky;
        top: 96px;
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    .cjob-aside-card {
        background: #fff;
        border-radius: 18px;
        border: 1px solid #e2e8f0;
        padding: 22px 20px;
        box-shadow: 0 10px 36px rgba(13, 27, 94, 0.08);
    }

    .cjob-aside-card--accent {
        background: linear-gradient(145deg, #0d1b5e 0%, #1a2a6c 55%, #243b8a 100%);
        border: 0;
        color: #fff;
        box-shadow: 0 16px 48px rgba(13, 27, 94, 0.35);
    }

    .cjob-aside-card--accent .cjob-aside-title {
        color: #fff;
    }

    .cjob-aside-card--accent .cjob-aside-list {
        color: rgba(255, 255, 255, 0.88);
    }

    .cjob-aside-title {
        font-size: 13px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        margin: 0 0 14px;
        color: #0d1b5e;
    }

    .cjob-aside-card--accent .cjob-aside-title {
        color: #f5b800;
    }

    .cjob-aside-list {
        list-style: none;
        margin: 0;
        padding: 0;
        font-size: 14px;
        color: #475569;
        line-height: 1.55;
    }

    .cjob-aside-list li {
        display: flex;
        gap: 10px;
        align-items: flex-start;
        margin-bottom: 12px;
    }

    .cjob-aside-list li:last-child { margin-bottom: 0; }

    .cjob-aside-list a {
        color: inherit;
        font-weight: 700;
        text-decoration: none;
        border-bottom: 1px solid rgba(13, 27, 94, 0.25);
    }

    .cjob-aside-list a:hover {
        border-bottom-color: #0d1b5e;
        color: #0d1b5e;
    }

    .cjob-aside-card--accent .cjob-aside-list a {
        color: #fff;
        border-bottom-color: rgba(255, 255, 255, 0.35);
    }

    .cjob-aside-card--accent .cjob-aside-list a:hover {
        border-bottom-color: #f5b800;
        color: #fff;
    }

    .cjob-aside-card--accent .cjob-aside-list i {
        color: #f5b800;
    }

    .cjob-aside-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: 100%;
        margin-top: 16px;
        padding: 12px 16px;
        border-radius: 12px;
        font-weight: 800;
        font-size: 14px;
        text-decoration: none;
        color: #0d1b5e;
        background: #f5b800;
        border: 0;
        transition: filter .2s ease, transform .2s ease;
    }

    .cjob-aside-link:hover {
        color: #0d1b5e;
        filter: brightness(1.06);
        transform: translateY(-1px);
    }

    .cjob-back-link {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        margin-top: 16px;
        font-size: 14px;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.9);
        text-decoration: none;
        border-bottom: 1px solid transparent;
    }

    .cjob-back-link:hover {
        color: #fff;
        border-bottom-color: rgba(255, 255, 255, 0.5);
    }

    /* Application form */
    .cjob-apply-section {
        scroll-margin-top: 88px;
        margin-top: 8px;
    }

    .cjob-apply-head {
        margin-bottom: 22px;
    }

    .cjob-form-card {
        background: #fff;
        border-radius: 20px;
        border: 1px solid #e2e8f0;
        padding: 28px 24px 32px;
        box-shadow: 0 12px 44px rgba(13, 27, 94, 0.08);
    }

    @media (min-width: 640px) {
        .cjob-form-card {
            padding: 32px 32px 36px;
        }
    }

    .cjob-form-title {
        font-size: 1.15rem;
        font-weight: 800;
        color: #0f172a;
        margin: 0 0 6px;
    }

    .cjob-form-blurb {
        margin: 0 0 22px;
        font-size: 14px;
        line-height: 1.6;
        color: #64748b;
    }

    .cjob-form-grid {
        display: grid;
        gap: 18px 20px;
    }

    @media (min-width: 640px) {
        .cjob-form-grid--2 {
            grid-template-columns: 1fr 1fr;
        }
    }

    .cjob-label {
        display: block;
        font-weight: 700;
        font-size: 13px;
        margin-bottom: 7px;
        color: #0f172a;
    }

    .cjob-label .req {
        color: #c0264e;
        font-weight: 800;
    }

    .cinput {
        width: 100%;
        padding: 12px 14px;
        border-radius: 12px;
        border: 1px solid #cbd5e1;
        font-size: 15px;
        color: #0f172a;
        background: #fff;
        transition: border-color .15s ease, box-shadow .15s ease;
    }

    .cinput::placeholder {
        color: #94a3b8;
    }

    .cinput:focus {
        outline: none;
        border-color: #3949ab;
        box-shadow: 0 0 0 3px rgba(57, 73, 171, 0.2);
    }

    .ctextarea {
        min-height: 140px;
        resize: vertical;
        line-height: 1.55;
    }

    .cjob-submit {
        margin-top: 22px;
        width: 100%;
        padding: 14px 20px;
        border-radius: 12px;
        border: 0;
        background: linear-gradient(135deg, #0d1b5e, #1a2a6c);
        color: #fff;
        font-weight: 800;
        font-size: 15px;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        box-shadow: 0 10px 28px rgba(13, 27, 94, 0.28);
        transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
    }

    .cjob-submit:hover {
        filter: brightness(1.06);
        transform: translateY(-1px);
        box-shadow: 0 14px 36px rgba(13, 27, 94, 0.34);
    }

    .cjob-note {
        margin: 14px 0 0;
        font-size: 12px;
        line-height: 1.5;
        color: #64748b;
    }

    /* Upload dropzone (career application) */
    .cjob-dropzone {
        position: relative;
        border: 1.5px dashed #cbd5e1;
        background: #fff;
        border-radius: 14px;
        padding: 14px 14px 12px;
        transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
    }

    .cjob-dropzone.is-dragover {
        border-color: #3949ab;
        box-shadow: 0 0 0 3px rgba(57, 73, 171, 0.18);
        background: rgba(57, 73, 171, 0.04);
    }

    .cjob-dropzone__input {
        position: absolute;
        width: 1px;
        height: 1px;
        opacity: 0;
        pointer-events: none;
    }

    .cjob-dropzone__inner {
        display: flex;
        gap: 12px;
        align-items: center;
        justify-content: flex-start;
        cursor: pointer;
    }

    .cjob-dropzone__icon {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, rgba(13, 27, 94, 0.08), rgba(57, 73, 171, 0.10));
        color: #0d1b5e;
        flex-shrink: 0;
        font-size: 18px;
    }

    .cjob-dropzone__text {
        font-size: 14px;
        line-height: 1.45;
        color: #334155;
    }

    .cjob-dropzone__link {
        color: #1a2a6c;
        font-weight: 800;
        text-decoration: underline;
        text-underline-offset: 2px;
    }

    .cjob-dropzone__hint {
        margin-top: 4px;
        font-size: 12px;
        color: #64748b;
    }

    .cjob-dropzone__file {
        margin-top: 12px;
        padding: 10px 12px;
        border-radius: 12px;
        border: 1px solid rgba(13, 27, 94, 0.10);
        background: linear-gradient(180deg, #f8fafc, #ffffff);
        font-size: 13px;
        color: #0f172a;
        word-break: break-word;
    }

    .cjob-dropzone:focus-within {
        border-color: #3949ab;
        box-shadow: 0 0 0 3px rgba(57, 73, 171, 0.18);
    }

    .cjob-dropzone:hover {
        border-color: rgba(57, 73, 171, 0.55);
    }

    .cjob-404-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        margin-top: 20px;
        padding: 12px 22px;
        border-radius: 12px;
        font-weight: 700;
        font-size: 14px;
        text-decoration: none;
        background: #f5b800;
        color: #0d1b5e;
    }

    .cjob-404-btn:hover {
        color: #0d1b5e;
        filter: brightness(1.05);
    }

    @media (max-width: 1023px) {
        .cjob-aside-inner {
            position: static;
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .cjob-hero-cta, .cjob-aside-link, .cjob-submit { transition: none; }
    }

    /* ================================================================
    PLACEMENT RECORD (public) — placement-record.php
    ================================================================ */
    .pr-page .pr-section {
        padding: 40px 0 48px;
        background: linear-gradient(180deg, #f8f9ff 0%, #eef1fb 100%);
    }
    .pr-container {
        max-width: 1280px;
        margin: 0 auto;
        padding: 0 20px;
    }
    .pr-header {
        text-align: center;
        max-width: 640px;
        margin: 0 auto 28px;
    }
    .pr-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(13, 27, 94, 0.08);
        border: 1px solid rgba(13, 27, 94, 0.14);
        color: #0d1b5e;
        font-size: 11px;
        font-weight: 900;
        letter-spacing: 0.7px;
        text-transform: uppercase;
        padding: 5px 16px;
        border-radius: 50px;
        margin-bottom: 12px;
    }
    .pr-tag i { color: #f5b800; font-size: 12px; }
    .pr-title {
        font-size: clamp(24px, 2.8vw, 34px);
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 10px;
        line-height: 1.2;
        letter-spacing: -0.35px;
    }
    .pr-accent {
        background: linear-gradient(90deg, #1a2a6c, #3949ab);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }
    .pr-subtitle {
        font-size: 14px;
        color: #5a6782;
        line-height: 1.75;
        margin: 0;
    }
    .pr-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(245px, 1fr));
        gap: 14px;
        align-items: stretch;
    }
    .pr-card {
        background: #fff;
        border-radius: 12px;
        border: 1px solid rgba(13, 27, 94, 0.1);
        box-shadow: 0 4px 16px rgba(13, 27, 94, 0.06);
        overflow: hidden;
        display: flex;
        flex-direction: column;
        min-width: 0;
        transition: transform 0.22s ease, box-shadow 0.22s ease;
    }
    .pr-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 28px rgba(13, 27, 94, 0.1);
    }
    .pr-card-photo-wrap {
        position: relative;
        width: 100%;
        aspect-ratio: 1 / 1;
        flex-shrink: 0;
        background: linear-gradient(145deg, #e8ecf8, #f4f6ff);
        overflow: hidden;
    }
    .pr-card-photo {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center 15%;
        display: block;
    }
    .pr-card-photo--placeholder {
        position: absolute;
        inset: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: clamp(28px, 12vw, 40px);
        color: rgba(13, 27, 94, 0.22);
    }
    .pr-card-body {
        padding: 12px 12px 14px;
        display: flex;
        flex-direction: column;
        gap: 0;
        flex: 1;
        min-width: 0;
    }
    .pr-card-name {
        font-size: 14px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 8px;
        line-height: 1.25;
        word-break: break-word;
    }
    .pr-meta {
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 6px;
    }
    .pr-meta-row {
        display: grid;
        grid-template-columns: 72px 1fr;
        gap: 6px 8px;
        align-items: baseline;
        font-size: 12px;
    }
    .pr-meta-row dt {
        margin: 0;
        font-weight: 800;
        color: #64748b;
        text-transform: uppercase;
        font-size: 9px;
        letter-spacing: 0.35px;
    }
    .pr-meta-row dd {
        margin: 0;
        color: #1e293b;
        font-weight: 600;
        line-height: 1.4;
        word-break: break-word;
    }
    .pr-reg {
        font-size: 11px;
        font-weight: 700;
        background: rgba(13, 27, 94, 0.06);
        padding: 2px 6px;
        border-radius: 5px;
        word-break: break-all;
    }
    .pr-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        margin-top: 8px;
    }
    .pr-chip {
        display: inline-flex;
        align-items: center;
        padding: 3px 8px;
        border-radius: 50px;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: 0.15px;
        background: linear-gradient(90deg, rgba(26, 42, 108, 0.1), rgba(57, 73, 171, 0.12));
        color: #1a2a6c;
        border: 1px solid rgba(13, 27, 94, 0.12);
    }
    .pr-chip--muted {
        background: #f1f5f9;
        color: #475569;
        border-color: #e2e8f0;
    }
    .pr-details {
        margin-top: 10px;
        padding-top: 10px;
        border-top: 1px solid rgba(13, 27, 94, 0.08);
        font-size: 12px;
        color: #475569;
        line-height: 1.55;
    }
    .pr-details p { margin: 0 0 0.65em; }
    .pr-details p:last-child { margin-bottom: 0; }
    .pr-details ul, .pr-details ol { margin: 0.4em 0 0.6em 1.1em; padding: 0; }
    .pr-details a { color: #1a2a6c; font-weight: 600; }
    .pr-empty {
        text-align: center;
        max-width: 520px;
        margin: 0 auto;
        padding: 36px 24px 28px;
        background: #fff;
        border-radius: 18px;
        border: 1px dashed rgba(13, 27, 94, 0.2);
    }
    .pr-empty-icon {
        width: 64px;
        height: 64px;
        margin: 0 auto 16px;
        border-radius: 16px;
        background: rgba(13, 27, 94, 0.07);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 26px;
        color: #3949ab;
    }
    .pr-empty-title {
        font-size: 20px;
        font-weight: 900;
        color: #0d1b5e;
        margin: 0 0 8px;
    }
    .pr-empty-text {
        font-size: 14px;
        color: #64748b;
        line-height: 1.65;
        margin: 0 0 20px;
    }
    .pr-empty-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        padding: 12px 22px;
        border-radius: 12px;
        font-weight: 800;
        font-size: 14px;
        text-decoration: none;
        background: linear-gradient(135deg, #1a2a6c, #0d1b5e);
        color: #fff;
        box-shadow: 0 8px 24px rgba(13, 27, 94, 0.25);
    }
    .pr-empty-btn:hover { filter: brightness(1.06); color: #fff; }
    .pr-cta-strip {
        padding: 22px 0 40px;
        background: #eef1fb;
        border-top: 1px solid rgba(13, 27, 94, 0.08);
    }
    .pr-cta-inner {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 14px;
    }
    .pr-cta-link {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 10px 18px;
        border-radius: 10px;
        font-weight: 700;
        font-size: 14px;
        text-decoration: none;
        color: #1a2a6c;
        border: 1px solid rgba(13, 27, 94, 0.18);
        background: #fff;
    }
    .pr-cta-link:hover { border-color: #3949ab; color: #0d1b5e; }
    .pr-cta-link--primary {
        background: linear-gradient(135deg, #f5b800, #ffd54f);
        color: #0d1b5e;
        border-color: rgba(245, 184, 0, 0.5);
    }
    @media (max-width: 767px) {
        .pr-container { padding: 0 16px; }
        .pr-page .pr-section { padding: 36px 0 44px; }
        .pr-grid {
            grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
            gap: 10px;
        }
        .pr-meta-row { grid-template-columns: 1fr; gap: 2px; }
        .pr-meta-row dt { margin-bottom: 2px; }
    }
    @media (prefers-reduced-motion: reduce) {
        .pr-card { transition: none; }
        .pr-card:hover { transform: none; }
    }