/*
Theme Name: NACHBARINNEN
Theme URI: https://nachbarinnen.at
Author: Levels
Author URI: https://levels.dev
Description: Block-Theme für den Verein NACHBARINNEN in Wien. Ersetzt die Oxygen-Vorlagen.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
Version: 0.1.0
License: GNU General Public License v2 or later
Text Domain: nachbarinnen
WC requires at least: 9.0
*/

/* Breakpoints wie in Oxygen: 1120 / 991 / 767 / 479 px */

/* ---------- Grundlagen ---------- */

html {
	overflow-x: clip;
}

/* Ankerlinks weich anscrollen – erst nach dem Laden eingeschaltet (assets/js/smooth-anchors.js). */
html.nb-smooth-scroll {
	scroll-behavior: smooth;
	scroll-padding-top: 110px; /* Sticky-Header */
}

body {
	overflow-x: clip;
	-webkit-font-smoothing: antialiased;
}

/* Header, Inhalt und Footer liegen ohne Blockabstand aneinander */
:root .wp-site-blocks > * {
	margin-block-start: 0;
}

a {
	text-underline-offset: 0.15em;
}

/* ---------- Header ---------- */

/* Der Template-Part-Wrapper selbst klebt oben, damit das Sticky über die ganze Seite wirkt. */
.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 100;
	transition: box-shadow 0.2s ease-in-out;
}

.nb-is-scrolled .wp-site-blocks > header.wp-block-template-part {
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

.nb-header__row {
	position: relative;
	display: flex;
	align-items: center;
	height: 100px;
	padding: 0 20px;
}

.nb-header .nb-header__row > * {
	margin: 0;
}

.nb-header__logo {
	flex: none;
	align-self: flex-start;
}

.nb-header__logo img {
	display: block;
	width: 90px;
	height: 90px;
	object-fit: contain;
}

/* Menüs */
.nb-header .wp-block-navigation {
	font-size: 16px;
	line-height: 1.5;
	color: var(--wp--preset--color--gold);
}

.nb-header .wp-block-navigation a,
.nb-header .wp-block-navigation a:hover,
.nb-footer .wp-block-navigation a,
.nb-footer .wp-block-navigation a:hover {
	text-decoration: none;
}

/* Hauptmenü in einer Reihe neben dem Logo; rechts bleibt Platz für den Spenden-Stempel */
.nb-nav--main {
	flex: none;
	gap: 40px;
	padding-left: 55px; /* erster Punkt beginnt bei 165 px wie bisher */
	white-space: nowrap;
}

.nb-header .nb-nav--main {
	font-size: 20px;
}

/* Shop: Taschen-Symbol; im Desktop-Header als goldene Pille (Primär-Button), im Handy-Menü normaler Punkt */
.nb-header .nb-nav-shop > .wp-block-navigation-item__content::before {
	content: "";
	display: inline-block;
	width: 1em;
	height: 1em;
	margin-right: 6px;
	vertical-align: -0.12em;
	background: currentColor;
	-webkit-mask: url("assets/icons/cart.svg") center / contain no-repeat;
	mask: url("assets/icons/cart.svg") center / contain no-repeat;
}

/* Shop ganz rechts */
.nb-nav--shop {
	flex: none;
	margin-left: auto !important;
}

.nb-header .nb-nav--shop {
	font-size: 18px;
}

.nb-header .nb-nav--shop .nb-nav-shop > .wp-block-navigation-item__content.wp-block-navigation-item__content {
	display: inline-flex;
	align-items: center;
	padding: 8px 22px;
	border-radius: 999px;
	background: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--white);
	transition: background-color 0.2s ease, transform 0.2s var(--nb-ease), box-shadow 0.2s ease;
}

.nb-header .nb-nav--shop .nb-nav-shop > .wp-block-navigation-item__content.wp-block-navigation-item__content:hover,
.nb-header .nb-nav--shop .nb-nav-shop > .wp-block-navigation-item__content.wp-block-navigation-item__content:focus-visible {
	background: var(--wp--preset--color--blue);
	transform: translateY(-2px);
	box-shadow: 0 8px 18px -8px rgb(54 66 130 / 55%);
}

.nb-header .nb-nav--shop .nb-nav-shop > .wp-block-navigation-item__content:focus-visible {
	outline: 2px solid var(--wp--preset--color--blue);
	outline-offset: 3px;
}

/* Im Button nicht fett werden (die Fett-Regel unten gilt für Textpunkte) */
.nb-header .nb-nav--shop .nb-nav-label {
	font-weight: 400 !important;
}

/*
 * Drüberfahren und aktive Seite (auch der Bereich der aktiven Seite): fett.
 * Die unsichtbare fette Kopie (::after, data-text aus inc/menus.php) hält die Breite, damit nichts springt.
 */
.nb-nav-label {
	display: inline-flex;
	flex-direction: column;
}

.nb-nav-label::after {
	content: attr(data-text);
	height: 0;
	overflow: hidden;
	visibility: hidden;
	font-weight: 700;
	user-select: none;
	pointer-events: none;
}

.nb-header .wp-block-navigation-item__content:hover .nb-nav-label,
.nb-header .wp-block-navigation-item__content:focus-visible .nb-nav-label,
.nb-header .wp-block-navigation-submenu:hover > .wp-block-navigation-item__content .nb-nav-label,
.nb-header .current-menu-item > .wp-block-navigation-item__content .nb-nav-label,
.nb-header .current-menu-ancestor > .wp-block-navigation-item__content .nb-nav-label {
	font-weight: 700;
}

@media (max-width: 1120px) {
	.nb-nav--main {
		gap: 26px;
		padding-left: 30px;
	}

	.nb-header .nb-nav--main {
		font-size: 18px;
	}
}

/* Untermenüs: weiße Kästen, Gold, ohne Rahmen */
.nb-header .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content {
	color: var(--wp--preset--color--gold);
}

