
/* =========================================================
   MEDIQUAL FOOTER POLISHED V56
   ========================================================= */

/* Old footer variants are fully replaced */
#mq51-footer,
#mq54-footer,
#mq55-footer,
footer.site-footer,
.site-footer,
#colophon {
    display: none !important;
}

#mq57-footer {
    --mq-bg: #0b3652;
    --mq-text: rgba(255,255,255,.91);
    --mq-muted: rgba(255,255,255,.74);
    --mq-active: #f37421;

    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;

    background: var(--mq-bg) !important;
    color: #fff !important;

    box-sizing: border-box !important;
}

#mq57-footer,
#mq57-footer * {
    box-sizing: border-box !important;
}

/* =========================================================
   DESKTOP
   ========================================================= */
@media (min-width: 1000px) {

    #mq57-footer .mq57-main {
        width: 100% !important;
        margin: 0 !important;
        padding: 46px clamp(28px, 3.4vw, 58px) 42px !important;

        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: clamp(46px, 5vw, 88px) !important;

        align-items: start !important;
    }

    #mq57-footer .mq57-brand,
    #mq57-footer .mq57-column {
        min-width: 0 !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: left !important;
        align-self: start !important;
    }

    /* Logo supplied by user, larger and top-aligned */
    #mq57-footer .mq57-logo-link {
        display: inline-block !important;
        margin: 0 !important;
        padding: 0 !important;
        text-decoration: none !important;
    }

    #mq57-footer .mq57-logo {
        display: block !important;
        width: clamp(170px, 13vw, 205px) !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        object-fit: contain !important;
        object-position: left top !important;
    }

    /*
     * Make the brand paragraph start visually at the same level
     * as the first link underneath the other section headings.
     */
    #mq57-footer .mq57-brand-copy {
        margin: 24px 0 0 !important;
        padding: 0 !important;
        max-width: 330px !important;

        color: var(--mq-text) !important;
        font-family: inherit !important;
        font-size: 16px !important;
        line-height: 1.58 !important;
        font-weight: 400 !important;
        text-align: left !important;
    }

    #mq57-footer .mq57-column h3 {
        margin: 4px 0 30px !important;
        padding: 0 !important;

        color: #fff !important;
        font-family: inherit !important;
        font-size: 18px !important;
        line-height: 1.2 !important;
        font-weight: 700 !important;
        text-align: left !important;
    }

    #mq57-footer .mq57-links {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 13px !important;

        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;

        text-align: left !important;
    }

    #mq57-footer .mq57-address {
        width: 100% !important;
        max-width: 310px !important;
        margin: 0 0 16px !important;
        padding: 0 !important;

        color: var(--mq-text) !important;
        font-family: inherit !important;
        font-size: 16px !important;
        line-height: 1.55 !important;
        font-weight: 400 !important;
        text-align: left !important;
    }

    #mq57-footer .mq57-links a {
        display: inline-block !important;
        width: auto !important;

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

        color: var(--mq-text) !important;
        font-family: inherit !important;
        font-size: 16px !important;
        line-height: 1.45 !important;
        font-weight: 400 !important;

        text-align: left !important;
        text-decoration: none !important;

        transform: translateX(0) scale(1) !important;
        transform-origin: left center !important;

        transition:
            color .18s ease,
            transform .18s ease,
            text-decoration-color .18s ease !important;
    }

    /* ALL links: white + underline + subtle motion on hover */
    #mq57-footer .mq57-links a:hover,
    #mq57-footer .mq57-links a:focus-visible {
        color: #fff !important;
        text-decoration: underline !important;
        text-underline-offset: 4px !important;

        transform: translateX(4px) scale(1.035) !important;
    }

    /* Current page: orange + underline + slightly larger */
    #mq57-footer .mq57-links a.mq57-active {
        color: var(--mq-active) !important;
        text-decoration: underline !important;
        text-decoration-thickness: 2px !important;
        text-underline-offset: 4px !important;

        transform: translateX(3px) scale(1.045) !important;
    }

    /*
     * Active link becomes temporarily white on hover,
     * then CSS automatically returns it to orange afterward.
     */
    #mq57-footer .mq57-links a.mq57-active:hover,
    #mq57-footer .mq57-links a.mq57-active:focus-visible {
        color: #fff !important;
        transform: translateX(5px) scale(1.055) !important;
    }

    #mq57-footer .mq57-bottom {
        width: 100% !important;
        margin: 0 !important;
        padding: 18px clamp(28px, 3.4vw, 58px) 20px !important;

        border-top: 1px solid rgba(255,255,255,.12) !important;

        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 28px !important;

        color: rgba(255,255,255,.62) !important;
        font-family: inherit !important;
        font-size: 13px !important;
        line-height: 1.4 !important;
        text-align: left !important;
    }

    #mq57-footer .mq57-bottom span:last-child {
        margin-left: auto !important;
        text-align: right !important;
    }
}

/* =========================================================
   TABLET / SMALL DESKTOP
   ========================================================= */
