.nomad-hero {
  --nomad-blue: #9ac4db;
  --nomad-pad: clamp(1.15rem, 4vw, 4.8rem);
  position: relative;
  min-height: calc(100svh - var(--nomad-header-offset, 0px));
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  color: #fff;
  background: #171717;
  font-family: Arial, Helvetica, sans-serif;
}

.nomad-hero,
.nomad-hero * {
  box-sizing: border-box;
}

.nomad-hero img.nomad-hero__image {
  position: absolute;
  inset: 0;
  display: block;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 100%;
  object-fit: cover;
  object-position: center 55%;
  filter: grayscale(1) contrast(1.12);
  animation: nomad-hero-in 1.8s cubic-bezier(.2, .7, .2, 1) both;
}

.nomad-hero__vignette {
  position: absolute;
  inset: 0;
  background: linear-gradient(rgba(0, 0, 0, .2), transparent 38%, rgba(0, 0, 0, .7));
}

.nomad-hero__grain {
  position: absolute;
  inset: -50%;
  opacity: .13;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
  animation: nomad-grain .24s steps(2) infinite;
}

.nomad-hero__coordinates {
  position: absolute;
  z-index: 2;
  right: var(--nomad-pad);
  top: 24%;
  font: .72rem/1 monospace;
  letter-spacing: .12em;
  writing-mode: vertical-rl;
}

.nomad-hero__content {
  position: relative;
  z-index: 2;
  width: 100%;
  padding: 0 var(--nomad-pad) clamp(6rem, 12vh, 8.5rem);
}

.nomad-hero__eyebrow {
  margin: 0 0 1.2rem;
  color: inherit;
  font-size: .78rem;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .21em;
  text-transform: uppercase;
}

.nomad-hero h1 {
  margin: 0;
  color: inherit;
  font: 400 clamp(6rem, 20vw, 18rem)/.7 Georgia, "Times New Roman", serif;
  letter-spacing: -.07em;
  text-transform: none;
}

.nomad-hero h1 span {
  display: inline-block;
  margin: 0 .03em;
  color: var(--nomad-blue);
  font-family: Arial, sans-serif;
  transform: scaleX(1.7);
}

.nomad-hero__copy {
  margin: clamp(2rem, 5vh, 3.8rem) 0 0 51%;
  color: inherit;
  font: italic clamp(1.4rem, 2.5vw, 2.5rem)/1.14 Georgia, serif;
}

.nomad-hero__cue {
  position: absolute;
  z-index: 3;
  right: var(--nomad-pad);
  bottom: 2rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  color: inherit;
  font-size: .72rem;
  line-height: 1;
  letter-spacing: .16em;
  text-decoration: none;
  text-transform: uppercase;
  transition: color .25s ease, transform .25s ease;
}

.nomad-hero .nomad-hero__cue:hover,
.nomad-hero .nomad-hero__cue:focus-visible {
  color: #fff;
  transform: translateX(.3rem);
}

.nomad-hero__cue i {
  position: relative;
  width: 4rem;
  height: 1px;
  background: #fff;
}

.nomad-hero__cue i::after {
  content: "";
  position: absolute;
  right: 0;
  top: -3px;
  width: 7px;
  height: 7px;
  border-top: 1px solid;
  border-right: 1px solid;
  transform: rotate(45deg);
}

@keyframes nomad-grain {
  0% { transform: translate(0); }
  25% { transform: translate(2%, -3%); }
  50% { transform: translate(-3%, 2%); }
  75% { transform: translate(3%, 4%); }
  100% { transform: translate(-2%, -3%); }
}

@keyframes nomad-hero-in {
  0% { opacity: 0; transform: scale(1.04); }
  100% { opacity: 1; transform: scale(1); }
}

@media (max-width: 820px) {
  .nomad-hero {
    min-height: calc(100svh - var(--nomad-header-offset, 0px));
  }
  .nomad-hero img.nomad-hero__image {
    width: 100% !important;
    height: 100% !important;
    min-height: 100%;
    object-fit: cover;
    object-position: center center;
  }
  .nomad-hero__content { padding-bottom: 7.5rem; }
  .nomad-hero h1 { font-size: clamp(5.7rem, 29vw, 10rem); }
  .nomad-hero__copy { margin-left: 18%; font-size: 1.4rem; }
  .nomad-hero__coordinates { display: none; }
  .nomad-hero__cue { right: auto; left: var(--nomad-pad); }
}

@media (prefers-reduced-motion: reduce) {
  .nomad-hero * {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}