:root {
  --grund: #131211;
  --text: #e9e5dd;
  --neben: #a29a8e;
  --messing: #c9a25e;
  --messing-hell: #ddba79;
  --linie: #3b352c;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { color-scheme: dark; }

body {
  background: var(--grund);
  color: var(--text);
  font: 1.0625rem/1.75 var(--sans);
  min-height: 100svh;
  display: flex;
  flex-direction: column;
}

main { width: min(42rem, 92vw); margin-inline: auto; flex: 1; }

a { color: var(--messing); text-decoration: none; border-bottom: 1px solid transparent; transition: color .15s, border-color .15s; }
a:hover { color: var(--messing-hell); border-bottom-color: var(--messing-hell); }
a:focus-visible { outline: 2px solid var(--messing); outline-offset: 3px; border-radius: 1px; }

hr.doppel { border: 0; border-top: 3px double var(--linie); }
hr.einfach { border: 0; border-top: 1px solid var(--linie); }

/* ---------- Startseite ---------- */

.buehne { display: flex; flex-direction: column; justify-content: center; flex: 1; padding-block: 4rem; }

.marke { text-align: center; }
.marke hr.doppel { margin-block: 2rem; }

.wortmarke {
  font-family: var(--sans);
  font-weight: 600;
  font-size: clamp(1.55rem, 5.2vw, 2.5rem);
  letter-spacing: .26em;
  margin-right: -.26em;
  text-transform: uppercase;
  line-height: 1.35;
}

.rechtsform {
  margin-top: .9rem;
  font-size: .78rem;
  letter-spacing: .3em;
  margin-right: -.3em;
  text-transform: uppercase;
  color: var(--neben);
}

.gegenstand { text-align: center; margin-top: 3.2rem; }

.feldname {
  font-size: .78rem;
  letter-spacing: .18em;
  margin-right: -.18em;
  text-transform: uppercase;
  color: var(--neben);
}

.registertext {
  font-family: var(--sans);
  font-size: clamp(1.05rem, 2.6vw, 1.2rem);
  line-height: 1.85;
  max-width: 36rem;
  margin: 1.2rem auto 0;
  color: var(--text);
}

/* ---------- Fusszeile ---------- */

.fuss { width: min(42rem, 92vw); margin: 0 auto; padding-block: 2rem; text-align: center; }
.fuss hr.einfach { margin-bottom: 1.4rem; }
.fuss nav { display: flex; justify-content: center; gap: 2.2rem; font-size: .92rem; }
.fuss .zeichen { margin-top: .9rem; font-size: .8rem; color: var(--neben); }

/* ---------- Unterseiten ---------- */

.kopf { width: min(42rem, 92vw); margin: 0 auto; padding-block: 1.6rem; }
.kopf a.heim {
  font-family: var(--sans);
  font-weight: 600;
  font-size: .92rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--text);
}
.kopf a.heim:hover { color: var(--messing-hell); }
.kopf hr.doppel { margin-top: 1.2rem; }

.seite { padding-block: 2.6rem 3.5rem; }

h1 {
  font-family: var(--sans);
  font-weight: 600;
  font-size: clamp(1.6rem, 4vw, 2.1rem);
  letter-spacing: .04em;
  margin-bottom: 2rem;
}

h2 {
  font-family: var(--sans);
  font-weight: 600;
  font-size: 1.2rem;
  letter-spacing: .03em;
  margin: 2.4rem 0 .8rem;
}

.seite p + p { margin-top: .9rem; }
.seite section + section > h2 { border-top: 1px solid var(--linie); padding-top: 2rem; }

dl.register { display: grid; grid-template-columns: 11.5rem 1fr; row-gap: .55rem; column-gap: 1.5rem; }
dl.register dt { color: var(--neben); font-size: .88rem; letter-spacing: .04em; padding-top: .12em; }
dl.register dd { margin: 0; }

@media (max-width: 540px) {
  dl.register { grid-template-columns: 1fr; row-gap: .15rem; }
  dl.register dt { margin-top: .9rem; }
}

.stand { margin-top: 2.6rem; color: var(--neben); font-size: .88rem; }

/* ---------- Druck ---------- */

@media print {
  html { color-scheme: light; }
  body { background: #fff; color: #111; }
  .wortmarke, .rechtsform, h1, h2, dl.register dd, .registertext { color: #111; }
  .feldname, dl.register dt, .stand, .fuss .zeichen { color: #444; }
  a { color: #111; border-bottom-color: #999; }
  .kopf a.heim { color: #111; }
  hr.doppel { border-top-color: #999; }
  hr.einfach { border-top-color: #bbb; }
  .fuss nav { display: none; }
}
