@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Playfair+Display:wght@700;800&display=swap');
:root { --ivory:#f8f5ee; --card:#fff; --black:#111; --dark:#161616; --muted:#625d52; --gold:#c9a227; --gold-dark:#a88312; --gold-soft:#e6d7a8; --border:#e8e1d2; --shadow:0 8px 24px rgba(17,17,17,.05); }
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;font-family:'Inter',Arial,sans-serif;background:var(--ivory);color:var(--black)} a{text-decoration:none;color:inherit}.container{width:min(1180px,calc(100% - 32px));margin:0 auto}.section{padding:56px 0}.section-sm{padding:28px 0}.announcement{background:var(--gold);color:var(--black);font-size:14px;font-weight:700}.announcement-inner{min-height:42px;display:flex;align-items:center;justify-content:space-between;gap:16px}.announcement a{font-weight:900}.site-header{position:sticky;top:0;z-index:50;background:rgba(248,245,238,.96);border-bottom:1px solid var(--border);backdrop-filter:blur(14px)}.nav-wrap{min-height:84px;display:flex;align-items:center;gap:22px}.brand{display:flex;align-items:center;gap:12px;flex:none}.logo-box{width:90px;height:90px;border-radius:50%;border:1px solid var(--gold-soft);background:#fff;display:grid;place-items:center;overflow:hidden}.logo-box img{width:100%;height:100%;object-fit:contain}.logo-fallback{display:none;width:100%;height:100%;place-items:center;background:var(--dark);color:var(--gold);font-weight:900;font-size:13px}.brand-text{display:grid;line-height:1}.brand-text strong{text-transform:uppercase;letter-spacing:.02em}.brand-text small{text-transform:uppercase;color:var(--muted);font-size:11px;letter-spacing:.14em}.main-nav{display:flex;align-items:center;gap:4px;margin-left:auto}.main-nav>a,.nav-item>a{display:flex;align-items:center;gap:4px;min-height:44px;padding:0 10px;font-size:13px;font-weight:800;color:var(--black);border-bottom:2px solid transparent}.main-nav a.active,.main-nav>a:hover,.nav-item>a:hover,.nav-item>a.active{border-bottom-color:var(--gold)}.nav-item{position:relative}.dropdown{position:absolute;top:100%;left:0;min-width:245px;background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:0 20px 50px rgba(17,17,17,.12);padding:10px;display:none;z-index:99}.dropdown-right{left:auto;right:0}.dropdown a{display:block;padding:11px 12px;border-radius:10px;color:var(--muted);font-size:13px;font-weight:750}.dropdown a:hover{background:var(--ivory);color:var(--black)}.has-dropdown:hover .dropdown,.has-dropdown:focus-within .dropdown{display:block}.join-small{background:var(--gold);padding:10px 16px;border-radius:999px;font-weight:900;font-size:13px;flex:none}.hero{padding-top:64px}.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.95fr);gap:42px;align-items:center}.eyebrow{color:var(--gold-dark);font-size:12px;font-weight:900;letter-spacing:.15em;text-transform:uppercase;margin:0 0 12px}h1,h2{font-family:'Playfair Display',Georgia,serif;letter-spacing:-.04em}h1{font-size:clamp(54px,8vw,108px);line-height:.88;margin:0 0 22px;text-transform:uppercase}h2{font-size:clamp(32px,4vw,52px);line-height:1;margin:0}h3{margin:0}.hero-lead,.page-hero p{max-width:650px;color:var(--muted);font-size:20px;line-height:1.55}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0}.btn{display:inline-flex;justify-content:center;align-items:center;min-height:46px;padding:0 18px;border-radius:999px;font-weight:900;border:1px solid transparent}.btn-primary{background:var(--gold);color:var(--black)}.btn-secondary{background:var(--card);color:var(--black);border-color:var(--border)}.hero-meta{display:flex;flex-wrap:wrap;gap:10px;color:var(--muted);font-size:13px;font-weight:750}.hero-meta span{padding-right:10px;border-right:1px solid var(--border)}.hero-meta span:last-child{border-right:0}.hero-visual{position:relative;min-height:480px;border-radius:30px;background:radial-gradient(circle at 35% 20%,#fff 0,#f7ebc5 30%,#f8f5ee 60%);border:1px solid var(--border);overflow:hidden;box-shadow:var(--shadow)}.chess-orb{position:absolute;inset:24px 24px auto auto;width:min(58%,330px);aspect-ratio:1;border-radius:50%;background:linear-gradient(145deg,#fff,#ece7db);display:grid;place-items:center;box-shadow:inset -30px -30px 60px rgba(17,17,17,.07),0 20px 60px rgba(17,17,17,.12)}.chess-orb span{font-size:160px;color:var(--dark);opacity:.88}.fixture-card{position:absolute;left:24px;right:24px;bottom:24px;background:rgba(255,255,255,.92);border:1px solid var(--border);border-radius:22px;padding:22px;backdrop-filter:blur(12px)}.card-top{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;text-transform:uppercase;font-weight:900;letter-spacing:.08em}.fixture-card h3{font-size:23px;margin:14px 0 6px}.fixture-card h3 span{color:var(--gold-dark);font-size:15px;text-transform:uppercase;padding:0 6px}.fixture-card p{color:var(--muted);margin:0 0 18px}.countdown{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.countdown div{border:1px solid var(--border);border-radius:14px;padding:10px;text-align:center;background:var(--ivory)}.countdown strong{display:block;font-size:22px}.countdown small{color:var(--muted);font-weight:750}.fixture-card ul{margin:16px 0 0;padding-left:18px;color:var(--muted);font-size:14px}.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.quick-card,.news-card,.panel,.course-card,.path-card,.product-card,.honour-card,.match-card,.join-card{background:var(--card);border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow)}.quick-card{padding:24px;display:grid;gap:12px}.quick-card span{color:var(--gold-dark);font-size:30px;font-weight:900}.quick-card p,.news-card p,.path-card p,.honour-card p,.match-card p,.join-card p,.muted{color:var(--muted);line-height:1.55}.quick-card strong{color:var(--gold-dark);font-size:14px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:22px}.section-head a{color:var(--gold-dark);font-weight:900}.news-grid,.page-grid-3{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.page-grid-3{grid-template-columns:repeat(3,1fr)}.news-card{overflow:hidden}.news-card .thumb{height:140px;display:grid;place-items:center;font-size:72px;color:var(--gold);background:linear-gradient(135deg,var(--dark),#34302a)}.news-card span{display:block;margin:18px 18px 8px;color:var(--gold-dark);font-size:12px;font-weight:900;text-transform:uppercase}.news-card h3,.news-card p{margin-left:18px;margin-right:18px}.news-card p{margin-bottom:22px}.league-section{background:linear-gradient(180deg,rgba(230,215,168,.22),rgba(248,245,238,0))}.league-grid{display:grid;grid-template-columns:1.35fr 1.2fr 1fr .9fr;gap:16px;align-items:stretch}.league-grid-wide{grid-template-columns:repeat(3,1fr)}.panel{padding:22px}.panel h3,.panel h2{margin-bottom:16px}.fixture-row{display:grid;gap:4px;padding:13px 0;border-bottom:1px solid var(--border)}.fixture-row:last-child{border-bottom:0}.fixture-row span{color:var(--gold-dark);font-weight:900;font-size:12px;text-transform:uppercase}.fixture-row small{color:var(--muted);font-weight:750}table{width:100%;border-collapse:collapse;font-size:14px}th,td{text-align:left;padding:10px 6px;border-bottom:1px solid var(--border)}th{color:var(--muted);font-size:11px;text-transform:uppercase}.hub-list{list-style:none;padding:0;margin:0;display:grid;gap:12px}.hub-list li{display:grid;gap:4px}.hub-list span,.performers span{color:var(--muted);font-size:13px}.performers{margin:0;padding-left:20px;display:grid;gap:14px}.performers strong{float:right;color:var(--gold-dark)}.ticker{background:var(--dark);color:#fff;padding:17px 0}.ticker-inner{display:flex;align-items:center;gap:14px;overflow:hidden}.ticker strong{text-transform:uppercase;color:var(--gold);white-space:nowrap}.live-dot{width:8px;height:8px;background:var(--gold);border-radius:50%;box-shadow:0 0 0 6px rgba(201,162,39,.18);flex:none}.ticker p{margin:0;color:#eee3c3;white-space:nowrap}.training-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:16px}.course-card{grid-row:span 2;padding:28px;background:linear-gradient(135deg,var(--dark),#2a261d);color:#fff}.course-card span{color:var(--gold);font-weight:900;text-transform:uppercase;font-size:12px}.course-card h3{font-family:'Playfair Display',Georgia,serif;font-size:42px;margin:18px 0}.course-card p{color:#eee3c3;line-height:1.6}.path-card{min-height:150px;padding:22px;display:block}.path-card.submit{border-color:var(--gold-soft);background:#fffaf0}.shop-section{background:#fffdf7}.product-grid,.boards-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.product-card{padding:16px}.product-img{height:210px;border-radius:16px;display:grid;place-items:center;background:var(--dark);color:var(--gold);font-size:42px;font-family:'Playfair Display',Georgia,serif;margin-bottom:16px}.product-img.light{background:var(--ivory);color:var(--dark);border:1px solid var(--border)}.product-card p{color:var(--muted)}.product-card strong{color:var(--gold-dark)}.honour-card{padding:24px}.honour-card span{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--ivory);color:var(--gold-dark);font-weight:900;margin-bottom:18px}.match-section{padding-top:20px}.match-card{padding:24px;display:grid;grid-template-columns:220px 1fr 190px;gap:24px;align-items:center}.board-preview{height:170px;border-radius:18px;background:conic-gradient(from 90deg,#d4ba75 0 25%,#231f19 0 50%,#d4ba75 0 75%,#231f19 0);display:grid;place-items:center;color:white;font-size:40px;text-align:center;line-height:1.4}.tag{color:var(--gold-dark);font-size:12px;font-weight:900;text-transform:uppercase}.score-box{background:var(--ivory);border:1px solid var(--border);border-radius:18px;padding:22px;text-align:center}.score-box span{color:var(--gold-dark);font-weight:900;text-transform:uppercase;font-size:12px}.score-box strong{display:block;font-size:36px;margin:14px 0}.score-box small{color:var(--muted)}.join-card{padding:34px;display:flex;justify-content:space-between;align-items:center;gap:24px;background:linear-gradient(135deg,#fff,#fff7dd)}.page-hero{padding-bottom:20px}.page-hero h1{font-size:clamp(52px,7vw,92px)}.rule-list{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.rule-list p,.player-pill{margin:0;padding:14px;border:1px solid var(--border);border-radius:14px;background:var(--ivory);font-weight:750}.squads-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.player-pill{display:flex;justify-content:space-between;gap:16px;margin-top:10px}.player-pill span{color:var(--gold-dark);font-weight:900}.join-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.step{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--gold);font-weight:900;margin-bottom:14px}.footer{background:var(--dark);color:white;padding:54px 0 28px}.footer-grid{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:32px}.footer-brand{font-family:'Playfair Display',Georgia,serif;font-size:32px;line-height:.95;text-transform:uppercase;color:var(--gold)}.footer p,.footer-note{color:#c6c1b7;line-height:1.6}.footer h4{color:var(--gold);margin:0 0 12px}.footer a{display:block;color:#e5e0d4;margin:8px 0;font-size:14px}.footer-note{border-top:1px solid rgba(255,255,255,.12);margin-top:34px;padding-top:22px;font-size:13px}@media(max-width:1100px){.main-nav{overflow-x:auto}.hero-grid,.league-grid,.training-grid,.match-card,.league-grid-wide{grid-template-columns:1fr}.quick-grid,.news-grid,.product-grid,.boards-grid,.footer-grid,.page-grid-3,.rule-list,.squads-grid,.join-steps{grid-template-columns:repeat(2,1fr)}.hero-visual{min-height:430px}}@media(max-width:760px){.main-nav{display:none}.announcement-inner,.section-head,.join-card,.ticker-inner{align-items:flex-start;flex-direction:column}.quick-grid,.news-grid,.product-grid,.boards-grid,.footer-grid,.page-grid-3,.rule-list,.squads-grid,.join-steps{grid-template-columns:1fr}.nav-wrap{min-height:70px}.brand-text{display:none}.hero{padding-top:38px}.hero-actions{flex-direction:column}.btn{width:100%}.fixture-card{left:14px;right:14px;bottom:14px;padding:16px}.chess-orb{width:260px}.chess-orb span{font-size:120px}}
.announcement-link {
  color: #111111;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.announcement-link:hover {
  color: #ffffff;
}
.hero-kicker {
  margin: 0 0 2px 0;
  line-height: 1.25;
}

.hero-subtitle {
  margin: 0;
  line-height: 1.25;
}
.join-hero {
  padding: 56px 0;
  background:
    radial-gradient(circle at top right, rgba(201, 162, 39, 0.16), transparent 34%),
    var(--colour-ivory);
}

.join-hero-grid {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 32px;
  align-items: start;
}

.join-hero h1 {
  font-family: "Playfair Display", serif;
  font-size: clamp(42px, 6vw, 72px);
  line-height: 0.95;
  margin: 0 0 18px;
  color: var(--colour-black);
}

.page-intro {
  font-size: 1.15rem;
  line-height: 1.6;
  color: var(--colour-muted);
  max-width: 640px;
}

.page-support {
  margin-top: 18px;
  font-weight: 700;
  color: var(--colour-black);
}

.join-card {
  background: var(--colour-card);
  border: 1px solid var(--colour-border);
  border-radius: 18px;
  padding: 28px;
  box-shadow: 0 18px 40px rgba(17, 17, 17, 0.08);
}

.join-card h2 {
  margin: 0 0 8px;
  font-size: 1.6rem;
}

.join-card p {
  color: var(--colour-muted);
}

.join-form {
  display: grid;
  gap: 16px;
  margin-top: 22px;
}

.join-form label {
  display: grid;
  gap: 7px;
  font-weight: 700;
  color: var(--colour-black);
}

.join-form input,
.join-form select {
  width: 100%;
  padding: 12px 13px;
  border: 1px solid var(--colour-border);
  border-radius: 10px;
  background: #ffffff;
  color: var(--colour-black);
  font: inherit;
}

.join-form input:focus,
.join-form select:focus {
  outline: 2px solid rgba(201, 162, 39, 0.35);
  border-color: var(--colour-gold);
}

.form-note {
  font-size: 0.85rem;
  margin: 0;
}

.join-benefits {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.benefit-card {
  background: var(--colour-card);
  border: 1px solid var(--colour-border);
  border-radius: 16px;
  padding: 22px;
}

.benefit-card h3 {
  margin: 0 0 8px;
  font-size: 1.25rem;
}

.benefit-card p {
  color: var(--colour-muted);
  line-height: 1.55;
}

@media (max-width: 850px) {
  .join-hero-grid,
  .join-benefits {
    grid-template-columns: 1fr;
  }
}
#divisions .quick-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 18px;
}

#divisions .quick-card {
  grid-column: span 2;
}

