.avatar-hero {
  position: relative;
  scroll-margin-top: 80px;
  width: 100%;
  height: clamp(560px, 42vw, 760px);
  overflow: hidden;
  isolation: isolate;
  background: #070f2c;
  color: #fff;
}
.avatar-hero__media {
  position: absolute;
  inset: 0;
  z-index: -2;
}
.avatar-hero__poster, .avatar-hero__video {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center top;
}
.avatar-hero__video { opacity: 0; }
.avatar-hero.is-video-ready .avatar-hero__video { opacity: 1; }
.avatar-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(5,12,35,.36), transparent 50%);
}
.avatar-hero__content {
  max-width: 1440px;
  margin: 0 auto;
  height: 100%;
  display: flex;
  align-items: center;
  padding: 0 clamp(20px, 5vw, 72px);
  pointer-events: none;
}
.avatar-hero__copy { width: 43%; }
.avatar-hero .avatar-hero__title {
  margin: 0;
  color: #fff;
  font-family: var(--font-heading), sans-serif;
  font-size: clamp(46px, 5.2vw, 76px) !important;
  line-height: 1.07 !important;
  letter-spacing: -.045em !important;
  font-weight: 400;
}
.avatar-hero__title strong { font-weight: 700; }
.avatar-hero__description {
  display: block;
  margin-top: 24px;
  max-width: 420px;
  color: #d1d9ed;
  font: 400 19px/1.6 'Inter', sans-serif;
}
@media (min-width:1200px) {
  .avatar-hero__media { transform: translateX(100px); }
  .avatar-hero::after {
    background: linear-gradient(90deg, #070f2c 100px, rgba(7,15,44,.72) 220px, rgba(7,15,44,0) 55%);
  }
}
@media (min-width:768px) and (max-width:1199px) {
  #top.avatar-hero {
    height: clamp(420px, 47vw, 560px) !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
  }
  .avatar-hero__content { align-items: center; padding-top: 0; }
  .avatar-hero__copy { width: 48%; }
  .avatar-hero .avatar-hero__title { font-size: clamp(40px, 5.2vw, 60px) !important; }
  .avatar-hero__description { margin-top: 18px; font-size: 17px; max-width: 350px; }
  .avatar-hero__media { top: 0; transform: translateX(12%); }
  .avatar-hero__poster { object-position: center top; }
  .avatar-hero__video { display: none; }
  .avatar-hero::after {
    background: linear-gradient(90deg, #070f2c 12%, rgba(7,15,44,.5) 32%, rgba(7,15,44,0) 55%);
  }
}
@media (max-width:767px) {
  #top.avatar-hero {
    height: clamp(590px, calc(100vw + 190px), 620px) !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
  }
  .avatar-hero__content { align-items: flex-start; padding-top: 40px; }
  .avatar-hero__copy { width: 100%; }
  .avatar-hero .avatar-hero__title { font-size: clamp(38px, 9.5vw, 48px) !important; }
  .avatar-hero__description { margin-top: 10px; font-size: 16px; max-width: 320px; }
  .avatar-hero__media { top: 195px; background: #070f2c; }
  .avatar-hero__poster {
    width: clamp(660px, 165vw, 720px);
    height: auto;
    max-width: none;
    left: calc(50% - 55px);
    right: auto;
    top: 25px;
    bottom: auto;
    transform: translateX(-50%);
    object-fit: contain;
  }
  .avatar-hero__video { display: none; }
  .avatar-hero::after {
    background: linear-gradient(180deg, #070f2c 0%, #070f2c 32%, rgba(7,15,44,.85) 37%, rgba(7,15,44,0) 47%);
  }
}