/*
Theme Name: MuGeBa
Theme URI: https://www.mgbazenheid.ch
Author: Dario Manser Web & Design
Description: Block-Theme der Musikgesellschaft Bazenheid im Design «Sketchy Brass». Gehört zum Plugin «MuGeBa Web» (Anlässe, Bühne, Termine, Kontaktformular).
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
Version: 1.7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mugeba
*/

/* =========================================================
   Schriften für Seiten mit eigenem Design (z. B. Heidi)
   Lokal statt von Google Fonts. Der Browser lädt eine Datei
   erst, wenn eine Seite die Schrift wirklich verwendet.
   Lizenz: SIL Open Font License 1.1
   ========================================================= */
@font-face {
	font-family: 'Fraunces';
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url('assets/fonts/fraunces-latin-opsz-normal.woff2') format('woff2-variations'), url('assets/fonts/fraunces-latin-opsz-normal.woff2') format('woff2');
}
@font-face {
	font-family: 'Fraunces';
	font-style: italic;
	font-weight: 100 900;
	font-display: swap;
	src: url('assets/fonts/fraunces-latin-opsz-italic.woff2') format('woff2-variations'), url('assets/fonts/fraunces-latin-opsz-italic.woff2') format('woff2');
}
@font-face {
	font-family: 'Space Mono';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('assets/fonts/space-mono-latin-400-normal.woff2') format('woff2');
}
@font-face {
	font-family: 'Space Mono';
	font-style: italic;
	font-weight: 400;
	font-display: swap;
	src: url('assets/fonts/space-mono-latin-400-italic.woff2') format('woff2');
}
@font-face {
	font-family: 'Space Mono';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('assets/fonts/space-mono-latin-700-normal.woff2') format('woff2');
}
@font-face {
	font-family: 'Space Mono';
	font-style: italic;
	font-weight: 700;
	font-display: swap;
	src: url('assets/fonts/space-mono-latin-700-italic.woff2') format('woff2');
}

/* =========================================================
   Grundlagen
   ========================================================= */
