/* ============================================================
   Evangelischer Verein Schwäbisch Gmünd – Theme-Design
   Farben kommen als CSS-Variablen aus theme.json
   (z. B. var(--wp--preset--color--brand-700)).
   ============================================================ */

:root {
  --evv-shadow-card: 0 1px 2px rgba(0,0,0,.04), 0 12px 28px -18px rgba(30,66,64,.35);
  --evv-shadow-hover: 0 20px 40px -24px rgba(30,66,64,.5);
}

body {
  font-size: 1.0625rem;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3 { line-height: 1.15; letter-spacing: -0.01em; }

::selection { background: var(--wp--preset--color--brand-200); color: var(--wp--preset--color--brand-900); }

@keyframes evv-fade-up {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
.evv-animate { animation: evv-fade-up .7s cubic-bezier(.22,1,.36,1) both; }

/* ---------- Buttons (Pill-Form) ---------- */
.evv-actions .wp-block-button__link,
.wp-block-button.evv-btn .wp-block-button__link {
  border-radius: 999px;
  padding: .8rem 1.6rem;
  font-weight: 600;
  font-size: 1rem;
  transition: background .2s, box-shadow .2s, color .2s;
  border: 0;
}
.wp-block-button.evv-btn--primary .wp-block-button__link {
  background: var(--wp--preset--color--brand-700);
  color: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.08);
}
.wp-block-button.evv-btn--primary .wp-block-button__link:hover { background: var(--wp--preset--color--brand-800); }

.wp-block-button.evv-btn--secondary .wp-block-button__link {
  background: #fff;
  color: var(--wp--preset--color--brand-800);
  box-shadow: inset 0 0 0 1px var(--wp--preset--color--brand-300);
}
.wp-block-button.evv-btn--secondary .wp-block-button__link:hover {
  background: var(--wp--preset--color--brand-50);
  box-shadow: inset 0 0 0 1px var(--wp--preset--color--brand-500);
}
.wp-block-button.evv-btn--ondark .wp-block-button__link {
  background: rgba(255,255,255,.12);
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.3);
}
.wp-block-button.evv-btn--ondark .wp-block-button__link:hover { background: rgba(255,255,255,.22); }

