/* ── 13. TEAM PAGE ─────────────────────────────────────────── */
.pi-feature { padding: clamp(2.5rem, 5vw, 4rem) 0; }
.pi-feature__grid { display: grid; grid-template-columns: 1fr 1.25fr; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.pi-feature__aside { display: flex; flex-direction: column; gap: 1.8rem; min-width: 0; }
/* min-width:0 down this whole chain: without it, a CSS grid item defaults
   to an "automatic minimum size" equal to its content's min-content width,
   which for a wide horizontally-scrolling publications carousel can be huge
   (many cards, each min(320px,82vw) — or full-width in the nested variant
   below). That forced the 1.25fr column — and the whole page — wider than
   the viewport on any profile that has related publications attached,
   producing a horizontal scrollbar and a broken layout. Scoping overflow to
   the carousel track (which already scrolls) needs every ancestor between
   the grid item and the track to be allowed to shrink below its content size. */
.pi-feature__body { min-width: 0; }

/* Academic-impact stats under the photo */
.pi-stats { display: flex; border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; }
.pi-stats__item {
    flex: 1; text-align: center; padding: 1.1rem .5rem;
    border-left: 1px solid var(--line);
}
.pi-stats__item:first-child { border-left: 0; }
.pi-stats__value { display: block; font-size: 1.35rem; font-weight: 700; color: var(--blue-700); line-height: 1.1; }
.pi-stats__label { display: block; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-faint); margin-top: .3rem; }
.pi-feature__photo { border-radius: var(--radius-lg); overflow: hidden; background: var(--blue-50); aspect-ratio: 4/5; position: relative; }
.pi-feature__photo img { width: 100%; height: 100%; object-fit: cover; }
.pi-feature__photo--hover {
    box-shadow: 0 0 0 1px var(--line);
    transition: box-shadow .3s ease-out, var(--reveal-transition);
}
@media (hover: hover) and (pointer: fine) {
    .pi-feature__photo--hover:hover {
        box-shadow: 0 0 0 3px var(--blue-500);
    }
}
.pi-feature__role { display: inline-block; font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--blue-700); margin-bottom: .5rem; }
.pi-feature__body h1, .pi-feature__body h2 { margin-bottom: .6rem; }
.pi-feature__short { font-size: 1.08rem; font-weight: 600; color: var(--ink-2); margin-bottom: 1.2rem; }
.pi-feature__bio p { margin-bottom: 1rem; }
.pi-feature__links { display: flex; flex-wrap: wrap; gap: 1.4rem; margin: 1.6rem 0; }
.pi-feature__links a { font-weight: 700; font-size: .88rem; color: var(--blue-700); border-bottom: 1px solid var(--blue-300); }
.pi-milestones { padding-top: 1.6rem; border-top: 1px solid var(--line); }
.pi-milestones h2 { font-size: 1.1rem; margin-bottom: 1.6rem; }
.pi-milestones__list { position: relative; display: flex; flex-direction: column; gap: 1.3rem; }
.pi-milestones__list::before {
    content: ""; position: absolute; left: 4px; top: 6px; bottom: 6px; width: 1px;
    background: var(--blue-100);
}
.pi-milestones__list li {
    position: relative; padding-left: 1.7rem; font-size: .95rem; color: var(--ink-2); line-height: 1.5;
}
.pi-milestones__list li::before {
    content: ""; position: absolute; left: 0; top: .35em; width: 9px; height: 9px; border-radius: 50%;
    background: var(--paper); border: 2px solid var(--blue-300); box-sizing: border-box; z-index: 1;
}

.pi-pubs { margin-top: 2rem; padding-top: 2rem; border-top: 1px solid var(--line); min-width: 0; }
.pi-pubs h2 { font-size: 1.15rem; margin-bottom: 1.2rem; }
.pub-carousel--nested .pub-carousel__card { flex-basis: 100%; }

