/*
 * LOROP Theme – Styles
 *
 * Gestaltung nach programmierung-berlin.de, Kontraste auf WCAG 2.2 AA geprüft.
 * Farbwerte stehen in theme.json (--wp--preset--color--*); hier werden sie für
 * den Dunkelmodus überschrieben und um Linien, Fokus und Schatten ergänzt.
 *
 * Kontrastregeln (nicht unterschreiten):
 *  - Fließtext/Links ≥ 4.5:1 auf ihrem jeweiligen Hintergrund
 *  - Rahmen von Bedienelementen und Fokusrahmen ≥ 3:1
 *  - Farbsystem Variante B (lorop.de, 29.10.2026), Bereich Programmierung wie programmierung-berlin.de:
 *    HELL #ffd9de (Flächen), BASIS #fa7692 (Buttons, Icons, Deko), TIEF #aa3c58 (Schrift auf Hell).
 *    Auf BASIS steht Navy-Schrift (5,8:1), nie Weiß (2,6:1). BASIS ist auf Dunkel Textfarbe (6,9:1).
 */

/* ==========================================================================
   1. Tokens
   ========================================================================== */
:root {
	--lorop-line: #e3e3ec;            /* dekorative Trennlinien */
	--lorop-border: #767a94;          /* Rahmen von Feldern/Bedienelementen (4.3:1) */
	--lorop-focus: #1f2446;           /* Fokusrahmen */
	--lorop-hero-bg: linear-gradient(160deg, #ffd9de 0%, #ffe7ea 55%, #fff4f5 100%);
	--lorop-on-brand: #1f2446;        /* Schrift auf BASIS */
	--lorop-button-hover: #ff8fa7;    /* Button-Hover, Navy-Schrift 7:1 – in beiden Schemata gleich */
	--lorop-error: #b3261e;           /* Fehlermeldungen (6,5:1 auf Weiß) */
	--lorop-header-bg: rgba(255, 255, 255, .96);
	--lorop-footer-bg: #1f2446;
	--lorop-panel-text: #ffffff;
	--lorop-panel-muted: #c9cbe0;
	--lorop-panel-accent: #ffc4d0;    /* Links auf Navy-Panels (≥ 5,6:1 auch auf dem rosa Lichtschein und dem hellen Panel-Ton) */
	--lorop-shadow: 0 1px 2px rgba(31, 36, 70, .06), 0 16px 36px -18px rgba(31, 36, 70, .22);
	--lorop-shadow-lg: 0 40px 80px -40px rgba(31, 36, 70, .4);
	--lorop-radius: 14px;
	--lorop-header-h: 84px;
	--lorop-gutter: clamp(16px, 4vw, 40px);
	--lorop-wrap: 1240px;
	color-scheme: light;
}

/* Dunkel: per Systemeinstellung (sofern nicht "Hell" gewählt) oder per Umschalter */
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		--wp--preset--color--base: #12152b;
		--wp--preset--color--base-2: #161a34;
		--wp--preset--color--surface: #1c2042;
		--wp--preset--color--surface-2: #242951;
		--wp--preset--color--contrast: #f2f3f9;
		--wp--preset--color--body: #cfd1e2;
		--wp--preset--color--muted: #a6aac3;
		--wp--preset--color--accent: #fa7692;
		--wp--preset--color--accent-hero: #fa7692;
		--wp--preset--color--panel: #262c57;
		--wp--preset--color--panel-2: #303767;
		--wp--preset--color--hero: #2e2140;
		--lorop-line: rgba(255, 255, 255, .12);
		--lorop-border: #8f93b0;
		--lorop-focus: #ffffff;
		--lorop-error: #ffb4ab;
		--lorop-hero-bg: linear-gradient(160deg, #3b2442 0%, #262040 55%, #161a34 100%);
		--lorop-header-bg: rgba(18, 21, 43, .96);
		--lorop-footer-bg: #0d1024;
		--lorop-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 18px 40px -20px rgba(0, 0, 0, .7);
		--lorop-shadow-lg: 0 40px 80px -40px rgba(0, 0, 0, .8);
		color-scheme: dark;
	}
}
:root[data-theme="dark"] {
	--wp--preset--color--base: #12152b;
	--wp--preset--color--base-2: #161a34;
	--wp--preset--color--surface: #1c2042;
	--wp--preset--color--surface-2: #242951;
	--wp--preset--color--contrast: #f2f3f9;
	--wp--preset--color--body: #cfd1e2;
	--wp--preset--color--muted: #a6aac3;
	--wp--preset--color--accent: #fa7692;
	--wp--preset--color--accent-hero: #fa7692;
	--wp--preset--color--panel: #262c57;
	--wp--preset--color--panel-2: #303767;
	--wp--preset--color--hero: #2e2140;
	--lorop-line: rgba(255, 255, 255, .12);
	--lorop-border: #8f93b0;
	--lorop-focus: #ffffff;
	--lorop-error: #ffb4ab;
	--lorop-hero-bg: linear-gradient(160deg, #3b2442 0%, #262040 55%, #161a34 100%);
	--lorop-header-bg: rgba(18, 21, 43, .96);
	--lorop-footer-bg: #0d1024;
	--lorop-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 18px 40px -20px rgba(0, 0, 0, .7);
	--lorop-shadow-lg: 0 40px 80px -40px rgba(0, 0, 0, .8);
	color-scheme: dark;
}

/* ==========================================================================
   2. Basis
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html {
	-webkit-text-size-adjust: 100%;
	background: var(--wp--preset--color--base);
}
body {
	-webkit-font-smoothing: antialiased;
	overflow-wrap: break-word;
	hyphens: auto;
}
img, svg { max-width: 100%; height: auto; }

/* Fokus: immer sichtbar, kontextabhängige Farbe (≥ 3:1 auf jedem Hintergrund) */
:focus-visible {
	outline: 3px solid var(--lorop-focus);
	outline-offset: 3px;
	border-radius: 2px;
}
:focus:not(:focus-visible) { outline: none; }

/* Unsichtbar, aber vorlesbar */
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* Sprunglink (von WordPress für Block-Themes erzeugt) */
.skip-link.screen-reader-text:focus,
.skip-link:focus {
	position: fixed !important;
	top: 12px; left: 12px;
	z-index: 100000;
	width: auto; height: auto;
	margin: 0;
	padding: 12px 18px;
	clip: auto;
	white-space: normal;
	background: var(--wp--preset--color--brand-strong);
	color: var(--lorop-on-brand);
	font-weight: 700;
	text-decoration: underline;
	border-radius: 8px;
	outline: 3px solid var(--lorop-focus);
	outline-offset: 3px;
}

/* Links im Text: immer unterstrichen (nicht nur über Farbe erkennbar) */
a {
	text-decoration-thickness: 1px;
	text-underline-offset: .2em;
}
a:hover { text-decoration-thickness: 2px; }

::selection { background: var(--wp--preset--color--brand-strong); color: var(--lorop-on-brand); }

/* Wo der Header mitläuft, verdeckt er keine angesprungenen/fokussierten Elemente */
@media (min-width: 1181px) and (min-height: 640px) {
	html { scroll-padding-top: calc(var(--lorop-header-h) + 24px); }
}

/* ==========================================================================
   3. Typografie
   ========================================================================== */
h1, h2, h3, h4, h5, h6 {
	text-wrap: balance;
	hyphens: manual;
}
.is-style-display {
	text-transform: uppercase;
	letter-spacing: .005em;
	line-height: 1.06 !important;
}
.is-style-display strong,
.is-style-display em {
	font-weight: inherit;
	font-style: normal;
	color: var(--wp--preset--color--accent);
}

.is-style-kicker {
	display: flex;
	align-items: center;
	gap: 12px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 600;
	font-size: 1.1rem;
	line-height: 1.3;
	text-transform: uppercase;
	letter-spacing: .03em;
	color: var(--wp--preset--color--contrast);
}
.is-style-kicker::before {
	content: "";
	flex: 0 0 auto;
	width: 20px; height: 20px;
	background: var(--wp--preset--color--brand);
	/* LOROP-Sanduhr-Form wie auf programmierung-berlin.de (rein dekorativ) */
	clip-path: polygon(0 0, 100% 0, 60% 50%, 100% 100%, 0 100%, 40% 50%);
}
.has-text-align-center.is-style-kicker { justify-content: center; }

.is-style-lead {
	font-size: clamp(1.1rem, 1.5vw, 1.25rem);
	line-height: 1.65;
	max-width: 62ch;
}

/* Kennzahl: große Zahl + Erklärung */
.is-style-stat {
	margin: 0;
	padding-top: 18px;
	border-top: 1px solid var(--lorop-line);
	line-height: 1.5;
}
.is-style-stat:first-of-type { border-top: 0; padding-top: 0; }
.is-style-stat strong {
	display: block;
	margin-bottom: 4px;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(2rem, 3.4vw, 2.75rem);
	font-weight: 700;
	line-height: 1.05;
	color: var(--wp--preset--color--contrast);
}

/* Häkchen-Liste */
ul.is-style-checklist {
	list-style: none;
	padding-left: 0;
}
ul.is-style-checklist li {
	position: relative;
	padding-left: 34px;
	margin-bottom: .6em;
}
ul.is-style-checklist li::before {
	content: "";
	position: absolute;
	left: 0; top: .2em;
	width: 22px; height: 22px;
	border-radius: 6px;
	background-color: var(--wp--preset--color--brand-strong);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' rx='6'/%3E%3C/svg%3E") center / contain no-repeat;
}
ul.is-style-checklist li::after {
	content: "";
	position: absolute;
	left: 6px; top: calc(.2em + 5px);
	width: 10px; height: 6px;
	border-left: 2.5px solid var(--lorop-on-brand);
	border-bottom: 2.5px solid var(--lorop-on-brand);
	transform: rotate(-45deg);
}

/* Tastenbezeichnungen in Anleitungen */
kbd {
	display: inline-block;
	padding: 0 .4em;
	border: 1px solid var(--lorop-border);
	border-bottom-width: 2px;
	border-radius: 4px;
	background: var(--wp--preset--color--surface-2);
	font-family: inherit;
	font-size: .9em;
	line-height: 1.5;
	white-space: nowrap;
}

/* Inhaltslisten etwas luftiger */
.wp-block-post-content li + li { margin-top: .35em; }

/* ==========================================================================
   4. Buttons
   ========================================================================== */
.wp-element-button,
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 48px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .15), 0 10px 24px -14px rgba(170, 60, 88, .55);
}
.wp-block-button__link::after {
	content: "";
	width: 16px; height: 16px;
	flex: 0 0 auto;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%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' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* Sekundär-Button: Rahmen in Textfarbe (15:1 statt 1.6:1 im Original) */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--contrast);
	border: 0;
	box-shadow: inset 0 0 0 2px currentColor;
	padding: .95rem 1.5rem;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--surface-2);
	color: var(--wp--preset--color--contrast);
}

