/*
Theme Name: WortHalten
Description: Schlankes Child-Theme für die Website von Trauerredner Denny Haase.
Author: ScienceApps
Template: generatepress
Version: 1.0.0
Text Domain: worthalten
*/

:root {
	--wort-navy: #122128;
	--wort-navy-soft: #4a6473;
	--wort-blue: #597686;
	--wort-cream: #f5f1e9;
	--wort-gold: #c9b38f;
	--wort-text: #273239;
	--wort-white: #ffffff;
	--wort-border: rgba(16, 37, 47, 0.14);
}

html {
	scroll-behavior: smooth;
}

body {
	background: var(--wort-cream);
	color: var(--wort-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	font-size: 18px;
	line-height: 1.75;
}

a {
	color: var(--wort-navy-soft);
	text-underline-offset: 0.18em;
}

a:hover,
a:focus {
	color: var(--wort-blue);
}

.site-header {
	background: var(--wort-white);
	border-bottom: 1px solid var(--wort-border);
}

.site-header .inside-header {
	padding-top: 18px;
	padding-bottom: 18px;
}

.site-logo img {
	width: min(300px, 70vw);
	height: auto;
}

.main-navigation,
.main-navigation ul ul {
	background: var(--wort-navy);
}

.main-navigation .main-nav ul li a,
.menu-toggle,
.main-navigation .menu-bar-item > a {
	color: var(--wort-white);
	letter-spacing: 0.02em;
}

.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li:focus > a,
.main-navigation .main-nav ul li[class*="current-menu-"] > a {
	background: var(--wort-navy-soft);
	color: var(--wort-white);
}

.site-content {
	padding-top: 42px;
	padding-bottom: 54px;
}

.site-main .inside-article {
	background: var(--wort-white);
	border: 1px solid var(--wort-border);
	border-radius: 6px;
	box-shadow: 0 14px 35px rgba(16, 37, 47, 0.06);
	padding: clamp(28px, 5vw, 64px);
}

.entry-title {
	color: var(--wort-navy);
	font-size: clamp(2rem, 4vw, 3.25rem);
	line-height: 1.15;
	margin-bottom: 0.75em;
}

.entry-content h1,
.entry-content h2,
.entry-content h3 {
	color: var(--wort-navy);
	line-height: 1.22;
}

.entry-content h1 {
	font-size: clamp(2rem, 4vw, 3.45rem);
}

.entry-content h2 {
	font-size: clamp(1.55rem, 3vw, 2.25rem);
	margin-top: 1.8em;
}

.wort-hero {
	margin: calc(-1 * clamp(28px, 5vw, 64px));
	margin-bottom: clamp(32px, 5vw, 58px);
}

.wort-hero img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 6px 6px 0 0;
}

.wort-lead {
	font-size: clamp(1.12rem, 2vw, 1.35rem);
	line-height: 1.65;
	color: #334852;
	max-width: 820px;
}

.wort-narrow {
	max-width: 820px;
}

.wort-section {
	margin-top: clamp(36px, 6vw, 76px);
}

.wort-panel {
	background: #eef2f3;
	border-left: 5px solid var(--wort-blue);
	padding: clamp(22px, 4vw, 38px);
	margin: 36px 0;
}

.wort-list {
	padding-left: 1.2em;
}

.wort-list li {
	margin-bottom: 0.55em;
}

.wp-block-button__link,
.wort-button {
	background: var(--wort-navy);
	border-radius: 3px;
	color: var(--wort-white) !important;
	font-weight: 650;
	padding: 0.8em 1.35em;
	text-decoration: none;
}

.wp-block-button__link:hover,
.wp-block-button__link:focus,
.wort-button:hover,
.wort-button:focus {
	background: var(--wort-blue);
}

.wort-contact {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	margin: 32px 0;
}

.wort-contact > div {
	background: #eef2f3;
	border: 1px solid var(--wort-border);
	padding: 24px;
}

.site-info {
	background: var(--wort-navy);
	color: rgba(255,255,255,0.86);
}

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

.site-info a:hover,
.site-info a:focus {
	color: var(--wort-gold);
}

@media (max-width: 768px) {
	body {
		font-size: 17px;
	}

	.site-content {
		padding-top: 20px;
	}

	.site-main .inside-article {
		padding: 26px 20px 36px;
		border-radius: 0;
	}

	.wort-hero {
		margin: -26px -20px 30px;
	}

	.wort-hero img {
		border-radius: 0;
	}

	.wort-contact {
		grid-template-columns: 1fr;
	}
}

