﻿/* ==========================================================================
   EWS Theme - Main Stylesheet
   ========================================================================== */

:root {
	--font-base: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--font-script: 'Caveat', cursive;
	--navy: #101f4d;
	--navy-dark: #0a1436;
	--green: #17a34a;
	--orange: #f2701b;
	--purple: #7c3aed;
	--purple-dark: #241a52;
	--sky: #2f8fd6;
	--maroon: #8b1e32;
	--pink: #ec4899;
	--teal: #0d9488;
	--bg-soft: #f6f7fb;
	--bg-soft-2: #eef0fa;
	--border: #e6e8f0;
	--text: #131a2e;
	--text-muted: #667085;
	--radius: 14px;
	--container: 1240px;

	/* Type scale — every font-size in this file maps to one of these steps.
	   Keeps text hierarchy consistent instead of dozens of one-off values. */
	--fs-3xs: 10px;
	--fs-2xs: 11px;
	--fs-xs: 12px;
	--fs-sm: 13.5px;
	--fs-base: 14.5px;
	--fs-md: 15.5px;
	--fs-lg: 18px;
	--fs-xl: 22px;
	--fs-2xl: 26px;
	--fs-3xl: 28px;

	/* Text-on-dark-background tokens — two consistent levels instead of
	   several arbitrary opacity values (0.7/0.75/0.85 scattered before). */
	--white-muted: rgba(255, 255, 255, 0.72);
	--white-strong: rgba(255, 255, 255, 0.88);

	font-family: var(--font-base);
}

* {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

#hero-form-card,
#curriculum,
#schools,
#enquire {
	scroll-margin-top: 100px;
}

.hp-field {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	opacity: 0;
}

/* ==========================================================================
   Animations & micro-interactions
   ========================================================================== */

@keyframes ews-fade-up {
	from { opacity: 0; transform: translateY(22px); }
	to { opacity: 1; transform: translateY(0); }
}
@keyframes ews-fade-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

/* Scroll-reveal: elements start hidden, JS (IntersectionObserver) adds
   .is-visible as they enter the viewport. If JS never runs, the fallback
   rule below still shows everything — content is never hidden permanently. */
.reveal {
	opacity: 0;
	transform: translateY(22px);
	transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
}
.reveal-stagger.is-visible > * {
	animation: ews-fade-up 0.6s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.reveal-stagger.is-visible > *:nth-child(1) { animation-delay: 0.02s; }
.reveal-stagger.is-visible > *:nth-child(2) { animation-delay: 0.07s; }
.reveal-stagger.is-visible > *:nth-child(3) { animation-delay: 0.12s; }
.reveal-stagger.is-visible > *:nth-child(4) { animation-delay: 0.17s; }
.reveal-stagger.is-visible > *:nth-child(5) { animation-delay: 0.22s; }
.reveal-stagger.is-visible > *:nth-child(6) { animation-delay: 0.27s; }
.reveal-stagger.is-visible > *:nth-child(7) { animation-delay: 0.32s; }
.reveal-stagger.is-visible > *:nth-child(8) { animation-delay: 0.37s; }
.reveal-stagger.is-visible > *:nth-child(9) { animation-delay: 0.42s; }

/* Hero entrance, plays once on load rather than on scroll. */
.hero__copy { animation: ews-fade-up 0.8s cubic-bezier(0.22, 1, 0.36, 1) both; }

/* Hover lift for interactive cards/tiles across the page. */
.pathway-card,
.path-card,
.feature,
.award,
.testimonial__thumb,
.btn,
.quick-sidebar__item {
	transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, opacity 0.2s ease;
}
.pathway-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 24px rgba(13, 27, 76, 0.1);
}
.path-card:hover {
	transform: translateX(3px);
	box-shadow: 0 8px 20px rgba(13, 27, 76, 0.08);
}
.feature:hover .feature__icon {
	color: var(--purple);
}
.feature__icon {
	transition: color 0.2s ease;
}
.award:hover {
	transform: translateY(-4px);
}
.testimonial__thumb:hover {
	transform: translateY(-3px);
	box-shadow: 0 14px 28px rgba(13, 27, 76, 0.16);
}
.btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 22px rgba(13, 27, 76, 0.18);
}
.btn:active {
	transform: translateY(0);
	box-shadow: none;
}
.quick-sidebar__item:hover {
	transform: translateX(-3px);
	filter: brightness(1.08);
}

/* Sticky header gains a shadow once the page has scrolled, for depth. */
.site-header {
	transition: box-shadow 0.25s ease;
}
.site-header.is-scrolled {
	box-shadow: 0 6px 18px rgba(13, 27, 76, 0.08);
}

/* Users who've asked for reduced motion get instant, non-animated content —
   nothing stays hidden, nothing moves. */