/* ---------- Eyebrow-Label ---------- */
.evv-eyebrow {
  display: inline-block;
  background: var(--wp--preset--color--brand-100);
  color: var(--wp--preset--color--brand-700);
  border-radius: 999px;
  padding: .4rem .9rem;
  font-size: .85rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

/* ============================================================
   HEADER
   ============================================================ */
/* Kein automatischer Block-Abstand zwischen Navbar/Inhalt/Footer */
.wp-site-blocks > main { margin-block-start: 0; }
.wp-site-blocks > footer { margin-block-start: 0; }

/* Template-Part-Wrapper des Headers auflösen, damit sticky relativ zum
   Viewport greift (sonst klebt die Navbar nur am kurzen Wrapper). */
.wp-site-blocks > header.wp-block-template-part { display: contents; }

/* Eigener Schliessen-Button (X) ist rein mobil: auf Desktop immer ausblenden,
   damit kein leerer Mini-Button in der Navbar erscheint. Auf dem Handy wird er
   im geoeffneten Menue eingeblendet (siehe Mobile-Media-Query weiter unten). */
.evv-navclose { display: none; }

.evv-header { position: sticky; top: 0; z-index: 100; background: rgba(245,249,252,.9); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(0,0,0,.05); }
.evv-header-inner { padding-top: .9rem; padding-bottom: .9rem; }
.evv-logo { display: flex; align-items: center; gap: .75rem; text-decoration: none; }
.evv-logo-text { display: flex; flex-direction: column; }
.evv-logo-badge { display: block; width: 2.75rem; height: 2.75rem; border-radius: 1rem; object-fit: contain; flex: 0 0 auto; }
.evv-logo-title { font-size: .95rem; font-weight: 800; color: var(--wp--preset--color--brand-900); line-height: 1.2; margin: 0; }
.evv-logo-sub { font-size: .8rem; font-weight: 500; color: var(--wp--preset--color--muted); line-height: 1.2; margin: 0; }

.evv-nav a {
  position: relative;
  border-radius: 999px;
  padding: .5rem .85rem;
  font-size: .95rem;
  font-weight: 500;
  color: rgba(28,43,58,.8);
  text-decoration: none;
  white-space: nowrap;
  transition: color .15s;
}
/* Unterstrich waechst beim Ueberfahren aus der Mitte heraus. */
.evv-nav a::after {
  content: "";
  position: absolute; left: .85rem; right: .85rem; bottom: .25rem;
  height: 2px; border-radius: 2px;
  background: var(--wp--preset--color--brand-500);
  transform: scaleX(0);
  transition: transform .22s ease;
}
.evv-nav a:hover, .evv-nav a:focus-visible { color: var(--wp--preset--color--brand-800); }
.evv-nav a:hover::after, .evv-nav a:focus-visible::after { transform: scaleX(1); }
@media (prefers-reduced-motion: reduce) {
  .evv-nav a::after { transition: none; }
}

.evv-nav .evv-nav-btn a::after { content: none; }

/* App-/Chat-Verlinkungen als klare Buttons (immer sichtbar, kein Farb-Overlay) */
.evv-nav .evv-nav-btn a {
  border: 1.5px solid var(--wp--preset--color--brand-600);
  color: var(--wp--preset--color--brand-700);
  font-weight: 600;
  background: transparent;
}
.evv-nav .evv-nav-btn a:hover {
  background: var(--wp--preset--color--brand-600);
  color: #fff;
}

/* Untermenüs (Dropdowns) */
.evv-nav .wp-block-navigation__submenu-icon { margin-left: .1rem; }
.evv-nav .wp-block-navigation__submenu-container {
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: .9rem;
  box-shadow: var(--evv-shadow-hover);
  padding: .4rem;
  min-width: 16rem;
}
/* Dropdown-Kante unter dem Menuepunkt beginnen lassen und nach rechts aufklappen.
   Core richtet Untermenues bei rechtsbuendiger Navigation mit right:0 aus,
   daher hier per hoeherer Spezifitaet + !important nach links umstellen. */
.evv-header .evv-nav .wp-block-navigation__submenu-container {
  left: 0 !important;
  right: auto !important;
}
.evv-nav .wp-block-navigation__submenu-container li { width: 100%; }
.evv-nav .wp-block-navigation__submenu-container a {
  border-radius: .6rem;
  white-space: normal;
  padding: .55rem .75rem;
  font-size: .92rem;
}
/* Gleicher animierter Unterstrich wie bei den Hauptpunkten, nur enger
   gesetzt, weil die Eintraege weniger Polsterung haben und umbrechen duerfen. */
.evv-nav .wp-block-navigation__submenu-container a::after {
  left: .75rem; right: .75rem; bottom: .2rem;
}

/* ============================================================
   UNTERSEITEN – LAYOUT MIT SEITENLEISTE
   ============================================================ */
.evv-with-sidebar { padding-left: 1.5rem; padding-right: 1.5rem; }
.evv-layout { gap: 2rem; align-items: flex-start; margin-top: 2rem; margin-bottom: 0; }
/* Spaltenabstand zwischen Sidebar und Inhalt: 40px */
.evv-with-sidebar .evv-layout { column-gap: 40px; }
.evv-sidebar { flex: 0 0 16rem; position: sticky; top: 5.5rem; align-self: flex-start; padding: 1.25rem 0 2rem; }
.evv-content { flex: 1 1 auto; min-width: 0; }
.evv-with-sidebar .evv-content { padding-left: 0; }

/* 50px Abstand nach unten nur auf Unterseiten (nicht auf der Startseite) */
body:not(.home) main.wp-block-group { padding-bottom: 50px; }

/* Unterseiten ohne Sidebar (Impressum, Datenschutz) */
.evv-plain-main { padding-left: 1.5rem; padding-right: 1.5rem; margin-top: 2rem; }
/* Text ueber die volle Breite (keine schmale Lesespalte) */
.evv-plain-main .evv-prose { max-width: none !important; }

/* Seitenleiste als echter Navigations-Block (im Editor pflegbar).
   Sie tritt bewusst in den Hintergrund: helles Grau, erst beim Ueberfahren
   dunkel, damit sie beim Lesen nicht ablenkt. */
.evv-sidebar-nav.wp-block-navigation { display: block; font-size: .98rem; --evv-side-ink: #7a8591; }
.evv-sidebar-nav .wp-block-navigation__container {
  flex-direction: column; align-items: stretch; gap: .1rem; width: 100%;
}
.evv-sidebar-nav .wp-block-navigation-item { display: block; width: 100%; }
.evv-sidebar-nav .wp-block-navigation-item__content {
  position: relative;
  display: block; width: 100%; box-sizing: border-box; border-radius: .55rem;
  padding: .5rem .7rem; line-height: 1.3; font-weight: 600;
  color: var(--evv-side-ink); text-decoration: none;
  transition: color .15s;
}
/* Wie in der Navbar: der Unterstrich waechst beim Ueberfahren heraus. */
.evv-sidebar-nav .wp-block-navigation-item__content::after {
  content: "";
  position: absolute; left: .7rem; right: .7rem; bottom: .12rem;
  height: 2px; border-radius: 2px;
  background: var(--wp--preset--color--brand-500);
  transform: scaleX(0);
  transition: transform .22s ease;
}
.evv-sidebar-nav .wp-block-navigation-item__content:hover,
.evv-sidebar-nav .wp-block-navigation-item__content:focus-visible,
.evv-sidebar-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.evv-sidebar-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible {
  color: var(--wp--preset--color--ink);
}
.evv-sidebar-nav .wp-block-navigation-item__content:hover::after,
.evv-sidebar-nav .wp-block-navigation-item__content:focus-visible::after {
  transform: scaleX(1);
}
/* Core setzt die Linkfarbe mit doppelter Klasse auf "inherit". Damit das
   helle Grau und das Abdunkeln greifen, braucht es hier mehr Gewicht. */
.evv-sidebar .evv-sidebar-nav .wp-block-navigation-item:not(.evv-side-btn) > .wp-block-navigation-item__content.wp-block-navigation-item__content {
  color: var(--evv-side-ink);
}
.evv-sidebar .evv-sidebar-nav .wp-block-navigation-item:not(.evv-side-btn) > .wp-block-navigation-item__content.wp-block-navigation-item__content:hover,
.evv-sidebar .evv-sidebar-nav .wp-block-navigation-item:not(.evv-side-btn) > .wp-block-navigation-item__content.wp-block-navigation-item__content:focus-visible {
  color: var(--wp--preset--color--ink);
}
/* Bei Toptiteln mit Untermenue endet der Strich vor dem Dreieck. */
.evv-sidebar-nav .wp-block-navigation-item.has-child > .wp-block-navigation-item__content::after {
  right: 2.2rem;
}
/* App und Chat sind Buttons und behalten ihr Aussehen. */
.evv-sidebar-nav .evv-side-btn .wp-block-navigation-item__content::after { content: none; }
@media (prefers-reduced-motion: reduce) {
  .evv-sidebar-nav .wp-block-navigation-item__content::after { transition: none; }
}

/* Seitenleiste als Verzeichnisbaum: die zweite Ebene steht eingerueckt unter
   ihrem Toptitel, ohne weisses Kaertchen. Standardmaessig ist sie zugeklappt;
   zugeklappt wird ueber die Klasse "evv-closed", die nav.js beim Klick auf
   den Toptitel oder das Dreieck umschaltet. */
.evv-sidebar-nav .wp-block-navigation__submenu-container {
  position: static !important; opacity: 1 !important; visibility: visible !important;
  transform: none !important; width: 100% !important; min-width: 0 !important;
  border: 0 !important; box-shadow: none !important; background: transparent !important;
  padding: 0 !important; margin: .05rem 0 .35rem;
  display: block !important;
  /* Core klappt Untermenues ueber height/overflow zu, nicht ueber display. */
  height: auto !important; overflow: visible !important;
}
.evv-sidebar-nav .wp-block-navigation-item.has-child.evv-closed > .wp-block-navigation__submenu-container,
.evv-sidebar-nav .wp-block-navigation-item.has-child:not([data-evv-sub]) > .wp-block-navigation__submenu-container {
  display: none !important;
}
/* Unterpunkte: gleiche Schrift und Dicke wie die Toptitel, nur kleiner und staerker eingerueckt */
.evv-sidebar-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  padding-left: 24px !important;
  font-size: .9rem;
  color: var(--evv-side-ink);
}
/* WordPress-Chevron aus, eigenes Dreieck als Auf-/Zuklappen-Schalter.
   Toptitel und Dreieck klappen die zweite Ebene auf und zu; die eigene
   Seite des Toptitels steht als "Übersicht" ganz oben in den Unterpunkten. */
.evv-sidebar-nav .wp-block-navigation__submenu-icon { display: none; }
.evv-sidebar-nav .wp-block-navigation-item.has-child > .wp-block-navigation-item__content {
  padding-right: 2.2rem;
}
.evv-subtoggle {
  position: absolute; right: .35rem; top: .35rem;
  width: 1.75rem; height: 1.75rem;
  display: grid; place-items: center;
  padding: 0; border: 0; border-radius: .45rem;
  background: transparent; cursor: pointer;
  color: var(--evv-side-ink);
}
.evv-subtoggle:hover, .evv-subtoggle:focus-visible { background: var(--wp--preset--color--brand-50); color: var(--wp--preset--color--ink); }
.evv-subtoggle::after {
  content: ""; display: block;
  width: 0; height: 0;
  border-left: 5px solid transparent; border-right: 5px solid transparent;
  border-top: 6px solid currentColor;
  transition: transform .18s ease;
}
.evv-sidebar-nav .wp-block-navigation-item.has-child.evv-closed .evv-subtoggle::after {
  transform: rotate(-90deg);
}
/* Das Listenelement traegt den Bezugspunkt fuer das absolut gesetzte Dreieck. */
.evv-sidebar-nav .wp-block-navigation-item.has-child { position: relative; }

/* App/Chat als Buttons */
.evv-sidebar-nav .evv-side-btn .wp-block-navigation-item__content {
  box-sizing: border-box; width: 100%;
  text-align: center; justify-content: center;
  border-radius: 999px; font-weight: 600; padding: .55rem 1rem;
  border: 1.5px solid var(--wp--preset--color--brand-600);
  color: var(--wp--preset--color--brand-700); background: transparent;
}
.evv-sidebar-nav .evv-side-btn .wp-block-navigation-item__content:hover { background: var(--wp--preset--color--brand-50); }
.evv-sidebar-nav .evv-side-btn { margin-top: .5rem; }
.evv-sidebar-nav .evv-side-sep { margin-top: 1.1rem; padding-top: 1.1rem; border-top: 1px solid rgba(0,0,0,.08); }

.evv-donate.wp-block-button .wp-block-button__link {
  background: var(--wp--preset--color--brand-600);
  color: #fff;
  border-radius: 999px;
  padding: .55rem 1.25rem;
  font-weight: 600;
}
.evv-donate.wp-block-button .wp-block-button__link:hover { background: var(--wp--preset--color--brand-700); }

/* ============================================================
   HERO
   ============================================================ */
.evv-hero { position: relative; overflow: hidden; padding-left: 1.5rem; padding-right: 1.5rem; }
.evv-hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(1100px 520px at 12% -15%, #d5ebf8 0, transparent 62%),
    radial-gradient(760px 420px at 96% 4%, rgba(242,162,78,.16) 0, transparent 60%);
}
.evv-hero-title { font-weight: 800; color: var(--wp--preset--color--brand-900); }
.evv-hero-title .evv-accent { color: var(--wp--preset--color--brand-500); }
.evv-hero-lead { color: var(--wp--preset--color--muted); font-size: 1.15rem; max-width: 34rem; margin-left: 0 !important; margin-right: auto !important; }

/* ---------- Hero mit Hintergrundbild ---------- */
.evv-hero--photo::before {
  background:
    linear-gradient(90deg, rgba(15,42,63,.82) 0, rgba(15,42,63,.55) 42%, rgba(15,42,63,.15) 78%),
    url("images/hero-startseite.jpg") center/cover no-repeat;
}
.evv-hero--photo .evv-hero-content { max-width: var(--wp--style--global--content-size); }
.evv-hero--photo .evv-hero-title { color: #fff; text-shadow: 0 2px 18px rgba(0,0,0,.35); max-width: 24ch; margin-left: 0 !important; margin-right: auto !important; }
.evv-hero--photo .evv-hero-title .evv-accent { color: var(--wp--preset--color--brand-300); }
.evv-hero--photo .evv-hero-lead { color: rgba(255,255,255,.9); }
@media (max-width: 782px) {
  .evv-hero--photo::before {
    background:
      linear-gradient(180deg, rgba(15,42,63,.78) 0, rgba(15,42,63,.55) 100%),
      url("images/hero-startseite.jpg") center/cover no-repeat;
  }
}

/* Kein Cremeabstand zwischen Hero und dem folgenden Abschnitt */
.evv-hero--photo { margin-bottom: 0; }
.evv-hero--photo + .evv-values { margin-top: 0; }

/* ---------- Karte / Stat-Card ---------- */
.evv-card {
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(0,0,0,.05);
  border-radius: 1.5rem;
  padding: 1.75rem;
  box-shadow: var(--evv-shadow-card);
  backdrop-filter: blur(6px);
}
.evv-card-kicker { font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--wp--preset--color--brand-600); margin: 0; }
.evv-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; text-align: center; margin: 1.25rem 0 0; }
.evv-stat { background: var(--wp--preset--color--brand-50); border-radius: 1rem; padding: 1rem .5rem; }
.evv-stat b { display: block; font-size: 1.5rem; font-weight: 800; color: var(--wp--preset--color--brand-700); }
.evv-stat span { display: block; margin-top: .25rem; font-size: .75rem; color: var(--wp--preset--color--muted); }

/* ============================================================
   WERTE-STRIP
   ============================================================ */
