﻿:root {
    --cr: #8B1A2E;
    --cr2: #6a1223;
    --cr3: #b52540;
    --green: #3f562c;
    --gd: #f9a222;
    --gd2: #e0a847;
    --gd3: #f0c878;
    --ink: #1C0D12;
    --ink2: #3a2030;
    --ink3: #6a4a58;
    --ppr: #FFFCF6;
    --ppr2: #F7F2E8;
    --ppr3: #EDE4D6;
    --wh: #ffffff;
    --fs-xs: .72rem;
    --fs-sm: .85rem;
    --fs-base: .95rem;
    --fs-lg: 1.1rem;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Outfit',sans-serif;
    background: var(--ppr);
    color: var(--ink);
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, blockquote {
    font-family: 'Cormorant Garamond',serif;
}

img {
    max-width: 100%;
}

a {
    text-decoration: none;
    color: inherit;
}
p {
    color:#444;
}
/* ═══════════════════════════════════════════
   TOP UTILITY BAR
═══════════════════════════════════════════ */
.topbar {
    background: var(--ink);
    color: #ddd;
    font-size: 13px;
    padding: .45rem 0;
    border-bottom: 1px solid rgba(196,134,43,.2);
}

    .topbar a {
        color: #ddd;
        transition: color .2s;
    }

        .topbar a:hover {
            color: var(--gd2);
        }

    .topbar .separator {
        margin: 0 .8rem;
        opacity: .3;
    }

/* ═══════════════════════════════════════════
   NAVBAR — ASYMMETRIC SPLIT DESIGN
═══════════════════════════════════════════ */
#mainNav {
    background: var(--wh);
    border-bottom: 0px solid var(--ppr3);
    position: sticky;
    top: 0;
    z-index: 999;
    transition: box-shadow .3s;
}

    #mainNav.scrolled {
        box-shadow: 0 4px 32px rgba(28,13,18,.12);
    }

.nav-logo-panel {
    background: var(--cr);
    padding: .7rem 2rem .7rem 1.5rem;
    clip-path: polygon(0 0,100% 0,92% 100%,0 100%);
    display: flex;
    align-items: center;
    gap: .9rem;
    min-width: 260px;
}

    .nav-logo-panel img {
        width: 68px;
        height: 65px;
        border-radius: 50%;
        border: 2px solid rgba(196,134,43,.5);
        background:var(--wh);
    }

    .nav-logo-panel .brand-text {
        color: #fff;
        font-family: 'Cormorant Garamond',serif;
    }

        .nav-logo-panel .brand-text strong {
            display: block;
            font-size: 1.6rem;
            font-weight: 600;
            line-height: 1.2;
        }

        .nav-logo-panel .brand-text span {
            font-size: .68rem;
            color: rgba(255,255,255,.65);
            font-family: 'Outfit',sans-serif;
            letter-spacing: .05em;
        }

.nav-links-area {
    display: flex;
    align-items: center;
    padding: 0 1.5rem;
    gap: .2rem;
    flex: 1;
}

.nav-item-custom {
    position: relative;
}

.nav-link-c {
    color: var(--ink2);
    font-size: 1.05rem;
    font-weight: 500;
    letter-spacing: .04em;
    padding: .9rem .9rem;
    display: flex;
    align-items: center;
    gap: .35rem;
    transition: color .2s;
    white-space: nowrap;
    border: none;
    background: none;
    cursor: pointer;
}

    .nav-link-c:hover, .nav-link-c.active {
        color: var(--cr);
    }

    .nav-link-c i.chevron {
        font-size: .6rem;
        transition: transform .25s;
    }

.nav-item-custom:hover .chevron {
    transform: rotate(180deg);
}
/* Dropdown */
.dd-menu {
    position: absolute;
    top: calc(100% + 0px);
    left: 0;
    background: #fff;
    border: 1px solid var(--ppr3);
    border-top: 3px solid var(--cr);
    min-width: 210px;
    padding: .5rem 0;
    box-shadow: 0 16px 48px rgba(28,13,18,.1);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity .22s,transform .22s,visibility .22s;
    z-index: 1000;
}

.nav-item-custom:hover .dd-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dd-menu a {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .55rem 1.2rem;
    font-size: .8rem;
    color: var(--ink3);
    transition: background .15s,color .15s;
}

    .dd-menu a:hover {
        background: var(--ppr2);
        color: var(--cr);
    }

    .dd-menu a i {
        width: 14px;
        color: var(--gd);
        font-size: .75rem;
    }

.dd-divider {
    border-top: 1px solid var(--ppr3);
    margin: .3rem 0;
}

.nav-cta {
    background: var(--green);
    color: #fff !important;
    padding: .55rem 1.4rem !important;
    margin-left: .5rem;
    clip-path: polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%);
    font-size: .78rem !important;
    font-weight: 600 !important;
    transition: background .2s !important;
}

    .nav-cta:hover {
        background: var(--gd) !important;
        color: var(--ink) !important;
    }

.mobile-toggle {
    background: var(--cr);
    border: none;
    color: #fff;
    width: 40px;
    height: 40px;
    display: none;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    cursor: pointer;
    margin-right: 1rem;
}
/* Mobile nav */
.mobile-menu {
    display: none;
    background: #fff;
    border-top: 1px solid var(--ppr3);
    padding: 0 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height .4s ease;
}

    .mobile-menu.open {
        max-height: 90vh;
        overflow-y: auto;
    }

.mob-link {
    display: block;
    padding: .7rem 1.5rem;
    color: var(--ink2);
    font-size: .88rem;
    font-weight: 500;
    border-bottom: 1px solid var(--ppr2);
}

    .mob-link:hover {
        color: var(--cr);
        background: var(--ppr2);
    }

.mob-sub {
    background: var(--ppr2);
}

    .mob-sub a {
        display: block;
        padding: .55rem 2.2rem;
        color: var(--ink3);
        font-size: .82rem;
        border-bottom: 1px solid var(--ppr3);
    }

        .mob-sub a:hover {
            color: var(--cr);
        }

.mob-acc-btn {
    width: 100%;
    background: none;
    border: none;
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .7rem 1.5rem;
    color: var(--ink2);
    font-size: .88rem;
    font-weight: 500;
    border-bottom: 1px solid var(--ppr2);
    cursor: pointer;
}

    .mob-acc-btn i {
        font-size: .7rem;
        transition: transform .25s;
    }

    .mob-acc-btn.open i {
        transform: rotate(180deg);
    }

.mob-sub {
    display: none;
}

    .mob-sub.open {
        display: block;
    }

@media(max-width:991px) {
    .nav-links-area, .nav-cta-area {
        display: none !important;
    }

    .mobile-toggle {
        display: flex;
    }

    .mobile-menu {
        display: block;
    }
}
.page-hero {
    background: var(--ink);
    position: relative;
    overflow: hidden;
    padding: 5rem 0 4rem;
}

    .page-hero::before {
        content: '';
        position: absolute;
        inset: 0;
        background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.025'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    }
    /* large decorative text */
    .page-hero::after {
        content: 'ABOUT';
        position: absolute;
        right: -1rem;
        display:none;
        bottom: -1.5rem;
        font-family: 'Cormorant Garamond',serif;
        font-size: 10rem;
        font-weight: 700;
        color: rgba(255,255,255,.03);
        letter-spacing: -.04em;
        line-height: 1;
        pointer-events: none;
        user-select: none;
    }

.ph-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    color: var(--gd2);
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    margin-bottom: 1.2rem;
}

    .ph-eyebrow span {
        width: 32px;
        height: 1px;
        background: var(--gd2);
    }

