:root{
  --bg:#f5f5f1;
  --surface:#ffffff;
  --ink:#23232b;
  --muted:#6d6d77;
  --line:#e7e7e1;
  --radius:16px;
  --radius-sm:10px;
  --shadow:0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.05);
  --maxw:1040px;
  --brand:#2b2b35;
  --brand-ink:#ffffff;
  --green:#1f9d55; --amber:#d98a17; --gray:#8a8a93;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"Nunito",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:17px; line-height:1.65; font-weight:400;
  min-height:100vh; display:flex; flex-direction:column;
}
h1,h2,h3{line-height:1.2; font-weight:800; margin:0 0 .5em;}
h1{font-size:clamp(1.8rem,4vw,2.6rem);}
h2{font-size:1.35rem;}
p{margin:0 0 1rem;}
a{color:inherit;}
.wrap{width:100%; max-width:var(--maxw); margin:0 auto; padding:0 20px;}
.muted{color:var(--muted); font-size:.95rem;}

/* ---------- Header ---------- */
.site-head{
  width:100%; display:flex; align-items:center; gap:24px; flex-wrap:wrap;
  max-width:var(--maxw); margin:0 auto; padding:16px 20px;
}
.brand{display:inline-flex; align-items:center; text-decoration:none;}
.brand-logo{height:96px; width:auto; display:block;}
.head-banner{height:84px; width:auto; max-width:100%;}

/* ---------- Home hero ---------- */
.hero-home{text-align:center; padding:28px 0 10px;}
.hero-home h1{margin-bottom:.2em;}
.hero-banner{max-width:640px; width:100%; height:auto; margin:0 auto 10px;}
.hero-home p{color:var(--muted); max-width:44ch; margin:0 auto;}

/* ---------- City grid ---------- */
.city-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
  gap:18px; margin:30px 0 10px;
}
.city-card{
  position:relative; display:flex; align-items:stretch; gap:0;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  text-decoration:none; color:var(--ink); overflow:hidden; box-shadow:var(--shadow);
  transition:transform .15s ease, box-shadow .15s ease;
}
.city-card:hover{transform:translateY(-3px); box-shadow:0 6px 14px rgba(0,0,0,.08),0 16px 40px rgba(0,0,0,.08);}
.city-card__bar{width:10px; background:var(--brand); flex:0 0 auto;}
.city-card__body{display:flex; flex-direction:column; gap:4px; padding:18px 16px; flex:1;}
.city-card__name{font-weight:800; font-size:1.25rem; color:var(--brand);}
.city-card__venue{color:var(--muted); font-size:.9rem;}
.city-card__date{font-weight:700; margin-top:6px;}
.city-card__go{display:grid; place-items:center; padding-right:16px; font-size:1.4rem; color:var(--brand);}

