:root{
  --bc-bg: #1a1a1a;
  --bc-text: #ffffff;
  --bc-muted: rgba(255,255,255,.72);
  --bc-line: rgba(255,255,255,.14);
  --bc-panel: rgba(26,26,26,.78); /* panel encima de la foto */
  --bc-tag-1: #202020;
  --bc-tag-2: #272829;
}

/* 1) Oscurecer imagen del banner (para que el texto “respire”) */
.home-banner-wrapper .lgx-banner-style figure{
  position: relative;
  overflow: hidden;
}
.home-banner-wrapper .lgx-banner-style figure::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    90deg,
    rgba(26,26,26,.92) 0%,
    rgba(26,26,26,.78) 38%,
    rgba(26,26,26,.35) 70%,
    rgba(26,26,26,.10) 100%
  );
  pointer-events:none;
}

/* 2) Encapsular y “encuadrar” el texto como en PSD */
.bc-hero-card{
  display: inline-block;
  max-width: 720px;
  padding: 26px 28px;
  background: var(--bc-panel);
  border: 1px solid var(--bc-line);
  border-radius: 0;            /* cuadrado */
  backdrop-filter: blur(6px);  /* opcional, queda pro */
}

/* 3) Micro header arriba (NEW SERIES EDITION / NORTH + línea fina) */
.bc-hero-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-family: "Lato", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: 12px;
  color: var(--bc-muted);
  margin-bottom: 14px;
}
.bc-hero-divider{
  height:1px;
  background: var(--bc-line);
  margin: 0 0 18px 0;
}

/* 4) Tipos del banner (titular y subtítulo) */
.home-banner-wrapper .lgx-banner-info .title{
  color: var(--bc-text) !important;
  text-shadow: none !important;
  letter-spacing: .02em;
  line-height: 1.02;
  margin: 0 0 12px 0;
  /* si Monument no está cargada, cae al sistema */
  font-family: "MonumentExtended", "Bebas Neue", "Oswald", system-ui, sans-serif !important;
  font-weight: 400 !important;
}
.home-banner-wrapper .lgx-banner-info .subtitle{
  color: var(--bc-muted) !important;
  text-shadow: none !important;
  letter-spacing: .02em;
  line-height: 1.35;
  margin: 0 0 18px 0;
  font-family: "Lato", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  font-weight: 300 !important;
  font-size: 16px !important;
}

/* 5) Botón estilo “minimal” (en vez del rosa) */
.home-banner-wrapper .lgx-btn.lgx-btn-red{
  background: transparent !important;
  border: 1px solid var(--bc-line) !important;
  color: var(--bc-text) !important;
  border-radius: 0 !important;
  padding: 12px 18px !important;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 12px;
}
.home-banner-wrapper .lgx-btn.lgx-btn-red:hover{
  border-color: rgba(255,255,255,.28) !important;
}

/* 6) Dots del carrusel más “clean” */
.VueCarousel-dot{
  background-color: rgba(255,255,255,.20) !important;
}
.VueCarousel-dot--active{
  background-color: rgba(255,255,255,.85) !important;
}

/* 7) Responsive: que el panel ocupe ancho cómodo en móvil */
@media (max-width: 768px){
  .bc-hero-card{
    max-width: 92vw;
    padding: 18px 18px;
  }
  .home-banner-wrapper .lgx-banner-info .title{
    font-size: 34px !important;
  }
}
/* Asegura que el overlay quede detrás del texto */
.home-banner-wrapper .lgx-banner-style figure{
  position: relative;
}

.home-banner-wrapper .lgx-banner-style figure::after{
  z-index: 1;            /* overlay */
}

.home-banner-wrapper .lgx-banner-style figure img{
  position: relative;
  z-index: 0;            /* imagen */
}

.home-banner-wrapper .lgx-banner-style figure figcaption{
  position: absolute;    /* típico en sliders */
  inset: 0;
  z-index: 2;            /* texto por encima del overlay */
}
@font-face {
  font-family: "MonumentExtended";
  src: url("/fonts/MonumentExtended-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}


/* ===== MOBILE FIRST: tipografía legible y sin aplastarse ===== */
.home-banner-wrapper .lgx-banner-info .title{
  line-height: 1.08 !important;
  letter-spacing: -0.02em;
  margin-bottom: 10px;
  /* tamaño fluido: min 26px, ideal 6vw, max 44px */
  font-size: clamp(26px, 6vw, 44px) !important;
}

.home-banner-wrapper .lgx-banner-info .subtitle{
  line-height: 1.25 !important;
  margin-top: 0;
  margin-bottom: 16px;
  font-size: clamp(14px, 3.6vw, 20px) !important;
  opacity: 0.95;
}

/* Botón un pelín más compacto en móvil */
.home-banner-wrapper .lgx-banner-info .lgx-btn{
  font-size: 14px;
  padding: 10px 14px;
}
/* ===== Ajustes extra para móviles ===== */
@media (max-width: 768px){
  .home-banner-wrapper .lgx-banner-info{
    max-width: 92%;
  }
}

/* Teléfonos pequeños */
@media (max-width: 420px){
  .home-banner-wrapper .lgx-banner-info{
    max-width: 94%;
  }

  .home-banner-wrapper .lgx-banner-info .title{
    line-height: 1.12 !important;
    font-size: clamp(24px, 7vw, 38px) !important;
  }

  .home-banner-wrapper .lgx-banner-info .subtitle{
    font-size: clamp(13px, 4vw, 18px) !important;
  }
}
.home-banner-wrapper .lgx-banner-info .title,
.home-banner-wrapper .lgx-banner-info .subtitle{
  transform: none; /* evita glitches en algunos móviles */
}

/* ===== WRAPPER GENERAL ===== */
.home-banner-wrapper{
  background: #1a1a1a;            /* tu fondo */
  position: relative;
  overflow: hidden;
}

/* espacio vertical del banner (para que no quede apretado) */
.home-banner-wrapper .lgx-banner-style{
  padding: 48px 0;
}

@media (max-width: 768px){
  .home-banner-wrapper .lgx-banner-style{
    padding: 28px 0;
  }
}
/* ===== PANEL DE TEXTO / FRAME ===== */
.home-banner-wrapper .lgx-banner-info{
  display: inline-block;
  max-width: 720px;
  padding: 22px 0px 18px 15px;

}

/* línea superior tipo PSD */
.home-banner-wrapper .lgx-banner-info::before{
  content: "";
  display: block;
  height: 0px;
  background: rgba(255,255,255,0.25);
  margin-bottom: 14px;
}

/* Centrado vertical y buen padding lateral */
.home-banner-wrapper .lgx-container{
  padding-left: 18px;
  padding-right: 18px;
}

@media (max-width: 420px){
  .home-banner-wrapper .lgx-banner-info{
    max-width: 100%;
    padding: 16px 14px 14px 14px;
  }
}

:root{
  --bc-bg: #1a1a1a;
  --bc-bg-2: #202020;
  --bc-bg-3: #272829;
  --bc-txt: #ffffff;
  --bc-txt-dim: rgba(255,255,255,0.72);
  --bc-line: rgba(255,255,255,0.12);
  --bc-line-2: rgba(255,255,255,0.20);
}

html, body{
  background: var(--bc-bg);
  color: var(--bc-txt);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a{ color: inherit; }

/* Wrapper principal del contenido */
.main-wrapper,
.main-content,
#content,
.page-content{
  background: var(--bc-bg);
}

/* Container estándar tipo “marco” */
.bc-container{
  width: min(1160px, 100%);
  margin: 0 auto;
  padding-left: 18px;
  padding-right: 18px;
}

/* Secciones con aire */
.bc-section{
  padding: 34px 0;
  border-top: 1px solid var(--bc-line);
}

@media (max-width: 768px){
  .bc-section{ padding: 24px 0; }
}
.lgx-container{
  width: min(1160px, 100%);
  padding-left: 18px;
  padding-right: 18px;
}

.bc-block-title{
  margin: 0 0 18px 0;
  padding-top: 14px;
  border-top: 1px solid var(--bc-line-2);
  letter-spacing: 0.02em;
}

/* si usas MonumentExtended en títulos */
.bc-title{
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  font-size: clamp(18px, 3.2vw, 28px);
  line-height: 1.15;
  margin: 0;
}

.bc-subtitle{
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-size: clamp(13px, 2.4vw, 16px);
  line-height: 1.5;
  color: var(--bc-txt-dim);
  margin: 8px 0 0 0;
}
.bc-card{
  background: var(--bc-bg-2);
  border: 1px solid var(--bc-line);
  border-radius: 0;                 /* cuadrado */
  padding: 16px;
}

.bc-card--tight{ padding: 12px; }

.bc-card + .bc-card{ margin-top: 12px; }
.bc-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

@media (max-width: 992px){
  .bc-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px){
  .bc-grid{ grid-template-columns: 1fr; }
}
/* Defaults seguros */
h1,h2,h3,h4,h5,h6{
  line-height: 1.15;
  word-break: break-word;
  overflow-wrap: anywhere;
}

p, li, .text, .subtitle{
  line-height: 1.55;
}

/* Para tus títulos grandes del estilo banner / hero */
.bc-hero-title{
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  font-size: clamp(22px, 6vw, 54px);
  line-height: 1.02;              /* compact pero sin colapsar */
  letter-spacing: 0.01em;
  margin: 0;
}

/* En móviles muy pequeños, damos un pelín más de line-height */
@media (max-width: 380px){
  .bc-hero-title{ line-height: 1.08; }
}
.bc-btn{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border: 1px solid var(--bc-line-2);
  background: transparent;
  font-family: "Lato", sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  font-size: 12px;
}

.bc-btn:hover{
  border-color: rgba(255,255,255,0.35);
}
/* ============================
   BC CONTENT WRAPPER (HOME)
   ============================ */

.bc-content-wrapper{
  background: #1a1a1a;
  color: #ffffff;
  padding-left: 0px ;
}

@media screen and (max-width: 480px) {
.bc-content-wrapper {padding-left: 0px}
}

/* Containers: mismo ancho y padding consistente */
.bc-content-wrapper .container{
  width: min(1160px, 100%);
  padding-left: 18px;
  padding-right: 18px;
}

/* Secciones */
.bc-content-wrapper .section-space{
  padding: 40px 0;
  border-top: 1px solid rgba(255,255,255,0.08);
}

.section-space:nth-child(even){
  background:#202020;
}




/* Headings (Popular Cities / Genres / Artists / Recently Added / Blogs) */
.bc-content-wrapper .lgx-heading{
  margin: 0 0 14px 0;
}

.bc-content-wrapper .lgx-heading .heading{
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: clamp(18px, 3.2vw, 26px);
  line-height: 1.15;
  margin: 0;
  color: #fff;
}

/* Fix general mobile text crush / overlap */
.bc-content-wrapper h1,
.bc-content-wrapper h2,
.bc-content-wrapper h3,
.bc-content-wrapper h4,
.bc-content-wrapper p,
.bc-content-wrapper a{
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* ============================
   CARDS: Cities/Artists/Blogs
   (.lgx-single-news)
   ============================ */
.bc-content-wrapper .lgx-single-news{
  background: #202020;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 0; /* cuadrado */
  overflow: hidden;
}

.bc-content-wrapper .lgx-single-news figure{
  margin: 0;
}

.bc-content-wrapper .lgx-single-news img{
  width: 100%;
  height: 170px;           /* look más “cuadrado” */
  object-fit: cover;
  display: block;
}

/* Info */
.bc-content-wrapper .lgx-single-news .single-news-info{
  padding: 12px 12px 14px;
  background: #202020;
}

.bc-content-wrapper .lgx-single-news .title{
  margin: 0;
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.015em;
  font-size: clamp(14px, 2.2vw, 16px);
  line-height: 1.15;
}

.bc-content-wrapper .lgx-single-news .meta-wrapper span{
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-size: 12px;
  line-height: 1.4;
  color: rgba(255,255,255,0.72);
}

/* ============================
   GENRES (Popular Genres)
   ============================ */
.bc-content-wrapper .bc-categories-swiper .item{
  background: #202020;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 0;
}

.bc-content-wrapper .bc-categories-swiper .pad15{
  padding: 0px 0;
}

.bc-content-wrapper a.item-link-genre{
  text-decoration: none;
  display: block;
}

.bc-content-wrapper a.item-link-genre .lead{
  margin: 0;
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: 14px;
  line-height: 1.15;
  color: #fff;
}

/* ============================
   EVENTS (Recently Added)
   (.lgx-event)
   ============================ */
.bc-content-wrapper .lgx-event a{
  text-decoration: none;
  color: inherit;
  display: block;
  background: #202020;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 0;
  overflow: hidden;
}

/* Imagen */
.bc-content-wrapper .lgx-event__image img{
  width: 100%;
  height: 190px;
  object-fit: cover;
  display: block;
}

/* Tag arriba */
.bc-content-wrapper .lgx-event__tag{
  background: rgba(0,0,0,0.55);
  border-bottom: 1px solid rgba(255,255,255,0.10);
  padding: 10px 12px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.bc-content-wrapper .lgx-event__tag span{
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* Info */
.bc-content-wrapper .lgx-event__info{
  padding: 12px 12px 14px;
}

.bc-content-wrapper .lgx-event__info .meta-wrapper span{
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-size: 12px;
  line-height: 1.4;
  color: rgba(255,255,255,0.72);
}

.bc-content-wrapper .lgx-event__info .title{
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.015em;
  font-size: clamp(14px, 2.2vw, 16px);
  line-height: 1.15;
  margin: 8px 0 8px 0;
}

/* Descripción (tu bc-sub-title) */
.bc-content-wrapper .lgx-event__info .bc-sub-title{
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-size: 13px;
  line-height: 1.55;
  color: rgba(255,255,255,0.72);
  margin: 0 0 10px 0;
}

/* Lista de géneros debajo */
.bc-content-wrapper .lgx-event__info ul{
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.bc-content-wrapper .lgx-event__info ul li{
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 6px 8px;
  background: #272829;
  border: 1px solid rgba(255,255,255,0.10);
}

/* ============================
   SWIPER spacing + mobile tuning
   ============================ */
.bc-content-wrapper .swiper{
  padding-bottom: 8px;
}

@media (max-width: 768px){
  .bc-content-wrapper .section-space{
    padding: 24px 0;
  }

  /* móvil: más aire en line-height para evitar “pegado” */
  .bc-content-wrapper .lgx-heading .heading{
    line-height: 1.20;
    letter-spacing: 0.015em;
  }

  .bc-content-wrapper .lgx-single-news img{
    height: 150px;
  }

  .bc-content-wrapper .lgx-event__image img{
    height: 170px;
  }
}

@media (max-width: 380px){
  /* móviles muy pequeños: evita que Monument quede demasiado apretado */
  .bc-content-wrapper .lgx-single-news .title,
  .bc-content-wrapper .lgx-event__info .title,
  .bc-content-wrapper a.item-link-genre .lead{
    line-height: 1.22;
  }
}
/* ============================
   MOBILE CAROUSEL MODE (peek)
   Swiper (Cities / Genres / Artists)
   ============================ */

/* En móvil: deja ver 1 slide + "peek" del siguiente */
@media (max-width: 768px){

  /* Swiper containers: un pelín de padding lateral para el peek */
  .bc-content-wrapper .swiper{
    padding-left: 18px;
    padding-right: 18px;
  }

  /* Importante: el wrapper ya gestiona widths, pero evitamos que se corte el peek */
  .bc-content-wrapper .swiper,
  .bc-content-wrapper .swiper-wrapper{
    overflow: visible;
  }

  /* Cada slide: que no se estreche raro */
  .bc-content-wrapper .swiper-slide{
    height: auto;
  }

  /* Cards: que llenen el slide, sin márgenes raros */
  .bc-content-wrapper .swiper-slide .lgx-single-news,
  .bc-content-wrapper .swiper-slide .item{
    width: 100%;
  }

  /* Evita saltos por títulos largos: 2 líneas + ellipsis */
  .bc-content-wrapper .lgx-single-news .title a,
  .bc-content-wrapper .lgx-event__info .title{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }

  /* Meta también controlada */
  .bc-content-wrapper .lgx-single-news .meta-wrapper span{
    display: inline-block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

/* ============================
   VueCarousel (tu HERO slider)
   Ajuste móvil para que no se "aplasten" líneas
   ============================ */
@media (max-width: 768px){
  .home-banner-wrapper .lgx-banner-info .title{
    line-height: 1.15;
    letter-spacing: 0.01em;
  }
  .home-banner-wrapper .lgx-banner-info .subtitle{
    line-height: 1.35;
  }

  /* Si tu CTA se rompe, lo hacemos compacto */
  .home-banner-wrapper .lgx-btn{
    padding: 10px 14px;
    font-size: 13px;
    line-height: 1.1;
  }
}
/* Full-bleed: ocupa todo el viewport aunque el padre tenga max-width */
.home-banner-wrapper,
.bc-content-wrapper {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* Evita scroll horizontal por 100vw + scrollbar */
html, body {
  overflow-x: hidden;
}
.home-banner-wrapper,
.bc-content-wrapper {
  width: 100%;
  max-width: none;
}
/* Inner centrado SOLO donde lo necesitas */
.bc-content-wrapper .bc-inner,
.home-banner-wrapper .bc-inner {
  max-width: 1165px;
  margin: 0 auto;
  padding-left: 16px;
  padding-right: 16px;
}

/* ============================
   FIX ROOT CONTAINER (HOME)
   ============================ */
body.home #eventmie_app.lgx-container{
  width: 100% !important;
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.bc-inner{
  max-width: 1165px;
  margin: 0 auto;
  padding-left: 16px;
  padding-right: 16px;
}

@media (max-width: 768px){
  .bc-content-wrapper .lgx-heading{
    padding-left: 16px;
    padding-right: 16px;
  }
}
.bc-content-wrapper{ --side-pad: 18px; }

.bc-content-wrapper .lgx-heading,
.bc-content-wrapper .swiper{
  padding-left: var(--side-pad);
  padding-right: var(--side-pad);
}

@media (max-width: 768px){
  .bc-content-wrapper{ --side-pad: 16px; }
}

@media (max-width: 768px){
  .bc-inner > .row{
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* carrusel horizontal SOLO para la fila de cards (la 2da row de blogs) */
  .bc-inner .row + .row{
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 14px;
    padding-bottom: 10px;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
  }

  .bc-inner .row + .row > [class*="col-"]{
    flex: 0 0 80%;
    max-width: 80%;
    padding-left: 0 !important;
    padding-right: 0 !important;
    scroll-snap-align: start;
  }
}





.bc-inner .section-btn-area{
  margin-top: 18px;
}
@media (min-width: 992px){
  .bc-inner .section-btn-area{
    max-width: 75%;   /* ≈ col-lg-9 de 12 */
  }
}

.bc-inner .col-12.col-lg-9 > .row > [class*="col-"] {
    padding-left: 16px;
    padding-right: 10px;
}
.bc-inner .col-12.col-lg-9 > .row
 {
    margin-left: 0px; 
    margin-right: 0px;
}

.container-fluid .lgx-event {
    background: #272829;
    margin-bottom: 12px;
    margin-top: 0px;
    padding-top: 0px;
    padding-left: 0px;
    padding-bottom: 0px;
    padding-right: 0px;
}


/* ===== Event venue line (sub-title @Club ...) ===== */
.lgx-event__info h5.sub-title{
  height: 15px !important;        /* pisa el inline 12px */
  min-height: 15px !important;
  
  font-size: 12px !important;
  line-height: 1.2;

  display: flex;                 /* centrado vertical bonito */
  align-items: center;

  margin: 6px 0 10px 0;          /* separación con tags */
  overflow: hidden;              /* evita desbordes */
}

.lgx-event__info h5.sub-title{
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* solo en home */
.bc-inner .col-12.col-lg-9{
  padding-right: 0 !important;
}
/* Blogs: alinear la row con el heading y controlar gutters */
.bc-inner .bc-blogs-row{
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.bc-inner .bc-blogs-row > [class*="col-"]{
  padding-left: 16px !important;
  padding-right: 10px !important; /* o 16px si quieres simétrico */
}


/* ============================
   BC NAVBAR (match bc-theme)
   ============================ */

/* Header sticky: mismo panel que usas en hero */
#navbar_vue.lgx-header-position-fixed{
  background: rgba(26,26,26,0.78) !important; /* = --bc-panel vibe */
  border-bottom: 1px solid var(--bc-line) !important;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* Reduce “ruido” del theme original */
#navbar_vue .navbar{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Links: Lato, uppercase suave como tu sistema */
#navbar_vue .lgx-nav > li > a{
  font-family: "Lato", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  font-weight: 400 !important;
  text-transform: uppercase;
  letter-spacing: .10em;
  font-size: 12px;
  color: var(--bc-txt) !important;
  opacity: .86;
  padding: 18px 14px !important;
}

/* Hover / Active: underline fino + mejora legibilidad */
#navbar_vue .lgx-nav > li > a:hover,
#navbar_vue .lgx-nav > li.active > a{
  opacity: 1;
}

#navbar_vue .lgx-nav > li:not(.bc-cta) > a{
  position: relative;
}
#navbar_vue .lgx-nav > li:not(.bc-cta) > a::after{
  content:"";
  position:absolute;
  left: 14px;
  right: 14px;
  bottom: 12px;
  height: 1px;
  background: transparent;
  transition: .18s ease;
}
#navbar_vue .lgx-nav > li:not(.bc-cta) > a:hover::after,
#navbar_vue .lgx-nav > li.active:not(.bc-cta) > a::after{
  background: rgba(255,255,255,0.22);
}

/* Dropdown: cuadrado + frame */
#navbar_vue .dropdown-menu{
  background: #202020 !important; /* = --bc-bg-2 */
  border: 1px solid var(--bc-line) !important;
  border-radius: 0 !important;
  padding: 8px !important;
  margin-top: 10px !important;
  box-shadow: 0 18px 50px rgba(0,0,0,0.45);
}

#navbar_vue .dropdown-menu > li > a{
  font-family: "Lato", sans-serif !important;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 12px;
  color: rgba(255,255,255,0.88) !important;
  padding: 10px 12px !important;
  border-radius: 0 !important;
}

#navbar_vue .dropdown-menu > li > a:hover{
  background: rgba(255,255,255,0.08) !important;
}

/* Divider en dropdown */
#navbar_vue .dropdown-menu .divider{
  background: rgba(255,255,255,0.10) !important;
  height: 1px !important;
  margin: 8px 6px !important;
}

/* CTA "Find Events": mismo look que tu botón minimal del hero (cuadrado) */
#navbar_vue .lgx-nav > li.bc-cta > a{
  background: transparent !important;
  border: 1px solid var(--bc-line) !important;
  border-radius: 0 !important;
  padding: 12px 16px !important;
  opacity: 1 !important;
}

#navbar_vue .lgx-nav > li.bc-cta > a:hover{
  border-color: rgba(255,255,255,.28) !important;
  background: rgba(255,255,255,0.04) !important;
}

/* Quita iconitos cuadrados (si los estabas dejando) para look más “editorial” */
#navbar_vue .lgx-nav i{
  display: none;
}

/* Logo/brand: Monument vibe (si no, fallback a system) */
#navbar_vue .lgx-logo .brand-name{
  font-family: "MonumentExtended", "Bebas Neue", "Oswald", system-ui, sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: .04em;
  color: var(--bc-txt);
}

