/* ========================[ Druckansicht ]======================== */

/* Wird im head mit media="print" eingebunden, blockiert also nicht den
   Seitenaufbau. Die Media Query bleibt trotzdem drin, damit die Datei
   auch beim direkten Einbinden korrekt bleibt. */

@media print {


  /* ------------[ Grundlagen ]------------ */

  *,
  *::before,
  *::after {
    color: #000000 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body {
    font-size: 11pt;
    line-height: 1.4;
  }

  @page {
    margin: 2cm;
  }


  /* ------------[ Was nicht gedruckt wird ]------------ */

  .skip-link,
  header nav,
  footer nav,
  button,
  video,
  iframe,
  .no-print {
    display: none !important;
  }


  /* ------------[ Logo ]------------ */

  /* Das Logo ist eine Fläche in der Schriftfarbe mit der SVG als
     Maske. Im Druck fällt jeder Hintergrund weg – übrig bliebe nichts.
     Deshalb wird die Maske abgeschaltet und stattdessen der Name
     ausgegeben, der sonst nur für Screenreader da ist. */

  .logo,
  .site-footer-name {
    width: auto !important;
    height: auto !important;
    aspect-ratio: auto !important;
    -webkit-mask: none !important;
    mask: none !important;
  }

  .logo .visually-hidden,
  .site-footer-name .visually-hidden {
    width: auto;
    height: auto;
    position: static;
    font-family: var(--font-headline);
    font-size: 14pt;
    word-spacing: -0.2em;
    overflow: visible;
    clip-path: none;
  }


  /* ------------[ Umbrüche ]------------ */

  h1, h2, h3 {
    break-after: avoid;
  }

  p, li, figure, img, table {
    break-inside: avoid;
  }

  section {
    padding-top: 0 !important;
    padding-bottom: 1cm !important;
  }


  /* ------------[ Verlinkungen ]------------ */

  /* Gedruckte Links sind ohne Adresse nutzlos, interne und
     unsichtbare Ziele werden aber weggelassen. */
  main a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 9pt;
    word-break: break-all;
  }


  /* ------------[ Grid ]------------ */

  /* Im Druck alles einspaltig, damit nichts abgeschnitten wird */
  .grid {
    display: block !important;
  }

  .grid > * + * {
    margin-top: 0.5cm;
  }


}