/* ==========================================================================
   Schweikart Design System — theme.css
   Massage Praxis All Balance Schweikart
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. CSS Custom Properties
   -------------------------------------------------------------------------- */

:root {
	/* Colors */
	--primary: #8BAF92;
	--primary-dark: #4A7C59;
	--primary-light: #D4E5D7;
	--accent: #C5A882;
	--accent-light: #E8DCC8;
	--bg: #F9F6F1;
	--bg-alt: #EFF5F0;
	--text: #3D3228;
	--text-light: #7A6F63;
	--white: #FFFFFF;

	/* Typography */
	--font-heading: 'Cormorant Garamond', Georgia, serif;
	--font-body: 'Nunito', 'Segoe UI', sans-serif;
	--font-decorative: 'Dancing Script', cursive;

	/* Spacing */
	--section-padding: 5rem 0;
	--container-width: 1200px;
	--container-padding: 0 1.5rem;

	/* Borders & Shadows */
	--radius-card: 14px;
	--radius-btn: 24px;
	--shadow: 0 4px 24px rgba(61, 50, 40, 0.08);
	--shadow-hover: 0 8px 32px rgba(61, 50, 40, 0.14);

	/* Transitions */
	--transition: 0.3s ease;
}

/* --------------------------------------------------------------------------
   2. Reset / Normalize
   -------------------------------------------------------------------------- */

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

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

body {
	font-family: var(--font-body);
	font-size: 17px;
	font-weight: 400;
	line-height: 1.7;
	color: var(--text);
	background-color: var(--bg);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

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

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

a:hover,
a:focus-visible {
	color: var(--accent);
}

ul,
ol {
	list-style: none;
}

button,
input,
select,
textarea {
	font-family: inherit;
	font-size: inherit;
	color: inherit;
}

/* --------------------------------------------------------------------------
   3. Typography
   -------------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-heading);
	color: var(--primary-dark);
	line-height: 1.25;
	font-weight: 500;
}

h1 {
	font-size: 3rem;
	font-weight: 600;
}

h2 {
	font-size: 2.25rem;
	margin-bottom: 1rem;
}

h3 {
	font-size: 1.5rem;
	margin-bottom: 0.75rem;
}

h4 {
	font-size: 1.25rem;
}

h5 {
	font-size: 1.1rem;
}

h6 {
	font-size: 1rem;
}

p {
	margin-bottom: 1rem;
}

p:last-child {
	margin-bottom: 0;
}

.schweikart-decorative {
	font-family: var(--font-decorative);
	font-weight: 400;
}

/* --------------------------------------------------------------------------
   4. Buttons
   -------------------------------------------------------------------------- */

.schweikart-btn {
	display: inline-block;
	padding: 0.8rem 2rem;
	font-family: var(--font-body);
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1.4;
	text-align: center;
	text-decoration: none;
	border: 2px solid transparent;
	border-radius: var(--radius-btn);
	cursor: pointer;
	transition: background-color var(--transition),
	            color var(--transition),
	            box-shadow var(--transition),
	            transform var(--transition);
}

.schweikart-btn:focus-visible {
	outline: 3px solid var(--accent);
	outline-offset: 2px;
}

.schweikart-btn--primary {
	background-color: var(--accent);
	color: var(--white);
}

.schweikart-btn--primary:hover {
	background-color: #b89a72;
	color: var(--white);
	box-shadow: var(--shadow-hover);
	transform: translateY(-2px);
}

.schweikart-btn--secondary {
	background-color: transparent;
	color: var(--primary-dark);
	border-color: var(--primary-dark);
}

.schweikart-btn--secondary:hover {
	background-color: var(--primary-dark);
	color: var(--white);
	transform: translateY(-2px);
}

/* Hide CTA button on desktop only (visible on mobile + tablet) */
@media (min-width: 1024px) {
	.schweikart-btn--mobile-only {
		display: none !important;
	}
}

/* --------------------------------------------------------------------------
   5. Layout Utilities
   -------------------------------------------------------------------------- */

.schweikart-container,
.container {
	width: 100%;
	max-width: var(--container-width);
	margin: 0 auto;
	padding: var(--container-padding);
}

/* Offset for fixed header */
#main-content {
	padding-top: 80px;
}

/* Front page: hero covers full viewport behind transparent header */
body.home #main-content {
	padding-top: 0;
}

.schweikart-section {
	padding: var(--section-padding);
	position: relative;
	overflow: hidden;
}

.schweikart-section--alt {
	background-color: var(--bg-alt);
}

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

.schweikart-section__heading {
	text-align: center;
	margin-bottom: 3rem;
}

.schweikart-section__heading h2 {
	position: relative;
	display: inline-block;
}

.schweikart-section__heading h2::after {
	content: '';
	display: block;
	width: 60px;
	height: 3px;
	background-color: var(--accent);
	margin: 0.75rem auto 0;
	border-radius: 2px;
}

/* --------------------------------------------------------------------------
   6. Cards
   -------------------------------------------------------------------------- */

.schweikart-card {
	background-color: var(--white);
	border-radius: var(--radius-card);
	box-shadow: var(--shadow);
	padding: 2rem;
	transition: box-shadow var(--transition), transform var(--transition);
}

.schweikart-card:hover {
	box-shadow: var(--shadow-hover);
	transform: translateY(-4px);
}

/* --------------------------------------------------------------------------
   7. Forms (base)
   -------------------------------------------------------------------------- */

.schweikart-input,
.schweikart-textarea,
.schweikart-select {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 1px solid var(--accent-light);
	border-radius: 8px;
	background-color: var(--white);
	transition: border-color var(--transition), box-shadow var(--transition);
}

.schweikart-input:focus,
.schweikart-textarea:focus,
.schweikart-select:focus {
	outline: none;
	border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(139, 175, 146, 0.2);
}

.schweikart-textarea {
	resize: vertical;
	min-height: 120px;
}

/* --------------------------------------------------------------------------
   8. Responsive Breakpoints
   -------------------------------------------------------------------------- */

/* Tablet (768px+) */
@media (min-width: 768px) {
	h1 {
		font-size: 3.25rem;
	}

	h2 {
		font-size: 2.5rem;
	}

	:root {
		--section-padding: 6rem 0;
	}
}

/* Desktop (1024px+) */
@media (min-width: 1024px) {
	h1 {
		font-size: 3.5rem;
	}

	body {
		font-size: 18px;
	}
}

/* --------------------------------------------------------------------------
   9. Header & Navigation
   -------------------------------------------------------------------------- */

.schweikart-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	background-color: rgba(30, 25, 20, 0.28);
	-webkit-backdrop-filter: blur(14px) saturate(160%);
	backdrop-filter: blur(14px) saturate(160%);
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	box-shadow: 0 2px 16px rgba(0, 0, 0, 0.08);
	transition: background-color var(--transition), box-shadow var(--transition), border-color var(--transition);
}

.schweikart-header--scrolled {
	background-color: rgba(249, 246, 241, 0.92);
	border-bottom-color: rgba(61, 50, 40, 0.06);
	box-shadow: 0 2px 16px rgba(61, 50, 40, 0.08);
}

.schweikart-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 80px;
}

.schweikart-header__logo {
	flex-shrink: 0;
	display: flex;
	align-items: center;
}

.schweikart-header__logo img {
	height: 50px;
	width: auto;
}

/* Nav list */
.schweikart-nav {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.schweikart-nav__list {
	display: flex;
	align-items: center;
	gap: 0.25rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.schweikart-nav__item {
	list-style: none;
}

.schweikart-nav__link,
.schweikart-nav__list a {
	display: block;
	padding: 0.5rem 1rem;
	font-family: var(--font-body);
	font-size: 0.95rem;
	font-weight: 600;
	color: #ffffff;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
	text-decoration: none;
	border-radius: 8px;
	transition: color var(--transition), background-color var(--transition), text-shadow var(--transition);
}

.schweikart-nav__link:hover,
.schweikart-nav__link:focus-visible,
.schweikart-nav__list a:hover,
.schweikart-nav__list a:focus-visible {
	color: #ffffff;
	background-color: rgba(255, 255, 255, 0.15);
}

.schweikart-header--scrolled .schweikart-nav__link,
.schweikart-header--scrolled .schweikart-nav__list a {
	color: var(--text);
	text-shadow: none;
}

.schweikart-header--scrolled .schweikart-nav__link:hover,
.schweikart-header--scrolled .schweikart-nav__link:focus-visible,
.schweikart-header--scrolled .schweikart-nav__list a:hover,
.schweikart-header--scrolled .schweikart-nav__list a:focus-visible {
	color: var(--primary-dark);
	background-color: rgba(139, 175, 146, 0.1);
}

/* CTA in nav */
.schweikart-nav__cta {
	margin-left: 0.75rem;
	padding: 0.55rem 1.5rem;
	font-size: 0.9rem;
	white-space: nowrap;
}

/* Hamburger toggle */
.schweikart-nav-toggle {
	display: none;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 5px;
	width: 44px;
	height: 44px;
	padding: 0;
	background: none;
	border: none;
	cursor: pointer;
	z-index: 1001;
}

.schweikart-nav-toggle__bar {
	display: block;
	width: 24px;
	height: 2px;
	background-color: #ffffff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
	border-radius: 2px;
	transition: transform var(--transition), opacity var(--transition), background-color var(--transition), box-shadow var(--transition);
}

.schweikart-header--scrolled .schweikart-nav-toggle__bar {
	background-color: var(--text);
	box-shadow: none;
}

/* Hamburger → X animation */
.schweikart-nav-toggle--active .schweikart-nav-toggle__bar:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}

.schweikart-nav-toggle--active .schweikart-nav-toggle__bar:nth-child(2) {
	opacity: 0;
}

.schweikart-nav-toggle--active .schweikart-nav-toggle__bar:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

/* Mobile nav */
@media (max-width: 767px) {
	.schweikart-nav-toggle {
		display: flex;
	}

	.schweikart-nav {
		position: fixed;
		top: 0;
		right: 0;
		width: 280px;
		height: 100vh;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		padding: 100px 2rem 2rem;
		background-color: var(--white);
		box-shadow: -4px 0 24px rgba(61, 50, 40, 0.12);
		transform: translateX(100%);
		transition: transform 0.35s ease;
		z-index: 999;
	}

	.schweikart-nav--open {
		transform: translateX(0);
	}

	.schweikart-nav__list {
		flex-direction: column;
		gap: 0;
	}

	.schweikart-nav__link,
	.schweikart-nav__list a {
		padding: 0.85rem 1rem;
		font-size: 1.05rem;
		color: var(--text);
		text-shadow: none;
		border-bottom: 1px solid var(--accent-light);
	}

	.schweikart-nav__link:hover,
	.schweikart-nav__link:focus-visible,
	.schweikart-nav__list a:hover,
	.schweikart-nav__list a:focus-visible {
		color: var(--primary-dark);
		background-color: rgba(139, 175, 146, 0.1);
	}

	.schweikart-nav__cta {
		margin-left: 0;
		margin-top: 1.5rem;
		text-align: center;
	}

	body.schweikart-nav-active .schweikart-nav-toggle__bar {
		background-color: var(--text);
		box-shadow: none;
	}
}

/* Overlay behind mobile nav */
.schweikart-nav-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(61, 50, 40, 0.3);
	z-index: 998;
}

