.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.hero-art {
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
.carousel-stage {
  width: 100%;
  min-height: 0;
  flex: 1;
  overflow: hidden;
  border-radius: 8px;
  touch-action: pan-y;
}
.carousel-track {
  display: flex;
  width: 100%;
  height: 100%;
  transition: transform .55s cubic-bezier(.2,.7,.2,1);
  will-change: transform;
}
.hero-art .carousel-track .hero-feature,
.hero-art.is-single .carousel-track .hero-feature:not([hidden]) {
  position: relative;
  inset: auto;
  grid-column: auto;
  grid-row: auto;
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 0;
  transform: none;
}
.hero-art .carousel-track .hero-feature:hover { transform: none; }
.hero-art .hero-feature-main img { object-position: center top; }
.hero-feature-copy strong,
.hero-feature-main .hero-feature-copy strong,
.hero-feature-side .hero-feature-copy strong,
.hero-feature-third .hero-feature-copy strong { font-size: clamp(1.3rem, 2.3vw, 2rem); }
.carousel-controls { display: flex; justify-content: center; align-items: center; gap: 1.1rem; min-height: 38px; }
.carousel-controls[hidden] { display: none; }
.carousel-arrow { color: #f7eee7; background: #302832; border: 1px solid #655366; border-radius: 100%; width: 2.25rem; height: 2.25rem; cursor: pointer; }
.carousel-arrow:hover { background: #634b65; }
.carousel-dots { display: flex; gap: .55rem; align-items: center; }
.carousel-dot { width: .7rem; height: .7rem; border: 0; border-radius: 100%; background: #8b7b86; cursor: pointer; padding: 0; }
.carousel-dot[aria-current="true"] { background: #f39861; width: 1.45rem; border-radius: 20px; }
.photo-button { overflow: hidden; border-radius: 7px; }
.photo-button img { transition: filter .2s ease, transform .28s ease; }
.photo-button:hover img, .photo-button:focus-visible img { transform: scale(1.035); filter: brightness(1.06); }
.photo-button:active img { transform: scale(.985); }
.photo-dialog[open] { animation: photo-expand .24s cubic-bezier(.2,.7,.2,1) both; }
@keyframes photo-expand { from { opacity: .45; transform: scale(.94); } to { opacity: 1; transform: scale(1); } }
@media (max-width: 760px) {
  .hero-art { height: 355px; gap: .4rem; }
  .hero-feature-copy strong,
  .hero-feature-main .hero-feature-copy strong,
  .hero-feature-side .hero-feature-copy strong,
  .hero-feature-third .hero-feature-copy strong { font-size: 1.2rem; }
  .carousel-controls { min-height: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .carousel-track, .photo-button img { transition: none; }
  .photo-dialog[open] { animation: none; }
}