/*
 * Single school pages (/schools/<school>/) only — loaded on those pages (see functions.php), after main.css.
 */

/* Small phones (<=400px): long school email addresses / website links (e.g. info@edifyworldschoolshamshabad.com)
   could not wrap and pushed the Contact card off a 320px screen. Let them break and tighten the card. (2026-10-23) */
@media (max-width: 400px) {
	.sp-contact__card { padding: 20px 18px; }
	.sp-contact__card > *,
	.sp-contact__links { min-width: 0; max-width: 100%; }
	.sp-contact__links a { overflow-wrap: anywhere; word-break: break-word; }
}

/* ==========================================================================
   Optional landing-page sections (2026-10-24): Vision & Mission, Core Values,
   facility tiles, learning programmes, admissions (steps, fees, age criteria).
   Each block only renders when its "Landing Page Sections" field is filled.
   ========================================================================== */

/* Vision & Mission + Core Values: under About, beside the sticky enquiry form */
.sp-vm { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 28px; }
.sp-vm__card { border: 1px solid var(--border); border-radius: 14px; background: #fff; padding: 20px 20px 18px; }
.sp-vm__icon { display: inline-flex; width: 40px; height: 40px; border-radius: 50%; align-items: center; justify-content: center; background: #efeafe; color: var(--sp-indigo); margin-bottom: 10px; }
.sp-vm__icon svg { width: 20px; height: 20px; }
.sp-vm__card h3 { color: var(--navy); margin: 0 0 6px; }
.sp-vm__card p { font-size: var(--fs-sm); color: var(--text); line-height: 1.6; margin: 0; }

.sp-values { margin-top: 24px; }
.sp-values__grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.sp-values__grid li { background: var(--bg-soft); border-radius: 12px; padding: 12px 14px; border-left: 3px solid var(--sp-indigo); }
.sp-values__grid strong { display: block; color: var(--navy); font-size: var(--fs-sm); }
.sp-values__grid small { display: block; color: var(--text-muted); font-size: var(--fs-2xs); line-height: 1.45; margin-top: 2px; }

/* Facility tiles under the infrastructure photos */
.sp-facilities { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 18px; }
.sp-facility { display: flex; gap: 12px; align-items: flex-start; border: 1px solid var(--border); border-radius: 12px; background: #fff; padding: 14px; }
.sp-facility__icon { flex: 0 0 38px; width: 38px; height: 38px; border-radius: 10px; background: #efeafe; color: var(--sp-indigo); display: inline-flex; align-items: center; justify-content: center; }
.sp-facility__icon svg { width: 20px; height: 20px; }
.sp-facility strong { display: block; color: var(--navy); font-size: var(--fs-sm); line-height: 1.3; }
.sp-facility small { display: block; color: var(--text-muted); font-size: var(--fs-2xs); line-height: 1.45; margin-top: 3px; }
.sp-facilities__note { font-size: var(--fs-xs); color: var(--text-muted); margin: 12px 0 0; }

/* Learning programmes */
.sp-programmes { padding: 0 0 44px; }
.sp-programmes__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.sp-programme { position: relative; border: 1px solid var(--border); border-radius: 14px; background: #fff; padding: 20px 18px 18px; overflow: hidden; }
.sp-programme::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, var(--sp-indigo), var(--orange)); }
.sp-programme__num { display: block; font-size: var(--fs-2xs); font-weight: 800; color: var(--orange); letter-spacing: 0.08em; margin-bottom: 6px; }
.sp-programme strong { display: block; color: var(--navy); font-size: var(--fs-md); line-height: 1.3; }
.sp-programme__grades { display: inline-block; margin: 8px 0 8px; padding: 3px 10px; border-radius: 999px; background: #efeafe; color: var(--sp-indigo); font-size: var(--fs-2xs); font-weight: 700; }
.sp-programme p { font-size: var(--fs-xs); color: var(--text-muted); line-height: 1.55; margin: 0; }

/* Admissions: steps + fee table side by side, details below */
.sp-admissions { padding: 0 0 44px; }
.sp-admissions__intro { color: var(--text); font-size: var(--fs-sm); margin: -6px 0 18px; max-width: 80ch; }
.sp-admissions__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.sp-steps { list-style: none; counter-reset: sp-step; padding: 0; margin: 0; display: grid; gap: 12px; }
.sp-steps li { counter-increment: sp-step; position: relative; border: 1px solid var(--border); border-radius: 14px; background: #fff; padding: 16px 18px 16px 66px; }
.sp-steps li::before { content: counter(sp-step); position: absolute; left: 18px; top: 16px; width: 34px; height: 34px; border-radius: 50%; background: var(--sp-indigo); color: #fff; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.sp-steps strong { display: block; color: var(--navy); font-size: var(--fs-sm); }
.sp-steps p { font-size: var(--fs-xs); color: var(--text-muted); line-height: 1.55; margin: 4px 0 0; }

.sp-fees { background: var(--bg-soft); border-radius: 14px; padding: 18px 18px 14px; }
.sp-fees h3 { color: var(--navy); margin: 0 0 10px; }
.sp-fees__table { width: 100%; border-collapse: collapse; background: #fff; border-radius: 10px; overflow: hidden; font-size: var(--fs-sm); }
.sp-fees__table th,
.sp-fees__table td { padding: 8px 14px; text-align: left; border-bottom: 1px solid var(--bg-soft); }
.sp-fees__table thead th { background: var(--sp-indigo); color: #fff; font-size: var(--fs-xs); font-weight: 700; }
.sp-fees__table tbody th { color: var(--navy); font-weight: 600; }
.sp-fees__table td { color: var(--navy); font-weight: 700; text-align: right; }
.sp-fees__table thead th:last-child { text-align: right; }
.sp-fees__note { font-size: var(--fs-2xs); color: var(--text-muted); margin: 10px 0 0; }

.sp-more { margin-top: 12px; }
.sp-more__list { margin: 0 0 18px; padding-left: 18px; display: grid; gap: 6px; font-size: var(--fs-sm); color: var(--text); }
.sp-more__text { margin: 0 0 18px; font-size: var(--fs-sm); color: var(--text); line-height: 1.65; }

@media (max-width: 1080px) {
	.sp-facilities,
	.sp-programmes__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
	.sp-admissions__grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	.sp-vm,
	.sp-facilities,
	.sp-programmes__grid { grid-template-columns: 1fr; }
	.sp-values__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.sp-more .school-disclosures__table td.sp-more__note { color: var(--text-muted); font-weight: 400; font-size: var(--fs-xs); padding-top: 12px; }
.sp-admissions__main .sp-more:first-of-type { margin-top: 14px; }

/* ==========================================================================
   Tabs (2026-10-24): About / Infrastructure / Academics / Admissions / Contact
   are panels in the column beside the sticky enquiry form; main.js shows one
   at a time (all panels stay visible if JS is off).
   ========================================================================== */
.sp-nav { position: sticky; top: 88px; z-index: 20; background: #fff; }
.sp-panels.is-tabbed .sp-panel:not(.is-active) { display: none; }
.sp-panel > section { padding: 0 0 28px; }
.sp-panel > section:last-child { padding-bottom: 0; }
.sp-panel > section > .container { max-width: none; padding: 0; }

/* About panel: "Why Parents Choose" cards in three columns */
.sp-panel .sp-why { padding-top: 32px; }
.sp-panel .sp-why__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sp-panel .sp-why__help { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 8px 20px; flex-wrap: wrap; padding: 16px 20px; }
.sp-panel .sp-why__help p { margin: 0; flex: 1 1 220px; }

/* Infrastructure panel: three facility tiles per row, gallery below */
.sp-panel .sp-facilities { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sp-panel .sp-gallery { padding-top: 8px; }

/* Academics panel: pathway cards under the intro + 3C badge */
.sp-panel .sp-paths__card { grid-template-columns: minmax(0, 1fr) 170px; }
.sp-panel .sp-paths__venn { max-width: 170px; }
.sp-panel .sp-paths__list { grid-column: 1 / -1; }
.sp-panel .sp-programmes__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

@media (max-width: 1080px) {
	.sp-panel .sp-why__grid,
	.sp-panel .sp-facilities { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
	.sp-nav { top: 64px; }
}
@media (max-width: 640px) {
	.sp-panel .sp-facilities,
	.sp-panel .sp-programmes__grid { grid-template-columns: 1fr; }
	.sp-panel .sp-paths__card { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Round 3 (2026-10-24): design tab order — Life at Edify, Fee Structure and
   Gallery tabs; learning pillars, inquiry cycle, commitments, document cards
   and video testimonials.
   ========================================================================== */
.sp-subtitle { font-size: var(--fs-lg); color: var(--navy); margin: 30px 0 14px; }
.sp-note-card { background: var(--bg-soft); border-radius: 14px; padding: 18px 20px; }
.sp-note-card h3 { color: var(--navy); margin: 0 0 6px; }
.sp-note-card p { font-size: var(--fs-sm); color: var(--text); line-height: 1.65; margin: 0; }

/* Academics: 3C pillars + inquiry cycle */
.sp-learning .container > .sp-title { margin-top: 8px; }
.sp-pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.sp-pillar { border: 1px solid var(--border); border-top: 4px solid var(--sp-indigo); border-radius: 14px; background: #fff; padding: 18px; }
.sp-pillar:nth-child(2) { border-top-color: var(--orange); }
.sp-pillar:nth-child(3) { border-top-color: #16a34a; }
.sp-pillar strong { display: block; color: var(--navy); font-size: var(--fs-md); }
.sp-pillar p { font-size: var(--fs-xs); color: var(--text-muted); line-height: 1.55; margin: 6px 0 0; }
.sp-inquiry { list-style: none; counter-reset: sp-inq; padding: 0; margin: 0 0 18px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.sp-inquiry li { counter-increment: sp-inq; position: relative; background: #fff; border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px 12px 52px; }
.sp-inquiry li::before { content: counter(sp-inq); position: absolute; left: 14px; top: 12px; width: 28px; height: 28px; border-radius: 50%; background: #efeafe; color: var(--sp-indigo); font-weight: 800; font-size: var(--fs-xs); display: flex; align-items: center; justify-content: center; }
.sp-inquiry strong { display: block; color: var(--navy); font-size: var(--fs-sm); }
.sp-inquiry small { display: block; color: var(--text-muted); font-size: var(--fs-2xs); line-height: 1.45; margin-top: 2px; }

/* Life at Edify */
.sp-vm--first { margin-top: 0; }
.sp-commitments { list-style: none; counter-reset: sp-com; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; }
.sp-commitments li { counter-increment: sp-com; background: var(--bg-soft); border-radius: 12px; padding: 14px; }
.sp-commitments li::before { content: "0" counter(sp-com); display: block; font-size: var(--fs-2xs); font-weight: 800; color: var(--orange); letter-spacing: 0.08em; margin-bottom: 4px; }
.sp-commitments strong { display: block; color: var(--navy); font-size: var(--fs-sm); line-height: 1.3; }
.sp-commitments small { display: block; color: var(--text-muted); font-size: var(--fs-2xs); line-height: 1.45; margin-top: 4px; }
.sp-life-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 18px; }
.sp-life-card { border: 1px solid var(--border); border-radius: 14px; background: #fff; padding: 18px; }
.sp-life-card h3 { color: var(--navy); font-size: var(--fs-md) !important; margin: 0 0 6px; }
.sp-life-card p { font-size: var(--fs-xs); color: var(--text-muted); line-height: 1.6; margin: 0; }
.sp-life__intro { font-size: var(--fs-sm); color: var(--text); margin: -4px 0 14px; }
.sp-life .sp-facilities { margin-top: 0; }

/* Admissions: document checklist cards; Fee Structure side column */
.sp-docs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.sp-docs__card { border: 1px solid var(--border); border-radius: 14px; background: #fff; padding: 16px 18px; }
.sp-docs__card h4 { color: var(--sp-indigo); font-size: var(--fs-sm); margin: 0 0 8px; }
.sp-docs__card ul { margin: 0; padding-left: 18px; display: grid; gap: 6px; font-size: var(--fs-xs); color: var(--text); line-height: 1.5; }
.sp-age .sp-fees__table td { font-weight: 600; }
.sp-fee-side { display: grid; gap: 14px; align-content: start; }
.sp-fee-side .btn { justify-self: start; }

/* Video testimonials (school's own student videos) */
.sp-voice--video { flex-direction: column; gap: 8px; padding: 10px; margin: 0; }
.sp-voice--video video { display: block; width: 100%; aspect-ratio: 16 / 9; border-radius: 10px; background: #000; object-fit: cover; }
.sp-voice--video figcaption { font-size: var(--fs-2xs); font-weight: 700; color: var(--orange); padding: 0 4px 2px; }

@media (max-width: 1080px) {
	.sp-pillars,
	.sp-life-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sp-inquiry { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
	.sp-pillars,
	.sp-life-cards,
	.sp-docs,
	.sp-inquiry { grid-template-columns: 1fr; }
}

/* Leadership messages (About tab, optional "leaders" / "trust_note" fields) — 2026-10-26 */
.sp-leaders { margin-top: 36px; }
.sp-leaders .sp-title { margin: 2px 0 16px; }
.sp-leaders__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.sp-leader { margin: 0; display: flex; flex-direction: column; justify-content: space-between; gap: 14px; border: 1px solid var(--border); border-radius: 14px; background: #fff; padding: 20px 18px 16px; position: relative; }
.sp-leader blockquote { margin: 0; font-size: var(--fs-xs); color: var(--text); line-height: 1.65; }
.sp-leader blockquote::before { content: "\201C"; display: block; font-family: Georgia, serif; font-size: 40px; line-height: 0.8; color: var(--orange); margin-bottom: 4px; }
.sp-leader figcaption { display: flex; align-items: center; gap: 10px; border-top: 1px solid var(--border); padding-top: 12px; }
.sp-leader__avatar { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; background: linear-gradient(135deg, var(--sp-indigo), var(--orange)); color: #fff; font-weight: 800; font-size: var(--fs-xs); display: inline-flex; align-items: center; justify-content: center; }
.sp-leader__avatar--photo { flex-basis: 56px; width: 56px; height: 56px; padding: 2px; }
.sp-leader__avatar--photo img { display: block; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; object-position: center top; background: #fff; }
.sp-leader figcaption strong { display: block; color: var(--navy); font-size: var(--fs-sm); line-height: 1.3; }
.sp-leader figcaption small { display: block; color: var(--orange); font-size: var(--fs-2xs); font-weight: 700; }
.sp-trust { display: flex; gap: 12px; align-items: flex-start; margin-top: 14px; background: var(--bg-soft); border-radius: 12px; padding: 14px 16px; }
.sp-trust__icon { flex: 0 0 36px; width: 36px; height: 36px; border-radius: 10px; background: #efeafe; color: var(--sp-indigo); display: inline-flex; align-items: center; justify-content: center; }
.sp-trust__icon svg { width: 18px; height: 18px; }
.sp-trust p { margin: 0; font-size: var(--fs-xs); color: var(--text); line-height: 1.6; }
.sp-trust strong { display: block; color: var(--navy); font-size: var(--fs-sm); }
@media (max-width: 1080px) {
	.sp-leaders__grid { grid-template-columns: 1fr; }
}

/* ==== School page UI pass (2026-10-28): homepage-style panels — the shadow sits
   on each whole section panel, items inside stay flat (light border only) ==== */
.single-ews_school {
	--sp-panel-border: 1px solid rgba(79, 91, 234, 0.12);
	--sp-panel-bg:
		radial-gradient(420px 260px at 0% 0%, rgba(124, 58, 237, 0.06), transparent 70%),
		radial-gradient(360px 240px at 100% 100%, rgba(242, 112, 27, 0.05), transparent 70%),
		linear-gradient(135deg, #f7f6fc 0%, #fafbfd 55%, #f4f6fb 100%);
	--sp-panel-shadow: 0 2px 6px rgba(16, 31, 77, 0.05), 0 22px 48px -14px rgba(79, 91, 234, 0.32);
	--sp-item-line: rgba(79, 91, 234, 0.12);
}

/* 1. Every section inside the tabs becomes one panel */
.single-ews_school .sp-panel > section,
.single-ews_school .sp-panel > .sp-about {
	border: var(--sp-panel-border);
	border-radius: 18px;
	background: var(--sp-panel-bg);
	box-shadow: var(--sp-panel-shadow);
	padding: 28px 26px;
	margin: 0 0 28px;
}
.single-ews_school .sp-panel > section > .container { padding: 0; max-width: none; width: auto; }
.single-ews_school .sp-panel > section .sp-title:first-child,
.single-ews_school .sp-panel > section > .container > .sp-title:first-child,
.single-ews_school .sp-panel > section .sp-head { margin-top: 0; }
/* panels that already had their own soft box: let the section panel carry it */
.single-ews_school .sp-panel :is(.sp-paths__card, .sp-contact__card) { background: transparent; padding: 0; border-radius: 0; }

/* items inside panels: white, flat, same light border */
.single-ews_school .sp-panel :is(.sp-why__card, .sp-facility, .sp-programme, .sp-pillar, .sp-vm__card, .sp-life-card, .sp-docs__card, .sp-path, .sp-infra__item, .sp-leader, .sp-steps li, .sp-inquiry li) {
	border-color: var(--sp-item-line);
	background: #fff;
	box-shadow: none;
}
.single-ews_school .sp-panel :is(.sp-values__grid li, .sp-commitments li, .sp-note-card, .sp-trust) { background: #fff; border: 1px solid var(--sp-item-line); }
.single-ews_school .sp-panel .sp-values__grid li { border-left: 3px solid var(--sp-indigo); }
.single-ews_school .sp-why__help { background: #fff; border: 1px solid var(--sp-item-line); }

/* 2. Same panel shadow on the tab bar, enquiry form, hero contact card and stats strip */
.single-ews_school .sp-nav { border-radius: 14px; border: var(--sp-panel-border); box-shadow: 0 10px 28px -14px rgba(79, 91, 234, 0.35); padding: 0 10px; margin-bottom: 22px; }
.single-ews_school :is(.sp-form, .sp-stats__card, .sp-hero__card) { border: var(--sp-panel-border); border-radius: 18px; box-shadow: var(--sp-panel-shadow); }
.single-ews_school .sp-form { background: var(--sp-panel-bg); }
.single-ews_school .sp-form :is(input, select, textarea) { background: #fff; }

/* 3. Awards band + video testimonials: homepage-style panels */
.single-ews_school .sp-awards__band { box-shadow: 0 22px 48px -14px rgba(27, 16, 112, 0.45); }
.single-ews_school .sp-voices > .container {
	border: var(--sp-panel-border);
	border-radius: 18px;
	background: var(--sp-panel-bg);
	box-shadow: var(--sp-panel-shadow);
	padding: 28px 26px;
	/* same outer width as the awards band (container minus its 24px gutters) */
	width: calc(100% - 48px);
	max-width: calc(var(--container) - 48px);
}
.single-ews_school .sp-voice { border-color: var(--sp-item-line); box-shadow: none; }

/* 4. Buttons inside the tab panels: orange gradient pill (same as the other pages) */
.single-ews_school .sp-panel .sp-btn--primary,
.single-ews_school .sp-why__help .sp-btn {
	border: 0;
	border-radius: 999px;
	background: linear-gradient(90deg, #f26a1b, #f0566b);
	color: #fff;
	box-shadow: 0 10px 22px -8px rgba(240, 86, 107, 0.6);
}

@media (max-width: 720px) {
	.single-ews_school .sp-panel > section,
	.single-ews_school .sp-panel > .sp-about,
	.single-ews_school .sp-voices > .container { padding: 20px 16px; border-radius: 16px; margin-bottom: 20px; }
	.single-ews_school .sp-voices > .container { width: calc(100% - 32px); }
	.single-ews_school .sp-nav { border-radius: 12px; padding: 0 6px; }
}

/* Awards band now lists all 10 awards & associations: 5 per row (2026-10-28) */
@media (min-width: 1081px) {
	.sp-awards__row { grid-template-columns: repeat(5, minmax(0, 1fr)); row-gap: 20px; }
}

/* A single leadership message spans the full panel width (2026-10-29) */
.sp-leaders__grid:has(> .sp-leader:only-child) { grid-template-columns: 1fr; }
.sp-leader:only-child { padding: 24px 26px 18px; }
.sp-leader:only-child blockquote { font-size: var(--fs-sm); }
.sp-leader:only-child .sp-leader__avatar--photo { flex-basis: 72px; width: 72px; height: 72px; }

/* Parent testimonial image cards: 4 per view, 2 on tablets, 1.4 on phones (2026-10-29) */
.sp-voice--card { flex-basis: calc((100% - 42px) / 4); min-width: 0; padding: 0; margin: 0; overflow: hidden; }
.sp-voice--card img { display: block; width: 100%; height: auto; }
@media (max-width: 900px) {
	.sp-voice--card { flex-basis: calc((100% - 14px) / 2); }
}
@media (max-width: 600px) {
	.sp-voice--card { flex-basis: 70%; }
}

/* Gallery tab: centre-focus slider like the client reference (2026-10-29) — big
   centre photo, smaller photos peeking either side, dots on the photo. The track
   moves by --i steps; percentages are of the viewport width, so it needs no
   measuring and works inside hidden tab panels. */
.sp-gallery__head { text-align: center; margin-bottom: 18px; }
.sp-gallery__eyebrow { margin: 0 0 4px; font-size: 12px; font-weight: 700; color: #6c3be8; letter-spacing: 0.02em; }
.sp-gallery__head .sp-title { margin: 0; }
.sp-gallery__slider { --slide: 64%; --step: 66%; --offset: 17%; position: relative; }
.sp-gallery__viewport { overflow: hidden; border-radius: 18px; touch-action: pan-y; }
.sp-gallery__track { display: flex; gap: 0; transform: translateX(calc(var(--offset) - var(--i, 0) * var(--step))); transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1); }
.sp-gallery__slide { position: relative; flex: 0 0 var(--slide); margin: 0 calc((var(--step) - var(--slide)) / 2); aspect-ratio: 16 / 10; border-radius: 16px; overflow: hidden; background: #e9e8f3; transform: scale(0.84); opacity: 0.75; transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.55s ease, box-shadow 0.55s ease; cursor: pointer; }
.sp-gallery__slide.is-active { transform: none; opacity: 1; cursor: default; box-shadow: 0 22px 40px -18px rgba(16, 31, 77, 0.45); }
.sp-gallery__slide img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sp-gallery__slide figcaption { position: absolute; left: 16px; bottom: 14px; padding: 5px 12px; border-radius: 999px; background: rgba(11, 20, 55, 0.6); color: #fff; font-size: 12.5px; font-weight: 600; opacity: 0; transition: opacity 0.4s ease; }
.sp-gallery__slide.is-active figcaption { opacity: 1; }
.sp-gallery__dots { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); display: flex; align-items: center; gap: 6px; padding: 5px 9px; border-radius: 999px; background: rgba(11, 20, 55, 0.35); }
.sp-gallery__dots:empty { display: none; }
.sp-gallery__dot { width: 6px; height: 6px; padding: 0; border: 0; border-radius: 999px; background: rgba(255, 255, 255, 0.55); cursor: pointer; transition: width 0.3s ease, background 0.3s ease; }
.sp-gallery__dot.is-active { width: 18px; background: #fff; }
.sp-gallery__count { color: #fff; font-size: 12px; font-weight: 700; padding: 0 3px; }
.sp-gallery__arrow { position: absolute; top: 50%; z-index: 2; width: 38px; height: 38px; margin-top: -19px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.92); color: var(--navy); font-size: 24px; line-height: 1; box-shadow: 0 8px 18px -8px rgba(16, 31, 77, 0.45); cursor: pointer; transition: background 0.2s ease, color 0.2s ease; }
.sp-gallery__arrow:hover { background: var(--orange); color: #fff; }
.sp-gallery__arrow--prev { left: calc(var(--offset) - 18px); }
.sp-gallery__arrow--next { right: calc(var(--offset) - 18px); }
.sp-gallery__slider:not(.is-ready) .sp-gallery__viewport { overflow-x: auto; }
.sp-gallery__slider:not(.is-ready) .sp-gallery__track { transform: none; }
.sp-gallery__slider:not(.is-ready) .sp-gallery__arrow { display: none; }
@media (max-width: 760px) {
	.sp-gallery__slider { --slide: 80%; --step: 82%; --offset: 9%; }
	.sp-gallery__arrow { display: none; }
	.sp-gallery__slide figcaption { left: 10px; bottom: 42px; font-size: 11.5px; }
}
@media (prefers-reduced-motion: reduce) {
	.sp-gallery__track, .sp-gallery__slide { transition: none; }
}

/* ==========================================================================
   School page round 4 (2026-10-29, client notes on Kurnool):
   1. "View on Google Maps" beside "Watch School Tour".
   2. Admissions card moved out of the photo into a horizontal glass bar along
      the bottom of the hero, so the campus photo is fully visible.
   3. Tabs restyled as pills with icons; active tab in the brand gradient.
   4. Tab bar is full width and stays pinned under the header from the tabs
      down to the testimonials (.sp-scope is its sticky container).
   ========================================================================== */
.single-ews_school .sp-hero__links { flex: 1 1 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 26px; }
.single-ews_school .sp-hero__map:hover, .single-ews_school .sp-hero__tour:hover { color: var(--sp-indigo); }
.single-ews_school .sp-hero__map .sp-hero__tour-icon { color: #f26a1b; }
.single-ews_school .sp-hero__map .sp-hero__tour-icon svg { width: 19px; height: 19px; }

.single-ews_school .sp-hero__inner { padding-bottom: 22px; }
.single-ews_school .sp-hero__contact-wrap { position: relative; z-index: 2; padding-bottom: 46px; }
.single-ews_school .sp-hero__contact { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 6px; padding: 10px 10px 10px 18px; border-radius: 18px; background: rgba(255, 255, 255, 0.86); -webkit-backdrop-filter: blur(10px) saturate(1.3); backdrop-filter: blur(10px) saturate(1.3); border: 1px solid rgba(255, 255, 255, 0.9); box-shadow: 0 18px 40px -16px rgba(13, 27, 76, 0.35); }
.single-ews_school .sp-hero__contact-title { display: inline-flex; align-items: center; gap: 10px; margin-right: 8px; font-size: var(--fs-sm); color: var(--navy); white-space: nowrap; }
.single-ews_school .sp-hero__contact-icon { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(135deg, #4f46e5, #7c3aed); color: #fff; }
.single-ews_school .sp-hero__contact-icon svg { width: 18px; height: 18px; }
.single-ews_school .sp-hero__contact > a:not(.btn) { display: inline-flex; align-items: center; gap: 7px; padding: 9px 12px; border-radius: 999px; font-size: var(--fs-xs); font-weight: 600; color: var(--text); text-decoration: none; white-space: nowrap; transition: background 0.2s ease, color 0.2s ease; }
.single-ews_school .sp-hero__contact > a:not(.btn):hover { background: #f1effd; color: var(--sp-indigo); }
.single-ews_school .sp-hero__contact > a:not(.btn) svg { width: 17px; height: 17px; color: var(--sp-indigo); flex-shrink: 0; }
.single-ews_school .sp-hero__contact-btn { margin-left: auto; white-space: nowrap; }
.single-ews_school .sp-stats { margin-top: -26px; }

.sp-scope { position: relative; }
.single-ews_school .sp-tabbar { position: sticky; top: 88px; z-index: 30; padding: 10px 0; margin-bottom: 18px; background: rgba(255, 255, 255, 0.9); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(79, 91, 234, 0.1); box-shadow: 0 10px 24px -18px rgba(16, 31, 77, 0.4); }
.single-ews_school .sp-tabbar .sp-nav { position: static; display: flex; gap: 6px; margin: 0; padding: 5px; border: 0; border-radius: 999px; background: #f2f1fb; box-shadow: inset 0 0 0 1px rgba(79, 91, 234, 0.1); overflow-x: auto; }
.single-ews_school .sp-tabbar .sp-nav__link { display: inline-flex; align-items: center; gap: 8px; flex: 1 0 auto; justify-content: center; margin: 0; padding: 10px 16px; border: 0; border-radius: 999px; font-size: var(--fs-xs); font-weight: 700; color: #4b5175; white-space: nowrap; transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease; }
.single-ews_school .sp-tabbar .sp-nav__link svg { width: 17px; height: 17px; color: #7c6fd8; transition: color 0.2s ease; }
.single-ews_school .sp-tabbar .sp-nav__link:hover { background: #fff; color: var(--navy); }
.single-ews_school .sp-tabbar .sp-nav__link.is-active { background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%); color: #fff; box-shadow: 0 8px 18px -8px rgba(79, 70, 229, 0.7); }
.single-ews_school .sp-tabbar .sp-nav__link.is-active svg { color: #fff; }
.single-ews_school .sp-form { top: 170px; }

@media (max-width: 1240px) {
	.single-ews_school .sp-hero__contact-btn { margin-left: 0; }
}
@media (max-width: 1080px) {
	.single-ews_school .sp-tabbar .sp-nav__link { flex: 0 0 auto; }
}
@media (max-width: 900px) {
	.single-ews_school .sp-tabbar { top: 64px; padding: 8px 0; }
	.single-ews_school .sp-hero__contact-wrap { padding-bottom: 20px; }
	.single-ews_school .sp-stats { margin-top: 0; }
}
@media (max-width: 640px) {
	.single-ews_school .sp-hero__contact { padding: 14px; gap: 4px; }
	.single-ews_school .sp-hero__contact-title { flex: 1 1 100%; margin-bottom: 4px; }
	.single-ews_school .sp-hero__contact > a:not(.btn) { flex: 1 1 calc(50% - 4px); padding: 9px 8px; }
	.single-ews_school .sp-hero__contact-btn { flex: 1 1 100%; justify-content: center; margin-top: 6px; }
	.single-ews_school .sp-tabbar .sp-nav__link { padding: 9px 13px; }
}

/* Infrastructure tab uses the same centre-focus slider as the Gallery (2026-10-29) */
.sp-gallery__eyebrow a { color: inherit; text-decoration: none; }
.sp-gallery__eyebrow a:hover { text-decoration: underline; }
.sp-infra__slider { margin-bottom: 26px; }

/* Active school tab: purple to orange, matching the orange page buttons (client picked option B, 2026-10-29) */
.single-ews_school .sp-tabbar .sp-nav__link.is-active { background: linear-gradient(135deg, #6c3be8 0%, #f26a1b 100%); box-shadow: 0 8px 18px -8px rgba(242, 106, 27, 0.55); }

/* School banner: photo starts after the text column, short soft edge so the campus stays clear (2026-10-30) */
@media (min-width: 981px) {
	.sp-hero__bg { inset: 0 0 0 46%; }
	.sp-hero__bg::after { background: linear-gradient(90deg, #f4f5fb 0%, rgba(244, 245, 251, 0.55) 7%, rgba(244, 245, 251, 0) 20%); }
}

/* About School: intro + video side by side, highlights as cards underneath (2026-10-30) */
.sp-about { align-items: center; }
.sp-about__more { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 18px; }
.sp-about__more .sp-about__list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; }
.sp-about__more .sp-about__list li { background: #fff; border: 1px solid var(--sp-item-line, #e6e3f5); border-radius: 12px; padding: 12px 14px 12px 40px; font-size: var(--fs-xs); line-height: 1.5; }
.sp-about__more .sp-about__list li::before { left: 14px; top: 14px; }
.sp-about__more .btn { align-self: flex-start; }
@media (max-width: 980px) {
	.sp-about { gap: 18px; }
	.sp-about__copy > p { margin-bottom: 0; }
}
@media (max-width: 900px) {
	.sp-about__more { gap: 14px; }
	.sp-about__more .sp-about__list { grid-template-columns: 1fr; gap: 8px; }
	.sp-about__more .sp-about__list li { padding: 9px 12px 9px 36px; }
	.sp-about__more .sp-about__list li::before { left: 12px; top: 11px; }
}