/* Footer V5 — Centered Elegant Footer */
.ftr.v5 {
    --ftr-lg-mx-wd: 171;
    --ftr-lg-mx-wd-mbl: 170;
    --ftr-lg-mx-wd-clc: calc((var(--ftr-lg-mx-wd-mbl) * 1px) + (var(--ftr-lg-mx-wd) - var(--ftr-lg-mx-wd-mbl)) * ((var(--vw_) - 320px) / (1920 - 320)));
    /* Section padding mimics Figma 0 0 56px */
    .tp-br {
        padding-block: .89rem;
    }

    /* Phone number — Figma 59px (default desktop is 49px) */
    .fnt_phn {
        --fnt-phn-s: 3.28rem;
    }

    .ftr-divider {
        margin-block: 2.22rem;

        .ftr-divider-line {
            height: 1px;
            background: hsl(from var(--text-color) h s l / var(--bdr-clr-o));
        }

        svg {
            font-size: 1.33rem;
            color: var(--buttons);
        }
    }

    .fnt_pl.cstm {
        line-height: 1;
        color: var(--callout);
    }


    /* Yellow uppercase heading — Albert Sans 600 / 20px / uppercase / 0.12em ls */
    .fnt_t-k.cstm {
        --fnt-t-k-w: 600;
        --fnt-t-k-s: 1.11rem;
        --fnt-t-k-ls: 0.12em;
        --fnt-t-k-lh: 1;
        color: var(--accent);
    }

    .ftr-v5-lnks li a, .ftr-v5-loc, .ftr-v5-hrs-list {
        font-size: .89rem;
    }

    .md-cnt {
        --flx-gap: 5.2rem; 
    }

    /* About column — 468px fixed width on desktop, fill mobile */
    @media screen and (min-width: 1280px) {
        .md-cnt .fourth {
            flex: 0 0 26rem;  /* 468px */
        }

        /* Services nav — two columns on desktop to balance against the
           shorter Locations / Hours columns */
        .ftr-v5-lnks {
            display: grid;
            grid-template-columns: 1fr 1fr;
        }
    }

    /* Social icons — 40x40 circles, white/10% bg */
    .ftr-v5-social-btn {
        width: 2.22rem;
        height: 2.22rem;
        background-color: var(--inner-theme);
        border-radius: 50%;
        transition: background-color 0.3s ease;
    }

    .ftr-v5-social-btn:where(:hover, :focus-visible) {
        background-color: rgba(255, 255, 255, 0.2);
    }

    .ftr-v5-social-btn svg {
        font-size: 1.11rem;
    }
     @media screen and (max-width: 1279px) {
        padding-top: 0 !important;
     }

}

/* When this footer (v5) is the immediate sibling of <main>, paint the last
   main section's bottom-decoration .deco path to match the social-button
   background (the .tp-br.bg-bx.ulk-bg flips the palette one extra step).
   Only the lower .deco is recolored; the top .stroke keeps its --accent fill. */
main:has(+ footer section.ftr.v5[data-colors="primary-light"]:first-of-type)   > section:last-child:has(> .btm-deco) .btm-deco,
main:has(+ footer section.ftr.v5[data-colors="primary-light"]:first-of-type)   > :last-child   section:has(> .btm-deco) .btm-deco { color: var(--dk-bg); }

main:has(+ footer section.ftr.v5[data-colors="alternate-light"]:first-of-type) > section:last-child:has(> .btm-deco) .btm-deco,
main:has(+ footer section.ftr.v5[data-colors="alternate-light"]:first-of-type) > :last-child   section:has(> .btm-deco) .btm-deco { color: var(--dk-bg); }

main:has(+ footer section.ftr.v5[data-colors="primary-dark"]:first-of-type)    > section:last-child:has(> .btm-deco) .btm-deco,
main:has(+ footer section.ftr.v5[data-colors="primary-dark"]:first-of-type)    > :last-child   section:has(> .btm-deco) .btm-deco { color: var(--lt-bg); }

main:has(+ footer section.ftr.v5[data-colors="alternate-dark"]:first-of-type)  > section:last-child:has(> .btm-deco) .btm-deco,
main:has(+ footer section.ftr.v5[data-colors="alternate-dark"]:first-of-type)  > :last-child   section:has(> .btm-deco) .btm-deco { color: var(--lt-bg); }