.home-page {
  background: #052139;
}
.home-page .site-header {
  position: absolute;
  inset: 0 0 auto;
  z-index: 3;
  padding-bottom: 12px;
  background: linear-gradient(180deg, #03152199, #03152173 70%, #03152100);
}
.home-page .site-nav {
  width: 89%;
  max-width: none;
  padding-block: 34px;
}
.hero {
  --hero-height: max(100svh, 720px);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  height: var(--hero-height);
  background: #052139;
  touch-action: pan-y;
}
.ocean {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  pointer-events: none;
  user-select: none;
  z-index: -3;
}
.hull-still {
  position: absolute;
  top: 0;
  left: 50%;
  width: min(100vw, calc(var(--hero-height) * 1536 / 940));
  height: auto;
  transform: translateX(-50%);
  pointer-events: none;
  user-select: none;
  z-index: -2;
}
.hero canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: -1;
}
.hero[data-interactive="true"] .hull-still {
  visibility: hidden;
}
.home-copy {
  position: absolute;
  top: 35.3%;
  left: 5.5%;
  right: 5.5%;
  pointer-events: none;
}
.home-copy h1 {
  margin: 0 0 28px;
  font-size: clamp(48px, 4.43vw, 74px);
  font-weight: 400;
  line-height: 1.34;
  letter-spacing: 0.008em;
  color: #f7f8f9;
}
.home-copy p {
  margin: 0 0 52px;
  max-width: 32em;
  color: #e6eef6;
  font-size: clamp(17px, 1.56vw, 25px);
  line-height: 1.7;
}
.home-download {
  display: inline-flex;
  width: auto;
  min-height: 58px;
  gap: 14px;
  padding: 17px 22px;
  font-size: 19px;
  pointer-events: auto;
}
.home-download svg {
  width: 20px;
  height: 20px;
}
@media (max-width: 900px) {
  .hero {
    --hero-height: max(100svh, 780px);
  }
  .home-page .site-nav {
    width: calc(100% - 48px);
    padding-block: 26px;
  }
  .home-copy {
    top: 142px;
    left: 24px;
    right: 24px;
  }
  .home-copy h1 {
    font-size: clamp(40px, 6vw, 54px);
    margin-bottom: 22px;
  }
  .home-copy p {
    font-size: 16px;
    max-width: 28em;
    margin-bottom: 28px;
  }
  .home-download {
    min-height: 52px;
    padding: 15px 18px;
    font-size: 16px;
  }
  .hull-still {
    width: 160vw;
    max-width: none;
    left: -58.54vw;
    top: calc(76.4% - 65.625vw);
    transform: none;
  }
}
@media (max-width: 360px) {
  .home-copy h1 {
    font-size: 38px;
  }
  .home-copy p {
    font-size: 15px;
  }
}
@media (forced-colors: active) {
  .ocean,
  .hull-still,
  .hero canvas {
    visibility: hidden;
  }
  .hero {
    background: Canvas;
  }
  .home-copy h1,
  .home-copy p {
    color: CanvasText;
  }
}
