/*
 * Landleben Gestaltung: Familie (v1.3)
 * G1 Familienleiste · G2 Schwester-Karte · G3 gemeinsame Fußzeile · G4 Verwandten-Link
 * LK1 Status im Kopf · LK3 Fuß als Hofladen
 * Die Gartenseite (wuchsrichtung.de) hat dieselben Bausteine in Grün.
 */

:root {
	--ll-wr: #4f5d3a;          /* Moos: die Farbe der Schwester */
	--ll-wr-tief: #2f3a27;
	--ll-wr-sanft: #e9ecdf;
	--ll-wr-tinte: #23291f;
	--ll-sanft: #efe6d8;       /* helles Papier für Flächen */
	--ll-tief: #3b2a1e;
	--ll-familie-h: 34px;
}

/* ------------------------------------------------------------------
 * Gemeinsame Zeichen (Federstrich)
 * ------------------------------------------------------------------ */

.ll-zeichen,
.ll-zeichen-gross,
.ll-pfeil {
	flex: none;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.3;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ll-zeichen { width: 14px; height: 14px; }
.ll-zeichen-gross { width: auto; height: 34px; stroke-width: 1.1; }
.ll-pfeil { width: 1em; height: 1em; stroke-width: 1.5; transition: translate .4s var(--ll-weich); }

/* Kicker-Zeile mit kurzer Linie (wie T2, als Klasse für eigene Bausteine) */
.ll-kick {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0 0 6px;
	font-size: 11px;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: .3em;
	text-transform: uppercase;
	color: var(--ll-braun);
}

.ll-kick::after { content: ""; width: 40px; height: 1px; background: currentColor; opacity: .5; }

/* Federstrich: die Linie zieht sich beim Drüberfahren zurück und wächst neu */
.ll-feder {
	display: inline-flex;
	align-items: center;
	gap: .5em;
	color: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
}

.ll-feder > span {
	padding-bottom: 3px;
	background: linear-gradient(currentColor 0 0) 100% 100% / 100% 1px no-repeat;
}

@keyframes ll-federstrich {
	0% { background-size: 100% 1px; background-position: 100% 100%; }
	45% { background-size: 0 1px; background-position: 100% 100%; }
	50% { background-size: 0 1px; background-position: 0 100%; }
	100% { background-size: 100% 1px; background-position: 0 100%; }
}

@media (hover: hover) {
	a:hover .ll-feder > span,
	.ll-feder:hover > span { animation: ll-federstrich .7s cubic-bezier(.65, 0, .35, 1); }
	a:hover .ll-pfeil,
	.ll-feder:hover .ll-pfeil { translate: 3px -3px; }
}

/* ------------------------------------------------------------------
 * G1 Familienleiste
 * ------------------------------------------------------------------ */

.ll-familie {
	position: relative;
	z-index: 6;
	height: var(--ll-familie-h);
	background: var(--ll-sanft);
	background-image: var(--ll-rauschen);
	color: var(--ll-tinte);
	border-bottom: 1px solid rgba(59, 42, 30, .14);
	font-size: 11px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: .1em;
	text-transform: uppercase;
	white-space: nowrap;
	overflow: hidden;
}

.ll-familie-innen {
	display: flex;
	align-items: center;
	gap: 18px;
	height: 100%;
	max-width: var(--ast-container-width, var(--global-content-width, 1200px));
	margin: 0 auto;
	padding: 0 20px;
}

.ll-familie-hier,
.ll-familie-schwester {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-width: 0;
}

.ll-familie-hier > span,
.ll-familie-schwester > span { overflow: hidden; text-overflow: ellipsis; }

.ll-familie-hier::after { content: ""; flex: none; width: 1px; height: 14px; margin-left: 11px; background: currentColor; opacity: .3; }

.ll-familie-schwester {
	color: var(--ll-wr);
	text-decoration: none;
}

.ll-familie-schwester > span {
	background: linear-gradient(currentColor 0 0) 0 100% / 0 1px no-repeat;
	transition: background-size .35s var(--ll-weich, ease);
}

.ll-familie-schwester:hover { color: var(--ll-wr-tief); }
.ll-familie-schwester:hover > span { background-size: 100% 1px; }

/* Astra legt den durchsichtigen Kopf über das Titelbild: dann sitzt er unter der Leiste. */
body.ll-mit-familienleiste.ast-theme-transparent-header #masthead { top: var(--ll-familie-h); }
body.ll-mit-familienleiste.ast-theme-transparent-header.admin-bar #masthead { top: calc(var(--ll-familie-h) + 32px); }

@media (max-width: 782px) {
	body.ll-mit-familienleiste.ast-theme-transparent-header.admin-bar #masthead { top: calc(var(--ll-familie-h) + 46px); }
}

@media (max-width: 600px) {
	/* Am Handy nur die beiden Namen, links wir, rechts die Schwester */
	.ll-familie-innen { justify-content: space-between; padding-inline: 16px; }
	.ll-familie-zusatz { display: none; }
	.ll-familie-hier::after { display: none; }
	.ll-familie-schwester { align-self: stretch; padding-inline-start: 16px; }
}

/* ------------------------------------------------------------------
 * G2 Schwester-Karte: ein grünes Fenster in den Garten
 * ------------------------------------------------------------------ */

.ll-schwester {
	display: grid;
	grid-template-columns: 140px minmax(0, 1fr);
	gap: 20px;
	align-items: center;
	max-width: 560px;
	margin: 24px auto;
	padding: 18px;
	text-align: left;
	border-radius: 3px;
	background-color: var(--ll-wr-sanft);
	background-image: var(--ll-rauschen);
	color: var(--ll-wr-tinte);
	text-decoration: none;
	box-shadow: 0 16px 30px -24px rgba(35, 41, 31, .6);
}

.ll-schwester:hover,
.ll-schwester:focus { color: var(--ll-wr-tinte); }

.ll-schwester-bild {
	display: grid;
	place-items: end center;
	height: 160px;
	overflow: hidden;
	border-radius: 2px;
	background: #d8dec8;
	color: var(--ll-wr);
}

.ll-schwester-bild img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: scale 1.2s var(--ll-weich);
}