.evv-values { background: var(--wp--preset--color--sand); }
/* In der Inhaltsspalte (Unterseiten) als abgerundete Karte statt Vollbreiten-Streifen */
.evv-content .evv-values { border-radius: 1.5rem; padding-left: 2rem; padding-right: 2rem; }
.evv-value { display: flex; gap: 1rem; }
.evv-value-icon { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 1rem; background: var(--wp--preset--color--brand-600); color: #fff; flex: 0 0 auto; }
.evv-value h3 { margin: 0; font-size: 1.15rem; font-weight: 800; color: var(--wp--preset--color--brand-900); }
.evv-value p { margin: .35rem 0 0; color: var(--wp--preset--color--muted); }

/* ============================================================
   ANGEBOTE
   ============================================================ */
.evv-section-heading h2 { font-size: clamp(1.9rem, 3.5vw, 2.4rem); font-weight: 800; color: var(--wp--preset--color--brand-900); margin: .75rem 0 0; }
.evv-section-heading p { color: var(--wp--preset--color--muted); font-size: 1.15rem; margin: .9rem 0 0; max-width: 40rem; }

.evv-offer {
  display: flex; flex-direction: column; height: 100%;
  background: #fff; border: 1px solid rgba(0,0,0,.05);
  border-radius: 1.5rem; padding: 1.75rem;
  box-shadow: var(--evv-shadow-card);
  transition: transform .2s, box-shadow .2s;
  text-decoration: none;
}
.evv-offer:hover { transform: translateY(-4px); box-shadow: var(--evv-shadow-hover); }
.evv-offer-icon { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 1rem; background: var(--wp--preset--color--brand-100); color: var(--wp--preset--color--brand-700); transition: background .2s, color .2s; }
.evv-offer:hover .evv-offer-icon { background: var(--wp--preset--color--brand-600); color: #fff; }
.evv-offer h3 { margin: 1.1rem 0 0; font-size: 1.25rem; font-weight: 800; color: var(--wp--preset--color--brand-900); }
.evv-offer p { margin: .5rem 0 0; color: var(--wp--preset--color--muted); }
/* "Mehr erfahren" immer ganz unten, mit Abstand zum Text darueber */
.evv-offer .evv-more { margin-top: auto; padding-top: 1.25rem; font-weight: 600; color: var(--wp--preset--color--brand-700); }

/* ============================================================
   SPENDEN-CTA
   ============================================================ */
.evv-cta-box { position: relative; overflow: hidden; border-radius: 2rem; background: var(--wp--preset--color--brand-800); color: #fff; padding: 3.25rem 2rem; }
.evv-cta-box::before { content: ""; position: absolute; inset: 0; opacity: .2; pointer-events: none; background: radial-gradient(circle at 85% 20%, #f0a95a 0, transparent 45%); }
.evv-cta-box > * { position: relative; }
.evv-cta-box h2 { font-size: clamp(1.9rem, 3.5vw, 2.4rem); font-weight: 800; margin: 0; }
.evv-cta-box .evv-cta-lead { color: var(--wp--preset--color--brand-100); font-size: 1.15rem; margin: 1rem 0 0; max-width: 34rem; }
.evv-bank { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15); border-radius: 1rem; padding: 1.5rem; }
.evv-bank .evv-card-kicker { color: var(--wp--preset--color--brand-100); }
.evv-bank p { margin: .35rem 0 0; }
.evv-bank .evv-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .9rem; color: var(--wp--preset--color--brand-100); }

/* ---------- App-Banner ---------- */
.evv-app-banner {
  position: relative; overflow: hidden; border-radius: 2rem; color: #fff;
  padding: 3rem 2.5rem;
  background: linear-gradient(120deg, var(--wp--preset--color--brand-700) 0, var(--wp--preset--color--brand-500) 100%);
}
.evv-app-banner::before {
  content: ""; position: absolute; inset: 0; opacity: .35; pointer-events: none;
  background:
    radial-gradient(520px 320px at 88% 12%, rgba(255,255,255,.35) 0, transparent 60%),
    radial-gradient(420px 300px at 100% 100%, rgba(15,42,63,.45) 0, transparent 55%);
}
.evv-app-banner > * { position: relative; }
.evv-app-banner h2 { font-size: clamp(1.7rem, 3vw, 2.2rem); font-weight: 800; margin: 0; }
.evv-app-lead { color: rgba(255,255,255,.92); font-size: 1.12rem; margin: 1rem 0 0; max-width: 34rem; }
.evv-app-stores.evv-stores { height: 100%; justify-content: center; align-items: flex-end; gap: 1rem; }
.evv-app-stores .evv-store img { width: 12rem; }
@media (max-width: 782px) {
  .evv-app-banner { padding: 2.25rem 1.5rem; }
  .evv-app-stores.evv-stores { height: auto; align-items: flex-start; margin-top: 1.75rem; }
}

/* ============================================================
   FOOTER
   ============================================================ */
.evv-footer { background: var(--wp--preset--color--brand-900); color: var(--wp--preset--color--brand-100); }
.evv-footer a { color: var(--wp--preset--color--brand-200); text-decoration: none; }
.evv-footer a:hover { color: #fff; }
.evv-footer h3 { color: #fff; font-size: .85rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; margin: 0 0 1rem; }
.evv-footer-brand p { color: var(--wp--preset--color--brand-200); font-size: .95rem; max-width: 20rem; }
.evv-footer-links ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: .6rem; font-size: .95rem; }
.evv-contact-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .85rem; font-size: .95rem; }
.evv-contact-list li { display: flex; align-items: flex-start; gap: .7rem; color: var(--wp--preset--color--brand-200); line-height: 1.5; }
.evv-contact-ico { flex: 0 0 auto; margin-top: .1rem; color: var(--wp--preset--color--brand-300); }
.evv-footer-bottom { border-top: 1px solid rgba(255,255,255,.1); font-size: .9rem; color: var(--wp--preset--color--brand-300); }

/* ============================================================
   UNTERSEITEN – SEITEN-HERO (dunkel)
   ============================================================ */
.evv-page-hero {
  position: relative;
  overflow: hidden;
  background: var(--wp--preset--color--brand-900);
  color: #fff;
  text-align: center;
  padding: 3.5rem 1.5rem;
  margin-top: 0;
}
.evv-page-hero::before {
  content: ""; position: absolute; inset: 0; opacity: .15; pointer-events: none;
  background:
    radial-gradient(circle at 20% 20%, #74bcb0 0, transparent 45%),
    radial-gradient(circle at 85% 30%, #f0a95a 0, transparent 40%);
}
.evv-page-hero > * { position: relative; }
.evv-page-hero .evv-eyebrow {
  background: rgba(255,255,255,.1);
  color: var(--wp--preset--color--brand-100);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.15);
}
.evv-page-hero h1,
.evv-page-hero .wp-block-post-title { font-size: clamp(2.1rem, 4.5vw, 3rem); font-weight: 800; margin: 0; color: #fff; }
.evv-page-hero .evv-page-intro,
.evv-page-hero .wp-block-post-excerpt {
  color: rgba(213,235,248,.9);
  font-size: 1.2rem;
  margin: 1.25rem auto 0;
  max-width: 42rem;
}
.evv-page-hero .wp-block-post-excerpt p { margin: 0; }
.evv-page-hero .wp-block-post-excerpt__more-text { display: none; }

/* ---------- Fakten-Leiste ---------- */
.evv-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: 1rem;
  margin: 0;
}
.evv-fact {
  background: #fff;
  border: 1px solid rgba(0,0,0,.05);
  border-radius: 1rem;
  padding: 1.15rem 1.25rem;
  box-shadow: var(--evv-shadow-card);
}
.evv-fact dt { font-size: .8rem; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--wp--preset--color--muted); margin: 0; }
.evv-fact dd { margin: .3rem 0 0; font-size: 1.25rem; font-weight: 800; color: var(--wp--preset--color--brand-700); }

/* ---------- Fließtext ---------- */
.evv-prose { max-width: 44rem; margin-left: 0 !important; margin-right: auto !important; }
/* In der Sidebar-Ansicht den Text die Spalte fuellen lassen, damit der rechte
   Rand genauso gross ist wie der linke neben der Seitenleiste. */
.evv-content .evv-prose { max-width: none; }
.evv-prose h2 { font-size: 1.6rem; font-weight: 800; color: var(--wp--preset--color--brand-900); margin: 2.5rem 0 .75rem; }
.evv-prose h3 { font-size: 1.2rem; font-weight: 700; color: var(--wp--preset--color--brand-800); margin: 1.75rem 0 .5rem; }
.evv-prose p { color: var(--wp--preset--color--ink); margin: 0 0 1rem; }
.evv-prose ul { padding-left: 0; list-style: none; margin: 0 0 1.25rem; }
.evv-prose ul li {
  position: relative; padding-left: 1.75rem; margin-bottom: .6rem; color: var(--wp--preset--color--ink);
}
.evv-prose ul li::before {
  content: ""; position: absolute; left: 0; top: .55em;
  width: .75rem; height: .45rem;
  border-left: 2px solid var(--wp--preset--color--brand-500);
  border-bottom: 2px solid var(--wp--preset--color--brand-500);
  transform: rotate(-45deg);
}
/* Bilder & Galerien in der Prosa */
.evv-prose .wp-block-image, .evv-prose .wp-block-gallery { margin: 2rem 0; }
.evv-prose .wp-block-image img, .evv-prose .wp-block-gallery img { border-radius: 1rem; }

/* ---------- Hervorgehobenes Zitat ---------- */
.evv-quote {
  border-left: 4px solid var(--wp--preset--color--brand-500);
  background: var(--wp--preset--color--brand-50);
  border-radius: 0 1rem 1rem 0;
  padding: 1.15rem 1.35rem;
  margin: 1.5rem 0;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--wp--preset--color--brand-800);
}
.evv-quote p { margin: 0; }

/* ---------- Kalender-Einbindung (iframe) ---------- */
.evv-calendar {
  background: #fff;
  border: 1px solid rgba(0,0,0,.05);
  border-radius: 1.5rem;
  box-shadow: var(--evv-shadow-card);
  overflow: hidden;
}
.evv-calendar iframe {
  display: block;
  width: 100%;
  min-height: 700px;
  border: 0;
}

/* ---------- Zeitleiste (Meilensteine) ---------- */
.evv-timeline { list-style: none; margin: 1.5rem 0 0; padding: 0; }
.evv-timeline li { display: flex; gap: 1rem; margin-bottom: 1.5rem; }
.evv-timeline li:last-child { margin-bottom: 0; }
.evv-timeline .evv-year {
  display: grid; place-items: center;
  width: 3.5rem; height: 3.5rem; flex: 0 0 auto;
  border-radius: 1rem;
  background: var(--wp--preset--color--brand-600);
  color: #fff; font-size: .85rem; font-weight: 800;
}
.evv-timeline p { margin: 0; color: var(--wp--preset--color--muted); align-self: center; }

/* ---------- Kontakt-Karten ---------- */
.evv-contact-card {
  background: #fff;
  border: 1px solid rgba(0,0,0,.05);
  border-radius: 1.5rem;
  padding: 1.75rem;
  box-shadow: var(--evv-shadow-card);
  height: 100%;
}
.evv-contact-card h3 { margin: 0 0 .75rem; font-size: 1.2rem; font-weight: 800; color: var(--wp--preset--color--brand-900); }
.evv-contact-card p { margin: 0 0 .4rem; color: var(--wp--preset--color--muted); }
.evv-contact-card a { color: var(--wp--preset--color--brand-700); font-weight: 600; }

/* ---------- App-Store-Badges im Footer ---------- */
.evv-stores { display: flex; flex-direction: column; align-items: flex-start; gap: .65rem; }
.evv-store { display: inline-block; text-decoration: none; transition: opacity .18s ease; }
.evv-store:hover { opacity: .85; }
.evv-store img { display: block; width: 9.5rem; height: auto; }

/* ---------- Downloadbereich ---------- */
.evv-downloads, .evv-prose .evv-downloads { list-style: none; margin: 1.25rem 0 0; padding: 0; }
/* Im Fliesstext duerfen die Download-Kacheln weder den Haken erben noch
   ihren eigenen Innenabstand an den Listen-Stil verlieren. */
.evv-prose .evv-downloads .evv-download { padding: 1rem 1.25rem; }
.evv-prose .evv-downloads li::before { content: none; }
.evv-download {
  display: flex; align-items: center; gap: 1rem;
  background: #fff;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 1rem;
  padding: 1rem 1.25rem;
  margin-bottom: .85rem;
  box-shadow: var(--evv-shadow-card);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.evv-download:hover { transform: translateY(-2px); box-shadow: var(--evv-shadow-hover); border-color: var(--wp--preset--color--brand-200); }
.evv-download-icon {
  display: grid; place-items: center; flex: 0 0 auto;
  width: 2.75rem; height: 2.75rem; border-radius: .8rem;
  background: var(--wp--preset--color--brand-50);
  color: var(--wp--preset--color--brand-600);
}
.evv-download-body { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; }
.evv-download-body a { font-weight: 700; color: var(--wp--preset--color--brand-900); text-decoration: none; }
.evv-download-body a:hover { color: var(--wp--preset--color--brand-600); }
.evv-download-body small { color: var(--wp--preset--color--muted); font-size: .82rem; margin-top: .15rem; }
.evv-download-cta {
  flex: 0 0 auto; display: inline-flex; align-items: center; gap: .35rem;
  font-size: .85rem; font-weight: 700;
  color: var(--wp--preset--color--brand-600);
  background: var(--wp--preset--color--brand-50);
  padding: .4rem .85rem; border-radius: 999px;
  text-decoration: none;
  transition: background .18s ease, color .18s ease;
}
a.evv-download-cta:hover, a.evv-download-cta:focus-visible {
  background: var(--wp--preset--color--brand-600);
  color: #fff;
}

/* ---------- Flyer-/Folder-Seite ---------- */
.evv-flyer-row {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 2.5rem; align-items: center;
  margin-bottom: 3rem;
}
.evv-flyer-row--reverse .evv-flyer-media { order: 2; }
.evv-flyer-media {
  display: grid; place-items: center; text-align: center;
  min-height: 15rem; border-radius: 1.25rem;
  color: #fff; font-weight: 700; font-size: 1rem; line-height: 1.4;
  box-shadow: var(--evv-shadow-card);
  background: var(--wp--preset--color--brand-600);
}
.evv-flyer-media span { padding: 1rem; opacity: .95; }
.evv-flyer-media--1 { background: linear-gradient(135deg, var(--wp--preset--color--brand-500), var(--wp--preset--color--brand-700)); }
.evv-flyer-media--2 { background: linear-gradient(135deg, var(--wp--preset--color--brand-700), var(--wp--preset--color--brand-900)); }
.evv-flyer-media--3 { background: linear-gradient(135deg, var(--wp--preset--color--accent-400), var(--wp--preset--color--accent-500)); }
.evv-flyer-text h2 { font-size: 1.6rem; font-weight: 800; color: var(--wp--preset--color--brand-900); margin: 0 0 .75rem; }
.evv-flyer-text p { color: var(--wp--preset--color--ink); margin: 0; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 900px) {
  /* Sidebar stapelt ueber dem Inhalt, alles untereinander */
  .evv-layout { flex-wrap: wrap; gap: 1.5rem; }
  .evv-sidebar { flex-basis: 100%; position: static; top: auto; padding: .5rem 0 1.5rem; }
  .evv-sidebar-nav .wp-block-navigation__container { flex-direction: column; align-items: stretch; }
  .evv-sidebar-nav .wp-block-navigation-item,
  .evv-sidebar-nav .evv-side-btn { display: block; width: 100%; }
  .evv-sidebar-nav .evv-side-btn .wp-block-navigation-item__content { text-align: center; }
}
/* Mobil (ab Burger-Menue) keine Seitenleiste, ihre Links stehen im Burger-Menue */
@media (max-width: 820px) {
  .evv-sidebar { display: none; }
}
/* Menuepunkte, die nur im Burger-Menue stehen (auf dem Desktop in der Seitenleiste) */
@media (min-width: 821px) {
  .evv-nav .evv-nav-mobile-only { display: none !important; }
}

@media (max-width: 781px) {
  .evv-stats { grid-template-columns: repeat(3, 1fr); }
  .evv-calendar iframe { min-height: 560px; }
  .evv-flyer-row { grid-template-columns: 1fr; gap: 1.25rem; }
  .evv-flyer-row--reverse .evv-flyer-media { order: 0; }
  .evv-flyer-media { min-height: 11rem; }
  .evv-download { flex-wrap: wrap; }
  .evv-download-cta { margin-left: 3.75rem; }

  /* ---- Durchgehende Seitenabstaende auf dem Handy ---- */
  .evv-header-inner { padding-left: 1.25rem; padding-right: 1.25rem; }
  .evv-with-sidebar { padding-left: 1.25rem; padding-right: 1.25rem; }
  .evv-hero { padding-left: 1.25rem; padding-right: 1.25rem; }
  .evv-page-hero { padding-left: 1.25rem; padding-right: 1.25rem; }
  .evv-values { padding-left: 1.25rem; padding-right: 1.25rem; }
  .evv-content .evv-values { padding-left: 1.25rem; padding-right: 1.25rem; }
  .evv-with-sidebar .evv-content { padding-left: 0; }
  /* Startseiten-Abschnitte (constrained) einruecken, Vollbreiten-Baender ausgenommen */
  .home main.is-layout-constrained > .wp-block-group:not(.alignfull) {
    padding-left: 1.25rem; padding-right: 1.25rem;
  }
  /* Footer-Innenabstand auf dem Handy */
  .evv-footer { padding-left: 1.25rem; padding-right: 1.25rem; }
}

/* ============================================================
   MOBILES NAVBAR-MENUE (eigene, robuste Steuerung)
   ============================================================ */
@media (max-width: 820px) {
  .evv-header { position: sticky; }

  /* Hamburger-Button sicher anzeigen, Inline-Menue ausblenden */
  .evv-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex !important; }
  .evv-nav .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none !important; }

  /* Geoeffnetes Menue als Panel ueber die volle Fensterbreite, direkt unter der Navbar.
     display:block hebt das zentrierende Flex-Modal von WordPress auf. */
  .evv-nav .wp-block-navigation__responsive-container.is-menu-open {
    display: block !important;
    box-sizing: border-box !important;
    position: fixed !important;
    top: var(--evv-header-h, 4.5rem); left: 0; right: 0; bottom: auto;
    width: auto !important; max-width: 100% !important;
    max-height: calc(100vh - var(--evv-header-h, 4.5rem)); overflow-y: auto; overflow-x: hidden;
    background: var(--wp--preset--color--cream);
    border-top: 1px solid rgba(0,0,0,.08);
    box-shadow: 0 18px 30px -18px rgba(30,66,64,.4);
    padding: 1rem 1.25rem 1.5rem;
    z-index: 120;
  }
  .evv-nav .is-menu-open .wp-block-navigation__responsive-container-content {
    display: block !important; width: 100% !important; max-width: none !important;
    align-items: stretch !important; justify-content: flex-start !important;
    padding-top: 0 !important;  /* WP-Extra-Padding fuer den Schliessen-Button entfernen */
  }

  /* Eigenes Hamburger-Icon fuer den Oeffnen-Button (WP-SVG ausgeblendet). */
  .evv-nav .wp-block-navigation__responsive-container-open svg { display: none !important; }
  .evv-nav .wp-block-navigation__responsive-container-open {
    position: relative; width: 2.75rem; height: 2.75rem; z-index: 130;
  }
  /* Nativen WordPress-Schliessen-Button (im Panel) ausblenden: wir schliessen
     ueber einen eigenen X-Button im Header, der ihn programmatisch ausloest. */
  .evv-nav .wp-block-navigation__responsive-container-close { display: none !important; }

  /* Der Hamburger bleibt sichtbar und morpht animiert zum X (siehe unten).
     Fuer das zuverlaessige Schliessen liegt darueber ein unsichtbares
     Klick-Overlay (.evv-navclose), das im offenen Zustand den nativen
     WordPress-Schliess-Mechanismus ausloest. So bleibt die Animation erhalten
     und der Tap trifft nicht den Oeffnen-Button (kein Reopen-Konflikt). */
  .evv-navclose {
    display: none;
    position: absolute; top: 0; right: 1.25rem;
    width: 2.75rem; height: var(--evv-header-h, 4.55rem);
    background: transparent; border: 0; padding: 0; margin: 0;
    cursor: pointer; z-index: 140;
  }
  html.has-modal-open .evv-navclose { display: block; }

  .evv-burger, .evv-burger::before, .evv-burger::after {
    position: absolute; width: 22px; height: 2px; border-radius: 2px;
    background: var(--wp--preset--color--brand-900);
    transition: transform .2s ease, opacity .2s ease, background .2s ease;
  }
  .evv-burger { top: 50%; left: 50%; margin: -1px 0 0 -11px; }
  .evv-burger::before { content: ""; left: 0; top: -7px; }
  .evv-burger::after  { content: ""; left: 0; top: 7px; }
  /* Offen -> X */
  html.has-modal-open .evv-burger { background: transparent; }
  html.has-modal-open .evv-burger::before { transform: translateY(7px) rotate(45deg); }
  html.has-modal-open .evv-burger::after  { transform: translateY(-7px) rotate(-45deg); }
  /* Alles linksbuendig im Panel, Text bricht um */
  .evv-nav .is-menu-open .wp-block-navigation__container {
    flex-direction: column; align-items: stretch !important; gap: .1rem;
    justify-content: flex-start; text-align: left; width: 100%;
  }
  .evv-nav .is-menu-open .wp-block-navigation-item { text-align: left; width: 100%; }
  .evv-nav .is-menu-open .wp-block-navigation-item__content {
    display: flex; align-items: center; width: 100%; box-sizing: border-box;
    justify-content: flex-start; text-align: left;
    font-size: 1.05rem; padding: .6rem .9rem !important; border-radius: .55rem;
    white-space: normal !important; overflow-wrap: anywhere;
  }
  .evv-nav .is-menu-open .wp-block-navigation-item__label { white-space: normal !important; }

  /* Toptitel mit Untermenue: Dreieck absolut am rechten Rand (unabhaengig von Flex). */
  .evv-nav .is-menu-open .wp-block-navigation-item.has-child > .wp-block-navigation-item__content {
    position: relative; cursor: pointer; padding-right: 2rem !important;
  }
  .evv-nav .is-menu-open .wp-block-navigation__submenu-icon { display: none !important; }
  .evv-nav .is-menu-open .wp-block-navigation-item.has-child > .wp-block-navigation-item__content::after {
    content: ""; position: absolute; right: .9rem; top: 50%;
    /* Werte des Hover-Unterstrichs (.evv-nav a::after) zuruecksetzen,
       sonst rutscht das Dreieck nach links ueber den Text. */
    left: auto; bottom: auto; background: none; border-radius: 0;
    width: 0; height: 0;
    border-left: 5px solid transparent; border-right: 5px solid transparent;
    border-top: 6px solid var(--wp--preset--color--brand-900);
    transform: translateY(-50%);
    transition: transform .18s ease;
  }
  .evv-nav .is-menu-open .wp-block-navigation-item.has-child.evv-open > .wp-block-navigation-item__content::after {
    transform: translateY(-50%) rotate(180deg);
  }

  /* Untermenue standardmaessig geschlossen, nur bei .evv-open aufgeklappt.
     Nur leichte Einrueckung (WP-Standard 2rem ueberschreiben). */
  .evv-nav .is-menu-open .wp-block-navigation__submenu-container {
    position: static !important; opacity: 1 !important; visibility: visible !important;
    transform: none !important; width: 100% !important; min-width: 0 !important;
    background: transparent; border: 0; box-shadow: none;
    padding: 0 0 .25rem .5rem !important;
    display: none !important;
  }
  .evv-nav .is-menu-open .wp-block-navigation-item.has-child.evv-open > .wp-block-navigation__submenu-container {
    display: block !important;
  }
  .evv-nav .is-menu-open .wp-block-navigation__submenu-container a { font-size: .98rem; color: var(--wp--preset--color--muted); }
}

/* Schwarzes Overlay hinter dem Mobil-Menue (Tippen schliesst das Menue) */
.evv-menu-backdrop {
  position: fixed; inset: 0; z-index: 90;
  background: rgba(0,0,0,.5);
  opacity: 0; visibility: hidden; transition: opacity .2s ease;
}
.evv-menu-backdrop.is-visible { opacity: 1; visibility: visible; }
@media (min-width: 821px) { .evv-menu-backdrop { display: none !important; } }

/* ============================================================
   404-SEITE
   ============================================================ */
.evv-404 { background: var(--wp--preset--color--brand-50); text-align: center; }
.evv-404-inner { margin-left: auto; margin-right: auto; }
.evv-404-title { color: var(--wp--preset--color--brand-900); font-weight: 800; margin: .5rem 0 0; }
.evv-404-lead { color: var(--wp--preset--color--muted); font-size: 1.15rem; margin: 1rem 0 0; }
.evv-404 .evv-actions { justify-content: center; }

/* ============================================================
   TERMINE / KALENDER (eingebettet)
   ============================================================ */
.evv-calendar {
  border-radius: 1.25rem;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: var(--evv-shadow-card);
  background: #fff;
}
.evv-calendar iframe { display: block; width: 100%; border: 0; }
@media (max-width: 600px) {
  .evv-calendar iframe { height: 620px !important; }
}

/* ---------- Bilderslider (automatisch, ohne Vergroessern beim Klick) ---------- */
.evv-slider {
  position: relative;
  margin: 2rem 0;
  border-radius: 1rem;
  overflow: hidden;
  background: var(--wp--preset--color--brand-100);
  box-shadow: var(--evv-shadow-card);
}
.evv-slider__viewport { position: relative; aspect-ratio: 16 / 9; }
.evv-slider__slide {
  position: absolute; inset: 0;
  opacity: 0;
  transition: opacity .9s ease;
  pointer-events: none;
}
.evv-slider__slide.is-active { opacity: 1; }
.evv-slider__slide img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 0 !important;
  /* Bilder sollen sich nicht anklicken/vergroessern lassen. */
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
}
/* Vor-/Zurueck-Schaltflaechen */
.evv-slider__nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 2.75rem; height: 2.75rem;
  display: flex; align-items: center; justify-content: center;
  border: 0; border-radius: 999px;
  background: rgba(255,255,255,.85);
  color: var(--wp--preset--color--brand-800);
  font-size: 1.35rem; line-height: 1;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(0,0,0,.18);
  transition: background .2s ease;
}
.evv-slider__nav:hover, .evv-slider__nav:focus-visible { background: #fff; }
.evv-slider__nav--prev { left: .75rem; }
.evv-slider__nav--next { right: .75rem; }
/* Punkte */
.evv-slider__dots {
  position: absolute; left: 0; right: 0; bottom: .85rem;
  display: flex; justify-content: center; gap: .45rem;
  padding: 0; margin: 0; list-style: none;
}
.evv-slider__dots li, .evv-prose .evv-slider__dots li { padding: 0; margin: 0; }
.evv-slider__dots li::before, .evv-prose .evv-slider__dots li::before { content: none; }
.evv-slider__dot {
  width: .6rem; height: .6rem; padding: 0;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 999px;
  background: rgba(255,255,255,.35);
  cursor: pointer;
}
.evv-slider__dot.is-active { background: #fff; }
@media (max-width: 600px) {
  .evv-slider__nav { width: 2.25rem; height: 2.25rem; font-size: 1.1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .evv-slider__slide { transition: none; }
}

/* ---------- Video mit Kapitelmarken ---------- */
.evv-video { margin: 2rem 0; }
.evv-video video {
  width: 100%; height: auto; display: block;
  border-radius: 1rem;
  background: #000;
  box-shadow: var(--evv-shadow-card);
}
.evv-video__chapters { margin-top: 1rem; }
.evv-video__chapters-title {
  font-size: .8rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase;
  color: var(--wp--preset--color--muted);
  margin: 0 0 .5rem;
}
.evv-video__list {
  list-style: none; padding: 0; margin: 0;
  display: grid; gap: .5rem;
  grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
  /* Alle Kapitel gleich hoch, auch wenn ein Titel zweizeilig wird. */
  grid-auto-rows: 1fr;
}
.evv-video__list li, .evv-prose .evv-video__list li { padding: 0; margin: 0; }
.evv-video__list li::before, .evv-prose .evv-video__list li::before { content: none; }
.evv-chapter {
  display: flex; align-items: center; gap: .65rem;
  width: 100%; height: 100%; text-align: left;
  padding: .55rem .7rem;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: .65rem;
  background: #fff;
  color: var(--wp--preset--color--ink);
  font: inherit; font-size: .98rem;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}
.evv-chapter:hover, .evv-chapter:focus-visible {
  background: var(--wp--preset--color--brand-50);
  border-color: var(--wp--preset--color--brand-200);
}
.evv-chapter.is-current {
  background: var(--wp--preset--color--brand-50);
  border-color: var(--wp--preset--color--brand-300);
  font-weight: 600;
}
/* Die Zeit sitzt als kleines Schild links, dadurch stehen die Titel
   in einer Flucht und die Kachel wirkt auch zweizeilig ruhig. */
.evv-chapter__time {
  flex: 0 0 auto;
  min-width: 3.3rem;
  padding: .2rem .4rem;
  border-radius: .45rem;
  background: var(--wp--preset--color--brand-50);
  color: var(--wp--preset--color--brand-700);
  font-size: .85rem; font-weight: 700; text-align: center;
  font-variant-numeric: tabular-nums;
  transition: background .15s ease, color .15s ease;
}
.evv-chapter > span + span { line-height: 1.3; }
.evv-chapter:hover .evv-chapter__time,
.evv-chapter:focus-visible .evv-chapter__time { background: var(--wp--preset--color--brand-100); }
.evv-chapter.is-current .evv-chapter__time {
  background: var(--wp--preset--color--brand-600);
  color: #fff;
}
/* Geschwindigkeit: kleine Schalterleiste zwischen Video und Kapiteln */
.evv-video__speed { margin-top: 1rem; }
.evv-video__speed-list { display: flex; flex-wrap: wrap; gap: .5rem; }
.evv-speed {
  min-width: 4.25rem;
  padding: .45rem .8rem;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: .65rem;
  background: #fff;
  color: var(--wp--preset--color--ink);
  font: inherit; font-size: .98rem; font-variant-numeric: tabular-nums;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.evv-speed:hover, .evv-speed:focus-visible {
  background: var(--wp--preset--color--brand-50);
  border-color: var(--wp--preset--color--brand-200);
}
.evv-speed.is-current {
  background: var(--wp--preset--color--brand-600);
  border-color: var(--wp--preset--color--brand-600);
  color: #fff;
  font-weight: 600;
}

/* ---------- Preistabelle ---------- */
.evv-prose .wp-block-table { margin: 1.5rem 0; overflow-x: auto; }
.evv-prose .wp-block-table table {
  border-collapse: collapse;
  width: 100%;
  background: #fff;
  font-size: .98rem;
}
/* Die Preistabelle braucht Platz fuer vier Spalten und darf auf schmalen
   Bildschirmen seitlich scrollen (der Rahmen hat overflow-x: auto). */
.evv-prose .wp-block-table table:has(thead) { min-width: 34rem; }
.evv-prose .wp-block-table th,
.evv-prose .wp-block-table td {
  border: 1px solid rgba(0,0,0,.08);
  padding: .55rem .7rem;
  text-align: right;
}
.evv-prose .wp-block-table th:first-child,
.evv-prose .wp-block-table td:first-child { text-align: left; }
.evv-prose .wp-block-table thead th {
  background: var(--wp--preset--color--brand-50);
  color: var(--wp--preset--color--brand-800);
  font-weight: 700;
}
.evv-prose .wp-block-table tbody td strong { color: var(--wp--preset--color--brand-800); }
.evv-prose .wp-block-table figcaption {
  margin-top: .5rem;
  font-size: .88rem;
  color: var(--wp--preset--color--muted);
  text-align: left;
}

/* ---------- Eingebettetes Fremdvideo (YouTube o.ae.) ---------- */
.evv-embed {
  position: relative;
  aspect-ratio: 16 / 9;
  margin: 2rem 0;
  border-radius: 1rem;
  overflow: hidden;
  background: #000;
  box-shadow: var(--evv-shadow-card);
}
.evv-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ---------- Kleineres Einzelbild im Fliesstext ---------- */
.evv-figure--small { max-width: 20rem; }
.evv-figure--small img { width: 100%; height: auto; }

/* ---------- Aufzaehlungen in Kontaktkarten (z. B. Ausgabestellen) ---------- */
.evv-contact-card .evv-places {
  list-style: none;
  margin: 0;
  padding: 0;
}
.evv-contact-card .evv-places li {
  position: relative;
  padding-left: 1.1rem;
  margin: 0 0 .35rem;
  color: var(--wp--preset--color--ink);
  line-height: 1.45;
}
.evv-contact-card .evv-places li:last-child { margin-bottom: 0; }
.evv-contact-card .evv-places li::before {
  content: "";
  position: absolute; left: 0; top: .6em;
  width: .35rem; height: .35rem;
  border-radius: 999px;
  background: var(--wp--preset--color--brand-500);
}
.evv-contact-card .evv-places strong { color: var(--wp--preset--color--brand-800); }

/* ---------- App-Seite: Handy-Foto und QR-Code ---------- */
.evv-app-download { display: flex; flex-direction: column; align-items: center; gap: 1.25rem; }
.evv-app-shot {
  width: 100%; max-width: 18rem; height: auto; display: block;
  border-radius: 1rem;
  box-shadow: var(--evv-shadow-card);
}
/* Store-Buttons untereinander, QR-Code rechts daneben. */
.evv-app-get {
  display: flex; align-items: stretch; gap: 1.25rem;
  flex-wrap: wrap;
  margin: 1.75rem 0 0;
}
.evv-app-get__stores {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; justify-content: center; gap: .75rem;
}
.evv-app-get__stores li { margin: 0; padding: 0; }
.evv-prose .evv-app-get__stores li::before { content: none; }
.evv-app-get__stores a { display: inline-block; transition: opacity .18s ease; }
.evv-app-get__stores a:hover { opacity: .85; }
.evv-app-get__stores img { display: block; width: 11rem; height: auto; }
.evv-app-get__qr {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem;
  padding: .9rem 1rem;
  background: #fff;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 1rem;
  box-shadow: var(--evv-shadow-card);
  text-decoration: none;
  color: var(--wp--preset--color--brand-700);
  font-weight: 700; font-size: .9rem;
  transition: transform .18s ease, box-shadow .18s ease;
}
.evv-app-get__qr:hover { transform: translateY(-2px); box-shadow: var(--evv-shadow-hover); }
.evv-app-get__qr img { width: 9rem; height: auto; display: block; }

/* Bildunterschrift beim kleinen Einzelbild */
.evv-figure--small figcaption { font-size: .85rem; color: var(--wp--preset--color--muted); margin-top: .5rem; }

/* ---------- Bildergalerie als gleichmaessiges Raster ----------
   Der Core-Galerieblock verteilt die letzte Zeile ueber die volle Breite,
   dadurch werden die letzten Bilder deutlich groesser als die uebrigen.
   Als Raster mit festem Seitenverhaeltnis sind alle Kacheln gleich gross. */
.evv-gallery.has-nested-images {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: .75rem;
}
.evv-gallery.has-nested-images figure.wp-block-image {
  width: auto !important;
  margin: 0 !important;
  flex: none !important;
}
.evv-gallery.has-nested-images figure.wp-block-image img {
  width: 100%; height: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 1rem;
}

/* Foto statt Farbflaeche in den Flyer-Zeilen (z. B. Jubilaeumsseite).
   Festes Seitenverhaeltnis, damit Hoch- und Querformate gleich hoch bleiben. */
.evv-flyer-media { aspect-ratio: 4 / 3; min-height: 0; }
.evv-flyer-media--photo { background: none; padding: 0; overflow: hidden; }
.evv-flyer-media--photo img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  border-radius: 1.25rem;
}

/* ============================================================
   EINWILLIGUNG FUER EXTERNE MEDIEN
   ============================================================ */

/* ---------- Schaltflaechen ---------- */
.evv-btn-consent {
  font: inherit; font-size: .95rem; font-weight: 700;
  padding: .6rem 1.15rem;
  border-radius: 999px;
  border: 1.5px solid var(--wp--preset--color--brand-600);
  background: var(--wp--preset--color--brand-600);
  color: #fff;
  cursor: pointer;
  transition: background .18s ease, color .18s ease;
}
.evv-btn-consent:hover { background: var(--wp--preset--color--brand-700); border-color: var(--wp--preset--color--brand-700); }
.evv-btn-consent--ghost { background: transparent; color: var(--wp--preset--color--brand-700); }
.evv-btn-consent--ghost:hover { background: var(--wp--preset--color--brand-50); color: var(--wp--preset--color--brand-800); }

/* ---------- Einstellungen ---------- */
.evv-cookie-modal { position: fixed; inset: 0; z-index: 210; display: grid; place-items: center; padding: 1.25rem; }
.evv-cookie-modal[hidden] { display: none; }
.evv-cookie-modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.5); }
.evv-cookie-modal__panel {
  position: relative;
  width: min(34rem, 100%);
  max-height: 90vh; overflow-y: auto;
  background: #fff;
  border-radius: 1.25rem;
  padding: 1.75rem;
  box-shadow: 0 24px 50px -20px rgba(30,66,64,.5);
}
.evv-cookie-modal__panel h2 {
  margin: 0 0 .5rem;
  font-size: 1.35rem; font-weight: 800;
  color: var(--wp--preset--color--brand-900);
}
.evv-cookie-modal__panel > p { margin: 0 0 1.25rem; color: var(--wp--preset--color--muted); }
.evv-cookie-modal__close {
  position: absolute; top: .75rem; right: .9rem;
  width: 2rem; height: 2rem;
  border: 0; border-radius: 999px; background: transparent;
  font-size: 1.5rem; line-height: 1; cursor: pointer;
  color: var(--wp--preset--color--muted);
}
.evv-cookie-modal__close:hover { background: var(--wp--preset--color--brand-50); color: var(--wp--preset--color--brand-800); }
.evv-cookie-modal__actions { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: 1.25rem; }
html.evv-cookie-open { overflow: hidden; }

.evv-consent-cat {
  border: 1px solid rgba(0,0,0,.08);
  border-radius: .9rem;
  padding: .9rem 1rem;
  margin-bottom: .75rem;
}
.evv-consent-cat__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .35rem; }
.evv-consent-cat__head strong { color: var(--wp--preset--color--brand-900); }
.evv-consent-cat__fixed { font-size: .82rem; color: var(--wp--preset--color--muted); }
.evv-consent-cat input[type="checkbox"] { width: 1.15rem; height: 1.15rem; accent-color: var(--wp--preset--color--brand-600); cursor: pointer; }
.evv-consent-cat p { margin: 0; font-size: .9rem; color: var(--wp--preset--color--muted); line-height: 1.5; }

