/* ===== Case Hypotheekexpert Nederland — compact blok (Google Ads-pagina) en casepagina =====
   Bouwt op tokens.css en de google-ads-stijlen (.sec, .widget, .wlabel, .hl, .btn, .rv).
   Getallen: aanvragen absoluut, kosten per aanvraag en budget alleen relatief (besluit 8 okt 2026). */

/* ---- resultaten: groot cijfer naast een zin ---- */
.case-stats{margin:var(--s3) 0 0;border-top:1px solid rgba(25,0,0,.12);}
.case-stat{display:grid;grid-template-columns:7.2rem minmax(0,1fr);gap:var(--s2);align-items:baseline;padding:var(--s2) 0;border-bottom:1px solid rgba(25,0,0,.12);margin:0;}
.case-stat dt{font-weight:900;font-size:clamp(2rem,1.4vw + 1.5rem,2.75rem);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;}
.case-stat dd{margin:0;font-weight:700;font-size:17px;line-height:1.3;}
.case-fine{font-size:14px;line-height:1.5;color:color-mix(in srgb,var(--maroon) 64%,var(--white));margin-top:var(--s2);}

/* ---- knop naar de hele case: bordeaux, naast de limegroene hoofdknop ---- */
.case-btn{display:inline-flex;align-items:center;gap:12px;margin-top:var(--s3);min-height:48px;padding:15px 28px;background:var(--maroon);color:var(--white);font-weight:800;font-size:15px;text-decoration:none;transition:background .2s var(--ease),transform .2s var(--ease);}
.case-btn svg{color:var(--lime);transition:transform .2s var(--ease);}
.case-btn:hover{background:var(--burgundy);transform:translateY(-2px);}
.case-btn:hover svg{transform:translateX(4px);}
.case-btn:focus-visible{outline:3px solid var(--purple);outline-offset:3px;}

/* ---- vergelijking sep 2025 → sep 2026 in balken ---- */
.case-bars{display:grid;grid-template-columns:4.6rem minmax(0,1fr) 3.4rem;gap:10px 14px;align-items:center;margin:0;}
.case-bars .grp{grid-column:1/-1;font-weight:800;font-size:15px;margin:var(--s2) 0 0;}
.case-bars .grp:first-child{margin-top:0;}
.case-bars .mnd{font-size:13px;color:color-mix(in srgb,var(--maroon) 64%,var(--white));}
.case-bars .trk{height:24px;}
.case-bars .trk i{display:block;height:100%;transform-origin:left center;transition:transform 1.1s var(--ease);}
.case-bars .was{background:color-mix(in srgb,var(--maroon) 13%,var(--white));}
.case-bars .nu-aanvragen{background:var(--purple);}
.case-bars .nu-budget{background:var(--burgundy);}
.case-bars .val{font-weight:900;font-size:18px;text-align:right;font-variant-numeric:tabular-nums;}
.case-bars .val.licht{font-weight:700;font-size:15px;color:color-mix(in srgb,var(--maroon) 64%,var(--white));}
.case-compare .wnote{font-size:13px;line-height:1.45;margin-top:var(--s2);color:color-mix(in srgb,var(--maroon) 64%,var(--white));}
@media(prefers-reduced-motion:reduce){.case-bars .trk i{transition:none;}}

