/* TK Wasser-Effekte – Ebenen liegen hinter dem Inhalt und fangen keine Klicks ab. */

.tkw-layer {
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 0;
}

.tk-water-hero > *:not([class*="tkw-"]),
.g-2f65d21 > *:not([class*="tkw-"]),
.tk-water-wave > *:not([class*="tkw-"]),
.g-c7398d8 > *:not([class*="tkw-"]),
.tk-water-level > *:not([class*="tkw-"]),
.g-16c9375 > *:not([class*="tkw-"]),
.tk-water-ripple > *:not([class*="tkw-"]),
.g-6a8cd6f > *:not([class*="tkw-"]),
.tk-water-pipe > *:not([class*="tkw-"]),
.g-7812715 > *:not([class*="tkw-"]) {
	position: relative;
	z-index: 1;
}

/* Hero: Wellen-Canvas + Wasserlinie unten */
.tkw-canvas {
	width: 100%;
	height: 100%;
	display: block;
}

.tkw-wave {
	position: absolute;
	left: 0;
	right: 0;
	bottom: -1px;
	width: 100%;
	height: clamp(48px, 7vw, 110px);
	pointer-events: none;
	z-index: 1;
}

.tkw-wave path {
	will-change: d;
}

/* Wellen-Trenner oben an Sektionen */
.tkw-divider {
	position: absolute;
	left: 0;
	right: 0;
	top: -1px;
	width: 100%;
	height: clamp(32px, 4vw, 64px);
	pointer-events: none;
	z-index: 1;
	transform: scaleY(-1);
}

/* Wasserstand hinter den Zahlen */
.tkw-level {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 100%;
	transform-origin: bottom;
	transform: scaleY(0.08);
	background: linear-gradient(180deg, rgba(142, 197, 193, 0.22) 0%, rgba(142, 197, 193, 0.06) 100%);
	pointer-events: none;
	z-index: 0;
}

.tkw-level svg {
	position: absolute;
	left: 0;
	top: -40px;
	width: 200%;
	height: 42px;
}

/* Rohrleitung mit Tropfen im Ablauf */
.tkw-pipe {
	position: absolute;
	left: 0;
	right: 0;
	pointer-events: none;
	z-index: 0;
	overflow: visible;
}

/* Klick-/Tipp-Ripple auf Buttons und CTA-Flächen */
.tkw-ripple {
	position: absolute;
	border-radius: 50%;
	pointer-events: none;
	border: 2px solid rgba(142, 197, 193, 0.75);
	transform: translate(-50%, -50%) scale(0);
	z-index: 2;
}

.tk-btn-primary,
.g-dd55804 {
	position: relative;
	overflow: hidden;
}

.tkw-btn-drop {
	position: absolute;
	border-radius: 50%;
	pointer-events: none;
	background: rgba(255, 255, 255, 0.35);
	transform: translate(-50%, -50%) scale(0);
}

/* ---------- Header / Mobil-Menü ---------- */
.tk-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100;
	background: #204E51;
	color: #fff;
	padding: 0.75rem 1rem;
}
.tk-skip:focus {
	left: 1rem;
	top: 1rem;
}

/* Header bleibt beim Scrollen oben (wie in der Vorlage) */
.elementor-48 {
	position: sticky;
	top: 0;
	z-index: 50;
}
.admin-bar .elementor-48 { top: 32px; }
@media (max-width: 782px) { .admin-bar .elementor-48 { top: 46px; } }
.tk-header { transition: box-shadow .25s ease; }
.tk-header.is-scrolled { box-shadow: 0 8px 24px rgba(24, 64, 68, 0.10); }

/* ---------- Hauptmenü wie Vorlage (landscape-128 / home-2) ---------- */
.tk-header .tk-nav a,
.tk-footer a { color: inherit; text-decoration: none; }

/* Menüpunkte: volle Header-Höhe, 4px-Linie oben beim Überfahren / aktiv */
.tk-nav > .tk-nav-link,
.tk-nav-item { position: relative; }
.tk-nav > .tk-nav-link::before,
.tk-nav-item::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	height: 4px;
	width: 0;
	background: var(--tk-navy, #204E51);
	transition: width .35s ease;
	pointer-events: none;
}
.tk-nav > .tk-nav-link:hover::before,
.tk-nav-item:hover::before,
.tk-nav-item.is-open::before,
.tk-nav > .tk-nav-link.is-current::before,
.tk-nav-item.is-current::before { width: 100%; }
.tk-nav > .tk-nav-link > a { display: flex; align-items: center; height: 100%; }

