/*
Theme Name:   ZEITLER Zwei Richtungen
Theme URI:    http://zeitler.vedv.cc
Description:  Gestaltungsentwurf „Zwei Richtungen 2.0" für die Demo-Umgebung
              zeitler.vedv.cc. Child-Theme von Twenty Twenty-Five, reine
              Core-Blöcke, kein Page Builder, keine kommerziellen
              Abhängigkeiten. Schriften TeX Gyre Heros Cn und TeX Gyre Schola
              (GUST Font License), lokal gehostet.
Author:       Demo
Template:     twentytwentyfive
Version:      3.225.0
Text Domain:  zeitler-zwei-richtungen
*/

/* ==================================================================
   Eigene Marken. Farben und Schriften stehen in theme.json; hier nur,
   was theme.json nicht ausdrücken kann.
   ================================================================== */
:root {
	--zr-ink:        var(--wp--preset--color--contrast);
	--zr-muted:      var(--wp--preset--color--muted);
	--zr-faint:      #5b5d4e;
	--zr-accent:     var(--wp--preset--color--accent);
	--zr-signal:     var(--wp--preset--color--accent-bright);
	--zr-on-accent:  #ffffff;
	--zr-line:       rgba(91, 93, 78, .22);
	--zr-hair:       rgba(91, 93, 78, .11);

	--zr-band-ink:   var(--wp--preset--color--band-ink);
	--zr-band-muted: #a3a591;
	--zr-band-line:  rgba(236, 238, 230, .18);
	--zr-band-accent:#d06a26;

	--zr-logo-filter: none;

	--zr-gutter: var(--wp--custom--gutter);
	--zr-edge: max(var(--zr-gutter), (100vw - 1240px) / 2);
}

/* Dunkles Erscheinungsbild folgt der Systemeinstellung. Es werden
   ausschließlich Marken neu gesetzt — die Bausteine bleiben unberührt. */
@media (prefers-color-scheme: dark) {
	:root {
		--wp--preset--color--base:          #16180f;
		--wp--preset--color--base-alt:      #121409;
		--wp--preset--color--surface:       #1e2118;
		--wp--preset--color--contrast:      #e9eae3;
		--wp--preset--color--muted:         #a0a291;
		--wp--preset--color--accent:        #d06a26;
		--wp--preset--color--accent-bright: #d06a26;
		--wp--preset--color--band:          #22251d;
		--wp--preset--color--band-ink:      #e9eae3;

		--zr-faint:        #8a8c79;
		--zr-on-accent:    #16180f;
		--zr-line:         rgba(233, 234, 227, .17);
		--zr-hair:         rgba(233, 234, 227, .08);
		--zr-band-muted:   #a0a291;
		--zr-band-line:    rgba(233, 234, 227, .16);
		--zr-logo-filter:  brightness(0) invert(1) opacity(.88);
	}
	/* Schaltflächentext muss der umgekehrten Welt folgen */
	.wp-element-button,
	.wp-block-button__link { color: var(--zr-on-accent) !important; }
	.zeitler-btn-ghost .wp-block-button__link { color: var(--zr-ink) !important; }
}

body { hyphens: manual; }

/* Orange ist Signal, nicht die allgemeine Klickfarbe. Verweise stehen in
   Textfarbe und färben sich erst beim Zeigen — Ausnahmen sind unten
   ausdrücklich benannt. */
.wp-block-post-content a:where(:not(.wp-element-button)) {
	color: var(--zr-ink);
	text-decoration-color: var(--zr-line);
	text-underline-offset: .18em;
}
.wp-block-post-content a:where(:not(.wp-element-button)):hover {
	color: var(--zr-accent);
	text-decoration-color: currentColor;
}

:where(.wp-site-blocks) [id] { scroll-margin-top: 7rem; }

.zeitler-label {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .19em;
	text-transform: uppercase;
	color: var(--zr-faint);
}

/* ================================================== Kopfzeile */
.zeitler-header {
	position: sticky;
	top: 0;
	z-index: 60;
	background: color-mix(in srgb, var(--wp--preset--color--base) 92%, transparent);
	backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--zr-hair);
}
.zeitler-header .wp-block-site-logo img { filter: var(--zr-logo-filter); }

.zeitler-header .wp-block-navigation { gap: 1.75rem; }
.zeitler-nav-tel a {
	color: var(--zr-ink) !important;
	border: 1px solid var(--zr-line);
	padding: .5rem .9rem;
	letter-spacing: .06em;
	text-decoration: none;
}
.zeitler-nav-tel a:hover {
	border-color: var(--zr-accent);
	color: var(--zr-accent) !important;
}

/* Das Überlagerungsmenü des Navigations-Blocks als echtes Vollbildmenü */
.zeitler-header .wp-block-navigation__responsive-container.is-menu-open {
	padding: 1.25rem var(--zr-gutter) 2.5rem;
	background-color: var(--wp--preset--color--base) !important;
}
.zeitler-header .wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation__responsive-container-content {
	justify-content: flex-start;
	padding-top: clamp(2rem, 8vh, 4rem);
	gap: 0;
}
.zeitler-header .wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item {
	width: 100%;
	border-bottom: 1px solid var(--zr-hair);
}
.zeitler-header .wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item__content {
	font-size: clamp(1.9rem, 9vw, 2.75rem);
	letter-spacing: -.02em;
	text-transform: none;
	padding: .6rem 0;
	color: var(--zr-ink) !important;
	width: 100%;
}
.zeitler-header .wp-block-navigation__responsive-container.is-menu-open
	.zeitler-nav-tel a {
	border: 0;
	padding: .6rem 0;
	color: var(--zr-accent) !important;
	font-size: 1.5rem;
	letter-spacing: 0;
}

/* ================================================== Aufmacher */
.zeitler-hero > .wp-block-columns {
	gap: 0;
	margin-block: 0 !important;
	align-items: stretch;
}

