From 888de712de2ee00ce75a429b000e44ade0a195e4 Mon Sep 17 00:00:00 2001
From: Dogfather <dogfather1608@gmail.com>
Date: Sat, 1 Aug 2026 10:56:05 +0200
Subject: [PATCH] =?UTF-8?q?Profilseite:=20Weltmotiv-Banner=20deutlich=20ve?=
 =?UTF-8?q?rkleinert,=20Person=20hat=20Priorit=C3=A4t?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Das Banner-Bild auf profil.html nahm bisher seine volle Original-Höhe ein
(analog zu den anderen Seiten) und schob das eigentliche Profil weit nach
unten. Jetzt begrenzt auf 240px (Desktop) / 150px (Mobil), object-fit:cover
statt height:auto, plus stärkerer Verlaufs-Overlay — das Bild wirkt jetzt
als Stimmungsstreifen im Hintergrund, das Profil (Foto/Name/Bio) ist sofort
sichtbar.
---
 profil.html | 28 +++++++++++++++++++++++++++-
 1 file changed, 27 insertions(+), 1 deletion(-)

diff --git a/profil.html b/profil.html
index e0fccab..92dd78c 100644
--- a/profil.html
+++ b/profil.html
@@ -28,6 +28,32 @@
   .profil-social { margin-top: 1.4rem; }
   @media (max-width: 760px) { .profil-photo { max-width: 320px; } }
 
+  /* Auf der Profilseite ist die Person das Wichtigste, nicht das
+     Weltmotiv-Banner. Das Banner-Bild bekommt hier deshalb bewusst nur
+     noch einen schmalen Streifen als Stimmungsbild im Hintergrund, statt
+     wie auf den anderen Seiten seine volle, hohe Originalgröße
+     einzunehmen — das Profil (Foto, Name, Bio) rückt dadurch sofort in
+     den Vordergrund. */
+  #profil-banner { max-height: 240px; overflow: hidden; }
+  #profil-banner img {
+    height: 240px;
+    width: 100%;
+    object-fit: cover;
+    object-position: center 30%;
+    filter: saturate(1.05);
+  }
+  #profil-banner::after {
+    background: linear-gradient(to bottom,
+      rgba(0, 0, 0, .25) 0%,
+      color-mix(in srgb, var(--bg) 45%, transparent) 55%,
+      var(--bg) 100%);
+  }
+  .profil-hero.page-bg { padding: clamp(1.4rem, 3vw, 2rem) 0 clamp(1.6rem, 3.5vw, 2.4rem); }
+  @media (max-width: 760px) {
+    #profil-banner { max-height: 150px; }
+    #profil-banner img { height: 150px; }
+  }
+
   /* Ausführliche Vorstellung (bioHtml) — eigener, breiterer Lesebereich
      unterhalb der kurzen Steckbrief-Zeile, statt in die schmale 2-Spalten-
      Box gequetscht zu werden. Gedacht für Texte in beliebiger Länge. */
@@ -53,7 +79,7 @@
 <div id="site-header"></div>
 
 <main>
-  <section class="hero page-bg">
+  <section class="hero page-bg profil-hero">
     <div class="hero-banner" id="profil-banner" style="display:none;"><img id="profil-banner-img" src="" alt="" loading="eager" /></div>
     <div class="container">
       <span class="eyebrow" id="profil-eyebrow">🩵 Team Dogi</span>