.mvr-aet-intro-video {
  background: #fff;
  border: 1px solid #bcdde3;
  border-radius: 26px;
  box-shadow: 0 24px 58px rgba(7, 61, 80, .15);
  margin: 0 0 34px;
  overflow: hidden;
  position: relative;
}

.mvr-aet-intro-lesson .mvr-lms-activity-content__header {
  background-image:
    linear-gradient(90deg, rgba(5, 56, 76, .98) 0%, rgba(6, 83, 101, .93) 40%, rgba(6, 83, 101, .38) 68%, rgba(6, 83, 101, .08) 100%),
    url('images/editorial/mvr-aet-welcome-team-v1-1280.webp');
  background-position: center;
  background-size: cover;
  min-height: 185px;
}

@supports (background-image: image-set(url('images/editorial/mvr-aet-welcome-team-v1-1280.webp') 1x)) {
  .mvr-aet-intro-lesson .mvr-lms-activity-content__header {
    background-image:
      linear-gradient(90deg, rgba(5, 56, 76, .98) 0%, rgba(6, 83, 101, .93) 40%, rgba(6, 83, 101, .38) 68%, rgba(6, 83, 101, .08) 100%),
      image-set(
        url('images/editorial/mvr-aet-welcome-team-v1-768.webp') 1x,
        url('images/editorial/mvr-aet-welcome-team-v1-1280.webp') 1.5x,
        url('images/editorial/mvr-aet-welcome-team-v1-2048.webp') 2x
      );
  }
}

.mvr-aet-intro-video::before {
  background: linear-gradient(90deg, #20b4c8 0 72%, #ed7480 72%);
  content: '';
  height: 5px;
  inset: 0 0 auto;
  position: absolute;
  z-index: 2;
}

.mvr-aet-intro-video__header {
  align-items: center;
  background:
    radial-gradient(circle at 87% 10%, rgba(237, 116, 128, .18), transparent 9rem),
    linear-gradient(125deg, #dff5f7, #f8fcfd 56%, #fff1f3);
  display: flex;
  gap: 24px;
  justify-content: space-between;
  overflow: hidden;
  padding: 27px 28px 24px;
  position: relative;
}

.mvr-aet-intro-video__header::after {
  border: 1px solid rgba(22, 128, 148, .13);
  border-radius: 50%;
  content: '';
  height: 105px;
  position: absolute;
  right: 54px;
  top: -62px;
  width: 105px;
}

.mvr-aet-intro-video__header > div::after {
  background: linear-gradient(90deg, #ed7480, #35bdcc);
  border-radius: 99px;
  content: '';
  display: block;
  height: 3px;
  margin-top: 13px;
  width: 58px;
}

.mvr-aet-intro-video__header p {
  color: #c94f60;
  font-size: .68rem;
  font-weight: 850;
  letter-spacing: .14em;
  margin: 0 0 5px;
  text-transform: uppercase;
}

.mvr-lms-aet-activity .mvr-lms-activity-content__body .mvr-aet-intro-video__header h2 {
  color: #08788e;
  font-size: clamp(1.35rem, 2.7vw, 1.9rem);
  letter-spacing: -.035em;
  line-height: 1.1;
  margin: 0;
  text-shadow: 0 1px 0 #fff;
}

.mvr-aet-intro-video__header > span {
  background: #07566e;
  border: 1px solid #07566e;
  border-radius: 999px;
  box-shadow: 0 7px 18px rgba(7, 86, 110, .15);
  color: #fff;
  flex: 0 0 auto;
  font-size: .75rem;
  font-weight: 850;
  padding: 8px 12px;
  position: relative;
  z-index: 1;
}

.mvr-aet-intro-video__player {
  aspect-ratio: 16 / 9;
  background: #073d50;
  line-height: 0;
  overflow: hidden;
  position: relative;
  width: 100%;
}

.mvr-aet-intro-video__player video {
  background: #073d50;
  display: block;
  height: 100%;
  inset: 0;
  max-height: none;
  object-fit: contain;
  position: absolute;
  width: 100%;
}

.mvr-aet-intro-video__player video:fullscreen,
.mvr-aet-intro-video__player video:-webkit-full-screen {
  object-fit: contain;
}

.mvr-aet-intro-video__footer {
  align-items: center;
  background: #f7fbfc;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  justify-content: center;
  padding: 14px 18px;
}

.mvr-aet-intro-video__footer span {
  align-items: center;
  color: #516d77;
  display: flex;
  font-size: .7rem;
  font-weight: 700;
  gap: 7px;
}

.mvr-aet-intro-video__footer i {
  align-items: center;
  background: #ddf1f2;
  border-radius: 50%;
  color: #176c80;
  display: flex;
  font-size: .58rem;
  font-style: normal;
  font-weight: 900;
  height: 25px;
  justify-content: center;
  width: 25px;
}

.mvr-aet-intro-video__transcript {
  border-top: 1px solid #d8e7e9;
  padding: 14px 22px 17px;
}

.mvr-aet-intro-video__transcript summary {
  color: #176b82;
  cursor: pointer;
  font-size: .78rem;
  font-weight: 800;
}

.mvr-aet-intro-video__transcript p {
  color: #405d67;
  font-size: .84rem;
  line-height: 1.62;
  margin: 12px 0 0;
}

.mvr-aet-intro-video video:focus-visible,
.mvr-aet-intro-video summary:focus-visible {
  outline: 3px solid #e26c78;
  outline-offset: 3px;
}

@media (max-width: 620px) {
  .mvr-aet-intro-lesson .mvr-lms-activity-content__header {
    background-image:
      linear-gradient(90deg, rgba(5, 56, 76, .98) 0%, rgba(6, 83, 101, .9) 52%, rgba(6, 83, 101, .36) 100%),
      url('images/editorial/mvr-aet-welcome-team-v1-768.webp');
    background-position: 58% center;
    min-height: 170px;
  }

  .mvr-aet-intro-video {
    border-radius: 18px;
    margin: 0 0 25px;
  }

  .mvr-aet-intro-video__header {
    align-items: flex-start;
    padding: 21px 18px 17px;
  }

  .mvr-lms-aet-activity .mvr-lms-activity-content__body .mvr-aet-intro-video__header h2 {
    font-size: 1.28rem;
  }

  .mvr-aet-intro-video__header::after {
    display: none;
  }

  .mvr-aet-intro-video__footer {
    align-items: flex-start;
    flex-direction: column;
    padding: 13px 16px;
  }

  .mvr-aet-intro-video__transcript {
    padding: 13px 16px 15px;
  }
}
