/*
 * LiveSpecial — Homepage (LSRD26-36, LSRD26-63; docs/design/home.html).
 * Section spacing and every size below are from the design export.
 */

.ls-home-section { position: relative; padding-block: 3.5rem; }
@media ( min-width: 640px ) { .ls-home-section { padding-block: 4rem; } }
.ls-home-section--muted { padding-block: 4rem; background: var( --ls-muted ); }
@media ( min-width: 640px ) { .ls-home-section--muted { padding-block: 5rem; } }
/* Resource Library band: dark blue with the pattern by default (colours
 * from its section look, LSRD26-89). */
.ls-home-resources { overflow: hidden; padding-block: 4rem; }
@media ( min-width: 640px ) { .ls-home-resources { padding-block: 6rem; } }
.ls-home-resources .ls-section__title { line-height: 1.25; max-width: 20ch; } /* "Everything families need, / in one place." */
.ls-home-resources .ls-section__head { margin-bottom: 3rem; }
.ls-home-section--cta-dark { padding-block: 2.5rem; }
@media ( min-width: 640px ) { .ls-home-section--cta-dark { padding-block: 3.5rem; } }
.ls-home-section--cta-light { padding-block: 4rem; }
@media ( min-width: 640px ) { .ls-home-section--cta-light { padding-block: 5rem; } }
.ls-home-section .ls-section__head--center { margin-bottom: 2.5rem; }
.ls-home-section .ls-section__head--split { margin-bottom: 2rem; }
.ls-home-section__more { margin: 2rem 0 0; text-align: center; }

/* ── Hero (design home.html) ─────────────────────────── */
.ls-home-hero { position: relative; overflow: hidden; background: var( --ls-gradient-hero ); color: var( --ls-white ); }
.ls-home-hero.has-image { background: var( --ls-primary ); }
.ls-home-hero__bg { position: absolute; inset: 0; }
.ls-home-hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.ls-home-hero__bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient( 105deg, rgba( 25, 54, 103, 0.92 ) 0%, rgba( 25, 54, 103, 0.75 ) 55%, rgba( 25, 54, 103, 0.3 ) 100% );
}
.ls-home-hero__inner { position: relative; padding-block: 4rem; }
@media ( min-width: 1024px ) { .ls-home-hero__inner { padding-block: 6rem; } }
.ls-home-hero__main { max-width: 42rem; }
/* "text-[2.5rem] sm:text-5xl lg:text-[3.25rem] font-extrabold leading-[1.15] mb-5" */
.ls-home-hero__title {
	margin: 0 0 1.25rem;
	color: var( --ls-white );
	font-size: 2.5rem;
	font-weight: var( --ls-fw-black );
	line-height: 1.15;
}
@media ( min-width: 640px ) { .ls-home-hero__title { font-size: 3rem; } }
@media ( min-width: 1024px ) { .ls-home-hero__title { font-size: 3.25rem; } }
.ls-home-hero .ls-hl { color: var( --ls-accent ); }
.ls-home-hero__text { margin: 0 0 2rem; color: var( --ls-white ); font-size: 1.05rem; line-height: 1.625; }
.ls-home-hero__text strong { color: var( --ls-white ); font-weight: var( --ls-fw-bold ); }

/* "Popular:" quick searches under the search bar. */
.ls-home-hero__popular { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 1rem; margin-top: 1rem; }
.ls-home-hero__popular-label { color: var( --ls-white ); font-size: 0.75rem; font-weight: var( --ls-fw-semibold ); letter-spacing: 0.05em; text-transform: uppercase; }
.ls-home-hero__popular ul { display: flex; flex-wrap: wrap; gap: 0.25rem 0; margin: 0; padding: 0; list-style: none; }
.ls-home-hero__popular li + li::before { content: "·"; margin-inline: 0.75rem; color: var( --ls-accent ); font-size: 0.75rem; }
.ls-home-hero__popular a { color: var( --ls-white ); font-size: var( --ls-fs-sm ); text-decoration: none; text-underline-offset: 2px; transition: color var( --ls-transition ); }
.ls-home-hero__popular a:hover { color: var( --ls-accent ); text-decoration: underline; }