/* ---------- Badges ---------- */
.badge{
  display:inline-block; align-self:flex-start; margin-top:8px;
  font-size:.78rem; font-weight:700; padding:3px 10px; border-radius:999px;
  background:#eee; color:#444;
}
.badge.is-open{background:rgba(31,157,85,.14); color:#157a40;}
.badge.is-upcoming{background:rgba(217,138,23,.16); color:#9a6310;}
.badge.is-soldout{background:#ececec; color:#777;}
.badge.is-tba{background:#eef0f4; color:#6a7384;}

/* ---------- Info blocks ---------- */
.info-block{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:26px; margin:26px 0; box-shadow:var(--shadow);
}
.info-block h2{margin-top:0;}
.prose{max-width:72ch;}
.prose h1{margin-bottom:.5em;}
.prose h2{font-size:1.3rem; margin:1.6em 0 .5em;}
.prose h3{font-size:1.06rem; font-weight:700; margin:1.35em 0 .35em;}
.prose p{margin:0 0 1em;}
.prose ul{margin:0 0 1.2em 1.3em; padding:0;}
.prose li{margin:.35em 0;}
.prose a{color:#1f6fb2; text-decoration:underline; word-break:break-word;}

/* ---------- Home: soft background + mascot ---------- */
body.page-home{
  background:
    radial-gradient(1100px 480px at 90% -10%, #ffe7c9 0%, rgba(255,231,201,0) 60%),
    radial-gradient(820px 420px at 2% 0%, #e7eff9 0%, rgba(231,239,249,0) 55%),
    var(--bg);
}
.home-about{display:flex; align-items:center; gap:30px;}
.home-about__text{flex:1;}
.home-about__bear{width:168px; height:auto; flex:0 0 auto; align-self:flex-end;}

/* ---------- City page ---------- */
.crumbs{margin:20px 0 6px;}
.crumbs a{color:var(--muted); text-decoration:none; font-weight:700;}
.crumbs a:hover{color:var(--brand);}

.hero-city{
  background:var(--brand); color:var(--brand-ink);
  border-radius:var(--radius); padding:34px 28px; margin:10px 0 26px; box-shadow:var(--shadow);
}
.hero-city h1{margin:0;}
.hero-city__venue{margin:.3em 0 0; font-weight:700; opacity:.95;}
.hero-city__addr{margin:.1em 0 0; opacity:.8; font-size:.95rem;}
.route-btn{display:inline-flex; align-items:center; gap:7px; margin-top:16px; background:#fff; color:var(--ink);
  font-weight:700; text-decoration:none; padding:9px 16px; border-radius:999px; transition:transform .1s ease, filter .15s ease;}
.route-btn svg{fill:var(--brand);}
.route-btn:hover{filter:brightness(.96);}
.route-btn:active{transform:scale(.97);}

.termine{margin:0 0 26px;}
.notice{
  background:rgba(0,0,0,.04); border-left:6px solid var(--brand); border-radius:var(--radius-sm);
  padding:14px 16px; margin:0 0 16px; font-weight:700;
}
.event{
  display:flex; flex-wrap:wrap; gap:16px; justify-content:space-between; align-items:center;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:18px 20px; margin-bottom:12px; box-shadow:var(--shadow);
}
.event__when{display:flex; flex-direction:column; gap:2px;}
.event__date{font-weight:800; font-size:1.15rem;}
.event__time{color:var(--muted);}
.event__note{color:var(--muted); font-size:.9rem;}
.event__start{color:#9a6310; font-weight:700; font-size:.9rem; margin-top:4px;}
.event__actions{display:flex; flex-direction:column; align-items:flex-end; gap:8px;}
.btns{display:flex; gap:10px; flex-wrap:wrap;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-block; font-weight:800; font-size:.98rem; text-decoration:none;
  padding:11px 20px; border-radius:999px; border:2px solid transparent; cursor:pointer;
  transition:transform .1s ease, filter .15s ease;
}
.btn:active{transform:scale(.97);}
.btn--book{background:var(--brand); color:var(--brand-ink); border-color:var(--brand);}
.btn--book:hover{filter:brightness(1.06);}
.btn--book.is-disabled{background:#e7e7e7; color:#a3a3a3; border-color:#e7e7e7; cursor:not-allowed;}
.btn--track{background:transparent; color:var(--brand); border-color:var(--brand);}
.btn--track:hover{background:var(--brand); color:var(--brand-ink);}
.countdown{display:inline-flex; flex-direction:column; align-items:center; gap:1px; background:var(--brand); color:var(--brand-ink); padding:8px 18px; border-radius:14px; line-height:1.15;}
.countdown__lead{font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; opacity:.92;}
.countdown__clock{font-size:1.15rem; font-weight:800; font-variant-numeric:tabular-nums;}

/* ---------- Two columns ---------- */
.cols{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:0 0 8px;}
.card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:24px; box-shadow:var(--shadow);
}
.card h2{margin-top:0;}
.facts{list-style:none; margin:0 0 12px; padding:0;}
.facts li{padding:7px 0; border-bottom:1px solid var(--line);}
.facts li:last-child{border-bottom:0;}
.facts b{font-weight:800;}

/* ---------- Footer ---------- */
.site-foot{margin-top:auto; background:#1c1c22; color:#b9b9c2;}
.site-foot a{color:#fff; text-decoration:none;}
.site-foot a:hover{text-decoration:underline;}
.foot-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; padding:42px 0 28px;}
.foot-h{font-size:.78rem; text-transform:uppercase; letter-spacing:.13em; color:#80808c; margin:0 0 10px; font-weight:700;}
.foot-col{font-size:.95rem; line-height:1.85;}
.foot-col strong{color:#fff; font-weight:700;}
.foot-bottom{border-top:1px solid rgba(255,255,255,.1);}
.foot-bottom .wrap{font-size:.85rem; color:#82828c; padding-top:15px; padding-bottom:15px;}

/* ---------- Gallery ---------- */
.gallery{margin:0 0 26px;}
.gallery h2{margin-bottom:14px;}
.gallery__grid{display:grid; grid-template-columns:repeat(3,1fr); gap:12px;}
.gallery__grid img{width:100%; height:200px; object-fit:cover; border-radius:var(--radius); border:1px solid var(--line); display:block;}

/* ---------- Booking hint ---------- */
.hinweis{margin-top:14px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:4px 18px;}
.hinweis summary{cursor:pointer; font-weight:700; padding:14px 0; list-style:none;}
.hinweis summary::-webkit-details-marker{display:none;}
.hinweis summary::before{content:"\24D8"; color:var(--brand); margin-right:8px;}
.hinweis[open] summary{border-bottom:1px solid var(--line);}
.hinweis ul{margin:12px 0 16px; padding-left:1.2em;}
.hinweis li{margin:.5em 0;}

/* ---------- More link ---------- */
.more-link{display:inline-block; margin-top:10px; font-weight:700; color:var(--brand); text-decoration:none;}
.more-link:hover{text-decoration:underline;}

/* ---------- Callout (Aussteller/Legal) ---------- */
.callout{border-radius:var(--radius-sm); padding:14px 16px; margin:1.1em 0;}
.callout--warn{background:rgba(217,138,23,.12); border:1px solid rgba(217,138,23,.35); border-left:5px solid #d98a17;}

/* ---------- Facebook CTA ---------- */
.fb-cta{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:22px 26px; margin:26px 0; box-shadow:var(--shadow);}
.fb-cta h2{margin:0 0 4px;}
.fb-cta__text p{margin:0;}
.fb-links{display:flex; gap:10px; flex-wrap:wrap;}
.fb-btn{display:inline-flex; align-items:center; gap:8px; background:#1877f2; color:#fff; text-decoration:none;
  font-weight:700; padding:10px 16px; border-radius:999px; transition:filter .15s;}
.fb-btn:hover{filter:brightness(1.07);}
.ig-btn{background:linear-gradient(45deg,#feda75 0%,#fa7e1e 24%,#d62976 50%,#962fbf 74%,#4f5bd5 100%);}

/* ---------- Site notice bar (manager-controlled) ---------- */
.notice-bar{display:flex; gap:14px; align-items:flex-start; border:1px solid; border-radius:var(--radius);
  padding:16px 20px; margin:22px 0 6px; box-shadow:var(--shadow);}
.notice-bar__icon{font-size:1.35rem; line-height:1.5; flex:0 0 auto;}
.notice-bar__body{flex:1;}
.notice-bar__body strong{display:block; font-weight:800; margin-bottom:2px;}
.notice-bar--warning{background:#fff5e6; border-color:#f0c989; color:#6b4708;}
.notice-bar--info{background:#eaf2fb; border-color:#aecbee; color:#1b4a7a;}
.notice-bar--success{background:#e9f6ee; border-color:#a4d8ba; color:#1c6b3e;}

/* ---------- Mobile ---------- */
@media (max-width:680px){
  body{font-size:16px;}
  .cols{grid-template-columns:1fr;}
  .event{flex-direction:column; align-items:flex-start;}
  .event__actions{align-items:flex-start; width:100%;}
  .site-head{justify-content:center; text-align:center; gap:14px; padding:14px 16px;}
  .brand-logo{height:64px;}
  .head-banner{height:auto; max-width:100%;}
  .foot-grid{grid-template-columns:1fr; gap:22px; text-align:center;}
  .home-about{flex-direction:column-reverse; text-align:center; gap:16px;}
  .home-about__bear{width:140px; align-self:center;}
  .gallery__grid{grid-template-columns:1fr 1fr; gap:8px;}
  .gallery__grid img{height:140px;}
  .fb-cta{flex-direction:column; align-items:flex-start;}
}
