/**
 * Main stylesheet for wenzl-theme - Medical Theme
 *
 * @package wenzl-theme
 * @since 1.0.0
 */

/* ==========================================================================
   Local Fonts - @font-face Declarations
   ========================================================================== */

/* Instrument Sans */
@font-face {
	font-family: 'Instrument Sans';
	src: url('../fonts/InstrumentSans-Regular.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Instrument Sans';
	src: url('../fonts/InstrumentSans-Italic.woff2') format('woff2');
	font-weight: 400;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: 'Instrument Sans';
	src: url('../fonts/InstrumentSans-SemiBold.woff2') format('woff2');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Instrument Sans';
	src: url('../fonts/InstrumentSans-Bold.woff2') format('woff2');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/* Manrope */
@font-face {
	font-family: 'Manrope';
	src: url('../fonts/Manrope-ExtraLight.woff2') format('woff2');
	font-weight: 200;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Manrope';
	src: url('../fonts/Manrope-Light.woff2') format('woff2');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Manrope';
	src: url('../fonts/Manrope-Regular.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Manrope';
	src: url('../fonts/Manrope-Medium.woff2') format('woff2');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Manrope';
	src: url('../fonts/Manrope-SemiBold.woff2') format('woff2');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Manrope';
	src: url('../fonts/Manrope-Bold.woff2') format('woff2');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Manrope';
	src: url('../fonts/Manrope-ExtraBold.woff2') format('woff2');
	font-weight: 800;
	font-style: normal;
	font-display: swap;
}

/* ==========================================================================
   Lenis Smooth Scroll CSS
   ========================================================================== */

html.lenis,
html.lenis body {
	height: auto;
}

.lenis.lenis-smooth {
	scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
	overscroll-behavior: contain;
}

.lenis.lenis-stopped {
	overflow: hidden;
}

.lenis.lenis-smooth iframe {
	pointer-events: none;
}

/* ==========================================================================
   CSS Variables - Medical Theme
   ========================================================================== */

:root {
	--primary-color: #996b5c;
	--h3-clr: #805649;
	--primary-color-rgb: 153, 107, 92;
	--secondary-color: #b8b7b0;
	--mint-color: 154, 223, 181;
	--accent-color: #FFFFFF;
	--text-color: #333333;
	--text-color-light: #666666;
	--background-color: #FFFFFF;
	--background-light: #F5F7FA;
	--border-color: #E0E0E0;
	--link-color: var(--primary-color);
	--link-hover-color: var(--secondary-color);
	--font-family-headings: 'Instrument Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	--font-family-body: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	--container-width: 1380px;
	--spacing-unit: 1rem;
	--border-radius: 30px;
	--border-radius-small: 10px;
	--transition: all 0.3s ease;
}

/* ==========================================================================
   Reset & Base Styles
   ========================================================================== */

* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html {
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	font-family: var(--font-family-body);
	font-size: 16px;
	line-height: 1.6;
	color: var(--text-color);
	background-color: var(--background-color);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

/* ==========================================================================
   Typography
   ========================================================================== */

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-family-headings);
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 var(--spacing-unit) 0;
	color: var(--text-color);
}

h1 { 
	font-size: 140px;
	letter-spacing: -6px;
	line-height: 0.9;
}

h2 { 
	font-size: 3.5rem;
	letter-spacing: -2px;
}

h3 { 
	font-size: 2.5rem;
}

h4 { 
	font-size: 2rem;
}

h5 { 
	font-size: 1.5rem;
}

h6 { 
	font-size: 1.125rem;
	font-weight: 600;
}

p {
	margin: 0 0 var(--spacing-unit) 0;
}

a {
	color: var(--link-color);
	text-decoration: none;
	transition: var(--transition);
}

a:hover,
a:focus {
	color: var(--link-hover-color);
	text-decoration: none;
}

a:focus {
	outline: 2px solid var(--primary-color);
	outline-offset: 2px;
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

/* ==========================================================================
   Layout
   ========================================================================== */

.site {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

#main > section:not(.hero-section):not(.testimonials-slider-section) {
	padding-left: 16px;
	padding-right: 16px;
}

.site-main {
	flex: 1;
}

/* Container utility class */
.container {
	max-width: var(--container-width) ;
	margin-left: auto;
	margin-right: auto;
	padding-left: 1rem;
	padding-right: 1rem;
}

.section {
	padding: calc(var(--spacing-unit) * 4) 0;
}

/* ==========================================================================
   Header - Medical Theme
   ========================================================================== */

.site-header {
	background-color: transparent;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	width: 100%;
	font-family: 'Instrument Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* Header over Hero Section (Front Page) */
.site-header.header-over-hero {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 100;
	background: transparent;
	width: 100%;
}

.header-over-hero .header-main-nav {
	background-color: transparent;
	border-radius: 50px;
	padding: 0;
}

.header-over-hero .header-main-nav-inner {
	padding: calc(var(--spacing-unit) * 0.3) calc(var(--spacing-unit) * 1);
	
	@media screen and (min-width: 1024px) {
		padding-top: 1rem;
	}
}

/* White text for header over hero */
.header-over-hero .primary-menu a {
	color: var(--accent-color) !important;
}

.header-over-hero .primary-menu a:hover,
.header-over-hero .primary-menu a:focus {
	color: var(--accent-color) !important;
	opacity: 0.8;
}

.header-over-hero .primary-menu .current-menu-item > a,
.header-over-hero .primary-menu .current_page_item > a {
	color: var(--accent-color) !important;
}

.header-over-hero .site-logo-link {
	color: var(--accent-color) !important;
}

.header-over-hero .site-logo-text-line1,
.header-over-hero .site-logo-text-line2 {
	color: var(--accent-color) !important;
}


/* Top Bar Section */
.header-top-bar {
	width: 100%;
	background-color: var(--background-color);
	position: relative;
}

.header-top-bar::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(90deg, var(--primary-color) 0%, var(--accent-color) 100%);
	opacity: 0.07;
	z-index: 1;
}

.header-top-bar-inner {
	position: relative;
	z-index: 2;
	width: 97%;
	margin: 0 auto;
	border-bottom: 1px solid rgba(6, 27, 80, 0.1);
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	padding: 1em 0;
}

.header-contact-info {
	width: 75%;
	display: flex;
	flex-direction: row;
	gap: 25px;
	align-items: center;
	flex-wrap: wrap;
}

.header-contact-item {
	display: flex;
	align-items: center;
	gap: 15px;
	font-size: 15px;
	color: var(--secondary-color);
	font-family: var(--font-family-body);
}

.header-contact-item i {
	color: var(--primary-color);
	font-size: 15px;
	width: 15px;
	text-align: center;
}

.header-contact-item .contact-text {
	font-family: var(--font-family-body);
	font-size: 15px;
	line-height: 1.5;
	color: var(--secondary-color);
}

.header-social-icons {
	width: 25%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 0;
}

.social-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border: 1px solid var(--secondary-color);
	border-radius: 7px;
	color: var(--secondary-color);
	font-size: 15px;
	transition: var(--transition);
	margin: 0 2px;
}

.social-icon:hover {
	background-color: var(--primary-color);
	border-color: var(--secondary-color);
	color: var(--secondary-color);
}

/* Main Navigation Section */
.header-main-nav {
	width: 100%;
	background-color: transparent;
	transition: all 0.3s ease;

	@media screen and (min-width: 1024px) {
		padding-top: 0.6rem;
	}
}

.header-main-nav-inner {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	padding: 1em 0;
	gap: 0;
	width: 100%;
	max-width: 100%;
	padding-right: 0;
}

.header-logo-menu-container {
	width: 78%;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: calc(var(--spacing-unit) * 1);
}

@media screen and (max-width: 767px) {
	.header-logo-menu-container {
		justify-content: space-between;
	}
}

.header-logo {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex-shrink: 0;
}

.header-logo .custom-logo {
	max-height: 75px;
	width: auto;
}

.site-logo-link {
	font-size: 1.5rem;
	font-weight: 700;
	font-family: var(--font-family-headings);
	color: var(--primary-color);
	text-decoration: none;
	display: flex;
	align-items: center;
	gap: calc(var(--spacing-unit) * 1);
}

.site-logo-link:hover {
	color: var(--secondary-color);
}

.site-logo-image {
	height: 70px;
	object-fit: contain;
	flex-shrink: 0;

	@media screen and (max-width: 767px) {
		height: 50px;
	}
}

.site-logo-text {
	display: flex;
	flex-direction: column;
	line-height: 1.2;
}

.site-logo-text-line1 {
	display: block;
	font-size: 0.875rem;
	font-weight: 400;
	text-transform: lowercase;
	line-height: 1.3;
}

.site-logo-text-line2 {
	display: block;
	font-size: 1.125rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin-top: 2px;
}

.main-navigation {
	width: 85%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	position: relative;
}

.site-branding {
	flex: 1;
	min-width: 200px;
}

.site-title {
	margin: 0;
	font-size: 1.75rem;
	font-weight: 700;
	font-family: var(--font-family-headings);
}

.site-title a {
	color: var(--primary-color);
	text-decoration: none;
}

.site-title a:hover {
	color: var(--secondary-color);
	text-decoration: none;
}

.site-description {
	margin: 0.25rem 0 0 0;
	font-size: 0.875rem;
	color: var(--text-color-light);
}

.custom-logo-link {
	display: inline-block;
}

.custom-logo {
	max-height: 60px;
	width: auto;
}

.header-action-buttons {
	width: 22%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 0.75rem;
	flex-shrink: 0;
}

/* Common styles for all header icon buttons */
.header-icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	background: rgba(255, 255, 255, 0.3);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: none;
	border-radius: var(--border-radius-small);
	color: white;
	font-size: 1.25rem;
	cursor: pointer;
	transition: var(--transition);
	text-decoration: none;
}

.header-icon-btn:hover,
.header-icon-btn:focus {
	background: rgba(255, 255, 255, 0.4);
	border-color: rgba(255, 255, 255, 0.3);
	opacity: 1;
	transform: scale(0.95);
}

.header-icon-btn i {
	color: white;
	font-weight: 600;
}

.header-icon-btn .search-icon-svg {
	width: 1.25rem;
	height: 1.25rem;
	color: white;
	fill: white;
}

.search-submit-btn .search-icon-svg {
	width: 1.25rem;
	height: 1.25rem;
	color: white;
	fill: white;
	display: block;
	margin: 0 auto;
}

/* Header over hero styles */
.header-over-hero .header-icon-btn {
	border: none;
	color: var(--primary-color);
}

.header-over-hero .header-icon-btn:hover,
.header-over-hero .header-icon-btn:focus {
	background-color: var(--accent-color);
	color: var(--primary-color);
	opacity: 0.9;
}

/* Search Modal */
.search-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9999;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding-top: 10vh;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
	pointer-events: none;
}

.search-modal[aria-hidden="false"] {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.search-modal-overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, 0.75);
	backdrop-filter: blur(5px);
}

.search-modal-content {
	position: relative;
	z-index: 1;
	width: 90%;
	max-width: 600px;
	background-color: var(--accent-color);
	border-radius: var(--border-radius);
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
	transform: translateY(-20px);
	transition: transform 0.3s ease;
}

.search-modal[aria-hidden="false"] .search-modal-content {
	transform: translateY(0);
}

.search-modal-close {
	position: absolute;
	top: 1rem;
	right: 1rem;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: transparent;
	border: none;
	color: var(--primary-color);
	font-size: 1.5rem;
	cursor: pointer;
	border-radius: var(--border-radius-small);
	transition: var(--transition);
	z-index: 2;
}

.search-modal-close:hover,
.search-modal-close:focus {
	background-color: rgba(6, 27, 80, 0.1);
	color: var(--secondary-color);
}

.search-modal-inner {
	padding: 3rem 2rem 2rem;
}

.search-modal-title {
	margin: 0 0 1.5rem 0;
	font-size: 1.75rem;
	font-weight: 700;
	color: var(--primary-color);
	text-align: center;
}

.search-form {
	position: relative;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.search-input {
	flex: 1;
	padding: 1rem 1.25rem;
	font-size: 1rem;
	font-family: var(--font-family-body);
	color: var(--primary-color);
	background-color: #fff;
	border: 2px solid rgba(6, 27, 80, 0.1);
	border-radius: var(--border-radius-small);
	outline: none;
	transition: var(--transition);
}

.search-input:focus {
	border-color: var(--primary-color);
	box-shadow: 0 0 0 3px rgba(6, 27, 80, 0.1);
}

.search-input::placeholder {
	color: rgba(6, 27, 80, 0.5);
}

.search-submit-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	padding: 0;
	background-color: var(--primary-color);
	border: none;
	border-radius: var(--border-radius-small);
	color: white;
	font-size: 1.25rem;
	cursor: pointer;
	transition: var(--transition);
	flex-shrink: 0;
	position: relative;
}

