.empire-strip {
  overflow: hidden;
  padding: clamp(72px, 8vw, 115px) 0 clamp(78px, 8vw, 120px);
  border-block: 1px solid var(--line);
  background: radial-gradient(ellipse at 50% 0%, #45281d 0%, #211619 40%, #151011 85%);
}

.empire-strip-heading {
  padding: 0 24px;
  margin: 0 auto 40px;
  text-align: center;
}

.empire-strip-heading h2 {
  margin: 0;
  color: var(--light-gold);
  font: 600 clamp(2.15rem, 4.8vw, 4.6rem)/1.1 var(--serif);
}

.empire-strip-window {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}

.empire-strip-track {
  display: flex;
  width: max-content;
  animation: empire-march 42s linear infinite;
  will-change: transform;
}

.empire-strip-window:hover .empire-strip-track {
  animation-play-state: paused;
}

.empire-strip-set {
  display: flex;
  flex: none;
  gap: 18px;
  padding-right: 18px;
}

.empire-strip figure {
  flex: none;
  width: clamp(300px, 36vw, 510px);
  aspect-ratio: 3 / 2;
  margin: 0;
  overflow: hidden;
  border: 1px solid #b8894c8a;
  background: #2a1a18;
  box-shadow: 0 16px 35px #0005;
}

.empire-strip figure img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
}

@keyframes empire-march {
  to { transform: translateX(-50%); }
}

@media (min-width: 701px) and (max-width: 840px) {
  .site-header { padding-inline: 24px; }
  .site-nav { gap: 15px; }
  .site-nav a { font-size: 10px; }
}

@media (max-width: 700px) {
  .empire-strip-heading { margin-bottom: 28px; }
  .empire-strip-set { gap: 12px; padding-right: 12px; }
  .empire-strip figure { width: 78vw; aspect-ratio: 4 / 3; }
  .empire-strip-track { animation-duration: 50s; }
  .empire-strip-window {
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent);
  }
}

@media (prefers-reduced-motion: reduce) {
  .empire-strip-window { overflow-x: auto; }
  .empire-strip-track { animation: none; will-change: auto; }
  .empire-strip-set[aria-hidden="true"] { display: none; }
}