/* Phones keep native scrolling and deliberate photo choices. */
.hero-stage { position: relative; height: max(calc(100svh - 110px), 610px); overflow: hidden; }
.hero-panel { position: absolute; inset: 0; height: 100%; min-height: 0; }
.hero-panel[hidden], .hero-ui[hidden] { display: none; }
.hero.is-manual .hero-panel:after {
  background: linear-gradient(180deg, #00000080 0%, #00000088 70%, #00000080 100%);
}
.hero.is-manual .hero-panel {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 300ms ease-out, visibility 0s linear 300ms;
}
.hero.is-manual .hero-panel.is-current {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity 300ms ease-out, visibility 0s;
}
.hero-panel figcaption { bottom: 35px; }
.hero-copy { top: 18%; bottom: auto; }
.hero-ui { display: flex; right: 5%; bottom: 24px; }
.hero-select { gap: 8px; }
.hero-select button {
  width: auto;
  min-width: 82px;
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid #ffffff90;
  background: #24202080;
  line-height: 1.5;
}
.hero-select button[aria-pressed="true"] {
  color: var(--ink);
  background: var(--ivory);
  border-color: var(--ivory);
}
@media (max-width: 760px) {
  .hero-stage { height: max(85svh, 640px); }
  .hero-copy { top: 12%; bottom: auto; }
  .hero-panel figcaption { bottom: 92px; }
  .hero-ui { left: 6%; right: 6%; justify-content: flex-start; }
}
@media (max-width: 480px) {
  .hero-copy h1 { font-size: clamp(2.7rem, 12.5vw, 3.1rem); }
}
@media (prefers-reduced-motion: reduce) {
  .hero.is-manual .hero-panel { transition: none !important; }
}