.search-submit-btn svg {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.search-submit-btn:hover,
.search-submit-btn:focus {
	background-color: var(--secondary-color);
	transform: scale(0.95);
}

/* Search Results Page */
.search-results-header {
	padding: 3rem 0 2rem;
	background-color: var(--background-color);
	border-bottom: 1px solid rgba(6, 27, 80, 0.1);
}

.search-results-header .container {
	max-width: var(--container-width);
	margin: 0 auto;
	padding: 0 var(--spacing-unit);
}

.search-results-title {
	font-size: 2rem;
	font-weight: 700;
	color: var(--primary-color);
	margin: 0 0 0.5rem 0;
}

.search-results-count {
	color: var(--text-color-light);
	font-size: 1rem;
	margin: 0;
}

.search-results-content {
	padding: 2rem 0;
}

.search-result-item {
	padding: 2rem 0;
	border-bottom: 1px solid rgba(6, 27, 80, 0.1);
}

.search-result-item:last-child {
	border-bottom: none;
}

.search-result-title {
	font-size: 1.5rem;
	font-weight: 600;
	margin: 0 0 0.75rem 0;
}

.search-result-title a {
	color: var(--primary-color);
	text-decoration: none;
	transition: var(--transition);
}

.search-result-title a:hover {
	color: var(--secondary-color);
}

.search-result-meta {
	font-size: 0.875rem;
	color: var(--text-color-light);
	margin: 0 0 1rem 0;
}

.search-result-excerpt {
	color: var(--text-color);
	line-height: 1.6;
	margin: 0 0 1rem 0;
}

.search-result-link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: var(--primary-color);
	text-decoration: none;
	font-weight: 600;
	font-size: 0.9375rem;
	transition: var(--transition);
}

.search-result-link:hover {
	color: var(--secondary-color);
	gap: 0.75rem;
}

.no-search-results {
	padding: 4rem 2rem;
	text-align: center;
}

.no-search-results-title {
	font-size: 1.75rem;
	font-weight: 700;
	color: var(--primary-color);
	margin: 0 0 1rem 0;
}

.no-search-results-text {
	color: var(--text-color);
	margin: 0 0 2rem 0;
}

.no-search-results-search {
	max-width: 500px;
	margin: 0 auto;
}

/* ==========================================================================
   Navigation - Medical Theme
   ========================================================================== */

.main-navigation {
	position: relative;
}

.menu-toggle {
	display: none;
	background: var(--primary-color);
	border: none;
	padding: 0.75rem 1rem;
	cursor: pointer;
	font-size: 1rem;
	color: var(--accent-color);
	border-radius: var(--border-radius-small);
	transition: var(--transition);
	padding-right: 0 !important;
}

.menu-toggle:hover,
.menu-toggle:focus {
	background-color: var(--secondary-color);
}

.menu-toggle .menu-icon {
	display: inline-block;
	width: 24px;
	height: 2px;
	background-color: var(--accent-color);
	position: relative;
}

.menu-toggle .menu-icon::before,
.menu-toggle .menu-icon::after {
	content: '';
	position: absolute;
	width: 100%;
	height: 2px;
	background-color: var(--accent-color);
	left: 0;
	transition: var(--transition);
}

.menu-toggle .menu-icon::before {
	top: -8px;
}

.menu-toggle .menu-icon::after {
	bottom: -8px;
}

.primary-menu {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 0;
	align-items: center;
	justify-content: center;
}

.primary-menu li {
	margin: 0;
	position: relative;
}

.primary-menu li.menu-item-has-children > a::after {
	content: '▼';
	font-size: 10px;
	margin-left: 5px;
	display: inline-block;
	transition: transform 0.3s ease;
}

.primary-menu li.menu-item-has-children:hover > a::after {
	transform: rotate(180deg);
}

.primary-menu a {
	display: block;
	padding: 0 15px;
	color: #061B50;
	text-decoration: none;
	border-radius: 0;
	transition: var(--transition);
	font-weight: 600;
	font-size: 16px;
	text-transform: uppercase;
	font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	background-color: transparent;
}

.primary-menu a:hover,
.primary-menu a:focus {
	background-color: transparent;
	color: var(--primary-color);
	text-decoration: none;
}

.primary-menu .current-menu-item > a,
.primary-menu .current_page_item > a {
	background-color: transparent;
	color: var(--primary-color);
}

/* Dropdown Submenu Styles */
.primary-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	background-color: var(--accent-color);
	min-width: 200px;
	list-style: none;
	margin: 0;
	padding: calc(var(--spacing-unit) * 0.5) 0;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	border-radius: var(--border-radius-small);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-10px);
	transition: all 0.3s ease;
	z-index: 1000;
}

.primary-menu li:hover > .sub-menu,
.primary-menu li.menu-item-has-children:hover > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.primary-menu .sub-menu li {
	width: 100%;
	margin: 0;
}

.primary-menu .sub-menu a {
	padding: calc(var(--spacing-unit) * 0.75) calc(var(--spacing-unit) * 1.5);
	color: #000000 !important;
	display: block;
	white-space: nowrap;
}

.primary-menu .sub-menu a:hover,
.primary-menu .sub-menu a:focus {
	background-color: var(--background-light);
	color: var(--primary-color);
}

.primary-menu .sub-menu .sub-menu {
	top: 0;
	left: 100%;
	margin-left: calc(var(--spacing-unit) * 0.5);
}

/* Dark text for submenu when header is over hero */
.header-over-hero .primary-menu .sub-menu a {
	color: #000000 !important;
}

.header-over-hero .primary-menu .sub-menu a:hover,
.header-over-hero .primary-menu .sub-menu a:focus {
	color: var(--primary-color);
}

/* ==========================================================================
   Hero Section - Medical Theme
   ========================================================================== */

.hero-section {
	position: relative;
	min-height: 105vh;
	height: 105vh;
	height: 105dvh;
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: url('../leistungen/herowenzlohnekittel.webp');
	background-attachment: fixed;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	border-radius: 0;
	overflow: hidden;
	margin: 0;
}

/* iOS and Mobile: Use scroll instead of fixed for better performance */
@supports (-webkit-touch-callout: none) {
	/* iOS Safari */
	@media screen and (max-width: 767px) {
		.hero-section {
			background-attachment: scroll !important;
		}

		.teaser-banner-section {
			background-attachment: scroll !important;
		}
	}
}



.hero-section::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(90deg, #885545 0%, rgba(6, 27, 80, 0.28) 70%);
	opacity: 1;
	z-index: 1;
}

.hero-content {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: var(--container-width);
	padding: 0 calc(var(--spacing-unit) * 2);
	color: var(--accent-color);
}

.hero-text-wrapper {
	max-width: 43%;
	margin-bottom: 2rem;
}

.hero-badge {
	line-height: 1;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 6px 15px;
	color: rgb(255, 255, 255);
	text-transform: uppercase;
	border-radius: 20px;
	font-size: 0.875rem;
	font-weight: 600;
	font-family: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	margin-bottom: var(--spacing-unit);
	background-color: rgba(255, 255, 255, 0.3);
}

@media screen and (max-width: 767px) {
	.hero-badge {
		font-size: 1rem;
		margin-bottom: calc(var(--spacing-unit) * 2);
	}
}

.hero-google-icon {
	width: 24px;
	height: 24px;
	flex-shrink: 0;
	display: block;
}

.hero-title {
	font-size: 140px;
	font-weight: 700;
	line-height: 0.9;
	letter-spacing: -6px;
	color: var(--accent-color);
	margin-bottom: var(--spacing-unit);
}

.hero-description {
	font-size: 1.125rem;
	line-height: 1.6;
	color: var(--accent-color);
	margin-bottom: calc(var(--spacing-unit) * 2);
	max-width: 600px;
}

@media screen and (max-width: 767px) {
	.hero-description {
		margin-bottom: calc(var(--spacing-unit) * 5);
	}
}

.hero-button {
	display: inline-block;
	padding: 0.85rem 1.5rem;
	background-color: var(--accent-color);
	color: var(--primary-color);
	border: none;
	border-radius: var(--border-radius-small);
	font-family: var(--font-family-body);
	font-size: 18px;
	font-weight: 600;
	cursor: pointer;
	transition: var(--transition);
	text-decoration: none;
}


.hero-button:hover {
	background-color: var(--primary-color);
	color: var(--accent-color);
	transform: scale(0.95);
}

.hero-button-doctolib {
	background-color: #1e8ce1;
	padding: 0.8rem 1.5rem;
}

.hero-button-doctolib:hover {
	background-color: white;
}

.hero-button-doctolib svg {
	display: block;
	height: 28px;
	width: 145px;
}

.hero-button-doctolib svg path {
	fill: white;
}

.hero-button-doctolib:hover svg path {
	fill:  #1084dd;
}

.hero-buttons {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
}

@media screen and (max-width: 767px) {
	.hero-buttons {
		justify-content: center;
	}
}

.hero-button-reversed {
	background-color: var(--primary-color);
	color: var(--accent-color);
	line-height: 28px;
}

.hero-button-reversed:hover {
	background-color: var(--accent-color);
	color: var(--primary-color);
}

.phone-button {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 1rem 2rem;
	background-color: var(--primary-color);
	color: var(--accent-color);
	border: 1px solid var(--primary-color);
	border-radius: var(--border-radius-small);
	font-family: var(--font-family-body);
	font-size: 18px;
	font-weight: 600;
	cursor: pointer;
	transition: var(--transition);
	text-decoration: none;
	margin-left: calc(var(--spacing-unit) * 1);
}

.phone-button:hover {
	background-color: var(--accent-color);
	color: var(--primary-color);
	color: var(--primary-color);
	transform: scale(0.95);
	text-decoration: none;
}

.phone-button i {
	font-size: 18px;
}

/* ==========================================================================
   Teaser Banner Section
   ========================================================================== */

.teaser-banner-section {
	position: relative;
	min-height: 60vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: url('../leistungen/gynecologist-teaserbanner.webp');
	background-attachment: fixed;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	overflow: hidden;
	margin: 0;
}

.teaser-banner-section::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(90deg, rgba(0,0,0, 0.75) 0%, rgba(6, 27, 80, 0.4) 100%);
	opacity: 1;
	z-index: 1;
}

.teaser-banner-content {
	position: relative;
	z-index: 2;
	width: 100%;
	padding: calc(var(--spacing-unit) * 5) 0;

	@media screen and (max-width: 767px) {
		padding: calc(var(--spacing-unit) * 7) 0;
	}
}

.teaser-banner-text-wrapper {
	max-width: 800px;
}

/* SVG Shapes */
.teaser-banner-shape {
	position: absolute;
	left: 0;
	width: 100%;
	height: 18px;
	z-index: 3;
	pointer-events: none;
}

.teaser-banner-shape-top {
	top: 0;
	transform: rotate(180deg);
}

.teaser-banner-shape-bottom {
	bottom: 0;
}

.teaser-banner-shape .elementor-shape-fill {
	fill: #faf8f7;
}

.teaser-banner-title {
	font-size: 72px;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -2px;
	color: var(--accent-color);
	margin-bottom: calc(var(--spacing-unit) * 1.5);
}

.teaser-banner-description {
	font-size: 1.25rem;
	max-width: 600px;
	line-height: 1.6;
	color: var(--accent-color);
	margin-bottom: calc(var(--spacing-unit) * 2);
	opacity: 0.95;
}

/* ==========================================================================
   Features Section - Medical Theme
   ========================================================================== */

/* ==========================================================================
   About Us Section
   ========================================================================== */

/* ==========================================================================
   Services Section
   ========================================================================== */

.services-section {
	padding: calc(var(--spacing-unit) * 6) 0;
	background: linear-gradient(to bottom, #faf8f7 0%, rgb(153 107 92 / 26%) 100%);
	position: relative;
}

.services-section-title {
	font-size: 48px;
	font-weight: 700;
	color: var(--text-color);
	margin-bottom: calc(var(--spacing-unit) * 3);
	text-align: center;
	font-family: var(--font-family-headings);
}

.service-card {
	position: relative;
	border-radius: 28px;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background-color: var(--background-color);
	cursor: pointer;
}

.service-card:hover .service-card-image {
	transform: scale(1.1);
}



.service-card-image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 0.5s ease;
}

