/* RW Offerte Configurator. Alles staat onder .rwo, zodat het thema niet in de weg zit.
   Kleuren: pas --accent aan via Instellingen > RW Offerte. Lettertype: wordt van het thema overgenomen.
   Plakt het formulier achter een vaste (sticky) kop? Zet dan --rwo-sticky-top op de hoogte van die kop. */
.rwo{--paper:#F4F5F3;--card:#FFFFFF;--ink:#18242C;--steel:#586873;--line:#D3D8D5;
  --accent:#0F5F7D;--accent-ink:#FFFFFF;--accent-soft:#DCEBF0;--err:#B3261E;
  --wall:#E4E1DA;--wall-line:#D5D1C9;--floor:#C9CCC8;--frame:#9AA3A7;
  --f-head:inherit;--f-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  container-type:inline-size;max-width:1120px;margin:0 auto;color:var(--ink);font-family:inherit;font-size:15px;line-height:1.5;text-align:left}
.rwo *,.rwo *::before,.rwo *::after{box-sizing:border-box}
.rwo h2,.rwo h3{font-family:var(--f-head);font-weight:700;letter-spacing:0;text-transform:none;margin:0;line-height:1.15;color:var(--ink);text-wrap:balance}
.rwo p{margin:0}
.rwo button,.rwo input,.rwo select,.rwo textarea{font:inherit;color:inherit;letter-spacing:normal}
.rwo :focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.rwo [hidden]{display:none!important}
.rwo .errbar{margin-top:16px;padding:10px 14px;border:1.5px solid var(--err);border-radius:4px;color:var(--err);font-weight:500}
.rwo .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rwo .ralbar{max-width:340px;margin-bottom:10px}
.rwo .ralcount{font-size:13px;color:var(--steel);margin-top:8px}
.rwo .linkbtn{display:inline-block;background:none;border:0;border-radius:0;box-shadow:none;text-transform:none;letter-spacing:normal;padding:10px 0;margin-top:2px;min-height:44px;color:var(--accent);text-decoration:underline;font-weight:600;cursor:pointer}
.rwo .btn[disabled]{opacity:.6;cursor:wait}
.rwo .note a,.rwo .check a{color:var(--accent);text-decoration:underline}
.rwo .steps{list-style:none;margin:20px 0 0;padding:0;display:flex;gap:6px}
.rwo .steps li{flex:1;min-width:0}
.rwo .steps button{width:100%;text-align:left;background:none;border:0;border-top:3px solid var(--line);padding:8px 0 0;cursor:pointer;color:var(--steel);display:flex;flex-direction:column;gap:0}
.rwo .steps button .n{font-family:var(--f-mono);font-size:11px;letter-spacing:.08em}
.rwo .steps button .t{font-weight:500;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rwo .steps li.done button{border-top-color:var(--steel);color:var(--ink)}
.rwo .steps li.cur button{border-top-color:var(--accent);color:var(--ink)}
.rwo .steps li.cur .t{font-weight:600}
.rwo .steps button:disabled{cursor:default}
.rwo .shell{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;padding-block:24px 56px}
.rwo .side{display:flex;flex-direction:column;gap:16px;min-width:0}
@container (min-width:860px){
  .rwo .shell{grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:40px}
  .rwo .side{position:sticky;top:var(--rwo-sticky-top,16px);align-self:start;order:2}
}
@container (max-width:859px){
  .rwo .side{order:-1}
  .rwo .side .summary{display:none}
  .rwo .steps .t{display:none}
  .rwo .steps li.cur .t{display:block}
  .rwo .steps li.cur{flex:3}
}
.rwo .drawing{background:var(--card);border:1px solid var(--line);border-radius:4px;padding:8px}
.rwo .drawing svg{display:block;width:100%;height:auto;max-height:340px}
.rwo .drawing .cap{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font-family:var(--f-mono);font-size:11px;color:var(--steel);padding:2px 6px 4px;letter-spacing:.03em}
.rwo .s-wall{fill:var(--wall)}
.rwo .s-brick{stroke:var(--wall-line);stroke-width:1;fill:none}
.rwo .s-floor{fill:var(--floor)}
.rwo .s-jamb{fill:var(--frame)}
.rwo .s-dim{stroke:var(--steel);stroke-width:1;fill:none}
.rwo .s-dimtxt{fill:var(--ink);font-family:var(--f-mono);font-size:13px}
.rwo .s-person{fill:var(--steel);opacity:.4}
.rwo .summary{background:var(--card);border:1px solid var(--line);border-radius:4px;padding:14px 16px}
.rwo .summary h3,.rwo .sumbox h3{font-size:20px;margin-bottom:8px}
.rwo .summary dl,.rwo .sumbox dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:5px 14px;font-size:14px}
.rwo .summary dt,.rwo .sumbox dt{color:var(--steel)}
.rwo .summary dd,.rwo .sumbox dd{margin:0;font-weight:500;min-width:0;overflow-wrap:anywhere}
.rwo .mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.rwo .card{background:var(--card);border:1px solid var(--line);border-radius:4px;padding:24px}
@container (max-width:520px){
  .rwo .card{padding:18px 16px}
}
.rwo .eyebrow{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--steel)}
.rwo .card h2{font-size:30px;margin:4px 0 6px}
.rwo .lead{color:var(--steel);max-width:58ch;margin-bottom:20px}
.rwo .group{margin-top:22px}
.rwo .group:first-of-type{margin-top:0}
.rwo .glabel{display:block;font-weight:600;margin-bottom:2px}
.rwo .ghelp{display:block;color:var(--steel);font-size:13px;margin-bottom:8px}
.rwo .opts{display:flex;flex-wrap:wrap;gap:8px}
.rwo .opts.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.rwo .opt{position:relative;display:block}
.rwo .opt input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.rwo .opt .face{display:block;border:1.5px solid var(--line);border-radius:4px;padding:9px 14px;background:var(--card);font-weight:500;min-height:44px;line-height:1.3;transition:border-color .12s,background .12s}
.rwo .opt input:checked + .face{border-color:var(--accent);background:var(--accent-soft)}
.rwo .opt input:focus-visible + .face{outline:2px solid var(--accent);outline-offset:2px}
.rwo .opt input:disabled + .face{opacity:.45}
.rwo .opt input:disabled{cursor:not-allowed}
.rwo .opts.cards .face{padding:14px 16px}
.rwo .face b{display:block;font-family:var(--f-head);font-size:18px;font-weight:700;line-height:1.2}
.rwo .face small{display:block;color:var(--steel);font-weight:400;font-size:13px;margin-top:2px}
.rwo .opts.seg .face{min-width:48px;text-align:center;padding:9px 12px}
.rwo .swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px}
.rwo .sw .face{display:flex;flex-direction:column;gap:6px;padding:8px;min-height:0}
.rwo .sw .chip{display:block;height:34px;border-radius:2px;border:1px solid rgba(128,128,128,.35)}
.rwo .sw .nm{font-size:12px;line-height:1.2;font-weight:500}
.rwo .sw .nm span{display:block;font-family:var(--f-mono);font-weight:400;color:var(--steel);font-size:11px}
.rwo .fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@container (max-width:560px){
  .rwo .fields{grid-template-columns:minmax(0,1fr)}
}
.rwo .fields .full{grid-column:1/-1}
.rwo .field label,.rwo .field .lab{display:block;font-weight:500;margin-bottom:4px}
.rwo .field label i{color:var(--steel);font-style:normal;font-weight:400}
.rwo .in{display:block;width:100%;min-height:44px;padding:9px 12px;border:1.5px solid var(--line);border-radius:4px;background:var(--paper);font-size:16px}
.rwo textarea.in{min-height:96px;resize:vertical}
.rwo .in:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 2px var(--accent-soft)}
.rwo .unit{position:relative}
.rwo .unit .in{padding-right:48px;font-family:var(--f-mono)}
.rwo .unit::after{content:"mm";position:absolute;right:12px;top:50%;transform:translateY(-50%);font-family:var(--f-mono);font-size:12px;color:var(--steel);pointer-events:none}
.rwo .field.err .in{border-color:var(--err)}
.rwo .msg{display:none;color:var(--err);font-size:13px;margin-top:4px}
.rwo .field.err .msg,.rwo .msg.show{display:block}
.rwo input[type=range]{width:100%;accent-color:var(--accent);margin:8px 0 0}
.rwo .rangeinfo{display:flex;justify-content:space-between;font-family:var(--f-mono);font-size:11px;color:var(--steel)}
.rwo details.more{margin-top:18px;border-top:1px solid var(--line);padding-top:12px}
.rwo details.more summary{cursor:pointer;font-weight:600}
.rwo details.more .fields{margin-top:12px}
.rwo .check{display:flex;gap:10px;align-items:flex-start;cursor:pointer}
.rwo .check input{margin-top:4px;width:18px;height:18px;accent-color:var(--accent);flex:none}
.rwo .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.rwo .note{background:var(--accent-soft);border-radius:4px;padding:10px 14px;font-size:13px;color:var(--ink);margin-top:14px}
.rwo .files{margin-top:6px;font-size:13px;color:var(--steel)}
.rwo .nav{display:flex;justify-content:space-between;gap:12px;margin-top:28px;flex-wrap:wrap}
.rwo .btn{font-family:inherit;font-size:15px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;line-height:1.2;text-decoration:none;box-shadow:none;min-height:48px;padding:8px 26px 6px;border-radius:3px;border:1.5px solid var(--ink);background:none;cursor:pointer}
.rwo .btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.rwo .btn:hover{filter:brightness(1.07)}
.rwo .btn.ghost{border-color:var(--line);color:var(--steel)}
@container (min-width:860px){
  .rwo .done-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
}
.rwo .ref{font-family:var(--f-mono);font-size:15px;background:var(--accent-soft);display:inline-block;padding:3px 10px;border-radius:2px;margin:8px 0 14px}
.rwo .sumbox{border:1px solid var(--line);border-radius:4px;padding:14px 16px;margin-top:16px;background:var(--paper)}
.rwo .next{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:12px}
.rwo .next li{display:grid;grid-template-columns:28px 1fr;gap:10px}
.rwo .next .bul{font-family:var(--f-mono);font-size:12px;border:1.5px solid var(--accent);color:var(--accent);width:24px;height:24px;border-radius:50%;display:grid;place-items:center;margin-top:1px}
.rwo #sumInline{display:none}
@container (max-width:859px){
  .rwo #sumInline{display:block}
}
@media (prefers-reduced-motion:reduce){.rwo *{transition:none!important}}