/* ---------- Platzhalter statt gesperrter Einbettung ----------
   Der Platzhalter legt sich ueber den Rahmen der Einbettung, damit das
   16:9-Feld nicht zusaetzlich als schwarze Flaeche stehen bleibt. */
.evv-consent-box--blocked { position: relative; min-height: 14rem; }
.evv-consent-box--blocked iframe { display: none !important; }
.evv-consent-note {
  position: absolute; inset: 0;
  display: grid; place-content: center; justify-items: center;
  gap: .5rem; text-align: center;
  padding: 2.5rem 1.5rem;
  background: var(--wp--preset--color--brand-50);
  color: var(--wp--preset--color--ink);
  overflow-y: auto;
}
.evv-consent-note__title { margin: 0; font-weight: 800; color: var(--wp--preset--color--brand-900); }
.evv-consent-note__text { margin: 0; max-width: 34rem; font-size: .93rem; color: var(--wp--preset--color--muted); line-height: 1.5; }
.evv-consent-note__text a { color: var(--wp--preset--color--brand-700); font-weight: 600; }
.evv-consent-note__actions { display: flex; gap: .6rem; flex-wrap: wrap; justify-content: center; margin-top: .35rem; }

/* Rechtliche Links im Fussbereich */
.evv-cookie-link { cursor: pointer; }
.evv-footer-legal {
  list-style: none; margin: 0; padding: 0;
  display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap;
  font-size: .9rem;
}
.evv-footer-legal li { margin: 0; padding: 0; }
.evv-footer-legal li::before { content: none; }