/* ===== WORTHALTEN PHASE 2B HEADER START ===== */

/*
 * Das Logo enthält den Markennamen bereits.
 * Die zusätzliche WordPress-Titelanzeige wird deshalb ausgeblendet.
 */
.site-branding {
	display: none;
}

.site-header {
	position: relative;
	background: var(--wort-white);
}

.site-header .inside-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	max-width: 1180px;
	margin-right: auto;
	margin-left: auto;
	padding: 16px 28px;
}

.site-logo {
	flex: 0 0 auto;
	line-height: 0;
}

.site-logo img {
	display: block;
	width: 220px;
	max-width: 100%;
	height: auto;
}

.main-navigation {
	flex: 0 0 auto;
	margin-left: auto;
}

.main-navigation .inside-navigation {
	min-height: 0;
}

.main-navigation .main-nav ul li a {
	padding-right: 18px;
	padding-left: 18px;
	line-height: 52px;
}

@media (max-width: 900px) {
	.site-header .inside-header {
		gap: 20px;
		padding-right: 20px;
		padding-left: 20px;
	}

	.site-logo img {
		width: 190px;
	}

	.main-navigation .main-nav ul li a {
		padding-right: 13px;
		padding-left: 13px;
	}
}

@media (max-width: 768px) {
	.site-header .inside-header {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: center;
		gap: 12px;
		padding: 12px 16px;
	}

	.site-logo {
		min-width: 0;
	}

	.site-logo img {
		width: 165px;
		max-width: 100%;
	}

	.main-navigation {
		width: auto;
		margin: 0;
		background: transparent;
	}

	.main-navigation .inside-navigation {
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}

	.menu-toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 48px;
		height: 48px;
		min-height: 48px;
		margin: 0;
		padding: 0;
		color: var(--wort-white);
		background: var(--wort-navy);
		line-height: 1;
	}

	.menu-toggle:hover,
	.menu-toggle:focus {
		color: var(--wort-white);
		background: var(--wort-navy-soft);
	}

	.menu-toggle .mobile-menu {
		position: absolute;
		overflow: hidden;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		border: 0;
		clip: rect(0 0 0 0);
		white-space: nowrap;
	}

	.main-navigation.toggled {
		grid-column: 1 / -1;
		width: 100%;
	}

	.main-navigation.toggled .inside-navigation {
		display: block;
	}

	.main-navigation.toggled .menu-toggle {
		margin-left: auto;
	}

	.main-navigation.toggled .main-nav {
		width: 100%;
		margin-top: 10px;
	}

	.main-navigation.toggled .main-nav ul {
		display: block;
		width: 100%;
	}

	.main-navigation.toggled .main-nav ul li {
		width: 100%;
	}

	.main-navigation.toggled .main-nav ul li a {
		width: 100%;
		padding: 0 18px;
		line-height: 48px;
	}

	.entry-content h1 {
		font-size: 1.8rem;
		line-height: 1.22;
	}
}

/* ===== WORTHALTEN PHASE 2B HEADER END ===== */

/* ===== WORTHALTEN PHASE 2D MENU COLORS START ===== */

/*
 * Farbpalette aus dem WortHalten-Header:
 *
 * Primär: #4a6473
 * Hell:   #597686
 * Dunkel: #122128
 */

.wp-block-button__link,
.wort-button {
	background: var(--wort-navy-soft);
}

.wp-block-button__link:hover,
.wp-block-button__link:focus,
.wort-button:hover,
.wort-button:focus {
	background: var(--wort-navy);
}

a:focus-visible,
button:focus-visible,
.menu-toggle:focus-visible {
	outline: 3px solid var(--wort-blue);
	outline-offset: 3px;
}

