/* Dienstpagina v2 (redactionele opbouw). Scope: main.sv2 en body.sv2-page. Zie inc/service-v2.php. */
.sv2{--sv2-cyan:var(--primary-cyan,#00D9FF);--sv2-bg:var(--dark-bg,#0A0E27);--sv2-card:var(--card-bg,#12172E);--sv2-ink:#E6ECF5;--sv2-gray:var(--text-gray,#A0AEC0);--sv2-line:rgba(0,217,255,.14);--sv2-hair:rgba(160,174,192,.16);--sv2-r-s:6px;--sv2-r-m:10px;--sv2-r-l:16px;--sv2-shadow:0 30px 70px rgba(5,8,23,.65);
  position:relative;display:block;color:#fff;font-size:1.02rem;line-height:1.65;
  background:radial-gradient(1000px 640px at 8% 0%,rgba(0,217,255,.13),transparent 62%) no-repeat}
.sv2::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.055;background-size:160px 160px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
.sv2 h1,.sv2 h2{font-family:'Orbitron',sans-serif;font-weight:700;line-height:1.1;letter-spacing:-.005em;text-wrap:balance;margin:0}
.sv2 h3{font-family:'Outfit',sans-serif;font-weight:600;line-height:1.3;margin:0}
.sv2 p{margin:0;text-wrap:pretty}
.sv2 ul,.sv2 ol,.sv2 dl{list-style:none;margin:0;padding:0}
.sv2 dd{margin:0}
.sv2 img{max-width:100%;height:auto;display:block}
.sv2 a{color:inherit;text-decoration:none}
.sv2 figure{margin:0}
.sv2 :focus-visible{outline:2px solid var(--sv2-cyan);outline-offset:3px;border-radius:2px}
.sv2-wrap{max-width:1200px;margin:0 auto;padding-inline:1.5rem}
.sv2-tag{font-family:'Orbitron',sans-serif;font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--sv2-cyan);font-weight:500;margin-bottom:.9rem}
.sv2-lead{color:var(--sv2-gray);font-size:1.08rem;max-width:58ch}
.sv2-link{color:var(--sv2-cyan);text-decoration:underline;text-decoration-color:rgba(0,217,255,.35);text-underline-offset:.22em;transition:text-decoration-color .2s}
.sv2-link:hover{text-decoration-color:var(--sv2-cyan)}

/* knoppen: thema-stijl (.btn-primary uit style.css), WhatsApp identiek aan de dienstpagina-CTA */
.sv2 .btn-primary,.sv2 .btn-whatsapp{display:inline-flex;align-items:center;gap:.6rem;font-family:'Outfit',sans-serif}
.sv2 .btn-whatsapp{background:#25D366;color:#fff;padding:1rem 2.5rem;border-radius:50px;font-weight:600;font-size:1.1rem;transition:all .3s ease;box-shadow:0 4px 20px rgba(37,211,102,.4)}
.sv2 .btn-whatsapp:hover{transform:translateY(-3px);box-shadow:0 8px 30px rgba(37,211,102,.6)}
.sv2 .btn-primary:active,.sv2 .btn-whatsapp:active{transform:translateY(0) scale(.98)}

.sv2-crumb{font-size:.85rem;color:var(--sv2-gray);padding:1.4rem 0 0;display:flex;gap:.6rem;flex-wrap:wrap}
.sv2-crumb a:hover{color:#fff}.sv2-crumb i{font-style:normal;opacity:.5}.sv2-crumb b{font-weight:500;color:var(--sv2-ink)}

/* hero: uitbrekend raster, foto tot de rechterrand */
.sv2 section.sv2-hero{display:grid;grid-template-columns:minmax(1.5rem,1fr) minmax(0,640px) minmax(0,560px) minmax(1.5rem,1fr);align-items:stretch;padding-block:1.5rem 5.5rem}
.sv2-hero-copy{grid-column:2;grid-row:1;padding:2.5rem 3.5rem 3rem 0;align-self:center}
.sv2-hero h1{font-size:clamp(1.9rem,2.95vw,2.625rem);margin:.2rem 0 1.2rem}.sv2-hero h1 em{font-style:normal;color:var(--sv2-cyan)}
.sv2-hero .sv2-lead{font-size:1.12rem;max-width:56ch}
.sv2-hero-cta{display:flex;gap:1rem;margin:1.9rem 0 1.7rem;flex-wrap:wrap}
.sv2-trust{display:flex;gap:1rem;align-items:center;font-size:.85rem;color:var(--sv2-gray);flex-wrap:wrap}.sv2-trust b{color:var(--sv2-cyan);letter-spacing:.1em}.sv2-trust i{font-style:normal;opacity:.4}
.sv2-hero-fig{grid-column:3/5;grid-row:1;position:relative;height:clamp(480px,42vw,620px)}
.sv2-hero-fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 58%;border-radius:var(--sv2-r-m) 0 0 var(--sv2-r-m);box-shadow:var(--sv2-shadow)}
.sv2-chip{position:absolute;left:0;bottom:2.2rem;transform:translateX(-42%);background:rgba(5,8,23,.9);backdrop-filter:blur(8px);border:1px solid var(--sv2-line);border-radius:var(--sv2-r-s);padding:.85rem 1.15rem;box-shadow:0 18px 40px rgba(5,8,23,.6)}
.sv2-chip b{font-family:'Orbitron',sans-serif;color:var(--sv2-cyan);display:block;font-size:1.3rem;line-height:1;font-variant-numeric:tabular-nums}
.sv2-chip small{color:var(--sv2-gray);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase}
.sv2-spec{grid-column:2/4;grid-row:2;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--sv2-hair);border-bottom:1px solid var(--sv2-hair);margin-top:2.5rem}
.sv2-spec div{padding:1.15rem 1.4rem;border-left:1px solid var(--sv2-hair)}.sv2-spec div:first-child{border-left:0;padding-left:0}
.sv2-spec dt{font-family:'Orbitron',sans-serif;font-size:.88rem;font-weight:700;font-variant-numeric:tabular-nums}.sv2-spec dd{color:var(--sv2-gray);font-size:.86rem;margin-top:.15rem}

