/* insachenkunst — Grundlagen: Reset, Typografie, vertikaler Rhythmus */

*, *::before, *::after { box-sizing: border-box; }

html { background: var(--isk-weiss); -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font: 300 var(--isk-fs-text)/var(--isk-zeile) var(--isk-schrift);
  color: var(--isk-text);
}

img, svg { max-width: 100%; height: auto; border: 0; }
figure { margin: 0; }

/* Vertikaler Rhythmus: im Original hat praktisch jedes Element margin-top: 1em */
p, ol, ul, table, figure, .isk-block { margin: 1em 0 0; }
:where(.isk-inhalt) > :first-child { margin-top: 0; }

h1, h2, h3 { font-family: var(--isk-schrift); margin: 0; }

h1 {
  font: 500 var(--isk-fs-titel)/var(--isk-lh-titel) var(--isk-schrift);
  color: var(--isk-titel);
  position: relative;
  top: -8px;              /* optischer Ausgleich wie im Original */
}

h2 {
  font: 700 var(--isk-fs-text)/var(--isk-zeile) var(--isk-schrift);
  color: var(--isk-text);
  margin-top: 1em;
}

h3 {
  font: 700 var(--isk-fs-text)/var(--isk-zeile) var(--isk-schrift);
  color: var(--isk-text);
  margin-top: 1em;
}

a { color: var(--isk-link); text-decoration: none; }
a:hover, a:focus-visible { text-decoration: underline; }

/* Sichtbare Tastatur-Fokusmarkierung — im alten Theme per outline:none entfernt */
:focus-visible {
  outline: 2px solid var(--isk-akzent-text);
  outline-offset: 2px;
  border-radius: 2px;
}

em { font-style: italic; }
strong { font-weight: 700; }

/* Nur Listen aus dem Fließtext bekommen Aufzählungszeichen — Listen, die
   eine Komponente aufbauen (Galerie, Künstlerraster, Navigation), tragen eine
   Klasse und bleiben unberührt. */
.isk-inhalt ol:not([class]) { list-style: decimal; margin-left: 1.3em; padding: 0; }
.isk-inhalt ul:not([class]) { list-style: disc;    margin-left: 1.3em; padding: 0; }
.isk-inhalt ol:not([class]) li,
.isk-inhalt ul:not([class]) li { margin-top: .5em; }

table { border-collapse: collapse; width: 100%; }
td, th { vertical-align: top; text-align: left; padding: 0 15px 0 0; font-weight: inherit; }
td:last-child, th:last-child { padding-right: 0; }

.isk-nur-fuer-screenreader {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition-duration: .01ms !important; scroll-behavior: auto !important;
  }
}

/* --- Akzentfarbe -------------------------------------------------------
   Im alten Theme wurden Seitentitel und Kundenzitate per Inline-Style grün
   eingefärbt (#99cc00 bzw. #c7cc00). Hier als Bedeutung ausgezeichnet
   statt als feste Farbe im Text. */
.isk-akzent { color: var(--isk-akzent-text); }
h1.isk-akzent, h2.isk-akzent, h3.isk-akzent { color: var(--isk-akzent-text); }

/* Kundenzitat */
.isk-zitat { margin-top: 1em; }

/* Kopfbild am Anfang einer Seite.
   Im Original schließt die Überschrift unmittelbar an das Bild an. Auf Wunsch
   steht hier ein Abstand — er entspricht dem Wert, den das alte Theme für
   Bilder in einem p:first-child vorsah. */
.isk-inhalt > figure:first-child { margin-bottom: 35px; }
.isk-inhalt > figure:first-child img { display: block; width: 100%; }

/* Bilder im Textfluss: Abstand zur folgenden Überschrift */
.isk-inhalt figure + h1,
.isk-inhalt figure + h2,
.isk-inhalt figure + h3 { margin-top: 1.5em; }
figcaption {
  background: var(--isk-flaeche-hell);
  padding: 6px;
  margin-top: 5px;
  text-align: center;
  font-size: var(--isk-fs-klein);
}
