* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; }
body { background:#0e0620; color:#fff; font-family:'Inter',sans-serif; overflow-x:hidden; }

/* ── SCROLL PROGRESS ── */
.prog {
  position:fixed; top:0; left:0; height:3px; z-index:5000;
  background:linear-gradient(90deg,#c026d3,#22d3ee);
  width:0%; transition:width .08s linear;
}

/* ── NAV ── */
nav {
  position:fixed; top:0; left:0; right:0; z-index:4000;
  display:flex; align-items:center; justify-content:space-between;
  padding:.9rem 3rem;
  background:rgba(14,6,32,.92);
  backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(192,38,211,.2);
}
.nav-logo { font-family:'Bebas Neue',sans-serif; font-size:1.5rem; letter-spacing:.12em; color:#e879f9; text-decoration:none; }
.nav-links { display:flex; gap:2rem; list-style:none; }
.nav-links a { text-decoration:none; color:rgba(255,255,255,.5); font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.14em; transition:color .2s; }
.nav-links a:hover { color:#e879f9; }

/* ── DOTS ── */
.dots {
  position:fixed; right:1.4rem; top:50%; transform:translateY(-50%);
  z-index:3000; display:flex; flex-direction:column; gap:7px;
}
.dot {
  width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.18);
  cursor:pointer; border:none; padding:0; transition:all .3s;
}
.dot.active { background:#e879f9; height:20px; border-radius:3px; }
.dot:hover { background:rgba(232,121,249,.5); }

/* ── SECTION BASE ── */
.slide {
  min-height:100vh; width:100%; position:relative;
  display:flex; align-items:center; justify-content:center;
  padding-top:64px;
}

/* reveal */
.reveal { opacity:0; transform:translateY(36px); transition:opacity .8s ease, transform .8s cubic-bezier(.16,1,.3,1); }
.reveal.in { opacity:1; transform:translateY(0); }
.reveal.d1 { transition-delay:.1s; }
.reveal.d2 { transition-delay:.2s; }
.reveal.d3 { transition-delay:.3s; }
.reveal.d4 { transition-delay:.45s; }
.reveal.d5 { transition-delay:.6s; }

/* photo placeholder */
.photo {
  background: linear-gradient(135deg,rgba(139,79,207,.25),rgba(34,211,238,.12));
  border: 2px dashed rgba(139,79,207,.5);
  border-radius:8px;
  display:flex; align-items:center; justify-content:center;
  flex-direction:column; gap:.5rem;
  color:rgba(255,255,255,.35); font-size:.75rem; font-family:'Inter',sans-serif;
  font-weight:600; text-transform:uppercase; letter-spacing:.1em;
  text-align:center; padding:1rem;
}
.photo span { font-size:1.5rem; }

/* ═══════════════════════════════════════════
   SLIDE 01 — INTRO / QUIÉNES SOMOS
══════════════════════════════════════════════ */
#s01 { background: linear-gradient(135deg,#1a0a3a 0%,#2a1060 50%,#1a0a3a 100%); }
#s01b {
  min-height:82vh;
}
.s01-grid {
  width:100%; padding:0 2rem 2rem;
  display:flex; flex-direction:column; gap:1.5rem;
  transform:translateY(6vh);
}
.s01-photos-row {
  display:grid; grid-template-columns:1fr; gap:1rem;
  max-width:1180px;
  width:100%;
  margin:0 auto;
}
.s01-photo-main { 
  aspect-ratio:3.4/1; border-radius:12px; overflow:hidden; position:relative;
}
.s01-photo-main img { 
  width:100%; height:155%; object-fit:cover; object-position:center 40%;
  will-change:transform;
  transform: translateY(0%);
  display:block;
  margin-top:0;
}
.s01-photo-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:1rem;
}
.s01-photo-sm { aspect-ratio:16/9; border-radius:12px; overflow:hidden; }
.s01-photo-sm .photo { height:100%; border-radius:12px; border:none; font-size:.55rem; }
.s01-body {
  font-size:clamp(1.25rem,1.75vw,1.7rem); color:rgba(255,255,255,.85); line-height:1.65;
  text-align:center; width:100%;
  font-weight:650; max-width:1180px; margin:0 auto;
}

/* ═══════════════════════════════════════════
   SLIDE 02 — CONFÍAN EN NOSOTROS
══════════════════════════════════════════════ */
.s02-wrap { width:100%; max-width:1400px; margin:0 auto; padding:.5rem 3rem 2rem; }
.s02-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(3.5rem,6vw,5.5rem);
  letter-spacing:.12em; color:#1a0a3a;
  text-align:center; margin-bottom:2rem;
}
.s02-img-wrap {
  display:flex; justify-content:center; width:100%;
}
.s02-clientes-img {
  max-width:100%; width:100%;
  object-fit:contain;
  border-radius:0;
}
#s02 {
  background: #ffffff;
}

/* ═══════════════════════════════════════════
   SLIDE 03 — ALIADOS ESTRATÉGICOS
══════════════════════════════════════════════ */
#s03 { background:linear-gradient(160deg,#1e0e40,#0f0830); }
.s03-wrap {
  width:100%; max-width:1400px; min-height:calc(100vh - 64px);
  margin:0 auto; padding:0 3rem 4.25rem;
  display:flex; flex-direction:column; justify-content:center;
}
.s03-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(3.5rem,6vw,5rem); letter-spacing:.12em; color:#fff;
  text-align:center; margin-bottom:2.35rem;
}
.s03-logos {
  display:flex; flex-direction:column; gap:1.5rem; align-items:center;
}
.s03-row { display:flex; gap:1.5rem; justify-content:center; }
.s03-logo {
  height:52px; min-width:120px; padding:.5rem 1rem;
  background:transparent;
  border:none;
  border-radius:8px;
  display:flex; align-items:center; justify-content:center;
}
.s03-logo img {
  max-width:100%;
  max-height:38px;
  object-fit:contain;
  display:block;
}
/* Logos más altos: nex, tvn, los40, sertv */
.s03-logo.logo-tall img {
  max-height:52px;
}

/* ═══════════════════════════════════════════
   SLIDE 04 — FILMS & MULTIMEDIA (corregido)
══════════════════════════════════════════════ */
#s04 {
  background: #ffffff;
  overflow: hidden;
  position: relative;
  padding-top: 64px;
  min-height: 100vh;
}

#s04 .s04-stripe,
#s04 .s04-qlogo {
  display: none !important;
}

/* Círculos concéntricos: dos bandas blancas y dos azules visibles */
#s04 > .s04-bg {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none;
  overflow: visible !important;
  background: transparent;
}

#s04 > .s04-bg::before {
  content: "";
  position: absolute;
  width: 1040px;
  height: 1040px;
  right: -550px;
  top: -70px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    #3b1a7a 0 42%,
    transparent 42% 48%,
    #3b1a7a 48% 56%,
    transparent 56% 62%,
    #3b1a7a 62% 100%
  );
}

/* Claqueta SVG */
#s04 .s04-clap {
  position: absolute !important;
  top: 4.4rem;
  left: clamp(16rem, 25vw, 27rem);
  width: 190px;
  height: 170px;
  transform: rotate(-18deg);
  transform-origin: center;
  z-index: 5 !important;
  pointer-events: none;
  animation: clap-float 3.2s ease-in-out infinite;
}

@keyframes clap-float {
  0%, 100% { transform: rotate(-18deg) translateY(0); }
  50%      { transform: rotate(-15deg) translateY(-10px); }
}

/* Layout */
#s04 .s04-wrap {
  width: 100%;
  max-width: 1620px;
  min-height: calc(100vh - 64px);
  margin: 0 auto;
  padding: 2.5rem 3rem 3rem;
  display: grid;
  grid-template-columns: 33% 67%;
  align-items: center;
  gap: 20px;
  position: relative !important;
  z-index: 2 !important;
}

#s04 .s04-text {
  position: relative !important;
  z-index: 4 !important;
}

#s04 .s04-tag {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: .84rem;
  font-weight: 800;
  letter-spacing: .46em;
  text-transform: uppercase;
  color: #7c3aed;
  display: block;
  margin-bottom: .58rem;
  white-space: nowrap;
}

#s04 .s04-films {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(4.5rem, 7vw, 7.15rem);
  line-height: .88;
  color: #15072e;
  display: block;
  letter-spacing: .075em;
  text-transform: uppercase;
}

#s04 .s04-amp {
  color: #e879f9;
  margin-left: .16em;
}

/* Browser */
#s04 .s04-browser-wrap {
  position: relative !important;
  min-height: 530px;
  display: flex;
  align-items: center;
  z-index: 3 !important;
}

#s04 .s04-browser {
  width: 100%;
  max-width: 1060px;
  height: 528px;
  background: #ffffff;
  border: 3px solid #2a2d91;
  border-radius: 13px 13px 7px 7px;
  overflow: hidden;
  position: relative !important;
  z-index: 3 !important;
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
  box-shadow: none;
}

#s04 .s04-browser-bar {
  height: 55px;
  border-bottom: 3px solid #2a2d91;
  background: #ffffff;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 18px;
}

