/* =========================================================
   MAKKY B2B
   FOOTER
   FINAL STRUCTURAL CSS
   ========================================================= */

.mb2b-footer {
    width: 100%;
    box-sizing: border-box;
}

.mb2b-footer *,
.mb2b-footer *::before,
.mb2b-footer *::after {
    box-sizing: border-box;
}

.mb2b-footer__inner {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
}

/* =========================================================
   MAIN FOOTER GRID
   ========================================================= */

.mb2b-footer__main {
    width: 100%;

    display: grid;

    grid-template-columns:
        minmax(170px, 1.35fr)
        minmax(120px, 1fr)
        minmax(120px, 1fr)
        minmax(120px, 1fr)
        minmax(120px, 1fr)
        minmax(180px, 1.15fr);

    align-items: start;

    column-gap: 34px;
    row-gap: 40px;
}

.mb2b-footer__brand,
.mb2b-footer__column {
    width: 100%;
    min-width: 0;
}

/* =========================================================
   BRAND STRUCTURE
   ========================================================= */

.mb2b-footer__logo {
    display: inline-flex;
    align-items: flex-start;

    width: auto;
    max-width: 100%;

    margin: 0;
    padding: 0;

    text-decoration: none;
}

.mb2b-footer__logo img {
    display: block;

    width: auto;
    max-width: 100%;
    height: auto;

    margin: 0;
    padding: 0;

    object-fit: contain;
}

.mb2b-footer__company-name,
.mb2b-footer__description {
    margin-top: 0;
}

/* =========================================================
   SOCIAL
   ========================================================= */

.mb2b-footer__socials {
    display: flex;
    flex-wrap: wrap;
    align-items: center;

    width: 100%;

    gap: var(--mb2b-social-gap, 9px);
}

