/* ============ El Padrino · Mexican Kitchen ============ */
@font-face{font-family:'Oswald';font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/oswald-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Oswald';font-weight:500;font-style:normal;font-display:swap;src:url(../fonts/oswald-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Oswald';font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/oswald-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Oswald';font-weight:700;font-style:normal;font-display:swap;src:url(../fonts/oswald-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Source Sans 3';font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/source-sans-3-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Source Sans 3';font-weight:400;font-style:italic;font-display:swap;src:url(../fonts/source-sans-3-latin-400-italic.woff2) format('woff2')}
@font-face{font-family:'Source Sans 3';font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/source-sans-3-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Source Sans 3';font-weight:700;font-style:normal;font-display:swap;src:url(../fonts/source-sans-3-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Cinzel';font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/cinzel-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Cinzel';font-weight:700;font-style:normal;font-display:swap;src:url(../fonts/cinzel-latin-700-normal.woff2) format('woff2')}

:root{
  --negro:#0c0a08; --carbon:#15110d; --carbon2:#1c1712; --madera:#2a1d14; --linea:rgba(233,180,76,.18);
  --oro:#e9b44c; --oro2:#f6d27a; --oro-osc:#b9822b; --rojo:#b3202c; --rojo2:#d6343f; --verde:#1f7a5c; --verde2:#2fa07a;
  --crema:#f7ecd6; --texto:#efe6d6; --tenue:#a99a85; --tenue2:#7c6f5f;
  --radio:18px; --sombra:0 18px 50px rgba(0,0,0,.55);
  --lado:clamp(16px,4vw,48px); --ancho:1240px;
  --t-titulo:'Cinzel',Georgia,serif; --t-cond:'Oswald','Arial Narrow',sans-serif; --t-texto:'Source Sans 3',system-ui,sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html,body{margin:0;overflow-x:clip}
body{background:var(--negro);color:var(--texto);font:400 16px/1.5 var(--t-texto);-webkit-font-smoothing:antialiased;min-height:100vh}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
a{color:inherit;text-decoration:none}
svg{width:1em;height:1em;flex:none}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--oro2);outline-offset:3px;border-radius:6px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* textura de fondo: brillos rojo y verde como el menú impreso */
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(60vmax 40vmax at -10% -5%,rgba(179,32,44,.22),transparent 60%),
             radial-gradient(60vmax 40vmax at 110% 0%,rgba(31,122,92,.22),transparent 60%),
             radial-gradient(80vmax 50vmax at 50% 120%,rgba(185,130,43,.10),transparent 60%),var(--negro)}

/* ---------- botones ---------- */
.btn-oro{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;
  background:linear-gradient(180deg,var(--oro2),var(--oro) 55%,var(--oro-osc));color:#1b1206;font:600 17px/1 var(--t-cond);letter-spacing:.06em;text-transform:uppercase;
  box-shadow:0 10px 26px rgba(233,180,76,.25),inset 0 1px 0 rgba(255,255,255,.5);transition:transform .2s,box-shadow .2s,filter .2s}
.btn-oro:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(233,180,76,.32),inset 0 1px 0 rgba(255,255,255,.5)}
.btn-oro:active{transform:translateY(0)}
.btn-oro[disabled]{filter:grayscale(.7) brightness(.6);cursor:not-allowed;transform:none}
.btn-oro svg{width:20px;height:20px}
.btn-oro.ancho{width:100%;justify-content:space-between}
.btn-borde{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 22px;border-radius:999px;border:1px solid var(--oro);color:var(--oro2);font:500 15px var(--t-cond);letter-spacing:.06em;text-transform:uppercase}
.btn-borde:hover{background:rgba(233,180,76,.1)}

/* ---------- cabecera ---------- */
.cab{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;gap:20px;height:72px;padding:0 var(--lado);padding-top:env(safe-area-inset-top);
  transition:background .3s,box-shadow .3s,height .3s}
