/*
 * longdrinks.net, Designvariante C "Digitale Cocktailbar".
 * Grundsatz: Die Marke ist laut, der Inhalt leise.
 *
 * Farben und Schriften kommen aus theme.json (CSS-Variablen --wp--preset--*).
 * Komponenten aus longdrinks-core tragen das Präfix "ldc-", Theme-Komponenten "ld-".
 * Breakpoints: 768 (Tablet), 1024 (Desktop), 1280 (breit).
 */

:root {
	--ld-creme: var(--wp--preset--color--creme);
	--ld-weiss: var(--wp--preset--color--weiss);
	--ld-navy: var(--wp--preset--color--navy);
	--ld-tuerkis: var(--wp--preset--color--tuerkis);
	--ld-tuerkis-tief: var(--wp--preset--color--tuerkis-tief);
	--ld-koralle: var(--wp--preset--color--koralle);
	--ld-sonne: var(--wp--preset--color--sonne);
	--ld-grau: var(--wp--preset--color--grau);
	--ld-text: var(--wp--preset--color--text);
	--ld-linie: var(--wp--preset--color--linie);
	--ld-sand: var(--wp--preset--color--sand);
	--ld-display: var(--wp--preset--font-family--unbounded);
	--ld-sans: var(--wp--preset--font-family--figtree);
	--ld-notiz: var(--wp--preset--font-family--caveat);
	--ld-text-mittel: #33415C;
	--ld-rand-eingabe: #8A7B66;
	--ld-r-karte: 18px;
	--ld-r-panel: 28px;
	--ld-sektion: clamp(3rem, 1.5rem + 5vw, 6rem);
	--ld-luecke: clamp(12px, 1rem + 0.5vw, 22px);
}

/* ------------------------------------------------------------------ Grundlagen */

html {
	scroll-padding-top: 1rem;
}

@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

body {
	background: var(--ld-creme);
	color: var(--ld-navy);
}

strong,
b {
	font-weight: 800;
}

:where(h1, h2, h3, h4, .ldc-karte__titel, .ldc-feature__titel) {
	text-wrap: balance;
	hyphens: auto;
	overflow-wrap: break-word;
}

:where(a, button, input, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--ld-tuerkis-tief);
	outline-offset: 3px;
	border-radius: 6px;
}

.ld-fuss :focus-visible,
.ld-barkarte-band :focus-visible {
	outline-color: var(--ld-sonne);
}

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.ld-dachzeile,
.ldc-rezeptliste__dachzeile,
.ldc-karte__einordnung,
.ldc-begriffe__titel,
.ld-linkliste__titel {
	margin: 0;
	font-family: var(--ld-sans);
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.14em;
	line-height: 1.4;
	text-transform: uppercase;
	color: var(--ld-tuerkis-tief);
}

.ld-h1-start {
	font-size: var(--wp--preset--font-size--xxx-large);
	font-weight: 800;
	letter-spacing: -0.035em;
	line-height: 1.04;
	margin: 0;
}

.ld-akzent {
	color: var(--ld-tuerkis-tief);
}

.ld-h1-rezept {
	font-family: var(--ld-display);
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.12;
	margin: 0;
}

.ld-einleitung,
.ld-einleitung p {
	margin: 0;
	max-width: 62ch;
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.6;
	color: var(--ld-text-mittel);
}

/* Bereiche ohne Inhalt entfallen serverseitig (Bloecke::gruppe_nur_mit_inhalt). */

@media (max-width: 1023.98px) {
	.ld-nur-gross {
		display: none !important;
	}
}

@media (min-width: 1024px) {
	.ld-nur-mobil {
		display: none !important;
	}
}

.ldc-hinweis {
	margin: 0;
	padding: 12px 16px;
	border-radius: 8px;
	background: var(--wp--preset--color--karton-sonne);
	border: 1px dashed var(--ld-navy);
	font-size: 0.9375rem;
}

/* Abschnitte der Startseite und Listen: Abstand statt blockGap */
.ld-start > .ld-abschnitt,
.ld-start > .wp-block-longdrinks-rezeptliste {
	margin-block: 0 var(--ld-sektion);
}

.ld-abschnitt__kopf,
.ldc-rezeptliste__kopf {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
	gap: 8px 24px;
	margin: 0 0 28px;
}

.ld-abschnitt__kopf {
	flex-direction: column;
	align-items: flex-start;
}

.ld-abschnitt__kopf.is-layout-flex {
	flex-direction: row;
	align-items: flex-end;
}

.ld-abschnitt__titel,
.ldc-rezeptliste__titel,
.ld-barkarte-band h2 {
	margin: 0;
	font-family: var(--ld-display);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 700;
	letter-spacing: -0.025em;
	line-height: 1.15;
}

.ldc-rezeptliste__titelblock {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.ld-abschnitt__mehr,
.ldc-rezeptliste__mehr {
	margin: 0;
	font-weight: 700;
	font-size: 1rem;
}

/* ------------------------------------------------------------------ Kopfbereich */

.ld-kopf {
	background: var(--ld-creme);
	border-bottom: 1px solid var(--ld-linie);
}

.ld-kopf__zeile {
	min-height: 80px;
	gap: 12px 28px;
}

.ld-logo {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: var(--ld-navy);
	text-decoration: none;
}

.ld-logo:hover {
	color: var(--ld-navy);
}

.ld-logo__wort {
	font-family: var(--ld-display);
	font-weight: 700;
	font-size: 1.375rem;
	letter-spacing: -0.025em;
	line-height: 1;
}

.ld-logo__tld {
	color: var(--ld-tuerkis-tief);
}

.ld-logo--hell,
.ld-logo--hell:hover {
	color: var(--ld-weiss);
}

.ld-logo--hell .ld-logo__tld {
	color: #5FD0C6;
}

.ld-nav .wp-block-navigation-item__content {
	color: var(--ld-navy);
	padding: 12px !important;
	border-radius: 10px;
	text-decoration: none;
}

.ld-nav .wp-block-navigation__container {
	gap: 2px;
}

.ld-nav .wp-block-navigation-item__content:hover {
	background: var(--ld-sand);
	color: var(--ld-navy);
	text-decoration: none !important;
}

.ld-nav .current-menu-item > a,
.ld-nav .wp-block-navigation-item__content[aria-current="page"] {
	text-decoration: underline !important;
	text-underline-offset: 6px;
	text-decoration-thickness: 2px;
}

.ld-nav .wp-block-navigation__responsive-container-open,
.ld-nav .wp-block-navigation__responsive-container-close {
	width: 44px;
	height: 44px;
	border-radius: 22px;
	align-items: center;
	justify-content: center;
}

.ld-nav .wp-block-navigation__responsive-container-open {
	background: var(--ld-navy);
	color: var(--ld-weiss);
}

.ld-nav .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--ld-creme) !important;
	color: var(--ld-navy) !important;
	padding: 16px !important;
}

.ld-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 64px;
}

.ld-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: 4px;
	width: 100%;
}

.ld-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	width: 100%;
}

.ld-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	display: flex;
	width: 100%;
	min-height: 52px;
	align-items: center;
	font-size: 1.125rem;
	border-bottom: 1px solid var(--ld-linie);
	border-radius: 0;
}

/* Untermenü "Spirituosen": öffnet per Klick, Tippen oder Enter/Leertaste (Knopf mit aria-expanded),
   schließt mit Escape oder Klick daneben. Desktop als Karte im Stil der Rezeptkarten. */
.ld-nav .wp-block-navigation-submenu__toggle {
	font: inherit;
	color: var(--ld-navy);
	background: none;
	border: 0;
	border-radius: 10px;
	padding: 12px 30px 12px 12px !important;
	cursor: pointer;
	position: relative;
}

.ld-nav .wp-block-navigation-submenu__toggle:hover,
.ld-nav .wp-block-navigation-submenu__toggle[aria-expanded="true"] {
	background: var(--ld-sand);
}

.ld-nav .wp-block-navigation-item.has-child {
	position: relative;
}

.ld-nav .wp-block-navigation-item.has-child > .wp-block-navigation__submenu-icon {
	display: flex;
	position: absolute;
	right: 12px;
	top: 50%;
	width: 12px;
	height: 12px;
	margin: -6px 0 0;
	pointer-events: none;
}

/* Der Pfeil dreht sich beim Öffnen (Drehung des Pfeils kommt aus WordPress). */
.ld-nav .wp-block-navigation-item.has-child > .wp-block-navigation__submenu-icon {
	z-index: 1;
}

.ld-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container {
	background: var(--ld-weiss) !important;
	color: var(--ld-navy) !important;
	border: 1px solid var(--ld-linie) !important;
	border-radius: 18px !important;
	padding: 8px !important;
	min-width: 240px !important;
	margin-left: 0 !important;
	gap: 2px;
	font-size: 1rem;
	box-shadow: 0 16px 40px rgba(23, 32, 58, 0.14) !important;
	top: calc(100% + 6px) !important;
	left: 0;
}

.ld-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container li {
	padding: 0 !important;
}

.ld-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	display: flex;
	align-items: center;
	width: 100%;
	min-height: 44px;
	padding: 10px 14px !important;
	border-radius: 10px;
	text-decoration: none !important;
}

