:root {
	--kb-color-ink: #121c2b;
	--kb-color-gold: #ccc18b;
	--kb-color-paper: #ffffea;
	--kb-color-paper-muted: #f2f2de;
	--kb-color-line: rgb(204 193 139 / 38%);
	--kb-font-text: "EB Garamond", Georgia, serif;
	--kb-font-title: "Playfair Display", "EB Garamond", Georgia, serif;
	--kb-content-narrow: 600px;
	--kb-content-wide: 960px;
	--kb-gutter: clamp(1.125rem, 4vw, 2.5rem);
	--kb-section-space: clamp(3rem, 8vw, 7rem);
}

html {
	scroll-behavior: smooth;
}

body {
	background: var(--kb-color-ink);
	color: var(--kb-color-paper-muted);
	font-family: var(--kb-font-text);
	font-size: clamp(1.0625rem, 1rem + 0.2vw, 1.1875rem);
	hyphens: auto;
	line-height: 1.65;
	overflow-wrap: break-word;
	word-break: normal;
}

body,
body * {
	box-sizing: border-box;
}

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

/* Bewusst seitenbreite Inhaltsfläche innerhalb eines begrenzten Containers. */
.wrapper-full {
	box-sizing: border-box;
	margin-inline: calc(50% - 50vw);
	max-width: 100vw;
	padding: 0;
	width: 100vw;
}

/* Wiederverwendbarer Audio-Player. */
.cb-audio-wrapper {
	align-items: center;
	display: flex;
	justify-content: center;
}

.cb-audio {
	max-width: var(--kb-content-narrow);
	width: 100%;
}

/* Kurzer literarischer Einschub in Nuage-Texten. */
.nuagette {
	color: var(--kb-color-paper-muted);
	font-size: 1em;
	font-style: italic;
	line-height: 1.6;
	margin: 1em 0;
	max-width: 56ch;
	padding-left: 1em;
	position: relative;
}

