@font-face{font-family:Jost;font-weight:400;font-display:swap;src:url(fonts/jost-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Jost;font-weight:400;font-display:swap;src:url(fonts/jost-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Jost;font-weight:500;font-display:swap;src:url(fonts/jost-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Jost;font-weight:500;font-display:swap;src:url(fonts/jost-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{--teal:#21a8b2;--teal-light:#ebf7f8;--ink:#000;--gutter:3vw}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Jost,"Futura PT",Futura,"Century Gothic",sans-serif;font-weight:400;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased;text-align:center}
a{color:inherit;text-decoration:none}
a:hover,a:focus-visible{text-decoration:underline;text-underline-offset:.15em}
h2,h3,h4{font-weight:500}
h2{font-size:clamp(30px,3.27vw,47px);line-height:1.3;color:var(--teal)}
h3{font-size:clamp(22px,2.55vw,36.7px);line-height:1.33}
h4{font-size:clamp(18px,1.83vw,26.4px);line-height:1.37}
.teal{color:var(--teal)}
/* Hero: Logo-Fläche mit weißem Rahmen */
.hero{height:100vh;height:100svh;min-height:420px;padding:var(--gutter);background:#fff}
.hero picture,.hero img{display:block;width:100%;height:100%}
.hero img{object-fit:cover;object-position:50% 50%;background:var(--teal)}
/* Kontakte */
.people{background:var(--teal-light);padding:clamp(80px,11vw,160px) 6vw}
.person+.person{margin-top:clamp(70px,9vw,130px)}
.person h3{color:var(--teal);margin-top:.35em}
/* Adresse */
.visit{padding:clamp(60px,6vw,90px) 6vw}
.visit h3{margin-top:.6em}
.visit h3+h3{margin-top:.9em}
/* Karte */
.map{padding:0 var(--gutter) clamp(40px,3vw,48px)}
.map a{display:block;position:relative;overflow:hidden;background:#eee;aspect-ratio:1339/783;max-height:85vh;width:100%}
.map img{display:block;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(.95) brightness(1.05)}
.map .pin{position:absolute;left:50%;top:50%;width:24px;height:32px;transform:translate(-50%,-100%)}
.map .attr{position:absolute;right:0;bottom:0;background:rgba(255,255,255,.8);font-size:11px;padding:2px 6px;color:#333}
.map .cta{position:absolute;left:12px;bottom:12px;background:#fff;color:#000;font-size:15px;padding:8px 14px;box-shadow:0 1px 4px rgba(0,0,0,.25)}
/* Footer */
footer{padding:clamp(60px,6vw,100px) 6vw clamp(40px,4vw,60px)}
footer h3 a{color:var(--teal)}
footer nav{margin-top:clamp(40px,4vw,64px);font-size:15px;color:#555}
footer nav a+a::before{content:"·";margin:0 .7em;display:inline-block}
/* Unterseiten */
.legal{max-width:760px;margin:0 auto;padding:clamp(48px,6vw,96px) 6vw;text-align:left;font-size:17px;line-height:1.6}
.legal .back{display:inline-block;margin-bottom:2.5em;color:var(--teal);font-weight:500}
.legal h1{font-weight:500;color:var(--teal);font-size:clamp(30px,3.27vw,47px);line-height:1.2;margin-bottom:.8em}
.legal h2{font-size:22px;color:#000;margin:2em 0 .5em}
.legal p,.legal ul{margin-bottom:1em}
.legal ul{padding-left:1.2em}
.legal a{color:var(--teal);text-decoration:underline;text-underline-offset:.15em}
.todo{background:#fff3b0;outline:2px dashed #e0a800;padding:0 .25em;font-weight:500}
@media (max-width:767px){:root{--gutter:4vw}}