Konsolidierung von Plugin und Theme: Alle Dateien in juconnect-strict-theme-v3/juconnect-strict/ wurden in juconnect-strict-theme-v3/ verschoben. Das Plugin juconnect.zip wurde entfernt, da die Funktionen jetzt im Theme integriert sind. Alle Verweise auf das Plugin wurden ebenfalls aus dem Code entfernt.

2026-03-12 20:15:17 +01:00
5 changed files with 677 additions and 2 deletions
--- a/assets/img/juconnect.zip
+++ b/assets/img/juconnect.zip
--- a/juconnect-strict-theme-v3/juconnect-strict.zip
+++ b/juconnect-strict-theme-v3/juconnect-strict.zip
--- a/juconnect-strict-theme-v3/juconnect-strict/functions.php
+++ b/juconnect-strict-theme-v3/juconnect-strict/functions.php
@@ -1,10 +1,13 @@
 <?php
 if (!defined('ABSPATH')) exit;

+require_once get_template_directory() . '/inc/block-patterns.php';
+
 function juconnect_setup() {
  add_theme_support('title-tag');
  add_theme_support('post-thumbnails');
  add_theme_support('site-icon');
+  add_theme_support('editor-styles');
  add_theme_support('custom-logo', [
    'height' => 120,
    'width'  => 120,
@@ -16,6 +19,8 @@ function juconnect_setup() {
    'primary' => __('Primary Navigation', 'juconnect'),
    'footer'  => __('Footer Navigation', 'juconnect'),
  ]);
+
+  add_editor_style('style.css');
 }
 add_action('after_setup_theme', 'juconnect_setup');

@@ -356,3 +361,4 @@ function juconnect_nav_menu_submenu_class($classes, $args, $depth){
  return $classes;
 }
 add_filter('nav_menu_submenu_css_class', 'juconnect_nav_menu_submenu_class', 10, 3);
+
--- a/juconnect-strict-theme-v3/juconnect-strict/inc/block-patterns.php
+++ b/juconnect-strict-theme-v3/juconnect-strict/inc/block-patterns.php
@@ -0,0 +1,668 @@
+<?php
+if (!defined('ABSPATH')) exit;
+
+add_action('init', function () {
+  if (!function_exists('register_block_pattern')) return;
+
+  register_block_pattern_category('juconnect', [
+    'label' => __('JuConnect', 'juconnect'),
+  ]);
+
+  register_block_pattern('juconnect/hero-pagehead', [
+    'title'       => __('Hero (Styleguide)', 'juconnect'),
+    'categories'  => ['juconnect'],
+    'description' => __('Hero wie im lokalen Styleguide (einspaltig).', 'juconnect'),
+    'content'     => <<<HTML
+<!-- wp:group {"className":"hero"} -->
+<div class="wp-block-group hero"><!-- wp:group {"className":"hero__inner"} -->
+<div class="wp-block-group hero__inner"><!-- wp:heading {"level":1,"className":"h1"} -->
+<h1 class="h1">Hilfen zur Erziehung - strukturiert und verlaesslich</h1>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"lead"} -->
+<p class="lead">Informationen fuer oeffentliche Traeger und Kooperationspartner.</p>
+<!-- /wp:paragraph -->
+
+<!-- wp:buttons {"className":"row wrap"} -->
+<div class="wp-block-buttons row wrap"><!-- wp:button {"className":"btn--primary"} -->
+<div class="wp-block-button btn--primary"><a class="wp-block-button__link wp-element-button" href="#kontakt">Kontakt</a></div>
+<!-- /wp:button -->
+
+<!-- wp:button {"className":"btn--secondary"} -->
+<div class="wp-block-button btn--secondary"><a class="wp-block-button__link wp-element-button" href="#leistungen">Leistungen</a></div>
+<!-- /wp:button --></div>
+<!-- /wp:buttons --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+HTML
+  ]);
+
+  register_block_pattern('juconnect/section-grid-3', [
+    'title'      => __('Section + 3 Cards', 'juconnect'),
+    'categories' => ['juconnect'],
+    'content'    => <<<HTML
+<!-- wp:group {"className":"section"} -->
+<div class="wp-block-group section"><!-- wp:group {"className":"section__head"} -->
+<div class="wp-block-group section__head"><!-- wp:heading {"level":2,"className":"h2"} -->
+<h2 class="h2">Leistungen</h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Kurz erklaert - Details findest du auf den Unterseiten.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"grid grid--3"} -->
+<div class="wp-block-group grid grid--3"><!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">Card 1</h4>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Kurzbeschreibung.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">Card 2</h4>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Kurzbeschreibung.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">Card 3</h4>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Kurzbeschreibung.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+HTML
+  ]);
+
+  register_block_pattern('juconnect/steps-4', [
+    'title'      => __('Ablauf (4 Steps)', 'juconnect'),
+    'categories' => ['juconnect'],
+    'content'    => <<<HTML
+<!-- wp:group {"className":"section"} -->
+<div class="wp-block-group section"><!-- wp:group {"className":"section__head"} -->
+<div class="wp-block-group section__head"><!-- wp:heading {"level":2,"className":"h2"} -->
+<h2 class="h2">So laeuft's ab</h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Transparent und nachvollziehbar.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"grid grid--4"} -->
+<div class="wp-block-group grid grid--4">
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">1. Anfrage</h4>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Kontakt aufnehmen, kurz klaeren.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">2. Erstgespraech</h4>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Ziele, Rahmen, Erwartungen.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">3. Start</h4>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Plan + regelmaessige Termine.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">4. Review</h4>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Fortschritt messen, nachsteuern.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+</div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+HTML
+  ]);
+
+  register_block_pattern('juconnect/steps-4-with-graphic-right', [
+    'title'      => __('Ablauf (4 Steps) + Grafik rechts', 'juconnect'),
+    'categories' => ['juconnect'],
+    'content'    => <<<HTML
+<!-- wp:group {"className":"section"} -->
+<div class="wp-block-group section"><!-- wp:group {"className":"section__head"} -->
+<div class="wp-block-group section__head"><!-- wp:heading {"level":2,"className":"h2"} -->
+<h2 class="h2">So laeuft's ab</h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Transparent und nachvollziehbar.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"grid grid--2"} -->
+<div class="wp-block-group grid grid--2"><!-- wp:group -->
+<div class="wp-block-group"><!-- wp:group {"className":"grid grid--4"} -->
+<div class="wp-block-group grid grid--4">
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">1. Anfrage</h4>
+<!-- /wp:heading -->
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Kontakt aufnehmen, kurz klaeren.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">2. Erstgespraech</h4>
+<!-- /wp:heading -->
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Ziele, Rahmen, Erwartungen.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">3. Start</h4>
+<!-- /wp:heading -->
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Plan + regelmaessige Termine.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">4. Review</h4>
+<!-- /wp:heading -->
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Fortschritt messen, nachsteuern.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+</div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:image {"sizeSlug":"large","linkDestination":"none","className":"img img--rounded"} -->
+<figure class="wp-block-image size-large img img--rounded"><img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='500'%3E%3Crect width='100%25' height='100%25' fill='%23eef1f3'/%3E%3Ctext x='50%25' y='50%25' dominant-baseline='middle' text-anchor='middle' fill='%23607384' font-family='Arial' font-size='28'%3EGrafik ersetzen%3C/text%3E%3C/svg%3E" alt=""/></figure>
+<!-- /wp:image -->
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Rechts: Grafik oder Bild.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+HTML
+  ]);
+
+  register_block_pattern('juconnect/steps-4-with-graphic-left', [
+    'title'      => __('Ablauf (4 Steps) + Grafik links', 'juconnect'),
+    'categories' => ['juconnect'],
+    'content'    => <<<HTML
+<!-- wp:group {"className":"section"} -->
+<div class="wp-block-group section"><!-- wp:group {"className":"section__head"} -->
+<div class="wp-block-group section__head"><!-- wp:heading {"level":2,"className":"h2"} -->
+<h2 class="h2">So laeuft's ab</h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Transparent und nachvollziehbar.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"grid grid--2"} -->
+<div class="wp-block-group grid grid--2"><!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:image {"sizeSlug":"large","linkDestination":"none","className":"img img--rounded"} -->
+<figure class="wp-block-image size-large img img--rounded"><img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='500'%3E%3Crect width='100%25' height='100%25' fill='%23eef1f3'/%3E%3Ctext x='50%25' y='50%25' dominant-baseline='middle' text-anchor='middle' fill='%23607384' font-family='Arial' font-size='28'%3EGrafik ersetzen%3C/text%3E%3C/svg%3E" alt=""/></figure>
+<!-- /wp:image -->
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Links: Grafik oder Bild.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group -->
+<div class="wp-block-group"><!-- wp:group {"className":"grid grid--4"} -->
+<div class="wp-block-group grid grid--4">
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">1. Anfrage</h4>
+<!-- /wp:heading -->
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Kontakt aufnehmen, kurz klaeren.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">2. Erstgespraech</h4>
+<!-- /wp:heading -->
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Ziele, Rahmen, Erwartungen.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">3. Start</h4>
+<!-- /wp:heading -->
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Plan + regelmaessige Termine.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":4,"className":"h4"} -->
+<h4 class="h4">4. Review</h4>
+<!-- /wp:heading -->
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Fortschritt messen, nachsteuern.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+</div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+HTML
+  ]);
+
+  register_block_pattern('juconnect/single-card-with-graphic-right', [
+    'title'       => __('Info Card + Grafik rechts', 'juconnect'),
+    'categories'  => ['juconnect'],
+    'description' => __('Zweispaltig: links eine einzelne Inhaltskarte, rechts Bild/Grafik.', 'juconnect'),
+    'content'     => <<<HTML
+<!-- wp:group {"className":"section"} -->
+<div class="wp-block-group section"><!-- wp:group {"className":"section__head"} -->
+<div class="wp-block-group section__head"><!-- wp:heading {"level":2,"className":"h2"} -->
+<h2 class="h2">Leistung im Ueberblick</h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Kerninformationen klar und ruhig dargestellt.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"grid grid--2"} -->
+<div class="wp-block-group grid grid--2"><!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":3,"className":"h3"} -->
+<h3 class="h3">Wann ist dieses Angebot passend?</h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Fuer Traeger mit klaren Zielen, transparenten Ablaeufen und verbindlicher Kommunikation.</p>
+<!-- /wp:paragraph -->
+
+<!-- wp:list {"className":"list"} -->
+<ul class="list"><li>klare Zustaendigkeiten</li><li>regelmaessige Rueckmeldungen</li><li>dokumentierte Entwicklung</li></ul>
+<!-- /wp:list -->
+
+<!-- wp:buttons {"className":"row wrap"} -->
+<div class="wp-block-buttons row wrap"><!-- wp:button {"className":"btn--primary"} -->
+<div class="wp-block-button btn--primary"><a class="wp-block-button__link wp-element-button" href="#kontakt">Kontakt aufnehmen</a></div>
+<!-- /wp:button -->
+
+<!-- wp:button {"className":"btn--secondary"} -->
+<div class="wp-block-button btn--secondary"><a class="wp-block-button__link wp-element-button" href="#details">Mehr Details</a></div>
+<!-- /wp:button --></div>
+<!-- /wp:buttons --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:image {"sizeSlug":"large","linkDestination":"none","className":"img img--rounded"} -->
+<figure class="wp-block-image size-large img img--rounded"><img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='560'%3E%3Crect width='100%25' height='100%25' fill='%23eef1f3'/%3E%3Ctext x='50%25' y='50%25' dominant-baseline='middle' text-anchor='middle' fill='%23607384' font-family='Arial' font-size='28'%3EGrafik ersetzen%3C/text%3E%3C/svg%3E" alt=""/></figure>
+<!-- /wp:image -->
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Rechts: Illustration oder Projektfoto.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+HTML
+  ]);
+
+  register_block_pattern('juconnect/single-card-with-graphic-left', [
+    'title'       => __('Grafik links + Info Card', 'juconnect'),
+    'categories'  => ['juconnect'],
+    'description' => __('Zweispaltig: links Bild/Grafik, rechts eine einzelne Inhaltskarte.', 'juconnect'),
+    'content'     => <<<HTML
+<!-- wp:group {"className":"section"} -->
+<div class="wp-block-group section"><!-- wp:group {"className":"section__head"} -->
+<div class="wp-block-group section__head"><!-- wp:heading {"level":2,"className":"h2"} -->
+<h2 class="h2">Leistung im Ueberblick</h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Kerninformationen klar und ruhig dargestellt.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"grid grid--2"} -->
+<div class="wp-block-group grid grid--2"><!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:image {"sizeSlug":"large","linkDestination":"none","className":"img img--rounded"} -->
+<figure class="wp-block-image size-large img img--rounded"><img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='560'%3E%3Crect width='100%25' height='100%25' fill='%23eef1f3'/%3E%3Ctext x='50%25' y='50%25' dominant-baseline='middle' text-anchor='middle' fill='%23607384' font-family='Arial' font-size='28'%3EGrafik ersetzen%3C/text%3E%3C/svg%3E" alt=""/></figure>
+<!-- /wp:image -->
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Links: Illustration oder Projektfoto.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":3,"className":"h3"} -->
+<h3 class="h3">Wann ist dieses Angebot passend?</h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Fuer Traeger mit klaren Zielen, transparenten Ablaeufen und verbindlicher Kommunikation.</p>
+<!-- /wp:paragraph -->
+
+<!-- wp:list {"className":"list"} -->
+<ul class="list"><li>klare Zustaendigkeiten</li><li>regelmaessige Rueckmeldungen</li><li>dokumentierte Entwicklung</li></ul>
+<!-- /wp:list -->
+
+<!-- wp:buttons {"className":"row wrap"} -->
+<div class="wp-block-buttons row wrap"><!-- wp:button {"className":"btn--primary"} -->
+<div class="wp-block-button btn--primary"><a class="wp-block-button__link wp-element-button" href="#kontakt">Kontakt aufnehmen</a></div>
+<!-- /wp:button -->
+
+<!-- wp:button {"className":"btn--secondary"} -->
+<div class="wp-block-button btn--secondary"><a class="wp-block-button__link wp-element-button" href="#details">Mehr Details</a></div>
+<!-- /wp:button --></div>
+<!-- /wp:buttons --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+HTML
+  ]);
+
+  register_block_pattern('juconnect/section-grid-2', [
+    'title'       => __('Section + 2 Cards', 'juconnect'),
+    'categories'  => ['juconnect'],
+    'description' => __('Standard-Zweispalter fuer Inhalte oder Angebotskarten.', 'juconnect'),
+    'content'     => <<<HTML
+<!-- wp:group {"className":"section"} -->
+<div class="wp-block-group section"><!-- wp:group {"className":"section__head"} -->
+<div class="wp-block-group section__head"><!-- wp:heading {"level":2,"className":"h2"} -->
+<h2 class="h2">Schwerpunkte</h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Zwei zentrale Themen kompakt nebeneinander.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"grid grid--2"} -->
+<div class="wp-block-group grid grid--2"><!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":3,"className":"h3"} -->
+<h3 class="h3">Begleitung</h3>
+<!-- /wp:heading -->
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Verlaessliche Begleitung mit klarer Struktur fuer alle Beteiligten.</p>
+<!-- /wp:paragraph -->
+<!-- wp:paragraph -->
+<p><a class="link" href="#!">Mehr erfahren</a></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":3,"className":"h3"} -->
+<h3 class="h3">Koordination</h3>
+<!-- /wp:heading -->
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Abgestimmte Kommunikation zwischen Traegern, Familien und Fachkraeften.</p>
+<!-- /wp:paragraph -->
+<!-- wp:paragraph -->
+<p><a class="link" href="#!">Mehr erfahren</a></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+HTML
+  ]);
+
+  register_block_pattern('juconnect/kpi-overview-3', [
+    'title'       => __('KPI Ueberblick (3 Karten)', 'juconnect'),
+    'categories'  => ['juconnect'],
+    'description' => __('Drei Kennzahlenkarten fuer Verlaesslichkeit, Bearbeitungszeit und Reichweite.', 'juconnect'),
+    'content'     => <<<HTML
+<!-- wp:group {"className":"section"} -->
+<div class="wp-block-group section"><!-- wp:group {"className":"section__head"} -->
+<div class="wp-block-group section__head"><!-- wp:heading {"level":2,"className":"h2"} -->
+<h2 class="h2">Fakten im Ueberblick</h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Beispielwerte fuer eine transparente Darstellung.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"grid grid--3"} -->
+<div class="wp-block-group grid grid--3"><!-- wp:group {"className":"card card--tight"} -->
+<div class="wp-block-group card card--tight"><!-- wp:group {"className":"kpi"} -->
+<div class="wp-block-group kpi"><!-- wp:paragraph {"className":"kpi__label"} -->
+<p class="kpi__label">Antwortzeit</p>
+<!-- /wp:paragraph -->
+<!-- wp:paragraph {"className":"kpi__value"} -->
+<p class="kpi__value">&lt; 48h</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--tight"} -->
+<div class="wp-block-group card card--tight"><!-- wp:group {"className":"kpi"} -->
+<div class="wp-block-group kpi"><!-- wp:paragraph {"className":"kpi__label"} -->
+<p class="kpi__label">Abgestimmte Plaene</p>
+<!-- /wp:paragraph -->
+<!-- wp:paragraph {"className":"kpi__value"} -->
+<p class="kpi__value">95%</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--tight"} -->
+<div class="wp-block-group card card--tight"><!-- wp:group {"className":"kpi"} -->
+<div class="wp-block-group kpi"><!-- wp:paragraph {"className":"kpi__label"} -->
+<p class="kpi__label">Kooperationspartner</p>
+<!-- /wp:paragraph -->
+<!-- wp:paragraph {"className":"kpi__value"} -->
+<p class="kpi__value">24</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+HTML
+  ]);
+
+  register_block_pattern('juconnect/contact-cta-split', [
+    'title'       => __('Kontakt CTA (Split)', 'juconnect'),
+    'categories'  => ['juconnect'],
+    'description' => __('Linke Infokarte mit Aktionen, rechte Karte mit Kontaktfakten.', 'juconnect'),
+    'content'     => <<<HTML
+<!-- wp:group {"className":"section"} -->
+<div class="wp-block-group section"><!-- wp:group {"className":"grid grid--2"} -->
+<div class="wp-block-group grid grid--2"><!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:paragraph {"className":"badge badge--info"} -->
+<p class="badge badge--info">Naechster Schritt</p>
+<!-- /wp:paragraph -->
+
+<!-- wp:heading {"level":2,"className":"h2"} -->
+<h2 class="h2">Unverbindlich Kontakt aufnehmen</h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Wir melden uns zeitnah und klaeren den passenden Rahmen fuer Ihr Anliegen.</p>
+<!-- /wp:paragraph -->
+
+<!-- wp:buttons {"className":"row wrap"} -->
+<div class="wp-block-buttons row wrap"><!-- wp:button {"className":"btn--primary"} -->
+<div class="wp-block-button btn--primary"><a class="wp-block-button__link wp-element-button" href="#kontakt">Anfrage senden</a></div>
+<!-- /wp:button -->
+
+<!-- wp:button {"className":"btn--ghost"} -->
+<div class="wp-block-button btn--ghost"><a class="wp-block-button__link wp-element-button" href="#telefon">Telefonisch sprechen</a></div>
+<!-- /wp:button --></div>
+<!-- /wp:buttons --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad"} -->
+<div class="wp-block-group card card--pad"><!-- wp:heading {"level":3,"className":"h3"} -->
+<h3 class="h3">Kontaktzeiten</h3>
+<!-- /wp:heading -->
+
+<!-- wp:group {"className":"kpi"} -->
+<div class="wp-block-group kpi"><!-- wp:paragraph {"className":"kpi__label"} -->
+<p class="kpi__label">Mo - Fr</p>
+<!-- /wp:paragraph -->
+<!-- wp:paragraph {"className":"kpi__value"} -->
+<p class="kpi__value">08:00 - 17:00</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"kpi"} -->
+<div class="wp-block-group kpi"><!-- wp:paragraph {"className":"kpi__label"} -->
+<p class="kpi__label">E-Mail</p>
+<!-- /wp:paragraph -->
+<!-- wp:paragraph {"className":"kpi__value"} -->
+<p class="kpi__value">kontakt@juconnect.de</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"callout callout--info"} -->
+<div class="wp-block-group callout callout--info"><!-- wp:paragraph {"className":"callout__title"} -->
+<p class="callout__title">Hinweis</p>
+<!-- /wp:paragraph -->
+<!-- wp:paragraph {"className":"callout__text"} -->
+<p class="callout__text">Bitte Anlass und Rueckrufzeit kurz angeben.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+HTML
+  ]);
+
+  register_block_pattern('juconnect/downloads-table', [
+    'title'       => __('Downloads (Tabelle)', 'juconnect'),
+    'categories'  => ['juconnect'],
+    'description' => __('Downloadbereich mit Tabelle im Styleguide-Look.', 'juconnect'),
+    'content'     => <<<HTML
+<!-- wp:group {"className":"section"} -->
+<div class="wp-block-group section"><!-- wp:group {"className":"section__head"} -->
+<div class="wp-block-group section__head"><!-- wp:heading {"level":2,"className":"h2"} -->
+<h2 class="h2">Downloads</h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Dokumente, Vorlagen und Nachweise auf einen Blick.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"card card--pad layout__table"} -->
+<div class="wp-block-group card card--pad layout__table"><!-- wp:html -->
+<div class="tablewrap">
+  <table class="table">
+    <thead>
+      <tr><th>Dokument</th><th>Status</th><th>Aktion</th></tr>
+    </thead>
+    <tbody>
+      <tr><td>Leistungsbeschreibung</td><td><span class="badge badge--info">Entwurf</span></td><td><a class="link" href="#!">Oeffnen</a></td></tr>
+      <tr><td>Datenschutz</td><td><span class="badge badge--success">Final</span></td><td><a class="link" href="#!">Oeffnen</a></td></tr>
+      <tr><td>Ansprechpartner</td><td><span class="badge badge--warn">Update</span></td><td><a class="link" href="#!">Oeffnen</a></td></tr>
+    </tbody>
+  </table>
+</div>
+<!-- /wp:html --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+HTML
+  ]);
+
+  register_block_pattern('juconnect/process-flow-flex', [
+    'title'       => __('Prozessablauf (flexibel, horizontal)', 'juconnect'),
+    'categories'  => ['juconnect'],
+    'description' => __('Flexibler Ablauf mit einzeln bearbeitbaren Schritten. Schritte einfach duplizieren, verschieben oder entfernen.', 'juconnect'),
+    'content'     => <<<HTML
+<!-- wp:group {"className":"section ju-process-flow"} -->
+<div class="wp-block-group section ju-process-flow"><!-- wp:group {"className":"section__head"} -->
+<div class="wp-block-group section__head"><!-- wp:heading {"level":2,"className":"h2"} -->
+<h2 class="h2">So laeuft die Zusammenarbeit ab</h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Jeder Schritt ist ein einzelner Block und kann beliebig angepasst, dupliziert oder entfernt werden.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"ju-process-flow__steps"} -->
+<div class="wp-block-group ju-process-flow__steps"><!-- wp:group {"className":"ju-process-step"} -->
+<div class="wp-block-group ju-process-step"><!-- wp:group {"className":"ju-process-step__head"} -->
+<div class="wp-block-group ju-process-step__head"><!-- wp:paragraph {"className":"ju-process-step__label"} -->
+<p class="ju-process-step__label">Anfrage</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"ju-process-step__body card"} -->
+<div class="wp-block-group ju-process-step__body card"><!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Kontakt aufnehmen, Anlass schildern und den Rahmen fuer die Begleitung klaeren.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"ju-process-step"} -->
+<div class="wp-block-group ju-process-step"><!-- wp:group {"className":"ju-process-step__head"} -->
+<div class="wp-block-group ju-process-step__head"><!-- wp:paragraph {"className":"ju-process-step__label"} -->
+<p class="ju-process-step__label">Abstimmung</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"ju-process-step__body card"} -->
+<div class="wp-block-group ju-process-step__body card"><!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Ziele, Rollen und Kommunikationswege gemeinsam festlegen.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"ju-process-step"} -->
+<div class="wp-block-group ju-process-step"><!-- wp:group {"className":"ju-process-step__head"} -->
+<div class="wp-block-group ju-process-step__head"><!-- wp:paragraph {"className":"ju-process-step__label"} -->
+<p class="ju-process-step__label">Umsetzung</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"className":"ju-process-step__body card"} -->
+<div class="wp-block-group ju-process-step__body card"><!-- wp:paragraph {"className":"muted"} -->
+<p class="muted">Begleitung starten, Fortschritt transparent dokumentieren und regelmaessig nachsteuern.</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->
+HTML
+  ]);
+});
+
--- a/juconnect-strict-theme-v3/juconnect-strict/style.css
+++ b/juconnect-strict-theme-v3/juconnect-strict/style.css
@@ -1,8 +1,8 @@
 /*
 Theme Name: JuConnect (Strict Styleguide)
 Author: Sven Steinert
-Description: WordPress Theme basierend auf dem JuConnect Styleguide v0.2 (Markup & Tokens 1:1 übernommen).
-Version: 0.3.0
+Description: WordPress Theme basierend auf dem JuConnect Styleguide v0.2 mit integrierten Gutenberg-Patterns.
+Version: 0.4.0
 Text Domain: juconnect.de
 */

@@ -1481,3 +1481,4 @@ a{ color: inherit; }
    min-width: 0;
  }
 }
+