/* =====================================================================
   Bucelski 2026 – Theme-Styles
   Alle Sektionen als wiederverwendbare Klassen (Prefix: bk-).
   Design-Tokens stehen in :root und lassen sich zentral anpassen.
   ===================================================================== */

:root {
	--bk-primary:      #801431;
	--bk-primary-dark: #6a1029;
	--bk-cream:        #f7f1ed;
	--bk-cream-2:      #f6ecef;
	--bk-cream-line:   #ecd3db;
	--bk-slate:        #42525f;
	--bk-ink:          #2a2225;
	--bk-text:         #3a3336;
	--bk-muted:        #6a5f63;
	--bk-muted-2:      #555555;
	--bk-line:         #e3d6cf;

	--bk-font-head: 'Bricolage Grotesque', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--bk-font-body: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;

	--bk-container: 1180px;
	--bk-pad:       48px;

	/* Overlays für Bild-Kacheln (als Custom Properties zentral steuerbar). */
	--bk-ov-hero:  linear-gradient(100deg, rgba(40,50,58,.9) 0%, rgba(52,64,74,.52) 50%, rgba(52,64,74,.12) 100%);
	--bk-ov-tile:  linear-gradient(to top, rgba(32,40,47,.95) 0%, rgba(44,54,62,.66) 58%, rgba(46,56,65,.14) 100%);
	--bk-ov-wide:  linear-gradient(100deg, rgba(34,42,49,.92) 0%, rgba(46,56,65,.6) 46%, rgba(46,56,65,.12) 100%);
	--bk-ov-trena: linear-gradient(100deg, rgba(34,42,49,.94) 0%, rgba(46,56,65,.7) 45%, rgba(46,56,65,.25) 100%);
}

/* ---------- Reset / Basis ---------- */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
	margin: 0;
	font-family: var(--bk-font-body);
	color: var(--bk-text);
	background: #fff;
	-webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
input, textarea { font-family: var(--bk-font-body); }
h1, h2, h3, h4 { font-family: var(--bk-font-head); }

/* Skip-Link (Barrierefreiheit). */
.bk-skip {
	position: absolute; left: -9999px; top: 0; z-index: 1000;
	background: var(--bk-primary); color: #fff; padding: 12px 20px; border-radius: 0 0 8px 0;
	font: 600 15px var(--bk-font-body);
}
.bk-skip:focus { left: 0; }

