:root{--ink:#111;--paper:#f4f0e8;--gold:#c59a42;--gold2:#e1c273;--pink:#d95c6d;--red:#b83d4d;--white:#fff;--muted:#6c675f}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:var(--paper)}[hidden]{display:none!important}a{color:inherit;text-decoration:none}.container{width:min(1180px,calc(100% - 40px));margin:auto}.nav-wrap{position:fixed;top:0;left:0;right:0;z-index:20;background:rgba(17,17,17,.88);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.1)}.nav{height:78px;display:flex;align-items:center;justify-content:space-between}.brand img{width:62px;height:62px;object-fit:contain}.nav-links{display:flex;gap:28px;align-items:center;color:white;font-size:14px;font-weight:600}.nav-links a:not(.nav-cta){opacity:.8}.nav-links a:hover{opacity:1}.nav-cta{border:1px solid var(--gold);padding:10px 15px;color:var(--gold2)}.menu-btn{display:none;background:none;border:1px solid #555;color:#fff;padding:8px 12px}.hero{position:relative;overflow:hidden;background:radial-gradient(circle at 70% 35%,#452128 0,#1a1516 34%,#0c0c0c 70%);color:white;padding:145px 0 80px}.hero:after{content:"";position:absolute;inset:auto -10% -30% 35%;height:420px;background:linear-gradient(120deg,transparent,rgba(197,154,66,.18),transparent);transform:rotate(-8deg)}.hero-noise{position:absolute;inset:0;opacity:.12;background-image:radial-gradient(#fff .6px,transparent .6px);background-size:4px 4px;mix-blend-mode:soft-light}.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}.eyebrow,.section-kicker{letter-spacing:.18em;text-transform:uppercase;font-size:12px;font-weight:700}.eyebrow{color:var(--gold2)}h1,h2,h3{font-family:"Barlow Condensed",sans-serif;margin:0;line-height:.92}.hero-slogan{display:block;width:min(100%,760px);height:auto;margin:12px 0 8px;filter:drop-shadow(0 10px 24px rgba(0,0,0,.28))}.hero-copy{display:flex;flex-direction:column;align-items:flex-start}.footer-branding{display:flex;flex-direction:column;gap:8px}.footer-slogan{width:min(100%,300px);height:auto}.hero-lead{font-size:27px;margin:28px 0 14px}.hero-text{max-width:700px;font-size:17px;line-height:1.7;color:#d4d1cd}.hero-actions{display:flex;gap:12px;margin:34px 0}.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 20px;font-weight:700;font-size:14px}.btn-gold{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#16120c}.btn-ghost{border:1px solid #5b5656;color:white}.hero-facts{display:flex;gap:22px;flex-wrap:wrap;color:#aaa;font-size:13px}.hero-facts span{padding-left:12px;border-left:1px solid var(--gold)}.hero-visual{position:relative;display:grid;grid-template-columns:1fr;gap:18px;min-height:560px;padding:10px 0 0}.hero-photo-main,.hero-photo-card{position:relative;overflow:hidden;border-radius:24px;box-shadow:0 24px 50px rgba(0,0,0,.32);background:#111}.hero-photo-main{min-height:352px}.hero-photo-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.hero-photo-card{min-height:178px}.hero-photo-main::after,.hero-photo-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,9,9,.06),rgba(9,9,9,.28));pointer-events:none}.hero-photo-img{display:block;width:100%;height:100%;object-fit:cover}.hero-brand-badge{position:absolute;right:-12px;bottom:26px;z-index:3;width:min(54%,300px);padding:20px 18px 18px;border:1px solid rgba(225,194,115,.45);border-radius:24px;background:rgba(12,12,12,.82);backdrop-filter:blur(12px);box-shadow:0 28px 40px rgba(0,0,0,.35)}.hero-logo{display:block;width:min(100%,210px);margin:0 auto 14px;filter:drop-shadow(0 18px 28px rgba(0,0,0,.45));position:relative;z-index:2}.logo-halo{position:absolute;left:50%;top:-90px;transform:translateX(-50%);width:250px;height:250px;border-radius:50%;background:radial-gradient(circle,rgba(217,92,109,.22),rgba(197,154,66,.08) 40%,transparent 70%)}.hero-brand-badge p{position:relative;z-index:2;text-align:center;text-transform:none;font-family:"Barlow Condensed";font-size:18px;letter-spacing:.04em;color:#cfc6ba;margin:0}.ticker{background:var(--gold);overflow:hidden;padding:13px 0}.ticker-track{display:flex;justify-content:center;white-space:nowrap;font-family:"Barlow Condensed";font-weight:800;letter-spacing:.08em;font-size:17px}.ticker-group{display:flex;align-items:center;gap:18px}.ticker-group-clone{display:none}.ticker i{font-style:normal}.section{padding:95px 0}.section-light{background:var(--paper)}.section-dark{background:#111;color:white}.section-live{background:linear-gradient(160deg,#e7e0d4,#f8f5ef)}.split-head{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:end}.section-kicker{margin:0 0 16px;color:var(--red)}.gold{color:var(--gold2)}h2{font-size:clamp(54px,7vw,86px);text-transform:uppercase;max-width:800px}.section-intro{font-size:17px;line-height:1.75;color:var(--muted);margin:0}.music-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:55px}.music-card{background:white;padding:28px;min-height:260px;border-top:4px solid var(--gold)}.music-card span{font-family:"Barlow Condensed";font-weight:800;color:var(--pink)}.music-card h3{font-size:42px;margin:24px 0 12px;text-transform:uppercase}.music-card p{font-size:14px;line-height:1.65;color:#615d57}.formats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:55px}.format{padding:18px 18px 34px;border:1px solid #343434;background:#161616;transition:border-color .22s ease,box-shadow .22s ease}.format.featured{border-color:var(--gold);background:linear-gradient(160deg,#24191a,#161616)}.formats:has(.format:hover) .format{border-color:#343434}.formats:has(.format:hover) .format:hover{border-color:var(--gold);box-shadow:0 0 0 1px rgba(197,154,66,.18)}.format-image-wrap{margin:0 0 22px;border-radius:10px;overflow:hidden;background:#0f0f0f;border:1px solid rgba(255,255,255,.08)}.format-image{display:block;width:100%;height:auto;object-fit:contain}.tag{display:inline-block;color:var(--gold2);font-size:11px;letter-spacing:.15em;font-weight:800;margin-bottom:35px}.format h3{font-size:48px;text-transform:uppercase}.format h3 span{color:var(--pink)}.format p{color:#bbb;line-height:1.6}.format ul{list-style:none;padding:0;margin:28px 0 0}.format li{padding:11px 0;border-top:1px solid #313131;color:#ddd;font-size:14px}.live-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px}.statement p{font-size:19px;line-height:1.75;margin-top:0}.quote{margin-top:28px;border-left:4px solid var(--gold);padding:20px 24px;font-family:"Barlow Condensed";font-size:26px;line-height:1.25;background:rgba(255,255,255,.55)}.event-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:60px}.event-grid div{background:#171717;color:white;padding:26px;text-transform:uppercase;font-family:"Barlow Condensed";font-weight:700;font-size:22px}.text-link{font-weight:700;border-bottom:1px solid var(--gold);padding-bottom:4px}.dates{margin-top:50px}.dates article{display:grid;grid-template-columns:180px 1fr;gap:20px;padding:22px 0;border-top:1px solid #cfc8bb}.dates time{font-family:"Barlow Condensed";font-weight:800;font-size:28px}.dates strong{display:block;font-size:20px}.dates span{display:block;color:var(--muted);margin-top:6px}.band{background:#1a1516;color:white}.band-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:48px;background:#3b3435}.band-grid article{background:#1a1516;padding:26px}.band-grid strong{display:block;font-family:"Barlow Condensed";font-size:34px;text-transform:uppercase;color:var(--gold2)}.band-grid span{font-size:13px;color:#bbb}.booking{padding:95px 0;background:linear-gradient(135deg,#9f3342,#da6070);color:white}.booking-grid{display:grid;grid-template-columns:1fr .85fr;gap:80px;align-items:center}.booking h2{color:white}.booking p{font-size:18px;line-height:1.7;max-width:650px}.booking-card{background:#111;padding:34px;display:flex;flex-direction:column;gap:18px;box-shadow:0 20px 50px rgba(0,0,0,.22)}.booking-card>a:not(.btn){font-family:"Barlow Condensed";font-size:27px;font-weight:700}.booking-card span{color:#aaa;font-size:13px}.booking-card .btn{margin-top:6px}footer{background:#090909;color:white;padding:34px 0}.footer-inner{display:grid;grid-template-columns:80px 1fr auto;align-items:center;gap:20px}.footer-logo{width:66px}.footer-inner strong,.footer-inner span{display:block}.footer-inner span{color:#888;font-size:12px;margin-top:4px}.footer-links{display:flex;gap:22px;font-size:13px;color:#aaa}
@media(max-width:900px){.nav-links{display:none;position:absolute;top:78px;left:0;right:0;background:#111;padding:24px;flex-direction:column}.nav-links.open{display:flex}.menu-btn{display:block}.hero-grid,.split-head,.live-grid,.booking-grid{grid-template-columns:1fr}.hero-visual{min-height:auto;padding-top:8px}.hero-brand-badge{position:relative;right:auto;bottom:auto;width:min(100%,360px);margin:-56px auto 0}.hero-photo-main{min-height:320px}.music-grid,.formats,.band-grid{grid-template-columns:1fr 1fr}.event-grid{grid-template-columns:1fr 1fr}.footer-inner{grid-template-columns:70px 1fr}.footer-links{grid-column:1/-1}.section{padding:70px 0}}
@media(max-width:600px){.container{width:min(100% - 28px,1180px)}.hero{padding-top:120px}.hero-slogan{width:100%;max-width:540px}.hero-lead{font-size:22px}.hero-photo-row,.music-grid,.formats,.band-grid,.event-grid{grid-template-columns:1fr}.hero-photo-main{min-height:260px}.hero-brand-badge{width:100%;max-width:none;margin:0}.dates article{grid-template-columns:1fr}.hero-actions{flex-direction:column}.hero-facts{gap:12px}.footer-slogan{max-width:240px}.section{padding:58px 0}}

/* Termine werden ausschließlich aus termine.txt geladen. */
.dates-loading,.dates-error{color:var(--muted);font-size:14px;margin:0;padding:20px 0}
.dates article.date-item{display:grid;grid-template-columns:180px 1fr;gap:20px;border-top:1px solid #cfc8bb;transition:opacity .2s ease}
.dates article.date-item.future{padding:24px 0;color:var(--ink)}
.dates article.date-item.future time{font-family:"Barlow Condensed";font-weight:800;font-size:30px;line-height:1}
.dates article.date-item.future strong{display:block;font-size:21px;line-height:1.25}
.dates article.date-item.future span{display:block;color:var(--muted);margin-top:7px;font-size:14px}
.dates article.date-item.past{padding:12px 0;color:#9a958d;border-top-color:#ddd7cd}
.dates article.date-item.past time{font-family:"Barlow Condensed";font-weight:600;font-size:19px;line-height:1.2;color:#aaa59d}
.dates article.date-item.past strong{display:block;font-size:14px;line-height:1.3;font-weight:600;color:#969189}
.dates article.date-item.past span{display:block;color:#aaa59d;margin-top:4px;font-size:12px}
.dates .date-extra::before{content:" · ";}
@media(max-width:600px){.dates article.date-item{grid-template-columns:1fr;gap:7px}.dates article.date-item.future{padding:21px 0}.dates article.date-item.past{padding:11px 0}}


@media(max-width:1200px){.ticker-track{justify-content:flex-start;width:max-content;animation:ticker-mobile-ltr 32s linear infinite;will-change:transform}.ticker-group{padding-right:18px}.ticker-group-clone{display:flex}@keyframes ticker-mobile-ltr{from{transform:translateX(-50%)}to{transform:translateX(0)}}}
@media(max-width:1200px) and (prefers-reduced-motion:reduce){.ticker-track{animation:none;transform:none}.ticker-group-clone{display:none}}

/* Hero Slider */
.hero-slider{position:relative;min-width:0;align-self:center}.hero-slides{position:relative;overflow:hidden;border-radius:26px;border:1px solid rgba(225,194,115,.28);background:#111;aspect-ratio:4/3;box-shadow:0 28px 55px rgba(0,0,0,.36)}.hero-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .7s ease,visibility .7s ease}.hero-slide.is-active{opacity:1;visibility:visible}.hero-slide-image{display:block;width:100%;height:100%;object-fit:cover}.hero-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.14));pointer-events:none}.hero-slide-logo{display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 40%,#4a232b 0,#1b1517 42%,#0b0b0b 78%)}.hero-slide-logo::after{display:none}.hero-logo-stage{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;padding:42px}.hero-slider-logo{position:relative;z-index:2;display:block;width:min(78%,390px);max-height:72%;object-fit:contain;filter:drop-shadow(0 24px 40px rgba(0,0,0,.5))}.hero-logo-stage .logo-halo{top:50%;left:50%;width:420px;height:420px;transform:translate(-50%,-50%)}.hero-logo-stage p{position:relative;z-index:2;margin:20px 0 0;text-align:center;font-family:"Barlow Condensed",sans-serif;font-size:22px;line-height:1.15;letter-spacing:.04em;color:#ddd}.hero-slider-controls{display:grid;grid-template-columns:48px 1fr 48px;align-items:center;gap:14px;margin-top:16px}.hero-slider-arrow{width:48px;height:44px;border:1px solid rgba(225,194,115,.45);background:rgba(17,17,17,.72);color:#fff;font-size:22px;line-height:1;cursor:pointer;transition:border-color .2s ease,background .2s ease,color .2s ease}.hero-slider-arrow:hover,.hero-slider-arrow:focus-visible{border-color:var(--gold2);background:#1b1714;color:var(--gold2);outline:none}.hero-slider-dots{display:flex;justify-content:center;align-items:center;gap:9px}.hero-slider-dot{width:9px;height:9px;padding:0;border:0;border-radius:50%;background:#69635d;cursor:pointer;transition:width .2s ease,background .2s ease;border-radius .2s ease}.hero-slider-dot.is-active{width:28px;border-radius:8px;background:var(--gold2)}
@media(max-width:900px){.hero-slider{margin-top:12px}.hero-slides{aspect-ratio:16/11}.hero-slider-logo{width:min(62%,330px)}.hero-logo-stage p{font-size:20px}}
@media(max-width:600px){.hero-slides{aspect-ratio:4/3;border-radius:20px}.hero-logo-stage{padding:28px}.hero-slider-logo{width:min(76%,280px)}.hero-logo-stage p{font-size:18px}.hero-slider-controls{grid-template-columns:44px 1fr 44px}.hero-slider-arrow{width:44px;height:44px}}
@media(prefers-reduced-motion:reduce){.hero-slide{transition:none}}

/* Fullscreen Hero Slider */
.hero-fullscreen{position:relative;min-height:100svh;padding:0;background:#090909;color:#fff;overflow:hidden}
.hero-fullscreen:after,.hero-fullscreen .hero-noise{display:none}
.hero-slider-full{position:absolute;inset:0;z-index:1;margin:0}
.hero-slider-full .hero-slides{position:absolute;inset:0;border:0;border-radius:0;aspect-ratio:auto;box-shadow:none;background:#090909}
.hero-slider-full .hero-slide{position:absolute;inset:0}
.hero-slider-full .hero-slide-image{width:100%;height:100%;object-fit:cover}
.hero-slider-full .hero-slide-maike{object-position:center center}
.hero-slider-full .hero-slide-trio{object-position:center center}
.hero-slider-full .hero-slide-danke{object-position:center center}
.hero-slider-full .hero-slide-logo{background:radial-gradient(circle at 68% 45%,#502730 0,#1b1517 38%,#080808 78%)}
.hero-slider-full .hero-logo-stage{height:100%;padding:110px 40px 100px 46%}
.hero-slider-full .hero-slider-logo{width:min(72%,520px);max-height:66%}
.hero-slider-full .hero-logo-stage .logo-halo{width:min(42vw,560px);height:min(42vw,560px)}
.hero-slider-full .hero-logo-stage p{font-size:22px}
.hero-photo-shade{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(7,7,7,.92) 0%,rgba(7,7,7,.78) 30%,rgba(7,7,7,.38) 55%,rgba(7,7,7,.06) 78%),linear-gradient(180deg,rgba(7,7,7,.42) 0%,transparent 22%,transparent 72%,rgba(7,7,7,.48) 100%)}
.hero-overlay{position:relative;z-index:3;min-height:100svh;display:flex;align-items:flex-start;padding-top:clamp(132px,16vh,190px);padding-bottom:120px;pointer-events:none}
.hero-overlay .hero-copy{width:min(660px,58%);padding:28px 32px 30px 0;pointer-events:auto}
.hero-overlay .eyebrow{font-size:13px;color:var(--gold2);text-shadow:0 2px 16px rgba(0,0,0,.75)}
.hero-overlay .hero-text{font-size:clamp(16px,1.35vw,19px);line-height:1.72;color:#f2efea;text-shadow:0 2px 18px rgba(0,0,0,.72)}
.hero-overlay .hero-lead:empty,.hero-overlay .hero-lead[hidden]{display:none!important}
.hero-overlay .hero-actions{margin:30px 0 26px}
.hero-overlay .btn-ghost{background:rgba(10,10,10,.28);border-color:rgba(255,255,255,.55);backdrop-filter:blur(6px)}
.hero-overlay .hero-facts{color:#ddd;gap:16px;text-shadow:0 1px 10px rgba(0,0,0,.7)}
.hero-slider-controls-overlay{position:absolute;z-index:4;left:50%;bottom:30px;transform:translateX(-50%);width:min(350px,calc(100% - 36px));margin:0;padding:8px 10px;border:1px solid rgba(255,255,255,.16);border-radius:28px;background:rgba(8,8,8,.48);backdrop-filter:blur(12px)}
.hero-slider-controls-overlay .hero-slider-arrow{border-radius:50%;background:rgba(12,12,12,.72)}
.hero-slider-controls-overlay .hero-slider-dot{background:#a9a39c}
.hero-slider-controls-overlay .hero-slider-dot.is-active{background:var(--gold2)}
.sound-intro-wrap{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.sound-slogan{display:block;width:min(100%,520px);height:auto}

@media(max-width:900px){
  .hero-fullscreen{min-height:100svh}
  .hero-slider-full .hero-logo-stage{padding:110px 24px 180px;justify-content:center}
  .hero-slider-full .hero-slider-logo{width:min(62vw,390px);max-height:44%}
  .hero-slider-full .hero-logo-stage .logo-halo{width:min(78vw,480px);height:min(78vw,480px)}
  .hero-photo-shade{background:linear-gradient(180deg,rgba(7,7,7,.76) 0%,rgba(7,7,7,.42) 44%,rgba(7,7,7,.22) 68%,rgba(7,7,7,.62) 100%)}
  .hero-overlay{min-height:100svh;padding-top:118px;padding-bottom:115px}
  .hero-overlay .hero-copy{width:min(100%,680px);padding:18px 0 24px}
  .hero-overlay .hero-text{max-width:620px}
  .hero-slider-full .hero-slide-maike{object-position:50% 45%}
  .hero-slider-full .hero-slide-trio{object-position:52% center}
  .hero-slider-full .hero-slide-danke{object-position:50% center}
}

@media(max-width:600px){
  .hero-fullscreen{min-height:100svh}
  .hero-overlay{min-height:100svh;padding-top:108px;padding-bottom:106px}
  .hero-overlay .hero-copy{width:100%;padding:10px 0 20px}
  .hero-overlay .eyebrow{font-size:11px;letter-spacing:.14em}
  .hero-overlay .hero-text{font-size:15px;line-height:1.58;max-width:100%}
  .hero-overlay .hero-actions{display:flex;flex-direction:row;flex-wrap:wrap;gap:10px;margin:22px 0 20px}
  .hero-overlay .btn{padding:12px 15px}
  .hero-overlay .hero-facts{font-size:11px;gap:9px}
  .hero-overlay .hero-facts span{padding-left:9px}
  .hero-slider-full .hero-slide-maike{object-position:52% center}
  .hero-slider-full .hero-slide-trio{object-position:55% center}
  .hero-slider-full .hero-slide-danke{object-position:50% center}
  .hero-slider-full .hero-logo-stage{padding:86px 20px 180px}
  .hero-slider-full .hero-slider-logo{width:min(78vw,330px);max-height:44%}
  .hero-slider-full .hero-logo-stage p{font-size:18px}
  .hero-slider-controls-overlay{bottom:18px}
  .sound-slogan{width:min(100%,440px)}
}

/* Hero/Header refinement: centered welcome in navigation, transparent fade, centered lower overlay */
.nav-wrap{
  background:linear-gradient(180deg,rgba(7,7,7,.94) 0%,rgba(7,7,7,.72) 42%,rgba(7,7,7,.16) 82%,rgba(7,7,7,0) 100%);
  backdrop-filter:none;
  border-bottom:0;
}
.nav{position:relative;height:78px}
.nav-welcome{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  margin:0;
  width:max-content;
  max-width:48%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#fff;
  font-family:"Barlow Condensed",sans-serif;
  font-size:clamp(15px,1.45vw,21px);
  font-weight:700;
  letter-spacing:.035em;
  text-align:center;
  text-shadow:0 2px 12px rgba(0,0,0,.78);
  pointer-events:none;
}

.hero-photo-shade{
  background:linear-gradient(180deg,rgba(6,6,6,.20) 0%,rgba(6,6,6,.04) 34%,rgba(6,6,6,.12) 58%,rgba(6,6,6,.76) 100%);
}
.hero-overlay{
  min-height:100svh;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding-top:96px;
  padding-bottom:104px;
  text-align:center;
}
.hero-overlay .hero-copy{
  width:min(920px,calc(100% - 40px));
  margin:0 auto;
  padding:0;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.hero-overlay .hero-text{
  max-width:850px;
  margin:0 auto;
  color:#fff;
  font-size:clamp(16px,1.25vw,19px);
  line-height:1.62;
  text-shadow:0 2px 18px rgba(0,0,0,.92);
}
.hero-overlay .hero-actions{
  justify-content:center;
  margin:20px 0 16px;
}
.hero-overlay .hero-facts{
  justify-content:center;
  color:#eee;
  gap:14px;
}
.hero-overlay .hero-facts span{
  border-left:0;
  padding-left:0;
}
.hero-overlay .hero-facts span+span::before{
  content:"·";
  margin-right:14px;
  color:var(--gold2);
}

.hero-slider-controls-overlay{
  bottom:18px;
  width:auto;
  min-width:0;
  grid-template-columns:30px auto 30px;
  gap:8px;
  padding:4px 7px;
  border-color:rgba(255,255,255,.10);
  background:rgba(8,8,8,.28);
  backdrop-filter:blur(7px);
}
.hero-slider-controls-overlay .hero-slider-arrow{
  width:30px;
  height:30px;
  border-color:rgba(255,255,255,.16);
  background:rgba(10,10,10,.20);
  color:rgba(255,255,255,.74);
  font-size:15px;
}
.hero-slider-controls-overlay .hero-slider-arrow:hover,
.hero-slider-controls-overlay .hero-slider-arrow:focus-visible{
  background:rgba(10,10,10,.45);
  border-color:rgba(225,194,115,.65);
  color:var(--gold2);
}
.hero-slider-controls-overlay .hero-slider-dots{gap:6px}
.hero-slider-controls-overlay .hero-slider-dot{width:6px;height:6px;background:rgba(255,255,255,.48)}
.hero-slider-controls-overlay .hero-slider-dot.is-active{width:18px;background:var(--gold2)}

@media(max-width:900px){
  .nav-welcome{max-width:58%;font-size:16px}
  .hero-overlay{padding-bottom:96px}
  .hero-overlay .hero-copy{width:min(760px,calc(100% - 32px))}
}
@media(max-width:600px){
  .nav-welcome{max-width:52%;font-size:14px;letter-spacing:.015em}
  .brand img{width:54px;height:54px}
  .hero-overlay{padding-top:88px;padding-bottom:86px}
  .hero-overlay .hero-copy{width:calc(100% - 28px)}
  .hero-overlay .hero-text{font-size:14px;line-height:1.5}
  .hero-overlay .hero-actions{gap:8px;margin:16px 0 13px}
  .hero-overlay .btn{padding:10px 13px;font-size:13px}
  .hero-overlay .hero-facts{font-size:10px;gap:8px;line-height:1.35}
  .hero-overlay .hero-facts span+span::before{margin-right:8px}
  .hero-slider-controls-overlay{bottom:12px;grid-template-columns:26px auto 26px;padding:3px 6px}
  .hero-slider-controls-overlay .hero-slider-arrow{width:26px;height:26px;font-size:13px}
}

/* Hero/Header refinement v2 */
.nav-wrap{
  background:linear-gradient(180deg,rgba(5,5,5,.99) 0%,rgba(5,5,5,.96) 62%,rgba(5,5,5,.72) 78%,rgba(5,5,5,0) 100%);
  backdrop-filter:none;
  border-bottom:0;
}
.nav{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  column-gap:24px;
  height:78px;
  position:relative;
}
.brand{
  position:relative;
  z-index:22;
  align-self:start;
}
.brand img{
  width:96px;
  height:96px;
  object-fit:contain;
  margin-top:7px;
  filter:drop-shadow(0 8px 14px rgba(0,0,0,.48));
}
.nav-welcome{
  position:static;
  transform:none;
  width:auto;
  max-width:none;
  min-width:0;
  margin:0;
  justify-self:center;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:center;
  color:#fff;
  font-family:"Barlow Condensed",sans-serif;
  font-size:clamp(15px,1.4vw,20px);
  font-weight:700;
  letter-spacing:.03em;
  text-shadow:0 2px 12px rgba(0,0,0,.9);
  pointer-events:none;
}
.nav-links{justify-self:end}

.hero-photo-shade{
  background:linear-gradient(180deg,rgba(5,5,5,.10) 0%,rgba(5,5,5,.02) 34%,rgba(5,5,5,.08) 58%,rgba(5,5,5,.56) 100%);
}
.hero-overlay{
  align-items:flex-end;
  justify-content:center;
  padding-top:96px;
  padding-bottom:42px;
  text-align:center;
}
.hero-overlay .hero-copy{
  width:min(900px,calc(100% - 48px));
  margin:0 auto;
  padding:0;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.hero-overlay .hero-text{
  max-width:850px;
  margin:0 auto;
  padding:14px 20px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:rgba(7,7,7,.56);
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
  color:#fff;
  font-size:clamp(15px,1.2vw,18px);
  line-height:1.58;
  text-shadow:0 2px 12px rgba(0,0,0,.8);
}
.hero-overlay .hero-actions{
  justify-content:center;
  margin:12px 0 0;
}
.hero-facts{display:none!important}

.hero-slider-controls-overlay{
  position:absolute;
  z-index:5;
  left:12px;
  right:12px;
  top:50%;
  bottom:auto;
  transform:translateY(-50%);
  width:auto;
  min-width:0;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:0;
  margin:0;
  border:0;
  border-radius:0;
  background:none;
  backdrop-filter:none;
  pointer-events:none;
}
.hero-slider-controls-overlay .hero-slider-arrow{
  pointer-events:auto;
  width:32px;
  height:32px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:50%;
  background:rgba(8,8,8,.18);
  color:rgba(255,255,255,.58);
  font-size:15px;
  box-shadow:none;
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  opacity:.78;
}
.hero-slider-controls-overlay .hero-slider-arrow:hover,
.hero-slider-controls-overlay .hero-slider-arrow:focus-visible{
  background:rgba(8,8,8,.46);
  border-color:rgba(255,255,255,.42);
  color:#fff;
  opacity:1;
}
.hero-slider-dots{display:none!important}

.hero-slider-full .hero-logo-stage{
  height:100%;
  padding:96px clamp(28px,7vw,120px) 54px;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:center;
  justify-items:center;
  gap:clamp(26px,5vw,80px);
}
.hero-slider-full .hero-logo-stage .logo-halo{
  left:68%;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(42vw,560px);
  height:min(42vw,560px);
}
.hero-logo-claim{
  position:relative;
  z-index:2;
  justify-self:end;
  max-width:480px;
  text-align:right;
  color:#fff;
  font-family:"Barlow Condensed",sans-serif;
  font-size:clamp(34px,4.3vw,68px);
  font-weight:800;
  line-height:.96;
  letter-spacing:-.01em;
  text-shadow:0 4px 22px rgba(0,0,0,.72);
}
.hero-slider-full .hero-slider-logo{
  position:relative;
  z-index:2;
  justify-self:start;
  width:min(38vw,500px);
  max-height:72%;
  margin:0;
}

@media(max-width:900px){
  .nav{grid-template-columns:auto minmax(0,1fr) auto;column-gap:12px}
  .brand img{width:84px;height:84px;margin-top:8px}
  .nav-welcome{font-size:15px}
  .menu-btn{justify-self:end}
  .nav-links{position:absolute;top:78px;left:0;right:0}
  .hero-overlay{padding-bottom:34px}
  .hero-overlay .hero-copy{width:min(760px,calc(100% - 38px))}
  .hero-slider-full .hero-logo-stage{padding:88px 26px 44px;gap:24px}
  .hero-logo-claim{font-size:clamp(30px,6vw,48px)}
  .hero-slider-full .hero-slider-logo{width:min(44vw,390px);max-height:58%}
}

@media(max-width:600px){
  .nav{column-gap:8px}
  .brand img{width:76px;height:76px;margin-top:10px}
  .nav-welcome{font-size:13px;letter-spacing:0}
  .menu-btn{padding:7px 9px;font-size:12px}
  .hero-overlay{padding-top:84px;padding-bottom:24px}
  .hero-overlay .hero-copy{width:calc(100% - 28px)}
  .hero-overlay .hero-text{padding:11px 13px;border-radius:11px;font-size:13px;line-height:1.48}
  .hero-overlay .hero-actions{gap:8px;margin-top:9px}
  .hero-overlay .btn{padding:9px 12px;font-size:12px}
  .hero-slider-controls-overlay{left:6px;right:6px}
  .hero-slider-controls-overlay .hero-slider-arrow{width:28px;height:28px;font-size:13px}
  .hero-slider-full .hero-logo-stage{padding:82px 18px 34px;grid-template-columns:1fr 1fr;gap:12px}
  .hero-logo-claim{font-size:clamp(23px,7vw,34px);max-width:48vw}
  .hero-slider-full .hero-slider-logo{width:min(46vw,300px);max-height:50%}
  .hero-slider-full .hero-logo-stage .logo-halo{left:70%;width:min(62vw,360px);height:min(62vw,360px)}
}


/* Hero/Header refinement v3 */
.ticker{
  position:relative;
  z-index:6;
}
.ticker::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-22px;
  height:22px;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(197,154,66,0) 0%,rgba(197,154,66,.54) 54%,rgba(197,154,66,1) 100%);
}

.brand img{
  width:110px;
  height:110px;
  margin-top:4px;
}

.nav-welcome,
.nav-links{
  transform:translateY(-5px);
}
.menu-btn{
  transform:translateY(-5px);
}

.hero-slider-full .hero-slide-logo{
  background:
    radial-gradient(ellipse at 50% 48%,rgba(139,43,62,.62) 0%,rgba(78,28,38,.48) 32%,rgba(27,17,20,.94) 62%,#080808 88%);
}
.hero-slider-full .hero-logo-stage{
  grid-template-columns:minmax(260px,.92fr) minmax(320px,1.08fr);
  gap:clamp(54px,7vw,120px);
  padding-left:clamp(46px,8vw,150px);
  padding-right:clamp(46px,8vw,150px);
}
.hero-slider-full .hero-logo-stage .logo-halo{
  left:50%;
  top:50%;
  width:min(82vw,1120px);
  height:min(58vw,760px);
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(217,92,109,.20) 0%,rgba(167,55,72,.13) 42%,transparent 72%);
}
.hero-logo-claim{
  box-sizing:border-box;
  width:100%;
  max-width:500px;
  padding-right:0;
  justify-self:end;
  text-align:right;
  overflow-wrap:normal;
  word-break:normal;
}
.hero-slider-full .hero-slider-logo{
  width:min(40vw,540px);
  max-width:100%;
  justify-self:start;
}

/* Hero buttons: gold follows the hovered/focused choice */
.hero-overlay .hero-actions .btn{
  transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease;
}
.hero-overlay .hero-actions .btn-gold{
  border:1px solid var(--gold);
}
@media (hover:hover) and (pointer:fine){
  .hero-overlay .hero-actions:has(.btn:hover) .btn{
    background:rgba(10,10,10,.30);
    color:#fff;
    border:1px solid rgba(255,255,255,.55);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
  }
  .hero-overlay .hero-actions:has(.btn:hover) .btn:hover{
    background:linear-gradient(135deg,var(--gold2),var(--gold));
    color:#16120c;
    border-color:var(--gold);
    transform:translateY(-1px);
  }
}
.hero-overlay .hero-actions .btn:focus-visible{
  background:linear-gradient(135deg,var(--gold2),var(--gold));
  color:#16120c;
  border-color:var(--gold);
  outline:2px solid rgba(255,255,255,.88);
  outline-offset:2px;
}

@media(max-width:900px){
  .brand img{width:96px;height:96px;margin-top:5px}
  .nav-welcome,.menu-btn{transform:translateY(-4px)}
  .hero-slider-full .hero-logo-stage{
    grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
    gap:28px;
    padding-left:30px;
    padding-right:30px;
  }
  .hero-slider-full .hero-slider-logo{width:min(47vw,410px)}
  .hero-logo-claim{max-width:390px}
}
@media(max-width:600px){
  .brand img{width:84px;height:84px;margin-top:7px}
  .nav-welcome,.menu-btn{transform:translateY(-3px)}
  .ticker::before{top:-16px;height:16px}
  .hero-slider-full .hero-logo-stage{
    grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
    gap:12px;
    padding-left:16px;
    padding-right:16px;
  }
  .hero-logo-claim{
    max-width:46vw;
    font-size:clamp(21px,6.5vw,31px);
  }
  .hero-slider-full .hero-slider-logo{width:min(48vw,300px)}
  .hero-slider-full .hero-logo-stage .logo-halo{
    width:96vw;
    height:68vw;
  }
}


/* Hero/Header refinement v4 */

/* Header: welcome + navigation visibly higher inside the dark header zone */
.nav-welcome,
.nav-links{
  transform:translateY(-17px);
}
.menu-btn{
  transform:translateY(-17px);
}

/* Logo slide: smaller logo so claim and logo remain clearly separated */
.hero-slider-full .hero-logo-stage{
  grid-template-columns:minmax(280px,1fr) minmax(280px,1fr);
  gap:clamp(70px,8vw,140px);
}
.hero-slider-full .hero-slider-logo{
  width:min(31vw,430px);
  max-height:62%;
}
.hero-logo-claim{
  max-width:520px;
}

/* Gold ticker: same strip dimensions, but visually overlaps the slider.
   The transparent top now reveals the underlying hero image reliably. */
.ticker{
  margin-top:-20px;
  background:linear-gradient(
    180deg,
    rgba(197,154,66,0) 0%,
    rgba(197,154,66,.48) 30%,
    rgba(197,154,66,.90) 56%,
    rgb(197,154,66) 76%,
    rgb(197,154,66) 100%
  );
  overflow:hidden;
}
.ticker::before{
  display:none!important;
}

@media(max-width:900px){
  .nav-welcome,
  .menu-btn{
    transform:translateY(-15px);
  }
  .hero-slider-full .hero-logo-stage{
    gap:36px;
  }
  .hero-slider-full .hero-slider-logo{
    width:min(39vw,350px);
  }
}
@media(max-width:600px){
  .nav-welcome,
  .menu-btn{
    transform:translateY(-12px);
  }
  .ticker{
    margin-top:-15px;
  }
  .hero-slider-full .hero-logo-stage{
    gap:16px;
  }
  .hero-slider-full .hero-slider-logo{
    width:min(42vw,250px);
  }
}


/* Hero/Header refinement v5 */

/* Gold ticker sits ON TOP of the hero image.
   The slider's lower border is removed so no visible photo edge can cut through. */
.hero-fullscreen{
  position:relative;
  z-index:1;
}
.hero-slider-full .hero-slides{
  border-bottom-color:transparent;
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
}
.ticker{
  position:relative;
  z-index:12;
  margin-top:-52px;
  padding:13px 0;
  background:linear-gradient(
    180deg,
    rgba(197,154,66,0) 0%,
    rgba(197,154,66,.20) 18%,
    rgba(197,154,66,.62) 46%,
    rgba(197,154,66,.94) 72%,
    rgb(197,154,66) 100%
  );
  box-shadow:none;
  border:0;
}
.ticker-track{
  position:relative;
  z-index:2;
}

/* Logo slide: move claim and logo clearly upward as one composition */
.hero-slider-full .hero-logo-stage{
  padding-top:48px;
  padding-bottom:170px;
}
.hero-logo-claim,
.hero-slider-full .hero-slider-logo{
  transform:translateY(-58px);
}
.hero-slider-full .hero-logo-stage .logo-halo{
  top:39%;
}

@media(max-width:900px){
  .ticker{
    margin-top:-48px;
  }
  .hero-slider-full .hero-logo-stage{
    padding-top:44px;
    padding-bottom:140px;
  }
  .hero-logo-claim,
  .hero-slider-full .hero-slider-logo{
    transform:translateY(-46px);
  }
  .hero-slider-full .hero-logo-stage .logo-halo{
    top:40%;
  }
}

@media(max-width:600px){
  .ticker{
    margin-top:-44px;
  }
  .hero-slider-full .hero-logo-stage{
    padding-top:38px;
    padding-bottom:112px;
  }
  .hero-logo-claim,
  .hero-slider-full .hero-slider-logo{
    transform:translateY(-34px);
  }
  .hero-slider-full .hero-logo-stage .logo-halo{
    top:41%;
  }
}


/* Hero/Header refinement v6 */

/* Gold ticker: lower edge aligned exactly with hero-slider lower edge.
   The strip overlays only the final part of the image, ending flush at the photo bottom. */
.hero-fullscreen{
  position:relative;
}
.ticker{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:12;
  margin-top:0;
  margin-bottom:0;
}
.hero-fullscreen + .ticker{
  /* fallback if browser/layout keeps ticker as sibling */
  position:relative;
  margin-top:-52px;
  margin-bottom:0;
}

/* Logo slide: slight clockwise rotation for a looser composition */
.hero-slider-full .hero-slider-logo{
  transform:translateY(-58px) rotate(5deg);
  transform-origin:center center;
}

@media(max-width:900px){
  .hero-slider-full .hero-slider-logo{
    transform:translateY(-46px) rotate(4deg);
  }
}
@media(max-width:600px){
  .hero-slider-full .hero-slider-logo{
    transform:translateY(-34px) rotate(3deg);
  }
}
\n\n/* Hero/Header refinement v7: structural ticker fix */\n.hero-fullscreen{\n  position:relative;\n  overflow:hidden;\n}\n.hero-fullscreen > .hero-ticker{\n  position:absolute!important;\n  left:0!important;\n  right:0!important;\n  bottom:0!important;\n  top:auto!important;\n  z-index:12;\n  margin:0!important;\n  padding:13px 0;\n  border:0!important;\n  box-shadow:none!important;\n  background:linear-gradient(\n    180deg,\n    rgba(197,154,66,0) 0%,\n    rgba(197,154,66,.18) 20%,\n    rgba(197,154,66,.58) 47%,\n    rgba(197,154,66,.92) 72%,\n    rgb(197,154,66) 100%\n  );\n}\n.hero-fullscreen > .hero-ticker::before{display:none!important}\n.hero-fullscreen > .hero-ticker .ticker-track{position:relative;z-index:2}\n\n/* Buttons: lift above the ticker without moving the text panel */\n.hero-overlay .hero-actions{\n  transform:translateY(-24px);\n}\n\n@media(max-width:900px){\n  .hero-overlay .hero-actions{transform:translateY(-21px)}\n}\n@media(max-width:600px){\n  .hero-overlay .hero-actions{transform:translateY(-18px)}\n}\n

/* Hero/Header refinement v8:
   Lift the complete lower hero copy (text + buttons) together. */
.hero-overlay .hero-copy{
  transform:translateY(-38px);
}

@media(max-width:900px){
  .hero-overlay .hero-copy{
    transform:translateY(-34px);
  }
}

@media(max-width:600px){
  .hero-overlay .hero-copy{
    transform:translateY(-28px);
  }
}


/* Hero/Header refinement v9:
   Lift the complete lower hero copy by the same amount once more. */
.hero-overlay .hero-copy{
  transform:translateY(-76px);
}

@media(max-width:900px){
  .hero-overlay .hero-copy{
    transform:translateY(-68px);
  }
}

@media(max-width:600px){
  .hero-overlay .hero-copy{
    transform:translateY(-56px);
  }
}


/* Booking media downloads */
.booking-media{margin-top:76px;padding-top:52px;border-top:1px solid rgba(255,255,255,.24)}
.booking-media-head{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);column-gap:60px;align-items:end;margin-bottom:30px}
.booking-media-head .section-kicker{grid-column:1/-1;margin-bottom:14px}
.booking-media-head h3{font-family:"Barlow Condensed",sans-serif;font-size:clamp(38px,5vw,58px);line-height:.96;text-transform:uppercase;margin:0}
.booking-media-head p:not(.section-kicker){margin:0;max-width:620px;font-size:15px;line-height:1.65;color:rgba(255,255,255,.82)}
.booking-media-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.booking-media-item{min-width:0;background:rgba(17,17,17,.72);border:1px solid rgba(255,255,255,.16);overflow:hidden}
.booking-media-preview{display:flex;align-items:center;justify-content:center;height:150px;padding:12px;background:rgba(255,255,255,.94)}
.booking-media-preview img{display:block;width:100%;height:100%;object-fit:contain}
.booking-media-filetype{font-family:"Barlow Condensed",sans-serif;font-size:34px;font-weight:800;color:#222}
.booking-media-meta{padding:13px 14px 15px;display:flex;flex-direction:column;gap:8px;min-width:0}
.booking-media-meta strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:#eee}
.booking-media-download{font-size:12px;font-weight:700;color:var(--gold2);width:max-content;border-bottom:1px solid rgba(225,194,115,.55);padding-bottom:2px}
@media(hover:hover) and (pointer:fine){.booking-media-item{transition:transform .2s ease,border-color .2s ease}.booking-media-item:hover{transform:translateY(-3px);border-color:var(--gold)}.booking-media-download:hover{color:#fff}}
@media(max-width:1050px){.booking-media-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.booking-media{margin-top:54px;padding-top:38px}.booking-media-head{grid-template-columns:1fr;gap:14px}.booking-media-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.booking-media-preview{height:135px}}
@media(max-width:420px){.booking-media-grid{grid-template-columns:1fr}.booking-media-preview{height:180px}}


/* Booking contact card with Sebastian */
.booking-card-person{
  padding:0;
  display:grid;
  grid-template-columns:minmax(180px,.8fr) minmax(0,1.2fr);
  gap:0;
  overflow:hidden;
  min-height:330px;
}
.booking-person-photo{
  position:relative;
  min-height:330px;
  overflow:hidden;
  background:#0b0b0b;
}
.booking-person-photo::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(17,17,17,0) 58%,rgba(17,17,17,.55) 82%,#111 100%);
  pointer-events:none;
}
.booking-person-photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:48% 30%;
}
.booking-person-content{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:18px;
  padding:32px 32px 32px 24px;
  background:#111;
  min-width:0;
}
.booking-person-content>a:not(.btn){
  font-family:"Barlow Condensed",sans-serif;
  font-size:clamp(22px,2.3vw,29px);
  font-weight:700;
  line-height:1.05;
  overflow-wrap:anywhere;
}
.booking-contact-label{
  color:#aaa;
  font-size:13px;
  order:-1;
}
.booking-person-content .btn{
  align-self:flex-start;
  margin-top:8px;
}

@media(max-width:900px){
  .booking-card-person{
    grid-template-columns:minmax(150px,.72fr) minmax(0,1.28fr);
    min-height:300px;
  }
  .booking-person-photo{
    min-height:300px;
  }
  .booking-person-content{
    padding:28px 26px 28px 20px;
  }
}
@media(max-width:600px){
  .booking-card-person{
    grid-template-columns:1fr;
  }
  .booking-person-photo{
    min-height:300px;
    max-height:370px;
  }
  .booking-person-photo::after{
    background:linear-gradient(180deg,rgba(17,17,17,0) 56%,rgba(17,17,17,.35) 78%,#111 100%);
  }
  .booking-person-content{
    padding:24px;
  }
  .booking-person-content .btn{
    align-self:stretch;
  }
}


/* Combined section: Unser Sound · unser Konzept */
.sound-concept{
  background:var(--paper);
}
.sound-concept-title{
  margin-bottom:54px;
}
.sound-concept-title h2{
  max-width:980px;
}
.concept-subheadline{
  font-family:"Barlow Condensed",sans-serif;
  font-size:clamp(42px,5vw,66px);
  line-height:.95;
  text-transform:uppercase;
  margin:0;
}
.sound-concept-sound{
  align-items:start;
}
.concept-divider{
  height:1px;
  background:#cfc8bb;
  margin-top:76px;
  margin-bottom:76px;
}
.sound-concept-live{
  align-items:start;
}
.concept-live-headline{
  max-width:560px;
}
.sound-concept .event-grid{
  margin-top:54px;
}

@media(max-width:900px){
  .sound-concept-title{
    margin-bottom:42px;
  }
  .concept-divider{
    margin-top:58px;
    margin-bottom:58px;
  }
}
@media(max-width:600px){
  .sound-concept-title{
    margin-bottom:34px;
  }
  .concept-divider{
    margin-top:46px;
    margin-bottom:46px;
  }
}


/* Automatic text contrast from content/einstellungen.txt */
.auto-theme-light{color:#111!important}
.auto-theme-light h1,.auto-theme-light h2,.auto-theme-light h3,.auto-theme-light strong,
.auto-theme-light .section-intro,.auto-theme-light .statement p,.auto-theme-light .dates strong,
.auto-theme-light .dates time,.auto-theme-light .band-grid span,.auto-theme-light .format p,
.auto-theme-light .format li,.auto-theme-light .booking p{color:#111!important}
.auto-theme-light .section-kicker,.auto-theme-light .gold,.auto-theme-light .tag{color:var(--red)!important}
.auto-theme-light .quote{color:#111!important;background:rgba(255,255,255,.55)}
.auto-theme-light .dates span,.auto-theme-light .booking-card span,.auto-theme-light .booking-contact-label{color:#5f5a54!important}
.auto-theme-light .music-card{background:#fff;color:#111}
.auto-theme-light .music-card p{color:#615d57!important}

.auto-theme-dark{color:#fff!important}
.auto-theme-dark h1,.auto-theme-dark h2,.auto-theme-dark h3,.auto-theme-dark strong,
.auto-theme-dark .section-intro,.auto-theme-dark .statement p,.auto-theme-dark .dates strong,
.auto-theme-dark .dates time,.auto-theme-dark .band-grid span,.auto-theme-dark .format p,
.auto-theme-dark .format li,.auto-theme-dark .booking p{color:#fff!important}
.auto-theme-dark .section-kicker,.auto-theme-dark .gold,.auto-theme-dark .tag{color:var(--gold2)!important}
.auto-theme-dark .quote{color:#fff!important;background:rgba(255,255,255,.08)}
.auto-theme-dark .dates span,.auto-theme-dark .booking-card span,.auto-theme-dark .booking-contact-label{color:#c8c3bd!important}
.auto-theme-dark .music-card{background:rgba(255,255,255,.06);color:#fff;border-top-color:var(--gold)}
.auto-theme-dark .music-card p{color:#ddd!important}
.auto-theme-dark .dates article{border-top-color:rgba(255,255,255,.22)}


/* Unified Sound/Concept section */
.sound-concept-live{
  margin-top:64px;
}
@media(max-width:900px){
  .sound-concept-live{
    margin-top:52px;
  }
}
@media(max-width:600px){
  .sound-concept-live{
    margin-top:44px;
  }
}


/* Social Media */
.social-media-section{
  background:#111;
  color:#fff;
}
.social-media-head{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
  align-items:end;
}
.social-media-head .section-intro{
  color:#c7c3be;
}
.social-subhead{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:22px;
}
.social-subhead h3{
  font-family:"Barlow Condensed",sans-serif;
  font-size:clamp(32px,4vw,48px);
  line-height:.95;
  text-transform:uppercase;
  margin:0;
}
.social-subhead a,
.social-network-links a{
  color:var(--gold2);
  font-size:13px;
  font-weight:700;
  border-bottom:1px solid rgba(225,194,115,.55);
  padding-bottom:3px;
}
.social-reels{
  margin-top:58px;
}
.social-reels-track{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(230px,310px);
  gap:16px;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scroll-snap-type:x proximity;
  padding:2px 2px 14px;
  scrollbar-width:thin;
}
.social-reel-card{
  scroll-snap-align:start;
  background:#181818;
  border:1px solid #343434;
  overflow:hidden;
}
.social-reel-media{
  position:relative;
  display:block;
  aspect-ratio:9/16;
  background:#0a0a0a;
  overflow:hidden;
}
.social-reel-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.social-reel-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.45));
}
.social-reel-play{
  position:absolute;
  left:16px;
  bottom:16px;
  z-index:2;
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:50%;
  background:rgba(0,0,0,.62);
  border:1px solid rgba(255,255,255,.62);
  color:#fff;
  font-size:13px;
  padding-left:2px;
}
.social-reel-body{
  padding:16px;
}
.social-reel-body p{
  margin:0 0 14px;
  color:#ddd;
  font-size:13px;
  line-height:1.55;
}
.social-posts-wrap{
  margin-top:64px;
}
.social-network-links{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
}
.social-feed-status{
  padding:24px 0;
  color:#aaa;
}
.social-posts-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.social-card{
  min-width:0;
  background:#181818;
  border:1px solid #343434;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  transition:transform .2s ease,border-color .2s ease;
}
@media(hover:hover) and (pointer:fine){
  .social-card:hover{
    transform:translateY(-3px);
    border-color:rgba(197,154,66,.75);
  }
}
.social-card-media{
  display:block;
  aspect-ratio:4/3;
  overflow:hidden;
  background:#0c0c0c;
}
.social-card-media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .35s ease;
}
@media(hover:hover) and (pointer:fine){
  .social-card:hover .social-card-media img{
    transform:scale(1.025);
  }
}
.social-card-body{
  padding:20px;
  display:flex;
  flex-direction:column;
  flex:1;
}
.social-card-topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:16px;
}
.social-card-topline time{
  color:#888;
  font-size:11px;
}
.social-platform{
  display:inline-flex;
  align-items:center;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.social-platform-instagram{
  color:#e6b6c0;
}
.social-platform-facebook{
  color:#bfcfea;
}
.social-card-body p{
  color:#ddd;
  line-height:1.6;
  margin:0 0 20px;
  font-size:14px;
}
.social-card-footer{
  margin-top:auto;
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:center;
  flex-wrap:wrap;
  padding-top:14px;
  border-top:1px solid #303030;
}
.social-card-footer>a{
  color:var(--gold2);
  font-size:12px;
  font-weight:700;
}
.social-engagement{
  display:flex;
  gap:14px;
  color:#aaa;
  font-size:12px;
}
.social-reel-fallback{
  width:100%;
  height:100%;
  background:linear-gradient(145deg,#26181c,#111);
}

/* Social theme integration */
.auto-theme-light.social-media-section .social-media-head .section-intro,
.auto-theme-light.social-media-section .social-card-body p,
.auto-theme-light.social-media-section .social-reel-body p{
  color:#333!important;
}
.auto-theme-light.social-media-section .social-card,
.auto-theme-light.social-media-section .social-reel-card{
  background:rgba(255,255,255,.72);
  border-color:rgba(17,17,17,.16);
}
.auto-theme-light.social-media-section .social-card-footer{
  border-top-color:rgba(17,17,17,.14);
}
.auto-theme-light.social-media-section .social-engagement,
.auto-theme-light.social-media-section .social-feed-status,
.auto-theme-light.social-media-section .social-card-topline time{
  color:#666!important;
}

@media(max-width:900px){
  .social-media-head{
    grid-template-columns:1fr;
    gap:24px;
  }
  .social-posts-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:600px){
  .social-reels{
    margin-top:44px;
  }
  .social-reels-track{
    grid-auto-columns:minmax(205px,78vw);
  }
  .social-posts-wrap{
    margin-top:50px;
  }
  .social-posts-grid{
    grid-template-columns:1fr;
  }
  .social-subhead{
    align-items:flex-start;
    flex-direction:column;
  }
}


/* Floating "Nach oben" button */
.floating-top-button{
  position:fixed;
  right:max(18px,env(safe-area-inset-right));
  bottom:max(18px,env(safe-area-inset-bottom));
  z-index:1000;
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  padding:10px 14px;
  border:1px solid rgba(225,194,115,.55);
  border-radius:999px;
  background:rgba(17,17,17,.90);
  color:#fff;
  box-shadow:0 8px 28px rgba(0,0,0,.28);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  font:700 12px/1 inherit;
  letter-spacing:.02em;
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(10px);
  transition:opacity .2s ease,transform .2s ease,visibility .2s ease,background .2s ease,border-color .2s ease;
}
.floating-top-button.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.floating-top-button:hover,
.floating-top-button:focus-visible{
  background:#111;
  border-color:var(--gold2);
}
.floating-top-button:focus-visible{
  outline:2px solid var(--gold2);
  outline-offset:3px;
}
.floating-top-arrow{
  color:var(--gold2);
  font-size:18px;
  line-height:1;
  margin-top:-1px;
}
@media(max-width:600px){
  .floating-top-button{
    right:max(12px,env(safe-area-inset-right));
    bottom:max(12px,env(safe-area-inset-bottom));
    min-height:42px;
    padding:9px 12px;
    font-size:11px;
    gap:6px;
  }
  .floating-top-arrow{
    font-size:17px;
  }
}
@media(prefers-reduced-motion:reduce){
  .floating-top-button{
    transition:none;
  }
}


/* Individuelle Bereichsfarben und Schriftarten aus content/einstellungen.txt */
.custom-section-theme{
  color:var(--section-text-color,inherit);
  font-family:var(--section-font-family,inherit);
}
.custom-section-theme p,
.custom-section-theme li,
.custom-section-theme span:not(.social-platform):not(.tag),
.custom-section-theme .section-intro,
.custom-section-theme .format p,
.custom-section-theme .format li,
.custom-section-theme .music-card p,
.custom-section-theme .booking p,
.custom-section-theme .dates span,
.custom-section-theme .dates time{
  color:var(--section-text-color,inherit)!important;
}
.custom-section-theme h1,
.custom-section-theme h2,
.custom-section-theme h3,
.custom-section-theme h4,
.custom-section-theme h5,
.custom-section-theme h6{
  color:var(--section-heading-color,var(--section-text-color,inherit))!important;
  font-family:var(--section-heading-font-family,var(--section-font-family,inherit))!important;
}
.custom-section-theme .section-kicker,
.custom-section-theme .gold,
.custom-section-theme .tag,
.custom-section-theme .social-card-footer>a,
.custom-section-theme .social-subhead a,
.custom-section-theme .social-network-links a{
  color:var(--section-accent-color,var(--gold2))!important;
}


/* Quadratische Profilfotos im Bereich "Die Band" */
.band-profile-photo{
  width:100%;
  aspect-ratio:1/1;
  margin-top:18px;
  overflow:hidden;
  border-radius:10px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.10);
}
.band-profile-photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
}
@media(max-width:700px){
  .band-profile-photo{
    margin-top:14px;
    border-radius:8px;
  }
}


/* Vereinfachter Bereich "Unser Sound · unser Konzept" */
#musik .sound-intro-block{
  margin-top:32px;
}
#musik .sound-concept-live>h3{
  max-width:none;
}
#musik .sound-fulltext{
  max-width:none;
  width:100%;
}
#musik .sound-concept-live{
  margin-top:72px;
}
#musik .event-grid-quotes{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin-top:34px;
}
#musik .event-card{
  padding:20px;
  border-top:2px solid var(--gold);
  background:rgba(255,255,255,.46);
}
#musik .event-card strong{
  display:block;
  font-family:"Barlow Condensed",sans-serif;
  font-size:22px;
  line-height:1;
  text-transform:uppercase;
}
#musik .event-card p{
  margin:12px 0 0;
  font-size:14px;
  line-height:1.55;
  color:#5f5a54;
  font-style:italic;
}
#musik .coole-volksmusik,
#musik .sound-claim,
#musik img[src*="coole-volksmusik"]{
  display:none!important;
}
.auto-theme-dark#musik .event-card{
  background:rgba(255,255,255,.06);
}
.auto-theme-dark#musik .event-card p{
  color:#ddd!important;
}
@media(max-width:900px){
  #musik .event-grid-quotes{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:600px){
  #musik .sound-intro-block{
    margin-top:24px;
  }
  #musik .sound-concept-live{
    margin-top:54px;
  }
  #musik .event-grid-quotes{
    grid-template-columns:1fr;
    gap:12px;
  }
}


/* YouTube-Slider am Ende von "Unser Sound · unser Konzept" */
#musik .sound-video-area{
  margin-top:72px;
  padding-top:44px;
  border-top:1px solid rgba(17,17,17,.12);
}
#musik .sound-video-copy{width:100%}
#musik .sound-video-copy h3{margin-bottom:14px}
#musik .youtube-slider-shell{
  position:relative;
  max-width:1080px;
  margin:28px auto 0;
  padding:0 38px;
}
#musik .youtube-slider-viewport{
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
#musik .youtube-slider-viewport::-webkit-scrollbar{display:none}
#musik .youtube-slider-track{display:flex;gap:12px}
#musik .youtube-video-card{
  flex:0 0 calc((100% - 48px)/5);
  min-width:0;
  scroll-snap-align:start;
}
#musik .youtube-video-link{
  display:block;
  width:100%;
  padding:0;
  border:0;
  background:none;
  text-align:left;
  font:inherit;
  text-decoration:none;
  color:inherit;
  cursor:pointer;
}
#musik .youtube-thumb{
  position:relative;
  display:block;
  width:100%;
  aspect-ratio:16/9;
  overflow:hidden;
  border-radius:7px;
  background:#111;
}
#musik .youtube-thumb img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .25s ease;
}
#musik .youtube-play{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(0,0,0,.72);
  color:#fff;
  border:1px solid rgba(255,255,255,.7);
  font-size:12px;
  padding-left:2px;
}
#musik .youtube-title{
  display:block;
  margin-top:8px;
  font-size:12px;
  line-height:1.35;
  font-weight:700;
}
#musik .youtube-slider-arrow{
  position:absolute;
  top:50%;
  z-index:3;
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:1px solid rgba(17,17,17,.25);
  background:rgba(255,255,255,.90);
  color:#111;
  font-size:22px;
  line-height:1;
  cursor:pointer;
  transform:translateY(-50%);
}
#musik .youtube-slider-prev{left:0}
#musik .youtube-slider-next{right:0}
#musik .youtube-slider-arrow:disabled{opacity:.22;cursor:default}
#musik .youtube-no-scroll .youtube-slider-arrow{display:none}
#musik .youtube-video-link:hover .youtube-thumb img{transform:scale(1.035)}
.auto-theme-dark#musik .sound-video-area{border-top-color:rgba(255,255,255,.16)}
.auto-theme-dark#musik .youtube-slider-arrow{
  background:rgba(17,17,17,.92);
  color:#fff;
  border-color:rgba(255,255,255,.3);
}
@media(max-width:900px){
  #musik .youtube-video-card{flex-basis:calc((100% - 24px)/3)}
}
@media(max-width:600px){
  #musik .sound-video-area{margin-top:54px;padding-top:34px}
  #musik .youtube-slider-shell{margin-top:22px;padding:0 32px}
  #musik .youtube-video-card{flex-basis:calc((100% - 12px)/2)}
  #musik .youtube-slider-arrow{width:28px;height:28px}
}


