:root {
  --brand-50:#f0f7f4; --brand-100:#d9ede3; --brand-200:#b5dbc9; --brand-300:#84c2a6;
  --brand-400:#56a680; --brand-500:#358a64; --brand-600:#266e50; --brand-700:#1f5841;
  --brand-800:#1b4636; --brand-900:#173a2d; --brand-950:#0c2019;
  --warm-50:#fdf8f3; --warm-100:#f9efe3; --warm-200:#f3dcc5; --warm-300:#ebc59e;
  --warm-400:#e0a56e; --warm-500:#d88d4b; --warm-600:#ca7740; --warm-700:#a85f36;
  --warm-800:#874d31; --warm-900:#6e402a;
  --surface-50:#fafaf9; --surface-100:#f5f5f4; --surface-200:#e7e5e4; --surface-300:#d6d3d1;
  --wit:#ffffff;
  --ink:var(--brand-950);
  --ink-80:rgba(23,58,45,.80); --ink-70:rgba(23,58,45,.70); --ink-60:rgba(23,58,45,.60);
  --ink-muted:#3a4d44; --ink-soft:#52635b;
  --rand:var(--surface-200);
  --zacht:0 1px 2px rgba(12,32,25,.04), 0 8px 24px -12px rgba(12,32,25,.12);
  --til:0 2px 4px rgba(12,32,25,.05), 0 18px 40px -18px rgba(12,32,25,.22);
  --warmglow:0 2px 6px rgba(202,119,64,.14), 0 24px 52px -24px rgba(202,119,64,.38);
  --deepglow:0 24px 60px -24px rgba(12,32,25,.45);
  --r-xl:12px; --r-2xl:16px; --r-3xl:24px;
  --breed:1280px;
  --display:"Onest", ui-sans-serif, system-ui, sans-serif;
  --sans:"Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif;
  color-scheme: light;
}

*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0; background:var(--surface-50); color:var(--ink);
  font:400 16px/1.6 var(--sans);
  -webkit-font-smoothing:antialiased;
}
::selection { background:var(--brand-200); color:var(--brand-950); }
h1,h2,h3,h4,.display { font-family:var(--display); font-weight:700; letter-spacing:-.018em; margin:0; }
h1 { font-size:clamp(2.1rem,1.3rem + 2.6vw,3.55rem); line-height:1.05; font-weight:800; }
h2 { font-size:clamp(1.5rem,1.2rem + 1vw,1.9rem); line-height:1.2; }
h3 { font-size:1.125rem; line-height:1.3; }
p { margin:0 0 .9rem; }
a { color:var(--brand-700); text-decoration-color:var(--brand-200); text-underline-offset:3px; }
img { max-width:100%; height:auto; }
svg { display:inline-block; }
.dim { color:var(--ink-soft); }
.klein { font-size:.84rem; }
.binnen { max-width:var(--breed); margin-inline:auto; padding-inline:20px; }
@media (min-width:1024px) { .binnen { padding-inline:32px; } }

:focus-visible { outline:2px solid var(--brand-500); outline-offset:2px; border-radius:6px; }
.overslaan {
  position:absolute; left:-9999px; z-index:60;
  background:var(--brand-700); color:#fff; padding:.6rem 1rem; border-radius:var(--r-xl);
}
.overslaan:focus { left:1rem; top:1rem; }

.top { position:sticky; top:0; z-index:50; background:rgba(255,255,255,.9);
       backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid var(--rand); }
.top .binnen { display:flex; align-items:center; gap:1rem; min-height:64px; flex-wrap:wrap; }
.merk { display:flex; align-items:center; gap:.65rem; text-decoration:none; color:var(--ink); flex:none; margin-right:auto; }
.merklogo { display:block; width:225px; max-width:100%; height:auto; }
@media (max-width:380px) { .merklogo { width:200px; } }

.hoofdnav { display:flex; align-items:center; gap:1.5rem; font-size:15px; font-weight:500; color:var(--brand-900); }
.hoofdnav > a, .menu > summary { color:var(--brand-900); text-decoration:none; padding:.5rem 0; cursor:pointer;
                                  display:inline-flex; align-items:center; gap:.25rem; list-style:none; }
.menu > summary::-webkit-details-marker { display:none; }
.hoofdnav > a::after, .menu > summary::after {
  content:""; display:block; height:2px; width:0; background:var(--brand-600);
  transition:width .25s ease; margin-top:3px; border-radius:2px; position:absolute; left:0; bottom:2px;
}
.hoofdnav > a, .menu > summary { position:relative; }
.hoofdnav > a:hover::after, .menu[open] > summary::after, .menu > summary:hover::after { width:100%; }
.menu { position:relative; }
.menu svg { width:16px; height:16px; color:var(--brand-500); }
.menu .uitklap { position:absolute; left:0; top:100%; padding-top:.75rem; z-index:5; }
.menu .uitklap div { width:14rem; background:var(--wit); border:1px solid var(--rand);
                     border-radius:var(--r-2xl); box-shadow:var(--til); padding:.5rem; display:grid; }
.menu .uitklap a { display:block; padding:.5rem .75rem; border-radius:var(--r-xl); color:var(--brand-900); text-decoration:none; }
.menu .uitklap a:hover { background:var(--brand-50); }
.topacties { display:flex; align-items:center; gap:.6rem; flex:none; }
.hamburger { display:none; }
.hamburger > summary { list-style:none; display:grid; place-items:center; width:40px; height:40px;
                       border:1px solid var(--rand); border-radius:var(--r-xl); cursor:pointer; color:var(--brand-900); }
.hamburger > summary::-webkit-details-marker { display:none; }
.hamburger svg { width:22px; height:22px; }
.mobielmenu { display:none; width:100%; padding-bottom:1rem; }
.mobielmenu a { display:block; padding:.6rem .75rem; border-radius:var(--r-xl); color:var(--brand-900);
                text-decoration:none; font-weight:500; font-size:15px; }
.mobielmenu a:hover { background:var(--brand-50); }
.mobielmenu .groep { font-size:.75rem; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-soft);
                     padding:.8rem .75rem .2rem; }

.knop { display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
        padding:.8rem 1.4rem; border-radius:var(--r-xl); border:1px solid transparent;
        background:var(--brand-700); color:#fff; font-weight:600; font-size:15px; line-height:1.3;
        text-decoration:none; cursor:pointer; box-shadow:var(--zacht);
        transition:background .18s ease, box-shadow .18s ease, transform .18s ease; }