@media (max-width: 768px) {
	/*
	 * GeneratePress gibt beim Inline-Mobilmenü einen Schalter im
	 * mobile-menu-control-wrapper aus. Dieser ist der sichtbare und
	 * funktionale Hauptschalter.
	 */
	.has-inline-mobile-toggle .mobile-menu-control-wrapper {
		display: flex !important;
		flex-wrap: nowrap;
		align-items: center;
		justify-content: flex-end;
		margin-left: auto;
		background: transparent;
	}

	.mobile-menu-control-wrapper .menu-toggle {
		display: flex !important;
		flex: 0 0 48px;
		align-items: center;
		justify-content: center;
		width: 48px;
		min-width: 48px;
		max-width: 48px;
		height: 48px;
		min-height: 48px;
		margin: 0;
		padding: 0;
		color: var(--wort-white) !important;
		background: var(--wort-navy) !important;
		border: 0;
		line-height: 1;
	}

	.mobile-menu-control-wrapper .menu-toggle:hover,
	.mobile-menu-control-wrapper .menu-toggle:focus {
		color: var(--wort-white) !important;
		background: var(--wort-navy-soft) !important;
	}

	/*
	 * Der zweite, innerhalb von #site-navigation ausgegebene
	 * GeneratePress-Schalter bleibt verborgen. Unsere vorherige
	 * display:flex-Regel hatte ihn irrtümlich sichtbar gemacht.
	 */
	.has-inline-mobile-toggle #site-navigation .menu-toggle {
		display: none !important;
	}

	.has-inline-mobile-toggle #site-navigation {
		grid-column: 1 / -1;
		width: 100%;
		margin: 0;
		background: transparent !important;
	}

	.has-inline-mobile-toggle
	#site-navigation:not(.toggled)
	.main-nav {
		display: none !important;
	}

	.has-inline-mobile-toggle
	#site-navigation.toggled
	.inside-navigation {
		display: block !important;
		width: 100%;
		background: transparent !important;
	}

	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav {
		display: block !important;
		width: 100%;
		margin-top: 10px;
		background: var(--wort-navy) !important;
		border: 1px solid rgba(255, 255, 255, 0.1);
		box-shadow: 0 10px 24px rgba(18, 33, 40, 0.2);
	}

	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav > ul {
		display: block !important;
		width: 100%;
		margin: 0;
		padding: 0;
		background: var(--wort-navy) !important;
	}

	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav ul li {
		display: block;
		float: none;
		width: 100%;
		margin: 0;
		background: var(--wort-navy) !important;
	}

	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav ul li a {
		display: block;
		width: 100%;
		padding: 0 18px;
		color: var(--wort-white) !important;
		background: var(--wort-navy) !important;
		border-bottom: 1px solid rgba(255, 255, 255, 0.12);
		line-height: 48px;
		text-align: left;
	}

	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav ul li:last-child a {
		border-bottom: 0;
	}

	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav ul li:hover > a,
	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav ul li:focus > a,
	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav ul li[class*="current-menu-"] > a {
		color: var(--wort-white) !important;
		background: var(--wort-navy-soft) !important;
	}
}

/* ===== WORTHALTEN PHASE 2D MENU COLORS END ===== */

/* ===== WORTHALTEN PHASE 2E CONTACT FOOTER START ===== */

.wort-contact-primary {
	margin-top: 34px;
	margin-bottom: 42px;
}

.wort-contact-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	background: #eef2f3;
	border: 1px solid var(--wort-border);
	border-top: 5px solid var(--wort-navy-soft);
	padding: clamp(22px, 4vw, 32px);
}

.wort-contact-card p {
	margin: 4px 0 0;
}

.wort-contact-label {
	color: var(--wort-navy-soft);
	font-size: 0.9rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.wort-contact-value {
	overflow-wrap: anywhere;
	color: var(--wort-navy);
	font-size: clamp(1.08rem, 2vw, 1.3rem);
	font-weight: 700;
	text-decoration-thickness: 1px;
}

.wort-contact-hint {
	margin-bottom: 30px;
}

.wort-contact-hint ul {
	margin-bottom: 0;
}

.site-info .inside-site-info {
	padding: 24px 20px;
}

.worthalten-footer-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7px;
	width: 100%;
	text-align: center;
}

.worthalten-footer-brand {
	font-weight: 650;
}

.worthalten-footer-contact,
.worthalten-footer-legal {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0 5px;
}

.worthalten-footer-contact a,
.worthalten-footer-legal a {
	color: var(--wort-white);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
}

.worthalten-footer-contact a:hover,
.worthalten-footer-contact a:focus,
.worthalten-footer-legal a:hover,
.worthalten-footer-legal a:focus {
	color: var(--wort-gold);
}

@media (max-width: 768px) {
	.wort-contact-primary {
		grid-template-columns: 1fr;
		margin-top: 26px;
		margin-bottom: 34px;
	}

	.wort-contact-card {
		padding: 22px 18px;
	}

	.worthalten-footer-contact,
	.worthalten-footer-legal {
		flex-direction: column;
		align-items: center;
		gap: 5px;
	}

	.worthalten-footer-contact span,
	.worthalten-footer-legal span {
		display: none;
	}
}

