/* =========================================================
   AJISEN RAMEN PANAMÁ — Tema oscuro premium
   漆 urushi (laca negra) · 朱 shu (rojo) · 生成 kinari (crema)
   ========================================================= */
:root{
  --papel:#100E0D;        /* fondo principal */
  --piedra:#181514;       /* secciones alternas */
  --sumi:#0A0908;         /* lo más profundo: cabecera, pie */
  --superficie:#1F1B19;   /* tarjetas, paneles */
  --superficie-2:#2A2522; /* campos, hover */
  --linea:#342E2A;
  --texto:#EFE8DC;        /* kinari */
  --gris:#B3A99C;
  --gris-2:#988E82;
  --shu:#E1161D; --shu-osc:#B50F15; --shu-tenue:rgba(225,22,29,.14);
  --mincho:"Zen Old Mincho",serif;
  --gothic:"Zen Kaku Gothic New",system-ui,sans-serif;
  --ancho:1280px; --pad:clamp(16px,4vw,44px);
  --curva:cubic-bezier(.2,.7,.2,1);
  --ola:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='24' viewBox='0 0 48 24'%3E%3Cg fill='none' stroke='%23E1161D' stroke-width='1'%3E%3Cpath d='M0 24a24 24 0 0 1 48 0M8 24a16 16 0 0 1 32 0M16 24a8 8 0 0 1 16 0M-24 12a24 24 0 0 1 48 0M-16 12a16 16 0 0 1 32 0M24 12a24 24 0 0 1 48 0M32 12a16 16 0 0 1 32 0'/%3E%3C/g%3E%3C/svg%3E");
  --ola-crema:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='24' viewBox='0 0 48 24'%3E%3Cg fill='none' stroke='%23EFE8DC' stroke-width='1'%3E%3Cpath d='M0 24a24 24 0 0 1 48 0M8 24a16 16 0 0 1 32 0M16 24a8 8 0 0 1 16 0M-24 12a24 24 0 0 1 48 0M-16 12a16 16 0 0 1 32 0M24 12a24 24 0 0 1 48 0M32 12a16 16 0 0 1 32 0'/%3E%3C/g%3E%3C/svg%3E");
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{font-family:var(--gothic);color:var(--texto);background:var(--papel);line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}
::selection{background:var(--shu);color:#fff}
.wrap{max-width:var(--ancho);margin:0 auto;padding:0 var(--pad)}
h1,h2,h3,h4{font-family:var(--mincho);font-weight:900;line-height:1.12;letter-spacing:-.005em;color:var(--texto)}
h2{font-size:clamp(2.1rem,4.6vw,3.6rem)}
.tate{writing-mode:vertical-rl;text-orientation:upright;font-family:var(--mincho);font-weight:700;letter-spacing:.22em}
:focus-visible{outline:2px solid var(--shu);outline-offset:3px}
.seccion{padding:clamp(72px,9vw,128px) 0}

/* ---------- Botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 30px;font-weight:700;font-size:.95rem;letter-spacing:.02em;border:1px solid transparent;border-radius:2px;transition:background .25s,color .25s,border-color .25s,transform .25s}
.btn-shu{background:var(--shu);color:#fff}.btn-shu:hover{background:var(--shu-osc)}
.btn-sumi,.btn-claro{border-color:rgba(239,232,220,.4);color:var(--texto)}
.btn-sumi:hover,.btn-claro:hover{background:var(--texto);color:var(--sumi);border-color:var(--texto)}
.btn-blanco{background:var(--texto);color:var(--shu-osc)}.btn-blanco:hover{background:var(--sumi);color:#fff}
.btn-wa{background:#1E9E50;color:#fff}

.hanko{display:inline-grid;place-items:center;width:58px;height:58px;border:2px solid var(--shu);color:var(--shu);border-radius:6px;font-family:var(--mincho);font-weight:900;font-size:1.05rem;line-height:1.05;text-align:center;transform:rotate(-4deg)}

.titulo{display:flex;gap:22px;align-items:flex-start}
.titulo .tate{font-size:.95rem;color:var(--shu);padding-top:8px;border-left:1px solid var(--shu);padding-left:10px;min-height:120px}
.titulo p{color:var(--gris);max-width:48ch;margin-top:16px}

/* ---------- Cabecera ---------- */
header#cabecera{position:sticky;top:0;z-index:50;background:rgba(10,9,8,.82);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(239,232,220,.08)}
.nav{display:flex;align-items:center;justify-content:space-between;height:80px;gap:20px}
.nav .logo img{height:52px;width:auto}
.nav ul{display:flex;gap:38px;list-style:none;font-size:.92rem;font-weight:500}
.nav ul a{position:relative;padding:8px 0;color:var(--gris);transition:color .2s}
.nav ul a::after{content:"";position:absolute;left:50%;bottom:0;width:5px;height:5px;border-radius:50%;background:var(--shu);transform:translateX(-50%) scale(0);transition:transform .25s var(--curva)}
.nav ul a:hover,.nav ul a[aria-current="page"]{color:var(--texto)}
.nav ul a:hover::after,.nav ul a[aria-current="page"]::after{transform:translateX(-50%) scale(1)}
.nav .acc{display:flex;gap:10px;align-items:center}
.nav .acc .btn{min-height:44px;padding:0 20px;font-size:.86rem}
.burger{display:none;width:44px;height:44px}
.burger span{display:block;width:22px;height:1.5px;background:var(--texto);margin:6px auto}

/* =========================================================
   PORTADA
   ========================================================= */
.hero{position:relative;overflow:hidden;background:radial-gradient(ellipse 70% 80% at 78% 45%,#1E1513 0%,var(--papel) 70%)}
.hero::after{content:"";position:absolute;left:0;bottom:0;width:55%;height:45%;background:var(--ola);opacity:.07;-webkit-mask-image:linear-gradient(to top right,#000,transparent 70%);mask-image:linear-gradient(to top right,#000,transparent 70%);pointer-events:none}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;min-height:min(calc(100vh - 80px),860px);gap:clamp(16px,3vw,40px);padding-top:clamp(40px,6vw,72px);padding-bottom:clamp(48px,6vw,80px)}
.hero-txt{position:relative;z-index:3}
.kicker{display:flex;align-items:center;gap:16px;color:var(--gris);font-size:.95rem}
.kicker .hanko{width:52px;height:52px;font-size:.95rem}
.hero h1{font-size:clamp(3rem,5.4vw,5.4rem);line-height:1.04;margin:26px 0 24px;max-width:12ch;text-wrap:balance}
.hero .lead{font-size:1.1rem;color:var(--gris);max-width:40ch}
.hero .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.hero-datos{display:grid;grid-template-columns:repeat(4,minmax(0,auto));justify-content:start;gap:0;max-width:100%;margin-top:clamp(40px,5vw,64px);border-top:1px solid var(--linea)}
.hero-datos div{padding:18px 18px 0 0;margin-right:18px;border-right:1px solid var(--linea)}
.hero-datos div:last-child{border-right:0;margin-right:0}
.hero-datos dt{font-family:var(--mincho);font-weight:900;font-size:clamp(1.5rem,2.4vw,2.1rem);line-height:1;color:var(--texto)}
.hero-datos dd{font-size:.8rem;color:var(--gris-2);margin-top:6px;line-height:1.35}

.hero-bowl{position:relative;justify-self:end;width:min(820px,58vw);margin-right:calc(var(--pad) * -1 - 6vw)}
.sol{position:absolute;width:78%;aspect-ratio:1;border-radius:50%;background:var(--shu);left:-4%;top:-6%;z-index:0;box-shadow:0 0 120px 10px rgba(225,22,29,.25)}
.vapor{position:absolute;left:38%;top:-12%;width:34%;z-index:3;pointer-events:none}
.vapor path{fill:none;stroke:var(--texto);stroke-width:2;stroke-linecap:round;opacity:0;animation:vapor 5.5s ease-in-out infinite}
.vapor path:nth-child(2){animation-delay:1.8s}.vapor path:nth-child(3){animation-delay:3.6s}
@keyframes vapor{0%{opacity:0;transform:translateY(16px)}35%{opacity:.28}100%{opacity:0;transform:translateY(-30px)}}
.bowl{position:relative;z-index:2}
.bowl img{width:100%;filter:drop-shadow(0 40px 60px rgba(0,0,0,.6));transition:filter .4s}
.bowl.foco img{filter:drop-shadow(0 40px 60px rgba(0,0,0,.6)) saturate(.7) brightness(.8)}
.punto{position:absolute;width:30px;height:30px;transform:translate(-50%,-50%);border-radius:50%;background:var(--texto);box-shadow:0 4px 14px rgba(0,0,0,.5);display:grid;place-items:center;z-index:3;transition:transform .2s,background .2s}
.punto i{width:10px;height:10px;border-radius:50%;background:var(--shu);transition:background .2s}
.punto::before{content:"";position:absolute;inset:-7px;border-radius:50%;border:2px solid var(--texto);animation:latido 2.6s ease-out infinite}
.bowl.tocado .punto::before{animation:none;opacity:0}
.punto:hover{transform:translate(-50%,-50%) scale(1.15)}
.punto[aria-pressed="true"]{background:var(--shu);transform:translate(-50%,-50%) scale(1.2)}
.punto[aria-pressed="true"] i{background:#fff}
.punto[aria-pressed="true"]::before{animation:none;opacity:1;border-color:var(--shu);inset:-9px}
@keyframes latido{0%{transform:scale(.8);opacity:.9}100%{transform:scale(1.7);opacity:0}}
.bowl-info{position:absolute;z-index:4;left:auto;right:calc(6vw + var(--pad) + 4%);bottom:3%;width:min(300px,80%);background:rgba(16,14,13,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--linea);border-left:3px solid var(--shu);padding:16px 18px}
.bowl-info b{display:flex;align-items:baseline;gap:10px;font-family:var(--mincho);font-size:1.2rem}
.bowl-info b small{font-size:.85rem;color:var(--shu)}
.bowl-info p{font-size:.9rem;color:var(--gris);margin-top:4px;line-height:1.55}
.bowl-info.cambia{animation:aparece .4s var(--curva)}

.entra{opacity:0;transform:translateY(20px);animation:entra 1s var(--curva) forwards}
.e1{animation-delay:.1s}.e2{animation-delay:.25s}.e3{animation-delay:.4s}.e4{animation-delay:.55s}
.hero-bowl.entra{transform:translateX(40px) rotate(-14deg) scale(.96);animation-delay:.15s;animation-duration:1.5s}
@keyframes entra{to{opacity:1;transform:none}}
@keyframes aparece{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---------- Cinta ---------- */
.cinta{background:var(--shu);color:#fff;overflow:hidden;padding:15px 0}
.cinta .pista-c{display:flex;width:max-content;animation:cinta 42s linear infinite}
.cinta:hover .pista-c{animation-play-state:paused}
.cinta ul{display:flex;align-items:center;list-style:none;flex:none}
.cinta li{display:flex;align-items:center;gap:14px;padding:0 28px;font-size:1rem;font-weight:500;white-space:nowrap}
.cinta li b{font-family:var(--mincho);font-weight:900;font-size:1.25rem}
.cinta li::after{content:"";width:7px;height:7px;border:1.5px solid #fff;transform:rotate(45deg);margin-left:42px;opacity:.7}
@keyframes cinta{to{transform:translateX(-50%)}}

/* =========================================================
   PLATO INSIGNIA
   ========================================================= */
.insignia{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);background:var(--piedra);min-height:min(92vh,880px)}
.insignia .foto{position:relative;overflow:hidden;min-height:520px}
.insignia .foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.insignia .foto::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 65%,var(--piedra))}
.insignia .foto .hanko{position:absolute;left:28px;top:28px;z-index:2;background:rgba(16,14,13,.6);width:72px;height:72px;font-size:1.2rem}
.insignia .tx{display:flex;flex-direction:column;justify-content:center;padding:clamp(48px,7vw,110px) clamp(24px,6vw,96px)}
.insignia .jpn{font-family:var(--mincho);color:var(--shu);font-weight:700;letter-spacing:.14em}
.insignia h2{margin:12px 0 20px}
.insignia .tx>p{color:var(--gris);max-width:46ch;font-size:1.04rem}
.insignia .precio-g{display:flex;align-items:baseline;gap:14px;margin:30px 0 4px}
.insignia .precio-g b{font-family:var(--mincho);font-size:2.4rem;color:var(--texto)}
.insignia .precio-g span{color:var(--gris-2);font-size:.88rem}
.claves{list-style:none;margin-top:30px;border-top:1px solid var(--linea)}
.claves li{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--linea)}
.claves b{font-family:var(--mincho);font-size:1.5rem;color:var(--shu);font-weight:900}
.claves strong{display:block;font-size:1rem}
.claves span{font-size:.9rem;color:var(--gris)}
.insignia .acc{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}

/* =========================================================
   CARRUSEL DE PLATOS
   ========================================================= */
.platos-sec{position:relative;overflow:hidden}
.platos-sec .cab{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:34px}
.enlace{font-weight:700;font-size:.92rem;border-bottom:1px solid var(--shu);padding-bottom:2px;transition:color .2s}
.enlace:hover{color:var(--shu)}
.tabs{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-bottom:30px}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:none;display:flex;align-items:center;gap:8px;min-height:46px;padding:0 20px;border:1px solid var(--linea);border-radius:999px;font-weight:700;font-size:.9rem;color:var(--gris);white-space:nowrap;transition:.2s}
.tab small{font-family:var(--mincho);font-weight:500;font-size:.78rem}
.tab .cuenta{font-size:.7rem;background:var(--superficie-2);color:var(--gris);border-radius:999px;padding:1px 8px}
.tab:hover{color:var(--texto);border-color:var(--gris-2)}
.tab[aria-selected="true"]{background:var(--texto);border-color:var(--texto);color:var(--sumi)}
.tab[aria-selected="true"] small{color:var(--shu-osc)}
.tab[aria-selected="true"] .cuenta{background:var(--shu);color:#fff}

.riel{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px var(--pad) 8px;margin:0 calc(var(--pad) * -1);scroll-padding-left:var(--pad);cursor:grab;user-select:none}
.riel::-webkit-scrollbar{display:none}
.riel.arrastra{scroll-snap-type:none;cursor:grabbing}
.riel.arrastra .pcard{pointer-events:none}
.pcard{position:relative;flex:0 0 calc((100% - 60px) / 3.4);aspect-ratio:3/4;scroll-snap-align:start;overflow:hidden;background:var(--superficie);border-radius:3px;isolation:isolate}
.pcard>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--curva)}
.pcard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,9,8,0) 38%,rgba(10,9,8,.55) 62%,rgba(10,9,8,.95) 100%);z-index:1;transition:background .4s}
.pcard .marcas{position:absolute;left:14px;top:14px;z-index:2;display:flex;flex-wrap:wrap;gap:6px}
.pcard .cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px 22px 20px}
.pcard .jpn{font-family:var(--mincho);font-size:.8rem;color:var(--shu);font-weight:700;letter-spacing:.1em}
.pcard h3{font-size:clamp(1.25rem,1.8vw,1.55rem);margin:4px 0 0}
.pcard .desc{font-size:.86rem;color:var(--gris);line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;max-height:0;opacity:0;transition:max-height .45s var(--curva),opacity .35s,margin .35s}
.pcard .pie{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:12px}
.pcard .precio{font-family:var(--mincho);font-weight:900;font-size:1.3rem}
.pcard .acc{display:flex;gap:6px}
.pcard .acc a{display:inline-grid;place-items:center;height:40px;min-width:40px;padding:0 14px;border-radius:2px;font-size:.82rem;font-weight:700}
.pcard .acc .o{background:var(--shu);color:#fff}
.pcard .acc .o:hover{background:var(--shu-osc)}
.pcard .acc .w{border:1px solid rgba(239,232,220,.35);padding:0}
.pcard .acc .w:hover{background:#1E9E50;border-color:#1E9E50}
.pcard .acc svg{width:18px;height:18px;fill:currentColor}
@media (hover:hover){
  .pcard:hover>img{transform:scale(1.07)}
  .pcard:hover::after{background:linear-gradient(180deg,rgba(10,9,8,0) 20%,rgba(10,9,8,.7) 50%,rgba(10,9,8,.97) 100%)}
  .pcard:hover .desc,.pcard:focus-within .desc{max-height:5em;opacity:1;margin-top:8px}
}
@media (hover:none){.pcard .desc{max-height:3.2em;opacity:1;margin-top:6px;-webkit-line-clamp:2}}
.ctrl{display:flex;align-items:center;gap:22px;margin-top:26px}
.contador{font-family:var(--mincho);font-weight:700;min-width:70px}
.contador span{color:var(--gris-2);font-weight:500}
.prog{flex:1;height:1px;background:var(--linea);position:relative}
.prog i{position:absolute;top:-1px;height:3px;left:0;background:var(--shu);width:30%;transition:left .15s}
.flechas{display:flex;gap:8px}
.flecha{width:52px;height:52px;border:1px solid var(--linea);border-radius:50%;display:grid;place-items:center;transition:.2s}
.flecha svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8}
.flecha:hover:not(:disabled){background:var(--texto);color:var(--sumi);border-color:var(--texto)}
.flecha:disabled{opacity:.25;cursor:default}

.marca{font-size:.72rem;font-weight:700;background:var(--shu);color:#fff;padding:4px 10px;border-radius:2px;letter-spacing:.02em}
.marca.vegano{background:#3F7A2B}

/* =========================================================
   SECCIONES COMPARTIDAS
   ========================================================= */
/* Nuestro ramen */
.ramen .wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(32px,6vw,80px);align-items:center}
.ramen .foto{position:relative}
.ramen .foto img{width:100%;aspect-ratio:1024/654;object-fit:cover}
.ramen .foto .hanko{position:absolute;right:-14px;bottom:-14px;width:84px;height:84px;font-size:1.3rem;background:var(--papel)}
.ramen .txt>p{color:var(--gris);margin-top:16px;max-width:52ch}

/* Historia */
.historia{position:relative;background:var(--sumi);overflow:hidden}
.historia::before{content:"";position:absolute;left:-10%;top:120px;width:min(560px,70vw);aspect-ratio:1;border-radius:50%;background:var(--shu);opacity:.92;box-shadow:0 0 140px rgba(225,22,29,.3)}
.historia .wrap{position:relative}
.hist-top{display:grid;grid-template-columns:minmax(220px,.75fr) minmax(0,1.25fr);gap:clamp(32px,7vw,100px);align-items:center}
.caligrafia{max-width:380px;width:100%;margin:0 auto}
.historia h2{max-width:17ch}
.historia .intro p{margin-top:18px;max-width:54ch;font-size:1.04rem;color:var(--gris)}
.historia .intro b{color:var(--texto)}
.chichan{display:flex;gap:18px;align-items:center;margin-top:28px;padding:16px 18px;border:1px solid var(--linea);max-width:520px;background:rgba(239,232,220,.02)}
.chichan img{width:70px;flex:none;filter:brightness(1.6)}
.chichan p{font-size:.92rem;margin:0!important}
.cifras{display:grid;grid-template-columns:repeat(4,1fr);margin:clamp(48px,6vw,80px) 0;border-block:1px solid var(--linea)}
.cifra{padding:30px 12px;text-align:center;border-left:1px solid var(--linea)}
.cifra:first-child{border-left:0}
.cifra b{display:block;font-family:var(--mincho);font-size:clamp(2rem,4vw,3.2rem);line-height:1}
.cifra b em{font-style:normal;color:var(--shu)}
.cifra span{font-size:.86rem;color:var(--gris-2)}
.linea{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.5vw,28px)}
.linea li{background:var(--superficie);display:flex;flex-direction:column}
.linea .img{aspect-ratio:700/432;overflow:hidden;background:#000}
.linea .img img{width:100%;height:100%;object-fit:cover}
.linea .tx{padding:20px 22px 24px}
.linea .ano{font-family:var(--mincho);font-size:1.5rem;font-weight:900}
.linea h3{font-size:1.1rem;margin:4px 0 6px}
.linea p{font-size:.92rem;color:var(--gris)}

/* Pide fácil */
.promos .cab{margin-bottom:30px}
.banners{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.banners a{display:block;overflow:hidden;background:#000;border-radius:3px}
.banners img{width:100%;aspect-ratio:1024/412;object-fit:cover;transition:transform .6s var(--curva)}
.banners a:hover img{transform:scale(1.04)}

/* Sucursales */
.sucursales{background:var(--piedra)}
.sucursales .wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,80px);align-items:start}
.sucursales .interior{margin-top:30px}
.sucursales .interior img{width:100%;aspect-ratio:1024/595;object-fit:cover;border-radius:3px}
.sucursales .reserva{margin-top:22px;font-size:.92rem;color:var(--gris)}
.sucursales .reserva a{color:var(--texto);font-weight:700;border-bottom:1px solid var(--shu)}
.locales{list-style:none;border-top:1px solid var(--gris-2)}
.locales li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 20px;align-items:center;padding:22px 4px;border-bottom:1px solid var(--linea);transition:background .25s,padding .25s}
.locales li:hover{background:var(--superficie);padding-left:16px;padding-right:16px}
.locales h3{font-size:1.4rem}
.locales .zona{font-family:var(--gothic);font-size:.8rem;font-weight:500;color:var(--gris-2);margin-left:8px}
.locales .hor{grid-column:1;font-size:.86rem;color:var(--gris)}
.locales .hor b{color:var(--texto);font-weight:500}
.locales .acc{grid-column:2;grid-row:1/3;display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.locales .acc a{font-size:.86rem;font-weight:700;white-space:nowrap}
.locales .acc .tel{border-bottom:1px solid var(--shu)}
.locales .acc .mapa{color:var(--gris)}
.locales .acc .mapa:hover{color:var(--shu)}

/* Franquicias */
.franq-info{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(32px,6vw,80px);align-items:center;margin-bottom:clamp(48px,6vw,72px)}
.franq-info h2{max-width:14ch}
.franq-info>img{filter:brightness(1.35) saturate(1.1)}
.franq-info .sub{font-family:var(--mincho);font-weight:700;font-size:1.3rem;color:var(--shu);margin:18px 0 14px}
.paises{display:flex;flex-wrap:wrap;gap:8px;list-style:none}
.paises li{border:1px solid var(--linea);padding:6px 14px;border-radius:999px;font-size:.86rem;color:var(--gris)}
.paises li.pa{background:var(--shu);border-color:var(--shu);color:#fff;font-weight:700}
.noren{position:relative;background:var(--shu);color:#fff;padding:clamp(56px,6vw,84px) clamp(24px,5vw,72px) clamp(130px,16vw,190px);text-align:center;overflow:hidden}
.noren::before{content:"";position:absolute;left:0;right:0;top:0;height:14px;background:var(--sumi)}
.noren::after{content:"";position:absolute;inset:0;background:var(--ola-crema);opacity:.12;pointer-events:none}
.noren>*{position:relative;z-index:1}
.noren h2{color:#fff;margin-bottom:14px}
.noren p{max-width:48ch;margin:0 auto 28px;opacity:.95}
.noren .corte{position:absolute;bottom:0;width:8px;height:clamp(90px,12vw,140px);background:var(--papel);z-index:2}
.noren .corte:nth-of-type(1){left:calc(33.33% - 4px)}
.noren .corte:nth-of-type(2){left:calc(66.66% - 4px)}
.noren .kanji{position:absolute;left:50%;bottom:clamp(20px,3vw,36px);transform:translateX(-50%);font-family:var(--mincho);font-weight:900;font-size:clamp(3.4rem,8vw,6rem);line-height:1}

/* Pie */
footer{background:var(--sumi);color:var(--gris);padding:72px 0 28px;font-size:.92rem;border-top:1px solid var(--linea)}
.pie{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.1fr;gap:40px}
.pie img{height:64px;width:auto;margin-bottom:16px}
.pie p{max-width:34ch}
.pie h4{font-weight:700;font-size:1rem;margin-bottom:14px}
.pie ul{list-style:none;display:grid;gap:9px}
.pie a:hover{color:var(--texto)}
.redes{display:flex;gap:16px;margin-top:18px;font-weight:700;color:var(--texto)}
.redes a{border-bottom:1px solid var(--shu)}
.legal{margin-top:48px;padding-top:20px;border-top:1px solid var(--linea);color:var(--gris-2);font-size:.8rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
.legal a{color:var(--texto);font-weight:700}

.barra-movil{display:none;position:fixed;left:0;right:0;bottom:0;z-index:60;background:rgba(10,9,8,.94);backdrop-filter:blur(10px);border-top:1px solid var(--linea);padding:10px 12px calc(10px + env(safe-area-inset-bottom));gap:10px}
.barra-movil .btn{flex:1;min-height:48px;padding:0 10px}

/* =========================================================
   PÁGINAS INTERNAS
   ========================================================= */
.cabeza{position:relative;background:var(--sumi) center/cover no-repeat;overflow:hidden}
.cabeza::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,9,8,.95) 0%,rgba(10,9,8,.72) 50%,rgba(10,9,8,.3) 100%)}
.cabeza::after{content:"";position:absolute;left:0;right:0;bottom:0;height:40%;background:linear-gradient(transparent,var(--papel))}
.cabeza .wrap{position:relative;z-index:1;min-height:clamp(300px,38vw,480px);display:flex;align-items:center;gap:24px;padding-top:64px;padding-bottom:64px}
.cabeza .tate{font-size:1rem;color:var(--shu);border-left:1px solid var(--shu);padding-left:10px;min-height:130px;align-self:center}
.cabeza h1{font-size:clamp(2.4rem,5.6vw,4.4rem);max-width:16ch}
.cabeza p{margin-top:16px;max-width:46ch;color:var(--gris);font-size:1.06rem}
.migas{font-size:.82rem;color:var(--gris-2);margin-bottom:14px}
.migas a{color:var(--texto);border-bottom:1px solid var(--shu)}

/* Menú completo */
.carta .tabs{position:sticky;top:80px;z-index:5;background:rgba(16,14,13,.92);backdrop-filter:blur(10px);padding:12px 0;margin-bottom:28px}
.carta-cat{margin-bottom:clamp(56px,7vw,88px);scroll-margin-top:160px}
.carta-cab{display:flex;align-items:baseline;gap:16px;margin-bottom:24px;padding-bottom:14px;border-bottom:1px solid var(--linea)}
.carta-cab h2{font-size:clamp(1.8rem,3.4vw,2.6rem)}
.carta-cab span{font-family:var(--mincho);color:var(--shu);font-weight:700;letter-spacing:.12em}
.carta-cab p{margin-left:auto;font-size:.86rem;color:var(--gris-2);text-align:right}
.platos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.4vw,28px)}
.plato{background:var(--superficie);display:flex;flex-direction:column;border-radius:3px;overflow:hidden;transition:transform .35s var(--curva),box-shadow .35s}
.plato:hover{transform:translateY(-5px);box-shadow:0 30px 50px -28px rgba(0,0,0,.8)}
.plato .foto{position:relative;aspect-ratio:4/5;overflow:hidden;background:#000}
.plato .foto img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--curva)}
.plato:hover .foto img{transform:scale(1.06)}
.plato .foto::after{content:"";position:absolute;inset:auto 0 0 0;height:30%;background:linear-gradient(transparent,rgba(31,27,25,.9))}
.plato .foto .marcas{position:absolute;left:14px;top:14px;display:flex;gap:6px;z-index:1}
.plato .tx{padding:6px 22px 22px;display:flex;flex-direction:column;flex:1;position:relative;margin-top:-28px;z-index:1}
.plato .jpn{font-family:var(--mincho);font-size:.82rem;color:var(--shu);font-weight:700;letter-spacing:.08em}
.plato .fila{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:4px 0 8px}
.plato h3{font-size:1.35rem}
.plato .precio{font-family:var(--mincho);font-weight:900;font-size:1.3rem;white-space:nowrap}
.plato p{font-size:.9rem;color:var(--gris);flex:1}
.plato .acc{display:flex;gap:8px;margin-top:18px}
.plato .acc .btn{flex:1;min-height:44px;padding:0 12px;font-size:.84rem}
.pdf-caja{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;background:var(--superficie);border-left:3px solid var(--shu);padding:clamp(28px,4vw,48px)}
.pdf-caja h2{font-size:clamp(1.6rem,3vw,2.2rem)}
.pdf-caja p{margin-top:8px;max-width:52ch;color:var(--gris)}

