/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/3084859
 * @preserve
 */
    .section-video {
  background-color: #003883;
  color: #fff;
  line-height: 1.1;
  padding: 72px 35px;
}
    @media (min-width: 1440px) {.section-video {
      padding: 90px 0
}
    }
    .section-video__title-group {
    margin-bottom: 35px;
  }
    @media (min-width: 1024px) {
    .section-video__title-group {
      display: flex;
      gap: 70px
  }
    }
    .section-video__title {
    color: #fff;
    font-size: 4.5rem;
    font-weight: bold;
    width: 365px;
    margin: 0 0 70px;
    padding-top: 10px;
    border-top: 4px solid #fff;
    max-width: 100%;
  }
    @media (min-width: 1024px) {
    .section-video__title {
    font-size: 6.6rem;
    width: 368px;
  }
  }
    @media (min-width: 1280px) {
    .section-video__title {
    font-size: 7.2rem;
    min-width: 410px;
  }
  }
    .section-video__title {
    margin-bottom: 30px;
}
    @media (min-width: 1024px) {
    .section-video__title {
      margin-bottom: 40px
  }
    }
    @media (min-width: 1280px) {
    .section-video__title {
      margin-bottom: 48px
  }
    }
    .section-video__subtitle {
    font-size: 2rem;
    text-wrap: balance;
    width: 365px;
    max-width: 100%;
    margin-top: 0;
    margin-bottom: 0;
  }
    .section-video__subtitle a {
      color: #fff;
    }
    @media (min-width: 1024px) {
    .section-video__subtitle {
      font-size: 2.6rem;
      width: 368px
  }
    }
    @media (min-width: 1280px) {
    .section-video__subtitle {
      font-size: 2.8rem;
      min-width: 410px
  }
    }
    .section-video__video{
    margin-left: auto;
    margin-right: auto;
    max-width: 600px;
  }
/* ============================================================
   REDESIGN (preview con ?redesign=1) — Section video ("Hear More")
   ============================================================ */
body.redesign .section-video {
    position: relative;
    background: linear-gradient(180deg, #003883 0%, #4daabd 100%);
  }
/* El flex va en .container (los 4 campos son hijos de .container) */
body.redesign .section-video > .container {
    display: flex;
    flex-direction: column;
    gap: 36px;
  }
@media (min-width: 1024px) {
body.redesign .section-video > .container {
      flex-direction: row;
      align-items: center;
      gap: 70px
  }
    }
@media (min-width: 1440px) {
body.redesign .section-video > .container {
      gap: 100px
  }
    }
/* Columna izquierda: título + subtítulo + botón, apilados */
body.redesign .section-video__title-group {
    display: block;
    margin-bottom: 0;
  }
@media (min-width: 1024px) {
body.redesign .section-video__title-group {
      flex: 0 0 40%
  }
    }
body.redesign .section-video__title {
    border-top: none;
    padding-top: 0;
    width: auto;
    min-width: 0;
  }
body.redesign .section-video__subtitle {
    font-weight: 400;
    width: auto;
    min-width: 0;
    font-size: 2.8rem;
  }
@media (min-width: 1024px) {
body.redesign .section-video__subtitle { font-size: 3.8rem
  } }
@media (min-width: 1280px) {
body.redesign .section-video__subtitle { font-size: 4.8rem
  } }
/* Botón "Watch Video" (lo inserta el JS, dispara el mismo lightbox) */
body.redesign .section-video__watch-btn {
    display: inline-block;
    margin-top: 32px;
    background: #003a94;
    color: #fff;
    border-radius: 999px;
    padding: 14px 38px;
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1;
    -webkit-text-decoration: none;
    text-decoration: none;
    cursor: pointer;
    border: none;
  }
/* Oculta el thumbnail del oembed (fuera de pantalla) pero mantiene el
     enlace .glightbox en el DOM: el JS lo dispara para abrir el lightbox. */
body.redesign .section-video__video {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    margin: 0;
    pointer-events: none;
  }
/* Imagen propia (image_video) = columna derecha, clicable → lightbox */
body.redesign .field--name-image-video {
    margin: 0;
    max-width: none;
  }
@media (min-width: 1024px) {
body.redesign .field--name-image-video {
      flex: 1
  }
    }
body.redesign .field--name-image-video img {
      display: block;
      width: 100%;
      border-radius: 16px;
      border: none;
      cursor: pointer;
    }
/* El campo booleano fullwidth_video no debe mostrarse nunca */
.field--name-fullwidth-video {
  display: none;
}
/* La imagen propia (image_video) oculta en la web publicada (sin .redesign) */
body:not(.redesign) .field--name-image-video {
  display: none;
}