/* YouTube Popup / Lightbox */
.youtube-modal[hidden]{display:none!important}
.youtube-modal{
  position:fixed;
  inset:0;
  z-index:5000;
  display:grid;
  place-items:center;
  padding:28px;
  opacity:0;
  transition:opacity .18s ease;
}
.youtube-modal.is-open{opacity:1}
.youtube-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(28,28,28,.72);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.youtube-modal-dialog{
  position:relative;
  z-index:1;
  width:min(1100px,92vw);
  background:#111;
  border:1px solid rgba(225,194,115,.38);
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 26px 80px rgba(0,0,0,.55);
  transform:translateY(12px) scale(.985);
  transition:transform .18s ease;
}
.youtube-modal.is-open .youtube-modal-dialog{
  transform:translateY(0) scale(1);
}
.youtube-modal-player{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  background:#000;
}
.youtube-modal-player iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}
.youtube-modal-close{
  position:absolute;
  z-index:3;
  right:12px;
  top:12px;
  width:40px;
  height:40px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.34);
  background:rgba(0,0,0,.64);
  color:#fff;
  font-size:28px;
  line-height:1;
  cursor:pointer;
}
.youtube-modal-close:hover,
.youtube-modal-close:focus-visible{
  border-color:var(--gold2);
  color:var(--gold2);
}
.youtube-modal-caption{
  padding:13px 18px 15px;
  border-top:1px solid #2c2c2c;
  color:#fff;
}
.youtube-modal-caption strong{
  display:block;
  font-size:14px;
}
html.youtube-modal-open,
html.youtube-modal-open body{
  overflow:hidden;
}
@media(max-width:700px){
  .youtube-modal{
    padding:12px;
  }
  .youtube-modal-dialog{
    width:100%;
    border-radius:9px;
  }
  .youtube-modal-close{
    width:36px;
    height:36px;
    right:8px;
    top:8px;
    font-size:25px;
  }
  .youtube-modal-caption{
    padding:11px 14px 13px;
  }
}
@media(prefers-reduced-motion:reduce){
  .youtube-modal,
  .youtube-modal-dialog{
    transition:none;
  }
}