.page-hero h1 {
    font-size: clamp(2.4rem,5vw,3rem);
    color: #fff;
    line-height: 1.1;
    font-weight: 600;
    font-style: italic;
    margin-bottom: 1rem;
    text-align:center;
}

    .page-hero h1 strong {
        font-style: normal;
        color: var(--gd2);
    }

.page-hero p {
    color: rgba(255,255,255,.5);
    font-family: 'Outfit',sans-serif;
    font-size: .92rem;
    line-height: 1.8;
    max-width: 540px;
}
/* breadcrumb */
.breadcrumb-bar {
    display: flex;
    align-items: center;
    justify-content:center;
    gap: .5rem;
    margin-top: 2rem;
}

.bc-item {
    font-size: .75rem;
    color: rgba(255,255,255,.35);
}

    .bc-item a {
        color: rgba(255,255,255,.5);
        transition: color .2s;
    }

        .bc-item a:hover {
            color: var(--gd2);
        }

.bc-sep {
    color: rgba(255,255,255,.2);
    font-size: .65rem;
}

.bc-item.active {
    color: var(--gd2);
}
/* ══════════════════════════════════════════════════
   1. INTRODUCTION STRIP
══════════════════════════════════════════════════ */
.intro-sec {
    background: var(--ppr);
    padding: 6rem 1rem;
}

.intro-lead {
    font-family: 'Cormorant Garamond',serif;
    font-size: clamp(1.3rem,2.5vw,1.85rem);
    line-height: 1.65;
    color: var(--ink2);
    font-style: italic;
    border-left: 4px solid var(--gd);
    padding-left: 1.8rem;
    margin-bottom: 2rem;
    background: #f0f8ff;
}

    .intro-lead strong {
        color: var(--cr);
        font-style: normal;
    }

.intro-body {
    font-size: 1rem;
    color: var(--ink3);
    line-height: 1.9;
    text-align:justify
}

    .intro-body p + p {
        margin-top: 1rem;
    }
/* right col — seal + info card stack */
.intro-visual {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.2rem;
}

.seal-ring {
    width: 220px;
    height: 220px;
    border-radius: 50%;
    border: 10px solid var(--ppr3);
    box-shadow: 0 0 0 1px var(--ppr3),0 24px 80px rgba(28,13,18,.12);
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg,var(--ppr2),var(--ppr3));
    position: relative;
}

.seal-orbit {
    position: absolute;
    inset: -24px;
    border-radius: 50%;
    border: 1px dashed rgba(139,26,46,.2);
    animation: orbit 22s linear infinite;
}

    .seal-orbit::before {
        content: '';
        position: absolute;
        top: 50%;
        left: -4px;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--cr);
        transform: translateY(-50%);
    }

@keyframes orbit {
    to {
        transform: rotate(360deg);
    }
}

.info-card-stack {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.ic-row {
    background: #fff;
    border: 1px solid var(--ppr3);
    padding: .85rem 1.2rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    transition: all .25s;
}

    .ic-row:hover {
        border-color: var(--cr);
        transform: translateX(4px);
    }

.ic-icon {
    width: 38px;
    height: 38px;
    min-width: 38px;
    background: rgba(139,26,46,.07);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cr);
    font-size: .85rem;
}

.ic-row h6 {
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--ink3);
    margin: 0 0 .15rem;
}

.ic-row p {
    font-size: .95rem;
    color: var(--ink2);
    margin: 0;
    font-weight: 500;
}
/* ══════════════════════════════════════════════════
   3. VISION MISSION VALUES — TRIPTYCH
══════════════════════════════════════════════════ */
.vmv-sec {
    background: var(--ppr2);
    padding: 6rem 1rem;
}

.vmv-card {
    background: #fff;
    padding: 2.5rem 2rem;
    position: relative;
    overflow: hidden;
    height: 100%;
    transition: transform .3s,box-shadow .3s;
}

    .vmv-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 16px 48px rgba(28,13,18,.1);
    }

    .vmv-card::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 4px;
        background: var(--bar-color,var(--cr));
    }

    .vmv-card::after {
        content: attr(data-letter);
        position: absolute;
        bottom: -1.5rem;
        right: -1rem;
        font-family: 'Cormorant Garamond',serif;
        font-size: 7rem;
        font-weight: 700;
        color: rgba(28,13,18,.04);
        line-height: 1;
        pointer-events: none;
    }

.vmv-icon {
    width: 56px;
    height: 56px;
    background: rgba(139,26,46,.08);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cr);
    font-size: 1.3rem;
    margin-bottom: 1.4rem;
}

.vmv-card h3 {
    font-size: 1.6rem;
    color: var(--cr);
    margin-bottom: .8rem;
    font-weight:bold;
}

.vmv-card p {
    font-size: 1rem;
    color: var(--ink3);
    line-height: 1.8;
    margin: 0;
}

.vmv-list {
    list-style: none;
    padding: 0;
    margin-top: 1rem;
}

    .vmv-list li {
        display: flex;
        gap: .7rem;
        font-size: .95rem;
        color: var(--ink2);
        padding: .45rem 0;
        border-bottom: 1px solid var(--ppr2);
    }

        .vmv-list li:last-child {
            border: none;
        }

        .vmv-list li::before {
            content: '';
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--cr);
            flex-shrink: 0;
            margin-top: 6px;
        }
/* ══════════════════════════════════════════════════
   7. FACULTY HIGHLIGHTS
══════════════════════════════════════════════════ */
.faculty-sec {
    background: var(--ppr);
    padding: 6rem 1rem;
}

.faculty-card {
    background: #fff;
    border: 1px solid var(--ppr3);
    padding: 0;
    overflow: hidden;
    transition: all .3s;
    height: 100%;
}

    .faculty-card:hover {
        box-shadow: 0 12px 40px rgba(28,13,18,.09);
        transform: translateY(-4px);
    }

.faculty-top {
    padding: 1.5rem 1rem;
    display: flex;
    gap: 1rem;
    align-items: center;
    flex-direction:column;
}

.faculty-avatar {
    width: 100px;
    height: 100px;
    min-width: 100px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    font-family: 'Cormorant Garamond',serif;
    font-size: 1.5rem;
    font-weight: 700;
    color: #fff;
    overflow:hidden;
}

.faculty-name {
    font-family: serif;
    font-size: 1.25rem;
    color: var(--cr);
    margin-bottom: .2rem;
    font-weight: bold;
    text-align:center
}

.faculty-dept {
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: var(--ink);
    font-weight: 600;
    text-align: center
}

.faculty-qual {
    font-size: .8rem;
    color: var(--green);
    text-align: center
}

.faculty-bottom {
    border-top: 1px solid var(--ppr2);
    padding: 1rem 1.8rem;
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
}

.faculty-tag {
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .05em;
    padding: .2rem .6rem;
    background: var(--ppr2);
    color: var(--ink3);
    border: 1px solid var(--ppr3);
}
/* ═══════════════════════════════
   HERO SLIDER
═══════════════════════════════ */
.hs-wrap {
    position: relative;
    overflow: hidden;
    height: 65vh;
}

