/* DAS PUNKTFELD DER CRM-SEITE (14.10.2026) — „Jeder Gast erzählt dir etwas über sich."
   Schrift wie im Bild des Wirts (Images 9.webp): DM Sans 400 ≈ 41 px, Grund #0F0F0F →
   unser --crm-grund. Linke Kante auf der Spalte der Seite (1404).
   Das Netz füllt den Bildschirm (Wirt, 14.10.2026): der Abschnitt steht beim Scrollen
   bildschirmhoch still, drei Sätze lösen sich ab, die Geschichte läuft in punktfeld.js.
   Präfix pf-. */
/* Als erste Sektion der Seite (14.10.2026): dunkel von oben, der Kopf liegt über dem Netz */
.seite-pf{padding-top:0;background:var(--crm-grund,#101013)}
/* Der Kopf bleibt beim Scrollen stehen (Wirt, 14.10.2026) — auf einem dunklen Band über die volle Breite */
.seite-pf .kopf{position:fixed;left:0;right:0;top:0;z-index:20}
.seite-pf .kopf::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:100vw;margin-left:-50vw;
  background:rgba(16,16,19,.92);z-index:-1}
/* Aufteilung nach dem Bild des Wirts (Images 14.webp, 1028 breit = 1758 Fenster, Faktor 1,71 an
   Wortmarke und Demo-Knopf): Satz 74 px / 85, zwei Zeilen, Oberkante der Schrift 203 vom Rand;
   das Netz beginnt bei 40 % der Höhe (punktfeld.js). */
.seite-pf .pf-text{padding-top:187px}
.seite-pf .pf-titel{font-size:74px;line-height:85px;letter-spacing:-.015em}
.seite-pf .pf-saetze{height:170px;max-width:none}
@media (max-width:1300px){
  .seite-pf .pf-titel{font-size:56px;line-height:66px}
  .seite-pf .pf-saetze{height:198px}
  .seite-pf .pf-satz br{display:none}
}
@media (max-width:760px){
  .seite-pf .pf-text{padding-top:130px}
  .seite-pf .pf-titel{font-size:34px;line-height:40px}
  .seite-pf .pf-saetze{height:160px}
}
.pf{position:relative;height:2800px;background:var(--crm-grund,#101013)}
.pf-halt{position:sticky;top:0;height:100vh;min-height:560px;overflow:hidden}
.pf-feld{position:absolute;left:0;top:0;width:100%;height:100%;display:block}
.pf-text{position:relative;z-index:2;width:min(100% - 48px,1404px);margin:0 auto;padding-top:104px}
.pf-titel{margin:0;font-weight:400;font-size:41px;line-height:48px;letter-spacing:-.01em;color:#F6F7F7}
/* Drei Sätze übereinander; der alte gleitet nach oben weg, der neue steigt von unten auf */
.pf-saetze{position:relative;height:96px;overflow:hidden;max-width:1000px}
.pf-satz{position:absolute;left:0;top:0;width:100%;transform:translateY(110%);opacity:0;
  transition:transform .65s cubic-bezier(.2,.7,.2,1),opacity .65s cubic-bezier(.2,.7,.2,1)}
.pf-satz.an{transform:none;opacity:1}
.pf-satz.weg{transform:translateY(-110%);opacity:0}

@media (max-width:760px){
  .pf{height:2200px}
  .pf-text{padding-top:72px}
  .pf-titel{font-size:30px;line-height:36px}
  .pf-saetze{height:108px}
}
@media (prefers-reduced-motion:reduce){ .pf-satz{transition:none} }