/**
 * Andreas Zrenner — ergänzende Styles.
 *
 * Tokens, Typografie und Element-Styles stehen in theme.json. Hier nur, was
 * theme.json nicht abbildet: Zustände, Komponenten-Layouts, Overlay, Masonry.
 * Bewegung nur als Farbe und Deckkraft, 120–280 ms. Keine Schatten, kein Blur.
 */

:root {
	--zr-ease: var(--wp--custom--motion--ease, cubic-bezier(0.2, 0, 0.2, 1));
	--zr-fast: var(--wp--custom--motion--fast, 120ms);
	--zr-base: var(--wp--custom--motion--base, 180ms);
	--zr-slow: var(--wp--custom--motion--slow, 280ms);
	--zr-ink: var(--wp--preset--color--ink);
	--zr-brass: var(--wp--preset--color--brass);
	--zr-hairline: var(--wp--preset--color--hairline);
	--zr-grey: var(--wp--preset--color--body-grey);
	--zr-soft: var(--wp--preset--color--canvas-soft);
	--zr-rule: 1px solid var(--wp--preset--color--hairline);
	--zr-sans: var(--wp--preset--font-family--sans);
	--zr-serif: var(--wp--preset--font-family--body);
	--zr-display: var(--wp--preset--font-family--display);
}

/* ---------- Basis ---------- */

body {
	-webkit-font-smoothing: antialiased;
	text-wrap: pretty;
}

a {
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
	transition: color var(--zr-fast) var(--zr-ease), opacity var(--zr-fast) var(--zr-ease);
}

:focus-visible {
	outline: 2px solid var(--zr-brass);
	outline-offset: 2px;
}

/* Sektionen stoßen bündig aneinander, die Sektion trägt den Abstand. */
.wp-site-blocks > *,
.zr-main > * {
	margin-block-start: 0;
}

/*
 * Lucide-Icons sind Strich-Icons. Die Core-Icon-Registry entfernt die
 * Strich-Attribute aus dem SVG, deshalb liegen sie hier.
 */
svg.zr-icon,
.wp-block-icon svg.zr-icon {
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.5;
}

.wp-block-icon svg.zr-icon {
	width: 24px;
	height: auto;
	aspect-ratio: 1;
}

.wp-block-separator {
	border: 0;
	border-top: var(--zr-rule);
	opacity: 1;
}

.wp-block-separator.is-style-strong {
	border-top: 2px solid var(--zr-ink);
}

/* ---------- Buttons ---------- */

.wp-element-button,
.wp-block-button__link {
	transition:
		background-color var(--zr-base) var(--zr-ease),
		color var(--zr-base) var(--zr-ease),
		border-color var(--zr-base) var(--zr-ease);
}

.wp-block-button.is-style-outline > .wp-block-button__link.wp-element-button {
	background: transparent;
	border: 1px solid var(--zr-ink);
	color: var(--zr-ink);
	padding: 12px 20px;
}

.wp-block-button.is-style-outline > .wp-block-button__link.wp-element-button:hover,
.wp-block-button.is-style-outline > .wp-block-button__link.wp-element-button:focus-visible {
	background: var(--zr-ink);
	border-color: var(--zr-ink);
	color: #fff;
}

