.home-scroll .home-world-transition {
  --world-overlap: clamp(130px, 22vw, 310px);
  position: relative;
  isolation: isolate;
  overflow: clip;
}

.home-scroll .home-world-transition :is(.home-trance, .home-writings) {
  z-index: auto;
  isolation: auto;
  overflow: visible;
  background: transparent;
}

.home-scroll .home-world-transition :is(.trance-art, .writings-art) {
  z-index: 0;
  height: auto;
  overflow: clip;
}

.home-scroll .home-world-transition .trance-art {
  bottom: calc(-1 * var(--world-overlap));
  -webkit-mask-image: linear-gradient(transparent, #000 17%, #000 51%, #0009 72%, transparent 100%);
  mask-image: linear-gradient(transparent, #000 17%, #000 51%, #0009 72%, transparent 100%);
}

.home-scroll .home-world-transition .trance-art::after,
.home-scroll .home-world-transition .writings-art::before {
  content: none;
}

.home-scroll .home-world-transition .trance-art .portal {
  top: 46%;
  opacity: .68;
}

.home-scroll .home-world-transition .trance-art .portal[data-appearance='ornamental'] canvas {
  -webkit-mask-image: radial-gradient(ellipse closest-side, #000 55%, #000b 78%, transparent 100%);
  mask-image: radial-gradient(ellipse closest-side, #000 55%, #000b 78%, transparent 100%);
}

.home-scroll .home-world-transition .home-trance .home-chapter-copy::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: calc(-42px - 22%) calc(-40px - 26%);
  background: radial-gradient(ellipse closest-side, #fffffff7 66%, #ffffffb8 80%, transparent 100%);
  pointer-events: none;
}

.home-scroll .home-world-transition .writings-art {
  top: calc(-1 * var(--world-overlap));
  -webkit-mask-image: linear-gradient(transparent, #0009 25%, #000 52%, #000 78%, transparent 100%);
  mask-image: linear-gradient(transparent, #0009 25%, #000 52%, #000 78%, transparent 100%);
}

.home-scroll .home-world-transition .writings-art .portal {
  position: absolute;
  top: 49%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: .72;
  filter: saturate(1.45) contrast(1.05);
}

@media (max-width: 700px) {
  .home-scroll .home-world-transition .trance-art .portal {
    top: 44%;
    left: 67%;
  }
}