/* NORDIX — Porträt im Hero, gemeinsame Grundlage von p1 / p2 / p3

   FARBWÄRME
   Bisher lief das Porträt durch `grayscale(.35) contrast(1.06)`. Das war als
   technische Zurückhaltung gedacht, zieht das Bild aber genau in die
   Richtung, die hier stört: kühler, härter, unpersönlicher.

   Der eigentliche Kältegeber ist nicht die Haut, sondern der graublaue
   Studiohintergrund. Deshalb wird nicht nur der Graustich entfernt, sondern
   das ganze Bild warm gekippt: sepia legt einen Braunton auf, saturate holt
   die Farbe zurück, hue-rotate zieht den Rest ins Rötliche. Der Hintergrund
   wird dadurch beige statt stahlgrau — das ist der Unterschied, den man als
   „freundlich" wahrnimmt, noch bevor man das Gesicht liest.

   Der Wert ist im Browser gegen drei Stufen geprüft, nicht geschätzt:
   sepia .24 blieb sichtbar kühl, .42 kippte die Haut ins Orange. .38 macht
   den Studiohintergrund beige und lässt den Hautton natürlich.

   Eine Stellschraube, damit die Tweaks-Bar daran drehen kann. */
:root{
  --pic-warm:sepia(.38) saturate(1.6) hue-rotate(-11deg) brightness(1.06) contrast(1.03);
}

/* Auch das Bild in „Über mich" wird wärmer — zwei Temperaturen desselben
   Gesichts auf einer Seite wären ein Bruch. */
.portrait{filter:var(--pic-warm)}

/* ---------- Porträt im Hero ---------- */
/* `figure` trägt global margin-top:34px und `figure img` ein festes 16/10 mit
   Rahmen. Beides gilt für die Bildstrecken in den Sektionen, nicht hier. */
.heropic{margin:0}
.heropic img{
  width:100%;
  height:auto;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:50% 16%;   /* Blick auf Augenhöhe, Wasserzeichen unten bleibt draußen */
  border:1px solid var(--line);
  border-radius:20px;        /* eine Stufe weicher als das Porträt in „Über mich" (18px) */
  filter:var(--pic-warm);
}

.heropic figcaption{
  margin-top:14px;
  display:flex;
  flex-direction:column;
  gap:5px;
}
.heropic figcaption b{
  font-family:var(--font-display);
  font-weight:600;
  font-size:clamp(17px,1.5vw,21px);
  text-transform:uppercase;
  letter-spacing:.02em;
  color:var(--ink);
}
.heropic figcaption span{
  font-size:var(--fs-micro);
  letter-spacing:var(--tr-micro);
  text-transform:uppercase;
  color:var(--orange);
}

/* Der Hero hat jetzt vier Kinder statt drei — die Eröffnung staffelt nach
   nth-child und kennt das vierte noch nicht. */
.hero > *:nth-child(4){transition-delay:.48s}