/* ============================================================
   STAGECRAFT — Main Stylesheet
   Dark · Bold · Music Industry
   ============================================================ */

/* ── TOKENS ─────────────────────────────────────────────── */
:root {
  --black:        #080808;
  --black-soft:   #111111;
  --black-card:   #161616;
  --black-border: #222222;
  --white:        #F5F4F0;
  --white-dim:    rgba(245,244,240,.55);
  --accent:       #8B0000;      /* rojo sangre — marca */
  --accent-dim:   rgba(139,0,0,.18);
  --red-hot:      #CC1111;
  --grey-mid:     #555555;
  --grey-light:   #888888;

  --font-display: 'Bebas Neue', 'Arial Black', sans-serif;
  --font-body:    'DM Sans', system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', monospace;

  --radius-sm:    4px;
  --radius-md:    8px;
  --radius-lg:    16px;

  --ease-out:     cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out:  cubic-bezier(0.65, 0, 0.35, 1);

  --container:    1200px;
  --container-md: 960px;
  --gap:          clamp(1rem, 3vw, 2rem);

  --header-h:     72px;
  --z-header:     100;
  --z-modal:      200;
  --z-toast:      300;
}

/* ── RESET ───────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; }
body {
  background: var(--black);
  color: var(--white);
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.6;
  overflow-x: hidden;
}
img, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; font: inherit; border: none; background: none; }
ul, ol { list-style: none; }
input, select, textarea { font: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* ── SKIP LINK ───────────────────────────────────────────── */
.skip-link { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.skip-link:focus { position: fixed; left: 1rem; top: 1rem; width: auto; height: auto; z-index: var(--z-toast); padding: .5rem 1rem; background: var(--accent); color: var(--black); font-weight: 600; border-radius: var(--radius-sm); }

/* ── CONTAINER ───────────────────────────────────────────── */
.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: clamp(1rem, 5vw, 2.5rem);
}

/* ── TYPOGRAPHY ──────────────────────────────────────────── */
h1,h2,h3,h4,h5,h6 { font-family: var(--font-display); line-height: 1.05; letter-spacing: .02em; text-transform: uppercase; }
p { max-width: 72ch; }

.section-title {
  font-size: clamp(2rem, 5vw, 3.5rem);
  margin-bottom: 1.5rem;
  position: relative;
}
.section-title::after {
  content: '';
  display: block;
  width: 3rem;
  height: 3px;
  background: var(--accent);
  margin-top: .5rem;
}
.section-title--sm { font-size: clamp(1.5rem, 3vw, 2rem); }

.section-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 2rem; flex-wrap: wrap; }
.section-link { font-family: var(--font-mono); font-size: .85rem; color: var(--accent); letter-spacing: .05em; opacity: .8; transition: opacity .2s; }
.section-link:hover { opacity: 1; }

/* ── BUTTONS ─────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .75rem 1.75rem;
  border-radius: var(--radius-sm);
  font-family: var(--font-display);
  font-size: 1.1rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  transition: transform .18s var(--ease-out), background .18s, color .18s, opacity .18s;
  white-space: nowrap;
  cursor: pointer;
}
.btn:hover  { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }

.btn--primary   { background: var(--white); color: var(--black); font-weight: 700; }
.btn--primary:hover { background: var(--accent); color: var(--white); }

.btn--outline   { background: transparent; color: var(--white); border: 1.5px solid rgba(245,244,240,.3); }
.btn--outline:hover { border-color: var(--accent); color: var(--accent); }

.btn--ghost     { background: transparent; color: var(--grey-light); border: 1px solid var(--black-border); font-size: .9rem; }
.btn--ghost:hover { color: var(--white); border-color: var(--grey-mid); }

.btn--disabled  { background: var(--black-border); color: var(--grey-mid); pointer-events: none; cursor: not-allowed; }

.btn--sm   { padding: .45rem 1rem; font-size: .9rem; }
.btn--lg   { padding: 1rem 2.5rem; font-size: 1.3rem; }
.btn--full { width: 100%; justify-content: center; }
.btn--hero { box-shadow: 0 0 40px rgba(139,0,0,.35); }

/* Festival badge en event-row */
.event-row__festival-badge {
  background: rgba(139,0,0,.15);
  color: var(--accent);
  border: 1px solid rgba(139,0,0,.3);
  padding: .1rem .5rem;
  border-radius: var(--radius-sm);
  font-family: var(--font-mono);
  font-size: .62rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}
/* Fecha rango: números más pequeños para que quepan */
.event-row__date-inner--range .event-row__day {
  font-size: 1.4rem;
  letter-spacing: -.02em;
}
/* Festival row: acento izquierdo en rojo */
.event-row--festival::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--accent);
}