#divisions .quick-card:nth-child(4) {
  grid-column: 2 / span 2;
}

#divisions .quick-card:nth-child(5) {
  grid-column: 4 / span 2;
}

@media (max-width: 900px) {
  #divisions .quick-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  #divisions .quick-card,
  #divisions .quick-card:nth-child(4),
  #divisions .quick-card:nth-child(5) {
    grid-column: auto;
  }
}

@media (max-width: 600px) {
  #divisions .quick-grid {
    grid-template-columns: 1fr;
  }
}
#divisions .quick-card {
  min-height: auto;
  padding: 24px 26px;
}

#divisions .quick-card span {
  display: block;
  margin-bottom: 8px;
}

#divisions .quick-card h3 {
  margin: 0 0 10px 0;
}

#divisions .quick-card p {
  margin: 0;
  line-height: 1.35;
}
#divisions .quick-card {
  min-height: auto;
  padding: 20px 24px;
}
#divisions .quick-card h3 {
  margin: 0 0 6px 0;
}
#divisions .divisions-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 18px;
}

#divisions .league-box {
  grid-column: span 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: auto;
  padding: 22px 24px;
}

#divisions .league-box:nth-child(4) {
  grid-column: 2 / span 2;
}

#divisions .league-box:nth-child(5) {
  grid-column: 4 / span 2;
}

