:root {
  --bg: #061127;
  --card: #0b1630;
  --shadow: 0 20px 60px rgba(0, 0, 0, .45);
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  min-height: 100vh;
  background:
    radial-gradient(circle at top right, rgba(231, 173, 70, .20), transparent 20%),
    radial-gradient(circle at left 20%, rgba(48, 95, 210, .20), transparent 24%),
    linear-gradient(180deg, #030915 0%, #061127 100%);
  font-family: Arial, Helvetica, sans-serif;
}
img { display: block; max-width: 100%; height: auto; }
.landing {
  width: 100%;
  min-height: 100vh;
  padding: 16px;
}
.poster-frame,
.poster-stack {
  width: min(100%, 1080px);
  margin: 0 auto;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: var(--shadow);
  background: var(--card);
}
.poster-frame img,
.poster-stack img {
  width: 100%;
  height: auto;
}
.poster-stack img + img { margin-top: 0; }
.poster-desktop { display: block; }
.poster-mobile { display: none; }
.skip-link {
  position: absolute;
  left: 12px;
  top: -52px;
  background: #fff;
  color: #000;
  padding: 10px 14px;
  border-radius: 8px;
  z-index: 100;
}
.skip-link:focus { top: 12px; }
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
@media (max-width: 700px) {
  .landing { padding: 0; }
  .poster-desktop { display: none; }
  .poster-mobile { display: block; }
  .poster-stack,
  .poster-frame {
    width: 100%;
    border-radius: 0;
    box-shadow: none;
  }
}