.service-card-overlay {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 60%;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.7) 40%, rgba(0, 0, 0, 0) 100%);
	z-index: 1;
}

.service-card-button {
	position: absolute;
	top: 24px;
	right: 24px;
	width: 44px;
	height: 44px;
	background-color: var(--primary-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	z-index: 2;
	transition: transform 0.3s ease;
}

.service-card-button:hover {
	text-decoration: none;
}

.service-card-button i {
	font-size: 14px;
	color: var(--accent-color);
}

.service-card-content {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 24px;
	z-index: 2;
}

.service-card-title {
	font-size: 18px;
	font-weight: 700;
	color: var(--accent-color);
	text-transform: uppercase;
	letter-spacing: 1px;
	margin-bottom: calc(var(--spacing-unit) * 0.75);
	font-family: var(--font-family-headings);
}

.service-card-description {
	font-size: 14px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.85);
	margin: 0;
	font-family: var(--font-family-body);
}

.services-cta-button {
	margin-top: calc(var(--spacing-unit) * 3);
}

.about-us-section {
	padding: calc(var(--spacing-unit) * 4) 0;
	padding-top: 0;
	background: linear-gradient(to bottom, var(--accent-color) 0%, rgba(var(--primary-color-rgb), 0.05) 100%);
}


/* Left Column: Images */
.about-us-images {
	position: relative;
	width: 100%;
}

.about-image-item img {
	box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}

.about-image-item {
	position: relative;
	overflow: hidden;
	border-radius: 10px;
}

.about-image-item img {
	width: 100%;
	height: 500px;
	object-fit: cover;
	display: block;
	border-radius: 10px;
}

.about-icon-badge {
	position: absolute;
	bottom: 90px;
	right: 150px;
	display: flex;
	align-items: center;
	padding: 10px 15px;
	background-color: var(--primary-color);
	border-radius: 8px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	z-index: 10;
}

.about-icon-badge i {
	font-size: 30px;
	color: var(--primary-color);
	display: inline-block;
}

.about-icon-badge span {
	font-size: 1rem;
	color: var(--accent-color);
	font-family: var(--font-family-body);
	font-weight: 600;
}

/* Right Column: Content */
.about-us-content {
	width: 100%;
	margin-left: 40px;
}

.about-us-badge {
	display: inline-block;
	padding: 10px 15px;
	background-color: rgba(var(--primary-color-rgb), 0.25);
	color: var(--primary-color);
	border-radius: 50px;
	font-size: 1rem;
	font-weight: 600;
	margin: 0 0 20px 0;
	font-family: var(--font-family-body);
}

.about-us-title {
	font-size: 2.5rem;
	font-weight: 500;
	margin: 0 0 var(--spacing-unit) 0;
	font-family: var(--font-family-headings);
	line-height: 1.2;
}

.about-us-description {
	margin: 0 0 calc(var(--spacing-unit) * 2) 0;
}

.about-us-description p {
	font-size: 1rem;
	line-height: 1.6;
	color: var(--text-color);
	font-family: var(--font-family-body);
}

.about-stats-row {
	align-items: flex-start;
	margin: 40px 0 0 0;
	animation: fadeInUp 0.8s ease-out;
}

.about-stats-row:nth-child(2) {
	animation-delay: 0.2s;
}

.about-stat-item {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	min-width: 200px;
}

.stat-number {
	display: flex;
	align-items: baseline;
	gap: 2px;
	margin-bottom: 0.5rem;
}

.stat-number-value {
	font-size: 3.5rem;
	font-weight: 500;
	color: var(--primary-color);
	font-family: var(--font-family-headings);
	line-height: 1;

	@media screen and (max-width: 767px) {
		font-size: 3rem;
	}
}

.stat-number-suffix {
	font-size: 3.5rem;
	font-weight: 500;
	color: var(--primary-color);
	font-family: var(--font-family-headings);
	line-height: 1;
	
	@media screen and (max-width: 767px) {
		font-size: 3rem;
	}
}

.stat-super {
	font-size: 2rem;
	font-weight: 700;
	color: var(--primary-color);
	font-family: var(--font-family-headings);
	vertical-align: baseline;
	line-height: 1;
}

.stat-title {
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--text-color);
	margin: 0;
	font-family: var(--font-family-body);
}

.about-stat-description {
	padding: 10px 0 10px 20px;
	border-left: 1px solid #EAEAEA;
	display: flex;
	align-items: center;
}

.about-stat-description p {
	font-size: 1rem;
	line-height: 1.6;
	color: var(--text-color);
	font-family: var(--font-family-body);
	margin: 0;
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(30px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* ==========================================================================
   Features Section
   ========================================================================== */

.features-section {
	padding: calc(var(--spacing-unit) * 3) 0;
	padding-top: 0;
	background-color: transparent;
	margin-top: -170px;
}

.features-grid {
	margin-top: calc(var(--spacing-unit) * -8);
	position: relative;
	z-index: 10;
}

.feature-box {
	background-color: var(--accent-color);
	border-radius: var(--border-radius);
	padding: calc(var(--spacing-unit) * 1) calc(var(--spacing-unit) * 1.2);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
	transition: var(--transition);
}

.feature-box:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15);
}

.feature-box-title {
	font-size: 1.5rem;
	font-weight: 700;
	margin-bottom: calc(var(--spacing-unit) * 0.5);
	color: var(--text-color);
}

.feature-box-description {
	font-size: 0.9375rem;
	color: var(--text-color-light);
	margin-bottom: var(--spacing-unit);
}

.feature-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 60px;
	background-color: var(--secondary-color);
	color: var(--accent-color);
	border-radius: 50%;
	margin-bottom: var(--spacing-unit);
	font-size: 30px;
}

.feature-button {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 0.75rem 1.5rem;
	background-color: var(--primary-color);
	color: var(--accent-color);
	border: none;
	border-radius: var(--border-radius-small);
	font-family: var(--font-family-body);
	font-size: 18px;
	font-weight: 600;
	cursor: pointer;
	transition: var(--transition);
	text-decoration: none;
}

.feature-button:hover {
	background-color: var(--secondary-color);
	transform: scale(0.95);
}

.feature-contact {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 1rem;
}

.feature-contact-label {
	font-size: 1.25rem;
	font-weight: 600;
}

.feature-contact-phone {
	color: var(--primary-color);
	font-weight: 600;
}

.button-icon {
	margin-left: 10px;
}

/* ==========================================================================
   Content Area
   ========================================================================== */

.content-area {
	display: grid;
	grid-template-columns: 1fr;
	gap: calc(var(--spacing-unit) * 2);
}

/* ==========================================================================
   Posts & Pages
   ========================================================================== */

article {
	margin-bottom: calc(var(--spacing-unit) * 2);
	padding-bottom: calc(var(--spacing-unit) * 2);
	border-bottom: 1px solid var(--border-color);
}

article:last-child {
	border-bottom: none;
}

.entry-header {
	margin-bottom: var(--spacing-unit);
}

.entry-title {
	margin-bottom: calc(var(--spacing-unit) * 0.5);
}

.entry-title a {
	color: var(--text-color);
	text-decoration: none;
}

.entry-title a:hover {
	color: var(--primary-color);
	text-decoration: none;
}

.entry-meta {
	font-size: 0.875rem;
	color: var(--text-color-light);
	margin-bottom: var(--spacing-unit);
}

.entry-meta span {
	margin-right: calc(var(--spacing-unit) * 0.5);
}

.post-thumbnail {
	margin-bottom: var(--spacing-unit);
	border-radius: var(--border-radius);
	overflow: hidden;
}

.post-thumbnail img {
	width: 100%;
	height: auto;
}

.entry-content,
.entry-summary {
	margin-bottom: var(--spacing-unit);
}

.entry-content p,
.entry-summary p {
	margin-bottom: var(--spacing-unit);
}

.entry-footer {
	font-size: 0.875rem;
	color: var(--text-color-light);
	margin-top: var(--spacing-unit);
	padding-top: var(--spacing-unit);
	border-top: 1px solid var(--border-color);
}

.entry-footer span {
	margin-right: calc(var(--spacing-unit) * 0.5);
}

.page-links {
	margin: var(--spacing-unit) 0;
}

.page-links a {
	display: inline-block;
	padding: 0.25rem 0.5rem;
	margin: 0 0.25rem;
	border: 1px solid var(--border-color);
	border-radius: var(--border-radius-small);
}

.page-links a:hover {
	background-color: var(--primary-color);
	color: var(--accent-color);
	border-color: var(--primary-color);
	text-decoration: none;
}

/* ==========================================================================
   Sidebar
   ========================================================================== */

.sidebar {
	margin-top: calc(var(--spacing-unit) * 2);
}

.widget {
	margin-bottom: calc(var(--spacing-unit) * 2);
	padding: var(--spacing-unit);
	background-color: var(--background-light);
	border-radius: var(--border-radius);
}

.widget-title {
	font-size: 1.25rem;
	margin-bottom: var(--spacing-unit);
	padding-bottom: calc(var(--spacing-unit) * 0.5);
	border-bottom: 2px solid var(--primary-color);
}

.widget ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.widget li {
	padding: calc(var(--spacing-unit) * 0.5) 0;
	border-bottom: 1px solid var(--border-color);
}

.widget li:last-child {
	border-bottom: none;
}

.widget a {
	color: var(--text-color);
}

.widget a:hover {
	color: var(--primary-color);
}

/* ==========================================================================
   Footer - Medical Theme
   ========================================================================== */

.site-footer {
	background-color: var(--secondary-color);
	color: var(--accent-color);
	padding: calc(var(--spacing-unit) * 3) 0;
	margin-top: calc(var(--spacing-unit) * 4);
}

.site-footer-inner {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: calc(var(--spacing-unit) * 2);
}

.footer-widget {
	margin-bottom: var(--spacing-unit);
}

.footer-widget-title {
	font-size: 1.25rem;
	font-weight: 700;
	margin-bottom: var(--spacing-unit);
	color: var(--accent-color);
}

.footer-widget ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.footer-widget li {
	padding: calc(var(--spacing-unit) * 0.5) 0;
}

.footer-widget a {
	color: var(--accent-color);
	opacity: 0.8;
	transition: var(--transition);
}

.footer-widget a:hover {
	opacity: 1;
	color: var(--accent-color);
}

.footer-menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

.footer-menu li {
	padding: calc(var(--spacing-unit) * 0.5) 0;
}

.footer-menu a {
	color: var(--accent-color);
	opacity: 0.8;
	transition: var(--transition);
}

.footer-menu a:hover {
	opacity: 1;
}

.site-info {
	grid-column: 1 / -1;
	text-align: center;
	font-size: 0.875rem;
	color: var(--accent-color);
	opacity: 0.8;
	padding-top: var(--spacing-unit);
	border-top: 1px solid rgba(255, 255, 255, 0.2);
	margin-top: var(--spacing-unit);
}

.site-info p {
	margin: 0.5rem 0;
}

.site-info a {
	color: var(--accent-color);
}

/* ==========================================================================
   Buttons - Medical Theme
   ========================================================================== */

.button,
.wp-block-button__link,
input[type="submit"],
button[type="submit"] {
	display: inline-block;
	padding: 0.75rem 1.5rem;
	background-color: var(--primary-color);
	color: var(--accent-color);
	border: none;
	border-radius: var(--border-radius-small);
	font-family: var(--font-family-body);
	font-size: 18px;
	font-weight: 600;
	cursor: pointer;
	transition: var(--transition);
	text-decoration: none;
}

.button:hover,
.wp-block-button__link:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
	background-color: var(--secondary-color);
	color: var(--accent-color);
	transform: scale(0.95);
}

/* ==========================================================================
   Utilities
   ========================================================================== */

.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
	word-wrap: normal !important;
}

.skip-link {
	position: absolute;
	top: -40px;
	left: 0;
	background: var(--primary-color);
	color: var(--accent-color);
	padding: 8px 16px;
	text-decoration: none;
	z-index: 999999;
}

.skip-link:focus {
	top: 0;
}

.text-center {
	text-align: center;
}

.text-white {
	color: var(--accent-color);
}

/* Dashicons Support */
.dashicons {
	width: 1em;
	height: 1em;
	font-size: inherit;
}

/* ==========================================================================
   Responsive Design
   ========================================================================== */

