@font-face {
  font-family:'Mona Sans';
  src:url('../fuentes/mona-sans.woff2') format('woff2');
  font-weight:200 900;
  font-stretch:75% 125%;
  font-display:swap
}
@font-face {
  font-family:'Fraunces';
  src:url('../fuentes/fraunces-italica.woff2') format('woff2');
  font-style:italic;
  font-weight:300 600;
  font-display:swap
}
@font-face {
  font-family:'DM Sans';
  src:url('../fuentes/dm-sans.woff2') format('woff2');
  font-weight:400 700;
  font-display:swap
}
.music {
  --sm-fondo:#0d1010;
  --sm-negro:#070808;
  --sm-rojo:#ed1c4e;
  --sm-rojo-oscuro:#b8123a;
  --sm-blanco:#f5f2ed;
  --sm-suave:#9ea3a0;
  --sm-linea:#ffffff22;
  --sm-ancha:'Mona Sans','Arial Black',Arial,sans-serif;
  --sm-editorial:'Fraunces',Georgia,'Times New Roman',serif;
  --sm-sans:'DM Sans',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  background:var(--sm-fondo);
  color:var(--sm-blanco);
  font-family:var(--sm-sans)
}
.music .cabecera,
.music .menu-panel {
  font-family:Arial,Helvetica,sans-serif
}
.music main#contenido {
  padding-top:0;
  overflow-x:clip
}
.sm-ancho {
  width:min(1180px,calc(100% - 40px));
  margin-inline:auto
}
.sm-oculto {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap
}

.sm-g {
  font-family:var(--sm-ancha);
  font-weight:700;
  letter-spacing:-.055em
}
.sm-s {
  font-family:var(--sm-editorial);
  font-size:1em;
  font-style:italic;
  font-weight:400;
  letter-spacing:-.02em
}
.sm-rojo {
  display:inline-block;
  font-family:var(--sm-editorial);
  font-size:1em;
  font-style:italic;
  font-weight:400;
  letter-spacing:-.02em;
  color:var(--sm-rojo)
}
.sm-etiqueta {
  display:block;
  margin-bottom:12px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.24em;
  color:var(--sm-rojo)
}
.sm-titulo {
  font-size:clamp(40px,8.6vw,78px);
  line-height:1.06;
  font-weight:400
}
.sm-titulo-centro {
  text-align:center
}
.sm-fila {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.22em;
  flex-wrap:wrap
}

.sm-estrella {
  display:inline-block;
  width:.42em;
  height:.42em;
  fill:var(--sm-rojo);
  flex:none;
  will-change:transform
}
.sm-destello {
  display:inline-block;
  width:.55em;
  height:.55em;
  fill:none;
  stroke:var(--sm-blanco);
  stroke-width:1.1;
  flex:none;
  will-change:transform
}
.sm-icono {
  flex:none;
  fill:none;
  stroke:var(--sm-rojo);
  stroke-width:2.4;
  stroke-linecap:round;
  stroke-linejoin:round
}
.sm-onda {
  width:1.3em;
  height:.46em
}
.sm-garabato {
  width:.9em;
  height:.66em
}
.sm-chispa {
  width:.7em;
  height:.7em
}
.sm-flama {
  display:block;
  fill:var(--sm-rojo);
  overflow:visible
}
.sm-mini-flama {
  flex:none;
  width:.62em;
  height:1em;
  fill:currentColor
}
.sm-boton {
  min-height:50px;
  padding:13px 28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  border-radius:999px;
  background:var(--sm-rojo);
  color:#fff;
  font-family:var(--sm-ancha);
  font-size:15px;
  font-weight:700;
  font-stretch:105%;
  box-shadow:0 10px 30px #ed1c4e40;
  touch-action:manipulation;
  transition:background .2s
}
.sm-boton svg {
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:2
}
@media(hover:hover) and (pointer:fine) {
  .sm-boton {
    transition:background .2s,translate .2s
  }
  .sm-boton:hover {
    background:var(--sm-rojo-oscuro);
    translate:0 -2px
  }
}