/* ── BADGES ──────────────────────────────────────────────── */
.event-badge {
  display: inline-flex;
  align-items: center;
  padding: .2rem .75rem;
  border-radius: var(--radius-sm);
  font-family: var(--font-mono);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.badge--upcoming     { background: rgba(255,255,255,.1);  color: var(--white); border: 1px solid rgba(255,255,255,.2); }
.badge--on-sale      { background: rgba(0,220,80,.15);    color: #00DC50;       border: 1px solid rgba(0,220,80,.3); }
.badge--sold-out     { background: rgba(255,46,46,.15);   color: var(--red-hot);border: 1px solid rgba(255,46,46,.3); }
.badge--cancelled    { background: rgba(80,80,80,.2);     color: var(--grey-mid);border: 1px solid var(--black-border); }
.badge--finished     { background: rgba(80,80,80,.15);    color: var(--grey-mid);border: 1px solid var(--black-border); }
.badge--last-tickets { background: rgba(255,150,0,.15);   color: #FF9600;       border: 1px solid rgba(255,150,0,.3); }

/* ══════════════════════════════════════════════════════════
   HEADER
   ══════════════════════════════════════════════════════════ */
.site-header {
  position: sticky;
  top: 0;
  left: 0;
  right: 0;
  z-index: var(--z-header);
  height: var(--header-h);
  background: rgba(8,8,8,.95);
  backdrop-filter: blur(16px) saturate(1.4);
  border-bottom: 1px solid var(--black-border);
  transition: background .3s;
}
.site-header--solid { background: var(--black-soft); }

.site-header__inner {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}

.site-header__brand a,
.site-header__site-name {
  font-family: var(--font-display);
  font-size: 1.6rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--white);
}
.site-header__brand img { height: 40px; width: auto; }

/* NAV */
.site-nav__menu { display: flex; align-items: center; gap: 2rem; }
.site-nav__menu a { font-family: var(--font-mono); font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; color: var(--white-dim); transition: color .2s; position: relative; padding-bottom: 2px; }
.site-nav__menu a::after { content:''; position:absolute; bottom:0; left:0; width:0; height:1px; background:var(--accent); transition: width .25s var(--ease-out); }
.site-nav__menu a:hover,
.site-nav__menu .current-menu-item > a { color: var(--white); }
.site-nav__menu a:hover::after,
.site-nav__menu .current-menu-item > a::after { width: 100%; }

/* Sub-menu */
.site-nav__menu .sub-menu { position:absolute; top:100%; left:0; background:var(--black-soft); border:1px solid var(--black-border); border-radius:var(--radius-md); padding:.5rem; min-width:180px; display:none; }
.site-nav__menu li { position:relative; }
.site-nav__menu li:hover .sub-menu { display:block; }
.site-nav__menu .sub-menu a { display:block; padding:.5rem .75rem; border-radius:var(--radius-sm); }
.site-nav__menu .sub-menu a:hover { background:var(--black-card); }

.site-header__actions { display: flex; align-items: center; gap: 1rem; }

/* Hamburger */
.nav-toggle { display: none; flex-direction: column; gap: 5px; padding: .5rem; }
.nav-toggle__bar { width: 24px; height: 2px; background: var(--white); border-radius: 2px; transition: transform .3s, opacity .3s; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ══════════════════════════════════════════════════════════
   PAGE HEADER
   ══════════════════════════════════════════════════════════ */
.page-header {
  padding: 4rem 0 3rem;
  background: var(--black-soft);
  border-bottom: 1px solid var(--black-border);
}
.page-header__title { font-size: clamp(3rem, 8vw, 6rem); }
.page-header__subtitle { color: var(--grey-light); font-size: 1.1rem; margin-top: .5rem; }

/* ══════════════════════════════════════════════════════════
   HERO (homepage + eventos + giras)
   ══════════════════════════════════════════════════════════ */
.home-hero,
.event-hero,
.tour-hero {
  position: relative;
  min-height: 90vh;
  display: flex;
  align-items: flex-end;
  padding-bottom: 5rem;
  overflow: hidden;
  background: var(--black-soft);
  background-image: var(--hero-bg);
  background-size: cover;
  background-position: center top;
}

.home-hero__overlay,
.event-hero__overlay,
.tour-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(8,8,8,.2) 0%,
    rgba(8,8,8,.5) 50%,
    rgba(8,8,8,.95) 100%
  );
}

.home-hero__inner,
.event-hero__inner,
.tour-hero__inner { position: relative; z-index: 1; }

/* Event hero */
.event-hero { min-height: 70vh; }
.event-hero__meta { display:flex; gap:.75rem; align-items:center; margin-bottom:1rem; flex-wrap:wrap; }
.event-hero__tour-link { font-family:var(--font-mono); font-size:.75rem; color:var(--accent); letter-spacing:.08em; text-transform:uppercase; }
.event-hero__title { font-size: clamp(3rem,9vw,7rem); line-height:1; margin-bottom:1.5rem; max-width:14ch; }
.event-hero__info { display:flex; gap:2rem; align-items:center; margin-bottom:2rem; flex-wrap:wrap; }
.event-hero__date-block { display:flex; flex-direction:column; border-left:3px solid var(--accent); padding-left:1rem; }
.event-hero__day { font-size:3.5rem; font-family:var(--font-display); line-height:1; }
.event-hero__month { font-family:var(--font-mono); font-size:.8rem; color:var(--accent); letter-spacing:.15em; text-transform:uppercase; }
.event-hero__details { display:flex; flex-direction:column; gap:.4rem; }
.event-hero__time,
.event-hero__venue { font-size:1rem; color:var(--white-dim); }
.event-hero__price { font-family:var(--font-display); font-size:1.5rem; color:var(--accent); }
.event-hero__actions { display:flex; gap:1rem; flex-wrap:wrap; }

/* Tour hero */
.tour-hero { min-height: 65vh; }
.tour-hero__inner { display:flex; flex-direction:column; gap:.75rem; }
.tour-hero__artist { font-family:var(--font-mono); font-size:.85rem; letter-spacing:.2em; text-transform:uppercase; color:var(--accent); }
.tour-hero__title  { font-size: clamp(3.5rem, 10vw, 8rem); line-height:1; }
.tour-hero__year   { font-family:var(--font-mono); color:var(--white-dim); margin-bottom:1rem; }

/* Home hero */
.home-hero { min-height: 95vh; }
.home-hero__content { max-width: 680px; }
.home-hero__artist { font-family:var(--font-mono); letter-spacing:.2em; font-size:.85rem; text-transform:uppercase; color:var(--accent); margin-bottom:.5rem; }
.home-hero__title { font-size:clamp(4rem,10vw,8rem); line-height:1; margin-bottom:1rem; }
.home-hero__meta { display:flex; gap:1.5rem; margin-bottom:2rem; color:var(--white-dim); flex-wrap:wrap; }
.home-hero__actions { display:flex; gap:1rem; flex-wrap:wrap; }
.home-hero__scroll-indicator { position:absolute; bottom:2.5rem; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:.5rem; }
.home-hero__scroll-indicator span { width:1.5px; height:50px; background:linear-gradient(to bottom, var(--accent), transparent); animation:scrollPulse 2s ease-in-out infinite; }
@keyframes scrollPulse { 0%,100%{opacity:.3;transform:scaleY(.6)} 50%{opacity:1;transform:scaleY(1)} }

/* ══════════════════════════════════════════════════════════
   COUNTDOWN BAR
   ══════════════════════════════════════════════════════════ */
.event-countdown-bar {
  background: var(--black-soft);
  border-bottom: 1px solid var(--black-border);
  padding: 1.25rem 0;
}
.event-countdown-bar .container { display:flex; align-items:center; gap:2rem; }
.event-countdown-bar__label { font-family:var(--font-mono); font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; color:var(--grey-light); white-space:nowrap; }
.countdown { display:flex; gap:1rem; }
.countdown__unit { display:flex; flex-direction:column; align-items:center; min-width:3rem; }
.countdown__value { font-family:var(--font-display); font-size:2rem; line-height:1; color:var(--accent); }
.countdown__label { font-family:var(--font-mono); font-size:.65rem; letter-spacing:.1em; text-transform:uppercase; color:var(--grey-mid); }

/* ══════════════════════════════════════════════════════════
   SINGLE EVENT BODY — 2 columnas: (poster + contenido) | sidebar
   ══════════════════════════════════════════════════════════ */
.single-event { }
.event-body {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 3.5rem;
  padding-block: 4rem;
  align-items: start;
}

/* Columna izquierda: poster arriba, contenido debajo */
.event-body__main {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  min-width: 0;
}
.event-body__poster { }
.event-body__poster-img { width: 100%; border-radius: var(--radius-md); box-shadow: 0 24px 80px rgba(0,0,0,.8); }
.event-body__content { display: flex; flex-direction: column; gap: 2.5rem; }

/* Lineup */
.event-lineup { background:var(--black-card); border:1px solid var(--black-border); border-radius:var(--radius-md); padding:2rem; }
.lineup-list { display:flex; flex-direction:column; gap:.75rem; margin-top:1rem; }
.lineup-list__item { display:flex; align-items:center; gap:1.5rem; padding:.75rem 0; border-bottom:1px solid var(--black-border); }
.lineup-list__item:last-child { border-bottom:none; }
.lineup-list__item--headliner .lineup-list__name { font-family:var(--font-display); font-size:1.6rem; }
.lineup-list__name { font-size:1.1rem; font-weight:500; flex:1; }
.lineup-list__role { font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--grey-light); }
.lineup-list__time { font-family:var(--font-mono); font-size:.8rem; color:var(--accent); }

