/* =====================================================================
   evjusa.de – Relaunch Klickdummi  ·  V3 "Manual / editorial"
   Hauptreferenz: Corporate Design Manual 2021 (S. 4 Linien-Stil)
   Ruhig · viel Weißraum · zweifarbige Titel mit randvoller Linie
   Schriften: Montserrat Alternates (Headlines), Montserrat (Text), Lora (Akzent)
   ===================================================================== */

:root {
  --mint:        #79c29f;
  --mint-600:    #5aa680;
  --mint-300:    #a7d6bf;
  --mint-050:    #eef7f2;
  --magenta:     #e7485f;
  --magenta-600: #c41e3d;
  --anthracite:  #3c3c3b;
  --gray:        #a7a7a7;

  --violet:      #762958;
  --orange:      #f5a140;
  --petrol:      #004d61;
  --cyan:        #00a8b0;

  --dark:        #2b2b2a;
  --darker:      #201f1f;
  --ink:         #2b2b2a;
  --ink-soft:    #5d5d5b;
  --paper:       #ffffff;
  --paper-soft:  #f6f7f5;
  --line:        #e4e6e2;

  --f-head: "Montserrat Alternates", "Montserrat", system-ui, sans-serif;
  --f-body: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --f-serif:"Lora", Georgia, serif;

  --wrap: 1240px;
  --gut: 5vw;                 /* Container-Seitenrand */
  /* Logo wächst mit Fensterhöhe (dvh): 45px@650 → 55px@1000, Plateau bis 1400, → 65px@1700.
     Stufe 1 (45→55) + Stufe 2 (0→10 zwischen 1400 u. 1700). Header = Logo + 40px. */
  --logo-h: calc(clamp(45px, calc(2.857dvh + 26.43px), 55px) + clamp(0px, calc(3.333dvh - 46.67px), 10px));
  --header-h: calc(var(--logo-h) + 40px);
  --radius: 16px;
  --radius-lg: 28px;
  --shadow: 0 20px 55px rgba(30,30,29,.14);
  --shadow-sm: 0 4px 18px rgba(30,30,29,.07);
  --ease: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scrollbar-gutter: stable; }
@media (prefers-reduced-motion: no-preference){ html { scroll-behavior: smooth; } }
body {
  font-family: var(--f-body);
  font-size: clamp(15px, .9rem + .2vw, 17px);
  line-height: 1.5; font-weight: 520; color: var(--ink); background: var(--paper);
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  overflow-x: clip;
}
img,svg,picture { max-width: 100%; display: block; }
a { color: var(--magenta-600); text-underline-offset: 3px; }
ul { padding-left: 1.2em; }