/* Auf dem Handy stehen Copyright und die rechtlichen Links untereinander,
   nicht nebeneinander. */
@media (max-width: 700px) {
  .evv-footer-bottom {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 1rem;
  }
  .evv-footer-legal { flex-direction: column; align-items: flex-start; gap: .6rem; }
}

/* ============================================================
   TEXTLINKS IM INHALT
   Verweise auf andere Seiten stehen im Markenblau und bekommen beim
   Ueberfahren einen Unterstrich. Ausgenommen sind Bausteine mit eigenem
   Aussehen: Buttons, Download-Kacheln, Kopf- und Fussbereich.
   ============================================================ */
.evv-prose a,
.evv-contact-card a,
.evv-content .wp-block-list a,
.evv-flyer-text a,
.evv-value p a {
  color: var(--wp--preset--color--brand-500);
  font-weight: 600;
  text-decoration: none;
  transition: color .15s ease;
}
.evv-prose a:hover, .evv-prose a:focus-visible,
.evv-contact-card a:hover, .evv-contact-card a:focus-visible,
.evv-content .wp-block-list a:hover, .evv-content .wp-block-list a:focus-visible,
.evv-flyer-text a:hover, .evv-flyer-text a:focus-visible,
.evv-value p a:hover, .evv-value p a:focus-visible {
  color: var(--wp--preset--color--brand-600);
  text-decoration: underline;
  text-underline-offset: .18em;
}
/* Bausteine mit eigenem Aussehen behalten ihres. Die Regeln stehen bewusst
   hier unten, damit sie die allgemeine Linkfarbe darueber ueberschreiben. */