.ll-schwester-bild .ll-zeichen-gross { height: 70px; margin-bottom: 12px; }

@media (hover: hover) {
	.ll-schwester:hover .ll-schwester-bild img { scale: 1.05; }
}

.ll-schwester-text { display: grid; gap: 4px; }
.ll-schwester-text .ll-kick { color: var(--ll-wr); }

.ll-schwester-titel {
	font-family: var(--ll-f-titel);
	font-size: 22px;
	font-weight: 400;
	line-height: 1.15;
}

.ll-schwester-satz { font-size: 14px; line-height: 1.45; }
.ll-schwester .ll-feder { margin-top: 6px; color: var(--ll-wr); }

@media (max-width: 600px) {
	.ll-schwester { grid-template-columns: minmax(0, 1fr); }
	.ll-schwester-bild { height: 140px; }
}

/* ------------------------------------------------------------------
 * G3 Gemeinsame Fußzeile
 * ------------------------------------------------------------------ */

.ll-familienfuss {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 14px;
	padding: 14px clamp(18px, 3vw, 30px);
	background: var(--ll-tief);
	background-image: var(--ll-rauschen);
	color: #efe4d4;
	font-family: var(--ll-f-titel);
	font-size: 15px;
	line-height: 1.3;
}

.ll-familienfuss-hier,
.ll-familienfuss-dort { display: flex; align-items: center; gap: 10px; }
.ll-familienfuss-hier { justify-self: end; }

.ll-familienfuss-mitte {
	font-family: inherit;
	font-family: var(--ll-f-text, inherit);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .2em;
	text-transform: uppercase;
	text-align: center;
	opacity: .7;
}

.ll-familienfuss a {
	color: #c9d6a8;
	text-decoration: none;
	opacity: .9;
}

