/* Kopletter voor de laag van september 2026 (onderaan dit bestand). @import moet bovenaan staan. */
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,500;0,600;1,500&display=swap');
/* ===========================================================
   Grafzorg.be — herbouwde statische site (Cloudflare Pages)
   =========================================================== */
:root{
  --primary:#6a91cb;        /* knoppen / accent */
  --primary-dark:#567bb5;   /* hover */
  --primary-light:#8aa9d8;
  --green:#5aa469;          /* logo groen / accenten */
  --green-dark:#4c9159;
  --heading:#1f2937;        /* donkere koppen */
  --text:#4b5563;           /* body tekst */
  --muted:#6b7280;
  --bg:#ffffff;
  --bg-alt:#f4f7fb;         /* lichte sectie */
  --bg-soft:#eef2f8;
  --border:#e5e7eb;
  --footer-bg:#1f2a37;
  --footer-text:#c7d0da;
  --radius:8px;
  --radius-lg:16px;
  --shadow:0 4px 14px rgba(31,41,55,.08);
  --shadow-lg:0 12px 30px rgba(31,41,55,.12);
  --maxw:1180px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Roboto',-apple-system,Segoe UI,sans-serif;
  color:var(--text);
  line-height:1.65;
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:var(--primary);text-decoration:none;transition:.2s}
a:hover{color:var(--primary-dark)}
h1,h2,h3,h4,h5{color:var(--heading);font-weight:700;line-height:1.2}
.accent{color:var(--primary)}
.accent-green{color:var(--green)}
section{padding:80px 0}
.container{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.text-center{text-align:center}
.eyebrow{display:inline-block;background:rgba(106,145,203,.12);color:var(--primary-dark);
  font-weight:600;font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;
  padding:6px 16px;border-radius:999px;margin-bottom:18px}
.eyebrow.green{background:rgba(90,164,105,.14);color:var(--green-dark)}
.section-head{max-width:720px;margin:0 auto 54px}
.section-head h2{font-size:2.3rem;margin-bottom:16px}
.section-head p{font-size:1.08rem;color:var(--muted)}
.lead{font-size:1.15rem;color:var(--muted)}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;justify-content:center;
  padding:14px 28px;border-radius:var(--radius);font-weight:600;font-size:1rem;
  cursor:pointer;border:2px solid transparent;transition:.2s;line-height:1}