.evv-prose .wp-block-button__link,
.evv-prose .evv-btn-consent { font-weight: inherit; }
.evv-prose .evv-download-body a { color: var(--wp--preset--color--brand-900); font-weight: 700; }
.evv-prose .evv-download-body a:hover,
.evv-prose .evv-download-body a:focus-visible { color: var(--wp--preset--color--brand-600); }
.evv-prose .evv-download-cta {
  color: var(--wp--preset--color--brand-600);
  font-weight: 700;
  text-decoration: none;
}
/* Auf der Schaltflaeche wechseln Hintergrund und Schrift gemeinsam,
   sonst stuende blaue Schrift auf blauem Grund. */
.evv-prose .evv-download-cta:hover,
.evv-prose .evv-download-cta:focus-visible {
  background: var(--wp--preset--color--brand-600);
  color: #fff;
  text-decoration: none;
}

/* ============================================================
   FLYERSTIL
   ------------------------------------------------------------
   Die drei grossen Angebotsseiten (Paul-Gerhardt-Haus,
   Begleitetes Wohnen daheim, Internet fuer Senioren) sind wie
   die gedruckten Flyer aufgebaut: Fakten-Leiste, Bild-Text-
   Zeilen im Wechsel und nummerierte Bausteine.
   Die Bausteine stehen bewusst ausserhalb von .evv-prose,
   die Regeln fuer .evv-prose fangen den Fall trotzdem ab.
   ============================================================ */