.schweikart-nav-overlay--visible {
	display: block;
}

/* Body scroll lock when nav open */
body.schweikart-nav-active {
	overflow: hidden;
}

/* --------------------------------------------------------------------------
   10. Footer
   -------------------------------------------------------------------------- */

.schweikart-footer {
	background-color: var(--primary-dark);
	color: rgba(255, 255, 255, 0.85);
	padding-top: 4rem;
}

.schweikart-footer a {
	color: rgba(255, 255, 255, 0.85);
	transition: color var(--transition);
}

.schweikart-footer a:hover,
.schweikart-footer a:focus-visible {
	color: var(--accent-light);
}

.schweikart-footer__inner {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2.5rem;
	padding-bottom: 3rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.schweikart-footer__logo {
	width: 140px;
	height: auto;
	margin-bottom: 1.25rem;
	filter: brightness(0) invert(1);
	opacity: 0.9;
}

.schweikart-footer__heading {
	font-family: var(--font-heading);
	font-size: 1.25rem;
	font-weight: 600;
	color: var(--white);
	margin-bottom: 1rem;
}

.schweikart-footer__address {
	font-style: normal;
	line-height: 1.8;
}

.schweikart-footer__address p {
	margin-bottom: 0.5rem;
}

.schweikart-footer__hours-table {
	width: 100%;
	max-width: 260px;
	border-collapse: collapse;
}

.schweikart-footer__hours-table td {
	padding: 0.3rem 0;
}

.schweikart-footer__hours-table td:first-child {
	font-weight: 600;
	padding-right: 1.5rem;
	color: var(--white);
}

.schweikart-footer__vereinbarung {
	margin-top: 0.75rem;
	font-style: italic;
	opacity: 0.8;
}

.schweikart-footer__legal-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.schweikart-footer__legal-list li {
	margin-bottom: 0.6rem;
}

.schweikart-footer__legal-list a {
	display: inline-block;
	padding: 0.15rem 0;
}

.schweikart-footer__copy {
	padding: 1.25rem 0;
	text-align: center;
	font-size: 0.85rem;
	opacity: 0.65;
}

/* Footer responsive: 3 columns on tablet+ */
@media (min-width: 768px) {
	.schweikart-footer__inner {
		grid-template-columns: 1.2fr 1fr 0.8fr;
		gap: 3rem;
	}
}

/* --------------------------------------------------------------------------
   11. Hero Section
   -------------------------------------------------------------------------- */

.schweikart-hero {
	position: relative;
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	padding: 6rem 0 8rem;
}

/* Atmospheric variant (US-004): full-viewport hero with Unsplash photo,
   left-aligned text overlay on the rule-of-thirds line. */
.schweikart-hero--atmospheric {
	min-height: 70vh;
	min-height: 70dvh;
	justify-content: flex-start;
	padding: 7rem 0 5rem;
}

@media (min-width: 768px) {
	.schweikart-hero--atmospheric {
		min-height: 100vh;
		min-height: 100dvh;
		padding: 8rem 0 7rem;
	}
}

/* Parallax background layer */
.schweikart-hero__bg {
	position: absolute;
	top: -20%;
	left: 0;
	right: 0;
	bottom: -20%;
	z-index: 0;
	background:
		radial-gradient(ellipse at 20% 50%, rgba(139, 175, 146, 0.15) 0%, transparent 60%),
		radial-gradient(ellipse at 80% 20%, rgba(197, 168, 130, 0.1) 0%, transparent 50%),
		radial-gradient(ellipse at 50% 80%, rgba(212, 229, 215, 0.2) 0%, transparent 60%),
		linear-gradient(160deg, var(--primary-light) 0%, var(--bg) 40%, var(--bg-alt) 70%, var(--primary-light) 100%);
	will-change: transform;
}

/* Subtle texture overlay */
.schweikart-hero__bg::after {
	content: '';
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 0l30 30-30 30L0 30z' fill='%238BAF92' fill-opacity='0.03'/%3E%3C/svg%3E");
	background-size: 60px 60px;
	opacity: 0.5;
}

.schweikart-hero__inner {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.schweikart-hero__logo {
	width: 200px;
	height: auto;
	margin-bottom: 2rem;
	filter: drop-shadow(0 4px 16px rgba(61, 50, 40, 0.1));
}

.schweikart-hero__title {
	font-size: 2.5rem;
	font-weight: 600;
	color: var(--primary-dark);
	margin-bottom: 1rem;
	max-width: 700px;
	line-height: 1.2;
}

.schweikart-hero__subtitle {
	font-family: var(--font-body);
	font-size: 1.15rem;
	color: var(--text-light);
	margin-bottom: 0.5rem;
	font-weight: 400;
	letter-spacing: 0.02em;
}

.schweikart-hero__actions {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	align-items: center;
}

.schweikart-hero__cta {
	min-width: 220px;
}

/* Wave divider at bottom */
.schweikart-hero__wave {
	position: absolute;
	bottom: -1px;
	left: 0;
	right: 0;
	z-index: 2;
	line-height: 0;
}

.schweikart-hero__wave svg {
	width: 100%;
	height: 80px;
	display: block;
}

/* Hero tablet */
@media (min-width: 768px) {
	.schweikart-hero__logo {
		width: 260px;
	}

	.schweikart-hero__title {
		font-size: 3.25rem;
	}

	.schweikart-hero__subtitle {
		font-size: 1.25rem;
	}

	.schweikart-hero__actions {
		flex-direction: row;
		gap: 1.25rem;
	}

	.schweikart-hero__wave svg {
		height: 100px;
	}
}

/* Hero desktop */
@media (min-width: 1024px) {
	.schweikart-hero__logo {
		width: 300px;
		margin-bottom: 2.5rem;
	}

	.schweikart-hero__subtitle {
		font-size: 1.35rem;
	}

	.schweikart-hero__title {
		font-size: 3.5rem;
	}

	.schweikart-hero__wave svg {
		height: 120px;
	}
}

/* --------------------------------------------------------------------------
   12. Willkommen Section
   -------------------------------------------------------------------------- */

/* Tighten gap between Willkommen and Behandlungen (client feedback) */
.schweikart-willkommen {
	padding-bottom: 2.5rem;
}

.schweikart-behandlungen {
	padding-top: 2.5rem;
}

@media (min-width: 1024px) {
	.schweikart-willkommen {
		padding-bottom: 3.5rem;
	}

	.schweikart-behandlungen {
		padding-top: 3.5rem;
	}
}

.schweikart-willkommen__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 3rem;
	align-items: center;
}

.schweikart-willkommen__content .schweikart-section__heading--left {
	text-align: left;
	margin-bottom: 2rem;
}

.schweikart-willkommen__content .schweikart-section__heading--left h2::after {
	margin: 0.75rem 0 0;
}

.schweikart-willkommen__lead {
	font-size: 1.1rem;
	line-height: 1.8;
	color: var(--text);
	font-weight: 400;
}

.schweikart-willkommen__content p {
	color: var(--text-light);
	margin-bottom: 1.25rem;
}

.schweikart-willkommen__content p.schweikart-willkommen__lead {
	color: var(--text);
}

.schweikart-willkommen__content .schweikart-btn {
	margin-top: 0.75rem;
}

/* Photo placeholder */
.schweikart-willkommen__image {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
}

.schweikart-willkommen__quote {
	font-family: var(--font-decorative);
	font-size: 1.4rem;
	line-height: 1.5;
	color: var(--primary-dark);
	text-align: center;
	max-width: 320px;
	margin: 0.25rem 0 0;
	padding: 0;
	border: 0;
	quotes: "\201E" "\201C";
}

.schweikart-willkommen__quote::before {
	content: open-quote;
}

.schweikart-willkommen__quote::after {
	content: close-quote;
}

.schweikart-willkommen__photo-frame {
	width: 100%;
	max-width: 380px;
	aspect-ratio: 3 / 4;
	border-radius: var(--radius-card);
	overflow: hidden;
	box-shadow: var(--shadow);
	border: 3px solid var(--accent-light);
}

.schweikart-willkommen__photo {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
	display: block;
}

.schweikart-willkommen__photo-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	background: linear-gradient(135deg, var(--primary-light) 0%, var(--bg-alt) 50%, var(--accent-light) 100%);
	color: var(--text-light);
}