#divisions .league-box-text {
  min-width: 0;
}

#divisions .league-box span {
  display: block;
  margin-bottom: 6px;
  font-weight: 800;
  text-transform: uppercase;
}

#divisions .league-box h3 {
  margin: 0 0 6px 0;
}

#divisions .league-box p {
  margin: 0;
  line-height: 1.35;
}

#divisions .league-logo {
  width: 64px;
  height: 64px;
  object-fit: contain;
  flex-shrink: 0;
}

@media (max-width: 900px) {
  #divisions .divisions-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  #divisions .league-box,
  #divisions .league-box:nth-child(4),
  #divisions .league-box:nth-child(5) {
    grid-column: auto;
  }
}

@media (max-width: 600px) {
  #divisions .divisions-grid {
    grid-template-columns: 1fr;
  }
}
#divisions .league-logo {
  width: 48px;
  height: 48px;
  max-width: 48px;
  max-height: 48px;
  object-fit: contain;
  flex-shrink: 0;
}
#divisions .league-logo {
  width: 40px;
  height: 40px;
  max-width: 40px;
  max-height: 40px;
  object-fit: contain;
  flex-shrink: 0;
}
#divisions .divisions-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 18px;
}

#divisions .league-box {
  grid-column: span 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: auto;
  padding: 18px 20px;
}

#divisions .league-box:nth-child(4) {
  grid-column: 2 / span 2;
}

#divisions .league-box:nth-child(5) {
  grid-column: 4 / span 2;
}

#divisions .league-box-text {
  min-width: 0;
}

#divisions .league-box span {
  display: block;
  margin-bottom: 4px;
  font-weight: 800;
  text-transform: uppercase;
}

#divisions .league-box h3 {
  margin: 0 0 4px 0;
}

#divisions .league-box p {
  margin: 0;
  line-height: 1.3;
}

#divisions .league-logo {
  width: 48px;
  height: 48px;
  max-width: 48px;
  max-height: 48px;
  object-fit: contain;
  flex-shrink: 0;
}

@media (max-width: 900px) {
  #divisions .divisions-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  #divisions .league-box,
  #divisions .league-box:nth-child(4),
  #divisions .league-box:nth-child(5) {
    grid-column: auto;
  }
}

@media (max-width: 600px) {
  #divisions .divisions-grid {
    grid-template-columns: 1fr;
  }
}
#divisions .league-logo {
  width: 180px;
  height: 180px;
  max-width: 180px;
  max-height: 180px;
  object-fit: contain;
  flex-shrink: 0;
}
#divisions .league-logo {
  width: 200px;
  height: 200px;
  max-width: 200px;
  max-height: 200px;
  object-fit: contain;
  flex-shrink: 0;
}
.status-label {
  display: inline-flex;
  align-items: center;
  margin-top: 18px;
  padding: 8px 12px;
  border: 1px solid var(--colour-gold-soft);
  border-radius: 999px;
  background: rgba(201, 162, 39, 0.12);
  color: var(--colour-black);
  font-weight: 800;
  font-size: 0.85rem;
}
.main-nav {
  gap: 14px;
}

.main-nav a {
  white-space: nowrap;
}
/* Header/nav layout fix after logo resize */
.nav-wrap {
  min-height: 100px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  flex-wrap: nowrap;
}

.brand {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
}

.main-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  flex-wrap: nowrap;
  margin-left: auto;
}

.main-nav > a,
.main-nav .nav-item > a {
  display: flex;
  align-items: center;
  white-space: nowrap;
}

.nav-item {
  position: relative;
  flex-shrink: 0;
}

.join-small {
  flex-shrink: 0;
  white-space: nowrap;
}
.nav-more-toggle {
  background: none;
  border: 0;
  padding: 8px 0;
  margin: 0;
  font: inherit;
  font-size: 1.6rem;
  font-weight: 800;
  line-height: 1;
  color: inherit;
  cursor: pointer;
  display: flex;
  align-items: center;
}