/* ==========================================================================
   5. Header
   ========================================================================== */
.wp-site-blocks > header.wp-block-template-part {
	position: relative;
	z-index: 100;
	margin: 0;
}
/* Mitlaufend nur, wenn genug Platz ist – bei Zoom/kleinen Höhen nicht (WCAG 1.4.10) */
@media (min-width: 1181px) and (min-height: 640px) {
	.wp-site-blocks > header.wp-block-template-part { position: sticky; top: 0; }
	.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 32px; }
}

.site-header {
	position: relative;
	background: var(--lorop-header-bg);
	box-shadow: 0 1px 0 var(--lorop-line), 0 6px 20px -16px rgba(31, 36, 70, .3);
}
.site-header__inner {
	max-width: var(--lorop-wrap);
	min-height: var(--lorop-header-h);
	margin: 0 auto;
	padding: 10px var(--lorop-gutter);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 20px;
}
/* Platz rechts für den Farbschema-Button am Seitenrand (wie programmierung-berlin.de) */
@media (min-width: 1181px) {
	.site-header__inner { padding-right: max(var(--lorop-gutter), calc(70px - max(0px, (100vw - var(--lorop-wrap)) / 2))); }
}

/* Helle/dunkle Fassung (Logo, Bereichsmuster) */
.nur-dunkel { display: none !important; }
:root[data-theme="dark"] .nur-hell { display: none !important; }
:root[data-theme="dark"] .nur-dunkel { display: block !important; }
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .nur-hell { display: none !important; }
	:root:not([data-theme="light"]) .nur-dunkel { display: block !important; }
}