/* Pfeil an Dropdown-Punkten */
.tk-nav-trigger {
	display: flex !important;
	align-items: center;
	gap: .45rem;
	user-select: none;
}
.tk-nav-trigger::after {
	content: "";
	width: .4rem;
	height: .4rem;
	border-right: 2px solid #242424;
	border-bottom: 2px solid #242424;
	transform: translateY(-2px) rotate(45deg);
	transition: transform .2s ease;
}
.tk-nav-item.is-open > .tk-nav-trigger::after { transform: translateY(1px) rotate(-135deg); }

/* Dropdown-Panel */
.tk-nav-item.is-open > .tk-dropdown,
.tk-nav-item:focus-within > .tk-dropdown { display: flex !important; }
@media (hover: hover) and (min-width: 1025px) {
	.tk-nav-item:hover > .tk-dropdown { display: flex !important; animation: tkDrop .25s ease; }
}
@keyframes tkDrop { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* Dropdown-Links: gelbe Linie gleitet beim Überfahren herein */
.tk-dropdown-link > a { display: inline-flex; align-items: center; white-space: nowrap; transition: color .2s ease; }
.tk-dropdown-link > a::before {
	content: "";
	display: inline-block;
	width: 0;
	height: 2px;
	margin-right: 0;
	background: #FFBE40;
	transition: width .3s ease, margin-right .3s ease;
}
.tk-dropdown-link > a:hover::before,
.tk-dropdown-link > a:focus-visible::before,
.tk-dropdown-link > a[aria-current="page"]::before { width: 15px; margin-right: 10px; }
.tk-dropdown-link > a[aria-current="page"],
.tk-dropdown-link > a:hover { color: #FFBE40; }
.tk-dropdown a:focus-visible { outline: 2px solid #FFBE40; outline-offset: 3px; }

/* Links auf dunklen Flächen */
.tk-section-navy a:not([class*="e-button"]),
.tk-on-dark a:not([class*="e-button"]) { color: #fff; }

/* Burger-Icon (Tablet/Mobil) */
.tk-burger {
	font-size: 0 !important;
	width: 48px;
	height: 48px;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: var(--tk-navy, #204E51) !important;
	position: relative;
	cursor: pointer;
}
.tk-burger::before,
.tk-burger::after {
	content: "";
	position: absolute;
	left: 14px;
	right: 14px;
	height: 2px;
	background: #fff;
	transition: transform .25s ease, box-shadow .25s ease;
}
.tk-burger::before { top: 17px; box-shadow: 0 6px 0 #fff; }
.tk-burger::after { top: 29px; }
.tk-header.is-open .tk-burger::before { top: 23px; transform: rotate(45deg); box-shadow: none; }
.tk-header.is-open .tk-burger::after { top: 23px; transform: rotate(-45deg); }
.tk-burger:focus-visible,
.tk-header .tk-nav a:focus-visible,
.tk-footer a:focus-visible { outline: 2px solid #FFBE40; outline-offset: 3px; }

/* Mobil-Menü: Vollbild unter dem Header */
.tk-header.is-open .tk-nav {
	display: flex !important;
	position: fixed;
	left: 0;
	right: 0;
	top: var(--tk-header-h, 80px);
	bottom: 0;
	flex-direction: column;
	align-items: stretch;
	gap: 0;
	padding: 1rem 1.5rem 2rem;
	background: #fff;
	overflow-y: auto;
	z-index: 60;
}
.tk-header.is-open .tk-nav > .tk-nav-link,
.tk-header.is-open .tk-nav-trigger {
	width: 100%;
	padding: 1rem 0 !important;
	box-shadow: inset 0 -1px 0 #C9DCDD;
	justify-content: space-between;
}
.tk-header.is-open .tk-nav > .tk-nav-link::before,
.tk-header.is-open .tk-nav-item::before { display: none; }
.tk-header.is-open .tk-nav-item { width: 100%; }
.tk-header.is-open .tk-dropdown {
	position: static;
	min-width: 0;
	margin: .5rem 0 1rem;
	box-shadow: none;
	animation: none;
}
.tk-header.is-open .tk-nav-item:not(.is-open) > .tk-dropdown { display: none !important; }
body.tk-menu-open { overflow: hidden; }

/* Barrierefreiheit: keine Bewegung, nur ruhige Wasserlinie */
@media (prefers-reduced-motion: reduce) {
	.tkw-canvas,
	.tkw-ripple,
	.tkw-btn-drop,
	.tkw-pipe circle {
		display: none !important;
	}
	.tkw-level {
		transform: scaleY(0.35) !important;
	}
}

/* Lange deutsche Wörter in Überschriften sauber umbrechen (Mobil) */
[data-elementor-type] h1,
[data-elementor-type] h2,
[data-elementor-type] h3 {
	hyphens: auto;
	-webkit-hyphens: auto;
	overflow-wrap: break-word;
}