/* Guía de tallas, la página. La ventana de la ficha tiene su propio estilo; acá manda
   la lectura: una columna angosta, porque esto se lee de corrido y se manda por
   WhatsApp, no se escanea como una ficha. */

.mp-gt{ max-width:52rem; margin:var(--mp-e6) auto var(--mp-e7) }

.mp-gt__cab{ margin-bottom:var(--mp-e6) }
.mp-gt__cab h1{ margin:.4rem 0 .8rem }
.mp-gt__bajada{ margin:0; max-width:46ch; color:var(--mp-tinta-2); font-size:1.0625rem; line-height:1.6 }

.mp-gt__bloque{ margin-bottom:var(--mp-e6) }
.mp-gt__bloque h2{ margin:0 0 .5rem; font-size:1.3rem }
.mp-gt__nota{ margin:0 0 1.1rem; max-width:52ch; color:var(--mp-tinta-2); font-size:.9375rem; line-height:1.6 }

/* la tabla se desborda a lo ancho en el teléfono: se desliza, no se encoge hasta
   volverse ilegible */
.mp-gt__caja{ position:relative; overflow-x:auto; -webkit-overflow-scrolling:touch }
.mp-gt__tabla{ width:100%; min-width:26rem; border-collapse:collapse; font-size:.9375rem }
.mp-gt__tabla th, .mp-gt__tabla td{
  padding:.7rem .9rem; text-align:left; border-bottom:1px solid var(--mp-hilo);
}
.mp-gt__tabla thead th{
  font-size:.75rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--mp-tinta-3); font-weight:500;
}
.mp-gt__tabla tbody th{ font-weight:500; color:var(--mp-tinta) }
.mp-gt__tabla tbody tr:nth-child(odd){ background:var(--mp-lino) }

.mp-gt__pasos{ margin:0; padding-left:1.2rem; display:grid; gap:.8rem; max-width:52ch }
.mp-gt__pasos li{ line-height:1.6; color:var(--mp-tinta-2) }
.mp-gt__pasos strong{ display:block; color:var(--mp-tinta); font-weight:500 }

.mp-gt__cuerpos{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit, minmax(8rem, 1fr)); gap:var(--mp-e3);
}
.mp-gt__cuerpos a{ display:grid; gap:.5rem; text-decoration:none; color:var(--mp-tinta); font-size:.875rem }
.mp-gt__cuerpo-foto{ display:block; aspect-ratio:3/4; overflow:hidden; background:var(--mp-lino) }
.mp-gt__cuerpo-foto img{ width:100%; height:100%; object-fit:cover; display:block }

.mp-gt__ayuda{
  margin-top:var(--mp-e6); padding:1.6rem; background:var(--mp-lino);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem;
}
.mp-gt__ayuda p{ margin:0; color:var(--mp-tinta-2) }
.mp-gt__wa{
  display:inline-block; padding:.75rem 1.4rem; background:var(--mp-tinta); color:var(--mp-papel);
  text-decoration:none; font-size:.875rem; letter-spacing:.02em;
}
.mp-gt__wa:hover{ background:var(--mp-vino) }