/* =============================================================
   COACHES — EDUCATION & PATHWAYS — page-coaches-education.css
   --------------------------------------------------------------
   FULL REPLACEMENT FILE (v2).
   Hero + anchor nav now follow the sitewide banner pattern —
   every metric copied 1:1 from .ah-hero / .ah-anchors
   (page-aussie-hoops.css) so banners are pixel-identical in
   height, spacing and layout. Accent: RED (coaches) not orange.
   Includes Basketball Australia co-brand styles (hero lockup +
   framework attribution row).
   All original section styles below are unchanged.
   Depends on coaches-shared.css for: .co-section, .co-shead,
   --co-accent tokens. That file is untouched.
   ============================================================= */

/* -------------------------------------------------------------
   BUTTONS — identical metrics to .ah-btn
   ----------------------------------------------------------- */
.cep-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 15px 28px;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: lowercase;
	text-decoration: none;
	border-radius: 4px;
	border: 1px solid transparent;
	transition: transform 0.2s, background 0.2s, color 0.2s, border-color 0.2s;
	cursor: pointer;
	font-family: inherit;
}
.cep-btn svg { width: 14px; height: 14px; }
.cep-btn--primary {
	background: var(--wba-red);
	color: var(--wba-white);
	border-color: var(--wba-red);
	font-weight: 800;
}
.cep-btn--primary:hover {
	background: var(--wba-white);
	color: var(--wba-red);
	transform: translateY(-2px);
}
.cep-btn--ghost {
	background: transparent;
	color: var(--wba-dark);
	border-color: var(--wba-border);
}
.cep-btn--ghost:hover {
	background: var(--wba-cream);
	border-color: var(--wba-dark);
}

/* =============================================================
   1. HERO — 58vh / min 480px (matches .ah-hero exactly)
   ============================================================= */
.cep-hero {
	position: relative;
	height: 58vh;          /* identical to .ah-hero */
	min-height: 480px;     /* identical to .ah-hero */
	background-size: cover;
	background-position: center 30%;
	background-repeat: no-repeat;
	color: var(--wba-white);
	display: flex;
	align-items: center;
	overflow: hidden;
}
.cep-hero__overlay {
	position: absolute;
	inset: 0;
	background:
		linear-gradient( 105deg, rgba(26,26,26,0.92) 0%, rgba(26,26,26,0.72) 50%, rgba(26,26,26,0.40) 100% ),
		radial-gradient( circle at 78% 50%, rgba(193,39,45,0.32) 0%, transparent 55% );
	z-index: 1;
}
.cep-hero__inner {
	position: relative; z-index: 2;
	max-width: 1240px; margin: 0 auto;
	padding: 0 var(--gutter-d); width: 100%;
}
.cep-hero__eyebrow {
	display: inline-flex; align-items: center; gap: 10px;
	font-size: 0.7rem; font-weight: 700;
	letter-spacing: 0.22em; text-transform: uppercase;
	color: rgba(255,255,255,0.85);
	padding: 9px 18px;
	border: 1px solid rgba(193,39,45,0.55);
	border-radius: 999px;
	margin-bottom: 22px;
	background: rgba(193,39,45,0.10);
}
.cep-hero__eyebrow svg { width: 12px; height: 12px; color: var(--wba-red); }
.cep-hero__headline {
	font-size: clamp(2.6rem, 7.5vw, 6rem);
	font-weight: 800; line-height: 0.95;
	letter-spacing: -0.025em;
	margin: 0 0 18px;
	color: var(--wba-white);
}
.cep-hero__qualifier {
	display: block;
	font-style: italic; font-weight: 300;
	color: var(--wba-red);
	letter-spacing: -0.012em; margin-top: 4px;
}
.cep-hero__tagline {
	max-width: 700px;
	font-size: clamp(1rem, 1.4vw, 1.2rem);
	line-height: 1.5; color: rgba(255,255,255,0.85);
	margin: 0 0 30px;
}
.cep-hero__ctas { display: flex; gap: 14px; flex-wrap: wrap; }
.cep-hero .cep-btn--ghost {
	color: var(--wba-white);
	border-color: rgba(255,255,255,0.4);
}
.cep-hero .cep-btn--ghost:hover {
	background: rgba(255,255,255,0.1);
	border-color: var(--wba-white);
}

/* Basketball Australia co-brand lockup — bottom right of hero.
   Positioned absolutely so it never changes the banner height. */
