/* Recruitment page and full-frame costume artwork */
.demo-grid { display: grid; gap: 18px; grid-template-columns: repeat(3,minmax(0,1fr)); }
.demo-card { min-width: 0; }
.demo-card h3 { margin: 0 0 20px; }
.demo-card audio { display: block; width: 100%; min-width: 0; }
@media(max-width:900px) { .demo-grid { grid-template-columns: 1fr; } }
html { scroll-padding-top: 100px; }
body { font-size: 16px; line-break: strict; overflow-wrap: anywhere; }
.brand, .site-nav a, .button, .audition-status { font-size: 14px; }
.eyebrow, .card .number, .small-note, .site-footer { font-size: 13px; }
.card p, .detail p { font-size: 16px; }
.detail p { margin: 0; color: var(--muted); }
.hero { padding-top: 46px; }
.recruit-title { margin: 0 0 28px; font-size: 19px; font-weight: 500; letter-spacing: .1em; }
.recruit-title span { display: block; margin-top: 5px; font-size: clamp(34px,6vw,64px); font-weight: 750; letter-spacing: .06em; line-height: 1.4; }
.tagline span { display: inline-block; }
.button { color: #171126; background: #bca3eb; min-height: 48px; }
.button.secondary { color: #dfcfff; }
a:focus-visible { outline: 3px solid #dfcfff; outline-offset: 5px; }
.prose p + p { margin-top: 1.2em; }
.prose { color: var(--muted); }
.section h2 { font-size: clamp(29px,4.4vw,48px); line-height: 1.5; }
.season-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.white-season { background: #f0eef7; color: #242034; }
.white-season .number { color: #665079; }
.white-season p { color: #534d61; }
.costume { margin: 32px 0; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; background: #1b1929; }
.costume img { display: block; width: 100%; height: auto; object-fit: contain; }
.costume figcaption { padding: 20px 24px; display: flex; gap: 10px 24px; flex-wrap: wrap; }
.costume figcaption span { color: var(--muted); }
.future { text-align: center; border-top: 1px solid var(--line); }
.future .prose { max-width: 720px; margin: 28px auto 0; }
.member-list { padding-left: 1.4em; margin: 28px 0; }
.member-list li { padding: 7px 0; }
.apply { border-top: 1px solid var(--line); margin-top: 36px; padding-top: 24px; }
.apply h3 { font-size: 23px; }
.apply p { max-width: 760px; color: var(--muted); }
.small-note { color: var(--muted); }
@media (max-width: 760px) {
.site-header { position: relative; flex-direction: column; gap: 8px; padding: 14px 18px; }
.site-nav { justify-content: flex-start; gap: 18px; }
.hero { padding: 34px 18px 48px; }
.season-grid { grid-template-columns: 1fr; }
.section { padding: 42px 0; }
.card { padding: 24px; }
.audition-panel { padding: 25px 20px; }
.future h2 { font-size: 28px; }
.costume figcaption { padding: 16px; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
