/* letras propias (antes venían de Google: dos conexiones más antes de poder dibujar). Solo el juego latino, que es el que usa la página. */
@font-face{font-family:"Anton";font-style:normal;font-weight:400;font-display:swap;src:url(/sitio/fuentes/anton-latin.woff2) format("woff2")}
@font-face{font-family:"Work Sans";font-style:normal;font-weight:400 600;font-display:swap;src:url(/sitio/fuentes/work-sans-latin.woff2) format("woff2")}
/* Casa de Lavado · página pública (casadelavado.com.ar). Jesica, 5/11/2026.
   Un solo blanco (hueso) en toda la página: el lavarropas 3D va recortado, sin el cuadrado blanco del ícono.
   Rojo de la marca para los campos de color. Anton para títulos, Work Sans para el texto.
   Todo movimiento usa transform/opacity y se apaga con "reducir movimiento" (salvo el giro lento del tambor). */
:root{
  --hueso:#f4f1ec;--papel:var(--hueso);--tinta:#1e1616;--gris:#6b605d;--linea:#e2dbd2;
  --rojo:#c4141c;--rojo-hondo:#8f0d13;--rojo-claro:#fbe3e0;--rojo-texto:#b3121a;
  --verde:#1f8a4c;
  --display:"Anton",Impact,"Arial Narrow Bold",sans-serif;
  --texto:"Work Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --margen:clamp(16px,4vw,56px);
  --t-chico:clamp(1rem,.97rem + .1vw,1.0625rem);
  --t-cuerpo:clamp(1.0625rem,1rem + .25vw,1.1875rem);
  --t-lead:clamp(1.25rem,1.1rem + .7vw,1.625rem);
  --t-titulo:clamp(3rem,1.6rem + 6.2vw,7.5rem);
  --ease:cubic-bezier(.2,.8,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--rojo)}