.ll-familienfuss a:hover { opacity: 1; color: #dbe6bd; }

@media (max-width: 767px) {
	.ll-familienfuss { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; }
	.ll-familienfuss-hier { justify-self: center; }
}

/* ------------------------------------------------------------------
 * G4 Verwandten-Link (das Skript setzt die Klasse und das Zeichen)
 * ------------------------------------------------------------------ */

a.ll-verwandt {
	display: inline-flex;
	align-items: center;
	gap: .35em;
	color: var(--ll-wr);
	text-decoration: none;
}

a.ll-verwandt .ll-zeichen { width: 1em; height: 1em; }

a.ll-verwandt > span {
	padding-bottom: 2px;
	background: linear-gradient(currentColor 0 0) 100% 100% / 100% 1px no-repeat;
}

@media (hover: hover) {
	a.ll-verwandt:hover { color: var(--ll-wr-tief); }
	a.ll-verwandt:hover > span { animation: ll-federstrich .7s cubic-bezier(.65, 0, .35, 1); }
}

/* ------------------------------------------------------------------
 * LK1 Status im Kopf: „Heute geöffnet bis 13 Uhr“ als kleines Schild.
 * Über dem Titelbild hell auf dunklem Glas, auf hellem Kopf braun.
 * Offen: warmes Laternenlicht. Geschlossen: leerer Ring.
 * Seit 1.6.2 schmaler (normale Schreibweise statt Großbuchstaben) und mit Luft
 * zu allen Seiten, auch zum rechten Rand, wenn kein Warenkorb dahinter steht.
 * ------------------------------------------------------------------ */

.ll-kopf-status {
	display: none;
	align-items: center;
	gap: 7px;
	margin: 2px 14px;
	padding: 4px 11px 4px 9px;
	border: 1px solid rgba(246, 238, 227, .38);
	border-radius: 999px;
	background: rgba(28, 20, 13, .38);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: .01em;
	text-transform: none;
	color: #f6eee3;
	white-space: nowrap;
	flex: none;
	align-self: center;
}

.ll-kopf-status.ist-gesetzt { display: inline-flex; }

/*
 * Kadence: Die rechte Kopf-Hälfte ist ein Flex-Bereich ohne align-items, nur Kadences
 * eigene Bausteine (.site-header-item) sind mittig. Ohne diese Zeile würde das Schild
 * auf die ganze Kopfhöhe gestreckt und zum großen Oval (so in 1.6.2 auf der echten Seite).
 */
#masthead .ll-kopf-status { align-self: center !important; height: auto !important; min-height: 0 !important; }

/* Letztes Element im Kopf: Abstand zum Rand */
.ll-kopf-status:last-child { margin-right: clamp(20px, 2.2vw, 32px); }

.ll-kopf-status::before {
	content: "";
	flex: none;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #f0c27b;
	box-shadow: 0 0 0 3px rgba(240, 194, 123, .22), 0 0 10px 2px rgba(240, 194, 123, .45);
}

.ll-kopf-status.ist-zu::before {
	background: transparent;
	box-shadow: inset 0 0 0 1.5px currentColor;
	opacity: .8;
}

/* Auf hellem Kopf (Papier oder nach dem Scrollen): braun, ohne Glas. */
body:not(.ast-theme-transparent-header):not(.transparent-header):not(.ll-kopf-fest) .ll-kopf-status,
.item-is-stuck .ll-kopf-status {
	border-color: rgba(127, 95, 65, .35);
	background: transparent;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	color: var(--ll-braun);
}

body:not(.ast-theme-transparent-header):not(.transparent-header):not(.ll-kopf-fest) .ll-kopf-status:not(.ist-zu)::before,
.item-is-stuck .ll-kopf-status:not(.ist-zu)::before {
	background: #c98a2e;
	box-shadow: 0 0 0 3px rgba(201, 138, 46, .2);
}

/* Kadence: der Status sitzt als eigenes Element in der rechten Kopf-Hälfte */
#main-header .site-header-main-section-right .ll-kopf-status:not(:last-child) { margin-right: 14px; }

@media (max-width: 921px) {
	.ll-kopf-status.ist-gesetzt { display: none; }
}

/* Kadence zeigt den PC-Kopf ab 1025 px; bis 1099 px würde das Schild dort das Menü in eine zweite Zeile drücken. */
@media (min-width: 1025px) and (max-width: 1099px) {
	body.ll-kadence #main-header .ll-kopf-status.ist-gesetzt { display: none; }
}

/* ------------------------------------------------------------------
 * LK2 Kopf als Holzkarte (ab 1.6.2, Schalter „Kopf als Holzkarte“):
 * Sobald der Kopf einen Hintergrund hat, ist er ein dunkles Brett mit
 * Maserung und heller Schrift wie der Look „Holzkarte“: auf Seiten ohne
 * durchsichtigen Kopf immer, sonst erst, wenn er beim Scrollen mitläuft.
 * Über dem Titelbild bleibt ein durchsichtiger Kopf durchsichtig.
 * Kadence druckt sein CSS nach dem Plugin, darum #masthead und !important.
 * ------------------------------------------------------------------ */

/* Das Brett: Kadence (fester Kopf und mitlaufender Kopf), Astra */
body.ll-kopf-holz:not(.transparent-header):not(.ast-theme-transparent-header) #masthead,
body.ll-kopf-holz #masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start),
body.ll-kopf-holz:not(.transparent-header) #masthead .kadence-sticky-header.item-is-fixed,
body.ll-kopf-holz:not(.ast-theme-transparent-header) #masthead :is(.main-header-bar, .ast-primary-header-bar),
body.ll-kopf-holz.ll-kopfzeile-mitlaufen.ast-theme-transparent-header.ll-kopf-fest #masthead :is(.main-header-bar, .ast-primary-header-bar) {
	background:
		radial-gradient(110% 160% at 18% 0%, rgba(255, 232, 200, .07), rgba(255, 232, 200, 0) 60%),
		linear-gradient(rgba(104, 75, 51, .32), rgba(104, 75, 51, .32)),
		url("../img/flaeche-maserung.svg") 0 0 / 900px 180px,
		var(--ll-rauschen),
		#684b33 !important;
	color: #f6eee3;
	box-shadow: inset 0 -1px 0 rgba(20, 12, 6, .35), 0 10px 22px -16px rgba(28, 17, 9, .7);
}

/* Innere Zeilen von Kadence ohne eigene Farbe, damit das Brett durchgeht */
body.ll-kopf-holz:not(.transparent-header) #masthead :is(.site-header-wrap, .site-header-inner-wrap, .site-header-upper-wrap, .site-header-upper-inner-wrap, .site-header-row-container, .site-header-row-container-inner, .site-mobile-header-wrap),
body.ll-kopf-holz #masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start) :is(.site-header-row-container-inner, .site-header-row-container),
body.ll-kopf-holz:not(.transparent-header) #masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start) > .site-header-row-container-inner {
	background: transparent !important;
	border-color: rgba(246, 238, 227, .14) !important;
}

