.elementor-1296 .elementor-element.elementor-element-3ce28b6{--display:flex;}.elementor-1296 .elementor-element.elementor-element-1c14328{--display:flex;}.elementor-1296 .elementor-element.elementor-element-243f979{--display:flex;}.elementor-1296 .elementor-element.elementor-element-09b057e{--display:flex;}.elementor-1296 .elementor-element.elementor-element-882e55c{--display:flex;--align-items:stretch;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}body.elementor-page-1296{margin:-64px -64px -64px -64px;}@media(min-width:768px){.elementor-1296 .elementor-element.elementor-element-3ce28b6{--content-width:1000px;}.elementor-1296 .elementor-element.elementor-element-882e55c{--width:56%;}}/* Start custom CSS for html, class: .elementor-element-8d458e8 *//* ===== NAV ALTIJD ZICHTBAAR & MOBIEL-PROOF ===== */
:root{ --navh:72px; }                  /* header-hoogte */
html{ scroll-behavior:smooth }
body{ padding-top: var(--navh); }      /* ruimte onder fixed header */

/* Header blijft zichtbaar + schaduw bij scroll */
:root{
  /* bestaand… */
  --header-h:72px; /* standaard hoogte, JS zet dit dynamisch goed */
}
header.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid #e0e6ef;
  z-index: 1000;
}
header.site-header.scrolled { box-shadow: var(--shadow); }

/* vervang je bestaande header{} blok hiermee */
header{
  position:fixed; top:0; left:0; right:0; width:100%;
  background:rgba(255,255,255,0.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid #e0e6ef;
  z-index:1000; /* hoger dan de rest */
  header.scrolled{ box-shadow: var(--shadow); }

}

/* zorg dat content niet onder de header kruipt */
body{ padding-top:var(--header-h); }
}
header.scrolled{
  background:rgba(255,255,255,0.92);
  box-shadow:0 8px 24px rgba(31,42,56,.08);
}

.nav{
  position:relative;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  height:var(--navh);
}
.brand{ font-weight:900; letter-spacing:.4px; color:var(--primary); font-size:22px }

.menu{ display:flex; align-items:center; gap:14px; list-style:none; margin:0; padding:0 }
/* ==== IAMCURA ACHTERGRONDSTIJL ==== */
body {
  padding-top: calc(var(--header-h) + env(safe-area-inset-top, 0px));
}

body {
  background: linear-gradient(180deg, #f9fbfd 0%, #eef5f9 50%, #f9fbfd 100%);
  background-attachment: fixed;
  color: var(--ink);
  font-family: "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  overflow-x: hidden;
}

/* Zachte decoratieve vorm rechtsboven */
body::before {
  content: "";
  position: fixed;
  top: -180px;
  right: -220px;
  width: 480px;
  height: 480px;
  background: radial-gradient(circle at center, rgba(68,120,178,0.25), transparent 70%);
  z-index: 0;
  opacity: 0.6;
  filter: blur(60px);
  pointer-events: none;
  animation: floatLight 10s ease-in-out infinite alternate;
}

/* Zachte decoratieve vorm linksonder */
body::after {
  content: "";
  position: fixed;
  bottom: -200px;
  left: -220px;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle at center, rgba(59,185,164,0.25), transparent 70%);
  z-index: 0;
  opacity: 0.5;
  filter: blur(70px);
  pointer-events: none;
  animation: floatLight 12s ease-in-out infinite alternate-reverse;
}

/* Subtiele zweefanimatie */
@keyframes floatLight {
  from { transform: translateY(0) scale(1); }
  to { transform: translateY(-30px) scale(1.05); }
}

