/* ==========================================================
   NUEVO MEDIA · VÍDEOS

   Diseño hermano de MEDIA · IMÁGENES.
   La tipografía se hereda de la web general.
========================================================== */


.media-videos {

  --media-video-padding: 50px;

  --media-video-border: #dedede;

  --media-video-text: #111;

  --media-video-muted: #666;

  --media-video-soft: #f3f3f3;


  width: 100%;

  background: #fff;

  color: var(--media-video-text);

}


.media-videos *,
.media-videos *::before,
.media-videos *::after {

  box-sizing: border-box;

}


.media-videos a {

  color: inherit;

  text-decoration: none;

}



/* ==========================================================
   CONTENEDOR
========================================================== */


.media-video-inner {

  width: 100%;

  max-width: 1320px;

  margin-left: auto;

  margin-right: auto;

  padding-left: var(--media-video-padding);

  padding-right: var(--media-video-padding);

}


/* HERO A ANCHO COMPLETO */


.media-video-hero .media-video-inner {

  max-width: none;

}



/* ==========================================================
   HERO
========================================================== */


.media-video-hero {

  position: relative;

  height: 620px;

  min-height: 620px;

  overflow: hidden;

  background: #111;

  color: #fff;

}


.media-video-hero-picture {

  position: absolute;

  inset: 0;

  display: block;

  width: 100%;

  height: 100%;

}


.media-video-hero-bg {

  display: block;

  width: 100%;

  height: 100%;

  object-fit: cover;

  object-position: center 42%;

}


.media-video-hero::after {
  display: none;
}



/* ==========================================================
   HERO · ESTRUCTURA DE SLIDE
   El slide debe ocupar siempre el 100% del hero, también cuando
   solo existe un slide y no se activa el modo carrusel.
========================================================== */

.media-video-hero-slides {
  position: relative;
  width: 100%;
  height: 100%;
}

.media-video-hero-slide {
  position: relative;
  width: 100%;
  height: 100%;
}

.media-video-hero-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}


/* ==========================================================
   HERO · CONTENIDO
========================================================== */


.media-video-hero-content {

  position: relative;

  z-index: 2;

  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(340px, 440px);

  align-items: center;

  gap: 70px;

  height: 100%;

}


.media-video-hero-copy {

  max-width: 560px;

}



/* EYEBROW */


.media-video-eyebrow {

  display: flex;

  align-items: center;

  gap: 14px;


  font-size: 12px;

  line-height: 1.2;

  letter-spacing: .08em;

}


.media-video-eyebrow span {

  display: inline-block;


  width: 35px;

  height: 1px;


  background: currentColor;


  opacity: .45;

}



/* TÍTULO */


.media-video-hero h1 {

  margin: 55px 0 24px;


  font-size: clamp(56px, 5.5vw, 86px);

  line-height: .94;


  font-weight: 700;


  letter-spacing: -.04em;

}



/* DESCRIPCIÓN */


.media-video-hero-description {

  margin: 0 0 38px;


  font-size: 12px;

  line-height: 1.7;

}



/* ==========================================================
   HERO · ZONA DERECHA
========================================================== */

.media-video-hero-side {

  display: flex;

  flex-direction: column;

  align-items: stretch;

  justify-content: center;

  gap: 26px;

  min-width: 0;

}


/* ==========================================================
   HERO · DIRECTO ACTIVO
========================================================== */

.media-video-hero-live-card {

  width: 100%;

  padding: 22px;

  border: 1px solid rgba(255,255,255,.46);

  background: rgba(0,0,0,.48);

  color: #fff;

  backdrop-filter: blur(3px);

  -webkit-backdrop-filter: blur(3px);

}

.media-video-hero-live-card-status {

  display: flex;

  align-items: center;

  gap: 8px;

  padding-bottom: 15px;

  border-bottom: 1px solid rgba(255,255,255,.22);

}

.media-video-hero-live-card-status i {

  display: block;

  width: 9px;

  height: 9px;

  flex: 0 0 9px;

  border-radius: 50%;

  background: #e00000;

}

.media-video-hero-live-card-status span {

  font-size: 10px;

  line-height: 1;

  font-weight: 700;

  text-transform: uppercase;

  letter-spacing: .07em;

}

.media-video-hero-live-card-status time {

  margin-left: auto;

  font-size: 11px;

  line-height: 1;

  font-weight: 600;

  opacity: .78;

}

.media-video-hero-live-card h2 {

  margin: 22px 0 0;

  font-size: 28px;

  line-height: 1.05;

  font-weight: 700;

  letter-spacing: -.025em;

}

.media-video-hero-live-card p {

  max-width: 330px;

  margin: 12px 0 22px;

  font-size: 11px;

  line-height: 1.55;

  opacity: .72;

}

.media-video-hero-live-cta {

  display: grid;

  grid-template-columns:
    34px
    minmax(0, 1fr)
    auto;

  align-items: center;

  gap: 13px;

  min-height: 58px;

  padding: 0 17px;

  background: #fff;

  color: #111 !important;

  transition:
    background-color .2s ease,
    color .2s ease;

}

.media-video-hero-live-cta:hover {

  background: #111;

  color: #fff !important;

}

.media-video-hero-live-cta-play {

  display: flex;

  align-items: center;

  justify-content: center;

  width: 32px;

  height: 32px;

  border: 1px solid currentColor;

  border-radius: 50%;

}

.media-video-hero-live-cta-play i {

  width: 0;

  height: 0;

  margin-left: 3px;

  border-top: 5px solid transparent;

  border-bottom: 5px solid transparent;

  border-left: 8px solid currentColor;

}

.media-video-hero-live-cta strong {

  font-size: 11px;

  line-height: 1;

  font-weight: 700;

  text-transform: uppercase;

}

.media-video-hero-live-cta b {

  font-size: 22px;

  line-height: 1;

  font-weight: 300;

  transition: transform .2s ease;

}

.media-video-hero-live-cta:hover b {

  transform: translateX(4px);

}


/* ==========================================================
   HERO · BOTONES
========================================================== */


.media-video-hero-actions {

  display: flex;

  gap: 10px;

}


.media-video-btn {

  display: inline-flex;

  align-items: center;

  justify-content: space-between;


  min-height: 48px;


  padding: 0 18px;


  gap: 28px;


  border-radius: 1px;


  font-size: 10px;

  font-weight: 600;


  text-transform: uppercase !important;

}


.media-video-btn-light {

  min-width: 200px;


  background: #fff;


  color: #111 !important;

}


.media-video-btn-outline {

  min-width: 175px;


  border:

    1px solid

    rgba(255, 255, 255, .55);


  color: #fff !important;

}


.media-video-btn span {

  font-size: 18px;

  font-weight: 300;

}



/* ==========================================================
   HERO · CONTADOR
========================================================== */


.media-video-hero-counter {

  display: flex;

  flex-direction: column;

  align-items: flex-end;


  text-align: right;

}


.media-video-hero-counter strong {

  margin: 7px 0;


  font-size: 48px;

  line-height: 1;


  font-weight: 700;

}


.media-video-hero-counter span {

  font-size: 11px;

}



/* ==========================================================
   NAVEGACIÓN
========================================================== */


.media-video-subnav {

  height: 78px;


  background: #fff;


  border-bottom:

    1px solid

    var(--media-video-border);

}


.media-video-subnav-inner {

  display: flex;

  align-items: center;


  height: 100%;


  overflow: hidden;

}


.media-video-subnav-categories {

  display: flex;

  align-items: center;


  flex: 1 1 auto;


  min-width: 0;


  overflow-x: auto;

  overflow-y: hidden;


  white-space: nowrap;


  scrollbar-width: none;

}


.media-video-subnav-categories::-webkit-scrollbar {

  display: none;

}


.media-video-subnav-categories a {

  position: relative;


  flex: 0 0 auto;


  padding: 0 22px;


  font-size: 13px;

  line-height: 78px;


  white-space: nowrap;


  color: #222;


  opacity: .72;

}