.youtube-modal-nav{
  position:absolute;
  z-index:4;
  top:50%;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.34);
  background:rgba(0,0,0,.58);
  color:#fff;
  font-size:32px;
  line-height:1;
  cursor:pointer;
  transform:translateY(-50%);
  transition:background .18s ease,border-color .18s ease,color .18s ease;
}
.youtube-modal-prev{left:14px}
.youtube-modal-next{right:14px}
.youtube-modal-nav:hover,
.youtube-modal-nav:focus-visible{
  background:rgba(0,0,0,.82);
  border-color:var(--gold2);
  color:var(--gold2);
}
.youtube-modal-nav[hidden]{display:none!important}
.youtube-modal-nav:disabled{
  opacity:.3;
  cursor:default;
}
@media(max-width:700px){
  .youtube-modal-nav{
    width:38px;
    height:38px;
    font-size:28px;
  }
  .youtube-modal-prev{left:7px}
  .youtube-modal-next{right:7px}
}


/* Vollbreites Intro-Textfeld im Bereich "Die Band" */
#band .band-intro-text{
  max-width:none;
  width:100%;
  margin-top:22px;
  margin-bottom:38px;
}
@media(max-width:700px){
  #band .band-intro-text{
    margin-top:18px;
    margin-bottom:30px;
  }
}