/* Nosotros */
.equipo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,80px);align-items:center}
.equipo img{width:100%;max-width:460px}
.equipo p{color:var(--gris);margin-top:16px;max-width:50ch}

/* Formularios */
.panel{background:var(--superficie);border:1px solid var(--linea);padding:clamp(24px,4vw,48px)}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px}
.form fieldset{grid-column:1/-1;border:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px;padding-top:26px;border-top:1px solid var(--linea)}
.form fieldset:first-of-type{border-top:0;padding-top:0}
.form legend{font-family:var(--mincho);font-weight:900;font-size:1.3rem;padding-bottom:14px;float:left;width:100%}
.form legend + *{clear:both}
.campo{display:flex;flex-direction:column;gap:6px}
.campo.ancho{grid-column:1/-1}
.campo>label,.campo>.etq{font-size:.86rem;font-weight:700}
.campo>label i,.campo>.etq i{color:var(--shu);font-style:normal}
.campo input,.campo select,.campo textarea{font:inherit;font-size:.95rem;min-height:50px;padding:10px 14px;border:1px solid var(--linea);background:var(--superficie-2);border-radius:2px;color:var(--texto)}
.campo textarea{min-height:130px;resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:2px solid var(--shu);outline-offset:0;border-color:var(--shu)}
.opciones{display:flex;flex-wrap:wrap;gap:8px}
.opciones label{position:relative;cursor:pointer}
.opciones input{position:absolute;opacity:0;inset:0}
.opciones span{display:inline-flex;align-items:center;min-height:42px;padding:0 16px;border:1px solid var(--linea);border-radius:999px;background:var(--superficie-2);font-size:.88rem;color:var(--gris);transition:.2s}
.opciones input:checked+span{background:var(--texto);border-color:var(--texto);color:var(--sumi);font-weight:700}
.opciones input:focus-visible+span{outline:2px solid var(--shu);outline-offset:2px}
.acepto{grid-column:1/-1;display:flex;gap:10px;align-items:flex-start;font-size:.9rem;color:var(--gris)}
.acepto input{width:20px;height:20px;margin-top:2px;accent-color:var(--shu)}
.acepto a{color:var(--texto);font-weight:700;border-bottom:1px solid var(--shu)}
.form .enviar{grid-column:1/-1;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.aviso-form{font-size:.9rem;color:var(--gris)}
.aviso-form.ok{color:#7BC96B;font-weight:700}

.franq-form{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(32px,5vw,64px);align-items:start}
.franq-form aside{position:sticky;top:110px}
.franq-form aside p{color:var(--gris);margin-top:14px}
.franq-form aside ol{margin-top:22px;list-style:none;border-top:1px solid var(--linea)}
.franq-form aside li{display:grid;grid-template-columns:40px 1fr;gap:8px;padding:14px 0;border-bottom:1px solid var(--linea);font-size:.92rem;color:var(--gris)}
.franq-form aside li b{font-family:var(--mincho);color:var(--shu);font-size:1.2rem}

/* Contacto */
.contacto-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,64px);align-items:start}
.datos{list-style:none;border-top:1px solid var(--gris-2)}
.datos li{display:grid;grid-template-columns:130px 1fr;gap:12px;padding:16px 0;border-bottom:1px solid var(--linea);color:var(--gris)}
.datos b{font-size:.86rem;color:var(--texto)}
.datos a{font-weight:700;color:var(--texto);border-bottom:1px solid var(--shu)}
.tiendas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,28px)}
.tienda{background:var(--superficie);display:flex;flex-direction:column;border-radius:3px;overflow:hidden}
.tienda iframe{width:100%;aspect-ratio:4/3;border:0;display:block;background:var(--superficie-2);filter:grayscale(.3) brightness(.9)}
.tienda .tx{padding:18px 20px 22px;display:flex;flex-direction:column;gap:6px;flex:1}
.tienda h3{font-size:1.35rem}
.tienda .zona{font-size:.8rem;color:var(--gris-2)}
.tienda .hor{font-size:.88rem;color:var(--gris)}
.tienda .hor b{color:var(--texto);font-weight:500}
.tienda .acc{display:flex;gap:16px;margin-top:auto;padding-top:10px}
.tienda .acc a{font-size:.86rem;font-weight:700}
.tienda .acc .tel{border-bottom:1px solid var(--shu)}
.tienda .acc .mapa{color:var(--gris)}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1100px){
  .pcard{flex-basis:calc((100% - 40px) / 2.4)}
  .pie{grid-template-columns:1fr 1fr}.pie>div:first-child{grid-column:1/-1}
  .platos,.tiendas{grid-template-columns:repeat(2,minmax(0,1fr))}
  .franq-form{grid-template-columns:minmax(0,1fr)}
  .franq-form aside{position:static}
}
@media (max-width:900px){
  .nav ul,.nav .acc .btn-claro{display:none}
  .burger{display:block}
  .nav ul.abierto{display:flex;flex-direction:column;gap:0;position:absolute;top:80px;left:0;right:0;background:var(--sumi);border-bottom:1px solid var(--linea);padding:4px var(--pad) 14px}
  .nav ul.abierto a{display:block;padding:15px 0;border-bottom:1px solid var(--linea);color:var(--texto)}
  .nav ul.abierto a::after{display:none}
  .hero-grid{grid-template-columns:minmax(0,1fr);min-height:0}
  .hero-bowl{justify-self:center;width:min(640px,100%);margin:10px 0 0}
  .bowl-info{right:4%}
  .hero h1{max-width:11ch}
  .insignia{grid-template-columns:minmax(0,1fr)}
  .insignia .foto{min-height:0;aspect-ratio:4/4}
  .insignia .foto::after{background:linear-gradient(180deg,transparent 60%,var(--piedra))}
  .ramen .wrap,.hist-top,.sucursales .wrap,.franq-info,.equipo,.contacto-top{grid-template-columns:minmax(0,1fr)}
  .caligrafia{max-width:240px}
  .historia::before{left:auto;right:-30%;top:40px;width:80vw}
  .linea{grid-template-columns:minmax(0,1fr)}
  .linea li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
  .linea .img{aspect-ratio:auto;height:100%}
  .banners{grid-template-columns:1fr}
  .carta-cab{flex-wrap:wrap}
  .carta-cab p{margin-left:0;text-align:left;width:100%}
}
@media (max-width:600px){
  .nav{height:66px}.nav .logo img{height:42px}.nav ul.abierto{top:66px}
  .nav .acc .btn-shu{display:none}
  .carta .tabs{top:66px}
  .hero h1{font-size:clamp(2.7rem,12vw,3.4rem)}
  .hero .cta .btn,.insignia .acc .btn{flex:1 1 100%}
  .hero-datos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-datos div{border-right:0;margin-right:0;padding-right:10px}
  .hero-bowl{width:118%;margin-left:-4%}
  .bowl-info{position:relative;left:auto;right:auto;bottom:auto;width:auto;margin:-8% 4% 0}
  .punto{width:26px;height:26px}
  .titulo .tate,.cabeza .tate{display:none}
  .cabeza::before{background:linear-gradient(180deg,rgba(10,9,8,.7),rgba(10,9,8,.92))}
  .pcard{flex-basis:76%}
  .flechas{display:none}
  .riel{cursor:auto}
  .platos,.tiendas,.form,.form fieldset{grid-template-columns:minmax(0,1fr)}
  .ramen .foto .hanko{right:10px;bottom:-20px;width:68px;height:68px;font-size:1.05rem}
  .cifras{grid-template-columns:repeat(2,1fr)}
  .cifra:nth-child(3){border-left:0}
  .cifra:nth-child(n+3){border-top:1px solid var(--linea)}
  .linea li{grid-template-columns:minmax(0,1fr)}
  .linea .img{aspect-ratio:700/432}
  .locales li{grid-template-columns:minmax(0,1fr)}
  .locales .acc{grid-column:1;grid-row:auto;flex-direction:row;align-items:center;gap:18px;margin-top:4px}
  .datos li{grid-template-columns:minmax(0,1fr);gap:2px}
  .pie{grid-template-columns:1fr}
  .barra-movil{display:flex}
  body{padding-bottom:74px}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important;scroll-behavior:auto!important}
  .entra{opacity:1;transform:none}
}