/* Track */
.hs-track {
    display: flex;
    height: 100%;
    transition: transform 0.7s ease-in-out;
}

/* Slide */
.hs-slide {
    min-width: 100%;
    height: 100%;
    flex-shrink: 0;
    position: relative;
}

    /* Image */
    .hs-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transform: scale(1) translateX(0);
        transition: transform 6s ease-in-out;
    }
    .hs-slide.active img {
        transform: scale(1.12);
    }
    .hs-slide.active:nth-child(1) img {
    transform: scale(1.12) translateX(-2%);
}

.hs-slide.active:nth-child(2) img {
    transform: scale(1.12) translateX(2%);
}

.hs-slide.active:nth-child(3) img {
    transform: scale(1.12) translateY(-2%);
}

.hs-slide.active:nth-child(4) img {
    transform: scale(1.12) translateY(2%);
}
    /* Optional dark overlay */
    .hs-slide::after {
        content: '';
        position: absolute;
        inset: 0;
        background: rgba(0,0,0,0.25);
    }

/* Arrows */
.hs-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 45px;
    height: 45px;
    border: none;
    background: rgba(0,0,0,0.5);
    color: #fff;
    font-size: 22px;
    cursor: pointer;
    z-index: 10;
}

.hs-arrow-prev {
    left: 10px;
}

.hs-arrow-next {
    right: 10px;
}

/* Dots */
.hs-dots {
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 6px;
    z-index: 10;
}

.hs-dot {
    width: 8px;
    height: 8px;
    background: rgba(255,255,255,0.4);
    border-radius: 50%;
    cursor: pointer;
    border: none;
}

    .hs-dot.active {
        width: 22px;
        border-radius: 4px;
        background: #fff;
    }

/* Progress bar */
.hs-progress {
    position: absolute;
    top: 0;
    width: 100%;
    height: 3px;
    background: rgba(255,255,255,0.2);
    z-index: 10;
}

.hs-progress-bar {
    height: 100%;
    width: 0%;
    background: #fff;
}
.nticker-outer {
    position: relative;
    overflow: hidden;
    height: 300px;
    border: 1px solid var(--ppr3);
    background: #fff;
}

.nticker-header {
    background: var(--cr);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .55rem 1rem;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

    .nticker-header .nt-ctrl {
        display: flex;
        gap: .4rem;
    }

.nt-btn {
    background: rgba(255,255,255,.15);
    border: none;
    color: #fff;
    width: 24px;
    height: 24px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .65rem;
    transition: background .2s;
}

    .nt-btn:hover {
        background: rgba(255,255,255,.3);
    }

.nticker-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.nt-item {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    padding: 1rem 1rem;
    border-bottom: 1px solid var(--ppr2);
    transition: background .2s;
}

    .nt-item:hover {
        background: var(--ppr2);
    }

.nt-bullet {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 5px;
}

.nt-item a {
    font-size: 1rem;
    color: var(--ink2);
    line-height: 1.45;
    flex: 1;
    margin: 0;
    text-decoration:none;
}

.nt-badge {
    font-size: .63rem;
    font-weight: 700;
    letter-spacing: .04em;
    padding: .18rem .5rem;
    white-space: nowrap;
    flex-shrink: 0;
    align-self: flex-start;
    margin-top: 2px;
}

    .nt-badge.red {
        background: rgba(139,26,46,.1);
        color: var(--cr);
    }

    .nt-badge.gold {
        background: rgba(196,134,43,.15);
        color: #8a5c00;
    }

    .nt-badge.green {
        background: rgba(30,120,60,.1);
        color: #1e6e3a;
    }

    .nt-badge.blue {
        background: rgba(20,80,160,.1);
        color: #144fa0;
    }

.nt-new {
    font-size: .6rem;
    font-weight: 700;
    letter-spacing: .06em;
    background: var(--cr);
    color: #fff;
    padding: .1rem .4rem;
    flex-shrink: 0;
    animation: blink 1.4s ease infinite;
    align-self: flex-start;
    margin-top: 2px;
}

@keyframes blink {
    0%,100% {
        opacity: 1
    }

    50% {
        opacity: .35
    }
}
/* ═══════════════════════════════════════════
   TICKER
═══════════════════════════════════════════ */
.ticker-bar {
    background: var(--gd);
    overflow: hidden;
    padding: .42rem 0;
    position: relative;
}

.ticker-label {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    background: var(--cr);
    color: #fff;
    font-size: .85rem;
    font-weight: 700;
    letter-spacing: .1em;
    padding: 0 1.2rem;
    display: flex;
    align-items: center;
    z-index: 2;
    clip-path: polygon(0 0,100% 0,88% 100%,0 100%);
}

.ticker-scroll {
    display: flex;
    white-space: nowrap;
    animation: tick 32s linear infinite;
}

    .ticker-scroll a {
        padding: 0 3rem;
        font-size: .88rem;
        color: var(--ink);
        font-weight: 500;
        text-decoration:none;
    }

        .ticker-scroll a::before {
            content: '▸';
            margin-right: .6rem;
            color: var(--cr);
        }

@keyframes tick {
    from {
        transform: translateX(0)
    }

    to {
        transform: translateX(-50%)
    }
}
.ticker-bar:hover .ticker-scroll {
    animation-play-state: paused;
}
/* ═══════════════════════════════════════════
   HERO — MAGAZINE SPLIT LAYOUT
═══════════════════════════════════════════ */
.hero-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 88vh;
    position: relative;
    overflow: hidden;
}
/* LEFT PANEL */
.hero-left {
    background: var(--ink);
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 4rem 3.5rem 4rem 5vw;
    overflow: hidden;
}

    .hero-left::before {
        content: '';
        position: absolute;
        inset: 0;
        background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.025'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    }

    .hero-left::after {
        content: '';
        position: absolute;
        right: -60px;
        top: 0;
        bottom: 0;
        width: 120px;
        background: var(--ppr);
        clip-path: polygon(60px 0,100% 0,100% 100%,0 100%);
        z-index: 2;
    }

.hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    color: var(--gd2);
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    margin-bottom: 1.6rem;
}

    .hero-eyebrow span {
        width: 32px;
        height: 1px;
        background: var(--gd2);
    }

.hero-left h1 {
    font-size: clamp(2.4rem,4.5vw,3.8rem);
    color: #fff;
    line-height: 1.1;
    font-weight: 600;
    margin-bottom: 1.4rem;
    font-style: italic;
}

    .hero-left h1 strong {
        font-style: normal;
        color: var(--gd2);
    }

.hero-tagline {
    color: rgba(255,255,255,.55);
    font-family: 'Outfit',sans-serif;
    font-size: .95rem;
    line-height: 1.8;
    max-width: 440px;
    margin-bottom: 2.2rem;
}

.hero-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.btn-filled {
    background: var(--green);
    color: #fff;
    padding: .75rem 2rem;
    font-size: .85rem;
    font-weight: 600;
    letter-spacing: .04em;
    clip-path: polygon(10px 0%,100% 0%,calc(100% - 10px) 100%,0% 100%);
    border: none;
    cursor: pointer;
    transition: background .25s,transform .2s;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
}

    .btn-filled:hover {
        background: var(--gd);
        color: var(--ink);
        transform: translateY(-2px);
    }