/* Zweites vollbreites Textfeld nach der Musiker-Vorstellung */
#band .band-outro-text{
  max-width:none;
  width:100%;
  margin-top:38px;
  margin-bottom:0;
}
@media(max-width:700px){
  #band .band-outro-text{
    margin-top:30px;
  }
}


/* Fix: Outro wirklich unterhalb des kompletten Musiker-Rasters */
#band .band-grid + .band-outro-text{
  display:block;
  width:100%;
  max-width:none;
  grid-column:1/-1;
  margin-top:38px;
}


/* Vollbreite Textfelder im Bereich "Buchungsformate" */
#formate .formats-intro-text{
  display:block;
  width:100%;
  max-width:none;
  margin-top:22px;
  margin-bottom:38px;
}
#formate .formats-outro-text{
  display:block;
  width:100%;
  max-width:none;
  margin-top:38px;
  margin-bottom:0;
  grid-column:1/-1;
}
@media(max-width:700px){
  #formate .formats-intro-text{
    margin-top:18px;
    margin-bottom:30px;
  }
  #formate .formats-outro-text{
    margin-top:30px;
  }
}


/* Fix: Outro unterhalb des kompletten Varianten-Rasters */
#formate .formats-grid + .formats-outro-text,
#formate .format-grid + .formats-outro-text,
#formate .booking-format-grid + .formats-outro-text{
  display:block;
  width:100%;
  max-width:none;
  grid-column:1/-1;
  margin-top:38px;
}


/* Fix Hauptueberschrift "Unser Konzept" analog Termine */
#musik .sound-heading-container{
  display:block;
  width:min(1180px,calc(100% - 40px));
}
#musik .sound-heading-container h2{
  display:block;
  width:100%;
  max-width:none;
  white-space:normal;
  word-break:normal;
  overflow-wrap:normal;
  hyphens:none;
}
#musik .sound-content-container{
  margin-top:0;
}


/* Vergangene Termine: bewusst dezent in Grau */
#termine .is-past,
#termine .past,
#termine .termin-past,
#termine .date-past,
#termine [data-past="true"]{
  color:#8a8a8a !important;
}
#termine .is-past *,
#termine .past *,
#termine .termin-past *,
#termine .date-past *,
#termine [data-past="true"] *{
  color:#8a8a8a !important;
}


/* Reels-Sichtbarkeit: kompletter Instagram-Reels-Block */
[data-social-reels-section][hidden]{
  display:none !important;
}


