/* Premiecheck België — app-CSS, gescopeerd onder .cpx (theme-header/-footer eromheen). */
.cpx{--navy:#3D405B;--navy7:#2F3148;--terra:#E07A5F;--terra-d:#B3582F;--sage:#81B29A;--sage-l:#E8F1ED;--line:#E3E5EE;--ink:#262839;--mute:#5F6275;--white:#fff;--soft:#F5F6FA;--red-l:#FBE6E0;--red-d:#8a3a26;font-family:Jost,system-ui,sans-serif;font-size:16px;line-height:1.55;color:var(--ink)}
.cpx *{box-sizing:border-box}
.cpx h1,.cpx h2,.cpx h3,.cpx h4{font-family:Strawford,"Inter Tight",system-ui,sans-serif;font-weight:500;color:var(--navy);margin:0;letter-spacing:-.01em}
.cpx button{font:inherit;cursor:pointer}
.cpx a{color:var(--navy)}
.cpx .wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.cpx .btn{background:var(--terra);color:#fff;border:0;border-radius:8px;padding:12px 20px;font-weight:500;font-size:15px;transition:background .15s;text-decoration:none;display:inline-block}
.cpx .btn:hover{background:var(--terra-d)}
.cpx .btn.ghost{background:transparent;color:var(--navy);border:1.5px solid var(--navy)}
.cpx .btn.ghost:hover{background:var(--sage-l)}
.cpx .btn.sm{padding:9px 14px;font-size:14px}
.cpx .btn:disabled{background:#DCDEE8;color:#8b8c99;cursor:not-allowed}
.cpx .cta-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.cpx .sec{padding:44px 0}
.cpx .sec.soft{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cpx .grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin-top:22px}
.cpx .how{border:1px solid var(--line);border-radius:12px;padding:20px}
.cpx .how .n{width:30px;height:30px;border-radius:50%;background:var(--sage-l);color:#2f6b50;display:grid;place-items:center;font-weight:500;margin-bottom:10px}
.cpx .how h3{font-size:17px;margin-bottom:4px}
.cpx .how p{margin:0;color:var(--mute);font-size:15px}
.cpx .wiz{max-width:780px;margin:0 auto;padding:34px 20px 46px}
.cpx .prog{display:flex;align-items:center;gap:10px;margin-bottom:26px}
.cpx .prog .bar{flex:1;height:6px;background:var(--line);border-radius:99px;overflow:hidden}
.cpx .prog .bar i{display:block;height:100%;background:var(--sage);border-radius:99px;transition:width .3s}
.cpx .prog span{font-size:13px;color:var(--mute);white-space:nowrap}
.cpx .q h2{font-size:clamp(24px,3vw,32px);line-height:1.15;margin-bottom:6px}
.cpx .q .sub{color:var(--mute);margin:0 0 22px}
.cpx .opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.cpx .opt{border:1.5px solid var(--line);border-radius:12px;padding:16px;background:#fff;text-align:left;display:flex;gap:12px;align-items:flex-start;transition:border-color .15s,background .15s}
.cpx .opt:hover{border-color:var(--navy)}
.cpx .opt.on{border-color:var(--sage);background:var(--sage-l)}
.cpx .opt .ic{font-size:26px;line-height:1}
.cpx .opt b{display:block;font-weight:500;color:var(--navy);font-family:"Inter Tight"}
.cpx .opt small{color:var(--mute);font-size:13.5px;line-height:1.35;display:block;margin-top:2px}
.cpx .opt .chk{margin-left:auto;width:22px;height:22px;border-radius:6px;border:1.5px solid #C5C8D6;flex:none;display:grid;place-items:center;color:#fff;font-size:14px}
.cpx .opt.on .chk{background:var(--sage);border-color:var(--sage)}
.cpx .opt.radio .chk{border-radius:50%}
.cpx .navrow{display:flex;justify-content:space-between;align-items:center;margin-top:28px;gap:12px}
.cpx .back{background:none;border:0;color:var(--mute);padding:8px 0}
.cpx .back:hover{color:var(--navy)}
.cpx .hint{background:var(--sage-l);border-radius:12px;padding:16px 18px;margin-top:18px;font-size:15px}
.cpx .hint h4{margin:0 0 6px;font-size:16px}
.cpx .sizer{border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin-bottom:12px}
.cpx .sizer .top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.cpx .sizer output{font-family:"Inter Tight";font-size:20px;color:var(--navy)}
.cpx .sizer input[type=range]{width:100%;accent-color:var(--terra);margin:10px 0 2px}
.cpx .sizer label.dk{font-size:14px;color:var(--mute);display:flex;gap:8px;align-items:center;margin-top:6px}
.cpx .step{display:flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin-top:12px}
.cpx .step .pm{display:flex;align-items:center;gap:12px;margin-left:auto}
.cpx .step .pm button{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--navy);background:#fff;color:var(--navy);font-size:18px;line-height:1}
.cpx .step .pm b{font-family:"Inter Tight";font-size:20px;min-width:18px;text-align:center;font-weight:500}
.cpx .doc{background:#fff;border:1px solid #D3D6E2;border-radius:8px;padding:14px 16px;font-size:12.5px;color:#55566b;margin-top:12px;max-width:440px;box-shadow:0 2px 0 #E3E5EE}
.cpx .doc .hd{display:flex;justify-content:space-between;border-bottom:1px solid #E3E5EE;padding-bottom:6px;margin-bottom:8px;font-weight:500;color:#33344a}
.cpx .doc .ln{display:flex;justify-content:space-between;padding:3px 0}
.cpx .doc .ln.hi{background:var(--sage-l);outline:2px solid var(--sage);border-radius:4px;padding:5px 6px;margin:4px -6px;color:#2b2d42;font-weight:500}
.cpx .doc .tag{display:inline-block;background:var(--navy);color:#fff;border-radius:4px;font-size:11px;padding:1px 6px;margin-left:6px}
.cpx .gate{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:start}
.cpx .teaser{background:var(--navy);color:#fff;border-radius:14px;padding:22px}
.cpx .teaser h3{color:#fff;font-size:20px;margin-bottom:12px}
.cpx .teaser .row{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid rgba(255,255,255,.14);font-size:15px}
.cpx .blur{filter:blur(7px);user-select:none}
.cpx .teaser .lock{margin-top:14px;font-size:14px;color:#F2CC8F}
.cpx .form label{display:block;font-size:14px;color:var(--navy);margin:0 0 4px;font-weight:500}
.cpx .form input{width:100%;padding:11px 12px;border:1.5px solid #C5C8D6;border-radius:8px;font:inherit;margin-bottom:12px;background:#fff}
.cpx .form input:focus{outline:none;border-color:var(--navy)}
.cpx .two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cpx .fine{font-size:13px;color:var(--mute);margin-top:10px}
.cpx .fine.ok{color:#2f6b50}.fine.err{color:var(--red-d)}
.cpx .total{background:var(--sage-l);border:1.5px solid var(--sage);border-radius:14px;padding:22px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;align-items:center}
.cpx .total .amt{font-family:"Inter Tight";font-size:clamp(34px,5vw,48px);color:var(--navy);line-height:1}
.cpx .total small{color:#3c6b56;display:block;margin-top:6px}
.cpx .card{border:1px solid var(--line);border-radius:14px;padding:20px;margin-top:14px;background:#fff}
.cpx .card .hd{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}
.cpx .card h3{font-size:19px}
.cpx .card .amt{font-family:"Inter Tight";font-size:24px;color:var(--navy);white-space:nowrap}
.cpx .pill{display:inline-block;font-size:12px;border-radius:999px;padding:2px 10px;margin-top:4px;border:0}
.cpx .pill.ok{background:var(--sage-l);color:#2f6b50}
.cpx .pill.no{background:var(--red-l);color:var(--red-d)}
.cpx .pill.chg{background:#E9EAF3;color:var(--navy)}
.cpx .card ul{margin:12px 0 0;padding-left:18px;color:#4a4c63;font-size:15px}
.cpx .card .src{font-size:13px;color:var(--mute);margin-top:10px}
.cpx .help{background:var(--navy);color:#fff;border-radius:14px;padding:24px;margin-top:18px;display:flex;gap:18px;justify-content:space-between;align-items:center;flex-wrap:wrap}
.cpx .help h3{color:#fff;font-size:21px;margin-bottom:4px}
.cpx .help p{margin:0;color:#d5d6e4;max-width:440px}
.cpx .tabs{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 6px}
.cpx .tabs button{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:8px 16px;color:var(--navy)}
.cpx .tabs button.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.cpx .checked{font-size:13px;color:var(--mute)}
.cpx .note{border-left:3px solid var(--sage);background:var(--sage-l);padding:10px 14px;font-size:13.5px;color:#2f4a3e;margin-top:16px}
.cpx .note.warn{border-color:var(--terra);background:var(--red-l);color:var(--red-d)}
.cpx .preview-badge{position:fixed;left:12px;bottom:12px;background:#1f2033;color:#F2CC8F;font-size:12px;padding:6px 10px;border-radius:8px;z-index:9;opacity:.9}
@media(max-width:640px){.cpx .two{grid-template-columns:1fr}.cpx .gate{grid-template-columns:1fr}}
/* theme-.btn neutraliseren binnen de app */
.cpx .btn{height:auto;min-height:0;line-height:1.3;white-space:normal;gap:0;box-shadow:none;font-family:inherit}
.cpx .btn:hover{transform:none}
.cpx p{margin-top:0}
.cpx h2{font-size:clamp(24px,3vw,32px)}
.cpx h3{font-size:19px}
.cpx .sec.soft{background:var(--soft)}
.cpx .cta-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.cpx-foot{padding:22px 20px 34px;border-top:1px solid var(--line);font-size:13px;color:var(--mute);text-align:center}
.cpx-foot:empty{display:none}
/* Hero van de pagina: tweede knop als secundaire (omlijnde) CTA. */
.cralux-premiecheck .cralux-hero__ctas .btn--secondary{background:transparent;color:var(--c-navy,#3D405B);border:1.5px solid var(--c-navy,#3D405B);box-shadow:none}
.cralux-premiecheck .cralux-hero__ctas .btn--secondary:hover{background:var(--c-sage-100,#E8F1ED);border-color:var(--c-navy,#3D405B)}
/* Hero hoger dan de dienstenpagina's (416px): de kaart draagt hier H1 + twee knoppen
   en schoof anders onder de header (overlap). Kaart blijft onderaan verankerd (bottom:40px),
   dus kaarttop = header + ≥ 40px zolang de kaart ≤ 400px hoog is. */
@media (min-width: 769px){
  body.cralux-premiecheck .wp-block-cralux-hero.is-style-overlay:has(.cralux-hero__card--white){height:calc(var(--header-height,168px) + 480px)} /* vaste hoogte: de .container erft height:100% en is het anker (bottom:40px) van de kaart */
}
/* Resultaat: theme-blok cralux/cta-banner (server-gerenderd) — offerte met oranje knop, simulator standaard (wit omlijnd). */
.cpx .cpx-cta .section:has(> .container){padding-block:0}
.cpx .cpx-cta .cta-banner{margin-block:14px}
.cpx .cpx-cta .cta-banner__heading{font-size:30px}
.cpx .cpx-cta-off .cta-banner__btn{background:var(--terra);border-color:var(--terra)}
.cpx .cpx-cta-off .cta-banner__btn:hover,.cpx .cpx-cta-off .cta-banner__btn:focus-visible{background:var(--terra-d);border-color:var(--terra-d)}
/* Theme-lekken in de app: kaarttekst links, koppen navy; emoji-icoon vaste breedte (Windows-emoji's zijn breder). */
.cpx .card{text-align:left}
.cpx .card h3,.cpx .help h3{margin-top:0}
.cpx .card h3{color:var(--navy)}
.cpx .opt .ic{flex:0 0 34px;width:34px;text-align:center}