#s04 .s04-dot-r,
#s04 .s04-dot-y,
#s04 .s04-dot-g {
  width: 13px;
  height: 13px;
  border-radius: 50%;
  border: 2px solid #161616;
  flex: 0 0 auto;
}

#s04 .s04-dot-r { background: #ff0a48; }
#s04 .s04-dot-y { background: #ffd82f; }
#s04 .s04-dot-g { background: #31d443; }

#s04 .s04-films-grid {
  height: calc(100% - 55px);
  padding: 24px 24px 35px;
  display: grid;
  grid-template-columns: 1.45fr 1fr .85fr .72fr .72fr;
  gap: 0;
}

#s04 .s04-film {
  position: relative;
  overflow: hidden;
  min-width: 0;
  height: 100%;
  color: #ffffff;
  background-size: cover;
  background-position: center;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 18px;
}

#s04 .s04-film img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

#s04 .s04-film::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(to top, rgba(0,0,0,.70), rgba(0,0,0,.06) 62%);
}

#s04 .s04-film > *:not(img) {
  position: relative;
  z-index: 2;
}

#s04 .s04-film-sub {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .45em;
  text-transform: uppercase;
  text-align: center;
  opacity: .78;
  margin-bottom: .35rem;
}

#s04 .s04-film-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(2.15rem, 3vw, 3.7rem);
  line-height: .86;
  letter-spacing: .08em;
  text-align: center;
  text-transform: uppercase;
  font-weight: 900;
}

#s04 .s04-film.feature .s04-film-title {
  font-size: clamp(3.2rem, 4.4vw, 5.1rem);
}

#s04 .s04-film-year {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.15rem;
  letter-spacing: .44em;
  text-align: center;
  opacity: .7;
  margin-top: 1.1rem;
}

/* Posters generados para no repetir la misma portada en todos los espacios */
#s04 .s04-film-papers {
  background:
    radial-gradient(circle at 28% 25%, rgba(255,190,70,.82), transparent 13%),
    radial-gradient(circle at 92% 18%, rgba(255,120,45,.82), transparent 12%),
    radial-gradient(circle at 50% 18%, rgba(255,240,190,.22), transparent 18%),
    linear-gradient(110deg, #111421 0%, #120e12 45%, #352817 100%);
}

#s04 .s04-film-papers img {
  object-position: center center;
}

#s04 .s04-film-pleanero {
  background:
    radial-gradient(circle at 64% 54%, #14191c 0 18%, transparent 19%),
    radial-gradient(circle at 78% 60%, rgba(13,20,24,.92) 0 27%, transparent 28%),
    linear-gradient(180deg, #49cadd 0%, #69d6e6 58%, #4daec6 100%);
  justify-content: flex-start;
  padding-top: 56px;
}

#s04 .s04-film-pleanero::before {
  content: "";
  position: absolute;
  right: -12%;
  bottom: -9%;
  width: 86%;
  height: 78%;
  border-radius: 48% 48% 0 0;
  background:
    radial-gradient(circle at 42% 25%, #e6b999 0 12%, transparent 13%),
    radial-gradient(circle at 46% 28%, #111319 0 35%, transparent 36%),
    linear-gradient(180deg, transparent 0 46%, #0d1015 47% 100%);
  z-index: 0;
}

#s04 .s04-film-body {
  background:
    linear-gradient(90deg, rgba(55,24,30,.70), rgba(28,19,22,.94)),
    radial-gradient(circle at 22% 30%, #b33946 0 21%, transparent 22%),
    radial-gradient(circle at 72% 24%, #efd6c8 0 12%, transparent 13%),
    linear-gradient(180deg, #7d3e33, #1d1719 70%);
  justify-content: center;
}

#s04 .s04-film-body .s04-film-title {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(1.7rem, 2.2vw, 2.7rem);
  letter-spacing: .015em;
}

#s04 .s04-film-frozen {
  color: #d1322b;
  background:
    radial-gradient(circle at 53% 20%, #ffffff 0 27%, transparent 28%),
    radial-gradient(circle at 25% 23%, #f6fbff 0 14%, transparent 15%),
    linear-gradient(180deg, #e7f5ff 0%, #f3fbff 46%, #d3e0ea 100%);
  justify-content: center;
}

#s04 .s04-film-frozen::after {
  background: linear-gradient(to top, rgba(255,255,255,.16), rgba(255,255,255,.02));
}

#s04 .s04-film-frozen .s04-film-title {
  color: #d1322b;
  font-size: clamp(2.3rem, 3.4vw, 4.1rem);
}

#s04 .s04-film-reverie {
  color: #e9c647;
  background:
    radial-gradient(circle at 73% 18%, #f9cc38 0 10%, transparent 11%),
    radial-gradient(circle at 33% 58%, #f7d8ca 0 18%, transparent 19%),
    linear-gradient(90deg, #f8f1eb 0 46%, #121015 47% 100%);
  justify-content: center;
}

#s04 .s04-film-reverie::after {
  background: linear-gradient(to top, rgba(0,0,0,.10), rgba(0,0,0,.02));
}

#s04 .s04-film-reverie .s04-film-title {
  color: #e9c647;
  font-size: clamp(1.85rem, 2.55vw, 3.1rem);
  mix-blend-mode: multiply;
}

/* Stickers decorativos */
#s04 .s04-sticker {
  position: absolute !important;
  z-index: 6 !important;
  pointer-events: none;
}

#s04 .s04-sticker.yellow {
  width: 132px;
  height: 35px;
  left: -26px;
  bottom: 73px;
  background: #ffc940;
  border: 4px solid #111111;
  transform: rotate(16deg) skewX(22deg);
}

#s04 .s04-sticker.pink-top {
  width: 39px;
  height: 12px;
  left: 39%;
  top: 34px;
  background: #ff69bd;
  border: 4px solid #111111;
  transform: rotate(21deg);
}

#s04 .s04-sticker.teal {
  width: 145px;
  height: 22px;
  right: 38%;
  top: -10px;
  border: 7px solid #111111;
  border-top: 0;
  border-left-color: #00b886;
  border-bottom-color: #00b886;
  border-right-color: #00b886;
  border-radius: 12px;
  transform: rotate(-2deg);
  background: transparent;
}

#s04 .s04-sticker.yellow-top {
  width: 95px;
  height: 23px;
  top: -9px;
  right: 25%;
  background: #ffd454;
  border: 4px solid #111111;
  transform: rotate(-9deg) skewX(-22deg);
}

#s04 .s04-sticker.pink-bottom {
  width: 33px;
  height: 13px;
  left: -2px;
  bottom: 3px;
  background: #ff69bd;
  border: 4px solid #111111;
  transform: rotate(-3deg);
}

@media (max-width: 1200px) {
  #s04 .s04-wrap {
    max-width: 100%;
    grid-template-columns: 34% 66%;
    padding: 2rem 2rem 2.6rem;
  }

  #s04 .s04-clap {
    left: 18rem;
    top: 4rem;
  }

  #s04 > .s04-bg::before {
    right: -720px;
  }
}

@media (max-width: 900px) {
  #s04 .s04-wrap {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  #s04 .s04-clap {
    top: 2rem;
    left: auto;
    right: 2rem;
    width: 135px;
    height: 120px;
  }

  #s04 > .s04-bg::before {
    width: 900px;
    height: 900px;
    right: -600px;
    top: 80px;
  }
}

@media (max-width: 760px) {
  #s04 .s04-wrap {
    padding: 2rem 1.2rem;
  }

  #s04 .s04-films {
    font-size: 4.2rem;
  }

  #s04 .s04-tag {
    letter-spacing: .28em;
  }

  #s04 .s04-browser-wrap {
    min-height: 420px;
  }

  #s04 .s04-browser {
    height: 420px;
  }

  #s04 .s04-films-grid {
    overflow-x: auto;
    grid-template-columns: 260px 190px 165px 165px 170px;
  }
}

/* ═══════════════════════════════════════════
   SLIDE 06 — NARRATIVAS
══════════════════════════════════════════════ */
#s06 { background:#fff; overflow:hidden; }
.s06-wrap { width:100%; padding:3rem 0; }
.s06-row {
  display:flex; white-space:nowrap; overflow:hidden;
  margin-bottom:.5rem;
}
.s06-row-inner {
  display:flex; gap:0;
  animation:marquee-left 12s linear infinite;
}
.s06-row-inner.reverse { animation-direction:reverse; animation-duration:15s; }
.s06-word-solid {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(4rem,8vw,7rem); letter-spacing:.02em;
  padding:0 .3rem; color:#1a0a3a;
}
.s06-word-outline {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(4rem,8vw,7rem); letter-spacing:.02em;
  padding:0 .3rem;
  -webkit-text-stroke:2px #6b3bbf; color:transparent;
}
.s06-word-brand {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(4rem,8vw,7rem); letter-spacing:.02em;
  padding:0 .3rem; color:#3b1a7a;
}
@keyframes marquee-left {
  from { transform:translateX(0); }
  to { transform:translateX(-50%); }
}