.ls-home-hero__stats { position: relative; padding-block: 1.25rem; background: rgba( 25, 54, 103, 0.88 ); -webkit-backdrop-filter: blur( 8px ); backdrop-filter: blur( 8px ); }

/* ── Steps band ──────────────────────────────────────── */
.ls-home-steps .ls-steps { margin-top: 0; }
.ls-home-steps__cta { margin: 3rem 0 0; text-align: center; }

/* ── Category tiles ("What are you looking for?") ──── */
.ls-tiles { display: grid; grid-template-columns: repeat( 2, minmax( 0, 1fr ) ); gap: 0.75rem; margin: 0; padding: 0; list-style: none; }
@media ( min-width: 640px ) { .ls-tiles { grid-template-columns: repeat( 4, minmax( 0, 1fr ) ); gap: 1rem; } }
.ls-tile {
	display: flex;
	flex-direction: column;
	align-items: center;
	height: 100%;
	padding: 1.5rem;
	border: 1px solid rgba( 25, 54, 103, 0.04 );
	border-radius: var( --ls-radius-card );
	background: var( --ls-white );
	box-shadow: 0 2px 10px rgba( 0, 0, 0, 0.06 );
	color: var( --ls-heading );
	text-align: center;
	text-decoration: none;
	transition: box-shadow 200ms ease, transform 200ms ease;
}
@media ( min-width: 640px ) { .ls-tile { padding: 2rem; } }
.ls-tile:hover { color: var( --ls-heading ); box-shadow: 0 6px 20px rgba( 0, 0, 0, 0.11 ); transform: translateY( -4px ); }
.ls-tile__icon { display: grid; place-items: center; width: 3rem; height: 3rem; margin-bottom: 1rem; border-radius: 1rem; transition: transform 200ms ease; }
@media ( min-width: 640px ) { .ls-tile__icon { width: 3.5rem; height: 3.5rem; } }
.ls-tile:hover .ls-tile__icon { transform: scale( 1.1 ); }
.ls-tile--primary .ls-tile__icon { background: var( --ls-primary-tint ); color: var( --ls-primary ); }
.ls-tile--secondary .ls-tile__icon { background: var( --ls-secondary-tint ); color: var( --ls-secondary ); }
.ls-tile--accent .ls-tile__icon { background: var( --ls-accent-tint ); color: var( --ls-primary ); }
.ls-tile--secondary-accent .ls-tile__icon { background: var( --ls-secondary-accent-tint ); color: var( --ls-primary ); }
.ls-tile__label { max-width: 100%; font-size: var( --ls-fs-sm ); font-weight: var( --ls-fw-semibold ); line-height: 1.375; overflow-wrap: anywhere; }
@media ( min-width: 640px ) { .ls-tile__label { font-size: 0.9rem; } }

/* ── Calls to action ─────────────────────────────────── */
.ls-cta { display: grid; overflow: hidden; border-radius: 1.5rem; }
@media ( min-width: 1024px ) { .ls-cta.has-image { grid-template-columns: 1fr 1fr; } }
.ls-cta__body { display: flex; flex-direction: column; justify-content: center; }
.ls-cta__buttons { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.ls-cta__media { position: relative; min-height: 17.5rem; }
@media ( min-width: 1024px ) { .ls-cta__media { min-height: 0; } }
.ls-cta__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Dark quote card: "bg-primary rounded-3xl … px-8 sm:px-12 lg:px-16 py-14 sm:py-20". */
.ls-cta--dark { background: var( --ls-primary ); }
.ls-cta--dark .ls-cta__body { padding: 3.5rem 2rem; }
@media ( min-width: 640px ) { .ls-cta--dark .ls-cta__body { padding: 5rem 3rem; } }
@media ( min-width: 1024px ) { .ls-cta--dark .ls-cta__body { padding-inline: 4rem; } }
.ls-cta--dark .ls-cta__quote { display: block; margin-bottom: 1.5rem; color: var( --ls-accent ); }
.ls-cta--dark .ls-cta__title { margin: 0 0 1.25rem; color: var( --ls-white ); font-size: 1.5rem; font-weight: var( --ls-fw-bold ); line-height: 1.625; }
@media ( min-width: 640px ) { .ls-cta--dark .ls-cta__title { font-size: 1.875rem; } }
.ls-cta--dark .ls-cta__text { margin: 0 0 2rem; color: var( --ls-white ); font-size: var( --ls-fs-sm ); line-height: 1.625; }
.ls-cta--dark .ls-cta__buttons { align-self: flex-start; }
/* The photo fades into the navy: left edge on wide screens, top on phones. */
.ls-cta--dark .ls-cta__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient( to bottom, var( --ls-cta-bg, var( --ls-primary ) ) 0%, transparent 50% ); }
@media ( min-width: 1024px ) { .ls-cta--dark .ls-cta__media::after { background: linear-gradient( to right, var( --ls-cta-bg, var( --ls-primary ) ) 0%, transparent 45% ); } }

