/* =========================================================================
   Rohrtechinliner — Design-System
   -------------------------------------------------------------------------
   Aufbau der Datei:
     1  Grundlagen (Variablen, Reset, Typografie)
     2  Layout (Container, Abschnitte, Raster)
     3  Bausteine (Buttons, Karten, Badges, Formulare)
     4  Kopfbereich und Navigation
     5  Startseiten-Abschnitte
     6  Inhaltsseiten (Leistung, Ratgeber)
     7  Fußbereich
     8  Notdienst-Elemente
     9  Barrierefreiheit und Druck

   Farben kommen als CSS-Variablen aus dem Backend. Diese Datei bitte nicht
   bearbeiten — eigenes CSS gehört unter „Rohrtechinliner → Design“.
   ========================================================================= */

/* =========================================================================
   1  Grundlagen
   ========================================================================= */

:root {
	/* Vorgaben; werden von den Backend-Einstellungen überschrieben. */
	--rti-primary: #0e2a47;
	--rti-primary-rgb: 14, 42, 71;
	--rti-primary-ink: #ffffff;
	--rti-accent: #cc4b00;
	--rti-accent-rgb: 204, 75, 0;
	--rti-accent-ink: #ffffff;
	--rti-emergency: #c81e1e;
	--rti-emergency-rgb: 200, 30, 30;
	--rti-emergency-ink: #ffffff;
	--rti-surface: #f4f7fa;
	--rti-text: #16202b;
	--rti-radius: 14px;

	/* Abgeleitete Töne. */
	--rti-ink-soft: #4a5765;
	--rti-ink-faint: #6b7785;
	--rti-line: #dde4ec;
	--rti-line-soft: #eaeff5;
	--rti-white: #ffffff;
	--rti-success: #0f7b44;

	/* Abstände — eine Skala, überall dieselbe. */
	--rti-s1: 4px;
	--rti-s2: 8px;
	--rti-s3: 12px;
	--rti-s4: 16px;
	--rti-s5: 24px;
	--rti-s6: 32px;
	--rti-s7: 48px;
	--rti-s8: 64px;
	--rti-s9: 96px;

	/* Breiten. */
	--rti-wide: 1240px;
	--rti-narrow: 760px;

	/* Schatten — sparsam, nie als Dekoration. */
	--rti-shadow-sm: 0 1px 2px rgba(16, 24, 32, .06), 0 2px 8px rgba(16, 24, 32, .04);
	--rti-shadow-md: 0 4px 12px rgba(16, 24, 32, .08), 0 12px 28px rgba(16, 24, 32, .06);
	--rti-shadow-lg: 0 12px 32px rgba(16, 24, 32, .12), 0 32px 64px rgba(16, 24, 32, .08);

	/* Schrift — Systemschriften: schnell, DSGVO-frei, kein Fremdserver. */
	--rti-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif;
	--rti-font-num: ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", Menlo, monospace;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: 96px;
}

body.rti {
	margin: 0;
	font-family: var(--rti-font);
	font-size: 17px;
	line-height: 1.65;
	color: var(--rti-text);
	background: var(--rti-white);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	/*
	 * Kein overflow-x hier. „hidden“ auf html oder body erzeugt einen
	 * Scroll-Container und setzt damit die klebende Kopfleiste außer
	 * Kraft. Das Abschneiden übernimmt weiter unten „overflow-x: clip“,
	 * das genau diesen Nebeneffekt nicht hat.
	 */
}

.rti img,
.rti svg,
.rti video {
	max-width: 100%;
	height: auto;
	display: block;
}

.rti h1,
.rti h2,
.rti h3,
.rti h4,
.rti h5 {
	font-weight: 750;
	line-height: 1.18;
	letter-spacing: -.021em;
	color: var(--rti-primary);
	margin: 0 0 var(--rti-s4);
	text-wrap: balance;
}

.rti h1 { font-size: clamp(2rem, 1.35rem + 2.6vw, 3.4rem); }
.rti h2 { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.4rem); }
.rti h3 { font-size: clamp(1.25rem, 1.08rem + .72vw, 1.6rem); }
.rti h4 { font-size: 1.14rem; letter-spacing: -.01em; }

.rti p { margin: 0 0 var(--rti-s4); }
.rti p:last-child { margin-bottom: 0; }

.rti a {
	color: var(--rti-accent);
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color .16s ease;
}
.rti a:hover { color: var(--rti-primary); }

.rti strong { font-weight: 700; color: var(--rti-primary); }

.rti ul,
.rti ol { margin: 0 0 var(--rti-s4); padding-left: 1.35em; }
.rti li { margin-bottom: var(--rti-s2); }

.rti hr {
	border: 0;
	border-top: 1px solid var(--rti-line);
	margin: var(--rti-s7) 0;
}

.rti blockquote {
	margin: var(--rti-s6) 0;
	padding: var(--rti-s5) var(--rti-s6);
	border-left: 4px solid var(--rti-accent);
	background: var(--rti-surface);
	border-radius: 0 var(--rti-radius) var(--rti-radius) 0;
	font-size: 1.06em;
}
.rti blockquote p:last-child { margin-bottom: 0; }

.rti code {
	font-family: var(--rti-font-num);
	font-size: .9em;
	background: var(--rti-surface);
	padding: .15em .4em;
	border-radius: 5px;
}

/* Kleintext, Hinweise, Quellenangaben. */
.rti-fineprint {
	font-size: .875rem;
	line-height: 1.55;
	color: var(--rti-ink-faint);
}

.rti-lead {
	font-size: clamp(1.08rem, 1.02rem + .35vw, 1.28rem);
	line-height: 1.6;
	color: var(--rti-ink-soft);
}

/* =========================================================================
   2  Layout
   ========================================================================= */

.rti-wrap {
	width: 100%;
	max-width: var(--rti-wide);
	margin-inline: auto;
	padding-inline: var(--rti-s5);
}

.rti-wrap--narrow { max-width: var(--rti-narrow); }

.rti-section { padding-block: clamp(3rem, 2rem + 4.4vw, 5.5rem); }
.rti-section--tight { padding-block: clamp(2rem, 1.4rem + 2.6vw, 3.5rem); }
.rti-section--surface { background: var(--rti-surface); }
.rti-section--dark {
	background: var(--rti-primary);
	color: rgba(255, 255, 255, .82);
}
.rti-section--dark h2,
.rti-section--dark h3,
.rti-section--dark h4 { color: #fff; }

/* Abschnittskopf. */
.rti-head { max-width: 720px; margin-bottom: var(--rti-s7); }
.rti-head--center { margin-inline: auto; text-align: center; }
.rti-head p:last-child { margin-bottom: 0; }

.rti-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: var(--rti-s2);
	font-size: .8rem;
	font-weight: 750;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--rti-accent);
	margin-bottom: var(--rti-s3);
}
.rti-eyebrow::before {
	content: "";
	width: 26px;
	height: 2px;
	background: currentColor;
	flex: none;
}
.rti-head--center .rti-eyebrow::before { display: none; }
.rti-section--dark .rti-eyebrow { color: #ffb27a; }

/* Raster. */
.rti-grid { display: grid; gap: var(--rti-s5); }
.rti-grid--2 { grid-template-columns: repeat(2, 1fr); }
.rti-grid--3 { grid-template-columns: repeat(3, 1fr); }
.rti-grid--4 { grid-template-columns: repeat(4, 1fr); }

.rti-split {
	display: grid;
	grid-template-columns: 1.05fr .95fr;
	gap: clamp(2rem, 1rem + 4vw, 4.5rem);
	align-items: center;
}
.rti-split--media-first .rti-split__media { order: -1; }

@media (max-width: 1000px) {
	.rti-grid--4 { grid-template-columns: repeat(2, 1fr); }
	.rti-grid--3 { grid-template-columns: repeat(2, 1fr); }
	.rti-split { grid-template-columns: 1fr; }
	.rti-split--media-first .rti-split__media { order: 0; }
}

@media (max-width: 640px) {
	.rti-grid--2,
	.rti-grid--3,
	.rti-grid--4 { grid-template-columns: 1fr; }
	.rti-wrap { padding-inline: var(--rti-s4); }
}

/* =========================================================================
   3  Bausteine
   ========================================================================= */

/* ---- Buttons ---- */
.rti-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--rti-s2);
	padding: 15px 26px;
	border: 2px solid transparent;
	border-radius: calc(var(--rti-radius) - 4px);
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: transform .14s ease, box-shadow .14s ease, background-color .14s ease, border-color .14s ease, color .14s ease;

	/*
	 * Buttons dürfen umbrechen statt zu überlaufen. „nowrap“ war hier
	 * falsch: Eine lange Beschriftung — etwa eine Rufnummer — hat damit
	 * auf schmalen Geräten die ganze Zeile aus dem Bildschirm geschoben.
	 */
	max-width: 100%;
	text-align: center;
	overflow-wrap: break-word;
	hyphens: auto;
}
.rti-btn:hover { transform: translateY(-1px); }
.rti-btn:active { transform: translateY(0); }
.rti-btn .rti-icon { width: 20px; height: 20px; fill: currentColor; }