.media-video-subnav-categories a:first-child {

  padding-left: 0;

  padding-right: 28px;


  font-weight: 600;

}


.media-video-subnav-categories a:hover,
.media-video-subnav-categories a.active {

  opacity: 1;

}


.media-video-subnav-categories a.active::after {

  content: "";


  position: absolute;


  left: 0;

  right: 22px;

  bottom: 0;


  height: 2px;


  background: #111;

}



/* ==========================================================
   ÚLTIMOS VÍDEOS
========================================================== */


.media-video-latest {

  padding: 58px 0 65px;


  background: #fff;

}


.media-video-latest-layout {

  display: grid;


  grid-template-columns:

    25%

    75%;


  align-items: stretch;

}



/* INTRO */


.media-video-section-intro {

  display: flex;

  flex-direction: column;

  align-items: flex-start;


  padding:

    8px

    50px

    0

    0;

}


.media-video-section-intro .media-video-eyebrow {

  color: var(--media-video-muted);

}


.media-video-section-intro h2 {

  margin: 34px 0 0;


  font-size: clamp(38px, 3.3vw, 54px);

  line-height: 1.05;


  font-weight: 700;


  letter-spacing: -.03em;

}


.media-video-text-link {

  display: flex;

  align-items: center;


  gap: 10px;


  margin-top: auto;


  font-size: 10px;

}


.media-video-text-link span {

  font-size: 18px;

}



/* ==========================================================
   MOSAICO DE VÍDEOS
========================================================== */


.media-video-featured-grid {

  display: grid;


  height: 590px;


  grid-template-columns:

    minmax(0, 1.65fr)

    minmax(0, .85fr);


  grid-template-rows:

    1fr

    1fr;


  gap: 4px;

}


.media-video-featured-main {

  grid-column: 1;

  grid-row: 1 / 3;


  min-width: 0;

}


.media-video-featured-small {

  min-width: 0;

}


.media-video-featured-small:nth-child(2) {

  grid-column: 2;

  grid-row: 1;

}


.media-video-featured-small:nth-child(3) {

  grid-column: 2;

  grid-row: 2;

}



/* ==========================================================
   MINIATURAS
========================================================== */


.media-video-featured-main > a,
.media-video-featured-small > a,
.media-video-card > a {

  display: flex;

  flex-direction: column;


  width: 100%;

  height: 100%;

}


.media-video-thumb {

  position: relative;


  width: 100%;


  overflow: hidden;


  background: #ddd;

}


.media-video-featured-main .media-video-thumb,
.media-video-featured-small .media-video-thumb {

  flex: 1 1 auto;

}


.media-video-card .media-video-thumb {

  aspect-ratio: 16 / 9;

}


.media-video-thumb img {

  display: block;


  width: 100%;

  height: 100%;


  object-fit: cover;


  transition: transform .45s ease;

}


.media-video-card:hover img,
.media-video-featured-main:hover img,
.media-video-featured-small:hover img {

  transform: scale(1.02);

}



/* POSICIONES PROVISIONALES */


.media-video-image-pos-2 {

  object-position: 30% 40% !important;

}


.media-video-image-pos-3 {

  object-position: 70% 35% !important;

}


.media-video-image-pos-4 {

  object-position: 25% 50% !important;

}


.media-video-image-pos-5 {

  object-position: 75% 45% !important;

}



/* SOMBRA */


.media-video-thumb-shade {

  position: absolute;

  inset: 0;


  background:

    linear-gradient(

      180deg,

      rgba(0,0,0,0) 45%,

      rgba(0,0,0,.22) 100%

    );

}



/* ==========================================================
   PLAY
========================================================== */


.media-video-play {

  position: absolute;


  z-index: 3;


  top: 50%;

  left: 50%;


  display: flex;

  align-items: center;

  justify-content: center;


  width: 64px;

  height: 64px;


  transform:

    translate(-50%, -50%);


  border-radius: 50%;


  background:

    rgba(255,255,255,.94);


  transition: transform .2s ease;

}


.media-video-play span {

  width: 0;

  height: 0;


  margin-left: 5px;


  border-top:

    8px solid transparent;


  border-bottom:

    8px solid transparent;


  border-left:

    13px solid #111;

}


.media-video-play-small {

  width: 48px;

  height: 48px;

}


.media-video-play-small span {

  border-top-width: 6px;

  border-bottom-width: 6px;

  border-left-width: 10px;

}


.media-video-card:hover .media-video-play,
.media-video-featured-main:hover .media-video-play,
.media-video-featured-small:hover .media-video-play {

  transform:

    translate(-50%, -50%)

    scale(1.06);

}



/* ==========================================================
   DURACIÓN
========================================================== */


.media-video-duration {

  position: absolute;


  z-index: 3;


  right: 12px;

  bottom: 12px;


  padding: 5px 8px;


  background:

    rgba(0,0,0,.78);


  color: #fff;


  font-size: 10px;

  line-height: 1;


  font-weight: 600;

}



/* ==========================================================
   INFORMACIÓN DE VÍDEO
========================================================== */


.media-video-card-info {

  padding-top: 15px;

}


.media-video-card-category {

  margin-bottom: 7px;


  font-size: 10px;

  line-height: 1.25;


  font-weight: 600;


  text-transform: uppercase;

}


.media-video-card-info h3 {

  margin: 0;


  font-size: 18px;

  line-height: 1.2;


  font-weight: 700;


  letter-spacing: -.015em;

}


.media-video-featured-main
.media-video-card-info h3 {

  font-size: 23px;

}


.media-video-card-meta {

  margin-top: 7px;


  font-size: 10px;

  line-height: 1.25;


  opacity: .62;

}



/* ==========================================================
   EN DIRECTO
========================================================== */


.media-video-live {

  padding: 58px 0 68px;


  background: var(--media-video-soft);


  border-top: 1px solid #e7e7e7;

  border-bottom: 1px solid #e7e7e7;

}



/* TÍTULO PEQUEÑO */


.media-video-small-title {

  padding-bottom: 22px;


  font-size: 13px;

  line-height: 1.35;


  color: #222;


  text-transform: uppercase;


  font-weight: 600;

}


.media-video-small-title span {

  display: block;


  width: 45px;

  height: 1px;


  margin-top: 12px;


  background: #111;


  opacity: .45;

}



/* ==========================================================
   DIRECTO PRINCIPAL
========================================================== */


.media-video-live-main {

  display: grid;


  grid-template-columns:

    minmax(0, 1.6fr)

    minmax(300px, .75fr);


  min-height: 450px;


  background: #111;


  color: #fff;

}


.media-video-live-visual {

  position: relative;


  overflow: hidden;


  min-height: 450px;

}


.media-video-live-visual img {

  display: block;


  width: 100%;

  height: 100%;


  object-fit: cover;

}


.media-video-live-visual-shade {

  position: absolute;

  inset: 0;


  background:

    linear-gradient(

      90deg,

      rgba(0,0,0,.04),

      rgba(0,0,0,.30)

    );

}



/* BADGE */


.media-video-live-badge {

  position: absolute;


  z-index: 3;


  top: 22px;

  left: 22px;


  display: flex;

  align-items: center;


  gap: 8px;


  padding: 10px 13px;


  background: #fff;


  color: #111;


  font-size: 10px;

  line-height: 1;


  font-weight: 700;


  text-transform: uppercase;

}


.media-video-live-badge i {

  width: 8px;

  height: 8px;


  border-radius: 50%;


  background: #d60000;

}



/* PLAY DIRECTO */


.media-video-live-play {

  position: absolute;


  z-index: 3;


  top: 50%;

  left: 50%;


  display: flex;

  align-items: center;

  justify-content: center;


  width: 80px;

  height: 80px;


  transform:

    translate(-50%, -50%);


  border-radius: 50%;


  background:

    rgba(255,255,255,.95);

}


