/* Desktop hero composition tuned against the selected visual reference. */

@media (min-width: 901px) {
  .hero-layout {
    grid-template-columns: minmax(0, 0.98fr) minmax(0, 1.02fr);
    gap: clamp(16px, 1.5vw, 30px);
  }

  .hero-copy,
  .hero-copy h1 {
    max-width: 930px;
  }

  .hero-copy h1 {
    font-size: clamp(60px, 4.35vw, 88px);
    line-height: 0.98;
  }

  .hero-visual .scene {
    width: 132%;
    margin-left: -30%;
  }

  .hero-rail {
    width: min(52%, 480px);
    justify-self: center;
    transform: translateX(14%);
  }

  .hero-proof {
    right: 4%;
  }
}

@media (min-width: 1800px) {
  .hero-copy,
  .hero-copy h1 {
    max-width: 950px;
  }
}