/* ptb-theme.css — Pack-Theme place to be (css_mode components)
   Quelle: source/assets/css (Kit-Build relaunch/4-componentsystem, eingefroren laut source/FREEZE.md)
   = core.04b437aa.css + reihenfolgetreue Vereinigung von 29 Seiten-CSS (pack/bin/build-theme-css.py).
   Font-URLs pack-relativ (../fonts/). Nicht von Hand bearbeiten — bei neuem Kit-Build neu erzeugen. */
/* ===========================================================================
   Schicht 1 — Tokens · place to be Locations
   Primitive (--ptb-*): Werte 1:1 aus dem freigegebenen Prototyp forty-four.html
   (dev/micro-lp-multistep, v0.7.19). Namen folgen dem Vokabular des
   Claude-Design-Pakets (relaunch/2-designsystem/tokens/colors.css), damit die
   spätere Website dieselben Namen weiterführt. Weicht ein Paketwert ab, gilt der
   Prototyp.
   Semantic: Kit-Pflichtnamen + place-to-be-Ergänzungen. Block-CSS liest Semantic.
   =========================================================================== */

/* --- Ebene 1: Primitive ---------------------------------------------------- */
:root {
  --ptb-ink:          #4C453D;
  --ptb-ink-soft:     #6B6258;
  --ptb-muted:        #8C8377;
  --ptb-text:         #2a2724;   /* Fließtext seitenweit (Chris, 02.09.) */
  --ptb-paper:        #FBF7F2;
  --ptb-paper-2:      #F3ECE1;
  --ptb-paper-3:      #EFE6D9;
  --ptb-white:        #ffffff;
  --ptb-black:        #000000;
  --ptb-dark:         #15120F;
  --ptb-dark-warm:    #26231f;
  --ptb-espresso:     #3C322A;
  --ptb-shadow:       #0a0806;
  --ptb-gold:         #D6B692;   /* bestätigt 02.09. */
  --ptb-gold-deep:    #8f7c67;
  --ptb-gold-kicker:  #B59C82;
  --ptb-gold-pale:    #EFDAC6;
  --ptb-line-base:    #BFB8A8;
  --ptb-line:         rgba(191,184,168,.5412);   /* #BFB8A88A */
  --ptb-caption:      #828282;
  --ptb-tab-hover:    #F2E9E4;
  --ptb-card-highlight: #FFFDF9;
  --ptb-hero-veil:    rgba(38,35,31,.8);          /* #26231fcc */
  --ptb-online:       #34B36A;
  --ptb-error:        #C0553F;

  /* Kapazitäten-Widget (Live-Widget „PTB Capacities v2“) */
  --ptb-cap-ink:      #3C3C3C;
  --ptb-cap-line:     #E0DCD8;

  /* Bewertungs-Laufband (Live-Widget) */
  --ptb-review-name:     #1a1a1a;
  --ptb-review-star:     #FFA500;
  --ptb-review-grey-100: #f5f5f5;
  --ptb-review-grey-200: #e5e7eb;
  --ptb-review-grey-300: #d1d5db;
  --ptb-review-grey-600: #4b5563;
  --ptb-review-grey-700: #374151;
  --ptb-avatar-1:  #52B788;  --ptb-avatar-2:  #BB8FCE;  --ptb-avatar-3:  #85C1E2;
  --ptb-avatar-4:  #45B7D1;  --ptb-avatar-5:  #FF6B6B;  --ptb-avatar-6:  #4ECDC4;
  --ptb-avatar-7:  #F7DC6F;  --ptb-avatar-8:  #98D8C8;  --ptb-avatar-9:  #FFA07A;
  --ptb-avatar-10: #F8B739;  --ptb-avatar-11: #E76F51;  --ptb-avatar-12: #2A9D8F;

  /* Status (Kit-Pflicht) */
  --status-danger-raw:  #C0553F;
  --status-success-raw: #34B36A;

  /* Abstands-Skala (Kit) */
  --space-0: 0;      --space-1: .25rem; --space-2: .5rem;  --space-3: 1rem;
  --space-4: 1.5rem; --space-5: 2rem;   --space-6: 3rem;   --space-7: 4.5rem;
  --space-8: 6rem;

  /* Sektionsabstände (Runde 8, Chris 06.09.) */
  --s-oben: 120px;
  --s-unten: 130px;

  /* Überschriften-Paare (Runde 7): Display · Schreibschrift · Versatz · Abstand zum Text */
  --t-h2: 85px;
  --t-script: 80px;
  --t-versatz: 0px;
  --t-nach: 30px;

  /* Radien und Elevation */
  --radius-sm: 4px; --radius-md: 8px; --radius-lg: 16px; --radius-pill: 999px;
  --radius-frame: 30px; --radius-frame-in: 22px;
  --elevation-1: 0 1px 2px rgba(0,0,0,.06);
  --elevation-2: 0 6px 24px -12px rgba(0,0,0,.14);

  /* Bewegung */
  --ease: cubic-bezier(.32,.72,0,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --dur-fast: 120ms; --dur-base: 220ms;

  /* Maße */
  --shell-max: 1300px;
  --shell-pad: max(20px, calc((100vw - 1300px) / 2));
  --container-max: 1300px;
  --container-pad: 20px;
  --content-measure: 68ch;
  --tap-min: 44px;
}
@media (max-width: 767px) {
  :root {
    --s-oben: 60px; --s-unten: 90px;
    --t-h2: 50px; --t-script: 42px; --t-versatz: -2px; --t-nach: 18px;
  }
}

/* --- Ebene 2: Semantic ----------------------------------------------------- */
:root {
  /* Text */
  --text-strong:      var(--ptb-ink);
  --text-body:        var(--ptb-text);
  --text-muted:       var(--ptb-muted);
  --text-soft:        var(--ptb-ink-soft);
  --text-on-brand:    var(--ptb-paper);
  --text-on-dark:     var(--ptb-paper);
  --text-link:        var(--ptb-ink);
  --text-link-hover:  var(--ptb-gold-deep);
  --text-inverse:     var(--ptb-white);
  --text-contrast:    var(--ptb-black);
  --text-kicker:      var(--ptb-gold-kicker);
  --text-accent-pale: var(--ptb-gold-pale);
  --text-caption:     var(--ptb-caption);

  /* Flächen */
  --surface-page:     var(--ptb-white);
  --surface-card:     var(--ptb-white);
  --surface-muted:    var(--ptb-paper);
  --surface-hover:    var(--ptb-paper-2);
  --surface-brand:    var(--ptb-espresso);
  --surface-hero:     var(--ptb-espresso);
  --surface-dark:     var(--ptb-dark-warm);
  --surface-hero-veil: var(--ptb-hero-veil);
  --surface-tab-hover: var(--ptb-tab-hover);
  --surface-highlight-card: var(--ptb-card-highlight);

  /* Linien */
  --border-default:     var(--ptb-line);
  --border-subtle:      var(--ptb-paper-3);
  --border-strong:      var(--ptb-ink);
  --border-interactive: var(--ptb-ink);

  /* Akzent */
  --accent:      var(--ptb-gold);
  --accent-deep: var(--ptb-gold-deep);
  --accent-soft: rgba(214,182,146,.30);

  /* Interaktion (Button-Kanon „Nur Pfeil“, Chris 02.09.) */
  --interactive:       var(--ptb-ink);
  --interactive-hover: var(--ptb-gold-deep);
  --interactive-press: var(--ptb-ink);
  --interactive-fg:    var(--ptb-paper);
  --disabled-bg:       var(--ptb-paper-2);
  --disabled-fg:       var(--ptb-muted);

  /* Fokus */
  --focus-ring:        var(--ptb-gold-deep);
  --focus-ring-width:  2px;
  --focus-ring-offset: 2px;

  /* Status */
  --status-danger:  var(--status-danger-raw);
  --status-success: var(--status-success-raw);
  --status-online:  var(--ptb-online);
}

/* --- Ebene 3: Kontext-Tokens je Fläche -------------------------------------
   Eine Fläche belegt Tokens um, sie schreibt keine Regeln für ihre Kinder.
   Immer das Endtoken setzen, nie ein Zwischentoken (Bauplan §e).
   -------------------------------------------------------------------------- */
.ptb-section--muted {
  --surface-page:  var(--ptb-paper);
  --surface-card:  var(--ptb-white);
  --surface-hover: var(--ptb-paper-3);
}
/* Weiße Fläche: Gegenstück zu --muted für Blöcke, deren Grund sonst Papier ist (Flächenwechsel, Chris 30.09.) */
.ptb-section--hell {
  --surface-page:  var(--ptb-white);
  --surface-muted: var(--ptb-white);
}
/* Dunkle Bildflächen (Hero-Video, Kamerafahrt): Buttons und Text wechseln auf Papier/Weiß */
.ptb-section--dark {
  --surface-page:       var(--ptb-dark-warm);
  --surface-card:       var(--ptb-dark-warm);
  --surface-hover:      var(--ptb-espresso);
  --text-strong:        var(--ptb-white);
  --text-body:          var(--ptb-paper);
  --text-muted:         var(--ptb-paper-3);
  --text-link:          var(--ptb-paper);
  --text-link-hover:    var(--ptb-gold);
  --border-default:     var(--ptb-paper-3);
  --border-strong:      var(--ptb-paper);
  --border-interactive: var(--ptb-paper);
  --interactive:        var(--ptb-paper);
  --interactive-hover:  var(--ptb-gold);
  --interactive-press:  var(--ptb-paper);
  --interactive-fg:     var(--ptb-dark-warm);
  --focus-ring:         var(--ptb-gold);
}
.ptb-section--brand {
  --surface-page:       var(--ptb-espresso);
  --surface-card:       var(--ptb-espresso);
  --surface-hover:      var(--ptb-dark-warm);
  --text-strong:        var(--ptb-paper);
  --text-body:          var(--ptb-paper);
  --text-muted:         var(--ptb-paper-3);
  --text-link:          var(--ptb-paper);
  --text-link-hover:    var(--ptb-gold);
  --border-default:     var(--ptb-paper-3);
  --border-strong:      var(--ptb-paper);
  --border-interactive: var(--ptb-paper);
  --interactive:        var(--ptb-paper);
  --interactive-hover:  var(--ptb-gold);
  --interactive-press:  var(--ptb-paper);
  --interactive-fg:     var(--ptb-espresso);
  --disabled-bg:        var(--ptb-dark-warm);
  --disabled-fg:        var(--ptb-paper-3);
  --focus-ring:         var(--ptb-gold);
}

/* --- Restliche Seiten (Seitenplan 11.09., Blöcke cb16–cb26, ab 30.09.2026) ---------
   Werte aus dem Designpaket (Rahmen-im-Rahmen, warme Schatten) und der Entwurfs-Startseite
   (Stadt-Chip auf dem Bild). Block-CSS liest nur die Semantic-Namen darunter.
   -------------------------------------------------------------------------- */
:root {
  --ptb-rahmen-papier:  rgba(76,69,61,.04);
  --ptb-rahmen-hell:    rgba(255,255,255,.7);
  --ptb-chip:           rgba(251,247,242,.94);
  --ptb-schatten-hebt:  rgba(76,69,61,.5);
  --ptb-schatten-pop:   rgba(76,69,61,.45);
  --ptb-schatten-tief:  rgba(10,8,6,.62);
  --ptb-dialog-grund:   rgba(21,18,15,.9);
}
:root {
  --surface-chip:      var(--ptb-chip);
  --surface-frame:     var(--ptb-rahmen-papier);
  --surface-dialog:    var(--ptb-dialog-grund);
  --shadow-inset-hell: inset 0 1px 1px var(--ptb-rahmen-hell);
  --shadow-hebt:       0 14px 26px -18px var(--ptb-schatten-hebt);
  --shadow-pop:        0 28px 60px -24px var(--ptb-schatten-pop);
  --shadow-tief:       0 42px 90px -40px var(--ptb-schatten-tief);
  --radius-frame-sm:   16px;
  --kopf-hoehe:        88px;   /* feste Kopfzeile: Ruhe 19 + 50 + 20 px, gerundet */
}
@media (max-width: 767px) { :root { --kopf-hoehe: 72px; } }

/* --- Kopf- und Fußzeile (Live-Seite placetobe.com, Breakdance-Templates 16 und 391) ---
   Primitive nur, wo die Live-Seite vom Prototyp abweicht. Kontext-Tokens je Zustand:
   Kopfzeile über Bildflächen (Ruhe) bzw. ab dem ersten Scrollpixel und auf Farbflächen
   ([data-ptb-sticky] aus header.js, .ptb-header--on-color aus pages.json headerVariant).
   -------------------------------------------------------------------------- */
:root {
  --ptb-kopf-sticky:  #FCF9F3;
  --ptb-cta:          #316678;   /* Breakdance-Palette „cta-5“ */
  --ptb-trenner:      #887B6B;
  --ptb-trenner-zart: rgba(136,123,107,.19);
  --ptb-menue-sticky: rgba(251,247,242,.84);   /* Live-Wert eine Stufe heller, auf Papier-Token gerundet */
  --ptb-fuss-text:    #464646;   /* Breakdance „Body Text“ */
  --ptb-fuss-dunkel:  #35312B;   /* Breakdance-Palette „darkbg-8“ */
}
.ptb-header {
  --kopf-flaeche:        transparent;
  --kopf-text:           var(--ptb-white);
  --kopf-icon:           var(--ptb-white);
  --kopf-icon-hover:     var(--ptb-gold);
  --kopf-link-hover:     var(--ptb-gold-pale);
  --kopf-droptext-hover: var(--ptb-paper);
  --kopf-cta-flaeche:    transparent;
  --kopf-cta-rand:       var(--ptb-white);
  --kopf-cta-text:       var(--ptb-white);
  --kopf-menue-flaeche:  transparent;
  --kopf-trenner:        var(--ptb-trenner);
  --kopf-linie:          var(--accent-soft);
  --kopf-pad-oben:       19px;
  --kopf-pad-unten:      20px;
  --kopf-logo-breite:    250px;
  --kopf-logo-hell:      block;
  --kopf-logo-dunkel:    none;
}
.ptb-header[data-ptb-sticky],
.ptb-header--on-color {
  --kopf-flaeche:        var(--ptb-kopf-sticky);
  --kopf-text:           var(--ptb-black);
  --kopf-icon:           var(--ptb-ink);
  --kopf-icon-hover:     var(--ptb-ink);
  --kopf-link-hover:     var(--ptb-black);
  --kopf-droptext-hover: var(--ptb-black);
  --kopf-cta-flaeche:    var(--ptb-cta);
  --kopf-cta-rand:       var(--ptb-cta);
  --kopf-menue-flaeche:  var(--ptb-menue-sticky);
  --kopf-trenner:        var(--ptb-trenner-zart);
  --kopf-pad-oben:       10px;
  --kopf-pad-unten:      10px;
  --kopf-logo-breite:    200px;
  --kopf-logo-hell:      none;
  --kopf-logo-dunkel:    block;
}
.ptb-footer {
  --fuss-flaeche:     var(--ptb-paper);
  --fuss-linie:       var(--ptb-line);
  --fuss-linie-stark: var(--ptb-ink);
  --fuss-text:        var(--ptb-fuss-text);
  --fuss-text-dunkel: var(--ptb-fuss-dunkel);
  --fuss-text-stark:  var(--ptb-black);
  --fuss-icon:        var(--ptb-gold);
  --fuss-icon-hover:  var(--ptb-gold);
  --fuss-link-hover:  var(--ptb-cta);
  --fuss-cta:         var(--ptb-cta);
  --fuss-cta-hover:   var(--ptb-fuss-text);
  --fuss-cta-text:    var(--ptb-white);
}

/* ===========================================================================
   Schicht 2 — Schriften · place to be
   Self-hosted woff2 aus dem Prototyp. Brand Stylist Display/Script (Breakdance-
   Uploads), Outfit + Karla (Google, lokal), ivypresto-display, aw-conqueror-didot
   und ballinger-x-condensed (Typekit-Schnitte, lokal) — Lizenz der Typekit-Schnitte
   vor Live klären.
   =========================================================================== */
@font-face { font-family: "Brand Stylist Display"; src: url("../fonts/BrandStylistDisplay.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Brand Stylist Script"; src: url("../fonts/BrandStylistScript.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Outfit"; src: url("../fonts/Outfit-Variable.woff2") format("woff2"); font-weight: 200 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Karla"; src: url("../fonts/Karla-Variable.woff2") format("woff2"); font-weight: 300 600; font-style: normal; font-display: swap; }
@font-face { font-family: "ivypresto-display"; src: url("../fonts/ivypresto-n400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "ivypresto-display"; src: url("../fonts/ivypresto-i400.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "ivypresto-display"; src: url("../fonts/ivypresto-i100.woff2") format("woff2"); font-weight: 100; font-style: italic; font-display: swap; }
@font-face { font-family: "aw-conqueror-didot"; src: url("../fonts/awconqueror-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "ballinger-x-condensed"; src: url("../fonts/ballinger-x-condensed-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }

:root {
  /* Rollen — eine Familie, eine Aufgabe (siehe Paket-Readme „Type“) */
  --font-display:   "Brand Stylist Display", "Didot", Georgia, serif;
  --font-script:    "Brand Stylist Script", "Snell Roundhand", cursive;
  --font-body:      "Outfit", ui-sans-serif, system-ui, sans-serif;
  --font-karla:     "Karla", "Outfit", ui-sans-serif, system-ui, sans-serif;
  --font-ivy:       "ivypresto-display", Georgia, serif;
  --font-awc:       "aw-conqueror-didot", "Didot", Georgia, serif;
  --font-condensed: "ballinger-x-condensed", "Outfit", sans-serif;

  /* Typo-Skala (Kit-Namen) — Werte aus dem Prototyp */
  --h1-size: 150px;       --h1-lh: .9;   --h1-weight: 100; --h1-tracking: 0;
  --h2-size: var(--t-h2); --h2-lh: .9;   --h2-weight: 100; --h2-tracking: 0;
  --h3-size: 46px;        --h3-lh: .95;  --h3-weight: 400; --h3-tracking: 0;
  --h4-size: 34px;        --h4-lh: 1.15; --h4-weight: 300; --h4-tracking: 0;
  --h5-size: 22px;        --h5-lh: 1.25; --h5-weight: 400; --h5-tracking: .03em;
  --h6-size: 15px;        --h6-lh: 1.4;  --h6-weight: 400; --h6-tracking: .05em;
  --body-size: 19px; --body-lh: 1.6; --body-weight: 300;
  --caption-size: 13px; --caption-lh: 1.45; --caption-weight: 300; --caption-tracking: .02em;
}
@media (max-width: 767px) {
  :root { --h1-size: 57px; }
}

/* ===========================================================================
   Schicht 3 — Basis · place to be
   Element-Defaults und Seitenverhalten aus dem Prototyp, Kit-Klassen für die
   Musterseite. Liest nur Tokens.
   =========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
html, body { overflow-x: clip; }   /* statt hidden: sticky bleibt funktionsfähig */
body {
  margin: 0;
  background: var(--surface-page);
  color: var(--text-body);
  font-family: var(--font-body);
  font-weight: 300;
  font-size: var(--body-size);
  line-height: var(--body-lh);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; display: block; }
button { font: inherit; color: inherit; }
h1, h2, h3 { font-family: var(--font-display); font-weight: 400; letter-spacing: 0; margin: 0; }
/* Absätze tragen keinen eigenen Außenabstand (Bauplan §g) */
p { margin: 0; }

/* --- Korn: die eine Textur der Marke (fixiert, nie auf scrollenden Flächen) --- */
.ptb-korn {
  position: fixed; inset: 0; z-index: 60; pointer-events: none; opacity: .035;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>");
  mix-blend-mode: multiply;
}

/* --- Container: 1300 px Inhalt, 20 px Rand (Breakdance-Raster der Live-Seite) --- */
.ptb-container { width: min(100% - 2 * var(--container-pad), var(--container-max)); margin-inline: auto; }

/* --- Einblendung beim Scrollen (Verhalten: core/reveal.js) ------------------ */
[data-ptb-reveal] {
  opacity: 0; transform: translateY(28px); filter: blur(6px);
  transition: opacity .9s var(--ease-out), transform .9s var(--ease-out), filter .9s var(--ease-out);
}
[data-ptb-reveal="sichtbar"] { opacity: 1; transform: none; filter: none; }
[data-ptb-entrance] { opacity: 0; transition: opacity .9s var(--ease-out), transform .9s var(--ease-out); }
[data-ptb-entrance="fade"] { transform: translateY(-16px); }
[data-ptb-entrance="flipDown"] { transform: perspective(900px) rotateX(-38deg) translateY(-14px); transform-origin: 50% 0; }
[data-ptb-entrance="flipUp"] { transform: perspective(900px) rotateX(38deg) translateY(14px); transform-origin: 50% 100%; }
/* Fußzeile: Breakdance „slideDown“ (100 px, 500 ms, power1.out) */
[data-ptb-entrance="slideDown"] { transform: translateY(-100px); transition-duration: .5s; transition-timing-function: cubic-bezier(.25,.46,.45,.94); }
[data-ptb-entrance][data-ptb-drin] { opacity: 1; transform: none; }
/* Ohne JavaScript bleibt nichts unsichtbar */
.no-js [data-ptb-reveal], .no-js [data-ptb-entrance] { opacity: 1; transform: none; filter: none; }

/* --- Typo-Skala als Klassen (Musterseite, künftige Seiten) ------------------ */
.ptb-h1, .ptb-h3, .ptb-h4, .ptb-h5, .ptb-h6 { margin: 0; color: var(--text-strong); font-family: var(--font-display); }
.ptb-h1 { font-size: var(--h1-size); line-height: var(--h1-lh); letter-spacing: var(--h1-tracking); font-weight: var(--h1-weight); }
.ptb-h3 { font-size: var(--h3-size); line-height: var(--h3-lh); letter-spacing: var(--h3-tracking); font-weight: var(--h3-weight); }
.ptb-h4 { font-family: var(--font-body); font-size: var(--h4-size); line-height: var(--h4-lh); letter-spacing: var(--h4-tracking); font-weight: var(--h4-weight); }
.ptb-h5 { font-family: var(--font-body); font-size: var(--h5-size); line-height: var(--h5-lh); letter-spacing: var(--h5-tracking); font-weight: var(--h5-weight); text-transform: uppercase; }
.ptb-h6 { font-family: var(--font-body); font-size: var(--h6-size); line-height: var(--h6-lh); letter-spacing: var(--h6-tracking); font-weight: var(--h6-weight); text-transform: uppercase; }
.ptb-body    { font-size: var(--body-size); line-height: var(--body-lh); font-weight: var(--body-weight); }
.ptb-caption { font-size: var(--caption-size); line-height: var(--caption-lh); letter-spacing: var(--caption-tracking); color: var(--text-muted); }
.ptb-measure { max-width: var(--content-measure); }
.ptb-flow > * + * { margin-block-start: var(--space-3); }
.ptb-flow > * { margin-block: 0; }

/* --- Links ----------------------------------------------------------------- */
.ptb-link { color: var(--text-link); text-decoration: none; }
.ptb-link:hover { color: var(--text-link-hover); text-decoration: underline; text-underline-offset: 2px; }

/* --- Globaler Tastatur-Fokus ------------------------------------------------ */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: var(--focus-ring-width) solid var(--focus-ring);
  outline-offset: var(--focus-ring-offset);
}

/* --- Musterseiten-Fläche (ui-kit) -------------------------------------------- */
.ptb-section { padding-block: var(--space-7); background: var(--surface-page); color: var(--text-body); }

/* --- Icon-Sprite, Screenreader ------------------------------------------------ */
.ptb-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.ptb-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}

/* --- Bewegungsreduktion ------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  [data-ptb-reveal] { opacity: 1; transform: none; filter: none; transition: none; }
  [data-ptb-entrance] { opacity: 1; transform: none; transition: none; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* ===========================================================================
   Schicht 4 — Basis-Komponenten · place to be
   Button-Kanon (Chris, 02.09.): Versaltext, Pfeil nach dem Text, keine Box,
   Hover „Linie zieht neu“. Die vier Zeus-Varianten primary | secondary | ghost |
   link sehen im Kanon gleich aus — die Farbe kommt von der Fläche (--interactive),
   nie von einer Kombinationsregel. Überschriften-Paar Display + Schreibschrift
   über die Tokens --t-h2 / --t-script / --t-versatz.
   Regel: kein Farbwert, kein Schatten, kein Radius als Literal. Nur Tokens.
   =========================================================================== */

/* --- Button ----------------------------------------------------------------- */
.ptb-btn {
  display: inline-flex; align-items: center; gap: 14px;
  cursor: pointer; padding: 0; border: 0; border-radius: 0; background: transparent;
  color: var(--interactive);
  font-family: var(--font-body); font-size: 18px; font-weight: 400; letter-spacing: .06em;
  text-transform: uppercase; line-height: 26px; text-decoration: none; white-space: nowrap;
  transition: color .5s var(--ease);
}
.ptb-btn--primary, .ptb-btn--secondary, .ptb-btn--ghost, .ptb-btn--link { color: var(--interactive); }
.ptb-btn--sm { font-size: 15px; }
.ptb-btn--lg { font-size: 20px; }
.ptb-btn__t {
  display: inline-block; padding-bottom: 5px;
  background-image: linear-gradient(var(--accent), var(--accent)), linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat; background-position: left bottom, left bottom; background-size: 0 1px, 100% 1px;
  transition: background-size .7s var(--ease);
}
.ptb-btn__icon {
  width: auto; height: auto; border: 0; border-radius: 0; background: transparent; color: inherit;
  display: flex; align-items: center; justify-content: center; flex: 0 0 auto;
  transition: transform .6s var(--ease);
}
.ptb-btn svg { width: 22px; height: 22px; stroke: currentColor; fill: none; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.ptb-btn svg.ptb-btn__play { fill: currentColor; stroke: none; width: 16px; height: 16px; margin-left: 2px; }
.ptb-btn:hover .ptb-btn__t { background-size: 100% 1px, 100% 1px; }
.ptb-btn:hover .ptb-btn__icon { transform: translateX(4px); }
.ptb-btn:active .ptb-btn__icon { transform: translateX(2px); }
.ptb-btn:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 4px; }
.ptb-btn:disabled, .ptb-btn[aria-disabled="true"] { color: var(--disabled-fg); cursor: default; pointer-events: none; }
@media (max-width: 767px) {
  .ptb-btn { font-size: 15px; line-height: 22px; letter-spacing: .07em; gap: 12px; }
  .ptb-btn svg { width: 19px; height: 19px; }
  .ptb-btn svg.ptb-btn__play { width: 14px; height: 14px; }
}
@media (pointer: coarse) {
  .ptb-btn { min-height: var(--tap-min); padding: 8px 0; }
}

/* --- Überschriften-Paar (Live-H2-Muster) ------------------------------------- */
.ptb-h2 {
  text-align: center; color: var(--text-strong);
  font-family: var(--font-display); font-size: var(--t-h2); font-weight: 100; line-height: .9em; font-style: normal;
  margin: 15px 0 0;
}
.ptb-h2__script {
  font-family: var(--font-script); display: block; margin-top: var(--t-versatz);
  font-size: var(--t-script); font-weight: 400; color: var(--accent); opacity: 1;
}
.ptb-h2--start { text-align: left; }
@media (max-width: 767px) {
  .ptb-h2 { margin-top: 20px; }
}

/* --- Kicker (Dachzeile über dem Überschriften-Paar, Designpaket „Kicker“) ------
   Outfit 200 in Gold. Steht nur dort, wo die Quelle eine Dachzeile hat — nie als Deko. */
.ptb-kicker {
  margin: 0; color: var(--text-kicker);
  font-family: var(--font-body); font-size: 21px; font-weight: 200; line-height: 1.3; letter-spacing: .02em;
}
@media (max-width: 767px) { .ptb-kicker { font-size: 17px; } }

/* --- Kopf eines Blocks: Kicker + Überschriften-Paar, linksbündig -------------- */
.ptb-blockkopf { display: flex; flex-direction: column; align-items: flex-start; }
.ptb-blockkopf .ptb-h2 { margin-top: 6px; }

/* --- Kit-Komponenten (Musterseite, künftige Seiten) --------------------------- */
/* --- Icon-Button ---------------------------------------------------------- */
.ptb-iconbtn {
  display: inline-flex; align-items: center; justify-content: center;
  width: var(--tap-min); height: var(--tap-min); flex: none;
  border: 1px solid transparent; border-radius: var(--radius-pill);
  background: transparent; color: currentColor; cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.ptb-iconbtn svg { width: 1.5em; height: 1.5em; fill: currentColor; }
.ptb-iconbtn--solid   { background: var(--interactive); color: var(--interactive-fg); }
.ptb-iconbtn--solid:hover { background: var(--interactive-hover); }
.ptb-iconbtn--outline { border-color: var(--border-default); }
.ptb-iconbtn--outline:hover { border-color: var(--border-strong); background: var(--surface-hover); }
.ptb-iconbtn:disabled, .ptb-iconbtn[aria-disabled="true"] {
  opacity: .35; cursor: default; pointer-events: none;
}

/* --- Karte ----------------------------------------------------------------
   Anatomie: media? > body > (title, text, meta?). Die verlinkte Variante ist
   ein <a>, damit die ganze Karte eine einzige Fokus- und Trefferfläche ist.
   -------------------------------------------------------------------------- */
.ptb-card {
  display: flex; flex-direction: column;
  background: var(--surface-card);
  color: var(--text-body);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.ptb-card__media { aspect-ratio: 16 / 10; overflow: hidden; }
.ptb-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ptb-card__body { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4); }
.ptb-card__title { color: var(--text-strong); }
.ptb-card__text  { color: var(--text-muted); margin: 0; }
.ptb-card--link  { text-decoration: none; color: inherit; transition: border-color var(--dur-base) var(--ease); }
.ptb-card--link:hover { border-color: var(--border-strong); }

/* --- Tag und Badge -------------------------------------------------------- */
.ptb-tag {
  display: inline-flex; align-items: center; gap: var(--space-1);
  padding: var(--space-1) var(--space-3);
  border: 1px solid var(--border-default); border-radius: var(--radius-pill);
  background: transparent; font: inherit;
  font-size: var(--caption-size); line-height: 1.3; color: var(--text-body);
}
.ptb-tag--strong { background: var(--interactive); border-color: transparent; color: var(--interactive-fg); }
.ptb-tag--clickable { cursor: pointer; text-decoration: none; }
.ptb-tag--clickable:hover { border-color: var(--border-strong); }
.ptb-tag[aria-pressed="true"] { background: var(--interactive); border-color: transparent; color: var(--interactive-fg); }

.ptb-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 1.5rem; padding: 0 var(--space-1);
  border-radius: var(--radius-pill);
  background: var(--surface-muted); color: var(--text-body);
  font-size: var(--caption-size); font-weight: 600;
}

/* --- Formularfeld ---------------------------------------------------------
   Anatomie: field > label + control + (hint | error). Der Fehlertext wird per
   aria-describedby verknüpft, aria-invalid steuert die Darstellung.
   -------------------------------------------------------------------------- */
.ptb-field { display: flex; flex-direction: column; gap: var(--space-1); }
.ptb-field__label { font-weight: 600; color: var(--text-strong); }
.ptb-field__hint  { font-size: var(--caption-size); color: var(--text-muted); }
.ptb-field__error { font-size: var(--caption-size); color: var(--status-danger); }

.ptb-input, .ptb-textarea, .ptb-select {
  width: 100%; min-height: var(--tap-min);
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--border-default); border-radius: var(--radius-md);
  background: var(--surface-card); color: var(--text-body);
  font: inherit;
  transition: border-color var(--dur-fast) var(--ease);
}
.ptb-textarea { min-height: 8rem; resize: vertical; }
.ptb-input::placeholder, .ptb-textarea::placeholder { color: var(--text-muted); }
.ptb-input:hover, .ptb-textarea:hover, .ptb-select:hover { border-color: var(--border-strong); }
.ptb-input:focus, .ptb-textarea:focus, .ptb-select:focus { border-color: var(--border-interactive); }
.ptb-input[aria-invalid="true"], .ptb-textarea[aria-invalid="true"], .ptb-select[aria-invalid="true"] {
  border-color: var(--status-danger);
}
.ptb-input:disabled, .ptb-textarea:disabled, .ptb-select:disabled {
  background: var(--disabled-bg); color: var(--disabled-fg); cursor: default;
}

/* --- Auswahl (Checkbox und Radio) -----------------------------------------
   Das echte Input bleibt im DOM und fokussierbar; sichtbar ist die Box.
   -------------------------------------------------------------------------- */
.ptb-choice { position: relative; display: inline-flex; align-items: flex-start; gap: var(--space-2); cursor: pointer; }
.ptb-choice input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ptb-choice__box {
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.375rem; height: 1.375rem; flex: none; margin-top: .125rem;
  border: 1px solid var(--border-strong); background: var(--surface-card);
  transition: background-color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.ptb-choice__box--check { border-radius: var(--radius-sm); }
.ptb-choice__box--radio { border-radius: var(--radius-pill); }
.ptb-choice__box svg { width: 1rem; height: 1rem; fill: var(--interactive-fg); opacity: 0; }
.ptb-choice input:checked + .ptb-choice__box { background: var(--interactive); border-color: var(--interactive); }
.ptb-choice input:checked + .ptb-choice__box svg { opacity: 1; }
.ptb-choice input:focus-visible + .ptb-choice__box {
  outline: var(--focus-ring-width) solid var(--focus-ring); outline-offset: var(--focus-ring-offset);
}
.ptb-choice input:disabled + .ptb-choice__box { background: var(--disabled-bg); border-color: var(--border-default); }
.ptb-choice input[aria-invalid="true"] + .ptb-choice__box { border-color: var(--status-danger); }

/* ===========================================================================
   Kopfzeile · place to be — Kopie des Live-Headers (Breakdance-Template 16,
   header.ptbheader), Maße aus tools/quellen-live/kopf-fuss-mass.json.
   Theme-Teil, kein Seitenblock (Bauplan §i). Farben, Innenabstand und Logo-Wechsel
   kommen aus den Kontext-Tokens .ptb-header / [data-ptb-sticky] / --on-color in
   tokens.css; Verhalten: header.js. Breakpoints der Live-Seite: 1119 / 1023 / 768 / 767.
   =========================================================================== */
.ptb-skip {
  position: fixed; left: var(--space-3); top: var(--space-3); z-index: 300;
  transform: translateY(-200%);
  padding: var(--space-2) var(--space-3);
  background: var(--surface-card); color: var(--text-strong);
  border: 1px solid var(--border-strong); border-radius: var(--radius-md);
  text-decoration: none;
}
.ptb-skip:focus-visible { transform: none; }
/* Sprungziele landen unter der festen Kopfzeile (Sticky-Höhe 73 bzw. 66 px) */
:where(#inhalt [id]) { scroll-margin-top: 74px; }
@media (max-width: 767px) { :where(#inhalt [id]) { scroll-margin-top: 67px; } }
/* --- Rahmen ------------------------------------------------------------------ */
.ptb-header {
  position: fixed; top: 0; left: 0; z-index: 200;
  width: 100%;
  border-bottom: 1px solid var(--kopf-linie);
  background: var(--kopf-flaeche);
  color: var(--kopf-text);
  font-family: var(--font-karla); font-size: 16px; font-weight: 300; line-height: 1.4;
  transition: background-color .3s ease;
}
.ptb-header__inner {
  display: flex; gap: 32px;
  margin: 0 auto;
  padding: var(--kopf-pad-oben) 50px var(--kopf-pad-unten);
}
@media (max-width: 1119px) { .ptb-header__inner { padding-inline: 30px; } }
@media screen and (max-width: 768px) { .ptb-header__inner { gap: 0; } }
@media (max-width: 767px) { .ptb-header__inner { padding-inline: 20px; } }
.ptb-header__spalte { display: flex; }
.ptb-header__spalte--links { width: calc(33% - 64px / 3); flex-flow: row wrap; align-items: center; justify-content: flex-start; }
.ptb-header__spalte--mitte { width: calc(34% - 64px / 3); flex-direction: column; align-items: center; text-align: center; }
.ptb-header__spalte--rechts { width: calc(33% - 64px / 3); flex-flow: row wrap; align-items: center; justify-content: flex-end; gap: 20px; }
@media (max-width: 767px) {
  .ptb-header__spalte--links { display: none; }
  .ptb-header__spalte--mitte { width: 50%; align-items: flex-start; text-align: left; }
  .ptb-header__spalte--rechts { width: 50%; }
}
/* Auftritt beim Laden (animate.css „slideInDownFadeIn“, 1 s) */
@keyframes ptb-kopf-auftritt {
  from { opacity: 0; transform: translateY(-30%); }
  to   { opacity: 1; transform: none; }
}
[data-ptb-kopf-auftritt] { animation: ptb-kopf-auftritt 1s ease both; }
/* --- Links: Telefon, Mail, Instagram (Text klappt beim Überfahren aus) --------- */
.ptb-header__kontakt {
  display: flex; flex-flow: row wrap; justify-content: flex-start; align-items: center; gap: 16px;
  margin: 0; padding: 0; list-style: none;
}
.ptb-header__kontaktlink { display: flex; align-items: center; gap: 8px; overflow: hidden; color: inherit; text-decoration: none; }
.ptb-header__kontakticon {
  display: block; flex: none; width: 23px; height: 23px;
  fill: currentColor; stroke: currentColor; stroke-width: 0;
  color: var(--kopf-icon); transition: color .5s;
}
.ptb-header__kontakt li:first-child .ptb-header__kontakticon { width: 17px; height: 17px; stroke-width: 20px; }
.ptb-header__kontaktlink:hover .ptb-header__kontakticon { color: var(--kopf-icon-hover); }
.ptb-header__kontakttext {
  display: block; width: 1px; height: 25px; overflow: hidden;
  opacity: 0; transform: translateX(-300px);
  color: var(--kopf-text);
  font-family: var(--font-condensed); font-size: 18px; font-weight: 300; line-height: 1.4; text-transform: uppercase;
  transition: .5s;
}
.ptb-header__kontaktlink:hover .ptb-header__kontakttext,
.ptb-header__kontaktlink:focus-visible .ptb-header__kontakttext { width: 160px; opacity: 1; transform: translateX(5px); }
/* --- Mitte: Logo hell (Ruhe) / dunkel (Sticky) ------------------------------- */
.ptb-header__marke { width: var(--kopf-logo-breite); max-width: 100%; }
.ptb-header__marke--hell { display: var(--kopf-logo-hell); }
.ptb-header__marke--dunkel { display: var(--kopf-logo-dunkel); }
.ptb-header__marke img { width: 100%; height: auto; }
/* --- Rechts: Anfrage-Knopf ---------------------------------------------------- */
.ptb-header__cta-rahmen { display: inline-block; }
.ptb-header__cta-rahmen--schmal { display: none; }
@media (max-width: 1023px) {
  .ptb-header__cta-rahmen--breit { display: none; }
  .ptb-header__cta-rahmen--schmal { display: inline-block; }
}
.ptb-header__cta {
  position: relative; display: inline-block; overflow: hidden;
  padding: 11px 35px;
  border: 1px solid var(--kopf-cta-rand); border-radius: 0;
  background: var(--kopf-cta-flaeche); color: var(--kopf-cta-text);
  font-family: var(--font-condensed); font-size: 21px; font-weight: 400; line-height: 1;
  text-align: center; text-transform: uppercase; text-decoration: none;
  transition: all .3s ease-in-out;
}
.ptb-header__cta:hover { transform: scale(1.05); }
@media (max-width: 767px) { .ptb-header__cta { padding: 10px 20px; font-size: 15px; } }
.ptb-header__cta-text { display: block; transition: transform .3s ease-in-out, opacity .3s ease-in-out; }
/* Folgetext „Bei placetobe“ schiebt sich beim Überfahren von unten herein */
.ptb-header__cta-folge {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transform: translateY(100%); pointer-events: none;
  transition: transform .3s ease-in-out, opacity .3s ease-in-out;
}
.ptb-header__cta--folge:hover .ptb-header__cta-text { opacity: 0; transform: translateY(-100%); }
.ptb-header__cta--folge:hover .ptb-header__cta-folge { opacity: 1; transform: none; }
/* --- Rechts: Menü-Knopf („vortex“, zwei Pixel starke Linien) ----------------- */
.ptb-header__nav { display: flex; }
.ptb-header__toggle {
  display: flex; align-items: center;
  min-height: 32px; box-sizing: content-box;
  /* 44-px-Tippfläche ohne Verschiebung: 6 px Innenabstand, −6 px Außenabstand */
  margin: -6px; padding: 6px;
  border: 0; background: transparent; color: var(--kopf-text);
  cursor: pointer; backface-visibility: hidden;
  transition: color .3s, background-color .3s;
}
.ptb-header__toggle-icon { position: relative; display: inline-block; width: 32px; height: 24px; }
.ptb-header__toggle-linien,
.ptb-header__toggle-linien::before,
.ptb-header__toggle-linien::after {
  content: ""; position: absolute; display: block;
  width: 32px; height: 2px; border-radius: 0;
  background-color: currentColor;
  transition: transform .15s;
}
.ptb-header__toggle-linien { top: 50%; margin-top: -2px; transition-duration: .2s; transition-timing-function: cubic-bezier(.19,1,.22,1); }
.ptb-header__toggle-linien::before { top: -10px; transition: top 0s linear .1s, opacity 0s linear .1s; }
.ptb-header__toggle-linien::after { bottom: -10px; transition: bottom 0s linear .1s, transform 0s linear .1s; }
.ptb-header__toggle[aria-expanded="true"] .ptb-header__toggle-linien { transform: rotate(765deg); }
.ptb-header__toggle[aria-expanded="true"] .ptb-header__toggle-linien::before { top: 0; opacity: 0; transition-delay: 0s; }
.ptb-header__toggle[aria-expanded="true"] .ptb-header__toggle-linien::after { bottom: 0; transform: rotate(90deg); transition-delay: 0s; }
/* --- Menü: klappt unter der Kopfzeile auf (Höhen-Animation in header.js) ----- */
.ptb-header__menue {
  position: absolute; top: calc(100% + 1px); left: 0; z-index: 1000;
  display: flex; flex-direction: column; align-items: stretch;
  width: 100%;
  max-height: calc(100dvh - var(--ptb-kopf-unterkante, 106px)); overflow-y: auto;
  margin: 0; padding: 0; list-style: none;
  background: var(--kopf-menue-flaeche);
  -webkit-backdrop-filter: blur(32px); backdrop-filter: blur(32px);
}
.ptb-header__menue:not([data-ptb-zustand]),
.ptb-header__drop:not([data-ptb-zustand]) { height: 0; overflow: hidden; visibility: hidden; pointer-events: none; }
.ptb-header__menue[data-ptb-zustand="bewegt"],
.ptb-header__drop[data-ptb-zustand="bewegt"] { height: var(--ptb-hoehe, 0px); overflow: hidden; transition: height .3s ease; }
@media screen and (min-width: 769px) {
  .ptb-header__menue { flex-direction: row; border-bottom: 1px solid var(--kopf-trenner); }
  .ptb-header__punkt { flex: 1 1 0; padding-left: 35px; border-right: 1px solid var(--kopf-trenner); }
}
@media screen and (max-width: 768px) { .ptb-header__menue { padding-bottom: 20px; } }
.ptb-header__punkt { position: relative; transition: .3s; }
.ptb-header__link {
  position: relative; z-index: 1;
  display: flex; flex: 1 1 0%; align-items: center; justify-content: space-between;
  width: 100%; margin: 0; padding: 20px;
  border: 0; background: transparent; color: var(--kopf-text);
  font-family: var(--font-condensed); font-size: 20px; font-weight: 500; line-height: 1;
  text-align: left; text-transform: uppercase; text-decoration: none; white-space: nowrap;
  cursor: pointer; user-select: none;
  transition: .5s;
}
@media screen and (max-width: 768px) { .ptb-header__link { padding-bottom: 0; } }
.ptb-header__punkt:hover > .ptb-header__link { color: var(--kopf-link-hover); letter-spacing: 5px; }
/* Pfeil der Untermenüs: liegt über dem rechten Ende des Knopfs, dreht beim Öffnen */
.ptb-header__pfeil { position: absolute; top: 0; right: 0; bottom: 0; display: block; padding: 20px 20px 20px 0; }
.ptb-header__pfeil::after {
  content: ""; display: block; width: 20px; height: 20px; margin-left: 8px;
  background-color: var(--kopf-text);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M441.9 167.3l-19.8-19.8c-4.7-4.7-12.3-4.7-17 0L224 328.2 42.9 147.5c-4.7-4.7-12.3-4.7-17 0L6.1 167.3c-4.7 4.7-4.7 12.3 0 17l209.4 209.4c4.7 4.7 12.3 4.7 17 0l209.4-209.4c4.7-4.7 4.7-12.3 0-17z'/%3E%3C/svg%3E") center / cover no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M441.9 167.3l-19.8-19.8c-4.7-4.7-12.3-4.7-17 0L224 328.2 42.9 147.5c-4.7-4.7-12.3-4.7-17 0L6.1 167.3c-4.7 4.7-4.7 12.3 0 17l209.4 209.4c4.7 4.7 12.3 4.7 17 0l209.4-209.4c4.7-4.7 4.7-12.3 0-17z'/%3E%3C/svg%3E") center / cover no-repeat;
  transition: transform .3s ease, background-color .3s ease;
}
.ptb-header__link[aria-expanded="true"] .ptb-header__pfeil::after { transform: rotate(-180deg); }
/* --- Untermenüs ---------------------------------------------------------------- */
.ptb-header__dropliste { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.ptb-header__droplink { display: flex; align-items: center; justify-content: space-between; padding: 12px 30px 0; line-height: 1.5; text-decoration: none; }
.ptb-header__droptext {
  color: var(--kopf-text);
  font-family: var(--font-karla); font-size: 14px; font-weight: 300; line-height: 1.5; text-transform: uppercase;
  transition: color .3s;
}
@media (min-width: 768px) {
  .ptb-header__droplink { padding: 0 30px 6px 21px; }
  .ptb-header__droptext { font-family: var(--font-condensed); font-size: 20px; }
  .ptb-header__droplink:hover .ptb-header__droptext { color: var(--kopf-droptext-hover); }
}
@media screen and (min-width: 769px) { .ptb-header__dropliste { padding-bottom: 15px; } }
/* ===========================================================================
   Fußzeile · place to be — Kopie des Live-Footers (Breakdance-Template 391:
   Leiste 181 + Block 100), Maße aus tools/quellen-live/kopf-fuss-mass.json.
   Theme-Teil, kein Seitenblock (Bauplan §i). Farben aus den Kontext-Tokens .ptb-footer
   in tokens.css. Unter 1024 px senkrecht gestapelt — die Mobilregeln stehen am
   Dateiende, siehe dortigen Kommentar.
   =========================================================================== */
.ptb-footer {
  background: var(--fuss-flaeche); color: var(--fuss-text);
  font-family: var(--font-karla); font-size: 16px; font-weight: 300; line-height: 1.4;
}
/* --- Leiste: Rechtliches · Instagram + Bewerten · Copyright ---------------------- */
.ptb-footer__leiste { padding: 10px 20px; border-top: 1px solid var(--fuss-linie); }
.ptb-footer__spalten { display: flex; gap: 32px; width: 100%; }
.ptb-footer__spalte { display: flex; width: calc(33.33% - 64px / 3); }
.ptb-footer__spalte--recht { flex-direction: column; align-items: flex-start; }
.ptb-footer__spalte--mitte { flex-flow: row wrap; align-items: flex-start; justify-content: center; gap: 15px; }
.ptb-footer__spalte--rechts { width: calc(33.34% - 64px / 3); flex-flow: row wrap; align-items: flex-start; justify-content: flex-end; }
@media (max-width: 1119px) {
  .ptb-footer__spalten { flex-direction: column; gap: 15px; }
  .ptb-footer__spalte { width: 100%; }
  .ptb-footer__spalte--recht,
  .ptb-footer__spalte--rechts { align-items: center; justify-content: center; text-align: center; }
}
.ptb-footer__recht { font-family: var(--font-condensed); text-transform: uppercase; }
.ptb-footer__rechtlink { color: var(--fuss-text); text-decoration: none; }
.ptb-footer__rechtlink:hover { color: var(--fuss-link-hover); }
.ptb-footer__insta { display: flex; }
.ptb-footer__insta-link { display: flex; align-items: center; gap: 8px; text-decoration: none; }
.ptb-footer__insta-icon {
  display: block; flex: none; width: 15px; height: 15px;
  fill: currentColor; stroke: currentColor; stroke-width: 8px;
  color: var(--fuss-text-dunkel);
}
.ptb-footer__insta-link:hover .ptb-footer__insta-icon { color: var(--fuss-icon-hover); }
.ptb-footer__insta-text { color: var(--fuss-text-dunkel); font-family: var(--font-condensed); font-size: 16px; font-weight: 300; text-transform: uppercase; }
/* „Jetzt bewerten“: fünf Sterne schieben sich beim Überfahren herein */
.ptb-footer__bewerten { display: flex; flex-flow: row wrap; justify-content: flex-start; gap: 1px; color: var(--fuss-link-hover); text-decoration: none; }
.ptb-footer__bewerten-text { margin-right: 5px; color: var(--fuss-text-dunkel); font-family: var(--font-condensed); text-transform: uppercase; }
.ptb-footer__sterne { display: flex; flex-direction: column; align-items: flex-start; width: 1px; height: 21px; overflow: hidden; transition: width .5s; }
.ptb-footer__sterne-reihe { display: flex; flex-flow: row wrap; justify-content: flex-start; margin-top: 1px; transform: translateX(-100px); transition: 1s ease-in-out; }
.ptb-footer__bewerten:hover .ptb-footer__sterne,
.ptb-footer__bewerten:focus-visible .ptb-footer__sterne { width: 81px; transition: .5s ease-in-out; }
.ptb-footer__bewerten:hover .ptb-footer__sterne-reihe,
.ptb-footer__bewerten:focus-visible .ptb-footer__sterne-reihe { transform: none; transition: .5s ease-in-out; }
.ptb-footer__stern { display: block; flex: none; width: 15px; height: 15px; margin-top: 2px; fill: currentColor; }
.ptb-footer__copy,
.ptb-footer__orte { color: var(--fuss-text-dunkel); font-family: var(--font-condensed); text-align: justify; text-transform: uppercase; }
.ptb-footer__ortlink,
.ptb-footer__ortlink:hover { color: var(--fuss-text-dunkel); text-decoration: none; }
/* --- Block: Logo · Verwaltung · Standorte · Anfrage ------------------------------ */
.ptb-footer__block { display: flex; width: 100%; }
.ptb-footer__zelle {
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
  background: var(--fuss-flaeche);
  border-top: 1px solid var(--fuss-linie); border-bottom: 1px solid var(--fuss-linie);
}
.ptb-footer__zelle--logo { width: 18.13%; flex-flow: row wrap; align-items: center; justify-content: flex-start; padding: 10px 20px; }
.ptb-footer__zelle--verwaltung { width: 47.41%; padding: 10px 20px 10px 40px; border-left: 1px solid var(--fuss-linie); border-right: 1px solid var(--fuss-linie); }
.ptb-footer__zelle--standorte { width: 23.13%; padding: 10px 40px; border-right: 1px solid var(--fuss-linie); }
.ptb-footer__zelle--cta { width: 11.33%; align-items: center; justify-content: center; border: 0; background: var(--fuss-cta); text-align: center; }
@media (max-width: 1119px) {
  .ptb-footer__zelle--logo { justify-content: space-between; padding-inline: 30px; border-bottom-color: var(--fuss-linie-stark); }
  .ptb-footer__zelle--verwaltung { padding-inline: 30px; }
  .ptb-footer__zelle--standorte { padding-inline: 30px; border-right: 0; }
  .ptb-footer__zelle--cta { padding-block: 20px 15px; }
}
.ptb-footer__logo { width: 200px; height: auto; margin-bottom: 8px; }
.ptb-footer__label { color: var(--fuss-text-dunkel); font-family: var(--font-condensed); text-transform: uppercase; }
.ptb-footer__liste { display: flex; flex-flow: row wrap; justify-content: left; align-items: center; width: 100%; margin: 0; padding: 0; list-style: none; }
.ptb-footer__liste--kontakt { gap: 16px; }
.ptb-footer__liste--standorte { gap: 10px; }
.ptb-footer__eintrag { display: flex; align-items: flex-start; gap: 5px; text-decoration: none; }
.ptb-footer__liste--standorte .ptb-footer__eintrag { gap: 13px; }
.ptb-footer__icon {
  display: block; flex: none; width: 14px; height: 14px;
  fill: currentColor; stroke: currentColor; stroke-width: 0;
  color: var(--fuss-icon); transform: translateY(5px);
}
.ptb-footer__eintragtext {
  color: var(--fuss-text-stark);
  font-family: var(--font-condensed); font-size: 17px; font-weight: 200; line-height: 1.4; text-transform: uppercase;
}
.ptb-footer__eintrag:hover .ptb-footer__eintragtext { color: var(--fuss-link-hover); }
.ptb-footer__cta {
  display: flex; align-items: center; justify-content: center;
  width: 100%; min-height: 100%;
  background: var(--fuss-cta); color: var(--fuss-cta-text);
  font-family: var(--font-condensed); font-size: 20px; font-weight: 300; line-height: 1.4;
  text-align: center; text-transform: uppercase; text-decoration: none;
  transition: background-color .3s ease-in-out;
}
.ptb-footer__cta:hover { background: var(--fuss-cta-hover); }
@media (max-width: 1119px) { .ptb-footer__cta { font-size: 18px; } }
/* --- Mobil unter 1024 px: senkrecht gestapelt, Reihenfolge wie live --------------
   Vorbild ist das Seitenende von placetobe.com bei 390 px: Logo, darunter das
   Rechtliche mit Copyright und den Eventlocation-Links, darunter Standorte und
   Kontakt. Der Anfrage-Knopf fehlt dort — im Kopf sitzt einer.
   Dieser Abschnitt muss am Dateiende bleiben: eine Media-Query erhöht die
   Spezifität nicht, also entscheidet allein die Reihenfolge im Stylesheet.
   Stand bis 12.09.2026 war hier ein `display: none`, das weiter oben stand und
   deshalb von den Basisregeln geschlagen wurde — der Block blieb mobil
   vierspaltig stehen.
   -------------------------------------------------------------------------- */
@media (max-width: 1023px) {
  .ptb-footer { display: flex; flex-direction: column; }

  /* Zellen aus dem Block lösen, damit sie mit der Leiste in eine Reihenfolge kommen */
  .ptb-footer__block { display: contents; }
  .ptb-footer__zelle--logo { order: 1; }
  .ptb-footer__leiste { order: 2; }
  .ptb-footer__zelle--standorte { order: 3; }
  .ptb-footer__zelle--verwaltung { order: 4; }
  .ptb-footer__zelle--cta { display: none; }

  .ptb-footer__zelle { width: 100%; padding: 16px 20px; border-left: 0; border-right: 0; }

  /* Standorte und Kontakt untereinander wie live, nicht in eine umbrechende Reihe */
  .ptb-footer__liste { flex-flow: column nowrap; align-items: flex-start; }

  /* Trennlinien nach unten drehen, keine doppelten Kanten an den Stoßstellen */
  .ptb-footer__zelle--logo { justify-content: flex-start; border-bottom: 0; }
  .ptb-footer__zelle--standorte { border-bottom: 0; }
  .ptb-footer__zelle--verwaltung { border-bottom: 1px solid var(--fuss-linie); }

  /* Leiste linksbündig wie live, nicht zentriert wie im Tablet-Bereich */
  .ptb-footer__spalte--recht,
  .ptb-footer__spalte--rechts { align-items: flex-start; justify-content: flex-start; text-align: left; }
  .ptb-footer__spalte--mitte { justify-content: flex-start; }
  .ptb-footer__copy,
  .ptb-footer__orte { text-align: left; }
}
/* --- Siegel über der Fußzeile (Live-Section 391-206: EventInc „5 Sterne“) --------------- */
.ptb-footer__siegel { display: flex; justify-content: center; padding: 48px 20px 40px; border-top: 1px solid var(--fuss-linie); }
.ptb-footer__siegel-link { display: inline-block; line-height: 0; }
.ptb-footer__siegel-bild { width: 100px; height: 100px; }
/* ===========================================================================
   Schicht 5 — cb15-danke
   Danke-Seite nach dem Absenden (eigene URL mit „danke“: die Meta-Custom-Conversion
   „Anfrage gesendet“ zählt nur dort). Übertragen aus danke.html des Prototyps; Buttons
   im Kanon „Nur Pfeil“ statt der alten Pill-Form.
   =========================================================================== */
.ptb-danke { min-height: 100dvh; display: flex; align-items: center; padding: 40px 0 80px; background: var(--surface-muted); color: var(--text-strong); }
.ptb-danke__schale { width: min(100% - 40px, 860px); margin-inline: auto; }
.ptb-danke__haken {
  width: 56px; height: 56px; border-radius: var(--radius-pill); border: 1px solid rgba(181,156,130,.55);
  display: flex; align-items: center; justify-content: center; background: rgba(214,182,146,.16);
  animation: ptb-danke-auf .8s var(--ease) both;
}
.ptb-danke__haken svg { width: 22px; height: 22px; stroke: var(--text-kicker); fill: none; stroke-width: 1.4; }
@keyframes ptb-danke-auf { from { opacity: 0; transform: scale(.8); } to { opacity: 1; transform: none; } }
.ptb-danke__titel { font-family: var(--font-display); font-weight: 400; font-size: clamp(2.6rem, 6vw, 4.4rem); line-height: 1; margin: 30px 0 0; letter-spacing: 0; color: var(--text-strong); }
.ptb-danke__titel-script { font-family: var(--font-script); font-style: normal; color: var(--text-kicker); display: block; font-size: .9em; line-height: 1.1; margin-top: .06em; }
.ptb-danke__text { margin: 22px 0 0; color: var(--text-soft); max-width: 56ch; font-size: 17px; line-height: 1.62; }
.ptb-danke__reihe { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 34px; margin-top: 38px; }
.ptb-danke__zusammen { margin-top: 52px; border-top: 1px solid rgba(76,69,61,.14); padding-top: 26px; }
.ptb-danke__zusammen-titel { font-family: var(--font-display); font-weight: 400; font-size: 1.4rem; margin: 0 0 14px; color: var(--text-strong); }
.ptb-danke__liste { margin: 0; }
.ptb-danke__zeile { display: flex; justify-content: space-between; gap: 20px; padding: 9px 0; border-bottom: 1px solid rgba(76,69,61,.09); font-size: 14.5px; }
.ptb-danke__zeile dt { color: var(--text-muted); }
.ptb-danke__zeile dd { margin: 0; text-align: right; }
@media (min-width: 768px) {
  .ptb-danke__schale { width: min(100% - 64px, 860px); }
}
@media (prefers-reduced-motion: reduce) {
  .ptb-danke__haken { animation: none; }
}
/* ===========================================================================
   Schicht 5 — formular
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-formular { background:rgba(251,247,242,.10); border:1px solid rgba(251,247,242,.20); border-radius:var(--radius-frame); padding:8px; box-shadow:0 42px 90px -40px rgba(10,8,6,.62); backdrop-filter:blur(2px); }
.ptb-formular--hell { background:rgba(76,69,61,.05); border-color:rgba(76,69,61,.12); box-shadow:0 34px 70px -44px rgba(76,69,61,.5); backdrop-filter:none; }
.ptb-formular__karte { background:var(--surface-muted); border-radius:var(--radius-frame-in); box-shadow:inset 0 1px 1px rgba(255,255,255,.7); padding:30px 30px 26px; position:relative; overflow:hidden; }
.ptb-formular--hell .ptb-formular__karte { background:var(--surface-page); }
.ptb-formular__form { margin-top:22px; position:relative; }
.ptb-formular__schritt { display:block; animation:ptb-einblenden .5s var(--ease-out) both; }
@keyframes ptb-einblenden { from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)} }
.ptb-formular__frage { font-family:var(--font-display); font-size:1.9rem; line-height:1.08; margin-bottom:6px; }
.ptb-formular__hinweis { font-size:14px; font-weight:300; color:var(--text-muted); margin-bottom:18px; }
.ptb-formular__kacheln { display:grid; grid-template-columns:1fr; gap:9px; }
.ptb-formular__kacheln--eng { grid-template-columns:1fr; }
@media (min-width:520px) {
  .ptb-formular__kacheln { grid-template-columns:1fr 1fr; }
  .ptb-formular__kacheln--eng { grid-template-columns:1fr; }
}
.ptb-formular__kachel { display:block; text-align:left; width:100%; padding:13px 16px; border-radius:14px; cursor:pointer; background:var(--surface-page); border:1px solid var(--border-subtle); transition:border-color .45s var(--ease),transform .45s var(--ease),box-shadow .45s var(--ease),background .45s var(--ease); }
.ptb-formular--hell .ptb-formular__kachel { background:var(--surface-muted); }
.ptb-formular__kachel:hover { border-color:var(--accent-deep); transform:translateY(-2px); box-shadow:0 14px 26px -18px rgba(76,69,61,.5); }
.ptb-formular__kachel:active { transform:translateY(0) scale(.985); }
.ptb-formular__kachel:focus-visible { outline:2px solid var(--accent-deep); outline-offset:2px; }
.ptb-formular__kachel-label { font-weight:400; font-size:15px; line-height:1.3; display:block; }
.ptb-formular__kachel-sub { font-size:12.5px; font-weight:300; color:var(--text-muted); line-height:1.35; display:block; margin-top:2px; }
.ptb-formular__kachel[aria-pressed="true"] { background:var(--text-strong); border-color:var(--text-strong); }
.ptb-formular__kachel[aria-pressed="true"] .ptb-formular__kachel-label { color:var(--surface-muted); }
.ptb-formular__kachel[aria-pressed="true"] .ptb-formular__kachel-sub { color:rgba(251,247,242,.62); }
.ptb-formular__kachel--preis .ptb-formular__kachel-preis { font-weight:400; font-size:1rem; color:var(--accent-deep); display:block; margin-top:3px; }
.ptb-formular__kachel[aria-pressed="true"] .ptb-formular__kachel-preis { color:var(--accent); }
.ptb-formular__pakete { display:grid; grid-template-columns:1fr; gap:9px; }
.ptb-formular__paket { background:var(--surface-page); border:1px solid var(--border-subtle); border-radius:14px; overflow:hidden; transition:border-color .45s var(--ease); }
.ptb-formular--hell .ptb-formular__paket { background:var(--surface-muted); }
.ptb-formular__paket:hover { border-color:var(--accent-deep); }
.ptb-formular__paket:has(> [aria-pressed="true"]) { border-color:var(--text-strong); }
.ptb-formular__paket-kopf { display:block; width:100%; text-align:left; padding:14px 16px 12px; cursor:pointer; background:transparent; border:0; transition:background .45s var(--ease); }
.ptb-formular__paket:has(> [aria-pressed="true"]) .ptb-formular__paket-kopf { background:var(--text-strong); }
.ptb-formular__paket-zeile { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.ptb-formular__paket-name { font-size:12px; font-weight:500; letter-spacing:.22em; text-transform:uppercase; color:var(--accent-deep); }
.ptb-formular__paket-preis { font-weight:400; font-size:1.05rem; color:var(--text-strong); white-space:nowrap; }
.ptb-formular__paket-claim { font-family:var(--font-script); font-size:1.65rem; line-height:1.15; color:var(--accent-deep); display:block; margin-top:7px; }
.ptb-formular__paket-sub { font-size:12.5px; font-weight:300; color:var(--text-muted); line-height:1.4; display:block; margin-top:5px; }
.ptb-formular__paket:has(> [aria-pressed="true"]) .ptb-formular__paket-preis { color:var(--surface-muted); }
.ptb-formular__paket:has(> [aria-pressed="true"]) .ptb-formular__paket-claim { color:var(--accent); }
.ptb-formular__paket:has(> [aria-pressed="true"]) .ptb-formular__paket-sub { color:rgba(251,247,242,.62); }
.ptb-formular__paket-details { border-top:1px solid var(--border-subtle); }
.ptb-formular__paket-details summary { cursor:pointer; list-style:none; padding:10px 16px; font-size:11px; font-weight:400; letter-spacing:.14em; text-transform:uppercase; color:var(--accent-deep); display:flex; align-items:center; justify-content:space-between; }
.ptb-formular__paket-details summary::-webkit-details-marker { display:none; }
.ptb-formular__paket-kopf:hover { transform:none; box-shadow:none; }
.ptb-formular__paket:has(> [aria-pressed="true"]) .ptb-formular__paket-name { color:var(--accent); }
.ptb-formular__paket-details summary::after { content:"+"; font-size:16px; font-weight:300; line-height:1; transition:transform .4s var(--ease); }
.ptb-formular__paket-details[open] summary::after { transform:rotate(45deg); }
.ptb-formular__paket-details ul { list-style:none; margin:0; padding:2px 16px 12px; font-size:13px; font-weight:300; color:var(--text-soft); }
.ptb-formular__paket-details li { padding:5px 0 5px 16px; position:relative; line-height:1.4; border-top:1px solid rgba(76,69,61,.07); }
.ptb-formular__paket-details li:first-child { border-top:0; }
.ptb-formular__paket-details li::before { content:""; position:absolute; left:1px; top:12px; width:6px; height:1px; background:var(--accent-deep); }
.ptb-formular__paket-fuss { padding:0 16px 13px; font-size:11.5px; font-weight:300; color:var(--text-muted); }
.ptb-formular__feld--datum { position:relative; }
.ptb-formular__feld--datum input { cursor:pointer; padding-right:38px; }
.ptb-formular__feld--datum::after { content:""; position:absolute; right:13px; bottom:13px; width:16px; height:16px; pointer-events:none; background:no-repeat center/contain url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B59C82' stroke-width='1.4'><rect x='3.5' y='5' width='17' height='15.5' rx='2.5'/><path d='M3.5 9.5h17M8 3v4M16 3v4'/></svg>"); }
.ptb-formular__dp { position:absolute; z-index:90; width:min(302px,calc(100vw - 32px)); background:var(--surface-page); border:1px solid var(--border-subtle); border-radius:16px; padding:16px; box-shadow:0 28px 60px -24px rgba(76,69,61,.45); font-family:var(--font-body); animation:ptb-einblenden .3s var(--ease-out) both; }
.ptb-formular__dp-kopf { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.ptb-formular__dp-monat { font-family:var(--font-display); font-size:1.25rem; line-height:1; color:var(--text-strong); }
.ptb-formular__dp-nav { display:flex; gap:6px; }
.ptb-formular__dp-nav button { width:30px; height:30px; border-radius:999px; border:1px solid var(--border-subtle); background:var(--surface-page); cursor:pointer; font-size:14px; line-height:1; color:var(--text-strong); display:flex; align-items:center; justify-content:center; transition:border-color .3s var(--ease); }
.ptb-formular__dp-nav button:hover { border-color:var(--accent-deep); }
.ptb-formular__dp-nav button:disabled { opacity:.3; cursor:default; }
.ptb-formular__dp-tage,
.ptb-formular__dp-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:2px; }
.ptb-formular__dp-tage span { font-size:10px; font-weight:400; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); text-align:center; padding:6px 0; }
.ptb-formular__dp-grid button { height:34px; border:0; background:transparent; border-radius:10px; cursor:pointer; font-size:13.5px; font-weight:300; color:var(--text-strong); transition:background .25s var(--ease),color .25s var(--ease); }
.ptb-formular__dp-grid button:hover:not(:disabled) { background:var(--accent-soft); }
.ptb-formular__dp-grid button:disabled { color:rgba(140,131,119,.4); cursor:default; }
.ptb-formular__dp-grid button[aria-current="date"] { position:relative; }
.ptb-formular__dp-grid button[aria-current="date"]::after { content:""; position:absolute; left:50%; bottom:4px; width:4px; height:4px; border-radius:50%; background:var(--accent-deep); transform:translateX(-50%); }
.ptb-formular__dp-grid button[aria-pressed="true"] { background:var(--text-strong); color:var(--surface-muted); }
.ptb-formular__dp-grid span { display:block; }
.ptb-formular__reihe { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:9px; }
.ptb-formular__feld { display:block; margin-bottom:9px; }
.ptb-formular__feld span { display:block; font-size:11px; font-weight:400; letter-spacing:.13em; text-transform:uppercase; color:var(--text-muted); margin-bottom:6px; }
.ptb-formular__feld input,
.ptb-formular__feld textarea,
.ptb-formular__feld select { width:100%; min-width:0; box-sizing:border-box; padding:12px 13px; border-radius:12px; border:1px solid var(--border-subtle); background:var(--surface-page); font-family:var(--font-body); font-weight:300; font-size:15px; color:var(--text-strong); transition:border-color .4s var(--ease),box-shadow .4s var(--ease); }
.ptb-formular__feld input:focus,
.ptb-formular__feld textarea:focus { outline:none; border-color:var(--accent-deep); box-shadow:0 0 0 3px var(--accent-soft); }
.ptb-formular__feld textarea { min-height:96px; resize:vertical; }
.ptb-formular__datei { display:flex; align-items:center; gap:11px; padding:13px 14px; border-radius:14px; border:1px dashed var(--border-subtle); background:var(--surface-page); font-size:13.5px; font-weight:300; color:var(--text-muted); cursor:pointer; transition:border-color .45s var(--ease); }
.ptb-formular__datei:hover { border-color:var(--accent-deep); }
.ptb-formular__datei input { display:none; }
.ptb-formular__zustimmung { display:flex; gap:11px; align-items:flex-start; font-size:12.5px; color:var(--text-soft); line-height:1.5; margin:14px 0 4px; }
.ptb-formular__zustimmung input { margin-top:3px; accent-color:var(--accent-deep); width:16px; height:16px; flex:0 0 auto; }
.ptb-formular__zustimmung a { color:var(--text-strong); text-underline-offset:3px; }
.ptb-formular__fuss { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:20px; padding-top:16px; border-top:1px solid var(--border-subtle); }
.ptb-formular__zurueck { background:none; border:0; cursor:pointer; padding:6px 0; font-size:13px; color:var(--text-muted); letter-spacing:.05em; transition:color .4s var(--ease); }
.ptb-formular__zurueck:hover { color:var(--text-strong); }
.ptb-formular__zurueck[hidden] { visibility:hidden; display:block; }
@media (prefers-reduced-motion:reduce) {
  .ptb-formular__schritt { animation:none; }
}
@media (max-width:767px) {
  .ptb-formular__karte { padding:24px 22px 20px; }
}
@media (min-width:768px) {
  .ptb-formular__karte { padding:34px 34px 28px; }
}
.ptb-formular--hell .ptb-formular__paket { background:var(--surface-page); }
.ptb-formular__frage { font-family:var(--font-body); font-weight:400; margin-bottom:20px; font-size:1.73rem; line-height:1.15; letter-spacing:-.01em; color:var(--text-strong); }
.ptb-formular__dp-monat { font-family:var(--font-body); font-weight:300; }
.ptb-formular__paket,
.ptb-formular__paket .ptb-formular__kachel { border-radius:0; }
.ptb-formular__kachel-label { font-size:16px; }
.ptb-formular__kachel-sub { font-size:14px; }
.ptb-formular__hinweis { font-size:16px; }
.ptb-formular__zustimmung { font-size:14px; }
.ptb-formular__feld span { font-size:12.5px; }
.ptb-formular__paket-sub { font-size:14px; }
.ptb-formular__paket-details summary { font-size:13px; }
.ptb-formular__paket-details ul { font-size:15px; }
.ptb-formular__paket-fuss { font-size:13.5px; }
.ptb-formular__zurueck { font-size:14px; }
.ptb-formular__datei { font-size:14.5px; }
.ptb-formular__fussnotiz { font-size:14px!important; flex:1; text-align:right; }
.ptb-formular__paket-name { color:var(--text-contrast); }
.ptb-formular__paket:has(> [aria-pressed="true"]) .ptb-formular__paket-name { color:var(--surface-muted); }
.ptb-formular__paket-claim { font-family:var(--font-body); font-weight:300; font-size:1.05rem; line-height:1.35; color:var(--text-body); }
.ptb-formular__paket:has(> [aria-pressed="true"]) .ptb-formular__paket-claim { color:var(--surface-muted); }
.ptb-formular__kachel-icon { display:block; width:26px; height:26px; color:var(--accent-deep); margin-bottom:8px; }
.ptb-formular__kachel-icon svg { width:100%; height:100%; display:block; fill:none; stroke:currentColor; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }
.ptb-formular__kachel[aria-pressed="true"] .ptb-formular__kachel-icon { color:var(--surface-muted); }
.ptb-formular__weiter { margin-left:auto; flex:0 0 auto; }
.ptb-formular__weiter[hidden] { display:none; }
@media (max-width:767px) {
  .ptb-formular__frage { font-size:25.3px; line-height:1.25; }
}
@media (max-width:519px) {
  .ptb-formular__kacheln:not(.ptb-formular__kacheln--eng) { grid-template-columns:1fr 1fr; gap:8px; align-items:stretch; }
  .ptb-formular__kacheln:not(.ptb-formular__kacheln--eng) .ptb-formular__kachel { padding:12px 12px 13px; border-radius:12px; }
  .ptb-formular__kacheln:not(.ptb-formular__kacheln--eng) .ptb-formular__kachel-label { font-size:15px; line-height:1.25; overflow-wrap:anywhere; hyphens:manual; }
  .ptb-formular__kacheln:not(.ptb-formular__kacheln--eng) .ptb-formular__kachel-sub { font-size:12.5px; line-height:1.3; margin-top:3px; }
  .ptb-formular__kacheln:not(.ptb-formular__kacheln--eng) .ptb-formular__kachel-icon { width:22px; height:22px; margin-bottom:6px; }
}
@media (pointer:coarse) {
  .ptb-formular__kachel { min-height:44px; }
}
.ptb-formular__form { margin-top:0; }
.ptb-formular__proof { display:flex; align-items:center; gap:12px; margin:26px 0 4px; }
.ptb-formular__gesichter { display:flex; flex:0 0 auto; }
.ptb-formular__gesichter img { width:34px; height:34px; border-radius:50%; object-fit:cover; object-position:center top; border:2px solid var(--ptb-white); background:var(--border-subtle); margin-left:-10px; box-shadow:0 4px 12px -6px rgba(0,0,0,.35); }
.ptb-formular__gesichter img:first-child { margin-left:0; }
.ptb-formular__proof-text { margin:0; font-family:var(--font-body); font-size:13.5px; font-weight:300; line-height:1.45; color:var(--text-body); text-wrap:balance; }
@media (max-width:767px) {
  .ptb-formular__proof-text { font-size:13px; }
  .ptb-formular__proof { margin-top:20px; }
}
.ptb-formular,
.ptb-formular__karte { border-radius:0; }
.ptb-formular { position:relative; overflow:visible; }
.ptb-formular__siegel { position:absolute; left:50%; top:0; z-index:2; transform:translate(-50%,-50%); width:76px; height:76px; border-radius:50%; background:var(--surface-page); padding:6px; box-shadow:0 10px 24px -14px rgba(76,69,61,.45); pointer-events:none; }
.ptb-formular__siegel-innen { display:flex; align-items:center; justify-content:center; width:100%; height:100%; border-radius:50%; background:var(--surface-muted); border:1px solid var(--accent); color:var(--accent-deep); }
.ptb-formular__siegel svg { width:28px; height:28px; display:block; fill:none; stroke:currentColor; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }
.ptb-formular__karte { padding-top:52px; }
.ptb-formular__frage { text-align:center; }
.ptb-formular__frage::before { content:"Unverbindliche Anfrage"; display:block; font-size:11px; font-weight:400; letter-spacing:.2em; text-transform:uppercase; color:var(--accent-deep); margin-bottom:10px; }
.ptb-formular__frage::after { content:""; display:block; width:36px; height:1px; background:var(--accent); margin:16px auto 0; }
.ptb-formular__hinweis { text-align:center; }
@media (max-width:767px) {
  .ptb-formular__siegel { width:68px; height:68px; }
  .ptb-formular__karte { padding-top:46px; }
}
/* Aus Inline-Styles des Prototyps */
.ptb-formular__luecke { height:10px; }
.ptb-formular__kacheln--termin { margin-top:4px; }
.ptb-formular__absenden { margin-top:16px; }
.ptb-formular__feld input[aria-invalid="true"] { border-color:var(--status-danger); box-shadow:0 0 0 3px rgba(192,85,63,.16); }
/* Location-Schritt: Bild-Kacheln (ChoiceCard des Designpakets, 16:10). Fotos und Kachel eckig wie die Paket-Kacheln;
   Zustände wie .ptb-formular__kachel — Hover goldene Kante + 2 px, Auswahl füllt den Textteil mit Tinte. */
.ptb-formular__orte { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; }
.ptb-formular__ort { display:flex; flex-direction:column; width:100%; padding:0; text-align:left; cursor:pointer; background:var(--surface-page); border:1px solid var(--border-subtle); border-radius:0; overflow:hidden; transition:border-color .45s var(--ease),transform .45s var(--ease),box-shadow .45s var(--ease); }
.ptb-formular--hell .ptb-formular__ort { background:var(--surface-muted); }
.ptb-formular__ort:hover { border-color:var(--accent-deep); transform:translateY(-2px); box-shadow:0 14px 26px -18px rgba(76,69,61,.5); }
.ptb-formular__ort:active { transform:translateY(0) scale(.985); }
.ptb-formular__ort:focus-visible { outline:2px solid var(--accent-deep); outline-offset:2px; }
.ptb-formular__ort-bild { display:block; position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--border-subtle); }
.ptb-formular__ort-bild img { display:block; width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease-out); }
.ptb-formular__ort:hover .ptb-formular__ort-bild img { transform:scale(1.03); }
.ptb-formular__ort-bild--leer { display:flex; align-items:center; justify-content:center; }
.ptb-formular__ort-leer { font-size:12.5px; font-weight:300; color:var(--text-muted); }
.ptb-formular__ort-text { display:block; padding:11px 14px 13px; transition:background .45s var(--ease); }
.ptb-formular__ort-stadt { display:block; font-size:13px; font-weight:300; line-height:1.3; color:var(--text-muted); }
.ptb-formular__ort-name { display:block; font-size:17px; font-weight:400; line-height:1.25; color:var(--text-strong); margin-top:1px; }
.ptb-formular__ort-sub { display:block; font-size:13.5px; font-weight:300; line-height:1.35; color:var(--text-muted); margin-top:5px; }
.ptb-formular__ort[aria-pressed="true"] { border-color:var(--text-strong); }
.ptb-formular__ort[aria-pressed="true"] .ptb-formular__ort-text { background:var(--text-strong); }
.ptb-formular__ort[aria-pressed="true"] .ptb-formular__ort-name { color:var(--surface-muted); }
.ptb-formular__ort[aria-pressed="true"] .ptb-formular__ort-stadt,
.ptb-formular__ort[aria-pressed="true"] .ptb-formular__ort-sub { color:rgba(251,247,242,.62); }
.ptb-formular__orte-offen { grid-column:1 / -1; border-radius:0; }
/* Hülle für eine Karte im Textfluss: hält das halb überstehende Siegel (38 px) vom Text darüber frei */
.ptb-formular__abstand { padding-top:44px; }
@media (max-width:519px) {
  .ptb-formular__orte { gap:8px; }
  .ptb-formular__ort-text { padding:9px 11px 11px; }
  .ptb-formular__ort-name { font-size:15px; }
  .ptb-formular__ort-sub { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  .ptb-formular__ort-bild img { transition:none; }
}
/* Formular-Knöpfe liefen im Prototyp als .cta: Pfeil ohne runde Linienenden */
.ptb-formular__weiter svg, .ptb-formular__absenden svg { stroke-linecap:butt; stroke-linejoin:miter; }
.ptb-formular__weiter svg, .ptb-formular__absenden svg { width:22px; height:22px; }
/* ===========================================================================
   Schicht 5 — slider
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-slider--bleed .ptb-slider__track { padding-left:var(--shell-pad); padding-right:var(--shell-pad); scroll-padding-left:var(--shell-pad); }
.ptb-slider--bleed .ptb-slider__slide { flex:0 0 min(78vw,520px); aspect-ratio:4/5; position:relative; overflow:hidden; background:var(--border-subtle); }
.ptb-slider--bleed .ptb-slider__nav { width:min(100% - 40px,var(--shell-max)); margin-inline:auto; justify-content:flex-start; }
.ptb-slider { position:relative; }
.ptb-slider__track { display:flex; gap:14px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-width:none; -webkit-overflow-scrolling:touch; cursor:grab; outline:none; }
.ptb-slider__track::-webkit-scrollbar { display:none; }
.ptb-slider__track:focus-visible { outline:2px solid var(--accent-deep); outline-offset:4px; }
.ptb-slider__track[data-ptb-zieht] { cursor:grabbing; scroll-snap-type:none; }
.ptb-slider__slide { flex:0 0 100%; scroll-snap-align:start; margin:0; }
.ptb-slider__slide img { user-select:none; -webkit-user-drag:none; }
.ptb-slider__nav { display:flex; align-items:center; gap:14px; margin-top:18px; }
.ptb-slider__btn { width:50px; height:50px; padding:0; border-radius:999px; border:1px solid var(--text-strong); background:transparent; color:var(--text-strong); line-height:0; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; transition:background .4s var(--ease),color .4s var(--ease),opacity .3s var(--ease); }
.ptb-slider__btn svg { width:22px; height:22px; display:block; fill:none; stroke:currentColor; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }
.ptb-slider__btn:hover { background:var(--text-strong); color:var(--surface-muted); }
.ptb-slider__btn:disabled { opacity:.3; cursor:default; background:transparent; color:var(--text-strong); }
.ptb-slider__count { font-family:var(--font-body); font-size:13px; font-weight:300; letter-spacing:.1em; color:var(--text-muted); min-width:5ch; text-align:center; }
.ptb-slider__dots { display:flex; gap:6px; margin-left:auto; flex-wrap:wrap; justify-content:flex-end; }
.ptb-slider__dot { width:6px; height:6px; border-radius:50%; background:var(--border-default); border:0; padding:0; cursor:pointer; transition:background .3s var(--ease),width .3s var(--ease); }
.ptb-slider__dot[aria-current="true"] { background:var(--text-strong); width:20px; border-radius:3px; }
.ptb-slider--raum .ptb-slider__slide { flex:0 0 min(100%,720px); aspect-ratio:16/10; overflow:hidden; background:var(--border-subtle); }
.ptb-slider--raum .ptb-slider__slide img { width:100%; height:100%; object-fit:cover; display:block; }
@media (max-width:767px) {
  .ptb-slider__dots { display:none; }
  .ptb-slider__btn { width:44px; height:44px; }
  .ptb-slider__btn svg { width:19px; height:19px; }
}
.ptb-slider--raum .ptb-slider__slide { border-radius:0; }
@media (prefers-reduced-motion:reduce) {
  .ptb-slider__track { scroll-behavior:auto; }
}
.ptb-slider__btn--prev, .ptb-slider__btn--next { flex:0 0 auto; }
/* ===========================================================================
   Schicht 5 — raster
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-raster__grid.ptb-raster__grid--6 { grid-template-columns:repeat(6,minmax(0,1fr)); }
.ptb-raster__grid--6 .ptb-raster__zelle:nth-child(5n+1) { border-left:1px solid var(--border-default); }
.ptb-raster__grid--6 .ptb-raster__zelle:nth-child(6n+1) { border-left:0; }
@media (max-width:1023px) {
  .ptb-raster__grid.ptb-raster__grid--6 { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .ptb-raster__grid--6 .ptb-raster__zelle:nth-child(6n+1) { border-left:1px solid var(--border-default); }
  .ptb-raster__grid--6 .ptb-raster__zelle:nth-child(3n+1) { border-left:0; }
}
@media (max-width:767px) {
  .ptb-raster__grid.ptb-raster__grid--6 { grid-template-columns:1fr 1fr; }
  .ptb-raster__grid--6 .ptb-raster__zelle:nth-child(3n+1) { border-left:1px solid var(--border-default); }
  .ptb-raster__grid--6 .ptb-raster__zelle:nth-child(odd) { border-left:0; }
}
.ptb-raster__icon svg { fill:none; stroke:currentColor; stroke-width:.9; stroke-linecap:round; stroke-linejoin:round; display:block; width:100%; height:100%; }
.ptb-raster { margin-top:56px; border-top:1px solid var(--border-default); }
.ptb-raster__grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); }
.ptb-raster__zelle { display:flex; flex-direction:column; align-items:center; text-align:center; padding:34px 18px 30px; border-bottom:1px solid var(--border-default); }
.ptb-raster__zelle + .ptb-raster__zelle { border-left:1px solid var(--border-default); }
.ptb-raster__zelle:nth-child(5n+1) { border-left:0; }
.ptb-raster .ptb-raster__icon { width:52px; height:52px; color:var(--text-strong); }
.ptb-raster .ptb-raster__text { margin-top:18px; font-family:var(--font-body); font-size:15px; font-weight:200; letter-spacing:.05em; text-transform:uppercase; line-height:1.4; color:var(--text-strong); }
@media (max-width:1023px) {
  .ptb-raster__grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .ptb-raster__zelle:nth-child(5n+1) { border-left:1px solid var(--border-default); }
  .ptb-raster__zelle:nth-child(3n+1) { border-left:0; }
}
@media (max-width:767px) {
  .ptb-raster { margin-top:36px; }
  .ptb-raster__grid { grid-template-columns:1fr 1fr; }
  .ptb-raster__zelle { padding:24px 12px 22px; }
  .ptb-raster__zelle:nth-child(3n+1) { border-left:1px solid var(--border-default); }
  .ptb-raster__zelle:nth-child(odd) { border-left:0; }
  .ptb-raster .ptb-raster__icon { width:44px; height:44px; }
  .ptb-raster .ptb-raster__text { font-size:13px; }
}
/* ===========================================================================
   Schicht 5 — kontaktleiste
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-kontaktleiste { position:fixed; left:12px; right:12px; bottom:calc(12px + env(safe-area-inset-bottom,0px)); z-index:60; display:none; align-items:center; gap:10px; height:60px; padding:0 8px; border-radius:999px; background:rgba(255,255,255,.94); border:1px solid rgba(76,69,61,.14); box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 12px 30px -10px rgba(10,8,6,.35),0 0 0 1px rgba(76,69,61,.05); backdrop-filter:blur(14px) saturate(160%); -webkit-backdrop-filter:blur(14px) saturate(160%); transform:translateY(calc(100% + 24px)); opacity:0; transition:transform .55s cubic-bezier(.32,.72,0,1),opacity .4s var(--ease); pointer-events:none; }
.ptb-kontaktleiste[data-ptb-sichtbar] { transform:none; opacity:1; pointer-events:auto; }
@media (max-width:767px) {
  .ptb-kontaktleiste { display:flex; }
}
.ptb-kontaktleiste__person { display:flex; align-items:center; gap:10px; flex:1 1 auto; min-width:0; text-decoration:none; color:var(--text-strong); }
.ptb-kontaktleiste__avatar { position:relative; width:40px; height:40px; flex:0 0 auto; }
.ptb-kontaktleiste__avatar img { width:40px; height:40px; border-radius:50%; object-fit:cover; object-position:center top; display:block; border:2px solid var(--ptb-white); box-shadow:0 0 0 1px rgba(76,69,61,.12); }
.ptb-kontaktleiste__status { position:absolute; right:-1px; bottom:-1px; width:12px; height:12px; border-radius:50%; background:var(--status-online); border:2px solid var(--ptb-white); animation:ptb-puls 2.4s ease-out infinite; }
@keyframes ptb-puls { 0%{box-shadow:0 0 0 0 rgba(52,179,106,.45)}70%{box-shadow:0 0 0 7px rgba(52,179,106,0)}100%{box-shadow:0 0 0 0 rgba(52,179,106,0)} }
.ptb-kontaktleiste__text { font-family:var(--font-body); font-size:14px; font-weight:400; letter-spacing:.01em; color:var(--text-strong); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ptb-kontaktleiste__aktionen { display:flex; gap:6px; flex:0 0 auto; }
.ptb-kontaktleiste__knopf { width:44px; height:44px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:var(--text-strong); color:var(--text-inverse); text-decoration:none; transition:background .3s var(--ease); }
.ptb-kontaktleiste__knopf:active { background:var(--accent-deep); }
.ptb-kontaktleiste__knopf svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; display:block; }
@media (prefers-reduced-motion:reduce) {
  .ptb-kontaktleiste { transition:none; }
  .ptb-kontaktleiste__status { animation:none; }
}
/* ===========================================================================
   Schicht 5 — cb01-hero
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-hero { position:relative; width:100%; margin-top:0; background:var(--surface-hero); isolation:isolate; }
.ptb-hero__video { position:absolute; top:0; left:0; bottom:0; right:0; overflow:hidden; pointer-events:none; z-index:0; }
.ptb-hero__video video { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; pointer-events:none; }
.ptb-hero__container { position:relative; z-index:1; height:100dvh; max-width:100%; margin:0 auto; padding:0; display:flex; flex-direction:column; }
.ptb-hero__slide { height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:50px 50px 60px; background:var(--surface-hero-veil); }
.ptb-hero__h1 { max-width:100%; text-align:left; color:var(--text-inverse); font-family:var(--font-display); font-size:150px; font-weight:100; line-height:.9em; margin:15px 0 0; }
.ptb-hero__akzent { font-style:italic; color:var(--text-accent-pale); }
.ptb-hero__titel { display:inline-flex; flex-direction:column; align-items:center; max-width:100%; }
.ptb-hero__titel .ptb-hero__h1 { margin-top:0; }
.ptb-hero__script { max-width:none; white-space:nowrap; margin:0 0 6px; font-family:var(--font-script); font-size:64px; font-weight:400; line-height:1; color:var(--accent); text-align:center; }
.ptb-hero__aktion { display:inline-flex; flex-direction:column; align-items:stretch; width:auto; max-width:100%; }
.ptb-hero__btns { display:flex; flex-direction:row; flex-wrap:nowrap; justify-content:flex-start; align-items:stretch; gap:20px; width:100%; position:relative; }
.ptb-hero__btn { flex:0 0 auto; margin-top:30px; display:block; max-width:100%; }
.ptb-hero__btns { gap:50px; justify-content:center; }
@media (max-width:767px) {
  .ptb-hero__aktion { width:calc(100% - 40px); }
  .ptb-hero__btns { flex-wrap:wrap; }
  .ptb-hero__btn { flex:1 1 100%; }
}
@media (max-width:1023px) {
  .ptb-hero__h1 { text-align:center; }
}
@media (max-width:767px) {
  .ptb-hero__slide { padding-left:0; padding-right:0; }
  .ptb-hero__h1 { font-size:57px; }
  .ptb-hero__script { font-size:32px; margin:0 0 4px; white-space:normal; max-width:calc(100vw - 60px); }
}
@media (max-width:479px) {
  .ptb-hero__h1 { font-size:71px; }
}
.ptb-hero__film { border:0; padding:0; background:transparent; max-width:min(1200px,92vw); width:100%; }
.ptb-hero__film::backdrop { background:rgba(21,18,15,.9); backdrop-filter:blur(6px); }
.ptb-hero__film-innen { position:relative; background:var(--ptb-black); aspect-ratio:16/9; width:100%; }
.ptb-hero__film video { width:100%; height:100%; display:block; }
.ptb-hero__film-zu { position:absolute; right:-6px; top:-46px; background:transparent; border:0; color:var(--text-on-dark); cursor:pointer; font-family:var(--font-condensed); font-size:20px; letter-spacing:.04em; text-transform:uppercase; padding:8px 10px; }
.ptb-hero__film-zu:hover { color:var(--accent); }
@media (max-width:767px) {
  .ptb-hero__btns { flex-wrap:nowrap; gap:28px; justify-content:center; }
  .ptb-hero__btn { flex:0 1 auto; min-width:0; }
}
/* --- Variante Bild (Hubs, Stadtseiten, Unternehmen, Kontakt, Magazin …; Seitenplan 30.09.) ---
   Standbild statt Video, Unterzeile unter dem Titel, niedrigere Bühne. Das Bild liegt unter
   dem Video und dient dort nur als Rückfall; ohne Video ist es die Bühne. Leere Felder
   (Kicker, Akzent, Unterzeile) verschwinden. */
.ptb-hero__bild { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.ptb-hero__bild img { width: 100%; height: 100%; object-fit: cover; }
.ptb-hero__script:empty, .ptb-hero__akzent:empty, .ptb-hero__unterzeile:empty { display: none; }
.ptb-hero__unterzeile {
  margin-top: 22px; color: var(--text-inverse); text-align: center;
  font-family: var(--font-body); font-size: 24px; font-weight: 200; line-height: 1.35; letter-spacing: .02em;
}
.ptb-hero--bild .ptb-hero__container { height: 78dvh; min-height: 540px; }
.ptb-hero--bild .ptb-hero__h1 { text-align: center; font-size: clamp(64px, 9vw, 130px); }
@media (max-width: 767px) {
  .ptb-hero--bild .ptb-hero__container { height: 72dvh; min-height: 460px; }
  .ptb-hero__unterzeile { font-size: 18px; margin-top: 14px; padding-inline: 20px; }
}
/* Lange Titel (Startseite, Unterseiten; Seitenplan 30.09.): kleinere Stufe, mittig, Akzent in eigener Zeile */
.ptb-hero--lang .ptb-hero__h1 { text-align: center; font-size: clamp(52px, 7.2vw, 118px); }
.ptb-hero--lang .ptb-hero__akzent { display: block; }
@media (max-width: 767px) { .ptb-hero--lang .ptb-hero__h1 { font-size: clamp(40px, 11vw, 56px); } }
/* ===========================================================================
   Schicht 5 — cb02-anfrage
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-anfrage__liste { list-style:none; margin:0; padding:0; }
.ptb-anfrage__liste li { display:flex; justify-content:space-between; gap:20px; padding:12px 0; border-top:1px solid var(--border-default); font-family:var(--font-body); font-size:16px; font-weight:200; color:var(--text-strong); }
.ptb-anfrage__liste li:last-child { border-bottom:1px solid var(--border-default); }
.ptb-anfrage__fakt-titel { font-weight:400; white-space:nowrap; }
.ptb-anfrage__fakt-text { color:var(--text-muted); text-align:right; }
.ptb-anfrage { background:var(--surface-page); padding:120px 0 120px; position:relative; }
.ptb-anfrage__raster { display:grid; grid-template-columns:1fr; grid-template-areas:"kopf" "karte" "fakten"; gap:36px; align-items:start; }
.ptb-anfrage__kopf { grid-area:kopf; }
.ptb-anfrage__karte { grid-area:karte; }
.ptb-anfrage__fakten { grid-area:fakten; }
.ptb-anfrage__vor { margin-top:30px; max-width:56ch; font-family:var(--font-body); font-size:19px; font-weight:200; line-height:1.6em; color:var(--text-strong); }
.ptb-anfrage__kontakt { margin-top:34px; display:flex; flex-direction:column; gap:14px; }
.ptb-anfrage__kontakt-link { display:inline-flex; align-items:center; gap:16px; color:var(--text-strong); text-decoration:none; transition:color .4s var(--ease); }
.ptb-anfrage__kontakt-link:hover { color:var(--accent-deep); }
.ptb-anfrage__kontakt-icon { flex:0 0 auto; width:30px; height:30px; color:var(--accent-deep); }
.ptb-anfrage__kontakt-icon svg { width:100%; height:100%; display:block; fill:none; stroke:currentColor; stroke-width:1.2; stroke-linecap:round; stroke-linejoin:round; }
.ptb-anfrage__kontakt-icon--tel { animation:ptb-wackeln 2.8s cubic-bezier(.32,.72,0,1) infinite; transform-origin:50% 60%; }
.ptb-anfrage__kontakt--zeile { flex-direction:row; flex-wrap:wrap; align-items:center; gap:18px 28px; }
.ptb-anfrage__kontakt--zeile .ptb-anfrage__kontakt-link { gap:12px; }
.ptb-anfrage__kontakt--zeile .ptb-anfrage__kontakt-icon { width:24px; height:24px; }
.ptb-anfrage__kontakt-wert { font-family:var(--font-condensed); font-size:26px; line-height:1; letter-spacing:.03em; white-space:nowrap; }
.ptb-anfrage__kontakt-punkt { width:6px; height:6px; border-radius:50%; background:var(--accent); }
@keyframes ptb-wackeln { 0%,70%,100%{transform:rotate(0)}74%{transform:rotate(-14deg)}78%{transform:rotate(12deg)}82%{transform:rotate(-10deg)}86%{transform:rotate(8deg)}90%{transform:rotate(-4deg)} }
@media (max-width:767px) {
  .ptb-anfrage__kontakt-wert { font-size:22px; }
  .ptb-anfrage__kontakt-icon { width:26px; height:26px; }
  .ptb-anfrage__kontakt-punkt { display:none; }
}
@media (min-width:1024px) {
  .ptb-anfrage__raster { grid-template-columns:1fr 1fr; grid-template-rows:auto 1fr; grid-template-areas:"kopf karte" "fakten karte"; gap:22px 122px; align-items:start; }
  .ptb-anfrage__fakten { align-self:start; }
  .ptb-anfrage__karte { position:sticky; top:24px; }
}
@media (max-width:767px) {
  .ptb-anfrage { padding-bottom:80px; }
}
.ptb-anfrage__vor { color:var(--text-body); font-weight:300; }
.ptb-anfrage__liste li { color:var(--text-body); font-weight:300; }
.ptb-anfrage__fakt-text { color:var(--text-body); }
@media (prefers-reduced-motion:reduce) {
  .ptb-anfrage__kontakt-icon--tel { animation:none; }
}
@media (max-width:767px) {
  .ptb-anfrage__vor { font-size:15px; line-height:1.6; }
}
.ptb-anfrage__vor { margin-top:var(--t-nach); }
.ptb-anfrage { padding-top:var(--s-oben); }
.ptb-anfrage__liste li { align-items:center; gap:14px; }
.ptb-anfrage__fakt-text { margin-left:auto; }
.ptb-anfrage__fakt-icon { width:24px; height:24px; flex:0 0 auto; color:var(--accent-deep); }
.ptb-anfrage__fakt-icon svg { width:100%; height:100%; display:block; fill:none; stroke:currentColor; stroke-width:1.2; stroke-linecap:round; stroke-linejoin:round; }
@media (max-width:767px) {
  .ptb-anfrage__karte { margin-top:16px; }
  .ptb-anfrage__raster { grid-template-areas:"kopf" "fakten" "karte" "kontakt"; }
  .ptb-anfrage__fakten { display:contents; }
  .ptb-anfrage__liste { grid-area:fakten; margin-top:-10px; }
  .ptb-anfrage__kontakt { grid-area:kontakt; margin-top:0; }
  .ptb-anfrage__liste { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain; border-top:1px solid var(--border-default); border-bottom:1px solid var(--border-default); }
  .ptb-anfrage__liste::-webkit-scrollbar { display:none; }
  .ptb-anfrage__liste li { flex:0 0 100%; scroll-snap-align:start; display:grid; grid-template-columns:24px 1fr; column-gap:14px; row-gap:3px; align-items:start; padding:16px 0; border:0; }
  .ptb-anfrage__liste li:last-child { border:0; }
  .ptb-anfrage__fakt-icon { grid-row:1 / span 2; margin-top:1px; }
  .ptb-anfrage__fakt-titel { grid-column:2; white-space:normal; font-size:17px; }
  .ptb-anfrage__fakt-text { grid-column:2; margin-left:0; text-align:left; }
  .ptb-anfrage__vor { margin-top:10px; }
}
/* Folgt der Preisblock sichtbar, übernimmt er den unteren Abstand (im Prototyp lag er in dieser Section) */
.ptb-anfrage:has(+ .ptb-preise:not([hidden])) { padding-bottom:0; }
/* ===========================================================================
   Schicht 5 — cb03-preise
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-preise__pakete { display:grid; grid-template-columns:1fr; gap:14px; margin-top:46px; }
@media (min-width:768px) {
  .ptb-preise__pakete { grid-template-columns:repeat(3,1fr); }
}
.ptb-preise__paket { background:rgba(76,69,61,.04); border:1px solid rgba(76,69,61,.10); border-radius:var(--radius-frame); padding:7px; }
.ptb-preise__paket-kern { background:var(--surface-page); border-radius:var(--radius-frame-in); padding:28px 26px 24px; height:100%; box-shadow:inset 0 1px 1px rgba(255,255,255,.8); display:flex; flex-direction:column; }
.ptb-preise__paket--empfohlen { background:rgba(214,182,146,.20); border-color:rgba(214,182,146,.55); }
.ptb-preise__paket--empfohlen .ptb-preise__paket-kern { background:var(--surface-highlight-card); }
.ptb-preise__paket-name { font-size:11px; font-weight:500; letter-spacing:.26em; text-transform:uppercase; color:var(--accent-deep); }
.ptb-preise__paket-preis { font-family:var(--font-body); font-weight:250; font-size:2.6rem; line-height:1; margin-top:14px; }
.ptb-preise__paket-preis small { font-family:var(--font-body); font-weight:300; font-size:12.5px; color:var(--text-muted); display:block; margin-top:8px; letter-spacing:.02em; }
.ptb-preise__paket-claim { font-family:var(--font-script); color:var(--accent-deep); margin-top:16px; font-size:1.95rem; line-height:1.2; }
.ptb-preise__paket ul { list-style:none; margin:20px 0 0; padding:0; font-size:14px; font-weight:300; color:var(--text-soft); }
.ptb-preise__paket li { padding:7px 0 7px 20px; position:relative; line-height:1.45; border-top:1px solid rgba(76,69,61,.09); }
.ptb-preise__paket li:first-child { border-top:0; }
.ptb-preise__paket li::before { content:""; position:absolute; left:2px; top:15px; width:6px; height:1px; background:var(--accent-deep); }
.ptb-preise__paket details { margin-top:14px; }
.ptb-preise__paket summary { cursor:pointer; font-size:12px; font-weight:400; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-deep); list-style:none; }
.ptb-preise__paket summary::-webkit-details-marker { display:none; }
.ptb-preise__paket-fuss { margin-top:auto; padding-top:20px; font-size:12.5px; font-weight:300; color:var(--text-muted); }
.ptb-preise__zubuch { margin-top:56px; display:grid; grid-template-columns:1fr; gap:0; max-width:760px; }
.ptb-preise__zubuch-titel { font-family:var(--font-body); font-weight:200; font-size:21px; letter-spacing:.03em; color:var(--accent-deep); margin-bottom:10px; }
.ptb-preise__zubuch-zeile { display:flex; justify-content:space-between; gap:20px; padding:13px 0; border-top:1px solid rgba(76,69,61,.12); font-size:14.5px; font-weight:300; }
.ptb-preise__zubuch-zeile:last-child { border-bottom:1px solid rgba(76,69,61,.12); }
.ptb-preise__zubuch-preis { color:var(--text-strong); white-space:nowrap; font-weight:400; }
.ptb-preise__klein { font-size:12.5px; font-weight:300; line-height:1.7; color:var(--text-muted); margin-top:26px; max-width:76ch; }
.ptb-preise { background:transparent; padding:0 0 120px; margin-top:96px; border-top:1px solid rgba(76,69,61,.1); }
.ptb-preise > .ptb-container { padding-top:80px; }
.ptb-preise[hidden] { display:none; }
@media (max-width:767px) {
  .ptb-preise { padding-bottom:80px; }
}
.ptb-preise[hidden] { display:none; }
.ptb-preise__vor { margin:30px auto 0; max-width:60ch; text-align:center; font-family:var(--font-body); font-size:19px; font-weight:300; line-height:1.6em; color:var(--text-body); }
.ptb-preise__paket-name { color:var(--text-contrast); }
.ptb-preise__paket-claim { font-family:var(--font-body); font-weight:300; font-size:1.25rem; line-height:1.4; color:var(--text-body); }
.ptb-preise__paket li { font-size:17px; }
.ptb-preise__paket-cta { margin-top:auto; align-self:flex-start; }
.ptb-preise__paket ul + .ptb-preise__paket-cta,
.ptb-preise__paket details + .ptb-preise__paket-cta { margin-top:auto; }
.ptb-preise__paket-kern > .ptb-preise__paket-cta { margin-top:auto; position:relative; top:24px; margin-bottom:24px; }
.ptb-preise__paket-fuss { margin-top:16px; }
.ptb-preise__zwei { display:grid; grid-template-columns:1fr; gap:44px 72px; margin-top:72px; }
@media (min-width:1024px) {
  .ptb-preise__zwei { grid-template-columns:1fr 1fr; }
}
.ptb-preise__zwei .ptb-preise__zubuch { margin-top:0; max-width:none; }
.ptb-preise__zubuch-titel { font-family:var(--font-body); font-weight:300; font-size:34px; line-height:1.15; letter-spacing:0; color:var(--text-contrast); margin:0 0 20px; }
.ptb-preise__zubuch-zeile { font-size:16px; }
.ptb-preise__warum-liste { list-style:none; margin:0; padding:0; }
.ptb-preise__warum-liste li { padding:13px 0; border-top:1px solid rgba(76,69,61,.12); font-size:16px; font-weight:300; line-height:1.5; }
.ptb-preise__warum-liste li:last-child { border-bottom:1px solid rgba(76,69,61,.12); }
.ptb-preise__warum-nach { margin-top:16px; font-size:16px; font-weight:300; }
@media (max-width:767px) {
  .ptb-preise__vor { font-size:15px; line-height:1.6; }
}
.ptb-preise__vor { margin-top:var(--t-nach); }
/* ===========================================================================
   Schicht 5 — cb04-intro
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-intro { position:relative; width:100%; background-color:var(--surface-muted); }
.ptb-intro__container { max-width:100%; margin:0 auto; padding:0; position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; }
.ptb-intro__cols { max-width:100%; width:100%; display:flex; flex-direction:row; flex-wrap:nowrap; gap:0; min-height:75vh; }
.ptb-intro__col { display:flex; flex-direction:column; position:relative; width:50%; background-size:cover; }
.ptb-intro__text { align-items:center; justify-content:center; text-align:center; padding:8rem; }
.ptb-intro__h2 { max-width:100%; text-align:center; color:var(--text-strong); font-family:var(--font-display); font-size:85px; font-weight:100; line-height:.9em; font-style:normal; margin:15px 0 0; }
.ptb-intro__h2s { max-width:100%; text-align:center; color:var(--text-strong); font-family:var(--font-script); font-size:85px; font-weight:100; line-height:.9em; font-style:normal; margin:0; }
.ptb-intro__h2s-script { font-family:var(--font-script); display:block; margin-top:0; font-size:80px; font-weight:400; color:var(--accent); opacity:1; }
.ptb-intro__rt { max-width:100%; margin-top:30px; text-align:center; color:var(--text-strong); font-family:var(--font-body); font-size:19px; font-weight:200; line-height:1.6em; }
.ptb-intro__rt p { margin:0; }
.ptb-intro__btns { width:100%; display:flex; flex-direction:row; flex-wrap:wrap; justify-content:center; gap:30px; align-items:flex-start; max-width:100%; position:relative; }
.ptb-intro__btn { margin-top:50px; max-width:100%; }
.ptb-intro__btn--2 { display:inline-block; }
.ptb-intro__bild { overflow:hidden; }
.ptb-intro__bild-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:0% 0%; }
@media (max-width:1119px) {
  .ptb-intro__cols { flex-direction:column; flex-wrap:nowrap; }
  .ptb-intro__col { width:100%; }
  .ptb-intro__bild { min-height:60vh; }
}
@media (max-width:767px) {
  .ptb-intro__cols { gap:15px; }
  .ptb-intro__text { padding:4rem 1.5rem; }
  .ptb-intro__h2,
  .ptb-intro__h2s { font-size:40px; margin-top:20px; }
  .ptb-intro__h2s-script { font-size:40px; }
  .ptb-intro__rt { margin-top:20px; font-size:14px; line-height:1.7em; }
  .ptb-intro__btns { width:100%; margin-top:0; }
  .ptb-intro__btn { width:100%; }
  .ptb-intro__btn--2 { margin-top:0; }
}
.ptb-intro__rt { color:var(--text-body); font-weight:300; }
@media (max-width:767px) {
  .ptb-intro__text p { font-size:15px; line-height:1.6; }
}
.ptb-intro__h2 { font-size:var(--t-h2); }
.ptb-intro__h2s-script { font-size:var(--t-script); margin-top:var(--t-versatz); }
.ptb-intro__h2s { font-size:var(--t-script); }
.ptb-intro__rt { margin-top:var(--t-nach); }
@media (max-width:767px) {
  .ptb-intro__h2s { margin-top:var(--t-versatz); }
  .ptb-intro__rt { font-size:15px; line-height:1.6; }
  .ptb-intro__btns { gap:12px; }
  .ptb-intro__btn { margin-top:28px; }
  .ptb-intro__btn--2 { margin-top:0; }
}
/* --- Erweiterungen Seitenplan 30.09.: Kicker, Liste im Text, Variante ohne Bild --------- */
.ptb-intro__kicker { margin-bottom: 4px; text-align: center; }
.ptb-intro__kicker:empty { display: none; }
.ptb-intro__rt > * + * { margin-top: 1em; }
.ptb-intro__rt ul { list-style: none; margin: 1.2em auto 0; padding: 0; display: inline-flex; flex-direction: column; gap: .35em; text-align: left; }
.ptb-intro__rt li { position: relative; padding-left: 24px; }
.ptb-intro__rt li::before { content: ""; position: absolute; left: 0; top: .85em; width: 12px; height: 1px; background: var(--accent); }
.ptb-intro--ohne-bild .ptb-intro__bild { display: none; }
.ptb-intro--ohne-bild .ptb-intro__cols { min-height: 0; }
.ptb-intro--ohne-bild .ptb-intro__col { width: 100%; }
.ptb-intro--ohne-bild .ptb-intro__text { padding: var(--s-oben) 20px var(--s-unten); }
.ptb-intro--ohne-bild .ptb-intro__rt { max-width: 760px; }
/* Lange Überschriften (SEO-Titel wie „Westend Tower: Exklusive Eventlocation in Frankfurt“): kleinere Stufe */
.ptb-intro--lang .ptb-intro__h2 { font-size: clamp(40px, 3.8vw, 58px); line-height: 1; }
.ptb-intro__rt a { color: inherit; text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 4px; transition: color .4s var(--ease); }
.ptb-intro__rt a:hover { color: var(--text-link-hover); }
/* ===========================================================================
   Schicht 5 — cb26-partner
   Ein Preferred Partner je Block (Preferred Partner ×3): Name, Text, Kontaktwege,
   daneben eine Bilderreihe im Hochformat (zwei Bilder sichtbar). Variante --gespiegelt
   setzt die Bilder nach links, damit drei Partner hintereinander im Wechsel laufen.
   Flächenwechsel weiß/Papier über ptb-section--muted wie überall.
   =========================================================================== */
.ptb-partner { background: var(--surface-page); color: var(--text-body); padding-block: var(--s-oben) var(--s-unten); }
.ptb-partner__raster { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 80px; align-items: center; }
.ptb-partner--gespiegelt .ptb-partner__text { order: 2; }
.ptb-partner__name { color: var(--text-strong); font-family: var(--font-display); font-size: clamp(44px, 4.4vw, 66px); font-weight: 100; line-height: .95; }
.ptb-partner__rt { margin-top: var(--t-nach); max-width: 56ch; font-size: 18px; font-weight: 300; line-height: 1.65; }
.ptb-partner__rt > * + * { margin-top: 1em; }
.ptb-partner__kontakt { list-style: none; margin: 36px 0 0; padding: 0; border-top: 1px solid var(--border-default); }
.ptb-partner__kontakt li { border-bottom: 1px solid var(--border-default); }
.ptb-partner__weg {
  display: flex; align-items: center; gap: 16px; min-height: var(--tap-min); padding: 10px 0;
  color: var(--text-strong); font-size: 17px; font-weight: 300; text-decoration: none; overflow-wrap: anywhere;
  transition: color .4s var(--ease);
}
.ptb-partner__weg:hover { color: var(--text-link-hover); }
.ptb-partner__icon { width: 20px; height: 20px; flex: none; fill: none; stroke: var(--text-kicker); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.ptb-partner__bild { flex: 0 0 calc(50% - 7px); aspect-ratio: 4 / 5; overflow: hidden; background: var(--border-subtle); }
.ptb-partner__bild img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 1023px) {
  .ptb-partner__raster { grid-template-columns: minmax(0, 1fr); gap: 48px; }
  .ptb-partner--gespiegelt .ptb-partner__text { order: 0; }
}
@media (max-width: 767px) {
  .ptb-partner__rt { font-size: 16px; }
  .ptb-partner__bild { flex-basis: 78%; }
}
.ptb-partner__galerie { min-width: 0; }
/* ===========================================================================
   Schicht 5 — cb19-kennzahlen
   Drei bis vier Zahlen mit Beschriftung (Startseite, Unternehmen). Aufbau wie das
   Kennzahlenband der Entwurfs-Startseite: Haarlinie oben und unten, senkrechte Trenner.
   Die Zahl steht in Brand Stylist 100, die Beschriftung darunter; im Markup kommt die
   Beschriftung zuerst (dt vor dd), die Reihenfolge dreht erst die Darstellung.
   =========================================================================== */
.ptb-kennzahlen { background: var(--surface-page); padding-block: 0 var(--s-unten); }
.ptb-kennzahlen__liste {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  margin: 0; padding: 40px 0; border-block: 1px solid var(--border-default);
}
.ptb-kennzahlen__zahl { display: flex; flex-direction: column-reverse; gap: 10px; padding: 4px 36px; }
.ptb-kennzahlen__zahl + .ptb-kennzahlen__zahl { border-left: 1px solid var(--border-default); }
.ptb-kennzahlen__zahl:first-child { padding-left: 0; }
.ptb-kennzahlen__wert {
  margin: 0; color: var(--text-strong);
  font-family: var(--font-display); font-size: clamp(52px, 5.6vw, 84px); font-weight: 100; line-height: .95;
  font-variant-numeric: lining-nums;
}
.ptb-kennzahlen__label {
  color: var(--text-soft);
  font-size: 14px; font-weight: 300; line-height: 1.4; letter-spacing: .12em; text-transform: uppercase;
}
@media (max-width: 767px) {
  .ptb-kennzahlen__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 8px 0; }
  .ptb-kennzahlen__zahl { padding: 24px 0 24px 18px; }
  .ptb-kennzahlen__zahl + .ptb-kennzahlen__zahl { border-left: 0; }
  .ptb-kennzahlen__zahl:nth-child(even) { border-left: 1px solid var(--border-default); }
  .ptb-kennzahlen__zahl:nth-child(odd) { padding-left: 0; }
  .ptb-kennzahlen__zahl:nth-child(n+3) { border-top: 1px solid var(--border-default); }
  .ptb-kennzahlen__label { font-size: 12px; }
}
/* ===========================================================================
   Schicht 5 — cb21-team
   Personen mit Bild, Name, Rolle (Unternehmen). Porträts 4:5 ohne Rundung, Name in
   Brand Stylist 400 wie Karten-Titel. Jede zweite Spalte sitzt tiefer — ein ruhiger
   Versatz statt eines starren Rasters, der mobil in zwei Spalten erhalten bleibt.
   =========================================================================== */
.ptb-team { background: var(--surface-page); color: var(--text-body); padding-block: var(--s-oben) var(--s-unten); }
.ptb-team__kopf { margin-bottom: 64px; }
.ptb-team__liste {
  list-style: none; margin: 0; padding: 0 0 72px;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 56px 32px;
}
.ptb-team__person:nth-child(even) { transform: translateY(72px); }
.ptb-team__bild { margin: 0; aspect-ratio: 4 / 5; overflow: hidden; background: var(--border-subtle); }
.ptb-team__bild img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
.ptb-team__name { margin-top: 20px; color: var(--text-strong); font-family: var(--font-display); font-size: 30px; font-weight: 400; line-height: 1; }
.ptb-team__rolle { margin-top: 8px; color: var(--text-soft); font-size: 13px; font-weight: 300; line-height: 1.45; letter-spacing: .1em; text-transform: uppercase; }
@media (max-width: 1023px) {
  .ptb-team__liste { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ptb-team__person:nth-child(even) { transform: none; }
  .ptb-team__person:nth-child(3n+2) { transform: translateY(48px); }
  .ptb-team__liste { padding-bottom: 48px; }
}
@media (max-width: 767px) {
  .ptb-team__kopf { margin-bottom: 40px; }
  .ptb-team__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 14px; padding-bottom: 40px; }
  .ptb-team__person:nth-child(3n+2) { transform: none; }
  .ptb-team__person:nth-child(even) { transform: translateY(40px); }
  .ptb-team__name { font-size: 24px; margin-top: 14px; }
  .ptb-team__rolle { font-size: 11px; letter-spacing: .08em; }
}
/* Optionales Zitat je Person (Unternehmen „Das Team stellt sich vor“; ersetzt cb22, Chris 30.09.2026).
   Nur wo gefüllt; Kicker/H2 des Abschnitts stehen dann im Blockkopf. */
.ptb-team__zitat {
  margin: 16px 0 0; padding-left: 16px; border-left: 1px solid var(--accent);
  color: var(--text-body); font-size: 15px; font-weight: 300; line-height: 1.6;
}
.ptb-team__zitat:empty { display: none; }
@media (max-width: 767px) { .ptb-team__zitat { font-size: 14px; padding-left: 12px; } }
/* ===========================================================================
   Schicht 5 — cb05-rundgang
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-rundgang { position:relative; width:100%; background-color:var(--surface-page); }
.ptb-rundgang__container { max-width:100%; margin:0 auto; padding:0; display:flex; flex-direction:column; }
.ptb-rundgang__col { width:100%; display:flex; flex-direction:column; align-items:center; text-align:center; padding:0; }
.ptb-rundgang__col iframe { width:100vw; max-width:100%; height:680px; border:0; display:block; margin-top:0; }
/* ===========================================================================
   Schicht 5 — cb06-grundriss
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-grundriss { position:relative; width:100%; background-color:var(--surface-muted); }
.ptb-grundriss__container { max-width:var(--shell-max); margin:0 auto; padding:100px 20px; display:flex; flex-direction:column; align-items:center; text-align:center; }
.ptb-grundriss__container img { max-width:100%; width:100%; height:auto; display:block; }
.ptb-grundriss__text { max-width:100%; color:var(--text-caption); font-family:var(--font-body); font-size:15px; font-weight:200; margin-top:25px; line-height:1.6; }
@media (max-width:479px) {
  .ptb-grundriss__container { padding-bottom:50px; padding-top:50px; }
}
.ptb-grundriss__text { color:var(--text-body); font-weight:300; }
/* ===========================================================================
   Schicht 5 — cb07-kapazitaeten
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-kap__widget,
.ptb-kap__widget *,
.ptb-kap__widget *::before,
.ptb-kap__widget *::after { box-sizing:border-box; font-style:normal!important; }
.ptb-kap__widget *,
.ptb-kap__widget *::before,
.ptb-kap__widget *::after { font-family:inherit!important; }
.ptb-kap__widget { --cap-gold:#D6B692; --cap-ink:#3C3C3C; --cap-line:#E0DCD8; --cap-sans:var(--font-body); --cap-display:var(--font-display); --cap-script:var(--font-script); max-width:1200px; margin:0 auto; padding:48px 0; background:transparent; color:var(--cap-ink); font-family:var(--cap-sans)!important; font-size:19px!important; font-weight:200!important; line-height:1.3!important; text-align:left; }
.ptb-kap__widget svg { overflow:visible; }
.ptb-kap__head { display:grid; grid-template-columns:3fr 2fr; align-items:start; padding:0 0 51px; }
.ptb-kap__widget h2.ptb-kap__title { display:block; margin:0!important; padding:0!important; line-height:1!important; text-transform:none!important; }
.ptb-kap__widget h2.ptb-kap__title::before,
.ptb-kap__widget h2.ptb-kap__title::after { content:none!important; display:none!important; }
.ptb-kap__widget .ptb-kap__title-main { display:block; font-family:var(--cap-display)!important; font-size:86px!important; font-weight:400!important; line-height:1!important; letter-spacing:0!important; text-transform:none!important; color:var(--cap-ink); margin-left:100px; }
.ptb-kap__widget .ptb-kap__title-script { display:block; font-family:var(--cap-script)!important; font-size:87px!important; font-weight:400!important; line-height:1!important; letter-spacing:0!important; text-transform:none!important; color:var(--cap-gold); margin:-39px 0 0 80px; position:relative; top:18px; }
.ptb-kap__total { padding-top:6px; position:relative; top:11px; }
.ptb-kap__total-row { display:flex; align-items:center; gap:44px; margin-top:20px; }
.ptb-kap__total-icon { flex:0 0 auto; width:103px; color:var(--cap-gold); }
.ptb-kap__total-icon svg { display:block; width:100%; height:auto; }
.ptb-kap__total-count { flex:0 0 auto; text-align:center; }
.ptb-kap__total-num { font-size:44px!important; font-weight:200!important; line-height:1!important; color:var(--cap-gold); }
.ptb-kap__total-unit { font-size:19px!important; font-weight:100!important; letter-spacing:.05em; text-transform:uppercase; color:var(--cap-gold); line-height:1!important; }
.ptb-kap__total-text { flex:0 1 auto; }
.ptb-kap__total-label { font-size:19px!important; font-weight:100!important; letter-spacing:.05em; text-transform:uppercase; color:var(--cap-gold); line-height:1.3!important; }
.ptb-kap__total-sub { font-size:19px!important; font-weight:100!important; color:var(--cap-gold); line-height:1.3!important; max-width:170px; }
@media (max-width:768px) {
  .ptb-kap__widget { padding:32px 0; font-size:16px!important; }
  .ptb-kap__head { grid-template-columns:1fr; gap:36px; padding-bottom:28px; }
  .ptb-kap__widget h2.ptb-kap__title { text-align:center; }
  .ptb-kap__widget .ptb-kap__title-main { font-size:56px!important; margin-left:0; text-align:center; position:relative; left:4px; }
  .ptb-kap__widget .ptb-kap__title-script { font-size:40px!important; margin:-20px 0 0 0; top:9px; left:8px; text-align:center; }
  .ptb-kap__total { top:0; padding-top:0; margin-top:16px; }
  .ptb-kap__total-row { gap:28px; justify-content:center; }
  .ptb-kap__total-icon { width:78px; }
  .ptb-kap__total-num { font-size:36px!important; }
  .ptb-kap__total-unit,
  .ptb-kap__total-label,
  .ptb-kap__total-sub { font-size:15px!important; }
}
.ptb-kap { position:relative; width:100%; background-color:var(--surface-page); }
.ptb-kap__container { max-width:var(--shell-max); margin:0 auto; padding:70px 20px 100px; display:flex; flex-direction:column; }
.ptb-kap .ptb-kap__widget { padding-bottom:0; }
.ptb-kap__raum { margin-top:56px; }
.ptb-kap__raum + .ptb-kap__raum { margin-top:0; }
.ptb-kap__raum + .ptb-kap__raum .ptb-raster { border-top:0; }
.ptb-kap__raum .ptb-raster { margin-top:0; }
.ptb-kap__titelzelle { align-items:flex-start; justify-content:center; text-align:left; }
.ptb-kap__raumtitel { font-family:var(--font-body); font-size:22px; font-weight:400; letter-spacing:.03em; text-transform:uppercase; color:var(--text-contrast); margin:0; line-height:1.25; }
.ptb-kap__raumtitel-sub { display:block; margin-top:6px; font-size:15px; font-weight:300; letter-spacing:.02em; text-transform:none; color:var(--text-contrast); }
.ptb-kap__icon { width:74px; height:52px; display:flex; align-items:center; justify-content:center; color:var(--cap-ink,var(--ptb-cap-ink)); }
.ptb-kap__icon svg { width:100%; height:100%; display:block; }
.ptb-kap__num { margin-top:12px; font-family:var(--font-body); font-size:26px; font-weight:200; line-height:1; color:var(--text-strong); }
.ptb-kap__num small { display:block; margin-top:6px; font-size:13px; font-weight:200; letter-spacing:.05em; text-transform:uppercase; }
@media (max-width:767px) {
  .ptb-kap__raum { margin-top:32px; }
  .ptb-kap__raum + .ptb-kap__raum { margin-top:0; }
  .ptb-kap__titelzelle { grid-column:1/-1; border-left:0!important; }
  .ptb-kap__raumtitel { font-size:18px; }
  .ptb-kap__num { font-size:22px; }
}
.ptb-kap .ptb-kap__widget .ptb-kap__title-main { margin-left:0; }
.ptb-kap .ptb-kap__widget .ptb-kap__title-script { margin-left:0; }
.ptb-kap .ptb-kap__total-num,
.ptb-kap .ptb-kap__total-unit,
.ptb-kap .ptb-kap__total-label,
.ptb-kap .ptb-kap__total-sub { color:var(--text-contrast); }
.ptb-kap__strom { display:contents; }
.ptb-kap__strom .ptb-raster__zelle:first-child { border-left:1px solid var(--border-default); }
.ptb-kap__pfeile { display:none; }
@media (min-width:768px) and (max-width:1023px) {
  .ptb-kap__strom .ptb-raster__zelle:nth-child(3n) { border-left:0; }
  .ptb-kap__strom .ptb-raster__zelle:nth-child(3n+1) { border-left:1px solid var(--border-default); }
}
@media (max-width:767px) {
  .ptb-kap__widget .ptb-kap__title-main { font-size:var(--t-h2)!important; }
  .ptb-kap__widget .ptb-kap__title-script { font-size:var(--t-script)!important; }
  .ptb-kap__raum .ptb-raster__grid--6 { display:block; }
  .ptb-kap__titelzelle { display:flex; flex-direction:row; align-items:center; justify-content:space-between; gap:12px; padding:20px 0; border-left:0!important; }
  .ptb-kap__titelzelle .ptb-kap__raumtitel { flex:1 1 auto; }
  .ptb-kap__pfeile { display:flex; gap:8px; flex:0 0 auto; }
  .ptb-kap__pfeil { width:38px; height:38px; border-radius:50%; border:1px solid var(--border-default); background:var(--surface-page); color:var(--text-strong); display:inline-flex; align-items:center; justify-content:center; padding:0; cursor:pointer; transition:opacity .45s var(--ease),border-color .45s var(--ease); }
  .ptb-kap__pfeil svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.2; stroke-linecap:round; stroke-linejoin:round; }
  .ptb-kap__pfeil:not([disabled]):hover { border-color:var(--accent-deep); }
  .ptb-kap__pfeil[disabled] { opacity:.3; cursor:default; }
  .ptb-kap__strom { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; border-top:1px solid var(--border-default); }
  .ptb-kap__strom::-webkit-scrollbar { display:none; }
  .ptb-kap__strom .ptb-raster__zelle { flex:0 0 42%; scroll-snap-align:start; border-left:1px solid var(--border-default)!important; padding:22px 10px 20px; }
  .ptb-kap__strom .ptb-raster__zelle:first-child { border-left:0!important; }
}
.ptb-kap__titelzelle { align-items:flex-start; text-align:left; }
.ptb-kap__pfeil { border-color:var(--text-strong); color:var(--text-strong); }
.ptb-kap__pfeil[disabled] { opacity:1; }
.ptb-kap__icon svg { stroke-width:10.5; }
@media (max-width:767px) {
  .ptb-kap__titelzelle { align-items:center; }
}
/* Wrapper der Raumzeilen (Zeus-Repeater), ohne eigene Gestaltung */
.ptb-kap__raeume { display:block; }
/* ===========================================================================
   Schicht 5 — cb08-technik
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-technik { background:var(--surface-muted); padding:120px 0 130px; position:relative; }
.ptb-technik { padding-top:var(--s-oben); padding-bottom:var(--s-unten); }
/* ===========================================================================
   Schicht 5 — cb09-anlaesse
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-anlaesse { background:var(--surface-page); padding:120px 0 130px; position:relative; overflow:hidden; }
.ptb-anlaesse__vor { margin-top:26px; max-width:52ch; font-family:var(--font-body); font-size:19px; font-weight:200; line-height:1.6em; color:var(--text-strong); }
.ptb-anlaesse__kopf { display:flex; flex-wrap:wrap; align-items:end; justify-content:space-between; gap:20px 40px; }
.ptb-anlaesse .ptb-slider--bleed { margin-top:52px; }
.ptb-anlaesse__karte img { width:100%; height:100%; object-fit:cover; display:block; transition:transform 1.4s var(--ease); }
.ptb-anlaesse__karte:hover img { transform:scale(1.04); }
.ptb-anlaesse__cap { position:absolute; left:0; right:0; bottom:0; padding:120px 28px 26px; background:linear-gradient(to top,rgba(21,18,15,.72),rgba(21,18,15,0)); color:var(--surface-muted); display:flex; flex-direction:column; gap:6px; }
.ptb-anlaesse__titel { font-family:var(--font-display); font-size:40px; line-height:1; font-weight:400; }
.ptb-anlaesse__sub { font-family:var(--font-body); font-size:13px; font-weight:300; letter-spacing:.1em; text-transform:uppercase; color:rgba(251,247,242,.78); }
@media (max-width:767px) {
  .ptb-anlaesse__titel { font-size:30px; }
  .ptb-anlaesse__cap { padding:80px 20px 20px; }
}
.ptb-anlaesse__vor { color:var(--text-body); font-weight:300; }
.ptb-anlaesse__sub { color:var(--text-body); font-weight:300; }
.ptb-anlaesse__sub { color:rgba(251,247,242,.85); }
@media (prefers-reduced-motion:reduce) {
  .ptb-anlaesse__karte img { transition:none; }
}
@media (max-width:767px) {
  .ptb-anlaesse__vor { font-size:15px; line-height:1.6; }
}
.ptb-anlaesse__vor { margin-top:calc(var(--t-nach) - 4px); }
.ptb-anlaesse { padding-top:var(--s-oben); padding-bottom:var(--s-unten); }
@media (max-width:767px) {
  .ptb-anlaesse__vor { margin-top:0; }
}
/* --- Link je Karte (Startseite: Anlass-Kacheln auf die Hubs; Seitenplan 30.09.) --------- */
.ptb-anlaesse__link { color: inherit; text-decoration: none; }
.ptb-anlaesse__link::after { content: ""; position: absolute; inset: 0; }
.ptb-anlaesse__link:focus-visible { outline: none; }
.ptb-anlaesse__link:focus-visible::after { outline: var(--focus-ring-width) solid var(--accent); outline-offset: -8px; }
/* ===========================================================================
   Schicht 5 — cb10-raeume
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-raeume { background:var(--surface-muted); padding:120px 0 130px; position:relative; }
.ptb-raeume__vor { margin:30px auto 0; max-width:56ch; text-align:center; font-family:var(--font-body); font-size:19px; font-weight:200; line-height:1.6em; color:var(--text-strong); }
.ptb-raeume__tabs { display:flex; flex-direction:column; align-items:center; align-self:stretch; width:100%; margin-top:56px; }
.ptb-raeume__menu { display:flex; flex-direction:row; gap:6px; padding:6px; width:100%; overflow:auto; margin:0 0 24px; border:1px solid var(--border-default); border-radius:0; background:var(--surface-page); scrollbar-width:none; }
.ptb-raeume__menu::-webkit-scrollbar { display:none; }
.ptb-raeume__tab { flex:1 0 auto; position:relative; display:inline-block; margin:0; padding:13px 26px; border:0; border-radius:0; background:transparent; color:var(--text-strong); font-family:var(--font-condensed); font-size:18px; line-height:1; text-transform:uppercase; text-align:center; white-space:nowrap; letter-spacing:.02em; cursor:pointer; transition:background .5s var(--ease),color .5s var(--ease),border-color .5s var(--ease); }
.ptb-raeume__tab:hover { background:var(--surface-tab-hover); }
.ptb-raeume__tab[aria-selected="true"] { background:var(--text-strong); color:var(--surface-muted); }
.ptb-raeume__tab:focus-visible { outline:2px solid var(--accent-deep); outline-offset:2px; }
.ptb-raeume__panes { display:block; position:relative; overflow:hidden; width:100%; }
.ptb-raeume__pane { display:none; position:relative; }
.ptb-raeume__pane:not([hidden]) { display:block; animation:ptb-tab-ein .3s ease both; }
@keyframes ptb-tab-ein { from{opacity:0}to{opacity:1} }
.ptb-raeume__oben { display:flex; gap:32px; align-items:center; justify-content:flex-start; background:var(--surface-page); border:1px solid var(--border-default); border-bottom:0; border-radius:0; padding:40px 44px; }
.ptb-raeume__text { width:58%; }
.ptb-raeume__titel { font-family:var(--font-display); font-weight:400; font-size:46px; line-height:.95; color:var(--text-strong); margin:0; }
.ptb-raeume__titel-script { display:block; font-family:var(--font-script); font-size:.9em; font-weight:400; color:var(--accent); opacity:1; margin-top:.05em; }
.ptb-raeume__fakt { margin-top:14px; font-family:var(--font-body); font-size:13px; font-weight:300; letter-spacing:.08em; text-transform:uppercase; color:var(--accent-deep); }
.ptb-raeume__abs { margin-top:16px; font-family:var(--font-body); font-size:19px; font-weight:200; line-height:1.6em; color:var(--text-strong); }
.ptb-raeume__plan { width:42%; height:250px; display:flex; justify-content:flex-end; align-items:center; }
.ptb-raeume__plan img { width:100%; max-width:none; height:100%; object-fit:contain; object-position:100% 50%; display:block; }
.ptb-raeume__plan--leer { justify-content:center; border:1px dashed var(--border-default); font-size:13px; color:var(--text-muted); }
.ptb-raeume__unten { background:var(--surface-page); border:1px solid var(--border-default); border-top:0; border-radius:0; padding:0 44px 40px; }
@media (max-width:991px) {
  .ptb-raeume__text { width:100%; }
}
@media (max-width:767px) {
  .ptb-raeume__tabs { margin-top:36px; }
  .ptb-raeume__menu { margin-bottom:12px; padding:4px; gap:4px; }
  .ptb-raeume__tab { padding:11px 16px; font-size:16px; }
  .ptb-raeume__oben,
  .ptb-raeume__unten { border-radius:0; }
  .ptb-raeume__oben { flex-direction:column; align-items:flex-start; gap:20px; padding:36px 30px 30px; }
  .ptb-raeume__plan { width:100%; height:160px; justify-content:center; }
  .ptb-raeume__plan img { object-position:50% 50%; }
  .ptb-raeume__unten { padding:0 22px 22px; }
}
.ptb-raeume__vor,
.ptb-raeume__abs { color:var(--text-body); font-weight:300; }
@media (prefers-reduced-motion:reduce) {
  .ptb-raeume__pane:not([hidden]) { animation:none; }
}
@media (max-width:767px) {
  .ptb-raeume__vor { font-size:15px; line-height:1.6; }
  .ptb-raeume__abs { font-size:15px; line-height:1.6; }
}
.ptb-raeume__vor { margin-top:var(--t-nach); }
@media (max-width:767px) {
  .ptb-raeume__titel { font-size:29px; }
}
.ptb-raeume { padding-top:var(--s-oben); padding-bottom:var(--s-unten); }
/* ===========================================================================
   Schicht 5 — cb11-faq
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-faq { background:var(--surface-page); padding:120px 0 130px; position:relative; }
.ptb-faq__grid { display:grid; grid-template-columns:1fr; gap:0 48px; margin-top:45px; }
@media (min-width:1024px) {
  .ptb-faq__grid { grid-template-columns:1fr 1fr; }
}
.ptb-faq__col { display:flex; flex-direction:column; border-top:1px solid var(--border-default); }
.ptb-faq__item { border-bottom:1px solid var(--border-default); }
.ptb-faq__h { font-size:1.25em; font-weight:500; margin:0; padding:0; text-align:left; }
.ptb-faq__q { border:none; margin:0; width:100%; overflow:visible; background:transparent; line-height:normal; appearance:none; padding:23px 4px; display:inline-flex; flex-direction:row; align-items:center; justify-content:space-between; gap:20px; cursor:pointer; color:inherit; text-align:left; transition:color .4s var(--ease); }
.ptb-faq__q:hover { color:var(--accent-deep); }
.ptb-faq__t { text-align:left; font-family:var(--font-body); font-size:20px; font-weight:200; line-height:1.3; transition:color .35s var(--ease); }
.ptb-faq__ico { display:flex; align-items:center; font-size:1em; flex:0 0 auto; color:var(--text-strong); transition:transform .3s ease; }
.ptb-faq__ico svg { width:1em; height:1em; }
.ptb-faq__ico--auf,
.ptb-faq__q[aria-expanded="true"] .ptb-faq__ico--zu { display:none; }
.ptb-faq__q[aria-expanded="true"] .ptb-faq__ico--auf { display:flex; }
.ptb-faq__a { overflow:hidden; transition:height .3s ease; }
.ptb-faq__ac { padding:0 4px 23px; font-family:var(--font-body); font-size:19px; font-weight:200; line-height:1.6em; color:var(--text-strong); max-width:64ch; }
.ptb-faq__ac ul { margin:8px 0 0; padding-left:18px; }
.ptb-faq__ac li { margin-bottom:5px; }
@media (max-width:767px) {
  .ptb-faq__grid { margin-top:20px; }
  .ptb-faq__t { font-size:16px; }
  .ptb-faq__ac { font-size:14px; }
}
.ptb-faq__ac { color:var(--text-body); font-weight:300; }
.ptb-faq__t { color:var(--text-body); font-weight:300; }
@media (max-width:767px) {
  .ptb-faq__t { font-size:17px; }
  .ptb-faq__ac { font-size:15px; }
  .ptb-faq__grid { margin-top:32px; }
}
.ptb-faq { padding-top:var(--s-oben); padding-bottom:var(--s-unten); }
.ptb-faq__q:hover .ptb-faq__t,
.ptb-faq__q:focus-visible .ptb-faq__t { color:var(--accent-deep); }
/* Links in Antworten (übernommene Texte der Live-Seite) im Link-Stil der Marke */
.ptb-faq__ac a { color: inherit; text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; }
.ptb-faq__ac a:hover { color: var(--text-link-hover); }
/* ===========================================================================
   Schicht 5 — cb12-bewertungen
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-bewertungen__wrapper { width:100%; margin:40px 0; position:relative; overflow:hidden; }
.ptb-bewertungen__wrapper::before,
.ptb-bewertungen__wrapper::after { content:''; position:absolute; top:0; bottom:60px; width:120px; pointer-events:none; z-index:10; }
.ptb-bewertungen__wrapper::before { left:0; background:linear-gradient(to right,var(--surface-muted),transparent); }
.ptb-bewertungen__wrapper::after { right:0; background:linear-gradient(to left,var(--surface-muted),transparent); }
.ptb-bewertungen__reihen { display:flex; flex-direction:column; gap:20px; }
.ptb-bewertungen__reihen--mobil { display:none; }
.ptb-bewertungen__reihe { width:100%; overflow:visible; }
.ptb-bewertungen__slides { display:flex; gap:20px; transition:transform .4s cubic-bezier(.4,0,.2,1); will-change:transform; }
/* Karten immer weiß (Chris 30.09.2026) — abgesetzt über Haarlinie und den warmen Kachelschatten des Designpakets statt
   über die Farbe, damit sie auf Weiß und auf Papier gleich lesbar sind (vorher weiß auf Weiß: „teilweise durchsichtig“) */
.ptb-bewertungen__karte { background:var(--surface-card); border:1px solid var(--border-subtle); border-radius:16px; padding:28px; box-shadow:0 14px 26px -18px rgba(76,69,61,.5); min-width:350px; max-width:450px; flex-shrink:0; content-visibility:auto; contain-intrinsic-size:350px 220px; }
.ptb-bewertungen__karte-kopf { display:flex; align-items:center; margin-bottom:16px; gap:12px; }
.ptb-bewertungen__avatar { width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--text-inverse); font-weight:700; font-size:18px; flex-shrink:0; box-shadow:0 2px 8px rgba(0,0,0,.1); }
/* Avatar-Farben: data-ptb-avatar="1…12" → Tokens --ptb-avatar-* (Schicht 1) */
.ptb-bewertungen__avatar[data-ptb-avatar="1"] { background: var(--ptb-avatar-1); }
.ptb-bewertungen__avatar[data-ptb-avatar="2"] { background: var(--ptb-avatar-2); }
.ptb-bewertungen__avatar[data-ptb-avatar="3"] { background: var(--ptb-avatar-3); }
.ptb-bewertungen__avatar[data-ptb-avatar="4"] { background: var(--ptb-avatar-4); }
.ptb-bewertungen__avatar[data-ptb-avatar="5"] { background: var(--ptb-avatar-5); }
.ptb-bewertungen__avatar[data-ptb-avatar="6"] { background: var(--ptb-avatar-6); }
.ptb-bewertungen__avatar[data-ptb-avatar="7"] { background: var(--ptb-avatar-7); }
.ptb-bewertungen__avatar[data-ptb-avatar="8"] { background: var(--ptb-avatar-8); }
.ptb-bewertungen__avatar[data-ptb-avatar="9"] { background: var(--ptb-avatar-9); }
.ptb-bewertungen__avatar[data-ptb-avatar="10"] { background: var(--ptb-avatar-10); }
.ptb-bewertungen__avatar[data-ptb-avatar="11"] { background: var(--ptb-avatar-11); }
.ptb-bewertungen__avatar[data-ptb-avatar="12"] { background: var(--ptb-avatar-12); }
.ptb-bewertungen__person { flex-grow:1; min-width:0; }
.ptb-bewertungen__name { font-weight:600; font-size:16px; color:var(--ptb-review-name); }
.ptb-bewertungen__sterne { display:flex; gap:0; flex-shrink:0; }
.ptb-bewertungen__sterne > span { font-size:20px; line-height:1; letter-spacing:2px; }
.ptb-bewertungen__sterne > span:last-child { margin-right:-2px; }
.ptb-bewertungen__sterne-voll { color:var(--ptb-review-star); }
.ptb-bewertungen__sterne-leer { color:var(--ptb-review-grey-200); }
.ptb-bewertungen__text { color:var(--ptb-review-grey-600); font-size:15px; line-height:1.6; }
.ptb-bewertungen__text p { margin:0; }
@media (min-width:769px) {
  .ptb-bewertungen__reihe--versetzt .ptb-bewertungen__slides { padding-left:185px; }
}
@media (min-width:481px) and (max-width:768px) {
  .ptb-bewertungen__reihen { gap:16px; }
  .ptb-bewertungen__karte { min-width:300px; max-width:400px; padding:24px; }
  .ptb-bewertungen__reihe--versetzt .ptb-bewertungen__slides { padding-left:0; }
}
@media (max-width:480px) {
  .ptb-bewertungen__wrapper { margin:24px 0; }
  .ptb-bewertungen__wrapper::before,
  .ptb-bewertungen__wrapper::after { display:none; }
  .ptb-bewertungen__reihen--desktop { display:none; }
  .ptb-bewertungen__reihen--mobil { display:flex; }
  .ptb-bewertungen__reihen { gap:0; }
  .ptb-bewertungen__slides { gap:16px; padding:0 16px; }
  .ptb-bewertungen__karte { min-width:calc(100% - 32px); max-width:calc(100% - 32px); padding:24px; }
  .ptb-bewertungen__avatar { width:40px; height:40px; font-size:15px; }
  .ptb-bewertungen__name { font-size:14px; }
  .ptb-bewertungen__sterne > span { font-size:16px; }
  .ptb-bewertungen__text { font-size:12px; }
}
.ptb-bewertungen { position:relative; width:100%; background-color:var(--surface-muted); padding-top:120px; padding-left:50px; padding-right:50px; }
.ptb-bewertungen__container { max-width:100%; margin:0 auto; padding:0 20px 150px; display:flex; flex-direction:column; align-items:flex-start; text-align:left; }
.ptb-bewertungen__kopf { align-self:center; display:flex; flex-direction:column; align-items:center; text-align:center; max-width:100%; }
.ptb-bewertungen__titel { width:100%; text-align:center; color:var(--text-strong); font-family:var(--font-display); font-size:85px; font-weight:100; line-height:.9em; font-style:normal; margin:15px 0 0; }
.ptb-bewertungen__slider { width:100%; max-width:100%; }
.ptb-bewertungen__titel-script { font-family:var(--font-script); display:block; margin-top:0; font-size:80px; font-weight:400; font-style:normal; line-height:.9em; color:var(--accent); }
@media (max-width:767px) {
  .ptb-bewertungen__titel-script { font-size:40px; }
}
@media (max-width:1119px) {
  .ptb-bewertungen { padding-left:35px; padding-right:35px; }
  .ptb-bewertungen__container { padding-left:30px; padding-right:30px; }
}
@media (max-width:1023px) {
  .ptb-bewertungen { padding-top:150px; padding-left:2px; padding-right:0; }
}
@media (max-width:767px) {
  .ptb-bewertungen { padding-top:0; }
  .ptb-bewertungen__container { padding-left:20px; padding-right:20px; padding-top:var(--s-oben); }
  .ptb-bewertungen__titel { margin-top:20px; }
}
@media (max-width:479px) {
  .ptb-bewertungen__container { padding-bottom:40px; }
}
@media (max-width:767px) {
  .ptb-bewertungen__text { font-size:15px; line-height:1.55; }
}
.ptb-bewertungen__titel { font-size:var(--t-h2); }
.ptb-bewertungen__titel-script { font-size:var(--t-script); margin-top:var(--t-versatz); }
/* Navigation wie alle anderen Slider (slider.css: Pfeil-Kreise, Zähler, Punkte rechts),
   linksbündig an der 1300-px-Kante wie cb09/cb17 — Chris 30.09.2026. */
/* Band auf das Kit-Raster (1300 px, 20 px Rand) statt der Prototyp-Innenabstände, damit der Kopf
   dieselbe Kante hat wie die übrigen Blöcke. */
.ptb-bewertungen { padding-left:0; padding-right:0; }
.ptb-bewertungen__container { width:min(100% - 40px, var(--shell-max)); padding-left:0; padding-right:0; }
/* --- Gegenlauf-Laufband (Chris 30.09.2026): keine Navigation, zwei Reihen laufen endlos in
   entgegengesetzte Richtungen. Quelle bleibt die eine Liste (data-repeat); das JS füllt beide Reihen
   und verdoppelt sie für den nahtlosen Lauf ([data-ptb-laeuft]). Ohne JS: Quelle als Wischreihe.
   Abstand über margin statt gap, damit -50 % genau eine Hälfte ist. Hover hält die Reihe an. */
.ptb-bewertungen__reihen--desktop { display:none; }
.ptb-bewertungen__reihen--mobil { display:flex; }
.ptb-bewertungen__reihen--mobil .ptb-bewertungen__reihe { overflow-x:auto; scrollbar-width:none; }
.ptb-bewertungen__wrapper[data-ptb-laeuft] .ptb-bewertungen__reihen--desktop { display:flex; gap:20px; }
.ptb-bewertungen__wrapper[data-ptb-laeuft] .ptb-bewertungen__reihen--mobil { display:none; }
.ptb-bewertungen__wrapper[data-ptb-laeuft] .ptb-bewertungen__reihe { overflow:visible; }
.ptb-bewertungen__wrapper[data-ptb-laeuft] { width:100vw; max-width:none; margin-left:calc(50% - 50vw); margin-right:0; }
.ptb-bewertungen__wrapper[data-ptb-laeuft]::before,
.ptb-bewertungen__wrapper[data-ptb-laeuft]::after { bottom:0; width:min(160px, 12vw); }
.ptb-bewertungen__wrapper[data-ptb-laeuft] .ptb-bewertungen__slides {
  width:max-content; gap:0; padding:0; transition:none;
  animation:ptb-bewertungen-links var(--laufzeit, 90s) linear infinite;
}
.ptb-bewertungen__wrapper[data-ptb-laeuft] [data-ptb-reihe="2"] { animation-name:ptb-bewertungen-rechts; }
.ptb-bewertungen__wrapper[data-ptb-laeuft] .ptb-bewertungen__reihe:hover .ptb-bewertungen__slides,
.ptb-bewertungen__wrapper[data-ptb-laeuft] .ptb-bewertungen__reihe:focus-within .ptb-bewertungen__slides { animation-play-state:paused; }
.ptb-bewertungen__wrapper[data-ptb-laeuft] .ptb-bewertungen__reihe:focus-visible { outline:var(--focus-ring-width) solid var(--focus-ring); outline-offset:calc(var(--focus-ring-width) * -1); }
.ptb-bewertungen__wrapper[data-ptb-laeuft] .ptb-bewertungen__karte { margin-right:20px; content-visibility:visible; }
@keyframes ptb-bewertungen-links { from { transform:translateX(0); } to { transform:translateX(-50%); } }
@keyframes ptb-bewertungen-rechts { from { transform:translateX(-50%); } to { transform:translateX(0); } }
@media (max-width:768px) {
  .ptb-bewertungen__wrapper[data-ptb-laeuft] .ptb-bewertungen__karte { min-width:300px; max-width:300px; margin-right:16px; }
  .ptb-bewertungen__wrapper[data-ptb-laeuft] .ptb-bewertungen__reihen--desktop { gap:16px; }
}
@media (prefers-reduced-motion:reduce) {
  .ptb-bewertungen__wrapper[data-ptb-laeuft] .ptb-bewertungen__slides { animation:none; }
  .ptb-bewertungen__wrapper[data-ptb-laeuft] .ptb-bewertungen__reihe { overflow-x:auto; scrollbar-width:none; }
  .ptb-bewertungen__wrapper[data-ptb-laeuft] [aria-hidden="true"].ptb-bewertungen__karte { display:none; }
}
/* ===========================================================================
   Schicht 5 — cb13-dachterrasse
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-scrub { position:relative; height:420vh; background:var(--surface-dark); }
.ptb-scrub__stage { position:sticky; top:0; height:100dvh; overflow:hidden; background:var(--surface-dark); }
.ptb-scrub__poster { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.ptb-scrub__stage canvas { position:absolute; inset:0; display:block; }
.ptb-scrub[data-ptb-poster] { height:100dvh; }
.ptb-scrub[data-ptb-poster] .ptb-scrub__stage canvas { display:none; }
.ptb-scrub__schleier { position:absolute; inset:0; background:rgba(38,35,31,.8); opacity:0; pointer-events:none; }
.ptb-scrub[data-ptb-poster] .ptb-scrub__schleier { opacity:1; }
.ptb-scrub__text { position:absolute; left:0; right:0; top:50%; transform:translateY(-50%); padding:0 20px; text-align:center; opacity:0; will-change:opacity; pointer-events:none; }
.ptb-scrub__h2 { margin:0 auto; display:inline-flex; flex-direction:column; align-items:flex-start; text-align:left; font-family:var(--font-display); font-size:96px; font-weight:100; line-height:.95; color:var(--text-inverse); }
.ptb-scrub__z1 { padding-right:4.2em; }
.ptb-scrub__scriptin { font-family:var(--font-script); font-size:1.32em; font-weight:400; line-height:1; color:var(--accent); margin:-.1em 0 0 1.15em; padding:0 .1em .12em 0; white-space:nowrap; }
.ptb-scrub__zeile { display:block; opacity:0; transform:translateY(14px); will-change:opacity,transform; }
.ptb-scrub__cta { margin-top:0; text-align:center; }
.ptb-scrub[data-ptb-poster] .ptb-scrub__zeile { opacity:1; transform:none; }
.ptb-scrub[data-ptb-poster] .ptb-scrub__text { opacity:1; }
.ptb-scrub__text--2 .ptb-btn { pointer-events:auto; margin-top:26px; }
@media (max-width:767px) {
  .ptb-scrub { height:340vh; }
  .ptb-scrub__h2 { font-size:45px; }
  .ptb-scrub__z1 { padding-right:0; }
  .ptb-scrub__scriptin { margin-left:.6em; white-space:normal; }
  .ptb-scrub__cta { margin-top:36px; }
}
@media (prefers-reduced-motion:reduce) {
  .ptb-scrub__text { transition:none; }
}
@media (max-width:767px) {
  .ptb-scrub__scriptin { font-size:min(1.11em,13.2vw); white-space:nowrap; margin-left:.5em; }
  .ptb-scrub__cta { margin-top:10px; }
}
/* ===========================================================================
   Schicht 5 — cb14-abbinder
   Übertragen aus forty-four.html (v0.7.19) mit tools/ff-transfer.py, danach von Hand gepflegt.
   =========================================================================== */
.ptb-abbinder__titel { font-family:var(--font-ivy); font-weight:400; font-style:normal; font-size:var(--t-h2); line-height:1.05; color:var(--text-strong); }
.ptb-abbinder__tel { display:inline-flex; align-items:center; gap:12px; color:var(--text-strong); text-decoration:none; font-family:var(--font-condensed); font-size:20px; text-transform:uppercase; letter-spacing:.03em; border-bottom:1px solid var(--accent-deep); padding-bottom:4px; transition:color .4s var(--ease),border-color .4s var(--ease); }
.ptb-abbinder__tel:hover { color:var(--accent-deep); border-color:var(--text-strong); }
.ptb-abbinder__titel-script { font-family:var(--font-script); display:block; margin-top:0; font-size:80px; font-weight:400; font-style:normal; line-height:.9em; color:var(--accent); }
@media (max-width:767px) {
  .ptb-abbinder__titel-script { font-size:40px; }
}
.ptb-abbinder { background:var(--surface-page); padding:120px 0 130px; border-top:1px solid var(--border-default); position:relative; }
.ptb-abbinder__raster { display:grid; grid-template-columns:1fr; gap:44px; align-items:start; }
@media (min-width:1024px) {
  .ptb-abbinder__raster { grid-template-columns:1fr 1fr; gap:90px; }
}
.ptb-abbinder__info { font-weight:200; position:relative; padding-top:6px; }
.ptb-abbinder__info .ptb-abbinder__titel { margin:0; }
.ptb-abbinder__vor { margin-top:26px; font-family:var(--font-body); font-size:19px; font-weight:200; line-height:1.6em; max-width:58ch; color:var(--text-strong); }
.ptb-abbinder__kontakt { display:flex; gap:28px; align-items:center; margin-top:44px; padding-top:36px; border-top:1px solid var(--border-default); }
.ptb-abbinder__kontakt-bild { width:150px; height:188px; object-fit:cover; object-position:center top; flex:0 0 auto; background:var(--border-subtle); display:block; }
.ptb-abbinder__kontakt-name { font-family:var(--font-awc); font-size:25px; line-height:1.15; color:var(--text-strong); }
.ptb-abbinder__kontakt-rolle { margin-top:8px; font-family:var(--font-body); font-size:13px; font-weight:300; letter-spacing:.1em; text-transform:uppercase; color:var(--accent-deep); }
.ptb-abbinder__kontakt-zeile { margin-top:12px; font-family:var(--font-body); font-size:15px; font-weight:200; color:var(--text-soft); line-height:1.6; max-width:36ch; }
.ptb-abbinder__kontakt .ptb-abbinder__tel { margin-top:18px; }
@media (max-width:767px) {
  .ptb-abbinder__kontakt { gap:20px; align-items:flex-start; }
  .ptb-abbinder__kontakt-bild { width:110px; height:138px; }
}
.ptb-abbinder__vor,
.ptb-abbinder__kontakt-zeile { color:var(--text-body); font-weight:300; }
@media (max-width:767px) {
  .ptb-abbinder__vor { font-size:15px; line-height:1.6; }
  .ptb-abbinder__kontakt-zeile { font-size:15px; line-height:1.6; }
}
.ptb-abbinder__titel-script { font-size:var(--t-script); margin-top:var(--t-versatz); }
.ptb-abbinder__vor { margin-top:calc(var(--t-nach) - 4px); }
.ptb-abbinder { padding-top:var(--s-oben); padding-bottom:var(--s-unten); }
/* ===========================================================================
   Schicht 5 — cb23-seitenkopf
   Text-Kopf für Seiten ohne Bild-Hero (21 Beiträge, Impressum, Datenschutz, Jobs).
   Papierfläche unter der festen Kopfzeile (Seite mit headerVariant „on-color“), Brotkrumen,
   Kategorie und Datum, H1 in Brand Stylist 100. Beitragsbild optional, ohne Rundung,
   ragt in die folgende weiße Fläche hinein.
   =========================================================================== */
.ptb-seitenkopf { background: var(--surface-page); color: var(--text-body); padding-top: calc(var(--kopf-hoehe) + 72px); padding-bottom: 72px; }
.ptb-seitenkopf__innen { display: flex; flex-direction: column; align-items: flex-start; }
.ptb-seitenkopf__pfadliste { display: flex; flex-wrap: wrap; gap: 4px 0; margin: 0; padding: 0; list-style: none; font-size: 14px; font-weight: 300; }
.ptb-seitenkopf__pfadteil + .ptb-seitenkopf__pfadteil::before { content: "»"; margin: 0 10px; color: var(--text-soft); }
.ptb-seitenkopf__pfadlink { color: var(--text-soft); text-decoration: none; }
.ptb-seitenkopf__pfadlink:hover { color: var(--text-link-hover); text-decoration: underline; text-underline-offset: 3px; }
.ptb-seitenkopf__meta {
  margin-top: 40px; display: flex; flex-wrap: wrap; gap: 6px 22px;
  color: var(--text-soft); font-size: 13px; font-weight: 300; line-height: 1.4; letter-spacing: .12em; text-transform: uppercase;
}
.ptb-seitenkopf__meta > span:empty { display: none; }
.ptb-seitenkopf__datum { letter-spacing: .04em; text-transform: none; }
.ptb-seitenkopf__titel {
  margin-top: 18px; max-width: 20ch; color: var(--text-strong);
  font-family: var(--font-display); font-size: clamp(46px, 5.4vw, 84px); font-weight: 100; line-height: .98;
  text-wrap: balance;
}
/* Mit Beitragsbild: Die Fläche endet auf halber Bildhöhe in Weiß (--surface-card), damit das
   Bild in den weißen Inhalt übergeht — alles innerhalb dieser Section, kein Geschwister-CSS. */
.ptb-seitenkopf:has(.ptb-seitenkopf__bild img[src]) {
  padding-bottom: 0;
  background: linear-gradient(to bottom, var(--surface-page) 0 calc(100% - var(--seitenkopf-ueberstand)), var(--surface-card) 0);
}
.ptb-seitenkopf { --seitenkopf-ueberstand: 180px; }
.ptb-seitenkopf__bild { margin-top: 64px; margin-bottom: 0; position: relative; aspect-ratio: 3 / 2; max-height: 720px; overflow: hidden; }
.ptb-seitenkopf__bild img { width: 100%; height: 100%; object-fit: cover; }
.ptb-seitenkopf__bild:not(:has(img[src])) { display: none; }
@media (max-width: 767px) {
  .ptb-seitenkopf { padding-top: calc(var(--kopf-hoehe) + 40px); padding-bottom: 48px; --seitenkopf-ueberstand: 90px; }
  .ptb-seitenkopf__meta { margin-top: 28px; }
  .ptb-seitenkopf__titel { font-size: 38px; line-height: 1.02; hyphens: auto; overflow-wrap: break-word; }
  .ptb-seitenkopf__bild { margin-top: 40px; }
}
.ptb-seitenkopf__pfad { max-width: 100%; }
/* ===========================================================================
   Schicht 5 — cb16-standorte
   Location-Karten (Startseite, /locations, Anlass-Hubs, eventlocation-frankfurt, Kontakt).
   Aufbau nach der Entwurfs-Startseite (Stadt-Chip auf dem Bild, Faktenzeilen auf Haarlinien),
   Gestaltung nach dem Designpaket: Foto 4:5 ohne Rundung, Name in Brand Stylist 400,
   Button-Kanon. Die ganze Karte ist über den Button klickbar (::after), der Routenplaner
   liegt darüber und bleibt eigenständig.
   =========================================================================== */
.ptb-standorte { background: var(--surface-page); color: var(--text-body); padding-block: var(--s-oben) var(--s-unten); }
.ptb-standorte__kopf { margin-bottom: 64px; }
.ptb-standorte__liste {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 72px 46px;
}
.ptb-standorte__karte { position: relative; display: flex; flex-direction: column; }
.ptb-standorte__media { position: relative; margin: 0; aspect-ratio: 4 / 5; overflow: hidden; background: var(--border-subtle); }
.ptb-standorte__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease-out); }
.ptb-standorte__karte:hover .ptb-standorte__media img { transform: scale(1.03); }
.ptb-standorte__stadt {
  position: absolute; left: 16px; bottom: 16px;
  padding: 9px 16px 8px; background: var(--surface-chip); color: var(--text-strong);
  font-family: var(--font-condensed); font-size: 13px; line-height: 1; letter-spacing: .14em; text-transform: uppercase;
}
.ptb-standorte__name {
  margin-top: 28px; color: var(--text-strong);
  font-family: var(--font-display); font-size: 44px; font-weight: 400; line-height: .95;
}
.ptb-standorte__lead {
  margin-top: 14px; color: var(--text-soft);
  font-size: 14px; font-weight: 300; line-height: 1.4; letter-spacing: .1em; text-transform: uppercase;
}
.ptb-standorte__lead:empty { display: none; }
.ptb-standorte__fakten { margin: 18px 0 0; padding: 0; border-top: 1px solid var(--border-default); }
.ptb-standorte__fakt {
  display: flex; justify-content: space-between; align-items: baseline; gap: 20px;
  padding: 12px 0; border-bottom: 1px solid var(--border-default);
  font-size: 16px; line-height: 1.45;
}
.ptb-standorte__fakt dt { font-weight: 400; color: var(--text-strong); }
.ptb-standorte__fakt dd { margin: 0; color: var(--text-soft); text-align: right; }
.ptb-standorte__fakt dd:empty { display: none; }
.ptb-standorte__aktion { margin-top: auto; padding-top: 28px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 28px; }
.ptb-standorte__link::after { content: ""; position: absolute; inset: 0; }
.ptb-standorte__route {
  position: relative; z-index: 1;
  color: var(--text-soft); font-size: 15px; line-height: 1.4;
  text-decoration: underline; text-decoration-color: var(--border-default); text-underline-offset: 4px;
  transition: color .4s var(--ease);
}
.ptb-standorte__route:hover { color: var(--text-link-hover); }
.ptb-standorte__route:empty { display: none; }
@media (max-width: 1023px) {
  .ptb-standorte__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px 32px; }
}
@media (max-width: 767px) {
  .ptb-standorte__kopf { margin-bottom: 40px; }
  .ptb-standorte__liste { grid-template-columns: minmax(0, 1fr); gap: 56px; }
  .ptb-standorte__name { font-size: 36px; margin-top: 22px; }
  .ptb-standorte__fakt { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .ptb-standorte__media img { transition: none; }
}
/* Optionaler Link unter den Karten („weitere Städte“ auf /eventlocation-frankfurt) */
.ptb-standorte__mehr { margin-top: 56px; }
/* Variante --etagen (Startseite, Richtung A „Bühne“, Chris 30.09.2026): die Häuser als Zeilen nach Etage —
   große Etagenzahl in Gold, Bild 16:10, rechts Stadt/Etage, Name und die Faktenzeilen des Blocks. */
.ptb-standorte--etagen .ptb-standorte__liste { grid-template-columns: minmax(0, 1fr); gap: 0; }
.ptb-standorte--etagen .ptb-standorte__karte {
  display: grid; grid-template-columns: 160px minmax(0, 1.25fr) minmax(0, 1fr); column-gap: 56px; align-items: center;
  padding-block: 44px; border-top: 1px solid var(--border-default);
}
.ptb-standorte--etagen .ptb-standorte__karte:last-child { border-bottom: 1px solid var(--border-default); }
.ptb-standorte__etage { grid-column: 1; grid-row: 1 / span 5; color: var(--accent); font-family: var(--font-display); font-size: 170px; font-weight: 100; line-height: .8; letter-spacing: -.03em; }
.ptb-standorte--etagen .ptb-standorte__media { grid-column: 2; grid-row: 1 / span 5; aspect-ratio: 16 / 10; }
.ptb-standorte--etagen .ptb-standorte__stadt { position: static; grid-column: 3; padding: 0; background: none; color: var(--accent-deep); }
.ptb-standorte--etagen .ptb-standorte__media figcaption { display: none; }
.ptb-standorte--etagen .ptb-standorte__ort { grid-column: 3; color: var(--accent-deep); font-family: var(--font-condensed); font-size: 13px; line-height: 1; letter-spacing: .14em; text-transform: uppercase; }
.ptb-standorte--etagen .ptb-standorte__name,
.ptb-standorte--etagen .ptb-standorte__lead,
.ptb-standorte--etagen .ptb-standorte__fakten,
.ptb-standorte--etagen .ptb-standorte__aktion { grid-column: 3; }
.ptb-standorte--etagen .ptb-standorte__name { margin-top: 14px; font-size: 52px; }
.ptb-standorte--etagen .ptb-standorte__aktion { padding-top: 22px; }
@media (max-width: 1023px) {
  .ptb-standorte--etagen .ptb-standorte__karte { grid-template-columns: minmax(0, 1fr); row-gap: 0; position: relative; }
  .ptb-standorte--etagen .ptb-standorte__media, .ptb-standorte--etagen .ptb-standorte__ort,
  .ptb-standorte--etagen .ptb-standorte__name, .ptb-standorte--etagen .ptb-standorte__lead,
  .ptb-standorte--etagen .ptb-standorte__fakten, .ptb-standorte--etagen .ptb-standorte__aktion { grid-column: 1; grid-row: auto; }
  .ptb-standorte--etagen .ptb-standorte__ort { margin-top: 24px; }
  .ptb-standorte__etage { position: absolute; right: 0; top: 30px; z-index: 1; grid-row: auto; font-size: 110px; color: var(--text-on-dark); mix-blend-mode: normal; text-shadow: 0 2px 20px rgba(10, 8, 6, .35); }
}
@media (max-width: 767px) {
  .ptb-standorte--etagen .ptb-standorte__name { font-size: 40px; }
  .ptb-standorte__etage { font-size: 88px; }
}
/* ===========================================================================
   Schicht 5 — cb18-logowand
   Kundenlogos als Laufband (Startseite). Designpaket „LogoWall“: Logos in Graustufen, 55 %
   Deckkraft, höchstens 34 px hoch, nie gerahmt. Die Quelldateien sind weiß (für dunkle
   Flächen gedacht); auf Papier werden sie per Filter auf Tinte gesetzt.
   Laufband ohne Anhalten-Knopf (Chris 30.09.2026); hält bei Hover, bei reduzierter Bewegung ein ruhiges Raster.
   =========================================================================== */
.ptb-logowand { background: var(--surface-page); padding-block: 72px 80px; overflow: hidden; }
.ptb-logowand__kopf { margin-bottom: 40px; }
.ptb-logowand__titel {
  color: var(--text-soft);
  font-family: var(--font-condensed); font-size: 15px; font-weight: 400; line-height: 1.4; letter-spacing: .13em; text-transform: uppercase;
}
.ptb-logowand__band {
  -webkit-mask-image: linear-gradient(90deg, transparent, var(--ptb-black) 8%, var(--ptb-black) 92%, transparent);
          mask-image: linear-gradient(90deg, transparent, var(--ptb-black) 8%, var(--ptb-black) 92%, transparent);
}
.ptb-logowand__lauf { display: flex; width: max-content; animation: ptb-logowand-lauf 60s linear infinite; }
.ptb-logowand__lauf:hover { animation-play-state: paused; }
.ptb-logowand__reihe { display: flex; align-items: center; gap: 72px; margin: 0; padding: 0 36px; list-style: none; }
.ptb-logowand__logo { flex: 0 0 auto; }
.ptb-logowand__logo img { height: 34px; width: auto; max-width: 150px; object-fit: contain; filter: brightness(0); opacity: .55; }
@keyframes ptb-logowand-lauf { to { transform: translateX(-50%); } }
@media (max-width: 767px) {
  .ptb-logowand { padding-block: 56px 60px; }
  .ptb-logowand__reihe { gap: 44px; padding: 0 22px; }
  .ptb-logowand__logo img { height: 28px; max-width: 120px; }
}
@media (prefers-reduced-motion: reduce) {
  .ptb-logowand__band { -webkit-mask-image: none; mask-image: none; }
  .ptb-logowand__lauf { animation: none; width: auto; }
  .ptb-logowand__lauf > [aria-hidden="true"] { display: none; }
  .ptb-logowand__reihe { flex-wrap: wrap; justify-content: center; gap: 36px 56px; width: min(100% - 40px, var(--shell-max)); margin-inline: auto; padding: 0; }
}
/* ===========================================================================
   Schicht 5 — cb27-buehne (Startseite, Richtung A „Bühne“, Chris 30.09.2026)
   Imagefilm vollflächig; beim Scrollen zieht er sich zum Fenster im 1300er-Raster zusammen (7/12 Spalten),
   rechts erscheinen Einleitung und Kennzahlen (5/12). Höhenmesser der drei Häuser nur im Film-Zustand.
   Fortschritt --p (0…1) setzt cb27-buehne.js. Ohne JS, mobil und bei reduzierter Bewegung: statische Abfolge
   Film → Einleitung → Kennzahlen, jede Fläche mit den Section-Abständen des Kits.
   =========================================================================== */
.ptb-buehne {
  --p: 0;
  --b-raster: min(100vw - 40px, var(--container-max));
  --b-rand: max(20px, calc((100vw - var(--container-max)) / 2));
  --b-spalte-text: calc(var(--b-raster) * 5 / 12 - 23px);
  position: relative; background: var(--surface-page); color: var(--text-body);
}
.ptb-buehne__buehne { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); }
.ptb-buehne__fenster, .ptb-buehne__kopf, .ptb-buehne__hoehe { grid-area: 1 / 1; }
.ptb-buehne__folge { grid-area: 2 / 1; }
.ptb-buehne__fenster { position: relative; height: 100vh; height: 100svh; overflow: hidden; background: var(--surface-dark); }
.ptb-buehne__fenster video, .ptb-buehne__poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ptb-buehne__schleier { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(21, 18, 15, .12) 30%, rgba(21, 18, 15, .7) 100%); }
.ptb-buehne__kopf {
  position: relative; z-index: 2; align-self: end; margin-inline: var(--b-rand);
  padding-bottom: var(--s-unten); color: var(--text-on-dark);
  --text-kicker: var(--text-accent-pale);
}
.ptb-buehne__titel { max-width: 62vw; margin-top: 18px; color: var(--text-inverse); font-family: var(--font-display); font-size: 150px; font-weight: 100; line-height: .9em; }
.ptb-buehne__script { display: block; margin-top: -.05em; padding-left: .9em; color: var(--accent); font-family: var(--font-script); font-size: var(--t-script); font-style: normal; font-weight: 400; line-height: 1; }
.ptb-buehne__aktion { margin-top: 34px; }
.ptb-buehne__kopf .ptb-btn { color: var(--text-on-dark); }
/* Höhenmesser: eine Haarlinie in Gold, die drei Häuser nach Etage */
.ptb-buehne__hoehe {
  position: relative; z-index: 2; align-self: center; justify-self: end; margin: 0 var(--b-rand) 0 0; padding: 0 0 0 28px; list-style: none;
  display: grid; gap: 7vh; border-left: 1px solid var(--accent);
}
.ptb-buehne__hoehe-link { position: relative; display: grid; grid-template-columns: 76px auto; align-items: baseline; gap: 10px; color: var(--text-on-dark); text-decoration: none; }
.ptb-buehne__hoehe-link::before { content: ""; position: absolute; left: -33px; top: .72em; width: 9px; height: 9px; border-radius: 50%; background: var(--accent); }
.ptb-buehne__etage { font-family: var(--font-display); font-size: 56px; font-weight: 100; line-height: 1; transition: color .5s var(--ease); }
.ptb-buehne__ort { font-size: 15px; font-weight: 400; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; }
.ptb-buehne__stadt { display: block; font-size: 13px; font-weight: 200; letter-spacing: .04em; text-transform: none; color: var(--text-accent-pale); }
.ptb-buehne__hoehe-link:hover .ptb-buehne__etage, .ptb-buehne__hoehe-link:focus-visible .ptb-buehne__etage { color: var(--accent); }
/* Einleitung und Kennzahlen (statisch: eigene Fläche mit Section-Abständen) */
.ptb-buehne__folge { padding-block: var(--s-oben) var(--s-unten); }
.ptb-buehne__folge-innen { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 46px; }
.ptb-buehne__intro { grid-column: 1 / 8; }
.ptb-buehne__lead p { font-size: 22px; font-weight: 200; line-height: 1.55; }
.ptb-buehne__vertrauen { margin-top: 22px; color: var(--text-soft); font-size: 15px; font-weight: 200; line-height: 1.6; }
.ptb-buehne__zahlen { grid-column: 8 / 13; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; align-content: start; }
.ptb-buehne__zahl { display: flex; flex-direction: column-reverse; gap: 8px; padding-top: 18px; border-top: 1px solid var(--border-default); }
.ptb-buehne__zahl dt { color: var(--text-soft); font-size: 14px; font-weight: 200; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; }
.ptb-buehne__zahl dd { margin: 0; color: var(--text-strong); font-family: var(--font-display); font-size: 58px; font-weight: 100; line-height: 1; }
/* Bewegter Zustand (Desktop, Bewegung erlaubt, JS aktiv): Bühne haftet, Fenster zieht sich ins Raster */
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
  .ptb-buehne[data-ptb-buehne-aktiv] { height: 230vh; }
  .ptb-buehne[data-ptb-buehne-aktiv] .ptb-buehne__buehne { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; grid-template-rows: minmax(0, 1fr); }
  .ptb-buehne[data-ptb-buehne-aktiv] .ptb-buehne__fenster {
    position: absolute; height: auto;
    inset: calc(var(--p) * (var(--kopf-hoehe) + 48px)) calc(var(--p) * (var(--b-rand) + var(--b-spalte-text) + 46px)) calc(var(--p) * var(--s-unten)) calc(var(--p) * var(--b-rand));
    box-shadow: 0 42px 90px -40px rgba(10, 8, 6, calc(var(--p) * .62));
  }
  .ptb-buehne[data-ptb-buehne-aktiv] .ptb-buehne__fenster video { transform: scale(calc(1.08 - var(--p) * .08)); }
  .ptb-buehne[data-ptb-buehne-aktiv] .ptb-buehne__schleier { opacity: calc(1 - var(--p) * .6); }
  .ptb-buehne[data-ptb-buehne-aktiv] .ptb-buehne__kopf { max-width: 62vw; opacity: calc(1 - var(--p) * 2.2); transform: translateY(calc(var(--p) * -60px)); }
  .ptb-buehne[data-ptb-buehne-aktiv] .ptb-buehne__hoehe { opacity: calc(1 - var(--p) * 1.8); }
  .ptb-buehne[data-ptb-buehne-aktiv] .ptb-buehne__folge {
    grid-area: 1 / 1; position: absolute; top: calc(var(--kopf-hoehe) + 48px); bottom: var(--s-unten); right: var(--b-rand); width: var(--b-spalte-text);
    padding: 0; opacity: clamp(0, calc((var(--p) - .82) * 5.5), 1); transform: translateY(calc((1 - var(--p)) * 120px)); pointer-events: none;
  }
  .ptb-buehne[data-ptb-buehne-fest] .ptb-buehne__folge { pointer-events: auto; }
  .ptb-buehne[data-ptb-buehne-aktiv] .ptb-buehne__folge-innen { height: 100%; display: flex; flex-direction: column; justify-content: space-between; gap: 30px; }
  .ptb-buehne[data-ptb-buehne-aktiv] .ptb-buehne__intro, .ptb-buehne[data-ptb-buehne-aktiv] .ptb-buehne__zahlen { grid-column: auto; }
  .ptb-buehne[data-ptb-buehne-aktiv] .ptb-buehne__folge .ptb-container { width: 100%; }
}
@media (max-width: 1023px) {
  .ptb-buehne__titel { max-width: none; font-size: 96px; }
  .ptb-buehne__hoehe { display: none; }
  .ptb-buehne__intro, .ptb-buehne__zahlen { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
  .ptb-buehne__fenster { height: 88svh; }
  .ptb-buehne__titel { font-size: 57px; }
  .ptb-buehne__script { padding-left: .4em; }
  .ptb-buehne__lead p { font-size: 19px; }
  .ptb-buehne__zahl dd { font-size: 46px; }
}
/* ===========================================================================
   Schicht 5 — cb17-galerie
   Bildergalerie ohne eigene Überschrift (Hub-Intros, Stadtseiten, eventlocation-frankfurt).
   Standard: Streifen über den Rand hinaus (wie der Anlässe-Slider), jedes Bild in seinem
   eigenen Seitenverhältnis bei gleicher Höhe. Variante --raster: Spaltensatz für
   Moodboards. Beide öffnen eine Großansicht (<dialog>). Slider-Verhalten: slider.js.
   =========================================================================== */
.ptb-galerie { background: var(--surface-page); padding-block: var(--s-oben) var(--s-unten); }
/* eigene Fläche im Wechsel, nicht mehr ans Intro angehängt */
.ptb-galerie__track { padding-inline: var(--shell-pad); scroll-padding-left: var(--shell-pad); }
.ptb-galerie__bild { flex: 0 0 auto; height: clamp(260px, 38vw, 540px); margin: 0; overflow: hidden; background: var(--border-subtle); }
.ptb-galerie__zoom { position: relative; display: block; height: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.ptb-galerie__zoom img { height: 100%; width: auto; max-width: none; object-fit: cover; transition: transform 1.2s var(--ease-out); }
.ptb-galerie__zoom:hover img { transform: scale(1.03); }
.ptb-galerie__zoom:focus-visible { outline: var(--focus-ring-width) solid var(--focus-ring); outline-offset: -4px; }
.ptb-galerie__nav { width: min(100% - 40px, var(--shell-max)); margin-inline: auto; }
/* Variante Raster (Moodboard) */
.ptb-galerie--raster .ptb-galerie__track {
  display: block; columns: 3; column-gap: 14px; overflow: visible; cursor: auto;
  width: min(100% - 40px, var(--shell-max)); margin-inline: auto; padding-inline: 0;
}
.ptb-galerie--raster .ptb-galerie__bild { height: auto; margin: 0 0 14px; break-inside: avoid; }
.ptb-galerie--raster .ptb-galerie__zoom { height: auto; width: 100%; }
.ptb-galerie--raster .ptb-galerie__zoom img { width: 100%; height: auto; }
.ptb-galerie--raster .ptb-galerie__nav { display: none; }
/* Großansicht */
.ptb-galerie__dialog {
  width: 100%; max-width: 100%; height: 100%; max-height: 100%; margin: 0; padding: 0;
  border: 0; background: var(--surface-dialog); color: var(--text-on-dark);
}
.ptb-galerie__dialog[open] { display: flex; align-items: center; justify-content: center; }
.ptb-galerie__dialog::backdrop { background: var(--surface-dialog); }
.ptb-galerie__buehne { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 72px 90px 40px; max-height: 100%; }
.ptb-galerie__gross { max-width: min(1400px, 100%); max-height: calc(100dvh - 180px); width: auto; height: auto; object-fit: contain; }
.ptb-galerie__unter { display: flex; gap: 18px; align-items: baseline; font-size: 15px; font-weight: 300; color: var(--text-on-dark); }
.ptb-galerie__zaehler { font-size: 13px; letter-spacing: .1em; color: var(--text-on-dark); opacity: .75; }
.ptb-galerie__zu {
  position: absolute; top: 18px; right: 22px; min-height: var(--tap-min);
  display: inline-flex; align-items: center; gap: 10px; padding: 8px 10px;
  border: 0; background: transparent; color: var(--text-on-dark); cursor: pointer;
  font-family: var(--font-condensed); font-size: 20px; letter-spacing: .04em; text-transform: uppercase;
}
.ptb-galerie__zu svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.4; }
.ptb-galerie__zu:hover { color: var(--accent); }
.ptb-galerie__blaettern { position: absolute; top: 50%; translate: 0 -50%; border-color: var(--text-on-dark); color: var(--text-on-dark); }
.ptb-galerie__blaettern:hover { background: var(--text-on-dark); color: var(--surface-dark); }
.ptb-galerie__blaettern--zurueck { left: 22px; }
.ptb-galerie__blaettern--vor { right: 22px; }
.ptb-galerie__dialog :focus-visible { outline-color: var(--accent); }
@media (max-width: 767px) {
  .ptb-galerie--raster .ptb-galerie__track { columns: 2; column-gap: 8px; }
  .ptb-galerie--raster .ptb-galerie__bild { margin-bottom: 8px; }
  .ptb-galerie__buehne { padding: 64px 12px 96px; }
  .ptb-galerie__blaettern { top: auto; bottom: 24px; translate: none; }
  .ptb-galerie__blaettern--zurueck { left: calc(50% - 56px); }
  .ptb-galerie__blaettern--vor { right: calc(50% - 56px); }
}
@media (prefers-reduced-motion: reduce) {
  .ptb-galerie__zoom img { transition: none; }
}
/* ===========================================================================
   Schicht 5 — cb20-keyfacts
   Herzstück der kompakten Anlass-Stadtseiten (Entscheid Chris 11.09.): je Location Kicker,
   Name, vier Fakten mit Icon, optionaler Anlass-Text, Button zur Location-Seite; daneben die
   Karte im Rahmen-im-Rahmen des Designpakets, Adresse und Route als Bildunterschrift darunter.
   Karte: Google Maps JavaScript API im Kartenstil der Marke, lädt beim Seitenaufruf (Chris 30.09.),
   Verhalten: cb20-keyfacts.js. Ohne Karte bleibt eine Papierfläche mit Pin. Anker (id) wie live.
   =========================================================================== */
.ptb-keyfacts { background: var(--surface-page); color: var(--text-body); padding-block: var(--s-oben) var(--s-unten); scroll-margin-top: var(--kopf-hoehe); }
.ptb-keyfacts__raster { display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; align-items: center; }
.ptb-keyfacts__fakten { list-style: none; margin: var(--t-nach) 0 0; padding: 0; border-top: 1px solid var(--border-default); }
.ptb-keyfacts__fakt {
  display: flex; align-items: center; gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--border-default);
  color: var(--text-strong); font-size: 18px; font-weight: 300; line-height: 1.45;
}
.ptb-keyfacts__icon { width: 26px; height: 26px; flex: none; fill: none; stroke: var(--text-kicker); stroke-width: .9; stroke-linecap: round; stroke-linejoin: round; }
.ptb-keyfacts__rt { margin-top: 28px; max-width: 58ch; font-size: 17px; font-weight: 300; line-height: 1.6; }
.ptb-keyfacts__rt:empty { display: none; }
.ptb-keyfacts__rt > * + * { margin-top: 1em; }
.ptb-keyfacts__aktion { margin-top: 40px; }
/* Rahmen im Rahmen: Schale 30 px, Karte 22 px, weißer Innenschein */
.ptb-keyfacts__ort { margin: 0; min-width: 0; }
.ptb-keyfacts__rahmen { padding: 8px; border-radius: var(--radius-frame); background: var(--surface-frame); }
.ptb-keyfacts__karte {
  position: relative; aspect-ratio: 4 / 3; overflow: hidden; isolation: isolate;
  border-radius: var(--radius-frame-in); background: var(--surface-muted); box-shadow: var(--shadow-inset-hell);
}
.ptb-keyfacts__ersatz { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.ptb-keyfacts__karte[data-ptb-karte-bereit] .ptb-keyfacts__ersatz { display: none; }
.ptb-keyfacts__pin { width: 40px; height: 40px; fill: none; stroke: var(--text-kicker); stroke-width: .9; }
/* Google-Zoomknöpfe an die Marke angenähert (Logo und Nutzungsbedingungen bleiben unverändert sichtbar) */
.ptb-keyfacts__karte .gm-bundled-control .gmnoprint > div { border-radius: var(--radius-lg) !important; box-shadow: var(--shadow-hebt) !important; }
/* Pin (Overlay aus cb20-keyfacts.js): Gold mit Tintenkontur, Spitze auf der Adresse */
.ptb-keyfacts__marke { position: absolute; left: 0; top: 0; width: 44px; height: 44px; pointer-events: none; }
.ptb-keyfacts__marke svg { width: 100%; height: 100%; fill: var(--accent); stroke: var(--text-strong); stroke-width: .7; filter: drop-shadow(0 6px 8px var(--ptb-schatten-hebt)); }
/* Bildunterschrift unter dem Rahmen (Designpaket: Beschriftung steht unter dem Bild) */
.ptb-keyfacts__unter { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 24px; margin-top: 18px; padding-inline: 12px; }
.ptb-keyfacts__adresse { color: var(--text-strong); font-size: 16px; font-weight: 300; line-height: 1.4; }
.ptb-keyfacts__route {
  color: var(--text-soft); font-size: 15px; line-height: 1.4;
  text-decoration: underline; text-decoration-color: var(--border-default); text-underline-offset: 4px;
  transition: color .4s var(--ease);
}
.ptb-keyfacts__route:hover { color: var(--text-link-hover); }
@media (max-width: 1023px) {
  .ptb-keyfacts__raster { grid-template-columns: minmax(0, 1fr); gap: 48px; }
}
@media (max-width: 767px) {
  .ptb-keyfacts__fakt { font-size: 16px; gap: 14px; padding: 13px 0; }
  .ptb-keyfacts__rahmen { padding: 6px; border-radius: var(--radius-frame-in); }
  .ptb-keyfacts__karte { aspect-ratio: 1 / 1; border-radius: var(--radius-frame-sm); }
  .ptb-keyfacts__unter { padding-inline: 6px; }
}
.ptb-keyfacts__text { min-width: 0; --t-h2: 72px; --t-script: 64px; }
@media (max-width: 767px) { .ptb-keyfacts__text { --t-h2: 46px; --t-script: 40px; } }
/* ===========================================================================
   Schicht 5 — sprungleiste (funktional, unnummeriert)
   Anker-Navigation „Westend Tower | Kreisler“ auf den Frankfurter Stadtseiten. Haftet unter
   der festen Kopfzeile; der Abschnitt im Blick wird markiert (aria-current, sprungleiste.js).
   Unterstrich zieht sich wie beim Button-Kanon in Gold.
   =========================================================================== */
.ptb-sprungleiste {
  position: sticky; top: var(--kopf-hoehe); z-index: 20;
  background: var(--surface-muted); border-bottom: 1px solid var(--border-default);
}
.ptb-sprungleiste__liste { display: flex; justify-content: center; gap: 0; margin: 0; padding: 0; list-style: none; }
.ptb-sprungleiste__eintrag + .ptb-sprungleiste__eintrag { border-left: 1px solid var(--border-default); }
.ptb-sprungleiste__link {
  display: inline-flex; align-items: center; min-height: 58px; padding: 0 36px;
  color: var(--text-strong); font-size: 15px; font-weight: 400; letter-spacing: .1em; text-transform: uppercase; text-decoration: none;
  background-image: linear-gradient(var(--accent), var(--accent)); background-repeat: no-repeat;
  background-position: 36px calc(100% - 17px); background-size: 0 1px;
  transition: background-size .7s var(--ease), color .4s var(--ease);
}
.ptb-sprungleiste__link:hover, .ptb-sprungleiste__link[aria-current="true"] { background-size: calc(100% - 72px) 1px; }
.ptb-sprungleiste__link[aria-current="true"] { color: var(--text-link-hover); }
.ptb-sprungleiste__link:focus-visible { outline-offset: -6px; }
@media (max-width: 767px) {
  .ptb-sprungleiste__link { min-height: 50px; padding: 0 20px; font-size: 13px; background-position: 20px calc(100% - 14px); }
  .ptb-sprungleiste__link:hover, .ptb-sprungleiste__link[aria-current="true"] { background-size: calc(100% - 40px) 1px; }
}
.ptb-sprungleiste__nav { width: min(100% - 2 * var(--container-pad), var(--container-max)); margin-inline: auto; overflow-x: auto; scrollbar-width: none; }
/* ===========================================================================
   Schicht 5 — cb24-fliesstext
   Reine Satz-Komponente für Beitragsinhalt (the_content), Impressum, Datenschutz und
   SEO-Textblöcke. Die Beiträge kommen per WXR mit ihrem Markup — Absätze sind dort
   div-Blöcke (Editor „ql-block“), nicht p. Beide werden deshalb gleich gesetzt.
   H2 in Brand Stylist 100, H3/H4 in Outfit; Listenmarken als goldene Striche
   (Designpaket „PriceList“), Tabellen auf Haarlinien.
   =========================================================================== */
.ptb-fliesstext { background: var(--surface-page); color: var(--text-body); padding-block: var(--s-oben) var(--s-unten); }
.ptb-prose { max-width: 760px; margin-inline: auto; font-size: 19px; font-weight: 300; line-height: 1.7; }
.ptb-prose > * { margin: 0; }
.ptb-prose > * + * { margin-top: 1.05em; }
.ptb-prose > div:empty { display: none; }
.ptb-prose h2 {
  margin-top: 76px; color: var(--text-strong);
  font-family: var(--font-display); font-size: clamp(30px, 3vw, 42px); font-weight: 100; line-height: 1.08;
}
.ptb-prose h2 strong { font-weight: inherit; }
.ptb-prose h3 { margin-top: 1.9em; color: var(--text-strong); font-family: var(--font-body); font-size: 24px; font-weight: 400; line-height: 1.3; }
.ptb-prose h4 { margin-top: 1.6em; color: var(--text-strong); font-family: var(--font-body); font-size: 19px; font-weight: 500; line-height: 1.4; }
/* Abstand nach Überschriften regelt allein der Folgeblock (h2 + *, h3/h4 + *) — Browser-Standardrand unten auf 0,
   sonst gewinnt er per Randkollaps (im Kit sichtbar, in WordPress vom Preflight genullt; 30.09.2026) */
.ptb-prose :is(h2, h3, h4) { margin-bottom: 0; }
.ptb-prose h2 + * { margin-top: 20px; }
.ptb-prose h3 + *, .ptb-prose h4 + * { margin-top: .6em; }
.ptb-prose strong, .ptb-prose b { font-weight: 500; color: var(--text-strong); }
.ptb-prose a { color: var(--text-link); text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: 4px; transition: color .4s var(--ease); }
.ptb-prose a:hover { color: var(--text-link-hover); }
.ptb-prose ul, .ptb-prose ol { padding-left: 0; }
.ptb-prose li + li { margin-top: .45em; }
.ptb-prose ul > li { list-style: none; position: relative; padding-left: 26px; }
.ptb-prose ul > li::before { content: ""; position: absolute; left: 0; top: .85em; width: 12px; height: 1px; background: var(--accent); }
.ptb-prose ol { counter-reset: ptb-prose; }
.ptb-prose ol > li { list-style: none; position: relative; padding-left: 34px; counter-increment: ptb-prose; }
.ptb-prose ol > li::before { content: counter(ptb-prose) "."; position: absolute; left: 0; color: var(--text-soft); font-variant-numeric: tabular-nums; }
.ptb-prose blockquote {
  margin-block: 1.8em; padding-left: 28px; border-left: 1px solid var(--accent);
  color: var(--text-strong); font-family: var(--font-display); font-size: 30px; font-weight: 100; line-height: 1.25;
}
.ptb-prose table { width: 100%; border-collapse: collapse; font-size: 16px; line-height: 1.5; }
.ptb-prose th, .ptb-prose td { padding: 12px 16px 12px 0; border-bottom: 1px solid var(--border-default); text-align: left; vertical-align: top; }
.ptb-prose th { color: var(--text-strong); font-weight: 400; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; }
.ptb-prose img, .ptb-prose figure { margin-block: 1.8em; }
.ptb-prose img { width: 100%; height: auto; }
.ptb-prose figcaption { margin-top: 10px; color: var(--text-caption); font-size: 14px; }
.ptb-prose hr { border: 0; border-top: 1px solid var(--border-default); margin-block: 2.4em; }
@media (max-width: 767px) {
  .ptb-prose { font-size: 16px; line-height: 1.65; }
  .ptb-prose h2 { margin-top: 52px; hyphens: auto; }
  .ptb-prose h3 { font-size: 20px; }
  .ptb-prose blockquote { font-size: 24px; padding-left: 20px; }
  .ptb-prose table { display: block; overflow-x: auto; }
}
/* --- Zwischentitel: kurze Goldlinie darüber, mehr Luft oben als unten (alle Fließtexte) --------- */
.ptb-prose h3::before { content: ""; display: block; width: 32px; height: 1px; margin-bottom: 18px; background: var(--accent); }
.ptb-prose h3 { margin-top: 2.4em; }
/* --- Variante Editorial (Marketingseiten: Anlass- und SEO-Texte; Chris 30.09.2026) ---------------
   Zwei Spalten wie eine Magazinseite: links haftend das Überschriften-Paar der Marke und der
   Einstieg als Lead, rechts der Text. Listen werden zum Raster auf Haarlinien (Designpaket
   „FactList“/„SpecGrid“); Listen mit fettem Etikett am Anfang zu Etikett-/Text-Zeilen. */
.ptb-fliesstext__raster { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px 96px; align-items: start; }
.ptb-fliesstext__kopf { position: sticky; top: calc(var(--kopf-hoehe) + 48px); }
.ptb-fliesstext__titel { --t-h2: clamp(46px, 4.6vw, 72px); --t-script: clamp(36px, 3.6vw, 58px); margin-top: 0; text-wrap: balance; }
.ptb-fliesstext__lead { margin-top: 36px; color: var(--text-strong); font-size: 22px; font-weight: 300; line-height: 1.55; }
.ptb-fliesstext__lead::before { content: ""; display: block; width: 56px; height: 1px; margin-bottom: 28px; background: var(--accent); }
.ptb-fliesstext__lead strong, .ptb-fliesstext__lead b { font-weight: inherit; color: inherit; }
.ptb-fliesstext--editorial .ptb-prose { max-width: 66ch; margin: 0; padding-top: 10px; font-size: 18px; }
.ptb-fliesstext--editorial .ptb-prose > :first-child { margin-top: 0; }
.ptb-fliesstext--editorial .ptb-prose h2 { font-size: clamp(32px, 2.8vw, 42px); }
/* Aufzählung → Raster auf Haarlinien */
.ptb-fliesstext--editorial .ptb-prose ul {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); column-gap: 32px;
  margin-top: 1.6em; border-top: 1px solid var(--border-default);
}
.ptb-fliesstext--editorial .ptb-prose ul > li { margin: 0; padding: 13px 0 13px 26px; border-bottom: 1px solid var(--border-default); font-size: 16px; line-height: 1.5; }
.ptb-fliesstext--editorial .ptb-prose ul > li::before { top: 1.45em; }
/* Liste mit Etikett („Eventlocation Frankfurt 25 Personen: …“) → Etikett links, Text rechts */
.ptb-fliesstext--editorial .ptb-prose ul:has(> li > strong:first-child) { grid-template-columns: minmax(0, 1fr); }
.ptb-fliesstext--editorial .ptb-prose ul > li:has(> strong:first-child) {
  display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 4px 32px; padding: 18px 0;
}
.ptb-fliesstext--editorial .ptb-prose ul > li:has(> strong:first-child)::before { content: none; }
.ptb-fliesstext--editorial .ptb-prose ul > li > strong:first-child { color: var(--text-strong); font-weight: 400; }
@media (max-width: 1023px) {
  .ptb-fliesstext__raster { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .ptb-fliesstext__kopf { position: static; }
}
@media (max-width: 767px) {
  .ptb-fliesstext__lead { font-size: 19px; margin-top: 24px; }
  .ptb-fliesstext--editorial .ptb-prose { font-size: 16px; }
  .ptb-fliesstext--editorial .ptb-prose ul > li:has(> strong:first-child) { grid-template-columns: minmax(0, 1fr); }
}
/* ===========================================================================
   Schicht 5 — cb25-beitragsraster
   Artikel-Karten (Magazin: alle Beiträge; Beitrags-Template: drei verwandte). Im Widget
   dynamisch per WP-Query, im Kit ein Repeater. Variante --magazin: der neueste Beitrag
   läuft über zwei Spalten mit breitem Bild, der Rest im Dreier-Raster.
   Karte klickbar über den Weiterlesen-Link (::after), Titel in Brand Stylist 400.
   =========================================================================== */
.ptb-beitraege { background: var(--surface-page); color: var(--text-body); padding-block: var(--s-oben) var(--s-unten); }
.ptb-beitraege__liste {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 64px 40px;
}
.ptb-beitraege__karte { position: relative; display: flex; flex-direction: column; }
.ptb-beitraege__bild { margin: 0 0 22px; aspect-ratio: 3 / 2; overflow: hidden; background: var(--border-subtle); }
.ptb-beitraege__bild img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease-out); }
.ptb-beitraege__karte:hover .ptb-beitraege__bild img { transform: scale(1.03); }
.ptb-beitraege__kategorie { color: var(--text-soft); font-size: 13px; font-weight: 300; line-height: 1.4; letter-spacing: .12em; text-transform: uppercase; }
.ptb-beitraege__titel { margin-top: 10px; color: var(--text-strong); font-family: var(--font-display); font-size: 30px; font-weight: 400; line-height: 1.05; text-wrap: balance; }
.ptb-beitraege__teaser {
  margin-top: 14px; color: var(--text-body); font-size: 16px; font-weight: 300; line-height: 1.6;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.ptb-beitraege__teaser:empty { display: none; }
.ptb-beitraege__link { margin-top: auto; padding-top: 22px; align-self: flex-start; }
.ptb-beitraege__link::after { content: ""; position: absolute; inset: 0; }
.ptb-beitraege--magazin .ptb-beitraege__karte:first-child { grid-column: span 2; }
.ptb-beitraege--magazin .ptb-beitraege__karte:first-child .ptb-beitraege__bild { aspect-ratio: 16 / 9; }
.ptb-beitraege--magazin .ptb-beitraege__karte:first-child .ptb-beitraege__titel { font-size: 44px; max-width: 18ch; }
@media (max-width: 1023px) {
  .ptb-beitraege__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px 28px; }
}
@media (max-width: 767px) {
  .ptb-beitraege__liste { grid-template-columns: minmax(0, 1fr); gap: 48px; }
  .ptb-beitraege--magazin .ptb-beitraege__karte:first-child { grid-column: auto; }
  .ptb-beitraege--magazin .ptb-beitraege__karte:first-child .ptb-beitraege__bild { aspect-ratio: 3 / 2; }
  .ptb-beitraege__titel, .ptb-beitraege--magazin .ptb-beitraege__karte:first-child .ptb-beitraege__titel { font-size: 27px; }
}
@media (prefers-reduced-motion: reduce) {
  .ptb-beitraege__bild img { transition: none; }
}
/* ===========================================================================
   Schicht 5 — popup-willkommen (funktional, Theme-Laufzeit)
   „Unser Geschenk: 10% Willkommensrabatt für alle Neukunden.“ (Live-Section 391-200), einmal
   je Sitzung. Rahmen im Rahmen über dem Seitengrund, Schreibschrift für die Dachzeile,
   Brand Stylist für den Wert. Öffnen/Schließen: popup-willkommen.js.
   =========================================================================== */