.media-video-live-play span {

  width: 0;

  height: 0;


  margin-left: 6px;


  border-top:

    11px solid transparent;


  border-bottom:

    11px solid transparent;


  border-left:

    18px solid #111;

}



/* INFORMACIÓN */


.media-video-live-content {

  display: flex;

  flex-direction: column;


  justify-content: center;


  padding: 42px;

}


.media-video-live-time {

  font-size: 48px;

  line-height: 1;


  font-weight: 700;

}


.media-video-live-date {

  margin-top: 8px;


  font-size: 11px;


  opacity: .65;

}


.media-video-live-content h2 {

  margin: 38px 0 0;


  font-size: 32px;

  line-height: 1.05;


  font-weight: 700;


  letter-spacing: -.025em;

}


.media-video-live-content p {

  margin: 17px 0 0;


  font-size: 12px;

  line-height: 1.7;


  opacity: .75;

}


.media-video-live-place {

  margin-top: 20px;


  font-size: 11px;


  opacity: .6;

}


.media-video-live-button {

  min-width: 160px;


  margin-top: 28px;


  background: #fff;


  color: #111 !important;

}



/* ==========================================================
   PRÓXIMOS DIRECTOS
========================================================== */


.media-video-live-list {

  margin-top: 26px;


  border-top:

    1px solid #d4d4d4;

}


.media-video-live-row {

  display: grid;


  grid-template-columns:

    110px

    minmax(0, 1fr)

    auto;


  align-items: center;


  gap: 30px;


  min-height: 105px;


  border-bottom:

    1px solid #d4d4d4;

}


.media-video-live-row-time {

  font-size: 30px;

  line-height: 1;


  font-weight: 700;

}


.media-video-live-row-content {

  display: flex;

  flex-direction: column;

}


.media-video-live-row-content span {

  margin-bottom: 5px;


  font-size: 10px;


  font-weight: 600;


  text-transform: uppercase;


  opacity: .5;

}


.media-video-live-row-content strong {

  font-size: 18px;

  line-height: 1.2;


  font-weight: 700;

}


.media-video-live-row-content small {

  margin-top: 5px;


  font-size: 11px;


  opacity: .58;

}


.media-video-live-row > a {

  font-size: 10px;


  white-space: nowrap;

}

/* ==========================================================
   MÁS VÍDEOS
========================================================== */


.media-video-more {

  padding: 58px 0 70px;


  background: #fff;


  border-top: 1px solid #e7e7e7;

}


.media-video-more-heading {

  padding-bottom: 24px;

}


.media-video-more-grid {

  display: grid;


  grid-template-columns:

    repeat(3, minmax(0, 1fr));


  gap: 28px;

}



/* ==========================================================
   CIERRE
========================================================== */


.media-video-all {

  padding: 42px 0 48px;


  background: #111;


  color: #fff;

}


.media-video-all-link {

  display: flex;

  align-items: center;


  gap: 30px;

}


.media-video-all-link > span {

  font-size:

    clamp(38px, 4.5vw, 64px);


  line-height: 1;


  font-weight: 700;


  letter-spacing: -.035em;

}


.media-video-all-link b {

  display: flex;


  flex: 1;


  align-items: center;


  gap: 18px;


  font-size: 38px;


  line-height: 1;


  font-weight: 200;

}


.media-video-all-link b::before {

  content: "";


  flex: 1;


  height: 1px;


  background:

    rgba(255,255,255,.45);

}


.media-video-all-link:hover b {

  transform: translateX(6px);

}



/* ==========================================================
   ANCLAS
========================================================== */


.media-video-anchor {

  position: relative;


  top: -180px;


  height: 0;


  visibility: hidden;


  pointer-events: none;

}



/* ==========================================================
   TABLET
========================================================== */


@media (max-width: 1199px) {


  .media-videos {

    --media-video-padding: 28px;

  }


  .media-video-hero {

    height: 560px;

    min-height: 560px;

  }


  .media-video-hero-content {

    grid-template-columns:
      minmax(0, 1fr)
      minmax(300px, 360px);

    gap: 40px;

  }


  .media-video-hero-live-card h2 {

    font-size: 24px;

  }


  .media-video-latest-layout {

    grid-template-columns:

      27%

      73%;

  }


  .media-video-section-intro {

    padding-right: 32px;

  }


  .media-video-featured-grid {

    height: 520px;

  }


  .media-video-channel-card {

    height: 360px;

  }


}



/* ==========================================================
   MÓVIL
========================================================== */


@media (max-width: 767px) {


  .media-videos {

    --media-video-padding: 18px;

  }



  /* HERO */


  .media-video-hero {

    height: auto;

    min-height: 600px;

  }


  .media-video-hero-content {

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: stretch;

    min-height: 600px;

    padding-top: 28px;

    padding-bottom: 72px;

  }


  .media-video-hero-copy {

    width: 100%;

    max-width: none;

  }


  .media-video-hero-side {

    width: 100%;

    gap: 16px;

    margin-top: 24px;

  }


  .media-video-hero-live-card {

    padding: 16px;

    background: rgba(0,0,0,.58);

  }


  .media-video-hero-live-card h2 {

    margin-top: 17px;

    font-size: 22px;

  }


  .media-video-hero-live-card p {

    margin: 9px 0 16px;

  }


  .media-video-hero-live-cta {

    min-height: 54px;

    padding: 0 14px;

  }


  .media-video-hero h1 {

    margin: 22px 0 18px;


    font-size: 54px;

  }


  .media-video-hero-description {

    margin-bottom: 24px;

  }


  .media-video-hero-actions {

    flex-direction: column;

  }


  .media-video-btn {

    width: 100%;

  }


  .media-video-hero-counter {

    position: static;

    align-items: flex-start;

    text-align: left;

  }



  /* SUBNAV */


  .media-video-subnav {

    height: 64px;

  }


  .media-video-subnav-inner {

    height: 64px;

  }


  .media-video-subnav-categories a {

    padding: 0 18px;


    font-size: 13px;

    line-height: 64px;

  }


  .media-video-subnav-categories a:first-child {

    padding-left: 0;

    padding-right: 22px;

  }



  /* ÚLTIMOS */


  .media-video-latest {

    padding: 38px 0 42px;

  }


  .media-video-latest-layout {

    display: flex;

    flex-direction: column;

  }


  .media-video-section-intro {

    display: contents;

  }


  .media-video-section-intro
  .media-video-eyebrow {

    order: 1;


    margin: 0 0 18px;

  }


  .media-video-section-intro h2 {

    order: 2;


    margin: 0 0 28px;


    font-size: 40px;

  }


  .media-video-featured-grid {

    order: 3;


    display: grid;


    height: auto;


    grid-template-columns:

      1fr 1fr;


    grid-template-rows:

      360px

      210px;

  }


  .media-video-featured-main {

    grid-column: 1 / 3;

    grid-row: 1;

  }


  .media-video-featured-small:nth-child(2) {

    grid-column: 1;

    grid-row: 2;

  }


  .media-video-featured-small:nth-child(3) {

    grid-column: 2;

    grid-row: 2;

  }


  .media-video-section-intro
  .media-video-text-link {

    order: 4;


    align-self: flex-start;


    margin: 24px 0 0;

  }


  .media-video-featured-main
  .media-video-card-info h3 {

    font-size: 20px;

  }


  .media-video-featured-small
  .media-video-card-info h3 {

    font-size: 14px;

  }



  /* DIRECTO */


  .media-video-live {

    padding: 38px 0 45px;

  }


  .media-video-live-main {

    display: block;


    min-height: 0;

  }


  .media-video-live-visual {

    min-height: 0;


    aspect-ratio: 16 / 10;

  }


  .media-video-live-play {

    width: 64px;

    height: 64px;

  }


  .media-video-live-content {

    padding: 28px 22px 32px;

  }


  .media-video-live-time {

    font-size: 38px;

  }


  .media-video-live-content h2 {

    margin-top: 24px;


    font-size: 28px;

  }



  /* PRÓXIMOS */


  .media-video-live-row {

    grid-template-columns:

      70px

      minmax(0, 1fr);


    gap: 12px;


    min-height: 0;


    padding: 20px 0;

  }


  .media-video-live-row > a {

    grid-column: 2;

  }


  .media-video-live-row-time {

    font-size: 23px;

  }


  .media-video-live-row-content strong {

    font-size: 15px;

  }



  /* CANALES */


  .media-video-channels {

    padding: 34px 0 40px;

  }


  .media-video-channels-heading {

    gap: 16px;


    padding-bottom: 16px;

  }


  .media-video-channel-grid {

    grid-template-columns:

      repeat(2, minmax(0, 1fr));


    gap: 4px;

  }


  .media-video-channel-card {

    height: 250px;

  }


  .media-video-channel-card:nth-child(5) {

    grid-column: 1 / 3;


    height: 280px;

  }


  .media-video-channel-card {

    padding: 0;

  }


  .media-video-channel-card a {

    padding: 16px;

  }


  .media-video-channel-card h3 {

    font-size: 18px;

  }


  .media-video-channel-footer {

    font-size: 11px;

  }



  /* MÁS VÍDEOS */


  .media-video-more {

    padding: 38px 0 45px;

  }


  .media-video-more-grid {

    grid-template-columns: 1fr;


    gap: 40px;

  }



  /* CIERRE */


  .media-video-all {

    padding: 32px 0 36px;

  }


  .media-video-all-link {

    gap: 18px;

  }


  .media-video-all-link > span {

    font-size: 34px;

  }



  /* ANCLAS */


  .media-video-anchor {

    top: -100px;

  }


}
/* ==========================================================
   AJUSTE · LO MÁS RECIENTE · 6 VÍDEOS
   1 principal + 2 secundarios + 3 en segunda fila
========================================================== */

