/* components.css — uiterlijk per component. Dual-use blokken gebruiken
   semantische tokens (--block-bg/--block-fg/--meter-track/--thumb-*) zodat
   dezelfde CSS in light én dark werkt. Basis uit _modulair, uitgebreid met de
   formulier-, wizard- en voortgangscomponenten. */

/* logo — officieel Orenzis-logo (SVG), thema-adaptief: donkere inkt op licht,
   warm-witte inkt op donker. De oranje mark blijft in beide gelijk. */
.logo{display:inline-flex;align-items:center;height:22px;text-decoration:none;}
.logo img{height:22px;width:auto;display:block;}
.logo .logo-white{display:none;}
:root[data-theme="dark"] .logo .logo-ink{display:none;}
:root[data-theme="dark"] .logo .logo-white{display:block;}

/* masthead */
.filetag{margin-bottom:18px;display:inline-block;background:var(--accent);color:var(--on-accent);
  font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;padding:5px 10px;}
h1{font-family:var(--display);font-weight:800;text-transform:uppercase;
  font-size:clamp(2.1rem,7vw,5rem);line-height:.86;letter-spacing:-.045em;}
h1 .strike{position:relative;}
h1 .strike::after{content:"";position:absolute;left:-2%;right:-2%;top:54%;height:.09em;background:var(--accent);}
.mh-num{align-self:stretch;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  border-left:2px solid var(--hair-strong);background:var(--paper2);position:relative;padding:30px 36px;}
.mh-num b{font-family:var(--display);font-weight:800;letter-spacing:-.06em;line-height:.9;
  font-size:clamp(5rem,13vw,10rem);color:var(--accent);}
.mh-num small{font-family:var(--mono);font-size:.78rem;letter-spacing:.1em;color:var(--ink-dim);text-align:center;}

/* verdict band */
.verdictband .tab{background:var(--block-bg);color:var(--block-fg);padding:20px 22px;display:flex;flex-direction:column;justify-content:center;gap:6px;}
.verdictband .tab .big{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:-.02em;
  font-size:clamp(1.2rem,4vw,1.9rem);line-height:.95;color:var(--block-fg);}
.verdictband .tab .big em{color:var(--accent);font-style:normal;}
.verdictband .desc{padding:20px 22px;display:flex;align-items:center;}
.verdictband .desc p{font-size:1.06rem;line-height:1.5;color:var(--ink-dim);max-width:62ch;}

/* sectiekop */
.sechead .idx{font-family:var(--display);font-weight:800;font-size:1.4rem;letter-spacing:-.03em;color:var(--accent);}
.sechead h2{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:-.02em;
  font-size:clamp(1.1rem,3.5vw,1.7rem);}

/* radar-svg (kleuren via tokens) */
.radar-ring{fill:none;stroke:var(--hair);stroke-width:1;}
.radar-ring-outer{fill:none;stroke:var(--hair-strong);stroke-width:2;}
.radar-spoke{stroke:var(--hair);stroke-width:1;}
.radar-data{fill:var(--accent);fill-opacity:.22;stroke:var(--accent);stroke-width:2.5;}
.radar-val{fill:var(--ink);font-family:var(--mono);font-size:11px;font-weight:700;}
.radar-axis{fill:var(--ink-dim);font-family:var(--mono);font-size:11px;letter-spacing:1px;}

/* ledger-tabel */
.ledger{width:100%;border-collapse:collapse;}
.ledger th,.ledger td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--hair);vertical-align:middle;}
.ledger thead th{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);
  border-bottom:2px solid var(--hair-strong);background:var(--paper3);}
.ledger .as{font-family:var(--display);font-weight:700;font-size:1.02rem;letter-spacing:-.01em;}
.ledger .wt{font-family:var(--mono);font-size:.8rem;color:var(--ink-dim);text-align:right;width:60px;}
.ledger .scorecell{font-family:var(--display);font-weight:800;font-size:1.5rem;letter-spacing:-.03em;text-align:right;width:64px;}
.ledger .bandcell{width:108px;}
.ledger .totalrow td{border-top:3px solid var(--hair-strong);border-bottom:none;background:var(--paper3);}
.stripe{display:inline-block;font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--on-accent);padding:4px 8px;}

/* findings */
.finding .meta{padding:18px 14px;border-right:2px solid var(--hair-strong);background:var(--paper2);
  display:flex;flex-direction:column;gap:8px;}
.finding .meta .axisno{font-family:var(--display);font-weight:800;font-size:2.2rem;line-height:.8;letter-spacing:-.04em;color:var(--ink);}
.finding .meta .axisno span{color:var(--accent);}
.finding .meta .stripe{align-self:flex-start;}
.finding .body{padding:18px 18px;}
.finding .body .name{font-family:var(--display);font-weight:700;font-size:1.05rem;margin-bottom:10px;letter-spacing:-.01em;}
.finding .fmeter{height:10px;border:2px solid var(--hair-strong);background:var(--meter-track);position:relative;margin:0 0 14px;}
.finding .fmeter > i{position:absolute;inset:0 auto 0 0;display:block;}
.finding .fmeter span{position:absolute;right:-2px;top:-22px;font-family:var(--mono);font-size:.72rem;color:var(--ink-dim);}
.finding .body p{font-size:1.04rem;line-height:1.55;color:var(--ink-dim);max-width:72ch;}