.nb-header .wp-block-navigation .wp-block-navigation__submenu-icon {
	width: 8px;
	height: 8px;
	margin-left: 7px;
}

.nb-header .wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container {
	min-width: 0;
	padding: 0;
	border: 0;
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--gold);
}

.nb-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 15px;
	white-space: nowrap;
}

/* Spenden-Badge: schräger blauer Kreis, ragt unten über den Header hinaus */
.nb-donate-badge {
	position: relative; /* Desktop: direkt rechts neben dem Menü, ragt unten aus dem Header; am Handy mittig (unten) */
	top: 17px;
	flex: none;
	align-self: flex-start;
	margin-left: 50px !important;
	z-index: 5;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 116px;
	height: 116px;
	border-radius: 50%;
	background: var(--wp--preset--color--blue);
	box-shadow: 8px 3px 5px var(--wp--preset--color--grey);
	color: var(--wp--preset--color--white);
	text-align: center;
	text-decoration: none;
	transform: rotate(10deg);
	transition: background-color 0.2s ease, transform 0.25s var(--nb-ease), box-shadow 0.25s ease;
}

/* Wie die blauen Buttons: beim Drüberfahren Gold, dazu wird der Stempel etwas größer und gerader */
.nb-donate-badge:hover,
.nb-donate-badge:focus-visible {
	background: var(--wp--preset--color--gold);
	box-shadow: 10px 6px 12px rgb(0 0 0 / 25%);
	color: var(--wp--preset--color--white);
	transform: rotate(4deg) scale(1.06);
}

.nb-donate-badge:active {
	box-shadow: 4px 2px 4px rgb(0 0 0 / 25%);
	transform: rotate(4deg) scale(1.02);
	transition-duration: 0.05s;
}

.nb-donate-badge:focus-visible {
	outline: 2px solid var(--wp--preset--color--blue);
	outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
	.nb-donate-badge:hover,
	.nb-donate-badge:focus-visible,
	.nb-donate-badge:active {
		transform: rotate(10deg);
	}
}

.nb-donate-badge__title {
	display: block;
	max-width: 106px;
	font-size: 24px;
	font-weight: 700;
	line-height: 1;
}

.nb-donate-badge__note {
	display: block;
	margin-top: 5px;
	font-size: 12px;
	line-height: 1.2;
}

/* Mobiles Menü (Burger) erst unter 992 px */
.nb-header .nb-nav--mobile {
	display: none;
}

.nb-nav--mobile .wp-block-navigation__responsive-container-open {
	padding: 14px;
	color: var(--wp--preset--color--gold);
}

.nb-nav--mobile .wp-block-navigation__responsive-container-open svg,
.nb-nav--mobile .wp-block-navigation__responsive-container-close svg {
	width: 40px;
	height: 40px;
}

.nb-nav--mobile .wp-block-navigation__responsive-container.is-menu-open {
	padding: 40px 20px;
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--gold);
}

.nb-nav--mobile .wp-block-navigation__responsive-container-close {
	top: 40px;
	right: 20px;
	color: var(--wp--preset--color--gold);
}

.nb-nav--mobile .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	align-items: flex-start;
	padding-top: 96px; /* Platz unter dem Schließen-X für die beiden Buttons */
}

.nb-nav--mobile .is-menu-open .wp-block-navigation__container,
.nb-nav--mobile .is-menu-open .wp-block-navigation-item {
	align-items: flex-start;
	gap: 0;
}

.nb-nav--mobile .is-menu-open .wp-block-navigation-item__content.wp-block-navigation-item__content {
	padding: 8px 0;
	font-size: 20px;
	line-height: 1.5;
	color: var(--wp--preset--color--gold);
}

.nb-nav--mobile .is-menu-open .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container {
	padding: 0 0 0 20px !important;
}

/* Oben im Handy-Menü: „Jetzt spenden“ (gefüllt) und „Patenschaft“ (Rahmen) nebeneinander */
.nb-nav--mobile .is-menu-open .wp-block-navigation__container.wp-block-navigation__container {
	flex-direction: row;
	flex-wrap: wrap;
	column-gap: 10px;
	width: 100%;
}

.nb-nav--mobile .is-menu-open .wp-block-navigation__container > li:not(.nb-nav-cta) {
	flex-basis: 100%;
}

.nb-nav--mobile .is-menu-open .nb-nav-cta {
	flex: 1 1 0;
	margin-bottom: 16px;
}

.nb-nav--mobile .is-menu-open .nb-nav-cta .wp-block-navigation-item__content.wp-block-navigation-item__content {
	justify-content: center;
	width: 100%;
	min-height: 44px;
	padding: 8px 16px;
	border: 2px solid var(--wp--preset--color--blue);
	border-radius: 999px;
	box-sizing: border-box;
	font-size: 18px;
	text-align: center;
	color: var(--wp--preset--color--blue);
}

.nb-nav--mobile .is-menu-open .nb-nav-cta--donate .wp-block-navigation-item__content.wp-block-navigation-item__content {
	background: var(--wp--preset--color--blue);
	color: var(--wp--preset--color--white);
}

.nb-nav--mobile .is-menu-open .nb-nav-cta .wp-block-navigation-item__content:hover {
	border-color: var(--wp--preset--color--gold);
	background: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--white);
}

/* Shop im Handy-Menü abgesetzt unten */
.nb-nav--mobile .is-menu-open .nb-nav-shop {
	margin-top: 16px;
	padding-top: 12px;
	border-top: 1px solid var(--wp--preset--color--gold);
}

.nb-nav--mobile .nb-nav-shop > .wp-block-navigation-item__content::before {
	content: "";
	display: inline-block;
	width: 1em;
	height: 1em;
	margin-right: 8px;
	vertical-align: -0.12em;
	background: currentColor;
	-webkit-mask: url("assets/icons/cart.svg") center / contain no-repeat;
	mask: url("assets/icons/cart.svg") center / contain no-repeat;
}

