/* Enveloppe commune du site public, y compris les formulaires d’accès. */
/* An anchor needs the real section heights, including sections outside the viewport. */
[data-public-presentation] .landing-page:has(:target) .landing-section {
    content-visibility: visible;
}

[data-public-presentation] {
    --public-header-height: 90px;
    --public-summary-height: 0px;
    --public-legal-toc-height: 0px;
    --public-sticky-gap: 12px;
    --public-sticky-top: calc(var(--public-header-height) + var(--public-sticky-gap));
    --public-sticky-height: calc(100dvh - var(--public-header-height) - 2 * var(--public-sticky-gap));
    --public-anchor-offset: calc(var(--public-header-height) + var(--public-summary-height) + 2 * var(--public-sticky-gap));
}

[data-public-presentation] .legal-page {
    --public-anchor-offset: calc(var(--public-header-height) + var(--public-legal-toc-height) + 2 * var(--public-sticky-gap));
}

[data-public-presentation]:has(.network-page-summary) {
    --public-summary-height: calc(var(--control-min-size) + 2 * var(--space-2) + 2px);
}

html:has(body[data-public-presentation]) {
    scroll-padding-top: 0;
    /* Le défilement animé dérive lorsque content-visibility précise les hauteurs. */
    scroll-behavior: auto;
}

.public-presentation-header {
    --public-header-inset: clamp(20px, 2.5vw, 40px);
    gap: clamp(16px, 2vw, 32px);
    padding: 10px var(--public-header-inset);
}

.public-presentation-header .app-brand {
    flex: 0 0 200px;
}

.public-presentation-header .app-brand img {
    width: 200px;
}

.public-presentation-header .app-nav {
    position: static;
    min-width: 0;
    flex-wrap: nowrap;
    gap: 6px;
}

.public-presentation-header .nav-link {
    gap: 6px;
    padding-inline: 10px;
}

.public-presentation-header .app-nav-account-link {
    margin-inline-start: 8px;
}

.public-presentation-header .header-cta {
    flex: 0 0 auto;
    white-space: nowrap;
}

.public-presentation-header .public-menu-panel {
    top: calc(100% + var(--public-sticky-gap));
    right: var(--public-header-inset);
    max-height: var(--public-sticky-height);
}

[data-public-presentation] main [id] {
    scroll-margin-top: var(--public-anchor-offset);
}

[data-public-presentation] .network-page-summary {
    top: var(--public-sticky-top);
    max-height: var(--public-sticky-height);
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
}

[data-public-presentation] .help-toc {
    max-height: var(--public-sticky-height);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}

[data-public-presentation] .legal-toc-panel {
    top: var(--public-sticky-top);
    max-height: var(--public-sticky-height);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}

@media (min-width: 861px) {
    [data-public-presentation] .rights-process-card {
        top: var(--public-sticky-top);
        max-height: var(--public-sticky-height);
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: thin;
    }
}

[data-public-presentation] .legal-toc-content {
    max-height: none;
    overflow: visible;
}

@media (min-width: 1181px) {
    [data-public-presentation] .help-toc {
        top: var(--public-sticky-top);
        align-self: start;
    }
}

@media (min-width: 901px) {
    [data-public-presentation] .help-sidebar {
        top: var(--public-sticky-top);
        max-height: var(--public-sticky-height);
    }
}

@media (max-width: 1280px) {
    .public-presentation-header .app-nav-primary-link {
        display: none;
    }

    .public-presentation-header .public-menu {
        display: block;
    }
}

@media (max-width: 1180px) {
    [data-public-presentation] .help-toc {
        max-height: min(22rem, 60svh);
    }
}

@media (max-width: 760px) {
    .public-presentation-header {
        --public-header-inset: 16px;
        gap: 12px;
        padding: 8px 16px;
    }

    .public-presentation-header .app-brand {
        flex: 0 0 auto;
    }

    .public-presentation-header .app-brand img {
        width: clamp(130px, 38vw, 160px);
    }
}
