@font-face{font-family:"Playfair Display";src:url(../fonts/playfair-display-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url(../fonts/source-sans-3-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url(../fonts/source-sans-3-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}

:root{
  --blau:#113954;
  --blau-tief:#0c2a3f;
  --hell:#f3f6f8;
  --weiss:#fff;
  --text:#27363f;
  --rost:#a4543f;
  --linie:#d5dee4;
  --mass:1120px;
  --rand:clamp(16px,4vw,40px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--weiss);color:var(--text);font:400 1.1875rem/1.6 "Source Sans 3",system-ui,sans-serif}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
:focus-visible{outline:3px solid var(--rost);outline-offset:3px}
[id]{scroll-margin-top:24px}
h1,h2,h3{font-family:"Playfair Display",Georgia,serif;font-weight:700;color:var(--blau);margin:0;line-height:1.15}
h2{font-size:clamp(2.125rem,4.4vw,3.25rem)}
h3{font-size:1.625rem}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
.skip{position:absolute;left:-999px}
.skip:focus{left:8px;top:8px;background:var(--weiss);padding:8px 12px;z-index:5}
.innen{max-width:var(--mass);margin:auto;padding-left:var(--rand);padding-right:var(--rand)}

.kopf .innen{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 32px;padding-top:16px;padding-bottom:16px}
.logo{width:230px}
.nav{display:flex;flex-wrap:wrap;gap:4px 24px;font-weight:600;font-size:1.0625rem}
.nav a{text-decoration:none;padding:4px 0;border-bottom:2px solid transparent}
.nav a:hover{border-bottom-color:var(--rost)}

.start{padding:clamp(48px,10vw,128px) 0 clamp(48px,8vw,96px);border-top:1px solid var(--linie)}
.start h1{font-size:min(calc((100vw - 32px) / 8.8),5.5rem);margin-bottom:.3em}
.start p{font-size:clamp(1.25rem,2.2vw,1.5rem);max-width:28em;margin-bottom:1.25em}
.knopf{display:inline-block;background:var(--blau);color:var(--weiss);font-weight:600;font-size:1.25rem;text-decoration:none;padding:.65rem 1.25rem}
.knopf:hover{background:var(--rost)}

.abschnitt{padding:clamp(56px,8vw,104px) 0}
.zwei{display:grid;grid-template-columns:5fr 7fr;gap:clamp(24px,5vw,72px)}
.unterzeile{color:var(--rost);font-size:1.3125rem;margin-top:.5em}
.lang{max-width:36em}
.zart{background:var(--hell)}

.personen{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.personen h3{margin-bottom:.5em}
.personen dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:4px 16px}
.personen dt{font-weight:600;color:var(--blau)}
.personen dd{margin:0}

.hoefe{list-style:none;margin:0;padding:0}
.hoefe li{padding:20px 0;border-top:1px solid var(--linie)}
.hoefe li:last-child{border-bottom:1px solid var(--linie)}
.hoefe strong{display:block;color:var(--rost);font-weight:600}

.kontakt{background:var(--blau-tief);color:var(--weiss)}
.kontakt h2{color:var(--weiss)}
.kontakt address{font-style:normal}
.kontakt .gross{font-size:clamp(1.375rem,2.4vw,1.625rem);font-weight:600;line-height:1.3;margin-bottom:.4em}
.kontakt a{text-underline-offset:4px}
.kontakt .gross a{text-decoration:none;border-bottom:2px solid rgba(255,255,255,.55)}
.kontakt .gross a:hover{border-bottom-color:var(--weiss)}
.umbruch{overflow-wrap:anywhere}

.recht h3{font-size:1.375rem;margin:1.5em 0 .35em}
.recht h3:first-child{margin-top:0}
.recht a{overflow-wrap:anywhere}
.seite h1{font-size:clamp(2.125rem,4.4vw,3.25rem);margin-bottom:.5em}
.seite .recht{max-width:44em}

.fuss{border-top:6px solid var(--blau);font-size:1.0625rem}
.fuss .innen{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;padding-top:20px;padding-bottom:20px}
.fuss ul{list-style:none;display:flex;gap:24px;margin:0;padding:0}

@media (max-width:760px){
  body{font-size:1.125rem}
  .logo{width:190px}
  .zwei,.personen{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}