.wp-block-button.is-style-text > .wp-block-button__link.wp-element-button {
	background: transparent;
	border-color: transparent;
	color: var(--zr-brass);
	padding: 4px 0;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.wp-block-button.is-style-text > .wp-block-button__link.wp-element-button:hover {
	background: transparent;
	border-color: transparent;
	color: var(--zr-ink);
}

.wp-element-button[disabled],
.wp-block-button__link[aria-disabled="true"] {
	cursor: not-allowed;
	opacity: 0.35;
}

/* Runde Icon-Buttons (RSS, E-Mail, Teilen, Social). */
.zr-icon-button {
	align-items: center;
	background: var(--wp--preset--color--canvas);
	border: var(--zr-rule);
	border-radius: 9999px;
	color: var(--zr-ink);
	display: inline-flex;
	flex: 0 0 auto;
	height: 32px;
	justify-content: center;
	text-decoration: none;
	transition: background-color var(--zr-base) var(--zr-ease), color var(--zr-base) var(--zr-ease);
	width: 32px;
}

.zr-icon-button svg {
	height: 15px;
	width: 15px;
}

.zr-icon-button:hover,
.zr-icon-button:focus-visible {
	background: var(--zr-ink);
	color: #fff;
}

.zr-icon-button--soft {
	background: var(--zr-soft);
	border-color: transparent;
	height: 34px;
	width: 34px;
}

.zr-icon-button--soft svg {
	height: 16px;
	width: 16px;
}

.zr-icon-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

/* ---------- Typo-Bausteine ---------- */

.is-style-eyebrow,
p.is-style-eyebrow {
	color: var(--zr-ink);
	font-family: var(--zr-sans);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 18px;
	text-transform: uppercase;
}

.is-style-eyebrow a {
	color: inherit;
	text-decoration: none;
}

.is-style-lead,
p.is-style-lead {
	color: var(--zr-grey);
	font-size: var(--wp--preset--font-size--lead);
	letter-spacing: 0.108px;
	line-height: 1.47;
	max-width: 68ch;
}

/* Schmale Absätze bleiben auf der linken Kante des 1080er-Containers statt mittig. */
.is-layout-constrained > .is-style-lead:not(.has-text-align-center) {
	margin-inline-end: auto !important;
	margin-inline-start: max(0px, calc((100% - var(--wp--style--global--content-size)) / 2)) !important;
}

/* Core rechnet die Grid-Spalten nur mit einem einzelnen Gap-Wert korrekt; 48 px Zeilenabstand hier. */
.wp-block-post-template.is-layout-grid {
	row-gap: var(--wp--preset--spacing--48);
}

.zr-meta {
	color: var(--zr-grey);
	font-family: var(--zr-sans);
	font-size: 12px;
	line-height: 16px;
}

/* ---------- Masthead ---------- */

.zr-masthead {
	border-bottom: var(--zr-rule);
	padding-block: 24px;
}

.zr-masthead .zr-masthead__logo {
	margin: 0 auto;
}

.zr-masthead .zr-masthead__logo img {
	display: block;
	height: 56px;
	width: auto;
}

.zr-masthead__tagline {
	color: var(--zr-grey);
	font-family: var(--zr-sans);
	font-size: 12px;
	letter-spacing: 0.16em;
	line-height: 16px;
	margin-block-start: 8px !important;
	text-align: center;
	text-transform: uppercase;
}

@media (max-width: 767px) {
	.zr-masthead .zr-masthead__logo img {
		height: 44px;
	}
}

/* ---------- Navigation (sticky) ---------- */

.zr-navbar {
	background: var(--wp--preset--color--canvas);
	border-bottom: var(--zr-rule);
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 20;
}

@media (max-width: 600px) {
	.zr-navbar {
		top: 0;
	}
}

.zr-navbar__inner {
	padding-block: 12px;
}

.zr-navbar .wp-block-navigation-item__content {
	border-bottom: 2px solid transparent;
	padding-bottom: 4px;
	transition: opacity var(--zr-fast) var(--zr-ease);
}

.zr-navbar .wp-block-navigation-item:not(.current-menu-item) > .wp-block-navigation-item__content:hover {
	opacity: 0.55;
}

.zr-navbar .current-menu-item > .wp-block-navigation-item__content {
	border-bottom-color: var(--zr-ink);
}

.zr-navbar .wp-block-navigation__responsive-container.is-menu-open {
	padding: 24px 20px;
}

.zr-navbar .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: 20px;
}

.zr-navbar .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: 20px;
}

/* ---------- Footer ---------- */

.zr-footer {
	background: var(--zr-ink);
	color: #fff;
	padding-block: 48px;
}

.zr-footer .zr-footer__logo img {
	display: block;
	height: 48px;
	width: auto;
}

.zr-footer__note {
	color: rgba(255, 255, 255, 0.62);
	font-family: var(--zr-serif);
	font-size: 16px;
	line-height: 24px;
	max-width: 34ch;
}

.zr-footer__title {
	color: #fff;
	font-family: var(--zr-sans);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 18px;
	text-transform: uppercase;
}