.nav-more-toggle:hover,
.nav-more-toggle:focus {
  color: var(--gold-dark);
  outline: none;
}

.nav-item.has-dropdown {
  position: relative;
}

.nav-item.has-dropdown:hover > .dropdown,
.nav-item.has-dropdown:focus-within > .dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

.dropdown {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
}

.nav-more .dropdown {
  min-width: 220px;
}
.launch-card {
  position: relative;
  z-index: 2;
  background: #ffffff;
  border: 1px solid var(--border);
  border-radius: 28px;
  padding: 28px;
  box-shadow: 0 18px 45px rgba(17, 17, 17, 0.08);
}

.launch-card-top {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
}

.launch-card h3 {
  margin: 0 0 10px 0;
  font-size: clamp(1.6rem, 2.5vw, 2.2rem);
  line-height: 1.08;
}

.launch-card p {
  margin: 0 0 20px 0;
  color: var(--muted);
  line-height: 1.45;
}

.launch-countdown {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 20px 0 18px;
}

.launch-countdown div {
  border: 1px solid var(--border);
  background: #f8f5ee;
  border-radius: 14px;
  padding: 14px 10px;
  text-align: center;
}

.launch-countdown strong {
  display: block;
  font-size: 1.8rem;
  line-height: 1;
}

.launch-countdown small {
  display: block;
  margin-top: 6px;
  font-size: 0.8rem;
  font-weight: 800;
  color: var(--muted);
}

.launch-card ul {
  margin: 0 0 22px 18px;
  padding: 0;
  color: var(--muted);
}

.launch-card li {
  margin-bottom: 5px;
}

.launch-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

@media (max-width: 600px) {
  .launch-card {
    padding: 22px;
  }

  .launch-countdown {
    grid-template-columns: 1fr;
  }
}
.honour-card {
  color: inherit;
  text-decoration: none;
}
.btn,
.join-small {
  white-space: nowrap;
}
.hero-free-note {
  margin: 12px 0 0 0;
  font-size: 0.9rem;
  font-weight: 800;
  color: var(--muted);
}
/* Mobile header layout */
@media (max-width: 760px) {
  .announcement-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    text-align: left;
  }

  .nav-wrap {
    display: grid;
    grid-template-columns: auto auto;
    grid-template-areas:
      "logo join"
      "nav nav";
    align-items: center;
    gap: 12px 16px;
    min-height: auto;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .brand {
    grid-area: logo;
  }

  .brand-logo-only .logo-box,
  .logo-box {
    width: 58px;
    height: 58px;
  }

  .join-small {
    grid-area: join;
    justify-self: end;
    white-space: nowrap;
  }

  .main-nav {
    grid-area: nav;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 14px;
    margin-left: 0;
  }

  .main-nav > a,
  .main-nav .nav-item > a,
  .nav-more-toggle {
    font-size: 0.84rem;
    white-space: nowrap;
  }

  .nav-more-toggle {
    padding: 4px 0;
  }

  .dropdown {
    left: 0;
    right: auto;
    min-width: 220px;
    max-width: 88vw;
  }

  .dropdown-right {
    right: 0;
    left: auto;
  }
}
@media (max-width: 420px) {
  .main-nav {
    gap: 8px 10px;
  }

  .main-nav > a,
  .main-nav .nav-item > a,
  .nav-more-toggle {
    font-size: 0.78rem;
  }

  .brand-logo-only .logo-box,
  .logo-box {
    width: 52px;
    height: 52px;
  }

  .join-small {
    padding-left: 14px;
    padding-right: 14px;
  }
}
/* Clean mobile header */
.mobile-menu {
  display: none;
}

@media (max-width: 760px) {
  body {
    overflow-x: hidden;
  }

  .announcement-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    text-align: left;
  }

  .nav-wrap {
    display: grid;
    grid-template-columns: auto auto;
    grid-template-areas:
      "logo join"
      "menu menu";
    align-items: center;
    gap: 12px;
    min-height: auto;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .brand {
    grid-area: logo;
  }

  .brand-logo-only .logo-box,
  .logo-box {
    width: 56px;
    height: 56px;
  }

  .join-small {
    grid-area: join;
    justify-self: end;
    white-space: nowrap;
  }

  .main-nav {
    display: none;
  }

  .mobile-menu {
    grid-area: menu;
    display: block;
    width: 100%;
  }

  .mobile-menu summary {
    list-style: none;
    cursor: pointer;
    width: 100%;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: #ffffff;
    padding: 12px 18px;
    font-weight: 900;
    text-align: center;
  }

  .mobile-menu summary::-webkit-details-marker {
    display: none;
  }

  .mobile-menu summary::after {
    content: " ▾";
  }

  .mobile-menu[open] summary::after {
    content: " ▴";
  }

  .mobile-menu-panel {
    margin-top: 10px;
    background: #ffffff;
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 10px;
    box-shadow: 0 18px 35px rgba(17, 17, 17, 0.08);
    display: grid;
    gap: 4px;
  }

  .mobile-menu-panel a {
    color: var(--black);
    text-decoration: none;
    font-weight: 800;
    padding: 12px 14px;
    border-radius: 14px;
  }

  .mobile-menu-panel a:hover,
  .mobile-menu-panel a.active {
    background: #f8f5ee;
    color: var(--gold-dark);
  }
}
@media (max-width: 420px) {
  #divisions .league-box {
    padding: 18px;
    gap: 10px;
  }

  #divisions .league-logo {
    width: 92px;
    height: 92px;
    max-width: 92px;
    max-height: 92px;
  }

  #divisions .league-box h3 {
    font-size: 1rem;
  }

  #divisions .league-box span {
    font-size: 1.35rem;
  }

  #divisions .league-box p {
    font-size: 0.9rem;
  }
}
/* Mobile fix for ticker / Match Centre sections */
@media (max-width: 760px) {
  .ticker {
    overflow: hidden;
  }

  .ticker-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    text-align: left;
  }

  .ticker-inner strong {
    display: block;
    width: 100%;
  }

  .ticker-inner .live-dot {
    display: none;
  }

  .ticker-inner p {
    width: 100%;
    margin: 0;
    white-space: normal;
    overflow-wrap: break-word;
    line-height: 1.45;
  }
}
/* Season One Seeding */

.season-seeding-section {
  background:
    radial-gradient(circle at top left, rgba(201, 155, 74, 0.14), transparent 34rem),
    linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0));
}

.season-seeding-section .section-heading {
  max-width: 820px;
  margin-bottom: 1.75rem;
}

.season-seeding-section .section-heading p {
  color: var(--muted);
}

.seeding-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.65fr);
  gap: 1.5rem;
  padding: 1.5rem;
  border: 1px solid rgba(201, 155, 74, 0.35);
  border-radius: 24px;
  background: rgba(12, 12, 12, 0.74);
  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.28);
  overflow: hidden;
}

