/*
 * Homepage testimonials on phones.
 * Salient's "layered card reveal" stack needs a ~3.5-screen scroll track and rotates
 * the cards, which leaves large empty gaps on phones. On phones only (the 1:1 stack is
 * the phone-only instance; tablet/desktop use the 16:9 one) render it as a swipeable,
 * snap-scrolling row of equal-height cards instead.
 */
@media only screen and (max-width: 690px) {
	/* Full-bleed so the scroller and caption centre on the screen, not the inset column. */
	.nectar-sticky-media-sections.layered-card-reveal-aspect-ratio-1-1 {
		position: relative !important;
		height: auto !important;
		overflow: visible !important;
		padding-top: 40px;
		width: 100vw !important;
		margin-left: calc(50% - 50vw) !important;
		margin-right: calc(50% - 50vw) !important;
	}

	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content__wrap {
		position: static !important;
		top: auto !important;
		height: auto !important;
		display: flex !important;
		flex-direction: row !important;
		align-items: stretch !important;
		gap: 14px !important;
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		scroll-padding: 0 9%;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		padding: 4px 9% 20px;
	}
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content__wrap::-webkit-scrollbar {
		display: none;
	}

	/* "In the press, In their words" caption, pinned above the scroller. */
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content__wrap > .wpb_row.inner_row {
		position: absolute !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		transform: none !important;
		margin: 0 !important;
		padding: 0 !important;
	}
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content__wrap > .wpb_row.inner_row .nectar-responsive-text {
		font-size: 12px !important;
		line-height: 1.4 !important;
		letter-spacing: 0.14em;
		text-transform: uppercase;
		text-align: center;
		opacity: 0.75;
	}
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content__wrap > .wpb_row.vc_hidden-xs {
		display: none !important;
	}

	/* Cards */
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content-section {
		position: relative !important;
		top: auto !important;
		left: auto !important;
		transform: none !important;
		opacity: 1 !important;
		flex: 0 0 82%;
		width: 82% !important;
		min-height: 320px;
		aspect-ratio: auto !important;
		margin: 0 !important;
		scroll-snap-align: center;
	}
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content-section__wrap {
		height: 100% !important;
	}
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content-section-inner {
		height: 100%;
		padding: 28px 0 26px;
		justify-content: flex-start;
	}
	/* Desktop spacers inside the card are not needed on phones. */
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content-section-inner .divider-wrap {
		display: none !important;
	}
	/* Flex chain down to the text so the name/title sit at the bottom of every card. */
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content-section-inner > .wpb_row,
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content-section-inner > .wpb_row > .row_col_wrap_12_inner,
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content-section-inner > .wpb_row > .row_col_wrap_12_inner > .wpb_column {
		flex: 1 1 auto;
		display: flex;
		margin-bottom: 0 !important;
	}
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content-section-inner .wpb_column > .vc_column-inner,
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content-section-inner .wpb_column > .vc_column-inner > .wpb_wrapper {
		flex: 1 1 auto;
		display: flex;
		flex-direction: column;
		width: 100%;
	}
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content-section-inner .wpb_wrapper > .nectar-responsive-text.font_size_phone_3vw {
		margin-top: auto !important;
		padding-top: 22px;
	}

	/* Readable, consistent type (the theme used 2–3vw, i.e. ~8–11px on phones). */
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content-section-inner .nectar-responsive-text {
		font-size: 15.5px !important;
		line-height: 1.5 !important;
	}
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content-section-inner .nectar-responsive-text.font_size_phone_3vw {
		font-size: 15px !important;
		line-height: 1.3 !important;
	}
	.layered-card-reveal-aspect-ratio-1-1 .nectar-sticky-media-section__content-section-inner .nectar-responsive-text.font_size_phone_2vw {
		font-size: 13px !important;
		line-height: 1.35 !important;
		opacity: 1 !important;
	}
}

/* Accessibility: Maintain exact 18px size for service item subheadings when converted to H4 */
.nectar-responsive-text[data-inherit-heading-family="h4"] h4 {
	font-size: 18px !important;
	line-height: 26.1px !important;
	font-weight: 400 !important;
}

/* Accessibility: Video CTA badge replaced H6 with semantic span */
.nectar-cta .nectar-cta-heading {
	display: inline-block;
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
}

/* Accessibility: WCAG AA contrast fallback for orange text (5.53:1 ratio on white) */
:root {
	--site-orange: #b54500 !important;
}

.text-site-orange,
em.text-site-orange,
.sbp .text-site-orange,
.sbp em.text-site-orange,
html body .sbp .text-site-orange,
html body .sbp em.text-site-orange,
html body .text-site-orange,
html body em.text-site-orange,
span.text-site-orange {
	color: #b54500 !important;
}

/* Accessibility: High contrast matching for dark and light testimonial cards */
.nectar-sticky-media-section__content-section-inner .nectar-responsive-text.font_size_phone_2vw[style*="FFFFFF"] p,
.nectar-sticky-media-section__content-section-inner .nectar-responsive-text.font_size_phone_2vw[style*="#fff"] p {
	color: #ffffff !important;
	opacity: 1 !important;
}
.nectar-sticky-media-section__content-section-inner .nectar-responsive-text.font_size_phone_2vw:not([style*="FFFFFF"]):not([style*="#fff"]) p {
	color: #111111 !important;
	opacity: 1 !important;
}

/* Hero rules live in style.css (a stale duplicate here was overriding them). */