:root {
      --fn-black: #000911; --fn-blue: #004884;
      --fn-mid: #4E83A0;   --fn-gray: #667085;
      --fn-bg: #f5f5f5;    --fn-border: #e5e7eb;
    }
    body { font-family:'Montserrat',sans-serif; -webkit-font-smoothing:antialiased; background:#fff; }
    * { box-sizing:border-box; }
    a { text-decoration:none; color:inherit; }

    /* ── FILTROS BAR ── */
    #filtros-bar {
      position:sticky; top:62px; z-index:40;
      background:#fff; border-bottom:1px solid var(--fn-border);
      padding:0 24px;
      display:flex; align-items:center; gap:8px;
      height:54px; overflow:visible; white-space:nowrap;
      scrollbar-width:none;
    }
    #filtros-bar::-webkit-scrollbar { display:none; }

    /* Operación tabs — grupos de radio buttons en la barra */
    .op-group { display:flex; align-items:center; gap:3px; flex-shrink:0; }
    .op-tab { font-size:12px; font-weight:700; padding:6px 14px; border-radius:50px; border:none; cursor:pointer; transition:all .2s; font-family:'Montserrat',sans-serif; white-space:nowrap; }
    .op-tab.active { background:var(--fn-blue); color:#fff; }
    .op-tab:not(.active) { background:var(--fn-bg); color:var(--fn-gray); }
    .op-tab:not(.active):hover { background:#e5e7eb; }

    .f-sep { width:1px; height:24px; background:var(--fn-border); flex-shrink:0; margin:0 4px; }

    /* Filter buttons (pill dropdowns) */
    .f-btn {
      font-family:'Montserrat',sans-serif; font-size:12px; font-weight:600;
      padding:6px 12px; border-radius:50px;
      border:1.5px solid var(--fn-border); background:#fff; color:var(--fn-black);
      cursor:pointer; display:flex; align-items:center; gap:5px; white-space:nowrap;
      transition:all .2s; flex-shrink:0;
    }
    .f-btn:hover { border-color:var(--fn-blue); color:var(--fn-blue); }
    .f-btn.active { border-color:var(--fn-blue); background:rgba(0,72,132,.08); color:var(--fn-blue); }
    .f-btn svg { width:10px; height:10px; }

    /* Filter dropdown panel */
    .f-drop { position:relative; }
    .f-panel {
      display:none; position:absolute; top:calc(100% + 10px); left:0;
      background:#fff; border-radius:16px; box-shadow:0 12px 40px rgba(0,9,17,.16);
      border:1px solid rgba(0,0,0,.08); z-index:200; min-width:220px; padding:6px 0;
    }
    .f-panel.open { display:block; }
    .f-panel-title { font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--fn-gray); padding:6px 16px 8px; }
    .f-panel-item { display:flex; align-items:center; justify-content:space-between; padding:9px 16px; font-size:13px; font-weight:500; cursor:pointer; transition:background .15s; }
    .f-panel-item:hover { background:#f5f5f5; }
    .f-panel-item label { display:flex; align-items:center; gap:10px; cursor:pointer; }
    .f-panel-item input[type=checkbox], .f-panel-item input[type=radio] { accent-color:var(--fn-blue); width:15px; height:15px; }
    .f-count { font-size:10px; font-weight:700; color:var(--fn-gray); background:#f0f4f7; padding:2px 7px; border-radius:50px; }
    .f-panel-apply { margin:8px 12px 4px; width:calc(100% - 24px); background:var(--fn-blue); color:#fff; border:none; border-radius:10px; padding:8px; font-family:'Montserrat',sans-serif; font-size:12px; font-weight:700; cursor:pointer; transition:background .2s; }
    .f-panel-apply:hover { background:#005ba3; }
    /* Price range */
    .price-inputs { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:8px 16px; }
    .price-inputs input { border:1.5px solid var(--fn-border); border-radius:8px; padding:8px 10px; font-size:12px; font-family:'Montserrat',sans-serif; font-weight:500; outline:none; width:100%; }
    .price-inputs input:focus { border-color:var(--fn-blue); }
    .currency-toggle { display:flex; gap:6px; padding:0 16px 8px; }
    .cur-btn { flex:1; font-size:11px; font-weight:700; padding:6px; border-radius:8px; border:1.5px solid var(--fn-border); background:#fff; cursor:pointer; font-family:'Montserrat',sans-serif; transition:all .2s; }
    .cur-btn.active { border-color:var(--fn-blue); color:var(--fn-blue); background:rgba(0,72,132,.07); }

    /* Más filtros btn */
    .mas-filtros-btn { margin-left:auto; font-family:'Montserrat',sans-serif; font-size:12px; font-weight:700; padding:6px 14px; border-radius:50px; border:1.5px solid var(--fn-black); background:#fff; color:var(--fn-black); cursor:pointer; display:flex; align-items:center; gap:6px; transition:all .2s; flex-shrink:0; }
    .mas-filtros-btn:hover { background:var(--fn-black); color:#fff; }

    /* ── MAIN LAYOUT (resultados | divisor | mapa) — fijo; solo #results-col scrollea ── */
    html, body.buscador-page { height:100%; }
    body.buscador-page { overflow:hidden; }   /* el scroll vive dentro de #results-col */

    #main-layout {
      display:flex;
      height:calc(100vh - 114px); /* viewport - navbar(60) - filtros(54) */
      background:var(--fn-bg);
    }
    @media(max-width:1024px) {
      #main-layout { display:block; height:auto; }
      /* Tabs Lista/Mapa: por defecto se ve la lista; el mapa, oculto.
         height:auto anula el "#map-col{height:100%}" global, que en el overlay daba 0. */
      #map-col { display:none; height:auto; }
      #results-col { display:block; padding-bottom:74px; } /* aire para el bottom nav */
      #main-layout.show-map #results-col { display:none; }
      /* Al activar "Mapa": overlay fijo entre barra(114) y bottom nav(58).
         !important para ganar cualquier override; reset de transform/opacity por si GSAP dejó residuo. */
      #main-layout.show-map #map-col {
        display:block !important; position:fixed !important;
        top:114px; left:0; right:0; bottom:58px; height:auto !important; z-index:90;
        transform:none !important; translate:none !important; opacity:1 !important;
      }
      /* Leaflet pone position:relative INLINE al contenedor → necesitamos !important para ganarle
         y que el #map se estire al overlay (si no, queda altura 0 → mapa en blanco). */
      #main-layout.show-map #map {
        position:absolute !important; top:0 !important; right:0 !important; bottom:0 !important; left:0 !important;
        width:auto !important; height:auto !important;
      }
    }

    /* ── RESULTS COLUMN ── */
    #results-col { flex:0 0 60%; min-width:340px; overflow-y:auto; padding:0 24px; }
    #results-col::-webkit-scrollbar { width:4px; }
    #results-col::-webkit-scrollbar-thumb { background:#d1d5db; border-radius:2px; }

    /* Sticky: el contador + las vistas quedan fijos arriba al scrollear.
       Negativos = padding del #results-col (20px 24px) → fondo full-bleed que tapa las cards. */
    .results-header { position:sticky; top:0; z-index:20; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; background:#fff; margin:0 -24px 12px; padding:16px 24px 12px; border-bottom:1px solid var(--fn-border); }
    .results-count { font-size:13px; color:var(--fn-gray); font-weight:500; }
    .results-count strong { color:var(--fn-black); font-weight:700; }
    .sort-select { font-family:'Montserrat',sans-serif; font-size:12px; font-weight:600; border:1.5px solid var(--fn-border); border-radius:8px; padding:6px 28px 6px 10px; outline:none; color:var(--fn-black); background:#fff; appearance:none; cursor:pointer; }
    .view-toggle { display:flex; border:1.5px solid var(--fn-border); border-radius:8px; overflow:hidden; }
    .view-btn { background:#fff; border:none; cursor:pointer; padding:6px 10px; color:var(--fn-gray); transition:all .2s; }
    .view-btn.active { background:var(--fn-black); color:#fff; }

    /* Ordenar */
    .orden-drop { position:relative; }
    .orden-btn { display:inline-flex; align-items:center; gap:6px; background:#fff; border:1.5px solid var(--fn-border); border-radius:50px; padding:6px 12px; font-family:'Montserrat',sans-serif; font-size:12px; font-weight:600; color:var(--fn-black); cursor:pointer; white-space:nowrap; transition:border .2s; }
    .orden-btn:hover { border-color:var(--fn-blue); }
    .orden-panel { display:none; position:absolute; top:calc(100% + 8px); right:0; background:#fff; border-radius:14px; box-shadow:0 12px 40px rgba(0,9,17,.16); border:1px solid rgba(0,0,0,.07); z-index:200; min-width:180px; padding:6px 0; }
    .orden-panel.open { display:block; }
    .orden-item { padding:10px 18px; font-size:13px; font-weight:500; color:var(--fn-black); cursor:pointer; transition:background .15s; white-space:nowrap; }
    .orden-item:hover { background:#f5f5f5; }
    .orden-item.active { color:var(--fn-blue); font-weight:700; }

    /* ── FCARD (mismo diseño premium que la home) ── */
    /* El grid acomoda solo cuántas columnas entran y se reajusta al arrastrar el divisor del mapa. */
    .pc-wrap { display:grid; grid-template-columns:repeat(auto-fill, minmax(330px, 1fr)); gap:16px; }
    @media(max-width:640px) { .pc-wrap { grid-template-columns:minmax(0,1fr); } }  /* min 0 → no desborda por el contenido nowrap */

    @keyframes fenoCardIn { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } }
    #cards-grid { transition: opacity .15s ease; }
    .fcard { display:block; background:#fff; border-radius:18px; padding:10px; box-shadow:0 4px 20px rgba(0,9,17,.08); transition:transform .3s, box-shadow .3s, background .3s; cursor:pointer; animation:fenoCardIn .2s ease; }
    .fcard:hover { transform:translateY(-4px); box-shadow:0 14px 36px rgba(0,9,17,.14); background:#f5f6f8; }
    .fcard.highlighted { background:rgba(0,72,132,.06); box-shadow:0 0 0 3px rgba(0,72,132,.25), 0 8px 28px rgba(0,72,132,.16); }
    .fcard-img { position:relative; aspect-ratio:16/10; overflow:hidden; border-radius:13px; }
    .fcard-img img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }
    .fcard:hover .fcard-img img { transform:scale(1.05); }
    .fcard-badges { position:absolute; top:12px; left:12px; display:flex; gap:5px; flex-wrap:wrap; z-index:2; }
    .fcard-badge { font-size:11px; font-weight:700; padding:5px 12px; border-radius:50px; background:var(--fn-blue); color:#fff; white-space:nowrap; }
    .fcard-badge.alq  { background:var(--fn-black); }
    .fcard-badge.dev  { background:#d28100; }
    .fcard-badge.unid { background:rgba(0,9,17,.72); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
    .fcard-fav { position:absolute; top:10px; right:10px; width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.22); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.45); display:flex; align-items:center; justify-content:center; cursor:pointer; color:#fff; transition:all .2s; padding:0; z-index:2; }
    .fcard-fav:hover { background:#fff; color:#ff1962; }
    .fcard-fav.fav-on { color:#ff1962; }
    .fcard-fav.fav-on svg { fill:#ff1962; }
    .fcard-fav svg { width:18px; height:18px; }
    /* Botón Ver Video (mismo comportamiento de 2 etapas que la home) */
    .fcard-video { position:absolute; bottom:12px; left:12px; z-index:3; display:flex; align-items:center; height:40px; padding:0 8px; background:rgba(255,255,255,.92); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border:none; border-radius:50px; color:var(--fn-blue); cursor:pointer; box-shadow:0 4px 14px rgba(0,9,17,.18); transition:background .3s, color .3s, padding .3s; }
    .fcard-video svg { width:24px; height:24px; flex-shrink:0; }
    .fcard-video .fv-text { font-size:12px; font-weight:700; max-width:0; overflow:hidden; white-space:nowrap; margin-left:0; transition:max-width .3s ease, margin-left .3s ease; }
    .fcard:hover .fcard-video { background:var(--fn-blue); color:#fff; }
    .fcard-video:hover .fv-text { max-width:90px; margin-left:7px; }

    /* Toggle "Solo favoritos" en la barra de filtros */
    .fav-toggle {
      display:inline-flex; align-items:center; gap:6px; flex-shrink:0;
      background:#fff; border:1.5px solid var(--fn-border); border-radius:50px;
      padding:6px 12px; font-family:'Montserrat',sans-serif; font-size:12px; font-weight:700;
      color:var(--fn-black); cursor:pointer; transition:all .2s; white-space:nowrap;
    }
    .fav-toggle:hover { border-color:#ff1962; color:#ff1962; }
    .fav-toggle.active { background:#ff1962; border-color:#ff1962; color:#fff; }
    .fav-toggle svg { width:14px; height:14px; flex-shrink:0; }
    .fav-toggle.active svg { fill:#fff; }
    .fav-count { font-size:10px; font-weight:700; background:rgba(0,0,0,.08); padding:1px 6px; border-radius:50px; }
    .fav-toggle.active .fav-count { background:rgba(255,255,255,.25); }
    .fcard-body { padding:14px 0 2px; }
    .fcard-row { display:flex; align-items:flex-end; justify-content:space-between; gap:10px; margin-bottom:6px; }
    .fcard-loc { display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:600; color:var(--fn-gray); min-width:0; }
    .fcard-loc svg { width:13px; height:13px; flex-shrink:0; color:var(--fn-blue); }
    .fcard-loc span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .fcard-price { font-size:21px; font-weight:800; color:var(--fn-blue); white-space:nowrap; line-height:1.1; }
    .fcard-title { font-size:15.5px; font-weight:700; color:var(--fn-black); margin-bottom:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .fcard-chips { display:flex; gap:7px; flex-wrap:wrap; }
    .fchip { display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:600; color:var(--fn-black); border:1.5px solid #e5e7eb; border-radius:50px; padding:5px 11px; white-space:nowrap; }
    .fchip svg { width:13px; height:13px; color:var(--fn-gray); flex-shrink:0; }

    /* Tags: sobre la imagen en grilla; después del precio en lista */
    .fcard-badges-body { display:none; }

    /* ── VISTA LISTA ── */
    .pc-wrap.list-view { grid-template-columns:minmax(0,1fr); }
    .pc-wrap.list-view .fcard { display:flex; align-items:flex-start; gap:15px; }
    /* Imagen SIEMPRE 16:9 con alto fijo → todas las cards de la lista quedan iguales */
    .pc-wrap.list-view .fcard-img { width:260px; flex-shrink:0; aspect-ratio:16/9; }
    .pc-wrap.list-view .fcard-body { flex:1; min-width:0; padding:4px 0; }
    /* En lista el badge va después del precio (la imagen es chica) */
    .pc-wrap.list-view .fcard-badges-img { display:none; }
    .pc-wrap.list-view .fcard-badges-body { display:flex; position:static; gap:5px; flex-wrap:wrap; margin:8px 0 2px; }
    /* En mobile la lista es una fila compacta de verdad (imagen chica a la izquierda) */
    @media(max-width:640px) {
      .pc-wrap.list-view .fcard { gap:12px; padding:12px; }
      .pc-wrap.list-view .fcard-img { width:124px; }
      .fcard-title { white-space:normal; }
    }

    /* ── MODAL DE VIDEO ── */
    .fv-modal { position:fixed; inset:0; z-index:3000; background:rgba(0,9,17,.85); display:none; align-items:center; justify-content:center; padding:20px; }
    .fv-modal.open { display:flex; }
    .fv-modal-inner { position:relative; width:100%; max-width:900px; }
    .fv-modal-frame { position:relative; width:100%; aspect-ratio:16/9; border-radius:14px; overflow:hidden; background:#000; box-shadow:0 24px 70px rgba(0,0,0,.5); }
    .fv-modal-frame iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
    .fv-modal-close { position:absolute; top:-44px; right:0; width:36px; height:36px; border-radius:50%; border:none; background:rgba(255,255,255,.15); color:#fff; font-size:22px; line-height:1; cursor:pointer; transition:background .2s; }
    .fv-modal-close:hover { background:rgba(255,255,255,.3); }

    /* ── MAP COLUMN ── */
    /* z-index:1 aísla las capas internas de Leaflet (tiles/markers, z-index 200-700)
       para que no tapen los dropdowns de filtros (#filtros-bar, z-index:40). */
    #map-col { flex:1 1 auto; min-width:280px; height:100%; position:relative; z-index:1; }
    #map { width:100%; height:100%; }

    /* ── DIBUJAR ZONA ── */
    .zona-controls { position:absolute; top:12px; right:12px; z-index:500; display:flex; flex-direction:column; gap:8px; align-items:flex-end; }
    .zona-btn {
      background:#fff; border:1.5px solid var(--fn-border); border-radius:50px;
      padding:8px 14px; font-family:'Montserrat',sans-serif; font-size:12px; font-weight:700;
      color:var(--fn-black); cursor:pointer; display:inline-flex; align-items:center; gap:6px;
      box-shadow:0 2px 10px rgba(0,0,0,.15); transition:all .2s; white-space:nowrap;
    }
    .zona-btn:hover { border-color:var(--fn-blue); color:var(--fn-blue); }
    .zona-btn.dibujando { background:var(--fn-blue); color:#fff; border-color:var(--fn-blue); }
    .zona-btn-clear { color:#cf222e; border-color:#f0c9c9; }
    .zona-btn svg { width:13px; height:13px; flex-shrink:0; }

    /* Custom Leaflet marker */
    .leaflet-div-icon.feno-pin-icon { background:transparent; border:none; }
    .fn-pin {
      display:inline-block; position:absolute; left:0; bottom:0;
      transform:translate(-50%, -6px);
      background:var(--fn-black); color:#fff;
      font-family:'Montserrat',sans-serif; font-size:11px; font-weight:700;
      padding:4px 10px; border-radius:50px;
      box-shadow:0 2px 8px rgba(0,0,0,.3);
      white-space:nowrap; cursor:pointer;
      transition:background .2s;
    }
    .fn-pin-dev { background:var(--fn-blue); }   /* emprendimientos en azul */
    .fn-pin.hover { background:var(--fn-blue); }
    .fn-pin::after { content:''; position:absolute; bottom:-5px; left:50%; transform:translateX(-50%); border:5px solid transparent; border-top-color:var(--fn-black); border-bottom:none; }
    .fn-pin-dev::after { border-top-color:var(--fn-blue); }   /* flecha azul a juego con el pin de desarrollo */
    .fn-pin.hover::after { border-top-color:var(--fn-blue); }
    /* Pin seleccionado (popup abierto) → azul oscuro para distinguir del estado hover */
    .fn-pin.open { background:var(--fn-blue); }
    .fn-pin.open::after { border-top-color:var(--fn-blue); }
    .fn-pin-dev.open { background:#002d5a; }
    .fn-pin-dev.open::after { border-top-color:#002d5a; }

    /* Map popup */
    .leaflet-popup-content-wrapper { border-radius:14px !important; box-shadow:0 8px 32px rgba(0,0,0,.18) !important; padding:0 !important; overflow:hidden; }
    .leaflet-popup-content { margin:0 !important; width:200px !important; }
    .map-popup img { width:100%; height:120px; object-fit:cover; }
    .map-popup-body { padding:10px 12px; }
    .map-popup-price { font-size:15px; font-weight:700; color:var(--fn-blue); }
    .map-popup-addr { font-size:11px; color:var(--fn-black); font-weight:600; margin-top:2px; }
    .map-popup-link { display:block; margin-top:8px; text-align:center; background:var(--fn-blue); color:#fff !important; font-size:11px; font-weight:700; padding:7px; border-radius:8px; font-family:'Montserrat',sans-serif; }

    /* Bottom nav mobile: tabs Lista / Mapa (estilo Fenoglio) */
    .fn-bottom-nav { display:none; }
    @media(max-width:1024px) {
      .fn-bottom-nav {
        display:flex; position:fixed; bottom:0; left:0; right:0; z-index:1000;
        height:58px; background:var(--fn-black); box-shadow:0 -2px 12px rgba(0,0,0,.35);
      }
      .fn-bn-tab {
        flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
        background:none; border:none; cursor:pointer;
        color:rgba(255,255,255,.5); font-family:'Montserrat',sans-serif; font-size:11px; font-weight:600;
        transition:color .2s;
      }
      .fn-bn-tab.active { color:#fff; }
      .fn-bn-tab.active svg { color:var(--fn-mid); }
    }

    /* ── MODAL MÁS FILTROS (Airbnb style) ── */
    #modal-overlay {
      display:none; position:fixed; inset:0; z-index:1100; /* por encima del bottom nav (1000) */
      background:rgba(0,9,17,.55); backdrop-filter:blur(4px);
    }
    #modal-overlay.open { display:flex; align-items:center; justify-content:center; }
    #modal-box {
      background:#fff; border-radius:20px; width:min(740px, calc(100vw - 32px));
      max-height:90vh; display:flex; flex-direction:column;
      box-shadow:0 24px 64px rgba(0,0,0,.25); overflow:hidden;
    }
    .modal-header { padding:18px 24px; border-bottom:1px solid var(--fn-border); display:flex; align-items:center; justify-content:space-between; flex-shrink:0; }
    .modal-header h3 { font-size:15px; font-weight:700; }
    .modal-count-lbl { font-size:12px; font-weight:500; color:var(--fn-gray); margin-left:8px; }
    .modal-count-lbl b { color:var(--fn-blue); font-weight:700; }
    .modal-close { background:none; border:none; cursor:pointer; width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; transition:background .2s; color:var(--fn-black); }
    .modal-close:hover { background:#f0f4f7; }
    .modal-body { overflow-y:auto; padding:24px; flex:1; }
    .modal-body::-webkit-scrollbar { width:4px; }
    .modal-body::-webkit-scrollbar-thumb { background:#d1d5db; border-radius:2px; }
    .modal-section { margin-bottom:28px; padding-bottom:28px; border-bottom:1px solid var(--fn-border); }
    .modal-section:last-child { border-bottom:none; margin-bottom:0; }
    .modal-section-title { font-size:14px; font-weight:700; margin-bottom:16px; }

    /* Tipo de propiedad — pill grid */
    .tipo-grid { display:flex; flex-wrap:wrap; gap:8px; }
    .tipo-btn { font-family:'Montserrat',sans-serif; font-size:12px; font-weight:600; padding:9px 18px; border-radius:50px; border:1.5px solid var(--fn-border); background:#fff; cursor:pointer; transition:all .2s; }
    .tipo-btn:hover { border-color:var(--fn-black); }
    .tipo-btn.active { border-color:var(--fn-black); background:var(--fn-black); color:#fff; }

    /* Precio — histograma */
    .histogram { display:flex; align-items:flex-end; gap:2px; height:64px; margin-bottom:16px; padding:0 4px; }
    .h-bar { flex:1; border-radius:2px 2px 0 0; background:#e5e7eb; transition:background .2s, height .4s ease; }
    .h-bar.in-range { background:var(--fn-black); }
    .price-range-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:8px; }
    .price-range-row .pr-field label { font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--fn-gray); display:block; margin-bottom:5px; }
    .price-range-row .pr-field input { width:100%; border:1.5px solid var(--fn-border); border-radius:10px; padding:10px 12px; font-size:13px; font-family:'Montserrat',sans-serif; font-weight:600; outline:none; transition:border .2s; }
    .price-range-row .pr-field input:focus { border-color:var(--fn-blue); }
    .currency-row { display:flex; gap:8px; margin-top:8px; }
    .cur-opt { flex:1; font-family:'Montserrat',sans-serif; font-size:12px; font-weight:700; padding:8px; border-radius:10px; border:1.5px solid var(--fn-border); background:#fff; cursor:pointer; transition:all .2s; text-align:center; }
    .cur-opt.active { border-color:var(--fn-blue); color:var(--fn-blue); background:rgba(0,72,132,.07); }

    /* Dormitorios — number pills */
    .dorm-row { display:flex; gap:8px; flex-wrap:wrap; }
    .dorm-btn { font-family:'Montserrat',sans-serif; font-size:13px; font-weight:600; min-width:46px; padding:0 16px; height:42px; border-radius:50px; border:1.5px solid var(--fn-border); background:#fff; cursor:pointer; transition:all .2s; }
    .dorm-btn:hover { border-color:var(--fn-black); }
    .dorm-btn.active { border-color:var(--fn-black); background:var(--fn-black); color:#fff; }

    /* Superficie */
    .sup-inputs { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
    .sup-inputs input { border:1.5px solid var(--fn-border); border-radius:10px; padding:10px 12px; font-size:13px; font-family:'Montserrat',sans-serif; font-weight:500; outline:none; transition:border .2s; width:100%; }
    .sup-inputs input:focus { border-color:var(--fn-blue); }

    /* Características — checkbox grid */
    .carac-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
    @media(max-width:640px) { .carac-grid { grid-template-columns:repeat(2,1fr); } }
    .carac-item { display:flex; align-items:center; gap:10px; font-size:13px; font-weight:500; cursor:pointer; padding:10px 12px; border:1.5px solid var(--fn-border); border-radius:10px; transition:all .2s; }
    .carac-item:hover { border-color:var(--fn-black); }
    .carac-item.active { border-color:var(--fn-blue); background:rgba(0,72,132,.06); color:var(--fn-blue); }
    .carac-item input { display:none; }
    .carac-icon { font-size:16px; }

    /* Modal footer */
    .modal-footer { padding:16px 24px; border-top:1px solid var(--fn-border); display:flex; align-items:center; justify-content:space-between; flex-shrink:0; }
    .modal-clear { background:none; border:none; font-family:'Montserrat',sans-serif; font-size:13px; font-weight:700; cursor:pointer; color:var(--fn-black); text-decoration:underline; transition:opacity .2s; }
    .modal-clear:hover { opacity:.6; }
    .modal-apply { background:var(--fn-blue); color:#fff; border:none; border-radius:10px; padding:12px 28px; font-family:'Montserrat',sans-serif; font-size:13px; font-weight:700; cursor:pointer; transition:background .2s; }
    .modal-apply:hover { background:#005ba3; }
    #result-count-badge { background:var(--fn-black); color:#fff; font-size:11px; font-weight:700; padding:2px 8px; border-radius:50px; margin-left:6px; }
/* ── Buscador predictivo (dropdown de sugerencias con imagen) ── */
.buscador-sugerencias {
  display:none; position:absolute; top:calc(100% + 8px); left:0;
  min-width:520px; max-width:600px;
  background:#fff; border-radius:14px; box-shadow:0 12px 40px rgba(0,9,17,.18);
  z-index:300; overflow:hidden; max-height:420px; overflow-y:auto;
}
.sug-item { display:flex; align-items:center; gap:12px; padding:9px 14px; cursor:pointer; transition:background .12s; }
.sug-item:hover { background:#f5f5f5; }
.sug-img { width:58px; height:44px; border-radius:8px; background:#eef0f2 center/cover no-repeat; flex-shrink:0; }
.sug-ico { width:58px; height:44px; border-radius:8px; background:#f0f4f7; display:flex; align-items:center; justify-content:center; font-size:18px; flex-shrink:0; }
.sug-txt { flex:1; min-width:0; }
.sug-title { font-size:13px; font-weight:600; color:var(--fn-black); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sug-sub { font-size:11px; color:var(--fn-gray); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sug-precio { font-size:13px; font-weight:700; color:var(--fn-blue); flex-shrink:0; white-space:nowrap; }
.sug-item mark { background:#fde68a; color:inherit; padding:0 1px; border-radius:2px; }

/* ── Modal Más filtros: superficies x3 + iconos SVG ── */
.sup-group { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.sup-lbl { font-size:12px; font-weight:600; color:var(--fn-gray); width:72px; flex-shrink:0; }
.sup-group .sup-inputs { flex:1; display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:0; padding:0; }
.carac-icon svg { width:16px; height:16px; display:inline-block; vertical-align:middle; }

/* ── Servicios/Amenities: contador, colapsado a 2 filas, ver más ── */
.carac-grid.colapsado { max-height:104px; overflow:hidden; }
.carac-item .carac-nom { flex:1; }

/* Iconos de servicios y adicionales — OCULTOS temporalmente (no se usan por ahora).
   Se reactivan borrando (o comentando) esta única regla. */
#modal-servicios .carac-icon, #modal-adicionales .carac-icon { display:none; }
.carac-count { font-size:10px; font-weight:700; color:var(--fn-gray); background:#f0f4f7; padding:1px 7px; border-radius:50px; }

/* Numeritos de cantidad por opción en los dropdowns del buscador — DESACTIVADOS temporalmente.
   Se reactivan más adelante: borrar (o comentar) esta única regla. */
.f-count, .carac-count { display:none; }
.carac-vermas { display:block; margin:10px auto 0; background:none; border:none; color:var(--fn-blue); font-family:'Montserrat',sans-serif; font-size:12px; font-weight:700; cursor:pointer; text-decoration:underline; }
.carac-vermas:hover { opacity:.7; }

/* ── Slider de precio (dos manijas sobre el histograma, estilo Airbnb) ── */
.hist-slider { position:relative; height:24px; margin:30px 8px 8px; }  /* margen sup. para que las etiquetas de precio no peguen con las barras */
.hist-track { position:absolute; top:50%; left:0; right:0; height:3px; transform:translateY(-50%); background:#e2e6ea; border-radius:3px; }
.hist-range { position:absolute; top:50%; height:3px; transform:translateY(-50%); background:var(--fn-blue); border-radius:3px; left:0; width:100%; }
.hist-handle { position:absolute; top:50%; width:20px; height:20px; transform:translate(-50%,-50%); background:#fff; border:2px solid var(--fn-blue); border-radius:50%; cursor:grab; box-shadow:0 1px 5px rgba(0,0,0,.25); touch-action:none; z-index:2; }
.hist-handle:active, .hist-handle:focus { cursor:grabbing; outline:none; border-color:#005ba3; }
#hist-min { left:0; }
#hist-max { left:100%; }
/* Etiqueta de precio de corte arriba de cada manija */
.hist-tip { position:absolute; bottom:calc(100% + 3px); transform:translateX(-50%); white-space:nowrap; font-size:11px; font-weight:700; color:var(--fn-black); pointer-events:none; }

/* ── Ajustes modal (feedback Mariano 13/6) ── */
.dorm-row { flex-wrap:wrap; }
.dorm-btn { white-space:nowrap; }                 /* textos en una sola línea (Antigüedad) */
@media (min-width:1025px) { .modal-section.solo-movil { display:none; } }  /* ocultar en escritorio (están en la barra) */
/* Grupos Operación/Publicación/Estado dentro del modal (mobile): pills que se acomodan en filas */
.op-group-modal { display:flex; flex-wrap:wrap; gap:8px; }
.op-group-modal .op-tab { font-size:13px; padding:9px 16px; }
.badge-unidades { background:#000911 !important; }  /* badge "X unidades" en cards de desarrollo */


/* Modal de búsqueda (mobile): pantalla completa, input arriba + sugerencias en lista */
/* z-index por encima del navbar sticky de Bootstrap (1020) para que el buscador
   ocupe toda la pantalla y no lo tape el menú. */
#search-modal { display:none; position:fixed; inset:0; z-index:1100; background:#fff; flex-direction:column; }
#search-modal.open { display:flex; }
.search-modal-head { display:flex; align-items:center; gap:8px; padding:12px 14px; border-bottom:1px solid var(--fn-border); flex-shrink:0; }
.search-modal-head .sm-back { background:none; border:none; cursor:pointer; padding:6px; color:var(--fn-black); flex-shrink:0; display:flex; }
.search-modal-pill { flex:1; display:flex; align-items:center; gap:8px; background:#f5f5f5; border-radius:50px; padding:11px 16px; min-width:0; }
.search-modal-pill input { flex:1; background:transparent; border:none; outline:none; font-family:'Montserrat',sans-serif; font-size:14px; color:var(--fn-black); min-width:0; }
.search-modal-sug { flex:1; overflow-y:auto; }
.search-modal-sug .sug-item { border-bottom:1px solid #f0f4f7; padding:12px 16px; }

/* ═══════════════════════ RESPONSIVE MOBILE (≤768px) ═══════════════════════
   En el celu la barra de filtros se simplifica (operación + botón Filtros) y
   TODO el filtrado vive en el modal. La ubicación se busca desde el predictivo
   del navbar. El mapa se oculta y se accede con el botón flotante "Ver mapa". */
@media (max-width:768px) {

  /* Scroll natural de la página + anti-desborde horizontal */
  html { overflow-x:hidden; }
  body.buscador-page { overflow:visible; height:auto; }
  #main-layout { display:block; height:auto; }
  #results-col { display:block; width:100%; min-width:0; height:auto; overflow:visible; padding:0 16px; }
  /* Sticky relativo al viewport, debajo de navbar(62)+barra(54) */
  .results-header { top:116px; margin:0 -16px 10px; padding:14px 16px 10px; flex-wrap:nowrap; }
  /* En mobile: "290 propiedades" (sin la ciudad) para que entre en una sola línea con el organizador */
  .rc-ciudad { display:none; }
  .results-count { white-space:nowrap; }

  /* Barra de filtros: solo operación + botón Filtros (el resto vive en el modal) */
  #filtros-bar { padding:0 14px; gap:6px; overflow-x:auto; }
  /* En mobile la barra deja solo Venta/Alquiler + ♥ + "Más filtros"; el resto va al modal. */
  #filtros-bar .f-drop, #filtros-bar .f-sep,
  #op-tipo-inv, #op-estado-obra { display:none; }
  #filtros-bar .mas-filtros-btn { margin-left:auto; }
  .fav-toggle-lbl { display:none; } /* en mobile, solo el corazón + contador */
  .fav-toggle { padding:6px 10px; }
  .op-tab { padding:6px 13px; font-size:11px; flex-shrink:0; }
  .mas-filtros-btn { flex-shrink:0; }

  /* Modal a pantalla completa */
  #modal-overlay.open { align-items:stretch; }
  #modal-box { width:100vw !important; max-width:100vw; max-height:none; height:100dvh; border-radius:0; }
  .modal-body { padding:20px 18px; }
  .modal-section { margin-bottom:22px; padding-bottom:22px; }
}