@media (min-width: 700px) and (max-width: 999px) {

    #mq57-footer .mq57-main {
        padding: 40px 30px 36px !important;

        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 42px 52px !important;
    }

    #mq57-footer .mq57-logo {
        width: 185px !important;
        height: auto !important;
    }

    #mq57-footer .mq57-brand-copy,
    #mq57-footer .mq57-address,
    #mq57-footer .mq57-links a {
        font-size: 16px !important;
        text-align: left !important;
    }

    #mq57-footer .mq57-column h3 {
        font-size: 18px !important;
        margin: 2px 0 24px !important;
        text-align: left !important;
    }

    #mq57-footer .mq57-links {
        gap: 12px !important;
        align-items: flex-start !important;
    }

    #mq57-footer .mq57-links a {
        transition: color .18s ease, transform .18s ease !important;
        transform-origin: left center !important;
    }

    #mq57-footer .mq57-links a:hover,
    #mq57-footer .mq57-links a:focus-visible {
        color: #fff !important;
        text-decoration: underline !important;
        text-underline-offset: 4px !important;
        transform: translateX(3px) scale(1.025) !important;
    }

    #mq57-footer .mq57-links a.mq57-active {
        color: var(--mq-active) !important;
        text-decoration: underline !important;
        text-underline-offset: 4px !important;
        transform: translateX(2px) scale(1.035) !important;
    }

    #mq57-footer .mq57-links a.mq57-active:hover,
    #mq57-footer .mq57-links a.mq57-active:focus-visible {
        color: #fff !important;
    }

    #mq57-footer .mq57-bottom {
        padding: 18px 30px 20px !important;
        border-top: 1px solid rgba(255,255,255,.12) !important;

        display: flex !important;
        justify-content: space-between !important;
        gap: 24px !important;

        color: rgba(255,255,255,.62) !important;
        font-size: 13px !important;
    }
}

/* =========================================================
   MOBILE
   ========================================================= */
@media (max-width: 699px) {

    #mq57-footer .mq57-main {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 38px 28px 28px !important;
    }

    #mq57-footer .mq57-brand {
        text-align: left !important;
        padding-bottom: 30px !important;
        border-bottom: 1px solid rgba(255,255,255,.13) !important;
    }

    #mq57-footer .mq57-logo {
        display: block !important;
        width: 195px !important;
        max-width: 75vw !important;
        height: auto !important;
        margin: 0 !important;
    }

    #mq57-footer .mq57-brand-copy {
        margin: 23px 0 0 !important;
        max-width: none !important;

        color: var(--mq-text) !important;
        font-size: 17px !important;
        line-height: 1.58 !important;
        text-align: left !important;
    }

    #mq57-footer .mq57-column {
        padding-top: 32px !important;
        text-align: left !important;
    }

    #mq57-footer .mq57-column h3 {
        margin: 0 0 18px !important;
        color: #fff !important;
        font-size: 24px !important;
        line-height: 1.2 !important;
        font-weight: 700 !important;
        text-align: left !important;
    }

    #mq57-footer .mq57-address {
        margin: 0 0 14px !important;
        color: var(--mq-text) !important;
        font-size: 17px !important;
        line-height: 1.55 !important;
        text-align: left !important;
    }

    #mq57-footer .mq57-links {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 13px !important;
    }

    #mq57-footer .mq57-links a {
        color: var(--mq-text) !important;
        font-size: 17px !important;
        line-height: 1.5 !important;
        text-decoration: none !important;
        transform-origin: left center !important;
        transition: color .18s ease, transform .18s ease !important;
    }

    #mq57-footer .mq57-links a:hover,
    #mq57-footer .mq57-links a:focus-visible {
        color: #fff !important;
        text-decoration: underline !important;
        text-underline-offset: 4px !important;
        transform: translateX(3px) scale(1.025) !important;
    }

    #mq57-footer .mq57-links a.mq57-active {
        color: var(--mq-active) !important;
        text-decoration: underline !important;
        text-underline-offset: 4px !important;
        transform: translateX(2px) scale(1.03) !important;
    }

    #mq57-footer .mq57-links a.mq57-active:hover,
    #mq57-footer .mq57-links a.mq57-active:focus-visible {
        color: #fff !important;
    }

    #mq57-footer .mq57-bottom {
        width: calc(100% - 56px) !important;
        margin: 0 28px !important;
        padding: 20px 0 max(28px, env(safe-area-inset-bottom)) !important;

        border-top: 1px solid rgba(255,255,255,.13) !important;

        display: block !important;

        color: rgba(255,255,255,.62) !important;
        font-size: 14px !important;
        line-height: 1.5 !important;
        text-align: left !important;
    }

    #mq57-footer .mq57-bottom span {
        display: block !important;
        margin-bottom: 8px !important;
    }
}


/* Google Maps address link */
#mq57-footer .mq57-map-link {
    color: inherit !important;
    font: inherit !important;
    line-height: inherit !important;
    font-weight: inherit !important;
    text-decoration: none !important;
    text-align: left !important;
    display: inline !important;
    transform: none !important;
}

#mq57-footer .mq57-map-link:hover,
#mq57-footer .mq57-map-link:focus-visible {
    color: #fff !important;
    text-decoration: underline !important;
    text-underline-offset: 4px !important;
}
