
:root {
  --navy: rgb(17, 41, 76);
  --navy-2: #0b1d38;
  --turquoise: rgb(129, 206, 198);
  --white: #ffffff;
  --cream: #f7f9fb;
  --line: rgba(17, 41, 76, 0.1);
  --text: #132f4f;
  --muted: rgba(17, 41, 76, 0.74);
  --shadow: 0 18px 46px rgba(0, 0, 0, 0.18);
  --radius: 26px;
  --gold: #f4d20f;
  --dark-card: #16181d;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: 'Barlow', Arial, sans-serif;
  background:
    radial-gradient(circle at 12% 6%, rgba(129,206,198,0.22), transparent 30%),
    radial-gradient(circle at 90% 0%, rgba(255,255,255,0.10), transparent 32%),
    linear-gradient(180deg, var(--navy), var(--navy-2));
  color: var(--white);
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
.hidden { display: none !important; }
.container { width: min(1240px, calc(100% - 32px)); margin: 0 auto; }

.site-header {
  position: sticky; top: 0; z-index: 10;
  background: rgba(10, 27, 52, 0.88);
  border-bottom: 1px solid rgba(255,255,255,0.12);
  backdrop-filter: blur(12px);
}
.header-inner { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:12px 0; }
.brand { display:flex; align-items:center; gap:14px; }
.brand-logo { width:64px; height:64px; object-fit:contain; filter: drop-shadow(0 8px 16px rgba(0,0,0,0.2)); }
.brand-text strong { display:block; font-size:1.22rem; line-height:1.05; letter-spacing:0.02em; }
.brand-text span { display:block; color:rgba(255,255,255,0.76); margin-top:3px; font-size:0.94rem; }
.main-nav { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.main-nav a { padding:11px 17px; border-radius:999px; background:rgba(255,255,255,0.09); border:1px solid rgba(255,255,255,0.10); font-weight:700; transition: transform .2s ease, background .2s ease; }
.main-nav a:hover { background: rgba(129,206,198,0.20); transform: translateY(-1px); }

.main-shell { padding:30px 0 52px; }
.home-section, .venue-section { margin-bottom: 28px; }
.panel, .premium-card { border-radius: var(--radius); box-shadow: var(--shadow); }
.panel-white { background: var(--white); color: var(--navy); }
.panel-turquoise { background: var(--turquoise); color: var(--navy); }
.panel-dark { background: #111317; color: var(--white); }
.panel-white, .panel-turquoise, .panel-dark { padding: 24px; }

.portal-hero {
  min-height: 520px; display:grid; grid-template-columns:1.2fr 0.8fr; gap:28px; align-items:center;
  padding: clamp(28px, 5vw, 56px); margin-bottom:24px; border-radius:34px;
  background: linear-gradient(135deg, rgba(17,41,76,0.06), rgba(17,41,76,0.62)), linear-gradient(135deg, rgba(129,206,198,0.95), rgba(255,255,255,0.95));
  color: var(--navy); box-shadow: var(--shadow); overflow:hidden; position:relative;
}
.portal-hero::after { content:""; position:absolute; inset:auto -80px -150px auto; width:420px; height:420px; border-radius:50%; background: rgba(17,41,76,0.10); }
.portal-copy { position:relative; z-index:1; }
.eyebrow { margin:0 0 10px; text-transform:uppercase; letter-spacing:0.14em; font-size:0.78rem; font-weight:900; color: rgba(17,41,76,0.72); }
.eyebrow.light { color: rgba(255,255,255,0.78); }
.eyebrow.gold { color: var(--gold); }
.eyebrow.accent { color: rgba(17,41,76,0.70); }
.portal-hero h1 { margin:0 0 16px; font-size: clamp(2.8rem, 6vw, 5.8rem); line-height:0.92; letter-spacing:-0.06em; }
.lead-copy { max-width:62ch; font-size:1.12rem; line-height:1.65; margin:0; color: rgba(17,41,76,0.82); }
.hero-actions, .action-row { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:14px 20px; border-radius:999px; font-weight:800; border:0; }
.btn-primary { background: var(--navy); color: var(--white); }
.btn-secondary { background: rgba(17,41,76,0.08); color: var(--navy); border:2px solid rgba(17,41,76,0.12); }
.btn-light { background: var(--white); color: var(--navy); }
.btn-outline-light { color: var(--navy); background: rgba(255,255,255,0.35); border: 2px solid rgba(17,41,76,0.13); }
.hero-crest-panel { position:relative; z-index:1; justify-self:center; width:min(360px,100%); padding:28px; border-radius:30px; background:rgba(255,255,255,0.58); border:1px solid rgba(255,255,255,0.52); box-shadow:0 14px 34px rgba(0,0,0,0.14); text-align:center; }
.hero-crest-panel img { max-height:300px; margin:0 auto 14px; object-fit:contain; }
.crest-text span { display:block; color:rgba(17,41,76,0.7); font-weight:800; text-transform:uppercase; letter-spacing:.12em; }
.crest-text strong { display:block; font-size:1.6rem; color:var(--navy); }

.section-heading { display:flex; justify-content:space-between; align-items:end; gap:22px; margin-bottom:18px; }
.section-heading h2, .panel h2 { margin:0; font-size: clamp(1.6rem, 3vw, 2.2rem); letter-spacing:-0.03em; }
.section-heading.on-navy p:not(.eyebrow), .section-heading.on-dark p:not(.eyebrow) { margin:0; max-width:52ch; }
.section-heading.on-navy p:not(.eyebrow) { color: rgba(255,255,255,0.72); }
.section-heading.on-dark p:not(.eyebrow) { color: rgba(255,255,255,0.75); }
.section-text { color: var(--muted); max-width:54ch; margin:0; }
.compact-gap { margin-bottom: 12px; }

.club-overview-grid { display:grid; grid-template-columns:1.1fr 0.9fr; gap:20px; align-items:start; }
.club-overview-copy p { margin:0 0 14px; color: var(--muted); font-size:1.05rem; line-height:1.7; }
.club-stat-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px; }
.club-stat-grid article { padding:18px; border-radius:18px; background:#f5f8fb; border:1px solid rgba(17,41,76,0.08); }
.club-stat-grid strong { display:block; font-size:1.8rem; color:var(--navy); }
.club-stat-grid span { color: var(--muted); font-weight:600; }
.values-grid { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:18px; }
.value-card span { font-size:2rem; display:block; margin-bottom:10px; }
.value-card h3 { margin:0 0 8px; color:var(--navy); }
.value-card p { margin:0; color:var(--muted); }


.club-links-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.club-link-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: start;
  padding: 20px;
  border-radius: 22px;
  background: #f8fbfd;
  border: 1px solid rgba(17,41,76,0.08);
  color: var(--navy);
  transition: transform .2s ease, box-shadow .2s ease;
}
a.club-link-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 38px rgba(17,41,76,0.14);
}
.club-link-card.is-placeholder {
  opacity: 0.88;
}
.club-link-icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: rgba(129,206,198,0.45);
  font-size: 1.45rem;
}
.club-link-card h3 {
  margin: 0 0 6px;
  font-size: 1.22rem;
  color: var(--navy);
}
.club-link-card p {
  margin: 0 0 12px;
  color: var(--muted);
  line-height: 1.5;
}
.club-link-card strong {
  color: var(--navy);
  font-size: 0.95rem;
}


