/**
 * Elementor Free compatibility.
 *
 * Do not restyle native widgets globally — that fights the editor.
 * Only unwrap theme chrome around Elementor output, and provide
 * optional CSS classes for Phase 4 homepage assembly.
 */

.eco-main--elementor .elementor,
.elementor-page .eco-main--elementor,
.eco-elementor-fullwidth .eco-main {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}

.eco-main--elementor .eco-entry,
.eco-main--elementor .eco-entry__content {
	margin: 0;
	padding: 0;
	max-width: none;
}

.eco-main--elementor .eco-entry__content > .elementor:first-child {
	margin-top: 0;
}

/*
 * Theme styles must not override Elementor editor chrome.
 * The following classes are opt-in via Advanced → CSS Classes.
 */
.eco-hero-grid-overlay {
	position: relative;
}

.eco-hero-grid-overlay::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: 0.03;
	background-image: radial-gradient(#fff 1px, transparent 1px);
	background-size: 24px 24px;
}

.eco-about-inset {
	position: relative;
}

.eco-stage-featured {
	background: var(--eco-primary);
	color: var(--eco-white);
}

.eco-faq .elementor-accordion-item {
	border: 0;
	border-bottom: var(--eco-hairline) solid var(--eco-border);
	border-radius: 0;
}

.elementor-editor-active .eco-header {
	pointer-events: auto;
}

/* Homepage section skins — opt-in via Advanced → CSS Classes */

.eco-section {
	padding-block: 6rem;
	border-bottom: 1px solid var(--eco-border);
}

.eco-section--surface {
	background: var(--eco-surface);
}

.eco-section--muted {
	background: rgba(243, 242, 236, 0.5);
}

.eco-section--hero {
	position: relative;
	background: var(--eco-primary);
	color: var(--eco-white);
	border-bottom: 1px solid var(--eco-border);
	overflow: hidden;
	padding-block: 4rem 5rem;
}

.eco-section--dark {
	position: relative;
	background: var(--eco-primary);
	color: var(--eco-white);
	overflow: hidden;
}

.eco-ribbon {
	background: var(--eco-surface);
	border-bottom: 1px solid var(--eco-border);
	padding-block: 1.5rem;
}

.eco-hero-frame,
.eco-photo-frame {
	border: 1px solid var(--eco-border-light);
	padding: 0.5rem;
	background: rgba(255, 255, 255, 0.05);
}

.eco-photo-frame {
	border-color: var(--eco-border);
	background: var(--eco-surface);
}

.eco-hero-badge {
	background: var(--eco-background);
	color: var(--eco-charcoal);
	border: 1px solid var(--eco-border);
	padding: 1rem;
	max-width: 220px;
}

.eco-about-inset {
	position: absolute;
	inset-block-end: -2.5rem;
	inset-inline-end: auto;
	inset-inline-start: -1.5rem;
	width: 14rem;
	border: 1px solid var(--eco-border);
	background: var(--eco-surface);
	padding: 0.5rem;
	z-index: 2;
}

.eco-quote {
	border-inline-start: 2px solid var(--eco-primary);
	background: rgba(243, 242, 236, 0.6);
	padding: 1rem 1.25rem;
}

.eco-card {
	border: 1px solid var(--eco-border);
	background: var(--eco-surface);
	padding: 1.5rem;
}

.eco-stage-featured {
	border-color: var(--eco-secondary);
}

.eco-metric .elementor-counter-number-wrapper,
.eco-metric .elementor-counter-number {
	font-variant-numeric: tabular-nums;
	font-weight: 700;
	color: inherit;
}

.eco-faq .elementor-accordion-item,
.eco-faq .elementor-tab-title,
.eco-faq .elementor-accordion-title {
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

.eco-faq .elementor-accordion-item {
	border-bottom: 1px solid var(--eco-border);
	padding-block: 1.25rem;
}

.eco-btn-secondary.elementor-button,
.eco-section--hero .elementor-button {
	border-radius: 0;
	font-size: 14px;
	font-weight: 500;
}
