:root {
  --eyebrow-green: #7952c7;
  --eyebrow-green-on-dark: #c9b2ff;
}

.eyebrow,
.eyebrow.dark,
.modal .eyebrow,
.modal .eyebrow.dark {
  color: var(--eyebrow-green-on-dark) !important;
}

.hero .eyebrow,
.quote .eyebrow,
.locations .eyebrow,
.contact .eyebrow {
  color: var(--eyebrow-green-on-dark) !important;
}

.modal.about-feature-view .about-feature-copy .eyebrow {
  color: #c9b2ff !important;
}

.accent-green {
  color: var(--eyebrow-green);
}

body,
body * {
  text-shadow: none !important;
}

/* Slightly deeper graded video treatment: strongest upper-left and lower edge. */
.hero .shade {
  background:
    linear-gradient(#092b3678, #092b3618 35%, #092b36de),
    linear-gradient(90deg, #092b3666, transparent) !important;
}

.hero h1 {
  letter-spacing: -.04em !important;
}

/* All overlays scroll vertically only; oversized artwork may not create x-scroll. */
.modal,
.schedule-modal,
.leader-modal,
.modal-panel,
.schedule-window,
.leader-modal-window,
.modal-scroll,
.schedule-scroll,
.leader-modal-scroll,
#modal-content {
  overflow-x: hidden !important;
  overscroll-behavior-x: none;
}

.modal-scroll,
.schedule-scroll,
.leader-modal-scroll {
  touch-action: pan-y;
}

/* Closed fixed overlays must never intercept Chrome device-emulation gestures. */
.modal,
.schedule-modal,
.leader-modal {
  pointer-events: none;
}

.modal.open,
.schedule-modal.open,
.leader-modal.open {
  pointer-events: auto;
}

#modal-content,
.region-overview,
.region-overview > * {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 680px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
    overscroll-behavior-x: none;
  }

  html {
    height: auto !important;
    min-height: 100%;
    overflow-y: scroll !important;
    overscroll-behavior-y: auto;
    touch-action: pan-y;
  }

  body {
    height: auto !important;
    min-height: 100%;
    overflow-y: visible !important;
    touch-action: pan-y;
  }

  body.modal-open,
  body.schedule-modal-open,
  body.leader-modal-open {
    overflow: hidden !important;
  }

  body,
  main,
  header,
  footer,
  section {
    max-width: 100vw;
  }

  nav {
    overflow-x: hidden;
    max-width: 88vw;
  }

  .accessibility-launcher {
    left: auto !important;
    right: max(12px, env(safe-area-inset-right)) !important;
    max-width: 36px;
    transform: none;
  }

  .hero .intro-logo {
    top: calc(12vh - 32px);
  }

  .hero .hero-copy {
    margin-bottom: 18px;
  }
}