/* =========================================================================
   QUADRONET Base - Textelemente
   ========================================================================= */

@layer qn.elements {
  h1, h2, h3, h4, h5, h6 {
    font-family: var(--qn-schriftfamilie-ueberschrift);
    line-height: var(--qn-zeile-eng);
    text-wrap: balance;
  }

  h1 { font-size: var(--qn-groesse-h1); }
  h2 { font-size: var(--qn-groesse-h2); }
  h3 { font-size: var(--qn-groesse-h3); }
  h4 { font-size: var(--qn-groesse-h4); }

  p, li { text-wrap: pretty; }

  a {
    color: var(--qn-schrift-link);
    text-decoration-thickness: 1px;
    text-underline-offset: 0.2em;
  }

  code, kbd, samp, pre { font-family: var(--qn-schriftfamilie-fest); font-size: 0.9em; }

  hr { border: 0; border-top: 1px solid var(--qn-linie-fein); }

  table { border-collapse: collapse; width: 100%; }
  th { text-align: start; }

  /* Lesebereich: hier - und nur hier - gilt die Lesebreite und der
     senkrechte Rhythmus. Margin ausschliesslich oben, nie unten. */
  .qn-text { max-width: 65ch; }
  .qn-text > * + *  { margin-block-start: var(--qn-raum-md); }
  .qn-text > * + h2 { margin-block-start: var(--qn-raum-2xl); }
  .qn-text > * + h3 { margin-block-start: var(--qn-raum-xl); }
  .qn-text > h2 + *,
  .qn-text > h3 + *,
  .qn-text > h4 + * { margin-block-start: var(--qn-raum-sm); }
  .qn-text ul, .qn-text ol { padding-inline-start: 1.25em; }
}