/* Instagram Stories */
.social-stories{
  margin-top:48px;
}
.social-stories-shell{
  position:relative;
  max-width:980px;
  padding:0 34px;
}
.social-stories-viewport{
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.social-stories-viewport::-webkit-scrollbar{display:none}
.social-stories-track{
  display:flex;
  gap:14px;
  align-items:flex-start;
}
.social-story-card{
  flex:0 0 112px;
  width:112px;
  padding:0;
  border:0;
  background:none;
  color:inherit;
  cursor:pointer;
  text-align:center;
}
.social-story-ring{
  display:block;
  padding:3px;
  border-radius:14px;
  background:linear-gradient(145deg,var(--gold2),#b84960 58%,#6f3143);
}
.social-story-media{
  position:relative;
  display:block;
  width:100%;
  aspect-ratio:9/16;
  overflow:hidden;
  border:3px solid #111;
  border-radius:11px;
  background:#090909;
}
.social-story-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.social-story-fallback{
  display:block;
  width:100%;
  height:100%;
  background:linear-gradient(145deg,#332024,#111);
}
.social-story-video-icon{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:30px;
  height:30px;
  border-radius:50%;
  display:grid;
  place-items:center;
  padding-left:2px;
  background:rgba(0,0,0,.62);
  border:1px solid rgba(255,255,255,.72);
  color:#fff;
  font-size:11px;
}
.social-story-date{
  display:block;
  margin-top:7px;
  color:#aaa;
  font-size:10px;
  white-space:nowrap;
}
.social-stories-arrow{
  position:absolute;
  top:50%;
  z-index:2;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.28);
  background:rgba(0,0,0,.72);
  color:#fff;
  font-size:21px;
  line-height:1;
  cursor:pointer;
  transform:translateY(-65%);
}
.social-stories-prev{left:0}
.social-stories-next{right:0}
.social-stories-arrow:disabled{opacity:.25;cursor:default}
[data-social-stories-section][hidden]{display:none!important}

/* Story Lightbox */
.story-modal[hidden]{display:none!important}
.story-modal{
  position:fixed;
  inset:0;
  z-index:5100;
  display:grid;
  place-items:center;
  padding:18px;
  opacity:0;
  transition:opacity .18s ease;
}
.story-modal.is-open{opacity:1}
.story-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(28,28,28,.72);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.story-modal-dialog{
  position:relative;
  z-index:1;
  width:min(430px,92vw);
  max-height:94vh;
  background:#0d0d0d;
  border:1px solid rgba(225,194,115,.38);
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 26px 80px rgba(0,0,0,.58);
  transform:translateY(10px) scale(.985);
  transition:transform .18s ease;
}
.story-modal.is-open .story-modal-dialog{transform:none}
.story-modal-stage{
  width:100%;
  aspect-ratio:9/16;
  max-height:82vh;
  display:grid;
  place-items:center;
  background:#000;
}
.story-modal-stage img,
.story-modal-stage video{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  background:#000;
}
.story-modal-close,
.story-modal-nav{
  position:absolute;
  z-index:4;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.38);
  background:rgba(0,0,0,.62);
  color:#fff;
  cursor:pointer;
}
.story-modal-close{
  top:10px;
  right:10px;
  width:38px;
  height:38px;
  font-size:26px;
}
.story-modal-nav{
  top:50%;
  width:38px;
  height:38px;
  font-size:28px;
  transform:translateY(-50%);
}
.story-modal-prev{left:9px}
.story-modal-next{right:9px}
.story-modal-close:hover,
.story-modal-nav:hover{
  color:var(--gold2);
  border-color:var(--gold2);
}
.story-modal-meta{
  min-height:46px;
  padding:11px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  border-top:1px solid #292929;
  color:#aaa;
  font-size:11px;
}
.story-modal-meta a{
  color:var(--gold2);
  font-weight:700;
}
.story-modal-fallback{
  color:#aaa;
  font-size:13px;
}
html.story-modal-open,
html.story-modal-open body{overflow:hidden}

.auto-theme-light.social-media-section .social-story-media{
  border-color:#f4f0e8;
}
.auto-theme-light.social-media-section .social-story-date{
  color:#666;
}
@media(max-width:600px){
  .social-stories{margin-top:40px}
  .social-stories-shell{padding:0 30px}
  .social-story-card{flex-basis:92px;width:92px}
  .story-modal{padding:8px}
  .story-modal-dialog{width:min(410px,100%)}
}


/* =========================================================
   IMPRESSUM / LEGAL PAGE
   ========================================================= */
.legal-page{
  background:#f4f0e8;
  color:#181818;
}
.legal-page .legal-nav-wrap{
  background:rgba(17,17,17,.96);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.legal-main{
  min-height:70vh;
}
.legal-hero{
  position:relative;
  overflow:hidden;
  padding:190px 0 72px;
  color:#fff;
  background:
    radial-gradient(circle at 84% 25%,rgba(218,96,112,.26),transparent 31%),
    linear-gradient(135deg,#171313 0%,#28191c 58%,#9f3342 150%);
}
.legal-hero::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:5px;
  background:linear-gradient(90deg,#d5b765,#f0d990,#b84960);
}
.legal-hero .container{
  position:relative;
  z-index:1;
}
.legal-hero h1{
  max-width:none;
  margin:6px 0 14px;
  font-family:"Barlow Condensed",sans-serif;
  font-size:clamp(58px,8vw,104px);
  font-weight:800;
  line-height:.88;
  letter-spacing:-.035em;
  text-transform:uppercase;
}
.legal-hero p:not(.section-kicker){
  max-width:720px;
  margin:0;
  color:rgba(255,255,255,.74);
  font-size:16px;
  line-height:1.7;
}
.legal-content-section{
  padding:64px 0 88px;
}
.legal-content-card{
  max-width:980px;
  padding:clamp(28px,5vw,58px);
  border:1px solid rgba(20,20,20,.10);
  border-radius:18px;
  background:#fff;
  box-shadow:0 20px 55px rgba(44,31,30,.07);
}
.legal-loading{
  color:#777;
  font-size:14px;
}
.legal-content{
  color:#262222;
  line-height:1.75;
  overflow-wrap:anywhere;
}
.legal-content > :first-child{
  margin-top:0!important;
}
.legal-content h1,
.legal-content h2,
.legal-content h3,
.legal-fallback h2{
  max-width:none;
  margin:34px 0 12px;
  font-family:"Barlow Condensed",sans-serif;
  color:#1b1718;
  line-height:1.02;
}
.legal-content h1{
  font-size:clamp(38px,5vw,58px);
}
.legal-content h2,
.legal-fallback h2{
  font-size:clamp(28px,4vw,38px);
}
.legal-content h3{
  font-size:25px;
}
.legal-content p,
.legal-content li,
.legal-fallback p{
  font-size:15px;
  line-height:1.75;
}
.legal-content ul,
.legal-content ol{
  padding-left:22px;
}
.legal-content a,
.legal-fallback a{
  color:#9f3342;
  text-decoration:underline;
  text-underline-offset:3px;
}
.legal-content hr{
  height:1px;
  margin:34px 0;
  border:0;
  background:#e1d9cf;
}
.legal-content img{
  max-width:100%;
  height:auto;
}
.legal-fallback{
  color:#262222;
}
.legal-source-link{
  display:inline-flex;
  margin-top:8px;
  font-weight:700;
}
.legal-back-link{
  display:inline-flex;
  margin-top:28px;
  color:#6f3143;
  font-weight:700;
  text-decoration:none;
}
.legal-back-link:hover{
  color:#9f3342;
}
.legal-page footer{
  margin-top:0;
}
@media(max-width:900px){
  .legal-hero{
    padding:160px 0 58px;
  }
}
@media(max-width:600px){
  .legal-hero{
    padding:138px 0 46px;
  }
  .legal-content-section{
    padding:34px 0 58px;
  }
  .legal-content-card{
    padding:24px 20px;
    border-radius:13px;
  }
  .legal-hero h1{
    font-size:56px;
  }
}


/* =========================================================
   HEADER – NÄCHSTE 3 AUFTRITTE
   ========================================================= */
.header-next-dates{
  position:absolute;
  top:8px;
  left:245px;
  z-index:25;
  width:225px;
  padding:10px 12px 11px;
  border:1px solid rgba(255,255,255,.12);
  border-top:2px solid rgba(225,194,115,.78);
  background:rgba(8,8,8,.70);
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
  box-shadow:0 12px 28px rgba(0,0,0,.25);
  color:#fff;
  transition:background .18s ease,border-color .18s ease,transform .18s ease;
}
.header-next-dates:hover{
  background:rgba(8,8,8,.84);
  border-color:rgba(225,194,115,.42);
  border-top-color:var(--gold2);
  transform:translateY(2px);
}
.header-next-dates > strong{
  display:block;
  margin:0 0 5px;
  color:var(--gold2);
  font-family:"Barlow Condensed",sans-serif;
  font-size:13px;
  font-weight:800;
  letter-spacing:.025em;
  line-height:1.1;
}
.header-next-dates-list{
  display:flex;
  flex-direction:column;
  gap:3px;
}
.header-next-date-row{
  display:grid;
  grid-template-columns:auto auto minmax(0,1fr);
  align-items:baseline;
  gap:5px;
  min-width:0;
  color:rgba(255,255,255,.88);
  font-size:9px;
  line-height:1.25;
  white-space:nowrap;
}
.header-next-date-row time{
  color:#fff;
  font-weight:700;
}
.header-next-date-row i{
  color:var(--gold2);
  font-style:normal;
}
.header-next-date-row > span{
  overflow:hidden;
  text-overflow:clip;
}

/* Der Header wird bei mittleren Breiten enger; dort rückt das Modul näher ans Logo. */
@media(max-width:1200px){
  .header-next-dates{
    left:220px;
    width:215px;
  }
}
@media(max-width:1050px){
  .header-next-dates{
    left:200px;
    width:205px;
  }
  .header-next-dates > strong{font-size:12.5px}
  .header-next-date-row{font-size:8.7px}
}

/* Tablet/Mobil: Modul unterhalb des Kopfbereichs, damit Menü/Logo nicht kollidieren. */
@media(max-width:900px){
  .header-next-dates{
    top:calc(100% - 6px);
    left:20px;
    width:min(300px,calc(100vw - 40px));
    padding:10px 12px 11px;
    z-index:18;
  }
}
@media(max-width:600px){
  .header-next-dates{
    top:calc(100% - 4px);
    left:14px;
    right:14px;
    width:auto;
    padding:9px 11px 10px;
  }
  .header-next-dates > strong{
    margin-bottom:4px;
    font-size:12px;
  }
  .header-next-date-row{
    gap:4px;
    font-size:8.8px;
    line-height:1.25;
  }
}


/* LOGO ÜBER TERMINE-MODUL */
.nav .brand{
  position:relative;
  z-index:30;
}
@media(max-width:900px){
  .header-next-dates{
    z-index:18;
  }
  .nav .brand{
    z-index:32;
  }
}


/* =========================================================
   HEADER-TERMINE – LOGO-ANKER + SCROLL-AUSBLENDUNG
   ========================================================= */

/* Desktop:
   Die horizontale Position wird per JS direkt aus der aktuellen
   Logo-Position berechnet. Dadurch bleibt der Abstand zum Logo
   unabhängig von der Fensterbreite konstant. */
@media(min-width:901px){
  .header-next-dates{
    right:auto;
    transition:
      opacity .22s ease,
      visibility .22s ease,
      transform .22s ease,
      background .18s ease,
      border-color .18s ease;
  }
}

/* Beim Scrollen verschwindet nur das Termine-Modul,
   der restliche Header bleibt unverändert. */
.header-next-dates.is-scrolled-away{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-10px);
}

/* Das Logo soll stets vor dem Modul liegen. */
.nav .brand{
  position:relative;
  z-index:40;
}

/* Mobil: Logo etwas kleiner und weiterhin vor dem Modul. */
@media(max-width:600px){
  .brand img{
    width:46px;
    height:46px;
  }
  .nav .brand{
    z-index:40;
  }
  .header-next-dates{
    z-index:18;
  }
}


/* =========================================================
   HEADER FINAL: NUR ZWEI LOGO-GRÖSSEN
   ========================================================= */

/* Zustand 1: Hauptnavigation ist vollständig sichtbar. */
@media(min-width:901px){
  .nav .brand img{
    width:110px !important;
    height:110px !important;
    margin-top:4px !important;
  }
}

/* Zustand 2: Hauptnavigation ist zum Button "Menü" zusammengeklappt.
   Diese Größe gilt einheitlich für Tablet UND Mobile. */
@media(max-width:900px){
  .nav .brand img{
    width:75px !important;
    height:75px !important;
    margin-top:6px !important;
  }
}

/* =========================================================
   TERMINE-MODUL: NACH UNTEN TRANSPARENTER
   ========================================================= */
.header-next-dates{
  background:linear-gradient(
    180deg,
    rgba(8,8,8,.82) 0%,
    rgba(8,8,8,.72) 42%,
    rgba(8,8,8,.48) 72%,
    rgba(8,8,8,.18) 100%
  ) !important;
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
}
.header-next-dates:hover{
  background:linear-gradient(
    180deg,
    rgba(8,8,8,.90) 0%,
    rgba(8,8,8,.80) 42%,
    rgba(8,8,8,.57) 72%,
    rgba(8,8,8,.24) 100%
  ) !important;
}


/* HERO-SLIDER: VIDEOS */
.hero-slide-video-media{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  background:#090909;
}
.hero-slider-full .hero-slide-video-media{
  width:100%;
  height:100%;
  object-fit:cover;
}



/* =========================================================
   HERO-SLIDER VIGNETTE
   Schwarze Vignette links, rechts und unten für Fotos & Videos
   ========================================================= */
.hero-slide{
  position:relative;
  overflow:hidden;
}

.hero-slide::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.58) 0%, rgba(0,0,0,.34) 10%, rgba(0,0,0,0) 23%, rgba(0,0,0,0) 77%, rgba(0,0,0,.34) 90%, rgba(0,0,0,.58) 100%),
    linear-gradient(180deg, rgba(0,0,0,0) 58%, rgba(0,0,0,.18) 74%, rgba(0,0,0,.42) 88%, rgba(0,0,0,.66) 100%);
}

.hero-slide img,
.hero-slide video{
  position:relative;
  z-index:1;
}


/* =========================================================
   HERO-SLIDER MOBILE: MEHR VOM QUERFORMAT-FOTO SICHTBAR
   ========================================================= */
@media(max-width:600px){
  .hero-slide{
    background:#000;
  }

  /* Nur Fotos: weniger Crop, etwas weiter herausgezoomt.
     Videos bleiben weiterhin auf cover. */
  .hero-slide:not(.hero-slide-video) .hero-slide-image{
    width:100%;
    height:100%;
    object-fit:contain !important;
    object-position:center center;
    transform:scale(.94);
    background:#000;
  }

  /* Die kleine Skalierung erzeugt bewusst etwas mehr schwarzen Rand,
     damit vom Querformat-Foto mehr sichtbar bleibt. */
  .hero-slide-video .hero-slide-video-media{
    object-fit:cover;
    transform:none;
  }
}


/* =========================================================
   HERO MOBILE: STÄRKERE VIGNETTE + SCHMALERER BEREICH
   ========================================================= */
@media(max-width:600px){
  /* Hero etwas niedriger, damit schwarze Restflächen kleiner werden. */
  .hero,
  .hero-slider,
  .hero-slider-full,
  .hero-slide{
    min-height:78svh !important;
    height:78svh !important;
  }

  .hero-slide{
    background:#000;
  }

  /* Foto weiter mit weniger Crop, aber ohne unnötig große schwarze Flächen. */
  .hero-slide:not(.hero-slide-video) .hero-slide-image{
    width:100%;
    height:100%;
    object-fit:contain !important;
    object-position:center center;
    transform:scale(.97);
    background:#000;
  }

  /* Starke weiche Vignette rings um mobile Fotos.
     Dadurch verschwinden harte Foto-/Schwarz-Kanten. */
  .hero-slide:not(.hero-slide-video)::before{
    background:
      radial-gradient(
        ellipse at center,
        rgba(0,0,0,0) 42%,
        rgba(0,0,0,.10) 56%,
        rgba(0,0,0,.34) 70%,
        rgba(0,0,0,.68) 86%,
        rgba(0,0,0,.92) 100%
      ),
      linear-gradient(
        180deg,
        rgba(0,0,0,.18) 0%,
        rgba(0,0,0,0) 22%,
        rgba(0,0,0,0) 58%,
        rgba(0,0,0,.42) 82%,
        rgba(0,0,0,.82) 100%
      ) !important;
  }

  /* Videos bleiben bildfüllend. */
  .hero-slide-video .hero-slide-video-media{
    object-fit:cover;
    transform:none;
  }
}


/* =========================================================
   MOBILE HERO FIX: TEXT / BUTTONS / WEICHE FOTO-KANTEN
   ========================================================= */
@media(max-width:600px){

  /* Etwas mehr vertikaler Platz als in der letzten Variante,
     aber weiterhin kompakter als die ursprüngliche Vollhöhe. */
  .hero,
  .hero-slider,
  .hero-slider-full,
  .hero-slide{
    min-height:90svh !important;
    height:90svh !important;
  }

  /* Text und Buttons klar oberhalb der goldenen Ticker-Leiste halten. */
  .hero-content{

    transform:none !important;
    padding-bottom:0 !important;
  }

  .hero-copy,
  .hero-copy-wrap,
  .hero-content-inner{
    margin-bottom:0 !important;
  }

  .hero-actions,
  .hero-buttons{
    display:flex !important;
    position:relative;
    z-index:12;
    margin-top:14px !important;
    margin-bottom:0 !important;
  }

  /* Foto selbst weiterhin stärker herausgezoomt. */
  .hero-slide:not(.hero-slide-video) .hero-slide-image{
    width:100%;
    height:100%;
    object-fit:contain !important;
    object-position:center center;
    transform:scale(.96);
    background:#000;
  }

  /* Alte Slide-Vignette deaktivieren, damit sie nicht an der
     gesamten Slide-Fläche statt an der sichtbaren Fotokante sitzt. */
  .hero-slide:not(.hero-slide-video)::before{
    background:none !important;
  }

  /* Weiche Abdunklung direkt über der sichtbaren Foto-Fläche.
     Durch Masking laufen die vier harten Bildkanten ins Schwarz aus. */
  .hero-slide:not(.hero-slide-video)::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:3;
    pointer-events:none;
    background:
      linear-gradient(90deg,
        rgba(0,0,0,.92) 0%,
        rgba(0,0,0,.62) 7%,
        rgba(0,0,0,.20) 15%,
        rgba(0,0,0,0) 25%,
        rgba(0,0,0,0) 75%,
        rgba(0,0,0,.20) 85%,
        rgba(0,0,0,.62) 93%,
        rgba(0,0,0,.92) 100%
      ),
      linear-gradient(180deg,
        rgba(0,0,0,.96) 0%,
        rgba(0,0,0,.72) 7%,
        rgba(0,0,0,.36) 14%,
        rgba(0,0,0,0) 27%,
        rgba(0,0,0,0) 70%,
        rgba(0,0,0,.40) 84%,
        rgba(0,0,0,.76) 93%,
        rgba(0,0,0,.98) 100%
      );
  }

  /* Goldticker bleibt am unteren Rand; Inhalt liegt nun sicher darüber. */
  .hero-ticker,
  .hero-news-ticker{
    z-index:20;
  }
}