/* ==== FOOTER (IAMCURA) ==== */
.site-footer{
  background: linear-gradient(135deg, var(--primary) 0%, #2f5f94 45%, var(--accent) 100%);
  color:#fff;
  margin-top:48px;
  border-top-left-radius:18px;
  border-top-right-radius:18px;
  box-shadow: 0 -12px 30px rgba(31,42,56,0.12);
}
.site-footer .wrap{padding:40px 24px}
.footer-grid{
  display:grid;gap:22px;
  grid-template-columns: 2fr 1.3fr 1.3fr;
}
@media (max-width:900px){ .footer-grid{ grid-template-columns:1fr 1fr } }
@media (max-width:640px){ .footer-grid{ grid-template-columns:1fr } }

.footer-brand{
  display:flex;align-items:center;gap:16px;
  margin-bottom:10px;
}
.footer-brand img{
  height:48px;width:auto;display:block;
  filter: drop-shadow(0 4px 10px rgba(0,0,0,.18));
}
.footer-title{font-weight:900;letter-spacing:.3px;font-size:20px}
.footer-tag{opacity:.95;margin:6px 0 0;font-size:14px;line-height:1.5}

.footer-col h4{margin:0 0 8px;font-size:16px;font-weight:800;opacity:.95}
.footer-list{list-style:none;margin:0;padding:0}
.footer-list li{margin:8px 0}
.footer-list a{color:#fff;text-decoration:none;opacity:.95}
.footer-list a:hover{opacity:1;text-decoration:underline}

/* iconen */
.i{width:18px;height:18px;display:inline-block;vertical-align:-3px;margin-right:8px;opacity:.95}
.i.pin{background:currentColor;mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="%23000" viewBox="0 0 24 24"><path d="M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7zm0 9.5a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5z"/></svg>') center/contain no-repeat;}
.i.phone{background:currentColor;mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="%23000" viewBox="0 0 24 24"><path d="M6.6 10.8a15.5 15.5 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.8 11.8 0 0 0 3.7.6 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 8a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11.8 11.8 0 0 0 .6 3.7 1 1 0 0 1-.25 1z"/></svg>') center/contain no-repeat;}
.i.mail{background:currentColor;mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="%23000" viewBox="0 0 24 24"><path d="M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4-8 5-8-5V6l8 5 8-5v2z"/></svg>') center/contain no-repeat;}

/* bottom bar */
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.18);
  margin-top:22px;padding-top:14px;
  font-size:13px;opacity:.9;
  display:flex;gap:12px;justify-content:space-between;flex-wrap:wrap;
}
.footer-bottom a{color:#fff;text-decoration:none}
.footer-bottom a:hover{text-decoration:underline}

/* --- Hero centreren --- */
.hero .inner {
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
}

.hero h1 {
  text-align: center;
}

.hero .lede {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.hero .cta {
  justify-content: center;
}

/* Center de hero-teksten en knoppen */
.hero .inner{ text-align:center; }
.hero .inner .cta{ justify-content:center; }
.menu a{
  display:inline-block; padding:10px 12px; border-radius:12px;
  color:var(--ink); font-weight:600;
  transition:background .2s ease, color .2s ease, transform .1s ease;
}
.menu a:hover{ background:rgba(68,120,178,.08); color:var(--primary) }
.menu a:active{ transform:translateY(1px) }

/* CTA in menu */
.btn-cta{
  background:linear-gradient(90deg,var(--accent),var(--primary));
  color:#fff !important; padding:10px 16px; border-radius:999px;
  box-shadow:0 8px 20px rgba(68,120,178,.15);
  white-space:nowrap;
}

/* Hamburger */
.menu-toggle{
  display:none; width:44px; height:44px; border-radius:12px;
  border:1px solid #dde5f0; background:#fff; cursor:pointer; position:relative;
  z-index:1002; -webkit-tap-highlight-color:transparent;
}
.menu-bars, .menu-bars::before, .menu-bars::after{
  content:""; display:block; position:absolute; left:50%; transform:translateX(-50%);
  width:22px; height:2px; background:var(--ink); border-radius:2px; transition:.25s ease;
}
.menu-bars{ top:50%; transform:translate(-50%,-50%) }
.menu-bars::before{ top:-7px } .menu-bars::after{ top:7px }
.nav.open .menu-bars{ background:transparent }
.nav.open .menu-bars::before{ transform:translateX(-50%) rotate(45deg); top:0 }
.nav.open .menu-bars::after{ transform:translateX(-50%) rotate(-45deg); top:0 }

/* Mobiel paneel + overlay */
@media (max-width:900px){
  .menu-toggle{ display:inline-block }
  .nav .menu{
    position:absolute; right:24px; left:24px; top:var(--navh);
    background:#fff; border:1px solid #e6edf6; border-radius:16px;
    box-shadow:0 18px 40px rgba(68,120,178,.15);
    padding:12px; display:none; flex-direction:column; gap:6px; z-index:1001;
	.nav .menu { background: rgba(255,255,255,0.98); backdrop-filter: blur(6px); }
  }
  .nav.open .menu{ display:flex }
  .menu a{ padding:14px; border-radius:10px }
  .btn-cta{ width:100%; text-align:center }

  /* donkere overlay wanneer menu open is */
  body.nav-open::after{
    content:""; position:fixed; inset:0; z-index:999; background:rgba(0,0,0,.15);
  }
}

/* Desktop safeguard: menu altijd zichtbaar */
@media (min-width:901px){
  .menu-toggle{ display:none !important }
  .nav .menu{
    position:static !important; display:flex !important; flex-direction:row !important;
    background:transparent !important; border:0 !important; box-shadow:none !important;
    padding:0 !important;
  }
  body.nav-open::after{ content:none !important }
}

/* Ankers mooi onder de vaste header landen */
section{ scroll-margin-top: calc(var(--navh) + 18px); }
@media (min-width:901px){
  .menu{ position:relative; top:4px; } /* maak 6px als je iets meer wilt */
}
/* ========== RESPONSIVE FIX-PACK (mobiel + tablet) ========== */

/* iOS safe-area + vaste header ruimte */
:root{ --navh:72px; }
@supports (padding: max(0px)) {
  body{ padding-top: calc(var(--navh) + env(safe-area-inset-top)); }
  header{ padding-top: env(safe-area-inset-top); }
}

/* ===== Leesbaarheid fix voor DIENSTEN en WAAROM (mobiel + tablet) ===== */

<header class="iamc-header" role="banner">
  <div class="iamc-wrap">
    <a href="#" class="iamc-brand" aria-label="IAMCURA home">
      <img
        src="https://iam-care.com/wp-content/uploads/2025/10/transparant-background-pat.svg"
        alt="IAMCURA"
        class="iamc-logo"
        width="240"
        height="60"
      />
    </a>

    <button class="iamc-toggle" type="button" aria-expanded="false" aria-controls="iamc-menu" aria-label="Menu openen/sluiten">
      <span class="iamc-bars"></span>
    </button>

    <nav class="iamc-nav" aria-label="Hoofdmenu">
      <ul id="iamc-menu" class="iamc-menu">
        <li><a href="#diensten">Diensten</a></li>
        <li><a href="#proces">Proces</a></li>
        <li><a href="#waarom">Waarom wij</a></li>
        <li><a href="#contact">Contact</a></li>
        <li><a class="iamc-cta" href="#inschrijving">📎 Inschrijven</a></li>
      </ul>
    </nav>
  </div>
</header>
<script>
(function(){
  const header = document.querySelector('.iamc-header');
  const btn = document.querySelector('.iamc-toggle');
  const links = document.querySelectorAll('.iamc-menu a[href^="#"]');
  if(btn){
    const toggle = () => {
      const open = header.classList.toggle('is-open');
      btn.setAttribute('aria-expanded', open ? 'true':'false');
    };
    btn.addEventListener('click', toggle);
    btn.addEventListener('touchstart', e => { e.preventDefault(); toggle(); }, {passive:false});
  }
  links.forEach(a => a.addEventListener('click', () => header.classList.remove('is-open')));
  const shade = () => header.classList.toggle('scrolled', window.scrollY > 4);
  window.addEventListener('scroll', shade, {passive:true}); shade();
})();
</script>
}

@keyframes shimmer {
  0% { left: -100%; }
  100% { left: 140%; }
}
.menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  border: none;
  background: transparent;
  padding: 0;
  margin: 0;
  border-radius: 12px;
}
.menu-toggle .menu-bars,
.menu-toggle .menu-bars::before,
.menu-toggle .menu-bars::after {
  display: block;
  position: relative;
  width: 22px;
  height: 2px;
  background: var(--ink);
  content: "";
  margin: 0 auto;
  transition: transform .2s ease, opacity .2s ease;
}
.menu-toggle .menu-bars::before { position: absolute; top: -6px; }
.menu-toggle .menu-bars::after { position: absolute; top: 6px; }
.nav.open .menu-bars { transform: rotate(45deg); }
.nav.open .menu-bars::before { opacity: 0; }
.nav.open .menu-bars::after { transform: rotate(-90deg); top: 0; }

@media (max-width: 900px) {
  .menu-toggle { display: block; }
background: var(--primary);
.nav .menu a {
  color: #fff;
}
.nav .menu a:hover {
  background: rgba(255,255,255,0.15);
  border-radius: 10px;
}

}

  .nav.open .menu { display: flex; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-9981de0 *//* ===== NAV ALTIJD ZICHTBAAR & MOBIEL-PROOF ===== */
:root{ --navh:72px; }                  /* header-hoogte */
html{ scroll-behavior:smooth }
body{ padding-top: var(--navh); }      /* ruimte onder fixed header */

/* Header blijft zichtbaar + schaduw bij scroll */
header{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  background:rgba(255,255,255,0.85);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border-bottom:1px solid #e6edf6;
  transition:box-shadow .2s ease, background .2s ease;
}
header.scrolled{
  background:rgba(255,255,255,0.92);
  box-shadow:0 8px 24px rgba(31,42,56,.08);
}

.nav{
  position:relative;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  height:var(--navh);
}
.brand{ font-weight:900; letter-spacing:.4px; color:var(--primary); font-size:22px }

.menu{ display:flex; align-items:center; gap:14px; list-style:none; margin:0; padding:0 }
/* ==== IAMCURA ACHTERGRONDSTIJL ==== */
body {
  background: linear-gradient(180deg, #f9fbfd 0%, #eef5f9 50%, #f9fbfd 100%);
  background-attachment: fixed;
  color: var(--ink);
  font-family: "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  overflow-x: hidden;
}

/* Zachte decoratieve vorm rechtsboven */
body::before {
  content: "";
  position: fixed;
  top: -180px;
  right: -220px;
  width: 480px;
  height: 480px;
  background: radial-gradient(circle at center, rgba(68,120,178,0.25), transparent 70%);
  z-index: 0;
  opacity: 0.6;
  filter: blur(60px);
  pointer-events: none;
  animation: floatLight 10s ease-in-out infinite alternate;
}

/* Zachte decoratieve vorm linksonder */
body::after {
  content: "";
  position: fixed;
  bottom: -200px;
  left: -220px;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle at center, rgba(59,185,164,0.25), transparent 70%);
  z-index: 0;
  opacity: 0.5;
  filter: blur(70px);
  pointer-events: none;
  animation: floatLight 12s ease-in-out infinite alternate-reverse;
}

/* Subtiele zweefanimatie */
@keyframes floatLight {
  from { transform: translateY(0) scale(1); }
  to { transform: translateY(-30px) scale(1.05); }
}

/* ==== FOOTER (IAMCURA) ==== */
.site-footer{
  background: linear-gradient(135deg, var(--primary) 0%, #2f5f94 45%, var(--accent) 100%);
  color:#fff;
  margin-top:48px;
  border-top-left-radius:18px;
  border-top-right-radius:18px;
  box-shadow: 0 -12px 30px rgba(31,42,56,0.12);
}
.site-footer .wrap{padding:40px 24px}
.footer-grid{
  display:grid;gap:22px;
  grid-template-columns: 2fr 1.3fr 1.3fr;
}
@media (max-width:900px){ .footer-grid{ grid-template-columns:1fr 1fr } }
@media (max-width:640px){ .footer-grid{ grid-template-columns:1fr } }

.footer-brand{
  display:flex;align-items:center;gap:16px;
  margin-bottom:10px;
}
.footer-brand img{
  height:48px;width:auto;display:block;
  filter: drop-shadow(0 4px 10px rgba(0,0,0,.18));
}
.footer-title{font-weight:900;letter-spacing:.3px;font-size:20px}
.footer-tag{opacity:.95;margin:6px 0 0;font-size:14px;line-height:1.5}

.footer-col h4{margin:0 0 8px;font-size:16px;font-weight:800;opacity:.95}
.footer-list{list-style:none;margin:0;padding:0}
.footer-list li{margin:8px 0}
.footer-list a{color:#fff;text-decoration:none;opacity:.95}
.footer-list a:hover{opacity:1;text-decoration:underline}

/* iconen */
.i{width:18px;height:18px;display:inline-block;vertical-align:-3px;margin-right:8px;opacity:.95}
.i.pin{background:currentColor;mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="%23000" viewBox="0 0 24 24"><path d="M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7zm0 9.5a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5z"/></svg>') center/contain no-repeat;}
.i.phone{background:currentColor;mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="%23000" viewBox="0 0 24 24"><path d="M6.6 10.8a15.5 15.5 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.8 11.8 0 0 0 3.7.6 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 8a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11.8 11.8 0 0 0 .6 3.7 1 1 0 0 1-.25 1z"/></svg>') center/contain no-repeat;}
.i.mail{background:currentColor;mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="%23000" viewBox="0 0 24 24"><path d="M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4-8 5-8-5V6l8 5 8-5v2z"/></svg>') center/contain no-repeat;}

/* bottom bar */
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.18);
  margin-top:22px;padding-top:14px;
  font-size:13px;opacity:.9;
  display:flex;gap:12px;justify-content:space-between;flex-wrap:wrap;
}
.footer-bottom a{color:#fff;text-decoration:none}
.footer-bottom a:hover{text-decoration:underline}

/* --- Hero centreren --- */
.hero .inner {
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
}

.hero h1 {
  text-align: center;
}

.hero .lede {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.hero .cta {
  justify-content: center;
}

/* Center de hero-teksten en knoppen */
.hero .inner{ text-align:center; }
.hero .inner .cta{ justify-content:center; }
.menu a{
  display:inline-block; padding:10px 12px; border-radius:12px;
  color:var(--ink); font-weight:600;
  transition:background .2s ease, color .2s ease, transform .1s ease;
}
.menu a:hover{ background:rgba(68,120,178,.08); color:var(--primary) }
.menu a:active{ transform:translateY(1px) }

/* CTA in menu */
.btn-cta{
  background:linear-gradient(90deg,var(--accent),var(--primary));
  color:#fff !important; padding:10px 16px; border-radius:999px;
  box-shadow:0 8px 20px rgba(68,120,178,.15);
  white-space:nowrap;
}

/* Hamburger */
.menu-toggle{
  display:none; width:44px; height:44px; border-radius:12px;
  border:1px solid #dde5f0; background:#fff; cursor:pointer; position:relative;
  z-index:1002; -webkit-tap-highlight-color:transparent;
}
.menu-bars, .menu-bars::before, .menu-bars::after{
  content:""; display:block; position:absolute; left:50%; transform:translateX(-50%);
  width:22px; height:2px; background:var(--ink); border-radius:2px; transition:.25s ease;
}
.menu-bars{ top:50%; transform:translate(-50%,-50%) }
.menu-bars::before{ top:-7px } .menu-bars::after{ top:7px }
.nav.open .menu-bars{ background:transparent }
.nav.open .menu-bars::before{ transform:translateX(-50%) rotate(45deg); top:0 }
.nav.open .menu-bars::after{ transform:translateX(-50%) rotate(-45deg); top:0 }

/* Mobiel paneel + overlay */
@media (max-width:900px){
  .menu-toggle{ display:inline-block }
  .nav .menu{
    position:absolute; right:24px; left:24px; top:var(--navh);
    background:#fff; border:1px solid #e6edf6; border-radius:16px;
    box-shadow:0 18px 40px rgba(68,120,178,.15);
    padding:12px; display:none; flex-direction:column; gap:6px; z-index:1001;
  }
  .nav.open .menu{ display:flex }
  .menu a{ padding:14px; border-radius:10px }
  .btn-cta{ width:100%; text-align:center }

  /* donkere overlay wanneer menu open is */
  body.nav-open::after{
    content:""; position:fixed; inset:0; z-index:999; background:rgba(0,0,0,.15);
  }
}

/* Desktop safeguard: menu altijd zichtbaar */
@media (min-width:901px){
  .menu-toggle{ display:none !important }
  .nav .menu{
    position:static !important; display:flex !important; flex-direction:row !important;
    background:transparent !important; border:0 !important; box-shadow:none !important;
    padding:0 !important;
  }
  body.nav-open::after{ content:none !important }
}

/* Ankers mooi onder de vaste header landen */
section{ scroll-margin-top: calc(var(--navh) + 18px); }
@media (min-width:901px){
  .menu{ position:relative; top:4px; } /* maak 6px als je iets meer wilt */
}
/* ========== RESPONSIVE FIX-PACK (mobiel + tablet) ========== */

/* iOS safe-area + vaste header ruimte */
:root{ --navh:72px; }
@supports (padding: max(0px)) {
  body{ padding-top: calc(var(--navh) + env(safe-area-inset-top)); }
  header{ padding-top: env(safe-area-inset-top); }
}

/* ===== Leesbaarheid fix voor DIENSTEN en WAAROM (mobiel + tablet) ===== */

/* Tablet */
@media (max-width: 900px){
  /* Sectietitel groter, extra onderruimte */
  #diensten h2, #waarom h2{
    font-size: clamp(22px, 3.6vw, 28px);
    margin-bottom: 18px;
    letter-spacing: .2px;
  }

  /* Cards: meer padding, lucht en duidelijke typografie */
  #diensten .card, #waarom .card{
    padding: 20px;
    border-radius: 16px;
    line-height: 1.75;
  }

  /* Kopjes in cards beter zichtbaar */
  #diensten .card h3, #waarom .card h3{
    font-size: clamp(18px, 2.4vw, 20px);
    margin: 0 0 8px;
  }

  /* Lichaamstekst iets groter en donkerder */
  #diensten .card p, #waarom .card p{
    font-size: 16px;
    color: #2a3442; /* iets donkerder dan --ink/muted op devices */
  }

  /* "muted" tekst minder licht op devices */
  #diensten .card .muted, #waarom .card .muted{
    color: #4b5866;
    font-size: 14px;
  }

  /* Grid naar 2 kolommen + meer ruimte */
  #diensten .grid.cols-3, #waarom .grid.cols-3{
    grid-template-columns: 1fr 1fr !important;
    gap: 18px !important;
  }
}

/* Telefoon */
@media (max-width: 640px){
  /* Extra padding per sectie */
  #diensten, #waarom{ padding: 44px 0; }

  /* Titel iets compacter maar duidelijk */
  #diensten h2, #waarom h2{
    font-size: clamp(20px, 6vw, 26px);
    margin-bottom: 16px;
  }

  /* Cards: 1 kolom en royale binnenruimte */
  #diensten .grid.cols-3, #waarom .grid.cols-3{
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  #diensten .card, #waarom .card{
    padding: 18px;
  }

  /* Kopjes & tekst groter voor leesafstand */
  #diensten .card h3, #waarom .card h3{
    font-size: clamp(18px, 5.2vw, 22px);
  }
  #diensten .card p, #waarom .card p{
    font-size: 17px;
    line-height: 1.8;
  }
  #diensten .card .muted, #waarom .card .muted{
    font-size: 15px;
    color: #44505c;
  }

  /* Lijsten prettiger leesbaar */
  #diensten .card ul, #waarom .card ul{
    padding-left: 20px;
    line-height: 1.8;
  }
}

/* Optioneel: maximale tekstbreedte binnen cards voor rust */
#diensten .card p, #diensten .card ul,
#waarom .card p, #waarom .card ul{
  max-width: 70ch;
}
/* --- Divider onder hero CTA --- */
.hero-divider {
  height: 4px;
  width: 160px;
  margin: 40px auto 0;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  box-shadow: 0 3px 8px rgba(68,120,178,0.15);
}
/* --- IAMCURA divider onder CTA (breder + subtieler) --- */
.hero-divider {
  height: 6px;
  width: 700px; /* breder gemaakt */
  margin: 35px auto 0;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  box-shadow: 0 3px 8px rgba(68,120,178,0.15);
  position: relative;
  overflow: hidden;
}

/* Subtiele glansanimatie */
.hero-divider::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0.8) 50%,
    rgba(255,255,255,0) 100%
  );
  animation: shimmer 4s infinite linear;
}

@keyframes shimmer {
  0% { left: -100%; }
  100% { left: 140%; }
}/* End custom CSS */