/* ---------- WordPress ---------- */
body.admin-bar header#cabecera{top:32px}
@media (max-width:782px){body.admin-bar header#cabecera{top:46px}}
.aviso-form.error{color:#FF8A80;font-weight:700}
.trampa{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* =========================================================
   MEJORAS v1.1
   ========================================================= */
/* Promociones */
.promos-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);grid-auto-rows:minmax(250px,auto);gap:18px}
.promo{position:relative;display:flex;align-items:flex-end;overflow:hidden;border-radius:3px;background:var(--superficie);min-height:250px;isolation:isolate}
.promo.grande{grid-row:span 2;min-height:520px}
.promo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .8s var(--curva)}
.promo::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,9,8,.05) 20%,rgba(10,9,8,.6) 55%,rgba(10,9,8,.95) 100%)}
.promo:hover img{transform:scale(1.05)}
.promo .tx{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:clamp(22px,3vw,36px)}
.promo .kick{font-size:.78rem;font-weight:700;letter-spacing:.08em;color:#fff;background:var(--shu);padding:4px 10px;border-radius:2px}
.promo .tit{font-family:var(--mincho);font-weight:900;font-size:clamp(1.4rem,2.2vw,1.9rem);line-height:1.15;color:var(--texto);max-width:18ch}
.promo.grande .tit{font-size:clamp(1.9rem,3.4vw,2.9rem)}
.promo .txt{color:var(--gris);font-size:.95rem;max-width:40ch}
.promo .btn{margin-top:8px;min-height:44px;padding:0 20px;font-size:.88rem}

/* Abierto / cerrado */
.estado{display:inline-flex;align-items:center;gap:7px;font-size:.78rem;font-weight:700;padding:3px 10px 3px 8px;border-radius:999px;margin-right:8px;white-space:nowrap;vertical-align:1px}
.estado i{width:7px;height:7px;border-radius:50%}
.estado.si{background:rgba(63,160,90,.15);color:#7BD38F}.estado.si i{background:#4CC36A;box-shadow:0 0 0 3px rgba(76,195,106,.25)}
.estado.no{background:rgba(239,232,220,.07);color:var(--gris)}.estado.no i{background:var(--gris-2)}

/* Contacto: mapas oscuros */
.tienda .mapa-caja{position:relative;overflow:hidden;background:var(--superficie-2)}
.tienda iframe{filter:invert(.92) hue-rotate(180deg) saturate(.55) brightness(.92) contrast(.95)}
.tienda .tx{gap:8px}
.tienda .tx>.estado{align-self:flex-start}
.tienda .acc{gap:8px;flex-wrap:wrap}
.tienda .acc .btn{flex:1 1 140px;min-height:44px;padding:0 14px;font-size:.84rem}

/* Nosotros: historia editorial */
.hitos{list-style:none;display:grid;gap:clamp(48px,7vw,96px)}
.hitos li{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:center}
.hitos li:nth-child(even) .hito-img{position:relative;margin:0;transform:rotate(-2deg);transition:transform .5s var(--curva)}
.hitos li:nth-child(even) .hito-img{transform:rotate(2deg)}
.hito-img img{width:100%;filter:drop-shadow(0 24px 40px rgba(0,0,0,.6))}
.hitos li:hover .hito-img{transform:rotate(0)}
.hito-tx .ano{display:block;font-family:var(--mincho);font-weight:900;font-size:clamp(3.4rem,7vw,6rem);line-height:.9;color:var(--shu)}
.hito-tx .lugar{display:block;margin:12px 0 4px;font-family:var(--mincho);color:var(--gris);letter-spacing:.12em}
.hito-tx h3{font-size:clamp(1.5rem,2.6vw,2.1rem);margin-bottom:12px}
.hito-tx p{color:var(--gris);max-width:46ch}
.equipo img{filter:drop-shadow(0 24px 40px rgba(0,0,0,.6))}

/* Franquicias */
.mapa-mundo{margin:0;background:var(--texto);border-radius:3px;padding:clamp(20px,3vw,36px) clamp(20px,3vw,36px) 16px}
.mapa-mundo img{width:100%}
.mapa-mundo figcaption{font-family:var(--mincho);font-weight:700;color:var(--shu-osc);font-size:.9rem;letter-spacing:.08em;margin-top:10px;text-align:right}
.franq-info>img{filter:none}
.franq-cifras{padding-bottom:clamp(48px,6vw,80px)}
.franq-cifras .cifras{margin:0}

@media (max-width:900px){
  .promos-grid{grid-template-columns:minmax(0,1fr)}
  .promo.grande{grid-row:auto;min-height:420px}
  .hitos li{grid-template-columns:minmax(0,1fr)}
  .hitos li:nth-child(even) .hito-img{order:0}
}

/* =========================================================
   v1.2 · VISTA RÁPIDA Y PEDIDO
   ========================================================= */
.pcard .abrir{position:absolute;inset:0;z-index:2;cursor:pointer}
.pcard .marcas{z-index:3}
.pcard .cap{z-index:3;pointer-events:none}
.pcard .cap .acc{pointer-events:auto}
.riel.arrastra .abrir{pointer-events:none}
.pcard .acc .w{display:inline-grid;place-items:center;height:40px;width:40px;border:1px solid rgba(239,232,220,.35);border-radius:2px;font-size:1.3rem;line-height:1;font-weight:500;color:var(--texto);transition:.2s}
.pcard .acc .w:hover{background:var(--texto);color:var(--sumi);border-color:var(--texto)}
.plato .foto{display:block;width:100%;padding:0;cursor:zoom-in}
.plato .foto:focus-visible{outline-offset:-3px}

dialog{color:var(--texto);border:0;padding:0;max-width:none;max-height:none}
dialog::backdrop{background:rgba(5,4,4,.78);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
dialog[open]{animation:dlg .35s var(--curva)}
@keyframes dlg{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
.cerrar{position:absolute;right:14px;top:12px;z-index:3;width:44px;height:44px;border-radius:50%;font-size:1.8rem;line-height:1;color:var(--texto);background:rgba(10,9,8,.55);transition:background .2s}
.cerrar:hover{background:var(--shu)}

.ficha{width:min(980px,calc(100vw - 32px));background:var(--superficie);border-radius:4px;overflow:hidden;margin:auto}
.ficha-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.ficha-foto{background:#000;min-height:420px}
.ficha-foto img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/4}
.ficha-tx{padding:clamp(28px,4vw,48px);display:flex;flex-direction:column;gap:10px}
.ficha-tx .jpn{font-family:var(--mincho);color:var(--shu);font-weight:700;letter-spacing:.1em;font-size:.9rem}
.ficha-tx h2{font-size:clamp(1.9rem,3.4vw,2.6rem)}
.ficha-marcas{display:flex;gap:6px}
.ficha-marcas:empty{display:none}
.ficha-tx>p{color:var(--gris)}
.ficha-nota{font-size:.86rem;border-top:1px solid var(--linea);padding-top:10px}
.ficha-nota:empty{display:none}
.ficha-precio{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:14px}
.ficha-precio b{font-family:var(--mincho);font-size:2.2rem}
.cant{display:inline-flex;align-items:center;border:1px solid var(--linea);border-radius:999px}
.cant button{width:40px;height:40px;font-size:1.2rem;border-radius:50%;transition:background .2s}
.cant button:hover{background:var(--superficie-2)}
.cant output{min-width:28px;text-align:center;font-weight:700}
.ficha-acc{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.ficha-acc .btn{flex:1 1 auto;white-space:nowrap}
.ficha-copiar{align-self:flex-start;font-size:.82rem;color:var(--gris);border-bottom:1px dashed var(--gris-2);margin-top:6px}
.ficha-copiar:hover{color:var(--texto)}

.pedido-boton{position:fixed;right:clamp(16px,3vw,32px);bottom:clamp(16px,3vw,32px);z-index:70;display:flex;align-items:center;gap:12px;min-height:58px;padding:0 22px 0 16px;border-radius:999px;background:#1E9E50;color:#fff;font-weight:700;box-shadow:0 18px 40px -12px rgba(0,0,0,.7)}
.pedido-boton[hidden]{display:none}
.pedido-boton .ico svg{width:24px;height:24px;fill:#fff;display:block}
.pedido-boton b{display:inline-grid;place-items:center;min-width:24px;height:24px;border-radius:999px;background:#fff;color:#1E9E50;font-size:.8rem;margin-left:4px;padding:0 6px}
.pedido-boton .pt{font-family:var(--mincho);font-weight:900;padding-left:12px;border-left:1px solid rgba(255,255,255,.35)}
.pedido-boton.salta{animation:salta .5s var(--curva)}
@keyframes salta{30%{transform:scale(1.08)}60%{transform:scale(.97)}}

.pedido{position:fixed;inset:0 0 0 auto;margin:0;height:100dvh;width:min(440px,100vw);background:var(--superficie);flex-direction:column}
dialog:not([open]){display:none}
.pedido[open]{display:flex;animation:panel .35s var(--curva)}
@keyframes panel{from{transform:translateX(30px);opacity:0}to{transform:none;opacity:1}}
.pedido-cab{display:flex;justify-content:space-between;align-items:center;padding:22px 24px;border-bottom:1px solid var(--linea)}
.pedido-cab h2{font-size:1.6rem}
.pedido-cab .cerrar{position:static}
.pedido-lista{list-style:none;flex:1;overflow:auto;padding:8px 24px}
.pedido-lista li{display:grid;grid-template-columns:56px minmax(0,1fr) auto;grid-template-areas:"img n n" "img c s";gap:4px 14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--linea)}
.pedido-lista img{grid-area:img;width:56px;height:70px;object-fit:cover;border-radius:2px}
.pedido-lista li>div{grid-area:n;display:flex;justify-content:space-between;gap:10px}
.pedido-lista li>div span{font-size:.8rem;color:var(--gris)}
.pedido-lista .cant{grid-area:c;justify-self:start}
.pedido-lista .cant button{width:34px;height:34px}
.pedido-lista .sub{grid-area:s;font-family:var(--mincho)}
.pedido-vacio{padding:32px 24px;color:var(--gris)}
.pedido-vacio[hidden],.pedido-pie[hidden]{display:none}
.pedido-pie{padding:18px 24px calc(18px + env(safe-area-inset-bottom));border-top:1px solid var(--linea);display:grid;gap:12px}
.pedido-pie .campo>span{font-size:.82rem;font-weight:700}
.pedido-pie select,.pedido-pie input{font:inherit;font-size:.92rem;min-height:46px;padding:8px 12px;border:1px solid var(--linea);background:var(--superficie-2);color:var(--texto);border-radius:2px;width:100%}
.pedido-total{display:flex;justify-content:space-between;align-items:baseline;padding-top:6px}
.pedido-total b{font-family:var(--mincho);font-size:1.8rem}
.pedido-aviso{font-size:.8rem;color:var(--gris-2);margin-top:-6px}
.pedido-pie .btn-wa{min-height:54px}
.pedido-pie .btn-wa svg{width:20px;height:20px;fill:#fff}
.pedido-vaciar{font-size:.82rem;color:var(--gris);justify-self:center}

.aviso-toast{position:fixed;left:50%;bottom:110px;z-index:90;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:var(--texto);color:var(--sumi);font-weight:700;font-size:.9rem;padding:12px 18px;border-radius:999px;transition:.3s var(--curva);max-width:calc(100vw - 32px);text-align:center}
.aviso-toast.ver{opacity:1;transform:translate(-50%,0)}

@media (max-width:800px){
  .ficha{width:100vw;max-height:100dvh;border-radius:0;overflow:auto;margin:auto 0 0}
  .ficha-grid{grid-template-columns:minmax(0,1fr)}
  .ficha-foto{min-height:0}
  .ficha-foto img{aspect-ratio:4/3}
}
@media (max-width:600px){
  .pedido-boton{left:12px;right:12px;bottom:calc(76px + env(safe-area-inset-bottom));justify-content:center}
  body.con-pedido{padding-bottom:150px}
  .aviso-toast{bottom:160px}
}