.schweikart-willkommen__photo-placeholder svg {
	opacity: 0.4;
}

.schweikart-willkommen__photo-placeholder span {
	font-family: var(--font-decorative);
	font-size: 1.1rem;
	opacity: 0.5;
}

/* Decorative leaf */
.schweikart-willkommen__leaf {
	position: absolute;
	bottom: -30px;
	right: -20px;
	width: 80px;
	height: auto;
	z-index: -1;
}

/* Willkommen tablet: 2 columns */
@media (min-width: 768px) {
	.schweikart-willkommen__grid {
		grid-template-columns: 1.2fr 1fr;
		gap: 4rem;
	}

	.schweikart-willkommen__leaf {
		width: 100px;
		bottom: -40px;
		right: -30px;
	}
}

/* Willkommen desktop */
@media (min-width: 1024px) {
	.schweikart-willkommen__grid {
		gap: 5rem;
	}

	.schweikart-willkommen__lead {
		font-size: 1.15rem;
	}

	.schweikart-willkommen__leaf {
		width: 120px;
	}
}

/* --------------------------------------------------------------------------
   13. Behandlungen Section
   -------------------------------------------------------------------------- */

.schweikart-behandlungen__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
	margin-bottom: 3rem;
}

.schweikart-behandlungen__card {
	background: var(--white);
	border-radius: var(--radius-card);
	box-shadow: var(--shadow);
	transition: transform var(--transition), box-shadow var(--transition);
	display: flex;
	flex-direction: column;
	align-items: stretch;
	overflow: hidden;
}

.schweikart-behandlungen__card:hover {
	transform: translateY(-6px);
	box-shadow: var(--shadow-hover);
}

.schweikart-behandlungen__media {
	position: relative;
	width: 100%;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	background: linear-gradient(135deg, var(--primary-light) 0%, var(--bg-alt) 100%);
	isolation: isolate;
}

.schweikart-behandlungen__photo {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 500ms ease-out;
}

.schweikart-behandlungen__media-overlay {
	position: absolute;
	inset: 0;
	background-color: rgba(139, 175, 146, 0.15);
	transition: opacity var(--transition);
	pointer-events: none;
	z-index: 1;
}

.schweikart-behandlungen__card:hover .schweikart-behandlungen__photo {
	transform: scale(1.03);
}

.schweikart-behandlungen__card:hover .schweikart-behandlungen__media-overlay {
	opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
	.schweikart-behandlungen__photo,
	.schweikart-behandlungen__media-overlay {
		transition: none;
	}

	.schweikart-behandlungen__card:hover .schweikart-behandlungen__photo {
		transform: none;
	}
}

.schweikart-behandlungen__body {
	padding: 1.75rem 1.75rem 2rem;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	flex-grow: 1;
}

.schweikart-behandlungen__icon {
	width: 48px;
	height: 48px;
	color: var(--primary);
	margin-bottom: 1rem;
}

.schweikart-behandlungen__title {
	font-family: var(--font-heading);
	font-size: 1.4rem;
	font-weight: 500;
	color: var(--primary-dark);
	margin-bottom: 0.75rem;
}

.schweikart-behandlungen__desc {
	color: var(--text-light);
	font-size: 0.95rem;
	line-height: 1.7;
	margin-bottom: 1.25rem;
	flex-grow: 1;
}

.schweikart-behandlungen__prices {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	margin-bottom: 1.25rem;
	width: 100%;
}

.schweikart-behandlungen__price {
	font-size: 0.9rem;
	color: var(--text);
}

.schweikart-behandlungen__price strong {
	color: var(--primary-dark);
	font-weight: 600;
}

.schweikart-behandlungen__link {
	font-family: var(--font-body);
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--accent);
	text-decoration: none;
	transition: color var(--transition);
}

.schweikart-behandlungen__link:hover {
	color: var(--primary-dark);
}

.schweikart-behandlungen__cta {
	text-align: center;
	margin-top: 1rem;
}

/* Behandlungen: stagger fade-in */
.schweikart-behandlungen__card.schweikart-fade-in:nth-child(2) {
	transition-delay: 0.1s;
}

.schweikart-behandlungen__card.schweikart-fade-in:nth-child(3) {
	transition-delay: 0.2s;
}

.schweikart-behandlungen__card.schweikart-fade-in:nth-child(4) {
	transition-delay: 0.3s;
}

/* Behandlungen tablet: 2 columns */
@media (min-width: 768px) {
	.schweikart-behandlungen__grid {
		grid-template-columns: 1fr 1fr;
		gap: 2rem;
	}

	.schweikart-behandlungen__body {
		padding: 2rem 2rem 2.25rem;
	}

	.schweikart-behandlungen__title {
		font-size: 1.5rem;
	}
}

/* Behandlungen desktop: 4 columns */
@media (min-width: 1024px) {
	.schweikart-behandlungen__grid {
		grid-template-columns: repeat(4, 1fr);
		gap: 1.75rem;
	}

	.schweikart-behandlungen__body {
		padding: 1.75rem 1.5rem 2rem;
	}

	.schweikart-behandlungen__title {
		font-size: 1.35rem;
	}

	.schweikart-behandlungen__icon {
		width: 44px;
		height: 44px;
	}
}

/* --------------------------------------------------------------------------
   14. Über mich Section
   -------------------------------------------------------------------------- */

.schweikart-ueber-mich {
	overflow: visible; /* override .schweikart-section overflow:hidden — required for sticky portrait */
}

.schweikart-ueber-mich__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2.5rem;
	align-items: start;
}

/* Portrait column */
.schweikart-ueber-mich__portrait {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
}

.schweikart-ueber-mich__photo-frame {
	width: 100%;
	max-width: 320px;
	aspect-ratio: 4 / 5;
	border-radius: 16px;
	box-shadow: 0 4px 24px rgba(61, 50, 40, 0.08);
	overflow: hidden;
	position: relative;
	background: linear-gradient(160deg, var(--primary-light) 0%, var(--bg-alt) 100%);
}

.schweikart-ueber-mich__photo {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.schweikart-ueber-mich__quote {
	font-family: var(--font-decorative);
	font-size: 1.4rem;
	line-height: 1.5;
	color: var(--primary-dark);
	text-align: center;
	max-width: 320px;
	margin: 0.25rem 0 0;
	padding: 0;
	border: 0;
	quotes: "\201E" "\201C";
}

.schweikart-ueber-mich__quote::before {
	content: open-quote;
}

.schweikart-ueber-mich__quote::after {
	content: close-quote;
}

/* Badge */
.schweikart-ueber-mich__badge {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	background: var(--white);
	border: 2px solid var(--accent);
	border-radius: 2rem;
	padding: 0.5rem 1.25rem;
	box-shadow: var(--shadow);
	color: var(--primary-dark);
	font-family: var(--font-body);
	font-size: 0.9rem;
	font-weight: 600;
}

.schweikart-ueber-mich__badge svg {
	color: var(--accent);
	flex-shrink: 0;
}

/* Content column */
.schweikart-ueber-mich__subtitle {
	font-family: var(--font-decorative);
	font-size: 1.25rem;
	color: var(--primary);
	margin: 0.25rem 0 0;
}

.schweikart-ueber-mich__lead {
	font-size: 1.1rem;
	line-height: 1.8;
	color: var(--text);
	font-weight: 400;
}

.schweikart-ueber-mich__content p {
	font-size: 1.05rem;
	line-height: 1.8;
	color: var(--text);
	margin-bottom: 1.25rem;
}

.schweikart-ueber-mich__content .schweikart-btn {
	margin-top: 0.5rem;
}

/* Tablet: 2-column layout (40% image / 60% text per US-005) */
@media (min-width: 768px) {
	.schweikart-ueber-mich__grid {
		grid-template-columns: 2fr 3fr;
		gap: 3rem;
		align-items: start;
	}

	.schweikart-ueber-mich__portrait {
		position: sticky;
		top: 100px;
	}

	.schweikart-ueber-mich__photo-frame {
		max-width: 360px;
	}
}

/* Desktop */
@media (min-width: 1024px) {
	.schweikart-ueber-mich__grid {
		gap: 4rem;
	}

	.schweikart-ueber-mich__photo-frame {
		max-width: 400px;
	}
}

/* Stagger delay for portrait */
.schweikart-ueber-mich__content.schweikart-fade-in {
	transition-delay: 0.15s;
}

/* --------------------------------------------------------------------------
   15. Fade-in Scroll Animation
   -------------------------------------------------------------------------- */

.schweikart-fade-in {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.7s ease, transform 0.7s ease;
}

.schweikart-fade-in--visible {
	opacity: 1;
	transform: translateY(0);
}

/* Stagger delay for second element in a grid */
.schweikart-willkommen__image.schweikart-fade-in {
	transition-delay: 0.2s;
}

/* --------------------------------------------------------------------------
   16. Behandlung Detail Page
   -------------------------------------------------------------------------- */

/* Breadcrumb */
.schweikart-breadcrumb {
	background: var(--bg-alt);
	padding: 1rem 0;
	border-bottom: 1px solid var(--primary-light);
}

.schweikart-breadcrumb__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.9rem;
	color: var(--text-light);
}

