/* ============================================================
   AUROVAS · Páginas por calle y urbanización (streets-build.mjs)
   Se carga DESPUÉS de zone.css y reutiliza sus clases iz-; aquí
   solo va lo propio: tabla de viviendas, citas y bloque de zona.
   ============================================================ */

/* tabla de viviendas: scroll propio en móvil (la página no se desborda) */
.st-tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.st-table { width: 100%; border-collapse: collapse; font-size: .95rem; min-width: 640px; }
.st-table caption { caption-side: bottom; text-align: left; padding: 12px 16px 14px; font-size: .8rem; color: var(--grey); border-top: 1px solid var(--line-2); }
.st-table th { text-align: left; font-size: .74rem; font-family: var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--grey); font-weight: 600; padding: 14px 16px 10px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.st-table td { padding: 12px 16px; border-bottom: 1px solid var(--line-2); vertical-align: top; color: var(--graphite); }
.st-table tbody tr:last-child td { border-bottom: 0; }
.st-table tbody tr:hover td { background: var(--bone); }
.st-table td:first-child a { font-weight: 600; color: var(--ink); text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 4px; }
.st-table td:first-child a:hover { text-decoration-color: var(--ac, #c75c33); }
.st-table td small { color: var(--grey); font-size: .78rem; }
.st-table .st-num { white-space: nowrap; font-variant-numeric: tabular-nums; text-align: right; }
.st-table th:nth-last-child(-n+2) { text-align: right; }
.st-table td:not(:first-child) { white-space: nowrap; }

/* barrio y zona + citas de la guía de zona */
.st-sec + .st-sec { margin-top: 38px; }
.st-sec .iz-head { margin-bottom: 14px; }
.st-zone p { font-size: 1.04rem; line-height: 1.72; color: var(--graphite); }
.st-zone p strong { color: var(--ink); }
.st-zone p a { text-decoration: underline; text-underline-offset: 3px; }
.st-zone .st-note { font-size: .84rem; color: var(--grey); margin-top: 8px; line-height: 1.5; }
.st-zone .iz-links { margin-top: 18px; }
.st-quotes { display: grid; gap: 14px; }
.st-quote { margin: 0; border-left: 3px solid var(--ac, #c75c33); padding: 4px 0 4px 18px; }
.st-quote blockquote { margin: 0; }
.st-quote blockquote p { font-size: 1.04rem; line-height: 1.65; color: var(--ink); }
.st-quote blockquote p::before { content: '«'; }
.st-quote blockquote p::after { content: '»'; }
.st-quote figcaption { margin-top: 6px; font-size: .82rem; color: var(--grey); }
.st-quote figcaption a { text-decoration: underline; text-underline-offset: 3px; }

/* la respuesta rápida (.iz-answer de zone.css) cierra el héroe de calle */
.st .iz-hero--sm .iz-answer { margin-top: 14px; }
/* móvil: cada fila de la tabla es una ficha (vivienda arriba, cifras en tres columnas con su etiqueta) */
@media (max-width: 640px) {
  .st-tablewrap { overflow: visible; border: 0; border-radius: 0; background: none; }
  .st-table, .st-table tbody { display: block; min-width: 0; font-size: .92rem; }
  .st-table caption { display: block; border: 0; padding: 0 2px 12px; }
  .st-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .st-table tr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 14px; padding: 14px 16px; margin-bottom: 10px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
  .st-table td, .st-table tbody tr:last-child td { display: block; padding: 0; border: 0; white-space: normal; }
  .st-table td:not(:first-child) { white-space: normal; }
  .st-table .st-num { text-align: left; }
  .st-table td:first-child { grid-column: 1 / -1; }
  .st-table td[data-l]::before { content: attr(data-l); display: block; margin-bottom: 2px; font-family: var(--font-mono); font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; color: var(--grey); }
  .st-table tbody tr:hover td { background: none; }
}
