/* Layout: póster de taquería — rayos sunburst en el hero, azulejos como separadores, fotos pegadas como polaroids.
   Look único y deliberado (papel crema del sistema Tacos de la Cruz), igual en tema claro y oscuro. */
:root{
  --azul:#0e356e; --azul-noche:#0a2650; --azul-200:#c9d6ea;
  --oro:#fab149; --oro-200:#fde3b8;
  --rojo:#e53135; --rojo-700:#c8242a; --vino:#8a2129; --ladrillo:#d95032;
  --menta:#93cbc3; --menta-200:#dcefeb;
  --crema:#f4eddf; --papel:#fffaf1; --blanco:#ffffff;
  --tinta:#1f1b18; --tinta-suave:#5a514a; --linea:#e3d7c2; --azulejo-negro:#191512;
  --font-rotulo:"Sancreek","Rye",Georgia,serif;
  --font-pincel:"Permanent Marker","Comic Sans MS",cursive;
  --font-letrero:"Bebas Neue","Oswald","Arial Narrow",sans-serif;
  --font-texto:"Barlow","Helvetica Neue",Arial,sans-serif;
  --sombra-azul:5px 5px 0 var(--azul);
  --sombra-rotulo:4px 4px 0 var(--oro);
  --gutter-l:max(16px, env(safe-area-inset-left, 0px));
  --gutter-r:max(16px, env(safe-area-inset-right, 0px));
  color-scheme:light;
}
*{box-sizing:border-box}
main{overflow-x:clip}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{background:var(--crema);color:var(--tinta);font-family:var(--font-texto);font-size:17px;line-height:1.55;margin:0;overflow-x:hidden}
img{max-width:100%;display:block;height:auto}
a{color:inherit}
:focus-visible{outline:3px solid var(--azul);outline-offset:3px}
.wrap{max-width:1200px;margin:0 auto;padding-left:var(--gutter-l);padding-right:var(--gutter-r)}
h1,h2,h3{text-wrap:balance;margin:0}
p{margin:0}

/* ---------- piezas de marca ---------- */
.rotulo{font-family:var(--font-rotulo);font-weight:400;color:var(--rojo);text-shadow:.06em .06em 0 var(--oro);line-height:.95}
.pincel{font-family:var(--font-pincel);display:inline-block;line-height:1;
  background:linear-gradient(to bottom,var(--ladrillo) 0 54%,var(--vino) 54% 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(.05em .04em 0 var(--oro));transform:rotate(-3deg)}
.letrero{font-family:var(--font-letrero);font-weight:400;text-transform:uppercase;line-height:1;letter-spacing:.01em}
.eyebrow{font-family:var(--font-letrero);font-size:16px;letter-spacing:.2em;text-transform:uppercase;color:var(--rojo-700)}
.ornamento{display:inline-flex;align-items:center;gap:14px;font-family:var(--font-letrero);letter-spacing:.32em;text-transform:uppercase;color:var(--azul);font-size:18px;line-height:1}
.ornamento::before,.ornamento::after{content:"";width:16px;height:8px;background:var(--rojo);clip-path:polygon(0 50%,50% 0,100% 50%,50% 100%);flex:none}
.estrellas{color:var(--vino);letter-spacing:.3em;font-size:16px;line-height:1}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;white-space:nowrap;font-family:var(--font-letrero);font-size:21px;letter-spacing:.12em;line-height:1;text-transform:uppercase;padding:15px 26px 13px;border-radius:4px;border:2px solid var(--rojo-700);background:var(--rojo-700);color:var(--blanco);text-decoration:none;transition:transform .12s ease,box-shadow .12s ease}
.btn:hover{transform:translate(-2px,-2px);box-shadow:var(--sombra-rotulo)}
.btn--azul{background:transparent;color:var(--azul);border-color:var(--azul)}
.btn--azul:hover{background:var(--azul);color:var(--blanco)}
.btn--oro{background:var(--oro);border-color:var(--oro);color:var(--tinta)}
.btn--oro:hover{box-shadow:5px 5px 0 var(--rojo)}
.btn--sm{font-size:17px;padding:11px 16px 9px}
@media (prefers-reduced-motion: reduce){.btn{transition:none}.btn:hover{transform:none}}
.chip{display:inline-flex;align-items:center;padding:6px 13px 5px;border-radius:999px;font-family:var(--font-letrero);font-size:15px;letter-spacing:.12em;text-transform:uppercase;background:var(--azul-200);color:var(--azul)}
.chip--oro{background:var(--oro-200);color:var(--tinta)}
.chip--rojo{background:var(--rojo-700);color:var(--blanco)}