/* Description */
.event-description { line-height:1.8; color:var(--white-dim); }
.event-description h2,
.event-description h3 { color:var(--white); margin:1.5rem 0 .75rem; }

/* Sidebar */
.event-sidebar { display:flex; flex-direction:column; gap:1.5rem; align-self:start; position:sticky; top:calc(var(--header-h) + 2rem); }
.event-sidebar__card { background:var(--black-card); border:1px solid var(--black-border); border-radius:var(--radius-md); padding:1.5rem; }
.event-sidebar__title { font-size:1.1rem; margin-bottom:1rem; color:var(--white-dim); }

.event-details-list { display:grid; grid-template-columns:auto 1fr; gap:.5rem 1rem; margin-bottom:1.5rem; font-size:.9rem; }
.event-details-list dt { color:var(--grey-light); font-family:var(--font-mono); font-size:.75rem; letter-spacing:.05em; text-transform:uppercase; padding-top:.1em; }
.event-details-list dd { color:var(--white); }

/* Map */
.event-map { height:200px; border-radius:var(--radius-md); overflow:hidden; background:var(--black-border); }
.event-map__placeholder { height:100%; display:flex; align-items:center; justify-content:center; color:var(--grey-mid); font-size:.85rem; }
.event-map__link { display:inline-block; margin-top:.75rem; font-family:var(--font-mono); font-size:.75rem; color:var(--accent); letter-spacing:.05em; }