/* ---------- Nummerierte Bausteine ---------- */
.evv-modules, .evv-prose .evv-modules {
  list-style: none; margin: 1.5rem 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); gap: 1.25rem;
}
/* Vier Bausteine stehen besser als 2x2 als in einer 3+1-Reihe. */
@media (min-width: 782px) {
  .evv-modules--2, .evv-prose .evv-modules--2 { grid-template-columns: repeat(2, 1fr); }
}
.evv-module, .evv-prose .evv-modules .evv-module {
  display: flex; flex-direction: column;
  margin: 0; padding: 1.5rem 1.4rem;
  background: #fff;
  border: 1px solid rgba(0,0,0,.05);
  border-radius: 1.25rem;
  box-shadow: var(--evv-shadow-card);
  transition: transform .2s ease, box-shadow .2s ease;
}
.evv-prose .evv-modules li::before { content: none; }
.evv-module:hover { transform: translateY(-4px); box-shadow: var(--evv-shadow-hover); }
.evv-module__no {
  display: grid; place-items: center;
  width: 2.5rem; height: 2.5rem; border-radius: .9rem;
  background: var(--wp--preset--color--brand-100);
  color: var(--wp--preset--color--brand-700);
  font-size: 1.1rem; font-weight: 800;
}
.evv-module h3, .evv-prose .evv-module h3 {
  margin: 1rem 0 0; font-size: 1.2rem; font-weight: 800; color: var(--wp--preset--color--brand-900);
}
.evv-module__meta {
  margin: .45rem 0 0;
  font-size: .9rem; font-weight: 700; color: var(--wp--preset--color--brand-700);
}
.evv-module p, .evv-prose .evv-module p { margin: .6rem 0 0; color: var(--wp--preset--color--muted); }
.evv-module__more { margin-top: auto; padding-top: 1.1rem; font-weight: 600; }