.sunburst{position:relative;overflow:hidden;isolation:isolate;background:var(--crema)}
.sunburst::before{content:"";position:absolute;inset:-60%;z-index:-1;
  background:repeating-conic-gradient(from 0deg at 50% 50%,var(--menta) 0deg 2.2deg,transparent 2.2deg 7deg);
  -webkit-mask:radial-gradient(circle at 50% 50%,transparent 0 16%,#000 40%);mask:radial-gradient(circle at 50% 50%,transparent 0 16%,#000 40%);opacity:.75}
.azulejos-delgada{height:18px;background:repeating-linear-gradient(90deg,var(--oro) 0 40px,var(--blanco) 40px 42px)}
.azulejos{height:88px;background:
  repeating-linear-gradient(90deg,var(--oro) 0 40px,var(--blanco) 40px 42px) 0 2px/100% 36px no-repeat,
  repeating-linear-gradient(90deg,var(--azulejo-negro) 0 40px,var(--blanco) 40px 42px) 0 40px/100% 48px no-repeat,var(--blanco)}

/* ---------- ticker ---------- */
.ticker{background:var(--azul);color:var(--crema);overflow:hidden;white-space:nowrap;font-family:var(--font-letrero);font-size:16px;letter-spacing:.16em;text-transform:uppercase}
.ticker__track{display:inline-flex;gap:30px;align-items:center;padding:9px 0 8px;animation:tick 38s linear infinite}
.ticker b{color:var(--oro);font-weight:400}
.ticker i{color:var(--rojo);font-style:normal;font-size:11px}
@keyframes tick{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){.ticker__track{animation:none}}

/* ---------- nav ---------- */
header.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--crema);border-bottom:2px solid var(--linea)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--crema)}
.nav__in{display:flex;align-items:center;gap:28px;padding-block:12px}
.nav__logo img{height:46px;width:auto}
.nav__links{display:flex;gap:24px;margin:0 0 0 auto;padding:0;list-style:none}
.nav__links a{font-family:var(--font-letrero);font-size:20px;letter-spacing:.12em;text-transform:uppercase;color:var(--azul);text-decoration:none;padding:4px 0;border-bottom:3px solid transparent}
.nav__links a:hover{border-bottom-color:var(--rojo)}
.nav__toggle{display:none;flex:none;width:46px;height:46px;align-items:center;justify-content:center;padding:0;border:2px solid var(--azul);border-radius:4px;background:transparent;color:var(--azul);cursor:pointer}
.nav__toggle span,.nav__toggle span::before,.nav__toggle span::after{display:block;width:22px;height:3px;border-radius:2px;background:currentColor;transition:transform .2s ease,background .2s ease}
.nav__toggle span{position:relative}
.nav__toggle span::before,.nav__toggle span::after{content:"";position:absolute;left:0}
.nav__toggle span::before{top:-7px}.nav__toggle span::after{top:7px}
.nav.abierto .nav__toggle{background:var(--azul);color:var(--crema)}
.nav.abierto .nav__toggle span{background:transparent}
.nav.abierto .nav__toggle span::before{transform:translateY(7px) rotate(45deg)}
.nav.abierto .nav__toggle span::after{transform:translateY(-7px) rotate(-45deg)}
@media (prefers-reduced-motion: reduce){.nav__toggle span,.nav__toggle span::before,.nav__toggle span::after{transition:none}}
@media (max-width:860px){
  .nav__in{gap:12px}
  .nav__in .btn{margin-left:auto}
  .nav__logo img{height:38px}
  .nav__toggle{display:inline-flex}
  .nav__links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;margin:0;background:var(--crema);border-bottom:2px solid var(--linea);box-shadow:0 10px 0 rgba(14,53,110,.08);padding:6px var(--gutter-r) 14px var(--gutter-l)}
  .nav.abierto .nav__links{display:flex}
  .nav__links li{border-top:2px dashed var(--linea)}
  .nav__links li:first-child{border-top:0}
  .nav__links a{display:block;font-size:24px;padding:14px 0 12px;border-bottom:0}
  .nav__links a:hover{color:var(--rojo-700)}
}
@media (max-width:400px){.nav__logo img{height:32px}.nav__in .btn--sm{font-size:15px;padding:10px 12px 8px}}