.cab.solida{background:rgba(12,10,8,.86);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 1px 0 var(--linea);height:64px}
.marca{display:flex;align-items:center;gap:10px;min-width:0}
.marca img{width:44px;height:44px;object-fit:contain;filter:drop-shadow(0 2px 6px rgba(0,0,0,.6))}
.marca b{display:block;font:700 19px/1 var(--t-titulo);color:var(--oro2);letter-spacing:.04em}
.marca small{display:block;font:500 10px/1.4 var(--t-cond);letter-spacing:.32em;text-transform:uppercase;color:var(--tenue);margin-top:3px}
.cab-nav{display:none;gap:30px;margin-left:auto}
.cab-nav a{font:500 14px var(--t-cond);letter-spacing:.14em;text-transform:uppercase;color:var(--texto);opacity:.85;position:relative;padding:6px 0}
.cab-nav a::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--oro);transform:scaleX(0);transition:transform .25s}
.cab-nav a:hover{opacity:1}.cab-nav a:hover::after{transform:scaleX(1)}
.cab-der{display:flex;align-items:center;gap:10px;margin-left:auto}
.idioma{height:40px;min-width:44px;padding:0 10px;border-radius:999px;border:1px solid var(--linea);font:600 13px var(--t-cond);letter-spacing:.1em;color:var(--tenue)}
.idioma:hover{color:var(--oro2);border-color:var(--oro)}
.btn-carrito{position:relative;display:flex;align-items:center;gap:8px;height:44px;padding:0 16px 0 14px;border-radius:999px;background:rgba(233,180,76,.12);border:1px solid rgba(233,180,76,.4);color:var(--oro2)}
.btn-carrito svg{width:22px;height:22px}
.btn-carrito-total{font:600 15px var(--t-cond);letter-spacing:.04em}
.burbuja{position:absolute;top:-6px;right:-6px;min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:var(--rojo2);color:#fff;font:700 12px/22px var(--t-texto);text-align:center;box-shadow:0 0 0 3px var(--negro)}
.btn-carrito.salta{animation:salta .5s cubic-bezier(.3,1.6,.5,1)}
@keyframes salta{40%{transform:scale(1.15)}}

/* ---------- portada ---------- */
.portada{position:relative;min-height:100svh;display:flex;align-items:center;padding:96px var(--lado) 60px;overflow:hidden;isolation:isolate}
.portada-fondo{position:absolute;inset:0;z-index:-2;background:
  radial-gradient(50% 60% at 78% 45%,rgba(214,90,40,.25),transparent 70%),
  linear-gradient(180deg,rgba(12,10,8,0) 60%,var(--negro))}
.brasas{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none}
.portada-in{width:100%;max-width:var(--ancho);margin:0 auto;display:grid;gap:36px;align-items:center}
.portada-texto{position:relative;z-index:2;text-align:center}
.portada-logo{width:min(330px,74vw);height:auto;margin:0 auto 18px;border-radius:10px;box-shadow:0 30px 60px rgba(0,0,0,.6),0 0 0 1px rgba(233,180,76,.25);animation:flota 6s ease-in-out infinite}
@keyframes flota{50%{transform:translateY(-8px) rotate(-.4deg)}}
.portada h1{font:700 clamp(28px,6.4vw,46px)/1.1 var(--t-titulo);color:var(--crema);margin:0 0 14px;letter-spacing:.01em;text-shadow:0 4px 30px rgba(0,0,0,.6)}
.portada h1 em{display:block;font-style:normal;background:linear-gradient(180deg,var(--oro2),var(--oro) 60%,var(--oro-osc));-webkit-background-clip:text;background-clip:text;color:transparent}
.portada-sub{max-width:520px;margin:0 auto 26px;color:var(--tenue);font-size:clamp(16px,1.6vw,19px)}
.modo-grande{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:520px;margin:0 auto 18px}
.modo-op{display:flex;align-items:center;gap:12px;text-align:left;padding:14px 16px;border-radius:16px;border:1px solid var(--linea);background:rgba(28,23,18,.75);backdrop-filter:blur(6px);transition:border-color .2s,background .2s,transform .2s}
.modo-op svg{width:30px;height:30px;color:var(--oro)}
.modo-op b{display:block;font:600 18px/1.1 var(--t-cond);letter-spacing:.05em;text-transform:uppercase;color:var(--crema)}
.modo-op small{display:block;font-size:13px;color:var(--tenue);margin-top:3px}
.modo-op:hover{transform:translateY(-2px);border-color:rgba(233,180,76,.5)}
.modo-op[aria-checked="true"]{border-color:var(--oro);background:linear-gradient(180deg,rgba(233,180,76,.2),rgba(233,180,76,.06));box-shadow:0 0 0 1px var(--oro) inset,0 10px 30px rgba(233,180,76,.12)}
.estado{display:inline-flex;align-items:center;gap:8px;margin:18px 0 0;font:500 14px var(--t-cond);letter-spacing:.08em;text-transform:uppercase;color:var(--tenue)}
.punto{width:9px;height:9px;border-radius:50%;background:var(--verde2);box-shadow:0 0 0 0 rgba(47,160,122,.6);animation:late 2s infinite}
.estado.cerrado .punto{background:var(--rojo2);animation:none}
@keyframes late{70%{box-shadow:0 0 0 10px rgba(47,160,122,0)}100%{box-shadow:0 0 0 0 rgba(47,160,122,0)}}
/* foto del local en 3D */
.portada-foto{position:relative;perspective:1300px;width:min(420px,82vw);margin:0 auto}
.foto-marco{position:relative;border-radius:22px;overflow:hidden;transform-style:preserve-3d;transform:rotateY(var(--ry,-8deg)) rotateX(var(--rx,4deg));transition:transform .5s cubic-bezier(.2,.7,.2,1);
  box-shadow:0 40px 80px rgba(0,0,0,.65),0 0 0 1px rgba(233,180,76,.35),0 0 0 8px rgba(21,17,13,.9),0 0 0 9px rgba(233,180,76,.25)}
.foto-marco img{width:100%;aspect-ratio:2/3;object-fit:cover;transform:scale(1.06) translate3d(var(--fx,0),var(--fy,0),0);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.foto-brillo{position:absolute;inset:0;background:radial-gradient(circle at var(--gx,30%) var(--gy,20%),rgba(255,230,180,.28),transparent 45%);mix-blend-mode:soft-light;pointer-events:none}
.foto-etiqueta{position:absolute;left:-14px;bottom:28px;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:rgba(12,10,8,.85);border:1px solid var(--linea);font:500 13px var(--t-cond);letter-spacing:.1em;text-transform:uppercase;color:var(--oro2);transform:translateZ(60px);box-shadow:var(--sombra);backdrop-filter:blur(8px)}
.foto-etiqueta svg{width:18px;height:18px}
.bajar{position:absolute;left:50%;bottom:18px;width:26px;height:42px;margin-left:-13px;border-radius:14px;border:1.5px solid rgba(233,180,76,.5);display:none}
.bajar span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--oro);animation:rueda 1.8s infinite}
@keyframes rueda{60%{transform:translateY(12px);opacity:0}}