/* Light provider card: "bg-muted rounded-3xl border border-border/30 … p-8 sm:p-10 lg:p-14". */
.ls-cta--light { border: 1px solid rgba( 25, 54, 103, 0.03 ); background: var( --ls-muted ); }
.ls-cta--light .ls-cta__body { padding: 2rem; }
@media ( min-width: 640px ) { .ls-cta--light .ls-cta__body { padding: 2.5rem; } }
@media ( min-width: 1024px ) { .ls-cta--light .ls-cta__body { padding: 3.5rem; } }
.ls-cta--light .ls-cta__title { margin: 0 0 0.75rem; color: var( --ls-primary ); font-size: 1.875rem; font-weight: var( --ls-fw-black ); line-height: 1.375; }
@media ( min-width: 640px ) { .ls-cta--light .ls-cta__title { font-size: 2.25rem; } }
.ls-cta--light .ls-cta__text { margin: 0 0 1.75rem; color: var( --ls-text ); font-size: 0.95rem; line-height: 1.625; }

/* ── Trusted providers (home card) ───────────────────── */
.ls-home-providers .ls-grid { gap: 1rem; }
@media ( min-width: 640px ) { .ls-home-providers .ls-grid { gap: 1.25rem; } }
.ls-card--provider-feature { border-color: rgba( 25, 54, 103, 0.05 ); box-shadow: 0 2px 12px rgba( 0, 0, 0, 0.08 ); }
.ls-card--provider-feature:hover { box-shadow: 0 6px 24px rgba( 0, 0, 0, 0.13 ); }
.ls-card--provider-feature .ls-card__media { aspect-ratio: auto; height: 12rem; }
.ls-card--provider-feature .ls-card__media img { transition-duration: 500ms; }
.ls-card--provider-feature:hover .ls-card__media img { transform: scale( 1.05 ); }
.ls-card--provider-feature .ls-card__body { padding: 1.25rem; }
@media ( min-width: 640px ) { .ls-card--provider-feature .ls-card__body { padding: 1.5rem; } }
.ls-card__topline { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; margin: 0 0 0.375rem; font-size: 0.75rem; line-height: 1rem; }
.ls-card__cat { color: var( --ls-secondary ); font-weight: var( --ls-fw-semibold ); }
.ls-card__where { display: inline-flex; align-items: center; gap: 0.25rem; color: var( --ls-muted-foreground ); }
.ls-card--provider-feature .ls-card__title { margin-bottom: 0.5rem; font-size: 1.125rem; font-weight: var( --ls-fw-bold ); line-height: 1.4; }
@media ( min-width: 640px ) { .ls-card--provider-feature .ls-card__title { font-size: 1.25rem; } }
.ls-card--provider-feature .ls-card__excerpt { margin-bottom: 1rem; font-size: var( --ls-fs-sm ); line-height: 1.625; -webkit-line-clamp: 3; }
.ls-card--provider-feature .ls-card__foot { flex-direction: column; align-items: flex-start; gap: 1rem; padding-top: 0; border-top: 0; }
.ls-card--provider-feature .ls-card__foot .ls-card__more { margin-left: 0; }
.ls-card--provider-feature .ls-chip { padding: 0.125rem 0.625rem; border: 0; border-radius: var( --ls-radius-full ); background: var( --ls-primary-tint ); color: var( --ls-primary ); font-size: 0.75rem; font-weight: var( --ls-fw-medium ); line-height: 1rem; }

