:root{--navy:#132A4C;--navy-2:#1C3A66;--orange:#F26A21;--orange-dark:#C9500F;--paper:#FBF8F3;--card:#FFFFFF;--line:#E4DCCF;--ink:#16233B;--muted:#5E6E88;--soft:#8A97AC;--ok:#2E7D5B;--warn:#9A5B12;--warn-bg:#FBF1DE;--warn-line:#EAD6AC;--radius:16px}
*{box-sizing:border-box}html,body{margin:0}
body{background:var(--paper);color:var(--ink);font-family:"DM Sans",system-ui,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased}
.wrap{max-width:760px;margin:0 auto;padding:24px 18px 60px}
.top{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.av{width:38px;height:38px;border-radius:50%;background:var(--navy);display:flex;align-items:center;justify-content:center;flex:none}
.av svg{width:22px;height:22px}.av .pt{fill:var(--orange)}.av .pb{fill:#8fa5c9}
.brand{font-family:"Syne",sans-serif;font-weight:800;font-size:18px;color:var(--navy)}
.brand small{display:block;font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--soft)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}
.btn{font-family:inherit;font-size:15px;font-weight:600;border-radius:11px;padding:11px 20px;cursor:pointer;border:1.5px solid transparent}
.btn.ghost{background:transparent;color:var(--muted);border-color:var(--line)}.btn.ghost:hover{color:var(--ink);border-color:var(--navy-2)}
.btn.primary{background:var(--orange);color:#fff}.btn.primary:hover{background:var(--orange-dark)}
/* intro */
.intro{padding:34px 26px;text-align:center}
.intro .hero{width:96px;height:96px;border-radius:50%;background:var(--navy);display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
.intro .hero svg{width:54px;height:54px}
.intro h1{font-family:"Syne";font-weight:800;font-size:26px;color:var(--navy);margin:0 0 4px}
.intro .role{color:var(--muted);font-size:15px;margin:0 0 18px}
.intro p{color:var(--ink);font-size:16px;max-width:44ch;margin:0 auto 22px}
.starts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.testlink{margin-top:16px;font-size:12px;color:var(--soft)}.testlink button{background:none;border:none;color:var(--soft);text-decoration:underline;cursor:pointer;font:inherit;font-size:12px}
/* chat */
.chatwrap{padding:20px 18px 0}
.chat{display:flex;flex-direction:column;gap:16px;min-height:320px}
.turn{display:flex;gap:10px;max-width:88%}
.turn.me{align-self:flex-end;flex-direction:row-reverse}
.turn .pic{width:30px;height:30px;border-radius:50%;flex:none;background:var(--navy);display:flex;align-items:center;justify-content:center}
.turn .pic svg{width:17px;height:17px}.turn .pic .pt{fill:var(--orange)}.turn .pic .pb{fill:#8fa5c9}
.bub{padding:12px 15px;border-radius:14px;font-size:15px}
.turn.smarty .bub{background:var(--paper);border:1px solid var(--line);border-top-left-radius:4px}
.turn.me .bub{background:var(--navy);color:#fff;border-top-right-radius:4px}
.bub b{font-weight:600}.bub .soft{color:var(--muted)}
.typing{display:inline-flex;gap:4px;padding:15px}.typing i{width:7px;height:7px;border-radius:50%;background:var(--soft);animation:bl 1.2s infinite}.typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s}@keyframes bl{0%,60%,100%{opacity:.3}30%{opacity:1}}
.chips{display:flex;flex-wrap:wrap;gap:8px;padding:2px 0 4px 40px}
.chip{font-family:inherit;font-size:14px;font-weight:600;color:var(--navy);background:#fff;border:1.5px solid var(--line);border-radius:99px;padding:8px 14px;cursor:pointer}
.chip:hover{border-color:var(--orange)}.chip.on{background:#FFF4EC;border-color:var(--orange);color:var(--orange-dark)}
.chip.done{background:var(--orange);color:#fff;border-color:var(--orange)}
.inp{display:flex;gap:10px;align-items:flex-end;padding:14px 0 4px}
.inp textarea{flex:1;min-height:46px;max-height:130px;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;font:inherit;font-size:15px;background:var(--paper);resize:none}
.inp textarea:focus{outline:none;border-color:var(--orange)}
.inp .send{width:46px;height:46px;border-radius:12px;border:none;background:var(--orange);color:#fff;cursor:pointer;font-size:18px;flex:none}
.hint{text-align:center;font-size:12px;color:var(--soft);padding:6px 0 16px}
.hint button{background:none;border:none;color:var(--muted);text-decoration:underline;cursor:pointer;font:inherit;font-size:12px}
/* dossier (blijft staan in het gesprek) */
.dossier{align-self:stretch;max-width:100%}
.dossier .doc{border:1px solid var(--line);border-radius:14px;padding:22px;background:#fff}
.doc .stamp{font-family:"Syne";font-weight:800;font-size:20px;color:var(--navy);margin:0 0 4px}
.doc .lead{color:var(--muted);font-size:15px;margin:0 0 20px}
.doc .ai{font-size:16px;background:#FFF4EC;border-left:3px solid var(--orange);padding:13px 15px;margin:0 0 20px}
.sec{margin-bottom:16px}
.sec h3{font-family:"Syne";font-weight:700;font-size:15px;color:var(--navy);margin:0 0 10px;display:flex;align-items:center;gap:9px}
.sec h3 .n{width:22px;height:22px;border-radius:6px;background:var(--navy);color:#fff;font-size:12px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;flex:none}
.profileName{font-family:"Syne";font-weight:800;font-size:20px;color:var(--orange);margin:0 0 8px}
.kenmerk{display:flex;gap:9px;padding:3px 0;font-size:15px}.kenmerk::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--orange);margin-top:9px;flex:none}
.hw{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px dashed var(--line)}.hw:last-child{border-bottom:none}
.hw .n b{font-weight:600}.hw .n .why{display:block;color:var(--muted);font-size:13px;margin-top:2px}.hw .n .why b{color:var(--navy)}
.hw .r{text-align:right;white-space:nowrap}.hw .r .p{font-weight:600;color:var(--navy)}.hw .r .prio{display:block;font-size:11px;font-weight:600;margin-top:3px}
.prio-now{color:var(--orange-dark)}.prio-late{color:var(--soft)}
.steps{margin:0;padding:0;list-style:none}.steps li{position:relative;padding:6px 0 6px 74px;border-bottom:1px dashed var(--line)}.steps li:last-child{border-bottom:none}.steps li b{position:absolute;left:0;top:6px;color:var(--orange);font-weight:600;font-size:13px}
.risk{background:var(--warn-bg);border:1px solid var(--warn-line);border-radius:10px;padding:14px}.risk h3{color:var(--warn)}.risk .item{padding:7px 0;border-bottom:1px dashed var(--warn-line);font-size:14px}.risk .item:last-child{border-bottom:none}.risk .item b{color:var(--warn)}
.total{display:flex;justify-content:space-between;font-family:"Syne";font-weight:700;font-size:15px;color:var(--navy);padding-top:10px;margin-top:4px;border-top:2px solid var(--line)}
.budgetnote{font-size:14px;color:var(--warn);background:var(--warn-bg);border-radius:10px;padding:10px 12px;margin-top:12px}
.bridge{background:var(--navy);color:#fff;border-radius:12px;padding:20px;margin-top:18px}
.bridge h3{font-family:"Syne";font-weight:700;font-size:18px;margin:0 0 8px;color:#fff}.bridge p{color:#C7D2E4;margin:0 0 16px;font-size:15px}
.bridge .cta{display:inline-flex;gap:8px;background:var(--orange);color:#fff;font-weight:600;text-decoration:none;padding:11px 20px;border-radius:11px}.bridge .cta:hover{background:var(--orange-dark)}
.bridge .price{font-size:13px;color:#9DB0CC;margin-top:12px}
.dact{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
@media print{body{background:#fff}.noprint{display:none!important}.top,.chat>.turn:not(.dossier){display:none!important}.card{border:none}.chatwrap{padding:0}.doc{border:none;padding:0}}
@media(max-width:520px){.turn{max-width:94%}}