.btn-ghost {
    background: transparent;
    color: rgba(255,255,255,.85);
    padding: .75rem 1.8rem;
    font-size: .85rem;
    font-weight: 500;
    border: 1px solid rgba(255,255,255,.2);
    cursor: pointer;
    transition: all .25s;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
}

    .btn-ghost:hover {
        border-color: var(--gd2);
        color: var(--gd2);
    }

.hero-counter-row {
    display: flex;
    gap: 2.5rem;
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(255,255,255,.08);
}

.hc {
    color: #fff;
}

    .hc .val {
        font-family: 'Cormorant Garamond',serif;
        font-size: 2.5rem;
        font-weight: 700;
        color: var(--gd2);
        line-height: 1;
    }

    .hc .lbl {
        font-size: .68rem;
        color: rgba(255,255,255,.4);
        text-transform: uppercase;
        letter-spacing: .1em;
        margin-top: .3rem;
    }
/* RIGHT PANEL */
.hero-right {
    background: var(--ppr);
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 3rem 4vw 3rem 5rem;
}

.hero-right-top {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.logo-showcase {
    width: 260px;
    height: 260px;
    border-radius: 50%;
    border: 12px solid var(--ppr3);
    box-shadow: 0 0 0 1px var(--ppr3),0 24px 80px rgba(28,13,18,.15),inset 0 0 40px rgba(28,13,18,.04);
    position: relative;
    overflow: hidden;
}

    .logo-showcase img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 50%;
    }

.logo-orbit {
    position: absolute;
    inset: -30px;
    border-radius: 50%;
    border: 1px dashed rgba(139,26,46,.2);
    animation: orbit 20s linear infinite;
}

    .logo-orbit::before {
        content: '';
        position: absolute;
        top: 50%;
        left: -4px;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--cr);
        transform: translateY(-50%);
    }

@keyframes orbit {
    to {
        transform: rotate(360deg);
    }
}

.college-info-card {
    background: var(--cr);
    color: #fff;
    padding: 1.4rem 1.8rem;
    position: absolute;
    bottom: 0;
    right: -1rem;
    clip-path: polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);
}

    .college-info-card .est {
        font-size: .68rem;
        letter-spacing: .12em;
        color: rgba(255,255,255,.6);
        text-transform: uppercase;
        margin-bottom: .3rem;
    }

    .college-info-card .inst {
        font-family: 'Cormorant Garamond',serif;
        font-size: 1.05rem;
        font-weight: 600;
    }

    .college-info-card .loc {
        font-size: .75rem;
        color: rgba(255,255,255,.7);
        margin-top: .2rem;
    }

.hero-right-bottom {
    border-top: 2px solid var(--ppr3);
    padding-top: 1.5rem;
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 1rem;
}

.quick-link-card {
    background: #fff;
    border: 1px solid var(--ppr3);
    padding: 1.1rem;
    text-align: center;
    transition: all .25s;
    cursor: pointer;
}

    .quick-link-card:hover {
        border-color: var(--cr);
        background: var(--cr);
        color: #fff;
    }

        .quick-link-card:hover i, .quick-link-card:hover p {
            color: #fff !important;
        }

    .quick-link-card i {
        color: var(--cr);
        font-size: 1.3rem;
        margin-bottom: .5rem;
        display: block;
        transition: color .25s;
    }

    .quick-link-card p {
        font-size: .72rem;
        color: var(--ink3);
        font-weight: 600;
        letter-spacing: .05em;
        text-transform: uppercase;
        margin: 0;
        transition: color .25s;
    }

@media(max-width:991px) {
    .hero-wrap {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .hero-left {
        padding: 4rem 1.5rem;
        clip-path: none;
    }

        .hero-left::after {
            display: none;
        }

    .hero-right {
        padding: 3rem 1.5rem;
    }

    .hero-right-top {
        padding: 2rem 0;
    }

    .logo-showcase {
        width: 200px;
        height: 200px;
    }

    .hero-counter-row {
        flex-wrap: wrap;
        gap: 1.5rem;
    }

    .college-info-card {
        right: 0;
    }
}

/* ═══════════════════════════════════════════
   SECTION HEADER STYLE
═══════════════════════════════════════════ */
.sh-wrap {
    margin-bottom: 0rem;
}

.sh-kicker {
    display: inline-flex;
    align-items: center;
    gap: .7rem;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--cr);
    margin-bottom: .8rem;
}

    .sh-kicker::before {
        content: '';
        width: 24px;
        height: 2px;
        background: var(--cr);
    }

.sh-title {
    font-size: clamp(1.8rem,3.5vw,2.8rem);
    line-height: 1.2;
    color: var(--ink);
    font-weight:bold;
}

    .sh-title em {
        color: var(--cr);
        font-style: italic;
    }

.sh-sub {
    font-family: 'Outfit',sans-serif;
    font-size: 1rem;
    color: var(--ink3);
    line-height: 1.75;
    max-width: 560px;
    margin-top: .8rem;
    text-align:justify;
}

.sh-rule {
    display: flex;
    align-items: center;
    gap: .8rem;
    margin-top: 1.2rem;
}

    .sh-rule::before {
        content: '';
        width: 48px;
        height: 2px;
        background: var(--cr);
    }

    .sh-rule::after {
        content: '';
        flex: 1;
        height: 1px;
        background: var(--ppr3);
    }
/* centered */
.sh-wrap.center {
    text-align: center;
}

    .sh-wrap.center .sh-kicker {
        justify-content: center;
    }

        .sh-wrap.center .sh-kicker::before {
            display: none;
        }

    .sh-wrap.center .sh-sub {
        margin: 0.8rem auto 0;
    }

    .sh-wrap.center .sh-rule {
        justify-content: center;
    }

        .sh-wrap.center .sh-rule::before, .sh-wrap.center .sh-rule::after {
            display: none;
        }

/* ═══════════════════════════════════════════
   ABOUT — DIAGONAL STRIP LAYOUT
═══════════════════════════════════════════ */
.about-sec {
    background: var(--ppr);
    padding: 6rem 1rem;
    position: relative;
    overflow: hidden;
}

    .about-sec::before {
        content: '';
        position: absolute;
        top: -40px;
        left: 0;
        right: 0;
        height: 80px;
        background: var(--ppr);
        clip-path: polygon(0 100%,100% 0,100% 100%);
    }

.principle-pull {
    background: var(--cr);
    color: #fff;
    padding: 2rem;
    clip-path: polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%);
    margin-bottom: 1.5rem;
}

    .principle-pull blockquote {
        font-family: 'Cormorant Garamond',serif;
        font-size: 1.4rem;
        font-style: italic;
        line-height: 1.55;
        color: rgba(255,255,255,.92);
        margin: 0;
        border: none;
        padding: 0;
    }

    .principle-pull cite {
        font-size: .75rem;
        color: rgba(255,255,255,.6);
        font-style: normal;
        margin-top: .6rem;
        display: block;
    }

.about-right-visual {
    position: relative;
}

.about-img-stack {
    position: relative;
    padding-bottom: 3rem;
    padding-right: 3rem;
}