.rti-btn--primary {
	background: var(--rti-accent);
	color: var(--rti-accent-ink);
	box-shadow: 0 4px 14px rgba(var(--rti-accent-rgb), .28);
}
.rti-btn--primary:hover {
	background: var(--rti-accent);
	color: var(--rti-accent-ink);
	box-shadow: 0 8px 22px rgba(var(--rti-accent-rgb), .38);
	filter: brightness(1.07);
}

.rti-btn--emergency {
	background: var(--rti-emergency);
	color: var(--rti-emergency-ink);
	box-shadow: 0 4px 14px rgba(var(--rti-emergency-rgb), .3);
}
.rti-btn--emergency:hover {
	color: var(--rti-emergency-ink);
	box-shadow: 0 8px 22px rgba(var(--rti-emergency-rgb), .4);
	filter: brightness(1.07);
}

.rti-btn--dark {
	background: var(--rti-primary);
	color: var(--rti-primary-ink);
}
.rti-btn--dark:hover { color: var(--rti-primary-ink); filter: brightness(1.18); }

.rti-btn--ghost {
	background: transparent;
	border-color: var(--rti-line);
	color: var(--rti-primary);
}
.rti-btn--ghost:hover {
	border-color: var(--rti-primary);
	background: var(--rti-primary);
	color: #fff;
}

.rti-btn--on-dark {
	background: rgba(255, 255, 255, .1);
	border-color: rgba(255, 255, 255, .34);
	color: #fff;
}
.rti-btn--on-dark:hover { background: #fff; color: var(--rti-primary); border-color: #fff; }

.rti-btn--wide { width: 100%; }
.rti-btn--lg { padding: 18px 32px; font-size: 1.06rem; }
.rti-btn--sm { padding: 10px 18px; font-size: .92rem; }

.rti-btn-row {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rti-s3);
	align-items: center;
}

/* ---- Badges ---- */
.rti-badge {
	display: inline-flex;
	align-items: center;
	gap: var(--rti-s2);
	padding: 6px 13px;
	border-radius: 100px;
	font-size: .82rem;
	font-weight: 700;
	line-height: 1.3;
	background: var(--rti-surface);
	color: var(--rti-primary);
}
.rti-badge .rti-icon { width: 15px; height: 15px; fill: currentColor; }

.rti-badge--emergency {
	background: rgba(var(--rti-emergency-rgb), .1);
	color: var(--rti-emergency);
}
.rti-badge--live {
	background: rgba(var(--rti-emergency-rgb), .12);
	color: var(--rti-emergency);
}
.rti-badge--on-dark {
	background: rgba(255, 255, 255, .13);
	color: #fff;
}

/* Pulsierender Punkt für „jetzt erreichbar“. */
.rti-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: currentColor;
	flex: none;
	position: relative;
}
.rti-dot::after {
	content: "";
	position: absolute;
	inset: -4px;
	border-radius: 50%;
	border: 2px solid currentColor;
	opacity: .5;
	animation: rti-pulse 2s ease-out infinite;
}
@keyframes rti-pulse {
	0%   { transform: scale(.6); opacity: .7; }
	100% { transform: scale(1.5); opacity: 0; }
}

/* ---- Karten ---- */
.rti-card {
	background: #fff;
	border: 1px solid var(--rti-line);
	border-radius: var(--rti-radius);
	padding: var(--rti-s6);
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.rti-card > :last-child { margin-bottom: 0; }
.rti-card--hover:hover {
	border-color: rgba(var(--rti-accent-rgb), .5);
	box-shadow: var(--rti-shadow-md);
	transform: translateY(-3px);
}
.rti-card--flat { background: var(--rti-surface); border-color: transparent; }

.rti-card__icon {
	width: 52px;
	height: 52px;
	display: grid;
	place-items: center;
	border-radius: 12px;
	background: rgba(var(--rti-accent-rgb), .1);
	margin-bottom: var(--rti-s4);
}
.rti-card__icon .rti-icon { width: 26px; height: 26px; fill: var(--rti-accent); }

.rti-card h3 { margin-bottom: var(--rti-s3); }
.rti-card p { color: var(--rti-ink-soft); }

/* Leistungskarte mit Bild. */
.rti-service {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	padding: 0;
	text-decoration: none;
	color: inherit;
	height: 100%;
}
.rti-service:hover { color: inherit; }
.rti-service__media {
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--rti-surface);
}
.rti-service__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .5s cubic-bezier(.2, .7, .3, 1);
}
.rti-service:hover .rti-service__media img { transform: scale(1.05); }
.rti-service__body {
	padding: var(--rti-s5) var(--rti-s5) var(--rti-s6);
	display: flex;
	flex-direction: column;
	flex: 1;
}
.rti-service__body h3 { font-size: 1.22rem; margin-bottom: var(--rti-s2); }
.rti-service__body p { font-size: .96rem; color: var(--rti-ink-soft); flex: 1; }
.rti-service__more {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: var(--rti-s4);
	font-weight: 700;
	font-size: .94rem;
	color: var(--rti-accent);
}
.rti-service__more .rti-icon { width: 17px; height: 17px; fill: currentColor; transition: transform .18s ease; }
.rti-service:hover .rti-service__more .rti-icon { transform: translateX(4px); }

/* ---- Merkmalliste mit Haken ---- */
.rti-checks { list-style: none; padding: 0; margin: 0 0 var(--rti-s5); }
.rti-checks li {
	position: relative;
	padding-left: 34px;
	margin-bottom: var(--rti-s3);
	line-height: 1.55;
}
.rti-checks li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .18em;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: rgba(var(--rti-accent-rgb), .12) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23cc4b00'%3E%3Cpath d='M9.55 17.6 4 12.05l1.4-1.4 4.15 4.15 9.05-9.05L20 7.15z'/%3E%3C/svg%3E") center / 14px no-repeat;
}
.rti-section--dark .rti-checks li::before {
	background-color: rgba(255, 255, 255, .16);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M9.55 17.6 4 12.05l1.4-1.4 4.15 4.15 9.05-9.05L20 7.15z'/%3E%3C/svg%3E");
}

