/*
 * Bishops Castle Town FC — Concept 3 Design System
 * Community Modern · Red & Black
 * v3.0 — Full theme rebuild (replaces all previous styling)
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Anton&display=swap');

/* =====================================================
   1. TOKENS & RESET
   ===================================================== */
:root {
	--red: #C0181E;
	--red-dark: #8E1115;
	--red-soft: #fee2e2;
	--ink: #0a0a0a;
	--ink-2: #141414;
	--ink-3: #1a1a1a;
	--bg: #f4f4f4;
	--bg-card: #ffffff;
	--text: #0a0a0a;
	--text-muted: #555555;
	--text-soft: #888888;
	--border: #e8e8e8;
	--border-2: #d8d8d8;

	/* legacy customizer overrides — we hard-pin these */
	--accent: var(--red);
	--accent-dark: var(--red-dark);
	--muted: var(--text-muted);

	--font-sans: 'Inter', -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
	--font-display: 'Anton', 'Arial Narrow', 'Arial Black', Impact, sans-serif;

	--max: 1240px;
	--gutter: 1.4rem;
	--radius: 12px;
	--radius-sm: 8px;
	--radius-lg: 14px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
	font-family: var(--font-sans);
	background: var(--bg);
	color: var(--text);
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-size: 16px;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }
ul, ol { list-style: none; }

.bctfc-wrap { max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); }
.bctfc-screen-reader-text { position: absolute; left: -9999px; }

body.home .home-welcome-copy h1,
body.home .home-section-head h2,
body.home .home-matchband-copy h2,
body.home .home-junior-copy h2 { font-size: inherit !important; color: inherit !important; }