.schweikart-breadcrumb__item + .schweikart-breadcrumb__item::before {
	content: "›";
	margin-right: 0.5rem;
	color: var(--primary);
}

.schweikart-breadcrumb__item a {
	color: var(--primary-dark);
	text-decoration: none;
	transition: color var(--transition);
}

.schweikart-breadcrumb__item a:hover {
	color: var(--accent);
}

.schweikart-breadcrumb__item--current {
	color: var(--text);
	font-weight: 600;
}

/* Hero Banner */
.schweikart-behandlung-detail__hero {
	background: linear-gradient(135deg, var(--primary-light) 0%, var(--bg-alt) 100%);
	padding: 3rem 0 2.5rem;
	text-align: center;
}

.schweikart-behandlung-detail__icon {
	color: var(--primary-dark);
	margin-bottom: 1rem;
}

.schweikart-behandlung-detail__title {
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 2.2rem;
	color: var(--primary-dark);
	margin: 0 0 0.5rem;
}

.schweikart-behandlung-detail__subtitle {
	font-family: var(--font-body);
	font-size: 1.1rem;
	color: var(--text-light);
	margin: 0;
}

/* US-007 — Service detail page hero with atmospheric photo background.
   Mirrors the front-page --atmospheric pattern but at 50vh (40vh mobile) so the
   content below stays reachable without a full-viewport scroll. */
.schweikart-behandlung-detail__hero--photo {
	position: relative;
	isolation: isolate;
	min-height: 40vh;
	min-height: 40dvh;
	padding: 2.5rem 0;
	background: var(--primary-dark);
	text-align: left;
	overflow: hidden;
	display: flex;
	align-items: center;
}

@media (min-width: 768px) {
	.schweikart-behandlung-detail__hero--photo {
		min-height: 50vh;
		min-height: 50dvh;
		padding: 3rem 0;
	}
}

.schweikart-behandlung-detail__hero-photo {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
}

.schweikart-behandlung-detail__hero-img-wrap {
	width: 100%;
	height: 100%;
}

.schweikart-behandlung-detail__hero-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.schweikart-behandlung-detail__hero-overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(
		to right,
		rgba(61, 50, 40, 0.7) 0%,
		rgba(61, 50, 40, 0.45) 45%,
		rgba(61, 50, 40, 0.2) 75%,
		rgba(61, 50, 40, 0.1) 100%
	);
}

@media (max-width: 767px) {
	.schweikart-behandlung-detail__hero-overlay {
		background: linear-gradient(
			to bottom,
			rgba(61, 50, 40, 0.55) 0%,
			rgba(61, 50, 40, 0.65) 100%
		);
	}
}

.schweikart-behandlung-detail__hero--photo .schweikart-behandlung-detail__hero-inner {
	position: relative;
	z-index: 2;
	max-width: 640px;
	margin-right: auto;
}

.schweikart-behandlung-detail__hero--photo .schweikart-behandlung-detail__icon {
	color: var(--bg);
	filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.35));
	margin-bottom: 0.75rem;
}

.schweikart-behandlung-detail__hero--photo .schweikart-behandlung-detail__title {
	color: var(--bg);
	text-shadow: 0 2px 16px rgba(0, 0, 0, 0.35);
}

.schweikart-behandlung-detail__hero--photo .schweikart-behandlung-detail__subtitle {
	color: var(--bg);
	text-shadow: 0 1px 10px rgba(0, 0, 0, 0.35);
	margin-bottom: 1.25rem;
}

.schweikart-behandlung-detail__hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

/* Content Grid */
.schweikart-behandlung-detail__content {
	padding: var(--section-padding);
}

.schweikart-behandlung-detail__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 3rem;
}

@media (min-width: 768px) {
	.schweikart-behandlung-detail__title {
		font-size: 2.8rem;
	}

	.schweikart-behandlung-detail__grid {
		grid-template-columns: 1fr 340px;
		gap: 3rem;
	}
}

@media (min-width: 1024px) {
	.schweikart-behandlung-detail__title {
		font-size: 3.2rem;
	}
}

/* Main text area */
.schweikart-behandlung-detail__text p {
	font-size: 1.05rem;
	line-height: 1.8;
	color: var(--text);
	margin-bottom: 1.25rem;
}

.schweikart-behandlung-detail__text h3 {
	font-family: var(--font-heading);
	font-size: 1.35rem;
	font-weight: 600;
	color: var(--primary-dark);
	margin-top: 2rem;
	margin-bottom: 0.75rem;
}

/* Indications */
.schweikart-behandlung-detail__indications {
	margin-top: 2.5rem;
}

.schweikart-behandlung-detail__indications h2 {
	font-family: var(--font-heading);
	font-weight: 500;
	font-size: 1.6rem;
	color: var(--primary-dark);
	margin-bottom: 1rem;
}

.schweikart-behandlung-detail__indications ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.schweikart-behandlung-detail__indications li {
	position: relative;
	padding-left: 1.75rem;
	margin-bottom: 0.75rem;
	font-size: 1rem;
	line-height: 1.6;
	color: var(--text);
}

.schweikart-behandlung-detail__indications li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 10px;
	height: 10px;
	background: var(--primary-light);
	border: 2px solid var(--primary);
	border-radius: 50%;
}

/* Price Table */
.schweikart-behandlung-detail__prices {
	margin-top: 2.5rem;
}

.schweikart-behandlung-detail__prices h2 {
	font-family: var(--font-heading);
	font-weight: 500;
	font-size: 1.6rem;
	color: var(--primary-dark);
	margin-bottom: 1rem;
}

.schweikart-behandlung-detail__price-table {
	width: 100%;
	border-collapse: collapse;
	background: var(--white);
	border-radius: var(--radius-card);
	overflow: hidden;
	box-shadow: var(--shadow);
}

.schweikart-behandlung-detail__price-table th,
.schweikart-behandlung-detail__price-table td {
	padding: 1rem 1.25rem;
	text-align: left;
	font-size: 1rem;
}