.media-video-latest-content {
  min-width: 0;
}

.media-video-featured-grid-six {
  height: 540px;
}

.media-video-latest-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  margin-top: 34px;
}

.media-video-latest-row .media-video-card {
  min-width: 0;
}

.media-video-latest-row .media-video-card > a {
  height: auto;
}

@media (max-width: 1199px) {
  .media-video-featured-grid-six {
    height: 500px;
  }

  .media-video-latest-row {
    gap: 20px;
    margin-top: 30px;
  }
}

@media (max-width: 767px) {
  .media-video-latest-content {
    order: 3;
    width: 100%;
  }

  .media-video-featured-grid-six {
    height: auto;
  }

  .media-video-latest-row {
    grid-template-columns: 1fr;
    gap: 36px;
    margin-top: 36px;
  }

  .media-video-section-intro .media-video-text-link {
    order: 4;
  }
}

/* ==========================================================
   LO MÁS RECIENTE · PARRILLA 16:9
   Todos los vídeos mantienen formato audiovisual 16:9.
========================================================== */

.media-video-latest-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 18px;
  row-gap: 34px;
  min-width: 0;
}

.media-video-card-grid .media-video-card {
  min-width: 0;
}

.media-video-card-grid .media-video-card > a {
  display: block;
  width: 100%;
  height: auto;
}

.media-video-card-grid .media-video-thumb {
  width: 100%;
  aspect-ratio: 16 / 9;
  flex: none;
}

.media-video-card-grid .media-video-play {
  width: 52px;
  height: 52px;
}

.media-video-card-grid .media-video-play span {
  border-top-width: 7px;
  border-bottom-width: 7px;
  border-left-width: 11px;
}

.media-video-card-grid .media-video-card-info {
  line-height: normal;
  padding-top: 13px;
}

.media-video-card-grid .media-video-card-channels {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}

.media-video-card-grid .media-video-channel-pill {
  display: inline-flex;
  align-items: center;
  min-height: 25px;
  padding: 4px 9px;
  border: 1px solid #c9c9c9;
  border-radius: 999px;
  background: #fff;
  color: #222;
  font-size: 8px;
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: .025em;
  text-transform: uppercase;
  cursor: pointer;
  transition:
    border-color .2s ease,
    background-color .2s ease,
    color .2s ease;
}

.media-video-card-grid .media-video-card:hover
.media-video-channel-pill {
  border-color: #111;
}

.media-video-card-grid .media-video-channel-pill:hover {
  background: #111;
  color: #fff;
}

.media-video-card-grid .media-video-card-info h3 {
  font-size: 16px;
  line-height: 1.22;
}

.media-video-card-grid .media-video-card-description {
  max-height: 6em;
  margin-top: 10px;
  overflow: hidden;
  font-size: 11px;
  line-height: 1.5;
  opacity: .72;
}

.media-video-card-grid .media-video-card-description p {
  margin: 0 0 7px;
}

.media-video-card-grid .media-video-card-description p:last-child {
  margin-bottom: 0;
}

.media-video-card-grid .media-video-card-description ul,
.media-video-card-grid .media-video-card-description ol {
  margin: 0;
  padding-left: 18px;
}

.media-video-card-grid .media-video-card-description li {
  margin: 0 0 3px;
}

.media-video-card-grid .media-video-languages {
  margin-top: 12px;
}

.media-video-audio-note {
  margin-top: 12px;
  font-size: 9px;
  line-height: 1.45;
  font-weight: 600;
  opacity: .65;
}

@media (max-width: 1199px) {

  .media-video-latest-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 16px;
    row-gap: 30px;
  }

}

@media (max-width: 767px) {

  .media-video-latest-layout {
    display: flex;
    flex-direction: column;
  }

  .media-video-latest-grid {
    order: 3;
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .media-video-card-grid .media-video-play {
    width: 56px;
    height: 56px;
  }

  .media-video-card-grid .media-video-card-info h3 {
    font-size: 18px;
  }

}

/* ==========================================================
   PROGRAMACIÓN DE DIRECTOS · PRE FESTIVAL
========================================================== */

.media-video-schedule {
  padding: 58px 0 66px;
  background: var(--media-video-soft);
  border-top: 1px solid #e7e7e7;
  border-bottom: 1px solid #e7e7e7;
}

.media-video-schedule-intro-wide {
  margin-bottom: 28px;
}

.media-video-schedule-intro-wide .media-video-eyebrow {
  color: var(--media-video-muted);
}

.media-video-schedule-intro-grid {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(280px, .55fr);
  align-items: end;
  gap: 70px;
  margin-top: 26px;
}

.media-video-schedule-intro-grid h2 {
  max-width: 720px;
  margin: 0;
  font-size: clamp(38px, 3.8vw, 58px);
  line-height: 1.02;
  font-weight: 700;
  letter-spacing: -.035em;
}

.media-video-schedule-intro-grid p {
  max-width: 440px;
  margin: 0 0 4px;
  font-size: 12px;
  line-height: 1.7;
  color: #555;
}


/* ==========================================================
   BARRA SUPERIOR / CAMBIO DE VISTA
========================================================== */

.media-video-schedule-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 18px;
}

.media-video-schedule-toolbar-note {
  font-size: 10px;
  line-height: 1.3;
  color: #777;
}

.media-video-schedule-full-toggle {
  appearance: none;
  -webkit-appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid #d4d4d4;
  border-radius: 0;
  background: #fff;
  color: #111;
  font: inherit;
  font-size: 10px;
  line-height: 1;
  font-weight: 600;
  text-transform: uppercase;
  cursor: pointer;
}

.media-video-schedule-full-toggle:hover {
  background: #ededed;
}

