body.b2sme-theme .b2sme-footer {
    position: relative;
    overflow: hidden;
}

body.b2sme-theme .b2sme-footer__inner {
    position: relative;
    z-index: 2;
}

body.b2sme-theme .b2sme-footer--columns .b2sme-footer__inner {
    grid-template-columns: minmax(20rem, 1.15fr) minmax(0, .85fr);
    align-items: start;
}

body.b2sme-theme .b2sme-footer__company {
    max-width: 42rem;
}

body.b2sme-theme .b2sme-footer__text > :last-child,
body.b2sme-theme .b2sme-footer__contact > :last-child {
    margin-bottom: 0;
}

body.b2sme-theme .b2sme-footer__navigations {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2.5rem clamp(2rem, 5vw, 5rem);
}

body.b2sme-theme .b2sme-footer__navigation .mod_customnav,
body.b2sme-theme .b2sme-footer__navigation nav {
    margin: 0;
}

body.b2sme-theme .b2sme-footer__navigation ul {
    display: grid;
    gap: .45rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

body.b2sme-theme .b2sme-footer__navigation li {
    margin: 0;
}

body.b2sme-theme .b2sme-footer__navigation a,
body.b2sme-theme .b2sme-footer__navigation strong {
    display: inline-block;
    padding: 0;
    background: transparent;
    color: #fff;
    font: inherit;
    font-weight: 600;
    text-decoration: none;
}

body.b2sme-theme .b2sme-footer__navigation .level_2 {
    margin-top: .45rem;
    padding-left: 1rem;
}

body.b2sme-theme .b2sme-footer__socials {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    margin-top: 1.5rem;
}

body.b2sme-theme .b2sme-footer__social {
    display: grid;
    width: 2.65rem;
    height: 2.65rem;
    place-items: center;
    border: 1px solid rgb(255 255 255 / .45);
    border-radius: 50%;
    background: transparent;
    color: #fff;
    text-decoration: none;
    transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease;
}

body.b2sme-theme .b2sme-footer__social:hover,
body.b2sme-theme .b2sme-footer__social:focus-visible {
    border-color: #fff;
    background: rgb(255 255 255 / .08);
    color: #fff;
    opacity: 1;
    transform: translateY(-2px);
}

body.b2sme-theme .b2sme-footer__social:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 3px;
}

body.b2sme-theme .b2sme-footer__social svg {
    width: 1.25rem;
    height: 1.25rem;
    fill: currentColor;
}

body.b2sme-theme .b2sme-footer__graphic {
    position: absolute;
    z-index: 1;
    inset: 0 0 0 auto;
    width: min(48vw, 46rem);
    pointer-events: none;
}

body.b2sme-theme .b2sme-footer__graphic::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, var(--b2sme-secondary) 0%, color-mix(in srgb, var(--b2sme-secondary) 80%, transparent) 24%, transparent 70%);
}

body.b2sme-theme .b2sme-footer__graphic img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(1);
    opacity: .42;
}

body.b2sme-theme .b2sme-footer__graphic ~ .b2sme-footer__inner {
    padding-right: min(18vw, 12rem);
}

body.b2sme-theme .b2sme-footer__notice {
    position: relative;
    z-index: 3;
    width: 100%;
    margin-top: 2.5rem;
    background: var(--b2sme-surface-soft);
    color: var(--b2sme-secondary);
}

body.b2sme-theme .b2sme-footer__notice-inner {
    display: grid;
    width: min(100% - 2rem, var(--b2sme-content));
    margin-inline: auto;
    padding-block: 2.25rem;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(2rem, 6vw, 6rem);
}

body.b2sme-theme .b2sme-footer__notice-text,
body.b2sme-theme .b2sme-footer__notice-text p,
body.b2sme-theme .b2sme-footer__notice-text span,
body.b2sme-theme .b2sme-footer__notice-text a {
    color: var(--b2sme-secondary);
}

body.b2sme-theme .b2sme-footer__notice-text > :first-child {
    margin-top: 0;
}

body.b2sme-theme .b2sme-footer__notice-text > :last-child {
    margin-bottom: 0;
}

body.b2sme-theme .b2sme-footer__notice-image img {
    display: block;
    width: auto;
    max-width: min(18rem, 30vw);
    max-height: 8rem;
    object-fit: contain;
}

/* The lead configurator is fixed to the viewport, but it must never cover the
   footer. This rule intentionally wins over the configurator's own bottom/inset
   declarations, including the mobile shorthand. footer.js supplies the visible
   footer overlap through --b2sme-footer-overlap. */
body.b2sme-theme form.b2sme-configurator,
body.b2sme-theme .b2sme-configurator-launcher,
body.b2sme-theme .b2sme-configurator-success {
    bottom: calc(clamp(.75rem, 2vw, 1.5rem) + var(--b2sme-footer-overlap, 0px)) !important;
}

@media (max-width: 64rem) {
    body.b2sme-theme .b2sme-footer__graphic {
        display: none;
    }

    body.b2sme-theme .b2sme-footer__graphic ~ .b2sme-footer__inner {
        padding-right: 0;
    }

    body.b2sme-theme .b2sme-footer--columns .b2sme-footer__inner {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 48rem) {
    body.b2sme-theme .b2sme-footer__navigations,
    body.b2sme-theme .b2sme-footer__notice-inner {
        grid-template-columns: 1fr;
    }

    body.b2sme-theme .b2sme-footer__navigations {
        gap: 1.5rem;
    }

    body.b2sme-theme .b2sme-footer__notice-image img {
        max-width: min(16rem, 70vw);
    }
}