/* Bereichsnamen (Was wir tun, Über uns …) fett und dunkel, damit die Gliederung sofort lesbar ist */
.nb-nav--mobile .is-menu-open .wp-block-navigation-submenu > .wp-block-navigation-item__content.wp-block-navigation-item__content {
	margin-top: 12px;
	font-weight: 700;
	color: var(--wp--preset--color--text);
}

.nb-nav--mobile .is-menu-open .wp-block-navigation-submenu .wp-block-navigation-item__content.wp-block-navigation-item__content {
	padding-block: 5px;
}

@media (max-width: 991px) {
	.nb-nav--main,
	.nb-nav--shop {
		display: none !important;
	}

	.nb-donate-badge {
		position: absolute;
		left: calc(50% - 8px);
		margin-left: 0 !important;
	}

	.nb-header .nb-nav--mobile {
		display: flex;
		margin-left: auto !important;
	}
}

/* ---------- Footer: Teilen ---------- */

.nb-share {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 20px;
	border-top: 1px solid var(--wp--preset--color--gold);
	text-align: center;
}

.nb-share > * {
	margin: 0;
}

.nb-share .nb-share__title {
	margin: 0 0 10px;
	font-size: var(--wp--preset--font-size--mega);
	font-weight: 700;
	line-height: 1;
	color: var(--wp--preset--color--gold);
}

.nb-share .nb-share__text {
	margin: 0 0 30px;
	font-size: 18px;
}

.nb-share__buttons {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 0 50px;
	padding: 10px;
}

.nb-share__button {
	display: inline-block;
	margin-bottom: 10px;
	padding: 10px 20px;
	border-radius: 999px;
	background: var(--wp--preset--color--blue);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.15;
	color: var(--wp--preset--color--white);
	text-decoration: none;
}

.nb-share__button--email {
	background: var(--wp--preset--color--gold);
}

.nb-share__button {
	transition: background-color 0.2s ease, transform 0.2s var(--nb-ease), box-shadow 0.2s ease;
}

.nb-share__button:hover,
.nb-share__button:focus-visible {
	background: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--white);
	transform: translateY(-2px);
	box-shadow: 0 8px 18px -8px rgb(54 66 130 / 55%);
}

.nb-share__button--email:hover,
.nb-share__button--email:focus-visible {
	background: var(--wp--preset--color--blue);
}

.nb-share__button:focus-visible {
	outline: 2px solid var(--wp--preset--color--blue);
	outline-offset: 3px;
}

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

.nb-footer {
	padding: 40px 20px 0;
	border-top: 1px solid var(--wp--preset--color--gold);
}

.nb-footer > *,
.nb-footer__grid > *,
.nb-footer__grid > * > * {
	margin-block: 0;
}

.nb-footer__grid,
.nb-footer__bottom {
	max-width: 1040px;
	margin-inline: auto;
	padding-inline: 20px;
}

.nb-footer__grid {
	display: grid;
	grid-template-columns: 500px 250px 250px;
	padding-bottom: 40px;
	border-bottom: 1px solid var(--wp--preset--color--gold);
}

.nb-footer h2,
.nb-footer h3 {
	margin: 0 0 10px;
	color: var(--wp--preset--color--text);
}

.nb-footer h3 {
	font-size: 24px;
}

.nb-footer .nb-footer__account-title {
	font-size: 30px;
}

.nb-footer__newsletter {
	padding-right: 150px;
}

.nb-footer .nb-footer__lead {
	margin-bottom: 24px;
	font-size: 20px;
	line-height: 1.5;
	color: var(--wp--preset--color--black);
}

/* Newsletter direkt im Footer (Mailchimp, öffnet die Bestätigung in neuem Tab) */
.nb-newsletter-form {
	display: flex;
	gap: 10px;
	max-width: 480px;
}

.nb-newsletter-form__email {
	flex: 1;
	min-width: 0;
	min-height: 44px;
	padding: 8px 20px;
	border: 1px solid var(--wp--preset--color--gold);
	border-radius: 999px;
	background: var(--wp--preset--color--white);
	font: inherit;
	font-size: 16px;
	color: var(--wp--preset--color--text);
	box-sizing: border-box;
}

.nb-newsletter-form__email:focus-visible {
	outline: 2px solid var(--wp--preset--color--blue);
	outline-offset: 2px;
}

.nb-newsletter-form__trap {
	position: absolute;
	left: -5000px;
}

.nb-footer .nb-newsletter-form__more {
	margin: 12px 0 0 20px;
	font-size: 14px;
}

@media (max-width: 479px) {
	.nb-newsletter-form {
		flex-direction: column;
	}
}

.nb-footer__contact,
.nb-footer__account {
	padding-left: 20px;
}

.nb-footer .nb-footer__address {
	margin-bottom: 20px;
	color: var(--wp--preset--color--black);
}

.nb-footer__lines {
	margin: 0;
	padding: 0;
	list-style: none;
}

.nb-footer__lines li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	color: var(--wp--preset--color--black);
	line-height: 1.4;
}

.nb-footer__lines svg {
	flex: none;
	color: var(--wp--preset--color--text);
}

.nb-footer__lines a[href^="tel:"] {
	color: inherit;
	text-decoration: none;
}

.nb-footer__social {
	display: flex;
	gap: 10px;
	margin-top: 15px !important;
}

.nb-footer__social a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--white);
	transition: background-color 0.2s ease-in-out;
}

.nb-footer__social a:hover,
.nb-footer__social a:focus-visible {
	background: var(--wp--preset--color--blue);
}

.nb-footer__social svg {
	width: 25px;
	height: 25px;
}

.nb-footer .nb-footer__bank {
	line-height: 1.5;
	color: var(--wp--preset--color--gold);
}

.nb-footer__seal {
	margin-top: 0 !important;
}

.nb-footer__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding-block: 0;
}

