
:root{
  --color-navy:#1B3A6B; --color-navy-light:#4A6FA5; --color-navy-darker:#142C52;
  --color-link:#6B8FC9; --color-violet:#7B68EE; --color-white:#FFFFFF;
  --color-surface:#F5F5F5; --color-surface-2:#ECEFF3; --color-border:#D0D5DD;
  --dot-red:#FF272B; --dot-green:#24AD39; --dot-yellow:#FFBE1C; --logo-blue:#0084FE;
  --bg:var(--color-white); --bg-alt:var(--color-surface); --bg-dark:var(--color-navy);
  --text:#555F6E; --text-strong:var(--color-navy); --text-muted:#8A93A2; --text-invert:var(--color-white);
  --border:var(--color-border); --accent:var(--color-navy);
  --navy-soft:#EAF0F9; --violet-soft:#EEEBFE; --success:#24AD39;
  --font-display:'Thicccboi','Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-body:'Nunito',system-ui,-apple-system,'Segoe UI',sans-serif;
  --fs-display:clamp(2.5rem,1.6rem + 3.6vw,3.5rem);
  --fs-h1:clamp(2rem,1.5rem + 2vw,2.75rem);
  --fs-h2:clamp(1.6rem,1.25rem + 1.4vw,2.5rem);
  --fs-h3:clamp(1.35rem,1.2rem + 0.5vw,1.75rem);
  --fs-h4:1.375rem; --fs-lead:1.25rem; --fs-base:1rem; --fs-sm:.875rem; --fs-xs:.8125rem;
  --lh-tight:1.1; --lh-heading:1.2; --lh-snug:1.4; --lh-body:1.6;
  --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700; --fw-extra:800;
  --ls-tight:-0.02em; --ls-normal:0; --ls-wide:0.12em;
  --space-1:.25rem; --space-2:.5rem; --space-3:1rem; --space-4:1.5rem;
  --space-5:3rem; --space-6:5rem; --space-7:7.5rem;
  --section-py:clamp(4rem,2.5rem + 5vw,7.5rem);
  --container-max:1160px; --container-narrow:760px; --container-pad:clamp(1.25rem,.5rem + 3vw,2.5rem);
  --radius-nav:6px; --radius-btn:8px; --radius-card:12px; --radius-pill:999px;
  --shadow-sm:0 1px 2px rgba(27,58,107,.06); --shadow-card:0 8px 24px rgba(27,58,107,.08);
  --shadow-lg:0 16px 40px rgba(27,58,107,.12); --shadow-btn:0 4px 12px rgba(27,58,107,.18);
  --ease:cubic-bezier(0.22,1,0.36,1); --dur-fast:140ms; --dur:220ms; --dur-slow:380ms;
}
*,*::before,*::after{box-sizing:border-box;}
*{margin:0;}
html{font-size:100%!important;-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{font-family:var(--font-body);font-size:var(--fs-base);line-height:var(--lh-body);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;}
html,.page-root{overflow-x:clip;}
img,svg,video{display:block;max-width:100%;height:auto;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;padding:0;}
h1,h2,h3,h4{font-family:var(--font-display);line-height:var(--lh-heading);color:var(--text-strong);text-wrap:balance;}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important;}}
.container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--container-pad);}
.container--narrow{max-width:var(--container-narrow);}
.section{padding-block:var(--section-py);}
.section--alt{background:var(--bg-alt);}
.section--dark{background:var(--bg-dark);color:var(--text-invert);}
.section--dark h1,.section--dark h2,.section--dark h3,.section--dark h4{color:var(--text-invert);}
.eyebrow{display:inline-block;font-family:var(--font-display);font-size:var(--fs-xs);font-weight:var(--fw-bold);letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--color-navy-light);}
.section--dark .eyebrow{color:#9DB6DC;}
.lead{font-size:var(--fs-lead);line-height:var(--lh-snug);font-weight:var(--fw-regular);}
.center{text-align:center;}
.section-head{display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-5);max-width:56ch;}
.section-head--center{align-items:center;text-align:center;margin-inline:auto;}
.section-head__title{font-size:var(--fs-h2);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight);}
.dots{display:inline-flex;gap:8px;}
.dots span{width:11px;height:11px;border-radius:var(--radius-pill);display:block;}
.dots span:nth-child(1){background:var(--dot-red);}
.dots span:nth-child(2){background:var(--dot-green);}
.dots span:nth-child(3){background:var(--dot-yellow);}
.dots span{animation:tws-dot-hop 1.3s cubic-bezier(.34,1.56,.64,1) infinite;}
.dots span:nth-child(2){animation-delay:.15s;}
.dots span:nth-child(3){animation-delay:.3s;}
@keyframes tws-dot-hop{0%,60%,100%{transform:translateY(0);}30%{transform:translateY(-7px);}}
@media (prefers-reduced-motion:reduce){.dots span{animation:none;}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);font-family:var(--font-display);font-weight:var(--fw-semibold);font-size:var(--fs-base);line-height:1;letter-spacing:var(--ls-normal);padding:.875rem var(--space-4);border-radius:var(--radius-btn);border:1px solid transparent;cursor:pointer;transition:background var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease);}
.btn--primary{background:var(--color-navy);color:var(--text-invert);}
.btn--primary:hover{background:var(--color-navy-light);box-shadow:var(--shadow-btn);transform:translateY(-2px);}
.btn--primary:active{background:var(--color-navy-darker);box-shadow:none;transform:translateY(0);}
.btn--ghost{background:transparent;border-color:var(--border);color:var(--color-navy);}
.btn--ghost:hover{border-color:var(--color-navy);background:var(--navy-soft);}
.btn--ghost:active{background:var(--color-surface-2);}
.btn--on-dark{background:var(--color-white);color:var(--color-navy);}
.btn--on-dark:hover{background:var(--navy-soft);box-shadow:var(--shadow-btn);transform:translateY(-2px);}
.btn--on-dark:active{transform:translateY(0);box-shadow:none;}
.btn--ghost-dark{background:transparent;border-color:rgba(255,255,255,.4);color:var(--color-white);}
.btn--ghost-dark:hover{border-color:#fff;background:rgba(255,255,255,.08);}
.btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--navy-soft);}
.section--dark .btn:focus-visible{box-shadow:0 0 0 3px rgba(255,255,255,.45);}
.link{color:var(--color-navy);font-weight:var(--fw-semibold);}
.link:hover{color:var(--color-navy-light);text-decoration:underline;}
.hero{padding-block:clamp(3.5rem,2rem + 6vw,6rem);}
.hero__body{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-4);}
.hero__title{font-size:var(--fs-display);font-weight:var(--fw-extra);letter-spacing:var(--ls-tight);line-height:var(--lh-tight);color:var(--text-strong);}
.hero__lead{max-width:34ch;}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-2);}
.hero--center{text-align:center;}
.hero--center .hero__body{align-items:center;max-width:760px;margin-inline:auto;}
.hero--center .hero__lead{max-width:60ch;}
.hero--center .hero__actions{justify-content:center;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4);}
.card__text{font-size:var(--fs-base);color:var(--text);}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4);counter-reset:step;}
.step{display:flex;flex-direction:column;gap:var(--space-2);}
.step__num{font-family:var(--font-display);font-weight:var(--fw-extra);font-size:1.5rem;width:48px;height:48px;border-radius:var(--radius-pill);background:var(--navy-soft);color:var(--color-navy);display:inline-flex;align-items:center;justify-content:center;}
.step__title{font-size:var(--fs-h4);font-weight:var(--fw-semibold);color:var(--color-navy);}
.step__text{font-size:var(--fs-sm);color:var(--text);}
.cta__inner{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-4);}
.cta__title{font-size:var(--fs-h1);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight);max-width:20ch;}
.cta__lead{color:#C6D2E6;max-width:50ch;}
.cta__actions{display:flex;flex-wrap:wrap;gap:var(--space-3);justify-content:center;margin-top:var(--space-2);}
[data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
[data-reveal].in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){[data-reveal]{opacity:1;transform:none;}}
.svc{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,1rem + 4vw,4.5rem);align-items:center;}
.svc + .svc{margin-top:var(--space-6);}
.svc__body{display:flex;flex-direction:column;gap:var(--space-3);align-items:flex-start;}
.svc__title{font-size:var(--fs-h2);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight);}
.svc--rev .svc__media{order:2;}
@media (max-width:991px){.svc{grid-template-columns:1fr;gap:var(--space-4);}.svc--rev .svc__media,.svc__media{order:-1;}}
.dienst-list{display:flex;flex-direction:column;gap:var(--space-3);width:100%;margin-top:var(--space-2);}
.dienst{padding-top:var(--space-3);border-top:1px solid var(--border);}
.dienst:first-child{border-top:0;padding-top:0;}
.dienst__name{display:flex;align-items:center;gap:.55rem;font-family:var(--font-display);font-size:1.1rem;font-weight:var(--fw-semibold);color:var(--color-navy);margin-bottom:5px;}
.dienst__name svg{width:18px;height:18px;flex:0 0 auto;color:var(--color-navy-light);}
.dienst p{font-size:var(--fs-base);color:var(--text);}
.dienst .link{margin-top:7px;display:inline-flex;align-items:center;gap:5px;font-size:var(--fs-sm);}
.dienst .link svg{width:15px;height:15px;}
.svc__media{opacity:0;transform:translateX(64px);transition:opacity .7s var(--ease),transform .8s var(--ease);transition-delay:.22s;will-change:transform,opacity;}
.svc__media.media-in{opacity:1;transform:none;}
.svc__img{display:block;width:100%;height:auto;aspect-ratio:1024 / 776;border-radius:var(--radius-card);box-shadow:var(--shadow-card);background:var(--navy-soft);border:1px solid var(--border);object-fit:cover;}
@media (prefers-reduced-motion:reduce){.svc__media{opacity:1;transform:none;transition:none;}}
.aud-card{display:flex;flex-direction:column;gap:14px;background:none;border:0;box-shadow:none;padding:0;}
.aud-card__icon{position:relative;display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:var(--radius-btn);background:rgba(255,39,43,.09);color:#D81419;transition:transform .25s cubic-bezier(.34,1.56,.64,1);}
.aud-card__icon svg{width:24px;height:24px;}
.aud-card__flag{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;background:#FF272B;color:#fff;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 0 0 3px var(--bg-alt,#F5F5F5);}
.aud-card__flag svg{width:11px;height:11px;}
.aud-card h3{font-family:var(--font-display);font-size:var(--fs-h4);font-weight:var(--fw-semibold);color:var(--color-navy);}
.aud-grid[data-reveal]{opacity:1;transform:none;}
.aud-grid .aud-card{opacity:0;transform:translateY(22px) scale(.98);}
.aud-grid.in .aud-card{animation:audIn .6s cubic-bezier(.22,1,.36,1) both;}
.aud-grid.in .aud-card:nth-child(1){animation-delay:.04s;}
.aud-grid.in .aud-card:nth-child(2){animation-delay:.12s;}
.aud-grid.in .aud-card:nth-child(3){animation-delay:.20s;}
.aud-grid.in .aud-card:nth-child(4){animation-delay:.28s;}
.aud-grid.in .aud-card:nth-child(5){animation-delay:.36s;}
.aud-grid.in .aud-card:nth-child(6){animation-delay:.44s;}
@keyframes audIn{to{opacity:1;transform:none;}}
.aud-grid .aud-card__flag{opacity:0;transform:scale(0);}
.aud-grid.in .aud-card__flag{animation:flagPop .5s cubic-bezier(.34,1.56,.64,1) both;}
.aud-grid.in .aud-card:nth-child(1) .aud-card__flag{animation-delay:.30s;}
.aud-grid.in .aud-card:nth-child(2) .aud-card__flag{animation-delay:.38s;}
.aud-grid.in .aud-card:nth-child(3) .aud-card__flag{animation-delay:.46s;}
.aud-grid.in .aud-card:nth-child(4) .aud-card__flag{animation-delay:.54s;}
.aud-grid.in .aud-card:nth-child(5) .aud-card__flag{animation-delay:.62s;}
.aud-grid.in .aud-card:nth-child(6) .aud-card__flag{animation-delay:.70s;}
@keyframes flagPop{0%{opacity:0;transform:scale(0) rotate(-35deg);}60%{opacity:1;transform:scale(1.18) rotate(9deg);}100%{opacity:1;transform:scale(1) rotate(0);}}
.aud-card:hover .aud-card__icon{transform:translateY(-3px);}
.aud-card:hover .aud-card__flag{animation:flagShake .45s ease;}
@keyframes flagShake{0%,100%{transform:rotate(0);}25%{transform:rotate(-12deg);}55%{transform:rotate(10deg);}80%{transform:rotate(-5deg);}}
@media (prefers-reduced-motion:reduce){.aud-grid .aud-card,.aud-grid .aud-card__flag{opacity:1;transform:none;animation:none;}}
.teaser{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(2rem,1rem + 4vw,4rem);align-items:center;background:var(--navy-soft);border:1px solid var(--border);border-radius:var(--radius-card);padding:clamp(1.75rem,1rem + 3vw,3.5rem);}
.teaser__price{font-family:var(--font-display);font-weight:var(--fw-extra);font-size:clamp(2.4rem,1.8rem + 2.4vw,3.4rem);line-height:1;letter-spacing:var(--ls-tight);color:var(--color-navy);white-space:nowrap;}
.teaser__price small{display:block;font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--text-muted);letter-spacing:0;margin-bottom:6px;}
.teaser__actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-2);}
@media (max-width:767px){.teaser{grid-template-columns:1fr;gap:var(--space-4);}}
.teaser__price .ch{display:inline-block;opacity:0;transform:translateY(.32em);white-space:pre;}
.teaser.in .teaser__price .ch{animation:chIn .4s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(.35s + var(--i) * .055s);}
@keyframes chIn{to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){.teaser__price .ch{opacity:1;transform:none;animation:none;}}
@media (max-width:991px){.grid-3{grid-template-columns:repeat(2,1fr);}.steps{grid-template-columns:repeat(2,1fr);}}
@media (max-width:767px){.grid-3{grid-template-columns:1fr;}.steps{grid-template-columns:1fr;}.cta__title{font-size:var(--fs-h2);}}
@media (max-width:478px){.hero__actions,.cta__actions{width:100%;}.hero__actions .btn,.cta__actions .btn{flex:1 1 auto;}}

