/* vertaalbureau-tolken: block-port van ReactBitsPro Blocks/bento-4 (podium met werkstroom in zes fasen,
   bonnetje, knop Opnieuw) met daarachter ReactBitsPro Components/chroma-halo (origineel gecompileerd,
   assets/chroma-halo.bundle.js). Tailwind-klassen van bento-4 vertaald naar gescopete CSS; @sm = 24rem en
   @2xl = 42rem als containerquery op het podium, zoals in de bron. Kop met een eigen correctiestreep. */
.msm-vertaalbureau-tolken{--vbt-p:var(--m-primary,#ef6f42);--vbt-bg:var(--m-bg,#f6f2e9);--vbt-ink:var(--m-ink,#152a38);--vbt-s:var(--m-surface,#fffdf8);--vbt-mu:var(--m-muted,#5b6670);--vbt-a2:var(--m-accent2,#173e5a);--vbt-l:var(--m-line,#d8d1c3);--vbt-fd:var(--m-font-display,'Literata',Georgia,serif);--vbt-fb:var(--m-font-body,'Source Sans 3',Arial,sans-serif);--vbt-ease:cubic-bezier(.22,1,.36,1);--vbt-shadow:0 1px 2px rgba(0,0,0,.04),0 12px 32px -12px rgba(0,0,0,.12);position:relative;box-sizing:border-box;scroll-margin-top:112px;padding:72px 16px;background:var(--vbt-bg);color:var(--vbt-ink);font-family:var(--vbt-fb);line-height:1.5}
.msm-vertaalbureau-tolken *,.msm-vertaalbureau-tolken *::before,.msm-vertaalbureau-tolken *::after{box-sizing:inherit}
.msm-vertaalbureau-tolken .vbt-wrap{max-width:1200px;margin:0 auto}

/* Kop met correctiestreep (eigen, geen Pro-bron) */
.msm-vertaalbureau-tolken .vbt-head{max-width:46rem}
.msm-vertaalbureau-tolken .vbt-kicker{margin:0 0 10px;font-size:13px;line-height:16px;letter-spacing:.04em;text-transform:uppercase;color:color-mix(in oklab,var(--vbt-ink) 70%,transparent)}
.msm-vertaalbureau-tolken .vbt-title{position:relative;display:inline-block;margin:0;padding-bottom:16px;font-family:var(--vbt-fd);font-weight:500;font-size:clamp(30px,calc(2.2vw + 18px),46px);line-height:1.12;letter-spacing:-.015em;text-wrap:balance;color:var(--vbt-ink)}
.msm-vertaalbureau-tolken .vbt-mark{position:absolute;left:0;bottom:0;width:min(100%,9.5em);height:13px;overflow:visible}
.msm-vertaalbureau-tolken .vbt-mark path{fill:none;stroke:var(--vbt-p);stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
.msm-vertaalbureau-tolken .vbt-title[data-vbt-mark="wacht"] .vbt-mark path{stroke-dashoffset:1}
.msm-vertaalbureau-tolken .vbt-title[data-vbt-mark="teken"] .vbt-mark path{transition:stroke-dashoffset .6s cubic-bezier(.33,1,.68,1)}

.msm-vertaalbureau-tolken .vbt-lead{margin:20px 0 0;max-width:40rem;font-size:18px;line-height:1.6;color:var(--vbt-mu)}

/* Drie manieren, gekoppeld aan het boekingsvak */
.msm-vertaalbureau-tolken .vbt-ways{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;margin:40px 0 0;padding:0;list-style:none}
.msm-vertaalbureau-tolken .vbt-way-item{margin:0}
.msm-vertaalbureau-tolken .vbt-way{display:flex;flex-direction:column;height:100%;padding:24px;border:1px solid var(--vbt-l);border-radius:20px;background:var(--vbt-s);color:inherit;text-decoration:none;transition:border-color .2s var(--vbt-ease),transform .2s var(--vbt-ease),box-shadow .2s var(--vbt-ease)}
.msm-vertaalbureau-tolken .vbt-way:hover{border-color:color-mix(in srgb,var(--vbt-a2) 40%,var(--vbt-l));transform:translateY(-2px);box-shadow:var(--vbt-shadow)}
.msm-vertaalbureau-tolken .vbt-way:focus-visible{outline:2px solid var(--vbt-a2);outline-offset:3px}
.msm-vertaalbureau-tolken .vbt-way-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:color-mix(in srgb,var(--vbt-a2) 9%,var(--vbt-s));color:var(--vbt-a2)}
.msm-vertaalbureau-tolken .vbt-way-body{display:block}
.msm-vertaalbureau-tolken .vbt-way-title{display:block;margin-top:18px;font-family:var(--vbt-fd);font-size:22px;font-weight:600;line-height:1.25;color:var(--vbt-ink)}
.msm-vertaalbureau-tolken .vbt-way-text{display:block;margin-top:8px;font-size:15.5px;line-height:1.55;color:var(--vbt-mu)}
.msm-vertaalbureau-tolken .vbt-way-meta{display:block;margin-top:14px;font-size:14px;font-weight:600;color:var(--vbt-ink);font-variant-numeric:tabular-nums}
.msm-vertaalbureau-tolken .vbt-way-cta{display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding-top:18px;font-weight:600;color:var(--vbt-a2)}
.msm-vertaalbureau-tolken .vbt-way-cta svg{transition:transform .2s var(--vbt-ease)}
.msm-vertaalbureau-tolken .vbt-way:hover .vbt-way-cta svg{transform:translateX(3px)}

/* Rij: werkstroomkaart (bento-4) en wat de tolk meeneemt */
.msm-vertaalbureau-tolken .vbt-row{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin-top:20px}
.msm-vertaalbureau-tolken .vbt-flow{position:relative;display:flex;flex-direction:column;min-height:380px;width:100%;overflow:hidden;border:1px solid var(--vbt-l);border-radius:24px;background:var(--vbt-s)}
.msm-vertaalbureau-tolken .vbt-stage{position:relative;display:none;flex:1;min-height:220px;overflow:hidden;container-type:inline-size;background:var(--vbt-s)}
.msm-vertaalbureau-tolken[data-vbt-live] .vbt-stage{display:block}
.msm-vertaalbureau-tolken .vbt-halo{position:absolute;inset:0;overflow:hidden;pointer-events:none}
/* Originele CSS van chroma-halo, gescoped */
.msm-vertaalbureau-tolken .chroma-halo{position:relative;width:100%;height:100%;min-height:320px;overflow:hidden}
.msm-vertaalbureau-tolken .vbt-podium{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:220px;padding:28px 20px 30px}
.msm-vertaalbureau-tolken[data-vbt-live] .vbt-podium[data-vbt-enter="wacht"]{opacity:0}
.msm-vertaalbureau-tolken .vbt-grid{display:grid;align-items:center;width:100%;max-width:340px}
.msm-vertaalbureau-tolken .vbt-copy{display:block;min-width:0}
.msm-vertaalbureau-tolken .vbt-t{display:block;font-size:12.5px;font-weight:600;line-height:16px;color:var(--vbt-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msm-vertaalbureau-tolken .vbt-s{display:block;font-size:11.5px;line-height:15px;color:var(--vbt-mu);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msm-vertaalbureau-tolken .vbt-trigger{display:flex;align-items:center;gap:10px;width:244px;max-width:100%;margin:0 auto;padding:5px 12px;border:1px solid var(--vbt-l);border-radius:12px;background:var(--vbt-s);box-shadow:var(--vbt-shadow)}
.msm-vertaalbureau-tolken .vbt-initial{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:999px;background:color-mix(in srgb,var(--vbt-a2) 12%,var(--vbt-s));color:var(--vbt-a2);font-family:var(--vbt-fd);font-size:13px;font-weight:600}
.msm-vertaalbureau-tolken .vbt-tick{display:grid;place-items:center;flex:none;width:16px;height:16px;margin-left:auto;border-radius:999px;background:color-mix(in srgb,var(--vbt-l) 55%,var(--vbt-s));color:var(--vbt-mu);opacity:1;transition:opacity .3s}
.msm-vertaalbureau-tolken .vbt-stage[data-phase="0"] .vbt-tick{opacity:.2}
.msm-vertaalbureau-tolken .vbt-link{position:relative;height:12px}
.msm-vertaalbureau-tolken .vbt-link--b{height:28px}
.msm-vertaalbureau-tolken .vbt-link svg{display:block;width:100%;height:100%;overflow:visible}
.msm-vertaalbureau-tolken .vbt-svg-h{display:none!important}
.msm-vertaalbureau-tolken .vbt-base{fill:none;stroke:var(--vbt-l);stroke-width:1.25}
.msm-vertaalbureau-tolken .vbt-draw{fill:none;stroke:var(--vbt-a2);stroke-width:1.5;stroke-linecap:round;stroke-dasharray:1 1;stroke-dashoffset:1;opacity:0;transition:stroke-dashoffset .2s var(--vbt-ease),opacity .2s var(--vbt-ease)}
.msm-vertaalbureau-tolken .vbt-draw.is-on{stroke-dashoffset:0;opacity:1;transition-duration:.5s}
.msm-vertaalbureau-tolken .vbt-hub{position:relative;display:flex;align-items:center;gap:10px;width:256px;max-width:100%;height:48px;margin:0 auto;padding:0 14px;overflow:hidden;border-radius:12px;background:var(--vbt-a2);color:#fff;box-shadow:0 8px 24px -12px rgba(0,0,0,.35)}
.msm-vertaalbureau-tolken .vbt-hub-icon{flex:none;opacity:.8}
.msm-vertaalbureau-tolken .vbt-hub .vbt-t{color:#fff}
.msm-vertaalbureau-tolken .vbt-hub .vbt-s{color:rgba(255,255,255,.66)}
.msm-vertaalbureau-tolken .vbt-progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.1)}
.msm-vertaalbureau-tolken .vbt-progress-bar{display:block;height:100%;transform:scaleX(1);transform-origin:left;background:rgba(255,255,255,.6);transition:transform .2s linear}
.msm-vertaalbureau-tolken .vbt-progress-bar:not(.is-on){transform:scaleX(0)}
.msm-vertaalbureau-tolken .vbt-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.msm-vertaalbureau-tolken .vbt-action{display:flex;align-items:center;gap:8px;min-height:52px;padding:8px 10px;border:1px solid var(--vbt-l);border-radius:12px;background:var(--vbt-s);box-shadow:var(--vbt-shadow)}
.msm-vertaalbureau-tolken .vbt-action .vbt-t,.msm-vertaalbureau-tolken .vbt-action .vbt-s{white-space:normal}
.msm-vertaalbureau-tolken .vbt-action-icon{display:grid;place-items:center;flex:none;width:24px;height:24px;border-radius:6px;background:color-mix(in srgb,var(--vbt-l) 50%,var(--vbt-s));color:var(--vbt-mu)}
.msm-vertaalbureau-tolken .vbt-icon{display:grid;place-items:center}
.msm-vertaalbureau-tolken .vbt-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;max-width:340px;min-height:20px;margin-top:8px}
.msm-vertaalbureau-tolken .vbt-status{display:flex;align-items:center;gap:6px;min-width:0;font-size:11.5px;color:var(--vbt-mu);font-variant-numeric:tabular-nums}
.msm-vertaalbureau-tolken .vbt-status-icon{flex:none;color:var(--vbt-l);transition:color .3s}
.msm-vertaalbureau-tolken .vbt-stage[data-phase="5"] .vbt-status-icon{color:var(--vbt-a2)}
.msm-vertaalbureau-tolken .vbt-status-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.msm-vertaalbureau-tolken .vbt-replay{display:inline-flex;flex:none;align-items:center;gap:6px;padding:4px 6px;border:0;border-radius:6px;background:transparent;color:var(--vbt-mu);font:inherit;font-size:11.5px;font-weight:600;cursor:pointer;transition:background-color .2s,color .2s}
.msm-vertaalbureau-tolken .vbt-replay:hover{background:color-mix(in srgb,var(--vbt-l) 45%,transparent);color:var(--vbt-ink)}
.msm-vertaalbureau-tolken .vbt-replay:focus-visible{outline:2px solid var(--vbt-a2);outline-offset:2px}
.msm-vertaalbureau-tolken .vbt-receipt{width:100%;max-width:340px;margin-top:28px;padding:14px 16px;border:1px solid var(--vbt-l);border-radius:12px;background:var(--vbt-s)}
.msm-vertaalbureau-tolken .vbt-receipt-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;font-size:11.5px}
.msm-vertaalbureau-tolken .vbt-receipt-title{font-weight:600;color:var(--vbt-ink)}
.msm-vertaalbureau-tolken .vbt-run{color:var(--vbt-mu);font-variant-numeric:tabular-nums}
.msm-vertaalbureau-tolken .vbt-events{display:grid;gap:16px}
.msm-vertaalbureau-tolken .vbt-event{display:flex;align-items:flex-start;gap:10px;min-width:0}
.msm-vertaalbureau-tolken .vbt-event-check{display:grid;place-items:center;flex:none;width:16px;height:16px;margin-top:1px;border:1px solid var(--vbt-l);border-radius:999px;color:transparent;transition:color .3s,border-color .3s}
.msm-vertaalbureau-tolken .vbt-event.is-done .vbt-event-check{border-color:color-mix(in srgb,var(--vbt-a2) 45%,var(--vbt-l));color:var(--vbt-a2)}
.msm-vertaalbureau-tolken .vbt-event-body{flex:1;min-width:0}
.msm-vertaalbureau-tolken .vbt-event-row{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:11.5px}
.msm-vertaalbureau-tolken .vbt-event-label{color:color-mix(in srgb,var(--vbt-mu) 70%,var(--vbt-s))}
.msm-vertaalbureau-tolken .vbt-event.is-done .vbt-event-label{font-weight:600;color:var(--vbt-ink)}
.msm-vertaalbureau-tolken .vbt-event-time{flex:none;color:var(--vbt-mu);font-variant-numeric:tabular-nums}
.msm-vertaalbureau-tolken .vbt-event-detail{display:block;margin-top:2px;overflow:hidden;font-size:11.5px;color:var(--vbt-mu);white-space:nowrap;text-overflow:ellipsis}
.msm-vertaalbureau-tolken .vbt-steps{margin:0;padding:24px 24px 8px 44px;font-size:15px;line-height:1.55;color:var(--vbt-ink)}
.msm-vertaalbureau-tolken .vbt-steps li+li{margin-top:8px}
.msm-vertaalbureau-tolken[data-vbt-live] .vbt-steps{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.msm-vertaalbureau-tolken .vbt-flow-text{padding:8px 24px 24px}
.msm-vertaalbureau-tolken .vbt-flow-title{margin:0;font-family:var(--vbt-fd);font-size:20px;font-weight:600;line-height:1.3;letter-spacing:-.01em;color:var(--vbt-ink)}
.msm-vertaalbureau-tolken .vbt-flow-intro{margin:6px 0 0;max-width:44rem;font-size:15px;line-height:1.6;color:var(--vbt-mu)}
@container (min-width:24rem){
  .msm-vertaalbureau-tolken .vbt-podium{padding:32px 24px 36px}
  .msm-vertaalbureau-tolken .vbt-trigger{padding-top:8px;padding-bottom:8px}
  .msm-vertaalbureau-tolken .vbt-link--a{height:20px}
  .msm-vertaalbureau-tolken .vbt-hub{height:54px}
  .msm-vertaalbureau-tolken .vbt-action{min-height:60px;padding:8px 12px}
  .msm-vertaalbureau-tolken .vbt-bar{min-height:24px;margin-top:16px}
}
@container (min-width:42rem){
  .msm-vertaalbureau-tolken .vbt-grid{max-width:800px;grid-template-columns:1fr 36px 1.15fr 44px 1fr}
  .msm-vertaalbureau-tolken .vbt-trigger,.msm-vertaalbureau-tolken .vbt-hub{width:100%}
  .msm-vertaalbureau-tolken .vbt-link,.msm-vertaalbureau-tolken .vbt-link--a,.msm-vertaalbureau-tolken .vbt-link--b{height:132px}
  .msm-vertaalbureau-tolken .vbt-svg-v{display:none!important}
  .msm-vertaalbureau-tolken .vbt-svg-h{display:block!important}
  .msm-vertaalbureau-tolken .vbt-actions{grid-template-columns:minmax(0,1fr)}
  .msm-vertaalbureau-tolken .vbt-bar{max-width:800px;margin-top:24px}
  .msm-vertaalbureau-tolken .vbt-receipt{max-width:800px;margin-top:36px}
  .msm-vertaalbureau-tolken .vbt-events{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
}

/* Wat de tolk meeneemt: twee uitsneden groot in beeld, met de regel eronder */
.msm-vertaalbureau-tolken .vbt-kit{display:flex;flex-direction:column;margin:0;padding:24px;overflow:hidden;border:1px solid var(--vbt-l);border-radius:24px;background:color-mix(in srgb,var(--vbt-a2) 4%,var(--vbt-s))}
.msm-vertaalbureau-tolken .vbt-kit-label{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--vbt-mu)}
.msm-vertaalbureau-tolken .vbt-kit-stage{position:relative;flex:1;min-height:240px;margin:8px 0 0;aspect-ratio:4/3}
.msm-vertaalbureau-tolken .vbt-kit-stage img{position:absolute;display:block;height:auto;object-fit:contain}
.msm-vertaalbureau-tolken .vbt-kit-a{left:-2%;top:0;width:58%}
.msm-vertaalbureau-tolken .vbt-kit-b{right:-2%;bottom:0;width:46%}
.msm-vertaalbureau-tolken .vbt-kit-quote{margin:16px 0 0;padding-left:16px;border-left:2px solid var(--vbt-p);font-family:var(--vbt-fd);font-size:19px;line-height:1.45;color:var(--vbt-ink)}

/* Boekingsmoment (gedeelde demo) */
.msm-vertaalbureau-tolken .vbt-booking{scroll-margin-top:112px;margin-top:clamp(40px,6vw,72px);padding:clamp(20px,3vw,36px);border:1px solid var(--vbt-l);border-radius:24px;background:var(--vbt-s);outline:none}
.msm-vertaalbureau-tolken .vbt-mailform{display:grid;gap:14px;max-width:32rem}
.msm-vertaalbureau-tolken .vbt-mailform-title{margin:0;font-family:var(--vbt-fd);font-size:24px;font-weight:600}
.msm-vertaalbureau-tolken .vbt-mailform label{display:grid;gap:6px;font-weight:600}
.msm-vertaalbureau-tolken .vbt-mailform input,.msm-vertaalbureau-tolken .vbt-mailform select{padding:10px 12px;border:1px solid var(--vbt-l);border-radius:10px;background:var(--vbt-s);font:inherit;color:inherit}
.msm-vertaalbureau-tolken .vbt-mailform button{justify-self:start;padding:12px 18px;border:0;border-radius:999px;background:var(--vbt-a2);color:#fff;font:inherit;font-weight:600}
.msm-vertaalbureau-tolken .vbt-mailform p{margin:0;color:var(--vbt-mu);font-size:14px}

@media (min-width:640px){
  .msm-vertaalbureau-tolken{padding:88px 24px}
  .msm-vertaalbureau-tolken .vbt-kit-stage{aspect-ratio:2/1}
  .msm-vertaalbureau-tolken .vbt-kit-a{left:6%;width:42%}
  .msm-vertaalbureau-tolken .vbt-kit-b{right:8%;width:34%}
}
@media (min-width:768px){
  .msm-vertaalbureau-tolken .vbt-ways{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
}
@media (min-width:1024px){.msm-vertaalbureau-tolken{padding:112px 32px}}
@media (min-width:1120px){
  .msm-vertaalbureau-tolken .vbt-row{grid-template-columns:minmax(0,1.72fr) minmax(0,1fr)}
  .msm-vertaalbureau-tolken .vbt-kit-stage{aspect-ratio:auto;min-height:340px}
  .msm-vertaalbureau-tolken .vbt-kit-a{left:-4%;top:2%;width:80%}
  .msm-vertaalbureau-tolken .vbt-kit-b{right:-4%;bottom:-2%;width:60%}
}
@media (prefers-reduced-motion:reduce){
  .msm-vertaalbureau-tolken .vbt-way,.msm-vertaalbureau-tolken .vbt-way-cta svg,.msm-vertaalbureau-tolken .vbt-draw,.msm-vertaalbureau-tolken .vbt-progress-bar,.msm-vertaalbureau-tolken .vbt-tick,.msm-vertaalbureau-tolken .vbt-status-icon,.msm-vertaalbureau-tolken .vbt-event-check,.msm-vertaalbureau-tolken .vbt-title .vbt-mark path{transition:none!important}
  .msm-vertaalbureau-tolken .vbt-way:hover,.msm-vertaalbureau-tolken .vbt-way:hover .vbt-way-cta svg{transform:none}
  .msm-vertaalbureau-tolken .vbt-title .vbt-mark path{stroke-dashoffset:0!important}
}