/*
 * De analysepagina. Leunt op datarecup-home.css; hier staat alleen wat deze
 * pagina eigen is.
 */

.dr-hero--kort .dr-hero__inner{padding-block:74px 78px}
.dr-hero--kort .dr-hero__title{max-width:19ch}

/* ── wat u nodig hebt ────────────────────────────────────── */
.dr-klaar{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:8px}
.dr-klaar__wel,
.dr-klaar__niet{background:#fff;border:1px solid var(--line,rgba(23,40,155,.13));
  border-radius:16px;padding:26px 28px}
.dr-klaar__wel{border-top:3px solid var(--blue,#17289B)}
.dr-klaar__niet{border-top:3px solid var(--muted,#5A607A)}

.dr-klaar b{display:block;font-family:'Archivo',sans-serif;font-weight:700;
  font-size:17px;margin-bottom:14px}
.dr-klaar ul{margin:0;padding:0;list-style:none;display:grid;gap:9px}
.dr-klaar li{position:relative;padding-left:26px;font-size:15.5px;line-height:1.55;
  color:var(--ink,#1A1D2E)}
.dr-klaar__wel li::before{content:"\2713";position:absolute;left:0;top:0;
  color:var(--blue,#17289B);font-weight:700}
.dr-klaar__niet li{color:var(--muted,#5A607A)}
.dr-klaar__niet li::before{content:"\2013";position:absolute;left:0;top:0;
  color:var(--muted,#5A607A)}

.dr-klaar__slot{margin-top:22px;font-size:16px;color:var(--muted,#5A607A);
  line-height:1.6;max-width:72ch}

/* ── de twee fasen ───────────────────────────────────────── */
.dr-fase{display:grid;grid-template-columns:72px 1fr;gap:24px;align-items:start;
  background:#fff;border:1px solid var(--line,rgba(23,40,155,.13));
  border-radius:18px;padding:28px 30px}
.dr-fase__no{display:grid;place-items:center;width:56px;height:56px;border-radius:14px;
  background:var(--blue,#17289B);color:#fff;
  font-family:'Archivo',sans-serif;font-weight:800;font-size:22px;letter-spacing:-.02em}
.dr-fase__txt b{display:block;font-family:'Archivo',sans-serif;font-weight:700;
  font-size:20px;margin-bottom:8px}
.dr-fase__txt p{margin:0 0 12px;font-size:16px;line-height:1.65;
  color:var(--ink,#1A1D2E);max-width:70ch}
.dr-fase__kost{display:inline-block;font-family:'IBM Plex Mono',monospace;font-size:12.5px;
  letter-spacing:.05em;padding:6px 13px;border-radius:99px;
  background:rgba(23,40,155,.07);color:var(--blue,#17289B)}

/* De beslissing tussen de fasen: een streep met tekst erop. */
.dr-beslis{display:flex;align-items:center;gap:18px;margin:6px 0;padding:0 30px}
.dr-beslis::before,
.dr-beslis::after{content:"";flex:1;height:1px;
  background:var(--line,rgba(23,40,155,.2))}
.dr-beslis span{font-family:'Syne',sans-serif;font-weight:600;font-size:14px;
  color:var(--blue,#17289B);text-align:center}

/* ── de drie keuzes na de analyse ────────────────────────── */
.dr-keuzes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:8px}
.dr-keuze-kaart{background:#fff;border:1px solid var(--line,rgba(23,40,155,.13));
  border-top:3px solid var(--line,rgba(23,40,155,.13));border-radius:16px;
  padding:24px 26px;display:flex;flex-direction:column;gap:7px}
.dr-keuze-kaart__prijs{font-family:'Archivo',sans-serif;font-weight:800;font-size:22px;
  letter-spacing:-.02em;color:var(--ink,#1A1D2E)}
.dr-keuze-kaart__prijs--gratis{color:var(--blue,#17289B)}
.dr-keuze-kaart b{font-family:'Archivo',sans-serif;font-weight:700;font-size:17px}
.dr-keuze-kaart span:last-child{font-size:15px;color:var(--muted,#5A607A);line-height:1.55}

/* ── de kleine lettertjes, groot genoeg ──────────────────── */
.dr-klein{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.dr-klein__item{background:#fff;border:1px solid var(--line,rgba(23,40,155,.13));
  border-left:3px solid var(--blue,#17289B);border-radius:0 14px 14px 0;
  padding:22px 26px}
.dr-klein__item b{display:block;font-family:'Archivo',sans-serif;font-weight:700;
  font-size:17px;margin-bottom:6px}
.dr-klein__item span{font-size:15px;color:var(--muted,#5A607A);line-height:1.6}

/* De garantie apart: dat is een argument, geen voetnoot. */
.dr-klein__item--uit{border-left-color:var(--cyan,#3BA6D3);
  background:linear-gradient(180deg,rgba(59,166,211,.06) 0%,#fff 60%)}

.dr-klein__prijs{margin-top:24px;font-size:16px;color:var(--ink,#1A1D2E)}
.dr-klein__prijs a{color:var(--blue,#17289B);text-decoration:underline;
  text-underline-offset:3px}

/* de oude kopstrook weg */
.dr-analyse #elheader{height:auto;min-height:0;background:#fff;border-bottom:none}

@media (max-width:1000px){
  .dr-klaar,.dr-klein{grid-template-columns:1fr}
  .dr-keuzes{grid-template-columns:1fr}
  .dr-fase{grid-template-columns:1fr;gap:16px}
  .dr-beslis{padding:0}
}