/* ---------- Layout ---------- */
.bk-container {
	max-width: var(--bk-container);
	margin: 0 auto;
	padding: 0 var(--bk-pad);
}
.bk-section { padding: 80px 0 84px; }
.bk-section--cream { background: var(--bk-cream); }
.bk-section--white { background: #fff; }
.bk-section--slate { background: var(--bk-slate); }

/* ---------- Buttons ---------- */
.bk-btn {
	display: inline-block;
	padding: 15px 26px;
	border-radius: 999px;
	font: 600 16px var(--bk-font-body);
	line-height: 1;
	cursor: pointer;
	border: 1.5px solid transparent;
	transition: transform .18s ease, background .2s ease, color .2s ease, box-shadow .2s ease;
}
.bk-btn:hover { transform: translateY(-1px); }
.bk-btn--primary       { background: var(--bk-primary); color: #fff; }
.bk-btn--primary:hover  { background: var(--bk-primary-dark); }
.bk-btn--white         { background: #fff; color: var(--bk-primary); }
.bk-btn--white:hover    { box-shadow: 0 10px 26px rgba(0,0,0,.16); }
.bk-btn--outline-white { background: rgba(255,255,255,.14); color: #fff; border-color: rgba(255,255,255,.5); }
.bk-btn--outline-white:hover { background: rgba(255,255,255,.24); }
.bk-btn--slate         { background: #fff; color: var(--bk-slate); }
.bk-btn--slate:hover    { box-shadow: 0 10px 26px rgba(0,0,0,.16); }
.bk-btn--sm            { padding: 12px 22px; font-size: 15px; }

/* Text-Link mit Pfeil ("Mehr erfahren →"). */
.bk-arrowlink { display: inline-flex; align-items: center; gap: 6px; font: 600 14px var(--bk-font-body); }

/* ---------- Sektions-Kopf ---------- */
.bk-head { margin: 0 auto; }
.bk-head--center { text-align: center; max-width: 700px; }
.bk-head--left   { text-align: left; max-width: 640px; margin: 0; }
.bk-eyebrow {
	font: 600 13px var(--bk-font-body);
	color: var(--bk-primary);
	letter-spacing: .14em;
	text-transform: uppercase;
}
.bk-head__title {
	font: 700 42px/1.1 var(--bk-font-head);
	color: var(--bk-ink);
	margin: 12px 0 0;
	letter-spacing: -.02em;
	text-wrap: balance;
}
.bk-head__text {
	font: 400 17px/1.6 var(--bk-font-body);
	color: var(--bk-muted);
	margin: 14px 0 0;
}
.bk-head--dark .bk-eyebrow   { color: #c3ccd3; }
.bk-head--dark .bk-head__title { color: #fff; }
.bk-head--dark .bk-head__text  { color: rgba(255,255,255,.82); }

/* =====================================================================
   HEADER
   ===================================================================== */
.bk-header {
	position: sticky; top: 0; z-index: 50;
	background: #fff;
	box-shadow: 0 2px 14px rgba(60,30,40,.07);
	transition: box-shadow .25s ease;
}
.bk-header.is-scrolled { box-shadow: 0 5px 20px rgba(60,30,40,.14); }

.bk-header__row {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 20px;
	max-width: var(--bk-container);
	margin: 0 auto;
	padding: 12px var(--bk-pad);
	transition: padding .25s ease;
}
.bk-header__logo img { height: 48px; width: auto; transition: height .25s ease; }
.bk-header.is-scrolled .bk-header__row { padding-top: 6px; padding-bottom: 6px; }
.bk-header.is-scrolled .bk-header__logo img { height: 30px; }

/* Telefon-Chip (Mitte). */
.bk-phone {
	justify-self: center;
	display: flex; flex-direction: column; align-items: center; line-height: 1.1;
	background: var(--bk-cream-2);
	border: 1px solid var(--bk-cream-line);
	border-radius: 12px;
	padding: 8px 24px;
	transition: padding .22s ease;
}
.bk-phone__label {
	font: 600 10px var(--bk-font-body); color: #555;
	letter-spacing: .14em; text-transform: uppercase;
}
.bk-phone__num {
	font: 700 24px var(--bk-font-head); color: var(--bk-primary);
	letter-spacing: -.01em; transition: font-size .22s ease;
}
.bk-header.is-scrolled .bk-phone { padding-top: 3px; padding-bottom: 3px; }
.bk-header.is-scrolled .bk-phone__num { font-size: 18px; }
.bk-header.is-scrolled .bk-phone__label { display: none; }

/* Termin-Button (rechts). */
.bk-header__cta { justify-self: end; }

/* Mobile-Icons. */
.bk-phone-ic {
	justify-self: center; display: none; align-items: center; justify-content: center;
	width: 46px; height: 46px; border-radius: 50%; border: none;
	background: var(--bk-primary); cursor: pointer; padding: 0;
}
.bk-phone-ic svg { fill: #fff; }
.bk-burger {
	display: none; flex-direction: column; justify-content: center; gap: 5px;
	width: 44px; height: 44px; border: none; background: transparent; cursor: pointer; padding: 0;
	justify-self: end;
}
.bk-burger span { display: block; width: 24px; height: 2px; background: var(--bk-primary); border-radius: 2px; transition: transform .25s ease, opacity .2s ease; }
.bk-navwrap.open ~ .bk-burger { } /* Platzhalter für evtl. Animationen. */

/* Navigation. */
.bk-navwrap { border-top: 1px solid #f0e7e3; }
.bk-nav {
	display: flex; justify-content: center; gap: 34px;
	max-width: var(--bk-container); margin: 0 auto;
	padding: 11px var(--bk-pad);
	font: 500 15px var(--bk-font-body); color: #46393d;
	transition: padding .25s ease;
}
.bk-header.is-scrolled .bk-nav { padding-top: 6px; padding-bottom: 6px; }
.bk-nav > a, .bk-dd > a { padding: 2px 0; }
.bk-nav a:hover { color: var(--bk-primary); }

/* Dropdown. */
.bk-dd { position: relative; }
.bk-dd-caret { display: inline-block; transition: transform .2s ease; font-size: 11px; margin-left: 3px; }
.bk-dd:hover .bk-dd-caret { transform: rotate(180deg); }
.bk-dd::after { content: ""; position: absolute; top: 100%; left: 0; right: 0; height: 14px; }
.bk-dd-menu {
	display: none; position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
	background: #fff; border-radius: 14px; box-shadow: 0 14px 38px rgba(60,30,40,.16);
	padding: 8px; min-width: 248px; z-index: 60;
}
.bk-dd:hover .bk-dd-menu, .bk-dd.is-open .bk-dd-menu { display: block; }
.bk-dd-menu a { display: block; padding: 10px 14px; border-radius: 9px; font: 500 14px var(--bk-font-body); color: #46393d; }
.bk-dd-menu a:hover { background: var(--bk-cream-2); color: var(--bk-primary); }
.bk-dd-sub { padding-left: 30px !important; font-size: 13px !important; color: var(--bk-muted) !important; }

/* =====================================================================
   HERO-SLIDER
   ===================================================================== */
.bk-hero { position: relative; height: 600px; overflow: hidden; background: #2a323a; }
.bk-hero__track { display: flex; height: 100%; width: 100%; transition: transform .85s cubic-bezier(.66,0,.18,1); }
.bk-hero__slide {
	flex: 0 0 100%; height: 100%; position: relative;
	background-size: cover; background-position: center;
}
.bk-hero__inner {
	max-width: var(--bk-container); margin: 0 auto; padding: 0 var(--bk-pad);
	height: 100%; display: flex; align-items: center; overflow: hidden;
}
.bk-hero__content { max-width: 620px; }
.bk-hero__badge {
	display: inline-flex; background: rgba(255,255,255,.16); color: #fff;
	padding: 7px 14px; border-radius: 999px; font: 600 12px var(--bk-font-body); letter-spacing: .04em;
}
.bk-hero__title { font: 700 60px/1.02 var(--bk-font-head); color: #fff; margin: 20px 0 0; letter-spacing: -.025em; text-wrap: balance; }
.bk-hero__text  { font: 400 19px/1.6 var(--bk-font-body); color: rgba(255,255,255,.92); margin: 18px 0 0; max-width: 520px; }
.bk-hero__actions { display: flex; gap: 14px; margin-top: 30px; flex-wrap: wrap; }

/* Einblend-Animation der aktiven Slide-Inhalte. */
.bk-hero__anim { opacity: 0; transform: translateX(80px); transition: transform .9s cubic-bezier(.5,0,.2,1), opacity .8s ease; }
.bk-hero__slide.is-active .bk-hero__anim { opacity: 1; transform: translateX(0); }
.bk-hero__slide.is-active .bk-hero__badge   { transition-delay: .05s; }
.bk-hero__slide.is-active .bk-hero__title   { transition-delay: .15s; }
.bk-hero__slide.is-active .bk-hero__text    { transition-delay: .26s; }
.bk-hero__slide.is-active .bk-hero__actions { transition-delay: .37s; }

/* Pfeile. */
.bk-hero__arrow {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 7;
	width: 46px; height: 46px; border-radius: 50%; border: none;
	background: rgba(255,255,255,.22); color: #fff; font-size: 24px; cursor: pointer;
	backdrop-filter: blur(4px); transition: background .2s ease;
}
.bk-hero__arrow:hover { background: rgba(255,255,255,.35); }
.bk-hero__arrow--prev { left: 20px; }
.bk-hero__arrow--next { right: 20px; }

/* Untere Leiste: Statistiken + Punkte. */
.bk-hero__bottom { position: absolute; left: 0; right: 0; bottom: 26px; z-index: 6; pointer-events: none; }
.bk-hero__bottom-inner {
	max-width: var(--bk-container); margin: 0 auto; padding: 0 var(--bk-pad);
	display: flex; justify-content: space-between; align-items: flex-end; gap: 20px;
}
.bk-hero__stats { display: flex; gap: 26px; flex-wrap: wrap; align-items: stretch; }
.bk-hero__stat-num { font: 700 24px var(--bk-font-head); color: #fff; }
.bk-hero__stat-lbl { font: 500 13px var(--bk-font-body); color: rgba(255,255,255,.75); }
.bk-hero__stat-sep { width: 1px; background: rgba(255,255,255,.3); }
.bk-hero__dots { display: flex; gap: 10px; pointer-events: auto; }
.bk-hero__dot { width: 11px; height: 11px; border-radius: 50%; border: none; cursor: pointer; padding: 0; background: rgba(255,255,255,.45); transition: background .2s ease; }
.bk-hero__dot.is-active { background: #fff; }

/* =====================================================================
   ANGEBOT
   ===================================================================== */
.bk-group { margin-top: 54px; }
.bk-group:first-of-type { margin-top: 0; }
.bk-group__head { display: flex; align-items: baseline; gap: 16px; margin-bottom: 20px; }
.bk-group__num  { font: 700 16px var(--bk-font-head); color: var(--bk-primary); letter-spacing: .04em; }
.bk-group__title { font: 700 30px/1 var(--bk-font-head); color: var(--bk-ink); margin: 0; letter-spacing: -.02em; }
.bk-group__line { flex: 1; height: 1px; background: var(--bk-line); }
.bk-group__sub  { font: 400 14px var(--bk-font-body); color: var(--bk-muted); }

/* Kachel-Raster. */
.bk-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
/* Weniger als vier Kacheln füllen die Reihe trotzdem gleichmäßig aus. */
.bk-tiles[data-count="1"] { grid-template-columns: minmax(0, 520px); }
.bk-tiles[data-count="2"] { grid-template-columns: repeat(2, 1fr); }
.bk-tiles[data-count="3"] { grid-template-columns: repeat(3, 1fr); }

/* Bild-Kachel (Basis). */
.bk-tile {
	position: relative; border-radius: 18px; overflow: hidden; min-height: 300px;
	display: flex; flex-direction: column; justify-content: flex-end; padding: 24px; color: #fff;
	background-image: var(--bk-ov-tile); background-size: cover; background-position: center;
	transition: filter .2s ease;
}
.bk-tile:hover { filter: brightness(1.06); }
.bk-tile__eyebrow { font: 600 11px var(--bk-font-body); color: rgba(255,255,255,.85); letter-spacing: .1em; text-transform: uppercase; }
.bk-tile__title   { font: 700 22px/1.1 var(--bk-font-head); margin: 5px 0 0; }
.bk-tile__text    { font: 400 13px/1.45 var(--bk-font-body); color: rgba(255,255,255,.85); margin: 7px 0 0; }
.bk-tile__more    { font: 600 13px var(--bk-font-body); margin-top: 9px; }
.bk-tile__badge {
	display: inline-flex; align-self: flex-start; align-items: center; gap: 6px; margin-top: 12px;
	padding: 6px 11px; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.28);
	border-radius: 999px; font: 600 12px var(--bk-font-body);
}
.bk-tile__badge span { opacity: .7; font-weight: 500; }

/* Feature-Kachel (breit, hoch – z. B. Training). */
.bk-tile--feature {
	grid-column: 1 / -1; min-height: 340px; padding: 38px; justify-content: flex-end;
	background-image: var(--bk-ov-wide);
}
.bk-tile--feature .bk-tile__inner { max-width: 520px; }
.bk-tile--feature .bk-tile__badge { margin: 0 0 14px; background: rgba(255,255,255,.2); border: none; }
.bk-tile--feature .bk-tile__title { font-size: 40px; line-height: 1; letter-spacing: -.02em; }
.bk-tile--feature .bk-tile__text  { font-size: 17px; line-height: 1.55; color: rgba(255,255,255,.9); margin-top: 12px; }
.bk-tile--feature .bk-tile__more  { font-size: 15px; margin-top: 16px; display: inline-block; }

/* Breite Kachel, vertikal zentriert (z. B. T-Rena). */
.bk-tile--wide {
	grid-column: 1 / -1; min-height: 240px; padding: 34px 38px; justify-content: center; border-radius: 20px;
	background-image: var(--bk-ov-trena);
}
.bk-tile--wide .bk-tile__inner { max-width: 640px; }
.bk-tile--wide .bk-tile__title { font-size: 30px; line-height: 1.05; letter-spacing: -.02em; margin-top: 7px; }
.bk-tile--wide .bk-tile__text  { font-size: 15px; line-height: 1.5; color: rgba(255,255,255,.88); margin-top: 9px; }
.bk-tile--wide .bk-tile__more  { font-size: 15px; margin-top: 14px; display: inline-block; }

/* =====================================================================
   IMAGEVIDEO
   ===================================================================== */
.bk-video { max-width: 980px; margin: 0 auto; }
.bk-video__frame {
	position: relative; aspect-ratio: 16/9; border-radius: 20px; overflow: hidden;
	background: #2a323a; box-shadow: 0 18px 50px rgba(60,30,40,.16);
}
.bk-video__poster { width: 100%; height: 100%; object-fit: cover; }
.bk-video__embed,
.bk-video__file { width: 100%; height: 100%; border: 0; display: block; object-fit: cover; }
.bk-video__play {
	position: absolute; inset: 0; margin: auto;
	width: 84px; height: 84px; border-radius: 50%; border: none; cursor: pointer;
	background: rgba(255,255,255,.92); color: var(--bk-primary);
	display: flex; align-items: center; justify-content: center;
	padding-left: 5px;
	box-shadow: 0 12px 34px rgba(0,0,0,.28);
	transition: transform .2s ease, background .2s ease;
}
.bk-video__play:hover { transform: scale(1.07); background: #fff; }
.bk-video__frame--ph {
	background: repeating-linear-gradient(135deg, #e3ddd6 0 16px, #eee8e1 16px 32px);
	display: flex; align-items: center; justify-content: center;
}
.bk-video__frame--ph span { font: 500 13px ui-monospace, monospace; color: #9a9087; background: rgba(255,255,255,.75); padding: 8px 14px; border-radius: 6px; }
.bk-video__note { font: 400 13px/1.5 var(--bk-font-body); color: var(--bk-muted); margin: 14px 0 0; text-align: center; }
.bk-video__note--dark { color: rgba(255,255,255,.72); }

/* =====================================================================
   UNSERE PHILOSOPHIE
   ===================================================================== */
.bk-philo {
	list-style: none; margin: 46px 0 0; padding: 0;
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;
}
.bk-philo[data-count="1"] { grid-template-columns: minmax(0, 640px); justify-content: center; }
.bk-philo[data-count="2"] { grid-template-columns: repeat(2, 1fr); }
.bk-philo[data-count="4"] { grid-template-columns: repeat(4, 1fr); }
.bk-philo__item {
	background: var(--bk-cream); border-radius: 16px; padding: 28px 26px 30px;
	border-top: 3px solid var(--bk-primary);
}
.bk-philo__num { font: 700 15px var(--bk-font-head); color: var(--bk-primary); letter-spacing: .06em; }
.bk-philo__title { font: 700 21px/1.2 var(--bk-font-head); color: var(--bk-ink); margin: 10px 0 0; letter-spacing: -.01em; }
.bk-philo__text { font: 400 15px/1.6 var(--bk-font-body); color: var(--bk-muted); margin: 10px 0 0; }

/* =====================================================================
   WOBEI WIR HELFEN
   ===================================================================== */
.bk-helpgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 46px; }
.bk-helpgrid[data-count="1"] { grid-template-columns: minmax(0, 520px); justify-content: center; }
.bk-helpgrid[data-count="2"],
.bk-helpgrid[data-count="4"] { grid-template-columns: repeat(2, 1fr); }
/* Bleibt in der letzten Reihe nur eine Karte übrig, rückt sie in die Mitte. */
.bk-helpgrid > :last-child:nth-child(3n + 1):not(:first-child) { grid-column: 2; }
.bk-help-card {
	background: var(--bk-cream); border-radius: 16px; padding: 24px;
	display: flex; flex-direction: column;
	transition: transform .2s ease, box-shadow .2s ease;
}
.bk-help-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(60,30,40,.1); }
.bk-help-card__icon { width: 34px; height: 34px; border-radius: 9px; background: var(--bk-primary); margin-bottom: 14px; display: flex; align-items: center; justify-content: center; }
.bk-help-card__icon svg { width: 20px; height: 20px; fill: #fff; }
.bk-help-card__title { font: 700 19px var(--bk-font-head); color: var(--bk-ink); margin: 0; }
.bk-help-card__text  { font: 400 14px/1.55 var(--bk-font-body); color: var(--bk-muted); margin: 8px 0 0; flex: 1; }
.bk-help-card__more  { color: var(--bk-primary); margin-top: 14px; }
.bk-center-cta { text-align: center; margin-top: 42px; }

/* =====================================================================
   TEAM
   ===================================================================== */
.bk-team__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.bk-member { position: relative; }
.bk-member__photo {
	aspect-ratio: 3/4; border-radius: 16px; overflow: hidden;
	box-shadow: 0 6px 20px rgba(60,30,40,.06);
	background: repeating-linear-gradient(135deg, #e7d2d8 0 14px, #f0e2e6 14px 28px);
}
.bk-member__photo img { width: 100%; height: 100%; object-fit: cover; }
.bk-member__ph-label { position: absolute; left: 14px; top: 12px; font: 500 11px ui-monospace, monospace; color: #a98b95; }
.bk-member__name { font: 700 17px var(--bk-font-head); color: var(--bk-ink); margin: 12px 0 0; }
.bk-member__role { font: 400 14px var(--bk-font-body); color: var(--bk-muted); margin: 2px 0 0; }

/* =====================================================================
   ERSTER BESUCH
   ===================================================================== */
.bk-visit__label { font: 600 12px var(--bk-font-body); color: #c3ccd3; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 16px; }
.bk-bringgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.bk-bring {
	background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18);
	border-radius: 16px; padding: 22px; display: flex; flex-direction: column;
}
.bk-bring__icon { width: 42px; height: 42px; border-radius: 11px; background: #fff; display: flex; align-items: center; justify-content: center; margin-bottom: 15px; }
.bk-bring__icon svg { width: 22px; height: 22px; }
.bk-bring__title { font: 700 18px/1.2 var(--bk-font-head); color: #fff; margin: 0; }
.bk-bring__text  { font: 400 14px/1.55 var(--bk-font-body); color: rgba(255,255,255,.8); margin: 8px 0 0; }

.bk-infogrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 34px; }
.bk-infogrid[data-count="1"] { grid-template-columns: minmax(0, 520px); }
.bk-infogrid[data-count="2"],
.bk-infogrid[data-count="4"] { grid-template-columns: repeat(2, 1fr); }
.bk-info { background: #fff; border-radius: 16px; padding: 26px; display: flex; flex-direction: column; }
.bk-info__big   { font: 700 26px/1 var(--bk-font-head); color: var(--bk-primary); letter-spacing: -.01em; }
.bk-info__label { font: 600 12px var(--bk-font-body); color: var(--bk-slate); letter-spacing: .1em; text-transform: uppercase; margin-top: 10px; }
.bk-info__text  { font: 400 14px/1.6 var(--bk-font-body); color: #5a5f66; margin: 9px 0 0; }

/* =====================================================================
   KONTAKT
   ===================================================================== */
.bk-contact__grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 40px; align-items: stretch; }
.bk-contact__info { background: var(--bk-cream); border-radius: 20px; padding: 32px; display: flex; flex-direction: column; gap: 22px; }
.bk-contact__label { font: 600 12px var(--bk-font-body); color: var(--bk-primary); letter-spacing: .1em; text-transform: uppercase; margin-bottom: 6px; }
.bk-contact__strong { font: 600 17px var(--bk-font-body); color: var(--bk-ink); }
.bk-contact__lines { font: 400 15px/1.6 var(--bk-font-body); color: var(--bk-muted-2); }
.bk-contact__lines a { color: var(--bk-ink); font-weight: 600; }
.bk-contact__features { display: flex; flex-direction: column; gap: 8px; border-top: 1px solid #e7ddd6; padding-top: 18px; }
.bk-contact__feature { font: 500 14px var(--bk-font-body); color: var(--bk-muted-2); }
.bk-contact__col { display: flex; flex-direction: column; gap: 20px; }

/* Formular. */
.bk-form { background: #fff; border: 1px solid #ecdfd8; border-radius: 20px; padding: 30px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.bk-field { display: flex; flex-direction: column; gap: 6px; }
.bk-field--full { grid-column: 1 / -1; }
.bk-field label { font: 600 13px var(--bk-font-body); color: var(--bk-muted-2); }
.bk-field input, .bk-field textarea {
	border: 1px solid #e0d3cc; border-radius: 10px; padding: 12px 14px;
	font-size: 15px; color: var(--bk-ink); outline: none; background: #fbf8f6;
}
.bk-field input:focus, .bk-field textarea:focus { border-color: var(--bk-primary); }
.bk-field textarea { resize: vertical; }
.bk-form__consent { grid-column: 1 / -1; display: flex; align-items: flex-start; gap: 10px; font: 400 13px/1.5 var(--bk-font-body); color: var(--bk-muted); }
.bk-form__consent input { margin-top: 3px; accent-color: var(--bk-primary); }
.bk-form__submit { grid-column: 1 / -1; background: var(--bk-primary); color: #fff; border: none; padding: 15px; border-radius: 999px; font: 600 16px var(--bk-font-body); cursor: pointer; transition: background .2s ease; }
.bk-form__submit:hover { background: var(--bk-primary-dark); }
.bk-form__note { grid-column: 1 / -1; margin: 0; font: 500 14px/1.5 var(--bk-font-body); padding: 12px 14px; border-radius: 10px; }
.bk-form__note--ok  { background: #eaf6ec; color: #266b34; }
.bk-form__note--err { background: #fbeaee; color: #9a1c38; }
.bk-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Karte. */
.bk-map { flex: 1; min-height: 180px; border-radius: 20px; overflow: hidden; position: relative; display: flex; }
.bk-map iframe { width: 100%; height: 100%; border: 0; min-height: 220px; }
.bk-map__ph {
	flex: 1; min-height: 180px;
	background: repeating-linear-gradient(135deg, #e3ddd6 0 16px, #eee8e1 16px 32px);
	display: flex; align-items: center; justify-content: center;
}
.bk-map__ph span { font: 500 13px ui-monospace, monospace; color: #9a9087; background: rgba(255,255,255,.75); padding: 6px 12px; border-radius: 6px; }

/* =====================================================================
   FOOTER
   ===================================================================== */
.bk-footer { background: var(--bk-primary); color: #fff; padding: 54px 0 28px; }
.bk-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 40px; padding-bottom: 34px; border-bottom: 1px solid rgba(255,255,255,.18); }
.bk-footer__brand { display: flex; align-items: center; gap: 12px; }
.bk-footer__brand img { height: 40px; width: auto; }
.bk-footer__brand-name { font: 700 19px var(--bk-font-head); color: #fff; }
.bk-footer__desc { font: 400 14px/1.6 var(--bk-font-body); color: rgba(255,255,255,.8); margin: 16px 0 0; max-width: 320px; }
.bk-footer__title { font: 600 12px var(--bk-font-body); letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.6); margin-bottom: 14px; }
.bk-footer__links { display: flex; flex-direction: column; gap: 9px; font: 400 14px var(--bk-font-body); color: rgba(255,255,255,.88); }
.bk-footer__links a { color: rgba(255,255,255,.88); }
.bk-footer__links a:hover { color: #fff; text-decoration: underline; }
.bk-footer__links a.is-parent { font-weight: 600; }
.bk-footer__links a.is-child  { padding-left: 14px; color: rgba(255,255,255,.78); }
.bk-footer__links a.is-subchild { padding-left: 28px; color: rgba(255,255,255,.68); font-size: 13px; }
.bk-footer__contact { font: 400 14px/1.7 var(--bk-font-body); color: rgba(255,255,255,.88); }
.bk-footer__bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-top: 20px; font: 400 13px var(--bk-font-body); color: rgba(255,255,255,.7); flex-wrap: wrap; }
.bk-footer__legal { display: flex; gap: 22px; }
.bk-footer__legal a:hover { text-decoration: underline; }

/* =====================================================================
   KONTAKT-MODAL (mobil)
   ===================================================================== */
.bk-modal { display: none; position: fixed; inset: 0; z-index: 100; align-items: center; justify-content: center; padding: 24px; }
.bk-modal.open { display: flex; }
.bk-modal__backdrop { position: absolute; inset: 0; background: rgba(40,18,26,.55); }
.bk-modal__box { position: relative; background: #fff; border-radius: 22px; width: 100%; max-width: 360px; padding: 24px; box-shadow: 0 24px 70px rgba(40,18,26,.4); }
.bk-modal__head { display: flex; justify-content: space-between; align-items: flex-start; }
.bk-modal__title { font: 700 22px var(--bk-font-head); color: var(--bk-ink); margin: 0; }
.bk-modal__sub { font: 400 14px/1.5 var(--bk-font-body); color: var(--bk-muted); margin: 5px 0 0; }
.bk-modal__close { border: none; background: #f3e9ec; width: 34px; height: 34px; border-radius: 50%; font-size: 17px; color: var(--bk-primary); cursor: pointer; flex-shrink: 0; }
.bk-modal__actions { display: flex; flex-direction: column; gap: 12px; margin-top: 20px; }
.bk-modal__action { display: flex; align-items: center; gap: 14px; border-radius: 14px; padding: 15px 18px; }
.bk-modal__action svg { flex-shrink: 0; }
.bk-modal__action--call { background: var(--bk-primary); color: #fff; }
.bk-modal__action--mail { background: var(--bk-cream-2); color: var(--bk-ink); }
.bk-modal__action--book { background: #fff; border: 1.5px solid #e3c9d2; color: var(--bk-primary); }
.bk-modal__action b { font: 700 16px var(--bk-font-body); }
.bk-modal__action small { font: 500 13px var(--bk-font-body); display: block; }
.bk-modal__action--call small { color: rgba(255,255,255,.82); }
.bk-modal__action--mail small { color: var(--bk-muted); }

/* ---------- Fließtext (Unterseiten, Freitext-Block) ---------- */
.bk-richtext { font: 400 17px/1.7 var(--bk-font-body); color: var(--bk-text); }
.bk-richtext h1, .bk-richtext h2, .bk-richtext h3, .bk-richtext h4 { color: var(--bk-ink); letter-spacing: -.02em; line-height: 1.15; margin: 1.4em 0 .5em; }
.bk-richtext h1 { font-size: 34px; }
.bk-richtext h2 { font-size: 27px; }
.bk-richtext h3 { font-size: 21px; }
.bk-richtext p { margin: 0 0 1.1em; }
.bk-richtext a { color: var(--bk-primary); text-decoration: underline; }
.bk-richtext ul, .bk-richtext ol { margin: 0 0 1.1em; padding-left: 1.4em; }
.bk-richtext li { margin: .3em 0; }
.bk-richtext img { border-radius: 12px; height: auto; margin: 1em 0; }
.bk-richtext blockquote { margin: 1.4em 0; padding: 6px 0 6px 20px; border-left: 3px solid var(--bk-primary); color: var(--bk-muted); }
.bk-richtext table { border-collapse: collapse; width: 100%; margin: 1.2em 0; }
.bk-richtext th, .bk-richtext td { border: 1px solid #e7ddd6; padding: 10px 12px; text-align: left; }

/* ---------- Paginierung ---------- */
.bk-pagination .nav-links, .bk-pagination { display: flex; gap: 8px; flex-wrap: wrap; }
.bk-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; padding: 0 12px; border-radius: 10px; background: var(--bk-cream); color: var(--bk-ink); font: 600 15px var(--bk-font-body); }
.bk-pagination .page-numbers.current { background: var(--bk-primary); color: #fff; }
.bk-pagination a.page-numbers:hover { background: var(--bk-cream-2); }

/* Anker-Offset (Sticky-Header). */
[id] { scroll-margin-top: 140px; }

/* WordPress-Ausrichtungen für Fließtext-Inhalte. */
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignright { float: right; margin: 0 0 1em 1.5em; }
.alignleft { float: left; margin: 0 1.5em 1em 0; }

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width: 980px) {
	.bk-nav { gap: 22px; }
	.bk-tiles, .bk-tiles[data-count] { grid-template-columns: 1fr 1fr; }
	.bk-philo, .bk-philo[data-count] { grid-template-columns: 1fr 1fr; }
	.bk-team__grid { grid-template-columns: repeat(3, 1fr); }
	.bk-footer__grid { grid-template-columns: 1fr 1fr; }
	.bk-hero__title { font-size: 46px; }
}
@media (max-width: 860px) {
	:root { --bk-pad: 20px; }
	.bk-header__row { grid-template-columns: auto 1fr auto; gap: 10px; padding-left: 16px; padding-right: 16px; }
	.bk-header__cta { display: none; }
	.bk-burger { display: flex; }
	.bk-phone { display: none; }
	.bk-phone-ic { display: flex; }
	.bk-navwrap { display: none; }
	.bk-navwrap.open { display: block; }
	.bk-nav { flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 2px; padding: 8px 16px 14px; font-size: 16px; }
	.bk-nav a { padding: 11px 6px; border-radius: 8px; }
	.bk-hero__arrow { display: none; }
	.bk-hero__stats { display: none; }
	.bk-hero__bottom-inner { justify-content: center; }
	.bk-hero { height: 520px; }
	.bk-hero__title { font-size: 40px; }
	.bk-hero__text { font-size: 16px; }
	.bk-tiles, .bk-tiles[data-count] { grid-template-columns: 1fr 1fr; }
	.bk-team__grid { grid-template-columns: repeat(3, 1fr); }
	.bk-bringgrid { grid-template-columns: 1fr 1fr; }
	.bk-infogrid, .bk-infogrid[data-count] { grid-template-columns: 1fr; }
	.bk-dd-menu { display: block; position: static; transform: none; box-shadow: none; padding: 0 0 0 12px; min-width: 0; background: transparent; border-radius: 0; }
	.bk-dd-menu a { padding: 9px 6px; }
	.bk-dd-caret { display: none; }
}
@media (max-width: 600px) {
	.bk-hero { height: 500px; }
	.bk-hero__title { font-size: 33px; }
	.bk-hero__text { font-size: 15px; }
	.bk-phone__num { font-size: 20px; }
	.bk-tiles, .bk-tiles[data-count] { grid-template-columns: 1fr; }
	.bk-philo, .bk-philo[data-count] { grid-template-columns: 1fr; }
	.bk-video__play { width: 66px; height: 66px; }
	.bk-helpgrid, .bk-helpgrid[data-count] { grid-template-columns: 1fr; }
	.bk-helpgrid > :last-child:nth-child(3n + 1):not(:first-child) { grid-column: auto; }
	.bk-team__grid { grid-template-columns: 1fr 1fr; }
	.bk-contact__grid { grid-template-columns: 1fr; }
	.bk-form { grid-template-columns: 1fr; }
	.bk-footer__grid { grid-template-columns: 1fr; }
	.bk-bringgrid { grid-template-columns: 1fr; }
	.bk-group__head { flex-wrap: wrap; gap: 8px 12px; }
	.bk-group__title { font-size: 25px; }
	.bk-group__line { display: none; }
	.bk-group__sub { flex-basis: 100%; font-size: 13px; }
	.bk-head__title { font-size: 33px; }
	.bk-section { padding-top: 54px; padding-bottom: 58px; }
}

/* Reduzierte Bewegung respektieren. */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.bk-hero__track, .bk-hero__anim, .bk-btn, .bk-tile, .bk-help-card { transition: none !important; }
	.bk-hero__anim { opacity: 1 !important; transform: none !important; }
}