html.cinema-ready {
  scroll-behavior: smooth;
}

#nav-logo {
  white-space: nowrap;
  color: #f4f3ed;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.75);
}

#top h1 {
  color: #d3f36a !important;
  text-shadow: 0 3px 10px rgba(0, 0, 0, 0.62), 0 18px 55px rgba(0, 0, 0, 0.48);
}

#top .film-shade {
  background:
    radial-gradient(circle at 26% 70%, rgba(8, 10, 7, 0.58), transparent 48%),
    linear-gradient(90deg, rgba(8, 10, 7, 0.44), transparent 68%),
    linear-gradient(0deg, rgba(8, 10, 7, 0.72), transparent 62%, rgba(8, 10, 7, 0.25));
}

#top #btn-discover,
#top p {
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.72);
}

@media (max-width: 767px) {
  #nav-logo {
    font-size: 19px !important;
    letter-spacing: 0.055em;
  }

  #top h1 {
    text-shadow: 0 3px 9px rgba(0, 0, 0, 0.72), 0 16px 45px rgba(0, 0, 0, 0.58);
  }

  #top .film-shade {
    background:
      radial-gradient(circle at 42% 70%, rgba(8, 10, 7, 0.62), transparent 55%),
      linear-gradient(0deg, rgba(8, 10, 7, 0.78), transparent 68%, rgba(8, 10, 7, 0.28));
  }
}

@media (prefers-reduced-motion: reduce) {
  html.cinema-ready {
    scroll-behavior: auto;
  }
}