/* Gallery controls stay inside even the shortest phone landscape viewport. */
.lightbox{max-height:calc(100dvh - 24px);padding:12px;overflow:hidden}
.lightbox .lightbox-image-wrap{height:min(74svh,calc(100dvh - 111px));min-height:0}
.lightbox-controls button,.dialog-close{min-width:44px;min-height:44px}

/* Keep the first invitation visible below the sticky header in landscape. */
@media(max-height:540px) and (orientation:landscape){
  :root{--header-height:60px}
  .site-header{height:var(--header-height)}
  .mobile-nav{top:var(--header-height)}
  .dance-stage{height:calc(100svh - var(--header-height));min-height:0;top:var(--header-height)}
  .hero-topline{display:none}
  .hero-copy{top:18px;max-width:88%}
  .hero-copy h1{font-size:clamp(32px,5.5vw,44px);line-height:1;letter-spacing:-.045em}
  .hero-copy p{font-size:12px;line-height:1.4;margin:8px 0;max-width:360px}
  .hero-copy .button{font-size:11px;padding:10px 18px;min-height:44px}
  .hero-note{font-size:9px;margin-top:8px}
  .hero-bottom{bottom:12px}
  .dance-caption{bottom:12px;max-width:85%}
  .caption-lead{font-size:10px;margin-bottom:8px}
  .dance-caption h2{font-size:clamp(24px,4.5vw,36px);line-height:1.02;margin-bottom:12px}
  .dance-caption .button{font-size:11px;padding:10px 18px;min-height:44px}
}