.brand {
	display: inline-flex;
	align-items: center;
	margin-right: auto;
	padding: 6px 0;
	text-decoration: none;
}
.brand img { height: 36px; width: auto; }

.site-nav__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2px;
}
.site-nav a {
	position: relative;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 8px 11px;
	border-radius: 6px;
	text-decoration: none;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: 1rem;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: .02em;
	color: var(--wp--preset--color--contrast);
}
/* Aktiv/Hover: Unterstrich in Magenta (zusätzlich zu aria-current, nicht nur Farbe) */
.site-nav a::after {
	content: "";
	position: absolute;
	left: 11px; right: 11px; bottom: 6px;
	height: 3px;
	background: var(--wp--preset--color--brand-strong);
	transform: scaleX(0);
	transform-origin: left;
}
.site-nav a:hover::after,
.site-nav a[aria-current="page"]::after { transform: scaleX(1); }

/* Menüpunkt mit CSS-Klasse "is-cta" erscheint als Button */
.site-nav .is-cta a {
	margin-left: 8px;
	padding: 10px 18px;
	background: var(--wp--preset--color--brand-strong);
	color: var(--lorop-on-brand);
	font-weight: 600;
	letter-spacing: .05em;
	border-radius: 8px;
}
.site-nav .is-cta a:hover { background: var(--lorop-button-hover); }
.site-nav .is-cta a::after { background: var(--lorop-on-brand); left: 18px; right: 18px; bottom: 7px; height: 2px; }

.nav-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 1px solid var(--lorop-border);
	border-radius: 10px;
	background: var(--wp--preset--color--surface-2);
	color: var(--wp--preset--color--contrast);
	cursor: pointer;
}
.nav-toggle[hidden] { display: none; }
.nav-toggle svg { width: 22px; height: 22px; }
.nav-toggle:hover { background: var(--wp--preset--color--surface); }
.nav-toggle__close { display: none; }
.nav-toggle[aria-expanded="true"] .nav-toggle__open { display: none; }
.nav-toggle[aria-expanded="true"] .nav-toggle__close { display: block; }

/* Farbschema-Menü (Icon-Button mit Auswahlliste, wie programmierung-berlin.de). Ohne JavaScript ausgeblendet. */
.theme-menu { position: relative; }
.theme-menu[hidden] { display: none !important; }
.theme-menu--header { position: absolute; top: 50%; right: 16px; transform: translateY(-50%); z-index: 110; }
.theme-btn {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1px solid var(--lorop-border);
	border-radius: 8px;
	background: none;
	color: var(--wp--preset--color--contrast);
	cursor: pointer;
}
.theme-btn:hover, .theme-btn[aria-expanded="true"] { background: var(--wp--preset--color--surface-2); }
.theme-btn svg { width: 18px; height: 18px; display: block; }
.theme-btn [hidden] { display: none; }
.theme-list {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	min-width: 176px;
	padding: 6px;
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--lorop-border);
	border-radius: 12px;
	box-shadow: var(--lorop-shadow-lg);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-4px);
}
.theme-list.open { opacity: 1; visibility: visible; transform: none; }
.theme-list button {
	width: 100%;
	min-height: 44px;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 10px;
	border: 0;
	border-radius: 8px;
	background: none;
	color: var(--wp--preset--color--contrast);
	font: inherit;
	font-size: .95rem;
	text-align: left;
	cursor: pointer;
}
.theme-list button:hover { background: var(--wp--preset--color--surface-2); }
.theme-list button:focus-visible { background: var(--wp--preset--color--surface-2); outline-offset: -3px; }
.theme-list svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--wp--preset--color--muted); }
.theme-list .tick { margin-left: auto; color: var(--wp--preset--color--accent); visibility: hidden; }
.theme-list [aria-checked="true"] .tick { visibility: visible; }
.theme-list [aria-checked="true"] { font-weight: 700; }

/* Kontakt und Farbschema im mobilen Menü */
.site-nav__meta { display: none; }