.nb-footer__menu {
	gap: 20px;
	padding-left: 10px;
	font-size: 16px;
}

.nb-footer__menu .wp-block-navigation-item__content.wp-block-navigation-item__content {
	padding: 10px 0;
	color: var(--wp--preset--color--gold);
}

.nb-footer .nb-footer__credits {
	padding-block: 2px;
	font-size: 12px;
	line-height: 1.2;
	text-align: right;
}

.nb-footer__credits a {
	color: var(--wp--preset--color--grey);
}

.nb-footer__credits .nb-footer__photo {
	text-decoration: none;
}

@media (max-width: 1120px) {
	.nb-footer__grid {
		grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
	}

	.nb-footer__newsletter {
		padding-right: 60px;
	}
}

@media (max-width: 991px) {
	.nb-share__buttons {
		gap: 0 20px;
	}

	.nb-footer__grid {
		grid-template-columns: 1fr 1fr;
		gap: 40px 0;
	}

	.nb-footer__newsletter {
		grid-column: 1 / -1;
		padding-right: 0;
	}

	.nb-footer__contact {
		padding-left: 0;
	}
}

@media (max-width: 767px) {
	.nb-share .nb-share__text {
		font-size: 16px;
	}

	.nb-footer__grid {
		grid-template-columns: 1fr;
	}

	.nb-footer__account {
		padding-left: 0;
	}

	.nb-footer .nb-footer__lead {
		font-size: 16px;
	}

	.nb-footer__bottom {
		flex-direction: column;
		align-items: flex-start;
		padding-block: 10px 20px;
	}

	.nb-footer__menu {
		padding-left: 0;
	}

	.nb-footer .nb-footer__credits {
		text-align: left;
	}
}

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

/*
 * Pillen in drei Stufen:
 *   primär    Goldfläche (Standard), Variante nb-btn--blue für Patenschafts-Karten
 *   sekundär  nur Rahmen (nb-btn--outline auf Bildern, nb-btn--outline-gold auf hellem Grund), füllt sich beim Drüberfahren
 *   tertiär   Textlink mit Pfeil (.nb-more)
 * Drüberfahren hebt den Button leicht an, Klicken drückt ihn zurück. Tastaturfokus bekommt einen eigenen Ring.
 */
:root {
	--nb-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
	--nb-focus-ring: var(--wp--preset--color--blue);
}

.wp-element-button,
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.4em;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s var(--nb-ease), box-shadow 0.2s ease;
}

/* Feste Größen je Breakpoint. :root .x schlägt die theme.json-Regel,
   die WordPress sonst fluid (14–20 px) rechnet. Buttons immer in Regular, nie fett. */
:root .wp-element-button,
:root .wp-block-button__link {
	font-size: 20px;
	font-weight: 400;
}

:root .wp-element-button:hover,
:root .wp-block-button__link:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 18px -8px rgb(54 66 130 / 55%);
}

:root .wp-element-button:active,
:root .wp-block-button__link:active {
	transform: translateY(0);
	box-shadow: none;
	transition-duration: 0.05s;
}

:root .wp-element-button:focus-visible,
:root .wp-block-button__link:focus-visible {
	outline: 2px solid var(--nb-focus-ring);
	outline-offset: 3px;
}

@media (max-width: 1120px) {
	:root .wp-element-button,
	:root .wp-block-button__link {
		font-size: 18px;
	}
}

@media (max-width: 991px) {
	:root .wp-element-button,
	:root .wp-block-button__link {
		font-size: 20px;
	}
}

/* Handy: mindestens 44 px hoch und gut lesbar */
@media (max-width: 767px) {
	:root .wp-element-button,
	:root .wp-block-button__link {
		min-height: 44px;
		padding: 6px 20px;
		font-size: 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wp-element-button,
	.wp-block-button__link {
		transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
	}

	:root .wp-element-button:hover,
	:root .wp-block-button__link:hover {
		transform: none;
	}
}

/* Sekundär auf Bildern: weißer Rahmen, beim Drüberfahren Gold */
:root .nb-btn--outline {
	background-color: transparent;
	border-color: var(--wp--preset--color--white);
	--nb-focus-ring: var(--wp--preset--color--white);
}

:root .nb-btn--outline:hover {
	background-color: var(--wp--preset--color--gold);
	border-color: var(--wp--preset--color--gold);
}

/* :root, weil die theme.json-Buttonregel ebenfalls :root trägt und später kommt */
/* Sekundär auf hellem Grund: Goldrahmen, beim Drüberfahren Gold gefüllt */
:root .nb-btn--outline-gold {
	background-color: transparent;
	color: var(--wp--preset--color--gold);
}

:root .nb-btn--outline-gold:hover {
	background-color: var(--wp--preset--color--gold);
	border-color: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--white);
}

:root .nb-btn--blue {
	background-color: var(--wp--preset--color--blue);
	border-color: var(--wp--preset--color--blue);
}

:root .nb-btn--blue:hover {
	background-color: var(--wp--preset--color--gold);
	border-color: var(--wp--preset--color--gold);
}

/* Tertiär: „Alle Berichte →“. Der Pfeil rutscht beim Drüberfahren nach rechts, die Linie wächst von links. */
.nb-more {
	display: inline-flex;
	align-items: center;
	gap: 0.3em;
	background: linear-gradient(currentColor, currentColor) 0 100% / 0 2px no-repeat;
	transition: background-size 0.25s var(--nb-ease), color 0.2s ease;
}

.nb-more__arrow {
	display: inline-block;
	transition: transform 0.25s var(--nb-ease);
}

.nb-more:hover,
.nb-more:focus-visible {
	background-size: 100% 2px;
}

.nb-more:hover .nb-more__arrow,
.nb-more:focus-visible .nb-more__arrow {
	transform: translateX(6px);
}

.nb-more--back:hover .nb-more__arrow,
.nb-more--back:focus-visible .nb-more__arrow {
	transform: translateX(-6px);
}