/* ── Testimonials ────────────────────────────────────── */
.ls-testimonial {
	display: flex;
	flex-direction: column;
	height: 100%;
	margin: 0;
	padding: 1.5rem;
	border: 1px solid rgba( 25, 54, 103, 0.03 );
	border-radius: var( --ls-radius-card );
	background: var( --ls-white );
	box-shadow: 0 1px 3px 0 rgba( 0, 0, 0, 0.1 ), 0 1px 2px -1px rgba( 0, 0, 0, 0.1 );
}
@media ( min-width: 640px ) { .ls-testimonial { padding: 1.75rem; } }
.ls-testimonial__stars { display: flex; gap: 0.125rem; margin-bottom: 1.25rem; color: var( --ls-secondary ); }
.ls-testimonial__stars svg { fill: currentColor; }
.ls-testimonial__quote { flex: 1; margin: 0 0 1.5rem; color: var( --ls-foreground ); font-size: 0.95rem; font-style: italic; line-height: 1.625; }
.ls-testimonial__quote p { margin: 0; }
.ls-testimonial__who { display: flex; align-items: center; gap: 0.75rem; }
.ls-testimonial__photo { flex-shrink: 0; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var( --ls-muted ); object-fit: cover; }
.ls-testimonial__photo--initials { display: grid; place-items: center; background: var( --ls-primary-tint ); color: var( --ls-primary ); font-size: var( --ls-fs-sm ); font-weight: var( --ls-fw-bold ); }
.ls-testimonial__name { display: block; font-size: var( --ls-fs-sm ); font-weight: var( --ls-fw-bold ); }
.ls-testimonial__role { display: block; color: var( --ls-muted-foreground ); font-size: 0.75rem; line-height: 1rem; }
.ls-home-section--muted .ls-grid--3 { gap: 1rem; }
@media ( min-width: 640px ) { .ls-home-section--muted .ls-grid--3 { gap: 1.25rem; } }

/* ── Events + News ("lg:grid-cols-5", 3 + 2) ─────────── */
.ls-home-pair__grid { display: grid; gap: 2.5rem; }
@media ( min-width: 1024px ) { .ls-home-pair__grid { grid-template-columns: minmax( 0, 3fr ) minmax( 0, 2fr ); gap: 3.5rem; } }
.ls-home-events .ls-link-arrow,
.ls-home-news .ls-link-arrow { margin-top: 1.5rem; }

.ls-event-list--compact { display: grid; gap: 0.75rem; margin: 0; padding: 0; list-style: none; }
.ls-event--compact {
	position: relative;
	display: flex;
	gap: 1rem;
	padding: 1rem;
	border: 1px solid rgba( 25, 54, 103, 0.03 );
	border-radius: var( --ls-radius-card );
	background: var( --ls-muted );
	box-shadow: none;
	transition: background-color 200ms ease;
}
@media ( min-width: 640px ) { .ls-event--compact { gap: 1.25rem; padding: 1.25rem; } }
.ls-event--compact:hover { background: var( --ls-muted-strong ); }
.ls-event--compact .ls-event__date { display: flex; flex: 0 0 2.75rem; flex-direction: column; align-items: center; margin: 0; padding: 0; background: none; text-align: center; }
.ls-event--compact .ls-event__weekday,
.ls-event--compact .ls-event__year { color: var( --ls-muted-foreground ); font-size: 0.625rem; font-weight: var( --ls-fw-medium ); line-height: 1rem; text-transform: uppercase; }
.ls-event--compact .ls-event__year { font-weight: var( --ls-fw-normal ); text-transform: none; }
.ls-event--compact .ls-event__day { color: var( --ls-primary ); font-size: 1.5rem; font-weight: var( --ls-fw-black ); line-height: 1; }
.ls-event--compact .ls-event__body { min-width: 0; padding: 0; }
.ls-event--compact .ls-tag { margin-bottom: 0.375rem; }
.ls-event--compact .ls-event__title { margin: 0; font-size: var( --ls-fs-sm ); font-weight: var( --ls-fw-semibold ); line-height: 1.375; }
.ls-event--compact .ls-card__link { color: var( --ls-heading ); }
.ls-event--compact:hover .ls-card__link { color: var( --ls-secondary ); text-decoration: none; }
.ls-event__line { margin: 0.125rem 0 0; color: var( --ls-muted-foreground ); font-size: 0.75rem; line-height: 1rem; }

