/* Custom CSS */

#awwwards {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 999;

	width: 90px;
	height: 135px;

	text-indent: -666em;

	background-image: url(../img/root/awwwards_honorable_white.png);
	background-repeat: no-repeat;
	background-size: 90px 135px;

	overflow: hidden;
}

#wpselected {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;

	width: 90px;
	height: 90px;

	text-indent: -666em;

	background-image: url(../img/root/wpselected-badge-left.png);
	background-repeat: no-repeat;
	background-size: 90px 90px;

	overflow: hidden;
}

.ptf-custom--9135 .typed-cursor {
	color: #ee3364;
}

.ptf-custom--0531 {
	position: absolute;
	bottom: 15%;
	left: 130px;

	color: #0b0b0b;
	font-size: 35px;
}

.ptf-custom--9503::after {
	content: '';

	position: absolute;
	top: 50%;
	left: calc(100% + 30px);

	width: 0;
	max-width: 60px;
	height: 1px;

	background-color: #1f0e49;

	transition: width .5s 1s ease-in-out;
}

.ptf-is-page-loaded .ptf-custom--9503::after {
	width: 100%;
}

.ptf-custom--5832 {
	position: relative;
	z-index: 1;

	margin-right: 50px;
}

.ptf-custom--5832::after {
	content: '';

	position: absolute;
	top: -50px;
	right: -50px;
	z-index: -1;

	width: 100%;
	height: 100%;

	border: 10px solid #00bec5;
}

.ptf-custom--5832 {
	position: relative;
	z-index: 1;

	margin-right: 50px;
}

.ptf-custom--5832::after {
	content: '';

	position: absolute;
	top: -50px;
	right: -50px;
	z-index: -1;

	width: 100%;
	height: 100%;

	border: 10px solid #00bec5;
}

.ptf-custom--3103 .ptf-services-box__link {
	background-color: rgba(0,0,0,.25);
}

.ptf-custom--3103 .ptf-highlight {
	background: linear-gradient(to top, transparent 5%, rgba(0,0,0,.25) 5% , rgba(0,0,0,.25) 37%, transparent 37%);
}

.ptf-custom--4111 .ptf-swiper-pagination--style-1 span {
	background-color: #fff;
}

.ptf-custom--4111 .ptf-swiper-button-prev--style-2,
.ptf-custom--4111 .ptf-swiper-button-next--style-2 {
	color: #fff;
}

.ptf-custom--6632 {
	margin-top: -225px;
}

.ptf-custom--9917 .ptf-social-icons a:not(:hover) {
	color: #fff;
}

.ptf-custom--8681 .ptf-countdown h5,
.ptf-custom--8681 .ptf-countdown strong {
	color: #fff;
}

.ptf-custom--9511 .ptf-swiper-pagination--style-1 span {
	background-color: #fff;
}

.ptf-is--homepage-05 .ptf-header--default .ptf-navbar,
.ptf-is--homepage-05 .ptf-header--default .ptf-navbar.ptf-navbar--solid {
	background-color: #191919;
}

.ptf-is--homepage-11 .ptf-navbar {
	padding: 0 35px;
}

.ptf-is--homepage-11 .ptf-navbar .container {
	width: 100%;
}

/* min-width 768px */
@media (min-width: 768px) {
	.ptf-custom--5136 {
		padding-left: 70px;
	}
	.ptf-custom--8620 {
		padding-right: 70px !important;
	}
	.ptf-custom--5317 {
		padding: 0 30px !important;
	}
	.ptf-custom--5171 {
		padding-right: 70px;
	}
	.ptf-custom--7205 {
		margin-top: -100px;
	}
	.ptf-custom--8511 {
		padding-right: 85px;
	}
	.ptf-custom--6525 {
		position: relative;
		z-index: 2;
	}
}

/* max-width 767px */
@media (max-width: 767px) {
	#awwwards,
	#wpselected {
		display: none;
	}
	.ptf-custom--9135 h2 {
		font-size: 28px
	}
	.ptf-custom--1631 {
		font-size: 38px;
	}
}

/* max-width 991px */
@media (max-width: 991px) {
	.ptf-custom--9182 {
		font-size: 48px;
		line-height: 60px;
	}
	.ptf-custom--9182 {
		font-size: 48px;
		line-height: 60px;
	}
}

/* max-width 575px */
@media (max-width: 575px) {
	.ptf-custom-9182 {
		font-size: 38px;
		line-height: 50px;
	}
	.ptf-custom-9182 {
		font-size: 38px;
		line-height: 50px;
	}
	.ptf-custom--0531 {
		bottom: 5%;
	}
}

/* Startseite: Abstand der 3 Boxen zum fixed Footer */
.ptf-is--home-agency .ptf-page--home-agency > section:last-of-type {
	padding-bottom: 30rem;
}