/* ===== WORTHALTEN PHASE 2E CONTACT FOOTER END ===== */

/* ===== WORTHALTEN PHASE 2G LAYOUT START ===== */

/*
 * Globaler Header:
 * ganz oben das Foto über die volle Browserbreite,
 * anschließend die Navigation.
 */
.worthalten-global-hero {
	width: 100%;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background: #122128;
	line-height: 0;
}

.worthalten-global-hero .worthalten-hero-image {
	display: block;
	width: 100%;
	max-width: none;
	height: auto;
	max-height: 560px;
	margin: 0;
	object-fit: cover;
	object-position: center center;
}

/*
 * Alte WortHalten-Logozeile vollständig ausblenden.
 */
.site-branding,
.site-logo,
.custom-logo-link {
	display: none !important;
}

.site-header {
	margin: 0;
	padding: 0;
	background: var(--wort-navy);
	border: 0;
}

.site-header .inside-header {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: none;
	margin: 0;
	padding: 0;
}

/*
 * Navigation direkt unter dem Headerbild.
 */
.main-navigation {
	width: 100%;
	margin: 0;
	background: var(--wort-navy);
}

.main-navigation .inside-navigation {
	max-width: 1180px;
	margin: 0 auto;
	padding: 0 20px;
}

.main-navigation .main-nav > ul {
	justify-content: center;
}

.main-navigation .main-nav ul li a {
	color: var(--wort-white);
	line-height: 58px;
}

.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li:focus > a,
.main-navigation .main-nav ul li[class*="current-menu-"] > a,
.main-navigation .main-nav ul li[class*="current_page_"] > a {
	color: var(--wort-white);
	background: var(--wort-navy-soft);
}

/*
 * Über-mich-Portrait.
 */
.worthalten-about-portrait {
	max-width: 360px;
	margin-bottom: 26px;
}

.worthalten-about-portrait img {
	display: block;
	width: 100%;
	height: auto;
}

/*
 * Farbwelt.
 */
body {
	background: var(--wort-beige);
}

.site-main .inside-article {
	background: var(--wort-white);
}

.wort-panel,
.wort-contact-card {
	background: var(--wort-beige);
}

.site-info {
	background: var(--wort-navy);
}

/*
 * Footer ohne Personenname.
 */
.worthalten-footer-brand {
	color: var(--wort-white);
}

@media (min-width: 769px) {
	.worthalten-about-portrait.alignright {
		float: right;
		margin:
			0
			0
			28px
			34px;
	}
}

@media (max-width: 768px) {
	.worthalten-global-hero .worthalten-hero-image {
		max-height: none;
		object-fit: contain;
	}

	.site-header .inside-header {
		display: block;
	}

	.main-navigation .inside-navigation {
		padding: 10px 16px;
	}

	.has-inline-mobile-toggle
	.mobile-menu-control-wrapper {
		display: flex !important;
		align-items: center;
		justify-content: flex-end;
		width: 100%;
		margin: 0;
		background: transparent;
	}

	.mobile-menu-control-wrapper
	.menu-toggle {
		display: flex !important;
		align-items: center;
		justify-content: center;
		width: 48px;
		min-width: 48px;
		height: 48px;
		margin: 0;
		padding: 0;
		color: var(--wort-white) !important;
		background: var(--wort-navy) !important;
	}

	.has-inline-mobile-toggle
	#site-navigation
	.menu-toggle {
		display: none !important;
	}

	.has-inline-mobile-toggle
	#site-navigation {
		width: 100%;
		margin: 0;
		background: transparent !important;
	}

	.has-inline-mobile-toggle
	#site-navigation:not(.toggled)
	.main-nav {
		display: none !important;
	}

	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav {
		display: block !important;
		width: 100%;
		margin: 0;
		background: var(--wort-navy) !important;
	}

	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav > ul {
		display: block !important;
		width: 100%;
		margin: 0;
		padding: 0;
	}

	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav ul li {
		display: block;
		width: 100%;
	}

	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav ul li a {
		display: block;
		width: 100%;
		padding: 0 18px;
		color: var(--wort-white) !important;
		background: var(--wort-navy) !important;
		border-bottom:
			1px solid
			rgba(255, 255, 255, 0.12);
		line-height: 48px;
		text-align: left;
	}

	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav ul li:hover > a,
	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav ul li:focus > a,
	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav ul li[class*="current-menu-"] > a,
	.has-inline-mobile-toggle
	#site-navigation.toggled
	.main-nav ul li[class*="current_page_"] > a {
		background: var(--wort-navy-soft) !important;
	}

	.worthalten-about-portrait,
	.worthalten-about-portrait.alignright {
		float: none !important;
		max-width: 100%;
		margin:
			0
			0
			26px
			0;
	}
}

