@font-face{font-family:"Bebas Neue";src:url(../assets/fonts/bebas-neue-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Inter";src:url(../assets/fonts/inter-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Inter";src:url(../assets/fonts/inter-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}

:root{
  --bg:#07060b; --ink:#f6f1ff; --mute:#a79fba;
  --pink:#ff2e93; --amber:#ffb23e; --violet:#7a4dff; --line:rgba(255,255,255,.12);
  --gutter:clamp(20px,4.5vw,64px);
  --sec:clamp(72px,9vw,120px);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:"Inter","Helvetica Neue",Arial,sans-serif;line-height:1.5;overflow-x:hidden}
img,video,iframe{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}
.display{font-family:"Bebas Neue","Oswald","Impact","Arial Narrow",sans-serif;letter-spacing:.02em;text-transform:uppercase;font-weight:400}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:6px}

/* Bola 3D: fija, por encima del vídeo y por debajo de los textos */
#ball{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;mix-blend-mode:screen;opacity:.66}

/* Línea de luz que recorre el borde (botones, flyers y tarjetas) */
@property --a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes beam{to{--a:360deg}}
.btn,.flyer-img,.ev{position:relative;--beam:#ffd27a}
.btn::before,.flyer-img::after,.ev::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;
  background:conic-gradient(from var(--a),transparent 0 72%,var(--beam) 93%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  filter:drop-shadow(0 0 3px var(--beam));animation:beam var(--beam-t,4.5s) linear infinite}
.btn.ghost::before{animation-delay:-2.2s}
.flyer-img::after{--beam-t:6.5s}
.flyer:nth-child(even) .flyer-img::after{animation-delay:-3.2s}
.ev{--beam:#fff;--beam-t:7s}
.ev:nth-child(2)::after{animation-delay:-3.5s}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:48px;padding:0 26px;border-radius:999px;font-size:13px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;white-space:nowrap;transition:transform .25s ease,box-shadow .25s ease,background .25s ease}
.btn:hover{transform:translateY(-2px)}
.btn.fill{background:linear-gradient(90deg,var(--pink),#ff6a3d);color:#fff;box-shadow:0 10px 40px -10px var(--pink)}
.btn.ghost{border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--ink);backdrop-filter:blur(6px)}

/* Navegación */
.nav{position:fixed;top:0;left:0;right:0;height:64px;transition:height .35s ease,background .35s ease;padding:0 var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:24px;z-index:20;background:linear-gradient(180deg,rgba(7,6,11,.88),rgba(7,6,11,.55));backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.06)}
.logo{font-size:24px;line-height:1;white-space:nowrap;transition:font-size .35s ease}
.nav.is-scrolled{height:50px;background:rgba(7,6,11,.92)}
.nav.is-scrolled .logo{font-size:20px}
.logo b{color:var(--pink);font-weight:400}
.nav ul{display:flex;gap:clamp(18px,2.4vw,32px);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.nav .btn{height:38px;padding:0 18px;font-size:11px;transition:height .35s ease,padding .35s ease,transform .25s ease,box-shadow .25s ease}
.nav.is-scrolled .btn{height:32px;padding:0 16px}
.nav ul a{transition:color .2s}
.nav ul a:hover{color:var(--ink)}

/* Cabecera */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;overflow:hidden;padding:96px var(--gutter) 90px}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;background:#0a0710}
.hero-shade{position:absolute;inset:0;z-index:0;background:
  linear-gradient(90deg,rgba(7,6,11,.82) 0%,rgba(7,6,11,.45) 48%,rgba(7,6,11,.15) 100%),
  linear-gradient(180deg,rgba(7,6,11,.35) 0%,transparent 30%,transparent 70%,var(--bg) 100%)}
.hero-copy{position:relative;z-index:3;max-width:min(720px,100%)}
.eyebrow{font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--amber);margin-bottom:22px;display:flex;align-items:center;gap:14px}
.eyebrow::before{content:"";flex:0 0 40px;height:1px;background:var(--amber)}
h1{font-size:clamp(69px,calc(10.4vw - 2.7px),157px);line-height:.86;letter-spacing:-.025em;text-shadow:0 4px 40px rgba(0,0,0,.45)}
h1 span{display:block;background:linear-gradient(90deg,var(--pink),var(--amber));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.hero-copy p{margin-top:30px;font-size:clamp(14px,calc(1.35vw - 2.7px),16.3px);line-height:1.55;color:#e0d9f0;max-width:480px}
.cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:38px}
.scroll-hint{position:absolute;left:var(--gutter);bottom:36px;z-index:3;display:flex;align-items:center;gap:16px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--mute)}
.scroll-hint i{width:1px;height:46px;background:linear-gradient(var(--pink),transparent)}

/* Franja de días */
.marq{position:relative;z-index:2;height:54px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;white-space:nowrap;background:rgba(7,6,11,.22);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.marq .track{display:flex;align-items:center;width:max-content;height:100%;will-change:transform}
.marq .grp{display:flex;align-items:center;gap:36px;padding-right:36px;font-size:22px;line-height:1;color:#fff}
.marq em{font-style:normal;color:var(--pink);font-size:14px}

/* Secciones */
.block{position:relative;z-index:2;padding:var(--sec) var(--gutter) 0}
.sh{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:clamp(32px,4vw,56px)}
.sh h2{font-size:clamp(53px,calc(7.2vw - 2.7px),101px);line-height:.9}
.sh small,.reserve small{display:block;font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--amber);margin-bottom:16px}
.sh p{max-width:340px;font-size:13px;line-height:1.6;color:var(--mute);text-align:right}
.tag{font-size:9px;letter-spacing:.26em;text-transform:uppercase;color:var(--amber)}

/* Programación (carrusel) */
.carousel{margin:0 calc(var(--gutter) * -1);overflow:hidden;position:relative;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}
.carousel.is-dragging{cursor:grabbing}
.carousel img{pointer-events:none;-webkit-user-drag:none}
.flyer{-webkit-user-drag:none}
.carousel::before,.carousel::after{content:"";position:absolute;top:0;bottom:0;width:clamp(30px,6vw,90px);z-index:2;pointer-events:none}
.carousel::before{left:0;background:linear-gradient(90deg,var(--bg),transparent)}
.carousel::after{right:0;background:linear-gradient(270deg,var(--bg),transparent)}
.ctrack{display:flex;width:max-content;will-change:transform}
.flyer{flex:0 0 clamp(220px,22vw,310px);margin-right:24px;display:block}
.flyer-img{display:block;aspect-ratio:9/16;border-radius:22px;overflow:hidden;border:1px solid var(--line);background:linear-gradient(160deg,#2a0f55,#ff2e93 130%)}
.flyer:nth-child(4n+2) .flyer-img{background:linear-gradient(160deg,#3a0b1c,#ff7a2e 130%)}
.flyer:nth-child(4n+3) .flyer-img{background:linear-gradient(160deg,#0b1f4a,#7a4dff 120%)}
.flyer:nth-child(4n+4) .flyer-img{background:linear-gradient(160deg,#10301f,#ffb23e 140%)}
.flyer-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.flyer:hover .flyer-img img{transform:scale(1.04)}
.flyer-cap{display:flex;justify-content:space-between;align-items:center;margin-top:14px;font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink)}
.flyer-cap i{font-style:normal;width:34px;height:34px;border-radius:50%;background:#fff;color:#000;display:flex;align-items:center;justify-content:center;font-size:15px;letter-spacing:0}

/* Eventos */
.events{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.ev{display:grid;grid-template-columns:minmax(0,230px) minmax(0,1fr);gap:28px;padding:22px;border-radius:26px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025));border:1px solid var(--line);backdrop-filter:blur(10px)}
.poster{display:block;aspect-ratio:9/16;border-radius:16px;overflow:hidden;background:linear-gradient(160deg,#1a0b3d,#ff2e93 140%);cursor:zoom-in}
.ev:nth-child(2) .poster{background:linear-gradient(160deg,#0b2a3d,#ffb23e 150%)}
.poster img{width:100%;height:100%;object-fit:cover}
.ev .info{display:flex;flex-direction:column;justify-content:space-between;gap:24px;padding:6px 4px 4px;min-width:0}
.ev h3{font-size:clamp(37px,calc(4vw - 2.7px),51px);line-height:.95;margin:12px 0 14px}
.ev p{font-size:14px;color:var(--mute);line-height:1.55}
.zoom{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);margin-top:14px}
.ev .btn{align-self:flex-start}

/* Informes y reservas */
.reserve-in{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;padding:clamp(28px,4vw,48px);border-radius:26px;border:1px solid var(--line);background:linear-gradient(120deg,rgba(255,46,147,.2),rgba(122,77,255,.16));backdrop-filter:blur(10px)}
.phone{display:block;font-size:clamp(52px,7vw,96px);line-height:1;transition:color .2s}
.phone:hover{color:var(--amber)}
.reserve-addr{font-size:14px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}

/* Ubicación */
.loc{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:28px}
.map{height:460px;border-radius:26px;border:1px solid var(--line);overflow:hidden;background:#0d0a16}
.map iframe{width:100%;height:100%;border:0;filter:invert(.92) hue-rotate(180deg) saturate(.6) brightness(.9) contrast(1.05)}
.card{min-height:460px;border-radius:26px;padding:clamp(24px,3vw,40px);border:1px solid var(--line);background:linear-gradient(160deg,rgba(255,46,147,.18),rgba(122,77,255,.14));backdrop-filter:blur(10px);display:flex;flex-direction:column;justify-content:space-between;gap:28px}
.card h3{font-size:clamp(45px,calc(5vw - 2.7px),65px);line-height:.92;margin:12px 0 18px}
.card address{font-style:normal;font-size:17px;line-height:1.7;color:#d9d1ec}
.card .phone{font-size:clamp(44px,4.4vw,56px);margin-bottom:22px}
.row{display:flex;flex-wrap:wrap;gap:12px}

/* Pie */
.foot{position:relative;z-index:2;margin-top:var(--sec);padding:44px var(--gutter);border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);background:rgba(7,6,11,.7)}
.soc{display:flex;gap:12px}
.soc a{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--ink);font-size:9px;letter-spacing:.04em;transition:background .2s,border-color .2s}
.soc a:hover{background:var(--pink);border-color:var(--pink)}
.foot > div a{color:var(--ink)}

/* Cartel ampliado */
dialog{border:0;background:transparent;max-width:none;max-height:none;width:100%;height:100%;padding:24px;align-items:center;justify-content:center;flex-direction:column;gap:14px;color:var(--ink)}
dialog[open]{display:flex}
dialog::backdrop{background:rgba(5,4,9,.88);backdrop-filter:blur(6px)}
dialog img{max-width:min(92vw,560px);max-height:84vh;width:auto;height:auto;border-radius:18px;box-shadow:0 30px 90px -20px #000;cursor:zoom-out}
.lb-close{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--mute)}

/* Adaptación */
@media (max-width:1000px){
  .events,.loc{grid-template-columns:minmax(0,1fr)}
  .sh{flex-direction:column;align-items:flex-start}
  .sh p{text-align:left}
}
@media (max-width:860px){
  .nav nav{display:none}
  .hero-shade{background:linear-gradient(180deg,rgba(7,6,11,.55) 0%,rgba(7,6,11,.45) 55%,var(--bg) 100%)}
}
@media (max-width:560px){
  .logo{font-size:20px}
  .nav.is-scrolled .logo{font-size:18px}
  .ev{grid-template-columns:minmax(0,1fr)}
  .poster{max-width:260px}
  .map{height:340px}
  .card{min-height:0}
  .reserve-in{flex-direction:column;align-items:flex-start}
  .marq{height:48px}
  .marq .grp{font-size:19px;gap:28px;padding-right:28px}
  .btn{height:46px;padding:0 22px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .btn::before,.flyer-img::after,.ev::after{animation:none}
  .btn,.flyer-img img{transition:none}
}