/*
* Individuelle Stile des Child-Themes „Projekttheme – Hahnenkamm“.
*
* Diese Datei wird nach der styles.css des Eltern-Themes geladen; die hier
* definierten Regeln überschreiben bzw. ergänzen daher die Eltern-Stile.
* Änderungen bleiben bei Updates des Eltern-Themes erhalten.
*
* Inhalt:
* 1. Schrift – Manrope (selbst gehostet, DSGVO-konform)
* 2. Farben – Markenpalette FSH-Hahnenkamm über die Design-Tokens
* 3. Schriftgewichte – an die verfügbaren Manrope-Schnitte angepasst
* 4. Hartkodierte Alt-Blau-Werte des Eltern-Themes angleichen
* 5. Logo – buntes FSH-Logo (SVG) in Kopf- und Fußzeile
* 6. Formulare – bestehende Detailanpassungen
*/
/* =========================================================================
1. SCHRIFT — Manrope (selbst gehostet)
-------------------------------------------------------------------------
Google Fonts dürfen aus DSGVO-Gründen nicht per CDN eingebunden werden,
deshalb liegen die woff2-Dateien lokal unter assets/fonts/manrope/.
Geladen werden nur die benötigten Schnitte:
Extra Light (200), Regular (400) und Semibold (600).
Die woff2-Dateien sind variable Fonts; alle Schnitte verweisen daher auf
dieselbe Datei je Subset (latin / latin-ext).
========================================================================= */
/* Extra Light (200) */
@font-face {
font-family: "Manrope";
font-style: normal;
font-weight: 200;
font-display: swap;
src: url("../fonts/manrope/manrope-latin.woff2") format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "Manrope";
font-style: normal;
font-weight: 200;
font-display: swap;
src: url("../fonts/manrope/manrope-latin-ext.woff2") format("woff2");
unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Regular (400) */
@font-face {
font-family: "Manrope";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("../fonts/manrope/manrope-latin.woff2") format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "Manrope";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("../fonts/manrope/manrope-latin-ext.woff2") format("woff2");
unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Semibold (600) */
@font-face {
font-family: "Manrope";
font-style: normal;
font-weight: 600;
font-display: swap;
src: url("../fonts/manrope/manrope-latin.woff2") format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "Manrope";
font-style: normal;
font-weight: 600;
font-display: swap;
src: url("../fonts/manrope/manrope-latin-ext.woff2") format("woff2");
unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* =========================================================================
2. FARBEN — Markenpalette FSH-Hahnenkamm
-------------------------------------------------------------------------
Die Design-Tokens des Eltern-Themes werden zentral überschrieben. Da das
gesamte Eltern-Stylesheet über var(--blue), var(--green) usw. arbeitet,
greift die neue Palette dadurch durchgängig.
Markenfarben:
#6eadcc helles Blau (Seewasser / Himmel)
#213bbd kräftiges Blau (Primärfarbe – Links, Buttons, Fokus)
#abc759 helles Grün (Landschaft hell)
#87a31c kräftiges Grün (Sekundärfarbe)
#ffc405 Gold (Akzent)
========================================================================= */
:root {
/* Kräftiges Blau als Primärfarbe (Kontrast zu Weiß ≈ 8,3:1 – WCAG AAA). */
--blue: #6eadcc;
--blue-dark: #182c8f;
/* Kräftiges Grün als Sekundärfarbe, dunklere Variante für Text/Hover. */
--green: #87a31c;
--green-dark: #6b8016;
/* Bootstrap-Tokens auf die neue Primärfarbe angleichen. */
--bs-primary: #6eadcc;
--bs-primary-rgb: 110, 173, 204;
--bs-link-color: #6eadcc;
/* Fokus-Ring in der Markenfarbe. */
--focus-ring: 0 0 0 3px rgba(110, 173, 204, 0.45);
/* Gold-Akzent (Handlungsfeld „Orts- & Innenentwicklung“) an Marke angleichen. */
--hf-o: #ffc405;
/* Schriftfamilien auf Manrope umstellen. */
--font-heading: "Manrope", system-ui, -apple-system, sans-serif;
--font-body: "Manrope", system-ui, -apple-system, sans-serif;
}
/* =========================================================================
3. SCHRIFTGEWICHTE — an Manrope angepasst
-------------------------------------------------------------------------
Manrope wird nur in Extra Light (200), Regular (400) und Semibold (600)
geladen. Das Eltern-Theme setzt für Überschriften und Auszeichnungen
teils 700–900. Damit kein Kunstfettdruck entsteht, werden diese Gewichte
auf Semibold (600) begrenzt.
========================================================================= */
h1, h2, h3, h4, h5, h6,
.display-font,
.eyebrow,
.brand-line1,
.foot-heading,
.btn,
.btn-brand {
font-weight: 600;
}
/* =========================================================================
4. HARTKODIERTE ALT-BLAU-WERTE ANGLEICHEN
-------------------------------------------------------------------------
Einige Regeln des Eltern-Themes nutzen das alte Seenland-Blau als feste
rgba()-Werte, die nicht über die Tokens erfasst werden. Sie werden hier
auf die neue Markenpalette umgestellt.
========================================================================= */
.fsh-nav .nav-link:hover,
.fsh-nav .nav-link[aria-current="page"] {
color: var(--blue-dark);
background: rgba(110, 173, 204, 0.16); /* helles Blau #6eadcc */
}
.pill:hover,
.pill:focus-visible {
background: rgba(110, 173, 204, 0.04);
}
.hero-card {
box-shadow: 0 30px 60px -34px rgba(33, 59, 189, 0.4);
}
.highlight-box {
background: linear-gradient(135deg, rgba(171, 199, 89, 0.20), rgba(33, 59, 189, 0.10)); /* helles Grün + kräftiges Blau */
border-color: rgba(135, 163, 28, 0.30);
}
/* =========================================================================
5. LOGO — buntes FSH-Logo (SVG)
-------------------------------------------------------------------------
Das neue Logo (assets/img/fsh_logo_bunt.svg) ersetzt die frühere
Inline-SVG-Marke in Kopf- und Fußzeile. Es wird als ![]()
eingebunden; die Größe wird hier über die Höhe gesteuert (Seitenverhältnis
≈ 1,4 : 1). width/height-Attribute am ![]()
verhindern Layout-Shift.
========================================================================= */
.navbar-brand .brand-mark {
width: auto;
height: 48px;
}
.foot .navbar-brand .brand-mark {
height: 44px;
}
/* =========================================================================
6. FORMULARE — bestehende Detailanpassungen
========================================================================= */
.wpbs-field-radio fieldset .form-check {
display: inline-block;
min-height: 1.5rem;
padding-left: 1.5rem;
margin-bottom: .5rem;
margin-right: 1.5rem;
}
.wpbs-form-alert ul { display: none !important;}
.form-label { white-space: nowrap; }