/* Public setup guide (/anleitung): screen layout + one-page A4 print layout. */
.anleitung h1 { font-size: 1.6rem; margin: 0 0 8px; }
.kopfblock { display: grid; gap: 16px; align-items: center; }
.kopfblock .intro { display: grid; gap: 8px; }
.kopfblock .intro p { margin: 0; }
.qrblock { display: grid; justify-items: center; gap: 8px; }
.qr { width: min(240px, 70vw); background: #fff; border: 1px solid var(--rand); border-radius: 10px; padding: 8px; }
.qr svg { display: block; width: 100%; height: auto; }
.qrurl { font-weight: 700; word-break: break-all; text-align: center; font-size: .95rem; }
.plattformen { display: grid; gap: 16px; align-items: start; }
.plattform summary { display: flex; align-items: baseline; gap: 12px; cursor: pointer; }
.plattform summary h2 { display: inline; margin: 0; }
.schritte { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 12px; }
.schritte li { display: flex; gap: 12px; align-items: center; }
.schritte .bild { flex: none; width: 112px; }
.schritte .bild svg { display: block; width: 100%; height: auto; }
.schritte p { margin: 0; flex: 1; }
.nr { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; margin-right: 8px;
  border-radius: 50%; background: var(--pd-gruen-dunkel, #2e3d20); color: #fff; font-weight: 700; font-size: .85rem; }
.kontakt { text-align: center; font-weight: 600; margin: 0; }
@media (min-width: 700px) { .kopfblock { grid-template-columns: 1fr auto; } }
@media (min-width: 900px) { .plattformen { grid-template-columns: 1fr 1fr; } }

@page { size: A4 portrait; margin: 8mm; }
@media print {
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  html, body { background: #fff !important; font-size: 9pt; }
  .kopf, .nur-schirm, .flash { display: none !important; }
  main, main.breit { max-width: none; padding: 0; gap: 4mm; display: grid; }
  .karte { border: .3mm solid #999; border-radius: 3mm; padding: 3mm; gap: 2mm; break-inside: avoid; }
  .anleitung h1 { font-size: 15pt; }
  .kopfblock { grid-template-columns: 1fr 52mm; gap: 6mm; }
  .qr { width: 52mm; padding: 2mm; }
  .qrurl { font-size: 9pt; }
  .plattformen { grid-template-columns: 1fr 1fr; gap: 4mm; }
  .plattform summary { list-style: none; }
  .plattform summary::-webkit-details-marker { display: none; }
  .plattform summary h2 { font-size: 13pt; }
  .schritte { gap: 1.6mm; margin-top: 2mm; }
  .schritte li { gap: 2.5mm; break-inside: avoid; }
  .schritte .bild { width: 22mm; }
  .schritte p { font-size: 8.6pt; line-height: 1.25; }
  .nr { width: 5mm; height: 5mm; font-size: 7.5pt; margin-right: 1.5mm; }
  .kontakt { font-size: 10pt; }
}