/*
 * Public broadcast surfaces intentionally use a larger reading scale than
 * operational forms.  Desktop keeps generous whitespace; narrow windows
 * reflow the card grid instead of shrinking names and match data.
 */
.teams-directory-page .site-main {
  width: min(2500px, calc(100% - clamp(56px, 6vw, 160px)));
  padding-top: clamp(36px, 4vw, 64px);
  padding-bottom: clamp(72px, 7vw, 128px);
}

.teams-directory-page .public-page-head {
  max-width: none;
  margin-bottom: clamp(28px, 2.2vw, 42px);
}

.teams-directory-page .public-page-head > span {
  font-size: clamp(13px, .7vw, 17px);
}

.teams-directory-page .public-page-head h1 {
  font-size: clamp(42px, 3.4vw, 68px);
}

.teams-directory-page .public-page-head p {
  font-size: clamp(18px, 1.1vw, 24px);
}

.teams-directory-page .team-directory {
  gap: clamp(14px, 1.1vw, 22px);
}

.teams-directory-page .team-directory a {
  min-height: clamp(126px, 8vw, 160px);
  padding: clamp(20px, 1.3vw, 28px);
  gap: clamp(16px, 1.2vw, 24px);
  border-color: rgba(186, 216, 235, .19);
}

.teams-directory-page .team-directory i {
  width: clamp(50px, 3.3vw, 66px);
  height: clamp(50px, 3.3vw, 66px);
}

.teams-directory-page .team-directory .team-directory-crest.team-flag {
  width: clamp(54px, 3.5vw, 70px);
  height: clamp(38px, 2.45vw, 49px);
}

.teams-directory-page .team-directory h2 {
  font-size: clamp(23px, 1.45vw, 31px);
  line-height: 1.15;
}

.teams-directory-page .team-directory p {
  margin-top: 8px;
  font-size: clamp(16px, .95vw, 21px);
}

.team-page .team-page-hero p {
  font-size: clamp(17px, .95vw, 21px);
}

.team-page .section-kicker,
.team-page .team-public-card header span {
  font-size: clamp(12px, .65vw, 15px);
}

.team-page .team-public-card > header {
  padding: clamp(19px, 1.2vw, 26px) clamp(20px, 1.4vw, 30px);
}

.team-page .team-public-card h2 {
  font-size: clamp(25px, 1.35vw, 32px);
}

.team-page .team-public-card > header > b {
  font-size: clamp(18px, 1vw, 23px);
}

.team-page .pitch-player-card {
  width: clamp(112px, 6.2vw, 144px);
}

.team-page .pitch-player-card img,
.team-page .pitch-avatar-fallback {
  width: clamp(58px, 3.1vw, 70px);
  height: clamp(58px, 3.1vw, 70px);
}

.team-page .pitch-player-card .pitch-rating {
  width: clamp(28px, 1.55vw, 34px);
  height: clamp(28px, 1.55vw, 34px);
  left: clamp(14px, 1vw, 20px);
  font-size: clamp(12px, .66vw, 15px);
}

.team-page .pitch-player-card strong {
  margin-top: 7px;
  font-size: clamp(14px, .75vw, 18px);
}

.team-page .pitch-player-card small {
  font-size: clamp(12px, .62vw, 15px);
}

.team-page .lineup-hidden-state strong {
  font-size: clamp(23px, 1.3vw, 30px);
}

.team-page .lineup-hidden-state span {
  font-size: clamp(16px, .85vw, 20px);
}

.team-page .team-roster-row {
  grid-template-columns: 48px 48px minmax(0, 1fr) auto;
  min-height: clamp(74px, 4.4vw, 88px);
  gap: 12px;
  padding: 10px 12px;
}

.team-page .team-roster-row img,
.team-page .team-roster-row .roster-photo-fallback {
  width: 46px;
  height: 46px;
}

.team-page .roster-rating {
  font-size: clamp(20px, 1.05vw, 24px);
}

.team-page .team-roster-row strong {
  font-size: clamp(16px, .82vw, 20px);
}

.team-page .team-roster-row small,
.team-page .team-roster-row em {
  font-size: clamp(13px, .68vw, 16px);
}

@media (max-width: 860px) {
  .teams-directory-page .site-main {
    width: calc(100% - 32px);
  }

  .teams-directory-page .team-directory {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .teams-directory-page .team-directory a {
    min-height: 116px;
    padding: 18px;
  }
}

@media (max-width: 580px) {
  .teams-directory-page .site-main {
    width: calc(100% - 24px);
    padding-top: 28px;
  }

  .teams-directory-page .team-directory {
    grid-template-columns: 1fr;
  }

  .teams-directory-page .public-page-head h1 {
    font-size: 38px;
  }

  .teams-directory-page .public-page-head p {
    font-size: 16px;
  }
}