/* =========================================================
   MOBILE HERO: INHALT GEMEINSAM CA. 2 CM NACH OBEN
   ========================================================= */
@media(max-width:600px){

  /* Fotoebene gemeinsam anheben */
  .hero-slide:not(.hero-slide-video) .hero-slide-image{
    transform:translateY(-100px) scale(.96) !important;
  }

  .hero-slide-video .hero-slide-video-media{
    transform:translateY(-100px) !important;
  }

  /* Text + Buttons gemeinsam anheben */
  .hero-content{

  }
}




/* =========================================================
   MOBILE HERO: TXT-STEUERUNG TEXT + BUTTONS
   Tatsächliches Zielelement: .hero-overlay .hero-copy
   ========================================================= */
@media(max-width:600px){
  .hero-overlay .hero-copy{
    transform:translateY(calc(-1 * var(--mobile-hero-content-position,100px))) !important;
    will-change:transform;
  }
}


/* =========================================================
   MOBILE HERO: STÄRKERE SCHWARZE VIGNETTE OBEN + UNTEN
   ========================================================= */
@media(max-width:600px){
  .hero-slide:not(.hero-slide-video)::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:3;
    pointer-events:none;
    background:
      linear-gradient(90deg,
        rgba(0,0,0,.88) 0%,
        rgba(0,0,0,.54) 8%,
        rgba(0,0,0,.14) 17%,
        rgba(0,0,0,0) 28%,
        rgba(0,0,0,0) 72%,
        rgba(0,0,0,.14) 83%,
        rgba(0,0,0,.54) 92%,
        rgba(0,0,0,.88) 100%
      ),
      linear-gradient(180deg,
        rgba(0,0,0,.98) 0%,
        rgba(0,0,0,.82) 8%,
        rgba(0,0,0,.45) 18%,
        rgba(0,0,0,.08) 30%,
        rgba(0,0,0,0) 42%,
        rgba(0,0,0,0) 58%,
        rgba(0,0,0,.08) 70%,
        rgba(0,0,0,.45) 82%,
        rgba(0,0,0,.82) 92%,
        rgba(0,0,0,.98) 100%
      ) !important;
  }
}


/* =========================================================
   HERO-SLIDER VIGNETTE – PER START.TXT STEUERBAR
   Pixelwerte = Tiefe des Verlaufs.
   Stärke = 0 bis 100 Prozent, getrennt Desktop/Mobil.
   ========================================================= */

/* Desktop */
@media(min-width:601px){
  .hero-slide::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:4;
    pointer-events:none;
    background:
      linear-gradient(to right,
        rgb(0 0 0 / var(--hero-vignette-desktop-strength,.94)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-desktop-left,200px)
      ),
      linear-gradient(to left,
        rgb(0 0 0 / var(--hero-vignette-desktop-strength,.94)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-desktop-right,200px)
      ),
      linear-gradient(to bottom,
        rgb(0 0 0 / var(--hero-vignette-desktop-strength,.94)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-desktop-top,80px)
      ),
      linear-gradient(to top,
        rgb(0 0 0 / var(--hero-vignette-desktop-strength,.94)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-desktop-bottom,200px)
      ) !important;
  }

  .hero-slide:not(.hero-slide-video)::after{
    display:none !important;
  }
}

/* Mobil */
@media(max-width:600px){
  .hero-slide::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:4;
    pointer-events:none;
    background:
      linear-gradient(to right,
        rgb(0 0 0 / var(--hero-vignette-mobile-strength,.98)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-mobile-left,800px)
      ),
      linear-gradient(to left,
        rgb(0 0 0 / var(--hero-vignette-mobile-strength,.98)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-mobile-right,800px)
      ),
      linear-gradient(to bottom,
        rgb(0 0 0 / var(--hero-vignette-mobile-strength,.98)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-mobile-top,800px)
      ),
      linear-gradient(to top,
        rgb(0 0 0 / var(--hero-vignette-mobile-strength,.98)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-mobile-bottom,800px)
      ) !important;
  }

  /* Alte feste Mobile-Vignette deaktivieren:
     Es gelten ausschließlich die Werte aus start.txt. */
  .hero-slide:not(.hero-slide-video)::after{
    display:none !important;
  }
}


/* =========================================================
   MOBILE HERO VIGNETTE – SPEZIFITAETS-FIX
   Überschreibt ältere mobile background:none!important-Regeln.
   ========================================================= */
@media(max-width:600px){

  .hero-slide:not(.hero-slide-video)::before,
  .hero-slide.hero-slide-video::before{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    inset:0 !important;
    z-index:4 !important;
    pointer-events:none !important;
    background:
      linear-gradient(to right,
        rgb(0 0 0 / var(--hero-vignette-mobile-strength,.98)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-mobile-left,800px)
      ),
      linear-gradient(to left,
        rgb(0 0 0 / var(--hero-vignette-mobile-strength,.98)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-mobile-right,800px)
      ),
      linear-gradient(to bottom,
        rgb(0 0 0 / var(--hero-vignette-mobile-strength,.98)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-mobile-top,800px)
      ),
      linear-gradient(to top,
        rgb(0 0 0 / var(--hero-vignette-mobile-strength,.98)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-mobile-bottom,800px)
      ) !important;
  }

  /* Die alte ::after-Vignette bleibt abgeschaltet, damit sich
     keine zwei Vignetten-Systeme überlagern. */
  .hero-slide:not(.hero-slide-video)::after{
    display:none !important;
  }
}




/* =========================================================
   MOBILE HERO VIGNETTE – EXAKT AN SICHTBARE FOTOFLÄCHE
   Unterkante läuft automatisch mit der tatsächlichen Fotounterkante mit.
   ========================================================= */
@media(max-width:600px){

  .hero-slide:not(.hero-slide-video)::before{
    top:var(--mobile-vignette-photo-top,0px) !important;
    left:var(--mobile-vignette-photo-left,0px) !important;
    right:auto !important;
    bottom:auto !important;
    width:var(--mobile-vignette-photo-width,100%) !important;
    height:var(--mobile-vignette-photo-height,50%) !important;
    overflow:hidden !important;
  }

  /* Videos bleiben auf ihrer vollständigen sichtbaren Hero-Mediafläche. */
  .hero-slide.hero-slide-video::before{
    top:0 !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    width:100% !important;
    height:100% !important;
  }
}


/* =========================================================
   MOBILE HERO: KEINE VIGNETTE AUF LOGO-/WILLKOMMENS-SLIDE
   Foto-Slides bleiben unverändert.
   ========================================================= */
@media(max-width:600px){
  .hero-slide-logo::before,
  .hero-logo-slide::before,
  .hero-slide.logo-slide::before,
  .hero-slide[data-media-type="logo"]::before,
  .hero-slide[data-slide-type="logo"]::before{
    display:none !important;
    background:none !important;
  }
}


/* =========================================================
   MOBILE HERO LOGO-SLIDE – KOMPLETT OHNE VIGNETTE/ABDUNKLUNG
   ========================================================= */
@media(max-width:600px){

  #hero-slider.is-logo-slide-active .hero-slide-logo::before{
    display:none !important;
    background:none !important;
  }

  #hero-slider.is-logo-slide-active .hero-photo-shade{
    display:none !important;
    background:none !important;
  }
}


/* =========================================================
   MOBILE HERO: TEXT + BUTTONS IMMER ÜBER DER VIGNETTE
   ========================================================= */
@media(max-width:600px){
  .hero-overlay{
    position:relative;
    z-index:20 !important;
  }

  .hero-overlay .hero-copy{
    position:relative;
    z-index:21 !important;
  }

  .hero-overlay .hero-actions,
  .hero-overlay .hero-buttons{
    position:relative;
    z-index:22 !important;
  }
}


/* =========================================================
   DESKTOP HERO: FOTO-ZOOM AUS START.TXT + SCHWARZE RÄNDER
   Mobile bleibt unverändert.
   ========================================================= */
@media(min-width:601px){

  .hero-slide{
    background:#000;
  }

  .hero-slide:not(.hero-slide-video):not(.hero-slide-logo) .hero-slide-image{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    object-position:center center !important;
    transform:scale(var(--hero-desktop-photo-zoom,.80)) !important;
    transform-origin:center center !important;
    background:#000 !important;
  }

  .hero-slide:not(.hero-slide-video):not(.hero-slide-logo)::before{
    top:var(--desktop-vignette-photo-top,10%) !important;
    left:var(--desktop-vignette-photo-left,10%) !important;
    right:auto !important;
    bottom:auto !important;
    width:var(--desktop-vignette-photo-width,80%) !important;
    height:var(--desktop-vignette-photo-height,80%) !important;
    background:
      linear-gradient(to right,
        rgb(0 0 0 / var(--hero-vignette-desktop-strength,.94)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-desktop-left,200px)
      ),
      linear-gradient(to left,
        rgb(0 0 0 / var(--hero-vignette-desktop-strength,.94)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-desktop-right,200px)
      ),
      linear-gradient(to bottom,
        rgb(0 0 0 / var(--hero-vignette-desktop-strength,.94)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-desktop-top,80px)
      ),
      linear-gradient(to top,
        rgb(0 0 0 / var(--hero-vignette-desktop-strength,.94)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-desktop-bottom,200px)
      ) !important;
  }
}


/* =========================================================
   DESKTOP HERO – PROZENT / BILDSCHIRMFÜLLEND
   Mobile bleibt vollständig unverändert.
   ========================================================= */
@media(min-width:601px){

  /* Prozentmodus: Foto kleiner, freie Flächen schwarz */
  html:not(.hero-desktop-fullscreen) .hero-slide:not(.hero-slide-video):not(.hero-slide-logo) .hero-slide-image{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    object-position:center center !important;
    transform:scale(var(--hero-desktop-photo-zoom,.80)) !important;
    transform-origin:center center !important;
    background:#000 !important;
  }

  /* Bildschirmfüllend: ursprüngliches Full-Bleed-Verhalten */
  html.hero-desktop-fullscreen .hero-slide:not(.hero-slide-video):not(.hero-slide-logo) .hero-slide-image{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center center !important;
    transform:none !important;
    background:#000 !important;
  }

  /* Vignette exakt über der sichtbaren Fotofläche */
  .hero-slide:not(.hero-slide-video):not(.hero-slide-logo)::before{
    top:var(--desktop-vignette-photo-top,0px) !important;
    left:var(--desktop-vignette-photo-left,0px) !important;
    right:auto !important;
    bottom:auto !important;
    width:var(--desktop-vignette-photo-width,100%) !important;
    height:var(--desktop-vignette-photo-height,100%) !important;
    z-index:4 !important;
    pointer-events:none !important;
    background:
      linear-gradient(to right,
        rgb(0 0 0 / var(--hero-vignette-desktop-strength,.94)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-desktop-left,200px)
      ),
      linear-gradient(to left,
        rgb(0 0 0 / var(--hero-vignette-desktop-strength,.94)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-desktop-right,200px)
      ),
      linear-gradient(to bottom,
        rgb(0 0 0 / var(--hero-vignette-desktop-strength,.94)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-desktop-top,80px)
      ),
      linear-gradient(to top,
        rgb(0 0 0 / var(--hero-vignette-desktop-strength,.94)) 0,
        rgb(0 0 0 / 0) var(--hero-vignette-desktop-bottom,200px)
      ) !important;
  }

  /* Textblock + Buttons liegen Desktop immer oberhalb der Vignette */
  .hero-overlay{
    position:relative;
    z-index:20 !important;
  }

  .hero-overlay .hero-copy{
    position:relative;
    z-index:21 !important;
  }

  .hero-overlay .hero-actions,
  .hero-overlay .hero-buttons{
    position:relative;
    z-index:22 !important;
  }
}


/* =========================================================
   DESKTOP HERO: VIGNETTE 2PX ÜBER FOTO-KANTE ZIEHEN
   Verhindert helle Subpixel-/Rundungsspalten links/rechts.
   Mobile bleibt unverändert.
   ========================================================= */
@media(min-width:601px){
  .hero-slide:not(.hero-slide-video):not(.hero-slide-logo)::before{
    left:calc(var(--desktop-vignette-photo-left,0px) - 2px) !important;
    width:calc(var(--desktop-vignette-photo-width,100%) + 4px) !important;
  }
}


/* =========================================================
   HERO LEAD FEST UNTER DEN BUTTONS
   Abstand Buttons <-> Lead = Abstand zwischen den Buttons.
   ========================================================= */
.hero-overlay .hero-copy{
  --hero-button-gap:12px;
}
.hero-overlay .hero-actions{
  gap:var(--hero-button-gap) !important;
  margin-bottom:0 !important;
}
.hero-overlay .hero-lead{
  margin:var(--hero-button-gap) 0 0 !important;
}

@media(max-width:900px){
  .hero-overlay .hero-copy{--hero-button-gap:10px;}
}
@media(max-width:600px){
  .hero-overlay .hero-copy{--hero-button-gap:8px;}
}








/* =========================================================
   DESKTOP HERO – POSITION TEXT + BUTTONS + LEAD PRO FOTO
   Klare Definition:
   unten = bisherige Desktop-Grundposition
   mitte = exakt horizontal + vertikal im sichtbaren Foto zentriert
   oben  = im oberen Drittel mit Sicherheitsabstand zur Fotokante
   Mobile bleibt unverändert.
   ========================================================= */
@media(min-width:601px){

  /* Gemeinsame horizontale Basis */
  .hero[data-desktop-content-position] .hero-overlay{
    position:relative !important;
    justify-content:center !important;
  }

  /* UNTEN = exakt der bisherige Stand vor Einführung der Positionslogik */
  .hero[data-desktop-content-position="unten"] .hero-overlay{
    align-items:flex-end !important;
    padding-top:96px !important;
    padding-bottom:104px !important;
  }

  .hero[data-desktop-content-position="unten"] .hero-overlay .hero-copy{
    position:relative !important;
    left:auto !important;
    top:auto !important;
    bottom:auto !important;
    margin:0 auto !important;
    transform:translateY(-76px) !important;
  }

  /* MITTE = Mittelpunkt des kompletten Inhaltsblocks exakt
     auf dem Mittelpunkt der tatsächlich sichtbaren Fotofläche. */
  .hero[data-desktop-content-position="mitte"] .hero-overlay{
    align-items:flex-start !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
  }

  .hero[data-desktop-content-position="mitte"] .hero-overlay .hero-copy{
    position:absolute !important;
    left:50% !important;
    right:auto !important;
    top:calc(
      var(--desktop-active-photo-top,0px)
      + (var(--desktop-active-photo-height,100svh) / 2)
    ) !important;
    bottom:auto !important;
    margin:0 !important;
    transform:translate(-50%,-50%) !important;
  }

  /* OBEN = oberes Drittel, aber nicht direkt an der Fotokante.
     Der Mittelpunkt des Blocks liegt bei ca. 20 % der Fotohöhe. */
  .hero[data-desktop-content-position="oben"] .hero-overlay{
    align-items:flex-start !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
  }

  .hero[data-desktop-content-position="oben"] .hero-overlay .hero-copy{
    position:absolute !important;
    left:50% !important;
    right:auto !important;
    top:calc(
      var(--desktop-active-photo-top,0px)
      + (var(--desktop-active-photo-height,100svh) * .20)
    ) !important;
    bottom:auto !important;
    margin:0 !important;
    transform:translate(-50%,-50%) !important;
  }
}


/* =========================================================
   SCHWEBENDE ABSCHNITT-NAVIGATION
   Ein-/Ausschaltbar getrennt für Desktop und Mobile.
   ========================================================= */
.section-jump-nav{
  position:fixed;
  right:18px;
  top:50%;
  transform:translateY(-50%);
  z-index:1200;
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:7px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:28px;
  background:rgba(12,12,12,.62);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:0 10px 30px rgba(0,0,0,.22);
}

.section-jump-btn{
  width:42px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:1px solid rgba(225,194,115,.5);
  border-radius:50%;
  background:rgba(17,17,17,.82);
  color:#fff;
  font-size:23px;
  line-height:1;
  cursor:pointer;
  transition:background .18s ease,border-color .18s ease,color .18s ease,opacity .18s ease,transform .18s ease;
}

.section-jump-btn:hover,
.section-jump-btn:focus-visible{
  border-color:var(--gold2);
  color:var(--gold2);
  background:#171411;
  outline:none;
  transform:scale(1.05);
}

.section-jump-btn:disabled{
  opacity:.22;
  cursor:default;
  transform:none;
}

@media(min-width:901px){
  body.section-jump-desktop-off .section-jump-nav{display:none!important}
}

@media(max-width:900px){
  body.section-jump-mobile-off .section-jump-nav{display:none!important}

  .section-jump-nav{
    right:8px;
    gap:6px;
    padding:5px;
    border-radius:24px;
  }

  .section-jump-btn{
    width:36px;
    height:36px;
    font-size:20px;
  }
}