/* ---------- Hinweiskasten (z. B. Angebote der Partner) ---------- */
.evv-highlight {
  background: var(--wp--preset--color--sand);
  border-radius: 1.25rem;
  padding: 1.75rem 1.75rem 1.5rem;
  margin: 2rem 0 0;
}
.evv-highlight h2, .evv-prose .evv-highlight h2 {
  margin: 0; font-size: 1.35rem; font-weight: 800; color: var(--wp--preset--color--brand-900);
}
.evv-highlight h3, .evv-prose .evv-highlight h3 { margin: 1.25rem 0 .35rem; font-size: 1.05rem; }
.evv-highlight p, .evv-prose .evv-highlight p { margin: .75rem 0 0; color: var(--wp--preset--color--ink); }
.evv-highlight ul, .evv-prose .evv-highlight ul { margin: .9rem 0 0; padding: 0; list-style: none; }
.evv-highlight li, .evv-prose .evv-highlight li {
  margin: 0 0 .55rem; padding: 0 0 0 1.6rem; position: relative;
}
.evv-highlight li::before, .evv-prose .evv-highlight li::before {
  content: "\2192"; position: absolute; left: 0; top: 0;
  color: var(--wp--preset--color--brand-600); font-weight: 800;
}

/* ---------- Preis-Zeile ---------- */
.evv-price {
  display: flex; flex-wrap: wrap; gap: .75rem;
  margin: 1.25rem 0 0; padding: 0; list-style: none;
}
.evv-prose .evv-price li::before { content: none; }
.evv-price li, .evv-prose .evv-price li {
  margin: 0; padding: .85rem 1.25rem;
  background: var(--wp--preset--color--brand-50);
  border-radius: 1rem;
  box-shadow: inset 0 0 0 1px var(--wp--preset--color--brand-100);
}
.evv-price b { display: block; font-size: 1.4rem; font-weight: 800; color: var(--wp--preset--color--brand-700); }
.evv-price span { display: block; font-size: .85rem; color: var(--wp--preset--color--muted); }

/* ---------- Nummerierte Schritte ---------- */
.evv-steps, .evv-prose .evv-steps { list-style: none; margin: 1.5rem 0 0; padding: 0; counter-reset: evv-step; }
.evv-steps li, .evv-prose .evv-steps li {
  position: relative; margin: 0 0 1.25rem; padding: 0 0 0 3.5rem; counter-increment: evv-step;
}
.evv-steps li:last-child { margin-bottom: 0; }
.evv-steps li::before, .evv-prose .evv-steps li::before {
  content: counter(evv-step);
  position: absolute; left: 0; top: 0;
  display: grid; place-items: center;
  width: 2.5rem; height: 2.5rem; border-radius: .9rem;
  background: var(--wp--preset--color--brand-600); color: #fff;
  font-size: 1.05rem; font-weight: 800;
}
.evv-steps strong { display: block; color: var(--wp--preset--color--brand-900); font-size: 1.05rem; }
.evv-steps p, .evv-prose .evv-steps p { margin: .3rem 0 0; color: var(--wp--preset--color--muted); }

/* ---------- Bild-Text-Zeilen: Zusaetze fuer die Angebotsseiten ---------- */
.evv-flyer-kicker {
  margin: 0 0 .5rem;
  font-size: .8rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--wp--preset--color--brand-600);
}
.evv-flyer-text p + p { margin-top: .9rem; }
.evv-flyer-text ul { margin: .9rem 0 0; padding: 0; list-style: none; }
.evv-flyer-text li { position: relative; margin: 0 0 .5rem; padding-left: 1.6rem; color: var(--wp--preset--color--ink); }
.evv-flyer-text li::before {
  content: ""; position: absolute; left: .1rem; top: .62em;
  width: .5rem; height: .5rem; border-radius: 50%;
  background: var(--wp--preset--color--brand-500);
}
/* Fotos in den Zeilen duerfen hoeher werden als die Farbflaechen. */
.evv-flyer-media--photo { aspect-ratio: 3 / 2; }

/* Breite Motive wirken neben dem Text zu klein: Zeile untereinander stapeln,
   das Foto laeuft dann ueber die volle Spaltenbreite. */
.evv-flyer-row--stacked { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
/* Gestapelt steht das Foto immer oben, auch in umgedrehten Zeilen. */
.evv-flyer-row--stacked .evv-flyer-media { order: 0; }
.evv-flyer-row--stacked .evv-flyer-media--photo { aspect-ratio: 16 / 9; }
/* Panoramen (Seitenverhaeltnis rund 2,2:1) laufen ungeschnitten durch. */
.evv-flyer-row--stacked .evv-flyer-media--wide { aspect-ratio: 20 / 9; }

/* Fakten-Leiste: Luft nach oben und unten, und schmal genug, dass auch
   vier Fakten nebeneinander in die Inhaltsspalte passen. */
.evv-facts { margin: 2rem 0; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); }

@media (max-width: 781px) {
  .evv-highlight { padding: 1.4rem 1.25rem 1.25rem; }
  .evv-steps li, .evv-prose .evv-steps li { padding-left: 3.1rem; }
}

/* ============================================================
   FESTSCHRIFT-KACHELN (Paul-Gerhardt-Haus)
   ------------------------------------------------------------
   Nachbau der Innenseite der Festschrift zum 50-jaehrigen
   Bestehen: hellblauer Papiergrund, darauf je Thema ein blauer
   Textbalken mit dunkelblauer Versalien-Ueberschrift und weissem
   Text. Das Foto steht rechts daneben und ragt unten aus dem
   Balken heraus. Scharfe Kanten, kein Schatten, wie im Druck.
   ============================================================ */

:root {
  --evv-flyer-blue: #5ec4ec;   /* Balkenfarbe aus dem Druck */
  --evv-flyer-paper: #dcefFB;  /* heller Papiergrund der Innenseite */
  --evv-flyer-ink: #004494;    /* Ueberschriftenblau aus dem Druck */
}

.evv-tiles-panel {
  background: var(--evv-flyer-paper);
  border-radius: 1.5rem;
  padding: 2rem 1.75rem 2.25rem;
  margin: 1.75rem 0 0;
}

.evv-tiles, .evv-prose .evv-tiles {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: 1.5rem;
}
.evv-tile, .evv-prose .evv-tiles .evv-tile {
  display: flex; flex-direction: column;
  margin: 0; padding: 0;
}
.evv-prose .evv-tiles li::before { content: none; }

/* Das Foto steht frei auf dem hellblauen Papiergrund ueber dem Balken. */
.evv-tile__photo {
  display: block;
  width: 100%; height: 11.5rem;
  object-fit: contain; object-position: center bottom;
}
/* Rechteckige Aufnahmen fuellen die Kachelbreite, Freisteller stehen frei.
   Der Bildausschnitt sitzt etwas hoeher, damit Gesichter im Bild bleiben. */
.evv-tile__photo--full { object-fit: cover; object-position: 50% 28%; }

.evv-tile__band {
  flex: 1 1 auto;
  background: var(--evv-flyer-blue);
  padding: 1rem 1.15rem 1.2rem;
}
.evv-tile h3, .evv-prose .evv-tile h3 {
  margin: 0 0 .5rem;
  font-size: 1.05rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase;
  color: var(--evv-flyer-ink);
}
.evv-tile p, .evv-prose .evv-tile p {
  margin: 0;
  font-size: .95rem; line-height: 1.55; color: #fff;
}
.evv-tile strong { color: #fff; }

/* ---------- Grosses Zitat aus der Festschrift ---------- */
.evv-pullquote {
  margin: 2.5rem 0 0;
  border: 0; border-left: 5px solid var(--evv-flyer-blue);
  background: none;
  padding: .25rem 0 .25rem 1.75rem;
  font-size: clamp(1.25rem, 2.4vw, 1.65rem);
  font-weight: 800; line-height: 1.35;
  color: var(--wp--preset--color--brand-800);
}
.evv-pullquote p { margin: 0; font-size: inherit; color: inherit; }
.evv-pullquote cite {
  display: block; margin-top: .75rem;
  font-size: .95rem; font-weight: 600; font-style: normal;
  color: var(--wp--preset--color--muted);
}

/* ---------- Grussworte mit Portraet ---------- */
.evv-voices { display: grid; grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); gap: 1.5rem; margin: 1.75rem 0 0; }
.evv-voice {
  background: #fff;
  border: 1px solid rgba(0,0,0,.05);
  border-radius: 1.25rem;
  padding: 1.6rem 1.5rem;
  box-shadow: var(--evv-shadow-card);
}
.evv-voice__head { display: flex; align-items: center; gap: .9rem; margin-bottom: 1rem; }
.evv-voice__head img { width: 3.5rem; height: 3.5rem; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.evv-voice__name { margin: 0; font-weight: 800; color: var(--wp--preset--color--brand-900); line-height: 1.3; }
.evv-voice__role { margin: .15rem 0 0; font-size: .88rem; color: var(--wp--preset--color--muted); line-height: 1.35; }
.evv-voice p + p { margin-top: .8rem; }
.evv-voice p { color: var(--wp--preset--color--ink); }

/* ---------- Bildnachweis ---------- */
.evv-credit { margin: 1.5rem 0 0; font-size: .85rem; color: var(--wp--preset--color--muted); }

@media (max-width: 781px) {
  .evv-tiles-panel { padding: 1.25rem 1.15rem 1.5rem; border-radius: 1.25rem; }
  .evv-tile__photo { height: 10.5rem; }
  .evv-pullquote { padding-left: 1.15rem; }
  .evv-voice { padding: 1.25rem 1.15rem; }
}

/* Fakten-Leiste als erstes Element unter dem Seiten-Hero: kein Doppelabstand. */
.evv-facts--top { margin-top: 0; }