.nb-more:focus-visible {
	outline: 2px solid var(--nb-focus-ring);
	outline-offset: 4px;
	border-radius: 4px;
}

@media (prefers-reduced-motion: reduce) {
	.nb-more__arrow {
		transition: none;
	}
}

/* ---------- Sektionen (blocks/*) ---------- */

/* Seiteninhalt läuft über die volle Breite; alles, was keine Sektion ist, bleibt in der Inhaltsbreite. */
.nb-main .wp-block-post-content > :not(.nb-block):not(.alignfull) {
	max-width: var(--wp--style--global--content-size);
	margin-inline: auto;
	padding-inline: 20px;
	box-sizing: content-box;
}

.nb-main .wp-block-post-content > .nb-block,
.nb-main.nb-main > * {
	margin-block: 0;
}

.nb-block {
	box-sizing: border-box;
}

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

.nb-bg-white {
	background-color: var(--wp--preset--color--white);
}

.nb-bg-orange {
	background-color: rgba(207, 142, 17, 0.3);
}

.nb-bg-sand {
	background-color: rgba(207, 142, 17, 0.2);
}

.nb-bg-gold {
	background-color: var(--wp--preset--color--gold);
}

.nb-bg-gold :is(h1, h2, h3) {
	color: var(--wp--preset--color--white);
}

.nb-bg-grey {
	background-color: var(--wp--preset--color--light);
}

.nb-line-top {
	border-top: 1px solid var(--wp--preset--color--gold);
}

/* Inhaltsbreite wie die Oxygen-Sektionen: 1120 px mit 20 px Rand, 75 px oben und unten */
.nb-inner {
	max-width: 1120px;
	margin-inline: auto;
	padding: 75px 20px;
}

/* Dachzeile über Überschriften (.subheadline) */
.nb-eyebrow {
	margin: 0;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.2;
}

/* Fließtext (.copytext) */
.nb-text {
	font-size: 20px;
	line-height: 1.5;
	color: var(--wp--preset--color--black);
}

.nb-text > * {
	margin-block: 0;
}

/* Absatzabstand = eine Leerzeile wie in Oxygen (<br><br>) */
.nb-text > * + * {
	margin-top: 1.5em;
}

.nb-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

/* „Alle Berichte →“ rechts unter einer Sektion */
.nb-block .nb-more {
	align-self: flex-end;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
}

@media (max-width: 767px) {
	.nb-eyebrow,
	.nb-text {
		font-size: 16px;
	}
}

.nb-line-bottom {
	border-bottom: 1px solid var(--wp--preset--color--gold);
}

/* Abstand oben/unten (Feld „Abstand“ in jedem Block) */
.nb-pt-none .nb-inner {
	padding-top: 0;
}

.nb-pt-xsmall .nb-inner {
	padding-top: 20px;
}

.nb-pb-xsmall .nb-inner {
	padding-bottom: 20px;
}

.nb-pt-small .nb-inner {
	padding-top: 50px;
}

.nb-pt-large .nb-inner {
	padding-top: 100px;
}

.nb-pb-none .nb-inner {
	padding-bottom: 0;
}

.nb-pb-small .nb-inner {
	padding-bottom: 50px;
}

.nb-pb-large .nb-inner {
	padding-bottom: 100px;
}

/* Große Überschriften in Sektionen (Stil „H1“ auf einem h2) */
.nb-block .nb-h1 {
	font-size: var(--wp--preset--font-size--h-1);
	font-weight: 600;
	line-height: 1;
}

.nb-block .nb-h3 {
	font-size: 24px;
	font-weight: 600;
	color: var(--wp--preset--color--gold);
}

/* Videos: YouTube in 16:9 */
.nb-video {
	position: relative;
	aspect-ratio: 16 / 9;
}

.nb-video iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* Kleine Absätze in Fließtext (Klasse aus der theme.json-Schriftgröße „small“) */
.nb-text .has-small-font-size {
	line-height: 1.2;
}

/* Längere Rechtstexte (Datenschutz, AGB): Absätze und Listen mit 20 px Abstand wie bisher */
.nb-text .nb-richtext > * {
	margin: 20px 0;
}

.nb-text .nb-richtext > :first-child {
	margin-top: 0;
}

.nb-text .nb-richtext > :last-child {
	margin-bottom: 0;
}

.nb-text .nb-richtext :is(ul, ol) {
	padding-left: 40px;
}

.nb-text .nb-richtext li {
	margin: 0;
}

/* AGB: nummerierte Punkte mit einer Leerzeile dazwischen (vorher <br><br> am Ende jedes Punkts) */
.nb-text .nb-richtext ol > li {
	margin-bottom: 1.5em;
}

/* ---------- 404: die wichtigsten Wege ---------- */

/* .nb-main.nb-main > * nimmt sonst alle Abstände weg */
.nb-main.nb-main.nb-404 > * + * {
	margin-top: 20px;
}

.nb-main.nb-main.nb-404 > .nb-404__links {
	margin-block: 40px;
}

.nb-404__links {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	padding: 0;
	list-style: none;
}

.nb-404__links a {
	display: flex;
	flex-direction: column;
	gap: 6px;
	height: 100%;
	padding: 24px;
	border: 1px solid var(--wp--preset--color--gold);
	border-radius: 10px;
	box-sizing: border-box;
	color: var(--wp--preset--color--text);
	text-decoration: none;
	transition: background-color 0.2s ease, transform 0.2s var(--nb-ease), box-shadow 0.2s ease;
}

.nb-404__links strong {
	font-size: 22px;
	color: var(--wp--preset--color--gold);
}

.nb-404__links a:hover,
.nb-404__links a:focus-visible {
	background: var(--wp--preset--color--light);
	transform: translateY(-2px);
	box-shadow: 0 8px 18px -8px rgb(54 66 130 / 35%);
}