/* Mobile: dropdown y CTA full width más limpio */
@media (max-width: 768px){
  #navbar_vue .lgx-nav > li > a{
    padding: 14px 14px !important;
  }
  #navbar_vue .lgx-nav > li.bc-cta{
    padding: 10px 14px !important;
  }
  #navbar_vue .lgx-nav > li.bc-cta > a{
    display: block;
    text-align: center;
  }
}

/* Más padding al contenedor del header (aire arriba y laterales) */
#navbar_vue .lgx-container-fluid{
  padding-left: 0px !important;
  padding-right: 22px !important;
}

/* Ajusta altura/aire del navbar */
#navbar_vue .navbar{
  min-height: 64px;
}

/* Baja un poco todo el menú para que no “toque techo” */
#navbar_vue .lgx-nav > li > a{
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

/* CTA: separarlo del borde derecho y centrarlo en la barra */
#navbar_vue .lgx-nav > li.bc-cta{
  margin-left: 10px;
  padding-right: 6px; /* crea aire a la derecha */
}
#navbar_vue .lgx-nav > li.bc-cta > a{
  margin-top: 2px; /* micro ajuste visual */
}

/* Elimina el GAP que mata el hover */
#navbar_vue .dropdown-menu{
  margin-top: 0 !important;
}

/* “pegar” el dropdown al link sin hueco */
#navbar_vue .dropdown.bc-dropdown{
  position: relative;
}
#navbar_vue .dropdown.bc-dropdown .dropdown-menu{
  top: calc(100% - 2px) !important;   /* casi pegado al link */
  left: 0 !important;
}

/* Opcional: crea una zona invisible de hover para que no se corte */
#navbar_vue .dropdown.bc-dropdown > a::before{
  content:"";
  position:absolute;
  left: 0;
  right: 0;
  bottom: -10px;
  height: 12px;
}

@media (min-width: 992px){
  #navbar_vue .dropdown.bc-dropdown:hover > .dropdown-menu{
    display: block;
  }
}


/* =========================
   NAV CTA usando lgx-btn base
   ========================= */

.bc-nav-btn{
  /* quitamos look azul redondeado del template */
  background: transparent !important;
  border: 1px solid var(--bc-line) !important;

  border-radius: 0 !important; /* cuadrado BC */
  box-shadow: none !important;

  font-family: "Lato", sans-serif !important;
  text-transform: uppercase;
  letter-spacing: .10em;

  padding: 10px 16px !important;
}

/* hover coherente con tu sistema */
.bc-nav-btn:hover{
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,.28) !important;
}

/* mantiene el efecto brillante del template */
.bc-nav-btn:after{
  background: rgba(255,255,255,.25) !important; /* más sutil que azul */
  opacity: .25;
}


/* Evitar scroll horizontal en dropdown */
#navbar_vue .dropdown-menu{
  overflow-x: hidden !important;
}

/* Permitir que el texto largo parta en varias líneas */
#navbar_vue .dropdown-menu > li > a{
  white-space: normal !important;
  line-height: 1.25;
}

/* Ancho razonable para dropdown (y que el texto envuelva dentro) */
#navbar_vue .dropdown-menu{
  min-width: 240px;
  max-width: 320px; /* ajusta si quieres más ancho */
}

/* Si hay palabras muy largas (sin espacios), que rompa igual */
#navbar_vue .dropdown-menu > li > a{
  overflow-wrap: anywhere;
  word-break: break-word;
}
/* ===== NAVBAR-COLLAPSE FIX ===== */

#navbar_vue .navbar-collapse{
  padding-top: 10px !important;     /* aire arriba */
  padding-bottom: 15px !important;  /* aire abajo */

  padding-right: 0 !important;      /* quita espacio extra derecha */
  padding-left: 0 !important;       /* opcional, más centrado */

  overflow-x: visible !important;   /* mantenemos visible para dropdowns */
  border-top: 0 !important;
  box-shadow: none !important;
}

#navbar_vue .lgx-nav > li > a{
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}






/* =========================================================
   BC THEME — Events index (/events)
   Scoped to avoid affecting other pages
========================================================= */

/* Si no tienes un scope claro por route, este selector funciona
   porque /events usa lgx-schedule + main-wrapper */
.lgx-schedule + .main-wrapper {
  /* tokens ligeros (si ya tienes variables en bc-theme, reemplaza) */
  --bc-bg: #202020;
  --bc-panel: #272829;
  --bc-panel-2: #1f1f1f;
  --bc-border: rgba(255,255,255,.08);
  --bc-text: rgba(255,255,255,.88);
  --bc-muted: rgba(255,255,255,.62);
  --bc-accent: #d6a03d;
  --bc-radius: 16px;
  --bc-radius-sm: 12px;
  --bc-shadow: 0 10px 30px rgba(0,0,0,.35);
}

/* Contenedor general */
.lgx-schedule + .main-wrapper .lgx-page-wrapper {
  padding-top: 18px;
  padding-bottom: 40px;
}

/* El container-fluid de Eventmie suele ir “a pelo” */
.lgx-schedule + .main-wrapper .container-fluid {
  padding-left: 18px;
  padding-right: 18px;
}

/* =========================================================
   Layout: sidebar + grid
========================================================= */

/* Estructura base */
.lgx-schedule + .main-wrapper .row-search-left {
  padding-right: 10px;
}
.lgx-schedule + .main-wrapper .row-search-right {
  padding-left: 10px;
}

/* Sidebar panel */
.lgx-schedule + .main-wrapper .row-search-left .col-lg-3 {
  position: relative;
}

@media (min-width: 992px) {
  /* Sticky sidebar en desktop */
  .lgx-schedule + .main-wrapper .row-search-left .col-lg-3 > .form-group:first-child {
    /* el form-group no envuelve todo, así que hacemos sticky al bloque completo */
  }
  .lgx-schedule + .main-wrapper .row-search-left .col-12.col-lg-3.mb-50.pl-30 {
    position: sticky;
    top: 86px; /* ajusta según alto del header sticky */
    align-self: flex-start;
  }
}

/* Caja “panel” para filtros: como no hay wrapper, estilizamos el col */
.lgx-schedule + .main-wrapper .row-search-left .col-12.col-lg-3.mb-50.pl-30 {
  padding: 16px !important;
  background: var(--bc-panel);
  border: 1px solid var(--bc-border);
  border-radius: var(--bc-radius);
  box-shadow: var(--bc-shadow);
}

/* Labels */
.lgx-schedule + .main-wrapper .row-search-left label {
  color: var(--bc-muted);
  font-weight: 600;
  font-size: 12px;
  letter-spacing: .02em;
  margin-bottom: 8px;
}

