/* Tanzbar – Joomla 5/6 Site Template */

@font-face{font-family:"Open Sans";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/open-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Open Sans";font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/open-sans-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:"Open Sans";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/open-sans-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Open Sans";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/open-sans-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Kaushan Script";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/kaushan-script-latin-400-normal.woff2) format("woff2")}

:root{
  --tb-accent:#e0207a;
  --tb-pill-1:#a0245f;
  --tb-pill-2:#74183f;
  --tb-red:#ff0000;
  --tb-font:"Open Sans","Droid Sans","Segoe UI",Helvetica,Arial,sans-serif;
  --tb-script:"Kaushan Script","Brush Script MT","Segoe Script",cursive;
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body.site{
  margin:0;
  min-height:100vh;
  padding:2px 10px 190px;
  background:#000 url(../images/bg-top.svg) center top no-repeat;
  color:#fff;
  font:600 13px/20px var(--tb-font);
}
/* Spiegelung der Farbstreifen am Seitenende */
body.site::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:170px;z-index:-1;
  background:url(../images/bg-bottom.svg) center bottom no-repeat;pointer-events:none;
}
body.site{position:relative}

.tb-page{max-width:700px;margin:0 auto}

a{color:var(--tb-accent);text-decoration:none}
a:hover,a:focus{color:#fff;text-decoration:underline}

img{max-width:100%;height:auto}

/* ---------- Header / Logo ---------- */
.tb-header{
  position:relative;
  container-type:inline-size;
  aspect-ratio:700/150;
  background:#242122;
  border-radius:12px;
  overflow:hidden;
}
.tb-brand{display:block;position:absolute;inset:0;color:#fff;text-decoration:none}
.tb-brand:hover,.tb-brand:focus{text-decoration:none;color:#fff}
.tb-logo-img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:contain}
.tb-logo-ellipse{
  position:absolute;left:4%;top:14%;width:92%;height:55%;
  border:.35cqw solid #fff;border-radius:50%;
}
.tb-logo-text{
  position:absolute;left:0;right:0;top:-1%;text-align:center;
  font:400 14.5cqw/1 var(--tb-script);color:#fff;letter-spacing:-.2cqw;
  text-shadow:0 .3cqw .6cqw rgba(0,0,0,.6);transform:rotate(-2deg);
}
.tb-subtitle{
  position:absolute;left:0;right:0;top:69%;text-align:center;
  font:400 3.9cqw/1 var(--tb-font);color:#e8e8e8;letter-spacing:.02em;padding-left:1%;
}
.tb-tagline{
  position:absolute;right:1.4%;bottom:2%;text-align:right;color:#d8d8d8;line-height:1.1;
  font-family:var(--tb-font);pointer-events:none;
}
.tb-tagline-main{display:block;font-weight:700;font-size:2.2cqw;text-transform:uppercase;letter-spacing:-.01em}
.tb-tagline-sub{display:block;font-weight:400;font-size:1.4cqw;text-transform:uppercase}

/* ---------- Navigation ---------- */
.tb-nav{
  margin-top:10px;padding:4px 29px;
  background:linear-gradient(#2d2b2c,#212021);
  border-radius:12px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 2px 0 rgba(0,0,0,.5);
}
.tb-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center}
.tb-nav li{position:relative;margin:0;padding:0}
.tb-nav li + li::before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:1px;background:#6b6869}
.tb-nav a,.tb-nav .mod-menu__heading,.tb-nav span.nav-header{
  display:block;padding:6px 14px;margin:2px 0;border-radius:8px;
  color:#d2d0d1;font-weight:400;font-size:13px;line-height:20px;text-transform:uppercase;letter-spacing:.01em;
}
.tb-nav a:hover,.tb-nav a:focus{color:#fff;text-decoration:none;background:rgba(255,255,255,.07)}
.tb-nav li.current > a,.tb-nav li.active > a{
  color:#ffd9ec;background:linear-gradient(var(--tb-pill-1),var(--tb-pill-2));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
}
.tb-nav li.current + li::before,.tb-nav li.active + li::before,
.tb-nav li.current::before,.tb-nav li.active::before{background:transparent}
/* Untermenüs */
.tb-nav ul ul{display:none;position:absolute;left:0;top:100%;z-index:50;min-width:180px;flex-direction:column;align-items:stretch;
  background:#262425;border-radius:8px;padding:4px;box-shadow:0 6px 16px rgba(0,0,0,.6)}
.tb-nav li:hover > ul,.tb-nav li:focus-within > ul{display:flex}
.tb-nav ul ul li::before{display:none}

/* ---------- Inhaltsbox ---------- */
.tb-box{
  margin-top:10px;padding:10px 10px 10px;
  background:linear-gradient(to bottom,rgba(8,8,22,.38) 0,rgba(12,12,16,.78) 380px,#171717 760px);
  border-radius:12px;
}
.tb-main{padding:44px 27px 30px;text-align:center;min-height:300px}
.tb-banner,.tb-breadcrumbs,.tb-main-top,.tb-main-bottom{padding:10px 27px}
.tb-breadcrumbs{font-size:12px;font-weight:400;color:#bbb;text-align:center}

.tb-main h1,.tb-main h2,.tb-main h3{
  font-weight:600;text-transform:uppercase;text-align:center;margin:0 0 14px;color:#fff;
}
.tb-main h1,.tb-main h1.page-header{font-size:24px;line-height:32px;border:0;padding:0}
.tb-main h2{font-size:20px;line-height:28px}
.tb-main h3{font-size:16px;line-height:24px}
.tb-main p{margin:0 0 20px}
.page-header{border:0;margin:0 0 14px}
.tb-main ul,.tb-main ol{display:inline-block;text-align:left}

/* Hervorgehobene Termin-Blöcke (Klassen im Artikel verwenden) */
.tb-event,.tb-event-sub{
  background:var(--tb-red);color:#fff;text-align:center;text-transform:uppercase;margin:0;padding:0 8px;
}
.tb-event{font-size:26px;line-height:40px;font-weight:400;margin-top:30px}
.tb-event p,.tb-event-sub p{margin:0}
.tb-event-sub{font-size:19px;line-height:28px;font-style:italic;font-weight:400;margin-top:10px;margin-bottom:20px}

/* Artikel-/Joomla-Elemente */
.com-content-article__body,.item-page,.blog,.category-list{text-align:center}
.tb-main table{margin:0 auto 20px;border-collapse:collapse;text-align:left;max-width:100%}
.tb-main th,.tb-main td{padding:6px 12px;border-bottom:1px solid rgba(255,255,255,.18)}
.tb-main th{text-transform:uppercase;font-weight:700}
.tb-main hr{border:0;border-top:1px solid rgba(255,255,255,.2);margin:20px 0}
.tb-main .article-info,.tb-main .icons,.tb-main .pagenav{display:none}

/* Formulare (z. B. Newsletter) */
.tb-main label{display:block;margin:10px 0 4px}
.tb-main input[type=text],.tb-main input[type=email],.tb-main input[type=password],.tb-main input[type=tel],
.tb-main textarea,.tb-main select{
  width:100%;max-width:420px;padding:8px 10px;background:#101010;color:#fff;
  border:1px solid #5b5859;border-radius:6px;font:400 13px/20px var(--tb-font);
}
.tb-main input:focus,.tb-main textarea:focus,.tb-main select:focus{outline:2px solid var(--tb-accent);outline-offset:1px}
.tb-main button,.tb-main input[type=submit],.tb-main .btn{
  display:inline-block;margin-top:12px;padding:8px 22px;border:0;border-radius:8px;cursor:pointer;
  background:linear-gradient(var(--tb-pill-1),var(--tb-pill-2));color:#ffd9ec;
  font:600 13px/20px var(--tb-font);text-transform:uppercase;
}
.tb-main button:hover,.tb-main input[type=submit]:hover,.tb-main .btn:hover{filter:brightness(1.2);text-decoration:none;color:#fff}

/* Illustration unten */
.tb-crowd{margin:40px 0 0}
.tb-crowd img{display:block;margin:0 auto}

/* ---------- Footer ---------- */
.tb-footer{margin-top:10px;padding:0;background:#1f1f1f;border-radius:4px;text-align:center;color:#9a9899;font-weight:400}
.tb-footer .tb-copyright{margin:0;padding:8px 10px;font-size:12px;line-height:20px}
.tb-footer > *:not(.tb-copyright){padding:10px 20px}

/* Meldungen */
joomla-alert{display:block;margin:0 0 16px;text-align:left}
#system-message-container{max-width:100%}

/* ---------- Responsive ---------- */
@media (max-width:640px){
  body.site{padding:2px 4px 190px}
  .tb-nav{padding:4px 8px}
  .tb-nav a{padding:6px 10px}
  .tb-main{padding:30px 12px 20px}
  .tb-event{font-size:19px;line-height:30px}
  .tb-event-sub{font-size:15px}
  .tb-main h1{font-size:20px}
  .tb-tagline-main{font-size:2.8cqw}
  .tb-tagline-sub{font-size:1.9cqw}
  .tb-subtitle{text-align:left;left:9%;right:auto;padding-left:0}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}