.nb-404__links a:focus-visible {
	outline: 2px solid var(--wp--preset--color--blue);
	outline-offset: 3px;
}

@media (max-width: 991px) {
	.nb-404__links {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 479px) {
	.nb-404__links {
		grid-template-columns: 1fr;
	}
}


/* ---------- Seitenkopf (acf/pagehero und acf/hero, Aufbau: nb_page_header()) ---------- */

/*
 * Text links auf Weiß (bündig mit dem Inhalt darunter), Bild rechts bis an den Rand mit großer runder Ecke unten links.
 * Am Handy: Text oben, Bild darunter. Keine Schrift mehr im Bild, keine Abdunkelung.
 */
.nb-pagehero.nb-block {
	padding: 0 0 50px; /* zusätzlicher Abstand unter dem Kopf, dazu kommt der Abstand der folgenden Section */
}

@media (max-width: 767px) {
	.nb-pagehero.nb-block {
		padding-bottom: 24px;
	}
}

/* Im Shop schließt die Kategorie-Leiste direkt an den Kopf an */
.nb-pagehero.nb-block:has(+ .nb-shopbar) {
	padding-bottom: 0;
}

.nb-pagehero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); /* Bild immer genau die halbe Breite, egal wie lang der Text ist */
	align-items: center;
}

.nb-pagehero__text {
	padding: 60px 60px 60px 100px; /* links wie der Beitrags-Teaser (.nb-posts) */
}

.nb-pagehero__eyebrow,
.nb-pagehero .nb-breadcrumb ol {
	margin: 0 0 12px;
	font-size: 18px;
	line-height: 1.4;
	color: var(--wp--preset--color--text);
}

.nb-pagehero .nb-pagehero__title {
	margin: 0;
	font-size: 60px;
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.05;
	color: var(--wp--preset--color--gold);
	overflow-wrap: break-word; /* keine automatische Silbentrennung, nur sehr lange Wörter umbrechen */
}

.nb-pagehero .nb-pagehero__subtitle {
	margin: 16px 0 0;
	font-size: 22px;
	line-height: 1.4;
	color: var(--wp--preset--color--text);
}

.nb-pagehero .nb-pagehero__buttons {
	margin-top: 32px;
}

.nb-pagehero__media {
	align-self: stretch;
	height: 520px;
	overflow: hidden;
	border-bottom-left-radius: 160px;
	background: var(--wp--preset--color--light);
}

.nb-pagehero__img.nb-pagehero__img {
	display: block;
	width: 100%;
	height: 100%; /* doppelte Klasse schlägt height:auto aus dem WooCommerce-CSS auf Shopseiten */
	max-width: none;
	object-fit: cover;
	object-position: center;
}

/*
 * Abstand unter dem Kopf: farbige Sections und Sections ohne eigenen oberen Abstand rücken nach unten
 * (weiße Sections mit normalem Abstand bringen ihren eigenen mit).
 */
.nb-pagehero + .nb-block[class*="nb-bg-"]:not(.nb-bg-white),
.nb-pagehero + .nb-block.nb-pt-none,
.nb-pagehero + .nb-block.nb-pt-xsmall {
	margin-top: 75px;
}

@media (max-width: 767px) {
	.nb-pagehero + .nb-block[class*="nb-bg-"]:not(.nb-bg-white),
	.nb-pagehero + .nb-block.nb-pt-none,
	.nb-pagehero + .nb-block.nb-pt-xsmall {
		margin-top: 40px;
	}
}

/* Startseite: gleiche Bildgröße, Überschrift etwas kleiner, weil sie länger ist */
.nb-pagehero__grid--home .nb-pagehero__title {
	font-size: 50px;
}

/* Kompakt (Produktseiten): niedriges Bild, kleinerer Titel */
.nb-pagehero__grid--slim .nb-pagehero__media {
	height: 300px;
	border-bottom-left-radius: 100px;
}

.nb-pagehero__grid--slim .nb-pagehero__title {
	font-size: 44px;
}

.nb-pagehero__grid--slim .nb-pagehero__text {
	padding-block: 40px;
}

/* Nur Bild (Impressum, Rechtliches): volle Breite */
.nb-pagehero__grid--image {
	grid-template-columns: minmax(0, 1fr);
}

.nb-pagehero__grid--image .nb-pagehero__media {
	height: 400px;
}

/* Pfadzeile („Was wir tun ›“) */
.nb-breadcrumb ol {
	display: flex;
	flex-wrap: wrap;
	gap: 0 6px;
	padding: 0;
	list-style: none;
}

.nb-breadcrumb li::after {
	content: "›";
	margin-left: 6px;
}

.nb-breadcrumb a {
	color: inherit;
	text-decoration: none;
	background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat;
	transition: background-size 0.25s var(--nb-ease);
}

.nb-breadcrumb a:hover,
.nb-breadcrumb a:focus-visible {
	background-size: 100% 1px;
}

.nb-breadcrumb a:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
	border-radius: 2px;
}

@media (max-width: 1120px) {
	.nb-pagehero__text {
		padding: 50px 40px 50px 50px;
	}

	.nb-pagehero .nb-pagehero__title {
		font-size: 48px;
	}

	.nb-pagehero__grid--home .nb-pagehero__title {
		font-size: 42px;
	}

	.nb-pagehero__media {
		height: 440px;
		border-bottom-left-radius: 120px;
	}

}

/* Tablet und Handy: Text oben, Bild darunter in voller Breite */
@media (max-width: 991px) {
	.nb-pagehero__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.nb-pagehero__text {
		padding: 56px 20px 28px; /* Luft unter dem Spenden-Stempel */
	}

	.nb-pagehero__media,
	.nb-pagehero__grid--home .nb-pagehero__media,
	.nb-pagehero__grid--image .nb-pagehero__media {
		height: auto;
		aspect-ratio: 4 / 3;
		border-bottom-left-radius: 80px;
	}

	.nb-pagehero__grid--slim .nb-pagehero__media {
		aspect-ratio: 16 / 7;
		border-bottom-left-radius: 60px;
	}
}

