/* ==========================================================================
   Comercio Inmobiliario — inmuebles.css (catálogo y ficha, versión funcional)
   ========================================================================== */

/* Catálogo ------------------------------------------------------------------ */
.ci-catalogo-hero { padding-block: var(--ci-sp-6) var(--ci-sp-5); background: var(--ci-gray-50); }
.ci-catalogo-hero .ci-title-xl { margin-bottom: var(--ci-sp-4); }
.ci-catalogo { padding-top: var(--ci-sp-6); }
.ci-catalogo__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--ci-sp-3); margin-bottom: var(--ci-sp-5); }
.ci-catalogo__count { margin: 0; font-weight: 500; color: var(--ci-navy); }
.ci-catalogo__order { display: flex; align-items: center; gap: var(--ci-sp-2); font-size: var(--ci-fs-sm); }
.ci-catalogo__order select { min-height: 40px; padding: var(--ci-sp-1) var(--ci-sp-3); border: 1px solid var(--ci-border); border-radius: var(--ci-radius-sm); font: inherit; color: var(--ci-navy); background: var(--ci-white); }

.ci-pagination { margin-top: var(--ci-sp-7); }
.ci-pagination ul { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--ci-sp-2); margin: 0; padding: 0; list-style: none; }
.ci-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 var(--ci-sp-3); border-radius: var(--ci-radius-pill); border: 1px solid var(--ci-border); color: var(--ci-navy); font-weight: 500; }
.ci-pagination .page-numbers.current { background: var(--ci-navy); border-color: var(--ci-navy); color: var(--ci-white); }
.ci-pagination a.page-numbers:hover { background: var(--ci-accent); border-color: var(--ci-accent); color: var(--ci-navy); }

/* Ficha --------------------------------------------------------------------- */
.ci-ficha-inmueble { padding-block: var(--ci-sp-5) var(--ci-sp-8); }
.ci-breadcrumb { margin-bottom: var(--ci-sp-4); font-size: var(--ci-fs-sm); color: var(--ci-text-muted); }
.ci-ficha__head { display: grid; gap: var(--ci-sp-4); margin-bottom: var(--ci-sp-5); }
@media (min-width: 900px) { .ci-ficha__head { grid-template-columns: 1fr auto; align-items: end; } }
.ci-ficha__title { margin: var(--ci-sp-2) 0 var(--ci-sp-1); font-size: var(--ci-fs-2xl); font-weight: 500; }
.ci-ficha__location { display: flex; align-items: center; gap: var(--ci-sp-1); margin: 0; color: var(--ci-text); }
.ci-ficha__price-box { display: grid; gap: var(--ci-sp-1); text-align: right; }
.ci-ficha__price { font-size: var(--ci-fs-2xl); font-weight: 500; line-height: 1; color: var(--ci-navy); }
.ci-ficha__admin, .ci-ficha__code { font-size: var(--ci-fs-sm); color: var(--ci-text-muted); }

.ci-gallery { display: grid; gap: var(--ci-sp-3); margin-bottom: var(--ci-sp-6); }
.ci-gallery__main { border-radius: var(--ci-radius-lg); overflow: hidden; background: var(--ci-gray-100); aspect-ratio: 16 / 9; }
.ci-gallery__main img { width: 100%; height: 100%; object-fit: cover; }
.ci-gallery__thumbs { display: flex; gap: var(--ci-sp-2); margin: 0; padding: 0 0 var(--ci-sp-2); list-style: none; overflow-x: auto; }
.ci-gallery__thumbs button { display: block; width: 120px; aspect-ratio: 4 / 3; padding: 0; border: 3px solid transparent; border-radius: var(--ci-radius-sm); overflow: hidden; background: var(--ci-gray-100); flex-shrink: 0; }
.ci-gallery__thumbs button.is-active { border-color: var(--ci-accent); }
.ci-gallery__thumbs img { width: 100%; height: 100%; object-fit: cover; }

.ci-ficha__layout { display: grid; gap: var(--ci-sp-6); }
@media (min-width: 1024px) { .ci-ficha__layout { grid-template-columns: 1fr 360px; align-items: start; } }
.ci-ficha__facts { display: flex; flex-wrap: wrap; gap: var(--ci-sp-3); margin: 0 0 var(--ci-sp-6); padding: 0; list-style: none; }
.ci-ficha__facts li { display: inline-flex; align-items: center; gap: var(--ci-sp-2); padding: var(--ci-sp-2) var(--ci-sp-4); border: 1px solid var(--ci-border); border-radius: var(--ci-radius-sm); color: var(--ci-navy); font-size: var(--ci-fs-sm); }
.ci-ficha__facts strong { font-size: var(--ci-fs-md); }
.ci-ficha__section { margin-bottom: var(--ci-sp-6); }
.ci-ficha__section h2 { font-size: var(--ci-fs-xl); font-weight: 500; }
.ci-ficha__amenities { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--ci-sp-2) var(--ci-sp-4); margin: 0; padding: 0; list-style: none; }
.ci-ficha__amenities li { padding-left: 1.4em; position: relative; }
.ci-ficha__amenities li::before { content: "✓"; position: absolute; left: 0; color: var(--ci-navy); font-weight: 700; }
.ci-map iframe { width: 100%; height: 360px; border: 0; border-radius: var(--ci-radius); }

.ci-ficha__aside { position: sticky; top: calc(var(--ci-header-h) + 1rem); }
.ci-ficha__contact { display: grid; gap: var(--ci-sp-3); padding: var(--ci-sp-5); border-radius: var(--ci-radius-lg); background: var(--ci-gray-50); box-shadow: var(--ci-shadow); }
.ci-ficha__broker { display: flex; align-items: center; gap: var(--ci-sp-3); margin-bottom: var(--ci-sp-2); }
.ci-ficha__broker img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; }
.ci-ficha__broker-label { display: block; font-size: var(--ci-fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--ci-text-muted); }
.ci-ficha__contact-note { margin: 0; font-size: var(--ci-fs-sm); color: var(--ci-text-muted); }