.seeding-main {
  min-width: 0;
}

.seeding-main h3,
.seeding-card h3 {
  margin: 0 0 0.7rem;
  color: var(--gold);
}

.seeding-main p,
.seeding-card p,
.seeding-note {
  color: var(--muted);
  line-height: 1.65;
}

.seeding-main p:last-child {
  margin-bottom: 0;
}

.seeding-flow {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  min-width: 0;
}

.seeding-flow span {
  display: block;
  padding: 0.8rem 0.95rem;
  border: 1px solid rgba(201, 155, 74, 0.32);
  border-radius: 999px;
  color: var(--text);
  background: rgba(255, 255, 255, 0.045);
  font-weight: 700;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
}

.seeding-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1rem;
}

.seeding-card {
  min-width: 0;
  padding: 1.2rem;
  border: 1px solid rgba(201, 155, 74, 0.22);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.035);
}

.seeding-card p {
  margin-bottom: 0;
}

.seeding-note {
  margin: 1rem 0 0;
  padding: 1rem 1.1rem;
  border-left: 3px solid var(--gold);
  border-radius: 14px;
  background: rgba(201, 155, 74, 0.08);
}

/* Mobile */
@media (max-width: 820px) {
  .seeding-panel {
    grid-template-columns: 1fr;
    padding: 1.15rem;
    border-radius: 20px;
  }

  .seeding-cards {
    grid-template-columns: 1fr;
  }

  .seeding-flow span {
    text-align: left;
  }
}
/* Join page contact section */

.join-details-list {
  margin-bottom: 1.4rem;
}

.join-email-btn {
  display: inline-flex;
  width: fit-content;
  margin-top: 0.25rem;
}

@media (max-width: 700px) {
  .join-details-list {
    margin-bottom: 1.6rem;
  }

  .join-email-btn {
    width: 100%;
    justify-content: center;
  }
}
/* Join page sign-up form */

.signup-form {
  margin-top: 1.5rem;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1.25rem;
}

.form-field {
  min-width: 0;
}

.form-field label {
  display: block;
  margin-bottom: 0.45rem;
  font-weight: 700;
  color: var(--text);
}

.form-field input {
  width: 100%;
  min-height: 48px;
  padding: 0.8rem 0.9rem;
  border: 1px solid rgba(201, 155, 74, 0.28);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.68);
  color: var(--text);
  font: inherit;
}

.form-field input:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(201, 155, 74, 0.18);
}

.checkbox-row {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  margin: 0 0 0.85rem;
  color: var(--muted);
  line-height: 1.5;
}

.checkbox-row input {
  margin-top: 0.25rem;
  flex: 0 0 auto;
}

.signup-submit {
  margin-top: 0.75rem;
}

@media (max-width: 700px) {
  .form-grid {
    grid-template-columns: 1fr;
  }

  .signup-submit {
    width: 100%;
    justify-content: center;
  }
}
/* =========================================================
   IMSC PATCH: League page match centre layout
   Paste at the very bottom of public/style.css
   Purpose: fixes league.html match-centre cards/grid so content
   stays inside the screen and formats cleanly on desktop/mobile.
   ========================================================= */

body[data-page="league"] .match-section,
body[data-page="league"] .match-centre-section,
body[data-page="league"] .match-center-section {
  overflow-x: hidden;
}

body[data-page="league"] .match-section *,
body[data-page="league"] .match-centre-section *,
body[data-page="league"] .match-center-section * {
  box-sizing: border-box;
}

body[data-page="league"] .match-card,
body[data-page="league"] .match-centre-card,
body[data-page="league"] .match-center-card,
body[data-page="league"] .featured-fixture-card,
body[data-page="league"] .fixture-review-card {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(120px, 220px) minmax(0, 1fr) minmax(120px, 180px);
  gap: 24px;
  align-items: center;
}

body[data-page="league"] .match-card > *,
body[data-page="league"] .match-centre-card > *,
body[data-page="league"] .match-center-card > *,
body[data-page="league"] .featured-fixture-card > *,
body[data-page="league"] .fixture-review-card > * {
  min-width: 0;
}

body[data-page="league"] .match-card h2,
body[data-page="league"] .match-card h3,
body[data-page="league"] .match-card p,
body[data-page="league"] .match-centre-card h2,
body[data-page="league"] .match-centre-card h3,
body[data-page="league"] .match-centre-card p,
body[data-page="league"] .match-center-card h2,
body[data-page="league"] .match-center-card h3,
body[data-page="league"] .match-center-card p,
body[data-page="league"] .featured-fixture-card h2,
body[data-page="league"] .featured-fixture-card h3,
body[data-page="league"] .featured-fixture-card p,
body[data-page="league"] .fixture-review-card h2,
body[data-page="league"] .fixture-review-card h3,
body[data-page="league"] .fixture-review-card p {
  max-width: 100%;
  overflow-wrap: anywhere;
}

body[data-page="league"] .board-preview,
body[data-page="league"] .match-board-preview,
body[data-page="league"] .fixture-board-preview {
  width: 100%;
  max-width: 220px;
  min-height: 150px;
  display: grid;
  place-items: center;
}

body[data-page="league"] .score-box,
body[data-page="league"] .match-score-box,
body[data-page="league"] .fixture-score-box {
  width: 100%;
  min-width: 0;
  max-width: 180px;
  justify-self: end;
}

body[data-page="league"] .match-centre-grid,
body[data-page="league"] .match-center-grid,
body[data-page="league"] .fixture-review-grid,
body[data-page="league"] .match-grid {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 20px;
}

body[data-page="league"] .match-centre-grid > *,
body[data-page="league"] .match-center-grid > *,
body[data-page="league"] .fixture-review-grid > *,
body[data-page="league"] .match-grid > * {
  min-width: 0;
  max-width: 100%;
}

body[data-page="league"] .match-card table,
body[data-page="league"] .match-centre-card table,
body[data-page="league"] .match-center-card table,
body[data-page="league"] .fixture-review-card table {
  width: 100%;
  max-width: 100%;
  table-layout: fixed;
}

body[data-page="league"] .match-card th,
body[data-page="league"] .match-card td,
body[data-page="league"] .match-centre-card th,
body[data-page="league"] .match-centre-card td,
body[data-page="league"] .match-center-card th,
body[data-page="league"] .match-center-card td,
body[data-page="league"] .fixture-review-card th,
body[data-page="league"] .fixture-review-card td {
  overflow-wrap: anywhere;
}