.fixtures-section {
  scroll-margin-top: 110px;
}
.fixtures-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.fixture-link-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  padding: 20px;
  border-radius: 22px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.10);
  color: var(--white);
  transition: transform .2s ease, background .2s ease;
}
.fixture-link-card:hover {
  transform: translateY(-3px);
  background: rgba(255,255,255,0.12);
}
.fixture-icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: rgba(244,210,15,0.16);
  font-size: 1.45rem;
}
.fixture-link-card h3 {
  margin: 0 0 6px;
  color: var(--gold);
  font-size: 1.18rem;
}
.fixture-link-card p {
  margin: 0 0 12px;
  color: rgba(255,255,255,0.82);
}
.fixture-link-card strong {
  color: var(--white);
}

.venue-grid { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:20px; }
.venue-card {
  overflow:hidden;
  display:flex;
  flex-direction:column;
  background:var(--white);
  color:var(--navy);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  border:1px solid rgba(255,255,255,0.2);
  transition: transform .2s ease, box-shadow .2s ease;
}
.venue-card:hover { transform: translateY(-4px); box-shadow: 0 24px 56px rgba(0,0,0,0.24); }
.venue-image-wrap {
  position:relative;
  overflow:hidden;
  aspect-ratio:16 / 10;
  background:#0f223f;
  isolation:isolate;
}
.venue-image-wrap::after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(7,16,32,0.16) 0%, rgba(7,16,32,0.28) 38%, rgba(7,16,32,0.78) 100%);
  z-index:1;
}
.venue-card img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  filter:saturate(0.96) contrast(1.03);
}
.venue-image-copy {
  position:absolute;
  left:18px;
  right:18px;
  bottom:18px;
  z-index:2;
  color:var(--white);
}
.venue-image-kicker {
  display:inline-block;
  margin-bottom:10px;
  padding:8px 14px;
  border-radius:999px;
  background:rgba(129,206,198,0.94);
  color:var(--navy);
  font-size:0.8rem;
  font-weight:900;
  letter-spacing:0.04em;
  text-transform:uppercase;
}
.venue-image-copy h3 {
  margin:0 0 6px;
  font-size:clamp(1.5rem, 2vw, 2rem);
  line-height:1.02;
  letter-spacing:-0.03em;
  text-shadow:0 3px 16px rgba(0,0,0,0.34);
}
.venue-image-copy p {
  margin:0;
  color:rgba(255,255,255,0.92);
  font-weight:700;
  letter-spacing:0.02em;
}
.venue-card-body {
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:20px;
  flex:1;
}
.venue-card-body p { margin:0; color:var(--muted); }
.venue-link-label { color:var(--navy); }

