.wordmark {
  font-size: clamp(13px, 1.5vw, 21px);
  letter-spacing: .19em;
  text-transform: uppercase;
}
.footer-top .wordmark { font-size: clamp(15px, 2vw, 27px); }
.menu-links a>span:first-child { transition: transform .5s var(--ease); }
.menu-links a:hover>span:first-child { transform: translateX(12px); }
.menu-links a[aria-current="page"] { text-decoration: underline; text-underline-offset: .16em; }
.menu-links a:hover .arrow { transform: translate(4px,-4px); }
.hero-content h1 { font-size: clamp(68px, 8.3vw, 140px); }
.hero-description { max-width: 665px; }
.club-tracks .capability { display: block; min-height: 220px; }
.club-tracks .capability h3 { font-size: clamp(35px, 4vw, 64px); }
.club-tracks .capability p { color: #c2c5bd; }
.club-page { padding-top: clamp(135px, 16vw, 220px); min-height: 67vh; }
.club-page > p { max-width: 52ch; margin-top: 22px; font-size: clamp(17px, 2vw, 23px); }
.club-list { margin-top: clamp(36px, 6vw, 78px); }
.club-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.618fr);
  gap: clamp(20px, 4vw, 65px);
  align-items: baseline;
  padding-block: 24px;
  border-top: var(--border);
  scroll-margin-top: 24px;
}
.club-list article h2 { font-size: clamp(33px, 4vw, 58px); }
.club-list article p { max-width: 58ch; }
.club-list article p + p { margin-top: 10px; }
.club-list article a { text-decoration: underline; text-underline-offset: .18em; }
@media (max-width: 800px) {
  .hero-content h1 { font-size: clamp(55px, 10vw, 82px); }
  html:not(.js) .site-header { height: auto; padding-block: 18px; flex-wrap: wrap; }
  html:not(.js) .primary-nav { display: flex; flex-wrap: wrap; margin-left: 0; }
  html:not(.js) .menu-toggle { display: none; }
}
@media (max-width: 540px) {
  .wordmark { letter-spacing: .13em; }
  .menu-toggle { gap: 8px; }
  .hero-content { padding-top: 147px; }
  .hero-content h1 { font-size: clamp(48px, 11vw, 61px); }
  .hero-home { min-height: 695px; }
  .club-list article { grid-template-columns: 1fr; gap: 10px; }
}

/* Larger shared masthead. */
.site-header { height: 132px; gap: 36px; }
.site-header .wordmark { font-size: clamp(22px, 2.2vw, 32px); }
.site-header .primary-nav { gap: clamp(20px, 2.5vw, 40px); }
.site-header .primary-nav a { font-size: 14px; padding-block: 14px; }
.site-header .menu-bars, .site-header .menu-bars i { width: 28px; }
.site-header .menu-bars { gap: 7px; }
.site-header .menu-label { font-size: 12px; }
@media (min-width: 801px) and (max-width: 1100px) {
  .site-header { gap: 22px; }
  .site-header .wordmark { font-size: 22px; letter-spacing: .13em; }
  .site-header .primary-nav { gap: 16px; }
  .site-header .primary-nav a { font-size: 13px; }
}
@media (max-width: 800px) {
  .site-header { height: 108px; gap: 16px; }
  .site-header .wordmark { font-size: clamp(16px, 3.3vw, 24px); }
}
@media (max-width: 540px) {
  .site-header { height: 100px; gap: 10px; }
  .site-header .wordmark { font-size: clamp(15px, 3.8vw, 20px); letter-spacing: .1em; }
  .site-header .menu-label { display: none; }
}

.site-header .header-brand { display: inline-flex; align-items: center; gap: 16px; flex-shrink: 0; }
.header-logo { width: 64px; height: 64px; object-fit: contain; flex-shrink: 0; }
@media (min-width: 801px) and (max-width: 1000px) {
  .site-header .primary-nav { display: none; }
  .site-header .menu-toggle { margin-left: auto; }
  .site-header .menu-label { display: block; }
}
@media (max-width: 800px) {
  .header-logo { width: 48px; height: 48px; }
  .site-header .header-brand { gap: 12px; }
}
@media (max-width: 540px) {
  .header-logo { width: 34px; height: 34px; }
  .site-header .header-brand { gap: 8px; }
  .site-header .wordmark { font-size: clamp(13px, 3.5vw, 18px); }
}

/* Use the regenerated transparent silhouette on the dark asset. */
.dark-page .header-logo {
  -webkit-mask-image: url('../assets/images/club-saturn-light-v2.png');
  mask-image: url('../assets/images/club-saturn-light-v2.png');
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  mask-mode: alpha;
}

.menu-brand { display: inline-flex; align-items: center; gap: 16px; }
.menu-logo { width: 64px; height: 64px; object-fit: contain; flex-shrink: 0; }
@media (max-width: 800px) {
  .menu-brand { gap: 12px; }
  .menu-logo { width: 48px; height: 48px; }
}
@media (max-width: 540px) {
  .menu-brand { gap: 8px; font-size: 12px; letter-spacing: .1em; }
  .menu-logo { width: 34px; height: 34px; }
  .menu-header .menu-close { gap: 8px; }
}

.team-entry { position: relative; }
.club-list .team-entry h2 a { text-decoration: none; }
.team-entry h2 a::after { content: ''; position: absolute; inset: 0; }
.team-entry:hover h2 a, .team-entry:focus-within h2 a { text-decoration: underline; text-underline-offset: .15em; }
.team-arrow { display: inline-block; font-size: .6em; vertical-align: middle; }
.team-back { display: inline-block; margin-bottom: 26px; text-decoration: underline; text-underline-offset: .2em; }

/* Draw control icons independently of the device's emoji font. */
.line-arrow {
  display: inline-block;
  width: 1em;
  height: 1em;
  flex: 0 0 auto;
  vertical-align: -.12em;
  background: currentColor;
  -webkit-mask: url('../assets/svg/arrow-up-right.svg') center / contain no-repeat;
  mask: url('../assets/svg/arrow-up-right.svg') center / contain no-repeat;
}
.line-arrow--up { rotate: -45deg; }
.line-arrow--down { rotate: 135deg; }
.line-arrow--left { rotate: -135deg; }

.hero-motion {
  display: grid;
  place-items: center;
}
.hero-motion::before {
  content: '';
  width: 8px;
  height: 11px;
  border-inline: 1.5px solid currentColor;
}
.hero-motion[data-motion-paused]::before {
  width: 9px;
  height: 11px;
  border: 0;
  background: currentColor;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