.schweikart-behandlung-detail__price-table thead th {
	background: var(--primary-dark);
	color: var(--white);
	font-weight: 600;
	font-size: 0.9rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.schweikart-behandlung-detail__price-table tbody tr {
	border-bottom: 1px solid var(--primary-light);
}

.schweikart-behandlung-detail__price-table tbody tr:last-child {
	border-bottom: none;
}

.schweikart-behandlung-detail__price-highlight {
	background: var(--accent-light);
}

.schweikart-behandlung-detail__price-highlight td {
	color: var(--primary-dark);
}

/* CTA */
.schweikart-behandlung-detail__cta {
	margin-top: 2.5rem;
}

/* Sidebar */
.schweikart-behandlung-detail__sidebar {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

/* Related Treatments */
.schweikart-behandlung-detail__related {
	background: var(--white);
	border-radius: var(--radius-card);
	padding: 1.5rem;
	box-shadow: var(--shadow);
}

.schweikart-behandlung-detail__related h3 {
	font-family: var(--font-heading);
	font-weight: 500;
	font-size: 1.3rem;
	color: var(--primary-dark);
	margin: 0 0 1rem;
	padding-bottom: 0.75rem;
	border-bottom: 2px solid var(--primary-light);
}

.schweikart-behandlung-detail__related-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.schweikart-behandlung-detail__related-list li + li {
	margin-top: 0.75rem;
}

.schweikart-behandlung-detail__related-link {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	text-decoration: none;
	color: var(--text);
	padding: 0.75rem;
	border-radius: 8px;
	transition: background var(--transition), transform var(--transition);
}

.schweikart-behandlung-detail__related-link:hover {
	background: var(--bg-alt);
	transform: translateX(4px);
}

.schweikart-behandlung-detail__related-icon {
	color: var(--primary);
	flex-shrink: 0;
}

.schweikart-behandlung-detail__related-link strong {
	display: block;
	font-size: 0.95rem;
	color: var(--primary-dark);
}

.schweikart-behandlung-detail__related-link small {
	display: block;
	font-size: 0.8rem;
	color: var(--text-light);
	margin-top: 0.15rem;
}

/* Promo Box */
.schweikart-behandlung-detail__promo {
	background: linear-gradient(135deg, var(--accent-light) 0%, #f5ede0 100%);
	border-radius: var(--radius-card);
	padding: 1.5rem;
	border: 2px solid var(--accent);
	text-align: center;
}

.schweikart-behandlung-detail__promo h3 {
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 1.2rem;
	color: var(--primary-dark);
	margin: 0 0 0.5rem;
}

.schweikart-behandlung-detail__promo p,
.schweikart-behandlung-detail__promo-line1,
.schweikart-behandlung-detail__promo-line1 p {
	margin: 0 0 0.5rem;
	font-size: 0.95rem;
	color: var(--text);
}

.schweikart-behandlung-detail__promo-line1 p:last-child {
	margin-bottom: 0.5rem;
}

.schweikart-behandlung-detail__promo .schweikart-btn {
	margin-top: 0.5rem;
}

.schweikart-btn--small {
	padding: 0.5rem 1.25rem;
	font-size: 0.85rem;
}

/* Contact Box */
.schweikart-behandlung-detail__contact {
	background: var(--white);
	border-radius: var(--radius-card);
	padding: 1.5rem;
	box-shadow: var(--shadow);
}

.schweikart-behandlung-detail__contact h3 {
	font-family: var(--font-heading);
	font-weight: 500;
	font-size: 1.2rem;
	color: var(--primary-dark);
	margin: 0 0 0.5rem;
}

.schweikart-behandlung-detail__contact p {
	margin: 0 0 0.4rem;
	font-size: 0.9rem;
	color: var(--text);
}

.schweikart-behandlung-detail__contact a {
	color: var(--primary-dark);
	text-decoration: none;
	font-weight: 600;
	transition: color var(--transition);
}

.schweikart-behandlung-detail__contact a:hover {
	color: var(--accent);
}

/* --------------------------------------------------------------------------
   17. Kennenlern-Angebot Section
   -------------------------------------------------------------------------- */

.schweikart-angebot {
	background: linear-gradient(135deg, var(--bg) 0%, var(--accent-light) 50%, var(--bg) 100%);
	padding-top: 4rem;
	padding-bottom: 4rem;
}

.schweikart-angebot__banner {
	position: relative;
	max-width: 760px;
	margin: 0 auto;
	padding: 3rem 2.5rem;
	background: var(--white);
	border: 2px solid var(--accent);
	border-radius: 16px;
	text-align: center;
	box-shadow: 0 8px 32px rgba(197, 168, 130, 0.15);
	overflow: hidden;
}

/* Decorative corner accents */
.schweikart-angebot__corner {
	position: absolute;
	width: 32px;
	height: 32px;
	border-color: var(--accent);
	border-style: solid;
	border-width: 0;
}

.schweikart-angebot__corner--tl {
	top: 12px;
	left: 12px;
	border-top-width: 2px;
	border-left-width: 2px;
	border-top-left-radius: 8px;
}

.schweikart-angebot__corner--tr {
	top: 12px;
	right: 12px;
	border-top-width: 2px;
	border-right-width: 2px;
	border-top-right-radius: 8px;
}

.schweikart-angebot__corner--bl {
	bottom: 12px;
	left: 12px;
	border-bottom-width: 2px;
	border-left-width: 2px;
	border-bottom-left-radius: 8px;
}

.schweikart-angebot__corner--br {
	bottom: 12px;
	right: 12px;
	border-bottom-width: 2px;
	border-right-width: 2px;
	border-bottom-right-radius: 8px;
}

.schweikart-angebot__icon {
	color: var(--accent);
	margin-bottom: 1rem;
}

.schweikart-angebot__label {
	font-family: 'Dancing Script', cursive;
	font-size: 1.25rem;
	color: var(--accent);
	margin-bottom: 0.5rem;
}

.schweikart-angebot__title {
	font-family: 'Cormorant Garamond', serif;
	font-weight: 600;
	font-size: 1.75rem;
	color: var(--primary-dark);
	margin-bottom: 0.75rem;
	line-height: 1.3;
}

.schweikart-angebot__validity {
	font-size: 1rem;
	color: var(--text-light);
	margin-bottom: 1.5rem;
}

.schweikart-angebot__divider {
	color: var(--accent);
	margin-bottom: 1.5rem;
}

.schweikart-angebot__fiver {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	background: linear-gradient(135deg, var(--accent-light) 0%, rgba(232, 220, 200, 0.4) 100%);
	border-radius: 12px;
	padding: 1.25rem 1.5rem;
	margin-bottom: 2rem;
	text-align: left;
}

.schweikart-angebot__fiver-icon {
	flex-shrink: 0;
	color: var(--accent);
	margin-top: 0.15rem;
}

.schweikart-angebot__fiver-text {
	font-size: 0.95rem;
	color: var(--text);
	line-height: 1.6;
	margin-bottom: 0;
}

/* Accent button variant (gold CTA) */
.schweikart-btn--accent {
	background: var(--accent);
	color: var(--white);
	border: 2px solid var(--accent);
	padding: 0.875rem 2.5rem;
	border-radius: 24px;
	font-family: 'Nunito', sans-serif;
	font-weight: 600;
	font-size: 1rem;
	cursor: pointer;
	transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
	display: inline-block;
	text-decoration: none;
}

.schweikart-btn--accent:hover {
	background: #b8995e;
	border-color: #b8995e;
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(197, 168, 130, 0.35);
}

/* Responsive: Angebot */
@media (max-width: 767px) {
	.schweikart-angebot__banner {
		padding: 2rem 1.5rem;
	}

	.schweikart-angebot__title {
		font-size: 1.4rem;
	}

	.schweikart-angebot__fiver {
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: 0.5rem;
	}
}

@media (min-width: 1024px) {
	.schweikart-angebot__title {
		font-size: 2rem;
	}
}

/* -------------------------------------------------------------------------
   18. Qualifikationen (US-009)
   -------------------------------------------------------------------------- */

.schweikart-qualifikationen {
	background: var(--bg);
	position: relative;
	isolation: isolate;
	overflow: hidden;
}

/* Ambient background image layer */
.schweikart-qualifikationen--ambient .schweikart-qualifikationen__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	background-color: var(--bg);
	background-image: var(--schweikart-qualifikationen-bg);
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}

/* Cream overlay (keeps text readable, tints ambient toward brand palette) */
.schweikart-qualifikationen--ambient .schweikart-qualifikationen__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background-color: rgba(249, 246, 241, 0.92);
	pointer-events: none;
}

/* Inner container lifts above bg + overlay */
.schweikart-qualifikationen__inner {
	position: relative;
	z-index: 2;
}

/* -------------------- Credentials cards -------------------- */

.schweikart-credentials {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
	max-width: 880px;
	margin: 0 auto;
}

.schweikart-credentials__card {
	background: var(--white);
	border-radius: 16px;
	padding: 2rem 1.75rem;
	box-shadow: 0 4px 24px rgba(61, 50, 40, 0.08);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	border: 1px solid rgba(139, 175, 146, 0.18);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.schweikart-credentials__card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 32px rgba(61, 50, 40, 0.12);
}

.schweikart-credentials__icon {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: var(--primary-light);
	color: var(--primary-dark);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1rem;
	flex-shrink: 0;
}

.schweikart-credentials__title {
	font-family: var(--font-heading);
	font-size: 1.35rem;
	font-weight: 600;
	color: var(--primary-dark);
	margin: 0 0 0.5rem;
	line-height: 1.3;
}

.schweikart-credentials__desc {
	font-family: var(--font-body);
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--text-light);
	margin: 0;
}

@media (min-width: 768px) {
	.schweikart-credentials {
		grid-template-columns: 1fr 1fr;
		gap: 2rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.schweikart-credentials__card {
		transition: none;
	}
	.schweikart-credentials__card:hover {
		transform: none;
	}
}

/* -------------------------------------------------------------------------
   19. Anfahrt / Directions Section
   -------------------------------------------------------------------------- */

.schweikart-anfahrt__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
}

@media (min-width: 768px) {
	.schweikart-anfahrt__grid {
		grid-template-columns: 1.2fr 1fr;
		gap: 3rem;
		align-items: start;
	}
}

/* Map embed */
.schweikart-anfahrt__map {
	border-radius: 16px;
	overflow: hidden;
	box-shadow: var(--shadow);
	position: relative;
	background: var(--primary-light);
}

.schweikart-anfahrt__map iframe {
	display: block;
	width: 100%;
	height: 320px;
	border: 0;
}

@media (min-width: 768px) {
	.schweikart-anfahrt__map iframe {
		height: 420px;
	}
}

/* Info blocks */
.schweikart-anfahrt__info {
	display: flex;
	flex-direction: column;
	gap: 1.75rem;
}

.schweikart-anfahrt__block {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
}

.schweikart-anfahrt__block-icon {
	flex-shrink: 0;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--primary-light);
	border-radius: 12px;
	color: var(--primary-dark);
}

.schweikart-anfahrt__block-title {
	font-family: 'Cormorant Garamond', serif;
	font-weight: 600;
	font-size: 1.2rem;
	color: var(--primary-dark);
	margin: 0 0 0.35rem;
}

.schweikart-anfahrt__block p,
.schweikart-anfahrt__address {
	font-style: normal;
	font-size: 0.95rem;
	line-height: 1.7;
	color: var(--text);
	margin: 0;
}

.schweikart-anfahrt__address {
	font-weight: 400;
}

/* -------------------------------------------------------------------------
   20. Kontakt Section
   -------------------------------------------------------------------------- */

.schweikart-kontakt {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2.5rem;
	margin-top: 2rem;
}

.schweikart-kontakt__form {
	background: var(--bg);
	border-radius: 16px;
	padding: 2rem 1.5rem;
	box-shadow: var(--shadow);
}