.nuagette::before {
	background: linear-gradient(to bottom, var(--kb-color-gold), #c9a227);
	border-radius: 1px;
	bottom: 0.1em;
	content: "";
	left: 0;
	opacity: 0.9;
	position: absolute;
	top: 0.1em;
	width: 2px;
}

/* Ruhiger Ersatz, wenn ein extern gespeichertes Nuage-Video nicht verfügbar ist. */
.nuage-video--unavailable {
	border: 1px solid var(--kb-color-line);
	margin: 2.5rem auto;
	max-width: 420px;
	padding: clamp(2rem, 8vw, 4rem) var(--kb-gutter);
	text-align: center;
}

.nuage-video--unavailable .nv-status {
	color: var(--kb-color-paper-muted);
	font-style: italic;
}

.nuage-video--unavailable .nv-caption {
	color: var(--kb-color-gold);
	font-size: 0.95rem;
	margin-bottom: 0;
}

/* Transparente Textfläche am unteren Rand eines positionierten Startbilds. */
.unten-fest {
	backdrop-filter: blur(2px);
	background: rgb(0 0 0 / 20%);
	bottom: 0;
	color: #ffd700;
	left: 0;
	padding: 1rem 2rem;
	position: absolute;
	text-align: center;
	transition: background-color 0.3s ease;
	width: 100%;
	z-index: 10;
}

/*
 * Eingang: Die Brosche braucht keinen durchgehenden Textbalken.
 * Die kurze Linie über dem Absender ist der leise Ursprung der
 * Grace-Hopper-Line, die sich erst im IfaZ vollständig aufrichtet.
 */
body.home .unten-fest {
	align-items: stretch;
	backdrop-filter: none;
	background: transparent;
	bottom: 1.4rem;
	padding: 2rem clamp(2rem, 8vw, 6.5rem) 1.6rem;
	text-align: left;
}

body.home .unten-fest > div {
	align-items: initial;
	display: grid;
	grid-template-areas:
		"marke eingang"
		"beschreibung eingang";
	grid-template-columns: minmax(14rem, 1fr) auto;
	margin-inline: auto;
	max-width: 1120px;
	padding-left: 1.75rem;
	position: relative;
	width: 100%;
}

body.home .unten-fest h1 {
	grid-area: marke;
	position: relative;
}

body.home .unten-fest h1::before {
	background: var(--kb-color-gold);
	bottom: calc(100% + 0.85rem);
	content: "";
	height: 3.5rem;
	/* Nach "wer": exakt über dem k von "werkstatt". */
	left: 1.945rem;
	opacity: 0.72;
	position: absolute;
	width: 1px;
}

body.home .unten-fest p {
	grid-area: beschreibung;
	margin-bottom: 0 !important;
}

body.home .unten-fest .kb-button {
	align-self: end;
	background: rgb(18 28 43 / 12%) !important;
	border-color: rgb(204 193 139 / 68%) !important;
	color: var(--kb-color-paper-muted) !important;
	grid-area: eingang;
	justify-self: end;
	transition:
		background-color 180ms ease,
		border-color 180ms ease,
		color 180ms ease;
}

body.home .unten-fest .kb-button:hover,
body.home .unten-fest .kb-button:focus-visible {
	background: rgb(204 193 139 / 10%) !important;
	border-color: var(--kb-color-gold) !important;
	color: var(--kb-color-paper) !important;
}

body.home .gb-element-2e7f9d40 {
	height: 100svh;
	min-height: 100svh;
}

body.home .site-footer {
	height: 0;
}

body.home .kb-site-footer--entrance {
	background: transparent;
	border: 0;
	bottom: 0.35rem;
	left: 0;
	margin: 0;
	padding: 0 clamp(1rem, 3vw, 2rem);
	position: absolute;
	width: 100%;
	z-index: 20;
}

body.home .kb-site-footer--entrance .kb-site-footer__inner {
	justify-content: flex-end;
	max-width: none;
}

body.home .kb-site-footer--entrance .kb-site-footer__nav ul {
	gap: 0.85rem;
}

body.home .kb-site-footer--entrance .kb-site-footer__nav a {
	color: var(--kb-color-paper-muted);
	font-size: 0.7rem;
	opacity: 0.6;
	text-decoration-color: transparent;
	text-shadow: 0 1px 3px rgb(0 0 0 / 75%);
}

body.home .kb-site-footer--entrance .kb-site-footer__nav a:hover,
body.home .kb-site-footer--entrance .kb-site-footer__nav a:focus-visible {
	color: var(--kb-color-paper);
	opacity: 1;
}

@media (max-width: 700px) {
	body.home .unten-fest {
		bottom: 1.6rem;
		padding: 1.5rem var(--kb-gutter) 1.25rem;
		text-align: center;
	}

	body.home .unten-fest > div {
		align-items: center;
		display: flex;
		padding-left: 0;
	}

	body.home .unten-fest h1::before {
		bottom: calc(100% + 0.65rem);
		height: 2rem;
	}

	body.home .unten-fest p {
		margin-bottom: 0.85em !important;
	}

	body.home .unten-fest .kb-button {
		align-self: center;
	}

	body.home .kb-site-footer--entrance {
		bottom: 0.25rem;
	}

	body.home .kb-site-footer--entrance .kb-site-footer__inner,
	body.home .kb-site-footer--entrance .kb-site-footer__nav ul {
		align-items: center;
		justify-content: center;
	}
}

:where(a, button, input, textarea, select, summary):focus-visible {
	outline: 2px solid var(--kb-color-gold);
	outline-offset: 4px;
}

:where(h1, h2, h3, h4, h5, h6) {
	color: var(--kb-color-gold);
	font-family: var(--kb-font-title);
	font-weight: 400;
	line-height: 1.15;
	text-wrap: balance;
}

h1 {
	font-size: clamp(2.35rem, 5vw, 4.75rem);
	margin-block: 0 1.25rem;
}

h2 {
	font-size: clamp(1.85rem, 3.2vw, 3rem);
	margin-block: 3.25rem 1rem;
}

h3 {
	font-size: clamp(1.45rem, 2.3vw, 2rem);
	margin-block: 2.5rem 0.8rem;
}

h4 {
	font-size: clamp(1.18rem, 1.8vw, 1.45rem);
	margin-block: 2rem 0.65rem;
}

p,
ul,
ol,
blockquote {
	margin-block: 0 1.15em;
}

.kb-inner,
.kb-raumbody {
	box-sizing: border-box;
	margin-inline: auto;
	max-width: var(--kb-content-narrow);
	padding-inline: var(--kb-gutter);
	width: 100%;
}

.kb-single-post-wrap {
	padding-block: clamp(2.5rem, 6vw, 5rem) var(--kb-section-space);
}

.kb-post-head {
	margin-inline: auto;
	max-width: var(--kb-content-wide);
	padding-inline: var(--kb-gutter);
}

.kb-post-title-heading,
.kb-personenkopf__titel {
	margin-top: 0;
}

.kb-post-subtitle > :where(h2, h3, p) {
	color: var(--kb-color-paper-muted);
	font-family: var(--kb-font-text);
	font-size: clamp(1.15rem, 2vw, 1.4rem);
	font-style: italic;
	margin-top: 0;
}

.kb-site-footer {
	border-top: 1px solid var(--kb-color-line);
	color: var(--kb-color-paper-muted);
	margin-top: var(--kb-section-space);
	padding: 2rem var(--kb-gutter);
}

.kb-site-footer__inner {
	align-items: baseline;
	display: flex;
	gap: 1.25rem 2.5rem;
	justify-content: space-between;
	margin-inline: auto;
	max-width: var(--kb-content-wide);
}

.kb-site-footer__marke {
	color: var(--kb-color-gold);
	font-size: 0.92rem;
	letter-spacing: 0.06em;
	margin: 0;
	white-space: nowrap;
}

.kb-site-footer__nav ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.25rem;
	justify-content: flex-end;
	list-style: none;
	margin: 0;
	padding: 0;
}