.cep-hero__ba {
	position: absolute;
	right: var(--gutter-d);
	bottom: 28px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 10px 16px;
	background: rgba(255,255,255,0.94);
	border-radius: 8px;
	text-decoration: none;
	color: var(--wba-dark);
	transition: transform 0.2s, box-shadow 0.2s;
}
.cep-hero__ba:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(0,0,0,0.25);
}
.cep-hero__ba img {
	height: 34px;
	width: auto;
	display: block;
}
.cep-hero__ba-text {
	display: flex;
	flex-direction: column;
	line-height: 1.25;
}
.cep-hero__ba-text strong {
	font-size: 0.7rem;
	font-weight: 800;
	letter-spacing: 0.02em;
}
.cep-hero__ba-text small {
	font-size: 0.56rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: lowercase;
	color: var(--wba-muted);
}

/* =============================================================
   2. STICKY ANCHOR NAV — small caps, red (matches .ah-anchors)
   ============================================================= */
.cep-anchors {
	position: sticky; top: 0; z-index: 30;
	background: var(--wba-white);
	border-bottom: 1px solid var(--wba-border);
	border-top: 3px solid var(--wba-red);
}
.cep-anchors__inner {
	max-width: 1240px; margin: 0 auto;
	padding: 0 var(--gutter-d);
	display: flex; gap: 28px;
	overflow-x: auto; scrollbar-width: none;
	align-items: center;
}
.cep-anchors__inner::-webkit-scrollbar { display: none; }
.cep-anchors__inner a {
	position: relative;
	padding: 18px 2px;
	font-size: 0.72rem; font-weight: 700;
	letter-spacing: 0.14em; text-transform: lowercase;
	color: var(--wba-dark); text-decoration: none;
	white-space: nowrap; transition: color 0.2s;
}
.cep-anchors__inner a:not(.is-cta)::after {
	content: ""; position: absolute;
	left: 0; right: 0; bottom: -1px; height: 2px;
	background: var(--wba-red);
	transform: scaleX(0); transform-origin: left;
	transition: transform 0.25s;
}
.cep-anchors__inner a:not(.is-cta):hover { color: var(--wba-red); }
.cep-anchors__inner a:not(.is-cta):hover::after { transform: scaleX(1); }
.cep-anchors__inner a.is-cta {
	margin-left: auto;
	padding: 9px 18px;
	background: var(--wba-red); color: var(--wba-white);
	border-radius: 4px; font-weight: 800;
	transition: background 0.2s, transform 0.2s;
}
.cep-anchors__inner a.is-cta:hover {
	background: var(--wba-dark); color: var(--wba-white);
	transform: translateY(-1px);
}

/* =============================================================
   3. THE FRAMEWORK
   ============================================================= */
.cep-framework__body { font-size: 1.06rem; line-height: 1.75; color: var(--wba-dark); max-width: 760px; margin: 0 0 28px; }
.cep-framework__notes { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; max-width: 760px; }
.cep-framework__notes li {
	position: relative; padding: 16px 18px 16px 44px;
	background: var(--co-accent-soft); border: 1px solid var(--wba-border);
	border-left: 3px solid var(--co-accent); border-radius: 12px;
	font-size: 0.93rem; line-height: 1.55;
}
.cep-framework__notes li::before {
	content: "→"; position: absolute; left: 18px; top: 15px; color: var(--co-accent); font-weight: 700;
}

/* Basketball Australia attribution — national framework credit */
.cep-framework__ba {
	display: flex;
	align-items: center;
	gap: 22px;
	margin-top: 34px;
	max-width: 760px;
	padding: 20px 24px;
	border: 1px solid var(--wba-border);
	border-left: 3px solid var(--co-accent);
	border-radius: 8px;
	background: var(--wba-cream);
}
.cep-framework__ba img {
	height: 52px;
	width: auto;
	flex-shrink: 0;
	display: block;
}
.cep-framework__ba p {
	margin: 0;
	font-size: 0.88rem;
	line-height: 1.6;
	color: var(--wba-dark);
}

/* =============================================================
   4. THE 5 PATHWAYS
   ============================================================= */