/* secties */
.sv2 section{padding-block:5rem 5.5rem}
.sv2 #werk{padding-bottom:3.5rem}.sv2 #voor-wie{padding-block:3.25rem 3.5rem}.sv2 #voor-wie .sv2-sec-head{margin-bottom:1.6rem}.sv2 #review{padding-top:3.5rem}
.sv2-sec-head{max-width:720px;margin-bottom:2.6rem}.sv2-sec-head h2{font-size:clamp(1.5rem,2.6vw,2.15rem);margin-bottom:.8rem}

/* waarom: plakkende intro + punten met korte cyaan streep */
.sv2-why{display:grid;grid-template-columns:5fr 7fr;gap:4rem;align-items:start}
.sv2-why-intro{position:sticky;top:130px}.sv2-why-intro h2{font-size:clamp(1.5rem,2.6vw,2.15rem);margin-bottom:1rem}
.sv2-points li{padding:1.7rem 0 1.9rem;border-top:1px solid var(--sv2-hair)}.sv2-points li:last-child{border-bottom:1px solid var(--sv2-hair)}
.sv2-points li::before{content:"";display:block;width:2rem;height:2px;background:var(--sv2-cyan);margin-bottom:1rem}
.sv2-points h3{font-size:1.2rem;margin-bottom:.4rem}.sv2-points p{color:var(--sv2-gray);max-width:54ch}

/* pakket: twee open lijsten, tip gecentreerd */
.sv2-lists{display:grid;grid-template-columns:1fr 1fr;gap:3rem 4.5rem}
.sv2-list h3{font-family:'Orbitron',sans-serif;font-size:.82rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--sv2-cyan);padding-bottom:.8rem;border-bottom:1px solid var(--sv2-line)}
.sv2-list li{padding:.8rem 0 .8rem 1.9rem;position:relative;border-bottom:1px solid var(--sv2-hair);color:var(--sv2-ink)}
.sv2-list li::before{content:"";position:absolute;left:.1rem;top:1.15rem;width:.7rem;height:.35rem;border-left:2px solid var(--sv2-cyan);border-bottom:2px solid var(--sv2-cyan);transform:rotate(-45deg)}
.sv2-note{margin:3rem auto 0;max-width:62ch;text-align:center;color:var(--sv2-ink)}
.sv2-note::before{content:"";display:block;width:2rem;height:2px;background:var(--sv2-cyan);margin:0 auto 1rem}
.sv2-note a{color:var(--sv2-cyan);text-decoration:underline;text-decoration-color:rgba(0,217,255,.35);text-underline-offset:.22em}.sv2-note a:hover{text-decoration-color:var(--sv2-cyan)}

