/* Kop en tekst van dienst- en casepagina's in de stijl van de kennisbank
   (/assets/lp-term.css): kruimelpad, titel, intro, auteur (cases), vierkante
   witte chips, afgeronde headerfoto en dezelfde typografie in de tekst. */

/* ---------- Kop ---------- */
.page-hero.pk{padding:40px 24px 0;border:none;}
.pk-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:0 10px;
  font-family:var(--ff-body,'DM Sans',system-ui,sans-serif);font-size:14px;line-height:1.4;color:#6B6866;}
.pk-crumb a{color:#6B6866;text-decoration:none;transition:color .15s;}
.pk-crumb a:hover{color:#0F0E0C;}
.pk-crumb-sep{color:#B5B1AA;}

.page-hero.pk h1{font-family:var(--ff-disp,'Bricolage Grotesque',system-ui,sans-serif);
  font-size:clamp(28px,7.6vw,42px);font-weight:800;letter-spacing:-1px;line-height:1.1;
  margin:20px 0 0;color:#0F0E0C;}
.page-hero.pk .lead{font-family:var(--ff-body,'DM Sans',system-ui,sans-serif);font-size:17px;
  line-height:1.6;color:#6B6866;margin:12px 0 0;max-width:580px;}

/* Auteur onder de intro, zelfde ritme als in de kennisbank en bij insight. */
.pk-auteur{display:flex;align-items:center;gap:14px;margin-top:24px;}
.pk-avatar{width:52px;height:52px;border-radius:50%;object-fit:cover;flex:none;background:#F6F5F2;}
.pk-naam{font-family:var(--ff-body,'DM Sans',system-ui,sans-serif);font-size:16px;font-weight:700;
  line-height:1.3;color:#0F0E0C;}
.pk-rol{font-family:var(--ff-body,'DM Sans',system-ui,sans-serif);font-size:14px;line-height:1.4;
  color:#6B6866;letter-spacing:.01em;margin-top:2px;}

/* Vierkante witte chips. */
.pk-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:20px;}
.pk-chip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;
  font-family:var(--ff-mono,'JetBrains Mono',monospace);font-size:11px;font-weight:600;
  letter-spacing:.04em;line-height:1;color:#0F0E0C;background:#fff;border:1px solid #E2DFD9;
  border-radius:8px;white-space:nowrap;text-decoration:none;text-transform:none;
  transition:border-color .15s,box-shadow .15s;}
a.pk-chip:hover{border-color:#C9C5BE;box-shadow:0 2px 8px rgba(0,0,0,.06);color:#0F0E0C;}
.pk-chip svg{width:11px;height:11px;flex:none;}
a.pk-chip:focus-visible,.pk-crumb a:focus-visible{outline:2px solid #E8294A;outline-offset:2px;}

/* ---------- Headerfoto ---------- */
.pk ~ .dienst-photo{aspect-ratio:16/9;border-radius:16px;border:1px solid #E8E6E1;
  margin-top:28px !important;box-sizing:border-box;}
.pk ~ picture{margin-top:28px;}
.pk ~ picture img.hero-img{height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:16px;
  border:1px solid #E8E6E1;box-sizing:border-box;}

/* ---------- Tekst ---------- */
.pk ~ .section-body h2{font-family:var(--ff-disp,'Bricolage Grotesque',system-ui,sans-serif);
  font-size:23px;font-weight:800;letter-spacing:-.5px;line-height:1.2;margin:40px 0 14px;color:#0F0E0C;}
.pk ~ .section-body h2:first-child{margin-top:0;}
.pk ~ .section-body h3{font-family:var(--ff-disp,'Bricolage Grotesque',system-ui,sans-serif);
  font-size:17px;font-weight:800;letter-spacing:-.2px;line-height:1.3;margin:24px 0 8px;color:#0F0E0C;}
.pk ~ .section-body p{font-size:15.5px;line-height:1.72;color:#0F0E0C;margin:0 0 15px;}
.pk ~ .section-body li{font-size:15.5px;line-height:1.72;color:#0F0E0C;}
.pk ~ .section-body strong{font-weight:700;}