/* Workshoppagina 24 nov 2026: bouwt op home.css (tokens, glas, knoppen, formulier) en voegt alleen de eigen blokken toe. */
.ws-hero{padding-top:128px;padding-bottom:24px}
.ws-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:56px;align-items:start}
.ws-hero h1{font-size:clamp(40px,5vw,72px);letter-spacing:-.05em;line-height:1}
.ws-hero .lead{animation:none}
/* Zin die aansluit op de advertentie, alleen bij een bekende utm_content (6 nov 2026) */
.ws-hook{margin-top:22px;max-width:620px;font-size:18px;line-height:1.45;font-weight:600;color:var(--ink)}
/* Optionele vragen ingeklapt, zodat het formulier kort oogt */
.ws-meer{margin:0;background:transparent;border:1px solid var(--line);border-radius:var(--r-md);-webkit-backdrop-filter:none;backdrop-filter:none}
.ws-meer summary{padding:12px 14px;font-size:15px;font-weight:700;gap:8px}
.ws-meer summary .opt{margin-left:6px;margin-right:auto;font-family:var(--font-body,inherit);font-weight:500;font-size:13px;color:var(--ink-3);white-space:nowrap}
.ws-meer summary .pm{width:28px;height:28px}
.ws-meer-in{display:grid;gap:18px;padding:4px 16px 18px}
.ws-when{margin-top:30px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:640px}
.ws-when div{border-radius:var(--r-md);padding:14px 16px;background:var(--glass-2);border:1px solid var(--glass-brd)}
.ws-when small{display:block;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-bottom:2px}
.ws-when b{font-family:var(--font-display);font-size:18px;letter-spacing:-.02em;line-height:1.25}
/* Kennismaking: foto met video naast een korte introductie (sinds 3 nov 2026, voor koud verkeer) */
.ws-meet{margin-top:30px;display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:24px;align-items:center;max-width:640px}
.ws-video.video{order:0;margin:0;max-width:240px;width:100%;justify-self:start;animation:none}
.ws-video .frame{aspect-ratio:4/5}
.ws-video .play{width:64px;height:64px;top:44%}
.ws-video figcaption{left:16px;right:16px;bottom:14px}
.ws-video figcaption b{font-size:19px}
.ws-video figcaption span{font-size:13px}
.ws-host-name{font-family:var(--font-display);font-weight:800;font-size:22px;letter-spacing:-.02em;color:var(--ink);margin-bottom:6px}
.ws-host p{font-size:16px;color:var(--ink-2);line-height:1.5}
/* Bewijs: eigen Search Console naast een korte uitleg */
.ws-proof{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:40px;align-items:center}
.ws-proof h2{font-size:clamp(30px,3.6vw,46px);margin:8px 0 16px}
.ws-proof p{color:var(--ink-2)}
.ws-form{position:sticky;top:110px}
.ws-form .form-title{font-size:clamp(26px,2.6vw,34px)}
.ws-form form{display:grid;gap:18px}
.ws-form .button.primary{margin-left:0;width:100%;justify-content:center}
.ws-tick{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.4;color:var(--ink-2);cursor:pointer}
.ws-tick input{appearance:none;-webkit-appearance:none;width:20px;height:20px;flex:none;margin:1px 0 0;border-radius:6px;border:1.5px solid var(--ink-3);display:grid;place-items:center;background:var(--input-bg)}
.ws-tick input:checked{background:var(--cta-bg);border-color:var(--cta-bg)}
.ws-tick input:checked::after{content:"";width:5px;height:10px;border:solid var(--cta-ink);border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}
.ws-tick input:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.ws-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ws-cal{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.ws-cal .button{min-height:46px;font-size:15px}
.ws-agenda{list-style:none;margin:0;padding:0;display:grid;gap:12px;counter-reset:ag}
.ws-agenda li{border-radius:var(--r-lg);padding:22px 24px;display:grid;grid-template-columns:96px minmax(0,1fr);gap:18px;align-items:start}
.ws-agenda .t{font-family:var(--font-display);font-weight:800;font-size:15px;letter-spacing:-.01em;color:var(--acc-ink);padding-top:3px;font-variant-numeric:tabular-nums}
.ws-agenda h3{font-size:22px;letter-spacing:-.025em;line-height:1.2;margin-bottom:6px}
.ws-agenda p{color:var(--ink-2);font-size:17px}
.ws-agenda li.hot{background:var(--then-bg);color:var(--then-ink);border-color:transparent}
.ws-agenda li.hot .t{color:var(--then-tick)}
.ws-agenda li.hot p{color:var(--then-ink-2)}
.ws-two{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ws-card{border-radius:var(--r-xl);padding:clamp(24px,3vw,34px)}
.ws-card h2{font-size:clamp(26px,2.6vw,34px);margin-bottom:16px}
.ws-card p{color:var(--ink-2);margin-bottom:14px}
.ws-card .ticks li{background:transparent;border:0;padding:4px 0}
/* Afsluiting: persoonlijke uitnodiging met portret (sinds 3 nov 2026) */
.ws-end{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:48px;align-items:center;max-width:1000px;margin:0 auto}
.ws-portret{margin:0;padding:10px;border-radius:var(--r-xl)}
.ws-portret img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;border-radius:24px}
.ws-end h2{font-size:clamp(32px,4.2vw,54px);margin-bottom:18px}
.ws-end p{color:var(--ink-2);margin-bottom:18px}
.ws-end .ws-groet{margin-bottom:28px;font-size:17px}
.ws-groet span{display:block;margin-top:8px;font-family:var(--font-display);font-weight:800;color:var(--ink);letter-spacing:-.01em}
@media(max-width:1180px){
  .ws-two{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
@media(max-width:979px){
  .ws-hero{padding-top:108px}
  .ws-grid,.ws-two,.ws-proof{grid-template-columns:minmax(0,1fr);gap:32px}
  .ws-end{grid-template-columns:minmax(0,1fr);gap:28px;text-align:center}
  .ws-portret{max-width:280px;width:100%;justify-self:center}
  .ws-form{position:relative;top:0}
}
@media(max-width:640px){
  /* op mobiel komt het gezicht direct onder de kop, vóór de lange uitleg (Meta-verkeer is bijna allemaal mobiel) */
  .ws-grid>div:first-child{display:flex;flex-direction:column}
  .ws-grid>div:first-child .eyebrow{order:0}
  .ws-grid>div:first-child h1{order:1}
  /* 6 nov 2026: datum en de advertentiezin direct onder de kop, zodat het eerste scherm bevestigt wat de advertentie beloofde */
  .ws-when{order:2;margin-top:18px;gap:6px}
  .ws-hook{order:3;margin-top:16px;font-size:17px}
  .ws-meet{order:4;margin-top:22px}
  .ws-grid>div:first-child .lead{order:5;margin-top:22px}
  .ws-meet{grid-template-columns:minmax(0,150px) minmax(0,1fr);gap:16px;align-items:start}
  .ws-video.video{max-width:150px;padding:6px}
  .ws-video .frame{border-radius:18px}
  .ws-video .play{width:50px;height:50px}
  .ws-video figcaption{left:10px;right:10px;bottom:10px}
  .ws-video figcaption b{font-size:15px}
  .ws-video figcaption span{display:none}
  .ws-host-name{font-size:19px}
  .ws-host p{font-size:15px}
  .ws-when{grid-template-columns:minmax(0,1fr)}
  .ws-when div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 14px}
  .ws-when b{font-size:16px}
  .ws-when small{margin:0}
  .ws-agenda li{grid-template-columns:minmax(0,1fr);gap:6px;padding:20px}
}

/* knop direct onder de datum op telefoon en tablet: het formulier staat daar pas na de video (6 nov) */
.ws-hero-cta{display:none}
@media(max-width:979px){.ws-hero-cta{display:inline-flex;align-self:flex-start;margin-top:18px}}
@media(max-width:640px){.ws-hero-cta{order:3;margin-top:16px}}

/* agendapunt dat past bij de advertentie waar iemand op klikte (6 nov) */
.ws-agenda li.jouw{box-shadow:0 0 0 3px #FFB238,0 18px 50px -12px rgba(15,29,54,.16)}
.jouw-label{display:inline-block;margin-bottom:8px;padding:4px 12px;border-radius:999px;background:rgba(255,183,64,.22);color:#7E4400;font-weight:700;font-size:13px;letter-spacing:.01em}
.ws-agenda li.hot .jouw-label{background:#FFC15C;color:#1C1405}

/* 7 nov 2026: cadeau (Praktijkscan) zichtbaar maken, en Jens persoonlijker in beeld */
.gift{width:22px;height:22px;flex:none}
.ws-gift{display:flex;gap:14px;align-items:center;margin-top:16px;max-width:640px;padding:14px 18px;border-radius:var(--r-md);background:#FFEDA8;border:2px solid #FFB238;color:var(--ink);text-decoration:none;box-shadow:0 12px 30px -14px rgba(196,106,0,.45);transition:transform .3s var(--ease-out,ease)}
.ws-gift:hover{transform:translateY(-2px)}
.ws-gift .gift{width:44px;height:44px;padding:10px;border-radius:50%;background:#FFC15C;color:#1C1405}
.ws-gift span{display:flex;flex-direction:column;gap:1px}
.ws-gift small{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#7E4400}
.ws-gift b{font-family:var(--font-display);font-size:20px;letter-spacing:-.02em;line-height:1.2}
.ws-gift em{font-style:normal;font-size:15px;color:#4A3A1C}
.ws-site-veld{padding:14px;border-radius:var(--r-md);background:rgba(255,193,92,.16);border:1px solid rgba(255,178,56,.6)}
.ws-site-veld label{display:block}
.ws-site-veld label .gift{width:20px;height:20px;vertical-align:-4px;margin-right:6px;color:#8F4D00}
.ws-thanks-gift{display:flex;gap:10px;align-items:flex-start;margin-top:10px;padding:10px 12px;border-radius:var(--r-sm);background:#FFEDA8;color:var(--ink);font-weight:600}
.ws-thanks-gift .gift{color:#8F4D00;margin-top:1px}
.ws-host a{color:var(--ink);font-weight:700;text-underline-offset:3px;white-space:nowrap}
/* Waarom ik dit doe */
.ws-waarom{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:56px;align-items:center;max-width:1080px;margin:0 auto}
.ws-waarom-foto{margin:0;padding:10px;border-radius:var(--r-xl);background:var(--glass-2);border:1px solid var(--glass-brd);box-shadow:var(--shadow);transform:rotate(-1.2deg)}
.ws-waarom-foto img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:24px}
.ws-waarom-tekst h2{font-size:clamp(30px,3.8vw,48px);margin:8px 0 20px}
.ws-waarom-tekst p{color:var(--ink-2);font-size:18px;line-height:1.6;margin-bottom:16px;max-width:38em}
.ws-waarom-tekst .ws-groet{margin-top:4px}
/* Dit krijg je: het cadeau groot, de rest ernaast */
.ws-stack{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:16px;align-items:stretch}
.ws-stack-gift{border-radius:var(--r-xl);padding:clamp(26px,3.2vw,40px);background:#FFEDA8;border:2px solid #FFB238;box-shadow:0 24px 60px -24px rgba(196,106,0,.5);color:var(--ink)}
.ws-stack-label{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 8px;border-radius:999px;background:#FFC15C;color:#1C1405;font-weight:800;font-size:14px;letter-spacing:.04em;text-transform:uppercase}
.ws-stack-label .gift{width:20px;height:20px}
.ws-stack-gift h3{font-size:clamp(26px,2.8vw,36px);letter-spacing:-.03em;line-height:1.1;margin:16px 0 12px}
.ws-stack-gift p{color:#3A3426;font-size:17px;margin-bottom:12px}
.ws-stack-gift .ticks{margin:4px 0 14px}
.ws-stack-gift .ticks li{background:transparent;border:0;padding:4px 0;color:var(--ink)}
.ws-stack-gift .ticks svg{color:#8F4D00}
.ws-stack-fine{font-size:15px!important;color:#5A4A26!important;margin-bottom:20px!important}
.ws-stack-rest{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.ws-stack-rest li{border-radius:var(--r-lg);padding:20px 22px;display:flex;flex-direction:column;gap:4px}
.ws-stack-rest b{font-family:var(--font-display);font-size:20px;letter-spacing:-.02em}
.ws-stack-rest span{color:var(--ink-2);font-size:16px}
@media(max-width:979px){
  .ws-waarom,.ws-stack{grid-template-columns:minmax(0,1fr);gap:28px}
  .ws-waarom-foto{max-width:320px;width:100%;justify-self:center}
}
@media(max-width:640px){
  /* volgorde op de telefoon: kop, advertentiezin, datum, cadeau, knop, Jens, uitleg */
  .ws-hook{order:2}
  .ws-when{order:3}
  .ws-gift{order:4;margin-top:12px;padding:12px 14px}
  .ws-gift b{font-size:18px}
  .ws-gift em{font-size:14px}
  .ws-gift .gift{width:40px;height:40px;padding:9px}
  .ws-hero-cta{order:5}
  .ws-meet{order:6}
  .ws-grid>div:first-child .lead{order:7}
  .ws-waarom-tekst p{font-size:17px}
  .ws-stack-gift .btn{width:100%;justify-content:space-between}
}

/* 7 nov: regel onder de aanmeldknop */
.ws-na-knop{margin:-6px 0 0;text-align:center;font-size:14px;color:var(--ink-3)}

/* 7 nov: scanlijn door de cadeaubanner, en de reactie op een eerdere scan */
.ws-gift{position:relative;overflow:hidden;align-items:flex-start}
.ws-gift .gift{margin-top:2px}
.ws-scanlijn{position:absolute;left:0;right:0;top:-6px;height:3px;pointer-events:none;background:linear-gradient(90deg,rgba(255,178,56,0),#FFB238 30%,#C46A00 50%,#FFB238 70%,rgba(255,178,56,0));box-shadow:0 0 14px 3px rgba(255,178,56,.55);opacity:0;animation:ws-scan 3.6s ease-in-out 1.2s infinite}
@keyframes ws-scan{0%{top:-6px;opacity:0}8%{opacity:.95}50%{top:calc(100% + 3px);opacity:.95}58%{opacity:0}100%{top:calc(100% + 3px);opacity:0}}
@media(prefers-reduced-motion:reduce){.ws-scanlijn{animation:none;display:none}}
.ws-quote{font-size:16px!important;line-height:1.5;color:var(--ink)!important;font-style:italic;margin:4px 0 22px!important;max-width:34em}
.ws-quote span{display:block;margin-top:6px;font-style:normal;font-size:13px;color:#7E4400;letter-spacing:.02em}
/* 10 nov 2026: grootste bezwaar twee weken vooraf ("ik weet nog niet of ik kan") direct onder de datum wegnemen */
.ws-kanniet{margin-top:12px;max-width:640px;font-size:15px;line-height:1.5;color:var(--ink-2)}
.ws-kanniet b{color:var(--ink)}
.ws-two{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:979px){.ws-two{grid-template-columns:minmax(0,1fr)}}
@media(max-width:640px){.ws-kanniet{order:3;margin-top:8px;font-size:14px}}
