/* ============================================================
   Gemeinsame Gestaltung der Unterseiten.
   Reines CSS ohne Framework, damit die Seiten auch auf aelteren
   Telefonen sofort laden.
   ============================================================ */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:16px; line-height:1.6; color:#10131F; background:#F7F4ED;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; border:0; display:block; }
a{ color:inherit; }
h1,h2{ font-family:Fraunces,Georgia,"Times New Roman",serif; font-weight:500; margin:0; line-height:1.15; }
p{ margin:0; }
ul{ margin:0; padding:0; list-style:none; }

.wrap{ max-width:820px; margin:0 auto; padding-left:20px; padding-right:20px; }

/* Kopfzeile */
.top{ background:#070C22; padding:16px 0; }
.top-in{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; }
.brand{ display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; text-decoration:none; }
.brand img{ height:36px; width:auto; margin-right:12px; }
.brand b{ display:block; font-family:Fraunces,Georgia,serif; font-weight:500; font-size:16px; color:#fff; line-height:1.1; }
.brand i{ display:block; font-style:normal; font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:#8DCEF4; margin-top:2px; }
.top a.back{ color:#fff; font-size:14px; text-decoration:underline; text-underline-offset:4px; -ms-flex-negative:0; flex-shrink:0; margin-left:14px; }
.top a.back:hover{ color:#8DCEF4; }

/* Inhalt */
main{ padding:56px 0 72px; }
h1{ font-size:34px; margin-bottom:10px; }
.sub{ color:#3A4055; margin-bottom:40px; }
section{ margin-bottom:34px; }
section h2{ font-size:21px; margin-bottom:8px; }
section p + p{ margin-top:12px; }
a[href]{ color:#0D14A8; }
main a[href]{ text-decoration:underline; text-underline-offset:4px; }
.box{ background:#fff; border:1px solid rgba(16,19,31,.14); border-radius:16px; padding:22px 20px; }
.muted{ color:#3A4055; font-size:14px; }

/* Buttons. Die Farbregeln stehen bewusst nach den Linkfarben und
   sind hoeher gewichtet, damit auf blauem Grund immer weisse
   Schrift steht und nicht die dunkelblaue Linkfarbe. */
.btnrow{ margin-top:44px; }
.btn,main a.btn,.foot a.btn{
  display:inline-block; padding:14px 24px; border-radius:999px; font-weight:700; font-size:15px;
  text-decoration:none; border:1px solid transparent; margin:0 8px 10px 0; cursor:pointer;
  font-family:inherit; -webkit-transition:all .2s ease; transition:all .2s ease;
}
.btn-primary,main a.btn-primary,button.btn-primary{ background:#1420E8; color:#fff; border-color:#1420E8; }
.btn-primary:hover,main a.btn-primary:hover,button.btn-primary:hover{ background:#2C36FF; border-color:#2C36FF; color:#fff; }
.btn-outline,main a.btn-outline,button.btn-outline{ background:#fff; color:#0D14A8; border-color:rgba(16,19,31,.22); }
.btn-outline:hover,main a.btn-outline:hover,button.btn-outline:hover{ border-color:#1420E8; color:#0D14A8; }
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{ outline:3px solid #1420E8; outline-offset:3px; }

/* ---------- Formular auf den Rechtsseiten ---------- */
.wform{ background:#fff; border:1px solid rgba(16,19,31,.14); border-radius:16px; padding:22px 20px; }
.wform .f{ margin-bottom:16px; }
.wform label{ display:block; font-size:14px; font-weight:600; color:#10131F; margin-bottom:6px; }
.wform input,.wform textarea{
  width:100%; padding:12px 14px; font-size:16px; font-family:inherit; color:#10131F;
  background:#fff; border:2px solid rgba(16,19,31,.18); border-radius:10px;
  -webkit-appearance:none; appearance:none;
}
.wform input:focus,.wform textarea:focus{ outline:none; border-color:#1420E8; box-shadow:0 0 0 4px rgba(20,32,232,.14); }
.wform .hint{ font-size:13px; color:#3A4055; margin-top:6px; }
.wform .err{ display:none; color:#B3261E; font-size:14px; margin-top:6px; }
.wform .f.error input,.wform .f.error textarea{ border-color:#B3261E; }
.wform .f.error .err{ display:block; }
.wform .hp{ position:absolute; left:-9999px; }
.wform .two{ display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; margin:0 -7px; }
.wform .two > .f{ width:100%; padding:0 7px; }
@media (min-width:560px){ .wform .two > .f{ width:50%; } }
.wform .legalnote{ font-size:12px; color:#3A4055; line-height:1.55; margin-top:14px; }
@media (min-width:768px){ .wform{ padding:28px 26px; } }

/* Fusszeile */
.foot{ background:#05091A; color:#A9B6D0; padding:34px 0; text-align:center; font-size:14px; }
.foot a{ color:#A9B6D0; text-decoration:underline; text-underline-offset:4px; }
.foot a:hover{ color:#8DCEF4; }
.foot p + p{ margin-top:12px; }
.foot :focus-visible{ outline-color:#8DCEF4; }

@media (min-width:768px){
  h1{ font-size:44px; }
  main{ padding:72px 0 88px; }
  .box{ padding:26px 24px; }
}