
  @font-face{font-family:"Archivo";font-weight:400;font-style:normal;font-display:swap;src:url(/fonts/archivo-400.woff2) format("woff2")}
  @font-face{font-family:"Archivo";font-weight:700;font-style:normal;font-display:swap;src:url(/fonts/archivo-700.woff2) format("woff2")}
  @font-face{font-family:"Archivo Expanded";font-weight:700;font-style:normal;font-display:swap;src:url(/fonts/archivo-exp-700.woff2) format("woff2")}

  :root{
    --bg:#F6F3EE; --surface:#FFFFFF; --ink:#141414; --muted:#5C554C; --line:#E4DDD3;
    --accent:#7A1F2B; --on-accent:#FFFFFF; --wave:#7A1F2B;
    --panel:#141414; --panel-ink:#EFE9E1; --panel-muted:#B8B0A4; --panel-line:#34312D; --panel-field:#1F1F1F;
    --hl:#F4E9E9; --ph:#ECE6DC; --ph-line:#CFC6B8; --ph-ink:#5C554C;
    --shadow:0 10px 30px rgba(20,20,20,.07);
  }
  :root[data-theme="dark"]{
    --bg:#141414; --surface:#1D1D1D; --ink:#EFE9E1; --muted:#A8A097; --line:#2C2B29;
    --accent:#C23B4B; --on-accent:#FFFFFF; --wave:#C23B4B;
    --panel:#1D1D1D; --panel-ink:#EFE9E1; --panel-muted:#A8A097; --panel-line:#34312D; --panel-field:#262626;
    --hl:#2A1B1E; --ph:#1D1D1D; --ph-line:#3A3835; --ph-ink:#A8A097;
    --shadow:none;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --bg:#141414; --surface:#1D1D1D; --ink:#EFE9E1; --muted:#A8A097; --line:#2C2B29;
      --accent:#C23B4B; --on-accent:#FFFFFF; --wave:#C23B4B;
      --panel:#1D1D1D; --panel-ink:#EFE9E1; --panel-muted:#A8A097; --panel-line:#34312D; --panel-field:#262626;
      --hl:#2A1B1E; --ph:#1D1D1D; --ph-line:#3A3835; --ph-ink:#A8A097;
      --shadow:none;
    }
  }

  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0;font-family:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);line-height:1.55;-webkit-font-smoothing:antialiased;transition:background .2s ease,color .2s ease}
  a{color:inherit}
  .wrap{max-width:1120px;margin:0 auto;padding:0 20px}
  h1,h2,h3{margin:0;line-height:1.05}
  h1,h2{font-family:"Archivo Expanded","Archivo",sans-serif;font-weight:700;letter-spacing:-.01em}
  h2{font-size:clamp(28px,4vw,40px)}
  .kicker{font-size:13px;font-weight:700;letter-spacing:.32em;text-transform:uppercase;color:var(--accent);margin:0 0 16px}
  .lead{color:var(--muted);font-size:17px;margin:10px 0 28px;max-width:560px}

  .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;font-weight:700;font-size:16px;text-decoration:none;transition:transform .15s ease,opacity .15s ease;border:0;cursor:pointer;font-family:inherit}
  .btn:hover{transform:translateY(-1px)}
  .btn-accent{background:var(--accent);color:var(--on-accent)}
  .btn-line{border:1.5px solid var(--ink);color:var(--ink);background:transparent}
  .btn svg{width:20px;height:20px;flex:none}

  /* header */
  header{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
  .nav{display:flex;align-items:center;justify-content:space-between;gap:16px;height:72px}
  .brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
  .brand svg{width:38px;height:38px;flex:none}
  .brand-text{display:flex;flex-direction:column;line-height:1}
  .brand-text b{font-family:"Archivo Expanded","Archivo",sans-serif;font-weight:700;font-size:19px;letter-spacing:.02em}
  .brand-text span{font-size:10px;font-weight:700;letter-spacing:.5em;color:var(--accent);margin-top:5px}
  .nav-links{display:flex;gap:28px;font-size:15px}
  .nav-links a{color:var(--muted);text-decoration:none}
  .nav-links a:hover{color:var(--ink)}
  .nav-right{display:flex;align-items:center;gap:10px}
  .nav .btn{min-height:44px;padding:0 18px;font-size:14px}
  .theme-btn{width:44px;height:44px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
  .theme-btn svg{width:20px;height:20px}
  .theme-btn .sun{display:none}
  :root[data-theme="dark"] .theme-btn .sun{display:block}
  :root[data-theme="dark"] .theme-btn .moon{display:none}
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]) .theme-btn .sun{display:block}
    :root:not([data-theme="light"]) .theme-btn .moon{display:none}
  }

  /* hero */
  .hero{padding:72px 0 96px}
  .hero-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}
  .hero h1{font-size:clamp(38px,5.6vw,62px)}
  .hero p.sub{font-size:19px;color:var(--muted);max-width:500px;margin:24px 0 32px}
  .cta-row{display:flex;gap:12px;flex-wrap:wrap}
  .hero small{display:block;margin-top:20px;color:var(--muted);font-size:14px}
  .hero-media{aspect-ratio:4/5;border-radius:28px;overflow:hidden;background:var(--ph)}
  .hero-media img{width:100%;height:100%;object-fit:cover;display:block}
  .placeholder{display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;border:1.5px dashed var(--ph-line);color:var(--ph-ink);font-size:15px;width:100%;height:100%;border-radius:inherit}

  /* facts */
  .facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .fact{padding:28px 24px}
  .fact + .fact{border-left:1px solid var(--line)}
  .fact b{display:block;font-family:"Archivo Expanded","Archivo",sans-serif;font-size:24px;font-weight:700}
  .fact span{color:var(--muted)}

  section.block{padding:96px 0 0}

  /* prices */
  .table-box{background:var(--surface);border:1px solid var(--line);border-radius:22px;overflow:hidden}
  table{width:100%;border-collapse:collapse;font-size:16px}
  th{text-align:left;color:var(--muted);font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:18px 24px}
  td{padding:18px 24px;border-top:1px solid var(--line)}
  tr.hl{background:var(--hl)}
  tr.hl td{font-weight:700}
  td.price{white-space:nowrap;font-weight:700;text-align:right}
  th:last-child{text-align:right}

  .two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:20px}
  .panel{border-radius:22px;padding:30px}
  .panel h3{font-size:19px;margin-bottom:8px}
  .panel p{margin:0}
  .panel.dark{background:var(--panel);color:var(--panel-ink)}
  .panel.dark p{color:var(--panel-muted)}
  .panel.light{background:var(--surface);border:1px solid var(--line)}
  .panel.light p{color:var(--muted)}
  .note{color:var(--muted);font-size:14px;margin:16px 0 0}

  .calc{display:flex;flex-wrap:wrap;gap:12px;align-items:end;margin-top:20px}
  .calc label{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--panel-muted)}
  .calc select,.calc input{height:48px;border-radius:12px;border:1px solid var(--panel-line);background:var(--panel-field);color:var(--panel-ink);padding:0 12px;font-size:16px;font-family:inherit;min-width:0}
  .calc input{width:110px}
  .calc-out{font-family:"Archivo Expanded","Archivo",sans-serif;font-size:26px;font-weight:700;margin-top:18px}
  .calc-out small{display:block;font-family:"Archivo",sans-serif;font-size:13px;font-weight:400;color:var(--panel-muted);margin-top:4px}

  /* steps */
  .cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
  .step{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:30px;display:flex;flex-direction:column;gap:10px}
  .num{font-family:"Archivo Expanded","Archivo",sans-serif;font-weight:700;font-size:15px;color:var(--accent);letter-spacing:.1em}
  .step h3{font-size:19px}
  .step p{margin:0;color:var(--muted)}

  figure{margin:0}
  .pairs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
  .pair{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:12px}
  .pair-imgs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .shot{position:relative;aspect-ratio:3/4;border-radius:14px;overflow:hidden;background:var(--ph)}
  .shot img{width:100%;height:100%;object-fit:cover;display:block}
  .tag{position:absolute;left:10px;top:10px;background:rgba(20,20,20,.78);color:#EFE9E1;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:6px 10px;border-radius:999px}
  .tag-na{background:var(--accent);color:var(--on-accent)}
  .pair figcaption{padding:14px 6px 4px;font-weight:700}
  .feature{margin-top:20px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:28px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:12px}
  .feature .shot{aspect-ratio:4/3}
  .feature figcaption{padding:12px 20px 12px 0}
  .feature h3{font-size:22px;margin-bottom:10px}
  .feature p{margin:0;color:var(--muted)}
  .feature .price-line{margin-top:14px;color:var(--ink);font-weight:700;font-size:18px}

  /* faq */
  .faq{display:flex;flex-direction:column;border-top:1px solid var(--line)}
  details{border-bottom:1px solid var(--line)}
  summary{font-weight:700;font-size:17px;cursor:pointer;padding:22px 0;list-style:none;display:flex;justify-content:space-between;gap:16px}
  summary::-webkit-details-marker{display:none}
  summary::after{content:"+";font-size:22px;line-height:1;color:var(--accent)}
  details[open] summary::after{content:"–"}
  details p{margin:0 0 22px;color:var(--muted);max-width:720px}

  .band{margin-top:96px;background:var(--panel);color:var(--panel-ink);padding:72px 0}
  .band .wrap{display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between}
  .band h2{max-width:620px;font-size:clamp(26px,3.6vw,36px)}

  footer{background:var(--panel);color:var(--panel-muted);padding:0 0 96px;font-size:14px}
  footer .wrap{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;border-top:1px solid var(--panel-line);padding-top:28px}
  footer a{color:var(--panel-muted)}

  .sticky-wa{display:none}

  @media (max-width:860px){
    .hero-grid,.two,.cols{grid-template-columns:minmax(0,1fr)}
    .facts{grid-template-columns:minmax(0,1fr)}
    .fact + .fact{border-left:0;border-top:1px solid var(--line)}
    .nav-links{display:none}
    .nav .btn-accent{display:none}
    .hero{padding:40px 0 64px}
    .hero-media{aspect-ratio:4/3}
    section.block{padding-top:72px}
    .band{margin-top:72px}
    th,td{padding:14px 14px}
    td:nth-child(2),th:nth-child(2){color:var(--muted);font-size:13px}
    .pairs,.feature{grid-template-columns:minmax(0,1fr)}
    .feature figcaption{padding:4px 8px 12px}
    .sticky-wa{display:flex;position:fixed;left:16px;right:16px;bottom:16px;z-index:20;box-shadow:0 8px 24px rgba(0,0,0,.3)}
  }
  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn,body{transition:none}}

  /* wat je krijgt */
  .specs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
  .spec{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:26px;display:flex;flex-direction:column;gap:10px}
  .spec svg{width:28px;height:28px;color:var(--accent)}
  .spec h3{font-size:18px}
  .spec p{margin:0;color:var(--muted)}
  .extra{margin-top:20px;display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:space-between;background:var(--panel);color:var(--panel-ink);border-radius:22px;padding:30px}
  .extra h3{font-size:20px;margin-bottom:6px}
  .extra p{margin:0;color:var(--panel-muted);max-width:560px}
  .extra .price-tag{font-family:"Archivo Expanded","Archivo",sans-serif;font-weight:700;font-size:18px;color:var(--panel-ink);margin-top:10px}
  .proof{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:22px;font-size:14px;color:var(--muted)}
  .proof b{color:var(--ink)}
  .proof a{color:var(--muted)}
  .area{margin-top:14px;font-size:14px;color:var(--panel-muted)}
  footer nav{display:flex;flex-wrap:wrap;gap:6px 16px}

  /* reviews */
  .reviews{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:20px}
  .review{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:30px;display:flex;flex-direction:column;gap:14px}
  .review blockquote{margin:0;font-size:20px;line-height:1.5;color:var(--ink)}
  .review figcaption{color:var(--muted);font-size:15px}
  .review figcaption b{color:var(--ink)}
  .stars{color:#E0A526;letter-spacing:.1em;font-size:18px}
  .review-cta{justify-content:center;align-items:flex-start}
  .review-cta p{margin:0;color:var(--muted)}
  .review-cta .score{display:flex;align-items:center;gap:10px;color:var(--ink)}
  .review-cta .score b{font-family:"Archivo Expanded","Archivo",sans-serif;font-size:36px}

  /* juridische pagina's */
  .legal{max-width:760px;margin:0 auto;padding:64px 20px 96px}
  .legal h1{font-size:clamp(30px,4.4vw,44px);margin-bottom:12px}
  .legal .meta{color:var(--muted);font-size:14px;margin:0 0 40px}
  .legal h2{font-family:"Archivo",sans-serif;font-size:20px;font-weight:700;letter-spacing:0;margin:36px 0 10px}
  .legal p,.legal li{color:var(--muted)}
  .legal p{margin:0 0 12px}
  .legal ul{margin:0 0 12px;padding-left:20px}
  .legal li{margin-bottom:6px}
  .legal strong{color:var(--ink)}
  .legal table{font-size:15px;margin:8px 0 16px;border:1px solid var(--line)}
  .legal td,.legal th{padding:12px 14px;vertical-align:top}
  .legal th{background:var(--surface)}

  @media (max-width:860px){
    .specs{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
    .legal{padding-top:40px}
  }
  @media (max-width:520px){ .specs{grid-template-columns:minmax(0,1fr)} }
  @media (max-width:860px){ .reviews{grid-template-columns:minmax(0,1fr)} .review blockquote{font-size:18px} }
