/* Theme Name: BG Rein Child Theme URI: https://bgrein.at Description: Child-Theme für das Bundesgymnasium Rein. Basis: GeneratePress. Author: BG Rein Author URI: https://bgrein.at Template: generatepress Version: 1.9.7 Requires at least: 6.5 Requires PHP: 7.4 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: bgrein-child */ /* ================================================================ CSS CUSTOM PROPERTIES Alle Designwerte zentral definiert – abgeleitet aus dem Mockup (mockup.bgrein.at) und Entwurf 4 (Menue Redesign, classic mood). ================================================================ */ :root { /* ── Primärfarben ─────────────────────────────────────────── */ --color-primary: #000000; /* Logo, Headings (Schrift schwarz, v1.9.3) */ --color-primary-light: #4A6580; /* Hero-Gradient Ende */ --color-accent-green: #005959; /* Direktion-Sektion */ --color-green-mid: #27AE60; /* CTAs, Links */ --color-blue-link: #3498DB; /* Section-Title Unterstrich */ --color-brand-green: #044D1E; /* Tagline + Strichcode-Gruppenlabels (einheitlich) */ /* ── Textfarben ───────────────────────────────────────────── */ --color-text: #000000; --color-text-muted: #000000; --color-text-meta: #000000; /* Tagline, Datum, Kategorie */ --color-text-light: #000000; /* Excerpt */ /* ── Oberflächen ──────────────────────────────────────────── */ --color-bg: #F4F5F7; /* Seiten-Hintergrund */ --color-surface: #FFFFFF; /* Cards, Header */ --color-topbar-bg: #F8F9FA; /* Top-Bar */ --color-border: #E0E0E0; --color-footer-bg: #2C3E50; --color-footer-text: rgba(255,255,255,0.80); /* ── Typografie ───────────────────────────────────────────── */ /* Genau DREI Schriften (Feedback Okt. 2026, ab 1.9.4): 1. Cormorant Garamond – Schulname (Vorgabe laut Vertrag) + Überschriften 2. Caveat – Motto + handschriftliche Akzente 3. Helvetica/Arial – Fließtext, Menüs, Bedienelemente Alle übrigen Schrift-Variablen der Komponenten (--display, --sans, --serif, --bgt-sans) verweisen nur noch auf diese drei. */ --font-display: 'Cormorant Garamond', Georgia, serif; /* Schulname, Titel */ --font-handwriting: 'Caveat', cursive; /* Motto, Klammern */ --font-ui: 'Helvetica Neue', Helvetica, Arial, sans-serif; /* Text, Meta, UI */ --font-serif: var(--font-ui); /* Altname für Fließtext (bis 1.9.3 Georgia) */ /* ── Schriftgrößen-Skala (ab 1.9.7) ───────────────────────── EINE Größe je Rolle, überall gleich (Seiten, Beiträge, Startseite, Karten, Kästen). Am Handy (≤ 900 px) etwas kleiner, siehe unten. --fs-lead Einleitung (Kopftext, erster Absatz) 21 / 19 px --fs-text Lesetext – auch in Karten, Kästen, Listen 18 / 17 px --fs-small Bedienelemente, Tabellen, Vorschautexte 15 px --fs-mini Datum, Bildunterschrift, Brotkrümel 13 px --fs-h2 / --fs-h3 / --fs-h4 Überschriften (Cormorant) */ --fs-lead: 1.3125rem; --fs-text: 1.125rem; --fs-small: 0.9375rem; --fs-mini: 0.8125rem; --fs-h2: 1.9rem; --fs-h3: 1.45rem; --fs-h4: 1.3rem; --lh-text: 1.8; --font-size-xs: 0.75rem; /* 12px – Topbar, Tags */ --font-size-sm: 0.8125rem; /* 13px – Topbar, Tagline */ --font-size-base: 1rem; /* 16px */ --font-size-md: 1.0625rem; /* 17px – Fließtext */ --font-size-lg: 1.1875rem; /* 19px – Slide Excerpt */ --font-size-xl: 1.5rem; /* 24px – Card Title */ --font-size-2xl: 1.625rem; /* 26px */ --font-size-3xl: 2rem; /* 32px – Awards Title */ --font-size-4xl: 2.375rem; /* 38px – Direktion Title */ --font-size-5xl: 2.625rem; /* 42px – Section Title */ --font-size-hero: 3.25rem; /* 52px – Slide Title */ --font-size-logo: 1.5625rem; /* 25px – Schulname in Nav */ /* ── Abstände ─────────────────────────────────────────────── */ --spacing-xs: 0.5rem; /* 8px */ --spacing-sm: 1rem; /* 16px */ --spacing-md: 1.375rem; /* 22px */ --spacing-lg: 2rem; /* 32px */ --spacing-xl: 3.125rem; /* 50px */ --spacing-2xl: 4.375rem; /* 70px */ --spacing-3xl: 5rem; /* 80px */ --spacing-4xl: 6.25rem; /* 100px */ /* ── Layout ───────────────────────────────────────────────── */ --content-max-width: 1200px; --content-padding-x: var(--spacing-xl); /* 50px seitlich */ --topbar-height: 2.5rem; /* 40px */ --header-height: 15.625rem; /* 250px */ --header-padding: 1.25rem var(--spacing-xl) 1.5rem; /* ── Strichcode-Navigation ────────────────────────────────── */ --nav-bar-height: 170px; --nav-bar-gap: 10px; /* Abstand zwischen Bars (px) */ --nav-bar-scale: 1.4; /* Breiten-Multiplikator */ --nav-bracket-height: 50px; /* Platz für Kategorie-Labels */ --nav-logo-width: 240px; /* ── Strichcode: Balkenfarben ─────────────────────────────── --bar- wird aus bgr_category_color_map() (functions.php) per wp_head erzeugt – Farben NUR dort ändern. */ /* ── Schatten ─────────────────────────────────────────────── */ --shadow-nav: 0 2px 10px rgba(0,0,0,0.10); --shadow-paper: 0 4px 24px rgba(0,0,0,0.08); --shadow-card: 0 5px 25px rgba(0,0,0,0.08); --shadow-card-hover: 0 15px 45px rgba(0,0,0,0.15); --shadow-bar-hover: 0 6px 20px rgba(0,0,0,0.25); /* ── Übergänge ────────────────────────────────────────────── */ --transition-base: 0.3s ease; --transition-smooth: 0.4s cubic-bezier(0.4, 0, 0.2, 1); --transition-nav: 0.3s cubic-bezier(0.4, 0, 0.2, 1); /* ── Radien ───────────────────────────────────────────────── */ --radius-sm: 8px; --radius-md: 10px; --radius-lg: 12px; --radius-pill: 30px; /* ── Hero ─────────────────────────────────────────────────── */ --hero-height: 70vh; --hero-gradient: linear-gradient(135deg, #2C3E50 0%, var(--color-primary-light) 100%); /* ── Breakpoints (nur zur Dokumentation — in @media nutzen) ── --bp-sm: 576px Smartphones quer --bp-md: 768px Tablets hoch --bp-lg: 1024px Tablets quer / kleine Desktops --bp-xl: 1280px Desktop – Strichcode-Nav volle Breite ─────────────────────────────────────────────────────────── */ } /* ================================================================ GENERELLE BASISSTILE (GeneratePress-Overrides) ================================================================ */ /* Schriftskala am Handy (1.9.7) */ @media (max-width: 900px) { :root { --fs-lead: 1.1875rem; --fs-text: 1.0625rem; --fs-h2: 1.6rem; --fs-h3: 1.3rem; --fs-h4: 1.2rem; } } /* GeneratePress setzt für body und Formularelemente eine Systemschrift und lädt sein CSS NACH diesem – daher „html …“ (höhere Spezifität). Sonst erscheint auf Startseite und Archiven eine 4. Schrift (1.9.7). */ html button, html input, html select, html textarea, html optgroup { font-family: var(--font-ui); } html body { font-family: var(--font-ui); color: var(--color-text); background-color: var(--color-bg); line-height: 1.6; } /* GP setzt standardmäßig eigene Container-Breiten – wir harmonisieren */ .site-content .content-area { padding: var(--spacing-4xl) var(--content-padding-x); max-width: var(--content-max-width); margin: 0 auto; } /* Section-Titel (gemeinsames Muster aus dem Mockup) */ .bgrein-section-title { font-family: var(--font-display); font-size: var(--fs-h2); font-weight: 600; text-align: center; color: var(--color-primary); margin-bottom: var(--spacing-2xl); position: relative; } .bgrein-section-title::after { content: ''; display: block; width: 65px; height: 3px; background: var(--color-blue-link); margin: var(--spacing-md) auto 0; } /* ================================================================ EINHEITLICHE SCHRIFT IN INHALTEN (ab 1.9.7) Aus der alten Homepage übernommene Texte tragen teils eigene Inline-Schriften/-Größen (z. B. Verdana 12 px). Diese werden ignoriert – Inhalte erscheinen immer in der Lesetext-Schrift. Fett/kursiv/Farben bleiben erhalten. ================================================================ */ .entry-content [style*="font-family"], .bgb-content [style*="font-family"] { font-family: inherit !important; } .entry-content :not(h1, h2, h3, h4, h5, h6)[style*="font-size"], .bgb-content :not(h1, h2, h3, h4, h5, h6)[style*="font-size"] { font-size: inherit !important; line-height: inherit !important; } /* Zwischenüberschriften 4. Ebene (v. a. aus der alten Homepage übernommen) */ .entry-content h4, .bgb-content h4 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-h4); line-height: 1.25; }