.img-main {
    width: 100%;
    height:450px;
    overflow:hidden;
    aspect-ratio: 4/3;
    background: linear-gradient(135deg,var(--ppr3),var(--ppr2));
    display: flex;
    align-items: center;
    justify-content: center;
    border: 8px solid #fff;
    box-shadow: 0 16px 64px rgba(28,13,18,.12);
    position: relative;
    z-index: 2;
}
.img-main img {
    width:100%;
    height:100%;
    object-fit:cover;
}
.img-accent {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 30%;
    aspect-ratio: 1;
    background: var(--cr);
    display: flex;
    align-items: center;
    justify-content: center;
    clip-path: polygon(16px 0,100% 0,100% 100%,0 100%,0 16px);
    z-index: 3;
}

    .img-accent .num {
        font-family: 'Cormorant Garamond',serif;
        font-size: 2.8rem;
        font-weight: 700;
        color: var(--gd2);
        display: block;
        line-height: 1;
    }

    .img-accent .txt {
        color: rgba(255,255,255,.75);
        font-size: .72rem;
        text-transform: uppercase;
        letter-spacing: .1em;
    }

.vm-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-top: 1.5rem;
}

.vm-card {
    background: #fff;
    padding: 1.4rem;
    border-bottom: 3px solid var(--gd);
    box-shadow: 0 4px 16px rgba(28,13,18,.05);
}

    .vm-card h4 {
        font-size: .98rem;
        text-transform: uppercase;
        letter-spacing: .1em;
        color: var(--cr);
        margin-bottom: .5rem;
        font-weight:bold;
    }

    .vm-card p {
        font-size: .95rem;
        color: var(--ink3);
        line-height: 1.65;
        margin: 0;
        text-align:justify
    }
#principal img {
    border: 2px solid #8b1a2e;
    border-radius: 10px;
    padding: 5px;
    background: var(--wh);
}
#principal h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.6rem, 3vw, 2.5rem);
    color: var(--ink);
    margin-bottom: 1.2rem;
    line-height: 1.3;
    font-weight:bold;
}
/* ═══════════════════════════════════════════
   COURSES — STAGGERED HORIZONTAL CARDS
═══════════════════════════════════════════ */
.courses-sec {
    background: var(--ink);
    padding: 6rem 2rem;
    clip-path: polygon(0 3%,100% 0,100% 97%,0 100%);
    margin: -2rem 0;
}

.course-hcard {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.08);
    gap: 2rem;
    padding: 2rem;
    margin-bottom: 1rem;
    transition: all .3s;
    cursor: default;
    position: relative;
    overflow: hidden;
}

    .course-hcard::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 4px;
        background: linear-gradient(to bottom,var(--cr),var(--gd));
        transform: scaleY(0);
        transform-origin: bottom;
        transition: transform .3s;
    }

    .course-hcard:hover::before {
        transform: scaleY(1);
    }

    .course-hcard:hover {
        background: rgba(255,255,255,.07);
        transform: translateX(6px);
    }

.ch-num {
    font-family: 'Cormorant Garamond',serif;
    font-size: 5rem;
    font-weight: 700;
    color: var(--green);
    line-height: 1;
    user-select: none;
}

.ch-body h3 {
    font-size: 1.6rem;
    color: #fff;
    margin-bottom: .4rem;
}

.ch-body .ch-meta {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: .7rem;
}

.ch-badge {
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: .2rem .7rem;
    border: 1px solid rgba(196,134,43,.4);
    color: var(--gd2);
}

.ch-body p {
    font-size: .9rem;
    color: rgba(255,255,255,.5);
    line-height: 1.7;
    margin: 0;
}

.ch-link {
    color: var(--gd2);
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: .5rem;
    white-space: nowrap;
    transition: gap .2s;
}

    .ch-link:hover {
        gap: .9rem;
    }

@media(max-width:768px) {
    .course-hcard {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .ch-num {
        display: none;
    }

    .ch-link {
        justify-content: flex-start;
    }
}

/* ═══════════════════════════════════════════
   DEPARTMENTS — TABBED LAYOUT
═══════════════════════════════════════════ */
.dept-sec {
    background: var(--ppr);
    padding: 6rem 1rem;
}

.dept-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: 2.5rem;
    border-bottom: 2px solid var(--ppr3);
    padding-bottom: 0;
}

.dt-tab {
    background: none;
    border: none;
    padding: .8rem 1.4rem;
    font-family: 'Outfit',sans-serif;
    font-size: 1rem;
    font-weight: 500;
    color: var(--ink3);
    cursor: pointer;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    transition: all .2s;
    display: flex;
    align-items: center;
    gap: .5rem;
}

    .dt-tab.active, .dt-tab:hover {
        color: var(--cr);
        border-bottom-color: var(--cr);
    }

.dt-panel {
    display: none;
}

    .dt-panel.active {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 2rem;
    }

.dt-desc {
    padding: 1rem 0;
}

    .dt-desc h3 {
        font-size: 2rem;
        color: var(--ink);
        margin-bottom: 1rem;
    }

    .dt-desc p {
        font-size: 1rem;
        color: var(--ink3);
        line-height: 1.8;
        margin-bottom: 1.2rem;
    }

.dt-feat-list {
    list-style: none;
    padding: 0;
}

    .dt-feat-list li {
        display: flex;
        align-items: center;
        gap: .7rem;
        padding: .55rem 0;
        font-size: .95rem;
        color: var(--ink2);
        border-bottom: 1px solid var(--ppr2);
    }

        .dt-feat-list li:last-child {
            border: none;
        }

        .dt-feat-list li::before {
            content: '';
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--green);
            flex-shrink: 0;
        }

.dt-visual {
    /*background: linear-gradient(135deg,var(--cr2),var(--cr));*/
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 280px;
    position: relative;
    overflow: hidden;
    clip-path: polygon(0 0,100% 0,100% calc(100% - 24px),calc(100% - 24px) 100%,0 100%);
}

    .dt-visual i {
        font-size: 5rem;
        color: rgba(255,255,255,.15);
    }

    .dt-visual .dt-icon-main {
        position: absolute;
        font-size: 3rem;
        color: rgba(255,255,255,.9);
    }

@media(max-width:768px) {
    .dt-panel.active {
        grid-template-columns: 1fr;
    }

    .dt-visual {
        min-height: 160px;
    }
}

/* ═══════════════════════════════════════════
   FACILITIES — BENTO GRID
═══════════════════════════════════════════ */
.fac-sec {
    background: var(--ppr2);
    padding: 6rem 1rem;
}

.bento {
    display: grid;
    grid-template-columns: repeat(6,1fr);
    grid-template-rows: auto;
    gap: .8rem;
    margin-top:20px;
}

.bento-cell {
    background: #fff;
    padding: 1.8rem;
    border: 1px solid var(--ppr3);
    transition: all .3s;
    position: relative;
    overflow: hidden;
}

    .bento-cell::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 3px;
        background: linear-gradient(90deg,var(--cr),var(--gd));
        transform: scaleX(0);
        transform-origin: left;
        transition: transform .3s;
    }

    .bento-cell:hover::after {
        transform: scaleX(1);
    }
    .bento-cell i {
        transform: scale(1);
        transition: .3s ease-in-out;
    }
    .bento-cell:hover i {
        transform: scale(1.2);
        transition:.3s ease-in-out;
    }
    .bento-cell:hover {
        box-shadow: 0 8px 32px rgba(28,13,18,.08);
        transform: translateY(-3px);
    }