/* werkwijze: iets lichtere band uit hetzelfde palet, verticale tijdlijn */
.sv2-band{background:var(--sv2-bg);border-top:1px solid var(--sv2-hair);border-bottom:1px solid var(--sv2-hair)}
.sv2-band .sv2-wrap{display:grid;grid-template-columns:4fr 8fr;gap:4rem;align-items:start}
.sv2-band .sv2-sec-head{margin-bottom:0}
.sv2-timeline{position:relative;padding-left:2.2rem}
.sv2-timeline::before{content:"";position:absolute;left:0;top:.6rem;bottom:.6rem;width:1px;background:linear-gradient(180deg,var(--sv2-cyan),rgba(0,217,255,.08))}
.sv2-timeline li{position:relative;display:grid;grid-template-columns:5.5rem 1fr;gap:1.2rem;padding:0 0 2.6rem}
.sv2-timeline li:last-child{padding-bottom:0}
.sv2-timeline li::before{content:"";position:absolute;left:-2.2rem;top:.7rem;width:9px;height:9px;margin-left:-4px;border-radius:50%;background:var(--sv2-cyan);box-shadow:0 0 0 4px rgba(0,217,255,.15)}
.sv2-tn{font-family:'Orbitron',sans-serif;font-size:2.6rem;font-weight:700;line-height:1;color:transparent;-webkit-text-stroke:1px rgba(0,217,255,.75);font-variant-numeric:tabular-nums;padding-top:.15rem}
.sv2-timeline h3{font-size:1.15rem;margin-bottom:.35rem}.sv2-timeline p{color:var(--sv2-gray);max-width:52ch}

/* foto's: ongelijke collage, grote foto absoluut in zijn vak */
.sv2-collage{display:grid;grid-template-columns:7fr 5fr;grid-template-rows:auto auto;gap:1.1rem}
.sv2-collage figure{display:flex;flex-direction:column;gap:.6rem}
.sv2-collage figure:first-child{grid-row:1/3;position:relative;min-height:320px}
.sv2-collage img{width:100%;height:auto;object-fit:cover;border-radius:var(--sv2-r-s);aspect-ratio:16/10}
.sv2-collage figure:first-child img{position:absolute;left:0;top:0;height:calc(100% - 1.9rem);aspect-ratio:auto}
.sv2-collage figure:first-child figcaption{position:absolute;left:0;bottom:0}
.sv2-collage figcaption{font-size:.82rem;color:var(--sv2-gray);letter-spacing:.02em}

/* voor wie: kolommen met hairlines, eerste breder */
.sv2-aud{display:grid;grid-template-columns:1.3fr 1fr 1fr}
.sv2-aud>div{padding:0 2.2rem;border-left:1px solid var(--sv2-hair)}.sv2-aud>div:first-child{padding-left:0;border-left:0}.sv2-aud>div:last-child{padding-right:0}
.sv2-aud h3{font-size:1.2rem;margin-bottom:.6rem}.sv2-aud p{color:var(--sv2-gray)}

/* review: één groot citaat */
.sv2-quote{position:relative;overflow:hidden;margin:0;background:var(--sv2-card);border-radius:var(--sv2-r-l);padding:3rem 3rem 2.6rem 6rem;box-shadow:var(--sv2-shadow)}
.sv2-quote::before{content:"";position:absolute;left:-8%;bottom:-45%;width:460px;height:460px;background:radial-gradient(circle,rgba(0,217,255,.14),transparent 65%);pointer-events:none}
.sv2-mark{position:absolute;left:2rem;top:1.9rem;font-family:'Orbitron',sans-serif;font-size:5.5rem;line-height:.6;color:var(--sv2-cyan)}
.sv2-quote p{font-size:clamp(1.15rem,1.8vw,1.42rem);font-weight:300;color:var(--sv2-ink);line-height:1.5;max-width:40ch}
.sv2-quote footer{margin-top:1.4rem;color:var(--sv2-gray);font-size:.92rem;display:flex;gap:1rem;align-items:center;background:none;padding:0}.sv2-stars{color:var(--sv2-cyan);letter-spacing:.12em}

/* faq: open lijst, vraag links, antwoord rechts */
.sv2-faq>div{display:grid;grid-template-columns:5fr 7fr;gap:2.5rem;padding:1.6rem 0;border-top:1px solid var(--sv2-hair)}
.sv2-faq>div:last-child{border-bottom:1px solid var(--sv2-hair)}
.sv2-faq dt{font-weight:600;font-size:1.08rem;text-wrap:balance}.sv2-faq dd{color:var(--sv2-gray);max-width:62ch}