/* Inputs / selects */
.lgx-schedule + .main-wrapper .row-search-left .form-control,
.lgx-schedule + .main-wrapper .row-search-left .mx-datepicker {
  background: var(--bc-panel-2);
  color: var(--bc-text);
  border: 1px solid var(--bc-border);
  border-radius: 12px;
  box-shadow: none;
}

.lgx-schedule + .main-wrapper .row-search-left .form-control:focus,
.lgx-schedule + .main-wrapper .row-search-left .mx-datepicker:focus-within {
  border-color: rgba(214,160,61,.55);
  box-shadow: 0 0 0 3px rgba(214,160,61,.12);
}

/* Icono calendario dentro del datepicker */
.lgx-schedule + .main-wrapper .row-search-left .mx-icon-calendar svg path {
  fill: var(--bc-muted);
}

/* Reset button */
.lgx-schedule + .main-wrapper .row-search-left .lgx-btn.btn-block {
  border-radius: 12px;
  padding: 12px 14px;
  font-weight: 700;
  border: 1px solid var(--bc-border);
  background: transparent;
  color: var(--bc-text);
}
.lgx-schedule + .main-wrapper .row-search-left .lgx-btn.btn-block:hover {
  border-color: rgba(214,160,61,.45);
  background: rgba(214,160,61,.08);
}

/* =========================================================
   Grid de eventos (cards)
========================================================= */

/* La row que contiene cols */
.lgx-schedule + .main-wrapper .row-search-right .col-lg-9 > .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
  display: flex;
  flex-wrap: wrap;
  gap: 14px; /* gap real */
}

/* Quitamos padding lateral de columnas para que no compita con gap */
.lgx-schedule + .main-wrapper .row-search-right .col-lg-9 > .row > [class*="col-"] {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Ajuste del “ancho” por breakpoints respetando tu col-lg-4 */
@media (min-width: 1200px) {
  .lgx-schedule + .main-wrapper .row-search-right .col-lg-9 > .row > .col-lg-4 {
    width: calc((100% - (14px * 2)) / 3);
  }
}
@media (min-width: 576px) and (max-width: 1199.98px) {
  .lgx-schedule + .main-wrapper .row-search-right .col-lg-9 > .row > .col-sm-6 {
    width: calc((100% - (14px * 1)) / 2);
  }
}
@media (max-width: 575.98px) {
  .lgx-schedule + .main-wrapper .row-search-right .col-lg-9 > .row > [class*="col-"] {
    width: 100%;
  }
}

/* Card base */
.lgx-schedule + .main-wrapper .lgx-event > a {
  display: block;
  height: 100%;
  border-radius: var(--bc-radius);
  overflow: hidden;
  background: var(--bc-panel);
  border: 1px solid var(--bc-border);
  box-shadow: var(--bc-shadow);
  transform: translateY(0);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.lgx-schedule + .main-wrapper .lgx-event > a:hover {
  transform: translateY(-3px);
  border-color: rgba(214,160,61,.35);
  box-shadow: 0 16px 40px rgba(0,0,0,.45);
  text-decoration: none;
}

/* Imagen: proporción consistente */
.lgx-schedule + .main-wrapper .lgx-event__image img {
  width: 100%;
  height: 190px; /* ajusta si quieres más “poster look” */
  object-fit: cover;
  display: block;
  filter: saturate(1.02) contrast(1.02);
}

/* Info padding */
.lgx-schedule + .main-wrapper .lgx-event__info {
  padding: 14px 14px 12px 14px;
}

/* Meta (fecha / country / city) */
.lgx-schedule + .main-wrapper .lgx-event__info .meta-wrapper {
  color: var(--bc-muted);
  font-size: 12px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

/* Título: clamp a 2 líneas */
.lgx-schedule + .main-wrapper .lgx-event__info .title {
  color: var(--bc-text);
  font-weight: 800;
  font-size: 16px;
  line-height: 1.25;
  margin: 0 0 8px 0;

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Sub-descripción (bc-sub-title): clamp */
.lgx-schedule + .main-wrapper .lgx-event__info .bc-sub-title {
  color: var(--bc-muted);
  font-size: 13px;
  line-height: 1.35;
  margin: 0 0 10px 0;

  display: -webkit-box;
  -webkit-line-clamp: 3; /* 2 si lo quieres más compacto */
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Venue line */
.lgx-schedule + .main-wrapper .lgx-event__info .sub-title {
  margin: 0 0 10px 0;
  font-size: 13px;
  font-weight: 700;
  color: var(--bc-accent) !important; /* tú usas text-primary, lo unificamos */
}

/* Categorías list (ul) */
.lgx-schedule + .main-wrapper .lgx-event__info ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.lgx-schedule + .main-wrapper .lgx-event__info ul li {
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--bc-border);
  background: rgba(255,255,255,.04);
  color: var(--bc-text);
}

/* Tag superior (Today / Event) */
.lgx-schedule + .main-wrapper .lgx-event__tag {
  position: absolute;
  top: 12px;
  left: 12px;
  display: flex;
  gap: 8px;
  z-index: 3;
}
.lgx-schedule + .main-wrapper .lgx-event__tag span {
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 800;
  border: 1px solid rgba(0,0,0,.25);
  background: rgba(0,0,0,.55);
  color: #fff;
  backdrop-filter: blur(6px);
}
.lgx-schedule + .main-wrapper .lgx-event__tag span:first-child {
  border-color: rgba(214,160,61,.35);
  background: rgba(214,160,61,.18);
}

/* Si estás usando el bloque .lgx-event__category debajo, lo hacemos “footer pill” */
.lgx-schedule + .main-wrapper .lgx-event__category {
  padding: 0 14px 14px 14px;
}
.lgx-schedule + .main-wrapper .lgx-event__category span strong {
  font-weight: 700;
  color: var(--bc-muted);
}

/* Evita que el <hr> te corte feo entre grid y paginación */
.lgx-schedule + .main-wrapper hr {
  border-top: 1px solid var(--bc-border);
  opacity: 1;
  margin: 18px 0;
}

/* Mobile: filtros arriba, grid debajo con aire */
@media (max-width: 991.98px) {
  .lgx-schedule + .main-wrapper .row-search-left,
  .lgx-schedule + .main-wrapper .row-search-right {
    padding-left: 0;
    padding-right: 0;
  }
  .lgx-schedule + .main-wrapper .row-search-left .col-12.col-lg-3.mb-50.pl-30 {
    margin-bottom: 14px;
  }
}


.lgx-schedule + .main-wrapper select:disabled {
  opacity: .55;
  cursor: not-allowed;
}


.lgx-inner-breadcrumb .breadcrumb-heading {
  font-weight: 900;
  letter-spacing: .01em;
}
.lgx-inner-breadcrumb .breadcrumb,
.lgx-inner-breadcrumb .breadcrumb a {
  opacity: .9;
}

/* ============================
   BC THEME → /events/ layout
   ============================ */

/* Scope SOLO /events */
.bc-events-page .container-fluid{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Quita gutters negativos raros si hay rows anidadas */
.bc-events-page .row{
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Columna derecha (grid) sin padding-right que te molesta */
.bc-events-page .row-search-right > .col-12.col-lg-9{
  padding-right: 0 !important;
  padding-left: 0 !important;
}

/* Y aplica tu patrón: padding en los items, no en la columna */
.bc-events-page .row-search-right > .col-12.col-lg-9 > .row > [class*="col-"]{
  padding-left: 16px !important;
  padding-right: 10px !important;  /* o 16px si quieres simetría */
}
/* Sidebar filtros */
.bc-events-page .row-search-left > .col-12.col-lg-3{
  padding-left: 16px !important;
  padding-right: 16px !important;
}

/* Si el template mete pl-30 (padding-left:30px), lo neutralizas */
.bc-events-page .row-search-left .pl-30{
  padding-left: 16px !important;
}

.lgx-inner-breadcrumb{
  background: #1a1a1a; /* o transparente */
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.lgx-inner-breadcrumb .container{
  max-width: 1165px; /* o lo que estés usando */
}
.bc-events-page hr{
  border-color: rgba(255,255,255,.10);
  margin: 24px 16px;
}

/* ===== EVENTS: evita que el sticky tape el título ===== */

/* Ajusta este valor a tu header real (prueba 72/80/88) */
:root{
  --bc-header-h: 80px;
}

/* Si tu header es fixed, empuja el primer bloque visible */
#eventmie_app .lgx-inner-breadcrumb{
  padding-top: calc(var(--bc-header-h) + 20px) !important;
}

/* Y por si acaso el main empieza antes del breadcrumb */
#eventmie_app .main-wrapper{
  padding-top: 0 !important;
}
/* ===== EVENTS: breadcrumb minimal dark ===== */
#eventmie_app .lgx-inner-breadcrumb{
  background: #1a1a1a !important;
  border-bottom: 0px solid rgba(255,255,255,.08) !important;
}

#eventmie_app .lgx-inner-breadcrumb .breadcrumb-heading{
  color: #fff !important;
  font-family: "MonumentExtended", sans-serif !important;
  letter-spacing: .5px;
  text-transform: uppercase;
  font-size: 22px;
  line-height: 1.15;
  margin: 0;
}

/* Migas */
#eventmie_app .lgx-inner-breadcrumb .breadcrumb a,
#eventmie_app .lgx-inner-breadcrumb .breadcrumb li{
  color: rgba(255,255,255,.70) !important;
  font-family: "Lato", sans-serif !important;
  font-size: 12px !important;
}
#eventmie_app .lgx-inner-breadcrumb .breadcrumb li.active{
  color: rgba(255,255,255,.95) !important;
}

/* ===== EVENTS: breadcrumb minimal dark ===== */
#eventmie_app .lgx-inner-breadcrumb{
  background: #1a1a1a !important;
  border-bottom: 0px solid rgba(255,255,255,.08) !important;
}

#eventmie_app .lgx-inner-breadcrumb .breadcrumb-heading{
  color: #fff !important;
  font-family: "MonumentExtended", sans-serif !important;
  letter-spacing: .5px;
  text-transform: uppercase;
  font-size: 22px;
  line-height: 1.15;
  margin: 0;
}

/* Migas */
#eventmie_app .lgx-inner-breadcrumb .breadcrumb a,
#eventmie_app .lgx-inner-breadcrumb .breadcrumb li{
  color: rgba(255,255,255,.70) !important;
  font-family: "Lato", sans-serif !important;
  font-size: 12px !important;
}
#eventmie_app .lgx-inner-breadcrumb .breadcrumb li.active{
  color: rgba(255,255,255,.95) !important;
}


/* =========================
   EVENTS (/events) - SCOPE REAL
   ========================= */

/* si pusiste la clase en <body> */
.bc-events-page .main-wrapper{
  background: #1a1a1a;
}

/* padding general */
.bc-events-page .lgx-page-wrapper{
  padding-top: 18px;
  padding-bottom: 40px;
}

/* container-fluid de events: mismo aire lateral que tu sistema */
.bc-events-page .lgx-page-wrapper > .container-fluid{
  padding-left: 16px !important;
  padding-right: 16px !important;
}