/* Seitliche Schnellkontakt-Leiste (wie lorop.de / programmierung-berlin.de) */
.side-contact { position: fixed; right: 0; top: 50%; transform: translateY(-50%); z-index: 90; display: grid; gap: 2px; }
.side-contact a {
	display: flex;
	align-items: center;
	gap: 18px;
	height: 50px;
	padding: 0 16px;
	margin-left: auto;
	background: var(--wp--preset--color--navy);
	color: #fff;
	text-decoration: none;
	border-radius: 10px 0 0 10px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: .95rem;
	text-transform: uppercase;
	letter-spacing: .03em;
	transform: translateX(calc(100% - 50px));
	box-shadow: 0 10px 24px -12px rgba(31, 36, 70, .6);
}
.side-contact a:hover, .side-contact a:focus-visible {
	transform: none;
	background: var(--wp--preset--color--brand);
	color: var(--lorop-on-brand);
	outline-color: var(--lorop-focus);
}
.side-contact svg { width: 20px; height: 20px; flex-shrink: 0; }
:root[data-theme="dark"] .side-contact a:not(:hover):not(:focus-visible) { background: #262c57; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .side-contact a:not(:hover):not(:focus-visible) { background: #262c57; } }
@media (max-width: 1180px), (max-height: 520px) { .side-contact { display: none; } }

/* Mobil/Tablet: Navigation als aufklappbare Liste unter dem Header */
@media (max-width: 1180px) {
	.site-nav { order: 10; flex-basis: 100%; }
	.js .site-nav:not(.is-open) { display: none; }
	.site-nav__list { flex-direction: column; align-items: stretch; padding: 4px 0 16px; }
	.site-nav a {
		width: 100%;
		padding: 14px 4px;
		font-size: 1.2rem;
		border-bottom: 1px solid var(--lorop-line);
		border-radius: 0;
	}
	.site-nav a::after { left: 4px; right: auto; width: 2.5em; bottom: 8px; }
	.site-nav .is-cta a { margin: 16px 0 0; justify-content: center; padding: 16px; border-radius: 8px; border: 0; }
	.site-nav .is-cta a::after { display: none; }
	.nav-toggle { order: 2; }
	.theme-menu--header { display: none !important; }
	.site-nav__meta {
		display: flex;
		align-items: flex-end;
		justify-content: space-between;
		gap: 16px;
		padding: 8px 0 20px;
	}
	.site-nav__contact { display: grid; gap: 6px; margin: 0; min-width: 0; }
	.site-nav__contact a {
		display: inline-flex; align-items: center; gap: 10px; width: auto;
		min-height: 44px; padding: 0; border: 0; font-family: inherit; font-size: 1rem;
		text-transform: none; letter-spacing: 0; overflow-wrap: anywhere;
	}
	.site-nav__contact a::after { display: none; }
	.site-nav__contact svg { width: 18px; height: 18px; flex-shrink: 0; color: var(--wp--preset--color--accent); }
	.theme-menu--nav .theme-btn { width: 46px; height: 46px; border-radius: 10px; background: var(--wp--preset--color--surface-2); }
	.theme-menu--nav .theme-list { top: auto; bottom: calc(100% + 8px); }
}
@media (max-width: 480px) {
	.site-header__inner { gap: 8px 10px; }
	.brand img { height: 30px; }
}

/* ==========================================================================
   6. Seitenkopf (Unterseiten) und Brotkrümel
   ========================================================================== */
.page-hero {
	background: var(--lorop-hero-bg);
	padding-top: clamp(40px, 6vw, 80px) !important;
	padding-bottom: clamp(40px, 6vw, 72px) !important;
	margin-bottom: clamp(40px, 5vw, 64px);
	--wp--preset--color--accent: var(--wp--preset--color--accent-hero);
}
.page-hero .wp-block-post-title,
.page-hero h1 { margin-top: 0; }
.page-hero .wp-block-post-date,
.page-hero .post-meta { color: var(--wp--preset--color--body); }

.breadcrumbs ol {
	list-style: none;
	margin: 0 0 18px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 4px 0;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--body);
}
.breadcrumbs li { display: inline-flex; align-items: center; }
.breadcrumbs li + li::before {
	content: "/";
	margin: 0 10px;
	color: var(--wp--preset--color--body);
}
.breadcrumbs a { color: var(--wp--preset--color--contrast); }
.breadcrumbs [aria-current="page"] { font-weight: 700; color: var(--wp--preset--color--contrast); }

/* ==========================================================================
   7. Abschnitte und Block-Stile
   ========================================================================== */
main { display: block; }
main > .wp-block-post-content > .alignfull:first-child,
main > .alignfull:first-child { margin-top: 0; }
main .wp-block-post-content > .alignfull + .alignfull { margin-top: 0; }

/* Hero */
.is-style-lorop-hero {
	position: relative;
	background: var(--lorop-hero-bg);
	padding-top: clamp(56px, 8vw, 104px) !important;
	padding-bottom: clamp(56px, 8vw, 104px) !important;
	--wp--preset--color--accent: var(--wp--preset--color--accent-hero);
}
.is-style-lorop-hero.has-tiles-below { padding-bottom: clamp(120px, 12vw, 168px) !important; }
/* Vertrauenspunkte unter den Hero-Buttons (wie programmierung-berlin.de) */
ul.is-style-checklist.hero-trust { display: flex; flex-wrap: wrap; gap: 6px 28px; margin-top: 1.75rem; font-size: .98rem; color: var(--wp--preset--color--contrast); }
ul.is-style-checklist.hero-trust li { margin: 0; }

/* Bereichsmuster rechts im Hero (wie programmierung-berlin.de) */
.lorop-muster img { display: block; width: 100%; max-width: 520px; height: auto; margin-left: auto; }
@media (max-width: 781px) { .lorop-muster img { max-width: 280px; margin: 8px auto 0; } }

