/* Team person detail popup (assets/js/team-modal.js). */
.is-clickable[data-c~="team-person"], .team-person.is-clickable { cursor: pointer; transition: transform .2s ease; }
.is-clickable[data-c~="team-person"]:hover, .is-clickable[data-c~="team-person"]:focus-visible { transform: translateY(-4px); }
.is-clickable[data-c~="team-person"]:focus-visible { outline: 2px solid var(--color-dark, #111); outline-offset: 6px; border-radius: 12px; }

html.team-modal-open { overflow: hidden; }
.team-modal { position: fixed; inset: 0; z-index: 99999; display: grid; place-items: center; padding: 16px; }
.team-modal[hidden] { display: none; }
.team-modal__overlay { position: absolute; inset: 0; background: rgba(17, 17, 17, .6); opacity: 0; transition: opacity .25s ease; }
.team-modal__dialog {
  position: relative; width: min(760px, 100%); max-height: calc(100vh - 32px); overflow: auto;
  display: grid; grid-template-columns: 240px 1fr; gap: 32px; align-items: start;
  background: var(--color-white, #fff); color: var(--color-dark, #111);
  border: var(--border-w, 2px) solid var(--color-dark, #111); border-radius: 20px; padding: 40px;
  opacity: 0; transform: translateY(16px) scale(.98); transition: opacity .25s ease, transform .25s ease; outline: none;
}
.team-modal.is-open .team-modal__overlay, .team-modal.is-open .team-modal__dialog { opacity: 1; transform: none; }
.team-modal__close {
  position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; border-radius: 50%;
  border: var(--border-w, 2px) solid var(--color-dark, #111); background: var(--color-white, #fff); color: var(--color-dark, #111);
  font-size: 24px; line-height: 1; cursor: pointer; display: grid; place-items: center; padding: 0;
}
.team-modal__close:hover { background: var(--color-dark, #111); color: var(--color-white, #fff); }
.team-modal__photo { aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: var(--color-yellow-tag); }
.team-modal__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.team-modal__division { font-family: var(--font-sans); font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; margin: 0 0 .5rem; opacity: .7; }
.team-modal__division:empty, .team-modal__role:empty { display: none; }
.team-modal__name { font-family: var(--font-display); font-weight: 400; font-size: clamp(2rem, 5vw, 2.75rem); line-height: 1.05; margin: 0 0 .35rem; text-transform: uppercase; }
.team-modal__role { font-family: var(--font-sans); font-weight: 500; font-size: 1.05rem; margin: 0 0 1.25rem; }
.team-modal__bio { font-family: var(--font-sans); font-size: 1rem; line-height: 1.6; }
.team-modal__bio > * { margin: 0 0 .9em; }
.team-modal__bio > :last-child { margin-bottom: 0; }

@media (max-width: 767px) {
  .team-modal { align-items: end; padding: 0; }
  .team-modal__dialog { grid-template-columns: 1fr; gap: 20px; padding: 56px 16px 24px; border-radius: 20px 20px 0 0; max-height: 90vh; text-align: center; }
  .team-modal__photo { width: 160px; margin: 0 auto; }
}
@media (prefers-reduced-motion: reduce) {
  .team-modal__overlay, .team-modal__dialog, .is-clickable[data-c~="team-person"] { transition: none; }
}