@media screen and (min-width: 768px) {
	:root {
		--spacing-unit: 1.25rem;
	}

	h1 { font-size: 100px; }
	h2 { font-size: 3rem; }
	h3 { font-size: 2.25rem; }

	.hero-title {
		font-size: 90px;
	}

	.hero-text-wrapper {
		max-width: 100%;
		text-align: center;
	}

	.teaser-banner-section {
		min-height: 55vh;
	}

	.teaser-banner-title {
		font-size: 56px;
		letter-spacing: -1.5px;
	}

	.teaser-banner-description {
		font-size: 1.125rem;
	}

	.services-section-title {
		font-size: 42px;
	}

	.content-area {
		grid-template-columns: 2fr 1fr;
	}

	.sidebar {
		margin-top: 0;
	}

	.features-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media screen and (min-width: 1024px) {
	:root {
		--spacing-unit: 1.5rem;
	}

	.container {
		padding: 0 calc(var(--spacing-unit) * 2);
	}

	.menu-toggle {
		display: none;
	}

	.primary-menu {
		display: flex;
	}

	.hero-section {
		min-height: 90vh;
		z-index: 1;
	}

	.hero-text-wrapper {
		max-width: 55%;
		text-align: left;
	}

	.about-us-title {
		margin-right: 40px;
	}

	.features-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* Tablet Styles */
@media screen and (max-width: 1023px) {
	.header-top-bar {
		display: none;
	}

	.header-logo-menu-container {
		width: 70%;
	}

	.header-logo {
		width: 35%;
	}

	.main-navigation {
		width: 65%;
	}

	.header-appointment-button {
		width: 30%;
	}

	.about-us-content {
		margin-left: 0;
		width: 100%;
	}

	.about-us-images {
		margin-top: 0;
	}

	.about-image-item img {
		min-height: 350px;
		height: 350px;
	}

	.about-icon-badge {
		bottom: 160px;
		right: 216px;
	}
}

/* Mobile Menu Toggle */
@media screen and (max-width: 767px) {
	h1 { 
		font-size: 75px;
		letter-spacing: -3px;
	}

	.hero-title {
		font-size: 75px;
		letter-spacing: -3px;
	}

	.hero-text-wrapper {
		max-width: 100%;
		text-align: center;
	}

	.header-top-bar {
		display: none;
	}

	.header-logo-menu-container {
		width: 100%;
	}

	.header-logo {
		width: 50%;
	}

	.main-navigation {
		width: auto;
		flex: 0 0 auto;
		margin-right: 0;
		padding-right: 0;
	}

	.header-action-buttons {
		display: none;
	}

	.menu-toggle {
		display: block;
		background: transparent;
		padding: 15px;
		border-radius: 10px;
		margin-right: 0;
		margin-left: auto;
	}

	.menu-toggle:hover {
		background-color: var(--primary-color);
		border-color: var(--secondary-color);
	}

	.menu-toggle .menu-icon,
	.menu-toggle .menu-icon::before,
	.menu-toggle .menu-icon::after {
		background-color: var(--accent-color);
	}

	.primary-menu {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background-color: var(--accent-color);
		border: 1px solid var(--border-color);
		border-radius: var(--border-radius);
		flex-direction: column;
		padding: var(--spacing-unit);
		margin-top: var(--spacing-unit);
		box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
	}

	.primary-menu.toggled {
		display: flex;
	}

	.primary-menu li {
		width: 100%;
	}

	.primary-menu a {
		padding: 0.75rem 1rem;
	}

	/* Mobile dropdown styles */
	.primary-menu .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		background-color: var(--background-light);
		margin-left: calc(var(--spacing-unit) * 1);
		max-height: 0;
		overflow: hidden;
		transition: max-height 0.3s ease;
	}

	.primary-menu .sub-menu a {
		color: #000000 !important;
	}

	.primary-menu .sub-menu a:hover,
	.primary-menu .sub-menu a:focus {
		color: var(--primary-color) !important;
	}

	.primary-menu .sub-menu.submenu-open {
		max-height: 500px;
		padding: calc(var(--spacing-unit) * 0.5) 0;
	}

	.primary-menu .sub-menu .sub-menu {
		position: static;
		margin-left: calc(var(--spacing-unit) * 1);
	}

	.hero-section {
		min-height: 100vh;
		height: 100vh;
	}

	.header-over-hero .header-main-nav {
		margin: calc(var(--spacing-unit) * 1) auto;
		margin-top: 8px;
		max-width: calc(100% - calc(var(--spacing-unit) * 2));
		border-radius: 30px;
	}

	.about-us-grid {
		grid-template-columns: 1fr;
		gap: calc(var(--spacing-unit) * 2);
	}

	.about-us-images {
		order: 2;
	}

	.about-us-content {
		order: 1;
		margin-left: 0;
		margin-top: 0;
	}

	.about-images-grid {
		margin-top: 20px;
		gap: 0;
	}

	.about-image-item {
		margin-top: 40px;
		margin-right: 10px;
	}

	.about-image-item:first-child {
		margin-top: 40px;
		margin-right: 10px;
		margin-left: 0;
	}

	.about-image-item:last-child {
		margin-top: 0;
		margin-left: 10px;
		margin-right: 0;
	}

	.about-icon-badge {
		bottom: 479px;
		right: 35px;
	}

	.about-stats-row {
		flex-direction: column;
	}

	.about-stat-item {
		width: 100%;
		margin-bottom: var(--spacing-unit);
	}

	.about-stat-description {
		width: 100%;
		padding-left: 10px;
		padding-top: var(--spacing-unit);
		padding-bottom: var(--spacing-unit);
		border-left: none;
		border-top: 1px solid #EAEAEA;
	}

	.features-grid {
		grid-template-columns: 1fr;
		margin-top: calc(var(--spacing-unit) * -4);
	}
}

@media screen and (max-width: 480px) {
	.hero-title {
		font-size: 60px;
	}

	h1 {
		font-size: 60px;
	}

	.teaser-banner-section {
		min-height: 50vh;
	}

	.teaser-banner-title {
		font-size: 32px;
		letter-spacing: -1px;
	}

	.teaser-banner-description {
		font-size: 1.125rem;
	}

	.services-section {
		padding: calc(var(--spacing-unit) * 4) 0;
	}

	.services-section-title {
		font-size: 36px;
		margin-bottom: calc(var(--spacing-unit) * 2);
	}

	.service-card {
		margin-bottom: calc(var(--spacing-unit) * 1.5);
	}

	.service-card-button {
		width: 40px;
		height: 40px;
		top: 16px;
		right: 16px;
	}

	.service-card-button i {
		font-size: 12px;
	}

	.service-card-content {
		padding: 20px;
	}

	.service-card-title {
		font-size: 16px;
	}

	.service-card-description {
		font-size: 13px;
	}
}

/* Search Modal Responsive Styles */
@media screen and (max-width: 1023px) {
	.header-action-buttons {
		gap: 0.5rem;
	}

	.header-icon-btn {
		width: 40px;
		height: 40px;
		font-size: 1.125rem;
	}

	.search-modal {
		padding-top: 5vh;
	}

	.search-modal-content {
		width: 95%;
	}

	.search-modal-inner {
		padding: 2.5rem 1.5rem 1.5rem;
	}

	.search-modal-title {
		font-size: 1.5rem;
	}
}

@media screen and (max-width: 767px) {
	.header-action-buttons {
		width: auto;
		gap: 0.5rem;
	}

	.header-icon-btn {
		width: 38px;
		height: 38px;
		font-size: 1rem;
	}

	.search-modal {
		padding-top: 2vh;
	}

	.search-modal-content {
		width: 100%;
		border-radius: var(--border-radius-small) var(--border-radius-small) 0 0;
	}

	.search-modal-inner {
		padding: 2rem 1.25rem 1.25rem;
	}

	.search-modal-title {
		font-size: 1.375rem;
		margin-bottom: 1.25rem;
	}

	.search-input {
		padding: 0.875rem 1rem;
		font-size: 0.9375rem;
	}

	.search-submit-btn {
		width: 45px;
		height: 45px;
		font-size: 1.125rem;
	}

	.search-results-header {
		padding: 2rem 0 1.5rem;
	}

	.search-results-title {
		font-size: 1.5rem;
	}

	.search-results-content {
		padding: 1.5rem 0;
	}

	.search-result-item {
		padding: 1.5rem 0;
	}

	.search-result-title {
		font-size: 1.25rem;
	}
}

@media screen and (max-width: 480px) {
	.header-icon-btn {
		width: 36px;
		height: 36px;
		font-size: 0.9375rem;
	}

	.search-modal-inner {
		padding: 1.75rem 1rem 1rem;
	}

	.search-modal-title {
		font-size: 1.25rem;
		margin-bottom: 1rem;
	}

	.search-results-title {
		font-size: 1.375rem;
	}

	.search-result-title {
		font-size: 1.125rem;
	}
}

/* ==========================================================================
   Testimonials Section
   ========================================================================== */

.testimonials-section {
	padding: calc(var(--spacing-unit) * 6) 0;
}

.testimonials-header {
	margin-bottom: calc(var(--spacing-unit) * 4);
}

.testimonials-title {
	font-size: 2.5rem;
	font-weight: 700;
	color: var(--text-color);
	margin: 0 0 calc(var(--spacing-unit) * 1) 0;
	text-align: center;
}

.testimonials-subtitle {
	font-size: 1.125rem;
	color: var(--text-color-light);
	margin: 0;
	text-align: center;
}

.testimonials-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: calc(var(--spacing-unit) * 2);
	max-width: var(--container-width);
	margin: 0 auto;
}

.testimonials-column {
	overflow: hidden;
	height: 40rem;
	border-radius: var(--border-radius);
	mask-image: linear-gradient(to bottom, transparent, white 20%, white 80%, transparent);
	-webkit-mask-image: linear-gradient(to bottom, transparent, white 20%, white 80%, transparent);
}

.testimonials-column-2 {
	display: none;
	mask-image: linear-gradient(to top, transparent, white 20%, white 80%, transparent);
	-webkit-mask-image: linear-gradient(to top, transparent, white 20%, white 80%, transparent);
}

.testimonials-column-3 {
	display: none;
}

.testimonials-scroll {
	display: flex;
	flex-direction: column;
	gap: calc(var(--spacing-unit) * 1.5);
}

.testimonials-scroll-t2b {
	animation: scroll-top-to-bottom 60s linear infinite;
}

.testimonials-scroll-b2t {
	animation: scroll-bottom-to-top 60s linear infinite;
}

.testimonial-card:hover {
	transform: scale(1.02);
	box-shadow: 0 8px 12px rgba(0, 0, 0, 0.1);
}

.testimonials-column:has(.testimonial-card:hover) .testimonials-scroll {
	animation-play-state: paused;
}

.testimonials-group {
	display: flex;
	flex-direction: column;
	gap: calc(var(--spacing-unit) * 1.5);
}

.testimonial-card {
	background-color: var(--accent-color);
	border: 1px solid rgba(var(--primary-color-rgb), 0.1);
	padding: calc(var(--spacing-unit) * 1.5);
	border-radius: var(--border-radius-small);
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.testimonial-card:hover {
	transform: scale(1.02);
	box-shadow: 0 8px 12px rgba(0, 0, 0, 0.1);
}

.testimonial-header {
	display: flex;
	align-items: center;
	margin-bottom: calc(var(--spacing-unit) * 1);
}

.testimonial-emoji {
	font-size: 2rem;
	margin-right: calc(var(--spacing-unit) * 0.75);
}

.testimonial-author {
	flex: 1;
}

.testimonial-name {
	font-weight: 600;
	color: var(--primary-color);
	margin: 0;
	font-size: 1rem;
}

.testimonial-role {
	font-size: 0.875rem;
	color: var(--text-color-light);
	margin: 0;
}

.testimonial-stars {
	color: var(--primary-color);
	margin-bottom: calc(var(--spacing-unit) * 0.5);
	font-size: 1rem;
	letter-spacing: 2px;
}

.testimonial-text {
	color: var(--text-color);
	font-style: italic;
	line-height: 1.6;
	margin: 0;
	font-size: 0.9375rem;
}

/* Testimonials Animations */
@keyframes scroll-top-to-bottom {
	0% {
		transform: translateY(0);
	}
	100% {
		transform: translateY(-50%);
	}
}

@keyframes scroll-bottom-to-top {
	0% {
		transform: translateY(-50%);
	}
	100% {
		transform: translateY(0);
	}
}

/* Testimonials Responsive */
@media screen and (min-width: 768px) {
	.testimonials-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.testimonials-column-2 {
		display: block;
	}
}

@media screen and (min-width: 1024px) {
	.testimonials-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.testimonials-column-3 {
		display: block;
	}

	.testimonials-title {
		font-size: 3rem;
	}

	.testimonials-subtitle {
		font-size: 1.25rem;
	}
}

@media screen and (max-width: 767px) {
	.testimonials-section {
		padding: calc(var(--spacing-unit) * 4) 0;
	}

	.testimonials-title {
		font-size: 2rem;
	}

	.testimonials-subtitle {
		font-size: 1rem;
	}

	.testimonials-column {
		height: 35rem;
	}

	.testimonials-column-2,
	.testimonials-column-3 {
		display: none;
	}
}

/* ==========================================================================
   Blog Section
   ========================================================================== */

.blog-section {
	padding: calc(var(--spacing-unit) * 6) 0;
	background-color: var(--background-color);
	position: relative;
}

.blog-section::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: transparent;
	background-image: radial-gradient(at center center, var(--primary-color) 0%, transparent 50%);
	opacity: 0.2;
	z-index: 0;
	pointer-events: none;
}