/* ===== WORTHALTEN PHASE 2G LAYOUT END ===== */

/* ===== WORTHALTEN PHASE 2H-B3 CONTACT FORM CSS START ===== */

.worthalten-contact-form-wrap {
    margin-top: 2.5rem;
}

.worthalten-contact-form-wrap > h2 {
    margin-bottom: 0.75rem;
}

.worthalten-form-intro {
    margin-bottom: 1.5rem;
}

.worthalten-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem 1.5rem;
}

.worthalten-form-field {
    min-width: 0;
}

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

.worthalten-form-field label {
    display: block;
    margin-bottom: 0.4rem;
    font-weight: 600;
}

.worthalten-optional {
    margin-left: 0.35rem;
    font-size: 0.88em;
    font-weight: 400;
    opacity: 0.72;
}

.worthalten-form-field input,
.worthalten-form-field textarea {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    padding: 0.8rem 0.9rem;
    border: 1px solid rgba(60, 52, 45, 0.28);
    border-radius: 0.35rem;
    background: #fff;
    color: inherit;
    font: inherit;
    line-height: 1.45;
}

.worthalten-form-field textarea {
    min-height: 11rem;
    resize: vertical;
}

.worthalten-form-field input:focus,
.worthalten-form-field textarea:focus {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.worthalten-form-privacy {
    margin: 1.25rem 0;
    font-size: 0.94rem;
}

.worthalten-contact-submit {
    display: inline-block;
    min-height: 2.8rem;
    padding: 0.75rem 1.25rem;
    border: 1px solid currentColor;
    border-radius: 0.35rem;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.worthalten-contact-submit:hover,
.worthalten-contact-submit:focus-visible {
    text-decoration: underline;
}

.worthalten-form-notice {
    margin: 0 0 1.5rem;
    padding: 1rem 1.1rem;
    border: 1px solid currentColor;
    border-radius: 0.35rem;
}

.worthalten-form-success {
    border-left-width: 0.35rem;
}

.worthalten-form-error {
    border-left-width: 0.35rem;
}

.worthalten-contact-honeypot {
    position: absolute !important;
    left: -10000px !important;
    top: auto !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

@media (max-width: 700px) {
    .worthalten-form-grid {
        grid-template-columns: 1fr;
    }

    .worthalten-form-field-full {
        grid-column: auto;
    }

    .worthalten-contact-submit {
        width: 100%;
    }
}

/* ===== WORTHALTEN PHASE 2H-B3 CONTACT FORM CSS END ===== */

/* ===== WORTHALTEN PHASE 2H-C2A-R3-R1 DESKTOP NAV OVERFLOW FIX START ===== */

/*
 * Desktop-Layout:
 * Das Branding-Element besitzt effektiv keine Breite.
 * Der bisherige horizontale Flex-Abstand verschiebt dadurch
 * die vollbreite Navigation und erzeugt 16 Pixel Seitenüberstand.
 */
@media (min-width: 769px) {
    #masthead .inside-header {
        column-gap: 0 !important;
    }
}

/* ===== WORTHALTEN PHASE 2H-C2A-R3-R1 DESKTOP NAV OVERFLOW FIX END ===== */

/* ===== WORTHALTEN PHASE 2H-D1 DENNY CHANGES START ===== */

/* Lead-Absätze auf normale Fließtextgröße zurückführen. */
.wort-lead {
    font-size: inherit;
}

/* Über mich: DH04 auf Desktop rechts, Text darf daneben fließen. */
@media (min-width: 769px) {
    body.page-id-22 .worthalten-about-portrait {
        float: right;
        width: min(42%, 440px);
        max-width: 440px;
        margin: 0 0 1.5rem 2rem;
    }
}

@media (max-width: 768px) {
    body.page-id-22 .worthalten-about-portrait {
        float: none;
        width: 100%;
        max-width: 100%;
        margin: 0 0 1.5rem;
    }
}

/* Denny: Sonderseite in Grün hervorheben. */
.main-navigation
.main-nav
ul
li.worthalten-nav-lebzeiten > a {
    color: #00bc6f !important;
    font-weight: 700;
}

.main-navigation
.main-nav
ul
li.worthalten-nav-lebzeiten:hover > a,
.main-navigation
.main-nav
ul
li.worthalten-nav-lebzeiten:focus > a,
.main-navigation
.main-nav
ul
li.worthalten-nav-lebzeiten[class*="current-menu-"] > a,
.main-navigation
.main-nav
ul
li.worthalten-nav-lebzeiten[class*="current_page_"] > a {
    color: #00bc6f !important;
}

/* ===== WORTHALTEN PHASE 2H-D1 DENNY CHANGES END ===== */

/* ===== WORTHALTEN PHASE 2H-D1-R3-R1 MOBILE LEBZEITEN NAV START ===== */

@media (max-width: 768px) {
    .main-navigation.toggled
    .main-nav
    ul
    li.worthalten-nav-lebzeiten > a {
        color: #00bc6f !important;
        font-weight: 700;
    }
}

/* ===== WORTHALTEN PHASE 2H-D1-R3-R1 MOBILE LEBZEITEN NAV END ===== */

/* ===== WORTHALTEN PHASE 2H-D1-R4 LEBZEITEN NAV URL FIX START ===== */

/*
 * Der Sonderpunkt soll unabhängig von GeneratePress-Menüklassen
 * auf Desktop und Mobile grün hervorgehoben werden.
 */
#site-navigation a[href*="/ihre-rede-zu-lebzeiten/"],
.main-navigation a[href*="/ihre-rede-zu-lebzeiten/"] {
    color: #00bc6f !important;
    font-weight: 700 !important;
}

/* ===== WORTHALTEN PHASE 2H-D1-R4 LEBZEITEN NAV URL FIX END ===== */

/* ===== WORTHALTEN PHASE 2H-D1-R5 FINAL MOBILE LEBZEITEN COLOR START ===== */

/*
 * Die bestehende mobile Toggle-Regel setzt alle Links mit einer
 * hochspezifischen !important-Regel auf Weiß.
 * Dieser gezielte Selektor ist spezifischer und erhält Dennys
 * Sondernavigation auch mobil in #00bc6f.
 */
@media (max-width: 768px) {
    .has-inline-mobile-toggle
    #site-navigation.toggled
    .main-nav
    ul
    li.worthalten-nav-lebzeiten > a {
        color: #00bc6f !important;
        font-weight: 700 !important;
    }
}

/* ===== WORTHALTEN PHASE 2H-D1-R5 FINAL MOBILE LEBZEITEN COLOR END ===== */

/* ===== WORTHALTEN PHASE 2H-D2 GLOBAL CTA START ===== */

.worthalten-page-cta {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 0.75rem;
    margin-top: clamp(2rem, 5vw, 3.5rem);
}

.worthalten-page-cta__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-height: 3rem;
    padding: 0.8em 1.35em;
    border-radius: 3px;
    background: var(--wort-navy-soft);
    color: var(--wort-white) !important;
    font-weight: 650;
    line-height: 1.25;
    text-align: center;
    text-decoration: none;
}

.worthalten-page-cta__button--contact:hover,
.worthalten-page-cta__button--contact:focus-visible {
    background: var(--wort-navy);
    color: var(--wort-white) !important;
}

.worthalten-page-cta__button--lifetime {
    background: #00bc6f;
    color: var(--wort-navy) !important;
    font-weight: 700;
}

.worthalten-page-cta__button--lifetime:hover,
.worthalten-page-cta__button--lifetime:focus-visible {
    background: #00a862;
    color: var(--wort-navy) !important;
}

.worthalten-page-cta__button:focus-visible {
    outline: 3px solid var(--wort-blue);
    outline-offset: 3px;
}

@media (max-width: 600px) {
    .worthalten-page-cta {
        flex-direction: column;
    }

    .worthalten-page-cta__button {
        width: 100%;
    }
}

/* ===== WORTHALTEN PHASE 2H-D2 GLOBAL CTA END ===== */

/* ===== WORTHALTEN PHASE 2H-E1 DAS WESENTLICHE WATERMARK START ===== */

/*
 * Seitenspezifisches Weltenbaum-Wasserzeichen.
 * Das Bild bleibt ein dekorativer Hintergrund und wird deshalb nicht als
 * zusätzliches Inhaltsbild oder mit redundantem Alternativtext ausgegeben.
 */
body.page-id-92
.site-main > article.page .inside-article {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}

body.page-id-92
.site-main > article.page .inside-article::before {
    position: absolute;
    z-index: 0;
    inset: 0;
    display: block;
    content: "";
    pointer-events: none;
    background-image: url("https://trauerrede-worthalten.de/wp-content/uploads/2026/08/Weltenbaum.png");
    background-repeat: no-repeat;
    background-position: center 56%;
    background-size: min(72%, 760px) auto;
    opacity: 0.075;
    filter: grayscale(1);
}

body.page-id-92
.site-main > article.page .inside-article > * {
    position: relative;
    z-index: 1;
}

@media (max-width: 768px) {
    body.page-id-92
    .site-main > article.page .inside-article::before {
        background-position: center 50%;
        background-size: 92% auto;
        opacity: 0.06;
    }
}

/* ===== WORTHALTEN PHASE 2H-E1 DAS WESENTLICHE WATERMARK END ===== */

/* ===== WORTHALTEN PHASE 2H-E2 PHOTOGRAFIE START ===== */

.worthalten-photografie-intro::after {
    display: table;
    clear: both;
    content: "";
}

.worthalten-photografie-portrait {
    margin-bottom: 1.5rem;
}

.worthalten-photografie-portrait img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 3px;
}