.bc1 {
    grid-column: span 2;
    grid-row: span 2;
}

.bc2 {
    grid-column: span 2;
}

.bc3 {
    grid-column: span 2;
}

.bc4 {
    grid-column: span 3;
}

.bc5 {
    grid-column: span 3;
}

.bento-cell .bc-icon {
    font-size: 2rem;
    color: var(--green);
    margin-bottom: 1rem;
    display: block;
}

.bento-cell h4 {
    font-size: 1.4rem;
    color: var(--cr);
    margin-bottom: .5rem;
    font-weight:bold;
}

.bento-cell p {
    font-size: .95rem;
    color: var(--ink3);
    line-height: 1.65;
    margin: 0;
}

.bc1 h4 {
    font-size: 1.4rem;
}

.bc1 p {
    font-size: .88rem;
}

@media(max-width:992px) {
    .bento {
        grid-template-columns: 1fr 1fr;
    }

    .bc1, .bc2, .bc3, .bc4, .bc5 {
        grid-column: span 1;
        grid-row: span 1;
    }
}

@media(max-width:576px) {
    .bento {
        grid-template-columns: 1fr;
    }

    .bc1, .bc2, .bc3, .bc4, .bc5 {
        grid-column: span 1;
    }
}

/* ═══════════════════════════════════════════
   ACTIVITIES — MAGAZINE EDITORIAL
═══════════════════════════════════════════ */
.act-sec {
    background: var(--ppr);
    padding: 6rem 1rem;
}

.act-category {
    margin-bottom: 2.5rem;
}

.act-cat-title {
    font-size: .85rem;
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--ink);
    padding-bottom: .6rem;
    border-bottom: 0px solid var(--ppr3);
    margin-bottom: 0;
}

.act-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.act-tag {
    background: var(--ppr2);
    color: var(--ink2);
    border: 1px solid var(--ppr3);
    padding: .4rem .9rem;
    font-size: .85rem;
    font-weight: 500;
    transition: all .25s;
    cursor: default;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}

    .act-tag:hover {
        background: var(--cr);
        color: #fff;
        border-color: var(--cr);
    }

    .act-tag i {
        font-size: .7rem;
        color: var(--gd);
    }

    .act-tag:hover i {
        color: var(--gd2);
    }

.act-big-pull {
    background: var(--cr);
    padding: 3rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    overflow: hidden;
    min-height: 360px;
}

    .act-big-pull::before {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse at 10% 30%,rgba(28,13,18,.9),transparent 100%);
    }

    .act-big-pull .apb {
        font-size: .7rem;
        letter-spacing: .14em;
        text-transform: uppercase;
        color: var(--gd2);
        margin-bottom: .8rem;
        position: relative;
        z-index: 2;
    }

    .act-big-pull h3 {
        font-size: 2rem;
        color: #fff;
        position: relative;
        z-index: 2;
        margin-bottom: 1rem;
        line-height: 1.3;
    }

    .act-big-pull p {
        font-size: .95rem;
        color: rgba(255,255,255,.55);
        position: relative;
        z-index: 2;
        line-height: 1.7;
    }

/* ═══════════════════════════════════════════
   PLACEMENTS
═══════════════════════════════════════════ */
.place-sec {
    background: var(--cr);
    padding: 6rem 1rem;
    position: relative;
    overflow: hidden;
}

    .place-sec::before {
        content: 'CAREERS';
        position: absolute;
        right: -2rem;
        top: 50%;
        display:none;
        transform: translateY(-50%);
        font-family: 'Cormorant Garamond',serif;
        font-size: 12rem;
        font-weight: 700;
        color: rgba(255,255,255,.04);
        letter-spacing: -.05em;
        line-height: 1;
        pointer-events: none;
    }

    .place-sec .sh-kicker {
        color: var(--gd2);
    }

        .place-sec .sh-kicker::before {
            background: var(--gd2);
        }

    .place-sec .sh-title {
        color: #fff;
    }

    .place-sec .sh-sub {
        color: rgba(255,255,255,.7);
    }

.career-card {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.15);
    padding: 2.2rem 1.2rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    transition: all .25s;
    flex-direction:column;
}

    .career-card:hover {
        background: var(--green);
        transform: translateY(-2px);
    }
        .career-card:hover i {
            transition:.3s ease-in-out;
            transform:scale(1.2)
        }
    .career-card i {
        width: 60px;
        height: 60px;
        min-width: 60px;
        border-radius: 50%;
        background: rgba(255,255,255,.12);
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--gd2);
        font-size: 1.5rem;
        transition: .3s ease-in-out;
        transform: scale(1)
    }

    .career-card span {
        color: #fff;
        font-size: .95rem;
        font-weight: 500;
    }

.place-cell-big {
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.1);
    padding: 2.5rem;
    height: 100%;
}

    .place-cell-big h3 {
        color: #fff;
        font-size: 1.8rem;
        margin-bottom: 1rem;
    }

    .place-cell-big p {
        color: rgba(255,255,255,.65);
        font-size: .9rem;
        line-height: 1.8;
    }

/* ═══════════════════════════════════════════
   TESTIMONIALS
═══════════════════════════════════════════ */
.testi-sec {
    background: var(--ppr2);
    padding: 6rem 1rem;
}

.testi-card-new {
    background: #fff;
    border: 1px solid var(--ppr3);
    padding: 2.5rem;
    position: relative;
    overflow: hidden;
    transition: all .3s;
}

    .testi-card-new:hover {
        box-shadow: 0 12px 40px rgba(28,13,18,.08);
        transform: translateY(-4px);
    }

.tc-quote {
    font-family: 'Cormorant Garamond',serif;
    font-size: 5rem;
    color: var(--cr);
    opacity: .12;
    position: absolute;
    top: -.5rem;
    left: 1.5rem;
    line-height: 1;
}

.testi-card-new blockquote {
    font-family: serif;
    font-size: 1.2rem;
    line-height: 1.7;
    color: var(--ink);
    margin: 0;
    padding: .5rem 0 0;
    border: none;
}

.tc-divider {
    width: 32px;
    height: 2px;
    background: var(--gd);
    margin: 1.2rem 0;
}

.tc-name {
    font-weight: 600;
    font-size: .88rem;
    color: var(--ink);
}

.tc-role {
    font-size: .75rem;
    color: var(--ink3);
    margin-top: .2rem;
}

/* ═══════════════════════════════════════════
   ADMISSION SECTION
═══════════════════════════════════════════ */
.admit-sec {
    background: var(--ppr);
    padding: 6rem 1rem;
    position: relative;
}

.admit-left-panel {
    background: var(--ink);
    padding: 3rem;
    height: 100%;
    clip-path: polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%);
}

    .admit-left-panel .sh-kicker {
        color: var(--gd2);
    }

        .admit-left-panel .sh-kicker::before {
            background: var(--gd2);
        }

    .admit-left-panel .sh-title {
        color: #fff;
    }

.course-admit-card {
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.1);
    padding: 1.4rem;
    margin-bottom: .8rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    transition: all .25s;
}

    .course-admit-card:hover {
        background: rgba(255,255,255,.09);
        border-left: 3px solid var(--gd);
    }

