/* Schleswiger Husaren – eigene Ergänzungen zu Bootstrap */

:root {
  --brand: #005293;        /* Blau aus dem Vereinslogo */
  --brand-dark: #003d6e;
  --nav-height: 72px;
  --bs-link-color: var(--brand);
  --bs-link-color-rgb: 0, 82, 147;
  --bs-link-hover-color: var(--brand-dark);
  --bs-link-hover-color-rgb: 0, 61, 110;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: var(--nav-height);   /* Abschnitte nicht unter der fixen Navigation verstecken */
}

body {
  padding-top: var(--nav-height);
  background: #fff;
}

.text-brand { color: var(--brand) !important; }
.border-brand { border-color: var(--brand) !important; border-width: 2px; }

.btn-brand {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--brand);
  --bs-btn-border-color: var(--brand);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--brand-dark);
  --bs-btn-hover-border-color: var(--brand-dark);
  --bs-btn-active-bg: var(--brand-dark);
  --bs-btn-active-border-color: var(--brand-dark);
}

/* Navigation */
.navbar { min-height: var(--nav-height); }
.brand-logo { height: 48px; width: auto; }
.navbar .nav-link { font-weight: 500; }
.navbar .nav-link:hover,
.navbar .nav-link.active { color: var(--brand); }
.navbar .nav-link.active { box-shadow: inset 0 -2px 0 var(--brand); }
@media (max-width: 991.98px) {
  .navbar .nav-link.active { box-shadow: inset 3px 0 0 var(--brand); padding-left: .75rem; }
}

/* Titelbild: wird nie beschnitten, damit immer alle Musiker zu sehen sind */
.hero {
  position: relative;
  overflow: hidden;
  background: #1c1c1c;
  scroll-margin-top: var(--nav-height);
}
/* unscharfe Kopie des Fotos füllt Freiflächen neben dem Bild */
.hero::before {
  content: "";
  position: absolute;
  inset: -40px;
  background: url("../img/SchleswigerHusaren2023Web.jpg") center / cover no-repeat;
  filter: blur(24px) brightness(.45);
}
.hero-img {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  max-height: calc(100svh - var(--nav-height));
  object-fit: contain;
}
.hero-caption {
  position: relative;
  padding: 1.25rem 0;
  color: #fff;
  background: #1f2a36;
}
.hero-title { font-size: clamp(1.5rem, 4vw, 2.75rem); font-weight: 700; margin: 0; }
.hero-subtitle { font-size: clamp(1rem, 2vw, 1.25rem); margin: 0; opacity: .9; }

/* Abschnitte */
.section { padding: 5rem 0; }
.section-sm { padding: 3rem 0; }
.section-title {
  font-size: clamp(1.6rem, 3vw, 2.25rem);
  font-weight: 700;
  margin-bottom: 1.75rem;
  padding-bottom: .5rem;
  border-bottom: 3px solid var(--brand);
  display: inline-block;
}
.bg-light-subtle { background-color: #f4f6f9 !important; }

.next-concert { border-top: 4px solid var(--brand) !important; }
.poster-small { max-height: 360px; width: auto; }
.concert-facts dt { font-weight: 600; }
.concert-facts dd { margin-bottom: .35rem; }

/* Medien */
.video { margin: 0; }
.video figcaption { margin-top: .5rem; font-weight: 500; }

/* Zwei-Klick-Lösung: Platzhalter für YouTube und Google Maps */
.embed-consent { background: #1f2a36; overflow: hidden; border-radius: var(--bs-border-radius); }
.embed-consent > img { object-fit: cover; }
.embed-consent-overlay {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .75rem;
  padding: 1rem;
  text-align: center;
  color: #fff;
  background: rgba(15, 22, 30, .55);
}
.embed-consent-overlay p { margin: 0; font-size: .8rem; max-width: 30rem; text-shadow: 0 1px 2px rgba(0, 0, 0, .6); }
.embed-consent-overlay a { color: #fff; }
.embed-consent-overlay .btn { font-weight: 600; box-shadow: 0 2px 8px rgba(0, 0, 0, .35); }
.embed-consent-map {
  background: linear-gradient(135deg, #e8eef4 0%, #d4dfea 100%);
}
.embed-consent-map .embed-consent-overlay { background: none; color: var(--bs-body-color); }
.embed-consent-map .embed-consent-overlay p { text-shadow: none; }
.embed-consent-map .embed-consent-overlay a { color: var(--brand); }
.embed-consent-map .embed-consent-address { font-size: 1rem; }

/* Karte */
@media (max-width: 767.98px) {
  .map { --bs-aspect-ratio: 75%; }
}
.map iframe { border: 0; }

/* Partnerlogos */
.partner-logos img { max-height: 90px; width: auto; }

/* Impressum */
.legal { max-width: 860px; }
.legal h3 { margin-top: 1.5rem; font-weight: 700; }

/* Footer */
.site-footer { background: #1f2a36; color: #d5dbe2; font-size: .95rem; }
.site-footer a { color: #fff; text-decoration: none; }
.site-footer a:hover { text-decoration: underline; }

/* Nach-oben-Button (reines CSS/HTML) */
.scroll-top {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--brand);
  color: #fff;
  font-size: 1.25rem;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .25);
  z-index: 1020;
}
.scroll-top:hover { background: var(--brand-dark); color: #fff; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}