/* =========================================================================
   BLOCKS — flexible-content section layouts.
   Each .section--<layout> matches a partial in template-parts/blocks/.
   ========================================================================= */

/* Generous, even rhythm so sections read as distinct bands. */
.section { padding-block: clamp(2.5rem, 4.2vw, 3.75rem); }
.section__heading { margin-bottom: var(--space-4); font-size: var(--fs-h2); }

/* Hero — same layered depth + dot texture as the homepage slideshow */
.section--hero {
	color: #fff; position: relative; overflow: hidden; padding-block: clamp(var(--space-6), 9vw, 7rem);
	background:
		radial-gradient(1100px 520px at 82% -10%, rgba(40,105,185,.55), transparent 60%),
		radial-gradient(900px 520px at -5% 110%, rgba(6,33,64,.7), transparent 55%),
		linear-gradient(135deg, var(--color-brand-dark) 0%, var(--color-brand) 55%, #114a92 100%);
}
.section--hero::after {
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
	background-image: radial-gradient(rgba(255,255,255,.07) 1.4px, transparent 1.5px);
	background-size: 24px 24px;
}
.section--hero.has-bg { background-color: var(--color-brand); background-size: cover; background-position: center; }
.section--hero.has-bg::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(120deg, rgba(7,41,79,.86), rgba(10,58,120,.62)); }
.section--hero .container { position: relative; z-index: 2; max-width: 52rem; }
.section--hero h1, .section--hero h2 { color: #fff; font-size: var(--fs-h1); margin-bottom: var(--space-4); }
.section--hero .hero__sub { font-size: var(--fs-lg); opacity: .96; margin-bottom: var(--space-4); }
.section--hero .button-row { margin-top: var(--space-2); }

/* Rich text */
.section--rich_text .rich-text--narrow { max-width: var(--container-narrow); margin-inline: auto; }

/* Two column */
.two-col { display: grid; gap: var(--space-5); grid-template-columns: 1fr 1fr; align-items: center; }
@media (max-width: 720px) { .two-col { grid-template-columns: 1fr; } }

/* About: quick-facts row (left column) */
.about-stats { display: flex; flex-wrap: wrap; gap: var(--space-5); margin: var(--space-4) 0; }
.about-stats > div { display: flex; flex-direction: column; }
.about-stats b { font-size: var(--fs-h3); color: var(--color-brand); line-height: 1; }
.about-stats span { color: var(--color-text-muted); font-size: var(--fs-sm); }

/* About: mission card (right column) with SOAR value chips */
.mission-card { background: var(--color-brand); color: #fff; border-radius: var(--radius-lg); padding: var(--space-5); box-shadow: var(--shadow-lg); }
.mission-card h3 { color: #fff; margin-bottom: var(--space-2); }
.mission-card p { color: #dbe5f1; }
.mission-eyebrow { text-transform: uppercase; letter-spacing: .09em; font-weight: 800; font-size: var(--fs-sm); color: #cfe0f5; margin-bottom: var(--space-1); }
.soar-values { list-style: none; margin: var(--space-4) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-2); }
.soar-values li { display: inline-flex; align-items: baseline; gap: .15rem; background: #fff; border: 1px solid #fff; border-radius: 999px; padding: .35rem .85rem; font-weight: 700; color: var(--color-brand-dark); cursor: default; transition: opacity .45s ease, transform .45s cubic-bezier(.2,.7,.2,1), box-shadow var(--transition); }
.soar-values li span { color: var(--color-accent); font-weight: 800; }
/* pop the chips in one-by-one when the mission card scrolls into view */
.has-js .soar-values li { opacity: 0; transform: translateY(10px) scale(.9); }
.has-js .reveal-up.is-in .soar-values li { opacity: 1; transform: none; }
.has-js .reveal-up.is-in .soar-values li:nth-child(1) { transition-delay: .25s; }
.has-js .reveal-up.is-in .soar-values li:nth-child(2) { transition-delay: .37s; }
.has-js .reveal-up.is-in .soar-values li:nth-child(3) { transition-delay: .49s; }
.has-js .reveal-up.is-in .soar-values li:nth-child(4) { transition-delay: .61s; }
.soar-values li:hover { transform: translateY(-4px) scale(1.06) !important; box-shadow: 0 8px 18px rgba(0,0,0,.25); }
@media (prefers-reduced-motion: reduce) { .has-js .soar-values li { opacity: 1; transform: none; } }

/* Callout band */
.section--callout { padding: 0; }
/* Finance Office: extra breathing room above the "Shop the School Store" callout
   (the one that sits right after the fees text). Scoped so it affects only that spot. */
.page-id-24 .section--rich_text + .section--callout { margin-top: var(--space-6); }
.callout {
	position: relative; overflow: hidden; padding: var(--space-7) var(--space-5); border-radius: var(--radius-lg);
	text-align: center; display: flex; flex-direction: column; align-items: center; gap: var(--space-3); box-shadow: var(--shadow-lg);
}
.callout > * { position: relative; z-index: 1; }
.callout--brand {
	color: #fff;
	background:
		radial-gradient(800px 360px at 80% -30%, rgba(40,105,185,.6), transparent 60%),
		linear-gradient(135deg, var(--color-brand-dark) 0%, var(--color-brand) 60%, #114a92 100%);
}
.callout--brand::after {
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
	background-image: radial-gradient(rgba(255,255,255,.06) 1.4px, transparent 1.5px); background-size: 22px 22px;
}
.callout--accent { background: var(--color-accent); color: #fff; }
.callout--light { background: var(--color-bg-alt); color: var(--color-text); box-shadow: none; border: 1px solid var(--color-border); }
.callout h2 { font-size: var(--fs-h2); margin: 0; }
.callout--brand h2, .callout--accent h2 { color: #fff; }
.callout p { max-width: 42rem; font-size: var(--fs-lg); margin: 0; }
.callout__icon { display: inline-flex; align-items: center; justify-content: center; width: 66px; height: 66px; border-radius: 50%; background: rgba(255,255,255,.16); color: #fff; margin-bottom: var(--space-1); }
.callout--light .callout__icon { background: #fff; color: var(--color-brand); box-shadow: var(--shadow); }
.callout__svg { width: 32px; height: 32px; }
.callout__actions { justify-content: center; margin-top: var(--space-2); }
/* on dark callouts the primary button is white; the second is a ghost */
.callout--brand .btn--secondary, .callout--accent .btn--secondary { background: #fff; color: var(--color-brand-dark); box-shadow: 0 3px 8px rgba(0,0,0,.18); }
.callout--brand .btn--secondary:hover, .callout--accent .btn--secondary:hover { background: #eef2f7; color: var(--color-brand-dark); }
.callout--light .btn--ghost { color: var(--color-brand); border-color: var(--color-brand); }

/* Embed (booking / video / map) */
.embed { border: 0; width: 100%; border-radius: var(--radius); }
.embed--16-9 { aspect-ratio: 16 / 9; }
.embed--4-3 { aspect-ratio: 4 / 3; }
.embed--tall { width: 100%; min-height: 720px; }

/* Support table */
.support-table caption { text-align: left; font-weight: 600; margin-bottom: var(--space-2); }

/* ---- Staff directory ---- */
.staff-card__avatar { aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, var(--color-brand) 0%, var(--color-brand-light) 100%); }
.staff-card__avatar span { font-size: clamp(2rem, 6vw, 2.8rem); font-weight: 800; color: #fff; letter-spacing: .03em; }
.staff-filter { max-width: 34rem; margin: 0 auto var(--space-5); }
.staff-filter__input { width: 100%; padding: var(--space-3) var(--space-4); border: 1px solid var(--color-border); border-radius: 999px; font: inherit; background: #fff; }
.staff-filter__input:focus { outline: 3px solid var(--color-focus); outline-offset: 1px; border-color: var(--color-brand); }
.staff-filter__empty { text-align: center; color: var(--color-text-muted); margin-top: var(--space-4); }
.staff-pills { display: flex; flex-wrap: wrap; gap: var(--space-2); justify-content: center; margin-bottom: var(--space-6); }
.staff-pill { padding: .35rem .9rem; border-radius: 999px; background: #fff; border: 1px solid var(--color-border); color: var(--color-brand); font-weight: 600; font-size: var(--fs-sm); cursor: pointer; transition: background var(--transition), color var(--transition), border-color var(--transition); }
.staff-pill:hover { border-color: var(--color-brand); }
.staff-pill.is-active { background: var(--color-brand); color: #fff; border-color: var(--color-brand); }
.staff-dept { margin-bottom: var(--space-7); scroll-margin-top: 6rem; }
.staff-dept__title { color: var(--color-brand-dark); border-bottom: 2px solid var(--color-accent); padding-bottom: var(--space-2); margin-bottom: var(--space-4); }
/* Offset jump-to anchors so the sticky header doesn't cover the heading. */
.staff-dept { scroll-margin-top: 100px; }

/* Jump-to-department dropdown */
.staff-jump { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); justify-content: center; margin-bottom: var(--space-6); }
.staff-jump__label { font-weight: 600; color: var(--color-text-muted); }
.staff-jump__select { padding: .5rem 2rem .5rem .75rem; border: 1px solid var(--color-border); border-radius: var(--radius); background: #fff; font-size: var(--fs-base); color: var(--color-text); max-width: 100%; cursor: pointer; }
.staff-jump__select:focus { outline: 2px solid var(--color-focus); outline-offset: 1px; }

/* Back-to-top floating button */
.back-to-top { position: fixed; right: var(--space-4); bottom: var(--space-4); z-index: 40; width: 2.9rem; height: 2.9rem; border: 0; border-radius: 999px; background: var(--color-brand); color: #fff; font-size: 1.3rem; line-height: 1; cursor: pointer; box-shadow: var(--shadow-lg); transition: background var(--transition), transform var(--transition); }
.back-to-top:hover { background: var(--color-brand-dark); transform: translateY(-2px); }
.back-to-top:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .back-to-top { transition: none; } }

/* Staff compact table (internal portal directory) */
.staff-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--color-border); border-radius: var(--radius); background: #fff; }
.staff-table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.staff-table thead th { position: sticky; top: 0; z-index: 1; background: var(--color-brand); color: #fff; text-align: left; font-weight: 700; padding: .7rem .9rem; white-space: nowrap; }
.staff-table tbody th, .staff-table tbody td { padding: .65rem .9rem; border-top: 1px solid var(--color-border); vertical-align: top; }
.staff-table tbody tr:nth-child(even) { background: var(--color-bg-alt); }
.staff-table tbody tr:hover { background: #e3ebf6; }
.staff-row__name { text-align: left; font-weight: 700; color: var(--color-brand-dark); white-space: nowrap; }
.staff-table a { color: var(--color-brand); overflow-wrap: anywhere; }
.staff-row__muted { color: var(--color-text-muted); }

/* Staff grid */
.staff-grid { display: grid; gap: var(--space-4); align-items: start; }
/* fixed responsive columns; minmax(0,1fr) lets tracks shrink so long emails
   don't force horizontal overflow on mobile */
.staff-grid--2 { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 600px) { .staff-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.staff-grid--3, .staff-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 640px) { .staff-grid--3, .staff-grid--4 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .staff-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .staff-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.staff-card { min-width: 0; }
/* Let the body fill the (grid-stretched) card so the contact + "View bio"
   block can anchor to the bottom — keeps email and the bio link aligned across
   the whole row regardless of how long each name/role is. */
.staff-card .card__body { flex: 1; }
.staff-card__contact { overflow-wrap: anywhere; margin-top: auto; }
.staff-card__contact a { word-break: break-word; }

/* Card links through to the staff profile / bio */
.staff-card__media-link { display: block; overflow: hidden; }
.staff-card__media-link .card__media img { transition: transform var(--transition); }
.staff-card:hover .staff-card__media-link .card__media img { transform: scale(1.04); }
.staff-card__name { color: var(--color-brand-dark); text-decoration: none; }
.staff-card__name:hover, .staff-card__name:focus { color: var(--color-brand); text-decoration: underline; }
.staff-card__profile { display: inline-flex; align-items: center; gap: .35em; margin-top: var(--space-2); font-weight: 600; color: var(--color-brand); text-decoration: none; }
.staff-card__profile span[aria-hidden] { transition: transform var(--transition); }
.staff-card__profile:hover { text-decoration: underline; }
.staff-card__profile:hover span[aria-hidden] { transform: translateX(3px); }

/* Alt background helper for visual rhythm (the gray) */
.section--alt { background: var(--color-bg-alt); }

/* Default background bands so the homepage alternates white / gray cleanly. */
.section--quick_links { background: var(--color-bg-alt); }
.section--icon_grid { background: #fff; }
.section--two_column { background: var(--color-bg-alt); }
.section--events { background: #fff; }

/* Shared section intro */
.section__intro { max-width: 48rem; color: var(--color-text-muted); margin-bottom: var(--space-5); }

/* Centered call-to-action below a grid (e.g. "View all programs") */
.section__cta { text-align: center; margin-top: var(--space-6); }

/* ---- Search bar block ---- */
.section--search { text-align: center; }
.site-search { display: flex; gap: var(--space-2); max-width: 40rem; margin-inline: auto; }
.site-search input[type="search"] { flex: 1; min-width: 0; padding: var(--space-3) var(--space-4); border: 1px solid var(--color-border); border-radius: 999px; font: inherit; background: #fff; }
.site-search input[type="search"]:focus { outline: 3px solid var(--color-focus); outline-offset: 1px; border-color: var(--color-brand); }
.site-search .btn { white-space: nowrap; }
@media (max-width: 480px) { .site-search { flex-direction: column; } }

/* ---- Section nav: pill links that jump to sections on the page ---- */
.section-nav { background: var(--color-bg-alt); border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.section-nav .container { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); padding-block: var(--space-3); }
.section-nav__lead { font-weight: 800; color: var(--color-brand-dark); }
.section-nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-2); }
.section-nav a { display: inline-block; padding: .35rem .9rem; border-radius: 999px; background: #fff; border: 1px solid var(--color-border); color: var(--color-brand); font-weight: 600; text-decoration: none; transition: background var(--transition), color var(--transition), border-color var(--transition); }
.section-nav a:hover { background: var(--color-brand); color: #fff; border-color: var(--color-brand); }

/* ---- Audience quick-nav (Parents / Students / Staff / Future Families) ---- */
.audience-nav { display: grid; gap: var(--space-4); grid-template-columns: repeat(2, 1fr); }
@media (min-width: 860px) { .audience-nav { grid-template-columns: repeat(4, 1fr); } }
.aud-card { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-2); padding: var(--space-5); border-radius: var(--radius-lg); background: #fff; border: 1px solid var(--color-border); text-decoration: none; color: var(--color-brand-dark); position: relative; transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition); }
.aud-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: var(--color-brand-light); }
.aud-card__icon { display: inline-flex; align-items: center; justify-content: center; width: 58px; height: 58px; border-radius: 50%; background: var(--color-brand); color: #fff; }
.audience-nav .aud-card:nth-child(even) .aud-card__icon { background: var(--color-accent); }
.aud-card__svg { width: 28px; height: 28px; }
.aud-card__label { font-weight: 800; font-size: var(--fs-lg); }
.aud-card__sub { color: var(--color-text-muted); font-size: var(--fs-sm); }
.aud-card__arrow { position: absolute; top: var(--space-4); right: var(--space-4); color: var(--color-accent); font-weight: 800; transition: transform var(--transition); }
.aud-card:hover .aud-card__arrow { transform: translateX(4px); }

/* ---- Parallax banner ---- */
.parallax { position: relative; background-size: cover; background-position: center; background-attachment: fixed; min-height: 360px; display: flex; align-items: center; }
/* logo/graphic backgrounds: show the whole thing, centered, as a soft watermark */
.parallax--contain { background-size: auto 74%; background-repeat: no-repeat; background-attachment: scroll; }
.parallax::before { content: ""; position: absolute; inset: 0; }
.parallax--none::before { display: none; }
.parallax--light::before { background: rgba(255,255,255,.82); }
.parallax--dark::before { background: linear-gradient(rgba(7,41,79,.66), rgba(7,41,79,.66)); }
.parallax--brand::before { background: linear-gradient(120deg, rgba(7,41,79,.82), rgba(10,58,120,.62)); }
.parallax__inner { position: relative; text-align: center; max-width: 46rem; }
.parallax--dark .parallax__heading, .parallax--brand .parallax__heading,
.parallax--dark .parallax__text, .parallax--brand .parallax__text { color: #fff; }
.parallax--light .parallax__heading { color: var(--color-brand-dark); }
.parallax--light .parallax__text { color: var(--color-text); }
.parallax__heading { font-size: var(--fs-h2); margin-bottom: var(--space-3); }
.parallax__text { font-size: var(--fs-lg); margin-bottom: var(--space-4); }
.parallax .button-row { justify-content: center; }
/* Fixed backgrounds are janky/zoomed on mobile — fall back to normal scroll. */
@media (max-width: 768px) { .parallax { background-attachment: scroll; } }
@media (prefers-reduced-motion: reduce) { .parallax { background-attachment: scroll; } }

/* Centered headings + short red accent rule for the homepage feature sections */
.section--icon_grid .section__heading,
.section--cards .section__heading,
.section--testimonials .section__heading,
.section--events .section__heading,
.section--steps .section__heading { text-align: center; }
.section--icon_grid .section__heading::before,
.section--cards .section__heading::before,
.section--testimonials .section__heading::before,
.section--events .section__heading::before,
.section--steps .section__heading::before {
	content: ""; display: block; width: 40px; height: 2px; border-radius: 2px;
	background: var(--color-brand-light); opacity: .6; margin: 0 auto var(--space-3);
}
.section--icon_grid .section__intro,
.section--cards .section__intro,
.section--testimonials .section__intro,
.section--events .section__intro,
.section--steps .section__intro { margin-inline: auto; text-align: center; margin-bottom: var(--space-6); }

/* ---- How It Works: friendly numbered steps ---- */
.steps { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-4); grid-template-columns: 1fr; }
@media (min-width: 760px) { .steps { grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); } }
.step { position: relative; background: var(--color-bg-alt); border-radius: var(--radius-lg); padding: var(--space-6) var(--space-5) var(--space-5); text-align: center; }
.step__num { position: absolute; top: calc(-1 * var(--space-3)); left: 50%; transform: translateX(-50%); display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: var(--color-accent); color: #fff; font-weight: 800; box-shadow: 0 4px 10px rgba(200,16,46,.35); }
.step__icon { display: inline-flex; color: var(--color-brand); margin-bottom: var(--space-2); }
.step__svg { width: 42px; height: 42px; }
.step__title { color: var(--color-brand-dark); font-size: var(--fs-lg); margin-bottom: var(--space-1); }
.step p { color: var(--color-text-muted); margin: 0; }

/* ---- Hero slideshow / video — layered depth, no photo required ---- */
.hero-slideshow {
	position: relative; overflow: hidden;
	background:
		radial-gradient(1100px 520px at 82% -10%, rgba(40,105,185,.55), transparent 60%),
		radial-gradient(900px 520px at -5% 110%, rgba(6,33,64,.7), transparent 55%),
		linear-gradient(135deg, var(--color-brand-dark) 0%, var(--color-brand) 55%, #114a92 100%);
}
/* subtle dot texture */
.hero-slideshow::before {
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
	background-image: radial-gradient(rgba(255,255,255,.07) 1.4px, transparent 1.5px);
	background-size: 24px 24px;
}
/* Eagle/emblem soaring in the hero. `screen` blend drops a white background
   to navy and lets the lighter subject glow; tuned for the light eagle art. */
.hero-emblem {
	position: absolute; z-index: 0; right: -2%; top: 50%; transform: translateY(-50%);
	width: clamp(420px, 52vw, 820px); height: auto; max-height: 104%; pointer-events: none;
	opacity: 1; mix-blend-mode: multiply; filter: none;
}
@media (max-width: 1024px) { .hero-emblem { width: 72vw; right: -10%; } }
@media (max-width: 600px) { .hero-emblem { display: none; } }
.hero-slideshow__viewport { position: relative; z-index: 1; }
.hero-slide { position: relative; display: none; min-height: clamp(380px, 56vh, 620px); align-items: center; color: #fff; background-size: cover; background-position: center; }
.hero-slide:not([hidden]) { display: flex; }
/* photo slides keep a dark overlay for legibility; plain slides show the gradient */
.hero-slide.has-bg { background-color: var(--color-brand); }
.hero-slide.has-bg::before { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, rgba(7,41,79,.84), rgba(10,58,120,.5)); z-index: 1; }
.hero-slide__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.hero-slide__content { position: relative; z-index: 2; max-width: 52rem; padding-block: var(--space-6); }
.hero-slide__content h2 { color: #fff; font-size: var(--fs-h1); margin-bottom: var(--space-4); }
.hero-slide__content .hero__sub { font-size: var(--fs-lg); opacity: .96; margin-bottom: var(--space-4); }
.hero-slideshow__arrow {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
	display: inline-flex; align-items: center; justify-content: center;
	width: 52px; height: 52px; padding: 0 0 4px; border: 0; border-radius: 50%;
	background: rgba(7, 41, 79, .55); color: #fff; font-size: 2rem; line-height: 1; cursor: pointer;
	-webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
	transition: background var(--transition), transform var(--transition);
}
.hero-slideshow__arrow:hover { background: var(--color-brand); }
.hero-slideshow__arrow:active { transform: translateY(-50%) scale(.94); }
.hero-slideshow__arrow:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.hero-slideshow__arrow--prev { left: var(--space-4); }
.hero-slideshow__arrow--next { right: var(--space-4); }

.hero-slideshow__dots { position: absolute; bottom: var(--space-4); left: 50%; transform: translateX(-50%); z-index: 3; display: flex; gap: var(--space-2); }
.hero-slideshow__dot { width: 12px; height: 12px; border-radius: 50%; border: 2px solid #fff; background: rgba(255,255,255,.35); cursor: pointer; padding: 0; transition: background var(--transition), transform var(--transition); }
.hero-slideshow__dot:hover { transform: scale(1.15); }
.hero-slideshow__dot.is-active { background: #fff; }

/* On tablet/mobile, move the arrows to the bottom corners so they never sit on
   top of the headline; dots stay centered between them. */
@media (max-width: 1024px) {
	.hero-slideshow__arrow { top: auto; bottom: var(--space-3); transform: none; width: 44px; height: 44px; font-size: 1.7rem; background: rgba(7, 41, 79, .7); }
	.hero-slideshow__arrow:active { transform: scale(.94); }
	.hero-slideshow__arrow--prev { left: var(--space-3); }
	.hero-slideshow__arrow--next { right: var(--space-3); }
	.hero-slideshow__dots { bottom: calc(var(--space-3) + 10px); }
	.hero-slide__content { padding-bottom: calc(var(--space-6) + 46px); }
}

/* ---- Icon grid (what Lincoln is) ---- */
/* Icon grid: clean line icons (no tile). 2 across on mobile, 3 on tablet, 6 on desktop. */
.icon-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-5) var(--space-4); grid-template-columns: repeat(2, 1fr); }
@media (min-width: 600px) { .icon-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1000px) { .icon-grid { grid-template-columns: repeat(6, 1fr); } }
.icon-feature { text-align: center; }
.icon-feature__icon { display: inline-flex; align-items: center; justify-content: center; color: var(--color-brand); margin-bottom: var(--space-2); }
.icon-feature__svg { width: 42px; height: 42px; }
.icon-feature__title { color: var(--color-brand-dark); margin-bottom: var(--space-1); font-size: var(--fs-base); }
.icon-feature p { color: var(--color-text-muted); font-size: var(--fs-sm); }

/* ---- Cards (programs / help) ---- */
.card-grid { display: grid; gap: var(--space-4); }
.card-grid--2 { grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); }
.card-grid--4 { grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); }
/* 3-up: exactly 1 / 2 / 3 across (mobile / tablet / desktop) */
.card-grid--3 { grid-template-columns: 1fr; }
@media (min-width: 620px) { .card-grid--3 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .card-grid--3 { grid-template-columns: repeat(3, 1fr); } }
/* 6-up: 2 on mobile, 3 on tablet, 6 on desktop — with tighter cards so they fit. */
.card-grid--6 { grid-template-columns: repeat(2, 1fr); }
@media (min-width: 620px) { .card-grid--6 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1000px) { .card-grid--6 { grid-template-columns: repeat(6, 1fr); } }
.card-grid--6 .feature-card .card__body { padding: var(--space-3); }
.card-grid--6 .feature-card .card__title { font-size: var(--fs-base); }
.card-grid--6 .feature-card__icon { width: 48px; height: 48px; margin: var(--space-3) var(--space-3) 0; }
.card-grid--6 .feature-card__svg { width: 26px; height: 26px; }
.card-grid--6 .feature-card p { font-size: var(--fs-sm); }
.feature-card { height: 100%; }
.feature-card__icon { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 14px; background: #e9f1fb; color: var(--color-brand); margin: var(--space-4) var(--space-4) 0; }
.feature-card__svg { width: 30px; height: 30px; }
.feature-card .card__body { gap: var(--space-2); flex: 1; padding: var(--space-4); }
.feature-card .card__title { font-size: var(--fs-lg); }
.feature-card p { color: var(--color-text-muted); }
.feature-card__link { font-weight: 700; text-decoration: none; color: var(--color-brand); margin-top: auto; }
.feature-card__link:hover { color: var(--color-accent); }

/* ---- Menu display (image / PDF of the menu) ---- */
.menu-board { display: grid; gap: var(--space-5); grid-template-columns: 1fr; }
.menu-board:not(.menu-board--multi) { max-width: 44rem; margin-inline: auto; }
@media (min-width: 760px) { .menu-board--multi { grid-template-columns: repeat(2, 1fr); } }
.menu-card { margin: 0; background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-4); box-shadow: var(--shadow); }
.menu-card__label { font-weight: 800; font-size: var(--fs-lg); color: var(--color-brand-dark); margin-bottom: var(--space-3); text-align: center; }
.menu-card__img { display: block; }
.menu-card__img img { width: 100%; height: auto; display: block; border: 1px solid var(--color-border); border-radius: var(--radius); transition: transform var(--transition); }
.menu-card__img:hover img { transform: scale(1.01); }
.menu-card__pdf { width: 100%; height: 540px; border: 1px solid var(--color-border); border-radius: var(--radius); background: #fff; }
.menu-card__placeholder { background: var(--color-bg); border: 2px dashed var(--color-border); border-radius: var(--radius); padding: var(--space-7) var(--space-5); text-align: center; color: var(--color-text-muted); margin: 0; }
.menu-card__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); justify-content: center; margin-top: var(--space-4); }

/* ---- Lincoln at a Glance: friendly news feed ---- */
.news-feed { max-width: 46rem; margin-inline: auto; display: flex; flex-direction: column; gap: var(--space-3); }
.ncard { display: flex; gap: var(--space-4); align-items: center; background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-3) var(--space-4); transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition); }
.ncard:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); border-color: var(--color-brand-light); }
.ncard__date { flex: 0 0 auto; width: 66px; height: 66px; border-radius: 16px; background: var(--color-brand); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1; text-decoration: none; }
.news-feed .ncard:nth-child(even) .ncard__date { background: var(--color-accent); }
.ncard__month { font-size: var(--fs-sm); text-transform: uppercase; letter-spacing: .04em; font-weight: 700; }
.ncard__day { font-size: 1.6rem; font-weight: 800; }
.ncard__body { flex: 1; min-width: 0; }
.ncard__tag { display: inline-block; font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--color-accent); background: #fde8eb; border-radius: 999px; padding: .1rem .55rem; margin-bottom: 4px; }
.ncard__title { margin: 0 0 2px; font-size: var(--fs-lg); }
.ncard__title a { text-decoration: none; color: var(--color-brand-dark); }
.ncard__title a:hover { color: var(--color-accent); }
.ncard__excerpt { margin: 0 0 var(--space-1); color: var(--color-text-muted); font-size: var(--fs-sm); }
.ncard__link { font-weight: 700; color: var(--color-accent); text-decoration: none; }
.ncard__link span { display: inline-block; transition: transform var(--transition); }
.ncard:hover .ncard__link span { transform: translateX(4px); }

/* ---- Testimonials: rotating spotlight on a blue band ---- */
.section--testimonials { background: var(--color-brand); color: #fff; }
.section--testimonials .section__heading { color: #fff; }
.section--testimonials .section__heading::before { background: #fff; opacity: .5; }
.tspot { position: relative; max-width: 50rem; margin-inline: auto; text-align: center; padding-inline: var(--space-7); }
/* Stack every slide in one grid cell so the viewport is always as tall as the
   LONGEST quote — short and long quotes no longer change the section height. */
.tspot__viewport { position: relative; display: grid; place-items: center; min-height: 11rem; }
.tspot__item { grid-area: 1 / 1; width: 100%; margin: 0; transition: opacity .35s ease; }
.tspot__item[hidden] { display: block; visibility: hidden; opacity: 0; pointer-events: none; }
.tspot__mark { display: block; font-family: Georgia, "Times New Roman", serif; font-size: 4.5rem; line-height: .6; color: var(--color-accent); margin-bottom: var(--space-3); }
.tspot__quote { margin: 0 0 var(--space-4); }
/* Cap each quote to a consistent number of lines so very long and very short
   quotes occupy a similar, sensible space (long ones trail off with a …). */
.tspot__quote p { margin: 0; font-size: clamp(1.15rem, 2vw, 1.5rem); line-height: 1.45; font-weight: 500; color: #fff;
	display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 8; line-clamp: 8; overflow: hidden; }
.tspot__cite { display: flex; flex-direction: column; gap: 2px; }
.tspot__name { font-weight: 700; color: #fff; }
.tspot__role { color: #cfe0f5; font-size: var(--fs-sm); }
.tspot__arrow { position: absolute; top: 38%; transform: translateY(-50%); width: 46px; height: 46px; padding: 0 0 4px; border: 0; border-radius: 50%; background: rgba(255,255,255,.15); color: #fff; font-size: 1.7rem; line-height: 1; cursor: pointer; transition: background var(--transition); }
.tspot__arrow:hover { background: rgba(255,255,255,.3); }
.tspot__arrow--prev { left: 0; }
.tspot__arrow--next { right: 0; }
.tspot__dots { display: flex; justify-content: center; gap: var(--space-2); margin-top: var(--space-5); }
.tspot__dot { width: 11px; height: 11px; border-radius: 50%; border: 2px solid #fff; background: rgba(255,255,255,.3); cursor: pointer; padding: 0; transition: background var(--transition); }
.tspot__dot.is-active { background: #fff; }
@media (max-width: 600px) { .tspot { padding-inline: var(--space-2); } .tspot__arrow { display: none; } }

/* ---- Events + Calendar + Donate ---- */
.events__grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: var(--space-5); align-items: start; }
.events__grid--single { grid-template-columns: 1fr; max-width: var(--container-narrow); margin-inline: auto; }
@media (max-width: 860px) { .events__grid { grid-template-columns: 1fr; } }
.events__subhead { color: var(--color-brand-dark); font-size: var(--fs-lg); margin-bottom: var(--space-3); }
.event-list { list-style: none; margin: 0 0 var(--space-4); padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.event { display: flex; gap: var(--space-4); align-items: center; padding: var(--space-2) var(--space-3); background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius); }
.event__date { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 5.5rem; background: var(--color-brand); color: #fff; border-radius: var(--radius); padding: var(--space-2); }
.event__date-main { font-weight: 800; }
.event__time { font-size: var(--fs-sm); opacity: .92; }
.event__title { font-weight: 600; }
.events__calendar { display: flex; flex-direction: column; gap: var(--space-3); align-items: flex-start; }
.events__cal-frame { width: 100%; min-height: 520px; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: #fff; }
@media (max-width: 860px) { .events__cal-frame { min-height: 420px; } }
.events__donate { background: var(--color-brand); color: #fff; border-radius: var(--radius-lg); padding: var(--space-5); text-align: center; margin-top: var(--space-4); }
.events__donate h3 { color: #fff; margin-bottom: var(--space-2); }
.events__donate p { color: #dbe5f1; margin-bottom: var(--space-4); }

/* =========================================================================
   News: Lincoln at a Glance + Board Highlights
   ========================================================================= */

/* Page-hero intro line (archives) */
.page-hero__intro { color: rgba(255,255,255,.92); max-width: 56ch; margin: var(--space-3) 0 0; font-size: var(--fs-lg); }

/* Tighter section rhythm for the reading flow */
.section--tight { padding-block: var(--space-6); }

/* Clean, magazine-style article header */
.news-head { padding: var(--space-7) 0 var(--space-5); border-bottom: 1px solid var(--color-border); }
.news-head__back { display: inline-block; color: var(--color-brand); font-weight: 600; text-decoration: none; margin-bottom: var(--space-3); }
.news-head__back:hover { text-decoration: underline; }
.news-head__kicker { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; text-transform: uppercase; letter-spacing: .05em; font-size: var(--fs-sm); font-weight: 700; color: var(--color-accent); margin: 0 0 var(--space-2); }
.news-head__week { background: var(--color-bg-alt); color: var(--color-brand-dark); padding: .15rem .65rem; border-radius: 999px; letter-spacing: 0; text-transform: none; font-weight: 600; }
.news-head__title { margin: 0 0 var(--space-2); color: var(--color-brand-dark); font-size: clamp(1.6rem, 4vw, 2.4rem); line-height: 1.15; }
.news-head__date { color: var(--color-text-muted); margin: 0; }
.news-head__intro { margin: var(--space-3) 0 0; font-size: var(--fs-lg); }

.news-section-title { color: var(--color-brand-dark); margin: 0 0 var(--space-4); font-size: clamp(1.3rem, 3vw, 1.6rem); }

/* Readable body for the weekly rundown */
.news-body { font-size: 1.05rem; line-height: 1.7; }
.news-body > :first-child { margin-top: 0; }
.news-body ul, .news-body ol { padding-left: 1.3rem; }
.news-body li + li { margin-top: .35rem; }
.news-body h2, .news-body h3 { color: var(--color-brand-dark); margin-top: var(--space-5); }
.news-body img { max-width: 100%; height: auto; border-radius: var(--radius); }

/* Flyer gallery (images) — uncropped, click to enlarge.
   Fixed-ish card width + centered row so one or two flyers look intentional
   instead of stranded in a wide column; many flyers wrap into a tidy grid. */
.flyers { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 260px)); gap: var(--space-4); align-items: start; justify-content: center; }
.flyer { margin: 0; background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius); overflow: hidden; transition: box-shadow var(--transition), transform var(--transition); }
.flyer:hover { box-shadow: var(--shadow-lg); transform: translateY(-2px); }
.flyer__link { display: flex; align-items: center; justify-content: center; background: var(--color-bg-alt); }
.flyer__img { display: block; width: 100%; height: auto; }
.flyer__cap { padding: var(--space-2) var(--space-3); font-size: var(--fs-sm); color: var(--color-text-muted); }

/* PDF/file download cards under the flyers */
.attach-files { margin-top: var(--space-4); }

/* Archive grid + school-year headings */
.news-grid { display: grid; gap: var(--space-5); grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); margin-bottom: var(--space-6); }
.news-year { color: var(--color-brand-dark); border-bottom: 2px solid var(--color-accent); padding-bottom: var(--space-2); margin: var(--space-6) 0 var(--space-4); }
.card__meta-week { margin-left: .5rem; padding-left: .5rem; border-left: 1px solid var(--color-border); color: var(--color-text-muted); }
.newsletter-card__more { display: inline-flex; align-items: center; gap: .35em; font-weight: 600; color: var(--color-brand); text-decoration: none; margin-top: var(--space-2); }
.newsletter-card__more:hover { text-decoration: underline; }

/* Board Highlights archive list */
.board-list { display: grid; gap: var(--space-4); margin-bottom: var(--space-6); }
.board-item { display: flex; gap: var(--space-4); background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-4); transition: border-color var(--transition), box-shadow var(--transition); }
.board-item:hover { border-color: var(--color-brand-light); box-shadow: var(--shadow-lg); }
.board-item__date { flex: none; width: 4rem; text-align: center; background: var(--color-brand); color: #fff; border-radius: var(--radius); padding: var(--space-2) 0; height: fit-content; }
.board-item__month { display: block; text-transform: uppercase; font-weight: 700; }
.board-item__year { display: block; font-size: var(--fs-sm); opacity: .85; }
.board-item__title { margin: 0 0 var(--space-1); font-size: var(--fs-lg); }
.board-item__title a { color: var(--color-brand-dark); text-decoration: none; }
.board-item__title a:hover { color: var(--color-brand); text-decoration: underline; }
.board-item__excerpt { color: var(--color-text-muted); margin: 0 0 var(--space-2); }
.board-item__tags { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 var(--space-2); }
.board-tag { font-size: var(--fs-sm); font-weight: 600; background: var(--color-bg-alt); color: var(--color-brand-dark); padding: .15rem .65rem; border-radius: 999px; }
.board-tag--audio { background: #e3ebf6; }

/* Board single — audio block */
.board-audio { background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius); padding: var(--space-4); margin-top: var(--space-4); }
.board-audio__label { display: flex; align-items: center; gap: .5rem; font-weight: 700; color: var(--color-brand-dark); margin: 0 0 var(--space-3); }
.board-audio__icon { width: 1.1em; height: 1.1em; color: var(--color-accent); }
.board-audio__player { width: 100%; margin-bottom: var(--space-3); }

@media (max-width: 520px) {
	.board-item { flex-direction: column; gap: var(--space-3); }
	.board-item__date { width: auto; display: inline-flex; gap: .4rem; padding: var(--space-1) var(--space-3); }
	.board-item__year { opacity: 1; }
}

/* Lead paragraph (page intros) — larger, easier to read */
.rich-text .lead { font-size: clamp(1.15rem, 2.2vw, 1.4rem); line-height: 1.6; color: var(--color-text); }

/* Jump-link targets clear the sticky header */
.section[id], .section-nav { scroll-margin-top: 96px; }

/* Multi-column list (compact link/service lists in rich text) */
.rich-text ul.list-cols { columns: 2; column-gap: 2.5rem; }
.rich-text ul.list-cols li { break-inside: avoid; }
@media (max-width: 600px) { .rich-text ul.list-cols { columns: 1; } }

/* --- Page polish: smaller staff-grid photos + lively section headings --- */
/* Staff GRID block (not the full directory): cap width so 2–3 people don't show huge photos */
.section--staff_grid .staff-grid { max-width: 760px; margin-inline: auto; }
/* Board of Trustees "pyramid": President on top, then 2, then 5 (desktop).
   Works on both the Board page (staff_grid) and the Staff Directory (staff_directory). */
.staff-grid--pyramid { grid-template-columns: repeat(10, minmax(0, 1fr)); align-items: stretch; gap: var(--space-3); }
.section--staff_grid .staff-grid--pyramid { max-width: none; }
.staff-grid--pyramid > * { grid-column: span 2; }
.staff-grid--pyramid > *:nth-child(1) { grid-row: 1; grid-column: 5 / 7; }
.staff-grid--pyramid > *:nth-child(2) { grid-row: 2; grid-column: 4 / 6; }
.staff-grid--pyramid > *:nth-child(3) { grid-row: 2; grid-column: 6 / 8; }
.staff-grid--pyramid > *:nth-child(4) { grid-row: 3; grid-column: 1 / 3; }
.staff-grid--pyramid > *:nth-child(5) { grid-row: 3; grid-column: 3 / 5; }
.staff-grid--pyramid > *:nth-child(6) { grid-row: 3; grid-column: 5 / 7; }
.staff-grid--pyramid > *:nth-child(7) { grid-row: 3; grid-column: 7 / 9; }
.staff-grid--pyramid > *:nth-child(8) { grid-row: 3; grid-column: 9 / 11; }
@media (max-width: 900px) {
	.staff-grid--pyramid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.staff-grid--pyramid > * { grid-column: auto !important; grid-row: auto !important; }
}
/* Administration org chart: Executive Director on top, the next tier of three
   below, then any remaining reports in a smaller third tier. Centered pyramid,
   collapses gracefully on narrow screens. */
.admin-chart { display: flex; flex-direction: column; align-items: center; gap: var(--space-5); }
.admin-chart__tier { display: grid; gap: var(--space-4); justify-content: center; align-items: stretch; width: 100%; }
.admin-chart__tier--1 { grid-template-columns: minmax(0, 230px); }
.admin-chart__tier--2 { grid-template-columns: repeat(3, minmax(0, 230px)); }
.admin-chart__tier--3 { grid-template-columns: repeat(2, minmax(0, 195px)); }
@media (max-width: 760px) {
	.admin-chart__tier--2 { grid-template-columns: repeat(2, minmax(0, 220px)); }
}
@media (max-width: 460px) {
	.admin-chart__tier { grid-template-columns: minmax(0, 260px); }
}

/* Nested sub-department heading (e.g. sub-categories under "Special Services"). */
.staff-subdept { margin-top: var(--space-5); }
.staff-subdept__title {
	font-size: 1.15rem; font-weight: 700; color: var(--color-primary, #0a3a78);
	margin: 0 0 var(--space-4); padding-left: var(--space-3);
	border-left: 4px solid var(--color-red, #c8102e);
}

/* A teacher with their assigned Teacher Aide's card tucked directly beneath,
   joined by a short "reports-to" line so the pairing reads clearly. */
.staff-pair { display: flex; flex-direction: column; min-width: 0; }
.staff-pair__aides {
	margin: var(--space-3) 0 0 var(--space-4);
	padding-left: var(--space-4);
	border-left: 2px solid var(--color-red, #c8102e);
	display: grid; gap: var(--space-3);
}
/* Keep small teams 2-up at every width (incl. mobile) so photos stay compact */
.section--staff_grid .staff-grid--2 { max-width: 760px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 480px) {
	.section--staff_grid .staff-card__contact { font-size: var(--fs-sm); }
	.section--staff_grid .staff-card .card__body { padding: var(--space-3); }
}
/* Accent underline on content section headings — makes pages feel designed/sectiony */
.rich-text > h2 { color: var(--color-brand-dark); margin-bottom: var(--space-3); }
.rich-text > h2::after { content: ""; display: block; width: 2.75rem; height: 3px; margin-top: .55rem; background: var(--color-accent); border-radius: 2px; }

/* 3-column list for longer link/name lists (fills width) */
.rich-text ul.list-cols-3 { columns: 3; column-gap: 2rem; }
.rich-text ul.list-cols-3 li { break-inside: avoid; }
@media (max-width: 760px){ .rich-text ul.list-cols-3 { columns: 2; } }

/* Tables inside rich text (e.g. meal prices) */
.rich-text table {
	width: 100%;
	border-collapse: collapse;
	margin: var(--space-4) 0;
	background: #fff;
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
	overflow: hidden;
}
.rich-text caption { caption-side: top; text-align: left; font-weight: 600; margin-bottom: var(--space-2); }
.rich-text thead th { background: var(--color-brand); color: #fff; text-align: left; font-weight: 700; }
.rich-text th, .rich-text td { padding: .7rem .95rem; border-top: 1px solid var(--color-border); text-align: left; }
.rich-text thead th { border-top: 0; }
.rich-text tbody tr:nth-child(even) { background: var(--color-bg-alt); }
/* Row-group label (e.g. "Students") spanning the table */
.rich-text tbody th[colspan] { background: var(--color-bg-alt); color: var(--color-brand-dark); font-weight: 700; }
/* Price tables: right-align the amount column */
.rich-text .price-table td:last-child,
.rich-text .price-table th:not([colspan]):last-child { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.rich-text .price-table { max-width: 32rem; }

/* Price cards (e.g. meal prices) — friendlier than a table */
.rich-text .price-cards {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--space-4);
	max-width: 46rem;
	margin: var(--space-4) 0;
	list-style: none;
	padding: 0;
}
@media (max-width: 560px) { .rich-text .price-cards { grid-template-columns: 1fr; } }
.rich-text .price-card {
	background: #fff;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	box-shadow: 0 2px 10px rgba(10, 58, 120, .08);
	overflow: hidden;
}
.rich-text .price-card__head {
	display: flex;
	align-items: center;
	gap: .55rem;
	background: linear-gradient(120deg, var(--color-brand-dark) 0%, var(--color-brand) 70%);
	color: #fff;
	font-weight: 700;
	font-size: var(--fs-lg);
	letter-spacing: .01em;
	padding: .8rem 1.15rem;
	margin: 0;
}
.rich-text .price-card__icon { font-size: 1.3rem; line-height: 1; }
.rich-text .price-card ul {
	list-style: none;
	margin: 0;
	padding: .35rem 1.15rem .9rem;
}
.rich-text .price-card li {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
	padding: .65rem 0;
	border-top: 1px solid var(--color-border);
}
.rich-text .price-card li:first-child { border-top: 0; }
.rich-text .price-card li .price-card__amt {
	font-weight: 800;
	color: var(--color-accent);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
	font-size: 1.08rem;
}
@media (max-width: 460px){ .rich-text ul.list-cols-3 { columns: 1; } }

/* Tables inside rich text (fee schedules, etc.) */
.rich-text table { margin: var(--space-3) 0; }
.rich-text th, .rich-text td { padding: .6rem .85rem; border: 1px solid var(--color-border); text-align: left; }
.rich-text thead th { background: var(--color-bg-alt); color: var(--color-brand-dark); }
.rich-text tbody tr:nth-child(even) { background: var(--color-bg-alt); }

/* Department cards (course catalog, etc.) — each topic in its own card */
.rich-text .dept-grid { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); margin: var(--space-5) 0 0; align-items: start; }
.rich-text .dept-card { background: #fff; border: 1px solid var(--color-border); border-top: 4px solid var(--color-brand); border-radius: var(--radius-lg); padding: var(--space-4) var(--space-5) var(--space-5); box-shadow: var(--shadow); }
.rich-text .dept-card h3 { margin: 0 0 var(--space-2); color: var(--color-brand-dark); font-size: var(--fs-lg); display: flex; align-items: center; gap: .5rem; }
.rich-text .dept-card ul { margin: 0; padding-left: 1.15rem; }
.rich-text .dept-card li { margin-bottom: .4rem; }
.rich-text .dept-card li:last-child { margin-bottom: 0; }

/* Board Meetings block (auto-updating) */
.board-meetings__note { font-size: var(--fs-lg); max-width: 46rem; }
.board-meetings__label { text-transform: uppercase; letter-spacing: .05em; font-weight: 700; color: var(--color-accent); font-size: var(--fs-sm); margin: var(--space-5) 0 var(--space-2); }
.board-meetings__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.board-meetings__list li { background: #fff; border: 1px solid var(--color-border); border-left: 4px solid var(--color-brand); border-radius: var(--radius); padding: var(--space-3) var(--space-4); font-weight: 600; color: var(--color-brand-dark); }
.board-meetings__empty { color: var(--color-text-muted); }

/* Collapsed-by-default staff directory */
.staff-prompt { text-align: center; color: var(--color-text-muted); margin: 0 auto var(--space-2); max-width: 42rem; }
.staff-pill__count { opacity: .82; font-weight: 600; }
.staff-pill--all { background: var(--color-brand); color: #fff; border-color: var(--color-brand); }
.staff-pill--all:hover { background: var(--color-brand-dark); border-color: var(--color-brand-dark); }
.staff-pill--collapse { background: var(--color-bg-alt); color: var(--color-brand-dark); border-color: var(--color-border); }
.staff-pill--collapse::before { content: "\2212"; margin-right: .35rem; font-weight: 700; }
.staff-pill--collapse:hover { border-color: var(--color-brand); }

/* Bell schedules (Calendar page) */
.bell-intro { font-size: 1.05rem; }
.bell-intro .bell-flag { display: inline-block; background: var(--color-accent); color: #fff; font-weight: 700; font-size: .78rem; letter-spacing: .03em; text-transform: uppercase; border-radius: 999px; padding: .15rem .6rem; margin-right: .4rem; }
.bell-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem; margin-top: var(--space-4); }
.bell-card { background: #fff; border: 1px solid var(--color-border); border-radius: 16px; overflow: hidden; box-shadow: 0 4px 16px rgba(10,58,120,.06); }
.bell-card--wide { grid-column: 1 / -1; }
.bell-card__head { background: var(--color-brand); color: #fff; font-weight: 700; font-size: 1.05rem; padding: .8rem 1.15rem; }
.bell-card__body { padding: 1.15rem; }
.bell-hours { margin: 0 0 .9rem; font-size: 1.05rem; color: var(--color-brand-dark); }
.bell-hours strong { color: var(--color-brand); }
.bell-hours em { color: var(--color-text-muted); font-style: normal; font-size: .9rem; }
.bell-table { width: 100%; border-collapse: collapse; }
.bell-table th { background: var(--color-bg-alt); color: var(--color-brand); text-align: left; font-size: .76rem; text-transform: uppercase; letter-spacing: .04em; padding: .5rem .8rem; }
.bell-table td { padding: .52rem .8rem; border-top: 1px solid var(--color-border); }
.bell-table td:first-child { font-weight: 600; color: var(--color-brand-dark); white-space: nowrap; }
.bell-table tbody tr:nth-child(even) { background: #f8fafc; }
.bell-two { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.bell-two h4 { margin: 0 0 .55rem; color: var(--color-brand); font-size: .95rem; }
@media (max-width: 760px) { .bell-grid, .bell-two { grid-template-columns: 1fr; } }

/* Volunteer "Check My Hours" lookup */
.vh { background: #fff; border: 1px solid var(--color-border); border-radius: 16px; padding: 1.5rem; box-shadow: 0 4px 16px rgba(10,58,120,.06); }
.vh__label { display: block; font-weight: 700; color: var(--color-brand); margin-bottom: .5rem; }
.vh__row { display: flex; gap: .6rem; flex-wrap: wrap; }
.vh__input { flex: 1 1 220px; min-width: 0; padding: .7rem .9rem; border: 1px solid var(--color-border); border-radius: 10px; font: inherit; }
.vh__input:focus { outline: 3px solid rgba(10,58,120,.25); outline-offset: 1px; border-color: var(--color-brand); }
.vh__btn { flex: 0 0 auto; padding: .7rem 1.3rem; border: 0; border-radius: 10px; background: var(--color-brand); color: #fff; font-weight: 700; cursor: pointer; transition: background var(--transition); }
.vh__btn:hover { background: var(--color-brand-dark); }
.vh__hint { margin: .55rem 0 0; font-size: var(--fs-sm); color: var(--color-text-muted); }
.vh__result { margin-top: 1.1rem; }
.vh__card { background: var(--color-bg-alt); border-radius: 12px; padding: 1.1rem 1.2rem; }
.vh__total { font-size: 1.15rem; color: var(--color-brand-dark); margin-bottom: .55rem; }
.vh__total strong { font-size: 1.6rem; color: var(--color-brand); }
.vh__track { height: 14px; background: #e3e9f2; border-radius: 999px; overflow: hidden; }
.vh__fill { height: 100%; background: var(--color-brand); border-radius: 999px; transition: width .5s ease; }
.vh__fill.is-done { background: #1f9d57; }
.vh__pct { margin-top: .45rem; font-size: var(--fs-sm); font-weight: 600; color: var(--color-text-muted); }
.vh__msg { margin: 0; color: var(--color-text); }
.vh__loading { color: var(--color-text-muted); }
.vh__details { margin-top: .9rem; }
.vh__details summary { cursor: pointer; font-weight: 600; color: var(--color-brand); }
.vh__tablewrap { overflow-x: auto; margin-top: .6rem; }
.vh__table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.vh__table th { text-align: left; background: var(--color-bg-alt); color: var(--color-brand); padding: .5rem .7rem; }
.vh__table td { padding: .5rem .7rem; border-top: 1px solid var(--color-border); vertical-align: top; }

/* Small button + card actions (appointment / supply buttons). */
.btn--sm { padding: .42rem .95rem; font-size: .85rem; }
.staff-card__actions { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: var(--space-3); }
.staff-card__supply { display: inline-flex; align-items: center; gap: .35em; }
.staff-card__supply-icon { flex: none; }
.staff-appts { margin-top: var(--space-4); }
.staff-appts__title { font-size: 1.05rem; margin: 0 0 var(--space-3); }
.staff-appts .btn { display: block; margin-bottom: var(--space-2); }
.staff-appts__supply { margin-top: var(--space-2); }

/* Teacher list (Meet the Teacher / Supply Lists pages). */
.tlist__grade { margin-bottom: var(--space-6); }
.tlist__gradehead { font-size: 1.2rem; color: var(--color-primary, #0a3a78); margin: 0 0 var(--space-3); padding-bottom: var(--space-2); border-bottom: 2px solid var(--color-red, #c8102e); }
.tlist__rows { display: grid; gap: var(--space-2); }
.tlist__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) 0; border-bottom: 1px solid #eef1f6; }
.tlist__who { font-weight: 600; }
.tlist__actions { display: flex; flex-wrap: wrap; gap: .4rem; }
.tlist__empty { color: #64748b; font-style: italic; }

/* Announcements — self-hiding "quick actions" band (homepage, near the top). */
.section--announcements { background: #eef4fb; }
.announce-grid { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.announce-card {
	background: #fff; border: 1px solid var(--color-border, #e2e8f0); border-top: 4px solid var(--color-red, #c8102e);
	border-radius: var(--radius-lg, 14px); padding: var(--space-5); box-shadow: 0 3px 12px rgba(10,58,120,.07);
	display: flex; flex-direction: column; gap: var(--space-2);
}
.announce-card__icon {
	display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px;
	border-radius: 12px; background: #e7f0fb; color: var(--color-brand, #0a3a78); margin-bottom: var(--space-1);
}
.announce-card__icon--emoji { font-size: 1.4rem; }
.announce-card__svg { width: 24px; height: 24px; }
.announce-card__title { font-size: 1.15rem; margin: 0; color: var(--color-brand, #0a3a78); }
.announce-card__text { margin: 0; color: #475569; font-size: .95rem; line-height: 1.45; }
.announce-card__btn { margin-top: auto; align-self: flex-start; }