/* =====================================================================
 * Footer del sitio publico (libs/_footer.php) - fm 17/09/2026
 *
 * Hoja propia del footer, la carga el mismo libs/_footer.php. Antes el footer
 * vivia en _modern.css (seccion 12) y se veia distinto segun la pagina:
 *  - propiedades.php y la ficha cargan Metronic (crm/assets/global/css/components.css):
 *    esquinas cuadradas con !important y margin-top:1px en los iconos.
 *  - broker, solicitudes, propiedadesw/w, realties y teamspre no cargan el sistema
 *    de diseño y si bootstrap/agency/_gvia: el footer salia sin estilos.
 *  - teamMX carga los dos: bootstrap pone html{font-size:10px} y todo lo que
 *    estaba en rem se encogia al 62.5%.
 * Por eso aqui todo va en px y con colores literales (sin var(--gv-*) ni rem),
 * acotado a .gv-footer / #btncelulares / .social, con una base explicita y
 * neutralizando lo que bootstrap/agency/Metronic le meten a h3/h4/p/ul/li/a.
 * ===================================================================== */

/* ---------- Base ---------- */
.gv-footer {
    display: block;
    box-sizing: border-box;
    margin: 0;
    padding: 64px 0 0;
    background: #171717;
    color: #d4d4d4;
    font-family: 'Libre Franklin', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 18px;
    font-weight: 400;
    font-style: normal;
    line-height: 1.7;
    letter-spacing: normal;
    word-spacing: normal;
    text-align: start;
    text-transform: none;
    text-indent: 0;
    text-shadow: none;
    white-space: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    -webkit-text-size-adjust: auto;
    text-size-adjust: auto;
    -webkit-tap-highlight-color: initial;
}
.gv-footer *,
.gv-footer *::before,
.gv-footer *::after {
    box-sizing: border-box;
}
.gv-footer h3,
.gv-footer h4,
.gv-footer p,
.gv-footer ul,
.gv-footer li {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    text-shadow: none;
}
.gv-footer a {
    text-decoration: none;
    background-color: transparent;
}
.gv-footer a:hover,
.gv-footer a:focus {
    color: #ffffff;
    text-decoration: none;
}

/* Contenedor y grid propios (en las paginas con bootstrap, .container y col-* traen
   ancho, float y padding de BS3) */
.gv-footer .container {
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
}
.gv-footer .container::before,
.gv-footer .container::after {
    content: none;
}
@media (min-width: 1400px) {
    .gv-footer .container { max-width: 1320px; }
}
.gv-footer .gv-footer-row {
    display: grid;
    grid-template-columns: 1.5fr 1.05fr 0.95fr 1.5fr; /* 4a col mas ancha para los badges en fila */
    gap: 40px;
}
.gv-footer .gv-footer-row > [class*="col-"] {
    position: static;
    width: auto;
    max-width: none;
    min-height: auto;
    float: none;
    padding-left: 0;
    padding-right: 0;
}
@media (max-width: 992px) {
    .gv-footer .gv-footer-row { grid-template-columns: repeat(2, 1fr); gap: 32px; }
}
@media (max-width: 560px) {
    .gv-footer .gv-footer-row { grid-template-columns: 1fr; }
}
.gv-footer .gv-footer-col {
    margin-bottom: 32px;
}

/* ---------- Col 1: marca, texto y redes (centrada, como el mockup) ---------- */
.gv-footer .gv-footer-brand {
    color: #be272d;
    font-family: 'Zalando Sans Expanded', 'Libre Franklin', sans-serif !important;
    font-size: 24px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    text-align: center;
    margin: 0 0 16px;
}
.gv-footer .gv-footer-tagline {
    color: #a3a3a3;
    font-size: 18px;
    line-height: 1.7;
    margin: 0 0 20px;
    text-align: center;
}
.gv-footer .gv-footer-social {
    display: flex;
    gap: 8px;
    justify-content: center;
}
.gv-footer .gv-footer-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    transition: all 250ms cubic-bezier(0.4, 0, 0.2, 1);
    text-decoration: none;
}
.gv-footer .gv-footer-social a:hover {
    background: #be272d;
    color: #ffffff;
    transform: translateY(-3px);
    box-shadow: 0 4px 14px 0 rgba(190, 39, 45, 0.30);
}
.gv-footer .gv-footer-social a i {
    font-size: 24px;
    margin-top: 0;
}

/* ---------- Titulos de columna ---------- */
.gv-footer .gv-footer-heading {
    position: relative;
    color: #ffffff;
    font-family: 'Zalando Sans Expanded', 'Libre Franklin', sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: 0.02em; /* fm 17/09/2026 - antes 0.08em: "DESCARGA NUESTRA APP" se partia en 2 lineas a 1440 */
    text-transform: uppercase;
    margin: 0 0 20px;
    padding-bottom: 12px;
}

/* fm 17/09/2026 - de 993 a 1399px el contenedor es de 1200px o menos y las columnas 1 y 4
   miden 243-312px: la marca (347px) y "DESCARGA NUESTRA APP" (342px) se partian en 2 lineas.
   En ese rango se achican con el ancho; el primer font-size es para navegadores sin min(). */