/* Helle Schrift: Name, Hauptmenü (erste Ebene), Warenkorb, Menü-Knopf am Handy */
:is(body.ll-kopf-holz:not(.transparent-header):not(.ast-theme-transparent-header) #masthead, body.ll-kopf-holz #masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start), body.ll-kopf-holz.ll-kopf-fest #masthead, body.ll-kopf-holz:not(.ast-theme-transparent-header) #masthead .ast-primary-header-bar)
	:is(.site-branding a, .site-title, .site-description, .site-title a,
		.header-menu-container > ul > li.menu-item > a, .header-menu-container > ul > li.menu-item > .nav-drop-title-wrap,
		.main-header-menu > .menu-item > .menu-link,
		.header-cart-button, .ast-site-header-cart a.cart-container, .menu-toggle-open, .menu-toggle, .ast-mobile-menu-trigger-minimal,
		.search-toggle-open, .header-social-wrap a, .header-account-button, .header-account-wrap a, .header-html, .header-button-wrap a:not(.button)) {
	color: #f6eee3 !important;
}

:is(body.ll-kopf-holz:not(.transparent-header):not(.ast-theme-transparent-header) #masthead, body.ll-kopf-holz #masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start), body.ll-kopf-holz.ll-kopf-fest #masthead, body.ll-kopf-holz:not(.ast-theme-transparent-header) #masthead .ast-primary-header-bar)
	:is(.header-menu-container > ul > li.menu-item > a:hover, .header-menu-container > ul > li.menu-item > a:focus-visible,
		.header-menu-container > ul > li:is(.current-menu-item, .current-menu-ancestor, .current_page_item) > a,
		.main-header-menu > .menu-item > .menu-link:hover, .main-header-menu > :is(.current-menu-item, .current-menu-ancestor) > .menu-link,
		.site-branding a:hover, .header-cart-button:hover) {
	color: #f2d6a0 !important;
}

/* Untermenüs passend dunkel */
:is(body.ll-kopf-holz:not(.transparent-header):not(.ast-theme-transparent-header) #masthead, body.ll-kopf-holz #masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start), body.ll-kopf-holz.ll-kopf-fest #masthead)
	:is(.header-navigation ul ul.sub-menu, .header-navigation ul ul.submenu, .main-header-menu .sub-menu) {
	background: #3d2b1d !important;
	border-color: rgba(246, 238, 227, .14) !important;
}

:is(body.ll-kopf-holz:not(.transparent-header):not(.ast-theme-transparent-header) #masthead, body.ll-kopf-holz #masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start), body.ll-kopf-holz.ll-kopf-fest #masthead)
	:is(.header-navigation ul ul li.menu-item > a, .main-header-menu .sub-menu .menu-link) {
	color: #efe4d5 !important;
	border-color: rgba(246, 238, 227, .12) !important;
}

/*
 * Kadence: Kopf nur am PC durchsichtig (beim Handy ausgeschaltet, Klasse mobile-non-transparent-header).
 * Auf Handy und Tablet ist er dann ein normaler Kopf mit Hintergrund, also auch dort ein Brett.
 */
@media (max-width: 1024px) {
	body.ll-kopf-holz.transparent-header.mobile-non-transparent-header #masthead,
	body.ll-kopf-holz.transparent-header.mobile-non-transparent-header #masthead .kadence-sticky-header.item-is-fixed {
		background:
			radial-gradient(110% 160% at 18% 0%, rgba(255, 232, 200, .07), rgba(255, 232, 200, 0) 60%),
			linear-gradient(rgba(104, 75, 51, .32), rgba(104, 75, 51, .32)),
			url("../img/flaeche-maserung.svg") 0 0 / 900px 180px,
			var(--ll-rauschen),
			#684b33 !important;
		color: #f6eee3;
		box-shadow: inset 0 -1px 0 rgba(20, 12, 6, .35), 0 10px 22px -16px rgba(28, 17, 9, .7);
	}

	/* Zeilen durchsichtig, damit das Brett durchscheint; der mitlaufende Teil behält sein eigenes Brett. */
	body.ll-kopf-holz.transparent-header.mobile-non-transparent-header #masthead :is(.site-header-wrap, .site-header-inner-wrap, .site-header-upper-wrap, .site-header-upper-inner-wrap, .site-header-row-container, .site-header-row-container-inner, .site-mobile-header-wrap):not(.item-is-fixed) {
		background: transparent !important;
		border-color: rgba(246, 238, 227, .14) !important;
	}

	body.ll-kopf-holz.transparent-header.mobile-non-transparent-header #masthead :is(.site-branding a, .site-title, .site-description, .site-title a,
		.header-cart-button, .menu-toggle-open, .menu-toggle, .search-toggle-open, .header-social-wrap a,
		.header-account-button, .header-account-wrap a, .header-html, .header-button-wrap a:not(.button), .mobile-header-button-wrap a:not(.button)) {
		color: #f6eee3 !important;
	}
}

/* Untermenü: aktueller Punkt und Drüberfahren warm statt mit Kadences Schiefer-Farbe */
:is(body.ll-kopf-holz:not(.transparent-header):not(.ast-theme-transparent-header) #masthead, body.ll-kopf-holz #masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start), body.ll-kopf-holz.ll-kopf-fest #masthead)
	:is(.header-navigation ul ul li.menu-item > a:is(:hover, :focus-visible), .header-navigation ul ul li:is(.current-menu-item, .current-menu-ancestor) > a,
		.main-header-menu .sub-menu .menu-link:is(:hover, :focus-visible), .main-header-menu .sub-menu :is(.current-menu-item, .current-menu-ancestor) > .menu-link) {
	background: rgba(246, 238, 227, .08) !important;
	color: #f2d6a0 !important;
}

/* Kadence „beim Hochscrollen zeigen“: Ist der Kopf oben versteckt, kein Schatten am Bildschirmrand */
body.ll-kopf-holz #masthead .kadence-sticky-header.item-hidden-above { box-shadow: none !important; }

/* Das Öffnungs-Schild auf dem Brett: hell wie über dem Titelbild (über dem Titelbild selbst bleibt es Glas) */
:is(body.ll-kopf-holz:not(.transparent-header):not(.ast-theme-transparent-header) #masthead, body.ll-kopf-holz #masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start), body.ll-kopf-holz.ll-kopf-fest #masthead, body.ll-kopf-holz:not(.ast-theme-transparent-header) #masthead .ast-primary-header-bar) .ll-kopf-status {
	border-color: rgba(246, 238, 227, .34);
	background: rgba(20, 12, 6, .22);
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	color: #f6eee3;
}

:is(body.ll-kopf-holz:not(.transparent-header):not(.ast-theme-transparent-header) #masthead, body.ll-kopf-holz #masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start), body.ll-kopf-holz.ll-kopf-fest #masthead, body.ll-kopf-holz:not(.ast-theme-transparent-header) #masthead .ast-primary-header-bar) .ll-kopf-status:not(.ist-zu)::before {
	background: #f0c27b;
	box-shadow: 0 0 0 3px rgba(240, 194, 123, .22), 0 0 10px 2px rgba(240, 194, 123, .45);
}

/* ------------------------------------------------------------------
 * LK3 Fuß als Hofladen
 * ------------------------------------------------------------------ */

/* Kadence: dessen Fuß-Rahmen bekommt weder Abstand noch Farbe, der Hofladen-Fuß bringt beides mit. */
body.ll-mit-hoffuss.ll-kadence #colophon.site-footer { padding: 0; margin: 0; background: transparent; border: 0; text-align: left; }

.ll-fuss {
	margin-top: clamp(40px, 6vw, 80px);
	background: none;
	color: var(--ll-tinte);
}

/*
 * Endet eine Seite mit einer Papier-Fläche oder einem von Hand gesetzten Zaun
 * (Abstandhalter oder Trennlinie mit dem Look „Gezeichneter Zaun“, Trennlinie mit
 * dem Stil „Gezeichneter Zaun“), schließt der Fuß direkt an. Dafür fällt auch der
 * Abstand weg, den das Theme unter den Inhalt setzt (Kadence: .content-area unten
 * und .entry-content-wrap, Astra: #primary). Ein leerer Absatz danach stört nicht.
 * Ist der Block auf einem Gerät ausgeblendet (Kadence: Visibility), behält der Fuß
 * dort seinen normalen Abstand; die Grenzen sind die von Kadence.
 */
/* PC: ein hier ausgeblendeter Block (kvs-lg-false) zählt nicht */
@media (min-width: 1025px) {
	body.ll-mit-hoffuss.page:has(.entry-content > :is(.ll-look-papier, .ll-look-papier-hell, .is-style-ll-papier, .wp-block-kadence-spacer.ll-look-zaun, hr.ll-look-zaun, hr.is-style-ll-zaun-skizze):nth-last-child(1 of :not(p:empty, script, style)):not(.kvs-lg-false)) .ll-fuss { margin-top: 0; }

	body.ll-mit-hoffuss.page .entry-content:has(> :is(.ll-look-papier, .ll-look-papier-hell, .is-style-ll-papier, .wp-block-kadence-spacer.ll-look-zaun, hr.ll-look-zaun, hr.is-style-ll-zaun-skizze):nth-last-child(1 of :not(p:empty, script, style)):not(.kvs-lg-false)),
	body.ll-mit-hoffuss.page:has(.entry-content > :is(.ll-look-papier, .ll-look-papier-hell, .is-style-ll-papier, .wp-block-kadence-spacer.ll-look-zaun, hr.ll-look-zaun, hr.is-style-ll-zaun-skizze):nth-last-child(1 of :not(p:empty, script, style)):not(.kvs-lg-false)) :has(.entry-content):not(:has(.ll-fuss)) {
		margin-bottom: 0 !important;
		padding-bottom: 0 !important;
	}
}

/* Tablet: ein hier ausgeblendeter Block (kvs-md-false) zählt nicht */
@media (min-width: 768px) and (max-width: 1024px) {
	body.ll-mit-hoffuss.page:has(.entry-content > :is(.ll-look-papier, .ll-look-papier-hell, .is-style-ll-papier, .wp-block-kadence-spacer.ll-look-zaun, hr.ll-look-zaun, hr.is-style-ll-zaun-skizze):nth-last-child(1 of :not(p:empty, script, style)):not(.kvs-md-false)) .ll-fuss { margin-top: 0; }

	body.ll-mit-hoffuss.page .entry-content:has(> :is(.ll-look-papier, .ll-look-papier-hell, .is-style-ll-papier, .wp-block-kadence-spacer.ll-look-zaun, hr.ll-look-zaun, hr.is-style-ll-zaun-skizze):nth-last-child(1 of :not(p:empty, script, style)):not(.kvs-md-false)),
	body.ll-mit-hoffuss.page:has(.entry-content > :is(.ll-look-papier, .ll-look-papier-hell, .is-style-ll-papier, .wp-block-kadence-spacer.ll-look-zaun, hr.ll-look-zaun, hr.is-style-ll-zaun-skizze):nth-last-child(1 of :not(p:empty, script, style)):not(.kvs-md-false)) :has(.entry-content):not(:has(.ll-fuss)) {
		margin-bottom: 0 !important;
		padding-bottom: 0 !important;
	}
}

/* Handy: ein hier ausgeblendeter Block (kvs-sm-false) zählt nicht */
@media (max-width: 767px) {
	body.ll-mit-hoffuss.page:has(.entry-content > :is(.ll-look-papier, .ll-look-papier-hell, .is-style-ll-papier, .wp-block-kadence-spacer.ll-look-zaun, hr.ll-look-zaun, hr.is-style-ll-zaun-skizze):nth-last-child(1 of :not(p:empty, script, style)):not(.kvs-sm-false)) .ll-fuss { margin-top: 0; }

	body.ll-mit-hoffuss.page .entry-content:has(> :is(.ll-look-papier, .ll-look-papier-hell, .is-style-ll-papier, .wp-block-kadence-spacer.ll-look-zaun, hr.ll-look-zaun, hr.is-style-ll-zaun-skizze):nth-last-child(1 of :not(p:empty, script, style)):not(.kvs-sm-false)),
	body.ll-mit-hoffuss.page:has(.entry-content > :is(.ll-look-papier, .ll-look-papier-hell, .is-style-ll-papier, .wp-block-kadence-spacer.ll-look-zaun, hr.ll-look-zaun, hr.is-style-ll-zaun-skizze):nth-last-child(1 of :not(p:empty, script, style)):not(.kvs-sm-false)) :has(.entry-content):not(:has(.ll-fuss)) {
		margin-bottom: 0 !important;
		padding-bottom: 0 !important;
	}
}

body.ll-mit-hoffuss.page .entry-content > :is(.ll-look-papier, .ll-look-papier-hell, .is-style-ll-papier, .wp-block-kadence-spacer.ll-look-zaun, hr.ll-look-zaun, hr.is-style-ll-zaun-skizze):nth-last-child(1 of :not(p:empty, script, style)) ~ p:empty { display: none; }

/* Der Zaun steht auf der Kante des Fußes; die Zeichnung sitzt unten in ihrem Kasten (auch schmaler als 340 px). */
body.ll-mit-hoffuss.page .entry-content > .wp-block-kadence-spacer.ll-look-zaun:nth-last-child(1 of :not(p:empty, script, style)) > .kt-block-spacer::before {
	top: auto;
	bottom: -2px;
	translate: var(--ll-x, -50%) 0;
	-webkit-mask-position: 50% 100%;
	mask-position: 50% 100%;
}

body.ll-mit-hoffuss.page .entry-content > :is(hr.ll-look-zaun, hr.is-style-ll-zaun-skizze):nth-last-child(1 of :not(p:empty, script, style)) {
	margin-bottom: -2px !important;
	-webkit-mask-position: 50% 100%;
	mask-position: 50% 100%;
}

.ll-fuss-innen {
	display: grid;
	gap: 22px;
	padding: 34px clamp(18px, 3vw, 30px) 16px;
	/* gezeichnete Bodenlinie (auf ihr steht auch ein von Hand gesetzter Zaun) */
	border-top: 1.5px solid rgba(59, 42, 30, .55);
	background-color: var(--ll-sanft);
	background-image: var(--ll-rauschen);
	box-shadow: inset 0 14px 18px -16px rgba(59, 42, 30, .28);
}

/* Ladenschild | Kontakt | Service und Rechtliches (zwei Spalten nebeneinander, darum doppelt breit) */
.ll-fuss-spalten {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 2fr);
	gap: 24px;
	max-width: var(--ast-container-width, var(--global-content-width, 1200px));
	width: 100%;
	margin: 0 auto;
}

.ll-fuss-menues {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
	align-items: start;
}

/* Nur ein Menü (oder keins): dann keine leere Spalte rechts */
.ll-fuss-spalten.ll-fuss-menues-1 { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr); }
.ll-fuss-spalten.ll-fuss-menues-1 .ll-fuss-menues { grid-template-columns: minmax(0, 1fr); }
.ll-fuss-spalten.ll-fuss-menues-0 { grid-template-columns: minmax(0, 1.2fr) minmax(0, 2fr); }