/* Kennzahlen-Leiste unter den Kacheln */
.lorop-facts { margin-top: clamp(32px, 4vw, 48px) !important; }
.lorop-facts .is-style-stat { border-top: 0; padding-top: 0; color: var(--wp--preset--color--body); }
.lorop-facts .is-style-stat strong { font-size: clamp(1.8rem, 3vw, 2.4rem); color: var(--wp--preset--color--accent); }
.lorop-facts .wp-block-column + .wp-block-column { border-left: 1px solid var(--lorop-line); padding-left: clamp(16px, 2.5vw, 32px); }
@media (max-width: 781px) { .lorop-facts .wp-block-column + .wp-block-column { border-left: 0; padding-left: 0; border-top: 1px solid var(--lorop-line); padding-top: 18px; } }

/* Abschnitte */
.is-style-lorop-section,
.is-style-lorop-tone,
.is-style-lorop-panel.alignfull {
	padding-top: clamp(64px, 8vw, 112px) !important;
	padding-bottom: clamp(64px, 8vw, 112px) !important;
}
.is-style-lorop-tone { background: var(--wp--preset--color--base-2); }

/* Navy-Panel: eigene Farbtokens innen, damit alle Kontraste stimmen */
.is-style-lorop-panel {
	--wp--preset--color--contrast: var(--lorop-panel-text);
	--wp--preset--color--body: var(--lorop-panel-muted);
	--wp--preset--color--muted: var(--lorop-panel-muted);
	--wp--preset--color--accent: var(--lorop-panel-accent);
	--lorop-focus: #ffffff;
	--lorop-line: rgba(255, 255, 255, .16);
	position: relative;
	background:
		radial-gradient(circle at 85% 0%, rgba(250, 118, 146, .2), transparent 45%),
		linear-gradient(160deg, var(--wp--preset--color--panel-2), var(--wp--preset--color--panel));
	color: var(--lorop-panel-muted);
}
.is-style-lorop-panel:not(.alignfull) {
	padding: clamp(24px, 3vw, 36px) !important;
	border-radius: 20px;
	box-shadow: var(--lorop-shadow-lg);
}
.is-style-lorop-panel .wp-block-button.is-style-outline > .wp-block-button__link { color: #fff; }
.is-style-lorop-panel .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: rgba(255, 255, 255, .1); }

.cta-kontakt__direkt { margin-top: 1.25rem !important; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--body); }
.experte { max-width: 760px; }
.experte .is-style-kicker { margin-bottom: .5rem; }

/* Karte */
.is-style-lorop-card {
	position: relative;
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--lorop-line);
	border-radius: var(--lorop-radius);
	padding: clamp(24px, 3vw, 32px) !important;
	box-shadow: var(--lorop-shadow);
}
.is-style-lorop-card > :first-child { margin-top: 0; }
.is-style-lorop-card > :last-child { margin-bottom: 0; }

/* Navy-Kacheln (ragen in den Hero hinein) */
.is-style-lorop-tiles {
	position: relative;
	z-index: 3;
	margin-top: calc(-1 * clamp(72px, 8vw, 104px)) !important;
}
.is-style-lorop-tiles > .wp-block-group {
	--wp--preset--color--contrast: #fff;
	--wp--preset--color--body: var(--lorop-panel-muted);
	--lorop-focus: #ffffff;
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 22px 22px 26px;
	border-radius: 12px;
	overflow: hidden;
	background: linear-gradient(160deg, var(--wp--preset--color--panel-2), var(--wp--preset--color--panel));
	color: var(--lorop-panel-muted);
	box-shadow: var(--lorop-shadow-lg);
}
.is-style-lorop-tiles > .wp-block-group::after {
	content: "";
	position: absolute;
	left: 0; bottom: 0;
	height: 4px; width: 30%;
	background: var(--wp--preset--color--brand);
}
.is-style-lorop-tiles > .wp-block-group:hover::after,
.is-style-lorop-tiles > .wp-block-group:focus-within::after { width: 100%; }
.is-style-lorop-tiles p { margin: 0; font-size: .95rem; line-height: 1.5; }
.is-style-lorop-tiles .tile-title {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 600;
	font-size: 1.3rem;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: .02em;
}
.is-style-lorop-tiles .tile-title a {
	color: #fff;
	text-decoration: none;
}
/* Ganze Kachel klickbar, Linkname bleibt nur der Titel */
.is-style-lorop-tiles .tile-title a::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}
.is-style-lorop-tiles .tile-title a:hover { text-decoration: underline; }
.is-style-lorop-tiles .tile-title a:focus-visible { outline: none; }
.is-style-lorop-tiles > .wp-block-group:has(a:focus-visible) {
	/* Rahmen liegt außerhalb der Kachel auf hellem Grund → Navy; im Dunkelmodus Weiß */
	outline: 3px solid #1f2446;
	outline-offset: 3px;
}
:root[data-theme="dark"] .is-style-lorop-tiles > .wp-block-group:has(a:focus-visible) { outline-color: #fff; }
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .is-style-lorop-tiles > .wp-block-group:has(a:focus-visible) { outline-color: #fff; }
}

/* Bilder */
.wp-block-image img { border-radius: var(--lorop-radius); }
.wp-block-image.is-style-plain img { border-radius: 0; }

/* Zitat, Tabelle, Trenner */
.wp-block-quote {
	margin-left: 0;
	padding: 4px 0 4px 24px;
	border-left: 4px solid var(--wp--preset--color--brand-strong);
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--contrast);
}
.wp-block-table table { border-collapse: collapse; width: 100%; }
.wp-block-table th, .wp-block-table td {
	padding: 10px 14px;
	border: 1px solid var(--lorop-border);
	text-align: left;
	vertical-align: top;
}
.wp-block-table thead th {
	background: var(--wp--preset--color--surface-2);
	color: var(--wp--preset--color--contrast);
	font-weight: 700;
}
.wp-block-separator { border: 0; border-top: 1px solid var(--lorop-line); opacity: 1; }

