/* ========= Pressespiegel: Grundstruktur (Block & Page) ========= */

/* Tabs */
.ps-tabs__nav{ display:flex; gap:.5rem; margin:.5rem 0 1rem; flex-wrap:wrap; }
.ps-tab{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.45rem .9rem; border-radius:999px;
  border:1px solid rgba(0,0,0,.12); background:#fff; cursor:pointer;
}
.ps-tab.is-active{ background:#f2f7f3; border-color:rgba(46,125,50,.35); }

/* Panels (JS schaltet .is-active) */
.ps-panel{ display:none; }
.ps-panel.is-active{ display:block; }

/* Echte Page-Views: Kopfbereich */
.ps-page__head{
  display:flex; align-items:center; justify-content:space-between; gap:1rem; margin:0 0 1rem;
}

/* Überschrift */
.ps-title{ font-size:1.75rem; margin:0; line-height:1.2; }

/* Liste & Card */
.ps-list{ display:grid; gap:14px; }
.ps-item{
  display:grid; grid-template-columns:160px 1fr; gap:16px;
  padding:12px; border-radius:14px;
  border:1px solid rgba(0,0,0,.08); background:#fff;
}
.ps-item .ps-media img{ width:100%; height:auto; display:block; border-radius:10px; }

/* Datum vor Titel */
.date-pill{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.35rem .65rem; border:1px solid rgba(46,125,50,.25);
  border-radius:999px; background:linear-gradient(#f6fbf6,#eef6ef); font-weight:600;
}
.date-pill i{ opacity:.7; }

/* Titel etwas leichter, ohne Hover-Effekt */
.ps-headline{ margin:.5rem 0 0; font-size:1.05rem; font-weight:700; line-height:1.25; }
.ps-headline a{ text-decoration:none; }
.ps-headline a:hover,
.ps-headline a:focus{ text-decoration:none; color:inherit; }

/* Keine Hover-Animation der Card */
.ps-item:hover{ box-shadow:none; transform:none; }

/* Responsive */
@media (max-width:720px){
  .ps-item{ grid-template-columns:1fr; }
}

/* ========= BLOCK-VIEW: Tabs unter dem Titel, deutlichere Optik ========= */

/* Im Block eingebettete Page-Köpfe ausblenden (verhindert doppelte Überschriften/Tabs) */
.ps-tabs .ps-page__head{ display:none; }

/* Kopf: Titel oben, Tabs darunter */
.ps-tabs--block .ps-head{
  display:flex; flex-direction:column; gap:.5rem; margin:0 0 .75rem;
}
.ps-tabs--block .ps-title{
  margin:0; font-size:clamp(1.25rem, 2.2vw, 1.75rem); line-height:1.2;
}

/* Tabs-Leiste im Block */
.ps-tabs--block .ps-tabs__nav{
  display:flex; gap:.5rem .6rem; flex-wrap:wrap; align-items:center;
}

/* Tab-Buttons – deutlicher Unterschied aktiv/inaktiv */
.ps-tabs--block .ps-tab{
  appearance:none;
  border:1.5px solid color-mix(in srgb, #2e7d32 22%, #b5cbbb);
  background:color-mix(in srgb, #2e7d32 7%, #ffffff);
  color:#145a32;
  padding:.52rem 1rem; border-radius:999px; font-weight:800; line-height:1;
  cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
  transition:background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.ps-tabs--block .ps-tab:hover,
.ps-tabs--block .ps-tab:focus-visible{
  background:color-mix(in srgb, #2e7d32 10%, #ffffff);
  border-color:color-mix(in srgb, #2e7d32 35%, #98b5a2);
  outline:none;
}
.ps-tabs--block .ps-tab.is-active{
  background:#2e7d32; color:#fff; border-color:#2a6d30;
  box-shadow:0 8px 16px rgba(46,125,50,.18), inset 0 1px 0 rgba(255,255,255,.25);
  transform:translateY(-1px);
}
/* ==================== BLOCK: Abstand zum vorherigen Block ==================== */
.ps-tabs--block{
  /* angenehmer, responsiver Abstand nach oben */
  margin-top: clamp(18px, 2.6vw, 32px);
}

/* ==================== BLOCK: Titel als Badge unter dem Titel ==================== */
.ps-tabs--block .ps-head{
  /* Titel oben, Tabs direkt darunter, etwas dichter */
  display: flex;
  flex-direction: column;
  gap: .55rem;
  margin: 0 0 .75rem;
}

/* Badge-Optik für den Blocktitel */
.ps-tabs--block .ps-title{
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  padding: .5rem 1rem;
  border-radius: 999px;
  /* Mittelstrimmig-Grün als Basis, weiße Schrift */
  background: linear-gradient(180deg, #2e7d32 0%, #2a6d30 100%);
  color: #fff;
  border: 1px solid #245a2a;
  box-shadow: 0 8px 18px rgba(46,125,50,.18), inset 0 1px 0 rgba(255,255,255,.25);
  font-weight: 800;
  letter-spacing: .15px;
  line-height: 1.1;
  margin: 0;
}

/* kleines Zeitungs-Icon vor dem Titel (Font Awesome ist bei dir bereits eingebunden) */
.ps-tabs--block .ps-title::before{
  content: "\f1ea"; /* fa-newspaper */
  font: 900 0.95rem "Font Awesome 6 Free";
  display: inline-block;
  line-height: 1;
  transform: translateY(.02em);
  opacity: .95;
}

/* Tabs direkt unter dem Titel ein wenig näher ran */
.ps-tabs--block .ps-tabs__nav{
  margin-top: .1rem;       /* dichter an den Titel */
  gap: .55rem .66rem;
}

/* Tabs im Block – inaktiv etwas heller, aktiv deutlich */
.ps-tabs--block .ps-tab{
  appearance: none;
  border: 1.5px solid color-mix(in srgb, #2e7d32 22%, #b5cbbb);
  background: color-mix(in srgb, #2e7d32 7%, #ffffff);
  color: #145a32;
  padding: .52rem 1rem;
  border-radius: 999px;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
  transition: background .18s, border-color .18s, color .18s, box-shadow .18s, transform .18s;
}
.ps-tabs--block .ps-tab:hover,
.ps-tabs--block .ps-tab:focus-visible{
  background: color-mix(in srgb, #2e7d32 10%, #ffffff);
  border-color: color-mix(in srgb, #2e7d32 35%, #98b5a2);
  outline: none;
}
.ps-tabs--block .ps-tab.is-active{
  background: #2e7d32;
  color: #fff;
  border-color: #2a6d30;
  box-shadow: 0 6px 14px rgba(46,125,50,.18), inset 0 1px 0 rgba(255,255,255,.25);
  transform: translateY(-1px);
}

/* Sicherheit: Im Block eingebettete Page-Köpfe ausblenden (keine doppelten Titel/Tabs) */
.ps-tabs--block .ps-page__head{ display: none; }
/* ==================== BLOCK: dezenter Titel wie "Mitteilungen" ==================== */
.ps-tabs--block .ps-head{
  display: flex;
  flex-direction: column;
  gap: .45rem;               /* enger an die Tabs als vorher */
  margin: 0 0 .75rem;
}

/* Titel: dezent, ohne Badge/Hintergrund */
.ps-tabs--block .ps-title{
  margin: 0;
  padding: 0;                /* überschreibt die Badge-Polsterung */
  background: none;          /* keine Kapsel */
  border: 0;
  box-shadow: none;
  border-radius: 0;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  color: #1a5b3a;            /* Theme-Grün – dezent wie "Mitteilungen" */
  font-weight: 800;
  line-height: 1.15;
}

/* kleines Zeitungs-Icon links – schlicht, ohne Hintergrund */
.ps-tabs--block .ps-title::before{
  content: "\f1ea";          /* fa-newspaper */
  font: 900 1.05rem "Font Awesome 6 Free";
  color: #1a5b3a;
  line-height: 1;
  transform: translateY(.02em);
  opacity: .95;
}

/* Tabs sitzen direkt unter dem Titel */
.ps-tabs--block .ps-tabs__nav{
  margin-top: .1rem;
}

/* Sicherheit: eingebettete Page-Heads im Block ausblenden (keine Doppel-Titel) */
.ps-tabs--block .ps-page__head{ display: none; }
/* === Kleines Dreieck vor den Pressespiegel-Titeln (wie Mitteilungen) === */
.ps-headline a{
  display:inline-flex; align-items:baseline; gap:.45rem;
  text-decoration:none;
}
.ps-headline a::before{
  content:"";
  width:.9rem; height:.9rem; flex:0 0 .9rem;
  background:no-repeat 50%/100% 100%;
  transform:translateY(1px);
  /* Grundform: gefüllter Pfeil in Mittelstrimmig-Grün */
  background-image:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='%232f6b4f'>\
<path d='M5 3l10 6-10 6z'/></svg>");
  transition:background-image .18s ease, opacity .18s ease;
}
.ps-headline a:hover::before,
.ps-headline a:focus-visible::before{
  /* Outline-Variante beim Hover/Fokus – wirkt klickbarer */
  background-image:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none' stroke='%232f6b4f' stroke-width='2' stroke-linejoin='round'>\
<path d='M5 3l10 6-10 6z'/></svg>");
}

/* === Icon vor "Pressespiegel"-Titel (über CSS, kein extra Markup) === */
.ps-tabs--block .ps-title::before{
  content: "\f1ea"; /* fa-newspaper */
  font: 900 1.05rem "Font Awesome 6 Free";
  line-height:1; transform:translateY(.02em);
  color:#1a5b3a; opacity:.95;
}
/* --- Titel mit Zeitungs-Icon ---------------------------------- */
.ps-page__head{
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; margin:.2rem 0 1rem;
}
.ps-page .ps-title{
  display:flex; align-items:center; gap:.55rem; margin:0;
}
.ps-page .ps-title::before{
  content:"\f1ea";                 /* fa-newspaper */
  font:900 1.1rem "Font Awesome 6 Free";
  line-height:1; transform:translateY(.02em);
  color:#1a5b3a; opacity:.95;
}

/* --- Tabs wie auf dem Startseiten-Block ----------------------- */
.ps-tabs__nav{ display:flex; gap:.5rem; flex-wrap:wrap; margin:0; }
.ps-tab{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.45rem .9rem; border-radius:999px;
  border:1px solid rgba(0,0,0,.12);
  background:#fff; color:inherit; text-decoration:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}
.ps-tab:hover{ border-color:rgba(46,125,50,.35); }
.ps-tab.is-active{
  background:#1a5b3a; border-color:#1a5b3a; color:#fff;
}
.ps-tab.is-active:hover{ filter:brightness(1.03); }
/* --- Tabs im Pill-Stil (Wrapper) ----------------------------------- */
.ps-page__head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:.2rem 0 1rem}
.ps-page .ps-title{display:flex;align-items:center;gap:.55rem;margin:0}
.ps-page .ps-title::before{
  content:"\f1ea"; /* fa-newspaper */
  font:900 1.1rem "Font Awesome 6 Free"; line-height:1; transform:translateY(.02em);
  color:#1a5b3a; opacity:.95;
}

.ps-tabs__nav{display:flex;gap:.5rem;flex-wrap:wrap}
.ps-tabs__nav .ps-tab{
  display:inline-flex;align-items:center;padding:.45rem .9rem;border-radius:999px;
  background:#fff;border:1px solid rgba(0,0,0,.12);
  text-decoration:none;color:inherit;box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}
.ps-tabs__nav .ps-tab:hover{border-color:rgba(46,125,50,.35);text-decoration:none}

/* Aktiver Tab: dunkelgrün, nicht klickbar, kein blau beim Hover/Visited */
.ps-tabs__nav .ps-tab.is-active{
  background:#1a5b3a;border-color:#1a5b3a;color:#fff !important;
  pointer-events:none;cursor:default;
}
.ps-tabs__nav .ps-tab.is-active:hover,
.ps-tabs__nav .ps-tab.is-active:focus,
.ps-tabs__nav .ps-tab.is-active:visited{color:#fff !important;text-decoration:none}
/* Tabs */
.ps-tabs__nav {
  display: flex;
  gap: .5rem;
  align-items: center;
}

.ps-tab {
  display: inline-flex;
  align-items: center;
  padding: .45rem 1rem;
  border-radius: 999px;
  border: 1px solid #e5edf0;
  background: #fff;
  color: #0f4c3a;              /* dein Grün-Dunkel für Text */
  text-decoration: none;
  line-height: 1.1;
  font-weight: 600;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}

.ps-tab:hover,
.ps-tab:focus-visible {
  border-color: #cbd8dd;
  text-decoration: none;
}

/* Aktives Tab – dunkles Grün, kein Hover-Farbwechsel */
.ps-tab.is-active {
  background: #135a43;         /* dein dunkles Grün */
  border-color: #135a43;
  color: #fff;
  cursor: default;
  pointer-events: none;        /* „nicht klickbar“ */
}
.ps-tab.is-active:hover,
.ps-tab.is-active:focus-visible {
  color: #fff;
  border-color: #135a43;
}

/* Titel mit Icon */
.ps-title {
  display: flex;
  align-items: center;
  gap: .5rem;
}
.ps-title .fa-newspaper { font-size: .9em; }
.ps-tabs__nav{display:flex;gap:.5rem;align-items:center}
.ps-tab{display:inline-flex;align-items:center;padding:.45rem 1rem;border-radius:999px;border:1px solid #e5edf0;background:#fff;color:#0f4c3a;font-weight:600;line-height:1.1;text-decoration:none;transition:background .15s,color .15s,border-color .15s}
.ps-tab:hover,.ps-tab:focus-visible{border-color:#cbd8dd;text-decoration:none}
.ps-tab.is-active{background:#135a43;border-color:#135a43;color:#fff;pointer-events:none;cursor:default}
.ps-tab.is-active:hover,.ps-tab.is-active:focus-visible{color:#fff;border-color:#135a43}
.ps-title{display:flex;align-items:center;gap:.5rem}
.ps-title .fa-newspaper{font-size:.9em}
/* ========= Pressespiegel (Page-Header): Tabs als Links ========= */
.ps-page__head .ps-tabs__nav { display:flex; gap:.55rem; }
.ps-page__head .ps-tab{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.48rem 1rem; border-radius:999px;
  border:1px solid rgba(0,0,0,.12); background:#fff; text-decoration:none;
  font-weight:800; line-height:1; color:#145a32;
}
.ps-page__head .ps-tab:hover{ background:color-mix(in srgb, #2e7d32 10%, #fff); }

/* aktiv: satt grün, keine Pointer-Events, keine Hover-Farbwechsel */
.ps-page__head .ps-tab.is-active,
.ps-page__head .ps-tab.is-active:hover,
.ps-page__head .ps-tab.is-active:focus{
  background:#2e7d32; color:#fff; border-color:#2a6d30;
  box-shadow:0 6px 14px rgba(46,125,50,.18), inset 0 1px 0 rgba(255,255,255,.25);
  pointer-events:none;               /* nicht klickbar, da aktuelle Seite */
}