/* ---------- títulos de sección ---------- */
.titulo-sec{text-align:center;margin:0 auto 34px;padding:0 var(--lado)}
.adorno{width:90px;height:27px;color:var(--rojo2)}
.titulo-sec h2{font:700 clamp(30px,4.4vw,48px)/1.1 var(--t-titulo);margin:6px 0 8px;background:linear-gradient(180deg,var(--oro2),var(--oro) 65%,var(--oro-osc));-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:.02em}
.titulo-sec p{margin:0;color:var(--tenue)}

/* ---------- favoritos (carrusel 3D) ---------- */
.favoritos{padding:80px 0 60px;overflow:hidden}
.carrusel3d{position:relative;height:500px;perspective:1400px;max-width:var(--ancho);margin:0 auto;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.carrusel-escena{position:absolute;inset:0;transform-style:preserve-3d}
.plato{position:absolute;left:50%;top:10px;width:280px;margin-left:-140px;border-radius:22px;overflow:hidden;background:linear-gradient(180deg,var(--carbon2),var(--carbon));border:1px solid var(--linea);box-shadow:var(--sombra);
  transition:transform .7s cubic-bezier(.2,.75,.2,1),opacity .7s,filter .7s;cursor:pointer;will-change:transform}
.plato-img{position:relative;height:250px;overflow:hidden}
.plato-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.plato-img::after{content:'';position:absolute;inset:auto 0 0;height:60%;background:linear-gradient(transparent,rgba(21,17,13,.95))}
.plato:hover .plato-img img{transform:scale(1.06)}
.plato-info{position:relative;padding:0 18px 18px;margin-top:-34px}
.plato-info h3{margin:0 0 4px;font:600 21px/1.15 var(--t-cond);letter-spacing:.03em;text-transform:uppercase;color:var(--crema)}
.plato-info p{margin:0 0 14px;font:italic 14px/1.4 var(--t-texto);color:var(--tenue);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.plato-fila{display:flex;align-items:center;justify-content:space-between}
.precio{font:600 20px var(--t-cond);color:var(--oro2);letter-spacing:.03em}
.mas{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:linear-gradient(180deg,var(--oro2),var(--oro-osc));color:#1b1206;box-shadow:0 6px 16px rgba(233,180,76,.3);transition:transform .2s}
.mas svg{width:22px;height:22px}
.mas:hover{transform:scale(1.08) rotate(90deg)}
.carrusel-btn{position:absolute;top:auto;bottom:-6px;z-index:5;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:rgba(12,10,8,.8);border:1px solid var(--linea);color:var(--oro2);backdrop-filter:blur(6px)}
.carrusel-btn svg{width:22px;height:22px}
.carrusel-btn.ant{left:calc(50% - 150px)}.carrusel-btn.sig{right:calc(50% - 150px)}
.carrusel-btn:hover{border-color:var(--oro);background:rgba(233,180,76,.15)}
.carrusel-puntos{display:flex;justify-content:center;gap:8px;margin-top:-26px;position:relative;z-index:4}
.carrusel-puntos button{width:9px;height:9px;border-radius:5px;background:rgba(233,180,76,.25);transition:width .3s,background .3s}
.carrusel-puntos button[aria-current="true"]{width:26px;background:var(--oro)}

/* ---------- menú ---------- */
.menu{padding:70px 0 40px}
.menu-barra{position:sticky;top:64px;z-index:30;background:rgba(12,10,8,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-block:1px solid var(--linea);padding:12px var(--lado) 10px}
.buscar{display:flex;align-items:center;gap:10px;max-width:var(--ancho);margin:0 auto 10px;height:46px;padding:0 16px;border-radius:999px;background:var(--carbon2);border:1px solid var(--linea)}
.buscar svg{width:20px;height:20px;color:var(--tenue)}
.buscar input{flex:1;min-width:0;height:100%;border:0;background:none;outline:0;font-size:16px}
.buscar input::placeholder{color:var(--tenue2)}
.cats{display:flex;gap:8px;max-width:var(--ancho);margin:0 auto;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;padding-bottom:2px;mask-image:linear-gradient(90deg,#000 92%,transparent)}
.cats::-webkit-scrollbar{display:none}
.cat{flex:none;display:flex;align-items:center;gap:8px;height:40px;padding:0 15px;border-radius:999px;border:1px solid var(--linea);color:var(--tenue);font:500 14px var(--t-cond);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;scroll-snap-align:start;transition:all .2s}
.cat svg{width:20px;height:20px}
.cat:hover{color:var(--crema);border-color:rgba(233,180,76,.45)}
.cat[aria-current="true"]{background:var(--oro);border-color:var(--oro);color:#1b1206}
.menu-cuerpo{max-width:var(--ancho);margin:0 auto;padding:10px var(--lado) 0}
.seccion{scroll-margin-top:190px;padding-top:44px}
.seccion-cab{display:flex;align-items:center;gap:14px;margin-bottom:6px}
.seccion-cab .ico{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:linear-gradient(145deg,rgba(233,180,76,.18),rgba(179,32,44,.12));border:1px solid var(--linea);color:var(--oro2);transform:rotate(-4deg)}
.seccion-cab .ico svg{width:30px;height:30px}
.seccion h3{margin:0;font:700 clamp(24px,3vw,34px)/1.1 var(--t-cond);letter-spacing:.05em;text-transform:uppercase;color:var(--oro2)}
.seccion-nota{margin:6px 0 18px;font:italic 15px var(--t-texto);color:var(--tenue)}
.platos{display:grid;gap:14px;margin-top:16px}
.item{position:relative;display:flex;gap:14px;padding:16px;border-radius:var(--radio);background:linear-gradient(180deg,rgba(28,23,18,.92),rgba(21,17,13,.92));border:1px solid rgba(233,180,76,.12);cursor:pointer;
  transition:transform .35s cubic-bezier(.2,.75,.2,1),border-color .25s,box-shadow .35s;transform-style:preserve-3d;transform:perspective(900px) rotateX(var(--trx,0)) rotateY(var(--try,0))}
.item:hover{border-color:rgba(233,180,76,.38);box-shadow:0 20px 40px rgba(0,0,0,.45)}
.item-txt{flex:1;min-width:0;display:flex;flex-direction:column}
.item h4{margin:0 0 4px;font:500 19px/1.2 var(--t-cond);letter-spacing:.03em;color:var(--crema)}
.item h4 .raw{color:var(--rojo2);margin-left:2px}
.item p{margin:0 0 12px;font:italic 15px/1.45 var(--t-texto);color:var(--tenue);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.item-pie{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px}
.item .precio{font-size:19px}
.item .precio small{font:400 13px var(--t-texto);color:var(--tenue);margin-left:4px;letter-spacing:0}
.item .mas{width:40px;height:40px}
.item-img{flex:none;width:112px;height:112px;border-radius:14px;overflow:hidden;align-self:center;box-shadow:0 10px 24px rgba(0,0,0,.5)}
.item-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.item:hover .item-img img{transform:scale(1.08)}
.item.agotado{cursor:default}
.item.agotado .precio{color:var(--tenue2);font-size:15px}
.etiqueta{display:inline-block;padding:2px 8px;border-radius:6px;background:rgba(179,32,44,.22);color:#ff9aa1;font:600 11px/1.6 var(--t-cond);letter-spacing:.1em;text-transform:uppercase;margin-left:6px;vertical-align:2px}
.etiqueta.oro{background:rgba(233,180,76,.16);color:var(--oro2)}
.en-carrito{position:absolute;top:-8px;right:-8px;min-width:26px;height:26px;padding:0 7px;border-radius:13px;background:var(--verde2);color:#fff;font:700 13px/26px var(--t-texto);text-align:center;box-shadow:0 0 0 3px var(--negro)}
.sin-resultados{text-align:center;color:var(--tenue);padding:40px 0}
.aviso-crudo{max-width:var(--ancho);margin:40px auto 0;padding:0 var(--lado);font:italic 13px/1.5 var(--t-texto);color:var(--tenue2);text-align:center}

/* ---------- visítanos ---------- */
.visitanos{padding:70px var(--lado)}
.visitanos-in{max-width:var(--ancho);margin:0 auto;display:grid;gap:14px}
.tarjeta-info{padding:26px;border-radius:var(--radio);background:linear-gradient(160deg,rgba(42,29,20,.9),rgba(21,17,13,.9));border:1px solid var(--linea);text-align:center}
.tarjeta-info>svg{width:34px;height:34px;color:var(--oro)}
.tarjeta-info h3{margin:10px 0 10px;font:600 20px var(--t-cond);letter-spacing:.1em;text-transform:uppercase;color:var(--crema)}
.tarjeta-info ul{list-style:none;margin:0;padding:0}
.tarjeta-info li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px dashed rgba(233,180,76,.15);color:var(--tenue)}
.tarjeta-info li b{color:var(--texto);font-weight:600}
.tarjeta-info p{margin:0;color:var(--tenue)}
.pendiente{font-style:italic;color:var(--tenue2)!important}

.pie{text-align:center;padding:40px var(--lado) calc(110px + env(safe-area-inset-bottom));border-top:1px solid var(--linea);color:var(--tenue)}
.pie img{width:56px;height:56px;object-fit:contain;margin:0 auto 10px}
.pie p{margin:4px 0}.pie b{font-family:var(--t-titulo);color:var(--oro2)}
.pie-mini{font-size:13px;color:var(--tenue2)}

/* ---------- barra inferior (teléfono) ---------- */
.barra-pedido{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:40;display:flex;align-items:center;gap:12px;height:58px;padding:0 20px 0 10px;border-radius:999px;
  background:linear-gradient(180deg,var(--oro2),var(--oro) 55%,var(--oro-osc));color:#1b1206;font:600 16px var(--t-cond);letter-spacing:.06em;text-transform:uppercase;box-shadow:0 14px 40px rgba(0,0,0,.6);animation:sube .45s cubic-bezier(.2,.8,.2,1)}
.barra-pedido b{margin-left:auto;font-size:18px}
.barra-cuenta{display:grid;place-items:center;min-width:38px;height:38px;border-radius:50%;background:#1b1206;color:var(--oro2);font-size:16px}
@keyframes sube{from{transform:translateY(120%)}}

/* ---------- capas / hojas ---------- */
.capa{position:fixed;inset:0;z-index:100;display:flex;align-items:flex-end;justify-content:center;background:rgba(5,4,3,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;transition:opacity .3s}
.capa.ver{opacity:1}
.hoja{position:relative;width:100%;max-height:92svh;display:flex;flex-direction:column;background:linear-gradient(180deg,var(--carbon2),var(--carbon));border:1px solid var(--linea);border-radius:26px 26px 0 0;box-shadow:0 -20px 60px rgba(0,0,0,.6);
  transform:translateY(40px) scale(.98);transition:transform .45s cubic-bezier(.2,.8,.2,1);overflow:hidden}
.capa.ver .hoja{transform:none}
.cerrar{position:absolute;top:12px;right:12px;z-index:5;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:rgba(12,10,8,.75);border:1px solid var(--linea);color:var(--crema);backdrop-filter:blur(6px)}
.cerrar svg{width:20px;height:20px}
/* producto */
.prod-cab{position:relative;height:200px;flex:none;overflow:hidden;background:radial-gradient(circle at 30% 20%,rgba(233,180,76,.25),transparent 55%),radial-gradient(circle at 80% 90%,rgba(179,32,44,.3),transparent 55%),var(--madera)}
.prod-cab img{width:100%;height:100%;object-fit:cover}
.prod-cab::after{content:'';position:absolute;inset:auto 0 0;height:50%;background:linear-gradient(transparent,var(--carbon2))}
.prod-cab .ico-grande{position:absolute;inset:0;display:grid;place-items:center;color:var(--oro);opacity:.9}
.prod-cab .ico-grande svg{width:96px;height:96px;filter:drop-shadow(0 10px 20px rgba(0,0,0,.6));animation:gira 8s ease-in-out infinite}
@keyframes gira{50%{transform:rotate(-6deg) scale(1.05)}}
.prod-cuerpo{flex:1;overflow:auto;padding:0 22px 16px;margin-top:-26px;position:relative;z-index:2;overscroll-behavior:contain}
.prod-cuerpo h3{margin:0;font:600 26px/1.15 var(--t-cond);letter-spacing:.03em;text-transform:uppercase;color:var(--crema)}
.prod-precio{margin:6px 0 8px;font:600 20px var(--t-cond);color:var(--oro2)}
.prod-desc{margin:0 0 14px;font:italic 16px/1.5 var(--t-texto);color:var(--tenue)}
.grupo{margin:18px 0 0;padding:0;border:0}
.grupo legend{display:flex;align-items:center;gap:8px;width:100%;margin-bottom:10px;font:600 15px var(--t-cond);letter-spacing:.1em;text-transform:uppercase;color:var(--crema)}
.grupo legend small{margin-left:auto;padding:2px 8px;border-radius:6px;background:rgba(179,32,44,.25);color:#ff9aa1;font:600 11px var(--t-cond);letter-spacing:.08em}
.grupo legend small.ok{background:rgba(47,160,122,.2);color:#7fe0bd}
.grupo.falta legend small{animation:sacude .4s}
@keyframes sacude{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;cursor:pointer}
.chip span{display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:8px 15px;border-radius:12px;border:1px solid rgba(233,180,76,.22);background:rgba(12,10,8,.4);font-size:15px;color:var(--texto);transition:all .18s}
.chip span em{font-style:normal;color:var(--oro2);font-weight:600}
.chip input:checked+span{border-color:var(--oro);background:rgba(233,180,76,.16);color:var(--oro2);box-shadow:0 0 0 1px var(--oro) inset}
.chip input:focus-visible+span{outline:2px solid var(--oro2);outline-offset:2px}
.prod-nota{display:block;margin-top:18px}
.prod-nota span{display:block;margin-bottom:8px;font:600 15px var(--t-cond);letter-spacing:.1em;text-transform:uppercase}
textarea,.campo input,.select{width:100%;padding:12px 14px;border-radius:12px;border:1px solid rgba(233,180,76,.22);background:rgba(12,10,8,.5);color:var(--texto);font-size:16px;outline:0;transition:border-color .2s;resize:vertical}
textarea:focus,.campo input:focus,.select:focus{border-color:var(--oro)}
.prod-pie{display:flex;gap:12px;align-items:center;padding:14px 18px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--linea);background:rgba(12,10,8,.6)}
.prod-pie .btn-oro{flex:1}
.cantidad{display:flex;align-items:center;height:52px;border-radius:999px;border:1px solid var(--linea);background:rgba(12,10,8,.6)}
.cantidad button{display:grid;place-items:center;width:44px;height:100%;color:var(--oro2)}
.cantidad button svg{width:18px;height:18px}
.cantidad output{min-width:26px;text-align:center;font:600 18px var(--t-cond)}
/* carrito */
.capa.lateral{justify-content:flex-end;align-items:stretch}
.carrito{width:min(440px,100%);height:100%;display:flex;flex-direction:column;background:linear-gradient(180deg,var(--carbon2),var(--carbon));border-left:1px solid var(--linea);box-shadow:-20px 0 60px rgba(0,0,0,.6);transform:translateX(100%);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.capa.ver .carrito{transform:none}
.carrito-cab{position:relative;padding:20px 22px 12px;padding-top:calc(20px + env(safe-area-inset-top))}
.carrito-cab h3{margin:0;font:700 26px var(--t-titulo);color:var(--oro2)}
.carrito-cab .cerrar{top:calc(14px + env(safe-area-inset-top))}
.modo-chico{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:0 22px;padding:5px;border-radius:14px;background:rgba(12,10,8,.6);border:1px solid var(--linea)}
.modo-chico .modo-op{justify-content:center;padding:10px;border:0;background:none;border-radius:10px;gap:8px;font:600 15px var(--t-cond);letter-spacing:.08em;text-transform:uppercase;color:var(--tenue);backdrop-filter:none}
.modo-chico .modo-op svg{width:22px;height:22px;color:currentColor}
.modo-chico .modo-op[aria-checked="true"]{background:var(--oro);color:#1b1206;box-shadow:none}
.carrito-eta{display:flex;align-items:center;gap:8px;margin:12px 22px 4px;color:var(--tenue);font-size:14px}
.carrito-eta svg{width:18px;height:18px;color:var(--oro)}
.carrito-lista{flex:1;overflow:auto;padding:6px 22px;overscroll-behavior:contain}
.linea-ped{display:grid;grid-template-columns:1fr auto;gap:6px 12px;padding:16px 0;border-bottom:1px dashed rgba(233,180,76,.16);animation:entra .35s}
@keyframes entra{from{opacity:0;transform:translateX(20px)}}
.linea-ped h4{margin:0;font:500 17px/1.2 var(--t-cond);letter-spacing:.03em;color:var(--crema)}
.linea-ped .det{grid-column:1;margin:0;font-size:14px;color:var(--tenue);line-height:1.4}
.linea-ped .det i{color:var(--tenue2)}
.linea-ped .lp-precio{font:600 17px var(--t-cond);color:var(--oro2);text-align:right}
.linea-ped .acciones{grid-column:1/-1;display:flex;align-items:center;gap:8px;margin-top:4px}
.linea-ped .cantidad{height:38px}
.linea-ped .cantidad button{width:36px}
.linea-ped .cantidad output{font-size:16px}
.icono-btn{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid var(--linea);color:var(--tenue)}
.icono-btn:hover{color:var(--oro2);border-color:var(--oro)}
.icono-btn svg{width:18px;height:18px}
.icono-btn.borrar{margin-left:auto}
.icono-btn.borrar:hover{color:#ff8a92;border-color:var(--rojo2)}
.carrito-vacio{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:30px;text-align:center;color:var(--tenue)}
.carrito-vacio img{width:90px;height:90px;object-fit:contain;opacity:.6;filter:grayscale(.3)}
.carrito-pie{padding:14px 22px calc(18px + env(safe-area-inset-bottom));border-top:1px solid var(--linea);background:rgba(12,10,8,.55)}
.totales{display:grid;grid-template-columns:1fr auto;gap:6px 10px;margin:0 0 14px;font-size:15px}
.totales dt{color:var(--tenue)}.totales dd{margin:0;text-align:right}
.totales .total{font:600 20px var(--t-cond);color:var(--crema);padding-top:8px;border-top:1px solid var(--linea)}
.totales dd.total{color:var(--oro2)}
.aviso-min{margin:-6px 0 12px;font-size:14px;color:#ffb36b}
/* pago */
.pago{height:100svh;max-height:100svh;border-radius:0}
.pago-cab{position:relative;display:flex;align-items:center;justify-content:center;padding:16px 60px;padding-top:calc(16px + env(safe-area-inset-top));border-bottom:1px solid var(--linea)}
.pago-cab h3{margin:0;font:700 22px var(--t-titulo);color:var(--oro2)}
.pago-cab .cerrar{top:calc(10px + env(safe-area-inset-top))}
.volver{position:absolute;left:12px;top:calc(10px + env(safe-area-inset-top));display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--linea);color:var(--crema)}
.volver svg{width:20px;height:20px}
.pasos{display:flex;justify-content:center;gap:4px;list-style:none;margin:0;padding:14px 16px 6px}
.pasos li{display:flex;align-items:center;gap:6px;color:var(--tenue2);font:500 12px var(--t-cond);letter-spacing:.06em;text-transform:uppercase}
.pasos li+li::before{content:'';width:18px;height:1px;background:var(--linea);margin-right:2px}
.pasos span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1px solid var(--linea);font-size:13px}
.pasos b{display:none;font-weight:500}
.pasos li.activo{color:var(--oro2)}.pasos li.activo span{background:var(--oro);color:#1b1206;border-color:var(--oro)}.pasos li.activo b{display:inline}
.pasos li.hecho span{background:rgba(47,160,122,.25);border-color:var(--verde2);color:#7fe0bd}
.pago-cuerpo{flex:1;overflow:auto;padding:10px 20px 24px;width:100%;max-width:640px;margin:0 auto;overscroll-behavior:contain}
.paso{display:none;margin:0;padding:0;border:0;animation:entra .35s}
.paso.activo{display:grid;gap:14px;grid-template-columns:1fr 1fr}
.paso legend{grid-column:1/-1;float:left;width:100%;margin:10px 0 4px;font:600 22px/1.2 var(--t-cond);letter-spacing:.03em;color:var(--crema)}
.paso>*{grid-column:1/-1}
.paso>.campo{grid-column:auto}
.paso>.campo.ancho2{grid-column:1/-1}
.modo-tarjetas{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tarjeta-op{position:relative;display:block;cursor:pointer}
.tarjeta-op input{position:absolute;opacity:0}
.tarjeta-op>span{display:flex;flex-direction:column;align-items:flex-start;gap:4px;height:100%;padding:16px;border-radius:16px;border:1px solid rgba(233,180,76,.22);background:rgba(12,10,8,.4);transition:all .2s}
.tarjeta-op svg{width:30px;height:30px;color:var(--oro);margin-bottom:4px}
.tarjeta-op b{font:600 18px var(--t-cond);letter-spacing:.05em;text-transform:uppercase;color:var(--crema)}
.tarjeta-op small{font-size:13px;color:var(--tenue)}
.tarjeta-op input:checked+span{border-color:var(--oro);background:rgba(233,180,76,.12);box-shadow:0 0 0 1px var(--oro) inset}
.tarjeta-op input:focus-visible+span{outline:2px solid var(--oro2);outline-offset:2px}
.tarjeta-op.linea>span{flex-direction:row;align-items:center;flex-wrap:wrap;column-gap:12px}
.tarjeta-op.linea svg{margin:0}
.tarjeta-op.linea b{flex:1}
.tarjeta-op.linea small{width:100%;padding-left:42px;margin-top:-2px}
.pagos{display:grid;gap:10px}
.bloque-delivery{display:none;grid-template-columns:1fr 1fr;gap:12px}
.bloque-delivery.ver{display:grid}
.campo{display:block}
.campo span{display:block;margin-bottom:6px;font-size:14px;color:var(--tenue)}
.campo.error input{border-color:var(--rojo2);background:rgba(179,32,44,.08)}
.campo.ancho2{grid-column:1/-1}
.etq{display:block;margin-bottom:8px;font:600 15px var(--t-cond);letter-spacing:.08em;text-transform:uppercase}
.select{margin-top:10px;appearance:none;-webkit-appearance:none;background:rgba(12,10,8,.5) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5' fill='none' stroke='%23e9b44c' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 12px center/20px}
.nota-mini{margin:0;font-size:13px;color:var(--tenue2)}
.aviso-integracion{padding:10px 12px;border-radius:10px;background:rgba(233,180,76,.08);border:1px dashed rgba(233,180,76,.3);color:var(--tenue)}
.resumen{display:grid;gap:10px}
.resumen .caja{padding:14px 16px;border-radius:14px;background:rgba(12,10,8,.45);border:1px solid var(--linea)}
.resumen .caja h5{margin:0 0 8px;font:600 14px var(--t-cond);letter-spacing:.1em;text-transform:uppercase;color:var(--oro2)}
.resumen .caja p{margin:2px 0;color:var(--tenue);font-size:15px}
.resumen .fila{display:flex;justify-content:space-between;gap:10px;padding:5px 0;font-size:15px}
.resumen .fila span:last-child{white-space:nowrap}
.pago-pie{display:flex;align-items:center;gap:16px;padding:14px 20px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--linea);background:rgba(12,10,8,.7)}
.pago-total{display:flex;flex-direction:column;line-height:1.1}
.pago-total span{font-size:13px;color:var(--tenue)}
.pago-total b{font:600 24px var(--t-cond);color:var(--oro2)}
.pago-pie .btn-oro{margin-left:auto;min-width:170px}
/* confirmación */
.confirmado{text-align:center;padding-top:20px}
.confirmado.activo{display:block}
.sello{display:grid;place-items:center;width:96px;height:96px;margin:10px auto 18px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--oro2),var(--oro-osc));color:#1b1206;box-shadow:0 0 0 8px rgba(233,180,76,.15),0 20px 50px rgba(233,180,76,.25);animation:sello .8s cubic-bezier(.2,1.6,.4,1)}
.sello svg{width:48px;height:48px}
@keyframes sello{from{transform:scale(0) rotate(-90deg)}}
.confirmado h4{margin:0 0 6px;font:700 26px var(--t-titulo);color:var(--crema)}
.num-orden{color:var(--tenue);margin:0 0 24px}.num-orden b{color:var(--oro2);font:600 20px var(--t-cond);letter-spacing:.08em}
.seguimiento{list-style:none;margin:0 auto;padding:0;max-width:340px;text-align:left}
.seguimiento li{position:relative;display:flex;align-items:center;gap:14px;padding:12px 0;color:var(--tenue2)}
.seguimiento li span{width:18px;height:18px;border-radius:50%;border:2px solid var(--tenue2);flex:none;transition:all .4s}
.seguimiento li+li::before{content:'';position:absolute;left:8px;top:-12px;height:24px;width:2px;background:var(--linea)}
.seguimiento li.hecho{color:var(--crema)}.seguimiento li.hecho span{background:var(--verde2);border-color:var(--verde2);box-shadow:0 0 0 5px rgba(47,160,122,.18)}
.seguimiento li.ahora span{border-color:var(--oro);animation:late2 1.4s infinite}
@keyframes late2{50%{box-shadow:0 0 0 7px rgba(233,180,76,.2)}}
.eta-final{margin-top:18px;color:var(--tenue)}

/* aviso flotante */
.aviso{position:fixed;left:50%;bottom:calc(90px + env(safe-area-inset-bottom));z-index:200;transform:translate(-50%,30px);padding:12px 20px;border-radius:999px;background:var(--crema);color:#1b1206;font:600 15px var(--t-texto);box-shadow:0 14px 40px rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:all .35s;white-space:nowrap;max-width:calc(100vw - 32px);overflow:hidden;text-overflow:ellipsis}
.aviso.ver{opacity:1;transform:translate(-50%,0)}
/* objeto que vuela al carrito */
.vuela{position:fixed;z-index:300;width:46px;height:46px;border-radius:50%;background:var(--oro) center/cover;box-shadow:0 8px 20px rgba(0,0,0,.5);pointer-events:none}

/* ---------- portada en teléfono / tablet: la foto del local de fondo ---------- */
@media (max-width:979px){
  .portada{align-items:flex-end;padding:0 var(--lado) calc(28px + env(safe-area-inset-bottom));min-height:100svh}
  .portada-in{display:block}
  .portada-foto{position:absolute;inset:0;width:auto;margin:0;z-index:-2;perspective:none}
  .foto-marco{height:100%;border-radius:0;box-shadow:none;transform:none!important}
  .foto-marco picture,.foto-marco img{height:100%}
  .foto-marco img{aspect-ratio:auto;object-position:50% 40%;transform:scale(1.08) translate3d(var(--fx,0),var(--fy,0),0)}
  .foto-marco::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,10,8,.55) 0%,rgba(12,10,8,.05) 22%,rgba(12,10,8,.1) 42%,rgba(12,10,8,.82) 62%,var(--negro) 88%)}
  .foto-etiqueta{display:none}
  .portada-fondo{display:none}
  .portada-texto{position:static}
  .portada-logo{position:absolute;z-index:2;top:calc(84px + env(safe-area-inset-top));left:50%;width:150px;margin:0 0 0 -75px}
  .portada h1{text-shadow:0 2px 20px rgba(0,0,0,.9)}
  .portada-sub{color:#cdbfa8;margin-bottom:20px}
}
@media (max-width:979px) and (min-width:640px){
  .portada-logo{width:220px;margin-left:-110px}
  .portada-texto{max-width:600px;margin:0 auto}
}

/* ---------- tablet ---------- */
@media (min-width:640px){
  .platos{grid-template-columns:1fr 1fr}
  .visitanos-in{grid-template-columns:repeat(3,1fr)}
  .hoja.producto{width:min(560px,94vw);border-radius:26px;margin-bottom:3vh;max-height:90svh}
  .capa{align-items:center}
  .capa.lateral{align-items:stretch}
  .pasos b{display:inline}
  .pago{width:min(760px,96vw);height:min(860px,94svh);border-radius:26px}
  .prod-cab{height:240px}
}
/* ---------- computadora ---------- */
@media (min-width:980px){
  .cab-nav{display:flex}
  .cab-der{margin-left:30px}
  .portada{padding-top:110px}
  .portada-in{grid-template-columns:1.1fr .9fr;gap:60px}
  .portada-texto{text-align:left}
  .portada-logo{margin:0 0 20px;width:230px}
  .portada h1{font-size:clamp(32px,3.3vw,46px)}
  .portada-sub,.modo-grande{margin-left:0}
  .bajar{display:block}
  .portada-foto{width:min(390px,100%);justify-self:center}
  .foto-marco img{max-height:72vh}
  .platos{grid-template-columns:repeat(3,1fr)}
  .menu-barra{display:flex;align-items:center;gap:16px}
  .menu-barra .buscar{flex:0 0 280px;margin:0}
  .menu-barra .cats{flex:1;margin:0}
  .barra-pedido{display:none!important}
  .pie{padding-bottom:40px}
  .aviso{bottom:30px}
  .plato{width:320px;margin-left:-160px}
  .plato-img{height:280px}
  .carrusel3d{height:540px}
}
@media (max-width:420px){
  .modo-op{padding:12px;gap:10px}
  .modo-op svg{width:26px;height:26px}
  .modo-op b{font-size:16px}
  .modo-op small{font-size:12px}
  .btn-carrito-total{display:none}
  .btn-carrito{padding:0 12px}
  .item-img{width:92px;height:92px}
  .paso.activo,.bloque-delivery.ver{grid-template-columns:1fr}
  .paso>.campo{grid-column:1/-1}
  .modo-tarjetas{grid-template-columns:1fr 1fr}
  .pago-pie .btn-oro{min-width:0;padding:0 20px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
