/* Vertragsdokument: gleiche Gestaltung in Live-Vorschau (Bildschirm) und A4-Druck/PDF.
   Marke: Emily Klatt (Personenmarke) × branda. studio (Studiomarke). Farben aus Website + Original-Logo. */
@font-face { font-family: Montserrat; src: url('fonts/montserrat-regular.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: Montserrat; src: url('fonts/montserrat-bold.woff2') format('woff2'); font-weight: 700; font-display: swap; }
@font-face { font-family: Newsreader; src: url('fonts/newsreader-italic.woff2') format('woff2'); font-style: italic; font-weight: 400; font-display: swap; }

.vd { --vd-ink: #17141a; --vd-muted: #5a5560; --vd-line: #e6dfe3; --vd-kobalt: #3a41d6; --vd-rosa: #ffc3e8; --vd-rosa-hell: #fde9f4;
  position: relative; display: grid; grid-template-columns: 18mm 1fr; width: 210mm; min-height: 297mm; margin: 0 auto;
  background: #fff; color: var(--vd-ink); font: 400 10pt/1.6 Montserrat, "Helvetica Neue", Arial, sans-serif;
  font-kerning: normal; hyphens: manual; overflow-wrap: break-word; box-shadow: 0 18px 60px rgba(23, 20, 26, .10); }

/* Signatur: kobaltblaue Leiste mit dem Original-Logo (vgl. bestehende Vertragsgestaltung) */
.vd-rail { display: flex; flex-direction: column; align-items: center; gap: 5mm; padding: 16mm 0 0 6mm; }
.vd-rail-strich { display: block; width: 3.4mm; height: 22mm; border-radius: 3mm; background: var(--vd-kobalt); }
.vd-rail-lang { flex: 1; height: auto; min-height: 40mm; margin-bottom: 16mm; }
.vd-logo { display: block; width: 15mm; height: 15mm; }

.vd-blatt { display: flex; flex-direction: column; padding: 14mm 18mm 12mm 10mm; min-width: 0; }
.vd-kopf { display: flex; justify-content: space-between; align-items: baseline; gap: 6mm; padding-bottom: 3mm; border-bottom: .3mm solid var(--vd-rosa); margin-bottom: 11mm; }
.vd-kopf p { margin: 0; }
.vd-marke { display: flex; align-items: baseline; gap: 2.4mm; white-space: nowrap; }
.vd-person { font: italic 400 14pt/1 Newsreader, Georgia, serif; letter-spacing: -.01em; }
.vd-studio { font-weight: 700; font-size: 8pt; letter-spacing: .02em; color: var(--vd-kobalt); }
.vd-stand { color: var(--vd-muted); font-size: 7.5pt; text-align: right; }

.vd-titelblock { margin-bottom: 9mm; break-after: avoid; }
.vd-titel { margin: 0; font-size: 21pt; line-height: 1.12; font-weight: 700; letter-spacing: -.035em; color: var(--vd-kobalt); text-wrap: balance; }
.vd-untertitel { margin: 2.5mm 0 0; font: italic 400 12.5pt/1.35 Newsreader, Georgia, serif; color: var(--vd-ink); }

.vd-parteien { display: grid; grid-template-columns: repeat(auto-fit, minmax(55mm, 1fr)); gap: 6mm 10mm; padding: 6mm 0; margin-bottom: 8mm; border-top: .2mm solid var(--vd-line); border-bottom: .2mm solid var(--vd-line); break-inside: avoid; }
.vd-rolle { margin: 0 0 1.5mm; font-size: 7.5pt; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--vd-kobalt); }
.vd-adresse { margin: 0; }

.vd-abschnitt { margin-bottom: 5.5mm; }
.vd-h2 { margin: 0 0 2mm; font-size: 11pt; line-height: 1.3; font-weight: 700; letter-spacing: -.01em; break-after: avoid; }
.vd-abschnitt p, .vd-liste { margin: 0 0 2.6mm; orphans: 3; widows: 3; }
.vd-liste { padding-left: 5mm; }
.vd-liste li + li { margin-top: 1mm; }
.vd-tabelle { width: 100%; border-collapse: collapse; margin: 1mm 0 3.5mm; font-size: 9pt; line-height: 1.45; }
.vd-tabelle th { text-align: left; font-weight: 700; background: var(--vd-rosa-hell); }
.vd-tabelle th, .vd-tabelle td { padding: 1.8mm 2.4mm; border-bottom: .2mm solid var(--vd-line); vertical-align: top; }
.vd-tabelle tr { break-inside: avoid; }
.vd-tabelle thead { display: table-header-group; }

.vd-wert { background: none; }
.vd-fehlt { padding: 0 1.2mm; border-radius: 1mm; background: #fff1c2; color: #6b3d00; font-weight: 700; outline: .3mm dashed #c77700; outline-offset: -.3mm; }

.vd-unterschriften { margin-top: 8mm; break-inside: avoid; break-before: avoid; }
/* Letzter Abschnitt bleibt mit seinen Schlusszeilen beim Unterschriftsblock (keine Unterschriften allein auf einer Seite) */
.vd-abschnitt:has(+ .vd-unterschriften) > :last-child { break-after: avoid; break-inside: avoid; }
.vd-visually-quiet { font-size: 8pt; letter-spacing: .14em; text-transform: uppercase; color: var(--vd-muted); }
.vd-sig-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(60mm, 1fr)); gap: 8mm 12mm; }
.vd-sig { break-inside: avoid; }
.vd-linie { margin: 9mm 0 0; padding-top: 1.2mm; border-top: .25mm solid var(--vd-ink); font-size: 7.5pt; color: var(--vd-muted); }
.vd-sig-name { margin: 1.5mm 0 0; font-weight: 700; }

.vd-fuss { display: flex; flex-wrap: wrap; justify-content: center; gap: 1mm 4mm; margin-top: auto; padding: 2.6mm 4mm; background: var(--vd-rosa); font-size: 7.5pt; line-height: 1.4; text-align: center; }
.vd-fuss-marke { font-weight: 700; }
.vd-abschnitt:last-of-type { margin-bottom: 10mm; }

.vd-wasserzeichen { display: none; }
.vd--entwurf .vd-stand { color: #8a4b00; font-weight: 700; }

@media print {
  /* Seitenränder: Leiste mit Original-Logo, Kopfzeile ab Seite 2 und Fußband mit Seitenzahl kommen aus
     vertrag-render.js (druckStil), weil sie Titel und Fußzeile des Dokuments enthalten. */
  html, body { background: #fff !important; }
  .vd { display: block; width: auto; min-height: 0; margin: 0; box-shadow: none; }
  .vd-blatt { display: block; padding: 0; }
  .vd-rail, .vd-fuss { display: none; }
  .vd-kopf { margin-bottom: 9mm; }
  .vd-wasserzeichen { display: block; position: fixed; top: 40%; left: 0; right: 0; text-align: center; transform: rotate(-24deg);
    font: 700 60pt/1 Montserrat, Arial, sans-serif; letter-spacing: .2em; text-transform: uppercase; color: rgba(58, 65, 214, .07); }
  .vd-fehlt, .vd-tabelle th { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
