/* Miles Tested · lo ÚNICO que el tema añade a la maqueta (30 oct 2026): piezas de WordPress que la maqueta no dibuja
   (paginación, comentarios, alineaciones del editor) y lo que cambia porque el cuerpo del artículo llega PLANO desde WordPress
   (sin los <section class="sec"> de la maqueta) o sin foto. Solo valores de DISENO.md: colores del :root de style.css; tamaños 14 16 18 30;
   radios 6 y 999 px. Va después de style.css, articulo.css y sitio.css. */

/* Paginación (búsqueda y listas): los números en píldoras, la actual en azul */
.mt-pag { margin-top: 40px; }
.mt-pag ul, .mt-pag .nav-links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.mt-pag .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 16px; border: 1px solid #8A9099; border-radius: 999px; font: 700 16px/1 var(--cuerpo); color: var(--tinta); text-decoration: none; background: #FFFFFF; }
.mt-pag a.page-numbers:hover, .mt-pag a.page-numbers:focus-visible { border-color: var(--air); color: var(--air); }
.mt-pag .page-numbers.current { background: var(--air); border-color: var(--air); color: #FFFFFF; }
.mt-pag .page-numbers.dots { border-color: transparent; background: transparent; }

/* Comentarios (el diseño aún no los trae) */
.mt-comentarios { max-width: 760px; margin: 56px auto 0; padding: 0 24px; }
.mt-com-lista { list-style: none; margin: 24px 0 0; padding: 0; }
.mt-com-lista .comment-body { padding: 16px 0; border-bottom: 1px solid #D5D9DD; }
.mt-com-lista .comment-meta { font: 400 14px/1.4 var(--cuerpo); color: var(--gris); }
.mt-com-lista .children { list-style: none; padding-left: 24px; }
.mt-comentarios label { display: block; font: 700 14px/1.3 var(--cuerpo); margin: 16px 0 6px; }
.mt-comentarios input[type="text"], .mt-comentarios input[type="email"], .mt-comentarios input[type="url"], .mt-comentarios textarea { width: 100%; font: 400 18px/1.3 var(--cuerpo); color: var(--tinta); background: #FFFFFF; border: 1px solid #8A9099; border-radius: 6px; padding: 12px 14px; }
.mt-comentarios input:focus, .mt-comentarios textarea:focus { border-color: var(--air); box-shadow: 0 0 0 3px rgba(0, 71, 255, 0.25); }
.mt-comentarios .form-submit { margin-top: 16px; }
.mt-comentarios .boton { border: 0; cursor: pointer; font-size: 16px; }

/* Alineaciones y pies de foto del editor */
.alignleft { float: left; margin: 0 24px 16px 0; }
.alignright { float: right; margin: 0 0 16px 24px; }
.aligncenter { margin-left: auto; margin-right: auto; }
.wp-caption-text, figcaption { font: 400 14px/1.4 var(--cuerpo); color: var(--gris); }
.screen-reader-text { position: absolute; left: -9999px; }

/* ── Parte B (30 oct 2026) · el cuerpo del artículo llega plano ────────────────────────────────────────────────────────────
   La maqueta envuelve cada apartado en <section class="sec">; el HTML del pipeline trae los <h2> sueltos dentro de .cuerpo.
   Mismos valores que `.sec h2` de articulo.css (y los del móvil). */
.cuerpo h2 { margin-top: 56px; font: 900 30px/1.15 var(--display); letter-spacing: -0.01em; color: var(--tinta); }
.cuerpo h2 + p { margin-top: 12px; }
.cuerpo img { max-width: 100%; height: auto; }
.cuerpo figure { margin-top: 24px; }
.cuerpo figure img { width: 100%; height: auto; border-radius: 12px; }
.cuerpo figure.foto--vert img { max-width: 360px; }
.cuerpo blockquote { margin: 24px 0 0; padding: 4px 0 4px 20px; border-left: 6px solid var(--air); }
.cuerpo hr { margin: 40px 0 0; border: 0; border-top: 1px solid var(--borde); }
.cuerpo code { font-size: 0.9em; background: var(--niebla); border-radius: 6px; padding: 2px 6px; }
.cuerpo figcaption { margin-top: 8px; }
/* Fotos reales de producto (de Amazon): enteras sobre blanco, nunca recortadas */
.emb-foto { object-fit: contain; background: #FFFFFF; }

/* Cabecera sin foto destacada (hay ramas sin fotos): el texto ocupa el ancho en vez de dejar medio hueco */
.artcab-in--sola { grid-template-columns: minmax(0, 1fr); }
.artcab-in--sola .artcab-txt { max-width: 760px; }
/* Sin índice (un artículo sin H2): dos columnas */
@media (min-width: 1180px) { .art-grid--sin-indice { grid-template-columns: minmax(0, 1fr) 300px; } }
.firma-n a { color: inherit; text-decoration: none; }
.firma-n a:hover, .firma-n a:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
.mas-a--texto { grid-template-columns: minmax(0, 1fr); }

/* Comentarios dentro del artículo (.coment de articulo.css) */
.coment .mt-com-lista { margin-top: 16px; }
.coment .comment-form { margin-top: 16px; }
.coment .form-submit { margin: 0; }
.coment small a { font: 400 14px/1.3 var(--cuerpo); }
.coment .comment-reply-link { font: 700 14px/1.3 var(--cuerpo); }

/* Categoría: filas sin foto o sin pilar publicado, y el aviso de rama vacía */
.fila--sin-foto .fila-izq { background: color-mix(in srgb, var(--c) 16%, #FFFFFF); }
.fila--sin-pilar { grid-template-columns: 224px minmax(0, 1fr); }
.cat-vacia { font: 400 18px/1.5 var(--cuerpo); color: var(--gris); }
@media (max-width: 959px) { .fila--sin-pilar { grid-template-columns: 200px minmax(0, 1fr); } }
@media (max-width: 719px) {
  .fila--sin-pilar { grid-template-columns: minmax(0, 1fr); }
  .fila--sin-foto .fila-izq { aspect-ratio: auto; min-height: 72px; }
  .cuerpo h2 { font-size: 24px; margin-top: 44px; }
}