/* =====================================================================
   Catálogo de Propiedades · mismo lenguaje visual que Tasador, Buscar Rol, Simulador y Calificador:
   banda azul con cuadrícula, fondo claro, tarjetas blancas y botones azules.
   Se carga después de styles.css y catalogo.css (que usan !important), por eso se impone aquí también.
   ===================================================================== */
html body.page-catalogo {
  --cv-navy: #0B1B3D; --cv-brand: #1D428A; --cv-blue: #2563EB; --cv-soft: #EFF5FF; --cv-line: #E2E8F0; --cv-ink: #0F172A; --cv-text: #334155; --cv-muted: #64748B;
  background-color: #F3F6FB !important;
  background-image: linear-gradient(rgba(15,23,42,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(15,23,42,.055) 1px, transparent 1px) !important;
  background-size: 44px 44px, 44px 44px !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important; color: var(--cv-ink);
}
html:has(body.page-catalogo) { background: #F3F6FB !important; }
html body.page-catalogo .video-bg-container { display: none !important; }
html body.page-catalogo .cat-footer-bar { display: none !important; }

/* Encabezado cápsula: azul oscuro como en las otras herramientas */
html body.page-catalogo #header-grupocasas { background: #0A1931 !important; }

/* Banda superior (nace en el borde de la página, detrás del encabezado) */
html body.page-catalogo { position: relative !important; }
html body.page-catalogo::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 336px; z-index: 0; pointer-events: none;
  background: radial-gradient(1200px 380px at 85% -10%, rgba(59,130,246,.35), transparent 60%), linear-gradient(160deg, #0B1B3D 0%, #13306B 55%, #1D428A 100%);
}
html body.page-catalogo::after {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 336px; z-index: 0; pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 44px 44px;
  -webkit-mask-image: linear-gradient(to bottom, #000 35%, rgba(0,0,0,.35) 100%); mask-image: linear-gradient(to bottom, #000 35%, rgba(0,0,0,.35) 100%);
}
html body.page-catalogo main { position: relative; z-index: 1; }
html body.page-catalogo #header-grupocasas { z-index: 30 !important; }
html body.page-catalogo .catalogo-page { position: relative; z-index: 1; padding-top: 118px !important; background: transparent !important; }
html body.page-catalogo .cat-hero { background: transparent !important; text-align: center; padding: 0 0 22px !important; }
html body.page-catalogo .cat-hero .vs-badge {
  display: inline-block !important; font: 700 .74rem/1 'Plus Jakarta Sans', sans-serif !important; letter-spacing: .14em !important; text-transform: uppercase !important;
  color: #BFDBFE !important; background: rgba(255,255,255,.08) !important; border: 1px solid rgba(255,255,255,.16) !important; padding: 7px 12px !important; border-radius: 999px !important; margin: 0 0 16px !important; box-shadow: none !important; backdrop-filter: none !important;
}
html body.page-catalogo .cat-page-title { font-family: 'Outfit', sans-serif !important; font-weight: 800 !important; font-size: clamp(1.9rem, 4.2vw, 2.9rem) !important; line-height: 1.1 !important; letter-spacing: -.02em !important; color: #fff !important; margin: 0 0 10px !important; text-shadow: none !important; }
html body.page-catalogo .cat-page-title::after { display: none !important; }
html body.page-catalogo .cat-page-subtitle { font: 500 1.06rem/1.5 'Plus Jakarta Sans', sans-serif !important; color: #CBD5E1 !important; margin: 0 !important; text-shadow: none !important; }

/* Filtros: tarjeta blanca que monta sobre la banda */
html body.page-catalogo .filtros-card {
  background: #fff !important; border: 1px solid #E5EAF2 !important; border-radius: 22px !important; padding: 14px !important; max-width: 920px !important; margin: 0 auto 30px !important;
  box-shadow: 0 30px 60px -28px rgba(11,27,61,.45), 0 2px 6px rgba(11,27,61,.06) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html body.page-catalogo .filtros-form { gap: 12px !important; }
html body.page-catalogo .filtros-form .filtro-field { position: relative; }
html body.page-catalogo .filtros-form .filtro-select-box, html body.page-catalogo .filtros-form .filtro-select {
  height: 54px !important; background: #F8FAFC !important; background-color: #F8FAFC !important; color: var(--cv-ink) !important; border: 1.5px solid #CBD5E1 !important; border-radius: 12px !important;
  font: 700 .96rem 'Plus Jakarta Sans', sans-serif !important; box-shadow: none !important; backdrop-filter: none !important; transition: border-color .15s, box-shadow .15s !important;
}
html body.page-catalogo .filtros-form .filtro-select-box:hover { border-color: #94A3B8 !important; }
html body.page-catalogo .filtros-form .filtro-select-box:focus { background: #fff !important; border-color: var(--cv-brand) !important; box-shadow: 0 0 0 4px rgba(37,99,235,.15) !important; outline: none !important; }
html body.page-catalogo .filtros-form .filtro-select option { color: #0F172A !important; background: #fff !important; }
html body.page-catalogo .filtros-form input::placeholder { color: #64748B !important; font-weight: 600 !important; }
html body.page-catalogo .filtros-form .filtro-icon { color: var(--cv-brand) !important; }
html body.page-catalogo .filtros-form .filtro-icon svg { stroke: currentColor !important; }
html body.page-catalogo .filtros-form a.btn-mapa, html body.page-catalogo .filtros-form .btn-mapa {
  height: 54px !important; border: 0 !important; border-radius: 12px !important; background: linear-gradient(135deg, #1D428A 0%, #2563EB 100%) !important; color: #fff !important;
  font: 800 .98rem 'Outfit', sans-serif !important; letter-spacing: 0 !important; text-transform: none !important; box-shadow: 0 12px 24px -10px rgba(37,99,235,.7) !important; padding: 0 22px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
}
html body.page-catalogo .filtros-form .btn-mapa svg { stroke: #fff !important; }
html body.page-catalogo .filtros-form .btn-mapa span { background: transparent !important; box-shadow: none !important; border: 0 !important; color: #fff !important; padding: 0 !important; }
html body.page-catalogo .custom-autocomplete-list { background: #fff !important; border: 1.5px solid #CBD5E1 !important; border-radius: 12px !important; box-shadow: 0 18px 36px -18px rgba(11,27,61,.5) !important; }
html body.page-catalogo .custom-autocomplete-list li { color: var(--cv-ink) !important; font-weight: 600 !important; }
html body.page-catalogo .custom-autocomplete-list li:hover, html body.page-catalogo .custom-autocomplete-list li.is-active { background: var(--cv-soft) !important; }

/* Tarjetas de propiedades */
html body.page-catalogo .card-vivienda {
  background: #fff !important; border: 1px solid #E5EAF2 !important; border-radius: 20px !important; overflow: hidden !important;
  box-shadow: 0 24px 44px -28px rgba(11,27,61,.4), 0 2px 6px rgba(11,27,61,.05) !important; transition: transform .18s, box-shadow .18s, border-color .18s !important;
}
html body.page-catalogo .card-vivienda:hover { transform: translateY(-4px) !important; border-color: #93C5FD !important; box-shadow: 0 30px 50px -26px rgba(29,66,138,.5), 0 2px 6px rgba(11,27,61,.06) !important; }
html body.page-catalogo .card-vivienda-body { background: #fff !important; color: var(--cv-text) !important; }
html body.page-catalogo .card-vivienda-tag { background: var(--cv-soft) !important; color: var(--cv-brand) !important; border: 1px solid #BFDBFE !important; font: 800 .68rem/1 'Plus Jakarta Sans', sans-serif !important; letter-spacing: .08em !important; border-radius: 8px !important; }
html body.page-catalogo .card-vivienda-tipo { color: var(--cv-muted) !important; font: 700 .72rem 'Plus Jakarta Sans', sans-serif !important; letter-spacing: .06em !important; }
html body.page-catalogo .card-vivienda-nombre { color: var(--cv-navy) !important; font: 800 1.08rem/1.25 'Outfit', sans-serif !important; letter-spacing: -.01em !important; }
html body.page-catalogo .card-vivienda-ubicacion { color: var(--cv-text) !important; font-weight: 600 !important; }
html body.page-catalogo .card-vivienda-ubicacion .check-icon { color: var(--cv-blue) !important; fill: var(--cv-blue) !important; }
html body.page-catalogo .card-vivienda-desde { color: #94A3B8 !important; font: 800 .66rem 'Plus Jakarta Sans', sans-serif !important; letter-spacing: .1em !important; }
html body.page-catalogo .card-vivienda-precio { color: var(--cv-brand) !important; font: 800 1.45rem/1.1 'Outfit', sans-serif !important; letter-spacing: -.01em !important; }
html body.page-catalogo .card-vivienda-detalles { color: var(--cv-text) !important; font-weight: 600 !important; }
html body.page-catalogo .card-vivienda-direccion { color: var(--cv-muted) !important; }
html body.page-catalogo .card-vivienda-estado { color: #15803D !important; font-weight: 800 !important; }
html body.page-catalogo .card-vivienda-share { background: rgba(11,27,61,.72) !important; border: 1px solid rgba(255,255,255,.35) !important; color: #fff !important; }
html body.page-catalogo .cat-empty { background: #fff !important; border: 1.5px dashed #CBD5E1 !important; border-radius: 20px !important; color: var(--cv-text) !important; }
html body.page-catalogo .cat-empty-title { color: var(--cv-navy) !important; font-family: 'Outfit', sans-serif !important; font-weight: 800 !important; }
html body.page-catalogo .cat-empty-text { color: var(--cv-muted) !important; }

/* ---------- Detalle de propiedad ---------- */
html body.page-catalogo .modal-vivienda-overlay { background: rgba(8,18,44,.74) !important; backdrop-filter: blur(8px) !important; }
html body.page-catalogo .modal-vivienda-container {
  background: #fff !important; border: 1px solid #E5EAF2 !important; border-radius: 24px !important; box-shadow: 0 40px 90px -30px rgba(2,12,40,.6) !important; color: var(--cv-text) !important;
}
html body.page-catalogo .modal-vivienda-scroll, html body.page-catalogo .modal-vivienda-body { background: #fff !important; }
html body.page-catalogo .mv-info { background: transparent !important; border-color: var(--cv-line) !important; }
html body.page-catalogo .mv-badge-tipo { background: var(--cv-soft) !important; color: var(--cv-brand) !important; border: 1px solid #BFDBFE !important; font: 800 .7rem 'Plus Jakarta Sans', sans-serif !important; border-radius: 999px !important; }
html body.page-catalogo .mv-nombre { color: var(--cv-navy) !important; font: 800 1.6rem/1.15 'Outfit', sans-serif !important; letter-spacing: -.015em !important; }
html body.page-catalogo .mv-publicado { color: var(--cv-muted) !important; }
html body.page-catalogo .mv-publicado strong, html body.page-catalogo .mv-publicado a, html body.page-catalogo .mv-publicado .mv-pub-name { color: var(--cv-brand) !important; }
html body.page-catalogo .mv-desde { color: #94A3B8 !important; font-weight: 800 !important; letter-spacing: .1em !important; text-transform: uppercase; }
html body.page-catalogo .mv-precio { color: var(--cv-brand) !important; font: 800 2.1rem/1.1 'Outfit', sans-serif !important; letter-spacing: -.02em !important; }
html body.page-catalogo .mv-precio-block, html body.page-catalogo .mv-info-header { border-color: var(--cv-line) !important; }
html body.page-catalogo .mv-btn-close-inner, html body.page-catalogo .mv-btn-compartir { background: #fff !important; border: 1.5px solid #CBD5E1 !important; color: var(--cv-navy) !important; border-radius: 12px !important; }
html body.page-catalogo .mv-btn-close-inner:hover, html body.page-catalogo .mv-btn-compartir:hover { background: var(--cv-soft) !important; border-color: #93C5FD !important; }
html body.page-catalogo .mv-specs > *, html body.page-catalogo .mv-spec { background: var(--cv-soft) !important; border: 1px solid #BFDBFE !important; color: var(--cv-navy) !important; font-weight: 700 !important; border-radius: 999px !important; }
html body.page-catalogo .mv-specs svg { stroke: var(--cv-brand) !important; }
html body.page-catalogo .mv-btn-whatsapp { background: linear-gradient(135deg, #16A34A 0%, #22C55E 100%) !important; color: #fff !important; border: 0 !important; border-radius: 14px !important; font: 800 1rem 'Outfit', sans-serif !important; box-shadow: 0 14px 26px -12px rgba(22,163,74,.7) !important; }
html body.page-catalogo .mv-btn-contactar { background: linear-gradient(135deg, #1D428A 0%, #2563EB 100%) !important; color: #fff !important; border: 0 !important; border-radius: 14px !important; font: 800 1rem 'Outfit', sans-serif !important; box-shadow: 0 14px 26px -12px rgba(37,99,235,.75) !important; }
html body.page-catalogo .mv-section-title, html body.page-catalogo .mv-section-title--accent { color: var(--cv-navy) !important; font: 800 1.12rem/1.2 'Outfit', sans-serif !important; letter-spacing: -.01em !important; border-color: #93C5FD !important; text-transform: none !important; }
html body.page-catalogo .mv-descripcion-section, html body.page-catalogo .mv-zona-section, html body.page-catalogo .mv-detalle-section, html body.page-catalogo .mv-comodidades-section, html body.page-catalogo .mv-caracteristicas-section {
  background: #F8FAFC !important; border: 1px solid var(--cv-line) !important; border-radius: 16px !important; box-shadow: none !important; color: var(--cv-text) !important;
}
html body.page-catalogo .mv-descripcion, html body.page-catalogo .mv-zona-intro, html body.page-catalogo .mv-zona-intro-note, html body.page-catalogo .mv-detalle-grid, html body.page-catalogo .mv-comodidades-list li, html body.page-catalogo .mv-caracteristicas-grid, html body.page-catalogo .mv-zona-list li { color: var(--cv-text) !important; }
html body.page-catalogo .mv-detalle-grid strong, html body.page-catalogo .mv-zona-nombre, html body.page-catalogo .mv-caracteristicas-grid strong { color: var(--cv-navy) !important; }
html body.page-catalogo .mv-zona-distancia, html body.page-catalogo .mv-zona-subtitle { color: var(--cv-muted) !important; }
html body.page-catalogo .mv-zona-tab { background: #fff !important; color: var(--cv-text) !important; border: 1.5px solid #CBD5E1 !important; border-radius: 999px !important; font-weight: 700 !important; }
html body.page-catalogo .mv-zona-tab.is-active { background: var(--cv-brand) !important; color: #fff !important; border-color: var(--cv-brand) !important; }
html body.page-catalogo .mv-galeria-thumbs img, html body.page-catalogo .mv-thumb { border-radius: 10px !important; }
html body.page-catalogo .mv-nav { background: rgba(11,27,61,.72) !important; border: 1px solid rgba(255,255,255,.35) !important; color: #fff !important; }
html body.page-catalogo .mv-mapa-wrap { background: #F8FAFC !important; border: 1px solid var(--cv-line) !important; border-radius: 16px !important; }
html body.page-catalogo #mv-mapa-id-box { background: var(--cv-soft) !important; color: var(--cv-navy) !important; border: 1px solid #BFDBFE; }

/* Panel de contacto del catálogo (formulario) */
html body.page-catalogo .catalogo-contacto-panel-overlay { background: rgba(8,18,44,.74) !important; backdrop-filter: blur(8px) !important; }

/* ---------- Celular ---------- */
@media (max-width: 720px) {
  /* Solo el fondo decorativo del body (sin espacio antes de ::before: con espacio alcanzaba a todos los ::before de la página) */
  html body.page-catalogo::before, html body.page-catalogo::after { height: 330px; }
  html body.page-catalogo .catalogo-page { padding-top: 96px !important; }
  html body.page-catalogo .filtros-card { padding: 12px !important; border-radius: 20px !important; margin-bottom: 22px !important; }
  html body.page-catalogo .mv-nombre { font-size: 1.35rem !important; }
  html body.page-catalogo .mv-precio { font-size: 1.8rem !important; }
}

/* Textos del detalle que heredaban color claro del tema oscuro */
html body.page-catalogo .mv-specs, html body.page-catalogo .mv-specs * { color: var(--cv-navy) !important; }
html body.page-catalogo .mv-specs svg, html body.page-catalogo .mv-specs svg * { stroke: var(--cv-brand) !important; }
html body.page-catalogo .mv-detalle-section, html body.page-catalogo .mv-detalle-section * { color: var(--cv-text) !important; text-shadow: none !important; }
html body.page-catalogo .mv-detalle-section strong, html body.page-catalogo .mv-detalle-section b, html body.page-catalogo .mv-detalle-section .mv-section-title { color: var(--cv-navy) !important; }
html body.page-catalogo .mv-detalle-section svg, html body.page-catalogo .mv-detalle-section svg * { stroke: var(--cv-brand) !important; }
html body.page-catalogo .mv-comodidades-section *, html body.page-catalogo .mv-caracteristicas-section *, html body.page-catalogo .mv-zona-section *, html body.page-catalogo .mv-descripcion-section * { text-shadow: none !important; }
html body.page-catalogo .mv-comodidades-list li, html body.page-catalogo .mv-zona-list li, html body.page-catalogo .mv-zona-list span { color: var(--cv-text) !important; }
html body.page-catalogo .mv-comodidades-list li::marker { color: var(--cv-blue) !important; }
html body.page-catalogo .mv-caracteristicas-section, html body.page-catalogo .mv-caracteristicas-section * { color: var(--cv-text) !important; }
html body.page-catalogo .mv-caracteristicas-section .mv-section-title { color: var(--cv-navy) !important; }
html body.page-catalogo .mv-caracteristicas-grid > * > :last-child, html body.page-catalogo .mv-caracteristicas-grid strong, html body.page-catalogo .mv-caracteristicas-grid b { color: var(--cv-navy) !important; font-weight: 800 !important; }
html body.page-catalogo .mv-caracteristicas-grid > * { border-color: var(--cv-line) !important; }