@media (max-width: 767px) {
	.nb-pagehero .nb-pagehero__title,
	.nb-pagehero__grid--home .nb-pagehero__title {
		font-size: 36px;
	}

	.nb-pagehero__grid--slim .nb-pagehero__title {
		font-size: 30px;
	}

	.nb-pagehero__eyebrow,
	.nb-pagehero .nb-breadcrumb ol {
		font-size: 16px;
	}

	.nb-pagehero .nb-pagehero__subtitle {
		font-size: 18px;
	}

	.nb-pagehero .nb-pagehero__buttons {
		margin-top: 24px;
	}
}

@media (max-width: 479px) {
	.nb-pagehero .nb-pagehero__title,
	.nb-pagehero__grid--home .nb-pagehero__title {
		font-size: 32px;
	}
}

/* Startseite (acf/hero): drei Kreise – groß, klein überlappend unten rechts, einer im Hintergrund oben rechts; leichter Schatten */
.nb-pagehero__grid--circles .nb-pagehero__title {
	font-size: 50px;
}

.nb-pagehero__grid--circles .nb-pagehero__media {
	height: auto;
	overflow: visible;
	border-radius: 0;
	background: none;
}

.nb-circles {
	position: relative;
	width: 100%;
	/* wächst mit der rechten Hälfte, aber nie höher als der Bildschirm unter dem Header */
	max-width: min(1100px, calc((100vh - 360px) * 1.45)); /* Kopf niedriger als der Bildschirm: die nächste Section ist angeschnitten sichtbar */
	aspect-ratio: 1 / 0.69; /* knapp um die Kreise, wenig Weißraum oben und unten */
}

.nb-circles__item {
	position: absolute;
	aspect-ratio: 1;
	animation: nb-float-x 9s ease-in-out infinite alternate;
}

.nb-circles__item--big {
	top: 4%;
	left: 12%;
	width: 58%;
}

.nb-circles__item--small {
	top: 53%;
	left: 61%;
	width: 30%;
}

.nb-circles__item--logo {
	top: 6%;
	left: 60%;
	width: 19.5%;
	animation-duration: 11s;
	animation-delay: -6s;
}

.nb-circles__item--logo .nb-circles__float {
	animation-duration: 8.2s;
	animation-delay: -3s;
}

.nb-circles__float {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	box-shadow: 0 24px 40px -16px rgb(0 0 0 / 30%);
	animation: nb-float-y 7s ease-in-out infinite alternate;
}

.nb-circles__item--small {
	animation-duration: 6.7s;
	animation-delay: -4s;
}

.nb-circles__item--small .nb-circles__float {
	animation-duration: 5.3s;
	animation-delay: -2s;
}

:root {
	--nb-petrol: #408577; /* „Petrol NACHBARINNEN“ aus dem Flyer 2026 */
}

/* Kreis mit CI-Farbe statt Bild */
.nb-circles__fill {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
}

.nb-circles__fill--gold { background: var(--wp--preset--color--gold); }
.nb-circles__fill--blue { background: var(--wp--preset--color--blue); }
.nb-circles__fill--petrol { background: var(--nb-petrol); }

.nb-circles__img.nb-circles__img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	border-radius: 50%;
	object-fit: cover;
}

/* Seitlich am Kreis, auf und ab an der Hülle darin: zwei Takte je Kreis, dadurch wirkt die Bewegung unregelmäßig */
@keyframes nb-float-y {
	from { transform: translateY(-8px); }
	to { transform: translateY(10px); }
}

@keyframes nb-float-x {
	from { transform: translateX(-7px); }
	to { transform: translateX(7px); }
}

@media (prefers-reduced-motion: reduce) {
	.nb-circles__item,
	.nb-circles__float {
		animation: none;
	}
}

@media (max-width: 991px) {
	.nb-pagehero__grid--circles .nb-pagehero__media {
		aspect-ratio: auto;
		padding: 0 20px;
	}

	.nb-circles {
		margin-inline: auto;
		max-width: 560px;
		aspect-ratio: 1 / 0.85;
	}

	.nb-circles__item--big {
		top: 2%;
		left: 4%;
		width: 66%;
	}

	.nb-circles__item--small {
		top: 50%;
		left: 58%;
		width: 36%;
	}

	.nb-circles__item--logo {
		top: 4%;
		left: 62%;
		width: 24%;
	}
}

@media (max-width: 767px) {
	.nb-pagehero__grid--circles .nb-pagehero__title {
		font-size: 36px;
	}
}

/* ---------- YouTube als Pille (nb_video_pill()) ---------- */

.nb-video-pill {
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	border-radius: 999px;
	background: var(--wp--preset--color--light);
	transition: border-radius 0.3s var(--nb-ease);
}

/* Beim Abspielen runde Ecken statt Pille, damit die Player-Bedienung nicht angeschnitten wird */
.nb-video-pill.is-playing {
	border-radius: 32px;
}

.nb-video-pill.is-blocked {
	aspect-ratio: auto;
	overflow: visible;
	border-radius: 0;
}

.nb-video-pill iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.nb-video-pill__play {
	display: block;
	width: 100%;
	height: 100%;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
}

.nb-video-pill__thumb {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s var(--nb-ease);
}

.nb-video-pill__icon {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: var(--wp--preset--color--gold);
	box-shadow: 0 10px 24px -10px rgb(0 0 0 / 45%);
	transform: translate(-50%, -50%);
	transition: background-color 0.2s ease, transform 0.2s var(--nb-ease);
}

/* Dreieck */
.nb-video-pill__icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 54%;
	border-style: solid;
	border-width: 13px 0 13px 21px;
	border-color: transparent transparent transparent var(--wp--preset--color--white);
	transform: translate(-50%, -50%);
}

