/* ── Boekingsflow (volledige pagina na de quiz) ── */
body.flow-mode{background:var(--cream)}
body.flow-mode .bg,body.flow-mode main,body.flow-mode #site,body.flow-mode .float-call{display:none!important}
body.flow-mode header{background:var(--navy);border-color:transparent}
.flow{display:none;color:var(--navy);padding:34px 16px 70px}
body.flow-mode .flow{display:block}
.flow-in{max-width:1080px;margin:0 auto}
/* stappen */
.fsteps{display:flex;align-items:center;justify-content:center;gap:12px;font-size:14px;font-weight:600;color:var(--muted);flex-wrap:wrap}
.fsteps .st{display:flex;align-items:center;gap:8px}
.fsteps .dot{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;border:1.5px dashed #c3c9d6;color:var(--muted);background:#fff}
.fsteps .st.done .dot{background:var(--ok);border:0;color:#fff}
.fsteps .st.cur{color:var(--navy)}
.fsteps .st.cur .dot{background:var(--orange);border:0;color:#fff;box-shadow:0 0 0 4px rgba(240,106,58,.18)}
.fsteps .fl{width:46px;height:2px;background:repeating-linear-gradient(90deg,#c3c9d6 0 4px,transparent 4px 8px)}
.fsteps .fl.done{background:var(--ok)}
/* kop */
.fhead{text-align:center;margin:26px auto 0;max-width:720px}
.fok{display:inline-flex;align-items:center;gap:8px;background:#E8F7F0;color:#157a52;font-size:14px;font-weight:600;padding:8px 14px;border-radius:999px}
.fok i{width:18px;height:18px;border-radius:50%;background:var(--ok);display:grid;place-items:center}
.fok i::after,.tick::after{content:"";width:7px;height:3.5px;border:2px solid #fff;border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px)}
.fhead h1{font-family:"Plus Jakarta Sans",sans-serif;font-size:clamp(32px,4.4vw,52px);line-height:1.08;font-weight:800;letter-spacing:-.025em;margin:18px 0 14px}
.fhead h1 em{font-style:normal;color:var(--orange)}
.fhead p{font-size:17px;line-height:1.65;color:var(--muted)}
.fhead p b{color:var(--navy)}
/* grid */
.fgrid{display:grid;grid-template-columns:1fr 440px;gap:56px;margin-top:46px;align-items:start}
.flabel{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:var(--muted)}
.flabel::before{content:"";width:22px;height:2px;background:var(--orange)}
.fgrid h2{font-family:"Plus Jakarta Sans",sans-serif;font-size:28px;font-weight:800;letter-spacing:-.015em;margin:6px 0 22px}
.fpts{list-style:none;display:grid;gap:20px}
.fpts li{display:grid;grid-template-columns:34px 1fr;gap:14px}
.fpts .n{width:32px;height:32px;border-radius:9px;background:#FFE3D6;color:#c64d22;display:grid;place-items:center;font-weight:800;font-size:14px}
.fpts b{display:block;font-size:16.5px;margin-bottom:3px}
.fpts span{font-size:15px;line-height:1.55;color:var(--muted)}
/* ticket */
.ticket{position:relative;display:grid;grid-template-columns:116px 1fr;background:#fff;border:2px solid var(--navy);border-radius:16px;box-shadow:5px 5px 0 var(--navy);margin-top:32px;overflow:visible}
.ticket .tl{display:flex;align-items:center;justify-content:center;font-family:"Plus Jakarta Sans",sans-serif;font-size:46px;font-weight:800;border-right:2px dashed #d5d9e2;color:var(--navy)}
.ticket .tl small{font-size:.5em}
.ticket .tl.or{background:var(--orange);color:#fff;border-right:0;border-radius:13px 0 0 13px}
.ticket::before,.ticket::after{content:"";position:absolute;left:107px;width:16px;height:16px;border-radius:50%;background:var(--cream);border:2px solid var(--navy)}
.ticket::before{top:-9px}.ticket::after{bottom:-9px}
.ticket .tr{padding:18px 20px}
.ticket .kick{font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#c64d22}
.ticket .tr b{display:block;font-size:16.5px;margin:6px 0 4px}
.ticket .tr p{font-size:14.5px;line-height:1.5;color:var(--muted)}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.chips span{font-size:12.5px;font-weight:600;border:1px solid #d5d9e2;border-radius:999px;padding:4px 10px;background:#fff;color:var(--navy)}
/* agenda-kaart */
.fcal-top{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.fcal-top .ic{width:40px;height:40px;border-radius:11px;background:var(--orange);display:grid;place-items:center}
.fcal-top b{display:block;font-size:16.5px}
.fcal-top span{font-size:13.5px;color:var(--muted)}
.fcal-top + .chips{justify-content:flex-end;margin:-4px 0 12px}
.fcard{background:#fff;border:2px solid var(--navy);border-radius:18px;box-shadow:5px 5px 0 var(--navy);overflow:hidden}
.fcard .pad{padding:20px}
.mhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.mhead b{font-size:16px;text-transform:capitalize}
.nav2{display:flex;gap:6px}
.nav2 button,.backb{width:32px;height:32px;border-radius:50%;border:1px solid #e1e5ec;background:#fff;cursor:pointer;display:grid;place-items:center;color:var(--navy);font-size:15px}
.nav2 button:disabled{opacity:.3;cursor:default}
.wd,.mgrid{display:grid;grid-template-columns:repeat(7,1fr);text-align:center}
.wd span{font-size:12px;color:var(--muted);padding-bottom:8px}
.mgrid button{aspect-ratio:1;margin:3px;border-radius:50%;border:0;background:none;font:inherit;font-size:14.5px;color:#b7bdc9;cursor:default}
.mgrid button.av{background:#FFEDE5;color:#c64d22;font-weight:800;cursor:pointer}
.mgrid button.av:hover{background:#FFDCCB}
.mgrid button.sel{background:var(--orange);color:#fff;box-shadow:0 0 0 3px #fff,0 0 0 5px var(--orange)}
.mgrid button.today{color:var(--navy);font-weight:800}
.dhead{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.dhead div{flex:1}
.dhead b{display:block;font-size:16px;text-transform:capitalize}
.dhead span{font-size:12.5px;color:var(--muted)}
.part{font-size:12.5px;color:var(--muted);margin:10px 0 8px}
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tgrid button{border:1.5px solid #e1e5ec;background:#fff;border-radius:11px;padding:12px 0;font:inherit;font-weight:700;font-size:15px;color:var(--navy);cursor:pointer}
.tgrid button:hover{border-color:#c3c9d6}
.tgrid button.sel{background:var(--navy);border-color:var(--navy);color:#fff}
.ffoot{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #eef0f4;padding:14px 20px}
.ffoot span{font-size:14px;font-weight:600}
.fbtn{background:var(--orange);color:#fff;border:0;border-radius:12px;padding:13px 20px;font:inherit;font-weight:700;font-size:15px;cursor:pointer;box-shadow:0 8px 20px rgba(240,106,58,.3)}
.fbtn:disabled{opacity:.4;box-shadow:none;cursor:default}
.fbtn.full{width:100%}
.tz{font-size:12.5px;color:var(--muted);border-top:1px solid #eef0f4;padding:12px 20px}
.sum{display:flex;gap:12px;align-items:flex-start;background:var(--cream);border-radius:12px;padding:14px}
.sum .ic{width:34px;height:34px;border-radius:9px;background:#FFE3D6;display:grid;place-items:center;flex:none}
.sum div{flex:1}
.sum b{display:block;font-size:15px;text-transform:capitalize}
.sum span{font-size:12.5px;color:var(--muted)}
.sum a{font-size:13.5px;font-weight:700;color:#c64d22;cursor:pointer;text-decoration:none}
.who{margin:16px 0;display:grid;gap:9px}
.who div{display:flex;justify-content:space-between;gap:14px;font-size:14px;border-bottom:1px solid #f0f2f6;padding-bottom:9px}
.who div span{color:var(--muted)}
.who div b{text-align:right;font-weight:600}
.ferr{color:#c0392b;font-size:13px;margin-top:8px;min-height:1em}
.fnote{font-size:13.5px;line-height:1.55;color:var(--muted);margin-top:12px}
.fempty{padding:30px 6px;text-align:center;font-size:14.5px;line-height:1.6;color:var(--muted)}
.fbottom{text-align:center;font-size:14.5px;color:var(--muted);margin-top:48px}
/* bevestigd */
.fdone .ticket{max-width:560px;margin:34px auto 0}
.fdone .ticket .tr b{font-size:19px;text-transform:capitalize}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:22px}
.three .c{background:#fff;border:2px solid var(--navy);border-radius:16px;box-shadow:4px 4px 0 var(--navy);padding:20px}
.three b{display:block;font-size:16.5px;margin:12px 0 6px}
.three p{font-size:14.5px;line-height:1.55;color:var(--muted)}
.three a{display:inline-block;margin-top:10px;font-size:14px;font-weight:700;color:#c64d22;cursor:pointer;text-decoration:none}
.fdone h3{text-align:center;font-family:"Plus Jakarta Sans",sans-serif;font-size:28px;font-weight:800;margin-top:56px}
@media (max-width:900px){
  .fgrid{grid-template-columns:1fr;gap:34px}
  .fgrid .fleft{order:2}
  .three{grid-template-columns:1fr}
  .fsteps .fl{width:22px}
  .fsteps .st span.t{display:none}
  .fsteps .st.cur span.t{display:inline}
}
body.flow-mode header nav{display:none}
.fsteps .done{padding:0;text-align:inherit}