.zr-footer__links {
	display: flex;
	flex-direction: column;
	gap: 12px;
	list-style: none;
	margin: 16px 0 0;
	padding: 0;
}

.zr-footer__links a {
	color: rgba(255, 255, 255, 0.72);
	font-family: var(--zr-sans);
	font-size: 14px;
	letter-spacing: 0.4px;
	line-height: 18px;
	text-decoration: none;
}

.zr-footer__links a:hover {
	color: #fff;
}

.zr-footer .zr-icon-button--soft:hover,
.zr-footer .zr-icon-button--soft:focus-visible {
	background: #fff;
	color: var(--zr-ink);
}

.zr-footer__bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.18);
	color: rgba(255, 255, 255, 0.5);
	font-family: var(--zr-sans);
	font-size: 12px;
	line-height: 16px;
	margin-block-start: 48px !important;
	padding-top: 20px;
}

.zr-footer__bottom p {
	margin: 0;
}

/* ---------- Sektionen ---------- */

.zr-hero .wp-block-heading,
.zr-hero .wp-block-post-title,
.zr-hero .wp-block-query-title {
	margin-block-start: 16px;
}

.zr-hero > :first-child {
	margin-block-start: 0;
}

.zr-hero .is-style-lead,
.zr-hero .wp-block-post-excerpt,
.zr-hero .wp-block-term-description {
	margin-block-start: 24px;
}

.zr-hero .wp-block-buttons {
	margin-block-start: 32px;
}

.zr-hero .wp-block-post-excerpt__excerpt,
.zr-hero .wp-block-term-description p {
	color: var(--zr-grey);
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.47;
	margin: 0;
	max-width: 68ch;
}

.zr-section-header {
	border-bottom: var(--zr-rule);
	margin-block-end: 32px;
	padding-bottom: 16px;
}

.zr-section-header .is-style-eyebrow {
	margin: 0 0 8px;
}

.zr-section-header .wp-block-heading {
	margin: 0;
}

.zr-section-header .wp-block-buttons {
	flex: 0 0 auto;
}

/* ---------- Story-Karten ---------- */

.zr-card {
	position: relative;
}

.zr-card > * {
	margin-block: 0;
}

.zr-card .wp-block-post-featured-image {
	margin-block-end: 12px;
}

.zr-card .wp-block-post-terms {
	margin-block-end: 4px;
	position: relative;
	z-index: 1;
}

.zr-card .wp-block-post-title {
	font-family: var(--zr-sans);
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -0.28px;
	line-height: 24px;
}

.zr-card .wp-block-post-title a::after {
	content: "";
	inset: 0;
	position: absolute;
}

.zr-card .wp-block-post-title a {
	transition: color var(--zr-base) var(--zr-ease);
}

.zr-card:hover .wp-block-post-title a {
	color: var(--zr-brass);
}

.zr-card .wp-block-post-excerpt {
	margin-block-start: 8px;
}

.zr-card .wp-block-post-excerpt__excerpt {
	margin: 0;
}

.zr-card .wp-block-post-date {
	margin-block-start: 8px;
}

/* Titelgeschichte */
.zr-card--large .wp-block-post-featured-image {
	margin-block-end: 16px;
}

.zr-card--large .wp-block-post-terms {
	margin-block-end: 8px;
}

.zr-card--large .wp-block-post-title {
	font-family: var(--zr-display);
	font-size: var(--wp--preset--font-size--display-lg);
	font-weight: 400;
	letter-spacing: -0.4px;
	line-height: 1.05;
}

.zr-card--large .wp-block-post-excerpt {
	margin-block-start: 12px;
}

.zr-card--large .wp-block-post-excerpt__excerpt {
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.47;
}

.zr-card--large .zr-byline {
	margin-block-start: 8px;
}

/* Karten auf getönter Sektion bekommen Rahmen und Innenabstand. */
.has-canvas-soft-background-color .zr-card:not(.zr-card--large) {
	background: var(--wp--preset--color--canvas);
	border: var(--zr-rule);
	padding: 12px;
}