/* corrige filas anidadas raras */
.bc-events-page .lgx-page-wrapper .row{
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* columna derecha sin padding-right (tu queja del borde) */
.bc-events-page .row-search-right > .col-12.col-lg-9{
  padding-right: 0 !important;
  padding-left: 0 !important;
}

/* aplica padding a los items, no a la columna */
.bc-events-page .row-search-right > .col-12.col-lg-9 > .row > [class*="col-"]{
  padding-left: 16px !important;
  padding-right: 10px !important;
}


.bc-skin{
  background: #1a1a1a;
  color: #ffffff;
  padding-left: 0px ;
}

@media screen and (max-width: 480px) {
.bc-skin {padding-left: 0px}
}

/* Containers: mismo ancho y padding consistente */
.bc-skin .container{
  width: min(1160px, 100%);
  padding-left: 18px;
  padding-right: 18px;
}

/* Secciones */
.bc-skin .section-space{
  padding: 40px 0;
  border-top: 1px solid rgba(255,255,255,0.08);
}

.section-space:nth-child(even){
  background:#202020;
}




/* Headings (Popular Cities / Genres / Artists / Recently Added / Blogs) */
.bc-skin .lgx-heading{
  margin: 0 0 14px 0;
}

.bc-skin .lgx-heading .heading{
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: clamp(18px, 3.2vw, 26px);
  line-height: 1.15;
  margin: 0;
  color: #fff;
}

/* Fix general mobile text crush / overlap */
.bc-skin h1,
.bc-skin h2,
.bc-skin h3,
.bc-skin h4,
.bc-skin p,
.bc-skin a{
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* ============================
   CARDS: Cities/Artists/Blogs
   (.lgx-single-news)
   ============================ */
.bc-skin .lgx-single-news{
  background: #202020;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 0; /* cuadrado */
  overflow: hidden;
}

.bc-skin .lgx-single-news figure{
  margin: 0;
}

.bc-skin .lgx-single-news img{
  width: 100%;
  height: 170px;           /* look más “cuadrado” */
  object-fit: cover;
  display: block;
}

/* Info */
.bc-skin .lgx-single-news .single-news-info{
  padding: 12px 12px 14px;
  background: #202020;
}

.bc-skin .lgx-single-news .title{
  margin: 0;
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.015em;
  font-size: clamp(14px, 2.2vw, 16px);
  line-height: 1.15;
}

.bc-skin .lgx-single-news .meta-wrapper span{
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-size: 12px;
  line-height: 1.4;
  color: rgba(255,255,255,0.72);
}

/* ============================
   GENRES (Popular Genres)
   ============================ */
.bc-skin .bc-categories-swiper .item{
  background: #202020;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 0;
}

.bc-skin .bc-categories-swiper .pad15{
  padding: 0px 0px;
}

.bc-skin a.item-link-genre{
  text-decoration: none;
  display: block;
}

.bc-skin a.item-link-genre .lead{
  margin: 0;
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: 14px;
  line-height: 1.15;
  color: #fff;
}

/* ============================
   EVENTS (Recently Added)
   (.lgx-event)
   ============================ */
.bc-skin .lgx-event a{
  text-decoration: none;
  color: inherit;
  display: block;
  background: #202020;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 0;
  overflow: hidden;
}

/* Imagen */
.bc-skin .lgx-event__image img{
  width: 100%;
  height: 190px;
  object-fit: cover;
  display: block;
}

/* Tag arriba */
.bc-skin .lgx-event__tag{
  background: rgba(0,0,0,0.55);
  border-bottom: 1px solid rgba(255,255,255,0.10);
  padding: 10px 12px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.bc-skin .lgx-event__tag span{
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* Info */
.bc-skin .lgx-event__info{
  padding: 12px 12px 14px;
}

.bc-skin .lgx-event__info .meta-wrapper span{
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-size: 12px;
  line-height: 1.4;
  color: rgba(255,255,255,0.72);
}

.bc-skin .lgx-event__info .title{
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.015em;
  font-size: clamp(14px, 2.2vw, 16px);
  line-height: 1.15;
  margin: 8px 0 8px 0;
}

/* Descripción (tu bc-sub-title) */
.bc-skin .lgx-event__info .bc-sub-title{
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-size: 13px;
  line-height: 1.55;
  color: rgba(255,255,255,0.72);
  margin: 0 0 10px 0;
}

/* Lista de géneros debajo */
.bc-skin .lgx-event__info ul{
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.bc-skin .lgx-event__info ul li{
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 6px 8px;
  background: #272829;
  border: 1px solid rgba(255,255,255,0.10);
}

/* ============================
   SWIPER spacing + mobile tuning
   ============================ */
.bc-skin .swiper{
  padding-bottom: 8px;
}

@media (max-width: 768px){
  .bc-skin .section-space{
    padding: 24px 0;
  }

  /* móvil: más aire en line-height para evitar “pegado” */
  .bc-skin .lgx-heading .heading{
    line-height: 1.20;
    letter-spacing: 0.015em;
  }

  .bc-skin .lgx-single-news img{
    height: 150px;
  }

  .bc-skin .lgx-event__image img{
    height: 170px;
  }
}

@media (max-width: 380px){
  /* móviles muy pequeños: evita que Monument quede demasiado apretado */
  .bc-skin .lgx-single-news .title,
  .bc-skin .lgx-event__info .title,
  .bc-skin a.item-link-genre .lead{
    line-height: 1.22;
  }
}
/* ============================
   MOBILE CAROUSEL MODE (peek)
   Swiper (Cities / Genres / Artists)
   ============================ */

/* En móvil: deja ver 1 slide + "peek" del siguiente */
@media (max-width: 768px){

  /* Swiper containers: un pelín de padding lateral para el peek */
  .bc-skin .swiper{
    padding-left: 18px;
    padding-right: 18px;
  }

  /* Importante: el wrapper ya gestiona widths, pero evitamos que se corte el peek */
  .bc-skin .swiper,
  .bc-skin .swiper-wrapper{
    overflow: visible;
  }

  /* Cada slide: que no se estreche raro */
  .bc-skin .swiper-slide{
    height: auto;
  }

  /* Cards: que llenen el slide, sin márgenes raros */
  .bc-skin .swiper-slide .lgx-single-news,
  .bc-skin .swiper-slide .item{
    width: 100%;
  }

  /* Evita saltos por títulos largos: 2 líneas + ellipsis */
  .bc-skin .lgx-single-news .title a,
  .bc-skin .lgx-event__info .title{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }

  /* Meta también controlada */
  .bc-skin .lgx-single-news .meta-wrapper span{
    display: inline-block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

/* =========================================
   BC FILTERS — /events sidebar
   ========================================= */

/* Scope real si ya estás usando .bc-events-page en el <body> */
.bc-events-page .bc-filter-card{
  background: rgba(32,32,32,0.95);                 /* #202020 */
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 0;                                /* cuadrado BC */
  padding: 16px;
}

.bc-events-page .bc-filter-head{
  padding-bottom: 12px;
  margin-bottom: 14px;
  border-bottom: 1px solid rgba(255,255,255,0.10);
}

.bc-events-page .bc-filter-title{
  margin: 0 0 6px 0;
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: 14px;
  line-height: 1.15;
  color: #fff;
}

.bc-events-page .bc-filter-sub{
  margin: 0;
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-size: 12px;
  line-height: 1.45;
  color: rgba(255,255,255,0.72);
}

/* Form groups: más “compact” y consistente */
.bc-events-page .bc-filter-card .form-group{
  margin-bottom: 12px;
}

.bc-events-page .bc-filter-card label{
  display: block;
  margin-bottom: 8px;
  font-family: "Lato", sans-serif;
  font-weight: 600;
  font-size: 12px;
  letter-spacing: .02em;
  color: rgba(255,255,255,0.72);
}

/* Inputs / selects: look BC */
.bc-events-page .bc-filter-card .form-control{
  background: #1f1f1f;
  color: rgba(255,255,255,0.88);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 0;                 /* cuadrado BC */
  height: 42px;
  padding: 10px 12px;
  box-shadow: none !important;
}

.bc-events-page .bc-filter-card .form-control:focus{
  border-color: rgba(214,160,61,.55);
  box-shadow: 0 0 0 3px rgba(214,160,61,.12) !important;
  outline: none;
}

/* Select: flecha custom + padding */
.bc-events-page .bc-filter-card select.form-control{
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 42px;

  background-image:
    linear-gradient(45deg, transparent 50%, rgba(255,255,255,0.65) 50%),
    linear-gradient(135deg, rgba(255,255,255,0.65) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 12px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}

/* Disabled state */
.bc-events-page .bc-filter-card select:disabled,
.bc-events-page .bc-filter-card .form-control:disabled{
  opacity: .55;
  cursor: not-allowed;
}

/* Datepicker: que no se vea “componente externo” */
.bc-events-page .bc-filter-card .mx-datepicker{
  display: block;
  width: 100%;
  background: #1f1f1f;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 0;
}

.bc-events-page .bc-filter-card .mx-input{
  background: transparent !important;
  color: rgba(255,255,255,0.88) !important;
  border: 0 !important;
  height: 42px !important;
  padding: 10px 42px 10px 12px !important;
}

.bc-events-page .bc-filter-card .mx-input::placeholder{
  color: rgba(255,255,255,0.55);
}

/* Icono calendario */
.bc-events-page .bc-filter-card .mx-icon-calendar{
  right: 12px;
}
.bc-events-page .bc-filter-card .mx-icon-calendar svg path{
  fill: rgba(255,255,255,0.65);
}

/* Botón reset: coherente con tu “minimal CTA” */
.bc-events-page .bc-filter-actions .lgx-btn.btn-block{
  background: transparent !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  border-radius: 0 !important;
  height: 42px;
  padding: 10px 12px !important;

  font-family: "Lato", sans-serif !important;
  text-transform: uppercase;
  letter-spacing: .10em;
  font-size: 12px;
  color: rgba(255,255,255,0.92) !important;
}

.bc-events-page .bc-filter-actions .lgx-btn.btn-block:hover{
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(214,160,61,.45) !important;
}

.bc-filter-col{
  padding-left: 16px !important;
}
@media screen and (max-width: 480px) {
    .mb-50 {
        margin-bottom: 10px;
    }
    .pl-30 {
    padding-left: 30px;
    padding-right: 12px; 
}

}

/* =========================================
   BC /events header (breadcrumb area)
   ========================================= */

/* Reduce altura y quita look "hero viejo" */
.bc-events-page .lgx-inner-breadcrumb{
  padding: 18px 0 !important;                 /* antes suele ser enorme */
  background: rgba(32,32,32,0.96);
  border-bottom: 1px solid rgba(255,255,255,0.10);
}

/* Layout moderno: título + breadcrumb en columna, alineado izquierda */
.bc-events-page .lgx-inner-breadcrumb .breadcrumb-area{
  text-align: left !important;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* Título: estable y responsive */
.bc-events-page .lgx-inner-breadcrumb .breadcrumb-heading{
  margin: 0 !important;
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: .04em;
  line-height: 1.05;

  /* tamaño fluido sin romper */
  font-size: clamp(18px, 2.2vw, 28px);

  /* evita que se vaya palabra-por-palabra */
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;

  color: #fff;
}

/* Breadcrumb: discreto y que no “coma” espacio */
.bc-events-page .lgx-inner-breadcrumb .breadcrumb{
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  font-family: "Lato", sans-serif;
  font-size: 12px;
  letter-spacing: .02em;
  color: rgba(255,255,255,0.60);
}

/* Items en línea, sin centrado */
.bc-events-page .lgx-inner-breadcrumb .breadcrumb > li{
  display: inline-flex;
  align-items: center;
}

/* Separador más clean */
.bc-events-page .lgx-inner-breadcrumb .breadcrumb > li + li:before{
  content: "›";
  padding: 0 8px;
  color: rgba(255,255,255,0.35);
}

/* Link home */
.bc-events-page .lgx-inner-breadcrumb .breadcrumb a{
  color: rgba(255,255,255,0.70);
}
.bc-events-page .lgx-inner-breadcrumb .breadcrumb a:hover{
  color: rgba(214,160,61,0.95);
}

/* Móvil: oculta el breadcrumb si estorba (opcional pero recomendado) */
@media (max-width: 575.98px){
  .bc-events-page .lgx-inner-breadcrumb{
    padding: 14px 0 !important;
  }
  .bc-events-page .lgx-inner-breadcrumb .breadcrumb{
    display: none;
  }
}

/* =========================================
   /events header fix — Eventmie breadcrumb
   ========================================= */

/* Corta el alto y neutraliza fondos raros */
#lgx-schedule .lgx-inner-breadcrumb{
  padding: 16px 0 !important;
  background: transparent !important;           /* fuera bloque #272829 */
  border-bottom: 0px solid rgba(255,255,255,0.10);
}

/* A veces el fondo no está en lgx-inner-breadcrumb sino dentro */
#lgx-schedule .lgx-inner-breadcrumb .breadcrumb-area,
#lgx-schedule .lgx-inner-breadcrumb .breadcrumb-heading-area{
  background: transparent !important;
}

/* Si hay overlay/tint del theme viejo */
#lgx-schedule.lgx-schedule-dark,
#lgx-schedule.lgx-schedule-dark *{
  /* no tocamos todo, pero evitamos que un wrapper meta fondos */
}

/* Layout: izquierda, compacto */
#lgx-schedule .lgx-inner-breadcrumb .breadcrumb-area{
  text-align: left !important;
  margin: 0 !important;
  padding-top: 100px;
}
@media only screen and (max-width: 767px) {
    .col-xs-12{
        width: 100%;
    }
}
@media only screen and (max-width: 575.98px) {
#lgx-schedule .lgx-inner-breadcrumb .breadcrumb-area{
  text-align: left !important;
  margin: 0 !important;
  padding-top: 80px;
}
}
/* Título: estilo BC */
#lgx-schedule .lgx-inner-breadcrumb .breadcrumb-heading{
  margin: 0 !important;
  padding: 0 !important;
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: .04em;
  line-height: 1.05;
  font-size: clamp(18px, 2.2vw, 28px);
  color: #fff;

  /* evita el “una palabra por línea” */
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
}

/* Oculta el home icon del breadcrumb */
#lgx-schedule .lgx-inner-breadcrumb .breadcrumb > li:first-child{
  display: none !important;
}

/* Breadcrumb minimal */
#lgx-schedule .lgx-inner-breadcrumb .breadcrumb{
  margin: 6px 0 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  font-family: "Lato", sans-serif;
  font-size: 12px;
  color: rgba(255,255,255,0.60);
}

#lgx-schedule .lgx-inner-breadcrumb .breadcrumb > li + li:before{
  content: "›";
  padding: 0 8px;
  color: rgba(255,255,255,0.35);
}

.lgx-schedule-dark {
    background: #1a1a1a;
}

@media only screen and (max-width: 767px) {
    .col-xs-12{
        width: 100%;
    }
}

#lgx-schedule .col-xs-12{
  background: #1a1a1a !important;
}
.mb-50 {
    margin-bottom: 10px;
}

#lgx-schedule .container{
  background: transparent !important;
}

/* Breadcrumb oculto pero presente en el DOM */
#lgx-schedule .breadcrumb{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


/* ========================================================
   BC EVENT PAGE (single event)
   Scope seguro usando .bc-page--event
   ======================================================== */

/* ==========================================================
   BC EVENT PAGE — REFINADO (scope: .bc-page--event)
   ========================================================== */

/* Base */
.bc-page--event ~ section{
  background: var(--bc-bg);
  color: var(--bc-text);
}
.bc-page--event ~ section + section{
  border-top: 1px solid rgba(255,255,255,.08);
}

/* Spacing global (menos “aire” Eventmie, más BC) */
.bc-page--event ~ section .lgx-inner{
  padding: 54px 0;
}
@media (max-width: 768px){
  .bc-page--event ~ section .lgx-inner{ padding: 34px 0; }
}

/* Headings consistentes */
.bc-page--event ~ section .lgx-heading{
  text-align: left;
  margin: 0 0 18px 0;
}
.bc-page--event ~ section .lgx-heading .heading{
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: .02em;
  color: var(--bc-text);
  font-size: clamp(18px, 2.2vw, 26px);
  line-height: 1.15;
  margin: 0;
}

/* ==========================================================
   HERO (poster)
   ========================================================== */

.bc-page--event ~ section .lgx-banner.event-poster{
  position: relative;
  min-height: 360px;
}

/* Tint más “BC” */
.bc-page--event ~ section .lgx-banner.event-poster.background-tint::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    180deg,
    rgba(0,0,0,.55) 0%,
    rgba(0,0,0,.18) 42%,
    rgba(0,0,0,.72) 100%
  );
  pointer-events:none;
}
.bc-page--event ~ section .lgx-banner.event-poster.background-tint > *{
  position: relative;
  z-index: 1;
}

/* Ranking overlay (limpio + consistente) */
.bc-page--event ~ section .rank-overlay{
  right: 14px;
  bottom: 14px;
  z-index: 10;
}
.bc-page--event ~ section .rank-overlay .cards{
  gap: 8px !important;
}
.bc-page--event ~ section .rank-overlay .card{
  background: rgba(32,32,32,.92) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: var(--bc-radius) !important;
  padding: 10px 12px !important;
  width: 132px !important;
  flex: 0 0 132px !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.35);
  backdrop-filter: blur(6px);
}
.bc-page--event ~ section .rank-overlay .card:hover{
  border-color: rgba(214,160,61,.32) !important;
  transform: translateY(-2px);
  transition: transform .18s ease, border-color .18s ease;
}
@media (max-width: 768px){
  .bc-page--event ~ section .rank-overlay{ right: 10px; bottom: 10px; }
  .bc-page--event ~ section .rank-overlay .card{
    width: 116px !important;
    flex: 0 0 116px !important;
    border-radius: 0px !important;
  }
}

/* ==========================================================
   ABOUT (titulo + badges + texto + where/when)
   ========================================================== */

.bc-page--event ~ section #lgx-about{
  background: var(--bc-bg);
}

/* Panel “BC” para el bloque principal de contenido */
.bc-page--event ~ section #lgx-about .lgx-about-content-area{

  padding: 22px 22px 18px 22px;
}

/* Título del evento */
.bc-page--event ~ section #lgx-about .lgx-heading .heading{
  margin-bottom: 10px;
}

/* Badges (géneros) */
.bc-page--event ~ section #lgx-about .lgx-badge{
  background: var(--bc-tag-1);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 999px;
  color: rgba(255,255,255,.86);
  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .10em;
  text-transform: uppercase;
  padding: 6px 10px;
}

/* Texto */
.bc-page--event ~ section #lgx-about .lgx-about-content p{
  color: var(--bc-muted);
  font-family: "Lato", sans-serif;
  font-weight: 300;
  line-height: 1.65;
  margin: 10px 0 0 0;
}

/* Info circle: hacerlo “card” */
.bc-page--event ~ section #lgx-about .info-circle-inner{
  border-radius: var(--bc-radius);
  border: 1px solid rgba(255,255,255,.10);
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(0,0,0,.30);
}

