diff --git a/assets/css/main.css b/assets/css/main.css index 5c5617d..a4f46fe 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -1242,14 +1242,29 @@ footer.site-footer { width: 100%; height: 100%; object-fit: cover; - /* dezenter Marken-Look: Sättigung/Kontrast leicht angehoben, Farbton via Overlay */ - filter: saturate(1.15) contrast(1.08) brightness(1.02); + /* Kräftigerer "produced look": mehr Sättigung/Kontrast als vorher, damit + auch schlichte Portraitfotos neben aufwendig gestalteten Postern + (z.B. dem DogFather-Manager-Artwork) nicht flach wirken. */ + filter: saturate(1.26) contrast(1.15) brightness(1.03); } +/* Cineastischer "Poster-Grade" für JEDES Präsentationsfoto auf der Seite: + zwei Farbschein-Blooms in der jeweiligen Rahmenfarbe (oben-links / + unten-rechts, wie ein Studio-Rimlight — nutzt dieselbe --frame-Variable + wie der Rahmen, damit Bild und Rand optisch zusammengehören), eine + sanfte Vignette unten für Tiefe/Fokus aufs Gesicht, plus feines + Filmkorn (SVG-Turbulence). Macht auch ein simples Handy-Foto "produziert", + ohne den eigentlichen Bildinhalt zu verdecken. */ .collage-photo::after { content: ""; position: absolute; inset: 0; - background: linear-gradient(155deg, rgba(143, 217, 234, .22), rgba(139, 92, 246, .14)); + background-image: + radial-gradient(125% 140% at 8% -14%, color-mix(in srgb, var(--frame) 75%, transparent) 0%, transparent 46%), + radial-gradient(125% 140% at 112% 116%, color-mix(in srgb, var(--frame) 65%, transparent) 0%, transparent 48%), + linear-gradient(180deg, transparent 58%, rgba(0, 0, 0, .5) 100%), + url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.4'/%3E%3C/svg%3E"); + background-size: cover, cover, cover, 170px 170px; + background-blend-mode: screen, screen, multiply, overlay; mix-blend-mode: overlay; pointer-events: none; }