/*
 * BEC editor presentation bridge.
 *
 * Keep this file deliberately scoped. The Lovable production stylesheet owns
 * global typography, navigation, buttons, cards and page rhythm.
 */

.bec-section.bec-spacing--compact {
	padding-block: clamp(2.5rem, 4vw, 4rem);
}

.bec-section.bec-spacing--large {
	padding-block: clamp(6rem, 9vw, 9rem);
}

.bec-section.bec-width--narrow > .container-x {
	max-width: 52rem;
}

.bec-section.bec-width--wide > .container-x {
	max-width: 92rem;
}

.bec-section.bec-width--full > .container-x {
	max-width: none;
}

.bec-section.bec-align--center > .container-x > .max-w-3xl,
.bec-section.bec-align--center > .container-x > .bec-heading {
	margin-inline: auto;
	text-align: center;
}

.bec-section.bec-theme--soft {
	background: var(--surface);
}

.bec-section.bec-theme--dark {
	background: var(--graphite);
	color: var(--graphite-foreground);
}

.bec-section.bec-theme--brand {
	background: var(--brand);
	color: var(--brand-foreground);
}

.bec-landing-hero.bec-spacing--compact .bec-landing-hero__container {
	padding-block: 3rem;
}

.bec-landing-hero.bec-spacing--large .bec-landing-hero__container {
	padding-block: clamp(6rem, 9vw, 9rem);
}

.bec-landing-hero.bec-width--narrow .bec-landing-hero__container {
	max-width: 56rem;
}

.bec-landing-hero.bec-width--wide .bec-landing-hero__container {
	max-width: 92rem;
}

.bec-landing-hero.bec-width--full .bec-landing-hero__container {
	max-width: none;
}

.bec-landing-hero.bec-align--center .bec-landing-hero__content {
	margin-inline: auto;
	text-align: center;
}

.bec-landing-hero.bec-align--center .bec-landing-hero__content .eyebrow,
.bec-landing-hero.bec-align--center .bec-landing-hero__content ul,
.bec-landing-hero.bec-align--center .bec-landing-hero__content div,
.bec-landing-hero.bec-align--center .bec-landing-hero__content > p:last-child {
	justify-content: center;
}

.bec-landing-hero--service-focus {
	border-top: 3px solid var(--brand);
}

.bec-landing-hero--service-focus .media-frame {
	border-radius: .35rem;
}

.bec-landing-hero--service-focus .media-frame::after {
	content: "";
	position: absolute;
	inset-block: 0;
	inset-inline-start: 0;
	width: .28rem;
	background: var(--brand);
}

.bec-landing-hero--marque-focus .media-frame,
.bec-landing-hero--service-focus .media-frame {
	box-shadow: 0 32px 70px -42px rgb(0 0 0 / 45%);
}

.bec-landing-hero--immersion {
	min-height: 38rem;
	display: grid;
	align-items: center;
}

.bec-landing-hero--immersion .bec-landing-hero__veil {
	background: linear-gradient(
		90deg,
		rgb(10 11 14 / 92%) 0%,
		rgb(10 11 14 / 72%) 52%,
		rgb(10 11 14 / 28%) 100%
	) !important;
}

[dir="rtl"] .bec-landing-hero--immersion .bec-landing-hero__veil {
	background: linear-gradient(
		270deg,
		rgb(10 11 14 / 92%) 0%,
		rgb(10 11 14 / 72%) 52%,
		rgb(10 11 14 / 28%) 100%
	) !important;
}

.bec-landing-hero--immersion .bec-landing-hero__content {
	max-width: 48rem;
}

.bec-landing-hero--immersion h1,
.bec-landing-hero--immersion nav,
.bec-landing-hero--immersion nav span,
.bec-landing-hero--immersion .bec-landing-hero__content > p:last-child {
	color: #fff;
}

.bec-landing-hero--immersion .bec-landing-hero__content > p,
.bec-landing-hero--immersion nav a {
	color: rgb(255 255 255 / 78%);
}

.bec-landing-hero--immersion .bec-landing-hero__content li {
	border-color: rgb(255 255 255 / 20%);
	color: #fff;
	background: rgb(255 255 255 / 10%);
}

.bec-landing-hero--minimal .bec-landing-hero__container {
	padding-block: 3rem;
}

.bec-landing-hero--minimal .bec-landing-hero__grid {
	margin-top: 1.5rem;
}

.bec-landing-hero--minimal .bec-landing-hero__content {
	max-width: 50rem;
}

.bec-landing-hero--minimal .bec-landing-hero__content h1 {
	font-size: clamp(2rem, 5vw, 3.35rem);
}

@media (max-width: 1023px) {
	.bec-landing-hero--immersion {
		min-height: auto;
	}

	.bec-landing-hero--immersion .bec-landing-hero__veil {
		background: linear-gradient(
			to bottom,
			rgb(10 11 14 / 82%) 0%,
			rgb(10 11 14 / 68%) 58%,
			rgb(10 11 14 / 86%) 100%
		) !important;
	}
}

/*
 * Advanced editor overrides are opt-in per section. The original Lovable
 * classes remain authoritative until designOverride is explicitly enabled.
 */
