/* Shared fixes for the legacy static pages, not the React app or admin. */
app-header {
    display: block;
}

body {
    margin: 0;
}

.area-header-bar {
    position: relative;
    z-index: 40;
}

.area-header-bar > .container {
    max-width: 1440px !important;
    padding-inline: clamp(1rem, 3vw, 3rem);
}

.area-header-bar nav[aria-label="Main navigation"] {
    gap: 1.25rem;
    padding-block: 1.5rem !important;
}

.area-header-bar nav > a {
    flex-shrink: 0;
}

.area-header-bar nav > a img {
    width: 190px;
    height: 48px !important;
    object-fit: contain;
}

.area-header-bar [role="menubar"] {
    gap: clamp(.75rem, 1.5vw, 1.5rem);
    margin-left: auto;
}

.area-header-bar [role="menubar"] > li {
    flex-shrink: 0;
    margin-left: 0 !important;
}

.area-header-bar [role="menubar"] > li > a,
.area-header-bar [role="menubar"] > li > h3 > a,
.area-header-bar .btn-accent {
    white-space: nowrap;
}

.area-header-bar .drop-down-menu {
    top: 100%;
    margin-top: 0;
    z-index: 50;
}

.area-header-bar .group:hover > .drop-down-menu,
.area-header-bar .group:focus-within > .drop-down-menu {
    visibility: visible;
    opacity: 1;
    margin-top: 0;
}

.navbar-menu {
    z-index: 60 !important;
}

.navbar-menu nav {
    max-width: min(24rem, 90vw);
}

.hero-section > .bg-rule {
    margin-top: 0 !important;
    min-height: 620px;
    height: auto !important;
    padding-top: clamp(3rem, 7vw, 6rem) !important;
    padding-bottom: 5rem !important;
}

.hero-section .header-slogan-p {
    min-height: 4rem;
}

.hero-section .typewrite {
    overflow-wrap: anywhere;
}

#cookieID {
    max-width: calc(100vw - 2rem);
    margin-right: 1rem;
    margin-bottom: 1rem;
}

.services-section img,
.swiper-slide img {
    max-width: 100%;
    object-fit: contain;
}

.absolute.left-0.md\:-mr-32 {
    max-width: 100%;
}

.absolute.left-0.md\:-mr-32 img {
    max-width: 100% !important;
}

.video-section video.clip {
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 100% !important;
    height: auto;
}

form[data-emergency-contact] {
    width: calc(100% - 2rem);
    max-width: 48rem;
    margin: 3rem auto;
    padding: 1rem;
}

#emergency-contact-help {
    overflow-wrap: anywhere;
}

@media (max-width: 768px) {
    .video-container {
        width: 100% !important;
        max-width: 100% !important;
        left: auto !important;
        right: auto !important;
        margin: 0 0 2rem !important;
    }
}

@media (max-width: 1279px) {
    .area-header-bar [role="menubar"],
    .area-header-bar nav > .hidden.lg\:block {
        display: none !important;
    }

    .area-header-bar .navbar-burger {
        display: flex !important;
        margin-left: auto;
    }
}

@media (max-width: 639px) {
    .area-header-bar nav[aria-label="Main navigation"] {
        padding-block: 1rem !important;
    }

    .area-header-bar nav > a img {
        width: 160px;
        height: 40px !important;
    }

    .hero-section .header-slogan-h2 {
        padding-bottom: 1rem;
    }

    .hero-section > .bg-rule {
        min-height: 540px;
        padding-inline: 1rem;
    }
}