/* kiosco.mx — componentes.css. Dirección A · Plaza. Requiere tokens.css. HTML y CSS planos; sin JavaScript. */

/* ===== Base ===== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--kmx-color-fondo);
  color: var(--kmx-color-tinta);
  font-family: var(--kmx-fuente-texto);
  font-size: var(--kmx-tamano-texto);
  line-height: var(--kmx-interlinea-texto);
}
h1, h2, h3, h4, p, dl, dd, figure, ul, ol { margin: 0; }
ul, ol { padding: 0; }
a { color: var(--kmx-color-acento); text-underline-offset: 3px; }
img { display: block; max-width: 100%; height: auto; }
:focus-visible { outline: var(--kmx-foco-ancho) solid var(--kmx-color-foco); outline-offset: var(--kmx-foco-separacion); }
summary { cursor: pointer; }
summary::-webkit-details-marker { display: none; }
.kmx-oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ===== Contenedor y texto ===== */
.kmx-contenedor { width: 100%; max-width: var(--kmx-ancho-maximo); margin: 0 auto; padding-left: var(--kmx-espacio-4); padding-right: var(--kmx-espacio-4); }
@media (min-width: 768px) { .kmx-contenedor { padding-left: var(--kmx-espacio-6); padding-right: var(--kmx-espacio-6); } }

.kmx-h1, .kmx-h2, .kmx-h3 { font-family: var(--kmx-fuente-titulos); font-weight: var(--kmx-peso-titulo); }
.kmx-h1 { font-size: var(--kmx-tamano-h1); line-height: var(--kmx-interlinea-h1); }
.kmx-h1::after { content: ""; display: block; width: 48px; height: 2px; margin-top: var(--kmx-espacio-3); background: var(--kmx-color-acento); }
.kmx-h2 { font-size: var(--kmx-tamano-h2); line-height: var(--kmx-interlinea-h2); }
.kmx-h3 { font-size: var(--kmx-tamano-h3); line-height: var(--kmx-interlinea-h3); }
.kmx-pequeno { font-size: var(--kmx-tamano-pequeno); line-height: var(--kmx-interlinea-pequeno); }
.kmx-secundario { color: var(--kmx-color-texto-secundario); }
.kmx-lectura { max-width: var(--kmx-ancho-lectura); }
.kmx-dato { font-size: var(--kmx-tamano-dato); line-height: var(--kmx-interlinea-dato); font-weight: var(--kmx-peso-fuerte); font-variant-numeric: tabular-nums lining-nums; }
.kmx-lista { padding-left: 1.2em; }
.kmx-lista li + li { margin-top: var(--kmx-espacio-1); }

.kmx-seccion { padding-top: var(--kmx-espacio-6); padding-bottom: var(--kmx-espacio-7); }
.kmx-seccion__titulo { margin-bottom: var(--kmx-espacio-5); }
.kmx-seccion__titulo + .kmx-lectura { margin-top: calc(-1 * var(--kmx-espacio-3)); margin-bottom: var(--kmx-espacio-5); }

/* ===== Etiquetas semánticas: siempre con texto; el color solo acompaña ===== */
.kmx-etiqueta { display: inline-block; padding: 2px var(--kmx-espacio-2); border-radius: var(--kmx-radio-sm); font-family: var(--kmx-fuente-texto); font-size: var(--kmx-tamano-etiqueta); line-height: var(--kmx-interlinea-etiqueta); font-weight: var(--kmx-peso-fuerte); vertical-align: middle; }
.kmx-etiqueta--aviso { background: var(--kmx-color-aviso-fondo); color: var(--kmx-color-aviso-texto); }
.kmx-etiqueta--cotizar { background: var(--kmx-color-cotizar-fondo); color: var(--kmx-color-cotizar-texto); }
.kmx-etiqueta--entrega { background: var(--kmx-color-entrega-fondo); color: var(--kmx-color-entrega-texto); }
.kmx-etiquetas { display: flex; flex-wrap: wrap; gap: var(--kmx-espacio-2); }