.media-video-schedule-full-toggle-icon {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.media-video-schedule-full-toggle-icon-grid {
  display: none;
}

.media-video-schedule.is-full-schedule .media-video-schedule-full-toggle-icon-list {
  display: none;
}

.media-video-schedule.is-full-schedule .media-video-schedule-full-toggle-icon-grid {
  display: block;
}

.media-video-schedule-day-mode[hidden],
.media-video-schedule-full-mode[hidden] {
  display: none !important;
}


/* ==========================================================
   CALENDARIO
========================================================== */

.media-video-schedule-calendar {
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  width: 100%;
  margin-bottom: 30px;
  border: 1px solid #d9d9d9;
  background: #fff;
}

.media-video-schedule-day {
  appearance: none;
  -webkit-appearance: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 84px;
  padding: 12px 6px;
  border: 0;
  border-right: 1px solid #e2e2e2;
  border-radius: 0;
  background: #fff;
  color: #111;
  cursor: pointer;
  font: inherit;
}

.media-video-schedule-day:last-child {
  border-right: 0;
}

.media-video-schedule-day span {
  display: block;
  margin-bottom: 7px;
  font-size: 9px;
  line-height: 1;
  font-weight: 600;
  letter-spacing: .06em;
  color: #777;
}

.media-video-schedule-day strong {
  font-size: 24px;
  line-height: 1;
  font-weight: 700;
}

.media-video-schedule-day.active {
  background: #111;
  color: #fff;
}

.media-video-schedule-day.active span {
  color: #fff;
  opacity: .68;
}

@media (hover: hover) and (pointer: fine) {
  .media-video-schedule-day:hover {
    background: #e9e9e9;
  }

  .media-video-schedule-day.active:hover {
    background: #111;
  }
}


/* ==========================================================
   CABECERA DEL DÍA
========================================================== */

.media-video-schedule-panel[hidden] {
  display: none !important;
}

.media-video-schedule-panel-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 20px;
}

.media-video-schedule-panel-head span {
  display: block;
  margin-bottom: 6px;
  font-size: 10px;
  line-height: 1.2;
  font-weight: 600;
  text-transform: uppercase;
  opacity: .5;
}

.media-video-schedule-panel-head h3 {
  margin: 0;
  font-size: 26px;
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: -.02em;
}

.media-video-schedule-panel-head > strong {
  padding-bottom: 2px;
  font-size: 11px;
  line-height: 1.2;
  font-weight: 600;
  opacity: .6;
}


/* ==========================================================
   TARJETAS · 3 POR FILA · 16:9
========================================================== */

.media-video-schedule-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 18px;
  row-gap: 38px;
  width: 100%;
}

.media-video-schedule-card {
  min-width: 0;
}

.media-video-schedule-card-thumb {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #d6d6d6;
}

.media-video-schedule-card-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}

.media-video-schedule-card:hover .media-video-schedule-card-thumb img {
  transform: scale(1.02);
}

.media-video-schedule-card-thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.16) 0%,
      rgba(0,0,0,0) 48%,
      rgba(0,0,0,.45) 100%
    );
  pointer-events: none;
}

.media-video-schedule-card-state {
  position: absolute;
  z-index: 2;
  top: 12px;
  left: 12px;
  padding: 7px 9px;
  background: #fff;
  color: #111;
  font-size: 8px;
  line-height: 1;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.media-video-schedule-card-time {
  position: absolute;
  z-index: 2;
  right: 12px;
  bottom: 11px;
  color: #fff;
  font-size: 22px;
  line-height: 1;
  font-weight: 700;
}

.media-video-schedule-card-body {
  padding-top: 14px;
}

.media-video-schedule-card-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px 10px;
  margin-bottom: 7px;
  font-size: 8px;
  line-height: 1.2;
  font-weight: 600;
  text-transform: uppercase;
  opacity: .55;
}

.media-video-schedule-card-meta span + span::before {
  content: "·";
  margin-right: 10px;
}

.media-video-schedule-card-body h3 {
  margin: 0;
  font-size: 17px;
  line-height: 1.18;
  font-weight: 700;
  letter-spacing: -.012em;
}

.media-video-schedule-card-place {
  margin-top: 7px;
  font-size: 10px;
  line-height: 1.3;
  opacity: .58;
}

.media-video-schedule-card-bottom {
  display: block;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #dedede;
}

.media-video-schedule-card-countdown {
  display: block;
  margin-bottom: 10px;
  font-size: 9px;
  line-height: 1.2;
  font-weight: 600;
}

/* ==========================================================
   VISTA COMPLETA · LISTADO
========================================================== */

.media-video-schedule-full-mode {
  padding-top: 4px;
}

.media-video-schedule-full-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, .55fr);
  align-items: end;
  gap: 50px;
  margin-bottom: 30px;
  padding-bottom: 22px;
  border-bottom: 1px solid #d7d7d7;
}

.media-video-schedule-full-heading span {
  display: block;
  margin-bottom: 7px;
  font-size: 10px;
  line-height: 1.2;
  font-weight: 600;
  text-transform: uppercase;
  opacity: .5;
}

.media-video-schedule-full-heading h3 {
  margin: 0;
  font-size: 32px;
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: -.025em;
}

.media-video-schedule-full-heading p {
  max-width: 390px;
  margin: 0;
  font-size: 11px;
  line-height: 1.6;
  color: #666;
}

.media-video-schedule-full-day {
  margin-top: 38px;
}

.media-video-schedule-full-day:first-of-type {
  margin-top: 0;
}

.media-video-schedule-full-day-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 20px;
  min-height: 46px;
  padding: 0 4px 12px;
  border-bottom: 2px solid #111;
}

.media-video-schedule-full-day-head span {
  font-size: 18px;
  line-height: 1.1;
  font-weight: 700;
}

.media-video-schedule-full-day-head strong {
  font-size: 10px;
  line-height: 1.2;
  font-weight: 600;
  opacity: .55;
}

.media-video-schedule-full-row {
  display: grid;
  grid-template-columns: 80px 180px minmax(0, 1fr) 220px;
  align-items: center;
  gap: 28px;
  min-height: 104px;
  padding: 18px 4px;
  border-bottom: 1px solid #d9d9d9;
}

.media-video-schedule-full-time {
  font-size: 28px;
  line-height: 1;
  font-weight: 700;
}


.media-video-schedule-full-thumb {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #d6d6d6;
}

.media-video-schedule-full-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}

.media-video-schedule-full-thumb:hover img {
  transform: scale(1.02);
}

.media-video-schedule-full-thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.10) 0%,
      rgba(0,0,0,0) 52%,
      rgba(0,0,0,.28) 100%
    );
}

.media-video-schedule-full-thumb .media-video-schedule-full-state {
  position: absolute;
  z-index: 2;
  left: 8px;
  bottom: 8px;
  padding: 5px 7px;
  background: #fff;
  color: #111;
  font-size: 8px;
  line-height: 1;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.media-video-schedule-full-info {
  min-width: 0;
}

.media-video-schedule-full-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 12px;
  margin-bottom: 6px;
  font-size: 9px;
  line-height: 1.2;
  font-weight: 600;
  text-transform: uppercase;
  opacity: .5;
}

.media-video-schedule-full-meta span + span::before {
  content: "·";
  margin-right: 12px;
}

.media-video-schedule-full-info h4 {
  margin: 0;
  font-size: 18px;
  line-height: 1.18;
  font-weight: 700;
}

.media-video-schedule-full-place {
  margin-top: 6px;
  font-size: 10px;
  line-height: 1.3;
  opacity: .58;
}

.media-video-schedule-full-action {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 9px;
}

.media-video-schedule-full-action > span {
  font-size: 9px;
  line-height: 1.2;
  opacity: .6;
}

.media-video-schedule-full-action > a {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  min-height: 40px;
  padding: 0 13px;
  border: 1px solid #111;
  background: #fff;
  color: #111 !important;
  font-size: 9px;
  line-height: 1;
  font-weight: 700;
  text-transform: uppercase;
  white-space: nowrap;
}

.media-video-schedule-full-action > a:hover {
  background: #111;
  color: #fff !important;
}

.media-video-schedule-full-action b {
  font-size: 16px;
  line-height: 1;
  font-weight: 300;
}