/* Häufige Fragen: native <details> (Tastatur und Screenreader ohne JavaScript), Pfeil als Zustandsanzeige */
.wp-block-details {
	margin-block: 0 !important;
	border-bottom: 1px solid var(--lorop-border);
}
.wp-block-details:first-of-type { border-top: 1px solid var(--lorop-border); }
.wp-block-details summary {
	position: relative;
	display: block;
	padding: 16px 44px 16px 0;
	cursor: pointer;
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
	list-style: none;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after {
	content: "";
	position: absolute;
	right: 8px;
	top: 50%;
	width: 12px;
	height: 12px;
	border-right: 3px solid currentColor;
	border-bottom: 3px solid currentColor;
	transform: translateY(-75%) rotate(45deg);
}
.wp-block-details[open] summary::after { transform: translateY(-25%) rotate(-135deg); }
.wp-block-details summary:hover { color: var(--wp--preset--color--accent); }
.wp-block-details > :not(summary) { margin-top: 0; }
.wp-block-details > :last-child { margin-bottom: 20px; }

/* SimpleTOC (Inhaltsverzeichnis) als Karte */
.wp-block-simpletoc-toc,
.simpletoc {
	padding: 20px 24px;
	background: var(--wp--preset--color--base-2);
	border-left: 4px solid var(--wp--preset--color--brand-strong);
	border-radius: 0 var(--lorop-radius) var(--lorop-radius) 0;
}

/* ==========================================================================
   8. Beitragslisten (Query Loop)
   ========================================================================== */
.lorop-post-cards .wp-block-post-template { gap: 24px; }
.lorop-post-cards .wp-block-post {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--lorop-line);
	border-radius: var(--lorop-radius);
	overflow: hidden;
	box-shadow: var(--lorop-shadow);
}
.lorop-post-cards .wp-block-post-featured-image { margin: 0; aspect-ratio: 16 / 9; overflow: hidden; }
.lorop-post-cards .wp-block-post-featured-image img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.lorop-post-cards .post-card__body { padding: 22px 24px 26px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.lorop-post-cards .post-card__body > * { margin: 0; }
/* Im Quelltext steht der Titel vor dem Datum (Vorlesereihenfolge), optisch darüber */
.lorop-post-cards .wp-block-post-date { order: -1; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); }
.lorop-post-cards .wp-block-post-title { font-size: 1.3rem; line-height: 1.25; }
.lorop-post-cards .wp-block-post-title a { color: var(--wp--preset--color--contrast); text-decoration: none; }
.lorop-post-cards .wp-block-post-title a:hover { text-decoration: underline; }
/* Ganze Karte klickbar, Linkname = Titel */
.lorop-post-cards .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.lorop-post-cards .wp-block-post-title a:focus-visible { outline: none; }
.lorop-post-cards .wp-block-post:has(.wp-block-post-title a:focus-visible) {
	outline: 3px solid var(--lorop-focus);
	outline-offset: 3px;
}
.lorop-post-cards .wp-block-post-excerpt { color: var(--wp--preset--color--body); font-size: .98rem; }
.lorop-post-cards .wp-block-post-excerpt__more-text { display: none; }

.wp-block-query-pagination { gap: 8px; margin-top: 40px; }
.wp-block-query-pagination a,
.wp-block-query-pagination .page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 44px; min-height: 44px; padding: 0 12px;
	border: 1px solid var(--lorop-border); border-radius: 8px;
	text-decoration: none; color: var(--wp--preset--color--contrast);
}
.wp-block-query-pagination .current {
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--contrast);
}

/* Artikel-Metadaten */
.post-meta {
	display: flex; flex-wrap: wrap; gap: 4px 18px;
	font-size: var(--wp--preset--font-size--small);
}
.post-meta > * { margin: 0 !important; }

/* ==========================================================================
   9. Formulare (WordPress-Suche, WPForms)
   ========================================================================== */
input[type="text"], input[type="email"], input[type="tel"], input[type="url"],
input[type="search"], input[type="number"], select, textarea {
	min-height: 48px;
	padding: 10px 14px;
	border: 2px solid var(--lorop-border);
	border-radius: 8px;
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--contrast);
	font: inherit;
}
input:focus-visible, select:focus-visible, textarea:focus-visible { border-color: var(--wp--preset--color--contrast); }
.wp-block-search__label {
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
}
.wp-block-search__inside-wrapper { gap: 8px; }
.wp-block-search__button { margin-left: 0; }

