/* ══════════════════════════════════════════════════════════════
   RPB-MOTOR: campagne-jas over de merkboek-motor.
   Wordt NA de paginastijl geladen en override't de design-tokens.
   Oude vormgeving: motor-klassiek/ + git-tag motor-klassiek.
   ══════════════════════════════════════════════════════════════ */

:root{
  --paper:#0b0d12;
  --paper-2:#14161b;
  --ink:#ffffff;
  --ink-soft:rgba(255,255,255,.65);
  --accent:#ff5a1f;
  --accent-2:#ff5a1f;
  --line:rgba(255,255,255,.12);
  --card:#14161b;
  --cream:#f7f3ea;
  --shadow:0 18px 50px rgba(0,0,0,.5);
}

body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  background:var(--paper);
  color:var(--ink);
}

/* Georgia-serif wordt overal Inter-blokletter */
.serif, h1, h2, h3,
.intro h1, .intro .claim, .qquote, .otext,
.claim, .accent, .bl-1, .pq p,
.r-name, .r-tag, .rv-name, .rv-tag, .gp-nr{
  font-family:'Inter',-apple-system,sans-serif !important;
  font-style:normal !important;
}
.intro h1, .r-name, .rv-name{
  font-weight:900 !important;
  text-transform:uppercase;
  letter-spacing:-.025em !important;
  line-height:.98 !important;
}
.intro h1 em{font-style:normal;color:var(--accent)}
.r-tag, .rv-tag, .intro .claim, .qquote, .otext{font-weight:700 !important}
.gp-nr{font-weight:900 !important}