.worthalten-photografie-portrait figcaption {
    margin-top: 0.45rem;
    font-size: 0.88rem;
    text-align: center;
}

.worthalten-certificate-link {
    margin-top: 1.5rem;
    font-weight: 600;
}

.worthalten-document-meta {
    font-size: 0.9em;
    font-weight: 400;
}

.worthalten-photografie-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.worthalten-photografie-gallery figure {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    border-radius: 3px;
    background: #eef2f3;
    aspect-ratio: 4 / 3;
}

.worthalten-photografie-gallery img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (min-width: 769px) {
    .worthalten-photografie-portrait {
        float: right;
        width: min(34%, 340px);
        margin: 0 0 1.5rem 2rem;
    }
}

@media (max-width: 768px) {
    .worthalten-photografie-portrait {
        float: none;
        width: 100%;
        max-width: 420px;
        margin: 0 auto 1.5rem;
    }

    .worthalten-photografie-gallery {
        grid-template-columns: 1fr;
    }
}

/* ===== WORTHALTEN PHASE 2H-E2 PHOTOGRAFIE END ===== */

/* ===== WORTHALTEN PHASE 2H-E2-R1 MENU FLIPBOOK CONSENT START ===== */

.worthalten-flipbook-consent {
    max-width: 700px;
    margin: 3.25rem auto 0;
    padding: clamp(1.25rem, 3vw, 2rem);
    border: 1px solid var(--wort-border);
    border-radius: 4px;
    background: #eef2f3;
}

