/* ============ Miss Alitas · fuego y sabor ============
   Negro y grafito neutros, rojo intenso de la marca y un dorado que solo marca lo importante. */
:root{
  --carbon:#0B0B0D; --carbon-2:#151518; --carbon-3:#1F1F23; --borde:#2A2A30;
  --rojo:#D7191F; --rojo-2:#B5121A; --vino:#8E1116; --oro:#D9A441;
  --blanco:#FFFFFF; --hueso:#ECECEE; --gris:#9C9CA6; --wa:#16A34A;
  --tit:"Barlow Condensed","Arial Narrow",sans-serif;
  --ui:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  /* Escala 1.25 sobre 17 px */
  --s-1:.85rem; --s0:1.0625rem; --s1:1.33rem; --s2:1.66rem; --s3:2.07rem; --s4:2.6rem; --s5:3.25rem; --s6:4.06rem;
  --r1:10px; --r2:16px; --r3:24px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --barra:0px;
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:76px;scroll-padding-bottom:calc(var(--barra) + 16px);-webkit-text-size-adjust:100%}
body{font-family:var(--ui);font-size:var(--s0);line-height:1.6;color:var(--hueso);background:var(--carbon);-webkit-font-smoothing:antialiased;padding-bottom:var(--barra)}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
h1,h2,h3{font-family:var(--tit);font-weight:800;line-height:.95;color:var(--blanco);letter-spacing:.005em}
.wrap{width:min(1180px,100% - 32px);margin-inline:auto}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--oro);outline-offset:3px;border-radius:6px}
.precio{font-family:var(--tit);font-weight:700;font-variant-numeric:tabular-nums lining-nums;color:var(--blanco);letter-spacing:.01em}
[hidden]{display:none!important}

