/*!
Theme Name: FKD GmbH 2026
Theme URI: https://www.pfalz-art.de/
Author: Pfalz-Art
Author URI: https://www.pfalz-art.de/
Description: Schlankes, barrierearmes Theme für FKD GmbH Rülzheim. Ohne Bootstrap und ohne jQuery-Abhängigkeit.
Version: 1.1.2
Requires at least: 6.3
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: fkd-gmbh-2026
Tags: custom-background, custom-logo, custom-menu, featured-images, translation-ready, accessibility-ready
*/

/* ==========================================================================
   1. Design-Tokens (CI-Orange #f5a639 für Überschriften und Links, CI-Lila #772986 für Buttons und Interaktionszustände)
   ========================================================================== */
:root {
	--fkd-orange: #f5a639;       /* CI-Orange: Überschriften, Flächen, Rahmen */
	--fkd-grau: #9d9d9c;         /* Navigation, Deko */
	--fkd-text: #4d4d4c;         /* Fließtext (Kontrast 8:1 auf Weiß) */
	--fkd-ink: #1d1d1b;          /* Text auf Orange und auf grauer Navigation, Fokus-Rahmen */
	--fkd-lila: #772986;         /* CI-Lila: Buttons, Hover-/Aktiv-Zustände, Fokus */
	--fkd-nav-line: #e3e3e2;     /* feine Linien im Menü */
	--fkd-white: #fff;
	--fkd-shadow: 5px 5px 5px 0 #c9c5c9;
	--fkd-gap: 15px;
}

/* ==========================================================================
   2. Schrift: Cabin (SIL OFL 1.1), lokal eingebunden
   ========================================================================== */