/* ==========================================================
   CTA FINAL
========================================================== */

/* ==========================================================
   PROGRAMACIÓN · TABLET
========================================================== */

@media (max-width: 1199px) and (min-width: 768px) {

  .media-video-schedule-intro-grid {
    gap: 40px;
  }

  .media-video-schedule-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .media-video-schedule-day {
    min-height: 78px;
  }

  .media-video-schedule-full-row {
    grid-template-columns: 70px 150px minmax(0, 1fr) 180px;
    gap: 16px;
  }

}


/* ==========================================================
   PROGRAMACIÓN · MÓVIL
========================================================== */

@media (max-width: 767px) {

  .media-video-schedule {
    padding: 38px 0 44px;
  }

  .media-video-schedule-intro-wide {
    margin-bottom: 24px;
  }

  .media-video-schedule-intro-grid {
    display: block;
    margin-top: 22px;
  }

  .media-video-schedule-intro-grid h2 {
    font-size: 38px;
  }

  .media-video-schedule-intro-grid p {
    max-width: none;
    margin-top: 18px;
  }

  .media-video-schedule-toolbar {
    margin-bottom: 16px;
  }

  .media-video-schedule-toolbar-note {
    display: none;
  }

  .media-video-schedule-full-toggle {
    margin-left: auto;
  }

  .media-video-schedule-calendar {
    display: flex;
    width: 100%;
    overflow-x: auto;
    margin-bottom: 26px;
    scrollbar-width: none;
  }

  .media-video-schedule-calendar::-webkit-scrollbar {
    display: none;
  }

  .media-video-schedule-day {
    flex: 0 0 76px;
    min-height: 72px;
  }

  .media-video-schedule-panel-head {
    display: block;
  }

  .media-video-schedule-panel-head h3 {
    font-size: 22px;
  }

  .media-video-schedule-panel-head > strong {
    display: block;
    margin-top: 8px;
  }

  .media-video-schedule-grid {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .media-video-schedule-card-time {
    font-size: 22px;
  }

  .media-video-schedule-card-body h3 {
    font-size: 19px;
  }

  .media-video-schedule-full-heading {
    display: block;
  }

  .media-video-schedule-full-heading h3 {
    font-size: 26px;
  }

  .media-video-schedule-full-heading p {
    margin-top: 14px;
  }

  .media-video-schedule-full-day-head {
    display: block;
    padding-bottom: 11px;
  }

  .media-video-schedule-full-day-head strong {
    display: block;
    margin-top: 6px;
  }

  .media-video-schedule-full-row {
    grid-template-columns: 58px 112px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    padding: 17px 0;
  }

  .media-video-schedule-full-time {
    font-size: 22px;
  }


  .media-video-schedule-full-thumb {
    grid-column: 2;
  }

  .media-video-schedule-full-info {
    grid-column: 3;
  }


  .media-video-schedule-full-action {
    grid-column: 3;
    align-items: flex-start;
  }

  .media-video-schedule-full-action > a {
    width: 100%;
    justify-content: space-between;
  }

  }


/* ==========================================================
   IDIOMAS DISPONIBLES
========================================================== */

.media-video-languages {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 10px;
}

.media-video-languages button {
  appearance: none;
  -webkit-appearance: none;
  min-width: 28px;
  height: 24px;
  padding: 0 6px;
  border: 1px solid #cfcfcf;
  border-radius: 0;
  background: transparent;
  color: #111;
  font: inherit;
  font-size: 8px;
  line-height: 1;
  font-weight: 700;
  cursor: pointer;
}

.media-video-languages button:hover {
  border-color: #111;
  background: #111;
  color: #fff;
}

.media-video-languages-list {
  margin-top: 9px;
}


/* ==========================================================
   LIGHTBOX DE VÍDEO
========================================================== */

html.media-video-lightbox-open,
html.media-video-lightbox-open body {
  overflow: hidden;
}

.media-video-lightbox[hidden] {
  display: none !important;
}

.media-video-lightbox {
  position: fixed;
  z-index: 99999;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 34px;
}

.media-video-lightbox-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.88);
}

.media-video-lightbox-dialog {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  width: min(1500px, 100%);
  max-height: calc(100vh - 68px);
  background: #111;
  color: #fff;
  box-shadow: 0 24px 80px rgba(0,0,0,.35);
}

.media-video-lightbox-close {
  appearance: none;
  -webkit-appearance: none;
  position: absolute;
  z-index: 5;
  top: 14px;
  right: 14px;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid rgba(255,255,255,.45);
  border-radius: 50%;
  background: rgba(0,0,0,.4);
  color: #fff;
  font: inherit;
  font-size: 27px;
  line-height: 38px;
  font-weight: 200;
  cursor: pointer;
}

.media-video-lightbox-player-column {
  display: flex;
  align-items: center;
  min-width: 0;
  min-height: 0;
  padding: 44px;
  background: #000;
}

.media-video-lightbox-player {
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
}

.media-video-lightbox-player iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.media-video-lightbox-info {
  min-width: 0;
  padding: 72px 34px 38px;
  border-left: 1px solid rgba(255,255,255,.16);
  overflow-y: auto;
}

.media-video-lightbox-eyebrow {
  margin-bottom: 16px;
  font-size: 9px;
  line-height: 1.2;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  opacity: .55;
}

.media-video-lightbox-channels {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 18px;
}

.media-video-lightbox-channels[hidden] {
  display: none;
}

.media-video-lightbox-channel-pill {
  display: inline-flex;
  align-items: center;
  min-height: 27px;
  padding: 5px 10px;
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: 8px;
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: .025em;
  text-transform: uppercase;
  cursor: pointer;
  transition:
    border-color .2s ease,
    background-color .2s ease,
    color .2s ease;
}

.media-video-lightbox-channel-pill:hover {
  border-color: #fff;
  background: #fff;
  color: #111;
}

.media-video-lightbox-info h2 {
  margin: 0;
  font-size: 30px;
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: -.025em;
}

.media-video-lightbox-date {
  margin-top: 14px;
  font-size: 11px;
  line-height: 1.4;
  opacity: .6;
}

.media-video-lightbox-description {
  margin-top: 24px;
  font-size: 12px;
  line-height: 1.65;
  opacity: .78;
}

.media-video-lightbox-description p {
  margin: 0 0 12px;
}

.media-video-lightbox-description p:last-child {
  margin-bottom: 0;
}

.media-video-lightbox-description ul,
.media-video-lightbox-description ol {
  margin: 12px 0;
  padding-left: 20px;
}

.media-video-lightbox-description li {
  margin-bottom: 6px;
}

.media-video-lightbox-language-block {
  margin-top: 34px;
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.18);
}

.media-video-lightbox-language-block > span {
  display: block;
  margin-bottom: 12px;
  font-size: 9px;
  line-height: 1.2;
  font-weight: 600;
  text-transform: uppercase;
  opacity: .5;
}

.media-video-lightbox-languages {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.media-video-lightbox-languages button {
  appearance: none;
  -webkit-appearance: none;
  min-width: 38px;
  height: 34px;
  padding: 0 9px;
  border: 1px solid rgba(255,255,255,.38);
  border-radius: 0;
  background: transparent;
  color: #fff;
  font: inherit;
  font-size: 9px;
  line-height: 1;
  font-weight: 700;
  cursor: pointer;
}

.media-video-lightbox-languages button.active,
.media-video-lightbox-languages button:hover {
  border-color: #fff;
  background: #fff;
  color: #111;
}

.media-video-lightbox-audio-note {
  font-size: 11px;
  line-height: 1.55;
  opacity: .78;
}

.media-video-lightbox-place {
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,.18);
  font-size: 10px;
  line-height: 1.5;
  opacity: .6;
}

