/* Gemeinsames Layout für die Rechtsseiten (Impressum, Datenschutz).
   Die Startseite bringt ihr eigenes CSS mit – sie ist auf genau einen
   Viewport ausgelegt, diese Seiten dürfen scrollen. */

:root {
  --blue:      #234D76;
  --gold:      #FEBC16;
  --bg:        #F7F9FB;
  --bg-deep:   #ECF1F6;
  --fg-muted:  #5E748C;
  --rule:      rgba(35, 77, 118, .16);
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  min-height: 100svh;
  padding: clamp(2rem, 6vw, 4rem) 1.5rem clamp(3rem, 8vw, 5rem);
  background:
    radial-gradient(110% 40% at 50% 0%, #FFFFFF 0%, var(--bg) 55%, var(--bg-deep) 100%),
    var(--bg);
  color: var(--blue);
  font-family: "Avenir Next", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  font-size: clamp(0.95rem, 1.6vw, 1.05rem);
  line-height: 1.7;
}

.wrap {
  max-width: 42rem;
  margin: 0 auto;
}

/* ---------- Kopf ---------- */

.masthead {
  text-align: center;
  margin-bottom: clamp(2rem, 6vh, 3rem);
}

.masthead img {
  width: clamp(5rem, 14vw, 7rem);
  height: auto;
}

/* ---------- Text ---------- */

h1 {
  font-size: clamp(1.5rem, 4vw, 2rem);
  font-weight: 600;
  letter-spacing: .01em;
  margin: 0 0 .4em;
}

h1 + .lead {
  color: var(--fg-muted);
  margin: 0 0 2.5em;
}

h2 {
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 2.75em 0 .9em;
}

h2:first-of-type { margin-top: 0; }

p { margin: 0 0 1.1em; text-wrap: pretty; }

ul { margin: 0 0 1.1em; padding-left: 1.3em; }
li { margin-bottom: .35em; }

address {
  font-style: normal;
  margin-bottom: 1.1em;
}

a { color: inherit; text-decoration: underline; text-underline-offset: .2em; text-decoration-color: var(--rule); }
a:hover { text-decoration-color: var(--gold); }

/* Noch zu ergänzende Angaben deutlich sichtbar markieren, damit sie
   nicht versehentlich so online gehen. */
.todo {
  background: #FFF4D6;
  border-left: 3px solid var(--gold);
  padding: .75em 1em;
  margin: 0 0 1.1em;
  font-size: .92em;
}

/* ---------- Fuß ---------- */

.pagefoot {
  margin-top: clamp(3rem, 8vh, 4.5rem);
  padding-top: 1.5rem;
  border-top: 1px solid var(--rule);
  font-size: .88rem;
  color: var(--fg-muted);
  display: flex;
  flex-wrap: wrap;
  gap: .5em 1.5em;
  justify-content: space-between;
}