/* ---- Kennzahlen ---- */
.rti-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--rti-s5);
}
.rti-stat { text-align: center; }
.rti-stat__value {
	display: block;
	font-size: clamp(2rem, 1.5rem + 2vw, 2.9rem);
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -.03em;
	color: var(--rti-accent);
}
.rti-stat__label {
	display: block;
	margin-top: var(--rti-s2);
	font-size: .9rem;
	font-weight: 600;
	color: var(--rti-ink-soft);
}
.rti-section--dark .rti-stat__label { color: rgba(255, 255, 255, .72); }
.rti-section--dark .rti-stat__value { color: #fff; }

@media (max-width: 700px) {
	.rti-stats { grid-template-columns: repeat(2, 1fr); gap: var(--rti-s6) var(--rti-s4); }
}

/* ---- Ablauf / Prozessschritte ---- */
.rti-steps {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--rti-s5);
	counter-reset: rti-step;
	list-style: none;
	padding: 0;
	margin: 0;
}
.rti-step {
	position: relative;
	counter-increment: rti-step;
	padding-top: var(--rti-s6);
	margin: 0;
}
.rti-step::before {
	content: counter(rti-step, decimal-leading-zero);
	position: absolute;
	top: 0;
	left: 0;
	font-family: var(--rti-font-num);
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--rti-accent);
	letter-spacing: .06em;
}
.rti-step::after {
	content: "";
	position: absolute;
	top: 10px;
	left: 44px;
	right: -14px;
	height: 1px;
	background: repeating-linear-gradient(to right, var(--rti-line) 0 6px, transparent 6px 12px);
}
.rti-step:last-child::after { display: none; }
.rti-step h3 { font-size: 1.1rem; margin-bottom: var(--rti-s2); }
.rti-step p { font-size: .95rem; color: var(--rti-ink-soft); margin: 0; }

@media (max-width: 900px) {
	.rti-steps { grid-template-columns: repeat(2, 1fr); gap: var(--rti-s6) var(--rti-s5); }
	.rti-step::after { display: none; }
}
@media (max-width: 520px) {
	.rti-steps { grid-template-columns: 1fr; }
}

/* ---- Akkordeon / FAQ ---- */
.rti-faq { display: grid; gap: var(--rti-s3); }

.rti-faq__item {
	border: 1px solid var(--rti-line);
	border-radius: var(--rti-radius);
	background: #fff;
	overflow: hidden;
	transition: border-color .18s ease, box-shadow .18s ease;
}
.rti-faq__item[open] {
	border-color: rgba(var(--rti-accent-rgb), .42);
	box-shadow: var(--rti-shadow-sm);
}

.rti-faq__q {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--rti-s4);
	padding: var(--rti-s5) var(--rti-s6);
	font-size: 1.06rem;
	font-weight: 700;
	color: var(--rti-primary);
	cursor: pointer;
	list-style: none;
	line-height: 1.4;
}
.rti-faq__q::-webkit-details-marker { display: none; }
.rti-faq__q:hover { color: var(--rti-accent); }

.rti-faq__q::after {
	content: "";
	flex: none;
	width: 22px;
	height: 22px;
	margin-top: 2px;
	background: currentColor;
	transition: transform .22s ease;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 15.4 5.6 9l1.4-1.4 5 5 5-5L18.4 9z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 15.4 5.6 9l1.4-1.4 5 5 5-5L18.4 9z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.rti-faq__item[open] .rti-faq__q::after { transform: rotate(180deg); }

.rti-faq__a {
	padding: 0 var(--rti-s6) var(--rti-s5);
	color: var(--rti-ink-soft);
}
.rti-faq__a > :last-child { margin-bottom: 0; }

/* ---- Hinweiskästen ---- */
.rti-note {
	display: flex;
	gap: var(--rti-s4);
	padding: var(--rti-s5);
	border-radius: var(--rti-radius);
	background: var(--rti-surface);
	border-left: 4px solid var(--rti-primary);
	margin: var(--rti-s6) 0;
}
.rti-note__icon { flex: none; }
.rti-note__icon .rti-icon { width: 24px; height: 24px; fill: var(--rti-primary); }
.rti-note__body > :last-child { margin-bottom: 0; }
.rti-note__title { font-weight: 750; color: var(--rti-primary); margin-bottom: var(--rti-s2); }

.rti-note--warn {
	background: rgba(var(--rti-emergency-rgb), .06);
	border-left-color: var(--rti-emergency);
}
.rti-note--warn .rti-note__icon .rti-icon,
.rti-note--warn .rti-note__title { fill: var(--rti-emergency); color: var(--rti-emergency); }

.rti-note--tip {
	background: rgba(var(--rti-accent-rgb), .07);
	border-left-color: var(--rti-accent);
}
.rti-note--tip .rti-note__icon .rti-icon,
.rti-note--tip .rti-note__title { fill: var(--rti-accent); color: var(--rti-accent); }

/* ---- Tabellen ---- */
.rti-table-scroll {
	overflow-x: auto;
	margin: var(--rti-s6) 0;
	border: 1px solid var(--rti-line);
	border-radius: var(--rti-radius);
	-webkit-overflow-scrolling: touch;
}
.rti-table-scroll table { margin: 0; border: 0; }

.rti table {
	width: 100%;
	border-collapse: collapse;
	font-size: .96rem;
	background: #fff;
}
.rti th,
.rti td {
	padding: var(--rti-s3) var(--rti-s4);
	text-align: left;
	border-bottom: 1px solid var(--rti-line-soft);
	vertical-align: top;
}
.rti thead th {
	background: var(--rti-primary);
	color: #fff;
	font-weight: 700;
	font-size: .88rem;
	letter-spacing: .015em;
	border-bottom: 0;
	white-space: nowrap;
}
.rti tbody tr:last-child td { border-bottom: 0; }
.rti tbody tr:nth-child(even) { background: rgba(var(--rti-primary-rgb), .022); }
.rti td:first-child { font-weight: 600; color: var(--rti-primary); }

/* ---- Formulare ---- */
.rti-form { display: grid; gap: var(--rti-s4); }
.rti-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--rti-s4); }
@media (max-width: 600px) { .rti-form__row { grid-template-columns: 1fr; } }

.rti-field label {
	display: block;
	font-size: .92rem;
	font-weight: 650;
	color: var(--rti-primary);
	margin-bottom: 6px;
}
.rti-field .rti-req { color: var(--rti-emergency); }

.rti-field input[type="text"],
.rti-field input[type="email"],
.rti-field input[type="tel"],
.rti-field select,
.rti-field textarea {
	width: 100%;
	padding: 13px 15px;
	font-family: inherit;
	font-size: 1rem;
	color: var(--rti-text);
	background: #fff;
	border: 1.5px solid var(--rti-line);
	border-radius: calc(var(--rti-radius) - 5px);
	transition: border-color .16s ease, box-shadow .16s ease;
}
.rti-field textarea { min-height: 150px; resize: vertical; }

.rti-field input:focus,
.rti-field select:focus,
.rti-field textarea:focus {
	outline: none;
	border-color: var(--rti-accent);
	box-shadow: 0 0 0 3px rgba(var(--rti-accent-rgb), .16);
}

.rti-consent {
	display: flex;
	gap: var(--rti-s3);
	align-items: flex-start;
	font-size: .9rem;
	line-height: 1.5;
	color: var(--rti-ink-soft);
}
.rti-consent input { margin-top: .25em; flex: none; width: 18px; height: 18px; accent-color: var(--rti-accent); }

/* Honigtopf — für Menschen unsichtbar, für Bots sichtbar. */
.rti-hp {
	position: absolute !important;
	left: -9999px !important;
	opacity: 0;
	height: 0;
	overflow: hidden;
}

