/* ===================================================================
   LBBS by 74 — lbbsby74.mx
   Hoja de estilos principal
   =================================================================== */

/* ------------------------------ Fuentes ------------------------------ */
@font-face{
  font-family:'Chalet';
  src:url('../fonts/Chalet1970.ttf') format('truetype');
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Montserrat';
  src:url('../fonts/Montserrat-Light.ttf') format('truetype');
  font-weight:300; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Montserrat';
  src:url('../fonts/Montserrat-Regular.otf') format('opentype');
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Montserrat';
  src:url('../fonts/Montserrat-SemiBold.otf') format('opentype');
  font-weight:600; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Montserrat';
  src:url('../fonts/Montserrat-Bold.otf') format('opentype');
  font-weight:700; font-style:normal; font-display:swap;
}

/* ------------------------------ Variables ---------------------------- */
:root{
  --negro:#0a0908;
  --carbon:#111010;
  --humo:#191716;
  --blanco:#f7f4ef;
  --texto:#c8c2ba;
  --tenue:#8e867d;
  --oro:#e9a93c;
  --oro-claro:#f6cf6a;
  --oro-hondo:#c9821f;
  --linea:rgba(233,169,60,.20);
  --borde:rgba(255,255,255,.08);
  --max:1240px;
  --nav:84px;
  --grad-oro:linear-gradient(100deg,#c9821f 0%,#e9a93c 45%,#f6cf6a 100%);
}

/* ------------------------------- Base -------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:var(--nav); -webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--negro);
  color:var(--texto);
  font-family:'Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-weight:300;
  font-size:1rem;
  line-height:1.75;
  overflow-x:hidden;
}
img,video{max-width:100%; height:auto; display:block}
a{color:inherit; text-decoration:none}
button{font:inherit; color:inherit; background:none; border:0; cursor:pointer}
p{margin:0 0 1.1em}
::selection{background:var(--oro); color:#000}

.contenedor{width:min(100% - 2.5rem,var(--max)); margin-inline:auto}
.seccion{padding:clamp(4.5rem,9vw,8rem) 0; position:relative}
.seccion--carbon{background:var(--carbon)}
.seccion--humo{background:var(--humo)}

/* ----------------------------- Tipografia ---------------------------- */
.display{
  font-family:'Chalet','Montserrat',sans-serif;
  font-weight:400;
  color:var(--blanco);
  text-transform:uppercase;
  line-height:.94;
  letter-spacing:.005em;
  margin:0 0 1rem;
  font-size:clamp(2.1rem,5.4vw,4.4rem);
}
.display--xl{font-size:clamp(2.7rem,9vw,7rem)}
.display--sm{font-size:clamp(1.4rem,2.6vw,2rem)}
.oro{
  background:var(--grad-oro);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}
.rotulo{
  display:inline-flex; align-items:center; gap:.7rem;
  font-size:.7rem; font-weight:600; letter-spacing:.34em; text-transform:uppercase;
  color:var(--oro); margin-bottom:1.3rem;
}
.rotulo::before{content:''; width:34px; height:1px; background:var(--grad-oro)}
.entrada{max-width:62ch}
strong{color:var(--blanco); font-weight:600}

.encabezado{margin-bottom:clamp(2.5rem,5vw,4rem); max-width:60ch}
.encabezado--centro{margin-inline:auto; text-align:center}
.encabezado--centro .rotulo{justify-content:center}
.encabezado--centro .rotulo::after{content:''; width:34px; height:1px; background:var(--grad-oro)}

/* ------------------------------ Botones ------------------------------ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  padding:1.05rem 2.1rem; border-radius:2px;
  font-size:.74rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase;
  border:1px solid transparent; transition:.35s ease; white-space:nowrap;
}
.btn svg{width:17px; height:17px; fill:currentColor}
.btn--oro{background:var(--grad-oro); color:#14100a; box-shadow:0 10px 30px -14px rgba(233,169,60,.85)}
.btn--oro:hover{filter:brightness(1.12); transform:translateY(-2px)}
.btn--linea{border-color:rgba(247,244,239,.35); color:var(--blanco)}
.btn--linea:hover{border-color:var(--oro); color:var(--oro); transform:translateY(-2px)}

/* ---------------------------- Navegacion ----------------------------- */
.nav{
  position:fixed; inset:0 0 auto; z-index:80; height:var(--nav);
  display:flex; align-items:center;
  transition:background .4s ease,box-shadow .4s ease,height .4s ease;
}
.nav::after{content:''; position:absolute; inset:auto 0 0; height:1px; background:linear-gradient(90deg,transparent,var(--linea),transparent)}
.nav--solido{background:rgba(10,9,8,.93); backdrop-filter:blur(14px); box-shadow:0 12px 40px -22px #000; height:72px}
.nav__caja{display:flex; align-items:center; justify-content:space-between; gap:1.5rem; width:min(100% - 2.5rem,var(--max)); margin-inline:auto}
.nav__logo img{width:74px; height:auto; transition:width .4s ease}
.nav--solido .nav__logo img{width:62px}
.nav__menu{display:flex; align-items:center; gap:2.1rem}
.nav__link{
  position:relative; font-size:.72rem; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; color:var(--texto); padding:.4rem 0; transition:color .3s;
}
.nav__link::after{
  content:''; position:absolute; inset:auto 0 0; height:1px; background:var(--grad-oro);
  transform:scaleX(0); transform-origin:right; transition:transform .35s ease;
}
.nav__link:hover{color:var(--blanco)}
.nav__link:hover::after{transform:scaleX(1); transform-origin:left}
.nav__cta{padding:.85rem 1.5rem; font-size:.68rem}
.nav__burger{display:none; width:44px; height:44px; position:relative; z-index:90}
.nav__burger span{display:block; height:1.5px; width:26px; margin:6px auto; background:var(--blanco); transition:.3s ease}
.nav__burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.nav__burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav__burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}

/* -------------------------------- Hero -------------------------------- */
.hero{
  position:relative; min-height:100svh; display:flex; align-items:flex-end;
  padding:calc(var(--nav) + 3rem) 0 clamp(3rem,7vw,6rem); overflow:hidden;
}
.hero__fondo{position:absolute; inset:0; z-index:0; background:#0a0908}
.hero__fondo img{width:100%; height:100%; object-fit:cover; animation:zoomLento 24s ease-out forwards}
.hero__fondo video{width:100%; height:100%; object-fit:cover; object-position:center}
.hero__fondo::after{
  content:''; position:absolute; inset:0;
  background:
    linear-gradient(180deg,rgba(10,9,8,.86) 0%,rgba(10,9,8,.40) 35%,rgba(10,9,8,.94) 100%),
    radial-gradient(120% 90% at 20% 90%,rgba(10,9,8,.85),transparent 60%);
}
@keyframes zoomLento{from{transform:scale(1.12)}to{transform:scale(1)}}
.hero__caja{position:relative; z-index:2}
.hero__logo{width:clamp(120px,15vw,168px); margin-bottom:1.6rem; filter:drop-shadow(0 12px 34px rgba(0,0,0,.6))}
.hero .display{max-width:16ch}
.hero__texto{max-width:46ch; font-size:clamp(1rem,1.5vw,1.12rem); color:#ded8d0}
.hero__botones{display:flex; flex-wrap:wrap; gap:.9rem; margin-top:2rem}
.hero__meta{
  display:flex; flex-wrap:wrap; gap:.8rem 2.2rem; margin-top:2.6rem; padding-top:1.6rem;
  border-top:1px solid var(--borde); font-size:.7rem; letter-spacing:.24em; text-transform:uppercase; color:var(--tenue);
}
.hero__meta span{display:inline-flex; align-items:center; gap:.6rem}
.hero__meta span::before{content:''; width:5px; height:5px; border-radius:50%; background:var(--oro)}

/* Boton de sonido del video */
.sonido{
  position:absolute; z-index:3;
  top:calc(var(--nav) + 1.6rem); right:max(1.25rem,calc((100% - var(--max)) / 2));
  display:inline-flex; align-items:center; gap:.6rem;
  padding:.7rem 1.1rem; border:1px solid var(--borde); border-radius:40px;
  background:rgba(10,9,8,.55); backdrop-filter:blur(8px);
  font-size:.62rem; font-weight:600; letter-spacing:.24em; text-transform:uppercase;
  color:var(--texto); transition:.3s ease;
}
.sonido svg{width:17px; height:17px; stroke:var(--oro); fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.sonido:hover{border-color:var(--oro); color:var(--blanco); background:rgba(10,9,8,.8)}
.sonido[aria-pressed="true"]{border-color:var(--linea); color:var(--blanco)}
@media (max-width:560px){
  .sonido{padding:.6rem; border-radius:50%}
  .sonido__texto{display:none}
}

/* ------------------------------ Marquesina ---------------------------- */
.marquesina{
  background:var(--humo); border-block:1px solid var(--borde);
  overflow:hidden; padding:1.05rem 0;
}
.marquesina__pista{display:flex; width:max-content; animation:correr 40s linear infinite}
.marquesina:hover .marquesina__pista{animation-play-state:paused}
.marquesina__pista span{
  display:inline-flex; align-items:center; gap:2.4rem; padding-right:2.4rem;
  font-family:'Chalet','Montserrat',sans-serif; text-transform:uppercase;
  font-size:clamp(.95rem,1.7vw,1.3rem); letter-spacing:.14em; color:#6f675e; white-space:nowrap;
}
.marquesina__pista span::after{content:'\2726'; color:var(--oro); font-size:.7em}
@keyframes correr{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ------------------------------- Nosotros ----------------------------- */
.nosotros__grid{display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(2.5rem,6vw,5.5rem); align-items:center}
.collage{position:relative; padding-bottom:3.5rem}
.collage__a{width:88%; aspect-ratio:4/3; object-fit:cover; border:1px solid var(--borde)}
.collage__b{
  position:absolute; right:0; bottom:0; width:48%; aspect-ratio:3/4; object-fit:cover;
  border:6px solid var(--carbon); box-shadow:0 30px 60px -30px #000;
}
.collage__sello{
  position:absolute; left:0; bottom:1.2rem; background:var(--grad-oro); color:#14100a;
  padding:.85rem 1.3rem; text-align:center; box-shadow:0 20px 40px -22px rgba(0,0,0,.9);
}
.collage__sello strong{display:block; font-family:'Chalet',sans-serif; font-size:1.55rem; line-height:1; color:#14100a}
.collage__sello span{font-size:.6rem; letter-spacing:.28em; text-transform:uppercase; font-weight:600}
.pilares{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:2.4rem; background:var(--borde)}
.pilar{background:var(--carbon); padding:1.6rem 1.2rem}
.pilar svg{width:26px; height:26px; stroke:var(--oro); fill:none; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; margin-bottom:.8rem}
.pilar h3{margin:0 0 .3rem; font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; color:var(--blanco); font-weight:600}
.pilar p{margin:0; font-size:.86rem; line-height:1.55; color:var(--tenue)}

/* --------------------------------- Menu ------------------------------- */
.menu__cabeza{display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; flex-wrap:wrap; margin-bottom:2.5rem}
.menu__cabeza .encabezado{margin-bottom:0}
.rieles{display:flex; gap:.6rem}
.riel-btn{
  width:48px; height:48px; border:1px solid var(--borde); border-radius:50%;
  display:grid; place-items:center; transition:.3s ease;
}
.riel-btn svg{width:16px; height:16px; stroke:var(--blanco); fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.riel-btn:hover{border-color:var(--oro); background:rgba(233,169,60,.1)}
.riel{
  display:grid; grid-auto-flow:column; grid-auto-columns:minmax(260px,300px); gap:1.4rem;
  overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth;
  padding-bottom:1.4rem; scrollbar-width:thin; scrollbar-color:var(--oro-hondo) transparent;
}
.riel::-webkit-scrollbar{height:4px}
.riel::-webkit-scrollbar-thumb{background:var(--oro-hondo)}
.riel::-webkit-scrollbar-track{background:rgba(255,255,255,.05)}
.plato{scroll-snap-align:start; position:relative; border:1px solid var(--borde); background:#000; overflow:hidden}
.plato img{width:100%; aspect-ratio:3/4; object-fit:cover; transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.plato:hover img{transform:scale(1.05)}
.plato__pie{
  position:absolute; inset:auto 0 0; padding:2rem 1.2rem 1.1rem;
  background:linear-gradient(180deg,transparent,rgba(5,4,4,.94) 55%);
}
.plato__pie p{margin:0; font-size:.82rem; line-height:1.5; color:#ded8d0}
.plato__tipo{
  position:absolute; top:1rem; left:1rem; z-index:2;
  font-size:.58rem; letter-spacing:.24em; text-transform:uppercase; font-weight:600;
  color:var(--oro); border:1px solid var(--linea); padding:.32rem .7rem; background:rgba(10,9,8,.6);
}
.cartas{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin-top:3rem; background:var(--borde)}
.carta{
  display:flex; align-items:center; gap:1rem; padding:1.7rem 1.5rem;
  background:var(--negro); transition:.35s ease;
}
.carta:hover{background:#171412}
.carta svg{width:26px; height:26px; stroke:var(--oro); fill:none; stroke-width:1.3; stroke-linecap:round; stroke-linejoin:round; flex:none}
.carta strong{display:block; font-size:.86rem; letter-spacing:.06em; color:var(--blanco)}
.carta span{font-size:.64rem; letter-spacing:.24em; text-transform:uppercase; color:var(--tenue)}

/* ------------------------------ Promociones --------------------------- */
.promos{display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(1.5rem,3vw,2.5rem)}
.promo{
  display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1fr);
  gap:1.6rem; align-items:center;
  border:1px solid var(--borde); background:var(--carbon); padding:1.4rem;
  transition:border-color .35s ease,transform .35s ease;
}
.promo:hover{border-color:var(--linea); transform:translateY(-3px)}
.promo__foto{background:#000; border:1px solid var(--borde)}
.promo__foto img{width:100%; aspect-ratio:4/5; object-fit:contain}
.promo__texto h3{margin:0 0 .8rem}
.promo__texto p{font-size:.92rem; margin-bottom:1rem}
.promo__reglas{list-style:none; margin:0 0 1.4rem; padding:0; display:grid; gap:.45rem}
.promo__reglas li{
  position:relative; padding-left:1.2rem; font-size:.82rem; line-height:1.5; color:var(--tenue);
}
.promo__reglas li::before{
  content:''; position:absolute; left:0; top:.55em; width:6px; height:6px;
  border:1px solid var(--oro); transform:rotate(45deg);
}
.promo__texto .btn{padding:.85rem 1.5rem; font-size:.66rem}

@media (max-width:1100px){
  .promos{grid-template-columns:1fr}
}
@media (max-width:620px){
  .promo{grid-template-columns:1fr; gap:1.2rem}
  .promo__foto img{aspect-ratio:1/1}
}

/* -------------------------------- Agenda ------------------------------ */
.agenda__lista{border-top:1px solid var(--borde)}
.fila{
  display:grid; grid-template-columns:minmax(160px,.7fr) 2fr minmax(180px,.8fr);
  gap:1.5rem; align-items:center; padding:1.7rem 0; border-bottom:1px solid var(--borde);
  transition:background .35s ease,padding-left .35s ease;
}
.fila:hover{background:rgba(233,169,60,.045); padding-left:1rem}
.fila__dia{font-family:'Chalet',sans-serif; text-transform:uppercase; font-size:clamp(1.25rem,2.4vw,1.8rem); color:var(--blanco); line-height:1}
.fila__mes{font-size:.55em; letter-spacing:.18em; color:var(--oro)}
.fila__que{font-size:.95rem}
.fila__que strong{font-size:1.05rem; letter-spacing:.01em}
.agenda__nota{
  margin:2.2rem 0 0; font-size:.86rem; color:var(--tenue);
}
.agenda__nota a{color:var(--oro); border-bottom:1px solid var(--linea)}
.agenda__nota a:hover{color:var(--oro-claro)}
.fila__que p{margin:0}
.fila__hora{text-align:right; font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; color:var(--oro)}
.fila--cerrado .fila__dia,.fila--cerrado .fila__que strong,.fila--cerrado .fila__hora{color:var(--tenue)}

/* -------------------------------- Galeria ----------------------------- */
.galeria__grid{display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:190px; gap:12px}
.foto{position:relative; overflow:hidden; border:1px solid var(--borde); padding:0; background:#000}
.foto img{width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.2,.7,.3,1),opacity .4s}
.foto:hover img{transform:scale(1.06); opacity:.85}
.foto::after{
  content:'+'; position:absolute; inset:auto 1rem 1rem auto; width:34px; height:34px;
  display:grid; place-items:center; color:var(--oro); border:1px solid var(--linea);
  background:rgba(10,9,8,.6); opacity:0; transform:translateY(8px); transition:.35s ease;
}
.foto:hover::after{opacity:1; transform:translateY(0)}
.foto--alta{grid-row:span 2}
.foto--ancha{grid-column:span 2}

/* ------------------------------- Ubicacion ---------------------------- */
.ubica__grid{display:grid; grid-template-columns:1fr 1.15fr; gap:clamp(2.5rem,5vw,4.5rem)}
.datos{display:grid; gap:1.6rem}
.dato{display:flex; gap:1rem}
.dato svg{width:22px; height:22px; stroke:var(--oro); fill:none; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; flex:none; margin-top:.35rem}
.dato strong{display:block; font-size:.66rem; letter-spacing:.24em; text-transform:uppercase; color:var(--tenue); font-weight:600; margin-bottom:.3rem}
.dato a,.dato p{color:var(--blanco); font-weight:300; margin:0; line-height:1.7}
.dato a:hover{color:var(--oro)}
.mapa{width:100%; height:340px; border:1px solid var(--borde); filter:grayscale(1) contrast(1.05) brightness(.85); transition:filter .5s}
.mapa:hover{filter:none}
.video-caja{margin-top:1.2rem; border:1px solid var(--borde)}
.video-caja video{width:100%; aspect-ratio:16/9; object-fit:cover; background:#000}
.video-caja figcaption{padding:.9rem 1.1rem; font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--tenue); border-top:1px solid var(--borde)}

/* --------------------------------- CTA -------------------------------- */
.cta{position:relative; padding:clamp(5rem,10vw,9rem) 0; text-align:center; overflow:hidden}
.cta__fondo{position:absolute; inset:0}
.cta__fondo img{width:100%; height:100%; object-fit:cover}
.cta__fondo::after{content:''; position:absolute; inset:0; background:rgba(8,7,6,.82)}
.cta .contenedor{position:relative; z-index:2}
.cta .entrada{margin-inline:auto}
.cta .btn{margin-top:.8rem}

/* --------------------------------- Pie -------------------------------- */
.pie{background:var(--carbon); padding:clamp(3.5rem,7vw,5.5rem) 0 2rem; border-top:1px solid var(--borde)}
.pie__grid{display:grid; grid-template-columns:1.4fr 1fr 1.2fr; gap:clamp(2rem,5vw,4rem)}
.pie__logo{width:132px; margin-bottom:1.2rem}
.pie p{font-size:.9rem; color:var(--tenue); max-width:38ch}
.pie h4{
  margin:0 0 1.2rem; font-size:.68rem; letter-spacing:.26em; text-transform:uppercase;
  color:var(--oro); font-weight:600;
}
.pie__links{display:grid; gap:.65rem; font-size:.9rem}
.pie__links a:hover{color:var(--oro)}
.horario{display:grid; gap:.45rem; font-size:.85rem}
.horario div{display:flex; justify-content:space-between; gap:1rem; border-bottom:1px dashed rgba(255,255,255,.07); padding-bottom:.45rem}
.horario span:last-child{color:var(--blanco)}
.redes{display:flex; gap:.6rem; margin-top:1.4rem}
.redes a{width:40px; height:40px; border:1px solid var(--borde); display:grid; place-items:center; transition:.3s ease}
.redes a svg{width:16px; height:16px; fill:var(--texto); transition:.3s}
.redes a:hover{border-color:var(--oro); background:rgba(233,169,60,.1)}
.redes a:hover svg{fill:var(--oro)}
.pie__abajo{
  margin-top:3rem; padding-top:1.5rem; border-top:1px solid var(--borde);
  display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  font-size:.75rem; color:var(--tenue);
}

/* ------------------------- Flotante y lightbox ------------------------ */
.flotante{
  position:fixed; right:18px; bottom:18px; z-index:70;
  width:56px; height:56px; border-radius:50%; display:grid; place-items:center;
  background:#25d366; box-shadow:0 14px 34px -12px rgba(37,211,102,.75); transition:.3s ease;
}
.flotante svg{width:28px; height:28px; fill:#fff}
.flotante:hover{transform:scale(1.08)}
.lightbox{
  position:fixed; inset:0; z-index:100; display:none; place-items:center;
  background:rgba(6,5,5,.96); padding:clamp(1rem,5vw,3rem);
}
.lightbox.abierto{display:grid}
.lightbox img{max-width:min(1100px,92vw); max-height:86vh; object-fit:contain; border:1px solid var(--borde)}
.lightbox__cerrar{position:absolute; top:1rem; right:1.4rem; font-size:2.4rem; line-height:1; color:var(--blanco)}
.lightbox__nav{
  position:absolute; top:50%; transform:translateY(-50%); width:54px; height:54px;
  font-size:2rem; color:var(--blanco); border:1px solid var(--borde); background:rgba(10,9,8,.6);
}
.lightbox__nav:hover{border-color:var(--oro); color:var(--oro)}
.lightbox__ant{left:1rem}
.lightbox__sig{right:1rem}

/* ------------------------------ Animacion ----------------------------- */
.revelar{opacity:0; transform:translateY(26px); transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.3,1)}
.revelar.visible{opacity:1; transform:none}

/* ----------------------------- Responsivo ----------------------------- */
@media (max-width:1024px){
  .nosotros__grid,.ubica__grid{grid-template-columns:1fr}
  .cartas{grid-template-columns:repeat(2,1fr)}
  .pie__grid{grid-template-columns:1fr 1fr}
  .galeria__grid{grid-template-columns:repeat(2,1fr); grid-auto-rows:170px}
}
@media (max-width:860px){
  .nav__burger{display:block}
  .nav__menu{
    position:fixed; inset:0; flex-direction:column; justify-content:center; gap:1.8rem;
    background:rgba(8,7,6,.98); backdrop-filter:blur(10px);
    transform:translateX(100%); transition:transform .45s cubic-bezier(.2,.7,.3,1);
  }
  .nav__menu.abierto{transform:none}
  .nav__link{font-size:1rem; letter-spacing:.24em}
  .fila{grid-template-columns:1fr; gap:.5rem; padding:1.4rem 0}
  .fila__hora{text-align:left}
  .pilares{grid-template-columns:1fr}
  .pie__grid{grid-template-columns:1fr}
  .collage{padding-bottom:2.5rem}
  .rieles{display:none}
}
@media (max-width:560px){
  .cartas{grid-template-columns:1fr}
  .hero__botones .btn{flex:1 1 100%}
  .mapa{height:260px}
  .galeria__grid{grid-auto-rows:150px}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important; transition:none !important; scroll-behavior:auto}
  .revelar{opacity:1; transform:none}
}