.ca-dur {
    min-width: 56px;
    height: 56px;
    background: var(--cr);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Cormorant Garamond',serif;
    font-size: 1.1rem;
    font-weight: 700;
    color: #fff;
    text-align: center;
    line-height: 1.2;
    flex-shrink: 0;
}

.ca-info h5 {
    font-size: 1.5rem;
    color: #fff;
    margin-bottom: .2rem;
}

.ca-info p {
    font-size: .85rem;
    color: rgba(255,255,255,.5);
    margin: 0;
}

.form-label-custom {
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--ink3);
    margin-bottom: .4rem;
    display: block;
}

.form-ctrl-custom {
    width: 100%;
    background: var(--ppr2);
    border: 1px solid var(--ppr3);
    padding: .75rem 1rem;
    font-family: 'Outfit',sans-serif;
    font-size: .87rem;
    color: var(--ink);
    border-radius: 0;
    outline: none;
    transition: border-color .2s;
}

    .form-ctrl-custom:focus {
        border-color: var(--cr);
    }

select.form-ctrl-custom {
    cursor: pointer;
}

.doc-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: .5rem;
}

.doc-tag {
    background: var(--ppr2);
    border: 1px solid var(--ppr3);
    color: var(--ink3);
    padding: .3rem .8rem;
    font-size: .8rem;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}

    .doc-tag i {
        color: var(--cr);
        font-size: .7rem;
    }

/* ═══════════════════════════════════════════
   NOTICES
═══════════════════════════════════════════ */
.notices-sec {
    background: var(--ppr2);
    padding: 4rem 1rem;
}

.notice-tape {
    background: var(--gd);
    color: var(--ink);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding: .35rem .8rem;
    display: inline-block;
    margin-bottom: .8rem;
}

.notice-row {
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    padding: .8rem 0;
    border-bottom: 1px solid var(--ppr3);
}

    .notice-row:last-child {
        border: none;
    }

.nr-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--cr);
    flex-shrink: 0;
    margin-top: 5px;
}

.nr-text {
    font-size: .87rem;
    color: var(--ink2);
    line-height: 1.5;
    flex: 1;
}

.nr-badge {
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .06em;
    padding: .2rem .55rem;
    background: rgba(139,26,46,.1);
    color: var(--cr);
    white-space: nowrap;
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════
   CONTACT
═══════════════════════════════════════════ */
.contact-sec {
    background: var(--wh);
    padding: 6rem 1rem;
}

.contact-info-block {
    border-right: 1px solid rgba(255,255,255,.08);
    padding-right: 3rem;
}

@media(max-width:991px) {
    .contact-info-block {
        border-right: none;
        padding-right: 0;
        border-bottom: 1px solid rgba(255,255,255,.08);
        padding-bottom: 2rem;
        margin-bottom: 2rem;
    }
}

.ci-item {
    display: flex;
    gap: 1.2rem;
    align-items: flex-start;
    margin-bottom: 2rem;
}

    .ci-item:last-child {
        margin: 0;
    }

.ci-icon {
    width: 44px;
    height: 44px;
    min-width: 44px;
    background: rgba(196,134,43,.12);
    border: 1px solid rgba(196,134,43,.2);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--gd2);
    font-size: .9rem;
}

.ci-item h6 {
    color: var(--green);
    font-size: .85rem;
    text-transform: uppercase;
    letter-spacing: .1em;
    margin-bottom: .3rem;
    font-weight:bold;
}

.ci-item p {
    color: rgba(0,0,0,.9);
    font-size: .9rem;
    line-height: 1.5;
    margin: 0;
}

.inp-dark {
    width: 100%;
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(0,0,0,.4);
    padding: .75rem 1rem;
    font-family: 'Outfit',sans-serif;
    font-size: .87rem;
    color: #444;
    outline: none;
    transition: border-color .2s;
}

    .inp-dark::placeholder {
        color: rgba(4,4,4,.8);
    }

    .inp-dark:focus {
        border-color: var(--gd);
    }

select.inp-dark option {
    background: var(--wh);
    color: #444;
}

.submit-btn {
    background: var(--cr);
    color: #fff;
    border: none;
    padding: .9rem 2.5rem;
    font-family: 'Outfit',sans-serif;
    font-size: .88rem;
    font-weight: 600;
    letter-spacing: .06em;
    cursor: pointer;
    clip-path: polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);
    transition: background .2s,transform .2s;
    width: 100%;
}

    .submit-btn:hover {
        background: var(--gd);
        color: var(--ink);
        transform: translateY(-2px);
    }

.social-row {
    display: flex;
    gap: .7rem;
    margin-top: 2rem;
}

.soc-btn {
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255,255,255,.12);
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,.5);
    font-size: .9rem;
    transition: all .25s;
}

    .soc-btn:hover {
        background: var(--cr);
        border-color: var(--cr);
        color: #fff;
    }

/* ═══════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════ */
footer {
    background: #0d0508;
    border-top: 1px solid rgba(255,255,255,.05);
    padding: 3rem 1rem 1.5rem;
}

.ft-brand {
    display: flex;
    align-items: center;
    gap: .8rem;
    margin-bottom: 1rem;
}

    .ft-brand img {
        width: 55px;
        height: 55px;
        border-radius: 50%;
        border: 2px solid rgba(196,134,43,.3);
        background:var(--wh);
    }

    .ft-brand strong {
        font-family: 'Cormorant Garamond',serif;
        font-size: 1.5rem;
        color: var(--gd2);
        display: block;
    }

    .ft-brand span {
        font-size: .9rem;
        color: rgba(255,255,255,.45);
    }

.ft-col h6 {
    font-size: .8rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(255,255,255,.8);
    margin-bottom: .9rem;
}

.ft-link {
    display: block;
    color: rgba(255,255,255,.45);
    font-size: .82rem;
    padding: .2rem 0;
    transition: color .2s;
}

    .ft-link:hover {
        color: var(--gd2);
    }

.ft-bottom {
    border-top: 1px solid rgba(255,255,255,.05);
    padding-top: 1.5rem;
    margin-top: 2.5rem;
    font-size: .75rem;
    color: rgba(255,255,255,.45);
}

/* ═══════════════════════════════════════════
   SCROLL TO TOP
═══════════════════════════════════════════ */
#scrollTop {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 9999;
    width: 48px;
    height: 48px;
    background: var(--cr);
    color: #fff;
    border: none;
    cursor: pointer;
    clip-path: polygon(50% 0%,100% 50%,85% 50%,85% 100%,15% 100%,15% 50%,0% 50%);
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transform: translateY(16px);
    transition: opacity .3s,visibility .3s,transform .3s,background .2s;
    box-shadow: 0 4px 20px rgba(139,26,46,.4);
}

    #scrollTop.visible {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    #scrollTop:hover {
        background: var(--gd);
    }

/* ═══════════════════════════════════════════
   SCROLL ANIMATIONS
═══════════════════════════════════════════ */
.reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .7s ease,transform .7s ease;
}

    .reveal.in {
        opacity: 1;
        transform: translateY(0);
    }

    .reveal.d1 {
        transition-delay: .1s;
    }

    .reveal.d2 {
        transition-delay: .2s;
    }

    .reveal.d3 {
        transition-delay: .3s;
    }

    .reveal.d4 {
        transition-delay: .4s;
    }