@font-face {
	font-family: "Cabin";
	src: url("fonts/cabin-regular.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Cabin";
	src: url("fonts/cabin-bold.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/* ==========================================================================
   3. Basis
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html { height: 100%; margin-top: 0; -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	color: var(--fkd-text);
	font-family: "Cabin", "Trebuchet MS", Arial, sans-serif;
	font-size: 1.2rem;
	line-height: 1.6;
}

img, svg, video, iframe { max-width: 100%; }
img { height: auto; vertical-align: middle; }

h1, h2, h3, h4, h5 {
	margin: 2rem 0 .75rem;
	color: var(--fkd-orange);
	line-height: 1.2;
}
h1 { font-size: 1.8rem; }

a { color: var(--fkd-orange); text-decoration: underline; }
a:visited { color: var(--fkd-orange); }
a:hover, a:focus, a:active { color: var(--fkd-lila); text-decoration: none; }

:focus-visible {
	outline: 3px solid var(--fkd-lila);
	outline-offset: 2px;
}

hr { height: 1px; margin-bottom: 1.5em; border: 0; background-color: var(--fkd-grau); }

label { color: var(--fkd-text); }

/* Nur visuell versteckt, für Screenreader weiter lesbar */
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}
.screen-reader-text:focus {
	position: fixed !important;
	top: 8px;
	left: 8px;
	z-index: 100000;
	width: auto;
	height: auto;
	margin: 0;
	padding: .75rem 1.25rem;
	clip-path: none;
	background: var(--fkd-white);
	color: var(--fkd-lila);
	font-size: 1rem;
	font-weight: 700;
	box-shadow: 0 0 0 3px var(--fkd-lila);
}

/* ==========================================================================
   4. Header
   ========================================================================== */
#header { background-color: var(--fkd-white); }

#logo {
	width: 100%;
	height: auto;
	padding: 1rem;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

#slogan {
	margin-bottom: 1rem;
	padding: 0;
	color: var(--fkd-orange);
	font-size: clamp(1.15rem, 5.4vw, 1.5rem);
	text-align: center;
	overflow-wrap: break-word;
	-webkit-hyphens: auto;
	hyphens: auto;
}

#search { padding: 1rem; }
#search .search-form { margin-left: auto; }

/* Desktop: Logo, Slogan und Suche vertikal mittig in der Kopfzeile */
@media (min-width: 992px) {
	#header .row { align-items: center; }
	#search { display: flex; align-items: center; }
	#widget_search { width: 100%; }
	#search .search-form { margin-left: auto; margin-right: 0; }
}

/* ==========================================================================
   4b. Suchfeld: eckig mit Orange-Rahmen und lila Button (Header, 404, Suche)
   ========================================================================== */
.search-form {
	display: flex;
	align-items: stretch;
	width: 100%;
	max-width: 22rem;
	border: 2px solid var(--fkd-orange);
	border-radius: 0;
	background: var(--fkd-white);
	overflow: hidden;
	font-size: 1rem;
	transition: box-shadow .15s;
}
.search-form:focus-within { box-shadow: 0 0 0 3px rgba(119, 41, 134, .35); border-color: var(--fkd-lila); }
.search-form label { display: block; flex: 1 1 auto; min-width: 0; margin: 0; }
.search-form .search-field {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 2.6rem;
	margin: 0;
	padding: .5rem .5rem .5rem 1.1rem;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--fkd-text);
	font: inherit;
	-webkit-appearance: none;
	appearance: none;
}
.search-form .search-field::placeholder { color: #6f6f6e; opacity: 1; }
.search-form .search-field:focus { outline: 0; }
.search-form .search-submit {
	flex: 0 0 auto;
	margin: 0;
	padding: 0 1rem;
	border: 0;
	border-radius: 0;
	background-color: var(--fkd-lila);
	color: var(--fkd-white);
	font: inherit;
	font-weight: 700;
	cursor: pointer;
	transition: background-color .15s, color .15s;
}
.search-form .search-submit:hover,
.search-form .search-submit:focus-visible { background-color: var(--fkd-orange); color: var(--fkd-ink); outline: 0; }
#error-404-not-found .search-form { margin: 1.5rem auto 0; }

@media (max-width: 991.98px) {
	#search { padding: .5rem 1rem 1rem; }
	#search .search-form { margin-right: auto; margin-left: auto; }
}

/* ==========================================================================
   5. Hauptmenü: weiße Leiste, mittig, beim Scrollen oben fixiert
   - Aktuelle Seite: Orange mit weißer Schrift
   - Hover/Fokus: Lila mit weißer Schrift
   - Desktop: horizontal; Mobil (< 768px): Hamburger-Menü im gleichen Farbdesign
   ========================================================================== */
html { scroll-padding-top: 4rem; }

#navigation {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 1000;
	background-color: var(--fkd-white);
	color: var(--fkd-text);
	border-top: 1px solid var(--fkd-nav-line);
	border-bottom: 3px solid var(--fkd-orange);
	box-shadow: 0 4px 10px rgba(0, 0, 0, .12);
}
/* WordPress-Admin-Leiste (nur für eingeloggte Redakteure) */
.admin-bar #navigation { top: 32px; }
@media (max-width: 782px) { .admin-bar #navigation { top: 46px; } }
@media (max-width: 600px) { .admin-bar #navigation { top: 0; } }

#navigation ul { margin: 0; padding: 0; list-style: none; }
#navigation a,
#navigation .submenu-toggle { color: inherit; }
#navigation a {
	display: block;
	padding: .8rem 1.25rem;
	font-size: 1.15rem;
	line-height: 1.3;
	text-decoration: none;
}
#navigation :focus-visible { outline: 3px solid var(--fkd-ink); outline-offset: -4px; }

/* Menü-Button (nur mobil), mittig */
.menu-toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .9rem;
	width: 100%;
	min-height: 3.25rem;
	padding: .5rem 1.25rem;
	border: 0;
	background: transparent;
	color: var(--fkd-text);
	font: inherit;
	font-size: 1.2rem;
	font-weight: 700;
	cursor: pointer;
}
.is-open > .menu-toggle { background-color: var(--fkd-lila); color: var(--fkd-white); }
@media (hover: hover) {
	.menu-toggle:hover { background-color: var(--fkd-lila); color: var(--fkd-white); }
}
.menu-toggle:focus-visible { outline-offset: -6px; }
.menu-toggle-bars,
.menu-toggle-bars::before,
.menu-toggle-bars::after {
	display: block;
	width: 1.6rem;
	height: 3px;
	border-radius: 2px;
	background: currentColor;
	content: "";
	transition: transform .2s;
}
.menu-toggle-bars { position: relative; }
.menu-toggle-bars::before { position: absolute; top: -8px; }
.menu-toggle-bars::after { position: absolute; top: 8px; }
.is-open > .menu-toggle .menu-toggle-bars { background: transparent; }
.is-open > .menu-toggle .menu-toggle-bars::before { top: 0; transform: rotate(45deg); }
.is-open > .menu-toggle .menu-toggle-bars::after { top: 0; transform: rotate(-45deg); }
html:not(.js) .menu-toggle { display: none; }