.ld-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .has-child .wp-block-navigation-submenu__toggle:hover {
	text-decoration: none !important;
}

/* Mobil im Menü: aufklappbare Gruppe statt Karte, Einträge eingerückt. */
.ld-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.has-child {
	position: relative;
}

.ld-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle {
	display: flex;
	width: 100%;
	min-height: 52px;
	align-items: center;
	font-size: 1.125rem;
	border-bottom: 1px solid var(--ld-linie);
	border-radius: 0;
	padding: 12px 44px 12px 12px !important;
}

.ld-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.has-child > .wp-block-navigation__submenu-icon {
	display: flex;
	height: 12px !important;
	padding: 0 !important;
	top: 27px;
	right: 16px;
}

.ld-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	display: none;
	border: 0 !important;
	box-shadow: none;
	border-radius: 0;
	background: transparent !important;
	padding: 0 0 0 20px !important;
	min-width: 0 !important;
}

.ld-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.has-child:has(> [aria-expanded="true"]) > .wp-block-navigation__submenu-container {
	display: flex;
}

/* Die Hauptnavigation klappt unterhalb von 1024 px ein (statt WordPress-Standard 600 px). */
@media (max-width: 1023.98px) {
	.ld-nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.ld-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

/* Suche */
.ld-suche .wp-block-search__inside-wrapper {
	display: flex;
	align-items: center;
	gap: 8px;
	background: var(--ld-weiss);
	border: 1px solid var(--ld-rand-eingabe);
	border-radius: 999px;
	padding: 0 5px 0 18px;
	min-height: 48px;
}

.ld-suche .wp-block-search__inside-wrapper:focus-within {
	outline: 3px solid var(--ld-tuerkis-tief);
	outline-offset: 2px;
}

.ld-suche .wp-block-search__input {
	flex: 1;
	min-width: 0;
	border: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
	padding: 0 !important;
	font-size: 0.9375rem;
	color: var(--ld-navy);
	outline: none;
}

.ld-suche .wp-block-search__input:focus-visible {
	outline: none;
}

.ld-suche .wp-block-search__button {
	margin: 0;
	border: 0;
	cursor: pointer;
	font-family: var(--ld-sans);
}

.ld-suche .wp-block-search__button.has-icon {
	width: 38px;
	height: 38px;
	min-width: 38px;
	padding: 0;
	border-radius: 19px;
	background: var(--ld-navy);
	color: var(--ld-weiss);
	display: flex;
	align-items: center;
	justify-content: center;
}

.ld-suche .wp-block-search__button.has-icon svg {
	width: 20px;
	height: 20px;
	fill: currentColor;
}

.ld-suche--kopf {
	margin-left: auto;
	flex: 0 1 300px;
	min-width: 200px;
}

.ld-suche--gross {
	max-width: 540px;
	width: 100%;
}

.ld-suche--gross .wp-block-search__inside-wrapper {
	border: 2px solid var(--ld-navy);
	padding: 6px 6px 6px 22px;
}

.ld-suche--gross .wp-block-search__input {
	font-size: 1.0625rem;
}

.ld-suche--gross .wp-block-search__button {
	min-height: 52px;
	padding: 0 24px;
	border-radius: 999px;
	background: var(--ld-koralle);
	color: var(--ld-navy);
	font-weight: 700;
	font-size: 1rem;
	white-space: nowrap;
}

.ld-suche--gross .wp-block-search__button:hover {
	background: #E4532B;
}

.ld-suche-schalter {
	display: none;
	width: 44px;
	height: 44px;
	border-radius: 22px;
	border: 1px solid var(--ld-rand-eingabe);
	background: var(--ld-weiss);
	color: var(--ld-navy);
	align-items: center;
	justify-content: center;
	cursor: pointer;
	padding: 0;
}

@media (max-width: 1023.98px) {
	.ld-kopf__zeile {
		min-height: 64px;
		gap: 8px 6px;
		padding-block: 10px;
	}

	.ld-kopf__zeile > .ld-logo {
		margin-right: auto;
	}

	.ld-logo__wort {
		font-size: 1.125rem;
	}

	.ld-logo__bild {
		width: 26px;
		height: 31px;
	}

	.ld-kopf__zeile > .ld-suche-schalter {
		order: 2;
	}

	.ld-kopf__zeile > .ld-nav {
		order: 3;
	}

	.ld-kopf__zeile > .ld-suche--kopf {
		order: 4;
		flex: 1 0 100%;
		min-width: 0;
		margin: 0;
	}

	.ld-js .ld-suche-schalter {
		display: inline-flex;
	}

	.ld-js .ld-suche--kopf:not(.ist-offen) {
		display: none;
	}

	.ld-suche--gross .wp-block-search__inside-wrapper {
		flex-wrap: wrap;
		border: 0;
		background: transparent;
		padding: 0;
		gap: 10px;
	}

	.ld-suche--gross .wp-block-search__inside-wrapper:focus-within {
		outline: none;
	}

	.ld-suche--gross .wp-block-search__input {
		flex: 1 0 100%;
		min-height: 52px;
		border: 2px solid var(--ld-navy) !important;
		border-radius: 999px;
		background: var(--ld-weiss) !important;
		padding: 0 20px !important;
		font-size: 1rem;
	}

	.ld-suche--gross .wp-block-search__input:focus-visible {
		outline: 3px solid var(--ld-tuerkis-tief);
		outline-offset: 2px;
	}

	.ld-suche--gross .wp-block-search__button {
		flex: 1 0 100%;
	}
}

/* ------------------------------------------------------------------ Fußbereich */

.ld-fuss {
	background: var(--ld-navy);
	color: var(--ld-weiss);
	padding-block: 64px 36px;
	margin-top: 0;
}

.ld-fuss a {
	color: var(--ld-weiss);
	text-decoration: none;
}

.ld-fuss a:hover {
	color: var(--ld-sonne);
	text-decoration: underline;
}

.ld-fuss__spalten {
	display: grid;
	grid-template-columns: minmax(0, 4fr) repeat(4, minmax(0, 2fr));
	gap: 40px;
}

.ld-fuss__marke {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.ld-fuss__text,
.ld-fuss__unten p {
	margin: 0;
	color: var(--wp--preset--color--navy-text);
	font-size: 0.9375rem;
	line-height: 1.6;
}

.ld-fuss .ld-linkliste__titel,
.ld-fuss .ldc-begriffe__titel {
	color: var(--ld-sonne);
	margin-bottom: 4px;
}

.ld-linkliste ul,
.ldc-begriffe--links .ldc-begriffe__liste {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
	font-size: 0.9375rem;
}

.ld-fuss .ldc-begriffe--links .ldc-begriff__anzahl {
	display: none;
}

.ld-fuss__unten {
	margin-top: 44px;
	border-top: 1px solid var(--wp--preset--color--navy-linie);
	padding-top: 22px;
	gap: 16px;
}

.ld-fuss__unten p,
.ld-copyright {
	font-size: 0.875rem;
	color: var(--wp--preset--color--navy-text);
	margin: 0;
}

@media (max-width: 1023.98px) {
	.ld-fuss {
		padding-block: 36px 28px;
	}

	.ld-fuss__spalten {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 28px 16px;
	}

	.ld-fuss__marke {
		grid-column: 1 / -1;
	}

	.ld-linkliste ul,
	.ldc-begriffe--links .ldc-begriffe__liste {
		gap: 0;
	}

	.ld-linkliste a,
	.ldc-begriffe--links a {
		display: flex;
		align-items: center;
		min-height: 44px;
	}

	.ld-fuss__unten {
		margin-top: 28px;
	}
}

/* Fuß mobil (Design C): unter 640 px zwei kompakte Spalten mit kleinen Gruppenüberschriften,
   links "Rezepte", rechts "Barwissen" und "Über uns". Spirituosen stehen mobil im Menü, der
   Kurztext unter dem Logo entfällt. Ab 640 px bleiben alle Gruppen wie bisher. */
@media (max-width: 639.98px) {
	.ld-fuss__spalten {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-areas:
			"marke marke"
			"rezepte barwissen"
			"rezepte ueber";
		gap: 20px 16px;
		align-items: start;
	}

	.ld-fuss__marke {
		grid-area: marke;
	}

	.ld-fuss__text,
	.ld-fuss__spirituosen {
		display: none;
	}

	.ld-fuss__rezepte {
		grid-area: rezepte;
	}

	.ld-fuss__barwissen {
		grid-area: barwissen;
	}

	.ld-fuss__ueber {
		grid-area: ueber;
	}

	.ld-fuss .ld-linkliste__titel {
		font-size: 0.6875rem;
		margin-bottom: 0;
	}
}

/* ------------------------------------------------------------------ Startseite: Einstieg */

.ld-held {
	display: grid;
	grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
	gap: 56px;
	align-items: center;
	padding-block: 72px 80px;
	margin-top: 0 !important;
}

.ld-held__text {
	display: flex;
	flex-direction: column;
	gap: 26px;
}

.ld-held__text > * {
	margin: 0 !important;
}

.ld-held .ld-einleitung {
	font-size: 1.25rem;
	color: var(--ld-grau);
	max-width: 520px;
}

.ld-held__bild {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	aspect-ratio: 5 / 4.6;
	background: var(--ld-tuerkis);
	border-radius: 32px;
	overflow: hidden;
}

.ld-held__sonne {
	position: absolute;
	top: 44px;
	right: 56px;
	width: 150px;
	height: 150px;
	border-radius: 50%;
	background: var(--ld-sonne);
}

.ld-held__notiz {
	position: absolute;
	top: 34px;
	left: 36px;
	margin: 0;
	font-family: var(--ld-notiz);
	font-weight: 700;
	font-size: 1.875rem;
	line-height: 1;
	color: var(--ld-navy);
	transform: rotate(-4deg);
}

.ld-held__glaeser {
	position: relative;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	gap: 30px;
	padding: 0 40px;
}

.ld-held__glaeser svg {
	display: block;
	height: auto;
	max-width: 32%;
}

.ld-held__tresen {
	display: block;
	height: 26px;
	background: var(--ld-navy);
}

.ldc-rezeptliste--links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 10px;
	font-size: 0.9375rem;
}

.ldc-rezeptliste__label {
	margin: 0;
	color: var(--ld-grau);
	font-weight: 600;
}

.ldc-rezeptlinks {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 10px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.ldc-rezeptlinks a {
	font-weight: 700;
}

.ldc-rezeptlinks li + li::before {
	content: "·";
	color: #C9B9A2;
	margin-right: 10px;
}

@media (max-width: 1023.98px) {
	.ld-held {
		grid-template-columns: minmax(0, 1fr);
		gap: 18px;
		padding-block: 26px 36px;
	}

	.ld-held__text {
		gap: 18px;
	}

	.ld-held .ld-einleitung {
		font-size: 1.0625rem;
	}

	.ld-held__bild {
		aspect-ratio: auto;
		height: 230px;
		border-radius: 24px;
	}

	.ld-held__sonne {
		top: 26px;
		right: 30px;
		width: 96px;
		height: 96px;
	}

	.ld-held__notiz {
		top: 20px;
		left: 20px;
		font-size: 1.5rem;
	}

	.ld-held__glaeser {
		gap: 18px;
		padding: 0 20px;
	}

	.ld-held__glaeser svg {
		max-height: 150px;
		width: auto;
	}

	.ld-held__tresen {
		height: 18px;
	}
}

/* ------------------------------------------------------------------ Begriffe (Chips, Zeilen) */

.ldc-begriffe__liste {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ldc-begriffe--chips .ldc-begriffe__titel,
.ldc-begriffe--zeilen .ldc-begriffe__titel {
	margin-bottom: 16px;
}

.ldc-begriffe--chips .ldc-begriffe__liste {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.ldc-begriffe--chips .ldc-begriff {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 16px;
	border-radius: 999px;
	background: var(--ld-weiss);
	border: 1px solid var(--ld-linie);
	color: var(--ld-navy);
	font-weight: 700;
	font-size: 0.9375rem;
	text-decoration: none;
}

.ldc-begriffe--chips .ldc-begriff:hover {
	border-color: var(--ld-navy);
	color: var(--ld-navy);
}

.ldc-begriff__anzahl {
	color: var(--ld-grau);
	font-weight: 600;
}

.ldc-begriffe--zeilen .ldc-begriffe__liste {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.ldc-begriffe--zeilen .ldc-begriff {
	display: flex;
	align-items: center;
	gap: 14px;
	min-height: 52px;
	padding: 0 12px;
	border-radius: 12px;
	color: var(--ld-navy);
	font-weight: 700;
	font-size: 1rem;
	text-decoration: none;
}

.ldc-begriffe--zeilen .ldc-begriff:hover {
	background: var(--ld-creme);
	color: var(--ld-navy);
}

.ldc-begriffe--zeilen .ldc-begriff__anzahl {
	margin-left: auto;
	font-size: 0.875rem;
}

/* Startseite: Entdecken */
.ld-entdecken__panel {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 4fr) minmax(0, 3fr);
	gap: 36px;
	background: var(--ld-weiss);
	border: 1px solid var(--ld-linie);
	border-radius: var(--ld-r-panel);
	padding: 32px;
}

.ld-entdecken__panel > * {
	margin: 0 !important;
}

.ld-entdecken__panel > .wp-block-longdrinks-begriffe:has(.ldc-begriffe--zeilen) {
	border-left: 1px solid var(--ld-linie);
	padding-left: 32px;
}

@media (max-width: 1023.98px) {
	.ld-entdecken__panel {
		grid-template-columns: minmax(0, 1fr);
		gap: 20px;
		background: transparent;
		border: 0;
		padding: 0;
	}

	.ld-entdecken__panel > .wp-block-longdrinks-begriffe:has(.ldc-begriffe--zeilen) {
		border-left: 0;
		padding-left: 0;
	}

	.ldc-begriffe--zeilen .ldc-begriffe__liste {
		background: var(--ld-weiss);
		border: 1px solid var(--ld-linie);
		border-radius: 20px;
		padding: 6px 16px;
		gap: 0;
	}

	.ldc-begriffe--zeilen li + li .ldc-begriff {
		border-top: 1px solid var(--ld-linie);
	}

	.ldc-begriffe--zeilen .ldc-begriff {
		border-radius: 0;
		padding: 0;
	}

	.ldc-begriffe--zeilen .ldc-begriff::after {
		content: "›";
		color: var(--ld-grau);
		margin-left: 4px;
	}

	.ldc-begriffe--zeilen .ldc-begriff__anzahl + * {
		margin: 0;
	}
}

/* ------------------------------------------------------------------ Raster und Karten */

.ldc-raster,
.ld-raster {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--ld-luecke);
	list-style: none;
	margin: 0;
	padding: 0;
}

.ld-raster > li {
	margin: 0;
	display: flex;
}

.ld-raster > li > *,
.ldc-raster__zelle {
	display: flex;
	width: 100%;
	margin: 0;
}

.ld-raster > li > * > .ldc-karte,
.ldc-raster__zelle > .ldc-karte {
	width: 100%;
}

@media (min-width: 768px) {
	.ldc-raster,
	.ld-raster {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.ldc-raster,
	.ld-raster {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

.ldc-karte {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--ld-weiss);
	border: 1px solid var(--ld-linie);
	border-radius: var(--ld-r-karte);
	overflow: hidden;
	color: var(--ld-navy);
}

.ldc-karte:hover {
	border-color: var(--ld-navy);
}

.ldc-karte:has(.ldc-karte__link:focus-visible),
.ldc-mini:has(.ldc-karte__link:focus-visible),
.ldc-feature:has(.ldc-karte__link:focus-visible),
.ld-kachel:has(.ld-kachel__link:focus-visible) {
	outline: 3px solid var(--ld-tuerkis-tief);
	outline-offset: 3px;
}

.ldc-karte__link,
.ld-kachel__link {
	color: inherit;
	text-decoration: none;
}

.ldc-karte__link:hover,
.ld-kachel__link:hover {
	color: inherit;
	text-decoration: underline;
}

.ldc-karte__link:focus-visible,
.ld-kachel__link:focus-visible {
	outline: none;
}

.ldc-karte__link::after,
.ld-kachel__link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.ldc-karte__text {
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
	padding: 18px 18px 20px;
}

.ldc-karte__text > * {
	margin: 0;
}

.ldc-karte__titel {
	margin: 0;
	font-family: var(--ld-sans);
	font-size: 1.25rem;
	font-weight: 800;
	letter-spacing: 0;
	line-height: 1.25;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	overflow-wrap: anywhere;
}

.ldc-karte__meta {
	font-size: 0.875rem;
	color: var(--ld-grau);
}

.ldc-karte__text > .ldc-pegel--karte,
.ldc-karte__text > .ldc-karte__zutaten {
	margin-top: auto;
	padding-top: 6px;
}

.ldc-karte__zutaten {
	margin: 0;
	font-size: 0.8125rem;
	font-weight: 700;
	color: var(--ld-text-mittel);
	min-height: 22px;
}

.ldc-karte__auszug {
	font-size: 0.9375rem;
	color: var(--ld-grau);
}

.ldc-karte--text {
	padding: 4px 0;
}

.ldc-abzeichen {
	display: inline-flex;
	align-items: center;
	height: 28px;
	padding: 0 12px;
	border-radius: 999px;
	font-size: 0.8125rem;
	font-weight: 700;
	align-self: flex-start;
}

.ldc-karte > .ldc-abzeichen--alkoholfrei {
	position: absolute;
	top: 12px;
	right: 12px;
	background: var(--ld-navy);
	color: var(--ld-weiss);
}

.ldc-abzeichen--neu {
	background: var(--ld-sonne);
	color: var(--ld-navy);
}

@media (max-width: 767.98px) {
	.ldc-karte__text {
		padding: 12px;
		gap: 6px;
	}

	.ldc-karte__titel {
		font-size: 1rem;
	}

	.ldc-karte__meta {
		display: none;
	}

	.ldc-karte > .ldc-abzeichen--alkoholfrei {
		top: 8px;
		right: 8px;
		height: 26px;
		padding: 0 10px;
		font-size: 0.75rem;
	}
}

/* Illustration auf dem Farbkarton (Platzhalter bis Etappe 5) */
.ldc-illustration {
	position: relative;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	margin: 0;
	aspect-ratio: 4 / 5;
	background: var(--wp--preset--color--karton-creme);
	overflow: hidden;
}

.ldc-illustration--4-3 {
	aspect-ratio: 4 / 3;
}

.ldc-illustration--3-2 {
	aspect-ratio: 3 / 2;
}

.ldc-illustration--1-1 {
	aspect-ratio: 1 / 1;
}

.ldc-illustration .ld-glas,
.ldc-illustration .ldc-ill {
	display: block;
	width: auto;
	height: 80%;
	max-width: 80%;
	margin-bottom: 4%;
}

.ldc-karton--tuerkis {
	background: var(--wp--preset--color--karton-tuerkis);
}

.ldc-karton--koralle {
	background: var(--wp--preset--color--karton-koralle);
}

.ldc-karton--sonne {
	background: var(--wp--preset--color--karton-sonne);
}

.ldc-karton--navy {
	background: var(--wp--preset--color--karton-navy);
}

.ldc-karton--creme {
	background: var(--wp--preset--color--karton-creme);
}

.ldc-illustration__platzhalter {
	position: absolute;
	top: 14px;
	left: 14px;
	padding: 4px 8px;
	border-radius: 6px;
	border: 1px dashed var(--ld-navy);
	background: var(--ld-weiss);
	color: var(--ld-navy);
	font-size: 0.6875rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* ------------------------------------------------------------------ Pegel */

.ldc-pegel__balken {
	display: flex;
	gap: 3px;
	height: 10px;
}

.ldc-pegel__teil {
	display: block;
	flex: var(--ldc-teile, 1) 1 0;
	border-radius: 999px;
	min-width: 6px;
}

.ldc-pegel__teil--1,
.ldc-pegel__eintrag--1::before {
	background: var(--ld-tuerkis);
}

.ldc-pegel__teil--2,
.ldc-pegel__eintrag--2::before {
	background: var(--ld-koralle);
}

.ldc-pegel__teil--3,
.ldc-pegel__eintrag--3::before {
	background: var(--ld-sonne);
	box-shadow: inset 0 0 0 1px #C9A23A;
}

.ldc-pegel__teil--4,
.ldc-pegel__eintrag--4::before {
	background: #B9C3D6;
}

.ldc-pegel__teil--5,
.ldc-pegel__eintrag--5::before {
	background: #8CC63F;
}

.ldc-pegel__teil--6,
.ldc-pegel__eintrag--6::before {
	background: #D94F7C;
}

.ldc-pegel--karte {
	display: flex;
	align-items: center;
	gap: 10px;
}

.ldc-pegel--karte .ldc-pegel__balken {
	flex: 1;
}

.ldc-pegel--karte .ldc-pegel__zahlen {
	font-size: 0.8125rem;
	font-weight: 800;
	white-space: nowrap;
}

.ldc-pegel--rezept {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.ldc-pegel--rezept .ldc-pegel__titel {
	margin: 0;
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ld-grau);
}

.ldc-pegel--rezept .ldc-pegel__zahlen {
	letter-spacing: 0.04em;
}

.ldc-pegel__zusatz {
	text-transform: none;
	letter-spacing: 0;
}

.ldc-pegel--rezept .ldc-pegel__balken {
	height: 14px;
}

.ldc-pegel__legende {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 0.9375rem;
}

.ldc-pegel__eintrag {
	display: flex;
	align-items: center;
	gap: 8px;
}

.ldc-pegel__eintrag::before {
	content: "";
	width: 12px;
	height: 12px;
	border-radius: 6px;
	flex-shrink: 0;
}

.ldc-pegel--liste .ldc-pegel__balken {
	height: 8px;
	width: 64px;
}

@media (max-width: 767.98px) {
	.ldc-pegel--rezept .ldc-pegel__balken {
		height: 12px;
	}
}

/* ------------------------------------------------------------------ Barkarte (dunkel) */

.ld-barkarte-band {
	position: relative;
	background: var(--ld-navy);
	color: var(--ld-weiss);
	padding-block: 56px 88px;
	margin-block: 48px calc(var(--ld-sektion) + 48px) !important;
}

.ld-barkarte-band::before,
.ld-barkarte-band::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	height: 48px;
	background: var(--ld-navy);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 48' preserveAspectRatio='none'%3E%3Cpath d='M0 48 V24 C 120 0 240 0 360 24 S 600 48 720 24 S 960 0 1080 24 S 1320 48 1440 24 V48 Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 48' preserveAspectRatio='none'%3E%3Cpath d='M0 48 V24 C 120 0 240 0 360 24 S 600 48 720 24 S 960 0 1080 24 S 1320 48 1440 24 V48 Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
	pointer-events: none;
}

.ld-barkarte-band::before {
	top: -47px;
}

.ld-barkarte-band::after {
	bottom: -47px;
	transform: scaleY(-1);
}

.ld-barkarte-band__innen {
	display: grid;
	grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
	gap: 64px;
	align-items: start;
}

.ld-barkarte-band__text {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.ld-barkarte-band__text > * {
	margin: 0 !important;
}

.ld-barkarte-band .ld-dachzeile {
	color: var(--ld-sonne);
}

.ld-barkarte-band h2 {
	color: var(--ld-weiss);
}

/* Knopf-Link (Block ld-theme/seitenlink), z. B. "Zur Mischverhältnis-Tabelle" in der Barkarte */
.ld-knopf {
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	padding: 12px 22px;
	border-radius: 999px;
	font-weight: 800;
	text-decoration: none;
}

.ld-knopf--sonne {
	background: var(--ld-sonne);
	color: var(--ld-navy);
}

.ld-knopf--sonne:hover,
.ld-knopf--sonne:focus-visible {
	background: var(--ld-weiss);
	color: var(--ld-navy);
}

.ld-barkarte-band__text p:not(.ld-dachzeile) {
	color: var(--wp--preset--color--navy-text);
	font-size: 1.0625rem;
	line-height: 1.6;
}

.ldc-barkarte {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 48px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.ldc-barkarte__eintrag {
	display: flex;
	align-items: center;
	gap: 14px;
	min-height: 64px;
	border-bottom: 1px solid var(--wp--preset--color--navy-linie);
	color: var(--ld-weiss);
	text-decoration: none;
}

.ldc-barkarte__eintrag:hover {
	color: var(--ld-sonne);
}

.ldc-barkarte__name {
	font-weight: 700;
	font-size: 1.125rem;
}

.ldc-barkarte__linie {
	flex: 1;
	border-bottom: 2px dotted #3F4B70;
	transform: translateY(4px);
	min-width: 12px;
}

.ldc-barkarte__zahlen {
	font-weight: 800;
	color: var(--ld-sonne);
	min-width: 64px;
	text-align: right;
	white-space: nowrap;
}

@media (max-width: 1023.98px) {
	.ld-barkarte-band {
		padding-block: 28px 40px;
		margin-block: 40px calc(var(--ld-sektion) + 32px) !important;
	}

	.ld-barkarte-band::before {
		top: -31px;
		height: 32px;
	}

	.ld-barkarte-band::after {
		bottom: -31px;
		height: 32px;
	}

	.ld-barkarte-band__innen {
		grid-template-columns: minmax(0, 1fr);
		gap: 14px;
	}

	.ldc-barkarte {
		grid-template-columns: minmax(0, 1fr);
	}

	.ldc-barkarte__eintrag {
		min-height: 52px;
		gap: 10px;
	}

	.ldc-barkarte__name {
		font-size: 1rem;
	}

	.ldc-barkarte__linie {
		visibility: hidden;
	}

	.ldc-barkarte .ldc-pegel--liste .ldc-pegel__balken {
		width: 48px;
	}

	.ldc-barkarte__zahlen {
		min-width: 52px;
	}
}

/* ------------------------------------------------------------------ Neu auf der Karte */

.ldc-neu {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	gap: 28px;
}

.ldc-feature {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	background: var(--ld-weiss);
	border: 1px solid var(--ld-linie);
	border-radius: var(--ld-r-karte);
	overflow: hidden;
}

.ldc-feature:hover,
.ldc-mini:hover {
	border-color: var(--ld-navy);
}

.ldc-feature .ldc-illustration {
	aspect-ratio: auto;
	min-height: 380px;
}

.ldc-feature__text {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 14px;
	padding: 32px;
}

.ldc-feature__text > * {
	margin: 0;
}

.ldc-feature__titel {
	font-family: var(--ld-display);
	font-size: 1.75rem;
	font-weight: 700;
	letter-spacing: -0.025em;
	line-height: 1.15;
}

.ldc-feature__auszug {
	color: var(--ld-grau);
	font-size: 1rem;
	line-height: 1.6;
}

.ldc-feature__meta,
.ldc-mini__meta {
	font-size: 0.875rem;
	color: var(--ld-grau);
}

.ldc-neu__weitere,
.ldc-minis {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.ldc-mini {
	position: relative;
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 12px;
	background: var(--ld-weiss);
	border: 1px solid var(--ld-linie);
	border-radius: var(--ld-r-karte);
}

.ldc-mini .ldc-illustration {
	width: 96px;
	flex-shrink: 0;
	border-radius: 12px;
}

.ldc-mini__text {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.ldc-mini__text > * {
	margin: 0;
}

.ldc-mini__titel {
	font-family: var(--ld-sans);
	font-size: 1.125rem;
	font-weight: 800;
	letter-spacing: 0;
	line-height: 1.3;
}

.ldc-minis {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ldc-minis .ldc-mini {
	gap: 14px;
	padding: 14px;
}

.ldc-minis .ldc-illustration {
	width: 56px;
}

.ldc-minis .ldc-mini__titel {
	font-size: 1.0625rem;
}

@media (max-width: 1023.98px) {
	.ldc-neu {
		grid-template-columns: minmax(0, 1fr);
		gap: 14px;
	}

	.ldc-feature {
		grid-template-columns: minmax(0, 1fr);
	}

	.ldc-feature .ldc-illustration {
		aspect-ratio: 3 / 2;
		min-height: 0;
	}

	.ldc-feature__text {
		padding: 16px;
		gap: 8px;
	}

	.ldc-feature__titel {
		font-size: 1.375rem;
	}

	.ldc-mini {
		padding: 10px;
		gap: 14px;
	}

	.ldc-mini .ldc-illustration {
		width: 72px;
		border-radius: 10px;
	}

	.ldc-mini__titel {
		font-size: 1rem;
	}

	.ldc-minis {
		grid-template-columns: minmax(0, 1fr);
		gap: 10px;
	}

	.ldc-minis .ldc-illustration {
		width: 48px;
	}
}

/* ------------------------------------------------------------------ Barwissen-Kacheln */


.ld-kacheln {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.ld-kachel {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-height: 230px;
	padding: 28px;
	border-radius: 24px;
	background: var(--wp--preset--color--karton-tuerkis);
	color: var(--ld-navy);
}

.ld-kachel--sonne {
	background: var(--wp--preset--color--karton-sonne);
}

.ld-kachel--koralle {
	background: var(--wp--preset--color--karton-koralle);
}

.ld-kachel__titel {
	margin: 0;
	font-family: var(--ld-display);
	font-size: 1.375rem;
	font-weight: 700;
	letter-spacing: -0.025em;
	line-height: 1.15;
}

.ld-kachel__text {
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: var(--ld-text-mittel);
}

.ld-kachel__mehr {
	margin-top: auto;
	font-weight: 800;
	color: var(--ld-tuerkis-tief);
}

.ld-vertrauen {
	margin: 28px 0 0;
	font-size: 0.9375rem;
	color: var(--ld-grau);
}

@media (max-width: 1023.98px) {
	.ld-kacheln {
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
	}

	.ld-kachel {
		min-height: 0;
		padding: 18px;
		gap: 4px;
		border-radius: 18px;
	}

	.ld-kachel__symbol,
	.ld-kachel__mehr {
		display: none;
	}

	.ld-kachel__titel {
		font-family: var(--ld-sans);
		font-size: 1.0625rem;
		font-weight: 800;
		letter-spacing: 0;
	}

	.ld-kachel__text {
		font-size: 0.875rem;
	}
}

@media (max-width: 1023.98px) {
	.ld-abschnitt__titel,
	.ldc-rezeptliste__titel,
	.ld-barkarte-band h2 {
		font-size: 1.5rem;
	}

	.ld-abschnitt__kopf,
	.ldc-rezeptliste__kopf {
		margin-bottom: 16px;
	}

	.ld-start > .ld-abschnitt,
	.ld-start > .wp-block-longdrinks-rezeptliste {
		margin-block-end: 40px;
	}
}

/* ------------------------------------------------------------------ Brotkrumen */

.ld-brotkrumen {
	padding-top: 22px;
	font-size: 0.875rem;
	color: var(--ld-grau);
}

.ld-brotkrumen ol {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 8px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.ld-brotkrumen li + li::before {
	content: "/";
	margin-right: 8px;
	color: var(--ld-grau);
}

.ld-brotkrumen a {
	color: var(--ld-grau);
}

.ld-brotkrumen a:hover {
	color: var(--ld-navy);
}

.ld-brotkrumen [aria-current="page"] {
	color: var(--ld-navy);
	font-weight: 700;
}

@media (max-width: 767.98px) {
	.ld-brotkrumen {
		padding-top: 14px;
		font-size: 0.8125rem;
	}
}

/* ------------------------------------------------------------------ Rezeptseite */

.ld-rezept > .wp-block-ld-theme-brotkrumen {
	margin-top: 0;
}

.ld-rezept__artikel {
	margin-top: 0 !important;
}

.ld-rezept-kopf {
	display: grid;
	grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
	gap: 56px;
	align-items: center;
	padding-block: 28px 64px;
}

.ld-rezept-kopf__bild .ldc-illustration {
	border-radius: var(--ld-r-panel);
}

.ld-rezept-kopf__text {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 8px;
	row-gap: 22px;
}

.ld-rezept-kopf__text > * {
	flex: 1 0 100%;
	margin: 0 !important;
}

.ld-rezept-kopf__text > .ld-abzeichen-leiste {
	flex: 0 0 auto;
}

.ld-abzeichen-leiste {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.ld-abzeichen-leiste a {
	display: inline-flex;
	align-items: center;
	height: 28px;
	padding: 0 12px;
	border-radius: 999px;
	font-size: 0.8125rem;
	font-weight: 700;
	background: var(--wp--preset--color--karton-koralle);
	color: var(--ld-navy);
	text-decoration: none;
}

.ld-abzeichen-leiste a:hover {
	text-decoration: underline;
}

.ld-abzeichen-leiste--dunkel a {
	background: var(--ld-navy);
	color: var(--ld-weiss);
}

.ld-abzeichen-leiste .wp-block-post-terms__separator {
	display: none;
}

.ldc-fakten {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1px;
	margin: 0;
	background: var(--ld-linie);
	border: 1px solid var(--ld-linie);
	border-radius: var(--ld-r-karte);
	overflow: hidden;
}

.ldc-fakt {
	background: var(--ld-weiss);
	padding: 16px 18px;
}

.ldc-fakt__name {
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ld-grau);
}

.ldc-fakt__wert {
	margin: 4px 0 0;
	font-weight: 800;
	font-size: 1.125rem;
}

.ld-rezept-kopf__aktion {
	gap: 12px 18px;
}

.ld-zeile-autor {
	gap: 4px;
	font-size: 0.875rem;
	color: var(--ld-grau);
}

.ld-zeile-autor > * {
	margin: 0 !important;
	font-size: 0.875rem !important;
	color: var(--ld-grau);
}

.ld-zeile-autor .wp-block-ld-theme-datum time {
	white-space: nowrap;
}

.ld-zeile-autor .wp-block-post-author-name {
	font-weight: 700;
	color: var(--ld-navy);
}

.ld-sprung ul {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0 8px;
	background: var(--ld-creme);
	border-bottom: 1px solid var(--ld-linie);
}

.ld-sprung li {
	flex: 1;
}

.ld-sprung a {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	font-weight: 800;
	font-size: 0.875rem;
	color: var(--ld-text-mittel);
	text-decoration: none;
	border-bottom: 3px solid transparent;
}

.ld-sprung a:hover,
.ld-sprung a:focus-visible {
	color: var(--ld-navy);
	border-bottom-color: var(--ld-koralle);
}

/* Zutaten und Zubereitung */
.ld-rezept-block {
	background: var(--ld-weiss);
	border-block: 1px solid var(--ld-linie);
	padding-block: 64px;
	margin-top: 0 !important;
	scroll-margin-top: 0;
}

.ld-rezept-block__innen {
	display: grid;
	grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
	gap: 56px;
	align-items: start;
}

.ld-zutaten-box {
	position: sticky;
	top: 24px;
	display: flex;
	flex-direction: column;
	gap: 20px;
	background: var(--ld-creme);
	border-radius: 24px;
	padding: 28px;
}

.ld-zutaten-box > *,
.ld-zubereitung > * {
	margin: 0 !important;
}

.ld-zutaten-box h2,
.ld-zubereitung h2 {
	font-size: 1.625rem;
}

.ld-zubereitung {
	display: flex;
	flex-direction: column;
	gap: 26px;
}

.ldc-zutaten {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.ldc-portionen {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 10px;
}

.ldc-portionen__vor,
.ldc-portionen__nach {
	display: none;
	font-size: 0.9375rem;
	font-weight: 700;
}

.ldc-portionen__auswahl {
	flex: 1;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 4px;
	background: var(--ld-weiss);
	border: 1px solid var(--ld-linie);
	border-radius: 999px;
	padding: 4px;
}

.ldc-portionen__wahl {
	min-height: 44px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--ld-navy);
	font-family: var(--ld-sans);
	font-weight: 800;
	font-size: 0.9375rem;
	cursor: pointer;
	padding: 0 6px;
	white-space: nowrap;
}

.ldc-portionen__wahl[aria-pressed="true"] {
	background: var(--ld-navy);
	color: var(--ld-weiss);
}

.ldc-portionen__wahl:disabled {
	cursor: not-allowed;
	color: var(--ld-grau);
}

.ldc-portionen__hinweis {
	flex: 1 0 100%;
	margin: 0;
	font-size: 0.8125rem;
	color: var(--ld-grau);
}

.ldc-zutaten__liste {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ldc-zutat {
	display: grid;
	grid-template-columns: 104px minmax(0, 1fr);
	gap: 12px;
	align-items: center;
	min-height: 52px;
	padding-block: 6px;
	border-bottom: 1px solid var(--ld-linie);
	font-size: 1.0625rem;
}

.ldc-zutat__menge {
	font-weight: 800;
}

.ldc-zutat__hinweis {
	display: block;
	font-size: 0.875rem;
	color: var(--ld-grau);
}

.ldc-zutat__optional {
	color: var(--ld-grau);
	font-size: 0.9375rem;
}

.ldc-zutaten__glas {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--ld-text-mittel);
}

.ldc-zutaten__glas strong {
	color: var(--ld-navy);
}

.ldc-schritte {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.ldc-schritt {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr);
	gap: 18px;
	align-items: start;
}

.ldc-schritt__nummer {
	width: 44px;
	height: 44px;
	border-radius: 22px;
	background: var(--wp--preset--color--karton-tuerkis);
	color: var(--ld-tuerkis-tief);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--ld-display);
	font-weight: 700;
	font-size: 1.0625rem;
}

.ldc-schritt__text {
	margin: 8px 0 0;
	font-size: 1.125rem;
	line-height: 1.6;
}

.ldc-schritt__kern {
	font-weight: 800;
}

/* Hintergrund, Quellen, Autor */
.ld-rezept-inhalt {
	display: grid;
	grid-template-columns: minmax(0, 8fr) minmax(0, 3fr);
	gap: 64px;
	padding-block: 16px 88px;
	margin-top: 0 !important;
}

.ld-lesespalte {
	max-width: 760px;
	min-width: 0;
}

.ld-lesespalte > * + * {
	margin-top: 48px;
}

.ld-lesespalte > .ld-prosa:empty,
.ld-lesespalte > .ld-prosa:not(:has(*)) {
	display: none;
}

.ld-seitenleiste {
	align-self: start;
	position: sticky;
	top: 24px;
	margin-top: 56px !important;
}

.ld-toc {
	background: var(--ld-weiss);
	border: 1px solid var(--ld-linie);
	border-radius: var(--ld-r-karte);
	padding: 16px;
}

.ld-toc__titel {
	margin: 0;
	padding: 4px 12px 8px;
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ld-grau);
}

.ld-toc ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.ld-toc a {
	display: block;
	padding: 8px 12px;
	border-radius: 8px;
	color: var(--ld-text-mittel);
	font-weight: 600;
	font-size: 0.9375rem;
	text-decoration: none;
}

.ld-toc a:hover {
	background: var(--ld-sand);
	color: var(--ld-navy);
}

/* Inhaltsverzeichnis in Ratgebern: im Lesefluss vor dem Text, ab 4 Abschnitten */
.ld-toc-beitrag {
	margin-block: 8px 8px;
}

.ldc-belege__titel {
	margin: 0 0 14px;
	font-family: var(--ld-display);
	font-size: 1.375rem;
	font-weight: 700;
	letter-spacing: -0.025em;
}

.ldc-belege__liste {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
	font-size: 0.9375rem;
}

.ldc-beleg__titel {
	font-weight: 700;
}

.ldc-beleg__typ {
	color: var(--ld-grau);
}

.ldc-beleg__belegt,
.ldc-beleg__datum {
	display: block;
	font-size: 0.875rem;
	color: var(--ld-grau);
}

.ldc-belege__pruefung {
	margin: 14px 0 0;
	font-size: 0.875rem;
	color: var(--ld-grau);
}

.ld-autor {
	display: flex;
	gap: 18px;
	align-items: center;
	background: var(--ld-weiss);
	border: 1px solid var(--ld-linie);
	border-radius: 20px;
	padding: 22px;
}

.ld-autor__initialen {
	width: 64px;
	height: 64px;
	flex-shrink: 0;
	border-radius: 32px;
	background: var(--ld-tuerkis-tief);
	color: var(--ld-weiss);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--ld-display);
	font-weight: 700;
}

.ld-autor__text {
	margin: 0;
	font-size: 1rem;
	line-height: 1.6;
	color: var(--ld-text-mittel);
}

.ld-autor__text strong {
	color: var(--ld-navy);
}

.ld-band-weiss {
	background: var(--ld-weiss);
	border-top: 1px solid var(--ld-linie);
	padding-block: 72px 88px;
	margin-top: 0 !important;
}

.ld-band-weiss .ldc-rezeptliste__titel {
	font-size: 2rem;
}

@media (max-width: 1023.98px) {
	.ld-rezept-kopf {
		grid-template-columns: minmax(0, 1fr);
		gap: 16px;
		padding-block: 12px 20px;
	}

	/* Mobile Reihenfolge laut Entwurf: Titel, Bild, Einleitung, Eckdaten, Pegel. */
	.ld-rezept-kopf__text {
		display: contents;
	}

	.ld-rezept-kopf > * {
		margin: 0 !important;
	}

	.ld-rezept-kopf .ld-abzeichen-leiste {
		display: none;
	}

	.ld-rezept-kopf .ld-h1-rezept {
		order: 1;
	}

	.ld-rezept-kopf__bild {
		order: 2;
	}

	.ld-rezept-kopf__bild .ldc-illustration {
		aspect-ratio: 4 / 3;
		border-radius: 20px;
	}

	.ld-rezept-kopf .ld-einleitung {
		order: 3;
		font-size: 1.0625rem;
	}

	.ld-rezept-kopf .wp-block-longdrinks-fakten {
		order: 4;
	}

	.ld-rezept-kopf .wp-block-longdrinks-pegel {
		order: 5;
	}

	.ld-rezept-kopf .ld-rezept-kopf__aktion {
		order: 6;
	}

	.ld-sprung-leiste {
		position: sticky;
		top: 0;
		z-index: 5;
		margin-inline: calc(var(--wp--style--root--padding-left) * -1) calc(var(--wp--style--root--padding-right) * -1) !important;
	}

	.ldc-fakten {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		border-radius: 16px;
	}

	.ldc-fakt {
		padding: 12px 14px;
	}

	.ldc-fakt__name {
		font-size: 0.6875rem;
	}

	.ldc-fakt__wert {
		font-size: 1rem;
		margin-top: 2px;
	}

	.ld-rezept-block {
		background: transparent;
		border: 0;
		padding-block: 4px 8px;
	}

	.ld-rezept-block__innen {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
	}

	.ld-zutaten-box {
		position: static;
		background: var(--ld-weiss);
		border: 1px solid var(--ld-linie);
		border-radius: 20px;
		padding: 20px 16px;
		gap: 14px;
	}

	.ld-zutaten-box h2,
	.ld-zubereitung h2 {
		font-size: 1.375rem;
	}

	.ld-zubereitung {
		gap: 18px;
	}

	.ldc-portionen__vor,
	.ldc-portionen__nach {
		display: inline;
	}

	.ldc-portionen__einheit {
		display: none;
	}

	.ldc-portionen__auswahl {
		background: var(--ld-creme);
		border: 0;
		font-size: 1rem;
	}

	.ldc-zutat {
		grid-template-columns: 100px minmax(0, 1fr);
		gap: 10px;
		min-height: 50px;
		font-size: 1rem;
	}

	.ldc-schritt {
		grid-template-columns: 36px minmax(0, 1fr);
		gap: 14px;
	}

	.ldc-schritt__nummer {
		width: 36px;
		height: 36px;
		border-radius: 18px;
		font-size: 0.9375rem;
	}

	.ldc-schritt__text {
		margin-top: 6px;
		font-size: 1.0625rem;
		line-height: 1.55;
	}

	.ld-rezept-inhalt {
		grid-template-columns: minmax(0, 1fr);
		gap: 0;
		padding-block: 28px 40px;
	}

	.ld-lesespalte > * + * {
		margin-top: 32px;
	}

	.ld-band-weiss {
		padding-block: 32px 40px;
	}

	.ld-band-weiss .ldc-rezeptliste__titel {
		font-size: 1.375rem;
	}

	.ld-autor {
		align-items: flex-start;
		padding: 16px;
	}

	.ld-autor__initialen {
		width: 48px;
		height: 48px;
		font-size: 0.875rem;
	}
}

/* ------------------------------------------------------------------ Lesetext */

.ld-prosa > p,
.ld-prosa > ul,
.ld-prosa > ol {
	font-size: 1.125rem;
	line-height: 1.7;
	color: var(--ld-text);
}

.ld-prosa > * + * {
	margin-top: 18px;
}

.ld-prosa h2 {
	font-size: 1.75rem;
	line-height: 1.2;
	margin: 56px 0 18px;
}

.ld-prosa h2:first-child {
	margin-top: 32px;
}

.ld-prosa h3 {
	margin: 36px 0 12px;
}

.ld-prosa table {
	width: 100%;
	border-collapse: collapse;
	font-size: 1.0625rem;
	background: var(--ld-weiss);
}

.ld-prosa .wp-block-table,
.ld-prosa figure.wp-block-table {
	overflow-x: auto;
	border: 1px solid var(--ld-linie);
	border-radius: var(--ld-r-karte);
	background: var(--ld-weiss);
}

.ld-prosa th,
.ld-prosa td {
	padding: 14px 18px;
	border: 0;
	border-top: 1px solid var(--ld-linie);
	text-align: left;
}

.ld-prosa thead th {
	background: var(--ld-creme);
	border-top: 0;
}

.ld-prosa details {
	border-top: 1px solid var(--ld-linie);
	margin: 0;
}

.ld-prosa details:last-of-type {
	border-bottom: 1px solid var(--ld-linie);
}

.ld-prosa details + details {
	margin-top: 0;
}

.ld-prosa summary {
	cursor: pointer;
	min-height: 60px;
	display: flex;
	align-items: center;
	font-weight: 800;
	font-size: 1.125rem;
	list-style: none;
}

.ld-prosa summary::-webkit-details-marker {
	display: none;
}

.ld-prosa summary::after {
	content: "+";
	margin-left: auto;
	padding-left: 12px;
	font-family: var(--ld-display);
	color: var(--ld-tuerkis-tief);
}

.ld-prosa details[open] > summary::after {
	content: "-";
}

.ld-prosa details > :not(summary) {
	margin: 0 0 20px;
	font-size: 1.0625rem;
	line-height: 1.65;
	color: var(--ld-text);
}

.ld-tipp,
.ld-prosa .is-style-tipp {
	background: var(--wp--preset--color--karton-sonne);
	border-radius: 20px;
	padding: 22px 26px;
}

@media (max-width: 767.98px) {
	.ld-prosa > p,
	.ld-prosa > ul,
	.ld-prosa > ol {
		font-size: 1.0625rem;
	}

	.ld-prosa h2 {
		font-size: 1.375rem;
		margin-top: 40px;
	}

	.ld-prosa summary {
		min-height: 56px;
		font-size: 1rem;
	}
}

/* ------------------------------------------------------------------ Übersichten, Seiten */

.ld-uebersicht,
.ld-seite,
.ld-beitrag {
	padding-bottom: var(--ld-sektion);
}

.ld-uebersicht > *,
.ld-seite > *,
.ld-beitrag > * {
	margin-top: 0;
}

.ld-seitenkopf {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding-block: 28px 40px;
}

.ld-seitenkopf > * {
	margin: 0 !important;
}

.ld-filter {
	display: flex;
	flex-direction: column;
	gap: 18px;
	margin-top: 8px !important;
}

.ld-filter .ldc-begriffe__titel {
	font-size: 0.75rem;
}

.ld-seiten {
	margin-top: 40px;
	gap: 8px;
	font-weight: 700;
}

.ld-seiten a,
.ld-seiten .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0 12px;
	border-radius: 999px;
	color: var(--ld-navy);
	text-decoration: none;
}

.ld-seiten a:hover {
	background: var(--ld-sand);
}

.ld-seiten .current {
	background: var(--ld-navy);
	color: var(--ld-weiss);
}

.ld-leer {
	background: var(--ld-weiss);
	border: 1px solid var(--ld-linie);
	border-radius: var(--ld-r-karte);
	padding: 32px;
	font-size: 1.0625rem;
	color: var(--ld-grau);
}

.ld-leer > * {
	margin: 0;
}

.ld-textkarten {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.ld-textkarte {
	display: flex;
	flex-direction: column;
	gap: 10px;
	height: 100%;
	background: var(--ld-weiss);
	border: 1px solid var(--ld-linie);
	border-radius: var(--ld-r-karte);
	padding: 24px;
}

.ld-textkarte > * {
	margin: 0 !important;
}

.ld-textkarte__titel {
	font-family: var(--ld-sans);
	font-size: 1.25rem;
	font-weight: 800;
	letter-spacing: 0;
	line-height: 1.3;
}

.ld-textkarte__titel a {
	color: var(--ld-navy);
}

.ld-textkarte__auszug {
	font-size: 0.9375rem;
	color: var(--ld-grau);
}

.ld-textkarte__datum {
	margin-top: auto !important;
}

.ld-dachzeile a {
	color: inherit;
	text-decoration: none;
}

@media (max-width: 1023.98px) {
	.ld-textkarten {
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
	}

	.ld-seitenkopf {
		padding-block: 14px 24px;
	}
}

.ld-seite > .ld-h1-rezept,
.ld-beitrag__artikel > .ld-h1-rezept {
	margin-top: 28px;
}

.ld-beitrag__artikel > * + *,
.ld-seite > * + * {
	margin-top: 22px;
}

.ld-seite .wp-block-search,
.ld-seite .wp-block-buttons {
	margin-top: 28px;
}

/* ------------------------------------------------------------------ Editor */

.ldc-editor-platzhalter {
	padding: 14px 16px;
	border: 1px dashed var(--ld-grau);
	border-radius: 8px;
	font-size: 0.875rem;
	color: var(--ld-grau);
	background: var(--ld-weiss);
}

/* Listen innerhalb der Lesespalte: Überschrift wie Lesetext-H2 */
.ld-lesespalte .ldc-rezeptliste__titel {
	font-size: 1.75rem;
	line-height: 1.2;
}

@media (max-width: 767.98px) {
	.ld-lesespalte .ldc-rezeptliste__titel {
		font-size: 1.375rem;
	}

	.ld-prosa th,
	.ld-prosa td {
		padding: 12px;
		font-size: 0.9375rem;
	}
}

/* Suche ab 1024 px rechts in der Kopfzeile (Design C), Navigation links mit flexiblem Abstand.
   WordPress setzt in Flex-Gruppen die Außenabstände zurück, daher !important. */
@media (min-width: 1024px) {
	.ld-kopf__zeile > .ld-suche--kopf {
		margin-left: auto !important;
	}
}

/* Kopfbereich zwischen 1024 und 1279 px: enger setzen, damit Navigation und Suche in eine Zeile passen */
@media (min-width: 1024px) and (max-width: 1279.98px) {
	.ld-kopf__zeile {
		column-gap: 16px;
	}

	.ld-nav .wp-block-navigation-item__content {
		padding: 10px 8px !important;
	}

	.ld-suche--kopf {
		flex-basis: 240px;
		min-width: 180px;
	}
}

/* In zentrierten Spalten (constrained) bleiben schmalere Elemente linksbündig zur Spalte */
.is-layout-constrained > .ld-einleitung,
.is-layout-constrained > .ld-suche--gross {
	max-width: var(--wp--style--global--content-size);
}

.ld-beitrag__artikel > .ld-dachzeile {
	margin-top: 28px;
}

.ld-beitrag > .wp-block-ld-theme-brotkrumen + .ld-beitrag__artikel {
	margin-top: 0;
}

.ld-logo {
	min-height: 44px;
}

/* Sprungziele nicht unter der mobilen Sprungleiste verstecken */
@media (max-width: 1023.98px) {
	#rezept,
	#zutaten,
	#zubereitung,
	#hintergrund {
		scroll-margin-top: 60px;
	}
}

/* Tablet: Rezeptbild flacher, damit Zutaten früher sichtbar sind */
@media (min-width: 600px) and (max-width: 1023.98px) {
	.ld-rezept-kopf__bild .ldc-illustration {
		aspect-ratio: 16 / 9;
	}
}

/* ------------------------------------------------------------------ Etappe 5: Illustration, Pegelfarben, Portionsrechner */

.ld-held__bild > * {
	margin: 0 !important;
}

.ld-held__glaeser svg {
	width: 30%;
	height: auto;
	max-width: 170px;
}

.ldc-illustration .ldc-ill--datei {
	object-fit: contain;
	object-position: bottom center;
}

/* Drinkfarben aus den Rezeptdaten; ohne Farbe bleiben die Markenfarben in fester Reihenfolge. */
.ldc-pegel__teil.ldc-farbe,
.ldc-pegel__eintrag.ldc-farbe::before,
.ldc-zutat__farbe {
	background: var(--ldc-farbe);
	box-shadow: none;
}

.ldc-pegel__teil.ldc-farbe--hell,
.ldc-pegel__eintrag.ldc-farbe--hell::before,
.ldc-zutat__farbe.ldc-farbe--hell {
	box-shadow: inset 0 0 0 1px #6E95A3;
}

.ldc-zutat__farbe {
	width: 14px;
	height: 14px;
	border-radius: 7px;
	box-shadow: inset 0 0 0 1px rgba(23, 32, 58, 0.25);
}

.ldc-zutaten__liste--farben .ldc-zutat {
	grid-template-columns: 14px 92px minmax(0, 1fr);
}

.ldc-zutaten__liste--farben .ldc-zutat--ohne-farbe .ldc-zutat__menge {
	grid-column: 2;
}

.ldc-portionen[hidden] {
	display: none !important;
}

.ldc-portionen__wahl:hover:not([aria-pressed="true"]) {
	background: var(--ld-sand);
}

.ldc-portionen__hinweis {
	min-height: 1.4em;
}

@media (max-width: 1023.98px) {
	.ldc-zutaten__liste--farben .ldc-zutat {
		grid-template-columns: 12px 88px minmax(0, 1fr);
	}

	.ldc-zutat__farbe {
		width: 12px;
		height: 12px;
	}
}

/* ------------------------------------------------------------------ Hub: Einstieg, Fakten, kompaktes Verzeichnis, Tabellen als Karten */

.ld-prosa .ld-fakten {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin: 28px 0 8px;
	padding: 0;
	list-style: none;
}

.ld-prosa ul.ld-fakten > li:nth-child(n) {
	margin: 0;
	padding: 16px 18px;
	border-radius: var(--ld-r-karte);
	background: var(--wp--preset--color--karton-tuerkis);
	font-size: 0.9375rem;
	line-height: 1.45;
	color: var(--ld-text-mittel);
}

.ld-prosa ul.ld-fakten > li:nth-child(2) {
	background: var(--wp--preset--color--karton-sonne);
}

.ld-prosa ul.ld-fakten > li:nth-child(3) {
	background: var(--wp--preset--color--karton-koralle);
}

.ld-prosa .ld-fakten strong {
	display: block;
	margin-bottom: 2px;
	font-family: var(--ld-display);
	font-size: 1.125rem;
	letter-spacing: -0.02em;
	color: var(--ld-navy);
}

.ld-toc--kompakt {
	padding: 14px 16px;
}

.ld-toc--kompakt .ld-toc__titel {
	padding: 0 4px 10px;
}

.ld-toc--kompakt ul {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 8px;
}

@media (max-width: 639.98px) {
	/* Mobil: eine wischbare Zeile statt vieler Zeilen; der Verlauf rechts zeigt, dass weitere Einträge folgen. */
	.ld-toc--kompakt ul {
		flex-wrap: nowrap;
		overflow-x: auto;
		scrollbar-width: thin;
		padding: 0 40px 6px 0;
		-webkit-mask-image: linear-gradient(to right, #000 calc(100% - 48px), transparent);
		mask-image: linear-gradient(to right, #000 calc(100% - 48px), transparent);
	}

	.ld-toc--kompakt li {
		flex: 0 0 auto;
	}
}

.ld-toc--kompakt a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 6px 14px;
	border: 1px solid var(--ld-linie);
	border-radius: 999px;
	font-size: 0.875rem;
}

@media (max-width: 639.98px) {
	.ld-prosa .ld-fakten {
		grid-template-columns: minmax(0, 1fr);
		gap: 8px;
	}

	.ld-prosa ul.ld-fakten > li:nth-child(n) {
		padding: 12px 16px;
	}

	.ld-prosa figure.is-style-karten {
		overflow: visible;
		border: 0;
		background: transparent;
	}

	.ld-prosa .is-style-karten table,
	.ld-prosa .is-style-karten tbody,
	.ld-prosa .is-style-karten tr,
	.ld-prosa .is-style-karten th,
	.ld-prosa .is-style-karten td {
		display: block;
		width: auto;
	}

	.ld-prosa .is-style-karten table {
		background: transparent;
	}

	.ld-prosa .is-style-karten thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		white-space: nowrap;
	}

	.ld-prosa .is-style-karten tbody tr {
		margin: 0 0 12px;
		padding: 14px 16px;
		border: 1px solid var(--ld-linie);
		border-radius: var(--ld-r-karte);
		background: var(--ld-weiss);
	}

	.ld-prosa .is-style-karten tbody th {
		padding: 0 0 8px;
		border: 0;
		font-family: var(--ld-display);
		font-size: 1.125rem;
	}

	.ld-prosa .is-style-karten tbody td {
		display: grid;
		grid-template-columns: 7.5rem minmax(0, 1fr);
		gap: 12px;
		padding: 6px 0;
		border-top: 1px solid var(--ld-linie);
		font-size: 1rem;
	}

	.ld-prosa .is-style-karten tbody td::before {
		content: attr(data-label);
		font-size: 0.8125rem;
		font-weight: 800;
		letter-spacing: 0.04em;
		text-transform: uppercase;
		color: var(--ld-grau);
	}

	.ld-prosa .is-style-karten figcaption {
		margin-top: 4px;
		text-align: left;
	}
}

/* Breite Tabellen im Text (Ausrichtung "weit"): breiter als der Fließtext, aber begrenzt */
@media (min-width: 1024px) {
	.ld-prosa figure.wp-block-table.alignwide {
		--ld-tabelle-weit: min(1040px, calc(100vw - 96px));
		width: var(--ld-tabelle-weit);
		max-width: none;
		/* Das Constrained-Layout setzt margin auto !important, daher Zentrierung per Versatz */
		position: relative;
		left: 50%;
		transform: translateX(-50%);
	}

	/* Drinknamen und Quellen nicht mitten im Namen umbrechen */
	.ld-prosa figure.wp-block-table.alignwide tbody tr > :first-child,
	.ld-prosa figure.wp-block-table.alignwide tbody tr > :last-child {
		white-space: nowrap;
	}
}

/* Rezeptkarten im Fließtext (z. B. Hub): auf dem Desktop drei Spalten über die volle Textbreite.
   Die vier Spalten des Startseiten-Rasters ließen in der schmaleren Textspalte rechts eine Lücke. */
@media (min-width: 1024px) {
	.ld-prosa .ldc-raster {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* Genau vier Rezeptkarten im Fließtext (z. B. Spritz-Hub): ab 768 px ein Raster 2 x 2 statt 3 + 1, Bild dafür 4:3. */
@media (min-width: 768px) {
	.ld-prosa .ldc-raster:has(> .ldc-raster__zelle:nth-child(4):last-child) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ld-prosa .ldc-raster:has(> .ldc-raster__zelle:nth-child(4):last-child) .ldc-illustration {
		aspect-ratio: 4 / 3;
	}
}

/* Rezeptkarten im Fließtext (z. B. Hub) und auf der Startseite (Design C mobil: kompakte Zeilen): auf dem Handy drei gleich hohe Querkarten untereinander statt 2 + 1 */
@media (max-width: 639.98px) {
	.ld-prosa .ldc-raster,
	.ld-start .ldc-raster {
		grid-template-columns: minmax(0, 1fr);
		gap: 10px;
	}

	.ld-prosa .ldc-karte,
	.ld-start .ldc-karte {
		flex-direction: row;
		align-items: stretch;
	}

	.ld-prosa .ldc-karte > .ldc-illustration,
	.ld-start .ldc-karte > .ldc-illustration {
		flex: 0 0 88px;
		aspect-ratio: auto;
		min-height: 110px;
		align-items: center;
	}

	.ld-prosa .ldc-karte > .ldc-illustration .ldc-ill,
	.ld-prosa .ldc-karte > .ldc-illustration .ld-glas,
	.ld-start .ldc-karte > .ldc-illustration .ldc-ill,
	.ld-start .ldc-karte > .ldc-illustration .ld-glas {
		height: 82px;
		max-width: 76px;
		margin: 0;
	}

	.ld-prosa .ldc-karte__text,
	.ld-start .ldc-karte__text {
		gap: 4px;
		padding: 12px 14px;
		justify-content: center;
	}

	.ld-prosa .ldc-karte__titel,
	.ld-start .ldc-karte__titel {
		font-size: 1.125rem;
	}
}

/* ------------------------------------------------------------------ Startseite 0.3.0 */

/* Notiz "Heute an der Bar" im Einstieg: Tagestipp aus dem Kern (wechselt pro Kalendertag) */
.ld-held__notiz {
	z-index: 2;
	max-width: 62%;
}

.ld-held__notiz .ldc-rezeptliste,
.ld-held__notiz .ldc-tagestipp {
	margin: 0;
}

.ld-held__notiz .ldc-tagestipp__label {
	display: block;
}

.ld-held__notiz .ldc-tagestipp__link {
	color: inherit;
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}

.ld-held__notiz .ldc-tagestipp__link:hover {
	color: var(--ld-tuerkis-tief);
}

.ld-held__notiz .ldc-tagestipp__verhaeltnis {
	white-space: nowrap;
}

/* Rezeptzahl im Einstieg übernimmt die Gestaltung der Einleitung */
.ld-einleitung .ldc-rezeptzahl {
	margin: 0;
}

/* Vertrauenszeile als eigener Abschnitt (bleibt, auch wenn Barwissen entfällt) */
.ld-vertrauen-abschnitt .ld-vertrauen {
	margin-top: 0;
}

/* Startseite: genau drei Rezeptkarten nutzen auf dem Desktop drei Spalten über die volle Breite;
   das Bild wird dafür flacher (4:3), damit die Karten nicht höher werden als im Vier-Spalten-Raster. */
@media (min-width: 1024px) {
	.ld-start .ldc-raster:has(> .ldc-raster__zelle:nth-child(3):last-child) {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.ld-start .ldc-raster:has(> .ldc-raster__zelle:nth-child(3):last-child) .ldc-illustration {
		aspect-ratio: 4 / 3;
	}
}

/* Barwissen: ein oder zwei Kacheln füllen die Reihe statt einer leeren dritten Spalte */
@media (min-width: 1024px) {
	.ld-kacheln:has(> li:nth-child(2):last-child),
	.ld-kacheln:has(> li:only-child) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Tabellen im Inhalt sind per Tastatur erreichbar (tabindex="0" aus functions.php) */
figure.wp-block-table:focus-visible {
	outline: 3px solid var(--ld-tuerkis-tief);
	outline-offset: 3px;
}

/* "Wonach ist dir heute?": erscheinen nur ein oder zwei Begriffsgruppen (Mindestmengen), teilen sie sich die Breite */
@media (min-width: 1024px) {
	.ld-entdecken__panel:has(> :only-child) {
		grid-template-columns: minmax(0, 1fr);
	}

	.ld-entdecken__panel:has(> :nth-child(2):last-child) {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}
}