.blog-section .container {
	position: relative;
	z-index: 1;
}

.blog-header {
	margin-bottom: calc(var(--spacing-unit) * 3);
}

.blog-badge {
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--primary-color);
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0 0 calc(var(--spacing-unit) * 0.5) 0;
	opacity: 1;
}

.blog-title {
	font-size: 2.5rem;
	font-weight: 500;
	color: var(--text-color);
	margin: 0 0 calc(var(--spacing-unit) * 0.5) 0;
	text-align: center;
	opacity: 1;
	font-family: var(--font-family-headings);
	line-height: 1.2;
}

.blog-description {
	max-width: 55%;
	margin: 0 auto;
	text-align: center;
}

.blog-description p {
	color: var(--text-color-light);
	font-size: 1rem;
	line-height: 1.6;
	margin: 0;
	opacity: 1;
}

.blog-posts-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: calc(var(--spacing-unit) * 2);
	margin-top: calc(var(--spacing-unit) * 3);
}

.blog-post-card {
	background-color: var(--accent-color);
	border-radius: 15px;
	overflow: hidden;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	display: flex;
	flex-direction: column;
	position: relative;
	z-index: 1;
	opacity: 1;
}

.blog-post-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.blog-post-image {
	width: 100%;
	height: 250px;
	overflow: hidden;
	margin: 0;
	background-color: rgba(var(--primary-color-rgb), 0.1);
}

.blog-post-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
	display: block;
}

.blog-post-card:hover .blog-post-image img {
	transform: scale(1.05);
}

.blog-post-content {
	padding: calc(var(--spacing-unit) * 1.875) calc(var(--spacing-unit) * 1.875) 0;
	display: flex;
	flex-direction: column;
	flex: 1;
	background-color: var(--accent-color);
	opacity: 1;
}

.blog-post-meta {
	display: flex;
	align-items: center;
	gap: calc(var(--spacing-unit) * 1.25);
	margin-bottom: calc(var(--spacing-unit) * 1);
	font-size: 0.9375rem;
	font-weight: 600;
}

.blog-post-author,
.blog-post-date {
	display: flex;
	align-items: center;
	gap: calc(var(--spacing-unit) * 0.375);
	color: var(--text-color);
	opacity: 1;
}

.blog-post-author i,
.blog-post-date i {
	color: var(--primary-color);
	font-size: 0.875rem;
}

.blog-post-title {
	font-size: 1.375rem;
	font-weight: 600;
	line-height: 1.2;
	margin: 0 0 calc(var(--spacing-unit) * 1.25) 0;
	opacity: 1;
}

.blog-post-title a {
	color: var(--primary-color);
	text-decoration: none;
	transition: color 0.3s ease;
	opacity: 1;
}

.blog-post-title a:hover {
	color: var(--text-color);
}

.blog-post-excerpt {
	color: var(--text-color-light);
	font-size: 1rem;
	line-height: 1.4;
	margin: 0 0 calc(var(--spacing-unit) * 1) 0;
	flex: 1;
	opacity: 1;
}

.blog-post-button {
	display: inline-flex;
	align-items: center;
	gap: calc(var(--spacing-unit) * 0.5);
	padding: calc(var(--spacing-unit) * 0.6) calc(var(--spacing-unit) * 1.4);
	background-color: var(--primary-color);
	color: var(--accent-color);
	border-radius: 10px;
	font-size: 0.9375rem;
	font-weight: 600;
	text-decoration: none;
	transition: var(--transition);
	align-self: flex-start;
}

.blog-post-button:hover {
	background-color: var(--secondary-color);
	color: var(--accent-color);
	transform: translateX(5px);
}

.blog-post-button i {
	font-size: 0.9375rem;
	transition: transform 0.3s ease;
}

.blog-post-button:hover i {
	transform: translateX(3px);
}

.no-posts {
	text-align: center;
	color: var(--text-color-light);
	padding: calc(var(--spacing-unit) * 2);
	grid-column: 1 / -1;
}

.blog-cta-button {
	margin-top: calc(var(--spacing-unit) * 1.5);
	background-color: var(--primary-color);
	color: var(--accent-color);
}

.blog-cta-button:hover {
	background-color: var(--accent-color);
	color: var(--primary-color);
}

/* Blog Section Responsive */
@media screen and (max-width: 1023px) {
	.blog-posts-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.blog-description {
		max-width: 100%;
	}
}

@media screen and (max-width: 767px) {
	.blog-section {
		padding: calc(var(--spacing-unit) * 4) 0;
	}

	.blog-title {
		font-size: 2rem;
	}

	.blog-posts-grid {
		grid-template-columns: 1fr;
		gap: calc(var(--spacing-unit) * 1.5);
	}

	.blog-post-image {
		height: 200px;
	}

	.blog-description {
		max-width: 100%;
	}
}

/* ==========================================================================
   404 Error Page
   ========================================================================== */

.error-404 {
	padding: calc(var(--spacing-unit) * 8) 0;
	min-height: 60vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--background-color);
}

.error-404-content {
	max-width: 600px;
	margin: 0 auto;
}

.error-404-title {
	font-size: 8rem;
	font-weight: 700;
	color: var(--primary-color);
	margin: 0 0 calc(var(--spacing-unit) * 1) 0;
	line-height: 1;
}

.error-404-subtitle {
	font-size: 2.5rem;
	font-weight: 700;
	color: var(--text-color);
	margin: 0 0 calc(var(--spacing-unit) * 1) 0;
}

.error-404-description {
	font-size: 1.125rem;
	color: var(--text-color-light);
	margin: 0 0 calc(var(--spacing-unit) * 3) 0;
	line-height: 1.6;
}

.error-404-button {
	margin-top: calc(var(--spacing-unit) * 2);
}

/* ==========================================================================
   Service Detail Page
   ========================================================================== */

.service-detail-page .entry-section-shape {
	left: -35%;
	width: 140%;
	margin-bottom: -2px;
}

.service-detail-page .entry-section-with-image .entry-section-content {
	text-align: left;
	align-items: flex-start;
	justify-content: center;
	min-height: auto;
}

.service-detail-page .entry-section-with-image .entry-section-title {
	text-align: left;
}

.service-detail-page .entry-section-with-image .entry-section-breadcrumb {
	text-align: left;
}

.service-detail-page .entry-section-with-image {
	overflow: visible;
}

.service-detail-page .entry-section-image {
	position: relative;
	z-index: 2;
	margin-bottom: -120px;
	overflow: hidden;
	border-radius: 12px;
	cursor: pointer;
}

.service-detail-page .entry-section-image img {
	width: 100%;
	display: block;
	max-height: 380px;
	border-radius: 12px;
	object-fit: cover;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
	transition: opacity 0.3s ease;
}

.service-detail-page .entry-section-video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 0.3s ease;
	pointer-events: none;
	border-radius: 12px;
	max-height: 380px;
}

.service-detail-page .entry-section-image-hover:hover .entry-section-image-static {
	opacity: 1;
}

.service-detail-page .entry-section-image-hover:hover .entry-section-video {
	opacity: 1;
}

.service-detail-page .entry-section-title {
	font-size: 55px;
	letter-spacing: -3px;
}

.service-detail-page .service-detail-body h1 {
	font-size: 55px;
	letter-spacing: -3px;
}

.service-detail-page .service-detail-body h2 {
	font-size: 40px;
}

.service-detail-page .service-detail-body h3 {
	font-size: 28px;
	color: var(--h3-clr);
	font-weight: 600;
}

/* Service Detail Page Responsive */
@media screen and (max-width: 991px) {
	.service-detail-page .entry-section-title {
		font-size: 28px;
		letter-spacing: -2px;
	}

	.service-detail-page .service-detail-body h1 {
		font-size: 28px;
		letter-spacing: -2px;
	}

	.service-detail-page .service-detail-body h2 {
		font-size: 26px;
	}

	.service-detail-page .service-detail-body h3 {
		font-size: 24px;
	}

	.service-detail-page .entry-section-with-image .entry-section-content {
		text-align: center;
		align-items: center;
		margin-bottom: calc(var(--spacing-unit) * 2);
	}

	.service-detail-page .entry-section-with-image .entry-section-title {
		text-align: center;
	}

	.service-detail-page .entry-section-with-image .entry-section-breadcrumb {
		text-align: center;
	}

	.service-detail-page .entry-section-image {
		margin-bottom: -30px;
	}

	.service-detail-page .entry-section-shape {
		left: 0;
		width: 100%;
	}
}

.service-detail-section {
	padding: calc(var(--spacing-unit) * 4) 0;
	background-color: var(--background-color);
}

.service-detail-content {
	padding-right: calc(var(--spacing-unit) * 3);
}

.service-detail-body {
	color: var(--text-color);
	line-height: 1.8;
}

.service-detail-body h2,
.service-detail-body h3,
.service-detail-body h4 {
	color: var(--primary-color);
	margin-top: calc(var(--spacing-unit) * 1.3);
	margin-bottom: calc(var(--spacing-unit) * 1);
	font-family: var(--font-family-headings);
}

.service-detail-body p {
	margin-bottom: calc(var(--spacing-unit) * 1.5);
}

.service-detail-body ul,
.service-detail-body ol {
	list-style: initial;
	margin-bottom: calc(var(--spacing-unit) * 1.5);
	padding-left: calc(var(--spacing-unit) * 2);
}

.service-detail-body li {
	margin-bottom: calc(var(--spacing-unit) * 0.5);
}

/* Service detail body button styles */
.service-detail-body .btn,
.service-detail-body .btn-primary,
.service-detail-body .btn-secondary,
.service-detail-body a.btn,
.service-detail-body button.btn {
	display: inline-block;
	padding: 1rem 2rem;
	background-color: var(--primary-color);
	color: var(--accent-color);
	border: none;
	border-radius: var(--border-radius-small);
	font-family: var(--font-family-body);
	font-size: 18px;
	font-weight: 600;
	cursor: pointer;
	transition: var(--transition);
	text-decoration: none;
	box-shadow: none;
}

.service-detail-body .btn:hover,
.service-detail-body .btn-primary:hover,
.service-detail-body .btn-secondary:hover,
.service-detail-body a.btn:hover,
.service-detail-body button.btn:hover {
	background-color: var(--accent-color);
	color: var(--primary-color);
	transform: scale(0.95);
	text-decoration: none;
	border: none;
}

/* Alternative white button style (like hero-button) */
.service-detail-body .btn.btn-white,
.service-detail-body .btn-outline-primary {
	background-color: var(--accent-color);
	color: var(--primary-color);
	border: 2px solid var(--primary-color);
}

.service-detail-body .btn.btn-white:hover,
.service-detail-body .btn-outline-primary:hover {
	background-color: var(--primary-color);
	color: var(--accent-color);
	border-color: var(--primary-color);
}

.service-sidebar {
	position: sticky;
	top: calc(var(--spacing-unit) * 2);
	padding: calc(var(--spacing-unit) * 0.5);
	background-color: var(--accent-color);
	border-radius: 12px;
}

.service-sidebar-title {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--primary-color);
	margin: 0 0 calc(var(--spacing-unit) * 1.5) 0;
	font-family: var(--font-family-headings);
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.service-sidebar-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.service-sidebar-item {
	margin-bottom: calc(var(--spacing-unit) * 0.75);
}