.zeitler-hero .zeitler-hero-text {
	padding-left: var(--zr-edge);
	padding-right: clamp(1.5rem, 4vw, 4rem);
	padding-block: clamp(3.5rem, 8vw, 6.5rem);
	/* Der Text steht mittig, das Bild daneben läuft über die volle Höhe.
	   Deshalb trägt die Spalte selbst keine Ausrichtung. */
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.zeitler-hero .zeitler-hero-text > * { max-width: 34rem; }

/* Der Akzentstrich über dem Kennzeichner */
.zeitler-hero .zeitler-label { position: relative; padding-top: 2.1rem; display: block; }
.zeitler-hero .zeitler-label::before {
	content: "";
	position: absolute;
	top: 0; left: 0;
	width: 3.5rem; height: 2px;
	background: var(--zr-signal);
	transform-origin: left;
	animation: zeitler-draw .7s .1s ease-out both;
}
@keyframes zeitler-draw { from { transform: scaleX(0); } to { transform: scaleX(1); } }

.zeitler-hero h1 { max-width: 12ch; }
.zeitler-hero .zeitler-lead {
	color: var(--zr-muted);
	line-height: 1.5;
	max-width: 40ch;
}
.zeitler-hero .zeitler-closer {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	letter-spacing: -.01em;
	color: var(--zr-ink);
}

/* Die Bildspalte füllt ihre Höhe restlos. Über die Flex-Kette kann kein
   Blockabstand mehr zwischen Spalte, Figur und Bild geraten. */
.zeitler-hero .wp-block-column.zeitler-hero-figure {
	align-self: stretch;
	display: flex;
	flex-direction: column;
	padding: 0;
}
.zeitler-hero .zeitler-hero-figure > .wp-block-image {
	margin: 0 !important;
	flex: 1 1 auto;
	display: flex;
}
.zeitler-hero .zeitler-hero-figure img {
	width: 100%;
	flex: 1 1 auto;
	min-height: clamp(30rem, 82vh, 48rem);
	object-fit: cover;
	object-position: center 38%;
}

.zeitler-btn-ghost .wp-block-button__link {
	background: transparent;
	color: var(--zr-ink);
	border: 1px solid var(--zr-line);
}
.zeitler-btn-ghost .wp-block-button__link:hover {
	border-color: var(--zr-accent);
	color: var(--zr-accent);
	background: transparent;
}

/* ================================================== Vertrauensleiste */
.zeitler-signals {
	border-top: 1px solid var(--zr-line);
	border-bottom: 1px solid var(--zr-line);
}
.zeitler-signals .wp-block-columns { gap: 0; margin-block: 0; }
.zeitler-signals .wp-block-column {
	padding: 1.6rem 1.75rem 1.75rem 0;
	border-left: 1px solid var(--zr-line);
}
.zeitler-signals .wp-block-column:first-child { border-left: 0; padding-left: 0; }
.zeitler-signals .wp-block-column:not(:first-child) { padding-left: 1.75rem; }
.zeitler-signals .zeitler-label { color: var(--zr-accent); }
.zeitler-signals p { margin-block: 0; }
.zeitler-signals .zeitler-signal-value {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: 1.125rem;
	font-variant-numeric: tabular-nums;
}
.zeitler-signals .zeitler-signal-value a { text-decoration: none; }

/* ================================================== Leistungsband */
.zeitler-band { color: var(--zr-band-ink); }
.zeitler-band :where(h2, h3) { color: var(--zr-band-ink); }
.zeitler-band .zeitler-label { color: var(--zr-band-muted); }
.zeitler-band p { color: var(--zr-band-muted); }
.zeitler-band .zeitler-band-head {
	padding-bottom: clamp(2.5rem, 5vw, 4rem);
	border-bottom: 1px solid var(--zr-band-line);
}
.zeitler-band .zeitler-band-head p { max-width: 54ch; }

.zeitler-directions { gap: 0 !important; }
.zeitler-directions .wp-block-column { padding-top: clamp(2.5rem, 5vw, 3.5rem); }
.zeitler-directions .wp-block-column:first-child { padding-right: clamp(2rem, 4.5vw, 4rem); }
.zeitler-directions .wp-block-column:not(:first-child) {
	border-left: 1px solid var(--zr-band-line);
	padding-left: clamp(2rem, 4.5vw, 4rem);
}

.zeitler-dir-no {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .19em;
	text-transform: uppercase;
	color: var(--zr-band-muted) !important;
}
.zeitler-dir-no strong { color: var(--zr-band-accent); font-size: .8125rem; letter-spacing: .1em; }
.zeitler-dir-no em { color: var(--zr-band-line); font-style: normal; padding-inline: .35rem; }

/* Schwerpunkte: profilbildende tragen den Abschnitt, die übrigen ordnen sich unter */
.zeitler-services { list-style: none; margin: 2.25rem 0 0; padding: 0; }
.zeitler-services li { border-top: 1px solid var(--zr-band-line); }
.zeitler-services li:last-child { border-bottom: 1px solid var(--zr-band-line); }
.zeitler-services a {
	display: flex;
	align-items: baseline;
	gap: 1rem;
	text-decoration: none;
	color: var(--zr-band-ink) !important;
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	transition: color .16s, padding-left .16s;
}
.zeitler-services a::after {
	content: "→";
	margin-left: auto;
	color: var(--zr-band-accent);
	opacity: 0;
	transform: translateX(-.4rem);
	transition: opacity .16s, transform .16s;
}
.zeitler-services a:hover { color: var(--zr-band-accent) !important; padding-left: .5rem; }
.zeitler-services a:hover::after { opacity: 1; transform: none; }

/* Die ersten beiden Einträge jeder Richtung sind die profilbildenden.
   Listenelemente können im Block-Editor keine eigene Klasse tragen,
   deshalb entscheidet die Position. */
.zeitler-services li:nth-child(-n+2) a {
	font-size: clamp(1.25rem, 1.8vw, 1.5rem);
	letter-spacing: -.018em;
	padding-block: 1.15rem;
}
.zeitler-services li:nth-child(n+3) a {
	font-size: .9375rem;
	padding-block: .7rem;
	color: var(--zr-band-muted) !important;
}
.zeitler-services li:nth-child(n+3) a:hover { color: var(--zr-band-accent) !important; }

/* ================================================== Team */
.zeitler-crew { gap: clamp(1.5rem, 3vw, 2.75rem) !important; }
.zeitler-person img {
	width: 100%;
	aspect-ratio: 26 / 31;
	object-fit: cover;
	object-position: center 22%;
	display: block;
	/* Punkt 7: eine leichte, einheitliche Korrektur — kein Effekt beim Zeigen */
	filter: saturate(.94) contrast(1.02);
}
.zeitler-person .wp-block-image { margin-bottom: 1.1rem; }
.zeitler-person h3 { margin-block: 0; }
.zeitler-person .zeitler-role {
	font-family: var(--wp--preset--font-family--sans);
	font-size: .8125rem;
	line-height: 1.35;
	color: var(--zr-muted);
	margin-block: .35rem 0;
}
/* Seit 23.08. fuehrt der Name selbst auf die Personenseite. Die Zeile
   „Profil · E-Mail" unter dem Portraet ist dafuer entfallen — der Verweis
   liegt jetzt dort, wo man ihn sucht. Die E-Mail-Adresse steht auf der
   Personenseite. */
.zeitler-person h3 a {
	color: var(--zr-ink) !important;
	text-decoration: none;
}
.zeitler-person h3 a:hover { color: var(--zr-accent) !important; }

/* ---------- Assistenzbereich, seit 31.08. ----------
   Ein zweiter Streifen unter den sechs Portraets der Juristen: fuenf Bilder in
   einer Reihe, darunter allein der Name — kein Verweis auf eine Unterseite und
   keine Rollenzeile. Fuenf Spalten statt drei machen die Bilder von selbst
   kleiner; das Seitenverhaeltnis 26:31 bleibt dasselbe wie oben, damit beide
   Reihen dieselbe Form tragen.
   Die Trennlinie darueber laeuft ueber den Satzspiegel — Regel vom 23.08.:
   Baender ganz, Inhalt im Satzspiegel.
   Das !important bei den Spalten ist noetig, weil der Core die Spaltenzahl aus
   dem Blockmarkup ("columnCount":5) ueber eine eigene Klasse gleicher Staerke
   setzt; dieselbe Lage wie bei .zeitler-crew weiter unten. */
.zeitler-crew-assistenz {
	gap: clamp(1.25rem, 2.5vw, 2rem) !important;
	margin-top: clamp(2rem, 4vw, 3.25rem) !important;
	padding-top: clamp(2rem, 4vw, 3.25rem);
	border-top: 1px solid var(--zr-line);
}
.zeitler-assistenz img {
	width: 100%;
	aspect-ratio: 26 / 31;
	object-fit: cover;
	object-position: center 22%;
	display: block;
	filter: saturate(.94) contrast(1.02);
}
.zeitler-assistenz .wp-block-image { margin-bottom: .85rem; }
.zeitler-assistenz h3 {
	margin-block: 0;
	font-size: clamp(.875rem, 1.05vw, 1rem) !important;
	letter-spacing: -.012em;
}
@media (max-width: 860px) {
	.zeitler-crew-assistenz { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (max-width: 600px) {
	.zeitler-crew-assistenz { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* ================================================== Wissen */
.zeitler-strands { list-style: none; margin: clamp(2rem, 4vw, 3rem) 0 0; padding: 0;
                   border-top: 1px solid var(--zr-line); }
.zeitler-strands li { border-bottom: 1px solid var(--zr-line); }
/* Der zweite Strang traegt kein Ziel; er steht seit 26.08. als <span> statt als
   leerem <a> im Markup — ein Verweis, der nirgends hinfuehrt, ist fuer Besucher
   wie fuer Vorlesegeraete irrefuehrend. Die Gestaltung bleibt dieselbe, die
   Selektoren fassen deshalb beides. */
.zeitler-strands a,
.zeitler-strands .zeitler-strand-inert {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .5rem 1.5rem;
	padding: 1.35rem 0;
	text-decoration: none;
	color: var(--zr-ink) !important;
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: clamp(1.125rem, 1.6vw, 1.375rem);
	letter-spacing: -.014em;
}
.zeitler-strands a em {
	font-family: var(--wp--preset--font-family--serif);
	font-style: normal;
	font-weight: 400;
	font-size: .9375rem;
	color: var(--zr-muted);
	letter-spacing: 0;
}
.zeitler-strands a::after { content: "→"; margin-left: auto; color: var(--zr-accent); opacity: 0; transition: opacity .16s; }
.zeitler-strands a:hover { color: var(--zr-accent) !important; }
.zeitler-strands a:hover::after { opacity: 1; }

/* Die drei Straenge als Felder — Fassung B aus dem Entwurf
   `entwurf/news-drei-spalten.html`, gewaehlt am 23.08.2026. Sie folgt dem
   Muster der vier Felder auf der Expertise-Seite: Ziffer in Orange, darunter
   der Name, der Pfeil steht dauerhaft. Die Ziffern stehen als Text im
   Blockmarkup und nicht als CSS-Zaehler — wie bei den Expertise-Feldern,
   damit sie im Editor bearbeitbar bleiben und mitwandern, wenn ein Strang
   dazukommt oder wegfaellt. Groesse, Gewicht und Sperrung sind dieselben wie
   dort (`.zeitler-dir-no strong`). */
/* Die Felder teilen sich die Breite gleichmaessig — bei zwei Straengen zwei
   Spalten, bei dreien drei. Seit 24.08. gibt es nur noch Blog und Vortraege &
   Seminare; mit fest drei Spalten haetten sie zwei Drittel der Breite belegt
   und rechts eine Luecke gelassen. Die :has()-Regel greift von selbst wieder,
   falls ein dritter Strang dazukommt. */
.zeitler-strands-felder {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}
.zeitler-strands-felder:has(> li:nth-child(3)) {
	grid-template-columns: repeat(3, 1fr);
}
.zeitler-strands-felder li {
	border-bottom: 0;
	border-left: 1px solid var(--zr-line);
}
.zeitler-strands-felder li:first-child { border-left: 0; }
.zeitler-strands-felder a,
.zeitler-strands-felder .zeitler-strand-inert {
	display: block;
	height: 100%;
	padding: 2.4rem 1.25rem 3rem;
	font-size: clamp(1.25rem, 1.8vw, 1.5rem);
}
.zeitler-strands-felder li:first-child a { padding-left: 0; }
.zeitler-strand-no {
	display: block;
	margin-bottom: 1.4rem;
	color: var(--zr-accent);
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .1em;
}
/* Der Pfeil steht dauerhaft — aber nur dort, wo der Name ein Ziel hat.
   Vortraege & Seminare und Publikationen fuehren derzeit nirgendwohin. */
.zeitler-strands-felder a[href]::after { margin: 0 0 0 .5rem; opacity: 1; }
/* Beim Zeigen faerbt sich der Name; die Ziffer steht ohnehin in Orange. */
.zeitler-strands-felder a:hover .zeitler-strand-no { color: var(--zr-ink); }

@media (max-width: 620px) {
	.zeitler-strands-felder { grid-template-columns: 1fr; }
	.zeitler-strands-felder li {
		border-left: 0;
		border-bottom: 1px solid var(--zr-line);
	}
	.zeitler-strands-felder a,
	.zeitler-strands-felder li:first-child a { padding: 1.6rem 0 2rem; }
	.zeitler-strand-no { margin-bottom: 1rem; }
}

.zeitler-documents .wp-block-file {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	border: 1px solid var(--zr-line);
	padding: .6rem .9rem;
	margin-right: .625rem;
	margin-bottom: .625rem;
}
.zeitler-documents .wp-block-file a:first-child {
	font-family: var(--wp--preset--font-family--sans);
	font-size: .8125rem;
	font-weight: 700;
	color: var(--zr-ink) !important;
	text-decoration: none;
}
.zeitler-documents .wp-block-file a:first-child::before {
	content: "PDF";
	display: inline-block;
	margin-right: .55rem;
	background: var(--zr-accent);
	color: var(--zr-on-accent);
	font-size: .625rem;
	letter-spacing: .1em;
	padding: .18em .42em;
	vertical-align: .1em;
}
.zeitler-documents .wp-block-file:hover { border-color: var(--zr-accent); }
.zeitler-documents .wp-block-file:hover a:first-child { color: var(--zr-accent) !important; }
.zeitler-documents .wp-block-file__button { display: none; }

/* ================================================== Abschluss */
/* Der Abschluss füllt fast die Bildschirmhöhe. Ein Raster statt eines
   Flex-Kastens: die Blöcke bleiben gestapelt und stehen als Gruppe mittig —
   mit align-items:center einer Flex-Zeile lägen sie nebeneinander. */
.zeitler-call {
	border-top: 1px solid var(--zr-line);
	min-height: min(86vh, 720px);
	/* Blocklayout beibehalten: WordPress setzt bei „constrained" auf jedes
	   Kind margin-inline:auto !important. Als Raster- oder Flexelement
	   schrumpfen die Blöcke dadurch auf Inhaltsbreite und rücken in die
	   Mitte. align-content zentriert auch im Blocklayout. */
	align-content: center;
}
/* Seit der Umstellung auf Bereichsseiten steht der Kontakt-Abschnitt als
   ganze Seite. Dann entfällt seine Oberlinie — sie stünde unmittelbar unter
   der Unterkante der Kopfzeile, also zwei Linien fast aufeinander. Ebenso die
   Mindesthöhe: Sie sollte den Abschluss der Startseite füllen; auf einer
   eigenen Seite erzeugt sie nur Leerraum über dem Fußbereich. */
.wp-block-post-content > .zeitler-call:first-child {
	border-top: 0;
	min-height: 0;
}
/* Auf allen Bereichsseiten sitzt der Claim so dicht unter der Kopfzeile wie
   auf der Startseite. Dort bringt `.zeitler-eck` 2rem mit; die Bereichsseiten
   trugen aus ihrem Blockmarkup den Voreinstellungswert `spacing|50`, der
   deutlich größer ist. Das `!important` ist unvermeidlich: Der Wert steht als
   Stilangabe unmittelbar am Element und wäre sonst nicht zu schlagen. */
.wp-block-post-content > *:first-child {
	padding-top: 2rem !important;
}
/* Und unten dasselbe Polster, seit 23.08. Der Inhaltsblock brachte aus seinem
   Markup `spacing|50` mit — bei 1440 Pixeln rund 115 Pixel —, dazu kam der
   Aussenabstand von `main` aus der Vorlage mit nochmals so viel. Zwischen dem
   letzten Text und der Fusszeile klafften dadurch je nach Seite 140 bis
   385 Pixel, waehrend oben 52 standen; auf den grau hinterlegten Seiten fiel
   das besonders auf, weil die Flaeche dort sichtbar endet. Die Startseite war
   nie betroffen — ihre Vorlage `front-page.html` fuehrt den Aussenabstand
   nicht.
   Wie die Regel darueber greift auch diese nur auf den aeussersten Block einer
   Seite, und das `!important` ist noetig, weil der Wert als Stilangabe
   unmittelbar am Element steht. */
.wp-block-post-content > *:last-child {
	padding-bottom: 2rem !important;
}
.zeitler-call h2 { letter-spacing: -.03em; line-height: .96; }
.zeitler-call .zeitler-call-tel { margin-top: clamp(2rem, 4vw, 3rem); }
.zeitler-call .zeitler-call-tel a {
	white-space: nowrap;
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: clamp(1.75rem, 4.4vw, 3.4rem);
	letter-spacing: -.015em;
	text-decoration: none;
	color: var(--zr-accent) !important;
	font-variant-numeric: tabular-nums;
}
.zeitler-call .zeitler-call-tel a:hover { color: var(--zr-ink) !important; }
.zeitler-call-rest {
	margin-top: clamp(2.5rem, 5vw, 3.5rem);
	padding-top: clamp(1.75rem, 3vw, 2.5rem);
	border-top: 1px solid var(--zr-line);
}
/* Folgt der Adressblock unmittelbar auf den Abschnittskopf, entfällt seine
   eigene Oberlinie — sonst stünden zwei Linien ohne Inhalt dazwischen.
   Seit dem 22.08. ist das der Regelfall: „Anruf genügt." und die große
   Telefonnummer, die vorher dazwischen standen, sind entfallen. */
.zeitler-band-head + .zeitler-call-rest {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}
.zeitler-call-rest p { font-size: .9375rem; line-height: 1.6; font-variant-numeric: tabular-nums; }
/* Der Kanzleiname steht in einer Zeile — ausdrücklicher Wunsch der Kanzlei.
   Unterhalb des Umbruchpunkts darf er brechen, sonst liefe er aus der Spalte. */
@media (min-width: 861px) {
	.zeitler-firma strong { white-space: nowrap; }
}
.zeitler-firma strong { display: inline-block; margin-bottom: .35rem; }
.zeitler-call-rest .zeitler-label { display: block; margin-bottom: .5rem; }

/* Aufstellungen im Kontakt: die Bezeichnung steht in einer Spalte fester
   Breite, dadurch beginnen Nummern und Uhrzeiten auf einer gemeinsamen
   Kante. Die Zeile ohne Bezeichnung bekommt denselben Einzug über ein
   leeres Element. */
.zeitler-aufstellung span {
	display: inline-block;
	width: 5rem;
}
/* Eine zweite E-Mail-Adresse in der Spalte „Kontaktdaten", durch eine
   Haarlinie abgesetzt: Sie gilt nur fuer Insolvenzverfahren. Der Hinweis
   darueber steht klein und gesperrt wie die uebrigen Kennzeichner; er
   ueberschreibt die feste Breite der Aufstellung, weil er laenger ist als
   die Bezeichnungen „Telefon:", „E-Mail:" und „Fax:". */
.zeitler-kontakt-extra {
	margin-top: 1.15rem;
	padding-top: .9rem;
	border-top: 1px solid var(--zr-hair);
}
.zeitler-kontakt-extra span {
	display: block;
	width: auto;
	font-family: var(--wp--preset--font-family--sans);
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--zr-faint);
	margin-bottom: .25rem;
}

/* Fußzeile: nur noch die Pflichtverweise und LinkedIn, in einer Reihe. */
.zeitler-fuss-links {
	display: flex;
	flex-wrap: wrap;
	gap: .6rem clamp(1.5rem, 3vw, 2.75rem);
}
.zeitler-route a {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .8125rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--zr-accent) !important;
}
.zeitler-route a:hover { color: var(--zr-ink) !important; }

/* ================================================== Fußbereich */
.zeitler-footer {
	font-size: .875rem;
	color: var(--zr-muted);
	/* Die Oberkante laeuft seit 23.08. ueber die ganze Seitenbreite — wie die
	   Unterkante der Kopfzeile. Beide sind Kanten von Baendern, die die Seite
	   ueberspannen; die Trennlinien *im Inhalt* bleiben beim Satzspiegel.
	   Vorher stand hier derselbe Hintergrundstreifen wie beim Beratungsansatz,
	   auf min(1240px, ...) begrenzt (22.08., Schritt 17). Der Unterschied zur
	   Kopfzeile ist der Kanzlei aufgefallen und wurde so aufgeloest. */
	border-top: 1px solid var(--zr-line);
}
.zeitler-footer p { color: var(--zr-muted); }
.zeitler-footer .zeitler-firm {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	color: var(--zr-ink);
}
.zeitler-footer a { text-decoration: none; color: var(--zr-muted) !important; }
.zeitler-footer a:hover { color: var(--zr-accent) !important; text-decoration: underline; }
.zeitler-footnote { color: var(--zr-faint); border-top: 1px solid var(--zr-hair); padding-top: 1.25rem; }

/* ================================================== Seitenkopf allgemein */
/* Kopf der Unterseiten: Kennzeichner, Titel, Vorspann auf einer Satzkante. */
.zeitler-kopf .zeitler-back {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .19em;
	text-transform: uppercase;
	color: var(--zr-faint);
	margin-bottom: 1.1rem;
}
.zeitler-kopf .zeitler-back a { color: var(--zr-faint) !important; text-decoration: none; }
.zeitler-kopf .zeitler-back a:hover { color: var(--zr-accent) !important; }
.zeitler-kopf h1 { max-width: 18ch; }
/* Der Seitentitel von Impressum, Datenschutz und Blog stand auf der Voreinstellung
   "Claim" (bis 4,6 rem) — ein Rest aus der Zeit vor dem 22.08., als die Claims noch
   64 px maßen. Er trägt jetzt dieselbe Formel wie die Claims selbst und wird damit
   nie größer als sie. !important, weil die Voreinstellungsklasse ihren Wert ebenso
   setzt. Wer die Claim-Größe ändert, muss diese Stelle mitziehen. */
.zeitler-kopf h1.has-claim-font-size {
	font-size: clamp(1.5rem, 2.6vw, 3rem) !important;
	/* Ohne die Begrenzung auf 18ch, die für die Köpfe mit Vorspann gedacht ist:
	   "Allgemeine Geschäftsbedingungen" brach dadurch zweizeilig um, obwohl der
	   Satzspiegel dreimal so breit ist. Auf schmalen Fenstern bricht der Titel
	   weiterhin von selbst. */
	max-width: none;
}

/* Impressum, Datenschutz und AGB tragen ihren Titel noch eine Stufe kleiner als die
   Claims — rund 28 statt 37 px, die Größe der Zwischentitel des Auftritts. Wunsch der
   Kanzlei vom 24.08. Der Selektor fasst über :has() genau die Seiten, deren Kopf ein
   zeitler-legal-Block folgt; die Blog-Seite behält die Claim-Größe. */
.zeitler-kopf:has(+ .zeitler-legal) h1.has-claim-font-size {
	font-size: clamp(1.375rem, 2vw, 2.25rem) !important;
}
.zeitler-kopf .zeitler-vorspann {
	/* Seit 31.08. dieselbe Formel wie .zeitler-topic-lead auf den Feldseiten —
	   der Vorspann der Blog-Seite stand vorher auf clamp(1.125rem, 1.5vw,
	   1.3125rem), also 21 statt rund 16 px. Wunsch der Kanzlei.
	   Wer die eine Groesse aendert, sollte die andere mitziehen. */
	font-size: clamp(.9375rem, 1.1vw, 1.0625rem);
	line-height: 1.55;
	color: var(--zr-muted);
	max-width: 50ch;
	margin-top: clamp(1.5rem, 3vw, 2.25rem);
}

/* ================================================== Mediathek */
.zeitler-strang + .zeitler-strang {
	margin-top: clamp(2.5rem, 5vw, 4rem);
	padding-top: clamp(2.5rem, 5vw, 4rem);
	border-top: 1px solid var(--zr-line);
}
.zeitler-strang .zeitler-strang-titel {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .19em;
	text-transform: uppercase;
	color: var(--zr-accent);
	margin: 0 0 .25rem;
}
.zeitler-strang table { border-collapse: collapse; width: 100%; }
.zeitler-strang td {
	border: 0;
	border-bottom: 1px solid var(--zr-hair);
	padding: .85rem 1.25rem .85rem 0;
	vertical-align: top;
	text-align: left;
}
.zeitler-strang tr:last-child td { border-bottom: 0; }
.zeitler-strang td:first-child {
	width: 8rem;
	white-space: nowrap;
	font-family: var(--wp--preset--font-family--sans);
	font-size: .75rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--zr-faint);
	padding-top: 1.1rem;
}
.zeitler-strang ul { list-style: none; margin: 0; padding: 0; }
.zeitler-strang li { border-bottom: 1px solid var(--zr-hair); padding: .85rem 0; }
.zeitler-strang li:last-child { border-bottom: 0; }

/* ================================================== Rechtstexte */
/* Kopf und Textblock stehen dicht beieinander. Beide Blöcke bringen aus ihrem
   Blockmarkup spacing|50 mit; zusammen waren das 247 px — dieselbe Ursache wie
   am 23.08. auf den Personenseiten (Schritt 17). Gilt für Impressum und
   Datenschutz, die denselben Kopf tragen. !important, weil der Wert als
   Stilangabe am Element steht. */
.zeitler-kopf:has(+ .zeitler-legal) {
	padding-bottom: clamp(.5rem, 1.2vw, 1rem) !important;
}
.zeitler-kopf + .zeitler-legal {
	padding-top: clamp(.5rem, 1.2vw, 1rem) !important;
}

.zeitler-legal p {
	max-width: 62ch;
	/* Etwas kleiner als der übrige Lesetext (16 statt 17 px) — Wunsch der Kanzlei
	   vom 24.08. Rechtstexte werden überflogen, nicht gelesen. */
	font-size: 1rem;
}
/* Die Kennzeichner der Rechtstexte stehen größer als die übrigen Kennzeichner des
   Auftritts (13 statt 11 px, Sperrung dafür etwas zurückgenommen): Auf Impressum und
   Datenschutz führen sie einen ganzen Abschnitt an und sind das einzige Gliederungs-
   mittel der Seite. Wunsch der Kanzlei vom 24.08. */
.zeitler-legal .zeitler-legal-titel {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .8125rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--zr-accent);
	max-width: none;
}
.zeitler-legal .zeitler-legal-block + .zeitler-legal-block {
	margin-top: clamp(1.25rem, 2.2vw, 1.75rem);
	padding-top: clamp(1.25rem, 2.2vw, 1.75rem);
	border-top: 1px solid var(--zr-hair);
}
/* Anschrift, Kontaktdaten und Registerangaben standen als einziger Text der Seite in
   der Grotesk. Sie tragen seit 24.08. die Lesetextschrift wie alles Übrige.
   lining-nums ist dabei nötig: Schola setzt von Haus aus Mediävalziffern mit Ober-
   und Unterlängen (Befund vom 22.08., Abschnitt 5d) — in einer Anschrift mit
   Postleitzahl, Telefonnummer und Firmenbuchnummer sähe das unruhig aus. */
.zeitler-legal .zeitler-legal-daten {
	font-size: .9375rem;
	line-height: 1.8;
	font-variant-numeric: lining-nums tabular-nums;
}

/* ================================================== Kontaktseite */
.zeitler-kontakt-tel a {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: clamp(1.75rem, 4.4vw, 3.4rem);
	letter-spacing: -.015em;
	text-decoration: none;
	color: var(--zr-accent) !important;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.zeitler-kontakt-tel a:hover { color: var(--zr-ink) !important; }
.zeitler-plan .wp-block-columns { margin-block: 0; }
.zeitler-plan img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.zeitler-plan .zeitler-plan-daten p { font-size: .9375rem; line-height: 1.7;
                                      font-variant-numeric: tabular-nums; }
.zeitler-plan .zeitler-label { display: block; margin-bottom: .45rem; }
.zeitler-plan .zeitler-plan-block + .zeitler-plan-block { margin-top: 1.6rem; }

/* ================================================== Blogkacheln */
.zeitler-blog .wp-block-post-template { gap: clamp(1.25rem, 2.5vw, 2rem) !important; }
.zeitler-blog-karte { padding: clamp(1.5rem, 3vw, 2.25rem); }
.zeitler-blog-karte .wp-block-post-title {
	margin: 0 0 .5rem;
	line-height: 1.15;
	font-size: clamp(1.25rem, 2vw, 1.6rem);
	letter-spacing: -.02em;
	max-width: 24ch;
}
.zeitler-blog-karte .wp-block-post-title a { color: #ffffff !important; text-decoration: none; }
.zeitler-blog-karte .wp-block-post-title a:hover { text-decoration: underline; }
.zeitler-blog-karte .wp-block-post-date {
	margin: 0;
	font-family: var(--wp--preset--font-family--sans);
	font-size: .75rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .85);
}

@media (max-width: 860px) {
	.zeitler-strang .wp-block-columns { gap: .85rem; }
	.zeitler-strang td:first-child { width: 6.5rem; white-space: normal; }
}
@media (max-width: 600px) {
	.zeitler-strang table,
	.zeitler-strang tbody,
	.zeitler-strang tr,
	.zeitler-strang td { display: block; width: auto; }
	.zeitler-strang td { border-bottom: 0; padding: 0; }
	.zeitler-strang td:first-child { padding-top: 0; margin-bottom: .2rem; }
	.zeitler-strang tr { border-bottom: 1px solid var(--zr-hair); padding: .85rem 0; }
	.zeitler-strang tr:last-child { border-bottom: 0; }
}

/* ================================================== Personenseiten */
.zeitler-profil .wp-block-columns { margin-block: 0; }
.zeitler-profil .zeitler-profil-bild img {
	width: 100%;
	aspect-ratio: 26 / 31;
	object-fit: cover;
	object-position: center 20%;
	filter: saturate(.94) contrast(1.02);
}
.zeitler-profil .zeitler-back {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .19em;
	text-transform: uppercase;
	color: var(--zr-faint);
	margin-bottom: 1.1rem;
}
.zeitler-profil .zeitler-back a { color: var(--zr-faint) !important; text-decoration: none; }
.zeitler-profil .zeitler-back a:hover { color: var(--zr-accent) !important; }
/* Der Name steht in einer Zeile. Die Begrenzung auf 18 Zeichen liess
   laengere Namen umbrechen — „Mag. Sabine Zeitler, MAS" stand zweizeilig.
   Unterhalb von 861 px, wo das Profil einspaltig wird, darf er weiterhin
   brechen; sonst liefe er aus der Spalte. */
/* Die Namen standen auf der Voreinstellung "Sehr gross" (bis 49 px). Mit den
   akademischen Graden dahinter — "Dr. Martin Hengstschlaeger, LL.M., MBL, MBA"
   misst 932 px — lief der Name aus der Spalte und die Seite waagrecht ueber;
   die Zeile steht ab 861 px bewusst auf nowrap. Gemessen passt der laengste
   Name bei hoechstens 38 px. Wunsch der Kanzlei vom 24.08. */
.zeitler-profil h1 {
	max-width: none;
	font-size: clamp(1.5rem, 2.4vw, 2.125rem) !important;
}
@media (min-width: 861px) {
	.zeitler-profil h1 { white-space: nowrap; }
}

/* Der persoenliche Satz — Fassung A aus dem Entwurf
   `entwurf/profil-statement.html`, gewaehlt am 23.08. Er steht zwischen
   Rolle und Kontaktzeile, mit einem Strich im Logoton davor. Solange kein
   Satz vorliegt, steht dort ein Platzhalter; die Sätze kommen von den
   Personen selbst. */
.zeitler-profil .zeitler-profil-statement {
	/* Derselbe Wert wie der Abstand unter dem Satz (der Vorabstand der Zeile
	   "Ihr Ansprechpartner fuer" bzw. der Kontaktdaten), auf Wunsch der Kanzlei
	   vom 26.08.: Ueber und unter dem Satz steht damit gleich viel Luft. Zuvor
	   1.2rem, also rund die Haelfte. Wer den einen Wert aendert, muss den
	   anderen mitziehen. */
	margin: var(--zr-profil-luft) 0 0;
	padding-left: 1rem;
	border-left: 2px solid var(--zr-accent);
	font-family: var(--wp--preset--font-family--serif);
	/* Kursiv auf Wunsch der Kanzlei vom 24.08. Es ist ein echter Schnitt:
	   schola-italic liegt im Schriftenordner und ist in theme.json als
	   fontStyle italic, Gewicht 400 eingetragen — der Browser muss also nichts
	   schraeg stellen. */
	font-style: italic;
	font-size: 1rem;
	line-height: 1.6;
	max-width: 46ch;
	color: var(--zr-muted);
}
.zeitler-profil .zeitler-profil-rolle {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 1rem;
	line-height: 1.4;
	color: var(--zr-muted);
	margin-top: .9rem;
}
.zeitler-profil .zeitler-profil-kontakt {
	/* Derselbe gemeinsame Wert wie im uebrigen Kopf. Er greift auf den Seiten
	   ohne die Zeile "Ihr Ansprechpartner fuer" — dort folgen die Kontaktdaten
	   unmittelbar auf den persoenlichen Satz. */
	margin-top: var(--zr-profil-luft);
	padding-top: var(--zr-profil-luft);
	border-top: 1px solid var(--zr-line);
	/* Seit 24.08. in der Lesetextschrift wie der uebrige Text der Seite; vorher
	   in der Grotesk. lining-nums ist dabei noetig, weil Schola von Haus aus
	   Mediaevalziffern setzt (Befund vom 22.08.) — in einer Telefonnummer saehe
	   das unruhig aus. */
	font-size: .9375rem;
	font-variant-numeric: lining-nums tabular-nums;
	line-height: 1.9;
}
.zeitler-profil .zeitler-profil-kontakt a { text-decoration: none; }
.zeitler-profil .zeitler-profil-kontakt a:hover { color: var(--zr-accent) !important; }

/* Zeile "Ihr Ansprechpartner fuer ..." ueber den Kontaktdaten, auf Wunsch der
   Kanzlei vom 26.08. Sie ist in allen Werten der Kennzeichner der Vita-Bloecke
   (WERDEGANG, SPRACHEN ...) — 11 px Jost 700, gesperrt, Versalien, Logoton —,
   damit auf der Seite nicht zwei Arten kleiner Kennzeichner nebeneinander
   stehen. Die Trennlinie ueber den Kontaktdaten wandert dabei an diese Zeile:
   Sie fuehrt den Block jetzt an, und zwei Linien uebereinander waeren ein
   Bruch. Der Selektor mit drei Klassen schlaegt die Grundregel darunter —
   Reihenfolge ist dabei nicht entscheidend.
   Auf der Seite von Mag. Eva Beissmann steht die Zeile ausdruecklich nicht. */
.zeitler-profil .zeitler-profil-ansprech {
	margin: var(--zr-profil-luft) 0 0;
	/* Linie oben und unten, auf Wunsch der Kanzlei vom 26.08.: Die Zeile ist
	   damit eingefasst und fuehrt die Kontaktdaten sichtbar an. Dasselbe Mittel
	   traegt der Kontaktstreifen der Feldseiten seit 23.08. (Schritt 28). */
	/* Oben und unten derselbe Wert, auf Wunsch der Kanzlei vom 26.08.: Die
	   eingefasste Zeile traegt damit ringsum gleich viel Luft. */
	padding: var(--zr-profil-luft) 0;
	border-top: 1px solid var(--zr-line);
	border-bottom: 1px solid var(--zr-line);
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .19em;
	text-transform: uppercase;
	color: var(--zr-accent);
}
/* Die Rechtsbereiche hinter "Ihr Ansprechpartner fuer" stehen auf Wunsch der
   Kanzlei vom 26.08. in der normalen Schrift, nicht im Logoton: Der Kennzeichner
   bleibt das kleine orange Wort, die Aufzaehlung darunter ist Lesetext. Sie steht
   deshalb in Schola, Textfarbe, normaler Schreibweise und ohne Sperrung — alle
   fuenf Angaben muessen zurueckgenommen werden, weil sie vom Kennzeichner
   ringsum geerbt wuerden. Als eigene Zeile (`display: block`), damit der
   Kennzeichner die Aufzaehlung anfuehrt wie ueberall sonst auf der Seite. */
.zeitler-profil .zeitler-profil-ansprech .zeitler-ansprech-gebiete {
	display: block;
	margin-top: .5rem;
	font-family: var(--wp--preset--font-family--serif);
	font-weight: 400;
	font-size: .9375rem;
	letter-spacing: normal;
	text-transform: none;
	line-height: 1.6;
	color: var(--zr-muted);
}
.zeitler-profil .zeitler-profil-ansprech + .zeitler-profil-kontakt {
	margin-top: 0;
	/* Derselbe Wert wie das obere Polster der Zeile darueber, auf Wunsch der
	   Kanzlei vom 26.08.: Unter beiden Linien steht damit gleich viel Luft. Wer
	   den einen Wert aendert, muss den anderen mitziehen. */
	padding-top: var(--zr-profil-luft);
	border-top: 0;
}

/* Zwischen Foto und Werdegang standen rund 250 Pixel Luft: Beide Bloecke
   bringen aus ihrem Markup `spacing|50` mit, das sind je rund 115 Pixel.
   Solange die Bloecke verschieden hinterlegt waren, trennte das; seit alles
   grau ist (Schritt 14), wirkt es als Loch. Beide Polster sind deshalb auf
   rund ein Drittel gesetzt — der Abstand liegt jetzt bei rund 110 Pixeln.
   `!important`, weil die Werte als Stilangabe am Element stehen. */
.zeitler-profil {
	padding-bottom: clamp(1.75rem, 3vw, 2.75rem) !important;
	/* Ein Wert fuer alle vier Abstaende des Kopfes: ueber dem persoenlichen
	   Satz, ueber der eingefassten Zeile, innen darin und ueber den
	   Kontaktdaten. Am 26.08. auf Wunsch der Kanzlei angeglichen — und
	   zugleich enger gesetzt, damit die Textspalte neben das Portraet passt
	   (sie war mit den grosszuegigen Werten 57 Pixel hoeher als das Bild).
	   Wer hier dreht, aendert alle vier Stellen auf einmal. */
	--zr-profil-luft: clamp(1rem, 1.8vw, 1.25rem);
}
.zeitler-vita { padding-top: clamp(1.75rem, 3vw, 2.75rem) !important; }

/* Abschnitte des Werdegangs: Überschrift links, Einträge rechts */
.zeitler-vita .wp-block-columns { margin-block: 0; }
/* Die Eintraege beginnen auf derselben Kante wie der Name im Kopf. Die
   Spalten standen auf 24/76, der Kopf auf 34/66 — dadurch sass alles unter
   dem Bild rund 110 Pixel weiter links als Name, Rolle und Kontakt. Beide
   Raster tragen jetzt dasselbe Verhaeltnis; die Kennzeichner (WERDEGANG,
   SPRACHEN, FUNKTIONEN) stehen weiterhin buendig zur linken Bildkante.
   `!important`, weil die Breite als Stilangabe am Element steht. */
.zeitler-vita .wp-block-columns > .wp-block-column:first-child {
	flex-basis: 34% !important;
}
.zeitler-vita .wp-block-columns > .wp-block-column:last-child {
	flex-basis: 66% !important;
}
.zeitler-vita-block + .zeitler-vita-block {
	/* Am 24.08. enger gesetzt: vorher je 36 px oben und unten. */
	margin-top: clamp(1rem, 1.8vw, 1.5rem);
	padding-top: clamp(1rem, 1.8vw, 1.5rem);
	border-top: 1px solid var(--zr-line);
}
.zeitler-vita .zeitler-vita-titel {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .19em;
	text-transform: uppercase;
	color: var(--zr-accent);
	margin: 0;
}
/* Die Eintraege von Werdegang, Zusatzqualifikationen, Sprachen und
   Funktionen stehen seit 23.08. auf 1 rem — dieselbe Groesse wie der
   persoenliche Satz im Kopf. Zuvor trugen sie die allgemeine Lesegroesse
   (`--wp--preset--font-size--medium`, bei 1440 px 17 Pixel) und wirkten
   damit eine Spur zu gross fuer eine Aufstellung. Die Kennzeichner links
   (11 px) und die Jahreszahlen (12 px) bleiben unberuehrt: Ihre Regeln
   sind genauer und gewinnen. */
.zeitler-vita td,
.zeitler-vita li {
	/* Seit 23.08. eine Spur kleiner und enger als der Satz im Kopf: Die
	   Bloecke sind Aufstellungen, keine Lesetexte — sie duerfen dichter
	   stehen. Vorher 1 rem / 1,6. */
	font-size: .9375rem;
	line-height: 1.5;
}

.zeitler-vita table { border-collapse: collapse; width: 100%; }
/* `table td` statt nur `td`: Eine Regel aus dem Elternteil setzt das
   Zeilenpolster in `em` und traegt dieselbe Gewichtung — mit dem zusaetzlichen
   Element gewinnt diese hier. Ohne das blieb das Polster bei 11 Pixeln
   stehen, obwohl der Wert hier kleiner steht. */
.zeitler-vita table td {
	/* Seit 23.08. ohne Trennlinien — Fassung B aus dem Entwurf
	   `entwurf/profil-striche.html`. Die Linien liefen von der Jahreszahl bis
	   zum rechten Rand und wirkten zu lang. Die Zeilen trennt jetzt allein der
	   Abstand, der dafuer etwas groesser ist (.85 statt .55 rem).
	   Die Linien zwischen den Bloecken (Werdegang, Sprachen, Funktionen)
	   bleiben — sie trennen Abschnitte, nicht Zeilen. */
	border: 0;
	padding: .6rem 1.25rem .6rem 0;
	/* Grundlinie statt Oberkante: Datumsangabe und Eintrag tragen seit 24.08.
	   verschiedene Schriftgroessen (10 gegen 15 px). Bei `top` beginnen die
	   Kaesten zwar gleich, die Schrift sitzt darin aber verschieden hoch — die
	   Datumsangabe stand 8 Pixel ueber der Zeile daneben. `baseline` setzt
	   beide auf dieselbe Grundlinie. */
	vertical-align: baseline;
	text-align: left;
}
.zeitler-vita td:first-child {
	width: 10.5rem;
	white-space: nowrap;
	/* Seit 24.08. in der Lesetextschrift. Die Groesse ist optisch angeglichen,
	   nicht rechnerisch: Bei 15 px messen die Kleinbuchstaben des Eintrags
	   daneben 8 px, die Versalien aber 12 — in Versalien gesetzt wirkte die
	   Datumsangabe deshalb groesser als der Text, obwohl beide auf 15 px standen.
	   Bei 10 px sind die Versalien genau 8 px hoch und damit so hoch wie die
	   Kleinbuchstaben daneben. Wunsch der Kanzlei vom 24.08.; am gerenderten
	   Bild gemessen, nicht geschaetzt. */
	font-size: .625rem;
	letter-spacing: .05em;
	text-transform: uppercase;
	font-variant-numeric: lining-nums tabular-nums;
	color: var(--zr-faint);
	padding-top: .75rem;
}
/* Der Kennzeichner (WERDEGANG, SPRACHEN …) und die erste Zeile daneben standen
   nicht auf einer Hoehe: Die Eintraege bringen ein Polster nach oben mit, der
   Kennzeichner nicht — gemessen 15 bis 21 Pixel Versatz. Die erste Zeile jedes
   Blocks traegt deshalb kein oberes Polster mehr; den Rest gleicht ein kleines
   Polster am Kennzeichner aus, das den Unterschied der Schriftgroessen
   auffaengt. Wunsch der Kanzlei vom 24.08. */
/* Die Tabelle steckt in einem figure-Block und sitzt dadurch etwas hoeher als
   eine Liste; gemessen 8 Pixel. Das faengt das Polster der ersten Zeile auf,
   damit Tabellen- und Listenbloecke gleich beginnen. */
.zeitler-vita table tr:first-child td { padding-top: .5rem; }
.zeitler-vita li:first-child { padding-top: 0; }
/* Der Kennzeichner misst 11 px, die Eintraege 15 — sein Text sitzt dadurch
   hoeher im Zeilenkasten. Die Differenz gleicht dieses Polster aus; gemessen
   waren es 7 Pixel. */
.zeitler-vita .zeitler-vita-titel { padding-top: .45rem; }

.zeitler-vita ul { list-style: none; margin: 0; padding: 0; }
.zeitler-vita li {
	padding: .6rem 0;
}

/* Weitere im Team */
.zeitler-kollegen .wp-block-group.is-layout-grid { gap: clamp(1.25rem, 2.5vw, 2rem); }
/* Der Streifen "Weitere im Team" ist im Blockmarkup als Raster mit fest fuenf Spalten
   angelegt ("columnCount":5). Der Core macht daraus repeat(5, minmax(0,1fr)) bei jeder
   Fensterbreite — auf einem Telefon blieben je Spalte rund 48 px, und Namen wie
   "Steininger" ragten heraus: die Seite wurde 411 statt 360 px breit und liess sich
   waagrecht schieben. Der Selektor fuehrt zwei Klassen und schlaegt damit die eine
   Klasse, die der Core fuer das Raster erzeugt. Befund vom 24.08. */
@media (max-width: 860px) {
	.zeitler-kollegen .wp-block-group.is-layout-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
@media (max-width: 600px) {
	.zeitler-kollegen .wp-block-group.is-layout-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
.zeitler-kollege img {
	width: 100%;
	aspect-ratio: 26 / 31;
	object-fit: cover;
	object-position: center 22%;
	filter: saturate(.94) contrast(1.02);
}
.zeitler-kollege .wp-block-image { margin-bottom: .8rem; }
.zeitler-kollege p {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .875rem;
	letter-spacing: -.01em;
	margin: 0;
}
.zeitler-kollege p a { text-decoration: none; }
.zeitler-kollege p a:hover { color: var(--zr-accent) !important; }
.zeitler-kollege .zeitler-kollege-rolle {
	font-weight: 400;
	font-size: .75rem;
	color: var(--zr-muted);
	margin-top: .25rem;
}

@media (max-width: 860px) {
	.zeitler-profil .wp-block-columns { gap: 1.75rem; }
	/* Gestapelt braucht die Abschnittsüberschrift keinen Spaltenabstand */
	.zeitler-vita .wp-block-columns { gap: .85rem; }
	.zeitler-vita td:first-child { width: 7.5rem; white-space: normal; }
}
@media (max-width: 600px) {
	.zeitler-vita table,
	.zeitler-vita tbody,
	.zeitler-vita tr,
	.zeitler-vita td { display: block; width: auto; }
	.zeitler-vita td { border-bottom: 0; padding: 0; }
	.zeitler-vita td:first-child { padding-top: 0; margin-bottom: .2rem; }
	.zeitler-vita tr { border-bottom: 1px solid var(--zr-hair); padding: .8rem 0; }
	.zeitler-vita tr:last-child { border-bottom: 0; }
}

/* ================================================== Rechtsgebietsseiten */
.zeitler-topic .zeitler-dir-no-light {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .19em;
	text-transform: uppercase;
	color: var(--zr-faint);
	margin-bottom: 1.25rem;
}
.zeitler-topic .zeitler-dir-no-light strong { color: var(--zr-accent); font-size: .8125rem; }
.zeitler-topic .zeitler-dir-no-light em { color: var(--zr-line); font-style: normal; padding-inline: .4rem; }
.zeitler-topic .zeitler-dir-no-light a { color: var(--zr-faint) !important; text-decoration: none; }
.zeitler-topic .zeitler-dir-no-light a:hover { color: var(--zr-accent) !important; }

/* Die Überschrift lief auf 16 Zeichen begrenzt und brach dadurch immer
   um. Der längste der vier Titel hat 43 Zeichen und braucht bei 3,05 rem
   rund 990 px — der Satzspiegel ist 1240 px breit, also passt jeder in
   eine Zeile. Auf schmalen Fenstern bricht er weiterhin, wie er soll. */
/* Der Weg zurueck zur Expertise-Seite, ganz oben auf der Feldseite —
   dieselbe Form wie das „← Team" auf den Personenseiten. */
.zeitler-topic .zeitler-back {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .19em;
	text-transform: uppercase;
	color: var(--zr-faint);
	margin: 0 0 1.1rem;
}
.zeitler-topic .zeitler-back a { color: var(--zr-faint) !important; text-decoration: none; }
.zeitler-topic .zeitler-back a:hover { color: var(--zr-accent) !important; }

/* Die Ueberschrift der Feldseiten steht seit 23.08. kleiner: Sie kam aus der
   Voreinstellung `x-large` und mass bei 1440 px rund 49 Pixel — neben dem
   knapperen Vorsatz und dem kleineren Fliesstext wirkte das zu gross.
   `!important`, weil die Voreinstellungsklasse `has-x-large-font-size` ihren
   Wert selbst so setzt. */
.zeitler-topic h1 {
	max-width: none;
	font-size: clamp(1.6rem, 2.4vw, 2.4rem) !important;
}
/* Ein Vorsatz ueber dem Fliesstext der Feldseite: zwei kurze Saetze, die den
   Text einleiten. Groesser als der Lesetext, in der Lesetextschrift, damit er
   fuehrt, ohne mit der Seitenueberschrift zu wetteifern — die steht in Jost
   und ist mehr als doppelt so gross. In normaler Schreibweise gesetzt; die
   Kanzlei hatte ihn in Grossbuchstaben geliefert, wie schon den Text im
   Kontakt-Abschnitt am 22.08. (Schritt 7). */
.zeitler-topic .zeitler-topic-claim {
	font-family: var(--wp--preset--font-family--serif);
	/* Am 23.08. verkleinert: 24 statt 26 Pixel bei den ueblichen Breiten.
	   Tiefer sollte er nicht gehen — unter 24 Pixel verlangt die
	   Kontrastregel 4,5:1, und der Logoton erreicht auf Grau nur 3,38:1. */
	font-size: clamp(1.125rem, 1.5vw, 1.3125rem);
	line-height: 1.4;
	/* Im Logoton und in einer Zeile — ausdruecklicher Wunsch der Kanzlei.
	   Ohne Breitenbegrenzung passt der Satz bei 1240 px Satzspiegel in eine
	   Zeile; auf schmalen Fenstern bricht er von selbst um.
	   Zum Kontrast: Der Logoton erreicht auf dem grauen Grund 3,38:1. Fuer
	   grosse Schrift ab 24 px genuegen 3:1 — der Satz misst 26 px und liegt
	   damit im gruenen Bereich. Wer ihn spaeter verkleinert, muss das
	   nachrechnen. */
	color: var(--zr-accent);
	max-width: none;
	margin: clamp(1.75rem, 3vw, 2.5rem) 0 0;
}
/* Der Vorsatz uebernimmt die Trennlinie, die sonst der Fliesstext traegt —
   sonst stuenden zwei Linien, und der Vorsatz haenge oben am Untertitel.
   Der Text rueckt dafuer dicht darunter. */
.zeitler-topic .zeitler-topic-claim + .zeitler-topic-lead {
	margin-top: 1.15rem;
	padding-top: 0;
	border-top: 0;
}
.zeitler-topic .zeitler-topic-sub {
	font-family: var(--wp--preset--font-family--sans);
	font-size: .9375rem;
	letter-spacing: .02em;
	color: var(--zr-muted);
	margin-top: 1rem;
	/* Die Trennlinie unter dem Kopf haengt seit 23.08. hier: Der Untertitel
	   laeuft ueber den ganzen Satzspiegel, der Fliesstext darunter nicht (er
	   ist auf 54 Zeichen begrenzt). Vorher trug der Fliesstext die Linie, und
	   sie war auf drei der vier Feldseiten nur halb so breit wie auf der
	   vierten. */
	padding-bottom: clamp(1.75rem, 3vw, 2.5rem);
	border-bottom: 1px solid var(--zr-line);
}
.zeitler-topic .zeitler-topic-lead {
	/* Am 23.08. zweimal zurueckgenommen — zuletzt auf knapp unter Lesegroesse,
	   damit der Kopf insgesamt ruhiger wird. */
	font-size: clamp(.9375rem, 1.1vw, 1.0625rem);
	line-height: 1.6;
	max-width: 54ch;
	margin-top: clamp(1.75rem, 3vw, 2.5rem);
}
/* Folgt ein zweiter Absatz, steht er dicht darunter — der grosse Abstand
   gilt dem Anschluss an den Kopf, nicht dem Absatzwechsel. */
.zeitler-topic .zeitler-topic-lead + .zeitler-topic-lead { margin-top: 1rem; }

/* Kontaktstreifen der Rechtsgebietsseiten — bewusst kleiner als der
   Abschluss der Startseite, damit „Anruf genügt." dort einzig bleibt. */
.zeitler-ask .wp-block-columns { align-items: center; margin-block: 0; }
.zeitler-ask .zeitler-ask-tel {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	/* Auf Wunsch der Kanzlei zurückgenommen: die Nummer stand bei 1920 px
	   mit 30 px doppelt so groß wie die E-Mail-Adresse darunter. */
	font-size: clamp(1.125rem, 1.6vw, 1.375rem);
	letter-spacing: -.008em;
	font-variant-numeric: tabular-nums;
	margin-bottom: .5rem;
}
.zeitler-ask .zeitler-ask-tel a { color: var(--zr-accent) !important; text-decoration: none; white-space: nowrap; }
.zeitler-ask .zeitler-ask-tel a:hover { color: var(--zr-ink) !important; }
/* Im Kontaktstreifen stehen Schaltflaeche und Telefonzeile nebeneinander;
   auf schmalen Fenstern rutscht die Zeile unter die Schaltflaeche. */
.zeitler-ask .zeitler-ask-aktion {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .75rem 1.25rem;
	/* Linien darueber und darunter fassen die Zeile ein. Sie laufen ueber den
	   Satzspiegel, nicht ueber die Seite — die Gruppe steht im Inhalt. */
	padding-block: clamp(1rem, 2vw, 1.4rem);
	border-top: 1px solid var(--zr-line);
	border-bottom: 1px solid var(--zr-line);
}
.zeitler-ask .zeitler-ask-aktion .wp-block-buttons { margin: 0; }
/* „Kontaktieren Sie uns" steht hier ohne orange Flaeche: nur die Woerter
   tragen den Logoton. Schriftschnitt, Sperrung und Versalien bleiben, damit
   es als Aufforderung lesbar bleibt und nicht wie ein gewoehnlicher Verweis
   wirkt. Beim Zeigen wechselt es in die Textfarbe — wie die Nummer daneben.
   Die Grundregeln der Schaltflaeche stehen in `theme.json` und tragen
   `!important`; deshalb hier ebenso. */
.zeitler-ask .zeitler-ask-aktion .wp-block-button__link,
.zeitler-ansatz .wp-block-button__link {
	background-color: transparent !important;
	color: var(--zr-accent) !important;
	padding: 0 !important;
}
.zeitler-ask .zeitler-ask-aktion .wp-block-button__link:hover,
.zeitler-ansatz .wp-block-button__link:hover {
	background-color: transparent !important;
	color: var(--zr-ink) !important;
}
/* Neben der Schaltflaeche ist die Nummer Teil eines Satzes und kein Blickfang:
   Lesegroesse, normales Gewicht. Wo sie allein steht — auf den uebrigen
   Feldseiten —, bleibt sie gross und fett. */
.zeitler-ask .zeitler-ask-aktion .zeitler-ask-tel {
	margin: 0;
	font-size: 1rem;
	font-weight: 400;
}
/* Die Nummer traegt dieselbe Schrift wie „Schreiben Sie uns" daneben:
   Jost, fett, gesperrt, Versalgroesse — so lesen sich die beiden Wege zur
   Kanzlei als Paar. Der Satz davor bleibt gewoehnlicher Text. */
.zeitler-ask .zeitler-ask-aktion .zeitler-ask-tel a {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .8125rem;
	letter-spacing: .13em;
	text-transform: uppercase;
}

.zeitler-ask .zeitler-ask-rest { font-size: 1.125rem; color: var(--zr-muted); }
.zeitler-ask .zeitler-ask-rest a { text-decoration: none; }
.zeitler-ask .zeitler-ask-rest a:hover { color: var(--zr-accent) !important; }

/* „Weitere Taetigkeitsbereiche" rueckt naeher an die Zeile darueber: Der
   Kontaktstreifen bringt sein Polster mit, der Abschnitt brachte nochmals
   `spacing|50` — zusammen rund 165 Pixel. `!important`, weil der Wert als
   Stilangabe am Element steht. */
.zeitler-ask + .zeitler-more { padding-top: clamp(.75rem, 1.5vw, 1.25rem) !important; }
/* Derselbe knappe Abstand zwischen den Schwerpunkten und der Zeile
   darunter: Beide Bloecke brachten je rund 48 Pixel Polster mit. */
.zeitler-teilgebiete { padding-bottom: clamp(1rem, 2vw, 1.5rem) !important; }
.zeitler-teilgebiete + .zeitler-ask { padding-top: clamp(.75rem, 1.5vw, 1.25rem) !important; }
/* Und der Streifen selbst schliesst dichter ab, wo er nur noch aus der
   einen Zeile besteht — die Linie unter ihr traegt den Abschluss schon.
   `:has()` fasst genau diesen Fall; die drei uebrigen Feldseiten mit dem
   alten Streifen bleiben unberuehrt. */
.zeitler-ask:has(.zeitler-ask-aktion) { padding-bottom: clamp(1rem, 2vw, 1.5rem) !important; }
/* Der Kennzeichner steht groesser, wie „Schwerpunkte unserer Leistungen":
   Er fuehrt einen eigenen Abschnitt an. */
.zeitler-more .zeitler-label {
	font-size: 1rem;
	letter-spacing: .12em;
}

/* Geschwisterliste: wie das Leistungsband, aber auf hellem Grund */
.zeitler-siblings { list-style: none; margin: clamp(1.75rem, 3vw, 2.5rem) 0 0; padding: 0;
                    border-top: 1px solid var(--zr-line); }
.zeitler-siblings li { border-bottom: 1px solid var(--zr-line); }
.zeitler-siblings a {
	display: flex;
	align-items: baseline;
	gap: 1rem;
	padding: .95rem 0;
	text-decoration: none;
	color: var(--zr-ink) !important;
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: 1.0625rem;
	letter-spacing: -.012em;
	transition: color .16s, padding-left .16s;
}
.zeitler-siblings a::after {
	content: "→";
	margin-left: auto;
	color: var(--zr-accent);
	opacity: 0;
	transform: translateX(-.4rem);
	transition: opacity .16s, transform .16s;
}
.zeitler-siblings a:hover { color: var(--zr-accent) !important; padding-left: .5rem; }
.zeitler-siblings a:hover::after { opacity: 1; transform: none; }

@media (max-width: 860px) {
	.zeitler-ask .wp-block-columns { gap: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) {
	.zeitler-siblings a { transition: none; }
}

/* ================================================== Grundlagen Inhalt */
/* Grundstil für Tabellen und den Beitragstitel. Die Rechtsgebiets-,
   Personen- und Mediathekseiten bringen eigene, genauere Regeln mit —
   diese hier greifen für alles, was im Block-Editor neu entsteht. */
.zeitler-page-title { font-family: var(--wp--preset--font-family--sans); }

.wp-block-table table { border-collapse: collapse; width: 100%; }
.wp-block-table td, .wp-block-table th {
	border: 0;
	border-bottom: 1px solid var(--zr-hair);
	padding: .7rem 1rem .7rem 0;
	vertical-align: top;
	text-align: left;
}
.wp-block-table th {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .8125rem;
	letter-spacing: .04em;
}

/* ================================================== Bewegung */
@media (prefers-reduced-motion: reduce) {
	.zeitler-hero .zeitler-label::before { animation: none; }
	.zeitler-services a, .zeitler-strands a, .wp-block-button__link { transition: none; }
	:where(.wp-site-blocks) * { scroll-behavior: auto !important; }
}

/* ================================================== Schmale Fenster */
@media (max-width: 1100px) {
	.zeitler-hero .zeitler-hero-text { padding-block: clamp(3rem, 7vw, 5rem); }
}

@media (max-width: 860px) {
	.zeitler-hero > .wp-block-columns { flex-wrap: wrap !important; }
	.zeitler-hero .zeitler-hero-figure { order: -1; flex-basis: 100% !important; }
	.zeitler-hero .zeitler-hero-text {
		flex-basis: 100% !important;
		padding-inline: var(--zr-gutter);
		padding-block: clamp(2.5rem, 7vw, 4rem) 2rem;
	}
	.zeitler-hero .zeitler-hero-text > * { max-width: none; }
	/* Punkt 10: flaches Band statt riesigem Hochformat */
	.zeitler-hero .zeitler-hero-figure img {
		min-height: 0;
		aspect-ratio: 16 / 8;
		height: auto;
	}

	.zeitler-signals .wp-block-column,
	.zeitler-signals .wp-block-column:not(:first-child) {
		padding: 1.15rem 0;
		border-left: 0;
		border-top: 1px solid var(--zr-hair);
	}
	.zeitler-signals .wp-block-column:first-child { border-top: 0; }

	.zeitler-directions .wp-block-column:first-child { padding-right: 0; }
	.zeitler-directions .wp-block-column:not(:first-child) {
		border-left: 0;
		padding-left: 0;
		border-top: 1px solid var(--zr-band-line);
	}

	/* Punkt 6: fest 3 Spalten am Schreibtisch, 2 auf schmalen Fenstern */
	.zeitler-crew { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}


/* ================================================== Block-Editor */
/* Im Editor gibt es kein Fenster in voller Breite — die Randberechnung
   des Aufmachers muss dort auf den einfachen Innenabstand zurückfallen. */
.editor-styles-wrapper .zeitler-hero .zeitler-hero-text { padding-left: var(--zr-gutter); }
.editor-styles-wrapper .zeitler-hero .zeitler-hero-figure img { min-height: 22rem; }
.editor-styles-wrapper .zeitler-call { min-height: 0; display: block; }

/* ================================================== Schlagwörter */
/* Die vier Dreiergruppen aus dem bestehenden Auftritt. Dort stehen die
   ersten beiden Wörter in der Textfarbe und das dritte im Logoton #ea5901 —
   liegt hier ohnehin schon als Olivgrau und Orange (Fläche) in der
   Palette, die Farben sind also unverändert übernommen. Die
   Anzeigeschrift des Originals (Linotype Didot) ist lizenzpflichtig
   und fehlt hier; an ihrer Stelle steht die Lesetext-Schrift Schola.
   Das dritte Wort trägt die Inline-Farbe des Block-Editors und bleibt
   damit im Editor bearbeitbar. */
.zeitler-motto {
	font-family: var(--wp--preset--font-family--serif);
	font-weight: 400;
	font-size: clamp(2.35rem, 5.1vw, 6.15rem);
	line-height: .95;
	color: var(--zr-muted);
	margin-block: 0 clamp(1.5rem, 3vw, 2.5rem);
}
.zeitler-motto-rechts { text-align: right; }

/* Auf dem dunklen Leistungsband gelten die Bandfarben — Olivgrau und
   das Signalorange stünden dort zu dunkel. */
.zeitler-band .zeitler-motto { color: var(--zr-band-muted); }
.zeitler-band .zeitler-motto .has-accent-bright-color {
	color: var(--zr-band-accent) !important;
}

/* Der eigene Abschnitt über dem Leistungsband trägt nur die erste
   Gruppe und bringt seinen Abstand selbst mit. */
.zeitler-motto-block .zeitler-motto { margin-bottom: 0; }

/* ================================================== Tätigkeitsbereiche */
/* Der Abschnitt löst das zweispaltige Leistungsband ab: vier Felder auf
   hellem Grund, englischer Strang oben, deutscher Untertitel darunter.
   Die Fachbegriffe im Fließtext führen zur jeweiligen Feldseite. */

/* Die Schlagwörter bestehen jetzt aus drei Absätzen in einer Gruppe,
   damit jede Zeile im Editor bearbeitbar bleibt und der Versatz aus dem
   Stylesheet kommt statt aus geschützten Leerzeichen. Maß in Vierteln
   der Schriftgröße, wie auf dem bestehenden Auftritt: 2 / 0 / 1,25. */
.zeitler-motto > p { margin-block: 0; }
.zeitler-motto > p:nth-child(1) { margin-left: 2em; }
.zeitler-motto > p:nth-child(2) { margin-left: 0; }
.zeitler-motto > p:nth-child(3) { margin-left: 1.25em; }
.zeitler-motto-rechts > p:nth-child(1) { margin-left: 0; margin-right: 2em; }
.zeitler-motto-rechts > p:nth-child(2) { margin-right: 0; }
.zeitler-motto-rechts > p:nth-child(3) { margin-left: 0; margin-right: 1.25em; }

/* Die Größe folgt der Rolle: Wo eine Gruppe für sich steht, bleibt sie
   groß; im Kopf eines Abschnitts tritt sie zurück. */
/* Hier stand bis zum 22.08. eine eigene Schriftgröße. Sie war spezifischer als
   `.zeitler-motto-kopf` und hat deshalb die Verkleinerung aus Schritt 44 überstimmt —
   „Rethink React Resolve" blieb als einziger Claim bei 64 px. Die Größe steht jetzt
   nur noch an den zwei vorgesehenen Stellen; hier bleibt allein der Abstand. */
/* Der Claim war am 23.08. kurz kleiner gesetzt, damit die vier Felder
   frueher beginnen. Zurueckgenommen: Alle Claims der Seite tragen dieselbe
   Groesse, und ein kleinerer faellt sofort auf. Die Groesse steht deshalb
   weiterhin nur an den zwei vorgesehenen Stellen. */
.zeitler-hell .zeitler-motto { margin-bottom: 0; }

/* Der Abschnitt beginnt dichter unter der Kopfzeile. */
.zeitler-hell { padding-top: 1rem !important; }

.zeitler-hell .zeitler-band-head {
	/* Am 23.08. gestrafft, damit die vier Felder frueher beginnen; am
	   04.09. auf Wunsch der Kanzlei noch einmal, nachdem die Claims
	   kleiner gesetzt worden sind (vorher 1,5-2,25 rem). */
	padding-bottom: clamp(1rem, 2.2vw, 1.6rem);
	border-bottom: 1px solid var(--zr-line);
}
.zeitler-hell .zeitler-band-head h2.zeitler-label { margin: 0 0 1.1rem; }
.zeitler-hell .zeitler-band-head p { max-width: 54ch; color: var(--zr-muted); }

/* Vier Felder als Zweierraster — nebeneinander wären die Begriffe zu eng */
.zeitler-directions.vier {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	gap: 0 !important;
}
.zeitler-directions.vier > .wp-block-column {
	/* Am 23.08. gestrafft: oben und unten rund 30 statt 52 Pixel; am
	   04.09. auf rund 22 (vorher 1,25-1,5 rem). Die seitliche Polsterung
	   bleibt, wie sie war - gemeint waren die Abstaende zu den Linien. */
	/* oben - seitlich - unten. Der obere Wert ist am 04.09. auf Wunsch der
	   Kanzlei vergroessert worden (rund 26 statt 18 px bei 1440), damit die
	   Ueberschrift nicht an der Trennlinie darueber klebt. Der untere Wert
	   ist absichtlich kleiner geblieben: Ueber der Linie steht der letzte
	   Schwerpunkt, darunter eine Ueberschrift - die braucht mehr Luft. */
	padding: clamp(1.25rem, 1.8vw, 1.6rem) clamp(2rem, 4vw, 3.5rem) clamp(.9rem, 1.35vw, 1.15rem);
	border-top: 1px solid var(--zr-line);
	border-left: 0;
}
.zeitler-directions.vier > .wp-block-column:nth-child(odd)  { padding-left: 0; }
.zeitler-directions.vier > .wp-block-column:nth-child(even) { border-left: 1px solid var(--zr-line); }
/* Die erste Reihe trägt keine eigene Oberlinie — dort steht schon die
   Unterkante des Abschnittskopfs. Das obere Polster bleibt aber dasselbe wie
   in der zweiten Reihe (aus der Regel darüber), damit „01" und „02" genauso
   weit unter ihrer Linie stehen wie „03" und „04". */
.zeitler-directions.vier > .wp-block-column:nth-child(-n+2) {
	border-top: 0;
}
/* Das Raster schließt unmittelbar an den Abschnittskopf an. Ohne diese Zeile
   käme sein eigener Außenabstand zum Polster der ersten Reihe hinzu — genau
   das ließ die obere Reihe tiefer sitzen. */
.zeitler-band-head + .zeitler-directions.vier {
	margin-top: 0 !important;
}
.zeitler-directions.vier .zeitler-dir-no {
	color: var(--zr-faint) !important;
	margin-bottom: .5rem;
}
.zeitler-directions.vier .zeitler-dir-no strong { color: var(--zr-accent); }
/* Die Ueberschriften der vier Felder standen bis 04.09. auf der Groesse
   "Zwischentitel" (Marke `head`, fluid 1,35-1,75 rem). Auf Wunsch der Kanzlei
   sind sie an diesem Tag zweimal kleiner gesetzt worden - zuletzt auf genau
   den Wert von `.zeitler-spaltentitel`, also die Groesse, in der auf der
   Karriereseite "Fuer Juristen" steht: 20 bis 22 Pixel.

   **Der Wert steht damit an zwei Stellen und muss zusammenbleiben.** Wer ihn
   hier aendert, aendert `.zeitler-spaltentitel` weiter unten mit - sonst
   stehen zwei Ueberschriften gleichen Rangs unterschiedlich gross, und genau
   das ist der Kanzlei aufgefallen.

   Geaendert wird die Regel und nicht die Marke `head` - die traegt auch
   Ueberschriften auf anderen Seiten, und die sollten unberuehrt bleiben.

   `!important` ist hier noetig, nicht bequem: Die Groesse haengt als Klasse
   `has-head-font-size` am Block selbst, und WordPress schreibt Preset-Klassen
   grundsaetzlich mit !important aus. Ohne den Vermerk bliebe diese Regel
   wirkungslos. */
/* Seit dem 09.09.2026 stehen die Feldueberschriften auf der zweiten Stufe;
   die dritte bleibt in der Regel stehen, damit aeltere Fassungen der Seite
   und der Block-Editor in der Vorschau gleich aussehen. */
.zeitler-directions.vier h2,
.zeitler-directions.vier h3 {
	margin: 0;
	color: var(--zr-ink);
	font-size: clamp(1.25rem, 1.6vw, 1.375rem) !important;
}

/* Der deutsche Untertitel — die Zeile mit den gesuchten Begriffen */
.zeitler-feld-sub {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 500;
	font-size: 1rem;
	line-height: 1.35;
	letter-spacing: .01em;
	color: var(--zr-ink);
	margin: .55rem 0 0;
}
.zeitler-feld-text {
	/* Lesegröße stand hier bis 23.08. (`--wp--preset--font-size--medium`,
	   17 px). Zugunsten der Übersicht — vier Felder auf einen Blick — jetzt
	   16 px mit engerem Zeilenlauf. */
	font-size: 1rem;
	line-height: 1.5;
	color: var(--zr-muted);
	margin-top: .8rem;
	max-width: 52ch;
}
/* Fachbegriffe im Fließtext. Sie standen bis 22.08. in Orange; auf
   Lesegröße zog das die Felder durchgehend ein. Auf Wunsch der Kanzlei
   tragen sie jetzt die Textfarbe und halbfett — das Gewicht zeigt, dass
   dort etwas liegt, das Orange bleibt der Schaltfläche am Feldende.
   Erst beim Zeigen färben sie sich, wie überall sonst auf der Seite. */
.zeitler-feld-text a {
	color: var(--zr-ink) !important;
	font-weight: 700;
	text-decoration: none;
	border-bottom: 0;
}
.zeitler-feld-text a:hover { color: var(--zr-signal) !important; }

/* Die Zeile am Fuss eines Feldes. Sie war bis 04.09.2026 immer ein Verweis,
   und ihr Aussehen hing deshalb an `.zeitler-feld-mehr a`. Seit die
   Bereichsseite /insolvenzrecht/ stillgelegt ist, steht sie im Feld 01 ohne
   Verweis da — als Zwischenueberschrift ueber den Schwerpunkten. Damit sie
   dort trotzdem orange bleibt (ausdruecklicher Wunsch der Kanzlei), tragen
   Schrift, Groesse, Versalien und Farbe jetzt am Absatz.
   Ein Verweis darin erbt das; die Felder 02 bis 04 sehen unveraendert aus.
   Bei `a` bleibt nur, was den Verweis vom reinen Text unterscheidet. */
.zeitler-feld-mehr {
	/* Der Abstand zur Ueberschrift darueber. Er stand bis 04.09. auf .9rem
	   (14 px) - damals folgte der Zeile noch ein Fliesstext, und sie sass
	   zwischen zwei Absaetzen. Seit die Fliesstexte weg sind, steht sie
	   unmittelbar unter der Ueberschrift und klebte dort. Auf Wunsch der
	   Kanzlei jetzt 1,5rem (24 px), in allen fuenf Feldern gleich. */
	margin-top: 1.5rem;
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	/* 12 px seit 04.09. (vorher 13). Kleiner sollte sie nicht werden: Der
	   Logoton erreicht auf dem grauen Grund 3,38:1, die Zeile lebt also von
	   ihrem Fettgewicht und den Versalien. Die Sperrung ist mit der Groesse
	   leicht zurueckgenommen, sonst laeuft die Zeile zu breit. */
	font-size: .75rem;
	letter-spacing: .11em;
	text-transform: uppercase;
	color: var(--zr-accent);
}
.zeitler-feld-mehr a {
	text-decoration: none;
	color: var(--zr-accent) !important;
}
.zeitler-feld-mehr a:hover { color: var(--zr-ink) !important; }

@media (max-width: 860px) {
	.zeitler-directions.vier { grid-template-columns: 1fr; }
	.zeitler-directions.vier > .wp-block-column {
		padding-inline: 0;
		border-left: 0 !important;
		border-top: 1px solid var(--zr-line);
	}
	.zeitler-directions.vier > .wp-block-column:first-child { border-top: 0; }
}

/* ================================================== Aufmacher, Fassung C */
/* Das Bild endet auf derselben Linie wie der Fußbereich, statt bis an den
   Bildschirmrand zu laufen. Dadurch bekommt es ein Verhältnis zum Satz. */
.zeitler-hero > .wp-block-columns { align-items: center; }
.zeitler-hero .wp-block-column.zeitler-hero-figure { padding-right: var(--zr-edge); }
.zeitler-hero .zeitler-hero-figure img {
	min-height: 0;
	aspect-ratio: 4 / 5;
	height: auto;
	object-position: center 50%;
}
@media (max-width: 860px) {
	.zeitler-hero .wp-block-column.zeitler-hero-figure { padding-right: 0; }
	.zeitler-hero .zeitler-hero-figure img { aspect-ratio: 16 / 10; }
}

/* Abschnittskopf: Kennzeichner und Schlagwoerter links, Erlaeuterung rechts.
   Wird von den Taetigkeitsbereichen und vom Team verwendet. */
.zeitler-band-head {
	/* Diese Polsterung ist der Abstand vom Claim hinunter zur Trennlinie -
	   die Linie ist die untere Kante dieses Kastens. Am 04.09.2026 auf
	   Wunsch der Kanzlei von 2,5-4 rem auf 1-1,6 rem gestrafft, also von
	   rund 64 auf rund 25 Pixel bei den ueblichen Breiten.
	   Der Wert gilt fuer alle Seiten; die Expertise-Seite ueberschreibt ihn
	   weiter unten mit demselben Mass. Wer den einen aendert, aendert bitte
	   den anderen mit. */
	padding-bottom: clamp(1rem, 2vw, 1.6rem);
	border-bottom: 1px solid var(--zr-line);
}
.zeitler-band-head h2.zeitler-label { margin: 0 0 1.1rem; }
/* Am 04.09.2026 gestrafft, zusammen mit dem Abschnittskopf der
   Expertise-Seite: der Claim rueckt naeher an die Trennlinie darunter
   (vorher 2-3 rem). Der Wert ist derselbe wie die untere Polsterung von
   `.zeitler-hell .zeitler-band-head`, damit der Claim auf allen Seiten
   gleich weit ueber der Linie steht. Wer den einen aendert, aendert bitte
   den anderen mit. */
.zeitler-kopf-luft { margin-bottom: clamp(1rem, 2vw, 1.6rem); }
/* Der erläuternde Absatz neben dem Claim steht seit dem 22.08. fett — auf
   Wunsch der Kanzlei. Schola bringt nur Regular und Bold mit, ein echtes
   Halbfett gibt es nicht; 600 bildete der Browser ohnehin auf 700 ab.
   Gefasst wird ausschließlich die zweite Spalte des Abschnittskopfs, damit
   die Schlagwörter in der ersten unberührt bleiben. */
.zeitler-band-head .wp-block-columns > .wp-block-column:last-child p {
	font-weight: 700;
}
/* Nur für Vorlesegeräte und Suchmaschinen, nicht im Bild. Seit dem 22.08.
   tragen die Bereichsseiten ihren Kennzeichner so: „Expertise", „Team" und
   „Kontakt" sind als Wort über dem Claim entfallen, bleiben aber die oberste
   Überschrift der jeweiligen Seite — sonst hätte sie gar keine. Wo man ist,
   sagt jetzt der orange Eintrag in der Kopfzeile. */
.zeitler-nur-vorlesen {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Fuehrt eine Schlagwortgruppe einen Abschnitt an, tritt sie zurueck.
   Wo sie fuer sich allein steht, bleibt sie gross. */
/* Größe seit 22.08.: Fassung „Mittel" aus `entwurf/claim-groessen.html`. Der Claim
   war mit 64 px doppelt so hoch wie das Logo (91 px gegen 182 px Blockhöhe) und
   drängte es damit an den Rand. Mit 48 px misst der Block rund 137 px — er führt
   weiterhin, dominiert aber nicht mehr. Aufmacher und Abschnittsköpfe tragen
   denselben Wert; wer einen ändert, muss den anderen mitziehen. */
.zeitler-motto-kopf { font-size: clamp(1.3rem, 2.2vw, 2.55rem); margin-bottom: 0; }
/* Zwei Saetze, die zusammengehoeren und beim Zeilenwechsel nicht
   auseinandergerissen werden sollen. Die Gruppe rueckt als Ganzes in die
   naechste Zeile, statt mitten im Satz umzubrechen.

   Bewusst kein fester Zeilenumbruch (`<br>`): Der bleibt bei jeder
   Fensterbreite gleich und wird schon bei kleinen Textaenderungen
   unpassend — genau das war am 23.08. auf der News-Seite passiert. Diese
   Gruppe passt sich dagegen an: Ist sie fuer eine Zeile zu lang, etwa auf
   dem Telefon, bricht sie innen um. */
.zeitler-zusammen { display: inline-block; }

/* Folgt auf einen Abschnittskopf gleich eine Liste mit eigener Oberlinie,
   stuenden zwei Linien untereinander. Die Liste gibt ihre ab. */
.zeitler-band-head + .zeitler-strands { border-top: 0; margin-top: 0; }
/* Seit 23.08.: Der Inhaltsbereich jeder Seite traegt den grauen Ton, Kopf-
   und Fusszeile bleiben weiss. Vorher wechselten sich weisse und graue Seiten
   ab (22.08., Schritt 12); auf Wunsch der Kanzlei sehen jetzt alle Seiten so
   aus wie zuvor die grauen.

   Die Farbe sitzt am `main`-Element und nicht am Blockmarkup der einzelnen
   Seiten — so gilt sie auch fuer Feldseiten, Personenseiten und den Blog,
   ohne dass 20 Seiten angefasst werden muessen. Abschnitte, die `base-alt`
   oder `surface` schon selbst tragen, fallen nicht auf: Es ist derselbe Ton.
   Zurueckgenommen wird es, indem diese Regel entfaellt. */
main.wp-block-group {
	background-color: var(--wp--preset--color--base-alt);
}

/* ================================================== Kopfzeile als Leiste */
/* Navigation und Logo bilden eine einzige Reihe: vier Ziele, die
   Telefonnummer und rechts das Logo. Die Zellen sind gleich breit und
   durch Haarlinien getrennt. */
.zeitler-header {
	position: sticky;
	top: 0;
	z-index: 60;
	background: var(--wp--preset--color--base);
	border-bottom: 1px solid var(--zr-line);
	padding: 0;
	backdrop-filter: none;
}
.zeitler-leiste {
	padding-inline: max(var(--zr-gutter), (100vw - 1240px) / 2);
	display: grid !important;
	grid-template-columns: 1fr auto;
	align-items: stretch;
	gap: 0 !important;
}
.zeitler-leiste .wp-block-navigation { flex: 1; }
.zeitler-leiste .wp-block-navigation__container {
	display: grid !important;
	/* Sieben Zellen seit 23.08. — Karriere ist dazugekommen.
	   Wer einen Eintrag hinzufügt oder entfernt, muss diese Zahl
	   mitziehen, sonst bricht die Leiste um. */
	grid-template-columns: repeat(7, 1fr);
	gap: 0 !important;
	height: 100%;
}
.zeitler-leiste .wp-block-navigation-item { display: flex; }
.zeitler-leiste .wp-block-navigation-item__content {
	display: flex;
	align-items: center;
	width: 100%;
	padding: 1.5rem .9rem 1.5rem 0;
	border-left: 1px solid var(--zr-line);
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 500;
	font-size: 1rem;
	letter-spacing: -.01em;
	text-transform: none;
	color: var(--zr-ink) !important;
	text-decoration: none;
}
.zeitler-leiste .wp-block-navigation-item:first-child .wp-block-navigation-item__content {
	border-left: 0;
	padding-left: 0;
}
.zeitler-leiste .wp-block-navigation-item:not(:first-child) .wp-block-navigation-item__content {
	padding-left: .9rem;
}
.zeitler-leiste .wp-block-navigation-item__content:hover { color: var(--zr-accent) !important; }
/* Der Eintrag der geöffneten Seite steht im Logoton. Damit sagt die Leiste,
   wo man ist — seit dem 22.08. trägt sie das allein, weil die Kennzeichner
   über den Claims aus dem Bild getreten sind. WordPress setzt die Klasse und
   `aria-current` nur, wenn der Eintrag ein echter Seitenverweis ist; deshalb
   sind die fünf Ziele in `parts/header.html` als `post-type` hinterlegt und
   nicht als freie Adresse. Beide Merkmale werden gefasst, damit die Färbung
   auch dann steht, wenn eines fehlt. */
.zeitler-leiste .wp-block-navigation-item.current-menu-item > a,
.zeitler-leiste .wp-block-navigation-item.current-menu-ancestor > a,
.zeitler-leiste .wp-block-navigation-item > a[aria-current="page"] {
	color: var(--zr-accent) !important;
}
.zeitler-leiste .zeitler-nav-tel a {
	border: 0;
	border-left: 1px solid var(--zr-line);
	padding: 1.5rem .9rem 1.5rem .9rem;
	letter-spacing: 0;
	/* Seit 23.08. so gross wie die E-Mail-Adresse darunter — die beiden
	   bilden einen Block, und zwei Groessen darin wirkten unruhig. Die
	   uebrigen Eintraege der Leiste bleiben bei 1rem. */
	font-size: .875rem;
	white-space: nowrap;
	color: var(--zr-accent) !important;
	font-variant-numeric: tabular-nums;
}
.zeitler-leiste .zeitler-nav-tel a:hover { color: var(--zr-ink) !important; }
/* Die E-Mail-Adresse steht seit 23.08. unter der Telefonnummer — beide in
   derselben Zelle, damit die Leiste nicht acht Spalten braucht und die
   Nummer ihren Platz behaelt. Umgesetzt ueber zwei Rasterzeilen: Alle
   uebrigen Eintraege spannen beide, Telefon sitzt in der oberen, die
   Adresse in der unteren. Ihr Polster kommt deshalb nicht mehr aus dem
   eigenen Eintrag — die Hoehe der Leiste bestimmen die uebrigen Eintraege,
   sonst waere sie doppelt so hoch geworden.
   Die Adresse ist etwas kleiner gesetzt: Sie ist mit 20 Zeichen laenger als
   die Nummer und passt sonst nicht in die Zelle. */
@media (min-width: 1101px) {
	.zeitler-leiste .wp-block-navigation__container { grid-template-rows: 1fr 1fr; }
	.zeitler-leiste .wp-block-navigation-item { grid-row: 1 / span 2; }
	/* `align-self: stretch` ist noetig, weil der Navigationsblock aus seinem
	   Flex-Layout `align-items: center` mitbringt. Ohne die Zeile stuenden die
	   beiden Eintraege je in der Mitte ihrer halben Zelle — also weit
	   auseinander statt untereinander. */
	.zeitler-leiste .zeitler-nav-tel,
	.zeitler-leiste .zeitler-nav-mail {
		align-self: stretch;   /* die Zelle fuellen ... */
		align-items: stretch;  /* ... und den Verweis darin ebenso */
	}
	.zeitler-leiste .zeitler-nav-tel { grid-row: 1; }
	.zeitler-leiste .zeitler-nav-mail { grid-row: 2; }
	/* Die beiden Zeilen stossen in der Mitte der Zelle aneinander: die Nummer
	   steht unten in der oberen Haelfte, die Adresse oben in der unteren.
	   Die Selektoren fassen `.wp-block-navigation-item__content` mit, weil die
	   Grundregel dort `align-items: center` setzt und sonst gewinnt — sie
	   fuehrt drei Klassen, zwei reichen dagegen nicht. */
	.zeitler-leiste .zeitler-nav-tel .wp-block-navigation-item__content {
		padding-block: 0 .15rem;
		align-items: flex-end;
	}
	.zeitler-leiste .zeitler-nav-mail .wp-block-navigation-item__content {
		padding-block: .15rem 0;
		align-items: flex-start;
	}
}
.zeitler-leiste .zeitler-nav-mail a {
	border: 0;
	border-left: 1px solid var(--zr-line);
	padding: 1.5rem .9rem 1.5rem .9rem;
	letter-spacing: 0;
	font-size: .875rem;
	white-space: nowrap;
	color: var(--zr-accent) !important;
}
.zeitler-leiste .zeitler-nav-mail a:hover { color: var(--zr-ink) !important; }
/* Das Logo trägt seit dem 22.08. 240 statt 190 Pixel und hat mehr Abstand zur
   Telefonnummer daneben — Fassung A + aus dem Entwurf `entwurf/schrift-fassungen.html`.
   Anlass war, dass es gegenüber den kräftigeren Schriften der Seite zu zurückhaltend
   wirkte. Gewählt wurde Präsenz über Fläche statt eine Änderung an den Schriftgewichten.
   Die Logodatei misst 359 Pixel, 240 bleiben also innerhalb ihrer Auflösung. */
.zeitler-leiste-logo {
	display: flex;
	align-items: center;
	padding: 1.1rem 0 1.1rem 2.75rem;
	border-left: 1px solid var(--zr-line);
	margin: 0;
}
.zeitler-leiste-logo img { width: 240px !important; height: auto; display: block; }

@media (max-width: 1100px) {
	/* Vier statt drei Zellen je Reihe, seit Karriere der siebte Eintrag ist:
	   bei drei stünde die Telefonnummer allein in einer dritten Reihe. */
	.zeitler-leiste .wp-block-navigation__container { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 860px) {
	.zeitler-leiste { grid-template-columns: 1fr; }
	.zeitler-leiste-logo { border-left: 0; padding-left: 0; order: -1; }
	.zeitler-leiste .wp-block-navigation__container { grid-template-columns: 1fr 1fr; }
}
/* Auf dem Telefon steht die Leiste offen, statt hinter einem Menüzeichen zu
   verschwinden — der Navigationsblock trägt dafür overlayMenu: never. Sonst
   sieht man dort nur den Aufmacher und ahnt nicht, dass es Expertise, Team
   und News gibt. Sieben Einträge, zwei je Reihe.
   Die Linien folgen dem Muster der Teilgebiete: links trennen, die erste
   Zelle jeder Reihe ohne, ab der zweiten Reihe eine Haarlinie nach oben.
   Die Selektoren fassen `> a`, damit die Telefonnummer mitgeht — sie trägt
   eine eigene Klasse und eigene Polsterung. */
@media (max-width: 600px) {
	.zeitler-leiste .wp-block-navigation-item > a {
		padding: .85rem .65rem;
		font-size: .9375rem;
	}
	.zeitler-leiste .wp-block-navigation-item:nth-child(odd) > a {
		border-left: 0;
		padding-left: 0;
	}
	.zeitler-leiste .wp-block-navigation-item:nth-child(even) > a {
		border-left: 1px solid var(--zr-line);
		padding-left: .65rem;
	}
	.zeitler-leiste .wp-block-navigation-item:nth-child(n+3) > a {
		border-top: 1px solid var(--zr-hair);
	}
	/* In einer halb so breiten Zelle darf die Nummer umbrechen. */
	.zeitler-leiste .zeitler-nav-tel a { white-space: normal; }
	.zeitler-leiste-logo { padding: .9rem 0; }
	.zeitler-leiste-logo img { width: 150px !important; }
	/* Offen misst die Leiste mit dem Logo rund 280 Pixel. Klebend nähme sie
	   auf einem Telefon mit 740 Pixeln sichtbarer Höhe über ein Drittel des
	   Bildschirms dauerhaft ein. Sie scrollt deshalb mit weg: Ihr Zweck ist
	   die Orientierung beim Ankommen, nicht der ständige Zugriff. */
	.zeitler-header { position: static; }
}

/* ================================================== Aufmacher über Eck */
/* Die Schlagwörter links oben, der Text rechts unten. Dazwischen bleibt
   Fläche — das ist der Auftritt, nicht ein Versäumnis. */
.zeitler-eck {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.25rem;
	align-items: start;
	/* Maße aus Fassung C vom 22.08.: Der erste Bereich soll bis zur
	   Schaltfläche ohne Scrollen sichtbar sein. */
	/* Der untere Abstand richtete sich bis 04.09.2026 nach der Fensterhöhe
	   (4,5vh, also 24 bis 64 Pixel). Seit dem 04.09. trägt er dasselbe Maß
	   wie die untere Polsterung von `.zeitler-band-head` — auf Wunsch der
	   Kanzlei sollen Claim und Trennlinie auf allen Seiten gleich weit
	   auseinanderstehen. Dem alten Zweck, den ersten Bereich ohne Scrollen
	   zu zeigen, steht das nicht entgegen: Der Wert ist kleiner als vorher. */
	padding: 2rem max(var(--zr-gutter), (100vw - 1240px) / 2) clamp(1rem, 2vw, 1.6rem);
}
.zeitler-eck-claim {
	grid-column: 1;
	grid-row: 1;
	margin: 0 !important;
	max-width: none;
	white-space: pre-wrap;
}
/* Der Textblock sitzt rechts unten, der Satz selbst bleibt linksbündig —
   rechtsbündiger Fließtext liest sich schlecht. */
.zeitler-eck .wp-block-buttons { display: flex; gap: .75rem; flex-wrap: wrap; }

@media (max-width: 900px) {
	.zeitler-eck { grid-template-columns: 1fr; gap: 2.5rem; }
	.zeitler-eck-claim { grid-column: 1; grid-row: 1; }
	/* Die Zeile der Rechtsgebiete wird weiter unten umgestellt — dort, wo die
	   Regel steht, die sie in Spalte 2 setzt. Siehe „Rechtsgebiete einspaltig". */
}


/* ================================================== Beratungsansatz */
/* Eine ruhige Fläche zwischen Aufmacher und Expertise. Seit 22.08. ohne
   Kennzeichner: der Text läuft über die volle Breite, die Schaltfläche
   steht rechts daneben statt darunter — das hält den Abschnitt flach,
   auch wenn der Text noch länger wird. */
/* Auf der Startseite gehoert die Trennlinie unter dem Claim zu diesem Block
   und nicht zum Aufmacher darueber. Der Blockabstand des Editors zwischen
   beiden schob sie rund 19 Pixel nach unten - der Claim stand damit weiter
   von der Linie entfernt als auf allen anderen Seiten. Seit 04.09.2026 auf 0;
   den Abstand ueber der Linie bestimmt allein die untere Polsterung des
   Aufmachers, wie ueberall sonst die des Abschnittskopfs. */
.zeitler-eck + .zeitler-ansatz { margin-top: 0; }

.zeitler-ansatz {
	/* Die Linie läuft nur über den Satzspiegel, nicht über die ganze Seite —
	   wie die Linie unter „Rethink React Resolve". Als Hintergrundstreifen
	   gezeichnet, weil ein border über die volle Breite des Abschnitts ginge. */
	background-image: linear-gradient(var(--zr-line), var(--zr-line));
	background-size: min(1240px, calc(100% - 2 * var(--zr-gutter))) 1px;
	background-position: top center;
	background-repeat: no-repeat;
	padding: clamp(1.5rem, 4.5vh, 4rem) max(var(--zr-gutter), (100vw - 1240px) / 2) 2rem;
	display: grid;
	grid-template-columns: 1fr auto;
	/* Nur zwischen den Spalten Abstand — zwischen Vorspann und
	   Beratungsansatz-Text regelt ihn der Absatz selbst. */
	column-gap: clamp(2rem, 4vw, 3.5rem);
	row-gap: 0;
	align-items: start;
}
.zeitler-ansatz h2.zeitler-label { margin: .5rem 0 0; }
/* Die Schaltfläche schließt den ersten Bereich ab. Sie steht unter dem
   Text, nicht unter dem Kennzeichner — deshalb ausdrücklich in Spalte 2. */
.zeitler-ansatz .wp-block-buttons {
	grid-column: 2;
	/* über beide Zeilen, unten ausgerichtet: die Unterkante der Schaltfläche
	   liegt damit auf der Grundlinie des letzten Satzes. 'span 2' statt
	   '1 / -1', weil sich -1 auf das explizite Raster bezieht — und das hat
	   hier keine definierten Zeilen. */
	grid-row: 1 / span 2;
	align-self: end;
	margin-top: 0;
}
.zeitler-ansatz .wp-block-button__link { white-space: nowrap; }
/* Der Vorspann steht seit 22.08. hier statt im Aufmacher — über dem
   Beratungsansatz. Beide Absätze teilen sich die erste Spalte, die
   Schaltfläche bleibt rechts daneben. */
.zeitler-ansatz-vorspann {
	grid-column: 1;
	grid-row: 1;
	font-size: clamp(1.125rem, 1.5vw, 1.3125rem);
	line-height: 1.55;
	color: var(--zr-ink);
	margin: 0 0 1.1rem;
	max-width: 60ch;
}
.zeitler-ansatz-text {
	grid-column: 1;
	grid-row: 2;
	font-size: 1rem;
	line-height: 1.6;
	color: var(--zr-ink);
	margin: 0;
}
@media (max-width: 860px) {
	.zeitler-ansatz { grid-template-columns: 1fr; gap: 1rem; }
	.zeitler-ansatz .wp-block-buttons { grid-column: 1; }
}

/* Rechtsgebiete unter den Schlagwörtern. Überschrift und Zeile sitzen in
   einer gemeinsamen Gruppe, damit beide dieselbe Rasterzelle belegen. */
.zeitler-eck-claimblock { grid-column: 1; grid-row: 1; }
.zeitler-eck-claimblock .zeitler-label { margin: 0 0 1.1rem; }
.zeitler-eck-claimblock .zeitler-eck-claim { margin: 0 !important; }
/* Der Aufmacher trägt die Gruppe kleiner als früher — sonst passt der erste
   Bereich nicht auf einen Bildschirm. Die Abschnittsköpfe bleiben unberührt,
   sie hängen an .zeitler-motto-kopf. */
/* Dieselbe Größe wie die Schlagwörter der übrigen Abschnitte
   (.zeitler-motto-kopf) — vorher war der Aufmacher bei 1920 px mit 56 px
   kleiner als die anderen mit 64 px. */
.zeitler-eck .zeitler-motto { font-size: clamp(1.3rem, 2.2vw, 2.55rem); margin-bottom: 1rem; }
/* Ohne Begrenzung nutzt die Zeile die ganze Spalte und kommt mit drei
   statt fünf Zeilen aus — ausdrücklicher Wunsch: kein hoher Block. */
.zeitler-eck .zeitler-eck-felder { margin: 0; max-width: none; }
/* Die Zeile sitzt seit 22.08. in der zweiten Spalte auf Höhe der
   Schlagwörter — dieselbe Anordnung wie der erläuternde Absatz in den
   Köpfen von Expertise, Team, Mediathek und Kontakt. Sie steht auf der
   Grundlinie der Schlagwörter, deshalb align-self: end. */
.zeitler-eck-felder {
	grid-column: 2;
	grid-row: 1;
	align-self: end;
	font-family: var(--wp--preset--font-family--sans);
	/* Fett seit dem 22.08., wie die erläuternden Absätze neben den Claims der
	   übrigen Seiten. Jost liegt in 400, 500 und 700 vor. */
	font-weight: 700;
	font-size: var(--wp--preset--font-size--medium);
	letter-spacing: .01em;
	line-height: 1.5;
	color: var(--zr-muted);
	margin: 1.5rem 0 0;
	max-width: 46ch;
}
/* Rechtsgebiete einspaltig — unter die Schlagwörter statt daneben.
   Diese Regeln müssen NACH den beiden Blöcken darüber stehen: Media Queries
   erhöhen die Spezifität nicht, bei gleichem Gewicht gewinnt die spätere
   Regel. Standen sie weiter oben, blieb `grid-column: 2` in Kraft, obwohl das
   Raster einspaltig ist — CSS-Grid legte dafür eine implizite zweite Spalte
   außerhalb des Satzspiegels an, und die Seite lief auf schmalen Fenstern
   waagrecht über. Aus demselben Grund trägt der Selektor zwei Klassen: sonst
   verliert er gegen `.zeitler-eck .zeitler-eck-felder` weiter oben. */
@media (max-width: 900px) {
	.zeitler-eck .zeitler-eck-felder {
		grid-column: 1;
		grid-row: 2;
		align-self: start;
		margin: 1rem 0 0;
	}
}

/* ================================================== Kontaktformular */
/* Liegt in einem <dialog>, das der Browser selbst öffnet und schließt.
   Gestaltet wie der Kontakt-Abschnitt: Kennzeichner, Überschrift, dann
   die Felder auf dem hellen Grund. */
.zeitler-dialog {
	width: min(46rem, calc(100vw - 2 * var(--zr-gutter)));
	max-height: calc(100vh - 4rem);
	padding: clamp(1.75rem, 4vw, 3rem);
	border: 0;
	background: var(--wp--preset--color--base);
	color: var(--zr-ink);
	box-shadow: 0 1.5rem 4rem rgba(38, 40, 31, .22);
}
.zeitler-dialog::backdrop {
	background: rgba(38, 40, 31, .55);
	backdrop-filter: blur(2px);
}
.zeitler-dialog h2 {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 500;
	font-size: clamp(1.5rem, 3vw, 2.125rem);
	line-height: 1.1;
	letter-spacing: -.02em;
	margin: 0 0 1.5rem;
}
.zeitler-dialog .zeitler-label { margin: 0 0 .7rem; }

/* Schließkreuz oben rechts */
.zeitler-dialog-schliessen { position: absolute; top: .6rem; right: .6rem; margin: 0; }
.zeitler-dialog-schliessen button {
	background: none;
	border: 0;
	padding: .35rem .6rem;
	font-size: 1.6rem;
	line-height: 1;
	color: var(--zr-muted);
	cursor: pointer;
}
.zeitler-dialog-schliessen button:hover { color: var(--zr-accent); }

/* Meldung nach dem Absenden */
.zeitler-dialog-meldung {
	font-size: 1rem;
	line-height: 1.55;
	padding: .9rem 1.1rem;
	margin: 0 0 1.5rem;
	border-left: 3px solid var(--zr-accent);
	background: var(--wp--preset--color--base-alt);
}
.zeitler-dialog-meldung.ist-fehler { border-left-color: #a8322a; }

/* Felder */
.zeitler-formular { margin: 0; }
.zeitler-turnstile { margin: 0 0 1.1rem; min-height: 65px; }
.zeitler-formular-raster {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 1.25rem;
}
@media (max-width: 34rem) {
	.zeitler-formular-raster { grid-template-columns: 1fr; }
}
.zeitler-feld-paar { display: block; margin: 0 0 1.1rem; }
.zeitler-feld-paar label {
	display: block;
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 500;
	font-size: .8125rem;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--zr-muted);
	margin-bottom: .35rem;
}
.zeitler-feld-paar .zeitler-optional { text-transform: none; letter-spacing: .02em; opacity: .8; }
.zeitler-formular input[type="text"],
.zeitler-formular input[type="email"],
.zeitler-formular input[type="tel"],
.zeitler-formular textarea {
	width: 100%;
	padding: .7rem .85rem;
	border: 1px solid var(--zr-line);
	border-radius: 0;
	background: var(--wp--preset--color--surface);
	font-family: var(--wp--preset--font-family--serif);
	font-size: 1rem;
	line-height: 1.5;
	color: var(--zr-ink);
}
.zeitler-formular textarea { resize: vertical; min-height: 7rem; }
.zeitler-formular input:focus-visible,
.zeitler-formular textarea:focus-visible {
	outline: 2px solid var(--zr-accent);
	outline-offset: 1px;
	border-color: transparent;
}

/* Das Feld für die Maschinen bleibt unsichtbar, aber im Fluss des
   Formulars — ausgeblendete Felder werden von manchen erkannt.
   Die Regel zielt auf die Klasse, nicht auf aria-hidden: sonst
   verschwänden auch die Sternchen an den Pflichtfeldern. */
.zeitler-formular .zeitler-falle {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.zeitler-einwilligung {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: .7rem;
	align-items: start;
	margin: 0 0 1.6rem;
	font-size: .9375rem;
	line-height: 1.5;
	color: var(--zr-muted);
}
.zeitler-einwilligung input { margin-top: .2rem; accent-color: var(--zr-accent); }
.zeitler-einwilligung a { color: var(--zr-accent) !important; }

.zeitler-formular-fuss {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .9rem 1.4rem;
	margin: 0;
}
.zeitler-formular-senden {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .8125rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	padding: .95rem 1.6rem;
	border: 0;
	border-radius: 0;
	background: var(--zr-accent);
	color: var(--zr-on-accent);
	cursor: pointer;
}
.zeitler-formular-senden:hover { background: var(--zr-ink); }
.zeitler-pflicht { font-size: .8125rem; color: var(--zr-muted); }

/* --- Rückfall, wenn im Browser kein JavaScript läuft ---------------------
   Dann öffnet das Skript das Fenster nicht. Der Verweis springt aber auf
   die Kennung, und darüber lässt es sich allein mit CSS zeigen.
   `:not([open])` sorgt dafür, dass sich beide Wege nie in die Quere
   kommen: Sobald das Skript das Fenster öffnet, trägt es [open] und
   diese Regeln greifen nicht mehr.
   Die Abdunklung entsteht über einen Schatten, der über den ganzen
   Bildschirm reicht — ::backdrop gibt es nur beim echten Dialog. */
.zeitler-dialog:target:not([open]) {
	display: block;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
	overflow: auto;
	box-shadow: 0 0 0 100vmax rgba(38, 40, 31, .55), 0 1.5rem 4rem rgba(38, 40, 31, .22);
}
/* Das Kreuz des echten Dialogs schließt nur diesen; ohne Skript braucht es
   den Verweis, der das Sprungziel aufhebt. Jeder ist nur in seiner Lage da. */
.zeitler-dialog-zurueck { display: none; }
.zeitler-dialog:target:not([open]) .zeitler-dialog-schliessen { display: none; }
.zeitler-dialog:target:not([open]) .zeitler-dialog-zurueck {
	display: block;
	position: absolute;
	top: .6rem;
	right: .95rem;
	font-size: 1.6rem;
	line-height: 1;
	color: var(--zr-muted) !important;
	text-decoration: none;
}
.zeitler-dialog:target:not([open]) .zeitler-dialog-zurueck:hover { color: var(--zr-accent) !important; }


/* ================================================== Teilgebiete einer Feldseite */
/* Die Felder unter dem Fließtext. Die Trennlinien sitzen links, die erste
   entfällt — dasselbe Muster wie bei den vier Feldern der Startseite. */
/* Traegt der Abschnitt einen Kennzeichner — auf der Feldseite 203
   „Schwerpunkte unserer Leistungen" —, braucht er Abstand zum Raster;
   sonst klebt er an der ersten Ueberschrift. */
.zeitler-teilgebiete .zeitler-label {
	margin: 0 0 clamp(1.5rem, 3vw, 2.25rem);
	color: var(--zr-accent);
	/* Groesser als die uebrigen Kennzeichner (11 px): Diese Zeile fuehrt
	   einen eigenen Abschnitt an und soll auffallen. Die Sperrung ist dafuer
	   etwas zurueckgenommen, sonst wird die Zeile zu breit. */
	font-size: 1rem;
	letter-spacing: .12em;
}
/* Die Schwerpunkte sind Verweise, auch solange sie noch kein Ziel haben —
   die Texte dazu kommen noch. Sie tragen die Textfarbe und faerben sich beim
   Zeigen, wie Verweise sonst auch. */
.zeitler-teilgebiet-titel a {
	color: inherit !important;
	text-decoration: none;
}
.zeitler-teilgebiet-titel a:hover { color: var(--zr-accent) !important; }

/* Eine Feldseite, deren Kopf unmittelbar in die Schwerpunkte uebergeht,
   braucht dazwischen weniger Luft: Kopf und Raster bringen beide ihr eigenes
   Polster mit. Die Klasse steht am Kopf der Seite 203. */
.zeitler-topic.zeitler-topic-eng { padding-bottom: clamp(1.25rem, 2.5vw, 2rem) !important; }
.zeitler-topic-eng + .zeitler-teilgebiete { padding-top: clamp(1.5rem, 3vw, 2.25rem) !important; }

/* Die Linie ueber den Schwerpunkten laeuft nur ueber den Satzspiegel, nicht
   ueber die ganze Seite: Sie trennt Inhalt von Inhalt. Ueber die volle Breite
   laufen allein die Kanten der beiden Baender — Kopfzeile und Fusszeile
   (Regel vom 23.08.: Baender ganz, Inhalt im Satzspiegel).
   Ein `border` zieht sich immer ueber das ganze Element, und der Abschnitt
   ist `alignfull`. Deshalb derselbe Hintergrundstreifen wie beim
   Beratungsansatz: 1 Pixel hoch, so breit wie der Satzspiegel, oben mittig.
   Gilt ebenso fuer die Teilgebiete auf Seite 204. */
.zeitler-teilgebiete {
	background-image: linear-gradient(var(--zr-line), var(--zr-line));
	background-size: min(1240px, calc(100% - 2 * var(--zr-gutter))) 1px;
	background-position: top center;
	background-repeat: no-repeat;
}
.zeitler-teilgebiete-raster {
	display: grid !important;
	/* Zwei je Reihe: bei 1240 px Satzspiegel misst eine Spalte rund 620 px,
	   der Text läuft mit etwa 70 Zeichen je Zeile. Bei drei Spalten waren es
	   45 — lesbar, aber die Felder ohne Text rissen große Lücken auf. */
	grid-template-columns: repeat(2, 1fr);
	gap: 0 !important;
	margin-block: 0 !important;
}
.zeitler-teilgebiete-raster > .wp-block-column {
	padding: .35rem clamp(1rem, 2vw, 1.75rem);
	border-left: 1px solid var(--zr-line);
	min-width: 0;
}
/* Die erste Spalte jeder Reihe trägt keine linke Linie. */
.zeitler-teilgebiete-raster > .wp-block-column:nth-child(2n+1) {
	border-left: 0;
	padding-left: 0;
}
/* Ab der zweiten Reihe trennt eine Linie nach oben. Sie sitzt nicht an den
   Zellen, sondern als Strich an der ersten Zelle der Reihe: Die letzte Reihe
   ist bei ungerader Anzahl nur zum Teil gefüllt — an den Zellen endete die
   Linie sonst mitten im Raster. 200 % entspricht der Breite beider Spalten. */
.zeitler-teilgebiete-raster > .wp-block-column:nth-child(n+3) {
	margin-top: clamp(1.5rem, 3vw, 2.25rem);
	padding-top: clamp(1.5rem, 3vw, 2.25rem);
}
.zeitler-teilgebiete-raster > .wp-block-column:nth-child(2n+1):nth-child(n+3) {
	position: relative;
}
.zeitler-teilgebiete-raster > .wp-block-column:nth-child(2n+1):nth-child(n+3)::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 200%;
	border-top: 1px solid var(--zr-line);
}
.zeitler-teilgebiet-titel {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 500;
	font-size: 1.0625rem;
	line-height: 1.3;
	letter-spacing: -.005em;
	color: var(--zr-ink);
	margin: 0;
	hyphens: auto;
}
/* Ein Schwerpunkt, zu dem es Text gibt, klappt auf: Die Ueberschrift ist
   zugleich die Klappe (`<details>`/`<summary>`, der Details-Block des Cores).
   Das kommt ohne eine Zeile JavaScript aus — der Browser kann das selbst,
   auch mit abgeschaltetem Skript.
   Die Klappe sieht aus wie die uebrigen Schwerpunkte; rechts steht ein
   Zeichen im Logoton, das zwischen + und – wechselt. */
.zeitler-teilgebiet-klapp { margin: 0; }
.zeitler-teilgebiet-klapp > summary {
	display: flex;
	align-items: baseline;
	gap: .75rem;
	cursor: pointer;
	list-style: none;
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 500;
	font-size: 1.0625rem;
	line-height: 1.3;
	letter-spacing: -.005em;
	color: var(--zr-ink);
	hyphens: auto;
}
/* Das Dreieck, das der Browser von sich aus setzt, faellt weg. */
.zeitler-teilgebiet-klapp > summary::marker,
.zeitler-teilgebiet-klapp > summary::-webkit-details-marker { content: ""; display: none; }
.zeitler-teilgebiet-klapp > summary::after {
	content: "+";
	margin-left: auto;
	color: var(--zr-accent);
}
.zeitler-teilgebiet-klapp[open] > summary::after { content: "–"; }
.zeitler-teilgebiet-klapp > summary:hover { color: var(--zr-accent); }
.zeitler-teilgebiet-klapp > summary:focus-visible {
	outline: 2px solid var(--zr-accent);
	outline-offset: 3px;
}
.zeitler-teilgebiet-klapp > .zeitler-teilgebiet-text:first-of-type { margin-top: .9rem; }

/* Dieselbe Klappe im Werdegang-Bereich der Personenseiten — dort steht sie
   zwischen Eintraegen in der Lesetextschrift, die Beschriftung passt sich
   deshalb an: Serifenschrift, Lesegroesse, kein eigener Vorlauf. Das Plus
   rechts und das Verhalten kommen unveraendert aus der Grundfassung.
   Wunsch der Kanzlei vom 24.08. */
.zeitler-vita .zeitler-vita-klapp > summary {
	font-family: var(--wp--preset--font-family--serif);
	font-weight: 400;
	font-size: .9375rem;
	line-height: 1.5;
	letter-spacing: 0;
}
.zeitler-vita .zeitler-vita-klapp > .wp-block-list { margin-top: .6rem; }

.zeitler-teilgebiet-text {
	font-size: .9375rem;
	line-height: 1.6;
	color: var(--zr-muted);
	margin: .8rem 0 0;
	/* In schmalen Spalten trennen — die Vorlage bringt dafür bereits
	   bedingte Trennstriche mit, hyphens: auto ergänzt den Rest. */
	hyphens: auto;
}
/* Aufzählung innerhalb eines Teilgebiets, für Beispiele, die als Gruppe
   gelesen werden sollen. Ohne Punkt, mit Gedankenstrich in der Textfarbe —
   dasselbe zurückhaltende Mittel wie die Trennpunkte in der Zeile der
   Rechtsgebiete. Der Einzug hängt, mehrzeilige Beispiele stehen also unter
   sich und nicht unter dem Strich. */
.zeitler-teilgebiet-liste {
	list-style: none;
	font-size: .9375rem;
	line-height: 1.6;
	color: var(--zr-muted);
	margin: .8rem 0 0;
	padding: 0;
	hyphens: auto;
}
.zeitler-teilgebiet-liste li {
	position: relative;
	padding-left: 1.05rem;
	margin-top: .5rem;
}
.zeitler-teilgebiet-liste li:first-child { margin-top: 0; }
.zeitler-teilgebiet-liste li::before {
	content: "–";
	position: absolute;
	left: 0;
	top: 0;
}
/* Sobald eine Spalte Text trägt, stehen alle auf gleicher Oberkante. */
.zeitler-teilgebiete-raster > .wp-block-column { align-self: start; }
/* Einspaltige Fassung des Rasters: die Eintraege stehen untereinander statt
   nebeneinander, jeder mit eigener Oberlinie. Gebraucht auf der Karriere-Seite,
   wo die Klappen ueber die volle Breite laufen sollen — die Texte sind laenger
   als die kurzen Schwerpunkte der Feldseiten. Dieselben Angaben, die das Raster
   unterhalb von 620 px ohnehin schon traegt; hier gelten sie bei jeder Breite.
   Zwei Klassen schlagen die eine der Grundfassung. Wunsch der Kanzlei vom 24.08. */
.zeitler-teilgebiete-raster.einspaltig { grid-template-columns: 1fr; }

/* ---------- Karriere: zwei Spalten ----------------------------------------
   Die Seite teilt sich in "Fuer Juristen" und "Fuer den Assistenzbereich".
   Getragen wird die Teilung vom vorhandenen Teilgebiete-Raster (senkrechte
   Trennlinie, unterhalb von 620 px untereinander). Die Gruppe traegt bewusst
   NICHT die Klasse zeitler-teilgebiete: deren Oberlinie staende unmittelbar
   unter der Linie des Seitenkopfes — zwei Striche fast aufeinander. */
/* Die senkrechte Trennlinie zwischen den beiden Spalten soll ueber die ganze
   Hoehe laufen. Die Grundfassung des Rasters setzt `align-self: start`, damit
   Zellen unterschiedlicher Laenge oben buendig stehen — die Zelle ist dann nur
   so hoch wie ihr Inhalt, und ihre linke Linie endet mit ihm. Solange die
   rechte Spalte fast leer ist, war die Linie deshalb nur ein kurzer Strich.
   `stretch` fuellt die Zelle auf die Reihenhoehe; der Inhalt beginnt trotzdem
   oben. Der Selektor fasst ueber `>` nur das aeussere Raster — die einspaltigen
   Klappenlisten darin bleiben unberuehrt. Wunsch der Kanzlei vom 24.08. */
/* Die beiden Kennzeichner der Karriere-Seite tragen dasselbe Format wie die
   Verweise am Fuss der Expertise-Felder ("ZUM INSOLVENZRECHT →") — Jost 700,
   13 px, Sperrung .12em, Versalien, Logoton. Sie stehen damit eine Stufe
   kleiner als die Kennzeichner der Feldseiten (16 px). Wunsch der Kanzlei vom
   24.08.; Schriftart, Gewicht, Sperrung und Versalien bringt die Grundregel
   .zeitler-label schon mit. */
.zeitler-spalten .zeitler-label {
	margin: 0 0 clamp(1.5rem, 3vw, 2.25rem);
	color: var(--zr-accent);
	font-size: .8125rem;
	letter-spacing: .12em;
}

/* Enger gesetzt auf Wunsch der Kanzlei vom 24.08.: Der Kennzeichner steht
   dicht ueber dem, was er anfuehrt, und die Klappen stehen dichter
   beieinander. */
.zeitler-spalten .zeitler-label { margin-bottom: 1rem; }
.zeitler-spalten .zeitler-topic-lead { margin-top: 1rem; }
/* Nur der Abstand zwischen Kennzeichner und Klappenliste — der Abstand
   zwischen dem Einleitungstext und der ersten Klappe bleibt grosszuegig. */
.zeitler-spalten .zeitler-label + .zeitler-teilgebiete-raster {
	margin-top: 1rem !important;
}
.zeitler-spalten .zeitler-teilgebiete-raster.einspaltig > .wp-block-column {
	margin-top: .55rem;
	padding-top: .55rem;
	/* Ohne Striche zwischen den Klappen — Wunsch der Kanzlei vom 24.08. Die
	   Klappen trennt allein der Abstand. Erhalten bleiben die beiden Linien,
	   die den Abschnitt gliedern: der Strich ueber "Was Sie bei uns erwartet",
	   der ueber beide Spalten laeuft, und die senkrechte Linie zwischen den
	   Spalten. */
	border-top: 0;
}

.zeitler-spalten > .zeitler-teilgebiete-raster > .wp-block-column {
	align-self: stretch;
}

.zeitler-spaltentitel {
	/* Am 24.08. auf Wunsch der Kanzlei enger gesetzt: Der Titel steht
	   dicht ueber dem, was er benennt. */
	margin: 0 0 clamp(.75rem, 1.6vw, 1.25rem);
	/* Und eine Stufe kleiner als die Voreinstellung "Zwischentitel" (28 px):
	   22 px bei den ueblichen Breiten. !important, weil die Klasse
	   has-head-font-size ihren Wert ebenso setzt. */
	font-size: clamp(1.25rem, 1.6vw, 1.375rem) !important;
}
/* Das Raster setzt margin-block auf 0; fuer die Blocke innerhalb einer Spalte
   wird der Abstand deshalb hier gesetzt — und mit !important, sonst verliert
   er gegen ebendiese Angabe. */
.zeitler-spalten .zeitler-teilgebiete-raster {
	margin-top: clamp(1.75rem, 3.5vw, 2.5rem) !important;
}
.zeitler-teilgebiete-raster.einspaltig > .wp-block-column {
	border-left: 0 !important;
	padding-left: 0 !important;
	border-top: 1px solid var(--zr-line);
	margin-top: 1.4rem;
	padding-top: 1.4rem;
}
.zeitler-teilgebiete-raster.einspaltig > .wp-block-column:first-child {
	border-top: 0;
	margin-top: 0;
	padding-top: 0;
}
/* Der Strich ueber zwei Spalten wird einspaltig nicht gebraucht. Der Selektor
   muss die beiden nth-child der Grundfassung mitfuehren, sonst verliert er:
   `:nth-child(2n+1):nth-child(n+3)` wiegt schwerer als eine zweite Klasse. */
.zeitler-teilgebiete-raster.einspaltig > .wp-block-column:nth-child(2n+1):nth-child(n+3)::before {
	content: none;
}
/* Der Zwischenschritt bei 900 px ist entfallen: Das Raster steht schon auf
   dem breiten Bildschirm zweispaltig und bleibt es bis 620 px. */
@media (max-width: 620px) {
	.zeitler-teilgebiete-raster { grid-template-columns: 1fr; }
	.zeitler-teilgebiete-raster > .wp-block-column {
		border-left: 0 !important;
		padding-left: 0 !important;
		border-top: 1px solid var(--zr-line);
		margin-top: 1.4rem;
		padding-top: 1.4rem;
	}
	.zeitler-teilgebiete-raster > .wp-block-column:first-child {
		border-top: 0;
		margin-top: 0;
		padding-top: 0;
	}
	/* Einspaltig trägt jede Zelle ihre eigene Oberlinie — der Strich über
	   zwei Spalten wird nicht mehr gebraucht. */
	.zeitler-teilgebiete-raster > .wp-block-column:nth-child(2n+1):nth-child(n+3)::before {
		content: none;
	}
}

/* ================================================== Schwerpunkte im Feld

   Seit 04.09.2026, auf Wunsch der Kanzlei: Feld 01 der Expertise-Seite nennt
   die vier Schwerpunkte des Insolvenzrechts mit ihren aufklappbaren Texten.
   Sie stammen von der Bereichsseite /insolvenzrecht/, die noch am selben Tag
   stillgelegt worden ist — seither ist das Feld die einzige Stelle, an der
   diese Texte stehen.

   Dafür werden die Klassen der Bereichsseiten unverändert weiterverwendet
   (.zeitler-teilgebiet-klapp und .zeitler-teilgebiet-text, weiter oben in
   dieser Datei): gleiche Beschriftung, dasselbe Zeichen rechts, das zwischen
   + und – wechselt, dasselbe Verhalten ohne eine Zeile JavaScript. Wer dort
   etwas ändert, ändert es hier mit — das ist beabsichtigt, die beiden Stellen
   sollen sich nicht auseinanderentwickeln.

   Nötig ist hier nur, was die Bereichsseiten vom Raster bekommen und das Feld
   nicht: Dort steht jeder Schwerpunkt in einer eigenen Rasterspalte, der
   Abstand kommt von dort. Im Feld stehen die vier
   untereinander und bräuchten sonst keinen Abstand — sie klebten aneinander,
   und im aufgeklappten Zustand wäre nicht zu sehen, wo der eine Text endet
   und der nächste Titel beginnt. Die Haarlinie leistet dasselbe wie die
   Trennlinien des Rasters. */

.zeitler-feld-klapps {
	margin-top: .9rem;
	max-width: 52ch;
}
.zeitler-feld-klapps .zeitler-teilgebiet-klapp,
.zeitler-feld-klapps .zeitler-teilgebiet-titel {
	padding: .65rem 0;
	border-top: 1px solid var(--zr-hair);
}
.zeitler-feld-klapps > :last-child {
	border-bottom: 1px solid var(--zr-hair);
}
/* Ein Schwerpunkt ohne hinterlegten Text steht in derselben Reihe wie die
   aufklappbaren, nur ohne das Plus rechts — es gaebe nichts zu oeffnen. Auf
   /nachfolge-familienrecht/ sind alle fuenf von dieser Art. Der Titel traegt
   dort ein <h2>; im Feld steht er als Absatz, damit die Gliederung der
   Expertise-Seite (H1, dann vier H3) unangetastet bleibt. */
.zeitler-feld-klapps .zeitler-teilgebiet-titel {
	margin: 0;
	font-size: 1rem;
}

/* Im Feld steht die Klappe neben dem Fließtext und nicht als eigener
   Abschnitt der Seite. Sie tritt deshalb eine Spur zurück — dasselbe Mittel
   wie im Werdegang der Personenseiten, wo dieselbe Klappe schon einmal an
   ihre Umgebung angepasst worden ist. */
.zeitler-feld-klapps .zeitler-teilgebiet-klapp > summary {
	font-size: 1rem;
}
.zeitler-feld-klapps .zeitler-teilgebiet-text {
	font-size: .9375rem;
}

/* Am 04.09.2026 sind alle Claims um 15 Prozent verkleinert worden, auf
   Wunsch der Kanzlei. Geaendert wurden die drei Stellen oben - die grosse
   Groesse in `.zeitler-motto`, die kleinere in `.zeitler-motto-kopf` und
   dieselbe im Aufmacher `.zeitler-eck`. Alle drei um denselben Anteil,
   damit das Verhaeltnis der Claims zueinander bleibt:
     gross   7,25 rem -> 6,15 rem   (bei schmalem Fenster 2,75 -> 2,35)
     im Kopf 3,00 rem -> 2,55 rem   (bei schmalem Fenster 1,50 -> 1,30)
   Wer sie erneut aendert, aendert bitte wieder alle drei. */



/* ============================== Fuenftes Feld auf der Expertise-Seite */
/* Seit dem 04.09. traegt `/expertise/` fuenf Felder statt vier. Das Raster
   selbst kam damit von allein zurecht - es steht auf zwei Spalten und ordnet
   sich neu. Nur die Linie ueber der letzten Reihe stimmte nicht mehr: Sie
   haengt an der einzelnen Spalte und reichte deshalb nur ueber die linke
   Haelfte, waehrend sie in den Reihen darueber durchlaeuft.

   Gezeichnet wird sie deshalb als Hintergrundstreifen ueber die doppelte
   Spaltenbreite - dasselbe Mittel wie am 22.08. bei den Teilgebieten der
   Feldseiten und am selben Tag bei den Trennlinien im Satzspiegel.

   Die Regel greift nur, wenn das letzte Feld allein in seiner Reihe steht
   (ungerade Anzahl). Bei sechs Feldern faellt sie von selbst weg.

   Der Abschnitt steht am Dateiende. Weil unter Regeln gleicher Staerke die
   spaetere gewinnt, ist die Fassung fuer schmale Fenster hier zu WIEDERHOLEN -
   sonst schlaegt sie die 860er-Regel von weiter oben. */
/* ACHTUNG, gelernt am 04.09.: Ein Hintergrundstreifen taugt hier NICHT.
   Er war der erste Versuch (`background-size: 200% 1px`), und er wirkte
   nicht - ein Hintergrund wird am Rand des Elements abgeschnitten und kann
   nicht darueber hinausreichen, gleich wie breit er gerechnet ist. Wo eine
   Linie ueber die eigene Box hinauslaufen soll, braucht es ein absolut
   gesetztes ::before, wie hier. */
.zeitler-directions.vier > .wp-block-column:nth-child(odd):last-child {
	position: relative;
	border-top: 0;
}
.zeitler-directions.vier > .wp-block-column:nth-child(odd):last-child::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 200%;
	height: 1px;
	background: var(--zr-line);
}
@media (max-width: 860px) {
	/* Einspaltig steht jedes Feld ohnehin allein - dort gilt wieder die
	   gewoehnliche Oberlinie, und der Strich darf nicht ueber den Rand. */
	.zeitler-directions.vier > .wp-block-column:nth-child(odd):last-child::before {
		display: none;
	}
	.zeitler-directions.vier > .wp-block-column:nth-child(odd):last-child {
		border-top: 1px solid var(--zr-line);
	}
}

/* Der senkrechte Trennstrich in der Mitte hing bisher als `border-left` an den
   Feldern der rechten Spalte. In der letzten Reihe steht aber nur ein Feld,
   links - der Strich endete deshalb ueber ihr. Auf Wunsch der Kanzlei laeuft
   er jetzt bis ganz nach unten: Das allein stehende letzte Feld traegt ihn an
   seiner RECHTEN Kante, und die liegt genau in der Mitte des Rasters.

   Auch das gilt nur bei ungerader Feldzahl; einspaltig ist der Strich aus. */
.zeitler-directions.vier > .wp-block-column:nth-child(odd):last-child {
	border-right: 1px solid var(--zr-line);
}
@media (max-width: 860px) {
	.zeitler-directions.vier > .wp-block-column:nth-child(odd):last-child {
		border-right: 0;
	}
}

/* Die zehn Rechtsgebiete neben dem Claim der Startseite fuehren seit dem
   04.09. auf das jeweils passende Feld der Expertise-Seite. Sie sollen dabei
   aussehen wie zuvor: kein Unterstrich, Textfarbe, erst beim Zeigen orange -
   dasselbe Verhalten wie die verlinkten Namen auf der Teamseite.

   Ohne diese Regel griffe die allgemeine Verweisregel vom Dateianfang; die
   setzt zwar dieselbe Farbe, laesst den Unterstrich aber stehen, und zehn
   unterstrichene Begriffe nebeneinander waeren unruhig.

   Den Sprung unter die klebende Kopfzeile faengt die vorhandene Regel
   `:where(.wp-site-blocks) [id] { scroll-margin-top: 7rem }` ab - dafuer war
   nichts zu tun. */
.zeitler-eck-felder a {
	color: inherit;
	text-decoration: none;
}
.zeitler-eck-felder a:hover {
	color: var(--zr-accent);
}


/* ============================== Aufzaehlungen der Felder mit Einzug */
/* Die Leistungen unter den Ueberschriften der Expertise-Felder stehen mit einem
   Einzug von 40 px, linksbuendig, und das Zeichen, das die Klappe oeffnet, steht
   VOR dem Wort.

   Betroffen ist nur `.zeitler-feld-klapps`, die Gruppe gibt es allein in den
   Feldern der Expertise-Seite. Dieselben Schwerpunkte auf den Bereichsseiten
   und auf der Karriereseite (`.zeitler-teilgebiete-raster`) bleiben unberuehrt.

   ZUM WERT, weil er an einem Nachmittag fuenfmal gewandert ist: rechtsbuendig,
   dann Zeichen vor dem Wort, dann linksbuendig ab 50 %, dann 32 % (gemessen an
   der Stelle, an der in der Ueberschrift der Trennpunkt steht), dann 72 px --
   und schliesslich 40 px. Grundlage der Entscheidung war eine Vergleichsseite
   mit vier Abstufungen nebeneinander (40, 72, 104 und 142 px), die unter
   /entwurf/einzuege.html liegt. Die Kanzlei hat die knappste gewaehlt.

   Fester Wert und kein Anteil: Der Einzug ist damit in beiden Spalten gleich
   weit, gleichgueltig wie breit die Spalte gerade ist. Bei 40 px bleibt genug
   Restbreite, sodass kein Eintrag umbricht -- ausser dem langen M&A-Eintrag,
   der auch ohne Einzug zwei Zeilen braucht.

   ZUR TECHNIK: Die Beschriftung ist in der Grundfassung ein Flex-Kasten mit dem
   Zeichen als ::after, das `margin-left: auto` an den rechten Rand schiebt.
   Hier steht sie als gewoehnlicher Block, damit der Einzug eine Polsterung sein
   kann und das Zeichen als ::before IM Textfluss unmittelbar vor dem ersten
   Wort sitzt. Ein Flex-Kasten hatte das Zeichen bei zweizeiligen Eintraegen an
   die Kante des Kastens geschoben statt an das Wort.

   Das ::after der Grundfassung ist abgeschaltet -- in beiden Zustaenden, sonst
   erschiene im offenen Zustand rechts wieder ein Strich.

   Die Eintraege ohne hinterlegten Text ziehen beim Einzug mit, bekommen aber
   kein Zeichen: es gaebe nichts zu oeffnen. */

.zeitler-feld-klapps .zeitler-teilgebiet-klapp > summary,
.zeitler-feld-klapps .zeitler-teilgebiet-titel {
	display: block;
	text-align: left;
	padding-left: 2.5rem;
}
/* Haengender Einzug: Das Zeichen haengt links aus, damit bei einem Eintrag ueber
   zwei Zeilen die zweite Zeile unter dem ersten WORT beginnt und nicht unter dem
   Zeichen. 0,95rem entspricht der Breite des Zeichens samt seinem Abstand; die
   Polsterung waechst um denselben Betrag, damit das Zeichen weiterhin bei genau
   40 px beginnt. Betrifft nur die Klappen -- Eintraege ohne Zeichen haben nichts
   zu ueberhaengen. */
.zeitler-feld-klapps .zeitler-teilgebiet-klapp > summary {
	padding-left: calc(2.5rem + .95rem);
	text-indent: -.95rem;
}
.zeitler-feld-klapps .zeitler-teilgebiet-klapp > summary::after,
.zeitler-feld-klapps .zeitler-teilgebiet-klapp[open] > summary::after {
	content: none;
}
.zeitler-feld-klapps .zeitler-teilgebiet-klapp > summary::before {
	content: "+";
	color: var(--zr-accent);
	margin-right: .45rem;
}
.zeitler-feld-klapps .zeitler-teilgebiet-klapp[open] > summary::before {
	content: "\2013";
}

/* Am Telefon steht das Feld ueber die volle Breite und ist trotzdem schmal --
   dort beginnt die Aufzaehlung ohne Einzug am linken Rand. */
@media (max-width: 860px) {
	.zeitler-feld-klapps .zeitler-teilgebiet-klapp > summary,
	.zeitler-feld-klapps .zeitler-teilgebiet-titel {
		padding-left: 0;
	}
}

/* ---------- Expertise: jedes Rechtsgebiet ein eigenes Feld, seit 08.10. ----------
   Auf Wunsch der Kanzlei „so ähnlich wie bei den Porträts": Entwurf A aus
   /entwurf/expertise-felder-a.html. Drei Spalten (3 + 2), jedes Feld eine weiße
   Fläche (zuerst grau #eeeeea, am 08.10. auf Wunsch weiß), Abstand zwischen den
   Feldern wie zwischen den Porträts (.zeitler-crew). Trennlinien und der
   senkrechte Strich aus den Abschnitten weiter oben sind hier abgeschaltet.
   Der Abschnitt steht absichtlich am Dateiende: Er muss die Regeln gleicher
   Stärke von weiter oben schlagen, auch die für schmale Fenster. */
.zeitler-directions.vier { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.zeitler-directions.vier,
.zeitler-band-head + .zeitler-directions.vier {
	gap: clamp(1.5rem, 3vw, 2.75rem) !important;
	margin-top: clamp(1.5rem, 3vw, 2.75rem) !important;
	align-items: stretch;
}
.zeitler-directions.vier > .wp-block-column,
.zeitler-directions.vier > .wp-block-column:nth-child(odd),
.zeitler-directions.vier > .wp-block-column:nth-child(even),
.zeitler-directions.vier > .wp-block-column:nth-child(odd):last-child {
	padding: clamp(1.4rem, 2vw, 1.9rem) clamp(1.4rem, 2vw, 1.9rem) clamp(1.1rem, 1.6vw, 1.5rem) !important;
	border: 0 !important;
	position: static;
	background: #ffffff;
}
.zeitler-directions.vier > .wp-block-column:nth-child(odd):last-child::before { display: none; }
.zeitler-directions.vier .zeitler-feld-klapps { max-width: none; }
@media (prefers-color-scheme: dark) {
	.zeitler-directions.vier > .wp-block-column,
	.zeitler-directions.vier > .wp-block-column:nth-child(odd),
	.zeitler-directions.vier > .wp-block-column:nth-child(even),
	.zeitler-directions.vier > .wp-block-column:nth-child(odd):last-child {
		background: rgba(233, 234, 227, .06);
	}
}
@media (max-width: 1240px) {
	.zeitler-directions.vier { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
	.zeitler-directions.vier { grid-template-columns: 1fr !important; }
}

/* ---------- Über uns: zwei Teambilder unter dem Claim, seit 08.10. ----------
   Fassung E aus /entwurf/ueberuns-teambilder-e.html. Die Bilder (Medien 533, 534)
   sind PROVISORISCH - Bildschirmfotos, die Originale kommen noch. Team1 ist schon in
   der Datei eng um die fünf Personen zugeschnitten und leicht nachgeschärft.
   Groß: beide 16 : 9 nebeneinander, Abstand wie zwischen den Porträts. Einspaltig:
   jedes Bild im eigenen Format, ohne Beschnitt.
   .zeitler-ansatz ist ein Raster mit fest vergebenen Zeilen (Vorspann 1, Text 2,
   Schaltfläche rechts über beide). Die Bilder nehmen Zeile 1 über die volle Breite,
   alles andere rückt eine Zeile nach unten - sonst landen sie in einer automatisch
   angelegten Zeile UNTER dem Text. Die Linie unter dem Claim ist der Hintergrund von
   .zeitler-ansatz, deshalb stehen die Bilder in diesem Block und nicht davor. */
.zeitler-teambilder {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(1.5rem, 3vw, 2.75rem);
	margin: 0 0 clamp(2.5rem, 5vw, 4rem);
}
.zeitler-teambilder .wp-block-image { margin: 0; }
.zeitler-teambilder img {
	width: 100%;
	display: block;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	filter: saturate(.94) contrast(1.02);
}
.zeitler-teambilder .t1 img { object-position: center 50%; }
.zeitler-teambilder .t2 img { object-position: center 0%; } /* 16.10.: Originalfoto, vorher 60 % */
.zeitler-ansatz > .zeitler-teambilder { grid-column: 1 / -1; grid-row: 1; }
.zeitler-ansatz > .zeitler-ansatz-vorspann { grid-row: 2; }
.zeitler-ansatz > .zeitler-ansatz-text { grid-row: 3; }
.zeitler-ansatz > .wp-block-buttons { grid-row: 2 / span 2; }
@media (max-width: 860px) {
	.zeitler-teambilder { grid-template-columns: 1fr; }
	.zeitler-teambilder img { aspect-ratio: auto; height: auto; object-fit: initial; }
	.zeitler-ansatz > .wp-block-buttons { grid-row: 4; }
}

/* ---------- Karriere: Foto neben „Bereit für den nächsten Schritt?", seit 08.10. ----------
   Links der Text wie bisher, rechts das Foto (Medium 536, PROVISORISCH - Bildschirmfoto,
   das Original kommt noch). Zwei gleiche Spalten, damit das Bild an derselben Kante
   beginnt wie die rechte Spalte darüber („Für den Assistenzbereich"). Einspaltig steht
   das Bild unter dem Text. */
.zeitler-schritt {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: clamp(2rem, 4vw, 3.5rem);
	align-items: start;
}
/* Seit 08.10. nachmittags steht die Überschrift mit in der linken Spalte
   (.zeitler-schritt-text) - auf Wunsch der Kanzlei beginnt das Bild auf der Höhe
   der Überschrift statt erst beim Text. Überschrift und Text stehen damit wieder in
   einer gewöhnlichen Gruppe, ihre Ränder fallen zusammen wie vorher. Die
   Textgruppe darin bekommt den Abstand also von selbst. */
.zeitler-schritt-text > :first-child { margin-top: 0; }
.zeitler-schritt-text > :last-child,
.zeitler-schritt-text > :last-child > :last-child { margin-bottom: 0; }
/* Seit 08.10. abends auf Wunsch der Kanzlei: Das Bild ist genau so hoch wie die
   linke Spalte - oben bündig mit der Überschrift, unten mit der letzten Textzeile.
   Das Bild selbst trägt deshalb keine Höhe bei (absolut gesetzt); die Zeile des
   Rasters bemisst sich allein am Text, und das Bild füllt sie mit Beschnitt
   (object-fit). Der Ausschnitt sitzt etwas über der Mitte, damit die Köpfe nicht
   an den oberen Rand rücken. Einspaltig gilt das nicht - dort steht das Bild
   wieder im eigenen Format unter dem Text. */
.zeitler-schritt { align-items: stretch; }
.zeitler-schritt-bild { margin: 0; position: relative; overflow: hidden; }
.zeitler-schritt-bild img {
	position: absolute;
	inset: 0;
	height: 100% !important;
	object-fit: cover;
	object-position: center 40%;
}
.zeitler-schritt-bild img {
	width: 100%;
	height: auto;
	display: block;
	filter: saturate(.94) contrast(1.02);
}
@media (max-width: 860px) {
	.zeitler-schritt { grid-template-columns: 1fr; row-gap: clamp(1.75rem, 3vw, 2.5rem); }
	.zeitler-schritt-bild { position: static; }
	.zeitler-schritt-bild img { position: static; height: auto !important; }
}

/* ---------- Klappen: das Plus steht vor dem Wort, seit 08.10. ----------
   Auf Wunsch der Kanzlei („die Plus bei Neben dem Studium etc. vor den Wortbeginn
   setzen") und - wie jede Gestaltungsänderung - auf allen Seiten gleichgezogen:
   Karriere, Unternehmensrecht (204), Dr. Thomas Zeitler (89). Auf der Expertise-Seite
   stand das Plus schon vorn (.zeitler-feld-klapps, eigene Regeln weiter oben); dort
   ändert sich nichts. Die Klappe ist ein Flex-Kasten, das Zeichen also ein eigenes
   Teil: Bricht das Wort um, steht die zweite Zeile bündig unter der ersten. */
.zeitler-teilgebiet-klapp > summary { justify-content: flex-start; gap: .45rem; }
.zeitler-teilgebiet-klapp > summary::after,
.zeitler-teilgebiet-klapp[open] > summary::after { content: none; }
.zeitler-teilgebiet-klapp > summary::before {
	content: "+";
	color: var(--zr-accent);
	flex: 0 0 auto;
}
.zeitler-teilgebiet-klapp[open] > summary::before { content: "\2013"; }

/* ---------- Karriere: „Was Sie bei uns erwartet" nebeneinander, seit 08.10. ----------
   Fassung B aus /entwurf/karriere-erwartet-b.html. Die Wörter laufen wie ein Satz und
   brechen von selbst um; ein geöffneter Punkt nimmt eine eigene Zeile, sein Text läuft
   über die ganze Spaltenbreite. Ohne Plus (Wunsch der Kanzlei) - Aufklappen und die
   orange Färbung beim Darüberfahren bleiben. Betroffen sind nur die zwei Listen direkt
   unter dem Kennzeichner; die Klappen weiter oben stehen hinter einem Absatz.
   Zwei Fallen: Der Core setzt für .wp-block-columns ab 782 px
   flex-wrap: nowrap !important, und .zeitler-teilgebiete-raster setzt gap: 0
   !important - beides braucht hier ein eigenes !important. */
.zeitler-label + .zeitler-teilgebiete-raster.einspaltig {
	display: flex !important;
	flex-wrap: wrap !important;
	column-gap: clamp(1.4rem, 2.6vw, 2.25rem) !important;
	row-gap: .9rem !important;
	align-items: baseline;
}
.zeitler-label + .zeitler-teilgebiete-raster.einspaltig > .wp-block-column {
	flex: 0 0 auto;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}
.zeitler-label + .zeitler-teilgebiete-raster.einspaltig > .wp-block-column:has(> details[open]) { flex-basis: 100%; }
.zeitler-label + .zeitler-teilgebiete-raster.einspaltig .zeitler-teilgebiet-klapp > :not(summary) { max-width: 60ch; }
.zeitler-label + .zeitler-teilgebiete-raster.einspaltig .zeitler-teilgebiet-klapp > summary::before,
.zeitler-label + .zeitler-teilgebiete-raster.einspaltig .zeitler-teilgebiet-klapp[open] > summary::before { content: none; }

/* ---------- Karriere: Text beim Darüberfahren, seit 08.10. ----------
   Das Feld unter der Wortreihe von „Was Sie bei uns erwartet". Angelegt und befüllt von
   assets/js/erwartet.js (nur auf Seite 284 eingebunden, siehe functions.php). Ohne
   Skript gibt es das Feld nicht, und die Klappen öffnen sich wie zuvor. */
.zeitler-erwartet-text {
	max-width: 60ch;
	margin: 0;
	font-size: clamp(.9375rem, 1.1vw, 1.0625rem);
	line-height: 1.6;
	color: var(--zr-ink);
	overflow: hidden;
	max-height: 0;
	opacity: 0;
	transition: max-height .25s ease, opacity .2s ease, margin-top .25s ease;
}
.zeitler-erwartet-text.sichtbar { max-height: 20rem; opacity: 1; margin-top: 1.1rem; }
.zeitler-erwartet-text p { margin: 0; }
.zeitler-label + .zeitler-teilgebiete-raster.einspaltig .zeitler-teilgebiet-klapp.aktiv > summary { color: var(--zr-accent); }
@media (prefers-reduced-motion: reduce) {
	.zeitler-erwartet-text { transition: none; }
}

/* ---------- Team: Assistenzbereich drei je Reihe, seit 08.10. ----------
   Vorschlag A aus /entwurf/team-assistenz-a.html, auf Wunsch der Kanzlei „noch etwas
   kleiner", danach „geht es etwas größer": drei Fotos je Reihe (3 + 3), der Streifen
   höchstens 52 rem breit und mittig (das constrained-Layout der Seite zentriert ihn von
   selbst). Bei 1440 px misst ein Foto damit rund 255 px (zuerst 48 rem / 235 px) -
   deutlich größer als vorher (175), deutlich kleiner als die Juristen (385). Das Blockmarkup trägt columnCount 6; die Spaltenzahl hier schlägt es. */
.zeitler-crew-assistenz {
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	max-width: 52rem;
}
@media (max-width: 860px) {
	.zeitler-crew-assistenz { max-width: none; }
}
@media (max-width: 600px) {
	.zeitler-crew-assistenz { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* ---------- Kontakt: Foto des Techcenters über die ganze Breite, seit 09.10. ----------
   Medium 604, erster Inhalt von .zeitler-call-rest - zwischen Abschnittskopf und der Zeile
   „Kanzlei / Kontaktdaten", wie die Teambilder auf der Startseite. Breitformat 32 : 9,
   Ausschnitt fast unten (94 %): Bäume, beide Schilder, knapp darunter Bordstein. Beide
   Schilder sind im Bild scharf nachgezeichnet, der Schatten auf der Tafel entfernt
   (skripte/2026-10-09/schild_bearbeiten.ps1). Am Handy das ganze Bild im eigenen Format. */
.zeitler-call-rest > .zeitler-kontaktbild {
	margin: 0 0 clamp(2.5rem, 5vw, 4rem);       /* wie unter den Teambildern */
}
.zeitler-kontaktbild img {
	width: 100%;
	height: auto;
	display: block;
	aspect-ratio: 32 / 9;
	object-fit: cover;
	object-position: center 94%;
	filter: saturate(.94) contrast(1.02);       /* wie die Porträts auf /team/ */
}
@media (max-width: 860px) {
	.zeitler-kontaktbild img { aspect-ratio: auto; object-fit: initial; }
}

/* ---------- Karriere: „Was Sie bei uns erwartet" auch am Handy nebeneinander, seit 09.10. ----------
   Der Core setzt unter 782 px jede Spalte auf flex-basis: 100% !important - dadurch stand
   am Handy jedes Wort auf einer eigenen Zeile (elf Zeilen). Hier ebenfalls !important, damit
   die Wörter wie am großen Bildschirm fließen; ein geöffneter Punkt nimmt weiter eine eigene
   Zeile. */
@media (max-width: 781px) {
	.zeitler-label + .zeitler-teilgebiete-raster.einspaltig > .wp-block-column { flex-basis: auto !important; }
	.zeitler-label + .zeitler-teilgebiete-raster.einspaltig > .wp-block-column:has(> details[open]) { flex-basis: 100% !important; }
}

/* ---------- Karriere: erste Zeile (Juristen / Assistenz) enger, seit 09.10. ----------
   Wunsch der Kanzlei: „diese Zeile insgesamt etwas von den Abständen verkürzen". Alle
   Abstände der Zeile um rund ein Drittel; nur die erste Reihe (:first-child) - die Zeile
   „Was Sie bei uns erwartet" darunter bleibt. .zeitler-spalten gibt es nur auf Karriere. */
.zeitler-spalten > .zeitler-teilgebiete-raster:first-child {
	margin-top: clamp(1.25rem, 2.5vw, 1.75rem) !important;            /* Linie → Titel, vorher bis 2,5rem */
}
.zeitler-spalten > .zeitler-teilgebiete-raster:first-child .zeitler-spaltentitel {
	margin-bottom: clamp(.5rem, 1.1vw, .85rem);                        /* Titel → Kennzeichner, vorher bis 1,25rem */
}
.zeitler-spalten > .zeitler-teilgebiete-raster:first-child .zeitler-label { margin-bottom: .65rem; }
.zeitler-spalten > .zeitler-teilgebiete-raster:first-child .zeitler-topic-lead { margin-top: .65rem; }
.zeitler-spalten > .zeitler-teilgebiete-raster:first-child .zeitler-teilgebiete-raster.einspaltig {
	margin-top: clamp(1.1rem, 2.4vw, 1.6rem) !important;               /* Text → Klappen, vorher bis 2,5rem */
}
.zeitler-spalten > .zeitler-teilgebiete-raster:first-child .zeitler-teilgebiete-raster.einspaltig > .wp-block-column:not(:first-child) {
	margin-top: .35rem;                                                /* zwischen den Klappen, vorher je ,55rem */
	padding-top: .35rem;
}
/* Klappen → Linie darunter: Juristen, Assistenz und die beiden „Was Sie bei uns erwartet"
   sind vier Zellen EINES Rasters; die Linie ist das ::before der dritten Zelle, der Abstand
   darüber ihr oberer Rand. */
.zeitler-spalten > .zeitler-teilgebiete-raster:first-child > .wp-block-column:nth-child(n+3) {
	margin-top: clamp(1rem, 2vw, 1.5rem);                              /* vorher bis 2,25rem */
}

/* ---------- Karriere: Zeile „Was Sie bei uns erwartet" enger, seit 09.10. ----------
   Wie die Zeile darüber (Abschnitt „erste Zeile enger") um rund ein Drittel. Die Zeile sind
   die Zellen 3 und 4 des Rasters. */
.zeitler-spalten > .zeitler-teilgebiete-raster:first-child > .wp-block-column:nth-child(n+3) {
	padding-top: clamp(1rem, 2vw, 1.5rem);                             /* Linie → Kennzeichner, vorher bis 2,25rem */
}
.zeitler-spalten > .zeitler-teilgebiete-raster:first-child > .wp-block-column:nth-child(n+3) .zeitler-label { margin-bottom: .65rem; }
.zeitler-spalten > .zeitler-teilgebiete-raster:first-child > .wp-block-column:nth-child(n+3) .zeitler-label + .zeitler-teilgebiete-raster.einspaltig {
	margin-top: .65rem !important;                                     /* Kennzeichner → Wörter, vorher 1rem */
	row-gap: .5rem !important;                                         /* zwischen den Wortreihen, vorher ,9rem */
}

/* ---------- Startseite: Einleitungssatz über den Schwerpunkten, seit 09.10. ----------
   „ZEITLER & Partner ist eine Rechtsanwaltskanzlei in Linz mit folgenden Schwerpunkten:"
   Eigene Zeile am Anfang von .zeitler-eck-felder. Gesetzt wie die erläuternden Absätze neben
   den Claims der übrigen Seiten (Lesetext, fett, Textfarbe), damit er sich von den
   Schwerpunkten (Jost, grau) abhebt. */
.zeitler-eck-einleitung {
	display: block;
	margin-bottom: .6rem;
	/* Auf Wunsch der Kanzlei (09.10.) gleich groß wie die Schwerpunkte: Die Lesetextschrift
	   wirkt bei gleichem Wert rund ein Fünftel größer als Jost (Versalhöhe am Bild gemessen:
	   14 gegen 11 px); 0,85em war zu klein, am Bild abgestimmt: 0,93em. */
	font-size: .93em;
	font-family: var(--wp--preset--font-family--serif, inherit);
	font-weight: 400;                 /* 09.10. versuchsweise nicht fett (Kanzlei); vorher 700 */
	letter-spacing: 0;
	color: var(--zr-ink);
}

/* ---------- Blog: fünf Felder je Rechtsgebiet, seit 09.10. ----------
   Fassung B2 aus /entwurf/blog-b2.html. Je Feld der neueste Beitrag der Kategorie, ältere in
   der Klappe „Archiv" (dieselbe Klappe wie überall, Plus vorn). Felder weiß wie auf
   /expertise/, Abstand wie zwischen den Porträts. */
.zeitler-blog-felder {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(1.5rem, 3vw, 2.75rem);
	margin-top: clamp(1.75rem, 3vw, 2.5rem);
}
.zeitler-blog-feld { background: #fff; padding: 1.7rem; margin: 0 !important; }
.zeitler-blog-gebiet {
	margin: 0 0 1rem !important;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--zr-line);
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 400;
	font-size: clamp(1.25rem, 1.6vw, 1.375rem) !important;
	line-height: 1.25;
}
.zeitler-blog-feld .wp-block-post-template { list-style: none; margin: 0; padding: 0; }
.zeitler-blog-feld .wp-block-post-title { margin: 0; font-family: var(--wp--preset--font-family--sans); font-weight: 500; line-height: 1.35; }
.zeitler-blog-feld .wp-block-post-title a { color: var(--zr-ink); text-decoration: none; }
.zeitler-blog-feld .wp-block-post-title a:hover { color: var(--zr-accent); }
.zeitler-blog-neu .wp-block-post-title { font-size: clamp(1.1rem, 1.4vw, 1.25rem); }
.zeitler-blog-neu .wp-block-post-title a::before { content: "\2192\00a0"; color: var(--zr-accent); }
.zeitler-blog-neu .wp-block-post-excerpt { margin: .5rem 0 .4rem; font-size: .9375rem; line-height: 1.6; }
.zeitler-blog-neu .wp-block-post-excerpt__more-text { display: none; }
.zeitler-blog-feld .wp-block-post-date { font-family: var(--wp--preset--font-family--sans); font-size: .8125rem; color: var(--zr-muted, var(--zr-ink)); }
.zeitler-blog-leer { margin: 0; font-style: italic; }
.zeitler-blog-archiv { margin-top: 1rem; padding-top: .75rem; border-top: 1px solid var(--zr-line); }
.zeitler-blog-aelter .wp-block-post { border-top: 1px solid var(--zr-line); padding: .7rem 0; }
.zeitler-blog-aelter .wp-block-post:first-child { border-top: 0; }
.zeitler-blog-aelter .wp-block-post-title { font-size: .9375rem; font-weight: 400; }
/* Archiv steht immer da - auf Wunsch der Kanzlei (09.10.) „vorsorglich"; ohne ältere
   Beiträge zeigt es „Noch keine älteren Beiträge." (Seite 77). */
@media (max-width: 1240px) { .zeitler-blog-felder { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 860px) { .zeitler-blog-felder { grid-template-columns: 1fr; } }

/* Ein einzelnes Wort als Claim („Blog"): ohne den Einzug der ersten Zeile, der sonst die
   drei Wörter gegeneinander versetzt. */
.zeitler-blog .zeitler-motto > p:only-child { margin-left: 0; }

/* Blog-Felder wie die Felder auf /expertise/ (Wunsch der Kanzlei 09.10.: Größe, Abstände
   „genauso wie bei der Expertise"). Werte aus den Regeln für .zeitler-directions.vier
   übernommen und am Bild beider Seiten nachgemessen. */
.zeitler-blog-felder { gap: clamp(1.5rem, 3vw, 2.75rem); margin-top: clamp(1.5rem, 3vw, 2.75rem); }
.zeitler-blog-feld { padding: clamp(1.4rem, 2vw, 1.9rem) clamp(1.4rem, 2vw, 1.9rem) clamp(1.1rem, 1.6vw, 1.5rem) !important; }
.zeitler-blog-gebiet {
	margin: 0 !important;
	padding-bottom: 0;
	border-bottom: 0;
	font-weight: 500;
	line-height: 1.02;
}
.zeitler-blog-gebiet + .zeitler-blog-neu {
	margin-top: .9rem;
	padding-top: .85rem;
	border-top: 1px solid var(--zr-line);
}

/* ---------- Blog als Archivseite, seit 09.10. ----------
   Je Feld alle Beiträge des Rechtsgebiets (Titel + Datum), ab dem neunten in der Klappe
   „Ältere Beiträge" - die Klappe nur, wenn es solche gibt. Linie zwischen den Einträgen wie
   in den Listen der Expertise-Seite. Die Regeln für .zeitler-blog-neu / -archiv weiter oben
   sind damit ungenutzt (nicht gelöscht). */
.zeitler-blog-gebiet + .zeitler-blog-alle { margin-top: .9rem; }
.zeitler-blog-alle .wp-block-post,
.zeitler-blog-alle .zeitler-blog-leer { border-top: 1px solid var(--zr-line); padding: .8rem 0; }
.zeitler-blog-alle .wp-block-post-title { font-size: 1rem; }
.zeitler-blog-alle .wp-block-post-title a::before { content: "\2192\00a0"; color: var(--zr-accent); }
.zeitler-blog-alle .wp-block-post-date { margin-top: .25rem; }
.zeitler-blog-alle .wp-block-post-template > li, .zeitler-blog-aelter .wp-block-post-template > li { margin-block: 0 !important; }   /* Abstand des Core zwischen den Eintr?gen weg - es trennt die Linie */
.zeitler-blog-mehr { margin-top: .2rem; padding-top: .75rem; border-top: 1px solid var(--zr-line); }
.zeitler-blog-mehr:not(:has(.wp-block-post)) { display: none; }

/* ---------- News: zwei Felder Blog / Vorträge & Seminare, seit 09.10. ----------
   Entwurf E (/entwurf/news-zwei-spalten.html). Felder wie auf /expertise/ und /blog/ (weiß,
   gleiche Überschrift, gleiche Polster). Im Blog-Feld je Rechtsgebiet der neueste Beitrag
   (Query Loop auf die Kategorie). Die alten Regeln für .zeitler-strands-felder bleiben
   ungenutzt stehen. */
.zeitler-news-felder {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(1.5rem, 3vw, 2.75rem);
	margin-top: clamp(1.5rem, 3vw, 2.75rem);
}
.zeitler-news-feld {
	display: flex; flex-direction: column;
	background: #fff;
	margin: 0 !important;
	padding: clamp(1.4rem, 2vw, 1.9rem) clamp(1.4rem, 2vw, 1.9rem) clamp(1.1rem, 1.6vw, 1.5rem) !important;
}
.zeitler-news-titel {
	margin: 0 !important;
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 500; line-height: 1.02;
	font-size: clamp(1.25rem, 1.6vw, 1.375rem) !important;
	color: var(--zr-ink);
}
.zeitler-news-titel + .zeitler-news-eintrag { margin-top: .9rem !important; }   /* schl?gt margin: 0 !important der Eintr?ge */
.zeitler-news-eintrag { margin: 0 !important; padding: .85rem 0; border-top: 1px solid var(--zr-line); }
.zeitler-news-gebiet {
	margin: 0 0 .35rem !important;
	font-family: var(--wp--preset--font-family--sans);
	font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;   /* fett seit 09.10. (Kanzlei), vorher 500 */
	color: var(--zr-accent);
}
.zeitler-news-neu, .zeitler-news-neu .wp-block-post-template { margin: 0 !important; padding: 0; list-style: none; }
.zeitler-news-neu .wp-block-post-title { margin: 0; font-family: var(--wp--preset--font-family--sans); font-weight: 500; font-size: 1rem; line-height: 1.35; }
.zeitler-news-neu .wp-block-post-title a { color: var(--zr-ink); text-decoration: none; }
.zeitler-news-neu .wp-block-post-title a::before { content: "\2192\00a0"; color: var(--zr-accent); }
.zeitler-news-neu .wp-block-post-title a:hover { color: var(--zr-accent); }
.zeitler-news-neu .wp-block-post-date { margin-top: .25rem; font-family: var(--wp--preset--font-family--sans); font-size: .8125rem; }
.zeitler-news-leer { margin: 0 !important; font-style: italic; font-size: .9375rem; }
.zeitler-news-mehr {
	margin: auto 0 0 !important;
	padding-top: .9rem; border-top: 1px solid var(--zr-line);
	font-family: var(--wp--preset--font-family--sans); font-size: .9375rem;
}
.zeitler-news-mehr a { color: var(--zr-ink); text-decoration: none; }
.zeitler-news-mehr a:hover { color: var(--zr-accent); }
@media (max-width: 860px) { .zeitler-news-felder { grid-template-columns: 1fr; } }

/* Blog: Feldüberschriften etwas kleiner als auf /expertise/ (Wunsch der Kanzlei 09.10.):
   22 → 19 px bei 1440. */
.zeitler-blog-gebiet { font-size: clamp(1.1rem, 1.35vw, 1.1875rem) !important; }

/* Expertise: Feldüberschriften so groß wie auf /blog/ (19 px bei 1440) - damit
   „Vertragsgestaltung im Wirtschaftsrecht" in eine Zeile passt (Kanzlei, 09.10.). Bei 22 px
   misst die Zeile ~357 px, das Feld innen 328. */
.zeitler-directions.vier h2,
.zeitler-directions.vier h3 { font-size: clamp(1.1rem, 1.35vw, 1.1875rem) !important; }

/* Feldüberschrift näher an den oberen Feldrand (Kanzlei 09.10.): obere Polsterung der Felder
   clamp(1.4rem, 2vw, 1.9rem) → clamp(1rem, 1.4vw, 1.3rem), bei 1440 28 → 20 px. Expertise
   genannt, auf /blog/ und /news/ gleichgezogen. (Ein erster Anlauf, 3.192.0, hatte irrtümlich
   den Abstand Überschrift → Schlagwörter verkleinert - zurückgenommen.) */
.zeitler-directions.vier > .wp-block-column,
.zeitler-directions.vier > .wp-block-column:nth-child(odd),
.zeitler-directions.vier > .wp-block-column:nth-child(even),
.zeitler-directions.vier > .wp-block-column:nth-child(odd):last-child,
.zeitler-blog-feld, .zeitler-news-feld { padding-top: clamp(1rem, 1.4vw, 1.3rem) !important; }

/* Abstand Feldüberschrift → Linie über den Schlagwörtern größer (Kanzlei 09.10.): .9 → 1.3rem
   (14 → 21 px). Expertise genannt, /blog/ und /news/ gleichgezogen. */
.zeitler-directions.vier .zeitler-feld-klapps { margin-top: 1.3rem; }
.zeitler-blog-gebiet + .zeitler-blog-alle { margin-top: 1.3rem; }
.zeitler-news-titel + .zeitler-news-eintrag { margin-top: 1.3rem !important; }


/* ---------- Karriere: Foto über die ganze Breite, flach, seit 11.10. ----------
   Fassung 2b (Entwurf karriere-foto-flach-v2): Das Foto steht nicht mehr neben, sondern über
   „Bereit für den nächsten Schritt?", über die Breite des Satzspiegels; der Text darunter
   einspaltig. 36 : 11, Oberkante knapp über dem höchsten Kopf, unten bis zu den Händen.
   Abstand über dem Foto bewusst klein (.75rem zur Polsterung des Abschnitts). Nur
   margin-top/-bottom setzen - links/rechts muss das auto des Satzspiegels bleiben.
   Die Regeln für .zeitler-schritt-bild (08.10.) stehen oben noch, greifen aber nicht mehr. */
.zeitler-karrierebild { margin-top: .75rem !important; margin-bottom: clamp(1.5rem, 3vw, 2.75rem) !important; }
.zeitler-karrierebild img {
	width: 100%;
	height: auto;
	display: block;
	aspect-ratio: 5 / 2; /* 16.10.: Fassung C, vorher 36 / 11 */
	object-fit: cover;
	object-position: center 27%; /* 16.10.: Originalfoto, vorher 37 % */
	filter: saturate(.94) contrast(1.02);
}
.zeitler-schritt { display: block !important; }
@media (max-width: 860px) {
	.zeitler-karrierebild img { aspect-ratio: 16 / 9; object-position: center 30%; }
}

/* 11.10. auf #ea5901 umgestellt, 13.10. auf Wunsch der Kanzlei wieder #da6329 (das weichere
   Orange überall), ebenso das Kopfzeilen-Logo (Medium 294) und die Kanzleipräsentation.
   16.10.: alles auf #d06a26 (Ton der Vektordatei der Grafik, Logo Medium 683). */

/* ---------- Blogbeitrag mit Fragen und Antworten (FAQ), seit 11.10. ----------
   Erster Fall: „Anlagenbauverträge: Häufige Fragen und Antworten" (Beitrag 629). Aufbau wie der
   Werdegang der Personenseiten: je Abschnitt links die Überschrift als kleine orange Kennzeile
   (ein H2 - für Suchmaschinen bleibt die Gliederung erhalten), rechts die Fragen als Klappen
   wie auf /expertise/. Eigene Klassen statt .zeitler-vita, deren Listenregeln den Antworten
   die Aufzählungspunkte nähmen. Auf Wunsch der Kanzlei („Schriftgrößen drastisch reduzieren")
   ist auch der Beitragstitel kleiner gesetzt - das gilt für alle Beiträge. */
.single .zeitler-page-title,
.single-post .zeitler-page-title { font-size: clamp(1.4rem, 2vw, 1.75rem) !important; line-height: 1.2; margin-bottom: .4rem; }
/* single.html setzt den Abstand als margin am main - das ergab weiße Streifen über und unter
   der grauen Fläche. Hier als Polsterung innerhalb des Graus. */
.single-post main.wp-block-group {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: clamp(1.75rem, 3vw, 2.75rem);
	padding-bottom: clamp(2.5rem, 5vw, 4rem);
}
.zeitler-blog-einleitung { font-size: 1rem; max-width: 60ch; margin-bottom: clamp(1.5rem, 3vw, 2.25rem); }
.zeitler-blog-faq .wp-block-columns { margin-block: 0; gap: clamp(1rem, 3vw, 2.5rem); }
.zeitler-blog-faq-block + .zeitler-blog-faq-block {
	margin-top: clamp(1rem, 1.8vw, 1.5rem);
	padding-top: clamp(1rem, 1.8vw, 1.5rem);
	border-top: 1px solid var(--zr-line);
}
.zeitler-blog-faq .zeitler-blog-faq-titel {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .6875rem;
	line-height: 1.5;
	letter-spacing: .19em;
	text-transform: uppercase;
	color: var(--zr-accent);
	margin: 0;
	padding-top: .2rem;
}
.zeitler-blog-faq .zeitler-feld-klapps { max-width: none; margin-top: 0; }
.zeitler-blog-faq .zeitler-feld-klapps > :first-child { border-top: 0; padding-top: 0; }
.zeitler-blog-faq .zeitler-feld-klapps > :last-child { border-bottom: 0; padding-bottom: 0; }
.zeitler-blog-faq .zeitler-teilgebiet-klapp > summary { font-size: .9375rem; }
.zeitler-blog-faq .zeitler-teilgebiet-text { font-size: .875rem; max-width: 62ch; }
.zeitler-blog-faq .wp-block-list.zeitler-teilgebiet-text { margin: .4rem 0 .6rem; padding-left: 1.1rem; }
.zeitler-blog-kontakt {
	font-size: .9375rem;
	margin-top: clamp(1.75rem, 3vw, 2.5rem) !important;
	padding-top: clamp(1rem, 1.8vw, 1.5rem);
	border-top: 1px solid var(--zr-line);
}
.zeitler-blog-vorbehalt { font-size: .8125rem; color: var(--zr-faint); }
@media (max-width: 781px) {
	.zeitler-blog-faq .wp-block-columns { gap: .6rem; }
}
/* FAQ-Beitrag: Einleitung linksbündig (das constrained-Layout setzte sie mittig) und näher ans Datum. */
.zeitler-blog-einleitung { margin-left: 0 !important; margin-top: 0 !important; }
.single-post .wp-block-post-date { margin-bottom: clamp(1.25rem, 2.5vw, 2rem) !important; }

/* Beiträge: Einleitung näher an Titel und Datum (Kanzlei 11.10.: „nach oben verschieben, bündig
   links"). Der Abstand kam aus dem Datum (margin-bottom am Element) plus dem Blockabstand vor dem
   Inhalt. */
.single-post .wp-block-post-date { margin-bottom: 0 !important; }
.single-post main > .wp-block-post-content { margin-top: clamp(1rem, 1.8vw, 1.4rem) !important; }
.single-post .zeitler-blog-einleitung { padding-top: 0 !important; } /* eine allgemeine Regel gab dem ersten Absatz 32 px Polsterung */


/* ---------- Blogbeiträge: „← Blog" über dem Titel, seit 11.10. ----------
   Wie „← Team" auf den Personenseiten (.zeitler-profil .zeitler-back) - steht in
   templates/single.html, gilt also für jeden Beitrag. */
.single-post .zeitler-back {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .19em;
	text-transform: uppercase;
	color: var(--zr-faint);
	margin: 0 0 1.1rem;
}
.single-post .zeitler-back a { color: var(--zr-faint) !important; text-decoration: none; }
.single-post .zeitler-back a:hover { color: var(--zr-accent) !important; }
.single-post .zeitler-back + .zeitler-page-title { margin-top: 0; }

/* FAQ-Beitrag: Verweis auf das Rechtsgebiet unter der Kontaktzeile (11.10.). */
.zeitler-blog-verweis { font-size: .9375rem; margin-top: .6rem !important; }


/* Karriere: die waagrechte Linie über „Was Sie bei uns erwartet" entfällt (Kanzlei 11.10.).
   Sie ist das ::before der dritten Zelle des Rasters (s. „Klappen → Linie darunter" oben);
   Abstände bleiben. Zurück: diese Regel löschen. */
.zeitler-spalten > .zeitler-teilgebiete-raster:first-child > .wp-block-column:nth-child(2n+1):nth-child(n+3)::before { content: none; }


/* Karriere: die senkrechte Linie zwischen den Spalten läuft ohne Lücke durch (Kanzlei 11.10.).
   Die Linie ist der linke Rand der rechten Zellen (2 und 4); die Lücke war der obere Außenabstand
   der Zelle 4, in dem kein Rand gezeichnet wird. Bei Zelle 4 wird er deshalb zum Innenabstand -
   der Text steht an derselben Stelle wie neben ihm in Zelle 3. Nur zweispaltig. */
@media (min-width: 782px) {
	.zeitler-spalten > .zeitler-teilgebiete-raster:first-child > .wp-block-column:nth-child(4) {
		margin-top: 0;
		padding-top: calc(2 * clamp(1rem, 2vw, 1.5rem));
	}
}


/* Karriere: Abstand vor „Was Sie bei uns erwartet" etwas kleiner (Kanzlei 11.10.). Seit die
   Linie darüber entfallen ist, ist er nur noch Abstand - beide Zellen der Reihe ohne Außenabstand,
   eine Polsterung (die senkrechte Linie läuft so weiter durch). Vorher 1,5 + 1,5rem. */
@media (min-width: 782px) {
	.zeitler-spalten > .zeitler-teilgebiete-raster:first-child > .wp-block-column:nth-child(n+3) {
		margin-top: 0;
		padding-top: clamp(1.1rem, 2vw, 1.75rem);
	}
}


/* ---------- Blog-Seite: „← News" über dem Seitentitel, seit 13.10. ----------
   Gestaltung wie „← Blog" auf den Beiträgen (.single-post .zeitler-back). */
.zeitler-blog .zeitler-back {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .19em;
	text-transform: uppercase;
	color: var(--zr-faint);
	margin: 0 0 1.1rem;
}
.zeitler-blog .zeitler-back a { color: var(--zr-faint) !important; text-decoration: none; }
.zeitler-blog .zeitler-back a:hover { color: var(--zr-accent) !important; }

/* ---------- News: „Alle Beiträge und Archiv →" neben „Blog", seit 13.10. ----------
   Vorher als letzte Zeile unten im Feld (.zeitler-news-mehr mit Linie darüber). */
.zeitler-news-kopfzeile {
	display: flex; justify-content: space-between; align-items: baseline; gap: 1rem;
	margin: 0 !important;
}
.zeitler-news-kopfzeile .zeitler-news-mehr { margin: 0 !important; padding-top: 0; border-top: 0; white-space: nowrap; }
.zeitler-news-kopfzeile + .zeitler-news-eintrag { margin-top: 1.3rem !important; }

/* ---------- Blog: „Zum Archiv →" unter dem letzten Beitrag jeder Kachel; Archiv je Rechtsgebiet,
   seit 13.10. ----------
   Der Verweis führt auf /category/<slug>/ (Vorlage templates/category.html): Kopf wie /blog/ mit
   „← Blog", darunter eine weiße Kachel mit allen Beiträgen des Rechtsgebiets. */
.zeitler-blog-zumarchiv {
	margin: 0 !important;
	padding-top: .8rem; border-top: 1px solid var(--zr-line);
	font-family: var(--wp--preset--font-family--sans); font-size: .9375rem;
}
.zeitler-blog-zumarchiv a { color: var(--zr-ink); text-decoration: none; }
.zeitler-blog-zumarchiv a:hover { color: var(--zr-accent); }
.zeitler-archiv-feld .zeitler-blog-gebiet { margin: 0; }
.zeitler-archiv-seiten { margin-top: .8rem; padding-top: .8rem; border-top: 1px solid var(--zr-line);
	font-family: var(--wp--preset--font-family--sans); font-size: .9375rem; }
.zeitler-archiv-seiten a { color: var(--zr-ink); text-decoration: none; }
.zeitler-archiv-seiten a:hover { color: var(--zr-accent); }
/* Archiv: Kachel im Raster der Blog-Seite, zwei Drittel breit (13.10., 3.210.0) */
.zeitler-archiv-felder { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) !important; }
@media (max-width: 860px) { .zeitler-archiv-felder { grid-template-columns: 1fr !important; } }

/* ---------- News: Termine im Feld „Aktuelle Vorträge & Seminare", seit 13.10. ----------
   Wie die Beitragszeilen im Feld „Blog" (.zeitler-news-neu): Pfeil, Titel, Datum darunter. */
.zeitler-news-termin-titel { margin: 0 !important; font-family: var(--wp--preset--font-family--sans); font-weight: 500; font-size: 1rem; line-height: 1.35; }
.zeitler-news-termin-titel a { color: var(--zr-ink); text-decoration: none; }
.zeitler-news-termin-titel a::before { content: "\2192\00a0"; color: var(--zr-accent); }
.zeitler-news-termin-titel a:hover { color: var(--zr-accent); }
/* Datum zuerst und so groß wie der Titel (Kanzlei, 13.10., 3.212.0) */
.zeitler-news-termin-datum { margin: 0 0 .2rem !important; font-family: var(--wp--preset--font-family--sans); font-size: 1rem; line-height: 1.35; }
/* Termin-Zeile „→ TT.MM.JJJJ: Titel": Datum etwas kleiner, mehr Luft nach dem Doppelpunkt (Kanzlei, 13.10.) */
.zeitler-news-termin-tag { font-size: .875rem; margin-right: .3em; }
/* Zweite Zeile eines Termins (z. B. Organisation): kleiner, bündig mit dem Text nach dem Pfeil (13.10.) */
.zeitler-news-termin-zusatz { margin: .3rem 0 0 1.3rem !important; font-family: var(--wp--preset--font-family--sans); font-size: .875rem; line-height: 1.4; }
.zeitler-news-termin-zusatz a { color: var(--zr-ink); text-decoration: none; }
.zeitler-news-termin-zusatz a:hover { color: var(--zr-accent); }
.zeitler-news-termin-titel { padding-left: 1.3rem; text-indent: -1.3rem; }
/* Termin ohne Verweis: Pfeil wie bei den verlinkten (13.10.) */
.zeitler-news-termin-text::before { content: "\2192\00a0"; color: var(--zr-accent); }
/* Dunkles Erscheinungsbild: Felder auf /news/ und /blog/ (18.10.). Sie trugen festes Weiß, die
   Schrift wurde aber hell - Überschriften unlesbar. Gleicher Ton wie die Felder auf /expertise/. */
@media (prefers-color-scheme: dark) {
	.zeitler-news-feld,
	.zeitler-blog-feld { background: rgba(233, 234, 227, .06); }
}
