/* Homepage (ehome.blade.php): brought into line with the inner pages without
   changing its structure. Loaded after the page's own inline block, so these
   win where they meet. The same voice as inner.css and about.css: Barlow
   Condensed capitals for headings and figures, Source Sans Pro for reading,
   4px corners, the cedar band, sage on dark. Direction: DESIGN.md. */

:root {
	--hm-band: #283b3c;
	--hm-band-deep: #1f2f30;
	--hm-accent: #2c6e6b;
	--hm-sage: #93bdb6;
	--hm-ink: #1b2625;
	--hm-display: "Barlow Condensed", "Arial Narrow", "Roboto Condensed", sans-serif;
	--hm-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
}

/* ---- the hero line and the slide titles ---- */
.home-slider .leap, .home-slider .leap span, .vegas-titles, .veg-title {
	font-family: var(--hm-display) !important;
	text-transform: uppercase;
	font-weight: 700 !important;
	letter-spacing: 0 !important;
}
.home-slider .leap { font-size: clamp(40px, 6vw, 92px) !important; line-height: .92 !important; text-wrap: balance; }

/* ---- figures ---- */
.tp-impact { padding: 96px 0 100px; }
.tp-impact-title { font-family: var(--hm-display); text-transform: uppercase; font-weight: 600; font-size: clamp(36px, 4.4vw, 64px);
	line-height: .95; max-width: 22ch; }
.tp-impact-head { margin-bottom: 56px; }
.tp-stat .counter { font-family: var(--hm-display); font-weight: 700; font-size: clamp(64px, 7vw, 112px); letter-spacing: 0; line-height: .85; }
.tp-stat p { font-size: 15px; letter-spacing: 0; color: rgba(255, 255, 255, .8); }

/* ---- News and Announcements ---- */
.tp-news { padding: 96px 0 88px; }
.tp-news-title { font-family: var(--hm-display); text-transform: uppercase; font-weight: 600; font-size: clamp(40px, 4.6vw, 68px); line-height: .92; }
.tp-news-all { color: var(--hm-sage); }
.tp-lead, .tp-mini, .tp-evcar { border-radius: 4px; }
.tp-lead { position: relative; }
.tp-lead::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; z-index: 2; background: var(--hm-sage);
	transform: scaleX(0); transform-origin: left center; transition: transform .45s var(--hm-ease-out); }
.tp-lead:hover::before, .tp-lead:focus-visible::before { transform: scaleX(1); }
.tp-lead-h { font-family: var(--hm-display); text-transform: uppercase; font-weight: 600; font-size: clamp(28px, 2.6vw, 38px); line-height: .98; }
.tp-chip { border-radius: 3px; letter-spacing: 0; text-transform: none; font-size: 13px; }
.tp-evcar-label { letter-spacing: 0; text-transform: none; font-size: 13px; }

/* ---- the photograph bands (parallax) ---- */
.parrtext h2 { font-family: var(--hm-display) !important; text-transform: uppercase; font-weight: 600 !important;
	font-size: clamp(40px, 4.6vw, 68px) !important; line-height: .95 !important; letter-spacing: 0 !important; text-wrap: balance; }
.parrtext > div:not(.visit) { font-size: clamp(17px, 1.5vw, 20px) !important; line-height: 1.55 !important; max-width: 56ch; margin-inline: auto; }
.visit a { display: inline-flex !important; align-items: center; justify-content: center; min-height: 48px; padding: 10px 26px !important;
	border-radius: 999px !important; border: 1.5px solid rgba(147, 189, 182, .75) !important; background: rgba(31, 47, 48, .35) !important;
	color: #fff !important; font-weight: 700; transition: background-color .2s ease, color .2s ease, border-color .2s ease; }
.visit a:hover, .visit a:focus-visible { background: var(--hm-sage) !important; border-color: var(--hm-sage) !important; color: var(--hm-band-deep) !important; }

/* ---- Programs list beside its photograph ---- */
.events-list-item__date { border-radius: 4px; border-left-color: var(--hm-accent); background: #eef3f1; }
.events-list-item__date-day { font-family: var(--hm-display); font-weight: 700; font-size: 3rem; line-height: 1; }
.events-list-item__date-month { letter-spacing: 0; }
.events-list-item__title { font-family: var(--hm-display); text-transform: uppercase; font-weight: 600; font-size: 1.6rem; line-height: 1; color: var(--hm-ink); }

/* ---- the Diaspora Network band ---- */
.dnet-band.dnet-band { padding: 104px 0; background: #eef3f1; }
.dnet-band .dnet-shot { border-radius: 4px; }
.dnet-band .dnet-eyebrow { background: none; padding: 0; border-radius: 0; letter-spacing: 0; text-transform: none; font-size: 15px; color: var(--hm-accent); }
.dnet-band .dnet-title { font-family: var(--hm-display); text-transform: uppercase; font-weight: 600; font-size: clamp(40px, 4.4vw, 64px); line-height: .95; color: var(--hm-ink); }
.dnet-band .dnet-cta { box-shadow: none; }

@media (max-width: 767px) {
	.tp-impact { padding: 64px 0 68px; }
	.tp-news { padding: 64px 0; }
	.dnet-band.dnet-band { padding: 64px 0; }
}