/* Share */
.share-buttons { display:flex; gap:.75rem; }
.share-btn { width:2.5rem; height:2.5rem; border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:1rem; background:var(--black-border); color:var(--white); transition:background .2s, transform .2s; }
.share-btn:hover { transform:translateY(-2px); }
.share-btn--twitter:hover  { background:#1d9bf0; }
.share-btn--facebook:hover { background:#1877F2; }
.share-btn--whatsapp:hover { background:#25D366; }

/* ══════════════════════════════════════════════════════════
   RELATED EVENTS
   ══════════════════════════════════════════════════════════ */
.related-events { padding: 4rem 0; background:var(--black-soft); border-top:1px solid var(--black-border); }

/* ══════════════════════════════════════════════════════════
   EVENT ROW (lista agenda)
   ══════════════════════════════════════════════════════════ */
.events-list { display:flex; flex-direction:column; gap:0; }
.event-row {
  display:grid;
  grid-template-columns: 80px 60px 1fr auto;
  gap:1.25rem;
  align-items:center;
  padding:1rem 1.25rem;
  border-bottom:1px solid var(--black-border);
  transition:background .2s;
  position:relative;
}
.event-row:first-child { border-top:1px solid var(--black-border); }
.event-row:hover { background:var(--black-card); }
.event-row--past { opacity:.45; }

.event-row__date { text-align:center; }
.event-row__date-inner { display:flex; flex-direction:column; line-height:1; }
.event-row__day   { font-family:var(--font-display); font-size:2rem; }
.event-row__month { font-family:var(--font-mono); font-size:.65rem; letter-spacing:.1em; text-transform:uppercase; color:var(--grey-light); }

.event-row__img { width:56px; height:56px; object-fit:cover; border-radius:var(--radius-sm); }

.event-row__title a { font-family:var(--font-display); font-size:1.25rem; letter-spacing:.03em; text-transform:uppercase; }
.event-row__title a:hover { color:var(--accent); }
.event-row__meta { display:flex; flex-wrap:wrap; gap:.5rem 1rem; margin-top:.25rem; font-size:.85rem; color:var(--grey-light); }
.event-row__venue { color:var(--white-dim); }
.event-row__time  { font-family:var(--font-mono); color:var(--grey-mid); font-size:.8rem; }
.event-row__tour-tag { background:var(--accent-dim); color:var(--accent); border:1px solid rgba(232,255,0,.25); padding:.1rem .5rem; border-radius:var(--radius-sm); font-family:var(--font-mono); font-size:.65rem; letter-spacing:.08em; text-transform:uppercase; }
.event-row__artists { font-weight:500; color:var(--white); }

.event-row__actions { display:flex; flex-direction:column; gap:.5rem; align-items:flex-end; }

/* ══════════════════════════════════════════════════════════
   EVENT CARD (grid)
   ══════════════════════════════════════════════════════════ */
.events-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:1.25rem; }
.events-grid--compact { grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); }

.event-card { background:var(--black-card); border:1px solid var(--black-border); border-radius:var(--radius-md); overflow:hidden; display:flex; flex-direction:column; transition:transform .25s var(--ease-out), box-shadow .25s; }
.event-card:hover { transform:translateY(-6px); box-shadow:0 16px 48px rgba(0,0,0,.7); }
.event-card__link { display:block; text-decoration:none; }

.event-card__poster { position:relative; aspect-ratio:2/3; overflow:hidden; background:var(--black-border); }
.event-card__poster-img { width:100%; height:100%; object-fit:cover; transition:transform .4s var(--ease-out); }
.event-card:hover .event-card__poster-img { transform:scale(1.05); }
.event-card__poster-placeholder { width:100%; height:100%; background:linear-gradient(135deg, var(--black-border), var(--black-soft)); }
.event-card__poster-overlay { position:absolute; inset:0; background:linear-gradient(to bottom, transparent 50%, rgba(8,8,8,.95) 100%); display:flex; flex-direction:column; justify-content:flex-end; padding:1rem; gap:.35rem; }
.event-card__date { font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em; color:var(--accent); text-transform:uppercase; }

.event-card__body { padding:.875rem 1rem; flex:1; }
.event-card__artist { font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); margin-bottom:.25rem; }
.event-card__title { font-size:1.1rem; line-height:1.2; margin-bottom:.35rem; }
.event-card__venue { font-size:.8rem; color:var(--grey-light); }

