/*
 * Bridge our existing design system to Elementor-rendered pages.
 * Elementor wraps every section in .elementor-section > .elementor-container;
 * our previous PHP templates used .section > .container. The rules below make
 * Elementor's wrappers behave like our originals so layouts on Elementor-edited
 * pages stay visually identical to the design system without per-section
 * configuration in the Elementor UI.
 */

/* Boxed Elementor sections get our standard vertical rhythm + container width */
.elementor .elementor-section.elementor-section-boxed > .elementor-container,
.elementor .elementor-section:not(.elementor-section-stretched) > .elementor-container {
    max-width: var(--container);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--gutter);
    padding-right: var(--gutter);
}

/* Default vertical padding on every Elementor section unless explicitly set */
.elementor .elementor-section {
    padding: var(--section-y) 0;
}
.elementor .elementor-section:first-child {
    padding-top: 0;  /* hero full-bleed - first section often holds a cover image */
}

/* Tighten when sections are sequential and the previous section is also Elementor */
.elementor .elementor-section + .elementor-section {
    padding-top: 56px;
}

/* Elementor's default widget margin can collide with our spacing */
.elementor .elementor-widget:not(:last-child) {
    margin-bottom: 0;
}

/* Heading + text widgets should inherit our font, color, sizing */
.elementor .elementor-widget-heading .elementor-heading-title {
    color: var(--text);
    font-family: var(--font);
    line-height: var(--lh-tight);
}
.elementor .elementor-widget-text-editor {
    color: var(--text-dim);
}
.elementor .elementor-widget-text-editor a { color: var(--text); text-decoration: underline; }

/* Make sure our custom .btn class wins over Elementor's button skin */
.elementor .elementor-widget-button .elementor-button.btn {
    background: transparent;
    border-radius: 2px;
}
.elementor .elementor-widget-button .btn--outline {
    border: 1px solid var(--border-strong);
}
.elementor .elementor-widget-button .btn--outline:hover {
    background: rgba(255,255,255,0.05);
}

/* HTML widgets should not get a Elementor box; ours have their own styles */
.elementor .elementor-widget-html { line-height: inherit; }

/* Image widget shouldn't have any wrapper padding when used as a hero */
.elementor .elementor-section:first-child .elementor-widget-image figure { margin: 0; }
.elementor .elementor-section:first-child .elementor-widget-image img { display: block; width: 100%; height: auto; }

/* Shortcode wrapper transparent - case grid / brand wall control their own layout */
.elementor .elementor-widget-shortcode { line-height: inherit; }