/* s07 · Eine Plattform statt vieler Insellösungen (Meisterwerk, Nacht): Gegenstück zum Hero mit demselben Rahmen (s01.css). Nacht links an
   K0: Wortmarke (--gold), h2 in Claim-Größe in drei Zeilen („Eine Plattform“ gold-hell wie „Handlung.“ im Hero), Kernaussage (.lead, 500,
   hell-text). Rechts das Lichtfenster .fenster.halb (system.css §18) in voller Höhe: das Kugelfeld als Standbild (object-fit cover, Lage
   50 % 55 %: die Reihen laufen in die Tiefe), einmal 14 s Fahrt scale 1,06 → 1 wie s02/s06. Fixrunde 11.10.: vorher das Guss-∞ als .kino-Band
   (jetzt Finale in s08). Kein Text liegt auf dem Foto. Jeder Selektor beginnt mit .s07. Unter 1100 px steht das Fenster oben (16:10). */
.s07{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;overflow:hidden}
.s07 .s07-fenster{--lage:50% 55%}
.js:not(.ruhig) .s07 .s07-fenster > img{transform:scale(1.06)}
.js:not(.ruhig) .s07 .s07-fenster.da > img{animation:s07-fahrt 14s var(--ease-weich) both}
@keyframes s07-fahrt{from{transform:scale(1.06)}to{transform:scale(1)}}
.s07 .s07-kopf{padding:clamp(22px,4.4vh,56px) var(--rand) 0}
.s07 .s07-text{flex:1;display:flex;flex-direction:column;justify-content:center;width:calc(100% * (1 - var(--halb)));padding:clamp(24px,4vh,64px) max(40px,2vw) clamp(40px,8vh,120px) var(--rand)}
/* Überschrift als h2 in der Größe des Claims (es bleibt bei genau einem h1) */
.s07 h2{font-family:var(--serif);font-weight:380;font-size:var(--t-h1);line-height:var(--zh-h1);letter-spacing:-.024em;color:var(--hell-text)}
.s07 h2 .z{display:block}
.s07 h2 .gold{color:var(--gold-hell)}
@media (min-width:1100px){.s07 h2 .z{white-space:nowrap}}   /* „Insellösungen.“: Source Serif ≈ 600 px, Palatino ≈ 660 px bei 2200 in 1012 px Spalte */
.s07 .s07-unter{margin-top:var(--r5);max-width:27em;font-weight:500;color:var(--hell-text)}
/* Aufbau wie der Claim im Hero: Zeilen steigen aus der Unschärfe, danach die Kernaussage */
.js:not(.ruhig) .s07 h2 .z.auf.da{animation:zeile .8s var(--ease) both}
.js:not(.ruhig) .s07 h2 .z.auf.da + .z.auf.da{animation-delay:.08s}
.js:not(.ruhig) .s07 h2 .z.auf.da + .z.auf.da + .z.auf.da{animation-delay:.16s}
.js:not(.ruhig) .s07 .s07-unter.auf.da{animation-delay:.3s}

@media (max-width:1099px){
  .s07 .s07-text{width:auto;padding-right:var(--rand);justify-content:flex-start}
  .s07 .s07-kopf{order:-1}
}