/* knoppen: oranje pills */
.btn{
  background:var(--accent) !important;
  color:#fff !important;
  border-radius:999px !important;
  font-weight:800 !important;
  letter-spacing:.03em;
}
.btn:hover{background:#ff7442 !important;transform:scale(1.03)}

/* labels en accentregels */
.est, .olab, .gp-lab, .rv-pre, .r-est, .ab-lab, .tn-lbl{color:var(--accent) !important}

/* kaarten en vlakken */
.axisbars, .opener, .topnext, .qcard, .card, .keuze, .choice{
  background:var(--card);
  border-color:var(--line);
}

/* groeipad-stepcard: was inkt/goud, wordt paneel met oranje */
.groeipad{background:var(--paper-2) !important;border:1px solid var(--line);color:var(--ink) !important}
.gp-lab, .gp-nr{color:var(--accent) !important}

/* reveal-overlay */
.reveal{background:var(--paper) !important}
.reveal .rv-pre{color:var(--accent) !important}
.reveal .rv-emblem{border-color:var(--accent) !important}

/* embleem: multiply werkt niet op donker; witte schijf eronder */
.r-emblem{
  mix-blend-mode:normal !important;
  background:var(--cream);
  border-radius:50%;
  padding:16px;
}

/* de type-plaat boven de uitslag: volle breedte, campagnebeeld */
.type-plaat{
  width:100vw;
  margin-left:calc(50% - 50vw);
  max-height:56vh;
  object-fit:cover;
  object-position:center 30%;
  display:block;
  margin-bottom:34px;
}
@media(max-width:700px){
  .type-plaat{max-height:none;height:auto;object-fit:unset}
}

/* uitslag-blokken die wit-op-wit werden: donkere panelen van maken */
.play{
  background:transparent !important;
  border:none;
  color:var(--ink) !important;
}
.r-reframe{
  background:rgba(255,90,31,.1) !important;
  border-left:3px solid var(--accent);
  color:var(--ink) !important;
}
.gp-t{color:var(--ink) !important}
.rf-link{color:var(--ink) !important;border-bottom:2px solid var(--accent)}
.play .p-kop, .play b, .play h3{color:var(--ink)}
.play .p-lab, .r-shadow .rb-lab{color:var(--accent) !important}

/* ── VARIATIE-SLAG UITSLAG: ritme zoals de home, geen zwarte kolom ── */

/* oud embleem weg: de type-plaat is het beeld */
.r-emblem{display:none !important}

/* naam: het statement */
.r-name{font-size:clamp(46px,9vw,92px) !important;margin-top:6px}
.r-name::after{content:'.';color:var(--accent)}
.r-tag{font-size:clamp(18px,2.2vw,24px) !important;color:var(--ink-soft) !important}

/* signatuur-openingszin: volle oranje band, zoals op de home */
.opener{
  display:block !important;
  width:100vw;margin-left:calc(50% - 50vw);
  background:var(--accent) !important;
  border:none !important;border-radius:0 !important;
  padding:46px 6vw !important;
  margin-top:38px;margin-bottom:38px;
}
.opener .olab{color:#14120f !important;font-weight:800}
.opener .otext{
  display:block;margin-top:10px;
  color:#fff !important;font-weight:800 !important;
  font-size:clamp(20px,2.8vw,32px) !important;line-height:1.25 !important;
}

/* kern/kracht/durf: genummerd, redactioneel */
#result{counter-reset:blok}
.r-block{
  counter-increment:blok;
  border-top:1px solid var(--line);
  padding-top:20px;margin-bottom:34px !important;
}
.r-block h3{display:flex;align-items:baseline;gap:12px;font-size:12px !important}
.r-block h3::before{
  content:counter(blok,decimal-leading-zero);
  font-weight:900;font-size:26px;color:var(--accent);letter-spacing:-.02em;
}
.r-block p{font-size:clamp(17px,1.9vw,20px) !important;line-height:1.6}

/* de schaduw: crème band als contrastmoment */
.r-block.r-shadow{
  width:100vw;margin-left:calc(50% - 50vw);
  background:var(--cream) !important;
  border:none !important;border-top:none;border-radius:0 !important;
  padding:46px 6vw !important;
  margin-top:6px;margin-bottom:40px !important;
}
.r-block.r-shadow h3{color:var(--accent) !important}
.r-block.r-shadow p{color:#1c1a16 !important}

/* playbook: kaartjes in twee kolommen */
.play{padding:0 !important;box-shadow:none !important}
.play .pstep{color:var(--accent) !important;font-weight:800}
.play .ptitle{
  font-weight:900 !important;text-transform:uppercase;letter-spacing:-.02em;
  font-size:clamp(26px,3.4vw,40px) !important;margin:6px 0 22px;
}
.play .pitem{
  background:var(--paper-2);border:1px solid var(--line);border-radius:14px;
  padding:22px 24px;margin-bottom:0;break-inside:avoid;
}
.play{column-count:2;column-gap:18px}
.play .pstep,.play .ptitle{column-span:all}
.play .pitem{margin-bottom:18px;display:inline-block;width:100%}
.play .pk{color:var(--accent) !important;font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:11px}
.play .pv{color:var(--ink);font-size:15.5px;margin-top:6px}
@media(max-width:640px){ .play{column-count:1} }

/* ── TERUGKERENDE BEZOEKER: één boodschap, geen dubbele start ── */
#intro.terug > div > *:not(.welkom){display:none !important}
#intro.terug .welkom{
  border:none;background:transparent;padding:0;margin:0;
}
#intro.terug .wk-lbl{font-size:13px;letter-spacing:.3em;margin-bottom:14px}
#intro.terug .wk-p{
  font-weight:900;font-size:clamp(34px,6vw,68px);line-height:1;
  text-transform:uppercase;letter-spacing:-.025em;margin-bottom:28px;max-width:20ch;
}
#intro.terug .wk-p b{color:var(--accent)}
#intro.terug .wk-btn{padding:17px 36px;font-size:16px}
#intro.terug .wk-next{font-size:15px}
#intro.terug .wk-redo{
  display:block;margin-top:26px;font-size:13.5px;color:var(--ink-soft);
  cursor:pointer;text-decoration:underline;text-underline-offset:3px;
}
#intro.terug .wk-redo:hover{color:var(--ink)}