.venue-hero { display:grid; grid-template-columns:1.05fr 0.95fr; gap:24px; align-items:stretch; padding:28px; margin-bottom:28px; background: var(--turquoise); color: var(--navy); }
.hero-copy h1 { margin:0 0 12px; font-size: clamp(2rem, 4vw, 3.55rem); line-height:0.96; letter-spacing:-0.05em; }
.hero-copy p { margin:0; font-size:1.08rem; max-width:56ch; color: rgba(17,41,76,0.82); }
.hero-media { background: rgba(255,255,255,0.95); padding:14px; border-radius:22px; min-height:320px; box-shadow: inset 0 0 0 1px rgba(17,41,76,0.08); }
.hero-media img { width:100%; height:100%; border-radius:16px; object-fit:cover; object-position:center; display:block; }

.venue-info-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:18px; }
.venue-detail-card {
  min-height: 100%;
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01)), var(--dark-card);
  border: 1px solid rgba(255,255,255,0.05);
  border-radius: 20px;
  padding: 22px;
  color: var(--white);
}
.venue-detail-icon { font-size: 1.6rem; color: var(--gold); margin-bottom: 12px; }
.venue-detail-card h3 { margin:0 0 10px; color:var(--gold); font-size:1.45rem; letter-spacing:-0.02em; }
.venue-detail-card p { margin:0; color: rgba(255,255,255,0.88); line-height:1.55; }

