

.l-section.about-us-section {
	position: relative;
	overflow: hidden;
}

.l-section.about-us-section .l-section-img {
	background-position: top center !important;
	background-size: cover;
}

.l-section.about-us-section .l-section-h {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	/* Floor was 28rem — 448px, two thirds of an iPhone SE's 667px viewport for a single band. 16rem keeps the proportions on desktop (48vw still wins from ~600px up) while letting the band size to its content on a phone. */
	min-height: clamp(16rem, 48vw, 43.625rem);
	padding-inline: clamp(1.5rem, 4.7vw, 4.25rem);
	padding-top: clamp(2rem, 5vw, 4rem);
	padding-bottom: clamp(2.5rem, 6vw, 4rem);
}

/* The parent puts the section gutter on .l-section, so this wrapper's own padding-inline stacks on top of it: 24px + 24px left this band's copy 48px in while every other section sat at 24px. The extra inset is deliberate on desktop (a narrower framed band); on mobile it just costs 13% of the screen width and breaks the shared left edge. */
@media (max-width: 900px) {
	.l-section.about-us-section .l-section-h {
		padding-inline: 0;
	}
}

.l-section.about-us-section > .l-section-h > .g-cols,
.l-section.about-us-section > .l-section-h > .g-cols > .vc_column_container,
.l-section.about-us-section > .l-section-h > .g-cols > .wpb_column,
.l-section.about-us-section > .l-section-h > .g-cols .vc_column-inner {
	width: 100%;
	height: 100%;
}

.about-us-section__content {
	width: 100%;
	margin-inline: auto;
	--columns-gap: 0 !important;
}

.about-us-section__content .vc_column-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
	gap: 1.375rem;
	width: 100%;
	min-height: 100%;
	padding: 0;
	text-align: center;
}

.about-us-section__text,
.about-us-section__text.about-us-section__text,
.about-us-section p.about-us-section__text.vc_custom_heading {
	margin: 0;
	max-width: none;
	font-family: Montserrat, sans-serif;
	font-size: var(--meda-text-lg);
	font-weight: 400;
	line-height: 1.875rem;
	letter-spacing: 0;
	text-transform: none !important;
	color: #fff !important;
}

.about-us-section .w-btn-wrapper {
	margin: 0;
}

/* Size comes from Impreza Theme Options → Buttons → "Gold CTA" (padding: 0.9em 1.7em), same as every other gold CTA. The old `min-height: 2.3125rem; padding: 0.625rem 1.25rem !important` here made this button 39px tall while its siblings sized to 48px, and the !important meant Theme Options could never win. Only the dark-background label treatment below is about-section-specific. */
.about-us-section__cta.w-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	box-shadow: none;
	font-family: Montserrat, sans-serif;
	font-size: var(--meda-text-base);
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.96px;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color var(--meda-duration-fast) var(--meda-ease),
		color var(--meda-duration-fast) var(--meda-ease),
		box-shadow var(--meda-duration-fast) var(--meda-ease),
		transform var(--meda-duration-fast) var(--meda-ease);
}

.about-us-section__cta .w-btn-label {
	background: none !important;
	-webkit-background-clip: unset;
	background-clip: unset;
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

.no-touch .about-us-section__cta.w-btn:hover,
.no-touch .about-us-section__cta.w-btn.meda-hover-btn:hover {
	background: var(--meda-gold);
	transform: translateY(-3px);
	box-shadow: 0 0.5rem 1.25rem rgba(165, 139, 70, 0.2);
}

html.meda-motion-gsap.no-touch .about-us-section__cta.w-btn:hover,
html.meda-motion-gsap.no-touch .about-us-section__cta.w-btn.meda-hover-btn:hover {
	background: transparent;
	transform: none;
	box-shadow: none;
}

.no-touch .about-us-section__cta.w-btn:hover .w-btn-label,
.no-touch .about-us-section__cta.w-btn.meda-hover-btn:hover .w-btn-label {
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

.about-us-section__cta.w-btn:focus-visible {
	outline: 2px solid var(--meda-gold);
	outline-offset: 3px;
}