/* Menüeinträge */
#navigation li { position: relative; color: var(--fkd-text); }

/* Aktuelle Seite bzw. Elternpunkt: CI-Orange mit weißer Schrift */
#navigation .current-menu-item,
#navigation .current-menu-ancestor,
#navigation .current_page_item,
#navigation .current-page-ancestor { background-color: var(--fkd-orange); color: var(--fkd-white); }
#navigation .current-menu-item > a,
#navigation .current-menu-ancestor > a,
#navigation .current_page_item > a { font-weight: 700; }

/* Hover, Tastaturfokus, geöffneter Punkt: Lila mit weißer Schrift */
#navigation li:focus-within,
#navigation li.is-open { background-color: var(--fkd-lila); color: var(--fkd-white); }
@media (hover: hover) {
	#navigation li:hover { background-color: var(--fkd-lila); color: var(--fkd-white); }
}
#navigation li:focus-within > a:focus-visible,
#navigation li.is-open :focus-visible { outline-color: var(--fkd-white); }

/* Pfeil-Button für Untermenüs */
.submenu-toggle {
	border: 0;
	background: transparent;
	cursor: pointer;
}
.submenu-toggle::after {
	display: inline-block;
	width: .5rem;
	height: .5rem;
	border: solid currentColor;
	border-width: 0 2px 2px 0;
	content: "";
	transform: translateY(-3px) rotate(45deg);
	transition: transform .2s;
}
.submenu-toggle[aria-expanded="true"]::after { transform: translateY(2px) rotate(-135deg); }

/* Untermenü: heller Hintergrund, gleiche Farblogik */
#navigation .sub-menu { display: none; background-color: var(--fkd-white); }
#navigation .is-open > .sub-menu { display: block; }
#navigation .sub-menu li { border-top: 1px solid var(--fkd-nav-line); }
#navigation .sub-menu a { font-size: 1.05rem; }

/* Mobil (Hamburger): zentrierte Einträge, Menü legt sich unter die Leiste */
.js #navigation .menu-container { display: none; }
.js #navigation.is-open .menu-container {
	position: absolute;
	top: 100%;
	right: 0;
	left: 0;
	display: block;
	max-height: calc(100vh - 4.5rem);
	overflow-y: auto;
	border-top: 1px solid var(--fkd-nav-line);
	background-color: var(--fkd-white);
	box-shadow: 0 10px 14px rgba(0, 0, 0, .2);
}
.admin-bar #navigation .menu-container { max-height: calc(100vh - 7.5rem); }
@media (max-width: 767.98px) {
	#navigation .menu-container > ul > li + li { border-top: 1px solid var(--fkd-nav-line); }
	#navigation a { padding: .95rem 3.25rem; text-align: center; }
	#navigation .sub-menu a { padding-left: 3.25rem; }
	#navigation li.menu-item-has-children > .submenu-toggle {
		position: absolute;
		top: 0;
		right: 0;
		width: 3.25rem;
		height: 3.2rem;
	}
	#navigation .sub-menu { background-color: #f6f6f5; }
	#navigation .sub-menu .current-menu-item { background-color: var(--fkd-orange); }
}