.knop:hover { background:var(--brand-800); }
.knop.groot { padding:.95rem 1.6rem; border-radius:var(--r-2xl); font-size:1rem; }
.knop.klein { padding:.55rem .95rem; font-size:.9rem; box-shadow:none; }
.knop.warm { background:var(--warm-500); }
.knop.warm:hover { background:var(--warm-600); }
.knop.leeg { background:var(--wit); color:var(--brand-900); border-color:var(--rand); box-shadow:none; }
.knop.leeg:hover { background:var(--surface-100); }
.knop.omlijnd { background:transparent; color:var(--brand-800); border-color:var(--brand-300); box-shadow:none; }
.knop.omlijnd:hover { background:var(--brand-50); }
.knop.uit { opacity:.55; cursor:default; pointer-events:none; }
.knop.glas { background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.15); color:#fff; box-shadow:none; }
.knop.glas:hover { background:rgba(255,255,255,.16); }
.knop.breed { width:100%; }
.knoppen { display:flex; gap:.75rem; flex-wrap:wrap; }

.pil { display:inline-flex; align-items:center; gap:.5rem; font-size:.875rem; font-weight:500;
       color:var(--brand-800); background:var(--wit); border:1px solid var(--rand);
       box-shadow:var(--zacht); border-radius:999px; padding:.35rem .9rem; }
.pil::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--warm-500); }
.pil.donker { color:var(--brand-200); background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.10); box-shadow:none; }
.pil.donker::before { display:none; }

.merkje { display:inline-flex; align-items:center; gap:.3rem; flex:none; font-size:.75rem; font-weight:600;
          padding:.25rem .65rem; border-radius:999px; white-space:nowrap; }