.service-sidebar-link {
	display: block;
	color: var(--text-color);
	text-decoration: none;
	font-size: 0.9375rem;
	line-height: 1.5;
	padding: calc(var(--spacing-unit) * 0.5) 0;
	transition: color 0.3s ease;
	border-bottom: 1px solid rgba(var(--primary-color-rgb), 0.1);
}

.service-sidebar-link:hover {
	color: var(--primary-color);
	text-decoration: none;
}

.service-sidebar-empty {
	color: var(--text-color-light);
	font-size: 0.875rem;
	font-style: italic;
}

/* Service Detail Page Responsive */
@media screen and (max-width: 991px) {
	.service-detail-content {
		padding-right: 0;
	}

	.service-sidebar {
		position: relative;
		top: 0;
	}
}

/* 404 Page Responsive */
@media screen and (max-width: 767px) {
	.error-404 {
		padding: calc(var(--spacing-unit) * 6) 0;
	}

	.error-404-title {
		font-size: 6rem;
	}

	.error-404-subtitle {
		font-size: 2rem;
	}

	.error-404-description {
		font-size: 1rem;
	}
}

/* ==========================================================================
   Entry Section (Reusable for all pages)
   ========================================================================== */

.entry-section {
	position: relative;
	min-height: 35vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #d48163;
	background: radial-gradient(circle, rgb(153 107 93) 0%, rgb(126, 81, 71) 100%);
	overflow: hidden;
	padding: calc(var(--spacing-unit) * 4) 0;
	margin-top: 0;
}

/* Entry Section max-height for Praxis and Kontakt pages */
.page-template-page-praxis .entry-section,
.page-template-page-kontakt .entry-section,
.page-template-page-ratgeber .entry-section,
.page-template-page-leistungen .entry-section {
	max-height: 40vh;
}

@media screen and (max-width: 767px) {
	.page-template-page-praxis .entry-section,
	.page-template-page-kontakt .entry-section {
		max-height: 32vh;
	}
}

/* Header over Entry Section (All pages with entry-section) */
.site-header.header-over-entry {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	background: transparent;
	width: 100%;
}

/* White text for header over entry section */
.header-over-entry .primary-menu a {
	color: var(--accent-color) !important;
}

.header-over-entry .primary-menu a:hover,
.header-over-entry .primary-menu a:focus {
	color: var(--accent-color) !important;
	opacity: 0.8;
}

.header-over-entry .primary-menu .current-menu-item > a,
.header-over-entry .primary-menu .current_page_item > a {
	color: var(--accent-color) !important;
}

.header-over-entry .site-logo-link {
	color: var(--accent-color) !important;
}

.header-over-entry .site-logo-text-line1,
.header-over-entry .site-logo-text-line2 {
	color: var(--accent-color) !important;
}

.header-over-entry .header-icon-btn {
	background-color: rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

.header-over-entry .header-icon-btn i,
.header-over-entry .header-icon-btn svg {
	color: var(--accent-color);
	fill: var(--accent-color);
}

.header-over-entry .header-icon-btn:hover {
	background-color: rgba(255, 255, 255, 0.3);
}

.header-over-entry .primary-menu .sub-menu {
	background-color: var(--accent-color) !important;
}

.header-over-entry .primary-menu .sub-menu a {
	color: #000000 !important;
}

.header-over-entry .primary-menu .sub-menu a:hover,
.header-over-entry .primary-menu .sub-menu a:focus {
	color: var(--primary-color) !important;
	background-color: var(--background-light) !important;
}

.entry-section-container {
	max-width: var(--container-width);
	margin: 0 auto;
	padding: 0 var(--spacing-unit);
	padding-left: 0;
	width: 100%;
	position: relative;
	z-index: 1;
}

.entry-section-content {
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	min-height: 35vh;
}

.entry-section-title {
	font-size: 3.5rem;
	font-weight: 700;
	letter-spacing: -3px;
	color: var(--accent-color);
	margin-bottom: 0;
	line-height: 1.2;
}

.entry-section-breadcrumb {
	margin-top: calc(var(--spacing-unit) * 1);
}

.entry-section-breadcrumb p {
	color: var(--accent-color);
	font-size: 1rem;
	margin: 0;
}

.entry-section-breadcrumb a {
	color: var(--accent-color);
	text-decoration: none;
	transition: opacity 0.3s ease;
}

.entry-section-breadcrumb a:hover {
	opacity: 0.8;
}

.entry-section-shape {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 50px;
	z-index: 0;
	overflow: hidden;
}

.entry-section-shape-bottom {
	overflow: visible;
}

.entry-section-shape .elementor-shape-fill {
	fill: var(--accent-color);
}

/* Entry Section Responsive */
@media screen and (max-width: 1023px) {
	.entry-section {
		min-height: 30vh;
		padding: calc(var(--spacing-unit) * 3) 0;
	}

	.entry-section-content {
		min-height: 30vh;
	}

	.entry-section-title {
		font-size: 2.5rem;
	}

	.entry-section-shape {
		height: 72px;
	}
}

@media screen and (max-width: 767px) {
	.entry-section {
		min-height: 25vh;
		padding: calc(var(--spacing-unit) * 2) 0;
		padding-top: 7rem;
	}

	.entry-section-content {
		min-height: 25vh;
	}

	.entry-section-title {
		font-size: 2rem;
	}

	.entry-section-breadcrumb p {
		font-size: 0.875rem;
	}
}

/* ==========================================================================
   Konzepte Page Template
   ========================================================================== */

.service-hero-section {
	position: relative;
	padding: calc(var(--spacing-unit) * 16) 0 calc(var(--spacing-unit) * 10);
	background: linear-gradient(to bottom, rgba(var(--primary-color-rgb), 0.1) 0%, var(--accent-color) 100%);
	overflow: hidden;
	margin-top: -160px;
	z-index: 0;
}

.service-hero-container {
	max-width: var(--container-width);
	margin: 0 auto;
	padding: 0 var(--spacing-unit);
	position: relative;
	z-index: 1;
}

.service-hero-content {
	text-align: center;
	padding-top: calc(var(--spacing-unit) * 16);
}

.service-hero-badge {
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--text-color-light);
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0 0 calc(var(--spacing-unit) * 0.5) 0;
}

.service-hero-title {
	font-size: 3.5rem;
	font-weight: 700;
	color: var(--primary-color);
	margin: 0 0 calc(var(--spacing-unit) * 1.5) 0;
	line-height: 1.2;
}

.service-hero-breadcrumb {
	margin-top: calc(var(--spacing-unit) * 1);
}

.service-hero-breadcrumb p {
	color: var(--primary-color);
	font-size: 1rem;
	margin: 0;
}

.service-hero-shape {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 125%;
	height: 155px;
	transform: translateX(-12.5%);
	z-index: 0;
}

.service-hero-shape-bottom {
	overflow: hidden;
}

.service-hero-shape .elementor-shape-fill {
	fill: var(--accent-color);
}

.services-content-section {
	padding: calc(var(--spacing-unit) * 8.5) 0;
	background-color: var(--accent-color);
	position: relative;
}

.services-header {
	margin-bottom: calc(var(--spacing-unit) * 5);
}

.services-main-title {
	font-size: 2.5rem;
	font-weight: 700;
	color: var(--text-color);
	margin: 0 0 calc(var(--spacing-unit) * 1) 0;
	line-height: 1.3;
}

.services-main-title-focus {
	color: var(--primary-color);
}

.services-subtitle {
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--primary-color);
	margin: 0;
}

.services-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: calc(var(--spacing-unit) * 1.5);
	margin-top: calc(var(--spacing-unit) * 3);
}

.service-item-card {
	background-color: rgba(var(--primary-color-rgb), 0.05);
	border-radius: 20px;
	padding: calc(var(--spacing-unit) * 2.75) calc(var(--spacing-unit) * 3.625);
	box-shadow: 0 0 0 rgba(0, 0, 0, 0.5);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	position: relative;
	overflow: hidden;
}

.service-item-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.service-item-card-gradient {
	background: linear-gradient(135deg, var(--primary-color) 0%, rgba(var(--primary-color-rgb), 0.8) 100%);
}

.service-item-card-gradient .service-item-title,
.service-item-card-gradient .service-item-description {
	color: var(--accent-color);
}

.service-item-icon {
	margin-bottom: calc(var(--spacing-unit) * 0.9375);
	display: flex;
	justify-content: center;
}

