@font-face{font-family:Archivo;font-weight:400;font-display:swap;src:url(/schriften/archivo-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Archivo;font-weight:500;font-display:swap;src:url(/schriften/archivo-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:Archivo;font-weight:600;font-display:swap;src:url(/schriften/archivo-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:Archivo;font-weight:700;font-display:swap;src:url(/schriften/archivo-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:Archivo;font-weight:800;font-display:swap;src:url(/schriften/archivo-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:400;font-display:swap;src:url(/schriften/ibm-plex-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:500;font-display:swap;src:url(/schriften/ibm-plex-mono-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Instrument Serif";font-style:normal;font-display:swap;src:url(/schriften/instrument-serif-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Instrument Serif";font-style:italic;font-display:swap;src:url(/schriften/instrument-serif-latin-400-italic.woff2) format("woff2")}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:#F5F3EE;color:#14151E;font-family:Archivo,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:#14523F}a:hover{color:#10241D}
:focus-visible{outline:2px solid #16A97B;outline-offset:2px}
.skip{position:absolute;left:-9999px;top:0;background:#14151E;color:#fff;padding:10px 14px;z-index:10}
.skip:focus{left:16px;top:16px}
.mono{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:500}
.serif{font-family:"Instrument Serif",Georgia,serif;font-style:italic;font-weight:400;letter-spacing:0}
.wrap{max-width:1280px;margin:0 auto;padding:0 40px}
.h2{font-size:clamp(34px,4.6vw,62px);line-height:1.02;letter-spacing:-.025em;font-weight:800;margin:0}
.lead{font-size:clamp(17px,1.5vw,20px);line-height:1.55;color:#3E4049;margin:0}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 24px;font-weight:600;font-size:16px;text-decoration:none}
.navlinks a{color:#14151E;text-decoration:none;font-size:15px;font-weight:500;white-space:nowrap}
@media (max-width:1320px){.navlinks{gap:16px!important}.navlinks a{font-size:14px}}
.navlinks a:hover{color:#14523F}
.foot a{color:#C9D6CF;text-decoration:none}.foot a:hover{color:#FFFFFF}
.krumen{padding-top:22px;font-size:11px;color:#5A5C66}
.krumen a{color:#5A5C66;text-decoration:none}
.text{max-width:760px;font-size:18px;line-height:1.7;color:#24262E}
.text h1{font-size:clamp(36px,5vw,60px);line-height:1.05;letter-spacing:-.03em;font-weight:800;margin:0 0 24px;color:#14151E}
.text h2{font-size:28px;line-height:1.2;margin:48px 0 12px;color:#14151E}
.text h3{font-size:21px;margin:32px 0 8px;color:#14151E}
.text table{border-collapse:collapse;width:100%;font-size:16px;margin:16px 0;display:block;overflow-x:auto}
.text th,.text td{border-bottom:1px solid rgba(20,21,30,.14);padding:10px 12px 10px 0;text-align:left;vertical-align:top}
.text blockquote{margin:24px 0;padding:4px 0 4px 20px;border-left:3px solid #16A97B;color:#3E4049}
.text code{font-family:"IBM Plex Mono",monospace;font-size:.88em;background:#EFEDE6;padding:1px 5px}
.karte{display:flex;flex-direction:column;gap:10px;background:#FDFCF9;border:1px solid rgba(20,21,30,.14);padding:28px;text-decoration:none;color:#14151E}
.karte:hover{border-color:#14523F}
@media (max-width:1100px){.navlinks{display:none!important}}
@media (max-width:700px){.wrap{padding:0 16px}.hide-s{display:none!important}.kopf .wrap{flex-wrap:nowrap!important;gap:12px!important;min-height:64px!important}.kopf img{height:26px!important}.kopf .btn{padding:0 12px!important;font-size:10px!important;min-height:40px!important}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Ablauf-Animation */
.ablauf{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.ab-spalte{background:#FDFCF9;border:1px solid rgba(20,21,30,.14);padding:20px;display:flex;flex-direction:column;gap:12px;min-height:360px}
.ab-kopf{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#14523F;font-weight:500}
.ab-stapel{position:relative;height:250px}
.ab-stapel img{position:absolute;left:50%;top:6px;width:150px;height:auto;box-shadow:0 6px 18px rgba(16,36,29,.18);border:1px solid rgba(20,21,30,.12)}
.ab-zeile{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px;border:1px solid rgba(20,21,30,.10);background:#fff}
.ab-zeile img{width:34px;height:auto;display:block;border:1px solid rgba(20,21,30,.12)}
.ab-zeile b{display:block;font-size:14px}.ab-zeile small{display:block;font-size:12px;color:#5A5C66}
.ab-chip{font-family:"IBM Plex Mono",monospace;font-size:11px;padding:3px 7px;background:#E9EFE9;color:#14523F}
.ab-chip.warn{background:#FBE7CF;color:#7A4A12}
.ab-zeile.warn{border-color:#B5651D;background:#FFF8EF}
.ab-aufgabe{border:1px solid #B5651D;background:#FFF8EF;padding:14px;display:flex;flex-direction:column;gap:8px}
.ab-s{transition:opacity .45s ease,transform .45s ease}
.ablauf[data-phase] .ab-s{opacity:0;transform:translateY(8px)}
@media (prefers-reduced-motion:reduce){.ablauf[data-phase] .ab-s{opacity:1!important;transform:none!important}}
.ablauf[data-phase="1"] .s1,.ablauf[data-phase="2"] .s1,.ablauf[data-phase="3"] .s1,.ablauf[data-phase="4"] .s1,.ablauf[data-phase="5"] .s1,.ablauf[data-phase="6"] .s1,.ablauf[data-phase="7"] .s1,.ablauf[data-phase="8"] .s1,.ablauf[data-phase="9"] .s1,.ablauf[data-phase="10"] .s1,.ablauf[data-phase="11"] .s1,.ablauf[data-phase="12"] .s1{opacity:1;transform:none}
.ablauf[data-phase="2"] .s2,.ablauf[data-phase="3"] .s2,.ablauf[data-phase="4"] .s2,.ablauf[data-phase="5"] .s2,.ablauf[data-phase="6"] .s2,.ablauf[data-phase="7"] .s2,.ablauf[data-phase="8"] .s2,.ablauf[data-phase="9"] .s2,.ablauf[data-phase="10"] .s2,.ablauf[data-phase="11"] .s2,.ablauf[data-phase="12"] .s2{opacity:1;transform:none}
.ablauf[data-phase="3"] .s3,.ablauf[data-phase="4"] .s3,.ablauf[data-phase="5"] .s3,.ablauf[data-phase="6"] .s3,.ablauf[data-phase="7"] .s3,.ablauf[data-phase="8"] .s3,.ablauf[data-phase="9"] .s3,.ablauf[data-phase="10"] .s3,.ablauf[data-phase="11"] .s3,.ablauf[data-phase="12"] .s3{opacity:1;transform:none}
.ablauf[data-phase="4"] .s4,.ablauf[data-phase="5"] .s4,.ablauf[data-phase="6"] .s4,.ablauf[data-phase="7"] .s4,.ablauf[data-phase="8"] .s4,.ablauf[data-phase="9"] .s4,.ablauf[data-phase="10"] .s4,.ablauf[data-phase="11"] .s4,.ablauf[data-phase="12"] .s4{opacity:1;transform:none}
.ablauf[data-phase="5"] .s5,.ablauf[data-phase="6"] .s5,.ablauf[data-phase="7"] .s5,.ablauf[data-phase="8"] .s5,.ablauf[data-phase="9"] .s5,.ablauf[data-phase="10"] .s5,.ablauf[data-phase="11"] .s5,.ablauf[data-phase="12"] .s5{opacity:1;transform:none}
.ablauf[data-phase="6"] .s6,.ablauf[data-phase="7"] .s6,.ablauf[data-phase="8"] .s6,.ablauf[data-phase="9"] .s6,.ablauf[data-phase="10"] .s6,.ablauf[data-phase="11"] .s6,.ablauf[data-phase="12"] .s6{opacity:1;transform:none}
.ablauf[data-phase="7"] .s7,.ablauf[data-phase="8"] .s7,.ablauf[data-phase="9"] .s7,.ablauf[data-phase="10"] .s7,.ablauf[data-phase="11"] .s7,.ablauf[data-phase="12"] .s7{opacity:1;transform:none}
.ablauf[data-phase="8"] .s8,.ablauf[data-phase="9"] .s8,.ablauf[data-phase="10"] .s8,.ablauf[data-phase="11"] .s8,.ablauf[data-phase="12"] .s8{opacity:1;transform:none}
.ablauf[data-phase="9"] .s9,.ablauf[data-phase="10"] .s9,.ablauf[data-phase="11"] .s9,.ablauf[data-phase="12"] .s9{opacity:1;transform:none}
.ablauf[data-phase="10"] .s10,.ablauf[data-phase="11"] .s10,.ablauf[data-phase="12"] .s10{opacity:1;transform:none}

/* Mobiles Menü */
.mobilmenu{display:none}
.mobilmenu summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;min-height:44px;padding:0 12px;border:1px solid #14151E;color:#14151E}
.mobilmenu summary::-webkit-details-marker{display:none}
.burger{display:inline-flex;flex-direction:column;gap:4px}.burger i{display:block;width:18px;height:2px;background:#14151E}
.mobilpanel{position:absolute;left:0;right:0;top:100%;background:#F5F3EE;border-bottom:1px solid rgba(20,21,30,.14);box-shadow:0 20px 40px -20px rgba(16,36,29,.35);display:flex;flex-direction:column;padding:8px 16px 20px}
.mobilpanel a{padding:14px 0;border-bottom:1px solid rgba(20,21,30,.10);color:#14151E;text-decoration:none;font-size:18px;font-weight:600}
.mobilpanel .mp-btn{margin-top:12px;border-bottom:none;text-align:center;padding:14px;font-size:16px}
.mobilmenu[open] .burger i:nth-child(2){opacity:0}
@media (max-width:1180px){.kopf-cta:first-child{display:none}}
@media (max-width:1100px){.mobilmenu{display:block}.kopf-cta{display:none!important}}

/* Lösungsfinder */
.wahl{display:flex;flex-wrap:wrap;gap:10px}
.wahl label{position:relative;cursor:pointer}
.wahl input{position:absolute;opacity:0;width:1px;height:1px}
.wahl span{display:inline-flex;align-items:center;min-height:48px;padding:10px 16px;border:1px solid rgba(20,21,30,.3);background:#FDFCF9;font-size:16px;line-height:1.35}
.wahl input:checked+span{background:#14523F;border-color:#14523F;color:#FFFFFF}
.wahl input:focus-visible+span{outline:2px solid #16A97B;outline-offset:2px}

/* Rückrufformular */
.kontaktform .felder{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.kontaktform .breit{grid-column:1/-1}
.kontaktform label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600;color:#14151E}
.kontaktform input,.kontaktform textarea{font:inherit;font-weight:400;font-size:16px;padding:12px;border:1px solid #B9BCB6;background:#FFFFFF;color:#14151E;border-radius:0;width:100%;box-sizing:border-box}
.kontaktform input:focus,.kontaktform textarea:focus{outline:2px solid #16A97B;outline-offset:0;border-color:#16A97B}
.kontaktform .honig{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.kontaktform .zustimmung{flex-direction:row;align-items:flex-start;gap:10px;font-weight:400;font-size:13px;line-height:1.5;color:#3E4049}
.kontaktform .zustimmung input{width:18px;height:18px;margin-top:2px;flex:none;accent-color:#14523F}
.kontaktform button:disabled{opacity:.6}