/* a4c-phero — program-page hero: eyebrow, one H1, one sentence, three checks, format chips,
   one primary CTA + refund line, and one media item (video with poster) with a caption.
   Selectors start at .ibt-kit-4 .a4c-phero so they beat ibt-landing.css's `.ibt-kit-4 h1/p/ul`. */

.a4c-hero.a4c-phero { padding: 36px 0 72px; }

.a4c-phero .a4c-phero__grid {
	grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
	gap: 56px;
	align-items: center;
}

/* explicit vertical rhythm instead of the flow layout's block gap */
.ibt-kit-4 .a4c-phero .a4c-phero__copy > * { margin-block: 0; }
.ibt-kit-4 .a4c-phero .a4c-phero__copy > * + * { margin-block-start: 22px; }
.ibt-kit-4 .a4c-phero .a4c-phero__copy > .a4c-phero__title { margin-block-start: 14px; }
.ibt-kit-4 .a4c-phero .a4c-phero__copy > .a4c-phero__sub { margin-block-start: 16px; }
.ibt-kit-4 .a4c-phero .a4c-phero__copy > .a4c-phero__cta { margin-block-start: 30px; }
.ibt-kit-4 .a4c-phero .a4c-phero__copy > .a4c-phero__micro { margin-block-start: 14px; }

.ibt-kit-4 .a4c-phero p.a4c-eyebrow {
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.5;
	color: var(--wp--preset--color--ink-soft);
}

.ibt-kit-4 .a4c-phero h1.a4c-phero__title {
	font-size: clamp(2.25rem, 1.35rem + 2.9vw, 3.6rem);
	line-height: 1.22;
	font-weight: 800;
	color: var(--wp--preset--color--ink);
	text-wrap: balance;
}

.ibt-kit-4 .a4c-phero p.a4c-phero__sub {
	max-width: 34em;
	font-size: 1.25rem;
	line-height: 1.8;
	font-weight: 400;
	color: #3c4d5a;
}
.ibt-kit-4 .a4c-phero p.a4c-phero__sub strong { color: var(--wp--preset--color--ink); font-weight: 700; }

.ibt-kit-4 .a4c-phero ul.a4c-phero__checks {
	display: grid;
	gap: 10px;
	padding: 0;
	list-style: none;
}
.ibt-kit-4 .a4c-phero ul.a4c-phero__checks li {
	position: relative;
	padding-inline-start: 34px;
	font-size: 1.1rem;
	line-height: 1.6;
	font-weight: 500;
	color: var(--wp--preset--color--ink);
}
.ibt-kit-4 .a4c-phero ul.a4c-phero__checks li::before {
	content: "✓";
	position: absolute;
	inset-inline-start: 0;
	top: .15em;
	width: 24px;
	height: 24px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--wp--preset--color--sea-pale);
	color: var(--wp--preset--color--ink-soft);
	font-size: .8rem;
	font-weight: 800;
	line-height: 1;
}

.ibt-kit-4 .a4c-phero p.a4c-phero__facts {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	font-size: .95rem;
	line-height: 1.4;
}
.a4c-phero .a4c-phero__facts span {
	padding: 7px 14px;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 999px;
	background: #fff;
	color: var(--wp--preset--color--ink-soft);
	font-weight: 600;
}

.ibt-kit-4 .a4c-phero p.a4c-phero__cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}
.a4c-phero .a4c-phero__cta a.a4c-btn-coral {
	padding: 17px 34px;
	font-size: 1.15rem;
	box-shadow: 0 12px 26px rgba(217, 127, 42, .28);
	transition: transform .2s ease, box-shadow .2s ease;
}
.a4c-phero .a4c-phero__cta a.a4c-btn-coral:hover,
.a4c-phero .a4c-phero__cta a.a4c-btn-coral:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 16px 30px rgba(217, 127, 42, .34);
}
.a4c-phero .a4c-phero__cta a.a4c-btn-outline {
	padding: 15px 26px;
	border: 2px solid rgba(23, 59, 90, .22);
	font-size: 1.05rem;
}
.a4c-phero .a4c-phero__cta a.a4c-btn-outline:hover,
.a4c-phero .a4c-phero__cta a.a4c-btn-outline:focus-visible { border-color: var(--wp--preset--color--ink); }