/* Desktop und Tablet quer: Leiste mittig */
@media (min-width: 768px) {
	.menu-toggle { display: none; }
	.js #navigation .menu-container,
	.js #navigation.is-open .menu-container {
		position: static;
		display: block;
		max-height: none;
		overflow: visible;
		border-top: 0;
		background: transparent;
		box-shadow: none;
	}
	#navigation .menu-container > ul { display: flex; flex-wrap: wrap; justify-content: center; }
	#navigation li.menu-item-has-children { display: flex; }
	#navigation a { padding: .85rem clamp(.9rem, 2.2vw, 2rem); font-size: clamp(1.05rem, 1.9vw, 1.4rem); }
	#navigation li.menu-item-has-children > a { padding-right: .4rem; }
	.submenu-toggle { flex: 0 0 auto; width: 1.8rem; }
	#navigation .sub-menu {
		position: absolute;
		top: 100%;
		left: 0;
		z-index: 1000;
		min-width: 17rem;
		border-top: 3px solid var(--fkd-orange);
		box-shadow: 0 10px 14px rgba(0, 0, 0, .2);
	}
	#navigation li:hover > .sub-menu,
	#navigation li:focus-within > .sub-menu { display: block; }
	#navigation .sub-menu li { display: block; }
	#navigation .sub-menu a { padding: .75rem 1.25rem; font-size: 1.1rem; }
	/* Letzte Einträge öffnen nach links, damit das Untermenü nicht aus dem Fenster ragt */
	#navigation .menu-container > ul > li:nth-last-child(-n+2) > .sub-menu { right: 0; left: auto; }
}

/* ==========================================================================
   6. Inhalt, Slider, Sidebar
   ========================================================================== */
#slider { width: 100%; padding: 0; overflow: auto; }

#content {
	background: #aab9cc;
	background: linear-gradient(to bottom, #aab9cc 0, #c9d2ef 18%, #efefef 70%, #fff 100%);
}

#primary { background-color: var(--fkd-white); box-shadow: var(--fkd-shadow); }
#main { padding: 1rem; }
@media (min-width: 768px) { #main { padding: 1.5rem 2rem 2rem; } }

.entry-content::after { content: ""; display: table; clear: both; }

#sidebar { padding: var(--fkd-gap); }
#sidebar ul { margin: 0; padding: 0; list-style: none; }
#sidebar h4 { font-size: 1.5rem; }
#sidebar p { font-size: 1rem; }

/* Stellenanzeigen-Teaser (Category Posts Widget) als Karten */
#sidebar .cat-post-widget { margin-bottom: 1.5rem; }
#sidebar .widget-title {
	margin: 0 0 1rem;
	padding-bottom: .5rem;
	border-bottom: 3px solid var(--fkd-orange);
	font-size: 1.5rem;
	line-height: 1.2;
}
#sidebar .widget-title a { color: var(--fkd-orange); text-decoration: none; }
#sidebar .widget-title a:hover,
#sidebar .widget-title a:focus-visible { color: var(--fkd-lila); }
#sidebar .cat-post-item {
	margin: 0 0 1rem !important; /* überstimmt das Inline-CSS des Category-Posts-Plugins */
	padding: 1.1rem 1.3rem 1.2rem !important;
	border: 1px solid var(--fkd-nav-line);
	border-left: 5px solid var(--fkd-orange);
	border-radius: 0;
	background: #faf8fb;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
	transition: box-shadow .15s, border-left-color .15s;
}
#sidebar .cat-post-item:hover,
#sidebar .cat-post-item:focus-within { border-left-color: var(--fkd-lila); box-shadow: 0 3px 10px rgba(0, 0, 0, .12); }
#sidebar .cat-post-title {
	display: block;
	margin: 0 0 .4rem !important;
	padding: 0 !important;
	color: var(--fkd-orange);
	font-size: 1.2rem;
	font-weight: 700;
	line-height: 1.3;
	text-decoration: none;
}
#sidebar .cat-post-title:hover,
#sidebar .cat-post-title:focus-visible { color: var(--fkd-lila); }
#sidebar .cpwp-excerpt-text { margin: 0; color: var(--fkd-text); font-size: .95rem; line-height: 1.55; }
#sidebar .cat-post-footer-link {
	display: inline-block;
	margin-top: .25rem;
	padding: .55rem 1.4rem;
	border: 0;
	border-radius: 0;
	background: var(--fkd-lila);
	color: var(--fkd-white);
	font-weight: 700;
	text-decoration: none;
	transition: background-color .15s, color .15s;
}
#sidebar .cat-post-footer-link:hover,
#sidebar .cat-post-footer-link:focus-visible { background: var(--fkd-orange); color: var(--fkd-ink); }

