.home-hero-inner {
  grid-template-columns: 1fr;
  padding: 7rem clamp(3rem, 9vw, 10rem);
  justify-items: center;
  z-index: 2;
}

@media (min-width: 761px) {
  .main-nav { gap: 1rem; }
  .main-nav a { padding: .45rem .15rem; }
  .main-nav .nav-cta { margin-left: .45rem; padding-inline: 1rem; }
}

.hero-leaves {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 1;
}

.hero-leaves i {
  position: absolute;
  top: -2rem;
  left: var(--leaf-left);
  width: .72rem;
  height: 1.15rem;
  border-radius: 100% 0 100% 0;
  background: rgba(216,255,70,.13);
  transform: rotate(var(--leaf-rotate));
  animation: hero-leaf-fall var(--leaf-duration) linear infinite;
  animation-delay: var(--leaf-delay);
}

.hero-leaves i:nth-child(1){--leaf-left:8%;--leaf-duration:13s;--leaf-delay:-4s;--leaf-rotate:24deg}
.hero-leaves i:nth-child(2){--leaf-left:18%;--leaf-duration:17s;--leaf-delay:-11s;--leaf-rotate:-28deg}
.hero-leaves i:nth-child(3){--leaf-left:31%;--leaf-duration:14s;--leaf-delay:-7s;--leaf-rotate:48deg}
.hero-leaves i:nth-child(4){--leaf-left:43%;--leaf-duration:19s;--leaf-delay:-15s;--leaf-rotate:-18deg}
.hero-leaves i:nth-child(5){--leaf-left:56%;--leaf-duration:15s;--leaf-delay:-3s;--leaf-rotate:35deg}
.hero-leaves i:nth-child(6){--leaf-left:67%;--leaf-duration:18s;--leaf-delay:-10s;--leaf-rotate:-42deg}
.hero-leaves i:nth-child(7){--leaf-left:76%;--leaf-duration:14s;--leaf-delay:-6s;--leaf-rotate:18deg}
.hero-leaves i:nth-child(8){--leaf-left:85%;--leaf-duration:20s;--leaf-delay:-14s;--leaf-rotate:-32deg}
.hero-leaves i:nth-child(9){--leaf-left:93%;--leaf-duration:16s;--leaf-delay:-9s;--leaf-rotate:52deg}
.hero-leaves i:nth-child(10){--leaf-left:25%;--leaf-duration:21s;--leaf-delay:-18s;--leaf-rotate:-12deg}
.hero-leaves i:nth-child(11){--leaf-left:4%;--leaf-duration:16s;--leaf-delay:-8s;--leaf-rotate:38deg}
.hero-leaves i:nth-child(12){--leaf-left:13%;--leaf-duration:22s;--leaf-delay:-16s;--leaf-rotate:-48deg}
.hero-leaves i:nth-child(13){--leaf-left:36%;--leaf-duration:18s;--leaf-delay:-12s;--leaf-rotate:12deg}
.hero-leaves i:nth-child(14){--leaf-left:48%;--leaf-duration:13s;--leaf-delay:-2s;--leaf-rotate:-35deg}
.hero-leaves i:nth-child(15){--leaf-left:61%;--leaf-duration:21s;--leaf-delay:-19s;--leaf-rotate:44deg}
.hero-leaves i:nth-child(16){--leaf-left:72%;--leaf-duration:15s;--leaf-delay:-5s;--leaf-rotate:-22deg}
.hero-leaves i:nth-child(17){--leaf-left:81%;--leaf-duration:19s;--leaf-delay:-13s;--leaf-rotate:30deg}
.hero-leaves i:nth-child(18){--leaf-left:89%;--leaf-duration:17s;--leaf-delay:-1s;--leaf-rotate:-55deg}
.hero-leaves i:nth-child(19){--leaf-left:98%;--leaf-duration:23s;--leaf-delay:-17s;--leaf-rotate:16deg}
.hero-leaves i:nth-child(20){--leaf-left:53%;--leaf-duration:20s;--leaf-delay:-9s;--leaf-rotate:-40deg}
.hero-leaves i:nth-child(3n){background:rgba(246,178,74,.18)}
.hero-leaves i:nth-child(4n){background:rgba(198,92,48,.16);border-radius:0 100% 0 100%}
.hero-leaves i:nth-child(5n){background:rgba(184,65,52,.15);width:.58rem;height:1.35rem;border-radius:100% 0 100% 0}
.hero-leaves i:nth-child(7n){background:rgba(255,211,92,.17);width:.9rem;height:.78rem;border-radius:100% 0 100% 0}
.hero-leaves i:nth-child(2n){transform:rotate(var(--leaf-rotate)) scale(.82)}

@keyframes hero-leaf-fall {
  0% { transform: translate3d(0,-10%,0) rotate(var(--leaf-rotate)); opacity: 0; }
  12% { opacity: .75; }
  50% { transform: translate3d(3rem,48vh,0) rotate(calc(var(--leaf-rotate) + 130deg)); }
  88% { opacity: .35; }
  100% { transform: translate3d(-2rem,105vh,0) rotate(calc(var(--leaf-rotate) + 260deg)); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-leaves i { animation: none; opacity: .22; }
}

.home-hero-inner .hero-copy {
  max-width: 820px;
  width: 100%;
  margin-inline: auto;
  text-align: center !important;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.home-hero-inner .location-pill {
  margin-inline: auto;
}

.home-hero-inner h1,
.home-hero-inner .hero-lead {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.home-hero-inner h1 span {
  display: table;
  white-space: nowrap;
  width: auto;
  margin-inline: auto;
  text-align: center !important;
}

.home-hero-inner h1 {
  width: 100%;
  max-width: none;
  text-align: center !important;
}

.home-hero-inner h1 .hero-subtitle {
  margin-top: .35rem;
  font-size: clamp(2.35rem, 4.4vw, 4.25rem);
  line-height: 1;
  letter-spacing: -.045em;
}

.home-hero-inner .hero-points {
  justify-content: center;
  width: 100%;
}

@media (max-width: 900px) {
  .main-nav {
    gap: .75rem;
  }
}

@media (max-width: 680px) {
  .home-hero-inner {
    padding: 5rem 1.5rem;
  }

  .home-hero-inner h1 span {
    white-space: normal;
  }
}
