diff --git a/app/components/banner-slider.php b/app/components/banner-slider.php
index 5197f52..ad1963a 100644
--- a/app/components/banner-slider.php
+++ b/app/components/banner-slider.php
@@ -7,7 +7,9 @@ declare(strict_types=1);
* Layout je Slide: 2/3 Titel + Text + CTA, 1/3 Firmenlogo.
* Pro Slide optional: "variant" (CSS-Modifier, z. B. "house" für Eigenwerbung),
* "tag" (Badge-Text, Default "Anzeige"), "background" (Bild), "cta.internal"
- * (interner Link ohne target=_blank/rel=sponsored, für eigene Seiten/Anker).
+ * (interner Link ohne target=_blank/rel=sponsored, für eigene Seiten/Anker),
+ * "cta_secondary" (zweiter Button als Outline), "logo_light" (helle Logo-Platte
+ * für dunkle Firmenlogos).
* Auto-Rotation + Fortschritts-Indikatoren übernimmt assets/js/banner.js
* (pausiert bei Hover/Fokus, respektiert prefers-reduced-motion).
* Ohne JS: nur der erste Banner ist sichtbar (Graceful Degradation).
@@ -40,12 +42,29 @@ $total = count($banners);
= e($banner['tag'] ?? 'Anzeige') ?>
+
+
+
-
+
diff --git a/data/banners.json b/data/banners.json
index 01a9f3d..4f588de 100644
--- a/data/banners.json
+++ b/data/banners.json
@@ -11,6 +11,16 @@
"logo": "img/logo.svg",
"background": "img/pages/fussball-hero-1600.jpg",
"cta": { "label": "Werbepartner werden", "url": "#kontakt", "internal": true }
+ },
+ {
+ "company": "Breadcrumb Solutions GmbH",
+ "title": "Software für den Mittelstand",
+ "text": "Beratung, Software & Implementierung aus einer Hand. Wir entwickeln Intranets, Kundenportale, Apps und Individualsoftware – inklusive Einführung, sodass sie im Alltag tatsächlich ankommt.",
+ "logo": "img/banners/breadcrumb-solutions.svg",
+ "logo_light": true,
+ "background": "img/banners/breadcrumb-hero-1600.jpg",
+ "cta": { "label": "Lösungen entdecken", "url": "https://www.breadcrumb-solutions.de/bc/de/loesungen/" },
+ "cta_secondary": { "label": "Über uns", "url": "https://www.breadcrumb-solutions.de/bc/de/unternehmen/ueber-uns/" }
}
]
}
diff --git a/public/assets/css/components.css b/public/assets/css/components.css
index a7ab7e0..e824009 100644
--- a/public/assets/css/components.css
+++ b/public/assets/css/components.css
@@ -1021,6 +1021,13 @@
color: var(--clr-text-muted);
}
+/* CTA-Reihe: Primär- + optionaler Outline-Sekundär-Button nebeneinander. */
+.ad-banner__actions {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 0.75rem;
+}
+
.ad-banner__logo {
display: grid;
place-items: center;
@@ -1031,6 +1038,14 @@
border-radius: var(--radius-card);
}
+/* Helle Platte für dunkle Firmenlogos (Wortmarken). Überschreibt auch die
+ dunkle Logo-Box der Foto-Variante (gleiche Spezifität, später im File). */
+.ad-banner__logo.ad-banner__logo--light {
+ background: #fff;
+ border-color: rgb(255 255 255 / 0.55);
+ backdrop-filter: none;
+}
+
.ad-banner__logo img {
width: auto;
max-width: 100%;
@@ -2238,27 +2253,29 @@
.department-choice__card {
display: flex;
flex-direction: column;
- gap: 0.5rem;
+ gap: 0.35rem;
height: 100%;
- padding: clamp(1.5rem, 1rem + 2vw, 2.25rem);
+ padding: clamp(1.75rem, 1.25rem + 2vw, 2.75rem);
background: var(--clr-glass-bg);
border: 1px solid var(--clr-glass-border);
border-radius: var(--radius-card);
}
-.department-choice__kicker {
- font-size: var(--fs-400);
+.department-choice__heading {
+ font-size: var(--fs-700);
+ line-height: var(--lh-heading);
+ color: var(--clr-text);
+}
+
+.department-choice__subtitle {
+ font-size: var(--fs-500);
text-transform: uppercase;
- letter-spacing: 0.08em;
+ letter-spacing: 0.1em;
color: var(--clr-accent);
}
-.department-choice__heading {
- font-size: var(--fs-650);
- line-height: var(--lh-heading);
-}
-
.department-choice__text {
+ margin-top: 0.65rem;
color: var(--clr-text-muted);
}
@@ -2283,7 +2300,7 @@
}
.fee-table__title {
- font-size: var(--fs-600);
+ font-size: var(--fs-650);
line-height: var(--lh-heading);
margin-bottom: 1rem;
}
@@ -2324,40 +2341,34 @@
color: var(--clr-text-muted);
}
-.fee-table-grid {
- display: grid;
- gap: 1.5rem;
- margin-top: 2rem;
-}
-
-@media (min-width: 768px) {
- .fee-table-grid {
- grid-template-columns: repeat(2, minmax(0, 1fr));
- align-items: start;
- }
-}
-
/* === membership (Mitglied werden) === */
-.membership-info__inner {
- max-width: 70ch;
-}
-
-.membership-info__inner p {
- margin-top: 1rem;
-}
-
.membership-signup__inner {
max-width: 820px;
margin-inline: auto;
}
+/* Zentrierter, ruhiger Sektions-Kopf (einheitlich mit instagram/partners) */
+.membership-signup__head {
+ max-width: 60ch;
+ margin: 0 auto 2.5rem;
+ text-align: center;
+}
+
.membership-signup__intro {
- max-width: 65ch;
- margin: 1rem 0 2rem;
+ margin-top: 1rem;
color: var(--clr-text-muted);
}
-/* Fußball-Sektion: Beitragstabelle hat Abstand zum Formular */
+/* Beitragstabelle und Formular mittig, schlanke Spaltenbreite für Lesbarkeit */
+.membership-signup .fee-table {
+ max-width: 560px;
+ margin-inline: auto;
+}
+
+.membership-signup .form {
+ margin-inline: auto;
+}
+
.membership-signup .fee-table + .form {
margin-top: 2rem;
}
@@ -2365,7 +2376,7 @@
.membership-notes {
display: grid;
gap: 1.5rem;
- margin: 0 0 2rem;
+ margin: 0 0 2.5rem;
padding: 0;
list-style: none;
}
@@ -2377,7 +2388,7 @@
}
.membership-notes__title {
- font-size: var(--fs-600);
+ font-size: var(--fs-650);
line-height: var(--lh-heading);
margin-bottom: 0.4rem;
padding-top: 0.75rem;
@@ -2385,7 +2396,7 @@
}
.membership-download {
- margin-top: 2rem;
+ text-align: center;
}
.membership-download__btn {
diff --git a/public/assets/img/banners/breadcrumb-hero-1600.jpg b/public/assets/img/banners/breadcrumb-hero-1600.jpg
new file mode 100644
index 0000000..32d2eac
Binary files /dev/null and b/public/assets/img/banners/breadcrumb-hero-1600.jpg differ
diff --git a/public/assets/img/banners/breadcrumb-solutions.svg b/public/assets/img/banners/breadcrumb-solutions.svg
new file mode 100644
index 0000000..becebf7
--- /dev/null
+++ b/public/assets/img/banners/breadcrumb-solutions.svg
@@ -0,0 +1,16 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+