/* Home page */

/* hero ---------------------------------------------------------------- */
.home-hero { background: var(--c-dark); padding: 80px 0 0; margin-bottom: 120px; }
.home-hero__pad { padding: 0 60px; display: flow-root; }
.home-hero__card { position: relative; margin-bottom: -120px; padding: 180px 0; }
.home-hero__slides { position: absolute; inset: 0; overflow: hidden; z-index: 0; }
.home-hero__slide { position: absolute; inset: 0; background-size: cover; background-position: 50% 50%; opacity: 0; animation: home-fade 24s infinite; }
.home-hero__slide:nth-child(1) { animation-delay: 0s; }
.home-hero__slide:nth-child(2) { animation-delay: 6s; }
.home-hero__slide:nth-child(3) { animation-delay: 12s; }
.home-hero__slide:nth-child(4) { animation-delay: 18s; }
@keyframes home-fade { 0% { opacity: 0; } 4% { opacity: 1; } 25% { opacity: 1; } 29% { opacity: 0; } 100% { opacity: 0; } }
.home-hero__slide:first-child { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .home-hero__slide { animation: none; } .home-hero__slide:not(:first-child) { display: none; } }
.home-hero__shade { position: absolute; inset: 0; background-image: linear-gradient(90deg, #000 42%, rgba(242, 41, 91, 0) 80%); opacity: 0.6; z-index: 1; }
.home-hero__card > .cont { position: relative; z-index: 2; max-width: 1170px; margin-inline: auto; }
.home-hero__eyebrow { margin: 0 20px 0 0; font: 600 30px/1em var(--f-head); color: #fff; }
.home-hero__title { margin: -27px 20px 0 0; font: 600 54px/1.2em var(--f-head); color: #fff; }
.home-hero__text { margin: 0 60px 10px 0; color: #ececec; }
.home-hero__actions { display: flex; align-items: center; margin: 0 0 -20px; }
.home-hero__actions .btn { margin-right: 40px; }
.home-hero__play { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; padding: 0 0 0 5px; border-radius: 50%; background: #fff; color: var(--c-accent); transition: all 0.3s; }
.home-hero__play .ci-icon { width: 18px; height: 18px; fill: var(--c-accent); }
.home-hero__play:hover { background: var(--c-accent); }
.home-hero__play:hover .ci-icon { fill: #fff; }

/* intro + service cards ---------------------------------------------- */
.home-intro { padding: 100px 0; }
.home-h2 { margin: 0; padding: 0; font: 600 42px/1.2em var(--f-head); color: var(--c-primary); }
.home-intro__text { padding: 0 12%; color: var(--c-dark); }
.home-intro:not(.home-intro--cards) { padding-bottom: 60px; }
.home-intro--cards { padding-top: 70px; }
.home-intro--cards .home-cards { margin-top: 0; }
.home-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 40px 30px; align-items: start; max-width: 1140px; margin-top: 40px; }
.home-cards__item { min-width: 0; }

/* about collage ------------------------------------------------------- */
.home-about { padding: 0 0 50px; }
.home-about > .cont { max-width: 1170px; margin-inline: auto; }
.home-about .col > .ww.home-about__media { align-content: center; }
.home-about__stage { position: relative; width: 100%; aspect-ratio: 565 / 634; }
.home-about__img1 { position: absolute; left: 0; top: 0; width: 100%; }
.home-about__img1 img { display: block; width: 100%; }
.home-about__img2 { position: absolute; left: 0; top: 40.4%; width: 60%; }
.home-about__img2 img { display: block; width: 100%; border: solid #fff; border-width: 20px 20px 0 0; }
.home-about__box { position: absolute; left: 50.1%; top: 59.1%; width: 49.9%; height: 39%; background: var(--c-dark); border-top: 20px solid #fff; border-left: 20px solid #fff; padding: 40px; display: flex; align-items: center; justify-content: center; text-align: center; }
.home-about__box-in .ci-icon { width: 50px; height: 50px; fill: var(--c-accent); display: block; margin: 0 auto 15px; }
.home-about__box h3 { margin: 8px 0 16px; font: 600 24px/28.8px var(--f-head); color: #fff; }
.col > .ww.home-about__copy { padding: 10px 10px 10px 60px; }
.home-about__copy > .w-title { margin-bottom: 20px; }
.home-h2--sm { font: 600 32px/1.3em var(--f-head); color: var(--c-primary); }
.home-about__copy .w-text { color: #000; }
.home-about .col > .ww > .home-about__quote { margin: 10px 0 0 15px; padding: 0 0 0 30px; border-left: 4px solid var(--c-accent); font: italic 400 16px/1.5em var(--f-body); color: var(--c-primary); padding-bottom: 14.4px; }
.home-about__more { text-align: left; }
.home-about__btn { margin-top: 30px; padding: 18px 32px; }

/* CEO letter ---------------------------------------------------------- */
.home-ceo { padding: 100px 0; margin-top: 50px; }
.home-ceo > .cont { max-width: 1170px; margin-inline: auto; }
.col > .ww.home-ceo__copy { padding: 10px 60px 10px 10px; }
.home-ceo__name { margin-right: 20px; }
.home-ceo__copy .w-text { color: #000; }
.home-ceo__copy .w-text strong { font-weight: 400; }
.home-ceo__photo img { display: block; width: 100%; }
.home-ceo .col > .ww { align-content: center; }

/* locations heading ---------------------------------------------------- */
.home-locs { padding: 100px 0 80px; }
.home-locs > .cont { max-width: 1170px; margin-inline: auto; }
.home-locs .ww { justify-content: center; }
.home-locs__title { margin: 0 0 16px; padding: 8px 0 0; font: 600 54px/64.8px var(--f-head); color: var(--c-primary); }

/* school-based section ------------------------------------------------- */
.home-sbhc { padding: 100px 0; }
.home-sbhc > .cont { max-width: 1170px; margin-inline: auto; }
.home-sbhc__text { padding: 0 12%; }
.home-sbhc > .cont > .col > .ww { padding-top: 40px; }

/* tablet ---------------------------------------------------------------- */
@media (max-width: 1024px) {
	.home-hero { padding: 100px 20px 0; }
	.home-hero__pad { padding: 0; }
	.home-hero__card { padding: 120px 20px; }
	.home-hero__card .col.w-50:first-child { width: 70%; }
	.home-hero__card .col.w-50:last-child { width: 30%; }
	.home-intro { padding: 80px 10px 0; }
	.home-intro__text { padding: 0; }
	.home-intro:not(.home-intro--cards) { padding-bottom: 40px; }
	.home-intro--cards { padding-top: 50px; }
	.home-cards { gap: 40px 30px; margin-top: 32px; }
	.icon-box { padding: 30px; }
	.home-about { padding: 60px 10px 80px; }
	.home-about > .cont, .home-ceo > .cont { flex-wrap: wrap; }
	.home-about .col.w-50, .home-ceo .col.w-50 { width: 100%; }
	.home-about .col > .ww.home-about__media { padding-bottom: 40px; }
	.home-about__stage { aspect-ratio: 984 / 1022; }
	.home-about__img2 { width: 52%; top: 42.2%; }
	.home-about__box { left: 50%; width: 50%; top: 70.1%; height: 21.3%; }
	.col > .ww.home-about__copy { padding: 10px; }
	.home-ceo { padding: 40px 10px 0; }
	.col > .ww.home-ceo__copy { padding: 10px; }
	.home-ceo .col:last-child > .ww { padding: 10px 10px 80px; }
	.home-ceo .col > .ww { align-content: flex-start; }
	.home-ceo__photo { text-align: left; }
	.home-ceo__photo img { width: 80%; }
	.home-locs { padding: 80px 10px 40px; }
	.home-locs .col > .ww { padding: 0 10px; }
	.home-sbhc { padding: 80px 10px; }
	.home-sbhc__text { padding: 0; }
}

/* mobile ----------------------------------------------------------------- */
@media (max-width: 767px) {
	.home-hero { padding-top: 100px; }
	.home-hero__card { margin-bottom: -80px; padding: 40px 10px; }
	.home-hero__eyebrow { margin: 0; font-size: 26px; line-height: 1em; }
	.home-hero__title { margin: -22px 0 0; font-size: 32px; line-height: 1.2em; }
	.home-hero__text { margin: 0; }
	.home-hero__actions { flex-wrap: wrap; }
	.home-hero__actions .btn { margin: 0 20px 20px 0; padding: 15px 30px; }
	.home-hero__play { width: 50px; height: 50px; }
	.home-hero__actions { margin: -2px 0 0; }
	.home-hero__card .col.w-50:first-child, .home-hero__card .col.w-50:last-child { width: 100%; }
	.home-hero__card > .cont { flex-wrap: wrap; }
	.home-hero__card .col:last-child > .ww { padding: 0; min-height: 1px; }
	.home-h2 { font-size: 26px; line-height: 1.2em; }
	.home-intro { padding: 20px 10px 0; }
	.icon-box { overflow: hidden; }
	.home-ceo__copy .w-text { font-size: 16px; }
	.home-cards { grid-template-columns: 1fr; gap: 20px; margin-top: 20px; }
	.icon-box__badge .ci-icon { width: 25px; height: 25px; }
	.icon-box__title { font-size: 18px; }
	.home-about { padding: 20px 10px 40px; }
	.home-about .col > .ww.home-about__media { padding-bottom: 10px; }
	.home-about__stage { aspect-ratio: auto; }
	.home-about__img1 { display: none; }
	.home-about__img2 { position: static; width: 100%; height: auto; margin-bottom: 20px; }
	.home-about__img2 img { border-width: 0; }
	.home-about__box { position: relative; left: auto; top: auto; width: 100%; height: auto; margin-top: -140px; margin-top: calc(-40% + 0px); border-left: 0; padding: 40px 20px; display: block; }
	.home-about__box h3 { font-size: 20px; line-height: 24px; }
	.home-h2--sm { font-size: 24px; line-height: 1.3em; }
	.col > .ww.home-about__copy { margin-top: 20px; }
	.home-about .col > .ww > .home-about__quote { margin-left: 0; }
	.home-ceo { margin-top: 80px; padding: 0 10px 40px; }
	.col > .ww.home-ceo__copy { margin-top: 0; }
	.home-ceo .col:last-child > .ww { padding: 10px; margin-top: 20px; }
	.home-ceo__photo img { width: 100%; }
	.home-locs { padding: 40px 10px 20px; }
	.home-locs__title { font-size: 32px; line-height: 38.4px; }
	.home-sbhc { padding: 40px 10px; }
	.cta-donate__title { font-size: 26px; line-height: 1.2em; }
}