/* ===== Botón ===== */
.kmx-boton { display: inline-block; min-height: var(--kmx-alto-toque); padding: var(--kmx-espacio-3) var(--kmx-espacio-5); background: var(--kmx-color-acento); color: var(--kmx-color-sobre-acento); border: 1px solid var(--kmx-color-acento); border-radius: var(--kmx-radio-sm); font-family: var(--kmx-fuente-texto); font-size: var(--kmx-tamano-texto); font-weight: var(--kmx-peso-fuerte); line-height: 1.2; text-decoration: none; text-align: center; cursor: pointer; }
.kmx-boton:hover, .kmx-boton:focus-visible { background: var(--kmx-color-acento-hover); border-color: var(--kmx-color-acento-hover); }
.kmx-boton--banda, .kmx-cotizar a.kmx-boton--banda { background: var(--kmx-color-sobre-banda); color: var(--kmx-color-banda); border-color: var(--kmx-color-sobre-banda); }
.kmx-boton--banda:hover, .kmx-boton--banda:focus-visible { background: var(--kmx-color-sobre-banda-secundario); border-color: var(--kmx-color-sobre-banda-secundario); }
/* Botón de contorno: enlace interno destacado («Kioscos a medida»). El relleno verde queda solo para «Cotizar». */
.kmx-boton--secundario { background: transparent; color: var(--kmx-color-acento); border-color: var(--kmx-color-acento); }
.kmx-boton--secundario:hover, .kmx-boton--secundario:focus-visible { background: var(--kmx-color-cotizar-fondo); color: var(--kmx-color-acento-hover); border-color: var(--kmx-color-acento-hover); }

/* ===== Foto: <img> con width, height y alt; proporción fija por componente ===== */
.kmx-foto { width: 100%; height: auto; object-fit: cover; background: var(--kmx-color-marcador); border-radius: var(--kmx-radio-sm); }
.kmx-foto--tarjeta { aspect-ratio: var(--kmx-proporcion-tarjeta); }
.kmx-foto--ficha { aspect-ratio: var(--kmx-proporcion-ficha); }
.kmx-foto--obra { aspect-ratio: var(--kmx-proporcion-obra); }
.kmx-foto--a-su-tamano { width: auto; max-width: 100%; } /* foto de menos del ancho del componente: a su ancho real, sin agrandarse */