/* ═══════════════════════════════════════════
   SLIDE 07 — QUE EMOCIONA COMO EL CINE
══════════════════════════════════════════════ */
#s07 { background:#fff; }
.s07-wrap {
  width:100%; max-width:1400px; margin:0 auto; padding:3rem;
  display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:center;
}
.s07-sub {
  font-family:'Barlow Condensed',sans-serif; font-size:.8rem;
  font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:#9333ea;
  margin-bottom:.8rem; display:block;
}
.s07-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(3rem,5.5vw,5rem); color:#1a0a3a; line-height:1;
}
.s07-title em { color:#9333ea; font-style:normal; }
.s07-body {
  margin-top:1.2rem; font-size:.82rem; color:rgba(26,10,58,.7); line-height:1.7; max-width:380px;
}
.s07-photos {
  display:grid; grid-template-columns:1fr 1fr; gap:.8rem;
}
.s07-photo-big { grid-column:1/-1; aspect-ratio:16/7; }
.s07-photo-sm { aspect-ratio:4/3; }

/* ═══════════════════════════════════════════
   SLIDE 08 — INSTRUMENTOS DE EMOCIÓN
══════════════════════════════════════════════ */
#s08 { background:linear-gradient(90deg,#1a3a8f 0%,#1a0a6e 50%,#0e0620 100%); }
.s08-wrap {
  width:100%; max-width:1400px; margin:0 auto; padding:3rem;
  display:flex; align-items:center;
}
.s08-q-side {
  flex:0 0 50%; display:flex; align-items:center; justify-content:center;
}
.s08-titulo {
  font-family:'Barlow Condensed',sans-serif; font-size:clamp(2.5rem,5vw,4.5rem);
  font-weight:900; line-height:1; text-transform:uppercase; letter-spacing:.05em;
}
.s08-titulo .line1 { color:#fff; }
.s08-titulo .de { color:#a78bfa; font-size:.6em; font-weight:600; }
.s08-titulo .line2 { color:#e879f9; }
.s08-body { margin-top:1.2rem; font-size:.78rem; color:rgba(255,255,255,.55); line-height:1.8; max-width:380px; }
.s08-text-side { flex:1; }

/* ═══════════════════════════════════════════
   SLIDE 10 — PENSAMOS COMO CREATIVOS
══════════════════════════════════════════════ */
#s10 {
  background: linear-gradient(90deg, #d24bf0 0%, #be55ef 24%, #a45df0 54%, #8a5cf0 78%, #7658f0 100%);
  overflow: hidden;
  min-height: 260px;
  height: auto;
  padding-top: 25px;
  padding-bottom: 0;
  align-items: stretch;
}
.s10-wrap {
  width: 100%;
  min-height: 196px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 1.25rem 3.2rem 2rem;
}
.s10-content {
  width: 100%;
  max-width: 1120px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.s10-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(2rem, 3.35vw, 3.55rem);
  font-weight: 800;
  letter-spacing: -0.045em;
  color: #ffffff;
  line-height: 1.02;
  max-width: 1040px;
  text-transform: none;
}
.s10-body {
  margin-top: .55rem;
  font-family: 'Inter', sans-serif;
  font-size: clamp(.95rem, 1.28vw, 1.45rem);
  font-weight: 400;
  color: rgba(255,255,255,.96);
  line-height: 1.24;
  max-width: 1120px;
}
@media (max-width: 900px) {
  #s10 {
    min-height: 240px;
  }
  .s10-wrap {
    min-height: 176px;
    padding: 1.9rem 1.6rem 1.8rem;
  }
  .s10-title,
  .s10-body {
    max-width: 100%;
  }
}
@media (max-width: 560px) {
  #s10 {
    min-height: 220px;
  }
  .s10-wrap {
    min-height: 156px;
    padding: 1.45rem 1.1rem 1.4rem;
  }
  .s10-title {
    font-size: clamp(1.7rem, 8vw, 2.25rem);
    line-height: 1.05;
  }
  .s10-body {
    font-size: 1rem;
    line-height: 1.32;
  }
}

/* ═══════════════════════════════════════════
   SLIDE 12 — EVENTOS & EXPERIENCIAS INMERSIVAS
══════════════════════════════════════════════ */
#s12 { background:linear-gradient(135deg,#5b21b6 0%,#3b0764 50%,#1e1b4b 100%); }
.s12-wrap {
  width:100%; max-width:1400px; margin:0 auto; padding:3rem;
  display:flex; align-items:center; justify-content:space-between;
}
.s12-eventos {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(5rem,12vw,10rem); line-height:.9;
  background:linear-gradient(180deg,#60a5fa,#a78bfa);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  letter-spacing:.02em;
}
.s12-amp { color:rgba(255,255,255,.5); font-family:'Bebas Neue',sans-serif; font-size:3rem; }
.s12-sub {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(1.5rem,4vw,3rem); letter-spacing:.06em;
}
.s12-sub .exp { color:#a3e635; }
.s12-sub .inm { color:rgba(255,255,255,.7); }
.s12-q { font-family:'Bebas Neue',sans-serif; font-size:3rem; color:rgba(255,255,255,.25); margin-top:1rem; }
.s12-confetti { font-size:3rem; display:flex; flex-direction:column; gap:.5rem; opacity:.8; }

/* ═══════════════════════════════════════════
   SLIDE 13 — CUANDO NOS ENCARGAMOS DEL EVENTO
══════════════════════════════════════════════ */
#s13 { background:linear-gradient(180deg,#0e0620 0%,#3b1a7a 50%,#1e1b4b 100%); }
.s13-wrap { width:100%; max-width:1400px; margin:0 auto; padding:2rem 3rem; display:flex; flex-direction:column; gap:2rem; }
.s13-title {
  text-align:center;
  font-family:'Barlow Condensed',sans-serif; font-size:clamp(1.8rem,3.5vw,2.8rem);
  font-weight:900; text-transform:uppercase; letter-spacing:.06em; line-height:1.2;
}
.s13-title .line1 { color:#e879f9; }
.s13-title .line2 { color:#fff; }
.s13-photos {
  display:grid; grid-template-columns:repeat(5,1fr); gap:.8rem;
}
.s13-photo { aspect-ratio:4/3; }
.s13-body { font-size:.78rem; color:rgba(255,255,255,.6); line-height:1.7; text-align:center; max-width:700px; margin:0 auto; }

/* ═══════════════════════════════════════════
   SLIDE 14 — CARRUSEL TIPOS DE EVENTOS
══════════════════════════════════════════════ */
#s14 {
  background:
    radial-gradient(circle at 12% 18%, rgba(232,121,249,.18), transparent 28%),
    radial-gradient(circle at 88% 78%, rgba(59,130,246,.18), transparent 26%),
    linear-gradient(135deg,#2d1b6e,#1a0a3a);
  overflow:hidden;
}
.s14-wrap {
  width:100%;
  max-width:1500px;
  margin:0 auto;
  padding:3rem 3.4rem;
  display:flex;
  flex-direction:column;
  gap:1.6rem;
}
.s14-head {
  max-width:900px;
}
.s14-kicker {
  display:block;
  margin-bottom:.65rem;
  font-family:'Barlow Condensed',sans-serif;
  font-size:.88rem;
  font-weight:800;
  letter-spacing:.42em;
  text-transform:uppercase;
  color:#e879f9;
}
.s14-title {
  font-family:'Inter',sans-serif;
  font-size:clamp(2rem,4.2vw,4.4rem);
  line-height:1.02;
  letter-spacing:-.055em;
  color:#fff;
  max-width:980px;
}
.s14-carousel {
  position:relative;
  width:100%;
}
.s14-track {
  display:flex;
  gap:1rem;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;
  scroll-padding:0 4rem;
  padding:.8rem 4rem 1.4rem;
  scrollbar-width:none;
}
.s14-track::-webkit-scrollbar { display:none; }
.s14-card {
  position:relative;
  flex:0 0 min(78vw,760px);
  min-height:420px;
  border-radius:28px;
  overflow:hidden;
  scroll-snap-align:center;
  background:#241050;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 28px 70px rgba(0,0,0,.35);
  isolation:isolate;
}
.s14-card::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.74)),
    var(--s14-bg, linear-gradient(135deg,#6d28d9,#1d4ed8));
}
.s14-card::after {
  content:"";
  position:absolute;
  inset:18px;
  z-index:1;
  border:1px solid rgba(255,255,255,.18);
  border-radius:22px;
  pointer-events:none;
}
.s14-card-media {
  position:absolute;
  inset:0;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:4rem;
  color:rgba(255,255,255,.22);
  letter-spacing:.28em;
  text-transform:uppercase;
}
.s14-card-media::after {
  content:"Imagen del evento";
  margin-left:1rem;
  font-family:'Barlow Condensed',sans-serif;
  font-size:.9rem;
  font-weight:800;
  letter-spacing:.32em;
  color:rgba(255,255,255,.24);
}
.s14-card-copy {
  position:absolute;
  left:clamp(1.4rem,4vw,3rem);
  right:clamp(1.4rem,4vw,3rem);
  bottom:clamp(1.5rem,4vw,3.2rem);
  z-index:3;
}
.s14-card-label {
  display:block;
  margin-bottom:.65rem;
  font-family:'Barlow Condensed',sans-serif;
  font-size:.9rem;
  font-weight:800;
  letter-spacing:.38em;
  text-transform:uppercase;
  color:#e879f9;
}
.s14-card h3 {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(4rem,8vw,8.3rem);
  line-height:.84;
  letter-spacing:.045em;
  text-transform:uppercase;
  color:#fff;
  text-shadow:0 18px 36px rgba(0,0,0,.42);
  max-width:680px;
}
.s14-card-gala { --s14-bg:linear-gradient(135deg,rgba(248,113,113,.55),rgba(91,33,182,.92)), url('../images/cumple.jpg') center/cover; }
.s14-card-conferencias { --s14-bg:linear-gradient(135deg,rgba(37,99,235,.65),rgba(30,10,70,.94)), url('../images/oficina.jpeg') center/cover; }
.s14-card-escenarios { --s14-bg:linear-gradient(135deg,rgba(14,165,233,.58),rgba(91,33,182,.94)); }
.s14-card-ejecutivas { --s14-bg:linear-gradient(135deg,rgba(168,85,247,.62),rgba(24,10,58,.96)); }
.s14-card-cobertura { --s14-bg:linear-gradient(135deg,rgba(34,197,94,.44),rgba(30,64,175,.88)), url('../images/baile.jpeg') center/cover; }
.s14-card-podio { --s14-bg:linear-gradient(135deg,rgba(249,115,22,.5),rgba(88,28,135,.92)); }
.s14-nav {
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:6;
  width:48px;
  height:48px;
  border:1px solid rgba(255,255,255,.25);
  border-radius:999px;
  background:rgba(14,6,32,.62);
  backdrop-filter:blur(10px);
  color:#fff;
  font-size:2.2rem;
  line-height:1;
  cursor:pointer;
  transition:transform .2s ease, background .2s ease;
}
.s14-nav:hover {
  transform:translateY(-50%) scale(1.06);
  background:rgba(232,121,249,.38);
}
.s14-prev { left:.7rem; }
.s14-next { right:.7rem; }
.s14-carousel-dots {
  display:flex;
  justify-content:center;
  gap:.55rem;
  margin-top:.1rem;
}
.s14-carousel-dots button {
  width:8px;
  height:8px;
  border-radius:999px;
  border:0;
  background:rgba(255,255,255,.25);
  cursor:pointer;
  padding:0;
  transition:width .25s ease, background .25s ease;
}
.s14-carousel-dots button.active {
  width:28px;
  background:#e879f9;
}
@media (max-width: 900px) {
  .s14-wrap { padding:2.5rem 1rem; }
  .s14-track { padding-left:2.9rem; padding-right:2.9rem; scroll-padding:0 2.9rem; }
  .s14-card { flex-basis:82vw; min-height:360px; border-radius:22px; }
  .s14-nav { width:40px; height:40px; font-size:1.8rem; }
}
@media (max-width: 560px) {
  .s14-title { font-size:2rem; }
  .s14-kicker { letter-spacing:.24em; }
  .s14-card { flex-basis:86vw; min-height:330px; }
  .s14-card-media { font-size:2.6rem; }
  .s14-card-media::after { display:none; }
  .s14-card h3 { font-size:3.3rem; }
  .s14-card-label { letter-spacing:.24em; font-size:.78rem; }
}

/* ═══════════════════════════════════════════
   SLIDE 15 — TECNOLOGÍA + EXPERIENCIAS
══════════════════════════════════════════════ */
#s15 { background:linear-gradient(135deg,#3b0764,#1e1b4b,#1a3fa0); }
.s15-wrap {
  width:100%; max-width:1400px; margin:0 auto; padding:3rem;
  display:grid; grid-template-columns:1fr 1fr 1fr; gap:2rem; align-items:center;
}
.s15-title {
  font-family:'Bebas Neue',sans-serif; font-size:clamp(2.5rem,5vw,4rem);
  line-height:1; letter-spacing:.04em;
}
.s15-title .tec { color:#a78bfa; }
.s15-title .plus { color:#e879f9; font-size:1.5em; }
.s15-title .exp { color:#fff; }
.s15-body { margin-top:1rem; font-size:.78rem; color:rgba(255,255,255,.6); line-height:1.7; }
.s15-vr-device {
  display:flex; align-items:center; justify-content:center;
  font-size:8rem;
}
.s15-photo { aspect-ratio:4/3; border-radius:12px; }
.s15-photo .photo { border-radius:12px; height:100%; border:none; }

/* ═══════════════════════════════════════════
   SLIDE 16 — MEDIOS & CONTENIDO DIGITAL
══════════════════════════════════════════════ */
#s16 { background:linear-gradient(135deg,#3b0764,#1e1b4b); }
.s16-wrap {
  width:100%; max-width:1400px; margin:0 auto; padding:3rem;
  display:flex; align-items:center; justify-content:space-between;
}
.s16-medios {
  font-family:'Bebas Neue',sans-serif; font-size:clamp(5rem,12vw,10rem); line-height:.9;
  background:linear-gradient(90deg,#a3e635,#84cc16); -webkit-background-clip:text;
  -webkit-text-fill-color:transparent; background-clip:text;
}
.s16-amp { color:rgba(255,255,255,.4); font-family:'Bebas Neue',sans-serif; font-size:4rem; }
.s16-sub {
  font-family:'Bebas Neue',sans-serif; font-size:clamp(2rem,4.5vw,3.5rem); letter-spacing:.05em;
}
.s16-contenido { color:#fb923c; }
.s16-digital { color:rgba(255,255,255,.2); -webkit-text-stroke:1px rgba(255,255,255,.4); }
.s16-confetti { font-size:2.5rem; display:flex; flex-direction:column; gap:.5rem; }

/* ═══════════════════════════════════════════
   SLIDE 17 — CONTENIDO DIGITAL (vertical)
══════════════════════════════════════════════ */
#s17 { background:linear-gradient(90deg,#1e1b4b 0%,#7c3aed 40%,#7c3aed 60%,#1e1b4b 100%); }
.s17-wrap {
  width:100%; height:100vh; display:flex; align-items:stretch;
}
.s17-left {
  flex:0 0 25%; background:linear-gradient(180deg,#a3e635,#84cc16);
  display:flex; align-items:center; justify-content:center;
}
.s17-left-text {
  font-family:'Bebas Neue',sans-serif; font-size:4rem; letter-spacing:.1em;
  color:#1a0a3a; writing-mode:vertical-rl; transform:rotate(180deg);
}
.s17-center {
  flex:1;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));
  display:flex; align-items:center; justify-content:center;
  border-left:2px solid rgba(255,255,255,.1);
  border-right:2px solid rgba(255,255,255,.1);
}
.s17-center-placeholder { text-align:center; color:rgba(255,255,255,.2); font-size:.8rem; font-style:italic; }
.s17-right {
  flex:0 0 25%; background:linear-gradient(180deg,#a3e635,#84cc16);
  display:flex; align-items:center; justify-content:center;
}
.s17-right-text {
  font-family:'Bebas Neue',sans-serif; font-size:4rem; letter-spacing:.1em;
  color:#1a0a3a; writing-mode:vertical-rl;
}

/* ═══════════════════════════════════════════
   SLIDE 18 — ¿DÓNDE SE VE TODO ESTO?
══════════════════════════════════════════════ */
#s18 { background:linear-gradient(90deg,#fff 50%,#1a3fa0 100%); }
.s18-wrap {
  width:100%; max-width:1400px; margin:0 auto; padding:3rem;
  display:flex; align-items:center; gap:4rem;
}
.s18-text { flex:1; }
.s18-sub { font-family:'Barlow Condensed',sans-serif; font-size:.8rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:#9333ea; margin-bottom:.5rem; }
.s18-title {
  font-family:'Barlow Condensed',sans-serif; font-size:clamp(2.5rem,5vw,4.5rem);
  font-weight:900; text-transform:uppercase; letter-spacing:.04em; line-height:1.1; color:#1a0a3a;
}
.s18-title em { color:#9333ea; font-style:normal; }
.s18-logo-area {
  flex:0 0 45%; display:flex; align-items:center; justify-content:center;
  flex-direction:column; gap:1rem;
}
.s18-kisscale {
  display:flex; align-items:center; gap:1rem;
}
.s18-k-arrows { font-size:4rem; color:#3b82f6; }
.s18-k-text {
  font-family:'Bebas Neue',sans-serif; font-size:2.5rem; color:#fff; letter-spacing:.08em;
}

/* ═══════════════════════════════════════════
   SLIDE 19 — RICH MEDIA
══════════════════════════════════════════════ */
#s19 { background:linear-gradient(135deg,#1e1b4b 0%,#7c3aed 40%,#1e40af 100%); }
.s19-wrap {
  width:100%; max-width:1400px; margin:0 auto; padding:3rem;
  display:flex; align-items:center; gap:3rem;
}
.s19-text { flex:0 0 240px; }
.s19-title {
  font-family:'Bebas Neue',sans-serif; font-size:clamp(4rem,8vw,7rem); line-height:.9;
  background:linear-gradient(135deg,#fbbf24,#f97316,#ef4444);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.s19-sub {
  font-family:'Bebas Neue',sans-serif; font-size:2rem; color:rgba(255,255,255,.6); letter-spacing:.1em;
}
.s19-phones { flex:1; display:flex; gap:1.5rem; justify-content:center; align-items:flex-end; }
.s19-phone {
  flex:1; max-width:160px;
  background:#0a0a0a; border-radius:24px; padding:8px;
  box-shadow:0 20px 50px rgba(0,0,0,.5);
}
.s19-phone:nth-child(1) { transform:translateY(20px); }
.s19-phone:nth-child(2) { transform:translateY(0); }
.s19-phone:nth-child(3) { transform:translateY(10px); }
.s19-phone-inner { border-radius:18px; overflow:hidden; aspect-ratio:9/16; }
.s19-phone-inner .photo { height:100%; border:none; border-radius:18px; font-size:.6rem; }

/* ═══════════════════════════════════════════
   SLIDE 20 — RRSS
══════════════════════════════════════════════ */
#s20 { background:linear-gradient(135deg,#3b0764,#1e1b4b); }
.s20-wrap {
  width:100%; max-width:1400px; margin:0 auto; padding:3rem;
  display:grid; grid-template-columns:1.2fr 1fr; gap:3rem; align-items:center;
}
.s20-collage {
  display:grid; grid-template-columns:repeat(3,1fr); gap:.4rem;
  transform:rotate(-2deg);
}
.s20-col-photo { aspect-ratio:3/4; border-radius:6px; }
.s20-col-photo .photo { height:100%; border-radius:6px; border:none; font-size:.55rem; }
.s20-title {
  font-family:'Bebas Neue',sans-serif; font-size:clamp(4rem,8vw,7rem);
  color:#fff; letter-spacing:.08em; line-height:.9;
}
.s20-icons { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.2rem; }
.s20-icon {
  width:44px; height:44px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.4rem; color:#fff;
}
.s20-icon.tiktok { background:#000; }
.s20-icon.ig { background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); }
.s20-icon.yt { background:#ff0000; }
.s20-icon.fb { background:#1877f2; }
.s20-icon.wa { background:#25d366; }
.s20-icon.tw { background:#1da1f2; }
.s20-icon.li { background:#0077b5; }
.s20-list { margin-top:1rem; display:flex; flex-direction:column; gap:.4rem; }
.s20-list-item {
  font-family:'Barlow Condensed',sans-serif; font-size:.9rem; font-weight:600;
  color:rgba(255,255,255,.7); letter-spacing:.05em;
}
.s20-list-item::before { content:'•'; color:#e879f9; margin-right:.5rem; }

/* ═══════════════════════════════════════════
   SLIDE 21 — ATL
══════════════════════════════════════════════ */
#s21 { background:linear-gradient(135deg,#2d1b6e,#1a0a3a); }
.s21-wrap { width:100%; max-width:1400px; margin:0 auto; padding:2.5rem 3rem; }
.s21-top { display:flex; align-items:flex-start; gap:2rem; margin-bottom:1.5rem; }
.s21-atl {
  font-family:'Bebas Neue',sans-serif; font-size:clamp(4rem,9vw,8rem);
  color:#fff; letter-spacing:.05em; line-height:.9; flex-shrink:0;
}
.s21-desc-title { font-size:.85rem; color:rgba(255,255,255,.75); line-height:1.6; }
.s21-strip {
  font-family:'Barlow Condensed',sans-serif; font-size:.8rem; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.5);
  margin:1rem 0; border-top:1px solid rgba(255,255,255,.15); padding-top:.8rem;
}
.s21-photos { display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; }
.s21-photo { aspect-ratio:16/9; border-radius:8px; }
.s21-photo .photo { height:100%; border-radius:8px; border:none; }

/* ═══════════════════════════════════════════
   SLIDE 22 — SERVICIOS ESPECIALIZADOS
══════════════════════════════════════════════ */
#s22 { background:linear-gradient(135deg,#3b0764,#1e1b4b,#1e40af); }
.s22-wrap {
  width:100%; max-width:1400px; margin:0 auto; padding:3rem;
  display:flex; align-items:center; justify-content:space-between;
}
.s22-servicios {
  font-family:'Bebas Neue',sans-serif; font-size:clamp(5rem,10vw,9rem); line-height:.9;
  background:linear-gradient(90deg,#67e8f9,#a78bfa,#e879f9);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.s22-esp {
  font-family:'Bebas Neue',sans-serif; font-size:clamp(2.5rem,5vw,4.5rem);
  background:linear-gradient(90deg,#fbbf24,#fb923c);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  letter-spacing:.05em;
}
.s22-confetti { font-size:3rem; display:flex; flex-direction:column; gap:.6rem; }

/* ═══════════════════════════════════════════
   SLIDE 23 — INTEGRAMOS TECNOLOGÍA INTELIGENTE
══════════════════════════════════════════════ */
#s23 { background:linear-gradient(135deg,#2d1b6e,#3b0764); }
.s23-wrap {
  width:100%; max-width:1400px; margin:0 auto; padding:3rem;
  display:flex; align-items:center; gap:4rem;
}
.s23-text { flex:1; }
.s23-title {
  font-family:'Barlow Condensed',sans-serif; font-size:clamp(2rem,4.5vw,3.8rem);
  font-weight:900; text-transform:uppercase; letter-spacing:.05em; line-height:1.15;
  color:#fff;
}
.s23-robot { flex:0 0 40%; display:flex; align-items:center; justify-content:center; font-size:10rem; }

/* ═══════════════════════════════════════════
   SLIDE 24 — IA + FOTOS DETALLE
══════════════════════════════════════════════ */
#s24 { background:linear-gradient(135deg,#1e1b4b,#2d1b6e); }
.s24-wrap { width:100%; max-width:1400px; margin:0 auto; padding:2rem 3rem; }
.s24-top {
  display:grid; grid-template-columns:1fr 1fr; gap:2rem; margin-bottom:1.5rem; align-items:start;
}
.s24-photo-man { aspect-ratio:4/3; border-radius:10px; }
.s24-photo-man .photo { height:100%; border-radius:10px; border:none; }
.s24-lead { font-size:.82rem; color:rgba(255,255,255,.7); line-height:1.7; margin-bottom:1rem; }
.s24-list { display:flex; flex-direction:column; gap:.5rem; }
.s24-li {
  font-family:'Barlow Condensed',sans-serif; font-size:.95rem; font-weight:600;
  color:rgba(255,255,255,.8); display:flex; gap:.6rem; align-items:baseline;
}
.s24-li::before { content:'•'; color:#a78bfa; flex-shrink:0; }
.s24-dashboards { display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; }
.s24-dash { aspect-ratio:16/9; border-radius:8px; }
.s24-dash .photo { height:100%; border-radius:8px; border:none; font-size:.6rem; }

/* ═══════════════════════════════════════════
   SLIDE 25 — TODAS LAS SOLUCIONES. UNA AGENCIA.
══════════════════════════════════════════════ */
#s25 { background:#fff; overflow:hidden; }
.s25-wrap { width:100%; padding:3rem 0; display:flex; flex-direction:column; gap:.4rem; }
.s25-row { display:flex; white-space:nowrap; overflow:hidden; }
.s25-inner { display:flex; animation:marquee-left 14s linear infinite; }
.s25-inner.rev { animation-direction:reverse; animation-duration:18s; }
.s25-word-a { font-family:'Bebas Neue',sans-serif; font-size:clamp(4rem,8vw,7rem); padding:0 .2rem; color:#1a0a3a; }
.s25-word-b { font-family:'Bebas Neue',sans-serif; font-size:clamp(4rem,8vw,7rem); padding:0 .2rem; -webkit-text-stroke:2px #5b21b6; color:transparent; }
.s25-word-c { font-family:'Bebas Neue',sans-serif; font-size:clamp(4rem,8vw,7rem); padding:0 .2rem; color:#3b1a7a; }

/* ═══════════════════════════════════════════
   SLIDE 26 — GRACIAS
══════════════════════════════════════════════ */
#s26 { background:linear-gradient(135deg,#2d1b6e 0%,#1a3fa0 60%,#1e1b4b 100%); }
.s26-wrap {
  width:100%; max-width:1000px; margin:0 auto; padding:3rem;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; min-height:100vh; gap:2rem;
}
.s26-gracias {
  font-family:'Bebas Neue',sans-serif; font-size:clamp(4rem,9vw,7rem);
  color:#fff; letter-spacing:.06em; line-height:1;
}
.s26-q {
  font-family:'Bebas Neue',sans-serif; font-size:8rem; line-height:1;
  background:linear-gradient(135deg,#e879f9,#f59e0b,#a3e635,#22d3ee);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  animation:spin-glow 4s ease-in-out infinite;
}
@keyframes spin-glow {
  0%,100% { filter:drop-shadow(0 0 20px rgba(232,121,249,.6)); }
  50% { filter:drop-shadow(0 0 40px rgba(34,211,238,.6)); }
}
.s26-brand { font-family:'Bebas Neue',sans-serif; font-size:1.8rem; letter-spacing:.2em; color:rgba(255,255,255,.6); }
.s26-contact { font-size:.85rem; color:rgba(255,255,255,.5); line-height:2; letter-spacing:.04em; }
.s26-contact a { color:rgba(255,255,255,.7); text-decoration:none; }

/* ═══════════════════════════════════════════
   SLIDE 28 — MEDIAKIT AUTOMOTRIZ
══════════════════════════════════════════════ */
#s28 { background:linear-gradient(135deg,#1a0a3a,#0f0830); }
.s28-wrap {
  width:100%; max-width:1400px; margin:0 auto; padding:3rem;
  display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center;
}
.s28-kit { font-family:'Barlow Condensed',sans-serif; font-size:.8rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:#e879f9; margin-bottom:.5rem; }
.s28-titulo {
  font-family:'Bebas Neue',sans-serif; font-size:clamp(3rem,6vw,5rem);
  color:#fff; letter-spacing:.06em; line-height:1;
}
.s28-rubro { font-family:'Bebas Neue',sans-serif; font-size:1.8rem; color:#94a3b8; letter-spacing:.1em; }
.s28-q-logo { font-family:'Bebas Neue',sans-serif; font-size:2rem; color:rgba(255,255,255,.3); letter-spacing:.1em; margin-top:2rem; }
.s28-photo { aspect-ratio:16/9; border-radius:12px; }
.s28-photo .photo { height:100%; border-radius:12px; border:none; }

/* ── FOOTER ── */
footer {
  padding:3rem 2rem; background:#050010;
  border-top:1px solid rgba(192,38,211,.2); text-align:center;
}
.footer-logo { font-family:'Bebas Neue',sans-serif; font-size:2rem; letter-spacing:.15em; color:#e879f9; }
.footer-info { font-size:.75rem; color:rgba(255,255,255,.3); line-height:2; margin-top:.5rem; }

/* ═══ SLIDE 01 — PORTADA Q LOGO ═══ */
#s01 {
  background: #1e0b4b;
  position: relative;
  overflow: hidden;
}
#s01::before { display: none; }
#s01 { overflow: visible !important; }
#s01b { overflow: visible !important; }
#s01b .parallax-orb { clip-path: inset(0); }
#s01::after {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 60% 60% at 50% 50%, rgba(60,20,120,.3) 0%, transparent 70%);
  pointer-events: none;
}

.s00-wrap {
  width: 100%; height: 100vh;
  display: flex; align-items: center; justify-content: center;
  position: relative; z-index: 2;
}
.s00-logo {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  position: relative; z-index: 3;
  gap: 0;
}
.s00-q-img {
  width: clamp(220px, 26vw, 360px);
  height: auto;
  filter: drop-shadow(0 10px 40px rgba(232,121,249,.35));
  animation: logo-float 5s ease-in-out infinite;
  transform-origin: center center;
}
@keyframes logo-float {
  0%, 100% { transform: translateY(0) scale(1); }
  50%       { transform: translateY(-10px) scale(1.01); }
}
.s00-brand {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(1.6rem, 3.5vw, 2.8rem);
  letter-spacing: .55em;
  color: #fff;
  text-align: center;
  margin-top: .2rem;
  margin-left: .55em;
}
.s00-booom {
  position: absolute;
  top: -26%;
  right: -48%;
  left: auto;
  right: auto;
  background: #f5e642;
  color: #1a0a3a;
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(1.35rem, 2.2vw, 2rem);
  letter-spacing: .18em;
  padding: .4rem 1.2rem;
  border-radius: 4px;
  transform: rotate(10deg);
  box-shadow: 3px 4px 0 rgba(0,0,0,.5);
  z-index: 3;
  animation: booom-pulse 2s ease-in-out infinite;
}
@keyframes booom-pulse {
  0%, 100% { transform: rotate(10deg) scale(1); }
  50%       { transform: rotate(10deg) scale(1.12); box-shadow: 4px 6px 20px rgba(245,230,66,.5); }
}

/* ── CONFETTI ── */
.s00-confetti {
  position: absolute; inset: 0;
  pointer-events: none; z-index: 3;
}
.cc {
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
}
.cc.exploded { opacity: 1; animation: piece-float 5s ease-in-out infinite; }
.cc-shape { display: block; filter: drop-shadow(0 2px 0 rgba(0,0,0,.8)); }

.p1  { --tx: -38vw; --ty: -28vh; --r:  0deg; animation-delay: 0s;    animation-duration: 7s; }
.p2  { --tx: -15vw; --ty: -35vh; --r: 15deg; animation-delay: .2s;   animation-duration: 8s; }
.p3  { --tx:  20vw; --ty: -32vh; --r: -5deg; animation-delay: .1s;   animation-duration: 6s; }
.p4  { --tx:  38vw; --ty: -22vh; --r: 20deg; animation-delay: .35s;  animation-duration: 9s; }
.p5  { --tx:  42vw; --ty:   5vh; --r: -8deg; animation-delay: .15s;  animation-duration: 7s; }
.p6  { --tx:  36vw; --ty:  28vh; --r: 12deg; animation-delay: .4s;   animation-duration: 8s; }
.p7  { --tx:  18vw; --ty:  38vh; --r: -3deg; animation-delay: .25s;  animation-duration: 6s; }
.p8  { --tx: -10vw; --ty:  42vh; --r: 18deg; animation-delay: .3s;   animation-duration: 7s; }
.p9  { --tx: -30vw; --ty:  35vh; --r: -10deg;animation-delay: .05s;  animation-duration: 9s; }
.p10 { --tx: -42vw; --ty:  10vh; --r:  5deg; animation-delay: .45s;  animation-duration: 8s; }
.p11 { --tx: -40vw; --ty: -12vh; --r: -15deg;animation-delay: .18s;  animation-duration: 7s; }
.p12 { --tx:  8vw;  --ty: -40vh; --r:  8deg; animation-delay: .38s;  animation-duration: 6s; }
.p13 { --tx: -22vw; --ty:  15vh; --r: -20deg;animation-delay: .22s;  animation-duration: 8s; }
.p14 { --tx:  28vw; --ty:  15vh; --r:  3deg; animation-delay: .12s;  animation-duration: 7s; }
.p15 { --tx: -5vw;  --ty:  45vh; --r: -5deg; animation-delay: .42s;  animation-duration: 9s; }
.p16 { --tx:  45vw; --ty: -10vh; --r: 25deg; animation-delay: .08s;  animation-duration: 6s; }

@keyframes piece-float {
  0%, 100% { transform: translate(var(--tx), var(--ty)) rotate(var(--r)) translateY(0); }
  40%       { transform: translate(var(--tx), var(--ty)) rotate(var(--r)) translateY(-10px); }
  70%       { transform: translate(var(--tx), var(--ty)) rotate(var(--r)) translateY(5px); }
}
@keyframes piece-explode {
  0%   { transform: translate(-50%,-50%) scale(0) rotate(0deg); opacity: 0; }
  60%  { opacity: 1; }
  100% { transform: translate(var(--tx), var(--ty)) scale(1) rotate(var(--r)); opacity: 1; }
}
.cc.explode-anim {
  animation: piece-explode .7s cubic-bezier(.17,.67,.4,1.4) forwards,
             piece-float 5s ease-in-out calc(.7s + var(--ad, 0s)) infinite;
}

/* ── PARALLAX ── */
.parallax-bg, .parallax-item { will-change: transform; transition: transform .08s linear; }
.slide { overflow: hidden; }
.parallax-orb {
  position: absolute; border-radius: 50%;
  pointer-events: none; opacity: .35; filter: blur(30px); z-index: 0;
}
.orb-purple { width:360px; height:360px; background:#c026d3; }
.orb-cyan   { width:280px; height:280px; background:#22d3ee; }
.orb-yellow { width:220px; height:220px; background:#fbbf24; }
.slide > *:not(.parallax-orb):not(canvas) { position: relative; z-index: 2; }

/* ── SCROLL STACK ── */
.scroll-stack { position: relative; }
.scroll-stack .stack-sticky { position: sticky; top: 64px; z-index: 1; }
.scroll-stack .stack-slide-up {
  position: relative; z-index: 2; margin-top: 0;
  border-radius: 24px 24px 0 0;
  box-shadow: 0 -20px 60px rgba(0,0,0,0.5);
}

/* ── CHEVRON ── */
#global-chevron {
  position: fixed; bottom: 2rem; left: 50%; transform: translateX(-50%);
  z-index: 9000; display: flex; flex-direction: column; align-items: center;
  cursor: pointer; opacity: 0; transition: opacity .4s ease; pointer-events: none;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,.7));
}
#global-chevron.visible { opacity: 0.8; pointer-events: all; }
#global-chevron:hover { opacity: 1; }
#global-chevron svg { width: 38px; height: 24px; display: block; animation: chev-bounce 1.6s ease-in-out infinite; }
#global-chevron svg:last-child { animation-delay: .22s; margin-top: -10px; }
@keyframes chev-bounce {
  0%, 100% { transform: translateY(0); opacity: .4; }
  45%       { transform: translateY(7px); opacity: 1; }
}

/* ==========================================
   FIX DEFINITIVO — S04 con bleed entre slides
   Los círculos siguen siendo el BG de Films & Multimedia,
   pero se derraman sobre el slide anterior y el siguiente.
========================================== */

#s03,
#s04,
#s06,
.scroll-stack {
  overflow: visible !important;
}

#s03,
#s06 {
  position: relative;
  z-index: 1;
}

#s04 {
  position: relative;
  z-index: 3;
  overflow: visible !important;
  isolation: isolate;
  background: #f3f3f3;
}

#s04 > .s04-bg {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: -120px !important;
  bottom: -340px !important;
  z-index: 0 !important;
  pointer-events: none !important;
  overflow: visible !important;
  background: transparent !important;
}

#s04 > .s04-bg::before {
  content: "";
  position: absolute;
  width: 1120px;
  height: 1120px;
  right: -540px;
  top: 95px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    #3b1a7a 0 43%,
    transparent 43% 49%,
    #3b1a7a 49% 57%,
    transparent 57% 63%,
    #3b1a7a 63% 100%
  );
  animation: s04-rings-float 9s ease-in-out infinite;
  opacity: 0.98;
  will-change: transform;
}

@keyframes s04-rings-float {
  0%, 100% {
    transform: translate3d(0, 0, 0) scale(1) rotate(0deg);
  }
  25% {
    transform: translate3d(-10px, 18px, 0) scale(1.01) rotate(-0.8deg);
  }
  50% {
    transform: translate3d(0, 34px, 0) scale(1.025) rotate(-1.2deg);
  }
  75% {
    transform: translate3d(12px, 16px, 0) scale(1.01) rotate(-0.4deg);
  }
}

#s04 .s04-wrap {
  position: relative !important;
  z-index: 2 !important;
}

#s04 .s04-text {
  position: relative !important;
  z-index: 4 !important;
}

#s04 .s04-clap {
  position: absolute !important;
  z-index: 5 !important;
}

#s04 .s04-browser-wrap {
  position: relative !important;
  z-index: 3 !important;
}

#s04 .s04-browser {
  position: relative !important;
  z-index: 3 !important;
}

#s04 .s04-sticker {
  position: absolute !important;
  z-index: 6 !important;
}

@media (max-width: 1200px) {
  #s04 > .s04-bg {
    top: -90px !important;
    bottom: -260px !important;
  }

  #s04 > .s04-bg::before {
    width: 960px;
    height: 960px;
    right: -520px;
    top: 95px;
  }
}

@media (max-width: 900px) {
  #s04 > .s04-bg {
    top: -40px !important;
    bottom: -180px !important;
  }

  #s04 > .s04-bg::before {
    width: 780px;
    height: 780px;
    right: -465px;
    top: 145px;
  }
}


/* ==========================================
   AJUSTE FINAL — Slide 04 piezas intro + scroll
========================================== */

#s04 .s04-tag {
  font-size: clamp(1.05rem, 1.45vw, 1.5rem) !important;
  letter-spacing: .42em !important;
  line-height: 1 !important;
  margin-bottom: .75rem !important;
}

#s04 .s04-browser {
  transform-origin: center center;
  will-change: transform, opacity;
}

#s04 .s04-intro-pieces {
  position: absolute;
  inset: -95px -60px -95px -80px;
  z-index: 6;
  pointer-events: none;
}

#s04 .s04-sticker {
  display: none !important;
}

#s04 .s04-piece {
  position: absolute;
  filter: drop-shadow(0 2px 0 rgba(0,0,0,.78));
  animation: s04-piece-float 5.6s ease-in-out infinite;
  will-change: transform;
}

#s04 .s04-booom {
  position: absolute;
  top: -40px;
  right: 110px;
  z-index: 8;
  background: #f5e642;
  color: #1a0a3a;
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(1.7rem, 2.2vw, 2.35rem);
  line-height: 1;
  letter-spacing: .18em;
  padding: .42rem 1.05rem .35rem;
  border: 4px solid #111;
  border-radius: 4px;
  box-shadow: 4px 5px 0 rgba(0,0,0,.65);
  transform: rotate(10deg);
  animation: s04-booom-pulse 2.3s ease-in-out infinite;
}

#s04 .s04-triangle-a { left: -44px; bottom: 108px; animation-delay: .15s; }
#s04 .s04-triangle-b { right: 260px; top: -38px; animation-delay: .35s; }
#s04 .s04-lightning { right: -10px; bottom: 44px; animation-delay: .55s; }
#s04 .s04-circle { left: 45%; bottom: -38px; animation-delay: .22s; }
#s04 .s04-rect { left: 38%; top: 46px; animation-delay: .48s; }
#s04 .s04-squiggle { left: 54%; top: -31px; animation-delay: .1s; }

@keyframes s04-piece-float {
  0%, 100% { transform: translateY(0) rotate(var(--r, 0deg)); }
  42% { transform: translateY(-14px) rotate(var(--r, 0deg)); }
  70% { transform: translateY(6px) rotate(var(--r, 0deg)); }
}

@keyframes s04-booom-pulse {
  0%, 100% {
    transform: rotate(10deg) scale(1);
    box-shadow: 4px 5px 0 rgba(0,0,0,.65);
  }
  50% {
    transform: rotate(10deg) scale(1.1);
    box-shadow: 5px 7px 18px rgba(245,230,66,.45);
  }
}

@media (max-width: 900px) {
  #s04 .s04-tag {
    font-size: 1rem !important;
    letter-spacing: .32em !important;
  }

  #s04 .s04-booom {
    right: 40px;
    top: -24px;
  }
}


/* ==========================================
   AJUSTE — círculos morados más pequeños + sin BOOOM en Films
========================================== */
#s04 > .s04-bg::before {
  width: 1120px !important;
  height: 1120px !important;
  right: -540px !important;
  top: 95px !important;
  background: radial-gradient(
    circle,
    #3b1a7a 0 43%,
    transparent 43% 49%,
    #3b1a7a 49% 57%,
    transparent 57% 63%,
    #3b1a7a 63% 100%
  ) !important;
}

#s04 .s04-booom {
  display: none !important;
}

@media (max-width: 1200px) {
  #s04 > .s04-bg::before {
    width: 960px !important;
    height: 960px !important;
    right: -520px !important;
    top: 95px !important;
  }
}

@media (max-width: 900px) {
  #s04 > .s04-bg::before {
    width: 780px !important;
    height: 780px !important;
    right: -465px !important;
    top: 145px !important;
  }
}