/* Text-Markierung in CI-Farben: hell → Magenta/weiß, dunkel & farbig → Mint/dunkel */
::selection { background: var(--magenta-600); color:#fff; text-shadow:none; }
.hero ::selection, .page-hero ::selection, .breadcrumb ::selection,
.section--dark ::selection, .site-footer ::selection,
.event ::selection { background: var(--mint); color:#16352a; text-shadow:none; }

h1,h2,h3,h4 { font-family: var(--f-head); font-weight: 800; line-height: 1.05; color: var(--anthracite); letter-spacing: -.015em; }
.display { font-family: var(--f-head); font-weight: 800; line-height: 1.0; letter-spacing: -.02em;
  font-size: clamp(2.4rem, 1.2rem + 5.4vw, 5.4rem); overflow-wrap: break-word; hyphens: auto; }
h2 { font-size: clamp(1.7rem, 1.2rem + 1.9vw, 2.6rem); }
h3 { font-size: clamp(1.2rem, 1rem + .7vw, 1.55rem); }
h4 { font-size: 1.05rem; font-weight: 700; }
.serif { font-family: var(--f-serif); font-weight: 500; }
.upper { text-transform: uppercase; }
.lead { font-size: clamp(1.08rem, 1rem + .55vw, 1.4rem); color: var(--ink-soft); line-height: 1.55; }
.hl   { color: var(--mint-600); }
.hl-m { color: var(--magenta-600); }

/* ---------- Layout ---------- */
.wrap { width: min(var(--wrap), calc(100vw - 2*var(--gut))); margin-inline: auto; }
.section { padding: clamp(4.5rem, 3rem + 6vw, 9rem) 0; position: relative; }
/* Erste Sektion nach dem Hero: am Desktop weniger Abstand (Kundenfeedback), mobil unverändert */
.hero + .section { padding-top: clamp(4.5rem, 3rem + 2.5vw, 5.5rem); }
.section--sm { padding: clamp(3.5rem, 2.5rem + 4vw, 6rem) 0; }
.section--soft { background: var(--paper-soft); }
.section--dark { background: var(--dark); color: #e9e9e6; }
.section--dark h2,.section--dark h3 { color:#fff; }
.section--dark .lead { color: rgba(255,255,255,.78); }
.center { text-align: center; }

/* =====================================================================
   SECTION-HEADER im Manual-Stil (S.4):
   farbige Linie vom linken Browserrand bis zur Mitte · Titel ab Mitte
   ===================================================================== */
.kopf {
  width: min(var(--wrap), calc(100vw - 2*var(--gut))); margin-inline: auto;
  display: grid; grid-template-columns: 20% 1fr;
  column-gap: clamp(1.6rem, 3vw, 3rem);
  --accent: var(--mint); --head: var(--anthracite);
}
.kopf--magenta { --accent: var(--magenta); }
.kopf--cyan { --accent: var(--cyan); }
.kopf.on-dark { --head: #fff; }
.kopf__line {
  grid-column: 1; grid-row: 1; align-self: center; height: 4px; border-radius: 4px;
  background: var(--accent); margin-left: calc(50% - 50vw);
}
.kopf__title {
  grid-column: 2; grid-row: 1; color: var(--head); font-family: var(--f-head); font-weight: 800;
  letter-spacing: -.02em; line-height: 1.02; font-size: clamp(1.7rem, 1.1rem + 2.4vw, 3rem);
}
.kopf__title .c { color: var(--accent); }
.kopf--mid .kopf__title { font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.1rem); }
.kopf__body { grid-column: 2; grid-row: 2; margin-top: 1.4rem; }
.kopf__sub { grid-column: 2; grid-row: 2; margin-top: .9rem; text-transform: uppercase; letter-spacing: .14em;
  font-size: .82rem; font-weight: 600; font-family: var(--f-head); color: var(--ink-soft); }
.kopf.on-dark .kopf__sub { color: rgba(255,255,255,.6); }
.section-body { margin-top: clamp(2.5rem, 1.5rem + 3vw, 4rem); }

@media (max-width: 720px){
  .kopf { grid-template-columns: 1fr; }
  .kopf__line { grid-row: 1; grid-column: 1; width: 42vw; margin-left: calc(50% - 50vw); }
  .kopf__title { grid-row: 2; grid-column: 1; margin-top: 1.1rem; }
  .kopf__body, .kopf__sub { grid-row: 3; grid-column: 1; }
}

/* ---------- Pills / Buttons ---------- */
.pill-label { display:inline-block; font-family:var(--f-head); font-weight:700; text-transform:uppercase;
  letter-spacing:.14em; font-size:.72rem; padding:.5em 1.1em; border:2px solid var(--mint); border-radius:999px; color: var(--mint-600); }
.pill-label.on-dark { color: var(--mint); }
.pill-label.is-magenta { border-color: var(--magenta); color: var(--magenta-600); }
.pill-label.is-magenta.on-dark { color: var(--magenta); }

.btn { --b-bg: var(--mint); --b-fg:#173024; --b-bd: var(--mint);
  display:inline-flex; align-items:center; gap:.55rem; font-family:var(--f-head); font-weight:700; font-size:1rem; line-height:1;
  padding:1em 1.7em; border-radius:999px; cursor:pointer; text-decoration:none;
  background:var(--b-bg); color:var(--b-fg); border:2px solid var(--b-bd);
  transition: transform .18s var(--ease), box-shadow .18s var(--ease), background .18s, color .18s; }
.btn:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); color: var(--b-fg); }
.btn .ico { width:1.05em; height:1.05em; }
.btn--magenta { --b-bg: var(--magenta-600); --b-fg:#fff; --b-bd: var(--magenta-600); }
.btn--dark { --b-bg: var(--anthracite); --b-fg:#fff; --b-bd: var(--anthracite); }
.btn--white { --b-bg:#fff; --b-fg:#10301d; --b-bd:#fff; }
.btn--white:hover { --b-bg: var(--anthracite); --b-fg:#fff; --b-bd: var(--anthracite); }
.btn--ghost { --b-bg: transparent; --b-fg: var(--anthracite); --b-bd: var(--anthracite); }
.btn--ghost:hover { --b-bg: var(--anthracite); --b-fg:#fff; }
.btn--ghost-light { --b-bg: transparent; --b-fg:#fff; --b-bd: rgba(255,255,255,.7); }
.btn--ghost-light:hover { --b-bg:#fff; --b-fg: var(--anthracite); }
.btn--sm { padding:.7em 1.2em; font-size:.9rem; }
.linkarrow { font-family:var(--f-head); font-weight:700; text-decoration:none; display:inline-flex; align-items:center; gap:.45rem; }
.linkarrow::after { content:"→"; transition: transform .18s var(--ease); }
.linkarrow:hover::after { transform: translateX(5px); }

/* ---------- A11y ---------- */
.skip-link { position:absolute; left:1rem; top:-100px; z-index:2000; background:var(--anthracite); color:#fff; padding:.7em 1.1em; border-radius:0 0 10px 10px; font-family:var(--f-head); font-weight:700; transition: top .2s; }
.skip-link:focus { top:0; color:#fff; }
:focus-visible { outline:3px solid var(--cyan); outline-offset:3px; border-radius:4px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* Streifenmuster – nur noch in kleinen, kontrollierten Grafiken */
.pattern-lines { background-image: repeating-linear-gradient(110deg, currentColor 0 3px, transparent 3px 16px); }

/* Trennlinie aus dem Flyer (trennlinien.svg) am Sektions-Übergang,
   30px über den rechten Browserrand hinaus (wird durch overflow-x:clip beschnitten). */
.edge-stripe {
  position:absolute; top:0; right:-30px; z-index:4; pointer-events:none;
  width: 360px; height: 28px; transform: translateY(-50%);
  background: url("../../trennlinien.svg") right center / contain no-repeat;
}

/* =====================================================================
   Scroll-Reveal & Micro-Interactions (nur aktiv mit JS via .js-reveal)
   ===================================================================== */
/* Blöcke mit Aufwärts-Slide */
.js-reveal .section .kopf,
.js-reveal .who__text, .js-reveal .who__media,
.js-reveal .event, .js-reveal .nl,
.js-reveal .date-card, .js-reveal .widget, .js-reveal .bigquote {
  opacity:0; transform: translateY(24px);
  transition: opacity .6s var(--ease), transform .6s var(--ease);
}
.js-reveal .kopf.is-revealed, .js-reveal .who__text.is-revealed, .js-reveal .who__media.is-revealed,
.js-reveal .event.is-revealed, .js-reveal .nl.is-revealed, .js-reveal .date-card.is-revealed,
.js-reveal .widget.is-revealed, .js-reveal .bigquote.is-revealed { opacity:1; transform:none; }
/* Karten/Kacheln nur einfaden (kein Transform – Hover-Lift bleibt unberührt) */
.js-reveal .tile, .js-reveal .news-card, .js-reveal .download { opacity:0; transition: opacity .55s var(--ease); }
.js-reveal .tile.is-revealed, .js-reveal .news-card.is-revealed, .js-reveal .download.is-revealed { opacity:1; }
/* Gestaffelt im Grid */
.js-reveal .theme-tiles .tile:nth-child(2), .js-reveal .news-grid .news-card:nth-child(2){ transition-delay:.07s; }
.js-reveal .theme-tiles .tile:nth-child(3), .js-reveal .news-grid .news-card:nth-child(3){ transition-delay:.14s; }
.js-reveal .theme-tiles .tile:nth-child(4), .js-reveal .news-grid .news-card:nth-child(4){ transition-delay:.21s; }
.js-reveal .theme-tiles .tile:nth-child(5), .js-reveal .news-grid .news-card:nth-child(5){ transition-delay:.28s; }
.js-reveal .theme-tiles .tile:nth-child(6), .js-reveal .news-grid .news-card:nth-child(6){ transition-delay:.35s; }

/* Trennlinie gleitet beim Einscrollen ~50px nach rechts */
.js-reveal .edge-stripe { transform: translateY(-50%) translateX(-50px); transition: transform .7s var(--ease); }
.js-reveal .edge-stripe.is-revealed { transform: translateY(-50%) translateX(0); }

/* Micro-Interaction: dezenter Bild-Zoom bei Hover */
.news-card__img img, .who__media img { transition: transform .5s var(--ease); }
.news-card:hover .news-card__img img, .who__media:hover img { transform: scale(1.05); }

@media (prefers-reduced-motion: reduce){
  .js-reveal .section .kopf, .js-reveal .who__text, .js-reveal .who__media,
  .js-reveal .event, .js-reveal .nl, .js-reveal .date-card, .js-reveal .widget,
  .js-reveal .bigquote, .js-reveal .tile, .js-reveal .news-card, .js-reveal .download {
    opacity:1 !important; transform:none !important; transition:none !important;
  }
  .js-reveal .edge-stripe { transform: translateY(-50%) !important; transition:none !important; }
  .news-card:hover .news-card__img img, .who__media:hover img { transform:none; }
}

/* =====================================================================
   HEADER
   ===================================================================== */
.site-header { position: sticky; top:0; z-index:200; background: rgba(255,255,255,.92); backdrop-filter: blur(12px); border-bottom:1px solid var(--line); }
.site-header__inner { display:flex; align-items:center; gap:1rem; min-height: var(--header-h); }
.brand { display:inline-flex; align-items:center; margin-right:auto; }
.brand img { height: var(--logo-h); width:auto; }   /* horizontale Logo-Variante V3, wächst mit Fensterhöhe */
.header-actions { display:flex; align-items:center; gap: clamp(1rem,2.2vw,1.8rem); }
/* Schlichte Header-Aktionen (kein Button-Style): Suchen · Spenden · Menü */
.h-action {
  display:inline-flex; align-items:center; gap:.5rem;
  background:none; border:0; padding:.4em 0; cursor:pointer; text-decoration:none;
  font-family:var(--f-head); font-weight:700; font-size:.95rem; color:var(--anthracite);
  transition: color .15s; }
.h-action:hover, .h-action:focus-visible { color: var(--mint-600); }
.h-action svg { width:19px; height:19px; flex:none; }
.h-action__bars { display:inline-flex; flex-direction:column; gap:4px; width:19px; flex:none; }
.h-action__bars span { height:2.5px; width:100%; background:currentColor; border-radius:3px; }
.h-action--spenden { color: var(--magenta-600); }
.h-action--spenden:hover { color: var(--magenta); }
/* Schließen im Megamenü (helle Fläche), Symbol rechts wie beim Menü-Button */
.megamenu__close { margin-left:auto; color: var(--anthracite); }
.megamenu__close:hover { color: var(--mint-600); }
@media (max-width:600px){ .h-action__label { display:none; } }

/* ---------- Suchleiste ---------- */
.searchbar {
  position: fixed; top: var(--header-h); left:0; right:0; z-index:150;
  background:#fff; border-bottom:1px solid var(--line); box-shadow: var(--shadow-sm);
  opacity:0; visibility:hidden; transition: opacity .2s var(--ease), visibility .2s; }
.searchbar.is-open { opacity:1; visibility:visible; }
.searchbar__inner { display:flex; align-items:center; gap:.9rem; padding: 1rem 0; }
.searchbar__inner > svg { width:22px; height:22px; color: var(--mint-600); flex:none; }
.searchbar input { flex:1; min-width:0; border:0; background:none; font:inherit; font-size:1.1rem; padding:.3em 0; color:var(--ink); }
.searchbar input:focus { outline:none; }
.searchbar .sb-close { background:none; border:0; cursor:pointer; color:var(--ink-soft); display:inline-flex; padding:.3em; }
.searchbar .sb-close svg { width:20px; height:20px; }
.searchbar .sb-close:hover { color: var(--magenta-600); }

/* =====================================================================
   MEGAMENÜ – komplette Struktur, direkt anklickbar
   ===================================================================== */
.megamenu { position:fixed; inset:0; z-index:500; background: var(--paper); color: var(--ink);
  overflow:hidden; display:flex; flex-direction:column; opacity:0; visibility:hidden;
  transition: opacity .25s var(--ease), visibility .25s; }
.megamenu.is-open { opacity:1; visibility:visible; }
/* Scrollbereich getrennt von der Leiste → Leiste sitzt exakt wie der Header (kein Versatz) */
.megamenu__scrollarea { flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; }
/* scrollbar-gutter:stable (html) reserviert die Scrollleiste dauerhaft → kein Springen */
body.menu-open { overflow:hidden; }
.megamenu__bar { flex:none; display:flex; align-items:center; min-height: var(--header-h); gap:1rem; border-bottom:1px solid var(--line); }
.megamenu__close { margin-left:auto; }
.megamenu__inner { padding: 2rem 0 5rem; }

/* Hauptpunkte – sofort sichtbar, groß über der Themenliste */
.mm-main { display:flex; flex-wrap:wrap; gap:.6rem 2.4rem; align-items:baseline;
  padding-bottom: 1.8rem; border-bottom:1px solid var(--line); }
.mm-main a { text-decoration:none; font-family:var(--f-head); font-weight:800; letter-spacing:-.015em;
  font-size: clamp(1.35rem, 1.1rem + 1.1vw, 1.8rem); color: var(--anthracite); transition: color .15s; }
.mm-main a:hover, .mm-main a:focus-visible { color: var(--mint-600); }

/* Zwischenlabel vor der Themenliste */
.mm-lbl { display:block; margin-top: 2.4rem; font-family:var(--f-head); font-weight:700;
  text-transform:uppercase; letter-spacing:.12em; font-size:.72rem; color: var(--ink-soft); }

.mm-themen { display:grid; grid-template-columns: repeat(3,1fr); gap: 2.6rem 2.4rem; margin-top: 1.5rem; }
@media (max-width:1000px){ .mm-themen { grid-template-columns: repeat(2,1fr); } }
@media (max-width:620px){ .mm-themen { grid-template-columns: 1fr; } }
.mm-theme h3 { color: var(--anthracite); font-size:1.18rem; margin-bottom:.9rem; display:flex; align-items:center; gap:.55rem; }
.mm-theme h3 a { color: inherit; text-decoration: none; transition: color .15s; }
.mm-theme h3 a:hover, .mm-theme h3 a:focus-visible { color: var(--mint-600); }
.mm-theme h3 .dot { width:11px; height:11px; border-radius:50%; flex:none; }
.mm-theme ul { list-style:none; padding:0; margin:0; display:grid; gap:.05rem; }
.mm-theme a { display:block; text-decoration:none; color: var(--ink-soft); font-size:.96rem; font-weight:540;
  padding:.42rem 0; border-bottom:1px solid var(--line); transition: color .15s, padding-left .15s; }
.mm-theme a:hover, .mm-theme a:focus-visible { color: var(--mint-600); padding-left:.4rem; }
.mm-theme a.is-parent { font-family:var(--f-head); font-weight:700; color: var(--anthracite); }
.mm-theme a .child-mark { color: var(--mint-600); margin-right:.4rem; }

.mm-extra { margin-top: 3rem; padding-top: 2rem; border-top:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:.8rem 1rem; align-items:center; }
.mm-extra .lbl { font-family:var(--f-head); font-weight:700; text-transform:uppercase; letter-spacing:.12em; font-size:.72rem; color: var(--ink-soft); margin-right:.5rem; }
.mm-extra a { display:inline-flex; align-items:center; text-decoration:none; color: var(--anthracite); font-family:var(--f-head); font-weight:700; font-size:.95rem;
  border:2px solid var(--line); border-radius:999px; padding:.55em 1.2em; transition: background .18s, color .18s, border-color .18s; }
.mm-extra a:hover { background: var(--mint); color: var(--anthracite); border-color: var(--mint); }
.mm-foot { margin-top: 2.5rem; display:flex; flex-wrap:wrap; gap:1.2rem 2.5rem; align-items:center; justify-content:space-between; color: var(--ink-soft); font-size:.9rem; }
.mm-foot .social { display:flex; gap:.8rem; }
.mm-foot .social a { width:44px; height:44px; border-radius:50%; background: var(--paper-soft); display:grid; place-items:center; color: var(--anthracite); }
.mm-foot .social a:hover { background: var(--mint); color: var(--anthracite); }
.mm-foot .social svg { width:20px; height:20px; }
.mm-foot a.tel { color: var(--mint-600); text-decoration:none; }

/* =====================================================================
   HERO – ruhig, viel Raum, Manual-Linie + großer Claim
   ===================================================================== */
.hero { position:relative; background: var(--darker); color:#fff; overflow:hidden; }
/* Gruppenfoto rechtsbündig im Hintergrund, dezent (ohne Verlauf) */
.hero__bg { position:absolute; inset:0; z-index:0; pointer-events:none;
  background: url("../../assets/img/hero-gruppe.jpg") right center / cover no-repeat;
  opacity:.2; }
.hero__pad { padding: clamp(3.5rem,2.5rem + 5vw,6rem) 0 clamp(3rem,2rem + 4vw,5rem); }
.hero .kopf__title, .page-hero .kopf__title { font-size: clamp(1.3rem, 1rem + 1.4vw, 1.9rem); }
.hero__claim, .page-hero__claim { hyphens: manual; }
.hero__claim { color:#fff; margin-top: 1.4rem; max-width: 20ch; }
/* Ausbalancierte Hero-Headline: Umbruch nach „christlich", „in Sachsen" eingerückt (Desktop) */
.claim-brk { display:none; }
.claim-in { display:inline; }
@media (min-width: 721px){
  .claim-brk { display:inline; }
  .claim-in { display:inline-block; margin-left: 1.3em; }
}
/* Claim weiter nach links: Body über die volle Breite, Linie+Label bleiben mittig */
@media (min-width: 721px){
  .hero .kopf__body, .page-hero .kopf__body { grid-column: 1 / -1; margin-top: clamp(1.6rem,1rem + 2vw,2.6rem); }
}
.hero__claim .c { color: var(--mint); }
.hero__lead { margin-top: 1.6rem; max-width: 42ch; color: rgba(255,255,255,.78); }
.hero__cta { margin-top: 2.4rem; display:flex; flex-wrap:wrap; gap:.9rem; }
/* dezente Bildmarke im freien Raum links */
.hero__mark { position:absolute; z-index:0; right:-100px; bottom:-30px;
  width: 38%; max-width: 460px; aspect-ratio:1/1; color: rgba(121,194,159,.10); pointer-events:none; }
.hero__mark svg { width:100%; height:100%; }
.hero .kopf, .hero__claim, .hero__lead, .hero__cta { position:relative; z-index:1; }
@media (max-width: 720px){ .hero__mark { display:none; } }

/* =====================================================================
   STATEMENT
   ===================================================================== */
.statement p { font-family:var(--f-head); font-weight:700; font-size: clamp(1.4rem, 1rem + 2vw, 2.4rem);
  line-height:1.3; letter-spacing:-.01em; color:var(--anthracite); max-width: 30ch; text-wrap: balance; }

/* "Wer wir sind" – Claim + Gruppenfoto, zweispaltig */
.who { display:grid; grid-template-columns: .9fr 1.1fr; gap: clamp(1.8rem, 1rem + 3vw, 3.5rem); align-items:center; }
@media (max-width:820px){ .who { grid-template-columns:1fr; } }
.who__claim { font-family:var(--f-head); font-weight:700; font-size: clamp(1.4rem, 1rem + 2vw, 2.4rem);
  line-height:1.3; letter-spacing:-.01em; color:var(--anthracite); text-wrap:balance; }
.who__media { position:relative; margin:0; border-radius: var(--radius-lg); overflow:hidden; box-shadow: var(--shadow); aspect-ratio:16/9; }
.who__media img { width:100%; height:100%; object-fit:cover; display:block; }
.who__media figcaption { position:absolute; left:1rem; bottom:1rem; background: rgba(32,31,31,.8); color:#fff;
  font-family:var(--f-head); font-weight:700; font-size:.8rem; letter-spacing:.02em; padding:.55em 1.1em; border-radius:999px; }

/* Nach-oben-Button (erscheint nach ~100px Scroll) */
.totop { position:fixed; right: clamp(16px, 2.5vw, 28px); bottom: clamp(16px, 2.5vw, 28px); z-index:120;
  width:50px; height:50px; border:0; border-radius:50%; cursor:pointer;
  background: var(--anthracite); color:#fff; display:grid; place-items:center; box-shadow: var(--shadow);
  opacity:0; visibility:hidden; transform: translateY(10px);
  transition: opacity .25s var(--ease), transform .25s var(--ease), visibility .25s, background .18s; }
.totop.is-visible { opacity:1; visibility:visible; transform:none; }
.totop:hover { background: var(--magenta-600); transform: translateY(-3px); }
.totop svg { width:24px; height:24px; }
@media (prefers-reduced-motion: reduce){ .totop { transition: opacity .25s, visibility .25s; } }

/* =====================================================================
   THEMEN – große Farbkacheln, mehr Innenabstand
   ===================================================================== */
.theme-tiles { display:grid; grid-template-columns: repeat(3,1fr); gap: 1.6rem; }
@media (max-width:820px){ .theme-tiles { grid-template-columns: repeat(2,1fr);} }
@media (max-width:520px){ .theme-tiles { grid-template-columns: 1fr;} }
.tile { position:relative; overflow:hidden; isolation:isolate; border-radius: var(--radius-lg);
  padding: 2.2rem 2.1rem 2.3rem; min-height: 280px; display:flex; flex-direction:column; text-decoration:none; color:#fff;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease); }
.tile:hover { transform: translateY(-6px); box-shadow: var(--shadow); color:#fff; }
.tile__num { font-family:var(--f-head); font-weight:800; font-size:.9rem; opacity:.7; letter-spacing:.05em; }
.tile h3 { color:#fff; font-size: clamp(1.4rem,1.1rem + 1vw,1.95rem); margin-top:.5rem; max-width: 12ch; }
.tile p { margin-top:.8rem; font-size:.95rem; color: rgba(255,255,255,.88); }
.tile .tile__go { margin-top:auto; padding-top:1.4rem; font-family:var(--f-head); font-weight:700; display:inline-flex; align-items:center; gap:.4rem; }
.tile .tile__go::after { content:"→"; transition: transform .2s var(--ease); }
.tile:hover .tile__go::after { transform: translateX(5px); }
.tile__mark { position:absolute; z-index:-1; right:-44px; bottom:-54px; width:190px; height:190px; opacity:.16; color:#fff; }
.t-mint{background:var(--mint-600);} .t-magenta{background:var(--magenta);} .t-violet{background:var(--violet);}
.t-orange{background:var(--orange); color:#3a2400;} .t-orange h3,.t-orange .tile__go{color:#3a2400;} .t-orange p{color:rgba(58,36,0,.8);}
.t-petrol{background:var(--petrol);} .t-cyan{background:var(--cyan);}

/* =====================================================================
   DUALITÄTEN
   ===================================================================== */
.duals { display:grid; grid-template-columns: repeat(2,1fr); gap:0 3rem; }
@media (max-width:680px){ .duals { grid-template-columns:1fr; gap:0; } }
.dual { padding:1.4rem 0; border-bottom:1px solid rgba(255,255,255,.13); font-family:var(--f-head); font-weight:700;
  font-size: clamp(1.2rem,1rem + 1vw,1.7rem); color:#fff; display:flex; align-items:baseline; gap:.6rem; flex-wrap:wrap; }
.dual span { color: var(--mint); font-weight:800; }
.dual .amp { color: var(--magenta); font-weight:800; }

/* =====================================================================
   NEWS – farbige Karten
   ===================================================================== */
.news-grid { display:grid; gap:1.6rem; grid-template-columns: repeat(3,1fr); }
@media (max-width:880px){ .news-grid { grid-template-columns: repeat(2,1fr);} }
@media (max-width:540px){ .news-grid { grid-template-columns:1fr;} }
.news-card { background:#fff; border-radius: var(--radius-lg); overflow:hidden; display:flex; flex-direction:column; text-decoration:none; color:inherit; box-shadow: var(--shadow-sm); transition: transform .2s var(--ease), box-shadow .2s var(--ease); }
.news-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); color:inherit; }
.news-card__img { aspect-ratio:16/9; position:relative; overflow:hidden; background:#dadeda; }
.news-card__img img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.news-card__cat { position:absolute; left:1rem; top:1rem; background:#fff; color:var(--anthracite); font-family:var(--f-head); font-weight:700; font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; padding:.35em .8em; border-radius:999px; box-shadow: var(--shadow-sm); }
.news-card__body { padding: 1.6rem 1.6rem 1.4rem; display:flex; flex-direction:column; gap:.55rem; flex:1; color:#fff; background: var(--anthracite); }
.news-card__body h3 { color:#fff; font-size:1.18rem; line-height:1.22; }
.news-card__body p { color: rgba(255,255,255,.9); font-size:.92rem; margin:0; }
.news-card time { font-size:.8rem; color: rgba(255,255,255,.78); font-weight:600; align-self:flex-end; margin-top:auto; }
.nc-mint .news-card__body { background: var(--mint); color:#153525; }
.nc-mint .news-card__body h3 { color:#10301d; }
.nc-mint .news-card__body p, .nc-mint .news-card time { color: rgba(16,48,29,.82); }
.nc-magenta .news-card__body { background: var(--magenta); }
.nc-cyan .news-card__body { background: var(--cyan); }
.nc-petrol .news-card__body { background: var(--petrol); }
.nc-violet .news-card__body { background: var(--violet); }
.nc-orange .news-card__body { background: var(--orange); color:#3a2400; }
.nc-orange .news-card__body h3 { color:#3a2400; }
.nc-orange .news-card__body p, .nc-orange .news-card time { color: rgba(58,36,0,.82); }

/* =====================================================================
   EVENT / SAVE THE DATE
   ===================================================================== */
.event { position:relative; overflow:hidden; border-radius: var(--radius-lg);
  background: linear-gradient(120deg, var(--magenta), var(--violet)); color:#fff;
  padding: clamp(2.6rem,2rem + 3vw,4rem) clamp(2.4rem,1.5rem + 3vw,4rem); display:grid; grid-template-columns: auto 1fr auto; gap: clamp(2rem,1rem + 3vw,3.5rem); align-items:center; }
.event__v .vlabel { writing-mode: vertical-rl; text-orientation: mixed; font-family:var(--f-head); font-weight:700; text-transform:uppercase; letter-spacing:.28em; font-size:.72rem; color:#fff; }
.event__body h2 { color:#fff; }
.event__body p { color: rgba(255,255,255,.9); margin-top:.8rem; max-width: 44ch; }
.event__cta { text-align:center; }
.event__date .d { display:block; font-family:var(--f-head); font-weight:800; font-size: clamp(3rem,2rem + 4vw,5rem); line-height:1; }
.event__date .m { font-family:var(--f-head); font-weight:700; text-transform:uppercase; letter-spacing:.1em; font-size:1rem; }
@media (max-width:760px){ .event { grid-template-columns:1fr; } .event__v { display:none; } }

/* =====================================================================
   NEWSLETTER
   ===================================================================== */
.nl { border-radius: var(--radius-lg); background: var(--mint); color:#153525; padding: clamp(2.6rem,2rem + 3vw,4rem) clamp(2.4rem,1.5rem + 3vw,4rem); }
/* Auf der Mint-Kachel kein Rot/Magenta (Kundenfeedback): Label weiß gefüllt, Links dunkel */
.nl .pill-label { background:#fff; border-color:#fff; color:#10301d; }
.nl__grid { display:grid; grid-template-columns: 1fr 1.1fr; gap: clamp(2rem,1rem + 3vw,3.5rem); align-items:center; }
.nl h2 { color:#10301d; }
.nl__intro p { color:#1c3d2c; margin-top:.8rem; font-size:1.02rem; }
.nl-form { display:grid; grid-template-columns: 1fr 1fr; gap:.9rem; }
.nl-form .full { grid-column:1/-1; }
.field label { display:block; font-family:var(--f-head); font-weight:700; font-size:.8rem; margin-bottom:.35rem; color:#173024; }
.field input { width:100%; padding:.9em 1.1em; border-radius:12px; border:2px solid transparent; background: rgba(255,255,255,.7); color:#16352a; font:inherit; }
.field input::placeholder { color:#4d6557; }
.field input:focus { background:#fff; border-color: var(--anthracite); outline:none; }
.nl-consent { font-size:.8rem; color:#1c3d2c; }
.nl-consent a { color:#10301d; }
@media (max-width:760px){ .nl__grid { grid-template-columns:1fr; } }
@media (max-width:420px){ .nl-form { grid-template-columns:1fr; } }

/* Kompakte Newsletter-Variante für Unterseiten (Kundenfeedback: nicht überall so groß) */
.nl--compact { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.2rem 2.5rem;
  padding: clamp(1.6rem,1.3rem + 1.2vw,2.2rem) clamp(1.6rem,1.3rem + 2vw,2.8rem); }
.nl--compact h2 { font-size: clamp(1.25rem, 1.1rem + .8vw, 1.6rem); margin-top:.7rem; }
.nl-form--row { display:flex; flex-wrap:wrap; gap:.7rem; align-items:center; flex:1 1 320px; max-width:560px; }
.nl-form--row input { flex:1 1 200px; min-width:0; padding:.8em 1.1em; border-radius:999px; border:2px solid transparent;
  background: rgba(255,255,255,.7); color:#16352a; font:inherit; }
.nl-form--row input::placeholder { color:#4d6557; }
.nl-form--row input:focus { background:#fff; border-color: var(--anthracite); outline:none; }
.nl--compact .nl-consent { flex-basis:100%; }

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

/* =====================================================================
   FOOTER
   ===================================================================== */
.site-footer { background: var(--darker); color:#c9cac6; }
.footer-top { padding: clamp(4rem,2.5rem + 4vw,5.5rem) 0 3rem; }
.footer-claim { font-family:var(--f-head); font-weight:800; font-size: clamp(1.9rem,1.2rem + 3vw,3.2rem); color:#fff; max-width:16ch; line-height:1.05; margin-bottom: 3rem; }
.footer-claim .hl { color: var(--mint); } .footer-claim .amp { color: var(--magenta); }
.footer-grid { display:grid; grid-template-columns: 1.3fr 1fr 1fr 1.2fr; gap: 2.4rem; }
.footer-brand img { height:58px; margin-bottom:1.2rem; }   /* Standard-Logo (vertikal), etwas größer */
.footer-brand p { font-size:.9rem; max-width:30ch; }
.site-footer h4 { color:#fff; font-size:.8rem; text-transform:uppercase; letter-spacing:.1em; margin-bottom:1.1rem; }
.site-footer ul { list-style:none; padding:0; margin:0; display:grid; gap:.6rem; }
.site-footer a { color:#c9cac6; text-decoration:none; font-size:.92rem; }
.site-footer a:hover { color: var(--mint); }
.fcontact { display:grid; gap:.55rem; font-style:normal; font-size:.92rem; }
.fcontact a { display:inline-flex; gap:.5rem; align-items:center; }
.fcontact svg { width:16px; height:16px; flex:none; color: var(--mint); }
.fsocial { display:flex; gap:.7rem; margin-top:1.3rem; }
.fsocial a { width:42px; height:42px; border-radius:50%; background: rgba(255,255,255,.08); display:grid; place-items:center; }
.fsocial a:hover { background: var(--mint); color: var(--anthracite); }
.fsocial svg { width:20px; height:20px; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); }
.footer-bottom .wrap { display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; justify-content:space-between; align-items:center; padding:1.4rem 0; font-size:.82rem; }
.footer-bottom nav { display:flex; flex-wrap:wrap; gap:.4rem 1.3rem; }
@media (max-width:860px){ .footer-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .footer-grid { grid-template-columns:1fr; } }

/* =====================================================================
   UNTERSEITE
   ===================================================================== */
.page-hero { position:relative; overflow:hidden; background: var(--darker); color:#fff; }
.page-hero__pad { padding: clamp(3.5rem,2.5rem + 5vw,6rem) 0 clamp(3rem,2rem + 4vw,5rem); }
.page-hero .kopf__title { font-size: clamp(1.3rem,1rem + 1.4vw,1.9rem); }
.page-hero__claim { color:#fff; margin-top:1.2rem; }
.page-hero__claim .c { color: var(--mint); }
.page-hero__sub { margin-top:1.4rem; max-width:50ch; color: rgba(255,255,255,.78); }
.page-hero__cta { margin-top:2rem; display:flex; flex-wrap:wrap; gap:.9rem; position:relative; z-index:1; }
.page-hero__mark { position:absolute; z-index:0; right:-3%; top:50%; transform:translateY(-50%); width:30%; max-width:360px; aspect-ratio:1/1; color: rgba(231,72,95,.14); pointer-events:none; }
.page-hero .kopf, .page-hero__claim, .page-hero__sub { position:relative; z-index:1; }
@media (max-width:720px){ .page-hero__mark { display:none; } }

/* Hero-Variante mit Hintergrundbild + Verlauf zu transparent */
.page-hero--photo .page-hero__pad { position:relative; z-index:2; }
.page-hero__bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; z-index:0; }
.page-hero__veil { position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(90deg, var(--darker) 0%, rgba(32,31,31,.94) 20%, rgba(32,31,31,.62) 46%, rgba(32,31,31,.22) 70%, rgba(32,31,31,0) 100%),
    linear-gradient(to bottom, rgba(32,31,31,.25) 0%, transparent 28%, transparent 68%, rgba(32,31,31,.5) 100%); }
@media (max-width:720px){
  .page-hero__veil { background: linear-gradient(180deg, rgba(32,31,31,.72) 0%, rgba(32,31,31,.9) 100%); }
}
/* Kugelkreuz-Watermark über dem Bild, unter dem Text – dezent */
.page-hero--photo .page-hero__mark { z-index:1; right:3%; width:34%; max-width:380px; color: rgba(255,255,255,.16); }

.breadcrumb { background: var(--dark); position: sticky; top: var(--header-h); z-index: 90; }
.breadcrumb ol { display:flex; flex-wrap:wrap; gap:.4rem; list-style:none; padding:.9rem 0; margin:0; font-size:.84rem; }
.breadcrumb li { display:flex; align-items:center; gap:.4rem; color: rgba(255,255,255,.6); }
.breadcrumb li+li::before { content:"›"; color: rgba(255,255,255,.35); }
.breadcrumb a { color: rgba(255,255,255,.7); text-decoration:none; }
.breadcrumb a:hover { color: var(--mint); }
.breadcrumb [aria-current="page"]{ color:#fff; font-weight:600; }

.content-layout { display:grid; grid-template-columns: minmax(0,1fr) 340px; gap: clamp(2.5rem,1.5rem + 4vw,5rem); align-items:start; }
@media (max-width:920px){ .content-layout { grid-template-columns:1fr; } }
.prose > * + * { margin-top: 1.25rem; }
.prose h2 { margin-top: 2.8rem; font-size: clamp(1.6rem,1.2rem + 1.4vw,2.2rem); }
.prose h3 { margin-top: 2.2rem; }
.prose h2:first-child, .prose h3:first-child { margin-top:0; }
.prose ul { display:grid; gap:.55rem; }
.prose a { font-weight:600; }
.bigquote { font-family:var(--f-head); font-weight:800; font-size: clamp(1.5rem,1.1rem + 1.8vw,2.4rem); line-height:1.15; color: var(--anthracite); border-left:5px solid var(--mint); padding-left:1.4rem; letter-spacing:-.01em; }
.bigquote .hl { color: var(--mint-600); }

.date-card { display:flex; gap:1.6rem; align-items:center; border-radius: var(--radius-lg); padding: 2rem 2.1rem; background: linear-gradient(120deg, var(--magenta), var(--violet)); color:#fff; }
.date-card .d { flex:none; text-align:center; }
.date-card .d .day { font-family:var(--f-head); font-weight:800; font-size:2.8rem; line-height:1; display:block; }
.date-card .d .mon { font-family:var(--f-head); font-weight:700; text-transform:uppercase; letter-spacing:.1em; font-size:.85rem; }
.date-card h3 { color:#fff; } .date-card p { color: rgba(255,255,255,.9); margin-top:.4rem; }
hr.rule { border:0; border-top:1px solid var(--line); margin: 2.6rem 0; }

/* Download-Element (Contao-Download) */
.download { display:flex; align-items:center; gap:1rem; max-width:480px;
  padding:.95rem 1.1rem; border:1px solid var(--line); border-radius:14px; background:#fff;
  text-decoration:none; color:var(--anthracite);
  transition: border-color .18s, box-shadow .18s, transform .18s var(--ease); }
.download:hover { border-color: var(--mint); box-shadow: var(--shadow-sm); transform: translateY(-2px); color: var(--anthracite); }
.download__file { width:46px; height:46px; flex:none; border-radius:11px; background: var(--mint-050); color: var(--mint-600); display:grid; place-items:center; }
.download__file svg { width:24px; height:24px; }
.download__body { display:flex; flex-direction:column; gap:.12rem; min-width:0; flex:1; }
.download__title { font-family:var(--f-head); font-weight:700; font-size:1rem; line-height:1.2; }
.download__meta { font-size:.8rem; color: var(--ink-soft); text-transform:uppercase; letter-spacing:.04em; }
.download__dl { width:22px; height:22px; flex:none; color: var(--mint-600); transition: transform .18s var(--ease), color .18s; }
.download:hover .download__dl { color: var(--magenta-600); transform: translateY(2px); }

.sidebar { display:grid; gap:1.6rem; position:sticky; top:100px; }
@media (max-width:920px){ .sidebar { position:static; } }
.widget { border-radius: var(--radius-lg); padding: 1.8rem 1.9rem; }
.widget--mint { background: var(--mint-050); border:1px solid #d4e9de; }
.widget--dark { background: var(--dark); color:#e9e9e6; }
.widget--dark h3 { color:#fff; }
.widget h3 { font-size:1.15rem; margin-bottom:1.1rem; }
.linklist { list-style:none; padding:0; margin:0; display:grid; gap:.1rem; }
.linklist a { display:flex; gap:.6rem; align-items:center; padding:.65rem 0; border-bottom:1px solid rgba(0,0,0,.07); text-decoration:none; color:var(--anthracite); font-family:var(--f-head); font-weight:600; font-size:.95rem; }
.widget--dark .linklist a { color:#e9e9e6; border-color: rgba(255,255,255,.12); }
.linklist li:last-child a { border-bottom:0; }
.linklist a .ico { width:18px; height:18px; flex:none; color: var(--mint-600); }
.widget--dark .linklist a .ico { color: var(--mint); }
.linklist a:hover { color: var(--magenta-600); }
.widget--dark .linklist a:hover { color: var(--mint); }
.person { display:flex; gap:1.1rem; align-items:center; padding:1rem 0; border-bottom:1px solid rgba(0,0,0,.07); }
.person:last-child { border-bottom:0; }
.person__avatar { width:66px; height:66px; border-radius:50%; flex:none; overflow:hidden; position:relative; color:#fff; display:grid; place-items:center; }
.person__avatar span { font-family:var(--f-head); font-weight:800; font-size:1.2rem; position:relative; z-index:1; }
.person__avatar img { width:100%; height:100%; object-fit:cover; }
.person__info strong { font-family:var(--f-head); font-size:1.02rem; color: var(--magenta-600); display:block; }
.person__info .role { font-size:.8rem; color: var(--ink-soft); display:block; margin-bottom:.35rem; }
.person__info a { font-size:.82rem; display:block; text-decoration:none; color: var(--ink-soft); }
.person__info a:hover { color: var(--magenta-600); }

.bg-mint{background:linear-gradient(135deg,var(--mint),var(--mint-600));}
.bg-magenta{background:linear-gradient(135deg,var(--magenta),var(--violet));}
.bg-petrol{background:linear-gradient(135deg,var(--petrol),var(--cyan));}
.bg-violet{background:linear-gradient(135deg,var(--violet),var(--magenta));}
.crosscircle { color:#fff; }

/* =====================================================================
   Social Wall – horizontaler Slider (Autoplay nach links)
   ===================================================================== */
.socialwall { background: var(--darker); overflow:hidden; }   /* dunkle Slider-Sektion */
.socialwall { --sw-card: 64vw; }                 /* mobil ~1,5 Posts sichtbar */
@media (min-width:600px){ .socialwall { --sw-card: 30vw; } }   /* Tablet ~3 */
@media (min-width:1000px){ .socialwall { --sw-card: 300px; } } /* Desktop: mehr */
.socialwall .kopf__sub a { color: var(--mint); }
.socialwall .kopf__sub a:hover { color:#fff; }
/* Prev/Next-Steuerung – auf einer Linie mit dem "Social Wall"-Titel, rechtsbündig */
.sw-controls { position:absolute; top: calc(clamp(4.5rem, 3rem + 6vw, 9rem) + 14px); left:0; right:0;
  display:flex; justify-content:flex-end; gap:.6rem; z-index:5; }
/* Buttons wie der ToTop-Pfeil: anthrazit, weißes Symbol, magenta bei Hover */
.sw-btn { width:50px; height:50px; border:0; border-radius:50%; cursor:pointer;
  background: var(--anthracite); color:#fff; display:grid; place-items:center; box-shadow: var(--shadow);
  transition: background .18s, transform .18s var(--ease); }
.sw-btn:hover { background: var(--magenta-600); transform: translateY(-3px); }
.sw-btn svg { width:24px; height:24px; }
/* padding schafft Raum für den Karten-Schatten innerhalb des overflow:hidden */
.sw-viewport { overflow-x:auto; scrollbar-width:none; -ms-overflow-style:none; padding-top:70px; padding-bottom:42px; }
.sw-viewport::-webkit-scrollbar { display:none; }
.sw-track { display:flex; gap:1.2rem; width:max-content; will-change:transform; }
.sw-post { flex:0 0 var(--sw-card); width:var(--sw-card); display:flex; flex-direction:column;
  background:#fff; border-radius: var(--radius-lg); overflow:hidden; box-shadow: 0 10px 26px rgba(0,0,0,.35);
  text-decoration:none; color:inherit; }
.sw-post__media { aspect-ratio:1/1; position:relative; overflow:hidden; background:#dadeda; display:block; }
.sw-post__media img { width:100%; height:100%; object-fit:cover; transition: transform .55s var(--ease); }
.sw-post:hover .sw-post__media img { transform: scale(1.06); }
.sw-post__body { padding:.9rem 1.05rem 1rem; display:flex; flex-direction:column; gap:.55rem; flex:1; }
.sw-post__cap { font-size:.9rem; line-height:1.45; color:var(--ink);
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.sw-post__foot { margin-top:auto; display:flex; align-items:center; gap:.4rem;
  font-family:var(--f-head); font-weight:700; font-size:.78rem; color:var(--magenta-600); }
.sw-post__foot svg { width:16px; height:16px; flex:none; }
.sw-post__foot::before { content:"@"; opacity:.7; }
/* Grafik-Posts (CI-Flächen mit Spruch + Kugelkreuz) */
.sw-post--graphic .sw-post__media { display:grid; place-items:center; padding:1.3rem; color:#fff; }
.sw-post__quote { position:relative; z-index:1; font-family:var(--f-head); font-weight:800;
  font-size: clamp(1.1rem,.9rem + 1vw,1.55rem); line-height:1.15; text-align:center; color:#fff; }
.sw-post__mark { position:absolute; right:-14%; bottom:-14%; width:62%; height:62%; opacity:.16; color:#fff; transition: transform .55s var(--ease), opacity .35s; }
.sw-post--graphic:hover .sw-post__mark { transform: scale(1.12); opacity:.24; }
@media (prefers-reduced-motion: reduce){
  .sw-post:hover .sw-post__media img, .sw-post--graphic:hover .sw-post__mark { transform:none; }
}
.sw-g-magenta .sw-post__media { background: linear-gradient(135deg,var(--magenta),var(--violet)); }
.sw-g-petrol  .sw-post__media { background: linear-gradient(135deg,var(--petrol),var(--cyan)); }
.sw-g-mint    .sw-post__media { background: linear-gradient(135deg,var(--mint-600),var(--petrol)); }

/* Nucleo-Sprite: Farbvererbung für Symbol-Pfade ohne eigene Attribute */
use { fill: currentColor; stroke: currentColor; }