/* Eigenständiges Stylesheet für Impressum und Datenschutz.
   Bewusst ohne Build-Schritt und ohne JavaScript: die Rechtstexte müssen auch
   dann erreichbar sein, wenn die App nicht lädt.

   Farben und Schriften sind dieselben Rollen wie in src/assets/index.css —
   hier als Kopie, weil diese Seiten am Build vorbeigehen. Ändert sich ein
   Wert dort, gehört er auch hierher. Kein Dunkelmodus mehr: das neue System
   ist eine helle Palette mit dunklem Footer. */

:root {
  --hs-base: #f8f4ed;
  --hs-base-alt: #efe8dc;
  --hs-line: #dbd2c3;
  --hs-copper: #d48337;
  --hs-accent-deep: #96521e;
  --hs-saddle: #6a3e25;
  --hs-ink: #1c1915;
  --hs-ink-soft: #5c564b;
}

* {
  box-sizing: border-box;
}

@font-face {
  font-family: "Young Serif";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/young-serif-latin.woff2") format("woff2");
}

@font-face {
  font-family: "Schibsted Grotesk";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/fonts/schibsted-grotesk-latin.woff2") format("woff2");
}

body {
  margin: 0;
  background: var(--hs-base);
  color: var(--hs-ink);
  font-family: "Schibsted Grotesk", ui-sans-serif, system-ui, -apple-system,
    "Segoe UI", Roboto, sans-serif;
  line-height: 1.7;
  font-size: 1rem;
  -webkit-font-smoothing: antialiased;
}

main {
  max-width: 46rem;
  margin: 0 auto;
  padding: 3rem 1.25rem 5rem;
}

h1 {
  font-family: "Young Serif", Georgia, serif;
  font-weight: 400;
  font-size: clamp(1.875rem, 5vw, 2.5rem);
  line-height: 1.15;
  letter-spacing: -0.01em;
  margin: 0 0 2rem;
}

h2 {
  font-family: "Young Serif", Georgia, serif;
  font-weight: 400;
  font-size: 1.375rem;
  line-height: 1.3;
  margin: 2.5rem 0 0.5rem;
  color: var(--hs-ink);
}

p {
  margin: 0 0 1rem;
}

a {
  color: var(--hs-accent-deep);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

a:hover {
  color: var(--hs-saddle);
}

/* Fokus immer sichtbar — dieselbe Regel wie in der App. */
:focus-visible {
  outline: 2px solid var(--hs-copper);
  outline-offset: 2px;
  border-radius: 2px;
}

ul {
  margin: 0 0 1rem;
  padding-left: 1.25rem;
}

li {
  margin-bottom: 0.35rem;
}

.back {
  font-size: 0.875rem;
  color: var(--hs-ink-soft);
}

.back a {
  color: var(--hs-accent-deep);
  font-weight: 600;
}

.back a:hover {
  color: var(--hs-saddle);
}

/* Platzhalter, die der Kunde noch befüllen muss — bewusst auffällig,
   damit sie nicht versehentlich live gehen. */
.todo {
  background: var(--hs-base-alt);
  border: 1px dashed var(--hs-copper);
  border-radius: 0.25rem;
  padding: 0.1rem 0.4rem;
  color: var(--hs-accent-deep);
  font-size: 0.9375rem;
}

hr {
  border: 0;
  border-top: 1px solid var(--hs-line);
  margin: 2.5rem 0;
}