.kb-site-footer__nav a {
	color: inherit;
	font-size: 0.9rem;
	text-decoration-color: transparent;
	text-underline-offset: 0.22em;
}

.kb-site-footer__nav a:hover,
.kb-site-footer__nav a:focus-visible {
	color: var(--kb-color-gold);
	text-decoration-color: currentColor;
}

/*
 * Gemeinsames Signet aller Innenseiten.
 *
 * Die Fußleiste gehört zum Seitengerüst und folgt deshalb nicht der Breite
 * des jeweiligen Inhalts. Die Grace-Hopper-Line bleibt über dem K von
 * „werkstatt“ als kleine, feste Andeutung erhalten. Größere Linien können
 * unabhängig davon als bewusstes Gestaltungselement einer Seite auftreten.
 */
body:not(.home) .kb-site-footer {
	box-sizing: border-box;
	position: relative;
	width: 100%;
}

body:not(.home) .kb-site-footer.kb-site-footer::before {
	content: none;
	display: none;
}

body:not(.home) .kb-site-footer .kb-site-footer__inner {
	margin-inline: 0;
	max-width: none;
	width: 100%;
}

body:not(.home) .kb-site-footer .kb-site-footer__marke {
	left: auto;
	position: relative;
	top: auto;
}

body:not(.home) .kb-site-footer .kb-site-footer__marke::before {
	background: rgb(204 193 139 / 68%);
	bottom: calc(100% + 0.22rem);
	content: "";
	display: block;
	height: 0.8rem;
	left: 1.666rem;
	pointer-events: none;
	position: absolute;
	width: 1px;
}

/* An der Rezeption genügt das feste Signet im Footer. */
body.page-id-52782 .kb-room-exit::after {
	content: none;
	display: none;
}

/* Ruhige, bildlose Rechtsseiten. */
.kb-legal-page {
	box-sizing: border-box;
	display: grid;
	gap: clamp(3rem, 7vw, 6.5rem);
	grid-template-columns: minmax(0, 0.95fr) minmax(20rem, 1.05fr);
	margin-inline: auto;
	max-width: 1080px;
	padding: clamp(5rem, 11vh, 8rem) var(--kb-gutter) clamp(4rem, 9vw, 7rem);
	position: relative;
	width: 100%;
}

.kb-legal-page::before {
	background: var(--kb-color-gold);
	content: "";
	height: clamp(9rem, 24vh, 13rem);
	left: var(--kb-gutter);
	opacity: 0.72;
	position: absolute;
	top: clamp(3.25rem, 8vh, 5.5rem);
	width: 1px;
}

.kb-legal-page__head {
	align-self: start;
	padding-left: clamp(2rem, 4vw, 3.5rem);
}

.kb-legal-page__kicker,
.kb-legal-page__label,
.kb-legal-page__navigation p {
	color: var(--kb-color-gold);
	font-family: var(--kb-font-text);
	font-size: 0.78rem;
	font-style: normal;
	font-weight: 600;
	letter-spacing: 0.16em;
	margin: 0 0 1rem;
	text-transform: uppercase;
}

.kb-legal-page__head h1 {
	hyphens: none;
	margin: 0 0 1.25rem;
	white-space: nowrap;
}

.kb-legal-page__lead {
	font-style: italic;
	margin: 0;
	max-width: 30ch;
}

.kb-legal-page__body {
	border-top: 1px solid var(--kb-color-line);
	display: grid;
	gap: 2rem;
	padding-top: 2rem;
}

.kb-legal-page__entry {
	display: grid;
	gap: 0.35rem;
	grid-template-columns: minmax(7rem, 0.42fr) minmax(0, 1fr);
}