.event-card__footer { padding:.75rem 1rem; border-top:1px solid var(--black-border); }

/* ══════════════════════════════════════════════════════════
   TOUR CARD
   ══════════════════════════════════════════════════════════ */
.tours-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:1.5rem; }

.tour-card { background:var(--black-card); border:1px solid var(--black-border); border-radius:var(--radius-md); overflow:hidden; position:relative; transition:transform .25s var(--ease-out); }
.tour-card:hover { transform:translateY(-4px); }
.tour-card__link { display:block; }
.tour-card__banner { position:relative; aspect-ratio:16/7; overflow:hidden; }
.tour-card__banner-img { width:100%; height:100%; object-fit:cover; transition:transform .4s var(--ease-out); }
.tour-card:hover .tour-card__banner-img { transform:scale(1.04); }
.tour-card__banner-placeholder { width:100%; height:100%; background:linear-gradient(135deg, var(--black-border), var(--black-soft)); }
.tour-card__banner-overlay { position:absolute; inset:0; background:linear-gradient(to bottom, rgba(8,8,8,.1), rgba(8,8,8,.6)); }
.tour-card__body { padding:1.25rem; }
.tour-card__artist { font-family:var(--font-mono); font-size:.75rem; letter-spacing:.15em; text-transform:uppercase; color:var(--tour-color, var(--accent)); margin-bottom:.35rem; }
.tour-card__title { font-size:clamp(1.3rem,2vw,1.8rem); line-height:1.1; margin-bottom:.25rem; }
.tour-card__year { font-family:var(--font-mono); font-size:.75rem; color:var(--grey-mid); margin-bottom:1rem; }
.tour-card__stats { display:flex; gap:1.25rem; font-size:.85rem; color:var(--grey-light); }
.tour-card__stat strong { color:var(--white); }

/* ══════════════════════════════════════════════════════════
   TOUR TIMELINE (single-giras)
   ══════════════════════════════════════════════════════════ */
.single-tour { }
.tour-body { padding-block:4rem; }
.tour-description { max-width:720px; margin-bottom:3rem; color:var(--white-dim); line-height:1.8; }
.tour-video { margin-bottom:3rem; border-radius:var(--radius-md); overflow:hidden; }
.tour-video iframe { width:100%; aspect-ratio:16/9; }

.tour-dates { margin-top:3rem; }
.tour-timeline { display:flex; flex-direction:column; gap:0; border:1px solid var(--black-border); border-radius:var(--radius-md); overflow:hidden; }
.tour-timeline__item {
  display:grid;
  grid-template-columns:90px 1fr auto;
  gap:1.5rem;
  align-items:center;
  padding:1.25rem 1.5rem;
  border-bottom:1px solid var(--black-border);
  background:var(--black-card);
  transition:background .2s;
}
.tour-timeline__item:last-child { border-bottom:none; }
.tour-timeline__item:hover { background:var(--black-soft); }
.tour-timeline__item--past { opacity:.4; }

.tour-timeline__date { text-align:center; }
.tour-timeline__day   { font-family:var(--font-display); font-size:2.5rem; line-height:1; color:var(--tour-color, var(--accent)); display:block; }
.tour-timeline__month { font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--grey-light); display:block; }
.tour-timeline__year  { font-family:var(--font-mono); font-size:.65rem; color:var(--grey-mid); display:block; }

.tour-timeline__event-title { font-family:var(--font-display); font-size:1.4rem; display:block; }
.tour-timeline__event-title:hover { color:var(--accent); }
.tour-timeline__venue { font-size:.9rem; color:var(--grey-light); display:block; margin-top:.25rem; }
.tour-timeline__time  { font-family:var(--font-mono); font-size:.75rem; color:var(--grey-mid); display:block; margin-top:.25rem; }

.tour-timeline__actions { display:flex; flex-direction:column; gap:.5rem; align-items:flex-end; }

/* ══════════════════════════════════════════════════════════
   AGENDA PAGE
   ══════════════════════════════════════════════════════════ */
.agenda-page { }
.agenda-page__inner { padding-block:2.5rem 5rem; display:flex; flex-direction:column; gap:2rem; }