/* Beitragsliste (Story Row) */
.zr-rows .wp-block-post-template {
	margin: 0;
}

.zr-row {
	border-bottom: var(--zr-rule);
	padding-block: 16px;
	position: relative;
	transition: background-color var(--zr-fast) var(--zr-ease);
}

.zr-row:hover {
	background: var(--zr-soft);
}

.zr-row > * {
	margin-block: 0;
}

.zr-row .wp-block-post-terms {
	margin-block-end: 4px;
	position: relative;
	z-index: 1;
}

.zr-row .wp-block-post-title {
	font-family: var(--zr-sans);
	font-size: 17px;
	font-weight: 700;
	letter-spacing: -0.144px;
	line-height: 22px;
}

.zr-row .wp-block-post-title a::after {
	content: "";
	inset: 0;
	position: absolute;
}

.zr-row .wp-block-group.zr-row__meta {
	gap: 0;
	margin-block-start: 4px;
}

.zr-row__meta .wp-block-post-time-to-read::before {
	content: "·";
	margin-inline: 6px;
}

.zr-rows .wp-block-post-template > li:first-child .zr-row {
	padding-top: 0;
}

/* ---------- Byline ---------- */

.wp-block-group.zr-byline {
	color: var(--zr-grey);
	font-family: var(--zr-serif);
	font-size: var(--wp--custom--byline--font-size, 12.73px);
	font-weight: 700;
	gap: 12px;
	letter-spacing: 0.108px;
	line-height: var(--wp--custom--byline--line-height, 28px);
}

.zr-byline > * {
	margin: 0;
}

.zr-byline .wp-block-avatar img,
.zr-author-box .wp-block-avatar img {
	border: var(--zr-rule);
	border-radius: 9999px;
	display: block;
}

.zr-byline .wp-block-post-author-name {
	color: var(--zr-ink);
}

.zr-byline .wp-block-post-date,
.zr-byline .wp-block-post-time-to-read {
	color: inherit;
	font: inherit;
}

.zr-byline .wp-block-post-date::before,
.zr-byline .wp-block-post-time-to-read::before {
	content: "·";
	margin-inline-end: 12px;
}

.wp-block-group.zr-byline-bar {
	border-bottom: var(--zr-rule);
	border-top: var(--zr-rule);
	margin-block-start: 16px !important;
	padding-block: 8px;
}

.zr-share {
	display: flex;
	gap: 8px;
}

/* ---------- Beitrag ---------- */

.zr-article .wp-block-post-title {
	margin-block-start: 16px;
}

.zr-article .wp-block-post-terms + .wp-block-post-title {
	margin-block-start: 16px;
}

.zr-article .zr-article__lead {
	margin-block-start: 24px;
}

.zr-article .zr-article__lead .wp-block-post-excerpt__excerpt {
	color: var(--zr-grey);
	font-size: var(--wp--preset--font-size--lead);
	letter-spacing: 0.108px;
	line-height: 1.47;
	margin: 0;
}

.zr-article .zr-article__image {
	margin-block: 48px 0;
}

.zr-entry {
	margin-block-start: 48px !important;
}

.zr-entry > h2 {
	font-size: var(--wp--preset--font-size--display-sm);
	letter-spacing: 0;
	line-height: 1.08;
	margin-block: 48px 16px;
}

.zr-entry > h3 {
	font-family: var(--zr-sans);
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -0.28px;
	line-height: 1.2;
	margin-block: 32px 12px;
}

.zr-entry > h2 + *,
.zr-entry > h3 + * {
	margin-block-start: 0;
}

.zr-entry > figure,
.zr-entry > .wp-block-gallery {
	margin-block: 48px;
}

.wp-block-group.zr-author-box {
	border-top: var(--zr-rule);
	gap: 20px;
	margin-block-start: 48px !important;
	padding-top: 48px;
}

.zr-author-box > .wp-block-group > * {
	margin: 0;
}

.zr-author-box .wp-block-post-author-name {
	font-family: var(--zr-sans);
	font-size: 17px;
	font-weight: 700;
	letter-spacing: -0.144px;
}

.zr-author-box .wp-block-post-author-biography {
	margin-block-start: 8px;
}