.venue-map-section { margin-bottom:28px; }
.full-map-figure { margin: 0; overflow: hidden; border-radius: 20px; border: 1px solid rgba(255,255,255,0.06); background:#0e1014; }
.full-map-figure img { width: 100%; max-height: none; object-fit: contain; background:#0f1115; }

.content-grid { display:grid; grid-template-columns:0.9fr 1.1fr; gap:24px; }
.wide-top-gap { margin-top: 4px; margin-bottom: 28px; }
.note-list { margin:16px 0 0; padding-left:20px; }
.note-list li { margin-bottom:10px; color: var(--muted); }
.snapshot-grid.compact { display:grid; grid-template-columns:1fr; gap:14px; }
.mini-snapshot-card { display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:start; padding:14px; border-radius:16px; background: rgba(255,255,255,0.28); }
.mini-emoji { font-size:1.35rem; }
.mini-snapshot-card h4 { margin:0 0 4px; color:var(--navy); }
.mini-snapshot-card p { margin:0; color: rgba(17,41,76,0.86); }

.kits-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:18px; }
.kit-card { overflow:hidden; border-radius:24px; background:#f8fbfd; color:var(--navy); border:1px solid rgba(17,41,76,0.08); }
.kit-image-wrap { min-height:330px; display:flex; align-items:center; justify-content:center; padding:22px; background: radial-gradient(circle at 50% 44%, rgba(129,206,198,0.20), transparent 44%), #ffffff; }
.kit-image-wrap img { max-width:100%; max-height:286px; width:auto; height:auto; object-fit:contain; margin:auto; }
.kit-copy { padding:18px; }
.kit-heading-row { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom: 6px; }
.kit-copy h3 { font-size:1.22rem; margin:0; }
.kit-variant-badge { display:inline-block; padding:6px 10px; border-radius:999px; background: rgba(17,41,76,0.08); font-size:0.78rem; font-weight:800; }
.kit-copy p { margin:0; color:var(--muted); }
.kit-colours { margin:16px 0 0; display:grid; gap:8px; }
.kit-colours div { display:grid; grid-template-columns:72px 1fr; gap:12px; align-items:baseline; padding:8px 10px; border-radius:12px; background: rgba(17,41,76,0.05); }
.kit-colours dt { font-weight:900; color:var(--navy); }
.kit-colours dd { margin:0; color: rgba(17,41,76,0.78); }

.respect-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:28px; align-items:stretch; }
.respect-card { background:#f8fbfd; color:var(--navy); padding:24px; border-radius:22px; border:1px solid rgba(17,41,76,0.08); min-height:100%; }

#respect-section { margin-top: 28px; }

.fixtures-hero {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 24px;
  margin-bottom: 28px;
}
.fixtures-hero h1 {
  margin: 0 0 12px;
  font-size: clamp(2.4rem, 5vw, 4.4rem);
  line-height: 0.95;
  letter-spacing: -0.05em;
}
.fixtures-hero p {
  margin: 0;
  color: rgba(255,255,255,0.78);
  max-width: 62ch;
  font-size: 1.08rem;
  line-height: 1.6;
}
.fixtures-page-section {
  margin-bottom: 28px;
}
.fixtures-grid-light {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.fixture-link-card-light {
  background: #f8fbfd;
  color: var(--navy);
  border: 1px solid rgba(17,41,76,0.08);
}
.fixture-link-card-light:hover {
  background: #f3f7fa;
}
.fixture-link-card-light h3 {
  color: var(--navy);
}
.fixture-link-card-light p {
  color: var(--muted);
}
.fixture-link-card-light strong {
  color: var(--navy);
}
.fixture-link-card-light .fixture-icon {
  background: rgba(129,206,198,0.42);
}


.site-footer { padding:8px 0 34px; }
.footer-inner { display:flex; justify-content:center; align-items:center; gap:12px; color: rgba(255,255,255,0.72); text-align:center; }
.footer-inner img { width:38px; height:38px; object-fit:contain; }

@media (max-width: 1100px) {
  .portal-hero, .fixtures-hero, .club-overview-grid, .values-grid, .club-links-grid, .fixtures-grid, .venue-grid, .venue-hero, .venue-info-grid, .content-grid, .kits-grid, .respect-grid {
    grid-template-columns: 1fr 1fr;
  }
  .portal-hero > :first-child, .venue-hero > :first-child { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .container { width: min(100% - 20px, 1240px); }
  .header-inner { flex-direction:column; align-items:flex-start; }
  .main-nav { width:100%; }
  .main-nav a { flex:1 1 auto; text-align:center; }
  .portal-hero, .panel-white, .panel-turquoise, .panel-dark, .venue-hero { padding:18px; }
  .portal-hero, .fixtures-hero, .club-overview-grid, .values-grid, .club-links-grid, .fixtures-grid, .venue-grid, .venue-hero, .venue-info-grid, .content-grid, .kits-grid, .respect-grid {
    grid-template-columns:1fr;
  }
  .section-heading { flex-direction:column; align-items:flex-start; }
  .portal-hero h1 { font-size:3.3rem; }
  .kit-image-wrap { min-height:270px; }
}

.fixture-logo-wrap {
  background: #ffffff;
  overflow: hidden;
}
.fixture-logo {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 12px;
}


.fixtures-hero-turquoise {
  background: var(--turquoise);
  color: var(--navy);
  box-shadow: var(--shadow);
}
.fixtures-hero-turquoise h1 {
  color: var(--navy);
}
.fixtures-hero-turquoise p {
  color: rgba(17,41,76,0.82);
}
.fixtures-hero-turquoise .btn-primary {
  background: var(--navy);
  color: var(--white);
}


/* V6 refinements */
.value-card.panel-dark {
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01)), var(--dark-card);
  color: var(--white);
}
.value-card.panel-dark h3 {
  color: var(--gold);
}
.value-card.panel-dark p {
  color: rgba(255,255,255,0.86);
}
.useful-links-panel {
  background: #111317;
  color: var(--white);
}
.useful-links-panel .section-text,
.useful-links-panel .section-heading.on-dark p:not(.eyebrow) {
  color: rgba(255,255,255,0.78);
}
.useful-links-panel .club-link-card {
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01)), var(--dark-card);
  border: 1px solid rgba(255,255,255,0.06);
  color: var(--white);
}
.useful-links-panel .club-link-card h3 {
  color: var(--gold);
}
.useful-links-panel .club-link-card p {
  color: rgba(255,255,255,0.86);
}
.useful-links-panel .club-link-card strong {
  color: var(--white);
}
.useful-links-panel .club-link-icon {
  background: rgba(244,210,15,0.15);
}

/* Make the fixtures page hero match the turquoise venue box with proper padding */
.fixtures-hero-turquoise {
  padding: clamp(28px, 4vw, 48px);
  min-height: 260px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  border-radius: var(--radius);
}
.fixtures-hero-turquoise h1 {
  margin-bottom: 14px;
  line-height: 0.95;
}
.fixtures-hero-turquoise p {
  max-width: 760px;
  line-height: 1.55;
}
.fixtures-hero-turquoise .btn-primary {
  flex: 0 0 auto;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .fixtures-hero-turquoise {
    min-height: auto;
    flex-direction: column;
    align-items: flex-start;
  }
}


/* V7 refinements */
.portal-hero {
  background: var(--turquoise);
  color: var(--navy);
}
.portal-hero::after {
  background: rgba(17,41,76,0.08);
}
.hero-crest-panel {
  display: flex;
  align-items: center;
  justify-content: center;
}
.hero-crest-panel img {
  margin: 0 auto;
}
.venue-hero .btn-light {
  background: var(--white);
  color: var(--navy);
  border: 2px solid rgba(255,255,255,0.9);
}


/* V8 social/contact/footer refinements */
.social-contact-section {
  scroll-margin-top: 110px;
}
.social-contact-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 18px;
  align-items: stretch;
}
.social-links-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.social-card,
.contact-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  padding: 20px;
  border-radius: 22px;
  background: #f8fbfd;
  border: 1px solid rgba(17,41,76,0.08);
  color: var(--navy);
}
.social-card {
  transition: transform .2s ease, box-shadow .2s ease;
}
.social-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 38px rgba(17,41,76,0.14);
}
.social-icon,
.contact-icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: rgba(129,206,198,0.45);
  font-size: 1.45rem;
  font-weight: 900;
}
.social-card h3,
.contact-card h3 {
  margin: 0 0 6px;
  font-size: 1.22rem;
  color: var(--navy);
}
.social-card p,
.contact-card p {
  margin: 0 0 12px;
  color: var(--muted);
  line-height: 1.5;
}
.social-card strong,
.contact-card a {
  color: var(--navy);
  font-weight: 900;
}
.footer-copy {
  display: grid;
  gap: 5px;
}
.footer-copy p {
  margin: 0;
}
.footer-copy small {
  display: block;
  color: rgba(255,255,255,0.62);
  line-height: 1.4;
}

