/* Gedeelde stijl VVE Multidiensten — gebruikt door alle pagina's behalve index.html */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --blue:#00AEEF; --blue-dark:#0092CC; --blue-tekst:#0077A8; --blue-pale:#E6F7FD;
      --slate:#2C3E50; --black:#0D0D0D; --near-black:#1A1A1A;
      --gray-dark:#3A3A3A; --gray-mid:#5F6773; --gray-light:#F2F4F7;
      --border:#E2E6EA; --white:#FFFFFF;
      --serif:'Syne',sans-serif; --sans:'Inter',system-ui,sans-serif;
      --radius:12px; --max:1100px;
    }
    html { scroll-behavior:smooth; }
    body { font-family:var(--sans); color:var(--gray-dark); background:var(--white); line-height:1.65; overflow-x:hidden; }
    .container { max-width:var(--max); margin:0 auto; padding:0 5%; }
    .section-tag { display:inline-block; font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--blue-tekst); background:var(--blue-pale); padding:4px 12px; border-radius:20px; margin-bottom:14px; }
    #progress-bar { position:fixed; top:0; left:0; z-index:200; height:3px; width:0%; background:linear-gradient(90deg,var(--blue-dark),var(--blue),#00d4ff); box-shadow:0 0 8px rgba(0,174,239,.6); }
    header { position:sticky; top:0; z-index:100; background:var(--white); border-bottom:1px solid var(--border); }
    nav { display:flex; align-items:center; justify-content:space-between; height:68px; max-width:var(--max); margin:0 auto; padding:0 5%; }
    .nav-logo img { height:42px; width:auto; display:block; }
    .nav-links { display:flex; align-items:center; list-style:none; gap:0; }
    .nav-links li a { text-decoration:none; color:var(--gray-dark); font-size:14px; font-weight:500; padding:8px 14px; border-radius:6px; transition:color .2s,background .2s; }
    .nav-links li a:hover { color:var(--blue-tekst); background:var(--blue-pale); }
    .nav-links li.nav-cta a { background:var(--blue); color:var(--white); padding:9px 20px; margin-left:8px; }
    .nav-links li.nav-cta a:hover { background:var(--blue-dark); }
    .hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none; padding:6px; }
    .hamburger span { display:block; width:24px; height:2px; background:var(--black); border-radius:2px; transition:all .3s; }
    .hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
    .hamburger.open span:nth-child(2) { opacity:0; }
    .hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
    .page-hero { background:var(--near-black); padding:72px 5% 80px; position:relative; overflow:hidden; }
    .page-hero::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; background:var(--blue); }
    .page-hero-bg { position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse 60% 80% at 80% 50%,rgba(0,174,239,.12) 0%,transparent 65%); }
    .page-hero-grid { position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:60px 60px; }
    .breadcrumb { display:flex; align-items:center; gap:8px; font-size:13px; color:rgba(255,255,255,.4); margin-bottom:20px; position:relative; z-index:1; }
    .breadcrumb a { color:var(--blue); text-decoration:none; }
    .page-hero h1 { font-family:var(--serif); font-size:clamp(32px,5vw,52px); font-weight:700; color:var(--white); line-height:1.1; margin-bottom:16px; position:relative; z-index:1; }
    .page-hero h1 .accent { color:var(--blue); }
    .page-hero p { font-size:18px; color:rgba(255,255,255,.6); font-weight:300; max-width:580px; line-height:1.7; position:relative; z-index:1; }
    .back-btn { display:inline-flex; align-items:center; gap:8px; background:rgba(0,174,239,.15); border:1px solid rgba(0,174,239,.3); color:var(--blue); padding:8px 18px; border-radius:20px; font-size:13px; font-weight:500; text-decoration:none; margin-top:28px; position:relative; z-index:1; transition:background .2s; }
    .back-btn:hover { background:rgba(0,174,239,.25); }
    .intro { padding:72px 5%; background:var(--white); }
    .intro-inner { max-width:var(--max); margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start; }
    .intro-text h2 { font-family:var(--serif); font-size:clamp(24px,3vw,34px); color:var(--black); line-height:1.2; margin-bottom:18px; }
    .intro-text p { font-size:15px; color:var(--gray-mid); line-height:1.8; margin-bottom:16px; font-weight:300; }
    .intro-card { background:var(--near-black); border-radius:16px; padding:32px; position:relative; overflow:hidden; }
    .intro-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--blue); }
    .intro-card h3 { font-family:var(--serif); font-size:20px; color:var(--white); margin-bottom:8px; }
    .intro-card .sub { font-size:13px; color:rgba(255,255,255,.4); margin-bottom:24px; }
    .check-list { list-style:none; }
    .check-list li { display:flex; align-items:center; gap:10px; font-size:14px; color:rgba(255,255,255,.75); padding:9px 0; border-bottom:1px solid rgba(255,255,255,.07); }
    .check-list li:last-child { border-bottom:none; }
    .check-list li::before { content:''; width:18px; height:18px; min-width:18px; background:rgba(0,174,239,.2); border-radius:50%; background-image:url("data:image/svg+xml,%3Csvg width='10' height='8' viewBox='0 0 10 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 4L3.5 6.5L9 1' stroke='%2300AEEF' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:center; }
    .werkwijze { padding:72px 5%; background:var(--gray-light); }
    .werkwijze h2 { font-family:var(--serif); font-size:clamp(24px,3vw,34px); color:var(--black); text-align:center; margin-bottom:48px; }
    .steps { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; max-width:var(--max); margin:0 auto; }
    .step { background:var(--white); border:1px solid var(--border); border-radius:var(--radius); padding:28px 24px; transition:box-shadow .2s,transform .2s; }
    .step:hover { box-shadow:0 8px 28px rgba(0,174,239,.1); transform:translateY(-2px); }
    .step-num { font-family:var(--serif); font-size:36px; font-weight:700; color:var(--blue); opacity:.2; line-height:1; margin-bottom:12px; }
    .step h3 { font-size:15px; font-weight:600; color:var(--black); margin-bottom:8px; }
    .step p { font-size:13px; color:var(--gray-mid); line-height:1.6; font-weight:300; }
    .usp-section { padding:72px 5%; background:var(--white); }
    .usp-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; max-width:var(--max); margin:0 auto; }
    .usp-card { border:1.5px solid var(--border); border-top:3px solid var(--blue); border-radius:var(--radius); padding:28px 24px; transition:box-shadow .2s,transform .2s; }
    .usp-card:hover { box-shadow:0 8px 28px rgba(0,0,0,.07); transform:translateY(-2px); }
    .usp-icon { font-size:28px; margin-bottom:14px; }
    .usp-card h3 { font-size:16px; font-weight:600; color:var(--black); margin-bottom:8px; }
    .usp-card p { font-size:14px; color:var(--gray-mid); line-height:1.65; font-weight:300; }
    .cta-section { background:var(--near-black); padding:72px 5%; text-align:center; position:relative; overflow:hidden; }
    .cta-section::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--blue); }
    .cta-section h2 { font-family:var(--serif); font-size:clamp(26px,3.5vw,40px); color:var(--white); margin-bottom:16px; }
    .cta-section p { font-size:17px; color:rgba(255,255,255,.55); font-weight:300; margin-bottom:36px; max-width:520px; margin-left:auto; margin-right:auto; }
    .btn-primary { background:var(--blue); color:var(--white); padding:14px 32px; border-radius:8px; text-decoration:none; font-weight:600; font-size:15px; transition:background .2s,transform .15s; display:inline-flex; align-items:center; gap:8px; }
    .btn-primary:hover { background:var(--blue-dark); transform:translateY(-1px); }
    footer { background:var(--near-black); padding:56px 5% 0; position:relative; }
    footer::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--blue); }
    .footer-content { max-width:var(--max); margin:0 auto; display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:48px; padding-bottom:48px; border-bottom:1px solid rgba(255,255,255,.07); }
    .footer-brand img { height:38px; margin-bottom:16px; }
    .footer-brand p { font-size:14px; color:rgba(255,255,255,.45); line-height:1.7; font-weight:300; }
    .footer-contact { margin-top:16px; }
    .footer-contact a { display:block; font-size:13px; color:rgba(255,255,255,.5); text-decoration:none; margin-bottom:4px; transition:color .2s; }
    .footer-contact a:hover { color:var(--blue); }
    .footer-col h4 { font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--blue); margin-bottom:16px; }
    .footer-col a, .footer-col p { display:block; font-size:14px; color:rgba(255,255,255,.45); text-decoration:none; margin-bottom:8px; font-weight:300; }
    .footer-col a:hover { color:var(--white); }
    .footer-bottom { max-width:var(--max); margin:0 auto; padding:20px 0; display:flex; justify-content:space-between; align-items:center; font-size:12px; color:rgba(255,255,255,.5); }
    .fade-up { opacity:0; transform:translateY(22px); transition:opacity .55s ease,transform .55s ease; }
    .fade-up.visible { opacity:1; transform:none; }
    .fade-delay-1 { transition-delay:.08s; }
    .fade-delay-2 { transition-delay:.16s; }
    .fade-delay-3 { transition-delay:.24s; }
    .fade-delay-4 { transition-delay:.32s; }
    @media(max-width:1024px) { .intro-inner { grid-template-columns:1fr; gap:40px; } .steps { grid-template-columns:repeat(2,1fr); } .usp-grid { grid-template-columns:1fr 1fr; } .footer-content { grid-template-columns:1fr 1fr; gap:32px; } }
    @media(max-width:768px) {
      .hamburger { display:flex; }
      .nav-links { display:none; position:absolute; top:68px; left:0; right:0; background:var(--white); flex-direction:column; gap:0; border-bottom:1px solid var(--border); box-shadow:0 8px 24px rgba(0,0,0,.08); z-index:99; }
      .nav-links.open { display:flex; }
      .nav-links li { width:100%; }
      .nav-links li a { display:block; padding:12px 5%; border-radius:0; border-bottom:1px solid var(--gray-light); }
      .nav-links li.nav-cta { padding:12px 5%; }
      .nav-links li.nav-cta a { border-radius:8px; text-align:center; margin:0; }
      .steps { grid-template-columns:1fr; }
      .usp-grid { grid-template-columns:1fr; }
      .footer-content { grid-template-columns:1fr; gap:32px; }
      .footer-bottom { flex-direction:column; gap:8px; text-align:center; }
    }

    /* USP iconen SVG stijl */
    .usp-icon { width:48px; height:48px; background:var(--blue-pale); border-radius:12px; display:flex; align-items:center; justify-content:center; margin-bottom:14px; color:var(--blue); }
    .usp-icon svg { width:24px; height:24px; }
    .dienst-icon-wrap { color:white; }
    .dienst-icon-wrap svg { width:28px; height:28px; }
    .pin { color:var(--blue-tekst); }
    .pin svg { width:16px; height:16px; vertical-align:middle; }
.footer-contact .footer-tijden { display:block; font-size:13px; color:rgba(255,255,255,.5); margin-bottom:4px; }