/* ---------- hero ---------- */
.hero__in{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;padding-block:72px 80px}
.hero h1{font-size:clamp(60px,9vw,112px);margin:20px 0 20px}
.hero .lead{font-size:20px;line-height:1.5;max-width:30em;margin-bottom:30px}
.hero__ctas{display:flex;flex-wrap:wrap;gap:14px}
.hero__nota{margin-top:22px;font-size:14px;color:var(--tinta-suave);font-weight:500}
.collage{position:relative;min-height:520px}
.foto{background:var(--papel);padding:10px 10px 0;border:2px solid var(--linea);border-radius:8px;box-shadow:var(--sombra-azul)}
.foto img{border-radius:4px;width:100%;object-fit:cover}
.foto figcaption{font-family:var(--font-pincel);color:var(--azul);font-size:19px;padding:8px 4px 10px;line-height:1.1}
.collage .f1{position:absolute;right:0;top:0;width:78%;transform:rotate(2.5deg)}
.collage .f1 img{aspect-ratio:1/1}
.collage .f2{position:absolute;left:0;bottom:0;width:48%;transform:rotate(-4deg)}
.collage .f2 img{aspect-ratio:4/5}
.sello{position:absolute;right:6%;bottom:2%;width:118px;height:118px;border-radius:999px;background:var(--rojo);color:var(--blanco);display:grid;place-items:center;text-align:center;box-shadow:var(--sombra-azul);font-family:var(--font-letrero);letter-spacing:.1em;line-height:1;transform:rotate(-8deg);outline:2px dashed var(--oro);outline-offset:-9px}
.sello b{display:block;font-family:var(--font-rotulo);font-weight:400;font-size:33px;letter-spacing:0;color:var(--oro);margin:3px 0}
.sello span{font-size:13px}
@media (max-width:860px){
  .hero__in{grid-template-columns:1fr;padding-block:48px 56px;gap:36px}
  .collage{min-height:0;aspect-ratio:1/1.05;max-width:520px;width:100%;margin:0 auto}
  .sello{width:96px;height:96px}.sello b{font-size:26px}
}

/* ---------- secciones ---------- */
section{padding-block:96px}
@media (max-width:860px){section{padding-block:64px}}
.sec-head{display:grid;gap:12px;margin-bottom:44px;max-width:640px}
.sec-head h2{font-size:clamp(40px,5vw,56px);color:var(--tinta)}
.sec-head p{color:var(--tinta-suave);font-size:18px}
.sec-head--centro{text-align:center;margin-left:auto;margin-right:auto;justify-items:center}

