/* Shared additions for the Events & Music entry and section navigation. */
.brand-caption { display:block; color:var(--muted); font-size:.57rem; letter-spacing:.22em; line-height:1.5; margin-top:.15rem; }
.hub-header { position:relative; border-bottom:1px solid rgba(255,255,255,.08); background:var(--bg); }
.hub-header .nav { min-height:6.4rem; }
.division-nav { display:flex; gap:.3rem; padding:.25rem; border:1px solid var(--line); border-radius:999px; }
.division-nav a { padding:.45rem 1.2rem; border-radius:999px; color:#cbc5ce; text-decoration:none; font-size:.85rem; font-weight:650; }
.division-nav a:hover { color:var(--gold-bright); background:rgba(241,207,123,.07); }
.division-nav a[aria-current] { color:#16110a; background:var(--gold-bright); }
.nav-contact { color:var(--text); text-decoration:none; font-size:.9rem; border-bottom:1px solid var(--gold); padding:.5rem 0; }
.nav-contact span { color:var(--gold-bright); margin-left:.7rem; }
.gateway-main { width:min(calc(100% - 3rem),var(--max)); margin:auto; }
.gateway-intro { padding:3.7rem 0 2.8rem; text-align:center; }
.gateway-intro .eyebrow { justify-content:center; margin-bottom:1.1rem; font-size:.7rem; }
.gateway-intro .eyebrow::before { display:none; }
.gateway-intro h1 { max-width:none; margin-bottom:1rem; font-size:clamp(3.2rem,5.4vw,5.3rem); line-height:1.04; }
.gateway-intro > p:last-child { color:#bcb6c2; margin-bottom:0; }
.portal-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; }
.portal { position:relative; isolation:isolate; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between; min-height:460px; padding:2rem 2.5rem 2.4rem; border:1px solid rgba(216,175,87,.3); text-decoration:none; background:#171319; transition:border-color .25s,transform .25s; }
.portal::before { content:""; position:absolute; inset:0; z-index:-2; background:url("hero-praktikantika.png") 65% center / cover; transition:transform .7s ease; }
.portal::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,rgba(8,8,10,.98),rgba(8,8,10,.55) 60%,rgba(8,8,10,.36)); }
.portal-music { border-color:rgba(183,150,224,.35); }
.portal-music::before { background-position:95% center; transform:scaleX(-1); filter:hue-rotate(220deg) saturate(.75); }
.portal-music::after { background:linear-gradient(0deg,rgba(15,11,23,.98),rgba(22,13,34,.52) 65%,rgba(22,13,34,.25)); }
.portal-top { display:flex; justify-content:space-between; gap:1rem; color:#ded5c6; font-size:.65rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.portal-top span:last-child { white-space:nowrap; color:var(--gold); }
.portal-content { padding-top:3.5rem; }
.portal-brand { margin:0 0 .4rem; text-transform:uppercase; font-size:.7rem; font-weight:700; letter-spacing:.22em; color:var(--gold-bright); }
.portal h2 { margin-bottom:1.2rem; font-size:clamp(3.8rem,6.4vw,6rem); line-height:.9; }
.portal h2 > span { color:var(--gold-bright); }
.portal-content > p:not(.portal-brand) { color:#d5ced6; font-size:1rem; line-height:1.7; }
.portal-content > .portal-services { font-size:.73rem!important; color:#b8adbd!important; margin:1.4rem 0; }
.portal-action { display:flex; align-items:center; justify-content:space-between; padding-top:1.2rem; border-top:1px solid rgba(241,207,123,.25); color:var(--gold-bright); font-size:.87rem; font-weight:750; }
.arrow-circle { display:grid; place-items:center; width:2.5rem; height:2.5rem; border:1px solid currentColor; border-radius:50%; font-size:1.3rem; transition:background .25s,color .25s; }
.portal-music .portal-brand,.portal-music h2 > span,.portal-music .portal-action,.portal-music .portal-top span:last-child { color:#d9b9fc; }
.portal:hover { border-color:var(--gold-bright); transform:translateY(-3px); }
.portal:hover::before { transform:scale(1.04); }
.portal-music:hover { border-color:#d9b9fc; }
.portal-music:hover::before { transform:scaleX(-1) scale(1.04); }
.portal:hover .arrow-circle { background:var(--gold-bright); color:#08080a; }
.portal-music:hover .arrow-circle { background:#d9b9fc; }
.gateway-note { text-align:center; color:#b6afbd; margin:2.2rem 0 3rem; font-size:.85rem; }
.gateway-note a { text-underline-offset:4px; color:#e5d8ba; }
.division-page .hero { min-height:640px; height:min(85svh,850px); }
.division-page .hero-content { padding-top:6rem; padding-bottom:6rem; }
.division-page .eyebrow { flex-wrap:wrap; }
.section-jump { display:flex; justify-content:center; flex-wrap:wrap; column-gap:2.5rem; row-gap:.5rem; padding:1.3rem 1rem; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.section-jump a { text-decoration:none; color:#c9c1ce; font-size:.85rem; padding:.3rem 0; }
.section-jump a:hover { color:var(--gold-bright); }
.music-page { --gold:#b79ad7; --gold-bright:#dec1ff; --line:rgba(183,154,215,.24); }
.music-page .hero.has-image::before { background:linear-gradient(90deg,rgba(8,8,10,.97),rgba(8,8,10,.8) 40%,rgba(8,8,10,.25) 90%),linear-gradient(0deg,var(--bg),transparent 50%),url("hero-praktikantika.png") 70% center / cover; filter:hue-rotate(220deg) saturate(.75); }
.music-page .hero-content { position:relative; }
.music-page h1 { max-width:930px; font-size:clamp(3.6rem,7.7vw,7.2rem); }
.music-page .hero-copy { max-width:630px; }
.music-page .button:hover { background:#ead6ff; }
.music-page .button-secondary:hover { background:rgba(183,154,215,.1); }
.music-text-link { display:inline-flex; align-items:center; gap:.6rem; padding:.8rem 0; font-size:.85rem; text-underline-offset:5px; }
.music-page .contact-actions { align-items:center; gap:1.4rem; }
.hero-signature { position:absolute; bottom:2rem; right:max(1rem,calc((100% - var(--max)) / 2)); color:#b6a7c5; font-size:.65rem; letter-spacing:.15em; text-transform:uppercase; }
.body-copy { color:var(--muted); max-width:700px; font-size:1.03rem; }
.booking-section { padding-top:0; }
.booking-shell { display:grid; grid-template-columns:1.2fr 1fr; border:1px solid var(--line); background:radial-gradient(ellipse at 5% 0%,rgba(118,81,168,.17),transparent 70%),#111015; }
.booking-intro { padding:clamp(1.7rem,4vw,3.5rem); }
.booking-intro h2 { margin-top:1.8rem; font-size:clamp(2.6rem,4.5vw,4.3rem); }
.booking-intro .lead { font-size:1.1rem; }
.booking-brief { padding:clamp(1.7rem,4vw,3.5rem); border-left:1px solid var(--line); background:rgba(118,81,168,.04); }
.booking-brief dl { margin:0; }
.booking-brief dl > div { border-top:1px solid var(--line); padding:1.5rem 0; }
.booking-brief dt { color:var(--text); font-family:Georgia,serif; font-size:1.5rem; }
.booking-brief dd { margin:.5rem 0 0; color:var(--muted); }
.brief-note { font-size:.85rem; color:#b0a4ba; margin-bottom:0; }
.crosslink { color:var(--muted); font-size:.85rem; margin:1.5rem 0 0; }
.crosslink a,.inline-link { color:var(--gold-bright); text-underline-offset:5px; }
.production-section { padding-top:0; }
.inline-link { display:inline-block; margin-top:1rem; }
.music-contact { padding-top:0; }
.site-footer .footer-links { flex-wrap:wrap; }
.service-grid > *,.portal-grid > *,.booking-shell > * { min-width:0; }
[id] { scroll-margin-top:1.5rem; }
@media(max-width:760px) {
  .gateway-main { width:calc(100% - 2rem); }
  .gateway-intro { padding:2.8rem 0 2rem; }
  .gateway-intro h1 { font-size:clamp(2.6rem,8.8vw,4.3rem); }
  .portal { padding:1.5rem; min-height:440px; }
  .portal-grid { gap:.8rem; }
  .portal-top { font-size:.55rem; }
  .portal-content > p:not(.portal-brand) { font-size:.9rem; }
  .booking-shell { grid-template-columns:1fr; }
  .booking-brief { border-left:0; border-top:1px solid var(--line); }
  .division-page .hero { min-height:620px; height:auto; }
  .division-page .hero-content { padding:5rem 0; }
  .music-page h1 { font-size:clamp(3.4rem,10vw,5.5rem); }
  .music-page .hero.has-image::before { background:linear-gradient(90deg,rgba(8,8,10,.95),rgba(8,8,10,.55)),linear-gradient(0deg,var(--bg),transparent 60%),url("hero-praktikantika.png") 70% center / cover; }
  .hub-header .nav { gap:1rem; min-height:5.5rem; }
  .section-jump { column-gap:1.5rem; }
}
@media(max-width:560px) {
  .portal-grid { grid-template-columns:1fr; gap:1rem; }
  .portal { min-height:390px; padding:1.5rem 1.7rem; }
  .portal h2 { font-size:4.4rem; }
  .portal-top { font-size:.61rem; }
  .portal-content { padding-top:2.5rem; }
  .portal-content > p:not(.portal-brand) { font-size:1rem; }
  .brand { font-size:.69rem; gap:.5rem; letter-spacing:.08em; }
  .brand-mark { width:2rem; font-size:1.1rem; }
  .brand-caption { font-size:.5rem; }
  .division-nav a { padding:.4rem .8rem; font-size:.77rem; }
  .nav-contact { font-size:.8rem; }
  .nav-contact span { display:none; }
  .division-page .hub-header .nav { flex-wrap:wrap; justify-content:space-between; padding:1rem 0; }
  .division-page .hub-header .division-nav { order:3; width:100%; }
  .division-page .division-nav a { flex:1; text-align:center; }
  .gateway-note { text-wrap:balance; line-height:1.9; }
  .hero-signature { font-size:.55rem; }
  .music-page .eyebrow { font-size:.65rem; letter-spacing:.1em; }
  .music-page .eyebrow::before { width:1.1rem; }
  .music-page .hero-content { padding-top:4rem; padding-bottom:5rem; }
  .music-page h1 { font-size:clamp(3rem,11vw,4.2rem); }
  .music-page .contact-actions { gap:.8rem; }
  .music-page .contact-actions .button { width:100%; }
  .music-page .music-text-link { text-align:center; width:100%; justify-content:center; }
  .gateway-page .site-footer { padding-top:1.5rem; gap:1rem; }
  .footer-links { column-gap:1.1rem; row-gap:.7rem; }
}

.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.artist-heading { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr); gap:clamp(2rem,8vw,8rem); margin-bottom:3rem; }
.artist-grid { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.artist-card { display:flex; flex-direction:column; min-width:0; border-right:1px solid var(--line); border-bottom:1px solid var(--line); padding:clamp(1.5rem,4vw,3rem); background:linear-gradient(130deg,rgba(118,81,168,.08),transparent 65%); }
.artist-meta { display:flex; justify-content:space-between; gap:1rem; color:var(--gold); font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; margin-bottom:2.6rem; }
.artist-card h3 { font-family:Georgia,serif; font-weight:500; font-size:clamp(2.2rem,3.6vw,3.4rem); letter-spacing:-.035em; line-height:1.05; margin-bottom:1.2rem; }
.artist-card > p { color:#bfb5c9; max-width:480px; margin-bottom:2rem; }
.artist-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; margin-top:auto; border-top:1px solid var(--line); padding-top:1rem; }
.artist-actions .inline-link { margin-top:0; font-weight:650; font-size:.9rem; }
.artist-source { display:inline-block; font-size:.77rem; color:#b9b0c5; text-underline-offset:4px; }
.stadtfest-feature { display:grid; grid-template-columns:1fr 1fr; gap:3rem; padding:clamp(1.5rem,4vw,3rem); border:1px solid var(--line); margin-top:1.3rem; background:radial-gradient(ellipse at 10% 100%,rgba(216,175,87,.12),transparent 65%),#151119; }
.stadtfest-feature .section-label { color:#f1cf7b; }
.stadtfest-feature h3 { font-family:Georgia,serif; font-size:clamp(2.3rem,3.5vw,3.5rem); font-weight:500; line-height:1.1; letter-spacing:-.03em; margin:2.5rem 0 1.5rem; }
.stadtfest-feature h3 span { color:#f1cf7b; }
.stadtfest-feature p:not(.section-label):not(.lead) { color:#bdb2c7; }
.stadtfest-feature .lead { margin-top:0; }
.stadtfest-feature .artist-source { display:block; margin-top:1.2rem; }
.feature-location { font-size:.85rem; }
.regional-section { padding-top:0; }
.regional-list { list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.regional-list li { display:grid; grid-template-columns:2.5rem 1fr auto; align-items:center; gap:1.5rem; border-bottom:1px solid var(--line); padding:1.5rem .5rem; }
.regional-number { color:var(--gold); font-size:.75rem; }
.regional-list h3 { margin:0; font-family:Georgia,serif; font-size:clamp(1.6rem,3vw,2.4rem); font-weight:500; line-height:1.2; }
.regional-list a { color:var(--gold-bright); font-size:.85rem; text-underline-offset:5px; }
@media(max-width:760px) { .artist-heading { grid-template-columns:1fr; gap:1.3rem; } .stadtfest-feature { gap:1.5rem; } }
@media(max-width:560px) { .artist-grid,.stadtfest-feature { grid-template-columns:1fr; } .artist-meta { margin-bottom:2rem; } .regional-list li { grid-template-columns:1.5rem 1fr auto; gap:.6rem; } .regional-list a { font-size:.75rem; } .regional-list h3 { font-size:1.55rem; } }

/* Visible regional information and consistent company contact details. */
.local-section,.local-faq { padding-top:0; }
.local-faq h3 { font-family:Georgia,serif; font-weight:500; font-size:clamp(1.45rem,2.6vw,1.9rem); line-height:1.25; }
.local-faq article { padding:1.8rem 0; border-top:1px solid var(--line); }
.local-faq article p { color:#c8c2cb; margin-bottom:0; }
.local-faq a { text-underline-offset:4px; }
.footer-company { padding:1.4rem 0; min-width:0; }
.footer-company address { font-style:normal; font-size:.8rem; line-height:1.8; margin-top:.5rem; overflow-wrap:anywhere; color:#aaa4b1; }
.site-footer { flex-wrap:wrap; }
.reference-note { max-width:740px; margin-left:auto; }
@media(max-width:760px) { .local-section .intro-grid,.local-faq .intro-grid { gap:1.4rem; } }

/* Five reference entries at a glance; native details also work without JavaScript. */
.reference-grid { align-items:start; border-left:0; border-top:0; gap:1rem; }
.reference-group { min-height:0; border:1px solid var(--line); }
.reference-kicker { font-family:inherit; line-height:1.5; }
.reference-list.reference-preview,.reference-list.reference-extra { display:grid; grid-template-columns:minmax(0,1fr); gap:0; }
.reference-preview li,.reference-extra li { padding:.65rem 0; border:0; border-bottom:1px solid rgba(255,255,255,.07); border-radius:0; background:transparent; overflow-wrap:anywhere; }
.reference-own { display:block; color:var(--gold); font-size:.68rem; margin-top:.2rem; }
.reference-details { margin-top:1.5rem; }
.reference-details summary { cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:1rem; min-height:44px; color:var(--gold-bright); font-size:.82rem; list-style:none; }
.reference-details summary::-webkit-details-marker { display:none; }
.reference-toggle { font-size:1.4rem; line-height:1; }
.reference-close-label { display:none; }
.reference-details[open] .reference-open-label { display:none; }
.reference-details[open] .reference-close-label { display:inline; }
.reference-details[open] .reference-toggle { transform:rotate(45deg); }
.reference-detail-body { padding-top:1rem; }
.reference-detail-body p { color:#bcb4c4; font-size:.9rem; }

/* Expanded reference view replaces the preview with names and supplied roles. */
.reference-group:has(.reference-details[open]) .reference-preview { display:none; }
.reference-projects { margin:0; }
.reference-project { padding:.85rem 0; border-top:1px solid rgba(255,255,255,.08); }
.reference-project:first-child { border-top:0; padding-top:0; }
.reference-project dt { color:#e4dce9; font-weight:600; font-size:.94rem; line-height:1.45; overflow-wrap:anywhere; }
.reference-project dd { margin:.35rem 0 0; color:#aaa4b1; font-size:.83rem; line-height:1.6; overflow-wrap:anywhere; }
.reference-group:has(.reference-details[open]) .reference-details { margin-top:0; }

/* Artist videos: local preview artwork, click-to-load and no autoplay. */
.artist-media { width:100%; min-width:0; margin:1.2rem 0 1.6rem; }
.artist-media [hidden] { display:none!important; }
.youtube-stage { position:relative; aspect-ratio:16/9; min-height:200px; overflow:hidden; border:1px solid var(--line); background:#100d16; }
.youtube-placeholder { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.75rem; padding:1.1rem; text-align:center; background:linear-gradient(rgba(8,8,10,.55),rgba(8,8,10,.9)),url("hero-praktikantika.png") 80% center/cover; }
.youtube-mark { color:var(--gold-bright); font-size:2rem; line-height:1; }
.youtube-label { color:var(--text)!important; font-size:.9rem!important; margin:0; }
.youtube-load { cursor:pointer; font:700 .8rem/1.3 system-ui; min-height:44px; padding:.65rem 1.1rem; }
.youtube-stage iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.youtube-caption { display:flex; justify-content:space-between; align-items:start; flex-wrap:wrap; gap:.5rem 1rem; margin-top:.7rem; }
.youtube-caption p { color:#c9bdd4!important; font-size:.8rem!important; line-height:1.5; margin:0; max-width:100%; }
.youtube-caption a { color:var(--gold-bright); font-size:.78rem; text-underline-offset:4px; }
.youtube-consent { color:#b5aabb!important; font-size:.72rem!important; line-height:1.6; margin:.75rem 0; }
.youtube-consent a { text-underline-offset:3px; }
.youtube-tools { display:flex; flex-wrap:wrap; gap:.4rem 1.2rem; align-items:center; }
.youtube-tools a,.youtube-close { color:#b5aabb; font:inherit; font-size:.73rem; text-underline-offset:3px; }
.youtube-close { border:0; border-bottom:1px solid currentColor; background:none; padding:.25rem 0; cursor:pointer; min-height:32px; }
.regional-list > li > .artist-media { grid-column:2/-1; max-width:720px; margin:0 0 .75rem; }
.regional-list > li { align-items:start; row-gap:1.1rem; }
.stadtfest-feature > .artist-media { grid-column:1/-1; max-width:760px; margin:0 auto; }
.video-soon { margin:0; color:#b5aabb!important; font-size:.83rem!important; }
@media(max-width:560px) { .regional-list > li > .artist-media { grid-column:1/-1; } .youtube-caption { flex-direction:column; } .youtube-label { font-size:.85rem!important; } }