.rti-alert {
	padding: var(--rti-s4) var(--rti-s5);
	border-radius: calc(var(--rti-radius) - 4px);
	font-weight: 600;
}
.rti-alert--ok { background: rgba(15, 123, 68, .1); color: #0b5c33; }
.rti-alert--err { background: rgba(var(--rti-emergency-rgb), .1); color: var(--rti-emergency); }

/* =========================================================================
   4  Kopfbereich und Navigation
   ========================================================================= */

/* ---- Servicezeile ganz oben ---- */
.rti-topbar {
	background: var(--rti-primary);
	color: rgba(255, 255, 255, .82);
	font-size: .86rem;
	line-height: 1.4;
}
.rti-topbar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--rti-s5);
	min-height: 42px;
	padding-block: 6px;
}
.rti-topbar__list {
	display: flex;
	align-items: center;
	gap: var(--rti-s5);
	list-style: none;
	margin: 0;
	padding: 0;
	flex-wrap: wrap;
}
.rti-topbar__list li { display: flex; align-items: center; gap: 7px; margin: 0; }
.rti-topbar .rti-icon { width: 15px; height: 15px; fill: rgba(255, 255, 255, .6); }
.rti-topbar a { color: #fff; text-decoration: none; font-weight: 600; }
.rti-topbar a:hover { color: #fff; text-decoration: underline; }

@media (max-width: 880px) { .rti-topbar { display: none; } }

/* ---- Kopfleiste ---- */
.rti-header {
	position: sticky;
	top: 0;
	z-index: 90;
	background: rgba(255, 255, 255, .96);
	backdrop-filter: saturate(1.6) blur(10px);
	border-bottom: 1px solid var(--rti-line-soft);
	transition: box-shadow .2s ease;
}
.rti-header.is-stuck { box-shadow: var(--rti-shadow-sm); }

.rti-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--rti-s5);
	min-height: 78px;
	padding-block: var(--rti-s3);
}

/* ---- Wortmarke ---- */
.rti-brand {
	display: inline-flex;
	align-items: center;
	gap: var(--rti-s3);
	text-decoration: none;
	flex: none;
}
.rti-brand img { max-height: 52px; width: auto; }
.rti-brand__mark {
	width: 42px;
	height: 42px;
	flex: none;
	border-radius: 10px;
	background: var(--rti-primary);
	display: grid;
	place-items: center;
}
.rti-brand__mark svg { width: 24px; height: 24px; fill: #fff; }
.rti-brand__text { display: flex; flex-direction: column; line-height: 1.15; }
.rti-brand__name {
	font-size: 1.16rem;
	font-weight: 800;
	letter-spacing: -.02em;
	color: var(--rti-primary);
}
.rti-brand__claim {
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--rti-ink-faint);
}

/* ---- Hauptnavigation ---- */
.rti-nav { margin-left: auto; }
.rti-nav ul {
	display: flex;
	align-items: center;
	gap: var(--rti-s2);
	list-style: none;
	margin: 0;
	padding: 0;
}
.rti-nav li { margin: 0; position: relative; }
.rti-nav a {
	display: block;
	padding: 10px 14px;
	border-radius: 8px;
	font-size: .97rem;
	font-weight: 650;
	color: var(--rti-primary);
	text-decoration: none;
	white-space: nowrap;
	transition: background-color .14s ease, color .14s ease;
}
.rti-nav a:hover { background: var(--rti-surface); color: var(--rti-accent); }
.rti-nav .current-menu-item > a,
.rti-nav .current_page_item > a,
.rti-nav .current-menu-ancestor > a { color: var(--rti-accent); }

/* Untermenü. */
.rti-nav .sub-menu {
	position: absolute;
	top: calc(100% + 8px);
	left: 0;
	min-width: 250px;
	flex-direction: column;
	align-items: stretch;
	gap: 0;
	padding: var(--rti-s2);
	background: #fff;
	border: 1px solid var(--rti-line);
	border-radius: var(--rti-radius);
	box-shadow: var(--rti-shadow-md);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
.rti-nav li:hover > .sub-menu,
.rti-nav li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.rti-nav .sub-menu a { padding: 10px 13px; font-weight: 600; font-size: .94rem; }

.rti-header__cta { display: flex; align-items: center; gap: var(--rti-s3); flex: none; }

/* ---- Menüschalter (mobil) ---- */
.rti-burger {
	display: none;
	width: 48px;
	height: 48px;
	flex: none;
	padding: 0;
	border: 1.5px solid var(--rti-line);
	border-radius: 10px;
	background: #fff;
	cursor: pointer;
	place-items: center;
}
.rti-burger__bars {
	display: block;
	width: 20px;
	height: 2px;
	background: var(--rti-primary);
	position: relative;
	transition: background-color .16s ease;
}
.rti-burger__bars::before,
.rti-burger__bars::after {
	content: "";
	position: absolute;
	left: 0;
	width: 20px;
	height: 2px;
	background: var(--rti-primary);
	transition: transform .2s ease, top .2s ease;
}
.rti-burger__bars::before { top: -6px; }
.rti-burger__bars::after { top: 6px; }
.rti-burger[aria-expanded="true"] .rti-burger__bars { background: transparent; }
.rti-burger[aria-expanded="true"] .rti-burger__bars::before { top: 0; transform: rotate(45deg); }
.rti-burger[aria-expanded="true"] .rti-burger__bars::after { top: 0; transform: rotate(-45deg); }

/* Kontaktblock im mobilen Menü — auf großen Bildschirmen nicht sichtbar. */
.rti-nav__contact { display: none; }

@media (max-width: 1080px) {
	.rti-burger { display: grid; }
	.rti-header__inner { min-height: 68px; gap: var(--rti-s3); }

	/*
	 * Reihenfolge der Ebenen — hier lag der Fehler:
	 * Die Kopfleiste muss ÜBER dem Menü liegen, sonst verdeckt das
	 * ausgefahrene Menü den Schalter, mit dem man es wieder schließt.
	 *
	 *   Kopfleiste 100  >  Menü 95  >  Abdunklung 90  >  Anrufleiste 88
	 */
	/*
	 * backdrop-filter MUSS hier weg — und das ist kein Schönheitsgrund.
	 *
	 * Ein Element mit backdrop-filter (genau wie mit filter oder
	 * transform) wird zum Bezugsrahmen für alle Nachfahren mit
	 * position: fixed. Das Menü hat sich dadurch nicht am Bildschirm
	 * ausgerichtet, sondern an der nur rund 68 Pixel hohen Kopfleiste —
	 * es klappte auf und war ein Streifen hoch.
	 *
	 * Ohne backdrop-filter ist die Kopfleiste wieder ein gewöhnliches
	 * Element, und das Menü bezieht sich korrekt auf den Bildschirm.
	 * Auf dem Telefon spart die Weichzeichnung ohnehin keine Arbeit,
	 * sondern kostet sie.
	 */
	.rti-header {
		z-index: 100;
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
		background: #fff;
	}

	.rti-nav {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: auto;

		/* Volle Bildschirmhöhe, auch wenn die Adressleiste ein- und ausfährt. */
		height: 100vh;
		height: 100dvh;

		width: min(380px, 90vw);
		max-width: 100vw;
		background: #fff;
		border-left: 1px solid var(--rti-line);
		padding: 84px var(--rti-s5) var(--rti-s7);
		overflow-y: auto;
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
		transform: translateX(100%);
		transition: transform .26s cubic-bezier(.32, .72, 0, 1);
		box-shadow: var(--rti-shadow-lg);
		z-index: 95;
		visibility: hidden;

		/* Der Kontaktblock sitzt am Fuß, die Links oben. */
		display: flex;
		flex-direction: column;
	}
	.rti-nav > ul { flex: 1 0 auto; }
	.rti-nav.is-open { transform: translateX(0); visibility: visible; }

	.rti-nav ul { flex-direction: column; align-items: stretch; gap: 0; }
	.rti-nav li { width: 100%; }
	.rti-nav a {
		padding: 15px 14px;
		font-size: 1.04rem;
		border-bottom: 1px solid var(--rti-line-soft);
		border-radius: 0;
		white-space: normal;
	}
	.rti-nav .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border: 0;
		border-left: 2px solid var(--rti-line);
		border-radius: 0;
		margin: 0 0 var(--rti-s2) var(--rti-s4);
		padding: 0;
		min-width: 0;
	}
	.rti-nav .sub-menu a { border-bottom: 0; font-size: .96rem; padding: 12px 14px; }

	.rti-nav__contact {
		display: grid;
		gap: var(--rti-s3);
		margin-top: var(--rti-s6);
		padding-top: var(--rti-s5);
		border-top: 1px solid var(--rti-line);
	}
	.rti-nav__hours {
		margin: 0;
		font-size: .85rem;
		color: var(--rti-ink-faint);
		text-align: center;
	}

	/* Im Kopfbereich bleibt auf dem Telefon nur der Anruf-Knopf. */
	.rti-header__cta .rti-btn--ghost { display: none; }

	.rti-scrim {
		position: fixed;
		inset: 0;
		background: rgba(10, 20, 30, .5);
		opacity: 0;
		visibility: hidden;
		transition: opacity .24s ease, visibility .24s;
		z-index: 90;
	}
	.rti-scrim.is-open { opacity: 1; visibility: visible; }
}