/* ===== Encabezado: logo, menú plegable (<details>) y contacto ===== */
.kmx-encabezado { background: var(--kmx-color-fondo); border-bottom: var(--kmx-regla-doble); }
.kmx-encabezado__fila { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--kmx-espacio-3) var(--kmx-espacio-5); padding-top: var(--kmx-espacio-3); padding-bottom: var(--kmx-espacio-3); }
.kmx-logo { font-family: var(--kmx-fuente-titulos); font-size: var(--kmx-tamano-logo); line-height: var(--kmx-interlinea-logo); letter-spacing: 0.01em; color: var(--kmx-color-tinta); text-decoration: none; white-space: nowrap; padding: var(--kmx-espacio-2) 0; }
.kmx-menu { flex: 1 0 100%; }
.kmx-encabezado__tel { display: inline-flex; align-items: center; min-height: var(--kmx-alto-toque); margin-left: auto; margin-right: calc(var(--kmx-menu-boton-ancho) + var(--kmx-espacio-3)); color: var(--kmx-color-tinta); font-size: var(--kmx-tamano-pequeno); font-weight: var(--kmx-peso-fuerte); font-variant-numeric: tabular-nums; white-space: nowrap; }
.kmx-menu__boton { position: absolute; top: var(--kmx-espacio-3); right: var(--kmx-espacio-4); width: var(--kmx-menu-boton-ancho); list-style: none; display: inline-flex; align-items: center; justify-content: center; gap: var(--kmx-espacio-2); min-height: var(--kmx-alto-toque); padding: var(--kmx-espacio-2) var(--kmx-espacio-3); border: var(--kmx-borde); border-radius: var(--kmx-radio-sm); background: var(--kmx-color-fondo-elevado); font-size: var(--kmx-tamano-pequeno); font-weight: var(--kmx-peso-fuerte); color: var(--kmx-color-tinta); }
.kmx-menu__boton::after { content: "\25BE"; font-size: 0.9em; }
.kmx-menu[open] .kmx-menu__boton::after { content: "\25B4"; }
.kmx-menu__panel { display: flex; flex-direction: column; gap: var(--kmx-espacio-4); padding-top: var(--kmx-espacio-3); border-top: var(--kmx-borde); }
.kmx-menu__lista { list-style: none; display: flex; flex-direction: column; gap: var(--kmx-espacio-1); }
.kmx-menu__lista a { display: block; min-height: var(--kmx-alto-toque); padding: var(--kmx-espacio-2) 0; color: var(--kmx-color-tinta); text-decoration: none; font-size: var(--kmx-tamano-texto); }
.kmx-menu__lista a:hover { text-decoration: underline; }
.kmx-menu__lista a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }
.kmx-contacto { display: flex; flex-wrap: wrap; gap: var(--kmx-espacio-2) var(--kmx-espacio-4); list-style: none; font-size: var(--kmx-tamano-pequeno); color: var(--kmx-color-texto-secundario); }
.kmx-contacto a { color: var(--kmx-color-tinta); font-weight: var(--kmx-peso-fuerte); font-variant-numeric: tabular-nums; }
@media (min-width: 768px) {
  .kmx-encabezado__fila { flex-wrap: nowrap; padding-top: var(--kmx-espacio-4); padding-bottom: var(--kmx-espacio-4); }
  .kmx-menu__boton { top: var(--kmx-espacio-4); right: var(--kmx-espacio-6); }
  .kmx-encabezado__tel { display: none; } /* en escritorio el teléfono va en el contacto del panel */
  .kmx-menu { flex: 1 1 auto; }
  .kmx-menu__panel { flex-direction: row; align-items: center; justify-content: space-between; gap: var(--kmx-espacio-5); padding-top: 0; border-top: 0; }
  .kmx-menu__lista { flex-direction: row; gap: var(--kmx-espacio-5); margin-left: var(--kmx-espacio-5); }
  .kmx-menu__lista a { font-size: var(--kmx-tamano-pequeno); }
  .kmx-contacto { flex-wrap: nowrap; }
  /* En escritorio el menú se muestra abierto siempre. Si el navegador no conoce ::details-content,
     queda el botón «Menú» y el panel se abre al pulsarlo: funciona igual. */
  @supports selector(::details-content) {
    .kmx-menu__boton { display: none; }
    .kmx-menu::details-content { content-visibility: visible; display: block; }
  }
}

/* ===== Cabecera de portada: H1, párrafo y botón; sin foto ===== */
.kmx-portada { display: flex; flex-direction: column; gap: var(--kmx-espacio-4); padding-top: var(--kmx-espacio-6); padding-bottom: var(--kmx-espacio-6); }
.kmx-portada__texto { max-width: var(--kmx-ancho-lectura); }
@media (min-width: 768px) { .kmx-portada { padding-top: var(--kmx-espacio-7); padding-bottom: var(--kmx-espacio-7); } }

/* ===== Cómo elegir: rangos de diámetro según la plaza y el uso, con enlace a la guía de medidas ===== */
.kmx-elegir { max-width: var(--kmx-ancho-tabla); display: flex; flex-direction: column; gap: var(--kmx-espacio-4); }
.kmx-elegir__rangos { border-top: var(--kmx-regla-doble); }
.kmx-elegir__rangos div { display: flex; justify-content: space-between; align-items: baseline; gap: var(--kmx-espacio-4); padding: var(--kmx-espacio-3) 0; border-bottom: var(--kmx-borde); }
.kmx-elegir__rangos dt { color: var(--kmx-color-texto-secundario); }
.kmx-elegir__rangos dd { white-space: nowrap; }
.kmx-elegir__enlace { font-weight: var(--kmx-peso-fuerte); }

/* ===== «Kioscos a medida» en la portada: texto a la izquierda y «Qué necesitamos para cotizar» a la derecha ===== */
.kmx-a-medida { display: grid; gap: var(--kmx-espacio-6); }
.kmx-a-medida__texto { display: flex; flex-direction: column; gap: var(--kmx-espacio-4); }
.kmx-a-medida__requisitos { min-width: 0; }
@media (min-width: 960px) { .kmx-a-medida { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--kmx-espacio-7); align-items: start; } }

