/* Fine brushed graphite and cool reflected light, kept off text and imagery. */
.top {
  background:
    repeating-linear-gradient(3deg, #b8d0db05 0 1px, transparent 1px 5px),
    linear-gradient(110deg, #1b2833 0%, #0c141e 24%, #0a111a 65%, #141f29);
  border-bottom-color: #415864;
  box-shadow: inset 0 1px #c6e0e31c, 0 6px 22px #02060954;
}

.top .wordmark .mark {
  filter: drop-shadow(0 3px 4px #010609d9);
}

.nav a[aria-current="page"] {
  color: #a1faf4;
}

.nav a:hover,
.nav a[aria-current="page"] {
  text-decoration: underline;
  text-decoration-color: #7cdad8;
  text-decoration-thickness: 1px;
  text-underline-offset: .46em;
}

.hero {
  border-bottom-color: #46616c;
}

.hero-film::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 77% 100%, #66dcd52b 0%, transparent 54%) bottom right / 100% 23% no-repeat,
    linear-gradient(90deg, transparent 12%, #5599a52e 42%, #b3e6e16e 75%, transparent) bottom / 100% 1px no-repeat;
}

.hero-bottom {
  border-top-color: #a8cbd16b;
  box-shadow: inset 0 1px #031019bd;
  background: linear-gradient(180deg, transparent, #08151d69);
}

.home .hero .button-bright {
  background: linear-gradient(155deg, #b9fffa, #66e6e0 55%, #59c4c4);
  border-color: #c0fffc;
  box-shadow: inset 0 1px #f1ffff78, inset 0 -2px #17626748, 0 7px 18px #060b1166;
}

.home .hero .button-bright:hover {
  background: #b9fffa;
}

.home .hero .button-border,
.top .button-border {
  background: linear-gradient(156deg, #2e4651, #111e28 48%);
  border-color: #738e9c;
  box-shadow: inset 0 1px #9cc4c236, 0 4px 12px #05090d58;
}

.home .hero .button-border:hover,
.top .button-border:hover {
  background: #284454;
  border-color: var(--cyan);
}

.home .feature-copy,
.home .capabilities,
.foot {
  background:
    radial-gradient(ellipse at 83% 0%, #35525a36, transparent 66%),
    repeating-linear-gradient(3deg, #91bac306 0 1px, transparent 1px 5px),
    linear-gradient(155deg, #14232c, #080f18 67%);
}

.home .feature {
  box-shadow: inset 0 1px #95c3c426, 0 14px 36px #02050b5c;
}

.home .feature-copy {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

@media (max-width: 850px) {
  .nav.is-open {
    background:
      repeating-linear-gradient(3deg, #b8d0db05 0 1px, transparent 1px 5px),
      linear-gradient(160deg, #1b2a35, #0a131e 75%);
    border-bottom-color: #49626d;
    box-shadow: 0 12px 24px #02060978;
  }

  .nav a {
    text-underline-offset: .32em;
  }
}

@media (forced-colors: active) {
  .hero-film::after {
    content: none;
  }

  .top .nav a[aria-current="page"] {
    color: LinkText;
  }
}