/*
 * Schmale Telefone. Der Anruf-Knopf darf hier niemals die Zeile sprengen:
 * Er schrumpft, und die Beschriftung wird notfalls gekürzt statt zu
 * überlaufen.
 */
@media (max-width: 600px) {
	.rti-brand__claim { display: none; }
	.rti-brand__name { font-size: 1rem; }
	.rti-brand img { max-height: 40px; }
	.rti-brand__mark { width: 36px; height: 36px; }

	.rti-header__inner { gap: var(--rti-s2); }
	.rti-header__cta { gap: var(--rti-s2); min-width: 0; }

	.rti-header__cta .rti-btn--call {
		min-width: 0;
		padding: 12px 14px;
		font-size: .95rem;
	}
	.rti-header__cta .rti-btn--call .rti-btn__label {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
}

/* Sehr schmale Geräte: nur noch das Hörersymbol. */
@media (max-width: 400px) {
	.rti-header__cta .rti-btn--call .rti-btn__label { display: none; }
	.rti-header__cta .rti-btn--call { padding: 12px; }
	.rti-header__cta .rti-btn--call .rti-icon { margin: 0; }
}

/* =========================================================================
   5  Startseiten-Abschnitte
   ========================================================================= */

/* ---- Hero ---- */
.rti-hero {
	position: relative;
	background: var(--rti-primary);
	color: #fff;
	overflow: hidden;
	isolation: isolate;
}
.rti-hero__bg {
	position: absolute;
	inset: 0;
	z-index: -2;
}
.rti-hero__bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 42%;
}
/*
 * Die Deckkraft kommt aus den Einstellungen (Reiter „Bilder“). Damit
 * lässt sich jedes Foto so weit abdunkeln, dass die Überschrift sicher
 * lesbar bleibt — auch ein unruhiges.
 */
.rti-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(100deg,
		rgba(var(--rti-primary-rgb), calc(var(--rti-hero-overlay) + .1)) 0%,
		rgba(var(--rti-primary-rgb), var(--rti-hero-overlay)) 42%,
		rgba(var(--rti-primary-rgb), calc(var(--rti-hero-overlay) * .62)) 78%,
		rgba(var(--rti-primary-rgb), calc(var(--rti-hero-overlay) * .42)) 100%);
}
@media (max-width: 820px) {
	/* Hochkant liegt der Text über der Bildmitte — dort muss es dichter sein. */
	.rti-hero::before {
		background: linear-gradient(180deg,
			rgba(var(--rti-primary-rgb), calc(var(--rti-hero-overlay) + .08)) 0%,
			rgba(var(--rti-primary-rgb), calc(var(--rti-hero-overlay) + .04)) 60%,
			rgba(var(--rti-primary-rgb), calc(var(--rti-hero-overlay) + .1)) 100%);
	}
}

.rti-hero__inner {
	position: relative;
	padding-block: clamp(3.5rem, 2.4rem + 5vw, 6.5rem);
	max-width: 720px;
}
.rti-hero h1 { color: #fff; margin-bottom: var(--rti-s5); }
.rti-hero__sub {
	font-size: clamp(1.05rem, 1rem + .4vw, 1.24rem);
	line-height: 1.6;
	color: rgba(255, 255, 255, .88);
	margin-bottom: var(--rti-s6);
	max-width: 60ch;
}

.rti-hero__badges {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rti-s2);
	margin-bottom: var(--rti-s5);
}

.rti-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rti-s3);
	margin-bottom: var(--rti-s6);
}

.rti-hero__usps {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rti-s3) var(--rti-s6);
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: .95rem;
	color: rgba(255, 255, 255, .9);
}
.rti-hero__usps li {
	display: flex;
	align-items: center;
	gap: var(--rti-s2);
	margin: 0;
}
.rti-hero__usps .rti-icon { width: 18px; height: 18px; fill: #7ee2a8; flex: none; }

/* ---- Notdienst-Band ---- */
.rti-emergency-band {
	background: var(--rti-emergency);
	color: var(--rti-emergency-ink);
}
.rti-emergency-band__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--rti-s5);
	padding-block: var(--rti-s5);
	flex-wrap: wrap;
}
.rti-emergency-band__text { display: flex; align-items: center; gap: var(--rti-s4); }
.rti-emergency-band__icon {
	width: 48px;
	height: 48px;
	flex: none;
	border-radius: 50%;
	background: rgba(255, 255, 255, .18);
	display: grid;
	place-items: center;
}
.rti-emergency-band__icon .rti-icon { width: 26px; height: 26px; fill: currentColor; }
.rti-emergency-band strong { display: block; color: inherit; font-size: 1.14rem; line-height: 1.3; }
.rti-emergency-band span { font-size: .95rem; opacity: .9; }
.rti-emergency-band .rti-btn {
	background: #fff;
	color: var(--rti-emergency);
	border-color: #fff;
}
.rti-emergency-band .rti-btn:hover { background: #fff; color: var(--rti-emergency); filter: none; box-shadow: var(--rti-shadow-md); }

@media (max-width: 760px) {
	.rti-emergency-band__inner { flex-direction: column; align-items: stretch; text-align: left; }
	.rti-emergency-band .rti-btn { width: 100%; }
}

/* ---- Vertrauensleiste ---- */
.rti-trustbar {
	border-block: 1px solid var(--rti-line-soft);
	background: #fff;
}
.rti-trustbar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--rti-s5);
	padding-block: var(--rti-s5);
	flex-wrap: wrap;
}
.rti-trustbar__item {
	display: flex;
	align-items: center;
	gap: var(--rti-s3);
	font-size: .94rem;
	font-weight: 600;
	color: var(--rti-primary);
	flex: 1 1 220px;
}
.rti-trustbar__item .rti-icon { width: 26px; height: 26px; fill: var(--rti-accent); flex: none; }

/* ---- Bild-Text-Abschnitt ---- */
.rti-split__media img { border-radius: var(--rti-radius); box-shadow: var(--rti-shadow-md); }
.rti-split__media figure { margin: 0; }
.rti-split__media figcaption {
	margin-top: var(--rti-s3);
	font-size: .86rem;
	color: var(--rti-ink-faint);
}

/* ---- Handlungsaufforderung ---- */
.rti-cta {
	position: relative;
	background: var(--rti-primary);
	color: rgba(255, 255, 255, .86);
	border-radius: var(--rti-radius);
	padding: clamp(2rem, 1.4rem + 3vw, 3.5rem);
	overflow: hidden;
}
.rti-cta::after {
	content: "";
	position: absolute;
	right: -80px;
	top: -80px;
	width: 320px;
	height: 320px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(var(--rti-accent-rgb), .3) 0%, transparent 68%);
	pointer-events: none;
}
.rti-cta h2 { color: #fff; }
.rti-cta__inner {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--rti-s7);
	flex-wrap: wrap;
}
.rti-cta__text { flex: 1 1 420px; }
.rti-cta__text > :last-child { margin-bottom: 0; }
.rti-cta__actions { display: flex; flex-direction: column; gap: var(--rti-s3); flex: none; }
.rti-cta__actions .rti-btn { justify-content: center; }