.agenda-filters { display:flex; gap:1rem; align-items:flex-end; flex-wrap:wrap; padding:1.25rem 1.5rem; background:var(--black-card); border:1px solid var(--black-border); border-radius:var(--radius-md); }
.agenda-filters__group { display:flex; flex-direction:column; gap:.4rem; }
.agenda-filters__label { font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--grey-light); }
.agenda-filters__select {
  background:var(--black-soft);
  border:1px solid var(--black-border);
  border-radius:var(--radius-sm);
  color:var(--white);
  padding:.5rem .875rem;
  font-size:.9rem;
  appearance:none;
  cursor:pointer;
  min-width:160px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:calc(100% - .75rem) center;
  padding-right:2rem;
  transition:border-color .2s;
}
.agenda-filters__select:focus { border-color:var(--accent); }
.agenda-filters__group--toggle { justify-content:flex-end; padding-bottom:.45rem; }
.agenda-filters__toggle-label { display:flex; align-items:center; gap:.5rem; font-size:.85rem; color:var(--grey-light); cursor:pointer; user-select:none; }
.agenda-filters__checkbox { accent-color:var(--accent); width:16px; height:16px; cursor:pointer; }

.agenda-view-switcher { display:flex; gap:.5rem; }
.agenda-view-switcher__btn { display:flex; align-items:center; gap:.5rem; padding:.45rem .875rem; border-radius:var(--radius-sm); font-family:var(--font-mono); font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; color:var(--grey-mid); border:1px solid var(--black-border); background:transparent; transition:all .2s; }
.agenda-view-switcher__btn:hover { color:var(--white); border-color:var(--grey-mid); }
.agenda-view-switcher__btn.is-active { background:var(--black-card); color:var(--accent); border-color:var(--accent); }

.agenda-count { font-family:var(--font-mono); font-size:.8rem; letter-spacing:.05em; color:var(--grey-mid); margin-bottom:1rem; }
.no-events { padding:3rem; text-align:center; color:var(--grey-mid); border:1px dashed var(--black-border); border-radius:var(--radius-md); }

/* Grid view overrides */
#events-container[data-view="grid"] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 1.25rem;
  /* resetear estilos de lista */
  border: none;
  border-radius: 0;
}
#events-container[data-view="grid"] .event-row  { display: none; }
#events-container[data-view="grid"] .event-card { display: flex; }

#events-container[data-view="list"] { display: flex; flex-direction: column; }
#events-container[data-view="list"] .event-card { display: none; }

.agenda-pagination { display:flex; justify-content:center; margin-top:3rem; }

/* ══════════════════════════════════════════════════════════
   HOME SECTIONS
   ══════════════════════════════════════════════════════════ */
.home-section { padding:5rem 0; }
.home-upcoming { background:var(--black); }
.home-tours    { background:var(--black-soft); border-top:1px solid var(--black-border); border-bottom:1px solid var(--black-border); }

/* Newsletter home */
.home-newsletter { background:var(--black-soft); border-top:1px solid var(--black-border); padding:4rem 0; }
.home-newsletter__inner { display:flex; gap:3rem; align-items:center; flex-wrap:wrap; }
.home-newsletter__text { flex:1; min-width:260px; }
.home-newsletter__title { font-size:clamp(2rem,4vw,3rem); margin-bottom:.5rem; }
.home-newsletter__form { display:flex; gap:0; flex-shrink:0; }
.newsletter-input,
.newsletter-strip__input { background:var(--black-card); border:1px solid var(--black-border); border-right:none; border-radius:var(--radius-sm) 0 0 var(--radius-sm); padding:.75rem 1.25rem; color:var(--white); font-size:.95rem; min-width:240px; }
.newsletter-input:focus,
.newsletter-strip__input:focus { outline:none; border-color:var(--accent); }
.home-newsletter__form .btn--primary,
.newsletter-strip__btn { border-radius:0 var(--radius-sm) var(--radius-sm) 0; }

/* Newsletter strip footer */
.newsletter-strip { background:var(--accent); color:var(--black); padding:2.5rem 0; }
.newsletter-strip__inner { display:flex; align-items:center; gap:2rem; flex-wrap:wrap; }
.newsletter-strip__label { font-family:var(--font-mono); font-size:.75rem; letter-spacing:.15em; text-transform:uppercase; opacity:.7; white-space:nowrap; }
.newsletter-strip__heading { font-family:var(--font-display); font-size:1.5rem; flex:1; min-width:200px; }
.newsletter-strip__form { display:flex; gap:0; flex-shrink:0; }
.newsletter-strip__input { color:var(--black); border-color:rgba(0,0,0,.2); }
.newsletter-strip__btn { background:var(--black); color:var(--white); border-radius:0 var(--radius-sm) var(--radius-sm) 0; }
.newsletter-strip__btn:hover { background:#222; transform:none; }

/* ══════════════════════════════════════════════════════════
   FOOTER
   ══════════════════════════════════════════════════════════ */
.site-footer { background:var(--black-soft); border-top:1px solid var(--black-border); }

.site-footer__main { padding:4rem 0; }
.site-footer__grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:3rem; }

