/* LEXMAR · LISTADO DE VIVIENDAS */

.viviendas-page{
    min-height:100vh;
    margin:0;
    display:flex;
    flex-direction:column;
    background:#fff;
    color:#273444;
    font-family:Arial,Helvetica,sans-serif;
}

.viviendas-main{flex:1;}

.viviendas-container{
    width:min(1180px,calc(100% - 48px));
    margin:0 auto;
}

.viviendas-container--narrow{max-width:860px;}

.viviendas-eyebrow{
    margin:0 0 13px;
    color:#00a4e4;
    font-size:14px;
    line-height:1.4;
    font-weight:700;
    letter-spacing:.16em;
    text-transform:uppercase;
}

/* HERO */
.viviendas-hero{
    padding:105px 24px 70px;
    background:linear-gradient(180deg,#f7f9fb 0%,#ffffff 100%);
    text-align:center;
}

.viviendas-hero h1{
    margin:0;
    color:#273444;
    font-size:clamp(46px,6vw,76px);
    line-height:1;
    letter-spacing:-.045em;
}

.viviendas-hero__text{
    max-width:680px;
    margin:24px auto 0;
    color:#657181;
    font-size:19px;
    line-height:1.65;
}


.viviendas-hero--filtered{
    padding:72px 24px 48px;
}

.viviendas-hero--filtered h1{
    font-size:clamp(38px,5vw,62px);
}

.viviendas-hero--filtered .viviendas-hero__text{
    margin-top:18px;
}

/* FILTROS */
.viviendas-filtros{
    position:relative;
    z-index:3;
    padding:0 24px;
}

.viviendas-filter{
    display:grid;
    grid-template-columns:minmax(135px,.85fr) minmax(180px,1.1fr) minmax(175px,1.1fr) minmax(130px,.8fr) minmax(140px,.85fr) auto;
    align-items:stretch;
    overflow:hidden;
    background:#fff;
    border:1px solid rgba(39,52,68,.08);
    border-radius:18px;
    box-shadow:0 18px 50px rgba(31,45,61,.12);
}

.viviendas-filter__field{
    min-width:0;
    padding:18px 20px;
    border-right:1px solid #eceff2;
}

.viviendas-filter__field label{
    display:block;
    margin:0 0 7px;
    color:#7b8490;
    font-size:12px;
    line-height:1.3;
    font-weight:700;
    letter-spacing:.11em;
    text-transform:uppercase;
}

.viviendas-filter__field select{
    width:100%;
    min-width:0;
    border:0;
    padding:0 24px 0 0;
    background-color:transparent;
    color:#273444;
    font:inherit;
    font-size:14px;
    font-weight:600;
    line-height:1.35;
    outline:none;
    cursor:pointer;
}

.viviendas-filter__field select:disabled{color:#a7adb5;cursor:not-allowed;}

.viviendas-filter__actions{
    display:flex;
    gap:8px;
    align-items:stretch;
    padding:10px;
}

.viviendas-filter__actions button{
    border:0;
    border-radius:11px;
    padding:0 20px;
    background:#00a4e4;
    color:#fff;
    font-size:13px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.04em;
    cursor:pointer;
    transition:background .2s ease,transform .2s ease,box-shadow .2s ease;
}

.viviendas-filter__actions button:hover{
    background:#008fc8;
    transform:translateY(-1px);
    box-shadow:0 8px 22px rgba(0,164,228,.20);
}

.viviendas-filter__actions .viviendas-filter__reset{background:#eef2f5;color:#546273;}
.viviendas-filter__actions .viviendas-filter__reset:hover{background:#e3e8ed;box-shadow:none;}


.viviendas-filter-toggle{
    display:none;
}

/* LISTADO */
.viviendas-listado{padding:82px 24px 105px;}

.viviendas-listado__top{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:30px;
    margin-bottom:34px;
}

.viviendas-listado__top h2{
    margin:0;
    color:#273444;
    font-size:clamp(34px,4vw,48px);
    line-height:1.06;
    letter-spacing:-.035em;
}

.viviendas-listado__count{margin:0 0 5px;color:#7a8491;font-size:18px;}
.viviendas-listado__count strong{color:#273444;}

/* GRID + TARJETAS */
.viviendas-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:28px;
}

.vivienda-card{min-width:0;}
.vivienda-card[hidden]{display:none!important;}

.vivienda-card__link{
    height:100%;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    background:#fff;
    border:1px solid rgba(39,52,68,.08);
    border-radius:20px;
    color:inherit;
    text-decoration:none;
    box-shadow:0 12px 34px rgba(31,45,61,.08);
    transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}

.vivienda-card__link:hover{
    transform:translateY(-6px);
    border-color:rgba(0,164,228,.35);

    box-shadow:
        0 0 35px rgba(0,164,228,.22),
        0 18px 45px rgba(0,164,228,.24);
}

.vivienda-card__image{
    position:relative;
    aspect-ratio:4/3;
    overflow:hidden;
    background:#eef2f5;
}

.vivienda-card__image img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    transition:transform .65s cubic-bezier(.2,.7,.2,1);
}

.vivienda-card__link:hover .vivienda-card__image img{transform:scale(1.045);}

.vivienda-card__body{
    flex:1;
    display:flex;
    flex-direction:column;
    padding:23px 22px 22px;
}

.vivienda-card__location{
    margin:0 0 8px;
    color:#00a4e4;
    font-size:12px;
    line-height:1.4;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.vivienda-card h3{
    margin:0;
    color:#273444;
    font-size:21px;
    line-height:1.25;
    letter-spacing:-.02em;
}

.vivienda-card__price{
    margin:18px 0 0;
    color:#273444;
    font-size:24px;
    line-height:1.2;
    font-weight:800;
}

.vivienda-card__features{
    display:flex;
    flex-wrap:wrap;
    gap:8px 14px;
    margin-top:auto;
    padding-top:18px;
    color:#687585;
    font-size:16px;
    line-height:1.4;
}

.vivienda-card__features span:not(:last-child)::after{
    content:"·";
    margin-left:14px;
    color:#b2bac3;
}

/* ESTADO VACÍO */
.viviendas-empty{
    margin-top:20px;
    padding:52px 24px;
    border:1px dashed #cfd6de;
    border-radius:18px;
    text-align:center;
    background:#f9fafb;
}

.viviendas-empty h3{margin:0;color:#273444;font-size:24px;}
.viviendas-empty p{margin:10px 0 0;color:#6d7887;font-size:15px;}

/* PAGINACIÓN */
.viviendas-pagination{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    margin-top:52px;
}

.viviendas-pagination a{
    width:42px;
    height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid #dde3e8;
    border-radius:10px;
    background:#fff;
    color:#546273;
    font-size:14px;
    font-weight:700;
    text-decoration:none;
    transition:border-color .2s ease,background .2s ease,color .2s ease,transform .2s ease;
}

.viviendas-pagination a:hover,
.viviendas-pagination a.is-active{
    border-color:#00a4e4;
    background:#00a4e4;
    color:#fff;
    transform:translateY(-1px);
    text-decoration:none;
}

/* CTA FINAL */
.viviendas-cta{
    padding:92px 24px;
    background:#f7f9fb;
    text-align:center;
}

.viviendas-cta h2{
    margin:0;
    color:#273444;
    font-size:clamp(34px,4.3vw,52px);
    line-height:1.08;
    letter-spacing:-.035em;
}

.viviendas-cta p:not(.viviendas-eyebrow){
    max-width:650px;
    margin:20px auto 0;
    color:#687585;
    font-size:17px;
    line-height:1.7;
}

.viviendas-cta__button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-top:28px;
    padding:15px 24px;
    border-radius:12px;
    background:#273444;
    color:#fff;
    text-decoration:none;
    font-size:14px;
    font-weight:700;
    transition:background .2s ease,transform .2s ease,box-shadow .2s ease;
}

.viviendas-cta__button:hover{
    background:#00a4e4;
    transform:translateY(-2px);
    box-shadow:0 10px 28px rgba(0,164,228,.20);
}

/* TABLET */
@media(max-width:1050px){
    .viviendas-filter{grid-template-columns:repeat(3,1fr);}
    .viviendas-filter__field{border-bottom:1px solid #eceff2;}
    .viviendas-filter__field:nth-child(3){border-right:0;}
    .viviendas-filter__field:nth-child(4),
    .viviendas-filter__field:nth-child(5){border-bottom:0;}
    .viviendas-filter__actions{min-height:70px;}
    .viviendas-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}

/* MÓVIL */
@media(max-width:760px){
    .viviendas-container{width:100%;}

    .viviendas-page--filtered .viviendas-hero{
        display:none;
    }

    .viviendas-hero{padding:82px 18px 52px;}
    .viviendas-hero h1{font-size:42px;line-height:1.02;}
    .viviendas-hero__text{margin-top:18px;font-size:17px;line-height:1.6;}

    .viviendas-hero--filtered{
        padding:46px 18px 30px;
    }

    .viviendas-hero--filtered h1{
        font-size:34px;
        line-height:1.05;
    }

    .viviendas-hero--filtered .viviendas-hero__text{
        margin-top:12px;
        font-size:15px;
        line-height:1.5;
    }
    .viviendas-filtros{padding:0 14px;}

    .viviendas-page--filtered .viviendas-filtros{
        padding:18px 14px 0;
    }

    .viviendas-filter-toggle{
        width:100%;
        min-height:46px;
        display:flex;
        align-items:center;
        justify-content:center;
        border:1px solid #dce3e8;
        border-radius:12px;
        background:#fff;
        color:#273444;
        font-size:13px;
        font-weight:700;
        text-transform:uppercase;
        letter-spacing:.04em;
        cursor:pointer;
        box-shadow:0 8px 24px rgba(31,45,61,.08);
    }

    .viviendas-filter-toggle::after{
        content:"+";
        margin-left:8px;
        font-size:18px;
        line-height:1;
    }

    .viviendas-filter-toggle[aria-expanded="true"]::after{
        content:"−";
    }

    .viviendas-page--filtered .viviendas-filter--filtered{
        display:none;
        margin-top:10px;
    }

    .viviendas-page--filtered .viviendas-filter--filtered.is-open{
        display:grid;
    }

    .viviendas-filter{grid-template-columns:1fr;border-radius:17px;}
    .viviendas-filter__field{
        padding:13px 17px 12px;
        border-right:0;
        border-bottom:1px solid #eceff2;
    }
    .viviendas-filter__field:nth-child(4),
    .viviendas-filter__field:nth-child(5){border-bottom:1px solid #eceff2;}
    .viviendas-filter__field label{margin-bottom:4px;font-size:11px;}
    .viviendas-filter__actions{min-height:auto;padding:9px;}
    .viviendas-filter__actions button{min-height:48px;flex:1;}
    .viviendas-listado{padding:62px 18px 78px;}

    .viviendas-page--filtered .viviendas-listado{
        padding-top:30px;
    }

    .viviendas-listado__top{display:block;margin-bottom:28px;}

    .viviendas-page--filtered .viviendas-listado__top{
        margin-bottom:20px;
    }

    .viviendas-page--filtered .viviendas-listado__top h2{
        font-size:30px;
        line-height:1.08;
    }

    .viviendas-page--filtered .viviendas-listado__top .viviendas-eyebrow{
        margin-bottom:8px;
        font-size:12px;
        letter-spacing:.12em;
    }
    .viviendas-listado__count{margin-top:12px;}
    .viviendas-grid{grid-template-columns:1fr;gap:22px;}
    .vivienda-card__body{padding:21px 20px 20px;}
    .vivienda-card h3{font-size:20px;}
    .vivienda-card__price{font-size:23px;}
    .viviendas-pagination{margin-top:40px;}
    .viviendas-cta{padding:72px 18px;}
    .viviendas-cta p:not(.viviendas-eyebrow){font-size:16px;}
}

/* ========================================================================== 
   CAMBIO DE VISTA · LISTADO / MAPA
   ========================================================================== */

.viviendas-view-switch-wrap{
    display:flex;
    justify-content:flex-start;
    margin:-10px 0 28px;
}

.viviendas-view-switch{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-height:36px;
    padding:0 12px;
    border:1px solid #d8edf6;
    border-radius:10px;
    background:#f8fcfe;
    color:#00a4e4;
    font-size:13px;
    font-weight:750;
    line-height:1;
    text-decoration:none;
    transition:
        transform .18s ease,
        border-color .18s ease,
        background-color .18s ease,
        box-shadow .18s ease,
        color .18s ease;
}

.viviendas-view-switch:hover,
.viviendas-view-switch:focus,
.viviendas-view-switch:visited{
    text-decoration:none;
}

.viviendas-view-switch:hover{
    transform:translateY(-2px);
    border-color:#00a4e4;
    background:#eef9fd;
    color:#008fc8;
    box-shadow:0 7px 18px rgba(0,164,228,.12);
}

.viviendas-view-switch__icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:18px;
    height:18px;
    flex:0 0 18px;
}

.viviendas-view-switch__icon svg{
    width:17px;
    height:17px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.9;
    stroke-linecap:round;
    stroke-linejoin:round;
}


/* ========================================================================== 
   MAPA DE RESULTADOS
   ========================================================================== */

.viviendas-map-card{
    position:relative;
    overflow:hidden;
    border:1px solid #dce8ee;
    border-radius:20px;
    background:#edf5f8;
    box-shadow:0 18px 52px rgba(15,23,42,.08);
}

.viviendas-map{
    width:100%;
    height:620px;
    background:#edf5f8;
}

.viviendas-map-card .leaflet-container{
    font-family:Arial,Helvetica,sans-serif;
}

.viviendas-map-card .leaflet-control-zoom{
    overflow:hidden;
    margin-top:18px;
    margin-left:18px;
    border:0;
    border-radius:12px;
    box-shadow:0 8px 24px rgba(15,23,42,.13);
}

.viviendas-map-card .leaflet-control-zoom a{
    width:38px;
    height:38px;
    line-height:38px;
    border:0;
    background:rgba(255,255,255,.96);
    color:#111827;
}

.viviendas-map-card .leaflet-control-zoom a:hover{
    background:#eef9fd;
    color:#00a4e4;
}

.viviendas-map-card .leaflet-control-attribution{
    padding:4px 7px;
    border-radius:8px 0 0 0;
    background:rgba(255,255,255,.88);
    color:#667085;
    font-size:10px;
}

.viviendas-map-pin{
    position:relative;
    width:26px;
    height:26px;
    border:4px solid #fff;
    border-radius:50% 50% 50% 0;
    background:#00a4e4;
    box-shadow:0 5px 16px rgba(0,91,128,.28);
    transform:rotate(-45deg);
}

.viviendas-map-pin::after{
    content:"";
    position:absolute;
    top:6px;
    left:6px;
    width:6px;
    height:6px;
    border-radius:50%;
    background:#fff;
}

.viviendas-map-popup{
    width:240px;
}

.viviendas-map-popup__image{
    position:relative;
    width:100%;
    aspect-ratio:4/3;
    overflow:hidden;
    margin-bottom:5px;
    border-radius:10px;
    background:#eef2f5;
}

.viviendas-map-popup__image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.viviendas-map-popup__type{
    position:absolute;
    top:7px;
    right:7px;
    z-index:2;
    display:inline-flex;
    align-items:center;
    min-height:24px;
    padding:0 9px;
    border:1px solid rgba(255,255,255,.72);
    border-radius:999px;
    background:linear-gradient(180deg,#12afea 0%,#0098d6 100%);
    color:#fff;
    box-shadow:
        0 6px 14px rgba(0,164,228,.34),
        0 2px 0 rgba(0,112,158,.18),
        inset 0 1px 0 rgba(255,255,255,.28);
    text-shadow:0 1px 1px rgba(0,78,112,.18);
    font-size:10px;
    line-height:1;
    font-weight:800;
    white-space:nowrap;
}

.viviendas-map-popup__location{
    margin:0 0 2px;
    color:#00a4e4;
    font-size:10px;
    line-height:1.2;
    font-weight:900;
    -webkit-text-stroke:.2px currentColor;
    letter-spacing:.07em;
    text-transform:uppercase;
}

.viviendas-map-popup h3{
    margin:0 0 7px;
    color:#273444;
    font-size:16px;
    line-height:1.12;
}

.viviendas-map-popup__features{
    display:flex;
    flex-wrap:wrap;
    gap:2px 7px;
    margin-top:10px;
    color:#687585;
    font-size:13px;
    line-height:1.2;
    font-weight:600;

}

.viviendas-map-popup__features span:not(:last-child)::after{
    content:"·";
    margin-left:7px;
    color:#b2bac3;
}

.viviendas-map-popup__footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-top:-10px;
}

.viviendas-map-popup__price{
    margin:0;
    color:#273444;
    font-size:17px;
    line-height:1.1;
    font-weight:800;
    white-space:nowrap;
}

.viviendas-map-popup__link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    min-height:30px;
    padding:0 9px;
    border-radius:8px;
    background:#00a4e4;
    color:#fff!important;
    font-size:10px;
    line-height:1;
    font-weight:800;
    text-decoration:none!important;
    white-space:nowrap;
}

.viviendas-map-popup__link:hover{
    background:#008fc8;
}

.viviendas-map-card .leaflet-popup-content-wrapper{
    border-radius:14px;
    box-shadow:0 14px 38px rgba(15,23,42,.18);
}

.viviendas-map-card .leaflet-popup-content{
    margin:9px 9px 0px;
}

.viviendas-map-empty{
    padding:54px 24px;
    border:1px dashed #cfd6de;
    border-radius:18px;
    background:#f9fafb;
    color:#6d7887;
    text-align:center;
    font-size:15px;
}

@media(max-width:760px){
    .viviendas-view-switch-wrap{
        margin:-2px 0 22px;
    }

    .viviendas-view-switch{
        min-height:36px;
        padding:0 11px;
        font-size:12px;
    }

    .viviendas-map-card{
        border-radius:16px;
    }

    .viviendas-map{
        height:520px;
    }

    .viviendas-map-card .leaflet-control-zoom{
        margin-top:12px;
        margin-left:12px;
    }

    .viviendas-map-popup{
        width:205px;
    }

    .viviendas-map-popup__type{
        top:6px;
        right:6px;
        min-height:22px;
        padding:0 7px;
        font-size:9px;
        font-weight:900;
        -webkit-text-stroke:.15px currentColor;
    }

    .viviendas-map-popup h3{
        font-size:15px;
        font-weight:900;
        -webkit-text-stroke:.2px currentColor;
    }

    .viviendas-map-popup__features{
        font-size:12px;
    }

    .viviendas-map-popup__price{
        font-size:20px;
        font-family:Arial,Helvetica,sans-serif;
        font-weight:900;
        letter-spacing:-.02em;
        -webkit-text-stroke:.25px currentColor;
    }

    .viviendas-map-popup__link{
        min-height:32px;
        padding:0 10px;
        font-size:11px;
        font-weight:900;
        -webkit-text-stroke:.15px currentColor;
    }
}