
.selection-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:28px
}

.selection-card.card {
  padding:0;
  min-width:0;
  overflow:hidden;
  border:1px solid #d4dfed;
  border-radius:12px;
  background:#fff;
  box-shadow:0 4px 16px #071d4907;
  display:flex;
  flex-direction:column
}

.selection-card-picture {
  position:relative;
  display:block;
  overflow:hidden;
  background:#edf2f8
}

.selection-team-photo {
  display:block;
  width:100%;
  aspect-ratio:3/2;
  height:auto;
  object-fit:cover;
  object-position:center 35%;
  transition:transform .3s
}

.selection-card-picture:hover .selection-team-photo {
  transform:scale(1.025)
}

.selection-archive {
  position:absolute;
  left:18px;
  bottom:18px;
  color:#fff;
  background:#071d49e6;
  padding:7px 12px;
  border-radius:4px;
  font-size:12px
}

.selection-card-body {
  padding:28px;
  display:flex;
  flex-direction:column;
  flex:1
}

.selection-card-identity {
  display:flex;
  align-items:center;
  gap:18px;
  margin-bottom:18px
}

.selection-flag {
  width:66px;
  height:44px;
  flex:none;
  background:linear-gradient(to right,#002395 0 33.333%,#fff 33.333% 66.666%,#ed2939 66.666%);
  border:1px solid #d6dfeb;
  border-radius:4px;
  box-shadow:0 3px 8px #071d4910
}

.selection-card-identity .eyebrow {
  font-size:11px;
  letter-spacing:.8px
}

.selection-card h2 {
  font-size:32px;
  line-height:1.2;
  margin:8px 0 0;
  letter-spacing:-.8px
}

.selection-card h2 a {
  color:#071d49
}

.selection-card h2 a:hover {
  text-decoration:underline
}

.selection-card-body>p {
  margin:0 0 18px;
  color:#62748d;
  font-size:16px;
  line-height:1.7
}

.selection-card-meta {
  display:flex;
  flex-wrap:wrap;
  gap:12px 20px;
  padding:15px 0;
  border-block:1px solid #e3e9f1;
  color:#62748d;
  font-size:12px
}

.selection-card-meta strong {
  color:#071d49
}

.selection-card-actions {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:16px 24px;
  margin-top:auto;
  padding-top:22px
}

.selection-card-actions .text-link {
  font-size:14px
}

.selection-photo-credit {
  margin-top:20px;
  color:#62748d;
  font-size:12px
}

.selection-photo-credit summary {
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:3px
}

.selection-photo-credit p {
  font-size:12px;
  margin-top:12px;
  line-height:1.7;
  overflow-wrap:anywhere
}

.selection-resource-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  margin-top:32px
}

.selection-resource {
  display:flex;
  gap:22px;
  border:1px solid #d8e2ef;
  background:#f3f6fb;
  border-radius:9px;
  padding:24px;
  color:#071d49
}

.selection-resource:hover {
  background:#eaf0fa
}

.selection-resource-mark {
  display:grid;
  place-items:center;
  width:78px;
  height:70px;
  flex:none;
  background:#fff;
  border-radius:7px;
  font-weight:700;
  font-size:25px;
  letter-spacing:-1px
}

.selection-resource h2 {
  font-size:20px;
  margin:0 0 8px
}

.selection-resource p {
  font-size:14px;
  margin:0 0 14px;
  color:#62748d;
  line-height:1.7
}

.selection-resource div>span {
  font-size:13px;
  font-weight:600;
  color:#164d89
}

.selection-method {
  margin-top:24px
}

.selection-method summary {
  cursor:pointer;
  font-weight:600
}

.selection-clubs-heading {
  margin-top:48px
}

.selection-clubs-heading p {
  margin-bottom:0
}

.selection-club-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:22px
}

.selection-club-grid .real-club-card {
  min-width:0;
  display:flex;
  flex-direction:column
}

.selection-club-grid .club-card {
  height:100%;
  padding:22px
}

.selection-club-grid .real-club-image {
  display:block;
  width:100%;
  height:170px;
  object-fit:cover;
  border-radius:6px;
  margin-bottom:12px
}

.selection-club-grid .team-badge {
  margin-top:14px
}

.selection-club-grid .club-card h3 {
  font-size:22px
}

.selection-club-grid .real-photo-credit {
  font-size:10px;
  line-height:1.6;
  display:block;
  margin-top:8px;
  overflow-wrap:anywhere
}

.selection-club-grid .card-action {
  font-size:13px
}

.selection-overview {
  padding-top:28px
}

@media(max-width:1000px) {
  .selection-club-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .selection-card-body {
    padding:22px
  }
  .selection-card-actions {
    gap:14px
  }
  .selection-card-identity .eyebrow {
    font-size:10px
  }
}