.cep-paths { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 700px) { .cep-paths { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1040px) { .cep-paths { grid-template-columns: repeat(3, 1fr); } }
.cep-paths__card {
	position: relative; background: var(--wba-white); border: 1px solid var(--wba-border);
	border-radius: 14px; padding: 28px 24px 24px; overflow: hidden;
}
.cep-paths__num {
	position: absolute; top: -6px; right: 10px;
	font-size: 3.4rem; font-weight: 800; line-height: 1; color: var(--co-accent-soft); letter-spacing: -0.03em;
}
.cep-paths__head { position: relative; z-index: 1; margin-bottom: 14px; }
.cep-paths__name { font-size: 1.18rem; font-weight: 800; margin: 0 0 4px; letter-spacing: -0.01em; }
.cep-paths__was { font-size: 0.68rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wba-muted); }
.cep-paths__for { font-size: 0.88rem; line-height: 1.55; margin: 0 0 10px; }
.cep-paths__for strong { color: var(--co-accent); font-weight: 700; }
.cep-paths__desc { font-size: 0.88rem; line-height: 1.6; color: var(--wba-muted); margin: 0 0 14px; }
.cep-paths__tiers {
	display: inline-flex; align-items: center; gap: 7px;
	font-size: 0.66rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
	color: var(--co-accent); background: var(--co-accent-soft);
	padding: 6px 12px; border-radius: 999px;
}

/* =============================================================
   5. COACH DEVELOPMENT POINTS
   ============================================================= */
.cep-points { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 40px; }
@media (min-width: 880px) { .cep-points { grid-template-columns: repeat(4, 1fr); } }
.cep-points__card {
	background: var(--wba-cream); border: 1px solid var(--wba-border);
	border-radius: 14px; padding: 26px 20px; text-align: center;
}
.cep-points__pts { display: block; font-size: 2.1rem; font-weight: 800; line-height: 1; color: var(--co-accent); letter-spacing: -0.02em; }
.cep-points__ptslabel { display: block; font-size: 0.64rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wba-muted); margin: 6px 0 14px; }
.cep-points__title { font-size: 1rem; font-weight: 800; margin: 0 0 6px; }
.cep-points__desc { font-size: 0.84rem; line-height: 1.5; color: var(--wba-muted); margin: 0; }