.ptb-popup { width: min(100% - 32px, 560px); max-width: none; padding: 0; border: 0; background: transparent; color: var(--text-body); overflow: visible; }
.ptb-popup::backdrop { background: var(--surface-hero-veil); }
.ptb-popup[open] { animation: ptb-popup-auf .6s var(--ease-out); }
.ptb-popup__rahmen { padding: 8px; border-radius: var(--radius-frame); background: var(--surface-frame); box-shadow: var(--shadow-tief); }
.ptb-popup__karte {
  position: relative; padding: 56px 48px 44px; text-align: center;
  border-radius: var(--radius-frame-in); background: var(--surface-muted); box-shadow: var(--shadow-inset-hell);
}
.ptb-popup__zu {
  position: absolute; top: 10px; right: 10px; width: var(--tap-min); height: var(--tap-min);
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0; border: 0; border-radius: var(--radius-pill); background: transparent; color: var(--text-soft); cursor: pointer;
  transition: color .3s var(--ease), background-color .3s var(--ease);
}
.ptb-popup__zu svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.ptb-popup__zu:hover { color: var(--text-strong); background: var(--surface-hover); }
.ptb-popup__titel { display: flex; flex-direction: column; align-items: center; gap: 4px; font-weight: 400; }
.ptb-popup__script { color: var(--accent); font-family: var(--font-script); font-size: 46px; line-height: 1; }
.ptb-popup__wert { color: var(--text-strong); font-family: var(--font-display); font-size: 54px; font-weight: 100; line-height: .95; }
.ptb-popup__text { margin-top: 14px; font-size: 18px; font-weight: 300; }
.ptb-popup__aktion { margin-top: 32px; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 40px; }
@keyframes ptb-popup-auf { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@media (max-width: 767px) {
  .ptb-popup__karte { padding: 52px 22px 34px; }
  .ptb-popup__script { font-size: 36px; }
  .ptb-popup__wert { font-size: 40px; }
  .ptb-popup__text { font-size: 16px; }
}