/* ── MERKBOEK (bijbel): boek-delen als crème papier in de donkere site ── */
.mark, .pillar, .bl-card, .koers-item, .deelband{
  background:var(--cream) !important;
}
.mark *, .pillar *, .bl-card *, .koers-item *, .deelband *, .scher *{color:#1c1a16 !important}
.mark .m-d, .pillar .p-ex{color:#5a5348 !important}
.pillar .p-x, .bl-card .bl-gift, .koers-item .ki-lbl{color:var(--accent) !important}
.scher{background:var(--cream) !important}
.appcta{background:var(--paper-2) !important;border:1px solid var(--line)}
.appcta *{color:var(--ink)}
.appcta .appcta-sub{color:var(--ink-soft) !important}

/* donkere kaarten (cover-citaat, stepcards): paneel-tint + lichte tekst */
.co-card, .stepcard{background:var(--paper-2) !important;border:1px solid var(--line)}
.co-card *, .stepcard *{color:var(--ink)}
.co-card .co-t, .stepcard .s-t{color:var(--ink) !important}
.stepcard .gt, .co-card .gt{color:var(--accent) !important}

/* kernwaarden: chips op donker */
.chip{
  background:var(--paper-2) !important;
  color:var(--ink) !important;
  border-color:var(--line) !important;
}
.chip:hover{border-color:var(--accent) !important}
.chip.sel{
  background:rgba(255,90,31,.16) !important;
  border-color:var(--accent) !important;
  color:#fff !important;
}
.chip.sel::before{color:var(--accent) !important}

/* ── GOUD-VEEG: laatste oude-vormgeving eruit (icoontjes blijven) ── */
.co-lbl, .co-btn, .s-lbl, .gnr, .rv-as span, .rv-as b, .qb-quote .accent{color:var(--accent) !important}
.rv-balk span{background:var(--accent) !important}
.ed-btn{
  background:var(--accent) !important;color:#fff !important;
  border-radius:999px !important;font-weight:800 !important;
}
.ed-btn:hover{background:#ff7442 !important}
.qb-quote{
  font-family:'Inter',sans-serif !important;font-style:normal !important;
  font-weight:800 !important;color:#fff !important;text-shadow:none !important;
}
.gnr{font-family:'Inter',sans-serif !important;font-weight:900 !important}

/* foutmeldingen leesbaar op donker */
.naamfout{color:#ff8a75 !important}
.naamfield.fout, .field input.leeg{border-color:#ff8a75 !important}

/* grote oude emblemen weg; kleine icoontjes blijven gewoon staan */
.cover-emblem{display:none !important}
.rv-emblem{display:none !important}

/* bijbel-cover in blokletters */
.cover .name, .cover .meta span:first-child{
  font-family:'Inter',sans-serif !important;font-style:normal !important;font-weight:900 !important;
}
.cover .name{color:var(--accent) !important}
.cover p{font-family:'Inter',sans-serif !important;font-style:normal !important;font-weight:500}

/* ── UX-RONDE: quotes weg, vragen in een venster, scherpstellen uit de flow ── */
.qquote{display:none !important}

/* de vraag met antwoorden in een venster met oranje rand */
.qvenster{
  background:var(--paper-2);
  border:2px solid var(--accent);
  border-radius:18px;
  padding:38px 36px;
}

/* kernwaarden: ronde-teller weg, kaarten en filters leesbaar */
#rstep{display:none !important}
.kcard{
  background:var(--paper-2) !important;
  color:var(--ink) !important;
  border-color:var(--line) !important;
}
.kcard:hover{border-color:var(--accent) !important}
.kcard.goud{
  border-color:var(--accent) !important;
  box-shadow:0 0 0 1.5px var(--accent), 0 14px 40px rgba(255,90,31,.25) !important;
}
.kcard.goud::before{color:var(--accent) !important}
.filters{background:var(--cream) !important}
.filters *{color:#1c1a16 !important}
.filters .fk{color:var(--accent) !important}

/* (scherpstellen is inmiddels uit de HTML zelf; de verbergregel verborg anders "Merkboek") */

/* ── EINDCHECK-FIXES: invulvelden en deel-landing leesbaar op de campagnejas ── */
.naamfield, .custom input, .jb-eigen{
  background:#0f1115 !important;color:#fff !important;
  border:1.5px solid rgba(255,255,255,.28) !important;border-radius:12px !important;
}
.naamfield::placeholder, .custom input::placeholder, .jb-eigen::placeholder{color:rgba(255,255,255,.45) !important}
.naamfield:focus, .custom input:focus, .jb-eigen:focus{border-color:var(--accent) !important;outline:none !important}
.custom button{background:var(--accent) !important;color:#fff !important;border:none !important;border-radius:999px !important;font-weight:800 !important}
.fasepill{background:transparent !important;color:#fff !important;border:1.5px solid rgba(255,255,255,.35) !important}
.fasepill.on{background:var(--accent) !important;border-color:var(--accent) !important;color:#fff !important}
.topnext.sharedcta{background:#0f1115 !important;border-color:rgba(255,255,255,.15) !important}

/* topbalk */
.top{border-bottom-color:var(--line)}
.top .mono{color:var(--ink)}
.pbnav a{color:var(--ink-soft)}
.pbnav a:hover{color:var(--ink)}
.pbnav a.cur{color:var(--accent);font-weight:800}
.bl-1{font-weight:900 !important;letter-spacing:.02em !important}
.pq p{font-weight:700 !important}
.pq .accent{color:var(--accent)}