/*
 * Patinero – Theme-Styles.
 *
 * Maße und Positionen stammen aus dem alten Theme (Avoc) und den Slider-Ebenen
 * (Raster 1240 × 868 px). Elementor-Seiten tragen nur CSS-Klassen, das Layout liegt hier.
 * Inhalte, Bilder und Farben bleiben in Elementor bearbeitbar; dort gesetzte Werte haben Vorrang.
 */

:root {
	--pt-red: #e04d34;
	--pt-red-alt: #e04c32;
	--pt-yellow: #f3bd21;
	--pt-ink: #0d0d0d;
	--pt-text: #4d4d4d;
	--pt-grey: #919191;
	--pt-light: #f7f7f7;
	--pt-font-head: "Montserrat", "Helvetica Neue", Arial, sans-serif;
	--pt-font-body: "Titillium Web", "Helvetica Neue", Arial, sans-serif;
	--pt-font-alt: "Open Sans", "Helvetica Neue", Arial, sans-serif;
	--pt-gutter: 40px;
	--pt-wrap: 75%;
	/* Kurven des alten Sliders: Power4.easeInOut (Überschriften), Power3.easeInOut (Aufblenden) */
	--pt-ease-in-out-3: cubic-bezier(.76, 0, .24, 1);
	--pt-ease-out: cubic-bezier(.22, 1, .36, 1);
}

/* ---------- Grundlagen ---------- */

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

body {
	margin: 0;
	background: #fff;
	color: var(--pt-text);
	font: 300 18px/27px var(--pt-font-body);
	letter-spacing: .02em;
	-webkit-font-smoothing: antialiased;
}

a { color: var(--pt-red); text-decoration: none; transition: color .2s; }
a:hover, a:focus-visible { color: var(--pt-ink); }
/* !important: Hellos reset.css setzt für a, button und [tabindex] einen schwarzen Rahmen mit weißem Schein (bis 0,3,0) */
:focus-visible { outline: 2px solid var(--pt-yellow) !important; outline-offset: 2px; box-shadow: none !important; }

h1, h2, h3, h4, h5, h6 { font-family: var(--pt-font-head); color: var(--pt-ink); font-weight: 700; }
strong, b { font-weight: 600; }
img { max-width: 100%; height: auto; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	white-space: nowrap;
}
.skip-link.screen-reader-text:focus {
	clip: auto; clip-path: none;
	width: auto; height: auto;
	z-index: 1000; top: 8px; left: 8px;
	padding: 12px 20px;
	background: #fff; color: var(--pt-ink);
}

/* ---------- Buttons ---------- */

