/* =====================================================================
   30Bet — broadsheet editorial design system. Prefix: wbc-
   Display: Hanken Grotesk · Tekst: Lora (serif). Inkt op wit.
   ===================================================================== */

:root{
  /* breedte / ritme */
  --wbc-wrap:1270px;
  --wbc-pad:clamp(16px,4vw,28px);
  --wbc-s-1:4px; --wbc-s-2:8px; --wbc-s-3:12px; --wbc-s-4:16px;
  --wbc-s-5:24px; --wbc-s-6:32px; --wbc-s-7:48px;
  --wbc-sec-pad:clamp(18px,3vw,30px);

  /* typeschaal (1.25) */
  --wbc-step--1:.8rem;
  --wbc-step-0:1rem;
  --wbc-step-1:1.25rem;
  --wbc-step-2:1.5625rem;
  --wbc-step-3:1.9531rem;
  --wbc-step-4:2.4414rem;
  --wbc-step-5:3.0518rem;

  /* oppervlakken / inkt */
  --wbc-bg:#ffffff;
  --wbc-surface:#f6f7f9;
  --wbc-surface-2:#eceef1;
  --wbc-hairline:rgba(16,19,26,.13);
  --wbc-ink:#10131a;
  --wbc-ink-2:#3a4150;
  --wbc-ink-3:#6b7384;

  /* merk-accenten */
  --wbc-accent:#0561ff;
  --wbc-accent-ink:#ffffff;
  --wbc-cta:#ffbe05;
  --wbc-cta-ink:#1a1300;
  --wbc-navy:#003893;
  --wbc-navy-ink:#e7eeff;

  /* vorm */
  --wbc-corner:0 0 16px 0;       /* alleen rechtsonder rond */
  --wbc-rule:3px;

  --wbc-shadow:0 18px 44px -20px rgba(8,18,48,.45), 0 4px 14px -8px rgba(8,18,48,.25);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--wbc-bg);color:var(--wbc-ink);
  font-family:"Lora",Georgia,"Times New Roman",serif;
  font-size:1.0625rem;line-height:1.62;
  text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6,.wbc-kicker,.wbc-nav,.wbc-cta,.wbc-util,.wbc-foot__h,
.wbc-facts__k,.wbc-slot__name,.wbc-toc,.wbc-byline,.wbc-rating,.wbc-tag{
  font-family:"Hanken Grotesk",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--wbc-accent);text-underline-offset:2px}
strong{font-weight:600}
.wbc-num,table,.wbc-facts__v,.wbc-rating{font-variant-numeric:tabular-nums lining-nums}

.wbc-wrap{width:100%;max-width:var(--wbc-wrap);margin-inline:auto;padding-inline:var(--wbc-pad)}