.site-footer__logo-text { font-family:var(--font-display); font-size:1.8rem; letter-spacing:.1em; text-transform:uppercase; }
.site-footer__brand-col img { height:40px; width:auto; margin-bottom:1rem; }
.site-footer__tagline { color:var(--grey-mid); font-size:.9rem; margin-top:.5rem; margin-bottom:1.5rem; }
.social-links { display:flex; gap:.75rem; flex-wrap:wrap; }
.social-links__link { width:2.25rem; height:2.25rem; background:var(--black-card); border:1px solid var(--black-border); border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; font-size:.75rem; color:var(--grey-light); transition:all .2s; }
.social-links__link:hover { background:var(--accent); color:var(--black); border-color:var(--accent); }

.site-footer__col-title { font-size:.8rem; letter-spacing:.15em; color:var(--grey-mid); margin-bottom:1rem; }
.site-footer__nav { display:flex; flex-direction:column; gap:.5rem; }
.site-footer__nav a { font-size:.9rem; color:var(--grey-light); transition:color .2s; }
.site-footer__nav a:hover { color:var(--white); }

.site-footer__event-list { display:flex; flex-direction:column; gap:.75rem; }
.site-footer__event-item a { display:grid; grid-template-columns:2.5rem 1fr; grid-template-rows:auto auto; gap:0 .75rem; align-items:center; }
.site-footer__event-date  { font-family:var(--font-display); font-size:1rem; color:var(--accent); grid-row:1/3; }
.site-footer__event-title { font-size:.85rem; font-weight:500; }
.site-footer__event-city  { font-size:.75rem; color:var(--grey-mid); }

.site-footer__bottom { border-top:1px solid var(--black-border); padding:1.25rem 0; }
.site-footer__bottom-inner { display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; }
.site-footer__legal,
.site-footer__theme-credit { font-size:.8rem; color:var(--grey-mid); }

/* ══════════════════════════════════════════════════════════
   WIDGET SIDEBAR
   ══════════════════════════════════════════════════════════ */
.widget { margin-bottom:2rem; }
.widget__title { font-size:1rem; margin-bottom:1rem; padding-bottom:.5rem; border-bottom:1px solid var(--black-border); }
.widget-events-list { display:flex; flex-direction:column; gap:.75rem; }
.widget-events-list__item a { display:grid; grid-template-columns:2rem 1fr; gap:0 .75rem; align-items:start; }
.widget-events-list__date  { font-family:var(--font-display); font-size:.9rem; color:var(--accent); }
.widget-events-list__title { font-size:.85rem; font-weight:500; }
.widget-events-list__city  { font-size:.75rem; color:var(--grey-mid); grid-column:2; }

/* ══════════════════════════════════════════════════════════
   SINGLE EVENT — cancelled state
   ══════════════════════════════════════════════════════════ */
.single-event--cancelled .event-hero::before {
  content:'CANCELADO';
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%) rotate(-15deg);
  font-family:var(--font-display);
  font-size:clamp(5rem,15vw,12rem);
  color:var(--red-hot);
  opacity:.18;
  pointer-events:none;
  z-index:2;
  white-space:nowrap;
  letter-spacing:.2em;
}

/* ══════════════════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════════════════ */
@media (max-width:1024px) {
  .event-body { grid-template-columns: 1fr; }
  .event-sidebar { position: static; }
  .site-footer__grid { grid-template-columns:1fr 1fr; }
}

@media (max-width:768px) {
  :root { --header-h:60px; }

  .site-nav { position:fixed; top:var(--header-h); left:0; right:0; bottom:0; background:var(--black); padding:2rem; overflow-y:auto; transform:translateX(100%); transition:transform .35s var(--ease-out); z-index:var(--z-header); }
  .site-nav.is-open { transform:translateX(0); }
  .site-nav__menu { flex-direction:column; align-items:flex-start; gap:1.5rem; }
  .site-nav__menu a { font-size:1.2rem; }
  .nav-toggle { display:flex; }

  .event-hero__title  { font-size:clamp(2.5rem,10vw,4rem); }
  .home-hero__title   { font-size:clamp(3rem,12vw,5rem); }
  .tour-hero__title   { font-size:clamp(2.5rem,10vw,4.5rem); }

  /* ── EVENT ROW en móvil ─────────────────────────────────
     Layout: [ fecha | thumb | info ] en una sola fila compacta
     Sin columna de acciones (se oculta)
  ──────────────────────────────────────────────────────── */
  .event-row {
    grid-template-columns: 52px 48px 1fr;
    gap: .5rem .75rem;
    padding: .875rem 1rem;
    align-items: center;
  }
  .event-row__date { text-align:center; }
  .event-row__day  { font-size: 1.4rem; }
  .event-row__thumb { display: block; }
  .event-row__img   { width: 48px; height: 48px; border-radius: var(--radius-sm); }
  .event-row__info  { min-width: 0; }
  .event-row__title a { font-size: 1rem; }
  /* Venue en una sola línea con ellipsis */
  .event-row__meta  { gap: .2rem .5rem; flex-wrap: nowrap; flex-direction: column; }
  .event-row__venue,
  .event-row__artists {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    display: block;
  }
  .event-row__time,
  .event-row__tour-tag { display: none; }
  .event-row__actions { display: none; }

  /* ── GRID: 1 columna en móvil ─────────────────────────── */
  #events-container[data-view="grid"] {
    grid-template-columns: 1fr !important;
  }
  .events-grid,
  .events-grid--compact { grid-template-columns: 1fr; }

  .tour-timeline__item { grid-template-columns:70px 1fr; }
  .tour-timeline__actions { grid-column:1/-1; flex-direction:row; justify-content:flex-start; }

  .agenda-filters { flex-direction:column; align-items:stretch; }
  .agenda-filters__select { min-width:unset; width:100%; }

  .site-footer__grid { grid-template-columns:1fr; }
  .site-footer__events-col { display:none; }

  .home-newsletter__inner { flex-direction:column; }
  .home-newsletter__form  { width:100%; }
  .newsletter-input { flex:1; min-width:0; }

  /* Mobile: todo en columna única */
  .event-body { grid-template-columns: 1fr !important; gap: 2rem; }
  .event-body__poster { max-width: 260px; }
  .event-sidebar { position: static; }
}

