/* ============================================================
   Star Aluminium — Footer
   ============================================================ */

.sa-footer {
    border-top: 3px solid #e01f27;
    background: #fff;
    padding: 40px 32px;
    margin-top: 0;
}

/* 3 equal columns */
.sa-footer-inner {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    gap: 48px;
    max-width: 1400px;
    margin: 0 auto;
    align-items: start;
}

/* ── Col 1: Logo + Social ──────────────────────────────────── */
.sa-footer-brand {
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
    text-align: center;
}

.sa-footer-logo-link { display: block; line-height: 0; }
.sa-footer-logo-link img { width: 250px; height: auto; }

.sa-footer-social {
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: center;
}

.sa-social-link {
    color: #1c4586;
    display: flex;
    align-items: center;
    transition: color .2s;
}
.sa-social-link img {
    width: 40px;
    height: 40px;
}
.sa-social-link:hover { color: #e01f27; }

/* ── Col 2: Nav (2×2 grid) ─────────────────────────────────── */
.sa-footer-nav {
    display: grid;
    grid-template-columns: auto auto;
    gap: 10px 0px;
    justify-content: center;
}

.sa-footer-heading {
    font-family: 'Axiforma', sans-serif;
    font-weight: 700;
    font-size: 18px;
    color: #000;
    margin: 0 0 8px;
    padding-bottom: 0;
    border-bottom: none;
    display: block;
}
.sa-footer-heading::after {
    content: '';
    display: block;
    width: 180px;
    height: 2px;
    background: #e01f27;
    margin-top: 8px;
}

.sa-footer-links {
    list-style: none;
    margin: 6px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sa-footer-links li a {
    font-family: 'Axiforma', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #333 !important;
    text-decoration: none;
    padding-left: 10px;
    transition: color .2s;
}
.sa-footer-links li a:hover { color: #e01f27 !important; }

/* ── Col 3: Contact ────────────────────────────────────────── */
.sa-footer-contact {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
}

.sa-footer-email {
    font-family: 'Axiforma', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #333 !important;
    text-decoration: none;
    transition: color .2s;
}
.sa-footer-email:hover { color: #e01f27 !important; }

.sa-footer-phone {
    font-family: 'Axiforma', sans-serif;
    font-weight: 800;
    font-size: 47px;
    color: #e01f27 !important;
    text-decoration: none;
    line-height: 1.1;
    letter-spacing: -1px;
    white-space: nowrap;
}
.sa-footer-phone:hover { color: #b01520 !important; }

.sa-footer-quote {
    font-family: 'Axiforma', sans-serif;
    font-weight: 700;
    font-size: 22px;
    color: #fff !important;
    text-decoration: none;
    background: #e01f27;
    padding: 12px 62px 12px 78px;
    display: inline-block;
    width: auto;
    text-align: center;
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 18px 100%);
    margin-top: 1px;
    transition: background .2s;
}
.sa-footer-quote:hover { background: #b01520; }

/* State phones grid */
.sa-footer-states {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    width: 100%;
    margin-top: 16px;
    gap: 0;
}

.sa-state-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px 10px;
    border-right: 2px solid #e01f27;
    align-items: center;
    text-align: center;
}
.sa-state-item:nth-child(3),
.sa-state-item:nth-child(6) { border-right: none; }

.sa-state-name {
    font-family: 'Axiforma', sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: #666;
    min-height: 2.6em;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sa-state-phone {
    font-family: 'Axiforma', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #000 !important;
    text-decoration: none;
    white-space: nowrap;
    transition: color .2s;
}
.sa-state-phone:hover { color: #e01f27 !important; }

/* ── Responsive ────────────────────────────────────────────── */

/* Tablet */
@media (max-width: 1024px) {
    .sa-footer {
        padding: 36px 32px;
    }

    /* Single column — each section stacks vertically */
    .sa-footer-inner {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    /* Brand: centered, column (same as desktop) */
    .sa-footer-brand {
        grid-column: auto;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 20px;
    }
    .sa-footer-logo-link img { width: 220px; }
    .sa-social-link svg { width: 36px; height: 36px; }

    /* Nav: 2×2 grid, centered */
    .sa-footer-nav {
        grid-column: auto;
        grid-template-columns: auto auto;
        justify-content: center;
        gap: 12px 80px;
    }
    .sa-footer-heading { font-size: 16px; }
    .sa-footer-heading::after { width: 140px; }
    .sa-footer-links li a { font-size: 14px; }

    /* Contact: centered */
    .sa-footer-contact {
        grid-column: auto;
        align-items: center;
        text-align: center;
    }
    .sa-footer-email { font-size: 14px; }
    .sa-footer-phone { font-size: 40px; }
    .sa-footer-quote {
        font-size: 18px;
        padding: 10px 52px 10px 66px;
    }

    /* States: centered, max-width to prevent stretching */
    .sa-footer-states {
        grid-template-columns: repeat(3, auto);
        justify-content: center;
        max-width: 480px;
        margin-left: auto;
        margin-right: auto;
    }
    .sa-state-name { font-size: 12px; min-height: 2.4em; }
    .sa-state-phone { font-size: 14px; }
}

/* Mobile */
@media (max-width: 600px) {
    .sa-footer {
        padding: 24px 16px;
    }
    .sa-footer-inner {
        grid-template-columns: 1fr;
        gap: 28px;
    }
    /* Brand: stack vertically, centered */
    .sa-footer-brand {
        grid-column: auto;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .sa-footer-logo-link img { width: 180px; }
    .sa-social-link svg { width: 36px; height: 36px; }

    /* Nav: 2 columns still, full width */
    .sa-footer-nav {
        grid-template-columns: 1fr 1fr;
        justify-content: stretch;
        gap: 20px 16px;
    }
    .sa-footer-heading { font-size: 15px; }
    .sa-footer-heading::after { width: 100%; }
    .sa-footer-links li a { font-size: 13px; }

    /* Contact: centered */
    .sa-footer-contact {
        grid-column: auto;
        align-items: center;
        text-align: center;
    }
    .sa-footer-email { font-size: 13px; }
    .sa-footer-phone { font-size: 32px; letter-spacing: -0.5px; }
    .sa-footer-quote {
        font-size: 16px;
        padding: 9px 24px;
        display: block;
        width: 100%;
        box-sizing: border-box;
        clip-path: none;
        text-align: center;
    }

    /* States: 2 columns */
    .sa-footer-states { grid-template-columns: repeat(2, 1fr); }
    .sa-state-item:nth-child(2),
    .sa-state-item:nth-child(4) { border-right: none; }
    .sa-state-item:nth-child(3) { border-right: 2px solid #e01f27; }
    .sa-state-name { font-size: 11px; min-height: 2.2em; }
    .sa-state-phone { font-size: 13px; }
}

/* ── Footer Bottom Strip — legal links + copyright ─────────────
   Sits below the main 3-column footer, full width, dark band.
   Doesn't alter the existing footer layout above. */
/* Brand-aligned navy band — uses Star Aluminium navy (#1c4586)
   with a vertical gradient + 4px red brand stripe on top + red dot separators. */
/* ── Certifications strip — ISO + SEMMA logos ─────────────────
   Sits between the main 3-column footer and the navy legal band.
   Centered, neutral background, generous breathing room. */
/* Nested inside Col 3 (sa-footer-contact), directly below sa-footer-states. */
.sa-footer-certs {
    margin-top: 24px;
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}
.sa-cert-item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.15s;
}
.sa-cert-item img {
    display: block;
    height: 78px;
    width: auto;
    max-width: 100%;
}
.sa-cert-item:hover { transform: translateY(-2px); }
/* SEMMA white logo needs a dark backdrop to be visible */
.sa-cert-item--semma {
    background: #1c4586;
    border-radius: 6px;
    padding: 8px 14px;
}
.sa-cert-item--semma img { height: 64px; }

@media (max-width: 720px) {
    .sa-footer-certs { gap: 14px; margin-top: 20px; }
    .sa-cert-item img { height: 64px; }
    .sa-cert-item--semma img { height: 54px; }
}

.sa-footer-bottom {
    margin-top: 0;
    padding: 24px 0 26px;
    background: linear-gradient(180deg, #1c4586 0%, #163b73 100%);
    box-shadow: inset 0 4px 0 #e01f27;
    color: #fff;
    position: relative;
}
.sa-footer-bottom-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 6vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    text-align: center;
}
.sa-footer-legal {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 8px 0 !important;
}
.sa-footer-legal li {
    position: relative;
    padding: 0 16px;
    list-style: none !important;
    background: none !important;
}
.sa-footer-legal li:not(:last-child)::after {
    content: '';
    position: absolute;
    right: -3px;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #e01f27;
    opacity: 0.78;
}
.sa-footer-legal a {
    color: rgba(255, 255, 255, 0.9) !important;
    font-family: 'Axiforma', sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    letter-spacing: 0.02em !important;
    text-decoration: none !important;
    text-transform: none !important;
    line-height: 1.5 !important;
    transition: color 0.15s, text-shadow 0.15s !important;
}
.sa-footer-legal a:hover {
    color: #fff !important;
    text-shadow: 0 0 14px rgba(255, 255, 255, 0.45);
}
.sa-footer-copy {
    position: relative;
    color: rgba(255, 255, 255, 0.75) !important;
    font-family: 'Axiforma', sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    margin: 0 !important;
    letter-spacing: 0.04em !important;
    padding-top: 14px;
    width: 100%;
}
.sa-footer-copy::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 56px;
    height: 1px;
    background: rgba(255, 255, 255, 0.24);
}

@media (max-width: 720px) {
    .sa-footer-bottom {
        margin-top: 28px;
        padding: 18px 0 20px;
    }
    .sa-footer-bottom-inner {
        gap: 14px;
        padding: 0 4vw;
    }
    .sa-footer-legal { gap: 6px 0 !important; }
    .sa-footer-legal li { padding: 0 11px; }
    .sa-footer-legal a { font-size: 11.5px !important; }
    .sa-footer-legal li:not(:last-child)::after {
        right: -1px;
        width: 3px;
        height: 3px;
    }
    .sa-footer-copy { font-size: 11px !important; padding-top: 12px; }
}

/* ── Locations layout override — VIC + QLD top row, WA full-width below ─ */
.sa-footer-states {
    grid-template-columns: 1fr 1fr !important;
    gap: 0 !important;
    margin-top: 20px !important;
}
.sa-footer-states .sa-state-item {
    align-items: flex-start !important;
    text-align: left !important;
    padding: 12px 14px !important;
    border-right: 2px solid #e01f27 !important;
}
.sa-footer-states .sa-state-item:nth-child(2) {
    border-right: none !important;
}
.sa-footer-states .sa-state-item:last-child {
    grid-column: 1 / -1 !important;
    border-right: none !important;
    border-top: 2px solid #e01f27 !important;
    padding-top: 16px !important;
    align-items: center !important;
    text-align: center !important;
}
.sa-footer-states .sa-state-name {
    min-height: auto !important;
    display: block !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    color: #000 !important;
    margin-bottom: 4px !important;
    letter-spacing: 0.02em !important;
    text-transform: uppercase !important;
}
.sa-footer-states .sa-state-phone {
    white-space: normal !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    color: #444 !important;
    text-align: left !important;
    display: block !important;
}
.sa-footer-states .sa-state-phone:hover { color: #1c4586 !important; }

/* ── Nav grid override — 4 groups stretch even when one is long ─ */
.sa-footer-nav {
    gap: 28px 32px !important;
    justify-content: flex-start !important;
}
.sa-footer-nav .sa-footer-nav-group {
    min-width: 0;
}
.sa-footer-nav .sa-footer-heading::after {
    width: 90% !important;
    max-width: 180px;
}
.sa-footer-nav .sa-footer-links li a {
    line-height: 1.45 !important;
}

/* Mobile: stack state items vertically */
@media (max-width: 720px) {
    .sa-footer-states {
        grid-template-columns: 1fr !important;
    }
    .sa-footer-states .sa-state-item {
        border-right: none !important;
        border-bottom: 1px solid rgba(255,255,255,0.12);
        padding: 14px 0 !important;
    }
    .sa-footer-states .sa-state-item:last-child {
        border-bottom: none;
        border-top: none !important;
        align-items: flex-start !important;
        text-align: left !important;
    }
}