@media (max-width: 900px) {
  body[data-page="league"] .match-card,
  body[data-page="league"] .match-centre-card,
  body[data-page="league"] .match-center-card,
  body[data-page="league"] .featured-fixture-card,
  body[data-page="league"] .fixture-review-card {
    grid-template-columns: 1fr;
    gap: 18px;
    text-align: left;
  }

  body[data-page="league"] .board-preview,
  body[data-page="league"] .match-board-preview,
  body[data-page="league"] .fixture-board-preview {
    max-width: 240px;
    margin-inline: auto;
  }

  body[data-page="league"] .score-box,
  body[data-page="league"] .match-score-box,
  body[data-page="league"] .fixture-score-box {
    max-width: none;
    justify-self: stretch;
  }
}

@media (max-width: 560px) {
  body[data-page="league"] .match-card,
  body[data-page="league"] .match-centre-card,
  body[data-page="league"] .match-center-card,
  body[data-page="league"] .featured-fixture-card,
  body[data-page="league"] .fixture-review-card {
    gap: 14px;
  }

  body[data-page="league"] .board-preview,
  body[data-page="league"] .match-board-preview,
  body[data-page="league"] .fixture-board-preview {
    max-width: 100%;
    min-height: 120px;
  }

  body[data-page="league"] .match-card .btn,
  body[data-page="league"] .match-centre-card .btn,
  body[data-page="league"] .match-center-card .btn,
  body[data-page="league"] .featured-fixture-card .btn,
  body[data-page="league"] .fixture-review-card .btn {
    width: 100%;
    justify-content: center;
  }
}
/* =========================================================
   IMSC HOMEPAGE CONTENT BLOCKS PATCH
   Task: tidy homepage sections below the hero without touching header
   Paste at the very bottom of public/style.css
   ========================================================= */

/* General safety: stop cards/grids from forcing horizontal overflow */
.home .container,
body[data-page="home"] .container,
body[data-page="home"] section,
body[data-page="home"] article,
body[data-page="home"] div,
body[data-page="home"] a,
body[data-page="home"] table {
  box-sizing: border-box;
}

body[data-page="home"] {
  overflow-x: hidden;
}

body[data-page="home"] .section,
body[data-page="home"] .section-sm {
  position: relative;
}

/* Section headers: cleaner alignment and safer wrapping */
body[data-page="home"] .section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1.4rem;
}

body[data-page="home"] .section-head h2 {
  margin-bottom: 0;
  max-width: 760px;
}

body[data-page="home"] .section-head > a {
  flex: 0 0 auto;
  white-space: nowrap;
  font-weight: 800;
}

/* Quick cards */
body[data-page="home"] .quick-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

body[data-page="home"] .quick-card {
  min-width: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: .55rem;
}

body[data-page="home"] .quick-card p {
  flex: 1;
}

/* Latest news cards */
body[data-page="home"] .news-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

body[data-page="home"] .news-card {
  min-width: 0;
  height: 100%;
}

body[data-page="home"] .news-card h3,
body[data-page="home"] .quick-card h3,
body[data-page="home"] .path-card h3,
body[data-page="home"] .product-card h3,
body[data-page="home"] .honour-card h3 {
  overflow-wrap: anywhere;
}

/* Season preview grid */
body[data-page="home"] .league-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  align-items: stretch;
}

body[data-page="home"] .panel {
  min-width: 0;
  height: 100%;
}

body[data-page="home"] .fixture-row {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .75rem;
}

body[data-page="home"] .fixture-row strong,
body[data-page="home"] .fixture-row small {
  min-width: 0;
}

body[data-page="home"] .hub-list li {
  min-width: 0;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}

body[data-page="home"] .hub-list li span {
  text-align: right;
  min-width: 0;
}

body[data-page="home"] .performers li {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

body[data-page="home"] table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

body[data-page="home"] th,
body[data-page="home"] td {
  overflow-wrap: anywhere;
}

/* Ticker */
body[data-page="home"] .ticker-inner {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: .75rem;
}

body[data-page="home"] .ticker-inner p {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Training grid */
body[data-page="home"] .training-grid {
  display: grid;
  grid-template-columns: 1.35fr repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

body[data-page="home"] .course-card {
  grid-row: span 2;
  min-width: 0;
}

body[data-page="home"] .path-card {
  min-width: 0;
}

/* Product and honours grids */
body[data-page="home"] .product-grid,
body[data-page="home"] .boards-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

body[data-page="home"] .product-card,
body[data-page="home"] .honour-card {
  min-width: 0;
  height: 100%;
}

body[data-page="home"] .product-img {
  width: 100%;
}

/* Homepage match-card */
body[data-page="home"] .match-card {
  display: grid;
  grid-template-columns: minmax(110px, 150px) minmax(0, 1fr) minmax(130px, 180px);
  gap: 1.25rem;
  align-items: center;
  min-width: 0;
}

body[data-page="home"] .match-card > div {
  min-width: 0;
}

body[data-page="home"] .match-card p {
  max-width: 780px;
}

body[data-page="home"] .board-preview,
body[data-page="home"] .score-box {
  width: 100%;
}

/* Join card */
body[data-page="home"] .join-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  min-width: 0;
}

body[data-page="home"] .join-card > div {
  min-width: 0;
}

body[data-page="home"] .join-card .btn {
  flex: 0 0 auto;
}

/* Tablet */
@media (max-width: 1020px) {
  body[data-page="home"] .quick-grid,
  body[data-page="home"] .news-grid,
  body[data-page="home"] .product-grid,
  body[data-page="home"] .boards-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-page="home"] .training-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-page="home"] .course-card {
    grid-column: 1 / -1;
    grid-row: auto;
  }

  body[data-page="home"] .match-card {
    grid-template-columns: minmax(100px, 140px) minmax(0, 1fr);
  }

  body[data-page="home"] .match-card .score-box {
    grid-column: 1 / -1;
  }
}

/* Mobile */
@media (max-width: 720px) {
  body[data-page="home"] .section-head {
    display: block;
  }

  body[data-page="home"] .section-head > a {
    display: inline-block;
    margin-top: .75rem;
    white-space: normal;
  }

  body[data-page="home"] .quick-grid,
  body[data-page="home"] .news-grid,
  body[data-page="home"] .league-grid,
  body[data-page="home"] .training-grid,
  body[data-page="home"] .product-grid,
  body[data-page="home"] .boards-grid,
  body[data-page="home"] .match-card {
    grid-template-columns: 1fr;
  }

  body[data-page="home"] .fixture-row {
    grid-template-columns: auto minmax(0, 1fr);
  }

  body[data-page="home"] .fixture-row small {
    grid-column: 2;
  }

  body[data-page="home"] .hub-list li,
  body[data-page="home"] .performers li {
    align-items: flex-start;
  }

  body[data-page="home"] .hub-list li {
    flex-direction: column;
    gap: .25rem;
  }

  body[data-page="home"] .hub-list li span {
    text-align: left;
  }

  body[data-page="home"] .ticker-inner {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  body[data-page="home"] .ticker-inner p {
    flex-basis: 100%;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }

  body[data-page="home"] .join-card {
    align-items: stretch;
    flex-direction: column;
  }

  body[data-page="home"] .join-card .btn {
    width: 100%;
    text-align: center;
  }
}

/* Small mobile */
@media (max-width: 420px) {
  body[data-page="home"] .fixture-row,
  body[data-page="home"] .performers li {
    gap: .55rem;
  }

  body[data-page="home"] .quick-card,
  body[data-page="home"] .news-card,
  body[data-page="home"] .panel,
  body[data-page="home"] .course-card,
  body[data-page="home"] .path-card,
  body[data-page="home"] .product-card,
  body[data-page="home"] .honour-card,
  body[data-page="home"] .match-card,
  body[data-page="home"] .join-card {
    width: 100%;
    max-width: 100%;
  }
}

/* =========================================================
   IMSC JOIN PAGE PATCH
   Paste at the bottom of public/style.css
   Scope: join.html only where possible
   ========================================================= */

body[data-page="join"] main {
  overflow-x: hidden;
}

.join-hero {
  position: relative;
}

.join-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: 32px;
  align-items: stretch;
}

