/* A inherits the existing palette verbatim; B changes backgrounds/contrasts only. */
:root[data-palette="grey"]{
 --color-background:#F3F4F4;--color-surface:#FDFDFD;--color-tint:#E7E9E9;
 --color-text:#272225;--color-muted:#615C60;--color-line:#CACCCD;
 --color-control:#827A7E;--color-dark:#302B2E;--color-dark-line:#A49A9F;
 --color-on-action:#FDFDFD;--color-on-dark:#FDFDFD
}
:root{
 --wp--preset--color--paper:var(--color-background);--wp--preset--color--surface:var(--color-surface);
 --wp--preset--color--ink:var(--color-text);--wp--preset--color--tint:var(--color-tint);
 --wp--preset--color--dark:var(--color-dark);--wp--preset--color--forest:var(--color-action)
}
body{background:var(--color-background);color:var(--color-text)}
.stage-hero{width:91.6%;max-width:1320px;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:40px;min-height:0;margin:30px auto 46px;align-items:center}
.stage-copy{padding:24px 0}.stage-copy h1{margin:0 0 24px;max-width:10.5em;font-size:clamp(42px,4.1vw,59px)}
.stage-copy>p{max-width:44ch}.stage-actions{margin-top:28px}.stage-copy>.stage-video-caption{font-size:13px;line-height:1.5;margin:12px 0 0;color:var(--color-muted)}
.stage-band{margin:0;min-width:0}.stage-band img{display:block;width:100%;height:auto;max-height:none;object-fit:contain;border-radius:6px;filter:none}

.button,.video-button,.menu-toggle{border-radius:6px}

#music-player{max-height:calc(100dvh - 32px);overflow:auto}#close-player{min-height:44px;min-width:44px}
@media(max-width:1050px) and (min-width:761px){.stage-hero{gap:24px}.stage-copy h1{font-size:42px}.stage-listen{font-size:14px;padding:12px 15px}}
@media(max-width:760px){
 .stage-hero{grid-template-columns:1fr;gap:22px;margin:16px auto 26px}
 .stage-copy{padding:8px 0 0}.stage-copy h1{font-size:clamp(34px,9.7vw,42px);margin:0 0 18px;max-width:11em}
 .stage-copy>p{font-size:16px;line-height:1.5}.stage-copy>.stage-video-caption{font-size:13px}.stage-actions{margin-top:22px}
 .stage-listen{font-size:15px;padding:13px 17px}.stage-band{width:100%}
}

/* Long editorial labels must stay usable on small screens. */
.stage-listen{max-width:100%;overflow-wrap:anywhere;white-space:normal}
.stage-copy>.stage-video-caption{overflow-wrap:anywhere}
.player-header h2{min-width:0;overflow-wrap:anywhere}
.player-header{align-items:flex-start;gap:12px}
#close-player{flex-shrink:0}

/* Homepage refinement: scoped to the lead copy and existing band section. */
.stage-copy>.stage-subtitle{font-size:18px;line-height:1.6;color:var(--color-text)}
.stage-subtitle strong{font-weight:600}
.hero-play-icon{display:block;flex:0 0 7px}
.band-story{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:48px}
.band-story picture{display:block}
.band-story .band-photo{width:100%;height:auto;min-height:0;object-fit:contain;border-radius:6px}
.band-story h2{max-width:15ch}
@media(max-width:760px){
 .stage-copy>.stage-subtitle{font-size:17px;line-height:1.6}
 .band-story{grid-template-columns:1fr;gap:25px}
 .band-story h2{max-width:17ch}
}