/* Textseiten (Impressum, Datenschutz): Lesebreite auf der 1080er-Kante. */
.zr-page-content > :where(p, h2, h3, h4, h5, h6, ul, ol, blockquote, .wp-block-table, .wp-block-quote, .wp-block-list):not(.alignwide):not(.alignfull) {
	margin-inline-end: auto !important;
	margin-inline-start: max(0px, calc((100% - var(--wp--style--global--content-size)) / 2)) !important;
	max-width: var(--wp--custom--reading, 680px);
}

.zr-page-content > h2:not(.alignfull) {
	font-size: var(--wp--preset--font-size--display-sm);
	margin-block-start: 48px;
}

.zr-page-content:not(:has(> .alignfull:first-child)) {
	padding-bottom: var(--wp--preset--spacing--section);
}

/* ---------- Bild-Platzhalter (ImageFrame) ---------- */

.zr-placeholder {
	align-items: center;
	background: var(--zr-soft);
	display: flex;
	justify-content: center;
	margin: 0;
	width: 100%;
}

.wp-block-group.zr-placeholder {
	aspect-ratio: 4 / 3;
}

.zr-placeholder__link {
	align-items: center;
	color: inherit;
	display: flex;
	height: 100%;
	justify-content: center;
	text-decoration: none;
	width: 100%;
}

.zr-placeholder__label {
	color: var(--zr-grey);
	font-family: var(--zr-sans);
	font-size: 12px;
	letter-spacing: 0.08em;
	line-height: 16px;
	text-transform: uppercase;
}

.zr-image-frame {
	background: var(--zr-soft);
}

/* ---------- Portfolio-Karten (Project Card) ---------- */

.zr-project {
	position: relative;
}

.zr-project > * {
	margin-block: 0;
}

.zr-project__media {
	overflow: hidden;
	position: relative;
}

.zr-project__media .wp-block-post-featured-image {
	margin: 0;
}

.wp-block-group.zr-project__overlay {
	background: color-mix(in srgb, var(--zr-ink) 60%, transparent);
	color: #fff;
	display: flex;
	flex-direction: column;
	inset: 0;
	justify-content: flex-end;
	margin: 0 !important;
	opacity: 0;
	padding: 20px;
	pointer-events: none;
	position: absolute;
	transition: opacity var(--zr-slow) var(--zr-ease);
}

.zr-project:hover .zr-project__overlay,
.zr-project:focus-within .zr-project__overlay {
	opacity: 1;
}

.zr-project__overlay > * {
	margin: 0;
}

.zr-project__overlay .wp-block-post-terms,
.zr-project__overlay .wp-block-post-terms a {
	color: #fff;
}

.zr-project__cta {
	color: #fff;
	font-family: var(--zr-sans);
	font-size: 14px;
	letter-spacing: 0.4px;
	line-height: 18px;
	margin-block-start: 8px !important;
}

.wp-block-group.zr-project__meta {
	align-items: baseline;
	gap: 12px;
	margin-block-start: 12px !important;
}

.zr-project__meta > * {
	margin: 0;
}

.zr-project .wp-block-post-title {
	font-family: var(--zr-display);
	font-size: var(--wp--preset--font-size--display-sm);
	font-weight: 400;
	line-height: 1.08;
}

.zr-project .wp-block-post-title a::after {
	content: "";
	inset: 0;
	position: absolute;
}

.zr-project__year {
	color: var(--zr-grey);
	flex: 0 0 auto;
	font-family: var(--zr-sans);
	font-size: 12px;
	line-height: 16px;
}

/* ---------- Serie (Einzelseite) ---------- */

.wp-block-group.zr-series-meta {
	color: var(--zr-grey);
	font-family: var(--zr-sans);
	font-size: 14px;
	gap: 0;
	letter-spacing: 0.4px;
	line-height: 18px;
	margin-block-start: 16px !important;
}

.zr-series-meta > * {
	margin: 0;
}

.zr-series-meta > :not(:empty) ~ :not(:empty)::before {
	content: "·";
	margin-inline: 8px;
}

