/* One contained width for builder sections, standalone templates and integrations. */
:root { --hv-contained-width: 100%; }
@media (min-width: 576px) { :root { --hv-contained-width: 540px; } }
@media (min-width: 768px) { :root { --hv-contained-width: 720px; } }
@media (min-width: 992px) { :root { --hv-contained-width: 960px; } }
@media (min-width: 1200px) { :root { --hv-contained-width: 1140px; } }
@media (min-width: 1400px) {
    :root { --hv-contained-width: min(1600px, calc(100% - var(--polymer-container-edge-gutter) - var(--polymer-container-edge-gutter))); }
}

body .polymer-blog-archive__grid > .container,
body .hv-floor-detail__section > .container,
body .polymer-single-post__header > .container,
body .hv-article-hero,
body .polymer-default-content:not(.polymer-single-post__content) > .container,
body #main .tribe-events.tribe-common .tribe-events-l-container,
body #tribe-events-pg-template,
.hv-contained {
    box-sizing: border-box;
    width: var(--hv-contained-width);
    max-width: none;
    margin-inline: auto;
    padding-inline: var(--hv-content-padding, 12px);
}

/* The panel's visible border follows the content edge (including logo/footer text). */
:root .hv-invitation > .container {
    width: calc(var(--hv-contained-width) - 24px);
    max-width: none;
}

/* Phone layouts share the image-panel edge, including header and footer content. */
@media (max-width: 767.98px) {
    :root { --hv-contained-width: 100%; --hv-content-padding: 24px; }

    body .site-header .navbar > .container,
    body .polymer-layout__container--contained {
        width: 100%;
        max-width: none;
        padding-inline: var(--hv-content-padding);
    }

    :root .hv-editorial > .container > .row { --bs-gutter-x: 1.5rem; }

    :root .polymer-classic-layout.hv-image-panel {
        width: calc(100% - var(--hv-content-padding) - var(--hv-content-padding));
        max-width: none;
    }

    :root .hv-invitation > .container {
        width: calc(100% - var(--hv-content-padding) - var(--hv-content-padding));
        max-width: none;
    }
}