:root{
  --blau:#5bb6fb;
  --braun:#420000;
  --weiss:#ffffff;
  --text:#1d1d1d;
}
*{box-sizing:border-box}
body{
  margin:0;
  background:var(--blau);
  color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.6;
}
a{color:inherit}
.wrap{max-width:920px;margin:0 auto;padding:0 16px}

header{position:relative;padding:48px 0 24px;text-align:center}
header h1{margin:0}
.logo{position:absolute;top:16px;right:16px;width:90px;height:auto}
.schriftzug{width:min(470px,80%);height:auto;margin-top:40px}

.hero{
  display:block;width:100%;height:auto;
  border:4px solid var(--braun);
  border-radius:16px;
}

.box{
  background:var(--weiss);
  border:4px solid var(--braun);
  border-radius:16px;
  padding:28px 28px 20px;
  margin:8px 0 0;
}
.box h1{margin:0 0 16px;color:var(--braun);font-size:1.8rem}
.box h2{margin:22px 0 6px;color:var(--braun);font-size:1.1rem}
.box p{margin:0 0 10px}
.box address{font-style:normal;margin-bottom:10px}
.box dl{display:grid;grid-template-columns:max-content 1fr;gap:4px 16px;margin:0 0 10px}
.box dt{font-weight:600}
.box dd{margin:0}
.zurueck{display:inline-block;margin-top:18px;font-weight:600;color:var(--braun)}

footer{padding:56px 0 32px;text-align:center;color:var(--weiss)}
footer .logo-klein{width:72px;height:auto;margin-bottom:8px}
footer nav a{
  margin:0 12px;font-weight:600;text-decoration:none;
  border-bottom:2px solid transparent;
}
footer nav a:hover,footer nav a:focus,footer nav a[aria-current]{border-bottom-color:var(--weiss)}
footer small{display:block;margin-top:12px;opacity:.9}

@media (max-width:600px){
  header{padding-top:32px}
  .logo{width:56px;top:10px;right:10px}
  .schriftzug{width:min(470px,88%);margin-top:56px}
  .box{padding:20px 18px 12px}
  .box dl{grid-template-columns:1fr;gap:0}
  .box dd{margin-bottom:8px}
}