.kb-legal-page__label {
	align-self: start;
	display: inline-block;
	margin: 0;
	min-height: 1rem;
	-webkit-text-fill-color: var(--kb-color-gold);
	width: max-content;
}

.kb-legal-page__entry :where(p, address) {
	font-style: normal;
	margin: 0;
}

.kb-legal-page__entry strong {
	color: var(--kb-color-paper);
	font-weight: 400;
}

.kb-legal-page__entry a,
.kb-legal-page__navigation a {
	color: var(--kb-color-gold);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.22em;
}

.kb-legal-page__note {
	border-top: 1px solid var(--kb-color-line);
	font-size: 0.95rem;
	margin: 0;
	max-width: 55ch;
	padding-top: 1.5rem;
}

.kb-legal-page__navigation {
	align-items: end;
	border-top: 1px solid var(--kb-color-line);
	display: flex;
	grid-column: 1 / -1;
	justify-content: space-between;
	padding-top: 1.5rem;
}

.kb-legal-page__navigation p {
	margin-bottom: 0.65rem;
}

.kb-legal-page__reception {
	margin-bottom: 0.1rem;
}

.kb-legal-page--privacy {
	grid-template-columns: minmax(15rem, 0.62fr) minmax(0, 1.38fr);
	max-width: 1180px;
}

.kb-legal-page--privacy .kb-legal-page__head {
	grid-column: 2;
}

.kb-legal-page--privacy .kb-legal-page__body {
	gap: clamp(2.5rem, 5vw, 4.5rem);
	grid-column: 1 / -1;
	justify-self: end;
	max-width: 920px;
	width: 100%;
}

.kb-privacy-credo {
	border: 0;
	margin: 0;
	padding: clamp(0.25rem, 1vw, 0.75rem) 0 clamp(1.75rem, 4vw, 3rem);
	position: relative;
}

.kb-privacy-credo::after {
	background: var(--kb-color-gold);
	bottom: 0;
	content: "";
	height: 1px;
	left: 0;
	opacity: 0.7;
	position: absolute;
	width: clamp(5rem, 18%, 9rem);
}

.kb-privacy-credo p {
	color: var(--kb-color-paper);
	font-size: clamp(1.28rem, 2vw, 1.7rem);
	font-style: italic;
	hyphens: none;
	line-height: 1.5;
	margin: 0;
	max-width: 39ch;
}

.kb-privacy-credo cite {
	color: var(--kb-color-gold);
	display: block;
	font-family: var(--kb-font-text);
	font-size: 0.78rem;
	font-style: normal;
	font-weight: 600;
	letter-spacing: 0.14em;
	margin-top: 1.25rem;
	text-transform: uppercase;
}

.kb-privacy-section {
	display: grid;
	gap: clamp(1rem, 3vw, 2.25rem);
	grid-template-columns: minmax(7rem, 0.34fr) minmax(0, 1fr);
}

.kb-privacy-section h2 {
	color: var(--kb-color-paper);
	font-size: clamp(1.45rem, 2.5vw, 2rem);
	margin: 0 0 0.8rem;
}

.kb-privacy-section :where(p, address) {
	font-style: normal;
	margin: 0 0 0.85rem;
}

.kb-privacy-section :where(p, address):last-child {
	margin-bottom: 0;
}

.kb-privacy-section a {
	color: var(--kb-color-gold);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.22em;
}

@media (max-width: 760px) {
	.kb-legal-page {
		gap: 3rem;
		grid-template-columns: 1fr;
		padding-top: 5rem;
	}

	.kb-legal-page::before {
		height: 7rem;
		top: 3.4rem;
	}

	.kb-legal-page__entry {
		gap: 0.5rem;
		grid-template-columns: 1fr;
	}

	.kb-legal-page__head h1 {
		white-space: normal;
	}

	.kb-legal-page__navigation {
		align-items: flex-start;
		flex-direction: column;
		gap: 2rem;
	}

	.kb-legal-page--privacy .kb-legal-page__head {
		grid-column: 1;
	}

	.kb-privacy-section {
		gap: 0.5rem;
		grid-template-columns: 1fr;
	}
}

