
/* Main menu, with account shortcuts kept on the right. */
.hub-header.hub-header-updated {
  grid-template-columns: minmax(270px, .85fr) minmax(0, 1.6fr);
  gap: 12px 28px;
}
.hub-header.hub-header-updated > .hub-brand { grid-column: 1; grid-row: 1 / span 2; white-space: normal; }
.hub-header .hub-brand > span { max-width: 300px; }
.hub-header.hub-header-updated .hub-brand-sub {
  max-width: 300px; font-size: 11px; line-height: 1.5; letter-spacing: .035em;
}
.hub-header.hub-header-updated > nav {
  grid-column: 2; grid-row: 1; justify-content: flex-end; gap: 12px 26px; padding: 0;
}
.hub-header.hub-header-updated > nav a { font-size: 16px; white-space: nowrap; }
.hub-header.hub-header-updated > .hub-account-links {
  grid-column: 2; grid-row: 2; width: auto; justify-content: flex-end; gap: 10px 22px;
}
.hub-header.hub-header-updated .hub-account-links a { color: #d5c4e8; font-size: 13px; }
@media (max-width: 1000px) {
  .hub-header.hub-header-updated { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .hub-header.hub-header-updated > .hub-brand { grid-column: 1; grid-row: 1; }
  .hub-header.hub-header-updated > nav { grid-column: 1; grid-row: 2; justify-content: flex-start; gap: 12px 22px; }
  .hub-header.hub-header-updated > .hub-account-links { grid-column: 1; grid-row: 3; margin-left: auto; }
}
@media (max-width: 600px) {
  .hub-header.hub-header-updated > nav { gap: 12px 18px; }
  .hub-header.hub-header-updated > nav a { font-size: 14px; }
  .hub-header.hub-header-updated > .hub-account-links { flex-wrap: wrap; gap: 12px 16px; }
}
/* Gold, white and bright red lettering; no black in the Maryland title. */
#state-chooser .location-entry .state-card[data-state="maryland"] .role-copy strong {
  --flag-lettering: linear-gradient(110deg, #ffd447 0% 30%, #fff6cf 42%, #ffffff 57%, #ffaaa0 72%, #ff5965 100%);
  background-image: var(--flag-lettering);
  background-clip: text;
  -webkit-background-clip: text;
  color: #ffe480;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: .45px #fff4d1;
  text-shadow: none;
  filter: drop-shadow(0 1px 3px #f7b45a55);
}
/* Reduce the Maryland hero's reserved space so the programs follow it upward. */
@media (min-width: 761px) {
  .location-maryland .maryland-hero { min-height: 0; }
  .location-maryland .maryland-hero > .maryland-photo-scene { margin-top: -32px; margin-bottom: -64px; }
  .location-maryland .maryland-hero > div:first-child { position: relative; top: -48px; }
}
@media (max-width: 760px) {
  .location-maryland .hub-main > .maryland-hero { margin-top: 24px; gap: 12px; min-height: 0; }
  .location-maryland .maryland-hero > .maryland-photo-scene { margin-top: -8px; margin-bottom: 0; }
  .location-maryland .maryland-paths { margin-top: 12px; }
}
/* Destinations for Programs and About. */
.menu-content-page { background: #120920; color: #f7f2ff; }
.menu-content-page .hub-main { max-width: 1380px; padding: 48px 28px 72px; }
.menu-page-heading { margin-bottom: 32px; max-width: 880px; }
.menu-page-heading .hub-overline { color: #e7a8e1; }
.menu-page-heading h1 { margin: 0 0 18px; font-size: clamp(38px, 5vw, 70px); line-height: 1.08; color: #e0c1ff; }
.menu-page-heading p { font-size: 19px; line-height: 1.7; color: #e7dceb; }
.menu-location-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.menu-location-card { overflow: hidden; border: 1px solid #ffffff38; border-radius: 16px; color: #fff; background: #241332; text-decoration: none; }
.menu-location-card img { display: block; width: 100%; height: 260px; object-fit: cover; }
.menu-location-card > div { padding: 24px; }
.menu-location-card h2 { margin: 0 0 16px; font-size: 26px; }
.menu-location-card p { margin: 0 0 24px; color: #dfd0e9; font-size: 16px; line-height: 1.6; }
.menu-location-card span { color: #efa8e4; font-weight: 700; }
.menu-location-card:hover { border-color: #e6abff; background: #331843; }
.menu-location-card:focus-visible { outline: 3px solid #e6abff; outline-offset: 5px; }
.menu-about-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 38px; align-items: center; }
.menu-about-layout img { width: 100%; display: block; border-radius: 18px; }
.menu-about-copy h2 { color: #f2b8e5; font-size: 30px; line-height: 1.25; }
.menu-about-copy p { font-size: 18px; line-height: 1.8; color: #e7dceb; }
.menu-about-copy .hub-button { margin-top: 18px; }
@media (max-width: 1000px) { .menu-location-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) {
  .menu-location-grid, .menu-about-layout { grid-template-columns: minmax(0, 1fr); }
  .menu-content-page .hub-main { padding: 32px 20px 48px; }
}

@media (min-width: 761px) { .location-maryland .maryland-photo-scene .md-scene-caption { bottom: 64px; } }

/* Clean public header, with the account shortcuts beneath the main menu. */
.hub-header.hub-header-updated { padding-right: 14px; }
.hub-header.hub-header-updated > nav {
  justify-self: end;
  justify-content: flex-end;
  gap: 12px 20px;
}
.hub-header.hub-header-updated > .hub-account-links {
  justify-self: end;
  justify-content: flex-end;
  margin-left: auto;
  gap: 12px 22px;
}
@media (max-width: 1000px) {
  .hub-header.hub-header-updated > nav,
  .hub-header.hub-header-updated > .hub-account-links {
    justify-self: end;
    justify-content: flex-end;
  }
}
@media (max-width: 600px) {
  .hub-header.hub-header-updated { padding-right: 18px; }
  .hub-header.hub-header-updated > nav { gap: 12px 16px; }
  .hub-header.hub-header-updated > .hub-account-links { gap: 12px 18px; }
}
/* Real team photography behind each Leagues landing page. */
body.league-photo-page {
  --league-background: url("https://ttg32sports.fitclub32.chatgpt.site/assets/maryland-leagues-group.jpg");
}
body.league-photo-connecticut {
  --league-background: url("https://ttg32sports.fitclub32.chatgpt.site/assets/national-teams.jpg");
}
body.league-photo-south-carolina {
  --league-background: url("https://ttg32sports.fitclub32.chatgpt.site/assets/south-carolina-boys.jpg");
}
body.league-photo-brazil {
  --league-background: url("https://ttg32sports.fitclub32.chatgpt.site/assets/brazil-cover.jpg");
}
body.hub-page.league-photo-page:has(.program-page) {
  min-height: 100svh;
  color: #fff;
  background-color: #12091d;
  background-image: linear-gradient(115deg, #12091ddd 0%, #160d2866 54%, #10071caa 100%), var(--league-background);
  background-size: cover;
  background-position: center 28%;
  background-repeat: no-repeat;
  background-attachment: fixed;
}
.league-photo-page .program-heading {
  padding-block: 38px 42px;
  text-shadow: 0 2px 16px #0b031dcc;
}
.league-photo-page .program-heading h1 { color: #fff; }
.league-photo-page .program-heading > p:last-child { color: #fff; }
.league-photo-page .program-local-nav a {
  background: #1b1028c9;
  border-color: #ebc8ff88;
  backdrop-filter: blur(6px);
}
.league-photo-page .program-local-nav a[aria-current],
.league-photo-page .program-local-nav a:hover { background: #7436b7; }
.league-photo-page .program-menu-card {
  border-color: #e6caff99;
  box-shadow: 0 16px 36px #08020c55;
}
.league-photo-page .hub-footer { background: #12091df0; }
@media (max-width: 760px) {
  body.hub-page.league-photo-page:has(.program-page) { background-attachment: scroll; }
  .league-photo-page .program-heading { padding-block: 28px 34px; }
}
