/* G2.4 Canonical Homepage: visual adapter over the G2.2/G2.3 contracts. */

body.ohda-modal-open {
    overflow: hidden;
    overscroll-behavior: none;
}

.site-header.ohda-site-header {
    position: sticky;
    inset-block-start: 0;
    margin-bottom: -92px;
    padding: max(14px, env(safe-area-inset-top)) 0 10px;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.header-shell.ohda-shell {
    display: flex;
    width: min(calc(100% - 40px), var(--content));
    min-height: 58px;
}

.logo-area.ohda-brand-link {
    margin-inline-end: 0;
}

.logo-img.ohda-logo {
    width: var(--ohda-layout-touch-target);
    height: var(--ohda-layout-touch-target);
}

.primary-nav {
    flex: 1 1 auto;
}

.home-button.ohda-home-link,
.language-switcher.ohda-language-switcher button {
    min-width: var(--ohda-layout-touch-target);
    min-height: var(--ohda-layout-touch-target);
}

.modal-overlay.ohda-modal {
    flex-direction: column;
    background: var(--ohda-color-surface);
}

.modal-overlay.ohda-modal[aria-hidden="false"] {
    display: flex;
    opacity: 1;
}

.modal-content-frame.ohda-modal__frame {
    width: 100%;
    min-height: 100%;
    flex: 1;
}

@media (max-width: 1040px) {
    .header-shell.ohda-shell {
        flex-wrap: wrap;
    }

    .header-shell.ohda-shell .primary-nav {
        order: 3;
        flex: 1 0 100%;
    }
}

@media (max-width: 620px) {
    .header-shell.ohda-shell {
        width: min(calc(100% - 28px), var(--content));
    }

    .logo-img.ohda-logo {
        width: 40px;
        height: 40px;
    }

    .home-button.ohda-home-link,
    .language-switcher.ohda-language-switcher button {
        min-width: 40px;
        min-height: 40px;
    }
}