/* ===== Qué necesitamos para cotizar: lista con iconos de línea (SVG en el HTML, sin descargas) ===== */
.kmx-requisitos__titulo { margin-bottom: var(--kmx-espacio-4); }
.kmx-requisitos { list-style: none; display: grid; gap: var(--kmx-espacio-4); }
@media (min-width: 600px) { .kmx-requisitos { grid-template-columns: repeat(2, 1fr); } }
.kmx-requisitos__accion { margin-top: var(--kmx-espacio-5); }
.kmx-requisito { display: flex; gap: var(--kmx-espacio-3); align-items: flex-start; padding: var(--kmx-espacio-4); background: var(--kmx-color-fondo-elevado); border: var(--kmx-borde); border-radius: var(--kmx-radio-md); }
.kmx-requisito__icono { flex: none; width: var(--kmx-tamano-icono); height: var(--kmx-tamano-icono); color: var(--kmx-color-acento); }
.kmx-requisito__titulo { font-weight: var(--kmx-peso-fuerte); }
.kmx-requisito__texto { font-size: var(--kmx-tamano-pequeno); line-height: var(--kmx-interlinea-pequeno); color: var(--kmx-color-texto-secundario); }
/* ===== Migas de pan ===== */
.kmx-migas { list-style: none; display: flex; flex-wrap: wrap; gap: var(--kmx-espacio-2); padding-top: var(--kmx-espacio-3); font-size: var(--kmx-tamano-pequeno); line-height: var(--kmx-interlinea-pequeno); color: var(--kmx-color-texto-secundario); }
.kmx-migas li + li::before { content: "/"; margin-right: var(--kmx-espacio-2); }
.kmx-migas a { color: var(--kmx-color-texto-secundario); }

/* ===== Cabecera de ficha: galería a la izquierda, información a la derecha ===== */
.kmx-ficha { display: grid; gap: var(--kmx-espacio-5); padding-top: var(--kmx-espacio-5); padding-bottom: var(--kmx-espacio-6); }
.kmx-ficha__galeria { min-width: 0; }
.kmx-ficha__info { display: flex; flex-direction: column; gap: var(--kmx-espacio-4); }
.kmx-ficha__clave { display: flex; flex-wrap: wrap; gap: var(--kmx-espacio-2) var(--kmx-espacio-5); padding-top: var(--kmx-espacio-3); border-top: var(--kmx-borde); }
.kmx-ficha__clave div { display: flex; gap: var(--kmx-espacio-2); align-items: baseline; }
.kmx-ficha__clave dt { color: var(--kmx-color-texto-secundario); font-size: var(--kmx-tamano-pequeno); }
@media (min-width: 768px) {
  .kmx-ficha { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--kmx-espacio-7); align-items: start; padding-top: var(--kmx-espacio-6); }
}

/* ===== Galería de 1 a n fotos. Celular: franja que se desplaza; escritorio: la primera grande y el resto a dos columnas ===== */
.kmx-galeria { display: flex; gap: var(--kmx-espacio-3); overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0; padding-bottom: var(--kmx-espacio-1); }
.kmx-galeria__foto { flex: 0 0 86%; scroll-snap-align: start; }
.kmx-galeria__foto:only-child { flex-basis: 100%; }
.kmx-galeria figcaption { padding-top: var(--kmx-espacio-1); font-size: var(--kmx-tamano-pequeno); color: var(--kmx-color-texto-secundario); }
@media (min-width: 768px) {
  .kmx-galeria { display: grid; grid-template-columns: 1fr 1fr; overflow: visible; padding-bottom: 0; }
  .kmx-galeria__foto:first-child { grid-column: 1 / -1; }
}