/* Ohne Kontakt-Angaben: Ladenschild | Menüs */
.ll-fuss-spalten.ll-fuss-ohne-kontakt { grid-template-columns: minmax(0, 1.2fr) minmax(0, 2fr); }
.ll-fuss-spalten.ll-fuss-ohne-kontakt.ll-fuss-menues-1 { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }

.ll-fuss-spalte { min-width: 0; }

.ll-fuss-spalte > b,
.ll-fuss-spalte > strong {
	display: block;
	margin-bottom: 8px;
	font-size: 11px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ll-braun);
}

.ll-fuss-spalte > a,
.ll-fuss-spalte > span,
.ll-fuss-links a {
	display: block;
	width: fit-content;
	max-width: 100%;
	padding: 3.5px 0;
	font-size: 14px;
	line-height: 1.3;
	color: inherit;
	text-decoration: none;
	/* Lange Wörter (Widerrufsbelehrung) brechen um, statt in die Nachbarspalte zu laufen */
	overflow-wrap: anywhere;
	-webkit-hyphens: auto;
	hyphens: auto;
}

/* Die E-Mail-Adresse bricht nur vor @ und Punkt um, nie mit Trennstrich */
.ll-fuss-spalte a.ll-fuss-mail { -webkit-hyphens: manual; hyphens: manual; overflow-wrap: break-word; }