/* image slots: navy-soft placeholder box on the wrapper so empty slots look intentional; uploaded photo fills it */
.svc__media{aspect-ratio:1024 / 776;border-radius:var(--radius-card);box-shadow:var(--shadow-card);background:var(--navy-soft);border:1px solid var(--border);overflow:hidden;}
.svc__img{aspect-ratio:auto;width:100%;height:100%;border:0;box-shadow:none;border-radius:0;background:transparent;object-fit:cover;}

/* Bricks .brxe-text-basic forces --font-body on every converted text element (incl. headings); restore the display font on headings + display-classed elements */
h1.brxe-text-basic,h2.brxe-text-basic,h3.brxe-text-basic,h4.brxe-text-basic,.eyebrow.brxe-text-basic,.svc__title.brxe-text-basic,.section-head__title.brxe-text-basic,.cta__title.brxe-text-basic,.dienst__name.brxe-text-basic,.step__num.brxe-text-basic,.teaser__price.brxe-text-basic,.btn.brxe-text-basic{font-family:var(--font-display);}

/* Bricks builder (iframe): force scroll-reveal hidden states visible so content is editable; frontend reveal unchanged */
html.tws-builder [data-reveal],html.tws-builder .svc__media,html.tws-builder .aud-grid .aud-card,html.tws-builder .aud-grid .aud-card__flag,html.tws-builder .teaser__price .ch{opacity:1!important;transform:none!important;animation:none!important;}

/* mobile (<=767): center the audience cards + approach steps (icon/number + text) */
@media (max-width:767px){.aud-card{align-items:center;text-align:center;}.step{align-items:center;text-align:center;}}

/* TEASER PRICE FIX — Thicccboi op de losse letters + animatie pas bij echt in beeld */
.teaser__price .ch{font-family:var(--font-display)!important;}
.teaser.price-wait .teaser__price .ch{animation:none!important;opacity:0!important;}
