/* ===========================================================
   BROADWAY COVERS — estilos propios (teatro / marquesina)
   Scoped bajo .bc. Assets en assets/bc/.
   =========================================================== */

.bc {
  --bc-oro: #e9c44c;
  --bc-oro-claro: #ffe9a8;
  --bc-rojo: #8c1020;
  --bc-rojo-osc: #5a0a10;
  --bc-negro: #0d0a08;
  font-family: "Nunito", system-ui, sans-serif;
  color: #f5ead0;
}

/* Títulos estilo marquesina */
.bc .bc-title {
  font-family: "Limelight", "Baloo 2", serif;
  font-size: clamp(2rem, 6vw, 3.8rem); letter-spacing: .04em; text-align: center;
  text-transform: uppercase;
  background: linear-gradient(180deg, #fff3c4 0%, #e9c44c 45%, #a9791a 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 3px 0 rgba(0,0,0,.5)) drop-shadow(0 0 14px rgba(233,196,76,.4));
}

/* Secciones */
.bc-section { padding-block: clamp(48px, 7vw, 92px); position: relative; overflow: hidden; }
.bc-inner { width: 100%; max-width: 1100px; margin-inline: auto; padding-inline: 22px; position: relative; z-index: 2; }

.bc-bg-curtain {
  background: #5a0a10 url("../bc/curtain.jpg") center / cover;
}
.bc-bg-curtain::before { /* viñeta para legibilidad */
  content: ""; position: absolute; inset: 0; z-index: 1;
  background: radial-gradient(120% 90% at 50% 30%, rgba(0,0,0,.25), rgba(0,0,0,.78));
}
.bc-bg-times { background: #07060a url("../bc/bg-timessquare.jpg") center / cover; }
.bc-bg-times::before { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(7,6,10,.74); }
.bc-bg-velvet {
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), transparent 30%),
    repeating-linear-gradient(90deg, #6e0b14 0 16px, #8c1020 16px 30px, #5a0a10 30px 46px);
}
.bc-bg-dark { background: radial-gradient(120% 100% at 50% 0%, #1a1410, #0a0807); }

/* Bombillas de marquesina */
.bc-bulbs { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
.bc-bulbs span {
  width: 13px; height: 13px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #fff, #ffd24d 60%, #b8860b);
  box-shadow: 0 0 12px #ffd24d, 0 0 5px #fff; animation: bc-bulb 1.1s ease-in-out infinite;
}
.bc-bulbs span:nth-child(even) { animation-delay: .55s; }
@keyframes bc-bulb { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: .25; transform: scale(.85); } }

/* ---------- HERO ---------- */
.bc-hero { text-align: center; padding-block: clamp(30px, 5vw, 60px); }
.bc-hero__logo {
  width: min(560px, 90%); margin: 22px auto;
  filter: drop-shadow(0 14px 26px rgba(0,0,0,.7));
  animation: bc-bob 4.5s ease-in-out infinite;
}
@keyframes bc-bob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
.bc-hero__sub {
  font-weight: 800; font-size: clamp(1rem, 2.4vw, 1.35rem); color: #ffe9a8;
  text-shadow: 0 2px 6px rgba(0,0,0,.8); max-width: 58ch; margin: 0 auto;
}

/* ---------- ESCENARIO (vídeo destacado) ---------- */
.bc-stage {
  max-width: 860px; margin: 32px auto 0; position: relative;
  background: #0a0a0a; border: 8px solid var(--bc-oro);
  border-radius: 14px; padding: 16px;
  box-shadow: 0 0 0 4px #3a280a, 0 22px 50px rgba(0,0,0,.6), inset 0 0 30px rgba(0,0,0,.8);
}
.bc-stage__screen { position: relative; aspect-ratio: 16/9; border-radius: 8px; overflow: hidden; background: #000; }
.bc-stage__screen iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
/* cortinitas a los lados del escenario */
.bc-stage::before, .bc-stage::after {
  content: ""; position: absolute; top: 16px; bottom: 16px; width: 42px; z-index: 3; pointer-events: none;
  background: repeating-linear-gradient(90deg, #6e0b14 0 8px, #9a1325 8px 16px, #5a0a10 16px 24px);
  box-shadow: inset 0 0 20px rgba(0,0,0,.6);
}
.bc-stage::before { left: 16px; border-radius: 8px 0 0 8px; }
.bc-stage::after { right: 16px; border-radius: 0 8px 8px 0; }

/* ---------- COVERS (playbills) ---------- */
.bc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2.5vw, 26px); margin-top: 34px; }
.bc-cover {
  cursor: pointer; background: linear-gradient(180deg, #161210, #0c0a08); border: 3px solid var(--bc-oro);
  border-radius: 14px; padding: 12px; text-align: center; color: #f5ead0;
  box-shadow: 0 10px 0 rgba(0,0,0,.4); transition: transform .3s cubic-bezier(.34,1.56,.64,1), box-shadow .3s;
}
.bc-cover:hover { transform: translateY(-6px); box-shadow: 0 16px 0 rgba(0,0,0,.4), 0 0 26px rgba(233,196,76,.35); }
.bc-cover__thumb { position: relative; aspect-ratio: 16/9; border-radius: 8px; overflow: hidden; background: #000; }
.bc-cover__thumb img { width: 100%; height: 100%; object-fit: cover; }
.bc-cover__play {
  position: absolute; inset: 0; margin: auto; width: 64px; height: 46px; z-index: 2;
  background: rgba(140,16,32,.92); border-radius: 12px; display: grid; place-items: center;
  border: 2px solid var(--bc-oro); transition: transform .25s, background .25s;
}
.bc-cover__play::after { content: ""; border-style: solid; border-width: 10px 0 10px 16px; border-color: transparent transparent transparent var(--bc-oro-claro); margin-left: 4px; }
.bc-cover:hover .bc-cover__play { transform: scale(1.12); background: var(--bc-rojo); }
.bc-cover__title { display: block; margin-top: 10px; font-family: "Limelight", serif; font-size: 1.05rem; color: var(--bc-oro); }
.bc-cover__musical { display: block; font-size: .85rem; color: #cbb88f; font-weight: 700; }

/* ---------- CTA ---------- */
.bc-link-card {
  display: flex; align-items: center; gap: 18px; max-width: 560px; margin: 30px auto 0;
  background: #0c0a08; border: 3px solid var(--bc-oro); border-radius: 16px; padding: 16px 20px;
  box-shadow: 0 12px 0 rgba(0,0,0,.4); text-align: left; color: #f5ead0;
  transition: transform .3s cubic-bezier(.34,1.56,.64,1);
}
.bc-link-card:hover { transform: translateY(-5px); }
.bc-link-card img { width: 120px; flex: none; }
.bc-link-card h3 { font-family: "Limelight", serif; color: var(--bc-oro); font-size: 1.2rem; margin-bottom: 4px; }
.bc-link-card p { color: #cbb88f; font-size: .95rem; }
.bc-link-card .tag { margin-top: 8px; display: inline-flex; gap: 6px; font-weight: 800; color: var(--bc-oro-claro); }

/* ---------- Lightbox de vídeo ---------- */
.bc-vlb { position: fixed; inset: 0; z-index: 1001; background: rgba(8,4,2,.93); backdrop-filter: blur(5px); display: none; place-items: center; padding: 24px; }
.bc-vlb.abierto { display: grid; }
.bc-vlb__inner { width: min(900px, 94vw); }
.bc-vlb__embed { position: relative; aspect-ratio: 16/9; border-radius: 14px; overflow: hidden; border: 6px solid var(--bc-oro); box-shadow: 0 0 50px rgba(233,196,76,.5); background: #000; }
.bc-vlb__embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.bc-vlb__close { position: absolute; top: 22px; right: 28px; font-size: 2.4rem; color: var(--bc-oro-claro); background: none; border: 0; cursor: pointer; }

/* ===========================================================
   Apertura de telón al cargar la página
   =========================================================== */
.bc-curtain-boot { position: fixed; inset: 0; z-index: 9998; pointer-events: none; }
.bc-curtain-boot span {
  position: absolute; top: 0; bottom: 0; width: 52%;
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), transparent 25%),
    repeating-linear-gradient(90deg, #6e0b14 0 22px, #9a1325 22px 44px, #5a0a10 44px 66px);
  box-shadow: inset 0 0 60px rgba(0,0,0,.7);
}
.bc-curtain-boot .izq { left: 0;  transform-origin: left;  animation: bc-open-l 1.3s ease-in-out .15s forwards; }
.bc-curtain-boot .der { right: 0; transform-origin: right; animation: bc-open-r 1.3s ease-in-out .15s forwards; }
@keyframes bc-open-l { to { transform: translateX(-101%); } }
@keyframes bc-open-r { to { transform: translateX(101%); } }

@media (max-width: 760px) {
  .bc-grid { grid-template-columns: 1fr 1fr; }
  .bc-link-card { flex-direction: column; text-align: center; }
}
@media (max-width: 460px) { .bc-grid { grid-template-columns: 1fr; } }