@media (max-width: 720px) {
	.rti-cta__actions { width: 100%; }
}

/* ---- Einsatzgebiete ---- */
.rti-areas {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rti-s2);
	list-style: none;
	margin: 0;
	padding: 0;
}
.rti-areas li { margin: 0; }
.rti-areas span,
.rti-areas a {
	display: inline-block;
	padding: 8px 15px;
	border-radius: 100px;
	background: #fff;
	border: 1px solid var(--rti-line);
	font-size: .92rem;
	font-weight: 600;
	color: var(--rti-primary);
	text-decoration: none;
}
.rti-areas a:hover { border-color: var(--rti-accent); color: var(--rti-accent); }

/* =========================================================================
   6  Inhaltsseiten
   ========================================================================= */

/* ---- Brotkrumen ---- */
.rti-crumbs {
	padding-block: var(--rti-s4);
	font-size: .86rem;
	color: var(--rti-ink-faint);
}
.rti-crumbs ol {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rti-s2);
	list-style: none;
	margin: 0;
	padding: 0;
}
.rti-crumbs li { display: flex; align-items: center; gap: var(--rti-s2); margin: 0; }
.rti-crumbs li + li::before { content: "›"; color: var(--rti-line); }
.rti-crumbs a { color: var(--rti-ink-faint); text-decoration: none; }
.rti-crumbs a:hover { color: var(--rti-accent); text-decoration: underline; }
.rti-crumbs [aria-current] { color: var(--rti-primary); font-weight: 600; }

/* ---- Seitenkopf ---- */
.rti-pagehead {
	background: var(--rti-surface);
	padding-block: clamp(2.5rem, 1.8rem + 3vw, 4.5rem);
	border-bottom: 1px solid var(--rti-line-soft);
}
/*
 * Seitenkopf mit Bild. Greift nur, wenn im Editor unter „Kopfbild dieser
 * Seite“ eines hinterlegt wurde — ohne Bild bleibt es beim ruhigen
 * Farbband, damit sich bestehende Seiten nicht ungefragt verändern.
 */
.rti-pagehead--image {
	position: relative;
	isolation: isolate;
	background: var(--rti-primary);
	border-bottom: 0;
	color: rgba(255, 255, 255, .88);
}
.rti-pagehead--image::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -2;
	background-image: var(--rti-pagehead-image);
	background-size: cover;
	background-position: center;
}
.rti-pagehead--image::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(100deg,
		rgba(var(--rti-primary-rgb), calc(var(--rti-hero-overlay) + .1)) 0%,
		rgba(var(--rti-primary-rgb), var(--rti-hero-overlay)) 45%,
		rgba(var(--rti-primary-rgb), calc(var(--rti-hero-overlay) * .65)) 100%);
}
@media (max-width: 820px) {
	.rti-pagehead--image::after {
		background: rgba(var(--rti-primary-rgb), calc(var(--rti-hero-overlay) + .08));
	}
}

.rti-pagehead--image h1,
.rti-pagehead--image .rti-archive-title { color: #fff; }
.rti-pagehead--image .rti-lead { color: rgba(255, 255, 255, .86); }
.rti-pagehead--image .rti-eyebrow { color: #ffb27a; }
.rti-pagehead--image .rti-pagehead__meta { color: rgba(255, 255, 255, .72); }
.rti-pagehead--image .rti-fineprint { color: rgba(255, 255, 255, .7); }
.rti-pagehead--image .rti-btn--ghost {
	border-color: rgba(255, 255, 255, .4);
	color: #fff;
}
.rti-pagehead--image .rti-btn--ghost:hover { background: #fff; color: var(--rti-primary); }

.rti-pagehead h1 { margin-bottom: var(--rti-s4); }
.rti-pagehead__inner { max-width: 800px; }
.rti-pagehead__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rti-s2) var(--rti-s5);
	margin-top: var(--rti-s5);
	font-size: .9rem;
	color: var(--rti-ink-faint);
}
.rti-pagehead__meta span { display: flex; align-items: center; gap: 6px; }
.rti-pagehead__meta .rti-icon { width: 16px; height: 16px; fill: currentColor; }

/* ---- Zweispaltiges Inhaltslayout ---- */
.rti-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: clamp(2rem, 1rem + 4vw, 4rem);
	align-items: start;
}
@media (max-width: 1020px) {
	.rti-layout { grid-template-columns: 1fr; }
}

.rti-aside { position: sticky; top: 100px; display: grid; gap: var(--rti-s5); }
@media (max-width: 1020px) { .rti-aside { position: static; } }

.rti-aside__box {
	border: 1px solid var(--rti-line);
	border-radius: var(--rti-radius);
	padding: var(--rti-s5);
	background: #fff;
}
.rti-aside__box h3 { font-size: 1.06rem; margin-bottom: var(--rti-s4); }
.rti-aside__box--accent {
	background: var(--rti-primary);
	border-color: var(--rti-primary);
	color: rgba(255, 255, 255, .84);
}
.rti-aside__box--accent h3 { color: #fff; }
.rti-aside__box ul { list-style: none; padding: 0; margin: 0; }
.rti-aside__box li { margin-bottom: var(--rti-s2); }
.rti-aside__box li a {
	display: block;
	padding: 7px 0;
	font-size: .95rem;
	color: var(--rti-primary);
	text-decoration: none;
	border-bottom: 1px solid var(--rti-line-soft);
}
.rti-aside__box li:last-child a { border-bottom: 0; }
.rti-aside__box li a:hover { color: var(--rti-accent); }

/* ---- Inhaltsverzeichnis ---- */
.rti-toc {
	background: var(--rti-surface);
	border-radius: var(--rti-radius);
	padding: var(--rti-s5) var(--rti-s6);
	margin-bottom: var(--rti-s7);
	border: 1px solid var(--rti-line-soft);
}
.rti-toc__title {
	font-size: .82rem;
	font-weight: 750;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--rti-ink-faint);
	margin-bottom: var(--rti-s3);
}
.rti-toc ol { margin: 0; padding-left: 1.2em; }
.rti-toc li { margin-bottom: 6px; }
.rti-toc a { color: var(--rti-primary); text-decoration: none; font-weight: 550; }
.rti-toc a:hover { color: var(--rti-accent); text-decoration: underline; }

/* ---- Fließtext ---- */
.rti-prose { font-size: 1.06rem; line-height: 1.72; }
.rti-prose > h2 {
	margin-top: var(--rti-s8);
	padding-top: var(--rti-s5);
	border-top: 2px solid var(--rti-line-soft);
	scroll-margin-top: 100px;
}
.rti-prose > h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.rti-prose > h3 { margin-top: var(--rti-s6); scroll-margin-top: 100px; }
.rti-prose img { border-radius: var(--rti-radius); margin-block: var(--rti-s5); }
.rti-prose figure { margin: var(--rti-s6) 0; }
.rti-prose figcaption {
	margin-top: var(--rti-s3);
	font-size: .87rem;
	color: var(--rti-ink-faint);
	text-align: center;
}
.rti-prose > ul li,
.rti-prose > ol li { margin-bottom: var(--rti-s3); }

/* Definitionsliste — gut für Begriffe, gut für KI-Systeme. */
.rti-prose dl {
	margin: var(--rti-s6) 0;
	display: grid;
	gap: var(--rti-s4);
}
.rti-prose dt { font-weight: 750; color: var(--rti-primary); }
.rti-prose dd { margin: 4px 0 0; color: var(--rti-ink-soft); }

/* Direktantwort direkt unter einer Überschrift. */
.rti-answer {
	background: var(--rti-surface);
	border-left: 4px solid var(--rti-accent);
	border-radius: 0 var(--rti-radius) var(--rti-radius) 0;
	padding: var(--rti-s5);
	margin-bottom: var(--rti-s5);
	font-size: 1.04rem;
}
.rti-answer > :last-child { margin-bottom: 0; }
.rti-answer strong:first-child { display: block; margin-bottom: var(--rti-s2); }