body{margin:0;background:var(--hueso);color:var(--tinta);font:400 var(--t-cuerpo)/1.55 var(--texto);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:400}
p{margin:0;text-wrap:pretty}
h1,h2,h3,.portal-lema,.pie-lema{text-wrap:balance}
svg{flex:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.saltar{position:absolute;left:12px;top:-60px;z-index:100;background:var(--tinta);color:var(--hueso);padding:10px 16px;border-radius:999px;text-decoration:none}
.saltar:focus{top:12px}
:focus-visible{outline:3px solid var(--rojo);outline-offset:3px}
.servicio button:focus-visible{outline:3px solid var(--hueso);outline-offset:-3px}
.item:focus-visible{outline:3px solid var(--rojo-claro);outline-offset:0}
.ticket-limpiar:focus-visible,.ticket-sacar:focus-visible{outline:2px solid var(--rojo);outline-offset:2px}
.pie :focus-visible,.servicios :focus-visible{outline-color:var(--hueso)}
section[id]{scroll-margin-top:76px}
[data-link-precios].sin-precios{visibility:hidden}
.marco{width:100%;max-width:1440px;margin:0 auto;padding:0 var(--margen)}
.h-grande{font-family:var(--display);font-size:var(--t-titulo);line-height:.9;letter-spacing:-.01em;text-transform:uppercase}
/* relieve de las letras sobre rojo y oscuro (como el logo): luz arriba, sombra abajo */
.servicios .h-grande,.servicio-nombre,.portal-lema,.pie-lema{text-shadow:0 -1px 0 rgba(255,255,255,.25),0 2px 0 rgba(0,0,0,.12),0 6px 12px rgba(60,5,8,.28),0 18px 30px rgba(60,5,8,.22)}
.pasos .h-grande,.barrio-cabeza .h-grande,.donde .h-grande{text-shadow:0 2px 0 rgba(255,255,255,.9),0 3px 1px rgba(80,20,20,.10),0 8px 14px rgba(80,20,20,.07)}

/* Botones: píldora llena, un solo estilo en toda la página */
.boton{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border-radius:999px;background:var(--rojo);color:#fff;font:600 1rem/1 var(--texto);text-decoration:none;border:0;cursor:pointer;transition:transform .25s var(--ease),background .25s}
.boton svg{width:22px;height:22px}
.boton:hover{background:var(--rojo-hondo);transform:translateY(-2px)}
.boton:active{transform:translateY(0) scale(.97)}
.boton-claro{background:var(--tinta)}
.boton-claro:hover{background:#000}
.boton-chico{min-height:44px;padding:0 18px;font-size:.95rem}
.boton-chico svg{width:20px;height:20px}
.boton-bloque{width:100%}

/* Barra de arriba: aparece sola (sin fondo) sobre la portada y toma fondo al bajar */
.barra{position:fixed;inset:0 0 auto;z-index:40;display:flex;align-items:center;gap:24px;padding:14px max(var(--margen),calc((100vw - 1440px) / 2 + var(--margen)));transition:background .3s,transform .4s var(--ease)}
.barra[data-con-fondo]{background:var(--hueso);box-shadow:0 10px 30px -18px rgba(60,20,20,.35)}
.barra[data-escondida]{transform:translateY(-110%)}
.marca{display:flex;align-items:center;gap:10px;white-space:nowrap;min-height:44px;text-decoration:none;font:600 1.05rem/1 var(--texto);color:var(--rojo-texto)}
.marca-icono{width:34px;height:34px;color:var(--rojo)}
.barra-links{display:flex;gap:28px;margin-left:auto}
.barra-links a{text-decoration:none;font-weight:500;position:relative;padding:6px 0}
.barra-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--rojo);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.barra-links a:hover::after{transform:scaleX(1)}
@media(max-width:820px){.barra-links{display:none}.barra .boton-chico{margin-left:auto}}

/* ─── 1. Portada ─────────────────────────────────────────────────────────────────── */
.portal{position:relative;height:200svh}
.portal-escena{position:sticky;top:0;height:100svh;height:100lvh;overflow:hidden;background:var(--hueso)}
.portal-contenido{position:absolute;inset:0 0 auto;height:100svh;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:center;gap:clamp(16px,3vw,48px);padding:96px var(--margen) 40px;max-width:1440px;margin:0 auto}
/* el bloque de la marca va centrado y simétrico (como en la bolsa): título, lema, bajada, botones y estado sobre un mismo eje */
.portal-texto{display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px;max-width:620px;margin:0 auto;width:100%}
.portal-texto .portal-acciones{justify-content:center}
.portal-texto .aviso-cierre{align-self:center;text-align:center}
.titulo-relieve{width:min(100%,600px);margin:0 auto}
.lema-relieve{position:relative;width:min(78%,470px);margin:-6px auto 0;translate:5% 0}
.lema-relieve img{width:100%}
.lema-relieve .destello{position:absolute;inset:0;animation:destello 4.8s ease-in-out infinite;transform-origin:88% 35%}
.lema-relieve .d2{transform-origin:94% 59%;animation-delay:1.6s}
@keyframes destello{0%,70%,100%{opacity:1;transform:scale(1) rotate(0)}80%{opacity:.4;transform:scale(.6) rotate(25deg)}88%{opacity:1;transform:scale(1.12) rotate(0)}}
.bajada{font-size:var(--t-lead);line-height:1.4;max-width:32ch;color:var(--tinta);margin:0 auto}
.portal-acciones{display:flex;flex-wrap:wrap;gap:12px}
.estado{display:inline-flex;align-items:center;gap:10px;font-size:var(--t-chico);font-weight:500;color:var(--tinta)}
.estado:not([data-abierto]) .estado-punto{background:#d9822b}
.estado-punto{width:10px;height:10px;border-radius:50%;background:var(--gris);position:relative}
.estado[data-abierto] .estado-punto{background:var(--verde)}
.estado[data-abierto] .estado-punto::after{content:"";position:absolute;inset:-5px;border-radius:50%;background:var(--verde);opacity:.35;animation:latido 2s ease-out infinite}
.estado[data-cerrado-hoy] .estado-punto{background:var(--rojo)}
@keyframes latido{from{transform:scale(.6);opacity:.5}to{transform:scale(1.8);opacity:0}}

/* El lavarropas 3D: se inclina con el puntero, flota, y el tambor gira lento como en la app */
.lavarropas-zona{position:relative;height:100%;display:grid;place-items:center;perspective:1400px}
.portal-texto{will-change:opacity,transform}
.lavarropas{position:relative;width:min(100%,68svh,620px);aspect-ratio:1;transform-style:preserve-3d;transform:rotateX(calc(var(--rx,0deg) + var(--rx0,7deg))) rotateY(calc(var(--ry,0deg) + var(--ry0,-11deg)));transition:transform .35s var(--ease)}
/* El marco del ícono de la app, en el MISMO blanco de la página: se nota solo por el relieve (luz arriba, sombra abajo) */
/* espesor del marco: dos capas detrás que se ven al inclinarlo */
.lavarropas-canto{position:absolute;inset:4%;border-radius:23%;background:#e9e1d7}
.lavarropas-canto.c1{transform:translateZ(-12px)}
.lavarropas-canto.c2{transform:translateZ(-26px);background:#dcd1c4;box-shadow:24px 34px 60px -10px rgba(110,60,50,.28)}
/* reflejo de luz que recorre el relieve rojo (enmascarado con el mismo dibujo) */
.lavarropas-reflejo{position:absolute;inset:0;pointer-events:none;-webkit-mask:url(/sitio/img/lavarropas-relieve-320.webp) center/100% 100% no-repeat;mask:url(/sitio/img/lavarropas-relieve-320.webp) center/100% 100% no-repeat;background:radial-gradient(circle at var(--gx,32%) var(--gy,22%),rgba(255,255,255,.85),rgba(255,255,255,.25) 14%,rgba(255,255,255,0) 32%);mix-blend-mode:screen;opacity:.75;transform:translateZ(2px)}
.lavarropas-marco{position:absolute;inset:4%;border-radius:23%;background:var(--hueso);box-shadow:inset 4px 4px 8px rgba(255,255,255,.55),inset -6px -8px 16px rgba(150,105,90,.16),18px 26px 50px -10px rgba(120,70,60,.26),4px 6px 12px rgba(120,70,60,.08);transform:translateZ(0)}
.lavarropas-capa{position:absolute;inset:6%;transform:translateZ(70px);transform-style:preserve-3d;animation:flota 7s ease-in-out infinite}
.lavarropas-cuerpo{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 18px 18px rgba(120,10,14,.22))}
.lavarropas-sombra{translate:var(--sx,0px) 0;position:absolute;left:14%;right:14%;bottom:-2%;height:7%;border-radius:50%;background:radial-gradient(closest-side,rgba(90,40,30,.2),transparent);animation:sombra 7s ease-in-out infinite}
@keyframes flota{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes sombra{0%,100%{transform:scaleX(1);opacity:1}50%{transform:scaleX(.88);opacity:.7}}
/* el disco del tambor: mismas proporciones que el recorte (centro 49,7 % / 57,4 %, radio 17,8 %) */
.tambor,.tambor-brillo{position:absolute;left:31.886%;top:39.604%;width:35.643%;height:35.643%;border-radius:50%;transform:translateZ(16px) rotate(var(--giro-tambor,0deg))}
.tambor{overflow:hidden}
.lavarropas.entrando,.lavarropas.entrando .lavarropas-capa{transform-style:flat}
.lavarropas.entrando .lavarropas-capa{animation:none}
.lavarropas.entrando .lavarropas-canto{display:none}
.tambor-adentro{position:absolute;inset:-1px;z-index:2;border-radius:50%;background:radial-gradient(circle,#d81c24 0%,var(--rojo) 70%);opacity:var(--adentro,0);pointer-events:none}
.tambor-adentro svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(var(--giro-adentro,0deg));opacity:var(--op-hoyos,1)}
.tambor img{width:100%;height:100%;animation:gira var(--giro,9s) linear infinite}
.agua-gl{position:absolute;inset:0;width:100%;height:100%;border-radius:50%}
.tambor.con-gl img{visibility:hidden}
.tambor.con-gl+.tambor-brillo{display:none}
.tambor-brillo{background:radial-gradient(circle at 34% 26%,rgba(255,255,255,.55),rgba(255,255,255,0) 32%);pointer-events:none}
@keyframes gira{to{transform:rotate(360deg)}}

/* La entrada por el ojo de buey: el rojo crece desde el tambor hasta tapar la pantalla */
.portal-rojo{position:absolute;inset:0;opacity:0;background:radial-gradient(circle var(--radio,0px) at var(--cx,75%) var(--cy,55%),#d81c24 0%,var(--rojo) 60%,var(--rojo) 100%);clip-path:circle(var(--radio,0px) at var(--cx,75%) var(--cy,55%));pointer-events:none}
.portal-tambor{position:absolute;left:var(--cx);top:var(--cy);width:1000px;height:1000px;margin:-500px 0 0 -500px;transform:scale(var(--esc-tambor,0)) rotate(var(--giro-portal,0deg));opacity:var(--op-tambor,1);overflow:visible;will-change:transform}
.pt-aro{fill:none;stroke:rgba(255,255,255,.14);stroke-width:2}
.pt-agujeros circle{fill:rgba(80,2,6,.26)}
.portal-lema{position:absolute;left:var(--margen);right:var(--margen);top:50%;transform:translateY(-50%);text-align:center;font-family:var(--display);text-transform:uppercase;color:var(--hueso);font-size:clamp(2.6rem,1.2rem + 5.4vw,6.6rem);line-height:.92;opacity:0;pointer-events:none}
.portal-baja{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;font-size:.85rem;font-weight:600;color:var(--gris)}
.portal-baja span{width:24px;height:38px;border-radius:12px;box-shadow:inset 0 0 0 2px var(--gris);position:relative}
.portal-baja span::after{content:"";position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--gris);animation:rueda 1.8s ease-in-out infinite}
@keyframes rueda{0%{transform:translateY(0);opacity:1}80%{transform:translateY(12px);opacity:0}100%{opacity:0}}

@media(max-width:900px){
  .portal{height:190svh}
  .portal-contenido{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);align-items:start;padding:84px var(--margen) 24px;gap:8px}
  .portal-texto{order:2;gap:16px;align-items:center;text-align:center;margin:0 auto}
  .lavarropas-zona{order:1;height:auto}
  .lavarropas{width:min(64vw,33svh)}
  .portal-texto{gap:12px}
  .bajada{order:1}
  .titulo-relieve{width:min(100%,420px);margin:0 auto}
  .lema-relieve{margin:-4px auto 0}
  .bajada{max-width:34ch}
  .portal-acciones{justify-content:center;order:2}
  .portal-texto .aviso-cierre{order:4}
  .portal-texto .estado{order:3}
  .aviso-cierre{order:4;align-self:center}
  .portal-acciones .boton{flex:1 1 220px}
  .portal-baja{display:none}
}
@media(min-width:600px) and (max-width:900px){.lavarropas{width:min(60vw,40svh)}.portal-acciones .boton{flex:0 1 auto;white-space:nowrap}.bajada{order:3}.donde-foto{margin-inline:auto}}
@media(min-width:901px) and (max-width:1180px){.portal-acciones .boton{min-width:250px}.precios-rubros{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.rubro{flex:none}}
@media(max-height:820px){.portal-baja{display:none}}
@media(max-width:900px) and (max-height:700px){.lavarropas{width:min(46vw,24svh)}.portal-contenido{padding-top:64px}.portal-texto{gap:10px}.bajada{font-size:1.0625rem}.lema-relieve{display:none}}
@media(max-width:360px){.marca span{font-size:.95rem}.barra .boton-chico span{display:none}.barra .boton-chico{padding:0 14px}}

.aviso-cierre{display:block;align-self:flex-start;padding:10px 16px;border-radius:14px;background:var(--rojo-claro);color:var(--rojo-hondo);font-size:var(--t-chico);font-weight:500;line-height:1.35}
.aviso-cierre b{font-weight:700}
.aviso-cierre[hidden]{display:none}

/* ─── 2. Servicios, sobre el rojo ────────────────────────────────────────────────── */
.servicios{position:relative;z-index:1;background:var(--rojo);color:var(--hueso);padding:clamp(72px,10vw,150px) 0}
.servicios-cabeza{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:32px;align-items:end;margin-bottom:clamp(40px,6vw,88px)}
.servicios-intro{font-size:var(--t-lead);line-height:1.4;max-width:34ch}
.servicios-lista{list-style:none;margin:0;padding:0 0 0 0;display:grid;gap:6px}
@media(min-width:901px){.servicios-lista{margin-inline:-20px}}
.servicio{border-radius:20px;transition:background .35s var(--ease),color .35s}
.servicio button{all:unset;box-sizing:border-box;width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 20px 14px;cursor:pointer;border-radius:20px}
.servicio-nombre{font-family:var(--display);text-transform:uppercase;font-size:clamp(2.2rem,1.2rem + 4.2vw,5.6rem);line-height:1;transition:transform .45s var(--ease)}
.servicio-mas{width:56px;height:56px;border-radius:50%;background:var(--hueso);position:relative;flex:none;transition:transform .45s var(--ease),background .3s}
.servicio-mas::before,.servicio-mas::after{content:"";position:absolute;left:50%;top:50%;width:20px;height:3px;margin:-1.5px 0 0 -10px;border-radius:2px;background:var(--rojo)}
.servicio-mas::after{transform:rotate(90deg);transition:transform .45s var(--ease)}
.servicio p{max-height:0;overflow:hidden;opacity:0;padding:0 20px;font-size:var(--t-lead);line-height:1.4;max-width:46ch;transition:max-height .5s var(--ease),opacity .4s,padding .4s}
.servicio[data-abierto]{background:var(--hueso);color:var(--rojo-texto);box-shadow:0 30px 50px -30px rgba(58,5,8,.75),inset 0 2px 0 rgba(255,255,255,.7);transform:translateY(-3px)}
@media(hover:hover){.servicio:hover{background:var(--hueso);color:var(--rojo-texto);box-shadow:0 30px 50px -30px rgba(58,5,8,.75),inset 0 2px 0 rgba(255,255,255,.7);transform:translateY(-3px)}}
.servicio{transition:background .35s var(--ease),color .35s,box-shadow .35s,transform .35s var(--ease)}
.servicio:hover .servicio-nombre,.servicio[data-abierto] .servicio-nombre{text-shadow:0 1px 0 #fff,0 3px 0 rgba(150,20,25,.12),0 10px 22px rgba(150,20,25,.18)}
@media(hover:hover){.servicio:hover .servicio-nombre{transform:translateX(12px)}}
.servicio[data-abierto] .servicio-mas,.servicio:hover .servicio-mas{background:var(--rojo);transform:rotate(90deg)}
.servicio:hover .servicio-mas::before,.servicio:hover .servicio-mas::after,.servicio[data-abierto] .servicio-mas::before,.servicio[data-abierto] .servicio-mas::after{background:var(--hueso)}
.servicio[data-abierto] .servicio-mas::after{transform:rotate(0)}
.servicios .servicio[data-abierto] .servicio-mas{transform:rotate(180deg)}
.servicio[data-abierto] p{max-height:12em;opacity:1;padding:0 20px 22px;color:var(--tinta)}
@media(max-width:900px){.servicios-cabeza{grid-template-columns:minmax(0,1fr)}.servicio-mas{width:44px;height:44px}.servicio button{padding:12px 14px}.servicio p{padding:0 14px}.servicio[data-abierto] p{padding:0 14px 18px}}

/* Cinta: los servicios corriendo de costado, al ritmo del scroll */
.cinta{background:var(--hueso);overflow:hidden;padding:clamp(28px,4vw,56px) 0;position:relative;z-index:1}
.cinta-texto{font-family:var(--display);text-transform:uppercase;font-size:clamp(3rem,2rem + 6vw,8.5rem);line-height:1;white-space:nowrap;color:var(--rojo);transform:translateX(var(--cinta,0px));will-change:transform}

/* ─── 3. Así de fácil: talones de ticket ─────────────────────────────────────────── */
.pasos{position:relative;z-index:1;background:var(--hueso);padding:clamp(72px,10vw,150px) 0}
.pasos .h-grande{color:var(--tinta);margin-bottom:clamp(36px,5vw,72px)}
.talones{filter:drop-shadow(0 22px 26px rgba(80,30,20,.16)) drop-shadow(0 2px 4px rgba(80,30,20,.10));list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px);perspective:1200px}
.talon{position:relative;background:var(--papel);border-radius:22px;padding:32px 28px 32px;min-height:calc(var(--corte) + 130px);--corte:196px;display:flex;flex-direction:column;gap:12px;box-shadow:inset 2px 2px 0 rgba(255,255,255,.75),inset -2px -3px 6px rgba(120,70,60,.08),0 26px 50px -22px rgba(80,30,20,.38),0 3px 8px rgba(80,30,20,.08);-webkit-mask:radial-gradient(circle 14px at 0 var(--corte),transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 14px at 100% var(--corte),transparent 98%,#000) right/51% 100% no-repeat;mask:radial-gradient(circle 14px at 0 var(--corte),transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 14px at 100% var(--corte),transparent 98%,#000) right/51% 100% no-repeat;transition:transform .5s var(--ease)}
.talon::after{content:"";position:absolute;left:24px;right:24px;top:calc(var(--corte) - 2px);height:0;border-top:4px dotted var(--linea)}
.talon:hover{transform:translateY(-8px) rotate(-1deg)}
.talon-icono{width:56px;height:56px;color:var(--rojo)}
.talon h3{font-family:var(--display);text-transform:uppercase;font-size:clamp(1.8rem,1.2rem + 1.6vw,2.6rem);line-height:1;color:var(--rojo-texto)}
.talon p{margin-top:auto;padding-top:24px;color:var(--tinta);font-size:1.0625rem}
.js .talon.aparece{transform:rotateX(16deg) translateY(40px);transform-origin:50% 100%}
.js .talon.aparece[data-visto]{transform:none}
@media(hover:hover){.talon[data-visto]:hover{transform:translateY(-8px) rotate(-1deg)}}
@media(max-width:900px){.talones{grid-template-columns:minmax(0,1fr)}.talon{--corte:96px;min-height:0;display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:14px;align-items:center;padding:24px 22px}.talon-icono{width:44px;height:44px}.talon p{grid-column:1/-1;padding-top:40px}}
@media(min-width:901px) and (max-width:1180px){.talon{--corte:236px}}

/* ─── 4. Precios + ticket ────────────────────────────────────────────────────────── */
.precios{position:relative;z-index:1;background:var(--tinta);color:var(--hueso);padding:clamp(72px,10vw,150px) 0}
.precios-grilla{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr);gap:clamp(28px,5vw,80px);align-items:start}
.precios .h-grande{color:var(--hueso);text-shadow:0 -1px 0 rgba(255,255,255,.15),0 6px 14px rgba(0,0,0,.5)}
.precios-intro{font-size:var(--t-lead);line-height:1.4;max-width:36ch;margin:18px 0 28px;color:#d8cfc8}
.buscador{position:relative;display:flex;align-items:center;margin:0 0 16px;max-width:560px}
.buscador svg{position:absolute;left:18px;width:22px;height:22px;color:#cfc2bb;pointer-events:none}
.buscador input{width:100%;min-height:56px;padding:0 52px;border:0;border-radius:999px;background:#2e2424;color:var(--hueso);font:500 1.0625rem/1 var(--texto);box-shadow:inset 0 2px 6px rgba(0,0,0,.35);outline:0;-webkit-appearance:none;appearance:none}
.buscador input::placeholder{color:#a89a93}
.buscador input:focus{box-shadow:inset 0 2px 6px rgba(0,0,0,.35),0 0 0 3px var(--rojo)}
.buscador input::-webkit-search-cancel-button{display:none}
.buscador-borrar{position:absolute;right:10px;width:38px;height:38px;border:0;border-radius:50%;background:#3d3030;color:var(--hueso);font:600 1.3rem/1 var(--texto);cursor:pointer}
.buscador-borrar[hidden]{display:none}
.item-rubro{display:inline-block;margin-left:10px;padding:2px 10px;border-radius:999px;background:#3a2c2c;color:#e3d6cf;font-size:.8rem;font-weight:500;vertical-align:2px}
.precios-vacio{padding:18px 14px;color:#cfc2bb}
.precios-rubros[data-apagados] .rubro{opacity:.55}
.precios-rubros{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.rubro{all:unset;cursor:pointer;padding:10px 18px;border-radius:999px;background:#2e2424;color:var(--hueso);font-weight:500;transition:background .25s,color .25s,transform .2s}
.rubro:hover{background:#3d3030}
.rubro[aria-selected="true"]{background:var(--hueso);color:var(--rojo-texto)}
.rubro:focus-visible{outline:3px solid var(--rojo-claro)}
.precios-lista{display:grid;gap:4px}
.item{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:minmax(0,auto) minmax(24px,1fr) auto 44px;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;transition:background .25s}
.item:hover{background:#2a2121}
.item-nombre{font-size:1.125rem;font-weight:500;min-width:0;overflow-wrap:break-word}
.item-puntos{height:0;border-top:4px dotted #4a3c3a;align-self:center;transform:translateY(4px)}
.item-nota{display:block;margin-top:2px;font-size:.95rem;font-weight:400;color:#cfc2bb}
.item-color{display:inline-block;width:14px;height:14px;border-radius:50%;margin-right:10px;vertical-align:-1px;box-shadow:inset 0 -2px 3px rgba(0,0,0,.3),0 0 0 2px rgba(255,255,255,.15)}
.item-color.roja{background:#e0242c}
.item-color.azul{background:#2f6fe0}
.item-precio{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.item-suma{width:40px;height:40px;border-radius:50%;background:var(--rojo);display:grid;place-items:center;font:600 1.4rem/1 var(--texto);color:#fff;transition:transform .3s var(--ease)}
.item:not([data-cantidad]):hover .item-suma{transform:scale(1.1) rotate(90deg)}
.item[data-cantidad]:hover .item-suma{transform:scale(1.1)}
.item[data-cantidad] .item-suma{background:var(--hueso);color:var(--rojo-texto);font-size:1rem}
.item-entra{animation:entra .5s var(--ease) both}
.precios-nota{margin-top:20px;font-size:var(--t-chico);color:#b5aaa3}

.ticket{position:sticky;top:96px;filter:drop-shadow(0 30px 34px rgba(0,0,0,.5))}
.ticket-papel{position:relative;background:var(--papel);color:var(--tinta);padding:28px 26px 30px;border-radius:6px;box-shadow:0 30px 60px -30px rgba(0,0,0,.8);transform:rotate(.6deg);backface-visibility:hidden;transition:transform .5s var(--ease);-webkit-mask:linear-gradient(#000 0 0) top/100% calc(100% - 10px) no-repeat,radial-gradient(circle 6px at 8px 100%,transparent 98%,#000) bottom/16px 10px repeat-x;mask:linear-gradient(#000 0 0) top/100% calc(100% - 10px) no-repeat,radial-gradient(circle 6px at 8px 100%,transparent 98%,#000) bottom/16px 10px repeat-x}
@media(hover:hover){.ticket:hover .ticket-papel{transform:rotate(0)}}
.ticket-cabeza{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-weight:600;color:var(--rojo-texto)}
.ticket-cabeza svg{width:26px;height:26px;color:var(--rojo)}
.ticket-cabeza span{width:100%;font-weight:400;font-size:var(--t-chico);color:var(--gris)}
.ticket-titulo{font-family:var(--display);text-transform:uppercase;font-size:2.4rem;line-height:1;margin:22px 0 14px;padding-top:18px;border-top:4px dotted var(--linea)}
.ticket-renglones{list-style:none;margin:0;padding:0;display:grid;gap:10px;min-height:48px}
.ticket-renglones li{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:10px;align-items:center;animation:imprime .45s var(--ease) both}
.ticket-vacio{display:block!important;color:var(--gris);animation:none!important}
.ticket-cant{font-weight:600;color:var(--rojo-texto);font-variant-numeric:tabular-nums}
.ticket-sacar{all:unset;cursor:pointer;position:relative;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--rojo-claro);color:var(--rojo-texto);font-weight:600}
.ticket-sacar::before{content:"";position:absolute;inset:-8px}
.ticket-sacar:focus-visible{outline:2px solid var(--rojo)}
.ticket-total{display:flex;justify-content:space-between;align-items:baseline;margin:20px 0 18px;padding-top:16px;border-top:4px dotted var(--linea);font-weight:500}
.ticket-total b{white-space:nowrap;font-family:var(--display);font-size:clamp(1.8rem,9vw,2.2rem);font-weight:400;color:var(--rojo-texto);font-variant-numeric:tabular-nums}
.ticket-limpiar[hidden]{display:none!important}
.ticket-modo{border:0;margin:0 0 16px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ticket-modo legend{grid-column:1/-1;padding:0;margin-bottom:8px;font-weight:600;font-size:.95rem}
.ticket-modo label{position:relative;cursor:pointer}
.ticket-modo input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.ticket-modo span{display:flex;align-items:center;justify-content:center;text-align:center;min-height:48px;padding:6px 10px;border-radius:14px;background:var(--hueso);box-shadow:inset 0 0 0 2px var(--linea);font-size:.92rem;font-weight:500;line-height:1.2;transition:background .25s,color .25s,box-shadow .25s}
.ticket-modo input:checked+span{background:var(--rojo);color:#fff;box-shadow:0 8px 16px -8px rgba(150,15,20,.6)}
.ticket-modo input:focus-visible+span{outline:3px solid var(--rojo);outline-offset:2px}
.ticket-limpiar{all:unset;cursor:pointer;display:block;margin:14px auto 0;color:var(--gris);font-size:var(--t-chico);text-decoration:underline}
.ticket-barra{display:none}
@keyframes imprime{from{opacity:0;transform:translateY(-10px)}}
@keyframes entra{from{opacity:0;transform:translateY(14px)}}
@media(max-width:900px){
  .precios-grilla{grid-template-columns:minmax(0,1fr)}
  .ticket{position:static}
  .ticket-papel{transform:none}
  .ticket-barra:not([hidden]){display:flex;position:fixed;left:12px;right:12px;max-width:560px;margin-inline:auto;bottom:max(12px,env(safe-area-inset-bottom));z-index:45;justify-content:space-between;align-items:center;gap:12px;min-height:56px;padding:0 20px;border:0;border-radius:999px;background:var(--hueso);color:var(--tinta);font:600 1rem/1 var(--texto);box-shadow:0 14px 30px -12px rgba(0,0,0,.55);animation:entra .4s var(--ease) both}
  .ticket-barra b{color:var(--rojo-texto)}
  .ticket-barra.tapada{opacity:0;transform:translateY(120%);pointer-events:none}
  .ticket-barra{transition:opacity .3s,transform .3s var(--ease)}
  .item{grid-template-columns:minmax(0,1fr) auto 44px;padding:12px 8px}
  .item-puntos{display:none}
  .precios-rubros{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--margen) * -1);padding:4px var(--margen);scroll-padding-inline:var(--margen);-webkit-mask:linear-gradient(90deg,#000 85%,transparent);mask:linear-gradient(90deg,#000 85%,transparent)}
  .precios-rubros::-webkit-scrollbar{display:none}
  .rubro{flex:none}
}

/* ─── 5. Palermo ─────────────────────────────────────────────────────────────────── */
.barrio{position:relative;z-index:1;background:var(--hueso);padding:clamp(72px,10vw,150px) 0 clamp(48px,6vw,96px);overflow:hidden}
.barrio-cabeza{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:32px;align-items:end;margin-bottom:clamp(32px,5vw,64px)}
.barrio-cabeza .h-grande{color:var(--rojo-texto)}
.barrio-cabeza p{font-size:var(--t-lead);line-height:1.4;max-width:30ch}
.barrio-fila{display:flex;gap:clamp(14px,2vw,28px);align-items:flex-start;padding:0 max(var(--margen),calc((100vw - 1440px) / 2 + var(--margen))) 8px;overflow-x:auto;scroll-padding-inline:max(var(--margen),calc((100vw - 1440px) / 2 + var(--margen)));scroll-snap-type:x mandatory;scrollbar-width:none;cursor:grab}
.barrio-fila::-webkit-scrollbar{display:none}
.barrio-fila:active{cursor:grabbing}
.foto{flex:0 0 clamp(260px,34vw,520px);margin:0;scroll-snap-align:start}
.foto-alta{flex-basis:clamp(260px,32vw,480px);margin-top:clamp(0px,4vw,64px)}
.foto{transform:rotate(var(--giro-foto,0deg));transition:transform .8s var(--ease)}
.foto:nth-child(odd){--giro-foto:-1.5deg}
.foto:nth-child(even){--giro-foto:1.2deg}
@media(hover:hover){.foto:hover{--giro-foto:0deg}}
.foto-marco{overflow:hidden;border-radius:24px;box-shadow:0 30px 50px -30px rgba(80,30,20,.45)}
.foto img{width:100%;aspect-ratio:4/5;object-fit:cover;transform:translateX(calc(var(--px,0) * -24px)) scale(1.08);transition:transform .2s linear}

.foto figcaption{margin-top:12px;font-size:var(--t-chico);color:var(--gris)}
@media(max-width:900px){.barrio-cabeza{grid-template-columns:minmax(0,1fr)}.foto,.foto-alta{flex-basis:78vw;margin-top:0}}

/* ─── 6. Dónde estamos ───────────────────────────────────────────────────────────── */
.donde{position:relative;z-index:1;background:var(--hueso);padding:clamp(40px,6vw,96px) 0 clamp(64px,8vw,120px)}
.donde-grilla{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,80px);align-items:start}
.donde-foto{margin:0;position:relative}
.donde-foto img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:28px}
.donde-texto{display:flex;flex-direction:column;gap:18px;padding-top:clamp(0px,3vw,48px)}
.donde .h-grande{color:var(--rojo-texto)}
.donde-barrio{font-size:var(--t-lead)}
.estado-oscuro{color:var(--tinta)}
.horario{border-collapse:collapse;width:100%;max-width:440px;font-size:1.0625rem}
.horario th{text-align:left;font-weight:400;padding:9px 0}
.horario td{text-align:right;padding:9px 0;font-variant-numeric:tabular-nums}
.horario tr+tr th,.horario tr+tr td{border-top:1px solid var(--linea)}
.horario tr[data-hoy] th,.horario tr[data-hoy] td{font-weight:700;color:var(--rojo-texto)}
.horario tr[data-hoy] th::after{content:" · hoy";font-weight:500}
.donde-acciones{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.mapa{grid-column:1/-1;position:relative;border-radius:28px;overflow:hidden;height:clamp(340px,44vw,560px);background:var(--hueso);box-shadow:0 30px 60px -36px rgba(110,40,35,.4)}
.mapa-lienzo{position:absolute!important;inset:0;width:100%;height:100%}
.mapa-tapa{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;padding:24px;transition:opacity .8s var(--ease)}
.mapa-tapa p{font-size:var(--t-lead);max-width:30ch}
.mapa-tapa-pin{width:56px;height:56px;color:var(--rojo);animation:flota 3s ease-in-out infinite}
.mapa[data-listo] .mapa-tapa{opacity:0;pointer-events:none}
/* vuelo de dron: cartel del lugar (sin líneas de velocidad: Jesica, 6/11/2026, no le gustaban las tiras blancas) */
.mapa-hud{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);transition:opacity .4s;padding:9px 18px;border-radius:999px;background:rgba(30,22,22,.82);color:#fff;font:600 .95rem/1.2 var(--texto);white-space:nowrap;pointer-events:none}
.mapa-hud::before{content:"";display:inline-block;width:9px;height:9px;margin-right:9px;border-radius:50%;background:#ff4b4b;vertical-align:1px;animation:latido 1.2s ease-out infinite}
.mapa-volar{position:absolute;right:16px;bottom:14px;z-index:2;display:none;align-items:center;gap:6px;min-height:40px;padding:0 16px;border:0;border-radius:999px;background:var(--hueso);color:var(--tinta);font:600 .9rem/1 var(--texto);cursor:pointer;box-shadow:0 8px 20px -8px rgba(0,0,0,.4)}
.mapa-volar svg{width:16px;height:16px;color:var(--rojo)}
.mapa[data-listo]:not([data-volando]) .mapa-volar{display:inline-flex}
.mapa .maplibregl-ctrl-bottom-right{bottom:56px}
.mapa[data-volando] .mapa-ayuda{opacity:0!important}
.mapa .maplibregl-ctrl-group button{width:44px;height:44px}
.mapa-ayuda{position:absolute;left:16px;bottom:14px;padding:8px 14px;border-radius:999px;background:rgba(30,22,22,.78);color:#fff;font-size:.85rem;pointer-events:none;transition:opacity .6s}
.pin-local{position:relative;width:120px;height:190px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;pointer-events:none}
.pin-cartel{order:-1;white-space:nowrap;margin:0 0 8px;background:var(--tinta);color:var(--hueso);padding:8px 14px;border-radius:12px;font:600 .95rem/1.2 var(--texto);text-align:center;box-shadow:0 12px 24px -10px rgba(0,0,0,.55);animation:flota 4s ease-in-out infinite}
.pin-cartel small{display:block;font-weight:400;opacity:.8}
.pin-icono{width:66px;height:66px;border-radius:20px;background:var(--hueso);display:grid;place-items:center;box-shadow:inset 2px 2px 0 rgba(255,255,255,.8),inset -3px -4px 8px rgba(120,70,60,.18),0 14px 26px -8px rgba(90,20,20,.55);animation:flota 4s ease-in-out infinite}
.pin-icono img{width:54px;height:54px}
.pin-haz{position:absolute;left:50%;bottom:6px;width:4px;height:84px;margin-left:-2px;border-radius:2px;background:linear-gradient(var(--rojo),rgba(196,20,28,.15));box-shadow:0 0 12px rgba(196,20,28,.6)}
.pin-onda{position:absolute;left:50%;bottom:0;width:22px;height:10px;margin-left:-11px;border-radius:50%;background:var(--rojo);box-shadow:0 0 0 0 rgba(196,20,28,.6);animation:onda-piso 2s ease-out infinite}
@keyframes onda-piso{0%{box-shadow:0 0 0 0 rgba(196,20,28,.55)}100%{box-shadow:0 0 0 26px rgba(196,20,28,0)}}
.maplibregl-ctrl-attrib{font-size:11px}
.mapa .maplibregl-ctrl-group{border-radius:16px;overflow:hidden;background:var(--hueso);box-shadow:0 8px 20px -8px rgba(0,0,0,.35)}
@media(max-width:900px){.donde-grilla{grid-template-columns:minmax(0,1fr)}.donde-foto{max-width:520px}}

/* ─── Pie: la página sube como una cortina ───────────────────────────────────────── */
main{position:relative;z-index:2;background:var(--hueso);margin-bottom:var(--alto-pie,0px)}
.pie{position:fixed;left:0;right:0;bottom:0;z-index:1;background:var(--rojo);color:var(--hueso);padding:clamp(56px,8vw,110px) 0 calc(28px + env(safe-area-inset-bottom))}
.pie-grilla{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:28px 48px;align-items:end}
.pie-lema{font-family:var(--display);text-transform:uppercase;font-size:clamp(2.6rem,1.4rem + 5vw,6.4rem);line-height:.92}
.pie-datos{display:grid;gap:12px;font-size:1.125rem}
.pie-datos a{display:inline-flex;align-items:center;gap:10px;min-height:44px;text-decoration:none}
.pie-datos a:hover{text-decoration:underline}
.pie-datos svg{width:22px;height:22px}
.pie-horario{font-size:1rem;color:var(--rojo-claro)}
.pie-marca{display:flex;align-items:center;gap:10px;font-weight:600}
.pie-marca svg{width:30px;height:30px}
.pie-creditos{font-size:.8125rem;line-height:1.5;color:var(--rojo-claro);max-width:80ch}
@media(max-width:900px){.pie{position:relative;padding-bottom:calc(96px + env(safe-area-inset-bottom))}main{margin-bottom:0}.pie-grilla{grid-template-columns:minmax(0,1fr)}}

/* WhatsApp siempre a mano */
.wa-flotante{position:fixed;opacity:0;pointer-events:none;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:50;width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:var(--verde);color:#fff;box-shadow:0 14px 30px -10px rgba(10,60,30,.55);transition:transform .3s var(--ease),opacity .4s}
.wa-flotante svg{width:34px;height:34px}
.wa-flotante{visibility:hidden}
@media(max-width:900px){
  .wa-flotante{width:56px;height:56px}
  .barra{padding-top:8px;padding-bottom:8px}
  .servicios .h-grande,.servicio-nombre,.portal-lema,.pie-lema{text-shadow:0 -1px 0 rgba(255,255,255,.2),0 2px 0 rgba(0,0,0,.12),0 6px 10px rgba(60,5,8,.25)}
  .ticket-barra b{white-space:nowrap}
}
.wa-flotante[data-visible]{opacity:1;pointer-events:auto;visibility:visible}
.wa-flotante:hover{transform:scale(1.08) rotate(-6deg)}

/* Entradas escalonadas al aparecer (sin JS, todo queda visible) */
.js .aparece{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:var(--retraso,0ms)}
.js .aparece[data-visto]{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  /* el tambor sigue girando lento: Jesica y Max lo quieren siempre (igual que en la app) */
  .tambor img{animation-duration:14s!important;animation-iteration-count:infinite!important}
  .portal{height:auto}
  .portal-escena{position:relative;height:auto;min-height:100svh}
  .portal-contenido{position:relative}
  .portal-rojo,.portal-lema,.portal-baja{display:none}
  .js .aparece{opacity:1;transform:none}
}