/* ----------------------------------
   Local Poppins (GDPR-safe)
   Stored under /fonts/poppins/
   ---------------------------------- */

@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/poppins/poppins-v24-latin-300.woff2') format('woff2');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/poppins/poppins-v24-latin-regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/poppins/poppins-v24-latin-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/poppins/poppins-v24-latin-600italic.woff2') format('woff2');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/poppins/poppins-v24-latin-700.woff2') format('woff2');
}
@font-face {
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/poppins/poppins-v24-latin-700italic.woff2') format('woff2');
}

/* Global Reset / Base */
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; overflow-x:hidden; }
body {
background:#141414;
line-height:1.6;
color:#DECEB4;
font-size:16px;
overflow-x:hidden;
font-size:16px;
font-family:'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}
button, input, select, textarea { font:inherit; color:inherit; }
:root { --accent:#DECEB4; }
a { color:inherit; text-decoration:none; }
.container { max-width:980px; margin:0 auto; padding:0 20px; }

/* ----------------------------------
   Header / Nav / Phone
   ---------------------------------- */

.site-header {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  z-index:2000;
  background:transparent;
  pointer-events:none;
}

/* einzelne Kinder wieder klickbar machen */
.site-header .nav,
.site-header .header__burger,
.site-header .social-menu,
.site-header .logo {
  pointer-events:auto;
}

.header-container {
  padding:2% 11%;
  display:flex;
}
@media (max-width:991.98px){
  .header-container { justify-content:center; }
}

/* Feste Navigation oben rechts */
.nav {
  display:flex;
  align-items:center;
  gap:24px;
  height:fit-content;
  position:fixed;
  right:6%;
  top:20px;
  z-index:2000;
  pointer-events:auto;
}
@media (max-width:1399.98px){
  .nav { gap:22px; }
}
@media (max-width:991.98px){
.nav { display:none; }
.nav.is-open{
display:flex;
position:fixed;
inset:0;
z-index:4500;
background:rgba(0,0,0,0.92);
flex-direction:column;
align-items:center;
justify-content:flex-start;
gap:18px;
padding:90px 22px 40px;
pointer-events:auto;
}
.header__burger.is-open{
z-index:5001;
}
}

.header__burger{
display:none;
position:fixed;
right:6%;
top:20px;
width:44px;
height:44px;
border:0;
background:transparent;
padding:0;
cursor:pointer;
z-index:2100;
color:var(--accent);
}
.header__burger::before{
content:"";
position:absolute;
left:10px;
right:10px;
top:14px;
height:2px;
background:currentColor;
box-shadow:0 7px 0 currentColor, 0 14px 0 currentColor;
transition:.25s;
}
.header__burger::after{
content:"";
position:absolute;
left:10px;
right:10px;
top:22px;
height:2px;
background:currentColor;
opacity:0;
transform:rotate(0deg);
transition:.25s;
}
.header__burger.is-open::before{
top:22px;
box-shadow:none;
transform:rotate(45deg);
}
.header__burger.is-open::after{
opacity:1;
transform:rotate(-45deg);
}
@media (max-width:991.98px){
.header__burger{ display:block; }
}

.nav .active { color:#fff; }
.nav a { text-shadow:0 0 5px #000; }

/* Telefonnummer-Block in der Nav (links vom ersten Menüpunkt) */
.header-phone {
  display:flex;
  align-items:center;
  font-size:.9rem;
  line-height:1.2;
  font-weight:600;
  color:#DECEB4;
  white-space:nowrap;
  pointer-events:auto;
  margin-right:36px; /* Abstand zur HOME-Navigation */
}
.header-phone a {
  color:inherit;
  text-decoration:none;
}
@media (max-width:768px){
  .header-phone {
    font-size:.8rem;
    margin-right:16px;
  }
}

/* ----------------------------------
   Headings
   ---------------------------------- */

h2 {
  font-size:80px;
  line-height:1.05em;
  margin-bottom:40px;
}
@media (max-width:768px){
  h2 { font-size:55px; }
}
@media (max-width:390px){
  h2 { font-size:40px; }
}

/* ----------------------------------
   Hero / Start
   ---------------------------------- */

.start-wr { background-color:#141414; }

.hero-slider {
  position:relative;
  width:100%;
  height:clamp(560px,100lvh,1400px);
  overflow:hidden;
  z-index:1;
}
.hero-slide {
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity .9s ease;
  pointer-events:none;
}
.hero-slide.is-active { opacity:1; }
.hero-slide img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:brightness(.92);
}

.hero-controls {
  position:absolute;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:16px;
  z-index:1200;
  pointer-events:none;
}
.hero-controls>* { pointer-events:auto; }

.hero-arrow {
  position:static;
  width:46px;
  height:46px;
  background:transparent;
  border:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-arrow::before {
  content:'';
  width:14px;
  height:14px;
  border-top:2px solid #DECEB4;
  border-right:2px solid #DECEB4;
  opacity:.9;
}
.hero-arrow:hover::before { opacity:1; }
.hero-prev::before { transform:rotate(-135deg); }
.hero-next::before { transform:rotate(45deg); }

.hero-arrow:focus-visible {
  outline:2px solid rgba(222,206,180,.6);
  outline-offset:3px;
}

.hero-dots {
  position:static;
  display:flex;
  gap:10px;
}
.hero-dots button {
  width:10px;
  height:10px;
  border-radius:50%;
  background:transparent;
  border:1px solid #DECEB4;
  opacity:.85;
  cursor:pointer;
}
.hero-dots button.is-active {
  background:#DECEB4;
  opacity:1;
}

/* ----------------------------------
   Social sidebar
   ---------------------------------- */

.social-menu {
  position:fixed;
  top:58%;
  right:40px;
  transform:translateY(-50%);
  display:flex;
  flex-direction:column;
  gap:8px;
  z-index:1500;
  justify-content:center;
  align-items:center;
  color:#fff;
}
.social-menu a {
  color:#fff;
  font-size:20px;
  line-height:0;
  transition:transform .2s;
}
.social-menu a:hover {
  transform:scale(1.1);
  color:#DECEB4;
}

@media (max-width:768px){
  .social-menu {
    top:unset;
    bottom:10px;
    right:50%;
    transform:translateX(50%);
    flex-direction:row;
    background:rgba(0,0,0,.6);
    padding:10px 15px;
    border-radius:25px;
  }
  .social-menu a { font-size:20px; }
}

.social-menu.is-disabled {
  display:none !important;
}

/* Icons cleanup / inline SVG handling */
.social-menu a::before,
.social-menu a::after,
.artist-links .artist-link::before,
.artist-links .artist-link::after {
  content:none !important;
  display:none !important;
  background:none !important;
  -webkit-mask:none !important;
  mask:none !important;
}

i[class^="fa"], i[class*=" fa-"],
span[class^="fa"], span[class*=" fa-"] {
  display:none !important;
}

.artist-link > .icon,
.social-menu a > .icon {
  display:inline-flex !important;
}

.icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:1em;
  height:1em;
  line-height:0;
  vertical-align:middle;
  flex:0 0 auto;
}
.icon svg {
  width:100%;
  height:100%;
  display:block;
  overflow:visible;
  shape-rendering:geometricPrecision;
  text-rendering:geometricPrecision;
}
.icon svg,
.icon svg * {
  fill:currentColor;
  stroke:none;
  vector-effect:none;
}

/* Kontxtgrößen Sidebar-Icons */
.social-menu a .icon { font-size:1.6em; }

/* Hoverfarbe für Sidebar */
.social-menu a { color:#DECEB4; }
.social-menu a:hover { color:#fff; }

/* ----------------------------------
   Text Section ("Über uns" etc.)
   ---------------------------------- */

.text-section {
  position:relative;
  width:100%;
  background:#141414;
  z-index:2;
  padding:120px 0;
}
@media (max-width:767.98px){
  .text-section { padding:70px 0; }
}

/* ----------------------------------
   Splash video section (Header video)
   ---------------------------------- */

.splash-video-section {
  position:relative;
  display:flex;
  height:790px;
  overflow:hidden;
  background:#fff;
  z-index:0;
}
@media (max-width:1399.98px){
  .splash-video-section {
    height:calc(790px - (1399px - 100vw)/((1399 - 320)/(790 - 190)));
  }
}
.splash-video-section:after {
  content:'';
  background-image:url("../img/video-effect.png");
  background-repeat:repeat;
  background-position:center;
  width:100%;
  position:absolute;
  height:100%;
  left:0;
  background-color:#0a0a0ab8;
  pointer-events:none;
  z-index:0;
}
section.splash-video-section video {
width:100%;
position:relative;
left:-8%;
}
@media (max-width:768px){
section.splash-video-section video {
left:0;
}
}
.video-120 {
width:120%;
position:absolute;
align-self:center;
}
@media (max-width:768px){
.video-120 {
width:100%;
position:relative;
}
}
video {
  max-width:100%;
  cursor:pointer;
}
video::-webkit-media-controls {
opacity:1 !important;
visibility:visible !important;
pointer-events:auto !important;
}

video::-webkit-media-controls-panel {
display:flex !important;
opacity:1 !important;
}

/* Hide native big play overlay (Chrome/Edge + Firefox) */
video::-webkit-media-controls-overlay-play-button {
display:none !important;
}
video::-webkit-media-controls-start-playback-button {
display:none !important;
}
video::-moz-media-controls-overlay-play-button {
display:none !important;
}
/* ----------------------------------
Intro Trailer Video (City Appartement)
---------------------------------- */

.release-video-wrap {
position:relative;
max-width:100%;
margin:30px 0 10px 0;
border:1px solid #3a342c;
background:#000;
overflow:hidden;
z-index:0;
}

.release-video {
display:block;
width:100%;
height:auto;
position:relative;
z-index:2;
}

.release-video.is-paused {
filter:brightness(.75);
}

.release-video.is-paused + .video-play-overlay {
opacity:1 !important;
}

/* Overlay-Playbutton – wie Audio-Play, nur größer */
.video-play-overlay {
position:absolute;
inset:0;
display:flex;
align-items:center;
justify-content:center;
background:transparent;
border:0;
padding:0;
cursor:pointer;
color:#fff !important;
line-height:0;
pointer-events:auto;
z-index:9999;
opacity:1;
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
}
.video-play-overlay:focus-visible {
outline:2px solid rgba(222,206,180,.6);
outline-offset:4px;
}

.video-play-overlay::after {
content:"";
position:absolute;
left:50%;
top:50%;
width:88px;
height:88px;
transform:translate(-50%,-50%);
border-radius:50%;
background:rgba(0,0,0,.55) !important;
border:none !important;
box-shadow:
0 12px 30px rgba(0,0,0,.55),
inset 0 0 0 2px rgba(255,255,255,.22) !important;
opacity:1 !important;
}

.video-play-overlay::before {
content:"";
position:absolute;
left:50%;
top:50%;
width:0;
height:0;
transform:translate(-35%,-50%);
border-style:solid;
border-width:16px 0 16px 24px;
border-color:transparent transparent transparent #fff !important;
filter:drop-shadow(0 2px 10px rgba(0,0,0,.65)) !important;
opacity:1 !important;
}

/* ----------------------------------
   Audio Section + Player
   ---------------------------------- */

.audio-section {
  padding:80px 0;
  background:#1A1A1A;
  max-width:100%;
}
.audio-container {
  display:flex;
  flex-direction:column;
  gap:18px;
}
.audio-player {
  position:relative;
  display:flex;
  align-items:center;
  border:1px solid #e1cbb0;
  padding:16px 18px;
  margin-bottom:0;
  background:#1a1a1a;
  flex-wrap:wrap;
  opacity:0;
  transform:translateY(20px);
  transition:opacity 0.7s ease, transform 0.7s ease;
  max-width:100%;
  width:100%;
  box-sizing:border-box;
}
.audio-player._active {
  opacity:1;
  transform:translateY(0);
}
.audio-player img {
  width:70px;
  height:70px;
  object-fit:cover;
  margin-right:16px;
}
.audio-info {
  flex:1;
  min-width:240px;
}
.audio-title {
  font-weight:500;
  color:#f3e1c8;
  margin-bottom:6px;
  font-size:12px;
  line-height:1.2;
  overflow-wrap:anywhere;
}
.audio-artist {
  display:none !important;
}
.audio-controls {
  width:100%;
  margin-top:8px;
  display:flex;
  align-items:center;
  gap:10px;
  padding-right:0;
}
.audio-controls button {
  background:none;
  border:none;
  cursor:pointer;
  color:#fff;
  font-size:28px;
  line-height:0;
  margin-right:8px;
}
.audio-controls button .icon {
  position:relative;
  display:inline-block;
  width:20px;
  height:20px;
}
.audio-controls button.play .icon::before {
  content:"";
  position:absolute;
  left:6px;
  top:4px;
  width:0;
  height:0;
  border-style:solid;
  border-width:6px 0 6px 10px;
  border-color:transparent transparent transparent currentColor;
}
.audio-controls button.pause .icon::before,
.audio-controls button.pause .icon::after {
  content:""!important;
  position:absolute;
  top:3px;
  width:4px;
  height:14px;
  background:currentColor;
}
.audio-controls button.pause .icon::before { left:5px; }
.audio-controls button.pause .icon::after { right:5px; }

.progress-bar {
  flex:1;
  height:4px;
  background:#444;
  border-radius:2px;
  cursor:pointer;
}
.progress {
  position:relative;
  width:0;
  height:100%;
}
.progress::after {
  display:block;
  position:absolute;
  width:12px;
  height:12px;
  content:'';
  background:var(--accent);
  border-radius:50%;
  left:100%;
  top:50%;
  transform:translate(-50%, -50%) scale(0.85);
  transition:transform 0.2s;
}
.progress-bar:hover .progress::after,
.dragging .progress::after {
  transform:translateY(-50%) scale(1);
}

.audio-controls .timecode {
  min-width:86px;
  text-align:right;
  font-size:12px;
  color:#cdbf9e;
  opacity:.95;
}

.audio-player--in-card {
  padding:16px 18px;
  background:#121212;
  border:1px solid #3a342c;
}
.audio-player--in-card img {
  width:60px;
  height:60px;
  margin-right:14px;
}
.audio-player--in-card .audio-title {
  font-weight:500;
  color:#f3e1c8;
}
.audio-player--in-card .audio-artist {
  color:#9f8e7d;
}

/* ----------------------------------
   Artists Section
   ---------------------------------- */

.artists-section {
  padding:60px 0;
  background:#141414;
}
.artist-list {
  display:flex;
  flex-direction:column;
  gap:32px;
}
.artist-card {
  display:grid;
  grid-template-columns:180px 1fr;
  align-items:start;
  border:1px solid #e1cbb0;
  background:#1a1a1a;
  padding:5px 5px 0 5px;
  gap:24px;
  width:100%;
  max-width:100%;
  opacity:0;
  transform:translateY(22px);
  transition:opacity .7s ease, transform .7s ease;
  overflow:hidden;
}
.artist-card._active {
  opacity:1;
  transform:translateY(0);
}
.artist-image {
  width:180px;
  height:180px;
  object-fit:cover;
  margin:0;
  grid-column:1;
  grid-row:auto;
  align-self:start;
}
.artist-info {
  min-width:260px;
  grid-column:2;
  padding-top:5px;
}
.artist-title {
  font-weight:bold;
  color:#f3e1c8;
  margin-bottom:10px;
  font-size:26px;
}
.artist-card .artist-info .audio-player {
  max-width:100%;
  box-sizing:border-box;
  margin:0;
}
.artist-card .artist-info .audio-player + .audio-player {
  margin-top:6px;
}

/* ICON BAR */
.artist-card .artist-links,
.artist-links {
  grid-column:1 / -1;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:18px !important;
  width:100% !important;
  margin-top:0 !important;
  padding:12px 5px 12px !important;
  position:relative !important;
  border-top:1px solid #3a342c !important;
  background:#1a1a1a !important;
}
.artist-link,
.artist-links span.artist-link {
  width:40px;
  height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:0;
  color:#DECEB4;
  opacity:.9;
  transition:transform .2s, opacity .2s, color .3s ease;
  font-size:26px; /* 1em ≈ 26px */
  overflow:visible;
}
.artist-link:hover {
  opacity:1;
  transform:translateY(-1px) scale(1.05);
  color:#ffffff;
}

/* ----------------------------------
   Logo
   ---------------------------------- */

.logo img {
  display:block;
  height:auto;
  width:clamp(180px,22vw,460px);
}
@media (min-width:1400px){
  .logo img { width:500px; }
}
@media (max-width:900px){
  .logo img { width:clamp(130px,28vw,260px); }
}

/* ----------------------------------
   Waves video section (background loop)
   ---------------------------------- */

.splash-video-section-auto {
  width:100%;
  height:420px;
  overflow:hidden;
}
.splash-video-section-auto video {
  width:100%;
  position:fixed;
  bottom:0;
  z-index:-1;
  pointer-events:none;
}

/* ----------------------------------
   Fanstore / Gallery Intro Text
   ---------------------------------- */

.fanstore-section {
  padding:80px 0;
  background:#141414;
}

/* ----------------------------------
   Kontakt / Formular
   ---------------------------------- */

.contact-section {
  padding:100px 0;
  background:url(../img/last.jpg) #000000ad;
  background-blend-mode:color-burn;
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center;
}
.contact-container {
  max-width:800px;
  margin:0 auto;
}
.contact-title {
  margin-bottom:30px;
  text-align:center;
  font-weight:600;
}
.contact-subtitle {
  line-height:1.5em;
  text-align:center;
  font-size:25px;
  font-weight:600;
  margin-bottom:50px;
}
.contact-form {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  margin-top:50px;
  max-width:600px;
  margin:auto;
}
.form-group {
  margin-bottom:20px;
  opacity:0;
  transform:translateY(16px);
  transition:opacity .6s ease, transform .6s ease;
}
.form-group._active {
  opacity:1;
  transform:translateY(0);
}
.form-group.full-width {
  grid-column:1/3;
}
.form-group label {
  display:block;
  margin-bottom:5px;
  font-weight:bold;
}
.form-group input,
.form-group textarea {
  width:100%;
  padding:12px;
  background:transparent;
  border:1px solid #e1cbb0;
  font-size:1rem;
  color:#e1cbb0;
}
.form-group textarea {
  height:150px;
  resize:vertical;
}
.submit-button {
  grid-column:1/3;
  background:transparent;
  border:none;
  color:var(--accent);
  font-weight:700;
  letter-spacing:.15em;
  text-transform:uppercase;
  line-height:1;
  padding:0;
  height:auto;
  cursor:pointer;
  display:inline-block;
  margin:18px auto 0;
  -webkit-appearance:none;
  appearance:none;
}
.submit-button:hover {
  opacity:.9;
  text-decoration:underline;
}
.submit-button:focus-visible {
  outline:2px solid rgba(222,206,180,.45);
  outline-offset:4px;
  border-radius:2px;
}

/* Form focus/hover visuals */
.form-group input:hover,
.form-group textarea:hover,
.form-group input:active,
.form-group textarea:active,
.form-group input:focus-visible,
.form-group textarea:focus-visible {
  background:#141414;
  transition:.2s;
}
.form-group input:focus-visible,
.form-group textarea:focus-visible {
  border:1px solid #a359e8;
  outline:none;
}

/* Form-Security Helpers */
.contact-form [name="honeypot"]{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
#turnstile-slot{display:none;margin:12px auto 0;text-align:center}
#turnstile-slot[data-enabled="1"]{display:block}
.submit-button[disabled]{opacity:.5;cursor:not-allowed;text-decoration:none}
.field-error{color:#ff8a8a}

/* ----------------------------------
FAQ
---------------------------------- */

#faq {
  background-color:#1A1A1A;
  padding-top:80px;
  padding-bottom:80px;
  position:relative;
  z-index:2;
  scroll-margin-top:90px;
}
#faq h2 {
  margin-top:0;
}

.faq-section {
  margin-top:60px;
  font-family:"Poppins", sans-serif;
  color:#DECEB4;
}
.faq-item {
  border-bottom:1px solid rgba(255,255,255,0.1);
  padding:14px 0;
}
.faq-question {
  display:block;
  width:100%;
  text-align:left;
  background:none;
  border:none;
  outline:none;
  cursor:pointer;
  color:#DECEB4;
  font-weight:700;
  font-size:1em;
  padding:0;
  transition:color 0.25s ease;
}
.faq-question:hover {
  color:#cdbf9e;
}
.faq-answer {
  font-weight:400;
  font-size:0.95em;
  color:#DECEB4;
  line-height:1.5;
  margin-top:8px;
}
.faq-answer ul {
list-style-type: disc !important;
list-style-position: outside;
margin: 8px 0 0 1.6em;
padding-left: 0;
}

.faq-answer ul li {
margin: 4px 0;
line-height: 1.55;
}

/* ----------------------------------
BOOKING
---------------------------------- */

#buchung {
background-color:#1A1A1A;
padding-top:110px;
padding-bottom:110px;
position:relative;
z-index:2;
scroll-margin-top:90px;
}

@media (max-width:767.98px){
#buchung {
padding-top:80px;
padding-bottom:80px;
}
}

#buchung h2 {
margin-top:0;
}

#buchung .booking-cta {
text-align:center;
margin-top:70px !important;
}

/* ----------------------------------
Anfahrt / Map
---------------------------------- */

.location-section address { margin-bottom:14px; }

.map-poster {
  position:relative;
  display:inline-block;
  border:none;
  background:none;
  padding:0;
  cursor:pointer;
}
.map-poster img {
  display:block;
  width:100%;
  max-width:880px;
  height:auto;
  border-radius:8px;
}
.map-poster span {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  padding:8px 14px;
  border-radius:999px;
  background:rgba(0,0,0,.55);
  color:#DECEB4;
  font-weight:600;
  font-size:.95em;
  letter-spacing:.02em;
}
#map-embed {
  max-width:880px;
  border-radius:8px;
  overflow:hidden;
}

/* ----------------------------------
   Galerie (Einblick)
   ---------------------------------- */

/* Grid der Thumbnails */
.gallery-wrapper {
  display:grid;
  grid-template-columns:repeat(7, 1fr); /* Desktop: 7 Spalten */
  gap:12px;
  max-width:100%;
  box-sizing:border-box;
  justify-items:center;
  margin:0 auto;
}
@media (max-width:1024px){
  .gallery-wrapper {
    grid-template-columns:repeat(5, 1fr);
  }
}
@media (max-width:768px){
  .gallery-wrapper {
    grid-template-columns:repeat(3, 1fr);
  }
}
@media (max-width:480px){
  .gallery-wrapper {
    grid-template-columns:repeat(2, 1fr);
  }
}
.gallery-wrapper a {
  display:block;
  width:100%;
  height:100%;
}
.gallery-wrapper img {
  width:100%;
  height:auto;
  max-width:150px;
  max-height:180px;
  object-fit:cover;
  border-radius:8px;
  transition:transform 0.3s ease, box-shadow 0.3s ease;
}
.gallery-wrapper a:hover img {
  transform:scale(1.06);
  box-shadow:0 8px 16px rgba(0,0,0,0.3);
}

/* ----------------------------------
   Custom Lightbox Overlay
   ---------------------------------- */

.lightbox-overlay {
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  background-color:rgba(0, 0, 0, 0.86);
  opacity:0;
  visibility:hidden;
  display:flex;
  justify-content:center;
  align-items:center;
  z-index:5000;
  transition:opacity 0.28s ease, visibility 0s .28s;
}
.lightbox-overlay.active {
  opacity:1;
  visibility:visible;
  transition:opacity .3s ease;
}

.lightbox-container {
position:relative;
display:inline-flex;
justify-content:center;
align-items:center;
width:auto;
max-width:90vw;
max-height:90vh;
}
.lightbox-content {
display:flex;
justify-content:center;
align-items:center;
}
.lightbox-content img {
display:block;
max-width:90vw;
max-height:90vh;
margin:0 auto;
user-select:none;
}

/* Pfeile */
.lightbox-prev,
.lightbox-next,
.lightbox-close {
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:6000;
  background:transparent;
  box-shadow:none;
  color:var(--accent) !important;
  border:none;
  font-size:46px;
  width:58px;
  height:58px;
  line-height:58px;
  text-align:center;
  cursor:pointer;
  user-select:none;
  pointer-events:auto;
  transition:transform 0.25s ease, color 0.25s ease;
}
.lightbox-prev { left:-24px; }
.lightbox-next { right:-24px; }

.lightbox-prev:hover,
.lightbox-next:hover,
.lightbox-prev:focus-visible,
.lightbox-next:focus-visible {
  background:transparent;
  color:var(--accent);
  outline:none;
  filter:none;
  opacity:1;
  transform:translateY(-50%) scale(1.1);
}
@media (max-width:600px){
.lightbox-prev { left:10px; }
.lightbox-next { right:10px; }
}

/* Close Button */
.lightbox-close {
  position:absolute;
  top:-36px;
  right:-36px;
  width:40px;
  height:40px;
  line-height:40px;
  text-align:center;
  background:transparent;
  box-shadow:none;
  border:none;
  border-radius:0;
  color:var(--accent) !important;
  font-size:30px;
  cursor:pointer;
  user-select:none;
  z-index:3;
  transition:color 0.25s ease;
}
.lightbox-close::before,
.lightbox-close::after,
.lightbox-close svg,
.lightbox-close svg *,
.lightbox-close svg path,
.lightbox-close svg line {
color:var(--accent) !important;
fill:var(--accent) !important;
stroke:var(--accent) !important;
}
.lightbox-close:hover,
.lightbox-close:focus-visible {
  color:var(--accent);
  outline:none;
}
@media (max-width:600px){
  .lightbox-close {
    top:-16px;
    right:-16px;
    width:36px;
    height:36px;
    line-height:36px;
  }
}

/* ----------------------------------
BOOKING BUTTON
---------------------------------- */

.button {
display:inline-block;
padding:9px 22px;
border:1px solid #DECEB4;
color:#DECEB4;
font-weight:600;
letter-spacing:0.05em;
text-transform:uppercase;
background:transparent;
font-size:0.85rem;
transition:background-color 0.25s ease, color 0.25s ease, transform 0.2s ease;
}

.button:hover {
background:#DECEB4;
color:#141414;
transform:translateY(-1px);
}

.button:focus-visible {
outline:2px solid rgba(222,206,180,.6);
outline-offset:4px;
}

/* ----------------------------------
Footer
---------------------------------- */

footer {
  padding:30px 0;
  text-align:center;
  background:#141414;
  border-top:1px solid #222;
}
.footer-text {
  font-size:.8rem;
}
.footer-links {
  display:flex;
  gap:40px;
  font-size:.7em;
  justify-content:center;
  margin:20px auto;
  opacity:0;
  transform:translateY(12px);
  transition:opacity .7s ease, transform .7s ease;
}
.footer-links._active {
  opacity:1;
  transform:translateY(0);
}

/* ----------------------------------
   Scroll-in Animations
   ---------------------------------- */

._anim-items {
  opacity:0;
  transform:translateY(18px);
  transition:opacity .7s ease, transform .7s ease;
}
._anim-items._active {
  opacity:1;
  transform:translateY(0);
}

/* ----------------------------------
   Mobile tweaks / Layout fixes
   ---------------------------------- */

@media (max-width:768px){
  img { max-width:100%; }

  .audio-section { padding:40px 0; }

  .artist-image {
    width:150px;
    height:150px;
  }

  .audio-title { font-size:10px; }
  .ov-badge { font-size:10px; }
  .audio-controls .timecode { font-size:10px; }

  /* Artist cards auf volle Breite untereinander */
  .artist-card {
    display:block !important;
    width:100% !important;
    overflow:hidden;
    padding:0 !important;
  }
  .artist-card .artist-info {
    width:100% !important;
    padding:10px 0;
    overflow:hidden;
  }
  .artist-card .artist-info .audio-player {
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box;
    margin:0 !important;
    overflow:hidden;
  }
  .artist-image {
    width:100% !important;
    height:auto !important;
    max-width:100% !important;
  }
}