@media (max-width: 991px) {

  .media-video-lightbox {
    padding: 20px;
  }

  .media-video-lightbox-dialog {
    display: block;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
  }

  .media-video-lightbox-player-column {
    padding: 48px 20px 20px;
  }

  .media-video-lightbox-info {
    padding: 28px 22px 34px;
    border-top: 1px solid rgba(255,255,255,.16);
    border-left: 0;
  }

}

@media (max-width: 767px) {

  .media-video-lightbox {
    align-items: flex-start;
    padding: 0;
  }

  .media-video-lightbox-dialog {
    width: 100%;
    min-height: 100vh;
    max-height: 100vh;
  }

  .media-video-lightbox-player-column {
    padding: 58px 0 0;
  }

  .media-video-lightbox-close {
    top: 9px;
    right: 9px;
  }

  .media-video-lightbox-info h2 {
    font-size: 25px;
  }

}


/* ==========================================================
   AJUSTES TEMPORALES · SIN AVISO YOUTUBE / SIN CTA INFERIOR
========================================================== */

.media-video-schedule-card-bottom {
  display: block;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #dedede;
}

.media-video-schedule-card-countdown {
  display: block;
  margin-bottom: 0;
}

.media-video-schedule-full-action {
  justify-content: center;
}

/* ==========================================================
   CANALES
========================================================== */

.media-video-channels {
  padding: 56px 0 62px;
  background: #fff;
  border-top: 1px solid #e7e7e7;
}

.media-video-channels-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 28px;
}

.media-video-channels-heading h2 {
  margin: 28px 0 0;
  font-size: clamp(38px, 3.3vw, 54px);
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: -.03em;
}

.media-video-channels-toggle {
  appearance: none;
  -webkit-appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid #d2d2d2;
  border-radius: 0;
  background: #fff;
  color: #111;
  font: inherit;
  font-size: 10px;
  line-height: 1;
  font-weight: 600;
  text-transform: uppercase;
  cursor: pointer;
}

.media-video-channels-toggle:hover {
  border-color: #111;
}

.media-video-channels-toggle svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .2s ease;
}

.media-video-channels-toggle[aria-expanded="true"] svg {
  transform: rotate(180deg);
}


/* ==========================================================
   PARRILLA DE CANALES
========================================================== */

.media-video-channel-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 6px;
}

.media-video-channel-card {
  min-width: 0;
  height: 390px;
}

.media-video-channel-card[hidden] {
  display: none !important;
}

.media-video-channel-card a {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #ddd;
  color: #fff !important;
}

.media-video-channel-card img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s ease;
}

.media-video-channel-card:hover img {
  transform: scale(1.025);
}

.media-video-channel-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.08) 0%,
      rgba(0,0,0,.02) 44%,
      rgba(0,0,0,.78) 100%
    );
}

.media-video-channel-content {
  position: absolute;
  z-index: 2;
  left: 20px;
  right: 20px;
  bottom: 20px;
}

.media-video-channel-content h3 {
  margin: 0;
  font-size: 21px;
  line-height: 1.06;
  font-weight: 700;
  letter-spacing: -.015em;
}

.media-video-channel-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 12px;
  font-size: 11px;
  line-height: 1.2;
  font-weight: 500;
}

.media-video-channel-footer span {
  opacity: .7;
}

.media-video-channel-footer b {
  font-size: 22px;
  line-height: 1;
  font-weight: 300;
  transition: transform .2s ease;
}

.media-video-channel-card:hover .media-video-channel-footer b {
  transform: translateX(4px);
}


/* ==========================================================
   CANALES · TABLET
========================================================== */

@media (max-width: 1199px) {

  .media-video-channel-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .media-video-channel-card {
    height: 340px;
  }

}


/* ==========================================================
   CANALES · MÓVIL
========================================================== */

@media (max-width: 767px) {

  .media-video-channels {
    padding: 38px 0 44px;
  }

  .media-video-channels-heading {
    align-items: flex-end;
    gap: 16px;
    margin-bottom: 22px;
  }

  .media-video-channels-heading h2 {
    margin-top: 20px;
    font-size: 40px;
  }

  .media-video-channels-toggle {
    min-height: 38px;
    padding: 0 10px;
    font-size: 9px;
  }

  .media-video-channel-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px;
  }

  .media-video-channel-card {
    height: 250px;
  }

  .media-video-channel-content {
    left: 14px;
    right: 14px;
    bottom: 14px;
  }

  .media-video-channel-content h3 {
    font-size: 18px;
  }

  .media-video-channel-footer {
    font-size: 10px;
  }

}

/* ==========================================================
   FILTROS MEDIA · VÍDEOS
   Edición · Día · Canal · Película · Idioma
========================================================== */

.media-video-filters {
  position: relative;
  z-index: 30;
  padding: 28px 0 30px;
  background: #fff;
  border-bottom: 1px solid #dedede;
}

.media-video-filter-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid #dedede;
  border-left: 1px solid #dedede;
}

.media-video-filter-wrap {
  position: relative;
  min-width: 0;
}

.media-video-filter-trigger {
  appearance: none;
  -webkit-appearance: none;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  min-height: 72px;
  padding: 12px 38px 12px 16px;
  border: 0;
  border-right: 1px solid #dedede;
  border-bottom: 1px solid #dedede;
  border-radius: 0;
  background: #fff;
  color: #111;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.media-video-filter-trigger > span {
  margin-bottom: 5px;
  font-size: 10px;
  line-height: 1.2;
  text-transform: uppercase;
  opacity: .55;
}