.nb-video-pill__play:hover .nb-video-pill__icon,
.nb-video-pill__play:focus-visible .nb-video-pill__icon {
	background: var(--wp--preset--color--blue);
	transform: translate(-50%, -50%) scale(1.08);
}

.nb-video-pill__play:hover .nb-video-pill__thumb {
	transform: scale(1.03);
}

.nb-video-pill__play:focus-visible {
	outline: 3px solid var(--wp--preset--color--blue);
	outline-offset: -3px;
	border-radius: 999px;
}

@media (max-width: 767px) {
	.nb-video-pill__icon {
		width: 56px;
		height: 56px;
	}

	.nb-video-pill__icon::after {
		border-width: 10px 0 10px 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.nb-video-pill,
	.nb-video-pill__thumb,
	.nb-video-pill__icon {
		transition: none;
	}
}

/* Niedrige Bildschirme (Laptops): Kopf kompakter, damit die nächste Section angeschnitten sichtbar bleibt */
@media (min-width: 992px) and (max-height: 800px) {
	.nb-pagehero__text {
		padding-block: 32px;
	}

	.nb-pagehero .nb-pagehero__title,
	.nb-pagehero__grid--circles .nb-pagehero__title {
		font-size: 40px;
	}

	.nb-pagehero .nb-pagehero__buttons {
		margin-top: 20px;
	}

	.nb-pagehero.nb-block {
		padding-bottom: 24px;
	}
}

/* Video-Pille ohne eigenes Vorschaubild (z. B. Facebook): Farbfläche */
.nb-video-pill__thumb--color {
	background: var(--nb-petrol);
}

/*
 * Footer neu (03.11.2026): breite Inhaltsbreite wie der Beitrags-Teaser (100 px Rand),
 * Spalten: Newsletter + Kontakt | Informationen | Spendenkonto; unten Rechtliches mit © darunter, Social Icons rechts.
 */
.nb-footer {
	padding-inline: 0;
}

.nb-footer__grid,
.nb-footer__bottom {
	max-width: none;
	margin-inline: 0;
	padding-inline: 100px;
}

.nb-footer__grid {
	grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
	column-gap: 60px;
}

.nb-footer__newsletter,
.nb-footer__info,
.nb-footer__account {
	padding: 0;
}

.nb-footer__newsletter .nb-newsletter-form {
	max-width: 520px;
}

.nb-footer .nb-footer__contact-title {
	margin-top: 40px !important;
}

.nb-footer__info-menu {
	font-size: 18px;
}

.nb-footer__info-menu .wp-block-navigation__container {
	gap: 6px;
	align-items: flex-start;
}

.nb-footer__info-menu .wp-block-navigation-item__content.wp-block-navigation-item__content {
	padding: 2px 0;
	color: var(--wp--preset--color--gold);
}

.nb-footer__info-menu .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--blue);
}

.nb-footer__bottom {
	align-items: center;
	padding-block: 24px 32px;
}

.nb-footer__legal > * {
	margin-block: 0;
}

.nb-footer__legal .nb-footer__menu {
	padding-left: 0;
}

.nb-footer .nb-footer__credits {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 20px;
	margin-top: 4px;
	font-size: 14px;
	color: var(--wp--preset--color--grey);
	text-align: left;
}

.nb-footer__made {
	display: inline-flex;
	color: var(--wp--preset--color--grey);
	opacity: 0.8;
	transition: opacity 0.2s ease;
}

.nb-footer__made:hover,
.nb-footer__made:focus-visible {
	opacity: 1;
}

.nb-footer__made img {
	display: block;
	width: 112px;
	height: auto;
}

.nb-footer__bottom .nb-footer__social {
	margin-top: 0 !important;
}

@media (max-width: 1120px) {
	.nb-footer__grid,
	.nb-footer__bottom {
		padding-inline: 50px;
	}

	.nb-footer__grid {
		column-gap: 40px;
	}
}

@media (max-width: 991px) {
	.nb-footer__grid {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		row-gap: 40px;
	}

	.nb-footer__newsletter {
		grid-column: 1 / -1;
	}
}

@media (max-width: 767px) {
	.nb-footer__grid,
	.nb-footer__bottom {
		padding-inline: 20px;
	}

	.nb-footer__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.nb-footer__bottom {
		flex-direction: column-reverse;
		align-items: flex-start;
	}
}

/* Footer: alle Spaltenüberschriften gleich groß und auf einer Linie */
.nb-footer .nb-footer__grid h2,
.nb-footer .nb-footer__grid h3 {
	margin: 0 0 20px !important;
	font-size: 24px;
	line-height: 1.2;
	color: var(--wp--preset--color--text);
}

.nb-footer .nb-footer__grid .nb-footer__contact-title {
	margin-top: 40px !important;
}

.nb-footer__made img {
	width: 130px;
}

.nb-footer .nb-footer__grid > * {
	margin-top: 0 !important; /* Block-Abstand von WordPress, sonst stehen die Spalten versetzt */
}

/* Hero-Text (formatierbar): Absätze mit normalem Abstand */
.nb-pagehero .nb-pagehero__subtitle > * {
	margin: 0 0 12px;
}

.nb-pagehero .nb-pagehero__subtitle > :last-child {
	margin-bottom: 0;
}

/* Footer unten: links Rechtliches mit © darunter, rechts „Made with Love“ auf Höhe der ©-Zeile; Social Icons unter „Informationen“ */
.nb-footer__info .nb-footer__social {
	margin-top: 24px !important;
}

.nb-footer__bottom {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: end;
}

.nb-footer__bottom > * {
	margin-block: 0 !important;
}

.nb-footer__bottom .nb-footer__made {
	align-self: end;
	padding-bottom: 0; /* Mitte des Logos auf Höhe der ©-Zeile (gemessen 2 px Abweichung) */
}

@media (max-width: 767px) {
	.nb-footer__bottom {
		grid-template-columns: 1fr;
		gap: 16px;
	}
}