@media (max-width: 900px) {
  .social-contact-grid,
  .social-links-grid {
    grid-template-columns: 1fr;
  }
}


/* V8 refined adjustments */
.portal-hero::after {
  display: none;
}
.hero-venues-btn {
  background: var(--navy);
  color: var(--white);
  border: 2px solid var(--navy);
}
.hero-venues-btn:hover {
  background: #0b2546;
  border-color: #0b2546;
}
.main-nav a {
  background: rgba(129,206,198,0.22);
  border: 1px solid rgba(129,206,198,0.48);
  color: var(--white);
}
.main-nav a:hover {
  background: var(--turquoise);
  color: var(--navy);
}
.social-logo-wrap {
  background: transparent;
  padding: 0;
  overflow: hidden;
}
.social-logo-wrap img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}


/* V13 premium portal polish */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,0.55), transparent 70%);
}

.site-header {
  box-shadow: 0 12px 34px rgba(0,0,0,0.16);
}

.portal-hero {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.44);
  background:
    linear-gradient(135deg, rgba(255,255,255,0.62), rgba(129,206,198,0.92) 48%, rgba(129,206,198,0.78)),
    var(--turquoise);
}
.portal-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 88% 18%, rgba(17,41,76,0.18), transparent 24%),
    linear-gradient(90deg, rgba(17,41,76,0.05), transparent 52%);
}
.portal-copy,
.hero-crest-panel {
  position: relative;
  z-index: 1;
}
.hero-crest-panel {
  width: min(390px, 100%);
  gap: 16px;
  flex-direction: column;
  padding: 28px;
  background: rgba(255,255,255,0.72);
  border: 1px solid rgba(255,255,255,0.74);
  box-shadow: 0 24px 60px rgba(17,41,76,0.18);
  backdrop-filter: blur(8px);
}
.hero-crest-panel img {
  max-height: 235px;
}
.portal-panel-copy {
  text-align: center;
}
.portal-panel-copy span {
  display: block;
  margin-bottom: 5px;
  color: rgba(17,41,76,0.66);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 0.76rem;
}
.portal-panel-copy strong {
  display: block;
  color: var(--navy);
  font-size: 1.02rem;
  line-height: 1.35;
}
.portal-panel-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}
.portal-panel-chips span {
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(17,41,76,0.08);
  color: var(--navy);
  font-size: 0.78rem;
  font-weight: 900;
}