@media (max-width: 991px) {
	.ptf-is--home-agency .ptf-page--home-agency > section:last-of-type {
		padding-bottom: 22rem;
	}
}

@media (max-width: 767px) {
	.ptf-is--home-agency .ptf-page--home-agency > section:last-of-type {
		padding-bottom: 14rem;
	}
}

/* Startseite: style-1 Header beibehalten, Navigation nach rechts */
.ptf-header--style-1 .ptf-navbar-inner {
	display: flex;
	align-items: center;
}

.ptf-header--style-1 .ptf-navbar-logo {
	flex: 0 0 auto;
}

.ptf-header--style-1 .ptf-nav {
	margin-left: auto;
	margin-right: 5rem;
}

@media only screen and (max-width: 991px) {
	.ptf-header--style-1 .ptf-nav {
		margin-right: 0;
	}
}

.gm-home .ptf-custom--3993 {
	position: relative;
	background-image: url(../img/home/about.jpg);
	background-repeat: no-repeat;
	background-size: cover;
}

.gm-home .ptf-custom--3993::after {
	position: absolute;
	z-index: -1;
	top: 0;
	right: 0;
	bottom: 0;
	width: calc(50% - 15.625rem);
	content: '';
	background-color: var(--ptf-color-white);
}

@media only screen and (max-width: 991px) {
	.gm-home .ptf-custom--3993::after {
		width: 100%;
	}
}


/* Social Icons sauber zentrieren */
.gm-socials {
	display: flex;
	gap: 14px;
	align-items: center;
	justify-content: center;
}

.gm-socials .ptf-social-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.gm-socials .ptf-social-icon svg {
	width: 30px;
	height: 30px;
	display: block;
}

/* Eigene SVG-Icons */
.gm-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.gm-icon svg {
	display: block;
	width: 24px;
	height: 24px;
}

/* Slider-Pfeile deutlich größer */
.ptf-swiper-button-prev.gm-icon svg,
.ptf-swiper-button-next.gm-icon svg {
	width: 52px;
	height: 52px;
}

/* Startseite: Burger-Icon weiß */
.gm-home .ptf-offcanvas-menu-icon {
	color: #ffffff;
}

/* Startseite: Burger sicher sichtbar */
.gm-home .ptf-header--style-1 .ptf-offcanvas-menu-icon,
.gm-home .ptf-header--style-1 .ptf-offcanvas-menu-icon svg {
	color: #fff !important;
	stroke: #fff !important;
	fill: none;
}

/* falls der Header im Hero-Zustand über die Navbar-Klasse gesteuert wird */
.gm-home .ptf-navbar--white-text-on-top .ptf-offcanvas-menu-icon,
.gm-home .ptf-navbar--white-text-on-top .ptf-offcanvas-menu-icon svg {
	color: #fff !important;
	stroke: #fff !important;
}

