/* Hoja del frente «ficha» (2026-11-11). Va después de tienda-cuenta.css y toma los tokens de la página. */
/* Galería sin JavaScript: tira con scroll-snap (foto principal acotada) y miniaturas que son enlaces a `#foto-N`. */
main.m-ancho .ficha__cabeza{align-items:start;gap:clamp(1.25rem,3vw,2.5rem)}
@media (min-width:900px){main.m-ancho .ficha__cabeza{grid-template-columns:minmax(0,26rem) minmax(0,28rem)}}
.ficha__tira{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;border-radius:var(--radio)}
.ficha__tira:focus-visible,.ficha .galeria a:focus-visible{outline:3px solid var(--texto);outline-offset:2px}
main.m-ancho .ficha__principal{flex:0 0 100%;scroll-snap-align:center;margin:0}
main.m-ancho .ficha__principal img{width:100%;height:clamp(15rem,50vh,26rem);aspect-ratio:1;object-fit:contain;background:color-mix(in srgb,var(--texto) 6%,transparent)}
.ficha .galeria{display:flex;flex-wrap:wrap;gap:.5rem;margin:.75rem 0 0;padding:0;list-style:none}
.ficha .galeria a{display:block;width:3rem;height:3rem;min-width:44px;min-height:44px;border:2px solid color-mix(in srgb,var(--texto) 30%,transparent);border-radius:var(--radio)}
.ficha .galeria img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
@media (prefers-reduced-motion:reduce){.ficha__tira{scroll-behavior:auto}}
/* Compra como tarjeta y confianza con datos reales (2026-11-11): botones normales (44 px), sin inventar envíos ni calificaciones. */
.ficha__migas ol{display:flex;flex-wrap:wrap;gap:.25rem;margin:0 0 .75rem;padding:0;list-style:none;font-size:.9rem;color:var(--suave)}
.ficha__migas li+li::before{content:"›";margin-right:.25rem}
.ficha__migas a{display:inline-block;min-height:24px;padding:.125rem 0}
main.m-ancho .ficha__compra{display:grid;gap:.5rem;align-content:start;padding:1.25rem}
.ficha__compra>*{margin:0}
.ficha__tienda{color:var(--suave);font-size:.9rem}
.ficha__compra h1{font-size:clamp(1.4rem,2.4vw,1.9rem);line-height:1.2}
.ficha__precio{font-size:1.9rem;font-weight:700}
.ficha__stock{color:var(--tinta);font-weight:600}
.ficha__stock--agotado{color:var(--alerta)}
.ficha__compra .acciones{margin:.25rem 0 0;flex-wrap:nowrap}
.ficha__agregar{display:flex;flex:1;align-items:center;gap:.5rem}
.ficha__agregar label{color:var(--suave);font-size:.9rem}
.ficha__cantidad{width:4.5rem;min-height:44px;padding:.25rem .5rem;border:1px solid var(--borde);border-radius:var(--radio-boton);background:var(--fondo);color:var(--tinta);font:inherit}
.ficha__agregar .boton{flex:1}
.ficha__comprar .boton{width:100%}
.boton--claro{background:transparent;color:var(--marca);border:2px solid var(--marca)}
.ficha__confianza{display:grid;gap:.25rem;margin:.5rem 0 0;padding:.75rem 0 0;list-style:none;border-top:1px solid var(--linea);font-size:.9rem;color:var(--suave)}
.ficha__confianza li::before{content:"✓ ";color:var(--marca);font-weight:700}
.ficha__dos{display:grid;gap:1rem;grid-template-columns:minmax(0,1fr)}
@media (min-width:900px){.ficha__dos{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}}
.ficha :is(a,button,input,textarea):focus-visible{outline:3px solid var(--tinta);outline-offset:2px}
/* Captura 126 (Deiber, 2026-11-11: «corrige este botón»): «Agregar al carrito» se partía en dos líneas (columna de 28rem + el relleno de
   botón de la página) y el título a 2,5rem empujaba «Comprar ahora» bajo el pliegue. Botones de una línea y a la misma altura que la cantidad
   y el corazón, título más contenido: la compra entera entra a 1536×790. `main.m-ancho` iguala la especificidad de tienda-pagina.css. */
@media (min-width:900px){main.m-ancho .ficha__cabeza{grid-template-columns:minmax(0,26rem) minmax(0,32rem)}}
main.m-ancho .ficha__compra h1{font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.15;margin:0}
main.m-ancho .ficha__agregar .boton,main.m-ancho .ficha__comprar .boton{min-height:48px;padding:.5rem 1.25rem;white-space:nowrap;line-height:1.2}
main.m-ancho .ficha__cantidad{min-height:48px}
main.m-ancho .ficha__compra .acciones{align-items:center;gap:.75rem}
