/* Skateburger · estilos */
:root{
  --negro:#0d0d0d; --negro-2:#161616; --negro-3:#222; --linea:#2c2c2c;
  --amarillo:#ffd21a; --naranjo:#ff8a00; --naranjo-2:#ff6a00; --rojo:#e3262b; --crema:#fff4d6;
  --texto:#f4f1ea; --suave:#b9b3a6; --verde:#36c46b;
  --radio:18px; --sombra:0 14px 40px rgba(0,0,0,.45);
  --f-titulo:'Bowlby One',Impact,system-ui,sans-serif; --f-texto:'Archivo',system-ui,sans-serif; --f-mano:'Permanent Marker',cursive;
  --ancho:1240px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
html,body{overflow-x:clip}
body{margin:0;background:var(--negro);color:var(--texto);font:16px/1.5 var(--f-texto);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
body.sin-scroll{overflow:hidden}
img,video{max-width:100%;display:block}
a{color:var(--amarillo)}
button{font:inherit;color:inherit;cursor:pointer}
h1,h2,h3{margin:0;line-height:1.05}
.saltar{position:absolute;left:-999px;top:0;background:var(--amarillo);color:#000;padding:10px;z-index:99}
.saltar:focus{left:10px}
:focus-visible{outline:3px solid var(--amarillo);outline-offset:2px}

/* botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:999px;border:2px solid transparent;font-weight:800;text-decoration:none;letter-spacing:.2px;transition:transform .15s,box-shadow .15s,background .15s}
.btn:active{transform:scale(.97)}
.btn--amarillo{background:var(--amarillo);color:#111;box-shadow:0 5px 0 #b88a00}
.btn--amarillo:hover{background:#ffe04d;transform:translateY(-2px);box-shadow:0 7px 0 #b88a00}
.btn--amarillo:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn--borde{border-color:#ffffff40;color:var(--texto);background:transparent}
.btn--borde:hover{border-color:var(--amarillo);color:var(--amarillo)}
.btn--grande{padding:15px 28px;font-size:17px}
.btn--bloque{display:flex;width:100%}
.link{background:none;border:0;color:var(--amarillo);font-weight:700;text-decoration:underline;text-underline-offset:3px;padding:0}

/* aviso y cabecera */
.aviso-top{background:var(--amarillo);color:#111;text-align:center;font-weight:800;padding:8px 16px;font-size:14px}
.top{position:sticky;top:0;z-index:40;transition:background .2s,box-shadow .2s}
.top--scroll{background:rgba(13,13,13,.92);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--linea)}
.top__in{max-width:var(--ancho);margin:auto;display:flex;align-items:center;gap:18px;padding:10px 16px}
.top__logo img{width:128px;height:auto;filter:drop-shadow(0 3px 0 rgba(0,0,0,.6))}
.top__nav{display:flex;gap:22px;margin-left:12px}
.top__nav a{color:var(--texto);text-decoration:none;font-weight:700}
.top__nav a:hover{color:var(--amarillo)}
.chip-local{margin-left:auto;display:flex;align-items:center;gap:8px;background:var(--negro-3);border:1px solid var(--linea);padding:9px 14px;border-radius:999px;font-weight:700;font-size:14px;max-width:46vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chip-local__pin{width:10px;height:10px;border-radius:50%;background:var(--suave);flex:none}
.chip-local--ok .chip-local__pin{background:var(--amarillo);box-shadow:0 0 0 4px #ffd21a33}
.btn-carro{position:relative;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--amarillo);color:#111;border:0;flex:none}
.btn-carro__n{position:absolute;top:-4px;right:-4px;min-width:22px;height:22px;padding:0 5px;border-radius:11px;background:var(--rojo);color:#fff;font-size:12px;font-weight:800;display:grid;place-items:center;transform:scale(0);transition:transform .2s}
.btn-carro__n.on{transform:scale(1)}
.btn-carro.salto{animation:salto .45s}
@keyframes salto{30%{transform:translateY(-6px) rotate(-8deg)}60%{transform:translateY(0) rotate(4deg)}}

/* hero */
.hero{position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 70% at 78% 40%,#ff8a0033,transparent 70%),radial-gradient(40% 50% at 10% 90%,#ffd21a1a,transparent 70%);pointer-events:none}
.hero__in{position:relative;max-width:var(--ancho);margin:auto;display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}
.hero__pre{display:inline-flex;align-items:center;gap:8px;background:#ffffff10;border:1px solid #ffffff1a;padding:6px 12px;border-radius:999px;font-weight:700;font-size:14px;margin:0 0 18px}
.punto{width:9px;height:9px;border-radius:50%;background:var(--verde);box-shadow:0 0 0 0 #36c46b88;animation:pulso 1.8s infinite}
.hero__pre--off .punto{background:var(--suave);animation:none}
@keyframes pulso{70%{box-shadow:0 0 0 10px #36c46b00}100%{box-shadow:0 0 0 0 #36c46b00}}
.hero h1{font-family:var(--f-titulo);font-weight:400;font-size:clamp(38px,5.6vw,74px);letter-spacing:-.5px;text-transform:uppercase;line-height:.98}
.h1-marca{display:inline-block;color:#111;background:var(--amarillo);padding:0 .18em;transform:rotate(-2deg);margin:.08em 0;box-shadow:6px 6px 0 var(--naranjo-2)}
.hero__bajada{font-size:clamp(16px,1.6vw,19px);color:var(--suave);max-width:520px;margin:20px 0 26px}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px}
.hero__datos{display:flex;flex-wrap:wrap;gap:12px 28px;list-style:none;padding:0;margin:30px 0 0}
.hero__datos li{display:flex;flex-direction:column;line-height:1.2}
.hero__datos b{font-family:var(--f-titulo);font-weight:400;font-size:24px;color:var(--amarillo)}
.hero__datos span{font-size:13px;color:var(--suave);max-width:150px}
.hero__foto{position:relative;justify-self:center;width:min(100%,520px)}
.hero__img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:28px;transform:rotate(2.5deg);box-shadow:var(--sombra),0 0 0 6px var(--negro),0 0 0 9px var(--amarillo)}
.hero__masc{position:absolute;left:-46px;bottom:-30px;width:170px;height:170px;border-radius:50%;border:5px solid var(--amarillo);box-shadow:var(--sombra);animation:kick 5s ease-in-out infinite}
@keyframes kick{0%,70%,100%{transform:translateY(0) rotate(-6deg)}78%{transform:translateY(-26px) rotate(-200deg)}86%{transform:translateY(-10px) rotate(-354deg)}92%{transform:translateY(0) rotate(-366deg)}}
.hero__nota{position:absolute;right:-6px;top:22px;font:24px var(--f-mano);color:#111;background:var(--crema);padding:4px 14px;transform:rotate(8deg);box-shadow:4px 4px 0 var(--rojo)}

/* slider de portada */
.slider__pista{display:grid}
.slide{grid-area:1/1;position:relative;padding:28px 16px 74px;opacity:0;visibility:hidden;transition:opacity .6s ease,visibility 0s .6s;overflow:hidden}
.slide.is-on{opacity:1;visibility:visible;transition:opacity .6s ease,visibility 0s 0s;z-index:1}
.slide .hero__in{height:100%}
.slide--marca .hero__txt>*,.slide__txt>*{transition:transform .7s cubic-bezier(.2,.8,.2,1),opacity .7s}
.slide:not(.is-on) .hero__txt>*,.slide:not(.is-on) .slide__txt>*{transform:translateY(22px);opacity:0}
.slide.is-on .slide__txt>:nth-child(2),.slide.is-on .hero__txt>:nth-child(2){transition-delay:.08s}
.slide.is-on .slide__txt>:nth-child(3),.slide.is-on .hero__txt>:nth-child(3){transition-delay:.16s}
.slide.is-on .slide__txt>:nth-child(n+4),.slide.is-on .hero__txt>:nth-child(n+4){transition-delay:.24s}
.slide__foto,.slide--marca .hero__foto{transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.slide:not(.is-on) .slide__foto,.slide:not(.is-on) .hero__foto{transform:translateX(40px) rotate(6deg)}
.slide--prod{color:#111}
.slide--prod::before{content:"";position:absolute;inset:0;background:radial-gradient(#0000001f 1.5px,transparent 1.6px) 0 0/16px 16px;mask-image:linear-gradient(100deg,#000 0,transparent 55%);pointer-events:none}
.slide--prod::after{content:"";position:absolute;right:-8%;top:-30%;width:55%;height:160%;background:repeating-linear-gradient(-55deg,#0000000f 0 22px,transparent 22px 44px);transform:skewX(-12deg);pointer-events:none}
.slide--amarillo{background:var(--amarillo)}
.slide--naranjo{background:linear-gradient(120deg,#ff9a1a,var(--naranjo-2))}
.slide--rojo{background:linear-gradient(120deg,#e3262b,#b3141a);color:#fff}
.slide--negro{background:#050505;color:var(--texto)}
.slide__etq{display:inline-block;font:22px var(--f-mano);background:#111;color:var(--amarillo);padding:4px 16px;transform:rotate(-3deg);box-shadow:4px 4px 0 #ffffff66;margin-bottom:16px}
.slide--negro .slide__etq{background:var(--amarillo);color:#111;box-shadow:4px 4px 0 var(--rojo)}
.slide__t{font-family:var(--f-titulo);font-weight:400;text-transform:uppercase;font-size:clamp(46px,7.4vw,104px);line-height:.92;letter-spacing:-1px}
.slide__bajada{font-size:clamp(16px,1.7vw,20px);font-weight:600;max-width:500px;margin:18px 0 10px;opacity:.85}
.slide__precio{font-family:var(--f-titulo);font-size:clamp(34px,4vw,50px);margin:6px 0 22px;line-height:1}
.slide--prod .slide__precio{display:none}
.slide__foto{position:relative;justify-self:center;width:min(100%,470px)}
.slide__foto img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:28px;transform:rotate(-3deg);box-shadow:0 30px 60px #0006,0 0 0 6px #111}
.slide__sello{position:absolute;right:-26px;top:-20px;width:138px;height:138px;border-radius:50%;background:#111;color:var(--amarillo);display:grid;place-content:center;text-align:center;font-family:var(--f-titulo);font-size:26px;line-height:1;transform:rotate(12deg);box-shadow:0 0 0 5px var(--amarillo),0 14px 30px #0006;animation:sello 3.5s ease-in-out infinite}
.slide__sello small{font:16px var(--f-mano);color:#fff;margin-bottom:4px}
@keyframes sello{50%{transform:rotate(4deg) scale(1.06)}}
.slide--negro .slide__foto img{box-shadow:0 30px 60px #000a,0 0 0 6px var(--amarillo)}
.btn--negro{background:#111;color:var(--amarillo);box-shadow:0 5px 0 #00000066}
.btn--negro:hover{transform:translateY(-2px);box-shadow:0 7px 0 #00000066;background:#000}
.slide--negro .btn--negro{background:var(--amarillo);color:#111;box-shadow:0 5px 0 #b88a00}
.btn--borde-negro{border-color:#111;color:#111;background:transparent}
.btn--borde-negro:hover{background:#111;color:var(--amarillo)}
.slide--rojo .btn--borde-negro,.slide--negro .btn--borde-negro{border-color:#ffffffaa;color:#fff}
.slider__ctrl{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);z-index:3;display:flex;align-items:center;gap:10px;background:#0d0d0dcc;backdrop-filter:blur(6px);padding:6px 8px;border-radius:999px;border:1px solid #ffffff22}
.slider__flecha{width:36px;height:36px;border-radius:50%;border:0;background:#ffffff14;color:#fff;font-size:22px;line-height:1}
.slider__flecha:hover{background:var(--amarillo);color:#111}
.slider__puntos{display:flex;gap:6px}
.slider__puntos button{width:26px;height:10px;border-radius:5px;border:0;background:#ffffff33;padding:0;overflow:hidden;position:relative;transition:width .3s}
.slider__puntos button[aria-selected="true"]{width:46px}
.slider__puntos i{position:absolute;inset:0;width:0;background:var(--amarillo)}
.slider__puntos button[aria-selected="true"] i{animation:barra var(--dur,6.5s) linear forwards}
.slider.pausa .slider__puntos i{animation-play-state:paused}
@keyframes barra{to{width:100%}}

/* alto del slider: las fotos mandan, con tope por alto de pantalla */
.hero__foto,.slide__foto{width:auto;justify-self:center}
.hero__img,.slide__foto img{height:min(64vh,560px);width:auto;aspect-ratio:4/5;max-width:100%}
@media (max-width:860px){
  .hero__img,.slide__foto img{height:min(34vh,300px)}
  .slide .hero__in{gap:22px}
  .slide--marca .hero__datos{display:none}
  .slide--prod .hero__in{display:flex;flex-direction:column-reverse;align-items:flex-start}
  .slide--prod .slide__foto{align-self:center}
  .slide__sello{width:92px;height:92px;font-size:18px;right:-30px;top:-10px}
}

/* cinta */
.cinta{background:var(--amarillo);color:#111;transform:rotate(-1.5deg);margin:10px -10px 20px;overflow:hidden;border-block:3px solid #111}
.cinta__in{display:flex;width:max-content;animation:cinta 28s linear infinite}
.cinta span{font-family:var(--f-titulo);text-transform:uppercase;font-size:20px;padding:10px 14px;white-space:nowrap}
@keyframes cinta{to{transform:translateX(-50%)}}

/* bloques */
.bloque{max-width:var(--ancho);margin:auto;padding:44px 16px}
.bloque__cab{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:22px}
.titulo{font-family:var(--f-titulo);font-weight:400;text-transform:uppercase;font-size:clamp(30px,4vw,48px);position:relative;display:inline-block}
.titulo::after{content:"";display:block;height:6px;width:64px;background:var(--naranjo);margin-top:8px;border-radius:3px;transform:skewX(-20deg)}
.flechas{display:flex;gap:8px}
.flechas button{width:44px;height:44px;border-radius:50%;border:2px solid var(--linea);background:var(--negro-2);font-size:24px;line-height:1}
.flechas button:hover{border-color:var(--amarillo);color:var(--amarillo)}
.riel{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,calc((100% - 48px)/4));gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:thin;scrollbar-color:var(--naranjo) transparent}
.riel>*{scroll-snap-align:start}

/* tarjeta de producto */
.prod{background:var(--negro-2);border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;display:flex;flex-direction:column;transition:transform .2s,border-color .2s,box-shadow .2s}
.prod:hover{transform:translateY(-4px) rotate(-.4deg);border-color:#ffd21a66;box-shadow:var(--sombra)}
.prod__foto{position:relative;aspect-ratio:1;overflow:hidden;background:#000}
.prod__foto img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.prod:hover .prod__foto img{transform:scale(1.06)}
.sticker{position:absolute;left:10px;top:10px;background:var(--amarillo);color:#111;font:15px var(--f-mano);padding:3px 10px;transform:rotate(-4deg);box-shadow:3px 3px 0 #111}
.sticker--rojo{background:var(--rojo);color:#fff;left:auto;right:10px}
.prod__info{padding:14px 16px 16px;display:flex;flex-direction:column;flex:1}
.prod h3{font-family:var(--f-titulo);font-weight:400;font-size:21px;text-transform:uppercase;letter-spacing:.3px}
.prod p{color:var(--suave);font-size:14px;margin:6px 0 14px;flex:1}
.prod__pie{display:flex;align-items:center;justify-content:space-between;gap:10px}
.precio{font-family:var(--f-titulo);font-size:22px;color:var(--amarillo)}
.cant{display:flex;align-items:center;gap:6px}
.cant__menos,.cant__n{display:none}
.cant--on .cant__menos,.cant--on .cant__n{display:grid}
.cant__menos{width:36px;height:36px;border-radius:50%;border:2px solid var(--linea);background:transparent;place-items:center;font-size:20px;line-height:1}
.cant__n{min-width:22px;text-align:center;font-weight:800;place-items:center}
.btn-mas{display:flex;align-items:center;gap:8px;background:var(--amarillo);color:#111;border:0;border-radius:999px;padding:9px 16px;font-weight:800;box-shadow:0 4px 0 #b88a00;transition:transform .12s}
.btn-mas:hover{transform:translateY(-2px)}
.btn-mas:active{transform:translateY(2px);box-shadow:0 1px 0 #b88a00}
.btn-mas span[aria-hidden]{font-size:20px;line-height:1}
.cant--on .btn-mas{padding:9px 13px}
.cant--on .btn-mas__txt{display:none}
.prod--agotado{opacity:.55}
.prod--agotado .prod__foto img{filter:grayscale(1)}
.lata{height:100%;display:grid;place-items:center;background:radial-gradient(circle at 50% 120%,#ffffff22,transparent 60%),#111}
.lata span{width:42%;aspect-ratio:.56;border-radius:16px/10px;background:linear-gradient(90deg,#0004,transparent 30%,#fff3 45%,transparent 60%,#0005),var(--lata);display:grid;place-items:center;text-align:center;font-weight:900;color:#fff;font-size:13px;padding:8px;box-shadow:0 18px 30px #0008;text-shadow:0 1px 2px #0008;transform:rotate(-6deg);border-top:6px solid #cfcfcf;border-bottom:6px solid #a9a9a9}

/* carta */
.carta__nota{color:var(--suave);margin:4px 0 0}
.tabs{position:sticky;top:66px;z-index:20;display:flex;gap:8px;overflow-x:auto;padding:14px 0;margin:10px 0 6px;background:linear-gradient(var(--negro) 75%,transparent);scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs a{flex:none;padding:10px 18px;border-radius:999px;background:var(--negro-2);border:1px solid var(--linea);color:var(--texto);text-decoration:none;font-weight:800;transition:.2s}
.tabs a.on,.tabs a:hover{background:var(--amarillo);color:#111;border-color:var(--amarillo)}
.cat{padding-top:26px}
.cat__cab{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin-bottom:16px}
.cat__t{font-family:var(--f-titulo);font-weight:400;font-size:28px;text-transform:uppercase;color:var(--naranjo)}
.cat__cab span{color:var(--suave)}
.grilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}

/* cómo pedir */
.pasos{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:p}
.pasos li{position:relative;background:var(--negro-2);border:1px solid var(--linea);border-radius:var(--radio);padding:24px 22px}
.pasos__n{position:absolute;right:16px;top:-18px;width:52px;height:52px;border-radius:50%;background:var(--naranjo);color:#111;font-family:var(--f-titulo);font-size:26px;display:grid;place-items:center;transform:rotate(-8deg);box-shadow:3px 3px 0 #111}
.pasos h3{font-family:var(--f-titulo);font-weight:400;text-transform:uppercase;font-size:22px;margin-bottom:8px}
.pasos p{margin:0;color:var(--suave)}

/* reels */
.reels__fila{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.reel{border-radius:var(--radio);overflow:hidden;aspect-ratio:9/16;background:#000;border:1px solid var(--linea)}
.reel video{width:100%;height:100%;object-fit:cover}

/* locales */
.locales__grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.local{background:var(--negro-2);border:1px solid var(--linea);border-radius:var(--radio);padding:22px;position:relative;overflow:hidden}
.local::after{content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border-radius:50%;background:radial-gradient(#ff8a0055,transparent 70%)}
.local__cab{display:flex;justify-content:space-between;align-items:start;gap:12px}
.local h3{font-family:var(--f-titulo);font-weight:400;text-transform:uppercase;font-size:28px}
.local h3 small{display:block;font:600 15px var(--f-texto);color:var(--suave);text-transform:none;margin-top:4px}
.estado{font-size:13px;font-weight:800;padding:5px 10px;border-radius:999px;white-space:nowrap;font-style:normal}
.estado--on{background:#36c46b22;color:var(--verde)}
.estado--off{background:#ffffff12;color:var(--suave)}
.local__dir{color:var(--suave);margin:12px 0}
.horario{width:100%;border-collapse:collapse;font-size:14px;margin-bottom:18px}
.horario th,.horario td{padding:5px 0;border-bottom:1px dashed var(--linea);text-align:left;font-weight:500}
.horario td{text-align:right;color:var(--suave)}
.horario tr.hoy th,.horario tr.hoy td{color:var(--amarillo);font-weight:800}
.local__btns{display:flex;flex-wrap:wrap;gap:10px}
.local__btns .btn{padding:10px 18px}

/* galería */
.galeria{overflow:hidden;padding:20px 0 50px}
.galeria__fila{display:flex;gap:12px;width:max-content;animation:cinta 70s linear infinite}
.galeria__fila img{height:260px;width:auto;aspect-ratio:3/4;object-fit:cover;border-radius:14px}
.galeria:hover .galeria__fila{animation-play-state:paused}

/* pie */
.pie{background:#000;border-top:4px solid var(--amarillo);margin-top:20px}
.pie__in{max-width:var(--ancho);margin:auto;padding:36px 16px;display:grid;grid-template-columns:auto 1.2fr 1.5fr 1fr;gap:28px;align-items:start}
.pie__masc{width:110px;border-radius:50%}
.pie p{color:var(--suave);margin:10px 0 0;font-size:14px}
.pie__locales{list-style:none;padding:0;margin:0;display:grid;gap:14px;font-size:14px;color:var(--suave)}
.pie__locales b{color:var(--texto)}
.pie__redes{display:grid;gap:10px;font-size:14px}
.pie__getnet{color:var(--suave)}
.pie__legal{text-align:center;color:var(--suave);font-size:13px;padding:14px 16px 24px;margin:0;border-top:1px solid var(--linea)}
.pie__legal a{color:var(--suave)}

/* modal local */
.modal{position:fixed;inset:0;z-index:60;background:#000b;display:grid;place-items:center;padding:16px;opacity:0;transition:opacity .2s}
.modal.on{opacity:1}
.modal__caja{position:relative;background:var(--negro-2);border:2px solid var(--amarillo);border-radius:24px;padding:28px 22px 22px;width:min(440px,100%);text-align:center;transform:translateY(14px);transition:transform .2s}
.modal.on .modal__caja{transform:none}
.modal__masc{width:96px;border-radius:50%;margin:-74px auto 8px;border:4px solid var(--amarillo)}
.modal__caja h2{font-family:var(--f-titulo);font-weight:400;text-transform:uppercase;font-size:26px;margin-bottom:16px}
.modal__x{position:absolute;right:12px;top:10px;width:38px;height:38px;border-radius:50%;border:0;background:var(--negro-3);font-size:24px;line-height:1}
.opciones-local{display:grid;gap:10px}
.op-local{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;text-align:left;gap:0 10px;background:var(--negro);border:2px solid var(--linea);border-radius:16px;padding:14px 16px;transition:.15s}
.op-local:hover{border-color:var(--amarillo)}
.op-local b{font-family:var(--f-titulo);font-weight:400;font-size:20px;text-transform:uppercase}
.op-local span{color:var(--suave);font-size:14px;grid-row:2}
.op-local .estado{grid-row:1/3;grid-column:2;align-self:center}

/* carro */
.carro{position:fixed;inset:0;z-index:50}
.carro__fondo{position:absolute;inset:0;background:#000a;opacity:0;transition:opacity .25s}
.carro__panel{position:absolute;right:0;top:0;bottom:0;width:min(440px,100%);background:var(--negro-2);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .25s ease-out;border-left:3px solid var(--amarillo)}
.carro.on .carro__fondo{opacity:1}
.carro.on .carro__panel{transform:none}
.carro__cab{display:flex;align-items:center;justify-content:space-between;padding:16px 18px 6px}
.carro__cab h2{font-family:var(--f-titulo);font-weight:400;text-transform:uppercase;font-size:26px}
.carro__cab .modal__x{position:static}
.carro__local{padding:0 18px 12px;color:var(--suave);font-size:14px;border-bottom:1px solid var(--linea)}
.carro__local b{color:var(--texto)}
.carro__cuerpo{flex:1;overflow-y:auto;padding:12px 18px}
.carro__lista{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.item{display:grid;grid-template-columns:56px 1fr auto;grid-template-rows:auto auto;gap:4px 12px;align-items:center;background:var(--negro);border-radius:14px;padding:8px}
.item img,.item .item__lata{width:56px;height:56px;border-radius:10px;object-fit:cover;grid-row:1/3}
.item__lata{display:block;background:var(--lata)}
.item__txt{display:flex;flex-direction:column;line-height:1.25}
.item__txt span{font-size:13px;color:var(--suave)}
.item__cant{display:flex;align-items:center;gap:8px;grid-column:2;grid-row:2}
.item__cant button{width:30px;height:30px;border-radius:50%;border:1px solid var(--linea);background:var(--negro-3);font-size:18px;line-height:1}
.item__cant span{min-width:16px;text-align:center;font-weight:800}
.item__tot{grid-column:3;grid-row:1/3;font-weight:800}
.carro__vacio{text-align:center;color:var(--suave);padding:30px 0}
.carro__vacio img{width:110px;border-radius:50%;margin:0 auto 12px;opacity:.85}
.sugeridos h3{font-size:15px;margin:18px 0 8px;color:var(--suave);font-family:var(--f-texto)}
.sugeridos__fila{display:grid;gap:8px}
.sug{display:grid;grid-template-columns:44px 1fr auto;gap:10px;align-items:center;background:transparent;border:1px dashed #ffffff33;border-radius:12px;padding:6px 10px 6px 6px;text-align:left}
.sug:hover{border-color:var(--amarillo)}
.sug img,.sug .item__lata{width:44px;height:44px;border-radius:8px;object-fit:cover}
.sug b{color:var(--amarillo);font-size:14px}
.carro__pie{border-top:1px solid var(--linea);padding:14px 18px calc(14px + env(safe-area-inset-bottom))}
.totales{display:grid;gap:4px;margin-bottom:12px}
.totales div{display:flex;justify-content:space-between;color:var(--suave)}
.totales__total{color:var(--texto)!important;font-weight:800;font-size:20px}
.carro__error{background:#e3262b22;border:1px solid #e3262b77;color:#ffb3b3;border-radius:10px;padding:10px 12px;font-size:14px;margin:0 0 12px}
.carro__volver{display:block;margin:12px auto 0}
.carro__seguro{display:flex;align-items:center;justify-content:center;gap:6px;color:var(--suave);font-size:12px;margin:12px 0 0}
.cargando{position:relative;color:transparent!important}
.cargando::after{content:"";position:absolute;width:22px;height:22px;border:3px solid #111;border-right-color:transparent;border-radius:50%;animation:gira .7s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}

/* formulario */
.form{display:grid;gap:12px;align-content:start}
.entrega{border:0;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.entrega legend{font-weight:800;margin-bottom:8px}
.op{position:relative}
.op input{position:absolute;opacity:0}
.op span{display:flex;flex-direction:column;border:2px solid var(--linea);border-radius:14px;padding:12px;cursor:pointer;height:100%}
.op small{color:var(--suave)}
.op input:checked+span{border-color:var(--amarillo);background:#ffd21a12}
.op input:focus-visible+span{outline:3px solid var(--amarillo)}
.form__nota{margin:0;font-size:13px;color:var(--suave)}
.campo{display:grid;gap:5px;font-weight:700;font-size:14px}
.campo small{color:var(--suave);font-weight:500}
.campo input,.campo textarea{width:100%;background:var(--negro);border:2px solid var(--linea);border-radius:12px;padding:12px;color:var(--texto);font:16px var(--f-texto)}
.campo input:focus,.campo textarea:focus{border-color:var(--amarillo);outline:0}

.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,120px);background:var(--amarillo);color:#111;font-weight:800;padding:12px 20px;border-radius:999px;z-index:70;transition:transform .25s;box-shadow:var(--sombra);max-width:calc(100% - 32px);text-align:center}
.toast.on{transform:translate(-50%,0)}

/* revelado */
.revelar{opacity:0;transform:translateY(24px);transition:opacity .6s,transform .6s}
.revelar.visto{opacity:1;transform:none}

/* página de pedido */
.seguimiento{max-width:760px;margin:auto;padding:30px 16px 60px}
.seg__caja{background:var(--negro-2);border:1px solid var(--linea);border-radius:24px;padding:26px 22px;text-align:center}
.seg__masc{width:120px;border-radius:50%;margin:0 auto 10px;border:4px solid var(--amarillo)}
.seg__caja h1{font-family:var(--f-titulo);font-weight:400;text-transform:uppercase;font-size:clamp(28px,5vw,40px)}
.seg__cod{display:inline-block;margin:10px 0;font:24px var(--f-mano);background:var(--crema);color:#111;padding:2px 14px;transform:rotate(-2deg)}
.seg__txt{color:var(--suave);max-width:520px;margin:6px auto 0}
.linea-tiempo{list-style:none;padding:0;margin:26px 0 6px;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;position:relative}
.linea-tiempo li{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:13px;color:var(--suave);position:relative}
.linea-tiempo li::before{content:"";width:22px;height:22px;border-radius:50%;background:var(--negro-3);border:3px solid var(--linea);z-index:1}
.linea-tiempo li::after{content:"";position:absolute;top:11px;left:50%;width:100%;height:3px;background:var(--linea)}
.linea-tiempo li:last-child::after{display:none}
.linea-tiempo li.hecho{color:var(--texto);font-weight:700}
.linea-tiempo li.hecho::before{background:var(--amarillo);border-color:var(--amarillo)}
.linea-tiempo li.hecho::after{background:var(--amarillo)}
.linea-tiempo li.ahora::before{animation:pulso-a 1.6s infinite}
@keyframes pulso-a{50%{box-shadow:0 0 0 8px #ffd21a33}}
.seg__detalle{background:var(--negro-2);border:1px solid var(--linea);border-radius:20px;padding:20px;margin-top:16px}
.seg__detalle h2{font-size:18px;margin-bottom:10px}
.seg__items{list-style:none;padding:0;margin:0}
.seg__items li{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px dashed var(--linea)}
.seg__tot{display:flex;justify-content:space-between;font-weight:800;font-size:18px;padding-top:10px}
.seg__dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:14px 0 0;font-size:14px}
.seg__dl dt{color:var(--suave)}
.seg__dl dd{margin:0}
.seg__btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:20px}
.seg--malo h1{color:#ff8080}

/* responsive */
@media (max-width:1080px){
  .riel{grid-auto-columns:minmax(240px,calc((100% - 32px)/3))}
  .pie__in{grid-template-columns:auto 1fr;}
}
@media (max-width:860px){
  .top__nav{display:none}
  .hero__in{grid-template-columns:1fr;gap:34px}
  .hero__foto{width:min(88%,440px)}
  .hero__masc{width:120px;height:120px;left:-22px;bottom:-22px}
  .slide__txt{text-align:left}
  .slide__foto{width:min(78%,360px)}
  .slide__sello{width:104px;height:104px;font-size:20px;right:-18px}
  .reels__fila{grid-template-columns:repeat(4,72%);overflow-x:auto;scroll-snap-type:x mandatory}
  .reel{scroll-snap-align:start}
  .locales__grid,.pasos{grid-template-columns:1fr}
  .pasos{gap:26px}
  .riel{grid-auto-columns:72%}
  .flechas{display:none}
}
@media (max-width:560px){
  .top__in{gap:10px;padding:8px 12px}
  .top__logo img{width:96px}
  .chip-local{font-size:13px;padding:8px 11px}
  .tabs{top:58px}
  .slide{padding:14px 16px 72px}
  .slide__t{font-size:clamp(40px,13vw,60px)}
  .hero__datos{gap:12px 20px}
  .hero__nota{font-size:18px;right:-4px}
  .grilla{grid-template-columns:1fr 1fr;gap:10px}
  .prod__info{padding:10px 10px 12px}
  .prod h3{font-size:16px}
  .prod p{font-size:12.5px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .precio{font-size:17px}
  .prod__pie{flex-wrap:wrap}
  .btn-mas{padding:8px 12px}
  .btn-mas__txt{display:none}
  .riel{grid-auto-columns:78%}
  .riel .prod p{display:block}
  .pie__in{grid-template-columns:1fr;text-align:left}
  .galeria__fila img{height:190px}
  .cinta span{font-size:16px}
  .linea-tiempo{font-size:11px}
}
@media (max-width:360px){
  .grilla{grid-template-columns:1fr}
  .chip-local{max-width:38vw}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
@media print{body{background:#fff;color:#000}}