/* ==========================================================================
   LeveranciersManager — design system
   Eén bron voor tokens en componenten. Dit bestand gaat ongewijzigd mee naar
   het WordPress child theme; de waarden hieronder worden daar gespiegeld in
   theme.json zodat de blok-editor dezelfde kleuren en maten aanbiedt.
   ========================================================================== */

/* --- Lettertypen: zelf gehost, geen externe CDN (AVG) --------------------- */
@font-face{font-family:"IBM Plex Sans";src:url("../fonts/ibm-plex-sans-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url("../fonts/ibm-plex-sans-latin-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url("../fonts/ibm-plex-sans-latin-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url("../fonts/ibm-plex-sans-latin-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("../fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}

:root{
  /* Merkkleuren, afgeleid uit het logo -------------------------------------
     Blauwverloop van de figuren, oranje van de derde figuur. */
  --lm-navy-900:#0B1F35;
  --lm-navy-800:#12324F;
  --lm-navy-700:#1E4E79;
  --lm-navy-600:#2A6394;
  --lm-blue-500:#3E8CC4;
  --lm-blue-400:#66B0E0;
  --lm-blue-200:#B9D6EC;

  --lm-orange-700:#B24A14;   /* tekstveilig op licht: 5,4:1 */
  --lm-orange-600:#D2621F;
  --lm-orange-500:#E8823A;
  --lm-orange-400:#F2A154;

  /* Vlakken ---------------------------------------------------------------- */
  --lm-paper:#FAF9F6;        /* warme off-white: de paginagrond */
  --lm-surface:#FFFFFF;
  --lm-surface-soft:#EFF3F8; /* zeer licht blauwgrijs */
  --lm-surface-warm:#F6F1EA; /* warme rustlaag, voor afwisseling zonder kaart */
  --lm-border:#E2E6EC;
  --lm-border-strong:#C8D2DE;
  --lm-border-invert:rgba(185,214,236,.22);

  /* Tekst ------------------------------------------------------------------ */
  --lm-text:#15222F;
  --lm-text-muted:#546475;   /* 5,8:1 op paper */
  --lm-text-invert:#FFFFFF;
  --lm-text-invert-muted:#A8C1D8;

  /* Dagaccenten van de opleiding — ondersteunend, nooit dragend ------------- */
  --lm-dag1:#B85C1A;
  --lm-dag2:#2E4E8F;
  --lm-dag3:#0F7A63;

  /* Maat en ritme ---------------------------------------------------------- */
  --lm-sp-1:.25rem; --lm-sp-2:.5rem;  --lm-sp-3:.75rem; --lm-sp-4:1rem;
  --lm-sp-5:1.5rem; --lm-sp-6:2rem;   --lm-sp-7:3rem;   --lm-sp-8:4rem;
  --lm-sp-9:6rem;   --lm-sp-10:8rem;
  --lm-section:clamp(4rem,8vw,7.5rem);

  --lm-w-max:1280px;
  --lm-w-wide:1440px;
  --lm-w-text:44rem;         /* ~704px: leesbare kolombreedte */
  --lm-w-narrow:34rem;
  --lm-gutter:clamp(1.25rem,4vw,2.5rem);

  --lm-r-sm:4px; --lm-r-md:8px; --lm-r-lg:14px; --lm-r-xl:22px; --lm-r-pill:999px;

  --lm-shadow-1:0 1px 2px rgba(11,31,53,.05), 0 2px 8px rgba(11,31,53,.04);
  --lm-shadow-2:0 2px 4px rgba(11,31,53,.06), 0 14px 36px rgba(11,31,53,.09);
  --lm-shadow-deep:0 20px 60px rgba(11,31,53,.22);

  --lm-ease:cubic-bezier(.22,.61,.36,1);
  --lm-dur:.55s;

  /* Typografie ------------------------------------------------------------- */
  --lm-font:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --lm-font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --lm-fs-display:clamp(2.4rem,1.55rem + 3.4vw,3.9rem);
  --lm-fs-h2:clamp(1.9rem,1.35rem + 2.1vw,2.9rem);
  --lm-fs-h3:clamp(1.2rem,1.08rem + .5vw,1.5rem);
  --lm-fs-lead:clamp(1.125rem,1.05rem + .38vw,1.3125rem);
  --lm-fs-body:1.0625rem;
  --lm-fs-small:.9375rem;
  --lm-fs-eyebrow:.75rem;
}

/* --- Grondslag ----------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  margin:0;
  background:var(--lm-paper);
  color:var(--lm-text);
  font-family:var(--lm-font);
  font-size:var(--lm-fs-body);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

h1,h2,h3,h4{margin:0;font-weight:600;line-height:1.14;letter-spacing:-.021em;color:var(--lm-navy-900)}
h1{font-size:var(--lm-fs-display);letter-spacing:-.031em}
h2{font-size:var(--lm-fs-h2);letter-spacing:-.026em}
h3{font-size:var(--lm-fs-h3);line-height:1.3;letter-spacing:-.012em}
p{margin:0 0 var(--lm-sp-4)}
p:last-child{margin-bottom:0}

a{color:var(--lm-navy-700);text-decoration:none}
a:hover{color:var(--lm-orange-700)}
img{max-width:100%;height:auto;display:block}
ul,ol{margin:0;padding:0;list-style:none}
strong{font-weight:600}

:focus-visible{
  outline:3px solid var(--lm-orange-600);
  outline-offset:3px;
  border-radius:var(--lm-r-sm);
}

.lm-skip{
  position:absolute;left:var(--lm-sp-4);top:-4rem;z-index:200;
  background:var(--lm-navy-800);color:#fff;
  padding:.75rem 1.25rem;border-radius:var(--lm-r-md);font-weight:600;
  transition:top .2s var(--lm-ease);
}
.lm-skip:focus{top:var(--lm-sp-4);color:#fff}

.lm-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* --- Layout -------------------------------------------------------------- */
.lm-wrap{width:min(100% - var(--lm-gutter)*2,var(--lm-w-max));margin-inline:auto}
.lm-wrap--wide{width:min(100% - var(--lm-gutter)*2,var(--lm-w-wide))}
.lm-wrap--text{width:min(100% - var(--lm-gutter)*2,var(--lm-w-text))}

.lm-section{padding-block:var(--lm-section)}
.lm-section--tight{padding-block:clamp(3rem,5.5vw,4.75rem)}
.lm-section--soft{background:var(--lm-surface-soft)}
.lm-section--warm{background:var(--lm-surface-warm)}
.lm-section--deep{background:var(--lm-navy-800);color:var(--lm-text-invert)}
.lm-section--deep h2,.lm-section--deep h3{color:#fff}

/* --- Kop van een sectie --------------------------------------------------- */
.lm-eyebrow{
  display:inline-flex;align-items:center;gap:.6rem;
  font-size:var(--lm-fs-eyebrow);font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;
  color:var(--lm-orange-700);margin:0 0 var(--lm-sp-4);
}
.lm-eyebrow::before{
  content:"";width:1.75rem;height:2px;background:var(--lm-orange-500);
  flex:none;border-radius:2px;
}
.lm-section--deep .lm-eyebrow{color:var(--lm-orange-400)}

/* De bovenregel van de hero hoort bij de kop, niet ervoor: de zoekterm moet in
   de h1 staan. Visueel verandert er niets, dus de opmaak van .lm-eyebrow wordt
   hier alleen losgemaakt van wat een h1 erft. */
.lm-hero__kop{display:block}
.lm-eyebrow--kop{
  display:flex;font-family:var(--lm-font);line-height:1.4;
  font-size:var(--lm-fs-eyebrow);font-weight:600;
}
.lm-hero__kopregel{display:block}

.lm-kop{max-width:var(--lm-w-text);margin-bottom:var(--lm-sp-7)}
.lm-kop p{color:var(--lm-text-muted);font-size:var(--lm-fs-lead);line-height:1.6;margin-top:var(--lm-sp-4)}
.lm-section--deep .lm-kop p{color:var(--lm-text-invert-muted)}

.lm-lead{font-size:var(--lm-fs-lead);line-height:1.6;color:var(--lm-text-muted)}

/* --- Knoppen -------------------------------------------------------------
   De primaire actie is navy, niet oranje. Oranje op wit haalt bij deze
   verzadiging geen 4,5:1 met witte tekst; en een terughoudende CTA past
   beter bij de doelgroep. Oranje blijft het accent. */
.lm-btn{
  display:inline-flex;align-items:center;gap:.6rem;
  font:inherit;font-weight:600;font-size:var(--lm-fs-small);
  padding:.9rem 1.5rem;border-radius:var(--lm-r-md);
  border:1.5px solid transparent;cursor:pointer;
  transition:background .25s var(--lm-ease),border-color .25s var(--lm-ease),
             color .25s var(--lm-ease),transform .25s var(--lm-ease);
}
.lm-btn svg{flex:none;transition:transform .3s var(--lm-ease)}
.lm-btn:hover svg{transform:translateX(3px)}

.lm-btn--primair{background:var(--lm-navy-800);color:#fff;border-color:var(--lm-navy-800)}
.lm-btn--primair:hover{background:var(--lm-navy-900);border-color:var(--lm-navy-900);color:#fff}

.lm-btn--rand{background:transparent;color:var(--lm-navy-800);border-color:var(--lm-border-strong)}
.lm-btn--rand:hover{border-color:var(--lm-navy-700);color:var(--lm-navy-900);background:rgba(30,78,121,.04)}

.lm-btn--licht{background:#fff;color:var(--lm-navy-900);border-color:#fff}
.lm-btn--licht:hover{background:var(--lm-blue-200);border-color:var(--lm-blue-200);color:var(--lm-navy-900)}

.lm-btn--randlicht{background:transparent;color:#fff;border-color:var(--lm-border-invert)}
.lm-btn--randlicht:hover{border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.07);color:#fff}

.lm-link{
  display:inline-flex;align-items:center;gap:.5rem;
  font-weight:600;font-size:var(--lm-fs-small);color:var(--lm-navy-700);
  padding-bottom:2px;
  background-image:linear-gradient(var(--lm-orange-500),var(--lm-orange-500));
  background-size:0 2px;background-position:0 100%;background-repeat:no-repeat;
  transition:background-size .3s var(--lm-ease),color .25s var(--lm-ease);
}
.lm-link:hover{background-size:100% 2px;color:var(--lm-navy-900)}
.lm-link svg{flex:none;transition:transform .3s var(--lm-ease)}
.lm-link:hover svg{transform:translateX(3px)}

.lm-acties{display:flex;flex-wrap:wrap;gap:var(--lm-sp-3);align-items:center}
/* Op smal scherm staan twee knoppen onder elkaar; ongelijke breedtes ogen daar
   als een slordigheid, dus strekken ze allebei. */
@media (max-width:540px){
  .lm-acties{flex-direction:column;align-items:stretch}
  .lm-acties .lm-btn{justify-content:center;width:100%}
}

/* --- Label / markering ---------------------------------------------------- */
.lm-label{
  display:inline-block;font-size:.7rem;font-weight:600;
  letter-spacing:.09em;text-transform:uppercase;
  padding:.3rem .65rem;border-radius:var(--lm-r-pill);
  background:rgba(30,78,121,.09);color:var(--lm-navy-700);
}
.lm-label--wacht{background:rgba(178,74,20,.1);color:var(--lm-orange-700)}
.lm-label--open{
  background:repeating-linear-gradient(135deg,#FDF1E6,#FDF1E6 6px,#FAE6D6 6px,#FAE6D6 12px);
  color:var(--lm-orange-700);text-transform:none;letter-spacing:.02em;font-weight:500;
}

.lm-nr{
  font-family:var(--lm-font-mono);font-size:.8125rem;font-weight:500;
  color:var(--lm-orange-600);letter-spacing:.02em;
}

/* ==========================================================================
   Header
   ========================================================================== */
.lm-header{
  position:sticky;top:0;z-index:100;
  /* Geen backdrop-filter hier: dat maakt van de kop een containing block,
     waardoor het uitgeklapte menu van WordPress (position:fixed) binnen de kop
     blijft hangen in plaats van over het scherm te vallen. */
  background:rgba(250,249,246,.94);
  border-bottom:1px solid transparent;
  transition:border-color .3s var(--lm-ease),background .3s var(--lm-ease);
}
.lm-header.is-vast{border-bottom-color:var(--lm-border);background:rgba(250,249,246,.96)}

.lm-header__binnen{
  display:flex;align-items:center;gap:var(--lm-sp-6);
  min-height:5.5rem;
}
.lm-merk{display:flex;align-items:center;flex:none;margin-right:auto}
.lm-merk img{width:clamp(190px,17vw,250px)}

.lm-nav{display:flex;align-items:center;gap:var(--lm-sp-5)}
.lm-nav a{
  font-size:var(--lm-fs-small);font-weight:500;color:var(--lm-text);
  padding:.4rem 0;position:relative;
}
.lm-nav a::after{
  content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;
  background:var(--lm-orange-500);transition:right .3s var(--lm-ease);
}
.lm-nav a:hover{color:var(--lm-navy-900)}
.lm-nav a:hover::after{right:0}

.lm-header .lm-btn{padding:.7rem 1.2rem}

.lm-menu-knop{
  display:none;background:none;border:1.5px solid var(--lm-border-strong);
  border-radius:var(--lm-r-md);padding:.6rem;cursor:pointer;color:var(--lm-navy-800);
}

@media (max-width:1040px){
  .lm-nav,.lm-header .lm-btn{display:none}
  .lm-menu-knop{display:flex}
  .lm-header__binnen{min-height:4.75rem}
}

/* Uitgeklapt menu op smal scherm */
.lm-mobielmenu{
  display:none;border-top:1px solid var(--lm-border);
  padding:var(--lm-sp-4) 0 var(--lm-sp-6);
}
.lm-mobielmenu.is-open{display:block}
.lm-mobielmenu a{
  display:block;padding:.8rem 0;font-weight:500;color:var(--lm-text);
  border-bottom:1px solid var(--lm-border);
}
.lm-mobielmenu .lm-btn{margin-top:var(--lm-sp-4);width:100%;justify-content:center}

/* ==========================================================================
   1 — Hero
   ========================================================================== */
.lm-hero{
  position:relative;overflow:hidden;
  padding-block:clamp(3.5rem,7vw,6.5rem) clamp(4rem,8vw,7rem);
}
.lm-hero::before{
  content:"";position:absolute;inset:auto -20% 0 auto;
  width:75vw;height:75vw;max-width:1000px;max-height:1000px;
  background:radial-gradient(circle at 60% 40%,rgba(102,176,224,.14),transparent 62%);
  pointer-events:none;
}
.lm-hero__grid{
  position:relative;display:grid;gap:clamp(2.5rem,5vw,4.5rem);
  grid-template-columns:minmax(0,1fr);align-items:center;
}
@media (min-width:1000px){
  .lm-hero__grid{grid-template-columns:minmax(0,1.02fr) minmax(0,1fr)}
}
.lm-hero__tekst{max-width:36rem}
.lm-hero h1{margin-bottom:var(--lm-sp-5)}
.lm-hero h1 em{
  font-style:normal;color:var(--lm-navy-700);
  background-image:linear-gradient(var(--lm-orange-400),var(--lm-orange-400));
  background-size:100% .22em;background-position:0 88%;background-repeat:no-repeat;
}
.lm-hero__lead{
  font-size:var(--lm-fs-lead);line-height:1.62;color:var(--lm-text-muted);
  margin-bottom:var(--lm-sp-6);max-width:32rem;
}
.lm-hero__payoff{
  display:flex;align-items:center;gap:var(--lm-sp-3);
  margin-top:var(--lm-sp-7);padding-top:var(--lm-sp-5);
  border-top:1px solid var(--lm-border);
  font-size:var(--lm-fs-small);color:var(--lm-text-muted);
}
.lm-hero__payoff b{color:var(--lm-navy-800);font-weight:600}

/* Het paneel met de ketenregie-visual */
.lm-visual{
  position:relative;border-radius:var(--lm-r-xl);
  background:
    radial-gradient(120% 90% at 78% 12%,rgba(62,140,196,.34),transparent 58%),
    radial-gradient(90% 80% at 12% 92%,rgba(232,130,58,.20),transparent 60%),
    linear-gradient(152deg,var(--lm-navy-800),var(--lm-navy-900));
  box-shadow:var(--lm-shadow-deep);
  padding:clamp(1.25rem,2.5vw,2rem);
  overflow:hidden;
}
.lm-visual::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  border-radius:inherit;border:1px solid rgba(185,214,236,.16);
}
.lm-visual svg{width:100%;height:auto;display:block}
.lm-visual__bijschrift{
  display:flex;align-items:baseline;gap:.75rem;flex-wrap:wrap;
  margin-top:var(--lm-sp-3);padding:0 .35rem;
  font-size:.8125rem;color:var(--lm-text-invert-muted);
}
.lm-visual__bijschrift b{color:#fff;font-weight:600}

/* Tekening: onderdelen, verbindingslijnen, kern */
.lm-knoop-vlak{fill:rgba(255,255,255,.055);stroke:rgba(185,214,236,.30);stroke-width:1}
.lm-knoop-tekst{
  font-family:var(--lm-font);font-size:13px;font-weight:500;
  fill:#DCE9F5;letter-spacing:.01em;
}
.lm-knoop--accent .lm-knoop-vlak{fill:rgba(232,130,58,.17);stroke:rgba(242,161,84,.55)}
.lm-knoop--accent .lm-knoop-tekst{fill:#FBD9BC}
.lm-draad{stroke:rgba(185,214,236,.34);stroke-width:1.15;fill:none}

/* Bij hover licht één onderdeel op en dimmen de andere. Dat maakt van de
   tekening iets waar je naar kijkt in plaats van een plaatje. */
.lm-knoop .lm-knoop-vlak,
.lm-knoop .lm-knoop-tekst{
  transition:fill .3s var(--lm-ease),stroke .3s var(--lm-ease),opacity .3s var(--lm-ease);
}
.lm-visual svg:hover .lm-knoop:not(:hover) .lm-knoop-vlak,
.lm-visual svg:hover .lm-knoop:not(:hover) .lm-knoop-tekst{opacity:.38}
.lm-knoop:hover .lm-knoop-vlak{fill:rgba(255,255,255,.15);stroke:rgba(185,214,236,.75)}
.lm-knoop:hover .lm-knoop-tekst{fill:#fff}
.lm-draad--accent{stroke:rgba(242,161,84,.6)}
.lm-ring{stroke:rgba(185,214,236,.16);stroke-width:1;fill:none}
.lm-kern-vlak{fill:rgba(255,255,255,.10);stroke:rgba(185,214,236,.5);stroke-width:1.25}
.lm-kern-tekst{font-family:var(--lm-font);font-size:16px;font-weight:600;fill:#fff;letter-spacing:-.01em}
.lm-kern-sub{font-family:var(--lm-font-mono);font-size:10px;font-weight:500;fill:var(--lm-blue-200);letter-spacing:.14em}

/* Intekenen bij het laden */
.lm-teken .lm-draad,.lm-teken .lm-ring{
  stroke-dasharray:var(--len,600);stroke-dashoffset:var(--len,600);
  animation:lm-teken-in 1.5s var(--lm-ease) forwards;
}
.lm-teken .lm-knoop,.lm-teken .lm-kern{
  opacity:0;animation:lm-op .8s var(--lm-ease) forwards;
}
@keyframes lm-teken-in{to{stroke-dashoffset:0}}
@keyframes lm-op{to{opacity:1}}

/* ==========================================================================
   2 — Het probleem: losse onderdelen die verbinding krijgen
   ========================================================================== */
.lm-losse{position:relative;margin-top:var(--lm-sp-7)}
.lm-losse__lijnen{
  position:absolute;inset:0;width:100%;height:100%;
  pointer-events:none;overflow:visible;
}
.lm-losse__lijnen path{
  stroke:var(--lm-blue-500);stroke-width:1.2;fill:none;opacity:.55;
  stroke-dasharray:var(--len,400);stroke-dashoffset:var(--len,400);
  transition:stroke-dashoffset 1.1s var(--lm-ease);
}
/* De dwarsverbindingen tussen buren liggen achter de spaken naar de kern en
   zijn zwakker: ze laten zien dat het een systeem is, niet een ster. */
.lm-losse__lijnen path.is-dwars{opacity:.28}
.lm-losse.is-verbonden .lm-losse__lijnen path{stroke-dashoffset:0}

.lm-losse__raster{
  position:relative;display:grid;gap:var(--lm-sp-4);
  grid-template-columns:minmax(0,1fr);
}
@media (min-width:760px){
  .lm-losse__raster{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:clamp(1.75rem,3.5vw,3rem) clamp(2rem,8vw,7rem);
  }
  .lm-losse__kern{grid-column:1/-1}
}

.lm-onderdeel{
  position:relative;z-index:1;
  background:var(--lm-surface);border:1px solid var(--lm-border);
  border-radius:var(--lm-r-md);padding:var(--lm-sp-4) var(--lm-sp-5);
  transform:translateY(var(--dy,0)) rotate(var(--rot,0deg));
  filter:grayscale(.5);opacity:.75;
  transition:transform .8s var(--lm-ease),filter .8s var(--lm-ease),
             opacity .8s var(--lm-ease),box-shadow .8s var(--lm-ease),
             border-color .8s var(--lm-ease);
}
.lm-losse.is-verbonden .lm-onderdeel{
  transform:none;filter:none;opacity:1;
  border-color:var(--lm-border-strong);box-shadow:var(--lm-shadow-1);
}
.lm-onderdeel h3{
  font-size:1.0625rem;margin-bottom:.15rem;
  display:flex;align-items:center;gap:.55rem;
}
.lm-onderdeel p{font-size:.875rem;color:var(--lm-text-muted);line-height:1.5}
.lm-onderdeel__punt{
  width:9px;height:9px;border-radius:50%;flex:none;
  background:var(--lm-border-strong);
  transition:background .8s var(--lm-ease),box-shadow .8s var(--lm-ease);
}
.lm-losse.is-verbonden .lm-onderdeel__punt{
  background:var(--lm-blue-500);box-shadow:0 0 0 4px rgba(62,140,196,.16);
}

/* De kern vult zich pas als de lijnen er zijn. Dat is de hele boodschap van
   deze sectie in één beweging. */
.lm-losse__kern{
  position:relative;z-index:2;
  display:grid;place-items:center;text-align:center;
  min-height:7.5rem;padding:var(--lm-sp-5);
  max-width:30rem;margin-inline:auto;width:100%;
  border:1.5px dashed var(--lm-border-strong);border-radius:var(--lm-r-lg);
  background:rgba(255,255,255,.55);
  transition:border-color .7s var(--lm-ease),background .7s var(--lm-ease),
             box-shadow .7s var(--lm-ease);
}
.lm-losse__kern > *{grid-area:1/1;transition:opacity .6s var(--lm-ease)}
.lm-losse.is-verbonden .lm-losse__kern{
  border-color:transparent;border-style:solid;
  background:linear-gradient(140deg,var(--lm-navy-800),var(--lm-navy-900));
  box-shadow:var(--lm-shadow-2);
}
.lm-losse__kern b{
  display:block;font-size:clamp(1.05rem,.95rem + .5vw,1.45rem);
  font-weight:600;letter-spacing:-.02em;line-height:1.25;
}
.lm-losse__kern small{
  display:block;margin-top:.4rem;font-size:.8125rem;
  letter-spacing:.1em;text-transform:uppercase;font-weight:600;
}
.lm-kern--los b{color:var(--lm-text-muted)}
.lm-kern--los small{color:var(--lm-orange-700)}
.lm-kern--heel{opacity:0}
.lm-kern--heel b{color:#fff}
.lm-kern--heel small{color:var(--lm-blue-200)}
.lm-losse.is-verbonden .lm-kern--los{opacity:0}
.lm-losse.is-verbonden .lm-kern--heel{opacity:1}

.lm-losse__slot{
  margin-top:var(--lm-sp-7);padding-top:var(--lm-sp-6);
  border-top:1px solid var(--lm-border);
  max-width:var(--lm-w-text);
}
.lm-losse__slot p{font-size:var(--lm-fs-lead);line-height:1.6;color:var(--lm-text)}

/* ==========================================================================
   3 — Definitie: grip naast groei
   ========================================================================== */
.lm-tweeluik{
  display:grid;gap:1px;background:var(--lm-border);
  border:1px solid var(--lm-border);border-radius:var(--lm-r-lg);
  overflow:hidden;margin-top:var(--lm-sp-7);
}
@media (min-width:860px){.lm-tweeluik{grid-template-columns:1fr 1fr}}
/* Vanaf 1040 px komt er een smalle middenkolom bij. Zonder die kolom staan
   grip en groei alleen naast elkaar; mét die kolom staat er wat de bezoeker
   moet onthouden: ze zijn geen keuze, ze zijn allebei nodig. */
@media (min-width:1040px){.lm-tweeluik{grid-template-columns:1fr 13rem 1fr}}

.lm-tweeluik__brug{
  position:relative;background:var(--lm-surface);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:var(--lm-sp-3);text-align:center;
  padding:var(--lm-sp-6) var(--lm-sp-4);
}
.lm-tweeluik__brug::before{
  content:"";position:absolute;left:50%;top:var(--lm-sp-5);bottom:var(--lm-sp-5);
  width:1px;background:var(--lm-border);
}
@media (max-width:1039px){
  .lm-tweeluik__brug::before{
    left:var(--lm-sp-5);right:var(--lm-sp-5);top:50%;bottom:auto;
    width:auto;height:1px;
  }
}
.lm-tweeluik__merk{
  position:relative;z-index:1;
  width:3rem;height:3rem;border-radius:50%;
  display:grid;place-items:center;
  background:var(--lm-navy-800);color:#fff;
  font-size:1.15rem;font-weight:600;
}
.lm-tweeluik__brug p{
  position:relative;z-index:1;font-size:.8125rem;line-height:1.5;
  color:var(--lm-text-muted);background:var(--lm-surface);
  padding:.35rem .5rem;margin:0;
}
.lm-tweeluik__brug b{color:var(--lm-navy-800);display:block}

.lm-kolom{background:var(--lm-surface);padding:clamp(1.5rem,3.2vw,2.5rem)}
.lm-kolom--groei{background:linear-gradient(180deg,#FFFFFF,#FDF8F3)}
.lm-kolom__kop{display:flex;align-items:baseline;gap:.75rem;margin-bottom:var(--lm-sp-4)}
.lm-kolom__kop h3{font-size:1.6rem;letter-spacing:-.02em}
.lm-kolom__kop span{font-size:var(--lm-fs-small);color:var(--lm-text-muted)}
.lm-kolom--grip .lm-kolom__kop h3{color:var(--lm-navy-700)}
.lm-kolom--groei .lm-kolom__kop h3{color:var(--lm-orange-700)}

.lm-rijen{border-top:1px solid var(--lm-border);margin-top:var(--lm-sp-5)}
.lm-rijen div{
  display:grid;grid-template-columns:8.5rem 1fr;gap:var(--lm-sp-4);
  padding:.85rem 0;border-bottom:1px solid var(--lm-border);
  font-size:var(--lm-fs-small);
}
.lm-rijen dt,.lm-rijen .lm-rijen__l{
  color:var(--lm-text-muted);font-weight:500;
}
.lm-rijen dd,.lm-rijen .lm-rijen__r{margin:0;color:var(--lm-text)}
@media (max-width:520px){
  .lm-rijen div{grid-template-columns:1fr;gap:.15rem}
}

.lm-citaat{
  margin:var(--lm-sp-7) 0 0;padding:var(--lm-sp-6) 0 0;
  border-top:2px solid var(--lm-orange-500);
  max-width:var(--lm-w-text);
}
.lm-citaat p{
  font-size:clamp(1.2rem,1.05rem + .7vw,1.6rem);line-height:1.45;
  letter-spacing:-.018em;color:var(--lm-navy-900);font-weight:500;
}
.lm-citaat footer{
  margin-top:var(--lm-sp-4);font-size:var(--lm-fs-small);color:var(--lm-text-muted);
}

/* ==========================================================================
   4 — Het model: fundament, regie, gedrag
   ========================================================================== */
/* Drie compacte kolommen in plaats van drie hoge banen. De verdieping zit
   in een <details>: dat is toetsenbordbedienbaar en werkt zonder JavaScript. */
.lm-lagen{margin-top:var(--lm-sp-7);display:grid;gap:var(--lm-sp-4)}
@media (min-width:880px){
  .lm-lagen{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}
}
.lm-laag{
  background:var(--lm-surface);border:1px solid var(--lm-border);
  border-top:3px solid var(--kleur,var(--lm-navy-700));
  border-radius:var(--lm-r-md);overflow:hidden;
  transition:box-shadow .35s var(--lm-ease);
}
.lm-laag:hover,.lm-laag[open]{box-shadow:var(--lm-shadow-2)}
.lm-laag > summary{
  cursor:pointer;list-style:none;
  padding:clamp(1.35rem,2.6vw,1.85rem);
  display:grid;gap:.4rem;
}
.lm-laag > summary::-webkit-details-marker{display:none}
.lm-laag > summary::marker{content:""}
.lm-laag h3{font-size:clamp(1.35rem,1.2rem + .6vw,1.65rem);color:var(--kleur,var(--lm-navy-800))}
.lm-laag__wat{font-size:var(--lm-fs-small);color:var(--lm-text-muted);line-height:1.55;margin:0}
.lm-laag__meer{
  display:inline-flex;align-items:center;gap:.4rem;margin-top:.5rem;
  font-size:.8125rem;font-weight:600;color:var(--lm-navy-700);
}
.lm-laag__meer::after{
  content:"";width:.6em;height:.6em;flex:none;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg) translate(-2px,-2px);
  transition:transform .3s var(--lm-ease);
}
.lm-laag[open] .lm-laag__meer::after{transform:rotate(-135deg) translate(-2px,-2px)}
.lm-laag[open] .lm-laag__meer span::after{content:" sluiten"}
.lm-laag__uit{
  padding:0 clamp(1.35rem,2.6vw,1.85rem) clamp(1.35rem,2.6vw,1.85rem);
  border-top:1px solid var(--lm-border);padding-top:var(--lm-sp-4);
}
.lm-laag__uit p{color:var(--lm-text-muted);font-size:var(--lm-fs-small);line-height:1.62}

.lm-chips{display:flex;flex-wrap:wrap;gap:.4rem}
.lm-chip{
  font-size:.8125rem;font-weight:500;padding:.32rem .7rem;
  border-radius:var(--lm-r-pill);border:1px solid var(--lm-border-strong);
  color:var(--lm-text-muted);background:var(--lm-paper);
}

.lm-lagen__slot{
  margin-top:var(--lm-sp-5);padding:var(--lm-sp-5) clamp(1.5rem,3vw,2.25rem);
  border:1px dashed var(--lm-border-strong);border-radius:var(--lm-r-lg);
  background:rgba(62,140,196,.05);
  font-size:var(--lm-fs-small);color:var(--lm-text-muted);
  max-width:none;
}
.lm-lagen__slot b{color:var(--lm-navy-800)}

/* ==========================================================================
   5 — Wat we doen: drie proposities, drie gezichten
   ========================================================================== */
.lm-proposities{display:grid;gap:var(--lm-sp-5);margin-top:var(--lm-sp-7)}
@media (min-width:920px){.lm-proposities{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}}

.lm-prop{
  display:flex;flex-direction:column;
  border-radius:var(--lm-r-lg);padding:clamp(1.5rem,3vw,2.25rem);
  min-height:22rem;position:relative;overflow:hidden;
  transition:transform .4s var(--lm-ease),box-shadow .4s var(--lm-ease);
}
.lm-prop:hover{transform:translateY(-4px)}
.lm-prop h3{margin-bottom:var(--lm-sp-3)}
.lm-prop p{font-size:var(--lm-fs-small);line-height:1.6}
.lm-prop ul{margin:var(--lm-sp-4) 0 0;display:grid;gap:.5rem}
.lm-prop li{
  font-size:var(--lm-fs-small);padding-left:1.1rem;position:relative;line-height:1.5;
}
.lm-prop li::before{
  content:"";position:absolute;left:0;top:.62em;width:5px;height:5px;border-radius:50%;
  background:currentColor;opacity:.42;
}
.lm-prop__voet{margin-top:auto;padding-top:var(--lm-sp-5)}

/* Advies — donker, het zwaartepunt */
.lm-prop--advies{
  background:linear-gradient(158deg,var(--lm-navy-800),var(--lm-navy-900));
  color:#fff;box-shadow:var(--lm-shadow-2);
}
.lm-prop--advies h3{color:#fff}
.lm-prop--advies p,.lm-prop--advies li{color:var(--lm-text-invert-muted)}
.lm-prop--advies:hover{box-shadow:var(--lm-shadow-deep)}

/* Opleiding — papier met oranje signatuur en de dagstrook */
.lm-prop--opleiding{
  background:var(--lm-surface);border:1px solid var(--lm-border);
  box-shadow:var(--lm-shadow-1);
}
.lm-prop--opleiding:hover{box-shadow:var(--lm-shadow-2)}
.lm-prop--opleiding::before{
  content:"";position:absolute;inset:0 0 auto;height:4px;
  background:linear-gradient(90deg,var(--lm-dag1) 0 33.33%,var(--lm-dag2) 33.33% 66.66%,var(--lm-dag3) 66.66%);
}
.lm-prop--opleiding p,.lm-prop--opleiding li{color:var(--lm-text-muted)}

/* Digitale ondersteuning — blauwgrijs, duidelijk in ontwikkeling */
.lm-prop--digitaal{
  background:var(--lm-surface-soft);border:1px solid var(--lm-border);
}
.lm-prop--digitaal p,.lm-prop--digitaal li{color:var(--lm-text-muted)}
.lm-prop--digitaal::after{
  content:"";position:absolute;right:-3rem;bottom:-3rem;width:12rem;height:12rem;
  border-radius:50%;border:1px dashed var(--lm-border-strong);opacity:.7;
}

/* ==========================================================================
   6 — Volwassenheid: de ladder
   ========================================================================== */
.lm-ladder{display:grid;gap:1px;background:var(--lm-border-invert);margin-top:var(--lm-sp-7)}
@media (min-width:900px){
  .lm-ladder{grid-template-columns:repeat(5,minmax(0,1fr));align-items:end}
}
.lm-trede{
  background:var(--lm-navy-800);padding:var(--lm-sp-5);
  display:flex;flex-direction:column;gap:.5rem;
  position:relative;transition:background .35s var(--lm-ease);
}
.lm-trede:hover{background:var(--lm-navy-700)}
@media (min-width:900px){
  .lm-trede{min-height:calc(12.5rem + var(--trap,0) * 3.1rem);justify-content:flex-end}
}
.lm-trede__nr{
  font-family:var(--lm-font-mono);font-size:.8125rem;font-weight:500;
  color:var(--lm-blue-400);letter-spacing:.1em;
}
.lm-trede h3{font-size:1.3125rem;color:#fff}
.lm-trede p{font-size:.875rem;line-height:1.5;color:var(--lm-text-invert-muted)}
.lm-trede__balk{
  height:3px;border-radius:2px;margin-bottom:.35rem;
  background:linear-gradient(90deg,var(--lm-blue-500),var(--lm-orange-500));
  width:calc(20% + var(--trap,0) * 20%);
}
.lm-ladder__bron{
  margin-top:var(--lm-sp-5);font-size:.875rem;color:var(--lm-text-invert-muted);
  max-width:var(--lm-w-text);
}
.lm-ladder__bron a{color:#fff;text-decoration:underline;text-underline-offset:3px}

/* ==========================================================================
   7 — Opleiding
   ========================================================================== */
.lm-dagen{display:grid;gap:var(--lm-sp-5);margin-top:var(--lm-sp-7)}
@media (min-width:880px){.lm-dagen{grid-template-columns:repeat(3,minmax(0,1fr))}}
.lm-dag{
  background:var(--lm-surface);border:1px solid var(--lm-border);
  border-top:3px solid var(--kleur);border-radius:var(--lm-r-md);
  padding:clamp(1.35rem,2.6vw,1.85rem);
  display:flex;flex-direction:column;gap:var(--lm-sp-3);
  transition:box-shadow .35s var(--lm-ease),transform .35s var(--lm-ease);
}
.lm-dag:hover{box-shadow:var(--lm-shadow-2);transform:translateY(-3px)}
.lm-dag__nr{font-family:var(--lm-font-mono);font-size:.8125rem;color:var(--kleur);letter-spacing:.12em;font-weight:500}
.lm-dag h3{font-size:1.3rem}
.lm-dag p{font-size:var(--lm-fs-small);color:var(--lm-text-muted);line-height:1.6}
.lm-dag ul{margin-top:auto;padding-top:var(--lm-sp-4);display:flex;flex-wrap:wrap;gap:.35rem}
.lm-dag li{
  font-size:.75rem;font-weight:500;padding:.25rem .55rem;border-radius:var(--lm-r-sm);
  background:var(--lm-surface-soft);color:var(--lm-text-muted);
}

.lm-feiten{
  display:grid;gap:var(--lm-sp-5);margin-top:var(--lm-sp-6);
  padding-top:var(--lm-sp-6);border-top:1px solid var(--lm-border);
  grid-template-columns:repeat(2,minmax(0,1fr));
}
@media (min-width:760px){.lm-feiten{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* Het label staat bóven het cijfer. Een getal dat als eerste in beeld komt
   roept de vraag "waarvan?" op; een label dat als eerste komt niet. */
.lm-feit span{
  display:block;font-size:.75rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--lm-text-muted);margin-bottom:.4rem;
}
.lm-feit strong{
  display:block;font-size:clamp(1.6rem,1.3rem + 1.2vw,2.1rem);
  font-weight:600;letter-spacing:-.03em;color:var(--lm-navy-800);line-height:1.15;
}
.lm-feit small{
  display:block;margin-top:.3rem;font-size:var(--lm-fs-small);
  color:var(--lm-text-muted);line-height:1.45;
}

/* ==========================================================================
   8 — Principes
   ========================================================================== */
.lm-principes{display:grid;gap:1px;background:var(--lm-border);margin-top:var(--lm-sp-7);
  border:1px solid var(--lm-border);border-radius:var(--lm-r-lg);overflow:hidden}
@media (min-width:760px){.lm-principes{grid-template-columns:1fr 1fr}}
.lm-principe{
  background:var(--lm-paper);padding:clamp(1.5rem,3vw,2.25rem);
  display:grid;grid-template-columns:2.5rem 1fr;gap:var(--lm-sp-4);align-items:start;
  transition:background .35s var(--lm-ease);
}
.lm-principe:hover{background:var(--lm-surface)}
.lm-principe h3{font-size:1.25rem;letter-spacing:-.015em;margin-bottom:.4rem}
.lm-principe p{font-size:var(--lm-fs-small);color:var(--lm-text-muted);line-height:1.62}

/* ==========================================================================
   9 — Kennis
   ========================================================================== */
.lm-artikelen{display:grid;gap:var(--lm-sp-5);margin-top:var(--lm-sp-7)}
@media (min-width:860px){.lm-artikelen{grid-template-columns:repeat(3,minmax(0,1fr))}}
.lm-artikel{
  display:flex;flex-direction:column;gap:var(--lm-sp-3);
  padding-top:var(--lm-sp-4);border-top:2px solid var(--lm-navy-800);
}
.lm-artikel--leeg{border-top-color:var(--lm-border-strong)}
.lm-artikel__meta{
  display:flex;gap:.6rem;align-items:center;
  font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;
  font-weight:600;color:var(--lm-text-muted);
}
.lm-artikel h3{font-size:1.1875rem;line-height:1.35}
.lm-artikel p{font-size:var(--lm-fs-small);color:var(--lm-text-muted);line-height:1.6}
.lm-artikel__voet{margin-top:auto;padding-top:var(--lm-sp-3)}
/* Een gepubliceerd artikel heeft een link als kop. Die mag daar niet kleiner
   van worden dan de titels die nog geschreven moeten worden. */
.lm-artikel h3 .lm-link{font-size:inherit;font-weight:inherit;line-height:inherit;display:inline}
.lm-artikel h3 .lm-link:hover{color:var(--lm-orange-700)}

/* ==========================================================================
   10 — Slot
   ========================================================================== */
.lm-slot{
  position:relative;overflow:hidden;
  background:
    radial-gradient(100% 120% at 85% 0%,rgba(62,140,196,.26),transparent 60%),
    radial-gradient(80% 100% at 5% 100%,rgba(232,130,58,.16),transparent 62%),
    linear-gradient(150deg,var(--lm-navy-800),var(--lm-navy-900));
  color:#fff;
}
.lm-slot__grid{
  display:grid;gap:var(--lm-sp-7);align-items:center;
}
@media (min-width:900px){.lm-slot__grid{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}}
.lm-slot h2{color:#fff;max-width:20ch}
.lm-slot p{color:var(--lm-text-invert-muted);font-size:var(--lm-fs-lead);line-height:1.6;margin-top:var(--lm-sp-4)}
.lm-slot__kaart{
  background:rgba(255,255,255,.055);border:1px solid var(--lm-border-invert);
  border-radius:var(--lm-r-lg);padding:clamp(1.5rem,3vw,2.25rem);
  backdrop-filter:blur(6px);
}
/* Zonder eigen kleur erft deze kop de donkere koptekstkleur en valt hij weg
   op het navy vlak. */
.lm-slot h3,
.lm-slot__kaart h3{color:#fff}
.lm-slot__kaart h3{font-size:1.1875rem;margin-bottom:var(--lm-sp-4)}
.lm-slot__kaart ul{display:grid;gap:.75rem;margin-bottom:var(--lm-sp-6)}
.lm-slot__kaart li{
  font-size:var(--lm-fs-small);color:var(--lm-text-invert-muted);
  padding-left:1.4rem;position:relative;line-height:1.5;
}
.lm-slot__kaart li::before{
  content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;
  border-radius:50%;border:1.5px solid var(--lm-orange-400);
}

/* ==========================================================================
   Footer
   ========================================================================== */
.lm-footer{background:var(--lm-navy-900);color:var(--lm-text-invert-muted);padding-block:var(--lm-sp-9) var(--lm-sp-6)}
.lm-footer__grid{display:grid;gap:var(--lm-sp-7)}
@media (min-width:860px){.lm-footer__grid{grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr))}}
.lm-footer__plaat{
  background:#fff;border-radius:var(--lm-r-md);padding:.9rem 1.1rem;
  display:inline-block;margin-bottom:var(--lm-sp-4);
}
.lm-footer__plaat img{width:215px}
.lm-footer p{font-size:var(--lm-fs-small);line-height:1.65;max-width:30ch}
.lm-footer h3{
  font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;
  color:#fff;margin-bottom:var(--lm-sp-4);font-weight:600;
}
.lm-footer ul{display:grid;gap:.6rem}
.lm-footer a{color:var(--lm-text-invert-muted);font-size:var(--lm-fs-small)}
.lm-footer a:hover{color:#fff}
.lm-footer__voet{
  margin-top:var(--lm-sp-8);padding-top:var(--lm-sp-5);
  border-top:1px solid rgba(185,214,236,.14);
  display:flex;flex-wrap:wrap;gap:var(--lm-sp-4);justify-content:space-between;
  font-size:.8125rem;
}

/* ==========================================================================
   Grote uitspraak zonder kader
   Bewust geen kaart, geen rand, geen achtergrond: dit is de ademhaling tussen
   twee secties die allebei uit onderdelen bestaan.
   ========================================================================== */
.lm-toon{
  max-width:24ch;margin:0 auto;text-align:center;
  font-size:clamp(1.5rem,1.1rem + 2vw,2.5rem);
  font-weight:600;line-height:1.24;letter-spacing:-.025em;
  color:var(--lm-navy-900);
}
.lm-toon em{font-style:normal;color:var(--lm-orange-700)}
.lm-toon__bij{
  max-width:38ch;margin:var(--lm-sp-5) auto 0;text-align:center;
  font-size:var(--lm-fs-small);color:var(--lm-text-muted);line-height:1.6;
}
.lm-section--deep .lm-toon{color:#fff}
.lm-section--deep .lm-toon em{color:var(--lm-orange-400)}
.lm-section--deep .lm-toon__bij{color:var(--lm-text-invert-muted)}

/* ==========================================================================
   Videosectie
   ========================================================================== */
.lm-video__grid{display:grid;gap:clamp(2rem,4vw,3.5rem);align-items:center}
@media (min-width:980px){
  .lm-video__grid{grid-template-columns:minmax(0,.82fr) minmax(0,1fr)}
}
/* Op een telefoon staat het beeld boven de tekst; in de DOM staat de tekst
   eerst, zodat een schermlezer de kop krijgt voordat hij bij de speler komt. */
@media (max-width:979px){
  .lm-video__speler{order:-1}
}

.lm-video__tekst h2{
  font-size:clamp(1.7rem,1.25rem + 1.5vw,2.3rem);
  margin-bottom:var(--lm-sp-4);
}
.lm-video__tekst p{color:var(--lm-text-invert-muted)}
.lm-video__duur{
  display:inline-flex;align-items:center;gap:.5rem;
  margin-top:var(--lm-sp-5);font-size:.8125rem;
  color:var(--lm-text-invert-muted);
}
.lm-video__duur::before{
  content:"";width:6px;height:6px;border-radius:50%;
  background:var(--lm-orange-400);flex:none;
}

.lm-video__kaart{
  position:relative;aspect-ratio:16/9;overflow:hidden;
  border-radius:var(--lm-r-lg);
  background:var(--lm-navy-900);
  border:1px solid var(--lm-border-invert);
  box-shadow:var(--lm-shadow-deep);
}
.lm-video__kaart img,
.lm-video__kaart video{width:100%;height:100%;object-fit:cover;display:block}
.lm-video__kaart::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(11,31,53,.05),rgba(11,31,53,.45));
  transition:opacity .4s var(--lm-ease);
}
.lm-video__kaart.is-speelt::after{opacity:0}

.lm-video__speel{
  position:absolute;inset:0;z-index:2;
  display:grid;place-items:center;
  background:none;border:0;cursor:pointer;color:#fff;font:inherit;
}
.lm-video__speel span{
  display:grid;place-items:center;
  width:clamp(3.75rem,7vw,5rem);aspect-ratio:1;border-radius:50%;
  background:rgba(255,255,255,.16);
  border:1.5px solid rgba(255,255,255,.55);
  transition:background .3s var(--lm-ease),transform .3s var(--lm-ease);
}
.lm-video__speel:hover span{background:rgba(255,255,255,.28);transform:scale(1.05)}
.lm-video__speel svg{width:1.6rem;height:1.6rem;margin-left:.15rem}
.lm-video__kaart.is-speelt .lm-video__speel{display:none}

/* Stand zolang de opname er nog niet is. De knop is dan geen knop. */
.lm-video__wacht{
  position:absolute;left:var(--lm-sp-4);bottom:var(--lm-sp-4);z-index:3;
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.45rem .8rem;border-radius:var(--lm-r-pill);
  background:rgba(11,31,53,.74);border:1px solid rgba(255,255,255,.22);
  color:#fff;font-size:.75rem;font-weight:600;letter-spacing:.04em;
}
.lm-video__wacht::before{
  content:"";width:7px;height:7px;border-radius:50%;
  background:var(--lm-orange-400);flex:none;
}
.lm-video__kaart--wacht .lm-video__speel span{
  background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.25);opacity:.5;
}

.lm-video__transcript{margin-top:var(--lm-sp-5);font-size:var(--lm-fs-small)}
.lm-video__transcript summary{cursor:pointer;color:var(--lm-blue-200);font-weight:600}
.lm-video__transcript[open] summary{margin-bottom:var(--lm-sp-3)}
.lm-video__transcript p{
  color:var(--lm-text-invert-muted);line-height:1.65;max-width:var(--lm-w-text);
}

/* ==========================================================================
   Ontwikkelroute — vijf stappen op één lijn
   ========================================================================== */
.lm-route{position:relative;display:grid;gap:var(--lm-sp-5);margin-top:var(--lm-sp-8)}
@media (min-width:920px){
  .lm-route{grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--lm-sp-4)}
}
.lm-stap{position:relative;padding-left:var(--lm-sp-6)}
@media (min-width:920px){
  .lm-stap{padding-left:0;padding-top:var(--lm-sp-6)}
}
/* De lijn die de stappen verbindt: verticaal op een telefoon, horizontaal op
   een breed scherm. Hij loopt dóór tussen de stappen, want dat is het punt. */
.lm-stap::before{
  content:"";position:absolute;left:5px;top:1.4rem;bottom:calc(-1 * var(--lm-sp-5));
  width:2px;background:var(--lm-border-strong);
}
.lm-stap:last-child::before{display:none}
@media (min-width:920px){
  .lm-stap::before{
    left:0;right:calc(-1 * var(--lm-sp-4));top:6px;bottom:auto;
    width:auto;height:2px;
  }
}
.lm-stap__bol{
  position:absolute;left:0;top:.95rem;
  width:12px;height:12px;border-radius:50%;
  background:var(--lm-surface);border:2px solid var(--lm-blue-500);z-index:1;
}
@media (min-width:920px){.lm-stap__bol{top:0}}
.lm-stap--slot .lm-stap__bol{background:var(--lm-orange-500);border-color:var(--lm-orange-500)}
.lm-stap__vorm{
  display:block;font-family:var(--lm-font-mono);font-size:.6875rem;
  letter-spacing:.14em;text-transform:uppercase;
  /* orange-600 haalde op papierwit maar 3,6:1; deze tint haalt 5,1:1. */
  color:var(--lm-orange-700);margin-bottom:.35rem;
}
.lm-stap h3{font-size:1.1875rem;margin-bottom:.35rem}
.lm-stap p{font-size:.875rem;color:var(--lm-text-muted);line-height:1.5}

/* ==========================================================================
   Productbeeld in een browseromlijsting
   ========================================================================== */
.lm-beeld{
  border-radius:var(--lm-r-lg);overflow:hidden;
  border:1px solid var(--lm-border-strong);
  background:var(--lm-surface);box-shadow:var(--lm-shadow-2);
}
.lm-beeld__balk{
  display:flex;align-items:center;gap:.4rem;
  padding:.6rem .85rem;background:var(--lm-surface-soft);
  border-bottom:1px solid var(--lm-border);
}
.lm-beeld__balk i{width:9px;height:9px;border-radius:50%;background:var(--lm-border-strong);flex:none}
.lm-beeld__balk span{
  margin-left:.6rem;font-size:.6875rem;color:var(--lm-text-muted);
  font-family:var(--lm-font-mono);
}
.lm-beeld img{display:block;width:100%;height:auto}

.lm-beeldgroep{display:grid;gap:var(--lm-sp-4);margin-top:var(--lm-sp-7)}
@media (min-width:900px){
  .lm-beeldgroep{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lm-beeldgroep > .lm-beeld:first-child{grid-column:1/-1}
}

/* ==========================================================================
   Kennis: klein houden zolang er niets gepubliceerd is
   ========================================================================== */
.lm-binnenkort{display:grid;gap:var(--lm-sp-5);margin-top:var(--lm-sp-6);align-items:center}
@media (min-width:820px){
  .lm-binnenkort{grid-template-columns:minmax(0,1fr) auto}
}
.lm-binnenkort ul{display:grid;gap:.5rem}
.lm-binnenkort li{
  font-size:var(--lm-fs-small);color:var(--lm-text-muted);
  padding-left:1.1rem;position:relative;line-height:1.5;
}
.lm-binnenkort li::before{
  content:"";position:absolute;left:0;top:.62em;
  width:5px;height:5px;border-radius:50%;background:var(--lm-border-strong);
}

/* Middelen onder een propositie: secundair, want de website verkoopt de
   uitkomst en niet het gereedschap. */
.lm-prop__middel{
  margin-top:var(--lm-sp-4);padding-top:var(--lm-sp-3);
  border-top:1px solid currentColor;border-top-color:rgba(128,128,128,.22);
  font-size:.8125rem;opacity:.85;
}

/* ==========================================================================
   Portfolio-overzicht — de rustige band bovenin
   Geen kaarten: vier kolommen met een streep erboven. Dit hoort het kalmste
   blok van de pagina te zijn, want het komt meteen na de hero.
   ========================================================================== */
.lm-portfolio{display:grid;gap:var(--lm-sp-6);margin-top:var(--lm-sp-7)}
@media (min-width:700px){
  .lm-portfolio{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--lm-sp-6) var(--lm-sp-7)}
}
@media (min-width:1000px){
  .lm-portfolio{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* Het werkwoordenpaar is de kern van elk blok: wat doet dit onderdeel met u? */
.lm-onderdeel-blok__paar{
  font-size:1.0625rem;font-weight:600;letter-spacing:-.01em;
  color:var(--kleur,var(--lm-navy-800));
  margin:0 0 .5rem;
}

/* Het spel: vier korte blokken, geen kaders — de sectie staat al op een
   eigen warme grond. */
.lm-spel{display:grid;gap:var(--lm-sp-5) var(--lm-sp-7);margin-top:var(--lm-sp-6)}
@media (min-width:820px){.lm-spel{grid-template-columns:repeat(2,minmax(0,1fr))}}
.lm-spel__blok h3{font-size:1.1875rem;margin-bottom:.4rem}
.lm-spel__blok p{font-size:var(--lm-fs-small);color:var(--lm-text-muted);line-height:1.6}
.lm-onderdeel-blok{
  padding-top:var(--lm-sp-4);
  border-top:2px solid var(--kleur,var(--lm-navy-800));
}
.lm-onderdeel-blok h3{font-size:1.1875rem;margin-bottom:.4rem}
.lm-onderdeel-blok p{font-size:var(--lm-fs-small);color:var(--lm-text-muted);line-height:1.55}
.lm-onderdeel-blok__begin{
  display:block;margin-top:var(--lm-sp-4);padding-top:var(--lm-sp-3);
  border-top:1px solid var(--lm-border);
  font-size:.8125rem;color:var(--lm-text);
}
.lm-onderdeel-blok__begin b{color:var(--kleur,var(--lm-navy-800));font-weight:600}

/* ==========================================================================
   Twee waardeketens die elkaar kruisen
   ========================================================================== */
.lm-ketens{display:grid;gap:var(--lm-sp-5);margin-top:var(--lm-sp-7)}
.lm-keten{
  background:var(--lm-surface);border:1px solid var(--lm-border);
  border-left:3px solid var(--kleur,var(--lm-navy-700));
  border-radius:var(--lm-r-md);padding:var(--lm-sp-5);
}
.lm-keten__naam{
  display:block;font-size:.75rem;font-weight:600;letter-spacing:.11em;
  text-transform:uppercase;color:var(--kleur,var(--lm-navy-700));
  margin-bottom:var(--lm-sp-3);
}
.lm-keten__rij{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .5rem}
.lm-keten__rij li{
  font-size:var(--lm-fs-small);font-weight:500;
  padding:.35rem .7rem;border-radius:var(--lm-r-sm);
  background:var(--lm-surface-soft);color:var(--lm-text);
}
.lm-keten__rij li::after{
  content:"→";margin-left:.7rem;color:var(--lm-text-muted);font-weight:400;
}
.lm-keten__rij li:last-child::after{content:none}
.lm-keten p{margin-top:var(--lm-sp-3);font-size:.875rem;color:var(--lm-text-muted);line-height:1.55}

.lm-kruispunt{
  margin-top:var(--lm-sp-5);padding:var(--lm-sp-5);
  border:1px dashed var(--lm-border-strong);border-radius:var(--lm-r-md);
  background:rgba(62,140,196,.05);
}
.lm-kruispunt b{color:var(--lm-navy-800)}
.lm-kruispunt p{font-size:var(--lm-fs-small);color:var(--lm-text-muted);line-height:1.6}

.lm-modules{display:grid;gap:var(--lm-sp-3);margin-top:var(--lm-sp-6)}
@media (min-width:640px){.lm-modules{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:980px){.lm-modules{grid-template-columns:repeat(3,minmax(0,1fr))}}
.lm-module{
  background:var(--lm-surface);border:1px solid var(--lm-border);
  border-radius:var(--lm-r-md);padding:var(--lm-sp-4) var(--lm-sp-5);
}
.lm-module h3{font-size:1.0625rem;margin-bottom:.2rem}
.lm-module p{font-size:.8125rem;color:var(--lm-text-muted);line-height:1.5}

/* ==========================================================================
   Wat op een telefoon anders moet
   De pagina is op desktop bewust lang: daar scant iemand met zijn ogen. Op
   een telefoon scrolt hij met zijn duim, en dan is dezelfde lengte geen
   rijkdom maar een hindernis. Hieronder wordt de pagina compacter gemaakt —
   niet door inhoud weg te halen, maar door detail achter een tik te zetten
   en de ademruimte terug te brengen naar wat op een klein scherm nog werkt.
   ========================================================================== */
@media (max-width:719px){
  :root{
    --lm-section:3.25rem;
    --lm-sp-7:2rem;
    --lm-sp-8:2.5rem;
  }
  .lm-section--tight{padding-block:2.75rem}
  .lm-kop{margin-bottom:var(--lm-sp-5)}

  /* De inleiding onder een sectiekop mag korter ogen. */
  .lm-kop p{font-size:1.0625rem;line-height:1.55}

  /* De twee detailkolommen van een propositie werden torenhoog. */
  .lm-prop{min-height:0;padding:var(--lm-sp-5)}
  .lm-prop ul{gap:.35rem}

  /* Van de drie productbeelden blijft er één over. De twee detailopnamen
     zijn op 350 px breed toch niet te lezen. */
  .lm-beeldgroep > .lm-beeld:not(:first-child){display:none}

  /* Het systeemdiagram: minder lucht tussen de knopen. */
  .lm-losse__raster{gap:var(--lm-sp-3)}
  .lm-onderdeel{padding:var(--lm-sp-3) var(--lm-sp-4)}
  .lm-losse__kern{min-height:5.5rem;padding:var(--lm-sp-4)}

  /* De ladder wordt een lijst; vijf blokken van 12 rem is een halve scroll. */
  .lm-trede{padding:var(--lm-sp-4)}
  .lm-trede__balk{display:none}
  .lm-trede p{font-size:.8125rem}

  .lm-route{gap:var(--lm-sp-4);margin-top:var(--lm-sp-6)}
  .lm-stap p{font-size:.8125rem}

  .lm-principe{padding:var(--lm-sp-4) var(--lm-sp-5)}
  .lm-principe p{font-size:.875rem}

  .lm-dag{padding:var(--lm-sp-4)}
  .lm-feiten{gap:var(--lm-sp-4)}

  .lm-portfolio{gap:var(--lm-sp-5)}
  .lm-keten{padding:var(--lm-sp-4)}

  .lm-slot__kaart{padding:var(--lm-sp-5)}
  .lm-footer{padding-block:var(--lm-sp-7) var(--lm-sp-5)}
  .lm-footer__grid{gap:var(--lm-sp-5)}
}

/* ==========================================================================
   Inklapbaar detail — op telefoon en tablet
   Op een breed scherm staat dit open en is de samenvatting onzichtbaar.
   Daaronder sluit een klein script het en wordt het een tikbare regel. De
   grens ligt op dezelfde breedte als die van het hamburgermenu: waar de
   navigatie niet meer past, past de volledige pagina ook niet meer.
   ========================================================================== */
.lm-inklap{margin:0}
.lm-inklap > summary{
  display:none;cursor:pointer;list-style:none;
  padding:.7rem 0;margin-top:var(--lm-sp-3);
  border-top:1px solid var(--lm-border);
  font-size:var(--lm-fs-small);font-weight:600;color:var(--lm-navy-700);
}
.lm-inklap > summary::-webkit-details-marker{display:none}
.lm-inklap > summary::after{
  content:"";display:inline-block;width:.55em;height:.55em;
  margin-left:.5rem;vertical-align:.08em;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg) translate(-2px,-2px);
  transition:transform .3s var(--lm-ease);
}
.lm-inklap[open] > summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
@media (max-width:1040px){
  .lm-inklap > summary{display:block}
}

/* ==========================================================================
   De cirkel — waar de route in overgaat
   Vier kwadranten in één kleurfamilie met oranje op de stap die iets
   verandert. Geen regenboog: de kleuren lopen van donker naar licht mee met
   de beweging.
   ========================================================================== */
.lm-cirkel{
  display:grid;gap:clamp(2rem,4vw,3.5rem);align-items:center;
  margin-top:var(--lm-sp-8);
}
@media (min-width:900px){
  .lm-cirkel{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
.lm-cirkel__tekening{max-width:29rem;margin-inline:auto;width:100%}
.lm-cirkel__tekening svg{width:100%;height:auto;display:block;overflow:visible}

.lm-boog{fill:none;stroke-width:44;stroke-linecap:butt;transition:opacity .3s var(--lm-ease)}
/* Het nummer staat óp de gekleurde band, het woord ernaast op de papiergrond.
   Twee kleuren dus, en niet één. */
.lm-kwadrant-nummer{
  font-family:var(--lm-font);font-size:21px;font-weight:600;fill:#fff;
}
.lm-kwadrant-tekst{
  font-family:var(--lm-font);font-size:13.5px;font-weight:600;
  fill:var(--lm-navy-900);letter-spacing:.1em;
}
.lm-cirkel__tekening svg:hover .lm-kwadrant:not(:hover){opacity:.35}
.lm-kwadrant{transition:opacity .3s var(--lm-ease);cursor:default}

.lm-cirkel-kern-klein{
  font-family:var(--lm-font);font-size:12.5px;font-weight:500;
  fill:var(--lm-text-muted);letter-spacing:.02em;
}
.lm-cirkel-kern{
  font-family:var(--lm-font);font-size:25px;font-weight:600;
  fill:var(--lm-navy-900);letter-spacing:-.02em;
}

/* De stappen ernaast. Genummerd, want de volgorde is het punt. */
.lm-cirkel__stappen{display:grid;gap:var(--lm-sp-4)}
.lm-cirkel__stap{
  display:grid;grid-template-columns:auto 1fr;gap:var(--lm-sp-4);
  align-items:start;padding-bottom:var(--lm-sp-4);
  border-bottom:1px solid var(--lm-border);
}
.lm-cirkel__stap:last-child{border-bottom:0;padding-bottom:0}
.lm-cirkel__stap b{
  display:grid;place-items:center;
  width:2.1rem;height:2.1rem;border-radius:50%;
  background:var(--kleur,var(--lm-navy-700));color:#fff;
  font-size:.8125rem;font-weight:600;
}
.lm-cirkel__stap h4{
  margin:0 0 .15rem;font-size:1.0625rem;font-weight:600;
  color:var(--lm-navy-900);letter-spacing:-.01em;
}
.lm-cirkel__stap p{font-size:var(--lm-fs-small);color:var(--lm-text-muted);line-height:1.55}

@media (max-width:719px){
  .lm-cirkel{gap:var(--lm-sp-6);margin-top:var(--lm-sp-6)}
  .lm-cirkel__tekening{max-width:21rem}
  .lm-cirkel__stap{gap:var(--lm-sp-3);padding-bottom:var(--lm-sp-3)}
}

/* ==========================================================================
   De vier werelden — kort, in één regel per stuk
   ========================================================================== */
.lm-werelden{display:grid;gap:var(--lm-sp-5);margin-top:var(--lm-sp-7)}
@media (min-width:700px){.lm-werelden{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:980px){.lm-werelden{grid-template-columns:repeat(4,minmax(0,1fr))}}
.lm-wereld{padding-top:var(--lm-sp-4);border-top:3px solid var(--kleur,var(--lm-navy-700))}
.lm-wereld h3{font-size:1.1875rem;margin-bottom:.25rem}
.lm-wereld p{font-size:var(--lm-fs-small);color:var(--lm-text-muted);line-height:1.5}

/* De regel onder de naam in de cirkel: het werkwoord. */
.lm-kwadrant-onder{
  font-family:var(--lm-font);font-size:12px;font-weight:500;
  fill:var(--lm-text-muted);letter-spacing:.02em;
}

/* ==========================================================================
   Interne regie ⇄ externe keten
   Leveranciersmanagement is hier geen smal blokje ertussen: de band loopt
   over de volle hoogte, want het grijpt terug de organisatie in.
   ========================================================================== */
.lm-regie{display:grid;gap:var(--lm-sp-4);margin-top:var(--lm-sp-7)}
@media (min-width:900px){
  .lm-regie{grid-template-columns:minmax(0,1fr) minmax(9rem,13rem) minmax(0,1fr);align-items:stretch}
}
.lm-regie__kant{
  background:var(--lm-surface);border:1px solid var(--lm-border);
  border-radius:var(--lm-r-md);padding:var(--lm-sp-5);
}
.lm-regie__kant--intern{border-top:3px solid var(--lm-navy-700)}
.lm-regie__kant--extern{border-top:3px solid var(--lm-blue-500)}
.lm-regie__naam{
  display:block;font-size:.75rem;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--lm-text-muted);margin-bottom:var(--lm-sp-4);
}
.lm-regie__lijst{display:grid;gap:.55rem;counter-reset:regie}
.lm-regie__lijst li{
  position:relative;padding-left:1.5rem;
  font-size:var(--lm-fs-small);font-weight:500;color:var(--lm-text);line-height:1.4;
}
.lm-regie__lijst li::before{
  counter-increment:regie;content:counter(regie);
  position:absolute;left:0;top:.05em;
  font-family:var(--lm-font-mono);font-size:.6875rem;color:var(--lm-text-muted);
}

.lm-regie__brug{
  display:flex;flex-direction:row;align-items:center;justify-content:center;
  gap:var(--lm-sp-3);text-align:center;
  background:linear-gradient(150deg,var(--lm-navy-800),var(--lm-navy-900));
  color:#fff;border-radius:var(--lm-r-md);padding:var(--lm-sp-5) var(--lm-sp-4);
}
@media (min-width:900px){.lm-regie__brug{flex-direction:column}}
.lm-regie__brugnaam{font-size:var(--lm-fs-small);font-weight:600;line-height:1.35}
.lm-regie__pijl{font-size:1.5rem;color:var(--lm-orange-400);line-height:1}
@media (min-width:900px){.lm-regie__pijl{transform:rotate(90deg)}}

.lm-regie__balk{
  margin-top:var(--lm-sp-4);
  background:var(--lm-surface);border:1px solid var(--lm-border-strong);
  border-radius:var(--lm-r-md);padding:var(--lm-sp-5);
  display:grid;gap:var(--lm-sp-3);
}
@media (min-width:820px){
  .lm-regie__balk{grid-template-columns:auto 1fr;align-items:center;gap:var(--lm-sp-6)}
}
.lm-regie__balknaam{
  font-size:1.0625rem;font-weight:600;color:var(--lm-orange-700);
  letter-spacing:-.01em;white-space:nowrap;
}
.lm-regie__balk ul{display:flex;flex-wrap:wrap;gap:.4rem}
.lm-regie__balk li{
  font-size:.8125rem;font-weight:500;padding:.3rem .65rem;
  border-radius:var(--lm-r-pill);background:var(--lm-surface-soft);
  color:var(--lm-text-muted);
}

@media (max-width:719px){
  .lm-regie{gap:var(--lm-sp-3);margin-top:var(--lm-sp-5)}
  .lm-regie__kant{padding:var(--lm-sp-4)}
  .lm-regie__brug{padding:var(--lm-sp-4)}
}

/* ==========================================================================
   Contentpagina's — lopende tekst
   Een leeskolom van 38 rem: dat is ongeveer 70 tekens per regel, waar het oog
   het prettigst leest. Breder wordt vermoeiend, smaller hakkelig.
   ========================================================================== */
.lm-wrap--lezen{width:min(100% - var(--lm-gutter)*2,38rem);margin-inline:auto}

.lm-artikel-kop{
  padding-block:clamp(3rem,7vw,6rem) clamp(1.5rem,3vw,2.5rem);
  background:var(--lm-surface-soft);
  border-bottom:1px solid var(--lm-border);
  margin-bottom:clamp(2rem,5vw,3.5rem);
}
.lm-artikel-kop .wp-block-post-title{
  font-size:clamp(2rem,1.4rem + 2.4vw,3rem);letter-spacing:-.028em;line-height:1.14;
}
.lm-artikel-kop .lm-artikel-meta{
  margin-top:var(--lm-sp-4);font-size:.8125rem;color:var(--lm-text-muted);
  display:flex;flex-wrap:wrap;gap:.35rem .9rem;
}

.lm-prose{padding-bottom:clamp(3rem,7vw,5rem)}
.lm-prose > *{margin-block:0 var(--lm-sp-5)}
.lm-prose > h2{
  margin-block:var(--lm-sp-8) var(--lm-sp-4);
  font-size:clamp(1.45rem,1.25rem + .8vw,1.85rem);
}
.lm-prose > h3{margin-block:var(--lm-sp-6) var(--lm-sp-3);font-size:1.25rem}
.lm-prose p{line-height:1.75}
.lm-prose > ul,.lm-prose > ol{display:grid;gap:.6rem;margin-bottom:var(--lm-sp-5)}
.lm-prose > ul li{position:relative;padding-left:1.3rem;line-height:1.65}
.lm-prose > ul li::before{
  content:"";position:absolute;left:.15rem;top:.68em;
  width:6px;height:6px;border-radius:50%;background:var(--lm-orange-500);
}
.lm-prose > ol{counter-reset:prose}
.lm-prose > ol li{position:relative;padding-left:1.8rem;line-height:1.65}
.lm-prose > ol li::before{
  counter-increment:prose;content:counter(prose) ".";
  position:absolute;left:0;top:0;font-weight:600;color:var(--lm-orange-700);
}
.lm-prose strong{color:var(--lm-navy-900)}

/* Tabellen in een artikel. De wrapper mag schuiven op een telefoon; de tabel
   zelf niet krimpen, want dan wordt een cel van drie woorden drie regels. */
.lm-tabel{
  margin-bottom:var(--lm-sp-5);overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border:1px solid var(--lm-border);border-radius:var(--lm-r-md);
  background:var(--lm-surface);
}
.lm-tabel table{border-collapse:collapse;width:100%;min-width:34rem;font-size:var(--lm-fs-small)}
.lm-tabel th,.lm-tabel td{
  text-align:left;vertical-align:top;
  padding:.7rem .9rem;border-bottom:1px solid var(--lm-border);
}
.lm-tabel thead th{
  font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;
  font-weight:600;color:var(--lm-text-muted);
  background:var(--lm-surface-soft);border-bottom:1px solid var(--lm-border-strong);
}
.lm-tabel tbody tr:last-child th,.lm-tabel tbody tr:last-child td{border-bottom:0}
.lm-tabel td:first-child{
  font-family:var(--lm-font-mono);font-size:.8125rem;
  color:var(--lm-text-muted);white-space:nowrap;
}
.lm-tabel td:nth-child(2){font-weight:600;color:var(--lm-navy-900)}

/* Op een telefoon wordt elke rij een blokje. Horizontaal schuiven werkt wel,
   maar dan staat de helft van de tabel buiten beeld en krijgen rijen lege
   ruimte van een kolom die u niet ziet. De kolomnaam komt uit data-kop, zodat
   een cel ook los van zijn koprij te begrijpen blijft. */
@media (max-width:699px){
  .lm-tabel{overflow:visible;border:0;background:none;border-radius:0}
  .lm-tabel table,.lm-tabel tbody,.lm-tabel tr,.lm-tabel td{display:block;min-width:0}
  .lm-tabel thead{display:none}
  .lm-tabel tr{
    border:1px solid var(--lm-border);border-radius:var(--lm-r-md);
    background:var(--lm-surface);padding:var(--lm-sp-4);
    margin-bottom:var(--lm-sp-3);
  }
  .lm-tabel td{border:0;padding:0}
  .lm-tabel td + td{margin-top:.5rem}
  .lm-tabel td[data-kop]::before{
    content:attr(data-kop);display:block;
    font-size:.6875rem;letter-spacing:.08em;text-transform:uppercase;
    font-weight:600;color:var(--lm-text-muted);margin-bottom:.15rem;
  }
  .lm-tabel td:first-child{white-space:normal}
  .lm-tabel td:nth-child(2){font-size:1.0625rem;line-height:1.35}
}

.lm-prose a{
  color:var(--lm-navy-700);
  background-image:linear-gradient(var(--lm-border-strong),var(--lm-border-strong));
  background-size:100% 1px;background-position:0 100%;background-repeat:no-repeat;
}
.lm-prose a:hover{
  color:var(--lm-orange-700);
  background-image:linear-gradient(var(--lm-orange-500),var(--lm-orange-500));
}

/* Een korte samenvatting bovenaan: wie alleen het antwoord zoekt, vindt het
   in de eerste twintig seconden. */
.lm-kort{
  border-left:3px solid var(--lm-orange-500);
  padding:var(--lm-sp-4) 0 var(--lm-sp-4) var(--lm-sp-5);
  margin-bottom:var(--lm-sp-7);
}
.lm-kort p{font-size:var(--lm-fs-lead);line-height:1.6;color:var(--lm-text)}
.lm-kort strong{font-weight:600}

/* Vraag en antwoord onderaan een artikel. */
.lm-vraag{
  border-top:1px solid var(--lm-border);
  padding-top:var(--lm-sp-5);margin-bottom:var(--lm-sp-5);
}
.lm-vraag h3{font-size:1.125rem;margin-bottom:var(--lm-sp-3)}
.lm-vraag p{font-size:var(--lm-fs-small);color:var(--lm-text-muted);line-height:1.7}

/* ==========================================================================
   Reveal bij scrollen — subtiel en optioneel
   ========================================================================== */
.lm-reveal{opacity:0;transform:translateY(18px);transition:opacity .7s var(--lm-ease),transform .7s var(--lm-ease)}
.lm-reveal.is-zichtbaar{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  .lm-reveal{opacity:1;transform:none;transition:none}
  .lm-onderdeel{filter:none;opacity:1;transform:none;transition:none}
  .lm-losse__lijnen path{stroke-dashoffset:0;transition:none}
  .lm-teken .lm-draad,.lm-teken .lm-ring,.lm-teken .lm-knoop,.lm-teken .lm-kern{
    animation:none;stroke-dashoffset:0;opacity:1;
  }
  .lm-prop:hover,.lm-dag:hover{transform:none}
  .lm-video__speel:hover span{transform:none}
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important}
}

/* Afdrukken: geen decoratie, wel inhoud */
@media print{
  .lm-header,.lm-visual,.lm-losse__lijnen,.lm-mobielmenu{display:none}
  body{background:#fff}
  .lm-section{padding-block:1.5rem}
}