/* ════════════════════════════════
   FOOTER RESPONSIVE (ORIGINAL)
════════════════════════════════ */

/* ─── DESKTOP (≥1025px) ─── */
@media (min-width: 1025px) {

    .site-footer-brand {
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    /* 1. Logo */
    .site-footer-brand .logo {
        order: 1;
        margin-bottom: 1.2rem;
    }

    /* 2. Redes */
    .site-footer-socials {
        order: 2;
        display: flex;
        gap: 1rem;
        margin-bottom: 1.8rem;
        align-items: center;
    }

    /* 3. CTA */
    .site-footer-cta {
        order: 3;
        margin-bottom: 1.5rem;
    }

    /* 4. Botón */
    .site-footer-btn {
        order: 4;
    }

    /* Links */
    .site-footer-links {
        grid-template-columns: repeat(4, max-content);
        align-items: start;
        row-gap: 0;
    }

    /* Orden columnas */
    .site-footer-col:nth-child(1) { order: 1; }
    .site-footer-col:nth-child(2) { order: 3; }
    .site-footer-col:nth-child(3) { order: 4; }
    .site-footer-col:nth-child(4) { order: 2; }

    .site-footer-bottom {
        border-top: 1px solid rgba(255,255,255,0.15);
    }
}


/* ════════════════════════════════
   TABLET (769px – 1024px)
════════════════════════════════ */
@media (min-width: 769px) and (max-width: 1024px) {
    
    .site-footer-inner {
        padding-left: 2.5rem;
        padding-right: 2.5rem;
    }

    .site-footer-bottom {
        padding-left: 2.5rem;
        padding-right: 2.5rem;
    }

    .site-footer-links {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 2rem 3rem;
    }

}


/* ════════════════════════════════
   MOBILE (≤768px)
════════════════════════════════ */
@media (max-width: 768px) {

    .site-footer {
        padding: 2.5rem 0 0;
    }

    .site-footer-inner {
        display: flex;
        flex-direction: column;
        gap: 0;
        padding: 0 24px 0;
    }

    /* BRAND */
    .site-footer-brand {
        display: flex;
        flex-direction: column;
        order: 1;
        padding-bottom: 1.8rem;
    }

    /* Logo */
    .site-footer-brand .logo {
        order: 1;
        margin-bottom: 0;
    }

    .site-footer-brand .logo img {
        height: 3rem;
    }

    /* CTA */
    .site-footer-cta {
        order: 2;
        font-size: 1.2rem;
        margin-top: 1.5rem;
        margin-bottom: 1rem;
        line-height: 1.4;
    }

    /* Botón */
    .site-footer-btn {
        order: 3;
        width: 100%;
        justify-content: center;
        padding: 0.75rem 1.2rem;
        font-size: 0.95rem;
    }

    /* Socials */
    .site-footer-socials {
        order: 4;
        justify-content: center;
        padding: 1.5rem 0 0.5rem;
        border-top: 1px solid rgba(255,255,255,0.15);
        display: flex;
        margin-top: 1.5rem;
        margin-bottom: 0;
    }

    /* LINKS */
    .site-footer-links {
        order: 2;
        display: flex;
        flex-direction: column;
        gap: 0;
        padding-bottom: 1.5rem;
        border-top: 1px solid rgba(255,255,255,0.15);
    }

    .site-footer-col {
        padding: 1.5rem 0 0;
    }

    /* Orden columnas */
    .site-footer-col:nth-child(1) { order: 1; }
    .site-footer-col:nth-child(4) { order: 2; }
    .site-footer-col:nth-child(2) { order: 3; }
    .site-footer-col:nth-child(3) { order: 4; }

    .site-footer-title {
        font-size: 0.72rem;
        letter-spacing: 0.14em;
        margin-bottom: 1rem;
    }

    .site-footer-col ul li {
        margin-bottom: 0.75rem;
    }

    .site-footer-col ul li a {
        font-size: 0.92rem;
        color: rgba(255,255,255,0.65);
    }

    /* BOTTOM */
    .site-footer-bottom {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 1.5rem 20px 1.75rem;
        gap: 0.75rem;
        border-top: 1px solid rgba(255,255,255,0.15);
    }

    .site-footer-bottom p,
    .site-footer-bottom a {
        font-size: 0.75rem;
    }

    .site-footer-socials img {
        width: 2.2rem;
        height: 2.2rem;
    }
}


/* ─── EXTRA PEQUEÑO (≤380px) ─── */
@media (max-width: 380px) {

    .site-footer-links {
        display: block;
    }

    .site-footer-col:nth-child(3) {
        width: 100%;
    }
}