.wp-block-image .alignright { float: none; width: 100%; max-width: 100%; margin-left: 0; height: auto; text-align: center; }

.size-post-thumbnail { width: 25rem; height: auto; }
.wp-post-image { width: 20rem; }

.post-wrapper { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: space-between; }
.post-wrapper .post-column { width: 25%; padding-right: 2em; }

/* Archive, Kategorien, Suche: Karten-Raster */
.page-header { margin: 0 0 1.5rem; padding-bottom: .6rem; border-bottom: 3px solid var(--fkd-orange); }
.page-header .page-title { margin: 0; font-size: clamp(1.7rem, 4vw, 2.4rem); }
.archive-description { margin-top: .5rem; color: var(--fkd-text); }
.post-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); gap: 1.5rem; margin-bottom: 1.5rem; }
.post-grid > article {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 1.4rem 1.5rem;
	border: 1px solid var(--fkd-nav-line);
	border-top: 5px solid var(--fkd-orange);
	background: #faf8fb;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
	transition: box-shadow .15s, border-top-color .15s;
}
.post-grid > article:hover,
.post-grid > article:focus-within { border-top-color: var(--fkd-lila); box-shadow: 0 4px 14px rgba(0, 0, 0, .13); }
.post-grid .entry-header { margin-bottom: .75rem; }
.post-grid .entry-title { margin: 0; font-size: 1.35rem; line-height: 1.3; }
.post-grid .entry-title a { color: var(--fkd-orange); text-decoration: none; }
.post-grid .entry-title a:hover,
.post-grid .entry-title a:focus-visible { color: var(--fkd-lila); }
.post-grid .wp-post-image, .post-grid .size-post-thumbnail { width: 100%; max-width: 100%; height: auto; margin-bottom: 1rem; }
.post-grid .entry-summary { display: flex; flex: 1 1 auto; flex-direction: column; }
.post-grid .entry-summary p { margin: 0 0 1.25rem; color: var(--fkd-text); line-height: 1.6; }
.post-grid .entry-summary .more-link { margin-top: auto; }

.more-link {
	display: inline-block;
	padding: .65rem 1.6rem;
	border: 0;
	background: var(--fkd-lila);
	color: var(--fkd-white);
	font-weight: 700;
	text-align: center;
	text-decoration: none;
	transition: background-color .15s, color .15s;
}
.more-link:hover, .more-link:focus-visible { background: var(--fkd-orange); color: var(--fkd-ink); }

.ueberschrift { font-size: 50px; font-weight: 300; line-height: 1.05em; letter-spacing: 0; }

.posts-navigation, .page-links { margin: 2rem 0 1rem; }
.posts-navigation .nav-links { display: flex; justify-content: space-between; gap: 1rem; }

#error-404-not-found h1 { font-size: 2rem; text-align: center; }
#error-404-not-found p { margin-top: 2rem; text-align: center; }
#error-404-not-found .search-form { text-align: center; }

/* ==========================================================================
   7. Footer
   ========================================================================== */
