:root {
  --tinte: #1c2321;
  --flaeche: #ffffff;
  --hintergrund: #eef1ee;
  --linie: #e2e6e1;
  --schatten: 0 4px 18px rgba(28, 35, 33, 0.10), 0 1px 3px rgba(28, 35, 33, 0.08);
  --moos: #3f7d5c;
  --moos-hell: #e6f2ea;
  --erde: #c98a3f;
}
* { box-sizing: border-box; }
html, body { margin: 0; font-family: 'Inter', "Segoe UI", Arial, sans-serif; color: var(--tinte); background: var(--hintergrund); }

.kopf {
  background: var(--flaeche);
  border-bottom: 1px solid var(--linie);
  padding: 20px 24px;
}
.kopf-inner {
  max-width: 720px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 16px;
}
.kopf .wappen { width: 52px; height: auto; flex: none; }
.kicker {
  text-transform: uppercase;
  letter-spacing: 0.09em;
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--moos);
}
.kopf h1 { font-size: 1.3rem; font-weight: 700; margin: 4px 0 0; }

.inhalt { max-width: 720px; margin: 0 auto; padding: 28px 24px 60px; }

.intro {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #4a4f4c;
  max-width: 62ch;
}

.abschnitt-titel {
  font-size: 0.95rem;
  font-weight: 700;
  margin: 32px 0 14px;
  color: var(--tinte);
}
.abschnitt-titel-abstand { margin-top: 44px; }

.aktion-karte {
  display: block;
  background: var(--flaeche);
  border-radius: 16px;
  box-shadow: var(--schatten);
  padding: 20px 22px;
  text-decoration: none;
  color: inherit;
  position: relative;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.aktion-karte:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 26px rgba(28, 35, 33, 0.14), 0 2px 6px rgba(28, 35, 33, 0.10);
}
.aktion-karte h3 { margin: 6px 0 8px; font-size: 1.05rem; font-weight: 700; }
.aktion-karte p { margin: 0 0 14px; font-size: 0.88rem; line-height: 1.5; color: #5b615e; max-width: 55ch; }

.aktion-status {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 4px 10px;
  border-radius: 999px;
}
.status-aktiv { background: var(--moos-hell); color: var(--moos); }
.status-dauerhaft { background: #fbeedd; color: var(--erde); }

.aktion-link {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--moos);
}

.platzhalter {
  font-size: 0.85rem;
  color: #8b918e;
  font-style: italic;
}

.fusszeile {
  border-top: 1px solid var(--linie);
  padding: 18px 24px;
  text-align: center;
}
.fusszeile p {
  max-width: 620px;
  margin: 0 auto;
  font-size: 0.76rem;
  color: #8b918e;
  line-height: 1.5;
}
.fusszeile p.credit {
  margin-top: 8px;
  font-size: 0.7rem;
}