/* ===== Tarjeta de modelo ===== */
.kmx-tarjetas { display: grid; gap: var(--kmx-espacio-5); list-style: none; }
@media (min-width: 600px) { .kmx-tarjetas { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .kmx-tarjetas { grid-template-columns: repeat(3, 1fr); } }
.kmx-tarjeta { display: flex; flex-direction: column; height: 100%; background: var(--kmx-color-fondo-elevado); border: var(--kmx-borde); border-radius: var(--kmx-radio-md); overflow: hidden; }
.kmx-tarjeta .kmx-foto { border-radius: 0; }
.kmx-tarjeta__cuerpo { display: flex; flex-direction: column; gap: var(--kmx-espacio-2); flex: 1; padding: var(--kmx-espacio-4); border-top: var(--kmx-borde); }
.kmx-tarjeta__nombre { font-family: var(--kmx-fuente-titulos); font-size: var(--kmx-tamano-h3); line-height: var(--kmx-interlinea-h3); font-weight: var(--kmx-peso-titulo); }
.kmx-tarjeta__tipo { color: var(--kmx-color-texto-secundario); font-size: var(--kmx-tamano-pequeno); line-height: var(--kmx-interlinea-pequeno); }
.kmx-tarjeta__descripcion { font-size: var(--kmx-tamano-pequeno); line-height: var(--kmx-interlinea-pequeno); }
.kmx-tarjeta__medida { display: flex; gap: var(--kmx-espacio-2); align-items: baseline; margin-top: var(--kmx-espacio-1); }
.kmx-tarjeta__medida dt { color: var(--kmx-color-texto-secundario); font-size: var(--kmx-tamano-pequeno); }
.kmx-tarjeta__pie { margin-top: auto; padding-top: var(--kmx-espacio-2); }
.kmx-tarjeta__enlace { font-weight: var(--kmx-peso-fuerte); }

/* Catálogo en grupos */
.kmx-catalogo__grupo + .kmx-catalogo__grupo { margin-top: var(--kmx-espacio-7); }

/* ===== Tablas ===== */
.kmx-tabla { width: 100%; border-collapse: collapse; border-top: var(--kmx-regla-doble); }
.kmx-tabla caption { text-align: left; padding-bottom: var(--kmx-espacio-3); font-family: var(--kmx-fuente-titulos); font-size: var(--kmx-tamano-h3); line-height: var(--kmx-interlinea-h3); font-weight: var(--kmx-peso-titulo); }
.kmx-tabla caption .kmx-etiqueta { margin-left: var(--kmx-espacio-2); }
.kmx-tabla th, .kmx-tabla td { padding: var(--kmx-espacio-3); text-align: left; vertical-align: top; border-bottom: var(--kmx-borde); }
.kmx-tabla thead th { background: var(--kmx-color-superficie); border-bottom-color: var(--kmx-color-tinta); font-size: var(--kmx-tamano-etiqueta); line-height: var(--kmx-interlinea-etiqueta); font-weight: var(--kmx-peso-fuerte); }
.kmx-tabla tbody th { font-weight: var(--kmx-peso-normal); color: var(--kmx-color-texto-secundario); }
.kmx-tabla td { font-size: var(--kmx-tamano-dato); font-weight: var(--kmx-peso-fuerte); font-variant-numeric: tabular-nums lining-nums; white-space: nowrap; background: var(--kmx-color-fondo-elevado); }
.kmx-tabla__sin-dato { color: var(--kmx-color-texto-secundario); font-weight: var(--kmx-peso-normal); }
.kmx-tabla__nota { margin-top: var(--kmx-espacio-2); }
.kmx-tabla__accion { margin-top: var(--kmx-espacio-4); }
@media (min-width: 768px) { .kmx-tabla th, .kmx-tabla td { padding: var(--kmx-espacio-3) var(--kmx-espacio-4); } }

/* Variante de ficha: dos columnas, medida y valor */
.kmx-tabla-medidas { max-width: var(--kmx-ancho-tabla); }
.kmx-tabla-medidas tbody th { width: 55%; }

/* Variante comparativa: un modelo por fila; en celular se desplaza y la primera columna queda fija */
.kmx-tabla-comparativa__marco { position: relative; overflow-x: auto; scroll-snap-type: x proximity; } /* position: relative contiene los textos ocultos (.kmx-oculto) dentro del marco */
.kmx-tabla-comparativa tbody th { position: sticky; left: 0; z-index: 1; background: var(--kmx-color-fondo); border-right: var(--kmx-borde); color: var(--kmx-color-tinta); font-weight: var(--kmx-peso-fuerte); white-space: nowrap; }
.kmx-tabla-comparativa thead th:first-child { position: sticky; left: 0; z-index: 2; border-right: var(--kmx-borde); }
.kmx-tabla-comparativa tbody th a { color: var(--kmx-color-acento); }
.kmx-tabla-comparativa thead th:not(:first-child), .kmx-tabla-comparativa td { text-align: right; }
.kmx-tabla-comparativa thead th { white-space: nowrap; }

/* ===== Usos y materiales ===== */
.kmx-usos { display: grid; gap: var(--kmx-espacio-5); }
.kmx-usos__grupo { padding-top: var(--kmx-espacio-3); border-top: var(--kmx-borde); }
.kmx-usos__grupo .kmx-h3 { margin-bottom: var(--kmx-espacio-2); }
@media (min-width: 768px) { .kmx-usos { grid-template-columns: repeat(3, 1fr); gap: var(--kmx-espacio-6); } }

/* ===== Preguntas frecuentes ===== */
.kmx-preguntas { max-width: var(--kmx-ancho-tabla); border-top: var(--kmx-regla-doble); }
.kmx-pregunta { border-bottom: var(--kmx-borde); }
.kmx-pregunta__titulo { list-style: none; display: flex; justify-content: space-between; align-items: baseline; gap: var(--kmx-espacio-4); min-height: var(--kmx-alto-toque); padding: var(--kmx-espacio-3) 0; font-family: var(--kmx-fuente-titulos); font-size: var(--kmx-tamano-h3); line-height: var(--kmx-interlinea-h3); font-weight: var(--kmx-peso-titulo); }
.kmx-pregunta__titulo::after { content: "+"; flex: none; font-family: var(--kmx-fuente-texto); color: var(--kmx-color-acento); font-size: 1.2em; line-height: 1; }
.kmx-pregunta[open] .kmx-pregunta__titulo::after { content: "\2212"; }
.kmx-pregunta__respuesta { padding-bottom: var(--kmx-espacio-4); max-width: var(--kmx-ancho-lectura); }
.kmx-pregunta__respuesta p + p { margin-top: var(--kmx-espacio-2); }

/* ===== Bloque de cotización: la única banda oscura por pantalla ===== */
.kmx-cotizar { background: var(--kmx-color-banda); color: var(--kmx-color-sobre-banda); }
.kmx-cotizar a { color: var(--kmx-color-sobre-banda); }
.kmx-cotizar :focus-visible { outline-color: var(--kmx-color-sobre-banda); }
.kmx-cotizar__fila { display: flex; flex-direction: column; gap: var(--kmx-espacio-5); padding-top: var(--kmx-espacio-6); padding-bottom: var(--kmx-espacio-6); }
.kmx-cotizar__texto { display: flex; flex-direction: column; gap: var(--kmx-espacio-2); max-width: var(--kmx-ancho-lectura); }
.kmx-cotizar__titulo { font-family: var(--kmx-fuente-titulos); font-size: var(--kmx-tamano-h2); line-height: var(--kmx-interlinea-h2); font-weight: var(--kmx-peso-titulo); }
.kmx-cotizar__texto p { color: var(--kmx-color-sobre-banda-secundario); }
.kmx-cotizar__canales { list-style: none; display: flex; flex-direction: column; gap: var(--kmx-espacio-3); }
.kmx-cotizar__canal { display: flex; flex-direction: column; gap: 2px; }
.kmx-cotizar__medio { color: var(--kmx-color-sobre-banda-secundario); font-size: var(--kmx-tamano-pequeno); }
.kmx-cotizar__valor { font-size: var(--kmx-tamano-dato); font-weight: var(--kmx-peso-fuerte); font-variant-numeric: tabular-nums; }
@media (min-width: 768px) {
  .kmx-cotizar__fila { flex-direction: row; justify-content: space-between; align-items: center; gap: var(--kmx-espacio-7); padding-top: var(--kmx-espacio-7); padding-bottom: var(--kmx-espacio-7); }
  .kmx-cotizar__canales { flex-direction: row; flex-wrap: wrap; align-items: center; gap: var(--kmx-espacio-5) var(--kmx-espacio-6); }
}

/* ===== Aviso de entrega e instalación: solo texto ===== */
.kmx-aviso-entrega { max-width: var(--kmx-ancho-lectura); padding: var(--kmx-espacio-4) 0; border-top: var(--kmx-regla-doble); border-bottom: var(--kmx-borde); }
.kmx-aviso-entrega strong { font-weight: var(--kmx-peso-fuerte); }

/* ===== Sitios hermanos: «Mobiliario para el mismo parque» ===== */
.kmx-hermanos { display: grid; gap: var(--kmx-espacio-5); }
.kmx-hermanos__sitio { padding-top: var(--kmx-espacio-3); border-top: var(--kmx-borde); }
.kmx-hermanos__sitio .kmx-h3 { margin-bottom: var(--kmx-espacio-2); }
.kmx-hermanos__lista { list-style: none; display: flex; flex-direction: column; gap: var(--kmx-espacio-2); }
.kmx-hermanos__lista a { font-weight: var(--kmx-peso-fuerte); }
.kmx-hermanos__lista span { display: block; color: var(--kmx-color-texto-secundario); font-size: var(--kmx-tamano-pequeno); }
@media (min-width: 768px) { .kmx-hermanos { grid-template-columns: repeat(2, 1fr); gap: var(--kmx-espacio-6); } }

/* ===== Tarjeta de obra (boceto para la página de proyectos) ===== */
.kmx-obras { display: grid; gap: var(--kmx-espacio-5); list-style: none; }
@media (min-width: 768px) { .kmx-obras { grid-template-columns: repeat(2, 1fr); } }
.kmx-obra { background: var(--kmx-color-fondo-elevado); border: var(--kmx-borde); border-radius: var(--kmx-radio-md); overflow: hidden; }
.kmx-obra__fotos { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
.kmx-obra__fotos figure { position: relative; }
.kmx-obra__fotos .kmx-foto { border-radius: 0; }
.kmx-obra__fotos figcaption { padding: var(--kmx-espacio-1) var(--kmx-espacio-2); font-size: var(--kmx-tamano-etiqueta); font-weight: var(--kmx-peso-fuerte); color: var(--kmx-color-texto-secundario); }
.kmx-obra__cuerpo { padding: var(--kmx-espacio-4); border-top: var(--kmx-borde); }
.kmx-obra__datos { display: grid; grid-template-columns: auto 1fr; gap: var(--kmx-espacio-1) var(--kmx-espacio-4); margin-top: var(--kmx-espacio-3); font-size: var(--kmx-tamano-pequeno); }
.kmx-obra__datos dt { color: var(--kmx-color-texto-secundario); }
.kmx-obra__datos dd { font-weight: var(--kmx-peso-fuerte); font-variant-numeric: tabular-nums; }

/* ===== Pie ===== */
.kmx-pie { border-top: var(--kmx-regla-doble); padding-top: var(--kmx-espacio-6); padding-bottom: var(--kmx-espacio-7); color: var(--kmx-color-texto-secundario); font-size: var(--kmx-tamano-pequeno); line-height: var(--kmx-interlinea-pequeno); }
.kmx-pie__fila { display: grid; gap: var(--kmx-espacio-5); }
.kmx-pie__bloque { display: flex; flex-direction: column; gap: var(--kmx-espacio-2); }
.kmx-pie__titulo { font-family: var(--kmx-fuente-texto); font-size: var(--kmx-tamano-etiqueta); font-weight: var(--kmx-peso-fuerte); color: var(--kmx-color-tinta); }
.kmx-pie a { color: var(--kmx-color-tinta); }
.kmx-pie__enlaces { list-style: none; display: flex; flex-direction: column; gap: var(--kmx-espacio-1); }
@media (min-width: 768px) { .kmx-pie__fila { grid-template-columns: 2fr 1fr 1fr; gap: var(--kmx-espacio-6); } }