.pt-button,
.pt-btn a.elementor-button {
	display: inline-block;
	padding: 10px 30px;
	border: 1px solid currentColor;
	border-radius: 0;
	background: transparent;
	color: #fff;
	font: 400 12px/14px var(--pt-font-head);
	letter-spacing: 0;
	text-transform: none;
	transition: background-color .2s, border-color .2s, color .2s;
}
.pt-button:hover, .pt-button:focus-visible,
.pt-btn a.elementor-button:hover, .pt-btn a.elementor-button:focus-visible {
	background: var(--pt-yellow);
	border-color: var(--pt-yellow);
	color: #fff;
}
.pt-btn.pt-c-dark a.elementor-button { color: #0a0a0a; }
.pt-btn.pt-c-dark a.elementor-button:hover, .pt-btn.pt-c-dark a.elementor-button:focus-visible { color: #fff; }
.pt-button--solid,
.pt-btn--solid a.elementor-button {
	padding: 7px 20px;
	border-color: var(--pt-red);
	background: var(--pt-red);
	color: #fff;
	font-weight: 700;
	line-height: 12px;
}
.pt-button--solid:hover, .pt-button--solid:focus-visible,
.pt-btn--solid a.elementor-button:hover, .pt-btn--solid a.elementor-button:focus-visible {
	border-color: var(--pt-yellow);
	background: var(--pt-yellow);
	color: var(--pt-red);
}

/* ---------- Header ---------- */

.pt-header {
	position: absolute;
	inset: 0 0 auto;
	z-index: 50;
	padding: var(--pt-gutter) var(--pt-gutter) 0;
}
.admin-bar .pt-header { top: 32px; }
.pt-header__inner { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.pt-logo { display: block; flex: none; }
.pt-logo__img { display: block; width: 166px; height: 40px; }

.pt-nav__list { display: flex; gap: 24px; margin: 0; padding: 0; list-style: none; }
.pt-nav a {
	color: var(--pt-ink);
	font: 700 14px/30px var(--pt-font-head);
	letter-spacing: .12em;
	text-transform: uppercase;
}
.pt-header--overlay .pt-nav a { color: #fff; }
.pt-nav a:hover, .pt-nav a:focus-visible,
.pt-nav .current-menu-item > a, .pt-nav .current_page_parent > a,
.pt-header--overlay .pt-nav a:hover, .pt-header--overlay .pt-nav a:focus-visible,
.pt-header--overlay .pt-nav .current-menu-item > a { color: var(--pt-red); }

.pt-nav-toggle {
	display: none;
	position: relative;
	z-index: 60;
	width: 44px; height: 44px;
	margin: -6px -10px 0 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--pt-ink);
	cursor: pointer;
}
.pt-header--overlay .pt-nav-toggle { color: #fff; }
.pt-nav-toggle__bar,
.pt-nav-toggle__bar::before,
.pt-nav-toggle__bar::after {
	position: absolute;
	left: 10px;
	width: 24px; height: 2px;
	background: currentColor;
	transition: transform .25s, opacity .25s;
	content: "";
}
.pt-nav-toggle__bar { top: 21px; }
.pt-nav-toggle__bar::before { left: 0; top: -7px; }
.pt-nav-toggle__bar::after { left: 0; top: 7px; width: 16px; }
/* button.…: Hellos reset.css färbt [type=button]:hover und :focus rosa (0,2,0), auch nach dem Klick */
button.pt-nav-toggle:is(:hover, :focus, :active) { background: transparent; color: var(--pt-ink); }
.pt-header--overlay button.pt-nav-toggle:is(:hover, :focus, :active) { color: #fff; }
.pt-nav-open .pt-nav-toggle,
.pt-nav-open button.pt-nav-toggle:is(:hover, :focus, :active) { color: var(--pt-ink); }
.pt-nav-open .pt-nav-toggle__bar { background: transparent; }
.pt-nav-open .pt-nav-toggle__bar::before { transform: translateY(7px) rotate(45deg); }
.pt-nav-open .pt-nav-toggle__bar::after { width: 24px; transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 1024px) {
	:root { --pt-gutter: 24px; }
	.pt-nav-toggle { display: block; }
	.pt-nav {
		position: fixed;
		inset: 0;
		z-index: 55;
		display: flex;
		align-items: center;
		justify-content: center;
		background: #fff;
		opacity: 0;
		visibility: hidden;
		transition: opacity .25s, visibility 0s .25s;
	}
	.pt-nav-open .pt-nav { opacity: 1; visibility: visible; transition: opacity .25s; }
	.pt-nav-open { overflow: hidden; }
	.pt-nav__list { flex-direction: column; align-items: center; gap: 16px; }
	.pt-nav a, .pt-header--overlay .pt-nav a { color: var(--pt-ink); font-size: 20px; line-height: 40px; }
	.pt-header--overlay .pt-nav .current-menu-item > a { color: var(--pt-red); }
}

/* ---------- Footer ---------- */

.pt-footer { background: var(--pt-light); color: var(--pt-text); font-size: 13px; line-height: 23px; }
.pt-footer__inner {
	display: flex;
	justify-content: space-between;
	gap: 40px;
	width: var(--pt-wrap);
	margin: 0 auto;
	padding: 120px 0;
}
/* Abstand als Innenabstand der Links (sichtbar 24 px), so sind die Tippflächen mindestens 44 px groß; das schmale f ergänzt ::before */
.pt-footer__social { display: flex; margin: -6px 0 -6px -12px; padding: 0; list-style: none; }
.pt-footer__social a { position: relative; display: block; padding: 6px 12px; color: var(--pt-ink); }
.pt-footer__social li:first-child a::before { position: absolute; inset: 0 0 0 -8px; content: ""; }
.pt-footer__social a:hover, .pt-footer__social a:focus-visible { color: var(--pt-red); }
.pt-footer__social svg { display: block; }
.pt-footer__latest { text-align: right; }
.pt-footer__title {
	margin: 0 0 15px;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: .08em;
}
.pt-footer__latest ul { margin: 0; padding: 0; list-style: none; }
.pt-footer__latest li { padding: 5px 0; font-size: 12px; line-height: 21px; }
.pt-footer__latest a { display: block; font-size: 14px; font-weight: 600; }
.pt-footer__latest time { font-style: italic; }
.pt-footer__legal {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px 24px;
	width: var(--pt-wrap);
	margin: 0 auto;
	padding: 20px 0 32px;
	border-top: 1px solid #e6e6e6;
	font-size: 12px;
	line-height: 20px;
}
.pt-footer__legal-list { display: flex; flex-wrap: wrap; gap: 0 24px; margin: 0; padding: 0; list-style: none; }
.pt-footer__legal-list a { color: var(--pt-text); }
.pt-footer__legal-list a:hover, .pt-footer__legal-list a:focus-visible { color: var(--pt-red); }

@media (max-width: 767px) {
	:root { --pt-wrap: calc(100% - 48px); }
	.pt-footer__inner { flex-direction: column; padding: 64px 0; }
	.pt-footer__latest { text-align: left; }
}

/* ---------- Magazin ---------- */

.pt-magazine { width: var(--pt-wrap); margin: 0 auto; padding: 160px 0 40px; }
.pt-magazine__header { margin-bottom: 60px; }
.pt-magazine__title { margin: 0; font-size: 34px; line-height: 44px; letter-spacing: .08em; }
.pt-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 80px; align-items: start; }
.pt-card__media { display: block; }
.pt-card__media img { display: block; width: 100%; height: auto; aspect-ratio: 800 / 517; object-fit: cover; }
.pt-card__body { position: relative; top: -18px; padding: 0 40px; }
.pt-card__date {
	display: inline-block;
	padding: 8px 20px;
	background: var(--pt-ink);
	color: #fff;
	font: 400 13px/20px var(--pt-font-head);
	letter-spacing: .04em;
}
.pt-card__title { margin: 15px 0 0; font-size: 20px; line-height: 26px; letter-spacing: .08em; }
.pt-card__title a { color: var(--pt-ink); }
.pt-card__title a:hover, .pt-card__title a:focus-visible { color: var(--pt-red); }
.pt-card__excerpt p { margin: 20px 0 0; }

.pt-magazine .navigation.pagination { margin: 40px 0 80px; text-align: center; }
.pt-magazine .nav-links { display: flex; justify-content: center; gap: 24px; }
.pt-magazine .page-numbers {
	color: var(--pt-ink);
	font: 700 13px/20px var(--pt-font-head);
	letter-spacing: .12em;
	text-transform: uppercase;
}
.pt-magazine .page-numbers.current { color: var(--pt-red); }

@media (max-width: 767px) {
	.pt-magazine { padding-top: 120px; }
	.pt-grid { grid-template-columns: 1fr; gap: 48px; }
	.pt-card__body { padding: 0 20px; }
}

/* ---------- Beitrag ---------- */

.pt-post-hero {
	position: relative;
	height: 600px;
	background: #ccc center / cover no-repeat;
}
.pt-post-hero__scroll {
	position: absolute;
	bottom: 30px;
	left: 50%;
	width: 200px;
	margin-left: -100px;
	color: #fff;
	font: 700 12px/20px var(--pt-font-head);
	letter-spacing: .12em;
	text-align: center;
	text-transform: uppercase;
}
.pt-post-hero__scroll::after {
	display: block;
	width: 8px; height: 8px;
	margin: 2px auto 0;
	border: solid currentColor;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
	content: "";
}
.pt-post-hero__scroll:hover, .pt-post-hero__scroll:focus-visible { color: var(--pt-yellow); }

.pt-single { padding: 200px 0 0; }
.pt-single--hero { padding-top: 160px; }
.pt-single__header { padding: 0 var(--pt-gutter) 120px; text-align: center; }
.pt-single__date { display: block; color: var(--pt-ink); font: 400 16px/20px var(--pt-font-head); letter-spacing: .04em; }
.pt-single__title { margin: 10px 0 0; font-size: 34px; line-height: 44px; letter-spacing: .08em; }

.pt-single__content,
.pt-page__content { max-width: 780px; margin: 0 auto; padding: 0 var(--pt-gutter); box-sizing: content-box; }
.pt-single__content > :first-child { margin-top: 0; }
.pt-single__content h1 { margin: 0; font-size: 70px; line-height: 91px; letter-spacing: -.02em; }
.pt-single__content h2 { margin: 10px 0 0; font-size: 26px; font-weight: 400; line-height: 33px; letter-spacing: -.02em; }
.pt-single__content h3 { margin: 30px 0 0; font-size: 22px; line-height: 30px; }
.pt-single__content p { margin: 20px 0 0; }
.pt-single__content img { display: block; height: auto; }
.pt-single__content table { width: 100%; border-collapse: collapse; }
.pt-single__content td { vertical-align: middle; }
.pt-spacer { height: 20px; }

.pt-single__nav {
	display: flex;
	justify-content: center;
	gap: 55px;
	margin: 120px 0;
	padding: 0 var(--pt-gutter);
	font: 700 13px/20px var(--pt-font-head);
	letter-spacing: .12em;
	text-transform: uppercase;
}
.pt-single__nav a { color: var(--pt-ink); }
.pt-single__nav a:hover, .pt-single__nav a:focus-visible { color: var(--pt-red); }
.pt-single__nav .is-inactive { color: #bbb; }

@media (max-width: 767px) {
	.pt-post-hero { height: 70vh; min-height: 360px; }
	.pt-single { padding-top: 140px; }
	.pt-single--hero { padding-top: 80px; }
	.pt-single__header { padding-bottom: 60px; }
	.pt-single__title { font-size: 26px; line-height: 34px; }
	.pt-single__content h1 { font-size: 40px; line-height: 48px; }
	.pt-single__content h2 { font-size: 21px; line-height: 28px; }
	.pt-single__nav { flex-direction: column; align-items: center; gap: 16px; margin: 80px 0; }
}

/* ---------- Seiten ohne Elementor (Impressum, Datenschutz, 404) ---------- */

.pt-page { padding: 200px 0 120px; }
.pt-page__header { padding: 0 var(--pt-gutter) 60px; text-align: center; }
.pt-page__title { margin: 0; font-size: 34px; line-height: 44px; letter-spacing: .08em; }
.pt-page__content h2 { margin: 40px 0 0; font-size: 22px; line-height: 30px; }
.pt-page__content h3 { margin: 30px 0 0; font-size: 18px; line-height: 26px; }
.pt-page__content p, .pt-page__content ul, .pt-page__content ol { margin: 16px 0 0; }
.pt-page--elementor { padding: 0; }
.pt-page--elementor .pt-page__content { max-width: none; padding: 0; }

@media (max-width: 767px) {
	.pt-page { padding: 140px 0 80px; }
	.pt-page__title { font-size: 26px; line-height: 34px; }
}

/* ---------- Elementor-Grundgerüst ---------- */

.pt-hero.e-con, .pt-stage.e-con, .pt-canvas.e-con, .pt-hero__slide.e-con, .pt-hero__content.e-con {
	--padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px;
	--gap: 0px; --row-gap: 0px; --column-gap: 0px;
}
.pt-canvas p, .pt-hero p { margin: 0; }
.pt-canvas p + p, .pt-hero p + p { margin-top: 1em; }
.pt-canvas .elementor-heading-title, .pt-hero .elementor-heading-title {
	font-family: var(--pt-font-head);
	font-weight: 700;
	letter-spacing: 0;
}
.pt-canvas .elementor-widget-image img { display: block; width: 100%; height: auto; }
.pt-canvas .elementor-widget-image a { display: block; }

/* Text-Typen der Startseite */
.pt-h40 .elementor-heading-title { color: #000; font-size: 40px; line-height: 50px; }
.pt-h40t .elementor-heading-title { font-size: 40px; line-height: 40px; }
.pt-h80 .elementor-heading-title { color: #fff; font-size: 80px; line-height: 80px; }
.pt-copy { color: #000; font: 400 18px/24px var(--pt-font-body); letter-spacing: 0; }
.pt-copy--en { color: var(--pt-grey); }
.pt-copy--alt { color: #fff; font-family: var(--pt-font-alt); line-height: 25px; }
.pt-copy--alt.pt-copy--en { color: rgba(255, 255, 255, .67); }
.pt-copy a { color: inherit; }
.pt-copy a:hover, .pt-copy a:focus-visible { color: var(--pt-red); }

/* Farb-Varianten (Überschriften, Texte, Buttons); stärker als die Grundfarben der Abschnitte */
.elementor-element.pt-c-red .elementor-heading-title, .elementor-element.pt-c-red.elementor-widget-text-editor { color: var(--pt-red); }
.elementor-element.pt-c-red-alt .elementor-heading-title { color: var(--pt-red-alt); }
.elementor-element.pt-c-yellow .elementor-heading-title { color: var(--pt-yellow); }
.elementor-element.pt-c-light .elementor-heading-title { color: #f2f2f2; }
.elementor-element.pt-c-dark.elementor-widget-text-editor { color: #0a0a0a; }
.elementor-element.pt-c-white .elementor-heading-title, .elementor-element.pt-c-white.elementor-widget-text-editor { color: #fff; }

/* ---------- Startseiten-Hero (Slider) ---------- */

.pt-hero.e-con {
	position: relative;
	display: block;
	height: 100vh;
	min-height: 640px;
	overflow: hidden;
	background: #1a1a1a;
}
.pt-hero__slide.e-con {
	position: absolute;
	inset: 0;
	display: block;
	opacity: 0;
	visibility: hidden;
	transition: opacity 1s ease, visibility 0s 1s;
	background-position: center center;
	background-size: cover;
}
.pt-hero__slide.e-con.is-active,
.pt-hero:not(.pt-hero--js) > .pt-hero__slide.e-con:first-child {
	z-index: 1;
	opacity: 1;
	visibility: visible;
	transition: opacity 1s ease;
}
.pt-hero__content.e-con {
	position: absolute;
	top: calc(50% - 45px);
	left: max(32px, calc(50% - 534px));
	display: block;
	width: min(742px, calc(100% - 64px));
}
.pt-hero__title .elementor-heading-title { color: #fff; font-size: 80px; line-height: 80px; }
.pt-hero__content.e-con > .pt-hero__text { max-width: 490px; }
.pt-hero__text {
	min-height: 116px;
	margin-top: 22px;
	padding-left: 9px;
	color: #fff;
	font: 300 20px/30px var(--pt-font-body);
	letter-spacing: 0;
	box-sizing: border-box;
}
.pt-hero__text.pt-text-regular { font-weight: 400; min-height: 88px; }
.pt-hero__btn { padding-left: 8px; }
.pt-hero .pt-hero__signet {
	position: absolute;
	z-index: 3;
	top: calc(50% - 199px);
	left: max(39px, calc(50% - 527px));
	width: 94px;
}
.pt-hero .pt-hero__signet img { display: block; width: 100%; height: auto; }

.pt-hero__arrow {
	position: absolute;
	z-index: 4;
	top: 50%;
	width: 48px; height: 64px;
	margin-top: -32px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: #fff;
	cursor: pointer;
	opacity: .85;
	transition: opacity .2s;
}
button.pt-hero__arrow:is(:hover, :focus, :active) { background: transparent; color: #fff; opacity: 1; }
.pt-hero__arrow svg { display: block; width: 20px; height: 36px; margin: 0 auto; }
.pt-hero__arrow--prev { left: 20px; }
.pt-hero__arrow--next { right: 20px; }

@media (max-width: 1024px) {
	.pt-hero__title .elementor-heading-title { font-size: 64px; line-height: 64px; }
	.pt-hero__content.e-con { top: auto; bottom: 80px; }
	.pt-hero .pt-hero__signet { top: 120px; left: 32px; width: 74px; }
	.pt-hero__text { min-height: 0; margin-bottom: 26px; }
}
@media (max-width: 767px) {
	.pt-hero.e-con { min-height: 560px; height: 100svh; }
	.pt-hero__title .elementor-heading-title { font-size: 40px; line-height: 42px; }
	.pt-hero__content.e-con { left: 24px; width: calc(100% - 48px); bottom: 56px; }
	.pt-hero__text { margin: 16px 0 22px; padding-left: 2px; font-size: 17px; line-height: 25px; }
	.pt-hero__btn { padding-left: 2px; }
	.pt-hero .pt-hero__signet { top: 100px; left: 24px; width: 56px; }
	.pt-hero__arrow { top: auto; bottom: 12px; margin: 0; width: 40px; height: 40px; }
	.pt-hero__arrow svg { width: 12px; height: 22px; }
	.pt-hero__arrow--prev { left: auto; right: 56px; }
	.pt-hero__arrow--next { right: 12px; }
}

/* Im Elementor-Editor alle Slides untereinander zeigen, damit sie bearbeitbar sind. */
.elementor-editor-active .pt-hero.e-con { height: auto; }
.elementor-editor-active .pt-hero__slide.e-con { position: relative; height: 100vh; min-height: 640px; opacity: 1; visibility: visible; }

/* ---------- Startseiten- und Kontakt-Abschnitte („Bühnen“) ---------- */

.pt-stage.e-con {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 100vh;
	overflow: hidden;
	background-position: center center;
	background-size: cover;
}
.pt-stage--details.e-con { background-color: var(--pt-red-alt); }
.pt-stage--class.e-con { justify-content: flex-end; }

/* Desktop: Ebenen exakt wie im alten Slider-Raster (1240 × 868) */
@media (min-width: 1025px) {
	.pt-canvas.e-con {
		position: relative;
		display: block;
		flex: none;
		width: 1240px;
		max-width: none;
		height: 868px;
		--width: 1240px;
	}
	.pt-canvas.e-con > .elementor-element {
		position: absolute;
		top: var(--y);
		left: var(--x);
		width: var(--w);
		max-width: none;
		margin: 0;
	}
	.pt-stage--class .pt-canvas.e-con { align-self: center; }
}
/* 1025–1239 px: Raster proportional verkleinern (wie der alte Slider) */
@media (min-width: 1025px) and (max-width: 1239px) {
	.pt-canvas.e-con { zoom: .82; }
}

/* Mobil/Tablet: sauber untereinander statt überlappender Ebenen */
@media (max-width: 1024px) {
	.pt-stage.e-con { min-height: 0; padding: 120px 24px 96px; }
	.pt-canvas.e-con {
		display: flex;
		flex-direction: column;
		gap: 24px;
		width: 100%;
		max-width: 680px;
		margin: 0 auto;
	}
	.pt-canvas.e-con > .elementor-element { width: 100%; max-width: 100%; }
	.pt-h40 .elementor-heading-title, .pt-h40t .elementor-heading-title { font-size: 32px; line-height: 38px; }
	.pt-h80 .elementor-heading-title { font-size: 48px; line-height: 50px; }
	.pt-canvas.e-con > .pt-m-small { width: 96px; }
	.pt-canvas.e-con > .pt-m-center { align-self: center; }
	.pt-stage--class.e-con { min-height: 80vh; padding-bottom: 64px; }
	.pt-stage--contact.e-con { padding-top: 140px; }
}

/* Lage im Desktop-Raster: --x, --y, --w. --parallax: Stärke der Scroll-Bewegung wie im alten Slider
   (.05 bis .2, nur Desktop, siehe patinero.js) */

/* Abschnitt „Intro“ */
.pt-intro-title { --x: 93px;  --y: 85px;  --w: 528px; }
.pt-intro-de    { --x: 93px;  --y: 264px; --w: 344px; }
.pt-intro-en    { --x: 93px;  --y: 441px; --w: 341px; }
.pt-intro-img   { --x: 529px; --y: 323px; --w: 649px; --parallax: .1; }

/* Abschnitt „Details“ (rot) */
.pt-details-title { --x: 93px;  --y: 80px;  --w: 760px; }
.pt-details-de    { --x: 93px;  --y: 137px; --w: 573px; }
.pt-details-en    { --x: 93px;  --y: 204px; --w: 573px; }
.pt-details-word  { --x: 77px;  --y: 463px; --w: 1110px; z-index: 0; opacity: .5; }
.pt-details-boat  { --x: 146px; --y: 286px; --w: 1033px; z-index: 1; --parallax: .15; }
.pt-details-specs { --x: 655px; --y: 700px; --w: 478px; z-index: 2; }
.pt-stage--details .elementor-heading-title { color: #fff; }

/* Abschnitt „Aufbau“ (Collage) */
.pt-setup-title { --x: 93px;  --y: 78px;  --w: 528px; }
.pt-setup-de    { --x: 94px;  --y: 264px; --w: 543px; }
.pt-setup-en    { --x: 93px;  --y: 418px; --w: 552px; }
.pt-setup-img1  { --x: 704px; --y: 94px;  --w: 366px; --parallax: .05; }
.pt-setup-img2  { --x: 705px; --y: 350px; --w: 166px; --parallax: .15; }
.pt-setup-img3  { --x: 889px; --y: 348px; --w: 228px; --parallax: .1; }
.pt-setup-img4  { --x: 319px; --y: 635px; --w: 365px; --parallax: .2; }
@media (max-width: 1024px) {
	.pt-stage--setup .pt-canvas.e-con { display: grid; grid-template-columns: 1fr 1fr; }
	.pt-stage--setup .pt-canvas.e-con > .elementor-widget-heading,
	.pt-stage--setup .pt-canvas.e-con > .elementor-widget-text-editor { grid-column: 1 / -1; }
}

/* Abschnitt „Steuern“ (Anluven/Abfallen) */
.pt-steer-luff       { --x: 93px;  --y: 125px; --w: 310px; }
.pt-steer-luff-de    { --x: 93px;  --y: 253px; --w: 323px; }
.pt-steer-luff-en    { --x: 93px;  --y: 484px; --w: 321px; }
.pt-steer-wind       { --x: 595px; --y: 95px;  --w: 96px; }
.pt-steer-illu       { --x: 458px; --y: 175px; --w: 331px; }
.pt-steer-bear       { --x: 842px; --y: 224px; --w: 307px; }
.pt-steer-bear-de    { --x: 843px; --y: 347px; --w: 329px; }
.pt-steer-bear-en    { --x: 844px; --y: 577px; --w: 321px; }
.pt-stage--steer .elementor-heading-title { color: var(--pt-red-alt); }
@media (max-width: 1024px) {
	.pt-canvas.e-con > .pt-steer-illu { width: 260px; align-self: center; }
	.pt-canvas.e-con > .pt-steer-wind { order: -1; width: 96px; align-self: center; }
}

/* Abschnitt „Klasse für sich“ */
.pt-class-logo  { --x: 93px; --y: 339px; --w: 94px; }
.pt-class-title { --x: 93px; --y: 506px; --w: 649px; }

/* Kontakt */
.pt-contact-title   { --x: 93px;  --y: 228px; --w: 529px; }
.pt-contact-de      { --x: 93px;  --y: 354px; --w: 381px; }
.pt-contact-en      { --x: 93px;  --y: 485px; --w: 381px; }
.pt-contact-address { --x: 93px;  --y: 582px; --w: 321px; }
.pt-contact-fb      { --x: 95px;  --y: 713px; --w: 31px; }
.pt-contact-ig      { --x: 140px; --y: 713px; --w: 31px; }
.pt-contact-ig a, .pt-contact-ig svg { display: block; }
.pt-contact-img     { --x: 583px; --y: 51px;  --w: 563px; --parallax: .2; }
.pt-contact-signet  { --x: 518px; --y: 89px;  --w: 94px; z-index: 2; --parallax: .1; }
.pt-contact-address.pt-copy { color: #0a0a0a; }
@media (max-width: 1024px) {
	.pt-canvas.e-con > .pt-contact-fb { width: 31px; }
	/* Neben Facebook statt darunter */
	.pt-canvas.e-con > .pt-contact-ig { width: 31px; margin: -55px 0 0 45px; }
	.pt-canvas.e-con > .pt-contact-signet { display: none; }
}

/* ---------- Einblend-Animationen und Slider-Bewegung ----------
 * Überschriften fahren Buchstabe für Buchstabe 50 px von links ein (Einblenden 0,8 s, Bewegung 1,4 s, um 50 ms
 * versetzt; im Hero Wort für Wort, auch der Text). Texte, Bilder und Buttons blenden in 0,3 s auf.
 * html.pt-js setzt ein Inline-Script im <head>; ohne JavaScript ist alles sofort sichtbar.
 * patinero.js zerlegt die Texte (.pt-split, .pt-u mit --i), setzt .is-in (Scrollen) bzw. .is-shown (Hero),
 * das Parallax (translate) und html.pt-ready. Bei „Bewegung reduzieren“ gibt es keine Animationen.
 */

/* Slider mit JS: Slides liegen übereinander und werden per transform verschoben (patinero.js) */
.pt-hero--js > .pt-hero__slide.e-con { opacity: 1; transition: none; }
.pt-hero--js > .pt-hero__slide.e-con.is-leaving { z-index: 1; visibility: visible; }
.pt-hero__slide.e-con.is-shown { --pt-d: var(--pt-hero-delay, .3s); }

/* Zerlegte Texte: Wörter bleiben zusammen, jede Einheit lässt sich einzeln bewegen */
.pt-split .pt-w { display: inline-block; white-space: nowrap; }
.pt-split .pt-u { display: inline-block; }

@media (prefers-reduced-motion: no-preference) {
	.pt-js body:not(.elementor-editor-active) .pt-split .pt-u {
		opacity: 0;
		transform: translate3d(-50px, 0, 0);
	}
	.pt-js body:not(.elementor-editor-active) .pt-split.is-in .pt-u,
	.pt-js body:not(.elementor-editor-active) .is-shown .pt-split .pt-u {
		opacity: 1;
		transform: none;
		transition: opacity .8s var(--pt-ease-out), transform 1.4s var(--pt-ease-out);
		transition-delay: calc(var(--pt-d, 0s) + var(--i) * 50ms);
	}

	/* Abschnitte, Magazin-Kacheln, Beiträge: alles Übrige blendet beim Hineinscrollen kurz auf */
	.pt-js body:not(.elementor-editor-active) :is(.pt-canvas.e-con > .elementor-element, .pt-card, .pt-single__header, .pt-single__content > *):not(.pt-split) {
		transition: opacity .3s var(--pt-ease-in-out-3);
	}
	.pt-js body:not(.elementor-editor-active) :is(.pt-canvas.e-con > .elementor-element, .pt-card, .pt-single__header, .pt-single__content > *):not(.pt-split, .is-in) {
		opacity: 0;
	}

	/* Hero: Button blendet mit dem Text auf */
	.pt-js body:not(.elementor-editor-active) .pt-hero__content.e-con > .elementor-element:not(.pt-split) {
		opacity: 0;
	}
	.pt-js body:not(.elementor-editor-active) .pt-hero__slide.is-shown .pt-hero__content.e-con > .elementor-element:not(.pt-split) {
		opacity: 1;
		transition: opacity .3s var(--pt-ease-in-out-3) var(--pt-d);
	}

	/* Sicherheitsnetz: Lädt patinero.js nicht, wird nach 3 s alles gezeigt */
	.pt-js:not(.pt-ready) body :is(.pt-canvas.e-con > .elementor-element, .pt-card, .pt-single__header, .pt-single__content > *, .pt-hero__content.e-con > .elementor-element, .pt-split .pt-u) {
		animation: pt-show 0s 3s forwards;
	}
}
@keyframes pt-show {
	to { opacity: 1; transform: none; }
}

/* ---------- Einwilligungs-Banner (Complianz) ---------- */

/* Über die ID: Complianz lädt seine Styles per JavaScript erst nach diesen, und der Button-Reset von Hello
   Elementor (rosa Rahmen, Innenabstand) soll die Pfeile, das X und die Links nicht treffen. */
#cmplz-cookiebanner-container .cmplz-cookiebanner {
	display: flex;
	flex-direction: column;
	gap: 14px;
	box-sizing: border-box;
	width: 400px;
	min-width: 0;
	max-width: calc(100vw - 48px);
	max-height: calc(100vh - 48px);
	overflow-y: auto;
	right: 24px;
	bottom: 24px;
	margin: 0;
	padding: 22px 24px 18px;
	border: 0;
	border-top: 4px solid var(--pt-red);
	border-radius: 0;
	background: #fff;
	box-shadow: 0 12px 40px rgba(13, 13, 13, .3);
	color: var(--pt-text);
	font: 300 15px/22px var(--pt-font-body);
	letter-spacing: .02em;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner:is(.cmplz-hidden, .cmplz-dismissed) { display: none; }
#cmplz-cookiebanner-container .cmplz-divider { display: none; }

#cmplz-cookiebanner-container .cmplz-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
}
#cmplz-cookiebanner-container .cmplz-logo { display: none; }
#cmplz-cookiebanner-container .cmplz-title {
	margin: 0;
	display: block; /* Complianz blendet den Titel auf dem Handy aus */
	color: var(--pt-ink);
	font: 700 17px/22px var(--pt-font-head);
	letter-spacing: 0;
	text-align: left;
}
#cmplz-cookiebanner-container .cmplz-close {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	color: var(--pt-ink);
	cursor: pointer;
	zoom: 1 !important; /* Complianz verkleinert das X auf dem Handy, ebenfalls mit !important */
	transition: color .2s;
}
#cmplz-cookiebanner-container .cmplz-close:hover { color: var(--pt-red); }
#cmplz-cookiebanner-container .cmplz-close svg { width: 14px; height: 14px; }

#cmplz-cookiebanner-container .cmplz-body { width: 100%; max-height: none; overflow: visible; }
#cmplz-cookiebanner-container .cmplz-message {
	width: auto;
	margin: 0;
	color: var(--pt-text);
	font: inherit;
	text-align: left;
}

/* Kategorien */
#cmplz-cookiebanner-container .cmplz-categories { width: auto; margin: 0; }
#cmplz-cookiebanner-container .cmplz-category {
	margin: 12px 0 0;
	border: 1px solid #e4e4e4;
	border-radius: 0;
	background: var(--pt-light);
}
#cmplz-cookiebanner-container .cmplz-category + .cmplz-category { margin-top: 8px; }
#cmplz-cookiebanner-container .cmplz-category .cmplz-category-header {
	display: grid;
	grid-template-columns: 1fr auto 28px;
	align-items: center;
	gap: 10px;
	padding: 8px 8px 8px 14px;
}
#cmplz-cookiebanner-container .cmplz-category .cmplz-category-title {
	color: var(--pt-ink);
	font: 700 13px/18px var(--pt-font-head);
	letter-spacing: 0;
}
#cmplz-cookiebanner-container .cmplz-category .cmplz-always-active {
	color: var(--pt-text);
	font: 400 12px/18px var(--pt-font-body);
	white-space: nowrap;
}
#cmplz-cookiebanner-container .cmplz-category .cmplz-category-toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--pt-ink);
	cursor: pointer;
}
#cmplz-cookiebanner-container .cmplz-category .cmplz-category-toggle:focus { background: transparent; color: var(--pt-ink); }
#cmplz-cookiebanner-container .cmplz-category .cmplz-category-toggle:hover { background: transparent; color: var(--pt-red); }
#cmplz-cookiebanner-container .cmplz-category .cmplz-category-toggle:focus-visible { outline-offset: 0; }
#cmplz-cookiebanner-container .cmplz-category .cmplz-icon { position: static; display: flex; margin: 0; }
#cmplz-cookiebanner-container .cmplz-category .cmplz-icon svg { width: 12px; height: 12px; fill: currentColor; }
#cmplz-cookiebanner-container .cmplz-category .cmplz-description {
	padding: 0 14px 10px;
	color: var(--pt-text);
	font: 300 13px/19px var(--pt-font-body);
}

/* Buttons: Zustimmen und Ablehnen gleich groß und gleich gut erreichbar */
#cmplz-cookiebanner-container .cmplz-buttons {
	display: flex;
	flex-flow: row wrap;
	gap: 8px;
	width: 100%;
	margin: 0;
}
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn {
	flex: 1 1 calc(50% - 4px);
	box-sizing: border-box;
	width: auto;
	min-width: 0;
	height: auto;
	margin: 0;
	padding: 11px 12px;
	border: 1px solid var(--pt-ink);
	border-radius: 0;
	background: #fff;
	color: var(--pt-ink);
	font: 700 13px/16px var(--pt-font-head);
	letter-spacing: 0;
	text-align: center;
	text-decoration: none;
	white-space: normal;
	cursor: pointer;
	transition: background-color .2s, border-color .2s, color .2s;
}
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-accept { border-color: var(--pt-red); background: var(--pt-red); color: #fff; }
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-save-preferences { flex-basis: 100%; }
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-view-preferences {
	flex-basis: 100%;
	padding: 4px;
	border-color: transparent;
	background: transparent;
	font-weight: 400;
	text-decoration: underline;
}
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn:hover,
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn:focus-visible {
	border-color: var(--pt-yellow);
	background: var(--pt-yellow);
	color: var(--pt-ink);
}

/* Links zu den Rechtstexten */
#cmplz-cookiebanner-container .cmplz-links.cmplz-documents { width: 100%; margin: 0; }
#cmplz-cookiebanner-container .cmplz-documents ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 2px 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}
#cmplz-cookiebanner-container .cmplz-documents li { margin: 0; padding: 0; list-style: none; }
#cmplz-cookiebanner-container .cmplz-documents li::before,
#cmplz-cookiebanner-container .cmplz-documents li::marker { content: none; }
#cmplz-cookiebanner-container .cmplz-documents a {
	color: var(--pt-text);
	font: 400 12px/18px var(--pt-font-body);
	text-decoration: underline;
}
#cmplz-cookiebanner-container .cmplz-documents a:hover,
#cmplz-cookiebanner-container .cmplz-documents a:focus-visible { color: var(--pt-red); }

/* Fährt von unten herein und wieder hinaus (.pt-consent-closing setzt patinero.js) */
@media (prefers-reduced-motion: no-preference) {
	#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-show { animation: pt-consent-in .5s var(--pt-ease-out) both; }
	#cmplz-cookiebanner-container .cmplz-cookiebanner.pt-consent-closing {
		display: flex !important;
		pointer-events: none;
		animation: pt-consent-out .4s cubic-bezier(.64, 0, .78, 0) both;
	}
}
@keyframes pt-consent-in {
	from { opacity: 0; translate: 0 calc(100% + 24px); }
	to { opacity: 1; translate: 0 0; }
}
@keyframes pt-consent-out {
	from { opacity: 1; translate: 0 0; }
	to { opacity: 0; translate: 0 calc(100% + 24px); }
}

@media (max-width: 767px) {
	#cmplz-cookiebanner-container .cmplz-cookiebanner {
		width: 100%;
		max-width: 100%;
		max-height: 85vh;
		right: 0;
		left: 0;
		bottom: 0;
		padding: 18px 16px 14px;
	}
}