/* ------------------------------------------------------------ Ein Wort zu den leisen Toenen in dieser Datei ------------------------------------------------------------ Der Kopfbereich steht auf --cd-flaeche-3 (#E9EEF1). Gegen diesen Grund ergibt --cd-text-3 (#5C6F79) nur 4,48:1 und reisst damit 1.4.3 — bei 11 und 13 px greift keine Ausnahme fuer grosse Schrift. Gemessen an drei Stellen, die axe nacheinander gemeldet hat (Vertrauenszeile, Anrufzeile, Fusszeile). Deshalb traegt der Kopf durchgehend --cd-text-2 (5,53:1). Dass diese Zeilen leiser wirken als die Ueberschrift, machen Groesse, Laufweite und Versalien bereits. ------------------------------------------------------------ */ /* ============================================================ cd_hero — Seitenkopf ============================================================ Sieben Bauformen einer Bahn. Die gemeinsame Luft und die Inhaltsspalte kommen aus bahnen.css (.cd-bahn und .cd-bahn__inhalt) — hier steht nur, was den Kopf ausmacht. Regeln dieser Datei: - Farben, Abstaende und Radien ausschliesslich als Token. - Kein !important. Wo eine Regel nicht greift, ist die Spezifitaet das Problem und nicht die Wichtigkeit. - Im Raster minmax(0, 1fr) statt 1fr: 1fr bedeutet minmax(auto, 1fr) und laesst lange Woerter, Codezeilen und Bilder die Spalte aufsprengen. ============================================================ */ .cd-hero { background: var(--cd-flaeche-3); border-block-end: 1px solid var(--cd-linie); } /* ------------------------------------------------------------ Grundraster ------------------------------------------------------------ Links der Text, rechts die Nebenspalte. Der Text bekommt den groesseren Anteil — er traegt die Antwort. ------------------------------------------------------------ */ .cd-hero__raster { display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr); gap: var(--cd-a8); align-items: center; } /* Ohne Inhalt in der Nebenspalte faellt die zweite Spalte weg. Eine leere rechte Spalte wuerde den Text auf die halbe Breite quetschen — das passiert, sobald eine Redaktion das Bild weglaesst. Die Zeilenlaenge begrenzt dann max-inline-size am Text und nicht das Raster. */ .cd-hero--ohneNeben .cd-hero__raster { grid-template-columns: minmax(0, 1fr); } .cd-hero__haupt { min-inline-size: 0; } .cd-hero__neben { min-inline-size: 0; position: relative; } /* ------------------------------------------------------------ Brotkrumenpfad ------------------------------------------------------------ Kein