/* La Blanquería, tienda online (producción). Sistema R9 Riel. Tenor Sans + Hind.
   Paleta del local: frente gris pizarra, cartel blanco con floreado de línea, escalón amarillo. */
:root {
  --blanco: #FFFFFF;
  --algodon: #F1F3F4;
  --niebla: #E3E7E9;
  --plata: #C3C9CD;
  --pizarra: #3E4448;
  --tinta: #1E2225;
  --gris: #5A6166;
  --escalon: #F2C230;
  --escalon-osc: #D9A915;
  --escalon-claro: #FCF2CF;
  --wsp: #1C7F46;
  --rojo: #A8322C;
  --lado: clamp(16px, 2.8vw, 56px);
  --barra: 60px;
  --rad: 6px;
  --t1: "Tenor Sans", "Gill Sans", sans-serif;
  --t2: "Hind", system-ui, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--barra) + 12px); -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--blanco); color: var(--tinta); font: 400 17px/1.6 var(--t2); }
img, svg, picture { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; }
button, input, select { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3 { font-family: var(--t1); font-weight: 400; line-height: 1.12; margin: 0; letter-spacing: .005em; }
h2 { font-size: clamp(30px, 3.1vw, 46px); }
h3 { font-size: clamp(22px, 1.8vw, 27px); }
p { margin: 0; }
.oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.saltar { position: absolute; left: -999px; top: 8px; z-index: 99; background: var(--escalon); padding: 8px 14px; }
.saltar:focus { left: 8px; }
:focus-visible { outline: 3px solid var(--escalon-osc); outline-offset: 2px; }

/* Botones */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 50px; padding: 0 24px; border-radius: var(--rad); border: 0; font: 600 16.5px/1 var(--t2); text-decoration: none; transition: background .2s, transform .15s, box-shadow .2s; }
.btn:active { transform: translateY(1px); }
.btn-amarillo { background: var(--escalon); color: var(--tinta); border: 1px solid #E0AE17; }
.btn-amarillo:hover { background: #F5CC4B; }
.btn-linea { background: transparent; color: var(--tinta); box-shadow: inset 0 0 0 1.5px var(--plata); }
.btn-linea:hover { box-shadow: inset 0 0 0 1.5px var(--pizarra); }
.btn-wsp { background: var(--wsp); color: #fff; }
.btn-wsp:hover { background: #176c3b; }
.link-medida { font-weight: 600; text-decoration: underline; text-decoration-color: var(--escalon); text-decoration-thickness: 3px; text-underline-offset: 6px; }
.link-medida:hover { text-decoration-color: var(--escalon-osc); }

/* Floreado de línea, como el cartel del frente */
.floreado { position: absolute; inset: 0; background: var(--niebla); -webkit-mask: url(../img/floreado.svg) center / 760px auto repeat; mask: url(../img/floreado.svg) center / 760px auto repeat; pointer-events: none; }

/* Barra */
.barra { position: sticky; top: 0; z-index: 40; height: var(--barra); display: flex; align-items: center; gap: 28px; padding: 0 var(--lado); background: rgba(255,255,255,.96); border-bottom: 1px solid var(--niebla); backdrop-filter: saturate(1.4) blur(6px); }
.barra-logo img { width: 168px; height: auto; transition: opacity .25s; }
.barra-logo { display: none; }
.barra.con-logo .barra-logo { display: block; animation: aparece-logo .3s ease; }
@keyframes aparece-logo { from { opacity: 0; } }
.barra-nav { display: flex; gap: 26px; }
.barra-nav a { text-decoration: none; font-weight: 500; font-size: 16.5px; padding: 6px 0; border-bottom: 2px solid transparent; }
.barra-nav a:hover { border-color: var(--escalon); }
.barra-acc { display: flex; align-items: center; gap: 18px; margin-left: auto; }
.estado { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; color: var(--gris); }
.estado i, .estado-grande i { width: 9px; height: 9px; border-radius: 50%; background: var(--wsp); box-shadow: 0 0 0 4px rgba(28,127,70,.14); }
.estado.cerrado i, .estado-grande.cerrado i { background: #B4BABE; box-shadow: 0 0 0 4px rgba(90,97,102,.12); }
.estado b { font-weight: 600; color: var(--tinta); }
.btn-carrito { display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 14px 0 12px; border-radius: var(--rad); border: 1.5px solid var(--plata); background: #fff; font-weight: 600; font-size: 15.5px; }
.btn-carrito svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.btn-carrito b { min-width: 24px; height: 24px; border-radius: 12px; background: var(--escalon); display: inline-grid; place-items: center; font-size: 14px; padding: 0 6px; }
.btn-carrito.salta b { animation: salta .5s ease; }
@keyframes salta { 40% { transform: scale(1.35); } }

/* Portada */
.portada { display: grid; grid-template-columns: minmax(0, clamp(420px, 37vw, 720px)) minmax(0, 1fr); grid-template-rows: 1fr auto; height: calc(100svh - var(--barra)); min-height: 600px; max-height: 1200px; }
.portada-ficha { position: relative; display: flex; flex-direction: column; justify-content: center; gap: clamp(12px, 2.2vh, 24px); padding: clamp(18px, 3vh, 40px) var(--lado); overflow: visible; z-index: 2; }
.portada-ficha .floreado { opacity: .7; -webkit-mask-size: 640px auto; mask-size: 640px auto; }
.portada-ficha > *:not(.floreado) { position: relative; }
.portada-logo { width: 100%; max-width: min(100%, 86vh); height: auto; }
.portada h1 { font-size: clamp(26px, min(2.3vw, 4.2vh), 40px); }
.portada-bajada { color: var(--gris); font-size: clamp(16px, 1.15vw, 18.5px); max-width: 48ch; }
.portada-acc { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 26px; }
.portada-foto { position: relative; margin: 0; min-height: 0; overflow: hidden; }
.portada-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 62%; animation: entra 1.4s cubic-bezier(.2,.7,.2,1) both; transform-origin: 62% 60%; }
@keyframes entra { from { transform: scale(1.06); opacity: .4; } }
figcaption { position: absolute; right: 10px; bottom: 8px; font-size: 12.5px; color: var(--tinta); background: rgba(255,255,255,.82); padding: 2px 8px; border-radius: 3px; }

/* Buscador */
.buscador { position: relative; display: flex; align-items: center; height: 52px; border: 1.5px solid var(--plata); border-radius: var(--rad); background: #fff; max-width: 520px; }
.buscador:focus-within { border-color: var(--pizarra); }
.buscador svg { width: 22px; height: 22px; margin-left: 14px; flex: none; fill: none; stroke: var(--gris); stroke-width: 1.8; }
.buscador input { flex: 1; height: 100%; border: 0; background: transparent; padding: 0 14px 0 10px; font-size: 16.5px; outline: none; min-width: 0; }
.sugerencias { position: absolute; left: -1.5px; right: -1.5px; top: calc(100% + 6px); margin: 0; padding: 6px; list-style: none; background: #fff; border-radius: var(--rad); box-shadow: 0 0 0 1px rgba(30,34,37,.08), 0 18px 40px -18px rgba(30,34,37,.35); z-index: 30; max-height: 360px; overflow: auto; }
.sugerencias li { display: flex; align-items: center; gap: 12px; padding: 7px 8px; border-radius: 4px; cursor: pointer; }
.sugerencias li[aria-selected=true], .sugerencias li:hover { background: var(--algodon); }
.sugerencias img { width: 46px; height: 46px; border-radius: 4px; object-fit: cover; }
.sugerencias b { font-weight: 500; display: block; line-height: 1.25; }
.sugerencias small { color: var(--gris); }
.sugerencias .nada { color: var(--gris); cursor: default; }

/* Riel */
.riel-zona { grid-column: 1 / -1; min-width: 0; background: var(--algodon); padding: 12px 0 14px; border-top: 1px solid var(--niebla); }
.riel-cab { display: flex; align-items: center; gap: 20px; padding: 0 var(--lado) 10px; }
.riel-cab h2 { margin-right: auto; }
.riel-cab h2 { font-size: clamp(19px, 1.5vw, 23px); }
.riel-flechas { display: flex; gap: 8px; }
.riel-flechas button { width: 40px; height: 40px; border-radius: 50%; border: 1.5px solid var(--plata); background: #fff; display: grid; place-items: center; }
.riel-flechas svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; }
.riel { display: flex; gap: 14px; overflow-x: auto; padding: 2px var(--lado) 4px; scroll-snap-type: x mandatory; scrollbar-width: none; cursor: grab; scroll-padding-left: var(--lado); }
.riel::-webkit-scrollbar { display: none; }
.riel.arrastrando { cursor: grabbing; scroll-snap-type: none; }
.riel.arrastrando * { pointer-events: none; }
.rc { flex: 0 0 clamp(290px, 22vw, 360px); scroll-snap-align: start; display: grid; grid-template-columns: clamp(84px, min(7vw, 12vh), 116px) 1fr; gap: 12px; align-items: center; background: #fff; border-radius: var(--rad); padding: 8px; text-align: left; border: 1px solid var(--niebla); user-select: none; }
.rc picture, .rc .gift { width: 100%; aspect-ratio: 4 / 5; border-radius: 4px; overflow: hidden; }
.rc img { width: 100%; height: 100%; object-fit: cover; -webkit-user-drag: none; }
.rc b { font-weight: 500; font-size: 15px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rc .rc-precio { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 6px; }
.rc .rc-precio span { font-family: var(--t1); font-size: 19px; line-height: 1.15; }
.rc .rc-precio small { display: block; font-family: var(--t2); font-size: 13px; color: var(--gris); }
.rc .mas { width: 34px; height: 34px; border-radius: 50%; border: 0; background: var(--escalon); font-size: 22px; line-height: 1; display: grid; place-items: center; flex: none; }
.rc .mas.ok { background: var(--wsp); color: #fff; }

/* Cinta */
.cinta { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid var(--niebla); }
.cinta-item { display: flex; align-items: center; gap: 14px; padding: 22px var(--lado); border-right: 1px solid var(--niebla); }
.cinta-item:last-child { border-right: 0; }
.cinta-item svg { width: 30px; height: 30px; flex: none; fill: none; stroke: var(--pizarra); stroke-width: 1.5; stroke-linejoin: round; stroke-linecap: round; }
.cinta-item p { font-size: 15.5px; line-height: 1.35; color: var(--gris); }
.cinta-item b { color: var(--tinta); font-weight: 600; }

/* Categorías */
.cats-grilla { display: grid; grid-template-columns: repeat(8, 1fr); }
.cat { position: relative; display: flex; flex-direction: column; border: 0; padding: 0; background: #fff; text-align: left; }
.cat span { flex: 1; }
.cat picture { aspect-ratio: 4 / 5; overflow: hidden; }
.cat img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.cat:hover img { transform: scale(1.04); }
.cat span { display: block; padding: 12px 14px 16px; font-family: var(--t1); font-size: clamp(17px, 1.25vw, 21px); line-height: 1.2; background: #fff; border-right: 1px solid var(--niebla); border-bottom: 1px solid var(--niebla); }
.cat span small { display: block; font-family: var(--t2); font-size: 14px; color: var(--gris); margin-top: 2px; }

/* Medida y Armá su cama */
.medida { display: grid; grid-template-columns: minmax(0, clamp(340px, 31vw, 560px)) 1fr; gap: 0; background: var(--algodon); }
.medida-texto { padding: clamp(48px, 7vw, 96px) var(--lado); display: flex; flex-direction: column; gap: 22px; }
.medida-texto > p { color: var(--gris); max-width: 46ch; }
.chips-medida { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { min-height: 44px; padding: 0 16px; border-radius: 22px; border: 1.5px solid var(--plata); background: #fff; font-weight: 500; font-size: 15.5px; }
.chip[aria-checked=true], .chip[aria-pressed=true] { background: var(--pizarra); border-color: var(--pizarra); color: #fff; }
.medida-datos { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 0; margin: 0; border-top: 1px solid var(--plata); border-bottom: 1px solid var(--plata); }
.medida-datos div { padding: 14px 12px 14px 0; }
.medida-datos dt { font-size: 14px; color: var(--gris); }
.medida-datos dd { margin: 2px 0 0; font-family: var(--t1); font-size: clamp(17px, 1.25vw, 20px); }
.medida-texto .btn { align-self: flex-start; }
.cama-zona { display: grid; grid-template-columns: 1fr minmax(0, 420px); gap: clamp(20px, 3vw, 48px); padding: clamp(40px, 6vw, 80px) var(--lado); background: #fff; align-items: center; position: relative; }
.cama { width: 100%; max-height: 620px; }
.cama #camaGrupo { transition: transform .5s cubic-bezier(.2,.7,.2,1); }
.cama rect { transition: x .5s cubic-bezier(.2,.7,.2,1), width .5s cubic-bezier(.2,.7,.2,1), fill .35s; }
.cota line { stroke: var(--gris); stroke-width: 1.2; marker-start: none; }
.cota text { font: 500 13px var(--t2); fill: var(--gris); }
.arma { display: flex; flex-direction: column; gap: 16px; }
.arma h3 { font-size: clamp(24px, 2vw, 30px); }
.arma-paso { display: grid; gap: 8px; }
.arma-paso > span { font-size: 14.5px; color: var(--gris); font-weight: 500; }
.arma-op { display: grid; gap: 8px; }
.op { display: grid; grid-template-columns: 52px 1fr auto; gap: 12px; align-items: center; padding: 6px 10px 6px 6px; border: 1.5px solid var(--niebla); border-radius: var(--rad); background: #fff; text-align: left; }
.op img { width: 52px; height: 52px; border-radius: 4px; object-fit: cover; }
.op b { font-weight: 500; font-size: 15px; line-height: 1.3; }
.op em { font-style: normal; font-size: 15px; color: var(--gris); white-space: nowrap; }
.op[aria-pressed=true] { border-color: var(--pizarra); box-shadow: inset 0 0 0 1px var(--pizarra); }
.contador { display: inline-flex; align-items: center; border: 1.5px solid var(--plata); border-radius: var(--rad); height: 46px; background: #fff; justify-self: start; }
.contador button { width: 44px; height: 100%; border: 0; background: none; font-size: 20px; }
.contador output { min-width: 32px; text-align: center; font-weight: 600; }
.arma-check { display: flex; align-items: center; gap: 10px; font-size: 15.5px; cursor: pointer; }
.arma-check input { width: 20px; height: 20px; accent-color: var(--pizarra); }
.arma-total { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding-top: 16px; border-top: 1px solid var(--niebla); }
.arma-total small { display: block; font-size: 14px; color: var(--gris); }
.arma-total s { color: var(--gris); margin-right: 8px; font-size: 15px; }
.arma-total strong { font-family: var(--t1); font-weight: 400; font-size: 28px; }

/* Catálogo */
.catalogo { padding: clamp(56px, 7vw, 104px) 0 clamp(48px, 6vw, 88px); }
.cat-cab { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 0 var(--lado); }
.cat-cab p { color: var(--gris); }
.filtros { display: grid; grid-template-columns: 1fr auto; gap: 12px 24px; padding: 22px var(--lado) 26px; align-items: center; }
.filtro-fila { display: flex; flex-wrap: wrap; gap: 8px; }
.filtro-medida { grid-column: 1; align-items: center; }
.filtro-medida > span { font-size: 15px; color: var(--gris); margin-right: 4px; }
.filtro-medida > div { display: flex; flex-wrap: wrap; gap: 8px; }
.orden { grid-column: 2; grid-row: 1 / span 2; display: flex; align-items: center; gap: 10px; font-size: 15px; color: var(--gris); }
.orden select { height: 44px; border: 1.5px solid var(--plata); border-radius: var(--rad); padding: 0 12px; background: #fff; color: var(--tinta); }
.grilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); border-top: 1px solid var(--niebla); }
.prod { position: relative; display: flex; flex-direction: column; border-right: 1px solid var(--niebla); border-bottom: 1px solid var(--niebla); background: #fff; }
.prod-foto { position: relative; display: block; border: 0; padding: 0; background: var(--algodon); cursor: pointer; }
.prod-foto picture, .prod-foto .gift { aspect-ratio: 4 / 5; overflow: hidden; }
.prod-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.prod:hover .prod-foto img { transform: scale(1.035); }
.sello { position: absolute; left: 12px; top: 12px; background: var(--escalon); color: var(--tinta); font-size: 13.5px; font-weight: 600; padding: 3px 9px; border-radius: 3px; }
.prod-info { display: flex; flex-direction: column; gap: 6px; padding: 16px 18px 20px; flex: 1; }
.prod-info h3 { font-family: var(--t2); font-weight: 500; font-size: 17px; line-height: 1.35; }
.prod-info h3 button { all: unset; cursor: pointer; }
.prod-info h3 button:focus-visible { outline: 3px solid var(--escalon-osc); }
.medidas-mini { display: flex; flex-wrap: wrap; gap: 4px; }
.medidas-mini span { font-size: 13px; padding: 1px 7px; border: 1px solid var(--niebla); border-radius: 3px; color: var(--gris); }
.medidas-mini span.si { border-color: var(--pizarra); color: var(--tinta); }
.prod-pie { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 8px; }
.precio { font-family: var(--t1); font-size: 24px; line-height: 1.1; }
.precio small { display: block; font-family: var(--t2); font-size: 14px; color: var(--gris); margin-top: 3px; }
.prod .btn { min-height: 44px; padding: 0 16px; font-size: 15.5px; }
.vacio { padding: 40px var(--lado); color: var(--gris); }
.vacio button { border: 0; background: none; text-decoration: underline; font-weight: 600; }
.gift { display: grid; place-items: center; background: var(--pizarra); position: relative; overflow: hidden; }
.gift svg { width: 78%; height: auto; }

/* Navidad */
.navidad { display: grid; grid-template-columns: 55fr 45fr; background: #fff; border-top: 1px solid var(--niebla); }
.navidad-foto { position: relative; margin: 0; min-height: 520px; }
.navidad-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.navidad-texto { padding: clamp(44px, 5vw, 80px) var(--lado); display: flex; flex-direction: column; gap: 18px; }
.navidad-texto > p { color: var(--gris); max-width: 46ch; }
.navidad-texto h2 { color: var(--rojo); }
.regalos { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 6px; }
.regalos .rc { flex: none; grid-template-columns: 76px 1fr; }

/* Por mayor */
.mayor { position: relative; display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; gap: 10px 40px; align-items: center; padding: clamp(40px, 5vw, 64px) var(--lado); background: var(--escalon-claro); overflow: hidden; }
.mayor .floreado-suave { background: #F3DE97; -webkit-mask-size: 560px auto; mask-size: 560px auto; opacity: .7; }
.mayor > *:not(.floreado) { position: relative; }
.mayor h2 { font-size: clamp(24px, 2.3vw, 34px); max-width: 30ch; }
.mayor p { color: #3A3420; max-width: 60ch; grid-column: 1; }
.mayor .btn { grid-column: 2; grid-row: 1 / span 2; }

/* Local */
.local { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); grid-template-rows: auto auto; }
.local-fotos { display: grid; grid-template-columns: 2fr 1fr 1fr; min-height: 520px; }
.local-fotos figure { margin: 0; position: relative; overflow: hidden; }
.local-fotos img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.local-info { padding: clamp(40px, 5vw, 72px) var(--lado); display: flex; flex-direction: column; gap: 16px; background: var(--algodon); }
.dir { font-family: var(--t1); font-size: clamp(22px, 1.9vw, 29px); line-height: 1.3; }
.estado-grande { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; }
.horario { border-collapse: collapse; width: 100%; max-width: 420px; font-size: 16px; }
.horario th { text-align: left; font-weight: 400; padding: 6px 0; color: var(--gris); }
.horario td { text-align: right; padding: 6px 0; }
.horario tr { border-bottom: 1px solid var(--niebla); }
.horario tr.hoy th, .horario tr.hoy td { color: var(--tinta); font-weight: 600; }
.local-acc { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; margin-top: 6px; }
.link-ig { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; text-decoration: none; padding: 8px 2px; }
.link-ig svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.mapa { grid-column: 1 / -1; height: clamp(320px, 38vw, 460px); background: var(--niebla); }
.mapa iframe { width: 100%; height: 100%; border: 0; display: block; filter: grayscale(.35); }

/* Reseñas */
.resenas { display: grid; grid-template-columns: minmax(0, clamp(260px, 22vw, 380px)) 1fr; gap: 24px clamp(24px, 4vw, 72px); padding: clamp(56px, 7vw, 96px) var(--lado); }
.res-nota { display: flex; flex-direction: column; gap: 6px; }
.res-num { font-family: var(--t1); font-size: clamp(64px, 6vw, 96px); line-height: 1; }
.res-estrellas { color: var(--escalon-osc); font-size: 26px; letter-spacing: 3px; }
.res-nota h2 { font-size: clamp(24px, 2vw, 30px); margin-bottom: 8px; }
.res-lista { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 1px solid var(--niebla); }
.res { padding: 22px 22px 22px 0; border-bottom: 1px solid var(--niebla); display: flex; flex-direction: column; gap: 10px; }
.res + .res { padding-left: 22px; border-left: 1px solid var(--niebla); }
.res p { font-size: 17px; }
.res footer { font-size: 15px; color: var(--gris); }
.res footer b { color: var(--tinta); font-weight: 600; }
.res-frases { grid-column: 2; list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.res-frases li { background: var(--algodon); padding: 8px 14px; border-radius: 20px; font-size: 15.5px; }

/* FAQ */
.faq { display: grid; grid-template-columns: minmax(0, clamp(260px, 22vw, 380px)) 1fr; gap: 24px clamp(24px, 4vw, 72px); padding: 0 var(--lado) clamp(56px, 7vw, 96px); }
.faq-lista { border-top: 1px solid var(--niebla); }
.faq details { border-bottom: 1px solid var(--niebla); }
.faq summary { cursor: pointer; padding: 18px 40px 18px 0; font-size: 18px; font-weight: 500; list-style: none; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 6px; top: 12px; font-size: 26px; color: var(--gris); }
.faq details[open] summary::after { content: "−"; }
.faq details p { padding: 0 0 20px; color: var(--gris); max-width: 70ch; }

.seo { padding: clamp(40px, 5vw, 64px) var(--lado); background: var(--algodon); border-top: 1px solid var(--niebla); display: grid; grid-template-columns: minmax(0, clamp(260px, 22vw, 380px)) 1fr; gap: 16px clamp(24px, 4vw, 72px); }
.seo h2 { font-size: clamp(22px, 1.8vw, 28px); }
.seo p { color: var(--gris); max-width: 75ch; }

.pie { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 32px; padding: 36px var(--lado) 96px; background: var(--niebla); }
.pie img { width: 220px; }
.pie p { color: var(--gris); font-size: 15.5px; }

/* WhatsApp fijo y aviso */
.wsp-fijo { position: fixed; right: 18px; bottom: 18px; z-index: 35; width: 58px; height: 58px; border-radius: 50%; background: var(--wsp); color: #fff; display: grid; place-items: center; box-shadow: 0 10px 24px -8px rgba(0,0,0,.4); }
.wsp-fijo svg { width: 30px; height: 30px; }

/* Ficha */
.ficha { width: min(980px, calc(100vw - 32px)); max-height: calc(100svh - 32px); border: 0; border-radius: 8px; padding: 0; overflow: auto; color: var(--tinta); }
.ficha[open] { display: grid; grid-template-columns: 1fr 1fr; }
.ficha::backdrop { background: rgba(30,34,37,.5); }
.ficha-foto { position: relative; background: var(--algodon); }
.ficha-foto picture, .ficha-foto .gift { aspect-ratio: 4 / 5; height: 100%; }
.ficha-foto img { width: 100%; height: 100%; object-fit: cover; }
.ficha-info { padding: 36px 32px 28px; display: flex; flex-direction: column; gap: 14px; }
.ficha-cat { font-size: 14.5px; color: var(--gris); }
.ficha-info h3 { font-size: clamp(24px, 2.2vw, 32px); }
.ficha-det { color: var(--gris); }
.ficha-var { display: flex; flex-wrap: wrap; gap: 8px; }
.ficha-precio strong { display: block; font-family: var(--t1); font-weight: 400; font-size: 34px; }
.ficha-precio span { color: var(--gris); font-size: 15px; }
.ficha-comprar { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.ficha-comprar .btn { flex: 1; min-width: 200px; }
.ficha-nota { font-size: 13.5px; color: var(--gris); }
.cerrar { position: absolute; right: 10px; top: 10px; z-index: 3; width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(255,255,255,.92); font-size: 26px; line-height: 1; }

/* Carrito y checkout */
.velo { position: fixed; inset: 0; background: rgba(30,34,37,.45); z-index: 49; }
.carrito { position: fixed; top: 0; right: 0; bottom: 0; z-index: 50; width: min(480px, 100vw); background: #fff; display: flex; flex-direction: column; transform: translateX(104%); transition: transform .35s cubic-bezier(.2,.7,.2,1); box-shadow: -20px 0 50px -30px rgba(0,0,0,.5); }
.carrito:not(.abierto) { visibility: hidden; transition: transform .35s cubic-bezier(.2,.7,.2,1), visibility 0s .35s; }
.carrito.abierto { transform: none; }
.car-cab { display: flex; align-items: center; gap: 12px; padding: 14px 64px 14px 20px; border-bottom: 1px solid var(--niebla); position: relative; min-height: 64px; }
.car-cab .cerrar { top: 12px; background: var(--algodon); }
.pasos { display: flex; gap: 6px; margin: 0; padding: 0; list-style: none; flex: 1; }
.pasos li { display: flex; align-items: center; gap: 6px; font-size: 14.5px; color: var(--gris); flex: 1; }
.pasos li b { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; border: 1.5px solid var(--plata); font-size: 13.5px; flex: none; }
.pasos li.activo { color: var(--tinta); font-weight: 600; }
.pasos li.activo b { background: var(--escalon); border-color: var(--escalon); }
.pasos li.hecho b { background: var(--pizarra); border-color: var(--pizarra); color: #fff; }
.paso { flex: 1; overflow: auto; padding: 18px 20px; margin: 0; }
.car-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.car-item { display: grid; grid-template-columns: 72px 1fr auto; gap: 12px; align-items: start; padding-bottom: 14px; border-bottom: 1px solid var(--niebla); }
.car-item img, .car-item .gift { width: 72px; height: 72px; border-radius: 4px; object-fit: cover; }
.car-item b { font-weight: 500; font-size: 15.5px; line-height: 1.3; display: block; }
.car-item small { color: var(--gris); font-size: 14px; }
.car-item .contador { height: 36px; margin-top: 8px; }
.car-item .contador button { width: 34px; font-size: 17px; }
.car-item .precio-item { font-weight: 600; white-space: nowrap; text-align: right; }
.car-item .quitar { display: block; margin-top: 8px; border: 0; background: none; color: var(--gris); text-decoration: underline; font-size: 14px; padding: 0; margin-left: auto; }
.car-vacio { color: var(--gris); padding: 20px 0; }
fieldset { border: 0; margin: 0 0 18px; padding: 0; display: grid; gap: 10px; }
legend { font-family: var(--t1); font-size: 22px; margin-bottom: 10px; padding: 0; }
.opcion { display: grid; grid-template-columns: 22px 1fr auto; gap: 12px; align-items: start; padding: 14px; border: 1.5px solid var(--niebla); border-radius: var(--rad); cursor: pointer; }
.opcion:has(input:checked) { border-color: var(--pizarra); box-shadow: inset 0 0 0 1px var(--pizarra); background: var(--algodon); }
.opcion input { width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--pizarra); }
.opcion b { font-weight: 600; display: block; }
.opcion small { color: var(--gris); font-size: 14.5px; line-height: 1.4; display: block; }
.opcion em { font-style: normal; font-weight: 600; white-space: nowrap; }
.opcion.deshab { opacity: .45; cursor: not-allowed; }
.campos { display: grid; gap: 12px; }
.campos label { display: grid; gap: 5px; font-size: 15px; font-weight: 500; }
.campos input { height: 48px; border: 1.5px solid var(--plata); border-radius: var(--rad); padding: 0 12px; font-size: 16px; }
.campos input:focus { border-color: var(--pizarra); outline: none; }
.campos input[aria-invalid=true] { border-color: var(--rojo); }
.error { color: var(--rojo); font-size: 15px; margin-top: 10px; }
.cuotas { display: grid; gap: 6px; margin: 0 0 18px; padding: 14px; background: var(--algodon); border-radius: var(--rad); }
.cuotas label { font-size: 15px; font-weight: 500; }
.cuotas select { height: 46px; border: 1.5px solid var(--plata); border-radius: var(--rad); padding: 0 10px; background: #fff; }
.cuotas p { font-size: 15px; color: var(--gris); }
.car-pie { border-top: 1px solid var(--niebla); padding: 14px 20px 16px; display: grid; gap: 10px; background: #fff; }
.totales { margin: 0; display: grid; gap: 4px; }
.totales div { display: flex; justify-content: space-between; font-size: 15.5px; color: var(--gris); }
.totales dd { margin: 0; color: var(--tinta); }
.totales .total { font-size: 19px; color: var(--tinta); font-weight: 600; padding-top: 6px; }
.car-botones { display: flex; gap: 10px; }
.car-botones .btn-amarillo { flex: 1; }
.car-botones .btn[disabled] { opacity: .5; cursor: not-allowed; }
.car-wsp { text-align: center; font-size: 15px; color: var(--wsp); font-weight: 600; }
.recibido { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; padding: 10px 0; }
.recibido > svg { width: 68px; height: 68px; fill: none; stroke: var(--wsp); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.recibido > svg path { stroke-dasharray: 40; stroke-dashoffset: 40; animation: tilde .6s .2s ease forwards; }
@keyframes tilde { to { stroke-dashoffset: 0; } }
.recibido h3 { font-size: 32px; }
.recibido .nro { font-size: 17px; }
.recibido .nro b { font-family: var(--t1); font-size: 22px; font-weight: 400; background: var(--escalon-claro); padding: 2px 10px; border-radius: 4px; }
.recibido > p { color: var(--gris); max-width: 36ch; }
.datos-pago { background: var(--algodon); border-radius: var(--rad); padding: 14px 16px; text-align: left; width: 100%; font-size: 15px; display: grid; gap: 6px; }
.resumen { list-style: none; margin: 0; padding: 0; width: 100%; text-align: left; font-size: 15px; border-top: 1px solid var(--niebla); }
.resumen li { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--niebla); }
.resumen li span:last-child { white-space: nowrap; }
.resumen li.tot { font-weight: 600; }
.recibido .btn { width: 100%; }

/* Cartel emergente */
.cartel { position: fixed; left: 18px; bottom: 54px; z-index: 45; width: min(440px, calc(100vw - 36px)); display: grid; grid-template-columns: 120px 1fr; gap: 16px; background: #fff; border-radius: 8px; padding: 12px 14px 12px 12px; box-shadow: 0 24px 60px -24px rgba(30,34,37,.5); animation: cartel .45s cubic-bezier(.2,.7,.2,1); }
.cartel[hidden] { display: none; }
@keyframes cartel { from { transform: translateY(20px); opacity: 0; } }
.cartel-img img, .cartel-img .sin-foto { width: 120px; height: 120px; border-radius: 5px; object-fit: cover; }
.cartel h3 { font-size: 20px; padding-right: 30px; }
.cartel p { font-size: 15px; color: var(--gris); margin: 6px 0 10px; }
.cartel .btn { min-height: 42px; font-size: 15px; padding: 0 16px; }
.cartel .cerrar { top: 6px; right: 6px; width: 34px; height: 34px; background: var(--algodon); font-size: 22px; }

/* Aparición suave */
.aparece { opacity: 0; transform: translateY(14px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.aparece.visto { opacity: 1; transform: none; }

/* Responsive */
@media (max-width: 1180px) {
  .cats-grilla { grid-template-columns: repeat(4, 1fr); }
  .cama-zona { grid-template-columns: 1fr; }
  .cama { max-height: 380px; }
  .local { grid-template-columns: 1fr; }
}
@media (max-width: 960px) {
  :root { --barra: 58px; }
  .barra { gap: 12px; }
  .barra-nav { display: none; }
  .barra-logo { opacity: 1; pointer-events: auto; margin-right: auto; }
  .barra-logo img { width: 150px; }
  .estado { display: none; }
  .portada { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto; height: auto; min-height: 0; max-height: none; }
  .portada-ficha { padding-top: 22px; padding-bottom: 22px; gap: 14px; }
  .portada-logo { max-width: 100%; }
  .portada-foto { aspect-ratio: 4 / 3; }
  .portada h1 { font-size: 27px; }
  .cinta { grid-template-columns: 1fr 1fr; }
  .cinta-item:nth-child(2) { border-right: 0; }
  .cinta-item:nth-child(-n+2) { border-bottom: 1px solid var(--niebla); }
  .medida { grid-template-columns: 1fr; }
  .medida-texto { padding-bottom: 28px; }
  .navidad { grid-template-columns: 1fr; }
  .navidad-foto { min-height: 0; aspect-ratio: 3 / 2; }
  .mayor { grid-template-columns: 1fr; }
  .mayor .btn { grid-column: 1; grid-row: auto; justify-self: start; }
  .resenas, .faq, .seo { grid-template-columns: 1fr; }
  .res-lista { grid-template-columns: 1fr; }
  .res + .res { padding-left: 0; border-left: 0; }
  .res-frases { grid-column: 1; }
  .filtros { grid-template-columns: 1fr; }
  .orden { grid-column: 1; grid-row: auto; }
  .filtro-fila { flex-wrap: nowrap; overflow-x: auto; margin: 0 calc(var(--lado) * -1); padding: 0 var(--lado) 4px; scrollbar-width: none; }
  .filtro-fila::-webkit-scrollbar { display: none; }
  .filtro-medida > div { flex-wrap: nowrap; }
  .chip { flex: none; }
  .ficha[open] { grid-template-columns: 1fr; }
  .ficha-foto picture, .ficha-foto .gift { height: auto; }
  .ficha-info { padding: 22px 20px 22px; }
}
@media (max-width: 640px) {
  body { font-size: 16.5px; }
  .btn-carrito span { display: none; }
  .cats-grilla { grid-template-columns: repeat(2, 1fr); }
  .grilla { grid-template-columns: 1fr 1fr; }
  .prod-info { padding: 12px 12px 14px; }
  .prod-info h3 { font-size: 15.5px; }
  .precio { font-size: 20px; }
  .prod-pie { flex-direction: column; align-items: stretch; }
  .prod .btn { width: 100%; }
  .medidas-mini { display: none; }
  .cinta-item { padding: 16px var(--lado); gap: 10px; }
  .cinta-item svg { width: 26px; height: 26px; }
  .cinta-item p { font-size: 14.5px; }
  .medida-datos { grid-template-columns: 1fr 1fr 1fr; }
  .medida-datos dd { font-size: 16.5px; }
  .regalos { grid-template-columns: 1fr; }
  .local-fotos { grid-template-columns: 1fr 1fr; grid-template-rows: 240px 200px; min-height: 0; }
  .lf-1 { grid-column: 1 / -1; }
  .rc { flex-basis: 82vw; }
  .cartel { grid-template-columns: 84px 1fr; left: 12px; bottom: 50px; }
  .cartel-img img, .cartel-img .sin-foto { width: 84px; height: 84px; }
  .wsp-fijo { width: 54px; height: 54px; right: 14px; bottom: 14px; }
  .pie { padding-bottom: 110px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  html { scroll-behavior: auto; }
  .aparece { opacity: 1; transform: none; }
}

@media (min-width: 961px) and (max-height: 780px) {
  .portada-ficha { gap: 12px; padding-top: 14px; padding-bottom: 14px; }
  .portada h1 { font-size: 27px; }
  .buscador { height: 48px; }
  .portada-acc .btn { min-height: 46px; }
  .riel-cab { padding-bottom: 8px; }
  .riel-cab h2 { font-size: 19px; }
  .riel-flechas button { width: 36px; height: 36px; }
}

/* ===== Producción (3/11): colores, sin foto, pagos y envíos, datos de cuenta ===== */
.sin-foto { display: grid; place-items: center; align-content: center; gap: 10px; aspect-ratio: 4 / 5; background: var(--algodon); padding: 18%; }
.sin-foto img { width: 100% !important; height: auto !important; object-fit: contain !important; opacity: .55; transform: none !important; }
.sin-foto span { font-size: 13.5px; color: var(--gris); }
.car-item .sin-foto, .op .sin-foto, .sugerencias .sin-foto, .rc .sin-foto, .cartel-img .sin-foto { padding: 10%; }
.car-item .sin-foto span, .op .sin-foto span, .sugerencias .sin-foto span, .rc .sin-foto span, .cartel-img .sin-foto span { display: none; }
.sello-gris { background: var(--pizarra); color: #fff; }
.colores-mini { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.colores-mini i { width: 16px; height: 16px; border-radius: 50%; background: var(--c); box-shadow: inset 0 0 0 1px rgba(30,34,37,.22); }
.colores-mini span { font-size: 13px; color: var(--gris); margin-left: 2px; }
.ficha-grupo { display: grid; gap: 8px; }
.ficha-grupo[hidden] { display: none; }
.ficha-tit { font-size: 14.5px; color: var(--gris); }
.ficha-tit b { color: var(--tinta); font-weight: 600; }
.ficha-colores, .op-colores { display: flex; flex-wrap: wrap; gap: 8px; }
.color { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px 0 8px; border-radius: 22px; border: 1.5px solid var(--plata); background: #fff; font: 500 15px/1.2 var(--t2); color: var(--tinta); cursor: pointer; }
.color i { width: 26px; height: 26px; border-radius: 50%; background: var(--c); box-shadow: inset 0 0 0 1px rgba(30,34,37,.22); flex: none; }
.color[aria-pressed=true] { border-color: var(--pizarra); box-shadow: inset 0 0 0 1.5px var(--pizarra); background: var(--algodon); }
.color[disabled], .chip[disabled] { opacity: .45; cursor: not-allowed; text-decoration: line-through; }
.color-chico { min-height: 36px; font-size: 14px; padding: 0 12px 0 6px; }
.color-chico i { width: 20px; height: 20px; }
.op-colores { padding: 2px 0 4px; }
.btn[disabled] { opacity: .5; cursor: not-allowed; }

.pagos-env { padding: clamp(48px, 6vw, 88px) var(--lado); border-top: 1px solid var(--niebla); display: grid; gap: 28px; }
.pagos-env h2 { font-size: clamp(28px, 2.6vw, 40px); }
.pe-grilla { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 0; border-top: 1px solid var(--niebla); }
.pe-bloque { display: flex; flex-direction: column; gap: 12px; padding: 24px 28px 28px 0; min-width: 0; }
.pe-bloque + .pe-bloque { padding-left: 28px; border-left: 1px solid var(--niebla); }
.pe-bloque h3 { font-size: 22px; }
.pe-bloque p, .pe-bloque li { color: var(--gris); font-size: 16px; }
.pe-bloque b { color: var(--tinta); font-weight: 600; }
.pe-bloque ul { margin: 0; padding: 0 0 0 18px; display: grid; gap: 8px; }
.pe-chico { font-size: 14.5px !important; }
.datos-cuenta { margin: 0; padding: 12px 14px; width: 100%; background: var(--algodon); border-radius: var(--rad); display: grid; gap: 8px; font-size: 15px; text-align: left; }
.datos-cuenta div { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 8px; align-items: center; }
.datos-cuenta dt { font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--gris); }
.datos-cuenta dd { margin: 0; font-weight: 600; color: var(--tinta); display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; min-width: 0; }
.dato-copiar { overflow-wrap: anywhere; min-width: 0; font-size: 16px; }
.copiar { font: 600 13px/1 var(--t2); color: var(--tinta); background: #fff; border: 1.5px solid var(--plata); border-radius: 20px; padding: 7px 12px; cursor: pointer; min-height: 32px; }
.copiar:hover { border-color: var(--pizarra); }
.pago-cuenta { margin: -2px 0 4px 34px; }
.pago-cuenta[hidden] { display: none; }
.nota-total, .nota-confirmar { font-size: 14px; color: var(--gris); text-align: center; margin: 0; }
.nota-total { text-align: right; margin-top: -4px; }
.pasos-recibido { margin: 0; padding: 0 0 0 20px; text-align: left; width: 100%; display: grid; gap: 8px; color: var(--gris); font-size: 15.5px; }
.datos-pago .datos-cuenta { background: #fff; }
.resumen li small { display: block; color: var(--gris); font-size: 13.5px; }
.pie-legal { flex-basis: 100%; font-size: 14px !important; }
@media (max-width: 960px) {
  .pe-bloque, .pe-bloque + .pe-bloque { padding: 22px 0; border-left: 0; border-bottom: 1px solid var(--niebla); }
  .pago-cuenta { margin-left: 0; }
}
.precio .pr { white-space: nowrap; }
.op-col-tit { flex-basis: 100%; font-size: 13.5px; color: var(--gris); }

/* Vuelta de Mercado Pago (pago con tarjeta desde la página, conectado en el panel) */
.mp-vuelta { width: min(520px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); border: 0; border-radius: 6px; padding: 0; background: #fff; color: var(--tinta); }
.mp-vuelta::backdrop { background: rgba(30, 34, 37, .55); }
.mp-vuelta-in { display: grid; gap: 12px; justify-items: center; text-align: center; padding: 30px 24px 24px; }
.mp-vuelta-in h3 { font-family: 'Tenor Sans', sans-serif; font-weight: 400; font-size: clamp(28px, 6vw, 36px); line-height: 1.1; margin: 0; }
.mp-vuelta-in p { margin: 0; max-width: 40ch; }
.mp-ico { width: 64px; height: 64px; fill: none; stroke: #2F7D4A; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.mp-vuelta-in[data-estado="error"] .mp-ico, .mp-vuelta-in[data-estado="error"] h3 { stroke: #A3341F; color: #A3341F; }
.mp-vuelta-in[data-estado="pendiente"] .mp-ico { stroke: #8A5A00; }
.mp-vuelta-acc { display: grid; gap: 10px; width: 100%; padding-top: 8px; }
.mp-vuelta-acc .btn { width: 100%; justify-content: center; }

/* firma de Domo (igual que Pido Gancho) */
.pie-domo{flex-basis:100%;margin-top:6px;padding-top:16px;border-top:1px solid rgba(30,34,37,.14)}.pie-domo a{display:inline-flex;align-items:center;gap:6px;color:var(--gris);font-size:13px;letter-spacing:.06em;text-decoration:none}.pie-domo svg{width:22px;height:11px}.pie-domo b{font-weight:700;color:var(--tinta,#1E2225);letter-spacing:.02em}.pie-domo a:hover b{color:#FF5A1F}

/* Videos del local (3/11): riel de tarjetas 4:5 con la foto del catálogo + play; el mp4 se baja al abrir */
.videos { padding: clamp(48px, 6vw, 88px) 0 clamp(40px, 5vw, 72px); background: var(--algodon); border-top: 1px solid var(--niebla); }
.vid-cab { padding: 0 var(--lado) 22px; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 8px 32px; }
.vid-cab p { color: var(--gris); max-width: 46ch; }
.vid-riel { display: grid; grid-auto-flow: column; grid-auto-columns: clamp(200px, 16vw, 270px); gap: 14px; overflow-x: auto; padding: 0 var(--lado) 8px; scroll-snap-type: x mandatory; scroll-padding-left: var(--lado); scrollbar-width: thin; }
.vid { position: relative; display: flex; flex-direction: column; border: 1px solid var(--niebla); border-radius: var(--rad); padding: 0; background: #fff; text-align: left; overflow: hidden; scroll-snap-align: start; }
.vid picture { aspect-ratio: 4 / 5; overflow: hidden; background: var(--algodon); }
.vid img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.vid:hover img { transform: scale(1.035); }
.vid-play { position: absolute; left: 50%; top: 40%; translate: -50% -50%; width: 58px; height: 58px; border-radius: 50%; background: rgba(255,255,255,.94); color: var(--tinta); display: grid; place-items: center; box-shadow: 0 6px 22px rgba(30,34,37,.18); transition: transform .2s; }
.vid-play svg { width: 24px; height: 24px; margin-left: 3px; }
.vid:hover .vid-play { transform: scale(1.06); }
.vid-txt { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 2px; }
.vid-txt b { font-weight: 500; font-size: 15.5px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vid-txt small { color: var(--gris); font-size: 14px; }
.ver-video { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; border: 0; background: none; padding: 4px 0; font-size: 15px; font-weight: 500; color: var(--pizarra); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--plata); }
.ver-video svg { width: 14px; height: 14px; }
.ver-video small { color: var(--gris); font-weight: 400; }
.ver-video:hover { text-decoration-color: currentColor; }
.ver-video-ficha { font-size: 16px; }
.vid-modal { width: min(440px, calc(100vw - 24px)); max-height: calc(100svh - 24px); border: 0; border-radius: 8px; padding: 0; overflow: hidden; background: var(--tinta); color: #fff; }
.vid-modal[open] { display: flex; flex-direction: column; }
.vid-modal::backdrop { background: rgba(30,34,37,.72); }
.vid-modal video { display: block; width: 100%; height: auto; max-height: calc(100svh - 110px); aspect-ratio: 9 / 16; object-fit: contain; background: var(--tinta); }
.vid-pie { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; }
.vid-pie b { font-weight: 500; font-size: 15px; line-height: 1.3; }
.vid-pie .btn { min-height: 42px; padding: 0 16px; font-size: 15px; flex: none; }
@media (max-width: 640px) {
  .vid-riel { grid-auto-columns: 62vw; }
  .vid-play { width: 50px; height: 50px; }
}
.vid-modal .cerrar { color: var(--tinta); }
/* El local: el frente entero arriba (foto apaisada), el interior abajo */
.local-fotos { grid-template-columns: 1fr 1fr; grid-template-rows: auto clamp(180px, 16vw, 260px); min-height: 0; }
.local-fotos .lf-1 { grid-column: 1 / -1; aspect-ratio: 4 / 3; }
.local-fotos .lf-1 img { object-position: 50% 60%; }
@media (max-width: 720px) { .local-fotos { grid-template-rows: auto 200px; } }