/* Projektstart-Fragebogen · IGVN Group – alle Schriften lokal (DSGVO-freundlich) */
@font-face{font-family:"TeX Gyre Pagella";src:url(fonts/pagella.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Inter";src:url(fonts/inter-400.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Inter";src:url(fonts/inter-600.woff) format("woff");font-weight:600;font-display:swap}
@font-face{font-family:"Poppins";src:url(fonts/poppins-400.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Poppins";src:url(fonts/poppins-500.woff) format("woff");font-weight:500;font-display:swap}

*,*::before,*::after{box-sizing:border-box}
:root{
  --espresso:#2B2622;--taupe:#635A51;--stein:#8C8277;--sand:#BDB1A5;--leinen:#E9E3DA;--elfenbein:#FAF7F2;
  --ink:var(--espresso);--muted:var(--taupe);--line:var(--leinen);--bg:var(--elfenbein);--card:#fff;--err:#a8261b;
  --font:"Inter",Arial,sans-serif;--serif:"TeX Gyre Pagella","Palatino Linotype","Book Antiqua",Palatino,Georgia,serif;--label:"Poppins",Arial,sans-serif;
}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:16px/1.6 var(--font);color:var(--ink);background:var(--bg)}
.wrap{max-width:780px;margin:0 auto;padding:0 20px}
.hidden{display:none!important}
[hidden]{display:none!important}
a{color:var(--taupe)}
.muted{color:var(--taupe)}.small{font-size:13px}

.top{background:var(--elfenbein);border-bottom:1px solid var(--sand);position:sticky;top:0;z-index:5}
.top-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center}
.logo-h{height:26px;width:auto;display:block}
.save-state{font-size:13px;color:var(--taupe)}

main{padding:36px 20px 10px}
.logo-p{display:block;width:210px;max-width:60%;height:auto;margin:6px 0 34px}
.eyebrow,.step-count,.overview li,.btn,.price{font-family:var(--label)}
.eyebrow{text-transform:uppercase;letter-spacing:.35em;font-size:11px;color:var(--taupe);margin:0 0 12px}
h1,h2{font-family:var(--serif);font-weight:400;color:var(--espresso);letter-spacing:0}
h1{font-size:clamp(32px,5.5vw,46px);line-height:1.12;margin:0 0 16px}
h2{font-size:30px;margin:0 0 14px;padding-bottom:14px;border-bottom:1px solid var(--leinen)}
.lead{font-size:18px;color:var(--taupe);margin:0 0 28px}

.overview{list-style:none;padding:0;margin:0 0 30px;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.overview li{background:#fff;border:1px solid var(--leinen);border-radius:4px;padding:12px 14px;display:flex;gap:10px;align-items:center;font-size:14px}
.overview span{flex:none;width:26px;height:26px;border-radius:50%;border:1px solid var(--sand);color:var(--taupe);display:grid;place-items:center;font-family:var(--serif);font-size:14px}

.btn{font-size:15px;font-weight:500;letter-spacing:.06em;border-radius:3px;padding:12px 22px;border:1px solid transparent;cursor:pointer;transition:background .15s,border-color .15s}
.btn.primary{background:var(--taupe);color:#fff}
.btn.primary:hover{background:var(--espresso)}
.btn.ghost{background:transparent;border-color:var(--sand);color:var(--ink)}
.btn.ghost:hover{border-color:var(--taupe);background:#fff}
.btn.big{padding:15px 32px;font-size:17px}
.btn[disabled]{opacity:.55;cursor:wait}
:focus-visible{outline:3px solid rgba(99,90,81,.35);outline-offset:2px}

.testbar{display:flex;gap:10px;align-items:center;border:1px dashed var(--sand);color:var(--taupe);border-radius:3px;padding:10px 14px;font-size:14px;margin:22px 0 20px;cursor:pointer}
.testbar input{accent-color:var(--taupe);width:17px;height:17px;flex:none}

.progress{height:2px;background:var(--leinen);margin-bottom:12px}
.bar{height:100%;width:0;background:linear-gradient(90deg,var(--sand),var(--taupe));transition:width .35s ease}
.step-count{text-transform:uppercase;letter-spacing:.3em;font-size:11px;color:var(--taupe);margin:0 0 22px}
.step{background:#fff;border:1px solid var(--leinen);border-radius:4px;padding:30px clamp(18px,4vw,34px)}
.step-intro{color:var(--taupe);margin:0 0 24px}

.field{margin:0 0 22px;border:0;padding:0;min-width:0}
.field>label,.field>legend,.up-label{display:block;font-weight:600;margin-bottom:6px;padding:0}
.hint{display:block;font-size:13px;color:var(--taupe);margin:-2px 0 8px}
.req{color:var(--stein)}
input[type=text],input[type=email],input[type=tel],input[type=number],textarea{
  width:100%;font:inherit;color:inherit;background:#fff;border:1px solid var(--sand);border-radius:3px;padding:11px 13px}
input:focus,textarea:focus{border-color:var(--taupe);outline:none;box-shadow:0 0 0 3px rgba(99,90,81,.12)}
::placeholder{color:var(--stein)}
input.num{max-width:160px}
textarea{resize:vertical;min-height:96px}
.invalid input,.invalid textarea{border-color:var(--err)!important}
.invalid .choices{outline:1px solid var(--err);outline-offset:4px;border-radius:3px}
.field-err{color:var(--err);font-size:13px;margin:5px 0 0}

.choices{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.choice{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--leinen);border-radius:3px;padding:11px 13px;cursor:pointer;background:#fff}
.choice:hover{border-color:var(--sand)}
.choice input{margin:3px 0 0;accent-color:var(--taupe);flex:none;width:17px;height:17px}
.choice:has(input:checked){border-color:var(--taupe);background:var(--elfenbein)}
.price{font-size:12px;font-weight:500;letter-spacing:.04em;color:var(--taupe)}
.consent{margin-top:22px}

.slider{margin-bottom:12px}
.slider-row{display:grid;grid-template-columns:110px 1fr 110px;gap:12px;align-items:center;font-size:14px;color:var(--taupe)}
.slider-row span:last-child{text-align:right}
input[type=range]{width:100%;accent-color:var(--taupe);height:28px}
@media (max-width:520px){.slider-row{grid-template-columns:1fr 1fr}.slider-row input{grid-column:1/-1;grid-row:2}}

.field>.drop{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;border:1px dashed var(--sand);border-radius:4px;padding:22px;color:var(--taupe);cursor:pointer;background:#fff;font-weight:400;margin:0;position:relative}
.drop:hover,.drop.over{border-color:var(--taupe);background:var(--elfenbein)}
.drop input{position:absolute;width:1px;height:1px;opacity:0}
.drop strong{color:var(--espresso)}
.drop:focus-within{outline:3px solid rgba(99,90,81,.35);outline-offset:2px}
.step h2:focus{outline:none}
.files{list-style:none;padding:0;margin:10px 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.files li{position:relative;border:1px solid var(--leinen);border-radius:4px;overflow:hidden;background:#fff;font-size:12px}
.files .thumb{aspect-ratio:4/3;background:var(--leinen) center/cover no-repeat;display:grid;place-items:center;font-weight:600;color:var(--taupe);text-transform:uppercase;font-size:13px}
.files .meta{padding:6px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.files .rm{position:absolute;top:5px;right:5px;width:26px;height:26px;border-radius:50%;border:0;background:rgba(43,38,34,.7);color:#fff;cursor:pointer;font-size:15px;line-height:1}
.files .prog{position:absolute;left:0;bottom:0;height:3px;background:var(--taupe);transition:width .2s}
.files li.err{border-color:var(--err)}
.files li.err .meta{color:var(--err);white-space:normal}

.costbox{background:var(--leinen);border-radius:3px;padding:12px 16px;font-size:15px}
.costbox:empty{display:none}
.costbox strong{color:var(--espresso)}
.warn{color:#8a5a12;font-size:14px}

.nav{display:flex;justify-content:space-between;gap:12px;margin-top:22px}
.error{color:var(--err);font-weight:500;min-height:1.2em;margin:14px 0 0}

#review .rv{border-top:1px solid var(--leinen);padding:16px 0}
#review .rv:first-child{border-top:0;padding-top:0}
#review .rv-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
#review h3{margin:0;font-family:var(--serif);font-weight:400;font-size:20px}
#review .edit{background:none;border:0;color:var(--taupe);font:inherit;font-weight:600;cursor:pointer;padding:4px;text-decoration:underline;text-decoration-color:var(--sand)}
#review dl{margin:0;display:grid;grid-template-columns:minmax(140px,36%) 1fr;gap:6px 16px;font-size:15px}
#review dt{color:var(--taupe)}
#review dd{margin:0;white-space:pre-wrap;word-break:break-word}
#review .empty{color:var(--taupe);font-style:italic}
@media (max-width:520px){#review dl{grid-template-columns:1fr}#review dd{margin-bottom:8px}}

.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.done{text-align:center;padding:50px 0}
.check{width:72px;height:72px;border-radius:50%;background:var(--espresso);color:#fff;font-size:34px;display:grid;place-items:center;margin:0 auto 20px;font-family:var(--serif)}

.site-foot{padding-bottom:40px}
.foot-note{font-family:var(--label);text-transform:uppercase;letter-spacing:.3em;font-size:10px;color:var(--stein);text-align:center;margin:40px 0 0;padding-top:16px;border-top:1px solid var(--sand)}
.foot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:22px;font-size:13px;line-height:1.7;color:var(--taupe)}
.foot-grid strong{color:var(--espresso);font-family:var(--label);font-weight:500;letter-spacing:.08em}
.foot-grid a,.foot-legal a{color:var(--taupe);text-decoration:none;border-bottom:1px solid var(--sand)}
.foot-grid a:hover,.foot-legal a:hover{color:var(--espresso);border-color:var(--taupe)}
.foot-legal{font-size:12px;color:var(--taupe);margin:18px 0 0;padding-top:14px;border-top:1px solid var(--leinen)}
@media (max-width:640px){.foot-grid{grid-template-columns:1fr;gap:14px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Betreuungspakete */
.pkgs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:10px}
@media (max-width:640px){.pkgs{grid-template-columns:1fr}}
.pkg{position:relative;display:block;border:1px solid var(--leinen);border-radius:4px;background:#fff;cursor:pointer;padding:0}
.pkg input{position:absolute;top:16px;right:16px;accent-color:var(--taupe);width:18px;height:18px}
.pkg-body{display:block;padding:18px 18px 14px}
.pkg-name{display:block;font-family:var(--label);text-transform:uppercase;letter-spacing:.3em;font-size:11px;color:var(--taupe);margin-bottom:6px}
.pkg-price{display:block;font-family:var(--serif);font-size:30px;color:var(--espresso);line-height:1.1;margin-bottom:10px}
.pkg-price small{font-family:var(--font);font-size:12px;color:var(--taupe)}
.pkg ul{margin:0;padding:10px 0 0;border-top:1px solid var(--leinen);list-style:none;font-size:14px}
.pkg li{padding:3px 0 3px 18px;position:relative}
.pkg li::before{content:"";position:absolute;left:2px;top:11px;width:8px;height:1px;background:var(--sand)}
.pkg:hover{border-color:var(--sand)}
.pkg:has(input:checked){border-color:var(--taupe);background:var(--elfenbein);box-shadow:inset 0 0 0 1px var(--taupe)}
.pkg-pop{border-color:var(--sand)}
.pkg-tag{position:absolute;top:-9px;left:16px;background:var(--taupe);color:#fff;font-family:var(--label);font-size:10px;letter-spacing:.2em;text-transform:uppercase;padding:2px 8px;border-radius:2px}
.pkg-note{font-size:13px;color:var(--taupe);margin:12px 0 0;background:var(--leinen);padding:10px 14px;border-radius:3px}
.pkg-note strong{color:var(--espresso)}
.pkg-year{display:block;font-size:12px;color:var(--taupe);margin:-6px 0 10px}
/* Platz für den Barrierefreiheits-Button (unten fixiert, 24 px + 56 px) – nichts liegt am Seitenende darunter */
.site-foot{padding-bottom:104px}