.media-video-filter-trigger > b {
  display: block;
  max-width: 100%;
  overflow: hidden;
  font-size: 13px;
  line-height: 1.25;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.media-video-filter-trigger > i {
  position: absolute;
  top: 50%;
  right: 16px;
  margin-top: -9px;
  font-size: 17px;
  line-height: 18px;
  font-style: normal;
  font-weight: 400;
}

.media-video-filter-trigger:hover,
.media-video-filter-trigger[aria-expanded="true"] {
  background: #f3f3f3;
}

.media-video-filter-trigger[aria-expanded="true"] > i {
  transform: rotate(180deg);
}

.media-video-filter-dropdown {
  position: absolute;
  z-index: 50;
  top: calc(100% - 1px);
  left: 0;
  display: none;
  width: max-content;
  min-width: 100%;
  max-width: min(420px, calc(100vw - 36px));
  max-height: 390px;
  overflow-y: auto;
  border: 1px solid #d8d8d8;
  background: #fff;
  box-shadow: 0 12px 24px rgba(0,0,0,.09);
}

.media-video-filter-dropdown.is-open {
  display: block;
}

.media-video-filter-dropdown-right {
  right: 0;
  left: auto;
}

.media-video-filter-option {
  appearance: none;
  -webkit-appearance: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 10px 14px;
  border: 0;
  border-bottom: 1px solid #ededed;
  border-radius: 0;
  background: #fff;
  color: #111;
  font: inherit;
  font-size: 12px;
  line-height: 1.3;
  text-align: left;
  cursor: pointer;
}

.media-video-filter-option:last-child {
  border-bottom: 0;
}

.media-video-filter-option:hover {
  background: #f3f3f3;
}

.media-video-filter-option.active {
  background: #111;
  color: #fff;
}

.media-video-filter-option small {
  flex: 0 0 auto;
  margin-left: 18px;
  font-size: 10px;
  line-height: 1.2;
  font-weight: 500;
  opacity: .55;
}

.media-video-filter-option.active small {
  opacity: .75;
}

.media-video-filter-dropdown-movies {
  width: min(500px, calc(100vw - 36px));
  max-height: 520px;
  overflow: hidden;
}

.media-video-filter-dropdown-search {
  position: sticky;
  z-index: 2;
  top: 0;
  padding: 10px;
  border-bottom: 1px solid #dedede;
  background: #fff;
}

.media-video-filter-dropdown-search input {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  height: 40px;
  padding: 0 12px;
  border: 1px solid #ccc;
  border-radius: 0;
  outline: none;
  background: #fff;
  color: #111;
  font: inherit;
  font-size: 12px;
}

.media-video-filter-dropdown-search input:focus {
  border-color: #111;
}

.media-video-filter-dropdown-list {
  max-height: 458px;
  overflow-y: auto;
}

.media-video-movie-option {
  align-items: flex-start;
}

.media-video-movie-option > span {
  min-width: 0;
  padding-right: 18px;
}

.media-video-movie-option > small {
  padding-top: 1px;
  white-space: nowrap;
}

.media-video-filter-search {
  display: flex;
  align-items: stretch;
  width: 100%;
  margin-top: 14px;
}

.media-video-filter-search-input {
  appearance: none;
  -webkit-appearance: none;
  flex: 1 1 auto;
  min-width: 0;
  height: 52px;
  padding: 0 18px;
  border: 1px solid #cfcfcf;
  border-right: 0;
  border-radius: 0;
  outline: none;
  background: #fff;
  color: #111;
  font: inherit;
  font-size: 14px;
}

.media-video-filter-search-input::placeholder {
  color: #777;
  opacity: 1;
}

.media-video-filter-search-input:focus {
  border-color: #111;
}

.media-video-filter-search-submit {
  appearance: none;
  -webkit-appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 52px;
  padding: 0;
  border: 1px solid #111;
  border-radius: 0;
  background: #111;
  color: #fff;
  cursor: pointer;
}

.media-video-filter-search-submit:hover {
  background: #333;
}

.media-video-filter-search-submit svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.media-video-filter-dropdown,
.media-video-filter-dropdown-list {
  scrollbar-width: thin;
  scrollbar-color: #aaa transparent;
}

@media (max-width: 1199px) {

  .media-video-filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

}

@media (max-width: 767px) {

  .media-video-filters {
    padding: 18px 0 20px;
  }

  .media-video-filter-grid {
    grid-template-columns: 1fr 1fr;
  }

  .media-video-filter-trigger {
    min-height: 66px;
    padding-left: 13px;
    padding-right: 34px;
  }

  .media-video-filter-trigger > i {
    right: 12px;
  }

  .media-video-filter-dropdown,
  .media-video-filter-dropdown-right {
    position: fixed;
    z-index: 1000;
    top: auto;
    left: 18px;
    right: 18px;
    width: auto;
    min-width: 0;
    max-width: none;
    max-height: 55vh;
  }

  .media-video-filter-search {
    margin-top: 10px;
  }

  .media-video-filter-search-input {
    height: 48px;
    padding: 0 14px;
    font-size: 13px;
  }

  .media-video-filter-search-submit {
    width: 52px;
    height: 48px;
  }

}

/* Programación real: cualquier número de días, conservando el ancho de tarjeta. */
.media-video-schedule-calendar {
  display: flex;
  overflow-x: auto;
}
.media-video-schedule-day {
  flex: 1 0 76px;
}
.media-video-schedule-day small {
  margin-top: 6px;
  font-size: 9px;
}
.media-video-schedule-card[data-video-state="directo"] .media-video-schedule-card-state {
  background: #d71920;
  color: #fff;
}
.media-video-schedule-card .media-video-card-description,
.media-video-schedule-full-row .media-video-card-description {
  margin-top: 8px;
  font-size: 11px;
  line-height: 1.5;
}
.media-video-schedule-card-bottom:empty {
  display: none;
}
.media-video-schedule-card-time {
  max-width: calc(100% - 24px);
  font-size: clamp(14px, 1.8vw, 22px);
}
.media-video-schedule-full-time.is-time-pending {
  overflow-wrap: anywhere;
  font-size: 18px;
  line-height: 1.2;
}

/* Play común con los resultados del archivo. */
.media-video-archive-play{position:absolute;z-index:3;bottom:13px;left:14px;display:grid;place-items:center;box-sizing:border-box;width:35px;height:35px;border:1px solid #ffffff99;border-radius:50%;background:#0005;color:white;font-size:12px;padding-left:2px;line-height:1.45;pointer-events:none}
.media-video-schedule-card-thumb .media-video-schedule-card-time{left:auto;right:12px}

/* Fecha privada: la fila conserva calendario y orden, sin columna vacía. */
.media-video-schedule-full-row[data-video-date-hidden="1"] {
  grid-template-columns: 180px minmax(0, 1fr) 220px;
}
@media (max-width: 1199px) and (min-width: 768px) {
  .media-video-schedule-full-row[data-video-date-hidden="1"] {
    grid-template-columns: 150px minmax(0, 1fr) 180px;
  }
}
@media (max-width: 767px) {
  .media-video-schedule-full-row[data-video-date-hidden="1"] {
    grid-template-columns: 112px minmax(0, 1fr);
  }
  .media-video-schedule-full-row[data-video-date-hidden="1"] .media-video-schedule-full-thumb { grid-column: 1; }
  .media-video-schedule-full-row[data-video-date-hidden="1"] .media-video-schedule-full-info,
  .media-video-schedule-full-row[data-video-date-hidden="1"] .media-video-schedule-full-action { grid-column: 2; }
}
.media-video-lightbox-date[hidden],
.media-video-lightbox-language-block[hidden] { display: none !important; }

/* Estado de parrilla separado del play; la vista por días se conserva. */
.media-video-schedule-full-thumb .media-video-schedule-full-state {
  top: 8px;
  bottom: auto;
  left: 8px;
  max-width: calc(100% - 16px);
}
.media-video-hero-live-cta .media-video-archive-play {
  position: relative;
  left: auto;
  bottom: auto;
  flex: 0 0 35px;
}
/* Las miniaturas de 112px necesitan altura para separar estado y play. */
@media (max-width: 767px) {
  .media-video-schedule-full-thumb {
    min-height: 96px;
  }
}


/* ==========================================================
   HERO · MEDIOS RESPONSIVE
   Imagen móvil como poster/fallback y vídeo vertical en móvil.
========================================================== */

.media-video-hero-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.media-video-hero-fallback-picture {
  z-index: 0;
}

.media-video-hero-video {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}


/* ==========================================================
   HERO · OVERLAY POR SLIDE
   Se aplica solo cuando el slide tiene contenido editorial y
   hero_slide_overlay = 1.
========================================================== */

.media-video-hero-slide::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background:
    linear-gradient(
      90deg,
      rgba(0, 0, 0, .84) 0%,
      rgba(0, 0, 0, .58) 30%,
      rgba(0, 0, 0, .08) 62%,
      rgba(0, 0, 0, .22) 100%
    );
}

.media-video-hero-slide.has-overlay::after {
  opacity: 1;
}

.media-video-hero-slide.no-overlay::after {
  display: none;
}

.media-video-hero-content {
  z-index: 2;
}

@media (max-width: 767px) {

  .media-video-hero-slide::after {
    background:
      linear-gradient(
        180deg,
        rgba(0,0,0,.15) 0%,
        rgba(0,0,0,.28) 35%,
        rgba(0,0,0,.92) 100%
      );
  }

}


/* ==========================================================
   HERO · NAVEGACIÓN MÓVIL + SWIPE
========================================================== */

/*
 * Permitimos scroll vertical normal y dejamos que JS interprete
 * únicamente los gestos claramente horizontales.
 */
.media-video-hero,
.media-video-hero-slides {
  touch-action: pan-y;
}

@media (max-width: 767px) {

  /*
   * Reservamos espacio inferior para que los controles del slider
   * queden siempre dentro del hero y no obliguen a hacer scroll.
   */
  .media-video-hero-content {
    padding-bottom: 76px;
  }

  .media-video-hero-controls,
  .media-video-hero-navigation,
  .media-video-hero-nav {
    position: absolute;
    z-index: 6;
    left: var(--media-video-padding);
    right: var(--media-video-padding);
    bottom: 22px;
    margin: 0;
  }

  .media-video-hero-dots,
  .media-video-hero-indicators {
    position: static;
    margin: 0;
  }

}