/* Where / When: cards BC */
.bc-page--event ~ section #lgx-about .lgx-single-service{
  background: rgba(32,32,32,.72) !important;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--bc-radius);
  box-shadow: 0 18px 50px rgba(0,0,0,.25);
}
.bc-page--event ~ section #lgx-about .lgx-single-service .title{
  font-family: "MonumentExtended", sans-serif !important;
  text-transform: uppercase;
  letter-spacing: .02em;
  font-size: 14px !important;
  color: var(--bc-text) !important;
}
.bc-page--event ~ section #lgx-about .lgx-single-service p{
  color: var(--bc-muted) !important;
  font-family: "Lato", sans-serif !important;
  font-weight: 300;
}

/* Quitar “br br” exagerados sin tocar la blade */
.bc-page--event ~ section #lgx-about br + br{ display:none; }

/* ==========================================================
   HEADLINERS (speakers)
   ========================================================== */

.bc-page--event ~ section #lgx-schedule-tag{
  background: #202020;
}

/* Grid más uniforme */
.bc-page--event ~ section #artists .col-xs-12{ margin-bottom: 18px; }

.bc-page--event ~ section .lgx-single-speaker{
  background: rgba(26,26,26,.75);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--bc-radius);
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(0,0,0,.22);
}
.bc-page--event ~ section .lgx-single-speaker > img{
  width: 100%;
  height: 280px;
  object-fit: cover;
  display: block;
}
@media (max-width: 768px){
  .bc-page--event ~ section .lgx-single-speaker > img{ height: 220px; }
}

.bc-page--event ~ section .lgx-single-speaker figcaption{
  background: rgba(26,26,26,.88);
  border-top: 1px solid rgba(255,255,255,.08);
}

/* Social buttons discretos */
.bc-page--event ~ section .lgx-single-speaker .social-group a{
  background: rgba(32,32,32,.75);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 12px;
}
.bc-page--event ~ section .lgx-single-speaker .social-group a:hover{
  border-color: rgba(214,160,61,.30);
}

/* Nombres */
.bc-page--event ~ section .lgx-single-speaker .speaker-info .title a{
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: .02em;
  color: var(--bc-text);
}
.bc-page--event ~ section .lgx-single-speaker .speaker-info .subtitle{
  color: rgba(255,255,255,.62);
  font-family: "Lato", sans-serif;
  font-weight: 300;
}

/* ==========================================================
   FULL LINEUP
   ========================================================== */

.bc-page--event ~ section #lgx-schedule{
  background: var(--bc-bg);
}
.bc-page--event ~ section #lgx-schedule img{
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--bc-radius);
  box-shadow: 0 22px 70px rgba(0,0,0,.35);
  max-width: 100%;
  height: auto;
}

/* ==========================================================
   TIMETABLE (gallery)
   ========================================================== */

.bc-page--event ~ section #lgx-photo-gallery{
  background: #202020;
}
.bc-page--event ~ section .lgx-gallery-single-slider{
  border-radius: var(--bc-radius) !important;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 18px 50px rgba(0,0,0,.30);
}

/* ==========================================================
   LINKS (tu bloque bc-links ya está ok; solo afinamos header)
   ========================================================== */

.bc-page--event ~ section.bc-links{
  background: var(--bc-bg);
}
.bc-page--event ~ section.bc-links .bc-links__note{
  color: rgba(255,255,255,.60);
}

/* ==========================================================
   Get Directions botón (más BC)
   ========================================================== */

.bc-page--event ~ section #get_directions.lgx-btn{
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 0px !important;
  box-shadow: none !important;
  font-family: "Lato", sans-serif !important;
  text-transform: uppercase;
  letter-spacing: .10em;
  font-size: 12px;
  padding: 12px 18px;
  color: rgba(255,255,255,.92) !important;
}
.bc-page--event ~ section #get_directions.lgx-btn:hover{
  background: rgba(255,255,255,.06) !important;
  border-color: rgba(214,160,61,.42) !important;
}



/* Panel BC */
.bc-page--event ~ section #lgx-about .lgx-about-content-area{
  background: #1a1a1a;
  padding: 22px 0px 22px 0px;
}

/* Title (H1/H2) */
.bc-page--event ~ section #lgx-about .lgx-heading .heading{
  font-family:"MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: .02em;
  margin: 0 0 10px 0;
  font-size: clamp(20px, 2.6vw, 34px);
  line-height: 1.10;
  color: var(--bc-text);
}

/* Subheading: que no “baje raro” con links/badges */
.bc-page--event ~ section #lgx-about .lgx-heading .subheading{
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

/* Badges consistentes BC */
.bc-page--event ~ section #lgx-about .lgx-badge{
  background: var(--bc-tag-1);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 999px;
  color: rgba(255,255,255,.86);
  font-family:"Lato", sans-serif;
  font-weight:700;
  font-size:11px;
  letter-spacing:.10em;
  text-transform:uppercase;
  padding: 6px 10px;
}

/* Texto */
.bc-page--event ~ section #lgx-about .lgx-about-content p{
  color: var(--bc-muted);
  font-family:"Lato", sans-serif;
  font-weight:300;
  line-height:1.65;
  margin-top: 12px;
}


/* ==========================================================
   FIX overlay: figcaption debe cubrir 100% del banner
   ========================================================== */

/* El banner debe ser el contenedor */
.bc-page--event ~ section .lgx-banner.event-poster{
  position: relative;
  overflow: hidden;
  min-height: 360px; /* o el valor que te guste */
  background-size: cover;
  background-position: center;
}

/* Figcaption como overlay absoluto */
.bc-page--event ~ section .lgx-banner.event-poster > figcaption{
  position: absolute;
  inset: 0;             /* top/right/bottom/left = 0 */
  width: 100%;
  height: 100%;
  margin: 0;
  z-index: 1;
  display: block;
}

/* Aplica aquí el gradiente (y anula el del theme viejo si hace falta) */
.bc-page--event ~ section .lgx-banner.event-poster > figcaption{
  background: linear-gradient(90deg, rgb(39 40 41) 0%, rgb(39 40 41) 35%, rgba(83, 100, 141, 0) 100%);
  border: 0 !important;
}

/* El contenido dentro del figcaption debe ir encima del overlay */
.bc-page--event ~ section .lgx-banner.event-poster > figcaption .lgx-banner-style,
.bc-page--event ~ section .lgx-banner.event-poster > figcaption .lgx-inner{
  position: relative;
  z-index: 2;
}

/* Ranking overlay por encima de todo */
.bc-page--event ~ section .lgx-banner.event-poster > .rank-overlay{
  position: absolute;  /* importante: que no empuje layout */
  right: 14px;
  bottom: 14px;
  z-index: 3;
}

/* ==========================================================
   FIX DESKTOP: Eventmie pisa figcaption en >=768px
   ========================================================== */
@media (min-width: 769px){

  /* Asegurar alto del banner (padre) */
  .bc-page--event ~ section .lgx-banner.event-poster{
    position: relative !important;
    overflow: hidden !important;
    min-height: 360px;               /* ajusta si quieres más/menos */
  }

  /* Forzar overlay absoluto en desktop también */
  .bc-page--event ~ section .lgx-banner.event-poster > figcaption{
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    display: block !important;
    z-index: 1 !important;
  }

  /* A veces Eventmie limita el alto aquí: lo forzamos */
  .bc-page--event ~ section .lgx-banner.event-poster > figcaption .lgx-banner-style,
  .bc-page--event ~ section .lgx-banner.event-poster > figcaption .lgx-inner,
  .bc-page--event ~ section .lgx-banner.event-poster > figcaption .lgx-inner-fixed{
    height: 100% !important;
  }

  /* Ranking overlay siempre arriba */
  .bc-page--event ~ section .lgx-banner.event-poster > .rank-overlay{
    position: absolute !important;
    z-index: 3 !important;
  }
}

/* SOLO event page */
.bc-page--event ~ section .mt-30{
  margin-top: 0 !important;
}

/* =========================
   Categories: izquierda + cuadradas (como listados)
   ========================= */
.bc-page--event ~ section #lgx-about .lgx-heading{
  text-align: left;
}

.bc-page--event ~ section #lgx-about .lgx-heading .subheading{
  margin: 15px 0 0 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 6px;
}

/* Badge estilo BC listado */
.bc-page--event ~ section #lgx-about .lgx-badge{
  background: #202020;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 0;
  padding: 6px 10px;
  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: rgba(255,255,255,.88);
}

/* =========================
   Facts line: fecha + address minimal
   ========================= */
.bc-page--event ~ section #lgx-about .bc-event-facts{
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  align-items: center;
}

.bc-page--event ~ section #lgx-about .bc-fact{
  display: inline-flex;
  align-items: center;
  gap: 8px;

  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 0;
  padding: 8px 10px;

  font-family: "Lato", sans-serif;
  font-weight: 300;
  color: rgba(255,255,255,.78);
}

.bc-page--event ~ section #lgx-about .bc-fact i{
  font-size: 13px;
  opacity: .85;
}

.bc-page--event ~ section #lgx-about .bc-fact span{
  font-size: 13px;
  line-height: 1.25;
}

.bc-page--event ~ section #lgx-about .bc-fact strong{
  font-weight: 700;
  color: rgba(255,255,255,.92);
}

@media (max-width: 768px){
  .bc-page--event ~ section #lgx-about .bc-fact{
    width: 100%;
    justify-content: flex-start;
  }
}
/* Fuerza alineación izquierda en TODO el heading del event */
.bc-page--event ~ section #lgx-about .lgx-heading{
  text-align: left !important;
  align-items: flex-start;
}

/* Y el subheading explícitamente */
.bc-page--event ~ section #lgx-about .lgx-heading .subheading{
  text-align: left !important;
  justify-content: flex-start !important;
  width: 100%;
}

.bc-page--event ~ section #lgx-about .bc-event-facts{
  margin-top: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
}

/* sin fondo, solo texto */
.bc-page--event ~ section #lgx-about .bc-fact{
  background: none;
  border: none;
  padding: 0;

  display: inline-flex;
  align-items: center;
  gap: 6px;

  font-family: "Lato", sans-serif;
  font-size: 13px;
  color: rgba(255,255,255,.72);
}

.bc-page--event ~ section #lgx-about .bc-fact i{
  font-size: 12px;
  opacity: .6;
}


.bc-page--event ~ section #lgx-about .lgx-badge{
  margin: 0;
  border-radius: 0;
  padding: 6px 10px;

  background: #202020;
  border: 1px solid rgba(255,255,255,.10);

  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .10em;
  text-transform: uppercase;
}

.bc-page--event ~ section #lgx-about .col-md-12{
  padding-left: 15px;
  padding-right: 15px;
}

.bc-page--event ~ section .col-xs-12{
    padding-left: 15px !important;
  }

@media (max-width: 768px){
  .bc-page--event ~ section .col-xs-12{
    padding-left: 15px !important;
  }
}

.bc-page--event ~ section #artists{
  padding-left: 15px;
}


.bc-page--event ~ section #lgx-about .col-xs-12 {
    padding-left: 15px;
}

.bc-page--event ~ section #lgx-about .lgx-about-content-area{
  padding-left: 0;
  padding-right: 0;
}

.bc-page--event ~ section #artists .bc-artist-col{
  padding-left: 0 !important;
}


/* Social icons minimal (solo en event page headliners) */
.bc-page--event ~ section #artists .social-group{
  display: flex;
  gap: 8px;
}

.bc-page--event ~ section #artists .social-group a{
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  background: rgba(32,32,32,.70);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 0; /* cuadrado BC */
  color: rgba(255,255,255,.85);

  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}

.bc-page--event ~ section #artists .social-group a:hover{
  transform: translateY(-1px);
  border-color: rgba(214,160,61,.35);
  background: rgba(32,32,32,.88);
}

.bc-page--event ~ section #artists .social-group i{
  font-size: 14px;
  line-height: 1;
}
/* Headliners use Home card look */
.bc-page--event ~ section #artists .bc-artist-card{
  background: rgba(26,26,26,.70);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--bc-radius);
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(0,0,0,.22);
}

/* imagen + hover zoom como home */
.bc-page--event ~ section #artists .bc-artist-card figure{
  margin: 0;
  overflow: hidden;
}
.bc-page--event ~ section #artists .bc-artist-card img{
  width: 100%;
  height: 260px;
  object-fit: cover;
  transform: scale(1);
  transition: transform .35s ease;
  display: block;
}
.bc-page--event ~ section #artists .bc-artist-card:hover img{
  transform: scale(1.06);
}

/* info debajo */
.bc-page--event ~ section #artists .bc-artist-card .single-news-info{
  padding: 14px 14px 12px 14px;
  background: rgba(32,32,32,.75);
  border-top: 1px solid rgba(255,255,255,.08);
}

/* título */
.bc-page--event ~ section #artists .bc-artist-card .title{
  margin: 0;
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: .02em;
  font-size: 14px;
  line-height: 1.2;
}
.bc-page--event ~ section #artists .bc-artist-card .title a{
  color: rgba(255,255,255,.92);
}

/* social minimal */
.bc-page--event ~ section #artists .bc-artist-card__social{
  margin-top: 10px;
  display: flex;
  gap: 8px;
}
.bc-page--event ~ section #artists .bc-artist-card__social a{
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 0;
  color: rgba(255,255,255,.82);
}
.bc-page--event ~ section #artists .bc-artist-card__social a:hover{
  border-color: rgba(214,160,61,.35);
}
.bc-page--event ~ section #artists .bc-artist-card__social i{
  font-size: 14px;
}

/* responsive */
@media (max-width: 768px){
  .bc-page--event ~ section #artists .bc-artist-card img{ height: 220px; }
}

/* Headliners grid estable SOLO para esta sección */
.bc-page--event ~ section #artists{
  display: flex;
  flex-wrap: wrap;
}

/* <=480px: mantenemos 2 por fila (como te gusta) */
@media (max-width: 480px){
  .bc-page--event ~ section #artists .bc-artist-col{
    width: 50% !important;
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
}

/* 481–767px: 3 por fila (tu preferencia) */
@media (min-width: 481px) and (max-width: 767px){
  .bc-page--event ~ section #artists .bc-artist-col{
    width: 50% !important;
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
}

/* 768–991px: 2 por fila (tablet) */
@media (min-width: 768px) and (max-width: 991px){
  .bc-page--event ~ section #artists .bc-artist-col{
    width: 33.3333% !important;
    flex: 0 0 33.3333% !important;
    max-width: 33.3333% !important;
  }
}

/* >=992px: 4 por fila (desktop) */
@media (min-width: 992px){
  .bc-page--event ~ section #artists .bc-artist-col{
    width: 25% !important;
    flex: 0 0 25% !important;
    max-width: 25% !important;
  }
}

/* =========================
   Timetable: rail horizontal (thumbnails) + snap
   ========================= */

.bc-page--event ~ section #lgx-photo-gallery .lgx-inner .container > .row:last-of-type{
  /* este es el row que contiene la galería */
}