@media (max-width:480px) {
  .event-row { grid-template-columns: 48px 44px 1fr; gap: .4rem .6rem; }
  .event-row__day { font-size: 1.2rem; }
  .events-grid { grid-template-columns: 1fr; }
  .tours-grid  { grid-template-columns:1fr; }
  .home-hero__actions { flex-direction:column; }
  .event-hero__actions { flex-direction:column; }
  .event-countdown-bar .container { flex-wrap:wrap; }
}

/* ══════════════════════════════════════════════════════════
   ACCESSIBILITY / REDUCED MOTION
   ══════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
  html { scroll-behavior:auto; }
}

/* ══════════════════════════════════════════════════════════
   LOADING SKELETON (para AJAX)
   ══════════════════════════════════════════════════════════ */
.skeleton { background:linear-gradient(90deg, var(--black-card) 25%, var(--black-border) 50%, var(--black-card) 75%); background-size:200% 100%; animation:shimmer 1.5s infinite; border-radius:var(--radius-sm); }
@keyframes shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

/* ══════════════════════════════════════════════════════════
   PRINT
   ══════════════════════════════════════════════════════════ */
@media print {
  .site-header, .site-footer, .event-sidebar__share, .agenda-filters, .nav-toggle { display:none !important; }
  body { background:#fff; color:#000; }
  .event-hero, .home-hero, .tour-hero { min-height:auto; background:none; padding:2rem 0; }
  .event-hero__overlay, .home-hero__overlay, .tour-hero__overlay { display:none; }
}

/* ══════════════════════════════════════════════════════════
   HELLO ELEMENTOR OVERRIDES
   Neutraliza los estilos base de Hello que chocan con
   el diseño oscuro de StageCraft.
   ══════════════════════════════════════════════════════════ */

/* Hello pone fondo blanco y color oscuro por defecto */
body.elementor-page,
body.hello-elementor {
  background-color: var(--black) !important;
  color: var(--white) !important;
}

/* Hello resetea márgenes del body — lo respetamos */
body { margin: 0; }

/* Hello añade padding-top cuando hay header sticky de Elementor Pro */
body.elementor-motion-effects-element-type-background,
body[data-elementor-device-mode] {
  background-color: var(--black);
}

/* Reset de enlaces que Hello estiliza en azul */
a { color: inherit; text-decoration: none; }
a:hover { color: var(--accent); }

/* Hello Elementor — sección por defecto sin padding */
.elementor-section.elementor-section-boxed > .elementor-container {
  max-width: var(--container, 1200px);
}

/* Tipografías: respetar las de StageCraft en headings dentro de Elementor */
.elementor-widget-heading .elementor-heading-title {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: .03em;
}

/* Botones de Elementor que hereden el estilo StageCraft */
.elementor-button {
  font-family: var(--font-display);
  letter-spacing: .08em;
  text-transform: uppercase;
  border-radius: var(--radius-sm);
}
.elementor-button-wrapper .elementor-button.elementor-size-md {
  padding: .75rem 1.75rem;
  font-size: 1.1rem;
}

/* Formularios de Elementor */
.elementor-field-group .elementor-field {
  background: var(--black-card);
  border-color: var(--black-border);
  color: var(--white);
  border-radius: var(--radius-sm);
}
.elementor-field-group .elementor-field:focus {
  border-color: var(--accent);
  outline: none;
  box-shadow: 0 0 0 3px rgba(139,0,0,.2);
}

/* Hello Elementor — modo Flexbox Container (Elementor 3.6+) */
.e-con {
  --e-con-max-width: var(--container, 1200px);
}

/* Elementor popup overlay oscuro */
.elementor-popup-modal .dialog-widget-content {
  background: var(--black-soft);
  border: 1px solid var(--black-border);
  color: var(--white);
}
