@font-face{font-family:'Poppins';font-style:normal;font-weight:300;font-display:swap;src:url(assets/fonts/poppins-300-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/poppins-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/poppins-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/poppins-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* Fewosystem, minimalistische Fassung (Vorbild anchukoegl.com): weiß, Poppins, zentriert, ein Akzent. */
:root{--ink:#111;--txt:#333;--mute:#555;--grey:#ececec;--acc:#feb334;--acc-h:#f0a51f;--font:Poppins,"Helvetica Neue",Helvetica,Arial,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--txt);font-family:var(--font);font-weight:300;font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased}
p,h1,h2,h3{margin:0}
a{color:inherit}
img,svg{display:block;max-width:100%}
button,input{font:inherit;color:inherit}
[hidden]{display:none!important}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.wrap{max-width:1040px;margin:0 auto;padding:0 24px}
.wrap.narrow{max-width:720px;text-align:center}
h1{font-weight:700;font-size:clamp(1.5rem,3vw,2rem);line-height:1.3;color:var(--ink)}
h2{font-weight:700;font-size:clamp(1.35rem,2.6vw,1.75rem);line-height:1.3;color:var(--ink);margin-bottom:1.25rem}
h3{font-weight:700;font-size:1.15rem;color:var(--ink);line-height:1.35}

/* Kopf */
.top{background:var(--ink);color:#fff}
.top-in{display:flex;align-items:center;justify-content:space-between;min-height:72px}
.brand{font-weight:300;font-size:1.5rem;letter-spacing:.04em;text-transform:uppercase;text-decoration:none}
.top-link{font-weight:400;font-size:.95rem;text-decoration:none;opacity:.85}
.top-link:hover{opacity:1;text-decoration:underline}

/* Start */
.hero{padding:56px 0 64px}
.hero-in{display:grid;gap:36px;align-items:center;text-align:center}
.hero-img{width:min(100%,420px);height:auto;margin:0 auto;aspect-ratio:3/2;object-fit:cover;object-position:center 60%}
.hero-txt{display:grid;gap:18px;justify-items:center}
.pre{font-size:1.25rem;color:var(--ink)}
.sub{font-size:1.15rem;color:var(--txt)}
@media (min-width:760px){.hero{padding:72px 0 80px}.hero-in{grid-template-columns:420px 1fr;gap:56px}.hero-img{aspect-ratio:4/5}}

/* Knopf */
.btn{display:inline-flex;flex-direction:column;align-items:center;gap:2px;padding:14px 34px;border:0;border-radius:3px;background:var(--acc);color:#000;text-decoration:none;cursor:pointer;transition:background-color .2s;margin-top:6px}
.btn b{font-weight:700;font-size:1.15rem;line-height:1.3}
.btn small{font-weight:400;font-size:.8rem;color:#333}
.btn:hover{background:var(--acc-h)}
.btn:disabled{opacity:.7;cursor:default}

/* Drei Punkte */
.three{padding:40px 0 64px}
.three-in{display:grid;gap:40px;text-align:center}
.pt{display:grid;justify-items:center;gap:18px}
.pt svg{width:72px;height:72px;color:var(--ink)}
.pt p{max-width:30ch;font-size:1.1rem}
@media (min-width:760px){.three-in{grid-template-columns:repeat(3,1fr);gap:48px}}

/* Graue Bänder */
.band{background:var(--grey);padding:64px 0}
.band p{margin-bottom:1rem}
.band p:last-child{margin-bottom:0}

/* Schritte */
.steps{padding:72px 0}
.step{margin-bottom:2rem}
.step h3{margin-bottom:.4rem}
.note{font-size:.95rem;color:var(--mute);max-width:60ch;margin:2.5rem auto 0}

/* Formular */
.form{display:grid;gap:16px;max-width:480px;margin:28px auto 0;text-align:left}
.field{display:grid;gap:6px}
.field span{font-size:.9rem;color:var(--mute)}
.field input{width:100%;min-height:54px;padding:0 16px;border:1px solid #c9c9c9;border-radius:3px;background:#fff;color:var(--ink);font-weight:400}
.field input:focus{outline:none;border-color:var(--ink)}
.field input[aria-invalid="true"]{border-color:#c0392b}
.consent{display:grid;grid-template-columns:20px 1fr;gap:12px;align-items:start;font-size:.9rem;line-height:1.5;color:var(--mute)}
.consent input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--ink)}
.consent a{color:var(--ink)}
.hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.form .btn{justify-self:center;width:100%}
.form-msg{min-height:1.4rem;font-size:.95rem;color:#c0392b;text-align:center}
.form-msg.ok{color:#2e7d32}
.done{max-width:480px;margin:28px auto 0;background:#fff;border:1px solid #d9d9d9;border-radius:3px;padding:24px}
.done h3{margin-bottom:.5rem}

/* Fuß */
.foot{background:var(--ink);color:#ddd;padding:28px 0;font-size:.9rem}
.foot-in{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;align-items:center}
.foot nav{display:flex;gap:20px}
.foot a{color:#fff;text-decoration:none}
.foot a:hover{text-decoration:underline}

/* Fenster */
.dlg{padding:0;border:0;background:none;color:var(--txt);width:min(44rem,calc(100vw - 2rem));max-width:none;max-height:none}
.dlg::backdrop{background:rgba(0,0,0,.55)}
.dlg-in{max-height:88vh;overflow-y:auto;background:#fff;border-radius:4px;box-shadow:0 30px 90px rgba(0,0,0,.35)}
.dlg-top{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;padding:14px 28px;background:#fff;border-bottom:1px solid #e5e5e5}
.dlg-k{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.dlg-x{border:1px solid #c9c9c9;background:#fff;border-radius:3px;padding:8px 14px;font-size:.9rem;cursor:pointer}
.dlg-x:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.dlg-body{padding:28px}
.legal h1{font-size:1.75rem;margin-bottom:.5rem}
.legal h1:focus{outline:none}
.legal .lead{color:var(--mute);margin-bottom:1.25rem}
.legal h2{font-size:1.1rem;margin:1.75rem 0 .5rem}
.legal p,.legal li{font-size:1rem;line-height:1.6;margin:0 0 .75rem}
.legal ul{padding-left:1.2rem}
.legal .box{border:1px solid #e0e0e0;border-radius:3px;padding:14px 18px;margin:.5rem 0 1rem}
.legal .box p{margin:0 0 .2rem}
.legal .todo{color:#b35c00}
.dlg-foot{margin-top:2rem;color:var(--mute);font-size:.9rem}
body.dlg-on{overflow:hidden}