/* CF7 form field styling */
.schweikart-cf7-row {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}

.schweikart-cf7-field {
	margin-bottom: 1.25rem;
}

.schweikart-cf7-field label {
	display: block;
	font-family: var(--font-body);
	font-weight: 600;
	font-size: 0.9rem;
	color: var(--text);
	margin-bottom: 0.4rem;
}

.schweikart-cf7-field label abbr.required {
	color: #c0392b;
	text-decoration: none;
}

.schweikart-cf7-field input[type="text"],
.schweikart-cf7-field input[type="email"],
.schweikart-cf7-field input[type="tel"],
.schweikart-cf7-field textarea,
.schweikart-kontakt .wpcf7-form-control:not(.wpcf7-submit):not(.wpcf7-acceptance) {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 1.5px solid var(--primary-light);
	border-radius: 12px;
	font-family: var(--font-body);
	font-size: 1rem;
	color: var(--text);
	background: #fff;
	transition: border-color var(--transition), box-shadow var(--transition);
}

.schweikart-cf7-field input:focus,
.schweikart-cf7-field textarea:focus,
.schweikart-kontakt .wpcf7-form-control:focus {
	outline: none;
	border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(139, 175, 146, 0.15);
}

.schweikart-cf7-field textarea {
	resize: vertical;
	min-height: 120px;
}

.schweikart-cf7-consent {
	margin-bottom: 1.5rem;
}

.schweikart-cf7-consent label,
.schweikart-cf7-consent .wpcf7-list-item-label {
	font-weight: 400;
	font-size: 0.85rem;
	color: var(--text-light);
	line-height: 1.5;
}

.schweikart-cf7-consent a {
	color: var(--primary-dark);
	text-decoration: underline;
}

.schweikart-cf7-consent input[type="checkbox"] {
	margin-right: 0.5rem;
	accent-color: var(--primary);
}

/* CF7 submit button */
.schweikart-kontakt .wpcf7-submit,
.schweikart-kontakt__fallback-form button[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.85rem 2rem;
	background: var(--primary);
	color: #fff;
	border: none;
	border-radius: 24px;
	font-family: var(--font-body);
	font-size: 1rem;
	font-weight: 600;
	cursor: pointer;
	transition: background var(--transition), transform var(--transition), box-shadow var(--transition);
}

.schweikart-kontakt .wpcf7-submit:hover,
.schweikart-kontakt__fallback-form button[type="submit"]:hover {
	background: var(--primary-dark);
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(74, 124, 89, 0.25);
}

/* CF7 response messages */
.schweikart-kontakt .wpcf7-response-output {
	border-radius: 12px;
	padding: 1rem;
	margin-top: 1rem;
	font-family: var(--font-body);
	font-size: 0.9rem;
}

.schweikart-kontakt .wpcf7-mail-sent-ok {
	border-color: var(--primary);
	background: var(--primary-light);
	color: var(--primary-dark);
}

/* CF7 validation errors */
.schweikart-kontakt .wpcf7-not-valid-tip {
	color: #c0392b;
	font-size: 0.8rem;
	margin-top: 0.3rem;
}

/* Termin section — info cards above booking widget */
.schweikart-termin-info {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
	max-width: 980px;
	margin: 0 auto 2.5rem;
}

.schweikart-termin-info__card {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.25rem 1.5rem;
	background: var(--bg);
	border-radius: 14px;
	border-left: 3px solid var(--primary);
	box-shadow: var(--shadow);
}

.schweikart-termin-info__icon {
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--primary-light);
	color: var(--primary-dark);
	border-radius: 10px;
}

.schweikart-termin-info__body {
	flex: 1;
}

.schweikart-termin-info__title {
	font-family: var(--font-heading);
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--primary-dark);
	margin: 0 0 0.35rem;
}

.schweikart-termin-info__text {
	font-family: var(--font-body);
	font-size: 0.95rem;
	color: var(--text);
	line-height: 1.6;
	margin: 0;
}

@media (min-width: 768px) {
	.schweikart-termin-info {
		grid-template-columns: repeat(3, 1fr);
		gap: 1.25rem;
	}

	.schweikart-termin-info__card {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.85rem;
		padding: 1.5rem;
	}
}

/* Contact info column */
.schweikart-kontakt__info {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.schweikart-kontakt__card {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.25rem;
	background: var(--bg);
	border-radius: 12px;
	box-shadow: var(--shadow);
}

.schweikart-kontakt__card--hours {
	padding-bottom: 1rem;
}

.schweikart-kontakt__card-icon {
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--primary-light);
	color: var(--primary-dark);
	border-radius: 10px;
}

.schweikart-kontakt__card-title {
	font-family: var(--font-heading);
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--primary-dark);
	margin: 0 0 0.3rem;
}

.schweikart-kontakt__address {
	font-family: var(--font-body);
	font-style: normal;
	font-size: 0.95rem;
	color: var(--text);
	line-height: 1.6;
}

.schweikart-kontakt__link {
	font-family: var(--font-body);
	font-size: 0.95rem;
	color: var(--primary-dark);
	text-decoration: none;
	transition: color var(--transition);
}

.schweikart-kontakt__link:hover {
	color: var(--accent);
	text-decoration: underline;
}

.schweikart-kontakt__text {
	font-family: var(--font-body);
	font-size: 0.95rem;
	color: var(--text-light);
	font-style: italic;
	margin: 0;
}

.schweikart-kontakt__hours {
	border-collapse: collapse;
	font-family: var(--font-body);
	font-size: 0.9rem;
}

.schweikart-kontakt__hours td {
	padding: 0.2rem 0;
}

.schweikart-kontakt__hours td:first-child {
	font-weight: 600;
	padding-right: 1.5rem;
	color: var(--text);
}

.schweikart-kontakt__hours td:last-child {
	color: var(--text-light);
}

.schweikart-kontakt__hours-note {
	font-family: var(--font-body);
	font-size: 0.85rem;
	color: var(--text-light);
	margin: 0.4rem 0 0;
}

.schweikart-kontakt__map {
	border-radius: 12px;
	overflow: hidden;
	box-shadow: var(--shadow);
}

.schweikart-kontakt__map iframe {
	display: block;
	width: 100%;
}

/* Kontakt tablet: 2 columns */
@media (min-width: 768px) {
	.schweikart-kontakt {
		grid-template-columns: 1.2fr 1fr;
		gap: 3rem;
	}

	.schweikart-cf7-row {
		grid-template-columns: 1fr 1fr;
		gap: 1rem;
	}

	.schweikart-kontakt__form {
		padding: 2.5rem;
	}
}

/* Kontakt desktop */
@media (min-width: 1024px) {
	.schweikart-kontakt {
		gap: 4rem;
	}

	.schweikart-kontakt__form {
		padding: 3rem;
	}
}

/* -------------------------------------------------------------------------
   22. SVG Wave Dividers & Decorative Elements
   -------------------------------------------------------------------------- */

/* Wave dividers between sections */
.schweikart-wave-divider {
	position: relative;
	width: 100%;
	line-height: 0;
	margin-top: -1px;
	overflow: hidden;
}

.schweikart-wave-divider svg {
	display: block;
	width: 100%;
	height: 60px;
}

@media (min-width: 768px) {
	.schweikart-wave-divider svg {
		height: 80px;
	}
}

@media (min-width: 1024px) {
	.schweikart-wave-divider svg {
		height: 100px;
	}
}

/* Layered wave variant (Über mich → Angebot) is taller */
.schweikart-wave-divider--3 svg {
	height: 70px;
}

@media (min-width: 768px) {
	.schweikart-wave-divider--3 svg {
		height: 90px;
	}
}

@media (min-width: 1024px) {
	.schweikart-wave-divider--3 svg {
		height: 110px;
	}
}

/* -------------------------------------------------------------------------
   23. Parallax Divider (US-008) — Behandlungen → Über mich transition
   Photo-backed section with sage overlay and decorative Dancing Script quote.
   Desktop: background-attachment: fixed (parallax). Mobile + reduced-motion:
   falls back to scroll to avoid iOS jank and respect user preference.
   -------------------------------------------------------------------------- */

.schweikart-parallax-divider {
	position: relative;
	isolation: isolate;
	width: 100%;
	min-height: 40vh;
	min-height: 40dvh;
	overflow: hidden;
	background-color: var(--primary-dark);
	background-image: var(--schweikart-divider-bg);
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: scroll;
	display: flex;
	align-items: center;
	justify-content: center;
}

@media (min-width: 768px) {
	.schweikart-parallax-divider {
		background-attachment: fixed;
	}
}

@media (prefers-reduced-motion: reduce) {
	.schweikart-parallax-divider {
		background-attachment: scroll;
	}
}

.schweikart-parallax-divider__overlay {
	position: absolute;
	inset: 0;
	z-index: 0;
	background-color: rgba(74, 124, 89, 0.25);
	pointer-events: none;
}

.schweikart-parallax-divider__inner {
	position: relative;
	z-index: 1;
	text-align: center;
	padding: 3rem 1rem;
}

.schweikart-parallax-divider__quote {
	font-size: 2.25rem;
	line-height: 1.2;
	color: var(--bg);
	margin: 0;
	text-shadow: 0 2px 24px rgba(0, 0, 0, 0.45);
	letter-spacing: 0.01em;
}

@media (min-width: 768px) {
	.schweikart-parallax-divider__quote {
		font-size: 3rem;
	}
}

