/* MOVE — mobile first. No framework, remote fonts or animation dependencies. */
:root { --ink:#002f2a; --muted:#506760; --mint:#dff8f1; --coral:#ff9a7d; --white:#fff; --soft:#f6f9f8; --line:#dce5e1; --radius:20px; --container:1160px; }
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:100px; -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--white); color:var(--ink); font:400 16px/1.65 ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; }
button,input { font:inherit; color:inherit; }
a { color:inherit; text-decoration:none; }
button,summary { cursor:pointer; }
img { display:block; max-width:100%; height:auto; }
h1,h2,h3,p,figure { margin:0; }
h1,h2,h3 { letter-spacing:-.025em; font-weight:750; overflow-wrap:break-word; }
h1 { font-size:clamp(2rem,8vw,3rem); line-height:1.18; }
h2 { font-size:clamp(1.6rem,5.6vw,2.15rem); line-height:1.25; }
h3 { font-size:1.1rem; line-height:1.4; }
p { overflow-wrap:break-word; }
:focus-visible { outline:3px solid #227966; outline-offset:4px; }
.container { width:min(calc(100% - 40px),var(--container)); margin-inline:auto; }
.section { padding:52px 0; }
.section--soft { background:var(--soft); }
.section--mint { background:#f1faf6; }
/* White stays dominant; green is used for text and small accents. */
.section--dark { background:white; }
.eyebrow { margin-bottom:12px; color:#376c5b; font-size:.7rem; font-weight:750; text-transform:uppercase; letter-spacing:.12em; }
.section-heading { max-width:680px; margin-bottom:28px; }
.section-heading h2 + p { margin-top:16px; color:var(--muted); }
.section-heading--split > div > p { margin-top:16px; color:var(--muted); }
.skip-link { position:fixed; top:-100px; left:12px; z-index:200; background:var(--mint); padding:12px; }
.skip-link:focus { top:12px; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.announcement { padding:8px 16px; text-align:center; font-size:.7rem; background:var(--ink); color:white; }
.announcement strong { font-weight:500; margin-left:4px; }
/* Sticky navigation: overlay has its own opaque surface and scroll area. */
.site-header { position:sticky; top:0; z-index:100; background:#fff; border-bottom:1px solid var(--line); }
.nav-wrap { min-height:76px; display:flex; align-items:center; gap:20px; }
.logo { width:128px; flex:0 0 128px; margin-right:auto; }
.logo img { width:100%; height:auto; }
.menu-toggle { display:block; width:46px; height:46px; border:1px solid var(--line); border-radius:50%; padding:11px; background:#fff; }
.menu-toggle span:not(.sr-only) { display:block; height:2px; background:var(--ink); margin:5px 0; }
.primary-nav { display:none; position:absolute; top:100%; left:0; right:0; padding:12px 20px 24px; background:white; border-bottom:1px solid var(--line); max-height:calc(100dvh - 116px); overflow-y:auto; box-shadow:0 20px 25px #002f2a0a; }
.primary-nav.open { display:grid; }
.primary-nav a { min-height:46px; padding:12px 0; font-size:.9rem; font-weight:600; border-bottom:1px solid var(--line); }
.nav-cta { display:none !important; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:48px; max-width:100%; border:1px solid transparent; border-radius:99px; padding:13px 22px; font-size:.875rem; font-weight:750; text-align:center; line-height:1.4; background:#ffdf6f; color:var(--ink); transition:background .18s,transform .18s,box-shadow .18s; }
.button:hover { background:#ffe991; }
.button--outline { background:white; border-color:#8aa59a; }
.button--outline:hover { background:var(--mint); }
.button--dark { background:var(--ink); color:white; }
.button--dark:hover { background:#15554a; }
.button:disabled { opacity:.65; cursor:wait; }
.text-link { padding:10px 0; border:0; background:transparent; text-decoration:underline; text-underline-offset:4px; font-size:.875rem; font-weight:650; }
.hero { padding-top:32px; }
.hero__grid { display:grid; gap:32px; }
.hero h1 strong { display:block; margin-top:.15em; font-weight:750; color:#327564; }
.hero__lead { color:var(--muted); margin-top:20px; max-width:560px; }
.actions { display:flex; flex-wrap:wrap; gap:16px; margin-top:24px; }
.stats { display:flex; gap:30px; margin-top:28px; }
.stats strong { display:block; font-size:1.3rem; line-height:1.3; }
.stats span { display:block; font-size:.75rem; margin-top:4px; color:var(--muted); }
.hero__visual { position:relative; overflow:hidden; border-radius:24px; background:var(--mint); }
.hero__visual > img { width:100%; aspect-ratio:1.3; object-fit:cover; }
.hero__price-badge { position:absolute; left:20px; bottom:20px; background:white; border-radius:14px; padding:12px 18px; }
.hero__price-badge span { display:block; font-size:.7rem; }
.hero__price-badge strong { display:block; font-size:1.8rem; line-height:1.2; }
/* Compact benefit rows instead of oversized coloured cards. */
.benefit-list { display:grid; gap:0 36px; }
.feature-card { display:grid; grid-template-columns:30px minmax(0,1fr); column-gap:14px; padding:22px 0; border-top:1px solid var(--line); }
.feature-card__number { color:#377766; font-size:.75rem; padding-top:3px; }
.feature-card p { grid-column:2; color:var(--muted); font-size:.9rem; margin-top:8px; }
.section-cta { margin-top:28px; display:flex; flex-wrap:wrap; align-items:center; gap:16px 24px; }
.section-cta p { color:var(--muted); font-size:.875rem; max-width:480px; }
.service-area__grid { display:grid; gap:20px; }
.service-area__content p { color:var(--muted); }
.area-links { display:flex; flex-wrap:wrap; gap:12px 24px; margin-top:20px; }
.area-links a { font-weight:650; font-size:.9rem; text-decoration:underline; text-underline-offset:5px; }
.service-area__action { margin-top:22px; }
.step-list { list-style:none; margin:0; padding:0; }
.step-list li { display:grid; grid-template-columns:38px minmax(0,1fr); gap:4px 16px; padding:18px 0; border-top:1px solid var(--line); }
.step-list li > span { width:32px; height:32px; display:grid; place-items:center; background:var(--ink); color:white; border-radius:50%; font-size:.75rem; grid-row:span 2; }
.step-list p { font-weight:700; line-height:1.4; }
.step-list small { grid-column:2; color:var(--muted); font-size:.875rem; }
.pricing-grid { display:grid; gap:16px; }
.price-card { min-width:0; padding:24px; background:white; border:1px solid var(--line); border-radius:var(--radius); display:flex; flex-direction:column; }
.price-card--featured { background:var(--mint); border-color:#8bcebb; }
.price-card__label { font-size:.8rem; font-weight:700; margin-bottom:16px; }
.price-card h3 { font-size:2.4rem; line-height:1.2; margin-bottom:18px; white-space:nowrap; letter-spacing:-.03em; }
.price-card h3 span { font-size:.65em; margin-right:3px; }
.price-card > p:not([class]) { font-size:.875rem; color:var(--muted); }
.price-card ul { list-style:none; padding:18px 0; margin:18px 0; border-top:1px solid #002f2a20; font-size:.8rem; }
.price-card li { padding:5px 0; }
.price-card li::before { content:'✓'; margin-right:8px; }
.price-card .button { margin-top:auto; padding-inline:14px; }
.pricing-note { color:var(--muted); font-size:.75rem; margin:22px auto 0; max-width:820px; }
.reviews { border-bottom:1px solid var(--line); }
.reviews__intro { color:var(--muted); max-width:580px; }
.reviews__actions { margin-top:20px; }
.faq .container { max-width:860px; }
.faq-item { border-bottom:1px solid var(--line); }
.faq-item:first-child { border-top:1px solid var(--line); }
.faq-item summary { display:flex; align-items:center; justify-content:space-between; gap:18px; list-style:none; padding:18px 0; font-weight:650; font-size:.95rem; line-height:1.5; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item__icon { flex:0 0 24px; text-align:center; }
.faq-item__icon::after { content:'+'; font-size:1.4rem; font-weight:400; }
.faq-item[open] .faq-item__icon::after { content:'−'; }
.faq-item__answer { padding:0 38px 20px 0; font-size:.9rem; color:var(--muted); }
.brand-banner { background:var(--mint); padding:40px 20px; text-align:center; }
.brand-banner__mark { display:none; }
.brand-banner h2 { font-size:clamp(1.9rem,6.5vw,3.2rem); line-height:1.2; }
.brand-banner h2 span { color:#327564; }
.brand-banner .button { margin-top:22px; }
.locator { background:white; }
.locator__grid { display:grid; gap:28px; }
.locator h2 { margin-bottom:18px; }
.locator__grid > div > p:not(.eyebrow) { color:var(--muted); }
.signup-benefits { list-style:none; padding:0; margin:22px 0 0; font-size:.875rem; }
.signup-benefits li { padding:6px 0; }
.signup-benefits li::before { content:'✓'; color:#327564; margin-right:10px; }
.signup-card { min-width:0; padding:24px 20px; border:1px solid var(--line); border-radius:var(--radius); background:var(--soft); }
.form-grid { display:grid; gap:18px; }
.form-field { min-width:0; }
.form-field label { display:block; font-size:.875rem; font-weight:650; margin-bottom:7px; }
.form-field input:not([type='checkbox']) { width:100%; min-width:0; min-height:50px; padding:12px; border:1px solid #90a79e; border-radius:10px; background:white; font-size:16px; }
.form-field input:focus { outline:3px solid #86e8d070; border-color:var(--ink); }
.form-field input[aria-invalid='true'] { border-color:#a42525; }
::placeholder { color:#657b70; opacity:1; }
.consent-field { display:flex; align-items:flex-start; gap:10px; font-size:.75rem; }
.consent-field input { width:20px; height:20px; flex:0 0 20px; accent-color:var(--ink); }
.consent-field a { text-decoration:underline; }
.submit-button { width:100%; margin-top:22px; }
.form-result:not(:empty) { margin-top:16px; font-size:.875rem; }
.honeypot { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.contact-strip { border-top:1px solid var(--line); padding:30px 0; }
.contact-strip__grid { display:grid; gap:24px; }
.contact-strip__item h2 { font-size:.85rem; margin-bottom:6px; }
.contact-strip__item > a,.contact-strip__item > span,.contact-strip__item > p { display:block; font-size:.875rem; overflow-wrap:anywhere; }
.contact-strip__item .button { margin-top:12px; }
.footer { padding:36px 0 100px; background:var(--soft); }
.footer__grid { display:grid; gap:26px; }
.footer__brand img { width:150px; height:auto; margin-bottom:16px; }
.footer__grid h3 { font-size:.85rem; margin-bottom:10px; }
.footer__grid p,.footer__grid a,.footer__grid > div > span { font-size:.8rem; }
.footer__grid > div > a { display:block; padding:6px 0; overflow-wrap:anywhere; }
.footer__grid p { margin-top:8px; color:var(--muted); }
.social-links { margin-top:12px; display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.social-links .button { min-height:44px; font-size:.75rem; padding:8px 12px; }
.footer__bottom { border-top:1px solid var(--line); margin-top:28px; padding-top:20px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; font-size:.7rem; }
.sticky-cta { position:fixed; z-index:80; bottom:max(12px,env(safe-area-inset-bottom)); left:20px; right:20px; background:#0f7167; color:white; padding:14px 20px; border-radius:99px; display:flex; justify-content:space-between; align-items:center; font-size:.875rem; font-weight:700; box-shadow:0 8px 24px #002f2a25; transition:background .18s,transform .18s,box-shadow .18s; }
.sticky-cta:hover { background:#0c6259; box-shadow:0 10px 28px #002f2a32; }
.sticky-cta[hidden] { display:none; }
dialog { width:min(440px,calc(100% - 32px)); padding:28px; border:0; border-radius:20px; color:var(--ink); }
dialog::backdrop { background:#002f2a80; }
dialog p { margin:16px 0; }
dialog form { margin-top:16px; }
/* Shared confirmation, privacy and error pages. */
.utility { max-width:720px; padding-block:64px; }
.utility > img { width:150px; margin-bottom:48px; }
.utility h1 { font-size:clamp(2rem,6vw,3rem); }
.utility h2 { font-size:1.2rem; margin:26px 0 10px; }
.utility p { margin-top:18px; color:var(--muted); }
.utility .button { margin:24px 12px 0 0; }
.status-icon { display:grid; place-items:center; width:56px; height:56px; border-radius:50%; background:var(--mint); font-size:1.5rem; margin-bottom:24px; }
@media (min-width:40rem) {
  .container { width:min(calc(100% - 64px),var(--container)); }
  .section { padding:68px 0; }
  .benefit-list,.pricing-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .contact-strip__grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .footer__grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .signup-card { padding:32px; }
}
@media (min-width:68rem) {
  .section { padding:84px 0; }
  h1 { font-size:clamp(2.8rem,4.4vw,3.8rem); }
  h2 { font-size:2.4rem; }
  .nav-wrap { min-height:88px; }
  .menu-toggle { display:none; }
  .primary-nav,.primary-nav.open { display:flex; position:static; padding:0; box-shadow:none; border:0; gap:20px; overflow:visible; }
  .primary-nav a { border:0; font-size:.8rem; }
  .nav-cta { display:inline-flex !important; font-size:.8rem; padding-inline:18px; }
  .hero__grid { grid-template-columns:1.05fr 1fr; align-items:center; gap:64px; }
  .hero__visual > img { aspect-ratio:1.05; }
  .service-area__grid,.locator__grid { grid-template-columns:1fr 1.15fr; gap:72px; }
  .section-heading--split { display:grid; grid-template-columns:1fr 2fr; gap:40px; max-width:none; }
  .pricing-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .price-card { padding:24px 20px; }
  .price-card h3 { font-size:2.6rem; }
  .step-list li { grid-template-columns:48px 1fr 1.3fr; align-items:center; gap:20px; }
  .step-list li > span { grid-row:auto; }
  .step-list small { grid-column:auto; }
  .brand-banner { padding:64px 32px; }
  .footer { padding-bottom:32px; }
  .footer__grid { grid-template-columns:1.3fr 1fr 1fr 1.2fr; }
  .sticky-cta { left:auto; right:24px; bottom:24px; gap:32px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none !important; } }

/* Trial reassurance and package quote: wrap naturally on small screens. */
.hero__reassurance { margin: 16px 0 0; font-size: .875rem; line-height: 1.6; }
.package-quote { margin: 0 0 20px; font-size: 1.25rem; line-height: 1.4; }

.sticky-whatsapp {
  flex: 0 0 54px;
  width: 54px;
  height: 54px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  overflow: hidden;
  background: transparent;
  cursor: pointer;
}

.sticky-whatsapp img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;

  /* Zoomt echt in op de afbeelding */
  transform: scale(1.65);
}

.brand-banner {
  position: relative;
  overflow: hidden;
}

.brand-banner::before {
  content: "";
  position: absolute;
  inset: 0;

  background-image: url('../images/move-cars-bg.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  opacity: 0.30;
  pointer-events: none;
}

.brand-banner > * {
  position: relative;
  z-index: 1;
}

.footer {
  position: relative;
  overflow: hidden;
}

.footer::before {
  content: "";
  position: absolute;
  inset: 0;

  background-image: url('../images/move-cars-bg.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  opacity: 0.22;
  pointer-events: none;
}

.footer > * {
  position: relative;
  z-index: 1;
}