.ibt-kit-4 .a4c-phero p.a4c-phero__micro {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: .95rem;
	line-height: 1.6;
	font-weight: 400;
	color: #4b5d6b;
}
.a4c-phero .a4c-phero__micro::before { content: "✓"; color: #2e7d4f; font-weight: 800; }

/* media: one video card with a soft offset backdrop */
.a4c-phero .a4c-phero__media { position: relative; isolation: isolate; }
.a4c-phero .a4c-phero__media::before {
	content: "";
	position: absolute;
	inset-block: 18px -18px;
	inset-inline: -18px 18px;
	z-index: -1;
	border-radius: 26px;
	background: var(--wp--preset--color--sea-pale);
}
.a4c-phero .a4c-phero__media .wp-block-embed {
	margin: 0;
	border-radius: 20px;
	overflow: hidden;
	box-shadow: 0 24px 60px rgba(23, 59, 90, .18);
}
.ibt-kit-4 .a4c-phero p.a4c-phero__caption {
	margin-block-start: 30px;
	text-align: center;
	font-size: .95rem;
	line-height: 1.6;
	font-weight: 400;
	color: var(--wp--preset--color--ink-soft);
}
.ibt-kit-4 .a4c-phero p.a4c-phero__caption strong { color: var(--wp--preset--color--ink); font-weight: 700; }

@media (max-width: 900px) {
	.a4c-hero.a4c-phero { padding: 24px 0 56px; }
	.a4c-phero .a4c-phero__grid { grid-template-columns: 1fr; gap: 40px; }
	.a4c-phero .a4c-phero__media { width: 100%; max-width: 560px; margin-inline: auto; }
	.a4c-phero .a4c-phero__media::before { inset-block: 10px -10px; inset-inline: -10px 10px; }
}
@media (max-width: 600px) {
	.ibt-kit-4 .a4c-phero p.a4c-eyebrow { font-size: .9rem; }
	.ibt-kit-4 .a4c-phero p.a4c-phero__sub { font-size: 1.1rem; line-height: 1.75; }
	.ibt-kit-4 .a4c-phero ul.a4c-phero__checks li { font-size: 1.02rem; }
	.ibt-kit-4 .a4c-phero .a4c-phero__copy > * + * { margin-block-start: 18px; }
	.ibt-kit-4 .a4c-phero .a4c-phero__copy > .a4c-phero__cta { margin-block-start: 24px; }
	.a4c-phero .a4c-phero__facts span { padding: 6px 12px; font-size: .88rem; }
	.a4c-phero .a4c-phero__cta a { flex: 1 1 100%; }
	/* phones: the CTA comes right after the checks; the format chips follow the refund line */
	.ibt-kit-4 .a4c-phero .a4c-phero__copy { display: flex; flex-direction: column; }
	.ibt-kit-4 .a4c-phero .a4c-phero__copy > .a4c-phero__facts { order: 1; }
	.ibt-kit-4 .a4c-phero .a4c-phero__copy > .a4c-phero__cta { margin-block-start: 22px; }
	.ibt-kit-4 .a4c-phero ul.a4c-phero__checks { gap: 8px; }
}
@media (prefers-reduced-motion: reduce) {
	.a4c-phero .a4c-phero__cta a.a4c-btn-coral { transition: none; }
}

/* =====================================================================
   a4c-ppage — program-page design system (whole page, not just the hero).
   One header style, one type scale, one card style, one CTA colour, and an
   alternating section rhythm. Scoped to the page wrapper's .a4c-ppage class.
   Paragraph rules use p:not([class]) so plugin output (cohort cards, pricing
   amounts, badges) keeps its own sizes.
   ===================================================================== */
.a4c-ppage {
	--pp-ink: var(--wp--preset--color--ink);
	--pp-body: #3c4d5a;
	--pp-line: var(--wp--preset--color--line);
	--pp-coral: var(--wp--preset--color--coral);
}
.a4c-ppage .a4c-section-pad { padding: clamp(56px, 7vw, 96px) 0; }

/* type scale */
.ibt-kit-4.a4c-ppage h2 {
	font-size: clamp(1.85rem, 1.25rem + 1.9vw, 2.6rem);
	line-height: 1.3;
	font-weight: 800;
	color: var(--pp-ink);
	text-wrap: balance;
}
.ibt-kit-4.a4c-ppage h3 { font-size: 1.2rem; line-height: 1.5; font-weight: 800; color: var(--pp-ink); }
.ibt-kit-4.a4c-ppage p:not([class]) { font-size: 1.08rem; line-height: 1.85; font-weight: 400; color: var(--pp-body); }
.ibt-kit-4.a4c-ppage p.a4c-eyebrow { font-size: 1rem; font-weight: 700; letter-spacing: 0; line-height: 1.5; color: var(--wp--preset--color--ink-soft); }

/* section header: one column (was heading right / intro floating left) */
.a4c-ppage .a4c-section-header { display: block; max-width: 780px; margin-bottom: 40px; }
.a4c-ppage .a4c-section-header > *,
.a4c-ppage .a4c-section-header > div > * { margin-block: 0; }
.a4c-ppage .a4c-section-header > * + *,
.a4c-ppage .a4c-section-header > div > * + * { margin-block-start: 12px; }
.ibt-kit-4.a4c-ppage .a4c-section-header h2 { max-width: none; }
.ibt-kit-4.a4c-ppage .a4c-section-header p:not(.a4c-eyebrow) { max-width: 40em; font-size: 1.12rem; line-height: 1.85; font-weight: 400; color: var(--pp-body); }

/* cards: tight internal rhythm, soft lift */
.a4c-ppage .a4c-card {
	background: #fff;
	border: 1px solid var(--pp-line);
	border-radius: 20px;
	padding: 28px;
	box-shadow: 0 10px 30px rgba(23, 59, 90, .06);
}
.a4c-ppage .a4c-card > * { margin-block: 0; }
.a4c-ppage .a4c-card > * + * { margin-block-start: 10px; }
.ibt-kit-4.a4c-ppage .a4c-card p:not([class]) { font-size: 1rem; line-height: 1.8; }

/* pain: coral accent cards + one bridge line */
.a4c-ppage .a4c-pp-pain .a4c-card { border-top: 4px solid var(--pp-coral); }
.a4c-ppage .a4c-pp-bridge {
	margin-top: 32px;
	padding: 26px 30px;
	border-radius: 20px;
	background: #fff;
	border-inline-start: 5px solid var(--pp-coral);
}
.a4c-ppage .a4c-pp-bridge > * { margin-block: 0; }
.a4c-ppage .a4c-pp-bridge > * + * { margin-block-start: 12px; }
.ibt-kit-4.a4c-ppage .a4c-pp-bridge p:first-child { font-size: 1.15rem; font-weight: 600; color: var(--pp-ink); }

/* how it works: three numbered steps + dark outcomes panel */
.a4c-ppage .a4c-pp-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.a4c-ppage .a4c-pp-step { position: relative; padding: 28px; border-radius: 20px; background: #f4f8fb; border: 1px solid #e1eaf1; }
.a4c-ppage .a4c-pp-step > * { margin-block: 0; }
.a4c-ppage .a4c-pp-step > * + * { margin-block-start: 10px; }
.a4c-ppage .a4c-pp-step:not(:last-child)::after {
	content: "←";
	position: absolute;
	inset-inline-end: -20px;
	top: 40px;
	z-index: 1;
	color: var(--pp-coral);
	font-size: 1.3rem;
	font-weight: 800;
}
.ibt-kit-4.a4c-ppage p.a4c-pp-step__num {
	width: 46px;
	height: 46px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--pp-coral);
	color: #fff;
	font-size: 1.25rem;
	font-weight: 800;
	line-height: 1;
}
.ibt-kit-4.a4c-ppage p.a4c-pp-step__when {
	display: inline-block;
	margin-block-start: 16px;
	padding: 4px 12px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid #d5e2ec;
	color: var(--wp--preset--color--ink-soft);
	font-size: .85rem;
	font-weight: 700;
	line-height: 1.6;
}
.ibt-kit-4.a4c-ppage .a4c-pp-step p:not([class]) { font-size: 1rem; line-height: 1.8; }

.a4c-ppage .a4c-pp-outcomes {
	margin-top: 28px;
	padding: 36px 40px;
	border-radius: 24px;
	background: var(--pp-ink);
}
.a4c-ppage .a4c-pp-outcomes > * { margin-block: 0; }
.ibt-kit-4.a4c-ppage .a4c-pp-outcomes h3 { color: #fff; font-size: 1.35rem; }
.ibt-kit-4.a4c-ppage ul.a4c-pp-checks {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px 32px;
	margin: 20px 0 0;
	padding: 0;
	list-style: none;
}
.ibt-kit-4.a4c-ppage ul.a4c-pp-checks li {
	position: relative;
	padding-inline-start: 34px;
	color: #e8f0f6;
	font-size: 1.05rem;
	line-height: 1.7;
}
.ibt-kit-4.a4c-ppage ul.a4c-pp-checks li::before {
	content: "✓";
	position: absolute;
	inset-inline-start: 0;
	top: .2em;
	width: 24px;
	height: 24px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--pp-coral);
	color: #fff;
	font-size: .8rem;
	font-weight: 800;
	line-height: 1;
}
.ibt-kit-4.a4c-ppage p.a4c-pp-cta { margin-top: 28px; }
.a4c-ppage .a4c-pp-cta a.a4c-btn-coral,
.a4c-ppage .a4c-cta-band a.a4c-btn-coral { padding: 17px 34px; font-size: 1.12rem; box-shadow: 0 12px 26px rgba(217, 127, 42, .3); }

/* curriculum: white accordion card on the tint section, readable lists */
.a4c-ppage .a4c-curriculum { padding: 6px 28px; border: 1px solid var(--pp-line); border-radius: 20px; background: #fff; }
.a4c-ppage .a4c-curriculum details:last-child { border-bottom: 0; }
.ibt-kit-4.a4c-ppage .a4c-curriculum li { font-size: 1rem; line-height: 1.7; font-weight: 400; color: var(--pp-body); }
.ibt-kit-4.a4c-ppage .a4c-curriculum details p:not([class]) { font-size: 1.02rem; }
.a4c-ppage .a4c-curriculum details > *:not(summary) { margin-block: 0 14px; }

/* founder: photo column top-aligned (sticky on desktop) with the quote under it */
.a4c-ppage .a4c-trainer-bio { grid-template-columns: 38% 1fr; gap: 48px; align-items: start; }
.a4c-ppage .a4c-trainer-bio__photo { position: sticky; top: 150px; }
.a4c-ppage .a4c-trainer-bio__photo .a4c-quote { margin-top: 20px; padding: 24px 26px; background: #fff; border-radius: 20px; }
.ibt-kit-4.a4c-ppage .a4c-trainer-bio__photo .a4c-quote p { font-size: 1.15rem; line-height: 1.7; font-weight: 700; color: var(--pp-ink); }
.a4c-ppage .a4c-trainer-bio > div:last-child > * { margin-block: 0; }
.a4c-ppage .a4c-trainer-bio > div:last-child > * + * { margin-block-start: 14px; }
.a4c-ppage .a4c-trainer-bio__badges li {
	padding: 4px 12px;
	border: 1px solid var(--pp-line);
	border-radius: 999px;
	background: #fff;
	color: var(--wp--preset--color--ink-soft);
	font-size: .8rem;
}

/* price: equal-height boxes, one full-width coral CTA */
.a4c-ppage .a4c-pricing-box-grid:has(> .a4c-pricing-box:nth-child(2):last-child) {
	grid-template-columns: repeat(2, minmax(0, 470px));
	align-items: stretch;
}
.a4c-ppage .a4c-pricing-box .wp-block-buttons { display: block; margin-top: auto; }
.a4c-ppage .a4c-pricing-box .wp-block-button { width: 100%; }
.a4c-ppage .a4c-pricing-box .wp-block-button__link {
	display: block;
	width: 100%;
	padding: 16px 24px;
	border-radius: 999px;
	background: var(--pp-coral);
	font-size: 1.12rem;
	font-weight: 800;
	text-align: center;
	box-shadow: 0 12px 26px rgba(217, 127, 42, .3);
}

/* section backgrounds: paper / white / tint rhythm */
.a4c-ppage #adhd-faq { background: var(--wp--preset--color--paper); }
.a4c-ppage .a4c-pp-free,
.a4c-ppage .a4c-pp-free .a4c-free-offer { background: #fff; }

/* final CTA: centred, navy, price + refund */
.a4c-ppage .a4c-cta-band { display: block; text-align: center; background: var(--pp-ink); }
.a4c-ppage .a4c-cta-band .a4c-shell > * { margin-inline: auto; max-width: 760px; }
.a4c-ppage .a4c-cta-band .a4c-shell > * + * { margin-block-start: 18px; }
.ibt-kit-4.a4c-ppage .a4c-cta-band p.a4c-pp-cta-micro { font-size: .95rem; }

@media (max-width: 900px) {
	.a4c-ppage .a4c-pp-steps { grid-template-columns: 1fr; gap: 16px; }
	.a4c-ppage .a4c-pp-step:not(:last-child)::after { display: none; }
	.ibt-kit-4.a4c-ppage ul.a4c-pp-checks { grid-template-columns: 1fr; }
	.a4c-ppage .a4c-pp-outcomes { padding: 28px 22px; }
	.a4c-ppage .a4c-trainer-bio { grid-template-columns: 1fr; gap: 28px; }
	.a4c-ppage .a4c-trainer-bio__photo { position: static; }
	.a4c-ppage .a4c-pricing-box-grid:has(> .a4c-pricing-box:nth-child(2):last-child) { grid-template-columns: 1fr; }
	.a4c-ppage .a4c-curriculum { padding: 4px 18px; }
}
@media (max-width: 600px) {
	.ibt-kit-4.a4c-ppage p:not([class]) { font-size: 1.02rem; }
	.a4c-ppage .a4c-card, .a4c-ppage .a4c-pp-step { padding: 22px; }
	.a4c-ppage .a4c-pp-bridge { padding: 22px; }
	.a4c-ppage .a4c-pp-cta a.a4c-btn-coral, .a4c-ppage .a4c-cta-band a.a4c-btn-coral { display: flex; width: 100%; }
}

/* grid children: the flow layout's block-gap margin pushed every card after the first down */
.a4c-ppage .a4c-pp-steps > *,
.a4c-ppage .a4c-cards > *,
.a4c-ppage .a4c-pricing-box-grid > *,
.a4c-ppage .a4c-free-offer-grid > * { margin-block: 0; }
.a4c-ppage .a4c-pp-free .a4c-free-offer-grid > div:last-child > * { margin-block: 0; }
.a4c-ppage .a4c-pp-free .a4c-free-offer-grid > div:last-child > * + * { margin-block-start: 14px; }
.ibt-kit-4.a4c-ppage .a4c-pricing-box li { font-size: 1rem; line-height: 1.7; }
.ibt-kit-4.a4c-ppage .a4c-trainer-bio p.has-xx-large-font-size { font-weight: 800; color: var(--pp-ink); }

/* ibt-landing.css reserves 70px under the kit on phones for the old fixed buy bar, which is disabled
   site-wide — it showed as a white strip between the final CTA band and the footer */
.ibt-kit.a4c-ppage { padding-bottom: 0; }

/* live price from [aba_booking_price] (WooCommerce + Multi Currency markup): keep it on one line,
   currency label smaller than the number */
.a4c-live-price { white-space: nowrap; }
.a4c-live-price .woocommerce-Price-currencySymbol { font-size: .82em; }
.a4c-pricing-box__amount.a4c-live-price { display: inline-block; direction: rtl; }
.a4c-pricing-box__amount.a4c-live-price .woocommerce-Price-currencySymbol { font-size: .42em; font-weight: 700; }
/* price pill inside CTA buttons; the button wraps it under the label when space runs out */
.a4c-ppage a.a4c-btn-coral { flex-wrap: wrap; row-gap: 6px; text-align: center; }
.a4c-ppage a.a4c-btn-coral .a4c-live-price {
	padding: 2px 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .2);
	font-size: .9em;
	line-height: 1.6;
}

/* English (left-to-right) program pages, e.g. /en/understanding-adhd-21d/: the step arrows point the
   reading direction, and the big live price keeps its normal order ("$56", not "56$"). */
html:not([dir="rtl"]) .a4c-ppage .a4c-pp-step:not(:last-child)::after { content: "→"; }
html:not([dir="rtl"]) .a4c-pricing-box__amount.a4c-live-price { direction: ltr; }

/* media can also be a photo (e.g. the English ADHD page): same card as the video */
.a4c-phero .a4c-phero__media .wp-block-image {
	margin: 0;
	border-radius: 20px;
	overflow: hidden;
	box-shadow: 0 24px 60px rgba(23, 59, 90, .18);
}
.a4c-phero .a4c-phero__media .wp-block-image img { display: block; width: 100%; height: auto; }

/* Videos whose title card has the title in the middle (e.g. the free ADHD course sample):
   opt-in class on the media wrapper moves the play button below the title. */
.a4c-video-play-low .a4c-yt-play { top: auto; bottom: 12%; transform: translateX(-50%); }