.sm-portada {
  position:relative;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding-top:110px;
  isolation:isolate;
  overflow:hidden
}
.sm-portada-fondo {
  position:absolute;
  inset:0;
  z-index:-1;
  overflow:hidden;
  background:var(--sm-negro)
}
.sm-portada-fondo video {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 40%;
  opacity:.55;
  will-change:transform
}
.sm-portada-fondo::after {
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse at 50% 110%,#ed1c4e33,transparent 60%),
    linear-gradient(180deg,#0d1010e6 0,#0d101073 30%,#0d101099 62%,var(--sm-fondo) 100%)
}
.sm-haz {
  position:absolute;
  top:-12%;
  width:46%;
  height:120%;
  z-index:1;
  background:linear-gradient(180deg,#ffffff30,#ffffff08 55%,transparent 80%);
  clip-path:polygon(46% 0,54% 0,100% 100%,0 100%);
  transform-origin:50% 0;
  pointer-events:none;
  will-change:transform
}
.sm-haz-1 {
  left:-8%;
  transform:rotate(-24deg)
}
.sm-haz-2 {
  left:28%;
  opacity:.7;
  transform:rotate(6deg)
}
.sm-haz-3 {
  right:-10%;
  transform:rotate(26deg)
}
.sm-portada-contenido {
  position:relative;
  z-index:2;
  padding-bottom:34px
}
.sm-portada-lema {
  max-width:270px;
  margin:0 0 26px auto;
  font-size:13px;
  line-height:1.6;
  color:#d7d9d6
}
.sm-titular {
  display:flex;
  flex-direction:column;
  gap:.055em;
  font-size:clamp(40px,9.2vw,124px);
  font-weight:400;
  line-height:.99
}
.sm-linea {
  display:flex;
  align-items:center;
  gap:.12em;
  flex-wrap:nowrap;
  white-space:nowrap
}
.sm-linea-2 {
  padding-left:.2em
}
.sm-linea-2 .sm-s {
  font-size:.92em
}
@media(max-width:719px) {
  .sm-linea-2 .sm-s {
    font-size:.8em
  }
}
.sm-linea-3 {
  padding-left:0
}
.sm-pildora {
  display:inline-grid;
  place-items:center;
  flex:none;
  width:.94em;
  height:.72em;
  border-radius:.4em;
  background:#ffffff14;
  box-shadow:inset 0 0 0 1.5px #ffffff40;
  overflow:hidden
}
.sm-fuego {
  display:block;
  will-change:transform
}
.sm-pildora .sm-flama {
  width:auto;
  height:.59em
}
.sm-titular .sm-destello {
  margin-left:.06em;
  align-self:flex-start
}
@media(max-width:767px) {
  .sm-encuentro-foto {
    display:none
  }
  .sm-titular {
    font-size:min(calc((100vw - 40px) / 5.35),13.2svh);
    gap:.04em
  }
  .sm-linea-3 {
    flex-wrap:wrap;
    row-gap:.04em
  }
  .sm-portada-lema {
    margin-bottom:22px
  }
}
.sm-portada-accion {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:34px
}
.sm-trazo {
  flex:none;
  fill:none;
  stroke:var(--sm-blanco);
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round
}
.sm-trazo-izq {
  width:88px;
  height:38px
}
.sm-trazo-der {
  width:52px;
  height:46px
}

.sm-cinta {
  position:relative;
  z-index:2;
  padding:16px 0;
  border-block:1px solid var(--sm-linea);
  background:var(--sm-fondo);
  overflow:hidden
}
.sm-cinta-pista {
  display:flex;
  align-items:center;
  gap:22px;
  width:max-content;
  padding-right:22px;
  font-family:var(--sm-ancha);
  font-size:clamp(18px,4vw,30px);
  font-weight:680;
  letter-spacing:.055em;
  white-space:nowrap;
  will-change:transform
}
.sm-cinta-roja {
  border:0;
  padding:10px 0;
  background:var(--sm-rojo);
  color:var(--sm-negro)
}
.sm-cinta-roja .sm-cinta-pista {
  font-size:14px;
  gap:16px;
  padding-right:16px
}

.sm-somos {
  padding:100px 0 90px
}
.sm-somos-grid {
  display:grid;
  gap:40px
}
.sm-arco {
  position:relative;
  width:min(330px,82%)
}
.sm-arco > .sm-estrella {
  position:absolute;
  top:-26px;
  right:-26px;
  z-index:2;
  width:70px;
  height:70px
}
.sm-arco-foto {
  aspect-ratio:4/5;
  border-radius:48% 48% 18px 18px / 36% 36% 18px 18px;
  overflow:hidden;
  box-shadow:0 20px 50px #0009;
  will-change:transform
}
.sm-arco-foto img {
  width:100%;
  height:100%;
  object-fit:cover
}
.sm-enlace {
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  margin-top:10px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase
}
.sm-enlace svg {
  width:16px;
  height:16px;
  fill:none;
  stroke:var(--sm-rojo);
  stroke-width:2
}
.sm-somos-texto > p:last-child {
  max-width:470px;
  margin-top:22px;
  font-size:16px;
  line-height:1.75;
  color:#c9ccc9
}
.sm-logo-tarjeta,
.sm-cierre-logo {
  display:block;
  width:110px;
  filter:drop-shadow(0 14px 30px #ed1c4e40)
}
.sm-logo-tarjeta {
  margin:0 0 26px
}
.sm-logo-tarjeta img,
.sm-cierre-logo img {
  display:block;
  width:100%;
  height:auto
}

.sm-equipo {
  padding:30px 0 100px
}
.sm-equipo .sm-titulo .sm-onda {
  width:1.1em
}
.sm-ecualizador {
  display:none
}
.sm-ecualizador {
  position:absolute;
  left:50%;
  bottom:12%;
  display:flex;
  align-items:flex-end;
  gap:6px;
  height:22%;
  transform:translateX(-50%)
}
.sm-ecualizador i {
  width:9px;
  height:100%;
  border-radius:3px;
  background:var(--sm-blanco);
  transform-origin:50% 100%;
  will-change:transform
}
.sm-ecualizador i:nth-child(odd) {
  background:var(--sm-rojo)
}
.sm-equipo-escena {
  position:relative;
  margin-top:44px
}
.sm-equipo-foto {
  position:relative;
  margin:0;
  aspect-ratio:4/5;
  overflow:hidden;
  border:1px solid #ffffff2e;
  border-radius:16px;
  background:var(--sm-negro);
  box-shadow:0 30px 70px #000b;
  isolation:isolate
}
.sm-telon {
  position:absolute;
  top:0;
  bottom:0;
  z-index:2;
  width:50.5%;
  visibility:hidden;
  background:repeating-linear-gradient(90deg,#00000045 0 6px,transparent 6px 22px,#ffffff10 22px 26px,transparent 26px 34px),linear-gradient(180deg,#d01746,#7a0a26);
  box-shadow:inset 0 -40px 60px #0006;
  will-change:transform
}
.sm-telon-izq {
  left:0
}
.sm-telon-der {
  right:0
}
.sm-equipo-roles {
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
  margin:20px 0 0;
  padding:0;
  list-style:none
}
.sm-equipo-roles li {
  padding:9px 16px;
  border-radius:40px;
  background:var(--sm-blanco);
  color:var(--sm-negro);
  font-family:var(--sm-ancha);
  font-size:14px;
  font-weight:700;
  letter-spacing:-.02em;
  box-shadow:0 12px 28px #0008
}
.sm-equipo-roles li:nth-child(2) {
  background:var(--sm-rojo);
  color:#fff
}
.sm-equipo-texto {
  max-width:520px;
  margin:30px auto 0;
  font-size:16px;
  line-height:1.7;
  text-align:center;
  color:#c9ccc9
}
.sm-equipo-texto .sm-s {
  display:block;
  margin-top:4px;
  font-size:1.6em;
  line-height:1.2;
  color:var(--sm-blanco)
}

.sm-setlist {
  position:relative;
  padding:40px 0 90px;
  background:radial-gradient(ellipse at 20% 30%,#ed1c4e1f,transparent 55%),var(--sm-fondo);
  overflow:hidden
}
.sm-setlist-cabeza .sm-titulo {
  font-size:clamp(44px,10vw,96px)
}
.sm-setlist-ventana {
  margin-top:34px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  overscroll-behavior-x:contain
}
.sm-setlist-ventana::-webkit-scrollbar {
  display:none
}
.sm-setlist-ventana:focus-visible {
  outline:2px solid var(--sm-rojo);
  outline-offset:-2px
}
.sm-setlist-pista {
  display:flex;
  align-items:center;
  gap:18px;
  width:max-content;
  margin:0;
  padding:16px 20px 24px;
  list-style:none
}
.sm-pista {
  flex:none;
  scroll-snap-align:center
}
.sm-pista figure {
  position:relative;
  margin:0
}
.sm-pista-foto {
  overflow:hidden;
  border-radius:14px;
  box-shadow:0 24px 50px #000a
}
.sm-pista-foto img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  will-change:transform
}
.sm-pista-alta,
.sm-pista-bis {
  width:min(64vw,290px)
}
.sm-pista-alta .sm-pista-foto {
  aspect-ratio:9/16
}
.sm-pista-media {
  width:min(68vw,310px)
}
.sm-pista-media .sm-pista-foto {
  aspect-ratio:3/4
}
.sm-pista-ancha {
  width:min(84vw,540px)
}
.sm-pista-ancha .sm-pista-foto {
  aspect-ratio:16/10
}
.sm-pista:nth-child(odd) figure {
  transform:rotate(-1.6deg)
}
.sm-pista:nth-child(even) figure {
  transform:rotate(1.6deg)
}
.sm-pista figcaption {
  display:flex;
  align-items:baseline;
  gap:10px;
  margin-top:16px;
  padding-left:4px
}
.sm-pista figcaption span {
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  color:var(--sm-rojo)
}
.sm-pista figcaption strong {
  font-family:var(--sm-ancha);
  font-size:clamp(20px,2.4vw,28px);
  letter-spacing:-.04em
}
.sm-bis {
  position:relative;
  display:grid;
  justify-items:center;
  align-content:center;
  gap:8px;
  aspect-ratio:3/4;
  padding:24px 20px 26%;
  border:1px solid var(--sm-rojo);
  border-radius:14px;
  background:radial-gradient(circle at 50% 38%,#ed1c4e47,transparent 62%),var(--sm-negro);
  text-align:center;
  overflow:hidden
}
.sm-bis .sm-flama {
  width:auto;
  height:72px;
  fill:var(--sm-rojo);
  transform-origin:50% 100%
}
.sm-bis strong {
  font-size:clamp(54px,7vw,84px);
  line-height:.9
}
.sm-bis .sm-s {
  font-size:22px;
  color:var(--sm-suave)
}
.sm-bis .sm-ecualizador {
  bottom:9%;
  height:14%
}
.sm-reproductor {
  display:flex;
  align-items:center;
  gap:14px;
  margin-top:20px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  color:var(--sm-suave)
}
.sm-reproductor-num {
  min-width:2ch;
  color:var(--sm-blanco)
}
.sm-reproductor-barra {
  position:relative;
  flex:1;
  height:3px;
  border-radius:3px;
  background:#ffffff26
}
.sm-reproductor-barra i {
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:var(--sm-rojo);
  transform:scaleX(0);
  transform-origin:0 50%;
  will-change:transform
}

.sm-setlist-escena {
  position:relative;
  overflow:hidden
}
.sm-setlist-cabeza,
.sm-setlist-ventana,
.sm-reproductor {
  position:relative;
  z-index:1
}
.sm-setlist-fondo {
  position:absolute;
  top:54%;
  left:0;
  z-index:0;
  margin:0;
  font-family:var(--sm-ancha);
  font-size:clamp(130px,24vw,330px);
  font-weight:800;
  letter-spacing:-.05em;
  line-height:1;
  white-space:nowrap;
  color:transparent;
  -webkit-text-stroke:1.5px #ffffff17;
  transform:translateY(-50%);
  pointer-events:none;
  will-change:transform
}
.sm-setlist-fijo .sm-setlist-ventana {
  overflow:visible;
  scroll-snap-type:none
}
.sm-setlist-fijo .sm-pista {
  will-change:transform
}
.sm-letra {
  align-self:center;
  padding:0 clamp(8px,2vw,36px)
}
.sm-letra-etiqueta {
  margin:0 0 14px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.26em;
  color:var(--sm-rojo)
}
.sm-letra-texto {
  margin:0;
  font-size:clamp(50px,14vw,72px);
  line-height:.92;
  white-space:nowrap
}
.sm-letra-texto .sm-g,
.sm-letra-texto .sm-s {
  display:inline-block
}
.sm-letra-texto .sm-s {
  color:var(--sm-rojo)
}
.sm-setlist-pista {
  position:relative
}
.sm-setlist-pista > li {
  position:relative;
  z-index:1
}
.sm-ondas {
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none
}
.sm-traza {
  position:absolute;
  top:50%;
  overflow:visible;
  transform:translateY(-50%)
}
.sm-traza path {
  fill:none;
  stroke:#ffffff26;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round
}
.sm-traza.sm-sonado path {
  stroke:#ed1c4e8c
}
.sm-traza.sm-sonando {
  animation:sm-latido .42s ease-in-out infinite alternate;
  will-change:transform;
  backface-visibility:hidden
}
.sm-traza.sm-sonando path {
  stroke:var(--sm-rojo);
  stroke-width:2.6
}
@keyframes sm-latido {
  from { transform:translateY(-50%) scaleY(.5) }
  to { transform:translateY(-50%) scaleY(1.25) }
}
.sm-aguja {
  position:absolute;
  top:50%;
  left:0;
  z-index:0;
  width:16px;
  height:16px;
  margin:-8px 0 0 -8px;
  border:3px solid var(--sm-rojo);
  border-radius:50%;
  background:#fff;
  box-shadow:0 0 0 6px #ed1c4e40,0 0 44px 14px #ed1c4e8c,0 0 110px 40px #ed1c4e33;
  pointer-events:none;
  will-change:transform
}
.sm-aguja::before {
  content:'';
  position:absolute;
  left:4px;
  top:-48px;
  width:2px;
  height:104px;
  border-radius:2px;
  background:linear-gradient(180deg,transparent,#ed1c4e99 35%,#ed1c4e99 65%,transparent)
}
.sm-aguja::after {
  content:'';
  position:absolute;
  inset:-3px;
  border-radius:50%;
  border:2px solid var(--sm-rojo);
  animation:sm-aguja-pulso 1.3s ease-out infinite
}
@keyframes sm-aguja-pulso {
  from { transform:scale(1);opacity:.7 }
  to { transform:scale(3);opacity:0 }
}
@media(prefers-reduced-motion:reduce) {
  .sm-traza.sm-sonando,
  .sm-aguja::after {
    animation:none
  }
}
.sm-ecualizador-mini {
  display:inline-flex;
  align-items:flex-end;
  gap:2px;
  height:14px
}
.sm-ecualizador-mini i {
  width:3px;
  height:100%;
  border-radius:2px;
  background:var(--sm-rojo);
  transform:scaleY(.25);
  transform-origin:50% 100%
}
@media(max-width:767px) {
  .sm-setlist.sm-setlist-fijo {
    padding:0
  }
  .sm-setlist-fijo .sm-setlist-escena {
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:100svh;
    padding:84px 0 20px
  }
  .sm-setlist-fijo .sm-setlist-cabeza .sm-titulo {
    font-size:clamp(34px,10.5vw,50px)
  }
  .sm-setlist-fijo .sm-setlist-ventana {
    margin-top:14px
  }
  .sm-setlist-fijo .sm-setlist-pista {
    gap:22px;
    padding:12px 20px 6px
  }
  .sm-setlist-fijo .sm-pista-alta,
  .sm-setlist-fijo .sm-pista-bis {
    width:min(52vw,26svh)
  }
  .sm-setlist-fijo .sm-pista-media {
    width:min(58vw,31svh)
  }
  .sm-setlist-fijo .sm-pista-ancha {
    width:min(80vw,46svh)
  }
  .sm-setlist-fijo .sm-pista:nth-child(3n+2):not(.sm-letra) {
    align-self:flex-start
  }
  .sm-setlist-fijo .sm-pista:nth-child(3n):not(.sm-letra) {
    align-self:flex-end
  }
  .sm-setlist-fijo .sm-reproductor {
    margin-top:14px
  }
}

.sm-envivo {
  padding:40px 0 80px
}
.sm-envivo-texto > p {
  max-width:430px;
  margin-top:20px;
  font-size:16px;
  line-height:1.7;
  color:#c9ccc9
}
.sm-envivo-grid {
  display:grid;
  gap:34px
}
.sm-envivo-foto {
  position:relative;
  width:min(360px,88%)
}
.sm-envivo-marca {
  position:absolute;
  top:-18px;
  left:-4px;
  z-index:2;
  display:flex;
  align-items:center;
  gap:10px;
  font-family:var(--sm-ancha);
  font-size:clamp(28px,7vw,48px);
  font-weight:700;
  letter-spacing:.045em;
  line-height:1;
  color:var(--sm-rojo);
  text-shadow:0 6px 24px #000a
}
.sm-punto {
  width:.32em;
  height:.32em;
  border-radius:50%;
  background:var(--sm-rojo);
  box-shadow:0 0 0 .1em #ed1c4e40;
  will-change:transform
}
.sm-envivo-recorte {
  aspect-ratio:1;
  overflow:hidden;
  border-radius:0 50% 50% 50% / 0 50% 50% 50%;
  will-change:transform
}
.sm-envivo-recorte img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:46% 55%
}
.sm-video-marco {
  position:relative;
  margin:0;
  overflow:hidden;
  background:#050606;
  isolation:isolate
}
.sm-video-marco video {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  background:#050606
}
.sm-video-marco::after {
  position:absolute;
  inset:46% 0 0;
  z-index:1;
  content:'';
  background:linear-gradient(transparent,#000a);
  pointer-events:none
}
.sm-video-marco figcaption {
  position:absolute;
  z-index:2;
  right:18px;
  bottom:18px;
  left:18px;
  color:#fff;
  font-size:11px;
  font-weight:700;
  letter-spacing:.14em;
  text-shadow:0 2px 10px #000
}
.sm-video-reproducir {
  display:none;
  position:absolute;
  z-index:3;
  top:50%;
  left:50%;
  padding:12px 18px;
  border:1px solid #fff8;
  border-radius:40px;
  background:#fff;
  color:#151515;
  font:700 12px var(--sm-sans);
  transform:translate(-50%,-50%)
}
.sm-necesita-play .sm-video-reproducir {
  display:block
}
.sm-pulsos {
  padding:34px 0 104px
}
.sm-pulsos-cabeza {
  max-width:760px;
  margin-bottom:34px
}
.sm-pulsos-cabeza .sm-titulo {
  font-size:clamp(46px,11vw,96px)
}
.sm-pulsos-cabeza > p:last-child {
  max-width:500px;
  margin-top:18px;
  color:#b8bdb9;
  line-height:1.7
}
.sm-pulsos-grid {
  display:grid;
  gap:20px
}
.sm-pulso {
  aspect-ratio:4/3;
  border:1px solid #ffffff35;
  border-radius:12px;
  box-shadow:0 22px 45px #0008;
  transition:border-color .25s ease
}
.sm-pulso:focus-visible,
.sm-pulso:hover {
  outline:none;
  border-color:var(--sm-rojo)
}
.sm-pulso figcaption {
  display:flex;
  align-items:baseline;
  gap:12px
}
.sm-pulso figcaption span {
  color:var(--sm-rojo)
}
.sm-pulso figcaption strong {
  font-family:var(--sm-ancha);
  font-size:25px;
  letter-spacing:.02em
}
.sm-envivo-recorte video {
  object-position:50% 50%
}
.sm-encuentro {
  padding:45px 0 110px
}
.sm-encuentro-cabeza {
  margin-bottom:30px
}
.sm-encuentro-cabeza .sm-titulo {
  font-size:clamp(48px,10vw,100px)
}
.sm-encuentro-grid {
  display:grid;
  gap:18px
}
.sm-encuentro-foto,
.sm-encuentro-video {
  position:relative;
  margin:0;
  aspect-ratio:16/10;
  overflow:hidden;
  border-radius:14px
}
.sm-encuentro-foto img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover
}
.sm-encuentro-foto figcaption {
  position:absolute;
  bottom:18px;
  left:18px;
  color:#fff;
  font-size:11px;
  font-weight:700;
  letter-spacing:.15em;
  text-shadow:0 2px 12px #000
}
.sm-encuentro-video {
  box-shadow:0 22px 45px #0008
}

.sm-cierre {
  position:relative;
  padding:110px 0 100px;
  text-align:center;
  isolation:isolate;
  overflow:hidden
}
.sm-cierre-fondo {
  position:absolute;
  inset:-10% 0;
  z-index:-1;
  will-change:transform
}
.sm-cierre-fondo img {
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.45
}
.sm-cierre-fondo::after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,var(--sm-fondo),#0d101066 40%,#0d1010cc 85%,var(--sm-fondo))
}
.sm-cierre-logo {
  margin:0 auto 26px;
  will-change:transform
}
.sm-cierre .sm-titulo > span {
  display:block
}
.sm-cierre-contenido > p {
  max-width:430px;
  margin:18px auto 30px;
  font-size:15px;
  line-height:1.7;
  color:#d7d9d6
}

.music .pie {
  background:var(--sm-negro)
}

@media(min-width:768px) {
  .sm-ancho {
    width:min(1180px,calc(100% - 96px))
  }
  .sm-portada-contenido {
    padding-bottom:50px
  }
  .sm-portada-lema {
    max-width:420px;
    margin:0 auto 34px;
    text-align:center
  }
  .sm-titular {
    align-items:center
  }
  .sm-linea-2 {
    padding-left:0
  }
  .sm-somos {
    padding:140px 0 120px
  }
  .sm-somos-grid {
    grid-template-columns:.8fr 1.2fr;
    align-items:center;
    gap:70px
  }
  .sm-somos .sm-titulo {
    font-size:clamp(44px,5.2vw,72px)
  }
  .sm-logo-tarjeta,
  .sm-cierre-logo {
    width:136px
  }
  .sm-equipo-escena {
    width:min(100%,560px);
    margin-inline:auto
  }
  .sm-equipo-roles li:nth-child(1) {
    left:-12%
  }
  .sm-equipo-roles li:nth-child(2) {
    right:-16%
  }
  .sm-equipo-roles {
    position:absolute;
    inset:0;
    display:block;
    margin:0;
    pointer-events:none
  }
  .sm-equipo-roles li {
    position:absolute;
    z-index:3;
    padding:12px 22px;
    font-size:17px
  }
  .sm-equipo-roles li:nth-child(1) {
    top:-18px;
    left:7%;
    rotate:-6deg
  }
  .sm-equipo-roles li:nth-child(2) {
    top:44%;
    right:-22px;
    rotate:5deg
  }
  .sm-equipo-roles li:nth-child(3) {
    bottom:-20px;
    left:22%;
    rotate:-3deg
  }
  .sm-equipo-texto {
    margin-top:54px
  }
  .sm-setlist {
    padding:0
  }
  .sm-setlist-escena {
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:100vh;
    padding:90px 0 44px
  }
  .sm-setlist-cabeza .sm-titulo {
    font-size:clamp(46px,6vw,92px)
  }
  .sm-setlist-ventana {
    margin-top:clamp(14px,3vh,34px)
  }
  .sm-setlist-pista {
    gap:clamp(28px,3.4vw,56px);
    padding:20px max(48px,calc((100vw - 1180px) / 2)) 10px
  }
  .sm-pista-alta,
  .sm-pista-bis {
    width:clamp(170px,26vh,290px)
  }
  .sm-pista-media {
    width:clamp(200px,30vh,330px)
  }
  .sm-pista-ancha {
    width:clamp(360px,56vh,620px)
  }
  .sm-setlist-fijo .sm-pista-foto img {
    scale:1.14
  }
  .sm-pista:nth-child(3n+2):not(.sm-letra) {
    align-self:flex-start
  }
  .sm-pista:nth-child(3n):not(.sm-letra) {
    align-self:flex-end
  }
  .sm-letra-texto {
    font-size:clamp(64px,8.6vw,150px)
  }
  .sm-envivo-grid {
    grid-template-columns:1fr 1fr;
    align-items:center;
    gap:60px
  }
  .sm-envivo-foto {
    width:100%
  }
  .sm-envivo .sm-titulo {
    font-size:clamp(46px,5.6vw,80px)
  }
  .sm-pulsos {
    padding:50px 0 145px
  }
  .sm-pulsos-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px
  }
  .sm-pulso {
    aspect-ratio:4/5
  }
  .sm-pulso:nth-child(2) {
    transform:translateY(25px)
  }
  .sm-encuentro-grid {
    grid-template-columns:1fr 1fr;
    align-items:center;
    gap:22px
  }
  .sm-encuentro-video {
    transform:translateY(30px)
  }
  .sm-cierre {
    padding:150px 0 130px
  }
  .sm-cierre-logo {
    width:150px
  }
}

.animar .sm-portada-contenido {
  visibility:hidden
}
@media(prefers-reduced-motion:reduce) {
  .sm-boton {
    transition:none
  }
}