.ls-news-list { display: grid; gap: 1.25rem; margin: 0; padding: 0; list-style: none; }
.ls-news-item { position: relative; display: flex; gap: 1rem; align-items: flex-start; }
.ls-news-item__media { flex: 0 0 4.5rem; height: 4.5rem; overflow: hidden; border-radius: 0.75rem; background: var( --ls-muted ); }
.ls-news-item__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 300ms ease; }
.ls-news-item:hover .ls-news-item__media img { transform: scale( 1.05 ); }
.ls-news-item__media .ls-ph img.ls-ph__logo { width: 70%; }
.ls-news-item__meta { display: flex; align-items: center; gap: 0.5rem; margin: 0 0 0.25rem; color: var( --ls-muted-foreground ); font-size: 0.75rem; line-height: 1rem; }
.ls-news-item__cat { color: var( --ls-heading ); font-weight: var( --ls-fw-semibold ); }
.ls-news-item__title { margin: 0; font-size: var( --ls-fs-sm ); font-weight: var( --ls-fw-semibold ); line-height: 1.375; }
.ls-news-item__title .ls-card__link { color: var( --ls-heading ); }
.ls-news-item:hover .ls-card__link { color: var( --ls-secondary ); text-decoration: none; }

/* ── Resource Library (dark band) ────────────────────── */
.ls-home-resources .ls-grid--3 { gap: 1.25rem; }
@media ( min-width: 1024px ) { .ls-home-resources .ls-grid--3 { gap: 1.5rem; } }
.ls-card--resource-home { border: 0; box-shadow: 0 4px 20px rgba( 0, 0, 0, 0.25 ); transition: box-shadow 200ms ease, transform 200ms ease; }
.ls-card--resource-home:hover { box-shadow: 0 8px 32px rgba( 0, 0, 0, 0.35 ); transform: translateY( -4px ); }
.ls-card--resource-home .ls-card__media { aspect-ratio: auto; height: 13rem; }
.ls-card--resource-home .ls-card__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient( rgba( 0, 0, 0, 0.08 ) 0%, rgba( 0, 0, 0, 0.55 ) 100% ); pointer-events: none; }
.ls-card--resource-home .ls-card__badge--solid { z-index: 1; padding: 0.25rem 0.625rem; box-shadow: none; font-size: 0.625rem; letter-spacing: 0.1em; line-height: 1rem; }
.ls-card--resource-home .ls-play { width: 3.5rem; height: 3.5rem; }
.ls-card--resource-home .ls-card__duration { display: none; }
.ls-card--resource-home .ls-card__body { padding: 1.25rem; }
.ls-card--resource-home .ls-card__eyebrow { margin-bottom: 0.25rem; color: var( --ls-primary ); font-size: 0.75rem; font-weight: var( --ls-fw-semibold ); letter-spacing: 0; text-transform: none; }
.ls-card--resource-home.ls-card--article .ls-card__eyebrow,
.ls-card--resource-home.ls-card--article .ls-card__more { color: var( --ls-secondary ); }
.ls-card--resource-home.ls-card--publication .ls-card__eyebrow,
.ls-card--resource-home.ls-card--publication .ls-card__more { color: var( --ls-primary ); }
.ls-card--resource-home .ls-card__title { flex: 1; margin-bottom: 0.5rem; font-size: var( --ls-fs-sm ); font-weight: var( --ls-fw-bold ); line-height: 1.375; }
.ls-card--resource-home .ls-card__link { color: var( --ls-heading ); }
.ls-card--resource-home .ls-card__excerpt { margin-bottom: 1rem; font-size: 0.75rem; line-height: 1.625; }
.ls-card--resource-home .ls-card__more { font-size: 0.75rem; font-weight: var( --ls-fw-bold ); }