/* =============================================================
   La Villa Restaurant | Tex-Mex Bar & Grill
   Core design system — handcrafted, vanilla CSS
   Palette: warm cream, charcoal, wood, mexican red/green,
   warm orange, gold. Signature: papel picado banner.
   ============================================================= */

/* ---------- Design tokens ---------- */
:root{
  /* Brand palette */
  --char:        #1c1512;   /* warm charcoal / near-black */
  --char-2:      #271d18;   /* raised charcoal */
  --wood:        #6e3c20;   /* rich wood */
  --wood-deep:   #532b16;
  --cream:       #fbf3e3;   /* warm cream page bg */
  --cream-2:     #f4e9d3;   /* deeper cream / cards */
  --paper:       #fffaf1;   /* lightest surface */
  --rojo:        #c2102e;   /* mexican red */
  --rojo-deep:   #97001f;
  --verde:       #0e7c42;   /* mexican green */
  --verde-deep:  #0a5e32;
  --naranja:     #e97724;   /* warm orange */
  --gold:        #c99a3b;   /* dorado */
  --gold-soft:   #e4c266;
  --morado:      #6b2a86;   /* elegant purple (events / quinceañera) */
  --morado-deep: #45184f;
  --morado-soft: #9a55b8;

  --ink:         #2a1e18;   /* body text on cream */
  --ink-soft:    #6a564b;   /* muted text on cream */
  --on-dark:     #f6ead4;   /* text on charcoal */
  --on-dark-soft:#c9b9a3;

  /* Effects */
  --ember: linear-gradient(135deg, var(--naranja) 0%, var(--rojo) 100%);
  --ember-soft: linear-gradient(135deg, #f08a3a 0%, #cf2a3f 100%);
  --gild: linear-gradient(135deg, var(--gold-soft), var(--gold));
  --shadow-sm: 0 2px 8px rgba(40,20,10,.10);
  --shadow:    0 14px 40px -16px rgba(50,24,10,.40);
  --shadow-lg: 0 30px 70px -24px rgba(40,18,6,.55);
  --ring: 0 0 0 3px rgba(233,119,36,.45);

  /* Type */
  --display: "Fraunces", Georgia, "Times New Roman", serif;
  --body: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --label: "Barlow Semi Condensed", var(--body);

  /* Layout */
  --maxw: 1200px;
  --gut: clamp(1.1rem, 4vw, 2.4rem);
  --radius: 18px;
  --radius-lg: 26px;
  --header-h: 76px;

  --papel: url("../images/papel-banner.png");
  --papel-light: url("../images/papel-banner-light.png");
}

/* ---------- Reset / base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
  margin:0; font-family:var(--body); color:var(--ink);
  background:var(--cream);
  font-size:clamp(1rem,.96rem + .25vw,1.12rem); line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; cursor:pointer; }
ul{ list-style:none; margin:0; padding:0; }
h1,h2,h3,h4{ font-family:var(--display); font-weight:600; line-height:1.06;
  letter-spacing:-.015em; margin:0; color:var(--ink); }
:focus-visible{ outline:none; box-shadow:var(--ring); border-radius:8px; }

.container{ width:min(100% - var(--gut)*2, var(--maxw)); margin-inline:auto; }
.section{ padding-block: clamp(3.4rem, 8vw, 6.5rem); }
.section--tight{ padding-block: clamp(2.4rem,6vw,4rem); }
.center{ text-align:center; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); border:0; }

/* ---------- Typographic helpers ---------- */
.eyebrow{
  font-family:var(--label); text-transform:uppercase; letter-spacing:.22em;
  font-weight:600; font-size:.78rem; color:var(--rojo);
  display:inline-flex; align-items:center; gap:.6em;
}
.eyebrow::before{ content:""; width:26px; height:2px; background:var(--ember); border-radius:2px; }
.eyebrow.center{ justify-content:center; }
.eyebrow.center::after{ content:""; width:26px; height:2px; background:var(--ember); border-radius:2px; }
.eyebrow--on-dark{ color:var(--gold-soft); }

.display-xl{ font-size:clamp(2.6rem, 1.6rem + 4.6vw, 5rem); }
.display-lg{ font-size:clamp(2.1rem, 1.4rem + 3.2vw, 3.6rem); }
.display-md{ font-size:clamp(1.7rem, 1.3rem + 1.9vw, 2.5rem); }
.lead{ font-size:clamp(1.05rem,1rem + .4vw,1.3rem); color:var(--ink-soft); max-width:60ch; }
.script{ font-family:var(--display); font-style:italic; font-weight:500;
  color:var(--verde); }
.gold-word{ color:var(--gold); }
.rojo-word{ color:var(--rojo); }

/* ---------- Papel picado signature ---------- */
.papel{ height:34px; background-image:var(--papel);
  background-repeat:repeat-x; background-size:auto 100%;
  background-position:left top; }
.papel--light{ background-image:var(--papel-light); }
.papel--lg{ height:46px; }

/* ---------- Buttons ---------- */
.btn{
  position:relative; overflow:hidden; isolation:isolate;
  display:inline-flex; align-items:center; justify-content:center; gap:.55em;
  padding:.92em 1.5em; border:none; border-radius:999px;
  font-family:var(--label); font-weight:600; font-size:1.02rem; letter-spacing:.01em;
  color:#fff; background:var(--ember); box-shadow:var(--shadow-sm);
  transition:transform .25s cubic-bezier(.2,.8,.3,1), box-shadow .25s, filter .25s;
  will-change:transform;
}
.btn svg{ width:1.15em; height:1.15em; }
.btn:hover{ transform:translateY(-2px); box-shadow:0 16px 30px -12px rgba(201,30,40,.55); filter:saturate(1.08); }
.btn:active{ transform:translateY(0); }
.btn--ghost{ background:transparent; color:var(--ink); box-shadow:inset 0 0 0 1.6px rgba(110,60,32,.4); }
.btn--ghost:hover{ box-shadow:inset 0 0 0 1.6px var(--wood); background:rgba(110,60,32,.06); }
.btn--gold{ background:var(--gild); color:#3a2a08; }
.btn--green{ background:linear-gradient(135deg,#13934f,#0a5e32); }
.btn--dark{ background:var(--char); color:var(--on-dark); }
.btn--glass{ background:rgba(255,255,255,.12); color:#fff; backdrop-filter:blur(8px);
  box-shadow:inset 0 0 0 1.4px rgba(255,255,255,.35); }
.btn--glass:hover{ background:rgba(255,255,255,.2); }
.btn--lg{ padding:1.05em 1.8em; font-size:1.08rem; }
.btn--sm{ padding:.6em 1.05em; font-size:.92rem; }
.btn--block{ width:100%; }
/* ripple */
.ripple{ position:absolute; border-radius:50%; transform:scale(0);
  background:rgba(255,255,255,.45); pointer-events:none; z-index:-1;
  animation:ripple .6s ease-out forwards; }
@keyframes ripple{ to{ transform:scale(2.6); opacity:0; } }
@media (prefers-reduced-motion: reduce){ .btn{ transition:none; } .ripple{ display:none; } }

/* ---------- Header ---------- */
.site-header{ position:fixed; inset:0 0 auto 0; z-index:60; height:var(--header-h);
  display:flex; align-items:center; transition:background .35s, box-shadow .35s, height .35s; }
.site-header::before{ content:""; position:absolute; inset:0; z-index:-1;
  background:rgba(28,21,18,0); backdrop-filter:blur(0px); transition:background .35s, backdrop-filter .35s; }
.site-header.scrolled{ height:64px; }
.site-header.scrolled::before{ background:rgba(24,18,15,.86); backdrop-filter:blur(12px);
  box-shadow:0 1px 0 rgba(201,154,59,.35), var(--shadow); }
.header-inner{ width:min(100% - var(--gut)*2, var(--maxw)); margin-inline:auto;
  display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand{ display:flex; align-items:center; gap:.6rem; }
.brand img{ height:46px; width:auto; filter:drop-shadow(0 3px 8px rgba(0,0,0,.35)); transition:height .35s; }
.site-header.scrolled .brand img{ height:40px; }
.nav{ display:flex; align-items:center; gap:.3rem; }
.nav a{ font-family:var(--label); font-weight:600; letter-spacing:.02em;
  color:var(--on-dark); padding:.5rem .8rem; border-radius:999px; position:relative;
  font-size:1rem; transition:color .2s, background .2s; }
.nav a::after{ content:""; position:absolute; left:.8rem; right:.8rem; bottom:.32rem;
  height:2px; background:var(--ember); border-radius:2px; transform:scaleX(0);
  transform-origin:left; transition:transform .25s; }
.nav a:hover{ color:#fff; } .nav a:hover::after{ transform:scaleX(1); }
.nav a[aria-current="page"]{ color:var(--gold-soft); }
.nav a[aria-current="page"]::after{ transform:scaleX(1); background:var(--gild); }
.header-cta{ display:flex; align-items:center; gap:.55rem; }
/* When header is transparent (top of page) keep nav readable over hero scrim */
.header-actions-mobile{ display:none; }
.menu-toggle{ display:none; width:44px; height:44px; border-radius:12px; border:none;
  background:rgba(255,255,255,.12); color:#fff; align-items:center; justify-content:center;
  backdrop-filter:blur(6px); }
.menu-toggle svg{ width:24px; height:24px; }

/* Mobile drawer */
.drawer{ position:fixed; inset:0; z-index:70; visibility:hidden; }
.drawer__scrim{ position:absolute; inset:0; background:rgba(10,6,4,.55); opacity:0;
  transition:opacity .3s; }
.drawer__panel{ position:absolute; top:0; right:0; height:100%; width:min(86%,360px);
  background:var(--char); color:var(--on-dark); transform:translateX(100%);
  transition:transform .35s cubic-bezier(.2,.8,.2,1); padding:1.4rem 1.4rem 2rem;
  display:flex; flex-direction:column; box-shadow:var(--shadow-lg); }
.drawer.open{ visibility:visible; }
.drawer.open .drawer__scrim{ opacity:1; }
.drawer.open .drawer__panel{ transform:translateX(0); }
.drawer__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:.6rem; }
.drawer__head img{ height:42px; }
.drawer__close{ width:42px; height:42px; border-radius:12px; border:none;
  background:rgba(255,255,255,.1); color:#fff; }
.drawer nav{ display:flex; flex-direction:column; margin-top:.6rem; }
.drawer nav a{ font-family:var(--display); font-size:1.45rem; padding:.55rem 0;
  border-bottom:1px solid rgba(255,255,255,.08); color:var(--on-dark); }
.drawer nav a[aria-current="page"]{ color:var(--gold-soft); }
.drawer__cta{ margin-top:auto; display:grid; gap:.6rem; padding-top:1.2rem; }
.drawer__meta{ margin-top:1rem; font-size:.92rem; color:var(--on-dark-soft); display:grid; gap:.3rem; }

/* ---------- Hero ---------- */
.hero{ position:relative; min-height:100svh; display:flex; align-items:flex-end;
  color:#fff; overflow:hidden; padding-top:var(--header-h); }
.hero__media{ position:absolute; inset:0; z-index:-2; }
.hero__media img{ width:100%; height:100%; object-fit:cover; object-position:center 38%; }
.hero__scrim{ position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(to top, rgba(18,12,9,.94) 0%, rgba(18,12,9,.55) 38%, rgba(18,12,9,.30) 62%, rgba(18,12,9,.62) 100%),
    radial-gradient(120% 90% at 18% 92%, rgba(151,0,31,.5), transparent 60%); }
.hero__papel{ position:absolute; top:var(--header-h); left:0; right:0; height:34px;
  z-index:1; opacity:.96; }
.hero__inner{ position:relative; z-index:2; width:min(100% - var(--gut)*2, var(--maxw));
  margin-inline:auto; padding-block: clamp(2rem,6vw,4.4rem); }
.hero__badges{ display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1.1rem; }
.chip{ display:inline-flex; align-items:center; gap:.45em; font-family:var(--label);
  font-weight:600; font-size:.82rem; letter-spacing:.03em; padding:.42em .85em;
  border-radius:999px; background:rgba(255,255,255,.12); color:#fff;
  backdrop-filter:blur(8px); box-shadow:inset 0 0 0 1px rgba(255,255,255,.2); }
.chip svg{ width:1.05em; height:1.05em; color:var(--gold-soft); }
.chip--gold{ background:rgba(201,154,59,.22); }
.hero h1{ color:#fff; max-width:16ch; text-shadow:0 2px 30px rgba(0,0,0,.4); }
.hero h1 .script{ color:var(--gold-soft); display:block; }
.hero__sub{ max-width:48ch; margin:1.1rem 0 1.8rem; color:#f3e7d3; font-size:clamp(1.05rem,1rem+.5vw,1.32rem); }
.hero__cta{ display:flex; flex-wrap:wrap; gap:.7rem; }
.scroll-cue{ position:absolute; left:50%; bottom:1.1rem; transform:translateX(-50%);
  z-index:2; color:rgba(255,255,255,.7); display:grid; place-items:center; gap:.3rem;
  font-family:var(--label); letter-spacing:.2em; font-size:.7rem; text-transform:uppercase; }
.scroll-cue span{ width:22px; height:34px; border:2px solid rgba(255,255,255,.5);
  border-radius:14px; position:relative; }
.scroll-cue span::after{ content:""; position:absolute; top:6px; left:50%; width:3px; height:7px;
  background:#fff; border-radius:2px; transform:translateX(-50%); animation:cue 1.8s infinite; }
@keyframes cue{ 0%{ opacity:0; transform:translate(-50%,0);} 30%{opacity:1;} 60%{opacity:0; transform:translate(-50%,9px);} 100%{opacity:0;} }
@media (prefers-reduced-motion: reduce){ .scroll-cue span::after{ animation:none; } }

/* ---------- Section heading block ---------- */
.head{ max-width:62ch; }
.head--center{ margin-inline:auto; text-align:center; }
.head .display-lg{ margin-top:.5rem; }
.head p{ margin-top:.9rem; }
.head--center p{ margin-inline:auto; }

/* ---------- Marquee strip (specialty tags) ---------- */
.marquee{ background:var(--char); color:var(--on-dark); overflow:hidden;
  border-block:1px solid rgba(201,154,59,.25); }
.marquee__track{ display:flex; gap:2.6rem; white-space:nowrap; padding-block:.95rem;
  width:max-content; animation:slide 32s linear infinite; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
.marquee__track span{ font-family:var(--display); font-style:italic; font-size:1.25rem;
  color:var(--on-dark); display:inline-flex; align-items:center; gap:2.6rem; }
.marquee__track span::after{ content:"✦"; color:var(--gold); font-style:normal; font-size:.8em; }
@keyframes slide{ to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .marquee__track{ animation:none; } }

/* ---------- Specialties ---------- */
.spec-grid{ display:grid; gap:1.2rem; grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  margin-top:2.4rem; }
.spec{ position:relative; border-radius:var(--radius-lg); overflow:hidden; min-height:300px;
  display:flex; align-items:flex-end; color:#fff; box-shadow:var(--shadow);
  isolation:isolate; }
.spec img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2;
  transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.spec::after{ content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(to top, rgba(16,10,7,.92), rgba(16,10,7,.18) 55%, rgba(16,10,7,.05)); }
.spec:hover img{ transform:scale(1.07); }
.spec__body{ padding:1.4rem; }
.spec__body h3{ color:#fff; font-size:1.5rem; }
.spec__body p{ margin:.35rem 0 0; color:#ecdcc4; font-size:.96rem; }
.spec--wide{ grid-column:span 2; min-height:340px; }
@media (max-width:620px){ .spec--wide{ grid-column:span 1; } }
.spec__tag{ position:absolute; top:1rem; left:1rem; z-index:1; }
.tag{ font-family:var(--label); font-weight:600; font-size:.72rem; letter-spacing:.08em;
  text-transform:uppercase; padding:.34em .7em; border-radius:999px; color:#fff;
  background:var(--ember); box-shadow:var(--shadow-sm); }
.tag--green{ background:linear-gradient(135deg,#13934f,#0a5e32); }
.tag--gold{ background:var(--gild); color:#3a2a08; }
.tag--rojo{ background:linear-gradient(135deg,#d6213b,#97001f); }
.tag--spicy{ background:linear-gradient(135deg,#e8431f,#b00c0c); }
.tag--new{ background:linear-gradient(135deg,#13934f,#0a5e32); }

/* ---------- Feature dish cards ---------- */
.dish-grid{ display:grid; gap:1.3rem; grid-template-columns:repeat(auto-fill,minmax(270px,1fr));
  margin-top:2.4rem; }
.dish{ background:var(--paper); border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow-sm); border:1px solid rgba(110,60,32,.1);
  display:flex; flex-direction:column; transition:transform .35s, box-shadow .35s; }
.dish:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.dish__media{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.dish__media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s; }
.dish:hover .dish__media img{ transform:scale(1.06); }
.dish__tags{ position:absolute; top:.7rem; left:.7rem; display:flex; gap:.35rem; flex-wrap:wrap; }
.dish__body{ padding:1.15rem 1.25rem 1.3rem; display:flex; flex-direction:column; gap:.5rem; flex:1; }
.dish__row{ display:flex; align-items:baseline; justify-content:space-between; gap:.6rem; }
.dish__name{ font-family:var(--display); font-weight:600; font-size:1.24rem; color:var(--ink); }
.dish__price{ font-family:var(--label); font-weight:700; font-size:1.18rem; color:var(--verde);
  white-space:nowrap; }
.dish__price small{ font-size:.7em; color:var(--ink-soft); font-weight:600; }
.dish__desc{ font-size:.95rem; color:var(--ink-soft); flex:1; }
.dish__foot{ display:flex; gap:.5rem; margin-top:.4rem; }
.icon-btn{ display:inline-flex; align-items:center; justify-content:center; gap:.4em;
  border-radius:999px; padding:.55em .9em; font-family:var(--label); font-weight:600;
  font-size:.9rem; border:1.5px solid rgba(110,60,32,.25); background:transparent; color:var(--ink);
  transition:background .2s, border-color .2s, color .2s; }
.icon-btn svg{ width:1.05em; height:1.05em; }
.icon-btn:hover{ border-color:var(--naranja); color:var(--rojo); background:rgba(233,119,36,.08); }
.icon-btn--call{ background:var(--ember); color:#fff; border-color:transparent; flex:1; }
.icon-btn--call:hover{ color:#fff; filter:saturate(1.1); }

/* ---------- Happy hour band ---------- */
.band-dark{ position:relative; background:var(--char); color:var(--on-dark); overflow:hidden; }
.band-dark::before{ content:""; position:absolute; inset:0;
  background:radial-gradient(80% 120% at 88% 10%, rgba(233,119,36,.20), transparent 55%),
             radial-gradient(70% 120% at 6% 90%, rgba(151,0,31,.30), transparent 55%); }
.happy{ display:grid; gap:2.2rem; align-items:center; position:relative;
  grid-template-columns:1.05fr .95fr; }
.happy__media{ position:relative; border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow-lg); aspect-ratio:4/5; }
.happy__media img{ width:100%; height:100%; object-fit:cover; }
.happy__media .float-badge{ position:absolute; bottom:1rem; left:1rem; }
.happy h2{ color:#fff; }
.happy__sched{ display:flex; flex-wrap:wrap; gap:.7rem; margin:1.3rem 0; }
.sched-chip{ display:inline-flex; align-items:center; gap:.5em; padding:.6em 1em;
  border-radius:14px; background:rgba(255,255,255,.08); font-family:var(--label); font-weight:600;
  box-shadow:inset 0 0 0 1px rgba(201,154,59,.3); }
.sched-chip svg{ width:1.15em; height:1.15em; color:var(--gold-soft); }
.happy__list{ display:grid; gap:.7rem; margin:1.2rem 0 1.6rem; }
.happy__list li{ display:flex; align-items:center; gap:.7rem; color:var(--on-dark-soft); }
.happy__list li b{ color:#fff; font-family:var(--label); }
.dot{ width:8px; height:8px; border-radius:50%; background:var(--gild); flex:none; }
.float-badge{ font-family:var(--display); font-style:italic; background:var(--gild); color:#3a2a08;
  padding:.5em 1em; border-radius:14px; box-shadow:var(--shadow); font-size:1.1rem; }
@media (max-width:820px){ .happy{ grid-template-columns:1fr; } .happy__media{ aspect-ratio:16/10; } }

/* ---------- Lunch / two-col feature ---------- */
.feature{ display:grid; gap:2.4rem; align-items:center; grid-template-columns:1fr 1fr; }
.feature--reverse .feature__media{ order:2; }
.feature__media{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow);
  aspect-ratio:5/4; position:relative; }
.feature__media img{ width:100%; height:100%; object-fit:cover; transition:transform .7s; }
.feature__media:hover img{ transform:scale(1.05); }
.feature__media .stamp{ position:absolute; top:1rem; right:1rem; }
.stamp{ font-family:var(--label); font-weight:700; text-transform:uppercase; letter-spacing:.08em;
  font-size:.78rem; color:#fff; background:var(--ember); padding:.45em .9em; border-radius:999px;
  box-shadow:var(--shadow-sm); }
.feature ul.ticks{ display:grid; gap:.6rem; margin:1.2rem 0 1.6rem; }
.ticks li{ display:flex; gap:.7rem; align-items:flex-start; }
.ticks li svg{ width:1.3rem; height:1.3rem; color:var(--verde); flex:none; margin-top:.15rem; }
@media (max-width:820px){ .feature{ grid-template-columns:1fr; }
  .feature--reverse .feature__media{ order:0; } }

/* ---------- CTA cards row (events/catering teaser) ---------- */
.duo{ display:grid; gap:1.3rem; grid-template-columns:1fr 1fr; margin-top:2.2rem; }
@media (max-width:760px){ .duo{ grid-template-columns:1fr; } }
.promo{ position:relative; border-radius:var(--radius-lg); overflow:hidden; min-height:330px;
  display:flex; align-items:flex-end; color:#fff; box-shadow:var(--shadow); isolation:isolate; }
.promo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2;
  transition:transform .7s; }
.promo:hover img{ transform:scale(1.06); }
.promo::after{ content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(to top, rgba(14,8,5,.92), rgba(14,8,5,.2) 60%); }
.promo__body{ padding:1.7rem; }
.promo__body h3{ color:#fff; font-size:1.7rem; }
.promo__body p{ color:#ecdcc4; margin:.4rem 0 1rem; max-width:42ch; }

/* ---------- Stats / trust ---------- */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; text-align:center; }
.stat b{ font-family:var(--display); font-size:clamp(1.8rem,1.3rem+2vw,2.8rem); color:var(--rojo);
  display:block; line-height:1; }
.stat span{ font-family:var(--label); text-transform:uppercase; letter-spacing:.12em; font-size:.78rem;
  color:var(--ink-soft); }
@media (max-width:600px){ .stats{ grid-template-columns:repeat(2,1fr); gap:1.6rem 1rem; } }

/* ---------- Reviews ---------- */
.reviews{ display:grid; gap:1.2rem; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); margin-top:2.2rem; }
.review{ background:var(--paper); border-radius:var(--radius); padding:1.4rem 1.5rem;
  box-shadow:var(--shadow-sm); border:1px solid rgba(110,60,32,.1); display:flex; flex-direction:column; gap:.7rem; }
.stars{ color:var(--gold); letter-spacing:.1em; font-size:1.05rem; }
.review p{ margin:0; color:var(--ink); font-size:1.02rem; }
.review cite{ font-style:normal; font-family:var(--label); font-weight:600; color:var(--ink-soft); }

/* ---------- Footer ---------- */
.site-footer{ background:var(--char); color:var(--on-dark); position:relative; }
.footer-grid{ display:grid; gap:2rem; grid-template-columns:1.4fr 1fr 1fr 1.2fr; padding-block:3.2rem 2rem; }
.footer-grid h4{ color:#fff; font-family:var(--label); text-transform:uppercase; letter-spacing:.12em;
  font-size:.86rem; margin-bottom:1rem; }
.footer-brand img{ height:58px; margin-bottom:1rem; }
.footer-brand p{ color:var(--on-dark-soft); max-width:36ch; }
.foot-links{ display:grid; gap:.55rem; }
.foot-links a{ color:var(--on-dark-soft); transition:color .2s, padding-left .2s; }
.foot-links a:hover{ color:var(--gold-soft); padding-left:.25rem; }
.foot-meta{ display:grid; gap:.5rem; color:var(--on-dark-soft); }
.foot-meta a{ color:var(--on-dark); }
.foot-meta strong{ color:#fff; font-family:var(--label); }
.socials{ display:flex; gap:.6rem; margin-top:1rem; }
.socials a{ width:42px; height:42px; border-radius:12px; display:grid; place-items:center;
  background:rgba(255,255,255,.08); color:var(--on-dark); transition:background .2s, transform .2s, color .2s; }
.socials a:hover{ background:var(--ember); color:#fff; transform:translateY(-3px); }
.socials svg{ width:20px; height:20px; }
.news{ display:flex; gap:.5rem; margin-top:.4rem; }
.news input{ flex:1; min-width:0; padding:.7em .9em; border-radius:12px; border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.06); color:#fff; font:inherit; }
.news input::placeholder{ color:var(--on-dark-soft); }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.1); padding-block:1.3rem;
  display:flex; flex-wrap:wrap; gap:.6rem 1.4rem; align-items:center; justify-content:space-between;
  color:var(--on-dark-soft); font-size:.9rem; }
.footer-bottom nav{ display:flex; gap:1.2rem; flex-wrap:wrap; }
.footer-bottom a:hover{ color:var(--gold-soft); }
@media (max-width:860px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:540px){ .footer-grid{ grid-template-columns:1fr; } }

/* ---------- Mobile sticky CTA ---------- */
.mobile-cta{ position:fixed; left:0; right:0; bottom:0; z-index:55; display:none;
  grid-template-columns:1fr 1fr 1fr; gap:1px; background:rgba(201,154,59,.4);
  box-shadow:0 -8px 24px rgba(0,0,0,.25); }
.mobile-cta a{ background:var(--char); color:var(--on-dark); display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:.18rem; padding:.6rem .3rem;
  font-family:var(--label); font-weight:600; font-size:.78rem; letter-spacing:.03em; }
.mobile-cta a svg{ width:1.4rem; height:1.4rem; color:var(--gold-soft); }
.mobile-cta a.is-primary{ background:var(--ember); color:#fff; }
.mobile-cta a.is-primary svg{ color:#fff; }
@media (max-width:760px){ .mobile-cta{ display:grid; } body{ padding-bottom:62px; } }

/* ---------- Forms ---------- */
.form{ display:grid; gap:1rem; }
.field{ display:grid; gap:.4rem; }
.field label{ font-family:var(--label); font-weight:600; font-size:.92rem; color:var(--ink); }
.field input, .field select, .field textarea{
  width:100%; padding:.85em 1em; border-radius:14px; border:1.5px solid rgba(110,60,32,.22);
  background:var(--paper); color:var(--ink); font:inherit; transition:border-color .2s, box-shadow .2s; }
.field textarea{ min-height:130px; resize:vertical; }
.field input:focus, .field select:focus, .field textarea:focus{ border-color:var(--naranja);
  box-shadow:0 0 0 3px rgba(233,119,36,.18); outline:none; }
.field.two{ grid-template-columns:1fr 1fr; gap:1rem; }
.form-grid{ display:grid; gap:1rem; grid-template-columns:1fr 1fr; }
@media (max-width:620px){ .form-grid, .field.two{ grid-template-columns:1fr; } }
.form-note{ font-size:.86rem; color:var(--ink-soft); }
.card-panel{ background:var(--paper); border-radius:var(--radius-lg); padding:clamp(1.4rem,4vw,2.4rem);
  box-shadow:var(--shadow); border:1px solid rgba(110,60,32,.1); }

/* ---------- Info / contact ---------- */
.info-grid{ display:grid; gap:1.3rem; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); }
.info-card{ background:var(--paper); border-radius:var(--radius); padding:1.4rem; box-shadow:var(--shadow-sm);
  border:1px solid rgba(110,60,32,.1); display:flex; flex-direction:column; gap:.5rem; }
.info-card .ic{ width:46px; height:46px; border-radius:14px; display:grid; place-items:center;
  background:var(--ember); color:#fff; }
.info-card .ic svg{ width:22px; height:22px; }
.info-card h3{ font-size:1.15rem; }
.info-card p, .info-card a{ color:var(--ink-soft); }
.info-card a:hover{ color:var(--rojo); }
.map-wrap{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow); border:1px solid rgba(110,60,32,.12); }
.map-wrap iframe{ display:block; width:100%; height:100%; min-height:340px; border:0; }

/* hours table */
.hours{ display:grid; gap:.2rem; }
.hours div{ display:flex; justify-content:space-between; gap:1rem; padding:.45rem 0;
  border-bottom:1px dashed rgba(110,60,32,.2); }
.hours div:last-child{ border-bottom:none; }
.hours .day{ font-family:var(--label); font-weight:600; }
.hours .now{ color:var(--verde); font-family:var(--label); font-weight:700; }

/* ---------- Gallery ---------- */
.gal-filters{ display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; margin-top:1.8rem; }
.chip-btn{ font-family:var(--label); font-weight:600; padding:.5em 1.05em; border-radius:999px;
  border:1.5px solid rgba(110,60,32,.25); background:transparent; color:var(--ink);
  transition:all .2s; font-size:.95rem; }
.chip-btn[aria-pressed="true"]{ background:var(--ember); color:#fff; border-color:transparent; box-shadow:var(--shadow-sm); }
.chip-btn:hover{ border-color:var(--naranja); }
.gallery{ columns: 3 260px; column-gap:1rem; margin-top:2rem; }
.gallery figure{ break-inside:avoid; margin:0 0 1rem; border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow-sm); position:relative; cursor:zoom-in; background:var(--cream-2); }
.gallery img{ width:100%; transition:transform .5s; }
.gallery figure:hover img{ transform:scale(1.05); }
.gallery figcaption{ position:absolute; inset:auto 0 0 0; padding:1.4rem .9rem .8rem;
  background:linear-gradient(to top, rgba(14,8,5,.85), transparent); color:#fff;
  font-family:var(--label); font-weight:600; font-size:.92rem; opacity:0; transform:translateY(8px);
  transition:opacity .3s, transform .3s; }
.gallery figure:hover figcaption{ opacity:1; transform:translateY(0); }

/* Lightbox */
.lightbox{ position:fixed; inset:0; z-index:90; background:rgba(10,6,4,.92); display:none;
  align-items:center; justify-content:center; padding:1.4rem; }
.lightbox.open{ display:flex; }
.lightbox img{ max-width:92vw; max-height:84vh; border-radius:12px; box-shadow:var(--shadow-lg);
  animation:lbIn .3s ease; }
@keyframes lbIn{ from{ opacity:0; transform:scale(.96);} to{ opacity:1; transform:scale(1);} }
.lightbox__close, .lightbox__nav{ position:absolute; background:rgba(255,255,255,.12); color:#fff;
  border:none; width:52px; height:52px; border-radius:50%; display:grid; place-items:center;
  backdrop-filter:blur(6px); transition:background .2s; }
.lightbox__close:hover, .lightbox__nav:hover{ background:rgba(255,255,255,.25); }
.lightbox__close{ top:1.2rem; right:1.2rem; }
.lightbox__close svg, .lightbox__nav svg{ width:24px; height:24px; }
.lightbox__nav{ top:50%; transform:translateY(-50%); }
.lightbox__nav.prev{ left:1.2rem; } .lightbox__nav.next{ right:1.2rem; }
.lightbox__cap{ position:absolute; bottom:1.2rem; left:50%; transform:translateX(-50%);
  color:#fff; font-family:var(--label); font-weight:600; background:rgba(0,0,0,.4); padding:.4em 1em;
  border-radius:999px; }

/* ---------- Page hero (interior pages) ---------- */
.page-hero{ position:relative; padding:calc(var(--header-h) + 3rem) 0 3rem; color:#fff;
  overflow:hidden; isolation:isolate; }
.page-hero img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.page-hero::after{ content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(to bottom, rgba(18,12,9,.72), rgba(18,12,9,.85)); }
.page-hero h1{ color:#fff; }
.page-hero p{ color:#f1e4cf; max-width:54ch; margin-top:.8rem; }
.page-hero .papel{ position:absolute; top:var(--header-h); left:0; right:0; opacity:.95; z-index:1; }
.crumbs{ font-family:var(--label); font-size:.86rem; color:var(--gold-soft); margin-bottom:1rem;
  display:flex; gap:.5rem; align-items:center; }
.crumbs a{ color:#f1e4cf; } .crumbs a:hover{ color:#fff; }

/* ---------- Menu app ---------- */
.menu-toolbar{ position:sticky; top:var(--header-h); z-index:40; background:var(--cream);
  padding-block:1rem; box-shadow:0 8px 18px -16px rgba(40,20,10,.6); }
.menu-search{ position:relative; max-width:480px; margin:0 auto 1rem; }
.menu-search input{ width:100%; padding:.85em 1em .85em 2.9em; border-radius:999px;
  border:1.5px solid rgba(110,60,32,.25); background:var(--paper); font:inherit; }
.menu-search input:focus{ border-color:var(--naranja); box-shadow:0 0 0 3px rgba(233,119,36,.18); outline:none; }
.menu-search svg{ position:absolute; left:1em; top:50%; transform:translateY(-50%);
  width:1.25em; height:1.25em; color:var(--ink-soft); }
.cat-scroll{ display:flex; gap:.55rem; overflow-x:auto; padding-bottom:.4rem; scrollbar-width:thin;
  -webkit-overflow-scrolling:touch; }
.cat-scroll::-webkit-scrollbar{ height:6px; } .cat-scroll::-webkit-scrollbar-thumb{ background:rgba(110,60,32,.3); border-radius:99px; }
.cat-btn{ flex:none; font-family:var(--label); font-weight:600; padding:.55em 1.05em; border-radius:999px;
  border:1.5px solid rgba(110,60,32,.22); background:var(--paper); color:var(--ink); white-space:nowrap;
  transition:all .2s; font-size:.96rem; }
.cat-btn[aria-pressed="true"]{ background:var(--ember); color:#fff; border-color:transparent; box-shadow:var(--shadow-sm); }
.cat-btn:hover{ border-color:var(--naranja); }
.menu-count{ text-align:center; font-family:var(--label); color:var(--ink-soft); margin:.4rem 0 0; font-size:.92rem; }

.menu-cat-title{ display:flex; align-items:center; gap:1rem; margin:2.4rem 0 1.3rem; }
.menu-cat-title h2{ font-size:clamp(1.6rem,1.3rem+1.4vw,2.2rem); }
.menu-cat-title .line{ flex:1; height:2px; background:linear-gradient(90deg, rgba(201,154,59,.6), transparent); border-radius:2px; }
.menu-cat-title .cnt{ font-family:var(--label); color:var(--ink-soft); font-size:.9rem; }

.menu-grid{ display:grid; gap:1.1rem; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); }
.mcard{ background:var(--paper); border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column;
  box-shadow:var(--shadow-sm); border:1px solid rgba(110,60,32,.1);
  transition:transform .3s, box-shadow .3s; }
.mcard:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.mcard.has-img .mcard__media{ display:block; }
.mcard__media{ display:none; position:relative; aspect-ratio:16/10; overflow:hidden; }
.mcard__media img{ width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.mcard:hover .mcard__media img{ transform:scale(1.06); }
.mcard__tags{ position:absolute; top:.6rem; left:.6rem; display:flex; gap:.3rem; flex-wrap:wrap; }
.mcard__body{ padding:1.05rem 1.15rem 1.2rem; display:flex; flex-direction:column; gap:.45rem; flex:1; }
.mcard__top{ display:flex; justify-content:space-between; align-items:baseline; gap:.6rem; }
.mcard__name{ font-family:var(--display); font-weight:600; font-size:1.16rem; color:var(--ink); line-height:1.15; }
.mcard__price{ font-family:var(--label); font-weight:700; color:var(--verde); font-size:1.1rem; white-space:nowrap; }
.mcard__price.mp{ color:var(--naranja); font-size:.92rem; }
.mcard__desc{ font-size:.92rem; color:var(--ink-soft); flex:1; }
.mcard__tagrow{ display:flex; gap:.35rem; flex-wrap:wrap; }
.mini-tag{ font-family:var(--label); font-weight:600; font-size:.68rem; letter-spacing:.05em;
  text-transform:uppercase; padding:.25em .6em; border-radius:999px; }
.mt-pop{ background:rgba(233,119,36,.16); color:#b4561a; }
.mt-best{ background:rgba(201,154,59,.2); color:#8a6716; }
.mt-spicy{ background:rgba(194,16,46,.14); color:#a01024; }
.mt-salv{ background:rgba(14,124,66,.16); color:#0a5e32; }
.mt-chef{ background:rgba(151,0,31,.14); color:#8a0019; }
.mt-new{ background:rgba(14,124,66,.16); color:#0a5e32; }
.mcard__foot{ display:flex; gap:.5rem; margin-top:.3rem; }
.menu-empty{ text-align:center; padding:3rem 1rem; color:var(--ink-soft); display:none; }
.menu-empty.show{ display:block; }
.menu-empty svg{ width:48px; height:48px; color:var(--gold); margin-bottom:.6rem; }

.disclaimer{ font-size:.82rem; color:var(--ink-soft); max-width:70ch; margin:2.4rem auto 0;
  text-align:center; font-style:italic; }

/* ---------- Reveal animation ---------- */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }
.reveal[data-d="1"]{ transition-delay:.08s; }
.reveal[data-d="2"]{ transition-delay:.16s; }
.reveal[data-d="3"]{ transition-delay:.24s; }
.reveal[data-d="4"]{ transition-delay:.32s; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* ---------- Loader ---------- */
.loader{ position:fixed; inset:0; z-index:200; background:var(--char); display:grid; place-items:center;
  transition:opacity .5s ease, visibility .5s; }
.loader.done{ opacity:0; visibility:hidden; }
.loader__inner{ display:grid; place-items:center; gap:1.1rem; text-align:center; }
.loader img{ height:96px; width:auto; animation:bob 1.6s ease-in-out infinite; }
.loader .bar{ width:140px; height:4px; border-radius:99px; background:rgba(255,255,255,.12); overflow:hidden; }
.loader .bar i{ display:block; height:100%; width:40%; background:var(--gild); border-radius:99px; animation:load 1.1s ease-in-out infinite; }
@keyframes bob{ 50%{ transform:translateY(-8px); } }
@keyframes load{ 0%{ transform:translateX(-100%);} 100%{ transform:translateX(350%);} }
@media (prefers-reduced-motion: reduce){ .loader img, .loader .bar i{ animation:none; } }

/* ---------- 404 ---------- */
.notfound{ min-height:100svh; display:grid; place-items:center; text-align:center;
  position:relative; color:#fff; padding:2rem; }
.notfound img.bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.notfound::after{ content:""; position:absolute; inset:0; z-index:-1; background:rgba(18,12,9,.82); }
.notfound h1{ color:#fff; font-size:clamp(4rem,10vw,8rem); }

/* ---------- Utility spacing ---------- */
.mt-1{ margin-top:.6rem; } .mt-2{ margin-top:1.2rem; } .mt-3{ margin-top:2rem; }
.flow > * + *{ margin-top:1rem; }
.split{ display:flex; gap:.7rem; flex-wrap:wrap; }
.split--center{ justify-content:center; }
.bg-cream2{ background:var(--cream-2); }
.bg-paper{ background:var(--paper); }

/* ---------- Open-now status polish ---------- */
[data-openstatus]{ font-family:var(--label); font-weight:700; letter-spacing:.02em; }
[data-openstatus].is-open{ color:var(--verde); }
[data-openstatus].is-open::before{ content:"●"; color:var(--verde); margin-right:.4em; font-size:.7em; vertical-align:middle; }
.chip[data-openstatus]{ color:#fff; }
.chip[data-openstatus].is-open{ color:#bff0cf; }
.news-form{ width:100%; }

/* =============================================================
   Eventos · Salón · Vida nocturna (additions)
   ============================================================= */
/* Purple band for events / quinceañeras */
.band-plum{ position:relative; background:linear-gradient(160deg,#2a0f33 0%, #45184f 55%, #2a0f33 100%); color:var(--on-dark); overflow:hidden; }
.band-plum::before{ content:""; position:absolute; inset:0;
  background:radial-gradient(70% 100% at 85% 8%, rgba(201,154,59,.22), transparent 55%),
             radial-gradient(70% 110% at 10% 95%, rgba(154,85,184,.35), transparent 55%); }
.band-plum .eyebrow{ color:var(--gold-soft); }
.tag--plum{ background:linear-gradient(135deg,#9a55b8,#5a1f6e); }
.btn--plum{ background:linear-gradient(135deg,#8e44ad,#5a1f6e); color:#fff; }

/* Event type cards with icon + image */
.events-grid{ display:grid; gap:1.3rem; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); margin-top:2.4rem; }
.ecard{ position:relative; border-radius:var(--radius-lg); overflow:hidden; min-height:360px;
  display:flex; align-items:flex-end; color:#fff; box-shadow:var(--shadow); isolation:isolate; }
.ecard img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2;
  transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.ecard::after{ content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(to top, rgba(20,8,24,.92), rgba(20,8,24,.25) 55%, rgba(20,8,24,.08)); }
.ecard:hover img{ transform:scale(1.07); }
.ecard__body{ padding:1.5rem; }
.ecard__body h3{ color:#fff; font-size:1.45rem; }
.ecard__body p{ color:#ecdcf4; margin:.4rem 0 .9rem; font-size:.96rem; }
.ecard .pill{ display:inline-flex; align-items:center; gap:.4em; font-family:var(--label); font-weight:600;
  font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; padding:.32em .7em; border-radius:999px;
  background:rgba(201,154,59,.25); color:#fdebc4; margin-bottom:.7rem; backdrop-filter:blur(6px); }

/* Flyer frames (portrait promo graphics) */
.flyer-grid{ display:grid; gap:1.3rem; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); margin-top:2.2rem; }
.flyer{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg);
  border:1px solid rgba(201,154,59,.3); background:var(--char); position:relative; cursor:zoom-in; }
.flyer img{ width:100%; display:block; transition:transform .5s; }
.flyer:hover img{ transform:scale(1.03); }

/* Nightlife band */
.band-night{ position:relative; background:#0c0710; color:var(--on-dark); overflow:hidden; }
.band-night::before{ content:""; position:absolute; inset:0;
  background:radial-gradient(60% 90% at 80% 10%, rgba(194,16,46,.35), transparent 55%),
             radial-gradient(70% 100% at 12% 90%, rgba(108,42,134,.5), transparent 55%); }
.night-tags{ display:flex; flex-wrap:wrap; gap:.6rem; margin:1.2rem 0 1.6rem; }
.night-tags .sched-chip{ box-shadow:inset 0 0 0 1px rgba(154,85,184,.5); }
.night-tags .sched-chip svg{ color:var(--morado-soft); }

/* generic plum dot */
.dot--plum{ background:linear-gradient(135deg,#c99a3b,#9a55b8); }

/* =============================================================
   CORRECCIONES v2 — contraste, iconos, responsive, video hero
   (este bloque va al final para sobrescribir lo anterior)
   ============================================================= */

/* 1) ICONOS: cualquier SVG sin clase de tamaño se limitaba a 300x150 por
   defecto y rompía el móvil. Tamaño base seguro para iconos en texto. */
svg{ width:1.1em; height:1.1em; flex:none; vertical-align:middle; }
.crumbs svg, .pill svg, .ecard .pill svg{ width:1.05em; height:1.05em; }
.menu-empty svg{ width:48px; height:48px; }
.lightbox__close svg, .lightbox__nav svg{ width:24px; height:24px; }
.menu-toggle svg{ width:24px; height:24px; }
.info-card .ic svg{ width:22px; height:22px; }
.socials svg, .social-fab a svg{ width:20px; height:20px; }
.mobile-cta a svg{ width:1.4rem; height:1.4rem; }

/* 2) HEADER RESPONSIVE: ocultar el nav de escritorio y mostrar el
   botón de menú en móvil/tablet (faltaba por completo). */
@media (max-width: 920px){
  .nav{ display:none; }
  .menu-toggle{ display:inline-flex; align-items:center; justify-content:center; }
}
@media (max-width: 380px){
  .header-cta .btn--sm .lbl, .header-cta .btn--sm span:not(.ripple){ }
}

/* 3) CONTRASTE: scrims más fuertes + sombra de texto sobre fotos claras */
.page-hero::after{ background:linear-gradient(to bottom, rgba(14,9,7,.74), rgba(14,9,7,.9)); }
.page-hero h1, .page-hero p, .page-hero .crumbs, .page-hero .eyebrow{ text-shadow:0 2px 20px rgba(0,0,0,.55); }
.hero h1, .hero__sub, .hero__badges .chip{ text-shadow:0 2px 22px rgba(0,0,0,.5); }
.hero__scrim{ background:linear-gradient(to top, rgba(12,7,5,.92) 0%, rgba(12,7,5,.55) 42%, rgba(12,7,5,.4) 100%) !important; }

/* 4) ESPACIADO en móvil (menos espacio desperdiciado) */
@media (max-width: 600px){
  .section{ padding-block: clamp(2.6rem, 9vw, 3.6rem); }
  .section--tight{ padding-block: 2.2rem; }
  :root{ --gut: 1.1rem; }
  .head .lead, .lead{ font-size:1rem; }
  .display-lg{ font-size:clamp(1.9rem, 1.4rem + 3vw, 2.4rem); }
}

/* 5) BOTONES del hero — proporción y orden en móvil */
@media (max-width: 600px){
  .hero__cta{ display:grid; grid-template-columns:1fr 1fr; gap:.6rem; width:100%; }
  .hero__cta .btn{ width:100%; padding:.85em .8em; font-size:.95rem; }
}
@media (max-width: 360px){ .hero__cta{ grid-template-columns:1fr; } }
.split{ display:flex; flex-wrap:wrap; gap:.7rem; }
.split--center{ justify-content:center; }
@media (max-width: 520px){
  .split .btn{ flex:1 1 100%; }
}

/* 6) TARJETAS en móvil */
@media (max-width: 600px){
  .ecard{ min-height:300px; }
  .events-grid, .dish-grid, .spec-grid, .flyer-grid{ gap:1rem; }
  .info-grid{ gap:1rem; }
}

/* 7) VIDEO HERO (fondo en video con overlay y parallax suave) */
.hero__media video{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.hero__media img{ width:100%; height:100%; object-fit:cover; }
@media (prefers-reduced-motion: no-preference){
  .hero__media{ will-change:transform; }
}

/* 8) BOTÓN FLOTANTE de redes / WhatsApp */
.social-fab{ position:fixed; right:14px; bottom:78px; z-index:54; display:flex; flex-direction:column; gap:.5rem; }
.social-fab a{ width:46px; height:46px; border-radius:50%; display:grid; place-items:center;
  color:#fff; box-shadow:var(--shadow); transition:transform .2s, filter .2s; }
.social-fab a:hover{ transform:translateY(-2px) scale(1.04); filter:brightness(1.08); }
.social-fab .fab-wa{ background:#25d366; }
.social-fab .fab-ig{ background:linear-gradient(135deg,#f9ce34,#ee2a7b,#6228d7); }
.social-fab .fab-tt{ background:#000; border:1px solid rgba(255,255,255,.25); }
@media (min-width: 761px){ .social-fab{ bottom:18px; } }
@media (max-width: 380px){ .social-fab a{ width:42px; height:42px; } }

/* header social icons */
.header-social{ display:flex; align-items:center; gap:.35rem; }
.header-social a{ width:34px; height:34px; border-radius:9px; display:grid; place-items:center;
  color:var(--on-dark-soft); transition:color .2s, background .2s; }
.header-social a:hover{ color:#fff; background:rgba(255,255,255,.08); }
@media (max-width: 920px){ .header-social{ display:none; } }

/* drawer social row */
.drawer__social{ display:flex; gap:.6rem; margin-top:1rem; }
.drawer__social a{ width:42px; height:42px; border-radius:10px; display:grid; place-items:center;
  background:rgba(255,255,255,.06); color:#fff; }

/* Timeline + Misión/Visión (Nosotros) */
.timeline{ list-style:none; margin:1.6rem 0 0; padding:0; position:relative; }
.timeline::before{ content:""; position:absolute; left:7px; top:6px; bottom:6px; width:2px;
  background:linear-gradient(var(--gold), var(--rojo)); opacity:.5; }
.timeline li{ position:relative; padding:0 0 1.4rem 2.2rem; }
.timeline .t-dot{ position:absolute; left:0; top:4px; width:16px; height:16px; border-radius:50%;
  background:var(--ember); box-shadow:0 0 0 4px rgba(201,154,59,.18); }
.timeline b{ font-family:var(--display); font-size:1.15rem; color:var(--ink); }
.timeline p{ margin:.25rem 0 0; color:var(--ink-soft); }
.mv-grid{ display:grid; gap:1.2rem; grid-template-columns:1fr 1fr; }
.mv-card{ background:var(--paper); border:1px solid rgba(110,60,32,.14); border-radius:var(--radius-lg);
  padding:1.6rem; box-shadow:var(--shadow-sm); }
.mv-card .ic{ width:46px; height:46px; border-radius:14px; display:grid; place-items:center;
  background:var(--ember); color:#fff; margin-bottom:.8rem; }
.mv-card .ic svg{ width:22px; height:22px; }
.mv-card h3{ font-family:var(--display); font-size:1.3rem; }
.mv-card p{ color:var(--ink-soft); margin-top:.4rem; }
@media (max-width:600px){ .mv-grid{ grid-template-columns:1fr; } }

/* galería: captions visibles en pantallas táctiles */
@media (hover:none){
  .gallery figcaption{ opacity:1; transform:none; background:linear-gradient(to top, rgba(14,8,5,.8), transparent 70%); }
}
.hero__video{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }


/* Respaldo sólido por si el gradiente no carga (Eventos siempre legible) */
.band-plum{ background-color:#2a0f33; }
.band-dark{ background-color:#1c1512; }
.band-night{ background-color:#0c0710; }