/* OfficeBau – Briefpapier (A4). Farben kommen als Variablen aus der Markenfarbe (paper.js → brandVars). */
.paper {
  --brand: #1f2937; --brand-ink: #fff; --brand-text: #1f2937; --brand-soft: #f3f4f6; --brand-line: #d1d5db;
  position: relative; width: 210mm; min-height: 297mm; margin: 0 auto; overflow: hidden;
  background: #fff; color: #1b1f24;
  padding: 14mm 18mm 38mm 24mm;
  font: 9.4pt/1.5 "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-variant-numeric: tabular-nums;
  box-shadow: 0 2px 12px rgba(0, 0, 0, .12);
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.paper * { box-sizing: border-box; }
.p-watermark { position: absolute; top: 45%; left: 50%; transform: translate(-50%, -50%) rotate(-28deg); font-size: 92px; font-weight: 800; color: rgba(0, 0, 0, .045); letter-spacing: 10px; pointer-events: none; z-index: 2; }
.p-band { display: none; }

/* Falz- und Lochmarken (DIN 5008) */
.p-fold { position: absolute; left: 7mm; width: 4mm; border-top: .5pt solid #b8bcc4; }
.p-fold.f1 { top: 105mm; } .p-fold.f2 { top: 148.5mm; width: 6mm; } .p-fold.f3 { top: 210mm; }

/* Kopf */
.p-head { position: relative; display: flex; justify-content: space-between; align-items: flex-start; gap: 10mm; min-height: 20mm; }
.p-brand img { display: block; max-height: 20mm; max-width: 78mm; object-fit: contain; }
.p-brandname { font-size: 18pt; font-weight: 750; letter-spacing: -.02em; color: var(--brand-text); line-height: 1.1; }
.p-contact { display: flex; flex-direction: column; align-items: flex-end; text-align: right; font-size: 7.4pt; line-height: 1.55; color: #5b616b; }
.p-contact b { font-size: 8.6pt; color: #1b1f24; margin-bottom: .6mm; }

/* Anschrift (Fensterposition) + Infoblock */
.p-top { display: flex; justify-content: space-between; gap: 10mm; margin-top: 11mm; align-items: flex-start; }
.p-address { width: 85mm; min-height: 40mm; font-size: 10pt; line-height: 1.45; }
.p-sender { font-size: 6.6pt; color: #8a9099; padding-bottom: 1mm; margin-bottom: 3mm; border-bottom: .5pt solid #d6d9de; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.p-rcpt { font-weight: 600; }
.p-info { display: grid; gap: 1.3mm; min-width: 64mm; font-size: 8.4pt; }
.p-info div { display: flex; justify-content: space-between; gap: 8mm; }
.p-info span { color: #6b7280; }
.p-info b { font-weight: 600; }

/* Titel */
.p-kicker { margin-top: 9mm; font-size: 7.8pt; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--brand-text); }
.p-title { margin: 1.6mm 0 1mm; font-size: 17pt; font-weight: 700; letter-spacing: -.015em; line-height: 1.2; }
.p-project { font-size: 8.4pt; color: #5b616b; }
.p-text { margin: 5mm 0; }
.p-sign b { font-weight: 600; }

/* Positionen */
.p-items { width: 100%; border-collapse: collapse; margin-top: 5mm; font-size: 9pt; }
.p-items th { text-align: left; font-size: 7.2pt; font-weight: 650; text-transform: uppercase; letter-spacing: .07em; color: #6b7280; padding: 2.3mm 2.2mm; border-bottom: .8pt solid #1b1f24; }
.p-items td { padding: 2.7mm 2.2mm; border-bottom: .5pt solid #e7e9ec; vertical-align: top; }
.p-items .r { text-align: right; white-space: nowrap; }
.p-pos { width: 10mm; color: #9ca3af; }
.p-it { font-weight: 600; }
.p-desc { color: #6b7280; font-size: 8pt; margin-top: .7mm; line-height: 1.45; }

/* Überschriften, Freitexte, Zwischensummen, Seitenumbruch */
.p-items .p-row-title td { font-weight: 700; font-size: 10pt; padding-top: 4.5mm; border-bottom: .8pt solid var(--brand-line); color: var(--brand-text); }
.p-items .p-row-text td { color: #444; font-size: 8.8pt; border-bottom: 0; }
.p-items .p-row-sub td { font-weight: 650; background: var(--brand-soft); }
.p-items .p-row-break td { padding: 0; border: 0; height: 0; }
.p-terms { font-size: 8.8pt; margin: 3mm 0 0; }
@media print { .p-row-break { break-after: page; page-break-after: always; } }
@media screen { .p-items .p-row-break td { border-top: 1px dashed #c9ccd2; height: 2mm; } }

/* Summen */
.p-sums { margin: 5mm 0 0 auto; border-collapse: separate; border-spacing: 0; min-width: 82mm; font-size: 9pt; }
.p-sums td { padding: 1.4mm 2.2mm; }
.p-sums .r { text-align: right; white-space: nowrap; }
.p-sums small { color: #8a9099; }
.p-sub td { font-weight: 650; border-top: .5pt solid #d1d5db; }
.p-ded td { color: #5b616b; }
.p-grand td { font-weight: 750; font-size: 11pt; padding: 2.8mm 2.2mm; }
.p-note { font-size: 8.6pt; font-weight: 600; margin: 4mm 0 0; }

/* Fuß */
.p-foot { position: absolute; left: 24mm; right: 18mm; bottom: 10mm; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5mm; padding-top: 3mm; border-top: .5pt solid #e1e4e8; font-size: 6.7pt; line-height: 1.55; color: #6b7280; }
.p-foot h4 { margin: 0 0 .8mm; font-size: 6.3pt; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--brand-text); }

/* ===== Design „Modern“: Farbband, getönte Flächen, Summe als Farbfeld ===== */
.style-modern .p-band { display: block; position: absolute; top: 0; left: 0; right: 0; height: 3.5mm; background: var(--brand); }
.style-modern .p-head { padding-top: 2mm; }
.style-modern .p-info { background: var(--brand-soft); border-radius: 2.5mm; padding: 4mm 5mm; }
.style-modern .p-title { padding-left: 3.5mm; border-left: 1.2mm solid var(--brand); margin-left: -4.7mm; }
.style-modern .p-items th { background: var(--brand-soft); color: var(--brand-text); border-bottom: 0; }
.style-modern .p-items th:first-child { border-radius: 1.6mm 0 0 1.6mm; }
.style-modern .p-items th:last-child { border-radius: 0 1.6mm 1.6mm 0; }
.style-modern .p-grand td { background: var(--brand); color: var(--brand-ink); }
.style-modern .p-grand td:first-child { border-radius: 1.8mm 0 0 1.8mm; }
.style-modern .p-grand td:last-child { border-radius: 0 1.8mm 1.8mm 0; }
.style-modern .p-foot { border-top: .7mm solid var(--brand); }

/* ===== Design „Klar“: viel Weißraum, feine Linien, Farbe nur als Akzent ===== */
.style-klar { padding-top: 16mm; }
.style-klar .p-head { padding-bottom: 5mm; border-bottom: .5pt solid #e1e4e8; }
.style-klar .p-top { margin-top: 9mm; }
.style-klar .p-title { font-size: 21pt; font-weight: 300; letter-spacing: -.02em; }
.style-klar .p-info span { text-transform: uppercase; font-size: 6.8pt; letter-spacing: .08em; padding-top: .4mm; }
.style-klar .p-items th { border-bottom: .8pt solid var(--brand); color: var(--brand-text); }
.style-klar .p-grand td { border-top: .8pt solid #1b1f24; border-bottom: 2.2pt double var(--brand); }

/* ===== Design „Kräftig“: farbiger Kopf über die volle Breite ===== */
.style-kraeftig .p-head { margin: -14mm -18mm 0 -24mm; padding: 8mm 18mm 7mm 24mm; min-height: 33mm; align-items: center; background: var(--brand); color: var(--brand-ink); }
.style-kraeftig .p-brand img { background: #fff; padding: 2.5mm 3.5mm; border-radius: 2.2mm; max-height: 19mm; }
.style-kraeftig .p-brandname, .style-kraeftig .p-contact, .style-kraeftig .p-contact b { color: var(--brand-ink); }
.style-kraeftig .p-contact { opacity: .92; }
.style-kraeftig .p-top { margin-top: 9mm; }
.style-kraeftig .p-info { border-left: .8mm solid var(--brand); padding-left: 4mm; }
.style-kraeftig .p-title { font-size: 19pt; font-weight: 800; }
.style-kraeftig .p-items th { background: var(--brand); color: var(--brand-ink); border-bottom: 0; }
.style-kraeftig .p-items tbody tr:nth-child(even) td { background: var(--brand-soft); }
.style-kraeftig .p-grand td { background: var(--brand); color: var(--brand-ink); }
.style-kraeftig .p-foot { left: 0; right: 0; bottom: 0; padding: 5mm 18mm 9mm 24mm; border-top: 0; background: var(--brand-soft); }