/* ═══════════════════════════════════════════════════════
   CLOSING CLARITY — startpagina v3
   Merkboek v1.0. Hitteschaal: merkteken · grafiek · band.
   ═══════════════════════════════════════════════════════ */

/* tokens: zie tokens.css */
*{ box-sizing:border-box; }
body{
  margin:0; background:var(--void); color:var(--text);
  font-family:var(--sans); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
::selection{ background:var(--red); color:#fff; }
a{ color:inherit; }
:focus-visible{ outline:2px solid var(--signal); outline-offset:3px; border-radius:2px; }
img{ max-width:100%; }

/* ── type ───────────────────────────────────────────── */
.d1,.d2,.d3{ font-family:var(--display); font-weight:800; margin:0; text-transform:uppercase; text-wrap:balance; }
.d1{ font-size:clamp(2.25rem,4.5vw,4.35rem); line-height:.92; letter-spacing:-.028em; font-variation-settings:"wdth" 120,"wght" 900; }
.d2{ font-size:clamp(1.8rem,3.9vw,3.15rem); line-height:.96; letter-spacing:-.028em; font-variation-settings:"wdth" 118,"wght" 800; }
.d3{ font-size:clamp(1.25rem,2.2vw,1.75rem); line-height:1.06; letter-spacing:-.02em; font-variation-settings:"wdth" 112,"wght" 700; }
h3{ font-family:var(--sans); font-size:1rem; font-weight:600; margin:0; letter-spacing:-.005em; }
p{ margin:0; }
strong{ font-weight:600; color:var(--white); }
.lbl{ font-family:var(--mono); font-size:.6875rem; font-weight:500; letter-spacing:.07em; text-transform:uppercase; color:var(--muted); }
.lede{ font-size:1.0625rem; line-height:1.55; color:var(--muted); max-width:var(--read); }
.txt{ color:var(--muted); max-width:var(--read); }
.num{ font-family:var(--mono); font-variant-numeric:tabular-nums; }

/* ── raamwerk ───────────────────────────────────────── */
.wrap{ max-width:var(--max); margin:0 auto; padding:0 var(--pad); }
section{ padding:clamp(3.25rem,5.6vw,5.5rem) 0; border-top:1px solid var(--line-soft); }
.sec-top{ display:flex; align-items:baseline; gap:.85rem; margin-bottom:1.1rem; }
.sec-top .n{ font-family:var(--mono); font-size:.6875rem; color:var(--signal); letter-spacing:.07em; flex:none; }
.stack{ display:flex; flex-direction:column; gap:1rem; }
.stack-lg{ display:flex; flex-direction:column; gap:clamp(1.6rem,3vw,2.4rem); }
.grid{ display:grid; gap:1rem; }
@media (min-width:860px){ .g2{grid-template-columns:repeat(2,1fr)} .g3{grid-template-columns:repeat(3,1fr)} }

.card{
  background:var(--panel); border:1px solid var(--line-soft); border-radius:4px;
  padding:1.35rem; display:flex; flex-direction:column; gap:.6rem;
  transition:border-color .18s var(--ease-mid), transform .18s var(--ease-mid), background .18s var(--ease-mid);
}
.card:hover{ border-color:var(--line); background:var(--panel-2); transform:translateY(-2px); }
.card .k{ font-size:.9375rem; color:var(--muted); line-height:1.52; }

.btn{
  position:relative; display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--sans); font-size:.875rem; font-weight:600;
  padding:.8rem 1.3rem; border-radius:3px; border:0; cursor:pointer;
  background:var(--white); color:#08080A; text-decoration:none;
  overflow:hidden; isolation:isolate;
  transition:transform .18s var(--ease-mid), color .18s var(--ease-mid);
}
.btn::before{ content:""; position:absolute; inset:0; z-index:-1; background:var(--heat-45); transform:translateY(101%); transition:transform .42s var(--ease-in); }
.btn:hover{ color:#fff; transform:translateY(-2px); }
.btn:hover::before{ transform:none; }
.btn.line{ background:transparent; color:var(--text); box-shadow:inset 0 0 0 1px var(--line); }
.btn.line:hover{ color:#fff; }
.btn.sm{ font-size:.8125rem; padding:.55rem .9rem; }
.btn .ar{ font-family:var(--mono); font-size:.8125rem; }
.btn-row{ display:flex; flex-wrap:wrap; gap:.75rem; align-items:center; }

/* ── navigatie ──────────────────────────────────────── */
header.nav{ position:sticky; top:0; z-index:80; background:rgba(8,8,10,.86); backdrop-filter:blur(14px); border-bottom:1px solid var(--line-soft); }
.nav-in{ max-width:var(--max); margin:0 auto; padding:.75rem var(--pad); display:flex; align-items:center; gap:1.5rem; }
.mark{ display:flex; align-items:center; gap:.6rem; text-decoration:none; flex:none; }
.mark svg{ width:26px; height:26px; }
.mark .wm{ font-family:var(--display); font-variation-settings:"wdth" 114,"wght" 800; font-size:.75rem; text-transform:uppercase; line-height:1.02; }
.nav-links{ display:flex; gap:1.4rem; margin-left:auto; }
.nav-links a{ font-size:.8125rem; color:var(--muted); text-decoration:none; transition:color .18s var(--ease-mid); }
.nav-links a:hover{ color:var(--white); }
.lang{ display:flex; border:1px solid var(--line-soft); border-radius:3px; overflow:hidden; flex:none; }
.lang button{ font-family:var(--mono); font-size:.625rem; letter-spacing:.06em; border:0; background:transparent; color:var(--dim); padding:.32rem .55rem; cursor:pointer; transition:background .18s,color .18s; }
.lang button[aria-pressed="true"]{ background:var(--white); color:#08080A; }

/* ── hero ───────────────────────────────────────────── */
.hero{ position:relative; overflow:hidden; border-top:0; min-height:min(94vh,56rem); display:flex; align-items:center; padding:clamp(4rem,8vw,6rem) 0 clamp(1.75rem,3.5vw,2.75rem); }
#field{ position:absolute; inset:0; width:100%; height:100%; }
.hero-grid{
  position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(var(--line-soft) 1px,transparent 1px),linear-gradient(90deg,var(--line-soft) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(110% 85% at 40% 45%,#000 15%,transparent 76%);
  -webkit-mask-image:radial-gradient(110% 85% at 40% 45%,#000 15%,transparent 76%);
}
.hero .wrap{ position:relative; width:100%; }
.hero-in{ display:grid; grid-template-columns:1fr; gap:1.5rem; align-items:end; }
@media (min-width:1000px){ .hero-in{ grid-template-columns:minmax(0,1.05fr) minmax(0,.62fr); gap:2rem; } }
.hero-copy{ display:flex; flex-direction:column; padding-bottom:clamp(.5rem,5vh,3.25rem); }
.hero .d1{ margin-top:1rem; max-width:17ch; hyphens:none; }
.hero .d1 .ln{ display:block; overflow:hidden; }
.hero .d1 .ln i{ display:block; font-style:normal; transform:translateY(104%); animation:rise 1s var(--ease-in) forwards; }
@keyframes rise{ to{ transform:none; } }
.fade{ opacity:0; animation:fu .8s var(--ease-in) forwards; }
@keyframes fu{ from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:none} }
.hero-sub{ margin-top:1.5rem; max-width:33rem; font-size:1.0625rem; color:var(--muted); }
.hero-cta{ margin-top:2rem; gap:.6rem; }

.kicker{ display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; }
.kicker i{ display:block; height:2px; width:2.75rem; flex:none; border-radius:1px; background:var(--heat-45); }
.kicker b{ font-family:var(--display); font-variation-settings:"wdth" 116,"wght" 800; font-size:.9375rem; letter-spacing:.02em; text-transform:uppercase; color:var(--white); }

.byline{ margin-top:2rem; display:flex; align-items:center; gap:.75rem; }
@media (min-width:760px){ .byline{ display:none; } }
.byline .face{ width:2.75rem; height:2.75rem; border-radius:50%; flex:none; overflow:hidden; border:1px solid var(--line); }
.byline .face img{ display:block; width:100%; height:100%; object-fit:cover; }

.hero-foot{ margin-top:clamp(2rem,5vw,3.25rem); padding-top:1rem; border-top:1px solid var(--line-soft); display:flex; flex-wrap:wrap; gap:.6rem 2.5rem; }

.hero-figure{ display:none; margin:0; position:relative; justify-self:end; }
@media (min-width:760px){ .hero-figure{ display:flex; align-items:flex-end; justify-content:flex-end; } }
.hero-figure::before{
  content:""; position:absolute; z-index:0; pointer-events:none;
  left:52%; bottom:-4%; transform:translateX(-50%);
  width:min(44rem,150%); aspect-ratio:1/.58;
  background:radial-gradient(50% 50% at 50% 50%, rgba(255,107,53,.13), rgba(122,46,99,.07) 44%, rgba(43,49,112,.04) 62%, transparent 74%);
}
.hero-figure img{
  position:relative; z-index:1; display:block; width:auto; max-width:100%;
  height:clamp(19rem,44vh,26rem); object-fit:contain; object-position:bottom;
  margin-bottom:calc(-1 * clamp(1.75rem,3.5vw,2.75rem));
}
@media (min-width:1000px){ .hero-figure img{ height:clamp(26rem,78vh,46rem); } }


/* ── de hoofdknop draagt de merkkleuren zelf ─────────── */
.btn.heet{
  background:var(--heat-45);
  background-size:200% 200%;
  background-position:0% 50%;
  color:#fff;
  box-shadow:0 8px 22px -10px rgba(232,64,42,.55);
  transition:background-position .7s var(--ease-in),
             box-shadow .45s var(--ease-in),
             transform .18s var(--ease-mid);
}
.btn.heet::before{ content:none; }          /* de vulling is er al */
.btn.heet:hover,.btn.heet:focus-visible{
  color:#fff;
  background-position:100% 50%;
  box-shadow:
    0 18px 46px -10px rgba(232,64,42,.80),
    0 0 64px -6px rgba(255,107,53,.55),
    0 0 0 1px rgba(255,107,53,.40);
}
.btn.heet .ar{ color:#fff; }

/* ── meetpassage over de figuur ──────────────────────── */
.hero-figure .meet{ position:absolute; inset:0; z-index:2; pointer-events:none; overflow:hidden; }

.hero-figure .scan{
  position:absolute; left:6%; right:6%; top:0; height:2px;
  background:linear-gradient(90deg,transparent,rgba(255,107,53,.85),rgba(255,255,255,.9),rgba(255,107,53,.85),transparent);
  filter:blur(.4px);
  opacity:0;
  animation:scan 2.6s cubic-bezier(.5,0,.2,1) 1.1s 1 forwards;
}
@keyframes scan{
  0%   { top:2%;  opacity:0; }
  12%  { opacity:.95; }
  88%  { opacity:.95; }
  100% { top:88%; opacity:0; }
}

@media (prefers-reduced-motion:reduce){
  .hero-figure .scan{ display:none; }
}
@media (max-width:1000px){ .hero-figure .meet{ display:none; } }

/* ── rekensom ───────────────────────────────────────── */
.calc{ border:1px solid var(--line-soft); border-radius:4px; background:var(--panel); display:grid; grid-template-columns:1fr; overflow:hidden; }
@media (min-width:1000px){ .calc{ grid-template-columns:20.5rem 1fr; } }
.calc-in{ padding:1.4rem; display:flex; flex-direction:column; gap:1.15rem; border-bottom:1px solid var(--line-soft); }
@media (min-width:1000px){ .calc-in{ border-bottom:0; border-right:1px solid var(--line-soft); } }
.calc-out{ padding:1.4rem; display:flex; flex-direction:column; gap:1rem; min-width:0; }

.presets{ display:flex; flex-wrap:wrap; gap:.4rem; }
.preset{
  font-family:var(--mono); font-size:.625rem; letter-spacing:.07em; text-transform:uppercase;
  padding:.35rem .6rem; border-radius:2px; cursor:pointer;
  background:transparent; color:var(--muted); border:1px solid var(--line-soft);
  transition:border-color .18s var(--ease-mid), color .18s var(--ease-mid), background .18s var(--ease-mid);
}
.preset:hover{ color:var(--white); border-color:var(--line); }
.preset[aria-pressed="true"]{ background:var(--panel-3); color:var(--white); border-color:var(--signal); }

.ctrl{ display:flex; flex-direction:column; gap:.4rem; }
.ctrl .hint{ font-size:.75rem; color:var(--dim); line-height:1.5; }
.ctrl .top{ display:flex; justify-content:space-between; align-items:center; gap:.75rem; }
.ctrl .top label{ cursor:pointer; }
.val-in{
  font-family:var(--mono); font-size:.8125rem; color:var(--white);
  font-variant-numeric:tabular-nums; text-align:right;
  background:transparent; border:1px solid transparent; border-radius:2px;
  width:5.4rem; padding:.15rem .3rem;
  transition:border-color .18s var(--ease-mid), background .18s var(--ease-mid);
  -moz-appearance:textfield;
}
.val-in::-webkit-outer-spin-button,.val-in::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.val-in:hover{ border-color:var(--line-soft); }
.val-in:focus{ border-color:var(--signal); background:var(--void); outline:none; }

input[type=range]{ -webkit-appearance:none; appearance:none; width:100%; height:3px; border-radius:2px; background:var(--panel-3); cursor:pointer; margin:0; }
input[type=range]::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:15px; height:15px; border-radius:3px; background:var(--white); border:0; cursor:pointer; transition:background .18s,transform .18s; }
input[type=range]:hover::-webkit-slider-thumb{ background:var(--signal); transform:scale(1.12); }
input[type=range]::-moz-range-thumb{ width:15px; height:15px; border-radius:3px; background:var(--white); border:0; cursor:pointer; }
input[type=range]::-moz-range-track{ height:3px; border-radius:2px; background:var(--panel-3); }

.per-call{
  display:flex; align-items:baseline; gap:.6rem; flex-wrap:wrap;
  padding:.85rem 0; border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft);
}
.per-call .from{ font-family:var(--mono); font-size:1rem; color:var(--dim); font-variant-numeric:tabular-nums; text-decoration:line-through; text-decoration-color:rgba(232,64,42,.6); }
.per-call .to{ font-family:var(--display); font-variation-settings:"wdth" 112,"wght" 800; font-size:1.65rem; letter-spacing:-.02em; color:var(--white); font-variant-numeric:tabular-nums; }
.per-call .ar{ font-family:var(--mono); color:var(--signal); }

.readout{ display:flex; flex-wrap:wrap; gap:1.25rem 2.5rem; align-items:flex-end; }
.readout .big{ font-family:var(--display); font-variation-settings:"wdth" 114,"wght" 800; font-size:clamp(2.1rem,5vw,3.4rem); line-height:1; letter-spacing:-.03em; font-variant-numeric:tabular-nums; color:var(--white); }
.readout .sm{ font-family:var(--mono); font-size:.875rem; color:var(--text); font-variant-numeric:tabular-nums; }
.legend{ display:flex; flex-wrap:wrap; gap:1.25rem; }
.legend span{ display:flex; align-items:center; gap:.45rem; }
.legend i{ display:inline-block; flex:none; }
.disclaim{ font-size:.8125rem; line-height:1.6; color:var(--muted); max-width:46rem; }

/* ── shift & scale ──────────────────────────────────── */
.tracks{ display:grid; gap:1rem; grid-template-columns:1fr; }
@media (min-width:900px){ .tracks{ grid-template-columns:1fr 1fr; gap:1.25rem; } }
.track{
  position:relative; overflow:hidden;
  background:var(--panel); border:1px solid var(--line-soft); border-radius:4px;
  padding:clamp(1.35rem,3vw,2rem); display:flex; flex-direction:column; gap:1rem;
  transition:border-color .18s var(--ease-mid), background .18s var(--ease-mid);
}
.track:hover{ border-color:var(--line); background:var(--panel-2); }
/* vlakke randen: warm = jij, koel = de organisatie */
.track::before{ content:""; position:absolute; left:0; right:0; top:0; height:2px; background:var(--signal); opacity:.75; }
.track.b::before{ background:var(--indigo-lt); opacity:.9; }
.track .word{ font-family:var(--display); font-variation-settings:"wdth" 122,"wght" 900; font-size:clamp(2.4rem,5.2vw,3.9rem); line-height:.9; letter-spacing:-.03em; text-transform:uppercase; }
.track .who{ font-size:.9375rem; color:var(--muted); }
.track dl{ margin:0; display:flex; flex-direction:column; gap:.7rem; }
.track .row{ display:grid; grid-template-columns:7.5rem 1fr; gap:.85rem; align-items:baseline; padding-top:.7rem; border-top:1px solid var(--line-soft); }
.track .row dt{ font-family:var(--mono); font-size:.625rem; letter-spacing:.07em; text-transform:uppercase; color:var(--dim); }
.track .row dd{ margin:0; font-size:.9375rem; color:var(--text); }
@media (max-width:520px){ .track .row{ grid-template-columns:1fr; gap:.2rem; } }

/* ── mechanisme ─────────────────────────────────────── */
.steps{ display:grid; gap:0; grid-template-columns:1fr; border-top:1px solid var(--line-soft); }
@media (min-width:820px){ .steps{ grid-template-columns:1fr 1fr; column-gap:2.5rem; } }
.stp{ display:grid; grid-template-columns:2.25rem 1fr; gap:1rem; padding:.95rem 0; border-bottom:1px solid var(--line-soft); }
.stp .ix{ font-family:var(--mono); font-size:.6875rem; color:var(--dim); padding-top:.3rem; }
.stp:hover .ix{ color:var(--signal); }
.stp .nm{ font-family:var(--display); font-variation-settings:"wdth" 110,"wght" 700; font-size:1.0625rem; text-transform:uppercase; letter-spacing:-.015em; line-height:1.1; }
.stp .ds{ color:var(--muted); font-size:.875rem; line-height:1.5; margin-top:.2rem; }

/* ── bewijs: videovlakken ───────────────────────────── */
.proof{ display:grid; gap:1rem; grid-template-columns:1fr; }
@media (min-width:820px){ .proof{ grid-template-columns:repeat(3,1fr); } }
.vid{
  position:relative; border:1px solid var(--line-soft); border-radius:4px; overflow:hidden;
  background:var(--panel); display:flex; flex-direction:column;
  transition:border-color .18s var(--ease-mid), transform .18s var(--ease-mid);
}
.vid:hover{ border-color:var(--line); transform:translateY(-2px); }
.vid .frame{
  position:relative; aspect-ratio:16/10;
  background:
    radial-gradient(70% 60% at 50% 42%, rgba(43,49,112,.30), transparent 68%),
    linear-gradient(180deg,#13151d,#0b0c10);
  display:flex; align-items:center; justify-content:center;
  border-bottom:1px solid var(--line-soft);
}
.vid .frame::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(var(--line-soft) 1px,transparent 1px),linear-gradient(90deg,var(--line-soft) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:radial-gradient(75% 70% at 50% 50%,#000,transparent 72%);
  -webkit-mask-image:radial-gradient(75% 70% at 50% 50%,#000,transparent 72%);
}
.vid .play{
  position:relative; z-index:1; width:3.1rem; height:3.1rem; border-radius:50%;
  border:1px solid var(--line); background:rgba(8,8,10,.55); backdrop-filter:blur(4px);
  display:flex; align-items:center; justify-content:center;
  transition:border-color .2s var(--ease-mid), background .2s var(--ease-mid), transform .2s var(--ease-mid);
}
.vid:hover .play{ border-color:var(--signal); transform:scale(1.06); }
.vid .play::before{
  content:""; width:0; height:0; margin-left:3px;
  border-left:11px solid var(--text); border-top:7px solid transparent; border-bottom:7px solid transparent;
}
.vid:hover .play::before{ border-left-color:var(--signal); }
.vid .slot{
  position:absolute; left:.75rem; top:.75rem; z-index:1;
  font-family:var(--mono); font-size:.5625rem; letter-spacing:.09em; text-transform:uppercase;
  color:var(--dim); border:1px dashed var(--line); border-radius:2px; padding:.2rem .45rem;
  display:inline-flex; align-items:center; gap:.4rem;
}
.vid .slot::before{ content:""; width:5px; height:5px; border-radius:50%; background:var(--signal); flex:none; }
.vid .meta{ padding:1rem 1.1rem 1.15rem; display:flex; flex-direction:column; gap:.5rem; }
.vid .co{ display:flex; align-items:center; gap:.6rem; }
.vid .co .logo{
  width:1.9rem; height:1.9rem; border-radius:3px; flex:none;
  border:1px dashed var(--line); background:var(--panel-3);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--mono); font-size:.5625rem; color:var(--dim);
}
.vid .co b{ font-size:.9375rem; font-weight:600; color:var(--text); }
.vid .said{ font-size:.875rem; color:var(--muted); line-height:1.5; }
.vid .stat{ margin-top:.15rem; padding-top:.6rem; border-top:1px solid var(--line-soft); display:flex; justify-content:space-between; align-items:baseline; gap:.75rem; }
.vid .stat .k{ font-family:var(--mono); font-size:.5625rem; letter-spacing:.08em; text-transform:uppercase; color:var(--dim); }
.vid .stat .v{ font-family:var(--mono); font-size:.8125rem; color:var(--dim); font-variant-numeric:tabular-nums; }

.note{
  display:flex; gap:.8rem; align-items:flex-start;
  border:1px solid var(--line-soft); border-left:2px solid var(--signal); border-radius:0 4px 4px 0;
  background:var(--panel); padding:1rem 1.15rem;
}
.note p{ font-size:.9375rem; color:var(--muted); line-height:1.55; max-width:52rem; }

footer{ border-top:1px solid var(--line-soft); padding:clamp(2.5rem,5vw,4rem) 0 3.5rem; }
.foot{ display:flex; flex-wrap:wrap; gap:2rem 3.5rem; }
.foot nav{ display:flex; flex-direction:column; gap:.4rem; font-size:.875rem; }
.foot nav a{ color:var(--muted); text-decoration:none; transition:color .18s var(--ease-mid); }
.foot nav a:hover{ color:var(--white); }
.colo{ margin-top:2rem; padding-top:1rem; border-top:1px solid var(--line-soft); display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; }


/* ── verfijning ─────────────────────────────────────── */
/* elk vlak vangt licht aan de bovenrand */
.card,.calc,.vid,.track,.tier,.form,.note,.review,.vs{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
input[type=text],input[type=email],input[type=tel],textarea{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

/* sectiekop loopt uit in een haarlijn */
.sec-top{ align-items:center; }
.sec-top::after{ content:""; flex:1 1 auto; height:1px; background:var(--line-soft); min-width:2rem; }

/* zachte lichtnaad onder de navigatie */
header.nav::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px; pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.10) 22%,rgba(255,255,255,.10) 78%,transparent);
}

/* het venster staat buiten het sectieritme van de pagina */
#apply section{ padding:0; border-top:0; }

/* ── aanvraagvenster ─────────────────────────────── */
#apply{
  border:0; padding:0; background:transparent; color:var(--text);
  width:min(48rem,94vw); max-width:none; margin:auto;
}
#apply::backdrop{ background:rgba(4,4,6,.74); backdrop-filter:blur(7px); }
#apply[open]{ animation:aIn .38s var(--ease-in); }
.a-shell{
  display:flex; flex-direction:column; max-height:min(92vh,58rem); overflow:hidden;
  background:var(--panel); border:1px solid var(--line); border-radius:6px;
  box-shadow:0 40px 90px -24px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.07);
}
.a-top{
  display:flex; align-items:flex-start; gap:1rem;
  padding:1rem clamp(1.1rem,3vw,1.9rem) .8rem; border-bottom:1px solid var(--line-soft);
}
.a-top .d3{ margin-top:.25rem; max-width:32rem; font-size:1.0625rem; line-height:1.12; }
.a-close{
  margin-left:auto; flex:none; width:2.1rem; height:2.1rem; border-radius:50%;
  border:1px solid var(--line-soft); background:transparent; color:var(--muted);
  font-family:var(--mono); font-size:1rem; line-height:1; cursor:pointer;
  transition:color .18s var(--ease-mid), border-color .18s var(--ease-mid), transform .18s var(--ease-mid);
}
.a-close:hover{ color:var(--white); border-color:var(--line); transform:rotate(90deg); }


/* ── gloed onder de knop, bloeit mee met de vulling ──── */
.btn{
  transition:transform .18s var(--ease-mid), color .18s var(--ease-mid), box-shadow .45s var(--ease-in);
  box-shadow:0 0 0 0 rgba(232,64,42,0);
}
.btn:hover,.btn:focus-visible{
  box-shadow:
    0 12px 34px -10px rgba(232,64,42,.60),
    0 0 46px -6px rgba(255,107,53,.34),
    0 0 0 1px rgba(255,107,53,.22);
}
.btn.line{ box-shadow:inset 0 0 0 1px var(--line), 0 0 0 0 rgba(232,64,42,0); }
.btn.line:hover,.btn.line:focus-visible{
  box-shadow:
    inset 0 0 0 1px rgba(255,107,53,.30),
    0 12px 30px -12px rgba(232,64,42,.48),
    0 0 34px -8px rgba(255,107,53,.24);
}
@media (prefers-reduced-motion:reduce){
  .btn,.btn.line{ transition:none; }
}

.js .rv{ opacity:0; transform:translateY(16px); transition:opacity .7s var(--ease-in), transform .7s var(--ease-in); }
.js .rv.in{ opacity:1; transform:none; }

@media (max-width:760px){ .nav-links{ display:none; } }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .hero .d1 .ln i{ transform:none; }
  .fade{ opacity:1; }
  .js .rv{ opacity:1; transform:none; }
}

/* ── laatste ronde ──────────────────────────────────── */

/* op een smal scherm staan drie knoppen naast elkaar lelijk te breken */
@media (max-width:620px){
  .hero-cta{ display:grid; grid-template-columns:1fr; gap:.6rem; }
  .hero-cta .btn{ justify-content:center; }
}

/* het bewijsblok als er nog geen video's zijn */
.bewijs-nog{ display:grid; gap:1rem; grid-template-columns:1fr; }
@media (min-width:860px){ .bewijs-nog{ grid-template-columns:1.15fr 1fr; gap:2.5rem; align-items:start; } }
.bewijs-nog .straks{
  border:1px solid var(--line-soft); border-left:2px solid var(--indigo-lt);
  border-radius:0 4px 4px 0; background:var(--panel); padding:1.15rem 1.25rem;
  display:flex; flex-direction:column; gap:.6rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.bewijs-nog .straks ul{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:.5rem; }
.bewijs-nog .straks li{ display:flex; gap:.6rem; font-size:.9375rem; color:var(--muted); line-height:1.5; }
.bewijs-nog .straks li::before{ content:"—"; color:var(--dim); font-family:var(--mono); font-size:.75rem; flex:none; }