.value-card,
.club-link-card,
.social-card,
.contact-card,
.venue-detail-card,
.kit-card,
.mini-snapshot-card {
  overflow-wrap: anywhere;
}

.venue-card {
  min-height: 100%;
}
.venue-image-wrap {
  border-bottom: 1px solid rgba(17,41,76,0.08);
}
.venue-image-wrap::before {
  content: '';
  position: absolute;
  inset: 12px;
  z-index: 2;
  border: 1px solid rgba(255,255,255,0.34);
  border-radius: 18px;
  pointer-events: none;
}
.venue-card-body {
  min-height: 142px;
  justify-content: space-between;
}

.venue-hero {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.42);
  background:
    linear-gradient(135deg, rgba(255,255,255,0.54), rgba(129,206,198,0.94)),
    var(--turquoise);
}
.venue-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 95% 8%, rgba(17,41,76,0.16), transparent 24%);
}
.venue-hero > * {
  position: relative;
  z-index: 1;
}
.hero-media {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 10;
  min-height: 0;
  padding: 10px;
  border: 1px solid rgba(17,41,76,0.12);
}
.hero-media::after {
  content: 'Pitch layout preview';
  position: absolute;
  left: 22px;
  bottom: 22px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(17,41,76,0.90);
  color: var(--white);
  font-weight: 900;
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  box-shadow: 0 10px 26px rgba(0,0,0,0.22);
}
.hero-media img {
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.20);
}