/* =========================================================
   ABSCHNITT-NAVIGATION – KOMPAKT + TRANSPARENT
   Desktop: erst bei Hover deutlich sichtbar.
   ========================================================= */
.section-jump-nav{
  right:12px !important;
  gap:4px !important;
  padding:4px !important;
  border-color:rgba(255,255,255,.08) !important;
  background:rgba(12,12,12,.12) !important;
  box-shadow:none !important;
  backdrop-filter:blur(4px) !important;
  -webkit-backdrop-filter:blur(4px) !important;
}

.section-jump-btn{
  width:30px !important;
  height:30px !important;
  border-color:rgba(255,255,255,.18) !important;
  background:rgba(0,0,0,.08) !important;
  color:rgba(255,255,255,.62) !important;
  font-size:17px !important;
  box-shadow:none !important;
}

@media(min-width:901px){
  .section-jump-nav{
    opacity:.42;
    transition:opacity .18s ease, background .18s ease, border-color .18s ease;
  }

  .section-jump-nav:hover{
    opacity:1;
    background:rgba(12,12,12,.58) !important;
    border-color:rgba(255,255,255,.16) !important;
  }

  .section-jump-btn:hover,
  .section-jump-btn:focus-visible{
    border-color:var(--gold2) !important;
    color:var(--gold2) !important;
    background:rgba(17,17,17,.88) !important;
    transform:scale(1.08) !important;
  }
}

@media(max-width:900px){
  .section-jump-nav{
    right:6px !important;
    gap:3px !important;
    padding:3px !important;
    background:rgba(12,12,12,.16) !important;
  }

  .section-jump-btn{
    width:28px !important;
    height:28px !important;
    font-size:16px !important;
    background:rgba(0,0,0,.10) !important;
    color:rgba(255,255,255,.72) !important;
  }
}


/* =========================================================
   ABSCHNITT-NAVIGATION – MOBILE NOCH TRANSPARENTER
   Desktop bleibt unverändert.
   ========================================================= */
@media(max-width:900px){
  .section-jump-nav{
    background:rgba(12,12,12,.08) !important;
    border-color:rgba(255,255,255,.05) !important;
  }

  .section-jump-btn{
    background:rgba(0,0,0,.04) !important;
    border-color:rgba(255,255,255,.12) !important;
    color:rgba(255,255,255,.56) !important;
  }
}


/* =========================================================
   MOBILE "NACH OBEN" – OPTIK WIE ABSCHNITT-NAVIGATION
   Position bleibt unverändert. Desktop unverändert.
   ========================================================= */
@media(max-width:900px){
  #floating-top-button{
    width:28px !important;
    height:28px !important;
    min-width:28px !important;
    min-height:28px !important;
    padding:0 !important;
    border:1px solid rgba(255,255,255,.12) !important;
    border-radius:50% !important;
    background:rgba(0,0,0,.04) !important;
    color:rgba(255,255,255,.56) !important;
    box-shadow:none !important;
    backdrop-filter:blur(4px) !important;
    -webkit-backdrop-filter:blur(4px) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:16px !important;
    line-height:1 !important;
    text-decoration:none !important;
  }

  #floating-top-button span{
    display:block !important;
    line-height:1 !important;
    margin:0 !important;
    padding:0 !important;
  }
}


/* =========================================================
   DESKTOP "NACH OBEN" – OPTIK WIE ABSCHNITT-NAVIGATION
   Position bleibt unverändert. Nur Pfeil sichtbar.
   ========================================================= */
@media(min-width:901px){
  #floating-top-button{
    width:30px !important;
    height:30px !important;
    min-width:30px !important;
    min-height:30px !important;
    padding:0 !important;
    border:1px solid rgba(255,255,255,.18) !important;
    border-radius:50% !important;
    background:rgba(0,0,0,.08) !important;
    color:rgba(255,255,255,.62) !important;
    box-shadow:none !important;
    backdrop-filter:blur(4px) !important;
    -webkit-backdrop-filter:blur(4px) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:17px !important;
    line-height:1 !important;
    text-decoration:none !important;
    opacity:.42 !important;
    transition:opacity .18s ease, background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease !important;
  }

  #floating-top-button:hover{
    opacity:1 !important;
    border-color:var(--gold2) !important;
    color:var(--gold2) !important;
    background:rgba(17,17,17,.88) !important;
    transform:scale(1.08) !important;
  }

  #floating-top-button:focus-visible{
    opacity:1 !important;
    border-color:var(--gold2) !important;
    color:var(--gold2) !important;
    background:rgba(17,17,17,.88) !important;
    outline:none !important;
  }

  #floating-top-button span{
    display:block !important;
    line-height:1 !important;
    margin:0 !important;
    padding:0 !important;
  }
}


/* =========================================================
   ABSCHNITT-NAVIGATION – CONTAINER OHNE GRAUEN LAYER
   Alle drei Pfeil-Buttons minimal weniger transparent.
   ========================================================= */
.section-jump-nav{
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

/* Die beiden Abschnitts-Buttons etwas klarer sichtbar */
.section-jump-btn{
  background:rgba(0,0,0,.12) !important;
  border-color:rgba(255,255,255,.24) !important;
  color:rgba(255,255,255,.72) !important;
}

/* Desktop: Container bleibt auch bei Hover selbst transparent.
   Nur die Buttons reagieren sichtbar. */
@media(min-width:901px){
  .section-jump-nav:hover{
    background:transparent !important;
    border-color:transparent !important;
  }

  #floating-top-button{
    background:rgba(0,0,0,.12) !important;
    border-color:rgba(255,255,255,.24) !important;
    color:rgba(255,255,255,.72) !important;
    opacity:.52 !important;
  }
}

/* Mobile: ebenfalls ohne Container-Layer; alle Pfeile etwas klarer */
@media(max-width:900px){
  .section-jump-nav{
    background:transparent !important;
    border-color:transparent !important;
  }

  .section-jump-btn,
  #floating-top-button{
    background:rgba(0,0,0,.08) !important;
    border-color:rgba(255,255,255,.18) !important;
    color:rgba(255,255,255,.66) !important;
  }
}


/* =========================================================
   NACH-OBEN-BUTTON – KLEINER HORIZONTALER STRICH ÜBER DEM PFEIL
   Gilt für Desktop und Mobil.
   ========================================================= */
#floating-top-button{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:2px !important;
}

#floating-top-button::before{
  content:"" !important;
  display:block !important;
  width:10px !important;
  height:1.5px !important;
  border-radius:2px !important;
  background:currentColor !important;
  opacity:.95 !important;
  flex:0 0 auto !important;
}

#floating-top-button span{
  display:block !important;
  line-height:1 !important;
  margin:0 !important;
  padding:0 !important;
  transform:translateY(-0.5px) !important;
}


/* =========================================================
   HERO-SLIDER-NAVIGATION – KOMPAKT UNTER HERO-INHALT
   Optik analog Abschnitts-Navigation, Pfeile kleiner,
   Punkte zwischen den Pfeilen.
   ========================================================= */
.hero-slider-controls{
  position:absolute !important;
  left:50% !important;
  right:auto !important;
  top:auto !important;
  bottom:clamp(28px,5vh,56px) !important;
  transform:translateX(-50%) !important;
  z-index:30 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  width:auto !important;
  padding:0 !important;
  margin:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  pointer-events:auto !important;
}

.hero-slider-prev,
.hero-slider-next{
  position:static !important;
  inset:auto !important;
  transform:none !important;
  width:26px !important;
  height:26px !important;
  min-width:26px !important;
  min-height:26px !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid rgba(255,255,255,.22) !important;
  border-radius:50% !important;
  background:rgba(0,0,0,.10) !important;
  color:rgba(255,255,255,.70) !important;
  box-shadow:none !important;
  backdrop-filter:blur(3px) !important;
  -webkit-backdrop-filter:blur(3px) !important;
  font-size:15px !important;
  line-height:1 !important;
  opacity:.62 !important;
  transition:opacity .18s ease, background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease !important;
}

.hero-slider-prev:hover,
.hero-slider-next:hover,
.hero-slider-prev:focus-visible,
.hero-slider-next:focus-visible{
  opacity:1 !important;
  border-color:var(--gold2) !important;
  color:var(--gold2) !important;
  background:rgba(17,17,17,.84) !important;
  outline:none !important;
  transform:scale(1.06) !important;
}

.hero-slider-dots{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  min-height:26px !important;
}

.hero-slider-dot{
  width:5px !important;
  height:5px !important;
  min-width:5px !important;
  min-height:5px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:50% !important;
  background:rgba(255,255,255,.38) !important;
  box-shadow:none !important;
  opacity:.85 !important;
  cursor:pointer !important;
  transition:transform .16s ease, background .16s ease, opacity .16s ease !important;
}

.hero-slider-dot.is-active{
  background:var(--gold2) !important;
  opacity:1 !important;
  transform:scale(1.35) !important;
}

.hero-slider-dot:hover,
.hero-slider-dot:focus-visible{
  background:#fff !important;
  opacity:1 !important;
  outline:none !important;
}

/* Desktop:
   Navigation liegt unter dem gesamten Inhaltsblock.
   Die JS/CSS-Position des Inhalts variiert je Foto; deshalb
   koppeln wir die Controls an die jeweilige Inhaltsposition. */
@media(min-width:601px){
  .hero[data-desktop-content-position="oben"] .hero-slider-controls{
    top:calc(
      var(--desktop-active-photo-top,0px)
      + (var(--desktop-active-photo-height,100svh) * .20)
      + 170px
    ) !important;
    bottom:auto !important;
  }

  .hero[data-desktop-content-position="mitte"] .hero-slider-controls{
    top:calc(
      var(--desktop-active-photo-top,0px)
      + (var(--desktop-active-photo-height,100svh) / 2)
      + 170px
    ) !important;
    bottom:auto !important;
  }

  .hero[data-desktop-content-position="unten"] .hero-slider-controls{
    bottom:44px !important;
    top:auto !important;
  }
}

/* Mobile:
   direkt unter Hero-Text/Buttons/Lead, aber oberhalb des Tickers. */
@media(max-width:600px){
  .hero-slider-controls{
    bottom:58px !important;
    gap:6px !important;
  }

  .hero-slider-prev,
  .hero-slider-next{
    width:24px !important;
    height:24px !important;
    min-width:24px !important;
    min-height:24px !important;
    font-size:14px !important;
  }

  .hero-slider-dots{
    min-height:24px !important;
  }

  .hero-slider-dot{
    width:4px !important;
    height:4px !important;
    min-width:4px !important;
    min-height:4px !important;
  }
}


/* Slider-Dots in der neuen kompakten Navigation explizit sichtbar */
.hero-slider-controls .hero-slider-dots,
.hero-slider-controls .hero-slider-dot{
  visibility:visible !important;
}


/* =========================================================
   HERO-SLIDER-NAVIGATION – DESKTOP IMMER AM UNTEREN FOTORAND
   Mobile bleibt exakt unverändert.
   ========================================================= */
@media(min-width:601px){
  .hero-slider-controls{
    left:50% !important;
    right:auto !important;
    top:calc(
      var(--desktop-active-photo-top,0px)
      + var(--desktop-active-photo-height,100svh)
      - 38px
    ) !important;
    bottom:auto !important;
    transform:translateX(-50%) !important;
  }

  .hero[data-desktop-content-position="oben"] .hero-slider-controls,
  .hero[data-desktop-content-position="mitte"] .hero-slider-controls,
  .hero[data-desktop-content-position="unten"] .hero-slider-controls{
    top:calc(
      var(--desktop-active-photo-top,0px)
      + var(--desktop-active-photo-height,100svh)
      - 38px
    ) !important;
    bottom:auto !important;
  }
}


/* =========================================================
   HERO-SLIDER-NAVIGATION – DESKTOP ETWAS HÖHER + OBERSTE EBENE
   Mobile bleibt unverändert.
   ========================================================= */
@media(min-width:601px){
  .hero-slider-controls,
  .hero[data-desktop-content-position="oben"] .hero-slider-controls,
  .hero[data-desktop-content-position="mitte"] .hero-slider-controls,
  .hero[data-desktop-content-position="unten"] .hero-slider-controls{
    top:calc(
      var(--desktop-active-photo-top,0px)
      + var(--desktop-active-photo-height,100svh)
      - 56px
    ) !important;
    bottom:auto !important;
    z-index:999 !important;
    isolation:isolate !important;
  }

  .hero-slider-controls *{
    position:relative;
    z-index:1000 !important;
  }
}


/* =========================================================
   SOUND/KONZEPT – OPTIONALE KACHEL- UND EVENTFOTOS
   ========================================================= */
.music-card-photo[hidden],
.event-card-photo[hidden]{display:none!important}

.music-card-photo{
  margin:-28px -28px 22px;
  width:calc(100% + 56px);
  aspect-ratio:1/1;
  overflow:hidden;
  background:#ece8e1;
}
.music-card-photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.event-card{
  display:flex;
  flex-direction:column;
}
.event-card-photo{
  width:100%;
  aspect-ratio:1/1;
  margin:16px 0 18px;
  overflow:hidden;
  background:#0f0f0f;
}
.event-card-photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
#musik .event-grid-quotes .event-card p{
  font-style:normal;
}
#musik .event-grid-quotes .event-card p.is-quoted{
  font-style:italic;
}
.event-outro-text{
  width:100%;
  max-width:none;
  margin-top:32px;
}
.dates-intro-text,
.dates-outro-text{
  width:100%;
  max-width:none;
}
.dates-intro-text{margin-top:26px}
.dates-outro-text{margin-top:34px}


/* =========================================================
   SOUND/KONZEPT – KACHEL- UND EVENTFOTOS FEINTUNING
   - alle vier Programm-Kacheln optisch einheitlich
   - Eventfotos ohne schwarzen Rahmen
   - Eventfotos schmaler, oben/unten beschnitten
   ========================================================= */
.music-grid{
  align-items:stretch;
}
.music-card{
  display:flex;
  flex-direction:column;
  height:100%;
}
.music-card-photo{
  flex:0 0 auto;
  aspect-ratio:1 / 1 !important;
  overflow:hidden;
}
.music-card-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}

#musik .event-card{
  overflow:hidden;
}
.event-card-photo{
  width:100%;
  aspect-ratio:4 / 3 !important;
  margin:16px 0 18px;
  overflow:hidden;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}
.event-card-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
}


/* =========================================================
   SOUND/KONZEPT – GLEICHE PROGRAMM-KACHELN + EVENT-SLIDER
   ========================================================= */
#musik .music-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  grid-auto-rows:1fr;
  align-items:stretch;
}
#musik .music-card{
  width:100%;
  min-width:0;
  height:100%;
  display:flex;
  flex-direction:column;
}
#musik .music-card-photo{
  width:calc(100% + 56px) !important;
  min-width:calc(100% + 56px);
  aspect-ratio:1 / 1 !important;
  flex:0 0 auto;
  overflow:hidden;
}
#musik .music-card-photo img{
  width:100% !important;
  height:100% !important;
  display:block;
  object-fit:cover !important;
  object-position:center center;
}

#musik .event-slider{
  position:relative;
  margin-top:34px;
  padding:0 48px;
}
#musik .event-slider-viewport{
  overflow:hidden;
  width:100%;
  scroll-behavior:smooth;
  scrollbar-width:none;
}
#musik .event-slider-viewport::-webkit-scrollbar{display:none}
#musik .event-grid-quotes.event-slider-track{
  display:flex !important;
  grid-template-columns:none !important;
  gap:16px;
  margin-top:0 !important;
  width:100%;
}
#musik .event-slider-track .event-card{
  flex:0 0 calc((100% - 32px) / 3);
  min-width:0;
  scroll-snap-align:start;
}
#musik .event-card strong{
  text-align:center;
  width:100%;
}
#musik .event-card p,
#musik .event-grid-quotes .event-card p,
#musik .event-grid-quotes .event-card p.is-quoted{
  font-style:normal;
  text-transform:none;
}
#musik .event-card p strong{font-weight:800}
#musik .event-card p em{font-style:italic}
#musik .event-slider-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:3;
  width:34px;
  height:34px;
  border-radius:50%;
  border:1px solid rgba(17,17,17,.28);
  background:rgba(255,255,255,.88);
  color:#171717;
  font-size:28px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 4px 14px rgba(0,0,0,.12);
}
#musik .event-slider-prev{left:4px}
#musik .event-slider-next{right:4px}
#musik .event-slider-arrow:disabled{
  opacity:.25;
  cursor:default;
}
.auto-theme-dark#musik .event-slider-arrow{
  background:rgba(24,24,24,.9);
  color:#fff;
  border-color:rgba(255,255,255,.25);
}
@media(max-width:900px){
  #musik .music-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  #musik .event-slider-track .event-card{flex-basis:calc((100% - 16px) / 2)}
}
@media(max-width:600px){
  #musik .music-grid{grid-template-columns:1fr !important}
  #musik .event-slider{padding:0 38px}
  #musik .event-slider-track .event-card{flex-basis:100%}
  #musik .event-slider-arrow{width:30px;height:30px;font-size:24px}
}


