@font-face { font-family:'Syne'; font-weight:800; src:url(assets/syne-800.ttf) format('truetype'); }
@font-face { font-family:'Syne'; font-weight:600; src:url(assets/syne-600.ttf) format('truetype'); }
@font-face { font-family:'DM Sans'; font-weight:300; src:url(assets/dmsans-300.ttf) format('truetype'); }
@font-face { font-family:'DM Sans'; font-weight:400; src:url(assets/dmsans-400.ttf) format('truetype'); }
@font-face { font-family:'DM Sans'; font-weight:500; src:url(assets/dmsans-500.ttf) format('truetype'); }
:root{ --cream:#FCF8F7; --ink:#1E1E1E; --blush:#F6DBDD; --wine:#30181B; --ink60:#4F4A4A; }
*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ font-family:'DM Sans',sans-serif; font-weight:300; color:var(--ink); background:var(--cream); line-height:1.7; -webkit-font-smoothing:antialiased; }
h1,h2,h3{ font-family:'Syne',sans-serif; font-weight:800; line-height:1.02; letter-spacing:-0.01em; }
.kicker{ font-family:'DM Sans'; font-weight:500; font-size:12px; letter-spacing:0.22em; text-transform:uppercase; }
.wrap{ max-width:1180px; margin:0 auto; padding:0 40px; }
a{ color:inherit; text-decoration:none; }
.btn{ display:inline-block; font-family:'DM Sans'; font-weight:500; font-size:14px; letter-spacing:0.02em; padding:15px 30px; border-radius:40px; transition:.25s; cursor:pointer; border:1.5px solid var(--ink); }
.btn-dark{ background:var(--ink); color:var(--cream); }
.btn-dark:hover{ background:transparent; color:var(--ink); }
.btn-ghost{ background:transparent; color:var(--ink); }
.btn-ghost:hover{ background:var(--ink); color:var(--cream); }
.btn-light{ background:var(--blush); color:var(--wine); border-color:var(--blush); }
.btn-light:hover{ background:transparent; color:var(--blush); border-color:var(--blush); }

/* NAV */
nav{ position:sticky; top:0; z-index:50; background:rgba(252,248,247,.9); backdrop-filter:blur(10px); border-bottom:1px solid rgba(48,24,27,.08); }
.nav-in{ display:flex; align-items:center; justify-content:space-between; height:74px; }
.nav-logo img{ height:42px; width:auto; display:block; }
.cta-mark img, .foot-logo img, .site-foot img{ height:auto; max-width:100%; }
.nav-links{ display:flex; gap:38px; align-items:center; }
.nav-links a{ font-size:14px; font-weight:400; transition:.2s; }
.nav-links a:hover{ opacity:.55; }
.nav-cta{ font-size:13px!important; font-weight:500!important; padding:10px 22px; border:1.5px solid var(--ink); border-radius:40px; transition:.25s; }
.nav-cta:hover{ background:var(--ink); color:var(--cream); opacity:1!important; }

/* MARQUEE */
.marquee{ background:var(--ink); color:var(--cream); overflow:hidden; padding:13px 0; white-space:nowrap; }
.marquee span{ display:inline-block; font-family:'Syne'; font-weight:600; font-size:15px; letter-spacing:.04em; animation:scroll 26s linear infinite; }
.marquee span b{ color:var(--blush); font-weight:600; margin:0 6px; }
@keyframes scroll{ from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* HERO */
.hero{ position:relative; padding:95px 0 90px; overflow:hidden; }
.hero-grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:50px; align-items:center; }
.hero h1{ font-size:84px; color:var(--ink); }
.hero .lead{ font-size:19px; color:var(--ink60); max-width:430px; margin:26px 0 36px; }
.hero-cta{ display:flex; gap:14px; flex-wrap:wrap; }
.hero-visual{ position:relative; aspect-ratio:1/1; background:var(--blush); border-radius:28px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.hero-visual img{ width:62%; }
.hero-visual .disco{ position:absolute; top:0; left:4%; height:50%; width:auto; z-index:2; pointer-events:none; }
.hero-tag{ position:absolute; bottom:22px; left:22px; background:var(--wine); color:var(--blush); font-family:'DM Sans'; font-weight:500; font-size:12px; letter-spacing:.16em; text-transform:uppercase; padding:9px 16px; border-radius:30px; }

/* LOGOS strip */
.trust{ padding:34px 0; border-bottom:1px solid rgba(48,24,27,.08); }
.trust-in{ display:flex; align-items:center; gap:44px; justify-content:center; flex-wrap:wrap; }
.trust p{ font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink60); font-weight:500; }
.trust .names{ display:flex; gap:40px; flex-wrap:wrap; }
.trust .names span{ font-family:'Syne'; font-weight:600; font-size:17px; color:var(--ink); opacity:.5; }
.trust .trust-scale{ flex-basis:100%; text-align:center; max-width:720px; margin:0 auto; font-size:14px; line-height:1.6; letter-spacing:0; text-transform:none; font-weight:400; color:var(--ink60); }

