/* ============================================================
   pb-bar.css — was für purpleailabs.de an der Studie ergänzt wurde.

   Zwei Dinge: der Rückweg-Balken und der Bildplatzhalter in der
   Story-Sektion. Bewusst eine eigene Datei — styles/main.css bleibt so
   Zeile für Zeile das Original, ein Abgleich mit dem Quellprojekt
   bleibt möglich.

   ── 1. Rückweg zu Purple AI Labs ──

   Die Studie bringt ihre eigene Navigation mit und weiß nichts von der
   Hauptseite. Ohne diesen Balken landet der Besucher in einer Sackgasse.
   z-index 10001 liegt über Cursor (950), Skip-Link (999), Splash (800)
   und Navigation (700) — die Einordnung als Konzeptstudie steht ab der
   ersten Sekunde, nicht erst danach.
   ============================================================ */

.pb-bar {
    position: fixed;
    inset: 0 0 auto 0;
    z-index: 10001;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0 clamp(12px, 3vw, 28px);
    background: rgba(20, 15, 13, 0.92);
    -webkit-backdrop-filter: saturate(140%) blur(10px);
    backdrop-filter: saturate(140%) blur(10px);
    border-bottom: 1px solid rgba(247, 239, 228, 0.14);
    font-family: 'Ronzino', system-ui, sans-serif;
}

.pb-bar__brand { display: flex; align-items: center; opacity: .85; transition: opacity .2s ease; }
.pb-bar__brand:hover { opacity: 1; }
.pb-bar__brand img { height: 13px; width: auto; display: block; }

.pb-bar__back {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: rgba(247, 239, 228, .6);
    text-decoration: none;
    white-space: nowrap;
    transition: color .2s ease;
}
.pb-bar__back:hover { color: #F7EFE4; }

.pb-bar__tag {
    padding: .3em .7em;
    border: 1px solid rgba(218, 1, 4, .8);
    border-radius: 999px;
    color: #ff5a5c;
    letter-spacing: .16em;
}

/* Die fixierte Navigation rutscht unter den Balken. */
.nav { top: 36px; }

@media (max-width: 560px) {
    .pb-bar { height: 32px; }
    .pb-bar__back { font-size: 9px; letter-spacing: .12em; }
    .pb-bar__tag { display: none; }
    .nav { top: 32px; }
}

/* ============================================================
   2. Bildplatzhalter in der Story-Sektion — entfallen

   Hier standen die Stile für einen sichtbaren Platzhalter, solange das
   Motiv der Story-Sektion noch fehlte. Das Foto ist seit dem 20.8.2026
   eingesetzt (images/chef.webp), der Platzhalter damit hinfällig und
   ersatzlos entfernt.
   ============================================================ */