:root{
  --lp-color-bg:#FBFBFD; --lp-color-surface:#FFFFFF; --lp-color-bg-section:#F4F5F8;
  --lp-color-text:#0E1116; --lp-color-text-muted:#5A6472; --lp-color-border:#E7E9EE;
  --lp-color-primary:#5B3DF5; --lp-color-primary-dark:#4A2EE0; --lp-color-accent-soft:#EEEBFF;
  --lp-color-proof:#0E1116; --lp-color-proof-2:#171B22; --lp-color-on-proof:#C7CEDA;
  --lp-font-display:"Inter Tight",system-ui,sans-serif;
  --lp-font-body:"Inter",system-ui,sans-serif;
  --lp-font-mono:"JetBrains Mono",ui-monospace,monospace;
  --lp-text-sm:1.4rem; --lp-text-base:1.6rem; --lp-text-lg:1.8rem; --lp-text-xl:2rem;
  --lp-text-h2:clamp(2.8rem,4vw,4rem);
  --lp-text-hero:clamp(3.6rem,6.5vw,7rem);
  --lp-container:1180px; --lp-pad:clamp(1.6rem,4vw,2.4rem);
  --lp-radius:14px; --lp-radius-lg:22px;
  --ease:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{font-size:62.5%;scroll-behavior:smooth}
body{font-family:var(--lp-font-body);font-size:1.7rem;line-height:1.6;color:var(--lp-color-text);background:var(--lp-color-bg);-webkit-font-smoothing:antialiased;
  background-image:radial-gradient(var(--lp-color-border) .8px,transparent .8px);background-size:26px 26px;background-position:-13px -13px}
h1,h2,h3{font-family:var(--lp-font-display);font-weight:700;line-height:1.04;letter-spacing:-0.03em}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--lp-container);margin:0 auto;padding:0 var(--lp-pad)}
.section{padding:8rem 0;position:relative}
.rule{border-top:1px solid var(--lp-color-border)}
.eyebrow{font-family:var(--lp-font-mono);font-size:1.3rem;font-weight:500;letter-spacing:.04em;color:var(--lp-color-primary)}
.eyebrow::before{content:"// "}
.h2{font-size:var(--lp-text-h2);text-wrap:balance;margin:1.2rem 0 1.2rem}
.lead{font-size:var(--lp-text-xl);color:var(--lp-color-text-muted);max-width:54ch}
:where(a,button,input):focus-visible{outline:2.5px solid var(--lp-color-primary);outline-offset:3px;border-radius:6px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.7rem;font-family:var(--lp-font-display);font-weight:600;font-size:1.6rem;padding:1.2rem 2rem;border-radius:100px;border:1.5px solid transparent;transition:transform .18s var(--ease),background .18s,border-color .18s,box-shadow .18s}
.btn--primary{background:var(--lp-color-primary);color:#fff;box-shadow:0 6px 20px -6px rgba(91,61,245,.5)}
.btn--primary:hover{background:var(--lp-color-primary-dark);transform:translateY(-2px)}
.btn--ghost{background:var(--lp-color-surface);color:var(--lp-color-text);border-color:var(--lp-color-border)}
.btn--ghost:hover{border-color:var(--lp-color-text)}

/* NAV */
.nav{position:sticky;top:0;z-index:50;backdrop-filter:blur(10px);background:rgba(251,251,253,.8);border-bottom:1px solid transparent;transition:border-color .25s}
.nav.scrolled{border-color:var(--lp-color-border)}
.nav__in{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:1.3rem var(--lp-pad)}
.brand{display:flex;align-items:center;gap:.7rem;font-family:var(--lp-font-display);font-weight:800;font-size:2rem;letter-spacing:-0.02em}
.brand__m{width:3rem;height:3rem;border-radius:9px;background:var(--lp-color-primary);display:grid;place-items:center;color:#fff}
.brand__m svg{width:1.8rem;height:1.8rem}
.nav__links{display:flex;gap:2.4rem;font-weight:500;font-size:1.5rem;color:var(--lp-color-text-muted)}
.nav__links a:hover{color:var(--lp-color-text)}
.nav__act{display:flex;align-items:center;gap:1.2rem}
.nav .btn{padding:.9rem 1.6rem;font-size:1.5rem}
@media(max-width:820px){.nav__links{display:none}}

/* HERO + proof object */
.hero{padding:7rem 0 5rem;text-align:center}
.hero h1{font-size:var(--lp-text-hero);text-wrap:balance;margin:1.6rem auto 0;max-width:16ch}
.hero h1 .accent{color:var(--lp-color-primary)}
.hero p{font-size:var(--lp-text-xl);color:var(--lp-color-text-muted);max-width:50ch;margin:2rem auto 0}
.hero__cta{display:flex;gap:1rem;justify-content:center;margin-top:2.8rem;flex-wrap:wrap}
.hero__note{font-family:var(--lp-font-mono);font-size:1.25rem;color:var(--lp-color-text-muted);margin-top:1.4rem}

/* PROOF OBJECT — realistisch app-window in CSS */
.proof{margin-top:5rem;border-radius:var(--lp-radius-lg);background:var(--lp-color-proof);box-shadow:0 40px 80px -30px rgba(14,17,22,.45),0 0 0 1px rgba(14,17,22,.05);overflow:hidden}
.proof__bar{display:flex;align-items:center;gap:1rem;padding:1.2rem 1.6rem;background:var(--lp-color-proof-2);border-bottom:1px solid rgba(255,255,255,.06)}
.proof__dots{display:flex;gap:.6rem}.proof__dots i{width:1.1rem;height:1.1rem;border-radius:50%;background:#39414d;display:block}
.proof__url{font-family:var(--lp-font-mono);font-size:1.25rem;color:#8a93a3;background:#0e1116;border:1px solid rgba(255,255,255,.06);border-radius:8px;padding:.5rem 1.2rem;margin:0 auto}
.proof__body{display:grid;grid-template-columns:200px 1fr;min-height:42rem;color:var(--lp-color-on-proof)}
.proof__side{border-right:1px solid rgba(255,255,255,.06);padding:1.8rem 1.4rem;display:flex;flex-direction:column;gap:.4rem;font-size:1.4rem}
.proof__side .lab{font-family:var(--lp-font-mono);font-size:1.1rem;color:#5d6675;text-transform:uppercase;letter-spacing:.1em;margin:1.4rem 0 .6rem}
.proof__nav{display:flex;align-items:center;gap:.8rem;padding:.7rem .9rem;border-radius:8px;color:#9aa3b2}
.proof__nav.is-active{background:rgba(91,61,245,.18);color:#fff}
.proof__nav i{width:1.6rem;height:1.6rem;border-radius:5px;background:currentColor;opacity:.5;display:block}
.proof__main{padding:2rem}
.proof__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.8rem}
.proof__head h4{font-family:var(--lp-font-display);font-weight:600;font-size:1.9rem;color:#fff;letter-spacing:-0.01em}
.proof__pill{font-family:var(--lp-font-mono);font-size:1.15rem;color:#8a93a3;border:1px solid rgba(255,255,255,.1);border-radius:100px;padding:.4rem 1rem}
.proof__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-bottom:1.8rem}
.pstat{background:var(--lp-color-proof-2);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:1.4rem}
.pstat .k{font-family:var(--lp-font-mono);font-size:1.1rem;color:#6b7484;text-transform:uppercase;letter-spacing:.08em}
.pstat .v{font-family:var(--lp-font-display);font-weight:700;font-size:2.6rem;color:#fff;margin-top:.4rem;letter-spacing:-0.02em}
.pstat .d{font-size:1.25rem;color:#56d29a;margin-top:.2rem}
.chart{background:var(--lp-color-proof-2);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:1.6rem;height:18rem;display:flex;align-items:flex-end;gap:.9rem}
.chart .bar{flex:1;border-radius:6px 6px 0 0;background:linear-gradient(180deg,var(--lp-color-primary),#3a23c0)}
@media(max-width:720px){.proof__body{grid-template-columns:1fr}.proof__side{display:none}.proof__stats{grid-template-columns:1fr}}

/* LOGO STRIP */
.logos{padding:3.5rem 0}
.logos p{text-align:center;font-family:var(--lp-font-mono);font-size:1.3rem;color:var(--lp-color-text-muted);margin-bottom:1.8rem}
.logos__row{display:flex;flex-wrap:wrap;justify-content:center;gap:2rem 4rem;align-items:center;opacity:.65}
.logos__row span{font-family:var(--lp-font-display);font-weight:700;font-size:2rem;letter-spacing:-0.02em}

/* FEATURE BENTO */
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-top:3.4rem}
.card{background:var(--lp-color-surface);border:1px solid var(--lp-color-border);border-radius:var(--lp-radius-lg);padding:2.4rem;transition:box-shadow .25s,transform .2s var(--ease)}
.card:hover{box-shadow:0 18px 40px -22px rgba(14,17,22,.25);transform:translateY(-3px)}
.card--wide{grid-column:span 2}
.card__ic{width:4.4rem;height:4.4rem;border-radius:12px;background:var(--lp-color-accent-soft);color:var(--lp-color-primary);display:grid;place-items:center;margin-bottom:1.4rem}
.card__ic svg{width:2.4rem;height:2.4rem}
.card h3{font-size:2.1rem;margin-bottom:.5rem}
.card p{color:var(--lp-color-text-muted);font-size:1.55rem}
.mini{margin-top:1.8rem;border:1px solid var(--lp-color-border);border-radius:12px;overflow:hidden;background:var(--lp-color-bg-section)}
.mini__bar{display:flex;gap:.5rem;padding:.9rem 1.2rem;border-bottom:1px solid var(--lp-color-border)}
.mini__bar i{width:.9rem;height:.9rem;border-radius:50%;background:var(--lp-color-border)}
.mini__rows{padding:1.2rem;display:flex;flex-direction:column;gap:.7rem}
.mini__rows .r{height:1rem;border-radius:5px;background:var(--lp-color-border)}
.mini__rows .r.a{width:80%;background:var(--lp-color-primary);opacity:.25}
.mini__rows .r.b{width:60%}.mini__rows .r.c{width:90%}
@media(max-width:820px){.bento{grid-template-columns:1fr}.card--wide{grid-column:span 1}}

/* STEPS */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:3.4rem;border-top:1px solid var(--lp-color-border)}
.step{padding:2.6rem 2rem;border-bottom:1px solid var(--lp-color-border)}
.step+.step{border-left:1px solid var(--lp-color-border)}
.step .n{font-family:var(--lp-font-mono);font-size:1.3rem;color:var(--lp-color-primary)}
.step h3{font-size:2rem;margin:.8rem 0 .4rem}
.step p{color:var(--lp-color-text-muted);font-size:1.55rem}
@media(max-width:760px){.steps{grid-template-columns:1fr}.step+.step{border-left:0}}

/* TESTIMONIAL */
.quote{text-align:center;max-width:60rem;margin:0 auto}
.quote blockquote{font-family:var(--lp-font-display);font-weight:600;font-size:clamp(2.2rem,3.2vw,3.2rem);line-height:1.25;letter-spacing:-0.02em;text-wrap:balance}
.quote figcaption{margin-top:2rem;font-family:var(--lp-font-mono);font-size:1.35rem;color:var(--lp-color-text-muted)}

/* CTA */
.cta{background:var(--lp-color-proof);color:#fff;border-radius:24px;padding:clamp(3.5rem,6vw,6rem);text-align:center;position:relative;overflow:hidden}
.cta::after{content:"";position:absolute;inset:0;background:radial-gradient(40rem 20rem at 70% -20%,rgba(91,61,245,.5),transparent 60%);pointer-events:none}
.cta h2{font-size:var(--lp-text-h2);position:relative;text-wrap:balance}
.cta p{color:#aab2c0;font-size:var(--lp-text-xl);max-width:46ch;margin:1.2rem auto 2.4rem;position:relative}
.cta .btn--ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.2)}

/* FOOTER */
.footer{padding:5rem 0 3rem;border-top:1px solid var(--lp-color-border)}
.footer__grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2.4rem}
.footer h4{font-family:var(--lp-font-mono);font-size:1.25rem;text-transform:uppercase;letter-spacing:.08em;color:var(--lp-color-text-muted);margin-bottom:1rem}
.footer li{list-style:none;font-size:1.5rem;line-height:2;color:var(--lp-color-text-muted)}
.footer a:hover{color:var(--lp-color-text)}
.footer__bottom{margin-top:3rem;padding-top:1.6rem;border-top:1px solid var(--lp-color-border);font-family:var(--lp-font-mono);font-size:1.25rem;color:var(--lp-color-text-muted);display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem}
@media(max-width:760px){.footer__grid{grid-template-columns:1fr 1fr}}

.reveal{opacity:0;transform:translateY(22px)}
@media(prefers-reduced-motion:no-preference){.reveal{transition:opacity .6s var(--ease),transform .6s var(--ease)}.reveal.in{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}*{scroll-behavior:auto}}

/* --- ALASTIC WordPress integratie-fixes --- */
body { background-color: var(--night, #ffffff) !important; }
h1, h2, h3, h4, h5, h6 { text-transform: none !important; }
.wp-site-blocks, .is-root-container, .entry-content,
.wp-block-post-content { max-width: none !important; padding: 0 !important; margin: 0 !important; }