/* =========================================================
   MOBILE KARTEN-SLIDER
   Nur Smartphone <= 600px. Desktop/Tablet bleiben unverändert.
   Gilt für Programm, Band, Buchungsformate, Veranstalter-Medien
   und neueste Social-Media-Beiträge.
   ========================================================= */
.mobile-card-slider{
  position:relative;
}
.mobile-card-slider-viewport{
  overflow:visible;
}
.mobile-card-slider-arrow{
  display:none;
}

@media(max-width:600px){
  .mobile-card-slider{
    position:relative;
    padding:0 36px;
    margin-left:-36px;
    margin-right:-36px;
  }
  .mobile-card-slider-viewport{
    overflow-x:auto;
    overflow-y:hidden;
    width:100%;
    scroll-behavior:smooth;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
  }
  .mobile-card-slider-viewport::-webkit-scrollbar{display:none}

  .mobile-card-slider .mobile-card-slider-track{
    display:flex !important;
    flex-wrap:nowrap !important;
    grid-template-columns:none !important;
    grid-auto-columns:auto !important;
    gap:14px !important;
    width:100%;
    max-width:none;
    margin-left:0;
    margin-right:0;
  }
  .mobile-card-slider .mobile-card-slider-track > *{
    flex:0 0 100% !important;
    width:100% !important;
    min-width:100% !important;
    max-width:100% !important;
    scroll-snap-align:start;
    scroll-snap-stop:always;
    box-sizing:border-box;
  }

  .mobile-card-slider-arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:6;
    display:flex;
    align-items:center;
    justify-content:center;
    width:30px;
    height:30px;
    padding:0;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.28);
    background:rgba(17,17,17,.82);
    color:#fff;
    font-size:24px;
    line-height:1;
    cursor:pointer;
    box-shadow:0 4px 14px rgba(0,0,0,.18);
    -webkit-tap-highlight-color:transparent;
  }
  .mobile-card-slider-prev{left:1px}
  .mobile-card-slider-next{right:1px}
  .mobile-card-slider-arrow:disabled{
    opacity:.22;
    cursor:default;
  }

  /* Helle Bereiche: Pfeile analog Event-Slider heller */
  #musik .mobile-card-slider-arrow,
  .social-media-section.auto-theme-light .mobile-card-slider-arrow{
    background:rgba(255,255,255,.9);
    color:#171717;
    border-color:rgba(17,17,17,.26);
  }

  /* Programm: alter 1-Spalten-Grid wird mobil zum Slider */
  #musik .mobile-card-slider-programm{
    margin-top:55px;
  }
  #musik .mobile-card-slider-programm .music-grid{
    margin-top:0 !important;
  }
  #musik .mobile-card-slider-programm .music-card{
    height:auto !important;
  }

  /* Band */
  #band .mobile-card-slider-band{
    margin-top:48px;
  }
  #band .mobile-card-slider-band .band-grid{
    margin-top:0 !important;
    background:transparent !important;
  }
  #band .mobile-card-slider-band .band-grid > article{
    background:#1a1516;
  }

  /* Buchungsformate */
  #formate .mobile-card-slider-formats{
    margin-top:55px;
  }
  #formate .mobile-card-slider-formats .formats{
    margin-top:0 !important;
  }

  /* Medien für Veranstalter */
  #kontakt .mobile-card-slider-booking-media .booking-media-grid{
    grid-template-columns:none !important;
  }
  #kontakt .mobile-card-slider-booking-media .booking-media-item{
    min-width:100% !important;
  }
  #kontakt .mobile-card-slider-booking-media .booking-media-preview{
    height:180px;
  }

  /* Neueste Social-Media-Beiträge */
  #social-media .mobile-card-slider-social .social-posts-grid{
    grid-template-columns:none !important;
  }
  #social-media .mobile-card-slider-social .social-card{
    min-width:100% !important;
  }
}


/* =========================================================
   MOBILE KARTEN-SLIDER – TOUCH/OVERLAY FIX
   - keine negativen Außenränder mehr
   - Pfeile liegen innerhalb der Kachel
   - natives horizontales Wischen auf Touch-Geräten
   - Event-Slider mobil ebenfalls swipebar
   ========================================================= */
@media(max-width:600px){
  .mobile-card-slider{
    position:relative;
    width:100%;
    max-width:100%;
    padding:0 !important;
    margin-left:0 !important;
    margin-right:0 !important;
    overflow:visible;
  }

  .mobile-card-slider-viewport{
    width:100%;
    max-width:100%;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    touch-action:pan-x pan-y;
    scrollbar-width:none;
  }
  .mobile-card-slider-viewport::-webkit-scrollbar{display:none}

  .mobile-card-slider .mobile-card-slider-track{
    width:auto !important;
    min-width:100%;
    max-width:none !important;
    flex-wrap:nowrap !important;
    gap:14px !important;
    overflow:visible !important;
  }
  .mobile-card-slider .mobile-card-slider-track > *{
    flex:0 0 100% !important;
    width:100% !important;
    min-width:100% !important;
    max-width:100% !important;
    scroll-snap-align:start;
    scroll-snap-stop:always;
    box-sizing:border-box;
    overflow:hidden;
  }
  .mobile-card-slider img{
    max-width:100%;
    -webkit-user-drag:none;
    user-select:none;
  }

  .mobile-card-slider-arrow{
    top:50% !important;
    width:32px !important;
    height:32px !important;
    z-index:20 !important;
    box-shadow:0 4px 16px rgba(0,0,0,.24) !important;
    transform:translateY(-50%) !important;
  }
  .mobile-card-slider-prev{left:8px !important}
  .mobile-card-slider-next{right:8px !important}

  /* Event-Slider: Smartphone = eine Kachel, Swipe + Pfeile auf der Kachel */
  #musik .event-slider{
    width:100%;
    max-width:100%;
    padding:0 !important;
    overflow:visible;
  }
  #musik .event-slider-viewport{
    width:100%;
    max-width:100%;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    touch-action:pan-x pan-y;
    scrollbar-width:none;
  }
  #musik .event-slider-viewport::-webkit-scrollbar{display:none}
  #musik .event-slider-track{
    width:auto !important;
    min-width:100%;
    flex-wrap:nowrap !important;
  }
  #musik .event-slider-track .event-card{
    flex:0 0 100% !important;
    width:100% !important;
    min-width:100% !important;
    max-width:100% !important;
    scroll-snap-align:start;
    scroll-snap-stop:always;
    box-sizing:border-box;
  }
  #musik .event-slider-arrow{
    top:50% !important;
    width:32px !important;
    height:32px !important;
    z-index:20 !important;
    transform:translateY(-50%) !important;
    box-shadow:0 4px 16px rgba(0,0,0,.22) !important;
  }
  #musik .event-slider-prev{left:8px !important}
  #musik .event-slider-next{right:8px !important}
}


/* =========================================================
   MOBILE – SEITENWEITES HORIZONTALES ÜBERSCROLLEN VERHINDERN
   Interne Slider bleiben horizontal scrollbar.
   ========================================================= */
html, body{
  max-width:100%;
  overflow-x:hidden;
}
@supports (overflow: clip){
  html, body{overflow-x:clip;}
}

/* =========================================================
   EVENT-KACHELN – PROGRAMM-LOOK + 4ER DESKTOP-SLIDER
   ========================================================= */
#musik .event-slider{
  padding:0 !important;
  width:100%;
  max-width:100%;
}
#musik .event-slider-viewport{
  width:100%;
  max-width:100%;
}
#musik .event-grid-quotes.event-slider-track{
  gap:14px !important;
}
#musik .event-slider-track .event-card{
  flex:0 0 calc((100% - 42px) / 4) !important;
  width:calc((100% - 42px) / 4) !important;
  min-width:0 !important;
  max-width:none !important;
  box-sizing:border-box;
  background:#fff !important;
  color:#111 !important;
  padding:28px !important;
  border-top:4px solid var(--gold) !important;
  overflow:hidden;
}
#musik .event-card strong{
  display:block;
  width:100%;
  text-align:center;
  color:#111 !important;
  margin:0;
}
#musik .event-card p,
#musik .event-grid-quotes .event-card p,
#musik .event-grid-quotes .event-card p.is-quoted{
  color:#615d57 !important;
}
/* Alte globale .event-grid div-Regel darf den Foto-Wrapper nicht mit Padding/Rahmen versehen. */
#musik .event-card-photo{
  width:100% !important;
  margin:16px 0 18px !important;
  padding:0 !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  text-transform:none !important;
  font:inherit !important;
  aspect-ratio:4 / 3 !important;
  overflow:hidden !important;
}
#musik .event-card-photo img{
  display:block;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}
#musik .event-slider-prev{left:8px !important}
#musik .event-slider-next{right:8px !important}

@media(max-width:900px){
  #musik .event-slider-track .event-card{
    flex-basis:calc((100% - 14px) / 2) !important;
    width:calc((100% - 14px) / 2) !important;
  }
}
@media(max-width:600px){
  #musik .event-slider-track .event-card{
    flex:0 0 100% !important;
    width:100% !important;
    min-width:100% !important;
    max-width:100% !important;
  }
  #musik .event-slider{
    overflow:hidden !important;
  }
}


/* =========================================================
   EVENT-KACHELN – TYPOGRAFIE WIE PROGRAMM-KACHELN
   Wichtig: nur die direkte Event-Überschrift stylen; <strong>
   innerhalb des Beschreibungstextes bleibt inline und gleich groß.
   ========================================================= */
#musik .event-card > strong{
  display:block;
  width:100%;
  text-align:center;
  font-family:"Barlow Condensed",sans-serif;
  font-size:42px;
  line-height:.92;
  font-weight:700;
  text-transform:uppercase;
  color:#111 !important;
  margin:0;
}
#musik .event-card p strong,
#musik .event-grid-quotes .event-card p strong{
  display:inline !important;
  width:auto !important;
  text-align:inherit !important;
  font-family:inherit !important;
  font-size:inherit !important;
  line-height:inherit !important;
  font-weight:800 !important;
  text-transform:none !important;
  color:inherit !important;
  margin:0 !important;
}
#musik .event-card p em,
#musik .event-grid-quotes .event-card p em{
  display:inline !important;
  font-family:inherit !important;
  font-size:inherit !important;
  line-height:inherit !important;
  font-style:italic !important;
  text-transform:none !important;
  color:inherit !important;
}




/* =========================================================
   GROSSE BEREICHSÜBERSCHRIFTEN – EINHEITLICH & SINNVOLL UMGEBROCHEN
   Desktop: gleiche Schriftgröße, innerhalb der normalen Content-Breite.
   ========================================================= */
@media (min-width: 901px){
  main section h2[data-content$=".headline"]{
    width:100%;
    max-width:100% !important;
    font-size:72px !important;
    line-height:.94;
    white-space:normal !important;
    overflow-wrap:normal;
    word-break:normal;
    text-wrap:balance;
  }
}
@media (max-width: 900px){
  main section h2[data-content$=".headline"]{
    width:100%;
    max-width:100% !important;
    white-space:normal !important;
    text-wrap:balance;
  }
}


/* Social-Media-Hauptüberschrift wie die übrigen Bereichsüberschriften:
   volle normale Content-Breite statt Beschränkung auf die linke Grid-Spalte. */
@media(min-width:901px){
  .social-media-head > div:first-child{
    grid-column:1 / -1;
  }
  .social-media-head > .section-intro{
    grid-column:1 / -1;
    max-width:100%;
  }
}

.seo-region-links{background:#151515;color:#fff;padding:52px 0;border-top:1px solid #2f2f2f}.seo-region-links .section-kicker{color:var(--gold2);margin-bottom:10px}.seo-region-links h2{font-size:clamp(34px,4vw,54px);max-width:920px}.seo-region-link-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:24px}.seo-region-link-grid a{display:flex;align-items:center;justify-content:center;min-height:56px;border:1px solid #4b4335;background:#1d1a15;color:var(--gold2);font-weight:800;padding:12px;text-align:center}@media(max-width:760px){.seo-region-link-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Regionaler SEO-Bereich – bewusst hell und ohne Eintrag in der Hauptnavigation */
.seo-region-links{background:#f4f0e8;color:#27231f;padding:64px 0;border-top:1px solid #ded6c9}
.seo-region-links .section-kicker{color:#9b742e;margin-bottom:10px}
.seo-region-links h2{font-size:clamp(34px,4vw,54px);max-width:960px;color:#27231f;margin-bottom:14px}
.seo-region-intro{max-width:900px;color:#655f57;line-height:1.7;margin:0 0 28px}
.seo-region-link-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.seo-region-link-grid a{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-height:102px;border:1px solid #d7c8ad;background:#fff;color:#2d2822;font-weight:700;padding:18px 20px;text-decoration:none;transition:.18s ease}
.seo-region-link-grid a strong{font-size:17px;color:#8c6728;margin-bottom:6px}
.seo-region-link-grid a span{font-size:12px;line-height:1.45;color:#746e65;font-weight:600}
.seo-region-link-grid a:hover{transform:translateY(-2px);border-color:#b38a43;box-shadow:0 8px 22px rgba(55,42,22,.08)}
@media(max-width:850px){.seo-region-link-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.seo-region-links{padding:46px 0}}
@media(max-width:520px){.seo-region-link-grid{grid-template-columns:1fr}.seo-region-link-grid a{min-height:86px}}

/* Homepage SEO: kontextuelle Regionalverlinkung ohne eigenes Designelement */
.home-region-context{margin-top:14px}
.home-region-context a{text-decoration:underline;text-decoration-color:rgba(197,154,66,.72);text-underline-offset:3px}
.home-region-context a:hover{text-decoration-color:currentColor}

/* SEO heading cleanup 2026-09-13 */
#musik .sound-intro-block .section-intro{font-size:18px;line-height:1.72;max-width:1060px}
@media(max-width:600px){#musik .sound-intro-block .section-intro{font-size:16px;line-height:1.65}}

.date-item .date-seo-link{display:inline-flex;margin-top:8px;font-size:11px;font-weight:800;color:#8b6725;text-decoration:underline;text-underline-offset:3px}.date-item .date-seo-link:hover{color:#5e4518}

/* UX-Fix: Der Hero wird erst eingeblendet, wenn die Slider-Konfiguration geladen ist.
   So kann eine im Admin deaktivierte Logo-Slide beim Seitenaufruf nicht kurz aufblitzen. */
#hero-slider:not(.hero-slider-ready) .hero-slide{opacity:0!important;visibility:hidden!important}
#hero-slider.hero-slider-ready .hero-slide.is-active{opacity:1;visibility:visible}

/* UX-Fix: mobiler Gold-Ticker nahtlos und ohne abgeschnittene Textgruppen */
@media(max-width:1200px){
  .ticker-track{
    display:flex;
    justify-content:flex-start;
    width:max-content;
    min-width:max-content;
    gap:0;
    animation:atc-ticker-seamless 36s linear infinite;
    will-change:transform;
  }
  .ticker-group{
    flex:0 0 auto;
    min-width:max-content;
    padding-right:36px;
    gap:18px;
  }
  .ticker-group span,.ticker-group i{
    flex:0 0 auto;
    white-space:nowrap;
  }
  .ticker-group-clone{display:flex}
  @keyframes atc-ticker-seamless{
    from{transform:translate3d(0,0,0)}
    to{transform:translate3d(-50%,0,0)}
  }
}
@media(max-width:1200px) and (prefers-reduced-motion:reduce){
  .ticker-track{animation:none;transform:none}
  .ticker-group-clone{display:none}
}

/* Trust / Proof integriert in "Die Band" */
.band-proof{margin-top:38px;padding-top:32px;border-top:1px solid rgba(255,255,255,.16)}
.band-proof-head{display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);gap:44px;align-items:end}
.band-proof-head h3{font-size:clamp(38px,4.8vw,58px);line-height:.96;text-transform:uppercase;color:var(--gold2)}
.band-proof-head p{margin:0;color:#d2cbc2;font-size:15px;line-height:1.68;max-width:720px}
.band-proof-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin-top:26px;background:rgba(255,255,255,.14)}
.band-proof-grid article{background:#201a1b;padding:24px 22px;min-height:185px;border-top:3px solid rgba(197,154,66,.9)}
.band-proof-grid strong{display:block;font-family:"Barlow Condensed",sans-serif;font-size:25px;line-height:1.03;text-transform:uppercase;color:#fff}
.band-proof-grid p{margin:12px 0 0;font-size:13px;line-height:1.62;color:#bdb6ad}
@media(max-width:900px){
  .band-proof-head{grid-template-columns:1fr;gap:12px}
  .band-proof-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
  .band-proof{margin-top:30px;padding-top:26px}
  .band-proof-head h3{font-size:38px}
  .band-proof-head p{font-size:14px}
  .band-proof-grid{grid-template-columns:1fr;gap:8px;background:transparent;margin-top:20px}
  .band-proof-grid article{min-height:0;padding:19px 18px}
  .band-proof-grid strong{font-size:23px}
}

/* Einheitliche Markenabbildung im Footer */
.footer-brand-name{font-family:"Barlow Condensed",sans-serif;font-size:24px;line-height:1;text-transform:uppercase;color:#fff}
.footer-brand-claim{font-size:13px;font-weight:700;color:var(--gold2)}
.footer-copyright{font-size:11px;color:#8d8881}