:root{--bg:#02040b;--panel:#14161b;--text:#dddee1;--head:#f9f9f9;--muted:#b9bcc4;--accent:#ff0030;--accent-h:#ef002d;--line:#222733;--wa:#25d366}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:400 18px/1.62 "Didact Gothic",sans-serif}
img{max-width:100%;display:block}
a{color:var(--head);text-decoration:none}
h1,h2,h3,h4,h6{font-family:Jost,sans-serif;color:var(--head);margin:0 0 .5em}
h1{font-size:clamp(34px,5vw,57px);font-weight:700;line-height:1.17;text-transform:uppercase}
h2{font-size:19px;font-weight:500;line-height:1.3}
h4{font-size:24px;font-weight:500}
h6{font-size:18px;font-weight:500}
.wrap{max-width:1170px;margin:0 auto;padding:0 20px}
.sec{padding:100px 0}.sec.alt{background:var(--panel)}
.sec-title{text-align:center;margin-bottom:50px}
.sec-title small{display:block;font:700 13px/1 Jost,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}

/* botones */
.btn{display:inline-block;background:var(--accent);color:#fff;font:700 12px/1 Jost,sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:14px 28px;border:0;border-radius:0;cursor:pointer;transition:background .2s}
.btn:hover{background:var(--accent-h)}
.btn-wa::before{content:"";display:inline-block;width:0}
.more{font:700 14px/1 Jost,sans-serif;text-transform:uppercase;padding-bottom:5px;border-bottom:1px solid var(--accent)}

/* header */
.top{position:absolute;inset:0 0 auto 0;height:137px;display:flex;align-items:center;justify-content:space-between;padding:0 40px;z-index:20}
.logo img{width:180px;height:auto}
.menu{display:flex;align-items:center;gap:34px}
.menu a:not(.btn){font-size:18px;padding-bottom:3px;border-bottom:1px solid transparent}
.menu a.on,.menu a:not(.btn):hover{border-bottom-color:var(--head)}
.burger{display:none;background:none;border:0;padding:8px;cursor:pointer}
.burger span{display:block;width:26px;height:2px;background:#fff;margin:6px 0}

/* hero */
.hero{position:relative;height:100vh;min-height:620px;display:flex;align-items:center;justify-content:center;text-align:center;background:#000 center/cover no-repeat}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(2,4,11,.65),rgba(2,4,11,.55) 60%,var(--bg))}
.hero .in{position:relative;padding:0 20px}
.hero .kick{font:500 20px Jost,sans-serif;letter-spacing:.15em;text-transform:uppercase;margin-bottom:12px}
.hero h1{font-size:clamp(40px,7vw,90px);margin-bottom:10px}
.hero p{font-size:22px;margin:0 0 30px}
.hero-slides .s{position:absolute;inset:0;background:center/cover;opacity:0;transition:opacity 1.2s}
.hero-slides .s.on{opacity:1}
.page-head{padding:190px 0 50px;text-align:center}

/* cinta */
.marquee{background:#000;overflow:hidden;white-space:nowrap;height:70px;line-height:70px}
.marquee div{display:inline-block;padding-left:100%;animation:mq 40s linear infinite}
.marquee span{font:500 20px Jost,sans-serif;text-transform:uppercase;margin-right:60px;color:var(--head)}
@keyframes mq{to{transform:translateX(-100%)}}

/* tarjetas */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:34px}
.card{position:relative}
.card-img{overflow:hidden;background:var(--panel);margin-bottom:16px}
.card-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.card:hover .card-img img{transform:scale(1.04)}
.card h2{margin:0 0 6px}
.card .price{margin:0 0 16px;color:var(--muted)}
.card .price s{opacity:.6}
.badge{position:absolute;top:12px;left:12px;background:var(--accent);color:#fff;font:700 12px/1 Jost;padding:6px 10px}

/* artistas */
.artists{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;text-align:center}
.artists img{aspect-ratio:1;object-fit:cover;width:100%;margin-bottom:14px;filter:grayscale(.3);transition:filter .3s}
.artists a:hover img{filter:none}
.artists h4{font-size:20px}

/* banda */
.band{position:relative;padding:130px 0;text-align:center;background:#000 center/cover no-repeat}
.band::before{content:"";position:absolute;inset:0;background:rgba(2,4,11,.72)}
.band .wrap{position:relative}
.band h3{font-size:clamp(26px,4vw,44px);text-transform:uppercase;font-weight:700;max-width:900px;margin:0 auto 30px}

/* info */
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:40px}
.cols p{margin:0 0 6px;font-size:17px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.split img{width:100%}
.gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-top:30px}

/* footer */
.foot{background:var(--panel);padding-top:80px}
.foot a:hover{color:#fff;text-decoration:underline}
.foot .btn:hover{text-decoration:none}
.legal{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:60px;padding:28px 20px;font-size:15px;color:var(--muted)}

.wa-float{position:fixed;right:22px;bottom:22px;width:58px;height:58px;border-radius:50%;background:var(--wa);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(0,0,0,.5);z-index:30}

/* reveal */
.rv{opacity:0;transform:translateY(24px);transition:opacity .7s,transform .7s}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.marquee div{animation:none}.hero-slides .s{transition:none}}

@media (max-width:900px){
  .top{padding:0 20px;height:100px}
  .logo img{width:130px}
  .burger{display:block}
  .menu{position:fixed;inset:100px 0 auto 0;background:var(--bg);flex-direction:column;align-items:flex-start;padding:24px 20px 30px;gap:18px;display:none}
  .menu.open{display:flex}
  .sec{padding:70px 0}
  .split{grid-template-columns:1fr}
  .page-head{padding:140px 0 30px}
}

/* fecha y precio en tarjetas / hero */
.card .date{margin:0 0 4px;color:var(--muted);font-size:16px}
.card .price{color:var(--head);font:500 18px Jost,sans-serif}
.hero-price{font:700 26px Jost,sans-serif !important;color:var(--head)}

/* CTA de grupo (llamativo) */
.cta-group{margin-top:70px;padding:44px 40px;display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;background:linear-gradient(135deg,var(--accent),#a30020);box-shadow:0 10px 40px rgba(255,0,48,.3)}
.cta-group h3{font-size:clamp(26px,3.4vw,38px);text-transform:uppercase;font-weight:700;margin:0 0 6px;color:#fff}
.cta-group p{margin:0;color:#fff;font-size:19px}
.btn-lg{background:#fff;color:#000;font-size:15px;padding:20px 38px;animation:pulse 2s infinite}
.btn-lg:hover{background:#000;color:#fff}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.6)}70%{box-shadow:0 0 0 16px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
@media (prefers-reduced-motion:reduce){.btn-lg{animation:none}}

/* menú sticky: fijo, transparente arriba y sólido al bajar */
.top{position:fixed;transition:height .3s,background .3s,box-shadow .3s}
.top.stuck{height:80px;background:rgba(2,4,11,.95);box-shadow:0 2px 20px rgba(0,0,0,.6);backdrop-filter:blur(6px)}
.top.stuck .logo img{width:120px}
@media (max-width:900px){.top.stuck{height:70px}.top.stuck+*{}.menu{inset:auto 0 auto 0;top:100%;background:rgba(2,4,11,.97)}}

/* pleca negra semitransparente tras los textos del hero */
.hero .in{background:rgba(0,0,0,.6);padding:36px 48px;max-width:min(92vw,900px);backdrop-filter:blur(2px)}
@media (max-width:600px){.hero .in{padding:26px 20px}}
.card .price .pl{display:block}
.card .price em{font-style:normal;color:var(--muted);font-size:15px;text-transform:uppercase;letter-spacing:.05em;margin-right:6px}

/* imágenes de tarjetas: mismo tamaño (recortadas) + visor de imagen completa */
.card-img{display:block;cursor:zoom-in}
.card-img img{object-position:center top}
.lb{position:fixed;inset:0;background:rgba(0,0,0,.92);display:flex;align-items:center;justify-content:center;z-index:100;padding:20px;cursor:zoom-out}
.lb img{max-width:100%;max-height:100%;object-fit:contain}
.lb button{position:absolute;top:16px;right:20px;background:none;border:0;color:#fff;font-size:40px;line-height:1;cursor:pointer}

/* cuenta regresiva (hero) */
.countdown{display:flex;justify-content:center;gap:14px;margin:6px 0 26px}
.countdown div{min-width:74px;padding:10px 8px;background:rgba(255,255,255,.08);border-top:2px solid var(--accent)}
.countdown b{display:block;font:700 34px/1.1 Jost,sans-serif;color:#fff;font-variant-numeric:tabular-nums}
.countdown span{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.low-note{margin:-10px 0 22px !important;font:700 17px Jost,sans-serif !important;color:#ffd84d;text-transform:uppercase;letter-spacing:.06em}
.badge-low{background:#ffd84d !important;color:#000 !important;animation:blink 1.6s infinite}
@keyframes blink{50%{opacity:.6}}
@media (max-width:600px){.countdown{gap:8px}.countdown div{min-width:60px}.countdown b{font-size:26px}}

/* acciones del evento: calendario y compartir */
.card .actions{display:flex;flex-wrap:wrap;gap:6px 14px;margin:14px 0 0;font-size:14px}
.card .actions a{color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:2px}
.card .actions a:hover{color:#fff;border-bottom-color:var(--accent)}
@media (prefers-reduced-motion:reduce){.badge-low{animation:none}}

/* hero: textos más compactos */
.hero .in{line-height:1.15}
.hero .kick{line-height:1.1;margin-bottom:6px}
.hero h1{line-height:1;margin-bottom:6px}
.hero p{line-height:1.2;margin:0 0 8px}
.hero .hero-price{margin-bottom:14px}
.hero .countdown{margin:4px 0 20px}

/* hero: bajar el bloque de texto para separarlo del menú */
.hero{padding-top:150px;padding-bottom:40px}
@media (max-width:900px){.hero{padding-top:110px}}

/* jerarquía SEO: un solo H1 por página; títulos de sección como H2 con el estilo del H1 */
.t-xl{font-family:Jost,sans-serif;font-size:clamp(34px,5vw,57px);font-weight:700;line-height:1.17;text-transform:uppercase;color:var(--head);margin:0 0 .5em}
.hero h2.t-xl{font-size:clamp(40px,7vw,90px);line-height:1;margin-bottom:6px}
.faq{max-width:820px}
.faq details{border-bottom:1px solid var(--line);padding:18px 0}
.faq summary{cursor:pointer;font:500 20px Jost,sans-serif;color:var(--head);list-style:none;display:flex;justify-content:space-between;gap:20px}
.faq summary::after{content:"+";color:var(--accent);font-size:26px;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq summary::-webkit-details-marker{display:none}
.faq p{margin:12px 0 0;color:var(--text)}

/* firma SII-Balam: solo la palabra enlazada, siempre en naranja */
.legal a.sii,.foot a.sii{color:#ff8a1f;font-weight:700}
.legal a.sii:hover,.foot a.sii:hover{color:#ffa54d;text-decoration:underline}