/* Gastplekken voor leiders: dagkeuze, stappen, aanmeldformulier en de A/B-hero.
   Bouwt op styles.css en workshops.css. Radius volgt hoogte (DESIGN.md kapittel 3):
   inputs 48px hoog = 12, kaarten = 24, knoppen pill. Lime blijft de CTA. */

/* A/B: zonder script of bij variant a staat a; b alleen bij data-ab="b". */
html:not([data-ab="b"]) .ab-b{display:none}
html[data-ab="b"] .ab-a{display:none}

.ld-note{font-size:14px;color:var(--on-deep-sec);margin-top:var(--sp-100)}
.wsh-cream .ld-note{color:var(--text-sec)}

/* Dagkeuze */
.ld-days{display:grid;grid-template-columns:1fr;gap:var(--sp-150);margin-top:var(--sp-300)}
.ld-day{background:#fff;border:1px solid var(--border);border-radius:24px;padding:var(--sp-300) var(--sp-200)}
.ld-day .ld-when{font-family:var(--font-brand);font-size:12px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--label)}
.ld-day h3{font-family:var(--font-display);font-size:22px;font-weight:700;color:var(--navy);margin:var(--sp-100) 0 var(--sp-75)}
.ld-day .ld-lvl{font-family:var(--font-brand);font-size:14px;font-weight:600;color:var(--text-sec)}
.ld-day p{font-size:16px;line-height:1.55;color:var(--text);margin-top:var(--sp-150);max-width:540px}
.ld-day a{display:inline-block;margin-top:var(--sp-150);font-family:var(--font-brand);font-size:14px;font-weight:600;color:var(--navy);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}
.ld-cross{margin-top:var(--sp-200);font-size:16px;color:var(--text)}
.ld-cross a{color:var(--navy);font-weight:600;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}

/* Waarom we je hosten */
.ld-why-grid{display:grid;grid-template-columns:1fr;gap:var(--sp-300);align-items:center}
.ld-why-grid p{font-size:18px;line-height:1.55;color:var(--text);max-width:540px}
.ld-why-grid p+p{margin-top:var(--sp-150)}
.ld-why-grid figure img{width:100%;height:auto;border-radius:24px;display:block}

/* Stappen */
.ld-steps{list-style:none;counter-reset:st;display:grid;gap:var(--sp-150);margin-top:var(--sp-300);max-width:620px}
.ld-steps li{counter-increment:st;display:flex;gap:var(--sp-150);align-items:baseline;font-size:18px;color:var(--text)}
.ld-steps li::before{content:counter(st) ".";font-family:var(--font-brand);font-weight:600;font-variant-numeric:tabular-nums;color:var(--navy);min-width:22px}

