/* Royale Editorial Visuals — intentionally theme-agnostic. */
.rvx-editorial {
  position: relative;
  isolation: isolate;
  width: min(1120px, calc(100% - 32px));
  margin: clamp(24px, 4vw, 48px) auto clamp(34px, 6vw, 68px);
  overflow: hidden;
  border: 1px solid color-mix(in srgb, currentColor 16%, transparent);
  border-radius: clamp(16px, 2vw, 28px);
  background: #0c1018;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .24);
}

.rvx-editorial::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04);
}

.rvx-editorial img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1400 / 660;
  object-fit: cover;
  transform: scale(1.002);
}

.rvx-editorial--interlude {
  width: min(960px, calc(100% - 32px));
  margin-block: clamp(42px, 7vw, 88px);
}

@media (max-width: 640px) {
  .rvx-editorial,
  .rvx-editorial--interlude {
    width: calc(100% - 24px);
    margin-block: 24px 42px;
    border-radius: 16px;
  }

  .rvx-editorial img {
    aspect-ratio: 4 / 3;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .rvx-editorial img {
    transition: transform .7s cubic-bezier(.2,.7,.2,1), filter .7s ease;
  }

  .rvx-editorial:hover img {
    transform: scale(1.018);
    filter: saturate(1.08);
  }
}