.worthalten-flipbook-consent > h2 {
    margin-top: 0;
}

.worthalten-flipbook-decision p,
.worthalten-flipbook-denied p {
    margin-bottom: 1.25rem;
}

.worthalten-flipbook-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

.worthalten-flipbook-choice {
    box-sizing: border-box;
    width: 100%;
    min-height: 3rem;
    padding: 0.75rem 1rem;
    border: 1px solid var(--wort-navy-soft);
    border-radius: 3px;
    background: var(--wort-navy-soft);
    color: var(--wort-white);
    font: inherit;
    font-weight: 650;
    cursor: pointer;
}

.worthalten-flipbook-choice:hover,
.worthalten-flipbook-choice:focus-visible {
    background: var(--wort-navy);
    border-color: var(--wort-navy);
}

.worthalten-flipbook-privacy-link {
    margin: 1rem 0 0;
    font-size: 0.94rem;
}

.worthalten-flipbook-frame {
    position: relative;
    width: 100%;
    min-height: 250px;
    aspect-ratio: 8 / 5;
    overflow: hidden;
    border-radius: 3px;
    background: #fff;
}

.worthalten-flipbook-frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.worthalten-flipbook-loaded-controls {
    margin-top: 0.85rem;
    text-align: right;
}

.worthalten-flipbook-settings {
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--wort-navy-soft);
    font: inherit;
    text-decoration: underline;
    text-underline-offset: 0.18em;
    cursor: pointer;
}

.worthalten-flipbook-settings:hover,
.worthalten-flipbook-settings:focus-visible {
    color: var(--wort-navy);
}