.service-icon-wrapper {
	width: 95px;
	height: 95px;
	border-radius: 50%;
	background: linear-gradient(150deg, var(--primary-color) 0%, rgba(var(--primary-color-rgb), 0.8) 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: calc(var(--spacing-unit) * 0.5);
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.service-item-card-gradient .service-icon-wrapper {
	background: linear-gradient(150deg, var(--accent-color) 0%, rgba(255, 255, 255, 0.9) 100%);
}

.service-icon-wrapper i {
	font-size: 2.5rem;
	color: var(--accent-color);
}

.service-item-card-gradient .service-icon-wrapper i {
	color: var(--primary-color);
}

.service-item-content {
	text-align: center;
}

.service-item-title {
	font-size: 1.375rem;
	font-weight: 600;
	color: var(--text-color);
	margin: 0 0 calc(var(--spacing-unit) * 0.4375) 0;
	line-height: 1.2;
}

.service-item-description {
	font-size: 1rem;
	color: var(--text-color-light);
	line-height: 1.4;
	margin: 0 0 calc(var(--spacing-unit) * 1.9375) 0;
}

.service-item-button {
	display: inline-block;
	padding: calc(var(--spacing-unit) * 0.75) calc(var(--spacing-unit) * 3.4375);
	background: linear-gradient(135deg, var(--primary-color) 0%, rgba(var(--primary-color-rgb), 0.8) 100%);
	color: var(--accent-color);
	border-radius: 10px;
	font-size: 0.9375rem;
	font-weight: 600;
	text-decoration: none;
	transition: var(--transition);
	box-shadow: 0 4px 12px rgba(var(--primary-color-rgb), 0.3);
}

.service-item-button:hover {
	box-shadow: 0 4px 12px rgba(var(--primary-color-rgb), 0.5);
	transform: translateY(-2px);
}

.service-item-button-white {
	background: var(--accent-color);
	color: var(--primary-color);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.service-item-button-white:hover {
	background: var(--accent-color);
	color: var(--primary-color);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* Konzepte Page Responsive */
@media screen and (max-width: 1023px) {
	.service-hero-section {
		margin-top: -100px;
		padding: calc(var(--spacing-unit) * 9) 0 calc(var(--spacing-unit) * 5.5);
	}

	.service-hero-content {
		padding-top: calc(var(--spacing-unit) * 9);
	}

	.service-hero-shape {
		height: 72px;
	}

	.services-content-section {
		padding: calc(var(--spacing-unit) * 6) calc(var(--spacing-unit) * 2.5) calc(var(--spacing-unit) * 6.75);
	}

	.services-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: calc(var(--spacing-unit) * 1);
	}

	.service-item-card {
		padding: calc(var(--spacing-unit) * 2.1875) calc(var(--spacing-unit) * 1.875);
	}

	.service-icon-wrapper {
		width: 70px;
		height: 70px;
	}

	.service-icon-wrapper i {
		font-size: 2rem;
	}

	.service-item-button {
		padding: calc(var(--spacing-unit) * 0.5) calc(var(--spacing-unit) * 1.875);
		font-size: 0.875rem;
	}
}

@media screen and (max-width: 767px) {
	.service-hero-section {
		margin-top: -141px;
		padding: calc(var(--spacing-unit) * 11) 0 calc(var(--spacing-unit) * 3.75);
		margin-bottom: calc(var(--spacing-unit) * 3.75);
	}

	.service-hero-content {
		padding-top: calc(var(--spacing-unit) * 11);
	}

	.service-hero-title {
		font-size: 2.5rem;
	}

	.services-content-section {
		padding: calc(var(--spacing-unit) * 4.6875) calc(var(--spacing-unit) * 1.25) calc(var(--spacing-unit) * 5.5);
	}

	.services-main-title {
		font-size: 2rem;
	}

	.services-subtitle {
		font-size: 1.25rem;
	}

	.services-grid {
		grid-template-columns: 1fr;
		gap: calc(var(--spacing-unit) * 1);
	}

	.service-item-card {
		padding: calc(var(--spacing-unit) * 1.5625);
	}

	.service-icon-wrapper {
		width: 70px;
		height: 70px;
	}

	.service-icon-wrapper i {
		font-size: 1.75rem;
	}

	.service-item-title {
		font-size: 1.25rem;
	}

	.service-item-description {
		font-size: 0.9375rem;
	}
}

/* ==========================================================================
   FAQ Accordion Section
   ========================================================================== */

.faq-section {
	padding: calc(var(--spacing-unit) * 6) 0;
	background-color: var(--background-color);
}

.faq-header {
	margin-bottom: calc(var(--spacing-unit) * 1.2);
}

.faq-title {
	font-size: 2.5rem;
	font-weight: 700;
	color: var(--primary-color);
	margin: 0;
	text-align: left;
	font-family: var(--font-family-headings);
	letter-spacing: -1px;
}

.faq-accordion {
	max-width: 900px;
	margin: 0 auto;
}

.faq-item {
	border-bottom: 1px solid var(--border-color);
	margin-bottom: 0;
}

.faq-item:first-child {
	border-top: 1px solid var(--border-color);
}

.faq-question {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: calc(var(--spacing-unit) * 1) calc(var(--spacing-unit) * 1.2);
	background-color: transparent;
	border: none;
	text-align: left;
	cursor: pointer;
	transition: var(--transition);
	font-family: var(--font-family-headings);
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--text-color);
}

.faq-question:hover {
	background-color: var(--background-light);
	color: var(--primary-color);
}

.faq-question span {
	flex: 1;
	padding-right: calc(var(--spacing-unit) * 1);
}

.faq-question i {
	font-size: 1rem;
	color: var(--primary-color);
	transition: transform 0.3s ease;
	flex-shrink: 0;
}

.faq-question[aria-expanded="true"] i {
	transform: rotate(180deg);
}

.faq-answer {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease, padding 0.3s ease;
	padding: 0 calc(var(--spacing-unit) * 2);
}

.faq-question[aria-expanded="true"] + .faq-answer {
	max-height: 500px;
	padding: 0 calc(var(--spacing-unit) * 2) calc(var(--spacing-unit) * 1.5) calc(var(--spacing-unit) * 2);
}

.faq-answer p {
	color: var(--text-color-light);
	line-height: 1.8;
	margin: 0;
	font-family: var(--font-family-body);
	font-size: 1rem;
}

/* FAQ Section Responsive */
@media screen and (max-width: 767px) {
	.faq-section {
		padding: calc(var(--spacing-unit) * 4) 0;
	}

	.faq-title {
		font-size: 2rem;
		text-align: center;
	}

	.faq-question {
		padding: calc(var(--spacing-unit) * 1.25) calc(var(--spacing-unit) * 1.5);
		font-size: 1rem;
	}

	.faq-answer {
		padding-left: calc(var(--spacing-unit) * 1.5);
		padding-right: calc(var(--spacing-unit) * 1.5);
	}

	.faq-question[aria-expanded="true"] + .faq-answer {
		padding-left: calc(var(--spacing-unit) * 1.5);
		padding-right: calc(var(--spacing-unit) * 1.5);
	}
}

/* Footer Animation */
@keyframes float {
	0%, 100% {
		transform: translateY(0px);
	}
	50% {
		transform: translateY(-20px);
	}
}

.animate-float {
	animation: float 6s ease-in-out infinite;
}

/* Mobile Offcanvas Menu */
.mobile-menu-backdrop {
	position: fixed;
	inset: 0;
	z-index: 9998;
	backdrop-filter: blur(2px);
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s ease;
}

.mobile-menu-backdrop[aria-hidden="false"] {
	opacity: 1;
	pointer-events: auto;
}

.mobile-menu-panel {
	position: fixed;
	right: 0;
	top: 0;
	height: 100%;
	width: 320px;
	max-width: 80vw;
	background-color: #FFFFFF;
	box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
	overflow-y: auto;
	z-index: 9999;
	transform: translateX(100%);
	transition: transform 0.3s ease;
}

.mobile-menu-panel[aria-hidden="false"] {
	transform: translateX(0);
}

.mobile-menu-panel-inner {
	padding: 1.5rem;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.mobile-menu-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1.5rem;
}

.mobile-menu-logo {
	flex-shrink: 0;
}

.mobile-menu-logo .site-logo-image {
	height: 48px;
	width: auto;
}

.mobile-menu-close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background-color: #f3f4f6;
	border: none;
	border-radius: 50%;
	cursor: pointer;
	transition: background-color 0.2s ease;
	color: var(--text-color);
}

.mobile-menu-close:hover,
.mobile-menu-close:focus {
	background-color: #e5e7eb;
}

.mobile-menu-nav {
	display: flex;
	flex-direction: column;
	flex: 1;
	overflow-y: auto;
}

.mobile-menu-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.mobile-menu-list li {
	margin: 0;
}

.mobile-menu-list a {
	display: block;
	padding: 0.75rem 0;
	color: var(--primary-color);
	text-decoration: none;
	font-size: 1.125rem;
	font-weight: 500;
	transition: color 0.2s ease;
	font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.mobile-menu-list a:hover,
.mobile-menu-list a:focus {
	color: var(--primary-color);
}

.mobile-menu-list .current-menu-item > a,
.mobile-menu-list .current_page_item > a {
	color: var(--primary-color);
}

.mobile-menu-list .menu-item-has-children > a {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.mobile-menu-list .menu-item-has-children > a::after {
	content: '▼';
	font-size: 10px;
	margin-left: 0.5rem;
	transition: transform 0.3s ease;
	display: inline-block;
}

.mobile-menu-list .menu-item-has-children:has(.sub-menu.submenu-open) > a::after {
	transform: rotate(180deg);
}

.mobile-menu-list .sub-menu {
	display: none;
	list-style: none;
	margin: 0.5rem 0 0 0;
	padding-left: 1rem;
}

.mobile-menu-list .sub-menu.submenu-open {
	display: block;
}

.mobile-menu-list .sub-menu a {
	font-size: 1rem;
	padding: 0.5rem 0;
}

.mobile-menu-footer {
	margin-top: auto;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.mobile-menu-cta-button {
	display: block;
	width: 100%;
	padding: 1rem 1.5rem;
	background-color: var(--primary-color);
	color: white;
	text-align: center;
	text-decoration: none;
	font-size: 1.125rem;
	font-weight: 600;
	border-radius: var(--border-radius-small);
	transition: background-color 0.2s ease, transform 0.2s ease;
	font-family: var(--font-family-body);
}

.mobile-menu-cta-button:hover,
.mobile-menu-cta-button:focus {
	background-color: var(--secondary-color);
	transform: translateY(-2px);
	color: white;
}

/* Hide offcanvas menu on desktop */
@media screen and (min-width: 768px) {
	.mobile-menu-backdrop,
	.mobile-menu-panel {
		display: none !important;
	}
}



/* fix hero section on small height devices*/
@media screen and (max-height: 800px) {
	.hero-section {
		min-height: 125vh;
		height: 125vh;
		height: 125dvh;
	}
}

/* ==========================================================================
   Contact Page Styles
   ========================================================================== */

.contact-section {
	position: relative;
	width: 100%;
	min-height: 100vh;
	background-color: var(--background-color, #ffffff);
	padding-top: calc(var(--spacing-unit) * 2);
	padding-bottom: calc(var(--spacing-unit) * 4);
	padding-left: calc(var(--spacing-unit) * 1);
	padding-right: calc(var(--spacing-unit) * 1);
	border-radius: 24px 24px 0 0;
}

.contact-container {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: calc(var(--spacing-unit) * 1.25);
}

/* Contact Header */
.contact-header {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: calc(var(--spacing-unit) * 1.25);
	text-align: center;
}

.contact-badge {
	display: inline-block;
	padding: calc(var(--spacing-unit) * 0.3) calc(var(--spacing-unit) * 1.25);
	font-size: 12px;
	font-weight: 500;
	color: var(--primary-color);
	border: 1px solid var(--secondary-color);
	border-radius: 16px;
}

.contact-title {
	font-size: 1.5rem;
	font-weight: 400;
	color: var(--primary-color);
	text-align: center;
	line-height: 1.2;
}

.contact-title-accent {
	color: var(--primary-color);
}

.contact-description {
	font-size: 1.125rem;
	color: var(--primary-color);
	text-align: center;
	max-width: 42rem;
}

/* Contact Info Row */
.contact-info-row {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: calc(var(--spacing-unit) * 1.25);
	padding: calc(var(--spacing-unit) * 1.5) 0;
}

.contact-info-item {
	display: flex;
	align-items: center;
	gap: calc(var(--spacing-unit) * 0.75);
}

.contact-info-icon {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background-color: var(--primary-color);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--accent-color);
	flex-shrink: 0;
}

.contact-info-icon svg {
	width: 16px;
	height: 16px;
}

.contact-info-content {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.contact-info-label {
	font-size: 0.875rem;
	color: var(--primary-color);
	font-weight: 400;
}

.contact-info-value {
	font-size: 0.875rem;
	color: var(--primary-color);
	text-decoration: none;
	font-weight: 700;
}

.contact-info-value:hover {
	text-decoration: underline;
}

/* Main Content: Form + Image */
.contact-main-content {
	display: flex;
	flex-direction: column;
	gap: 0;
	margin-bottom: calc(var(--spacing-unit) * 3);
	box-shadow: rgba(0, 0, 0, 0.21) 0px 3px 8px;
	border-radius: 24px;
	overflow: hidden;
}

/* Contact Form */
.contact-form-wrapper {
	position: relative;
	z-index: 10;
	flex: 1;
	background-color: white;
	padding: calc(var(--spacing-unit) * 1.25);
	display: flex;
	flex-direction: column;
	gap: calc(var(--spacing-unit) * 1.25);
}

.contact-form-badge {
	display: inline-block;
	align-self: flex-start;
	padding: calc(var(--spacing-unit) * 0.3) calc(var(--spacing-unit) * 1.25);
	font-size: 12px;
	font-weight: 500;
	color: var(--primary-color);
	border: 1px solid var(--secondary-color);
	border-radius: 16px;
	background-color: rgba(255, 255, 255, 0.5);
}

.contact-form-title {
	font-size: 1.5rem;
	font-weight: 400;
	color: var(--primary-color);
	line-height: 1.2;
	margin-top: calc(var(--spacing-unit) * 0.5);
}

.contact-form-description {
	color: var(--primary-color);
	opacity: 0.8;
}

.contact-form {
	display: grid;
	grid-template-columns: 1fr;
	gap: calc(var(--spacing-unit) * 1.25);
}

.contact-form-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: calc(var(--spacing-unit) * 1.25);
}

.contact-form-field {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.contact-form-field-full {
	grid-column: 1 / -1;
}

.contact-form-label {
	font-size: 0.875rem;
	color: var(--primary-color);
}

.contact-form-input,
.contact-form-textarea {
	background-color: #f3f3f3;
	border-radius: 8px;
	padding: calc(var(--spacing-unit) * 0.75) calc(var(--spacing-unit) * 1.25);
	font-size: 1rem;
	color: var(--primary-color);
	font-family: inherit;
}

.contact-form-input:focus,
.contact-form-textarea:focus {
	outline: none;
	border-color: var(--primary-color);
}

.contact-form-textarea {
	min-height: 100px;
	resize: vertical;
}

.contact-form-submit {
	background-color: var(--primary-color);
	color: var(--accent-color);
	border: none;
	border-radius: 9999px;
	padding: calc(var(--spacing-unit) * 1) calc(var(--spacing-unit) * 1.5);
	font-size: 15px;
	font-weight: 500;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

.contact-form-submit:hover {
	background-color: var(--primary-color);
	opacity: 0.9;
}

.contact-form-message {
	margin-bottom: 1rem;
	padding: 0.75rem 1rem;
	border-radius: var(--border-radius-small);
	font-size: 0.9375rem;
}

.contact-form-message--success {
	background-color: #d4edda;
	color: #155724;
	border: 1px solid #c3e6cb;
}

.contact-form-message--error {
	background-color: #f8d7da;
	color: #721c24;
	border: 1px solid #f5c6cb;
}

/* Image Panel */
.contact-image-panel {
	position: relative;
	z-index: 0;
	flex: 1;
	border-radius: 24px;
	overflow: hidden;
	margin-top: calc(var(--spacing-unit) * 1.25);
	min-height: 400px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: calc(var(--spacing-unit) * 1.25);
	background-size: cover;
	background-position: center;
}

.contact-image-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(153, 107, 92, 0.8), transparent);
}

.contact-testimonial {
	position: relative;
	z-index: 10;
	background-color: rgba(255, 255, 255, 0.8);
	backdrop-filter: blur(4px);
	border-radius: 16px;
	padding: calc(var(--spacing-unit) * 1);
	display: flex;
	gap: calc(var(--spacing-unit) * 1);
	align-items: flex-start;
	max-width: 28rem;
}

.contact-testimonial-icon {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background-color: var(--primary-color);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: var(--accent-color);
}

.contact-testimonial-icon svg {
	width: 16px;
	height: 16px;
}

.contact-testimonial-text {
	color: var(--primary-color);
	font-size: 0.875rem;
	opacity: 0.8;
}

.contact-testimonial-bold {
	font-weight: 500;
}

.contact-testimonial-link {
	color: var(--primary-color);
	text-decoration: none;
}

.contact-testimonial-link:hover {
	text-decoration: underline;
}

/* Services Section */
.contact-services-section {
	margin-bottom: calc(var(--spacing-unit) * 3);
}

.contact-services-title {
	font-size: 1.5rem;
	font-weight: 400;
	color: var(--primary-color);
	margin-bottom: calc(var(--spacing-unit) * 1.25);
}

.contact-services-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: calc(var(--spacing-unit) * 1.25);
}

/* Service Card */
.contact-service-card {
	position: relative;
	overflow: hidden;
	border-radius: 24px;
	padding: calc(var(--spacing-unit) * 1.25);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 340px;
	border: 1px solid var(--secondary-color);
	background-color: var(--background-color, #ffffff);
}

.contact-service-card-featured {
	background-color: var(--primary-color);
	color: var(--accent-color);
}

.contact-service-card-featured::after {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	width: 128px;
	height: 96px;
	background-color: var(--accent-color);
	opacity: 0.1;
}

.contact-service-badge {
	display: inline-block;
	align-self: flex-start;
	padding: calc(var(--spacing-unit) * 0.3) calc(var(--spacing-unit) * 1.25);
	font-size: 12px;
	font-weight: 500;
	border-radius: 16px;
	border: 1px solid var(--secondary-color);
	color: var(--primary-color);
	background-color: rgba(255, 255, 255, 0.5);
}

.contact-service-card-featured .contact-service-badge {
	border-color: var(--secondary-color);
	color: var(--accent-color);
	background-color: rgba(255, 255, 255, 0.1);
}

.contact-service-title {
	font-size: 1.4375rem;
	font-weight: 500;
	margin-top: calc(var(--spacing-unit) * 0.5);
	color: var(--primary-color);
}

.contact-service-card-featured .contact-service-title {
	color: var(--accent-color);
}

.contact-service-subtitle {
	font-size: 1.125rem;
	font-weight: 500;
	color: var(--primary-color);
}

.contact-service-card-featured .contact-service-subtitle {
	color: var(--accent-color);
}

.contact-service-description {
	color: var(--primary-color);
	opacity: 0.8;
}

.contact-service-card-featured .contact-service-description {
	color: var(--accent-color);
	opacity: 0.8;
}

.contact-service-features {
	margin-top: calc(var(--spacing-unit) * 1);
	list-style: none;
	padding: 0;
}

.contact-service-features li {
	display: flex;
	align-items: center;
	gap: 0.25rem;
}

.contact-service-feature-icon {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: var(--primary-color);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--accent-color);
}

.contact-service-features span:last-child {
	color: var(--primary-color);
	margin-left: 0.25rem;
}

.contact-service-link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--primary-color);
	text-decoration: none;
	margin-top: auto;
}

.contact-service-card-featured .contact-service-link {
	color: var(--accent-color);
}

.contact-service-link-icon {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: var(--primary-color);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.3s ease;
}

.contact-service-card-featured .contact-service-link-icon {
	background-color: var(--accent-color);
	color: var(--primary-color);
}

.contact-service-link:hover .contact-service-link-icon {
	transform: translateX(4px);
}

.contact-service-link-icon svg {
	width: 8px;
	height: 8px;
}

/* Responsive Design */
@media screen and (min-width: 640px) {
	.contact-section {
		padding-top: calc(var(--spacing-unit) * 3);
		padding-left: calc(var(--spacing-unit) * 1.25);
		padding-right: calc(var(--spacing-unit) * 1.25);
	}

	.contact-title {
		font-size: 1.875rem;
	}

	.contact-description {
		font-size: 1.25rem;
	}

	.contact-info-row {
		flex-direction: row;
	}

	.contact-info-icon {
		width: 56px;
		height: 56px;
	}

	.contact-info-label,
	.contact-info-value {
		font-size: 1rem;
	}

	.contact-form-wrapper {
		padding: calc(var(--spacing-unit) * 1.5);
	}

	.contact-form-title {
		font-size: 1.875rem;
	}

	.contact-form-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.contact-image-panel {
		padding: calc(var(--spacing-unit) * 1.5);
		padding-left: calc(var(--spacing-unit) * 4);
	}

	.contact-services-title {
		font-size: 1.875rem;
	}

	.contact-services-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.contact-service-title {
		font-size: 1.4375rem;
	}
}

@media screen and (min-width: 1024px) {
	.contact-section {
		padding-top: calc(var(--spacing-unit) * 4);
	}

	.contact-title {
		font-size: 2.25rem;
	}

	.contact-main-content {
		flex-direction: row;
		gap: 0;
	}

	.contact-form-wrapper {
		padding: calc(var(--spacing-unit) * 2);
	}

	.contact-form-title {
		font-size: 2.125rem;
	}

	.contact-image-panel {
		margin-top: 0;
		margin-left: calc(var(--spacing-unit) * -3);
		min-height: auto;
	}

	.contact-services-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}


.service-detail-section > .container {
	padding-left: 0;
	padding-right: 0;
}


@media (min-width: 1300px) {
	/* styles for 1300px and wider */
	.container {
	  max-width: 1380px !important;
	  padding-left: 0 !important;
	  padding-right: 0 !important;
	}

	.home .site-logo-link {

		padding: 0 calc(var(--spacing-unit) * 2);
	}

	.site-logo-link {
		padding-right: 8px;
	}
}

.page-template-page-leistungen-detail hr,
.single hr {
	color:#e5e5e5;
}

/* Floating Contact Widget */
.floating-contact-widget {
	position: fixed;
	bottom: 24px;
	right: 24px;
	width: 320px;
	background-color: var(--primary-color);
	border-radius: 16px;
	padding: 20px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
	z-index: 9999;
	transition: transform 0.3s ease-out, opacity 0.3s ease-out;
	transform: translateY(0);
	opacity: 1;
}

.floating-contact-widget.floating-contact-widget-hidden {
	transform: translateY(calc(100% + 24px));
	opacity: 0;
	pointer-events: none;
}

.floating-contact-widget-close {
	position: absolute;
	top: 12px;
	right: 12px;
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.2);
	border: none;
	border-radius: 50%;
	color: white;
	cursor: pointer;
	transition: background-color 0.2s ease;
	pointer-events: auto;
	z-index: 10;
}

