/* Larger, readable type. Original ivory and warm-gold colors come from styles.css. */
body{font-size:18px}
.wordmark{font-size:clamp(1.45rem,2.2vw,1.8rem);letter-spacing:.11em}
.wordmark span{font-size:.85rem}
/* Branding stays unlined when pointed at or selected; keyboard outline remains. */
.masthead .wordmark,.masthead .wordmark:hover,.masthead .wordmark:active,.masthead .wordmark:focus,.masthead .wordmark:focus-visible{text-decoration:none!important}
nav{font-size:1.0625rem;gap:28px;flex-wrap:wrap}
/* Keep the full desktop navigation on one deliberate line. At narrower
   widths the existing responsive rules below take over and allow wrapping. */
@media(min-width:1101px){
  .masthead{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center}
  .masthead nav{justify-content:flex-end;flex-wrap:nowrap;gap:clamp(12px,1.45vw,24px)}
  .masthead nav a{white-space:nowrap;padding-inline:clamp(10px,1.05vw,15px)}
}
/* Gold trim uses the same warm gold as the coming-soon lettering. */
.masthead nav a{padding:8px 15px;border:1px solid #ffdb9899;border-radius:7px;box-shadow:inset 0 0 7px #ffdb9812,0 0 10px #ffdb9830;text-decoration:none;transition:border-color .2s ease,box-shadow .2s ease}
.masthead nav a:hover,.masthead nav a:focus-visible{border-color:#ffdb98;box-shadow:inset 0 0 9px #ffdb9820,0 0 16px #ffdb9859;text-decoration:none}
.masthead nav .nav-listen{color:#eee5d9}
/* No menu underline in hover, pressed, selected or keyboard-focus states.
   Retain the requested gold frame and the separate accessible focus outline. */
.masthead nav a,.masthead nav a:hover,.masthead nav a:active,.masthead nav a:focus,.masthead nav a:focus-visible,.masthead nav a[aria-current]{text-decoration:none!important}
.masthead nav a::before,.masthead nav a::after{content:none}
.eyebrow{font-size:1rem;letter-spacing:.17em}
.stage-copy h1{font-size:clamp(3.05rem,5.35vw,5.7rem);line-height:1.13}
.stage-copy h1 span{font-size:.72em;line-height:1.2}
.stage-intro .intro,.stage-copy .intro{font-size:1.2rem;line-height:1.7;margin:16px 0 8px}
.stage-intro .discover,.stage-copy .discover{font-size:1.2rem;line-height:1.5;border:0;text-decoration:none;max-width:100%;flex-wrap:wrap;justify-content:center;gap:10px 16px}
.stage-intro .discover:hover,.stage-copy .discover:hover,.stage-copy .discover:focus-visible{text-decoration:none;border:0}
/* Quiet text-only invitation; retain its keyboard focus outline and touch area. */
.stage-copy .discover,.stage-copy .discover:hover,.stage-copy .discover:active,.stage-copy .discover:focus-visible{border:0;text-decoration:none}
.stage-copy .discover{transition:text-shadow .2s ease}
.stage-copy .discover:hover,.stage-copy .discover:active,.stage-copy .discover:focus-visible{text-shadow:0 0 10px #ffdb985c}
@media(prefers-reduced-motion:reduce){.stage-copy .discover{transition:none}}
@media(forced-colors:active){.stage-copy .discover:hover,.stage-copy .discover:active,.stage-copy .discover:focus-visible{text-shadow:none}}
/* Move the announcement only; scene artwork and instrument targets stay fixed. */
.grounded-stage .stage-copy{top:calc(13.5vw + clamp(14px,1.4vw,24px))}
h2{font-size:clamp(2.1rem,3.2vw,3.1rem);line-height:1.2}
h3{font-size:1.3rem;line-height:1.4}
.prose p{font-size:1.15rem;line-height:1.85}
.email{font-size:clamp(1.1rem,2.1vw,1.4rem)}
.prose .small{font-size:1rem;line-height:1.75}
footer{font-size:1rem;line-height:1.75}
.music-credit{font-size:.9375rem;line-height:1.8;max-width:1000px}
.voice-eyebrow,.voice-status,.voice-actions button,.voice-note{font-size:1rem}
#voice-disclosure{font-size:1.1rem}
.voice-captions{font-size:1.15rem}
@media(max-width:1200px){
  .grounded-stage .stage-copy{top:auto;padding-top:60px}
}
@media(max-width:980px){
  .grounded-stage .stage-copy h1{font-size:clamp(2.8rem,7vw,4.35rem)}
}
@media(max-width:600px){
  .masthead{gap:18px}
  nav{font-size:1.0625rem;gap:20px}
  .stage-copy h1,.grounded-stage .stage-copy h1{font-size:clamp(2.5rem,10.5vw,3.65rem)}
  .wordmark{font-size:1.4rem}
  .editorial{gap:28px}
  h2{font-size:2.1rem}
}
@media(max-width:360px){
  .wordmark{font-size:1.25rem;letter-spacing:.08em}
  .stage-copy h1,.grounded-stage .stage-copy h1{font-size:2.4rem}
  nav{gap:16px}
}
@media(prefers-contrast:more),(forced-colors:active){
  .wordmark,h1,h1 span,h2,h3{background:none;color:CanvasText;-webkit-text-fill-color:CanvasText}
}
@media(prefers-reduced-motion:reduce){.masthead nav a{transition:none}}
@media(forced-colors:active){.masthead nav a{border-color:LinkText;box-shadow:none}}
/* Keep the announcement inside the stationary proscenium on smaller screens.
   On phones, put the supporting line and link beneath the artwork so neither
   instrument is covered and the photograph keeps its natural proportions. */
@media(min-width:701px) and (max-width:1200px){
  .grounded-stage .stage-copy{position:absolute;left:50%;transform:translateX(-50%);top:6vw;width:64%;margin:0;padding:0}
  .grounded-stage .stage-copy h1{font-size:clamp(1.6rem,3.8vw,3rem)}
  .grounded-stage .stage-copy .eyebrow{font-size:.7rem;margin-bottom:5px}
  .grounded-stage .stage-copy .intro{font-size:.9rem;margin:8px 0 0}
  .grounded-stage .stage-copy .discover{font-size:1rem;padding:6px 0}
}
@media(max-width:700px){
  .stage.grounded-stage{padding-bottom:112px}
  .grounded-stage .stage-copy{position:absolute;left:50%;transform:translateX(-50%);top:6vw;width:70%;margin:0;padding:0}
  .grounded-stage .stage-copy .eyebrow{font-size:clamp(.5rem,2.1vw,.75rem);line-height:1.4;margin:0 0 4px;letter-spacing:.17em}
  .grounded-stage .stage-copy h1{font-size:clamp(1.25rem,6.2vw,2.5rem);line-height:1.12;white-space:nowrap}
  .grounded-stage .stage-copy h1 span{margin-top:3px;font-size:.72em}
  .grounded-stage .stage-copy .intro{position:absolute;top:calc(50.28vw + 10px);left:50%;transform:translateX(-50%);width:90vw;margin:0;font-size:clamp(.82rem,3.1vw,1.1rem);line-height:1.6}
  .grounded-stage .stage-copy .discover{position:absolute;top:calc(50.28vw + 46px);left:50%;transform:translateX(-50%);width:90vw;font-size:1rem;padding:10px 0}
}