@media (min-width: 769px) and (max-width: 1100px) {
    .main-navigation .main-nav ul li a {
        padding-right: 6px !important;
        padding-left: 6px !important;
        font-size: 13px;
        letter-spacing: 0;
    }
}

@media (min-width: 1101px) and (max-width: 1300px) {
    .main-navigation .main-nav ul li a {
        padding-right: 10px !important;
        padding-left: 10px !important;
        font-size: 14px;
        letter-spacing: 0;
    }
}

@media (max-width: 768px) {
    .worthalten-flipbook-consent {
        margin-top: 2.5rem;
        padding: 1.15rem;
    }

    .worthalten-flipbook-actions {
        grid-template-columns: 1fr;
    }

    .worthalten-flipbook-loaded-controls {
        text-align: left;
    }
}

/* ===== WORTHALTEN PHASE 2H-E2-R1 MENU FLIPBOOK CONSENT END ===== */

/* ===== WORTHALTEN PHASE 2H-G1 CLIENT REFINEMENTS START ===== */

/*
 * FlipHTML5: Die unmittelbar erforderliche Kurzinformation bleibt vor der
 * Einwilligung sichtbar, steht aber dezent unter den beiden Schaltflächen.
 */
.worthalten-flipbook-consent-note {
    margin: 0.8rem 0 0 !important;
    color: var(--wort-navy-soft);
    font-size: 0.82rem;
    line-height: 1.55;
}

.worthalten-flipbook-privacy-link {
    margin: 0.35rem 0 0;
    font-size: 0.82rem;
}

/*
 * Trustpilot: ruhige, markenneutrale Karte ohne externes Widget und ohne
 * Drittverbindung vor dem bewussten Klick.
 */
.worthalten-trustpilot-card {
    margin: 3rem 0 0;
    padding: clamp(1.25rem, 3vw, 1.8rem);
    border: 1px solid var(--wort-border);
    border-radius: 4px;
    background: #eef2f3;
}

.worthalten-trustpilot-card h2 {
    margin-top: 0;
    margin-bottom: 0.7rem;
}

.worthalten-trustpilot-card__copy p {
    margin-bottom: 1.1rem;
}

.worthalten-trustpilot-card__action {
    margin: 0;
}

.worthalten-trustpilot-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 3rem;
    padding: 0.75rem 1.15rem;
    border: 1px solid var(--wort-navy-soft);
    border-radius: 3px;
    background: var(--wort-navy-soft);
    color: var(--wort-white) !important;
    font-weight: 650;
    line-height: 1.35;
    text-align: center;
    text-decoration: none;
}

.worthalten-trustpilot-button:hover,
.worthalten-trustpilot-button:focus-visible {
    border-color: var(--wort-navy);
    background: var(--wort-navy);
    color: var(--wort-white) !important;
}

.worthalten-trustpilot-button:focus-visible {
    outline: 3px solid var(--wort-gold);
    outline-offset: 3px;
}

.worthalten-trustpilot-card__note {
    margin: 0.7rem 0 0;
    color: var(--wort-navy-soft);
    font-size: 0.82rem;
}

@media (max-width: 768px) {
    .worthalten-trustpilot-button {
        width: 100%;
    }
}

/* ===== WORTHALTEN PHASE 2H-G1 CLIENT REFINEMENTS END ===== */

/* ===== WORTHALTEN PHASE 2H-G3 SPRECHPROBE START ===== */

.worthalten-page-cta__button--speech {
    border: 0;
    background: var(--wort-navy-soft);
    color: var(--wort-white) !important;
    font-family: inherit;
    font-size: inherit;
    font-weight: 650;
    cursor: pointer;
    appearance: none;
}

.worthalten-page-cta__button--speech::before {
    margin-right: 0.55em;
    font-size: 0.82em;
    line-height: 1;
    content: "▶";
}

.worthalten-page-cta__button--speech:hover,
.worthalten-page-cta__button--speech:focus-visible {
    background: var(--wort-navy);
    color: var(--wort-white) !important;
}

.worthalten-speech-sample-player {
    width: min(100%, 34rem);
    margin-top: 0.8rem;
}

.worthalten-speech-sample-player[hidden] {
    display: none !important;
}

.worthalten-speech-sample-player audio {
    display: block;
    width: 100%;
    max-width: 100%;
}

/* ===== WORTHALTEN PHASE 2H-G3 SPRECHPROBE END ===== */