/* BRONZE / SILVER / GOLD LADDER */
.cep-ladder { display: flex; flex-direction: column; gap: 12px; align-items: stretch; }
.cep-ladder__step {
	flex: 1; background: var(--wba-white); border: 1px solid var(--wba-border);
	border-top: 3px solid var(--wba-muted); border-radius: 14px; padding: 22px 22px;
}
.cep-ladder__step--bronze { border-top-color: #b87333; }
.cep-ladder__step--silver { border-top-color: #9aa0a6; }
.cep-ladder__step--gold   { border-top-color: #d4a73a; }
.cep-ladder__tier { display: block; font-size: 1.05rem; font-weight: 800; letter-spacing: 0.02em; margin-bottom: 5px; }
.cep-ladder__step--bronze .cep-ladder__tier { color: #b87333; }
.cep-ladder__step--silver .cep-ladder__tier { color: #7d8388; }
.cep-ladder__step--gold .cep-ladder__tier { color: #c79a2e; }
.cep-ladder__desc { font-size: 0.86rem; line-height: 1.5; color: var(--wba-muted); margin: 0; }
.cep-ladder__arrow { display: none; }
@media (min-width: 760px) {
	.cep-ladder { flex-direction: row; align-items: center; }
	.cep-ladder__arrow { display: inline-flex; color: var(--wba-muted); font-size: 1.1rem; }
}

/* =============================================================
   6. GET ACCREDITED — STEPS
   ============================================================= */
.cep-steps { list-style: none; counter-reset: cepstep; padding: 0; margin: 0; display: grid; gap: 14px; }
.cep-steps__item {
	display: flex; gap: 18px; align-items: flex-start;
	background: var(--wba-white); border: 1px solid var(--wba-border);
	border-radius: 14px; padding: 22px 22px;
}
.cep-steps__num {
	flex-shrink: 0; display: inline-flex; width: 40px; height: 40px;
	align-items: center; justify-content: center; border-radius: 50%;
	background: var(--co-accent); color: var(--wba-white); font-size: 1.05rem; font-weight: 800;
}
.cep-steps__title { font-size: 1.08rem; font-weight: 800; margin: 4px 0 6px; }
.cep-steps__desc { font-size: 0.9rem; line-height: 1.6; color: var(--wba-muted); margin: 0; }

/* =============================================================
   7. WHAT'S REQUIRED (dark table)
   ============================================================= */
.cep-req-table { display: grid; gap: 1px; background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.12); border-radius: 14px; overflow: hidden; }
.cep-req-row { display: grid; grid-template-columns: 1fr; gap: 6px; background: #232323; padding: 22px 22px; }
.cep-req-row__level { font-size: 1.02rem; font-weight: 800; color: var(--wba-white); }
.cep-req-row__need { display: inline-flex; align-items: center; gap: 8px; font-size: 0.9rem; font-weight: 600; color: var(--wba-orange); }
.cep-req-row__note { font-size: 0.84rem; line-height: 1.5; color: rgba(255,255,255,0.6); }
@media (min-width: 820px) {
	.cep-req-row { grid-template-columns: 1.1fr 1.4fr 1.3fr; align-items: center; gap: 20px; }
}
.cep-req-foot { margin: 18px 0 0; font-size: 0.82rem; color: rgba(255,255,255,0.55); font-style: italic; }

/* =============================================================
   8. HOW WBA HELPS
   ============================================================= */
.cep-support__body { font-size: 1.04rem; line-height: 1.75; color: var(--wba-dark); max-width: 720px; margin: 0 0 28px; }
.cep-support__links { display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 760px) { .cep-support__links { grid-template-columns: 1fr 1fr; } }
.cep-support__link {
	display: block; background: var(--wba-cream); border: 1px solid var(--wba-border);
	border-left: 3px solid var(--co-accent); border-radius: 12px; padding: 22px 22px;
	text-decoration: none; color: var(--wba-dark); transition: transform 0.16s ease;
}
.cep-support__link:hover { transform: translateY(-2px); }
.cep-support__linklabel { display: block; font-size: 1.02rem; font-weight: 800; margin-bottom: 6px; }
.cep-support__linklabel svg { color: var(--co-accent); }
.cep-support__linkdesc { display: block; font-size: 0.88rem; line-height: 1.5; color: var(--wba-muted); }

/* =============================================================
   9. FAQ ACCORDION
   ============================================================= */
.cep-faq { display: grid; gap: 12px; max-width: 820px; }
.cep-faq__item { background: var(--wba-white); border: 1px solid var(--wba-border); border-radius: 12px; overflow: hidden; }
.cep-faq__q {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
	padding: 20px 22px; cursor: pointer; list-style: none;
	font-size: 1rem; font-weight: 700; color: var(--wba-dark);
}
.cep-faq__q::-webkit-details-marker { display: none; }
.cep-faq__marker { position: relative; flex-shrink: 0; width: 16px; height: 16px; }
.cep-faq__marker::before,
.cep-faq__marker::after {
	content: ""; position: absolute; background: var(--co-accent); transition: transform 0.2s ease;
}
.cep-faq__marker::before { top: 7px; left: 0; width: 16px; height: 2px; }
.cep-faq__marker::after { top: 0; left: 7px; width: 2px; height: 16px; }
.cep-faq__item[open] .cep-faq__marker::after { transform: scaleY(0); }
.cep-faq__a { padding: 0 22px 22px; }
.cep-faq__a p { margin: 0; font-size: 0.93rem; line-height: 1.65; color: var(--wba-muted); }

/* =============================================================
   10. RESOURCES CARDS
   ============================================================= */
.cep-resources { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 760px) { .cep-resources { grid-template-columns: repeat(3, 1fr); } }
.cep-resources__card {
	background: var(--wba-white); border: 1px solid var(--wba-border);
	border-top: 3px solid var(--co-accent); border-radius: 14px; padding: 26px 22px;
	text-decoration: none; color: var(--wba-dark); transition: transform 0.16s ease, box-shadow 0.16s ease;
}
.cep-resources__card:hover { transform: translateY(-3px); box-shadow: 0 16px 36px rgba(26,26,26,0.08); }
.cep-resources__icon {
	display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center;
	border-radius: 11px; background: var(--co-accent-soft); color: var(--co-accent); font-size: 1.15rem; margin-bottom: 14px;
}
.cep-resources__card h3 { font-size: 1.05rem; font-weight: 800; margin: 0 0 6px; }
.cep-resources__card p { font-size: 0.86rem; line-height: 1.5; color: var(--wba-muted); margin: 0; word-break: break-word; }

/* =============================================================
   RESPONSIVE — matches .ah-hero / .ah-anchors breakpoint values
   ============================================================= */
@media (max-width: 720px) {
	.cep-hero { min-height: 440px; }   /* identical to .ah-hero */
	.cep-hero__inner { padding: 0 var(--gutter-m); }
	.cep-hero__ctas { flex-direction: column; align-items: stretch; }
	.cep-btn { justify-content: center; }
	.cep-anchors__inner { padding: 0 var(--gutter-m); gap: 22px; }
	.cep-anchors__inner a.is-cta { margin-left: 0; }

	/* BA lockup compacts on mobile so it never collides with CTAs */
	.cep-hero__ba {
		right: var(--gutter-m);
		bottom: 14px;
		padding: 8px 12px;
		gap: 10px;
	}
	.cep-hero__ba img { height: 26px; }
	.cep-hero__ba-text small { display: none; }

	.cep-framework__ba { flex-direction: column; align-items: flex-start; gap: 14px; }
}
