/* Bilanzkennzahlen-Wissensseite. Alles andere kommt aus knowledge-hb.css.
   "Bilanzkennzahlen" ist ein einziges langes Wort: Mit der allgemeinen
   Handy-Größe (11vw) ragt die H1 über den Kartenrand hinaus. */
@media (max-width: 640px) {
    .knowledge-hb-body .seo-hero h1.bkz-h1 {
        font-size: clamp(1.75rem, 9.2vw, 3rem);
    }
}

/* Übersichtstabelle mit vier Spalten: Auf dem Handy wird jede Zeile zu
   einem Block, statt dass man seitlich durch Formeln wischen muss. Die
   Spaltenköpfe wandern als Mono-Label vor jeden Wert. */
@media (max-width: 640px) {
    .knowledge-hb-body .seo-table.bkz-overview,
    .knowledge-hb-body .seo-table.bkz-overview tbody,
    .knowledge-hb-body .seo-table.bkz-overview tr,
    .knowledge-hb-body .seo-table.bkz-overview td {
        display: block;
        width: 100%;
        overflow: visible;
    }

    .knowledge-hb-body .seo-table.bkz-overview thead {
        display: none;
    }

    .knowledge-hb-body .seo-table.bkz-overview tr {
        border-bottom: 1px solid var(--kh-ink);
    }

    .knowledge-hb-body .seo-table.bkz-overview td {
        padding: 6px 14px;
        border: 0;
    }

    .knowledge-hb-body .seo-table.bkz-overview td:first-child {
        padding-top: 14px;
        color: var(--kh-ink);
    }

    .knowledge-hb-body .seo-table.bkz-overview td:last-child {
        padding-bottom: 14px;
    }

    .knowledge-hb-body .seo-table.bkz-overview tr:last-child td {
        border-bottom: 0;
    }

    .knowledge-hb-body .seo-table.bkz-overview td:not(:first-child)::before {
        content: attr(data-label);
        display: block;
        color: var(--kh-ink-muted);
        font-family: var(--kh-mono);
        font-size: 0.66rem;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }
}