@media(max-width:760px) {
  .selection-grid,.selection-resource-grid {
    grid-template-columns:1fr;
    gap:24px
  }
  .selection-archive {
    left:12px;
    bottom:12px;
    font-size:11px
  }
  .selection-card h2 {
    font-size:28px
  }
  .selection-resource {
    padding:20px
  }
  .selection-clubs-heading {
    display:block
  }
  .selection-clubs-heading>.text-link {
    display:inline-block;
    margin-top:18px
  }
}

@media(max-width:440px) {
  .selection-club-grid {
    grid-template-columns:1fr
  }
  .selection-card-identity {
    gap:12px
  }
  .selection-flag {
    width:54px;
    height:36px
  }
  .selection-card-actions {
    align-items:flex-start;
    flex-direction:column
  }
  .selection-card-meta {
    gap:8px
  }
  .selection-resource {
    gap:16px
  }
  .selection-resource-mark {
    width:62px;
    height:62px;
    font-size:22px
  }
}


.selection-profile .team-profile-heading {
  margin-bottom: 32px;
}

.selection-profile .real-photo-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 500px), 1fr));
  gap: 24px;
  margin-bottom: 32px;
}

.selection-profile .real-photo-figure {
  margin: 0;
  min-width: 0;
}

.selection-profile .real-photo-full {
  width: 100%;
  height: 320px;
  object-fit: contain;
  background: #f3f6fb;
}

.selection-profile .real-photo-figure figcaption {
  line-height: 1.7;
}

.selection-profile > details.notice {
  margin: 0 0 32px;
}

.selection-profile > .tags {
  margin-bottom: 32px;
}

.selection-roster {
  padding: 8px 0 0;
}

.selection-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 28px;
}

.selection-section-heading .eyebrow {
  margin-bottom: 10px;
}

.selection-section-heading h2 {
  font-size: 30px;
  margin: 0 0 12px;
  line-height: 1.25;
}

.selection-section-heading p {
  margin: 0;
  max-width: 760px;
  color: #62748d;
  font-size: 15px;
  line-height: 1.7;
}

.selection-official-link {
  display: inline-flex;
  flex: none;
  align-items: center;
  padding: 12px 16px;
  border: 1px solid #cbd7e8;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  color: #164d89;
  background: #fff;
}

.selection-official-link:hover {
  background: #f3f6fb;
}

.selection-roster .player-gallery {
  margin: 0;
  gap: 20px;
}

.selection-roster .player-card-visual {
  aspect-ratio: auto;
  height: 160px;
}

.selection-roster .player-portrait-initials {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #fff;
  font-size: 26px;
}

.selection-roster .player-card-body {
  padding: 18px;
  gap: 8px;
}

.selection-roster .player-tile .eyebrow {
  margin: 0;
}

.selection-roster .player-tile h3 {
  margin: 0;
  font-size: 17px;
  line-height: 1.4;
}

.selection-roster .player-tile p {
  margin: 0;
}

.selection-roster .player-portrait-placeholder .small {
  font-size: 11px;
}

.selection-roster-note {
  margin: 24px 0 0;
  color: #62748d;
  font-size: 13px;
  line-height: 1.7;
}

.selection-calendar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  padding: 32px;
  margin-top: 40px;
  border: 1px solid #d6e1ef;
  border-radius: 10px;
  background: #f3f6fb;
}

.selection-calendar .eyebrow {
  font-size: 11px;
  margin-bottom: 12px;
}

.selection-calendar h2 {
  font-size: 28px;
  margin: 0 0 12px;
  line-height: 1.25;
}

.selection-calendar p {
  margin: 0;
  max-width: 720px;
  font-size: 15px;
  line-height: 1.7;
  color: #62748d;
}

.selection-calendar .button {
  flex: none;
  border-radius: 6px;
}

.selection-profile-sources {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 40px;
  padding: 28px 0 0;
  margin-top: 36px;
  border-top: 1px solid #d6e1ef;
}

.selection-profile-sources h2 {
  font-size: 17px;
  margin: 0 0 12px;
}

.selection-profile-sources p {
  font-size: 13px;
  line-height: 1.8;
  margin: 0;
  color: #62748d;
}

.selection-profile-sources nav {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  font-size: 13px;
}

.selection-profile-sources nav a {
  color: #164d89;
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 1000px) {
  .selection-section-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 18px;
  }
  .selection-calendar {
    align-items: flex-start;
    flex-direction: column;
    gap: 22px;
  }
}

@media (max-width: 760px) {
  .selection-profile .real-photo-full {
    height: 260px;
  }
  .selection-roster .player-gallery {
    gap: 14px;
  }
  .selection-roster .player-card-body {
    padding: 14px;
  }
  .selection-section-heading h2 {
    font-size: 26px;
  }
  .selection-calendar {
    padding: 24px;
    margin-top: 32px;
  }
  .selection-calendar h2 {
    font-size: 25px;
  }
  .selection-calendar .button {
    width: 100%;
  }
  .selection-profile-sources {
    grid-template-columns: 1fr;
    gap: 22px;
  }
}