.join-hero-copy,
.join-status-card,
.join-step-card,
.join-info-panel,
.join-form,
.join-side-panel {
  min-width: 0;
}

.join-status-card,
.join-step-card,
.join-side-panel {
  border: 1px solid rgba(212, 175, 55, 0.26);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.025));
  border-radius: 24px;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.22);
}

.join-status-card {
  padding: 26px;
}

.join-status-card h2 {
  margin: 12px 0 10px;
}

.join-status-card p {
  margin: 0 0 18px;
}

.join-status-card ul,
.join-check-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.join-status-card li,
.join-check-list li {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.join-status-card li:first-child,
.join-check-list li:first-child {
  border-top: 0;
}

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

.join-step-card {
  padding: 26px;
}

.join-step-card > span {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  margin-bottom: 18px;
  border-radius: 999px;
  border: 1px solid rgba(212, 175, 55, 0.45);
  color: var(--gold, #d4af37);
  font-weight: 800;
}

.join-step-card h3 {
  margin: 0 0 10px;
}

.join-step-card p {
  margin: 0 0 20px;
}

.join-info-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, 0.9fr);
  gap: 24px;
  align-items: start;
}

.join-info-panel h2 {
  margin-top: 0;
}

.join-check-list li {
  display: block;
}

.join-form-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
  gap: 24px;
  align-items: start;
}

.join-form {
  padding: 28px;
  border: 1px solid rgba(212, 175, 55, 0.24);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.045);
}

.form-row {
  display: grid;
  gap: 8px;
  margin-bottom: 18px;
}