/* cta: tekst links, knoppen rechts */
.sv2-cta-band{display:grid;grid-template-columns:1.2fr 1fr;gap:2.5rem;align-items:center;padding:3rem 3.2rem;border-radius:var(--sv2-r-l);border:1px solid var(--sv2-line);background:linear-gradient(120deg,rgba(0,217,255,.10),rgba(0,217,255,.02) 55%),var(--sv2-card)}
.sv2-cta-band h2{font-size:clamp(1.4rem,2.4vw,1.9rem);margin-bottom:.6rem}.sv2-cta-band p{color:var(--sv2-gray)}
.sv2-cta-actions{display:flex;flex-wrap:wrap;gap:.9rem;justify-content:flex-end;align-items:center}
.sv2-tel{flex-basis:100%;text-align:right;color:var(--sv2-gray);font-size:.95rem;transition:color .2s}.sv2-tel:hover{color:#fff}
.sv2-also{margin-top:2.2rem;color:var(--sv2-gray)}.sv2-also>span{font-family:'Orbitron',sans-serif;font-size:.68rem;letter-spacing:.25em;text-transform:uppercase;color:var(--sv2-cyan);margin-right:.9rem}.sv2-also i{font-style:normal;opacity:.5;margin:0 .5rem}

/* binnenkomen: alleen de hero */
@keyframes sv2-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.sv2-hero-copy>*{animation:sv2-rise .6s cubic-bezier(.2,.7,.2,1) both}
.sv2-hero-copy>*:nth-child(2){animation-delay:.06s}.sv2-hero-copy>*:nth-child(3){animation-delay:.12s}.sv2-hero-copy>*:nth-child(4){animation-delay:.18s}.sv2-hero-copy>*:nth-child(5){animation-delay:.24s}
.sv2-hero-fig{animation:sv2-rise .8s .15s cubic-bezier(.2,.7,.2,1) both}
@media (prefers-reduced-motion:reduce){.sv2 *{animation:none!important;transition:none!important}}

/* vaste contactbalk op telefoons (vervangt daar de zwevende WhatsApp-knop) */
.sv2-mbar{display:none}
@media (max-width:960px){
  .sv2 section.sv2-hero{grid-template-columns:1.5rem 1fr 1.5rem;padding-block:.5rem 3rem}
  .sv2-hero-copy{grid-column:2;grid-row:1;padding:1.5rem 0 2rem}
  .sv2-hero-fig{grid-column:1/4;grid-row:2;height:auto;aspect-ratio:4/5}
  .sv2-hero-fig img{border-radius:0}.sv2-chip{left:1.5rem;transform:none}
  .sv2-spec{grid-column:2;grid-row:3;grid-template-columns:1fr 1fr;margin-top:2rem}
  .sv2-spec div:nth-child(odd){border-left:0;padding-left:0}.sv2-spec div:nth-child(n+3){border-top:1px solid var(--sv2-hair)}
  .sv2 section{padding-block:3.5rem 4rem}
  .sv2-why,.sv2-band .sv2-wrap,.sv2-lists,.sv2-aud,.sv2-faq>div,.sv2-cta-band,.sv2-collage{grid-template-columns:1fr}
  .sv2-why-intro{position:static}
  .sv2-band .sv2-wrap{gap:2rem}.sv2-band .sv2-sec-head{margin-bottom:.5rem}
  .sv2-collage figure:first-child{grid-row:auto;min-height:0}.sv2-collage figure:first-child img{position:static;aspect-ratio:4/3;height:auto}.sv2-collage figure:first-child figcaption{position:static}
  .sv2-aud{gap:2rem}.sv2-aud>div{padding:2rem 0 0;border-left:0;border-top:1px solid var(--sv2-hair)}.sv2-aud>div:first-child{padding-top:0;border-top:0}
  .sv2-quote{padding:2.2rem 1.6rem 2rem}.sv2-mark{position:static;display:block;margin-bottom:.4rem;font-size:4rem;line-height:.8}
  .sv2-timeline{padding-left:1.6rem}.sv2-timeline li{grid-template-columns:3.2rem 1fr;gap:.9rem;padding-bottom:2.2rem}.sv2-timeline li::before{left:-1.6rem}.sv2-tn{font-size:2rem}
  .sv2-faq>div{gap:.5rem}
  .sv2-also>span{display:block;margin-bottom:.4rem}
  .sv2-cta-band{padding:2rem 1.6rem}.sv2-cta-actions{justify-content:flex-start}.sv2-tel{text-align:left}
  .sv2-mbar{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;position:fixed;left:0;right:0;bottom:0;z-index:1001;padding:.6rem .9rem calc(.6rem + env(safe-area-inset-bottom));background:rgba(5,8,23,.92);backdrop-filter:blur(12px);border-top:1px solid rgba(0,217,255,.14)}
  .sv2-mbar a{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.85rem 1rem;border-radius:50px;font-weight:600;font-size:.95rem;color:#fff;text-decoration:none}
  .sv2-m-wa{background:#25D366}.sv2-m-tel{border:1px solid #00D9FF}
  body.sv2-page{padding-bottom:5.4rem}
  body.sv2-page .whatsapp-float{display:none}
}