.zr-series-meta p:empty,
.wp-block-group.zr-series-meta:not(:has(> :not(:empty))) {
	display: none;
}

.zr-series-meta .wp-block-post-terms {
	color: inherit;
	font: inherit;
	letter-spacing: inherit;
	text-transform: none;
}

.zr-series-meta .wp-block-post-terms a {
	color: inherit;
}

.wp-block-group.zr-post-nav {
	border-top: var(--zr-rule);
	gap: 24px;
	padding-top: 16px;
}

.zr-post-nav > * {
	margin: 0;
}

/* ---------- Galerien ---------- */

.wp-block-gallery.is-style-masonry.has-nested-images {
	column-gap: 16px;
	columns: 3;
	display: block;
}

.wp-block-gallery.is-style-masonry.has-nested-images figure.wp-block-image {
	break-inside: avoid;
	display: block;
	margin: 0 0 16px !important;
	width: 100% !important;
}

.wp-block-gallery.is-style-masonry.has-nested-images figure.wp-block-image img {
	height: auto !important;
	object-fit: initial !important;
	width: 100%;
}

@media (max-width: 1023px) {
	.wp-block-gallery.is-style-masonry.has-nested-images {
		columns: 2;
	}
}

@media (max-width: 599px) {
	.wp-block-gallery.is-style-masonry.has-nested-images {
		columns: 1;
	}
}

.wp-block-gallery.is-style-raster.has-nested-images figure.wp-block-image {
	aspect-ratio: 4 / 3;
}

.wp-block-gallery.is-style-raster.has-nested-images figure.wp-block-image img {
	height: 100% !important;
	object-fit: cover !important;
}

.wp-block-gallery figcaption,
.wp-block-image figcaption {
	color: var(--zr-grey);
	font-family: var(--zr-sans);
	font-size: 12px;
	line-height: 16px;
	margin-top: 8px;
}

/* Lightbox: ruhig, eckig, ohne Blur. */
.wp-lightbox-overlay .scrim {
	background-color: #fff !important;
	opacity: 1;
}

.wp-lightbox-overlay .wp-lightbox-close-button,
.wp-lightbox-overlay .wp-lightbox-navigation-button {
	color: var(--zr-ink);
}

/* ---------- Blurb, Prozessliste, CTA ---------- */

.wp-block-group.is-style-rahmen {
	background: var(--wp--preset--color--canvas);
	border: var(--zr-rule);
	padding: 32px;
}

.zr-blurb > * {
	margin: 0;
}

.zr-blurb .wp-block-icon {
	color: var(--zr-brass);
	margin-block-end: 16px;
}

.zr-blurb .wp-block-icon svg.zr-icon {
	width: 32px;
}

.zr-blurb .wp-block-heading {
	font-family: var(--zr-sans);
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -0.28px;
	line-height: 24px;
}

.zr-blurb p,
.zr-blurb .wp-block-list {
	color: var(--zr-grey);
	margin-block-start: 12px;
}

.wp-block-group.zr-steps {
	gap: 24px;
}

.zr-step {
	border-top: var(--zr-rule);
	display: grid;
	gap: 20px;
	grid-template-columns: 56px 1fr;
	padding-top: 16px;
}

.zr-step > * {
	margin: 0;
}

.zr-step__number {
	color: var(--zr-brass);
	font-family: var(--zr-display);
	font-size: var(--wp--preset--font-size--display-sm);
	line-height: 1.08;
}

.zr-step .wp-block-heading {
	font-family: var(--zr-sans);
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -0.28px;
	line-height: 24px;
}

.zr-step p:not(.zr-step__number) {
	color: var(--zr-grey);
	margin-block-start: 8px;
}

.zr-step__body > * {
	margin: 0;
}

.zr-cta {
	text-align: center;
}

.zr-cta .wp-block-heading {
	margin: 0;
}

.zr-cta p {
	color: var(--zr-grey);
	margin: 16px auto 0;
	max-width: 56ch;
}

.zr-cta .wp-block-buttons {
	margin-block-start: 24px;
}

.zr-caption {
	color: var(--zr-grey);
	font-family: var(--zr-sans);
	font-size: 12px;
	line-height: 16px;
	margin-block-start: 8px !important;
}