.bec-section[data-bec-design-override="1"],
.bec-landing-hero[data-bec-design-override="1"] {
	position: relative;
	isolation: isolate;
	padding-top: var(--bec-section-padding-top, revert-layer);
	padding-bottom: var(--bec-section-padding-bottom, revert-layer);
	min-height: var(--bec-section-min-height, auto);
	background-color: var(--bec-section-background, revert-layer);
	background-image: var(--bec-section-background-image, none);
	background-position: var(--bec-section-background-position, center);
	background-size: cover;
	border: var(--bec-section-border-width, 0) solid var(--bec-section-border-color, transparent);
	border-radius: var(--bec-section-radius, 0);
}

.bec-section[data-bec-design-override="1"]::before,
.bec-landing-hero[data-bec-design-override="1"]::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: var(--bec-section-overlay-color, transparent);
	opacity: var(--bec-section-overlay, 0);
	border-radius: inherit;
}

.bec-section[data-bec-design-override="1"] :is(h1, h2, h3, h4),
.bec-landing-hero[data-bec-design-override="1"] :is(h1, h2, h3, h4) {
	color: var(--bec-section-heading-color, inherit);
	font-size: var(--bec-section-heading-size, revert-layer);
}

.bec-section[data-bec-design-override="1"] :is(p, li),
.bec-landing-hero[data-bec-design-override="1"] :is(p, li) {
	color: var(--bec-section-text-color, inherit);
	font-size: var(--bec-section-text-size, revert-layer);
}

.bec-section[data-bec-design-override="1"] :is(.text-brand, .bec-eyebrow, .eyebrow),
.bec-landing-hero[data-bec-design-override="1"] :is(.text-brand, .bec-eyebrow, .eyebrow) {
	color: var(--bec-section-accent, var(--brand));
}

.bec-section[data-bec-design-override="1"] :is(.card-soft, article),
.bec-landing-hero[data-bec-design-override="1"] :is(.card-soft, article) {
	background-color: var(--bec-section-card-background, revert-layer);
	border-radius: var(--bec-section-card-radius, revert-layer);
}

.bec-section[data-bec-design-override="1"] :is(.grid, .flex):has(> article) {
	gap: var(--bec-section-card-gap, revert-layer);
}

.bec-section[data-bec-design-override="1"] :is(a.bg-brand, button.bg-brand, .button-primary),
.bec-landing-hero[data-bec-design-override="1"] :is(a.bg-brand, button.bg-brand, .button-primary) {
	background-color: var(--bec-section-button-background, var(--brand));
	color: var(--bec-section-button-text, var(--brand-foreground));
	border-radius: var(--bec-section-button-radius, revert-layer);
}

@media (min-width: 768px) and (max-width: 1023px) {
	.bec-section[data-bec-design-override="1"],
	.bec-landing-hero[data-bec-design-override="1"] {
		padding-top: var(--bec-section-tablet-padding-top, var(--bec-section-padding-top, revert-layer));
		padding-bottom: var(--bec-section-tablet-padding-bottom, var(--bec-section-padding-bottom, revert-layer));
		text-align: var(--bec-section-tablet-align, inherit);
	}

	.bec-section[data-bec-design-override="1"] :is(h1, h2, h3),
	.bec-landing-hero[data-bec-design-override="1"] :is(h1, h2, h3) {
		font-size: var(--bec-section-tablet-heading-size, var(--bec-section-heading-size, revert-layer));
	}

	.bec-section[data-bec-design-override="1"] :is(p, li),
	.bec-landing-hero[data-bec-design-override="1"] :is(p, li) {
		font-size: var(--bec-section-tablet-text-size, var(--bec-section-text-size, revert-layer));
	}

	.bec-section[data-bec-design-override="1"] :is(.grid, [class*="grid-cols"]) {
		grid-template-columns: repeat(var(--bec-section-tablet-columns, 1), minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.bec-section[data-bec-design-override="1"],
	.bec-landing-hero[data-bec-design-override="1"] {
		padding-top: var(--bec-section-mobile-padding-top, var(--bec-section-tablet-padding-top, var(--bec-section-padding-top, revert-layer)));
		padding-bottom: var(--bec-section-mobile-padding-bottom, var(--bec-section-tablet-padding-bottom, var(--bec-section-padding-bottom, revert-layer)));
		text-align: var(--bec-section-mobile-align, var(--bec-section-tablet-align, inherit));
	}

	.bec-section[data-bec-design-override="1"] :is(h1, h2, h3),
	.bec-landing-hero[data-bec-design-override="1"] :is(h1, h2, h3) {
		font-size: var(--bec-section-mobile-heading-size, var(--bec-section-tablet-heading-size, var(--bec-section-heading-size, revert-layer)));
	}

	.bec-section[data-bec-design-override="1"] :is(p, li),
	.bec-landing-hero[data-bec-design-override="1"] :is(p, li) {
		font-size: var(--bec-section-mobile-text-size, var(--bec-section-tablet-text-size, var(--bec-section-text-size, revert-layer)));
	}

	.bec-section[data-bec-design-override="1"] :is(.grid, [class*="grid-cols"]) {
		grid-template-columns: repeat(var(--bec-section-mobile-columns, 1), minmax(0, 1fr));
	}
}