@media (prefers-reduced-motion: reduce) {
	.hero__copy,
	.hero__media,
	.reveal,
	.reveal-stagger > *,
	.venn-circle,
	.venn-badge,
	.venn-label {
		animation: none !important;
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
	.venn-label {
		transform: translate(-50%, -50%) !important;
	}
	html {
		scroll-behavior: auto;
	}
}

body {
	margin: 0;
	color: var(--text);
	font-family: var(--font-base);
	font-size: var(--fs-md);
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
	font-family: var(--font-base);
	margin: 0 0 12px;
	line-height: 1.2;
	font-weight: 700;
	color: var(--navy);
}

p {
	margin: 0 0 16px;
	color: var(--text);
}

a {
	color: inherit;
	text-decoration: none;
}

img {
	max-width: 100%;
	display: block;
}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.container {
	max-width: var(--container);
	margin: 0 auto;
	padding: 0 24px;
}

.eyebrow {
	text-transform: uppercase;
	font-weight: 700;
	font-size: var(--fs-xs);
	letter-spacing: 0.08em;
	color: var(--purple);
	margin-bottom: 10px;
}

.text-green { color: var(--green); }
.text-navy { color: var(--navy); }
.text-orange { color: var(--orange); }
.text-purple { color: var(--purple); }
.text-sky { color: var(--sky); }
.text-blue { color: #0049b0; }
.text-indigo { color: #342d91; }
.text-maroon { color: var(--maroon); }

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

/* Buttons */
.btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 14px 24px;
	border-radius: 999px;
	font-weight: 600;
	font-size: var(--fs-md);
	border: none;
	cursor: pointer;
	white-space: nowrap;
}
.btn--dark { background: var(--navy); color: #fff; }
.btn--dark:hover { background: var(--navy-dark); }
.btn--orange { background: linear-gradient(120deg, #fd8a28, #fe4407); color: #fff; }
.btn--purple { background: linear-gradient(120deg, var(--purple-dark), var(--purple)); color: #fff; }
.btn--outline { background: #fff; color: var(--navy); border: 1px solid var(--border); }
.btn--block { width: 100%; justify-content: center; }

/* ==========================================================================
   Header
   ========================================================================== */

.site-header {
	border-bottom: 1px solid var(--border);
	position: sticky;
	top: 0;
	background: #fff;
	z-index: 100;
}

.site-header__inner {
	display: flex;
	align-items: center;
	gap: 32px;
	padding-top: 14px;
	padding-bottom: 14px;
}

.site-logo {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
}
.site-logo__image {
	height: 60px;
	width: auto;
}
.site-logo__icon {
	width: 30px;
	height: 30px;
	border-radius: 8px;
	background: var(--orange);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-base);
	font-weight: 800;
	font-size: var(--fs-md);
	flex-shrink: 0;
}
.site-logo__word {
	font-family: var(--font-base);
	font-weight: 800;
	font-size: var(--fs-2xl);
	color: var(--navy);
	margin-right: 2px;
}
.site-logo__text {
	display: flex;
	flex-direction: column;
	line-height: 1.15;
}
.site-logo__title {
	font-weight: 700;
	font-size: var(--fs-xs);
	color: var(--navy);
	letter-spacing: 0.04em;
}
.site-logo__tagline {
	font-size: var(--fs-3xs);
	color: var(--text-muted);
	letter-spacing: 0.04em;
}

.nav-toggle {
	display: none;
	flex-direction: column;
	gap: 4px;
	background: none;
	border: none;
	cursor: pointer;
	margin-left: auto;
}
.nav-toggle span {
	width: 24px;
	height: 2px;
	background: var(--navy);
}

.primary-nav__list {
	display: flex;
	align-items: center;
	gap: 18px;
	flex: 1;
	min-width: 0;
}
.primary-nav__list .menu-item {
	position: relative;
}
.primary-nav__list .menu-item > a,
.primary-nav__list .menu-item__toggle {
	font-size: var(--fs-base);
	font-weight: 500;
	font-family: inherit;
	color: var(--text);
	padding: 6px 0;
	display: inline-flex;
	align-items: center;
	background: none;
	border: none;
	cursor: pointer;
	white-space: nowrap;
}
.primary-nav__list .menu-item--has-children > .menu-item__toggle::after {
	content: '\25BE';
	font-size: var(--fs-3xs);
	margin-left: 5px;
	color: var(--text-muted);
	transition: transform 0.15s ease;
}
.primary-nav__list .menu-item--has-children.is-open > .menu-item__toggle::after {
	transform: rotate(180deg);
}
.primary-nav__list .is-active > a {
	color: var(--orange);
	border-bottom: 2px solid var(--orange);
}

/* Submenus (desktop: hover dropdown, mobile: accordion via .is-open) */
.sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 220px;
	background: #fff;
	border-radius: 10px;
	box-shadow: 0 16px 32px rgba(13, 27, 76, 0.14);
	padding: 8px;
	margin-top: 8px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s;
	z-index: 200;
}
.menu-item--has-children:hover > .sub-menu,
.menu-item--has-children:focus-within > .sub-menu,
.menu-item--has-children.is-open > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.sub-menu li a {
	display: block;
	padding: 9px 12px;
	border-radius: 6px;
	font-size: var(--fs-sm);
	font-weight: 500;
	color: var(--text);
}
.sub-menu li a:hover,
.sub-menu li a:focus {
	background: var(--bg-soft);
	color: var(--purple);
}

.site-header__cta {
	flex-shrink: 0;
	padding: 12px 22px;
	font-size: var(--fs-base);
}

/* ==========================================================================
   Hero
   ========================================================================== */

.hero {
	background: var(--bg-soft);
	position: relative;
	overflow: hidden;
}

/* Full-bleed background photo (not a right-column image) — the design runs
   the campus photo edge-to-edge behind the whole hero, with the copy sitting
   on a white-to-transparent scrim over its left half. */
.hero__media {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.hero__scrim {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	/* Fully clear by 46% (the old 62% stop left a visible white haze over
	   the boy's face, which starts around 48% in this photo — the fade
	   needs to finish before the subjects start, not while overlapping
	   them, to match the reference mock where they're shown at full
	   clarity with no wash. */
	background: linear-gradient(90deg, #fff 0%, #fff calc(34% - 5px), rgba(255, 255, 255, 0.5) calc(40% - 5px), rgba(255, 255, 255, 0) calc(46% - 5px));
}

.hero__inner {
	position: relative;
	z-index: 2;
	padding: 72px 24px 96px;
}

.hero__copy h1 {
	/* Font spec says "Montserrat", but Montserrat's double-story lowercase
	   g doesn't match the single-story g in the reference mock — that's
	   actually Poppins. Going by the mock over the spec's label.
	   Measured ~42px cap-to-baseline against the client's actual hero
	   design reference (2026-09-03) — 50px ran noticeably larger than
	   the design; the clamp's ceiling now targets that measurement. */
	font-family: 'Poppins', var(--font-base);
	font-size: clamp(24px, 3.4vw, 42px);
	font-weight: 700;
	line-height: 1.16;
	letter-spacing: -0.01em;
	margin: 0 0 18px;
}
.hero__copy h1 .text-orange {
	/* Swapped Sacramento for Yellowtail (2026-09-03) to match the client's
	   actual hero design reference, which uses a bolder, looping brush
	   script rather than Sacramento's thin monoline strokes. */
	font-family: 'Yellowtail', var(--font-script);
	font-style: normal;
	font-weight: 400;
	font-size: 1.12em;
	line-height: 1;
	display: inline-block;
}
/* The hero eyebrow is dark navy in the design, unlike every other section's
   purple eyebrow — a deliberate one-off, not a missed style. */
.hero__copy .eyebrow {
	color: #2b2e51;
}

.hero__desc {
	max-width: 460px;
	margin-top: 16px;
}

.hero__actions {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	margin-top: 12px;
}

.hero__photo {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* Bias the crop upward — centered cover was cutting the building down
	   to a sliver above the students' heads and keeping empty leg-room at
	   the bottom instead. */
	object-position: center 30%;
	border-radius: 0;
}

.hero__play {
	/* Now a flex item inside .hero__actions, in the same row as the two
	   CTA buttons, matching the reference mock — not absolutely
	   positioned over the photo independently of that row. */
	display: flex;
	align-items: center;
	gap: 10px;
	background: none;
	border: none;
	padding: 0;
	color: #fff;
	cursor: pointer;
}
.hero__play-icon {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: #fff;
	color: var(--navy);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 6px 16px rgba(13, 27, 76, 0.35);
}
.hero__play-label {
	font-size: var(--fs-xs);
	text-align: left;
	line-height: 1.3;
	text-shadow: 0 1px 4px rgba(13, 27, 76, 0.55);
}

.hero__form-card {
	position: absolute;
	z-index: 3;
	top: 32px;
	/* .hero__media is full-bleed to the viewport edge, and the fixed
	   .quick-sidebar (68px wide) sits flush on that same edge — clear it,
	   but tucked in closer to match the reference mock (which sits the
	   card right up against the sidebar) rather than the wider gap the
	   original -18px-tuned offset left. */
	right: 78px;
	width: 320px;
	background: #fff;
	border-radius: var(--radius);
	box-shadow: 0 20px 45px rgba(13, 27, 76, 0.2);
	padding: 22px;
}
.hero__field-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}
.hero__form-card .badge {
	display: inline-block;
	/* Green was a mismatch — the hero form card's design reference uses
	   purple/indigo for this "NEW" pill (2026-09-03). */
	background: var(--purple);
	color: #fff;
	font-size: var(--fs-3xs);
	font-weight: 700;
	padding: 2px 8px;
	border-radius: 4px;
	margin-bottom: 10px;
}
.hero__form-card h3 {
	font-size: var(--fs-md);
	line-height: 1.35;
	margin-bottom: 4px;
}
.hero__form-card p {
	font-size: var(--fs-xs);
	margin-bottom: 14px;
}
.hero__form-close {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 26px;
	height: 26px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--bg-soft);
	border: none;
	border-radius: 50%;
	font-size: var(--fs-md);
	line-height: 1;
	cursor: pointer;
	color: var(--text-muted);
	transition: background-color 0.15s ease, color 0.15s ease;
}
.hero__form-close:hover {
	background: var(--bg-soft-2);
	color: var(--text);
}
.hero__field {
	display: block;
	margin-bottom: 6px;
	position: relative;
}
.hero__field:last-of-type {
	margin-bottom: 10px;
}
.hero__field span {
	display: block;
	font-size: var(--fs-xs);
	font-weight: 600;
	letter-spacing: 0.01em;
	margin-bottom: 6px;
	color: var(--text-muted);
}
.hero__field select,
.hero__field input {
	width: 100%;
	padding: 10px 12px;
	border-radius: 9px;
	border: 1px solid #d9dce8;
	font-size: var(--fs-sm);
	background: var(--bg-soft);
	font-family: inherit;
	min-height: 42px;
	box-shadow: 0 1px 2px rgba(16, 24, 64, 0.04);
	transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}
.hero__field select::placeholder,
.hero__field input::placeholder {
	color: #9aa1b5;
}
.hero__field select:hover,
.hero__field input:hover {
	border-color: #c3c8db;
}
.hero__field select:focus,
.hero__field input:focus {
	outline: none;
	border-color: var(--purple);
	box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.15);
	background-color: #fff;
}
.hero__form-note {
	text-align: center;
	font-size: var(--fs-2xs);
	margin: 8px 0 0;
}
.hero__field input.is-invalid,
.hero__field select.is-invalid {
	border-color: #dc2626;
	background-color: #fef2f2;
}

/* Step-1 fields (age/grade/curriculum/state): icon + label/value row with a
   trailing chevron, matching the design's dropdown-style rows — replaces
   the boxed label-above-input layout used for the step-2 contact fields. */
.hero__field.hero__field--search {
	display: flex;
	align-items: center;
	gap: 9px;
	border: 1.5px solid #e2e4ee;
	border-radius: 12px;
	padding: 5px 12px;
	background: #fff;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.hero__field.hero__field--search:hover { border-color: #c3c8db; }
.hero__field.hero__field--search:focus-within {
	border-color: var(--purple);
	box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.15);
}
.hero__field-icon {
	flex-shrink: 0;
	width: 18px;
	height: 18px;
	color: var(--purple);
	display: flex;
	align-items: center;
	justify-content: center;
}
.hero__field-icon svg { width: 18px; height: 18px; }
.hero__field-body {
	flex: 1;
	min-width: 0;
}
.hero__field-label {
	display: block;
	font-size: var(--fs-xs);
	font-weight: 700;
	color: var(--text);
	margin-bottom: 1px;
}
.hero__field.hero__field--search input {
	border: none;
	background: transparent;
	background-image: none;
	padding: 0;
	margin: 0;
	min-height: auto;
	box-shadow: none;
	font-size: var(--fs-sm);
	color: var(--text-muted);
}
.hero__field.hero__field--search input:focus {
	outline: none;
	box-shadow: none;
	background-color: transparent;
}
.hero__field-chevron {
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	color: #9aa1b5;
}

/* Step navigation (Recommend Schools -> contact details) */
.hero__step-back {
	background: none;
	border: none;
	padding: 0;
	margin-bottom: 10px;
	font-size: var(--fs-xs);
	font-weight: 600;
	color: var(--text-muted);
	cursor: pointer;
}
.hero__step-back:hover { color: var(--text); }
.hero__step-intro {
	font-size: var(--fs-xs);
	color: var(--text-muted);
	margin-bottom: 14px;
}

/* Custom searchable-dropdown suggestion list (progressive enhancement of
   input+datalist — see enhanceCombobox() in main.js). */
.combobox-list {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	margin: 4px 0 0;
	padding: 6px;
	list-style: none;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: 10px;
	box-shadow: 0 16px 32px rgba(13, 27, 76, 0.16);
	max-height: 230px;
	overflow-y: auto;
	z-index: 60;
}
.combobox-list[hidden] {
	display: none;
}
.combobox-option {
	padding: 9px 10px;
	border-radius: 6px;
	font-size: var(--fs-sm);
	font-weight: 500;
	color: var(--text);
	cursor: pointer;
	line-height: 1.3;
}
.combobox-option:hover,
.combobox-option.is-active {
	background: var(--bg-soft-2);
	color: var(--purple);
}
.combobox-empty {
	padding: 9px 10px;
	font-size: var(--fs-xs);
	color: var(--text-muted);
}
.hero__form-status,
.map-banner__status {
	font-size: var(--fs-xs);
	margin: 8px 0 0;
	min-height: 1em;
}
.hero__form-status[data-state="error"] { color: #dc2626; }
.hero__form-status[data-state="success"] { color: var(--green); }
.map-banner__status[data-state="error"] { color: #fecaca; }
.map-banner__status[data-state="success"] { color: #bbf7d0; }
.btn[disabled] { opacity: 0.65; cursor: not-allowed; }

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}
.skip-link.screen-reader-text:focus {
	position: fixed;
	top: 10px;
	left: 10px;
	width: auto;
	height: auto;
	clip: auto;
	background: #fff;
	color: var(--navy);
	padding: 10px 16px;
	border-radius: 8px;
	z-index: 1000;
	font-weight: 600;
	font-size: var(--fs-sm);
}

/* Sitewide floating chat prompt */
.chat-bubble {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 200;
	display: flex;
	align-items: center;
	gap: 10px;
	border: none;
	background: none;
	padding: 0;
	cursor: pointer;
}
.chat-bubble__tooltip {
	background: #fff;
	color: var(--text);
	font-size: var(--fs-sm);
	font-weight: 600;
	padding: 10px 16px;
	border-radius: 14px;
	box-shadow: 0 8px 20px rgba(13, 27, 76, 0.18);
	white-space: nowrap;
}
.chat-bubble__avatar {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: var(--purple);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	flex-shrink: 0;
	box-shadow: 0 8px 20px rgba(13, 27, 76, 0.3);
}
.chat-bubble__avatar svg { width: 26px; height: 26px; }

/* Sitewide floating quick-actions sidebar */
.quick-sidebar {
	position: fixed;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	flex-direction: column;
	z-index: 150;
	box-shadow: -6px 0 16px rgba(13, 27, 76, 0.12);
}
.quick-sidebar__item {
	width: 68px;
	padding: 10px 4px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	color: #fff;
	font-size: var(--fs-3xs);
	font-weight: 600;
	text-align: center;
	line-height: 1.25;
}
.quick-sidebar__item span {
	font-size: var(--fs-lg);
}
.quick-sidebar__item img {
	width: 32px;
	height: 32px;
}
.quick-sidebar__item--green { background: var(--green); }
.quick-sidebar__item--navy { background: var(--navy); }
.quick-sidebar__item--orange { background: var(--orange); }
.quick-sidebar__item--blue { background: var(--sky); }
.quick-sidebar__item--red { background: #c0263f; }

.hero__form-reopen {
	position: absolute;
	top: 16px;
	right: -18px;
	background: var(--purple);
	color: #fff;
	border: none;
	border-radius: 999px;
	padding: 10px 18px;
	font-size: var(--fs-sm);
	font-weight: 600;
	cursor: pointer;
	box-shadow: 0 12px 24px rgba(109, 40, 217, 0.3);
}
.hero__form-reopen[hidden] { display: none; }

/* Toast (dummy-interaction feedback) */
.ews-toast {
	position: fixed;
	left: 50%;
	bottom: 28px;
	transform: translate(-50%, 12px);
	background: var(--navy);
	color: #fff;
	padding: 12px 22px;
	border-radius: 999px;
	font-size: var(--fs-sm);
	font-weight: 500;
	box-shadow: 0 16px 32px rgba(13, 27, 76, 0.3);
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease, transform 0.2s ease;
	z-index: 1000;
}
.ews-toast.is-visible {
	opacity: 1;
	transform: translate(-50%, 0);
}

/* ==========================================================================
   Stats bar
   ========================================================================== */

.stats-bar {
	background: var(--navy);
}
.stats-bar__inner {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	padding: 26px 24px;
}
.stat {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	text-align: left;
	color: #fff;
	border-right: 1px solid rgba(255,255,255,0.12);
}
.stat:last-child { border-right: none; }
.stat__icon { font-size: var(--fs-xl); flex-shrink: 0; }
.stat__icon img { width: 40px; height: 40px; display: block; }
.stat__body { display: flex; flex-direction: column; }
.stat strong {
	display: block;
	font-family: var(--font-base);
	font-size: var(--fs-xl);
	line-height: 1.2;
}
.stat__body span {
	font-size: var(--fs-xs);
	color: var(--white-muted);
}

/* ==========================================================================
   Curriculum / 3C
   ========================================================================== */

.curriculum {
	padding: 72px 0;
	background: #fff;
}
.curriculum__inner {
	display: grid;
	grid-template-columns: 0.9fr 1.1fr 0.9fr;
	gap: 32px;
	align-items: start;
}
.curriculum__intro h2 { font-size: var(--fs-3xl); }
.curriculum__lead { font-weight: 700; }

.curriculum__diagram-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
}
.curriculum__diagram {
	position: relative;
	width: 100%;
	max-width: 350px;
	aspect-ratio: 1;
	margin: 0 auto;
}
.curriculum__diagram-image {
	width: 100%;
	max-width: 350px;
	height: auto;
	display: block;
	margin: 0 auto;
}

/* Three circles arranged so they only overlap near the shared center —
   the white badge covers that overlap, so each circle stays a clean solid
   color and its label sits in its own uncovered "petal". */
/* Dashed orbit connecting the three circles, sitting behind them. */
.venn-orbit {
	position: absolute;
	inset: -6% -6% 6% -6%;
	width: 112%;
	height: 112%;
	z-index: 0;
}

.venn-circle {
	position: absolute;
	width: 54.3%;
	aspect-ratio: 1;
	border-radius: 50%;
	opacity: 0;
	transform: scale(0.55);
	z-index: 1;
	transition: opacity 0.6s cubic-bezier(0.34, 1.56, 0.64, 1), transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.25s ease;
}
.venn-circle--character { background: linear-gradient(160deg, #5cb84e, #2d6b26); left: 22.9%; top: 0; }
.venn-circle--competence { background: linear-gradient(160deg, #0f5fc4, #0a2f5e); left: 3.06%; top: 34.3%; }
.venn-circle--content { background: linear-gradient(160deg, #6a4ba0, #402a6e); left: 42.7%; top: 34.3%; }

/* Staggered pop-in: each circle (and its label) arrives in turn, then the
   badge unifies them a beat later. */
.venn-animate.is-visible .venn-circle--character { opacity: 1; transform: scale(1); transition-delay: 0.05s; }
.venn-animate.is-visible .venn-circle--competence { opacity: 1; transform: scale(1); transition-delay: 0.2s; }
.venn-animate.is-visible .venn-circle--content { opacity: 1; transform: scale(1); transition-delay: 0.35s; }

.venn-badge {
	position: absolute;
	left: 36.3%;
	top: 36.3%;
	width: 27.4%;
	aspect-ratio: 1;
	border-radius: 50%;
	/* Solid white circle. The gradient-clipped "3C" text is a separate
	   child element (.venn-badge__text) — background-clip:text clips
	   EVERY background layer on an element, not just one, so a gradient
	   and a solid white fill can't coexist on the same element; the
	   white circle needs its own element to actually render. */
	background-color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
	z-index: 3;
	opacity: 0;
	transform: scale(0.3) rotate(-20deg);
	transition: opacity 0.5s cubic-bezier(0.34, 1.56, 0.64, 1), transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.venn-badge__text {
	font-family: var(--font-base);
	font-weight: 800;
	font-size: var(--fs-lg);
	background-image: linear-gradient(120deg, var(--purple), #d6409f);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.venn-animate.is-visible .venn-badge {
	opacity: 1;
	transform: scale(1) rotate(0deg);
	transition-delay: 0.55s;
	/* Gentle ambient glow once everything has landed — a different property
	   (box-shadow) than the transform above, so the two never fight. */
	animation: venn-badge-pulse 2.6s ease-in-out 1.4s infinite;
}
@keyframes venn-badge-pulse {
	0%, 100% { box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15); }
	50% { box-shadow: 0 10px 28px rgba(124, 58, 237, 0.4); }
}

.venn-label {
	position: absolute;
	/* Trimmed from 34% — the three-line subtext (see
	   curriculum-pathways.php) made the block wide enough to poke past
	   the circle's true edge at these off-center positions (each label
	   is deliberately pushed toward its circle's outer "petal", away
	   from the center badge, so there's little horizontal slack). */
	width: 30%;
	text-align: center;
	color: #fff;
	z-index: 2;
	opacity: 0;
	transform: translate(-50%, -50%) translateY(10px);
	transition: opacity 0.5s ease, transform 0.5s ease;
}
.venn-label__icon {
	width: 26px;
	height: 26px;
	margin: 0 auto 6px;
	display: block;
}
/* Character nudged down slightly — the three-line subtext (see
   curriculum-pathways.php) made this block tall enough to poke past the
   circle's top edge. */
.venn-label--character { left: 50%; top: 15%; }
.venn-label--competence { left: 18%; top: 68%; }
.venn-label--content { left: 82%; top: 68%; }
.venn-animate.is-visible .venn-label--character { opacity: 1; transform: translate(-50%, -50%) translateY(0); transition-delay: 0.15s; }
.venn-animate.is-visible .venn-label--competence { opacity: 1; transform: translate(-50%, -50%) translateY(0); transition-delay: 0.3s; }
.venn-animate.is-visible .venn-label--content { opacity: 1; transform: translate(-50%, -50%) translateY(0); transition-delay: 0.45s; }
.venn-label strong {
	display: block;
	font-size: var(--fs-sm);
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	margin-bottom: 4px;
}
.venn-label span {
	display: block;
	/* One notch below --fs-3xs (10px) — the label box is narrow (see
	   .venn-label's width comment), and the longest line, "Global
	   Perspective", needs this to keep the 3-line subtext (see
	   curriculum-pathways.php) from wrapping to a 4th line. */
	font-size: 9px;
	line-height: 1.35;
}

.venn__caption {
	text-align: center;
	font-size: var(--fs-2xs);
	font-weight: 800;
	letter-spacing: 0.05em;
	color: var(--text-muted);
	margin: 0;
}

.curriculum__paths > p:first-child {
	font-size: var(--fs-xl);
	font-weight: 700;
	line-height: 1.25;
	color: var(--text);
	margin-bottom: 16px;
}
.path-card {
	display: flex;
	align-items: center;
	gap: 12px;
	background: var(--bg-soft);
	border-radius: 12px;
	padding: 12px;
	margin-bottom: 10px;
}
.path-card__icon {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: var(--fs-2xs);
	font-weight: 700;
	flex-shrink: 0;
}
.path-card__icon svg { width: 19px; height: 19px; }
.path-card__icon--blue { background: #0049b0; }
.path-card__icon--green { background: var(--green); }
.path-card__icon--skyblue { background: var(--sky); }
.path-card strong { display: block; font-size: var(--fs-sm); color: var(--text); }
.path-card strong.text-blue { color: #0049b0; }
.path-card strong.text-green { color: var(--green); }
.path-card strong.text-indigo { color: #342d91; }
.path-card small { font-size: var(--fs-xs); color: var(--text-muted); }
.path-card i { margin-left: auto; color: var(--text-muted); font-style: normal; }
.curriculum__paths-note { font-size: var(--fs-sm); margin: 16px 0 10px; }

/* ==========================================================================
   Pathways
   ========================================================================== */

.pathways {
	background: var(--bg-soft);
	padding: 72px 0;
	text-align: left;
}
.pathways h2 { font-size: var(--fs-3xl); margin-bottom: 32px; }
.pathways__grid {
	display: grid;
	grid-template-columns: repeat(9, 1fr);
	gap: 14px;
	margin-bottom: 32px;
}
.pathway-card {
	border-radius: 12px;
	padding: 18px 14px;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 22px;
	font-size: var(--fs-xs);
	font-weight: 600;
	color: var(--text);
}
.pathway-card__icon {
	display: flex;
	align-items: center;
	justify-content: center;
}
.pathway-card__icon svg { width: 30px; height: 30px; }
.pathway-card__icon img { width: 44px; height: 44px; }
.pathway-card--red { background: #fde2e4; }
.pathway-card--blue { background: #dbeafe; }
.pathway-card--purple { background: #ede9fe; }
.pathway-card--teal { background: #d7f3ee; }
.pathway-card--orange { background: #fde6d2; }
.pathway-card--gray { background: #e5e7eb; }
.pathway-card--pink { background: #fbe1ef; }
.pathway-card--violet { background: #ede4fb; }
.pathway-card--skyblue { background: #e0f2fe; }
.pathway-card__icon--red { color: #e11d48; }
.pathway-card__icon--blue { color: #2563eb; }
.pathway-card__icon--purple { color: #7c3aed; }
.pathway-card__icon--teal { color: #0d9488; }
.pathway-card__icon--orange { color: #ea7c1b; }
.pathway-card__icon--gray { color: #4b5563; }
.pathway-card__icon--pink { color: #db2777; }
.pathway-card__icon--violet { color: #7c3aed; }
.pathway-card__icon--skyblue { color: #0284c7; }
.pathways__cta { display: table; margin: 0 auto; }

/* ==========================================================================
   Features
   ========================================================================== */

.features {
	padding: 72px 0;
	background: #fff;
}
.features__inner {
	display: grid;
	/* Sampled from the design: the photo occupies roughly 27% of the row's
	   width — old 2.9fr:1fr undersized it. Stretching to the full row
	   height (rather than centering at natural aspect) looked right for
	   the design's own landscape-cropped photo, but badly letterboxes our
	   actual (also-landscape, ~1.78:1) source in the resulting tall/narrow
	   column — center + natural-height keeps the photo itself readable. */
	grid-template-columns: 2.6fr 1fr;
	gap: 40px;
	align-items: center;
}
.features h2 { font-size: var(--fs-3xl); }
.features__grid {
	/* 5 columns so it wraps 5-then-3, matching the design exactly — a
	   2-column grid pairs the wrong items side by side (row-major fill
	   over 8 items lands different neighbours than 5 columns does). */
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	column-gap: 20px;
	row-gap: 24px;
	margin-top: 24px;
}
.feature {
	display: grid;
	grid-template-columns: 46px 1fr;
	column-gap: 10px;
	row-gap: 2px;
}
.feature__icon {
	grid-column: 1;
	grid-row: 1;
	align-self: center;
	width: 46px;
	height: 46px;
	color: var(--navy);
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}
.feature__icon svg { width: 40px; height: 40px; }
.feature__icon img { width: 46px; height: 46px; }
.feature strong { grid-column: 2; grid-row: 1; display: block; font-size: var(--fs-sm); color: var(--text); }
.feature small { grid-column: 2; grid-row: 2; font-size: var(--fs-xs); color: var(--text-muted); }
.features__photo {
	background: var(--bg-soft);
	border-radius: var(--radius);
	padding: 12px;
	box-shadow: 0 10px 30px rgba(16, 31, 77, 0.08);
}
.features__photo img { display: block; width: 100%; height: auto; }

/* ==========================================================================
   Awards
   ========================================================================== */

.awards {
	background: var(--bg-soft);
	padding: 72px 0;
	text-align: center;
}
.awards h2 { font-size: var(--fs-3xl); }
.awards__row {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 24px;
}
.awards__track {
	display: flex;
	gap: 32px;
	overflow-x: auto;
	flex: 1;
	align-items: center;
	padding: 8px 0;
}
.award {
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	font-size: var(--fs-2xs);
	font-weight: 600;
	width: 100px;
}
.award img { border-radius: 50%; }
.award--photo { width: auto; }
.award--photo img { border-radius: 10px; width: 355px; height: 180px; object-fit: contain; background: var(--bg-soft); }
.award__badge {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.award__badge svg { width: 30px; height: 30px; }
.carousel-arrow {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: 1px solid var(--border);
	background: #fff;
	font-size: var(--fs-lg);
	cursor: pointer;
	flex-shrink: 0;
}

/* ==========================================================================
   Map banner
   ========================================================================== */

.map-banner {
	/* Sampled from the design mockup: dips to a dark navy trough in the
	   middle, then brightens to a vivid blue-violet on the right — not a
	   flat fade to near-black like the old two-stop version. */
	background: linear-gradient(100deg, #2a1a63, #0d1253 45%, #3b44c7 100%);
	padding: 32px 0;
}
.map-banner__inner {
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	gap: 32px;
	align-items: center;
	color: #fff;
}
.map-banner h2 { color: #fff; font-size: var(--fs-2xl); }
.map-banner p { color: var(--white-strong); }

/* The design wraps the state-finder in its own white card (label, select
   row, and the map link all inside it) rather than a bare pill-shaped bar
   floating directly on the purple background. */
.map-banner__card {
	background: #fff;
	border-radius: 16px;
	padding: 20px 24px;
	max-width: 460px;
}
.map-banner__form label {
	display: block;
	font-size: var(--fs-sm);
	font-weight: 700;
	color: var(--text);
	margin-bottom: 10px;
}
.map-banner__form-row {
	display: flex;
	gap: 10px;
}
.map-banner__form input[type="text"] {
	flex: 1;
	min-width: 0;
	border: 1px solid #d9dce8;
	background-color: var(--bg-soft);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	padding: 10px 34px 10px 14px;
	font-size: var(--fs-sm);
	font-family: inherit;
	min-height: 44px;
	border-radius: 10px;
}
.map-banner__form input[type="text"]:focus {
	outline: none;
	border-color: var(--purple);
	background-color: #fff;
	box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.15);
}
.map-banner__form input.is-invalid {
	box-shadow: inset 0 0 0 2px #dc2626;
}
.map-banner__form .btn--dark {
	border-radius: 10px;
	padding: 10px 20px;
	white-space: nowrap;
}
.map-banner__status { margin-top: 8px; }
.map-banner__link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 12px;
	font-size: var(--fs-sm);
	font-weight: 600;
	color: var(--purple);
}
.map-banner__graphic {
	position: relative;
	justify-self: center;
	width: 100%;
	max-width: 320px;
}
.map-banner__graphic img { display: block; width: 100%; height: auto; border-radius: var(--radius); }
.map-banner__badge {
	position: absolute;
	bottom: -14px;
	right: -14px;
	background: #fff;
	color: var(--navy);
	font-size: var(--fs-xs);
	font-weight: 700;
	padding: 10px 16px;
	border-radius: 999px;
	box-shadow: 0 10px 24px rgba(0,0,0,0.2);
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.map-banner__badge-icon { display: inline-flex; color: var(--orange); }
.map-banner__badge-icon svg { width: 16px; height: 16px; }

/* ==========================================================================
   Testimonials
   ========================================================================== */

.testimonials {
	padding: 72px 0;
	text-align: left;
}
.testimonials h2 { font-size: var(--fs-2xl); margin-bottom: 4px; }
.testimonials__row {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-top: 24px;
}
.testimonials__track {
	display: flex;
	gap: 20px;
	overflow-x: auto;
	flex: 1;
}
.testimonial {
	flex-shrink: 0;
	width: 320px;
	display: flex;
	gap: 14px;
	align-items: flex-start;
	background: #fff;
	border-radius: 14px;
	padding: 12px;
	box-shadow: 0 4px 16px rgba(13, 27, 76, 0.06);
}
.testimonial__thumb {
	position: relative;
	display: block;
	width: 130px;
	height: 130px;
	flex-shrink: 0;
	padding: 0;
	border: none;
	background: none;
	cursor: pointer;
	text-align: left;
}
.testimonial__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 12px;
}
.testimonial__body { min-width: 0; }
.testimonial__play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: var(--fs-xl);
	background: rgba(13,27,76,0.15);
	border-radius: 12px;
}
.testimonial__kicker { font-size: var(--fs-2xs); font-weight: 700; color: var(--purple); margin-bottom: 2px; }
.testimonial__source { font-size: var(--fs-2xs); color: var(--text-muted); margin-bottom: 6px; }
.testimonial__quote { font-size: var(--fs-sm); color: var(--text); }
.testimonials__more {
	display: block;
	text-align: right;
	font-size: var(--fs-sm);
	font-weight: 600;
	margin-top: 12px;
}
@media (max-width: 560px) {
	/* The 320px fixed card width (desktop) doesn't fit the track's visible
	   area once the two prev/next arrows and gaps eat into a phone-width
	   row — the card's text half was getting scrolled out of view/clipped.
	   Narrow the card and stack thumb-over-text so it fits one screen. */
	.testimonials__row { gap: 8px; }
	.carousel-arrow { width: 30px; height: 30px; font-size: var(--fs-base); }
	.testimonial { width: 220px; flex-direction: column; align-items: stretch; }
	.testimonial__thumb { width: 100%; height: 140px; }
}

/* ==========================================================================
   CTA banner
   ========================================================================== */

.cta-banner {
	background: linear-gradient(120deg, var(--navy-dark), var(--navy));
	color: #fff;
	position: relative;
}
.cta-banner__inner {
	display: grid;
	grid-template-columns: auto 1.6fr 1fr;
	gap: 32px;
	align-items: center;
	padding: 56px 24px;
	position: relative;
}
.cta-banner__photo {
	position: relative;
	align-self: stretch;
	width: 280px;
	margin-top: -48px;
	margin-bottom: -56px;
}
.cta-banner__photo img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: bottom center;
}
.cta-banner__content h2 { color: #fff; font-size: var(--fs-2xl); }
.cta-banner__content h2 .text-orange {
	font-family: var(--font-script);
	font-style: normal;
	font-weight: 700;
	font-size: 1.3em;
	line-height: 1;
	display: inline-block;
}
.cta-banner__checks {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	margin-bottom: 20px;
}
.cta-banner__checks li {
	font-size: var(--fs-sm);
	color: var(--white-strong);
}
.cta-banner__checks li::before { content: '\2713 '; color: var(--orange); font-weight: 700; }
.cta-banner__social {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: var(--fs-xs);
	color: var(--white-muted);
	margin-top: 16px;
}
.cta-banner__avatars {
	display: flex;
}
.cta-banner__avatars span {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--bg-soft-2);
	border: 2px solid var(--navy);
	color: var(--navy);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: -10px;
}
.cta-banner__avatars span:first-child { margin-left: 0; }
.cta-banner__avatars svg { width: 16px; height: 16px; }
.cta-banner__admissions h3 { color: #fff; font-size: var(--fs-md); }
.cta-banner__admissions p {
	margin-bottom: 6px;
	font-size: var(--fs-sm);
	display: flex;
	align-items: center;
	gap: 8px;
}
.cta-banner__admissions a { color: var(--white-strong); }
.cta-banner__admissions svg { width: 16px; height: 16px; color: var(--orange); flex-shrink: 0; }
.cta-banner__whatsapp {
	position: absolute;
	right: 24px;
	top: 50%;
	transform: translateY(-50%);
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #25d366;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25);
}
.cta-banner__whatsapp svg { width: 22px; height: 22px; }

/* ==========================================================================
   Footer
   ========================================================================== */

.site-footer {
	background: var(--navy-dark);
	color: var(--white-muted);
	padding: 56px 0 0;
}
.site-footer__grid {
	display: grid;
	grid-template-columns: 1.4fr repeat(4, 1fr) 1.2fr;
	gap: 24px;
	padding-bottom: 40px;
	border-bottom: 1px solid rgba(255,255,255,0.1);
}
.site-footer .site-logo__word { color: #fff; }
.site-logo--footer .site-logo__image { height: 88px; }
.site-footer__tagline { font-size: var(--fs-sm); margin-top: 10px; color: var(--white-muted); }
.site-footer__tagline .text-orange {
	display: block;
	font-family: var(--font-script);
	font-size: 1.4em;
	margin-top: 2px;
}
.site-footer h4 {
	color: var(--orange);
	font-size: var(--fs-sm);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-bottom: 14px;
}
.site-footer ul li { margin-bottom: 10px; font-size: var(--fs-sm); }
.site-footer__social {
	display: flex;
	gap: 10px;
	margin-bottom: 16px;
}
.site-footer__social a {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: rgba(255,255,255,0.1);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--fs-2xs);
	text-transform: uppercase;
}
.site-footer__social a img { width: 30px; height: 30px; border-radius: 7px; }
.site-footer__stores {
	display: flex;
	gap: 10px;
}
.store-badge {
	display: flex;
	align-items: center;
	gap: 8px;
	background: #000;
	color: #fff;
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 8px;
	padding: 6px 12px;
	font-size: var(--fs-sm);
	font-weight: 600;
	line-height: 1.1;
}
.store-badge svg { width: 20px; height: 20px; flex-shrink: 0; }
.store-badge small {
	display: block;
	font-size: var(--fs-3xs);
	font-weight: 400;
	color: var(--white-muted);
	text-transform: none;
}
.site-footer__bottom {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 20px 24px;
	font-size: var(--fs-xs);
}
.site-footer__bottom p {
	color: var(--white-muted);
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 1024px) {
	/* The full-bleed absolute photo only works with room to breathe beside
	   the copy; below this width it reverts to the original stacked layout
	   (text, then a normal in-flow photo) instead of overlapping them. */
	.hero { display: flex; flex-direction: column; }
	.hero__inner { order: -1; padding: 32px 24px 24px; }
	.hero__media { position: relative; inset: auto; order: 1; }
	.hero__photo { position: static; width: 100%; height: auto; border-radius: var(--radius); }
	.hero__scrim { display: none; }
	/* .hero__play now lives in .hero__actions, which sits in the text
	   column above the stacked photo on mobile (not on top of it like on
	   desktop) — its white, photo-contrast text/icon need a dark scheme
	   here or they'd be invisible against the page background. */
	.hero__play { color: var(--navy); }
	.hero__play-label { text-shadow: none; }
	.quick-sidebar { display: none; }
	.hero__form-card { position: static; width: 100%; margin-top: 20px; }
	.hero__form-reopen { display: none; }
	.curriculum__inner { grid-template-columns: 1fr; }
	.curriculum__diagram { margin: 40px auto; }
	.pathways__grid { grid-template-columns: repeat(3, 1fr); }
	.features__inner { grid-template-columns: 1fr; }
	.features__grid { grid-template-columns: repeat(3, 1fr); }
	.features__photo { order: -1; }
	.map-banner__inner { grid-template-columns: 1fr; }
	.cta-banner__inner { grid-template-columns: 1fr; text-align: center; }
	.cta-banner__photo { display: none; }
	.site-footer__grid { grid-template-columns: 1fr 1fr 1fr; }
}

/* Between the hamburger breakpoint and a full desktop-width header, the
   9 nav items + logo + CTA get tight — tighten spacing/size here so links
   never wrap to two lines before the hamburger takes over at 1080px. */
@media (max-width: 1360px) {
	.site-header__inner { gap: 20px; }
	.primary-nav__list { gap: 12px; }
	.primary-nav__list .menu-item > a,
	.primary-nav__list .menu-item__toggle {
		font-size: var(--fs-sm);
	}
}

/* Menu collapses to a hamburger well before the 9 nav items + logo + CTA
   would otherwise overflow a laptop-width header. */
@media (max-width: 1080px) {
	.primary-nav {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: #fff;
		border-bottom: 1px solid var(--border);
		box-shadow: 0 16px 24px rgba(13, 27, 76, 0.08);
		max-height: calc(100vh - 64px);
		overflow-y: auto;
	}
	.primary-nav.is-open { display: block; }
	.nav-toggle { display: flex; }

	.primary-nav__list {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		padding: 8px 24px 20px;
	}
	.primary-nav__list .menu-item {
		border-bottom: 1px solid var(--border);
	}
	.primary-nav__list .menu-item > a,
	.primary-nav__list .menu-item__toggle {
		width: 100%;
		justify-content: space-between;
		padding: 14px 0;
	}
	.primary-nav__list .is-active > a {
		border-bottom: none;
	}

	.sub-menu {
		position: static;
		box-shadow: none;
		opacity: 1;
		visibility: visible;
		transform: none;
		margin: 0 0 10px;
		padding: 0 0 0 12px;
		display: none;
	}
	.menu-item--has-children.is-open > .sub-menu {
		display: block;
	}
}

@media (max-width: 720px) {
	.stats-bar__inner { grid-template-columns: repeat(3, 1fr); row-gap: 20px; }
	.stat:nth-child(3n) { border-right: none; }
	.pathways__grid { grid-template-columns: repeat(3, 1fr); }
	.features__grid { grid-template-columns: repeat(2, 1fr); }
	.site-footer__grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 576px) {
	/* The state field + button never wrapped, so on narrow phones the
	   button either got squeezed unreadable or overflowed. Stack it into
	   two full-width rows instead. */
	.map-banner__card { max-width: none; }
	.map-banner__form-row { flex-direction: column; }
	.map-banner__form input[type="text"],
	.map-banner__form button {
		width: 100%;
	}
}

@media (max-width: 480px) {
	.chat-bubble__tooltip { display: none; }
	.pathways__grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
	.pathway-card { padding: 12px 10px; font-size: var(--fs-2xs); }
	.pathway-card__icon svg { width: 22px; height: 22px; }
	.pathway-card__icon img { width: 34px; height: 34px; }
	.stats-bar__inner { grid-template-columns: repeat(2, 1fr); }
	.stat:nth-child(3n) { border-right: 1px solid rgba(255,255,255,0.12); }
	.stat:nth-child(2n) { border-right: none; }
	.site-footer__grid { grid-template-columns: 1fr; }
	.cta-banner__checks { grid-template-columns: 1fr; }
	.site-logo__image { height: 44px; }
	.site-logo--footer .site-logo__image { height: 64px; }
	.hero__form-reopen { right: 0; }
	.hero__field-row { grid-template-columns: 1fr; gap: 0; }
}

/* ==========================================================================
   Find a School directory + single school page
   ========================================================================== */

.breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	font-size: var(--fs-xs);
	color: var(--text-muted);
	margin-bottom: 18px;
}
.breadcrumb a { color: var(--text-muted); text-decoration: none; }
.breadcrumb a:hover { color: var(--purple); text-decoration: underline; }
.breadcrumb [aria-current="page"] { color: var(--text); font-weight: 600; }

.curriculum-badge {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 999px;
	background: var(--bg-soft-2);
	color: var(--navy);
	font-size: var(--fs-2xs);
	font-weight: 700;
	letter-spacing: 0.02em;
}

.school-badge {
	display: inline-block;
	padding: 5px 14px;
	border-radius: 999px;
	background: var(--bg-soft-2);
	color: var(--navy);
	font-size: var(--fs-xs);
	font-weight: 700;
}
.school-badge--green { background: #dcfce7; color: #15803d; }

/* --- Directory --- */

.school-directory-hero {
	padding: 48px 0 8px;
	background: var(--bg-soft);
}
.school-directory-hero h1 { font-size: var(--fs-3xl); margin-bottom: 10px; }
.school-directory-hero__desc { max-width: 620px; color: var(--text-muted); }

.school-directory { padding: 40px 0 80px; }

.school-directory__filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	margin-bottom: 16px;
	padding: 18px;
	background: var(--bg-soft);
	border-radius: var(--radius);
}

.school-directory__search {
	position: relative;
	flex: 1 1 240px;
	min-width: 200px;
}
.school-directory__search svg {
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	width: 18px;
	height: 18px;
	color: var(--text-muted);
	pointer-events: none;
}
.school-directory__search input {
	width: 100%;
	padding: 10px 14px 10px 38px;
	border-radius: 9px;
	border: 1px solid var(--border);
	font-size: var(--fs-base);
	background: #fff;
	font-family: inherit;
}
.school-directory__search input:focus { outline: none; border-color: var(--purple); box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.15); }

.school-directory__select { display: flex; align-items: center; gap: 10px; }
.school-directory__select label { font-weight: 700; font-size: var(--fs-sm); }
.school-directory__select select {
	padding: 10px 14px;
	border-radius: 9px;
	border: 1px solid var(--border);
	font-size: var(--fs-base);
	min-width: 180px;
	background: #fff;
}
.school-directory__select select:focus { outline: none; border-color: var(--purple); box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.15); }

.school-directory__curriculum { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.school-directory__curriculum-label { font-weight: 700; font-size: var(--fs-sm); margin-right: 2px; }
.curriculum-filter-btn {
	padding: 8px 14px;
	border-radius: 999px;
	border: 1px solid var(--border);
	background: #fff;
	color: var(--text);
	font-size: var(--fs-xs);
	font-weight: 600;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.curriculum-filter-btn:hover { border-color: var(--purple); }
.curriculum-filter-btn[aria-pressed="true"] { background: var(--purple); border-color: var(--purple); color: #fff; }

.school-directory__clear {
	padding: 10px 16px;
	border-radius: 9px;
	border: 1px solid var(--border);
	background: #fff;
	color: var(--text-muted);
	font-size: var(--fs-sm);
	font-weight: 600;
	cursor: pointer;
	white-space: nowrap;
}
.school-directory__clear:hover { border-color: var(--orange); color: var(--orange); }

.school-directory__count {
	font-size: var(--fs-sm);
	color: var(--text-muted);
	margin-bottom: 20px;
}
.school-directory__count #school-result-count { font-weight: 700; color: var(--navy); }

.school-directory__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.school-card {
	display: flex;
	flex-direction: column;
	border-radius: var(--radius);
	border: 1px solid var(--border);
	overflow: hidden;
	background: #fff;
	text-decoration: none;
	color: inherit;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.school-card:hover { box-shadow: 0 16px 32px rgba(16, 31, 77, 0.12); transform: translateY(-3px); }
.school-card[hidden] { display: none; }
.school-card__photo { display: block; aspect-ratio: 16/10; overflow: hidden; }
.school-card__photo img { width: 100%; height: 100%; object-fit: cover; }
.school-card__body { padding: 18px 20px 22px; display: flex; flex-direction: column; gap: 6px; }
.school-card__title { font-size: var(--fs-lg); color: var(--navy); }
.school-card__location {
	display: flex;
	align-items: center;
	gap: 6px;
	color: var(--text-muted);
	font-size: var(--fs-sm);
}
.school-card__location svg { width: 16px; height: 16px; flex-shrink: 0; }
.school-card__address { font-size: var(--fs-xs); color: var(--text-muted); }
.school-card__badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0; }
.school-card__cta { margin-top: auto; padding-top: 6px; font-weight: 700; color: var(--purple); font-size: var(--fs-sm); }

.school-directory__empty {
	text-align: center;
	padding: 40px 0;
	color: var(--text-muted);
}

/* --- Single school hero --- */

.school-hero { padding: 32px 0 0; }
.school-hero__grid {
	display: grid;
	grid-template-columns: 1.6fr 1fr;
	grid-template-areas: "copy sidebar" "media media";
	gap: 28px;
	align-items: start;
}
.school-hero__copy { grid-area: copy; }
.school-hero__sidebar { grid-area: sidebar; }
.school-hero__media { grid-area: media; }

.school-hero__copy h1 { font-size: var(--fs-3xl); color: var(--navy); margin-bottom: 6px; }
.school-hero__tagline { font-size: var(--fs-lg); color: var(--purple); font-weight: 600; margin-bottom: 10px; }
.school-hero__desc { color: var(--text-muted); max-width: 60ch; margin-bottom: 16px; }
.school-hero__badges { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.school-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 18px; }

.school-hero__strip { display: flex; align-items: center; gap: 8px; }
.school-hero__strip img { width: 64px; height: 64px; object-fit: cover; border-radius: 8px; }
.school-hero__strip-more {
	font-size: var(--fs-xs);
	font-weight: 700;
	color: var(--purple);
	text-decoration: none;
}

.school-hero__media {
	border-radius: var(--radius);
	overflow: hidden;
	margin-top: 8px;
}
.school-hero__media img { width: 100%; height: 100%; max-height: 420px; object-fit: cover; display: block; }

.school-hero__sidebar {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	box-shadow: 0 20px 45px rgba(13, 27, 76, 0.12);
	padding: 22px;
	align-self: start;
}
.school-hero__sidebar h3 { font-size: var(--fs-md); margin-bottom: 12px; }
.school-hero__sidebar p { margin-bottom: 10px; }
.school-hero__sidebar p a {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--text);
	text-decoration: none;
	font-size: var(--fs-sm);
}
.school-hero__sidebar p a:hover { color: var(--purple); }
.school-hero__sidebar p a svg { width: 18px; height: 18px; flex-shrink: 0; color: var(--purple); }

/* --- Quick stats bar --- */

.school-stats-bar {
	background: var(--navy);
	margin-top: 32px;
}
.school-stats-bar__inner {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	padding: 22px 0;
}
.school-stat {
	color: #fff;
	flex: 1 1 150px;
	border-right: 1px solid rgba(255, 255, 255, 0.15);
	padding-right: 20px;
}
.school-stat:last-child { border-right: none; }
.school-stat__label {
	display: block;
	font-size: var(--fs-2xs);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: rgba(255, 255, 255, 0.65);
	margin-bottom: 4px;
}
.school-stat strong { font-size: var(--fs-md); }

/* --- Tabs --- */

.school-tabs {
	position: sticky;
	top: 0;
	z-index: 20;
	background: #fff;
	border-bottom: 1px solid var(--border);
}
.school-tabs__nav {
	display: flex;
	gap: 4px;
	overflow-x: auto;
	scrollbar-width: none;
}
.school-tabs__nav::-webkit-scrollbar { display: none; }
.school-tabs__btn {
	flex-shrink: 0;
	padding: 16px 18px;
	border: none;
	background: none;
	font-weight: 700;
	font-size: var(--fs-sm);
	color: var(--text-muted);
	cursor: pointer;
	border-bottom: 3px solid transparent;
}
.school-tabs__btn:hover { color: var(--navy); }
.school-tabs__btn.is-active { color: var(--purple); border-bottom-color: var(--purple); }

/* --- About + enquiry sidebar --- */

.school-about { padding: 56px 0; background: var(--bg-soft); }
.school-about__grid {
	display: grid;
	grid-template-columns: 1.3fr 1fr;
	gap: 40px;
	align-items: start;
}
.school-about__copy { grid-column: 1; }
.school-about__video { grid-column: 1; margin-top: 24px; aspect-ratio: 16/9; border-radius: var(--radius); overflow: hidden; }
.school-about__video iframe { width: 100%; height: 100%; border: 0; }
.school-about__video video { width: 100%; height: 100%; object-fit: cover; background: #000; display: block; }
.school-about__copy h2 { font-size: var(--fs-2xl); margin-bottom: 12px; }
.school-about__copy p { color: var(--text-muted); margin-bottom: 16px; }
.school-about__highlights { list-style: none; padding: 0; display: grid; gap: 10px; }
.school-about__highlights li {
	position: relative;
	padding-left: 26px;
	font-size: var(--fs-sm);
}
.school-about__highlights li::before {
	content: "\2713";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--green);
	font-weight: 700;
}

.school-enquiry-form {
	grid-column: 2;
	grid-row: 1 / span 2;
	background: #fff;
	border-radius: var(--radius);
	box-shadow: 0 20px 45px rgba(13, 27, 76, 0.12);
	padding: 24px;
	position: sticky;
	top: 76px;
}
.school-enquiry-form h3 { font-size: var(--fs-md); margin-bottom: 16px; }
.school-enquiry-form__note { font-size: var(--fs-2xs); color: var(--text-muted); margin-top: 10px; text-align: center; }

/* --- Infrastructure / photo gallery --- */

.school-gallery { padding: 56px 0; }
.school-gallery h2 { font-size: var(--fs-2xl); margin-bottom: 24px; }
.school-gallery__row { position: relative; display: flex; align-items: center; gap: 12px; }
.school-gallery__track {
	display: flex;
	gap: 16px;
	overflow-x: auto;
	scroll-behavior: smooth;
	scrollbar-width: none;
}
.school-gallery__track::-webkit-scrollbar { display: none; }
.school-gallery__item { flex: 0 0 240px; border-radius: var(--radius); overflow: hidden; }
.school-gallery__item img { width: 100%; height: 160px; object-fit: cover; display: block; }
.school-gallery--full .school-gallery__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
}
.school-gallery--full img { width: 100%; height: 160px; object-fit: cover; border-radius: 10px; }

/* --- Contact panel --- */

.school-contact { padding: 56px 0; background: var(--bg-soft); }
.school-contact h2 { font-size: var(--fs-2xl); margin-bottom: 12px; }
.school-contact__address { color: var(--text-muted); margin-bottom: 10px; }

.school-disclosures { padding: 56px 0; }
.school-disclosures h2 { font-size: var(--fs-2xl); margin-bottom: 28px; }
.school-disclosures__group { margin-bottom: 32px; }
.school-disclosures__group:last-child { margin-bottom: 0; }
.school-disclosures__group h3 {
	font-size: var(--fs-md);
	color: var(--navy);
	margin-bottom: 10px;
	padding-bottom: 8px;
	border-bottom: 2px solid var(--bg-soft);
}
.school-disclosures__table { width: 100%; border-collapse: collapse; }
.school-disclosures__table tr { border-bottom: 1px solid var(--bg-soft); }
.school-disclosures__table tr:last-child { border-bottom: none; }
.school-disclosures__table th,
.school-disclosures__table td {
	text-align: left;
	padding: 10px 16px 10px 0;
	font-size: var(--fs-sm);
	vertical-align: top;
}
.school-disclosures__table th {
	width: 42%;
	color: var(--text-muted);
	font-weight: 600;
}
.school-disclosures__table td { color: var(--navy); font-weight: 500; }

@media (max-width: 640px) {
	.school-disclosures__table th,
	.school-disclosures__table td { display: block; width: 100%; padding: 2px 0; }
	.school-disclosures__table th { padding-top: 10px; }
	.school-disclosures__table tr { display: block; padding-bottom: 8px; }
}

@media (max-width: 1080px) {
	.school-directory__grid { grid-template-columns: repeat(2, 1fr); }
	.school-hero__grid { grid-template-columns: 1fr; grid-template-areas: "media" "copy" "sidebar"; }
	.school-about__grid { grid-template-columns: 1fr; }
	.school-enquiry-form { grid-column: 1; grid-row: auto; position: static; }
	.school-about__video { grid-column: 1; }
}

@media (max-width: 720px) {
	.school-directory__grid { grid-template-columns: 1fr; }
	.school-stats-bar__inner { gap: 16px; }
	.school-stat { flex: 1 1 45%; border-right: none; padding-right: 0; }
	.school-gallery--full .school-gallery__grid { grid-template-columns: repeat(2, 1fr); }
}

/* ==========================================================================
   Our Curriculum page + micro-landing pages (Advisor / WhatsApp / Brochure)
   ========================================================================== */

.text-center { text-align: center; }

.btn--whatsapp { background: #25D366; color: #fff; }
.btn--outline-light { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, 0.4); }

/* --- Curriculum hero --- */

/* Full-bleed banner photo, same pattern as the homepage .hero — the photo
   sits behind the whole section with the copy on a white-to-transparent
   scrim over its left side, instead of a boxed image beside the text. */
.curriculum-page-hero {
	position: relative;
	overflow: hidden;
}
.curriculum-page-hero__media {
	position: absolute;
	inset: 0;
	z-index: 0;
}
.curriculum-page-hero__photo {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: right center;
}
.curriculum-page-hero__scrim {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(90deg, #fff 0%, #fff 42%, rgba(255, 255, 255, 0.55) 54%, rgba(255, 255, 255, 0) 66%);
}
.curriculum-page-hero__inner {
	position: relative;
	z-index: 2;
	padding: 56px 24px 90px;
}
.curriculum-page-hero__copy { max-width: 560px; }
.curriculum-page-hero h1 { font-size: var(--fs-3xl); line-height: 1.15; margin-bottom: 14px; }
.curriculum-page-hero__label { font-size: var(--fs-sm); font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 6px; }
.curriculum-page-hero__tagline { font-size: var(--fs-xl); font-weight: 700; color: var(--navy); margin-bottom: 10px; }
.curriculum-page-hero__desc { color: var(--text-muted); margin-bottom: 20px; max-width: 50ch; }

/* --- 3C foundation strip --- */

.foundation-strip { padding: 0 0 56px; }
.foundation-strip__card {
	display: grid;
	grid-template-columns: 1fr 1.6fr;
	gap: 32px;
	background: var(--bg-soft);
	border-radius: var(--radius);
	padding: 32px;
	align-items: center;
}
.foundation-strip__intro h2 { font-size: var(--fs-2xl); margin-bottom: 8px; }
.foundation-strip__intro p { color: var(--text-muted); }
.foundation-strip__items { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.foundation-strip__plus { font-size: var(--fs-xl); font-weight: 700; color: var(--text-muted); padding-top: 14px; }
.foundation-strip__item { text-align: center; flex: 1; }
.foundation-strip__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	margin-bottom: 10px;
}
.foundation-strip__icon svg { width: 22px; height: 22px; }
.foundation-strip__item--character .foundation-strip__icon { background: var(--green); }
.foundation-strip__item--competence .foundation-strip__icon { background: var(--sky); }
.foundation-strip__item--content .foundation-strip__icon { background: var(--purple); }
.foundation-strip__item strong { display: block; margin-bottom: 4px; }
.foundation-strip__item span { font-size: var(--fs-2xs); color: var(--text-muted); }

/* --- 3C Character & Competence profiles --- */

.profiles-section { padding: 56px 0; }
.profiles-section h2 { font-size: var(--fs-2xl); margin-bottom: 8px; }
.profiles-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	margin-top: 32px;
}
.profile-panel { border-radius: var(--radius); padding: 28px; }
.profile-panel--character { background: #ecfdf3; }
.profile-panel--competence { background: #eef4fd; }
.profile-panel__head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 22px; }
.profile-panel__badge {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
}
.profile-panel--character .profile-panel__badge { background: var(--green); }
.profile-panel--competence .profile-panel__badge { background: var(--sky); }
.profile-panel__badge svg { width: 20px; height: 20px; }
.profile-panel__head h3 { font-size: var(--fs-lg); margin-bottom: 2px; }
.profile-panel__head p { font-size: var(--fs-xs); color: var(--text-muted); }
.profile-panel__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.profile-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 8px;
	background: #fff;
	border-radius: var(--radius);
	padding: 16px 8px;
	font-size: var(--fs-xs);
	font-weight: 600;
	color: var(--navy);
}
.profile-item__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
}
.profile-panel--character .profile-item__icon { color: var(--green); }
.profile-panel--competence .profile-item__icon { color: var(--sky); }
.profile-item__icon svg { width: 22px; height: 22px; }

/* --- Inquiry cycle flow --- */

.inquiry-flow { padding: 56px 0; background: var(--bg-soft); }
.inquiry-flow h2 { font-size: var(--fs-2xl); margin-bottom: 8px; }
.inquiry-flow__row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 8px;
	margin-top: 36px;
}
.inquiry-flow__arrow { color: var(--border); font-size: var(--fs-lg); padding-top: 24px; flex-shrink: 0; }
.inquiry-step { display: flex; flex-direction: column; align-items: center; text-align: center; flex: 1; max-width: 160px; }
.inquiry-step__number {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	color: #fff;
	font-size: var(--fs-2xs);
	font-weight: 700;
	margin-bottom: -11px;
	margin-left: 34px;
	z-index: 1;
	position: relative;
}
.inquiry-step__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: #fff;
	border: 2px solid;
	margin-bottom: 12px;
}
.inquiry-step__icon svg { width: 26px; height: 26px; }
.inquiry-step strong { font-size: var(--fs-2xs); font-weight: 800; letter-spacing: 0.03em; margin-bottom: 6px; }
.inquiry-step p { font-size: var(--fs-2xs); color: var(--text-muted); }
.inquiry-step--green .inquiry-step__number, .inquiry-step--green .inquiry-step__icon { background: var(--green); }
.inquiry-step--green .inquiry-step__icon { background: #fff; border-color: var(--green); color: var(--green); }
.inquiry-step--green strong { color: var(--green); }
.inquiry-step--sky .inquiry-step__number { background: var(--sky); }
.inquiry-step--sky .inquiry-step__icon { background: #fff; border-color: var(--sky); color: var(--sky); }
.inquiry-step--sky strong { color: var(--sky); }
.inquiry-step--purple .inquiry-step__number { background: var(--purple); }
.inquiry-step--purple .inquiry-step__icon { background: #fff; border-color: var(--purple); color: var(--purple); }
.inquiry-step--purple strong { color: var(--purple); }
.inquiry-step--orange .inquiry-step__number { background: var(--orange); }
.inquiry-step--orange .inquiry-step__icon { background: #fff; border-color: var(--orange); color: var(--orange); }
.inquiry-step--orange strong { color: var(--orange); }
.inquiry-step--pink .inquiry-step__number { background: var(--pink); }
.inquiry-step--pink .inquiry-step__icon { background: #fff; border-color: var(--pink); color: var(--pink); }
.inquiry-step--pink strong { color: var(--pink); }
.inquiry-step--teal .inquiry-step__number { background: var(--teal); }
.inquiry-step--teal .inquiry-step__icon { background: #fff; border-color: var(--teal); color: var(--teal); }
.inquiry-step--teal strong { color: var(--teal); }

/* --- Two pathways from Grade 6 --- */

.pathways-choice { padding: 56px 0; }
.pathways-choice h2 { font-size: var(--fs-2xl); margin-bottom: 8px; }
.pathways-choice__grid {
	display: grid;
	grid-template-columns: 300px 1fr;
	gap: 24px;
	margin-top: 32px;
	align-items: stretch;
}
.pathways-choice__picker { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.pathways-choice__card, .pathways-choice__pick {
	width: 100%;
	background: var(--bg-soft);
	border-radius: var(--radius);
	padding: 22px;
	text-align: center;
}
.pathways-choice__icon { display: inline-flex; color: var(--purple); margin-bottom: 8px; }
.pathways-choice__icon svg { width: 28px; height: 28px; }
.pathways-choice__card strong { display: block; font-size: var(--fs-md); }
.pathways-choice__title { display: block; font-size: var(--fs-lg); font-weight: 800; color: var(--navy); margin: 2px 0 4px; }
.pathways-choice__caption { font-size: var(--fs-2xs); color: var(--text-muted); }
.pathways-choice__sep { font-size: var(--fs-2xl); color: var(--text-muted); transform: rotate(90deg); }
.pathways-choice__from { display: block; font-size: var(--fs-2xs); color: var(--text-muted); margin-bottom: 2px; }
.pathways-choice__pick strong { display: block; font-size: var(--fs-md); margin-bottom: 12px; }
.pathways-choice__pills { display: flex; align-items: center; justify-content: center; gap: 10px; }
.pathways-choice__or { font-size: var(--fs-xs); color: var(--text-muted); }
.pill { display: inline-block; padding: 8px 18px; border-radius: 999px; font-weight: 700; font-size: var(--fs-sm); color: #fff; }
.pill--cbse { background: var(--green); }
.pill--cambridge { background: var(--orange); }

.pathways-choice__table-wrap { border-radius: var(--radius); border: 1px solid var(--border); overflow: hidden; }
.pathways-choice__table-title { text-align: center; font-weight: 700; padding: 12px; background: var(--bg-soft-2); color: var(--navy); margin: 0; }
.pathways-choice__table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.pathways-choice__table th, .pathways-choice__table td { padding: 12px 16px; text-align: left; border-bottom: 1px solid var(--border); vertical-align: top; }
.pathways-choice__table thead th:first-child { background: var(--bg-soft); }
.pathways-choice__table thead th:nth-child(2) { background: var(--navy); color: #fff; }
.pathways-choice__table thead th:nth-child(3) { background: var(--orange); color: #fff; }
.pathways-choice__table tbody td:first-child { font-weight: 700; background: var(--bg-soft); }

.pathways-choice__banner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	text-align: center;
	margin-top: 24px;
	padding: 16px 24px;
	border-radius: var(--radius);
	background: var(--bg-soft-2);
	font-size: var(--fs-sm);
	color: var(--navy);
}
.pathways-choice__banner svg { width: 24px; height: 24px; color: var(--orange); flex-shrink: 0; }

/* --- Advisor CTA banner --- */

.advisor-cta { background: linear-gradient(120deg, var(--purple-dark), #831843); color: #fff; padding: 48px 0 0; }
.advisor-cta__inner { display: grid; grid-template-columns: auto 1fr; gap: 32px; align-items: center; padding-bottom: 32px; }
.advisor-cta__photo img { border-radius: var(--radius); }
.advisor-cta__copy h2 { font-size: var(--fs-2xl); color: #fff; margin: 6px 0 10px; }
.advisor-cta__copy p { color: rgba(255, 255, 255, 0.8); margin-bottom: 20px; }
.advisor-cta__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.advisor-cta__trust {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	border-top: 1px solid rgba(255, 255, 255, 0.15);
	padding: 20px 24px;
	font-size: var(--fs-xs);
}
.advisor-cta__trust span { display: flex; align-items: center; gap: 8px; color: rgba(255, 255, 255, 0.85); }
.advisor-cta__trust svg { width: 20px; height: 20px; color: #fbbf24; }

/* --- Micro-landing pages: shared hero + card patterns --- */

.leadgen-hero { padding: 48px 0; background: var(--bg-soft); }
.leadgen-hero__grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 32px; align-items: center; }
.leadgen-hero h1 { font-size: var(--fs-3xl); margin-bottom: 8px; }
.leadgen-hero__desc { color: var(--text-muted); margin-bottom: 20px; }
.leadgen-hero__media img { border-radius: var(--radius); width: 100%; height: auto; }
.leadgen-hero__media--icon { display: flex; align-items: center; justify-content: center; }
.leadgen-hero__media--icon svg { width: 140px; height: 140px; }

.leadgen-hero__points { list-style: none; padding: 0; display: grid; gap: 16px; }
.leadgen-hero__points li { display: flex; align-items: flex-start; gap: 12px; }
.leadgen-hero__points svg { width: 24px; height: 24px; color: var(--purple); flex-shrink: 0; background: #fff; border-radius: 8px; padding: 4px; box-shadow: 0 2px 6px rgba(0,0,0,0.08); }
.leadgen-hero__points strong { display: block; }
.leadgen-hero__points small { color: var(--text-muted); }

.leadgen-form-section { padding: 48px 0 72px; }
.leadgen-card {
	max-width: 520px;
	margin: 0 auto 32px;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	box-shadow: 0 20px 45px rgba(13, 27, 76, 0.1);
	padding: 28px;
}
.leadgen-card h2 { font-size: var(--fs-xl); margin-bottom: 6px; }
.leadgen-card > p { color: var(--text-muted); margin-bottom: 16px; font-size: var(--fs-sm); }
.leadgen-card--center { text-align: center; }
.leadgen-card[hidden] { display: none; }
.leadgen-card select {
	width: 100%;
	padding: 10px 12px;
	border-radius: 9px;
	border: 1px solid var(--border);
	font-size: var(--fs-base);
}
.leadgen-card textarea {
	width: 100%;
	padding: 10px 12px;
	border-radius: 9px;
	border: 1px solid var(--border);
	font-size: var(--fs-base);
	font-family: inherit;
	resize: vertical;
}

.leadgen-helpline {
	max-width: 520px;
	margin: 0 auto;
	background: var(--bg-soft);
	border-radius: var(--radius);
	padding: 22px 28px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
}
.leadgen-helpline h3 { font-size: var(--fs-md); margin-bottom: 2px; }
.leadgen-helpline p { color: var(--text-muted); font-size: var(--fs-sm); margin-bottom: 8px; }
.leadgen-helpline__number {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 700;
	color: var(--purple);
	text-decoration: none;
	font-size: var(--fs-md);
}
.leadgen-helpline__number svg { width: 20px; height: 20px; }

.whatsapp-perks {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	max-width: 720px;
	margin: 0 auto 32px;
}
.whatsapp-perk {
	text-align: center;
	padding: 18px 12px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
}
.whatsapp-perk svg { width: 26px; height: 26px; color: #25D366; margin-bottom: 8px; }
.whatsapp-perk span { display: block; font-size: var(--fs-xs); font-weight: 700; }

.popular-queries { max-width: 520px; margin: 0 auto 24px; }
.popular-queries h3 { font-size: var(--fs-md); margin-bottom: 12px; }
.popular-queries__item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 14px 18px;
	border: 1px solid var(--border);
	border-radius: 10px;
	margin-bottom: 10px;
	text-decoration: none;
	color: var(--text);
	font-size: var(--fs-sm);
	font-weight: 600;
}
.popular-queries__item:hover { border-color: var(--purple); color: var(--purple); }

.brochure-hero { background: linear-gradient(120deg, var(--purple-dark), #831843); color: #fff; padding: 56px 0; }
.brochure-hero__grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 32px; align-items: center; }
.brochure-hero h1 { font-size: var(--fs-3xl); color: #fff; margin-bottom: 10px; }
.brochure-hero__desc { color: rgba(255, 255, 255, 0.85); max-width: 45ch; }
.brochure-hero__media img { border-radius: var(--radius); box-shadow: 0 20px 45px rgba(0,0,0,0.3); }

.brochure-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	max-width: 720px;
	margin: 0 auto 32px;
}
.brochure-stat { text-align: center; }
.brochure-stat svg { width: 24px; height: 24px; color: var(--purple); }
.brochure-stat strong { display: block; font-size: var(--fs-xl); color: var(--navy); margin-top: 6px; }
.brochure-stat span { font-size: var(--fs-2xs); color: var(--text-muted); }

@media (max-width: 1080px) {
	/* Below this width the full-bleed absolute photo has no room to breathe
	   beside the copy — revert to a stacked layout (text, then a normal
	   in-flow photo), same fallback pattern as the homepage .hero. */
	.curriculum-page-hero { display: flex; flex-direction: column; }
	.curriculum-page-hero__inner { order: -1; padding: 32px 24px 24px; }
	.curriculum-page-hero__media { position: relative; inset: auto; order: 1; }
	.curriculum-page-hero__photo { position: static; width: 100%; height: auto; }
	.curriculum-page-hero__scrim { display: none; }
	.foundation-strip__card { grid-template-columns: 1fr; }
	.profiles-grid { grid-template-columns: 1fr; }
	.inquiry-flow__row { flex-wrap: wrap; justify-content: center; }
	.inquiry-flow__arrow { display: none; }
	.inquiry-step { max-width: 200px; }
	.pathways-choice__grid { grid-template-columns: 1fr; }
	.pathways-choice__picker { flex-direction: row; align-items: stretch; }
	.pathways-choice__sep { transform: rotate(0deg); display: flex; align-items: center; }
	.advisor-cta__inner { grid-template-columns: 1fr; text-align: center; }
	.advisor-cta__photo { display: flex; justify-content: center; }
	.leadgen-hero__grid, .brochure-hero__grid { grid-template-columns: 1fr; }
	.leadgen-hero__media { order: -1; }
}

@media (max-width: 720px) {
	.school-directory__filters { flex-direction: column; align-items: stretch; }
	.school-directory__select, .school-directory__curriculum { flex-wrap: wrap; }
	.foundation-strip__items { flex-direction: column; }
	.foundation-strip__plus { padding-top: 0; }
	.profile-panel__grid { grid-template-columns: repeat(2, 1fr); }
	.pathways-choice__picker { flex-direction: column; }
	.pathways-choice__sep { transform: rotate(90deg); }
	.whatsapp-perks, .brochure-stats { grid-template-columns: repeat(2, 1fr); }
	.advisor-cta__trust { flex-direction: column; gap: 10px; }
}

/* ==========================================================================
   Admissions page
   ========================================================================== */
#visit { scroll-margin-top: 100px; }

.admissions-hero { padding: 48px 0 64px; background: var(--bg-soft); overflow: hidden; }
.admissions-hero__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 40px; align-items: center; }
.admissions-hero__copy h1 { font-size: var(--fs-3xl); line-height: 1.15; margin: 6px 0 14px; color: var(--navy); }
.admissions-hero__desc { color: var(--text-muted); margin-bottom: 20px; max-width: 46ch; }
.admissions-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 24px; }
.admissions-hero__actions .btn svg { width: 16px; height: 16px; }
.admissions-hero__badges { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 20px; }
.admissions-hero__badges li { display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm); font-weight: 600; color: var(--navy); }
.admissions-hero__badges svg { width: 18px; height: 18px; color: var(--purple); flex-shrink: 0; }

.admissions-hero__media { position: relative; }
.admissions-hero__photo,
.admissions-hero__media .ph-photo,
.admissions-hero__media .ph { width: 100%; height: 420px; object-fit: cover; border-radius: 999px 999px 24px 24px; }
.admissions-hero__quote {
	position: absolute; right: -10px; top: 70px; max-width: 220px;
	background: #fff; border-radius: var(--radius); padding: 16px 18px;
	box-shadow: 0 12px 30px rgba(16, 31, 77, 0.16);
}
.admissions-hero__quote-mark { color: var(--purple); font-size: 28px; line-height: 1; font-weight: 800; }
.admissions-hero__quote p { font-weight: 700; color: var(--navy); margin: 4px 0 8px; font-size: var(--fs-md); }
.admissions-hero__quote-caption { display: block; font-size: var(--fs-2xs); color: var(--text-muted); line-height: 1.5; }
.admissions-hero__3c {
	position: absolute; left: -10px; bottom: -8px; background: #fff; border-radius: 999px;
	width: 62px; height: 62px; display: flex; align-items: center; justify-content: center;
	font-weight: 800; color: var(--orange); font-size: var(--fs-lg);
	box-shadow: 0 8px 20px rgba(16, 31, 77, 0.16); text-align: center; flex-direction: column;
}
.admissions-hero__3c span { display: none; }

.get-started { padding: 56px 0; }
.get-started h2 { font-size: var(--fs-2xl); color: var(--navy); margin-bottom: 28px; }
.get-started__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.get-started__card {
	display: flex; align-items: stretch; background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
	overflow: hidden; text-decoration: none; transition: box-shadow .2s, transform .2s;
}
.get-started__card:hover { box-shadow: 0 12px 26px rgba(16, 31, 77, 0.1); transform: translateY(-2px); }
.get-started__body { padding: 20px; flex: 1 1 55%; min-width: 0; }
.get-started__icon {
	display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px;
	border-radius: 10px; background: var(--bg-soft-2); color: var(--purple); margin-bottom: 12px;
}
.get-started__icon svg { width: 20px; height: 20px; }
.get-started__icon--purple { color: var(--purple); background: #ede9fe; }
.get-started__icon--orange { color: var(--orange); background: #fde6d2; }
.get-started__icon--green { color: var(--green); background: #dcfce7; }
.get-started__card h3 { font-size: var(--fs-md); color: var(--navy); margin-bottom: 4px; }
.get-started__card p { color: var(--text-muted); font-size: var(--fs-xs); margin-bottom: 10px; line-height: 1.4; }
.get-started__link { font-weight: 700; color: var(--purple); font-size: var(--fs-xs); }
.get-started__photo { flex: 0 0 45%; }
.get-started__photo img,
.get-started__photo .ph-photo,
.get-started__photo .ph { width: 100%; height: 100%; object-fit: cover; display: block; }

.admission-journey h2 { color: var(--navy); }
.admission-journey__cta { margin-top: 28px; }
.admission-journey__cta .btn svg { width: 16px; height: 16px; }

.campus-visit { padding: 56px 0; background: var(--bg-soft); }
.campus-visit__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: stretch; }
.campus-visit__card {
	background: var(--navy); color: #fff; border-radius: var(--radius); padding: 28px;
}
.campus-visit__card h2 { font-size: var(--fs-xl); margin-bottom: 4px; color: #fff; }
.campus-visit__card > p { color: var(--white-muted); margin-bottom: 18px; font-size: var(--fs-sm); }
.campus-visit__card .hero__field-label { color: var(--white-strong); }
.campus-visit__card .hero__field select,
.campus-visit__card .hero__field input {
	background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.25); color: #fff;
}
.campus-visit__card .hero__field select option { color: var(--text); }
.campus-visit__card .hero__form-status { color: var(--white-strong); }
.campus-visit__card .school-enquiry-form__note { color: var(--white-muted); font-size: var(--fs-xs); margin-top: 8px; }
.campus-visit__media { border-radius: var(--radius); overflow: hidden; }
.campus-visit__media img,
.campus-visit__media .ph-photo,
.campus-visit__media .ph { width: 100%; height: 100%; min-height: 320px; object-fit: cover; }

.quick-answer { padding: 56px 0; }
.quick-answer h2 { font-size: var(--fs-2xl); color: var(--navy); margin-bottom: 28px; }
.quick-answer__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.quick-answer__card {
	display: block; text-align: center; background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
	padding: 26px 20px; text-decoration: none; transition: box-shadow .2s, transform .2s;
}
.quick-answer__card:hover { box-shadow: 0 12px 26px rgba(16, 31, 77, 0.1); transform: translateY(-2px); }
.quick-answer__icon {
	display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px;
	border-radius: 999px; background: var(--bg-soft-2); color: var(--purple); margin-bottom: 14px;
}
.quick-answer__icon svg { width: 22px; height: 22px; }
.quick-answer__icon--purple { color: var(--purple); background: #ede9fe; }
.quick-answer__icon--green { color: var(--green); background: #dcfce7; }
.quick-answer__icon--orange { color: var(--orange); background: #fde6d2; }
.quick-answer__card h3 { font-size: var(--fs-md); color: var(--navy); margin-bottom: 4px; }
.quick-answer__card p { color: var(--text-muted); font-size: var(--fs-sm); margin-bottom: 10px; }
.quick-answer__link { font-weight: 700; color: var(--purple); font-size: var(--fs-sm); }

.why-choose { padding: 56px 0; background: var(--bg-soft); }
.why-choose h2 { font-size: var(--fs-2xl); color: var(--navy); margin-bottom: 28px; }
.why-choose__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.why-choose__item { text-align: center; }
.why-choose__icon {
	display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px;
	border-radius: 999px; background: #fff; color: var(--purple); margin-bottom: 10px;
	box-shadow: 0 6px 16px rgba(16, 31, 77, 0.08);
}
.why-choose__icon svg { width: 24px; height: 24px; }
.why-choose__item strong { display: block; color: var(--navy); font-size: var(--fs-sm); margin-bottom: 3px; }
.why-choose__desc { color: var(--text-muted); font-size: var(--fs-xs); line-height: 1.4; display: block; }
.why-choose__item--green .why-choose__icon { color: var(--green); background: #dcfce7; }
.why-choose__item--green strong { color: var(--green); }
.why-choose__item--sky .why-choose__icon { color: var(--sky); background: #dbeafe; }
.why-choose__item--sky strong { color: var(--sky); }
.why-choose__item--purple .why-choose__icon { color: var(--purple); background: #ede9fe; }
.why-choose__item--purple strong { color: var(--purple); }
.why-choose__item--orange .why-choose__icon { color: var(--orange); background: #fde6d2; }
.why-choose__item--orange strong { color: var(--orange); }
.why-choose__item--pink .why-choose__icon { color: var(--pink); background: #fce7f3; }
.why-choose__item--pink strong { color: var(--pink); }
.why-choose__item--teal .why-choose__icon { color: var(--teal); background: #ccfbf1; }
.why-choose__item--teal strong { color: var(--teal); }

.admissions-faq { padding: 56px 0; }
.admissions-faq h2 { font-size: var(--fs-2xl); color: var(--navy); margin-bottom: 28px; }
.admissions-faq__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.admissions-faq__item {
	background: var(--bg-soft); border-radius: 10px; padding: 14px 18px; margin-bottom: 12px;
}
.admissions-faq__item summary {
	cursor: pointer; font-weight: 700; color: var(--navy); font-size: var(--fs-sm); list-style: none;
	display: flex; justify-content: space-between; align-items: center; gap: 12px;
}
.admissions-faq__item summary::-webkit-details-marker { display: none; }
.admissions-faq__item summary::after { content: '+'; font-size: var(--fs-lg); color: var(--purple); flex-shrink: 0; }
.admissions-faq__item[open] summary::after { content: '\2212'; }
.admissions-faq__item p { color: var(--text-muted); font-size: var(--fs-sm); margin-top: 10px; margin-bottom: 0; }

.admissions-cta { position: relative; padding: 64px 0; overflow: hidden; color: #fff; }
.admissions-cta__media { position: absolute; inset: 0; z-index: 0; }
.admissions-cta__media::after {
	content: ''; position: absolute; inset: 0;
	background: linear-gradient(100deg, rgba(16,31,77,.88), rgba(242,112,27,.55));
}
.admissions-cta__media img,
.admissions-cta__media .ph-photo,
.admissions-cta__media .ph { width: 100%; height: 100%; object-fit: cover; }
.admissions-cta__inner { position: relative; z-index: 1; text-align: center; }
.admissions-cta__inner h2 { font-size: var(--fs-3xl); margin-bottom: 8px; color: #fff; }
.admissions-cta__inner > p { color: var(--white-strong); margin-bottom: 22px; }
.admissions-cta__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }

@media (max-width: 900px) {
	.admissions-hero__grid,
	.campus-visit__grid { grid-template-columns: 1fr; }
	.admissions-hero__media { order: -1; margin-bottom: 40px; }
	.why-choose__grid { grid-template-columns: repeat(3, 1fr); }
	.admissions-hero__photo { border-radius: var(--radius); height: 320px; }
	.admissions-hero__quote { position: static; max-width: none; margin-top: 16px; }
	.admissions-hero__3c { position: static; margin-top: 12px; }
}

/* Tablet: 2-column card grids instead of jumping straight to 1 column. */
@media (max-width: 900px) and (min-width: 561px) {
	.get-started__grid,
	.quick-answer__grid,
	.admissions-faq__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 560px) {
	.why-choose__grid { grid-template-columns: repeat(2, 1fr); }
	.get-started__grid,
	.quick-answer__grid,
	.admissions-faq__grid { grid-template-columns: 1fr; }
	.get-started__card { flex-direction: column; }
	.get-started__photo { flex-basis: auto; height: 160px; }
}

/* ==========================================================================
   Why Edify page
   ========================================================================== */
/* Full-bleed banner photo, same pattern as the homepage .hero and the Our
   Curriculum page hero — the photo sits behind the whole section with the
   copy on a white-to-transparent scrim over its left side. */
.why-hero {
	position: relative;
	overflow: hidden;
}
.why-hero__media {
	position: absolute;
	inset: 0;
	z-index: 0;
}
.why-hero__photo,
.why-hero__media .ph-photo,
.why-hero__media .ph {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: right center;
	border-radius: 0;
}
.why-hero__scrim {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(90deg, #fff 0%, #fff 42%, rgba(255, 255, 255, 0.55) 54%, rgba(255, 255, 255, 0) 66%);
}
.why-hero__inner {
	position: relative;
	z-index: 2;
	padding: 56px 24px 90px;
}
.why-hero__copy { max-width: 560px; }
.why-hero__copy h1 { font-size: var(--fs-3xl); line-height: 1.15; color: var(--navy); margin-bottom: 16px; }
.why-hero__desc { color: var(--text); font-size: var(--fs-md); line-height: 1.7; max-width: 50ch; margin-bottom: 24px; }
.why-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.why-hero__actions .btn svg { width: 16px; height: 16px; }

/* Badge now sits in-flow under the actions row (it used to float over the
   boxed photo in the old 2-column layout, which no longer exists). */
.why-hero__badge {
	display: flex;
	align-items: center;
	gap: 12px;
	max-width: 380px;
	margin-top: 24px;
	background: #fff;
	border-radius: var(--radius);
	padding: 14px 16px;
	box-shadow: 0 12px 30px rgba(16, 31, 77, 0.16);
	text-align: left;
}
.why-hero__badge-icon {
	display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px;
	border-radius: 999px; background: var(--bg-soft-2); color: var(--orange); flex-shrink: 0;
}
.why-hero__badge-icon svg { width: 20px; height: 20px; }
.why-hero__badge p { font-size: var(--fs-xs); color: var(--navy); font-weight: 600; line-height: 1.5; margin: 0; }

.why-diff { padding: 56px 0; background: var(--bg-soft); }
.why-diff h2 { font-size: var(--fs-2xl); color: var(--navy); margin-bottom: 6px; }
.why-diff__sub { color: var(--text-muted); margin-bottom: 28px; }
.why-diff__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.why-diff__card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 20px; text-align: center; }
.why-diff__icon {
	display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px;
	border-radius: 12px; background: var(--bg-soft-2); margin-bottom: 12px;
}
.why-diff__icon svg { width: 20px; height: 20px; }
/* Real uploaded icon images replace the whole colored badge (they already
   include their own circular backdrop/color), rather than being squeezed
   into the 20px SVG slot inside it. */
.why-diff__icon-photo { display: block; width: 64px; height: 64px; object-fit: contain; margin: 0 auto 12px; }
.why-diff__card h3 { font-size: var(--fs-md); margin-bottom: 6px; }
.why-diff__card p { color: var(--text-muted); font-size: var(--fs-sm); }
.why-diff__card--green h3, .why-diff__card--green .why-diff__icon { color: var(--green); }
.why-diff__card--green .why-diff__icon { background: #dcfce7; }
.why-diff__card--sky h3, .why-diff__card--sky .why-diff__icon { color: var(--sky); }
.why-diff__card--sky .why-diff__icon { background: #dbeafe; }
.why-diff__card--purple h3, .why-diff__card--purple .why-diff__icon { color: var(--purple); }
.why-diff__card--purple .why-diff__icon { background: #ede9fe; }
.why-diff__card--orange h3, .why-diff__card--orange .why-diff__icon { color: var(--orange); }
.why-diff__card--orange .why-diff__icon { background: #fde6d2; }
.why-diff__card--pink h3, .why-diff__card--pink .why-diff__icon { color: var(--pink); }
.why-diff__card--pink .why-diff__icon { background: #fce7f3; }
.why-diff__card--teal h3, .why-diff__card--teal .why-diff__icon { color: var(--teal); }
.why-diff__card--teal .why-diff__icon { background: #ccfbf1; }

.why-stats { background: var(--purple-dark); padding: 36px 0; }
.why-stats__row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; }
.why-stats__item { color: #fff; text-align: center; flex: 1; min-width: 120px; }
.why-stats__icon { display: inline-flex; margin-bottom: 8px; color: rgba(255,255,255,0.7); }
.why-stats__icon svg { width: 26px; height: 26px; }
.why-stats__item strong { display: block; font-size: var(--fs-2xl); font-weight: 800; }
.why-stats__label { display: block; font-size: var(--fs-xs); color: var(--white-muted); margin-top: 2px; }

.why-exp { padding: 56px 0; }
.why-exp h2 { font-size: var(--fs-2xl); color: var(--navy); margin-bottom: 6px; }
.why-exp__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.why-exp__card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; padding-bottom: 18px; }
.why-exp__photo { height: 160px; overflow: hidden; }
.why-exp__photo img,
.why-exp__photo .ph-photo,
.why-exp__photo .ph { width: 100%; height: 100%; object-fit: cover; }
.why-exp__icon { display: inline-flex; color: var(--purple); margin: 14px 0 4px 18px; }
.why-exp__icon svg { width: 20px; height: 20px; }
.why-exp__card h3 { font-size: var(--fs-md); color: var(--navy); margin: 0 18px 4px; }
.why-exp__card p { color: var(--text-muted); font-size: var(--fs-sm); margin: 0 18px; }

.why-whole { padding: 56px 0; background: var(--bg-soft); }
.why-whole h2 { font-size: var(--fs-2xl); color: var(--navy); margin-bottom: 6px; }
.why-whole__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.why-whole__item { text-align: center; }
.why-whole__icon {
	display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px;
	border-radius: 999px; background: #fff; margin-bottom: 10px; box-shadow: 0 6px 16px rgba(16, 31, 77, 0.08);
}
.why-whole__icon svg { width: 22px; height: 22px; }
.why-whole__item strong { display: block; font-size: var(--fs-sm); margin-bottom: 3px; }
.why-whole__desc { color: var(--text-muted); font-size: var(--fs-xs); line-height: 1.4; display: block; }
.why-whole__item--green .why-whole__icon { color: var(--green); }
.why-whole__item--sky .why-whole__icon { color: var(--sky); }
.why-whole__item--purple .why-whole__icon { color: var(--purple); }
.why-whole__item--orange .why-whole__icon { color: var(--orange); }
.why-whole__item--pink .why-whole__icon { color: var(--pink); }
.why-whole__item--teal .why-whole__icon { color: var(--teal); }

.why-parent { padding: 56px 0; }
.why-parent__grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 40px; align-items: center; }
.why-parent__media img,
.why-parent__media .ph-photo,
.why-parent__media .ph { width: 100%; height: 320px; object-fit: cover; border-radius: var(--radius); }
.why-parent__icon { display: inline-flex; color: var(--purple); margin-bottom: 8px; }
.why-parent__icon svg { width: 26px; height: 26px; }
.why-parent__copy h2 { font-size: var(--fs-2xl); color: var(--navy); margin-bottom: 6px; }
.why-parent__copy > p { color: var(--text-muted); margin-bottom: 20px; }
.why-parent__items { list-style: none; padding: 0; margin: 0 0 20px; display: flex; flex-wrap: wrap; gap: 14px 22px; }
.why-parent__items li { display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm); font-weight: 600; color: var(--navy); }
.why-parent__items svg { width: 18px; height: 18px; color: var(--purple); flex-shrink: 0; }
.why-parent__link { font-weight: 700; color: var(--purple); font-size: var(--fs-sm); }

.why-global { position: relative; padding: 48px 0; overflow: hidden; }
.why-global__media { position: absolute; inset: 0; z-index: 0; }
.why-global__media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(16,31,77,.9), rgba(124,58,237,.7)); }
.why-global__media img,
.why-global__media .ph-photo,
.why-global__media .ph { width: 100%; height: 100%; object-fit: cover; }
.why-global__inner { position: relative; z-index: 1; }
.why-global h2 { color: #fff; margin-bottom: 24px; }
.why-global__row { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 14px; }
.why-global__step {
	display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; max-width: 170px;
	background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.25); border-radius: var(--radius); padding: 16px 12px;
}
.why-global__step svg { width: 22px; height: 22px; color: #fff; }
.why-global__step span { color: var(--white-strong); font-size: var(--fs-xs); font-weight: 600; }
.why-global__arrow { color: rgba(255,255,255,0.6); font-size: var(--fs-lg); }

.why-proof { padding: 56px 0; }
.why-proof h2 { font-size: var(--fs-2xl); color: var(--navy); margin-bottom: 28px; }
.why-proof__grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 32px; align-items: center; }
.why-proof__cols { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.why-proof__icon { display: inline-flex; color: var(--orange); margin-bottom: 8px; }
.why-proof__icon svg { width: 22px; height: 22px; }
.why-proof__col h3 { font-size: var(--fs-md); color: var(--navy); margin-bottom: 8px; }
.why-proof__col ul { list-style: none; padding: 0; margin: 0; }
.why-proof__col li { color: var(--text-muted); font-size: var(--fs-sm); padding: 3px 0 3px 16px; position: relative; }
.why-proof__col li::before { content: ''; position: absolute; left: 0; top: 11px; width: 5px; height: 5px; border-radius: 999px; background: var(--purple); }
.why-proof__media img,
.why-proof__media .ph-photo,
.why-proof__media .ph { width: 100%; height: 320px; object-fit: cover; border-radius: var(--radius); }

.why-community { background: var(--purple-dark); padding: 44px 0; }
.why-community__grid { display: grid; grid-template-columns: 1fr 1.3fr; gap: 32px; align-items: center; }
.why-community__copy h2 { color: #fff; font-size: var(--fs-xl); margin-bottom: 8px; }
.why-community__copy p { color: var(--white-muted); font-size: var(--fs-sm); }
.why-community__stats { display: flex; flex-wrap: wrap; gap: 24px; justify-content: flex-end; }
.why-community__stats > div { text-align: center; }
.why-community__stats strong { display: block; color: #fff; font-size: var(--fs-2xl); font-weight: 800; }
.why-community__stats span { display: block; color: var(--white-muted); font-size: var(--fs-xs); }

.why-cta { background: linear-gradient(120deg, var(--purple-dark), var(--orange)); padding: 44px 0; }
.why-cta__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; }
.why-cta__copy h2 { color: #fff; font-size: var(--fs-xl); margin-bottom: 4px; }
.why-cta__copy p { color: var(--white-strong); font-size: var(--fs-sm); }
.why-cta__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.why-cta__actions .btn { font-size: var(--fs-xs); padding: 10px 16px; }

@media (max-width: 900px) {
	/* Below this width the full-bleed absolute photo has no room to breathe
	   beside the copy — revert to a stacked layout, same fallback pattern
	   as the homepage .hero and the Our Curriculum page hero. */
	.why-hero { display: flex; flex-direction: column; }
	.why-hero__inner { order: -1; padding: 32px 24px 24px; }
	.why-hero__media { position: relative; inset: auto; order: 1; }
	.why-hero__photo,
	.why-hero__media .ph-photo,
	.why-hero__media .ph { position: static; width: 100%; height: auto; }
	.why-hero__scrim { display: none; }
	.why-hero__badge { max-width: none; }
	.why-parent__grid,
	.why-community__grid { grid-template-columns: 1fr; }
	.why-whole__grid { grid-template-columns: repeat(3, 1fr); }
	.why-stats__row { justify-content: center; }
	.why-community__stats { justify-content: flex-start; }
}

/* Tablet: 2-column card grids instead of jumping straight to 1 column. */
@media (max-width: 900px) and (min-width: 561px) {
	.why-diff__grid,
	.why-exp__grid { grid-template-columns: repeat(2, 1fr); }
	.why-proof__grid { grid-template-columns: 1fr; }
	.why-proof__cols { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 560px) {
	.why-whole__grid { grid-template-columns: repeat(2, 1fr); }
	.why-diff__grid,
	.why-exp__grid,
	.why-proof__cols { grid-template-columns: 1fr; }
	.why-proof__grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Parent Resources page
   ========================================================================== */

/* Pastel badge-tint backgrounds sampled directly from the Parent Resources
   mockup (part1/part2/part3.jpeg) — visibly more saturated than the site's
   existing --bg-soft-2-based icon badges (#ede9fe etc.), so kept as their
   own tokens rather than reusing those. Icon strokes still use the existing
   --purple/--sky/--green/--pink/--orange/--teal accent tokens, which already
   matched the mockup's icon-line hues closely on inspection. */
:root {
	--pr-purple-tint: #cdb8e6;
	--pr-sky-tint: #c9dcf2;
	--pr-green-tint: #c8ecc0;
	--pr-pink-tint: #f2bcdb;
	--pr-orange-tint: #f9e2c4;
	--pr-teal-tint: #c5efed;
}

.pr-hero { padding: 48px 0 60px; background: var(--bg-soft); overflow: hidden; }
.pr-hero__grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 40px; align-items: center; }
.pr-hero__copy h1 { font-size: var(--fs-3xl); line-height: 1.2; color: var(--navy); margin-bottom: 14px; }
.pr-hero__desc { color: var(--text-muted); max-width: 46ch; margin-bottom: 22px; }
.pr-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 22px; }
.pr-hero__actions .btn svg { width: 16px; height: 16px; }
.pr-hero__tagline { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 10px 18px; font-size: var(--fs-sm); font-weight: 600; color: var(--navy); }
.pr-hero__tagline li { position: relative; }
.pr-hero__tagline li:not(:last-child)::after { content: '\2022'; position: absolute; right: -14px; color: var(--orange); }
.pr-hero__media { border-radius: var(--radius); overflow: hidden; }
.pr-hero__photo,
.pr-hero__media .ph-photo,
.pr-hero__media .ph { width: 100%; height: 440px; object-fit: cover; border-radius: var(--radius); display: block; }

/* Shared section header row (heading [+ optional sub-copy] + "View All…" link) */
.pr-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 8px; flex-wrap: wrap; }
.pr-section-head h2 { font-size: var(--fs-2xl); color: var(--navy); margin: 0; }
.pr-section-head__link { font-weight: 700; color: var(--purple); font-size: var(--fs-sm); flex-shrink: 0; }
.pr-section-sub { color: var(--text-muted); font-size: var(--fs-sm); margin: 4px 0 24px; }

.pr-topics { padding: 56px 0; }
.pr-topics__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; margin-top: 20px; }
.pr-topic { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 22px 16px; text-align: center; display: block; }
.pr-topic:hover { box-shadow: 0 12px 26px rgba(16, 31, 77, 0.1); transform: translateY(-2px); }
.pr-topic__icon { width: 52px; height: 52px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 12px; }
.pr-topic__icon svg { width: 24px; height: 24px; }
.pr-topic strong { display: block; color: var(--navy); font-size: var(--fs-sm); line-height: 1.3; margin-bottom: 6px; min-height: 2.6em; }
.pr-topic__link { color: var(--purple); font-weight: 700; font-size: var(--fs-xs); }
.pr-topic--purple .pr-topic__icon { background: var(--pr-purple-tint); color: var(--purple); }
.pr-topic--sky .pr-topic__icon { background: var(--pr-sky-tint); color: var(--sky); }
.pr-topic--green .pr-topic__icon { background: var(--pr-green-tint); color: var(--green); }
.pr-topic--pink .pr-topic__icon { background: var(--pr-pink-tint); color: var(--pink); }
.pr-topic--orange .pr-topic__icon { background: var(--pr-orange-tint); color: var(--orange); }
.pr-topic--teal .pr-topic__icon { background: var(--pr-teal-tint); color: var(--teal); }

.pr-reading { padding: 56px 0; background: var(--bg-soft-2); }
.pr-reading__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.pr-reading__card { display: block; background: #fff; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--border); }
.pr-reading__card:hover { box-shadow: 0 12px 26px rgba(16, 31, 77, 0.1); transform: translateY(-2px); }
.pr-reading__media { position: relative; }
.pr-reading__media img,
.pr-reading__media .ph-photo,
.pr-reading__media .ph { width: 100%; height: 190px; object-fit: cover; display: block; }
.pr-reading__play { position: absolute; inset: 0; margin: auto; width: 44px; height: 44px; border-radius: 50%; background: rgba(16, 31, 77, 0.55); color: #fff; display: flex; align-items: center; justify-content: center; font-size: var(--fs-md); }
.pr-badge { position: absolute; top: 12px; left: 12px; padding: 4px 10px; border-radius: 999px; font-size: var(--fs-3xs); font-weight: 700; letter-spacing: 0.03em; color: #fff; }
.pr-badge--article { background: var(--purple); }
.pr-badge--guide { background: var(--orange); }
.pr-badge--video { background: var(--navy); }
.pr-reading__body { padding: 18px; }
.pr-reading__body h3 { font-size: var(--fs-md); color: var(--navy); margin-bottom: 6px; line-height: 1.3; }
.pr-reading__body p { color: var(--text-muted); font-size: var(--fs-xs); line-height: 1.5; margin-bottom: 14px; }
.pr-reading__meta { display: flex; align-items: center; justify-content: space-between; font-size: var(--fs-2xs); color: var(--text-muted); }
.pr-reading__meta svg { width: 13px; height: 13px; vertical-align: -2px; margin-right: 3px; }
.pr-reading__cta { color: var(--purple); font-weight: 700; }

.pr-experts { padding: 56px 0; }
.pr-experts__row { display: flex; align-items: center; gap: 12px; margin-top: 8px; }
.pr-experts__track { display: flex; gap: 20px; overflow-x: auto; flex: 1; padding: 8px 2px; scroll-snap-type: x proximity; }
.pr-expert { flex: 0 0 170px; scroll-snap-align: start; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 18px 14px; text-align: center; display: block; }
.pr-expert:hover { box-shadow: 0 12px 26px rgba(16, 31, 77, 0.1); transform: translateY(-2px); }
.pr-expert__photo { width: 84px; height: 84px; border-radius: 50%; overflow: hidden; margin: 0 auto 10px; }
.pr-expert__photo img,
.pr-expert__photo .ph-photo,
.pr-expert__photo .ph { width: 100%; height: 100%; object-fit: cover; }
.pr-expert strong { display: block; color: var(--navy); font-size: var(--fs-sm); margin-bottom: 2px; }
.pr-expert__role { display: block; color: var(--text-muted); font-size: var(--fs-2xs); margin-bottom: 8px; }
.pr-expert__tag { display: inline-block; background: var(--bg-soft-2); color: var(--purple); font-size: var(--fs-3xs); font-weight: 700; padding: 3px 9px; border-radius: 999px; margin-bottom: 10px; }
.pr-expert__link { display: block; color: var(--purple); font-weight: 700; font-size: var(--fs-2xs); }

.pr-quick { padding: 56px 0; background: var(--bg-soft); }
.pr-quick__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; margin-top: 8px; }
.pr-quick__card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 20px 14px; text-align: center; display: block; }
.pr-quick__card:hover { box-shadow: 0 12px 26px rgba(16, 31, 77, 0.1); transform: translateY(-2px); }
.pr-quick__icon { width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 12px; }
.pr-quick__icon svg { width: 22px; height: 22px; }
.pr-quick__card p { color: var(--navy); font-weight: 600; font-size: var(--fs-sm); min-height: 2.6em; margin-bottom: 8px; }
.pr-quick__link { color: var(--purple); font-weight: 700; font-size: var(--fs-xs); }
.pr-quick__icon--purple { background: var(--pr-purple-tint); color: var(--purple); }
.pr-quick__icon--orange { background: var(--pr-orange-tint); color: var(--orange); }
.pr-quick__icon--teal { background: var(--pr-teal-tint); color: var(--teal); }
.pr-quick__icon--pink { background: var(--pr-pink-tint); color: var(--pink); }
.pr-quick__icon--sky { background: var(--pr-sky-tint); color: var(--sky); }
.pr-quick__icon--green { background: var(--pr-green-tint); color: var(--green); }

.pr-guides { padding: 56px 0; }
.pr-guides__row { display: flex; align-items: center; gap: 12px; margin-top: 8px; }
.pr-guides__track { display: flex; gap: 20px; overflow-x: auto; flex: 1; padding: 8px 2px; scroll-snap-type: x proximity; }
.pr-guide { flex: 0 0 190px; scroll-snap-align: start; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; background: #fff; }
.pr-guide__media { position: relative; padding: 14px 12px 0; height: 150px; display: flex; align-items: flex-end; }
.pr-guide__media img,
.pr-guide__media .ph-photo,
.pr-guide__media .ph { width: 100%; height: 108px; object-fit: cover; border-radius: 8px 8px 0 0; }
.pr-guide__label { position: absolute; top: 12px; left: 12px; right: 12px; font-size: var(--fs-3xs); font-weight: 800; letter-spacing: 0.02em; padding: 4px 8px; border-radius: 4px; background: rgba(255, 255, 255, 0.9); }
.pr-guide__media--orange { background: var(--pr-orange-tint); }
.pr-guide__media--orange .pr-guide__label { color: var(--orange); }
.pr-guide__media--purple { background: var(--pr-purple-tint); }
.pr-guide__media--purple .pr-guide__label { color: var(--purple); }
.pr-guide__media--green { background: var(--pr-green-tint); }
.pr-guide__media--green .pr-guide__label { color: var(--green); }
.pr-guide__media--sky { background: var(--pr-sky-tint); }
.pr-guide__media--sky .pr-guide__label { color: var(--sky); }
.pr-guide__media--pink { background: var(--pr-pink-tint); }
.pr-guide__media--pink .pr-guide__label { color: var(--pink); }
.pr-guide__media--teal { background: var(--pr-teal-tint); }
.pr-guide__media--teal .pr-guide__label { color: var(--teal); }
.pr-guide__body { padding: 14px; }
.pr-guide__body strong { display: block; color: var(--navy); font-size: var(--fs-sm); line-height: 1.3; margin-bottom: 8px; min-height: 2.6em; }
.pr-guide__link { color: var(--purple); font-weight: 700; font-size: var(--fs-xs); }

.pr-videos { padding: 56px 0; background: var(--bg-soft-2); }
.pr-videos h2 { font-size: var(--fs-2xl); color: var(--navy); margin-bottom: 4px; }
.pr-videos__grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 20px; margin-top: 24px; }
.pr-video { position: relative; display: block; width: 100%; border: 0; padding: 0; cursor: pointer; border-radius: var(--radius); overflow: hidden; text-align: left; background: var(--navy); }
.pr-video img,
.pr-video .ph-photo,
.pr-video .ph { width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0.85; }
.pr-video--featured { min-height: 360px; }
.pr-video--featured img,
.pr-video--featured .ph-photo { height: 360px; }
.pr-video__badge { position: absolute; top: 14px; left: 14px; z-index: 1; background: var(--purple); color: #fff; font-size: var(--fs-3xs); font-weight: 700; padding: 4px 10px; border-radius: 999px; }
.pr-video__play { position: absolute; inset: 0; margin: auto; width: 56px; height: 56px; border-radius: 50%; background: rgba(255, 255, 255, 0.92); color: var(--navy); display: flex; align-items: center; justify-content: center; font-size: var(--fs-lg); }
.pr-video--featured .pr-video__play { width: 68px; height: 68px; }
.pr-video__info { position: absolute; left: 14px; right: 14px; bottom: 12px; color: #fff; }
.pr-video__info strong { display: block; font-size: var(--fs-sm); line-height: 1.3; }
.pr-video--featured .pr-video__info strong { font-size: var(--fs-lg); }
.pr-video__info span { display: block; font-size: var(--fs-2xs); color: var(--white-muted); margin-top: 2px; }
.pr-video__duration { position: absolute; right: 12px; top: 12px; background: rgba(0, 0, 0, 0.55); color: #fff; font-size: var(--fs-3xs); padding: 3px 7px; border-radius: 4px; }
.pr-video--featured .pr-video__duration { top: auto; bottom: 12px; right: 14px; }
.pr-videos__side { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; align-content: start; }
.pr-videos__side .pr-video { height: 150px; }
.pr-videos__side .pr-video img,
.pr-videos__side .pr-video .ph-photo { height: 150px; }
.pr-video__more { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 18px; }
.pr-video__more-icon { width: 40px; height: 40px; border-radius: 50%; background: var(--pr-purple-tint); color: var(--purple); display: flex; align-items: center; justify-content: center; margin-bottom: 4px; }
.pr-video__more-icon svg { width: 18px; height: 18px; }
.pr-video__more strong { color: var(--navy); font-size: var(--fs-sm); }
.pr-video__more span:not(.pr-video__more-link) { color: var(--text-muted); font-size: var(--fs-xs); }
.pr-video__more-link { color: var(--purple); font-weight: 700; font-size: var(--fs-xs); }

.pr-connect { padding: 56px 0; }
.pr-connect__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 16px; margin-top: 8px; }
.pr-connect__item { text-align: center; }
.pr-connect__photo { position: relative; border-radius: var(--radius); overflow: hidden; margin-bottom: 10px; }
.pr-connect__photo img,
.pr-connect__photo .ph-photo,
.pr-connect__photo .ph { width: 100%; height: 110px; object-fit: cover; display: block; }
.pr-connect__icon { position: absolute; bottom: -14px; left: 50%; transform: translateX(-50%); width: 34px; height: 34px; border-radius: 50%; background: var(--purple); color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 10px rgba(16, 31, 77, 0.25); }
.pr-connect__icon svg { width: 16px; height: 16px; }
.pr-connect__label { display: block; margin-top: 16px; font-size: var(--fs-xs); font-weight: 600; color: var(--navy); line-height: 1.3; }

.pr-events { padding: 56px 0; background: var(--bg-soft); }
.pr-events__row { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; margin-top: 8px; }
.pr-event { display: block; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; }
.pr-event:hover { box-shadow: 0 12px 26px rgba(16, 31, 77, 0.1); transform: translateY(-2px); }
.pr-event__date { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 10px; margin-bottom: 10px; }
.pr-event__date strong { font-size: var(--fs-md); line-height: 1; font-weight: 800; }
.pr-event__date span { font-size: 9px; font-weight: 700; letter-spacing: 0.03em; }
.pr-event__date--purple { background: var(--pr-purple-tint); color: var(--purple); }
.pr-event__date--orange { background: var(--pr-orange-tint); color: var(--orange); }
.pr-event__date--green { background: var(--pr-green-tint); color: var(--green); }
.pr-event__date--pink { background: var(--pr-pink-tint); color: var(--pink); }
.pr-event__date--sky { background: var(--pr-sky-tint); color: var(--sky); }
.pr-event__tag { display: block; color: var(--purple); font-weight: 700; font-size: var(--fs-3xs); text-transform: uppercase; letter-spacing: 0.02em; margin-bottom: 4px; }
.pr-event__title { display: block; color: var(--navy); font-size: var(--fs-xs); line-height: 1.35; margin-bottom: 8px; min-height: 2.6em; }
.pr-event__meta { display: block; color: var(--text-muted); font-size: var(--fs-3xs); margin-bottom: 8px; }
.pr-event__meta svg { width: 11px; height: 11px; vertical-align: -1px; margin-right: 3px; }
.pr-event__link { color: var(--purple); font-weight: 700; font-size: var(--fs-3xs); }

.pr-wizard { padding: 56px 0; background: var(--bg-soft-2); }
.pr-wizard__inner { text-align: center; }
.pr-wizard__intro { display: flex; align-items: center; justify-content: center; gap: 28px; text-align: left; max-width: 900px; margin: 0 auto; }
.pr-wizard__intro-text { flex: 1 1 auto; }
.pr-wizard__intro h2 { font-size: var(--fs-2xl); color: var(--navy); margin-bottom: 6px; }
.pr-wizard__intro-text > p { color: var(--text-muted); font-size: var(--fs-sm); margin-bottom: 18px; }
.pr-wizard__intro-photo { flex: 0 0 220px; border-radius: var(--radius); overflow: hidden; }
.pr-wizard__intro-photo img,
.pr-wizard__intro-photo .ph-photo,
.pr-wizard__intro-photo .ph { width: 100%; height: 150px; object-fit: cover; display: block; }
.pr-wizard__steps { list-style: none; display: flex; justify-content: center; gap: 32px; padding: 0; margin: 0 0 28px; flex-wrap: wrap; }
.pr-wizard__steps li { display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm); font-weight: 600; color: var(--navy); }
.pr-wizard__steps span { width: 24px; height: 24px; border-radius: 50%; background: var(--purple); color: #fff; font-size: var(--fs-xs); font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pr-wizard__card { text-align: left; background: #fff; border-radius: var(--radius); box-shadow: 0 20px 45px rgba(16, 31, 77, 0.1); padding: 26px; display: grid; grid-template-columns: 1fr 1.4fr 1fr; gap: 24px; }
.pr-wizard__col h3 { display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm); color: var(--navy); margin-bottom: 14px; }
.pr-wizard__col h3 svg { width: 18px; height: 18px; color: var(--purple); }
.pr-wizard__col select { width: 100%; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--border); font-family: inherit; font-size: var(--fs-sm); background: #fff; }
.pr-wizard__options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.pr-wizard__option { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 6px; border-radius: 10px; border: 1px solid var(--border); background: #fff; font-size: var(--fs-2xs); font-weight: 600; color: var(--text-muted); cursor: pointer; }
.pr-wizard__option svg { width: 18px; height: 18px; }
.pr-wizard__option.is-selected,
.pr-wizard__option:hover { border-color: var(--purple); color: var(--purple); background: var(--pr-purple-tint); }
.pr-wizard__col--result { background: var(--bg-soft-2); border-radius: 12px; padding: 18px; }
.pr-wizard__col--result p { color: var(--text-muted); font-size: var(--fs-xs); margin-bottom: 14px; }
.pr-wizard__status { font-size: var(--fs-xs); color: var(--purple); margin-top: 10px; min-height: 1.2em; }

.is-highlighted { animation: pr-highlight-flash 1.6s ease; }
@keyframes pr-highlight-flash {
	0% { box-shadow: inset 0 0 0 999px rgba(124, 58, 237, 0.08); }
	100% { box-shadow: inset 0 0 0 999px rgba(124, 58, 237, 0); }
}

.pr-newsletter { padding: 56px 0; }
.pr-newsletter__grid { display: grid; grid-template-columns: 1.3fr auto 1fr; gap: 28px; align-items: center; }
.pr-newsletter__form-card,
.pr-newsletter__whatsapp { background: var(--bg-soft-2); border-radius: var(--radius); padding: 28px; }
.pr-newsletter__icon { width: 46px; height: 46px; border-radius: 50%; background: var(--pr-purple-tint); color: var(--purple); display: flex; align-items: center; justify-content: center; margin-bottom: 14px; }
.pr-newsletter__icon--green { background: #dcfce7; color: var(--green); }
.pr-newsletter__icon svg { width: 20px; height: 20px; }
.pr-newsletter__form-card h2 { font-size: var(--fs-lg); color: var(--navy); margin-bottom: 6px; }
.pr-newsletter__form-card p,
.pr-newsletter__whatsapp p { color: var(--text-muted); font-size: var(--fs-sm); margin-bottom: 18px; }
.pr-newsletter__whatsapp h3 { font-size: var(--fs-lg); color: var(--navy); margin-bottom: 6px; }
.pr-newsletter__phone { display: flex; align-items: center; gap: 8px; }
.pr-newsletter__phone-prefix { flex-shrink: 0; font-size: var(--fs-sm); color: var(--text); }
.pr-newsletter__phone input { flex: 1; }
.pr-newsletter__divider { color: var(--text-muted); font-weight: 700; font-size: var(--fs-xs); }

.get-started.pr-explore { background: var(--bg-soft); }

@media (max-width: 1080px) {
	.pr-hero__grid { grid-template-columns: 1fr; }
	.pr-hero__media { order: -1; margin-bottom: 24px; }
	.pr-topics__grid,
	.pr-quick__grid { grid-template-columns: repeat(4, 1fr); }
	.pr-connect__grid { grid-template-columns: repeat(4, 1fr); }
	.pr-events__row { grid-template-columns: repeat(3, 1fr); }
	.pr-wizard__card { grid-template-columns: 1fr; }
	.pr-newsletter__grid { grid-template-columns: 1fr; }
	.pr-newsletter__divider { text-align: center; }
}

@media (max-width: 900px) {
	.pr-reading__grid { grid-template-columns: repeat(2, 1fr); }
	.pr-videos__grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
	.pr-topics__grid,
	.pr-quick__grid { grid-template-columns: repeat(3, 1fr); }
	.pr-connect__grid { grid-template-columns: repeat(3, 1fr); }
	.pr-events__row { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 560px) {
	.pr-topics__grid,
	.pr-quick__grid,
	.pr-connect__grid,
	.pr-events__row,
	.pr-reading__grid { grid-template-columns: repeat(2, 1fr); }
	.pr-videos__side { grid-template-columns: 1fr; }
	.pr-wizard__options { grid-template-columns: repeat(2, 1fr); }
	.pr-hero__photo,
	.pr-hero__media .ph-photo { height: 280px; }
	.pr-wizard__intro { flex-direction: column; text-align: center; }
	.pr-wizard__intro-photo { flex-basis: auto; width: 100%; max-width: 320px; }
}

/* Real cropped-from-mockup icon badge photos (ews_parent_icon()'s theme_mod
   path) — sized to fill the same circular container the hand-drawn SVG
   icons use, so both render identically regardless of which one is active. */
.pr-topic__icon img.pr-icon-photo,
.pr-quick__icon img.pr-icon-photo,
.pr-connect__icon img.pr-icon-photo,
.pr-video__more-icon img.pr-icon-photo,
.pr-wizard__option img.pr-icon-photo { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }
.pr-wizard__option img.pr-icon-photo { width: 20px; height: 20px; }

/* Quick-answer cards are a native <details>/<summary> accordion (same
   disclosure pattern as .admissions-faq__item) instead of a dead link. */
.pr-quick__card summary { list-style: none; cursor: pointer; }
.pr-quick__card summary::-webkit-details-marker { display: none; }
.pr-quick__card[open] { text-align: left; }
.pr-quick__card[open] summary { text-align: center; }
.pr-quick__answer { color: var(--text-muted); font-size: var(--fs-xs); line-height: 1.5; margin: 12px 0 0; text-align: left; }

/* Guide modal — plain vanilla-JS overlay (main.js), no new dependency. */
.pr-guide-modal { position: fixed; inset: 0; z-index: 300; display: flex; align-items: center; justify-content: center; padding: 20px; }
.pr-guide-modal[hidden] { display: none; }
.pr-guide-modal__backdrop { position: absolute; inset: 0; background: rgba(16, 31, 77, 0.55); }
.pr-guide-modal__panel { position: relative; background: #fff; border-radius: var(--radius); max-width: 560px; width: 100%; max-height: 84vh; overflow-y: auto; padding: 32px 28px; }
.pr-guide-modal__close { position: absolute; top: 14px; right: 14px; width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--border); background: #fff; font-size: var(--fs-lg); line-height: 1; cursor: pointer; }
.pr-guide-modal__panel h2 { font-size: var(--fs-xl); color: var(--navy); margin: 0 0 16px; padding-right: 30px; }
.pr-guide-modal__body { font-size: var(--fs-sm); color: var(--text); line-height: 1.6; }
.pr-guide-modal__body ul { margin: 0; padding-left: 20px; }
.pr-guide-modal__body li { margin-bottom: 8px; }
.pr-guide-modal__print { margin-top: 20px; }
@media print {
	.site-header, .site-footer, .quick-sidebar, .pr-guide-modal__backdrop, .pr-guide-modal__close, .pr-guide-modal__print { display: none !important; }
	.pr-guide-modal { position: static; padding: 0; }
	.pr-guide-modal__panel { max-height: none; box-shadow: none; }
}

/* ==========================================================================
   Blog (single.php / home.php) — minimal styling for the Stories & News
   posts linked from Parent Resources' "Worth Reading This Week".
   ========================================================================== */
.blog-post__hero { position: relative; margin-bottom: 32px; }
/* These featured photos are reused from the small "Worth Reading This Week"
   card crops (~260px source) — capped narrower and shorter here, rather
   than stretched full-bleed, to keep the upscale blur from a low-res source
   less visible at hero size. */
.blog-post__hero-media { max-width: 720px; margin: 0 auto; }
.blog-post__hero-media img { width: 100%; height: 240px; object-fit: cover; display: block; border-radius: var(--radius); }
.blog-post__hero-inner { padding: 28px 0 0; }
.blog-post__hero-inner h1 { font-size: var(--fs-3xl); color: var(--navy); margin: 4px 0 0; }
.blog-post__body { max-width: 720px; margin: 0 auto 56px; }
.blog-post__body .entry-content { font-size: var(--fs-base); line-height: 1.7; color: var(--text); }
.blog-post__body .entry-content p { margin-bottom: 16px; }
.blog-post__back { display: inline-block; margin-top: 24px; color: var(--purple); font-weight: 700; font-size: var(--fs-sm); }

.blog-index { padding: 56px 0; }
.blog-index h1 { font-size: var(--fs-3xl); color: var(--navy); margin: 4px 0 8px; }
.blog-index__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 28px; }
@media (max-width: 900px) { .blog-index__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .blog-index__grid { grid-template-columns: 1fr; } }

/* =========================================================================
   About Us page (page-templates/about-us.php)
   ========================================================================= */

.eyebrow--light { color: #d8d3f7; }

/* ---- Hero ------------------------------------------------------------- */
.about-hero { padding: 64px 0 56px; overflow: hidden; }
.about-hero__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.about-hero__copy h1 { font-size: clamp(28px, 3.4vw, 40px); font-weight: 800; line-height: 1.2; color: var(--navy); margin: 0 0 16px; }
.about-hero__copy p { color: var(--text-muted); font-size: var(--fs-md); max-width: 460px; margin-bottom: 24px; }
.about-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 28px; }
.about-hero__tags { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; list-style: none; padding: 0; margin: 0; font-size: var(--fs-xs); font-weight: 700; color: var(--navy); }
.about-hero__tags li { position: relative; padding-left: 16px; }
.about-hero__tags li::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 5px; height: 5px; border-radius: 50%; background: var(--orange); }
.about-hero__tags li:first-child { padding-left: 0; }
.about-hero__tags li:first-child::before { display: none; }
.about-hero__collage { display: grid; grid-template-columns: 1.2fr 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 14px; height: 460px; }
.about-hero__collage-item { border-radius: 18px; overflow: hidden; }
.about-hero__collage-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.about-hero__collage-item--1 { grid-column: 1; grid-row: 1 / 3; }
.about-hero__collage-item--2 { grid-column: 2 / 4; grid-row: 1; }
.about-hero__collage-item--3 { grid-column: 2; grid-row: 2; }
.about-hero__collage-item--4 { grid-column: 3; grid-row: 2; }

/* ---- Who We Are / Education Ecosystem grids --------------------------- */
.about-eco { padding: 56px 0; }
.about-eco h2 { font-size: var(--fs-2xl); color: var(--navy); max-width: 640px; margin-bottom: 32px; }
.about-eco__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 18px; }
.about-eco-card { border: 1px solid var(--border); border-radius: 16px; padding: 22px; background: #fff; }
.about-eco-card__icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 12px; background: var(--bg-soft); color: var(--purple); margin-bottom: 14px; }
.about-eco-card__icon svg { width: 22px; height: 22px; }
.about-eco-card strong { display: block; font-size: var(--fs-base); color: var(--navy); margin-bottom: 6px; }
.about-eco-card p { font-size: var(--fs-sm); color: var(--text-muted); margin: 0; }

/* ---- Our Journey (extends .inquiry-flow/.inquiry-step) ---------------- */
.about-journey .eyebrow { margin-bottom: 6px; }
.about-journey__step .inquiry-step__number { display: none; }

/* ---- The Edify Philosophy ---------------------------------------------- */
.about-phil { padding: 56px 0; background: var(--bg-soft); }
.about-phil__inner { display: grid; grid-template-columns: 320px 1fr; gap: 40px; align-items: center; }
.about-phil__copy h2 { font-size: var(--fs-2xl); color: var(--navy); margin: 0 0 14px; }
.about-phil__copy p { color: var(--text-muted); margin-bottom: 22px; }
.about-phil__grid { display: grid; grid-template-columns: repeat(3, 1fr) 1.4fr; gap: 14px; }
.about-phil-card { text-align: center; }
.about-phil-card__photo { border-radius: 14px; overflow: hidden; aspect-ratio: 4 / 3; margin-bottom: 10px; }
.about-phil-card__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.about-phil-card strong { display: block; font-size: var(--fs-xs); letter-spacing: 0.04em; margin-bottom: 4px; }
.about-phil-card--purple strong { color: var(--purple); }
.about-phil-card--orange strong { color: var(--orange); }
.about-phil-card--green strong { color: var(--green); }
.about-phil-card p { font-size: var(--fs-2xs); color: var(--text-muted); margin: 0; }
.about-phil-photo { border-radius: 14px; overflow: hidden; }
.about-phil-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---- 3C Curriculum ------------------------------------------------------ */
.about-c3 { padding: 56px 0; }
.about-c3__inner { display: grid; grid-template-columns: 300px 1fr; gap: 40px; align-items: center; }
.about-c3__copy h2 { font-size: var(--fs-2xl); color: var(--navy); margin: 0 0 14px; }
.about-c3__copy p { color: var(--text-muted); margin-bottom: 22px; }
.about-c3__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.about-c3-card { position: relative; }
.about-c3-card__photo { border-radius: 14px; overflow: hidden; aspect-ratio: 16 / 11; }
.about-c3-card__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.about-c3-card__icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; background: #fff; box-shadow: 0 4px 14px rgba(0,0,0,0.12); margin: -23px 0 12px 18px; position: relative; }
.about-c3-card__icon svg { width: 22px; height: 22px; }
.about-c3-card__icon--purple { color: var(--purple); }
.about-c3-card__icon--orange { color: var(--orange); }
.about-c3-card__icon--green { color: var(--green); }
.about-c3-card strong { display: block; font-size: var(--fs-xs); letter-spacing: 0.04em; margin: 0 0 6px 18px; }
.about-c3-card p { font-size: var(--fs-sm); color: var(--text-muted); margin: 0 0 0 18px; }

/* ---- Our Presence -------------------------------------------------------- */
.about-presence { padding: 56px 0; }
.about-presence__inner { display: grid; grid-template-columns: 260px 1fr 1.4fr; gap: 36px; align-items: start; }
.about-presence__copy h2 { font-size: var(--fs-2xl); color: var(--navy); margin: 0 0 20px; }
.about-presence__stat { display: flex; align-items: center; gap: 14px; border: 1px solid var(--border); border-radius: 16px; padding: 18px; margin-bottom: 18px; }
.about-presence__stat-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 12px; background: var(--bg-soft); color: var(--purple); flex-shrink: 0; }
.about-presence__stat-icon svg { width: 22px; height: 22px; }
.about-presence__stat strong { display: block; font-size: var(--fs-2xl); color: var(--navy); line-height: 1.1; }
.about-presence__stat p { margin: 2px 0 0; font-size: var(--fs-2xs); color: var(--text-muted); }
.about-presence__map { position: relative; align-self: center; }
.about-presence__map-graphic {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 1486 / 1734;
	background-image: radial-gradient(rgba(16, 31, 77, 0.16) 1.5px, transparent 2px);
	background-size: 8px 8px;
	background-color: var(--bg-soft);
	-webkit-mask-image: url("../images/india-map-outline.svg");
	mask-image: url("../images/india-map-outline.svg");
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
}
.about-presence__dot { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 4px rgba(242, 112, 27, 0.18); }
.about-presence__cities h3 { font-size: var(--fs-base); color: var(--navy); margin: 0 0 16px; }
.about-presence__cities-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.about-city-card { position: relative; border-radius: 14px; overflow: hidden; aspect-ratio: 4 / 3; }
.about-city-card img { width: 100%; height: 100%; object-fit: cover; display: block; }
.about-city-card__label { position: absolute; left: 0; right: 0; bottom: 0; padding: 10px 12px; background: linear-gradient(0deg, rgba(16,31,77,0.75), transparent); color: #fff; }
.about-city-card__label strong { display: block; font-size: var(--fs-xs); }
.about-city-card__label span { font-size: var(--fs-2xs); opacity: 0.85; }
.about-city-card--more { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; background: var(--bg-soft); color: var(--navy); font-size: var(--fs-xs); font-weight: 700; text-align: center; }
.about-city-card__more-icon { display: inline-flex; color: var(--purple); }
.about-city-card__more-icon svg { width: 24px; height: 24px; }

/* ---- Beyond the Classroom ------------------------------------------------ */
.about-beyond { padding: 56px 0; background: linear-gradient(120deg, var(--purple-dark), #2c1f63); }
.about-beyond__inner { display: grid; grid-template-columns: 300px 1fr; gap: 36px; align-items: center; }
.about-beyond__copy h2 { font-size: var(--fs-2xl); color: #fff; margin: 0 0 12px; }
.about-beyond__copy p { color: #cfc9ec; margin-bottom: 22px; font-size: var(--fs-sm); }
.about-beyond__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.about-beyond-card { position: relative; border-radius: 14px; overflow: hidden; aspect-ratio: 1 / 1; }
.about-beyond-card img { width: 100%; height: 100%; object-fit: cover; display: block; }
.about-beyond-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(16,10,40,0.78), rgba(16,10,40,0.05) 55%); }
.about-beyond-card__icon { position: absolute; top: 10px; left: 10px; z-index: 2; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: rgba(255,255,255,0.18); color: #fff; }
.about-beyond-card__icon svg { width: 16px; height: 16px; }
.about-beyond-card strong { position: absolute; left: 10px; right: 10px; bottom: 10px; z-index: 2; color: #fff; font-size: var(--fs-2xs); font-weight: 700; line-height: 1.25; }

/* ---- Parents as Partners -------------------------------------------------- */
.about-parents { padding: 56px 0; background: #fdf3ea; }
.about-parents__inner { max-width: 1000px; margin: 0 auto; }
.about-parents__copy { max-width: 640px; margin: 0 auto 32px; text-align: center; }
.about-parents__copy h2 { font-size: var(--fs-2xl); color: var(--navy); margin: 0 0 20px; }
.about-parents__copy .about-presence__stat { max-width: 280px; margin: 0 auto; background: #fff; }
.about-parents__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 32px; }
.about-parent-card { background: #fff; border-radius: 16px; overflow: hidden; }
.about-parent-card__photo { position: relative; aspect-ratio: 16 / 10; }
.about-parent-card__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.about-parent-card__icon { position: absolute; bottom: -18px; left: 16px; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: var(--orange); color: #fff; box-shadow: 0 4px 12px rgba(0,0,0,0.18); }
.about-parent-card__icon svg { width: 18px; height: 18px; }
.about-parent-card strong { display: block; font-size: var(--fs-sm); color: var(--navy); margin: 28px 16px 4px; }
.about-parent-card p { font-size: var(--fs-2xs); color: var(--text-muted); margin: 0 16px 16px; }
.about-parents__cta { text-align: center; }

@media (max-width: 1080px) {
	.about-hero__inner { grid-template-columns: 1fr; gap: 32px; }
	.about-hero__collage { height: 380px; }
	.about-phil__inner, .about-c3__inner, .about-beyond__inner { grid-template-columns: 1fr; }
	.about-phil__grid { grid-template-columns: repeat(3, 1fr); }
	.about-phil-photo { grid-column: 1 / 4; aspect-ratio: 21 / 9; }
	.about-c3__grid { grid-template-columns: repeat(3, 1fr); }
	.about-presence__inner { grid-template-columns: 1fr; }
	.about-presence__map { max-width: 360px; margin: 0 auto; }
	.about-beyond__grid { grid-template-columns: repeat(5, 1fr); }
}

@media (max-width: 900px) {
	.about-parents__grid { grid-template-columns: repeat(2, 1fr); }
	.about-presence__cities-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 720px) {
	.about-eco__grid { grid-template-columns: repeat(2, 1fr); }
	.about-c3__grid { grid-template-columns: 1fr; }
	.about-beyond__grid { grid-template-columns: repeat(3, 1fr); }
	.about-phil__grid { grid-template-columns: repeat(2, 1fr); }
	.about-phil-photo { grid-column: 1 / 3; }
}

@media (max-width: 560px) {
	.about-hero__collage { grid-template-columns: 1fr 1fr; height: 320px; }
	.about-hero__collage-item--1 { grid-column: 1 / 3; grid-row: 1; height: 160px; }
	.about-hero__collage-item--2 { grid-column: 1; grid-row: 2; }
	.about-hero__collage-item--3 { grid-column: 2; grid-row: 2; }
	.about-hero__collage-item--4 { display: none; }
	.about-eco__grid { grid-template-columns: 1fr; }
	.about-beyond__grid { grid-template-columns: repeat(2, 1fr); }
	.about-parents__grid { grid-template-columns: 1fr; }
	.about-presence__cities-grid { grid-template-columns: 1fr; }
}

/* =========================================================================
   Contact Us page (page-templates/contact-us.php)
   ========================================================================= */

.contact-breadcrumb { padding: 16px 0; font-size: var(--fs-xs); color: var(--text-muted); }
.contact-breadcrumb a { color: var(--text-muted); }
.contact-breadcrumb span[aria-hidden] { margin: 0 6px; }
.contact-breadcrumb span:last-child { color: var(--navy); font-weight: 600; }

/* ---- Hero ------------------------------------------------------------- */
.contact-hero { padding: 8px 0 48px; }
.contact-hero__inner { display: grid; grid-template-columns: 1fr 1.1fr; gap: 40px; align-items: center; }
.contact-hero__copy h1 { font-size: clamp(30px, 3.6vw, 44px); font-weight: 800; line-height: 1.15; color: var(--navy); margin: 0 0 16px; }
.contact-hero__copy p { color: var(--text-muted); font-size: var(--fs-md); max-width: 460px; margin-bottom: 24px; }
.contact-hero__traits { display: flex; flex-wrap: wrap; gap: 24px; list-style: none; padding: 0; margin: 0; }
.contact-hero__traits li { display: flex; align-items: center; gap: 8px; font-size: var(--fs-xs); font-weight: 700; color: var(--navy); }
.contact-hero__traits-icon { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: var(--bg-soft); color: var(--purple); }
.contact-hero__traits-icon svg { width: 15px; height: 15px; }
.contact-hero__photo { border-radius: 24px; overflow: hidden; aspect-ratio: 16 / 9; }
.contact-hero__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---- Connect Methods ---------------------------------------------------- */
.contact-connect { padding: 48px 0; background: var(--bg-soft); }
.contact-connect h2 { font-size: var(--fs-2xl); color: var(--navy); margin-bottom: 28px; }
.contact-connect__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 16px; }
.contact-method-card { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 20px; text-align: center; }
.contact-method-card__icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--bg-soft); color: var(--purple); margin-bottom: 14px; }
.contact-method-card__icon svg { width: 20px; height: 20px; }
.contact-method-card strong { display: block; font-size: var(--fs-sm); color: var(--navy); margin-bottom: 6px; }
.contact-method-card p { font-size: var(--fs-2xs); color: var(--text-muted); margin: 0 0 10px; }
.contact-method-card__detail { display: block; font-weight: 700; font-size: var(--fs-sm); color: var(--navy); }
.contact-method-card__sub { display: block; font-size: var(--fs-3xs); color: var(--text-muted); margin-top: 2px; }
.contact-method-card__link { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-2xs); font-weight: 700; color: var(--purple); }

/* ---- Message Form -------------------------------------------------------- */
.contact-form-section { padding: 56px 0; }
.contact-form-section__inner { display: grid; grid-template-columns: 1.7fr 1fr; gap: 28px; align-items: start; }
.contact-form-card { border: 1px solid var(--border); border-radius: 18px; padding: 28px; }
.contact-form-card h2 { font-size: var(--fs-xl); color: var(--navy); margin: 0 0 6px; }
.contact-form-card > p { color: var(--text-muted); font-size: var(--fs-sm); margin-bottom: 20px; }
.contact-form-card textarea { width: 100%; border: 1px solid var(--border); border-radius: 10px; padding: 10px 14px; font-family: inherit; font-size: var(--fs-sm); resize: vertical; }
.contact-form-card__consent { display: flex; align-items: flex-start; gap: 8px; font-size: var(--fs-2xs); color: var(--text-muted); margin: 12px 0 18px; }
.contact-form-card__consent input { margin-top: 3px; }
.contact-form-card .btn { margin-top: 4px; }
.contact-form-card__note { font-size: var(--fs-2xs); color: var(--text-muted); margin-top: 10px; }

.contact-form-sidebar { display: flex; flex-direction: column; gap: 20px; }
.contact-help-card { background: var(--bg-soft); border-radius: 18px; padding: 24px; }
.contact-help-card h3 { font-size: var(--fs-base); color: var(--navy); margin: 0 0 16px; }
.contact-help-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.contact-help-list li { display: flex; align-items: center; gap: 12px; background: #fff; border-radius: 12px; padding: 12px 14px; margin-bottom: 8px; }
.contact-help-list__icon { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 10px; background: var(--bg-soft); color: var(--purple); flex-shrink: 0; }
.contact-help-list__icon svg { width: 17px; height: 17px; }
.contact-help-list__body { display: flex; flex-direction: column; flex: 1; }
.contact-help-list__body strong { font-size: var(--fs-xs); color: var(--navy); }
.contact-help-list__body span { font-size: var(--fs-3xs); color: var(--text-muted); }
.contact-help-list__chevron { color: var(--text-muted); font-size: var(--fs-lg); }
.contact-specific-card { position: relative; background: linear-gradient(120deg, #ede9fe, #f3e8ff); border-radius: 18px; padding: 24px; overflow: hidden; }
.contact-specific-card__copy strong { display: block; font-size: var(--fs-base); color: var(--navy); margin-bottom: 6px; }
.contact-specific-card__copy p { font-size: var(--fs-2xs); color: var(--text-muted); margin: 0 0 16px; max-width: 220px; }
.contact-specific-card__icon { position: absolute; right: 16px; bottom: 12px; color: var(--purple); opacity: 0.25; }
.contact-specific-card__icon svg { width: 64px; height: 64px; }

/* ---- Find a School shortcut ------------------------------------------------ */
.contact-find { padding: 32px 0; }
.contact-find__inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; background: var(--bg-soft); border-radius: 18px; padding: 26px 28px; }
.contact-find__copy { display: flex; align-items: center; gap: 16px; }
.contact-find__icon { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: #fff; color: var(--purple); flex-shrink: 0; }
.contact-find__icon svg { width: 20px; height: 20px; }
.contact-find__copy h3 { font-size: var(--fs-base); color: var(--navy); margin: 0 0 2px; }
.contact-find__copy p { font-size: var(--fs-2xs); color: var(--text-muted); margin: 0; }
.contact-find__form { display: flex; gap: 12px; flex-wrap: wrap; }
.contact-find__form select { border: 1px solid var(--border); border-radius: 10px; padding: 10px 14px; font-size: var(--fs-sm); background: #fff; min-width: 160px; }

/* ---- Bottom band: FAQs / Commitment / Stay Connected ------------------------ */
.contact-bottom { padding: 48px 0 0; }
.contact-bottom__grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 28px; align-items: start; }
.contact-bottom__grid > div { border: 1px solid var(--border); border-radius: 18px; padding: 24px; }
.contact-bottom__grid h3 { font-size: var(--fs-base); color: var(--navy); margin: 0 0 16px; }
.contact-faq__item { border-bottom: 1px solid var(--border); padding: 12px 0; }
.contact-faq__item:first-of-type { padding-top: 0; }
.contact-faq__item summary { cursor: pointer; font-size: var(--fs-sm); font-weight: 600; color: var(--navy); list-style: none; }
.contact-faq__item summary::-webkit-details-marker { display: none; }
.contact-faq__item p { font-size: var(--fs-xs); color: var(--text-muted); margin: 8px 0 0; }
.contact-faq__view-all { display: inline-flex; align-items: center; gap: 4px; margin-top: 16px; font-size: var(--fs-xs); font-weight: 700; color: var(--purple); }
.contact-commitment > p { font-size: var(--fs-xs); color: var(--text-muted); margin: 0 0 16px; }
.contact-commitment__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.contact-commitment__list li { display: flex; align-items: center; gap: 10px; font-size: var(--fs-sm); color: var(--navy); font-weight: 600; }
.contact-commitment__check { display: inline-flex; color: var(--green); flex-shrink: 0; }
.contact-commitment__check svg { width: 18px; height: 18px; }
.contact-connected > p { font-size: var(--fs-xs); color: var(--text-muted); margin: 0 0 16px; }
.contact-connected__form { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.contact-connected__form input[type="email"] { border: 1px solid var(--border); border-radius: 10px; padding: 10px 14px; font-size: var(--fs-sm); }
.contact-connected__social { display: flex; gap: 10px; }

@media (max-width: 1080px) {
	.contact-hero__inner { grid-template-columns: 1fr; }
	.contact-form-section__inner { grid-template-columns: 1fr; }
	.contact-bottom__grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
	.contact-connect__grid { grid-template-columns: repeat(2, 1fr); }
	.contact-find__inner { flex-direction: column; align-items: stretch; }
	.contact-find__form { flex-direction: column; }
}

@media (max-width: 560px) {
	.contact-connect__grid { grid-template-columns: 1fr; }
}

/* =========================================================================
   404 page (404.php)
   ========================================================================= */

.notfound-hero { padding: 56px 0 40px; overflow: hidden; }
.notfound-hero__inner { display: grid; grid-template-columns: 1fr 1.1fr; gap: 32px; align-items: center; }
.notfound-hero__copy h1 { font-size: clamp(30px, 4vw, 46px); font-weight: 800; line-height: 1.16; color: var(--navy); margin: 0 0 18px; }
.notfound-hero__copy p { color: var(--text-muted); font-size: var(--fs-md); max-width: 400px; margin: 0 0 6px; }
.notfound-hero__copy p:last-of-type { margin-bottom: 24px; }
.notfound-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; }
.notfound-hero__actions-icon { display: inline-flex; margin-right: 4px; }
.notfound-hero__actions-icon svg { width: 15px; height: 15px; vertical-align: -2px; }
.notfound-hero__art { position: relative; text-align: center; padding: 30px 10px; }
.notfound-hero__digits { display: block; font-size: clamp(70px, 11vw, 140px); font-weight: 800; color: var(--navy); line-height: 1; letter-spacing: -0.02em; }
.notfound-hero__photo { max-width: 260px; margin: -50px auto 0; position: relative; z-index: 2; }
.notfound-hero__photo img { width: 100%; height: auto; display: block; border-radius: 16px; }
.notfound-hero__caption { position: absolute; top: 6px; right: 4%; font-family: var(--font-script); font-size: var(--fs-xl); color: var(--navy); transform: rotate(-4deg); max-width: 220px; text-align: left; line-height: 1.15; }
.notfound-hero__doodle { position: absolute; color: var(--border); opacity: 0.8; }
.notfound-hero__doodle svg { width: 26px; height: 26px; }
.notfound-hero__doodle--plane { top: 4px; right: 0; color: var(--orange); transform: rotate(20deg); }
.notfound-hero__doodle--cloud1 { top: 40%; left: 2%; }
.notfound-hero__doodle--cloud2 { top: 10%; left: 20%; }
.notfound-hero__doodle--leaf { bottom: 6%; right: 8%; color: var(--green); }

/* ---- Quick links -------------------------------------------------------- */
.notfound-links { padding: 48px 0; }
.notfound-links h2 { font-size: var(--fs-2xl); color: var(--navy); margin-bottom: 28px; position: relative; }
.notfound-links h2::after { content: ""; display: block; width: 46px; height: 3px; background: var(--orange); margin: 12px auto 0; }
.notfound-links__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; }
.notfound-link-card { display: block; background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 22px; text-align: center; }
.notfound-link-card__icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; margin-bottom: 14px; }
.notfound-link-card__icon svg { width: 21px; height: 21px; }
.notfound-link-card__icon--purple { background: #ede9fe; color: var(--purple); }
.notfound-link-card__icon--green { background: #d7f3ee; color: var(--green); }
.notfound-link-card__icon--orange { background: #fde6d2; color: var(--orange); }
.notfound-link-card strong { display: block; font-size: var(--fs-sm); color: var(--navy); margin-bottom: 4px; }
.notfound-link-card p { font-size: var(--fs-2xs); color: var(--text-muted); margin: 0 0 12px; }
.notfound-link-card__arrow { display: inline-flex; font-weight: 700; }
.notfound-link-card__arrow--purple { color: var(--purple); }
.notfound-link-card__arrow--green { color: var(--green); }
.notfound-link-card__arrow--orange { color: var(--orange); }

/* ---- Search ------------------------------------------------------------- */
.notfound-search { padding: 40px 0; background: linear-gradient(120deg, #f3f0fd, #ece5fb); }
.notfound-search__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.notfound-search__copy h3 { font-size: var(--fs-lg); color: var(--navy); margin: 0 0 4px; }
.notfound-search__copy > p { font-size: var(--fs-xs); color: var(--text-muted); margin: 0 0 16px; }
.notfound-search__form { display: flex; align-items: center; background: #fff; border-radius: 999px; padding: 6px 6px 6px 18px; gap: 10px; max-width: 480px; box-shadow: 0 6px 18px rgba(16,31,77,0.08); }
.notfound-search__form-icon { display: inline-flex; color: var(--text-muted); flex-shrink: 0; }
.notfound-search__form-icon svg { width: 16px; height: 16px; }
.notfound-search__form input { flex: 1; border: none; outline: none; font-size: var(--fs-sm); font-family: inherit; background: transparent; }
.notfound-search__form .btn { border-radius: 999px; white-space: nowrap; }
.notfound-search__btn-icon { display: inline-flex; margin-right: 4px; }
.notfound-search__btn-icon svg { width: 14px; height: 14px; vertical-align: -2px; }
.notfound-search__illustration { color: var(--purple); opacity: 0.18; flex-shrink: 0; }
.notfound-search__illustration svg { width: 110px; height: 110px; }

/* ---- Quote band --------------------------------------------------------- */
.notfound-quote { padding: 36px 0; background: #fdf3ea; }
.notfound-quote__inner { position: relative; display: flex; align-items: center; gap: 28px; }
.notfound-quote__photo { width: 130px; height: 160px; border-radius: 14px; overflow: hidden; flex-shrink: 0; }
.notfound-quote__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.notfound-quote__mark { font-size: 52px; color: var(--orange); line-height: 1; font-family: Georgia, serif; }
.notfound-quote__text { display: flex; align-items: center; gap: 12px; }
.notfound-quote__text p { font-size: var(--fs-lg); font-weight: 700; color: var(--navy); margin: 0; line-height: 1.3; }
.notfound-quote__doodle { margin-left: auto; color: var(--orange); opacity: 0.5; flex-shrink: 0; }
.notfound-quote__doodle svg { width: 40px; height: 40px; }

/* ---- Still need help bar ------------------------------------------------- */
.notfound-help { padding: 28px 0; background: var(--navy); }
.notfound-help__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; }
.notfound-help__item { display: flex; align-items: center; gap: 12px; color: #fff; }
.notfound-help__item div { display: flex; flex-direction: column; }
.notfound-help__item strong { font-size: var(--fs-xs); }
.notfound-help__item span { font-size: var(--fs-3xs); color: #b9c0dd; }
.notfound-help__item a { font-size: var(--fs-xs); font-weight: 700; color: #fff; }
.notfound-help__icon { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,0.12); color: #fff; flex-shrink: 0; }
.notfound-help__icon svg { width: 18px; height: 18px; }

@media (max-width: 1080px) {
	.notfound-hero__inner { grid-template-columns: 1fr; }
	.notfound-hero__caption { position: static; display: block; transform: none; margin: 0 auto 10px; text-align: center; }
}

@media (max-width: 720px) {
	.notfound-links__grid { grid-template-columns: repeat(2, 1fr); }
	.notfound-search__inner { justify-content: center; text-align: center; }
	.notfound-search__illustration { display: none; }
	.notfound-quote__inner { flex-direction: column; text-align: center; }
	.notfound-quote__doodle { margin: 0; }
}

@media (max-width: 560px) {
	.notfound-links__grid { grid-template-columns: 1fr; }
}

/* =========================================================================
   Book a Visit page (page-templates/book-a-visit.php)
   ========================================================================= */

/* ---- Hero ------------------------------------------------------------- */
.visit-hero { padding: 8px 0 40px; }
.visit-hero__inner { display: grid; grid-template-columns: 1fr 1.1fr; gap: 40px; align-items: center; }
.visit-hero__copy h1 { font-size: clamp(28px, 3.4vw, 40px); font-weight: 800; line-height: 1.18; color: var(--navy); margin: 0 0 14px; }
.visit-hero__copy p { color: var(--text-muted); font-size: var(--fs-sm); max-width: 420px; margin: 0 0 20px; }
.visit-hero__traits { display: flex; flex-wrap: wrap; gap: 20px; list-style: none; padding: 0; margin: 0; }
.visit-hero__traits li { display: flex; align-items: center; gap: 8px; font-size: var(--fs-2xs); font-weight: 700; color: var(--navy); max-width: 130px; }
.visit-hero__traits-icon { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: var(--bg-soft); color: var(--purple); flex-shrink: 0; }
.visit-hero__traits-icon svg { width: 15px; height: 15px; }
.visit-hero__photo { border-radius: 24px; overflow: hidden; aspect-ratio: 16 / 9; }
.visit-hero__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---- Stepper ------------------------------------------------------------ */
.visit-stepper { padding: 8px 0 32px; }
.visit-stepper__row { display: flex; align-items: flex-start; justify-content: center; flex-wrap: wrap; gap: 0; }
.visit-stepper__step { display: flex; flex-direction: column; align-items: center; gap: 8px; width: 110px; text-align: center; }
.visit-stepper__num { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: var(--bg-soft); color: var(--text-muted); font-weight: 700; font-size: var(--fs-xs); }
.visit-stepper__label { font-size: var(--fs-3xs); color: var(--text-muted); }
.visit-stepper__step.is-active .visit-stepper__num { background: var(--purple); color: #fff; }
.visit-stepper__step.is-active .visit-stepper__label { color: var(--navy); font-weight: 700; }
.visit-stepper__step.is-complete .visit-stepper__num { background: var(--green); color: #fff; }
.visit-stepper__line { flex: 1; max-width: 60px; height: 2px; background: var(--border); margin-top: 15px; }

/* ---- Body grid ------------------------------------------------------------ */
.visit-body { padding: 0 0 40px; }
.visit-body__grid { display: grid; grid-template-columns: 1fr 320px; gap: 28px; align-items: start; }
.visit-form { display: flex; flex-direction: column; gap: 20px; }
.visit-form[hidden] { display: none; }

.visit-card { border: 1px solid var(--border); border-radius: 16px; padding: 24px; background: #fff; }
.visit-card__head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 16px; }
.visit-card__num { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: var(--purple); color: #fff; font-weight: 700; font-size: var(--fs-xs); flex-shrink: 0; }
.visit-card__head h3 { font-size: var(--fs-base); color: var(--navy); margin: 0 0 2px; }
.visit-card__head p { font-size: var(--fs-2xs); color: var(--text-muted); margin: 0; }
.visit-card__body { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.visit-card__body select { flex: 1; max-width: 340px; border: 1px solid var(--border); border-radius: 10px; padding: 11px 14px; font-family: inherit; font-size: var(--fs-sm); background: #fff; }
.visit-card__body select:disabled { background: var(--bg-soft); color: var(--text-muted); }
.visit-card__art { display: inline-flex; color: var(--purple); opacity: 0.35; flex-shrink: 0; }
.visit-card__art svg { width: 56px; height: 56px; }
.visit-card__art--sm svg { width: 34px; height: 34px; }
.visit-card__body--date { flex-direction: column; align-items: stretch; }
.visit-card__body-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 14px; }
.visit-card__body-row select { flex: 1; max-width: 340px; border: 1px solid var(--border); border-radius: 10px; padding: 11px 14px; font-family: inherit; font-size: var(--fs-sm); }
.visit-card__body--details { align-items: flex-start; }
.visit-card__fields { flex: 1; display: flex; flex-direction: column; gap: 12px; max-width: 420px; }
.visit-consent { display: flex; align-items: flex-start; gap: 8px; font-size: var(--fs-2xs); color: var(--text-muted); }
.visit-consent input { margin-top: 3px; }
.visit-submit { margin-top: 20px; width: 100%; justify-content: center; }
#visit-status[data-state] { display: block; margin-bottom: 16px; padding: 10px 14px; border-radius: 10px; font-size: var(--fs-xs); }
#visit-status[data-state="error"] { background: #fee2e2; color: #b91c1c; }
#visit-status[data-state="success"] { background: #d7f3ee; color: #0f766e; }

/* ---- Date strip ----------------------------------------------------------- */
.visit-datestrip { display: flex; align-items: center; gap: 8px; }
.visit-datestrip__nav { flex-shrink: 0; width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--border); background: #fff; color: var(--navy); font-size: var(--fs-lg); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.visit-datestrip__nav:disabled { opacity: 0.35; cursor: not-allowed; }
.visit-datestrip__days { flex: 1; display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.visit-datestrip__day { display: flex; flex-direction: column; align-items: center; gap: 2px; border: 1px solid var(--border); border-radius: 10px; padding: 10px 4px; background: #fff; cursor: pointer; font-family: inherit; }
.visit-datestrip__day strong { font-size: var(--fs-base); color: var(--navy); }
.visit-datestrip__day span { font-size: var(--fs-2xs); color: var(--text-muted); }
.visit-datestrip__day em { font-size: var(--fs-3xs); color: var(--text-muted); font-style: normal; }
.visit-datestrip__day.is-selected { border-color: var(--purple); background: #f3f0fd; }
.visit-datestrip__day.is-selected strong,
.visit-datestrip__day.is-selected em { color: var(--purple); }

/* ---- Confirmation panel ---------------------------------------------------- */

/* ---- Sidebar ------------------------------------------------------------ */
.visit-sidebar { display: flex; flex-direction: column; gap: 20px; }
.visit-why-card, .visit-help-card { border: 1px solid var(--border); border-radius: 16px; padding: 22px; }
.visit-why-card h3, .visit-help-card h3 { font-size: var(--fs-base); color: var(--navy); margin: 0 0 16px; }
.visit-why-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.visit-why-list li { display: flex; align-items: flex-start; gap: 12px; }
.visit-why-list__icon { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 10px; background: var(--bg-soft); color: var(--purple); flex-shrink: 0; }
.visit-why-list__icon svg { width: 16px; height: 16px; }
.visit-why-list li > span:last-child { display: flex; flex-direction: column; }
.visit-why-list li strong { font-size: var(--fs-xs); color: var(--navy); }
.visit-why-list li span span { font-size: var(--fs-3xs); color: var(--text-muted); }
.visit-help-card > p { font-size: var(--fs-2xs); color: var(--text-muted); margin: 0 0 16px; }
.visit-help-card .btn { margin-bottom: 10px; gap: 8px; }
.visit-help-card__icon { display: inline-flex; }
.visit-help-card__icon svg { width: 15px; height: 15px; }
.visit-help-card__whatsapp small { display: block; font-weight: 400; opacity: 0.8; }
.visit-help-card__photo { margin-top: 14px; border-radius: 12px; overflow: hidden; }
.visit-help-card__photo img { width: 100%; height: auto; display: block; }

/* ---- Trust band ----------------------------------------------------------- */
.visit-trust { padding: 40px 0 56px; }
.visit-trust h2 { font-size: var(--fs-xl); color: var(--navy); margin-bottom: 28px; }
.visit-trust__row { display: flex; flex-wrap: wrap; justify-content: center; gap: 32px; margin-bottom: 20px; }
.visit-trust__item { display: flex; align-items: center; gap: 10px; font-size: var(--fs-xs); font-weight: 700; color: var(--navy); }
.visit-trust__icon { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--bg-soft); color: var(--purple); }
.visit-trust__icon svg { width: 17px; height: 17px; }
.visit-trust__note { text-align: center; font-size: var(--fs-2xs); color: var(--text-muted); margin: 0; }

@media (max-width: 1080px) {
	.visit-hero__inner { grid-template-columns: 1fr; }
	.visit-body__grid { grid-template-columns: 1fr; }
	.visit-stepper__step { width: 90px; }
	.visit-stepper__line { max-width: 30px; }
}

@media (max-width: 720px) {
	.visit-card__body { flex-direction: column; align-items: stretch; }
	.visit-card__body select { max-width: none; }
	.visit-card__art { display: none; }
	.visit-card__body-row { flex-direction: column; align-items: stretch; }
	.visit-card__body-row .visit-card__art--sm { display: none; }
	.visit-datestrip__days { grid-template-columns: repeat(3, 1fr); }
	.visit-stepper__row { justify-content: flex-start; overflow-x: auto; }
}

@media (max-width: 560px) {
	.visit-datestrip__days { grid-template-columns: repeat(2, 1fr); }
}

/* =========================================================================
   Shared "Thank You" confirmation panel (template-parts/thank-you-panel.php)
   Themed via .thankyou--green / .thankyou--purple modifiers.
   ========================================================================= */

.thankyou { border: 1px solid var(--border); border-radius: 18px; padding: 40px 32px; text-align: center; }
.thankyou[hidden] { display: none; }
.thankyou__badge { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 999px; font-size: var(--fs-2xs); font-weight: 700; margin-bottom: 20px; }
.thankyou__badge svg { width: 13px; height: 13px; }
.thankyou__icon { position: relative; display: inline-flex; margin-bottom: 20px; }
.thankyou__icon-circle { display: inline-flex; align-items: center; justify-content: center; width: 90px; height: 90px; border-radius: 50%; }
.thankyou__icon-circle svg { width: 40px; height: 40px; }
.thankyou__icon-badge { position: absolute; right: -2px; bottom: -2px; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; color: #fff; border: 3px solid #fff; }
.thankyou__icon-badge svg { width: 14px; height: 14px; }
.thankyou__heading { font-size: var(--fs-2xl); font-weight: 800; color: var(--navy); line-height: 1.3; margin: 0 0 12px; }
.thankyou__body { font-size: var(--fs-sm); color: var(--text-muted); max-width: 440px; margin: 0 auto 28px; }

.thankyou__next { border: 1px solid var(--border); border-radius: 14px; padding: 20px; margin-bottom: 24px; }
.thankyou__next h3 { font-size: var(--fs-sm); color: var(--navy); margin: 0 0 18px; }
.thankyou__steps { display: flex; align-items: flex-start; justify-content: center; gap: 8px; }
.thankyou__step { display: flex; flex-direction: column; align-items: center; gap: 6px; flex: 1; max-width: 150px; }
.thankyou__step-icon { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; }
.thankyou__step-icon svg { width: 18px; height: 18px; }
.thankyou__step-num { font-size: var(--fs-3xs); font-weight: 700; color: var(--text-muted); }
.thankyou__step p { font-size: var(--fs-2xs); color: var(--text-muted); margin: 0; }
.thankyou__step-arrow { color: var(--border); font-size: var(--fs-lg); padding-top: 12px; flex-shrink: 0; }

.thankyou__quick h3 { font-size: var(--fs-sm); color: var(--navy); margin: 0 0 14px; }
.thankyou__quick-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 24px; }
.thankyou__quick-card { display: flex; flex-direction: column; align-items: center; gap: 8px; border: 1px solid var(--border); border-radius: 12px; padding: 16px 8px; font-size: var(--fs-3xs); font-weight: 700; color: var(--navy); }
.thankyou__quick-card-icon { display: inline-flex; color: var(--green); }
.thankyou__quick-card-icon svg { width: 18px; height: 18px; }

.thankyou__banner { position: relative; display: flex; align-items: center; gap: 16px; background: var(--bg-soft); border-radius: 14px; padding: 14px 20px; text-align: left; }
.thankyou__banner-photo { width: 70px; height: 56px; border-radius: 10px; overflow: hidden; flex-shrink: 0; }
.thankyou__banner-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.thankyou__banner p { font-size: var(--fs-xs); font-weight: 700; color: var(--navy); margin: 0; }
.thankyou__banner-heart { margin-left: auto; color: var(--border); flex-shrink: 0; }
.thankyou__banner-heart svg { width: 18px; height: 18px; }

.thankyou--green .thankyou__badge { background: #d7f3ee; color: #0f766e; }
.thankyou--green .thankyou__icon-circle { background: #d7f3ee; color: var(--green); }
.thankyou--green .thankyou__icon-badge { background: var(--green); }
.thankyou--green .thankyou__heading-accent { color: var(--green); }
.thankyou--green .thankyou__step-icon { background: #d7f3ee; color: var(--green); }
.thankyou--green .thankyou__quick-card-icon { color: var(--green); }

.thankyou--purple .thankyou__badge { background: #ede9fe; color: var(--purple); }
.thankyou--purple .thankyou__icon-circle { background: #ede9fe; color: var(--purple); }
.thankyou--purple .thankyou__icon-badge { background: var(--purple); }
.thankyou--purple .thankyou__heading-accent { color: var(--purple); }
.thankyou--purple .thankyou__step-icon { background: #ede9fe; color: var(--purple); }
.thankyou--purple .thankyou__quick-card-icon { color: var(--purple); }

@media (max-width: 720px) {
	.thankyou__steps { flex-direction: column; align-items: stretch; }
	.thankyou__step { max-width: none; flex-direction: row; text-align: left; }
	.thankyou__step p { text-align: left; }
	.thankyou__step-arrow { display: none; }
	.thankyou__quick-grid { grid-template-columns: repeat(2, 1fr); }
	.thankyou__banner { flex-direction: column; text-align: center; }
	.thankyou__banner-heart { margin-left: 0; }
}

/* =========================================================================
   Curriculum Advisor page (page-templates/curriculum-advisor.php)
   ========================================================================= */

/* ---- Hero ------------------------------------------------------------- */
.advisor-hero { padding: 8px 0 40px; overflow: visible; }
.advisor-hero__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.advisor-hero__copy h1 { font-size: clamp(30px, 3.6vw, 44px); font-weight: 800; color: var(--navy); margin: 0 0 14px; }
.advisor-hero__copy p { color: var(--text-muted); font-size: var(--fs-md); max-width: 420px; margin: 0; }
.advisor-hero__photo { position: relative; border-radius: 24px; overflow: hidden; aspect-ratio: 16 / 10; }
.advisor-hero__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.advisor-hero__badge { position: absolute; display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; background: #fff; box-shadow: 0 8px 20px rgba(16,31,77,0.15); color: var(--purple); }
.advisor-hero__badge svg { width: 20px; height: 20px; }
.advisor-hero__badge--1 { top: -14px; left: 30%; }
.advisor-hero__badge--2 { bottom: -14px; left: -14px; color: var(--green); }
.advisor-hero__badge--3 { top: 40%; right: -14px; color: var(--orange); }

/* ---- Stepper ------------------------------------------------------------ */
.advisor-body { padding: 32px 0 56px; }
.advisor-stepper { display: flex; align-items: flex-start; gap: 12px; border: 1px solid var(--border); border-radius: 18px; padding: 24px; margin-bottom: 28px; flex-wrap: wrap; }
.advisor-stepper__step { display: flex; align-items: center; gap: 12px; padding-bottom: 12px; border-bottom: 3px solid transparent; }
.advisor-stepper__step.is-active { border-bottom-color: var(--purple); }
.advisor-stepper__num { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: var(--bg-soft); color: var(--text-muted); font-weight: 700; font-size: var(--fs-xs); flex-shrink: 0; }
.advisor-stepper__step.is-active .advisor-stepper__num { background: var(--purple); color: #fff; }
.advisor-stepper__text { display: flex; flex-direction: column; }
.advisor-stepper__text strong { font-size: var(--fs-sm); color: var(--navy); }
.advisor-stepper__text span { font-size: var(--fs-3xs); color: var(--text-muted); }
.advisor-stepper__line { flex: 1; min-width: 30px; border-top: 2px dashed var(--border); margin-top: 17px; }

/* ---- Questions ------------------------------------------------------------ */
.advisor-question { border: 1px solid var(--border); border-radius: 18px; padding: 24px; margin-bottom: 20px; }
.advisor-question__head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 20px; }
.advisor-question__num { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: var(--purple); color: #fff; font-weight: 700; font-size: var(--fs-xs); flex-shrink: 0; }
.advisor-question__head h2 { font-size: var(--fs-base); color: var(--navy); margin: 0 0 4px; }
.advisor-question__head p { font-size: var(--fs-2xs); color: var(--text-muted); margin: 0; }

.advisor-options { display: grid; gap: 14px; }
.advisor-options--4 { grid-template-columns: repeat(4, 1fr); }
.advisor-options--3 { grid-template-columns: repeat(3, 1fr); }

.advisor-option { position: relative; display: flex; align-items: flex-start; gap: 10px; border: 1.5px solid var(--border); border-radius: 14px; padding: 16px; cursor: pointer; background: #fff; }
.advisor-option input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.advisor-option:has(input:checked) { border-color: var(--purple); background: #f8f6ff; }

.advisor-option--radio { flex-direction: column; align-items: flex-start; }
.advisor-option--radio .advisor-option__indicator { width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--border); flex-shrink: 0; margin-bottom: 10px; }
.advisor-option--radio:has(input:checked) .advisor-option__indicator { border-color: var(--purple); background: radial-gradient(var(--purple) 0 40%, transparent 42%); }
.advisor-option--radio .advisor-option__body { display: flex; flex-direction: column; }
.advisor-option--radio .advisor-option__body strong { font-size: var(--fs-sm); color: var(--navy); margin-bottom: 2px; }
.advisor-option--radio .advisor-option__body span { font-size: var(--fs-3xs); color: var(--text-muted); }

.advisor-option--check { flex-direction: column; align-items: flex-start; }
.advisor-option__check-icon { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 12px; background: var(--bg-soft); color: var(--purple); margin-bottom: 12px; }
.advisor-option__check-icon svg { width: 19px; height: 19px; }
.advisor-option__indicator--check { position: absolute; top: 14px; right: 14px; width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid var(--border); background: #fff; display: inline-flex; align-items: center; justify-content: center; color: transparent; }
.advisor-option__indicator--check svg { width: 13px; height: 13px; }
.advisor-option:has(input:checked) .advisor-option__indicator--check { background: var(--purple); border-color: var(--purple); color: #fff; }
.advisor-option--check .advisor-option__body strong,
.advisor-option--consider .advisor-option__body strong { display: block; font-size: var(--fs-sm); color: var(--navy); margin-bottom: 2px; }
.advisor-option--check .advisor-option__body span,
.advisor-option--consider .advisor-option__body span { font-size: var(--fs-3xs); color: var(--text-muted); }
.advisor-option--consider { flex-direction: column; align-items: flex-start; }

.advisor-submit { text-align: center; margin-top: 8px; }
.advisor-submit__btn { display: inline-flex; align-items: center; gap: 8px; background: linear-gradient(120deg, var(--purple), var(--orange)); color: #fff; border: none; border-radius: 999px; padding: 16px 32px; font-size: var(--fs-sm); font-weight: 700; cursor: pointer; }
.advisor-submit__btn svg { width: 16px; height: 16px; }
.advisor-submit p { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: var(--fs-2xs); color: var(--text-muted); margin-top: 12px; }
.advisor-submit__lock { display: inline-flex; }
.advisor-submit__lock svg { width: 13px; height: 13px; }

/* ---- Results panel -------------------------------------------------------- */
.advisor-results[hidden] { display: none; }
.advisor-results { margin-top: 36px; border: 1px solid var(--border); border-radius: 18px; padding: 32px; }
.advisor-results__grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 48px; align-items: center; }
.advisor-results__photo-wrap { position: relative; }
.advisor-results__photo { border-radius: 20px; overflow: hidden; aspect-ratio: 3 / 4; }
.advisor-results__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.advisor-summary-card { position: absolute; right: -24px; bottom: 24px; width: 220px; background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 16px; box-shadow: 0 16px 32px rgba(16,31,77,0.14); }
.advisor-summary-card h3 { font-size: var(--fs-xs); color: var(--navy); margin: 0 0 12px; }
.advisor-summary-card__row { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 10px; }
.advisor-summary-card__row:last-child { margin-bottom: 0; }
.advisor-summary-card__icon { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 8px; background: var(--bg-soft); color: var(--purple); flex-shrink: 0; }
.advisor-summary-card__icon svg { width: 13px; height: 13px; }
.advisor-summary-card__row div { display: flex; flex-direction: column; }
.advisor-summary-card__row strong { font-size: var(--fs-3xs); color: var(--navy); }
.advisor-summary-card__row span { font-size: var(--fs-3xs); color: var(--text-muted); line-height: 1.4; }

.advisor-results__badge { display: inline-flex; align-items: center; gap: 6px; background: #ede9fe; color: var(--purple); font-size: var(--fs-2xs); font-weight: 700; padding: 6px 14px; border-radius: 999px; margin-bottom: 16px; }
.advisor-results__badge svg { width: 13px; height: 13px; }
.advisor-results__copy h2 { font-size: var(--fs-2xl); color: var(--navy); line-height: 1.3; margin: 0 0 14px; }
.advisor-results__copy > p { color: var(--text-muted); font-size: var(--fs-sm); margin-bottom: 24px; max-width: 440px; }
.advisor-results__items { display: flex; flex-direction: column; gap: 16px; margin-bottom: 24px; }
.advisor-results__item { display: flex; align-items: flex-start; gap: 12px; }
.advisor-results__item-icon { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 10px; background: var(--bg-soft); color: var(--purple); flex-shrink: 0; }
.advisor-results__item-icon svg { width: 17px; height: 17px; }
.advisor-results__item strong { display: block; font-size: var(--fs-sm); color: var(--navy); margin-bottom: 2px; }
.advisor-results__item p { font-size: var(--fs-2xs); color: var(--text-muted); margin: 0; }
.advisor-path { display: flex; align-items: center; gap: 16px; }
.advisor-path__sign { display: inline-flex; align-items: center; padding: 8px 16px; border-radius: 8px; color: #fff; font-size: var(--fs-2xs); font-weight: 700; }
.advisor-path__sign--1 { background: var(--purple); }
.advisor-path__sign--2 { background: var(--orange); }
.advisor-path__sign--3 { background: var(--green); }

/* ---- Still have questions -------------------------------------------------- */
.advisor-faq { padding: 40px 0 56px; }
.advisor-faq h2 { font-size: var(--fs-xl); color: var(--navy); margin: 0 0 8px; }
.advisor-faq > .container > p { color: var(--text-muted); font-size: var(--fs-sm); margin-bottom: 32px; }
.advisor-faq__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 24px; }
.advisor-faq__card { display: flex; align-items: flex-start; gap: 14px; border: 1px solid var(--border); border-radius: 14px; padding: 20px; }
.advisor-faq__icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: #ede9fe; color: var(--purple); flex-shrink: 0; }
.advisor-faq__icon svg { width: 20px; height: 20px; }
.advisor-faq__icon--green { background: #d7f3ee; color: var(--green); }
.advisor-faq__icon--orange { background: #fde6d2; color: var(--orange); }
.advisor-faq__card strong { display: block; font-size: var(--fs-sm); color: var(--navy); margin-bottom: 2px; }
.advisor-faq__card p { font-size: var(--fs-2xs); color: var(--text-muted); margin: 0 0 10px; }
.advisor-faq__card a { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-2xs); font-weight: 700; color: var(--purple); }
.advisor-faq__card a svg { width: 13px; height: 13px; }
.advisor-faq__link--green { color: var(--green) !important; }
.advisor-faq__link--orange { color: var(--orange) !important; }
.advisor-faq__note { display: flex; align-items: center; justify-content: center; gap: 6px; text-align: center; font-size: var(--fs-2xs); color: var(--text-muted); }
.advisor-faq__note svg { width: 14px; height: 14px; }

@media (max-width: 1080px) {
	.advisor-hero__inner { grid-template-columns: 1fr; }
	.advisor-options--4 { grid-template-columns: repeat(2, 1fr); }
	.advisor-options--3 { grid-template-columns: repeat(2, 1fr); }
	.advisor-results__grid { grid-template-columns: 1fr; }
	.advisor-summary-card { position: static; width: 100%; margin-top: 16px; }
}

@media (max-width: 720px) {
	.advisor-stepper { flex-direction: column; align-items: stretch; }
	.advisor-stepper__line { display: none; }
	.advisor-options--4, .advisor-options--3 { grid-template-columns: 1fr; }
	.advisor-faq__grid { grid-template-columns: 1fr; }
	.advisor-path { flex-wrap: wrap; }
}
