/* ============================================================
   Blue Med Training + Tours — Anfass-Bausteine, Anpassung an bluemed-training.de (30.10.2026)
   Umsetzung ONLINE NETWORK VISION S.L. · Kennung bluemed-anfassen-20261030
   Bausteine aus dem Lager (tastknopf, sendeknopf, ticket, kassenbon, kartenfaecher, holofolie)
   in den Hausfarben: Marine #164F7A, Meer #1F6FA8, Abendorange #F0923A, Tinte #12262E.
   Die Seite selbst nutzt --signal für Rot — deshalb die Baustein-Farben nur innerhalb der Bausteine.
   ============================================================ */
.tastknopf,.ticket,.kassenbon,.faecher,.fk-gross,.holofolie,.sk-haken,.kassette{
  --signal:#1F6FA8;--signal-hell:#2B84C4;--signal-tief:#164F7A;--marke:#164F7A;--r:18px
}
[data-lied][hidden]{display:none!important}
.kassette{--ks-koerper:#164F7A;--ks-akzent:#F0923A}

/* Tastknöpfe in den Reihen der Seite */
.tk-reihe{display:flex;flex-wrap:wrap;gap:.75rem 1rem;align-items:flex-start}
.hero2 .tk-reihe{margin-top:1.1rem}
.dek__r .tastknopf{margin-top:.9rem}
@media(max-width:820px){.dek__r .tastknopf{margin-top:1rem}}

/* Fortbildungspunkte als schimmernde Plakette */
.holofolie.-punkte{--hf-grund:#164F7A;--hf-r:999px;--hf-staerke:.55;
  display:inline-flex;align-items:center;color:#fff;font-weight:700;border:0}
.holofolie.-punkte::before,.holofolie.-punkte::after{display:none}
.chip.holofolie.-punkte{padding:.42em .95em}
.dek__pk.holofolie.-punkte{padding:.38em .85em;margin-top:8px;font-size:var(--t1);color:#fff}
.ak__bild .holofolie.-punkte{position:absolute}
.dek__r .dek__pk.holofolie{display:flex;width:fit-content;margin-left:auto}
@media(max-width:820px){.dek__r .dek__pk.holofolie{margin-left:0}}

/* China-Club-Fotos im Kartenfächer */
.faecher-buehne{margin-top:1.75rem}
.faecher{--fk-tinte:var(--tinte);--fk-tinte-2:var(--tinte-2)}
.fk-titel{font-family:var(--ueber)}
.fk-gross img{aspect-ratio:auto;height:auto;max-height:56vh;object-fit:contain;background:#0B1A26}
.faecher-tipp{margin:.25rem auto 0;text-align:center;font-size:var(--t1);color:var(--tinte-2)}

/* Reservierung: Ticket, Formular, Beleg */
.res-ticket{margin-top:var(--r4);max-width:680px}
.ticket .tkt-titel{font-family:var(--ueber)}
.tkt-tipp{margin:.6rem 0 0;font-size:var(--t1);color:var(--tinte-2)}
.res-buehne{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(1.5rem,4vw,2.5rem);align-items:start}
.res-buehne .res{margin-top:var(--r4)}
.res-buehne .kassenbon{margin-top:var(--r4)}
@media(min-width:1040px){.res-buehne{grid-template-columns:minmax(0,680px) 340px}
  .res-buehne .kassenbon{position:sticky;top:calc(var(--kopf-h,64px) + 24px)}}
.res-senden{margin-top:var(--r4)}
.res-senden .tastknopf{display:flex;width:100%}
.res-senden .tk-flaeche{width:100%}

/* Knopf im Ticket nach dem Abreißen: Fläche füllt den Knopf */
.tkt-danach .tastknopf .tk-flaeche{width:100%}

/* Rufleiste am Handy */
.ruf a.tastknopf{padding:0;min-height:0;border:0;background:none;flex:1;margin-bottom:4px}
.ruf .tastknopf .tk-flaeche{width:100%}

/* Song */
.liedknopf{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;cursor:pointer;
  font:inherit;font-weight:700;color:var(--tinte);border:1px solid var(--linie);background:rgba(255,255,255,.75);
  border-radius:999px;-webkit-tap-highlight-color:transparent}
.liedknopf svg{width:18px;height:18px;flex:none;color:var(--meer)}
.liedknopf .ls-pause{display:none}
.liedknopf.-spielt .ls-play{display:none}
.liedknopf.-spielt .ls-pause{display:inline}
.liedknopf.-kopf{position:relative;isolation:isolate;width:44px;height:44px;padding:0;flex:none;border:0;background:none;margin:0 -4px}
.liedknopf.-kopf::before{content:"";position:absolute;inset:4px;z-index:-1;border-radius:50%;border:1px solid var(--linie);background:rgba(255,255,255,.75)}
.liedknopf.-kopf.-spielt{box-shadow:none}
.liedknopf.-kopf.-spielt::before{border-color:var(--meer);box-shadow:0 0 0 3px rgba(31,111,168,.18)}
.liedknopf.-kopf svg{width:16px;height:16px}
.liedknopf.-kopf .ls-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(max-width:960px){.liedknopf.-kopf{margin-left:auto}.liedknopf.-kopf + .nav__team{margin-left:0}}
@media(max-width:350px){.liedknopf.-kopf{display:none}}
.liedknopf.-spielt{border-color:var(--meer);box-shadow:0 0 0 3px rgba(31,111,168,.18)}
.liedknopf:focus-visible{outline:3px solid var(--tinte);outline-offset:3px}
.fuss__lied{display:grid;gap:1.25rem 2.5rem;align-items:center;padding-top:clamp(2rem,5vw,3rem);padding-bottom:1rem;border-bottom:1px solid var(--linie)}
@media(min-width:760px){.fuss__lied{grid-template-columns:minmax(0,1fr) minmax(0,400px)}}
.fuss__lied .kassette{margin:0;max-width:400px;width:100%}
.fuss__lied-h{margin:.35rem 0 0;font-family:var(--ueber);font-size:var(--s3);line-height:1.15;color:var(--tinte)}
.fuss__lied-p{margin:.5rem 0 0;font-size:var(--t2);color:var(--tinte-2)}
.kassette.-bald .ks-knopf{opacity:.55;pointer-events:none}
@media(hover:hover) and (pointer:fine){.liedknopf:hover{border-color:var(--meer)}}

/* Kopfleiste am PC: Song-Knopf nur, wenn die Menüpunkte daneben einzeilig bleiben */
@media(min-width:961px) and (max-width:1199px){.liedknopf.-kopf{display:none}}
@media(min-width:1200px){.nav__links a{white-space:nowrap}}
@media(min-width:1200px) and (max-width:1340px){.nav__links{gap:.95rem}}

/* ===== Auftakt: alle drei Abende oben zum Buchen (30.10.2026) ===== */
.hero2{min-height:0;padding-top:clamp(1.25rem,4vw,3rem);padding-bottom:clamp(1.5rem,4vw,3rem)}
.hero3__kopf{margin:0;max-width:46rem}
@media(min-width:1000px){.hero3__kopf{margin:0}}
.hero3__kopf .hero2__h1{font-size:clamp(2rem,4.4vw,3.4rem)}
.hero3__termine{display:grid;gap:.8rem;margin-top:1rem}
@media(min-width:900px){.hero3__termine{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1.25rem}}
.h3t{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.2rem 1rem;align-items:start;color:#fff;
  padding:1rem 1.1rem 1.05rem;border-radius:var(--rund3)}
.h3t.-frei::before{border-color:rgba(255,178,104,.75);box-shadow:0 0 0 1px rgba(255,178,104,.35),0 0 34px -6px rgba(240,146,58,.55),0 1px 0 rgba(255,255,255,.25) inset}
.h3t__dat{text-align:center;min-width:3.2rem;padding-top:.1rem}
.h3t__dat b{display:block;font-family:var(--ueber);font-size:2.3rem;line-height:1;letter-spacing:-.02em}
.h3t__dat span{display:block;margin-top:.2rem;font-size:.8125rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#FFE0B8}
.h3t__ort{margin:0;font-size:.8125rem;color:#C9D6E0;line-height:1.35}
.h3t__h{margin:.2rem 0 0;font-family:var(--ueber);font-size:1.22rem;line-height:1.15;color:#fff;letter-spacing:-.01em}
.h3t__fakten{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .65rem;margin-top:.55rem}
.h3t__preis{font-weight:800;font-size:1.0625rem;color:#fff}
.h3t.-frei .h3t__preis{color:#FFB268}
.h3t__klein{flex-basis:100%;font-size:.8125rem;color:#C9D6E0}
.h3t .holofolie.-punkte{padding:.3em .75em;font-size:.8125rem}
.h3t .tastknopf{grid-column:1/-1;display:flex;margin-top:.85rem}
.h3t .tk-flaeche{width:100%}
@media(min-width:900px){.h3t{grid-template-rows:auto 1fr auto}.h3t .tastknopf{align-self:end}}
.hero3__mehr{margin:1rem 0 0;font-size:var(--t2)}
.hero3__mehr a{color:#fff;font-weight:700;text-decoration:underline;text-underline-offset:3px;display:inline-flex;align-items:center;min-height:44px}
@media(max-width:600px){.hero3__kopf{padding:1.05rem 1.1rem 1.15rem}.hero3__kopf .hero2__h1{font-size:clamp(1.7rem,8vw,2.1rem)}
  .hero3__kopf .hero__sub{font-size:.9375rem;margin-top:.6rem}.hero3__kopf .hero2__kick{font-size:.75rem}
  .h3t{padding:.9rem 1rem .95rem}.h3t .tastknopf{margin-top:.7rem}}