/* Target al row interno que contiene los col-md-3 */
.bc-page--event ~ section #lgx-photo-gallery .row .row{
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  gap: 12px;

  padding: 6px 4px 14px 4px;
  -webkit-overflow-scrolling: touch;

  scroll-snap-type: x mandatory;
}

/* Cada item deja de ser “col-md-3” y pasa a slide */
.bc-page--event ~ section #lgx-photo-gallery .row .row > [class*="col-"]{
  float: none !important;            /* bootstrap 3 */
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;

  scroll-snap-align: start;
}

/* Tamaño de cada thumbnail */
.bc-page--event ~ section #lgx-photo-gallery .lgx-gallery-single-slider{
  width: 240px !important;
  height: 300px !important;
  border-radius: var(--bc-radius);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 18px 50px rgba(0,0,0,.22);

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  transition: transform .2s ease, border-color .2s ease;
}
.bc-page--event ~ section #lgx-photo-gallery .lgx-gallery-single-slider:hover{
  transform: translateY(-2px);
  border-color: rgba(214,160,61,.35);
}

/* Barra de scroll discreta (optional) */
.bc-page--event ~ section #lgx-photo-gallery .row .row::-webkit-scrollbar{
  height: 8px;
}
.bc-page--event ~ section #lgx-photo-gallery .row .row::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.14);
  border-radius: 999px;
}

.lgx-photo-gallery-black, .lgx-photo-gallery-black .lgx-inner
 {
    background: #202020;
}

.bc-page--event ~ section #lgx-photo-gallery .row .col-md-3{
  padding: 0 !important;
}

/* ==========================================================
   BC LINKS (event page) - override del look legacy
   ========================================================== */

.bc-page--event ~ section .bc-links{
  padding: 0;
}

/* Title + note */
.bc-page--event ~ section .bc-links .bc-links__header{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.bc-page--event ~ section .bc-links .bc-links__note{
  font-family: "Lato", sans-serif;
  font-size: 12px;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: rgba(255,255,255,.55);
  padding-bottom: 6px;
}

/* List layout */
.bc-page--event ~ section .bc-links .bc-links__list{
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

/* Card */
.bc-page--event ~ section .bc-links .bc-link-card{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;

  background: rgba(32,32,32,.72);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 0px; /* si tu radius es suave; si quieres 0, cámbialo a 0 */
  box-shadow: 0 18px 50px rgba(0,0,0,.22);

  padding: 14px 14px;
}

/* Left content */
.bc-page--event ~ section .bc-links .bc-link-card__label{
  margin: 6px 0 4px 0;
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: .02em;
  font-size: 14px;
  line-height: 1.2;
  color: rgba(255,255,255,.92);
}

.bc-page--event ~ section .bc-links .bc-link-card__label i{
  margin-right: 8px;
  opacity: .8;
  font-size: 13px;
}

.bc-page--event ~ section .bc-links .bc-link-card__host{
  font-family: "Lato", sans-serif;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.55);
}

/* Pills */
.bc-page--event ~ section .bc-links .bc-pill{
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;

  border-radius: 0; /* cuadrado BC */
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);

  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: rgba(255,255,255,.80);
}

.bc-page--event ~ section .bc-links .bc-link-card__kicker{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

/* “Official” un poco destacado, pero sin colores chillones */
.bc-page--event ~ section .bc-links .bc-pill--official{
  border-color: rgba(214,160,61,.35);
  color: rgba(214,160,61,.92);
}

/* Button */
.bc-page--event ~ section .bc-links .bc-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;

  padding: 10px 14px;
  border-radius: 0; /* cuadrado BC */
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);

  font-family: "Lato", sans-serif;
  font-weight: 700;
  letter-spacing: .10em;
  text-transform: uppercase;
  font-size: 11px;

  color: rgba(255,255,255,.88);
  text-decoration: none;

  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}

.bc-page--event ~ section .bc-links .bc-btn:hover{
  transform: translateY(-1px);
  border-color: rgba(214,160,61,.35);
  background: rgba(255,255,255,.06);
}

/* Responsive: apilar botón debajo si falta espacio */
@media (max-width: 768px){
  .bc-page--event ~ section .bc-links .bc-link-card{
    flex-direction: column;
    align-items: stretch;
  }

  .bc-page--event ~ section .bc-links .bc-link-card__right{
    display: flex;
    justify-content: flex-start;
  }
}


/* BC Links override - HIGH priority */
.bc-page--event ~ section.bc-links .bc-links__list .bc-link-card,
.bc-page--event ~ section .bc-links .bc-links__list .bc-link-card{
  background: rgba(32,32,32,.72) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 0 !important; /* o var(--bc-radius) */
  box-shadow: 0 18px 50px rgba(0,0,0,.22) !important;
  padding: 14px 14px !important;
  display: flex !important;
  justify-content: space-between !important;
  gap: 14px !important;
}

/* ==========================================================
   BC LINKS: pills + button override (high specificity)
   ========================================================== */

/* Pills wrapper */
.bc-page--event ~ section.bc-links .bc-link-card__kicker .bc-pill,
.bc-page--event ~ section .bc-links .bc-link-card__kicker .bc-pill{
  display: inline-flex !important;
  align-items: center !important;

  /* tamaño más pequeño */
  padding: 4px 8px !important;
  min-height: 22px !important;

  /* estilo BC */
  border-radius: 0 !important;
  background: #202020 !important;
  border: 1px solid rgba(255,255,255,.10) !important;

  font-family: "Lato", sans-serif !important;
  font-weight: 700 !important;
  font-size: 10px !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;

  color: rgba(255,255,255,.78) !important;
}

/* pill “Official” (accent BC) */
.bc-page--event ~ section.bc-links .bc-link-card__kicker .bc-pill--official,
.bc-page--event ~ section .bc-links .bc-link-card__kicker .bc-pill--official{
  border-color: rgba(214,160,61,.35) !important;
  color: rgba(214,160,61,.92) !important;
}

/* type pill un poco más “neutro” */
.bc-page--event ~ section.bc-links .bc-link-card__kicker .bc-pill--type,
.bc-page--event ~ section .bc-links .bc-link-card__kicker .bc-pill--type{
  color: rgba(255,255,255,.72) !important;
}

/* Button */
.bc-page--event ~ section.bc-links .bc-link-card__right .bc-btn,
.bc-page--event ~ section .bc-links .bc-link-card__right .bc-btn{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;

  padding: 10px 14px !important;
  border-radius: 0 !important;

  background: #202020 !important;
  border: 1px solid rgba(255,255,255,.14) !important;

  font-family: "Lato", sans-serif !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;

  color: rgba(255,255,255,.88) !important;
  text-decoration: none !important;

  transition: transform .15s ease, border-color .15s ease, background .15s ease !important;
}

.bc-page--event ~ section.bc-links .bc-link-card__right .bc-btn:hover,
.bc-page--event ~ section .bc-links .bc-link-card__right .bc-btn:hover{
  transform: translateY(-1px) !important;
  border-color: rgba(214,160,61,.35) !important;
  background: rgba(255,255,255,.06) !important;
}

@media (max-width: 768px){
  /* Opción 1: mantener flex pero en columna */
  .bc-page--event ~ section.bc-links .bc-links__header,
  .bc-page--event ~ section .bc-links__header{
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 6px !important;
  }

  .bc-page--event ~ section.bc-links .bc-links__note,
  .bc-page--event ~ section .bc-links__note{
    width: 100% !important;
    padding-bottom: 0 !important;
    margin-top: 2px !important;
    padding-left: 15px;
  }
}

/* ==========================================================
   Location section (Venue + Directions + Map)
   ========================================================== */

.bc-page--event ~ section.bc-location .bc-location__venue{
  margin-bottom: 14px;
}

/* Address line */
.bc-page--event ~ section.bc-location .bc-location__address{
  display: inline-flex;
  align-items: center;
  gap: 0px;

  margin: 6px 0 12px 0;

  font-family: "Lato", sans-serif;
  font-size: 13px;
  color: rgba(255,255,255,.75);
}

.bc-page--event ~ section.bc-location .bc-location__address i{
  font-size: 13px;
  opacity: .7;
}

/* Button: reutiliza tu estilo BC */
.bc-page--event ~ section.bc-location .bc-location__cta{
  margin-bottom: 14px;
}

/* Map frame */
.bc-page--event ~ section.bc-location .bc-location__map{
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 0;
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(0,0,0,.22);
}

/* Map height */
.bc-page--event ~ section.bc-location #map{
  height: 420px;
}

@media (max-width: 768px){
  .bc-page--event ~ section.bc-location #map{
    height: 320px;
  }
}
/* Venue card = mismo look que artistas */
.bc-page--event ~ section.bc-location .bc-venue-card{
  background: rgba(26,26,26,.70);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--bc-radius);
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(0,0,0,.22);
}

.bc-page--event ~ section.bc-location .bc-venue-card figure{
  margin: 0;
  overflow: hidden;
}

.bc-page--event ~ section.bc-location .bc-venue-card img{
  width: 100%;
  height: 240px;
  object-fit: cover;
  transform: scale(1);
  transition: transform .35s ease;
  display: block;
}

.bc-page--event ~ section.bc-location .bc-venue-card:hover img{
  transform: scale(1.06);
}

.bc-page--event ~ section.bc-location .bc-venue-card .single-news-info{
  padding: 14px 14px 12px 14px;
  background: rgba(32,32,32,.75);
  border-top: 1px solid rgba(255,255,255,.08);
}

.bc-page--event ~ section.bc-location .bc-venue-card .title{
  margin: 0;
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: .02em;
  font-size: 14px;
  line-height: 1.2;
}

.bc-page--event ~ section.bc-location .bc-venue-card .title a{
  color: rgba(255,255,255,.92);
}

/* Get Directions button = mismo feel que Find Events */
.bc-page--event ~ section.bc-location #get_directions.bc-nav-btn{
  border-radius: 0; /* o var(--bc-radius) si estás usando radius */
  padding: 10px 14px;

  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.88);

  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;

  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}

/* Hover moderno (mantiene “feel” del default, pero en paleta BC) */
.bc-page--event ~ section.bc-location #get_directions.bc-nav-btn:hover{
  transform: translateY(-1px);
  border-color: rgba(214,160,61,.35);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.92);
}

.bc-page--event ~ section.bc-location .bc-location__venue{
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
}

/* =========================
   Venue rail (horizontal)
   ========================= */
.bc-page--event ~ section.bc-location .bc-venue-rail{
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  gap: 12px;
  margin-left: 15px !important;
  margin-right: 15px !important;
  padding: 6px 4px 14px 0px;
  -webkit-overflow-scrolling: touch;

  scroll-snap-type: x mandatory;
}

.bc-page--event ~ section.bc-location .bc-venue-slide{
  flex: 0 0 auto;
  scroll-snap-align: start;
}

/* tamaño de cada card en desktop */
.bc-page--event ~ section.bc-location .bc-venue-card{
  width: 260px; /* <- aquí está el “límite”, ya no será full width */
  background: rgba(26,26,26,.70);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--bc-radius);
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(0,0,0,.22);
}

/* imagen */
.bc-page--event ~ section.bc-location .bc-venue-card figure{
  margin: 0;
  overflow: hidden;
}
.bc-page--event ~ section.bc-location .bc-venue-card img{
  width: 100%;
  height: 200px;
  object-fit: cover;
  transform: scale(1);
  transition: transform .35s ease;
  display: block;
}
.bc-page--event ~ section.bc-location .bc-venue-card:hover img{
  transform: scale(1.06);
}

/* título */
.bc-page--event ~ section.bc-location .bc-venue-card .single-news-info{
  padding: 14px 14px 12px 14px;
  background: rgba(32,32,32,.75);
  border-top: 1px solid rgba(255,255,255,.08);
}
.bc-page--event ~ section.bc-location .bc-venue-card .title{
  margin: 0;
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: .02em;
  font-size: 14px;
  line-height: 1.2;
}
.bc-page--event ~ section.bc-location .bc-venue-card .title a{
  color: rgba(255,255,255,.92);
}

/* scrollbar discreta */
.bc-page--event ~ section.bc-location .bc-venue-rail::-webkit-scrollbar{
  height: 8px;
}
.bc-page--event ~ section.bc-location .bc-venue-rail::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.14);
  border-radius: 999px;
}

/* responsive */
@media (max-width: 768px){
  .bc-page--event ~ section.bc-location .bc-venue-card{ width: 220px; }
  .bc-page--event ~ section.bc-location .bc-venue-card img{ height: 180px; }
}

/* Links "Open" button: same engine as Find Events */
.bc-page--event ~ section .bc-links .bc-link-card__right .bc-btn{
  /* forzamos look BC aunque venga de eventmie-custom */
  border-radius: 0 !important;
  padding: 10px 14px !important;

  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: rgba(255,255,255,.88) !important;

  font-family: "Lato", sans-serif !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;

  transition: transform .15s ease, border-color .15s ease, background .15s ease !important;
}

/* hover BC */
.bc-page--event ~ section .bc-links .bc-link-card__right .bc-btn:hover{
  transform: translateY(-1px) !important;
  border-color: rgba(214,160,61,.35) !important;
  background: rgba(255,255,255,.06) !important;
  color: rgba(255,255,255,.92) !important;
}


.g-map-wrapper {
    min-height: 400px;
}

.bc-top-meta{
  font-size: 13px;
  opacity: .6;
  margin: 6px 0 18px;
  padding-left: 16px;
}

.lgx-event {
    box-shadow: 0 0px 0 0px #202020 !important;
}

/* SOLO TOP LISTS */
.bc-toplist-page .bc-top-infinite > .row > [class*="col-"]{
  padding-left: 16px;
  padding-right: 16px; /* o 10 si lo quieres igual que antes */
}

/* sentinel invisible pero presente */
.bc-toplist-page .bc-io-sentinel{
  display:block;
  width:100%;
  height:1px;
}

/* opcional: estilos */
.bc-toplist-page .bc-loading,
.bc-toplist-page .bc-loadmore{
  text-align:center;
  margin:10px 0;
}

/* ==================================================
   TOP LISTS: rank badge overlay (sin tocar el diseño)
   ================================================== */

.bc-toplist-page .lgx-event__image{
  position: relative;  /* contexto para absolute */
}

.bc-toplist-page .rank-badge{
  position: absolute;  /* <-- clave */
  top: 0px;
  left: 0px;

  margin: 0;           /* quita los márgenes que lo desplazan */
  z-index: 50;         /* por encima del img */
}

/* ==================================================
   TOP LISTS: evitar solape rank + lineup badge
   ================================================== */

/* Ambos sobre la imagen y no “fuera” */
.bc-toplist-page .lgx-event__image{
  position: relative;
  overflow: hidden;
}

/* Rank: arriba-izquierda (como ya lo tienes) */
.bc-toplist-page .rank-badge{
  top: 0px;
  left: 0px;
}

