/* ============================================================== */
/* detalle.css - Estilos de la ficha de inmueble (habitacionx.html) */
/* Extraído de <style> inline el 2026-05-04 (cura raíz + limpieza) */
/* ============================================================== */

    :root {
      --color-principal: #181C32;
      --color-acento: #6f1d1b;
      --color-fondo: #f5f7fa;
      --color-texto: #333;
      --color-blanco: #fff;
      --radius: 8px;
      --shadow: 0 4px 20px rgba(0,0,0,0.1);
      --border: #e9ecef;
    }
    * { margin:0; padding:0; box-sizing:border-box; }
    html, body {
      overflow-x:clip;
    }
    body {
      font-family:'Montserrat',sans-serif;
      background:var(--color-fondo);
      color:var(--color-texto);
      line-height:1.5;
      min-height:100vh;
      display:flex;
      flex-direction:column;
    }
    a { color:inherit; text-decoration:none; }
    img { max-width:100%; display:block; user-select:none; }

    header.navbar {
      background:#6f1d1b;
      color:#fff;
      display:flex;
      align-items:center;
      padding:.5rem 1rem;
      position:fixed;
      top:0;
      left:0;
      right:0;
      z-index:1030;
      box-shadow:0 2px 8px rgba(0,0,0,0.1);
      justify-content:space-between;
    }
    header.navbar .logo {
      font-weight:bold;
      font-size:1.5rem;
      cursor:pointer;
      color:white;
      user-select:none;
    }
    header.navbar nav {
      display:flex;
      gap:1.5rem;
    }
    header.navbar nav a {
      color:#fff;
      text-decoration:none;
      font-weight:600;
      transition:opacity 0.3s;
      padding:0.4rem 0;
      text-transform:uppercase;
    }
    header.navbar nav a:hover,
    header.navbar nav a.active {
      text-decoration:underline;
      opacity:0.8;
    }
    .lang-switch {
      display: flex;
      align-items: center;
      gap: 0.35rem;
      margin-right: 0.75rem;
    }
    .lang-switch button {
      background: rgba(255,255,255,0.2);
      border: 1px solid rgba(255,255,255,0.55);
      color: #fff;
      padding: 0.3rem 0.55rem;
      border-radius: 4px;
      cursor: pointer;
      font-weight: 700;
      font-size: 0.72rem;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      font-family: inherit;
    }
    .lang-switch button.lang-active {
      background: #fff;
      color: #6f1d1b;
      border-color: #fff;
    }

    main.container {
      max-width:1200px; margin:56px auto 2rem; padding:0 1rem;
      display:flex; gap:2rem; flex-wrap:wrap;
      align-items:flex-start;
    }
    .detail-top-nav {
      width:100%;
      margin-top:1.5rem;
      margin-bottom:1rem;
    }
    .detail-back-link {
      display:inline-flex;
      align-items:center;
      gap:0.5rem;
      color:#666;
      text-decoration:none;
      font-size:0.72rem;
      font-weight:600;
      letter-spacing:0.16em;
      text-transform:uppercase;
      padding:0.55rem 1rem 0.55rem 0.85rem;
      border:1px solid #e0e0e0;
      border-radius:999px;
      background:#fff;
      transition:all 0.18s ease;
    }
    .detail-back-link::before {
      content:'';
      display:inline-block;
      width:11px; height:11px;
      background-color:currentColor;
      -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='15 18 9 12 15 6'/></svg>") center/contain no-repeat;
      mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='15 18 9 12 15 6'/></svg>") center/contain no-repeat;
      transition:transform 0.18s ease;
    }
    .detail-back-link:hover {
      color:#1a1a1a;
      border-color:#1a1a1a;
      background:#fafafa;
    }
    .detail-back-link:hover::before {
      transform:translateX(-2px);
    }

    /* Botón "Compartir" — mismo estilo "pill" que "Volver al listado" */
    .share-btn {
      display:inline-flex;
      align-items:center;
      gap:0.5rem;
      margin-left:0.6rem;
      color:#666;
      background:#fff;
      border:1px solid #e0e0e0;
      border-radius:999px;
      padding:0.55rem 1rem 0.55rem 0.85rem;
      font-family:'Montserrat',sans-serif;
      font-size:0.72rem;
      font-weight:600;
      letter-spacing:0.16em;
      text-transform:uppercase;
      cursor:pointer;
      transition:all 0.18s ease;
    }
    .share-btn:hover {
      color:#1a1a1a;
      border-color:#1a1a1a;
      background:#fafafa;
    }
    .share-btn svg { width:13px; height:13px; flex-shrink:0; }

    /* Modal de fallback (cuando no hay Web Share API: mayoría de desktops) */
    .share-modal-overlay {
      position:fixed; inset:0;
      background:rgba(0,0,0,0.55);
      z-index:2200;
      display:flex; align-items:center; justify-content:center;
      padding:1rem;
      opacity:0;
      transition:opacity 0.15s;
      pointer-events:none;
    }
    .share-modal-overlay.is-open { opacity:1; pointer-events:auto; }
    .share-modal {
      background:#fff; border-radius:12px;
      max-width:420px; width:100%;
      box-shadow:0 12px 40px rgba(0,0,0,0.28);
      overflow:hidden;
      transform:scale(0.96);
      transition:transform 0.15s;
    }
    .share-modal-overlay.is-open .share-modal { transform:scale(1); }
    .share-modal-header {
      padding:1rem 1.4rem; border-bottom:1px solid #eee;
      display:flex; justify-content:space-between; align-items:center;
    }
    .share-modal-title { margin:0; font-size:1.05rem; font-weight:700; color:#181C32; }
    .share-modal-close {
      background:transparent; border:none; cursor:pointer;
      font-size:1.4rem; line-height:1; color:#666; padding:0 0.25rem;
    }
    .share-modal-body { padding:1rem 1.4rem; display:grid; gap:0.55rem; }
    .share-option {
      display:inline-flex; align-items:center; gap:0.7rem;
      padding:0.7rem 0.95rem; border-radius:8px; border:1.5px solid #e0e0e0; background:#fff;
      font-family:'Montserrat',sans-serif; font-size:0.92rem; font-weight:600; color:#222;
      cursor:pointer; text-decoration:none; transition:all 0.15s;
    }
    .share-option:hover { border-color:#999; background:#fafafa; color:#000; }
    .share-option svg { width:20px; height:20px; flex-shrink:0; }
    .share-option-wa svg { color:#25D366; }
    .share-option-mail svg { color:#6f1d1b; }
    .share-option-tg svg { color:#0088cc; }
    .share-option-copy svg { color:#666; }
    .share-toast {
      position:fixed; bottom:80px; left:50%; transform:translateX(-50%);
      background:#181C32; color:#fff;
      padding:0.65rem 1.2rem; border-radius:999px;
      font-size:0.85rem; font-weight:600; z-index:2300;
      opacity:0; pointer-events:none;
      transition:opacity 0.2s, transform 0.2s;
    }
    .share-toast.is-show {
      opacity:1; transform:translateX(-50%) translateY(-6px);
    }

    h1 {
      font-size:1.64rem;
      color:var(--color-principal);
      margin-bottom:0.06rem;
      line-height:1.13;
      font-weight:680;
      letter-spacing:0.008em;
    }
    h1#roomTitle { color:#6f1d1b; }
    .address-main {
      font-size:1.04rem;
      color:#2a3852;
      font-weight:600;
      margin:0 0 0.14rem 0;
      line-height:1.18;
      letter-spacing:0.007em;
      text-wrap:balance;
      white-space:nowrap;
      overflow-wrap:normal;
    }
    .promo-badge {
      display:none;
      margin:0 0 0.15rem 0;
      padding:0.2rem 0.55rem;
      border-radius:999px;
      background:#eef3fb;
      color:#2c3b58;
      border:1px solid #d4ddec;
      font-size:0.76rem;
      font-weight:700;
      width:max-content;
    }
    .address {
      font-size:0.85rem;
      color:#2f3a56;
      font-weight:580;
      margin:0 0 0.18rem 0;
      line-height:1.16;
      letter-spacing:0.01em;
      text-transform:lowercase;
    }

    .left-column {
      flex:1 1 60%; min-width:320px;
      display:flex; flex-direction:column; gap:0.68rem;
    }
    .right-column {
      flex:1 1 35%; min-width:320px;
      background:var(--color-blanco); border-radius:var(--radius);
      box-shadow:var(--shadow); padding:1rem 1.5rem;
      position:-webkit-sticky;
      position:sticky;
      top:120px; height:fit-content;
      align-self:flex-start;
    }

    /* ── Nueva galería ── */
    .gallery-wrap {
      overflow:hidden; background:#fff; margin-bottom:1.25rem;
      border:1px solid #ddd; border-radius:var(--radius); box-shadow:var(--shadow);
    }
    .gallery-viewer {
      position:relative; width:100%; aspect-ratio:16/9; background:#fff; overflow:hidden;
    }
    .gallery-img-wrap {
      width:100%; height:100%; display:flex; align-items:center; justify-content:center;
    }
    #galleryMainImg {
      width:100%; height:100%; object-fit:cover; display:block;
      transition:opacity .2s ease;
    }
    .gallery-main-pdf {
      width:100%; height:100%; display:flex; flex-direction:column;
      align-items:center; justify-content:center;
      background:#eef3f9; color:#3f4b5a; font-weight:600; font-size:1rem; gap:0.5rem;
    }
    .gallery-nav-btn {
      position:absolute; top:50%; transform:translateY(-50%);
      background:rgba(0,0,0,.25); border:none; color:#fff;
      font-size:2.2rem; line-height:1; width:44px; height:44px;
      border-radius:50%; cursor:pointer; z-index:10;
      display:flex; align-items:center; justify-content:center;
      opacity:0; transition:opacity .2s ease, background .15s;
    }
    .gallery-viewer:hover .gallery-nav-btn { opacity:1; }
    .gallery-nav-btn:hover { background:rgba(0,0,0,.55); }
    .gallery-nav-btn.prev { left:10px; }
    .gallery-nav-btn.next { right:10px; }
    .gallery-nav-btn:disabled { opacity:0 !important; cursor:default; }
    .carousel-counter {
      position:absolute; bottom:10px; right:10px;
      background:rgba(0,0,0,.6); color:#fff;
      padding:.25rem .6rem; border-radius:12px; font-size:.82rem; font-weight:600; z-index:10;
    }
    .gallery-tabs {
      display:flex; align-items:center; gap:0.4rem;
      background:#fff; padding:0.5rem 0.75rem;
      border-top:1px solid #e8e8e8; border-bottom:1px solid #e8e8e8;
    }
    .gallery-tab {
      display:inline-flex; align-items:center; gap:0.38rem;
      padding:0.28rem 0.85rem; border:1.5px solid #ddd; background:#fff;
      color:#555; font-size:0.78rem; font-weight:600; cursor:pointer;
      border-radius:20px; transition:all .15s; white-space:nowrap;
    }
    .gallery-tab svg {
      width:13px; height:13px; flex-shrink:0; stroke:currentColor;
    }
    .gallery-tab:hover { border-color:#555; color:#222; background:#f5f5f5; }
    .gallery-tab.is-active {
      border-color:#222; color:#111; background:#f0f0f0; font-weight:700;
    }
    .gallery-thumbs-outer {
      overflow-x:auto; background:#fff; padding:6px 8px;
      scrollbar-width:thin; scrollbar-color:#ccc #fff;
      cursor:grab; user-select:none;
    }
    .gallery-thumbs-outer.is-dragging { cursor:grabbing; }
    .gallery-thumbs-outer::-webkit-scrollbar { height:3px; }
    .gallery-thumbs-outer::-webkit-scrollbar-thumb { background:#ccc; border-radius:2px; }
    .gallery-thumbs { display:flex; gap:5px; }
    .gallery-thumb {
      flex:0 0 82px; height:62px; border-radius:5px; overflow:hidden;
      cursor:pointer; border:2px solid #e0e0e0; transition:border-color .15s, box-shadow .15s;
      flex-shrink:0; background:#f8f8f8;
    }
    .gallery-thumb img { width:100%; height:100%; object-fit:contain; display:block; background:#f8f8f8; }
    .gallery-thumb.is-active { border-color:#333; box-shadow:0 0 0 1px #333; }
    .gallery-thumb-pdf {
      width:100%; height:100%; background:#eef3f9; display:flex;
      align-items:center; justify-content:center;
      color:#6f1d1b; font-size:.7rem; font-weight:700;
    }
    .video-container {
      position:absolute; inset:0;
      background:#000; z-index:5;
    }
    .video-container iframe {
      position:absolute; inset:0; width:100%; height:100%; border:none;
    }
    .video-placeholder {
      position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
      background:#111; color:#777; font-weight:600; text-align:center; padding:1rem;
    }
    .gallery-plano-panel {
      position:absolute; inset:0; padding:.75rem; background:#f5f7fa;
      display:flex; flex-wrap:wrap; gap:.5rem;
      justify-content:center; align-items:center;
      overflow:auto; z-index:5;
    }
    .gallery-plano-panel img {
      max-width:100%; max-height:100%; object-fit:contain;
      border-radius:var(--radius); cursor:pointer;
    }
    .gallery-plano-pdf-link {
      display:inline-flex; align-items:center; gap:.4rem;
      padding:.5rem 1rem; background:#6f1d1b; color:#fff;
      border-radius:var(--radius); font-weight:600; font-size:.88rem;
      text-decoration:none;
    }

    .info-quick {
      display:block;
    }
    .info-quick .item {
      background:var(--color-blanco);
      border-radius:var(--radius);
      box-shadow:0 2px 14px rgba(0,0,0,0.04), 0 1px 3px rgba(0,0,0,0.03);
      border:1px solid #f3f3f3;
      padding:1rem 1.1rem; text-align:center;
      min-height:80px; display:flex; flex-direction:column; align-items:flex-start;
    }
    .info-quick .item.card-tipo-vivienda { grid-area: tipo; }
    .info-quick .item.card-tipo-vivienda {
      align-items: stretch;
    }
    .info-quick .item.card-metricas { grid-area: metricas; }
    .info-quick .item.card-internet { grid-area: internet; }
    .info-quick .item.card-internet {
      align-items: stretch;
    }
    .info-quick .item.card-internet .item-card-box {
      flex: 0 0 auto;
      display: flex;
      flex-direction: column;
      justify-content: center;
      min-height: 0;
      width: 100%;
    }
    .info-quick .item.card-internet .item-card-box:only-of-type {
      flex: 1 1 auto;
    }
    .info-quick .item.card-internet .item-card-box:last-of-type {
      flex: 1 1 auto;
    }
    .info-quick .item.card-internet .item-card-block-title {
      color: #999;
      font-size: 0.7rem;
      margin: 0.85rem 0 0.5rem 0;
      font-weight: 600;
      line-height: 1.2;
      text-transform: uppercase;
      letter-spacing: 0.14em;
      width: 100%;
      text-align: center;
      padding-top: 0.85rem;
      border-top: 1px solid #f0f0f0;
    }
    .info-quick .item.card-suministros { grid-area: suministros; }
    .info-quick .item.card-cocina { grid-area: cocina; }
    .info-quick .item.card-suministros,
    .info-quick .item.card-cocina {
      align-items: stretch;
      min-height: 0;
      padding: 0.55rem 0.6rem;
    }
    .info-quick .item.card-suministros > h4,
    .info-quick .item.card-cocina > h4 {
      width: 100%;
      text-align: center;
      margin-bottom: 0.4rem;
      flex-shrink: 0;
    }
    .info-quick .item.card-suministros .item-card-box,
    .info-quick .item.card-cocina .item-card-box {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: center;
      min-height: 0;
      width: 100%;
    }
    .info-quick .item.card-suministros .item-card-box {
      min-height: 7.5rem;
      padding: 0.65rem 0.75rem;
    }
    .info-quick .item.card-suministros .item-card-box .item-card-lines-even {
      flex: 1;
      min-height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: space-evenly;
      gap: 0.25rem;
      width: 100%;
    }
    .info-quick .item.card-suministros .item-card-box .item-card-lines-even .item-card-line {
      margin: 0;
      text-align: left;
      line-height: 1.35;
    }
    .info-quick .item.card-cocina .item-card-box .item-card-columns {
      align-content: start;
    }
    /* Tarjetas con solo número (o m²) centrado bajo el título */
    .info-quick .item.item-stat {
      align-items: stretch;
      min-height: 100px;
    }
    .info-quick .item.item-stat h4 {
      width: 100%;
      text-align: center;
      margin-bottom: 0.35rem;
    }
    .info-quick .item.item-stat p.item-stat-value {
      flex: 1;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      width: 100%;
      font-size: 0.8rem;
      font-weight: 400;
      color: #444;
      line-height: 1.4;
    }
    /* Bloque compacto de métricas (Dormitorios / Baños / Superficie) */
    .info-quick .item.item-metrics {
      min-height: auto;
      padding: 0.55rem;
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
      grid-auto-rows: 1fr;
      gap: 0.45rem;
      align-items: stretch;
    }
    .info-quick .item.item-metrics .metric-chip {
      padding: 0.5rem 0.4rem;
      text-align: center;
      display: flex;
      flex-direction: column;
      justify-content: center;
      min-height: 100%;
      border-right: 1px solid #f0f0f0;
    }
    .info-quick .item.item-metrics .metric-chip:last-child {
      border-right: none;
    }
    .info-quick .item.item-metrics .metric-label {
      margin: 0 0 0.3rem 0;
      font-size: 0.66rem;
      font-weight: 600;
      color: #999;
      text-align: center;
      line-height: 1.2;
      text-transform: uppercase;
      letter-spacing: 0.14em;
    }
    .info-quick .item.item-metrics .metric-value {
      margin: 0;
      font-size: 1rem;
      font-weight: 600;
      color: #1a1a1a;
      text-align: center;
      line-height: 1.3;
    }
    .info-quick .item h4 {
      color:#999;
      font-size:0.7rem;
      margin-bottom:0.7rem;
      font-weight:600;
      line-height:1.2;
      padding:0;
      text-transform: uppercase;
      letter-spacing: 0.14em;
      display:inline-flex;
      align-items:center;
      gap:0.4rem;
      align-self:center;
    }
    .info-quick .item.card-tipo-vivienda h4::before,
    .info-quick .item.card-internet h4::before,
    .info-quick .item.card-suministros h4::before,
    .info-quick .item.card-cocina h4::before {
      content:'';
      display:inline-block;
      width:14px; height:14px;
      flex-shrink:0;
      background-color:currentColor;
      -webkit-mask:var(--info-icon) center/contain no-repeat;
      mask:var(--info-icon) center/contain no-repeat;
    }
    .info-quick .item.card-tipo-vivienda h4 {
      --info-icon:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M3 12L12 4l9 8'/><path d='M5 10v10h14V10'/></svg>");
    }
    .info-quick .item.card-internet h4 {
      --info-icon:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12.5a10 10 0 0 1 14 0'/><path d='M8.5 16a5 5 0 0 1 7 0'/><circle cx='12' cy='19.5' r='1.2'/><path d='M2 9a14 14 0 0 1 20 0'/></svg>");
    }
    .info-quick .item.card-suministros h4 {
      --info-icon:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><polygon points='13 2 3 14 12 14 11 22 21 10 12 10 13 2'/></svg>");
    }
    .info-quick .item.card-cocina h4 {
      --info-icon:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M6 2v8a2 2 0 0 0 4 0V2'/><path d='M8 12v10'/><path d='M16 2c-1.5 0-3 1.5-3 4v6h3v10'/></svg>");
    }
    .info-quick .item p { 
      font-size:0.8rem; 
      color:#444; 
      margin:0; 
      line-height:1.4;
      text-align:left;
      width:100%;
    }
    /* Marco interno para el contenido de cada tarjeta (estilo profesional unificado) */
    .info-quick .item .item-card-box {
      width: 100%;
      padding: 0.25rem 0;
      box-sizing: border-box;
    }
    .info-quick .item.card-tipo-vivienda .item-card-box {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      min-height: 7.5rem;
    }
    .info-quick .item.card-tipo-vivienda .item-card-box .item-card-value {
      text-align: left;
    }
    .info-quick .item.card-tipo-vivienda .item-card-box .item-card-value.item-card-value-type {
      flex: 1;
      display: flex;
      flex-direction: column;
      min-height: 0;
      width: 100%;
    }
    .info-quick .item.card-tipo-vivienda .item-card-box .item-card-value.item-card-value-type .item-card-tipo-title {
      display: block;
      text-align: center;
      flex-shrink: 0;
    }
    .info-quick .item.card-tipo-vivienda .item-card-box .item-card-tipo-extras {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: center;
      text-align: left;
      gap: 0.55rem;
      padding-top: 0.35rem;
    }
    .info-quick .item.card-tipo-vivienda .item-card-box .item-card-tipo-extra-line {
      font-size: 0.82rem;
      line-height: 1.45;
    }
    .info-quick .item .item-card-box .item-card-value {
      margin: 0;
      font-size: 0.8rem;
      color: #333;
      line-height: 1.35;
      text-align: left;
      width: 100%;
    }
    .info-quick .item .item-card-box .item-card-value.item-card-value-type strong {
      font-size: 1.05rem;
      color: #1f1f1f;
      font-weight: 700;
    }
    .info-quick .item .item-card-box .item-card-value strong {
      color: #1a1a1a;
      font-weight: 600;
    }
    .info-quick .item .item-card-box .item-card-columns {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.75rem;
    }
    .info-quick .item .item-card-box .item-card-col + .item-card-col {
      border-left: 1px solid #f0f0f0;
      padding-left: 0.75rem;
    }
    .info-quick .item .item-card-box .item-card-line {
      font-size: 0.8rem;
      color: #333;
      line-height: 1.35;
      margin-bottom: 0.2rem;
    }
    .info-quick .item.card-cocina .item-card-box {
      padding: 0.65rem 0.75rem;
    }
    .info-quick .item.suministros-wide {
      grid-column: span 2;
    }

    /* ========== Property specs (premium layout) ========== */
    .property-stats {
      display:flex;
      background:var(--color-blanco);
      border:1px solid #ececec;
      border-radius:12px;
      box-shadow:0 2px 14px rgba(0,0,0,0.04), 0 1px 3px rgba(0,0,0,0.03);
      overflow:hidden;
      margin-bottom:2rem;
    }
    .property-stat {
      flex:1;
      padding:1.5rem 1rem;
      text-align:center;
      border-right:1px solid #f0f0f0;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      gap:0.55rem;
      min-width:0;
    }
    .property-stat:last-child { border-right:none; }
    .property-stat-value {
      font-size:1.85rem;
      font-weight:600;
      color:#1a1a1a;
      letter-spacing:-0.015em;
      line-height:1;
      white-space:nowrap;
    }
    .property-stat-value .unit {
      font-size:0.78rem;
      font-weight:500;
      color:#888;
      margin-left:0.18rem;
      letter-spacing:0;
    }
    .property-stat-label {
      font-size:0.62rem;
      font-weight:600;
      color:#999;
      text-transform:uppercase;
      letter-spacing:0.18em;
      line-height:1;
    }

    .property-features {
      display:grid;
      grid-template-columns:repeat(3, 1fr);
      gap:0 3rem;
      padding:0 0.25rem;
    }
    .property-feature-group {
      display:flex; flex-direction:column;
      position:relative;
    }
    .property-feature-group:not(:first-child)::after {
      content:'';
      position:absolute;
      top:0; bottom:0;
      left:-1.5rem;
      width:1px;
      background:#999;
    }
    .feature-group-title {
      font-size:0.7rem;
      font-weight:600;
      color:#999;
      text-transform:uppercase;
      letter-spacing:0.18em;
      margin:0 0 0.85rem 0;
      padding-bottom:0.7rem;
      border-bottom:1px solid #999;
      display:flex;
      align-items:center;
      gap:0.5rem;
      line-height:1;
    }
    .feature-group-title::before {
      content:'';
      width:14px; height:14px;
      background-color:currentColor;
      -webkit-mask:var(--feature-icon) center/contain no-repeat;
      mask:var(--feature-icon) center/contain no-repeat;
      flex-shrink:0;
    }
    .property-feature-group[data-group="interior"] .feature-group-title {
      --feature-icon:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M3 12L12 4l9 8'/><path d='M5 10v10h14V10'/></svg>");
    }
    .property-feature-group[data-group="instalaciones"] .feature-group-title {
      --feature-icon:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><polygon points='13 2 3 14 12 14 11 22 21 10 12 10 13 2'/></svg>");
    }
    .property-feature-group[data-group="cocina"] .feature-group-title {
      --feature-icon:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M6 2v8a2 2 0 0 0 4 0V2'/><path d='M8 12v10'/><path d='M16 2c-1.5 0-3 1.5-3 4v6h3v10'/></svg>");
    }
    .feature-list {
      list-style:none;
      padding:0;
      margin:0;
    }
    .feature-list li {
      font-size:0.92rem;
      color:#1f1f1f;
      line-height:1.65;
      padding:0.1rem 0 0.1rem 1.1rem;
      position:relative;
    }
    .feature-list li::before {
      content:'—';
      position:absolute;
      left:0;
      top:0.1rem;
      color:#c8c8c8;
      font-weight:400;
      line-height:1.65;
    }

    /* === Acordeón "Sobre el barrio" === */
    .neighborhood-section { margin-bottom:1.5rem; }
    .neighborhood-toggle {
      width:100%;
      display:flex; align-items:center; justify-content:space-between;
      gap:0.75rem;
      padding:0.95rem 1.1rem;
      background:#fff;
      border:1px solid #e6e6e6;
      border-radius:10px;
      cursor:pointer;
      font-family:'Montserrat',sans-serif;
      font-size:1.05rem; font-weight:700;
      color:#181C32;
      transition:background .15s, border-color .15s;
      box-shadow:0 2px 14px rgba(0,0,0,0.03);
    }
    .neighborhood-toggle:hover { background:#fafafa; border-color:#cccccc; }
    .neighborhood-toggle-text {
      display:inline-flex; align-items:center; gap:0.6rem;
    }
    .neighborhood-icon {
      width:18px; height:18px; flex-shrink:0; color:#6f1d1b;
    }
    .neighborhood-chevron {
      font-size:0.85rem; color:#888;
      transition:transform .2s ease;
    }
    .neighborhood-toggle[aria-expanded="true"] .neighborhood-chevron { transform:rotate(180deg); }
    .neighborhood-content {
      padding:1rem 0.25rem 0.25rem;
    }
    .neighborhood-intro {
      margin:0 0 1rem 0; color:#555; font-size:0.92rem;
    }
    .neighborhood-status {
      color:#777; font-size:0.88rem; padding:0.5rem 0;
    }
    .neighborhood-status.is-error { color:#c00; }
    .neighborhood-status[hidden] { display:none; }
    .neighborhood-categories { display:grid; gap:1rem; }
    .neighborhood-cat {
      background:#fff; border:1px solid #f0f0f0; border-radius:8px;
      padding:0.85rem 1rem;
    }
    .neighborhood-cat-title {
      display:flex; align-items:center; gap:0.55rem;
      margin:0 0 0.55rem; font-size:0.92rem; font-weight:700; color:#181C32;
    }
    .neighborhood-cat-emoji { font-size:1.05rem; }
    .neighborhood-cat-list {
      list-style:none; padding:0; margin:0;
      display:grid; gap:0.3rem;
    }
    .neighborhood-cat-list li {
      display:flex; align-items:baseline; justify-content:space-between;
      gap:0.85rem;
      font-size:0.9rem; color:#333;
      padding:0.25rem 0;
      border-bottom:1px dashed #f1f1f1;
    }
    .neighborhood-cat-list li:last-child { border-bottom:none; }
    .neighborhood-cat-name {
      flex:1 1 auto; min-width:0;
      overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
    }
    .neighborhood-cat-distance {
      flex:0 0 auto;
      color:#888; font-size:0.84rem; font-weight:600;
      white-space:nowrap;
    }
    @media (max-width: 600px) {
      .neighborhood-toggle { font-size:0.96rem; padding:0.85rem 1rem; }
    }

    .section { margin-bottom:2.25rem; }
    .section h2 {
      font-size:1.45rem;
      font-weight:600;
      color:#1a1a1a;
      letter-spacing:-0.005em;
      margin:0 0 1.25rem 0;
      padding-bottom:0.75rem;
      border-bottom:1px solid #999;
      line-height:1.2;
    }
    .section p { 
      margin-bottom:1rem; 
      text-align:justify;
      white-space:pre-line;
    }
    /* Descripción colapsable estilo Idealista: corta a ~10 líneas con un
       fade blanco al fondo y un botón "Leer descripción completa". El JS
       (detalle.js → renderDescription) decide si mostrar el botón en
       función del overflow real, así descripciones cortas no llevan fade. */
    .room-description-wrapper {
      position: relative;
      overflow: hidden;
      transition: max-height .35s ease;
    }
    .room-description-wrapper.is-collapsed {
      max-height: 250px;
    }
    .room-description-wrapper.is-collapsed::after {
      content: '';
      position: absolute;
      inset: auto 0 0 0;
      height: 90px;
      background: linear-gradient(
        to bottom,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,1) 100%
      );
      pointer-events: none;
    }
    .read-more-btn {
      display: inline-flex;
      align-items: center;
      gap: .35rem;
      margin-top: .25rem;
      background: transparent;
      border: none;
      color: #6f1d1b;
      font-weight: 600;
      font-size: .95rem;
      cursor: pointer;
      padding: 0;
      font-family: inherit;
    }
    /* Necesario porque la regla anterior tiene más especificidad que el
       user-agent CSS que aplica `display:none` al atributo `hidden`. */
    .read-more-btn[hidden] { display: none !important; }
    .read-more-btn:hover { text-decoration: underline; }
    .read-more-btn:focus-visible {
      outline: 2px solid #6f1d1b;
      outline-offset: 2px;
      border-radius: 2px;
    }
    .read-more-btn .rmb-chevron { display: inline-block; }
    .reviews-summary {
      display:flex;
      gap:0.8rem;
      align-items:center;
      flex-wrap:wrap;
      margin-bottom:0.8rem;
      color:#2a3852;
    }
    .reviews-stars {
      color:#6f1d1b;
      font-size:1.1rem;
      letter-spacing:0.05em;
      font-weight:700;
    }
    .reviews-controls {
      margin-bottom:0.9rem;
      display:flex;
      justify-content:flex-end;
    }
    .reviews-controls select {
      border:1px solid #d7dce3;
      border-radius:6px;
      padding:0.45rem 0.6rem;
      font-family:'Montserrat',sans-serif;
      background:#fff;
    }
    .reviews-list {
      display:grid;
      gap:0.8rem;
      margin-bottom:1rem;
    }
    .review-item {
      background:#fff;
      border:1px solid #e7ebf0;
      border-radius:8px;
      padding:0.8rem;
      box-shadow:0 2px 8px rgba(0,0,0,0.04);
    }
    .review-header {
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:0.75rem;
      margin-bottom:0.45rem;
      flex-wrap:wrap;
    }
    .review-date {
      color:#666;
      font-size:0.84rem;
    }
    .review-comment {
      margin:0;
      text-align:left;
      white-space:pre-line;
      color:#2f3a56;
      font-size:0.92rem;
    }
    .review-form-grid {
      display:grid;
      grid-template-columns:1fr 180px;
      gap:0.7rem;
    }
    .review-form-grid input,
    .review-form-grid select,
    .review-form textarea {
      width:100%;
      border:1px solid #d7dce3;
      border-radius:6px;
      padding:0.55rem 0.65rem;
      font-family:'Montserrat',sans-serif;
      font-size:0.9rem;
    }
    .review-form textarea { margin-top:0.7rem; min-height:96px; resize:vertical; }
    .review-form button {
      margin-top:0.7rem;
      border:none;
      border-radius:6px;
      background:#6f1d1b;
      color:#fff;
      font-weight:700;
      padding:0.65rem 1rem;
      cursor:pointer;
    }
    .review-form button:hover { background:#5a1615; }
    .review-form-msg {
      margin-top:0.6rem;
      font-size:0.88rem;
      min-height:1.2rem;
    }
    ul { list-style:disc; padding-left:1.2rem; }
    ul li { margin-bottom:.5rem; }

    .map-calendar { margin-bottom:2rem; }
    #map {
      width:100%; height:360px; border-radius:14px;
      border:1px solid #f0f0f0;
      box-shadow:0 2px 14px rgba(0,0,0,0.04), 0 1px 3px rgba(0,0,0,0.03);
      margin-bottom:1.75rem;
    }
    .calendar-carousel-container {
      position:relative; border-radius:14px;
      background:var(--color-blanco);
      border:1px solid #f0f0f0;
      box-shadow:0 2px 14px rgba(0,0,0,0.04), 0 1px 3px rgba(0,0,0,0.03);
      width:100%; padding:1.5rem 1.5rem 1.25rem;
    }
    .calendar-header {
      display:flex; justify-content:center; align-items:center;
      margin-bottom:1.25rem;
    }
    .calendar-header h3 {
      color:#999; font-size:0.68rem; margin:0;
      font-weight:600; text-transform:uppercase;
      letter-spacing:0.22em;
    }
    .calendar-track {
      display:flex; gap:2.25rem; justify-content:center;
    }
    .calendar-month {
      flex:1; min-width:240px; max-width:300px;
      padding:0; background:transparent;
      border-radius:0;
      min-height:auto;
      display:flex; flex-direction:column;
    }
    .calendar-month table {
      width:100%; border-collapse:collapse;
      text-align:center; font-size:0.88rem;
      table-layout:fixed;
    }
    .calendar-month caption {
      margin-bottom:0.85rem;
      font-weight:500; color:#1a1a1a;
      font-size:1rem;
      letter-spacing:-0.005em;
      text-transform:capitalize;
    }
    .calendar-month th {
      font-size:0.58rem;
      padding:0.35rem 0 0.55rem;
      color:#bbb;
      font-weight:600;
      letter-spacing:0.18em;
      text-transform:uppercase;
    }
    .calendar-month td {
      padding:0; height:32px; vertical-align:middle;
      font-size:0.85rem; font-weight:500;
      color:#1a1a1a;
      cursor:default;
      position:relative;
      transition:background .2s ease;
    }
    .calendar-month td.available { background:transparent; color:#1a1a1a; }
    .calendar-month td.available:hover {
      background:radial-gradient(circle at center, #f4f4f4 0 13px, transparent 14px 100%);
    }
    .calendar-month td.pending {
      background:transparent;
      color:#1a1a1a;
    }
    .calendar-month td.pending::after {
      content:'';
      position:absolute;
      bottom:5px;
      left:50%;
      transform:translateX(-50%);
      width:4px; height:4px;
      border-radius:50%;
      background:#c89e63;
    }
    .calendar-month td.reserved {
      background:radial-gradient(circle at center, #f1f1f1 0 13px, transparent 14px 100%);
      color:#a8a8a8;
      text-decoration:line-through;
    }
    .calendar-month td.empty {
      background:transparent; cursor:default; color:transparent;
    }
    .calendar-legend {
      display:flex; justify-content:center; gap:1.75rem;
      margin-top:1.1rem; padding-top:0.9rem;
      border-top:1px solid #f0f0f0;
    }
    .legend-item {
      display:flex; align-items:center; gap:0.55rem;
      font-size:0.66rem; color:#888;
      text-transform:uppercase; letter-spacing:0.16em;
      font-weight:600;
    }
    .legend-color {
      width:8px; height:8px; border-radius:50%;
      border:none;
    }
    .legend-color.available { background:#1a1a1a; }
    .legend-color.pending { background:#c89e63; }
    .legend-color.reserved { background:#cccccc; }
    .calendar-nav {
      display:contents;
    }
    .calendar-btn {
      position:absolute;
      top:50%;
      transform:translateY(-50%);
      background:transparent;
      border:none;
      font-size:0;
      color:transparent;
      width:38px; height:38px;
      border-radius:50%;
      display:flex; align-items:center; justify-content:center;
      cursor:pointer;
      transition:background 0.18s ease;
      padding:0;
      z-index:2;
    }
    .calendar-btn::before {
      content:'';
      display:block;
      width:14px; height:14px;
      background-color:#888;
      transition:background-color 0.18s ease;
      -webkit-mask:var(--chev-icon) center/contain no-repeat;
      mask:var(--chev-icon) center/contain no-repeat;
    }
    .calendar-btn:first-child {
      left:0.6rem;
      --chev-icon:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><polyline points='15 18 9 12 15 6'/></svg>");
    }
    .calendar-btn:last-child {
      right:0.6rem;
      --chev-icon:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><polyline points='9 18 15 12 9 6'/></svg>");
    }
    .calendar-btn:hover {
      background:#f4f4f4;
    }
    .calendar-btn:hover::before {
      background-color:#1a1a1a;
    }
    .calendar-btn:disabled {
      cursor:not-allowed;
    }
    .calendar-btn:disabled::before {
      background-color:#dcdcdc;
    }
    .calendar-btn:disabled:hover {
      background:transparent;
    }

    .banner {
      margin-bottom:1rem; padding-bottom:1rem;
      border-bottom:1px solid #eee;
    }
    .banner-price {
      font-size:2rem; font-weight:800; color:#6f1d1b; line-height:1;
    }
    .banner-price-unit {
      font-size:0.88rem; font-weight:500; color:#888; margin-left:0.2rem;
    }
    /* === Ficha rápida (hero-stats) sobre la galería === */
    .hero-stats {
      display:flex;
      gap:0;
      background:#fff;
      border-radius:var(--radius);
      border:1px solid #f0f0f0;
      box-shadow:0 2px 14px rgba(0,0,0,0.04), 0 1px 3px rgba(0,0,0,0.03);
      padding:0.6rem 0.4rem;
      margin:0.25rem 0 0.6rem;
      flex-wrap:nowrap;
      overflow:hidden;
    }
    .hero-stat {
      flex:1 1 0;
      min-width:0;
      display:flex;
      flex-direction:column;
      gap:0.1rem;
      padding:0.2rem 0.7rem;
      border-right:1px solid #eee;
      text-align:left;
    }
    .hero-stat:last-child { border-right:none; }
    .hero-stat-label {
      font-size:0.66rem;
      color:#888;
      text-transform:uppercase;
      letter-spacing:0.08em;
      font-weight:600;
      white-space:nowrap;
    }
    .hero-stat-value {
      font-size:1rem;
      font-weight:700;
      color:#181C32;
      line-height:1.1;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
    }
    .hero-stat-price .hero-stat-value {
      color:#6f1d1b;
      font-size:1.15rem;
    }
    @media (max-width: 600px) {
      .hero-stats { padding:0.5rem 0.25rem; gap:0; }
      .hero-stat { padding:0.2rem 0.5rem; }
      .hero-stat-label { font-size:0.6rem; }
      .hero-stat-value { font-size:0.92rem; }
      .hero-stat-price .hero-stat-value { font-size:1rem; }
    }

    /* === CTA sticky en móvil (precio + WhatsApp + Reservar) === */
    .mobile-sticky-cta { display:none; }
    @media (max-width: 768px) {
      .mobile-sticky-cta {
        position:fixed;
        bottom:0; left:0; right:0;
        background:#fff;
        border-top:1px solid #e0e0e0;
        box-shadow:0 -2px 12px rgba(0,0,0,0.08);
        padding:0.55rem 0.7rem calc(0.55rem + env(safe-area-inset-bottom, 0px));
        display:flex;
        align-items:center;
        gap:0.5rem;
        z-index:1020;
      }
      body.has-mobile-sticky-cta { padding-bottom:78px; }
      .mobile-sticky-price {
        flex:1; min-width:0;
        display:flex; flex-direction:column; line-height:1.05;
      }
      .mobile-sticky-price-value {
        font-size:1.05rem; font-weight:800; color:#6f1d1b;
        white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
      }
      .mobile-sticky-price-unit {
        font-size:0.72rem; color:#777; font-weight:600;
      }
      .mobile-sticky-btn {
        display:inline-flex; align-items:center; justify-content:center;
        height:42px; padding:0 0.85rem; border-radius:8px;
        font-family:'Montserrat',sans-serif; font-size:0.88rem; font-weight:700;
        border:none; cursor:pointer; text-decoration:none; line-height:1;
      }
      .mobile-sticky-btn-wa {
        background:#25D366; color:#fff; width:44px; padding:0;
      }
      .mobile-sticky-btn-wa svg { width:22px; height:22px; }
      .mobile-sticky-btn-reserve {
        background:#6f1d1b; color:#fff;
      }
      .mobile-sticky-btn-reserve:active { background:#5a1615; }
    }

    /* === Contacto rápido (WhatsApp + Teléfono) === */
    .contact-quick-actions {
      display:flex; gap:0.5rem; margin:0 0 1rem;
    }
    .contact-btn {
      flex:1; display:inline-flex; align-items:center; justify-content:center;
      gap:0.45rem; padding:0.65rem 0.75rem;
      border-radius:8px; border:1.5px solid transparent;
      font-family:'Montserrat',sans-serif; font-size:0.88rem; font-weight:700;
      cursor:pointer; transition:transform .1s, background .15s, border-color .15s, color .15s;
      text-decoration:none; line-height:1; letter-spacing:0.01em;
    }
    .contact-btn svg { width:18px; height:18px; flex-shrink:0; }
    .contact-btn:active { transform:scale(.98); }
    .contact-btn-wa {
      background:#25D366; color:#fff; border-color:#25D366;
    }
    .contact-btn-wa:hover { background:#1ebe57; border-color:#1ebe57; color:#fff; }
    .contact-btn-phone {
      background:#fff; color:#6f1d1b; border-color:#6f1d1b;
    }
    .contact-btn-phone:hover { background:#fff5f5; }
    @media (max-width: 480px) {
      .contact-quick-actions { flex-direction:column; }
      .contact-btn { width:100%; }
    }

    .reserva-form-title {
      font-size:0.95rem; font-weight:700; color:#222;
      margin:0 0 0.75rem; letter-spacing:0.01em;
    }
    .reserva-form label {
      display:block; font-weight:600; margin-bottom:.2rem;
      color:#444; font-size:0.8rem; text-transform:uppercase; letter-spacing:0.04em;
    }
    .reserva-form input,
    .reserva-form select,
    .reserva-form textarea {
      width:100%; padding:.5rem .65rem; margin-bottom:.9rem;
      border-radius:6px; border:1.5px solid #ddd;
      font-family:'Montserrat',sans-serif; font-size:0.88rem;
      box-sizing:border-box; transition:border-color .15s;
    }
    .reserva-form textarea {
      min-height:0; overflow:hidden; resize:none;
    }
    .reserva-form input:focus,
    .reserva-form select:focus,
    .reserva-form textarea:focus {
      border-color:#6f1d1b; outline:none;
    }
    .reserva-form-row {
      display:grid; grid-template-columns:1fr 1fr; gap:0 0.5rem;
    }
    .reserva-form button {
      width:100%; background:#6f1d1b; color:#fff;
      border:none; padding:.8rem; border-radius:8px;
      font-size:1rem; font-weight:700; cursor:pointer;
      margin-top:0.25rem; letter-spacing:0.02em;
      transition:background .15s, transform .1s;
    }
    .reserva-form button:hover { background:#5a1615; }
    .reserva-form button:active { transform:scale(.98); }
    .reserva-form .mensaje { display:none; color:#c00; font-size:.88rem; margin-top:.75rem; padding:.6rem .8rem; border-radius:6px; background:#fff5f5; line-height:1.5; border:1px solid #fcc; }

    .modal-overlay {
      position:fixed; inset:0; background:rgba(0,0,0,.7);
      display:flex; justify-content:center; align-items:center;
      opacity:0; pointer-events:none; transition:opacity .3s; z-index:2000;
    }
    .modal-overlay.active { opacity:1; pointer-events:auto; }
    .modal-content {
      position: relative;
      background:#fff; border-radius:var(--radius); width:90%; max-width:820px; max-height:90vh;
      display:flex; flex-direction:column; box-shadow:var(--shadow); overflow:hidden;
    }
    .modal-close {
      position:absolute; top:10px; right:10px; background:var(--color-acento);
      border:none; color:#fff; width:34px; height:34px; border-radius:50%; font-size:1.4rem;
      cursor:pointer;
    }
    /* Marco fijo: todas las fotos/planos ocupan el mismo rectángulo; bandas grises si la proporción no encaja */
    .modal-img-container { 
      position:relative; 
      flex:0 0 auto;
      width:100%;
      height:clamp(200px, min(68vh, calc(90vh - 118px)), calc(90vh - 100px));
      box-sizing:border-box;
      display:flex; 
      align-items:center; 
      justify-content:center;
      background:#f5f5f5;
      padding:8px;
    }
    .modal-img-container img { 
      display:block;
      width:100%;
      height:100%;
      object-fit:contain;
      object-position:center;
      border:1px solid rgba(0,0,0,0.1);
      box-shadow:0 0 0 1px rgba(255,255,255,0.5) inset;
    }
    .modal-nav { display:flex; justify-content:space-between; padding:.6rem 1rem; background:var(--color-fondo); }
    .modal-nav button {
      border:none; border-radius:var(--radius); padding:.4rem 1rem;
      background:var(--color-acento); color:#fff; font-weight:600; cursor:pointer;
    }
    .modal-nav button:disabled { background:#ccc; cursor:not-allowed; }

    .related-section { 
      width:100%; 
      max-width:1200px; 
      margin:3rem auto 0; 
      padding:2rem 1rem 3rem; 
      background:var(--color-fondo);
    }
    .related-section h2 {
      text-align:center;
      margin:0 0 2.25rem 0;
      padding-bottom:1rem;
      color:#1a1a1a;
      font-size:1.45rem;
      font-weight:600;
      letter-spacing:-0.005em;
      line-height:1.2;
      position:relative;
      display:block;
    }
    .related-section h2::after {
      content:"";
      width:48px;
      height:1px;
      background:#999;
      position:absolute;
      bottom:0;
      left:50%;
      transform:translateX(-50%);
    }
    .related {
      display:flex; 
      gap:1.5rem; 
      justify-content:center; 
      flex-wrap:wrap;
      max-width:1200px;
      margin:0 auto;
    }
    .card {
      background:var(--color-blanco); 
      border-radius:var(--radius); 
      box-shadow:var(--shadow);
      overflow:hidden; 
      width:300px; 
      cursor:pointer; 
      text-align:center;
      transition:transform .2s, box-shadow .2s;
    }
    .card:hover { 
      transform:translateY(-6px); 
      box-shadow:0 6px 25px rgba(0,0,0,0.15);
    }
    .card img { 
      height:150px; 
      object-fit:cover; 
      width:100%; 
    }
    .card-content { 
      padding:1.5rem 1rem; 
    }
    .card-content h3 { 
      font-size:1.05rem; 
      color:#6f1d1b; 
      margin-bottom:.5rem; 
      font-weight:600;
    }
    .card-content p { 
      font-size:.9rem; 
      margin-bottom:.75rem; 
      color:#555; 
    }
    .card-content span {
      display:inline-block; 
      padding:.5rem 1.25rem; 
      border-radius:999px;
      background:var(--color-acento); 
      color:#fff; 
      font-size:.85rem;
      font-weight:600;
      transition:background .2s;
    }
    .card:hover .card-content span {
      background:#5a1615;
    }

    footer {
      text-align:center; 
      padding:0.55rem 0.75rem; 
      background:#6f1d1b; 
      color:#fff; 
      font-size:.9rem;
      font-weight:500;
      margin-top:auto;
    }
    footer p {
      margin:0.15rem 0;
      color:#fff;
    }
    footer a {
      color:#fff;
      text-decoration:underline;
      margin:0 0.5rem;
      transition:opacity .3s;
    }
    footer a:hover {
      opacity:0.8;
    }
    
    /* MODALES — texto legal ES/EN (html[lang] lo controla I18n) */
    .legal-lang-en { display: none !important; }
    html[lang="en"] .legal-lang-es { display: none !important; }
    html[lang="en"] .legal-lang-en { display: block !important; }
    h2#privacyModalTitle .legal-lang-es,
    h2#termsModalTitle .legal-lang-es,
    h2#privacyModalTitle .legal-lang-en,
    h2#termsModalTitle .legal-lang-en { display: inline; }
    html[lang="en"] h2#privacyModalTitle .legal-lang-es,
    html[lang="en"] h2#termsModalTitle .legal-lang-es { display: none !important; }
    html[lang="en"] h2#privacyModalTitle .legal-lang-en,
    html[lang="en"] h2#termsModalTitle .legal-lang-en { display: inline !important; }

    #privacyModal, #termsModal {
      display:none; 
      position:fixed; 
      top:0; 
      left:0;
      width:100vw; 
      height:100vh; 
      background:rgba(0,0,0,0.7);
      justify-content:center; 
      align-items:center; 
      z-index:3000; 
      padding:1rem;
      overflow-y:auto; 
      -webkit-overflow-scrolling:touch;
    }
    #privacyModal .modal-content, #termsModal .modal-content {
      background:white; 
      padding:2rem; 
      border-radius:12px;
      max-width:700px; 
      max-height:90vh; 
      overflow-y:auto;
      position:relative; 
      box-shadow:0 4px 20px rgba(0,0,0,0.3);
      width:100%; 
      margin:auto;
      -webkit-overflow-scrolling:touch;
    }
    .close-btn {
      position:absolute; 
      top:12px; 
      right:12px;
      background:#6f1d1b; 
      border:none; 
      color:white;
      font-size:1.5rem; 
      font-weight:700; 
      border-radius:50%;
      width:40px; 
      height:40px; 
      cursor:pointer; 
      line-height:1;
      display:flex; 
      align-items:center; 
      justify-content:center;
      transition:background 0.2s; 
      touch-action:manipulation;
      z-index:10;
    }
    .close-btn:hover { background:#5a1615; }
    .close-btn:active { background:#4a1211; transform:scale(0.95); }
    
    .modal-content h2 {
      color:#6f1d1b;
      margin-bottom:1.5rem;
      font-size:1.8rem;
      font-weight:700;
    }
    .modal-content h3 {
      color:#6f1d1b;
      margin-top:1.5rem;
      margin-bottom:0.75rem;
      font-size:1.3rem;
      font-weight:600;
    }
    .modal-content h4 {
      color:#181C32;
      margin-top:1rem;
      margin-bottom:0.5rem;
      font-size:1.1rem;
      font-weight:600;
    }
    .modal-content p {
      margin-bottom:1rem;
      line-height:1.6;
      color:#333;
    }
    .modal-content ul {
      margin-left:2rem;
      margin-bottom:1rem;
    }
    .modal-content li {
      margin-bottom:0.5rem;
      line-height:1.6;
    }
    .modal-content a {
      color:#6f1d1b;
      text-decoration:underline;
    }
    .modal-content a:hover {
      color:#5a1615;
    }
    
    @media(max-width:767px) {
      #privacyModal .modal-content, #termsModal .modal-content {
        padding:1.5rem 1rem; 
        border-radius:8px;
        max-height:95vh; 
        margin:0.5rem;
      }
      #privacyModal .modal-content h2, #termsModal .modal-content h2 { 
        font-size:1.3rem; 
        margin-top:0.5rem; 
      }
      #privacyModal .modal-content h3, #termsModal .modal-content h3 { 
        font-size:1.1rem; 
      }
      #privacyModal .modal-content p, #termsModal .modal-content p { 
        font-size:0.9rem; 
        line-height:1.5; 
      }
      .close-btn {
        width:36px; 
        height:36px; 
        font-size:1.3rem;
        top:8px; 
        right:8px;
      }
    }
    
    @media(max-width:480px) {
      #privacyModal, #termsModal { padding:0.5rem; }
      #privacyModal .modal-content, #termsModal .modal-content {
        padding:1rem 0.75rem; 
        border-radius:6px;
        max-height:98vh;
      }
      #privacyModal .modal-content h2, #termsModal .modal-content h2 { 
        font-size:1.2rem; 
      }
      #privacyModal .modal-content h3, #termsModal .modal-content h3 { 
        font-size:1rem; 
      }
      #privacyModal .modal-content p, #termsModal .modal-content p { 
        font-size:0.85rem; 
      }
      .close-btn {
        width:32px; 
        height:32px; 
        font-size:1.2rem;
        top:6px; 
        right:6px;
      }
    }

    @media (max-width:850px) {
      main.container { flex-direction:column; margin:90px 1rem 2rem; }
      .right-column { position:relative; top:auto; }
      .info-quick {
        grid-template-columns: 1fr;
        grid-template-areas: none;
      }
      .info-quick .item {
        grid-area: auto !important;
      }
      .info-quick .item .item-card-box .item-card-columns {
        grid-template-columns: 1fr;
        gap: 0.5rem;
      }
      .info-quick .item .item-card-box .item-card-col + .item-card-col {
        border-left: none;
        border-top: 1px solid #e2e2e2;
        padding-left: 0;
        padding-top: 0.5rem;
      }
      .property-stats { flex-wrap:wrap; }
      .property-stat {
        flex:1 1 33%;
        min-width:33%;
        padding:1rem 0.5rem;
        border-bottom:1px solid #f0f0f0;
      }
      .property-stat-value { font-size:1.4rem; }
      .property-features {
        grid-template-columns:1fr;
        gap:1.6rem;
      }
      .property-feature-group:not(:first-child)::after { display:none; }
      .calendar-carousel-container { height:auto; padding:1.25rem 1rem; }
      .calendar-month { min-width:100%; height:auto; margin-bottom:1rem; }
      .calendar-nav { display:flex; justify-content:center; gap:0.5rem; margin-top:1rem; }
      .calendar-btn {
        position:static; top:auto; transform:none;
      }
      .calendar-btn:first-child, .calendar-btn:last-child { left:auto; right:auto; }
      h1 { font-size:1.28rem; margin-bottom:0.05rem; line-height:1.13; }
      .address-main {
        font-size:0.95rem;
        margin-bottom:0.11rem;
        line-height:1.16;
        white-space:normal;
      }
      .address { font-size:0.82rem; margin-bottom:0.18rem; line-height:1.15; }
      .detail-top-nav { margin-bottom:0.08rem; }
      .promo-badge { margin-bottom:0.12rem; }
    }

/* ============================================================================
 * FIXES MÓVIL FICHA DETALLE (2026-05-04)
 * 1) Calendario: anula el `table { display:block }` del responsive-global
 *    que aplastaba los días en una sola línea sin estructura.
 * 2) Header: oculta nav en móvil (deja solo logo + ES/EN) para que no
 *    desborde y deje ver el contenido.
 * ============================================================================ */

/* 1) Calendario: forzar layout de tabla siempre (override del global responsive) */
.calendar-month table {
  display: table !important;
  width: 100% !important;
  overflow: visible !important;
}
.calendar-month thead {
  display: table-header-group !important;
}
.calendar-month tbody {
  display: table-row-group !important;
}
.calendar-month tr {
  display: table-row !important;
}
.calendar-month th,
.calendar-month td {
  display: table-cell !important;
}

/* 2) Header en móvil: oculta nav (que ocupa demasiado al wrapearse) */
@media (max-width: 768px) {
  header.navbar nav {
    display: none !important;
  }
  header.navbar {
    padding: 0.6rem 1rem;
  }
  header.navbar .logo {
    font-size: 1.2rem;
  }
  /* lang-switch sigue visible en la derecha */
}

/* 3) Calendario: en móvil mostrar UN mes a la vez (en desktop son 2 lado a lado) */
@media (max-width: 768px) {
  .calendar-track {
    gap: 0 !important;
    overflow: hidden;
  }
  .calendar-month {
    flex: 0 0 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
  }
  .calendar-carousel-container {
    padding: 1rem 1rem 0.75rem;
  }
}