:root {
	--mgb-rot: var(--wp--preset--color--rot, #E30613);
	--mgb-rot-dunkel: var(--wp--preset--color--rot-dunkel, #A50010);
	--mgb-rot-hell: var(--wp--preset--color--rot-hell, #FCE7E4);
	--mgb-gelb: var(--wp--preset--color--gelb, #FFD500);
	--mgb-ink: var(--wp--preset--color--schwarz, #1A1A1A);
	--mgb-creme: var(--wp--preset--color--creme, #FAF6EE);
	--mgb-sand: var(--wp--preset--color--sand, #F3EDE2);
	--mgb-grau: var(--wp--preset--color--grau, #625A52);
	--mgb-linie: var(--wp--preset--color--linie, #CFC6B8);
	--mgb-radius: 16px;
	--mgb-trenner: rgba(26, 26, 26, .1);
	--mgb-hand: var(--wp--preset--font-family--caveat, 'Caveat', cursive);
	--mgb-kritzel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 16' preserveAspectRatio='none'%3E%3Cpath d='M3 10 C 45 3, 95 15, 140 7 S 190 8, 197 9' stroke='%23E30613' stroke-width='7' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
}

body { -webkit-font-smoothing: antialiased; }
:where(.wp-site-blocks) :focus-visible { outline: 3px solid var(--mgb-rot); outline-offset: 3px; }
/* Auf Rot wäre der rote Fokusrahmen unsichtbar: dort weiss (WCAG 2.4.7). */
:where(.has-rot-background-color, .is-style-karte-rot) :focus-visible { outline-color: #fff; }
/* Eigener Look eines Anlasses (z.B. Heidi): Fokus in der Textfarbe des Looks. */
:where(.mgb-banner--kv, .mgb-anlasskopf--kv) :focus-visible { outline-color: var(--kv-text, #F8F2E6); }
.wp-site-blocks { padding-top: 0; padding-bottom: 0; }
.wp-site-blocks > * + * { margin-block-start: 0; }
main > .alignfull,
.wp-block-post-content:not(.mgb-eigen-inhalt) > .alignfull,
.mgb-buehne + .alignfull { margin-block-start: 0 !important; margin-block-end: 0 !important; }
html { scroll-padding-top: 96px; }

/* =========================================================
   Kopfzeile (Template-Teil «header»)
   ========================================================= */
.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 40;
}
.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 32px; }
@media (max-width: 782px) {
	.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 0; }
}
/* Kein backdrop-filter: würde das Mobile-Menü (position: fixed) im Kopf einsperren. */
.mgb-kopf {
	background: var(--mgb-creme);
	border-bottom: 1px solid var(--mgb-trenner);
}
/* Logo: ein weisser Hintergrund im Bild verschwindet auf dem Creme */
.mgb-kopf .wp-block-site-logo img { height: auto; mix-blend-mode: multiply; }
@media (max-width: 599px) { .mgb-kopf .wp-block-site-logo img { width: 100px; } }
/* Beim Scrollen bekommt der Kopf einen weichen Schatten statt einer harten Linie */
@supports (animation-timeline: scroll()) {
	.mgb-kopf { animation: mgb-kopf-schatten linear both; animation-timeline: scroll(root); animation-range: 0 140px; }
	@keyframes mgb-kopf-schatten { to { border-bottom-color: transparent; box-shadow: 0 10px 24px -14px rgba(26, 26, 26, .35); } }
}
/* «Intern» im Kopf: dezenter Link mit Schloss statt Knopf */
.mgb-kopf .wp-block-button.is-style-outline .wp-block-button__link,
.mgb-kopf .wp-block-button.is-style-outline .wp-block-button__link:hover {
	display: inline-flex; align-items: center; gap: 6px;
	border: 0; background: transparent; box-shadow: none; transform: none;
	padding: 8px 6px 8px 10px; font-size: 14px; font-weight: 500; color: var(--mgb-grau);
}
.mgb-kopf .wp-block-button.is-style-outline .wp-block-button__link::before {
	content: ""; width: 13px; height: 13px; flex: none; background: currentColor; opacity: .8;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 7V5a4 4 0 0 1 8 0v2h1v8H3V7h1zm2 0h4V5a2 2 0 0 0-4 0v2z'/%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 16 16'%3E%3Cpath d='M4 7V5a4 4 0 0 1 8 0v2h1v8H3V7h1zm2 0h4V5a2 2 0 0 0-4 0v2z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.mgb-kopf .wp-block-button.is-style-outline .wp-block-button__link:hover { color: var(--mgb-ink); text-decoration: underline; text-decoration-color: var(--mgb-rot); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.mgb-kopf .wp-block-navigation .wp-block-navigation-item__content {
	padding: 10px 14px;
	border-radius: 999px;
	text-decoration: none;
	transition: background .15s;
}
.mgb-kopf .wp-block-navigation .wp-block-navigation-item__content:hover { background: var(--mgb-rot-hell); color: var(--mgb-ink); }
/* Untermenü (z.B. Mitglieder › Vorstand) */
.mgb-kopf .wp-block-navigation .wp-block-navigation__submenu-container { background: var(--mgb-creme, #FAF6EE) !important; color: var(--mgb-ink) !important; border: 2px solid var(--mgb-ink) !important; border-radius: 12px; padding: 6px; min-width: 170px !important; box-shadow: 4px 4px 0 var(--mgb-ink); }
.mgb-kopf .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content { border-radius: 8px; }
.mgb-kopf .wp-block-navigation .wp-block-navigation__submenu-icon { margin-left: 2px; }
.mgb-kopf .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.has-child { align-items: flex-start !important; }
.mgb-kopf .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container { border: 0 !important; box-shadow: none; padding: 0 0 0 20px !important; margin: 0 !important; background: transparent !important; min-width: 0 !important; }
.mgb-kopf .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { font-size: 18px; padding-top: 4px; padding-bottom: 4px; }
.mgb-kopf .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content,
.mgb-kopf .wp-block-navigation .wp-block-navigation-item__content[aria-current="page"] { background: var(--mgb-rot); color: #fff; font-weight: 600; }
.mgb-kopf .wp-block-navigation__container { gap: 4px; }
.mgb-kopf .wp-block-navigation__responsive-container.is-menu-open { background-color: var(--mgb-creme) !important; color: var(--mgb-ink) !important; padding: 24px; }
.mgb-kopf .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.mgb-kopf .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { align-items: flex-start; }
.mgb-kopf .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 22px; }
.mgb-kopf .wp-block-navigation__responsive-container-open,
.mgb-kopf .wp-block-navigation__responsive-container-close { border: 2px solid var(--mgb-ink); border-radius: 12px; padding: 10px; }
.mgb-kopf .wp-block-button__link { padding: 8px 16px; font-size: 15px; box-shadow: none; }
.mgb-kopf .wp-block-navigation .wp-block-navigation-item__content { padding: 8px 11px; }
.mgb-kopf .wp-block-navigation__container { gap: 2px; }
/* Bis 1100px Menü als Overlay (sonst wird es mit acht Einträgen zu eng) */
@media (min-width: 600px) and (max-width: 1100px) {
	.mgb-kopf .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.mgb-kopf .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}

/* Bestehende Seiteninhalte ohne eigene Abschnitte: Abstand oben und unten */
.mgb-inhalt > :first-child:not(.alignfull) { margin-block-start: var(--wp--preset--spacing--60) !important; }
.mgb-inhalt > :last-child:not(.alignfull) { margin-block-end: var(--wp--preset--spacing--60) !important; }
.mgb-inhalt > .wp-block-media-text { margin-block-start: 32px; }
.mgb-inhalt .wp-block-media-text__media img { border-radius: 6px; }

/* Seitenkopf mit Beitragsbild */
.mgb-seitenkopf__raster { display: grid; grid-template-columns: 1fr; gap: 40px; align-items: center; }
.mgb-seitenkopf__raster:has(.mgb-kopfbild),
.mgb-seitenkopf__raster:has(.mgb-kalenderblatt) { grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); }
.mgb-kopfbild { margin: 0; background: #fff; border: 2px solid var(--mgb-ink); border-radius: 6px; padding: 10px; box-shadow: 8px 8px 0 var(--mgb-ink); transform: rotate(1.5deg); }
.mgb-kopfbild img { border-radius: 2px; }
@media (max-width: 781px) {
	.mgb-seitenkopf__raster:has(.mgb-kopfbild),
	.mgb-seitenkopf__raster:has(.mgb-kalenderblatt) { grid-template-columns: 1fr; }
	.mgb-kopfbild { max-width: 420px; transform: rotate(1deg); }
}

/* =========================================================
   Fusszeile
   ========================================================= */
.mgb-fuss { border-top: 1px solid var(--mgb-trenner); }
.mgb-fuss h2, .mgb-fuss h3 { font-size: 13px; letter-spacing: .16em; text-transform: uppercase; font-weight: 700; margin-bottom: 14px; }
.mgb-fuss ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.mgb-fuss a { text-decoration: none; }
.mgb-fuss a:hover { text-decoration: underline; text-decoration-color: var(--mgb-rot); text-decoration-thickness: 2px; }
.mgb-fuss-leiste { font-size: 14px; }
.mgb-fuss-leiste a { color: inherit; }

/* =========================================================
   Block-Stile: Gruppe
   ========================================================= */
.wp-block-group.is-style-karte {
	background: #fff;
	border: 2px solid var(--mgb-ink);
	border-radius: var(--mgb-radius);
	padding: 24px;
}
.wp-block-group.is-style-karte-rot {
	background: var(--mgb-rot);
	color: #fff;
	border: 2px solid var(--mgb-ink);
	border-radius: var(--mgb-radius);
	padding: 26px;
	box-shadow: 8px 8px 0 var(--mgb-ink);
}
/* Karten nebeneinander gleich hoch (Spalten sind gleich hoch, die Karte füllt ihre Spalte). */
.wp-block-column > .wp-block-group.is-style-karte:only-child,
.wp-block-column > .wp-block-group.is-style-karte-rot:only-child { height: 100%; box-sizing: border-box; }
.is-style-karte-rot :where(h1, h2, h3, h4, strong) { color: #fff; }
.is-style-karte-rot a:where(:not(.wp-element-button)) { color: #fff; }
.wp-block-group.is-style-karte-hell {
	background: var(--mgb-rot-hell);
	border: 2px solid var(--mgb-ink);
	border-radius: var(--mgb-radius);
	padding: 26px;
}
.wp-block-group.is-style-abschnitt-sand {
	background: var(--mgb-sand);
	border-top: 1px solid var(--mgb-trenner);
	border-bottom: 1px solid var(--mgb-trenner);
}
.wp-block-group.is-style-abschnitt-dunkel {
	background: var(--mgb-ink);
	color: var(--mgb-creme);
}
.wp-block-group.is-style-abschnitt-dunkel a:where(:not(.wp-element-button)) { color: var(--mgb-creme); }

/* Seitenkopf (Muster) */
.mgb-seitenkopf {
	border-bottom: 1px solid var(--mgb-trenner);
	background: radial-gradient(circle at 94% 0%, rgba(227, 6, 19, .09) 0 200px, transparent 201px), var(--mgb-creme);
}
.mgb-seitenkopf .wp-block-post-title,
.mgb-seitenkopf h1 { margin: 0; }

/* =========================================================
   Block-Stile: Text
   ========================================================= */
h1.is-style-kritzel, h2.is-style-kritzel, h3.is-style-kritzel {
	padding-bottom: 14px;
	background: var(--mgb-kritzel) no-repeat left bottom / 180px 16px;
}
p.is-style-eyebrow {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--mgb-grau);
	margin-bottom: 12px;
}
.is-style-abschnitt-dunkel p.is-style-eyebrow { color: #B5AC9F; }
.has-rot-background-color p.is-style-eyebrow, .is-style-karte-rot p.is-style-eyebrow { color: #fff; }
.has-rot-hell-background-color p.is-style-eyebrow, .is-style-karte-hell p.is-style-eyebrow { color: var(--mgb-rot-dunkel); }
p.is-style-hand {
	font-family: var(--mgb-hand);
	font-weight: 700;
	font-size: 36px;
	line-height: 1;
	color: var(--mgb-rot);
	transform: rotate(-4deg);
	transform-origin: left center;
	margin-bottom: 6px;
}
p.is-style-lead, .is-style-lead { font-size: var(--wp--preset--font-size--lead); line-height: 1.5; max-width: 40ch; }
p.is-style-download a {
	display: flex;
	align-items: center;
	gap: 14px;
	background: #fff;
	border: 2px solid var(--mgb-ink);
	border-radius: 14px;
	padding: 14px 18px;
	text-decoration: none;
	font-weight: 600;
	max-width: 620px;
}
p.is-style-download a::before {
	content: "";
	width: 26px;
	height: 26px;
	flex: 0 0 auto;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A1A1A' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3v5h5M9 13h6M9 17h6'/%3E%3C/svg%3E");
}
p.is-style-download a:hover { background: var(--mgb-rot-hell); color: var(--mgb-ink); }

/* Kritzel-Markierung (Textformat «Kritzel» aus dem Plugin) */
mark.mgb-kritzel {
	background: none;
	color: inherit;
	position: relative;
	z-index: 0;
	white-space: nowrap;
}
mark.mgb-kritzel::after {
	content: "";
	position: absolute;
	left: -3%;
	right: -3%;
	bottom: .06em;
	height: .26em;
	z-index: -1;
	background: no-repeat center / 100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 40' preserveAspectRatio='none'%3E%3Cpath d='M6 27 C 60 12, 120 34, 180 20 S 268 14, 294 24' stroke='%23E30613' stroke-width='9' fill='none' stroke-linecap='round'/%3E%3Cpath d='M14 33 C 90 22, 170 36, 286 28' stroke='%23E30613' stroke-width='5' fill='none' stroke-linecap='round' opacity='.7'/%3E%3C/svg%3E");
}

/* =========================================================
   Block-Stile: Buttons
   ========================================================= */
.wp-block-button__link { transition: transform .15s, box-shadow .15s, background .15s; }
.wp-block-button:not(.is-style-outline):not(.is-style-rot):not(.is-style-secondary) .wp-block-button__link { box-shadow: 4px 4px 0 var(--mgb-rot); }
.wp-block-button:not(.is-style-outline):not(.is-style-rot):not(.is-style-secondary) .wp-block-button__link:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--mgb-rot); }

/* Knöpfe aus dem alten Theme («secondary», z.B. Register auf «Mitglieder») als kleine umrandete Knöpfe */
.wp-block-button.is-style-secondary .wp-block-button__link { background: transparent; color: var(--mgb-ink); border-color: var(--mgb-ink); padding: 9px 16px; font-size: 15px; box-shadow: none; }
.wp-block-button.is-style-secondary .wp-block-button__link:hover,
.wp-block-button.is-style-secondary .wp-block-button__link:focus-visible { background: var(--mgb-rot-hell); color: var(--mgb-ink); }
.has-rot-background-color .wp-block-button:not(.is-style-outline):not(.is-style-rot) .wp-block-button__link,
.is-style-karte-rot .wp-block-button:not(.is-style-outline):not(.is-style-rot) .wp-block-button__link { box-shadow: 4px 4px 0 var(--mgb-creme); }
.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--mgb-ink);
	border: 2px solid var(--mgb-ink);
	padding: 14px 24px;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--mgb-rot); color: #fff; }
.has-rot-background-color .wp-block-button.is-style-outline .wp-block-button__link,
.is-style-karte-rot .wp-block-button.is-style-outline .wp-block-button__link,
.is-style-abschnitt-dunkel .wp-block-button.is-style-outline .wp-block-button__link { color: #fff; border-color: #fff; }
.has-rot-background-color .wp-block-button.is-style-outline .wp-block-button__link:hover,
.is-style-karte-rot .wp-block-button.is-style-outline .wp-block-button__link:hover { background: #fff; color: var(--mgb-rot-dunkel); }
.wp-block-button.is-style-rot .wp-block-button__link { background: var(--mgb-rot); color: #fff; border-color: var(--mgb-ink); }
.wp-block-button.is-style-rot .wp-block-button__link:hover { transform: translate(-2px, -2px); box-shadow: 4px 4px 0 var(--mgb-creme); }
.is-style-abschnitt-dunkel .wp-block-button.is-style-rot .wp-block-button__link { border-color: var(--mgb-rot); }

/* =========================================================
   Block-Stile: Bild
   ========================================================= */
.wp-block-image.is-style-polaroid {
	background: #fff;
	border: 2px solid var(--mgb-ink);
	border-radius: 6px;
	padding: 14px 14px 12px;
	box-shadow: 10px 10px 0 var(--mgb-ink);
	transform: rotate(2deg);
}
.wp-block-image.is-style-polaroid img { border-radius: 2px; width: 100%; }
.wp-block-image.is-style-polaroid figcaption { font-family: var(--mgb-hand); font-weight: 600; font-size: 24px; margin: 10px 4px 0; text-align: left; color: #3B3632; }
.wp-block-image.is-style-polaroid.mgb-schief-links { transform: rotate(-2deg); }
.wp-block-image.is-style-rund img { border-radius: 50%; border: 2px solid var(--mgb-ink); aspect-ratio: 1; object-fit: cover; }

/* =========================================================
   Block-Stile: Liste (Zeitstrahl), Tabelle (Steckbrief), Kategorien (Chips), Galerie (Logos)
   ========================================================= */
ul.is-style-zeitstrahl, ol.is-style-zeitstrahl {
	list-style: none;
	margin: 0;
	padding: 0 0 0 32px;
	position: relative;
	max-width: 760px;
}
ul.is-style-zeitstrahl::before, ol.is-style-zeitstrahl::before {
	content: "";
	position: absolute;
	left: 9px;
	top: 8px;
	bottom: 8px;
	border-left: 3px dashed var(--mgb-ink);
}
.is-style-zeitstrahl > li { position: relative; padding: 0 0 26px; }
.is-style-zeitstrahl > li::before {
	content: "";
	position: absolute;
	left: -32px;
	top: 5px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--mgb-rot);
	border: 2px solid var(--mgb-ink);
}
.is-style-zeitstrahl > li strong { display: block; font-size: 22px; font-weight: 800; }

.wp-block-table.is-style-steckbrief { max-width: 760px; }
.wp-block-table.is-style-steckbrief table {
	border-collapse: separate;
	border-spacing: 0;
	width: 100%;
	background: #fff;
	border: 2px solid var(--mgb-ink);
	border-radius: var(--mgb-radius);
	overflow: hidden;
}
.wp-block-table.is-style-steckbrief td {
	border: 0;
	border-bottom: 1.5px solid #E4DCCB;
	padding: 14px 20px;
	vertical-align: top;
}
.wp-block-table.is-style-steckbrief tr:last-child td { border-bottom: 0; }
.wp-block-table.is-style-steckbrief td:first-child {
	width: 1%;
	white-space: nowrap;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--mgb-grau);
	padding-top: 17px;
}
.wp-block-table.is-style-steckbrief td:last-child { font-weight: 500; }

.wp-block-categories.is-style-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	list-style: none;
	padding: 0;
	margin: 0;
}
.wp-block-categories.is-style-chips li a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 8px 16px;
	border: 2px solid var(--mgb-ink);
	border-radius: 999px;
	background: #fff;
	font-weight: 600;
	font-size: 15px;
	text-decoration: none;
}
.wp-block-categories.is-style-chips li a:hover { background: var(--mgb-rot-hell); color: var(--mgb-ink); }
.wp-block-categories.is-style-chips li.current-cat a { background: var(--mgb-ink); color: var(--mgb-creme); }

.wp-block-gallery.is-style-logos .wp-block-image img {
	background: #fff;
	border: 2px dashed var(--mgb-linie);
	border-radius: 12px;
	padding: 14px;
	height: 96px;
	object-fit: contain;
}

/* =========================================================
   Beitragskarten (Abfrage-Loop)
   ========================================================= */
.mgb-beitragskarte {
	background: #fff;
	border: 2px solid var(--mgb-ink);
	border-radius: var(--mgb-radius);
	overflow: hidden;
	height: 100%;
	transition: transform .15s, box-shadow .15s;
}
.mgb-beitragskarte:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--mgb-ink); }
.mgb-beitragskarte .wp-block-post-featured-image { margin: 0; border-bottom: 2px solid var(--mgb-ink); }
.mgb-beitragskarte .wp-block-post-featured-image img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
.mgb-beitragskarte .wp-block-post-title a { text-decoration: none; }
.mgb-beitragskarte .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; }
.mgb-beitragskarte { position: relative; }
.mgb-beitragskarte .wp-block-post-excerpt__more-text { display: none; }
.mgb-chip a, .wp-block-post-terms.mgb-chip a {
	display: inline-block;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	border: 1.5px solid var(--mgb-ink);
	border-radius: 999px;
	padding: 4px 10px;
	text-decoration: none;
	line-height: 1.2;
	position: relative;
	z-index: 1;
}
.wp-block-query-pagination { gap: 10px; }
.wp-block-query-pagination a, .wp-block-query-pagination .page-numbers {
	border: 2px solid var(--mgb-ink);
	border-radius: 999px;
	padding: 6px 14px;
	text-decoration: none;
}
.wp-block-query-pagination .page-numbers.current { background: var(--mgb-ink); color: var(--mgb-creme); }

/* =========================================================
   Personenkarte, Avatar, Icon-Kreis
   ========================================================= */
.mgb-avatar {
	width: 72px;
	height: 72px;
	min-width: 72px;
	border-radius: 50%;
	border: 2px solid var(--mgb-ink);
	background: var(--mgb-rot);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 !important;
}
.mgb-avatar p { margin: 0; font-weight: 800; font-size: 24px; letter-spacing: -.02em; }
.mgb-person .mgb-rolle { color: var(--mgb-rot-dunkel); font-weight: 600; }
.has-rot-background-color { color: #fff; }
.has-rot-background-color :where(h1, h2, h3, h4, a:not(.wp-element-button)) { color: #fff; }
.mgb-icon img { width: 56px; height: 56px; border: 2px solid var(--mgb-ink); border-radius: 50%; background: var(--mgb-creme); padding: 12px; }

/* Grosse Zahl in Fakten-Karten */
.mgb-zahl { font-weight: 800; font-size: clamp(26px, 6.4vw, 40px); overflow-wrap: normal; word-break: keep-all; line-height: 1; letter-spacing: -.03em; margin: 0; }

/* =========================================================
   Einzelbeitrag
   ========================================================= */
.mgb-artikel .wp-block-post-featured-image img { border: 2px solid var(--mgb-ink); border-radius: var(--mgb-radius); }
.mgb-artikel .wp-block-post-content { font-size: 19px; line-height: 1.65; }
.mgb-artikel .wp-block-gallery img { border-radius: 10px; }
.mgb-zurueck a { text-decoration: none; font-weight: 600; }

/* =========================================================
   Shortcode von «MuGeBa Anlässe»: Rot statt Gelb, passend zur Website
   ========================================================= */
.mgb-anlaesse, .mgb-archiv, .mgb-fakten {
	--mgb-gelb: var(--wp--preset--color--rot-hell, #FCE7E4);
	--mgb-rot: var(--wp--preset--color--rot, #E30613);
	--mgb-creme: var(--wp--preset--color--creme, #FAF6EE);
}
.mgb-anlaesse .mgb-anlass__monat, .mgb-archiv .mgb-anlass__monat {
	background: var(--mgb-rot); color: #fff; border-radius: 4px; padding: .15em .45em;
}
.mgb-anlaesse .mgb-anlass__ics, .mgb-archiv .mgb-anlass__ics, .mgb-fakten .mgb-anlass__ics {
	background-image: var(--mgb-kritzel); background-size: 100% .3em; background-position: left 100%;
}
.mgb-archiv .mgb-archiv__titel { background-image: var(--mgb-kritzel); }

/* =========================================================
   Mobile
   ========================================================= */
@media (max-width: 781px) {
	.wp-block-image.is-style-polaroid { transform: rotate(1.5deg); }
}
/* Steckbrief auf dem Handy: Bezeichnung über dem Wert statt daneben */
@media (max-width: 599px) {
	.wp-block-table.is-style-steckbrief td { display: block; width: auto; }
	.wp-block-table.is-style-steckbrief td:first-child { width: auto; white-space: normal; border-bottom: 0; padding: 12px 18px 0; }
	.wp-block-table.is-style-steckbrief td:last-child { padding: 2px 18px 12px; }
}
@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; animation: none !important; }
}

/* =========================================================
   Vorlage «Eigenes Design»: Seiten mit eigener Gestaltung (z.B. Heidi)
   Kein Seitenkopf, Inhalt in voller Breite. Gruppen erhalten wie im
   alten Theme einen inneren Container, damit bestehende Seiten-CSS greift.
   ========================================================= */
:root :where(.mgb-eigen-inhalt) > * { margin-block-start: 0; margin-block-end: 0; }
.mgb-eigen-inhalt .wp-block-button__link,
.mgb-eigen-inhalt .wp-block-button__link:hover { box-shadow: none; transform: none; }

/* =========================================================
   Seite «Links» für das Instagram-Profil (Vorlage page-links)
   ========================================================= */
.mgb-links { min-height: 100vh; min-height: 100svh; box-sizing: border-box; }
.mgb-links .wp-block-site-logo { margin-bottom: 0; }
.mgb-links .wp-block-site-logo img { height: auto; }
.mgb-links__name { font-size: 26px; line-height: 1.15; margin-top: 6px; }
.mgb-links__name a { color: inherit; text-decoration: none; }
.mgb-links__inhalt > * + * { margin-block-start: 18px; }
.mgb-links__knoepfe { gap: 14px; }
.mgb-links .wp-block-button__link { width: 100%; box-sizing: border-box; text-align: center; padding: 16px 20px; font-size: 18px; line-height: 1.25; }
.mgb-links__sozial .wp-block-button__link { padding-block: 12px; font-size: 16px; }
.mgb-links__intern { font-size: 15px; }
.mgb-links__titel { font-size: 13px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--mgb-grau); margin-top: 34px !important; margin-bottom: 0; }
.mgb-links__termine { margin-top: 6px !important; }
.mgb-links__termine .mgb-mini { margin: 0; }
.mgb-links__fuss { font-size: 14px; color: var(--mgb-grau); margin-top: 30px; }
