/* Progressive enhancement: the original grid remains available without JS. */
.hero-showcase--gallery.hero-deck { display: flex; flex-direction: column; gap: 20px; padding: 0; perspective: none; max-width: 680px; width: 100%; }
.hero-deck-stage { position: relative; width: 100%; aspect-ratio: 1.22; isolation: isolate; touch-action: pan-y; }
.hero-deck .hero-deck-stage .showcase-window { position: absolute; inset: 22% auto auto 12%; width: 76%; margin: 0; animation: none; transform-origin: center; transition: transform 850ms cubic-bezier(.22,.7,.2,1), opacity 650ms, filter 650ms; box-shadow: 0 24px 52px #10091c65; will-change: transform; }
.hero-deck .hero-deck-stage .showcase-window[data-depth="0"] { transform: translate(0, 0) scale(1); z-index: 4; opacity: 1; filter: none; }
.hero-deck .hero-deck-stage .showcase-window[data-depth="1"] { transform: translate(14%, -23%) scale(.87); z-index: 3; opacity: .85; filter: brightness(.8); }
.hero-deck .hero-deck-stage .showcase-window[data-depth="2"] { transform: translate(0, -43%) scale(.73); z-index: 1; opacity: .55; filter: brightness(.65); }
.hero-deck .hero-deck-stage .showcase-window[data-depth="3"] { transform: translate(-14%, 15%) scale(.87); z-index: 2; opacity: .8; filter: brightness(.75); }
.hero-deck .hero-deck-stage .showcase-chrome { padding: 12px 14px; font-size: 13px; }
.hero-deck .hero-deck-stage .showcase-label { display: flex; padding: 16px; }
.hero-deck .hero-deck-stage .showcase-label strong { font-size: 15px; }
.hero-deck .showcase-explore { align-self: center; margin: 0; }
@media (max-width: 1100px) and (min-width: 851px) {
  .hero-deck-stage { aspect-ratio: 1; }
  .hero-deck .hero-deck-stage .showcase-window { top: 26%; }
}
@media (max-width: 600px) {
  .hero-showcase--gallery.hero-deck { gap: 8px; max-width: 440px; }
  .hero-deck-stage { aspect-ratio: 1.05; }
  .hero-deck .hero-deck-stage .showcase-window { width: 82%; left: 9%; top: 21%; border-radius: 10px; }
  .hero-deck .hero-deck-stage .showcase-window[data-depth="1"] { transform: translate(8%, -22%) scale(.88); }
  .hero-deck .hero-deck-stage .showcase-window[data-depth="2"] { transform: translate(0, -39%) scale(.75); }
  .hero-deck .hero-deck-stage .showcase-window[data-depth="3"] { transform: translate(-8%, 13%) scale(.88); }
  .hero-deck .hero-deck-stage .showcase-chrome { min-height: 32px; padding: 8px 10px; font-size: 12px; }
  .hero-deck .hero-deck-stage .showcase-label { padding: 12px; }
  .hero-deck .hero-deck-stage .showcase-label strong { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-deck .hero-deck-stage .showcase-window { transition: none; }
}