/* Lineup badge: por defecto arriba-derecha, pero con ancho controlado */
.bc-toplist-page .lgx-lineup-badge{
  top: 4px;
  right: 4px;
  max-width: calc(100% - 50px); /* deja espacio para el rank */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Cuando se estrecha (móvil): lo mandamos abajo-derecha */
@media (max-width: 991px){
  .bc-toplist-page .lgx-lineup-badge{
    top: auto;
    right: 4px;
    bottom: 4px;
    left: auto;
    max-width: calc(100% - 8px);
  }
}

/* ==================================================
   TOP LISTS: lineup badges (BC minimal)
   ================================================== */

.bc-toplist-page .lgx-lineup-badge{
  padding: 4px 8px;
  border-radius: 0;
  box-shadow: none;

  background: rgba(32,32,32,.85);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.92);

  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-size: 10px;
  letter-spacing: .10em;
  text-transform: uppercase;
}

/* Estados (flat, sin gradients) */
.bc-toplist-page .lgx-lineup-badge--full{
  border-color: rgba(214,160,61,.55);
  color: rgba(214,160,61,.95);
}

.bc-toplist-page .lgx-lineup-badge--progress{
  border-color: rgba(255,255,255,.18);
  color: rgba(255,255,255,.86);
}

.bc-toplist-page .lgx-lineup-badge--tba{
  border-color: rgba(148,163,184,.55);
  color: rgba(226,232,240,.90);
}

.bc-toplist-page .lgx-lineup-badge--cancelled{
  border-color: rgba(239,68,68,.60);
  color: rgba(254,202,202,.95);
}

/* ==================================================
   GLOBAL: lineup badges (BC minimal) — para /events, artist, city, club, etc.
   (mismo look que Top Lists)
   ================================================== */

/* Asegura que el badge se posicione respecto a la imagen */
.bc-skin .lgx-event__image{
  position: relative;
  overflow: hidden;
}

/* Lineup badge: por defecto arriba-derecha, con ancho controlado */
.bc-skin .lgx-lineup-badge{
  top: 4px;
  right: 4px;
  max-width: calc(100% - 50px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

  padding: 4px 8px;
  border-radius: 0;
  box-shadow: none;

  background: rgba(32,32,32,.85);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.92);

  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-size: 10px;
  letter-spacing: .10em;
  text-transform: uppercase;
}

/* Cuando se estrecha (móvil): abajo-derecha */
@media (max-width: 991px){
  .bc-skin .lgx-lineup-badge{
    top: auto;
    right: 4px;
    bottom: 4px;
    left: auto;
    max-width: calc(100% - 8px);
  }
}

/* Estados (flat, sin gradients) */
.bc-skin .lgx-lineup-badge--full{
  border-color: rgba(214,160,61,.55);
  color: rgba(214,160,61,.95);
}

.bc-skin .lgx-lineup-badge--progress{
  border-color: rgba(255,255,255,.18);
  color: rgba(255,255,255,.86);
}

.bc-skin .lgx-lineup-badge--tba{
  border-color: rgba(148,163,184,.55);
  color: rgba(226,232,240,.90);
}

.bc-skin .lgx-lineup-badge--cancelled{
  border-color: rgba(239,68,68,.60);
  color: rgba(254,202,202,.95);
}


/* Desktop only */
@media (min-width: 992px){
  .bc-skin .container{
    padding-left: 0px;
  }
}

/* ==========================================================
   BC ARTIST PAGE — REFINADO (scope: .bc-page--artist)
   (clon de BC EVENT PAGE)
   ========================================================== */

/* Base */
.bc-page--artist ~ section{
  background: var(--bc-bg);
  color: var(--bc-text);
}
.bc-page--artist ~ section + section{
  border-top: 1px solid rgba(255,255,255,.08);
}

/* Spacing global (menos “aire” Eventmie, más BC) */
.bc-page--artist ~ section .lgx-inner{
  padding: 54px 0;
}
@media (max-width: 768px){
  .bc-page--artist ~ section .lgx-inner{ padding: 34px 0; }
}

/* Headings consistentes */
.bc-page--artist ~ section .lgx-heading{
  text-align: left;
  margin: 0 0 18px 0;
}
.bc-page--artist ~ section .lgx-heading .heading{
  font-family: "MonumentExtended", sans-serif;
  text-transform: uppercase;
  letter-spacing: .02em;
  color: var(--bc-text);
  font-size: clamp(18px, 2.2vw, 26px);
  line-height: 1.15;
  margin: 0;
}

/* ==========================================================
   HERO (banner) — igual que evento
   ========================================================== */

.bc-page--artist ~ section .lgx-banner.event-poster{
  position: relative;
  min-height: 360px;
}

/* Tint más “BC” */
.bc-page--artist ~ section .lgx-banner.event-poster.background-tint::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    180deg,
    rgba(0,0,0,.55) 0%,
    rgba(0,0,0,.18) 42%,
    rgba(0,0,0,.72) 100%
  );
  pointer-events:none;
}
.bc-page--artist ~ section .lgx-banner.event-poster.background-tint > *{
  position: relative;
  z-index: 1;
}


/* ==========================================================
   BC ARTIST — LANDING MODE (scope: .bc-page--artist)
   No requiere cambiar tu Blade (solo CSS)
   ========================================================== */

/* 0) Reset wrappers (mata padding fijo tipo 5rem 10rem si existe) */
.bc-page--artist ~ section .lgx-post-wrapper,
.bc-page--artist ~ section .lgx-page-wrapper{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 1) Hero banner (mismo vibe event) */
.bc-page--artist ~ section .lgx-banner.event-poster{
  position: relative;
  min-height: 360px;
}
.bc-page--artist ~ section .lgx-banner.event-poster.background-tint::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    180deg,
    rgba(0,0,0,.55) 0%,
    rgba(0,0,0,.18) 42%,
    rgba(0,0,0,.72) 100%
  );
  pointer-events:none;
}
.bc-page--artist ~ section .lgx-banner.event-poster.background-tint > *{
  position: relative;
  z-index: 1;
}