.floating-contact-widget-close:hover {
	background: rgba(255, 255, 255, 0.3);
}

.floating-contact-widget-close svg {
	pointer-events: none;
}

.floating-contact-widget-content {
	display: flex;
	gap: 16px;
	align-items: flex-start;
}

.floating-contact-widget-image {
	flex-shrink: 0;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	overflow: hidden;
	background: white;
}

.floating-contact-widget-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.floating-contact-widget-text {
	flex: 1;
	color: white;
}

.floating-contact-widget-label {
	font-size: 14px;
	line-height: 1.4;
	margin: 0 0 4px 0;
	opacity: 0.9;
	font-family: var(--font-family-body);
}

.floating-contact-widget-name {
	font-size: 16px;
	font-weight: 600;
	line-height: 1.4;
	margin: 0 0 12px 0;
	font-family: var(--font-family-body);
}

.floating-contact-widget-phone {
	display: flex;
	align-items: center;
	gap: 8px;
	color: white;
	text-decoration: none;
	font-size: 18px;
	font-weight: 700;
	transition: opacity 0.2s ease;
	font-family: var(--font-family-body);
}

.floating-contact-widget-phone:hover {
	opacity: 0.8;
}

.floating-contact-widget-phone svg {
	flex-shrink: 0;
}

.floating-contact-widget-reopen {
	position: fixed;
	bottom: 24px;
	right: 24px;
	width: 56px;
	height: 56px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--primary-color);
	border: none;
	border-radius: 50%;
	color: white;
	cursor: pointer;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
	z-index: 9999;
	transition: transform 0.2s ease, background-color 0.2s ease;
}

.floating-contact-widget-reopen:hover {
	transform: scale(1.1);
	background-color: var(--primary-color);
	opacity: 0.9;
}

@media screen and (max-width: 767px) {
	.floating-contact-widget {
		width: calc(100% - 48px);
		max-width: 320px;
		bottom: 16px;
		right: 16px;
	}
	
	.floating-contact-widget-reopen {
		bottom: 16px;
		right: 16px;
	}
}

/* Floating Calendar Widget */
.floating-calendar-widget {
	position: fixed;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #107acb;
	color: #fff;
	text-decoration: none;
	box-shadow: -4px 0 12px rgba(0, 0, 0, 0.1);
	z-index: 9998;
	transition: background-color 0.2s ease, opacity 0.3s ease, visibility 0.3s ease;
}

@media screen and (max-width: 754px) {
	.floating-calendar-widget {
		opacity: 0 !important;
	}
}

.floating-calendar-widget.floating-calendar-widget-hidden {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.floating-calendar-widget:hover {
	opacity: 0.9;
	color: #fff;
}

.floating-calendar-widget-icon {
	width: 100%;
	height: 100%;
	padding: 2px;
	object-fit: contain;
	display: block;
}

@media screen and (max-width: 767px) {
	.floating-calendar-widget {
		width: 50px;
		height: 50px;
	}
}

/* BMI Widget Range Input Styles */
#wenzl-bmi-widget input[type="range"] {
	-webkit-appearance: none;
	appearance: none;
	height: 6px;
	background: #e5e7eb;
	border-radius: 3px;
	outline: none;
}

#wenzl-bmi-widget input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 20px;
	height: 20px;
	background: #885545;
	border-radius: 50%;
	cursor: pointer;
	transition: all 0.2s;
}

#wenzl-bmi-widget input[type="range"]::-webkit-slider-thumb:hover {
	transform: scale(1.1);
	background: #996b5c;
}

#wenzl-bmi-widget input[type="range"]::-moz-range-thumb {
	width: 20px;
	height: 20px;
	background: #885545;
	border-radius: 50%;
	cursor: pointer;
	border: none;
	transition: all 0.2s;
}

#wenzl-bmi-widget input[type="range"]::-moz-range-thumb:hover {
	transform: scale(1.1);
	background: #996b5c;
}
/* BMI Widget end*/



/* blog sites css */

.ghostkit-toc-list > ol li a {
	font-weight: 600;
}

.ghostkit-toc-title {
	font-size: 1.25rem;
}

@media (min-width: 1024px) { 
	.ghostkit-toc-list > ol {
		--gkt-styled-lists-numbered--decoration__background-color: #885545;
		display: grid;
		gap: 0.5rem;
		grid-template-columns: 1fr 1fr;
		padding-left: 0;
	}
	
	.ghostkit-toc-list > ol li a {
		font-weight: 600;
	}

	.ghostkit-toc-list ol li {
		margin-top: 0 !important;
		margin-bottom: 12px !important;
	}
}

@media (max-width: 1023px) { 
	.entry-section-container {
		padding-right: 0;
	}
	.ghostkit-toc-list > ol {
		--gkt-styled-lists-numbered--decoration__background-color: #885545;
		padding-left: 0;
	}

	.ghostkit-toc-list ol li {
		margin-bottom: 16px !important;
	}
}

.ghostkit-toc-list ol li ul {
	display: none;
}

.page-template-page-leistungen-detail h1, .page-template-page-leistungen-detail h2, .page-template-page-leistungen-detail h3, .page-template-page-leistungen-detail h4, .page-template-page-leistungen-detail h5, .page-template-page-leistungen-detail h6,
.single h1, .single h2, .single h3, .single h4, .single h5, .single h6 {
	font-family: "Manrope", sans-serif;
}

.page-template-page-leistungen-detail h1,
.single h1 {
	line-height: 1.1;
	margin-bottom: 16px;
}

.single ol a {
	color: #885545;

	word-break: break-word;
}
/* blog sites css end */


@media (max-width: 1023px) {
	.page-template .header-logo-menu-container, .search .header-logo-menu-container, .page-template-default .header-logo-menu-container, .single .header-logo-menu-container {
		padding-left: 25px;
		padding-right: 25px;
	}
}