/* SECTION base */
section{ padding:104px 0; }
.sec-kicker{ color:var(--wine); margin-bottom:18px; }
.sec-head{ font-size:50px; color:var(--ink); max-width:760px; }
.sec-sub{ font-size:18px; color:var(--ink60); max-width:560px; margin-top:22px; }

/* SERVICES */
.serv-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:56px; }
.card{ border-radius:22px; padding:38px 32px; min-height:300px; display:flex; flex-direction:column; }
.card .num{ font-family:'Syne'; font-weight:800; font-size:34px; }
.card h3{ font-size:23px; margin:18px 0 12px; }
.card p{ font-size:15px; line-height:1.65; }
.card.blush{ background:var(--blush); color:var(--ink); } .card.blush .num{ color:var(--wine); } .card.blush p{ color:var(--ink60); }
.card.wine{ background:var(--wine); color:var(--cream); } .card.wine .num{ color:var(--blush); } .card.wine p{ color:#D9C6C8; }
.card.ink{ background:var(--ink); color:var(--cream); } .card.ink .num{ color:var(--blush); } .card.ink p{ color:#BDB8B9; }
.serv-extra{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:22px; }
.mini{ border:1px solid rgba(48,24,27,.13); border-radius:18px; padding:26px 28px; }
.mini h4{ font-family:'Syne'; font-weight:600; font-size:17px; margin-bottom:7px; }
.mini p{ font-size:14px; color:var(--ink60); }

/* ABOUT */
.about{ background:var(--wine); color:var(--cream); }
.about-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:64px; align-items:center; }
.about-photo{ aspect-ratio:4/5; background:var(--ink); border-radius:24px; display:flex; align-items:center; justify-content:center; position:relative; }
.about-photo img{ width:58%; }
.about-photo .ph{ position:absolute; bottom:20px; left:20px; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--blush); font-weight:500; }
.about .sec-kicker{ color:var(--blush); }
.about h2{ font-size:46px; color:var(--cream); }
.about p{ font-size:17px; color:#E3D3D5; margin-top:24px; max-width:520px; }
.about .quote{ font-family:'Syne'; font-weight:600; font-size:21px; color:var(--blush); line-height:1.35; margin-top:30px; }
.about .sign{ font-size:14px; letter-spacing:.05em; color:#C9B6B8; margin-top:22px; font-weight:500; }
.about-stats{ display:flex; gap:48px; flex-wrap:wrap; margin-top:36px; }
.about-stats .st b{ display:block; font-family:'Syne'; font-weight:800; font-size:36px; color:var(--blush); line-height:1; }
.about-stats .st span{ font-size:13px; color:#C9B6B8; letter-spacing:.04em; }

/* PRICING */
.price-grid{ display:grid; grid-template-columns:1fr 1fr; gap:26px; margin-top:56px; max-width:880px; }
.plan{ border-radius:24px; padding:42px 40px; }
.plan.start{ background:transparent; border:1.5px solid var(--ink); }
.plan.groei{ background:var(--wine); color:var(--cream); position:relative; }
.plan .tag{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:500; }
.plan.start .tag{ color:var(--ink60); } .plan.groei .tag{ color:var(--blush); }
.plan h3{ font-size:32px; margin:8px 0 4px; }
.plan .desc{ font-size:14px; margin-bottom:26px; }
.plan.start .desc{ color:var(--ink60); } .plan.groei .desc{ color:#D9C6C8; }
.plan ul{ list-style:none; margin-bottom:30px; }
.plan li{ font-size:14.5px; padding:9px 0; padding-left:26px; position:relative; }
.plan.start li{ border-bottom:1px solid rgba(48,24,27,.09); color:var(--ink60); }
.plan.groei li{ border-bottom:1px solid rgba(246,219,221,.16); color:#EBDDDE; }
.plan li::before{ content:'\2192'; position:absolute; left:0; }
.plan.start li::before{ color:var(--wine); } .plan.groei li::before{ color:var(--blush); }
.plan .price{ font-family:'Syne'; font-weight:800; font-size:46px; }
.plan .per{ font-size:13px; font-weight:400; }
.plan.start .per{ color:var(--ink60); } .plan.groei .per{ color:#D9C6C8; }
.badge{ position:absolute; top:28px; right:34px; background:var(--blush); color:var(--wine); font-size:11px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; padding:7px 15px; border-radius:30px; }
.price-note{ font-size:13px; color:var(--ink60); margin-top:24px; max-width:880px; }

/* PROCESS */
.proc{ background:var(--blush); }
.proc .sec-head,.proc .sec-kicker{ color:var(--wine); }
.steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-top:56px; }
.step .n{ font-family:'Syne'; font-weight:800; font-size:18px; color:var(--wine); border-bottom:2px solid var(--wine); padding-bottom:12px; display:block; }
.step h4{ font-family:'Syne'; font-weight:600; font-size:19px; margin:18px 0 8px; color:var(--ink); }
.step p{ font-size:14px; color:#6e5658; }

/* CTA */
.cta{ background:var(--ink); color:var(--cream); text-align:center; }
.cta img{ width:140px; margin-bottom:30px; }
.cta h2{ font-size:62px; color:var(--blush); }
.cta p{ font-size:18px; color:#BDB8B9; max-width:440px; margin:22px auto 38px; }

/* FOOTER */
footer{ background:var(--ink); color:#8A8385; padding:40px 0; border-top:1px solid rgba(246,219,221,.12); }
.foot-in{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; }
.foot-in img{ height:38px; }
.foot-in p{ font-size:13px; }
.foot-links{ display:flex; gap:26px; }
.foot-links a{ font-size:13px; color:#BDB8B9; transition:.2s; }
.foot-links a:hover{ color:var(--blush); }

@media(max-width:900px){
 .hero-grid,.about-grid{ grid-template-columns:1fr; } .hero h1{ font-size:58px; }
 .serv-grid,.serv-extra,.steps,.price-grid{ grid-template-columns:1fr; }
 .sec-head{ font-size:38px; } .cta h2{ font-size:44px; } .nav-links{ display:none; }
 .hero-visual{ max-width:360px; } .about h2{ font-size:34px; }
}

/* NAV DROPDOWN */
.nav-drop{ position:relative; }
.nav-drop > a{ font-size:14px; font-weight:400; transition:.2s; display:inline-flex; align-items:center; gap:5px; }
.nav-drop > a:hover{ opacity:.55; }
.nav-drop .caret{ font-size:9px; opacity:.6; }
.nav-drop-menu{ position:absolute; top:100%; left:50%; transform:translateX(-50%); padding-top:14px; opacity:0; visibility:hidden; transition:.2s; }
.nav-drop:hover .nav-drop-menu{ opacity:1; visibility:visible; }
.nav-drop-menu-in{ background:var(--cream); border:1px solid rgba(48,24,27,.1); border-radius:16px; padding:10px; box-shadow:0 14px 34px rgba(30,30,30,.1); min-width:250px; }
.nav-drop-menu-in a{ display:block; font-size:14px; font-weight:400; padding:11px 16px; border-radius:10px; white-space:nowrap; transition:.2s; }
.nav-drop-menu-in a:hover{ background:var(--blush); color:var(--wine); opacity:1; }
.nav-drop-menu-in .soon{ display:block; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink60); padding:8px 16px 4px; }

/* --- toevoegingen --- */
.about-photo{ overflow:hidden; background:var(--blush); }
.about-photo img.portret{ width:100%; height:100%; object-fit:cover; object-position:center center; border-radius:24px; }
@media(min-width:901px){ .hero-grid{ grid-template-columns:1fr 1fr; gap:56px; } }
.hero-visual{ background:var(--blush); aspect-ratio:4/5; }
.hero-visual img.hero-portret{ width:100%; height:100%; object-fit:cover; object-position:center top; }
.hero-visual .disco{ height:22%; left:auto; right:5%; top:4%; }
.hero-tag{ bottom:20px; left:auto; right:20px; }
@media(max-width:900px){ .hero-visual{ max-width:420px; margin:0 auto; } }
.faq-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; margin-top:26px; }
@media(max-width:820px){ .faq-grid{ grid-template-columns:1fr; } }
.hero .kicker{ color:var(--wine); margin-bottom:16px; display:block; }
.case{ background:var(--wine); color:var(--cream); border-radius:24px; padding:46px 48px; margin-top:44px; }
.case .lbl{ color:var(--blush); font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:500; }
.case h3{ font-size:30px; margin:12px 0 18px; color:var(--cream); max-width:20ch; }
.case .intro{ font-size:16px; color:#E3D3D5; max-width:62ch; }

/* --- COOKIEBANNER --- */
.cookiebar{ position:fixed; left:20px; right:20px; bottom:20px; z-index:9999; display:flex; justify-content:center; }
.cookiebar[hidden]{ display:none; }
.cookiebar-in{ background:var(--wine); color:#E3D3D5; border-radius:20px; padding:22px 26px; max-width:620px; width:100%; box-shadow:0 18px 50px rgba(30,30,30,.25); font-family:'DM Sans'; }
.cookiebar-in p{ font-size:14px; line-height:1.6; margin:0 0 16px; }
.cookiebar-in b{ color:var(--cream); font-family:'Syne'; font-weight:700; }
.cookiebar-btns{ display:flex; gap:10px; flex-wrap:wrap; }
.ck-btn{ font-family:'DM Sans'; font-weight:500; font-size:13.5px; padding:11px 22px; border-radius:30px; border:1px solid var(--blush); background:var(--blush); color:var(--wine); cursor:pointer; transition:.2s; }
.ck-btn:hover{ background:var(--cream); border-color:var(--cream); }
.ck-ghost{ background:transparent; color:var(--blush); }
.ck-ghost:hover{ background:rgba(246,219,221,.14); border-color:var(--blush); color:var(--cream); }
@media(max-width:600px){ .cookiebar{ left:12px; right:12px; bottom:12px; } .cookiebar-in{ padding:20px; } .ck-btn{ flex:1; } }


/* --- ACTIEBALK + CHATGPT-PILOT --- */
.alertbar{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:8px 14px; background:var(--wine); color:var(--blush); padding:12px 40px; font-family:'DM Sans'; font-size:13.5px; text-align:center; transition:.25s; }
.alertbar:hover{ background:#3d1f23; }
.alertbar .dot{ width:8px; height:8px; border-radius:50%; background:var(--blush); animation:pulse 2s ease-in-out infinite; flex:none; }
@keyframes pulse{ 0%,100%{ opacity:1; transform:scale(1);} 50%{ opacity:.35; transform:scale(.7);} }
.alertbar b{ font-family:'Syne'; font-weight:700; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--cream); }
.alertbar .txt{ color:#E3D3D5; }
.alertbar .arrow{ color:var(--cream); font-weight:500; border-bottom:1px solid rgba(252,248,247,.45); padding-bottom:1px; }
@media(max-width:700px){ .alertbar{ padding:12px 20px; font-size:12.5px; } .alertbar .txt{ display:none; } }

.gpt{ background:var(--ink); color:var(--cream); }
.gpt .sec-kicker{ color:var(--blush); }
.gpt .sec-head{ color:var(--cream); }
.gpt .sec-sub{ color:#BDB8B9; max-width:640px; }
.gpt-grid{ display:grid; grid-template-columns:1.25fr .75fr; gap:34px; margin-top:52px; align-items:start; }
.gpt-col h4{ font-family:'Syne'; font-weight:600; font-size:19px; color:var(--cream); margin-bottom:10px; }
.gpt-col p{ font-size:15px; color:#BDB8B9; max-width:60ch; }
.gpt-col + .gpt-col{ margin-top:0; }
.gpt-body > div + div{ margin-top:30px; }
.gpt-list{ list-style:none; margin-top:14px; }
.gpt-list li{ font-size:14.5px; color:#D6D0D1; padding:9px 0 9px 26px; position:relative; border-bottom:1px solid rgba(252,248,247,.1); }
.gpt-list li::before{ content:'\2192'; position:absolute; left:0; color:var(--blush); }
.gpt-card{ background:var(--blush); color:var(--wine); border-radius:24px; padding:36px 34px; position:sticky; top:100px; }
.gpt-card .tag{ font-family:'DM Sans'; font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; font-weight:500; opacity:.7; }
.gpt-card .amount{ font-family:'Syne'; font-weight:800; font-size:52px; line-height:1; margin:10px 0 4px; display:block; }
.gpt-card .amount small{ font-size:17px; font-weight:600; }
.gpt-card .meta{ font-size:14px; margin-bottom:22px; }
.gpt-card ul{ list-style:none; margin-bottom:26px; }
.gpt-card li{ font-size:13.5px; padding:7px 0 7px 20px; position:relative; border-bottom:1px solid rgba(48,24,27,.14); }
.gpt-card li::before{ content:'\2022'; position:absolute; left:2px; font-weight:700; }
.gpt-card .btn{ width:100%; text-align:center; border-color:var(--wine); background:var(--wine); color:var(--blush); }
.gpt-card .btn:hover{ background:transparent; color:var(--wine); }
.gpt-card .fine{ font-size:12px; margin-top:16px; opacity:.75; line-height:1.5; }
.gpt-honest{ border:1px solid rgba(252,248,247,.2); border-radius:18px; padding:26px 28px; margin-top:34px; }
.gpt-honest h4{ font-family:'Syne'; font-weight:600; font-size:17px; color:var(--blush); margin-bottom:8px; }
.gpt-honest p{ font-size:14.5px; color:#BDB8B9; max-width:78ch; }
@media(max-width:900px){ .gpt-grid{ grid-template-columns:1fr; } .gpt-card{ position:static; } }
.case .cijfers{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px; border-top:1px solid rgba(246,219,221,.18); margin-top:30px; padding-top:30px; }
.case .cijfers b{ font-family:'Syne'; font-weight:800; font-size:40px; color:var(--blush); display:block; line-height:1.05; }
.case .cijfers span{ font-size:14px; color:#D9C6C8; }
.case .les{ border-top:1px solid rgba(246,219,221,.18); margin-top:30px; padding-top:26px; font-size:15.5px; color:#E3D3D5; max-width:66ch; }
.case-mini{ display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:22px; }
.case-mini .m{ border:1px solid rgba(48,24,27,.13); border-radius:20px; padding:30px 32px; }
.case-mini .m span{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--wine); font-weight:500; }
.case-mini .m h4{ font-family:'Syne'; font-weight:600; font-size:20px; margin:8px 0 10px; }
.case-mini .m p{ font-size:14.5px; color:var(--ink60); }
.pkg-grid{ display:grid; grid-template-columns:1fr 1fr; gap:26px; margin-top:52px; max-width:900px; }
.pkg{ border-radius:24px; padding:42px 40px; }
.pkg.a{ border:1.5px solid var(--ink); }
.pkg.b{ background:var(--wine); color:var(--cream); }
.pkg .tag{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:500; }
.pkg.a .tag{ color:var(--ink60); } .pkg.b .tag{ color:var(--blush); }
.pkg h3{ font-size:30px; margin:8px 0 6px; }
.pkg .desc{ font-size:14px; margin-bottom:24px; }
.pkg.a .desc{ color:var(--ink60); } .pkg.b .desc{ color:#D9C6C8; }
.pkg ul{ list-style:none; }
.pkg li{ font-size:14.5px; padding:9px 0 9px 26px; position:relative; }
.pkg.a li{ border-bottom:1px solid rgba(48,24,27,.09); color:var(--ink60); }
.pkg.b li{ border-bottom:1px solid rgba(246,219,221,.16); color:#EBDDDE; }
.pkg li::before{ content:'\2192'; position:absolute; left:0; }
.pkg.a li::before{ color:var(--wine); } .pkg.b li::before{ color:var(--blush); }
.trust .names a{ font-family:'Syne'; font-weight:600; font-size:17px; color:var(--ink); opacity:.5; transition:.2s; }
.trust .names a:hover{ opacity:1; color:var(--wine); }
@media(max-width:900px){
  .case-mini,.pkg-grid{ grid-template-columns:1fr; }
  .case .cijfers{ grid-template-columns:1fr; gap:22px; }
  .case{ padding:34px 28px; } .case h3{ font-size:24px; }
}

/* ============================================================
   NIEUW — multipage, formulier, FAQ, kennishub
   ============================================================ */

/* actieve navlink + mobiel menu */
.nav-links a.active{ color:var(--wine); font-weight:500; }
.nav-toggle{ display:none; background:none; border:1.5px solid var(--ink); border-radius:40px; padding:9px 16px; font-family:'DM Sans'; font-weight:500; font-size:13px; cursor:pointer; color:var(--ink); }
.nav-mob{ display:none; border-top:1px solid rgba(48,24,27,.08); background:var(--cream); }
.nav-mob.open{ display:block; }
.nav-mob a{ display:block; padding:15px 40px; font-size:15px; border-bottom:1px solid rgba(48,24,27,.06); }
.nav-mob a:last-child{ border-bottom:none; }
@media(max-width:900px){ .nav-toggle{ display:block; } }

/* paginakop voor subpagina's */
.phead{ padding:78px 0 60px; }
.phead h1{ font-size:62px; max-width:16ch; }
.phead .lead{ font-size:19px; color:var(--ink60); max-width:56ch; margin:26px 0 34px; }
.phead .kicker{ color:var(--wine); display:block; margin-bottom:16px; }
@media(max-width:900px){ .phead h1{ font-size:40px; } .phead{ padding:54px 0 44px; } }

/* checkrij onder de kop */
.checks{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:38px; }
.checks div{ border:1px solid rgba(48,24,27,.13); border-radius:16px; padding:18px 22px; font-size:14.5px; position:relative; padding-left:48px; }
.checks div::before{ content:'\2713'; position:absolute; left:22px; color:var(--wine); font-weight:700; }
@media(max-width:820px){ .checks{ grid-template-columns:1fr; } }

/* 2x2 kaartgrid */
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:52px; }
@media(max-width:820px){ .grid2{ grid-template-columns:1fr; } }

/* FAQ accordeon */
.faq{ max-width:860px; margin-top:44px; border-top:1px solid rgba(48,24,27,.14); }
.faq details{ border-bottom:1px solid rgba(48,24,27,.14); }
.faq summary{ list-style:none; cursor:pointer; padding:22px 44px 22px 0; font-family:'Syne'; font-weight:600; font-size:19px; position:relative; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:'+'; position:absolute; right:8px; top:50%; transform:translateY(-50%); font-family:'DM Sans'; font-weight:400; font-size:26px; color:var(--wine); transition:.2s; }
.faq details[open] summary::after{ content:'\2013'; }
.faq summary:hover{ color:var(--wine); }
.faq .a{ padding:0 44px 24px 0; font-size:15.5px; color:var(--ink60); max-width:70ch; }

/* ---------- FORMULIER ---------- */
.form-grid{ display:grid; grid-template-columns:.85fr 1.15fr; gap:56px; align-items:start; }
@media(max-width:900px){ .form-grid{ grid-template-columns:1fr; gap:38px; } }
.form-aside h1{ font-size:56px; }
.form-aside .lead{ font-size:18px; color:var(--ink60); margin:24px 0 32px; max-width:46ch; }
.form-aside ul{ list-style:none; }
.form-aside li{ font-size:15.5px; padding:11px 0 11px 28px; position:relative; border-bottom:1px solid rgba(48,24,27,.09); }
.form-aside li::before{ content:'\2192'; position:absolute; left:0; color:var(--wine); }
.form-aside .direct{ margin-top:30px; font-size:14.5px; color:var(--ink60); }
.form-aside .direct a{ color:var(--wine); border-bottom:1px solid rgba(48,24,27,.3); }
@media(max-width:900px){ .form-aside h1{ font-size:38px; } }

.formcard{ background:#fff; border:1px solid rgba(48,24,27,.13); border-radius:26px; padding:40px 38px; box-shadow:0 18px 50px rgba(48,24,27,.06); }
@media(max-width:600px){ .formcard{ padding:28px 22px; } }
.frow{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media(max-width:600px){ .frow{ grid-template-columns:1fr; } }
.field{ margin-bottom:20px; }
.field label{ display:block; font-family:'DM Sans'; font-weight:500; font-size:13.5px; margin-bottom:8px; color:var(--ink); }
.field .req{ color:var(--wine); }
.field input[type=text], .field input[type=email], .field input[type=tel], .field input[type=url], .field textarea{
  width:100%; font-family:'DM Sans'; font-weight:300; font-size:15px; color:var(--ink);
  background:var(--cream); border:1.5px solid rgba(48,24,27,.16); border-radius:14px; padding:13px 16px; transition:.2s; }
.field textarea{ min-height:118px; resize:vertical; line-height:1.6; }
.field input:focus, .field textarea:focus{ outline:none; border-color:var(--wine); background:#fff; }
.field .hint{ font-size:12.5px; color:var(--ink60); margin-top:7px; }

/* keuzechips */
.chips{ display:flex; flex-wrap:wrap; gap:9px; }
.chips input{ position:absolute; opacity:0; width:0; height:0; }
.chips label{ display:inline-block; font-family:'DM Sans'; font-weight:400; font-size:14px; padding:10px 18px; border-radius:40px;
  border:1.5px solid rgba(48,24,27,.18); cursor:pointer; transition:.18s; margin:0; color:var(--ink60); }
.chips label:hover{ border-color:var(--wine); color:var(--wine); }
.chips input:checked + label{ background:var(--wine); border-color:var(--wine); color:var(--blush); font-weight:500; }
.chips input:focus-visible + label{ outline:2px solid var(--wine); outline-offset:2px; }

.fsubmit{ width:100%; text-align:center; background:var(--ink); color:var(--cream); border:1.5px solid var(--ink);
  font-family:'DM Sans'; font-weight:500; font-size:15px; padding:16px 30px; border-radius:40px; cursor:pointer; transition:.25s; margin-top:6px; }
.fsubmit:hover{ background:var(--wine); border-color:var(--wine); color:var(--blush); }
.fnote{ font-size:12.5px; color:var(--ink60); margin-top:16px; line-height:1.55; }
.fnote a{ color:var(--wine); border-bottom:1px solid rgba(48,24,27,.3); }
.hp{ position:absolute; left:-9999px; opacity:0; height:0; overflow:hidden; }

/* bedanktpagina */
.thanks{ text-align:center; padding:120px 0; }
.thanks .mark{ width:92px; margin-bottom:34px; }
.thanks h1{ font-size:58px; color:var(--ink); max-width:18ch; margin:0 auto; }
.thanks p{ font-size:18px; color:var(--ink60); max-width:52ch; margin:26px auto 36px; }
@media(max-width:900px){ .thanks h1{ font-size:38px; } .thanks{ padding:72px 0; } }

/* ---------- KENNISHUB ---------- */
.tabs{ display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; }
.tab{ font-family:'DM Sans'; font-weight:400; font-size:14.5px; padding:11px 22px; border-radius:40px;
  border:1.5px solid rgba(48,24,27,.18); background:transparent; color:var(--ink60); cursor:pointer; transition:.18s; }
.tab:hover{ border-color:var(--wine); color:var(--wine); }
.tab.active{ background:var(--wine); border-color:var(--wine); color:var(--blush); font-weight:500; }
.tool{ display:none; margin-top:30px; }
.tool.active{ display:block; }
.toolcard{ background:#fff; border:1px solid rgba(48,24,27,.13); border-radius:26px; padding:40px 38px; box-shadow:0 18px 50px rgba(48,24,27,.06); }
@media(max-width:600px){ .toolcard{ padding:26px 22px; } }
.tool-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:44px; align-items:start; }
@media(max-width:820px){ .tool-grid{ grid-template-columns:1fr; gap:30px; } }
.toolcard h2{ font-size:28px; margin-bottom:8px; }
.toolcard .sub{ font-size:15px; color:var(--ink60); margin-bottom:28px; max-width:52ch; }

.out{ background:var(--wine); color:var(--blush); border-radius:20px; padding:30px 32px; }
.out .lbl{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:500; opacity:.8; }
.out .big{ font-family:'Syne'; font-weight:800; font-size:46px; line-height:1.05; display:block; margin:8px 0 2px; color:var(--blush); }
.out .small{ font-size:14px; color:#D9C6C8; }
.out.light{ background:var(--blush); color:var(--wine); }
.out.light .big{ color:var(--wine); }
.out.light .small{ color:#6e5658; }
.out + .out{ margin-top:16px; }
.outrow{ display:flex; justify-content:space-between; gap:18px; padding:11px 0; border-bottom:1px solid rgba(246,219,221,.2); font-size:14.5px; }
.outrow:last-child{ border-bottom:none; }
.outrow b{ font-family:'Syne'; font-weight:700; color:var(--blush); }
.out.light .outrow{ border-color:rgba(48,24,27,.14); }
.out.light .outrow b{ color:var(--wine); }

.utm-out{ background:var(--ink); color:var(--cream); border-radius:16px; padding:20px 22px; font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:13.5px; line-height:1.6; word-break:break-all; margin-top:8px; }
.copybtn{ margin-top:14px; font-family:'DM Sans'; font-weight:500; font-size:13.5px; padding:11px 22px; border-radius:40px;
  border:1.5px solid var(--ink); background:transparent; color:var(--ink); cursor:pointer; transition:.2s; }
.copybtn:hover{ background:var(--ink); color:var(--cream); }

.check-list{ list-style:none; }
.check-list li{ display:flex; gap:14px; align-items:flex-start; padding:15px 0; border-bottom:1px solid rgba(48,24,27,.1); }
.check-list input{ margin-top:5px; width:19px; height:19px; accent-color:#30181B; flex:none; cursor:pointer; }
.check-list label{ font-size:15px; cursor:pointer; }
.check-list .d{ display:block; font-size:13.5px; color:var(--ink60); margin-top:3px; }
.check-list li.done label{ opacity:.45; text-decoration:line-through; }
.progress{ height:8px; background:rgba(48,24,27,.1); border-radius:10px; overflow:hidden; margin:10px 0 4px; }
.progress i{ display:block; height:100%; background:var(--wine); width:0; transition:.3s; }

/* kleine kaartjes kennishub */
.hub-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:52px; }
@media(max-width:820px){ .hub-cards{ grid-template-columns:1fr; } }

/* CTA-blok onderaan subpagina's */
.cta .btn-light{ margin:0 4px; }
.cta-sub{ background:var(--wine); }
.cta-sub h2{ color:var(--blush); }