/* Kontakt: Zeichen vor jedem Eintrag, in Holzbraun */
.ll-fuss-kontakt-links a {
	display: flex;
	align-items: center;
	gap: 9px;
}

.ll-fuss-kontakt-links a > span { min-width: 0; }

.ll-kontakt-zeichen {
	flex: none;
	width: 16px;
	height: 16px;
	color: var(--ll-braun);
	transition: translate .3s var(--ll-weich, ease);
}

.ll-kontakt-marke { fill: currentColor; }

.ll-kontakt-strich {
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

@media (hover: hover) {
	.ll-fuss-kontakt-links a:hover .ll-kontakt-zeichen { translate: 0 -1px; }
}

.ll-fuss-spalte > a:hover,
.ll-fuss-links a:hover { color: var(--ll-braun); }

.ll-fuss-links { margin: 0; padding: 0; list-style: none; }
.ll-fuss-links li { margin: 0; }

/* „Vertrag widerrufen“ als Knopf (Pflicht: gut lesbar und hervorgehoben) */
.ll-fuss-links li.ll-fuss-widerruf { margin-top: 8px; }
.ll-fuss-links li.ll-fuss-widerruf a {
	padding: 7px 14px;
	border: 1.5px solid var(--ll-braun);
	border-radius: 4px;
	font-weight: 600;
	color: var(--ll-dunkel, #3b2a1e);
	background: rgba(255, 255, 255, .45);
	transition: background-color .3s, color .3s;
}
.ll-fuss-links li.ll-fuss-widerruf a:hover,
.ll-fuss-links li.ll-fuss-widerruf a:focus-visible { background: var(--ll-braun); color: #fff; }

/* EU-Hinweis „Gesetzliche Gewährleistung“ klein unten rechts im Papier statt als Band darunter */
.ll-fuss-eu { display: inline-flex; align-items: center; }
.ll-fuss-eu .wc-gzd-legal-guarantee { margin: 0 !important; padding: 0 !important; line-height: 0; }
/* Germanized zeigt als Vorschau das ganze EU-Blatt; im Fuß nur dessen blauen Kopf
   („Gesetzliche Gewährleistung“). Ein Klick öffnet wie bisher das ganze Blatt. */
.ll-fuss-eu .wc-gzd-popover-trigger { display: block !important; width: 240px; max-width: 100%; aspect-ratio: 1654 / 410; overflow: hidden; cursor: pointer; }
.ll-fuss-eu img.wc-gzd-legal-guarantee-image-preview,
.ll-fuss-eu img.wc-gzd-legal-guarantee-label-image { display: block; mix-blend-mode: multiply; width: 100% !important; min-width: 0 !important; max-width: none !important; height: auto !important; }
.ll-fuss-eu svg { display: block; width: 240px; max-width: 100%; height: auto; }

.ll-fuss-hinweis { margin: 0; font-size: 12px; color: #b32d2e; }

/* Das Ladenschild im Fuß: kleiner, ohne Seile */
.ll-fuss-schild .ll-ladenschild { max-width: 340px; margin: 0; padding: 16px 18px 10px; }
.ll-fuss-schild .ll-ladenschild::before,
.ll-fuss-schild .ll-ladenschild::after { display: none; }
.ll-fuss-schild .ll-laden-titel { font-size: 20px; }
.ll-fuss-schild .ll-laden-status { margin-bottom: 8px !important; font-size: 19px; }
.ll-fuss-schild ul.ll-laden-zeiten { font-size: 12.5px; }
.ll-fuss-schild ul.ll-laden-zeiten li { padding: 3px 0; }
.ll-fuss-schild .ll-ladenschild-ohne-zeiten { padding-bottom: 14px; }
.ll-fuss-schild .ll-ladenschild-ohne-zeiten .ll-laden-status { margin-bottom: 0 !important; }

.ll-fuss-unten {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px 20px;
	max-width: var(--ast-container-width, var(--global-content-width, 1200px));
	width: 100%;
	margin: 0 auto;
	padding-top: 14px;
	border-top: 1px solid rgba(59, 42, 30, .18);
	font-size: 12px;
	color: var(--ll-leise);
}

.ll-fuss-fam { font-family: var(--ll-f-titel); font-size: 14px; color: var(--ll-tinte); }

/* „Arokora.com“ in der letzten Zeile ist ein Link */
.ll-fuss-unten a.ll-fuss-credit {
	color: inherit;
	text-decoration: underline;
	text-decoration-color: rgba(59, 42, 30, .3);
	text-underline-offset: 2px;
	transition: color .3s, text-decoration-color .3s;
}

.ll-fuss-unten a.ll-fuss-credit:hover { color: var(--ll-braun); text-decoration-color: currentColor; }
.ll-fuss-fam a { color: var(--ll-wr); text-decoration: none; }

@media (max-width: 940px) {
	/* Ladenschild | Kontakt, darunter Service | Rechtliches über die ganze Breite */
	.ll-fuss-spalten,
	.ll-fuss-spalten.ll-fuss-menues-0,
	.ll-fuss-spalten.ll-fuss-menues-1,
	.ll-fuss-spalten.ll-fuss-ohne-kontakt,
	.ll-fuss-spalten.ll-fuss-ohne-kontakt.ll-fuss-menues-1 { grid-template-columns: minmax(0, 376px) minmax(0, 1fr); }
	.ll-fuss-menues { grid-column: 1 / -1; }
}

/* Ohne Kontakt-Spalte: auf dem Tablet stehen die Menüs neben dem Schild statt neben einer Lücke */
@media (min-width: 760px) and (max-width: 940px) {
	.ll-fuss-spalten.ll-fuss-ohne-kontakt .ll-fuss-menues { grid-column: auto; }
}

@media (max-width: 600px) {
	.ll-fuss-spalten,
	.ll-fuss-spalten.ll-fuss-menues-0,
	.ll-fuss-spalten.ll-fuss-menues-1,
	.ll-fuss-spalten.ll-fuss-ohne-kontakt,
	.ll-fuss-spalten.ll-fuss-ohne-kontakt.ll-fuss-menues-1 { grid-template-columns: minmax(0, 1fr); }
	.ll-fuss-menues { gap: 16px; }
	/* Kontakt: Social Media zu zweit nebeneinander (wie Service | Rechtliches), Telefon und E-Mail über die ganze Breite */
	.ll-fuss-kontakt-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; }
	.ll-fuss-kontakt-links li:not(.ll-kontakt-social) { grid-column: 1 / -1; }
	.ll-fuss-unten { justify-content: center; text-align: center; }
	/* Links groß genug zum Antippen */
	.ll-fuss-spalte > a,
	.ll-fuss-links a { padding-block: 11px; }
	.ll-fuss-links li.ll-fuss-widerruf a { padding: 10px 16px; }
	.ll-fuss-unten a.ll-fuss-credit { display: inline-block; padding: 12px 4px; margin: -12px -4px; }
}

/* ------------------------------------------------------------------
 * Bewegung reduzieren
 * ------------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
	.ll-feder > span, a.ll-verwandt > span { animation: none !important; }
	.ll-pfeil, .ll-schwester-bild img, .ll-familie-schwester > span, .ll-kontakt-zeichen { transition: none !important; }
	.ll-fuss-kontakt-links a:hover .ll-kontakt-zeichen { translate: none !important; }
	.ll-schwester:hover .ll-schwester-bild img { scale: 1 !important; }
}