/* Formulier */
.ld-apply{background:var(--navy)}
.ld-apply .sec-head h2{color:#fff}
.ld-apply .sec-head p{color:var(--on-deep-body)}
.ld-apply .eyebrow{color:var(--on-deep-sec)}
.ld-form-card{background:var(--cream);border-radius:24px;padding:var(--sp-300) var(--sp-200);max-width:640px;margin:var(--sp-300) auto 0}
.ld-grid{display:grid;grid-template-columns:1fr;gap:var(--sp-150)}
.ld-f label,.ld-f legend{display:block;font-family:var(--font-brand);font-size:14px;font-weight:600;color:var(--navy);margin-bottom:var(--sp-75)}
.ld-f .opt{font-weight:400;color:var(--text-sec)}
.ld-f input[type=text],.ld-f input[type=email],.ld-f input[type=tel],.ld-f input[type=url],.ld-f select,.ld-f textarea{width:100%;font-family:var(--font-brand);font-size:16px;color:var(--text);background:#fff;border:1px solid var(--border-cool);border-radius:12px;padding:12px 16px;min-height:48px;outline:none;transition:border-color .3s var(--ease),box-shadow .3s var(--ease)}
.ld-f textarea{min-height:96px;resize:vertical;line-height:1.5}
.ld-f input:focus,.ld-f select:focus,.ld-f textarea:focus{border-color:var(--navy);box-shadow:0 0 0 2px #fff,0 0 0 4px var(--navy)}
.ld-f.bad input,.ld-f.bad select{border-color:#B3261E}
.ld-f .err{display:none;font-size:14px;color:#B3261E;margin-top:var(--sp-50)}
.ld-f.bad .err{display:block}
.ld-f .hint{font-size:14px;color:var(--text-sec);margin-top:var(--sp-50)}
fieldset.ld-f{border:0;padding:0;margin:0}
.ld-radio{display:flex;gap:var(--sp-100);align-items:flex-start;border:1px solid var(--border-cool);border-radius:20px;padding:var(--sp-150);cursor:pointer;margin-top:var(--sp-75);transition:background .3s var(--ease),border-color .3s var(--ease)}
.ld-radio input{margin-top:4px;accent-color:var(--navy);width:18px;height:18px;flex-shrink:0}
.ld-radio b{display:block;font-family:var(--font-brand);font-size:16px;color:var(--navy)}
.ld-radio span{font-size:14px;color:var(--text-sec)}
.ld-radio:has(input:checked){background:var(--lime-2);border-color:var(--navy)}
.ld-check{display:flex;gap:var(--sp-100);align-items:flex-start;font-size:14px;color:var(--text);line-height:1.5}
.ld-check input{margin-top:3px;width:18px;height:18px;accent-color:var(--navy);flex-shrink:0}
.ld-check a{color:var(--navy);text-decoration:underline}
.ld-soft{display:none;background:#fff;border-radius:12px;padding:var(--sp-100) var(--sp-150);font-size:14px;color:var(--text);margin-top:var(--sp-75)}
.ld-soft.on{display:block}
.ld-soft a{color:var(--navy);font-weight:600;text-decoration:underline}
.ld-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ld-submit{margin-top:var(--sp-200)}
.ld-submit .btn[disabled]{opacity:.6;cursor:wait}
.ld-micro{font-size:14px;color:var(--text-sec);margin-top:var(--sp-100)}
.ld-fail{display:none;background:#FBEAE8;color:#7A1C15;border-radius:12px;padding:var(--sp-100) var(--sp-150);font-size:14px;margin-top:var(--sp-150)}
.ld-fail.on{display:block}
.ld-fail a{color:#7A1C15;font-weight:600}
.ld-done{display:none;text-align:left}
.ld-done h3{font-family:var(--font-display);font-size:26px;font-weight:700;color:var(--navy)}
.ld-done p{font-size:18px;line-height:1.55;color:var(--text);margin-top:var(--sp-100)}
.ld-form-card.sent form{display:none}
.ld-form-card.sent .ld-done{display:block}

@media (min-width:768px){
  .ld-days{grid-template-columns:1fr 1fr;gap:var(--sp-200)}
  .ld-days.one{grid-template-columns:1fr;max-width:640px}
  .ld-why-grid{grid-template-columns:1fr 1fr;gap:var(--sp-500)}
  .ld-grid.two{grid-template-columns:1fr 1fr}
  .ld-form-card{padding:var(--sp-400)}
}

/* Radio en checkbox: .ld-f label zet display:block, deze winnen op specificiteit. */
.ld-f label.ld-radio,.ld-f label.ld-check{display:flex;margin-bottom:0}
.ld-f label.ld-check{font-family:var(--font-text);font-size:14px;font-weight:400;color:var(--text)}
.ld-f label.ld-radio b{margin-bottom:2px}
.ld-f label.ld-radio span{font-family:var(--font-text);font-weight:400}
.ld-why,.ld-cream{background:var(--cream)}

/* Sticker naast de knop: schaarste. Geen lime (de knop is al lime), dus navy op cream en cream op navy. */
.ld-cta{display:flex;align-items:center;gap:var(--sp-150);flex-wrap:wrap}
.ld-sticker{display:inline-block;font-family:var(--font-brand);font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;line-height:1.2;padding:8px 16px;border-radius:100px;background:var(--cream);color:var(--navy);transform:rotate(-6deg);white-space:nowrap}
.wsh-cream .ld-sticker,.ld-cream .ld-sticker{background:var(--navy);color:var(--cream)}
.ld-value{font-family:var(--font-brand);font-size:14px!important;font-weight:600;color:var(--green-dark)!important;margin-top:var(--sp-100)!important}

/* Stappen in de aanmeldsectie, op navy; horizontaal vanaf tablet. */
.ld-apply .ld-steps{margin:var(--sp-200) auto 0;max-width:640px}
.ld-apply .ld-steps li{color:var(--on-deep);font-size:16px}
.ld-apply .ld-steps li::before{color:var(--on-deep-sec)}
@media (min-width:768px){
  .ld-steps-row{grid-template-columns:repeat(3,1fr);max-width:960px!important;gap:var(--sp-300)}
  .ld-apply .sec-head{text-align:center}
  .ld-apply .ld-steps-row li{flex-direction:column;gap:var(--sp-75);border-top:1px solid rgba(234,241,248,.25);padding-top:var(--sp-150)}
}
/* Mobiel: de knop is volle breedte, dus de sticker plakt op de rechterbovenhoek van de knop. */
@media (max-width:767px){
  .ld-cta{position:relative}
  .ld-cta .ld-sticker{position:absolute;right:8px;top:-16px;z-index:2}
}
@media (min-width:768px){.ld-apply .sec-head{margin-left:auto;margin-right:auto;max-width:960px}}

/* Ronde 4: probleem en "why" in één blok, foto ingezoomd. */
.ld-why-h{font-family:var(--font-display);font-size:22px;font-weight:700;color:var(--navy);margin-top:var(--sp-400)}
.ld-why-p{font-size:17px;line-height:1.55;color:var(--text);max-width:540px;margin-top:var(--sp-100)}
.ld-zoom{aspect-ratio:1/1;overflow:hidden;border-radius:24px;margin:0}
.ld-zoom img{width:100%;height:100%;object-fit:cover;transform:scale(1.45);transform-origin:50% 62%;border-radius:0!important}
.ld-guar{font-size:15px;line-height:1.5;color:var(--text);margin:var(--sp-75) 0 var(--sp-100)}

/* Drie stappen: genummerde cirkels in een rij, ook op mobiel. */
.ld-steps3{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-150);max-width:760px;margin:var(--sp-200) auto 0;padding:0}
.ld-steps3 li{display:flex;flex-direction:column;gap:var(--sp-50);color:var(--on-deep-body);font-size:14px;line-height:1.4}
.ld-steps3 i{font-style:normal;width:36px;height:36px;border-radius:50%;border:1px solid rgba(234,241,248,.4);display:flex;align-items:center;justify-content:center;font-family:var(--font-brand);font-weight:700;font-size:15px;color:#fff;margin-bottom:var(--sp-50)}
.ld-steps3 b{font-family:var(--font-brand);font-size:15px;color:#fff}

/* Compacter formulier. */
.ld-form-card{margin-top:var(--sp-200);padding:var(--sp-200) var(--sp-150)}
.ld-grid{gap:var(--sp-100)}
.ld-grid.pair{grid-template-columns:1fr 1fr}
.ld-f label,.ld-f legend{margin-bottom:var(--sp-50);font-size:13px}
.ld-f input[type=text],.ld-f input[type=email],.ld-f input[type=tel],.ld-f input[type=url],.ld-f select{min-height:44px;padding:8px 12px}
.ld-f textarea{min-height:72px}
.ld-radio{padding:var(--sp-100) var(--sp-150);margin-top:var(--sp-50)}
.ld-submit{margin-top:var(--sp-150)}
@media (min-width:768px){ .ld-form-card{padding:var(--sp-300)} .ld-steps3{gap:var(--sp-300)} .ld-steps3 li{font-size:15px} }

/* Trainers compacter op deze pagina. */
[data-section=trainers].tmr{padding:var(--sp-400) 0}
.ld-zoom{clip-path:inset(0 round 24px)}
.ld-zoom img{transform:scale(1.35);transform-origin:50% 38%}
.ld-zoom img{height:100%!important;width:100%!important;object-fit:cover!important;display:block}

/* Ronde 5 */
.ld-apply .eyebrow{color:var(--lime)}
.ld-bonus{font-size:16px;line-height:1.5;color:var(--text);margin-top:var(--sp-200)}
.ld-bonus b{color:var(--navy)}
.ld-micro{color:var(--navy);font-weight:600}
.ld-f .req{color:#B3261E;font-weight:700}
.ld-req-note{font-size:13px;color:var(--text-sec);margin-top:var(--sp-100)}
/* Na verzenden scrolt de kaart in beeld; houd de bedankkop vrij van de vaste nav (28 sep 2026). */
.ld-form-card{scroll-margin-top:104px}
/* V3 Dagplanning op /leaders-business (Stefan 30 sep 2026): dag per uur, teamregels, trainers in de Maven-kaart. */
.lv-prog .wrap{display:flex;flex-direction:column;gap:20px}
.lv-tl{list-style:none;margin:0;padding:0 0 0 18px;border-left:2px solid rgba(18,52,90,.2)}
.lv-tl li{position:relative;padding:0 0 16px 16px}
.lv-tl li::before{content:"";position:absolute;left:-26px;top:3px;width:12px;height:12px;border-radius:50%;background:var(--cream);border:2px solid var(--navy)}
.lv-tl span{display:block;font-family:var(--font-brand);font-size:13px;color:var(--text-sec)}
.lv-tl b{display:block;font-size:16px;color:var(--navy)}
.lv-tl p{margin:2px 0 0;font-size:15px;color:var(--text-sec)}
.lv-team{padding:16px;background:#fff;border-radius:14px}
.lv-team h3{font-size:16px;color:var(--navy);margin:0 0 4px}
.lv-team ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.lv-team li{font-size:15px;color:var(--text)}
.lv-trs{display:grid;gap:22px}
.lv-t{border-top:2px solid var(--navy);padding-top:16px;display:flex;flex-direction:column;gap:10px}
.lv-th{display:flex;justify-content:space-between;gap:14px;align-items:center}
.lv-th b{display:block;font-family:var(--font-display);font-size:22px;color:var(--navy);letter-spacing:-.2px}
.lv-th small{display:block;font-family:var(--font-brand);font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:#7A5A18;margin-top:4px}
.lv-th img{width:80px;height:80px;border-radius:50%;object-fit:cover;flex:none}
.lv-t p{margin:0;font-size:15px;line-height:1.55}
.lv-w{display:flex;align-items:center;gap:18px;padding-top:10px;border-top:1px solid #E8DCC8}
.lv-w span{font-family:var(--font-mono,monospace);font-size:11px;letter-spacing:.5px;text-transform:uppercase;color:var(--text-sec)}
.lv-w img{max-height:22px;max-width:100px;width:auto;mix-blend-mode:multiply}
.lv-w img[src*="rvo"]{max-height:30px}
.lv-li{align-self:flex-start;display:inline-flex;align-items:center;height:36px;padding:0 14px;border:1px solid var(--navy);border-radius:12px;font-size:14px;font-weight:600;color:var(--navy);text-decoration:none}
.lv-li:hover{background:var(--lime)}
@media(min-width:760px){.lv-trs{grid-template-columns:1fr 1fr;gap:32px}.lv-prog .lv-tl,.lv-prog .lv-team{max-width:760px}}
.lv-day{display:flex;flex-direction:column;gap:6px;padding-top:18px;border-top:2px solid var(--navy)}
.lv-day .ld-when{font-family:var(--font-brand);font-size:12px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--label)}
.lv-day h3{margin:0;font-family:var(--font-display);font-size:22px;font-weight:700;color:var(--navy)}
.lv-day .ld-lvl{font-family:var(--font-brand);font-size:14px;font-weight:600;color:var(--text-sec)}
.lv-day .lv-day-p{margin:4px 0 12px;font-size:15px;line-height:1.55;color:var(--text);max-width:540px}
.lv-day + .lv-day{margin-top:18px}

/* Desktop: de twee dagen van development naast elkaar, links uitgelijnd met de rest (Stefan 30 sep 2026). */
@media(min-width:900px){.lv-days{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}.lv-days .lv-day + .lv-day{margin-top:0}}