/* menú */
.menu-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.card{background:var(--papel);border:2px solid var(--linea);border-radius:8px;padding:12px 12px 18px;box-shadow:var(--sombra-azul);display:flex;flex-direction:column;gap:8px;min-width:0}
.card:nth-child(1){transform:rotate(-1.6deg)}.card:nth-child(4){transform:rotate(1.6deg)}
.card img{aspect-ratio:4/3;object-fit:cover;border-radius:4px;width:100%}
.card h3{font-family:var(--font-letrero);font-weight:400;font-size:30px;letter-spacing:.02em;color:var(--azul);text-transform:uppercase;line-height:1.05;margin-top:8px}
.card p{font-size:15px;line-height:1.45;color:var(--tinta-suave)}
.card .chip{align-self:flex-start;margin-top:auto}
@media (max-width:1000px){.menu-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.menu-grid{grid-template-columns:1fr}.card:nth-child(n){transform:none}}
.menu-mas{display:grid;justify-items:center;gap:18px;text-align:center;margin-top:52px}
.menu-mas p{color:var(--tinta-suave);font-size:18px;max-width:34em}
@media (max-width:420px){.menu-mas .btn{white-space:normal}}

/* trompo / salsas */
.trompo{background:var(--azul);color:var(--crema)}
.trompo__in{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.trompo .eyebrow{color:var(--oro)}
.trompo h2{font-size:clamp(44px,5.5vw,68px);color:var(--oro);text-shadow:.06em .06em 0 var(--rojo);font-family:var(--font-rotulo);font-weight:400;line-height:.98;margin:12px 0 20px}
.trompo p{font-size:18px;max-width:32em;margin-bottom:18px}
.salsas-lista{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 0;padding:0;list-style:none}
.salsas-lista li{font-family:var(--font-letrero);font-size:17px;letter-spacing:.12em;text-transform:uppercase;padding:7px 14px 5px;border:2px solid var(--oro);border-radius:999px;color:var(--crema)}
.trompo__fotos{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.trompo__fotos .foto{box-shadow:5px 5px 0 var(--oro);border-color:var(--azul-noche)}
.trompo__fotos .foto:first-child{grid-column:1/-1;transform:rotate(-1.5deg)}
.trompo__fotos .foto:first-child img{aspect-ratio:16/10}
.trompo__fotos .foto img{aspect-ratio:1/1}
.trompo__fotos .foto:nth-child(3){transform:rotate(2deg)}
@media (max-width:860px){.trompo__in{grid-template-columns:1fr;gap:40px}}

/* promos */
.promos-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.promo{border-radius:16px;padding:44px 28px 30px;text-align:center;border-bottom:10px solid var(--vino);display:grid;justify-items:center;gap:6px;min-width:0}
.promo--blanco{--fondo:var(--blanco)}
.promo .letrero{font-size:clamp(30px,3.6vw,42px)}
.promo .pincel{font-size:clamp(56px,7vw,84px);margin:4px 0}
.promo .pincel--num{font-size:clamp(64px,8vw,96px)}
.promo .estrellas{margin:12px 0 4px}
.promo__cond{font-family:var(--font-letrero);font-size:20px;letter-spacing:.06em;text-transform:uppercase}
.promo__legal{font-size:13px;line-height:1.4;font-weight:500;color:var(--tinta-suave);max-width:28em;margin-top:8px}
.promo.sunburst::before{inset:-40%}
@media (max-width:860px){.promos-grid{grid-template-columns:1fr}}

/* el lugar */
.lugar{background:var(--papel);border-top:2px solid var(--linea);border-bottom:2px solid var(--linea)}
.mosaico{display:grid;grid-template-columns:repeat(12,1fr);gap:22px;align-items:start}
.mosaico .foto:nth-child(1){grid-column:1/6;transform:rotate(-1.5deg)}
.mosaico .foto:nth-child(2){grid-column:6/10;margin-top:48px;transform:rotate(1.2deg)}
.mosaico .foto:nth-child(3){grid-column:10/13;transform:rotate(-1deg)}
.mosaico .foto:nth-child(4){grid-column:2/7;margin-top:-30px;transform:rotate(1.4deg)}
.mosaico .foto:nth-child(5){grid-column:7/12;margin-top:8px;transform:rotate(-1.2deg)}
.mosaico .foto img{aspect-ratio:4/5}
.mosaico .foto:nth-child(4) img,.mosaico .foto:nth-child(5) img{aspect-ratio:1/1}
@media (max-width:860px){
  .mosaico{grid-template-columns:1fr 1fr;gap:18px}
  .mosaico .foto:nth-child(n){grid-column:auto;margin-top:0;transform:none}
  .mosaico .foto:nth-child(1){grid-column:1/-1}
  .mosaico .foto:nth-child(1) img{aspect-ratio:4/3}
}

/* antojo */
.antojo{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.antojo img{aspect-ratio:1/1;object-fit:cover;border-radius:8px;width:100%}
@media (max-width:640px){.antojo{grid-template-columns:1fr 1fr}.antojo img:last-child{grid-column:1/-1;aspect-ratio:16/10}}

/* visítanos */
.visita__in{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.visita h2{font-size:clamp(52px,7vw,88px);margin:16px 0 22px}
.datos{display:grid;gap:18px;margin:6px 0 30px}
.dato{display:grid;grid-template-columns:130px 1fr;gap:16px;align-items:baseline;border-top:2px dashed var(--linea);padding-top:14px}
.dato dt{font-family:var(--font-letrero);font-size:18px;letter-spacing:.16em;text-transform:uppercase;color:var(--rojo-700)}
.dato dd{margin:0;font-weight:600;font-size:18px;min-width:0}
.dato dd small{display:block;font-weight:500;font-size:14px;color:var(--tinta-suave)}
.visita .foto{transform:rotate(1.8deg)}
.visita .foto img{aspect-ratio:4/5}
@media (max-width:860px){.visita__in{grid-template-columns:1fr}.dato{grid-template-columns:1fr;gap:4px}}

.horario{border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:17px}
.horario th{text-align:left;font-weight:600;padding:2px 18px 2px 0;white-space:nowrap}
.horario td{font-weight:500;color:var(--tinta-suave);padding:2px 0}
.horario tr.hoy th,.horario tr.hoy td{color:var(--rojo-700);font-weight:700}
.tel{font-weight:700;text-decoration-color:var(--oro);text-underline-offset:3px}
/* footer */
footer{background:var(--azul-noche);color:var(--crema)}
.foot__in{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;padding-block:52px 36px}
.foot__logo{background:var(--crema);padding:12px 16px;border-radius:8px;display:inline-block}
.foot__logo img{height:44px;width:auto}
footer h4{font-family:var(--font-letrero);font-weight:400;font-size:20px;letter-spacing:.14em;color:var(--oro);margin:0 0 12px;text-transform:uppercase}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:16px}
footer a{color:var(--crema);text-decoration-color:var(--oro);text-underline-offset:3px}
.foot__bar{border-top:1px solid var(--azul);padding-block:16px;font-size:13px;color:var(--azul-200);display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}
@media (max-width:860px){.foot__in{grid-template-columns:1fr 1fr}.foot__in>div:first-child{grid-column:1/-1}}

/* ---------- página del menú (menu.html) ---------- */
.carta-hero{padding-block:64px 56px;text-align:center}
.carta-hero .wrap{display:grid;justify-items:center;gap:18px}
.carta-hero h1{font-size:clamp(64px,10vw,120px)}
.carta-hero .lead{font-size:19px;max-width:32em;color:var(--tinta-suave)}
.carta-fotos{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:760px;width:100%;margin-top:18px}
.carta-fotos .foto img{aspect-ratio:1/1}
.carta-fotos .foto:nth-child(1){transform:rotate(-2.5deg)}
.carta-fotos .foto:nth-child(3){transform:rotate(2.5deg)}
.carta-indice{position:sticky;top:calc(env(safe-area-inset-top,0px) + 72px);z-index:10;background:var(--azul);border-block:2px solid var(--azul-noche)}
.carta-indice ul{display:flex;gap:8px;overflow-x:auto;margin:0;padding:10px var(--gutter-r) 10px var(--gutter-l);list-style:none;scrollbar-width:none}
.carta-indice ul::-webkit-scrollbar{display:none}
.carta-indice a{display:block;white-space:nowrap;font-family:var(--font-letrero);font-size:17px;letter-spacing:.12em;text-transform:uppercase;color:var(--crema);text-decoration:none;padding:6px 13px 4px;border:2px solid var(--oro);border-radius:999px}
.carta-indice a:hover{background:var(--oro);color:var(--tinta)}
@media (max-width:860px){.carta-indice{top:calc(env(safe-area-inset-top,0px) + 64px)}}
.carta{padding-block:64px 80px}
.carta + .carta{padding-top:0}
.carta__titulo{display:flex;justify-content:center;margin-bottom:40px}
.carta__titulo h2{font-size:clamp(44px,6vw,72px)}
.carta__cols{columns:2;column-gap:32px}
@media (max-width:860px){.carta__cols{columns:1}}
.panel{break-inside:avoid;background:var(--papel);border:2px solid var(--linea);border-radius:8px;box-shadow:var(--sombra-azul);padding:26px 26px 22px;margin-bottom:32px;scroll-margin-top:150px}
.panel h3{font-family:var(--font-letrero);font-weight:400;font-size:36px;letter-spacing:.04em;text-transform:uppercase;color:var(--azul);line-height:1;margin-bottom:4px}
.panel__nota{font-size:15px;color:var(--tinta-suave);margin:6px 0 4px}
.panel h4{font-family:var(--font-letrero);font-weight:400;font-size:22px;letter-spacing:.12em;text-transform:uppercase;color:var(--rojo-700);margin:18px 0 0}
.platos{list-style:none;margin:10px 0 0;padding:0}
.plato{padding:9px 0 8px;border-top:2px dashed var(--linea)}
.plato:first-child{border-top:0}
.plato__fila{display:flex;align-items:baseline;gap:10px}
.plato__nombre{font-weight:700;font-size:17px}
.plato__nombre small{font-weight:500;font-size:13px;color:var(--tinta-suave);margin-left:4px;white-space:nowrap}
.plato__fila::after{content:"";order:1;flex:1;min-width:16px;border-bottom:2px dotted var(--azul-200);transform:translateY(-4px)}
.plato__precio{order:2;font-family:var(--font-letrero);font-size:24px;letter-spacing:.04em;color:var(--rojo-700);line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}
.plato p{font-size:15px;line-height:1.45;color:var(--tinta-suave);margin-top:3px;max-width:34em}
.plato--extra .plato__nombre{font-weight:600;color:var(--tinta-suave)}
.plato--extra .plato__precio{font-size:21px;color:var(--azul)}
.panel--estrella{background:var(--azul);border-color:var(--azul-noche);box-shadow:var(--sombra-rotulo);color:var(--crema)}
.panel--estrella h3{color:var(--oro)}
.panel--estrella .plato{border-color:rgba(255,250,241,.18)}
.panel--estrella .plato p,.panel--estrella .panel__nota{color:var(--azul-200)}
.panel--estrella .plato__precio{color:var(--oro)}
.panel--estrella .plato__fila::after{border-color:rgba(250,177,73,.45)}
.panel--promo{text-align:center;display:grid;justify-items:center;gap:6px}
.panel--promo .pincel{font-size:56px;margin:4px 0}
.panel .promo__legal{margin-top:6px}
.cilantro{font-family:var(--font-pincel);color:var(--rojo-700);font-size:clamp(26px,3.4vw,36px);line-height:1.15;text-align:center;max-width:16em;margin:12px auto 0;transform:rotate(-2deg)}
.carta-pie{display:grid;justify-items:center;gap:18px;text-align:center;padding-top:16px}
.carta-pie p{font-size:15px;color:var(--tinta-suave);max-width:36em}