.mb2b-footer__social {
    width: 32px;
    height: 32px;

    flex: 0 0 auto;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    margin: 0;
    padding: 0;

    color: var(--mb2b-social-color, #FFFFFF) !important;

    border:
        1px solid
        var(
            --mb2b-social-border-color,
            rgba(255,255,255,0.45)
        );

    border-radius: 50%;

    background: transparent;

    line-height: 1;
    text-decoration: none;

    transition:
        color 180ms ease,
        border-color 180ms ease,
        background-color 180ms ease,
        transform 180ms ease;
}

/*
 * Elementor can render icons as SVG with inline
 * fill/stroke attributes.
 *
 * !important is intentional here:
 * Elementor Color Control must be the final authority.
 */

.mb2b-footer__social svg {
    display: block;

    width: 17px;
    height: 17px;

    max-width: 100%;
    max-height: 100%;

    margin: 0;
    padding: 0;

    color: currentColor !important;

    stroke: currentColor !important;
}

.mb2b-footer__social svg path,
.mb2b-footer__social svg circle,
.mb2b-footer__social svg rect,
.mb2b-footer__social svg line,
.mb2b-footer__social svg polyline,
.mb2b-footer__social svg polygon {
    color: currentColor !important;
    stroke: currentColor !important;
    fill: currentColor !important;
}

.mb2b-footer__social i {
    display: block;

    margin: 0;
    padding: 0;

    color: currentColor !important;

    font-size: 17px;
    line-height: 1;
}

.mb2b-footer__social:hover,
.mb2b-footer__social:focus-visible {
    color: var(--mb2b-social-hover-color, #FFA300) !important;

    border-color:
        var(
            --mb2b-social-hover-border-color,
            #FFA300
        );

    text-decoration: none;
}

.mb2b-footer__social:hover svg,
.mb2b-footer__social:hover svg *,
.mb2b-footer__social:focus-visible svg,
.mb2b-footer__social:focus-visible svg * {
    color: currentColor !important;
    stroke: currentColor !important;
    fill: currentColor !important;
}

.mb2b-footer__social:active {
    transform: translateY(1px);
}

/* =========================================================
   NAVIGATION
   ========================================================= */

.mb2b-footer__title {
    margin-top: 0;
}

.mb2b-footer__links {
    display: flex;
    flex-direction: column;

    gap: 7px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.mb2b-footer__links li {
    margin: 0;
    padding: 0;
}

.mb2b-footer__links a {
    display: inline-block;

    text-decoration: none;
}

.mb2b-footer__links a:hover,
.mb2b-footer__links a:focus-visible {
    text-decoration: none;
}

/* =========================================================
   CONTACT
   ========================================================= */

.mb2b-footer__contacts {
    display: flex;
    flex-direction: column;

    gap: 11px;

    width: 100%;
}

.mb2b-footer__contact {
    text-align:
        var(
            --mb2b-contact-text-align,
            left
        );
}

.mb2b-footer__contact-item {
    justify-content:
        var(
            --mb2b-contact-justify,
            left
        );
}

.mb2b-footer__contact-text {
    text-align:
        var(
            --mb2b-contact-text-align,
            left
        );
}

.mb2b-footer__contact-item {
    display: flex;
    align-items: flex-start;

    width: 100%;
    min-width: 0;

    column-gap: 9px;

    margin: 0;
    padding: 0;

    text-decoration: none;
}

.mb2b-footer__contact-item:hover,
.mb2b-footer__contact-item:focus-visible {
    text-decoration: none;
}

.mb2b-footer__contact-icon {
    width: 18px;
    height: 18px;

    flex: 0 0 18px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: inherit;

    line-height: 1;
}

.mb2b-footer__contact-icon svg {
    display: block;

    width: 17px;
    height: 17px;

    max-width: 100%;
    max-height: 100%;

    color: currentColor !important;
    stroke: currentColor !important;
    fill: currentColor !important;
}

.mb2b-footer__contact-icon svg * {
    color: currentColor !important;
    stroke: currentColor !important;
    fill: currentColor !important;
}

.mb2b-footer__contact-icon i {
    display: block;

    color: currentColor;

    line-height: 1;
}

.mb2b-footer__contact-text {
    min-width: 0;
}

/* =========================================================
   BOTTOM BAR
   ========================================================= */

.mb2b-footer__bottom {
    width: 100%;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    margin-top: 26px;
    padding-top: 20px;

    border-top:
        1px solid
        rgba(255,255,255,0.16);
}

.mb2b-footer__copyright {
    min-width: 0;
}

.mb2b-footer__legal {
    display: flex;
    flex-wrap: wrap;

    align-items: center;
    justify-content: flex-end;

    gap: 10px;

    min-width: 0;
}

.mb2b-footer__legal a {
    text-decoration: none;
}

.mb2b-footer__legal a:hover,
.mb2b-footer__legal a:focus-visible {
    text-decoration: none;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .mb2b-footer__main {
        grid-template-columns:
            minmax(0, 1fr);

        column-gap: 0;
        row-gap: 30px;
    }

    .mb2b-footer__brand,
    .mb2b-footer__column {
        width: 100%;
        min-width: 0;
    }

    .mb2b-footer__description {
        max-width: 100%;
    }

    .mb2b-footer__bottom {
        flex-direction: column;
        align-items: flex-start;

        gap: 12px;

        text-align: left;
    }

    .mb2b-footer__legal {
        justify-content: flex-start;
    }
}

/* =========================================================
   TABLET
   ========================================================= */

@media (min-width: 768px) and (max-width: 1024px) {

    .mb2b-footer__main {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));

        column-gap: 28px;
        row-gap: 40px;
    }

    .mb2b-footer__brand {
        grid-column: span 3;
    }
}

/* =========================================================
   DESKTOP
   ========================================================= */



/* =========================================================
   DYNAMIC FOOTER COLUMN COUNT
   ========================================================= */



@media (min-width: 1025px) {

    .mb2b-footer__main[style*="--mb2b-footer-enabled-columns: 5"] {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .mb2b-footer__main[style*="--mb2b-footer-enabled-columns: 4"] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .mb2b-footer__main[style*="--mb2b-footer-enabled-columns: 3"] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .mb2b-footer__main[style*="--mb2b-footer-enabled-columns: 2"] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mb2b-footer__main[style*="--mb2b-footer-enabled-columns: 1"] {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* =========================================================
   MOBILE STICKY
   Header Drawer State
   ========================================================= */

/* =========================================================
   MAKky B2B — MOBILE STICKY FOOTER
   SINGLE SOURCE OF TRUTH
   ========================================================= */

.mb2b-footer__sticky {
    display: none;
}

@media (max-width: 767px) {

    .mb2b-footer__sticky {
        position: fixed !important;

        top: auto !important;
        right: 14px !important;
        bottom: 18px;
        left: 14px !important;

        width: auto;
        max-width: 420px !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin: 0 auto !important;
        padding: 10px 12px;

        display: flex !important;
        flex-direction: row !important;
        align-items: stretch !important;
        justify-content: space-between !important;

        box-sizing: border-box !important;

        visibility: visible !important;
        opacity: 1 !important;

        overflow: visible !important;


        z-index: 2147483647 !important;

        background:
            var(--mb2b-sticky-background, #112C62);

        border:
            var(--mb2b-sticky-border-width, 1px)
            solid
            var(--mb2b-sticky-border-color, #FFA300);

        border-radius:
            var(--mb2b-sticky-radius, 28px);

        box-shadow:
            0 12px 30px rgba(0, 0, 0, .18),
            0 3px 10px rgba(0, 0, 0, .10);

        isolation: isolate;
    }

    .mb2b-footer__sticky {
        transition:
            opacity 0.28s ease-out,
            transform 0.28s ease-out,
            visibility 0s linear 0s;
    }

    .mb2b-footer__sticky:not(.mb2b-footer__sticky--visible) {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: translate3d(0, 16px, 0) !important;
    }

    .mb2b-footer__sticky.mb2b-footer__sticky--visible {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translate3d(0, 0, 0) !important;
    }

    .mb2b-footer__sticky-item {
        position: relative !important;

        min-width: 0 !important;
        flex: 1 1 0 !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;

        gap:
            var(--mb2b-sticky-item-gap, 4px) !important;

        margin: 0 !important;
        padding: 0 !important;

        color: inherit !important;
        background: transparent !important;
        border: 0 !important;

        text-decoration: none !important;
        text-align: center !important;
    }

    .mb2b-footer__sticky-icon {
        width:
            var(--mb2b-sticky-icon-box-size, 42px) !important;

        height:
            var(--mb2b-sticky-icon-box-size, 42px) !important;

        flex: 0 0 auto !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;
        padding: 0 !important;

        color:
            var(--mb2b-sticky-icon-color, #FFA300) !important;

        line-height: 1 !important;
    }

    .mb2b-footer__sticky-icon svg {
        display: block !important;

        width:
            var(--mb2b-sticky-icon-size, 22px) !important;

        height:
            var(--mb2b-sticky-icon-size, 22px) !important;

        max-width: 100% !important;
        max-height: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        color: currentColor !important;
        stroke: currentColor !important;
        fill: currentColor !important;
    }

    .mb2b-footer__sticky-icon svg * {
        color: currentColor !important;
        stroke: currentColor !important;
        fill: currentColor !important;
    }

    .mb2b-footer__sticky-label {
        display: block !important;

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: hidden !important;

        color:
            var(--mb2b-sticky-title-color, #FFFFFF) !important;

        text-align: center !important;
        white-space: nowrap !important;
        text-overflow: ellipsis !important;
    }

    .mb2b-footer__sticky-item:hover
    .mb2b-footer__sticky-icon {
        color:
            var(--mb2b-sticky-hover-icon-color, #FFFFFF) !important;
    }

    .mb2b-footer__sticky-item:hover
    .mb2b-footer__sticky-label {
        color:
            var(--mb2b-sticky-hover-title-color, #FFA300) !important;
    }

    body.mb2b-mobile-menu-open
    .mb2b-footer__sticky {
        display: none !important;
    }
}