.reveal-l {
    opacity: 0;
    transform: translateX(-28px);
    transition: opacity .7s ease,transform .7s ease;
}

    .reveal-l.in {
        opacity: 1;
        transform: translateX(0);
    }

.reveal-r {
    opacity: 0;
    transform: translateX(28px);
    transition: opacity .7s ease,transform .7s ease;
}

    .reveal-r.in {
        opacity: 1;
        transform: translateX(0);
    }
/* ═══════════════════════════════════════
   GALLERY GRID
═══════════════════════════════════════ */
.glry-section {
    background: var(--ppr);
    padding: 4rem 1rem;
}

.glry-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    grid-template-rows: auto;
    gap: .6rem;
}

.glry-item {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    background: var(--ink);
}

    .glry-item:nth-child(1) {
        grid-column: span 1;
        grid-row: span 1;
    }

    .glry-item:nth-child(4) {
        grid-column: span 1;
    }

    .glry-item:nth-child(7) {
        grid-column: span 1;
    }

/* The coloured SVG placeholder face */
.glry-face {
    width: 100%;
    height: 200px;
    min-height: 160px;
    display: block;
    transition: transform .45s cubic-bezier(.25,.46,.45,.94);
    position: relative;
    z-index: 1;
    overflow: hidden;
}

    .glry-face img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transition: transform .45s cubic-bezier(.25,.46,.45,.94);
    }

.glry-item:hover .glry-face img {
    transform: scale(1.08);
}


/* dark scrim */
.glry-scrim {
    position: absolute;
    inset: 0;
    z-index: 2;
    background: rgba(28,13,18,0);
    transition: background .3s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.glry-item:hover .glry-scrim {
    background: rgba(28,13,18,.45);
}

.glry-zoom {
    opacity: 0;
    transform: scale(.7);
    transition: opacity .3s,transform .3s;
    width: 48px;
    height: 48px;
    border: 2px solid #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1rem;
    background: rgba(139,26,46,.7);
}

.glry-item:hover .glry-zoom {
    opacity: 1;
    transform: scale(1);
}

/* caption bar */
.glry-cap {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 3;
    padding: .55rem .9rem;
    background: linear-gradient(transparent,rgba(28,13,18,.85));
    transform: translateY(100%);
    transition: transform .32s;
}

.glry-item:hover .glry-cap {
    transform: translateY(0);
}

.glry-cap-title {
    font-family: 'Cormorant Garamond',serif;
    color: #fff;
    font-size: .95rem;
    font-weight: 600;
    display: block;
}

.glry-cap-sub {
    font-size: .7rem;
    color: rgba(255,255,255,.6);
    display: block;
    margin-top: .1rem;
}

/* category pill */
.glry-pill {
    position: absolute;
    top: .65rem;
    left: .65rem;
    z-index: 4;
    background: var(--cr);
    color: #fff;
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: .2rem .55rem;
}

/* responsive */
@media(max-width:768px) {
    .glry-grid {
        grid-template-columns: repeat(2,1fr);
    }

    .glry-item:nth-child(1) {
        grid-column: span 2;
        grid-row: span 1;
    }

    .glry-item:nth-child(4), .glry-item:nth-child(7) {
        grid-column: span 2;
    }

    .glry-item:nth-child(1) .glry-face {
        min-height: 200px;
    }
}

@media(max-width:480px) {
    .glry-grid {
        grid-template-columns: 1fr 1fr;
    }
}

/* ═══════════════════════════════════════
   LIGHTBOX
═══════════════════════════════════════ */
.lb-overlay {
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: rgba(10,4,8,.94);
    backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity .35s,visibility .35s;
}

    .lb-overlay.open {
        opacity: 1;
        visibility: visible;
    }

.lb-box {
    position: relative;
    max-width: 860px;
    width: 92vw;
    display: flex;
    flex-direction: column;
    transform: scale(.93) translateY(20px);
    transition: transform .38s cubic-bezier(.34,1.56,.64,1);
}

.lb-overlay.open .lb-box {
    transform: scale(1) translateY(0);
}

/* main display */
.lb-display {
    width: 100%;
    background: #111;
    aspect-ratio: 16/9;
    display: block;
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.07);
}

.lb-display-face {
    width: 100%;
    height: 100%;
    transition: opacity .3s;
}

    .lb-display-face i {
        font-size: 5rem;
    }

    .lb-display-face h3 {
        font-family: 'Cormorant Garamond',serif;
        font-size: 2rem;
        color: #fff;
    }

    .lb-display-face p {
        font-size: .88rem;
        color: rgba(255,255,255,.55);
        max-width: 420px;
        line-height: 1.7;
    }

/* photo credit strip */
.lb-credit {
    background: rgba(255,255,255,.03);
    border-top: 1px solid rgba(255,255,255,.06);
    padding: .5rem 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: .4rem;
    position: relative;
    width: 100%;
    background: var(--cr);
    margin-top: -42px;
}

.lb-credit-title {
    font-family: 'Cormorant Garamond',serif;
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
}

.lb-credit-cat {
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: .18rem .55rem;
    background: var(--cr);
    color: #fff;
}

.lb-credit-sub {
    font-size: .73rem;
    color: rgba(255,255,255,.4);
}

/* controls row */
.lb-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .6rem 0;
}

.lb-arr {
    width: 44px;
    height: 44px;
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.12);
    color: #fff;
    font-size: .9rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s;
    flex-shrink: 0;
}

    .lb-arr:hover {
        background: var(--cr);
        border-color: var(--cr);
    }

    .lb-arr:disabled {
        opacity: .3;
        cursor: default;
    }

/* thumbnail strip */
.lb-thumbs {
    display: flex;
    gap: .4rem;
    overflow-x: auto;
    padding: .1rem;
    scrollbar-width: thin;
    scrollbar-color: var(--cr) rgba(255,255,255,.05);
}

    .lb-thumbs::-webkit-scrollbar {
        height: 3px;
    }

    .lb-thumbs::-webkit-scrollbar-track {
        background: rgba(255,255,255,.05);
    }

    .lb-thumbs::-webkit-scrollbar-thumb {
        background: var(--cr);
    }

.lb-thumb {
    flex-shrink: 0;
    width: 68px;
    height: 48px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid transparent;
    transition: border-color .2s,transform .2s;
    overflow: hidden;
    opacity: .55;
}

    .lb-thumb.active {
        border-color: var(--gd2);
        opacity: 1;
        transform: translateY(-2px);
    }

    .lb-thumb:hover {
        opacity: .85;
    }

.lb-thumb-face {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* counter */
.lb-counter {
    color: rgba(255,255,255,.4);
    font-size: .78rem;
    letter-spacing: .08em;
}

/* close */
.lb-close {
    position: absolute;
    top: -44px;
    right: 0;
    width: 40px;
    height: 40px;
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.15);
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    transition: all .2s;
}

    .lb-close:hover {
        background: var(--cr);
        border-color: var(--cr);
    }

/* keyboard hint */
.lb-hint {
    text-align: center;
    font-size: .68rem;
    color: rgba(255,255,255,.2);
    padding: .4rem 0 0;
    letter-spacing: .06em;
}