/* cta */
.ctablock .ctacopy{padding:30px 22px;}
.ctablock .ctacopy h3{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:-.025em;
  font-size:clamp(1.6rem,5vw,2.8rem);line-height:.92;}
.ctablock .ctacopy h3 em{color:var(--accent);font-style:normal;}
.ctablock .ctacopy p{margin-top:12px;font-size:1.06rem;line-height:1.5;color:var(--ink-dim);max-width:52ch;}
.ctablock .ctaact{border-left:2px solid var(--hair-strong);background:var(--block-bg);
  padding:30px 22px;display:flex;flex-direction:column;gap:12px;justify-content:center;}
.btn{display:block;text-align:center;text-decoration:none;font-family:var(--mono);font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;font-size:.84rem;padding:16px;cursor:pointer;border:none;}
.btn.primary{background:var(--accent);color:var(--on-accent);}
.btn.ghost{background:transparent;color:var(--block-fg);border:2px solid var(--block-fg);}
.btn:disabled{opacity:.4;cursor:not-allowed;}

/* Terug naar de overzichtspagina (rapport.html): link in de runhead + knop onder het rapport. */
.backlink{text-decoration:none;transition:color 200ms ease;}
.backlink:hover{color:var(--accent);}
.rapport-terug{margin:8px auto 28px;max-width:300px;}
.rapport-terug .btn{color:var(--ink);border-color:var(--hair-strong);}
.rapport-terug .btn:hover{color:var(--accent);border-color:var(--accent);}

/* ===== NIEUW: aanvraagformulier ===== */
.lead-label{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-dim);}
.lead-label .req{color:var(--accent);}
.lead-input{font-family:var(--sans);font-size:1.02rem;color:var(--ink);background:var(--field-bg);
  border:2px solid var(--hair-strong);padding:12px 12px;width:100%;}
.lead-input::placeholder{color:var(--ink-faint);}
.lead-input:focus{outline:2px solid var(--accent);outline-offset:1px;}
.trustline{display:flex;gap:10px;align-items:baseline;}
.trustline .tk{color:var(--accent);font-family:var(--display);font-weight:800;font-size:.95rem;flex-shrink:0;}
.trustline p{font-size:.98rem;color:var(--ink-dim);line-height:1.4;}
.formnote{margin-top:10px;font-size:.85rem;color:var(--ink-faint);line-height:1.5;}
.honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.formstatus{font-family:var(--mono);font-size:.8rem;letter-spacing:.04em;margin-top:6px;min-height:1.2em;}
.formstatus.err{color:var(--risico);} .formstatus.ok{color:var(--sterk);}

/* ===== NIEUW: vragen-wizard ===== */
.prog-meta{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-dim);}
.prog-meta b{color:var(--accent);}
.progbar{height:14px;border:2px solid var(--hair-strong);background:var(--meter-track);position:relative;min-width:140px;}
.progbar > i{position:absolute;inset:0 auto 0 0;background:var(--accent);transition:width .3s cubic-bezier(.16,1,.3,1);}
.qdim{font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:8px;}
.qtext{font-family:var(--display);font-weight:800;text-transform:none;letter-spacing:-.02em;
  font-size:clamp(1.35rem,3.6vw,2rem);line-height:1.05;margin-bottom:6px;}
.qhint{font-size:.98rem;color:var(--ink-dim);margin-bottom:20px;max-width:70ch;}
.levels{display:flex;flex-direction:column;border-top:2px solid var(--hair-strong);}
.level{display:grid;grid-template-columns:44px 1fr;align-items:stretch;gap:0;text-align:left;
  background:transparent;border:none;border-bottom:1px solid var(--hair);cursor:pointer;width:100%;
  font-family:var(--sans);transition:background .12s;}
.level:hover{background:var(--paper2);}
.level:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;}
.level .lv-num{font-family:var(--display);font-weight:800;font-size:1.1rem;color:var(--ink-faint);
  display:flex;align-items:center;justify-content:center;border-right:1px solid var(--hair);background:var(--paper3);}
.level .lv-text{padding:15px 16px;font-size:1.05rem;line-height:1.4;color:var(--ink);}
.level.selected{background:var(--block-bg);}
.level.selected .lv-num{background:var(--accent);color:var(--on-accent);}
.level.selected .lv-text{color:var(--block-fg);}
.dimintro{background:var(--paper2);border-bottom:2px solid var(--hair-strong);padding:16px 22px;}
.dimintro .di-tag{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);}
.dimintro .di-name{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:-.02em;font-size:1.25rem;margin:4px 0 4px;}
.dimintro p{font-size:1rem;color:var(--ink-dim);max-width:74ch;}

/* algemene message/fout-kaart (verlopen token e.d.) */
.notice{padding:30px 22px;border-bottom:2px solid var(--hair-strong);}
.notice h2{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:-.02em;font-size:1.6rem;margin-bottom:10px;}
.notice p{font-size:1.05rem;color:var(--ink-dim);line-height:1.55;max-width:64ch;margin-bottom:8px;}