.scrolling-text {
  width: 100%;
  height: 50px;
  overflow: hidden;
  position: relative;
  background: #000;
  color: #fff;
  border-top: 1px solid #2a2a2a;
  border-bottom: 1px solid #2a2a2a;
  font-family: Arial, Helvetica, sans-serif;
}

.scrolling-text-content {
  display: inline-block;
  white-space: nowrap;
  position: absolute;
  min-width: max-content;
  padding: 14px 0;
  animation: chapel-reel-scroll 150s linear infinite;
}

@keyframes chapel-reel-scroll {
  0% { transform: translateX(3vw); }
  100% { transform: translateX(-100%); }
}

.title {
  color: #fff;
  font-weight: 800;
  letter-spacing: .08em;
  text-shadow:
    0 0 5px #f3d28c,
    0 0 10px #b9934f;
}

.subtitle {
  color: #f0cf8b;
  font-weight: 800;
  letter-spacing: .04em;
}

.scrolling-text:hover .scrolling-text-content,
.scrolling-text-content:focus {
  animation-play-state: paused;
}

.scrolling-text-content:focus {
  outline: 2px solid #fff;
  outline-offset: -2px;
}

@media (prefers-reduced-motion: reduce) {
  .scrolling-text-content {
    animation: none !important;
    position: relative;
    transform: none !important;
    white-space: normal;
    min-width: 0;
    padding: 12px 16px;
  }

  .scrolling-text {
    height: auto;
    min-height: 50px;
    overflow-x: auto;
  }
}