/* skip-link */
.wbc-skip{position:absolute;left:-9999px;top:0;background:var(--wbc-ink);color:#fff;padding:.6rem 1rem;z-index:100}
.wbc-skip:focus{left:0}

/* ---- onderstreping vanuit het midden (alleen transform) -------------- */
.wbc-nav a,.wbc-crumbs a,.wbc-prose a:not(.wbc-cta),.wbc-foot__list a,.wbc-slots__link,.wbc-author__more{
  position:relative;text-decoration:none;
}
.wbc-nav a::after,.wbc-prose a:not(.wbc-cta)::after,.wbc-slots__link::after,.wbc-author__more::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;
  background:linear-gradient(90deg,var(--wbc-accent),color-mix(in srgb,var(--wbc-accent) 55%,#7aa6ff));
  transform:scaleX(0);transform-origin:center;transition:transform .16s ease-out;
}
.wbc-nav a:hover::after,.wbc-nav a:focus-visible::after,.wbc-nav a[aria-current]::after,
.wbc-prose a:not(.wbc-cta):hover::after,.wbc-prose a:not(.wbc-cta):focus-visible::after,
.wbc-slots__link:hover::after,.wbc-author__more:hover::after{transform:scaleX(1)}
.wbc-prose a:not(.wbc-cta){color:var(--wbc-accent)}

/* =====================================================================
   UTILITY BAR + MASTHEAD
   ===================================================================== */
.wbc-util{background:var(--wbc-navy);color:var(--wbc-navy-ink);font-size:var(--wbc-step--1);letter-spacing:.06em;text-transform:uppercase}
.wbc-util__row{display:flex;flex-wrap:wrap;gap:.4rem 1.1rem;align-items:center;justify-content:space-between;min-height:34px;padding-block:6px}
.wbc-util__age{color:#fff}

.wbc-mast{position:sticky;top:0;z-index:50;background:#fff;border-bottom:var(--wbc-rule) solid var(--wbc-ink)}
.wbc-mast__row{display:flex;flex-wrap:nowrap;align-items:center;gap:1rem;min-height:64px}
.wbc-logo{display:inline-flex;align-items:center;line-height:0;flex:0 0 auto}
.wbc-logo img{height:clamp(30px,4vw,42px);width:auto}
.wbc-nav{display:flex;flex-wrap:nowrap;align-items:center;gap:clamp(.5rem,1.4vw,1.15rem);margin-left:auto}
.wbc-nav a{white-space:nowrap;color:var(--wbc-ink);font-weight:700;font-size:.86rem;letter-spacing:.01em;padding-block:.35rem}
.wbc-mast__cta{white-space:nowrap;flex:0 0 auto}
.wbc-burger{display:none}
.wbc-navtoggle{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;clip:rect(0 0 0 0)}

/* =====================================================================
   KICKER / SECTIES / KOPPEN
   ===================================================================== */
.wbc-kicker{display:block;font-size:.74rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--wbc-accent);margin-bottom:.5rem}

.wbc-h2{font-size:clamp(1.5rem,1vw + 1.2rem,1.95rem);line-height:1.14;font-weight:800;letter-spacing:-.012em;margin:0 0 .35rem;color:var(--wbc-ink);text-wrap:balance}
.wbc-h2::after{content:"";display:block;width:64px;height:3px;margin-top:.55rem;background:linear-gradient(90deg,transparent,var(--wbc-ink) 22%,var(--wbc-ink) 78%,transparent)}
.wbc-h3{font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:var(--wbc-step-1);font-weight:700;line-height:1.2;letter-spacing:-.01em;margin:1.6rem 0 .5rem;color:var(--wbc-ink)}

.wbc-sec{padding-block:var(--wbc-sec-pad);border-top:1px solid var(--wbc-hairline)}
.wbc-sec:first-of-type{border-top:0}
.wbc-sec__no{display:inline-block;font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:800;font-size:.78rem;letter-spacing:.12em;color:var(--wbc-accent);margin-bottom:.35rem}

/* =====================================================================
   PROSE (één kolom, volle .wrap-breedte — geen ch-measure)
   ===================================================================== */
.wbc-prose>*{max-width:none}
.wbc-prose p{margin:0 0 1.05rem;color:var(--wbc-ink-2);text-wrap:pretty}
.wbc-prose p strong{color:var(--wbc-ink)}
.wbc-prose>p:first-child{margin-top:0}

.wbc-lede{font-size:var(--wbc-step-1);line-height:1.5;color:var(--wbc-ink)!important}
.wbc-lede::first-letter{
  font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:800;
  float:left;font-size:3.4em;line-height:.72;padding:.05em .12em 0 0;color:var(--wbc-accent);
}

/* lijst-markers: pijl in accent, hangende inspring */
.wbc-prose ul{list-style:none;margin:0 0 1.1rem;padding:0}
.wbc-prose ul li{position:relative;padding-left:1.5em;margin:.4rem 0;color:var(--wbc-ink-2)}
.wbc-prose ul li::before{content:"›";position:absolute;left:.2em;top:-.02em;color:var(--wbc-accent);font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:800}
.wbc-prose ol{margin:0 0 1.1rem;padding-left:1.3em}
.wbc-prose ol li{margin:.4rem 0;color:var(--wbc-ink-2)}
.wbc-prose ol li::marker{color:var(--wbc-accent);font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:800}

/* =====================================================================
   CTA-KNOP (outline default / solid / ghost)
   ===================================================================== */
.wbc-cta{
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:800;font-size:1rem;letter-spacing:.01em;
  padding:.78rem 1.35rem;text-decoration:none;cursor:pointer;border:2px solid var(--wbc-ink);
  background:transparent;color:var(--wbc-ink);position:relative;border-radius:var(--wbc-corner);
  transition:background-color .16s ease,color .16s ease,border-color .16s ease,transform .12s ease;
}
.wbc-cta__arr{display:inline-block;transition:transform .16s ease;will-change:transform}
.wbc-cta:hover .wbc-cta__arr,.wbc-cta:focus-visible .wbc-cta__arr{transform:translateX(4px)}
.wbc-cta--solid{background:var(--wbc-cta);border-color:var(--wbc-cta);color:var(--wbc-cta-ink)}
.wbc-cta--solid:hover,.wbc-cta--solid:focus-visible{background:#ffca33;border-color:#ffca33;color:var(--wbc-cta-ink)}
.wbc-cta--ghost{border-color:var(--wbc-accent);color:var(--wbc-accent);background:transparent;padding:.6rem 1.05rem;font-size:.9rem}
.wbc-cta--ghost:hover,.wbc-cta--ghost:focus-visible{background:color-mix(in srgb,var(--wbc-accent) 10%,transparent)}
.wbc-cta:active{transform:translateY(1px)}

.wbc-ctarow{display:flex;justify-content:center;margin:1.4rem 0}
.wbc-hero__cta{justify-content:flex-start;margin:0}

/* =====================================================================
   HERO (money/game) — desktop 2 koloms, mobiel H1→lead→CTA→beeld→facts
   ===================================================================== */
.wbc-hero{padding-block:clamp(16px,3vw,28px);position:relative;border-bottom:1px solid var(--wbc-hairline)}
.wbc-hero__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(18px,3vw,40px);align-items:center}
.wbc-hero__body{display:flex;flex-direction:column;gap:.7rem;min-width:0;order:2}
.wbc-hero__h1{font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:800;font-size:clamp(2rem,1.4rem + 2.2vw,3rem);line-height:1.05;letter-spacing:-.02em;margin:0;text-wrap:balance}
.wbc-hero__lead{font-size:var(--wbc-step-1);line-height:1.45;color:var(--wbc-ink-2);margin:0;max-width:46ch}
.wbc-hero__media{order:1;margin:0;min-width:0;position:relative}
.wbc-hero__media::before{content:"";position:absolute;inset:-6% 0;z-index:0;background:radial-gradient(60% 60% at 60% 40%,color-mix(in srgb,var(--wbc-accent) 24%,transparent),transparent 70%);filter:blur(26px)}
.wbc-hero__img{position:relative;z-index:1;width:100%;max-width:380px;margin-inline:auto;aspect-ratio:1/1;object-fit:cover;border-radius:var(--wbc-corner);box-shadow:var(--wbc-shadow)}

.wbc-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:clamp(14px,2vw,22px) 0 0;
  background:var(--wbc-surface);border:1px solid var(--wbc-hairline);border-radius:var(--wbc-corner);overflow:hidden;box-shadow:0 10px 26px -20px rgba(8,18,48,.4)}
.wbc-facts__cell{padding:.85rem 1.05rem;border-left:1px solid var(--wbc-hairline)}
.wbc-facts__cell:first-child{border-left:0}
.wbc-facts__k{display:block;font-size:.68rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--wbc-ink-3);margin-bottom:.2rem}
.wbc-facts__v{font-size:1.02rem;font-weight:600;color:var(--wbc-ink);line-height:1.25}

/* =====================================================================
   PAGETITLE (trust/legal/auteur)
   ===================================================================== */
.wbc-pagetitle{padding-block:clamp(20px,3.5vw,40px);border-bottom:var(--wbc-rule) solid var(--wbc-ink)}
.wbc-pagetitle__h1{font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:800;font-size:clamp(1.9rem,1.3rem + 2.4vw,2.9rem);line-height:1.06;letter-spacing:-.02em;margin:.1rem 0 0;max-width:none}
.wbc-pagetitle__lead{font-size:var(--wbc-step-1);color:var(--wbc-ink-2);margin:.7rem 0 0;max-width:70ch}

/* =====================================================================
   KRUIMELS + BYLINE
   ===================================================================== */
.wbc-crumbs{background:#fff;border-bottom:1px solid var(--wbc-hairline)}
.wbc-crumbs__list{list-style:none;display:flex;flex-wrap:wrap;gap:.3rem .5rem;align-items:center;margin-block:0;padding-block:.65rem;font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.8rem}
.wbc-crumbs__item{display:inline-flex;align-items:center;gap:.5rem;color:var(--wbc-ink-3)}
.wbc-crumbs a{color:var(--wbc-ink-2);text-decoration:none}
.wbc-crumbs__sep{color:var(--wbc-ink-3)}
.wbc-crumbs [aria-current]{color:var(--wbc-ink);font-weight:600}

.wbc-byline{border-bottom:1px solid var(--wbc-hairline);background:#fff}
.wbc-byline__row{display:flex;align-items:center;gap:.8rem;padding-block:.8rem}
.wbc-byline__ph{width:48px;height:48px;border-radius:50%;object-fit:cover;flex:0 0 auto;border:2px solid var(--wbc-ink)}
.wbc-byline__meta{display:flex;flex-direction:column;gap:.1rem;font-size:.86rem;min-width:0}
.wbc-byline__by{font-weight:700;color:var(--wbc-ink)}
.wbc-byline__by a{color:var(--wbc-ink);text-decoration:none}
.wbc-byline__by a:hover{color:var(--wbc-accent)}
.wbc-byline__role{font-weight:400;color:var(--wbc-ink-3)}
.wbc-byline__dates{color:var(--wbc-ink-3);font-size:.8rem}
.wbc-byline__dates a{color:var(--wbc-ink-3)}

/* =====================================================================
   MAIN / TOC
   ===================================================================== */
.wbc-main{padding-block:var(--wbc-s-4) var(--wbc-s-7)}
.wbc-toc{margin:var(--wbc-s-4) 0;border:1px solid var(--wbc-hairline);border-radius:var(--wbc-corner);padding:1rem 1.1rem;background:var(--wbc-surface)}
.wbc-toc__h{font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--wbc-ink-3);margin:0 0 .6rem}
.wbc-toc__chips{list-style:none;display:flex;flex-wrap:wrap;gap:.45rem;margin:0;padding:0}
.wbc-toc__chips a{display:inline-block;font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.82rem;font-weight:700;text-decoration:none;color:var(--wbc-ink-2);background:#fff;border:1px solid var(--wbc-hairline);padding:.35rem .7rem;border-radius:999px;transition:border-color .16s,color .16s,background-color .16s}
.wbc-toc__chips a:hover{border-color:var(--wbc-accent);color:var(--wbc-accent)}
:where(h2,h3)[id]{scroll-margin-top:90px}

/* =====================================================================
   FIGUUR (content-afbeelding) — gecentreerd, ~70% met px-cap
   ===================================================================== */
.wbc-figure{width:min(70%,760px);margin:1.4rem auto;border-radius:var(--wbc-corner);overflow:hidden;border:1px solid var(--wbc-hairline)}
.wbc-figure img{width:100%;aspect-ratio:16/9;object-fit:cover}
.wbc-figure figcaption{font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.78rem;color:var(--wbc-ink-3);padding:.5rem .7rem;background:var(--wbc-surface)}

/* =====================================================================
   CALLOUT / PROS-CONS / CHECKLIST
   ===================================================================== */
.wbc-callout{border-left:4px solid var(--wbc-accent);background:var(--wbc-surface);padding:1rem 1.15rem;margin:1.3rem 0;border-radius:0 var(--wbc-corner) var(--wbc-corner) 0}
.wbc-callout strong{color:var(--wbc-ink)}

.wbc-pc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--wbc-s-4);margin:1.4rem 0}
.wbc-pc__col{border:1px solid var(--wbc-hairline);border-radius:var(--wbc-corner);padding:1.05rem 1.15rem;background:#fff}
.wbc-pc__col h3{margin:0 0 .6rem;font-size:1.05rem}
.wbc-pc__col ul{list-style:none;margin:0;padding:0}
.wbc-pc__col li{position:relative;padding-left:1.6em;margin:.45rem 0;color:var(--wbc-ink-2)}
.wbc-pc__col li::before{position:absolute;left:0;top:0;font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:800}
.wbc-pc--pro li::before{content:"+";color:#0a7d3c}
.wbc-pc--con li::before{content:"–";color:#b4232a}

/* =====================================================================
   TABELLEN (ook kale <table>)
   ===================================================================== */
.wbc-tablewrap{overflow-x:auto;margin:1.4rem 0;border:1px solid var(--wbc-hairline);border-radius:var(--wbc-corner)}
table:not(.wbc-bare){width:100%;border-collapse:collapse;font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.92rem;background:#fff}
.wbc-prose table{margin:1.4rem 0}
table caption{caption-side:top;text-align:left;font-weight:700;color:var(--wbc-ink-3);font-size:.82rem;padding:.4rem 0}
table th,table td{padding:.7rem .85rem;text-align:left;border-bottom:1px solid var(--wbc-hairline);vertical-align:top}
table thead th{background:var(--wbc-surface-2);color:var(--wbc-ink);font-weight:800;border-bottom:2px solid var(--wbc-ink);white-space:nowrap}
table tbody tr:nth-child(even){background:var(--wbc-surface)}
table tbody td:first-child{font-weight:700;color:var(--wbc-ink)}
table td.wbc-num,table th.wbc-num{text-align:right}

/* =====================================================================
   FAQ (<details>) — accentstreep links bij open
   ===================================================================== */
.wbc-faq{margin:1.2rem 0}
details{border:1px solid var(--wbc-hairline);border-radius:var(--wbc-corner);margin:.55rem 0;background:#fff;position:relative;overflow:hidden}
details::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--wbc-accent);opacity:0;transition:opacity .16s}
details[open]::before{opacity:1}
details>summary{list-style:none;cursor:pointer;font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:700;font-size:1.02rem;color:var(--wbc-ink);padding:.95rem 2.6rem .95rem 1.1rem;position:relative}
details>summary::-webkit-details-marker{display:none}
details>summary::after{content:"+";position:absolute;right:1.1rem;top:50%;transform:translateY(-50%);font-size:1.3rem;font-weight:700;color:var(--wbc-accent);transition:transform .16s}
details[open]>summary::after{content:"–"}
details>summary:focus-visible{outline:2px solid var(--wbc-accent);outline-offset:2px}
.wbc-faq__a{padding:0 1.1rem 1.05rem 1.1rem;color:var(--wbc-ink-2)}
.wbc-faq__a p{margin:.2rem 0 .6rem}

/* =====================================================================
   RATING — verticale balkjes per criterium
   ===================================================================== */
.wbc-rating{display:inline-flex;flex-direction:column;gap:.6rem;border:1px solid var(--wbc-hairline);border-radius:var(--wbc-corner);padding:1.1rem 1.3rem;background:#fff;box-shadow:var(--wbc-shadow)}
.wbc-rating__bars{display:flex;align-items:flex-end;gap:1.1rem;height:120px}
.wbc-rating__item{display:flex;flex-direction:column;align-items:center;gap:.4rem;height:100%;justify-content:flex-end}
.wbc-rating__track{width:34px;height:96px;background:var(--wbc-surface-2);border-radius:6px 6px 0 0;display:flex;align-items:flex-end;overflow:hidden}
.wbc-rating__fill{width:100%;height:var(--h,60%);background:linear-gradient(180deg,var(--wbc-accent),color-mix(in srgb,var(--wbc-accent) 70%,#003893));border-radius:6px 6px 0 0}
.wbc-rating__lbl{font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--wbc-ink-3)}
.wbc-rating__score{font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:800;font-size:2rem;color:var(--wbc-accent);line-height:1}
.wbc-rating__score small{font-size:1rem;color:var(--wbc-ink-3);font-weight:600}
.wbc-rating__cap{font-size:.8rem;color:var(--wbc-ink-3)}

/* =====================================================================
   SLOTS — compacte grid (≥6 desktop, 4 tablet, 3 mobiel)
   ===================================================================== */
.wbc-slots{padding-block:var(--wbc-sec-pad);border-top:1px solid var(--wbc-hairline)}
.wbc-slots__head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.wbc-slots__link{font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:800;font-size:.86rem;text-decoration:none;color:var(--wbc-accent);position:relative;white-space:nowrap}
.wbc-slots__intro{color:var(--wbc-ink-2);margin:.5rem 0 1.1rem;max-width:none}
.wbc-slots__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,118px),1fr));gap:12px}
.wbc-slot{display:block;text-decoration:none;color:inherit;border:1px solid var(--wbc-hairline);border-radius:var(--wbc-corner);overflow:hidden;background:#fff;transition:border-color .16s ease,transform .12s ease}
.wbc-slot__img{display:block;aspect-ratio:1/1;overflow:hidden;background:var(--wbc-surface-2)}
.wbc-slot__img img{width:100%;height:100%;object-fit:cover}
.wbc-slot__name{display:block;font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.74rem;font-weight:700;color:var(--wbc-ink-2);padding:.45rem .55rem;line-height:1.2}
.wbc-slot:hover{border-color:var(--wbc-accent);transform:translateY(-2px)}
.wbc-slot:hover .wbc-slot__name{color:var(--wbc-accent)}

/* =====================================================================
   AUTEUR-KAART (na FAQ)
   ===================================================================== */
.wbc-author{display:flex;gap:1.2rem;align-items:flex-start;max-width:880px;margin:2rem auto 0;border:1px solid var(--wbc-hairline);border-top:var(--wbc-rule) solid var(--wbc-ink);border-radius:var(--wbc-corner);padding:1.4rem 1.5rem;background:var(--wbc-surface)}
.wbc-author__ph{width:104px;height:104px;border-radius:50%;object-fit:cover;flex:0 0 auto;border:2px solid var(--wbc-ink)}
.wbc-author__body{min-width:0}
.wbc-author__eyebrow{display:block;font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--wbc-ink-3)}
.wbc-author__name{font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:1.3rem;font-weight:800;margin:.2rem 0 .15rem}
.wbc-author__name a{color:var(--wbc-ink);text-decoration:none}
.wbc-author__name a:hover{color:var(--wbc-accent)}
.wbc-author__role{font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.86rem;color:var(--wbc-accent);font-weight:700;margin:0 0 .55rem}
.wbc-author__bio{color:var(--wbc-ink-2);margin:0 0 .6rem;font-size:.98rem}
.wbc-author__more{font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:800;font-size:.86rem;text-decoration:none;color:var(--wbc-accent);position:relative}

/* portret op auteurspagina (binnen .wbc-prose) — vast formaat, links */
.wbc-prose img.wbc-portrait{width:220px;height:auto;aspect-ratio:3/4;object-fit:cover;float:left;margin:0 1.4rem 1rem 0;border:1px solid var(--wbc-hairline);border-radius:var(--wbc-corner)}

/* =====================================================================
   FOOTER (4 koloms, accentkolom verantwoord spelen)
   ===================================================================== */
.wbc-foot{background:var(--wbc-navy);color:var(--wbc-navy-ink);margin-top:var(--wbc-s-7);border-top:var(--wbc-rule) solid var(--wbc-cta)}
.wbc-foot__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:clamp(20px,3vw,40px);padding-block:clamp(28px,4vw,44px)}
.wbc-foot__col{min-width:0}
.wbc-foot__logo{background:#fff;padding:8px 14px;border-radius:12px;display:inline-block;line-height:0;margin-bottom:.9rem}
.wbc-foot__logo img{height:34px;width:auto}
.wbc-foot__tag{font-size:.92rem;color:var(--wbc-navy-ink);margin:0 0 .8rem}
.wbc-foot__disc{font-size:.78rem;color:#aebfe6;margin:0}
.wbc-foot__h{font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.78rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#fff;margin:0 0 .8rem}
.wbc-foot__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}
.wbc-foot__list a{color:var(--wbc-navy-ink);text-decoration:none;font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.9rem}
.wbc-foot__list a:hover{color:#fff;text-decoration:underline;text-underline-offset:2px}
.wbc-foot__rg{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:var(--wbc-corner);padding:1.1rem 1.2rem}
.wbc-foot__rg p{font-size:.86rem;margin:.45rem 0;color:#dbe6ff}
.wbc-foot__rg strong{color:#fff}
.wbc-foot__h--rg{color:var(--wbc-cta)}
.wbc-foot__base{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;justify-content:space-between;border-top:1px solid rgba(255,255,255,.16);padding-block:1.1rem;font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.82rem;color:#aebfe6}
.wbc-foot__base a{color:#fff}

/* =====================================================================
   COOKIE-CONSENT (fixed, niet in flow)
   ===================================================================== */
.wbc-consent{position:fixed;right:16px;bottom:16px;z-index:90;width:min(360px,calc(100vw - 32px));background:#fff;color:var(--wbc-ink);border:1px solid var(--wbc-hairline);border-top:var(--wbc-rule) solid var(--wbc-accent);border-radius:var(--wbc-corner);box-shadow:var(--wbc-shadow);padding:1.05rem 1.15rem}
.wbc-consent__txt{font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.84rem;color:var(--wbc-ink-2);margin:0 0 .8rem}
.wbc-consent__btns{display:flex;gap:.5rem;flex-wrap:wrap}
.wbc-consent__b{font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:800;font-size:.82rem;padding:.55rem .9rem;border-radius:8px;cursor:pointer;border:2px solid var(--wbc-ink);background:#fff;color:var(--wbc-ink)}
.wbc-consent__b--ok{background:var(--wbc-cta);border-color:var(--wbc-cta);color:var(--wbc-cta-ink)}

/* =====================================================================
   STATEN / TOEGANKELIJKHEID
   ===================================================================== */
:focus-visible{outline:2px solid var(--wbc-accent);outline-offset:2px}
::selection{background:color-mix(in srgb,var(--wbc-accent) 22%,#fff);color:var(--wbc-ink)}
a,button,input,select{accent-color:var(--wbc-accent)}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media(max-width:980px){
  .wbc-nav{position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:#fff;border-bottom:var(--wbc-rule) solid var(--wbc-ink);padding:0 var(--wbc-pad);max-height:0;overflow:hidden;margin:0}
  .wbc-nav a{width:100%;padding:.9rem 0;border-bottom:1px solid var(--wbc-hairline);font-size:1rem}
  .wbc-nav a::after{display:none}
  .wbc-navtoggle:checked~.wbc-nav{max-height:80vh;overflow:auto;padding-block:.4rem}
  .wbc-burger{display:inline-flex;align-items:center;margin-left:auto;font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:800;letter-spacing:.12em;font-size:.8rem;text-transform:uppercase;background:none;border:0;cursor:pointer;color:var(--wbc-ink)}
  .wbc-mast__cta{display:none}
  .wbc-foot__grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .wbc-hero__grid{grid-template-columns:1fr}
  .wbc-hero__body{order:1;text-align:center;align-items:center}
  .wbc-hero__lead{margin-inline:auto}
  .wbc-hero__cta{justify-content:center}
  .wbc-hero__media{order:2}
  .wbc-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wbc-facts__cell:nth-child(odd){border-left:0}
  .wbc-facts__cell:nth-child(n+3){border-top:1px solid var(--wbc-hairline)}
  .wbc-pc{grid-template-columns:1fr}
  .wbc-figure{width:100%}
  .wbc-author{flex-direction:column;align-items:flex-start}
  .wbc-foot__grid{grid-template-columns:1fr}
}
@media(max-width:640px){
  .wbc-hero__img{max-height:42vh;width:auto;aspect-ratio:1/1;object-fit:contain}
  .wbc-slots__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .wbc-prose img.wbc-portrait{float:none;margin:0 0 1rem}
}

@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important}
  .wbc-nav a::after,.wbc-prose a::after,.wbc-slots__link::after,.wbc-author__more::after{transition:none}
  .wbc-cta,.wbc-cta__arr,.wbc-slot,.wbc-toc__chips a,details::before,details>summary::after{transition:none}
}

/* ── PSI/A11y AA-contrast ── */
:root{--wbc-ink-3:#5a6273}
.wbc-author__eyebrow{color:var(--wbc-ink-2)}