@media (min-width: 993px) and (max-width: 1399px) {
    .gv-footer .gv-footer-brand {
        font-size: 21px;
        font-size: min(21px, calc(2vw - 3.4px));
    }
    .gv-footer .gv-footer-heading {
        font-size: 18px;
        font-size: min(18px, calc(1.75vw - 2.9px));
        letter-spacing: 0;
    }
}

/* ---------- Col 2 y 3: contacto y menu ---------- */
.gv-footer .gv-footer-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.gv-footer .gv-footer-list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 8px 0;
    color: #d4d4d4;
    font-size: 18px;
    line-height: 1.3;
}
.gv-footer .gv-footer-list li i {
    color: #be272d;
    font-size: 18px;
    width: 20px;
    text-align: center;
    margin-top: 4px;
    flex-shrink: 0;
}
.gv-footer .gv-footer-list li a {
    color: #d4d4d4;
    transition: color 150ms cubic-bezier(0.4, 0, 0.2, 1);
    text-decoration: none;
}
.gv-footer .gv-footer-list li a:hover {
    color: #ffffff;
}
.gv-footer .gv-footer-links li::before {
    content: '\203A';
    color: #be272d;
    font-weight: 700;
    margin-right: 8px;
    font-size: 20px;
    line-height: 1;
}

/* ---------- Col 4: app ---------- */
.gv-footer .gv-footer-app-text {
    color: #a3a3a3;
    font-size: 18px; /* fm 17/09/2026 - antes 16px; igual que el texto de la col 1, como el mockup */
    line-height: 1.7;
    margin: 0 0 20px;
}
/* dvb 17/06/2026 - badges de apps: una sola fila en desktop, apiladas (2 filas) en movil */
.gv-footer .gv-footer-apps {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 8px;
}
.gv-footer .gv-app-badge {
    flex: 1 1 0;
    min-width: 0;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: 8px;
    padding: 8px 12px;
    background: #0a0a0a;
    color: #ffffff;
    border: 1px solid #404040;
    border-radius: 8px !important; /* Metronic: a{border-radius:0 !important} */
    text-decoration: none !important;
    transition: all 250ms cubic-bezier(0.4, 0, 0.2, 1);
}
.gv-footer .gv-app-badge:hover {
    background: #262626;
    color: #ffffff;
    border-color: #be272d;
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -2px rgba(0, 0, 0, 0.04);
}
.gv-footer .gv-app-badge i {
    grid-row: 1 / 3;
    font-size: 26px;
    color: #ffffff;
    margin-top: 0;
}
.gv-footer .gv-app-badge .small {
    grid-column: 2;
    grid-row: 1;
    font-size: 11px;
    color: #a3a3a3;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.gv-footer .gv-app-badge .big {
    grid-column: 2;
    grid-row: 2;
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.2;
    margin-top: 1px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---------- Barra inferior ---------- */
.gv-footer .gv-footer-bottom {
    background: #0a0a0a;
    color: #a3a3a3;
    padding: 20px 0;
    font-size: 16px;
    margin-top: 32px;
}
.gv-footer .gv-footer-bottom-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
.gv-footer .gv-footer-bottom a {
    color: #a3a3a3;
    transition: color 150ms cubic-bezier(0.4, 0, 0.2, 1);
}
.gv-footer .gv-footer-bottom a:hover {
    color: #ffffff;
}

/* ---------- Movil ---------- */
@media (max-width: 768px) {
    .gv-footer {
        text-align: center;
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }
    .gv-footer .container {
        padding-left: 12px;
        padding-right: 12px;
    }
    /* Mismos tamaños que _responsive.css da a h3/h4 en movil (algunas paginas no lo cargan) */
    .gv-footer .gv-footer-brand {
        font-size: 18px !important;
        line-height: 1.3 !important;
    }
    .gv-footer .gv-footer-heading {
        font-size: 16px !important;
        line-height: 1.3 !important;
    }
    .gv-footer .gv-footer-list li,
    .gv-footer .gv-footer-links li {
        justify-content: center;
    }
    .gv-footer .gv-footer-apps {
        flex-direction: column;
        align-items: center;
    }
    .gv-footer .gv-app-badge { flex: 0 0 auto; min-width: 220px; }
    .gv-footer .gv-app-badge i { font-size: 30px; }
    .gv-footer .gv-app-badge .small { font-size: 14px; }
    .gv-footer .gv-app-badge .big { font-size: 18px; }
    /* fm 17/09/2026 - "Aviso de privacidad" bajaba a su propio renglon pegado a la izquierda
       bajo el copyright centrado (no se notaba porque lo tapaba #btncelulares) */
    .gv-footer .gv-footer-bottom-inner { justify-content: center; }
}
@media (max-width: 480px) {
    .gv-footer .container {
        padding-left: 10px;
        padding-right: 10px;
    }
}
/* La barra fija de Llamar/WhatsApp (#btncelulares, 69px) tapaba "Aviso de privacidad" */
@media (max-width: 720px) {
    .gv-footer .gv-footer-bottom {
        padding-bottom: calc(89px + env(safe-area-inset-bottom));
    }
    /* fm 17/09/2026 - si el visitante cierra la barra con la x ya no hay nada que librar */
    body.gv-cb-cerrada .gv-footer .gv-footer-bottom {
        padding-bottom: calc(20px + env(safe-area-inset-bottom));
    }
}

/* =====================================================================
 * Botones flotantes (antes en un <style> dentro de _footer.php)
 * ===================================================================== */
#btncelulares {
    display: none;
}