#footer { padding: 1rem; color: var(--fkd-orange); font-size: 1.2rem; }
#footer a { color: var(--fkd-orange); }
#footer a:hover, #footer a:focus { color: var(--fkd-lila); text-decoration: none; }

#kontakt {
	margin-bottom: 2rem;
	padding: 2rem;
	background-color: var(--fkd-white);
	box-shadow: var(--fkd-shadow);
	color: var(--fkd-text);
	font-size: 1.5rem;
}
#kontakt h4 { color: var(--fkd-lila); font-size: 1.5rem; }
#widget_kontakt_1 img { width: 100%; height: auto; }
#kontakt_2 { margin-left: 10%; font-size: 1.2rem; text-align: left !important; }

.telefontext::before { content: "Telefon:"; margin-right: .7rem; }
.fax::before { content: "Telefax:"; margin-right: .9rem; }
.emailtext::before { content: "E-Mail:"; margin-right: 1.5rem; }


#impressum { padding-top: .5rem; font-size: 1rem; text-align: center; }
#impressum .footer-credit { padding-top: .5rem; padding-bottom: .5rem; color: var(--fkd-text); }

/* Footer-Menü: nie ein Hamburger-Menü, immer ausgeklappt, bricht bei Platzmangel um */
#impressummenu { padding-bottom: .5rem; }
#impressummenu ul {
	display: flex;
	flex-wrap: wrap;
	gap: .25rem 1.5rem;
	justify-content: center;
	margin: 0;
	padding: 0;
	list-style: none;
}
#impressummenu li { margin: 0; }
#impressummenu a {
	display: inline-block;
	padding: .5rem 0;
	border: 0;
	background: none;
	color: #000;
	font-size: 1.05rem;
	font-weight: 400;
	line-height: 1.5;
	text-decoration: none;
}
#impressummenu a:hover,
#impressummenu a:focus-visible,
#impressummenu .current-menu-item > a { background: none; color: var(--fkd-orange); }
#impressummenu a:focus-visible { outline: 2px solid var(--fkd-lila); outline-offset: 2px; }

@media (min-width: 992px) {
	#impressum .footer-credit { text-align: left; }
	#impressummenu ul { justify-content: flex-end; }
}

/* ==========================================================================
   7b. Formulare (Contact Form 7 auf Kontakt und Terminänderung)
   ========================================================================== */
.wpcf7 form { max-width: 40rem; margin: 1.5rem 0 2rem; }
.wpcf7 form p { margin: 0 0 1.25rem; }
.wpcf7 label { display: block; font-size: 1.05rem; font-weight: 700; line-height: 1.4; }
.wpcf7 .wpcf7-form-control-wrap { display: block; margin-top: .4rem; }

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 input[type="number"],
.wpcf7 input[type="date"],
.wpcf7 select,
.wpcf7 textarea {
	display: block;
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: .75rem .95rem;
	border: 2px solid #c9c9c8;
	border-radius: 6px;
	background-color: var(--fkd-white);
	color: var(--fkd-text);
	font: inherit;
	font-size: 1.1rem;
	font-weight: 400;
	line-height: 1.4;
	-webkit-appearance: none;
	appearance: none;
	transition: border-color .15s, box-shadow .15s;
}
.wpcf7 textarea { min-height: 10rem; resize: vertical; }
.wpcf7 input:hover,
.wpcf7 select:hover,
.wpcf7 textarea:hover { border-color: var(--fkd-orange); }
.wpcf7 input:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus {
	border-color: var(--fkd-lila);
	box-shadow: 0 0 0 3px rgba(119, 41, 134, .25);
	outline: 0;
}

/* Datenschutz-Checkbox */
.wpcf7 .wpcf7-acceptance .wpcf7-list-item { display: block; margin: 0; }
.wpcf7 .wpcf7-acceptance label { display: flex; align-items: flex-start; gap: .75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; }
.wpcf7 input[type="checkbox"],
.wpcf7 input[type="radio"] {
	flex: 0 0 auto;
	width: 1.35rem;
	height: 1.35rem;
	margin: .15rem 0 0;
	accent-color: var(--fkd-lila);
	cursor: pointer;
}
.wpcf7 input[type="checkbox"]:focus-visible { outline: 3px solid var(--fkd-lila); outline-offset: 2px; }