.btn-primary{background:var(--primary);color:#fff}
.btn-primary:hover{background:var(--primary-dark);color:#fff;transform:translateY(-2px)}
.btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.7)}
.btn-outline:hover{background:#fff;color:var(--heading)}
.btn-outline-dark{background:transparent;color:var(--primary);border-color:var(--primary)}
.btn-outline-dark:hover{background:var(--primary);color:#fff}
.btn-green{background:var(--green);color:#fff}
.btn-green:hover{background:var(--green-dark);color:#fff}
.btn-lg{padding:16px 34px;font-size:1.05rem}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:100;background:#fff;
  box-shadow:0 1px 0 rgba(31,41,55,.06)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 24px;
  max-width:var(--maxw);margin:0 auto}
.nav__logo img{height:56px;width:auto}
.nav__links{display:flex;align-items:center;gap:20px;list-style:none}
.nav__links li{flex:0 0 auto}
.nav__links a{color:var(--heading);font-weight:500;font-size:.98rem;white-space:nowrap}
.nav__right{flex:0 0 auto}
.nav__links a:hover,.nav__links a.active{color:var(--primary)}
.nav__right{display:flex;align-items:center;gap:16px}
.lang-switch{display:flex;align-items:center;gap:6px;border:1px solid var(--border);
  border-radius:var(--radius);padding:6px 10px;font-size:.85rem;color:var(--heading);
  background:#fff;cursor:pointer}
.lang-switch img{height:18px;width:18px;border-radius:50%}
.nav__cta{background:var(--primary);color:#fff;padding:12px 20px;border-radius:var(--radius);
  font-weight:600;font-size:.92rem;line-height:1.2;text-align:center;white-space:nowrap}
.nav__cta:hover{background:var(--primary-dark);color:#fff}
.nav__toggle{display:none;background:none;border:none;font-size:1.5rem;color:var(--heading);cursor:pointer}

/* ---------- Hero ---------- */
.hero{position:relative;color:#fff;text-align:center;padding:120px 0 130px;
  background:#2a3542;overflow:hidden}
.hero__bg{position:absolute;inset:0;object-fit:cover;width:100%;height:100%;z-index:0}
.hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(23,32,42,.55),rgba(23,32,42,.72));z-index:1}
.hero .container{position:relative;z-index:2}
.hero h1{color:#fff;font-size:3.6rem;margin-bottom:20px}
.hero h1 .accent{color:var(--primary-light)}
.hero p{font-size:1.22rem;max-width:720px;margin:0 auto 34px;color:#e7ecf3}
.hero__actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-bottom:34px}
.hero__badges{display:flex;gap:30px;justify-content:center;flex-wrap:wrap;font-weight:500}
.hero__badges span{display:inline-flex;align-items:center;gap:8px;color:#eaf0f7}
.hero__badges i{color:var(--primary-light)}
.hero--sub{padding:96px 0}
.hero--sub h1{font-size:3rem}

/* ---------- Cards / grid ---------- */
.grid{display:grid;gap:28px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);
  overflow:hidden;box-shadow:var(--shadow);transition:.25s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.card__img{height:210px;width:100%;object-fit:cover}
.card__body{padding:26px}
.card__body h3{font-size:1.3rem;margin-bottom:12px}
.card__body p{margin-bottom:16px}
.card ul{list-style:none;margin-bottom:16px}
.card ul li{position:relative;padding-left:26px;margin-bottom:8px;color:var(--text)}
.card ul li::before{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;
  color:var(--green);position:absolute;left:0;top:2px;font-size:.85rem}
.badge-pop{position:absolute;top:14px;left:14px;background:var(--green);color:#fff;
  font-size:.75rem;font-weight:600;padding:5px 12px;border-radius:999px;z-index:2}
.card--rel{position:relative}

/* icon feature */
.feature{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:30px;box-shadow:var(--shadow);transition:.25s}
.feature:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.feature__icon{width:60px;height:60px;border-radius:14px;display:flex;align-items:center;
  justify-content:center;background:rgba(106,145,203,.12);color:var(--primary);
  font-size:1.5rem;margin-bottom:18px}
.feature.green .feature__icon{background:rgba(90,164,105,.14);color:var(--green)}
.feature h3{font-size:1.2rem;margin-bottom:10px}

.bg-alt{background:var(--bg-alt)}
.bg-soft{background:var(--bg-soft)}

/* ---------- Steps ---------- */
.steps{display:grid;gap:28px;grid-template-columns:repeat(3,1fr)}
.steps.four{grid-template-columns:repeat(4,1fr)}
.step{text-align:center;padding:10px}
.step__num{width:64px;height:64px;border-radius:50%;background:var(--primary);color:#fff;
  font-size:1.6rem;font-weight:700;display:flex;align-items:center;justify-content:center;
  margin:0 auto 18px;box-shadow:0 6px 16px rgba(106,145,203,.35)}
.step h3{font-size:1.2rem;margin-bottom:10px}
.step .step__note{display:inline-block;margin-top:10px;color:var(--primary-dark);
  font-weight:600;font-size:.9rem}

/* ---------- Pricing ---------- */
.freq-tabs{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:40px}
.freq-tab{border:1px solid var(--border);background:#fff;border-radius:999px;padding:10px 22px;
  font-weight:600;color:var(--muted);cursor:pointer;transition:.2s}
.freq-tab.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.price-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:32px 28px;box-shadow:var(--shadow);position:relative;display:flex;flex-direction:column}
.price-card.featured{border-color:var(--primary);box-shadow:var(--shadow-lg)}
.price-card h3{font-size:1.4rem;margin-bottom:6px}
.price-card .sub{color:var(--muted);font-size:.95rem;margin-bottom:18px}
.price-card .price{font-size:2.3rem;font-weight:700;color:var(--heading);margin-bottom:4px}
.price-card .price small{font-size:1rem;color:var(--muted);font-weight:400}
.price-card ul{list-style:none;margin:18px 0 24px}
.price-card ul li{position:relative;padding-left:26px;margin-bottom:10px}
.price-card ul li::before{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;
  color:var(--green);position:absolute;left:0;top:3px;font-size:.85rem}
.price-card .btn{margin-top:auto}
.price-badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);
  background:var(--green);color:#fff;font-size:.78rem;font-weight:600;padding:6px 16px;border-radius:999px}

/* ---------- Before / After ---------- */
.ba-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}
.ba{position:relative;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow)}
.ba img{height:300px;width:100%;object-fit:cover}
.ba__tag{position:absolute;top:14px;left:14px;background:rgba(31,42,55,.85);color:#fff;
  font-size:.8rem;font-weight:700;letter-spacing:.05em;padding:6px 14px;border-radius:6px}
.ba__tag.na{background:var(--green)}
.ba-block{margin-bottom:56px}
.ba-block h3{font-size:1.5rem;margin:6px 0 10px}

/* ---------- Stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.stat__num{font-size:2.8rem;font-weight:700;color:var(--primary)}
.stat__label{color:var(--muted);font-weight:500}
.stats.on-dark .stat__num{color:var(--primary-light)}
.stats.on-dark .stat__label{color:#d3dbe5}

/* ---------- Testimonials ---------- */
.quote{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:28px;box-shadow:var(--shadow)}
.quote p{font-style:italic;color:var(--text);margin-bottom:20px}
.quote__author{display:flex;align-items:center;gap:14px}
.avatar{width:48px;height:48px;border-radius:50%;background:var(--primary);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem}
.quote__author h4{font-size:1rem;margin-bottom:2px}
.quote__author span{color:var(--muted);font-size:.88rem}
.quote__meta{margin-top:14px;color:var(--primary-dark);font-size:.85rem;font-weight:600}

/* ---------- Split / image + text ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.split img{border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);height:100%;object-fit:cover;max-height:460px}
.split__badge{position:relative}
.badge-float{position:absolute;bottom:18px;left:18px;background:#fff;border-radius:var(--radius);
  padding:14px 20px;box-shadow:var(--shadow-lg);text-align:center}
.badge-float .n{font-size:1.6rem;font-weight:700;color:var(--primary)}
.badge-float .t{font-size:.82rem;color:var(--muted)}
.check-list{list-style:none;margin-top:18px}
.check-list li{position:relative;padding-left:30px;margin-bottom:12px;font-weight:500;color:var(--heading)}
.check-list li::before{content:"\f058";font-family:"Font Awesome 6 Free";font-weight:900;
  color:var(--green);position:absolute;left:0;top:2px}

/* ---------- CTA band ---------- */
.cta-band{background:linear-gradient(135deg,#2a3542,#3a4a5c);color:#fff;text-align:center}
.cta-band h2{color:#fff;font-size:2.2rem;margin-bottom:14px}
.cta-band p{color:#dbe2ea;max-width:640px;margin:0 auto 28px;font-size:1.1rem}
.cta-band .btn-outline{border-color:#fff}

/* ---------- Forms ---------- */
.form-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:34px;box-shadow:var(--shadow)}
.form-card h3{font-size:1.4rem;margin-bottom:8px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{margin-bottom:16px}
.field.full{grid-column:1/-1}
label{display:block;font-weight:500;color:var(--heading);margin-bottom:6px;font-size:.92rem}
input,select,textarea{width:100%;padding:12px 14px;border:1px solid var(--border);
  border-radius:var(--radius);font-family:inherit;font-size:.95rem;color:var(--heading);background:#fff}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(106,145,203,.15)}
textarea{min-height:120px;resize:vertical}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.check{display:flex;align-items:center;gap:8px;font-weight:400;color:var(--text)}
.check input{width:auto}
.form-note{font-size:.85rem;color:var(--muted);margin-top:10px}
.form-status{display:none;padding:14px 16px;border-radius:var(--radius);margin-top:16px;font-weight:500}
.form-status.ok{display:block;background:#e7f6ec;color:#1f7a3d;border:1px solid #b7e3c4}
.form-status.err{display:block;background:#fdecec;color:#b3261e;border:1px solid #f3c2c0}
.honeypot{position:absolute;left:-9999px}

/* ---------- Contact tiles ---------- */
.contact-tile{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:26px;text-align:center;box-shadow:var(--shadow)}
.contact-tile .feature__icon{margin:0 auto 16px}
.contact-tile .big{font-size:1.25rem;font-weight:700;color:var(--heading)}

/* ---------- FAQ ---------- */
.faq-item{background:#fff;border:1px solid var(--border);border-radius:var(--radius);
  margin-bottom:14px;overflow:hidden}
.faq-q{width:100%;text-align:left;background:none;border:none;padding:20px 24px;
  font-size:1.05rem;font-weight:600;color:var(--heading);cursor:pointer;
  display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq-q i{transition:.3s;color:var(--primary)}
.faq-item.open .faq-q i{transform:rotate(180deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease;padding:0 24px}
.faq-item.open .faq-a{max-height:900px;padding:0 24px 22px}
.faq-a p{margin-bottom:10px}
.faq-a ul{margin:0 0 10px 20px}

/* ---------- Regions (vacatures) ---------- */
.region-col h3{margin-bottom:14px;font-size:1.2rem}
.region-col ul{list-style:none}
.region-col li{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--border)}
.tag-open{color:var(--green-dark);font-weight:600;font-size:.85rem}
.tag-limited{color:#c17a19;font-weight:600;font-size:.85rem}

/* ---------- Footer ---------- */
.site-footer{background:var(--footer-bg);color:var(--footer-text);padding:64px 0 24px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;margin-bottom:40px}
.site-footer img{height:52px;margin-bottom:18px}
.site-footer p{color:var(--footer-text);font-size:.95rem;margin-bottom:12px}
.site-footer h4{color:#fff;font-size:1.05rem;margin-bottom:16px}
.site-footer ul{list-style:none}
.site-footer ul li{margin-bottom:10px}
.site-footer ul a{color:var(--footer-text);font-size:.95rem}
.site-footer ul a:hover{color:#fff}
.footer-contact div{margin-bottom:12px}
.footer-social{display:flex;gap:12px;margin-top:8px}
.footer-social a{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.1);
  display:flex;align-items:center;justify-content:center;color:#fff}
.footer-social a:hover{background:var(--primary)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:20px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font-size:.88rem}
.footer-bottom a{color:var(--footer-text);margin-left:18px}
.footer-bottom a:hover{color:#fff}

/* ---------- Utilities ---------- */
.mb-0{margin-bottom:0}
.mt-40{margin-top:40px}
.info-box{background:var(--bg-alt);border-left:4px solid var(--primary);
  border-radius:var(--radius);padding:20px 24px}
.pill-list{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:20px}
.pill-list span{background:#fff;border:1px solid var(--border);border-radius:999px;
  padding:8px 18px;font-weight:500;color:var(--heading);font-size:.92rem}

/* language switcher active */
.lang-switch a{opacity:.45;line-height:0;transition:.2s}
.lang-switch a:hover{opacity:.85}
.lang-switch a.active{opacity:1}

/* ===== DELA huisstijl (alleen /dela) ===== */
.dela-page{
  --primary:#007fa4;        /* DELA-blauw (Pantone 314) */
  --primary-dark:#00647f;
  --primary-light:#4aa9c0;
  --green:#007fa4;          /* accenten in DELA-blauw ipv groen */
  --green-dark:#007fa4;
  --heading:#134753;        /* donker teal voor koppen */
  --text:#4e738a;           /* DELA tekstkleur (Pantone 5405) */
  font-family:Verdana,Geneva,Tahoma,sans-serif;
}
.dela-page h1,.dela-page h2,.dela-page h3,.dela-page h4,.dela-page h5{
  font-family:Georgia,"Times New Roman",serif;color:var(--heading);letter-spacing:.2px}
.dela-page .eyebrow{background:rgba(0,127,164,.12);color:var(--primary-dark)}
.dela-page .hero{background:#007fa4}
.dela-page .hero::after{display:none}
.dela-page .hero h1{color:#fff}
.dela-page .hero p{color:#e4f3f8}
.dela-page .hero .accent{color:#bfe6f0}
.dela-hero-logo{height:96px;width:auto;margin:0 auto 22px;display:block}
.dela-page .price-badge,.dela-page .badge-pop{background:#007fa4}
.dela-page .step__num{box-shadow:0 6px 16px rgba(0,127,164,.35)}
.dela-page .wstep.done span{background:#007fa4}
.dela-page .btn-green{background:#007fa4}
.dela-page .btn-green:hover{background:#00647f}
.dela-page .cta-band h2{color:#fff}
.dela-page .cta-band p{color:#e4f3f8}

/* DELA wizard */
.wizard-steps{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:28px}
.wstep{display:flex;align-items:center;gap:8px;color:var(--muted);font-weight:600;font-size:.9rem;
  padding:6px 12px;border-radius:999px;border:1px solid var(--border);background:#fff}
.wstep span{width:26px;height:26px;border-radius:50%;background:var(--bg-soft);color:var(--muted);
  display:flex;align-items:center;justify-content:center;font-size:.85rem}
.wstep.active{color:var(--primary-dark);border-color:var(--primary)}
.wstep.active span{background:var(--primary);color:#fff}
.wstep.done span{background:var(--green);color:#fff}
.wnav{display:flex;justify-content:space-between;gap:12px;margin-top:24px}
.wtotal{margin:18px 0;font-size:1.1rem;font-weight:500}
.wtotal strong{color:var(--primary);font-size:1.3rem}
.grave-row{display:grid;grid-template-columns:1fr 1fr auto auto;gap:10px;align-items:center;margin-bottom:12px}
.grave-row .g-price{font-weight:700;color:var(--heading);white-space:nowrap}
.grave-row .g-del{background:none;border:1px solid var(--border);border-radius:var(--radius);
  color:#b3261e;cursor:pointer;padding:10px 12px}
.grave-row .g-del:hover{background:#fdecec}
@media(max-width:600px){.grave-row{grid-template-columns:1fr 1fr}}

/* legal pages */
.legal{max-width:860px;margin:0 auto}
.legal h1{font-size:2.6rem;margin-bottom:8px}
.legal .updated{color:var(--muted);margin-bottom:36px}
.legal h2{font-size:1.5rem;margin:34px 0 14px;padding-top:8px}
.legal h3{font-size:1.15rem;margin:20px 0 10px;color:var(--primary-dark)}
.legal ul{margin:0 0 16px 22px}
.legal li{margin-bottom:8px}
.legal p{margin-bottom:14px}

/* ---------- Responsive ---------- */
@media(max-width:960px){
  .grid-3,.grid-4,.steps,.steps.four,.stats{grid-template-columns:repeat(2,1fr)}
  .split,.footer-grid{grid-template-columns:1fr}
  .footer-grid{gap:30px}
  .hero h1{font-size:2.6rem}
  .split img{max-height:340px}
}
@media(max-width:760px){
  section{padding:56px 0}
  .nav__links{display:none;position:absolute;top:80px;left:0;right:0;background:#fff;
    flex-direction:column;padding:18px 24px;gap:14px;box-shadow:var(--shadow-lg)}
  .nav__links.open{display:flex}
  .nav__toggle{display:block}
  .nav__cta{display:none}
  .grid-2,.grid-3,.grid-4,.steps,.steps.four,.stats,.ba-row,.form-grid,.checks{grid-template-columns:1fr}
  .hero h1{font-size:2.1rem}
  .hero p{font-size:1.05rem}
  .section-head h2{font-size:1.8rem}
  .footer-bottom{flex-direction:column}
  .footer-bottom a{margin-left:0;margin-right:16px}
}


/* ==========================================================================
   Gravenzorg — laag september 2026: sereen
   --------------------------------------------------------------------------
   Staat bewust onderaan en verandert geen enkele HTML-pagina: alle 64
   pagina's in drie talen krijgen dit uiterlijk via dit bestand en main.js.
   De foto's blijven allemaal staan. Beweging is traag en zacht, gebeurt één
   keer, en valt stil bij prefers-reduced-motion. De DELA-pagina's (alles
   binnen .dela-page) blijven in hun eigen huisstijl en bewegen niet.
   ========================================================================== */
:root{
  --primary:#4F77B5;        /* iets dieper: witte tekst op de knop blijft leesbaar */
  --primary-dark:#3F659F;
  --primary-light:#B7CBE8;
  --green:#4E9A5F;
  --green-dark:#3F8250;
  --heading:#1F2A33;
  --text:#4A5560;
  --muted:#6B7580;
  --bg-alt:#F7F5F0;         /* warm, als natuursteen, in plaats van koel grijsblauw */
  --bg-soft:#F1EEE7;
  --border:#E6E1D7;
  --footer-bg:#1F2A33;
  --radius:12px;
  --radius-lg:20px;
  --shadow:0 1px 2px rgba(31,42,51,.04),0 10px 30px -18px rgba(31,42,51,.22);
  --shadow-lg:0 1px 2px rgba(31,42,51,.05),0 22px 48px -24px rgba(31,42,51,.32);
  --serif:"Lora",Georgia,"Times New Roman",serif;
  --traag:cubic-bezier(.22,.61,.36,1);
}
html{scroll-padding-top:90px}
h1:not(.dela-page *),h2:not(.dela-page *),h3:not(.dela-page *){font-family:var(--serif);font-weight:600;letter-spacing:-.01em;text-wrap:balance}
h4:not(.dela-page *){letter-spacing:.01em}
.section-head h2:not(.dela-page *){font-size:clamp(1.9rem,3.2vw,2.5rem);line-height:1.18}
.section-head:not(.dela-page *){margin-bottom:48px}
section:not(.dela-page *){padding:clamp(64px,8vw,104px) 0}
/* kop */
.site-header:not(.dela-page *){transition:box-shadow .5s var(--traag)}
.site-header.gz-rust:not(.dela-page *){box-shadow:0 1px 0 rgba(31,42,51,.06),0 10px 30px -22px rgba(31,42,51,.35)}
.nav__links a:not(.dela-page *){position:relative}
.nav__links a:not(.dela-page *)::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1.5px;border-radius:2px;background:var(--green);transform:scaleX(0);transition:transform .45s var(--traag)}
.nav__links a:hover:not(.dela-page *)::after,.nav__links a.active:not(.dela-page *)::after{transform:scaleX(1)}
.nav__cta:not(.dela-page *),.btn:not(.dela-page *){border-radius:999px}
.lang-switch:not(.dela-page *){border-radius:999px}
/* knoppen: rustig:not(.dela-page *),geen sprongen */
.btn:not(.dela-page *){transition:background .35s,color .35s,border-color .35s,box-shadow .35s}
.btn-primary:hover:not(.dela-page *){transform:none;box-shadow:0 10px 24px -14px rgba(79,119,181,.8)}
/* hero: de foto blijft:not(.dela-page *),ademt traag:not(.dela-page *),en er zweeft wat licht in */
.hero:not(.dela-page *){isolation:isolate}
.hero__bg:not(.dela-page *){animation:gz-adem 28s ease-in-out infinite alternate;transform-origin:50% 60%}
@keyframes gz-adem{from{transform:scale(1)}to{transform:scale(1.07)}}
.hero:not(.dela-page *)::after{background:linear-gradient(180deg,rgba(20,28,36,.38) 0%,rgba(20,28,36,.52) 55%,rgba(20,28,36,.7) 100%)}
.hero h1:not(.dela-page *){font-weight:600;letter-spacing:-.015em;line-height:1.12}
.hero h1 .accent:not(.dela-page *){color:var(--primary-light)}
.gz-licht:not(.dela-page *){position:absolute;inset:0;z-index:2;pointer-events:none;width:100%;height:100%}
.js .hero:not(.dela-page *) .container>*{animation:gz-op 1.4s var(--traag) both}
.js .hero:not(.dela-page *) .container>*:nth-child(2){animation-delay:.18s}
.js .hero:not(.dela-page *) .container>*:nth-child(3){animation-delay:.36s}
.js .hero:not(.dela-page *) .container>*:nth-child(4){animation-delay:.54s}
.js .hero:not(.dela-page *) .container>*:nth-child(5){animation-delay:.72s}
@keyframes gz-op{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
/* het takje: een lijn die onder elke sectietitel rustig groeit */
.gz-takje:not(.dela-page *){display:block;width:170px;height:30px;margin:14px auto 0;color:var(--green);overflow:visible}
.section-head:not(.text-center) .gz-takje:not(.dela-page *){margin-left:0}
.gz-takje path:not(.dela-page *),.gz-takje circle:not(.dela-page *){fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.js .gz-takje path:not(.dela-page *),.js .gz-takje circle:not(.dela-page *){stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.8s var(--traag)}
.js .gz-takje .blad:not(.dela-page *){transition-duration:1.1s}
.js .gz-takje .blad:nth-of-type(2):not(.dela-page *){transition-delay:.7s}.js .gz-takje .blad:nth-of-type(3):not(.dela-page *){transition-delay:.95s}
.js .gz-takje .blad:nth-of-type(4):not(.dela-page *){transition-delay:1.2s}.js .gz-takje .blad:nth-of-type(5):not(.dela-page *){transition-delay:1.45s}
.js .gz-takje circle:not(.dela-page *){transition-delay:1.7s;transition-duration:.8s}
.js .in .gz-takje path:not(.dela-page *),.js .in .gz-takje circle:not(.dela-page *),.js .gz-takje.in path:not(.dela-page *),.js .gz-takje.in circle:not(.dela-page *){stroke-dashoffset:0}
/* kaarten en beelden */
.card:not(.dela-page *),.feature:not(.dela-page *),.price-card:not(.dela-page *),.quote:not(.dela-page *),.contact-tile:not(.dela-page *),.form-card:not(.dela-page *),.faq-item:not(.dela-page *){border-color:var(--border);transition:transform .7s var(--traag),box-shadow .7s var(--traag),border-color .5s}
.card:hover:not(.dela-page *),.feature:hover:not(.dela-page *){transform:translateY(-3px)}
.card__img:not(.dela-page *){transition:transform 1.4s var(--traag)}
.card:not(.dela-page *){isolation:isolate}
.card:hover .card__img:not(.dela-page *){transform:scale(1.045)}
.badge-pop:not(.dela-page *),.price-badge:not(.dela-page *){letter-spacing:.02em}
.feature__icon:not(.dela-page *){border-radius:50%}
.step__num:not(.dela-page *){box-shadow:none;font-family:var(--serif);font-weight:600}
.split img:not(.dela-page *){border-radius:var(--radius-lg)}
.badge-float:not(.dela-page *){border-radius:16px;animation:gz-zweef 7s ease-in-out infinite}
@keyframes gz-zweef{50%{transform:translateY(-6px)}}
.info-box:not(.dela-page *){border-left-color:var(--green);border-radius:var(--radius)}
.pill-list span:not(.dela-page *){border-color:var(--border)}
.cta-band:not(.dela-page *){background:linear-gradient(160deg,#243240,#2f4150)}
.quote p:not(.dela-page *){font-family:var(--serif);font-size:1.05rem;line-height:1.7}
.stat__num:not(.dela-page *){font-family:var(--serif);font-weight:600}
/* stappen: een lijn verbindt ze:not(.dela-page *),nummer na nummer */
.steps:not(.four):not(.dela-page *){position:relative}
.steps:not(.four):not(.dela-page *)::before{content:"";position:absolute;left:calc(100%/6);right:calc(100%/6);top:42px;height:1.5px;background:var(--border);z-index:0}
.steps:not(.four):not(.dela-page *)::after{content:"";position:absolute;left:calc(100%/6);right:calc(100%/6);top:42px;height:1.5px;background:var(--green);transform-origin:left;transform:scaleX(1);transition:transform 2.2s var(--traag) .3s;z-index:0}
.js .steps:not(.four):not(.in):not(.dela-page *)::after{transform:scaleX(0)}
.step:not(.dela-page *){position:relative;z-index:1}
.step__num:not(.dela-page *){position:relative;border:6px solid #fff;box-sizing:content-box;transition:transform .9s var(--traag),background .6s}
.js .steps:not(.in) .step__num:not(.dela-page *){transform:scale(.6);background:var(--primary-light)}
.steps .step:nth-child(2) .step__num:not(.dela-page *){transition-delay:.9s}
.steps .step:nth-child(3) .step__num:not(.dela-page *){transition-delay:1.8s}
.steps .step:nth-child(4) .step__num:not(.dela-page *){transition-delay:2.4s}
/* voor en na: het NA-beeld krijgt langzaam zijn kleur */
.ba img:not(.dela-page *){transition:filter 2.4s var(--traag),transform 2.4s var(--traag)}
.js .ba-row:not(.in) .ba:last-child img:not(.dela-page *){filter:grayscale(1) brightness(.92)}
.js .ba-row:not(.in) .ba:first-child img:not(.dela-page *){filter:grayscale(.3)}
.ba__tag:not(.dela-page *){border-radius:999px;letter-spacing:.08em}
/* prijzen: een nieuwe frequentie vervaagt in plaats van te verspringen */
.price-value:not(.dela-page *){transition:opacity .45s var(--traag)}
.price-value.gz-wissel:not(.dela-page *){opacity:.15}
.freq-tab:not(.dela-page *){transition:background .4s,color .4s,border-color .4s}
/* één binnenkomst:not(.dela-page *),traag */
.js .rv:not(.dela-page *){opacity:0;transform:translateY(18px);transition:opacity 1.1s var(--traag),transform 1.1s var(--traag);transition-delay:calc(var(--i,0) * 110ms)}
.js .rv.in:not(.dela-page *){opacity:1;transform:none}

@media(max-width:760px){
  .steps:not(.four):not(.dela-page *)::before,.steps:not(.four):not(.dela-page *)::after{display:none}
  .gz-takje:not(.dela-page *){width:120px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .rv:not(.dela-page *){opacity:1;transform:none}
  .js .gz-takje path:not(.dela-page *),.js .gz-takje circle:not(.dela-page *){stroke-dashoffset:0}
  .gz-licht:not(.dela-page *){display:none}
}

/* de DELA-pagina's houden hun oorspronkelijke maten en kleuren */
.dela-page{--radius:8px;--radius-lg:16px;--shadow:0 4px 14px rgba(31,41,55,.08);--shadow-lg:0 12px 30px rgba(31,41,55,.12);
  --border:#e5e7eb;--bg-alt:#f4f7fb;--bg-soft:#eef2f8;--muted:#6b7280}