/* ==========================================================================
   4T6W Glass — "Bald verfügbar"

   Lädt zusätzlich zu links.css und erbt von dort Bühne, Panel, Weichzeichner
   und die Linkzeile. Hier steht nur, was diese Seite mehr hat: Pille,
   Überschrift, Unterzeile.

   Absichtlich KEINE eigene Panelbreite und keine feste Höhe: das Panel richtet
   sich nach seinem Inhalt und bleibt mittig im Bildschirm — wie auf der
   Linkseite. Ein hoher schmaler Streifen sieht auf einem Laptop verloren aus.
   ========================================================================== */

.cs-panel {
    padding-bottom: 26px;
}

/* --------------------------------------------------------------------------
   Pille
   -------------------------------------------------------------------------- */

.cs-pill {
    display: inline-block;
    margin: 2px auto 16px;
    padding: 7px 15px;
    border: 1px solid var(--card-border-top);
    border-radius: 999px;
    background: var(--card-sm);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--txt2);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

/* --------------------------------------------------------------------------
   Überschrift
   -------------------------------------------------------------------------- */

.cs-head {
    margin: 0;
    font-family: var(--font-display, inherit);
    /* Skaliert mit dem Fenster statt in festen Stufen zu springen. */
    font-size: clamp(1.75rem, 8.5vw, 2.6rem);
    font-weight: 900;
    line-height: 1.06;
    letter-spacing: -0.02em;
    color: var(--txt);
    text-wrap: balance;
}

.cs-sub {
    margin: 12px 0 0;
    font-size: var(--fs-body);
    line-height: 1.55;
    color: var(--txt2);
    text-wrap: pretty;
}

/* --------------------------------------------------------------------------
   Größere Schirme
   -------------------------------------------------------------------------- */

@media (min-width: 1024px) {
    .cs-panel { padding-bottom: 40px; }

    .cs-head { font-size: clamp(2.2rem, 3.4vw, 3.1rem); }

    .cs-pill {
        margin-bottom: 22px;
        font-size: 12px;
        padding: 8px 18px;
    }

    .cs-sub { font-size: 1rem; margin-top: 16px; }
}