/* #238 – Gedenkspruch und Nachruf auf der Gedenkseite.
   Eine Datei fuer Gedenkseite (detail.html, Tailwind v3) und Editor-Vorschau
   (Backend, Tailwind v4), damit beide dasselbe zeigen. Grad, Zeilenhoehe und
   Schrift kommen als Inline-Stil aus websites/schriften.py. */

/* Gedenkspruch: ruhiger Auftakt, eingefasst von zwei kurzen Linien */
.lr-spruch {
    color: #2e2b27;
    max-width: 840px;
    margin-inline: auto;
    text-align: center;
    text-wrap: balance;
}

.lr-spruch :is(p, div) {
    text-wrap: balance;
}

/* Rein dekorativ: leerer Inhalt, fuer Screenreader unsichtbar */
.lr-spruch::before,
.lr-spruch::after {
    content: "";
    display: block;
    width: 3rem;
    height: 1px;
    margin-inline: auto;
    background: #2f7d52;
}

.lr-spruch::before {
    margin-bottom: clamp(1.75rem, 1.543rem + 0.884vw, 2.25rem);
}

.lr-spruch::after {
    margin-top: clamp(1.75rem, 1.543rem + 0.884vw, 2.25rem);
}

/* Nachruf: soll sich wie ein Text lesen, nicht wie ein Formularfeld */
.lr-nachruf {
    max-width: 620px;
    margin-inline: auto;
    font-size: 1.0625rem;
    line-height: 1.75;
    color: #33383f;
}

/* Nicht auf <br>: Der Editor trennt Absätze oft mit <br><br>, und Safari
   rechnet margin-top am <br> in dessen Zeile ein – die letzte Zeile jedes
   Absatzes rutschte dadurch nach unten. */
.lr-nachruf > * + :not(br) {
    margin-top: 1.375rem;
}

/* Initial ueber zwei Zeilen in der Schrift des Gedenkspruchs. Die Klasse
   setzt das Template nur, wenn der Nachruf mit einem Buchstaben beginnt.
   `em` bezieht sich bei font-size auf die Absatzschrift, bei margin auf das
   Initial selbst (≈ 6 px oben, 10 px rechts). */
.lr-nachruf.lr-initial::first-letter {
    float: left;
    font-family: var(--spruch-font);
    font-size: calc(3.9em * var(--spruch-scale-initial, 1));
    line-height: 0.8;
    margin: 0.09em 0.15em 0 0;
    color: #2f7d52;
}

/* Abstaende: Navigation bis obere Linie 56–96 px, untere Linie bis Nachruf
   48–64 px. Ohne Gedenkspruch beginnt der Nachruf mit dem oberen Abstand. */
.lr-abstand-oben {
    padding-top: clamp(3.5rem, 2.464rem + 4.42vw, 6rem);
}

.lr-abstand-unten {
    padding-bottom: clamp(3rem, 2.586rem + 1.768vw, 4rem);
}
