.departments-page {
    --department-navy: #1f77a8;
    --department-deep: #176493;
    --department-orange: #f05a28;
    --department-mist: #f1f7fb;
    --department-ink: #143d5a;
    --department-muted: #607b8f;
    --department-line: rgba(31, 119, 168, .17);
    overflow: hidden;
    background: #fff;
}

.departments-shell { width: min(1376px, calc(100% - 48px)); margin: 0 auto; }

.departments-kicker {
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 0 0 22px;
    color: #fff;
    font-size: 13px;
    font-weight: 850;
    letter-spacing: .14em;
    line-height: 1.3;
    text-transform: uppercase;
}

.departments-kicker::before { width: 32px; height: 2px; content: ''; background: var(--department-orange); }
.departments-kicker--dark { color: var(--department-navy); }

.departments-hero { position: relative; overflow: hidden; padding: clamp(84px, 10vw, 142px) 0; color: #fff; background: var(--department-deep); }
.departments-hero::after { position: absolute; right: -18vw; bottom: -27vw; width: 63vw; height: 63vw; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; content: ''; }
.departments-hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr .35fr; align-items: end; gap: 50px; }
.departments-hero h1, .department-detail-hero h1 { max-width: 840px; margin: 0; color: #fff; font-family: Montserrat, sans-serif; font-size: clamp(48px, 6.2vw, 88px); font-weight: 750; letter-spacing: -.06em; line-height: .96; }
.departments-hero h1 span { color: var(--department-orange); }
.departments-hero p:not(.departments-kicker), .department-detail-hero__lead { max-width: 670px; margin: 30px 0 0; color: rgba(255,255,255,.76); font-size: 18px; font-weight: 500; line-height: 1.68; }
.departments-hero__summary { display: flex; align-items: center; justify-content: end; gap: 17px; padding: 25px 0; border-top: 1px solid rgba(255,255,255,.27); border-bottom: 1px solid rgba(255,255,255,.27); }
.departments-hero__summary span { color: var(--department-orange); font-size: clamp(56px, 6vw, 82px); font-weight: 800; letter-spacing: -.06em; line-height: .8; }
.departments-hero__summary p { margin: 0; color: rgba(255,255,255,.78); font-size: 13px; font-weight: 700; line-height: 1.45; text-transform: uppercase; }

.departments-directory { padding: clamp(80px, 10vw, 138px) 0; }
.departments-directory__heading, .department-team__heading { display: grid; grid-template-columns: 1fr .48fr; align-items: end; gap: 80px; }
.departments-directory h2, .department-team h2, .departments-invitation h2 { max-width: 800px; margin: 0; color: var(--department-navy); font-family: Montserrat, sans-serif; font-size: clamp(38px, 4.4vw, 65px); font-weight: 750; letter-spacing: -.055em; line-height: 1.02; }
.departments-directory__heading > p, .department-team__heading > p { margin: 0; color: var(--department-muted); font-size: 17px; font-weight: 500; line-height: 1.7; }
.departments-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 19px; margin-top: 54px; }
.department-card { display: flex; min-height: 460px; flex-direction: column; overflow: hidden; color: var(--department-ink); border: 1px solid var(--department-line); border-radius: 14px; background: #fff; box-shadow: 0 10px 30px rgba(3,29,51,.05); text-decoration: none; }
.department-card:hover { color: var(--department-ink); box-shadow: 0 20px 40px rgba(3,29,51,.16); transform: translateY(-6px); }
.department-card__image { height: 170px; overflow: hidden; background: var(--department-mist); }
.department-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.department-card:hover .department-card__image img { transform: scale(1.06); }
.department-card__body { display: flex; flex: 1; flex-direction: column; padding: 27px 25px 23px; }
.department-card__number { color: var(--department-orange); font-size: 15px; font-weight: 850; letter-spacing: .08em; }
.department-card h3 { margin: 26px 0 13px; color: var(--department-navy); font-family: Montserrat, sans-serif; font-size: 23px; font-weight: 750; letter-spacing: -.03em; line-height: 1.16; }
.department-card__body > p { margin: 0; color: var(--department-muted); font-size: 14px; font-weight: 500; line-height: 1.6; }
.department-card__footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: auto; padding-top: 27px; color: var(--department-navy); border-top: 1px solid var(--department-line); font-size: 12px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
.department-card__footer b { color: var(--department-orange); font-size: 25px; line-height: .7; }
.departments-empty { color: var(--department-muted); font-size: 16px; }

.departments-invitation { padding: 68px 0; color: #fff; background: var(--department-navy); }
.departments-invitation__inner { display: flex; align-items: center; justify-content: space-between; gap: 50px; }
.departments-invitation h2 { color: #fff; font-size: clamp(31px, 3.5vw, 52px); }
.departments-invitation a { display: inline-flex; align-items: center; gap: 15px; min-height: 52px; padding: 14px 20px; color: var(--department-ink); border-radius: 8px; background: var(--department-orange); font-size: 14px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.departments-invitation a:hover { color: var(--department-ink); background: #ffbd4e; transform: translateY(-2px); }

.department-detail-hero { padding: clamp(58px, 8vw, 106px) 0 clamp(72px, 9vw, 120px); color: #fff; background: linear-gradient(118deg, var(--department-deep), var(--department-navy)); }
.department-back { display: inline-flex; gap: 10px; margin-bottom: clamp(54px, 7vw, 94px); color: rgba(255,255,255,.75); font-size: 14px; font-weight: 700; text-decoration: none; }
.department-back:hover { color: var(--department-orange); }
.department-detail-hero h1 { max-width: 1020px; }
.department-focus { display: grid; grid-template-columns: 120px minmax(0, 600px); gap: 22px; margin-top: 45px; padding: 21px 0; border-top: 1px solid rgba(255,255,255,.24); border-bottom: 1px solid rgba(255,255,255,.24); }
.department-focus span { color: var(--department-orange); font-size: 12px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.department-focus p { margin: 0; color: #fff; font-size: 15px; font-weight: 600; line-height: 1.5; }

.department-team { padding: clamp(79px, 10vw, 140px) 0; background: var(--department-mist); }
.department-staff-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 53px; }
.department-staff-card { min-height: 366px; padding: 27px 25px; border: 1px solid var(--department-line); border-radius: 13px; background: #fff; }
.department-staff-card__top { display: flex; align-items: center; gap: 15px; }
.department-staff-card__avatar { display: inline-flex; align-items: center; justify-content: center; width: 96px; height: 96px; flex: 0 0 96px; color: var(--department-ink); border: 2px solid var(--department-orange); border-radius: 50%; background: var(--department-orange); font-size: 22px; font-weight: 850; letter-spacing: .06em; }
.department-staff-card__photo { width: 112px; height: 112px; flex: 0 0 112px; border: 3px solid var(--department-orange); border-radius: 50%; object-fit: cover; object-position: center; box-shadow: 0 9px 20px rgba(20, 61, 90, .14); }
.department-staff-card__top p { margin: 0; color: var(--department-muted); font-size: 12px; font-weight: 750; line-height: 1.35; text-transform: uppercase; }
.department-staff-card h3 { margin: 28px 0 13px; color: var(--department-navy); font-family: Montserrat, sans-serif; font-size: 23px; font-weight: 750; letter-spacing: -.03em; }
.department-staff-card__bio { min-height: 65px; margin: 0; color: var(--department-muted); font-size: 14px; font-weight: 500; line-height: 1.58; }
.department-staff-card dl { display: grid; gap: 8px; margin: 24px 0 0; padding-top: 19px; border-top: 1px solid var(--department-line); }
.department-staff-card dl div { display: grid; grid-template-columns: 75px 1fr; gap: 10px; }
.department-staff-card dt { color: var(--department-orange); font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.department-staff-card dd { margin: 0; color: var(--department-ink); font-size: 13px; font-weight: 600; line-height: 1.45; }
.department-staff-card dd a { color: var(--department-navy); text-decoration: none; }
.department-staff-card dd a:hover { color: var(--department-orange); }

@media (max-width: 991px) {
    .departments-hero__grid, .departments-directory__heading, .department-team__heading { grid-template-columns: 1fr; gap: 30px; }
    .departments-hero__summary { justify-content: start; max-width: 360px; }
    .departments-grid, .department-staff-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 620px) {
    .departments-shell { width: min(100% - 32px, 1376px); }
    .departments-hero { padding: 65px 0; }
    .departments-hero h1, .department-detail-hero h1 { font-size: clamp(44px, 13vw, 62px); }
    .departments-hero p:not(.departments-kicker), .department-detail-hero__lead { margin-top: 22px; font-size: 16px; }
    .departments-grid, .department-staff-grid { grid-template-columns: 1fr; margin-top: 40px; }
    .departments-directory, .department-team { padding: 68px 0; }
    .departments-directory h2, .department-team h2 { font-size: clamp(35px, 10vw, 48px); }
    .departments-directory__heading > p, .department-team__heading > p { font-size: 16px; }
    .department-card { min-height: 420px; }
    .departments-invitation__inner { align-items: flex-start; flex-direction: column; gap: 29px; }
    .department-focus { grid-template-columns: 1fr; gap: 8px; margin-top: 32px; }
    .department-staff-card { min-height: auto; }
    .department-staff-card__photo { width: 94px; height: 94px; flex-basis: 94px; }
    .department-staff-card__avatar { width: 82px; height: 82px; flex-basis: 82px; font-size: 18px; }
}

/* White-first visual system */
.departments-page {
    --department-navy: #143d5a;
    --department-deep: #fff;
    --department-mist: #fff;
    --department-ink: #143d5a;
    --department-muted: #607b8f;
    --department-line: rgba(20, 61, 90, .16);
}

.departments-hero,
.department-detail-hero { color: var(--department-ink); background: #fff; border-bottom: 1px solid var(--department-line); }
.departments-hero__summary { border-color: var(--department-line); }
.departments-hero__summary p { color: var(--department-ink); }
.departments-hero h1,
.department-detail-hero h1 { color: var(--department-ink); }
.departments-hero p:not(.departments-kicker),
.department-detail-hero__lead { color: var(--department-muted); }
.departments-hero .departments-kicker,
.department-detail-hero .departments-kicker { color: var(--department-ink); }
.departments-invitation { color: var(--department-ink); background: #fff; border-top: 1px solid var(--department-line); }
.departments-invitation h2 { color: var(--department-ink); }
.department-back { color: var(--department-ink); }
.department-focus { border-color: var(--department-line); }
.department-focus p { color: var(--department-ink); }
.department-team { background: #fff; }

/* University structure */
.departments-structure {
    --org-orange: #f4511e;
    --org-navy: #143d5a;
    --org-muted: #607b8f;
    --org-line: rgba(20, 61, 90, .38);
    padding: clamp(48px, 6vw, 82px) 0 clamp(52px, 6vw, 90px);
    background: #fff;
}

.departments-structure__heading { max-width: 790px; margin: 0 auto 52px; text-align: center; }
.departments-structure__heading .departments-kicker { justify-content: center; }
.departments-structure__heading h1 { margin: 16px 0 16px; color: var(--org-navy); font-family: Montserrat, sans-serif; font-size: clamp(38px, 5vw, 67px); font-weight: 800; letter-spacing: -.06em; line-height: 1; }
.departments-structure__heading h1 span { color: var(--org-orange); }
.departments-structure__heading > p:last-child { max-width: 620px; margin: 0 auto; color: var(--org-muted); font-size: 17px; font-weight: 500; line-height: 1.65; }

.org-chart { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 26px 34px; max-width: 1420px; margin: 0 auto; padding: clamp(26px, 4vw, 52px); overflow: hidden; border: 1px solid var(--org-line); border-radius: 20px; background: linear-gradient(180deg, #fff 0%, #fffaf8 100%); box-shadow: 0 18px 42px rgba(20, 61, 90, .07); }
.org-chart::before { position: absolute; top: 0; left: 50%; width: 136px; height: 4px; border-radius: 0 0 999px 999px; background: var(--org-orange); content: ''; transform: translateX(-50%); }

.org-chart__leadership { position: relative; display: grid; justify-items: center; grid-column: 1 / -1; gap: 14px; }
.org-chart__leadership::after { position: absolute; bottom: -26px; left: 50%; width: 1px; height: 26px; background: var(--org-line); content: ''; transform: translateX(-50%); }
.org-chart__node { position: relative; display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 54px; width: min(360px, 100%); padding: 12px 24px; border-radius: 8px; font-size: 18px; font-weight: 800; line-height: 1.2; text-align: center; }
.org-chart__node--primary { color: #fff; background: var(--org-orange); box-shadow: 0 9px 22px rgba(244, 81, 30, .2); }
.org-chart__node--primary:not(:last-child)::after { position: absolute; bottom: -14px; left: 50%; width: 1px; height: 14px; background: var(--org-line); content: ''; }
.org-chart__node-icon { font-size: 19px; }

.org-chart__advisory { position: absolute; top: 146px; left: calc(50% + 235px); display: grid; grid-template-columns: 26px 1fr; column-gap: 10px; min-width: 190px; padding: 16px 18px; border: 1px solid var(--org-navy); border-radius: 9px; color: var(--org-navy); background: #fff; }
.org-chart__advisory::before { position: absolute; top: 50%; right: 100%; width: 55px; border-top: 1px dashed var(--org-navy); content: ''; }
.org-chart__advisory strong { font-size: 15px; line-height: 1.2; }
.org-chart__advisory span { color: var(--org-muted); font-size: 12px; font-weight: 650; }
.org-chart__advisory-icon { grid-row: 1 / span 2; align-self: center; color: var(--org-orange); font-size: 24px; }

.org-chart__branches { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); grid-column: 1 / -1; gap: 18px; padding-top: 38px; }
.org-chart__branches::before { position: absolute; top: 0; right: calc(10% - 7px); left: calc(10% - 7px); height: 1px; background: var(--org-line); content: ''; }
.org-chart__branch { position: relative; min-width: 0; }
.org-chart__branch::before { position: absolute; top: -38px; left: 50%; width: 1px; height: 38px; background: var(--org-line); content: ''; }
.org-chart__branch h2 { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 76px; margin: 0; padding: 15px 14px; color: var(--org-navy); border: 1px solid var(--org-navy); border-radius: 9px; background: #fff; font-family: Montserrat, sans-serif; font-size: 15px; font-weight: 800; letter-spacing: -.025em; line-height: 1.2; text-align: center; }
.org-chart__branch-icon { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; flex: 0 0 30px; color: var(--org-orange); border-radius: 50%; background: #fff1ec; font-size: 15px; }
.org-chart__branch ul { display: grid; gap: 8px; margin: 0; padding: 16px 0 0; list-style: none; }
.org-chart__branch ul::before { display: none; }
.org-chart__branch li { position: relative; display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 9px 10px; color: var(--org-navy); border: 1px solid var(--org-line); border-radius: 7px; background: #fff; font-size: 12px; font-weight: 700; line-height: 1.3; }
.org-chart__branch li::before { display: none; }
.org-chart__branch li > i { width: 17px; flex: 0 0 17px; color: var(--org-orange); font-size: 15px; text-align: center; }
.org-chart__independent { display: grid; align-content: start; gap: 12px; grid-column: 2; grid-row: 3; }
.org-chart__independent div { display: flex; align-items: center; gap: 10px; min-height: 58px; padding: 14px 16px; color: var(--org-navy); border: 1px solid var(--org-navy); border-radius: 9px; background: #fff; font-size: 13px; font-weight: 800; line-height: 1.25; }
.org-chart__independent i { color: var(--org-orange); font-size: 21px; }

[data-structure-intro], [data-org-node] { opacity: 0; transform: translateY(22px) scale(.98); }
.departments-structure--visible [data-structure-intro] { animation: departments-structure-reveal .65s ease-out both; }
.departments-structure--visible [data-org-node] { animation: departments-structure-reveal .58s cubic-bezier(.2, .75, .2, 1) calc(var(--org-delay, 1) * 85ms) both; }
.org-chart__branch { opacity: 0; transform: translateY(22px) scale(.98); }
.departments-structure--visible .org-chart__branch { animation: departments-structure-reveal .58s cubic-bezier(.2, .75, .2, 1) calc(var(--org-delay, 1) * 85ms) both; }
@keyframes departments-structure-reveal { from { opacity: 0; transform: translateY(22px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }

@media (max-width: 1180px) {
    .org-chart { grid-template-columns: 1fr; }
    .org-chart__leadership { padding-right: 0; }
    .org-chart__leadership::after { left: 50%; }
    .org-chart__advisory { position: relative; top: auto; left: auto; justify-self: center; grid-column: 1; width: min(360px, 100%); margin-top: -8px; text-align: center; }
    .org-chart__advisory::before { display: none; }
    .org-chart__branches { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .org-chart__branches::before { display: none; }
    .org-chart__branch::before { display: none; }
    .org-chart__independent { grid-column: 1; grid-row: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 620px; width: 100%; justify-self: center; }
}

@media (max-width: 760px) {
    .departments-structure__heading { margin-bottom: 34px; text-align: left; }
    .departments-structure__heading .departments-kicker { justify-content: flex-start; }
    .departments-structure__heading > p:last-child { margin-left: 0; }
    .org-chart { padding: 34px 18px 22px; border-radius: 14px; }
    .org-chart__branches { grid-template-columns: 1fr; padding-top: 0; }
    .org-chart__branch { padding-top: 20px; border-top: 1px solid var(--org-line); }
    .org-chart__branch h2 { min-height: 60px; justify-content: flex-start; padding: 13px 15px; text-align: left; }
    .org-chart__branch ul { padding: 12px 0 0; }
    .org-chart__branch ul::before, .org-chart__branch li::before { display: none; }
    .org-chart__independent { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    [data-structure-intro], [data-org-node], .org-chart__branch { opacity: 1; transform: none; animation: none !important; }
}
