/* Briefbogen auf Umweltpapier: blaue Tinte, Falzmarken am linken Rand. */
:root {
  --papier: #e6e8e3;
  --tinte: #17245c;
  --stempel: #2a3a9e;
  --falz: #7d8390;
  --rand: clamp(1.5rem, 11vw, 10rem);
}

* { box-sizing: border-box; }

html {
  background: var(--papier);
  color: var(--tinte);
  font-family: "Iowan Old Style", "Palatino Linotype", Palatino, "URW Palladio L", "Book Antiqua", Georgia, serif;
  font-size: 112.5%;
  line-height: 1.6;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  min-height: 100vh;
  padding: clamp(1.5rem, 6vh, 4rem) 1.5rem 2rem var(--rand);
  display: flex;
  flex-direction: column;
}

/* Falzmarken nach DIN 5008: 105 mm und 210 mm von 297 mm */
body::before,
body::after {
  content: "";
  position: fixed;
  left: 0;
  width: 0.75rem;
  border-top: 1px solid var(--falz);
}
body::before { top: 35.35vh; }
body::after { top: 70.7vh; }

a { color: var(--stempel); text-underline-offset: 0.15em; }
a:hover { color: var(--tinte); }
a:focus-visible { outline: 2px solid var(--stempel); outline-offset: 2px; }

.absender {
  margin: 0 0 clamp(2rem, 7vh, 4.5rem);
  font-size: 0.72rem;
  letter-spacing: 0.01em;
}
.absender span { border-bottom: 1px solid currentColor; padding-bottom: 0.1em; }

.name {
  margin: 0 0 clamp(2rem, 6vh, 3.5rem);
  font-size: clamp(3rem, 15vw, 7rem);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.015em;
}
.name a { color: inherit; text-decoration: none; }
.name a:hover { color: var(--stempel); }

.klein { font-size: clamp(2rem, 9vw, 3rem); }

main { max-width: 33em; flex: 1 0 auto; }
main p { margin: 0 0 1em; }

.betreff { font-size: 1em; font-weight: 700; margin: 0 0 1.6em; }

h2 { font-size: 1em; font-weight: 700; margin: 2.2em 0 0.4em; }
address { font-style: normal; margin-bottom: 1em; }

.schreiben {
  font-size: clamp(1.15rem, 5vw, 1.6rem);
  margin: 1.4em 0;
  overflow-wrap: anywhere;
}

footer { margin-top: 3.5rem; font-size: 0.85rem; }
footer a { margin-right: 1.25em; display: inline-block; padding: 0.3em 0; }