/* JohnJohn · Lazy Edge Smashed Burgers — demo IMAN */
:root{
  --naranja:#F7760F;
  --naranja-2:#FF8F1F;
  --naranja-canto:#B9530A;
  --rojo:#EB4A1B;
  --carbon:#1A1613;
  --carbon-2:#2A231D;
  --carbon-3:#3A3029;
  --crema:#FFF3E2;
  --papel:#FFFBF4;
  --azul:#3F63B5;
  --azul-osc:#24407E;
  --azul-claro:#C9D6F2;
  --cheddar:#FFB81C;
  --verde:#2EB872;
  --gris:#8C8178;
  --tit:'Oswald', 'Arial Narrow', sans-serif;
  --serif:'DM Serif Display', Georgia, serif;
  --cuerpo:'Barlow', system-ui, sans-serif;
  --barra-h:84px;
  --top-h:62px;
  --safe-b:env(safe-area-inset-bottom, 0px);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
html{overflow-x:clip;background:var(--crema)}
body{margin:0;font-family:var(--cuerpo);color:var(--carbon);background:var(--crema);-webkit-font-smoothing:antialiased;min-height:100vh}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
img{display:block;max-width:100%}
a{color:inherit}
.mini{display:inline-block;font:700 11px/1 var(--cuerpo);letter-spacing:.14em;text-transform:uppercase}
.tx-chico{font-size:14px;line-height:1.4;color:#5b5047;margin:0 0 14px}

/* ---------- botones ---------- */
.btn{text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 20px;border-radius:999px;font:700 15px/1 var(--cuerpo);letter-spacing:.01em;transition:transform .12s, box-shadow .12s;white-space:nowrap}
.btn:active{transform:translateY(3px)}
.btn-naranja{background:var(--naranja);color:#fff;box-shadow:0 5px 0 var(--naranja-canto)}
.btn-naranja:active{box-shadow:0 2px 0 var(--naranja-canto)}
.btn-crema{background:var(--crema);color:var(--carbon);box-shadow:0 5px 0 rgba(0,0,0,.28)}
.btn-crema:active{box-shadow:0 2px 0 rgba(0,0,0,.28)}
.btn-borde-crema{border:2px solid rgba(255,243,226,.85);color:var(--crema);min-height:46px}
.btn-azul{background:var(--azul-osc);color:#fff;box-shadow:0 5px 0 #142650}
.btn-azul:active{box-shadow:0 2px 0 #142650}
.btn-carbon{background:var(--carbon);color:var(--crema);box-shadow:0 5px 0 #000}
.btn-carbon:active{box-shadow:0 2px 0 #000}
.btn-ancho{width:100%}
.btn b{font:600 16px/1 var(--tit);letter-spacing:.02em}

/* ---------- cabecera ---------- */
.top{position:fixed;top:0;left:0;right:0;z-index:30;height:calc(var(--top-h) + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) 14px 0;display:flex;align-items:center;justify-content:space-between;background:rgba(255,243,226,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.top-logo{display:block;height:44px;width:76px;color:var(--naranja)}
.top-logo svg{height:100%;width:auto;display:block;overflow:visible}
.local-chip{display:flex;align-items:center;gap:9px;background:#fff;border-radius:999px;padding:7px 12px 7px 11px;box-shadow:0 3px 0 rgba(26,22,19,.12),0 0 0 1.5px rgba(26,22,19,.08)}
.local-chip .punto{width:9px;height:9px;border-radius:50%;background:var(--verde);box-shadow:0 0 0 4px rgba(46,184,114,.18);flex:none}
.local-chip.cerrado .punto{background:#c9b9a8;box-shadow:0 0 0 4px rgba(201,185,168,.25)}
.lc-txt{display:flex;flex-direction:column;align-items:flex-start;line-height:1.05}
.lc-txt b{font:600 15px/1.05 var(--tit);text-transform:uppercase;letter-spacing:.02em}
.lc-txt small{font-size:11.5px;color:#7a6d62;font-weight:600}
.local-chip svg{width:11px;height:8px;color:#7a6d62;margin-left:2px}

/* ---------- vistas ---------- */
main{padding-top:calc(var(--top-h) + env(safe-area-inset-top,0px));padding-bottom:calc(var(--barra-h) + var(--safe-b) + 24px)}
.vista{display:none}
.vista.activa{display:block;animation:entraVista .38s cubic-bezier(.2,.8,.2,1)}
@keyframes entraVista{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.saludo{margin:8px 20px 10px;font:italic 400 23px/1.1 var(--serif);color:var(--carbon)}
.saludo b{font-style:italic;font-weight:400;color:var(--naranja)}

/* ---------- plancha (inicio) ---------- */
.plancha{position:relative;margin:0 12px;border-radius:30px;overflow:hidden;color:#fff;
  background:radial-gradient(130% 75% at 50% 40%,#40362e 0%,#231d18 52%,#14110e 100%);
  box-shadow:0 18px 40px -18px rgba(26,22,19,.55)}
.pl-grano{position:absolute;inset:0;opacity:.32;mix-blend-mode:overlay;pointer-events:none;
  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%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E")}
.pl-cab{position:relative;text-align:center;padding:20px 18px 0;min-height:118px}
.pl-chip{display:inline-block;font:700 11px/1 var(--cuerpo);letter-spacing:.16em;text-transform:uppercase;color:var(--naranja-2);margin-bottom:8px}
.pl-titulo{margin:0;font:700 40px/.95 var(--tit);text-transform:uppercase;letter-spacing:.005em;text-wrap:balance}
.pl-titulo .ch{display:inline-block;animation:letraEntra .42s cubic-bezier(.2,.9,.25,1) both}
@keyframes letraEntra{from{opacity:0;transform:translateY(18px) scaleY(1.4)}to{opacity:1;transform:none}}
.pl-escena{position:relative;height:286px;margin-top:-6px;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.pl-burger{position:absolute;left:50%;top:50%;width:64%;max-width:320px;transform:translate(-50%,-50%);filter:drop-shadow(0 18px 18px rgba(0,0,0,.55));will-change:transform}
.pl-sombra{position:absolute;left:50%;bottom:18px;width:52%;height:22px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.6),transparent);filter:blur(2px)}
.pl-lineas{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.pl-lineas path{fill:none;stroke:rgba(255,255,255,.92);stroke-width:1.2;stroke-linecap:round}
.pl-lineas circle{fill:#fff}
.pl-rotulos{position:absolute;inset:0;pointer-events:none}
.rot{position:absolute;max-width:94px;font:600 11.5px/1.15 var(--cuerpo);color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.9),0 0 10px rgba(0,0,0,.7);opacity:0;transform:translateY(4px);transition:opacity .3s, transform .3s}
.rot.izq{text-align:right}
.rot.ver{opacity:1;transform:none}
.pl-vapor{position:absolute;left:50%;top:28%;width:60%;height:60%;transform:translateX(-50%);pointer-events:none}
.pl-vapor i{position:absolute;bottom:0;width:46px;height:46px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.38),transparent);filter:blur(6px);opacity:0}
.pl-vapor i:nth-child(1){left:12%}.pl-vapor i:nth-child(2){left:44%}.pl-vapor i:nth-child(3){left:74%}
.pl-vapor.sube i{animation:vapor 1.3s ease-out forwards}
.pl-vapor.sube i:nth-child(2){animation-delay:.12s}.pl-vapor.sube i:nth-child(3){animation-delay:.22s}
@keyframes vapor{0%{opacity:0;transform:translateY(20px) scale(.6)}25%{opacity:.9}100%{opacity:0;transform:translateY(-90px) scale(1.6)}}

/* sello redondo con aro */
.sello{position:absolute;width:100px;height:100px;border-radius:50%;background:var(--naranja);color:#fff;display:grid;place-items:center;box-shadow:0 5px 0 var(--naranja-canto),0 10px 24px rgba(0,0,0,.35)}
.sello svg{position:absolute;inset:0;width:100%;height:100%;animation:gira 18s linear infinite}
.sello text{font:700 9.6px var(--cuerpo);letter-spacing:.2em;fill:#fff}
@keyframes gira{to{transform:rotate(360deg)}}
.se-in{position:relative;display:flex;flex-direction:column;align-items:center;line-height:1}
.se-in small{font:700 10px/1 var(--cuerpo);letter-spacing:.14em;text-transform:uppercase;opacity:.92;margin-bottom:3px}
.se-in b{font:700 21px/1 var(--tit);letter-spacing:.01em}
.pl-sello{right:12px;bottom:2px;transform:rotate(-8deg)}
.pl-sello.late{animation:selloLate .5s cubic-bezier(.2,.9,.3,1)}
@keyframes selloLate{0%{transform:rotate(-8deg) scale(.6)}100%{transform:rotate(-8deg) scale(1)}}

.pl-pie{position:relative;display:flex;flex-direction:column;gap:12px;padding:6px 16px 0}
.pl-sumar{width:100%;justify-content:space-between;padding:0 22px;min-height:54px;font-size:16px}
.pl-sumar b{font-size:19px}
.pl-nav{position:relative;display:flex;align-items:center;justify-content:space-between;padding:14px 20px 16px}
.pl-puntos{display:flex;gap:6px}
.pl-puntos i{width:7px;height:7px;border-radius:99px;background:rgba(255,255,255,.3);transition:width .3s, background .3s}
.pl-puntos i.on{width:22px;background:var(--naranja)}
.desliza{font:700 11px/1 var(--cuerpo);letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.62);animation:desliza 2.4s ease-in-out infinite}
@keyframes desliza{0%,60%,100%{transform:none}30%{transform:translateX(-6px)}}

/* segmentado */
.seg{display:flex;gap:4px;padding:4px;border-radius:999px;background:rgba(26,22,19,.07)}
.seg button{flex:1;min-height:40px;border-radius:999px;font:600 14px/1 var(--tit);letter-spacing:.04em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:#6d6158;transition:background .2s,color .2s}
.seg button small{font:600 10.5px/1 var(--cuerpo);letter-spacing:0;text-transform:none;opacity:.8}
.seg button.on{background:#fff;color:var(--carbon);box-shadow:0 2px 0 rgba(26,22,19,.18)}
.seg button:disabled{opacity:.35;cursor:not-allowed}
.seg-osc{background:rgba(255,255,255,.08)}
.seg-osc button{color:rgba(255,255,255,.7)}
.seg-osc button.on{background:var(--crema);color:var(--carbon)}

/* ---------- cinta cuadrillé ---------- */
.cinta{position:relative;margin:26px -10px 6px;transform:rotate(-2.2deg);background:var(--azul);overflow:hidden;box-shadow:0 6px 0 rgba(26,22,19,.12);
  background-image:linear-gradient(90deg,rgba(255,255,255,.16) 50%,transparent 0),linear-gradient(rgba(255,255,255,.16) 50%,transparent 0);background-size:22px 22px}
.cinta-in{display:flex;width:max-content;animation:cinta 26s linear infinite;padding:12px 0}
.cinta-in span{font:700 17px/1 var(--tit);letter-spacing:.06em;text-transform:uppercase;color:#fff;padding:0 16px;white-space:nowrap;display:flex;align-items:center;gap:16px}
.cinta-in span::after{content:"";width:16px;height:16px;flex:none;background:var(--cheddar);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
@keyframes cinta{to{transform:translateX(-50%)}}

/* ---------- bloques ---------- */
.bloque{margin:30px 12px 0}
.bl-cab{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 6px 12px}
.bl-cab h2{margin:0;font:700 30px/1 var(--tit);text-transform:uppercase;letter-spacing:.005em}
.chip-reloj{display:inline-flex;align-items:center;gap:7px;background:var(--carbon);color:#fff;border-radius:999px;padding:7px 12px;font:600 12.5px/1 var(--cuerpo);white-space:nowrap}
.chip-reloj i{width:8px;height:8px;border-radius:50%;background:var(--naranja);animation:late 1.2s ease-in-out infinite}
.chip-reloj.apagado{background:#e9dccb;color:#6d6158}.chip-reloj.apagado i{background:#b6a796;animation:none}
.chip-reloj b{font-weight:700;font-variant-numeric:tabular-nums}
@keyframes late{50%{opacity:.35}}
.contador{font:600 18px/1 var(--tit);background:var(--naranja);color:#fff;border-radius:999px;padding:7px 12px}

/* juego */
.card-smash{position:relative;display:flex;align-items:stretch;width:calc(100% - 24px);margin:30px 12px 0;text-align:left;border-radius:28px;overflow:hidden;background:var(--naranja);color:#fff;min-height:236px;box-shadow:0 7px 0 var(--naranja-canto)}
.card-smash::before{content:"";position:absolute;inset:-40%;background:repeating-conic-gradient(from 0deg at 78% 50%,rgba(255,255,255,.09) 0 6deg,transparent 6deg 18deg);pointer-events:none}
.cs-txt{position:relative;flex:1;padding:22px 0 22px 20px;display:flex;flex-direction:column;align-items:flex-start;z-index:1}
.cs-txt h2{margin:8px 0 8px;font:700 38px/.92 var(--tit);text-transform:uppercase}
.cs-txt p{margin:0 0 16px;font-size:13.5px;line-height:1.35;max-width:200px;color:rgba(255,255,255,.95)}
.cs-btn{min-height:44px;padding:0 16px;font-size:14px;margin-top:auto}
.cs-btn i{font-style:normal;font:600 12px/1 var(--cuerpo);background:var(--naranja);color:#fff;border-radius:99px;padding:4px 8px}
.cs-plancha{position:relative;width:46%;flex:none}
.cs-plancha canvas{position:absolute;right:-26px;top:50%;width:190px;height:190px;transform:translateY(-50%);border-radius:50%;background:radial-gradient(closest-side,#4a4038,#221c17 80%,#1a1512);box-shadow:inset 0 0 0 6px #2d2620,inset 0 0 0 9px #554a40,0 12px 26px rgba(0,0,0,.35)}
.cs-boom{position:absolute;right:30px;top:24px;width:96px;height:96px;display:grid;place-items:center;transform:rotate(12deg) scale(0);animation:boom 2.4s linear infinite}
.cs-boom::before{content:"";position:absolute;inset:0;background:var(--cheddar);clip-path:polygon(50% 0,60% 24%,84% 10%,76% 36%,100% 44%,78% 58%,92% 82%,66% 74%,58% 100%,46% 78%,22% 94%,26% 68%,0 60%,22% 46%,6% 22%,32% 28%);filter:drop-shadow(0 3px 0 rgba(0,0,0,.3))}
.cs-boom span{position:relative;font:700 19px/1 var(--tit);color:var(--carbon);letter-spacing:.02em}
@keyframes boom{0%,37%{transform:rotate(12deg) scale(0)}41%{transform:rotate(12deg) scale(1.08)}44%,58%{transform:rotate(12deg) scale(1)}64%,100%{transform:rotate(12deg) scale(0)}}

/* Línea Classic */
.classic{border-radius:26px;background:var(--carbon);color:#fff;overflow:hidden;padding:0 0 14px}
.cl-banda{background:var(--naranja);color:var(--carbon);font:700 12.5px/1 var(--cuerpo);font-style:italic;letter-spacing:.04em;text-transform:uppercase;padding:11px 16px;text-align:center}
.cl-fila{display:grid;grid-template-columns:116px 1fr;gap:14px;align-items:center;padding:14px 14px 0}
.cl-foto{position:relative;height:96px;border-radius:16px;overflow:hidden;background:#2b241e}
.cl-foto img{width:100%;height:100%;object-fit:cover}
.cl-foto span{position:absolute;left:8px;top:8px;background:#fff;color:var(--carbon);font:700 12.5px/1 var(--cuerpo);font-style:italic;padding:5px 8px;border-radius:7px}
.cl-info b{display:block;font:700 22px/1 var(--tit);text-transform:uppercase}
.cl-info p{margin:5px 0 9px;font-size:12.5px;color:rgba(255,255,255,.7);line-height:1.3}
.cl-info .cl-acc{display:flex;align-items:center;gap:10px}
.cl-precio{background:var(--naranja);color:#fff;font:600 17px/1 var(--tit);border-radius:999px;padding:9px 12px}
.cl-mas{width:40px;height:40px;border-radius:50%;background:var(--crema);color:var(--carbon);display:grid;place-items:center;box-shadow:0 3px 0 rgba(0,0,0,.4)}
.cl-mas svg{width:18px;height:18px;stroke:currentColor;stroke-width:2.6;fill:none;stroke-linecap:round}
.cl-pie{margin:14px 14px 0;text-align:center;font-size:13px;color:rgba(255,255,255,.75)}
.cl-pie b{color:#fff}

/* NEW JOHN */
.newjohn{position:relative;border-radius:30px;background:var(--rojo);color:var(--crema);padding:22px 20px 20px;overflow:hidden;box-shadow:0 7px 0 #a8310f}
.newjohn::before{content:"John John";position:absolute;left:-14px;top:150px;font:italic 400 150px/.78 var(--serif);color:rgba(255,243,226,.10);white-space:pre-line;width:200%;pointer-events:none;transform:rotate(-6deg)}
.nj-cuadros{position:absolute;left:0;right:0;bottom:0;height:120px;opacity:.95;background:#fff;
  background-image:linear-gradient(90deg,rgba(63,99,181,.45) 50%,transparent 0),linear-gradient(rgba(63,99,181,.45) 50%,transparent 0);background-size:26px 26px;-webkit-mask:linear-gradient(transparent,#000 60%);mask:linear-gradient(transparent,#000 60%)}
.nj-chip{position:relative;display:inline-block;background:var(--crema);color:var(--rojo);font:700 11.5px/1 var(--cuerpo);letter-spacing:.08em;text-transform:uppercase;border-radius:99px;padding:7px 11px}
.nj-titulo{position:relative;margin:12px 0 10px;font:700 74px/.84 var(--tit);text-transform:uppercase;letter-spacing:-.01em}
.nj-bajada{position:relative;margin:0;max-width:86%;font-size:15px;line-height:1.38}
.nj-burger{position:relative;display:block;width:310px;max-width:96%;margin:-6px -34px -8px auto;filter:drop-shadow(0 22px 22px rgba(70,15,0,.45));animation:flota 5s ease-in-out infinite}
.nj-titulo{max-width:60%}
@keyframes flota{50%{transform:translateY(-10px) rotate(-2deg)}}
.nj-botones{position:relative;display:flex;flex-direction:column;gap:12px;margin-top:0}
.nj-botones .btn{width:100%}
.nj-botones .btn-borde-crema{background:rgba(26,22,19,.25);border-color:transparent;color:#fff}
.nj-botones .btn-borde-crema.on{background:var(--carbon)}

/* tour mini */
.tour-mini{display:block;width:100%;text-align:left;border-radius:26px;background:#fff;padding:18px 16px 20px;box-shadow:0 6px 0 rgba(26,22,19,.12),0 0 0 2px rgba(26,22,19,.06)}
.tm-cab{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}
.tm-cab .mini{color:var(--naranja)}
.tm-cab b{font:700 22px/1.05 var(--tit);text-transform:uppercase}
.tm-ruta{position:relative;display:flex;justify-content:space-between;align-items:center}
.tm-ruta::before{content:"";position:absolute;left:12px;right:12px;top:50%;height:6px;margin-top:-3px;border-radius:9px;background:#efe3d3}
.tm-ruta .tm-llena{position:absolute;left:12px;top:50%;height:6px;margin-top:-3px;border-radius:9px;background:var(--naranja)}
.tm-ruta i{position:relative;width:24px;height:24px;border-radius:50%;background:#fff;border:3px solid #e2d4c2;flex:none;display:grid;place-items:center;overflow:hidden}
.tm-ruta i.ok{border-color:var(--naranja);background:var(--naranja)}
.tm-ruta i.ok::after{content:"";width:8px;height:8px;border-radius:50%;background:#fff}
.tm-ruta i.meta{width:38px;height:38px;border-color:var(--carbon);background:var(--cheddar)}
.tm-ruta i.meta svg{width:20px;height:20px}

/* lo de siempre */
.siempre{display:flex;flex-direction:column;gap:10px}
.si-item{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;background:#fff;border-radius:20px;padding:10px 12px 10px 10px;box-shadow:0 4px 0 rgba(26,22,19,.1)}
.si-item img{width:64px;height:64px;object-fit:contain}
.si-item b{display:block;font:600 17px/1.05 var(--tit);text-transform:uppercase}
.si-item span{font-size:12.5px;color:#7a6d62}
.si-item .btn{min-height:40px;padding:0 14px;font-size:13.5px}

/* slidermania */
.slider-card{position:relative;border-radius:28px;overflow:hidden;color:var(--carbon);background:#fff;box-shadow:0 7px 0 #7fa8d9;padding:22px 20px 22px}
.sl-rayas{position:absolute;inset:0;background:linear-gradient(#74ACDF 0 33.3%,#fff 33.3% 66.6%,#74ACDF 66.6%);opacity:.95}
.sl-sol{position:absolute;right:-30px;top:50%;width:150px;height:150px;margin-top:-75px;border-radius:50%;background:radial-gradient(circle,var(--cheddar) 0 32%,transparent 33%),repeating-conic-gradient(var(--cheddar) 0 7deg,transparent 7deg 22.5deg);-webkit-mask:radial-gradient(circle,#000 0 64%,transparent 65%);mask:radial-gradient(circle,#000 0 64%,transparent 65%);animation:gira 30s linear infinite;opacity:.95}
.sl-txt{position:relative;max-width:78%}
.sl-txt .mini{color:var(--azul-osc)}
.sl-txt h2{margin:8px 0 8px;font:700 44px/.9 var(--tit);text-transform:uppercase;color:var(--azul-osc);letter-spacing:-.005em}
.sl-txt p{margin:0 0 16px;font-size:14px;line-height:1.38;background:rgba(255,255,255,.88);border-radius:12px;padding:8px 10px;margin-left:-10px}
.sl-txt .btn.on{background:var(--carbon);box-shadow:0 5px 0 #000}

/* locales */
.locales{display:flex;flex-direction:column;gap:14px}
.local{border-radius:26px;overflow:hidden;background:#fff;box-shadow:0 6px 0 rgba(26,22,19,.12)}
.lo-foto{position:relative;height:168px;background:var(--carbon);overflow:hidden}
.lo-foto img{width:100%;height:100%;object-fit:cover}
.lo-foto .lo-logo{position:absolute;inset:0;display:grid;place-items:center;color:var(--naranja-2);background:radial-gradient(90% 90% at 50% 45%,#3a312a,#1a1613)}
.lo-foto .lo-logo svg{width:62%;height:auto}
.lo-estado{position:absolute;left:12px;top:12px;display:flex;align-items:center;gap:7px;background:#fff;border-radius:99px;padding:6px 10px;font:700 12px/1 var(--cuerpo)}
.lo-estado i{width:8px;height:8px;border-radius:50%;background:var(--verde)}
.lo-estado.cerrado i{background:#c4b4a2}
.lo-txt{padding:14px 16px 16px}
.lo-txt h3{margin:0;font:700 26px/1 var(--tit);text-transform:uppercase}
.lo-txt p{margin:6px 0 0;font-size:14px;color:#5b5047;line-height:1.35}
.lo-bot{display:flex;gap:10px;margin-top:14px}
.lo-bot .btn{flex:1;min-height:44px;font-size:14px;padding:0 10px}
.lo-bot .btn-linea{border:2px solid var(--carbon);color:var(--carbon)}
.pie-legal{margin:34px 24px 0;text-align:center;font-size:11.5px;color:#9a8c80}

/* ---------- barra ---------- */
.barra{position:fixed;left:10px;right:10px;bottom:calc(10px + var(--safe-b));z-index:40;height:70px;display:grid;grid-template-columns:1fr 1fr 86px 1fr 1fr;align-items:center;border-radius:26px;background:var(--carbon);box-shadow:0 14px 30px -10px rgba(0,0,0,.5);padding:0 6px}
.barra::before{content:"";position:absolute;left:18px;right:18px;top:-4px;height:4px;border-radius:4px 4px 0 0;
  background:#fff;background-image:linear-gradient(90deg,var(--azul) 50%,transparent 0);background-size:12px 4px;opacity:.9}
.tab{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;color:rgba(255,243,226,.55);height:100%;justify-content:center}
.tab svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linejoin:round;stroke-linecap:round}
.tab span{font:600 11.5px/1 var(--cuerpo)}
.tab.activa{color:var(--naranja-2)}
.tab.activa svg{stroke-width:2.3}
.tab-badge{position:absolute;top:9px;right:calc(50% - 22px);min-width:19px;height:19px;border-radius:99px;background:var(--naranja);color:#fff;font:700 11px/19px var(--cuerpo);text-align:center;padding:0 5px;font-style:normal;box-shadow:0 0 0 2.5px var(--carbon)}
.tab-badge.salta{animation:salta .5s}
@keyframes salta{30%{transform:scale(1.45)}}
.tab-smash{position:relative;justify-self:center;width:76px;height:76px;margin-top:-30px}
.ts-rayos{position:absolute;inset:-10px;border-radius:50%;background:repeating-conic-gradient(var(--naranja) 0 5deg,transparent 5deg 22.5deg);-webkit-mask:radial-gradient(circle,transparent 0 56%,#000 57% 70%,transparent 71%);mask:radial-gradient(circle,transparent 0 56%,#000 57% 70%,transparent 71%);animation:gira 16s linear infinite}
.ts-boton{position:absolute;inset:6px;border-radius:50%;display:grid;place-items:center;background:var(--naranja);box-shadow:0 5px 0 var(--naranja-canto),0 0 0 4px var(--carbon);transition:transform .12s}
.tab-smash:active .ts-boton{transform:translateY(3px)}
.ts-boton svg{width:34px;height:34px;fill:#fff}
.ts-badge{position:absolute;right:2px;top:0;min-width:22px;height:22px;border-radius:99px;background:var(--crema);color:var(--carbon);font:700 12px/22px var(--cuerpo);font-style:normal;text-align:center;box-shadow:0 0 0 2.5px var(--carbon)}

/* ---------- carta ---------- */
.carta-cab{padding:10px 0 0}
.titulo-vista{margin:4px 20px 0;font:700 46px/.95 var(--tit);text-transform:uppercase}
.sub-vista{margin:6px 20px 12px;font-size:14px;color:#6d6158}
.cats{position:sticky;top:calc(var(--top-h) + env(safe-area-inset-top,0px));z-index:5;background:var(--crema);display:flex;gap:8px;overflow-x:auto;padding:8px 16px 10px;scrollbar-width:none}
.cats::-webkit-scrollbar{display:none}
.cats button{flex:none;min-height:40px;padding:0 15px;border-radius:999px;background:#fff;font:600 14px/1 var(--tit);text-transform:uppercase;letter-spacing:.04em;box-shadow:0 3px 0 rgba(26,22,19,.12)}
.cats button.on{background:var(--carbon);color:var(--crema);box-shadow:0 3px 0 #000}
.carta{padding:4px 12px 0}
.ca-sec{scroll-margin-top:130px}
.ca-sec h2{margin:22px 8px 10px;font:700 26px/1 var(--tit);text-transform:uppercase;display:flex;align-items:center;gap:10px}
.ca-sec h2 small{font:600 13px/1 var(--cuerpo);text-transform:none;color:#8a7c70}
.item{display:grid;grid-template-columns:84px 1fr;gap:14px;align-items:center;width:100%;text-align:left;background:#fff;border-radius:22px;padding:10px 12px 10px 10px;margin-bottom:10px;box-shadow:0 4px 0 rgba(26,22,19,.09)}
.it-foto{width:84px;height:84px;border-radius:16px;background:radial-gradient(circle at 50% 60%,#3a3029,#1a1613);display:grid;place-items:center;overflow:hidden}
.it-foto img{width:96%;height:96%;object-fit:contain;filter:drop-shadow(0 4px 4px rgba(0,0,0,.4))}
.it-foto.claro{background:#fff;border:1.5px solid #f0e6d8}
.it-foto.claro img{filter:none;width:78%;height:78%}
.it-foto.foto img{width:100%;height:100%;object-fit:cover;filter:none}
.it-txt{min-width:0}
.it-txt b{display:block;font:600 18px/1.05 var(--tit);text-transform:uppercase;letter-spacing:.01em}
.it-txt p{margin:4px 0 8px;font-size:13px;line-height:1.3;color:#6d6158;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.it-pie{display:flex;align-items:center;justify-content:space-between;gap:8px}
.it-precio{font:600 17px/1 var(--tit)}
.it-precio small{font:600 11.5px/1 var(--cuerpo);color:#8a7c70;margin-right:3px}
.it-mas{width:36px;height:36px;border-radius:50%;background:var(--naranja);color:#fff;display:grid;place-items:center;box-shadow:0 3px 0 var(--naranja-canto);flex:none}
.it-mas svg{width:16px;height:16px;stroke:currentColor;stroke-width:2.8;fill:none;stroke-linecap:round}
.it-nd{font:600 12px/1 var(--cuerpo);color:#a09284}

/* ---------- hojas ---------- */
.hoja{position:fixed;inset:0;z-index:60;display:flex;align-items:flex-end;justify-content:center}
.hoja-fondo{position:absolute;inset:0;background:rgba(26,22,19,.55);animation:fade .25s}
@keyframes fade{from{opacity:0}}
.hoja-in{position:relative;width:100%;max-width:560px;max-height:92vh;overflow:auto;background:var(--crema);border-radius:28px 28px 0 0;padding:20px 18px calc(22px + var(--safe-b));animation:sube .36s cubic-bezier(.2,.85,.25,1);overscroll-behavior:contain}
.hoja.sale .hoja-in{animation:baja .24s ease-in forwards}.hoja.sale .hoja-fondo{animation:fade .24s reverse forwards}
@keyframes sube{from{transform:translateY(100%)}}
@keyframes baja{to{transform:translateY(100%)}}
.hoja-in h3{margin:0 0 4px;font:700 28px/1 var(--tit);text-transform:uppercase}
.manija{width:44px;height:5px;border-radius:9px;background:rgba(26,22,19,.18);margin:-8px auto 14px}

.ficha-in{padding:0 0 0;background:var(--crema);display:flex;flex-direction:column}
.fi-top{position:relative;background:radial-gradient(130% 80% at 50% 45%,#40362e,#1d1814 60%,#14110e);color:#fff;padding:22px 16px 6px;text-align:center;border-radius:28px 28px 0 0}
.fi-top .manija{background:rgba(255,255,255,.25)}
.fi-top h3{font-size:36px;line-height:.95;margin:0 auto;max-width:88%}
.fi-cerrar{position:absolute;right:12px;top:12px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center;z-index:3}
.fi-cerrar svg,.sm-cerrar svg,.hi-cerrar svg{width:18px;height:18px;stroke:#fff;stroke-width:2.4;fill:none;stroke-linecap:round}
.fi-escena{position:relative;height:290px}
.fi-escena .pl-burger{width:64%}
.fi-escena.foto .pl-burger{width:auto;height:84%;max-width:90%;border-radius:18px;filter:none}
.fi-cuerpo{padding:16px 18px 0}
.fi-desc{margin:0 0 14px;font-size:15px;line-height:1.4;color:#4f453d}
.fi-lbl{display:block;font:700 11px/1 var(--cuerpo);letter-spacing:.14em;text-transform:uppercase;color:#8a7c70;margin:16px 2px 9px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips button{min-height:38px;padding:0 13px;border-radius:999px;background:#fff;font:600 13.5px/1 var(--cuerpo);box-shadow:0 0 0 1.5px #e6d9c8}
.chips button.on{background:var(--carbon);color:#fff;box-shadow:none}
.veggie{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:#fff;border-radius:18px;padding:10px 12px;box-shadow:0 0 0 1.5px #e6d9c8}
.veggie img{width:44px;height:44px;border-radius:50%}
.veggie span{flex:1;font-size:13.5px;line-height:1.3}
.veggie span b{display:block;font-size:14.5px}
.switch{width:46px;height:28px;border-radius:99px;background:#dccfbf;position:relative;flex:none;transition:background .2s}
.switch::after{content:"";position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 3px rgba(0,0,0,.2);transition:transform .2s}
.veggie.on .switch{background:var(--verde)}.veggie.on .switch::after{transform:translateX(18px)}
.fi-pie{position:sticky;bottom:0;margin-top:20px;padding:12px 14px calc(14px + var(--safe-b));background:linear-gradient(transparent,var(--crema) 30%);display:flex;gap:10px;align-items:center}
.cant{display:flex;align-items:center;background:#fff;border-radius:999px;box-shadow:0 0 0 1.5px #e6d9c8;height:54px}
.cant button{width:44px;height:54px;display:grid;place-items:center;font:600 22px/1 var(--tit)}
.cant b{min-width:22px;text-align:center;font:600 19px/1 var(--tit);font-variant-numeric:tabular-nums}
.fi-pie .btn{flex:1;min-height:54px;justify-content:space-between;padding:0 20px}

.lista-locales{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.ll-op{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:#fff;border-radius:20px;padding:14px;box-shadow:0 0 0 2px transparent,0 4px 0 rgba(26,22,19,.1)}
.ll-op.on{box-shadow:0 0 0 2.5px var(--naranja),0 4px 0 rgba(26,22,19,.1)}
.ll-op i{width:10px;height:10px;border-radius:50%;background:var(--verde);flex:none}
.ll-op.cerrado i{background:#c4b4a2}
.ll-op span{flex:1}
.ll-op b{display:block;font:700 20px/1 var(--tit);text-transform:uppercase}
.ll-op small{font-size:13px;color:#6d6158}
.ll-op em{font-style:normal;font:700 12px/1 var(--cuerpo);color:var(--naranja)}

/* ---------- pedido ---------- */
.pe-vacio{text-align:center;padding:10px 26px 0}
.pe-vacio img{width:58%;margin:0 auto -6px;animation:flota 5s ease-in-out infinite;filter:drop-shadow(0 18px 18px rgba(0,0,0,.18))}
.pe-vacio h1{margin:10px 0 6px;font:700 38px/1 var(--tit);text-transform:uppercase}
.pe-vacio p{margin:0 0 20px;color:#6d6158}
.pe-sec{margin:0 12px 18px;background:#fff;border-radius:24px;padding:16px;box-shadow:0 5px 0 rgba(26,22,19,.09)}
.pe-sec>h3{margin:0 0 12px;font:700 20px/1 var(--tit);text-transform:uppercase}
.pe-item{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;padding:8px 0;border-bottom:1.5px dashed #eadfce}
.pe-item:last-child{border-bottom:0}
.pe-item .it-foto{width:56px;height:56px;border-radius:14px}
.pe-item b{display:block;font:600 16px/1.05 var(--tit);text-transform:uppercase}
.pe-item small{display:block;font-size:12.5px;color:#7a6d62;margin-top:3px}
.pe-item .pe-der{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.pe-item .pe-der span{font:600 16px/1 var(--tit)}
.pe-item .cant{height:34px;box-shadow:0 0 0 1.5px #eadfce}
.pe-item .cant button{width:30px;height:34px;font-size:18px}
.pe-item .cant b{font-size:15px;min-width:16px}
.pe-item.regalo b{color:var(--naranja)}
.pe-tit{display:flex;align-items:flex-end;justify-content:space-between;margin:6px 20px 14px}
.pe-tit h1{margin:0;font:700 46px/.95 var(--tit);text-transform:uppercase}
.pe-tit button{font:600 13px/1 var(--cuerpo);color:#8a7c70;text-decoration:underline;padding-bottom:6px}
.campo{display:block;width:100%;height:48px;border-radius:14px;border:1.5px solid #e6d9c8;background:var(--papel);padding:0 14px;font:500 15px var(--cuerpo);color:var(--carbon);margin-top:10px}
.campo:focus{outline:none;border-color:var(--naranja)}
.pe-tirada{position:relative;display:flex;align-items:center;gap:12px;background:var(--naranja);color:#fff;border-radius:22px;padding:14px;margin:0 12px 18px;overflow:hidden;box-shadow:0 6px 0 var(--naranja-canto)}
.pe-tirada::before{content:"";position:absolute;inset:-60%;background:repeating-conic-gradient(from 0deg at 85% 50%,rgba(255,255,255,.1) 0 6deg,transparent 6deg 18deg)}
.pe-tirada>*{position:relative}
.pe-tirada .ptx{flex:1;font-size:13.5px;line-height:1.3}
.pe-tirada .ptx b{display:block;font:700 20px/1 var(--tit);text-transform:uppercase;margin-bottom:4px}
.pe-tirada img{width:62px;height:62px;object-fit:contain;filter:drop-shadow(0 5px 5px rgba(0,0,0,.3))}
.pe-tirada .btn{min-height:42px;padding:0 14px;font-size:14px}
.pe-tirada.ganada{background:var(--carbon);box-shadow:0 6px 0 #000}
.totales{display:flex;flex-direction:column;gap:7px;font-size:14.5px}
.totales div{display:flex;justify-content:space-between}
.totales .tot{font:700 24px/1 var(--tit);text-transform:uppercase;padding-top:8px;border-top:2px solid var(--carbon);margin-top:4px}
.totales .verde{color:var(--verde);font-weight:700}
.pe-conf{margin:4px 12px 0}
.pe-conf .btn{width:100%;min-height:58px;justify-content:space-between;padding:0 22px;font-size:17px}
.pe-conf .btn b{font-size:21px}
.pe-hora{margin:10px 12px 0;text-align:center;font-size:13.5px;color:#6d6158}
.pe-hora button{color:var(--naranja);font-weight:700;text-decoration:underline}

/* seguimiento */
.seg-cab{margin:6px 12px 0;border-radius:30px;background:var(--carbon);color:#fff;padding:20px 18px 18px;overflow:hidden;position:relative}
.seg-cab .mini{color:var(--naranja-2)}
.seg-num{margin:6px 0 0;font:700 20px/1 var(--tit);letter-spacing:.04em;opacity:.8}
.seg-estado{margin:10px 0 0;font:700 54px/.9 var(--tit);text-transform:uppercase;letter-spacing:-.005em;min-height:98px}
.seg-estado em{font-style:normal;color:var(--naranja-2)}
.seg-eta{margin:8px 0 0;font-size:14.5px;color:rgba(255,255,255,.78)}
.seg-escena{position:relative;height:220px;margin:12px -18px 0;display:grid;place-items:center}
.seg-escena canvas{width:200px;height:200px;border-radius:50%;background:radial-gradient(closest-side,#4a4038,#221c17 80%,#1a1512);box-shadow:inset 0 0 0 6px #2d2620,inset 0 0 0 9px #554a40}
.seg-escena .seg-bolsa{position:absolute;height:210px;opacity:0;transform:translateY(40px) scale(.8);transition:opacity .5s, transform .6s cubic-bezier(.2,.9,.3,1)}
.seg-escena.bolsa .seg-bolsa{opacity:1;transform:none}
.seg-escena.bolsa canvas{opacity:0;transform:scale(.6);transition:opacity .3s, transform .3s}
.pista{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:12px}
.pista div{display:flex;flex-direction:column;gap:7px}
.pista i{height:6px;border-radius:9px;background:rgba(255,255,255,.18);overflow:hidden;position:relative}
.pista i::after{content:"";position:absolute;inset:0;background:var(--naranja);transform:scaleX(0);transform-origin:left;transition:transform .6s}
.pista div.hecho i::after{transform:none}
.pista div.ahora i::after{transform:scaleX(.55);animation:carga 1.6s ease-in-out infinite}
@keyframes carga{50%{transform:scaleX(.85)}}
.pista span{font:600 11.5px/1.1 var(--cuerpo);color:rgba(255,255,255,.5)}
.pista div.hecho span,.pista div.ahora span{color:#fff}
.seg-acc{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 12px 0}
.seg-acc .btn{min-height:50px;font-size:14px;padding:0 10px}
.seg-acc .btn-linea{border:2px solid var(--carbon)}
.puntuar{margin:18px 12px 0;background:#fff;border-radius:24px;padding:16px;box-shadow:0 5px 0 rgba(26,22,19,.09)}
.puntuar h3{margin:0 0 4px;font:700 22px/1 var(--tit);text-transform:uppercase}
.pu-fila{display:grid;grid-template-columns:52px 1fr;gap:12px;align-items:center;padding:12px 0;border-top:1.5px dashed #eadfce}
.pu-fila:first-of-type{border-top:0}
.pu-fila img{width:52px;height:52px;object-fit:contain}
.pu-fila b{display:flex;justify-content:space-between;font:600 15px/1 var(--tit);text-transform:uppercase;margin-bottom:8px}
.pu-fila b em{font-style:normal;color:var(--naranja);font-size:20px}
.pu-notas{display:grid;grid-template-columns:repeat(10,1fr);gap:3px}
.pu-notas button{height:32px;border-radius:8px;background:#f3eadf;font:600 13px/1 var(--tit)}
.pu-notas button.on{background:var(--naranja);color:#fff}

/* ---------- tour (club) ---------- */
.pasaporte{position:relative;margin:8px 12px 0;border-radius:30px;background:var(--naranja);color:#fff;padding:22px 20px 20px;overflow:hidden;min-height:250px;box-shadow:0 7px 0 var(--naranja-canto)}
.pa-rayos{position:absolute;right:-120px;bottom:-150px;width:420px;height:420px;border-radius:50%;background:repeating-conic-gradient(rgba(255,255,255,.14) 0 5deg,transparent 5deg 15deg);animation:gira 60s linear infinite}
.pa-cab{position:relative}
.pa-cab .mini{color:var(--carbon)}
.pa-cab h1{margin:8px 0 8px;font:700 64px/.84 var(--tit);text-transform:uppercase}
.pa-cab p{margin:0;font-size:13.5px;font-weight:600;opacity:.92}
.pa-logo{position:absolute;right:18px;top:20px;width:84px;color:var(--crema)}
.pa-logo svg{width:100%;height:auto;display:block}
.pa-qr{position:relative;display:flex;align-items:center;gap:12px;margin-top:20px;background:var(--crema);color:var(--carbon);border-radius:18px;padding:10px 14px 10px 10px;box-shadow:0 5px 0 rgba(0,0,0,.25)}
.pa-qr span{width:58px;height:58px;display:block}
.pa-qr span svg{width:100%;height:100%;display:block}
.pa-qr small{font:700 14px/1.2 var(--cuerpo);text-align:left}
.pa-qr.grande{flex-direction:column}
.ruta{position:relative;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.parada{position:relative;background:#fff;border-radius:22px;padding:12px 12px 14px;text-align:center;box-shadow:0 5px 0 rgba(26,22,19,.09);overflow:hidden}
.parada .pa-num{position:absolute;left:10px;top:10px;width:26px;height:26px;border-radius:50%;background:var(--carbon);color:#fff;font:600 13px/26px var(--tit)}
.parada img{width:86%;height:96px;object-fit:contain;margin:4px auto 6px;filter:grayscale(1) brightness(1.15) opacity(.32)}
.parada b{display:block;font:600 14.5px/1.05 var(--tit);text-transform:uppercase;min-height:30px}
.parada small{display:block;margin-top:5px;font:600 12px/1 var(--cuerpo);color:#a09284}
.parada.ok img{filter:drop-shadow(0 6px 6px rgba(0,0,0,.25))}
.parada.ok small{color:var(--naranja)}
.parada .estampa{position:absolute;right:8px;top:12px;width:70px;height:70px;border-radius:50%;border:3px solid var(--rojo);color:var(--rojo);display:grid;place-items:center;transform:rotate(-14deg);font:700 11px/1.05 var(--tit);text-transform:uppercase;letter-spacing:.04em;opacity:.88;mix-blend-mode:multiply;text-align:center}
.parada .estampa::before{content:"";position:absolute;inset:4px;border-radius:50%;border:1.5px dashed var(--rojo)}
.parada.nueva .estampa{animation:estampa .55s cubic-bezier(.3,1.4,.5,1) both}
@keyframes estampa{0%{transform:rotate(-14deg) scale(2.4);opacity:0}100%{transform:rotate(-14deg) scale(1);opacity:.88}}
.parada.meta{background:var(--carbon);color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:18px 12px}
.parada.meta b{min-height:0;font-size:17px}
.parada.meta small{color:var(--cheddar);font-size:12.5px}
.parada.meta img{filter:drop-shadow(0 6px 8px rgba(0,0,0,.4));height:80px;margin:0}
.parada.meta.ok{background:var(--naranja)}.parada.meta.ok small{color:#fff}
.puntajes{display:flex;flex-direction:column;gap:8px}
.pt-fila{display:grid;grid-template-columns:30px 54px 1fr auto;gap:10px;align-items:center;background:#fff;border-radius:18px;padding:8px 14px 8px 10px;box-shadow:0 4px 0 rgba(26,22,19,.08)}
.pt-fila em{font-style:normal;font:700 22px/1 var(--tit);color:#c9b9a8;text-align:center}
.pt-fila:first-child em{color:var(--cheddar)}
.pt-fila img{width:54px;height:46px;object-fit:contain}
.pt-fila b{font:600 15px/1.05 var(--tit);text-transform:uppercase}
.pt-fila span{font:700 26px/1 var(--tit);color:var(--naranja)}
.pt-fila span small{font-size:13px;color:#a09284}
.regalos{display:flex;flex-direction:column;gap:10px}
.regalo-card{display:grid;grid-template-columns:70px 1fr auto;gap:12px;align-items:center;background:var(--carbon);color:#fff;border-radius:22px;padding:12px 14px 12px 10px;position:relative;overflow:hidden}
.regalo-card::after{content:"";position:absolute;left:84px;top:8px;bottom:8px;border-left:2px dashed rgba(255,255,255,.18)}
.regalo-card img{width:70px;height:64px;object-fit:contain}
.regalo-card b{display:block;font:700 19px/1 var(--tit);text-transform:uppercase;padding-left:6px}
.regalo-card small{display:block;font-size:12.5px;color:rgba(255,255,255,.7);margin-top:4px;padding-left:6px}
.regalo-card .btn{min-height:40px;padding:0 13px;font-size:13px}
.regalo-vacio{background:#fff;border-radius:22px;padding:16px;font-size:14px;color:#6d6158;text-align:center;box-shadow:0 4px 0 rgba(26,22,19,.08)}
.fechas{display:flex;flex-direction:column;gap:10px}
.fecha{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;background:#fff;border-radius:20px;padding:10px 12px 10px 10px;box-shadow:0 4px 0 rgba(26,22,19,.08)}
.fecha .fe-dia{width:64px;height:64px;border-radius:16px;background:var(--crema);display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px solid var(--carbon)}
.fe-dia b{font:700 26px/1 var(--tit)}
.fe-dia small{font:700 10px/1 var(--cuerpo);letter-spacing:.1em;text-transform:uppercase;color:var(--naranja)}
.fecha strong{display:block;font:600 16px/1.05 var(--tit);text-transform:uppercase}
.fecha span{font-size:12.5px;color:#6d6158;line-height:1.3;display:block;margin-top:3px}
.campana{width:40px;height:40px;border-radius:50%;background:#f3eadf;display:grid;place-items:center}
.campana svg{width:19px;height:19px;fill:none;stroke:var(--carbon);stroke-width:2;stroke-linejoin:round}
.campana.on{background:var(--naranja)}.campana.on svg{stroke:#fff}

/* ---------- smash (juego) ---------- */
.smash{position:fixed;inset:0;z-index:70;display:flex;flex-direction:column;color:#fff;overflow:hidden;
  background:radial-gradient(90% 60% at 50% 105%,rgba(247,118,15,.5),transparent 70%),radial-gradient(120% 70% at 50% 45%,#3d342d,#1b1612 62%,#100d0b);animation:fade .25s}
.smash::before{content:"";position:absolute;inset:0;opacity:.3;mix-blend-mode:overlay;pointer-events:none;background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.06) 0 2px,transparent 2px 7px)}
.sm-cab{position:relative;display:flex;justify-content:space-between;align-items:center;padding:calc(14px + env(safe-area-inset-top,0px)) 14px 0}
.sm-cerrar,.hi-cerrar{width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center}
.sm-tiradas{font:600 15px/1 var(--tit);text-transform:uppercase;letter-spacing:.06em;background:var(--naranja);border-radius:999px;padding:9px 14px}
.sm-titulo{position:relative;text-align:center;padding:10px 20px 0}
.sm-titulo .mini{color:var(--naranja-2)}
.sm-titulo h2{margin:8px 0 0;font:700 46px/.92 var(--tit);text-transform:uppercase}
.sm-plancha{position:relative;flex:1;min-height:300px;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}
.sm-plancha canvas{position:absolute;inset:0;width:100%;height:100%}
.sm-prensa{position:absolute;left:50%;top:0;width:min(62vw,250px);height:46%;transform:translate(-50%,-62%);pointer-events:none;transition:transform .08s linear}
.sm-prensa::before{content:"";position:absolute;left:0;right:0;bottom:0;height:34px;border-radius:12px;background:linear-gradient(#f4f1ed,#b8b0a8 70%,#8c847c);box-shadow:0 6px 0 #5c554f,0 16px 26px rgba(0,0,0,.45)}
.sm-prensa::after{content:"";position:absolute;left:50%;bottom:32px;width:22px;height:400px;transform:translateX(-50%);border-radius:10px 10px 0 0;background:linear-gradient(90deg,#14110e,#3a3029 60%,#14110e)}

.sm-pie{position:relative;padding:0 16px calc(18px + var(--safe-b))}
.sm-premios{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.sm-premios div{background:rgba(255,255,255,.08);border-radius:16px;padding:10px 12px}
.sm-premios b{display:block;font:600 15px/1.05 var(--tit);text-transform:uppercase;color:var(--naranja-2)}
.sm-premios span{font-size:12.5px;color:rgba(255,255,255,.75)}
.sm-boton{width:100%;height:76px;border-radius:24px;background:var(--naranja);box-shadow:0 7px 0 var(--naranja-canto);font:700 22px/1 var(--tit);text-transform:uppercase;letter-spacing:.03em;position:relative;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}
.sm-boton::before{content:"";position:absolute;inset:0;background:var(--rojo);transform:scaleX(var(--p,0));transform-origin:left}
.sm-boton span{position:relative}
.sm-boton.apretado{transform:translateY(4px);box-shadow:0 3px 0 var(--naranja-canto)}
.sm-boton:disabled{background:#4a4038;box-shadow:0 7px 0 #2a231d;color:rgba(255,255,255,.6)}
.sm-res{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px 24px calc(26px + var(--safe-b));background:rgba(16,13,11,.62);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:fade .3s}
.sm-res .res-card{position:relative;width:100%;max-width:360px;background:var(--crema);color:var(--carbon);border-radius:30px;padding:26px 20px 20px;box-shadow:0 8px 0 rgba(0,0,0,.4);animation:resEntra .5s cubic-bezier(.2,.9,.3,1)}
@keyframes resEntra{from{transform:translateY(40px) scale(.9);opacity:0}}
.res-card.gano{background:var(--naranja);color:#fff}
.res-card .mini{color:var(--naranja)}
.res-card.gano .mini{color:var(--carbon)}
.res-card h3{margin:8px 0 6px;font:700 46px/.9 var(--tit);text-transform:uppercase}
.res-card p{margin:0 auto 16px;font-size:15px;line-height:1.38;max-width:290px}
.res-card img{width:62%;margin:-74px auto 4px;filter:drop-shadow(0 16px 16px rgba(0,0,0,.35))}
.res-card .btn{width:100%;margin-top:10px}
.res-card .res-medida{display:inline-flex;gap:6px;align-items:center;font:600 13px/1 var(--cuerpo);background:rgba(26,22,19,.08);border-radius:99px;padding:6px 10px;margin-bottom:12px}
.res-card.gano .res-medida{background:rgba(26,22,19,.18)}
.res-card .res-link{display:block;margin:14px auto 0;font:600 13px/1 var(--cuerpo);text-decoration:underline;opacity:.75}

/* ---------- historias ---------- */
.historias{position:fixed;inset:0;z-index:75;background:#000;color:#fff;animation:fade .25s}
.hi-barras{position:absolute;left:10px;right:10px;top:calc(10px + env(safe-area-inset-top,0px));display:flex;gap:4px;z-index:3}
.hi-barras i{flex:1;height:3px;border-radius:3px;background:rgba(255,255,255,.3);overflow:hidden}
.hi-barras i b{display:block;height:100%;width:0;background:#fff}
.hi-barras i.hecha b{width:100%}
.hi-barras i.ahora b{animation:barra var(--dur,5s) linear forwards}
@keyframes barra{to{width:100%}}
.hi-cerrar{position:absolute;right:12px;top:calc(24px + env(safe-area-inset-top,0px));z-index:4}
.hi-pista{position:absolute;inset:0}
.hi-pag{position:absolute;inset:0;display:none}
.hi-pag.on{display:block}
.hi-pag img.fondo{width:100%;height:100%;object-fit:cover}
.hi-pag::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 50%,rgba(0,0,0,.82));pointer-events:none}
.hi-txt{position:absolute;left:20px;right:20px;bottom:calc(36px + var(--safe-b));z-index:2}
.hi-txt .mini{color:var(--naranja-2)}
.hi-txt h3{margin:8px 0 8px;font:700 44px/.92 var(--tit);text-transform:uppercase}
.hi-txt p{margin:0;font-size:15px;line-height:1.4;color:rgba(255,255,255,.88)}
.hi-pag.final{background:var(--rojo)}
.hi-pag.final::after{display:none}
.hi-pag.final img.fondo{position:absolute;width:118%;height:auto;left:-4%;top:12%;object-fit:contain;filter:drop-shadow(0 26px 26px rgba(70,15,0,.5));animation:flota 5s ease-in-out infinite}
.hi-pag.final .hi-txt .btn{margin-top:16px;width:100%;position:relative;z-index:5}
.hi-zona{position:absolute;top:80px;bottom:140px;width:40%;z-index:2}
.hi-zona.izq{left:0}.hi-zona.der{right:0}

/* ---------- aviso ---------- */
.aviso{position:fixed;left:50%;top:calc(var(--top-h) + 10px + env(safe-area-inset-top,0px));z-index:90;transform:translate(-50%,-20px);opacity:0;pointer-events:none;background:var(--carbon);color:#fff;border-radius:999px;padding:12px 18px;font:600 14px/1.2 var(--cuerpo);box-shadow:0 10px 24px rgba(0,0,0,.3);transition:opacity .25s, transform .3s cubic-bezier(.2,.9,.3,1);max-width:calc(100% - 32px);text-align:center}
.aviso.ver{opacity:1;transform:translate(-50%,0)}

/* vuela al pedido */
.volador{position:fixed;z-index:95;pointer-events:none;width:110px;height:110px;object-fit:contain;filter:drop-shadow(0 10px 10px rgba(0,0,0,.35))}

/* ---------- entrada ---------- */
#intro{position:fixed;inset:0;z-index:100;overflow:hidden;pointer-events:none}
#intro.listo{display:none}
.in-carbon{position:absolute;inset:0;background:var(--carbon)}
.in-sol{position:absolute;left:50%;top:58%;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:var(--naranja);transform:scale(0)}
.in-rayos{position:absolute;left:50%;top:58%;width:900px;height:900px;margin:-450px 0 0 -450px;overflow:visible}
.in-horizonte{position:absolute;left:0;width:100%;top:58%;height:120px;overflow:visible}
.in-logo{position:absolute;left:50%;top:44%;width:min(64vw,300px);transform:translate(-50%,-50%);color:var(--crema);opacity:0}
.in-logo svg{width:100%;height:auto;display:block;overflow:visible}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

.corte{-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.fi-escena.claro::before{content:"";position:absolute;left:50%;top:50%;width:190px;height:190px;margin:-95px 0 0 -95px;border-radius:50%;background:#fff}
.fi-escena.claro .pl-burger{width:auto;height:70%;filter:none}
.fi-escena.claro .pl-sombra{display:none}