@media (min-width: 1024px) {
	.schweikart-parallax-divider__quote {
		font-size: 3.75rem;
	}
}

/* -------------------------------------------------------------------------
   24. Footer CTA Band (US-010) — full-width photo-backed closing prompt
   Atmospheric band sitting directly above the footer. Dark overlay keeps
   cream-text WCAG-legible against any underlying photo; background-color
   fallback preserves the band shape if the Unsplash CDN 404s.
   -------------------------------------------------------------------------- */

.schweikart-footer-cta {
	position: relative;
	isolation: isolate;
	width: 100%;
	min-height: 50vh;
	min-height: 50dvh;
	overflow: hidden;
	background-color: var(--primary-dark);
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 3rem 0;
}

.schweikart-footer-cta__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	background-image: var(--schweikart-footer-cta-bg);
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	background-color: var(--primary-dark);
}

.schweikart-footer-cta__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background-color: rgba(61, 50, 40, 0.55);
	pointer-events: none;
}

.schweikart-footer-cta__inner {
	position: relative;
	z-index: 2;
	max-width: 760px;
	margin: 0 auto;
	padding: 1rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1.25rem;
}

.schweikart-footer-cta__title {
	font-family: var(--font-heading);
	font-size: 2rem;
	line-height: 1.2;
	font-weight: 600;
	color: var(--bg);
	margin: 0;
	text-shadow: 0 2px 20px rgba(0, 0, 0, 0.45);
}

.schweikart-footer-cta__subtitle {
	font-family: var(--font-body);
	font-size: 1.05rem;
	line-height: 1.55;
	color: var(--bg);
	margin: 0;
	max-width: 560px;
	text-shadow: 0 1px 12px rgba(0, 0, 0, 0.4);
}

.schweikart-footer-cta__button {
	margin-top: 0.5rem;
}

@media (min-width: 768px) {
	.schweikart-footer-cta__title {
		font-size: 2.75rem;
	}

	.schweikart-footer-cta__subtitle {
		font-size: 1.15rem;
	}
}

@media (min-width: 1024px) {
	.schweikart-footer-cta__title {
		font-size: 3.25rem;
	}
}

/* Linen/paper texture overlay on --bg background */
body {
	position: relative;
}

body::before {
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 0;
	opacity: 0.03;
	background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%233D3228' fill-opacity='1'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

#main-content,
.schweikart-hero {
	position: relative;
	z-index: 1;
}

/* Botanical/leaf SVG decorative elements */
.schweikart-leaf-decor {
	position: absolute;
	pointer-events: none;
	opacity: 0.08;
	z-index: 0;
}

.schweikart-leaf-decor svg {
	fill: var(--primary);
}

.schweikart-leaf-decor--top-right {
	top: 20px;
	right: 20px;
}

.schweikart-leaf-decor--bottom-left {
	bottom: 20px;
	left: 20px;
	transform: rotate(180deg);
}

/* Hero variant — cream fill over dark photo, placed above the overlay
   in the top-right negative space so it never competes with the text block. */
.schweikart-leaf-decor--hero {
	z-index: 2;
	opacity: 0.14;
	top: 90px;
	right: 32px;
	transform: rotate(25deg);
}

.schweikart-leaf-decor--hero svg {
	fill: var(--bg);
}

@media (min-width: 768px) {
	.schweikart-leaf-decor--hero {
		top: 110px;
		right: 48px;
	}

	.schweikart-leaf-decor--hero svg {
		width: 200px;
		height: 200px;
	}
}

@media (min-width: 1024px) {
	.schweikart-leaf-decor--hero {
		top: 130px;
		right: 72px;
	}

	.schweikart-leaf-decor--hero svg {
		width: 260px;
		height: 260px;
	}
}

@media (max-width: 767px) {
	.schweikart-leaf-decor {
		display: none;
	}
}

/* Section heading leaf accent */
.schweikart-section__heading--decorated {
	position: relative;
}

.schweikart-section__heading--decorated::before,
.schweikart-section__heading--decorated::after {
	content: "";
	display: inline-block;
	width: 24px;
	height: 24px;
	vertical-align: middle;
	margin: 0 12px;
	opacity: 0.4;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238BAF92'%3E%3Cpath d='M17 8C8 10 5.9 16.17 3.82 21.34l1.89.66.95-2.3c.48.17.98.3 1.34.3C19 20 22 3 22 3c-1 2-8 2.25-13 3.25S2 11.5 2 13.5s1.75 3.75 1.75 3.75C7 8 17 8 17 8z'/%3E%3C/svg%3E");
	background-size: contain;
	background-repeat: no-repeat;
}

.schweikart-section__heading--decorated::after {
	transform: scaleX(-1);
}

/* -------------------------------------------------------------------------
   23. Mobile Optimization (US-029)
   -------------------------------------------------------------------------- */

/* Prevent horizontal scroll globally — use clip instead of hidden to avoid breaking position:sticky */
html,
body {
	overflow-x: clip;
}

/* Small mobile: 320px–374px */
@media (max-width: 374px) {
	:root {
		--section-padding: 3rem 0;
		--container-padding: 0 1rem;
	}

	body {
		font-size: 15px;
	}

	h1 {
		font-size: 1.75rem;
	}

	h2 {
		font-size: 1.5rem;
	}

	/* Hero adjustments */
	.schweikart-hero {
		padding: 4rem 0 6rem;
	}

	.schweikart-hero__logo {
		width: 150px;
	}

	.schweikart-hero__title {
		font-size: 1.75rem;
	}

	.schweikart-hero__subtitle {
		font-size: 1rem;
	}

	.schweikart-hero__cta {
		min-width: 180px;
		font-size: 0.85rem;
		padding: 0.7rem 1.5rem;
	}

	/* Behandlungen cards */
	.schweikart-behandlungen__body {
		padding: 1.5rem 1.25rem;
	}

	.schweikart-behandlungen__title {
		font-size: 1.25rem;
	}

	/* Angebot banner */
	.schweikart-angebot__banner {
		padding: 1.5rem 1rem;
	}

	.schweikart-angebot__title {
		font-size: 1.2rem;
	}

	/* Kontakt form */
	.schweikart-kontakt__form {
		padding: 1.25rem 1rem;
	}

	/* Footer */
	.schweikart-footer {
		padding-top: 2.5rem;
	}

	.schweikart-footer__logo {
		width: 110px;
	}

	/* Über mich portrait */
	.schweikart-ueber-mich__photo-frame {
		max-width: 240px;
	}

	/* Willkommen photo */
	.schweikart-willkommen__photo-frame {
		max-width: 280px;
	}
}

/* Standard mobile: 375px–767px — minor refinements */
@media (min-width: 375px) and (max-width: 767px) {
	.schweikart-hero__title {
		font-size: 2.25rem;
	}

	.schweikart-hero__logo {
		width: 180px;
	}
}

/* Touch-friendly: ensure minimum 44px tap targets globally */
.schweikart-btn,
.schweikart-btn--small,
.schweikart-btn--accent {
	min-height: 44px;
	min-width: 44px;
}

/* Footer legal links — ensure 44px tap height */
.schweikart-footer__legal-list a {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
}

/* Breadcrumb links — 44px tap height */
.schweikart-breadcrumb__item a {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
}

/* Nav links mobile — already padded but ensure 44px minimum */
@media (max-width: 767px) {
	.schweikart-nav__link,
	.schweikart-nav__list a {
		min-height: 44px;
		display: flex;
		align-items: center;
	}
}

/* Google Maps responsive with proper aspect ratio */
.schweikart-anfahrt__map iframe,
.schweikart-kontakt__map iframe {
	aspect-ratio: 16 / 10;
	height: auto;
	min-height: 250px;
}

@media (min-width: 768px) {
	.schweikart-anfahrt__map iframe {
		aspect-ratio: auto;
		height: 420px;
	}
}

/* Booking form mobile enhancements */
@media (max-width: 374px) {
	#schweikart-booking {
		font-size: 14px;
	}
}

/* Large desktop: 1440px+ */
@media (min-width: 1440px) {
	:root {
		--container-width: 1320px;
	}

	.schweikart-hero__title {
		font-size: 4rem;
	}

	body {
		font-size: 18px;
	}
}

/* Behandlung detail page: prevent table overflow on small screens */
@media (max-width: 480px) {
	.schweikart-behandlung-detail__price-table th,
	.schweikart-behandlung-detail__price-table td {
		padding: 0.75rem 0.75rem;
		font-size: 0.9rem;
	}

	.schweikart-behandlung-detail__title {
		font-size: 1.8rem;
	}
}

/* -------------------------------------------------------------------------
   24. Accessibility
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Screen-reader only utility */
.schweikart-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* --------------------------------------------------------------------------
   N. Responsive image wrap — LQIP blur-up placeholder
   --------------------------------------------------------------------------
   Emitted by schweikart_img( $slot, [ 'lqip' => true ] ). The wrapper exposes
   --schweikart-lqip (url to a 20px blurred Unsplash variant) via inline style;
   the ::before pseudo-element paints it until JS adds .is-loaded once the
   full-res <img> has decoded, then both layers cross-fade in 400ms.
   -------------------------------------------------------------------------- */
.schweikart-img-wrap {
	position: relative;
	display: block;
	overflow: hidden;
	background-color: var(--primary-light);
	isolation: isolate;
}