@media (max-width: 700px) {
	.kb-site-footer__inner {
		align-items: flex-start;
		flex-direction: column;
	}

	.kb-site-footer__nav ul {
		justify-content: flex-start;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

/* Mobile Orientierungstafel: bewusste Ergänzung, kein Ersatz der Raumwege. */
.kb-mobile-orientation {
	display: none;
}

@media (max-width: 767px) {
	.kb-mobile-orientation {
		color: var(--kb-color-paper, #f4efe5);
		display: block;
		position: relative;
		z-index: 1000;
	}

	.kb-mobile-orientation__toggle {
		align-items: center;
		backdrop-filter: blur(10px);
		background: rgb(12 28 46 / 90%);
		border: 1px solid rgb(204 193 139 / 48%);
		border-radius: 999px;
		color: var(--kb-color-paper, #f4efe5);
		cursor: pointer;
		display: flex;
		font-family: sans-serif;
		font-size: 0.76rem;
		font-weight: 650;
		gap: 0.55rem;
		letter-spacing: 0.11em;
		list-style: none;
		padding: 0.65rem 0.85rem;
		position: fixed;
		right: max(1rem, env(safe-area-inset-right));
		text-transform: uppercase;
		top: max(1rem, env(safe-area-inset-top));
		z-index: 1002;
	}

	.kb-mobile-orientation__toggle::-webkit-details-marker {
		display: none;
	}

	.kb-mobile-orientation__toggle::marker {
		content: "";
	}

	.kb-mobile-orientation__icon {
		display: grid;
		gap: 3px;
		width: 1rem;
	}

	.kb-mobile-orientation__icon span {
		background: currentColor;
		display: block;
		height: 1px;
		transform-origin: center;
		transition: opacity 160ms ease, transform 160ms ease;
		width: 100%;
	}

	.kb-mobile-orientation__label-close {
		display: none;
	}

	.kb-mobile-orientation[open] .kb-mobile-orientation__label-open {
		display: none;
	}

	.kb-mobile-orientation[open] .kb-mobile-orientation__label-close {
		display: inline;
	}

	.kb-mobile-orientation[open] .kb-mobile-orientation__icon span:first-child {
		transform: translateY(4px) rotate(45deg);
	}

	.kb-mobile-orientation[open] .kb-mobile-orientation__icon span:nth-child(2) {
		opacity: 0;
	}

	.kb-mobile-orientation[open] .kb-mobile-orientation__icon span:last-child {
		transform: translateY(-4px) rotate(-45deg);
	}

	.kb-mobile-orientation__panel {
		background:
			linear-gradient(155deg, rgb(18 36 57 / 98%), rgb(8 22 38 / 99%));
		inset: 0;
		overflow-y: auto;
		padding:
			max(5.5rem, calc(env(safe-area-inset-top) + 4.5rem))
			max(1.25rem, env(safe-area-inset-right))
			max(2rem, env(safe-area-inset-bottom))
			max(1.25rem, env(safe-area-inset-left));
		position: fixed;
		z-index: 1001;
	}

	.kb-mobile-orientation__inner {
		margin-inline: auto;
		max-width: 28rem;
	}

	.kb-mobile-orientation__kicker {
		color: var(--kb-color-gold, #ccc18b);
		font-family: sans-serif;
		font-size: 0.72rem;
		font-weight: 650;
		letter-spacing: 0.18em;
		margin: 0 0 0.8rem;
		text-transform: uppercase;
	}

	.kb-mobile-orientation__title {
		color: var(--kb-color-paper, #f4efe5);
		font-family: var(--kb-font-display, "EB Garamond", Georgia, serif);
		font-size: clamp(2.25rem, 12vw, 3.4rem);
		line-height: 0.98;
		margin: 0 0 2.25rem;
	}

	.kb-mobile-orientation :where(ul) {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	.kb-mobile-orientation__main a {
		align-items: baseline;
		border-bottom: 1px solid rgb(204 193 139 / 24%);
		color: var(--kb-color-paper, #f4efe5);
		display: flex;
		font-family: var(--kb-font-display, "EB Garamond", Georgia, serif);
		font-size: clamp(1.45rem, 7vw, 1.9rem);
		gap: 1rem;
		justify-content: space-between;
		padding: 0.72rem 0;
		text-decoration-color: transparent;
	}

	.kb-mobile-orientation__main a > span:last-child {
		color: var(--kb-color-gold, #ccc18b);
		font-size: 0.9em;
	}

	.kb-mobile-orientation__service {
		border-top: 1px solid rgb(204 193 139 / 42%);
		margin-top: 2.25rem;
		padding-top: 1.25rem;
	}

	.kb-mobile-orientation__service ul {
		display: grid;
		gap: 0.7rem 1.25rem;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.kb-mobile-orientation__service a {
		color: var(--kb-color-paper-muted, #d8d3c8);
		font-size: 0.92rem;
		text-decoration-color: rgb(204 193 139 / 55%);
		text-underline-offset: 0.2em;
	}
}