.cls-1 {
        fill: #434455;
      }

      .cls-2 {
        fill: #ebeaeb;
      }

      .cls-3 {
        fill: #575766;
      }

      .cls-4 {
        fill: #dfdedf;
      }

      .cls-5 {
        fill: #2d2f43;
      }

      .cls-6 {
        fill: #17182b;
      }

      .cls-7 {
        fill: #393b4e;
      }

      .cls-8 {
        fill: #6a6875;
      }

      .cls-9 {
        fill: #4a4a5b;
      }

      .cls-10 {
        fill: #202337;
      }

      .cls-11 {
        fill: #e7e6e7;
      }

      .cls-12 {
        fill: #a8e3f8;
      }

      .cls-13 {
        fill: #b0afb5;
      }

      .cls-14 {
        fill: #7d7c87;
      }

      .cls-15 {
        fill: #3d3f51;
      }

      .cls-16 {
        fill: #34374a;
      }
      /* AJUSTE FINAL — subir círculos de fondo del slide Films */
#s04 > .s04-bg::before {
  top: -100px !important;
}


/* ==========================================
   EXTRACTED INLINE STYLES FROM index.html
   These classes preserve former inline style attributes.
========================================== */

.qsa-inline-001 {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.qsa-inline-002 {
  --tx: -40vw !important;
  --ty: -12vh !important;
}

.qsa-inline-003 {
  --tx: 18vw !important;
  --ty: 38vh !important;
}

.qsa-inline-004 {
  min-height: 82vh !important;
  align-items: flex-start !important;
  padding-top: 80px !important;
  background: linear-gradient(180deg, #1e0b4b 0%, #0e0620 40%, #0e0620 100%) !important;
}

.qsa-inline-005 {
  width: 100% !important;
  height: 155% !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  display: block !important;
  margin-top: -5% !important;
}

.qsa-inline-006 {
  height: 100% !important;
  border-radius: 8px !important;
  border: none !important;
  font-size: .5rem !important;
}

.qsa-inline-007 {
  height: 100% !important;
  border-radius: 8px !important;
  border: none !important;
  font-size: .5rem !important;
}

.qsa-inline-008 {
  height: 100% !important;
  border-radius: 8px !important;
  border: none !important;
  font-size: .5rem !important;
}

.qsa-inline-009 {
  height: 100% !important;
  border-radius: 8px !important;
  border: none !important;
  font-size: .5rem !important;
}

.qsa-inline-010 {
  padding-top: 64px !important;
}

.qsa-inline-011 {
  background: #1e0e40 !important;
}

.qsa-inline-012 {
  --r: -16deg !important;
}

.qsa-inline-013 {
  --r: 18deg !important;
}

.qsa-inline-014 {
  --r: 13deg !important;
}

.qsa-inline-015 {
  --r: 24deg !important;
}

.qsa-inline-016 {
  padding-top: 64px !important;
}

.qsa-inline-017 {
  position: relative !important;
  width: 400px !important;
  height: 400px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.qsa-inline-018 {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(135deg,#1a3fa0,#7c3aed,#3b0764) !important;
  border-radius: 50% !important;
  opacity: .25 !important;
}

.qsa-inline-019 {
  font-family: 'Bebas Neue',sans-serif !important;
  font-size: 18rem !important;
  color: rgba(255,255,255,.07) !important;
  line-height: 1 !important;
  position: absolute !important;
}

.qsa-inline-020 {
  width: 200px !important;
  height: 200px !important;
  border-radius: 50% !important;
  border: 8px solid rgba(255,255,255,.85) !important;
  z-index: 1 !important;
}

.qsa-inline-021 {
  height: 100% !important;
  border-radius: 14px !important;
  border: none !important;
  font-size: .5rem !important;
  background: linear-gradient(135deg,#16a34a,#15803d) !important;
}

.qsa-inline-022 {
  height: 100% !important;
  border-radius: 14px !important;
  border: none !important;
  font-size: .5rem !important;
  background: linear-gradient(135deg,#1d4ed8,#1e40af) !important;
}

.qsa-inline-023 {
  height: 100% !important;
  border-radius: 14px !important;
  border: none !important;
  font-size: .5rem !important;
  background: linear-gradient(135deg,#7c3aed,#6d28d9) !important;
}

.qsa-inline-024 {
  height: 100% !important;
  border-radius: 14px !important;
  border: none !important;
  font-size: .5rem !important;
  background: linear-gradient(135deg,#ea580c,#dc2626) !important;
}

.qsa-inline-025 {
  color: #f472b6 !important;
}

.qsa-inline-026 {
  color: #a3e635 !important;
}

.qsa-inline-027 {
  color: #fbbf24 !important;
}

.qsa-inline-028 {
  color: #f472b6 !important;
}

.qsa-inline-029 {
  color: #a3e635 !important;
}

.qsa-inline-030 {
  height: 100% !important;
  border-radius: 12px !important;
  border: none !important;
}

.qsa-inline-031 {
  color: #f472b6 !important;
}

.qsa-inline-032 {
  color: #a3e635 !important;
}

.qsa-inline-033 {
  color: #fbbf24 !important;
}

.qsa-inline-034 {
  color: #f472b6 !important;
}

.qsa-inline-035 {
  color: #a3e635 !important;
}

.qsa-inline-036 {
  padding-top: 0 !important;
}

.qsa-inline-037 {
  font-family: 'Bebas Neue',sans-serif !important;
  font-size: 1rem !important;
  color: rgba(255,255,255,.5) !important;
  letter-spacing: .2em !important;
}

.qsa-inline-038 {
  font-family: 'Bebas Neue',sans-serif !important;
  font-size: .9rem !important;
  color: rgba(255,255,255,.35) !important;
  letter-spacing: .1em !important;
  border-top: 1px solid rgba(255,255,255,.2) !important;
  padding-top: .3rem !important;
  margin-top: .3rem !important;
}

.qsa-inline-039 {
  font-size: .75rem !important;
  color: rgba(255,255,255,.4) !important;
  max-width: 280px !important;
  text-align: center !important;
  margin-top: 1rem !important;
  line-height: 1.7 !important;
}

.qsa-inline-040 {
  height: 100% !important;
  border-radius: 18px !important;
  border: none !important;
  background: linear-gradient(180deg,#dbeafe,#bfdbfe) !important;
  font-size: .55rem !important;
}

.qsa-inline-041 {
  height: 100% !important;
  border-radius: 18px !important;
  border: none !important;
  background: linear-gradient(180deg,#e5e7eb,#d1d5db) !important;
  font-size: .55rem !important;
}

.qsa-inline-042 {
  height: 100% !important;
  border-radius: 18px !important;
  border: none !important;
  background: linear-gradient(180deg,#1c1917,#292524) !important;
  font-size: .55rem !important;
}

.qsa-inline-043 {
  height: 100% !important;
  border-radius: 6px !important;
  border: none !important;
  font-size: .5rem !important;
}

.qsa-inline-044 {
  height: 100% !important;
  border-radius: 6px !important;
  border: none !important;
  font-size: .5rem !important;
}

.qsa-inline-045 {
  height: 100% !important;
  border-radius: 6px !important;
  border: none !important;
  font-size: .5rem !important;
}

.qsa-inline-046 {
  height: 100% !important;
  border-radius: 6px !important;
  border: none !important;
  font-size: .5rem !important;
}

.qsa-inline-047 {
  height: 100% !important;
  border-radius: 6px !important;
  border: none !important;
  font-size: .5rem !important;
}

.qsa-inline-048 {
  height: 100% !important;
  border-radius: 6px !important;
  border: none !important;
  font-size: .5rem !important;
}

.qsa-inline-049 {
  height: 100% !important;
  border-radius: 6px !important;
  border: none !important;
  font-size: .5rem !important;
}

.qsa-inline-050 {
  height: 100% !important;
  border-radius: 6px !important;
  border: none !important;
  font-size: .5rem !important;
}

.qsa-inline-051 {
  height: 100% !important;
  border-radius: 6px !important;
  border: none !important;
  font-size: .5rem !important;
}

.qsa-inline-052 {
  height: 100% !important;
  border-radius: 8px !important;
  border: none !important;
  font-size: .6rem !important;
}

.qsa-inline-053 {
  height: 100% !important;
  border-radius: 8px !important;
  border: none !important;
  font-size: .6rem !important;
}

.qsa-inline-054 {
  height: 100% !important;
  border-radius: 8px !important;
  border: none !important;
  font-size: .6rem !important;
}

.qsa-inline-055 {
  color: #67e8f9 !important;
}

.qsa-inline-056 {
  color: #f472b6 !important;
}

.qsa-inline-057 {
  color: #fbbf24 !important;
}

.qsa-inline-058 {
  color: #a3e635 !important;
}

.qsa-inline-059 {
  color: #f472b6 !important;
}

.qsa-inline-060 {
  height: 100% !important;
  border-radius: 10px !important;
  border: none !important;
}

.qsa-inline-061 {
  height: 100% !important;
  border-radius: 8px !important;
  border: none !important;
  background: #0f172a !important;
  font-size: .55rem !important;
}

.qsa-inline-062 {
  height: 100% !important;
  border-radius: 8px !important;
  border: none !important;
  background: #0f172a !important;
  font-size: .55rem !important;
}

.qsa-inline-063 {
  height: 100% !important;
  border-radius: 8px !important;
  border: none !important;
  background: #0f172a !important;
  font-size: .55rem !important;
}

.qsa-inline-064 {
  padding-top: 64px !important;
}

.qsa-inline-065 {
  height: 100% !important;
  border-radius: 12px !important;
  border: none !important;
}

/* ==========================================
   S04 — armado completo con scroll + delay final
   Controla círculos, claqueta, texto, ventana y piezas.
========================================== */

#s04 .s04-bg,
#s04 .s04-clap,
#s04 .s04-text,
#s04 .s04-browser-wrap,
#s04 .s04-intro-pieces {
  will-change: transform, opacity;
  transition: none !important;
}

#s04 .s04-bg {
  transform: translate3d(120px, 165px, 0) scale(.92);
  opacity: .42;
}

#s04 .s04-clap {
  animation: none !important;
  transform-origin: center center !important;
  transform: translate3d(-75px, 135px, 0) rotate(-30deg) scale(.82);
  opacity: .2;
}

#s04 .s04-text {
  transform: translate3d(-95px, 95px, 0);
  opacity: .24;
}

#s04 .s04-browser-wrap {
  transform: translate3d(120px, 160px, 0) scale(.88) rotate(-2.2deg);
  opacity: .25;
}

#s04 .s04-intro-pieces {
  opacity: .2;
}

#s04 > .s04-bg::before {
  animation: none !important;
  transform: none !important;
}

#s04 .s04-browser-wrap,
#s04 .s04-browser {
  transition: none !important;
}

#s04 .s04-browser {
  transform: none !important;
  opacity: 1 !important;
}

#s04 .s04-booom {
  display: none !important;
}

/* Segundo poster: imagen cumple.jpg al lado de papeles.jpg */
#s04 .s04-film-cumple {
  background: #11131a;
}

#s04 .s04-film-cumple::before {
  display: none !important;
}

#s04 .s04-film-cumple img {
  display: block;
  object-position: center center;
}


/* =========================================================
   FIX: eliminar franja derecha y mantener puntos sin fondo
   ========================================================= */
html,
body {
  width: 100% !important;
  min-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  overflow-x: hidden !important;
}

.slide {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

.dots {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}