@media (max-width: 720px) {
    #btncelulares {
        display: flex;
        align-items: center;
        gap: 10px;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 100;
        padding: 10px 12px;
        padding-bottom: calc(10px + env(safe-area-inset-bottom));
        background: #ffffff;
        border-top: 1px solid #ececec;
        box-shadow: 0 -4px 18px rgba(0, 0, 0, 0.12);
        color: #171717;
        font-family: 'Libre Franklin', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 1.5;
        letter-spacing: normal;
        text-align: start;
        text-transform: none;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        text-rendering: optimizeLegibility;
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
        -webkit-tap-highlight-color: initial;
    }

    .social {
        display: none;
    }

    #btncelulares .gv-cb-btn {
        flex: 1;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        height: 48px;
        border-radius: 999px !important; /* Metronic: a{border-radius:0 !important} */
        font-weight: 700;
        font-size: 15px;
        text-decoration: none;
        transition: transform .15s ease;
    }
    #btncelulares .gv-cb-btn:active { transform: scale(0.97); }
    #btncelulares .gv-cb-btn i { font-size: 1.15em; margin-top: 0; }
    #btncelulares .gv-cb-call { background: #111111; color: #ffffff; }
    #btncelulares .gv-cb-wa { background: #25d366; color: #ffffff; }
    #btncelulares .gv-cb-close {
        position: absolute;
        top: -15px;
        right: 12px;
        width: 30px;
        height: 30px;
        min-height: 0; /* fm 17/09/2026 - button{min-height:44px} de _responsive.css lo hacia ovalado */
        border-radius: 50% !important;
        background: #ffffff;
        border: 1px solid #e5e5e5;
        color: #555555;
        font-family: Arial, Helvetica, sans-serif;
        -webkit-appearance: auto;
        appearance: auto;
        font-size: 18px;
        line-height: 26px;
        text-align: center;
        padding: 0;
        cursor: pointer;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    }
    /* fm 17/09/2026 - el circulo mide 30px pero el area de toque sigue siendo de 44px */
    #btncelulares .gv-cb-close::before {
        content: '';
        position: absolute;
        top: -7px;
        right: -7px;
        bottom: -7px;
        left: -7px;
    }
}

/* dvb 16/06/2026 - barra social flotante: centrada verticalmente respecto a la
   pantalla y unificada (circulos blancos con iconos negros; antes el telefono
   salia rojo). */
.social {
    position: fixed;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1000;
    /* fm 17/09/2026 - base fija: en paginas con Metronic/bootstrap el body trae otra */
    color: #171717;
    font-family: 'Libre Franklin', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 18px;
    line-height: 1.5;
    text-align: start;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    -webkit-text-size-adjust: auto;
    text-size-adjust: auto;
    -webkit-tap-highlight-color: initial;
}
@media (max-width: 768px) {
    .social { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
}

.social ul {
    list-style: none;
    margin: 0;
    padding: 0;
    color: #171717 !important;
}

.social ul li a i {
    font-size: 22px;
    width: auto;        /* fm 17/09/2026 - Metronic: li [class*=" fa-"]{width:1.25em;text-align:center} */
    text-align: start;
    margin-top: 0;      /* y [class*=" fa-"]{margin-top:1px} */
}

.social ul li a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    width: 48px;
    height: 48px;
    font-size: 18px; /* fm 17/09/2026 - lo que .btn de bootstrap/Metronic cambia en estas paginas */
    border: 0;
    text-align: start;
    white-space: normal;
    vertical-align: baseline;
    -webkit-user-select: auto;
    user-select: auto;
    touch-action: auto;
    border-radius: 50% !important;
    margin-bottom: 8px;
    line-height: 1 !important;
    background: #ffffff !important;
    color: #111111 !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.18);
    transition: transform .2s ease;
}

.social ul li a.btn-default {
    /* la misma transicion que le da _components.css (.btn.btn-default) en las paginas con el sistema de diseño */
    transition: all 250ms cubic-bezier(0.4, 0, 0.2, 1);
}

.social ul li a:hover {
    transform: translateY(-3px);
    box-shadow: 0 2px 10px rgba(0,0,0,0.18); /* Metronic: .btn:hover{box-shadow:none} */
}

.estilos {
    color: #111111 !important;
}

/* =====================================================================
 * Piezas del footer que solo estilan _components.css / _modern.css: en las
 * paginas que no los cargan se quedan ocultas en vez de salir en linea.
 * ===================================================================== */
.gv-lead-modal:not(.is-open) {
    display: none;
}
.gv-scrollbar {
    display: none;
}