/* ---------- Filterleiste ---------- */

.zr-filter {
	border-bottom: var(--zr-rule);
	margin-block-end: 32px;
	padding-bottom: 16px;
}

.zr-filter__list {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 32px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.zr-filter__link {
	border-bottom: 2px solid transparent;
	color: var(--zr-ink);
	display: inline-block;
	font-family: var(--zr-sans);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 18px;
	opacity: 0.45;
	padding-bottom: 4px;
	text-decoration: none;
	text-transform: uppercase;
}

.zr-filter__link:hover {
	color: var(--zr-ink);
	opacity: 0.75;
}

.zr-filter__link.is-active {
	border-bottom-color: var(--zr-ink);
	opacity: 1;
}

/* ---------- Pagination ---------- */

.zr-pagination.zr-pagination {
	gap: 16px;
	margin-block-start: 48px !important;
}

.zr-pagination .wp-block-query-pagination-previous,
.zr-pagination .wp-block-query-pagination-next {
	border: 1px solid var(--zr-ink);
	color: var(--zr-ink);
	padding: 12px 20px;
	transition: background-color var(--zr-base) var(--zr-ease), color var(--zr-base) var(--zr-ease);
}

.zr-pagination .wp-block-query-pagination-previous:hover,
.zr-pagination .wp-block-query-pagination-next:hover {
	background: var(--zr-ink);
	color: #fff;
}

.zr-pagination .page-numbers {
	color: var(--zr-grey);
	padding: 0 6px;
}

.zr-pagination .page-numbers.current {
	border-bottom: 2px solid var(--zr-ink);
	color: var(--zr-ink);
}

/* ---------- Kontaktformular ---------- */

.zr-contact {
	scroll-margin-top: 96px;
}

.zr-contact__form {
	display: grid;
	gap: 20px;
}

.zr-field__label {
	color: var(--zr-ink);
	display: block;
	font-family: var(--zr-sans);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.4px;
	line-height: 18px;
	margin-bottom: 8px;
}

.zr-field__input {
	background: var(--wp--preset--color--canvas);
	border: 1px solid var(--zr-ink);
	border-radius: 0;
	box-sizing: border-box;
	color: var(--zr-ink);
	font-family: var(--zr-sans);
	font-size: 17px;
	line-height: 20px;
	padding: 12px 16px;
	width: 100%;
}

textarea.zr-field__input {
	line-height: 1.5;
	min-height: 150px;
	resize: vertical;
}

.zr-field__input::placeholder {
	color: var(--zr-grey);
}

.zr-field__input:focus-visible {
	outline: 2px solid var(--zr-brass);
	outline-offset: 2px;
}

.zr-field__hint {
	color: var(--zr-grey);
	display: block;
	font-family: var(--zr-sans);
	font-size: 12px;
	line-height: 16px;
	margin-top: 8px;
}

.zr-contact__hp {
	height: 1px;
	left: -9999px;
	overflow: hidden;
	position: absolute !important;
	width: 1px;
}

.zr-contact__privacy {
	color: var(--zr-grey);
	font-family: var(--zr-sans);
	font-size: 12px;
	line-height: 16px;
	margin: 0;
}

.zr-contact__notice {
	background: var(--wp--preset--color--canvas);
	border: 1px solid var(--zr-hairline);
	color: var(--zr-ink);
	font-family: var(--zr-sans);
	font-size: 14px;
	line-height: 20px;
	margin: 0 0 20px;
	padding: 12px 16px;
}

.zr-contact__notice.is-error {
	border: 2px solid var(--zr-ink);
	font-weight: 700;
}

.zr-contact .wp-block-button {
	margin: 0;
}

/* ---------- Suche ---------- */

.wp-block-search__input {
	border: 1px solid var(--zr-ink);
	border-radius: 0;
	padding: 12px 16px;
}

/* ---------- Responsiv ---------- */

@media (max-width: 781px) {
	.zr-footer .wp-block-columns {
		gap: 32px;
	}

	.zr-section-header {
		align-items: flex-start !important;
		flex-direction: column;
		gap: 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
	}
}