/* Aviso de la versión de prueba */
.prueba{background:var(--oro);color:var(--carbon);font-size:var(--s-1);font-weight:700;text-align:center;padding:7px 16px;line-height:1.35}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;font-weight:700;text-decoration:none;transition:transform .18s var(--ease),background-color .2s,box-shadow .2s,color .2s}
.btn:active{transform:scale(.97)}
.btn svg{width:20px;height:20px;flex:none}
.btn-rojo{background:var(--rojo);color:#fff;box-shadow:0 10px 30px -10px rgba(215,25,31,.7)}
.btn-rojo:hover{background:var(--rojo-2)}
.btn-borde{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.4);color:#fff}
.btn-borde:hover{box-shadow:inset 0 0 0 1.5px #fff;background:rgba(255,255,255,.06)}
.btn-wa{background:#15803D;color:#fff}
.btn-wa:hover{background:#15803D}
.btn-suave{background:var(--carbon-3);color:#fff}
.btn-suave:hover{background:var(--borde)}
.btn-chico{min-height:44px;padding:0 18px;font-size:.95rem}

/* ============ Encabezado ============ */
header{position:sticky;top:0;z-index:40;background:rgba(11,11,13,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .3s}
header.scroll{border-color:var(--borde)}
.hd{display:flex;align-items:center;gap:20px;height:68px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex:none}
.logo img{width:48px;height:48px;border-radius:50%}
.logo b{font-family:var(--tit);font-weight:800;font-size:1.55rem;color:#fff;line-height:1}
.nav{display:flex;gap:4px;margin-left:auto}
.nav a{text-decoration:none;font-weight:600;font-size:.98rem;padding:10px 14px;border-radius:999px;color:var(--hueso);transition:background .2s,color .2s}
.nav a:hover{background:var(--carbon-3);color:#fff}
.pedir-h{position:relative}
.pedir-h .cuenta{position:absolute;top:-4px;right:-4px;min-width:22px;height:22px;padding:0 6px;border-radius:99px;background:var(--oro);color:var(--carbon);font-size:.78rem;font-weight:800;display:grid;place-items:center;box-shadow:0 0 0 3px var(--carbon)}
.pedir-h .cuenta.pop{animation:pop .35s var(--ease)}
@keyframes pop{40%{transform:scale(1.35)}}
@media (max-width:860px){.solo-compu{display:none!important}.hd{height:60px;gap:8px}.logo img{width:42px;height:42px}.nav a{padding:10px 10px;font-size:.92rem}.pedir-h{padding:0 14px}}
@media (max-width:480px){.logo b{display:none}}

/* ============ Portada ============ */
.hero{position:relative;min-height:min(88vh,820px);display:grid;align-items:end;overflow:hidden;isolation:isolate}
.hero picture,.hero picture img{position:absolute;inset:0;width:100%;height:100%}
.hero picture img{object-fit:cover;object-position:right center}
.hero::before{content:"";position:absolute;inset:0;z-index:1;background:
  linear-gradient(90deg,rgba(11,11,13,.96) 0%,rgba(11,11,13,.78) 38%,rgba(11,11,13,.1) 70%),
  linear-gradient(0deg,var(--carbon) 0%,transparent 30%)}
.hero .wrap{position:relative;z-index:2;padding:72px 0 64px}
.hero h1{font-size:clamp(3.4rem,min(8.6vw,11vh),7.4rem);font-weight:800;line-height:.86;max-width:9.5ch;text-transform:uppercase}
.hero h1 span{display:block}
.hero h1 .oro{color:var(--oro)}
.hero p{font-size:var(--s1);line-height:1.45;max-width:34ch;margin-top:24px;color:var(--hueso)}
.hero .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.datos{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:10px;margin-top:32px;color:var(--hueso);font-size:.95rem}
.datos li{display:flex;align-items:center;gap:8px;padding:8px 14px 8px 10px;border-radius:999px;background:rgba(21,21,24,.72);box-shadow:inset 0 0 0 1px var(--borde);backdrop-filter:blur(6px)}
.datos svg{width:18px;height:18px;color:var(--oro);flex:none}
.datos b{color:#fff;font-weight:700}

/* Cómo pedir: tres pasos justo después de la portada */
.pasos{padding:28px 0 0}
.pasos-lista{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.pasos-lista li{display:flex;gap:16px;align-items:flex-start;background:var(--carbon-2);border-radius:var(--r2);padding:20px 22px;box-shadow:inset 0 0 0 1px var(--borde)}
.pasos-lista b{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--rojo);color:#fff;font-family:var(--tit);font-size:1.35rem;font-weight:800}
.pasos-lista h3{font-size:var(--s1);text-transform:uppercase}
.pasos-lista p{color:var(--gris);font-size:.94rem;line-height:1.45;margin-top:2px}
@media (max-width:860px){.pasos{padding-top:8px}.pasos-lista{grid-template-columns:1fr;gap:10px}.pasos-lista li{padding:16px 18px}}

/* Pie de página */
.pie-web{background:#08080A;border-top:1px solid var(--borde);padding:56px 0 32px}
.pie-grid{display:grid;grid-template-columns:1.3fr 1fr 1.2fr 1.1fr 1.2fr;gap:32px}
.pie-web h3{font-family:var(--ui);font-size:.85rem;font-weight:800;color:var(--oro);letter-spacing:.06em;margin-bottom:12px}
.pie-web p{color:var(--gris);font-size:.95rem;margin-top:10px}
.pie-web nav{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.pie-web nav a,.pie-web nav button{color:var(--hueso);text-decoration:none;font-size:.95rem;padding:2px 0}
.pie-web nav a:hover,.pie-web nav button:hover{color:#fff;text-decoration:underline}
.pie-web ul{list-style:none;padding:0;display:grid;gap:8px;color:var(--hueso);font-size:.95rem}
.pie-web ul small{display:block;color:var(--gris);font-size:.82rem}
.pie-web .btn{margin-top:14px}
@media (max-width:860px){.pie-grid{grid-template-columns:1fr 1fr;gap:28px}.pie-grid>div:first-child{grid-column:1/-1}}
/* Entrada escalonada, una sola vez */
.entra{opacity:0;transform:translateY(18px);animation:entra .8s var(--ease) forwards}
.entra:nth-child(2){animation-delay:.1s}.entra:nth-child(3){animation-delay:.2s}.entra:nth-child(4){animation-delay:.3s}
.hero h1 span{opacity:0;transform:translateY(24px);animation:entra .8s var(--ease) forwards}
.hero h1 span:nth-child(2){animation-delay:.08s}.hero h1 span:nth-child(3){animation-delay:.16s}
@keyframes entra{to{opacity:1;transform:none}}
@media (max-width:860px){
  .hero{min-height:0;display:block}
  .hero picture{position:relative;display:block;height:min(50vh,440px)}
  .hero picture img{object-position:center top}
  .hero::before{background:linear-gradient(0deg,var(--carbon) 32%,rgba(11,11,13,.45) 50%,transparent 70%)}
  .hero h1{text-shadow:0 2px 20px rgba(0,0,0,.55)}
  .hero .wrap{margin-top:-120px;padding:0 0 40px}
  .hero h1{font-size:clamp(2.7rem,12.5vw,4rem)}
  .hero p{font-size:1.05rem;margin-top:12px}
  .hero .cta{margin-top:18px;gap:10px}.hero .cta .btn{flex:1 1 0;min-width:0;padding:0 12px}
  .datos{margin-top:24px}
}

/* ============ Secciones ============ */
section{padding:96px 0}
.tit-sec{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:16px 32px;margin-bottom:36px}
.tit-sec h2{font-size:clamp(var(--s4),6vw,var(--s6));text-transform:uppercase}
.tit-sec p{color:var(--gris);max-width:44ch}
@media (max-width:860px){section{padding:64px 0}.tit-sec{margin-bottom:24px}}
.revela{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.revela.si{opacity:1;transform:none}

/* Destacados */
.destacados{display:grid;grid-template-columns:1.35fr 1fr;grid-template-rows:1fr 1fr;gap:18px}
.dest{position:relative;border-radius:var(--r3);overflow:hidden;background:var(--carbon-2);min-height:260px;display:flex;align-items:flex-end;text-align:left;isolation:isolate}
.dest:first-child{grid-row:span 2;min-height:560px}
.dest img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease);z-index:-1}
.dest::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(11,11,13,.95) 8%,rgba(11,11,13,.2) 55%,transparent);z-index:-1}
.dest .txt{padding:26px;width:100%;display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.dest h3{font-size:clamp(var(--s3),4vw,var(--s5));text-transform:uppercase}
.dest p{color:var(--hueso);font-size:.95rem;margin-top:6px;max-width:30ch}
.dest .precio{font-size:var(--s3);white-space:nowrap}
.dest .mas{position:absolute;top:18px;right:18px}
@media (hover:hover){.dest:hover img{transform:scale(1.04)}}
@media (max-width:860px){.destacados{grid-template-columns:1fr;grid-template-rows:none}.dest:first-child{grid-row:auto;min-height:420px}.dest{min-height:300px}.dest .txt{padding:20px}}

.mas{width:48px;height:48px;border-radius:50%;background:var(--rojo);color:#fff;display:grid;place-items:center;flex:none;transition:transform .18s var(--ease),background .2s;box-shadow:0 8px 20px -8px rgba(215,25,31,.8)}
.mas:hover{background:var(--rojo-2)}
.mas:active{transform:scale(.9)}
.mas svg{width:22px;height:22px}

/* Menú */
.cats{position:sticky;top:68px;z-index:20;background:var(--carbon);padding:12px 0;margin-bottom:12px;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
.cats::-webkit-scrollbar{display:none}
.cats button{white-space:nowrap;min-height:44px;padding:0 20px;border-radius:999px;font-weight:700;background:var(--carbon-2);box-shadow:inset 0 0 0 1px var(--borde);color:var(--hueso);transition:background .2s,color .2s,box-shadow .2s}
.cats button[aria-selected=true]{background:#fff;color:var(--carbon);box-shadow:none}
.cats button span{color:var(--gris);font-weight:600;margin-left:6px}
.cats button[aria-selected=true] span{color:#55555E}
@media (max-width:860px){.cats{top:60px}}
.platos{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;view-transition-name:platos}
.plato{display:grid;grid-template-columns:168px 1fr;gap:0;background:var(--carbon-2);border-radius:var(--r2);overflow:hidden;text-align:left;box-shadow:inset 0 0 0 1px var(--borde);transition:box-shadow .25s,transform .25s var(--ease)}
.plato .foto{overflow:hidden;aspect-ratio:1/1}
.plato img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.plato .txt{padding:18px 20px;display:flex;flex-direction:column;gap:6px}
.plato h3{font-size:var(--s2);text-transform:uppercase}
.plato p{color:var(--gris);font-size:.94rem;line-height:1.45}
.plato .pie{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding-top:10px}
.plato .precio{font-size:var(--s2)}
@media (hover:hover){.plato:hover{box-shadow:inset 0 0 0 1px #3A3A42;transform:translateY(-2px)}.plato:hover img{transform:scale(1.05)}}
@media (max-width:860px){.platos{grid-template-columns:1fr}.plato{grid-template-columns:120px 1fr}.plato .txt{padding:14px 16px}}

/* Salsas */
.salsas{background:var(--carbon-2);position:relative;overflow:hidden}
.salsas::before{content:"";position:absolute;inset:auto -10% -40% -10%;height:70%;background:radial-gradient(50% 60% at 50% 100%,rgba(215,25,31,.28),transparent 70%);pointer-events:none}
.salsas .wrap{position:relative}
.niveles{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.niveles button{min-height:44px;padding:0 18px;border-radius:999px;font-weight:700;background:var(--carbon);box-shadow:inset 0 0 0 1px var(--borde);display:inline-flex;align-items:center;gap:8px}
.niveles button[aria-pressed=true]{background:var(--rojo);box-shadow:none;color:#fff}
.lista-salsas{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.salsa{background:var(--carbon);border-radius:var(--r2);padding:20px;box-shadow:inset 0 0 0 1px var(--borde);display:flex;flex-direction:column;gap:10px;transition:opacity .3s,transform .3s var(--ease)}
.salsa h3{font-size:var(--s2);text-transform:uppercase}
.salsa p{color:var(--gris);font-size:.94rem;line-height:1.45}
.picante{display:flex;gap:5px;align-items:center}
.picante i{width:22px;height:6px;border-radius:3px;background:var(--borde)}
.picante i.on{background:linear-gradient(90deg,var(--oro),var(--rojo))}
.picante small{margin-left:8px;color:var(--gris);font-size:.82rem;font-weight:600}
.pendiente{display:inline-flex;align-items:center;gap:8px;margin-top:22px;padding:10px 14px;border-radius:var(--r1);border:1.5px dashed #4A4A52;color:var(--oro);font-size:.9rem;font-weight:600}
.salsa-foto{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:28px}
.salsa-foto img{border-radius:var(--r2);aspect-ratio:21/9;object-fit:cover;width:100%}
@media (max-width:860px){.salsa-foto{grid-template-columns:1fr 1fr;gap:10px}.salsa-foto img{aspect-ratio:1/1}}

/* Familia */
.familia{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;align-items:stretch}
.familia .grande{border-radius:var(--r3);overflow:hidden;position:relative}
.familia .grande img{width:100%;height:100%;object-fit:cover;object-position:center;aspect-ratio:4/3}
.familia .lado{display:grid;grid-template-rows:auto 1fr;gap:18px}
.familia .lado .texto{background:var(--carbon-2);border-radius:var(--r3);padding:32px;box-shadow:inset 0 0 0 1px var(--borde)}
.familia .lado h2{font-size:clamp(var(--s4),5vw,var(--s5));text-transform:uppercase;margin-bottom:14px}
.familia .lado p{color:var(--hueso)}
.familia ul{list-style:none;padding:0;margin-top:18px;display:grid;gap:10px}
.familia li{display:flex;gap:12px;align-items:baseline}
.familia li::before{content:"";flex:none;width:8px;height:8px;border-radius:2px;background:var(--rojo);transform:translateY(-2px) rotate(45deg)}
.hueco{border-radius:var(--r3);border:2px dashed #3A3A42;display:grid;place-items:center;text-align:center;padding:24px;color:var(--gris);font-size:.92rem;min-height:200px;background:repeating-linear-gradient(45deg,transparent 0 14px,rgba(255,255,255,.02) 14px 28px)}
.hueco b{display:block;color:var(--oro);font-size:1rem;margin-bottom:4px}
@media (max-width:860px){.familia{grid-template-columns:1fr}.familia .grande img{aspect-ratio:4/3}.familia .lado .texto{padding:24px}}

/* Locales */
.locales{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.local{background:var(--carbon-2);border-radius:var(--r3);overflow:hidden;box-shadow:inset 0 0 0 1px var(--borde);display:flex;flex-direction:column;transition:box-shadow .25s}
.local{position:relative}
.local[data-sel=true]::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 2px var(--oro);pointer-events:none;z-index:3}
.local .elegido{position:absolute;top:12px;left:12px;z-index:2;display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:var(--oro);color:var(--carbon);font-weight:800;font-size:.85rem}
.local .foto{aspect-ratio:16/10;background:var(--carbon-3);position:relative;overflow:hidden}
.local .foto img{width:100%;height:100%;object-fit:cover}
.marca-local img:first-child{filter:brightness(.34) saturate(1.15);transform:scale(1.06)}
.local .foto.marca-local .sello{position:absolute;inset:0;margin:auto;width:92px;height:92px;border-radius:50%;box-shadow:0 0 0 6px rgba(11,11,13,.55),0 18px 40px rgba(0,0,0,.6)}
.marca-local.real{aspect-ratio:4/3}
.marca-local.real img:first-child{filter:none;transform:none}
.marca-local.real::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(11,11,13,.75) 0%,transparent 45%)}
.marca-local .ciudad{z-index:1;position:absolute;left:18px;bottom:14px;font-family:var(--tit);font-weight:700;font-size:1.05rem;letter-spacing:.08em;color:var(--oro)}

/* Pizarra: combos y papas en lista, como el menú del local */
.tablero{background:var(--carbon-2);border-radius:var(--r3);box-shadow:inset 0 0 0 1px var(--borde);padding:8px 28px;view-transition-name:platos}
.fila{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:18px;width:100%;text-align:left;padding:20px 0;border-bottom:1px solid var(--borde)}
.fila:last-child{border-bottom:0}
.fila h3{font-size:var(--s2);text-transform:uppercase;transition:color .2s}
.fila p{color:var(--gris);font-size:.95rem;margin-top:2px}
.fila .precio{font-size:var(--s2)}
@media (hover:hover){.fila:hover h3{color:var(--oro)}}
@media (max-width:860px){.tablero{padding:4px 18px}.fila{gap:12px;padding:16px 0}}

/* ¿Cuántos van a comer? */
.calc{margin-top:18px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px 28px;background:linear-gradient(100deg,var(--carbon-2),#1d1012);border-radius:var(--r3);padding:22px 26px;box-shadow:inset 0 0 0 1px var(--borde)}
.calc h3{font-size:var(--s2);text-transform:uppercase}
.calc .personas{display:flex;flex-wrap:wrap;gap:8px}
.calc .personas button{min-height:44px;padding:0 16px;border-radius:999px;font-weight:700;background:var(--carbon);box-shadow:inset 0 0 0 1px var(--borde)}
.calc .personas button[aria-pressed=true]{background:#fff;color:var(--carbon);box-shadow:none}
.calc .sug{display:flex;align-items:center;gap:18px;text-align:right}
.calc .sug .btn{white-space:nowrap;flex:none}
.calc .sug b{display:block;font-family:var(--tit);font-size:var(--s2);color:#fff;line-height:1}
.calc .sug small{color:var(--gris)}
@media (max-width:980px){.calc{grid-template-columns:1fr}.calc .sug{text-align:left;justify-content:space-between}}
.gota{width:14px;height:14px;border-radius:50%;flex:none;box-shadow:inset 0 -3px 0 rgba(0,0,0,.25)}
.salsa .cab{display:flex;align-items:center;gap:10px}
.local .txt{padding:22px;display:flex;flex-direction:column;gap:8px;flex:1}
.local h3{font-size:var(--s3);text-transform:uppercase}
.local .dato{display:flex;gap:10px;color:var(--hueso);font-size:.95rem;line-height:1.45}
.local .dato svg{width:18px;height:18px;flex:none;margin-top:3px;color:var(--oro)}
.local .falta{color:var(--gris);font-style:italic}
.local .acc{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:14px}
.ej{display:inline-block;vertical-align:middle;margin-left:8px;font-family:var(--ui);font-size:.72rem;font-weight:800;color:var(--carbon);background:var(--oro);padding:3px 8px;border-radius:6px;letter-spacing:.02em}
@media (max-width:980px){.locales{grid-template-columns:1fr}.local{flex-direction:row}.local .foto{aspect-ratio:auto;width:38%;flex:none}}
@media (max-width:600px){.local{flex-direction:column}.local .foto{width:auto;aspect-ratio:16/9}}

/* Cierre */
.cierre{background:linear-gradient(180deg,var(--carbon) 0%,#140A0B 100%);text-align:center;padding:96px 0 56px}
.cierre img{width:150px;height:150px;margin:0 auto 24px;border-radius:50%}
.cierre h2{font-size:clamp(var(--s4),7vw,var(--s6));text-transform:uppercase;max-width:14ch;margin:0 auto}
.cierre p{color:var(--gris);margin:14px auto 28px;max-width:46ch}
.cierre .cta{display:flex;justify-content:center;flex-wrap:wrap;gap:12px}
.redes{display:flex;justify-content:center;gap:12px;margin-top:40px}
.redes a{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--carbon-3);color:#fff;transition:background .2s}
.redes a:hover{background:var(--rojo)}
.redes svg{width:20px;height:20px}
.legal{margin-top:40px;padding-top:24px;border-top:1px solid var(--borde);color:#8E8E98;font-size:.85rem;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px}

/* Barra de pedido (celular y compu) */
.barra{position:fixed;z-index:35;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));width:min(520px,calc(100% - 24px));transform:translate(-50%,calc(100% + 30px));transition:transform .4s var(--ease),visibility .4s;visibility:hidden;display:flex;align-items:center;gap:12px;background:var(--rojo);color:#fff;border-radius:999px;padding:8px 8px 8px 22px;box-shadow:0 18px 40px -12px rgba(0,0,0,.7)}
.barra.si{transform:translate(-50%,0);visibility:visible}
.barra .resumen{flex:1;font-weight:700;line-height:1.2}
.barra .resumen small{display:block;font-weight:600;opacity:.85;font-size:.8rem}
.barra button{background:#fff;color:var(--rojo);font-weight:800;min-height:46px;padding:0 20px;border-radius:999px}

/* ============ Ventanas ============ */
dialog{border:0;padding:0;background:var(--carbon-2);color:var(--hueso);max-width:none;max-height:none}
dialog::backdrop{background:rgba(5,5,7,.72);backdrop-filter:blur(4px)}
dialog[open]{animation:aparece .32s var(--ease)}
dialog[open]::backdrop{animation:fondo .32s ease}
@keyframes aparece{from{opacity:0;transform:translateY(24px) scale(.98)}}
@keyframes fondo{from{opacity:0}}
.ficha{width:min(560px,calc(100% - 32px));max-height:calc(100dvh - 48px);border-radius:var(--r3);margin:auto}
.cesta{margin:0 0 0 auto;height:100dvh;max-height:100dvh;width:min(460px,100%);border-radius:var(--r3) 0 0 var(--r3)}
.cesta[open]{animation:lateral .36s var(--ease)}
@keyframes lateral{from{transform:translateX(40px);opacity:0}}
.dl{display:flex;flex-direction:column;max-height:inherit;height:100%}
/* Un solo scroll: el cuerpo es el contenedor de lo absoluto (.sr) y la ventana no se desplaza. */
dialog.ficha,dialog.cesta{overflow:hidden}
.dl-cuerpo{overflow:auto;overscroll-behavior:contain;flex:1;position:relative;min-height:0}
.ficha .foto{position:relative;aspect-ratio:16/10;background:var(--carbon-3)}
.ficha .foto img{width:100%;height:100%;object-fit:cover}
.cerrar{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;background:rgba(11,11,13,.78);backdrop-filter:blur(6px);color:#fff;display:grid;place-items:center;z-index:2}
.cerrar svg{width:20px;height:20px}
.pad{padding:22px 24px}
.ficha h2{font-size:var(--s4);text-transform:uppercase}
.ficha .desc{color:var(--gris);margin-top:6px}
.grupo{margin-top:22px}
.grupo-t{display:flex;justify-content:space-between;align-items:baseline;font-weight:700;color:#fff;margin-bottom:10px}
.grupo-t small{color:var(--gris);font-weight:600}
.opciones{display:flex;flex-wrap:wrap;gap:8px}
.opciones button{min-height:44px;padding:0 16px;border-radius:var(--r1);font-weight:600;background:var(--carbon);box-shadow:inset 0 0 0 1px var(--borde);transition:background .15s,box-shadow .15s}
.opciones button[aria-checked=true]{background:#fff;color:var(--carbon);box-shadow:none}
.opciones button:disabled{opacity:.35;cursor:not-allowed}
.tamanos{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.tamanos button{min-height:58px;border-radius:var(--r1);background:var(--carbon);box-shadow:inset 0 0 0 1px var(--borde);display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.1;transition:background .15s,box-shadow .15s}
.tamanos b{font-family:var(--tit);font-size:1.45rem;color:#fff}
.tamanos small{font-size:.78rem;color:var(--gris);font-weight:600}
.tamanos button[aria-checked=true]{background:#fff;box-shadow:none}
.tamanos button[aria-checked=true] b{color:var(--carbon)}.tamanos button[aria-checked=true] small{color:#55555E}
.ficha .foto.sin{aspect-ratio:auto;height:68px;background:transparent}
.ficha .foto.sin img{display:none}
.foto-lado{border-radius:var(--r3);overflow:hidden}
.foto-lado img{width:100%;height:100%;object-fit:cover;object-position:center 70%}
.sin-foto{display:grid;place-items:center;height:100%;color:var(--gris);font-size:.8rem;text-align:center;padding:10px;background:repeating-linear-gradient(45deg,transparent 0 12px,rgba(255,255,255,.03) 12px 24px);border:1.5px dashed #3A3A42;border-radius:inherit}
textarea,input,select{width:100%;font:inherit;color:#fff;background:var(--carbon);border:1px solid var(--borde);border-radius:var(--r1);padding:13px 14px}
textarea{resize:vertical;min-height:76px}
input:focus,textarea:focus,select:focus{outline:2px solid var(--oro);outline-offset:1px;border-color:transparent}
.err{color:#FF8A8A;font-weight:600;font-size:.92rem;min-height:1.4em;margin-top:10px}
.pie-dl{display:flex;gap:12px;align-items:center;padding:14px 24px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--borde);background:var(--carbon-2)}
.pie-dl .btn{flex:1}
.cant{display:inline-flex;align-items:center;border-radius:999px;box-shadow:inset 0 0 0 1px var(--borde)}
.cant button{width:44px;height:44px;font-size:1.25rem;font-weight:700}
.cant output{min-width:26px;text-align:center;font-weight:800;color:#fff}
.cesta h2{font-size:var(--s4);text-transform:uppercase}
.linea{display:grid;grid-template-columns:60px 1fr auto;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--borde)}
.linea img{width:60px;height:60px;border-radius:12px;object-fit:cover}
.linea b{display:block;color:#fff}
.linea small{display:block;color:var(--gris);font-size:.88rem;line-height:1.35}
.linea .cant{margin-top:8px}.linea .cant button{width:36px;height:36px}
.linea .precio{font-size:var(--s1)}
.campo{display:grid;gap:8px;margin-top:18px}
.campo>label,.campo>span{font-weight:700;color:#fff;font-size:.95rem}
.total{display:flex;justify-content:space-between;align-items:baseline;margin-top:20px;padding-top:16px;border-top:1px dashed var(--borde)}
.total .precio{font-size:var(--s3)}
.vacio{text-align:center;padding:56px 12px}
.vacio .plato-v{width:110px;height:110px;border-radius:50%;margin:0 auto 18px;background:repeating-conic-gradient(var(--rojo) 0 25%,#fff 0 50%) 0 0/20px 20px;box-shadow:inset 0 0 0 10px var(--carbon-2),0 0 0 1px var(--borde)}
.vacio h3{font-size:var(--s3);text-transform:uppercase}
.vacio p{color:var(--gris);margin:8px 0 20px}
@media (max-width:860px){
  .ficha,.cesta{width:100%;max-width:100%;margin:auto 0 0;border-radius:var(--r3) var(--r3) 0 0;max-height:92dvh;height:auto}
  .ficha[open],.cesta[open]{animation:sube .38s var(--ease)}
  .ficha .foto{aspect-ratio:16/9}
}
@keyframes sube{from{transform:translateY(100%)}}

.toast{position:fixed;z-index:60;left:50%;top:84px;transform:translate(-50%,-12px);opacity:0;pointer-events:none;background:#fff;color:var(--carbon);font-weight:700;padding:12px 18px;border-radius:999px;box-shadow:0 14px 34px -10px rgba(0,0,0,.6);transition:.3s var(--ease);white-space:nowrap}
.toast.si{opacity:1;transform:translate(-50%,0)}
.toast[popover]{margin:0;border:0;right:auto;bottom:auto;overflow:visible;inset-block-end:auto;inset-inline-end:auto}
.toast{white-space:normal;max-width:calc(100vw - 32px);width:max-content;text-align:center}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .entra,.hero h1 span,.revela{opacity:1;transform:none}
}

/* ===== Mejoras de uso ===== */
.saltar{position:absolute;left:12px;top:-60px;z-index:100;background:#fff;color:var(--carbon);font-weight:700;padding:10px 16px;border-radius:10px;text-decoration:none;transition:top .2s}
.saltar:focus{top:12px}
.nav a[aria-current]{color:#fff;background:var(--carbon-3);box-shadow:inset 0 -2px 0 var(--rojo)}
.op-salsa{display:inline-flex;align-items:center;gap:8px}
.op-salsa .gota{width:12px;height:12px}
.op-salsa .fuego{font-size:.7rem;letter-spacing:-2px;margin-left:-2px}
.fab-wa{position:fixed;z-index:34;right:16px;bottom:calc(18px + env(safe-area-inset-bottom));width:58px;height:58px;border-radius:50%;background:var(--wa);color:#fff;display:grid;place-items:center;box-shadow:0 14px 30px -8px rgba(0,0,0,.7);transform:scale(.6);opacity:0;visibility:hidden;transition:transform .3s var(--ease),opacity .3s,visibility .3s}
.fab-wa.si{transform:none;opacity:1;visibility:visible}
.fab-wa svg{width:28px;height:28px}
@media (min-width:861px){.fab-wa{display:none}}

/* Salsas: termómetro de picante */
.termo{background:var(--carbon);border-radius:var(--r3);box-shadow:inset 0 0 0 1px var(--borde);padding:26px;overflow:hidden}
.termo-barra{height:6px;border-radius:99px;background:linear-gradient(90deg,#E8B04A 0%,#F08A24 33%,#D9381E 66%,#A3121A 100%);margin-bottom:22px}
.termo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.termo-nivel{padding:0 20px;border-left:1px solid var(--borde)}
.termo-nivel:first-child{border-left:0;padding-left:0}
.termo-cab{display:flex;align-items:baseline;gap:8px;padding-bottom:12px;margin-bottom:12px;border-bottom:2px solid var(--nc)}
.termo-n{font-family:var(--tit);font-weight:800;font-size:var(--s2);text-transform:uppercase;color:#fff}
.termo-chiles{font-size:.75rem;letter-spacing:-2px}
.termo-cuenta{margin-left:auto;font-size:.8rem;font-weight:700;color:var(--gris)}
.termo-salsas{list-style:none;padding:0;display:grid;gap:9px}
.termo-salsas li{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--hueso)}
.termo-salsas .gota{width:12px;height:12px}
@media (max-width:860px){
  .termo{padding:20px 18px}
  .termo-grid{grid-template-columns:1fr 1fr;gap:20px 0}
  .termo-nivel{padding:0 14px}
  .termo-nivel:nth-child(odd){border-left:0;padding-left:0}
  .termo-n{font-size:var(--s1)}
  .termo-salsas{gap:7px}.termo-salsas li{font-size:.92rem}
}

/* Pedido: acciones por línea, destino y aviso de WhatsApp */
.linea-acc{display:flex;gap:14px;margin-top:6px}
.enlace{background:none;border:0;padding:6px 0;min-height:32px;color:var(--hueso);font:inherit;font-size:.88rem;font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.enlace:hover{color:#fff}
.nota-total{color:var(--gris);font-size:.85rem;line-height:1.4;margin-top:6px}
.destino{display:flex;flex-wrap:wrap;gap:4px;margin-top:16px;padding:12px 14px;border-radius:var(--r2);background:var(--carbon-3);color:var(--hueso);font-size:.92rem}
.destino b{color:#fff}
.aviso-wa{margin-top:12px;color:var(--gris);font-size:.85rem;line-height:1.45}
.cant button:disabled{opacity:.35;cursor:not-allowed}

/* Privacidad en el pie */
.privacidad{margin-top:32px;color:var(--gris);font-size:.9rem}
.privacidad summary{cursor:pointer;color:var(--hueso);font-weight:700;min-height:44px;display:inline-flex;align-items:center}
.privacidad p{max-width:70ch;line-height:1.5;margin:4px 0 12px}
@media (max-width:380px){.hero .cta .btn{font-size:.95rem;white-space:nowrap}}

/* Falta elegir salsa: el grupo se marca junto al aviso */
.grupo.falta .grupo-t small{color:#FF8A8A}
.grupo.falta .opciones{outline:2px solid #FF8A8A;outline-offset:6px;border-radius:14px}
/* Después de abrir WhatsApp */
.enviado{margin-top:14px;padding:14px;border-radius:var(--r2);background:var(--carbon-3);display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.enviado p{color:var(--hueso);font-size:.92rem;margin:0}
/* Título de la portada legible sobre la foto en celular */
@media (max-width:860px){
  .hero::before{background:linear-gradient(0deg,var(--carbon) 30%,rgba(11,11,13,.82) 46%,rgba(11,11,13,.35) 62%,transparent 76%)}
  .hero h1{text-shadow:0 2px 24px rgba(0,0,0,.75),0 1px 3px rgba(0,0,0,.6)}
  .hero picture::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(11,11,13,.9) 0%,rgba(11,11,13,.62) 32%,rgba(11,11,13,.15) 58%,transparent 70%)}
}
/* Transferencia: cuentas dentro del pedido */
.cuentas{margin-top:14px;padding:14px 16px;border-radius:var(--r2);background:var(--carbon-3);display:grid;gap:6px;font-size:.92rem}
.cuentas>b{color:#fff}
.cuentas>span,.cuentas small{color:var(--gris)}
.cuentas ul{list-style:none;padding:0;display:grid;gap:4px}
.cuentas li{display:flex;justify-content:space-between;gap:12px}
.cuentas li b{color:#fff;font-variant-numeric:tabular-nums;user-select:all}
.ayuda{display:block;color:var(--gris);font-size:.85rem;margin-top:6px}
/* Solo para lectores de pantalla */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* Palabras largas con texto grande: que no se salgan de la pantalla */
h1,h2,h3{overflow-wrap:break-word}
.pie-grid>div,.pie-grid>nav{min-width:0}
.pie-web{overflow-wrap:anywhere}
.linea .precio{white-space:nowrap}
.pie-web .red{display:inline-flex;align-items:center;gap:8px;color:var(--hueso);text-decoration:none;font-weight:700;min-height:44px}
.pie-web .red:hover{color:#fff;text-decoration:underline}
.pie-web .red svg{width:20px;height:20px}
#f-acomp button,#f-prep button{padding-inline:14px}

/* ===== Efectos premium (2026-10-24) ===== */
/* 1. Fotos que se abren como cortina al bajar (animación ligada al scroll; sin soporte quedan quietas) */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .plato .foto, .local .foto, .galeria-fila li { animation: cortina linear both; animation-timeline: view(); animation-range: entry 0% cover 30%; }
    .dest { animation: cortina-redonda linear both; animation-timeline: view(); animation-range: entry 0% cover 30%; }
    .plato .foto img, .local .foto img { animation: acerca linear both; animation-timeline: view(); animation-range: entry 0% cover 45%; }
  }
}
@keyframes cortina { from { clip-path: inset(0 10%); } to { clip-path: inset(0 0); } }
@keyframes cortina-redonda { from { clip-path: inset(0 8% round var(--r3)); } to { clip-path: inset(0 0 round var(--r3)); } }
@keyframes acerca { from { scale: 1.12; } to { scale: 1; } }

/* 2. Títulos que suben palabra por palabra */
.pal { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
.pal > span { display: inline-block; transform: translateY(105%); transition: transform .85s var(--ease); transition-delay: calc(var(--i) * 70ms + 120ms); }
.revela.si .pal > span { transform: none; }

/* 3. Franja de salsas que corre */
.cinta { overflow: hidden; padding: 26px 0; border-block: 1px solid var(--borde); background: var(--carbon); }
.cinta-pista { display: flex; align-items: center; width: max-content; animation: corre 55s linear infinite; }
.cinta span { font-family: var(--tit); font-weight: 800; text-transform: uppercase; font-size: clamp(2.6rem, 7vw, 5.2rem); line-height: 1; padding: 0 .3em; color: transparent; -webkit-text-stroke: 1.5px rgba(255, 255, 255, .5); }
.cinta span:nth-of-type(3n+1) { color: var(--rojo); -webkit-text-stroke: 0; }
.cinta i { color: var(--oro); font-style: normal; font-size: clamp(1.2rem, 3vw, 2rem); }
.cinta:hover .cinta-pista { animation-play-state: paused; }
@keyframes corre { to { transform: translateX(-50%); } }

/* 4. Galería "Así llega tu pedido" */
.galeria { padding-bottom: 72px; }
.galeria-pista { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); }
.galeria-fila { display: flex; gap: 16px; width: max-content; list-style: none; padding: 0; animation: corre 80s linear infinite; }
.galeria-pista:hover .galeria-fila, .galeria-pista.quieta .galeria-fila { animation-play-state: paused; }
.galeria-fila li { width: clamp(210px, 24vw, 300px); aspect-ratio: 4 / 5; border-radius: var(--r2); overflow: hidden; background: var(--carbon-2); flex: none; }
.galeria-fila img { width: 100%; height: 100%; object-fit: cover; }
.galeria-pie { margin-top: 18px; display: flex; justify-content: flex-end; }

/* 5. Cifras reales */
.cifras { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 14px 48px; margin: -8px 0 34px; }
.cifras li { display: flex; flex-direction: column; gap: 4px; }
.cifras b { font-family: var(--tit); font-weight: 800; font-size: clamp(3rem, 8vw, 5rem); line-height: .9; color: var(--oro); font-variant-numeric: tabular-nums; }
.cifras li:last-child { flex-direction: column-reverse; }
.cifras span { color: var(--gris); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: .85rem; }
@media (max-width: 600px) { .cifras { gap: 12px 28px; } }

@media (prefers-reduced-motion: reduce) {
  .pal > span { transform: none; }
  .cinta-pista { animation: none; }
  .galeria-fila { animation: none; }
  .galeria-pista { overflow-x: auto; scroll-snap-type: x mandatory; -webkit-mask-image: none; mask-image: none; padding-inline: 16px; }
  .galeria-fila li { scroll-snap-align: start; }
  .galeria-fila li[aria-hidden] { display: none; }
}

/* ===== Portada nueva (diseño de Larry, 2026-10-24) ===== */
.hero .linea-oro { font-size: .78rem; font-weight: 700; letter-spacing: .28em; text-transform: uppercase; color: var(--oro); margin: 0 0 18px; max-width: none; }
@media (max-width: 860px) {
  /* Celular: texto arriba y la bandeja real abajo, a todo lo ancho */
  .hero { display: flex; flex-direction: column; align-items: stretch; min-height: 0; }
  .hero .wrap { display: contents; }
  .hero .wrap > * { margin-inline: 16px; }
  .hero .linea-oro { order: 1; margin-top: 26px; margin-bottom: 14px; font-size: .7rem; letter-spacing: .22em; }
  .hero h1 { order: 2; text-shadow: none; font-size: clamp(2.9rem, 14vw, 4.4rem); }
  .hero p:not(.linea-oro) { order: 3; }
  .hero .cta { order: 4; margin-bottom: 4px; position: relative; z-index: 3; }
  .hero picture { order: 5; position: relative; height: auto; aspect-ratio: 820 / 950; margin-top: -34px; }
  .hero picture img { position: absolute; inset: 0; object-position: center top; }
  .hero .datos { order: 6; margin-top: -40px; position: relative; z-index: 3; padding-bottom: 36px; }
  .hero::before { display: none; }
  /* La foto se funde con el negro arriba y abajo */
  .hero picture::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, var(--carbon) 0%, rgba(11,11,13,.55) 9%, transparent 24%, transparent 72%, rgba(11,11,13,.7) 88%, var(--carbon) 100%); }
  .hero { background: radial-gradient(120% 60% at 80% 8%, rgba(142,17,22,.35), transparent 60%), var(--carbon); }
}
/* Ficha: elegir alitas o boneless */
.opciones.tipo { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.opciones.tipo button { justify-content: center; min-height: 52px; font-family: var(--tit); font-weight: 800; font-size: 1.2rem; text-transform: uppercase; letter-spacing: .02em; }

/* Texto grande (letra del celular al 200 %): nada se sale a lo ancho. Con letra normal no cambia nada. */
.hd { flex-wrap: wrap; height: auto; min-height: 60px; }
.nav { min-width: 0; flex-wrap: wrap; }
.pal, .pal > span { max-width: 100%; overflow-wrap: anywhere; }
.familia > *, .familia .lado > *, .calc > * { min-width: 0; }
.calc .sug { flex-wrap: wrap; }
.calc .sug .btn { white-space: normal; flex: 0 1 auto; }
.barra .resumen { min-width: 0; overflow-wrap: anywhere; }

/* ===== Portada v3 (diseño de Larry, 2026-10-25): título en minúsculas gruesas, foto real retocada ===== */
.hero h1 { font-family: var(--ui); font-weight: 800; text-transform: none; letter-spacing: -.035em; line-height: .98; max-width: 11ch; font-size: clamp(3rem, min(6.4vw, 10vh), 5.6rem); }
.hero p:not(.linea-oro):not(.franja-oro) { max-width: 30ch; }
.hero .cta { align-items: center; }
.hero .cta .btn-rojo span { font-size: 1.15em; margin-left: 6px; transition: transform .25s var(--ease); }
.hero .cta .btn-rojo:hover span { transform: translateX(4px); }
.enlace-local { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 4px; color: #fff; font-weight: 600; }
.enlace-local .t { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }
.enlace-local span[aria-hidden] { font-size: 1.4em; line-height: 1; }
.enlace-local:hover { color: var(--oro); }
.hero p.franja-oro { display: flex; align-items: center; gap: 16px; margin: 28px 0 0; max-width: none; color: var(--oro); font-size: .72rem; font-weight: 700; letter-spacing: .26em; text-transform: uppercase; white-space: nowrap; }
.hero p.franja-oro::before, .hero p.franja-oro::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, rgba(217,164,65,.7)); }
.hero p.franja-oro::after { background: linear-gradient(90deg, rgba(217,164,65,.7), transparent); }
@media (min-width: 861px) {
  /* Compu: el plato a la derecha, fundido con el negro */
  .hero { background: radial-gradient(70% 60% at 75% 0%, rgba(142,17,22,.32), transparent 70%), var(--carbon); }
  .hero::before { display: none; }
  .hero picture { left: auto; width: 62%; }
  .hero picture img { object-position: center; -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 34%); mask-image: linear-gradient(90deg, transparent 0%, #000 34%); }
  .hero picture::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, var(--carbon) 0%, transparent 22%); }
  .hero p.franja-oro { max-width: 560px; margin-top: 30px; }
}
@media (max-width: 860px) {
  .hero h1 { font-size: clamp(2.6rem, 12.4vw, 3.9rem); }
  .hero p:not(.linea-oro):not(.franja-oro) { margin-top: 14px; }
  .hero .cta { flex-wrap: nowrap; gap: 18px; margin-top: 22px; }
  .hero .cta .btn-rojo { flex: 0 1 58%; }
  .hero .cta .enlace-local { flex: none; }
  .hero picture { aspect-ratio: 5 / 4; margin-top: 8px; }
  .hero picture img { object-position: center; }
  .hero picture::after { background: linear-gradient(180deg, var(--carbon) 0%, rgba(11,11,13,.35) 10%, transparent 22%, transparent 84%, var(--carbon) 100%); }
  .hero p.franja-oro { order: 6; margin: 6px 16px 30px; font-size: .62rem; letter-spacing: .2em; gap: 10px; }
  .hero .datos { display: none; }
}