/* =========================================================
   Cantinero · App mobile-first /mobil  v2
   Brand book: Jet Black #2A2A29 · Rossé #FEBAB1
   Modric (display) · Open Sans (family)
   App-like grammar (iPhone/iOS) — sin branding Apple
   ========================================================= */

/* ───── Fuentes oficiales del Brand Book — Modric + Open Sans family ───── */
@font-face{
  font-family:"Modric";
  src:url("../fonts/Modric.woff2") format("woff2");
  font-weight:400 900; font-style:normal; font-display:swap;
}
@font-face{ font-family:"Open Sans"; src:url("../fonts/OpenSans-Light.woff2")     format("woff2"); font-weight:300; font-style:normal; font-display:swap; }
@font-face{ font-family:"Open Sans"; src:url("../fonts/OpenSans-Regular.woff2")   format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:"Open Sans"; src:url("../fonts/OpenSans-Medium.woff2")    format("woff2"); font-weight:500; font-style:normal; font-display:swap; }
@font-face{ font-family:"Open Sans"; src:url("../fonts/OpenSans-SemiBold.woff2")  format("woff2"); font-weight:600; font-style:normal; font-display:swap; }
@font-face{ font-family:"Open Sans"; src:url("../fonts/OpenSans-Bold.woff2")      format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
@font-face{ font-family:"Open Sans"; src:url("../fonts/OpenSans-ExtraBold.woff2") format("woff2"); font-weight:800; font-style:normal; font-display:swap; }
@font-face{ font-family:"Open Sans"; src:url("../fonts/OpenSans-LightItalic.woff2")     format("woff2"); font-weight:300; font-style:italic; font-display:swap; }
@font-face{ font-family:"Open Sans"; src:url("../fonts/OpenSans-Italic.woff2")          format("woff2"); font-weight:400; font-style:italic; font-display:swap; }
@font-face{ font-family:"Open Sans"; src:url("../fonts/OpenSans-MediumItalic.woff2")    format("woff2"); font-weight:500; font-style:italic; font-display:swap; }
@font-face{ font-family:"Open Sans"; src:url("../fonts/OpenSans-SemiBoldItalic.woff2")  format("woff2"); font-weight:600; font-style:italic; font-display:swap; }
@font-face{ font-family:"Open Sans"; src:url("../fonts/OpenSans-BoldItalic.woff2")      format("woff2"); font-weight:700; font-style:italic; font-display:swap; }

/* ───── Tokens ───── */
:root{
  /* Brand · NO ALTERAR */
  --jet:#2A2A29;
  --jet-90:#363635;
  --jet-80:#4a4a48;
  --jet-50:#94938f;
  --jet-15:#e7e6e2;
  --jet-08:#f4f3ef;
  --rose:#FEBAB1;
  --rose-soft:#FFD4CD;
  --rose-deep:#E89A92;
  --paper:#FAF6F1;
  --white:#FFFFFF;
  --black:#000000;

  /* a11y · contraste para labels y meta */
  --label:#5a5a58;        /* ~7:1 sobre paper · para kicker, labels, sheet meta */
  --meta:#7a7a77;         /* ~4.7:1 sobre paper · para times/notes */

  --ff-display:"Modric","Cormorant Garamond",Georgia,serif;
  --ff-body:"Open Sans",system-ui,-apple-system,"SF Pro Text","Helvetica Neue",sans-serif;

  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px;
  --s-6:24px; --s-7:32px; --s-8:40px; --s-9:56px; --s-10:72px;

  --r-xs:8px; --r-sm:12px; --r-md:18px; --r-lg:24px; --r-xl:32px; --r-pill:999px;

  --sh-1:0 1px 2px rgba(0,0,0,.06), 0 0 0 1px rgba(255,255,255,.03);
  --sh-2:0 12px 32px -16px rgba(0,0,0,.45), 0 2px 6px rgba(0,0,0,.18);
  --sh-3:0 24px 56px -24px rgba(0,0,0,.55), 0 6px 14px rgba(0,0,0,.25);

  --topbar-h:64px;
  --dock-h:88px;
  --dock-clearance:120px;     /* padding-bottom seguro para que el dock no tape */
  --safe-top:env(safe-area-inset-top,0px);
  --safe-bot:env(safe-area-inset-bottom,0px);

  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-soft:cubic-bezier(.4,0,.2,1);
}

/* ───── Reset selectivo ───── */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0;background:#0e0e0d}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--ff-body);
  color:var(--jet);
  font-size:16px; line-height:1.45;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  overflow:hidden;
  min-height:100vh; min-height:100dvh;
}
img,svg,picture,video{display:block;max-width:100%}
img{height:auto}
[hidden]{display:none !important}
button{font:inherit;color:inherit;border:0;background:none;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,h5,h6,p{margin:0}
:focus-visible{outline:2px solid var(--rose-deep);outline-offset:2px;border-radius:6px}
::selection{background:var(--rose);color:var(--jet)}

/* =========================================================
   DEVICE FRAME · iOS-like en desktop, full-bleed en móvil
   ========================================================= */
.device{
  position:relative; margin:0 auto;
  width:100%; height:100vh; height:100dvh;
  background:var(--paper);
  overflow:hidden; isolation:isolate;
}
@media (min-width:760px){
  body{
    background:radial-gradient(ellipse at top,#1a1a19 0%,#0b0b0a 70%);
    display:grid; place-items:center; overflow:auto;
  }
  .device{
    width:min(420px,calc(100vw - 64px));
    height:min(900px,calc(100vh - 64px));
    border-radius:54px;
    box-shadow:
      0 48px 120px -32px rgba(0,0,0,.85),
      0 0 0 11px #0c0c0b,
      0 0 0 12px #1f1f1e,
      inset 0 0 0 1px rgba(255,255,255,.04);
  }
  .device__notch{
    position:absolute; top:10px; left:50%; transform:translateX(-50%);
    width:120px; height:30px; background:#0c0c0b;
    border-radius:0 0 22px 22px; z-index:80; pointer-events:none;
  }
}
.device__screen{
  position:absolute; inset:0;
  display:flex; flex-direction:column;
  background:var(--paper); overflow:hidden;
}

/* =========================================================
   TOPBAR
   ========================================================= */
.topbar{
  position:relative; z-index:50;
  height:calc(var(--topbar-h) + var(--safe-top));
  padding-top:var(--safe-top);
  padding-inline:var(--s-5);
  display:flex; align-items:center; justify-content:space-between; gap:var(--s-3);
  background:linear-gradient(to bottom,rgba(250,246,241,.96) 0%,rgba(250,246,241,.78) 65%,rgba(250,246,241,0) 100%);
  backdrop-filter:saturate(160%) blur(18px);
  -webkit-backdrop-filter:saturate(160%) blur(18px);
}
.topbar::before{
  content:""; position:absolute; inset:auto 0 0 0; height:1px;
  background:linear-gradient(to right,transparent 0,rgba(42,42,41,.08) 30%,rgba(42,42,41,.08) 70%,transparent);
}
.topbar__logo{
  flex:0 0 auto; display:inline-flex; align-items:center;
  height:48px; padding:4px 0;
}
.topbar__actions{
  display:inline-flex; align-items:center;
  gap:6px;                 /* ajustes finos: gemelos pegados */
  flex-shrink:0;
}
.topbar__actions > .topbar__cta{
  margin-left:6px;         /* respiro antes del CTA principal */
}

/* ───── Cluster orgánico · gemelos del topbar (Chat + Tickets) ───── */
.topbar .cv-chat-fab,
.topbar__tickets{
  width:40px; height:40px;
  border-radius:50%;
  background:rgba(254,186,177,.20);
  color:var(--jet);
  border:1px solid rgba(232,154,146,.18);
  box-shadow:
    0 1px 2px rgba(42,42,41,.05),
    0 6px 16px -10px rgba(42,42,41,.18);
  display:grid; place-items:center;
  padding:0;
  transition:transform .18s var(--ease), background .25s var(--ease), box-shadow .2s var(--ease);
}
.topbar .cv-chat-fab:hover,
.topbar__tickets:hover{
  background:rgba(254,186,177,.34);
  transform:translateY(-1px);
  box-shadow:
    0 1px 2px rgba(42,42,41,.06),
    0 8px 18px -10px rgba(232,154,146,.55);
}
.topbar .cv-chat-fab:active,
.topbar__tickets:active{ transform:scale(.94) }
.topbar .cv-chat-fab svg,
.topbar__tickets svg{ width:18px; height:18px; stroke-width:1.7 }

/* Tickets: micro-rotación en el ícono = "ticket arrancado" */
.topbar__tickets svg{ transform:rotate(-6deg) }
.topbar__tickets:hover svg{ transform:rotate(-3deg) }

/* Texto del Tickets oculto siempre (icon-only en cluster gemelo) */
.topbar__tickets span{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* Dot de notificación en chat — más sutil, con paper border */
.topbar .cv-chat-fab__dot{
  position:absolute; top:1px; right:1px;
  width:7px; height:7px; border-radius:50%;
  background:var(--rose-deep);
  box-shadow:0 0 0 1.5px var(--paper);
  display:none;
}
.topbar .cv-chat-fab[data-fresh="1"] .cv-chat-fab__dot{
  display:block;
  animation:fabDotPulse 3.5s var(--ease) infinite;
}
@keyframes fabDotPulse{
  0%,100%{ transform:scale(1); opacity:1 }
  50%    { transform:scale(1.25); opacity:.7 }
}

/* Reservar — CTA principal, prominente */
.topbar__logo img{
  height:38px; width:auto; max-width:140px; object-fit:contain;
  transition:filter .35s var(--ease);
}
.topbar__cta{
  flex:0 0 auto;
  height:48px; padding:0 24px;
  border-radius:var(--r-pill);
  background:var(--rose); color:var(--jet);
  font-family:var(--ff-display); font-weight:700; font-size:15px; letter-spacing:.3px;
  display:inline-flex; align-items:center; gap:8px;
  box-shadow:
    0 6px 20px -6px rgba(232,154,146,.55),
    inset 0 1px 0 rgba(255,255,255,.15);
  transition:transform .15s var(--ease), background .2s var(--ease), box-shadow .2s var(--ease);
}
.topbar__cta:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 24px -6px rgba(232,154,146,.7), inset 0 1px 0 rgba(255,255,255,.15);
}
.topbar__cta:active{transform:scale(.97)}
.topbar__cta:focus-visible{ outline:2px solid var(--rose-deep); outline-offset:2px }

/* ───── Chat FAB flotante ───── */
.cv-chat-fab--float{
  position:absolute;
  top:calc(var(--safe-top, 0px) + 72px);
  right:var(--s-4);
  z-index:90;
  width:52px; height:52px;
  border-radius:50%;
  background:var(--jet); color:var(--rose);
  border:1.5px solid rgba(254,186,177,.25);
  box-shadow:
    0 4px 18px -4px rgba(42,42,41,.45),
    0 1px 3px rgba(42,42,41,.12);
  display:grid; place-items:center;
  padding:0;
  transition:transform .18s var(--ease), background .25s var(--ease), box-shadow .2s var(--ease);
}
.cv-chat-fab--float svg{ width:22px; height:22px; stroke-width:1.8 }
.cv-chat-fab--float:hover{
  transform:scale(1.08);
  background:var(--rose); color:var(--jet);
  box-shadow:0 6px 22px -4px rgba(232,154,146,.6);
}
.cv-chat-fab--float:active{ transform:scale(.94) }
.cv-chat-fab--float .cv-chat-fab__dot{
  position:absolute; top:2px; right:2px;
  width:9px; height:9px; border-radius:50%;
  background:var(--rose);
  box-shadow:0 0 0 2px var(--jet);
  display:none;
}
.cv-chat-fab--float[data-fresh="1"] .cv-chat-fab__dot{
  display:block;
  animation:fabDotPulse 3.5s var(--ease) infinite;
}

/* =========================================================
   STAGE / VIEWS
   ========================================================= */
.stage{position:relative; flex:1 1 auto; overflow:hidden; min-height:0; background:var(--paper)}
.view{
  position:absolute; inset:0;
  overflow-y:auto; overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding-bottom:var(--s-5);
  background:var(--paper);
  scrollbar-width:none;
}
.view::-webkit-scrollbar{display:none}
.view__inner{
  padding:var(--s-6) var(--s-5) var(--s-5);
  display:flex; flex-direction:column; gap:var(--s-7);
}

.view__head .kicker{
  font-family:var(--ff-body); font-size:11px; font-weight:700;
  letter-spacing:2.5px; text-transform:uppercase;
  color:var(--label); margin-bottom:var(--s-3);
}
.display{
  font-family:var(--ff-display); font-weight:700;
  font-size:clamp(34px,9vw,46px); line-height:1.02;
  letter-spacing:-.5px; color:var(--jet);
}
.display em{font-style:normal; color:var(--rose-deep); font-family:var(--ff-display)}
.lead{
  margin-top:var(--s-4);
  color:var(--jet-80); font-size:15px; line-height:1.55; max-width:34ch;
}

/* =========================================================
   HERO
   ========================================================= */
.hero{
  position:relative; border-radius:var(--r-lg); overflow:hidden;
  aspect-ratio:4/5; background:#1a1a18; box-shadow:var(--sh-3);
}
.hero img{width:100%; height:100%; object-fit:cover; transform:scale(1.02)}
.hero__veil{
  position:absolute; inset:0;
  background:linear-gradient(to top,rgba(20,20,19,.78) 0%,rgba(20,20,19,.18) 50%,rgba(20,20,19,0) 70%);
}
.hero__caption{
  position:absolute; left:var(--s-5); right:var(--s-5); bottom:var(--s-5);
  color:var(--white); display:flex; flex-direction:column; gap:var(--s-3);
}
.hero__caption h2{
  font-family:var(--ff-display); font-weight:700;
  font-size:clamp(22px,6vw,30px); line-height:1.05; letter-spacing:-.3px;
}

/* =========================================================
   BLOCKS
   ========================================================= */
.block{display:flex; flex-direction:column; gap:var(--s-4)}
.block__head{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:var(--s-3); padding-inline:var(--s-1);
}
.block__head h3{
  font-family:var(--ff-display); font-weight:700;
  font-size:22px; letter-spacing:-.2px; color:var(--jet);
}
.block__sub{
  font-family:var(--ff-body); font-size:11px; font-weight:600;
  letter-spacing:1.5px; text-transform:uppercase;
  color:var(--label);
}

/* =========================================================
   CARRUSEL
   ========================================================= */
.carousel{
  display:flex; gap:var(--s-3);
  overflow-x:auto; overflow-y:visible;
  scroll-snap-type:x mandatory;
  padding:4px var(--s-1) var(--s-3);
  margin-inline:calc(-1 * var(--s-5));
  padding-inline:var(--s-5);
  scrollbar-width:none; scroll-padding-left:var(--s-5);
}
.carousel::-webkit-scrollbar{display:none}
.card-amb{
  flex:0 0 auto; width:78%; max-width:300px;
  border-radius:var(--r-md); overflow:hidden; background:var(--white);
  scroll-snap-align:start; box-shadow:var(--sh-2);
  transform:translateZ(0); position:relative;
}
.card-amb picture{display:block; aspect-ratio:4/5; overflow:hidden}
.card-amb img{width:100%; height:100%; object-fit:cover}
.card-amb__body{padding:14px 16px 18px}
.card-amb__body h4{
  font-family:var(--ff-display); font-weight:700; font-size:18px; color:var(--jet);
}
.card-amb__body p{font-size:13px; color:var(--meta); margin-top:2px}
.card-amb--signature{outline:2px solid var(--rose); outline-offset:-2px}

.carousel--soft .step{
  flex:0 0 auto; width:78%; max-width:300px;
  scroll-snap-align:start; background:var(--white);
  border-radius:var(--r-md); padding:22px 20px;
  box-shadow:var(--sh-2);
  display:flex; flex-direction:column; gap:10px;
  border:1px solid rgba(42,42,41,.05);
}
.step__num{
  font-family:var(--ff-display); font-weight:700;
  font-size:34px; letter-spacing:-1px; color:var(--rose-deep); line-height:.9;
}
.step h4{font-family:var(--ff-display); font-size:20px; color:var(--jet)}
.step p{font-size:13.5px; color:var(--jet-80); line-height:1.5}

/* =========================================================
   GRID · coctelería tiles
   ========================================================= */
.grid-2{display:grid; grid-template-columns:repeat(2,1fr); gap:var(--s-3)}
.tile{
  background:var(--white); border-radius:var(--r-md);
  padding:14px 14px 16px; box-shadow:var(--sh-1);
  border:1px solid rgba(42,42,41,.05);
  display:flex; flex-direction:column; gap:6px; min-height:128px;
}
.tile__tag{
  display:inline-flex; align-self:flex-start;
  padding:3px 9px; border-radius:var(--r-pill);
  background:rgba(42,42,41,.08); color:var(--jet);
  font-size:10px; font-weight:700; letter-spacing:1px; text-transform:uppercase;
}
.tile__tag--signature{background:var(--jet); color:var(--rose)}
.tile h4{font-family:var(--ff-display); font-weight:700; font-size:17px; color:var(--jet); line-height:1.1}
.tile p{font-size:12.5px; color:var(--jet-80); line-height:1.45}

/* =========================================================
   PILL universal
   ========================================================= */
.pill{
  display:inline-flex; align-items:center; gap:6px;
  padding:5px 11px; border-radius:var(--r-pill);
  background:rgba(42,42,41,.08); color:var(--jet);
  font-size:11.5px; font-weight:600; letter-spacing:.3px;
  white-space:nowrap; border:1px solid rgba(42,42,41,.05);
}
.pill--rose{background:var(--rose); color:var(--jet); border-color:rgba(0,0,0,.06)}
.pill--dark{background:var(--jet); color:var(--rose); border-color:rgba(255,255,255,.06)}

.legal{
  text-align:center; font-size:11px; letter-spacing:.4px;
  color:var(--meta); padding-top:var(--s-4);
}

/* =========================================================
   UBICACIÓN
   ========================================================= */
.map-card{
  position:relative; border-radius:var(--r-lg); overflow:hidden;
  height:300px; box-shadow:var(--sh-2);
  border:1px solid rgba(42,42,41,.06);
  background:#e8e3dc;
}
.map-card iframe{
  position:absolute; inset:0; z-index:2;
  width:100%; height:100%; border:0;
  filter:grayscale(.15) contrast(1.02);
  background:transparent;
}
/* Skeleton de fallback debajo del iframe */
.map-card__skeleton{
  position:absolute; inset:0; z-index:1;
  display:grid; place-items:center;
  background:
    radial-gradient(circle at 50% 40%,#f4ede4 0%,#e3dcd2 60%,#cdc5ba 100%);
}
.map-card__grid{
  position:absolute; inset:0;
  background:
    linear-gradient(0deg,rgba(42,42,41,.08) 1px,transparent 1px) 0 0/40px 40px,
    linear-gradient(90deg,rgba(42,42,41,.08) 1px,transparent 1px) 0 0/40px 40px;
  opacity:.6;
}
.map-card__pin{
  width:54px; height:54px; border-radius:50%;
  background:var(--jet); color:var(--rose);
  display:grid; place-items:center;
  box-shadow:0 12px 30px -10px rgba(0,0,0,.4), 0 0 0 8px rgba(254,186,177,.2);
  animation:pinPulse 2.4s var(--ease) infinite;
}
.map-card__pin svg{width:26px; height:26px}
@keyframes pinPulse{
  0%,100%{box-shadow:0 12px 30px -10px rgba(0,0,0,.4), 0 0 0 8px rgba(254,186,177,.2)}
  50%{box-shadow:0 12px 30px -10px rgba(0,0,0,.4), 0 0 0 16px rgba(254,186,177,.05)}
}
.map-card__overlay{
  position:absolute; left:14px; bottom:14px; right:14px; z-index:3;
  display:flex; justify-content:center; pointer-events:none;
}
.map-card__overlay .pill{box-shadow:var(--sh-2); pointer-events:auto}

.route-row{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s-3)}
.route{
  display:flex; flex-direction:column; align-items:center; gap:8px;
  padding:14px 8px; min-height:96px;
  border-radius:var(--r-md); background:var(--white);
  box-shadow:var(--sh-1); border:1px solid rgba(42,42,41,.05);
  color:var(--jet);
  transition:transform .15s var(--ease), box-shadow .2s var(--ease);
}
.route:hover{transform:translateY(-1px); box-shadow:var(--sh-2)}
.route:active{transform:scale(.98)}
.route__icon{
  width:42px; height:42px; border-radius:var(--r-md);
  background:var(--jet); color:var(--rose);
  display:grid; place-items:center;
}
.route__icon svg{width:22px; height:22px}
.route__label{font-size:12.5px; font-weight:700}

.info-list{
  background:var(--white); border-radius:var(--r-md);
  box-shadow:var(--sh-1); border:1px solid rgba(42,42,41,.05);
  overflow:hidden;
}
.info-list li{border-bottom:1px solid rgba(42,42,41,.06)}
.info-list li:last-child{border-bottom:0}
.info-list li > span:first-child,
.info-list__row{
  display:flex; justify-content:space-between; align-items:center;
  padding:14px 16px; min-height:48px;
}
.info-list__row{color:var(--jet); width:100%}
.info-list__k{font-size:13px; color:var(--label); font-weight:600}
.info-list__v{font-size:14px; font-weight:600; color:var(--jet)}
.info-list li > span{display:flex; justify-content:space-between; align-items:center; padding:14px 16px; min-height:48px}

.schedule{
  background:var(--jet); color:var(--rose);
  border-radius:var(--r-md); padding:18px 18px 8px;
  box-shadow:var(--sh-2);
}
.schedule h3{
  font-family:var(--ff-display); font-size:18px;
  color:var(--rose); margin-bottom:10px;
}
.schedule ul li{
  display:flex; justify-content:space-between;
  padding:9px 0; border-bottom:1px solid rgba(254,186,177,.14);
  font-size:13.5px; color:#f5e7e3;
}
.schedule ul li:last-child{border-bottom:0}
.schedule ul li span:first-child{color:#fffaf8; opacity:.78}

/* =========================================================
   PROMOCIONES — acordeón de posters
   ========================================================= */
.posters{
  display:grid; grid-template-columns:1fr;
  gap:10px;
}

.poster{
  position:relative;
  width:100%;
  min-height:100px;
  border-radius:18px;
  padding:14px 48px 14px 16px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-areas:
    "title corner"
    "chip corner"
    "panel panel";
  align-items:center;
  row-gap:6px;
  overflow:hidden; box-shadow:var(--sh-2);
  border:1px solid rgba(42,42,41,.06);
  isolation:isolate;
}
.poster::before{
  content:"";
  position:absolute; right:18px; top:50%;
  width:9px; height:9px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:translateY(-62%) rotate(45deg);
  opacity:.72;
  transition:transform .22s var(--ease), opacity .22s var(--ease);
}
.poster::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(90deg,rgba(0,0,0,.10),transparent 46%),
    radial-gradient(circle at 92% 0%,rgba(255,255,255,.20) 0%,transparent 44%);
}
.poster__corner{
  grid-area:corner;
  justify-self:end;
  padding-left:12px;
  font-family:var(--ff-display); font-weight:700;
  font-size:20px; letter-spacing:-.2px;
  opacity:.82;
}
.poster__big{
  grid-area:title;
  min-width:0;
  font-family:var(--ff-display); font-weight:700;
  font-size:clamp(24px,7vw,32px); line-height:.9;
  letter-spacing:0; text-transform:uppercase;
  display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 8px;
}
.poster__big span{white-space:nowrap}
.poster__big .emph{
  display:inline-block;
  background:rgba(0,0,0,.08);
  padding:1px 7px 3px;
  border-radius:7px;
}
.poster__chip{
  grid-area:chip;
  display:inline-flex; align-self:start; justify-self:start;
  padding:5px 10px; border-radius:var(--r-pill);
  background:var(--jet); color:var(--rose);
  font-family:var(--ff-body); font-size:10px; font-weight:700;
  letter-spacing:.8px; text-transform:uppercase;
}
.poster__panel{
  grid-area:panel;
  display:none;
  position:relative;
  z-index:1;
  padding-top:10px;
}
.poster__gallery{
  display:grid;
  grid-template-columns:1.3fr .7fr;
  gap:8px;
  height:178px;
}
.poster__gallery img{
  width:100%; height:100%;
  object-fit:cover;
  border-radius:14px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);
}
.poster__gallery-stack{
  display:grid; gap:8px;
}
.poster__info{
  margin-top:12px;
  padding:12px;
  border-radius:14px;
  background:rgba(255,255,255,.18);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.poster__info h3{
  margin:0 0 4px;
  font-family:var(--ff-display);
  font-size:21px;
  line-height:1;
  letter-spacing:0;
}
.poster__info p{
  margin:0;
  font-size:12.5px;
  line-height:1.45;
  font-weight:600;
  color:currentColor;
  opacity:.82;
}
.poster.is-open{
  min-height:420px;
  align-items:start;
  padding-block:18px;
}
.poster.is-open::before{
  transform:translateY(-35%) rotate(225deg);
  opacity:1;
}
.poster.is-open .poster__panel{display:block}

.poster--mujer    {background:linear-gradient(140deg,#FFD4CD,var(--rose));   color:var(--jet)}
.poster--bday     {background:linear-gradient(140deg,#1a1a19,var(--jet));    color:var(--rose)}
.poster--bday .poster__big .emph{background:var(--rose); color:var(--jet)}
.poster--early    {background:linear-gradient(140deg,var(--rose),#FBA39A);   color:var(--jet)}
.poster--despedida{background:linear-gradient(140deg,#222220,#3a3a37);       color:var(--rose)}
.poster--despedida .poster__big .emph{background:var(--rose); color:var(--jet)}
.poster--anticip  {background:linear-gradient(140deg,#FFD4CD,#F1A89E);       color:var(--jet)}
.poster--aniv     {background:linear-gradient(140deg,#2A2A29,#3F3F3D);       color:var(--rose)}
.poster--aniv .poster__big .emph{background:var(--rose); color:var(--jet)}

.poster--mujer,
.poster--early,
.poster--anticip{
  color:#1A1A1C;
}
.poster--mujer .poster__chip,
.poster--early .poster__chip,
.poster--anticip .poster__chip{
  background:rgba(26,26,28,.10);
  color:#1A1A1C;
}
.poster--mujer .poster__big .emph,
.poster--early .poster__big .emph,
.poster--anticip .poster__big .emph{
  background:rgba(26,26,28,.12);
  color:#1A1A1C;
}

/* Posters de fondo oscuro: chip rose + jet */
.poster--bday .poster__chip,
.poster--despedida .poster__chip,
.poster--aniv .poster__chip{background:var(--rose); color:var(--jet)}

/* Poster clickable state */
.poster[data-gallery]{cursor:pointer; -webkit-tap-highlight-color:transparent}
.poster[data-gallery]:hover{transform:translateY(-1px); box-shadow:var(--sh-3)}
.poster[data-gallery]:active{transform:scale(.99)}
.poster[data-gallery]:focus-visible{outline:2px solid var(--rose-deep); outline-offset:3px}
.poster[data-gallery]{
  transition:min-height .28s var(--ease), transform .2s var(--ease), box-shadow .2s var(--ease), filter .2s var(--ease);
}

.fineprint{
  text-align:center; font-size:11.5px; color:var(--label);
  line-height:1.45; padding:0 var(--s-2); font-weight:500;
}

/* =========================================================
   EVENTOS — featured + cards top-tier
   ========================================================= */
.event-feature{
  position:relative; border-radius:var(--r-xl);
  overflow:hidden; aspect-ratio:4/5;
  box-shadow:var(--sh-3); background:#1a1a18;
}
.event-feature img{width:100%; height:100%; object-fit:cover}
.event-feature__veil{
  position:absolute; inset:0;
  background:
    linear-gradient(to top,rgba(20,20,19,.92) 0%,rgba(20,20,19,.30) 55%,rgba(20,20,19,0) 75%),
    linear-gradient(to bottom,rgba(20,20,19,.45) 0%,rgba(20,20,19,0) 30%);
}
.event-feature__corner{
  position:absolute; top:18px; left:20px; z-index:2;
  display:flex; flex-direction:column; align-items:flex-start; gap:2px;
  color:var(--rose);
}
.event-feature__day{
  font-family:var(--ff-display); font-weight:800;
  font-size:42px; line-height:.9; letter-spacing:-1px;
}
.event-feature__date{
  font-family:var(--ff-body); font-size:13px; font-weight:700;
  letter-spacing:1.5px; opacity:.85;
}
.event-feature__body{
  position:absolute; left:var(--s-5); right:var(--s-5); bottom:var(--s-6);
  color:var(--white); display:flex; flex-direction:column; gap:var(--s-3);
  z-index:2;
}
.event-feature__body h2{
  font-family:var(--ff-display); font-weight:700;
  font-size:clamp(28px,7.5vw,36px); line-height:1.02; letter-spacing:-.4px;
}
.event-feature__body em{font-style:normal; color:var(--rose)}
.event-feature__body p{
  font-size:13px; opacity:.9; letter-spacing:.3px;
}
.event-feature__pills{display:flex; gap:6px; flex-wrap:wrap}
.event-feature__pills .pill{
  background:rgba(255,255,255,.16); color:var(--white);
  border-color:rgba(255,255,255,.18);
  backdrop-filter:blur(8px);
}
.event-feature__pills .pill--rose{
  background:var(--rose); color:var(--jet); border-color:rgba(0,0,0,.06);
}
.event-feature__cta{
  display:flex; gap:10px; flex-wrap:wrap; margin-top:var(--s-2);
}

.btn{
  height:44px; padding:0 18px;
  border-radius:var(--r-pill);
  font-family:var(--ff-body); font-weight:700; font-size:13.5px;
  letter-spacing:.4px;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  transition:transform .15s var(--ease), background .2s var(--ease);
}
.btn:active{transform:scale(.97)}
.btn--rose{background:var(--rose); color:var(--jet); box-shadow:var(--sh-2)}
.btn--rose:hover{background:var(--rose-soft)}
.btn--rose:disabled{opacity:.5; cursor:not-allowed}
.btn--ghost{
  background:transparent; color:var(--white);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.45);
}
.btn--ghost:hover{background:rgba(255,255,255,.08)}
.btn--mini{height:40px; padding:0 16px; font-size:13px}
.btn--block{width:100%}

.agenda{display:flex; flex-direction:column; gap:var(--s-4)}
.event-card{
  display:flex; gap:14px; align-items:stretch;
  background:var(--white); border-radius:var(--r-md);
  padding:14px;
  box-shadow:var(--sh-1);
  border:1px solid rgba(42,42,41,.05);
  transition:box-shadow .25s var(--ease);
}
.event-card:hover{box-shadow:var(--sh-2)}
.event-card__media{
  flex:0 0 96px; align-self:stretch;
  background:var(--rose); color:var(--jet);
  border-radius:var(--r-sm); padding:10px;
  display:flex; flex-direction:column; justify-content:space-between;
  position:relative;
}
.event-card__media[data-day]::before{
  content:attr(data-day);
  font-family:var(--ff-display); font-weight:800;
  font-size:30px; line-height:.95; letter-spacing:-.5px;
}
.event-card__media--dark{background:var(--jet); color:var(--rose)}
.event-card__time{
  font-family:var(--ff-body); font-size:11px; font-weight:700;
  letter-spacing:1.5px; opacity:.85; align-self:flex-end;
}
.event-card__body{
  flex:1 1 auto; display:flex; flex-direction:column; gap:8px; min-width:0;
}
.event-card__body h3{
  font-family:var(--ff-display); font-size:21px; font-weight:700;
  line-height:1.05; letter-spacing:-.2px;
}
.event-card__body p{font-size:13px; color:var(--jet-80); line-height:1.45}
.event-card__pills{display:flex; gap:6px; flex-wrap:wrap}
.event-card__cta{display:flex; gap:8px; margin-top:auto; padding-top:4px}

.event-card--featured{
  background:linear-gradient(135deg,#1f1f1e,#2A2A29);
  color:var(--rose);
  border-color:rgba(254,186,177,.1);
  box-shadow:var(--sh-3);
}
.event-card--featured .event-card__body p{color:rgba(254,186,177,.85)}

/* =========================================================
   DOCK · floating tray (no Apple)
   ========================================================= */
.dock{
  position:relative; flex-shrink:0;            /* en el flujo, NO overlay sobre contenido */
  z-index:60;
  padding:10px var(--s-4) calc(var(--safe-bot) + 10px);
  display:flex; flex-direction:column; align-items:center;
  pointer-events:none;
  background:linear-gradient(to top, var(--paper) 70%, rgba(250,246,241,0));
  box-shadow:
    0 -8px 24px -16px rgba(0,0,0,.18),
    0 -1px 0 rgba(42,42,41,.06);
}
.dock ul{
  display:flex; align-items:center; justify-content:space-between;
  gap:6px; padding:8px;
  border-radius:26px;
  background:rgba(42,42,41,.78);
  box-shadow:
    0 18px 40px -16px rgba(0,0,0,.55),
    0 4px 14px rgba(0,0,0,.18),
    inset 0 0 0 1px rgba(255,255,255,.06),
    inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:saturate(180%) blur(22px);
  -webkit-backdrop-filter:saturate(180%) blur(22px);
  pointer-events:auto;
  width:min(360px, 92%);
}
.dock li{flex:1 1 0; display:flex; justify-content:center}
.dock__btn{
  position:relative; width:56px; height:56px;
  border-radius:18px; display:grid; place-items:center;
  color:var(--rose);
  transition:transform .18s var(--ease-soft), background .25s var(--ease-soft);
}
.dock__btn::after{
  content:""; position:absolute; left:50%; bottom:-7px;
  transform:translateX(-50%) scale(.4);
  width:6px; height:6px; border-radius:50%;
  background:var(--rose); opacity:0;
  transition:transform .25s var(--ease), opacity .25s var(--ease);
}
.dock__btn.is-active{
  background:linear-gradient(180deg,rgba(254,186,177,.20),rgba(254,186,177,.08));
  box-shadow:inset 0 0 0 1px rgba(254,186,177,.25);
}
.dock__btn.is-active::after{opacity:1; transform:translateX(-50%) scale(1)}
.dock__btn:active{transform:scale(.92)}
.dock__svg{width:26px; height:26px}
.dock__home{
  width:120px; height:5px; border-radius:3px;
  background:rgba(42,42,41,.55); margin-top:8px;
}

/* =========================================================
   SHEET / MODAL
   ========================================================= */
.sheet{
  position:absolute; inset:0;
  width:100%; height:100%; max-width:none; max-height:none;
  margin:0; padding:0; border:0; background:transparent;
  z-index:90;
  overflow:hidden;
}
.sheet:not([open]){display:none}
.sheet::backdrop{display:none}
.sheet[open]{
  background:rgba(20,20,19,.55);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  animation:sheetFade .25s var(--ease);
}
@keyframes sheetFade{from{opacity:0}to{opacity:1}}

.sheet__wrap{
  position:absolute; left:0; right:0; bottom:0;
  width:100%; max-width:100%;
  height:94%;
  background:var(--paper);
  border-radius:24px 24px 0 0;
  box-shadow:0 -24px 60px -20px rgba(0,0,0,.45);
  display:flex; flex-direction:column; overflow:hidden;
  transform:translateY(100%);
  animation:sheetSlide .35s var(--ease) forwards;
  contain:layout paint;
}
@keyframes sheetSlide{to{transform:translateY(0)}}

.sheet__head{
  position:relative;
  padding:14px 16px 12px;
  text-align:center;
  border-bottom:1px solid rgba(42,42,41,.07);
  background:rgba(250,246,241,.96);
  backdrop-filter:saturate(160%) blur(14px);
}
.sheet__head::before{
  content:""; position:absolute;
  left:50%; top:7px; transform:translateX(-50%);
  width:42px; height:5px; border-radius:3px;
  background:rgba(42,42,41,.18);
}
.sheet__head h2{
  font-family:var(--ff-display); font-size:19px; font-weight:700;
  color:var(--jet); margin-top:8px;
}
.sheet__close{
  position:absolute; left:8px; top:11px;
  width:44px; height:44px; border-radius:50%;
  background:rgba(42,42,41,.06); color:var(--jet);
  font-size:24px; line-height:1; font-weight:300;
  display:grid; place-items:center;
}
.sheet__provisional{
  display:inline-block; margin-top:6px;
  font-size:10.5px; letter-spacing:1px; text-transform:uppercase;
  color:var(--label); font-weight:600;
}

.sheet__body{
  flex:1 1 auto;
  overflow-y:auto; overflow-x:hidden;
  overscroll-behavior:contain;
  padding:var(--s-5);
  display:flex; flex-direction:column; gap:var(--s-7);
  -webkit-overflow-scrolling:touch;
  width:100%; max-width:100%;
  min-width:0;
}
.step-block{min-width:0}
.sheet__foot{
  padding:14px 16px calc(var(--safe-bot) + 14px);
  background:var(--paper);
  border-top:1px solid rgba(42,42,41,.07);
  display:flex; flex-direction:column; gap:8px;
}
.summary{
  font-size:13px; color:var(--jet-80); text-align:center; line-height:1.4;
  font-weight:500;
}

.step-block{display:flex; flex-direction:column; gap:var(--s-3)}
.step-block h3{
  font-family:var(--ff-display); font-size:18px; color:var(--jet); margin-bottom:2px;
}

/* Segmento */
.seg{
  display:flex; gap:4px; padding:4px;
  background:rgba(42,42,41,.07);
  border-radius:var(--r-pill);
}
.seg__btn{
  flex:1 1 0; height:40px;
  border-radius:var(--r-pill);
  font-size:13px; font-weight:600; color:var(--jet);
  transition:background .25s var(--ease), color .2s var(--ease), box-shadow .2s var(--ease);
}
.seg__btn:not(.is-active){opacity:.55}
.seg__btn.is-active{
  background:var(--white); color:var(--jet);
  box-shadow:0 1px 3px rgba(0,0,0,.08), 0 0 0 1px rgba(42,42,41,.06);
}

/* Floor meta pills */
.floor-meta{
  display:flex; gap:8px; flex-wrap:wrap;
  padding:0 2px;
}
.meta-pill{
  display:inline-flex; padding:5px 11px; border-radius:var(--r-pill);
  background:var(--jet); color:var(--rose);
  font-size:11px; font-weight:700; letter-spacing:.6px;
  text-transform:uppercase;
}

/* =========================================================
   FLOOR PLAN — Orgánico SVG · Cantinero v3
   ========================================================= */
.floor-stage{
  background:var(--paper);
  border-radius:var(--r-md);
  padding:10px;
  border:1px solid rgba(42,42,41,.06);
  box-shadow:var(--sh-1);
  width:100%; max-width:100%;
  overflow:hidden;
  box-sizing:border-box;
}
.floor-plan{
  position:relative; width:100%; max-width:100%;
  border-radius:var(--r-sm); overflow:hidden;
  background:var(--paper);
}
.floor-plan-svg{
  display:block; width:100%; height:auto;
  background:transparent;
  border-radius:var(--r-sm);
  user-select:none;
}

/* Zonas — manchas suaves */
.floor-plan-svg .zone{
  fill:rgba(254,186,177,.07);
  stroke:rgba(42,42,41,.05);
  stroke-width:.18;
}
.floor-plan-svg .zone--bar{
  fill:rgba(42,42,41,.05);
}
.floor-plan-svg .zone--lounge{
  fill:rgba(254,186,177,.09);
}
.floor-plan-svg .zone--signature,
.floor-plan-svg .zone--vip{
  fill:rgba(254,186,177,.16);
  stroke:rgba(232,154,146,.18);
  animation:fpZoneBreathe 4s var(--ease) infinite;
}
.floor-plan-svg .zone--flag-preferential{
  fill:rgba(254,186,177,.12);
  stroke:rgba(232,154,146,.18);
}
@keyframes fpZoneBreathe{
  0%,100%{ fill-opacity:1 }
  50%    { fill-opacity:.62 }
}

.floor-plan-svg .zone-label{
  font-family:var(--ff-display);
  font-size:2.2px;
  fill:rgba(42,42,41,.5);
  letter-spacing:.06px;
  pointer-events:none;
  font-weight:500;
}

/* Mesas — guijarros orgánicos */
.floor-plan-svg .table-group{
  cursor:pointer;
  transition:transform .18s var(--ease);
  transform-box:fill-box;
  transform-origin:center;
  outline:none;
}
.floor-plan-svg .table-group:hover{ transform:scale(1.04) }
.floor-plan-svg .table-group:active{ transform:scale(.97) }
.floor-plan-svg .table-group:focus-visible .table-shape{
  stroke:var(--rose-deep);
  stroke-width:.45;
}

.floor-plan-svg .table-shape{
  fill:var(--white);
  stroke:rgba(42,42,41,.20);
  stroke-width:.22;
  transition:fill .2s var(--ease), stroke .2s var(--ease), stroke-width .2s var(--ease);
}
.floor-plan-svg .table-group:hover .table-shape{
  fill:rgba(254,186,177,.45);
  stroke:var(--rose-deep);
  stroke-width:.32;
}
.floor-plan-svg .table-group.is-selected .table-shape{
  fill:var(--rose);
  stroke:var(--rose-deep);
  stroke-width:.5;
  filter:drop-shadow(0 .4px .8px rgba(232,154,146,.5));
}

/* Variantes por kind */
.floor-plan-svg .table-group--bar .table-shape{
  fill:rgba(42,42,41,.16);
  stroke:rgba(42,42,41,.55);
}
.floor-plan-svg .table-group--bar:hover .table-shape{
  fill:rgba(42,42,41,.45);
}
.floor-plan-svg .table-group--bar.is-selected .table-shape{
  fill:var(--jet);
  stroke:var(--jet);
}

/* Variantes por flag */
.floor-plan-svg .table-group--signature .table-shape{
  stroke:var(--rose-deep);
  stroke-width:.34;
}
.floor-plan-svg .table-group--vip .table-shape{
  stroke:rgba(232,154,146,.6);
  stroke-width:.3;
  stroke-dasharray:.7 .4;
}
.floor-plan-svg .table-group--vip.is-selected .table-shape,
.floor-plan-svg .table-group--vip:hover .table-shape{
  stroke-dasharray:none;
}

/* Badge dorado para Signature */
.floor-plan-svg .table-badge{
  fill:var(--rose);
  stroke:var(--rose-deep);
  stroke-width:.18;
  pointer-events:none;
}

/* Etiquetas de mesa */
.floor-plan-svg .table-label{
  font-family:var(--ff-body);
  font-size:2.6px;
  font-weight:700;
  fill:var(--jet);
  letter-spacing:.04px;
  pointer-events:none;
  user-select:none;
}
.floor-plan-svg .table-group--bar .table-label{
  fill:var(--rose);
}
.floor-plan-svg .table-group--bar.is-selected .table-label{
  fill:var(--rose);
}
.floor-plan-svg .table-group.is-selected .table-label{
  fill:var(--jet);
  font-weight:800;
}

/* Leyenda */
.floor-legend{
  display:flex; flex-wrap:wrap; gap:14px; align-items:center;
  margin-top:10px; padding:0 4px;
  font-size:11.5px; color:var(--label); font-weight:600;
}
.floor-legend > span{display:inline-flex; align-items:center; gap:6px}
.floor-legend .dot{
  display:inline-block; width:10px; height:10px; border-radius:50%;
  background:var(--white); border:1px solid rgba(42,42,41,.25);
}
.floor-legend .dot--avail{border-color:rgba(42,42,41,.3)}
.floor-legend .dot--sel{background:var(--rose); border-color:var(--rose-deep)}
.floor-legend .dot--pref{background:rgba(254,186,177,.5); border:1px solid var(--rose-deep)}
.floor-legend .dot--bar{background:var(--jet); border-color:var(--jet)}

/* Detalle de mesa */
.table-detail{
  background:var(--white);
  border-radius:var(--r-md);
  padding:14px 16px;
  box-shadow:var(--sh-1);
  border:1px solid rgba(42,42,41,.06);
  display:flex; flex-direction:column; gap:10px;
  animation:tdEnter .25s var(--ease);
}
@keyframes tdEnter{from{opacity:0; transform:translateY(4px)}to{opacity:1; transform:translateY(0)}}
.table-detail__head{
  display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap;
}
.table-detail__head h4{
  font-family:var(--ff-display); font-size:18px; color:var(--jet);
}
.table-detail__note{font-size:12px; color:var(--label); line-height:1.45; font-weight:500}
.pills{display:flex; flex-wrap:wrap; gap:6px}

/* Form fields */
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:var(--s-3)}
.field{display:flex; flex-direction:column; gap:6px}
.field > span{
  font-size:11.5px; font-weight:600; letter-spacing:.8px;
  text-transform:uppercase; color:var(--label);
  padding-left:2px;
}
.field input, .field select{
  height:46px; padding:0 14px;
  border-radius:14px;
  border:1px solid rgba(42,42,41,.18);
  background:var(--white); color:var(--jet);
  font:inherit; font-size:15px;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
  -webkit-appearance:none; appearance:none;
}
.field select{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M2 4 l4 4 l4 -4' fill='none' stroke='%232A2A29' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:12px;
  padding-right:36px;
}
.field input:focus, .field select:focus{
  outline:none;
  border-color:var(--rose-deep);
  box-shadow:0 0 0 3px rgba(254,186,177,.3);
}

/* Ticket placeholder */
.ticket-empty{
  text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:14px;
  padding:32px 20px;
}
.ticket-empty svg{width:80px; height:80px; color:var(--rose-deep); opacity:.7}
.ticket-empty h3{font-family:var(--ff-display); font-size:24px; color:var(--jet)}
.ticket-empty p{font-size:14px; color:var(--jet-80); line-height:1.5; max-width:30ch}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important; transition:none !important}
  html{scroll-behavior:auto}
}

@media (max-width:340px){
  .display{font-size:30px}
  .grid-2{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .event-card{flex-direction:column}
  .event-card__media{flex-basis:auto}
}

/* =========================================================
   CARTA · vista pública
   ========================================================= */
.carta-cta{
  display:flex; flex-direction:column; gap:8px;
  background:var(--white); border-radius:var(--r-md);
  padding:14px 16px; box-shadow:var(--sh-1);
  border:1px solid rgba(42,42,41,.06);
}
.carta-cta .fineprint{margin:0; font-size:11.5px; color:var(--label); line-height:1.45}

.carta-tabs{
  display:flex; gap:6px; padding:4px;
  background:rgba(42,42,41,.07);
  border-radius:var(--r-pill);
}
.carta-tabs--compact{margin-top:2px}
.carta-tab{
  flex:1 1 0; height:38px;
  border-radius:var(--r-pill);
  font-size:13px; font-weight:600; color:var(--jet);
  letter-spacing:.3px;
  transition:background .25s var(--ease), color .2s var(--ease), box-shadow .2s var(--ease);
}
.carta-tab:not(.is-active){opacity:.55}
.carta-tab.is-active{
  background:var(--jet); color:var(--rose);
  box-shadow:0 1px 3px rgba(0,0,0,.12), 0 0 0 1px rgba(42,42,41,.08);
}

.carta-list{display:flex; flex-direction:column; gap:8px; width:100%; min-width:0}
.carta-item{
  display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px;
  background:var(--white); border-radius:var(--r-md);
  padding:12px 14px; box-shadow:var(--sh-1);
  border:1px solid rgba(42,42,41,.05);
  min-width:0; max-width:100%;
}
.carta-item__name{
  font-family:var(--ff-display); font-weight:700;
  font-size:15.5px; color:var(--jet); line-height:1.2;
  min-width:0;
}
.carta-item__prices{
  display:flex; flex-direction:column; align-items:flex-end; gap:2px;
  text-align:right;
}
.carta-item__price{
  font-size:14px; font-weight:700; color:var(--jet);
  letter-spacing:.2px;
}
.carta-item__half{
  font-size:11px; font-weight:600; color:var(--label);
  letter-spacing:.4px; text-transform:lowercase;
}

/* =========================================================
   CARTA · picker en reserva
   ========================================================= */
.step-block__hint{
  display:inline-block; margin-left:8px;
  font-family:var(--ff-body); font-size:10.5px; font-weight:700;
  letter-spacing:.8px; text-transform:uppercase;
  color:var(--rose-deep);
  background:rgba(254,186,177,.18);
  padding:3px 8px; border-radius:var(--r-pill);
  vertical-align:middle;
}
.step-block__desc{
  font-size:12.5px; color:var(--label); line-height:1.5;
  margin-top:-2px;
}

.picker-list{
  display:flex; flex-direction:column; gap:6px;
  max-height:320px;
  overflow-y:auto; overflow-x:hidden;
  overscroll-behavior:contain;
  padding:2px;
  -webkit-overflow-scrolling:touch;
  width:100%; min-width:0;
}
.picker-item{
  display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:10px;
  background:var(--white); border-radius:var(--r-md);
  padding:10px 12px;
  border:1px solid rgba(42,42,41,.08);
  transition:border-color .2s var(--ease), background .2s var(--ease);
  min-width:0; max-width:100%;
}
.picker-item.is-selected{
  border-color:var(--rose-deep);
  background:linear-gradient(0deg, rgba(254,186,177,.08), rgba(254,186,177,.08)), var(--white);
}
.picker-item__main{display:flex; flex-direction:column; gap:2px; min-width:0; overflow:hidden}
.picker-item__name{
  font-family:var(--ff-display); font-weight:700;
  font-size:14.5px; color:var(--jet); line-height:1.2;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.picker-item__price{
  font-size:11.5px; color:var(--jet-80); font-weight:600; letter-spacing:.2px;
}
.picker-item__half{
  display:inline-flex; align-items:center; gap:6px;
  margin-top:4px; font-size:11px; color:var(--label); font-weight:600;
}
.picker-item__half input{
  appearance:none; -webkit-appearance:none;
  width:14px; height:14px; border-radius:4px;
  border:1.5px solid rgba(42,42,41,.35);
  background:var(--white); cursor:pointer;
  display:grid; place-items:center;
  transition:background .15s var(--ease), border-color .15s var(--ease);
}
.picker-item__half input:checked{
  background:var(--rose-deep); border-color:var(--rose-deep);
}
.picker-item__half input:checked::after{
  content:""; width:6px; height:9px;
  border:solid var(--white); border-width:0 2px 2px 0;
  transform:rotate(45deg) translate(-1px,-1px);
}

.picker-item__qty{
  display:flex; align-items:center; gap:2px;
  background:rgba(42,42,41,.06);
  border-radius:var(--r-pill);
  padding:2px;
}
.qty-btn{
  width:32px; height:32px; border-radius:50%;
  display:grid; place-items:center;
  font-size:18px; font-weight:600; color:var(--jet);
  background:transparent;
  transition:background .15s var(--ease), opacity .15s var(--ease), transform .12s var(--ease);
}
.qty-btn:hover:not(:disabled){background:var(--white)}
.qty-btn:active:not(:disabled){transform:scale(.92)}
.qty-btn:disabled{opacity:.3; cursor:not-allowed}
.qty-num{
  min-width:22px; text-align:center;
  font-size:14px; font-weight:700; color:var(--jet);
  font-variant-numeric:tabular-nums;
}

.picker-summary{
  display:flex; align-items:center; justify-content:space-between;
  background:var(--jet); color:var(--rose);
  border-radius:var(--r-md);
  padding:10px 14px;
  font-size:13px; font-weight:600; letter-spacing:.2px;
}
.picker-summary strong{font-family:var(--ff-display); font-weight:700; font-size:14px}

@media (max-width:340px){
  .carta-item{grid-template-columns:1fr; gap:4px}
  .carta-item__prices{align-items:flex-start; flex-direction:row; gap:10px}
  .picker-item{grid-template-columns:1fr}
  .picker-item__qty{justify-self:flex-end}
}

/* =========================================================
   INTRO VIDEO OVERLAY
   ========================================================= */
.intro-overlay{
  position:fixed; inset:0; z-index:9999;
  background:#000;
  display:grid; place-items:center;
  overflow:hidden;
  opacity:1;
  transition:opacity .6s var(--ease);
}
.intro-overlay.is-leaving{ opacity:0; pointer-events:none }

.intro-video{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  background:#000;
}

.intro-skip{
  position:absolute; bottom:max(28px, calc(var(--safe-bot) + 24px));
  right:max(16px, env(safe-area-inset-right, 16px));
  z-index:2;
  display:inline-flex; align-items:center; gap:8px;
  height:44px; padding:0 18px;
  border-radius:var(--r-pill);
  background:rgba(255,255,255,.92);
  color:var(--jet);
  font-family:var(--ff-body); font-weight:700; font-size:13.5px;
  letter-spacing:.5px;
  backdrop-filter:saturate(160%) blur(12px);
  -webkit-backdrop-filter:saturate(160%) blur(12px);
  box-shadow:0 10px 28px -10px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.08);
  cursor:pointer;
  transition:transform .15s var(--ease), background .2s var(--ease);
}
.intro-skip:hover{ background:#fff; transform:translateY(-1px) }
.intro-skip:active{ transform:scale(.97) }
.intro-skip svg{ width:18px; height:18px }

/* Animación de aparición del botón */
@keyframes introSkipIn{
  from{ opacity:0; transform:translateY(8px) }
  to  { opacity:1; transform:translateY(0) }
}
.intro-skip{ animation:introSkipIn .6s .9s var(--ease) backwards }

@media (prefers-reduced-motion:reduce){
  .intro-overlay, .intro-skip{ transition:none; animation:none }
}

/* =========================================================
   THEME TOGGLE BUTTON (Topbar)
   ========================================================= */
.topbar__theme{
  flex:0 0 auto;
  width:36px; height:36px;
  display:grid; place-items:center;
  border-radius:50%;
  background:transparent;
  color:var(--jet);
  border:1px solid rgba(42,42,41,.12);
  margin-left:auto; margin-right:4px;
  transition:background .25s var(--ease), color .25s var(--ease), border-color .2s var(--ease), transform .15s var(--ease);
  position:relative;
}
.topbar__theme:hover{
  background:rgba(254,186,177,.18);
  border-color:rgba(232,154,146,.30);
  transform:translateY(-1px);
}
.topbar__theme:active{ transform:scale(.94) }
.topbar__theme:focus-visible{ outline:2px solid var(--rose-deep); outline-offset:2px }

.topbar__theme svg{ width:16px; height:16px; transition:opacity .3s var(--ease), transform .35s var(--ease) }
.topbar__theme .topbar__theme-moon{ display:block; opacity:1; transform:rotate(0deg) }
.topbar__theme .topbar__theme-sun{
  display:block; opacity:0; transform:rotate(-30deg) scale(.6);
  position:absolute; top:50%; left:50%;
  margin:-8px 0 0 -8px;
}
[data-theme="night"] .topbar__theme .topbar__theme-moon{ opacity:0; transform:rotate(30deg) scale(.6) }
[data-theme="night"] .topbar__theme .topbar__theme-sun{ opacity:1; transform:rotate(0deg) scale(1) }

/* Topbar responsive: evitar que el botón Reservar se recorte */
@media (max-width:400px){
  .topbar__logo img{ max-width:100px }
  .topbar__cta{ padding:0 16px; font-size:13px; height:42px }
  .topbar__actions{ gap:4px }
}
@media (max-width:340px){
  .topbar__logo img{ max-width:80px }
  .topbar__cta{ padding:0 14px; font-size:12px }
  .topbar{ padding-inline:var(--s-3) }
}

/* =========================================================
   NIGHT MODE — paleta nocturna de Cantinero
   "Cantina a las 2am: jet profundo, rosé que ilumina"
   ========================================================= */
[data-theme="night"]{
  --paper:#0E0E10;
  --white:#1A1A1C;
  --jet:#F5F0E8;          /* invertido: ahora la "tinta" es crema */
  --jet-90:#E5DFD3;
  --jet-80:#BCB5A8;
  --jet-50:#807A6D;
  --jet-15:#2A2A2D;
  --jet-08:#1F1F22;
  --rose:#FEBAB1;
  --rose-soft:#3A2826;
  --rose-deep:#FFD4CD;
  --label:#BCB5A8;
  --meta:#807A6D;
  --sh-1:0 1px 2px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.04);
  --sh-2:0 12px 32px -16px rgba(0,0,0,.75), 0 2px 6px rgba(0,0,0,.4);
  --sh-3:0 24px 56px -24px rgba(0,0,0,.85), 0 6px 14px rgba(0,0,0,.5);
}

/* Transición suave entre temas */
html, body, .topbar, .stage, .view, .sheet__wrap, .sheet__head, .sheet__foot,
.tile, .card-amb__body, .event-card__body, .hero__caption, .meta-pill,
.field input, .field select, .schedule, .info-list li,
.carta-cta, .carta-item, .picker-item, .picker-summary,
.dock ul, .topbar__theme, .seg, .seg__btn, .table-detail,
.floor-stage, .floor-plan, .floor-plan-svg{
  transition:background-color .35s var(--ease), color .35s var(--ease),
             border-color .35s var(--ease), box-shadow .35s var(--ease);
}

/* Fondos base profundos */
[data-theme="night"] html, [data-theme="night"] body{
  background:#000;
}
[data-theme="night"] .device{ background:var(--paper) }

/* Topbar — gradient nocturno */
[data-theme="night"] .topbar{
  background:linear-gradient(to bottom,rgba(14,14,16,.96) 0%,rgba(14,14,16,.78) 65%,rgba(14,14,16,0) 100%);
}
[data-theme="night"] .topbar::before{
  background:linear-gradient(to right,transparent 0,rgba(255,255,255,.06) 30%,rgba(255,255,255,.06) 70%,transparent);
}
[data-theme="night"] .topbar__logo img{
  filter:invert(1) brightness(1.08) contrast(.96);
}

/* Theme toggle — invertido */
[data-theme="night"] .topbar__theme{
  color:var(--rose);
  border-color:rgba(254,186,177,.20);
}
[data-theme="night"] .topbar__theme:hover{
  background:rgba(254,186,177,.10);
  border-color:rgba(254,186,177,.40);
}

/* Reservar CTA nocturno */
[data-theme="night"] .topbar__cta{
  background:var(--rose);
  color:#1A1A1C;
  box-shadow:0 6px 20px -6px rgba(254,186,177,.5);
}

/* Chat FAB flotante nocturno */
[data-theme="night"] .cv-chat-fab--float{
  background:rgba(254,186,177,.12);
  border-color:rgba(254,186,177,.25);
  color:var(--rose);
}
[data-theme="night"] .cv-chat-fab--float:hover{
  background:var(--rose); color:#1A1A1C;
}
[data-theme="night"] .cv-chat-fab--float .cv-chat-fab__dot{
  background:var(--rose); box-shadow:0 0 0 2px var(--paper);
}

/* Stage / Views */
[data-theme="night"] .stage,
[data-theme="night"] .view{ background:var(--paper) }

/* Tipografía & contraste */
[data-theme="night"] .kicker{ color:var(--rose); opacity:.7 }
[data-theme="night"] .display{ color:var(--jet) }
[data-theme="night"] .lead{ color:var(--jet-80) }

/* Pills genéricos */
[data-theme="night"] .pill{
  background:rgba(255,255,255,.06);
  color:var(--jet);
  border-color:rgba(255,255,255,.08);
}
[data-theme="night"] .pill--rose{ background:var(--rose); color:#1A1A1C }
[data-theme="night"] .pill--dark{ background:var(--rose); color:#1A1A1C; border-color:transparent }

/* Cards generales */
[data-theme="night"] .tile,
[data-theme="night"] .card-amb__body,
[data-theme="night"] .step,
[data-theme="night"] .carta-cta,
[data-theme="night"] .carta-item,
[data-theme="night"] .picker-item,
[data-theme="night"] .table-detail,
[data-theme="night"] .schedule,
[data-theme="night"] .event-card,
[data-theme="night"] .info-list li{
  background:var(--white);
  border-color:rgba(255,255,255,.06);
}
[data-theme="night"] .tile__tag{
  background:rgba(255,255,255,.08); color:var(--jet);
}
[data-theme="night"] .tile__tag--signature{ background:var(--rose); color:#1A1A1C }

[data-theme="night"] .tile h4,
[data-theme="night"] .card-amb__body h4,
[data-theme="night"] .event-card__body h3,
[data-theme="night"] .step h4,
[data-theme="night"] .carta-item__name,
[data-theme="night"] .picker-item__name{ color:var(--jet) }
[data-theme="night"] .tile p,
[data-theme="night"] .card-amb__body p,
[data-theme="night"] .event-card__body p,
[data-theme="night"] .step p{ color:var(--jet-80) }
[data-theme="night"] .carta-item__price,
[data-theme="night"] .picker-item__price{ color:var(--jet) }
[data-theme="night"] .carta-item__half{ color:var(--meta) }

/* Posters de promociones — mantener look pero asentar */
[data-theme="night"] .poster--mujer,
[data-theme="night"] .poster--early,
[data-theme="night"] .poster--anticip{ filter:brightness(.88) }

/* Hero veil más profundo */
[data-theme="night"] .hero__veil{
  background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.65) 100%);
}

/* Map card nocturno */
[data-theme="night"] .map-card{ background:#1F1F22 }
[data-theme="night"] .map-card iframe{ filter:grayscale(.6) invert(.92) hue-rotate(180deg) contrast(.9) }

/* Eventos */
[data-theme="night"] .event-card__media{
  background:linear-gradient(140deg, #2A1F1E, #1A1A1C);
  color:var(--rose);
}
[data-theme="night"] .event-card__media--dark{
  background:linear-gradient(140deg, var(--rose), #B07B74);
  color:#1A1A1C;
}
[data-theme="night"] .event-feature::after{
  background:linear-gradient(180deg, transparent 0%, rgba(0,0,0,.7) 100%);
}

/* Formularios */
[data-theme="night"] .field > span{ color:var(--label) }
[data-theme="night"] .field input,
[data-theme="night"] .field select{
  background:#1F1F22;
  color:var(--jet);
  border-color:rgba(255,255,255,.10);
}
[data-theme="night"] .field input::placeholder{ color:var(--meta) }
[data-theme="night"] .field input:focus,
[data-theme="night"] .field select:focus{
  border-color:var(--rose);
  box-shadow:0 0 0 3px rgba(254,186,177,.18);
}
[data-theme="night"] .field select{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M2 4 l4 4 l4 -4' fill='none' stroke='%23F5F0E8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

/* Sheets (modales) */
[data-theme="night"] .sheet[open]{
  background:rgba(0,0,0,.7);
}
[data-theme="night"] .sheet__wrap{
  background:var(--paper);
  box-shadow:0 -28px 64px -20px rgba(0,0,0,.85);
}
[data-theme="night"] .sheet__head{
  background:rgba(14,14,16,.96);
  border-bottom-color:rgba(255,255,255,.06);
}
[data-theme="night"] .sheet__head::before{ background:rgba(255,255,255,.2) }
[data-theme="night"] .sheet__close{
  background:rgba(255,255,255,.08);
  color:var(--jet);
}
[data-theme="night"] .sheet__foot{
  background:var(--paper);
  border-top-color:rgba(255,255,255,.06);
}

/* Dock — fondo más profundo */
[data-theme="night"] .dock{
  background:linear-gradient(to top, var(--paper) 70%, rgba(14,14,16,0));
  box-shadow:0 -8px 24px -16px rgba(0,0,0,.6), 0 -1px 0 rgba(255,255,255,.04);
}
[data-theme="night"] .dock ul{
  background:rgba(255,255,255,.04);
  box-shadow:
    0 18px 40px -16px rgba(0,0,0,.7),
    0 4px 14px rgba(0,0,0,.3),
    inset 0 0 0 1px rgba(255,255,255,.06);
}
[data-theme="night"] .dock__home{ background:rgba(255,255,255,.25) }

/* Segmento (tabs Piso 1/2) */
[data-theme="night"] .seg{ background:rgba(255,255,255,.06) }
[data-theme="night"] .seg__btn{ color:var(--jet) }
[data-theme="night"] .seg__btn.is-active{
  background:rgba(255,255,255,.10);
  color:var(--jet);
  box-shadow:0 1px 3px rgba(0,0,0,.4), 0 0 0 1px rgba(255,255,255,.08);
}

/* Tabs carta */
[data-theme="night"] .carta-tabs{ background:rgba(255,255,255,.06) }
[data-theme="night"] .carta-tab{ color:var(--jet) }
[data-theme="night"] .carta-tab.is-active{
  background:var(--rose); color:#1A1A1C;
}

/* Meta pills */
[data-theme="night"] .meta-pill{
  background:var(--rose); color:#1A1A1C;
}

/* Picker summary */
[data-theme="night"] .picker-summary{
  background:var(--rose); color:#1A1A1C;
}
[data-theme="night"] .picker-item.is-selected{
  background:linear-gradient(0deg, rgba(254,186,177,.10), rgba(254,186,177,.10)), var(--white);
  border-color:var(--rose);
}

/* Floor plan SVG en nocturno */
[data-theme="night"] .floor-stage{ background:var(--white) }
[data-theme="night"] .floor-plan-svg{ background:transparent }
[data-theme="night"] .floor-plan-svg .zone{
  fill:rgba(254,186,177,.06);
  stroke:rgba(255,255,255,.04);
}
[data-theme="night"] .floor-plan-svg .zone--bar{ fill:rgba(255,255,255,.04) }
[data-theme="night"] .floor-plan-svg .zone--signature,
[data-theme="night"] .floor-plan-svg .zone--vip{ fill:rgba(254,186,177,.14) }
[data-theme="night"] .floor-plan-svg .zone-label{ fill:rgba(254,186,177,.55) }
[data-theme="night"] .floor-plan-svg .table-shape{
  fill:#2A2A2D;
  stroke:rgba(255,255,255,.18);
}
[data-theme="night"] .floor-plan-svg .table-group--bar .table-shape{
  fill:rgba(255,255,255,.10);
  stroke:rgba(255,255,255,.40);
}
[data-theme="night"] .floor-plan-svg .table-group:hover .table-shape{
  fill:rgba(254,186,177,.35);
  stroke:var(--rose);
}
[data-theme="night"] .floor-plan-svg .table-group.is-selected .table-shape{
  fill:var(--rose); stroke:var(--rose-deep);
}
[data-theme="night"] .floor-plan-svg .table-label{ fill:var(--jet) }
[data-theme="night"] .floor-plan-svg .table-group--bar .table-label{ fill:var(--rose) }
[data-theme="night"] .floor-plan-svg .table-group.is-selected .table-label{ fill:#1A1A1C }
[data-theme="night"] .floor-legend .dot{ background:#2A2A2D; border-color:rgba(255,255,255,.25) }
[data-theme="night"] .floor-legend .dot--sel{ background:var(--rose); border-color:var(--rose-deep) }
[data-theme="night"] .floor-legend .dot--bar{ background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.35) }

/* Botones del CTA al estilo nocturno */
[data-theme="night"] .btn--rose{
  background:var(--rose); color:#1A1A1C;
  box-shadow:0 8px 24px -10px rgba(254,186,177,.5);
}
[data-theme="night"] .btn--rose:disabled{
  opacity:.4;
}
[data-theme="night"] .btn--ghost{
  background:rgba(255,255,255,.06);
  color:var(--jet);
  border-color:rgba(255,255,255,.10);
}

/* Step block hint */
[data-theme="night"] .step-block__hint{
  background:rgba(254,186,177,.14);
  color:var(--rose);
}

/* Línea legal & fineprint */
[data-theme="night"] .legal,
[data-theme="night"] .fineprint{ color:var(--meta) }

/* Map skeleton */
[data-theme="night"] .map-card__skeleton{
  background:radial-gradient(circle at 50% 40%, #1F1F22 0%, #15151A 60%, #0E0E10 100%);
}
[data-theme="night"] .map-card__grid{
  background:
    linear-gradient(0deg,rgba(255,255,255,.05) 1px,transparent 1px) 0 0/40px 40px,
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px) 0 0/40px 40px;
}

/* Schedule list */
[data-theme="night"] .schedule h3{ color:var(--jet) }
[data-theme="night"] .schedule li{ color:var(--jet-80); border-bottom-color:rgba(255,255,255,.06) }

/* Info-list */
[data-theme="night"] .info-list__k{ color:var(--label) }
[data-theme="night"] .info-list__v{ color:var(--jet) }

/* Routes (Waze, GMaps, etc) */
[data-theme="night"] .route{
  background:rgba(255,255,255,.04);
  color:var(--jet);
  border-color:rgba(255,255,255,.08);
}
[data-theme="night"] .route:hover{
  background:rgba(254,186,177,.12);
  color:var(--rose);
}

/* =========================================================
   EVENTS GRID  (2-col tile layout)
   ========================================================= */
.events-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:var(--s-4);
}
.ev-tile{
  border-radius:var(--r-lg);
  overflow:hidden;
  background:var(--white);
  box-shadow:var(--sh-1);
  border:1px solid rgba(42,42,41,.06);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  transition:transform .2s var(--ease), box-shadow .2s var(--ease);
}
.ev-tile:hover{transform:scale(1.02); box-shadow:var(--sh-2)}
.ev-tile:active{transform:scale(.98)}
.ev-tile picture{display:block; aspect-ratio:4/3; overflow:hidden}
.ev-tile img{width:100%; height:100%; object-fit:cover; display:block}
.ev-tile__info{
  padding:12px 14px 14px;
}
.ev-tile__date{
  display:block;
  font-family:var(--ff-body); font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:.8px;
  color:var(--rose-deep);
  margin-bottom:4px;
}
.ev-tile__info h3{
  font-family:var(--ff-display); font-size:15px; font-weight:700;
  color:var(--jet); line-height:1.2; letter-spacing:-.3px;
}

/* Night mode for events grid */
[data-theme="night"] .ev-tile{
  background:var(--white);
  border-color:rgba(255,255,255,.06);
}
[data-theme="night"] .ev-tile__date{ color:var(--rose) }
[data-theme="night"] .ev-tile__info h3{ color:var(--jet) }

/* Tile que ocupa ancho completo (2 columnas) */
.ev-tile--full{ grid-column:1 / -1 }

/* 1 col on very narrow screens */
@media (max-width:359px){
  .events-grid{grid-template-columns:1fr}
}

/* =========================================================
   GALLERY MODAL
   ========================================================= */
.sheet--gallery .sheet__body{
  display:flex; flex-direction:column; align-items:center;
  padding:var(--s-4); gap:var(--s-4);
  min-height:50vh;
}
.gallery-carousel{
  position:relative;
  width:100%;
  flex:1;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
  border-radius:var(--r-md);
  background:rgba(42,42,41,.04);
}
.gallery-carousel img{
  max-width:100%; max-height:60vh;
  object-fit:contain;
  border-radius:var(--r-md);
  user-select:none;
  -webkit-user-drag:none;
}
.gallery-carousel .gallery-empty{
  text-align:center; padding:var(--s-6);
  color:var(--label); font-size:14px;
}
.gallery-counter{
  font-family:var(--ff-body); font-size:12px; font-weight:600;
  color:var(--meta); letter-spacing:.5px;
}
.gallery-nav{
  display:flex; gap:var(--s-4); align-items:center;
}
.gallery-prev,
.gallery-next{
  width:44px; height:44px;
  border:1.5px solid rgba(42,42,41,.12);
  border-radius:50%;
  background:var(--white);
  color:var(--jet);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  transition:background .15s, border-color .15s;
}
.gallery-prev svg,
.gallery-next svg{width:20px; height:20px}
.gallery-prev:hover,
.gallery-next:hover{
  background:var(--rose); color:var(--jet);
  border-color:var(--rose);
}
.gallery-prev:disabled,
.gallery-next:disabled{
  opacity:.3; pointer-events:none;
}

/* Night gallery */
[data-theme="night"] .gallery-carousel{ background:rgba(255,255,255,.04) }
[data-theme="night"] .gallery-prev,
[data-theme="night"] .gallery-next{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.10);
  color:var(--jet);
}
[data-theme="night"] .gallery-prev:hover,
[data-theme="night"] .gallery-next:hover{
  background:var(--rose); color:#1A1A1C;
}