/* Public marketing shell only. 1600px retains the roomy desktop composition
   (including the existing >1440px ecosystem/carousel rules), without letting
   grids, artwork and type keep spreading on ultrawide screens or zoom-out.
   Use the same bounded unit in the existing CSS formulas, not transform/zoom.
   Admin routes omit this class and retain the original 1vw fallback. */
.public-site {
    --public-layout-max: 1600px;
    --public-layout-vw: min(1vw, calc(var(--public-layout-max) / 100));
}

/* Keep the section backgrounds/artwork full-bleed on ultrawide screens. The
   existing content blocks remain bounded below, so the composition does not
   stretch just because the viewport is wider. */
.public-site > main {
    width: 100%;
    max-width: none;
}

.public-site > main > section {
    width: 100%;
}

.public-site > main > .homepage-canvas > section {
    width: 100%;
}

.public-site > main > section
    > :not(.hero-media):not(.hero-grid):not(.hero-shell):not(.hero-card-grid):not(.about-team-hero__media) {
    width: min(100%, var(--public-layout-max));
    margin-inline: auto;
}

.public-site > main > .homepage-canvas > section
    > :not(.hero-media):not(.hero-grid):not(.hero-shell):not(.hero-card-grid):not(.about-team-hero__media) {
    width: min(100%, var(--public-layout-max));
    margin-inline: auto;
}

/* Place the ecosystem intro in the open space beside the diagram on desktop. */
@media (min-width: 821px) and (hover: hover) {
    .public-site .connected-ecosystem__intro {
        transform: translateY(50px);
    }
}

/* Header/footer backgrounds remain full-bleed. Only their content is bounded,
   preserving the existing header (5vw) versus section (6vw) inset convention. */
@media (min-width: 1600px) {
    .public-site {
        /* Root-defined tokens otherwise resolve before the body unit exists. */
        --section-eyebrow-size: clamp(
            1.15rem,
            calc(var(--public-layout-vw) * 1.05),
            1.6rem
        );
        --section-heading-size: clamp(
            3.25rem,
            calc(var(--public-layout-vw) * 4.15),
            5.35rem
        );
        --section-copy-size: clamp(
            1.18rem,
            calc(var(--public-layout-vw) * 1.2),
            1.46rem
        );
    }

    .public-site > .site-header {
        padding-inline: calc(
            max(0px, (100% - var(--public-layout-max)) / 2) +
                clamp(22px, calc(var(--public-layout-vw) * 5), 78px)
        );
    }
}

.public-site > .site-footer > .site-footer__inner {
    max-width: var(--public-layout-max);
}