/* ════════════════════════════════════════════════════════════════════════
   Home page — 2026 Figma design (node 2811:1032).
   Mobile-first; desktop (Figma 1440) layout restored at >=1024px.
   Plain CSS, semantic classes — no Tailwind utilities, no inline styles.
   ════════════════════════════════════════════════════════════════════════ */

.te-home { background: #ffffff; }
.te-accent { color: #FF6900; }

/* Scroll reveal — fade + slide up on first viewport entry (global.js toggles
   .is-revealed). Matches the workforce-model section's effect. */
.te-reveal {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity .7s ease, transform .7s ease;
	will-change: opacity, transform;
}
.te-reveal.is-revealed { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.te-reveal { opacity: 1; transform: none; transition: none; }
}
/* Stagger the cards within each grid. */
.te-home-brand:nth-child(2), .te-home-feature:nth-child(2), .te-home-newscard:nth-child(2) { transition-delay: .1s; }
.te-home-brand:nth-child(3), .te-home-feature:nth-child(3) { transition-delay: .2s; }
.te-home-brand:nth-child(4) { transition-delay: .3s; }

/* Shared eyebrow + buttons + arrow */
.te-home-eyebrow {
	margin: 0;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 700;
	font-size: 14px;
	line-height: 20px;
	letter-spacing: 2.8px;
	text-transform: uppercase;
	color: #BF4E00; /* AA on white/cream (4.88/4.52:1); navy sections restore #FF6900 below */
}
.te-home-eyebrow--center { text-align: center; }

.te-home-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 16px 28px;
	border-radius: 8px;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 600;
	font-size: 16px;
	line-height: 24px;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
	cursor: pointer;
}
.te-home-btn--primary { background: #BF4E00; color: #ffffff; } /* AA: white label 4.88:1 */
.te-home-btn--primary:hover { background: #A84600; }
.te-home-btn--ghost { border: 1px solid rgba(255, 255, 255, 0.8); color: #ffffff; }
.te-home-btn--ghost:hover { background: rgba(255, 255, 255, 0.1); }
.te-home-arrow { width: 20px; height: 20px; flex-shrink: 0; }

/* ──────────────────────────────────────────────────────────
   1. HERO
   ────────────────────────────────────────────────────────── */
.te-home-hero {
	position: relative;
	background: #102953;
	overflow: hidden;
	isolation: isolate;
}
.te-home-hero__bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 70% center;
	z-index: 0;
}
.te-home-hero__scrim {
	position: absolute;
	inset: 0;
	z-index: 1;
	/* mobile: darken overall for legibility */
	background: linear-gradient(to bottom, rgba(13, 31, 60, 0.85) 0%, rgba(13, 31, 60, 0.78) 100%);
}
.te-home-hero__inner {
	position: relative;
	z-index: 2;
	max-width: 1280px;
	margin: 0 auto;
	padding: 88px 24px 96px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
}
.te-home-hero__eyebrow {
	margin: 0;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 700;
	font-size: 13px;
	line-height: 20px;
	letter-spacing: 2.6px;
	text-transform: uppercase;
	color: #FF6900;
}
.te-home-hero__title {
	margin: 0;
	font-family: "DM Serif Display", Georgia, serif;
	font-weight: 400;
	font-size: 40px;
	line-height: 1.08;
	color: #ffffff;
}
.te-home-hero__lead {
	margin: 0;
	position: relative;
	padding-left: 22px;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 500;
	font-size: 18px;
	line-height: 1.55;
	color: #e5e7eb;
	max-width: 720px;
}
/* Blue accent bar: spans the text's visual height at any line count. */
.te-home-hero__lead::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0.3em;
	bottom: 0.3em;
	width: 4px;
	background: #2263C5;
}
.te-home-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	padding-top: 8px;
}
.te-home-hero__wave {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 2;
	line-height: 0;
}
.te-home-hero__wave svg { display: block; width: 100%; height: 50px; }

/* ──────────────────────────────────────────────────────────
   2. OUR BRANDS  (navy gradient → white wave into "Who We Are")
   ────────────────────────────────────────────────────────── */
.te-home-brands {
	position: relative;
	/* Navy gradient + the Figma light-line texture (full-width, anchored top). */
	background-color: #071935;
	background-image: url(../images/brands-texture.svg), linear-gradient(to bottom, #102953 0%, #071935 54%, #071935 100%);
	background-repeat: no-repeat, no-repeat;
	background-position: top center, center;
	background-size: 100% auto, cover;
	padding: 64px 24px 96px;
	overflow: hidden;
}
.te-home-brands__inner { max-width: 1272px; margin: 0 auto; position: relative; z-index: 1; }
.te-home-brands__head { text-align: center; max-width: 1000px; margin: 0 auto; }
.te-home-brands__heading {
	margin: 16px 0 0;
	font-family: "DM Serif Display", Georgia, serif;
	font-weight: 400;
	font-size: 32px;
	line-height: 1.1;
	color: #ffffff;
}
.te-home-brands__sub {
	margin: 16px 0 0;
	font-family: Inter, system-ui, sans-serif;
	font-size: 17px;
	line-height: 28px;
	color: rgba(255, 255, 255, 0.6);
}
.te-home-brands__grid {
	display: flex;
	flex-direction: column;
	gap: 40px;
	margin: 88px 0 0;
}
.te-home-brand {
	position: relative;
	display: block;
	text-decoration: none;
	filter: drop-shadow(0 10px 30px rgba(5, 23, 52, 0.55));
	transition: transform .3s ease, filter .3s ease;
}
.te-home-brand:hover {
	transform: translateY(-4px);
	filter: drop-shadow(0 18px 40px rgba(5, 23, 52, 0.7));
}
.te-home-brand:hover .te-home-brand__title { color: #1a5fa8; }
.te-home-brand__wave { display: block; line-height: 0; position: relative; z-index: 1; }
.te-home-brand__wave svg { display: block; width: 100%; height: 17px; overflow: visible; }
.te-home-brand__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	background: #ffffff;
	border-radius: 0 0 16px 16px;
	margin-top: -1px;
	padding: 18px 28px 30px;
}
.te-home-brand__logo { display: flex; align-items: center; height: 44px; }
.te-home-brand__logo img { height: 100%; width: auto; max-width: 190px; object-fit: contain; }
.te-home-brand__logo--esc img { height: 40px; }
.te-home-brand__logo--gecko img { height: 42px; }
.te-home-brand__logo--aegs img { height: 40px; }
.te-home-brand__eyebrow {
	font-family: Inter, system-ui, sans-serif;
	font-weight: 700;
	font-size: 12px;
	line-height: 16px;
	letter-spacing: 2.6px;
	text-transform: uppercase;
	color: #FF6900;
}
.te-home-brand__title {
	margin: 0;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 700;
	font-size: 20px;
	line-height: 27.5px;
	color: #20385e;
	transition: color .2s ease;
}
.te-home-brand__desc {
	margin: 0;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 22.75px;
	color: #364153;
}
.te-home-brand__desc sup { color: #BF4E00; } /* AA on the white card (4.88:1) */
.te-home-brand:has(.te-home-brand__logo--esc) .te-home-brand__desc sup,
.te-home-brand:has(.te-home-brand__logo--gecko) .te-home-brand__desc sup { color: #364153; }
.te-home-brands__notes {
	margin: 56px auto 0;
	/* Left-justified when stacked/responsive; desktop re-centers below. */
	text-align: left;
	font-family: Inter, system-ui, sans-serif;
	font-size: 12px;
	font-style: italic;
	line-height: 20px;
	color: rgba(255, 255, 255, 0.6);
}
.te-home-brands__notes a { color: rgba(255, 255, 255, 0.6); text-decoration: underline; }
.te-home-brands__notes a:hover { color: rgba(255, 255, 255, 0.6); text-decoration: none; }
.te-home-brands__cta { text-align: center; margin-top: 32px; }
.te-home-brands__cta .te-home-btn { border-color: rgba(255, 255, 255, 0.3); border-width: 2px; }
.te-home-brands__wave { position: absolute; bottom: 0; left: 0; width: 100%; line-height: 0; z-index: 0; }
.te-home-brands__wave svg { display: block; width: 100%; height: 48px; }

/* ──────────────────────────────────────────────────────────
   3. WHO WE ARE  (white, 2-col + floating navy card on the photo)
   ────────────────────────────────────────────────────────── */
.te-home-who { background: #ffffff; padding: 64px 24px; }
.te-home-who__inner {
	max-width: 1152px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 36px;
}
.te-home-who__heading {
	margin: 14px 0 0;
	font-family: "DM Serif Display", Georgia, serif;
	font-weight: 400;
	font-size: 30px;
	line-height: 1.2;
	color: #003366;
}
.te-home-who__body {
	margin: 18px 0 0;
	font-family: Inter, system-ui, sans-serif;
	font-size: 18px;
	line-height: 29px;
	color: #364153;
}
.te-home-who__media { position: relative; }
.te-home-who__photo {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 16px;
	box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
	object-fit: cover;
	object-position: center top; /* anchor to the hat so the desktop crop frames the chef */
}
.te-home-who__card {
	background: #003366;
	border-radius: 16px;
	box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.18);
	padding: 18px 22px;
	margin: -32px 16px 0;
	position: relative;
}
.te-home-who__card-text {
	margin: 0;
	font-family: Inter, system-ui, sans-serif;
	font-size: 16px;
	line-height: 26px;
	color: #ffffff;
}

/* ──────────────────────────────────────────────────────────
   4. THE TRIUMPH ADVANTAGE  (shared workforce-model part)
   Home-only: cream wave dividers in/out of the white sections around it.
   ────────────────────────────────────────────────────────── */
.te-home .te-workforce { background: #F8F6F3; }
.te-home-wf-wave { background: #ffffff; line-height: 0; }
.te-home-wf-wave svg { display: block; width: 100%; height: 53px; }
.te-home-wf-wave--bottom svg { height: 67px; }

/* ──────────────────────────────────────────────────────────
   5. WHY TRIUMPH  (white; navy stats band + 3 feature cards)
   ────────────────────────────────────────────────────────── */
.te-home-why {
	/* Light-blue fade behind the cards — the body of the Figma backdrop band
	   (its wavy top edge is the stats panel's bottom cut; its wavy bottom edge
	   is the __bottomwave transition below). */
	/* Mobile/tablet: the white→blue fade completes behind the navy panel
	   (~20–45% falls within it), so everything visible below the panel is
	   already solid #edf0f7 — no alignment needed with the stacked panel's
	   variable bottom edge. Desktop overrides with px-anchored stops. */
	background: linear-gradient(to bottom, #ffffff 0%, #ffffff 20%, #edf0f7 45%, #edf0f7 100%);
	padding: 56px 24px 72px;
}
.te-home-why__head { text-align: center; max-width: 1224px; margin: 0 auto; }
.te-home-why__heading {
	margin: 12px 0 0;
	font-family: "DM Serif Display", Georgia, serif;
	font-weight: 400;
	font-size: 30px;
	line-height: 1.15;
	color: #003366;
}
.te-home-why__sub {
	max-width: 1054px;
	margin: 16px auto 0;
	font-family: Inter, system-ui, sans-serif;
	font-size: 18px;
	line-height: 28px;
	color: #4a5565;
}
.te-home-why__inner { max-width: 1224px; margin: 40px auto 0; }
.te-home-stats {
	position: relative;
	/* Navy gradient + the faint line texture (same as the CTA), per Figma. */
	background-color: #0d1f3c;
	background-image: url(../images/brands-texture.svg), linear-gradient(180deg, #071935 0%, #132c53 100%);
	background-repeat: no-repeat, no-repeat;
	background-position: top center, center;
	background-size: 100% auto, cover;
	border-radius: 16px 16px 0 0;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 36px 32px 56px;
	/* Stacked (mobile/tablet): full-bleed out of the section's 24px side
	   padding to the viewport edges; square top corners there. */
	margin-left: -24px;
	margin-right: -24px;
	width: auto;
}
.te-home-stat { padding: 16px 8px; text-align: center; }
.te-home-stat__num {
	font-family: "DM Serif Display", Georgia, serif;
	font-weight: 400;
	font-size: 48px;
	line-height: 1;
	color: #FF6900;
}
.te-home-stat__label {
	margin: 8px 0 0;
	font-family: Inter, system-ui, sans-serif;
	font-size: 14px;
	line-height: 20px;
	color: rgba(255, 255, 255, 0.8);
}
.te-home-stats__wave { position: absolute; bottom: -1px; left: 0; width: 100%; line-height: 0; }
.te-home-stats__wave svg { display: block; width: 100%; height: 44px; }
.te-home-features {
	display: flex;
	flex-direction: column;
	gap: 24px;
	margin-top: 32px;
}
.te-home-feature {
	background: #ffffff;
	border: 1px solid rgba(190, 219, 255, 0.5);
	border-radius: 16px;
	box-shadow: 0 0 30px 0 rgba(202, 213, 237, 0.8);
	padding: 28px;
}
.te-home-feature__badge {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border: 1.5px solid #2263C5;
	border-radius: 9999px;
	margin-bottom: 18px;
}
.te-home-feature__icon { width: 24px; height: 24px; }
.te-home-feature__title {
	margin: 0;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 700;
	font-size: 18px;
	line-height: 26px;
	color: #003366;
}
.te-home-feature__subtitle {
	margin: 4px 0 0;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 500;
	font-size: 18px;
	line-height: 26px;
	color: #003366;
}
.te-home-feature__desc {
	margin: 12px 0 0;
	font-family: Inter, system-ui, sans-serif;
	font-size: 14px;
	line-height: 22.75px;
	color: #4a5565;
}

/* ──────────────────────────────────────────────────────────
   6. OUR LEADERSHIP  (navy + line texture; team teaser)
   ────────────────────────────────────────────────────────── */
.te-home-team {
	position: relative;
	background-color: #0d1f3c;
	background-image: url(../images/brands-texture.svg), linear-gradient(180deg, #0d1f3c 0%, #102a52 100%);
	background-repeat: no-repeat, no-repeat;
	background-position: top center, center;
	background-size: 100% auto, cover;
	padding: 72px 24px;
}
.te-home-team__inner { max-width: 768px; margin: 0 auto; text-align: center; }
.te-home-team__heading {
	margin: 16px 0 0;
	font-family: "DM Serif Display", Georgia, serif;
	font-weight: 400;
	font-size: 34px;
	line-height: 1.1;
	color: #ffffff;
}
.te-home-team__sub {
	max-width: 574px;
	margin: 16px auto 28px;
	font-family: Inter, system-ui, sans-serif;
	font-size: 18px;
	line-height: 28px;
	color: rgba(255, 255, 255, 0.8);
}

/* ──────────────────────────────────────────────────────────
   7. LATEST NEWS  (white; two press-release cards)
   ────────────────────────────────────────────────────────── */
/* Cream ground (all levels) so the white news cards read as cards; the CTA
   wave below is filled with the same cream. */
.te-home-news { background: #F8F6F3; padding: 64px 24px; }
.te-home-news__inner { max-width: 1224px; margin: 0 auto; }
.te-home-news__head {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-bottom: 32px;
}
.te-home-news__heading {
	margin: 6px 0 0;
	font-family: "DM Serif Display", Georgia, serif;
	font-weight: 400;
	font-size: 30px;
	line-height: 1.15;
	color: #0d1f3c;
}
.te-home-news__viewall {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 600;
	font-size: 14px;
	color: #1a5fa8;
	text-decoration: none;
}
.te-home-news__viewall:hover { text-decoration: underline; }
.te-home-news__viewall .te-home-arrow { width: 16px; height: 16px; }
.te-home-news__grid { display: flex; flex-direction: column; gap: 24px; }
.te-home-newscard {
	display: flex;
	flex-direction: column;
	border: 1px solid #ecebe8;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
	text-decoration: none;
	background: #ffffff;
	padding: 0 28px 28px;
	transition: box-shadow .3s ease, transform .3s ease;
}
.te-home-newscard:hover { box-shadow: 0 18px 40px rgba(13, 31, 60, 0.12); transform: translateY(-4px); }
.te-home-newscard:hover .te-home-newscard__title { color: #1a5fa8; }
.te-home-newscard__bar {
	display: block;
	flex-shrink: 0;
	height: 4px;
	background: #FF6900;
	margin: 0 -28px 24px;
}
.te-home-newscard__cat {
	align-self: flex-start;
	flex-shrink: 0;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 700;
	font-size: 12px;
	line-height: 16px;
	letter-spacing: 1.8px;
	text-transform: uppercase;
	color: #4a5565;
	background: #eff4fb;
	padding: 5px 12px;
	border-radius: 9999px;
}
.te-home-newscard__title {
	margin: 16px 0 0;
	flex-shrink: 0;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 700;
	font-size: 16px;
	line-height: 24px;
	color: #0d1f3c;
	transition: color .2s ease;
}
.te-home-newscard__excerpt {
	margin: 12px 0 20px;
	flex-shrink: 0;
	font-family: Inter, system-ui, sans-serif;
	font-size: 14px;
	line-height: 22.75px;
	color: #6a7282;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.te-home-newscard__divider {
	display: block;
	flex-shrink: 0;
	margin-top: auto;
	padding-top: 20px;
	border-top: 1px solid #e5e7eb;
}
.te-home-newscard__more {
	align-self: flex-end;
	margin-top: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	height: 26px;
	background: #FF6900;
	color: #ffffff;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 600;
	font-size: 12px;
	padding: 0 16px;
	border-radius: 9999px;
	transition: background-color .2s ease;
}
.te-home-newscard__more .te-home-arrow { width: 13px; height: 13px; }
.te-home-newscard:hover .te-home-newscard__more { background: #e05e00; }

/* ──────────────────────────────────────────────────────────
   8. CTA  (navy gradient + line texture + white wave top)
   ────────────────────────────────────────────────────────── */
.te-home-cta {
	position: relative;
	overflow: hidden;
	background-color: #0d1f3c;
	background-image: url(../images/brands-texture.svg), linear-gradient(180deg, #081936 0%, #132C53 100%);
	background-repeat: no-repeat, no-repeat;
	background-position: top center, center;
	background-size: 100% auto, cover;
}
.te-home-cta__wave { position: absolute; top: 0; left: 0; width: 100%; line-height: 0; pointer-events: none; }
.te-home-cta__wave svg { display: block; width: 100%; height: 44px; }
.te-home-cta__inner {
	position: relative;
	z-index: 1;
	max-width: 768px;
	margin: 0 auto;
	padding: 88px 24px;
	text-align: center;
}
.te-home-cta__heading {
	margin: 16px 0 0;
	font-family: "DM Serif Display", Georgia, serif;
	font-weight: 400;
	font-size: 30px;
	line-height: 1.15;
	color: #ffffff;
}
.te-home-cta__sub {
	max-width: 664px;
	margin: 16px auto 28px;
	font-family: Inter, system-ui, sans-serif;
	font-size: 17px;
	line-height: 27px;
	color: #bedbff;
}
.te-home-cta__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; }
.te-home-cta .te-home-eyebrow { color: #FF6900; } /* brand orange; 5.69:1 on the navy CTA (AA) */
.te-home-cta .te-home-btn { font-size: 18px; } /* CTA buttons are larger than the rest */
.te-home-cta .te-home-btn--ghost { border-width: 2px; border-color: rgba(255, 255, 255, 0.3); }

/* ════════════════════════════════════════════════════════════════════════
   DESKTOP  (Figma 1440 layout)
   ════════════════════════════════════════════════════════════════════════ */
@media (min-width: 1024px) {
	/* 1. HERO */
	.te-home-hero__scrim {
		background: linear-gradient(to right, rgba(13, 31, 60, 0.8) 0%, rgba(13, 31, 60, 0.55) 55%, rgba(13, 31, 60, 0) 74.5%);
	}
	.te-home-hero__inner {
		min-height: 836px;
		justify-content: center;
		padding: 150px 24px 170px;
		gap: 32px;
	}
	.te-home-hero__title { font-size: 64px; line-height: 70px; max-width: 760px; }
	.te-home-hero__lead { font-size: 24px; line-height: 39px; padding-left: 28px; }
	.te-home-hero__wave svg { height: 90px; }

	/* 2. OUR BRANDS */
	.te-home-brands { padding: 80px 24px 112px; }
	.te-home-brands__heading { font-size: 48px; line-height: 48px; white-space: nowrap; }
	.te-home-brands__sub { font-size: 18px; }
	.te-home-brands__grid { flex-direction: row; align-items: stretch; gap: 24px; margin-top: 104px; }
	.te-home-brand { flex: 1 1 0; display: flex; flex-direction: column; }
	/* Side-by-side cards: reserve 2 eyebrow lines (bottom-aligned) and 2 title
	   lines so all four paragraphs start level however the headings wrap. */
	.te-home-brand__eyebrow { display: flex; align-items: flex-end; min-height: 32px; }
	.te-home-brand__title { min-height: 55px; }
	.te-home-brand__body { flex: 1 1 auto; }
	.te-home-brands__cta { margin-top: 56px; }
	.te-home-brands__notes { margin-top: 72px; text-align: center; }
	.te-home-brands__wave svg { height: 58px; }

	/* 3. WHO WE ARE */
	.te-home-who { padding: 112px 24px; }
	.te-home-who__inner { flex-direction: row; align-items: flex-start; gap: 64px; }
	.te-home-who__text { flex: 1 1 0; padding-top: 32px; }
	.te-home-who__heading { font-size: 36px; line-height: 44px; }
	.te-home-who__media { flex: 0 0 506px; }
	/* Full image at its natural (~square) aspect, matching the Figma slot —
	   no fixed height so nothing is cropped. */
	.te-home-who__photo { height: auto; }
	.te-home-who__card {
		position: absolute;
		left: -200px;
		bottom: 56px;
		width: 352px;
		margin: 0;
		padding: 20px 24px;
		backdrop-filter: blur(3px);
	}
	.te-home-who__card-text { font-size: 18px; line-height: 29px; }

	/* 5. WHY TRIUMPH */
	/* Fade completes to #edf0f7 exactly at the stats panel's bottom edge (~640px:
	   136 pad + ~154 head + 56 margin + 292 panel), where the wave svg's own
	   white→#EDF0F7 fade hands off — one continuous wash, no seam. */
	.te-home-why { padding: 136px 24px 176px; background: linear-gradient(180deg, #ffffff 0, #ffffff 544px, #edf0f7 640px, #edf0f7 100%); }
	.te-home-why__heading { font-size: 48px; line-height: 48px; }
	.te-home-why__inner { margin-top: 56px; }
	.te-home-stats { flex-direction: row; justify-content: center; align-items: flex-start; gap: 0; min-height: 292px; padding: 44px 32px 0; margin-left: 0; margin-right: 0; width: 100%; }
	.te-home-stat {
		flex: 1 1 0;
		text-align: center;
		padding: 8px 40px;
	}
	.te-home-stat + .te-home-stat { border-left: 1px solid rgba(255, 255, 255, 0.1); }
	.te-home-stat__num { font-size: 75px; line-height: 60px; }
	.te-home-stats__wave svg { height: 94px; }
	.te-home-features { flex-direction: row; gap: 32px; margin-top: 24px; padding: 0 8px; position: relative; z-index: 1; }
	.te-home-feature { flex: 1 1 0; padding: 32px; }

	/* 6. OUR LEADERSHIP */
	.te-home-team { padding: 112px 24px; }
	.te-home-team__heading { font-size: 48px; }

	/* 7. LATEST NEWS */
	.te-home-news { padding: 112px 24px; }
	.te-home-news__head { flex-direction: row; align-items: flex-end; justify-content: space-between; }
	.te-home-news__heading { font-size: 36px; }
	.te-home-news__grid { flex-direction: row; }
	.te-home-newscard { flex: 0 0 496px; width: 496px; height: 320px; }

	/* 8. CTA */
	.te-home-cta__inner { padding: 170px 24px 130px; }
	.te-home-cta__heading { font-size: 36px; line-height: 40px; max-width: 550px; margin-left: auto; margin-right: auto; }
	.te-home-cta__sub { font-size: 18px; line-height: 28px; }
	.te-home-cta__wave svg { height: 60px; }
}

/* Mobile (<1024px): on desktop the texture is anchored full-width at the top
   (background-size: 100% auto), which only fills the upper strip of these tall,
   narrow phone-width sections. Make it cover the whole section top-to-bottom. */
@media (max-width: 1023.98px) {
	.te-home-brands,
	.te-home-stats,
	.te-home-team,
	.te-home-cta {
		background-size: cover, cover;
	}

	/* Stats wave: skip the white-fade halo — fill the cut-out with solid
	   #edf0f7 so it merges invisibly with the section background below the
	   panel (which is fully faded to #edf0f7 by then, see .te-home-why). */
	.te-home-stats__wave svg path { fill: #EDF0F7; }
}

/* ──────────────────────────────────────────────────────────
   Tablet-only refinements (768–1023px). Bounded so mobile
   (<768) and desktop (≥1024) are untouched.
   ────────────────────────────────────────────────────────── */
/* Who We Are stacked: full-bleed photo to the viewport edges (out of the
   section's 24px side padding); square corners there. Card keeps its insets. */
@media (max-width: 1023.98px) {
	.te-home-who__media { margin-left: -24px; margin-right: -24px; width: auto; }
	.te-home-who__photo { border-radius: 0; }
}

@media (min-width: 768px) and (max-width: 1023.98px) {
	/* Hero H1 shouldn't stay at the 40px mobile size across the whole
	   tablet range — step it up toward the desktop 64px. */
	.te-home-hero__title { font-size: 56px; line-height: 62px; }

	/* Our Brands: 2×2 grid on tablet (desktop is 4-across, mobile stacks). */
	.te-home-brands__grid { flex-flow: row wrap; align-items: stretch; gap: 24px; }
	.te-home-brand { flex: 1 1 calc(50% - 12px); display: flex; flex-direction: column; }
	.te-home-brand__body { flex: 1 1 auto; }
	/* 2×2 rows: titles fit 1–2 lines at these widths — reserve just 2 lines so
	   row-mates' paragraphs stay level without excess white space. */
	.te-home-brand__title { min-height: 55px; }


	/* Feature cards: keep 3-across on tablet (tighter gap/padding), with the
	   same heading reservations as narrow desktop so paragraphs stay level. */
	.te-home-features { flex-direction: row; gap: 20px; }
	.te-home-feature { flex: 1 1 0; padding: 24px; }
	.te-home-feature__title { min-height: 52px; }
	.te-home-feature__subtitle { min-height: 78px; }

	/* News cards: two per row fits comfortably on tablet. */
	.te-home-news__grid { flex-direction: row; }
	.te-home-newscard { flex: 1 1 0; }
}

/* Narrow-desktop refinements: 4-across brand cards squeeze below their full
   300px width until the 1272px container fits (viewport < 1320px), wrapping
   long titles to 3 lines — reserve 3 lines so all paragraphs align. Full
   desktop (≥1320px) keeps the 2-line reservation. */
@media (min-width: 1024px) and (max-width: 1319.98px) {
	.te-home-brand__title { min-height: 82.5px; }

	/* Feature cards (Why Triumph): titles wrap to 2 lines and subtitles up to
	   3 at these widths — reserve worst-case heights (× 26px line-height) so
	   every card's paragraph starts on the same line. */
	.te-home-feature__title { min-height: 52px; }
	.te-home-feature__subtitle { min-height: 78px; }

	/* News cards: the fixed 496px pair (1016px + gaps) overflows the viewport
	   near 1024px — share the row fluidly here; heights stay equal via flex
	   stretch, growing past 320px if the narrower cards wrap more lines. */
	.te-home-newscard { flex: 1 1 0; width: auto; height: auto; min-height: 320px; }

	/* Who We Are: no room to float the callout over the photo here (text column
	   left, dessert plate lower right) — re-lay the row as a grid, dissolving
	   the media wrapper so the card can sit in the text column, right below
	   the paragraph, with the photo spanning the right side. */
	.te-home-who__inner { display: grid; grid-template-columns: 1fr 506px; column-gap: 64px; row-gap: 28px; align-items: start; }
	.te-home-who__text { grid-column: 1; grid-row: 1; }
	.te-home-who__media { display: contents; }
	.te-home-who__photo { grid-column: 2; grid-row: 1 / 3; }
	.te-home-who__card { grid-column: 1; grid-row: 2; position: static; width: auto; margin: 0; }
}

/* ══════════════════════════════════════════════════════════
   Mobile/tablet hero: full-color banner (no scrim — client
   rule), copy below on white in navy type. Desktop keeps the
   overlaid composition.
   ══════════════════════════════════════════════════════════ */
@media (max-width: 1023.98px) {
	.te-home-hero { background: #ffffff; }
	.te-home-hero__bg { position: static; height: 460px; object-position: 85% 40%; }
	.te-home-hero__scrim { display: none; }
	.te-home-hero__inner { padding: 40px 24px 110px; }
	.te-home-hero__title { color: #003366; }
	.te-home-hero__lead { color: #364153; }
	/* Ghost button was white-on-photo — restyle for the white background. */
	.te-home-hero__actions .te-home-btn--ghost { border-color: rgba(0, 51, 102, 0.45); color: #003366; }
	.te-home-hero__actions .te-home-btn--ghost:hover { background: rgba(0, 51, 102, 0.06); }
}
@media (min-width: 768px) and (max-width: 1023.98px) {
	.te-home-hero__bg { height: 560px; }
}

/* Stats panel: square top corners at the viewport edges when full-bleed
   (stacked mobile/tablet). Desktop restores the 16px rounded top corners. */
@media (max-width: 1023.98px) {
	.te-home-stats { border-radius: 0; }
}

/* Orange accents inside the #003366 who-card: #FF6900 is 4.37:1 there (just
   under AA 4.5); this imperceptibly lighter orange reads 4.60:1. */
.te-home-who__card .te-accent { color: #FF7214; }

/* ── WCAG AA orange pass ──
   #FF6900 stays on navy (5.69:1); light backgrounds get AA tokens:
   #BF4E00 small text (>=4.5:1), #EF6200 large text/graphics (>=3:1). */
.te-home-brands .te-home-eyebrow { color: #FF6900; } /* navy section */
.te-home-brand__eyebrow { color: #BF4E00; } /* white card (4.88:1) */
.te-home-newscard__more { background: #BF4E00; } /* white-text pill: 4.88:1 */
.te-home-newscard:hover .te-home-newscard__more { background: #A84600; }
@media (max-width: 1023.98px) {
	/* Banner-mode hero: copy sits on white. */
	.te-home-hero__eyebrow { color: #BF4E00; }
	.te-home-hero__title .te-accent { color: #EF6200; } /* large 3.27:1 */
}

/* Decorative waves never intercept clicks or text selection. */
.te-home-hero__wave,
.te-home-brand__wave,
.te-home-brands__wave,
.te-home-wf-wave,
.te-home-stats__wave,
.te-home-cta__wave { pointer-events: none; }

/* Mobile: crop the hero banner to ~the top of the chef's hat — the ceiling
   and vent hoods go. The image exactly fits the 460px banner height, so the
   crop comes from a bottom-anchored zoom (the section's overflow-hidden
   clips the overhang above; nothing spills below). */
@media (max-width: 767.98px) {
	/* clip-path chops the last 30px off the bottom (counter/pans). */
	.te-home-hero__bg { transform: scale(1.19); transform-origin: 85% bottom; clip-path: inset(0 0 30px 0); }
	/* Hides below the fold otherwise; the H1 alone establishes context here. */
	.te-home-hero__eyebrow { display: none; }
	/* The white gap above the H1 comes from .inner's own top padding (40px on
	   tablet/desktop), not from the image crop — halve it here. */
	.te-home-hero__inner { padding-top: 0; }
}

/* Mobile: H1 steps down so the headline wraps to ~3 lines instead of 5;
   stacked button pairs (hero + CTA) shrink-wrap to the widest button so
   both are always the same width. */
@media (max-width: 767.98px) {
	.te-home-hero__title { font-size: 32px; line-height: 1.15; }
	.te-home-hero__actions,
	.te-home-cta__actions { display: inline-flex; flex-direction: column; align-items: stretch; flex-wrap: nowrap; }
}

/* Mobile: long centered intro paragraphs read better left-justified when they
   wrap to several narrow lines. Headings above them stay centered. */
@media (max-width: 767.98px) {
	.te-home-brands__sub,
	.te-home-why__sub { text-align: left; }
}

/* Mobile: card typography steps up — the 14px gray body text especially
   (brand cards, feature cards, news cards). */
@media (max-width: 767.98px) {
	.te-home-brand__eyebrow { font-size: 13px; }
	.te-home-brand__title { font-size: 22px; line-height: 1.3; }
	.te-home-brand__desc { font-size: 16px; line-height: 1.6; }
	.te-home-feature__title { font-size: 20px; line-height: 28px; }
	.te-home-feature__desc { font-size: 16px; line-height: 1.6; }
	.te-home-newscard__title { font-size: 18px; line-height: 26px; }
	.te-home-newscard__excerpt { font-size: 16px; line-height: 1.6; }
}

/* Mobile: "View all news" moves below the cards and steps up in size. The
   head dissolves into the section's flex column so the link can reorder
   after the grid; the heading block keeps the head's old bottom margin. */
@media (max-width: 767.98px) {
	.te-home-news__inner { display: flex; flex-direction: column; }
	.te-home-news__head { display: contents; }
	.te-home-news__head > div { margin-bottom: 32px; }
	.te-home-news__viewall { order: 1; margin-top: 32px; font-size: 17px; align-self: flex-start; }
	.te-home-news__viewall .te-home-arrow { width: 22px; height: 22px; }
}

/* Mobile: claims panel typography steps up; Read-more pills grow; the CTA
   overlaps the news section by 1px to kill the iOS subpixel hairline at
   the cream-to-wave boundary. */
@media (max-width: 767.98px) {
	.te-home-stat__num { font-size: 56px; }
	.te-home-stat__label { font-size: 16px; line-height: 24px; }
	.te-home-newscard__more { height: 34px; font-size: 15px; padding: 0 20px; }
}
.te-home-cta { margin-top: -1px; }
.te-home-cta__wave { top: -1px; }

/* Mobile: all buttons carry the CTA pair's 18px label (site-wide). */
@media (max-width: 767.98px) {
	.te-home-btn { font-size: 18px; }
}

/* Mobile: normalize the two H2 outliers (32px brands, 34px team) to the
   30px the other homepage sections use — site-wide H2 pass; disclaimers
   tighten to the site's 16px leading. */
@media (max-width: 767.98px) {
	.te-home-brands__heading,
	.te-home-team__heading { font-size: 30px; }
	/* Normalize the two line-height outliers (1.1 brands, 1.2 who) to the
	   1.15 the other homepage H2s use — site-wide H2 pass. */
	.te-home-brands__heading,
	.te-home-who__heading,
	.te-home-team__heading { line-height: 1.15; }
	/* Disclaimers step from 12px to 13px (site-wide legibility floor). */
	.te-home-brands__notes { font-size: 13px; line-height: 17px; }
}