/* Anariel: the vessel owns a full row below the text and video. */
.academy-page #travessia.arrival-section {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);
  gap:36px 48px;
  align-items:center;
  min-height:0;
  padding:80px 8% 64px;
  overflow:visible;
}
.academy-page #travessia .arrival-heading {
  width:auto;
  min-width:0;
  grid-column:1;
  grid-row:1;
}
.academy-page #travessia .arrival-heading h2 {
  font-size:clamp(36px,4.8vw,68px);
  overflow-wrap:anywhere;
}
.academy-page #travessia .arrival-heading p {max-width:480px}
.academy-page #travessia .arrival-film {
  position:relative;
  inset:auto;
  grid-column:2;
  grid-row:1;
  width:100%;
  height:auto;
  aspect-ratio:4/3;
  margin:0;
  min-width:0;
  mask-image:radial-gradient(ellipse,black 55%,transparent 75%);
}

.academy-page #travessia .arrival-flight-stage {
  --vessel-size:360px;
  grid-column:1/-1;
  grid-row:2;
  position:relative;
  z-index:5;
  width:100%;
  height:300px;
  min-height:300px;
  margin:0;
  padding:0;
  overflow:visible;
  container-type:normal;
  isolation:isolate;
}
.academy-page #travessia .zolniere-vessel {
  position:absolute;
  top:20px;
  left:0;
  display:block;
  width:var(--vessel-size);
  max-width:100%;
  height:auto;
  margin:0;
  padding:0;
  z-index:1;
  opacity:1;
  visibility:visible;
  transform:none;
  scale:1;
  translate:none;
  rotate:none;
  object-fit:contain;
  mix-blend-mode:normal;
  pointer-events:none;
  animation:zolniere-crossing-right 24s linear infinite;
  filter:drop-shadow(0 12px 12px #34494f18);
}
.academy-page #travessia::after {display:none}
.academy-page #travessia .connecting-star {bottom:0}
@keyframes zolniere-crossing-right {
  from {left:0}
  to {left:calc(100% - var(--vessel-size))}
}
@media(max-width:700px) {
  .academy-page #travessia.arrival-section {
    grid-template-columns:minmax(0,1fr);
    gap:24px;
    padding:60px 7% 48px;
  }
  .academy-page #travessia .arrival-heading {grid-column:1;grid-row:1}
  .academy-page #travessia .arrival-heading h2 {font-size:clamp(32px,8vw,46px)}
  .academy-page #travessia .arrival-film {
    grid-column:1;
    grid-row:2;
    aspect-ratio:16/10;
    margin:0;
    mask-image:linear-gradient(transparent,black 12%,black 86%,transparent);
  }
  .academy-page #travessia .arrival-flight-stage {
    --vessel-size:190px;
    grid-row:3;
    height:180px;
    min-height:180px;
  }
}
@media(max-width:260px) {
  .academy-page #travessia .arrival-flight-stage {--vessel-size:140px}
}
@media(prefers-reduced-motion:reduce) {
  .academy-page #travessia .zolniere-vessel {
    animation:none;
    left:calc(50% - var(--vessel-size)/2);
  }
}
html[data-motion="off"] .academy-page #travessia .zolniere-vessel {
  animation:none;
  left:calc(50% - var(--vessel-size)/2);
}