div.wpforms-container-full {
	--wpforms-field-border-color: var(--lorop-border);
	--wpforms-field-border-size: 2px;
	--wpforms-field-border-radius: 8px;
	--wpforms-field-background-color: var(--wp--preset--color--surface);
	--wpforms-field-text-color: var(--wp--preset--color--contrast);
	--wpforms-label-color: var(--wp--preset--color--contrast);
	--wpforms-label-sublabel-color: var(--wp--preset--color--body);
	--wpforms-label-error-color: var(--lorop-error);
	--wpforms-button-background-color: var(--wp--preset--color--brand-strong);
	--wpforms-button-text-color: var(--lorop-on-brand);
	--wpforms-button-border-radius: 8px;
	--wpforms-field-size-input-height: 48px;
	--wpforms-field-size-font-size: 1.0625rem;
	--wpforms-label-size-font-size: 1.0625rem;
}
div.wpforms-container-full .wpforms-form .wpforms-field-label { font-weight: 700; }
div.wpforms-container-full .wpforms-form .wpforms-required-label { color: inherit; }
div.wpforms-container-full .wpforms-form input[type="checkbox"],
div.wpforms-container-full .wpforms-form input[type="radio"] { width: 24px; height: 24px; }
.lorop-form-hint { margin: 0 0 1rem; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--body); }
div.wpforms-container-full .wpforms-form input:focus,
div.wpforms-container-full .wpforms-form textarea:focus,
div.wpforms-container-full .wpforms-form select:focus {
	outline: 3px solid var(--lorop-focus) !important;
	outline-offset: 2px;
	box-shadow: none !important;
}
div.wpforms-container-full .wpforms-form button[type="submit"] {
	font-family: var(--wp--preset--font-family--display);
	text-transform: uppercase;
	letter-spacing: .05em;
	min-height: 48px;
}
div.wpforms-container-full .wpforms-form button[type="submit"]:hover { background: var(--lorop-button-hover) !important; color: var(--lorop-on-brand) !important; }
div.wpforms-container-full .wpforms-form em.wpforms-error,
div.wpforms-container-full .wpforms-form label.wpforms-error { color: var(--lorop-error) !important; }
div.wpforms-container-full .wpforms-form .wpforms-has-error input,
div.wpforms-container-full .wpforms-form .wpforms-has-error textarea,
div.wpforms-container-full .wpforms-form .wpforms-has-error select,
div.wpforms-container-full .wpforms-form [aria-invalid="true"] { border-color: var(--lorop-error) !important; }
div.wpforms-container-full .wpforms-form button[type="submit"]:focus-visible { outline: 3px solid var(--lorop-focus) !important; outline-offset: 3px; }