/* ===== casepagina: rustig document in de stijl van briefing en concept (9 okt 2026) ===== */
.case-doc-page{background:var(--white);}
.cd{padding:150px var(--gutter) 0;}
.cd-doc{max-width:920px;margin:0 auto;color:var(--maroon);}
.cd-crumb{display:flex;gap:8px;font-size:13px;font-weight:700;margin:0 0 28px;color:color-mix(in srgb,var(--maroon) 55%,var(--white));}
.cd-crumb a{color:var(--purple-ink);text-decoration:none;}
.cd-crumb a:hover{text-decoration:underline;}
.cd-crumb a:focus-visible{outline:2px solid var(--purple);outline-offset:3px;}
.cd-eye{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--purple-ink);margin:0 0 14px;}
.cd-h1{font-size:clamp(2.125rem,2.6vw + 1.2rem,3.5rem);font-weight:800;line-height:1.05;letter-spacing:-.025em;margin:0 0 22px;text-wrap:balance;}
.cd-mark{background:linear-gradient(180deg,transparent 58%,var(--lime) 58%,var(--lime) 92%,transparent 92%);padding:0 2px;}
.cd-h2{font-size:clamp(1.625rem,1.3vw + 1.2rem,2.25rem);font-weight:800;line-height:1.1;letter-spacing:-.02em;margin:0 0 14px;text-wrap:balance;}
.cd-lead{font-size:17px;line-height:1.6;max-width:62ch;margin:0;color:color-mix(in srgb,var(--maroon) 72%,var(--white));}
.cd-meta{font-size:13px;margin:22px 0 0;color:color-mix(in srgb,var(--maroon) 60%,var(--white));}
.cd-meta span{margin:0 6px;}
.cd-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin-top:36px;padding:30px 32px;background:color-mix(in srgb,var(--purple) 12%,var(--white));border-radius:16px;}
.cd-results h2{font-size:clamp(1.125rem,.5vw + 1rem,1.375rem);font-weight:800;line-height:1.2;margin:0 0 8px;}
.cd-results p{font-size:15px;line-height:1.55;margin:0;color:color-mix(in srgb,var(--maroon) 72%,var(--white));}
.cd-results .cd-num{font-size:clamp(2.25rem,1.6vw + 1.7rem,3rem);font-weight:900;line-height:1;letter-spacing:-.03em;color:var(--purple-ink);margin:0 0 12px;font-variant-numeric:tabular-nums;}
.cd-note{font-size:13px;margin:12px 0 0;color:color-mix(in srgb,var(--maroon) 55%,var(--white));}
.cd-sec{border-top:1px solid rgba(25,0,0,.12);margin-top:56px;padding-top:44px;}
.cd-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin:24px 0 0;padding:0;list-style:none;}
.cd-cols > *{border-top:2px solid var(--purple);padding-top:14px;}
.cd-cols h3{font-size:16px;font-weight:800;margin:0 0 6px;}
.cd-cols p{font-size:15px;line-height:1.55;margin:0;color:color-mix(in srgb,var(--maroon) 72%,var(--white));}
.cd-steps span{display:block;font-size:12px;font-weight:800;color:var(--purple-ink);margin-bottom:8px;}
.cd-choices{list-style:none;padding:0;margin:24px 0 0;}
.cd-choices li{display:grid;grid-template-columns:48px minmax(0,1fr);gap:12px;padding:16px 0;}
.cd-choices li + li{border-top:1px solid rgba(25,0,0,.08);}
.cd-choices span{font-size:20px;font-weight:900;color:var(--purple-ink);line-height:1.25;}
.cd-choices h3{font-size:17px;font-weight:800;margin:0 0 6px;}
.cd-choices p{font-size:15px;line-height:1.6;margin:0;max-width:66ch;color:color-mix(in srgb,var(--maroon) 72%,var(--white));}
.cd-card{background:#fff;border:1px solid rgba(25,0,0,.1);border-radius:14px;padding:20px 22px 18px;margin:0;}
.cd-card-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 20px;font-size:13px;font-weight:800;margin-bottom:10px;}
.cd-card-head > span:nth-child(2){font-weight:600;color:color-mix(in srgb,var(--maroon) 55%,var(--white));}
.cd-card svg{display:block;width:100%;height:auto;}
.cd-card figcaption{font-size:13px;line-height:1.5;margin-top:10px;color:color-mix(in srgb,var(--maroon) 58%,var(--white));}
.cd-chart{margin-top:24px;}
.cd-chart .svg-m{display:none;}
.cd-duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:20px;margin-top:20px;}
.cd-table{width:100%;border-collapse:collapse;}
.cd-table th,.cd-table td{padding:12px 0;border-top:1px solid rgba(25,0,0,.08);vertical-align:baseline;}
.cd-table tr:first-child th,.cd-table tr:first-child td{border-top:0;}
.cd-table th{text-align:left;font-size:14px;font-weight:600;}
.cd-table th small{display:block;font-size:12px;font-weight:500;color:color-mix(in srgb,var(--maroon) 55%,var(--white));}
.cd-table td{text-align:right;font-size:18px;font-weight:900;white-space:nowrap;padding-left:12px;font-variant-numeric:tabular-nums;}
.cd-quote{margin:56px 0 0;padding:32px 34px;background:color-mix(in srgb,var(--maroon) 88%,var(--purple));color:#fff;border-radius:16px;}
.cd-quote .q{font-size:clamp(1.125rem,.6vw + 1rem,1.375rem);font-weight:600;line-height:1.45;margin:0;max-width:52ch;}
.cd-quote .q::before{content:"“";}
.cd-quote .q::after{content:"”";}
.cd-quote .cite{margin:16px 0 0;font-size:13px;opacity:.75;}
.cd-cta{display:flex;justify-content:space-between;align-items:center;gap:24px 40px;margin:48px 0 0;padding:36px 0 96px;border-top:1px solid rgba(25,0,0,.12);}
.cd-cta h2{font-size:clamp(1.375rem,.8vw + 1.1rem,1.75rem);font-weight:800;margin:0 0 6px;letter-spacing:-.015em;}
.cd-cta p{font-size:15px;margin:0;color:color-mix(in srgb,var(--maroon) 68%,var(--white));}
.cd-cta .btn{margin-top:0;flex-shrink:0;}
.cd-cta .btn:focus-visible{outline:3px solid var(--purple);outline-offset:3px;}
@media(max-width:760px){
  .cd{padding-top:118px;}
  .cd-results,.cd-cols,.cd-duo{grid-template-columns:minmax(0,1fr);}
  .cd-results{padding:24px 22px;gap:24px;}
    .cd-cta{flex-direction:column;align-items:flex-start;}
  .cd-cta .btn{width:100%;justify-content:center;}
  .cd-quote{padding:26px 22px;}
}
@media(max-width:600px){.cd-chart .svg-d{display:none;}.cd-chart .svg-m{display:block;}}
/* ---- fasen onder de grafiek (9 okt 2026) ---- */
.cd-phases{list-style:none;padding:0;margin:16px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}
.cd-phases li{position:relative;background:#fff;border:1px solid rgba(25,0,0,.1);border-radius:14px;padding:20px 20px 18px;}
.cd-phases li.hi{border-color:color-mix(in srgb,var(--purple) 45%,#fff);box-shadow:inset 0 3px 0 var(--lime);}
.cd-phases .nr{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--purple);font-size:13px;font-weight:800;color:var(--maroon);background:#fff;}
.cd-phases li.hi .nr{background:var(--purple);border-color:var(--purple);color:#fff;}
.cd-phases .per{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:color-mix(in srgb,var(--maroon) 55%,var(--white));margin:12px 0 4px;}
.cd-phases h3{font-size:17px;font-weight:800;margin:0 0 6px;}
.cd-phases p:last-child{font-size:15px;line-height:1.55;margin:0;color:color-mix(in srgb,var(--maroon) 72%,var(--white));}
.cd-chart{margin-top:24px;}
@media(max-width:760px){.cd-phases{grid-template-columns:minmax(0,1fr);}}

/* ---- print / pdf ---- */
@media print{
  @page{size:A4;margin:14mm 12mm;}
  html,body{background:#fff!important;}
  #nav,.wa-fab,.pf-ov,.skip,footer{display:none!important;}
  .cd{padding:0!important;}
  .cd-doc{max-width:none;}
  .cd-sec{margin-top:28px;padding-top:24px;}
  .cd-results,.cd-card,.cd-phases li,.cd-quote,.cd-choices li,.cd-cols>*,.cd-cta{break-inside:avoid;page-break-inside:avoid;}
  .cd-h2,.cd-eye{break-after:avoid;page-break-after:avoid;}
  .cd-cta{padding-bottom:0;}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact;}
}