/* 2) Contenedor BC alineado a Home/Events */
.bc-page--artist ~ section .container-fluid{
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.bc-page--artist ~ section .bc-artist-layout{
  width: min(1160px, 100%);
  margin: 0 auto;
  padding: 26px 18px 34px;
}
@media (min-width: 992px){
  .bc-page--artist ~ section .bc-artist-layout{
    padding-left: 8px;
    padding-right: 8px;
  }
}

/* 3) LANDING: convertir las 2 columnas en stack vertical */
.bc-page--artist ~ section .bc-artist-layout{
  display: flex;
  flex-direction: column;
  gap: 18px;
}

/* neutraliza bootstrap columns solo dentro del layout artist */
.bc-page--artist ~ section .bc-artist-layout > [class*="col-"]{
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 4) Sección 1: Header block (name + socials) estilo BC */
.bc-page--artist ~ section .bc-artist-layout > [class*="col-"] article:first-child header{
  border: 0px solid var(--bc-line);
  background: rgba(26,26,26,.55);
  padding: 0px 0px;
}

/* El default de Eventmie centra y limita; aquí no */
.bc-page--artist ~ section .lgx-post-wrapper article header,
.bc-page--artist ~ section .lgx-post-wrapper article section{
  max-width: none !important;
  text-align: left !important;
}

/* H1 BC */
.bc-page--artist ~ section .speaker-info .title{
  margin: 0;
  font-family: "MonumentExtended","Bebas Neue","Oswald",system-ui,sans-serif;
  text-transform: uppercase;
  letter-spacing: .02em;
  line-height: 1.05;
  font-size: clamp(22px, 3.2vw, 38px);
  color: var(--bc-text);
}

/* Subtitle */
.bc-page--artist ~ section .speaker-info .subtitle{
  margin: 10px 0 0 0;
  font-family: "Lato", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 300;
  font-size: 14px;
  color: var(--bc-muted);
}

/* Social (cuadrado BC, no iconos “default pills”) */
.bc-page--artist ~ section .lgx-social{
  margin: 14px 0 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.bc-page--artist ~ section .lgx-social li{ margin:0 !important; padding:0 !important; }
.bc-page--artist ~ section .lgx-social a{
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--bc-line);
  border-radius: 0;
  background: rgba(32,32,32,.55);
  color: var(--bc-text);
  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}
.bc-page--artist ~ section .lgx-social a:hover{
  transform: translateY(-1px);
  border-color: rgba(255,255,255,.28);
  background: rgba(32,32,32,.75);
}
.bc-page--artist ~ section .lgx-social i{ font-size: 14px; }

/* 5) Sección 2: Facts card (genre/nationality/aliases) estilo BC */
.bc-page--artist ~ section .card{
  border-radius: 0;
  background: var(--bc-panel);
  border: 1px solid var(--bc-line);
  box-shadow: none;
}
.bc-page--artist ~ section .card .list-group-item{
  background: transparent;
  border-color: rgba(255,255,255,.10);
}
.bc-page--artist ~ section .card .list-group-item .title{
  margin: 0;
  font-family: "Lato", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: .16em;
  font-size: 11px;
  color: var(--bc-muted);
}
.bc-page--artist ~ section .card .list-group-item .subtitle{
  margin: 6px 0 0 0;
  font-weight: 300;
  font-size: 14px;
  color: var(--bc-text);
}

/* 6) Sección 3: Bio como “panel” */
.bc-page--artist ~ section .bc-artist-layout article section{
  margin-top: 14px;
  padding: 16px;
  border: 1px solid var(--bc-line);
  background: rgba(26,26,26,.55);
  border-radius: 0;
  color: rgba(255,255,255,.72);
  line-height: 1.65;
}
.bc-page--artist ~ section .bc-artist-layout article section p:last-child{
  margin-bottom: 0;
}

/* 7) Sección 4: Upcoming events (vue component) como bloque landing */
.bc-page--artist ~ section .bc-artist-layout > [class*="col-"]:last-child{
  border-top: 1px solid rgba(255,255,255,.08);
  padding-top: 18px;
}

/* Safety: evita overflow raro del componente vue */
.bc-page--artist ~ section .bc-artist-layout > [class*="col-"]:last-child{
  min-width: 0;
}
.bc-page--artist ~ section .bc-artist-layout > [class*="col-"]:last-child *{
  max-width: 100%;
  padding-right: 0px;
}

/* 8) Espaciado general entre secciones */
.bc-page--artist ~ section .bc-artist-layout > [class*="col-"]{
  margin: 0 !important;
}

/* =========================================
   FIX: figcaption full-cover (ARTIST)
   (clon de bc-page--event)
   ========================================= */

.bc-page--artist ~ section .lgx-banner.event-poster > figcaption{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  z-index: 1;
  display: block;
}

/* Asegura que el banner sea el contenedor posicionado */
.bc-page--artist ~ section .lgx-banner.event-poster{
  position: relative;
}

/* Desktop fix (igual que en events) */
@media (min-width: 769px){
  .bc-page--artist ~ section .lgx-banner.event-poster > figcaption{
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    display: block !important;
    z-index: 1 !important;
  }
}

/* =========================================
   FIX: remove blog max-width (ARTIST ONLY)
   ========================================= */

.bc-page--artist ~ section .lgx-post-wrapper article footer,
.bc-page--artist ~ section .lgx-post-wrapper article header .text-area,
.bc-page--artist ~ section .lgx-post-wrapper article section{
  max-width: none !important;
  margin: 0 !important;
}

@media (max-width: 480px){
  .bc-page--artist ~ section .col-lg-4{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* =========================================
   ARTIST: card NO flotante en móvil
   ========================================= */
@media (max-width: 480px){
  .bc-page--artist ~ section .card{
    width: 100% !important;
    float: none !important;
    margin-top: 0 !important;
  }
}

/* =========================================
   ARTIST: Facts card estilo BC
   ========================================= */
.bc-page--artist ~ section .card{
  border-radius: 0;
  border: 0px solid var(--bc-line);
  background: var(--bc-panel);
  box-shadow: none;
  overflow: hidden;
}

.bc-page--artist ~ section .card .list-group{
  margin: 0;
}

.bc-page--artist ~ section .card .list-group-item{
  background: transparent;
  border: 0;
  border-top: 0px solid rgba(255,255,255,.10);
  padding: 14px 0px;
}

.bc-page--artist ~ section .card .list-group-item:first-child{
  border-top: 0;
}

/* etiqueta (Genre/Nationality/Aliases) */
.bc-page--artist ~ section .card .title{
  margin: 0;
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--bc-muted);
}

/* valor */
.bc-page--artist ~ section .card .subtitle{
  margin: 6px 0 0 0;
  font-size: 14px;
  font-weight: 300;
  color: var(--bc-text);
  line-height: 1.4;
}
/* convierte list-group en grid */
@media (min-width: 769px){
  .bc-page--artist ~ section .card .list-group{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .bc-page--artist ~ section .card .list-group-item{
    border-top: 0;
    border-left: 1px solid rgba(255,255,255,.10);
  }

  .bc-page--artist ~ section .card .list-group-item:first-child{
    border-left: 0;
  }
}
/* =========================================
   ARTIST: kill ugly bootstrap borders
   ========================================= */
.bc-page--artist ~ section .list-group-item{
  border: 0 !important;
}

.bc-page--artist ~ section
ul.list-group li.list-group-item,
.bc-page--artist ~ section
ul.list-group li.list-group-item:first-child,
.bc-page--artist ~ section
ul.list-group li.list-group-item:last-child{
  border-top: 0 !important;
  border-bottom: 0 !important;
}

.bc-page--artist ~ section .card .list-group-item{
  border-top: 0px solid rgba(255,255,255,.10);
}

.bc-page--artist ~ section .card .list-group-item:first-child{
  border-top: 0;
}

.bc-page--artist ~ section .bc-artist-layout {
    width: min(1160px, 100%);
    margin: 0 auto;
    padding: 26px 18px 34px;
}

.bc-page--artist ~ section .lgx-page-wrapper > .container {
    width: min(1160px, 100%);
    padding-left: 18px;
    padding-right: 18px;
}


/* =========================================================
   CITY PAGE (BC landing style)  |  .bc-page--city
   Replica del comportamiento de .bc-page--event
========================================================= */

/* 1) Banner: el contenedor debe ser relativo + recorte correcto */
.bc-page--city ~ section .lgx-banner.event-poster{
  position: relative;
  overflow: hidden;
  min-height: 360px !important;
  background-size: cover;
  background-position: center;
}

/* 2) Figcaption overlay absoluto (fix "figcaption cortado") */
.bc-page--city ~ section .lgx-banner.event-poster > figcaption{
  position: relative;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  z-index: 1;
  display: block;
}

/* 3) Gradiente BC (igual idea que event) */
.bc-page--city ~ section .lgx-banner.event-poster > figcaption{
  background: linear-gradient(90deg, rgb(39 40 41) 0%, rgb(39 40 41) 35%, rgba(83, 100, 141, 0) 100%);
  border: 0 !important;
}

/* 4) El contenido interno del figcaption debe ir por encima del overlay */
.bc-page--city ~ section .lgx-banner.event-poster > figcaption .lgx-banner-style,
.bc-page--city ~ section .lgx-banner.event-poster > figcaption .lgx-inner{
  position: relative;
  z-index: 2;
}

/* 5) Refuerzo para desktop (por si el theme mete posiciones raras) */
@media (min-width: 769px) {
  .bc-page--city ~ section .lgx-banner.event-poster > figcaption{
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    display: block !important;
    z-index: 1 !important;
  }
}

/* 6) Page wrapper: alineación “BC” (como events/home) */
.bc-page--city ~ main .lgx-page-wrapper{
  padding: 0; /* evitamos el padding raro default */
}

.bc-page--city ~ main .lgx-page-wrapper > .container{
  width: min(1160px, 100%);
  padding-left: 18px;
  padding-right: 18px;
}

/* 7) Quitar el max-width default que te rompe el “landing flow” */
.bc-page--city ~ main .lgx-post-wrapper article footer,
.bc-page--city ~ main .lgx-post-wrapper article header .text-area,
.bc-page--city ~ main .lgx-post-wrapper article section{
  margin: 0;
  max-width: none !important;
}

/* 8) Título/intro city más “landing” */
.bc-page--city ~ main .speaker-info .title{
  margin: 0 0 10px 0;
  line-height: 1.15;
}

/* 9) En mobile: si tu CSS global toca .col-lg-4, lo anulamos solo aquí */
@media screen and (max-width: 480px) {
  .bc-page--city ~ main .col-lg-4{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* =========================================================
   CITY PAGE — Landing style (igual vibe que Artist)
   Requiere: <div class="row bc-city-layout">
   Scoped: solo .bc-page--city
========================================================= */


/* 1) Quitar el max-width/margen default solo en city */
.bc-page--city ~ main .bc-city-layout .lgx-post-wrapper article header .text-area,
.bc-page--city ~ main .bc-city-layout .lgx-post-wrapper article section{
  margin: 0 !important;
  max-width: none !important;
}

/* 2) Título (H1) city como landing */
.bc-page--city ~ main .bc-city-layout .speaker-info .title{
    margin: 0;
    font-family: "MonumentExtended", "Bebas Neue", "Oswald", system-ui, sans-serif;
    text-transform: uppercase;
    letter-spacing: .02em;
    line-height: 1.05;
    font-size: clamp(22px, 3.2vw, 38px);
    color: var(--bc-text);
}

/* 3) Descripción city (landing) */
.bc-page--city ~ main .bc-city-layout article section{
    margin-top: 14px;
    padding: 16px;
    border: 1px solid var(--bc-line);
    background: rgba
#1a1a1a8c
(26, 26, 26, .55);
    border-radius: 0;
    color: rgba(255, 255, 255, .72);
    line-height: 1.65;
}

/* 4) Evitar bloques vacíos raros */
.bc-page--city ~ main .bc-city-layout article section:empty{
  display: none;
}
.bc-page--city ~ main .bc-city-layout article section p:empty{
  display: none;
}

/* 5) Espaciado entre intro y listado */
.bc-page--city ~ main .bc-events-page{
  margin-top: 26px;
}

/* 6) Mobile: padding cómodo y sin “aplastarse” */
@media (max-width: 768px){
  .bc-page--city ~ main .lgx-page-wrapper > .container{
    padding-left: 18px;
    padding-right: 18px;
  }

  .bc-page--city ~ main .bc-city-layout .speaker-info .title{
    font-size: 22px !important;
  }
}
/* CITY: centrar y limitar ancho del bloque intro (row bc-city-layout) */
.bc-page--city ~ main .bc-city-layout{
  width: min(1160px, 100%);
  margin: 0 auto;
  padding: 26px 18px 34px;
}
.bc-page--city ~ main .col-12{
  padding-right: 0 !important;
}
.bc-page--city ~ main .bc-city-layout > [class*="col-"]{
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
@media (min-width: 576px){
  .bc-page--club ~ main .col-sm-5,
  .bc-page--artist ~ main .col-sm-5,
  .bc-page--city   ~ main .col-sm-5{
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}
/* =========================================================
   BC CLUB PAGE – Landing Layout (isolated)
   Scope: .bc-page--club only
   ========================================================= */


/* 1) Banner: el contenedor debe ser relativo + recorte correcto */
.bc-page--club ~ section .lgx-banner.event-poster{
  position: relative;
  overflow: hidden;
  min-height: 360px !important;
  background-size: cover;
  background-position: center;
}

/* 2) Figcaption overlay absoluto (fix "figcaption cortado") */
.bc-page--club ~ section .lgx-banner.event-poster > figcaption{
  position: relative;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  z-index: 1;
  display: block;
}

/* 3) Gradiente BC (igual idea que event) */
.bc-page--club ~ section .lgx-banner.event-poster > figcaption{
  background: linear-gradient(90deg, rgb(39 40 41) 0%, rgb(39 40 41) 35%, rgba(83, 100, 141, 0) 100%);
  border: 0 !important;
}

/* 4) El contenido interno del figcaption debe ir por encima del overlay */
.bc-page--club ~ section .lgx-banner.event-poster > figcaption .lgx-banner-style,
.bc-page--club ~ section .lgx-banner.event-poster > figcaption .lgx-inner{
  position: relative;
  z-index: 2;
}

/* 5) Refuerzo para desktop (por si el theme mete posiciones raras) */
@media (min-width: 769px) {
  .bc-page--club ~ section .lgx-banner.event-poster > figcaption{
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    display: block !important;
    z-index: 1 !important;
  }
}

/* 6) Page wrapper: alineación “BC” (como events/home) */
.bc-page--club ~ main .lgx-page-wrapper{
  padding: 0; /* evitamos el padding raro default */
}

.bc-page--club ~ main .lgx-page-wrapper > .container{
  width: min(1160px, 100%);
  padding-left: 18px;
  padding-right: 18px;
}

.bc-page--club ~ main .lgx-post-wrapper article footer,
.bc-page--club ~ main .lgx-post-wrapper article header .text-area,
.bc-page--club ~ main .lgx-post-wrapper article section{
  margin: 0;
  max-width: none !important;
}

.bc-page--club ~ main .speaker-info .title{
  margin: 0 0 10px 0;
  line-height: 1.15;
}

@media screen and (max-width: 480px) {
  .bc-page--club ~ main .col-lg-4{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}


/* 1) Quitar el max-width/margen default solo en city */
.bc-page--club ~ main .bc-club-layout .lgx-post-wrapper article header .text-area,
.bc-page--club ~ main .bc-club-layout .lgx-post-wrapper article section{
  margin: 0 !important;
  max-width: none !important;
}

/* 2) Título (H1) city como landing */
.bc-page--club ~ main .bc-club-layout .speaker-info .title{
    margin: 0;
    font-family: "MonumentExtended", "Bebas Neue", "Oswald", system-ui, sans-serif;
    text-transform: uppercase;
    letter-spacing: .02em;
    line-height: 1.05;
    font-size: clamp(22px, 3.2vw, 38px);
    color: var(--bc-text);
}

/* 3) Descripción city (landing) */
.bc-page--club ~ main .bc-club-layout article section{
    margin-top: 14px;
    padding: 16px;
    border: 1px solid var(--bc-line);
    background: rgba
#1a1a1a8c
(26, 26, 26, .55);
    border-radius: 0;
    color: rgba(255, 255, 255, .72);
    line-height: 1.65;
}

/* 4) Evitar bloques vacíos raros */
.bc-page--club ~ main .bc-club-layout article section:empty{
  display: none;
}
.bc-page--club ~ main .bc-club-layout article section p:empty{
  display: none;
}

/* 5) Espaciado entre intro y listado */
.bc-page--club ~ main .bc-events-page{
  margin-top: 26px;
}

/* 6) Mobile: padding cómodo y sin “aplastarse” */
@media (max-width: 768px){
  .bc-page--club ~ main .lgx-page-wrapper > .container{
    padding-left: 18px;
    padding-right: 18px;
  }

  .bc-page--club ~ main .bc-club-layout .speaker-info .title{
    font-size: 22px !important;
  }
}
/* CLUB: centrar y limitar ancho del bloque intro (row bc-club-layout) */
.bc-page--club ~ main .bc-club-layout{
  width: min(1160px, 100%);
  margin: 0 auto;
  padding: 26px 18px 34px;
}
.bc-page--club ~ main .col-12{
  padding-right: 0 !important;
}
.bc-page--club ~ main .bc-club-layout > [class*="col-"]{
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}


/* ================================
   2. Contenedor landing centrado
================================ */

.bc-page--club ~ main .bc-club-layout{
  width: min(1160px, 100%);
  margin: 0 auto;
  padding: 26px 18px 34px;
}


/* ================================
   3. Quitar max-width default
   (Eventmie limita a 767px)
================================ */

.bc-page--club ~ main .bc-club-layout article header .text-area,
.bc-page--club ~ main .bc-club-layout article section{
  max-width: none !important;
  margin-left: 0;
  margin-right: 0;
}


/* ================================
   4. Forzar layout tipo landing
   (1 sola columna siempre)
================================ */

.bc-page--club ~ main .bc-club-layout > [class*="col-"]{
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}


/* cancelar grid bootstrap 5/7 */
@media (min-width: 576px){
  .bc-page--club ~ main .bc-club-layout .col-sm-5,
  .bc-page--club ~ main .bc-club-layout .col-sm-7,
  .bc-page--club ~ main .bc-club-layout .col-md-8{
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}


/* ================================
   5. Title + subtitle estilo BC
================================ */

.bc-page--club ~ main .speaker-info .title{
  margin: 0 0 6px 0;
  line-height: 1.05;
}

.bc-page--club ~ main .speaker-info .subtitle{
  margin: 0;
  opacity: .85;
}


/* ================================
   6. Social icons modernos BC
================================ */

.bc-page--club ~ main .lgx-social{
    margin: 14px 0 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.bc-page--club ~ main .lgx-social li{
  margin: 0 !important;
}

.bc-page--club ~ main .lgx-social a{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 999px;

  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);

  transition: .2s ease;
}

.bc-page--club ~ main .lgx-social a:hover{
  background: rgba(255,255,255,.12);
  border-color: rgba(255,255,255,.25);
  transform: translateY(-2px);
}


/* ================================
   7. Description spacing
================================ */

.bc-page--club ~ main .bc-club-layout article section{
  margin-top: 14px;
  line-height: 1.7;
}


/* ================================
   8. Events block full width
================================ */

.bc-page--club ~ main .bc-events-page{
  margin-top: 24px;
}

.bc-page--club ~ main .bc-events-page .container-fluid{
  padding-left: 0 !important;
  padding-right: 0 !important;
}


/* ================================
   9. Map fixes
================================ */

.bc-page--club ~ main .g-map-wrapper{
  min-height: 0 !important;
}

.bc-page--club ~ main .g-map-wrapper #map{
  min-height: 420px;
}


/* ================================
   10. Mobile tweaks
================================ */

@media (max-width: 768px){
  .bc-page--club ~ main .bc-club-layout{
    padding: 18px 14px 26px;
  }
}

.bc-page--club ~ main .lgx-social a {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--bc-line);
    border-radius: 0;
    background: rgba(32, 32, 32, .55);
    color: var(--bc-text);
    transition: transform .15s ease, border-color .15s ease, background .15s ease;
}

.bc-page--artist ~ main .bc-events-page .lgx-page-wrapper{
    padding-top: 0 !important;
    padding-bottom: 40px;
}
.bc-page--club ~ main .speaker-info .subtitle {
    margin: 10px 0 0 0;
    font-family: "Lato", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    font-weight: 300;
    font-size: 14px;
    color: var(--bc-muted);
}
.bc-page--club ~ main .lgx-social i
 {
    font-size: 14px;
}

.bc-page--club ~ main #get_directions.lgx-btn {
    background: rgba(255, 255, 255, .04) !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    border-radius: 0px !important;
    box-shadow: none !important;
    font-family: "Lato", sans-serif !important;
    text-transform: uppercase;
    letter-spacing: .10em;
    font-size: 12px;
    padding: 12px 18px;
    color: rgba(255, 255, 255, .92) !important;
}
.bc-page--club ~ main .bc-club-layout .bc-location__address {
    display: inline-flex;
    align-items: center;
    gap: 0px;
    margin: 6px 0 12px 0;
    font-family: "Lato", sans-serif;
    font-size: 13px;
    color: rgba(255,255,255,.75);
}
.bc-page--club ~ main .bc-map {
    margin-top: 20px;
}
.bc-page--club ~ section .lgx-heading .heading {
    font-family: "MonumentExtended", sans-serif;
    text-transform: uppercase;
    letter-spacing: .02em;
    color: var(--bc-text);
    font-size: clamp(18px, 2.2vw, 26px);
    line-height: 1.15;
    margin: 0;
}
.bc-map-actions {
    text-align: left;
    margin-top: 0px;
    margin-bottom: 10px;
}

/* Club page: igual que Event page */
.bc-page--club ~ main .lgx-heading .heading,
.bc-page--club ~ section .lgx-heading .heading {
    font-size: clamp(18px, 2.2vw, 26px);
    color: var(--bc-text);
}
.bc-page--city ~ main .lgx-heading .heading,
.bc-page--city ~ section .lgx-heading .heading {
    font-size: clamp(18px, 2.2vw, 26px);
    color: var(--bc-text);
}
.bc-page--artist ~ main  .bc-artist-layout > [class*="col-"]:last-child,
.bc-page--artist ~ section .bc-artist-layout > [class*="col-"]:last-child,
.bc-page--club ~ main  .bc-club-layout > [class*="col-"]:last-child,
.bc-page--city ~ main  .bc-city-layout > [class*="col-"]:last-child {
    border-top: 1px solid rgba(255, 255, 255, .08);
    padding-top: 18px;
}
.bc-page--club ~ main .mt-5,
.bc-page--club ~ section .mt-5 {
    margin-top: 0 !important;
}

@media (max-width: 480px){
  .home-banner-wrapper .lgx-banner-info{
    padding: 22px 0 18px 0;
  }
}


/* ==================================================
   HOME BANNER (VueCarousel): imagen siempre cubre, sin huecos (>=769px)
   ================================================== */

.home-banner-wrapper .slider-text-single,
.home-banner-wrapper .slider-text-single figure{
  height: clamp(420px, 55vw, 640px);
}

@media (max-width: 768px){
  .home-banner-wrapper .slider-text-single,
  .home-banner-wrapper .slider-text-single figure{
    height: clamp(360px, 70vw, 520px);
  }
}

.home-banner-wrapper .slider-text-single figure{
  position: relative;
  margin: 0;
  overflow: hidden;
}

/* La imagen pasa a “background cover” real */
.home-banner-wrapper .slider-text-single figure > img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* El contenido (texto/botón) siempre por encima */
.home-banner-wrapper .slider-text-single figure figcaption{
  position: relative;
  z-index: 2;
}

/* Asegura que el carousel no colapse alturas raras */
.home-banner-wrapper .VueCarousel,
.home-banner-wrapper .VueCarousel-wrapper,
.home-banner-wrapper .VueCarousel-inner,
.home-banner-wrapper .VueCarousel-slide{
  height: 100%;
}
@media (min-width: 769px){
  .home-banner-wrapper .lgx-banner-style{
    padding: 0 !important;
  }
}


/* Page flags (sistema global BC) */
.bc-page{
  display:none;
}