/* ---- Inhaltsspalte ---- */
.rti-content { min-width: 0; }
.rti-block { margin-top: var(--rti-s8); }
.rti-block > h2 {
	padding-top: var(--rti-s5);
	border-top: 2px solid var(--rti-line-soft);
	scroll-margin-top: 100px;
}

.rti-leadimage { margin: 0 0 var(--rti-s6); }
.rti-leadimage img { border-radius: var(--rti-radius); width: 100%; }

/* ---- Eckdaten einer Leistung ---- */
.rti-facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 1px;
	background: var(--rti-line);
	border: 1px solid var(--rti-line);
	border-radius: var(--rti-radius);
	overflow: hidden;
	margin-bottom: var(--rti-s5);
}
.rti-facts__item { background: #fff; padding: var(--rti-s4) var(--rti-s5); }
.rti-facts__label {
	display: block;
	font-size: .76rem;
	font-weight: 750;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--rti-ink-faint);
	margin-bottom: 4px;
}
.rti-facts__value {
	display: block;
	font-size: 1.04rem;
	font-weight: 700;
	color: var(--rti-primary);
	line-height: 1.35;
}

/* Ablauf untereinander statt nebeneinander (in der Textspalte). */
.rti-steps--stacked {
	grid-template-columns: 1fr;
	gap: var(--rti-s5);
}
.rti-steps--stacked .rti-step {
	padding: 0 0 0 56px;
	border-left: 2px solid var(--rti-line-soft);
	padding-bottom: var(--rti-s5);
}
.rti-steps--stacked .rti-step:last-child { border-left-color: transparent; padding-bottom: 0; }
.rti-steps--stacked .rti-step::before {
	top: -2px;
	left: -17px;
	width: 32px;
	height: 32px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--rti-accent);
	color: var(--rti-accent-ink);
	font-size: .82rem;
}
.rti-steps--stacked .rti-step::after { display: none; }

/* ---- FAQ-Abschnitt ---- */
.rti-faq-section { margin-top: var(--rti-s8); }
.rti-faq-section > h2 {
	padding-top: var(--rti-s5);
	border-top: 2px solid var(--rti-line-soft);
}

/* ---- Quellen ---- */
.rti-sources {
	margin-top: var(--rti-s8);
	padding: var(--rti-s6);
	background: var(--rti-surface);
	border-radius: var(--rti-radius);
}
.rti-sources h2 { font-size: 1.24rem; margin-bottom: var(--rti-s4); }
.rti-sources ol { font-size: .94rem; color: var(--rti-ink-soft); }
.rti-sources li { margin-bottom: var(--rti-s2); }

/* ---- Suchformular ---- */
.rti-searchform { display: flex; gap: var(--rti-s2); }
.rti-searchform input[type="search"] {
	flex: 1;
	min-width: 0;
	padding: 13px 16px;
	font-family: inherit;
	font-size: 1rem;
	border: 1.5px solid var(--rti-line);
	border-radius: calc(var(--rti-radius) - 5px);
	background: #fff;
}
.rti-searchform input[type="search"]:focus {
	outline: none;
	border-color: var(--rti-accent);
	box-shadow: 0 0 0 3px rgba(var(--rti-accent-rgb), .16);
}

/* Ersatzmenü, solange keines zugewiesen ist. */
.rti-menu-fallback { display: flex; gap: var(--rti-s2); list-style: none; margin: 0; padding: 0; }

/* ---- Beitragsliste ---- */
.rti-postlist { display: grid; gap: var(--rti-s5); grid-template-columns: repeat(3, 1fr); }
@media (max-width: 980px) { .rti-postlist { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .rti-postlist { grid-template-columns: 1fr; } }

.rti-postcard {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--rti-line);
	border-radius: var(--rti-radius);
	overflow: hidden;
	height: 100%;
	position: relative;
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

/* Der Titellink deckt die ganze Karte ab — ein Link statt zwei. */
.rti-postcard__link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}
.rti-postcard:hover {
	border-color: rgba(var(--rti-accent-rgb), .5);
	box-shadow: var(--rti-shadow-md);
	transform: translateY(-3px);
}
.rti-postcard__media { aspect-ratio: 16 / 10; overflow: hidden; background: var(--rti-surface); }
.rti-postcard__media img { width: 100%; height: 100%; object-fit: cover; }
.rti-postcard__body { padding: var(--rti-s5); display: flex; flex-direction: column; flex: 1; }
.rti-postcard__cat {
	font-size: .76rem;
	font-weight: 750;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--rti-accent);
	margin-bottom: var(--rti-s2);
}
.rti-postcard h3 { font-size: 1.14rem; margin-bottom: var(--rti-s3); }
.rti-postcard h3 a { color: var(--rti-primary); text-decoration: none; }
.rti-postcard h3 a:hover { color: var(--rti-accent); }
.rti-postcard p { font-size: .95rem; color: var(--rti-ink-soft); flex: 1; }
.rti-postcard__meta {
	margin-top: var(--rti-s4);
	padding-top: var(--rti-s3);
	border-top: 1px solid var(--rti-line-soft);
	font-size: .84rem;
	color: var(--rti-ink-faint);
	display: flex;
	gap: var(--rti-s4);
}

/* ---- Seitenblättern ---- */
.rti-pagination {
	display: flex;
	justify-content: center;
	gap: var(--rti-s2);
	margin-top: var(--rti-s7);
	flex-wrap: wrap;
}
.rti-pagination .page-numbers {
	display: grid;
	place-items: center;
	min-width: 44px;
	height: 44px;
	padding-inline: var(--rti-s3);
	border: 1px solid var(--rti-line);
	border-radius: 10px;
	font-weight: 650;
	color: var(--rti-primary);
	text-decoration: none;
}
.rti-pagination .page-numbers:hover { border-color: var(--rti-accent); color: var(--rti-accent); }
.rti-pagination .current {
	background: var(--rti-primary);
	border-color: var(--rti-primary);
	color: #fff;
}

/* =========================================================================
   7  Fußbereich
   ========================================================================= */

