.pizarra-interior { display: flex; flex-wrap: wrap; gap: 1.5rem 3rem; justify-content: space-between; align-items: flex-end; }
.tasa-ecuacion { margin: .5rem 0 0; font-size: clamp(2rem, 7vw, 4.25rem); font-weight: 800; letter-spacing: -.02em; line-height: 1; font-variant-numeric: tabular-nums; }
.pizarra-enlace { color: var(--pizarra-suave); font-size: .9375rem; }

.disposicion { display: grid; gap: 2rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 60rem) { .disposicion { grid-template-columns: minmax(0, 1fr) 20rem; align-items: start; } }

.barra { display: flex; flex-wrap: wrap; gap: .75rem; margin-bottom: 1rem; }
.barra input[type="search"] { flex: 1 1 14rem; }
.categorias { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.resultados { margin: 0 0 1rem; color: var(--tinta-suave); }

.rejilla { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr)); }

.producto { display: flex; flex-direction: column; gap: .5rem; background: var(--papel); border: 1px solid var(--linea); border-radius: .5rem; padding: 1rem; }
.foto { aspect-ratio: 4 / 3; display: grid; place-items: center; background: #fff; border-radius: .375rem; padding: .75rem; }
.foto img { max-width: 100%; max-height: 100%; object-fit: contain; }
.categoria { margin: 0; color: var(--tinta-suave); font-size: .875rem; }

/* Etiqueta de precio con muesca y agujero, como las de cartulina de una bodega. */
.etiqueta { position: relative; margin-top: auto; background: var(--oro); color: #10231c; padding: .5rem .75rem .5rem 1.75rem; clip-path: polygon(.875rem 0, 100% 0, 100% 100%, .875rem 100%, 0 50%); }
.etiqueta::before { content: ""; position: absolute; left: 1rem; top: 50%; width: .5rem; height: .5rem; margin-top: -.25rem; border-radius: 50%; background: var(--papel); }
.precio-usd { margin: 0; font-size: 1.375rem; font-weight: 800; line-height: 1.1; font-variant-numeric: tabular-nums; }
.precio-bs { margin: 0; font-size: .9375rem; font-variant-numeric: tabular-nums; }

.panel-carrito { background: var(--papel); border: 1px solid var(--linea); border-radius: .5rem; padding: 1rem; }
@media (min-width: 60rem) { .panel-carrito { position: sticky; top: 1rem; } }
.lineas { list-style: none; margin: 0; padding: 0; }
.linea { display: grid; grid-template-columns: 1fr auto; gap: .25rem .75rem; padding-block: .75rem; border-bottom: 1px solid var(--linea); }
.linea-titulo { grid-column: 1 / -1; font-weight: 600; }
.linea-cantidad { display: inline-flex; align-items: center; gap: .5rem; }
.linea-cantidad button { width: 2rem; height: 2rem; border: 1px solid var(--linea); border-radius: .375rem; background: var(--hoja); color: var(--tinta); }
.linea-precio { text-align: right; font-variant-numeric: tabular-nums; }
.total { margin-block: 1rem; }

/* Mismo aspecto que la portada: gris neutro, cabecera plana y tarjetas de borde fino. */
:root { --hoja: #0a0a0b; --papel: #151517; --lateral: #0d0d0f; --tinta: #ececee; --tinta-suave: #a1a1a8; --linea: #26262a; --cobalto: #f4f4f5; --cobalto-texto: #0a0a0b; --enlace: #6ea0ee; --pizarra: #0d0d0f; --pizarra-texto: #ececee; --pizarra-suave: #a1a1a8; }
@media (prefers-color-scheme: light) {
  :root { --hoja: #f7f7f8; --papel: #ffffff; --lateral: #ffffff; --tinta: #16161a; --tinta-suave: #5b5b63; --linea: #e3e3e6; --cobalto: #16161a; --cobalto-texto: #ffffff; --enlace: #1f5fbf; --pizarra: #ffffff; --pizarra-texto: #16161a; --pizarra-suave: #5b5b63; }
}
.pizarra { border-bottom: 1px solid var(--linea); padding: 1rem 0; }
.pizarra h1 { color: var(--tinta); font-size: 1.125rem; font-weight: 700; }
.pizarra-interior { align-items: center; }
.tasa-ecuacion { font-size: clamp(1.5rem, 5vw, 2.25rem); margin-top: .25rem; }
.pizarra a, .pie a, .aviso a { color: var(--enlace); }
button.texto { color: var(--enlace); }
.producto, .panel-carrito, .dia { border-radius: .625rem; }
button.chip[aria-pressed="true"] { background: var(--tinta); color: var(--hoja); }
:focus-visible { outline-color: var(--enlace); }

/* Aspecto de tienda de moda masiva: cabecera negra, fondo gris claro y rejilla densa de fotos sin marco. */
:root { --hoja: #f5f5f5; --papel: #ffffff; --tinta: #222222; --tinta-suave: #767676; --linea: #e5e5e5; --cobalto: #222222; --cobalto-texto: #ffffff; --enlace: #1a5fb4; --precio: #d9411e; --pizarra: #000000; --pizarra-texto: #ffffff; --pizarra-suave: #b5b5b5; }
@media (prefers-color-scheme: light) { :root { --hoja: #f5f5f5; --papel: #ffffff; --tinta: #222222; --tinta-suave: #767676; --linea: #e5e5e5; --cobalto: #222222; --cobalto-texto: #ffffff; --enlace: #1a5fb4; --pizarra: #000000; --pizarra-texto: #ffffff; --pizarra-suave: #b5b5b5; } }

.pizarra { border-bottom: 0; padding: .875rem 0; }
.pizarra .pizarra-interior > div { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem 1.25rem; }
.pizarra h1 { color: #fff; font-size: 1.5rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.pizarra .tasa { display: flex; flex-wrap: wrap; align-items: center; gap: 0 .75rem; }
.pizarra .tasa-ecuacion { margin: 0; font-size: 1rem; font-weight: 700; background: #fff; color: #000; border-radius: 999px; padding: .2rem .8rem; }
.pizarra .pizarra-nota { margin: 0; font-size: .8125rem; }
.pizarra a { color: #fff; }

main { padding-top: 1.25rem; }
h2 { font-size: 1.125rem; }
.rejilla { grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr)); gap: 1.25rem .75rem; }
@media (min-width: 60rem) { .rejilla { grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); } }

.producto { display: grid; grid-template-columns: 1fr auto; align-content: start; gap: .375rem .5rem; background: transparent; border: 0; border-radius: 0; padding: 0; }
.producto .foto { grid-column: 1 / -1; aspect-ratio: 3 / 4; background: #fff; border-radius: 0; padding: .5rem; }
.producto h3 { grid-column: 1 / -1; font-size: .875rem; font-weight: 400; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.producto .categoria { display: none; }
.etiqueta { grid-column: 1; margin: 0; background: none; color: var(--precio); padding: 0; clip-path: none; }
.etiqueta::before { display: none; }
.precio-usd { font-size: 1.25rem; font-weight: 800; }
.precio-bs { font-size: .8125rem; color: var(--tinta-suave); }
.producto button.primario { grid-column: 2; align-self: end; width: 2.25rem; height: 2.25rem; padding: 0; border-radius: 50%; background: transparent; color: var(--tinta); border: 1.5px solid var(--tinta); font-size: 0; position: relative; }
.producto button.primario::before { content: "+"; font-size: 1.5rem; line-height: 1; position: absolute; inset: 0; display: grid; place-items: center; padding-bottom: .1rem; }
.producto button.primario:hover { background: var(--tinta); color: #fff; filter: none; }

button.chip { background: #fff; border-color: transparent; }
button.chip[aria-pressed="true"] { background: #000; color: #fff; }
.panel-carrito { border-radius: .25rem; border: 0; }
input[type="search"], select.campo { border-radius: 999px; padding-inline: 1rem; }

.esq-tasa { width: 9rem; height: 1.75rem; border-radius: 999px; background: #333; }
.esq-producto { display: grid; gap: .5rem; align-content: start; }
.esq-foto { aspect-ratio: 3 / 4; border-radius: 0; background: #e8e8e8; }
.esq-linea { height: .875rem; background: #e8e8e8; }
.esq-linea.corta { width: 55%; }

.pizarra-interior { gap: .5rem 1.5rem; }
.pizarra-enlace { margin: 0; }