/*
 * Academy About faculty (/about-faculty/) — section styles
 * Same grid as the rest of the site: 5 columns inside the container, 16px gap, c = (100% - 64px) / 5.
 */

/* ── Shared ─────────────────────────────────────────────────────────────── */
.afac-head {
    display:        flex;
    flex-direction: column;
    gap:            16px;
    align-items:    flex-start;
}
.afac-title {
    margin:    0;
    font-size: clamp(56px, 6.111vw, 88px);
}
.afac-title--xl { font-size: clamp(72px, 7.222vw, 104px); }

.afac-fig { margin: 0; overflow: hidden; }
.afac-img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ── Hero ───────────────────────────────────────────────────────────────── */
.afac-hero { padding: 48px 0 300px; }

.afac-hero__grid {
    display:               grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    column-gap:            16px;
    row-gap:               72px;
    align-items:           start;
}
.afac-hero__head { grid-column: 1 / 6; grid-row: 1; }

.afac-hero__figure--wide { grid-column: 1 / 4; grid-row: 2; height: 440px; }
.afac-hero__figure--1,
.afac-hero__figure--2 { display: none; }

.afac-hero__text {
    grid-column:    5;
    grid-row:       2;
    align-self:     end;
    display:        flex;
    flex-direction: column;
    gap:            16px;
}
.afac-hero__text p { margin: 0; }

/* ── People (mosaic) ────────────────────────────────────────────────────── */
.afac-people { padding: 0 0 300px; }

.afac-people__top {
    display:               grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    column-gap:            16px;
    align-items:           start;
    margin-bottom:         72px;
}
.afac-people__head { grid-column: 1 / 4; }
.afac-people__text { grid-column: 5; margin: 111px 0 0; }

.afac-people__grid {
    display:               grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    grid-template-rows:    440px 300px 300px;
    column-gap:            16px;
    row-gap:               64px;
    align-items:           start;
    margin:                0;
    padding:               0;
    list-style:            none;
}
.afac-card { display: flex; flex-direction: column; gap: 16px; height: 300px; min-width: 0; }
.afac-card__figure { flex: 1; min-height: 0; }
.afac-card__text { display: flex; flex-direction: column; gap: 8px; }
.afac-card__text p { margin: 0; }
.afac-card__name {
    margin:         0;
    font-size:      var(--fs-lead);
    font-weight:    var(--fw-medium);
    line-height:    var(--line-height);
    letter-spacing: var(--ls-tight);
}

.afac-card--1 { grid-column: 1 / 3; grid-row: 1; height: 440px; }
.afac-card--2 { grid-column: 4;     grid-row: 1; }
.afac-card--3 { grid-column: 5;     grid-row: 1; }
.afac-card--4 { grid-column: 2;     grid-row: 2; }
.afac-card--5 { grid-column: 2 / 4; grid-row: 3; }
.afac-card--6 { grid-column: 5;     grid-row: 2; height: 440px; }

/* The description is one column wide, also under the wide photos */
.afac-card--1 .afac-card__text p,
.afac-card--5 .afac-card__text p { max-width: calc((100% - 16px) / 2); }

/* ── Areas ──────────────────────────────────────────────────────────────── */
.afac-areas { padding: 0; }

.afac-areas__grid {
    display:               grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    column-gap:            16px;
    row-gap:               72px;
    align-items:           start;
}
.afac-areas__head { grid-column: 1 / 6; grid-row: 1; }

.afac-areas__info {
    grid-column:     1;
    grid-row:        2;
    display:         flex;
    flex-direction:  column;
    justify-content: space-between;
    gap:             24px;
    height:          300px;
}
.afac-areas__lead {
    margin:         0;
    font-size:      var(--fs-lead);
    font-weight:    var(--fw-medium);
    line-height:    var(--line-height);
    letter-spacing: var(--ls-tight);
}
.afac-areas__info .btn { width: 100%; }

.afac-areas__figure { grid-row: 2; height: 300px; }
.afac-areas__figure--1 { grid-column: 4; }
.afac-areas__figure--2 { grid-column: 5; }

/* ── Tablet / mobile ────────────────────────────────────────────────────── */
@media (max-width: 1023px) {
    .afac-title,
    .afac-title--xl { font-size: 64px; }

    .afac-hero { padding: 24px 0 104px; }
    .afac-hero__grid { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 24px 8px; }
    .afac-hero__head { flex: 0 0 100%; }
    .afac-hero__figure--wide { display: none; }
    .afac-hero__figure--1,
    .afac-hero__figure--2 { display: block; flex: 1 1 0; }
    .afac-hero__figure--1 { height: 427px; }
    .afac-hero__figure--2 { height: 245px; }
    .afac-hero__text { flex: 0 0 100%; gap: 24px; }

    .afac-people { padding-bottom: 104px; }
    .afac-people__top { display: flex; flex-direction: column; align-items: stretch; gap: 24px; margin-bottom: 32px; }
    .afac-people__text { margin: 0; }
    .afac-people__grid { display: flex; flex-direction: column; align-items: stretch; gap: 32px; }
    .afac-card,
    .afac-card--1,
    .afac-card--6 { height: auto; }
    .afac-card__figure { flex: 0 0 auto; height: 180px; }
    .afac-card--1 .afac-card__text p,
    .afac-card--5 .afac-card__text p { max-width: none; }

    .afac-areas { padding-bottom: 104px; }
    .afac-areas__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 8px; row-gap: 24px; }
    .afac-areas__head { grid-column: 1 / 3; }
    .afac-areas__info { grid-column: 1 / 3; grid-row: 2; height: auto; }
    .afac-areas__figure { grid-row: 3; }
    .afac-areas__figure--1 { grid-column: 1; }
    .afac-areas__figure--2 { grid-column: 2; }
}

@media (max-width: 767px) {
    .afac-title { font-size: 48px; }
    .afac-title--xl { font-size: 64px; }
}