.rti-footer {
	background: var(--rti-primary);
	color: rgba(255, 255, 255, .72);
	font-size: .95rem;
}
.rti-footer a { color: rgba(255, 255, 255, .78); text-decoration: none; }
.rti-footer a:hover { color: #fff; text-decoration: underline; }

.rti-footer__main {
	display: grid;
	grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
	gap: var(--rti-s7) var(--rti-s6);
	padding-block: clamp(2.5rem, 1.8rem + 3vw, 4.5rem);
}
@media (max-width: 940px) { .rti-footer__main { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .rti-footer__main { grid-template-columns: 1fr; gap: var(--rti-s6); } }

.rti-footer h3 {
	font-size: .84rem;
	font-weight: 750;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #fff;
	margin-bottom: var(--rti-s4);
}
.rti-footer ul { list-style: none; padding: 0; margin: 0; }
.rti-footer li { margin-bottom: var(--rti-s2); }

.rti-footer__brand .rti-brand__name { color: #fff; }
.rti-footer__brand .rti-brand__claim { color: rgba(255, 255, 255, .5); }
.rti-footer__brand p { margin-top: var(--rti-s4); max-width: 34ch; }

.rti-footer__contact li {
	display: flex;
	gap: var(--rti-s3);
	align-items: flex-start;
	margin-bottom: var(--rti-s3);
}
.rti-footer__contact .rti-icon {
	width: 18px;
	height: 18px;
	fill: rgba(255, 255, 255, .45);
	flex: none;
	margin-top: 3px;
}

.rti-footer__areas {
	border-top: 1px solid rgba(255, 255, 255, .13);
	padding-block: var(--rti-s5);
}
.rti-footer__areatext {
	margin: 0;
	font-size: .88rem;
	line-height: 1.7;
	color: rgba(255, 255, 255, .55);
}

.rti-footer__bottom {
	border-top: 1px solid rgba(255, 255, 255, .13);
	padding-block: var(--rti-s5);
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--rti-s4);
	flex-wrap: wrap;
	font-size: .88rem;
	color: rgba(255, 255, 255, .55);
}
.rti-footer__bottom ul { display: flex; gap: var(--rti-s5); flex-wrap: wrap; }
.rti-footer__bottom li { margin: 0; }

.rti-footer__credit { color: rgba(255, 255, 255, .45); }
.rti-footer__credit a {
	color: rgba(255, 255, 255, .6);
	text-decoration: none;
	border-bottom: 1px solid rgba(255, 255, 255, .2);
}
.rti-footer__credit a:hover { color: #fff; border-bottom-color: #fff; text-decoration: none; }

/* =========================================================================
   8  Notdienst-Elemente
   ========================================================================= */

/* Feste Anrufleiste am unteren Rand (nur mobil). */
.rti-callbar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 88;
	display: none;
	gap: 1px;
	background: rgba(255, 255, 255, .2);
	box-shadow: 0 -4px 20px rgba(16, 24, 32, .16);
	padding-bottom: env(safe-area-inset-bottom, 0);
}
.rti-callbar a {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--rti-s2);
	padding: 15px 10px;
	font-size: .98rem;
	font-weight: 700;
	text-decoration: none;
	color: #fff;
}
.rti-callbar a .rti-icon { width: 20px; height: 20px; fill: currentColor; }
.rti-callbar__call { background: var(--rti-emergency); }
.rti-callbar__wa { background: #12a150; }
.rti-callbar__form { background: var(--rti-primary); }

@media (max-width: 860px) {
	.rti-has-callbar .rti-callbar { display: flex; }
	.rti-has-callbar { padding-bottom: 62px; }
	.rti-has-callbar .rti-footer__bottom { padding-bottom: var(--rti-s6); }
}

/* Notdienst-Kasten in der Seitenspalte. */
.rti-emergency-box {
	background: var(--rti-emergency);
	color: var(--rti-emergency-ink);
	border-radius: var(--rti-radius);
	padding: var(--rti-s6);
	border: 0;
}
.rti-emergency-box h3 { color: inherit; display: flex; align-items: center; gap: var(--rti-s2); }
.rti-emergency-box h3 .rti-icon { fill: currentColor; width: 20px; height: 20px; }
.rti-emergency-box p { color: rgba(255, 255, 255, .9); font-size: .95rem; }
.rti-emergency-box .rti-phone {
	display: block;
	font-size: 1.5rem;
	font-weight: 800;
	letter-spacing: -.02em;
	color: #fff;
	text-decoration: none;
	margin-block: var(--rti-s3);
}
.rti-emergency-box .rti-btn { background: #fff; color: var(--rti-emergency); width: 100%; }
.rti-emergency-box .rti-btn:hover { background: #fff; color: var(--rti-emergency); filter: none; }

/* =========================================================================
   9  Barrierefreiheit und Druck
   ========================================================================= */

/* Sichtbarer Fokus — nie entfernen. */
.rti :focus-visible {
	outline: 3px solid var(--rti-accent);
	outline-offset: 2px;
	border-radius: 4px;
}

/* Sprunglink zum Inhalt. */
.rti-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 999;
	padding: 14px 22px;
	background: var(--rti-primary);
	color: #fff;
	font-weight: 700;
	text-decoration: none;
	border-radius: 0 0 10px 0;
}
.rti-skip:focus { left: 0; color: #fff; }

/* Nur für Screenreader. */
.rti-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* =========================================================================
   10  Responsive Feinschliff
   -------------------------------------------------------------------------
   Diese Regeln fangen die Stellen ab, an denen Inhalte auf schmalen
   Geräten sonst aus dem Bildschirm laufen. Grundsatz: Nichts darf
   waagerecht überstehen — breite Inhalte scrollen in ihrem eigenen
   Kasten, nicht die ganze Seite.
   ========================================================================= */

/* Kein waagerechtes Scrollen der Seite, unter keinen Umständen. */
html, body.rti { max-width: 100%; overflow-x: clip; }

/* Lange Wörter, URLs und Fachbegriffe umbrechen lassen. */
.rti-prose,
.rti-content,
.rti-card,
.rti-faq__q,
.rti-faq__a { overflow-wrap: break-word; }

/* Alles, was von Natur aus breit ist, bekommt seinen eigenen Scrollbereich. */
.rti-prose table { min-width: 520px; }
.rti-prose pre { overflow-x: auto; }

/* Raster dürfen ihre Spalten unter die Mindestbreite schrumpfen lassen. */
.rti-grid > *,
.rti-split > *,
.rti-layout > * { min-width: 0; }

@media (max-width: 900px) {
	/* Fließtext etwas kompakter, damit mehr Inhalt ins Bild passt. */
	.rti-prose { font-size: 1.02rem; }

	.rti-pagehead__meta { gap: var(--rti-s2) var(--rti-s4); font-size: .86rem; }

	.rti-cta__inner { gap: var(--rti-s5); }
	.rti-cta__actions { width: 100%; }
	.rti-cta__actions .rti-btn { width: 100%; }
}

@media (max-width: 600px) {
	body.rti { font-size: 16px; }

	.rti-section { padding-block: 2.5rem; }
	.rti-card { padding: var(--rti-s5); }
	.rti-faq__q { padding: var(--rti-s4) var(--rti-s5); font-size: 1rem; }
	.rti-faq__a { padding: 0 var(--rti-s5) var(--rti-s4); }
	.rti-note { flex-direction: column; gap: var(--rti-s3); padding: var(--rti-s4); }
	.rti-cta { padding: var(--rti-s6) var(--rti-s5); }

	/* Aufzählungen näher an den Rand, das schafft spürbar Platz. */
	.rti-prose ul,
	.rti-prose ol { padding-left: 1.15em; }

	/* Schaltflächen nebeneinander sind auf dem Telefon selten sinnvoll. */
	.rti-btn-row { flex-direction: column; align-items: stretch; }
	.rti-btn-row .rti-btn { width: 100%; }

	.rti-hero__actions { flex-direction: column; align-items: stretch; }
	.rti-hero__actions .rti-btn { width: 100%; }

	.rti-searchform { flex-direction: column; }
	.rti-searchform .rti-btn { width: 100%; }

	/* Eckdaten untereinander statt gequetscht nebeneinander. */
	.rti-facts { grid-template-columns: 1fr; }

	/* Fußzeile: Tippziele vergrößern. */
	.rti-footer li { margin-bottom: var(--rti-s3); }
	.rti-footer a { display: inline-block; padding-block: 4px; }
	.rti-footer__bottom { flex-direction: column; align-items: flex-start; gap: var(--rti-s3); }
	.rti-footer__bottom ul { gap: var(--rti-s4); }
}

/* Tippziele: Fingerkuppen brauchen mindestens 44 Pixel. */
@media (pointer: coarse) {
	.rti-crumbs a,
	.rti-aside__box li a,
	.rti-pagination .page-numbers { min-height: 44px; display: inline-flex; align-items: center; }
	.rti-areas span,
	.rti-areas a { padding: 11px 16px; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.rti *,
	.rti *::before,
	.rti *::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
	}
}

@media print {
	.rti-header,
	.rti-topbar,
	.rti-callbar,
	.rti-emergency-band,
	.rti-cta,
	.rti-aside,
	.rti-footer__main { display: none !important; }

	.rti { font-size: 11pt; color: #000; }
	.rti-layout { grid-template-columns: 1fr; }
	.rti a::after { content: " (" attr(href) ")"; font-size: 9pt; color: #555; }
	.rti-prose > h2 { page-break-after: avoid; }
	.rti-faq__item { break-inside: avoid; }
}