/* Hero-Pfeile auf Startseite deutlich größer */
.ptf-showcase-3 .ptf-swiper-button-prev,
.ptf-showcase-3 .ptf-swiper-button-next {
	width: 72px;
	height: 72px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.ptf-showcase-3 .ptf-swiper-button-prev svg,
.ptf-showcase-3 .ptf-swiper-button-next svg {
	width: 48px !important;
	height: 48px !important;
	display: block;
	stroke: currentColor;
}

/* Startseite: Burger sicher weiß */
.gm-home .ptf-offcanvas-menu-icon.gm-icon,
.gm-home .ptf-offcanvas-menu-icon.gm-icon svg {
	color: #fff !important;
	stroke: #fff !important;
}

.ptf-showcase-3 .ptf-swiper-button-prev,
.ptf-showcase-3 .ptf-swiper-button-next {
	width: 80px;
	height: 80px;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Burger nur mobil anzeigen */
.ptf-offcanvas-menu-icon {
	display: none;
}

@media only screen and (max-width: 991px) {
	.ptf-offcanvas-menu-icon {
		display: inline-flex;
	}
}

/* =====================================
   MOBILE TYPO-OPTIMIERUNG
===================================== */

@media only screen and (max-width: 767px) {

	/* Große Headlines dürfen nicht aus dem Viewport laufen */
	.large-heading,
	.fz-120,
	.fz-90--lg,
	h1.large-heading,
	.ptf-showcase-slide h1 {
		font-size: 2.6rem !important;
		line-height: 1.08 !important;
		word-break: break-word;
		overflow-wrap: anywhere;
		hyphens: auto;
	}

	/* Allgemeine H1/H2 etwas kompakter mobil */
	h1 {
		font-size: 2.4rem;
		line-height: 1.1;
	}

	h2,
	.h1.large-heading {
		font-size: 2rem !important;
		line-height: 1.15 !important;
	}

	h3 {
		font-size: 1.5rem;
		line-height: 1.2;
	}

	/* Fließtexte deutlich angenehmer */
	.fz-30.has-black-color,
	.fz-30,
	.ptf-animated-block p.fz-30 {
		font-size: 1.15rem !important;
		line-height: 1.55 !important;
	}

	.fz-24 {
		font-size: 1.05rem !important;
		line-height: 1.55 !important;
	}

	.fz-20 {
		font-size: 1rem !important;
		line-height: 1.5 !important;
	}

	.fz-18 {
		font-size: 0.98rem !important;
		line-height: 1.55 !important;
	}

	/* Hero-Texte etwas schmaler und sicher im Viewport */
	.ptf-showcase-slide .container {
		padding-left: 1.25rem;
		padding-right: 1.25rem;
	}

	.ptf-showcase-slide p,
	.ptf-showcase-slide h1 {
		max-width: 100% !important;
	}

	/* Sicherheit gegen horizontales Rauslaufen */
	body,
	html {
		overflow-x: hidden;
	}
}

/* =====================================
   MOBILE: mehr Seitenrand
===================================== */

@media only screen and (max-width: 767px) {

	.container,
	.container-fluid {
		padding-left: 26px !important;
		padding-right: 26px !important;
	}

	/* Showcase Hero braucht eigenen Abstand */
	.ptf-showcase-slide .container {
		padding-left: 26px !important;
		padding-right: 26px !important;
	}

	/* Allgemeine Sections */
	.ptf-section {
		padding-left: 0;
		padding-right: 0;
	}
}

/* =====================================
   MOBILE: Burger Abstand vom Rand
===================================== */

@media only screen and (max-width: 991px) {

	.ptf-offcanvas-menu-icon {
		margin-right: 18px;
	}

}

/* =====================================
   MOBILE: globale Seitenränder
===================================== */
@media only screen and (max-width: 767px) {

	.container,
	.container-xxl,
	.container-xl,
	.container-lg,
	.container-md,
	.container-sm,
	.container-fluid {
		padding-left: 28px !important;
		padding-right: 28px !important;
	}

	/* Header innen etwas großzügiger */
	.ptf-navbar-inner {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	/* Logo mobil etwas weiter nach links */
	.ptf-navbar-logo {
		margin-left: -12px;
	}

	/* Hero-Pfeile mobil ausblenden */
	.ptf-showcase-3 .ptf-swiper-button-prev,
	.ptf-showcase-3 .ptf-swiper-button-next {
		display: none !important;
	}
}

/* =====================================
   HERO SCROLL INDICATOR
===================================== */

.gm-scroll-indicator {
	position: absolute;
	left: 50%;
	bottom: 90px;   /* Desktop höher */
	transform: translateX(-50%);
	z-index: 40;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	text-decoration: none;
	color: #fff;
	opacity: 0.95;
	transition: opacity .2s ease, transform .2s ease;
	text-shadow: 0 3px 12px rgba(0,0,0,0.45);   /* Schatten für bessere Lesbarkeit */
}

.gm-scroll-indicator:hover {
	opacity: 1;
	transform: translateX(-50%) translateY(4px);
	color: #fff;
}

.gm-scroll-indicator__text {
	font-size: 13px;
	font-weight: 700;     /* Fett */
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.gm-scroll-indicator__mouse {
	position: relative;
	display: block;
	width: 28px;
	height: 46px;
	border: 2px solid rgba(255,255,255,0.95);
	border-radius: 20px;
	box-sizing: border-box;
	box-shadow: 0 4px 18px rgba(0,0,0,0.45);   /* leichter Glow */
}

.gm-scroll-indicator__wheel {
	position: absolute;
	top: 9px;
	left: 50%;
	width: 4px;
	height: 8px;
	background: #fff;
	border-radius: 4px;
	transform: translateX(-50%);
	animation: gmScrollWheel 1.6s ease-in-out infinite;
}

@keyframes gmScrollWheel {
	0% {
		opacity: 0;
		transform: translateX(-50%) translateY(0);
	}
	30% {
		opacity: 1;
	}
	100% {
		opacity: 0;
		transform: translateX(-50%) translateY(14px);
	}
}

/* Mobile noch höher setzen */
@media only screen and (max-width: 767px) {
	.gm-scroll-indicator {
		bottom: 140px;
		gap: 10px;
	}

	.gm-scroll-indicator__text {
		font-size: 12px;
	}

	.gm-scroll-indicator__mouse {
		width: 24px;
		height: 40px;
	}
}

.ptf-showcase-3 {
	position: relative;
}

/* Startseite: Burger im Hero weiß */
.gm-home .ptf-header--style-1 .ptf-offcanvas-menu-icon.gm-icon,
.gm-home .ptf-header--style-1 .ptf-offcanvas-menu-icon.gm-icon svg {
	color: #fff !important;
	stroke: #fff !important;
}

/* Aber im geöffneten Offcanvas-Menü das X dunkel */
.gm-home .ptf-offcanvas-menu__header .ptf-offcanvas-menu-icon.gm-icon,
.gm-home .ptf-offcanvas-menu__header .ptf-offcanvas-menu-icon.gm-icon svg {
	color: #111 !important;
	stroke: #111 !important;
}

/* FAQ: eigenes Chevron statt Font-Icon */
.ptf-widget-faq .ptf-accordion dt a {
	position: relative;
	display: block;
	padding-right: 28px;
}

.ptf-widget-faq .ptf-accordion dt a::after {
	content: "";
	position: absolute;
	right: 2px;
	top: 50%;
	width: 10px;
	height: 10px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-65%) rotate(45deg);
	transition: transform .2s ease;
}

/* falls das Template beim Öffnen active/is-active setzt */
.ptf-widget-faq .ptf-accordion dt.active a::after,
.ptf-widget-faq .ptf-accordion dt.is-active a::after,
.ptf-widget-faq .ptf-accordion dt.ui-state-active a::after,
.ptf-widget-faq .ptf-accordion dt.open a::after {
	transform: translateY(-35%) rotate(-135deg);
}

/* Startseite: Burger im Sticky dunkel */
.gm-home .ptf-header--sticky .ptf-offcanvas-menu-icon.gm-icon,
.gm-home .ptf-header--sticky .ptf-offcanvas-menu-icon.gm-icon svg,
.gm-home .ptf-navbar--sticky .ptf-offcanvas-menu-icon.gm-icon,
.gm-home .ptf-navbar--sticky .ptf-offcanvas-menu-icon.gm-icon svg {
	color: #111 !important;
	stroke: #111 !important;
}

/* Alte FAQ-Icons komplett deaktivieren */
.ptf-widget-faq .ptf-accordion dt i,
.ptf-widget-faq .ptf-accordion dt::before,
.ptf-widget-faq .ptf-accordion dt a::before {
	display: none !important;
	content: none !important;
	background: none !important;
}

/* Unser Chevron hat Priorität */
.ptf-widget-faq .ptf-accordion dt a::after {
	border-color: #111;
}

/* Startseite: Burger nur im Hero weiß */
.gm-home .ptf-navbar.ptf-navbar--white-text-on-top:not(.ptf-navbar--solid) .ptf-offcanvas-menu-icon.gm-icon,
.gm-home .ptf-navbar.ptf-navbar--white-text-on-top:not(.ptf-navbar--solid) .ptf-offcanvas-menu-icon.gm-icon svg {
	color: #fff !important;
	stroke: #fff !important;
}

/* Startseite: im Sticky / solid Zustand dunkel */
.gm-home .ptf-navbar.ptf-navbar--solid .ptf-offcanvas-menu-icon.gm-icon,
.gm-home .ptf-navbar.ptf-navbar--solid .ptf-offcanvas-menu-icon.gm-icon svg {
	color: #111 !important;
	stroke: #111 !important;
}

/* Offcanvas Close-X im geöffneten Menü immer dunkel */
.gm-home .ptf-offcanvas-menu__header .ptf-offcanvas-menu-icon.gm-icon,
.gm-home .ptf-offcanvas-menu__header .ptf-offcanvas-menu-icon.gm-icon svg {
	color: #111 !important;
	stroke: #111 !important;
}

/* Alte Template-FAQ-Pfeile komplett deaktivieren */
.ptf-widget-faq .ptf-accordion dt::after,
.ptf-widget-faq .ptf-accordion dt.is-open::after,
.ptf-widget-faq .ptf-accordion dt a::before,
.ptf-widget-faq .ptf-accordion dt::before {
	content: none !important;
	display: none !important;
	background: none !important;
	border: none !important;
}

/* Eigenes Chevron */
.ptf-widget-faq .ptf-accordion dt a {
	position: relative;
	display: block;
	padding-right: 28px;
}

.ptf-widget-faq .ptf-accordion dt a::after {
	content: "";
	position: absolute;
	right: 2px;
	top: 50%;
	width: 10px;
	height: 10px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-65%) rotate(45deg);
	transition: transform .2s ease;
}

/* geöffneter Zustand */
.ptf-widget-faq .ptf-accordion dt.is-open a::after {
	transform: translateY(-35%) rotate(-135deg);
}

/* Hero: echtes Bild statt CSS-Background */
.ptf-showcase-image {
	position: absolute;
	inset: 0;
	overflow: hidden;
}

.ptf-showcase-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}