.full-map-figure {
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04);
}
.full-map-figure img {
  display: block;
}

@media (max-width: 900px) {
  .venue-grid,
  .venue-info-grid,
  .kits-grid,
  .club-links-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-hero,
  .venue-hero {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .container { width: min(100% - 22px, 1240px); }
  .site-header { position: sticky; }
  .header-inner { gap: 10px; }
  .brand-logo { width: 52px; height: 52px; }
  .brand-text strong { font-size: 1.08rem; }
  .brand-text span { font-size: 0.84rem; }
  .main-nav {
    width: 100%;
    overflow-x: auto;
    flex-wrap: nowrap;
    justify-content: flex-start;
    padding-bottom: 4px;
    scrollbar-width: none;
  }
  .main-nav::-webkit-scrollbar { display: none; }
  .main-nav a {
    flex: 0 0 auto;
    padding: 10px 14px;
    font-size: 0.92rem;
    white-space: nowrap;
  }
  .main-shell { padding-top: 18px; }
  .portal-hero {
    min-height: auto;
    border-radius: 28px;
    gap: 22px;
  }
  .portal-hero h1 { font-size: clamp(3rem, 15vw, 4.2rem); }
  .lead-copy { font-size: 1.04rem; }
  .hero-actions .btn,
  .action-row .btn {
    width: 100%;
  }
  .hero-crest-panel {
    width: 100%;
    padding: 22px;
  }
  .hero-crest-panel img { max-height: 190px; }
  .section-heading { gap: 10px; }
  .venue-grid,
  .venue-info-grid,
  .kits-grid,
  .club-links-grid,
  .social-links-grid,
  .social-contact-grid,
  .fixtures-grid,
  .content-grid,
  .respect-grid,
  .values-grid,
  .club-overview-grid {
    grid-template-columns: 1fr;
  }
  .venue-image-wrap { aspect-ratio: 16 / 11; }
  .venue-image-copy { left: 16px; right: 16px; bottom: 16px; }
  .venue-image-copy h3 { font-size: 1.55rem; }
  .venue-card-body { min-height: auto; }
  .venue-hero { border-radius: 28px; }
  .hero-media { aspect-ratio: 16 / 11; }
  .hero-media::after {
    left: 18px;
    bottom: 18px;
    font-size: 0.72rem;
  }
  .club-stat-grid { grid-template-columns: 1fr 1fr; }
  .kit-image-wrap { min-height: 230px; }
}

@media (max-width: 460px) {
  .container { width: min(100% - 18px, 1240px); }
  .portal-hero,
  .panel-white,
  .panel-turquoise,
  .panel-dark,
  .venue-hero { padding: 16px; }
  .club-stat-grid { grid-template-columns: 1fr; }
  .club-link-card,
  .social-card,
  .contact-card,
  .fixture-link-card {
    grid-template-columns: 1fr;
  }
  .club-link-icon,
  .social-icon,
  .contact-icon,
  .fixture-icon {
    width: 46px;
    height: 46px;
  }
}


/* V14 badge-only homepage crest panel */
.badge-only-panel {
  width: min(430px, 100%);
  padding: 34px;
  gap: 0;
}
.badge-only-panel img {
  width: 100%;
  max-width: 340px;
  max-height: none;
  margin: 0 auto;
  display: block;
}
@media (max-width: 720px) {
  .badge-only-panel {
    padding: 24px;
  }
  .badge-only-panel img {
    max-width: 260px;
  }
}