/* Complianz-Cookie-Banner: lesbare Schriftgröße, ausreichende Klickflächen (WCAG 2.5.8) */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-message { font-size: .95rem; line-height: 1.55; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-links a {
	display: inline-flex;
	align-items: center;
	min-height: 28px;
	font-size: .9rem;
	text-decoration: underline;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn { min-height: 48px; font-size: 1rem; }
#cmplz-cookiebanner-container .cmplz-cookiebanner :focus-visible { outline: 3px solid #1f2446; outline-offset: 2px; }

/* Farben im LOROP-Design (statt Complianz-Blau): Akzeptieren BASIS mit Navy-Schrift, Ablehnen Navy, Einstellungen als Rahmen-Button.
   Kontraste: Navy auf BASIS 5,8:1, Weiß auf Navy 15:1, Navy auf Weiß 15:1, Links TIEF 6:1. */
.cmplz-cookiebanner {
	--cmplz_banner_background_color: #ffffff !important;
	--cmplz_text_color: #1f2446 !important;
	--cmplz_hyperlink_color: #aa3c58 !important;
	--cmplz_button_accept_background_color: #fa7692 !important;
	--cmplz_button_accept_border_color: #fa7692 !important;
	--cmplz_button_accept_text_color: #1f2446 !important;
	--cmplz_button_deny_background_color: #1f2446 !important;
	--cmplz_button_deny_border_color: #1f2446 !important;
	--cmplz_button_deny_text_color: #ffffff !important;
	--cmplz_button_settings_background_color: #ffffff !important;
	--cmplz_button_settings_border_color: #1f2446 !important;
	--cmplz_button_settings_text_color: #1f2446 !important;
	--cmplz_button_border_radius: 8px !important;
	--cmplz_slider_active_color: #aa3c58 !important;
	--cmplz_slider_inactive_color: #767a94 !important;   /* Schalter „aus“ 4,4:1 statt 2,7:1 (WCAG 1.4.11) */
	--cmplz_category_header_always_active_color: #0c6a3e !important;
	font-family: var(--wp--preset--font-family--body);
	box-shadow: var(--lorop-shadow-lg) !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .04em;
	border-width: 2px;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-title { font-family: var(--wp--preset--font-family--display); font-weight: 600; text-transform: uppercase; letter-spacing: .03em; }
/* Leere Dokument-Links nie ausgeben (sonst leerer, fokussierbarer Link, WCAG 2.4.4/4.1.2) */
#cmplz-cookiebanner-container .cmplz-link:empty { display: none !important; }
/* Schließen-Kreuz: Zielgröße 44 px (WCAG 2.5.8) */
#cmplz-cookiebanner-container .cmplz-close { min-width: 44px; min-height: 44px; display: grid; place-items: center; cursor: pointer; }
/* Bei starkem Zoom bzw. geringer Höhe scrollbar statt abgeschnitten (WCAG 1.4.10) */
/* Complianz verkleinert den Banner bei geringer Höhe per zoom und staucht die Buttons auf 15vh – das macht
   Text und Schaltflächen bei Vergrößerung unbenutzbar. Stattdessen: normale Größe, ganzer Banner scrollt. */
@media (max-height: 480px) {
	#cmplz-cookiebanner-container .cmplz-cookiebanner {
		zoom: 1 !important;
		height: auto !important;
		max-height: calc(100vh - 16px) !important;
		overflow-y: auto !important;
		display: block !important;
		padding: 12px 16px !important;
	}
	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-body { max-height: none !important; overflow: visible !important; }
	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons { display: flex !important; flex-wrap: wrap; gap: 8px !important; margin-top: 12px; }
	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-btn {
		zoom: 1 !important;
		flex: 1 1 auto;
		height: auto !important;
		min-height: 44px !important;
		padding: 10px 14px !important;
		font-size: 1rem !important;
		line-height: 1.3 !important;
		white-space: normal !important;
	}
}
/* Schwebender Button „Zustimmung verwalten“: Fokus auf dem Navy-Footer sichtbar (WCAG 2.4.7) */
#cmplz-manage-consent .cmplz-manage-consent {
	background: #1f2446 !important;
	color: #ffffff !important;
	font-family: var(--wp--preset--font-family--display);
	text-transform: uppercase;
	letter-spacing: .04em;
}
#cmplz-manage-consent .cmplz-manage-consent:focus-visible { outline: 3px solid #fa7692 !important; outline-offset: 2px; }

/* ==========================================================================
   10. Footer
   ========================================================================== */
.wp-site-blocks > footer.wp-block-template-part { margin-top: 0; }
.site-footer {
	--wp--preset--color--contrast: #ffffff;
	--wp--preset--color--accent: var(--lorop-panel-accent);
	--lorop-focus: #ffffff;
	background: var(--lorop-footer-bg);
	color: var(--lorop-panel-muted);
	font-size: .97rem;
	line-height: 1.7;
}
.site-footer__inner {
	max-width: var(--lorop-wrap);
	margin: 0 auto;
	padding: 72px var(--lorop-gutter) 40px;
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
	gap: 40px;
}
.site-footer__brand img { height: 36px; width: auto; margin-bottom: 18px; }
.site-footer__brand p { max-width: 34ch; margin: 0; }
.site-footer__title {
	margin: 0 0 14px;
	font-family: var(--wp--preset--font-family--display);
	font-size: 1rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: #fff;
}
.site-footer__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.site-footer a {
	color: var(--lorop-panel-muted);
	text-decoration: underline;
	text-decoration-color: rgba(201, 203, 224, .5);
	display: inline-block;
	padding: 4px 0;
}
.site-footer a:hover { color: #fff; text-decoration-color: currentColor; }
.site-footer a[aria-current="page"] { color: #fff; font-weight: 700; }
.site-footer address { font-style: normal; }
.site-footer__bottom {
	max-width: var(--lorop-wrap);
	margin: 0 auto;
	padding: 20px var(--lorop-gutter) 28px;
	border-top: 1px solid rgba(255, 255, 255, .14);
	font-size: .9rem;
}
.site-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 24px; }
.site-footer__bottom p { margin: 0; }
.site-footer__consent {
	min-height: 44px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--lorop-panel-muted);
	font: inherit;
	text-decoration: underline;
	text-decoration-color: rgba(201, 203, 224, .5);
	text-underline-offset: .2em;
	cursor: pointer;
}
.site-footer__consent:hover { color: #fff; text-decoration-color: currentColor; }
/* Schwebender Complianz-Button entfällt, Ersatz: „Cookie-Einstellungen“ im Footer (WCAG 2.4.11, verdeckt sonst Inhalte) */
#cmplz-manage-consent { display: none !important; }
@media (max-width: 900px) { .site-footer__inner { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .site-footer__inner { grid-template-columns: 1fr; gap: 28px; padding-top: 56px; } }

/* ==========================================================================
   11. Bewegung – nur wenn nicht reduziert gewünscht
   ========================================================================== */
@media (prefers-reduced-motion: no-preference) {
	html { scroll-behavior: smooth; }
	.wp-element-button, .wp-block-button__link, .site-nav a, .site-nav a::after,
	.nav-toggle, .theme-btn, .theme-list, .side-contact a, .is-style-lorop-tiles > .wp-block-group,
	.is-style-lorop-tiles > .wp-block-group::after, .lorop-post-cards .wp-block-post {
		transition: background-color .2s, color .2s, transform .25s, width .35s, box-shadow .25s, opacity .15s, visibility .15s;
	}
	.wp-block-button__link:hover::after { transform: translateX(3px); }
	.wp-block-button__link::after { transition: transform .2s; }
	.is-style-lorop-tiles > .wp-block-group:hover,
	.lorop-post-cards .wp-block-post:hover { transform: translateY(-4px); }
}

/* ==========================================================================
   12. Windows-Kontrastmodus (forced-colors)
   ========================================================================== */
@media (forced-colors: active) {
	:focus-visible { outline-color: Highlight; }
	.is-style-lorop-tiles > .wp-block-group,
	.is-style-lorop-card,
	.lorop-post-cards .wp-block-post,
	.theme-list { border: 1px solid CanvasText; }
	.wp-block-button.is-style-outline > .wp-block-button__link, .site-nav .is-cta a { border: 2px solid ButtonText; }
	.site-nav a[aria-current="page"] { text-decoration: underline; }
	.site-nav a::after, .is-style-kicker::before { forced-color-adjust: none; background: Highlight; }
	.wp-block-button__link { border: 2px solid ButtonText; }
	.wp-block-button__link::after, ul.is-style-checklist li::before { background: ButtonText; }
	ul.is-style-checklist li::after { border-color: Canvas; }
	.is-style-lorop-tiles > .wp-block-group:has(a:focus-visible),
	.lorop-post-cards .wp-block-post:has(.wp-block-post-title a:focus-visible) { outline: 3px solid Highlight; }
}

/* ==========================================================================
   13. Druck
   ========================================================================== */
@media print {
	.wp-site-blocks > header.wp-block-template-part { position: static; }
	.nav-toggle, .theme-menu, .side-contact, .site-nav, .is-style-lorop-tiles, .wp-block-buttons { display: none !important; }
	.is-style-lorop-hero, .page-hero, .is-style-lorop-panel, .site-footer { background: none !important; color: #000 !important; }
	a[href^="http"]::after { content: " (" attr(href) ")"; font-size: .85em; }
}