/* PI teaser card (on the Team index page — links through to the single profile) */
.pi-teaser { padding: clamp(2.5rem, 5vw, 4rem) 0 1rem; }
.pi-teaser__card {
    display: grid; grid-template-columns: .5fr 1fr; gap: clamp(1.6rem, 4vw, 3rem); align-items: center;
    border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(1.2rem, 3vw, 2rem);
    transition: box-shadow var(--dur-base) var(--ease), transform var(--dur-base) var(--ease), border-color var(--dur-base) var(--ease), var(--reveal-transition);
}
@media (hover: hover) and (pointer: fine) {
    .pi-teaser__card:hover { box-shadow: var(--shadow-md); border-color: var(--blue-300); }
}
.pi-teaser__photo { aspect-ratio: 3/4; border-radius: var(--radius-md); overflow: hidden; background: var(--blue-50); max-width: 220px; }
.pi-teaser__photo img { width: 100%; height: 100%; object-fit: cover; }
.pi-teaser__body h3 { margin: .3rem 0 .6rem; font-size: 1.3rem; }
.pi-teaser__body p { margin-bottom: 1rem; }
.pi-teaser__cta { font-weight: 700; color: var(--blue-700); font-size: .9rem; }

.team-role-group { margin-bottom: 3rem; }
.team-role-group:last-child { margin-bottom: 0; }
.team-role-group__title {
    font-size: 1rem; text-transform: uppercase; letter-spacing: .06em; color: var(--blue-700);
    padding-bottom: .8rem; margin-bottom: 1.6rem; border-bottom: 1px solid var(--line);
}

.team-grid-section { padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(4rem, 7vw, 6rem); }
.team-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.8rem; }
.team-card { display: block; text-align: left; transition: var(--reveal-transition); }
.team-card__photo { aspect-ratio: 3/4; border-radius: var(--radius-md); overflow: hidden; background: var(--blue-50); margin-bottom: 1rem; }
.team-card__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--dur-slow) var(--ease); }
@media (hover: hover) and (pointer: fine) {
    .team-card:hover .team-card__photo img { transform: scale(1.04); }
}
.team-card__placeholder { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: var(--blue-300); }
.team-card__placeholder svg { width: 46px; height: 46px; }
.team-card__name { font-size: 1rem; margin-bottom: .2rem; }
.team-card__role { display: block; font-size: .78rem; font-weight: 700; color: var(--blue-700); text-transform: uppercase; letter-spacing: .03em; margin-bottom: .5rem; }
.team-card__bio { font-size: .88rem; }

/* Element-qualified on purpose: WordPress also puts "single-team" on <body>
   for these pages, and a bare class selector padded the body itself — the
   dark band that showed below the footer. */
section.single-team { padding: clamp(2.5rem, 5vw, 4rem) 0 2rem; }

/* Related publications carousel on single-team.php */
.pub-carousel { position: relative; display: flex; align-items: center; gap: .8rem; padding: 0 clamp(1.25rem, 4vw, 3rem); margin-bottom: 1rem; min-width: 0; }
.pub-carousel__track {
    display: flex; gap: 1.2rem; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
    padding: .4rem .2rem 1rem; flex: 1; min-width: 0; scrollbar-width: none;
}
.pub-carousel__track::-webkit-scrollbar { display: none; }
.pub-carousel__card { flex: 0 0 min(320px, 82vw); scroll-snap-align: start; scroll-snap-stop: always; }
.pub-carousel__arrow {
    flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--line-strong);
    display: flex; align-items: center; justify-content: center; color: var(--ink-2);
    transition: background .25s, color .25s, border-color .25s;
}
.pub-carousel__arrow svg { width: 18px; height: 18px; }
@media (hover: hover) and (pointer: fine) {
    .pub-carousel__arrow:hover:not(:disabled) { background: var(--ink); color: #fff; border-color: var(--ink); }
}
.pub-carousel__arrow:disabled { opacity: .3; cursor: not-allowed; }
@media (max-width: 900px) {
    /* One card per view, no sliver of the next one peeking in */
    .pub-carousel__card { flex-basis: 100%; }
}
@media (max-width: 640px) { .pub-carousel__arrow { display: none; } }