/* Absenden */
.wpcf7 input[type="submit"],
.wpcf7 .wpcf7-submit {
	display: inline-block;
	padding: .85rem 2.25rem;
	border: 0;
	border-radius: 6px;
	background-color: var(--fkd-lila);
	color: var(--fkd-white);
	font: inherit;
	font-size: 1.15rem;
	font-weight: 700;
	line-height: 1.2;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	transition: background-color .15s, color .15s;
}
.wpcf7 input[type="submit"]:hover,
.wpcf7 input[type="submit"]:focus-visible { background-color: var(--fkd-orange); color: var(--fkd-ink); outline: 0; box-shadow: 0 0 0 3px rgba(245, 166, 57, .45); }
.wpcf7 input[type="submit"]:disabled { opacity: .6; cursor: not-allowed; }
.wpcf7-spinner { margin: 0 0 0 1rem; vertical-align: middle; }

/* Fehler- und Erfolgsmeldungen */
.wpcf7 .wpcf7-not-valid { border-color: #b3261e; }
.wpcf7 .wpcf7-not-valid-tip { display: block; margin-top: .35rem; color: #b3261e; font-size: .95rem; font-weight: 700; }
.wpcf7 form .wpcf7-response-output {
	margin: 1.5rem 0 0;
	padding: .9rem 1.1rem;
	border: 2px solid var(--fkd-orange);
	border-radius: 6px;
	background: #fff8ee;
	color: var(--fkd-text);
	font-size: 1.05rem;
}
.wpcf7 form.sent .wpcf7-response-output { border-color: #2e7d32; background: #eef7ee; }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output { border-color: #b3261e; background: #fdeeee; }

/* Honeypot-Spamschutz bleibt für Menschen unsichtbar */
.cf7apps-honeypot-wrap,
.wpcf7 .hp-message {
	position: absolute !important;
	left: -9999px !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
}
.wpcf7 form p:has(> .cf7apps-honeypot-wrap) { margin: 0; }

@media (max-width: 575.98px) {
	.wpcf7 input[type="submit"] { width: 100%; }
	.wpcf7-spinner { display: block; margin: .75rem auto 0; }
}

/* ==========================================================================
   8. Breakpoints
   ========================================================================== */
@media (min-width: 576px) {
	#kontakt { text-align: center !important; }
	#widget_kontakt_1 img { width: 250px !important; }
	#kontakt_2 { margin-left: 22%; }
}
@media (min-width: 768px) {
	#kontakt_2 { margin-left: 30%; }
	#post-21, #post-27 { padding: 0 3rem !important; }
	#post-23 { padding: 0 4rem !important; }
}
@media (min-width: 992px) {
	.wp-block-image .alignright { float: right; margin-left: 1em; }
	#slogan { margin-top: 0 !important; margin-bottom: 0; font-size: clamp(1.05rem, 1.85vw, 2.4rem) !important; white-space: nowrap; }
	#slogan p, #slogan h1, #slogan h2, #slogan h3 { margin: 0; font-size: inherit; white-space: nowrap; }
	#widget_kontakt_1 img { margin-top: 3rem !important; }
	#post-21, #post-27 { padding: 0 6rem !important; }
	#post-23 { padding: 0 7rem !important; }
}
@media (min-width: 1200px) {
	#logo { width: 200px !important; }
}

@media (max-width: 767.98px) {
	.post-wrapper .post-column { width: 100%; padding-right: 0; }
}

@media (prefers-reduced-motion: reduce) {
	* { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* Kein doppelter "mehr"-Link im Auszug (der Button der Karte genügt) */
.post-grid .entry-summary .read-more { display: none; }