.form-row.two-col {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.form-row label,
.join-consent-box legend {
  font-weight: 800;
  letter-spacing: 0.02em;
}

.form-row input {
  width: 100%;
  min-width: 0;
  padding: 13px 14px;
  border: 1px solid rgba(212, 175, 55, 0.22);
  border-radius: 12px;
  background: rgba(0, 0, 0, 0.25);
  color: inherit;
  font: inherit;
}

.form-row input:focus {
  outline: 2px solid rgba(212, 175, 55, 0.32);
  outline-offset: 2px;
}

.join-consent-box {
  display: grid;
  gap: 12px;
  margin: 8px 0 22px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 16px;
}

.join-consent-box label {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  line-height: 1.45;
}

.join-consent-box input {
  margin-top: 4px;
}

.form-note {
  margin: 14px 0 0;
  font-size: 0.92rem;
  opacity: 0.78;
}

.join-side-panel {
  padding: 24px;
  position: sticky;
  top: 100px;
}

.join-side-panel h3 {
  margin-top: 0;
}

.join-side-callout {
  display: grid;
  gap: 6px;
  margin: 18px 0;
  padding: 16px;
  border-radius: 16px;
  border: 1px solid rgba(212, 175, 55, 0.28);
  background: rgba(212, 175, 55, 0.08);
}

.join-side-callout strong {
  color: var(--gold, #d4af37);
}

@media (max-width: 900px) {
  .join-hero-grid,
  .join-info-grid,
  .join-form-grid {
    grid-template-columns: 1fr;
  }

  .join-side-panel {
    position: static;
  }
}

@media (max-width: 700px) {
  .join-step-grid,
  .form-row.two-col {
    grid-template-columns: 1fr;
  }

  .join-status-card,
  .join-step-card,
  .join-form,
  .join-side-panel {
    border-radius: 18px;
    padding: 20px;
  }

  .join-status-card li {
    display: block;
  }

  .join-status-card li strong {
    display: block;
    margin-top: 4px;
  }
}

/* League Delta current rules explainer block */
.league-delta-explainer-block {
  border: 1px solid rgba(216, 169, 40, 0.32);
  border-radius: 24px;
  padding: clamp(20px, 4vw, 32px);
  background:
    linear-gradient(135deg, rgba(216, 169, 40, 0.12), rgba(255, 255, 255, 0.04)),
    rgba(255, 255, 255, 0.04);
  overflow: hidden;
}

.league-delta-explainer-block__header {
  max-width: 900px;
  margin-bottom: 24px;
}

.league-delta-explainer-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.league-delta-explainer-card {
  border: 1px solid rgba(216, 169, 40, 0.22);
  border-radius: 18px;
  padding: 18px;
  background: rgba(0, 0, 0, 0.18);
}

.league-delta-explainer-card--wide {
  grid-column: 1 / -1;
}

.league-delta-explainer-card h3 {
  margin-bottom: 10px;
}

.league-delta-explainer-card p,
.league-delta-explainer-card li {
  color: rgba(246, 241, 232, 0.76);
}

.league-delta-explainer-card ul {
  margin: 0;
  padding-left: 18px;
}

.league-delta-explainer-card li + li {
  margin-top: 7px;
}

.league-delta-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.league-delta-pill-row span {
  display: inline-flex;
  border: 1px solid rgba(216, 169, 40, 0.35);
  border-radius: 999px;
  padding: 8px 11px;
  color: #f6f1e8;
  font-weight: 800;
}

.league-delta-mini-table {
  width: 100%;
  border-collapse: collapse;
}

.league-delta-mini-table th,
.league-delta-mini-table td {
  padding: 9px 8px;
  border-bottom: 1px solid rgba(216, 169, 40, 0.2);
  text-align: left;
}

.league-delta-mini-table th {
  color: rgba(246, 241, 232, 0.7);
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

@media (max-width: 760px) {
  .league-delta-explainer-grid {
    grid-template-columns: 1fr;
  }

  .league-delta-explainer-block {
    padding: 18px;
    border-radius: 20px;
  }
}


/* Keep public page hero descriptions aligned with the main content width. */
.page-hero .container > p:not(.eyebrow) {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}


/* Improve contrast inside the League Delta explainer cards. */
.league-delta-explainer-card,
.league-delta-explainer-card h3,
.league-delta-explainer-card p,
.league-delta-explainer-card li,
.league-delta-explainer-card th,
.league-delta-explainer-card td,
.league-delta-pill-row span {
  color: #111;
}

.league-delta-explainer-card {
  background: rgba(255, 255, 255, 0.42);
}

.league-delta-mini-table th,
.league-delta-mini-table td {
  color: #111;
}


/* Homepage brand/culture line moved below the product-first hero. */
.brand-culture-line {
  padding: 30px 0;
}

.brand-culture-line .container {
  border-top: 1px solid rgba(191, 145, 43, 0.28);
  border-bottom: 1px solid rgba(191, 145, 43, 0.28);
  padding-top: 24px;
  padding-bottom: 24px;
}

.brand-culture-line p {
  margin: 0;
  font-size: clamp(1.15rem, 2.2vw, 1.65rem);
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: -0.02em;
}



/* Homepage hero clarity sizing override start */
.hero h1,
.home-hero h1,
.page-hero h1 {
  font-size: clamp(3rem, 7.2vw, 6.6rem);
  line-height: 0.88;
  letter-spacing: -0.055em;
  max-width: 980px;
}

.hero h1 span,
.home-hero h1 span,
.page-hero h1 span {
  display: block;
  white-space: nowrap;
  font-size: 0.72em;
}

.hero-lead,
.hero p.hero-lead,
.home-hero p.hero-lead {
  font-size: clamp(1rem, 1.55vw, 1.22rem);
  line-height: 1.45;
  max-width: 780px;
}

.hero-trust,
.hero p.hero-trust,
.home-hero p.hero-trust {
  font-size: 0.92rem;
  line-height: 1.45;
}

@media (max-width: 760px) {
  .hero h1,
  .home-hero h1,
  .page-hero h1 {
    font-size: clamp(2.35rem, 12vw, 4.2rem);
    line-height: 0.9;
    letter-spacing: -0.05em;
  }

  .hero h1 span,
  .home-hero h1 span,
  .page-hero h1 span {
    font-size: 0.64em;
  }

  .hero-lead,
  .hero p.hero-lead,
  .home-hero p.hero-lead {
    font-size: 1rem;
    line-height: 1.42;
  }
}

@media (max-width: 420px) {
  .hero h1,
  .home-hero h1,
  .page-hero h1 {
    font-size: clamp(2.05rem, 11vw, 3.15rem);
  }

  .hero h1 span,
  .home-hero h1 span,
  .page-hero h1 span {
    font-size: 0.58em;
  }
}
/* Homepage hero clarity sizing override end */


/* Homepage hero clarity sizing override start */
.hero-product-headline {
  display: block;
  max-width: 920px;
  margin: 0 0 22px;
  font-size: clamp(2.8rem, 6.1vw, 5.75rem);
  line-height: 0.88;
  letter-spacing: -0.055em;
}

.hero-product-headline .hero-line {
  display: block;
  white-space: nowrap;
}

.hero-product-headline .hero-line-free {
  font-size: 0.66em;
  letter-spacing: -0.045em;
  margin-top: 0.08em;
}

.hero-lead,
.hero p.hero-lead,
.home-hero p.hero-lead {
  font-size: clamp(0.98rem, 1.35vw, 1.14rem);
  line-height: 1.42;
  max-width: 740px;
}

.hero-trust,
.hero p.hero-trust,
.home-hero p.hero-trust {
  font-size: 0.88rem;
  line-height: 1.42;
}

@media (max-width: 760px) {
  .hero-product-headline {
    font-size: clamp(2.05rem, 10.2vw, 3.6rem);
    line-height: 0.9;
    letter-spacing: -0.052em;
    max-width: 100%;
  }

  .hero-product-headline .hero-line-free {
    font-size: 0.6em;
  }

  .hero-lead,
  .hero p.hero-lead,
  .home-hero p.hero-lead {
    font-size: 0.96rem;
    line-height: 1.38;
  }
}

@media (max-width: 420px) {
  .hero-product-headline {
    font-size: clamp(1.8rem, 9.3vw, 2.9rem);
    line-height: 0.91;
  }

  .hero-product-headline .hero-line-free {
    font-size: 0.56em;
  }
}
/* Homepage hero clarity sizing override end */


/* Homepage culture line and hero alignment start */
.brand-culture-line {
  padding: 14px 0 8px;
}

.brand-culture-line .container {
  text-align: center;
  padding-top: 16px;
  padding-bottom: 16px;
}

.brand-culture-line p {
  max-width: 980px;
  margin: 0 auto;
  text-align: center;
}

.brand-culture-line + .hero-product-first,
.brand-culture-line + .hero,
.brand-culture-line + .home-hero {
  padding-top: 20px;
  margin-top: 0;
}

.hero-product-first {
  padding-top: 20px;
}

.hero-product-first .container,
.hero-product-first .hero-grid,
.hero-product-first .hero-inner {
  align-items: flex-start;
}

.hero-product-first .hero-product-headline {
  margin-top: 0;
  margin-bottom: 18px;
}

.hero-product-first .hero-visual,
.hero-product-first .hero-card,
.hero-product-first .fixture-card,
.hero-product-first .preview-card,
.hero-product-first .season-card,
.hero-product-first .orb-card {
  margin-top: 0 !important;
  align-self: flex-start;
}

@media (min-width: 900px) {
  .hero-product-first .container,
  .hero-product-first .hero-grid,
  .hero-product-first .hero-inner {
    display: grid;
    align-items: flex-start;
  }
}

@media (max-width: 760px) {
  .brand-culture-line {
    padding: 10px 0 6px;
  }

  .brand-culture-line .container {
    padding-top: 14px;
    padding-bottom: 14px;
  }

  .brand-culture-line + .hero-product-first,
  .brand-culture-line + .hero,
  .brand-culture-line + .home-hero {
    padding-top: 14px;
  }

  .hero-product-first {
    padding-top: 14px;
  }
}
/* Homepage culture line and hero alignment end */




/* Chess.com registration disclaimer start */
.registration-disclaimer {
  padding: 0 0 28px;
}

.registration-disclaimer .notice-card {
  border: 1px solid rgba(191, 145, 43, 0.45);
  border-left: 6px solid var(--gold, #d1a91f);
  background: rgba(255, 255, 255, 0.72);
  border-radius: 18px;
  padding: 18px 20px;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.06);
}

.registration-disclaimer strong {
  display: block;
  margin: 0 0 6px;
  font-size: 0.88rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.registration-disclaimer p {
  margin: 0;
  font-size: 1rem;
  line-height: 1.45;
  color: var(--text, #111);
}

@media (max-width: 760px) {
  .registration-disclaimer {
    padding: 0 0 20px;
  }

  .registration-disclaimer .notice-card {
    padding: 16px;
    border-radius: 16px;
  }
}
/* Chess.com registration disclaimer end */