/* TOPBAR */
.site-topbar { background: #000; padding: .55rem 0; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: rgba(255,255,255,.7); border-bottom: 1px solid #1a1a1a; }
.site-topbar-inner { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.site-topbar-left { display: flex; gap: 1.4rem; flex-wrap: wrap; }
.site-topbar-right { display: flex; gap: 1.2rem; align-items: center; flex-wrap: wrap; }
.site-topbar-right a { color: #fff; }
.site-topbar-right a:hover { color: var(--red); }
.site-topbar .live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--red); display: inline-block; margin-right: .4rem; vertical-align: middle; animation: bctfc-pulse 2s infinite; }
@keyframes bctfc-pulse { 0%,100%{opacity:1} 50%{opacity:.4} }

/* HEADER */
.site-header { background: var(--ink); color: #fff; padding: 1rem 0; position: relative; border-bottom: 4px solid var(--red); }
.site-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.site-branding { display: flex; align-items: center; gap: .85rem; text-decoration: none; }
.site-branding img, .site-branding .site-logo-img { width: 54px; height: 54px; object-fit: contain; background: transparent; }
.site-branding-text strong { display: block; font-size: 1rem; font-weight: 800; letter-spacing: .005em; color: #fff; line-height: 1.1; }
.site-branding-text small { display: block; font-size: 10px; color: #999; letter-spacing: .18em; text-transform: uppercase; font-weight: 600; margin-top: 3px; }

.site-nav { flex: 1; display: flex; justify-content: center; }
.site-nav ul { display: flex; gap: 1.6rem; flex-wrap: wrap; }
.site-nav a { color: #fff; font-size: 13px; font-weight: 600; padding: .4rem 0; position: relative; transition: color .2s; }
.site-nav a:hover, .site-nav .current-menu-item > a, .site-nav .current-menu-parent > a, .site-nav .current-menu-ancestor > a { color: var(--red); }
.site-nav .sub-menu { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); background: var(--ink); border: 1px solid #2a2a2a; border-top: 3px solid var(--red); padding: .5rem 0; min-width: 200px; display: none; z-index: 100; }
.site-nav li { position: relative; }
.site-nav li:hover > .sub-menu { display: block; }
.site-nav .sub-menu li { display: block; }
.site-nav .sub-menu a { display: block; padding: .55rem 1.1rem; font-size: 12px; }
.site-nav .sub-menu a:hover { background: #1a1a1a; color: var(--red); }

.site-header-cta { background: var(--red); color: #fff; padding: .65rem 1.1rem; border-radius: 6px; font-size: 12px; font-weight: 700; letter-spacing: .04em; display: inline-flex; align-items: center; gap: .5rem; transition: background .2s; white-space: nowrap; }
.site-header-cta:hover { background: var(--red-dark); color: #fff; }

/* HERO */
.home-hero { background: var(--ink); color: #fff; padding: 0; position: relative; overflow: hidden; }
.home-hero-grid { display: grid; grid-template-columns: 1.15fr 1fr; min-height: 540px; max-width: var(--max); margin: 0 auto; }
.home-hero-left { padding: 3rem 2.5rem 4.5rem var(--gutter); display: flex; flex-direction: column; justify-content: center; }
.home-hero-tag { display: inline-flex; align-items: center; gap: .6rem; background: rgba(192,24,30,.14); border: 1px solid rgba(192,24,30,.4); color: #ff6671; padding: .5rem .85rem; border-radius: 99px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 1.4rem; align-self: flex-start; }
.home-hero-tag::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--red); animation: bctfc-pulse 2s infinite; }
.home-hero h1 { font-size: clamp(2.4rem, 5.2vw, 4.6rem); font-weight: 800; line-height: .98; letter-spacing: -.03em; margin-bottom: 1.4rem; color: #fff; }
.home-hero h1 span { color: var(--red); }
.home-hero-deck { font-size: 1.05rem; color: #bbb; line-height: 1.65; max-width: 520px; margin-bottom: 2rem; }
.home-hero-stats { display: flex; gap: 2.2rem; padding: 1.6rem 0 0; border-top: 1px solid rgba(255,255,255,.12); flex-wrap: wrap; }
.home-hero-stats > div { min-width: 64px; }
.home-hero-stats strong { display: block; font-size: 1.9rem; font-weight: 800; color: #fff; letter-spacing: -.02em; line-height: 1; }
.home-hero-stats span { display: block; font-size: 11px; color: #999; letter-spacing: .16em; text-transform: uppercase; font-weight: 600; margin-top: .4rem; }
.home-hero-right { position: relative; background: linear-gradient(135deg, var(--ink-3), var(--ink)); overflow: hidden; min-height: 360px; }
.home-hero-photo { position: absolute; inset: 0; background-size: cover; background-position: center; background-repeat: no-repeat; }
.home-hero-photo.placeholder { background-image: repeating-linear-gradient(115deg,#1f1f1f 0,#1f1f1f 12px,#181818 12px,#181818 24px); }
.home-hero-right::before { content: ''; position: absolute; top: 0; right: 0; width: 120px; height: 6px; background: var(--red); z-index: 2; }
.home-hero-overlay { position: absolute; left: 1.4rem; bottom: 1.4rem; background: rgba(10,10,10,.88); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); padding: 1rem 1.2rem; border-left: 3px solid var(--red); max-width: 280px; z-index: 3; }
.home-hero-overlay-tag { font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: var(--red); font-weight: 700; margin-bottom: .4rem; }
.home-hero-overlay strong { display: block; color: #fff; font-size: .95rem; font-weight: 700; line-height: 1.3; }

/* FIXTURE BAR */
.home-fixture-wrap { background: var(--bg); }
.home-fixture { max-width: 1140px; margin: -2.5rem auto 0; background: #fff; border-radius: var(--radius-lg); box-shadow: 0 16px 40px rgba(0,0,0,.16); position: relative; z-index: 5; padding: 1.4rem 1.8rem; display: grid; grid-template-columns: auto 1fr auto; gap: 1.6rem; align-items: center; }
.home-fixture-tag { font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: var(--red); font-weight: 800; writing-mode: vertical-rl; transform: rotate(180deg); align-self: stretch; border-right: 2px solid var(--red); padding-right: 1rem; display: flex; align-items: center; }
.home-fixture-teams { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 1rem; align-items: center; }
.fixture-team { display: flex; align-items: center; gap: .7rem; }
.fixture-team-shield { width: 40px; height: 44px; background: var(--red); color: #fff; font-size: 8px; font-weight: 800; display: flex; align-items: center; justify-content: center; clip-path: polygon(0 0,100% 0,100% 70%,50% 100%,0 70%); padding-top: 4px; text-align: center; line-height: 1; }
.fixture-team-shield.away { background: var(--ink); }
.fixture-team-shield img { width: 100%; height: 100%; object-fit: contain; }
.fixture-team-info strong { display: block; font-size: .95rem; font-weight: 800; letter-spacing: -.005em; color: var(--ink); }
.fixture-team-info small { font-size: 10px; color: var(--text-soft); letter-spacing: .1em; text-transform: uppercase; }
.fixture-vs { font-family: var(--font-display); font-size: 1.1rem; color: var(--ink); letter-spacing: .08em; padding: .4rem .7rem; background: var(--bg); border-radius: 6px; }
.fixture-when { text-align: center; }
.fixture-when strong { display: block; font-size: 1rem; font-weight: 800; color: var(--ink); }
.fixture-when small { font-size: 10px; color: var(--text-soft); letter-spacing: .14em; text-transform: uppercase; font-weight: 600; }
.fixture-cta { background: var(--ink); color: #fff; padding: .85rem 1.3rem; border-radius: var(--radius-sm); font-size: 12px; font-weight: 700; letter-spacing: .06em; white-space: nowrap; transition: background .2s; }
.fixture-cta:hover { background: var(--red); color: #fff; }

/* QUICK TILES */
.home-tiles { padding: 3.5rem 0 1rem; }
.home-tiles-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1.4rem; flex-wrap: wrap; }
.home-tiles-head h2 { font-size: 1.7rem; font-weight: 800; letter-spacing: -.02em; color: var(--ink); }
.home-tiles-head h2 small { display: block; font-size: 11px; color: var(--red); letter-spacing: .22em; text-transform: uppercase; font-weight: 700; margin-bottom: .3rem; }
.home-tiles-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.home-tile { background: var(--bg-card); padding: 1.4rem; border-radius: var(--radius); border: 1px solid transparent; position: relative; overflow: hidden; transition: border-color .2s, transform .2s; display: block; }
.home-tile:hover { border-color: var(--ink); transform: translateY(-2px); }
.home-tile-icon { width: 44px; height: 44px; border-radius: 10px; background: var(--red-soft); color: var(--red); display: flex; align-items: center; justify-content: center; font-size: 1.3rem; font-weight: 800; margin-bottom: .9rem; }
.home-tile h3 { font-size: 1.05rem; font-weight: 800; letter-spacing: -.01em; margin-bottom: .3rem; color: var(--ink); }
.home-tile p { font-size: 13px; color: var(--text-muted); line-height: 1.5; }
.home-tile-arrow { position: absolute; top: 1.4rem; right: 1.4rem; color: var(--ink); font-size: 1rem; font-weight: 700; }

/* NEWS + JUNIOR SPLIT */
.home-split { padding: 3rem 0 3.5rem; }
.home-split-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 1.5rem; }
.home-news-block { background: var(--bg-card); border-radius: var(--radius-lg); overflow: hidden; }
.home-news-feature { position: relative; aspect-ratio: 16/9; background: var(--ink-3); display: flex; align-items: flex-end; padding: 1.6rem; color: #fff; background-size: cover; background-position: center; }
.home-news-feature.placeholder { background-image: repeating-linear-gradient(115deg,#1a1a1a,#1a1a1a 12px,#222 12px,#222 24px); }
.home-news-feature::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 35%, rgba(10,10,10,.88)); z-index: 1; }
.home-news-feature > * { position: relative; z-index: 2; }
.home-news-feature-tag { position: absolute; top: 1.4rem; left: 1.4rem; background: var(--red); color: #fff; padding: .45rem .8rem; border-radius: 5px; font-size: 10px; letter-spacing: .18em; text-transform: uppercase; font-weight: 800; z-index: 3; }
.home-news-feature-content { width: 100%; }
.home-news-feature h3 { font-size: 1.6rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.18; margin-bottom: .4rem; max-width: 560px; color: #fff; }
.home-news-feature h3 a { color: #fff; }
.home-news-feature small { font-size: 11px; color: rgba(255,255,255,.78); letter-spacing: .12em; text-transform: uppercase; font-weight: 600; }
.home-news-list { padding: .5rem; }
.home-news-row { display: grid; grid-template-columns: auto 1fr; gap: 1rem; padding: 1rem; border-radius: var(--radius-sm); align-items: center; transition: background .2s; }
.home-news-row:hover { background: #f8f8f8; }
.home-news-row + .home-news-row { border-top: 1px solid #f0f0f0; }
.home-news-thumb { width: 80px; height: 64px; background: var(--ink-3); background-image: repeating-linear-gradient(135deg,#1a1a1a,#1a1a1a 4px,#222 4px,#222 8px); background-size: cover; background-position: center; border-radius: 6px; flex-shrink: 0; }
.home-news-row-content small { font-size: 10px; color: var(--red); letter-spacing: .16em; text-transform: uppercase; font-weight: 700; margin-bottom: .3rem; display: block; }
.home-news-row-content h4 { font-size: 14px; font-weight: 700; letter-spacing: -.005em; line-height: 1.3; color: var(--ink); }
.home-news-row-content h4 a { color: var(--ink); }
.home-news-row-content h4 a:hover { color: var(--red); }

.home-junior-card { background: var(--ink); color: #fff; border-radius: var(--radius-lg); padding: 2rem; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; }
.home-junior-card::before { content: ''; position: absolute; top: -40px; right: -40px; width: 160px; height: 160px; background: var(--red); border-radius: 50%; opacity: .15; }
.home-junior-tag { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--red); font-weight: 800; margin-bottom: 1rem; position: relative; }
.home-junior-card h3 { font-size: 1.6rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.15; margin-bottom: 1rem; color: #fff; position: relative; }
.home-junior-card p { font-size: 14px; color: #bbb; line-height: 1.6; margin-bottom: 1.5rem; position: relative; }
.home-junior-ages { display: grid; grid-template-columns: repeat(5, 1fr); gap: .4rem; margin-bottom: 1.5rem; position: relative; }
.home-junior-age { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); padding: .7rem .3rem; text-align: center; border-radius: 7px; font-size: .85rem; font-weight: 800; letter-spacing: -.01em; color: #fff; transition: background .2s, border-color .2s; }
.home-junior-age:hover { background: var(--red); border-color: var(--red); color: #fff; }
.home-junior-cta { background: var(--red); color: #fff; padding: .85rem 1.2rem; border-radius: var(--radius-sm); font-size: 12px; font-weight: 700; letter-spacing: .06em; text-align: center; display: block; position: relative; transition: background .2s; }
.home-junior-cta:hover { background: var(--red-dark); color: #fff; }

/* SPONSORS */
.home-sponsors { background: var(--bg-card); padding: 2rem 0; border-top: 1px solid var(--border); }
.home-sponsors-row { display: flex; align-items: center; gap: 2rem; flex-wrap: wrap; }
.home-sponsors-label { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--text-soft); font-weight: 700; flex-shrink: 0; }
.home-sponsors-logos { display: flex; gap: 1rem; flex: 1; justify-content: space-around; flex-wrap: wrap; }
.home-sponsor { padding: .7rem 1.4rem; background: var(--bg); border-radius: 6px; font-size: 11px; letter-spacing: .14em; color: var(--text-muted); font-weight: 700; text-transform: uppercase; min-height: 44px; display: flex; align-items: center; }
.home-sponsor img { max-height: 36px; width: auto; }

/* INNER PAGES */
.page-hero { background: var(--ink); color: #fff; padding: 3rem 0 2.5rem; border-bottom: 4px solid var(--red); }
.page-hero h1 { font-size: clamp(1.8rem, 4vw, 3rem); font-weight: 800; letter-spacing: -.02em; color: #fff; }
.page-hero .breadcrumb { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--red); font-weight: 700; margin-bottom: .8rem; }
.page-content { background: var(--bg-card); padding: 3rem 0; }
.page-content .entry-content { max-width: 760px; margin: 0 auto; font-size: 1.05rem; line-height: 1.75; color: var(--text); }
.page-content .entry-content h2 { font-size: 1.8rem; font-weight: 800; letter-spacing: -.02em; margin: 2rem 0 1rem; color: var(--ink); }
.page-content .entry-content h3 { font-size: 1.3rem; font-weight: 700; margin: 1.6rem 0 .8rem; color: var(--ink); }
.page-content .entry-content p { margin-bottom: 1.2rem; }
.page-content .entry-content a { color: var(--red); border-bottom: 1px solid var(--red); }
.page-content .entry-content a:hover { color: var(--red-dark); border-color: var(--red-dark); }
.page-content .entry-content ul, .page-content .entry-content ol { margin: 0 0 1.2rem 1.4rem; }
.page-content .entry-content li { margin-bottom: .4rem; }
.page-content .entry-content blockquote { border-left: 4px solid var(--red); padding: .5rem 0 .5rem 1.4rem; margin: 1.6rem 0; font-size: 1.15rem; color: var(--text-muted); font-style: italic; }
.page-content .entry-content img { border-radius: var(--radius-sm); margin: 1.4rem 0; }
.page-content .entry-content table { width: 100%; border-collapse: collapse; margin: 1.4rem 0; font-size: 14px; }
.page-content .entry-content th, .page-content .entry-content td { padding: .8rem 1rem; border-bottom: 1px solid var(--border); text-align: left; }
.page-content .entry-content th { background: var(--ink); color: #fff; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; font-size: 12px; }

.news-archive { padding: 2rem 0 3rem; }
.news-archive-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.4rem; }
.news-archive-item { background: var(--bg-card); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; }
.news-archive-thumb { aspect-ratio: 16/9; background: var(--ink-3); background-image: repeating-linear-gradient(115deg,#1a1a1a,#1a1a1a 8px,#222 8px,#222 16px); background-size: cover; background-position: center; }
.news-archive-body { padding: 1.2rem 1.4rem 1.4rem; flex: 1; display: flex; flex-direction: column; }
.news-archive-meta { font-size: 10px; letter-spacing: .18em; color: var(--red); text-transform: uppercase; font-weight: 700; margin-bottom: .5rem; }
.news-archive-body h2 { font-size: 1.15rem; font-weight: 800; letter-spacing: -.01em; line-height: 1.25; margin-bottom: .6rem; color: var(--ink); }
.news-archive-body h2 a { color: var(--ink); }
.news-archive-body h2 a:hover { color: var(--red); }
.news-archive-body p { font-size: 14px; color: var(--text-muted); line-height: 1.55; margin-bottom: 1rem; }
.news-archive-body .read-more { margin-top: auto; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--ink); font-weight: 700; border-bottom: 2px solid var(--red); padding-bottom: 3px; align-self: flex-start; }

.single-post .page-content { padding: 2rem 0 3rem; }
.single-post .post-meta { font-size: 11px; letter-spacing: .18em; color: var(--red); text-transform: uppercase; font-weight: 700; margin-bottom: 1rem; }
.single-post .post-thumbnail { margin-bottom: 2rem; border-radius: var(--radius); overflow: hidden; }

/* =====================================================
   13. TEAM DATA PAGE — fixtures, results, league table (v3.4)
   APPEND TO end of site.css after inner-pages.css block
   ===================================================== */

/* Stats strip in the page hero */
.page-hero-stats {
	display: flex;
	gap: 1.6rem;
	margin-top: 1.4rem;
	padding-top: 1.4rem;
	border-top: 1px solid rgba(255,255,255,.12);
	flex-wrap: wrap;
}
.page-hero-stats > div { min-width: 56px; }
.page-hero-stats strong {
	display: block;
	font-size: 1.6rem;
	font-weight: 800;
	color: #fff;
	letter-spacing: -.02em;
	line-height: 1;
}
.page-hero-stats span {
	display: block;
	font-size: 10px;
	color: #999;
	letter-spacing: .16em;
	text-transform: uppercase;
	font-weight: 600;
	margin-top: .35rem;
}

/* Team data wrappers */
.team-data-intro { max-width: 760px; margin: 0 auto 2rem; }
.team-data-intro p { font-size: 1.05rem; line-height: 1.7; color: var(--text-muted); }
.team-data-intro:empty { display: none; }

.team-data-section { margin: 0 0 2.5rem; }

.team-data-head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
	margin-bottom: 1rem;
	padding-bottom: .8rem;
	border-bottom: 2px solid var(--ink);
	flex-wrap: wrap;
}
.team-data-head h2 {
	font-size: 1.6rem;
	font-weight: 800;
	letter-spacing: -.02em;
	color: var(--ink);
	margin: 0;
}
.team-data-head h2 span {
	display: block;
	font-size: 11px;
	color: var(--red);
	letter-spacing: .22em;
	text-transform: uppercase;
	font-weight: 700;
	margin-bottom: .25rem;
}
.team-data-head small {
	font-size: 12px;
	color: var(--text-soft);
	letter-spacing: .04em;
}

.team-data-empty {
	padding: 1.5rem;
	background: var(--bg-card);
	border-radius: var(--radius);
	color: var(--text-muted);
	font-style: italic;
	text-align: center;
}

.team-data-error {
	padding: 1rem 1.4rem;
	background: var(--red-soft);
	border-left: 3px solid var(--red);
	border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
	margin-bottom: 1.6rem;
}
.team-data-error strong { color: var(--ink); }
.team-data-error p { font-size: 14px; margin: .3rem 0 0; color: var(--text-muted); }

.team-data-source {
	margin: 2rem 0 0;
	font-size: 12px;
	color: var(--text-soft);
	text-align: center;
	letter-spacing: .04em;
}
.team-data-source a { color: var(--red); border-bottom: 1px solid currentColor; }

/* Match list (fixtures + results) */
.match-list {
	display: flex;
	flex-direction: column;
	background: var(--bg-card);
	border-radius: var(--radius);
	overflow: hidden;
}
.match-row {
	display: grid;
	grid-template-columns: 100px 1fr 70px;
	align-items: center;
	gap: 1rem;
	padding: 1rem 1.2rem;
	border-bottom: 1px solid var(--border);
	transition: background .15s;
}
.match-row:last-child { border-bottom: 0; }
.match-row:hover { background: var(--bg); }

.match-date {
	display: flex;
	flex-direction: column;
	gap: 3px;
	border-right: 2px solid var(--border);
	padding-right: 1rem;
}
.match-date strong {
	font-size: 13px;
	font-weight: 800;
	color: var(--ink);
	letter-spacing: -.005em;
	text-transform: uppercase;
}
.match-date small {
	font-size: 10px;
	color: var(--text-soft);
	letter-spacing: .12em;
	text-transform: uppercase;
	font-weight: 600;
}
.match-outcome {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 22px; height: 22px;
	border-radius: 50%;
	color: #fff !important;
	font-weight: 800 !important;
	font-size: 11px !important;
	letter-spacing: 0 !important;
}
.match-outcome.outcome-w { background: #16a34a; }
.match-outcome.outcome-d { background: #888; }
.match-outcome.outcome-l { background: var(--red); }

.match-teams {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	gap: 1rem;
	align-items: center;
	min-width: 0;
}
.match-team {
	font-size: 14px;
	color: var(--text-muted);
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.match-team-home { text-align: right; }
.match-team-away { text-align: left; }
.match-team.is-us {
	color: var(--ink);
	font-weight: 800;
}
.match-vs, .match-score {
	font-size: 13px;
	font-weight: 800;
	color: var(--ink);
	padding: .35rem .7rem;
	background: var(--bg);
	border-radius: 5px;
	letter-spacing: .04em;
	text-align: center;
	min-width: 56px;
}
.match-score { background: var(--ink); color: #fff; font-family: var(--font-display); font-size: 16px; letter-spacing: .06em; }
.match-vs { color: var(--text-soft); font-size: 12px; }

.match-venue {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--text-soft);
	text-align: right;
}

/* League table */
.league-table-wrap {
	background: var(--bg-card);
	border-radius: var(--radius);
	overflow: hidden;
	overflow-x: auto;
}
.league-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	min-width: 540px;
}
.league-table thead th {
	background: var(--ink);
	color: #fff;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	font-size: 11px;
	padding: .9rem .6rem;
	text-align: center;
}
.league-table thead th.lt-pos { width: 44px; padding-left: 1rem; }
.league-table thead th.lt-team { text-align: left; padding-left: .5rem; }
.league-table thead th.lt-pts { padding-right: 1rem; }
.league-table tbody td {
	padding: .85rem .6rem;
	text-align: center;
	border-bottom: 1px solid var(--border);
	color: var(--text-muted);
}
.league-table tbody td.lt-pos {
	font-weight: 800;
	color: var(--ink);
	padding-left: 1rem;
}
.league-table tbody td.lt-team {
	text-align: left;
	font-weight: 700;
	color: var(--ink);
	padding-left: .5rem;
}
.league-table tbody td.lt-pts {
	font-weight: 800;
	color: var(--ink);
	padding-right: 1rem;
}
.league-table tbody tr:last-child td { border-bottom: 0; }
.league-table tbody tr.lt-row-us {
	background: rgba(192,24,30,.08);
}
.league-table tbody tr.lt-row-us td { color: var(--ink); font-weight: 700; }
.league-table tbody tr.lt-row-us td.lt-pos {
	position: relative;
	color: var(--red);
}
.league-table tbody tr.lt-row-us td.lt-pos::before {
	content: '';
	position: absolute;
	left: 0; top: 0; bottom: 0;
	width: 4px;
	background: var(--red);
}

/* Mobile */
@media (max-width: 700px) {
	.page-hero-stats { gap: 1rem; }
	.page-hero-stats strong { font-size: 1.3rem; }

	.match-row {
		grid-template-columns: 80px 1fr;
		gap: .7rem;
	}
	.match-row .match-venue { display: none; }
	.match-date { padding-right: .7rem; }
	.match-teams {
		grid-template-columns: 1fr auto 1fr;
		gap: .5rem;
	}
	.match-team { font-size: 13px; }
	.match-vs, .match-score { padding: .3rem .5rem; min-width: 48px; font-size: 12px; }

	.league-table { font-size: 12px; }
	.league-table thead th, .league-table tbody td { padding: .6rem .35rem; }
}


/* FOOTER */
.site-footer { background: #000; color: #fff; padding: 3rem 0 1.4rem; border-top: 4px solid var(--red); }
.site-footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 2rem; margin-bottom: 2.5rem; }
.site-footer-brand { display: flex; align-items: center; gap: .9rem; margin-bottom: 1rem; }
.site-footer-brand img { width: 56px; height: 56px; object-fit: contain; }
.site-footer-brand strong { font-size: 1.05rem; font-weight: 800; letter-spacing: .005em; display: block; line-height: 1.1; }
.site-footer-brand small { font-size: 10px; color: var(--red); letter-spacing: .22em; text-transform: uppercase; font-weight: 700; display: block; margin-top: 4px; }
.site-footer-about { font-size: 14px; color: #aaa; line-height: 1.65; max-width: 320px; }
.site-footer h4 { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--red); font-weight: 800; margin-bottom: 1rem; }
.site-footer ul a, .site-footer-contact a { color: #ccc; font-size: 14px; }
.site-footer ul a:hover, .site-footer-contact a:hover { color: var(--red); }
.site-footer ul li { margin-bottom: .55rem; }
.site-footer-contact { font-size: 14px; color: #ccc; line-height: 1.7; }
.site-footer-contact strong { color: #fff; display: block; margin-bottom: .2rem; font-weight: 600; }
.site-footer-contact + .site-footer-contact { margin-top: 1rem; }
.site-footer-bottom { border-top: 1px solid #1a1a1a; padding-top: 1.4rem; display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; font-size: 12px; color: #666; }
.site-footer-social { display: flex; gap: .6rem; }
.site-footer-social a { width: 36px; height: 36px; border: 1px solid #2a2a2a; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #aaa; font-size: 12px; font-weight: 700; transition: background .2s, border-color .2s, color .2s; }
.site-footer-social a:hover { background: var(--red); border-color: var(--red); color: #fff; }

/* RESPONSIVE */
@media (max-width: 980px) {
	.home-hero-grid { grid-template-columns: 1fr; min-height: auto; }
	.home-hero-left { padding: 2.4rem var(--gutter) 4rem; }
	.home-hero-right { min-height: 300px; }
	.home-fixture { grid-template-columns: 1fr; gap: 1rem; padding: 1.4rem; }
	.home-fixture-tag { writing-mode: horizontal-tb; transform: none; border-right: none; border-bottom: 2px solid var(--red); padding: 0 0 .6rem; }
	.home-fixture-teams { grid-template-columns: 1fr auto 1fr; }
	.home-fixture-teams > .fixture-when { display: none; }
	.fixture-cta { width: 100%; text-align: center; }
	.home-tiles-grid { grid-template-columns: repeat(2, 1fr); }
	.home-split-grid { grid-template-columns: 1fr; }
	.site-footer-grid { grid-template-columns: 1fr 1fr; }
	.site-nav { display: none; }
	.site-header-cta { display: none; }
}
@media (max-width: 600px) {
	.home-hero h1 { font-size: 2.4rem; }
	.home-hero-stats { gap: 1.4rem; }
	.home-hero-stats strong { font-size: 1.5rem; }
	.home-tiles-grid { grid-template-columns: 1fr; }
	.home-junior-ages { grid-template-columns: repeat(3, 1fr); }
	.site-footer-grid { grid-template-columns: 1fr; }
	.site-footer-bottom { flex-direction: column; text-align: center; }
}
/* Hero gradient fade — blend photo into dark hero */
.home-hero-photo { z-index: 0; }
.home-hero-right::after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 35%;
	background: linear-gradient(90deg, var(--ink) 0%, rgba(10,10,10,0.6) 50%, transparent 100%);
	pointer-events: none;
	z-index: 1;
}
.home-hero-right::before { z-index: 2; }
.home-hero-overlay { z-index: 3; }
@media (max-width: 980px) {
	.home-hero-right::after {
		left: 0; right: 0; bottom: auto;
		width: auto; height: 35%;
		background: linear-gradient(180deg, var(--ink) 0%, transparent 100%);
	}
}
/* =====================================================
   v3.5 POLISH — First Team page + Team Page banner
   APPEND to end of site.css (after v3.4 team-data block)
   ===================================================== */

/* ---------- Centred hero variant (used on team data + team pages) ---------- */
.page-hero-centered {
	text-align: center;
}
.page-hero-centered .breadcrumb { display: block; }
.page-hero-centered h1 { margin: 0 auto; }
.page-hero-centered .page-hero-stats {
	justify-content: center;
	max-width: 980px;
	margin-left: auto;
	margin-right: auto;
}
.page-hero-centered .page-hero-deck {
	max-width: 620px;
	margin: 1rem auto 0;
	font-size: 1.05rem;
	color: #bbb;
	line-height: 1.65;
}

/* ---------- Team-data column wrapper (centred 760px reading width) ---------- */
.team-data-column {
	max-width: 760px;
	margin: 0 auto;
}

/* Override v3.4 head styling for tighter, professional look */
.team-data-head h2 {
	font-size: 1.5rem;
	font-family: var(--font-sans);
}

/* ---------- Match list polish ---------- */
.match-list {
	border: 1px solid var(--border);
	background: #f9f9f9;
}
.match-list .match-row {
	background: var(--bg-card);
	padding: .95rem 1.1rem;
	grid-template-columns: 90px 1fr 60px;
}
.match-row:nth-child(even) { background: #fafafa; }
.match-row:hover { background: #f5f5f5; }
.match-date strong { font-size: 12px; }
.match-team { font-size: 13px; }
.match-vs, .match-score { padding: .3rem .55rem; min-width: 48px; }
.match-score { font-size: 14px; }
.match-vs { font-size: 11px; }

/* ---------- League table — bolder, professional ---------- */
.league-table thead th {
	font-weight: 800 !important;
	letter-spacing: .16em !important;
	font-size: 11px !important;
	padding: 1rem .6rem !important;
}
.league-table thead th.lt-pts {
	background: var(--red) !important;
	color: #fff !important;
}
.league-table tbody tr:nth-child(even) { background: #fafafa; }
.league-table tbody td {
	font-weight: 500;
	color: var(--text-muted);
}
.league-table tbody td.lt-team {
	font-weight: 700;
	color: var(--ink);
}

/* BCTFC row — much stronger highlight */
.league-table tbody tr.lt-row-us {
	background: rgba(192, 24, 30, 0.10) !important;
}
.league-table tbody tr.lt-row-us:nth-child(even) {
	background: rgba(192, 24, 30, 0.10) !important;
}
.league-table tbody tr.lt-row-us td {
	color: var(--ink) !important;
	font-weight: 800 !important;
}
.league-table tbody tr.lt-row-us td.lt-pos {
	color: var(--red) !important;
	font-size: 14px !important;
	box-shadow: inset 3px 0 0 0 var(--red);
	position: relative;
}
.league-table tbody tr.lt-row-us td.lt-pos::before {
	content: none;
}
.league-table tbody tr.lt-row-us td.lt-pts {
	color: var(--red) !important;
	font-size: 15px !important;
}

/* ---------- TEAM PAGE TEMPLATE — featured image banner ---------- */
.page-hero-with-image {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	min-height: 360px;
	padding: 5rem 0 4rem;
	display: flex;
	align-items: center;
	position: relative;
}
.page-hero-with-image::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(10,10,10,0) 0%, rgba(10,10,10,0.7) 100%);
	pointer-events: none;
}
.page-hero-with-image .bctfc-wrap {
	position: relative;
	z-index: 2;
	width: 100%;
}
.page-hero-with-image .breadcrumb {
	color: #fff;
	background: rgba(192,24,30,0.85);
	display: inline-block;
	padding: .35rem .8rem;
	border-radius: 99px;
	font-size: 10px;
	letter-spacing: .2em;
}
.page-hero-with-image .breadcrumb a { color: #fff; }
.page-hero-with-image h1 {
	font-size: clamp(2.2rem, 4.6vw, 3.6rem);
	line-height: 1;
	text-shadow: 0 2px 12px rgba(0,0,0,0.4);
	margin-top: 1rem;
}
.page-hero-with-image .page-hero-deck {
	color: #fff;
	max-width: 620px;
	margin: 1rem auto 0;
	font-size: 1.05rem;
	line-height: 1.6;
	text-shadow: 0 1px 8px rgba(0,0,0,0.5);
}

/* Team content — slightly wider reading column for prose pages */
.page-content-team .entry-content {
	max-width: 760px;
	margin: 0 auto;
}

/* ---------- Mobile ---------- */
@media (max-width: 700px) {
	.page-hero-with-image {
		min-height: 240px;
		padding: 3rem 0 2.5rem;
	}
	.page-hero-with-image h1 { font-size: 2rem; }

	.match-list .match-row {
		grid-template-columns: 78px 1fr;
		padding: .8rem .9rem;
	}
	.league-table thead th {
		padding: .7rem .35rem !important;
		font-size: 10px !important;
		letter-spacing: .08em !important;
	}
}
/* =====================================================
   v3.6 — Team page featured image (in content, not banner)
   APPEND to end of site.css
   ===================================================== */

.team-featured-image {
	max-width: 980px;
	margin: 0 auto 2.5rem;
	border-radius: var(--radius);
	overflow: hidden;
	box-shadow: 0 12px 32px rgba(0,0,0,0.10);
	background: var(--ink);
}
.team-featured-image img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
	max-height: 520px;
}

.page-content-team .entry-content {
	max-width: 760px;
	margin: 0 auto;
}

@media (max-width: 700px) {
	.team-featured-image {
		margin-bottom: 1.6rem;
		border-radius: var(--radius-sm);
	}
	.team-featured-image img { max-height: 320px; }
}
/* =====================================================
   v3.7 — Contact form + info card boxes
   APPEND to end of site.css
   ===================================================== */

/* ---------- CONTACT FORM ---------- */
/* Targets the standard WP form structure on the contact page */
.page-content-contact-us .entry-content form,
.page-content-contact-us form.wpforms-form,
.page-content-contact-us .wp-block-group form,
.page-content .contact-form-wrap form {
	max-width: 540px;
	margin: 0 0 2.5rem;
}

/* Labels */
.page-content-contact-us label,
.contact-form-wrap label {
	display: block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--ink);
	margin-bottom: .5rem;
}

/* Inputs / textarea */
.page-content-contact-us input[type="text"],
.page-content-contact-us input[type="email"],
.page-content-contact-us input[type="tel"],
.page-content-contact-us input[type="url"],
.page-content-contact-us textarea,
.page-content-contact-us select,
.contact-form-wrap input[type="text"],
.contact-form-wrap input[type="email"],
.contact-form-wrap textarea {
	width: 100%;
	max-width: 540px;
	padding: .85rem 1rem;
	border: 1px solid var(--border-2);
	border-radius: var(--radius-sm);
	font-size: 15px;
	font-family: inherit;
	background: #fafafa;
	color: var(--ink);
	margin-bottom: 1.4rem;
	transition: all .2s;
	-webkit-appearance: none;
	appearance: none;
}

/* Focus state */
.page-content-contact-us input[type="text"]:focus,
.page-content-contact-us input[type="email"]:focus,
.page-content-contact-us input[type="tel"]:focus,
.page-content-contact-us input[type="url"]:focus,
.page-content-contact-us textarea:focus,
.page-content-contact-us select:focus,
.contact-form-wrap input:focus,
.contact-form-wrap textarea:focus {
	outline: none;
	border-color: var(--red);
	background: #fff;
	box-shadow: 0 0 0 3px rgba(192, 24, 30, 0.12);
}

/* Textarea sizing */
.page-content-contact-us textarea,
.contact-form-wrap textarea {
	min-height: 160px;
	resize: vertical;
	line-height: 1.55;
}

/* Submit button — themed */
.page-content-contact-us input[type="submit"],
.page-content-contact-us button[type="submit"],
.contact-form-wrap input[type="submit"],
.contact-form-wrap button[type="submit"] {
	background: var(--ink);
	color: #fff;
	padding: .85rem 1.6rem;
	border: 0;
	border-radius: var(--radius-sm);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .2s, transform .15s;
	font-family: inherit;
	-webkit-appearance: none;
	appearance: none;
}
.page-content-contact-us input[type="submit"]:hover,
.page-content-contact-us button[type="submit"]:hover,
.contact-form-wrap input[type="submit"]:hover,
.contact-form-wrap button[type="submit"]:hover {
	background: var(--red);
	color: #fff;
}
.page-content-contact-us input[type="submit"]:active,
.page-content-contact-us button[type="submit"]:active {
	transform: translateY(1px);
}

/* Form rows that group inputs side by side (e.g. "Name | Email" on one line) */
.page-content-contact-us .form-row,
.page-content-contact-us .wpforms-field-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
	margin-bottom: 0;
}
@media (max-width: 600px) {
	.page-content-contact-us .form-row,
	.page-content-contact-us .wpforms-field-row {
		grid-template-columns: 1fr;
	}
}

/* ---------- INFO CARDS (red-bordered boxes) ---------- */
.info-card,
.page-content .info-card {
	background: #fef5f5;
	border: 1px solid #fecdd0;
	border-radius: var(--radius-lg);
	padding: 1.4rem 1.6rem;
	margin: 0 0 1rem;
	box-shadow: 0 4px 12px rgba(192, 24, 30, 0.04);
}

.info-card strong:first-child,
.info-card > strong {
	display: block;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .04em;
	color: var(--ink);
	margin-bottom: .4rem;
	text-transform: uppercase;
}

.info-card p {
	font-size: 14px;
	line-height: 1.55;
	color: var(--text-muted);
	margin: 0 0 .4rem;
}
.info-card p:last-child { margin-bottom: 0; }

.info-card a {
	color: var(--red);
	border-bottom: 1px solid var(--red);
	text-decoration: none;
	font-weight: 600;
}
.info-card a:hover {
	color: var(--red-dark);
	border-color: var(--red-dark);
}

/* If the role-holder name is wrapped in <strong> mid-card */
.info-card p strong,
.info-card .role-name {
	display: block;
	color: var(--ink);
	font-weight: 700;
	font-size: 14px;
	margin: .4rem 0 .2rem;
}

/* Stack of info cards with a shared label above them */
.info-cards {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin: 1.4rem 0;
}
/* =====================================================
   v3.8.1 — Footer layout fix (restore original look)
   APPEND to end of site.css
   Targets the v3.8 footer.php structure but applies
   the polish that the old hardcoded footer had baked in.
   ===================================================== */

/* Footer block 1: branding row (logo + name side by side) */
.site-footer .footer-branding {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-bottom: 1.2rem;
}

.site-footer .footer-logo {
	width: 44px;
	height: 44px;
	max-width: 44px;
	max-height: 44px;
	object-fit: contain;
	flex-shrink: 0;
}

.site-footer .footer-branding-text {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.site-footer .footer-branding-text strong {
	display: block;
	font-size: 14px;
	font-weight: 800;
	color: #fff;
	letter-spacing: -.01em;
	line-height: 1.2;
}

.site-footer .footer-branding-text small {
	display: block;
	font-size: 10px;
	font-weight: 700;
	color: var(--red, #C0181E);
	letter-spacing: .18em;
	text-transform: uppercase;
	line-height: 1.3;
}

/* About paragraph */
.site-footer .footer-about-text {
	color: #b8b8b8;
	font-size: 14px;
	line-height: 1.6;
	margin: 0;
}

/* Headings on blocks 2, 3, 4 — red uppercase with letter-spacing */
.site-footer .footer-heading {
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--red, #C0181E);
	margin: 0 0 1rem;
	padding: 0;
	font-family: inherit;
}

/* Menu lists */
.site-footer .footer-menu-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.site-footer .footer-menu-list li {
	margin: 0 0 .55rem;
	padding: 0;
}
.site-footer .footer-menu-list a {
	color: #fff;
	text-decoration: none;
	font-size: 14px;
	transition: color .15s;
}
.site-footer .footer-menu-list a:hover {
	color: var(--red, #C0181E);
}
.site-footer .footer-menu-placeholder {
	color: #888;
	font-size: 12px;
	margin: 0;
}

/* Find Us block paragraphs */
.site-footer .footer-find-us p {
	color: #b8b8b8;
	font-size: 14px;
	line-height: 1.5;
	margin: 0 0 .25rem;
}
.site-footer .footer-find-us p strong {
	color: #fff;
	font-weight: 700;
}
.site-footer .footer-find-us .footer-label {
	margin-top: .9rem;
}
.site-footer .footer-find-us a {
	color: #b8b8b8;
	text-decoration: none;
	transition: color .15s;
}
.site-footer .footer-find-us a:hover {
	color: var(--red, #C0181E);
}

/* Hide the new copyright bar — wasn't in the original layout */
.site-footer .footer-bottom {
	display: none;
}

/* Mobile */
@media (max-width: 700px) {
	.site-footer .footer-branding {
		gap: .8rem;
	}
	.site-footer .footer-logo {
		width: 40px;
		height: 40px;
	}
}

/* =====================================================
   v3.8.2 — Restore bullet/numbered lists in page content
   APPEND to end of site.css
   Only affects content inside articles/page bodies —
   leaves header/footer/sidebar menus alone.
   ===================================================== */

/* Target rich-text content areas */
.entry-content ul,
.page-content ul:not(.footer-menu-list):not(.site-nav ul),
.team-data-intro ul,
.info-card ul {
	list-style: disc;
	padding-left: 1.5rem;
	margin: 0 0 1.2rem;
}

.entry-content ol,
.page-content ol:not(.footer-menu-list):not(.site-nav ol),
.team-data-intro ol,
.info-card ol {
	list-style: decimal;
	padding-left: 1.5rem;
	margin: 0 0 1.2rem;
}

/* Individual list items */
.entry-content li,
.page-content .entry-content li,
.team-data-intro li,
.info-card li {
	margin: 0 0 .4rem;
	line-height: 1.6;
	color: var(--text-muted, #555);
	list-style-position: outside;
}

/* Nested lists */
.entry-content ul ul,
.entry-content ol ol,
.entry-content ul ol,
.entry-content ol ul {
	margin-top: .4rem;
	margin-bottom: .6rem;
}
.entry-content ul ul {
	list-style: circle;
}
.entry-content ul ul ul {
	list-style: square;
}
.entry-content ol ol {
	list-style: lower-alpha;
}
.entry-content ol ol ol {
	list-style: lower-roman;
}

/* Bullet colour — subtle red to fit the theme */
.entry-content ul li::marker {
	color: var(--red, #C0181E);
}
.entry-content ol li::marker {
	color: var(--ink, #0a0a0a);
	font-weight: 700;
}
/* =====================================================
   v3.9 — Mobile burger menu + Junior section upgrades
   APPEND to end of site.css
   ===================================================== */

/* ---------- MOBILE BURGER MENU ---------- */
.site-nav-toggle {
	display: none;
	background: none;
	border: 0;
	padding: 10px;
	cursor: pointer;
	width: 44px;
	height: 44px;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	margin-left: auto;
	-webkit-tap-highlight-color: transparent;
}
.site-nav-toggle-bar {
	display: block;
	width: 24px;
	height: 2px;
	background: #fff;
	border-radius: 2px;
	transition: transform .25s ease, opacity .25s ease;
	transform-origin: center;
}
.site-nav-toggle.is-open .site-nav-toggle-bar:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}
.site-nav-toggle.is-open .site-nav-toggle-bar:nth-child(2) {
	opacity: 0;
}
.site-nav-toggle.is-open .site-nav-toggle-bar:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

.site-header-cta-mobile { display: none; }

/* Lock body scroll when menu open */
body.nav-open { overflow: hidden; }

/* Mobile breakpoint */
@media (max-width: 900px) {
	.site-header-inner {
		flex-wrap: wrap;
		gap: 0;
	}
	.site-header-cta-desktop { display: none; }
	.site-nav-toggle {
		display: flex;
	}

	/* Slide-down nav */
	.site-nav {
		display: none;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: #0a0a0a;
		padding: 6rem 2rem 2rem;
		z-index: 999;
		overflow-y: auto;
	}
	.site-nav.is-open {
		display: block;
	}
	.site-nav ul {
		display: flex;
		flex-direction: column;
		gap: 0;
		margin: 0;
		padding: 0;
		list-style: none;
	}
	.site-nav ul li {
		margin: 0;
		border-bottom: 1px solid rgba(255,255,255,0.1);
	}
	.site-nav ul li a {
		display: block;
		padding: 1.2rem 0;
		color: #fff;
		font-size: 18px;
		font-weight: 700;
		text-decoration: none;
		letter-spacing: .02em;
	}
	.site-nav ul li a:hover {
		color: var(--red, #C0181E);
	}
	.site-header-cta-mobile {
		display: inline-block;
		margin: 2rem 0 0;
		background: var(--red, #C0181E);
		color: #fff;
		padding: 1rem 2rem;
		border-radius: 8px;
		font-weight: 700;
		text-decoration: none;
		text-align: center;
		width: 100%;
		box-sizing: border-box;
	}

	/* Burger toggle stays visible above the open menu */
	.site-nav-toggle {
		position: relative;
		z-index: 1000;
	}
	.site-nav-toggle.is-open .site-nav-toggle-bar {
		background: #fff;
	}
}

/* ---------- JUNIOR SECTION UPGRADES ---------- */

/* Junior card flex layout when image present */
.home-junior-card {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.home-junior-content {
	flex-shrink: 0;
}

/* Image slot — fills the empty space */
.home-junior-image {
	flex: 1;
	min-height: 200px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: var(--radius, 12px);
	margin: 0;
}

/* When NO image, the empty space collapses */
.home-junior-card:not(.has-image) .home-junior-image {
	display: none;
}

/* Buttons row — pushed toward bottom */
.home-junior-ages {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin-top: auto;
}

/* Each button */
.home-junior-age {
	flex: 1 1 auto;
	min-width: 56px;
	padding: .8rem 1rem;
	background: #1a1a1a;
	color: #fff;
	text-align: center;
	text-decoration: none;
	border-radius: 8px;
	font-weight: 800;
	font-size: 14px;
	letter-spacing: .02em;
	transition: background .15s ease, transform .15s ease;
	border: 1px solid rgba(255,255,255,0.06);
}
.home-junior-age:hover {
	background: var(--red, #C0181E);
	color: #fff;
	transform: translateY(-1px);
	border-color: var(--red, #C0181E);
}
.home-junior-age:active {
	transform: translateY(0);
}

/* CTA button — full width at the very bottom */
.home-junior-cta {
	display: block;
	text-align: center;
	padding: 1rem 1.5rem;
	background: var(--red, #C0181E);
	color: #fff;
	text-decoration: none;
	font-weight: 700;
	border-radius: 8px;
	margin-top: 1rem;
	transition: background .15s ease;
}
.home-junior-cta:hover {
	background: var(--red-dark, #8E1115);
	color: #fff;
}

/* Mobile junior section */
@media (max-width: 700px) {
	.home-junior-image {
		min-height: 160px;
	}
	.home-junior-age {
		font-size: 13px;
		padding: .7rem .8rem;
	}
}
/* =====================================================
   v3.9.1 — Fix mobile menu + junior image visibility
   APPEND to end of site.css (after v3.9 block, OR
   replaces the v3.9 mobile/junior CSS block entirely if
   you want to keep things tidy — both approaches work)
   ===================================================== */

/* ---------- HEADER CTA SCOPING ---------- */
/* Default: both CTAs hidden so we can explicitly show each at the right breakpoint */
.site-header-cta-mobile,
.site-header-cta-desktop {
	display: none;
}

/* Desktop: show desktop CTA, hide burger */
@media (min-width: 901px) {
	.site-header-cta-desktop {
		display: inline-flex !important;
		align-items: center;
	}
	.site-nav-toggle {
		display: none !important;
	}
}

/* Mobile: show burger, hide desktop CTA. Mobile CTA only shows when nav open. */
@media (max-width: 900px) {
	.site-header-cta-desktop {
		display: none !important;
	}
	.site-nav-toggle {
		display: flex !important;
	}
	.site-nav.is-open .site-header-cta-mobile {
		display: inline-block !important;
	}
}

/* ---------- JUNIOR IMAGE — ensure visibility ---------- */
.home-junior-card {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.home-junior-content {
	flex-shrink: 0;
}

.home-junior-image {
	display: block;
	width: 100%;
	min-height: 220px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 12px;
	margin: 1.2rem 0;
	flex: 1 1 auto;
}

.home-junior-card:not(.has-image) .home-junior-image {
	display: none;
}

.home-junior-ages {
	margin-top: auto;
}