.schweikart-img-wrap::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 0;
	background-image: var(--schweikart-lqip);
	background-size: cover;
	background-position: var(--schweikart-lqip-position, center);
	opacity: 1;
	transition: opacity 400ms ease-out;
	pointer-events: none;
}

.schweikart-img-wrap > img {
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: opacity 400ms ease-out;
}

.schweikart-img-wrap.is-loaded::before {
	opacity: 0;
}

.schweikart-img-wrap.is-loaded > img {
	opacity: 1;
}

/* Broken Unsplash URL (e.g. missing CDN id): keep the <img> collapsed so its
   fallback alt text doesn't render — the bg-color placeholder remains. */
.schweikart-img-wrap.is-failed > img {
	opacity: 0;
	visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
	.schweikart-img-wrap::before,
	.schweikart-img-wrap > img {
		transition: none;
	}
}

/* Hero photo layer — LQIP-backed atmospheric image beneath the gradient. */
.schweikart-hero__photo {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
}

.schweikart-hero__img-wrap {
	width: 100%;
	height: 100%;
}

.schweikart-hero__img {
	object-fit: cover;
}

/* Let the hero photo show through the existing gradient layer. */
.schweikart-hero__photo + .schweikart-hero__bg {
	opacity: 0.7;
	mix-blend-mode: multiply;
}

/* --------------------------------------------------------------------------
   US-004 — Atmospheric hero: readability overlay, left-aligned text, Ken Burns
   -------------------------------------------------------------------------- */

/* Cinematic readability overlay: three stacked gradients create depth —
   (1) warm tone from the left so the rule-of-thirds text cluster stays legible,
   (2) vertical darkening at the bottom that anchors the composition and lets
       the wave divider read,
   (3) radial edge vignette that draws the eye to the center of the frame.
   Contrast ratio ≥ 4.5:1 against cream text per WCAG AA. */
.schweikart-hero__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background:
		radial-gradient(
			ellipse 120% 85% at 50% 50%,
			rgba(0, 0, 0, 0) 55%,
			rgba(36, 28, 22, 0.35) 100%
		),
		linear-gradient(
			to bottom,
			rgba(61, 50, 40, 0) 45%,
			rgba(36, 28, 22, 0.45) 100%
		),
		linear-gradient(
			to right,
			rgba(61, 50, 40, 0.6) 0%,
			rgba(61, 50, 40, 0.35) 45%,
			rgba(61, 50, 40, 0.08) 75%,
			rgba(61, 50, 40, 0) 100%
		);
}

@media (max-width: 767px) {
	/* On narrow viewports the text wraps wide, so darken the whole frame
	   but keep the vignette for depth. */
	.schweikart-hero__overlay {
		background:
			radial-gradient(
				ellipse 130% 90% at 50% 50%,
				rgba(0, 0, 0, 0) 50%,
				rgba(36, 28, 22, 0.35) 100%
			),
			linear-gradient(
				to bottom,
				rgba(61, 50, 40, 0.4) 0%,
				rgba(61, 50, 40, 0.35) 45%,
				rgba(36, 28, 22, 0.6) 100%
			);
	}
}

/* Lift the content above the photo, bg, and overlay layers. */
.schweikart-hero--atmospheric .schweikart-hero__inner {
	position: relative;
	z-index: 2;
	width: 100%;
	display: block;
	text-align: left;
}

.schweikart-hero--atmospheric .schweikart-hero__wave {
	z-index: 3;
}

/* Text block is left-biased (rule of thirds). Constrain width for readability. */
.schweikart-hero__content {
	max-width: 640px;
	margin-right: auto;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: left;
}

.schweikart-hero--atmospheric .schweikart-hero__logo {
	margin-bottom: 1.5rem;
	width: 140px;
	filter: drop-shadow(0 4px 16px rgba(0, 0, 0, 0.25));
}

@media (min-width: 768px) {
	.schweikart-hero--atmospheric .schweikart-hero__logo {
		width: 180px;
	}
}

/* White-ish text on the darkened overlay — warm cream reads softer than pure white. */
.schweikart-hero--atmospheric .schweikart-hero__title {
	color: var(--bg);
	text-shadow: 0 2px 16px rgba(0, 0, 0, 0.35);
	max-width: 100%;
}

.schweikart-hero--atmospheric .schweikart-hero__subtitle {
	color: var(--bg);
	text-shadow: 0 1px 10px rgba(0, 0, 0, 0.35);
}

.schweikart-hero--atmospheric .schweikart-hero__actions {
	flex-direction: column;
	align-items: stretch;
}

@media (min-width: 768px) {
	.schweikart-hero--atmospheric .schweikart-hero__actions {
		flex-direction: row;
		align-items: center;
	}
}

/* Secondary CTA over the dark photo: the default green-on-white treatment
   disappears against the warm overlay. Flip to cream border + cream text
   so it mirrors the hero headings, then fill with cream on hover. */
.schweikart-hero--atmospheric .schweikart-btn--secondary {
	color: var(--bg);
	border-color: var(--bg);
	background-color: rgba(249, 246, 241, 0.06);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
}

.schweikart-hero--atmospheric .schweikart-btn--secondary:hover {
	background-color: var(--bg);
	color: var(--primary-dark);
	border-color: var(--bg);
}

/* Ken Burns — slow zoom on the hero photo for a cinematic feel.
   Starts at scale(1) and creeps to scale(1.05) over 20s, then reverses. */
@keyframes schweikart-ken-burns {
	from {
		transform: scale(1);
	}
	to {
		transform: scale(1.05);
	}
}

.schweikart-hero--atmospheric .schweikart-hero__img {
	transform-origin: center center;
	animation: schweikart-ken-burns 20s ease-in-out infinite alternate;
	will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
	.schweikart-hero--atmospheric .schweikart-hero__img {
		animation: none;
	}
}

/* --------------------------------------------------------------------------
   Hero info card — practitioner name + address
   < 1100px: compact mode pinned to top-right, height matches logo
   ≥ 1100px: floats over the right side of the hero, vertically centered
   -------------------------------------------------------------------------- */
.schweikart-hero__card {
	position: absolute;
	top: 0;
	right: 1rem;
	z-index: 2;
	box-sizing: border-box;
	width: clamp(140px, 38vw, 170px);
	min-height: 140px;
	padding: 0.6rem 0.85rem;
	border: 1px solid rgba(249, 246, 241, 0.4);
	border-radius: 14px;
	background: linear-gradient(
		160deg,
		rgba(249, 246, 241, 0.18) 0%,
		rgba(249, 246, 241, 0.06) 100%
	);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	color: var(--bg);
	text-align: center;
	box-shadow: 0 10px 32px rgba(36, 28, 22, 0.25);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.schweikart-hero__card-eyebrow {
	display: none;
}

.schweikart-hero__card-name {
	font-family: var(--font-heading);
	font-size: 1.05rem;
	font-weight: 600;
	color: var(--bg);
	margin: 0 0 0.15rem;
	line-height: 1.2;
	letter-spacing: 0.01em;
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.3);
}

.schweikart-hero__card-title-text {
	font-family: var(--font-body);
	font-size: 0.65rem;
	color: var(--accent-light);
	margin: 0 0 0.4rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 1.25;
}

.schweikart-hero__card-divider {
	width: 28px;
	height: 1px;
	background: var(--accent);
	opacity: 0.7;
	margin: 0 auto 0.4rem;
}

.schweikart-hero__card-address {
	font-family: var(--font-body);
	font-style: normal;
	font-size: 0.75rem;
	line-height: 1.45;
	color: var(--bg);
	margin: 0;
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.3);
}

/* Tablet/medium: card matches the larger atmospheric logo height (180px) */
@media (min-width: 768px) {
	.schweikart-hero__card {
		right: 1.5rem;
		width: clamp(180px, 26vw, 220px);
		min-height: 180px;
		padding: 1rem 1rem;
	}

	.schweikart-hero__card-name {
		font-size: 1.2rem;
	}

	.schweikart-hero__card-title-text {
		font-size: 0.7rem;
	}

	.schweikart-hero__card-address {
		font-size: 0.85rem;
		line-height: 1.5;
	}
}

/* Desktop: card switches to right-side mode, vertically centered.
   Threshold = 1100px so content (max-width 640px) and card don't collide. */
@media (min-width: 1100px) {
	.schweikart-hero__card {
		top: 50%;
		right: 4rem;
		transform: translateY(-50%);
		width: 340px;
		min-height: 0;
		padding: 2.25rem 2rem;
	}

	.schweikart-hero__card-eyebrow {
		display: block;
		font-family: var(--font-heading);
		font-style: italic;
		font-weight: 500;
		font-size: 1rem;
		color: var(--accent-light);
		margin: 0 0 0.5rem;
		line-height: 1.2;
		text-shadow: 0 1px 8px rgba(0, 0, 0, 0.3);
	}

	.schweikart-hero__card-name {
		font-size: 1.75rem;
		margin-bottom: 0.3rem;
	}

	.schweikart-hero__card-title-text {
		font-size: 0.78rem;
		margin-bottom: 1rem;
	}

	.schweikart-hero__card-divider {
		width: 50px;
		margin-bottom: 1rem;
	}

	.schweikart-hero__card-address {
		font-size: 0.95rem;
		line-height: 1.6;
	}
}