/* Original NATHAR hero scenes. Social-cover palette and light, new compositions. */
body.suite-h1 .nh-hero {
  --hero-paper: #0b1712;
  --hero-ink: #f4efe3;
  --hero-muted: #d0d2c3;
  --hero-accent: #f2ab72;
  display: block;
  min-height: 420px;
  background: var(--hero-paper);
  border-color: #384637;
}
body.suite-h1 .nh-hero .nh-copy {
  position: relative;
  z-index: 2;
  width: 55%;
  min-height: 418px;
  margin-left: auto;
  margin-right: 0;
  padding: 30px 36px;
}
body.suite-h1 .nh-hero .nh-visual {
  position: absolute;
  inset: 0 auto 0 0;
  width: 68%;
  height: 100%;
  min-height: 0;
  border: 0;
  background: #0b1712;
  -webkit-mask-image: linear-gradient(to right, #000 52%, transparent 100%);
  mask-image: linear-gradient(to right, #000 52%, transparent 100%);
}
body.suite-h1 .nh-hero .nh-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left center;
  opacity: 1;
  filter: none;
}
body.suite-h1 .nh-hero .nh-visual figcaption { display: none; }
body.suite-h1 .nh-hero .nh-kicker { color: var(--hero-muted); margin-bottom: 18px; justify-content: flex-start; gap: 20px; }
body.suite-h1 .nh-hero .nh-primary {
  color: #142219 !important;
  background: #f2ab72;
  border-color: #f2ab72;
}
body.suite-h1 .nh-hero .nh-primary:hover {
  color: #142219 !important;
  background: #f4efe3;
  border-color: #f4efe3;
}
body.suite-h1 .nh-hero .nh-secondary { color: #f4efe3; border-color: #a1ab96; }
body.suite-h1 .nh-hero .nh-secondary:hover { color: #f2ab72; }
body.suite-h1 .nh-hero a:focus-visible { outline-color: #f2ab72 !important; }
@media (min-width: 701px) and (max-width: 1050px) {
  body.suite-h1 .nh-hero { min-height: 440px; }
  body.suite-h1 .nh-hero .nh-copy { min-height: 438px; width: 58%; padding: 26px; }
  body.suite-h1 .nh-hero .nh-visual { width: 65%; }
}
@media (max-width: 700px) {
  body.suite-h1 .nh-hero { display: flex; flex-direction: column; min-height: 470px; }
  body.suite-h1 .nh-hero .nh-visual {
    position: relative;
    inset: auto;
    order: 1;
    width: 100%;
    height: 164px;
    min-height: 164px;
    -webkit-mask-image: linear-gradient(to bottom, #000 70%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 70%, transparent 100%);
  }
  body.suite-h1 .nh-hero .nh-visual img { object-position: left 48%; }
  body.suite-h1 .nh-hero .nh-copy {
    order: 2;
    width: 100%;
    min-height: 322px;
    padding: 12px 20px 24px;
    margin-top: -18px;
  }
  body.suite-h1 .nh-hero .nh-kicker { margin-bottom: 12px; }
}
@media (max-width: 360px) {
  body.suite-h1 .nh-hero .nh-copy { padding-inline: 18px; }
}