@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/inter-normal-400.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url('/fonts/inter-normal-500.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('/fonts/inter-normal-600.woff2') format('woff2'); }
@font-face { font-family: 'Newsreader'; font-style: italic; font-weight: 400; font-display: swap; src: url('/fonts/newsreader-italic-400.woff2') format('woff2'); }
@font-face { font-family: 'Newsreader'; font-style: italic; font-weight: 500; font-display: swap; src: url('/fonts/newsreader-italic-500.woff2') format('woff2'); }
@font-face { font-family: 'Newsreader'; font-style: normal; font-weight: 300; font-display: swap; src: url('/fonts/newsreader-normal-300.woff2') format('woff2'); }
@font-face { font-family: 'Newsreader'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/newsreader-normal-400.woff2') format('woff2'); }
@font-face { font-family: 'Newsreader'; font-style: normal; font-weight: 500; font-display: swap; src: url('/fonts/newsreader-normal-500.woff2') format('woff2'); }

:root {
  --paper:#FAFAF6; --paper-mid:#F3F2EA; --lime:#84BD00; --lime-soft:#EFF7DC;
  --lime-deep:#4D7C0F; --ink:#1C1E17; --ink-soft:#565A4E; --ink-muted:#8B8E80;
  --rule:#DEDFD2; --dark:#161A0F; --radius-card:16px; --radius-media:12px;
  --maxw:1152px; --font-display:'Newsreader',Georgia,serif; --font-body:'Inter',system-ui,sans-serif;
}
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:var(--font-body); color:var(--ink); background:var(--paper); line-height:1.65; font-size:17px; }
.wrap { max-width:var(--maxw); margin:0 auto; padding:0 32px; }
h1,h2 { font-family:var(--font-display); font-weight:400; letter-spacing:-0.01em; color:var(--ink); }
h1 em,h2 em { font-style:italic; color:var(--lime-deep); }
h3 { font-size:20px; font-weight:600; }
.eyebrow { font-size:12.5px; font-weight:600; letter-spacing:0.18em; text-transform:uppercase; color:var(--lime-deep); display:block; margin-bottom:22px; }
.btn { display:inline-block; background:var(--lime); color:var(--ink); text-decoration:none; font-weight:600; font-size:16px; padding:15px 32px; border-radius:999px; transition:transform .15s, box-shadow .15s; border:none; cursor:pointer; font-family:var(--font-body); }
.btn:hover { transform:translateY(-1px); box-shadow:0 6px 16px rgba(132,189,0,.35); }
.btn:focus-visible { outline:2px solid var(--lime-deep); outline-offset:2px; }
.textlink { color:var(--lime-deep); font-weight:600; text-decoration:none; font-size:16px; }
.textlink::after { content:" \2192"; transition:margin .15s; }
.textlink:hover::after { margin-left:4px; }
.badge { display:inline-block; background:var(--lime-soft); color:var(--lime-deep); font-size:12.5px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; padding:7px 16px; border-radius:999px; margin-bottom:28px; }
.num { font-size:13px; font-weight:600; color:var(--lime-deep); letter-spacing:.1em; font-variant-numeric:tabular-nums; }
header.site { background:var(--paper); border-bottom:1px solid var(--rule); }
header.site .inner { max-width:var(--maxw); margin:0 auto; padding:0 32px; height:76px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.wordmark { font-family:var(--font-display); font-size:22px; color:var(--ink); text-decoration:none; white-space:nowrap; line-height:1.1; }
.wordmark b { font-weight:500; }
.sub-claim { font-size:10px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--lime-deep); margin-top:4px; }
nav.main { display:flex; gap:28px; }
nav.main a { color:var(--ink-soft); text-decoration:none; font-size:14px; font-weight:500; }
nav.main a:hover { color:var(--ink); }
nav.main a.active { color:var(--lime-deep); }
.btn-nav { padding:10px 24px; font-size:14.5px; }
section.sec { padding:110px 0; }
.sec-head { max-width:760px; margin-bottom:52px; }
.sec-head h2 { font-size:clamp(30px,3.8vw,44px); line-height:1.12; margin-bottom:16px; }
.sec-head p { color:var(--ink-soft); font-size:18px; }
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.cards.two { grid-template-columns:repeat(2,1fr); }
.cards.grid7 { grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); }
.card { background:#fff; border:1px solid var(--rule); border-radius:var(--radius-card); padding:32px; box-shadow:0 2px 8px rgba(28,30,23,.05); transition:border-color .2s, transform .2s; display:flex; flex-direction:column; gap:14px; }
.card:hover { border-color:var(--lime); transform:translateY(-2px); }
.card p { font-size:16px; color:var(--ink-soft); flex-grow:1; }
.card ul { list-style:none; }
.card ul li { padding-left:22px; position:relative; font-size:16px; color:var(--ink-soft); margin-bottom:6px; }
.card ul li::before { content:""; position:absolute; left:0; top:9px; width:8px; height:8px; border-radius:50%; background:var(--lime); }
.flow { display:flex; align-items:center; margin-top:88px; max-width:900px; }
.flow .node { display:flex; flex-direction:column; align-items:center; gap:12px; flex-shrink:0; }
.flow .node .pt { width:12px; height:12px; border-radius:50%; background:var(--lime); }
.flow .node span { font-size:13px; font-weight:600; color:var(--ink-soft); white-space:nowrap; }
.flow .link { flex:1; height:1.5px; background:var(--rule); margin:0 12px 34px; min-width:30px; }
.checklist { display:grid; grid-template-columns:1fr 1fr; gap:16px 48px; max-width:940px; list-style:none; }
.checklist.three { grid-template-columns:repeat(3,1fr); }
.checklist li { padding-left:28px; position:relative; font-size:17px; color:var(--ink-soft); }
.checklist li::before { content:""; position:absolute; left:0; top:10px; width:10px; height:10px; border-radius:50%; background:var(--lime); }
.checklist li b { color:var(--ink); }
.phases { display:flex; position:relative; margin-top:56px; }
.phases::before { content:""; position:absolute; top:19px; left:5%; right:5%; height:1.5px; background:var(--rule); }
.phase { flex:1; text-align:center; position:relative; padding:0 14px; }
.phase .pnum { width:40px; height:40px; border-radius:50%; background:var(--lime); color:var(--ink); font-weight:600; font-size:15px; display:flex; align-items:center; justify-content:center; margin:0 auto 18px; position:relative; z-index:1; }
.phase h4 { font-size:16px; font-weight:600; color:var(--ink); margin-bottom:6px; }
.phase p { font-size:14px; color:var(--ink-soft); line-height:1.55; }
.paths { max-width:940px; }
.path { display:flex; justify-content:space-between; align-items:baseline; gap:32px; padding:20px 0; border-bottom:1px solid var(--rule); }
.path:first-child { border-top:1px solid var(--rule); }
.path span { color:var(--ink-soft); font-size:17px; }
.path b { color:var(--lime-deep); font-weight:600; white-space:nowrap; font-size:16px; }
.path b::before { content:"\2192 "; }
.path b a { color:inherit; text-decoration:none; }
.table-scroll { overflow-x:auto; }
table.cmp { width:100%; border-collapse:collapse; font-size:15px; }
table.cmp th, table.cmp td { border:1px solid var(--rule); padding:14px 16px; text-align:left; vertical-align:top; }
table.cmp thead th { background:var(--paper-mid); font-weight:600; }
table.cmp thead th.prod { border-top:2px solid var(--lime); }
table.cmp td:first-child { font-weight:600; white-space:nowrap; }
.final-cta { background:var(--dark); padding:110px 32px; text-align:center; }
.final-cta h2 { color:var(--paper); font-size:clamp(30px,4vw,48px); max-width:800px; margin:0 auto 20px; line-height:1.15; }
.final-cta h2 em { color:var(--lime); }
.final-cta p { color:#A9AF9E; max-width:560px; margin:0 auto 40px; font-size:17px; }
footer.site { background:var(--dark); color:#A9AF9E; padding:72px 32px 56px; border-top:1px solid rgba(255,255,255,.08); }
footer.site .inner { max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:48px; }
footer.site .wordmark { color:var(--paper); }
footer.site p { font-size:15px; line-height:1.7; margin-top:18px; }
footer.site h4 { color:var(--paper); font-size:12.5px; letter-spacing:.16em; text-transform:uppercase; margin-bottom:18px; }
footer.site a { color:#A9AF9E; text-decoration:none; font-size:15px; display:block; margin-bottom:10px; }
footer.site a:hover { color:var(--lime); }
.hero { background:var(--paper); padding:130px 0 100px; }
.hero h1 { font-size:clamp(40px,5.8vw,72px); line-height:1.07; max-width:950px; margin-bottom:30px; }
.hero.sub h1 { font-size:clamp(34px,4.4vw,54px); }
.hero .lead { font-size:19px; color:var(--ink-soft); max-width:740px; margin-bottom:40px; }
.hero-actions { display:flex; align-items:center; gap:32px; flex-wrap:wrap; }
.sender-note { font-size:14.5px; color:var(--ink-muted); margin-bottom:36px; }
.sender-note b { color:var(--ink); font-weight:600; }
.hero-grid { display:grid; grid-template-columns:1.05fr 1fr; gap:72px; align-items:center; }
.hero-dark { background:var(--dark); padding:120px 0 90px; position:relative; overflow:hidden; }
.hero-dark::before { content:""; position:absolute; top:-220px; left:50%; transform:translateX(-50%); width:900px; height:600px; border-radius:50%; background:radial-gradient(closest-side, rgba(132,189,0,.09), transparent); pointer-events:none; }
.hero-dark .wrap { position:relative; }
.hero-dark .badge { background:transparent; border:1px solid rgba(132,189,0,.5); color:var(--lime); }
.hero-dark h1 { color:var(--paper); font-size:clamp(36px,4.8vw,60px); line-height:1.08; max-width:940px; margin-bottom:26px; }
.hero-dark h1 em { color:var(--lime); }
.hero-dark .lead { color:#A9AF9E; font-size:18.5px; max-width:780px; margin-bottom:18px; }
.hero-dark .sender-note { color:#7C816F; }
.hero-dark .sender-note b { color:var(--paper); }
.band { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin-top:80px; position:relative; }
.band::before { content:""; position:absolute; top:-30px; left:4%; right:4%; height:1.5px; background:rgba(132,189,0,.4); }
.band .grp { position:relative; background:rgba(255,255,255,.04); border:1px solid rgba(132,189,0,.28); border-radius:14px; padding:22px 20px; }
.band .grp::before { content:""; position:absolute; top:-35px; left:50%; transform:translateX(-50%); width:11px; height:11px; border-radius:50%; background:var(--lime); }
.band .grp .gnum { font-size:11.5px; font-weight:600; letter-spacing:.12em; color:var(--lime); display:block; margin-bottom:8px; }
.band .grp h4 { color:var(--paper); font-size:15.5px; font-weight:600; margin-bottom:8px; }
.band .grp p { color:#8F947F; font-size:13.5px; line-height:1.55; }
.ui-sketch { background:#fff; border:1px solid var(--rule); border-radius:var(--radius-media); box-shadow:0 16px 48px rgba(28,30,23,.10); overflow:hidden; }
.ui-sketch .bar { height:40px; background:var(--paper); border-bottom:1px solid var(--rule); display:flex; align-items:center; gap:6px; padding:0 18px; }
.ui-sketch .bar i { width:9px; height:9px; border-radius:50%; background:var(--rule); }
.ui-sketch .body { display:grid; grid-template-columns:150px 1fr; min-height:320px; }
.ui-sketch .side { background:var(--paper); border-right:1px solid var(--rule); padding:20px 14px; display:flex; flex-direction:column; gap:13px; }
.ui-sketch .side i { height:12px; border-radius:4px; background:var(--paper-mid); display:block; }
.ui-sketch .side i.active { background:var(--lime); opacity:.85; }
.ui-sketch .main { padding:22px; display:flex; flex-direction:column; gap:12px; }
.ui-sketch .chiprow { display:flex; gap:8px; margin-bottom:8px; }
.ui-sketch .chip { height:24px; width:86px; border-radius:12px; background:var(--paper); border:1px solid var(--rule); }
.ui-sketch .chip.lime { background:var(--lime-soft); border-color:var(--lime); width:70px; }
.ui-sketch .row { height:46px; border-radius:10px; background:var(--paper); border:1px solid var(--rule); display:flex; align-items:center; padding:0 16px; gap:14px; }
.ui-sketch .row i { height:10px; border-radius:4px; background:var(--paper-mid); }
.ui-sketch .row .w1 { width:32%; } .ui-sketch .row .w2 { width:18%; } .ui-sketch .row .w3 { width:12%; }
.ui-sketch .row .dot { width:9px; height:9px; border-radius:50%; background:var(--lime); margin-left:auto; flex-shrink:0; }
/* KI-Pruefung Chat-Modal */
.er-chat[hidden] { display:none !important; }
.er-chat { position:fixed; inset:0; z-index:100; display:flex; align-items:center; justify-content:center; padding:1.5rem; }
.er-chat__backdrop { position:absolute; inset:0; background:rgba(22,26,15,0.55); backdrop-filter:blur(4px); }
.er-chat__panel { position:relative; width:100%; max-width:640px; max-height:min(720px, calc(100vh - 3rem)); background:var(--paper); border-radius:20px; box-shadow:0 40px 100px -20px rgba(22,26,15,0.5); display:flex; flex-direction:column; overflow:hidden; }
.er-chat__head { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:1.5rem 1.75rem 1rem; border-bottom:1px solid var(--rule); }
.er-chat__eyebrow { font-size:10px; font-weight:600; letter-spacing:0.18em; text-transform:uppercase; color:var(--lime-deep); margin:0 0 0.3rem; }
.er-chat__title { font-family:var(--font-display); font-weight:400; font-size:1.5rem; line-height:1.15; margin:0; color:var(--ink); }
.er-chat__close { width:36px; height:36px; border-radius:999px; border:1px solid var(--rule); background:#fff; color:var(--ink-soft); font-size:1.4rem; line-height:1; cursor:pointer; flex-shrink:0; }
.er-chat__close:hover { border-color:var(--lime); color:var(--lime-deep); }
.er-chat__consent { padding:1.75rem; }
.er-chat__consent h3 { font-family:var(--font-display); font-weight:400; font-size:1.2rem; margin:0 0 0.7rem; color:var(--ink); }
.er-chat__consent p { font-size:14px; line-height:1.6; color:var(--ink-soft); margin:0 0 1.25rem; }
.er-chat__consent p a { color:var(--lime-deep); }
.er-chat__consent-actions { display:flex; flex-wrap:wrap; gap:0.75rem; align-items:center; }
.er-chat__btn-primary { display:inline-flex; align-items:center; gap:0.5rem; background:var(--lime); color:var(--ink); font-weight:600; font-size:14px; padding:0.75rem 1.25rem; border-radius:999px; border:none; cursor:pointer; font-family:var(--font-body); }
.er-chat__btn-primary:hover { background:var(--lime-deep); color:#fff; }
.er-chat__btn-primary:disabled { background:var(--ink-muted); color:#fff; cursor:not-allowed; }
.er-chat__btn-ghost { background:transparent; border:1px solid transparent; color:var(--ink-soft); font-size:13px; cursor:pointer; padding:0.6rem 0.9rem; border-radius:999px; font-weight:500; font-family:var(--font-body); }
.er-chat__btn-ghost:hover { color:var(--ink); border-color:var(--rule); background:#fff; }
.er-chat__thread { display:flex; flex-direction:column; flex:1; min-height:0; }
.er-chat__messages { flex:1; overflow-y:auto; padding:1.5rem 1.75rem; display:flex; flex-direction:column; gap:1.25rem; }
.er-chat__msg { display:flex; flex-direction:column; gap:0.3rem; }
.er-chat__msg-role { font-size:10px; font-weight:600; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink-muted); }
.er-chat__msg--user .er-chat__msg-role { color:var(--lime-deep); }
.er-chat__msg-body { font-size:14.5px; line-height:1.6; color:var(--ink); white-space:pre-wrap; word-wrap:break-word; }
.er-chat__msg--pending .er-chat__msg-body::after { content:"\258A"; animation:erBlink 1s infinite; color:var(--lime); margin-left:4px; }
@keyframes erBlink { 0%,50% { opacity:1; } 51%,100% { opacity:0; } }
.er-chat__form { border-top:1px solid var(--rule); padding:1rem 1.75rem 1.25rem; background:var(--paper-mid); }
.er-chat__form textarea { width:100%; border:1px solid var(--rule); border-radius:10px; padding:0.8rem 1rem; font-family:var(--font-body); font-size:14.5px; line-height:1.5; resize:vertical; background:#fff; color:var(--ink); outline:none; }
.er-chat__form textarea:focus { border-color:var(--lime); box-shadow:0 0 0 3px rgba(132,189,0,0.15); }
.er-chat__form-row { display:flex; align-items:center; justify-content:space-between; margin-top:0.75rem; gap:0.75rem; flex-wrap:wrap; }
.er-chat__form-right { display:flex; align-items:center; gap:0.75rem; }
.er-chat__hint { font-size:11px; color:var(--ink-muted); }
.er-chat__ended { padding:2.5rem 1.75rem; text-align:center; border-top:1px solid var(--rule); background:var(--paper-mid); }
.er-chat__ended h3 { font-family:var(--font-display); font-weight:400; font-size:1.4rem; margin:0 0 0.7rem; color:var(--ink); }
.er-chat__ended p { font-size:14px; line-height:1.6; color:var(--ink-soft); margin:0 auto 1.5rem; max-width:28rem; }
form.contact { max-width:640px; display:flex; flex-direction:column; gap:18px; }
form.contact label { font-size:14px; font-weight:600; display:block; margin-bottom:6px; }
form.contact input, form.contact textarea { width:100%; padding:13px 16px; border:1px solid var(--rule); border-radius:10px; font-family:var(--font-body); font-size:16px; background:#fff; color:var(--ink); }
form.contact input:focus, form.contact textarea:focus { outline:2px solid var(--lime-deep); outline-offset:1px; border-color:var(--lime); }
.proto-note { font-size:13px; color:var(--ink-muted); }
@media (max-width:900px) {
  section.sec { padding:64px 0; }
  .hero { padding:80px 0 64px; }
  .cards, .cards.two { grid-template-columns:1fr; }
  .checklist, .checklist.three { grid-template-columns:1fr; }
  .hero-grid { grid-template-columns:1fr; gap:44px; }
  .band { grid-template-columns:1fr; margin-top:32px; }
  .band::before, .band .grp::before { display:none; }
  .phases { flex-direction:column; gap:30px; }
  .phases::before { display:none; }
  .phase { text-align:left; display:grid; grid-template-columns:40px 1fr; gap:0 18px; }
  .phase .pnum { margin:0; grid-row:1/3; }
  nav.main { display:none; }
  footer.site .inner { grid-template-columns:1fr; gap:36px; }
  .flow { flex-wrap:wrap; gap:18px; margin-top:48px; }
  .flow .link { display:none; }
  .path { flex-direction:column; gap:6px; }
  .path b { white-space:normal; }
}