.merkje.top { background:var(--warm-500); color:#fff; }
.merkje.geverifieerd { background:var(--brand-100); color:var(--brand-800); border:1px solid var(--brand-200); }
.merkje svg { width:12px; height:12px; }

.kruimels { font-size:.875rem; color:rgba(31,88,65,.8); padding-block:1.1rem .25rem; }
.kruimels a { color:inherit; text-decoration:none; }
.kruimels a:hover { color:var(--brand-700); text-decoration:underline; }
.kruimels span[aria-hidden] { margin-inline:.4rem; color:var(--brand-400); }
.kruimels > span:last-child { font-weight:600; color:var(--brand-900); }

.stage {
  position:relative; overflow:hidden; border-bottom:1px solid var(--rand);
  background-color:#fbfbf9;
  background-image:
    radial-gradient(85% 70% at 8% 0%, rgba(53,138,100,.09) 0%, rgba(53,138,100,0) 58%),
    radial-gradient(60% 55% at 96% 12%, rgba(216,141,75,.10) 0%, rgba(216,141,75,0) 55%),
    linear-gradient(180deg, #ffffff 0%, #fafaf8 65%, #f5f6f3 100%);
}
.stage::before {
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(23,58,45,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(23,58,45,.05) 1px, transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:radial-gradient(75% 85% at 72% 18%, #000 0%, transparent 72%);
          mask-image:radial-gradient(75% 85% at 72% 18%, #000 0%, transparent 72%);
}
.stage > .binnen { position:relative; }

.hero-band {
  border-bottom:1px solid var(--rand);
  background:
    radial-gradient(120% 90% at 78% -10%, rgba(53,138,100,.10), transparent 60%),
    linear-gradient(180deg, #f0f7f4 0%, #f6faf8 52%, #fafaf9 100%);
}

.deep {
  color:var(--surface-50); background-color:var(--brand-950);
  background-image:
    radial-gradient(110% 80% at 82% 0%, rgba(53,138,100,.28) 0%, rgba(53,138,100,0) 60%),
    radial-gradient(80% 90% at 6% 100%, rgba(31,88,65,.42) 0%, rgba(31,88,65,0) 55%);
}
.zacht-vlak { background:rgba(240,247,244,.6); border-block:1px solid var(--rand); }

.sectie { padding-block:4rem; }
@media (min-width:1024px) { .sectie { padding-block:5rem; } }
.sectiekop { max-width:42rem; }
.sectiekop p { color:var(--ink-80); margin:.75rem 0 0; line-height:1.65; }
.sectiekop.tussen { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1rem; max-width:none; }
.sectiekop.tussen > div { max-width:42rem; }
.legenda { display:flex; align-items:center; gap:1rem; font-size:.875rem; color:var(--ink-70); }
.legenda span { display:inline-flex; align-items:center; gap:.4rem; }
.legenda svg { width:14px; height:14px; color:var(--brand-600); }
.legenda i { width:10px; height:10px; border-radius:50%; background:var(--surface-300); }
.legenda .g i { background:var(--brand-500); }
.legenda .t i { background:var(--warm-500); }
.blokkop { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; margin-bottom:1.25rem; }
.meer { font-size:.9rem; font-weight:600; }
.midden { text-align:center; margin-top:2.25rem; }

.hero .binnen { padding-block:3.5rem 4rem; }
@media (min-width:1024px) { .hero .binnen { padding-block:5rem 6rem; } }
.heroraster { display:grid; gap:3rem; align-items:center; }
@media (min-width:1024px) { .heroraster { grid-template-columns:1.05fr .95fr; gap:2rem; } }
.hero h1 { margin-top:1.5rem; color:var(--brand-950); }
.hero h1 em { font-style:normal; color:var(--brand-600); }

.wissel { display:inline-grid; vertical-align:baseline; text-align:left; }
.wissel > span { grid-area:1/1; opacity:0; transition:opacity .3s ease; color:var(--brand-700); }
.wissel > span.aan { opacity:1; }
.lead { font-size:1.125rem; color:rgba(23,58,45,.75); line-height:1.65; margin:1.5rem 0 0; max-width:42rem; }
.hero-telling { margin:1.25rem 0 0; font-size:.875rem; color:var(--ink-70); display:flex; align-items:center; gap:.5rem; }
.hero-telling strong { color:var(--brand-950); font-weight:600; }
.bolletjes { display:inline-flex; }
.bolletjes i { width:24px; height:24px; border-radius:50%; border:2px solid #fff; margin-left:-6px; }
.bolletjes i:first-child { margin-left:0; background:var(--warm-300); }
.bolletjes i:nth-child(2) { background:var(--brand-300); }
.bolletjes i:nth-child(3) { background:var(--warm-400); }

.zoekblok { margin-top:2.25rem; background:var(--wit); border:1px solid var(--rand);
            border-radius:var(--r-3xl); box-shadow:var(--til); padding:.65rem; }
.zoekblok .velden { display:flex; flex-direction:column; gap:.6rem; }
@media (min-width:768px) { .zoekblok .velden { flex-direction:row; } }
.veld { flex:1; display:flex; align-items:center; gap:.6rem; padding-inline:.9rem;
        border-radius:var(--r-2xl); background:var(--surface-50); border:1px solid var(--rand); }
.veld:focus-within { border-color:var(--brand-400); }
.veld svg { width:20px; height:20px; color:var(--brand-500); flex:none; }
.veld select { width:100%; background:transparent; border:0; padding:.9rem 0; font:inherit; font-size:15px;
               color:var(--brand-950); outline:none; cursor:pointer; }
.zoekblok .knop { padding:.9rem 1.5rem; border-radius:var(--r-2xl); flex:none; box-shadow:none; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.voorproef { position:relative; max-width:28rem; width:100%; margin-inline:auto; }
@media (min-width:1024px) { .voorproef { margin-right:0; } }
.voorproef::before { content:""; position:absolute; inset:-.75rem; border-radius:var(--r-3xl);
                     border:1px solid rgba(181,219,201,.7); transform:rotate(2deg); pointer-events:none; }
.voorproef .raster { grid-template-columns:1fr; }
.voorproef .kaart { box-shadow:var(--til); border-radius:var(--r-3xl); }
.voorproef .kaart > * { padding-inline:1.5rem; }
.voorproef .kaartkop { padding-top:1.5rem; }
.voorproef .onderschrift { position:absolute; right:1.5rem; bottom:.9rem; font-size:.75rem; color:rgba(23,58,45,.55); margin:0; }
.zweef { position:absolute; background:var(--wit); border:1px solid var(--rand); border-radius:var(--r-2xl);
         box-shadow:var(--zacht); padding:.65rem 1rem; font-size:.875rem; display:flex; align-items:center; gap:.6rem;
         text-decoration:none; color:var(--ink); }
.zweef strong { font-weight:600; }
.zweef span { color:var(--ink-60); }
.zweef svg { width:16px; height:16px; color:var(--brand-600); flex:none; }
.zweef.rb { top:-1.25rem; right:-.75rem; transform:rotate(2deg); }
.zweef.lo { bottom:-1.5rem; left:-.75rem; transform:rotate(-1deg); }
@media (min-width:640px) { .zweef.rb { right:-1.5rem; } .zweef.lo { left:-2.5rem; } }

.kaart-hero { max-width:22rem; }
.kaart-hero::before { transform:rotate(-1.5deg); }
.kaartblok { position:relative; padding:1.25rem 1rem; }
.kaartnl { display:block; width:100%; height:auto; overflow:visible; }
.kaartnl .land { fill:var(--brand-100); stroke:var(--brand-300); stroke-width:1.2; stroke-linejoin:round; }
.kaartnl .water { fill:var(--surface-50); stroke:var(--brand-200); stroke-width:.8; }
.kaartnl .eiland { fill:var(--brand-100); stroke:var(--brand-300); stroke-width:.8; }
.kaartnl .stippen circle { fill:var(--brand-500); stroke:#fff; stroke-width:1.4; }
.kaartnl .stippen .pilstip { fill:var(--warm-500); }
.zweef.pin { position:absolute; white-space:nowrap; padding:.5rem .8rem; font-size:.8rem; }
.zweef.pin svg { color:var(--warm-600); }
.zweef.pin.l { transform:translate(calc(-100% + 1.1rem), .6rem); }
.zweef.pin.r { transform:translate(-1.1rem, .6rem); }

@media (max-width:640px) {
  .hero { overflow-x:clip; }
  .heroraster > * { min-width:0; }
  .voorproef, .kaart-hero { max-width:100%; }
  .voorproef::before { inset:-.4rem; }
  .zweef.rb { right:.25rem; top:-1rem; }
  .zweef.pin { font-size:.7rem; padding:.35rem .55rem; }
  .zweef.pin.l, .zweef.pin.r { transform:translate(-50%, .6rem); }
}
.labelstrook { display:flex; flex-wrap:wrap; justify-content:center; gap:.4rem; margin:1rem 0 0; padding-inline:.25rem; }
.labelstrook a { display:inline-flex; align-items:center; gap:.35rem; background:var(--wit); border:1px solid var(--rand);
                 border-radius:999px; box-shadow:var(--zacht); padding:.35rem .6rem; font-size:.76rem; color:var(--ink-60); text-decoration:none; white-space:nowrap; }
.labelstrook a:hover { border-color:var(--brand-200); color:var(--brand-800); }
.labelstrook strong { color:var(--brand-950); font-weight:600; }
.labelstrook svg { width:14px; height:14px; color:var(--warm-600); }

.typekaarten { list-style:none; margin:2.25rem 0 0; padding:0; display:grid; gap:1rem; }
@media (min-width:640px) { .typekaarten { grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px) { .typekaarten { grid-template-columns:repeat(4,1fr); } }
.typekaart { display:block; border:1px solid var(--rand); border-radius:var(--r-2xl); background:var(--wit);
             padding:1.5rem; text-decoration:none; color:inherit; transition:box-shadow .18s ease, border-color .18s ease; }
.typekaart:hover { box-shadow:var(--til); border-color:var(--brand-200); }
.typekaart .icoon { display:grid; place-items:center; width:48px; height:48px; border-radius:var(--r-2xl);
                    background:var(--brand-50); color:var(--brand-700); margin-bottom:1.25rem; }
.typekaart .icoon svg { width:24px; height:24px; }
.typekaart p { font-size:.9rem; color:var(--ink-70); margin:.4rem 0 0; line-height:1.55; }
.typekaart .aantal { margin-top:1rem; font-size:.9rem; font-weight:600; color:var(--brand-700); }
.typekaart:hover .aantal { color:var(--brand-800); }

.stappen { list-style:none; margin:2.5rem 0 0; padding:0; display:grid; gap:1.25rem; }
@media (min-width:768px) { .stappen { grid-template-columns:repeat(3,1fr); } }
.stappen li { background:var(--wit); border:1px solid var(--rand); border-radius:var(--r-2xl); padding:1.75rem; box-shadow:var(--zacht); }
.stappen .nummer { font-family:var(--display); font-weight:800; font-size:3rem; line-height:1; color:var(--brand-200); }
.stappen h3 { margin-top:.75rem; }
.stappen p { color:rgba(23,58,45,.75); margin:.5rem 0 0; line-height:1.6; }

.raster { list-style:none; margin:0; padding:0; display:grid; gap:1.25rem;
          grid-template-columns:repeat(auto-fill, minmax(320px,1fr)); }

.kaart { position:relative; display:flex; flex-direction:column; background:var(--wit);
         border:1px solid var(--rand); border-radius:var(--r-2xl); padding:1.5rem; box-shadow:var(--zacht);
         transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.kaart:hover { box-shadow:var(--til); border-color:var(--brand-200); }
.kaart.coach { border-color:var(--brand-200); box-shadow:var(--zacht), 0 0 0 1px var(--brand-100); }
.kaart.topcoach { border-color:var(--warm-200); box-shadow:var(--warmglow); }
.kaart.topcoach:hover { transform:translateY(-2px); }
.kaartkop { display:flex; gap:.75rem; align-items:flex-start; }
.kaartkop > div { min-width:0; flex:1; }
.kaartkop h3 { font-size:1.125rem; line-height:1.25; }
.kaartkop h3 a { color:inherit; text-decoration:none; }
.kaartkop h3 a::after { content:""; position:absolute; inset:0; border-radius:inherit; }
.avatar { display:grid; place-items:center; width:48px; height:48px; border-radius:var(--r-2xl); flex:none;
          font-family:var(--display); font-weight:700; font-size:1rem; letter-spacing:-.02em;
          background:var(--brand-50); color:var(--brand-700); object-fit:cover; }
.kaart.coach .avatar { background:var(--brand-100); color:var(--brand-800); }
.kaart.topcoach .avatar { background:var(--warm-100); color:var(--warm-800); }
.avatar.groot { width:7rem; height:7rem; border-radius:var(--r-3xl); font-size:2.25rem; font-weight:800;
                background:var(--brand-700); color:var(--warm-100); box-shadow:var(--til); }
@media (min-width:1024px) { .avatar.groot { width:9rem; height:9rem; font-size:3rem; } }

.typen { display:flex; flex-wrap:wrap; gap:.3rem; margin:.35rem 0 0; }
.typen span { display:inline-block; font-size:.72rem; font-weight:600; line-height:1; padding:.32rem .55rem;
              border-radius:999px; background:var(--type-vlak); color:var(--type-inkt); letter-spacing:.01em; }

.type-burnoutcoach  { --type-vlak:#f7e4e8; --type-inkt:#713247; --type-stip:#b84f70; }
.type-stresscoach   { --type-vlak:#dff1f3; --type-inkt:#225d66; --type-stip:#3b8994; }
.type-loopbaancoach { --type-vlak:#dfeaf5; --type-inkt:#1f3a57; --type-stip:#4a7fb5; }
.type-lifecoach     { --type-vlak:#ede4f2; --type-inkt:#46295a; --type-stip:#8a5fa8; }
.chip[class*="type-"] { background:var(--type-vlak); color:var(--type-inkt); }
.wolk a[class*="type-"] { background:var(--type-vlak); color:var(--type-inkt); border-color:transparent; }
.wolk a[class*="type-"] b { color:var(--type-inkt); opacity:.75; }
.wolk a[class*="type-"]:hover { border-color:var(--type-stip); color:var(--type-inkt); }
.labelstrook a[class*="type-"] { background:var(--type-vlak); color:var(--type-inkt); border-color:transparent; }
.labelstrook a[class*="type-"] strong, .labelstrook a[class*="type-"] svg { color:var(--type-inkt); }
.typekaart[class*="type-"] .icoon { background:var(--type-vlak); color:var(--type-inkt); }
.typekaart[class*="type-"] .aantal { color:var(--type-inkt); }
.menu .uitklap a .typestip, .mobielmenu a .typestip { margin-right:.55rem; }
.typestip { display:inline-block; width:.6em; height:.6em; border-radius:50%; background:var(--type-stip);
            margin-right:.45rem; vertical-align:middle; position:relative; top:-.05em; }
.plaats { margin:.4rem 0 0; font-size:.875rem; color:var(--ink-muted); }
.score { display:flex; align-items:center; gap:.35rem; margin:1rem 0 0; font-size:.875rem; }
.score .ster { color:var(--warm-600); }
.score b { font-weight:600; }
.score span:not(.ster) { color:rgba(23,58,45,.55); }
.score.leeg { color:rgba(23,58,45,.55); }
.kort { font-size:.9rem; color:var(--ink-70); margin:1rem 0 0; line-height:1.55; }
.chips { display:flex; flex-wrap:wrap; gap:.5rem; margin:1rem 0 0; padding:0; list-style:none; }
.chips span, .chip { display:inline-block; font-size:.75rem; font-weight:500; padding:.25rem .65rem;
                     border-radius:999px; background:var(--brand-50); color:var(--brand-800); text-decoration:none; }
.chips.groot span, .chip.groot { font-size:.95rem; padding:.4rem .9rem; border:1px solid var(--brand-200); }
a.chip { position:relative; z-index:1; }
a.chip:hover { background:var(--brand-100); }
.kaartvoet { margin-top:auto; padding-top:1rem; display:flex; align-items:center; justify-content:space-between; gap:.75rem; }
.kaart .kaartvoet { margin-top:1.25rem; border-top:1px solid var(--rand); }
.kaart.topcoach .kaartvoet { border-color:rgba(243,220,197,.7); }
.bekijk { font-weight:600; color:var(--brand-700); white-space:nowrap; }
.kaart.topcoach .bekijk { color:var(--warm-700); }
.kaart:hover .bekijk { color:var(--brand-800); }
.kaart.topcoach:hover .bekijk { color:var(--warm-800); }
.claim { position:relative; z-index:1; text-align:right; line-height:1.3; font-size:.75rem; color:rgba(23,58,45,.55); text-decoration:underline; text-underline-offset:2px; }
.claim:hover { color:var(--brand-700); }

.provincies { list-style:none; margin:2.25rem 0 0; padding:0; display:grid; gap:.75rem; }
@media (min-width:640px) { .provincies { grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px) { .provincies { grid-template-columns:repeat(3,1fr); } }
.provincies a { display:flex; align-items:center; justify-content:space-between; gap:.75rem;
                background:var(--wit); border:1px solid var(--rand); border-radius:var(--r-xl);
                padding:.9rem 1rem; text-decoration:none; color:inherit; font-weight:500;
                transition:border-color .18s ease, box-shadow .18s ease; }
.provincies a:hover { border-color:var(--brand-300); box-shadow:var(--zacht); }
.provincies b { font-size:.875rem; font-weight:600; color:var(--brand-700); background:var(--brand-50);
                border-radius:999px; padding:.1rem .65rem; }
.wolk { display:flex; flex-wrap:wrap; gap:.6rem; margin:1rem 0 0; }
.wolk a { display:inline-flex; align-items:center; gap:.4rem; padding:.5rem 1rem;
          background:var(--wit); border:1px solid var(--rand); border-radius:999px;
          font-size:.875rem; font-weight:500; text-decoration:none; color:var(--ink);
          transition:border-color .18s ease, color .18s ease; }
.wolk a:hover { border-color:var(--brand-300); color:var(--brand-700); }
.wolk b { font-size:.75rem; color:var(--ink-soft); font-weight:600; }
.wolk a.alles { background:var(--brand-100); border-color:var(--brand-200); color:var(--brand-800); font-weight:600; }
.wolk a.alles:hover { background:var(--brand-200); }
.subkop { margin-top:2.5rem; }

.tegels { list-style:none; margin:1.25rem 0 0; padding:0; display:grid; gap:.75rem;
          grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); }
.tegels a, .tegels .dood { display:flex; flex-direction:column; gap:.2rem;
          background:var(--wit); border:1px solid var(--rand); border-radius:var(--r-2xl);
          padding:1rem 1.1rem; text-decoration:none; color:inherit; }
.tegels a:hover { border-color:var(--brand-200); box-shadow:var(--til); }
.tegels .dood { opacity:.55; }
.tegels b { font-family:var(--display); font-size:1.05rem; }
.tegels .dim { font-size:.85rem; }

.termen { list-style:none; margin:0; padding:0; display:grid; gap:.6rem;
          grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); }
.termen a { display:flex; align-items:baseline; gap:.5rem; padding:.8rem 1rem;
            background:var(--wit); border:1px solid var(--rand); border-radius:var(--r-xl);
            text-decoration:none; color:inherit; }
.termen a:hover { border-color:var(--brand-300); box-shadow:var(--zacht); }
.termnaam { font-weight:500; }
.telling { margin-left:auto; font-size:.875rem; font-weight:600; color:var(--brand-700);
           background:var(--brand-50); border-radius:999px; padding:.1rem .65rem; }

.lijstkop { padding-block:.5rem 2.25rem; }
.lijstkop h1 { font-size:clamp(1.9rem,1.3rem + 1.8vw,2.6rem); }
.inleiding { color:var(--ink-80); max-width:70ch; margin-top:.9rem; font-size:1.05rem; }
.inleiding strong { color:var(--ink); }
.lijst { padding-block:2.5rem; }
.blok { padding-block:1.5rem; }
.blok h2 { font-size:1.35rem; }
.sectie-anker { scroll-margin-top:5rem; }
.wolk.secties { margin-top:1.25rem; }

.paginering { display:flex; flex-wrap:wrap; gap:.4rem; justify-content:center; margin:2.25rem 0 .5rem; }
.pgl { min-width:40px; text-align:center; padding:.5rem .7rem; border-radius:var(--r-xl);
       border:1px solid var(--rand); background:var(--wit); text-decoration:none;
       font-size:.9rem; color:var(--ink-muted); }
.pgl:hover { border-color:var(--brand-300); color:var(--brand-700); }
.pgl.nu { background:var(--brand-700); border-color:var(--brand-700); color:#fff; font-weight:600; }
.pgl.uit, .pgl.leeg { opacity:.4; border-color:transparent; background:none; }

.profielkop { display:grid; gap:1.5rem; align-items:flex-start; padding-block:.5rem 2.5rem; }
@media (min-width:1024px) { .profielkop { grid-template-columns:auto 1fr auto; gap:2rem; padding-bottom:3.5rem; } }
.profielinfo { min-width:0; }
.badges { display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 .75rem; }
.profielinfo h1 { font-size:clamp(1.9rem,1.3rem + 1.8vw,2.6rem); }
.onderkop { margin:.4rem 0 0; font-size:1.125rem; color:var(--brand-800); }
.meta { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1.25rem; margin:1rem 0 0; font-size:15px; color:var(--brand-800); }
.meta span { display:inline-flex; align-items:center; gap:.4rem; }
.meta svg { width:16px; height:16px; color:var(--brand-500); }
.meta .ster { color:var(--warm-500); }
.meta b { color:var(--brand-950); font-weight:600; }
.profielinfo .chips { margin-top:1rem; }
.cta-kaart { width:100%; background:var(--wit); border:1px solid var(--rand); border-radius:var(--r-2xl);
             box-shadow:var(--zacht); padding:1.25rem; }
@media (min-width:1024px) { .cta-kaart { width:17rem; } }
.cta-kaart .knop { width:100%; margin-top:.25rem; }
.cta-kaart .toel { margin:.75rem 0 0; font-size:.75rem; color:rgba(31,88,65,.8); text-align:center; }
.cta-kaart .label { font-size:.875rem; color:rgba(31,88,65,.9); margin:0 0 .75rem; }

.kolommen { display:grid; gap:2rem; align-items:start; padding-block:2.5rem; }
@media (min-width:1024px) { .kolommen { grid-template-columns:1fr 20rem; gap:3rem; padding-block:3.5rem; } }
.hoofdkolom { min-width:0; display:grid; gap:2.5rem; }
.hoofdkolom section h2 { font-size:1.5rem; margin-bottom:1rem; }
.paneel { background:var(--wit); border:1px solid var(--rand); border-radius:var(--r-2xl); box-shadow:var(--zacht); padding:1.5rem; }
@media (min-width:1024px) { .paneel { padding:1.75rem; } }
.paneel h3 { font-size:1rem; font-weight:600; margin-bottom:.75rem; }
.tekst { color:var(--brand-900); font-size:1.0625rem; line-height:1.65; max-width:68ch; }
.tekst p:last-child { margin-bottom:0; }
.citaat { margin:0; padding:1.75rem; background:var(--brand-50); border:1px solid var(--brand-200);
          border-radius:var(--r-2xl); position:relative; overflow:hidden; }
.citaat::before { content:"\201D"; position:absolute; top:.5rem; right:1.5rem; font-family:var(--display); font-weight:800;
                  font-size:4.5rem; line-height:1; color:rgba(181,219,201,.6); }
.citaat blockquote { margin:0; font-family:var(--display); font-weight:700; font-size:1.25rem; line-height:1.4;
                     color:var(--brand-950); position:relative; }
.citaat cite { display:block; margin-top:1rem; font-style:normal; font-size:.875rem; color:rgba(27,70,54,.8); }
.uren, .feiten { margin:0; display:grid; gap:.9rem; }
.feiten div { display:flex; gap:.75rem; font-size:15px; }
.feiten dt { font-size:.75rem; color:rgba(31,88,65,.8); }
.feiten dd { margin:0; color:var(--brand-900); }
.feiten dd a { font-weight:500; text-decoration:none; }
.feiten dd a:hover { text-decoration:underline; }
.feiten > div { flex-direction:column; gap:.1rem; }
.uren div { display:flex; justify-content:space-between; gap:1rem; padding:.45rem 0; border-bottom:1px solid var(--rand); font-size:.95rem; }
.uren div:last-child { border-bottom:0; }
.uren dt { color:var(--ink-soft); }
.uren dd { margin:0; text-align:right; }
.sociaal { display:flex; flex-direction:column; gap:.6rem; margin:1rem 0 0; }
.sociaal a { display:flex; align-items:center; gap:.75rem; padding:.6rem .9rem; border:1px solid var(--rand);
             border-radius:var(--r-xl); text-decoration:none; font-weight:500; color:var(--brand-900); }
.sociaal a:hover { background:var(--brand-50); }
.rail { display:grid; gap:1rem; }
@media (min-width:1024px) { .rail { position:sticky; top:5rem; } }
.rail .paneel h2 { font-size:1.125rem; margin-bottom:1rem; }
.rail .paneel.zacht { background:var(--brand-50); border-color:var(--brand-200); box-shadow:none; }
.rail .paneel.zacht p { font-size:15px; color:var(--brand-900); line-height:1.6; }
.rail .paneel.zacht .knop { width:100%; margin-top:1rem; }
.rail .paneel.zacht .klein { font-size:.84rem; color:var(--ink-soft); }
.voorbeeldbalk { margin:0; padding:.7rem 1rem; text-align:center; font-size:.9rem;
                 background:var(--warm-500); color:#fff; }
.voorbeeldbalk a { color:#fff; }

.paneel.accent { background:var(--brand-50); border-color:var(--brand-200); box-shadow:none; }
.tarieven { display:grid; gap:1rem; }
@media (min-width:640px) { .tarieven { grid-template-columns:1fr 1fr; } }
.tarieven .label { margin:0; font-size:.875rem; color:rgba(31,88,65,.9); }
.tarieven .prijs { margin:.25rem 0 0; font-family:var(--display); font-weight:800; font-size:1.9rem; color:var(--brand-950); }
.tarieven .prijs span { font-family:var(--sans); font-weight:500; font-size:1rem; color:rgba(31,88,65,.8); }
.hoofdkolom section .tarieven + .klein { margin:.75rem 0 0; }
.lijstpaneel { padding:0; display:grid; }
.lijstpaneel .rij { display:flex; gap:1rem; align-items:flex-start; padding:1.25rem 1.5rem; border-bottom:1px solid var(--rand); }
.lijstpaneel .rij:last-child { border-bottom:0; }
.lijstpaneel h3 { margin:0 0 .35rem; }
.lijstpaneel .tekst.klein { font-size:15px; }
.lijstpaneel .badges { margin:.5rem 0 0; }
.lijstpaneel .badges a { text-decoration:none; }
.ikoon { display:grid; place-items:center; width:2.5rem; height:2.5rem; flex:none; border-radius:var(--r-xl);
         background:var(--brand-50); color:var(--brand-700); }
.ikoon svg { width:20px; height:20px; }
.video { aspect-ratio:16 / 9; max-width:100%; border-radius:var(--r-2xl); overflow:hidden; border:1px solid var(--rand); background:#000; }
.video iframe { width:100%; height:100%; border:0; display:block; }

.video-facade { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.75rem; cursor:pointer; color:#fff; text-align:center; padding:1rem; }
.video-facade:focus-visible { outline:2px solid var(--accent, #fff); outline-offset:2px; }
.video-play { width:64px; height:64px; border-radius:50%; background:rgba(255,255,255,.14); border:2px solid rgba(255,255,255,.7); position:relative; }
.video-play::after { content:""; position:absolute; top:50%; left:54%; transform:translate(-50%,-50%); border-style:solid; border-width:12px 0 12px 20px; border-color:transparent transparent transparent #fff; }
.video-uitleg { font-size:.95rem; line-height:1.4; }
.video-uitleg small { opacity:.75; }
.video-facade:hover .video-play { background:rgba(255,255,255,.24); }

.contact-deep { border-radius:var(--r-3xl); box-shadow:var(--deepglow); padding:1.75rem; scroll-margin-top:5rem; }
@media (min-width:1024px) { .contact-deep { padding:2.5rem; } }
.contact-deep h2 { color:#fff; font-size:clamp(1.5rem,1.2rem + 1vw,1.9rem); margin:0; }
.contact-deep .intro { color:rgba(217,237,227,.9); margin:.75rem 0 0; max-width:36rem; line-height:1.65; }
.contact-deep .dim, .contact-deep .klein { color:rgba(217,237,227,.8); }
.contact-deep a { color:var(--warm-200); }
.contactform { display:grid; gap:1rem; margin-top:1.75rem; }
@media (min-width:640px) { .contactform { grid-template-columns:1fr 1fr; } .contactform .vol { grid-column:1 / -1; } }
.contactform label { display:grid; gap:.35rem; font-size:.875rem; font-weight:600; color:#fff; }
.contactform input, .contactform textarea {
  font:inherit; font-size:1rem; padding:.75rem .9rem; border-radius:var(--r-xl);
  border:1px solid transparent; background:var(--wit); color:var(--brand-950); width:100%;
}
.contactform input:focus, .contactform textarea:focus { border-color:var(--warm-400); outline:2px solid rgba(235,197,158,.5); outline-offset:0; }
.contactform textarea { resize:vertical; }
.contactform .actie { display:flex; flex-wrap:wrap; align-items:center; gap:1rem; }
.contactform .actie .knop { padding:.9rem 1.75rem; font-size:1.05rem; }
.contactform .valstrik { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.contactform-melding { margin:0; padding:.9rem 1rem; border-radius:var(--r-xl); font-weight:600; }
.contactform-melding.goed { background:rgba(217,237,227,.18); color:#fff; }
.contactform-melding.fout { background:rgba(255,205,190,.2); color:#fff; }
.contactform-code { display:flex; flex-wrap:wrap; align-items:end; gap:1rem; }
.contactform-code[hidden] { display:none; }
.contactform-code input { max-width:10rem; letter-spacing:.2em; font-variant-numeric:tabular-nums; }
.linkknop { background:none; border:0; padding:0; color:var(--warm-400); text-decoration:underline; font:inherit; font-size:.875rem; cursor:pointer; }
.contactform .cf-turnstile { min-height:65px; }
.contactform .cf-turnstile[data-appearance="interaction-only"] { min-height:0; }

.artikel { padding:1rem 20px 3rem; max-width:48rem; }
.artikel h1 { font-size:clamp(1.9rem,1.3rem + 1.8vw,2.6rem); margin-bottom:.5rem; }
.artikel .tekst { margin-top:1.5rem; }
.artikel .tekst h2 { margin:2rem 0 .75rem; font-size:1.4rem; }
.artikel .tekst h3 { margin:1.5rem 0 .5rem; }
.artikel .tekst .raster { margin:1.5rem 0 2rem; font-size:1rem; line-height:1.5; }
.artikel .tekst .kaart h3 { margin:0; }
.artikel .tekst .kaart p { margin:0; }
.werktmet { margin:.75rem 0 0; color:var(--brand-800); }
.artikel .tekst blockquote { margin:1.25rem 0; padding:1rem 1.25rem; background:var(--brand-50);
                             border-left:3px solid var(--brand-300); border-radius:0 var(--r-xl) var(--r-xl) 0; }
.artikel .tekst .let-op { margin:2rem 0; padding:1.25rem 1.5rem; background:var(--warm-50); border:1px solid var(--warm-200);
                          border-left:4px solid var(--warm-400); border-radius:var(--r-xl); font-size:1rem; color:var(--ink-muted); }
.artikel .tekst .let-op h2 { margin:0 0 .5rem; font-size:1.1rem; color:var(--warm-800); }
.artikel .tekst .let-op p:last-child { margin-bottom:0; }
.artikelen { list-style:none; margin:0; padding:0; display:grid; gap:1rem; }
.artikelen a { display:block; background:var(--wit); border:1px solid var(--rand);
               border-radius:var(--r-2xl); padding:1.25rem 1.5rem; text-decoration:none; color:inherit; box-shadow:var(--zacht); }
.artikelen a:hover { box-shadow:var(--til); border-color:var(--brand-200); }
.bredere-context { color:var(--ink-muted); }

.vragen h2 { margin-bottom:1.25rem; }
.vragenlijst { display:grid; gap:.75rem; max-width:70ch; }
.vragenlijst details { background:var(--wit); border:1px solid var(--rand);
                       border-radius:var(--r-2xl); box-shadow:var(--zacht); overflow:hidden; }
.vragenlijst summary { cursor:pointer; padding:1rem 1.25rem; list-style:none;
                       display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.vragenlijst summary::-webkit-details-marker { display:none; }
.vragenlijst summary::after { content:"+"; color:var(--brand-600); font-size:1.4rem; line-height:1; flex:none; font-weight:300; }
.vragenlijst details[open] summary::after { content:"\2212"; }
.vragenlijst summary:hover { background:var(--surface-50); }
.vragenlijst summary h3 { font-size:1rem; font-weight:600; margin:0; }
.faq-antwoord { padding:0 1.25rem 1.1rem; color:var(--ink-80); max-width:66ch; line-height:1.6; }

.band { border-radius:var(--r-3xl); padding:3rem 1.75rem; overflow:hidden; position:relative; }
@media (min-width:640px) { .band { padding:3.5rem 3rem; } }
.bandraster { display:grid; gap:2.5rem; align-items:center; }
@media (min-width:1024px) { .bandraster { grid-template-columns:1.4fr 1fr; } }
.band h2 { color:#fff; font-size:clamp(1.9rem,1.4rem + 1.5vw,2.4rem); font-weight:800; margin-top:1.25rem; line-height:1.15; }
.band p.uitleg { color:var(--surface-200); line-height:1.65; margin:1rem 0 0; max-width:36rem; }
.band .knoppen { margin-top:1.75rem; }
.prijskaart { background:var(--wit); color:var(--brand-950); border-radius:var(--r-2xl); padding:1.5rem; box-shadow:var(--til); }
.prijskaart .kopregel { display:flex; align-items:center; justify-content:space-between; gap:.75rem; }
.prijskaart .kopregel b { font-family:var(--display); font-size:1.125rem; }
.prijskaart .tag { font-size:.75rem; font-weight:600; color:var(--warm-800); background:var(--warm-100);
                   border:1px solid var(--warm-200); border-radius:999px; padding:.25rem .65rem; }
.prijskaart .prijs { margin:.75rem 0 0; }
.prijskaart .prijs b { font-family:var(--display); font-weight:800; font-size:1.9rem; letter-spacing:-.02em; }
.prijskaart .prijs span { font-size:.875rem; color:var(--ink-60); }
.prijskaart ul { list-style:none; margin:1.25rem 0 0; padding:0; display:grid; gap:.65rem; font-size:.9rem; }
.prijskaart li { display:flex; gap:.6rem; align-items:flex-start; }
.prijskaart li svg { width:20px; height:20px; color:var(--brand-600); flex:none; }
.prijskaart .klein { margin:1.25rem 0 0; color:var(--ink-60); font-size:.75rem; }

.voet { background:var(--brand-950); color:var(--surface-200); padding-block:3.5rem 2rem; }
.voetraster { display:grid; gap:2.5rem; }
@media (min-width:768px) { .voetraster { grid-template-columns:1.4fr 1fr 1fr 1fr; } }
.voet .merk { color:#fff; margin:0; }
.voet .over { font-size:.875rem; color:rgba(231,229,228,.8); line-height:1.6; margin:1rem 0 0; max-width:20rem; }
.voetkop { font-family:var(--display); font-weight:700; color:#fff; font-size:.875rem; margin:0 0 1rem; }
.voet ul { list-style:none; margin:0; padding:0; display:grid; gap:.6rem; font-size:.875rem; }
.voet li a { color:var(--surface-200); text-decoration:none; transition:color .18s ease; }
.voet li a:hover { color:#fff; }
.voetonder { margin-top:3rem; padding-top:1.5rem; border-top:1px solid rgba(255,255,255,.10);
             display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.75rem;
             font-size:.875rem; color:rgba(231,229,228,.7); }
.voetonder p { margin:0; }

@media (max-width:1023px) {
  .hoofdnav { display:none; }
  .hamburger { display:block; }
  .hamburger[open] ~ .mobielmenu { display:block; }
  .top .binnen { position:relative; }
}
@media (max-width:640px) {
  .topacties .knop { display:none; }
  .sectiekop.tussen .legenda { display:none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  * { transition:none !important; animation:none !important; }
}

.rangtrap { position:relative; background:var(--wit); border:1px solid var(--rand); border-radius:var(--r-3xl);
            box-shadow:var(--til); padding:1.5rem; max-width:28rem; width:100%; margin-inline:auto; }
@media (min-width:1024px) { .rangtrap { margin-right:0; } }
.rangtrap .kop { display:flex; justify-content:space-between; align-items:flex-end; gap:.5rem; margin-bottom:1.25rem;
                 font-size:.875rem; font-weight:600; color:var(--ink-70); }
.rangtrap .kop .licht { font-size:.75rem; font-weight:400; color:rgba(23,58,45,.45); }
.rangtrap .staven { display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; align-items:end; height:11rem; }
.rangtrap .staaf { display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; }
.rangtrap .staaf i { display:block; width:100%; border-radius:12px 12px 0 0; background:var(--surface-200); }
.rangtrap .staaf.coach i { background:var(--brand-400); }
.rangtrap .staaf.hoogste i { background:linear-gradient(to top, var(--warm-500), var(--warm-400)); box-shadow:var(--warmglow); }
.rangtrap .staaf span { display:inline-flex; align-items:center; gap:.3rem; margin-top:.75rem; font-size:.75rem; font-weight:600; color:var(--ink-60); }
.rangtrap .staaf.coach span { color:var(--brand-700); }
.rangtrap .staaf.hoogste span { color:var(--warm-700); font-weight:700; }
.rangtrap .staaf svg { width:12px; height:12px; }
.rangtrap .voorbeeld { margin-top:1.25rem; padding-top:1.25rem; border-top:1px solid var(--rand); display:flex; align-items:center; gap:.75rem; }
.rangtrap .voorbeeld > div { min-width:0; flex:1; }
.rangtrap .voorbeeld { --pad:.75rem; }
.rangtrap .voorbeeld .avatar { display:grid; place-items:center; width:44px; height:44px; border-radius:var(--r-xl);
                               background:var(--warm-100); color:var(--warm-700); font-family:var(--display); font-weight:700; font-size:1.1rem; flex:none; }
.rangtrap .voorbeeld .naam { margin:0; font-family:var(--display); font-weight:700; color:var(--brand-950); display:flex; align-items:center; gap:.35rem; }
.rangtrap .voorbeeld .vinkje { display:grid; place-items:center; width:16px; height:16px; border-radius:50%; background:var(--brand-600); color:#fff; }
.rangtrap .voorbeeld .vinkje svg { width:10px; height:10px; }
.rangtrap .voorbeeld .sub { margin:0; font-size:.75rem; color:var(--ink-60); }

.werkwijze .claimkaart { margin-top:2rem; }
.claimkaart { background:var(--wit); border:1px solid var(--rand); border-radius:var(--r-3xl);
              box-shadow:var(--zacht); padding:1.75rem; max-width:40rem; width:100%; margin-inline:auto; }
.claimkaart h2 { font-size:1.35rem; margin-bottom:.75rem; }
.claimkaart .tekst { font-size:1rem; }
.claimkaart ol { padding-left:1.25rem; margin:.75rem 0; }
.claimkaart li { margin-bottom:.4rem; }
.tiers { display:grid; gap:1.25rem; margin-top:2.5rem; align-items:start; }
@media (min-width:1024px) { .tiers { grid-template-columns:repeat(3,1fr); } }
.tier { position:relative; display:flex; flex-direction:column; background:var(--wit); border:1px solid var(--rand);
        border-radius:var(--r-3xl); box-shadow:var(--zacht); padding:1.75rem; }
.tier h3 { font-size:1.25rem; }
.tieruitleg { font-size:.9rem; color:var(--ink-70); margin:.4rem 0 0; line-height:1.55; }
.tier .prijs { margin:1.25rem 0 0; }
.tier .prijs b { font-family:var(--display); font-weight:800; font-size:2.25rem; letter-spacing:-.02em; }
.tier .prijs span { font-size:.875rem; color:var(--ink-60); }
.tier ul { list-style:none; margin:1.5rem 0 0; padding:0; display:grid; gap:.75rem; font-size:15px; }
.tier li { display:flex; gap:.6rem; align-items:flex-start; }
.tier li svg { width:20px; height:20px; color:var(--brand-600); flex:none; margin-top:.1rem; }
.tier .knop { margin-top:1.75rem; width:100%; }
.tier .klein { margin:.75rem 0 0; text-align:center; color:var(--ink-60); font-size:.75rem; }
.tier.uitgelicht { border-color:var(--brand-300); box-shadow:var(--til), 0 0 0 1px var(--brand-200); }
.tier .tag { position:absolute; top:-.9rem; left:1.75rem; font-size:.75rem; font-weight:600; color:var(--brand-800);
             background:var(--brand-100); border:1px solid var(--brand-200); border-radius:999px; padding:.3rem .8rem; }
.tier.top-tier { color:var(--warm-50); border-color:transparent; box-shadow:var(--warmglow); overflow:hidden;
  background-color:#1d130c;
  background-image:
    radial-gradient(110% 90% at 85% 0%, rgba(216,141,75,.30) 0%, rgba(216,141,75,0) 60%),
    radial-gradient(90% 80% at 0% 100%, rgba(110,64,42,.45) 0%, rgba(110,64,42,0) 55%); }
.tier.top-tier .merkje { align-self:flex-start; background:var(--warm-300); color:var(--warm-900); margin-bottom:1rem; }
.tier.top-tier h3, .tier.top-tier .prijs b { color:#fff; }
.tier.top-tier .tieruitleg { color:rgba(249,239,227,.85); }
.tier.top-tier .prijs span, .tier.top-tier .klein { color:rgba(249,239,227,.7); }
.tier.top-tier li svg { color:var(--warm-300); }
.tier.top-tier .knop.uit { opacity:1; background:#38271d; color:#f9efe3; border-color:#bca997; box-shadow:none; }
.afspraak { margin:2rem 0 0; max-width:42rem; font-size:.9rem; color:var(--ink-70); line-height:1.6; }
.tabelwrap { margin-top:2.25rem; overflow-x:auto; background:var(--wit); border:1px solid var(--rand);
             border-radius:var(--r-2xl); box-shadow:var(--zacht); }
.vergelijk { width:100%; border-collapse:collapse; font-size:15px; min-width:36rem; }
.vergelijk th, .vergelijk td { padding:.9rem 1.25rem; text-align:left; border-bottom:1px solid var(--rand); }
.vergelijk thead th { font-family:var(--display); font-size:.875rem; background:var(--surface-50); }
.vergelijk tbody th { font-weight:500; color:var(--brand-900); }
.vergelijk td { color:var(--ink-60); }
.vergelijk tr:last-child th, .vergelijk tr:last-child td { border-bottom:0; }
.vergelijk .ja { display:inline-flex; align-items:center; font-weight:600; color:var(--brand-700); }
.slot { margin-top:2.5rem; max-width:42rem; }
.slot h3 { margin-bottom:.5rem; }
.slot .knop { margin-top:.75rem; }

.byline { display:flex; align-items:center; gap:.65rem; margin-top:.9rem; font-size:.95rem; }
.byline a { font-weight:600; }
.avatar.klein { width:40px; height:40px; border-radius:50%; font-size:.85rem; font-weight:700; }
img.avatar { object-fit:cover; }
.byline img.avatar, .auteurkaart img.avatar { border-radius:50%; }
.auteurkaart img.avatar.groot { width:6.5rem; height:6.5rem; box-shadow:none; flex:none; }

.auteurblok { padding-block:1.75rem 2.5rem; }
.auteurkaart { display:flex; gap:1.75rem; align-items:center; padding:2rem 2.25rem;
  background:linear-gradient(135deg, var(--brand-100) 0%, var(--brand-50) 100%);
  border:1px solid var(--brand-200); border-radius:var(--r-3xl); box-shadow:var(--zacht); }
.auteurkaart .pil { margin-bottom:.6rem; }
.auteurkaart h2 { font-size:1.25rem; margin:0; }
.auteurkaart p { margin-top:.5rem; }
.auteurlinks { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.1rem; }
@media (max-width:600px) { .auteurkaart { flex-direction:column; align-items:stretch; padding:1.75rem; } }

.voet .disclaimer { margin-top:1.25rem; font-size:.84rem; color:rgba(255,255,255,.72); max-width:20rem; }

.paneel.zacht .na-knop { margin: .9rem 0 0; }

.raster.raster-los { margin-top: 2.25rem; }

.zweef.pin.pin-amsterdam { left: 42.16%; top: 42.41%; }
.zweef.pin.pin-rotterdam { left: 31.76%; top: 57.93%; }
.zweef.pin.pin-eindhoven { left: 56.28%; top: 74.48%; }
.zweef.pin.pin-groningen { left: 83.56%; top: 13.10%; }

.knoppen.knoppen-hero { margin-top: 2rem; }
.staaf i.hoogte-34 { height: 34%; }
.staaf i.hoogte-62 { height: 62%; }
.staaf i.hoogte-100 { height: 100%; }

details.meer { margin-top: 1.25rem; }
details.meer > summary { list-style: none; cursor: pointer; display: flex; width: max-content; margin: 1.5rem auto 0; }
details.meer > summary::-webkit-details-marker { display: none; }
details.meer[open] > summary { display: none; }
details.meer[open] { margin-top: 1.25rem; }