/* syoh-bundel syoh.css=e6e85ff216e0161962471bec9c53474d syoh-nav.css=7f8c58cb5efd0c863ce33200de33db38 syoh-footer.css=3139d5dabba33099eee9f6a9d4c95ae8 syoh-motion.css=87cd0408eca8aa2a82db4c5409251334 */
/* GEGENEREERD door syoh_bundel_bouw() (data/inc-header.php) — NIET bewerken: wijzig de bronnen. */

/* ==== syoh.css ==== */
/* SellYourOwnHouse — ontwerpsysteem (SYOH-ONTWERP-20260930). Documentatie: ontwerp-systeem.md.
   Kleuren uit logo/syoh/final/brand.md. Amber (#F5A524) ALLEEN in de zon (logo, formulierblok).
   ANIMATIE-VAL: niets is standaard onzichtbaar; verbergen mag alleen onder html.js-anim:not(.anim-safe). */
@font-face{font-family:"Playfair";src:url(/assets/fonts/playfair-var.woff2) format("woff2");font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url(/assets/fonts/inter-var-latin.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
/* CLS: fallback met dezelfde maten als de webfont, zodat de swap de regels niet verschuift */
/* SNEL-A11Y-20261001 (#48): per gewicht een eigen fallback. Eén face voor alle gewichten gaf bij 600 (chips, knoppen, nav)
   tekst die ~2% smaller was dan Inter: "Ook op afstand" paste in de fallback nog op de eerste chiprij en sprong bij de
   font-swap naar een tweede rij (CLS 0,09–0,12 desktop op /nl/huis-verkopen-spanje/). Gemeten breedteverhouding
   Inter/fallback: 400 → 0,992 (ongewijzigd), 500 → 1,006, 600 → 1,019, 700 → 1,033 (synthetisch vet); nu ~1,00. */
@font-face{font-family:"Inter-fb";src:local("Arial"),local("Liberation Sans"),local("Helvetica");font-weight:100 449;size-adjust:106.6%;ascent-override:90.9%;descent-override:22.7%;line-gap-override:0%}
@font-face{font-family:"Inter-fb";src:local("Arial"),local("Liberation Sans"),local("Helvetica");font-weight:450 549;size-adjust:107.2%;ascent-override:90.9%;descent-override:22.7%;line-gap-override:0%}
@font-face{font-family:"Inter-fb";src:local("Arial Bold"),local("Arial-BoldMT"),local("Liberation Sans Bold"),local("LiberationSans-Bold"),local("Helvetica Bold"),local("Helvetica-Bold");font-weight:550 649;size-adjust:101.8%;ascent-override:90.9%;descent-override:22.7%;line-gap-override:0%}
@font-face{font-family:"Inter-fb";src:local("Arial Bold"),local("Arial-BoldMT"),local("Liberation Sans Bold"),local("LiberationSans-Bold"),local("Helvetica Bold"),local("Helvetica-Bold");font-weight:650 900;size-adjust:102.2%;ascent-override:90.9%;descent-override:22.7%;line-gap-override:0%}
@font-face{font-family:"Playfair-fb";src:local("Times New Roman"),local("Liberation Serif"),local("Times");size-adjust:112.6%;ascent-override:96.1%;descent-override:22.3%;line-gap-override:0%}
:root{
  --navy:#1B3A4B;--navy-2:#24495D;--terra:#CC4A22;--terra-h:#B43F1B;--terra-ink:#A83B18;--terra-form:#B8431E;
  --terra-lt:#FFA27D;--terra-lt2:#FF9466;--amber:#F5A524;
  --cream:#F6F1E8;--sand:#EFE6D6;--white:#FFFFFF;--dark:#0F172A;--ink:#1F2A33;--muted:#51606B;--line:#E6DCCB;--line-2:#D5CBBB;
  --serif:"Playfair","Playfair-fb",Georgia,"Times New Roman",serif;
  --sans:"Inter","Inter-fb",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --ease:cubic-bezier(.2,.7,.1,1);
  --gut:16px;--wrap:1200px;--sec:clamp(72px,10vw,140px);
  --r-card:20px;--r-img:16px;--sh-card:0 20px 40px -20px rgba(15,23,42,.25);
  --top-h:72px;--top-vis:72px
}
@media (min-width:768px){:root{--gut:32px}}
@media (min-width:1100px){:root{--gut:64px}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--top-vis) + 12px)}
/* SNEL-A11Y-20261001 (#24): zolang de vaste actiebalk onderin zichtbaar is (syoh.js zet html.cta-op + --cta-h) */
html.cta-op{scroll-padding-bottom:calc(var(--cta-h,76px) + 12px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--cream);color:var(--ink);font:400 1.0625rem/1.65 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg{max-width:100%}
img{height:auto;display:block}
a{color:var(--navy)}
h1,h2,h3{font-family:var(--serif);font-weight:500;color:var(--navy);letter-spacing:-.01em;margin:0}
h1{font-size:clamp(2.6rem,6vw,5.5rem);line-height:1.02}
h2{font-size:clamp(2rem,4vw,3.5rem);line-height:1.1}
h3{font-size:1.35rem;line-height:1.25}
p{margin:0 0 1em}
ul,ol{margin:0;padding:0;list-style:none}
.wrap{max-width:calc(var(--wrap) + 2 * var(--gut));margin:0 auto;padding:0 var(--gut)}
.label{font:600 .75rem/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--terra-ink);margin:0 0 18px}
.label-on-dark{color:#FFB08F}
.label-on-terra{color:#fff}
.sec-head{max-width:760px;margin:0 0 clamp(40px,5vw,64px)}
.sec-head h2{margin:0 0 20px}
.sec-intro{font-size:1.125rem;color:var(--muted);max-width:62ch}
:focus-visible{outline:3px solid var(--terra);outline-offset:3px;border-radius:4px}
.skip{position:fixed;left:12px;top:-80px;z-index:200;background:var(--navy);color:#fff;padding:12px 18px;border-radius:10px;text-decoration:none;font-weight:600}
.skip:focus{top:12px}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

/* ---------- knoppen & links ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;font:600 1rem/1.2 var(--sans);text-decoration:none;padding:14px 26px;border-radius:999px;border:1.5px solid transparent;cursor:pointer;transition:background-color .3s var(--ease),color .3s var(--ease),border-color .3s,transform .3s var(--ease),box-shadow .3s var(--ease)}
.btn .arr{display:inline-block;transition:transform .35s var(--ease)}
.btn:hover .arr{transform:translateX(5px)}
.btn-primary{background:var(--terra);color:#fff}
.btn-primary:hover{background:var(--terra-h);box-shadow:0 14px 28px -14px rgba(204,74,34,.9)}
.btn-ghost{color:#fff;border-color:rgba(255,255,255,.75)}
.btn-ghost:hover{background:#fff;color:var(--navy)}
.btn-light{background:#fff;color:var(--navy)}
.btn-light:hover{background:var(--cream)}
.btn-navy{background:var(--navy);color:#fff}
.btn-navy:hover{background:var(--navy-2)}
.btn-sm{min-height:44px;padding:10px 20px;font-size:.94rem}
.btn-block{width:100%}
.text-link{display:inline-flex;gap:8px;font:600 1rem/1.3 var(--sans);color:var(--navy);text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1.5px no-repeat;padding:4px 0;transition:background-size .4s var(--ease)}
.text-link:hover{background-size:0 1.5px;background-position:100% 100%}

/* ---------- kop ---------- */
.top{position:sticky;top:0;z-index:60;background:rgba(246,241,232,.92);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);color:var(--navy);transition:background-color .35s var(--ease),border-color .35s,color .3s,transform .4s var(--ease)}
.top-in{max-width:calc(1400px + 2 * var(--gut));margin:0 auto;padding:12px var(--gut);display:flex;align-items:center;gap:8px 28px}
.brand{display:block;line-height:0;flex:none;margin-right:auto;padding:4px 0}
.brand img{height:40px;width:auto}
.logo-dark-bg{display:none}
.top-nav{display:flex;align-items:center;gap:4px 26px}
.top-nav a,.top-lang{color:inherit;text-decoration:none;font:500 .95rem/1 var(--sans);min-height:44px;display:inline-flex;align-items:center;position:relative}
.top-nav a::after{content:"";position:absolute;left:0;right:0;bottom:10px;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .4s var(--ease)}
.top-nav a:hover::after{transform:scaleX(1);transform-origin:left}
.top-lang{gap:7px;padding:0 14px;border:1.5px solid currentColor;border-color:color-mix(in srgb,currentColor 35%,transparent);border-radius:999px;font-size:.9rem}
.top-lang svg{fill:none;stroke:currentColor;stroke-width:1.7}
.top-lang:hover{border-color:currentColor}
/* over de hero: transparant met wit logo; zonder JS absoluut (scrolt mee weg) */
.top.is-overlay{position:absolute;inset:0 0 auto;background:transparent;border-bottom-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;color:#fff}
.top.is-overlay .logo-dark-bg{display:block}
.top.is-overlay .logo-light-bg{display:none}
.js .top.is-overlay{position:fixed}
.js .top.is-overlay.solid{background:rgba(246,241,232,.92);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom-color:var(--line);color:var(--navy)}
.js .top.is-overlay.solid .logo-dark-bg{display:none}
.js .top.is-overlay.solid .logo-light-bg{display:block}
.js .top.hide{transform:translateY(-100%)}
@media (max-width:1099.98px){
  .top-in{flex-wrap:wrap;padding:8px var(--gut) 0;gap:0 12px}
  .top-nav{order:3;width:100%;gap:0 20px;margin:0 0 2px}
  .top-nav a{font-size:.95rem;min-height:44px}
}
@media (max-width:767.98px){
  .brand img{height:32px}
  .top-lang{min-height:40px;padding:0 12px;font-size:.88rem}
  .top-cta{display:none}
}
@media (max-width:399.98px){.brand img{height:30px}.top-lang{padding:0 10px;gap:5px}}
@media (max-width:359.98px){.brand img{height:32px;width:72px}}

/* ---------- hero ---------- */
.hero{position:relative;min-height:92svh;display:flex;flex-direction:column;justify-content:flex-end;color:#fff;overflow:hidden;background:var(--dark);isolation:isolate}
.hero-media{position:absolute;inset:0;z-index:-2;overflow:hidden}
.hero-img{position:absolute;inset:0;width:100%;height:112%;object-fit:cover;object-position:60% 50%;will-change:transform}
/* Scrim voor AA (gemeten op de lichtste pixel, zie rapport): donker vlak onder de tekstkolom dat pas
   ná de tekst uitloopt, zodat het huis en de zee rechts licht blijven. --tx = rechterrand tekstkolom. */
.hero{--tx:calc(max(var(--gut),(100vw - var(--wrap)) / 2) + min(700px,52vw) + 24px)}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:
  linear-gradient(90deg,rgba(15,23,42,.86) 0,rgba(15,23,42,.8) var(--tx),rgba(15,23,42,.4) calc(var(--tx) + 160px),rgba(15,23,42,.06) calc(var(--tx) + 420px)),
  linear-gradient(0deg,rgba(15,23,42,.6) 0%,rgba(15,23,42,0) 35%),
  linear-gradient(180deg,rgba(15,23,42,.55) 0%,rgba(15,23,42,0) 18%)}
.hero-in{position:relative;width:100%;padding-top:150px;padding-bottom:128px}
.hero-copy{max-width:min(700px,52vw)}
.hero h1{font-size:clamp(2.6rem,4.7vw,4.5rem)}
.hero h1{color:#fff;margin:0 0 28px;text-shadow:0 2px 28px rgba(15,23,42,.55)}
.hero h1 .ln{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.hero h1 .ln>span{display:inline-block;text-wrap:balance}
.hero-accent{color:var(--terra-lt)}
.hero .lead{font-size:1.125rem;line-height:1.65;color:#fff;max-width:min(58ch,640px);margin:0 0 34px;text-shadow:0 1px 14px rgba(15,23,42,.6)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px}
.hero-cards{display:none}
.fc{background:#fff;color:var(--navy);border-radius:18px;box-shadow:0 24px 48px -12px rgba(15,23,42,.45),0 0 24px rgba(15,23,42,.12);padding:16px 18px}
.fc-k{font:650 .72rem/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 10px}
.fc-docs li{display:flex;align-items:center;gap:10px;font-size:.95rem;font-weight:560;padding:4px 0}
.tick{flex:none;display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:var(--terra);transition:background-color .35s var(--ease),transform .35s var(--ease)}
.tick svg{width:15px;height:15px;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:22;stroke-dashoffset:0;transition:stroke-dashoffset .4s var(--ease) .1s}
html.js-anim .fc-docs.arm li:not(.ok) .tick{background:var(--sand);transform:scale(.9)}
html.js-anim .fc-docs.arm li:not(.ok) .tick svg{stroke-dashoffset:22}
.fc-chips{display:flex;flex-wrap:wrap;gap:6px}
.fc-chips span{padding:5px 11px;border-radius:999px;background:var(--cream);font-size:.84rem;font-weight:600;color:var(--navy)}
@media (min-width:1100px){
  .hero-in{display:grid;grid-template-columns:minmax(0,min(700px,52vw)) 1fr;align-items:end;gap:32px}
  .hero-cards{display:block;position:relative;justify-self:end;width:360px;height:292px;margin-bottom:0}
  .fc-docs{position:absolute;right:0;top:0;width:230px;transform:rotate(2deg)}
  .fc-port{position:absolute;left:0;top:152px;width:318px;transform:rotate(-2deg);z-index:1}
}
@media (max-width:1099.98px){
  .hero-copy{max-width:700px}
  .hero::before{background:linear-gradient(180deg,rgba(15,23,42,.42) 0,rgba(15,23,42,.6) 16%,rgba(15,23,42,.64) 62%,rgba(15,23,42,.38) 100%)} /* HERO-ZICHTBAAR-20261001: foto zee zichtbaar op mobiel */
  .hero-cards{display:block;margin-top:24px}
  .fc-docs{display:none}
  .fc-port{max-width:360px}
}
@media (max-width:767.98px){
  .hero{min-height:92svh}
  .hero-img{object-position:50% 40%}
  .hero-in{padding-top:136px;padding-bottom:104px}
  .hero .lead{font-size:1.0625rem}
  .hero-cta{flex-direction:column}
  .hero-cta .btn{width:100%}
  .fc-port{max-width:none}
}

/* ---------- waar staat je huis + propositie ---------- */
.belofte{background:var(--cream);padding:0 0 var(--sec)}
.finder{position:relative;z-index:3;margin:-48px 0 0;background:#fff;border-radius:20px;box-shadow:var(--sh-card),0 2px 6px rgba(15,23,42,.06);padding:18px 18px 18px}
.finder-l{font:650 .95rem/1.3 var(--sans);color:var(--navy);margin:0 0 12px 4px}
.finder-list{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
.finder-list a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:76px;padding:8px 6px;border-radius:14px;text-decoration:none;color:var(--navy);background:var(--cream);text-align:center;font:600 .9rem/1.2 var(--sans);transition:background-color .25s,box-shadow .25s,transform .3s var(--ease)}
.finder-list .fcode{display:grid;place-items:center;min-width:34px;height:24px;padding:0 6px;border-radius:7px;background:#fff;color:var(--terra-ink);font:700 .72rem/1 var(--sans);letter-spacing:.06em;transition:background-color .25s,color .25s}
.finder-list a:hover{background:#fff;box-shadow:inset 0 0 0 1.5px var(--navy);transform:translateY(-2px)}
.finder-list a:hover .fcode{background:var(--terra);color:#fff}
.belofte-in{text-align:center;padding-top:clamp(72px,9vw,120px)}
.quote{font-size:clamp(2.2rem,5.4vw,4.6rem);line-height:1.06;max-width:17ch;margin:0 auto 64px}
.quote em{font-style:normal;color:var(--terra)}
.facts{display:grid;grid-template-columns:repeat(4,1fr);margin:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.facts div{padding:30px 16px;border-left:1px solid var(--line)}
.facts div:first-child{border-left:0}
.facts dt{font:500 clamp(2rem,3.4vw,3rem)/1 var(--serif);color:var(--navy);margin:0 0 10px}
.facts dd{margin:0;color:var(--muted);font-size:.95rem}
.marquee{margin:clamp(56px,8vw,96px) 0 0;padding:26px 0 0;overflow:hidden;white-space:nowrap}
.marquee-track{display:inline-flex}
.marquee span{font:500 clamp(2.4rem,6vw,5.2rem)/1.1 var(--serif);color:transparent;-webkit-text-stroke:1.2px var(--navy);padding:0 .5em;position:relative}
.marquee span::after{content:"";position:absolute;right:-.12em;top:50%;width:.2em;height:.2em;margin-top:-.1em;border-radius:50%;background:var(--terra)}
/* SNEL-A11Y-20261001 (#51): pauzeknop van de landenband (gemaakt door syoh.js; niet bij reduced motion) */
.marquee-knop{display:flex;align-items:center;gap:8px;min-height:44px;margin:14px max(var(--gut),calc((100% - var(--wrap)) / 2)) 0 auto;padding:0 16px;border:1px solid var(--line-2);border-radius:999px;background:#fff;color:var(--navy);font:600 .85rem/1 var(--sans);cursor:pointer}
.marquee-knop:hover{border-color:var(--navy)}
.marquee-knop svg{width:14px;height:14px;fill:currentColor;flex:none}
@media (max-width:767.98px){
  .finder{padding:14px}
  .finder-list{grid-template-columns:1fr 1fr}
  .finder-list a{flex-direction:row;justify-content:flex-start;min-height:56px;padding:8px 10px;gap:10px;text-align:left}
  .facts{grid-template-columns:1fr 1fr}
  .facts div:nth-child(3){border-left:0}
  .facts div:nth-child(n+3){border-top:1px solid var(--line)}
}
@media (min-width:768px) and (max-width:1099.98px){.finder-list{grid-template-columns:repeat(4,1fr)}}

/* ---------- rekenhulp ---------- */
.prop{background:var(--sand);padding:var(--sec) 0}
.prop-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:start}
html:not(.js) .prop-grid{grid-template-columns:1fr}
.prop-copy h2{margin:0 0 16px}
.feat{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:36px}
.feat li{display:flex;flex-direction:column;gap:14px;padding:22px;border-radius:var(--r-card);background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.05),inset 0 0 0 1px var(--line);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.feat li:hover{transform:translateY(-3px);box-shadow:var(--sh-card),inset 0 0 0 1px var(--line)}
.feat h3{font:650 1.05rem/1.3 var(--sans);color:var(--navy);letter-spacing:0;margin:0 0 4px}
.feat p{font-size:.94rem;color:var(--muted);line-height:1.5;margin:0}
.feat-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--navy);color:#fff}
.feat-ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.calc{background:#fff;border-radius:24px;padding:clamp(22px,3vw,34px);box-shadow:var(--sh-card),inset 0 0 0 1px var(--line)}
.calc[hidden]{display:none}
.tag{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;background:#F9E3D8;color:var(--terra-ink);font:650 .8rem/1.3 var(--sans);margin-bottom:14px}
.tag svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2}
.calc-top h3{font-size:clamp(1.4rem,2.2vw,1.75rem);margin:0 0 8px}
.calc-top p{color:var(--muted);font-size:.96rem;margin:0 0 22px}
.calc-fields{display:grid;grid-template-columns:1.3fr 1fr;gap:14px}
.fld{min-width:0}
.fld label{display:block;font:600 .88rem/1.3 var(--sans);color:var(--navy);margin:0 0 7px}
.inp{display:flex;align-items:center;min-height:52px;border-radius:12px;background:#FBF9F5;box-shadow:inset 0 0 0 1.5px var(--line-2);transition:box-shadow .2s,background-color .2s}
.inp:focus-within{background:#fff;box-shadow:inset 0 0 0 2px var(--navy),0 0 0 4px rgba(27,58,75,.14)}
.inp input{flex:1;min-width:0;border:0;background:transparent;font:650 1.15rem/1.2 var(--sans);color:var(--ink);padding:14px;font-variant-numeric:tabular-nums;outline:0}
.inp input::placeholder{font-weight:450;font-size:1rem;color:#7A8790}
.inp .pre{padding-left:14px;margin-right:-8px;color:var(--muted);font-weight:600}
.inp .post{padding-right:14px;color:var(--muted);font-weight:600}
.switch{display:flex;align-items:center;gap:12px;margin:16px 0 0;font-size:.94rem;cursor:pointer;min-height:44px}
.switch{position:relative}
.switch input{position:absolute;left:0;top:50%;width:1px;height:1px;margin:0;clip-path:inset(50%);overflow:hidden}
.sw{position:relative;flex:none;width:42px;height:26px;border-radius:999px;background:#C9BFAF;transition:background-color .25s}
.sw::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .3s var(--ease)}
.switch input:checked+.sw{background:var(--navy)}
.switch input:checked+.sw::after{transform:translateX(16px)}
.switch input:focus-visible+.sw{outline:3px solid var(--terra);outline-offset:2px}
.fld-vat{margin-top:10px;max-width:260px}
.fld-vat[hidden]{display:none}
.calc-out{margin-top:20px;padding:22px;border-radius:16px;background:var(--navy);color:#fff;position:relative;overflow:hidden}
.calc-out::before{content:"";position:absolute;right:-60px;top:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(204,74,34,.45),transparent 70%)}
.calc-out>*{position:relative}
.out-label{font-size:.88rem;color:rgba(255,255,255,.85);font-weight:550;margin:0}
.out-num{font:700 clamp(2.1rem,4vw,2.9rem)/1.15 var(--sans);letter-spacing:-.03em;font-variant-numeric:tabular-nums;margin:4px 0 14px}
.bar{height:10px;border-radius:999px;background:rgba(255,255,255,.16);overflow:hidden}
.bar i{display:block;height:100%;width:0;border-radius:999px;background:var(--terra-lt2);transition:width .6s var(--ease)}
.bar-l{margin:6px 0 0;font-size:.78rem;color:rgba(255,255,255,.78)}
.out-hint{margin:12px 0 0;font-size:.9rem;color:rgba(255,255,255,.9)}
.calc-note{font-size:.84rem;color:var(--muted);margin:14px 0 18px;line-height:1.5}
@media (min-width:1100px){html:not(.js) .feat{grid-template-columns:repeat(4,1fr)}}
@media (min-width:900px) and (max-width:1099.98px){.feat{grid-template-columns:1fr}html:not(.js) .feat{grid-template-columns:1fr 1fr}}
@media (max-width:899.98px){
  .prop-grid{grid-template-columns:1fr}
  .prop-copy{display:contents}
  .prop-copy .label{order:1}.prop-copy h2{order:2}.prop-copy .sec-intro{order:3}.calc{order:4}.feat{order:5;margin-top:8px}
  .feat{grid-template-columns:1fr 1fr}
}
@media (max-width:559.98px){.feat{grid-template-columns:1fr}.calc-fields{grid-template-columns:1fr}.feat li{flex-direction:row;align-items:flex-start}.feat-ic{flex:none}}

/* ---------- hoe het werkt ---------- */
.how{padding:var(--sec) 0;background:var(--white)}
.how-in{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,6vw,96px);align-items:start}
.how-head{position:sticky;top:calc(var(--top-vis) + 40px);transition:top .4s var(--ease)}
.how-head h2{margin:0 0 28px}
.stepbar{display:none}
.step{display:grid;grid-template-columns:auto 1fr;gap:28px;padding:40px 0;border-top:1px solid var(--line);position:relative}
.step:last-child{border-bottom:1px solid var(--line)}
.step::after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--terra);transform:scaleX(1);transform-origin:left;transition:transform .7s var(--ease) .15s}
html.js .step:not(.in)::after{transform:scaleX(0)}
/* SNEL-A11Y-20261001 (#45): was rgba(204,74,34,.3) = 1,52:1; nu 3,78:1 op wit en 3,36:1 op crème (decoratief, aria-hidden, maar zichtbaar) */
.step-n{font:400 6rem/.8 var(--serif);color:#D65F38;min-width:1.3em;font-variant-numeric:lining-nums}
.step h3{font-size:clamp(1.4rem,2vw,1.8rem);margin:6px 0 12px}
.step p{color:var(--muted);margin:0;max-width:56ch}
@media (max-width:767.98px){
  .how-in{grid-template-columns:1fr;gap:0}
  .how-head{position:static}
  .how-head h2{margin-bottom:16px}
  .stepbar{display:block;position:sticky;top:var(--top-vis);z-index:20;margin:24px calc(-1 * var(--gut)) 16px;padding:10px var(--gut);background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);transition:top .4s var(--ease)}
  .stepbar ol{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
  .stepbar a{display:flex;align-items:center;gap:8px;min-height:44px;text-decoration:none;color:var(--muted);font:600 .82rem/1.2 var(--sans)}
  .stepbar .n{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--line-2);background:#fff;transition:background-color .3s,color .3s,box-shadow .3s}
  .stepbar a.on{color:var(--navy)}
  .stepbar a.on .n{background:var(--terra);color:#fff;box-shadow:0 0 0 4px rgba(204,74,34,.18)}
  .stepbar a.done .n{background:var(--navy);color:#fff;box-shadow:none}
  .steps{display:grid;gap:14px}
  .step{grid-template-columns:1fr;gap:4px;padding:24px 22px;border:1px solid var(--line);border-radius:var(--r-card);background:var(--cream);scroll-margin-top:calc(var(--top-vis) + 80px)}
  .step:last-child{border-bottom:1px solid var(--line)}
  .step::after{left:22px;right:22px;width:auto}
  .step-n{font-size:3.4rem}
}

/* ---------- landen + kaart ---------- */
.countries{padding:var(--sec) 0;background:var(--cream)}
.atlas{display:grid;grid-template-columns:7fr 5fr;background:#fff;border-radius:28px;overflow:hidden;box-shadow:0 40px 80px -40px rgba(27,58,75,.3)}
.atlas-map{margin:0;position:relative;background:#DCE6EA;padding:18px 18px 64px}
.map-box{position:relative}
.map-bg{width:100%;height:auto}
.map{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible}
.land path{fill:#E8C4B3;stroke:#fff;stroke-width:1.4;stroke-linejoin:round;transition:fill .3s var(--ease)}
.land:hover path,.land:focus-visible path,.land.on path{fill:var(--terra)}
.land:focus-visible{outline:none}
.land:focus-visible path{stroke:var(--navy);stroke-width:3}
.pin{pointer-events:none}
.pin-dot{fill:var(--navy);stroke:#fff;stroke-width:2}
.pin-pulse{fill:var(--terra);fill-opacity:0}
.pin.on .pin-dot{fill:#fff;stroke:var(--navy)}
.atlas-hint{position:absolute;left:24px;bottom:18px;font:600 .75rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--navy);background:rgba(255,255,255,.92);padding:9px 13px;border-radius:999px}
.atlas-panel{display:flex;flex-direction:column}
.panel-img{aspect-ratio:760/510;overflow:hidden;background:var(--navy)}
.panel-img img{width:100%;height:100%;object-fit:cover;transition:opacity .25s var(--ease),transform .9s var(--ease)}
.panel-img img.swap{opacity:.15;transform:scale(1.03)}
.panel-body{padding:clamp(24px,3vw,40px)}
.panel-body h3{font-size:clamp(2rem,3.2vw,2.8rem);margin:0 0 14px}
.panel-body p:not(.label){color:var(--muted);margin:0 0 22px}
.panel-body>*{transition:color .25s var(--ease)}
.country-grid{margin:clamp(28px,4vw,48px) 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.6vw,22px)}
.cc{position:relative;display:block;border-radius:var(--r-card);overflow:hidden;text-decoration:none;color:#fff;aspect-ratio:4/5;background:var(--navy);isolation:isolate}
.cc-img,.cc-img img{position:absolute;inset:0;width:100%;height:100%}
.cc-img img{object-fit:cover;transition:transform 1s var(--ease)}
.cc::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(15,23,42,.82) 0%,rgba(15,23,42,.1) 50%,rgba(15,23,42,0) 70%)}
.cc-name{position:absolute;left:20px;right:56px;bottom:18px;z-index:1;font:500 clamp(1.25rem,1.9vw,1.7rem)/1.1 var(--serif)}
.cc-go{position:absolute;right:16px;bottom:16px;z-index:1;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#fff;color:var(--navy);font-weight:700;transition:transform .4s var(--ease),background-color .3s,color .3s}
.cc:hover .cc-img img,.cc:focus-visible .cc-img img{transform:scale(1.04)}
.cc:hover .cc-go,.cc.on .cc-go{transform:rotate(-45deg);background:var(--terra);color:#fff}
.cc.on{box-shadow:0 0 0 3px var(--cream),0 0 0 6px var(--terra)}
@media (max-width:1099.98px){.atlas{grid-template-columns:1fr}.atlas-map{padding-bottom:60px}}
@media (max-width:767.98px){
  .country-grid{grid-template-columns:1fr 1fr;gap:10px}
  .cc{aspect-ratio:3/4;border-radius:16px}
  .cc-name{left:14px;bottom:14px;right:44px}
  .cc-go{width:28px;height:28px;right:10px;bottom:12px}
  .atlas{border-radius:20px}
  .atlas-map{padding:8px 8px 56px}
  .atlas-hint{left:12px;bottom:12px}
}

/* ---------- regio's ---------- */
.regions{padding:var(--sec) 0;background:var(--white);position:relative}
.sec-head-row{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:0 24px;max-width:none}
.region-list{border-top:1px solid var(--navy)}
.region-list li{border-bottom:1px solid var(--line)}
.region-list a{display:grid;grid-template-columns:56px 1.2fr .7fr 1.6fr 40px;align-items:center;gap:20px;padding:28px 4px;text-decoration:none;color:var(--ink)}
.rg-thumb{display:none}
.rg-n{font:600 .8rem/1 var(--sans);letter-spacing:.14em;color:var(--terra-ink)}
.rg-name{font:500 clamp(1.7rem,3.4vw,3rem)/1.05 var(--serif);color:var(--navy);transition:transform .45s var(--ease),color .3s}
.rg-land{font:600 .75rem/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.rg-towns{color:var(--muted);font-size:.95rem}
.rg-go{justify-self:end;font-size:1.3rem;color:var(--navy);transition:transform .45s var(--ease),color .3s}
.region-list a:hover .rg-name,.region-list a:focus-visible .rg-name{transform:translateX(12px);color:var(--terra-ink)}
.region-list a:hover .rg-go{transform:translateX(6px) rotate(-45deg);color:var(--terra)}
.region-float{position:fixed;left:0;top:0;z-index:40;width:300px;aspect-ratio:760/510;border-radius:var(--r-img);overflow:hidden;pointer-events:none;visibility:hidden;transform:translate3d(-50%,-50%,0) scale(0);transition:transform .35s var(--ease),visibility 0s linear .35s;box-shadow:0 30px 60px -20px rgba(15,23,42,.5)}
.region-float img{width:100%;height:100%;object-fit:cover}
.region-float.show{visibility:visible;transform:translate3d(-50%,-50%,0) scale(1);transition:transform .35s var(--ease),visibility 0s}
@media (max-width:1099.98px){.region-list a{grid-template-columns:44px 1fr auto 32px}.rg-towns{grid-column:2/-1;grid-row:2;margin-top:-10px}}
@media (max-width:767.98px){
  .region-list a{grid-template-columns:56px 1fr 24px;gap:4px 16px;padding:18px 0}
  .rg-thumb{display:block;grid-row:1/4;width:56px;height:56px;border-radius:12px;object-fit:cover}
  .rg-n{display:none}
  .rg-name{grid-column:2;grid-row:1;font-size:1.6rem}
  .rg-land{grid-column:2;grid-row:2}
  .rg-towns{grid-column:2;grid-row:3;margin:0;font-size:.9rem}
  .rg-go{grid-column:3;grid-row:1/4}
  .region-float{display:none}
}

/* ---------- gidsen ---------- */
.guides{padding:var(--sec) 0;background:var(--cream)}
.filter{display:inline-flex;flex-wrap:wrap;gap:6px;padding:5px;margin:0 0 28px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.filter[hidden]{display:none}
.filter button{font:600 .94rem/1 var(--sans);color:var(--muted);background:transparent;border:0;min-height:44px;padding:0 16px;border-radius:12px;cursor:pointer;transition:background-color .25s,color .25s}
.filter button:hover{color:var(--navy)}
.filter button[aria-pressed="true"]{background:var(--navy);color:#fff}
.filter .c{margin-left:4px;font-size:.8rem;font-weight:500;font-variant-numeric:tabular-nums}
.ggroup[hidden]{display:none}
.guide-feature{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,24px);margin:0 0 clamp(48px,6vw,80px)}
.gf{position:relative;display:flex;flex-direction:column;gap:10px;padding:clamp(28px,3.4vw,44px);min-height:250px;border-radius:24px;background:var(--navy);color:#fff;text-decoration:none;overflow:hidden;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.gf:nth-child(2){background:var(--terra-form)}
.gf-n{font:400 4.4rem/1 var(--serif);color:rgba(255,255,255,.25);position:absolute;right:28px;top:18px}
.gf strong{font:500 clamp(1.5rem,2.4vw,2.1rem)/1.15 var(--serif);max-width:18ch;margin-top:auto;padding-right:56px}
.gf-p{color:rgba(255,255,255,.92);max-width:44ch;padding-right:56px}
.gf-go{position:absolute;right:28px;bottom:28px;width:48px;height:48px;border-radius:50%;border:1.5px solid rgba(255,255,255,.65);display:grid;place-items:center;font-size:1.2rem;transition:background-color .3s,color .3s,transform .45s var(--ease)}
.gf:hover{transform:translateY(-4px);box-shadow:var(--sh-card)}
.gf:hover .gf-go{background:#fff;color:var(--navy);transform:rotate(-45deg)}
.guide-group{display:grid;grid-template-columns:5fr 7fr;gap:clamp(28px,5vw,72px);align-items:start;padding:clamp(40px,5vw,64px) 0;border-top:1px solid var(--line)}
.gg-flip{grid-template-columns:7fr 5fr}
.gg-flip .gg-media{order:2}
.gg-media{position:sticky;top:calc(var(--top-vis) + 32px);border-radius:var(--r-card);overflow:hidden;aspect-ratio:4/5;transition:top .4s var(--ease)}
.gg-media img{width:100%;height:100%;object-fit:cover}
.gg-body h3{font-size:clamp(1.8rem,3vw,2.6rem);margin:0 0 20px}
.gg-list{counter-reset:g}
.gg-list li{counter-increment:g;border-top:1px solid var(--line)}
.gg-list a{display:grid;grid-template-columns:48px 1fr;gap:4px 12px;padding:22px 0;text-decoration:none;color:var(--ink)}
.gg-list a::before{content:counter(g,decimal-leading-zero);grid-row:span 2;font:600 .82rem/1.9 var(--sans);letter-spacing:.1em;color:var(--terra-ink)}
.gg-list strong{font:500 1.25rem/1.3 var(--serif);color:var(--navy);transition:color .3s}
.gg-list span{color:var(--muted);font-size:.95rem}
.gg-list a:hover strong{color:var(--terra-ink)}
@media (max-width:767.98px){
  .guide-feature{grid-template-columns:1fr}
  .gf{min-height:200px}
  .guide-group,.gg-flip{grid-template-columns:1fr;gap:20px}
  .gg-media{position:static;aspect-ratio:16/9}
  .gg-flip .gg-media{order:0}
  .gg-list{display:grid;gap:10px}
  .gg-list li{border:0}
  .gg-list a{background:#fff;border-radius:16px;padding:18px 18px 18px 14px;box-shadow:inset 0 0 0 1px var(--line)}
  .filter{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .filter button{padding:0 10px}
}

/* ---------- checklist ---------- */
.checklist{padding:var(--sec) 0;background:var(--navy);color:#fff;position:relative;overflow:hidden}
.checklist::before{content:"";position:absolute;right:-12vw;top:-12vw;width:44vw;height:44vw;border-radius:50%;border:1px solid rgba(255,255,255,.08);box-shadow:0 0 0 5vw rgba(255,255,255,.02),0 0 0 10vw rgba(255,255,255,.015)}
.check-in{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,6vw,96px);position:relative}
.checklist h2{color:#fff;margin:0 0 20px}
.check-head p:not(.label){color:rgba(255,255,255,.86);font-size:1.08rem;margin:0 0 32px}
.check-list{display:grid;grid-template-columns:1fr 1fr;gap:0 32px}
.check-list li{border-top:1px solid rgba(255,255,255,.16)}
.check-list a{display:flex;align-items:flex-start;gap:14px;padding:22px 0;color:#fff;text-decoration:none;font:500 1.14rem/1.35 var(--serif)}
.ck-n{font:600 .75rem/2 var(--sans);letter-spacing:.12em;color:#FFB08F;min-width:22px}
.ck-t{flex:1}
.ck{flex:none;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--terra);background:var(--terra);position:relative;transition:background-color .3s var(--ease),border-color .3s}
.ck::after{content:"";position:absolute;left:8px;top:4px;width:6px;height:11px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg) scale(1);transition:transform .35s var(--ease)}
html.js .check-list:not(.in) .ck{background:transparent;border-color:rgba(255,255,255,.45)}
html.js .check-list:not(.in) .ck::after{transform:rotate(45deg) scale(0)}
.check-list.in li .ck,.check-list.in li .ck::after{transition-delay:calc(var(--i,0) * 80ms + .2s)}
.check-list a:hover .ck-t{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
@media (max-width:899.98px){.check-in{grid-template-columns:1fr}.check-list{grid-template-columns:1fr}}

/* ---------- faq ---------- */
.faq{padding:var(--sec) 0;background:var(--white)}
.faq-in{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,6vw,96px)}
.faq-head h2{margin:0 0 24px}
.faq-list details{border-top:1px solid var(--line)}
.faq-list details:last-child{border-bottom:1px solid var(--line)}
.faq-list summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:24px;align-items:center;padding:24px 0;min-height:44px;font:500 clamp(1.15rem,1.6vw,1.4rem)/1.3 var(--serif);color:var(--navy)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"";flex:none;width:38px;height:38px;border-radius:50%;border:1.5px solid var(--line-2);background:linear-gradient(var(--navy),var(--navy)) center/12px 1.5px no-repeat,linear-gradient(var(--navy),var(--navy)) center/1.5px 12px no-repeat;transition:transform .4s var(--ease),background-color .3s,border-color .3s}
.faq-list details[open] summary::after{transform:rotate(45deg);border-color:var(--terra);background-color:var(--cream)}
.faq-list summary:hover{color:var(--terra-ink)}
.faq-a p{margin:0 0 24px;color:var(--muted);max-width:62ch}
@media (max-width:899.98px){.faq-in{grid-template-columns:1fr}}

/* ---------- formulier ---------- */
.contact{position:relative;padding:var(--sec) 0;background:var(--terra-form);color:#fff;overflow:hidden;scroll-margin-top:var(--top-vis)}
.contact-in{display:grid;grid-template-columns:5fr 6fr;gap:clamp(32px,6vw,96px);align-items:center}
.contact-sun{position:absolute;left:max(var(--gut),calc((100% - var(--wrap)) / 2));bottom:-1px;width:clamp(140px,20vw,300px);height:auto;pointer-events:none;overflow:visible}
.sun-disc{fill:var(--amber)}
.sun-ring{fill:none;stroke:var(--amber);stroke-width:2.5;stroke-opacity:.55}
.contact-in{position:relative;z-index:1}
.contact h2{color:#fff;margin:0 0 18px}
.contact-p{font-size:1.2rem;color:#fff;max-width:34ch;margin:0 0 28px}
.contact-points li{display:flex;gap:14px;align-items:flex-start;margin:0 0 14px;color:#fff;max-width:44ch}
.cp-ic{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.18);margin-top:1px}
.cp-ic svg{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.form-card{background:#fff;color:var(--ink);border-radius:24px;padding:clamp(22px,3.2vw,40px);box-shadow:0 40px 80px -30px rgba(15,23,42,.55)}
.msg{padding:14px 18px;border-radius:14px;margin:0 0 16px;font-weight:600;background:#fff;box-shadow:inset 0 0 0 2px currentColor}
.msg-ok{color:#1D5C1D}.msg-err{color:#8A1F1F}
.msg:focus{outline:3px solid #fff;outline-offset:3px}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.f{margin:0 0 16px;min-width:0}
.f label{display:block;font:600 .86rem/1.3 var(--sans);color:var(--navy);margin:0 0 7px}
.f input,.f select,.f textarea{width:100%;min-height:48px;font:400 1rem/1.4 var(--sans);color:var(--ink);background:#FBF9F5;border:1.5px solid #B9AE9C;border-radius:12px;padding:12px 14px;transition:border-color .25s,box-shadow .25s,background-color .25s;appearance:none;-webkit-appearance:none}
.f select{background-image:linear-gradient(45deg,transparent 50%,var(--navy) 50%),linear-gradient(135deg,var(--navy) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:36px}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:var(--navy);background-color:#fff;box-shadow:0 0 0 4px rgba(27,58,75,.16)}
.f [aria-invalid="true"]{border-color:#8A1F1F}
.f textarea{resize:vertical;min-height:96px}
.form-card .btn{margin-top:6px}
.note{font-size:.86rem;color:var(--muted);margin:14px 0 0;text-align:center}
@media (max-width:899.98px){.contact-in{grid-template-columns:1fr}}
@media (max-width:559.98px){.f-row{grid-template-columns:1fr}}

/* ---------- movingcompare ---------- */
.verhuis{padding:clamp(64px,8vw,110px) 0;background:var(--cream);text-align:center}
.verhuis h2{font-size:clamp(1.9rem,3.6vw,3rem);margin:0 0 18px}
.verhuis p{max-width:60ch;margin:0 auto 28px;color:var(--muted);font-size:1.08rem}

/* ---------- voet ---------- */
.foot{background:var(--dark);color:rgba(255,255,255,.78);padding:72px 0 44px;font-size:.94rem}
.foot a{color:#fff}
.foot-top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px;padding:0 0 36px;border-bottom:1px solid rgba(255,255,255,.14)}
.foot-logo img{height:40px;width:auto}
.foot-top nav{display:flex;flex-wrap:wrap;gap:0 28px}
.foot-top nav a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.foot-top nav a:hover{text-decoration:underline}
.foot-mid{padding:28px 0 0;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px 24px}
.foot-mid strong{color:var(--terra-lt2)}
.foot .legal{color:rgba(255,255,255,.7)}

/* ---------- mobiele actiebalk ---------- */
.cta-bar{display:none}
@media (max-width:767.98px){
  html.js .foot{padding-bottom:calc(44px + 76px + env(safe-area-inset-bottom))}
  .cta-bar{display:block;position:fixed;left:0;right:0;bottom:0;z-index:55;background:#fff;padding:12px 16px calc(12px + env(safe-area-inset-bottom));box-shadow:0 -10px 30px -12px rgba(15,23,42,.35);transform:translateY(110%);visibility:hidden;transition:transform .35s var(--ease),visibility 0s linear .35s}
  .cta-bar[hidden]{display:none}
  .cta-bar.show{transform:none;visibility:visible;transition:transform .35s var(--ease),visibility 0s}
  .cta-bar .btn{min-height:52px}
}

/* ---------- reveals & animatie (progressieve verbetering) ---------- */
@keyframes marq{to{transform:translate3d(-50%,0,0)}}
@keyframes pulse{0%{fill-opacity:.45;transform:scale(.6)}100%{fill-opacity:0;transform:scale(2.6)}}
.rv{transition:opacity .8s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--d,0) * 110ms + var(--i,0) * 80ms)}
/* ENIGE plek waar iets verborgen mag worden: */
html.js-anim:not(.anim-safe) .rv:not(.in){opacity:0;transform:translateY(24px)}
html.js-anim:not(.anim-safe) .hero h1 .rv:not(.in){opacity:1;transform:translateY(105%)}
/* LCP: de lead is het grootste tekstblok boven de vouw op mobiel — alleen schuiven, nooit verbergen */
html.js-anim:not(.anim-safe) .hero .lead.rv:not(.in){opacity:1;transform:translateY(12px)}
/* na de failsafe: wat nog niet in beeld kwam is al zichtbaar en schuift alleen nog iets op */
html.js-anim.anim-safe .rv:not(.in){transform:translateY(16px);transition:transform .9s var(--ease)}
html.js-anim.anim-safe .hero .rv:not(.in),html.js-anim.anim-safe .hero h1 .rv{transform:none}
.cc-img img{transform:scale(1)}
html.js-anim .country-grid li:not(.in) .cc-img img{transform:scale(1.1)}
.js-anim .marquee-track{animation:marq 40s linear infinite}
/* SNEL-A11Y-20261001 (#51, WCAG 2.2.2): pauze bij hover, bij focus op de pauzeknop en met de knop zelf (syoh.js) */
.marquee:hover .marquee-track,.marquee.is-paused .marquee-track{animation-play-state:paused}
/* apart: een browser zonder :has() negeert alleen deze regel */
.marquee:has(+ .marquee-knop:focus-visible) .marquee-track,.marquee:has(+ .marquee-knop:hover) .marquee-track{animation-play-state:paused}
.js-anim .pin.on .pin-pulse{animation:pulse 2.4s var(--ease) infinite;transform-box:fill-box;transform-origin:center}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .rv,html.js-anim .rv,html.js-anim .rv:not(.in),html.js-anim:not(.anim-safe) .hero h1 .rv:not(.in){opacity:1!important;transform:none!important}
  html.js-anim .country-grid li .cc-img img{transform:none}
  .hero-img{transform:none!important}
}
@media print{.top,.cta-bar,.marquee,.marquee-knop,.region-float{display:none}.hero{min-height:0}}

/* ==== syoh-nav.css ==== */
/* SYOH-MENU-20260930 — kopmenu: desktop-dropdowns (Landen, Taal) + mobiel full-screen menu (< 900 px).
   Hoort bij data/inc-header.php en assets/syoh-nav.js. Tokens uit syoh.css.
   ANIMATIE-VAL: niets is standaard onzichtbaar. De begin-/eindstand van een animatie staat alleen onder
   de JS-klassen .is-pre / .is-out; zonder die klassen staat alles in de eindstand (zichtbaar).
   Zonder JS: gewone links (Landen → #landen, taal-pil), geen hamburger. */

/* ---------- JS / geen-JS ---------- */
html:not(.js) .nv-js{display:none!important}
html.js .nv-nojs{display:none!important}
.nv-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}

/* ---------- desktop-links ---------- */
.nv-dd{position:relative;display:inline-flex}
.nv-btn{appearance:none;-webkit-appearance:none;background:none;border:0;margin:0;padding:0;color:inherit;font:500 .95rem/1 var(--sans);cursor:pointer;min-height:44px;display:inline-flex;align-items:center;gap:6px;position:relative}
.nv-caret{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s var(--ease)}
.nv-btn[aria-expanded="true"] .nv-caret{transform:rotate(180deg)}
.top-nav .nv-btn::after{content:"";position:absolute;left:0;right:18px;bottom:10px;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .4s var(--ease)}
.top-nav .nv-btn:hover::after,.top-nav .nv-btn[aria-expanded="true"]::after{transform:scaleX(1);transform-origin:left}
/* actieve pagina: vaste onderstreping, iets dikker */
.top-nav a[aria-current]::after,.top-nav .nv-btn[data-current]::after{transform:scaleX(1);height:2px}
.top-nav a[aria-current],.top-nav .nv-btn[data-current]{font-weight:600}

/* ---------- dropdownpanelen ---------- */
.nv-panel{position:absolute;top:calc(100% + 8px);z-index:5;background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:0 30px 60px -24px rgba(15,23,42,.35),0 2px 8px rgba(15,23,42,.06);transform-origin:top left;transition:transform .35s var(--ease),clip-path .45s var(--ease)}
.nv-panel[hidden]{display:none}
.nv-panel.is-pre,.nv-panel.is-out{transform:translateY(-6px);clip-path:inset(0 0 100% 0 round var(--r-card))}
.nv-panel.is-out{transition-duration:.2s}
.nv-panel::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px} /* muisbrug */

.nv-mega{left:-22px;width:min(760px,calc(100vw - 2 * var(--gut)));padding:22px 22px 18px}
.nv-mega-k{margin:0 0 14px;font:600 .75rem/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--terra-ink)}
.nv-mega-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.top-nav .nv-mega-grid a{display:block;min-height:0;color:var(--navy);text-decoration:none;font:500 1.02rem/1.2 var(--serif);border-radius:12px;padding:0 0 4px}
.top-nav .nv-mega-grid a::after{display:none}
.nv-mega-img{display:block;aspect-ratio:760/510;border-radius:12px;overflow:hidden;background:var(--sand);margin-bottom:9px}
.nv-mega-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease)}
.nv-mega-grid a:hover .nv-mega-img img,.nv-mega-grid a:focus-visible .nv-mega-img img{transform:scale(1.06)}
.nv-mega-n{display:flex;align-items:center;gap:8px}
.nv-mega-grid a[aria-current] .nv-mega-n{text-decoration:underline;text-decoration-color:var(--terra);text-decoration-thickness:2px;text-underline-offset:4px}
.top-nav .nv-mega-all{display:inline-flex;min-height:44px;margin-top:10px;color:var(--terra-ink);font:600 .92rem/1 var(--sans)}
.top-nav .nv-mega-all::after{bottom:12px}

.nv-lang .top-lang{padding:0 12px 0 14px}
.nv-lang-panel{right:0;left:auto;width:250px;padding:10px;transform-origin:top right}
.nv-lang-k{margin:6px 10px 8px;font:600 .72rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.nv-lang-panel ul{list-style:none;margin:0;padding:0}
.nv-lang-panel a{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 10px;border-radius:12px;color:var(--ink);text-decoration:none;font:500 .95rem/1 var(--sans)}
.nv-lang-panel a:hover{background:var(--cream)}
.nv-lang-panel a[aria-current]{font-weight:600;color:var(--navy)}
.nv-code{display:inline-grid;place-items:center;min-width:30px;height:22px;padding:0 5px;border-radius:6px;background:var(--sand);color:var(--navy);font:700 .7rem/1 var(--sans);letter-spacing:.06em}
.nv-lang-panel a[aria-current] .nv-code{background:var(--navy);color:#fff}
.nv-tick{margin-left:auto;fill:none;stroke:var(--terra-ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- vlaggetjes (CSS, geen beeld, geen emoji) ---------- */
.nv-flag{flex:none;display:inline-block;width:20px;height:14px;border-radius:3px;box-shadow:inset 0 0 0 1px rgba(15,23,42,.18)}
.nv-flag-es{background:linear-gradient(#AA151B 25%,#F1BF00 25% 75%,#AA151B 75%)}
.nv-flag-pt{background:linear-gradient(90deg,#046A38 40%,#DA291C 40%)}
.nv-flag-it{background:linear-gradient(90deg,#009246 33.34%,#fff 33.34% 66.67%,#CE2B37 66.67%)}
.nv-flag-fr{background:linear-gradient(90deg,#0055A4 33.34%,#fff 33.34% 66.67%,#EF4135 66.67%)}
.nv-flag-nl{background:linear-gradient(#AE1C28 33.34%,#fff 33.34% 66.67%,#21468B 66.67%)}
.nv-flag-be{background:linear-gradient(90deg,#000 33.34%,#FDDA24 33.34% 66.67%,#EF3340 66.67%)}
.nv-flag-de{background:linear-gradient(#000 33.34%,#DD0000 33.34% 66.67%,#FFCE00 66.67%)}
.nv-flag-gr{background:
  linear-gradient(#fff,#fff) 3.2px 0/1.6px 7.8px no-repeat,
  linear-gradient(#fff,#fff) 0 3.1px/8px 1.6px no-repeat,
  linear-gradient(#0D5EAF,#0D5EAF) 0 0/8px 7.8px no-repeat,
  repeating-linear-gradient(#0D5EAF 0 1.556px,#fff 1.556px 3.111px)}

/* ---------- hamburger (3 lijnen → kruis) ---------- */
.nv-burger{display:none;appearance:none;-webkit-appearance:none;flex:none;width:48px;height:48px;margin:0 -6px 0 0;padding:0;border:0;border-radius:999px;background:none;color:inherit;cursor:pointer;align-items:center;justify-content:center;position:relative;-webkit-tap-highlight-color:transparent}
.nv-burger::before{content:"";position:absolute;inset:4px;border-radius:inherit;border:1.5px solid currentColor;opacity:.3;transition:transform .45s var(--ease),opacity .3s}
.nv-burger:hover::before{opacity:.6}
.nv-burger[aria-expanded="true"]::before{transform:scale(1.08);opacity:.45}
.nv-burger-box{position:relative;display:block;width:20px;height:14px}
.nv-burger-box span{position:absolute;left:0;right:0;top:6px;height:2px;border-radius:2px;background:currentColor;
  transition:translate .22s var(--ease) .2s,rotate .24s var(--ease) 0s,scale .22s var(--ease) .1s}
.nv-burger-box span:nth-child(1){translate:0 -6px}
.nv-burger-box span:nth-child(2){left:6px}
.nv-burger-box span:nth-child(3){translate:0 6px}
.nv-burger[aria-expanded="true"] .nv-burger-box span{translate:0 0;transition:translate .22s var(--ease) 0s,rotate .34s cubic-bezier(.3,1.5,.5,1) .2s,scale .18s var(--ease) 0s}
.nv-burger[aria-expanded="true"] .nv-burger-box span:nth-child(1){rotate:45deg}
.nv-burger[aria-expanded="true"] .nv-burger-box span:nth-child(2){scale:0 1}
.nv-burger[aria-expanded="true"] .nv-burger-box span:nth-child(3){rotate:-45deg}

/* zonder JS op smal scherm: links op nette regels, nooit afbreken binnen een link */
@media (max-width:899.98px){html:not(.js) .top-nav{flex-wrap:wrap;gap:0 18px}html:not(.js) .top-nav a{white-space:nowrap}}

/* ---------- mobiel (< 900 px, alleen met JS) ---------- */
@media (max-width:899.98px){
  html.js .top-nav,html.js .nv-lang{display:none}
  html.js .nv-burger{display:inline-flex}
  html.js .top-in{flex-wrap:nowrap;padding:8px var(--gut);gap:0 12px}
}
@media (min-width:900px){ .nv-menu{display:none!important} }

/* kop terwijl het menu open is: transparant boven het navy vlak, wit logo */
/* .nv-rise: kop direct boven het menu (de knop blijft bereikbaar); de kleurwissel volgt 220 ms later met .nv-open */
.top.nv-rise{z-index:100;transition-duration:.2s}
html.nv-open .top{z-index:100;background:transparent!important;border-bottom-color:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;color:#fff!important;transform:none!important}
html.nv-open .top .logo-dark-bg{display:block!important}
html.nv-open .top .logo-light-bg{display:none!important}
html.nv-open .top .top-cta{visibility:hidden}
html.nv-open .top :focus-visible{outline-color:var(--terra-lt)}
/* alleen html: body met overflow:hidden wordt zelf een scrollcontainer en dan plakt de sticky kop niet meer */
html.nv-lock{overflow:hidden}
html.nv-lock body{padding-right:var(--nv-sbw,0px)}
html.nv-lock .top.is-overlay{right:var(--nv-sbw,0px)}

/* ---------- het full-screen menu ---------- */
.nv-menu{position:fixed;inset:0;z-index:95;display:flex;background:var(--navy);color:#fff;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
  padding:calc(var(--nv-top,64px) + 8px) var(--gut) calc(20px + env(safe-area-inset-bottom));
  clip-path:circle(150% at var(--cx,calc(100% - 40px)) var(--cy,32px));transition:clip-path .7s cubic-bezier(.7,0,.2,1)}
.nv-menu[hidden]{display:none}
.nv-menu.is-pre,.nv-menu.is-out{clip-path:circle(0px at var(--cx,calc(100% - 40px)) var(--cy,32px))}
.nv-menu.is-out{transition:clip-path .45s cubic-bezier(.6,0,.9,.4)}
.nv-menu :focus-visible{outline:3px solid var(--terra-lt);outline-offset:3px}

/* zachte zon-gloed (decoratie, alleen transform) */
.nv-sun{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.nv-sun span{position:absolute;border-radius:50%;will-change:transform}
.nv-sun-a{width:min(130vw,900px);aspect-ratio:1;right:-45%;bottom:-38%;background:radial-gradient(closest-side,rgba(204,74,34,.62),rgba(204,74,34,.24) 55%,rgba(204,74,34,0));animation:nv-drift-a 17s ease-in-out infinite alternate}
.nv-sun-b{width:min(80vw,560px);aspect-ratio:1;right:-12%;bottom:-18%;background:radial-gradient(closest-side,rgba(245,165,36,.46),rgba(245,165,36,.14) 60%,rgba(245,165,36,0));animation:nv-drift-b 13s ease-in-out infinite alternate;transition:translate 1.1s var(--ease) .1s}
.nv-menu.is-pre .nv-sun-b{translate:0 40%}
@keyframes nv-drift-a{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-6%,-4%,0) scale(1.06)}100%{transform:translate3d(-12%,2%,0) scale(.97)}}
@keyframes nv-drift-b{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(-14%,-10%,0) scale(1.12)}}

.nv-menu-in{position:relative;z-index:1;display:flex;flex-direction:column;width:100%;max-width:620px;margin:0 auto;min-height:100%}
.nv-big{list-style:none;margin:0;padding:0}
.nv-row{border-bottom:1px solid rgba(255,255,255,.13)}
.nv-big-l{appearance:none;-webkit-appearance:none;display:block;width:100%;background:none;border:0;margin:0;padding:10px 0;color:#fff;text-align:left;text-decoration:none;cursor:pointer;
  font:500 clamp(2rem,8.4vw,2.9rem)/1.12 var(--serif);letter-spacing:-.01em;min-height:64px}
.nv-mask{display:block;overflow:hidden;padding:.06em 0 .1em}
.nv-slide{display:flex;align-items:center;gap:14px;transition:transform .8s var(--ease),color .3s;transition-delay:calc(var(--i,0) * 65ms + 140ms)}
.nv-menu.is-pre .nv-slide{transform:translateY(112%)}
.nv-no{flex:none;align-self:flex-start;margin-top:.55em;font:600 .72rem/1 var(--sans);letter-spacing:.14em;color:var(--terra-lt);min-width:22px}
.nv-big-l:hover .nv-slide{color:#FFD7C6}
.nv-big-l[aria-current] .nv-t,.nv-big-l[data-current] .nv-t{text-decoration:underline;text-decoration-color:var(--terra-lt);text-decoration-thickness:2px;text-underline-offset:.18em}
.nv-plus{position:relative;flex:none;width:30px;height:30px;margin-left:auto;border-radius:50%;border:1.5px solid rgba(255,255,255,.4);transition:transform .45s var(--ease),background-color .3s}
.nv-plus::before,.nv-plus::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;margin:-.75px 0 0 -6px;background:currentColor;transition:transform .45s var(--ease)}
.nv-plus::after{transform:rotate(90deg)}
.nv-acc[aria-expanded="true"] .nv-plus{transform:rotate(180deg);background:rgba(255,255,255,.1)}
.nv-acc[aria-expanded="true"] .nv-plus::after{transform:rotate(0)}

/* landen-chips */
.nv-chips-wrap{padding:4px 0 18px;transition:clip-path .45s var(--ease)}
.nv-chips-wrap[hidden]{display:none}
.nv-chips-wrap.is-pre{clip-path:inset(0 0 100% 0)}
.nv-chips{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.nv-chips li{transition:transform .5s var(--ease);transition-delay:calc(var(--j,0) * 35ms)}
.nv-chips-wrap.is-pre .nv-chips li{transform:translateY(12px) scale(.96)}
.nv-chip{display:flex;align-items:center;gap:10px;min-height:48px;padding:0 12px;border-radius:14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);color:#fff;text-decoration:none;font:500 .98rem/1.15 var(--sans);transition:background-color .25s,border-color .25s,transform .25s var(--ease)}
.nv-chip:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.34)}
.nv-chip:active{transform:scale(.97)}
.nv-chip[aria-current]{background:#fff;color:var(--navy);border-color:#fff}
.nv-chip .nv-flag{box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.nv-chip-k{font:700 .68rem/1 var(--sans);letter-spacing:.08em;opacity:.8}
.nv-chips-all{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin-top:6px;color:#FFD7C6;font:600 .92rem/1 var(--sans);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}

.nv-cta-row{border-bottom:0;padding:26px 0 8px}
.nv-cta{min-height:58px;font-size:1.05rem;box-shadow:0 18px 36px -16px rgba(0,0,0,.55)}
.nv-cta-row,.nv-foot{transition:transform .8s var(--ease);transition-delay:calc(var(--i,0) * 65ms + 140ms)}
.nv-menu.is-pre .nv-cta-row,.nv-menu.is-pre .nv-foot{transform:translateY(28px)}

.nv-foot{margin-top:auto;border-bottom:0;padding:26px 0 4px;display:flex;flex-direction:column;gap:14px}
.nv-foot-lang{display:flex;flex-wrap:wrap;gap:8px}
.nv-pill{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:0 16px 0 8px;border-radius:999px;border:1.5px solid rgba(255,255,255,.3);color:#fff;text-decoration:none;font:500 .92rem/1 var(--sans)}
.nv-pill .nv-code{background:rgba(255,255,255,.14);color:#fff}
.nv-pill[aria-current]{background:#fff;border-color:#fff;color:var(--navy);font-weight:600}
.nv-pill[aria-current] .nv-code{background:var(--navy);color:#fff}
.nv-mc{display:flex;flex-direction:column;gap:4px;padding:10px 0;min-height:44px;color:rgba(255,255,255,.86);text-decoration:none;font:500 .92rem/1.4 var(--sans)}
.nv-mc:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.nv-mc-k{font:600 .68rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--terra-lt)}

@media (min-width:600px) and (max-width:899.98px){
  .nv-chips{grid-template-columns:repeat(4,1fr)}
  .nv-foot{flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap}
  .nv-mc{max-width:300px;text-align:right;align-items:flex-end}
}
@media (max-height:600px){.nv-big-l{font-size:1.8rem;min-height:54px;padding:6px 0}}

@media (prefers-reduced-motion:reduce){
  .nv-sun span{animation:none!important}
  .nv-menu,.nv-menu.is-pre,.nv-menu.is-out,.nv-panel.is-pre,.nv-panel.is-out,.nv-chips-wrap.is-pre{clip-path:none!important}
  .nv-menu.is-pre .nv-slide,.nv-menu.is-pre .nv-cta-row,.nv-menu.is-pre .nv-foot,.nv-chips-wrap.is-pre .nv-chips li,.nv-panel.is-pre{transform:none!important;translate:none!important}
}
@media print{.nv-menu,.nv-burger,.nv-panel{display:none!important}}

/* =====================================================================================================
   PORTAAL-NAV-20261001 — het verkopersportaal overal vindbaar:
   kop (Homes for sale, Pricing, Log in / My account, hoofdknop "List your home"), mobiel menu
   (account + "Quick request") en de sectie "How our portal works" (.pp, home + landpagina's).
   ANIMATIE-VAL: niets standaard onzichtbaar; .pp gebruikt alleen .rv (syoh.css) en transform-decoratie.
   ===================================================================================================== */

/* ---------- kop: knop Log in / My account ---------- */
.nv-konto{flex:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px 0 12px;border-radius:999px;color:inherit;text-decoration:none;
  font:600 .92rem/1 var(--sans);white-space:nowrap;border:1.5px solid transparent;transition:border-color .3s,background-color .3s}
.nv-konto:hover{border-color:color-mix(in srgb,currentColor 35%,transparent)}
.nv-konto[aria-current]{border-color:currentColor}
.nv-konto-ic{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.nv-av{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--terra);color:#fff;font:700 .8rem/1 var(--sans);flex:none}
.nv-konto.is-in{padding-left:6px}
/* één regel tot 1280 px past niet meer (2 portaallinks + knop erbij): 900–1279 px = links op een tweede regel,
   net als syoh.css al onder 1100 px doet */
/* gemeten (nowrap, alle 7 talen): één regel kost 1375 px (EN) tot 1515 px (DE/ES) aan kop.
   900–1439 px: links op een tweede regel (zoals syoh.css al onder 1100 px doet).
   1440–1599 px: één regel; Checklist valt dan uit de kopregel (staat ook onder Gidsen, in de voet en in het menu).
   ≥ 1600 px: alles op één regel. */
@media (min-width:1100px) and (max-width:1439.98px){
  .top-in{flex-wrap:wrap;padding:8px var(--gut) 0;gap:0 12px}
  .top-nav{order:3;width:100%;gap:0 22px;margin:0 0 2px}
}
@media (min-width:1440px){
  .top-in{gap:8px 14px}
  .top-nav{gap:4px 20px}
}
@media (min-width:1440px) and (max-width:1599.98px){.top-nav .nv-l-check{display:none}.top-nav{gap:4px 16px}.top-in{gap:8px 12px}} /* ruimte voor een schuifbalk van 15 px (DE/ES/PT zijn het langst) */
/* mobiel: alleen het icoon (de tekst blijft voor schermlezers) */
@media (max-width:899.98px){
  .nv-konto{width:44px;height:44px;padding:0;justify-content:center;border-color:color-mix(in srgb,currentColor 30%,transparent)}
  .nv-konto.is-in{padding:0;border-color:transparent}
  .nv-konto-t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
}
html.nv-open .top .nv-konto{visibility:hidden}

/* ---------- mobiel menu: account + snelle aanvraag onder de hoofdknop ---------- */
.nv-cta-2{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin-top:14px}
.nv-konto-m{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 18px 0 12px;border-radius:999px;border:1.5px solid rgba(255,255,255,.4);color:#fff;text-decoration:none;font:600 .98rem/1.15 var(--sans)}
.nv-konto-m:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.nv-konto-m .nv-konto-ic{stroke:#fff}
.nv-konto-m > span:last-child{display:flex;flex-direction:column;gap:3px}
.nv-konto-wie{font:500 .78rem/1.2 var(--sans);color:rgba(255,255,255,.75)}
.nv-snel{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:#FFD7C6;font:600 .95rem/1.2 var(--sans);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}

/* ---------- sectie "How our portal works" ---------- */
.pp{position:relative;overflow:hidden;padding:var(--sec) 0;background:var(--navy);color:#fff}
.pp-sun{position:absolute;width:min(90vw,760px);aspect-ratio:1;right:-18%;top:-30%;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(204,74,34,.45),rgba(204,74,34,.12) 60%,rgba(204,74,34,0))}
.pp .wrap{position:relative}
.pp-head{max-width:760px;margin:0 0 clamp(36px,4.5vw,56px)}
.pp h2{color:#fff;margin:0 0 18px}
.pp-p{font-size:1.125rem;color:rgba(255,255,255,.82);max-width:62ch;margin:0}
.pp-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;counter-reset:none}
.pp-step{position:relative;padding:26px 24px 28px;border-radius:var(--r-card);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14)}
.pp-step:not(:last-child)::after{content:"";position:absolute;top:46px;right:-18px;width:18px;height:1.5px;background:rgba(255,162,125,.6)}
.pp-top{display:flex;align-items:center;justify-content:space-between;margin:0 0 18px}
.pp-n{font:400 3rem/.9 var(--serif);color:var(--terra-lt);font-variant-numeric:lining-nums}
.pp-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.1)}
.pp-ic svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.pp-step h3{color:#fff;font-size:1.3rem;margin:0 0 10px}
.pp-step p{margin:0;color:rgba(255,255,255,.8);font-size:.98rem;line-height:1.6}
.pp-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px;margin-top:clamp(32px,4vw,48px)}
.pp .pp-koop{color:#fff}
.pp-snel{margin:20px 0 0;color:rgba(255,255,255,.75);font-size:.95rem}
.pp-snel a{color:#FFD7C6;font-weight:600;text-underline-offset:3px}
@media (max-width:1099.98px){
  .pp-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pp-step:not(:last-child)::after{display:none}
}
@media (max-width:599.98px){
  .pp-steps{grid-template-columns:1fr;gap:12px}
  .pp-step{padding:22px 20px 24px}
  .pp-top{margin-bottom:12px}
  .pp-n{font-size:2.4rem}
  .pp-cta .btn{width:100%}
}
/* landpagina: kaart in de inhoudskolom, licht */
.pp-lp{padding:clamp(28px,4vw,44px) clamp(20px,3.4vw,40px);background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--sh-card)}
.pp-lp .pp-head{margin-bottom:28px}
.pp-lp h2{color:var(--navy)}
.pp-lp .pp-p{color:var(--muted);font-size:1.05rem}
.pp-lp .pp-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.pp-lp .pp-step{background:var(--cream);border-color:var(--line);padding:22px 20px 24px}
.pp-lp .pp-step::after{display:none}
.pp-lp .pp-n{color:var(--terra-ink);font-size:2.4rem}
.pp-lp .pp-ic{background:#fff;border:1px solid var(--line)}
.pp-lp .pp-ic svg{stroke:var(--navy)}
.pp-lp .pp-step h3{color:var(--navy);font-size:1.18rem}
.pp-lp .pp-step p{color:var(--muted)}
.pp-lp .btn-outline{background:transparent;color:var(--navy);border-color:var(--navy)}
.pp-lp .btn-outline:hover{background:var(--navy);color:#fff}
.pp-lp .pp-koop{color:var(--navy)}
.pp-lp .pp-snel{color:var(--muted)}
.pp-lp .pp-snel a{color:var(--terra-ink)}
@media (max-width:599.98px){.pp-lp .pp-steps{grid-template-columns:1fr}}
@media print{.pp-sun{display:none}.pp{background:none;color:#000}}
/* nooit afbreken binnen een kopitem ("Homes for sale" op drie regels) */
.top-nav > a,.top-nav .nv-btn,.top-cta,.nv-konto{white-space:nowrap}
.nv-lang,.top-lang svg,.nv-konto svg,.top-cta{flex:none} /* een volle kopregel krimpt nooit de iconen */
/* DE/ES/PT: 1440–1599 px hield na meting maar 0–6 px over (te weinig voor een schuifbalk) → daar ook twee regels */
@media (min-width:1440px) and (max-width:1599.98px){
  html:is([lang=de],[lang=es],[lang=pt]) .top-in{flex-wrap:wrap;padding:8px var(--gut) 0;gap:0 12px}
  html:is([lang=de],[lang=es],[lang=pt]) .top-nav{order:3;width:100%;gap:0 22px;margin:0 0 2px}
  html:is([lang=de],[lang=es],[lang=pt]) .top-nav .nv-l-check{display:inline-flex}
}
/* ≥ 1600 px is de kop begrensd op 1400 px + marges: DE/ES/PT passen daar alleen zonder Checklist in de kopregel */
@media (min-width:1600px){html:is([lang=de],[lang=es],[lang=pt]) .top-nav .nv-l-check{display:none}}
/* met 7 regels scrolt het menu op een telefoon: de kop krijgt dan het navy van het menu, anders schuiven de
   regels zichtbaar onder het logo door (open menu = volledig navy, dus visueel gelijk aan transparant) */
html.nv-open .top{background:var(--navy)!important}
/* zonder JS op smal scherm: geen hamburger, links in de kop. De accountknop (icoon) staat rechts naast de
   linkregels in plaats van op een eigen regel, zodat de kop niet hoger wordt dan nodig */
@media (max-width:899.98px){
  html:not(.js) .top-nav{order:3;flex:0 1 calc(100% - 60px);width:auto;min-width:0;gap:0 14px}
  html:not(.js) .nv-konto{order:4;align-self:center}
}
@media (max-width:399.98px){html:not(.js) .top-nav{gap:0 11px}html:not(.js) .top-nav a{font-size:.88rem}}

/* ==== syoh-footer.css ==== */
/* SellYourOwnHouse — voet (VOET-20260930). Hoort bij data/inc-footer.php; tokens uit syoh.css.
   ANIMATIE-VAL: tekst en links zijn nooit verborgen. Alleen decoratie (zon, halo, lichtvlakken) beweegt,
   uitsluitend met transform en alleen onder html.js-anim. prefers-reduced-motion = alles stil.
   Amber (#F5A524) alleen in de zon. */

.foot.ft{position:relative;isolation:isolate;overflow:hidden;padding-top:0;padding-bottom:0;color:rgba(255,255,255,.8);
  background:linear-gradient(180deg,var(--navy) 0%,#15303F 30%,#111F31 58%,var(--dark) 82%);font-size:.95rem}
.ft h2{color:#fff}
.ft a{color:#fff}

/* ---------- achtergrond: zacht bewegend lichtvlak ---------- */
.ft-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.ft-glow{position:absolute;top:-28%;right:-18%;width:min(1100px,110vw);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(closest-side,rgba(204,74,34,.26),rgba(204,74,34,.08) 55%,rgba(204,74,34,0) 100%);will-change:transform}
.ft-glow-2{top:auto;right:auto;bottom:-40%;left:-25%;width:min(900px,95vw);
  background:radial-gradient(closest-side,rgba(96,150,178,.16),rgba(96,150,178,0) 100%)}
@keyframes ftDrift{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-7%,6%,0) scale(1.08)}100%{transform:translate3d(-12%,-3%,0) scale(.96)}}
@keyframes ftDrift2{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(10%,-8%,0) scale(1.1)}}
html.js-anim .ft-glow{animation:ftDrift 26s ease-in-out infinite alternate;animation-play-state:paused}
html.js-anim .ft-glow-2{animation:ftDrift2 32s ease-in-out infinite alternate;animation-play-state:paused}
html.js-anim .ft.ft-vis .ft-glow{animation-play-state:running}

/* ---------- afsluitende CTA-band ---------- */
.ft-cta{padding:clamp(72px,9vw,132px) 0 clamp(56px,7vw,100px);border-bottom:1px solid rgba(255,255,255,.12)}
.ft-cta-in{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(32px,6vw,96px)}
.ft-cta h2{font-size:clamp(2.3rem,5.2vw,4.4rem);line-height:1.04;margin:0 0 22px;max-width:14ch;text-wrap:balance}
.ft-cta-p{font-size:1.14rem;line-height:1.6;color:rgba(255,255,255,.82);max-width:54ch;margin:0 0 34px}
.ft-cta-btns{display:flex;flex-wrap:wrap;gap:14px}
.ft-cta .label{margin-bottom:22px}

/* POLIJST-R1-20260930: drie stappen in plaats van een grote logotegel */
.ft-steps{width:min(400px,34vw);padding:26px 26px 18px;border-radius:22px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);backdrop-filter:blur(2px)}
.ft-steps-top{display:flex;align-items:center;gap:14px;margin:0 0 10px}
.ft-steps-mark{flex:none;width:40px;height:40px;border-radius:10px;overflow:hidden}
.ft-steps-h{margin:0;font:600 .75rem/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#FFB08F}
.ft-steps-list li+li{border-top:1px solid rgba(255,255,255,.1)}
.ft-steps-list a{display:grid;grid-template-columns:34px minmax(0,1fr);gap:14px;align-items:start;padding:14px 0;color:#fff;text-decoration:none}
.ft-steps-n{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35);font:500 1.05rem/1 var(--serif);transition:background-color .25s,box-shadow .25s}
.ft-steps-t{display:flex;flex-direction:column;gap:3px;min-width:0}
.ft-steps-t strong{font-weight:600;font-size:1rem}
.ft-steps-t span{font-size:.88rem;line-height:1.45;color:rgba(255,255,255,.72)}
.ft-steps-list a:hover .ft-steps-n{background:var(--terra);box-shadow:none}
.ft-steps-list a:hover strong{text-decoration:underline;text-decoration-color:var(--terra-lt2);text-underline-offset:4px}
html.js-anim .ft-sun-g{transform:translateY(17px);transition:transform 2.6s cubic-bezier(.16,.8,.2,1) .15s}
html.js-anim .ft-cta.ft-up .ft-sun-g{transform:none}

/* compacte regel als de pagina al een eigen formulier heeft (home, tools) */
.ft-line{border-bottom:1px solid rgba(255,255,255,.12)}
.ft-line-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 28px;padding-top:clamp(28px,3.4vw,44px);padding-bottom:clamp(28px,3.4vw,44px)}
.ft-line-p{margin:0;font:500 clamp(1.3rem,2.1vw,1.9rem)/1.25 var(--serif);color:#fff;letter-spacing:-.01em;max-width:30ch;text-wrap:balance}
/* POLIJST-R3: de korte regel is sterker — logotegel met de opkomende zon ervoor (zelfde beweging als de grote band) */
.ft-line-l{display:flex;align-items:center;gap:clamp(16px,2vw,24px);min-width:0}
.ft-line-mark{flex:none;width:clamp(48px,4.4vw,60px);height:auto;border-radius:14px;box-shadow:0 14px 30px -14px rgba(204,74,34,.7)}
html.js-anim .ft-line .ft-sun-g{transform:translateY(17px);transition:transform 2.2s cubic-bezier(.16,.8,.2,1) .1s}
html.js-anim .ft-line.ft-up .ft-sun-g{transform:none}
.ft-line .btn-ghost{background:#fff;color:var(--navy);border-color:#fff}
.ft-line .btn-ghost:hover{background:var(--terra);border-color:var(--terra);color:#fff}
.ft-line-a{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px}
.ft-line-link{color:#fff;font-weight:500;text-decoration:underline;text-decoration-color:rgba(255,255,255,.4);text-underline-offset:5px;min-height:44px;display:inline-flex;align-items:center}
.ft-line-link:hover{text-decoration-color:var(--terra-lt2)}

/* ---------- kolommen ---------- */
/* POLIJST-R2: ruimte rond de kolommen strakker (was ~95 px boven en ~80 px onder) */
.ft-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 24px;padding-top:clamp(40px,4vw,56px);padding-bottom:clamp(32px,3.2vw,44px)}
.ft-col{min-width:0}
.ft-col-gidsen,.ft-col-tools,.ft-col-over{grid-column:1/-1}
@media (min-width:768px){
  .ft-cols{grid-template-columns:repeat(3,minmax(0,1fr));gap:52px 40px}
  .ft-col-gidsen{grid-column:auto}
  .ft-col-tools{grid-column:1/2}
  .ft-col-over{grid-column:2/-1}
  .ft-n4 .ft-col-over{grid-column:1/-1;max-width:560px}
}
@media (min-width:1100px){
  .ft-cols{grid-template-columns:minmax(max-content,.95fr) .9fr 1.25fr 1fr 1.5fr;gap:48px 36px}
  .ft-col-tools,.ft-col-over{grid-column:auto}
  .ft-cols.ft-n4{grid-template-columns:.9fr 1fr 1.4fr 1.3fr}
  .ft-n4 .ft-col-over{grid-column:auto;max-width:none}
}
.ft .ft-h{font:600 .75rem/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#FFB08F;margin:0 0 14px}

.ft-list li{margin:0}
.ft-list a{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;min-height:36px;padding:5px 0;color:rgba(255,255,255,.84);text-decoration:none;line-height:1.35;
  transition:color .25s,transform .35s var(--ease)}
.ft-list a:hover{color:#fff;transform:translateX(3px)}
.ft-list a:hover{text-decoration:underline;text-decoration-color:var(--terra-lt2);text-decoration-thickness:1px;text-underline-offset:5px}
.ft-list-sm a{font-size:.9rem;min-height:34px;padding:6px 0}
@media (pointer:coarse){.ft-list a,.ft-list-sm a{min-height:44px}}
.ft-sub{font-size:.8rem;color:rgba(255,255,255,.66);font-weight:400}
.ft-sub-blok{display:block;width:100%}
.ft-code{display:inline-grid;place-items:center;min-width:32px;height:22px;padding:0 6px;border-radius:6px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
  color:#fff;font:700 .68rem/1 var(--sans);letter-spacing:.06em;transition:background-color .25s,border-color .25s}
.ft-list a:hover .ft-code{background:var(--terra);border-color:var(--terra)}
.ft-list-landen{columns:1}
/* POLIJST-R2: codeplaatje en landnaam altijd op één regel ('the Netherlands' viel eronder) */
.ft-list-landen a{flex-wrap:nowrap;white-space:nowrap}
@media (max-width:767.98px){.ft-list-landen a{min-height:44px}}
.ft-more{font-weight:600}
.ft-list a.ft-more{color:#fff}
.ft-list-tools a:not(.ft-more){flex-direction:column;align-items:flex-start;gap:1px;padding:7px 0}

/* gidsen: vaste gidsen + per land een link naar de gidsen op de landpagina */
.ft-col-gidsen > .ft-list:first-of-type{margin-bottom:6px}
.ft-list-gl{margin:0 0 6px;padding-top:6px;border-top:1px solid rgba(255,255,255,.1)}
.ft-list-gl a{font-size:.92rem}

/* POLIJST-R3: gidsen per land in een eigen brede rij onder de vijf kolommen (was 2 open <details>, ca. 700 px hoog) */
.ft-col-gpl{position:relative}
.ft .ft-col-gpl.ft-fold{border-top:0}
.ft-col-gpl::before{content:"";position:absolute;top:0;left:var(--gut);right:var(--gut);height:1px;background:rgba(255,255,255,.12)}
@media (min-width:768px){
  .ft-col-gpl{padding-top:clamp(26px,3vw,36px);padding-bottom:clamp(32px,3.2vw,44px)}
  .ft-col-gpl::before{background:rgba(255,255,255,.1)}
}
.ft-gpl{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:18px clamp(24px,3vw,40px)}
.ft-gpl-h{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0 0 4px;color:#fff;font-weight:600}
.ft-gpl-all{margin-left:auto;font-size:.86rem;font-weight:500;color:rgba(255,255,255,.84);text-decoration:underline;text-decoration-color:rgba(255,255,255,.35);text-underline-offset:4px}
@media (min-width:1100px){
  .ft-gpl-l{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}
}

/* in-/uitklapteken: chevron die 180° draait (alleen transform). Was een '+' die tot een terracotta '×' draaide
   en als 'sluiten' las. */
.ft-plus{position:relative;width:12px;height:12px;flex:none;transition:transform .35s var(--ease)}
.ft-plus::before{content:"";position:absolute;left:2px;top:0;width:8px;height:8px;border-right:2px solid var(--terra-lt2);border-bottom:2px solid var(--terra-lt2);border-radius:0 0 2px 0;transform:rotate(45deg)}

/* over ons + MovingCompare-kaart */
.ft-mc{display:grid;grid-template-columns:44px minmax(0,1fr) 20px;align-items:center;gap:12px;padding:16px 18px;margin:0 0 14px;border-radius:16px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);text-decoration:none;color:#fff;
  transition:background-color .3s,border-color .3s,transform .35s var(--ease)}
.ft-mc:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.26);transform:translateY(-2px)}
.ft-mc-logo{width:44px;height:44px;border-radius:11px}
.ft-mc-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.ft-mc-k{white-space:nowrap;font:600 .68rem/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.66)}
.ft-mc-n{font-weight:500;font-size:1.02rem;letter-spacing:-.01em;white-space:nowrap}
.ft-mc-n b{font-weight:700}
.ft-mc-p{grid-column:1/-1;font-size:.86rem;line-height:1.5;color:rgba(255,255,255,.76)}
.ft-mc-go{justify-self:end;font-size:1.1rem;color:var(--terra-lt2);transition:transform .35s var(--ease)}
.ft-mc:hover .ft-mc-go{transform:translateX(4px)}

/* ---------- onderregel ---------- */
.ft-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 32px;padding-top:28px;padding-bottom:36px;position:relative}
.ft-bottom::before{content:"";position:absolute;top:0;left:var(--gut);right:var(--gut);height:1px;background:rgba(255,255,255,.12)}
.ft-logo{display:inline-block;padding:10px 0}
.ft-logo img{height:36px;width:auto}
.ft-legal p{margin:0}
.ft-legal{flex:1 1 320px;font-size:.86rem;line-height:1.6;color:rgba(255,255,255,.74)}
.ft-legal strong{color:var(--terra-lt2)}
.ft-legal a{text-decoration-color:rgba(255,255,255,.4);text-underline-offset:3px}
.ft .legal{color:rgba(255,255,255,.7);letter-spacing:.02em}
.ft-acts{display:flex;flex-wrap:wrap;gap:10px}
.ft-pill{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid rgba(255,255,255,.24);color:#fff;text-decoration:none;font-weight:500;font-size:.92rem;
  transition:background-color .25s,color .25s,border-color .25s}
.ft-pill svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s var(--ease)}
.ft .ft-pill:hover{background:#fff;color:var(--navy);border-color:#fff}
.ft-top:hover svg{transform:translateY(-3px)}

/* ---------- mobiel ---------- */
.ft-tog{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:52px;cursor:pointer;color:inherit;font:inherit;letter-spacing:inherit;text-transform:inherit}
.ft-tog:focus-visible{outline:3px solid var(--terra);outline-offset:3px;border-radius:6px}
.ft-tog[aria-expanded=true] .ft-plus{transform:rotate(180deg)}
@media (max-width:767.98px){
  .ft-cta{padding:56px 0 44px}
  .ft-cta-in{grid-template-columns:1fr;gap:28px}
  .ft-cta h2{max-width:none;font-size:clamp(2rem,8.4vw,2.5rem);margin-bottom:16px}
  .ft-cta-p{font-size:1.02rem;margin-bottom:24px}
  .ft-cta .label{margin-bottom:16px}
  .ft-cta-btns{gap:6px 16px;align-items:center}
  .ft-cta-btns .btn-primary{flex:1 1 100%}
  .ft-cta-btns .btn-ghost{border:0;padding-left:0;padding-right:0;min-height:44px;text-decoration:underline;text-underline-offset:5px;text-decoration-color:rgba(255,255,255,.4)}
  .ft-steps{display:none}
  .ft-line-in{flex-direction:column;align-items:flex-start}
  .ft-cols{display:block;padding-top:36px;padding-bottom:28px}
  .ft-col+.ft-col{margin-top:0}
  .ft-col-landen{margin-bottom:14px}
  .ft-list-landen{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}
  .ft-fold{border-top:1px solid rgba(255,255,255,.12)}
  /* POLIJST-R3: geen eigen onderrand meer onder de laatste kolom — de lijn van .ft-bottom sluit af (stonden er twee) */
  .ft-fold .ft-h{margin:0}
  html.js .ft-fold .ft-h{margin:0}
  html:not(.js) .ft-fold .ft-h{padding-top:18px;margin-bottom:10px}
  .ft-fold .ft-body{padding-bottom:16px}
  .ft-fold.ft-dicht .ft-body{display:none}
  .ft-col-over .ft-mc{margin-top:4px}
  .ft-bottom{flex-direction:column;align-items:flex-start;gap:14px;padding-top:22px;padding-bottom:28px}
  .ft-cols{padding-bottom:0}
  .ft-logo{padding:4px 0}
  .ft-logo img{height:30px}
  .ft-line-l{align-items:flex-start}
  .ft-line-mark{width:48px}
  .ft-legal{flex:none;font-size:.84rem}
  .ft-acts{gap:8px}
  .ft-pill{padding:0 14px}
  html.js .foot.ft{padding-bottom:env(safe-area-inset-bottom)}
  .cta-bar.ft-weg,.cta-bar.ft-weg.show{transform:translateY(110%);visibility:hidden;transition:transform .35s var(--ease),visibility 0s linear .35s}
}
@media (min-width:768px){.ft-tog .ft-plus{display:none}}

/* ---------- beweging uit ---------- */
@media (prefers-reduced-motion:reduce){
  .ft *,.ft *::before,.ft *::after{animation:none!important;transition:none!important}
  html.js-anim .ft-sun-g,.ft-glow,.ft-glow-2{transform:none!important}
  .ft-list a:hover,.ft-mc:hover{transform:none}
}

@media print{.ft-bg,.ft-steps,.ft-cta,.ft-line,.ft-acts{display:none}.foot.ft{background:none;color:#000}}

/* ---------- PORTAAL-NAV-20261001: kolom "Sell with us" (portaal), altijd open, als eerste ---------- */
.ft-list-verkoop a{font-weight:500}
.ft-list-verkoop li:nth-child(2) a{color:#fff;font-weight:600}
@media (min-width:768px) and (max-width:1279.98px){
  /* drie kolommen: verkoop · landen · regio's / gidsen · tools / over ons (volle breedte, zoals bij ft-n4) */
  .ft-cols.ft-met-verkoop{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ft-met-verkoop .ft-col-tools{grid-column:auto}
  .ft-met-verkoop .ft-col-over,.ft-met-verkoop.ft-n4 .ft-col-over{grid-column:1/-1;max-width:560px}
}
@media (min-width:1280px){
  .ft-cols.ft-met-verkoop{grid-template-columns:.72fr minmax(max-content,.85fr) .8fr 1.15fr 1fr minmax(272px,1.5fr);gap:48px 28px}
  .ft-cols.ft-met-verkoop.ft-n4{grid-template-columns:.8fr .9fr 1fr 1.35fr minmax(272px,1.3fr)}
  .ft-met-verkoop .ft-col-tools,.ft-met-verkoop .ft-col-over{grid-column:auto;max-width:none}
}
@media (max-width:767.98px){
  .ft-col-verkoop{margin-bottom:18px}
  .ft-list-verkoop{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}
  .ft-list-verkoop a{min-height:44px}
}

/* ==== syoh-motion.css ==== */
/* SellYourOwnHouse — syoh-motion.css (SYOH-MOTION-20260930). Sitebrede animatielaag bovenop syoh.css.
   ANIMATIE-VAL: alles hangt aan html.syoh-motion (gezet door syoh-motion.js, nooit bij reduced motion).
   Verbergen alleen onder :not(.anim-safe):not(.sm-safe) — na 1500 ms is alles zichtbaar.
   Decoratie (aurora, korrel, glans) is aria-hidden en heeft altijd opacity 1.
   POLIJST-R1-20260930: geen woord-split, geen magneetknoppen, geen pulse; geen navy vlek op crème.
   POLIJST-R2-20260930: ALLEEN transform/opacity (geen clip-path, stroke-dashoffset of background-size meer);
   aurora alleen op hero en contactblok (niet op de voet, die heeft een eigen rustig lichtvlak), geen blobs meer;
   mobiel 1 stilstaande laag; pictogrammen komen als geheel binnen (opacity/scale) in plaats van te tekenen;
   hero-CTA en kaartjes boven de vouw zijn bij de eerste paint zichtbaar (alleen schuiven). */

/* HERO-EERSTE-PAINT (POLIJST-R2): de hoofd-CTA, zwevende kaartjes, het label en de landbalk nooit op opacity 0,
   ook niet kort. Specificiteit wint van syoh.css (html.js-anim:not(.anim-safe) .rv:not(.in)); de h1-regel
   (translateY 105%) blijft winnen omdat die een element meer heeft. */
html.js-anim:not(.anim-safe) .hero .rv:not(.in),html.js-anim:not(.anim-safe) .finder.rv:not(.in){opacity:1;transform:translateY(14px)}

@media (prefers-reduced-motion:no-preference){
html.syoh-motion{--sm-e:cubic-bezier(.22,1,.36,1)}

/* 1. voortgangsbalk (niet op gidspagina's met .readbar) */
.sm-prog{position:fixed;left:0;top:0;z-index:200;width:100%;height:3px;background:var(--terra,#CC4A22);transform:scaleX(0);transform-origin:0 50%;pointer-events:none;will-change:transform}

/* 2. achtergronden: aurora alleen in hero en contactblok (JS kiest), korrel erover */
.sm-host{position:relative;isolation:isolate}
.sm-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1;border-radius:inherit}
.hero>.sm-bg{z-index:-2}
.sm-bg i{position:absolute;display:block;will-change:transform}
.sm-aur i{width:70vmax;height:70vmax;border-radius:50%}
.sm-aur i:nth-child(1){left:-18vmax;top:-30vmax;background:radial-gradient(closest-side,rgba(204,74,34,.3),rgba(204,74,34,0));animation:sm-a1 22s ease-in-out infinite alternate}
.sm-aur i:nth-child(2){right:-22vmax;bottom:-34vmax;background:radial-gradient(closest-side,rgba(245,165,36,.16),rgba(245,165,36,0));animation:sm-a2 27s ease-in-out infinite alternate}
.sm-aur i:nth-child(3){display:none}
.hero>.sm-aur i:nth-child(1){left:auto;right:-10vmax;top:-26vmax}
.contact>.sm-aur i:nth-child(1),.art-cta>.sm-aur i:nth-child(1){background:radial-gradient(closest-side,rgba(255,162,125,.3),rgba(255,162,125,0))}
.sm-aur::after{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@keyframes sm-a1{to{transform:translate3d(-14vmax,10vmax,0) scale(1.15)}}
@keyframes sm-a2{to{transform:translate3d(12vmax,-9vmax,0) scale(.9)}}
.sm-paused .sm-bg i{animation-play-state:paused}
/* mobiel: één laag, stil (middenklasse-Android) */
@media (max-width:767px){
  .sm-aur i:nth-child(n+2){display:none}
  .sm-aur i{animation:none;will-change:auto}
  .sm-aur::after{display:none}
}

/* cursorlichtje in de hero (onder de scrim, dus contrast van de tekst blijft) */
.sm-glow{position:absolute;left:0;top:0;width:560px;height:560px;margin:-280px 0 0 -280px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,214,170,.3),rgba(255,162,125,.12) 45%,rgba(255,162,125,0));pointer-events:none;z-index:-2;transform:translate3d(-999px,-999px,0);will-change:transform}

/* 3. sectiekoppen (max. 3 per pagina, gekozen door JS) schuiven als geheel in */
.sm-head{transition:transform 1s var(--sm-e),opacity .8s var(--sm-e)}
html.syoh-motion:not(.anim-safe):not(.sm-safe) .sm-head:not(.sm-in){opacity:0;transform:translate3d(0,.45em,0)}
html.syoh-motion .sm-head:not(.sm-in){transform:translate3d(0,.2em,0)}

/* gestaffelde kinderen (lijsten zonder eigen .rv) */
.sm-kid{transition:transform .8s var(--sm-e),opacity .7s var(--sm-e);transition-delay:calc(var(--k,0) * 70ms)}
html.syoh-motion:not(.anim-safe):not(.sm-safe) .sm-stag:not(.sm-in)>.sm-kid{opacity:0;transform:translate3d(0,18px,0) scale(.97)}
html.syoh-motion .sm-stag:not(.sm-in)>.sm-kid{transform:translate3d(0,10px,0)}
/* failsafe: na 1500 ms springt de dekking direct naar 1, alleen de beweging loopt nog uit */
html.anim-safe .sm-head,html.sm-safe .sm-head,html.anim-safe .sm-kid,html.sm-safe .sm-kid{opacity:1;transition-property:transform}

/* beelden: alleen lichte parallax (transform) */
.sm-par{transform:translate3d(0,var(--py,0px),0) scale(1.08)}
.art-fig .sm-par{transform:translate3d(0,var(--py,0px),0)}

/* pictogrammen komen als geheel binnen (opacity + scale), alleen onder de vouw */
/* POLIJST-R3: sneller en kleiner (4e pictogram ontbrak nog na 250 ms): 40 ms per kaart, geen extra wachttijd, vanaf .9 */
.sm-ic{transition:transform .55s var(--sm-e),opacity .45s var(--sm-e);transition-delay:calc(var(--k,0) * 40ms)}
html.syoh-motion:not(.anim-safe):not(.sm-safe) .sm-ic:not(.sm-in){opacity:0;transform:scale(.9)}
/* REVIEW-20260930: na anim-safe geen opacity-overgang meer (ANIMATIE-VAL-toets: na 1700 ms stonden pictogrammen nog op 0–0,97). */
html.anim-safe .sm-ic,html.sm-safe .sm-ic{opacity:1;transition-property:transform}

/* POLIJST-R3: het groeiende streepje onder sectielabels (.sm-lab) is weg — dubbel met het '01 —'-nummer. */

/* 5. KENMERKEND MOMENT (POLIJST-R3): de zon uit het logo komt op terwijl je door 'Hoe het werkt' scrolt.
   De tegel staat in de plakkende kop van het blok (desktop). --sp (0..1) volgt de scrollpositie, gezet door
   syoh-motion.js in één rAF per scroll; alleen transform/opacity, geen scroll-jacking. Zonder JS of bij reduced
   motion bestaat de tegel niet (hij is decoratie, aria-hidden). */
.sm-sunrise{display:none}
@media (min-width:900px){
  .sm-sunrise{display:block;position:relative;width:min(260px,70%);aspect-ratio:1;margin:clamp(28px,3vw,44px) 0 0;--sp:0}
  .sm-sr-tile{position:absolute;inset:0;border-radius:24%;overflow:hidden;background:#CC4A22;box-shadow:0 40px 70px -40px rgba(204,74,34,.75),0 10px 24px -14px rgba(27,58,75,.35);transform:translate3d(0,calc((1 - var(--sp)) * 14px),0)}
  .sm-sr-tile svg{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible}
  .sm-sr-glow{position:absolute;left:50%;top:44%;width:120%;aspect-ratio:1;margin-left:-60%;margin-top:-60%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,214,150,.75),rgba(245,165,36,.25) 45%,rgba(245,165,36,0) 72%);opacity:calc(.12 + var(--sp) * .88);transform:scale(calc(.6 + var(--sp) * .5));will-change:transform,opacity}
  .sm-sr-sun{transform:translate3d(0,calc((1 - var(--sp)) * 26px),0);will-change:transform}
  .sm-sr-rays{transform-box:view-box;transform-origin:32px 29.4px;transform:scale(calc(.7 + var(--sp) * .3));opacity:calc(.12 + var(--sp) * .88)}
  .sm-sr-steps{position:absolute;left:0;right:0;bottom:-38px;display:flex;justify-content:center;gap:10px}
  .sm-sr-steps i{display:block;width:34px;height:4px;border-radius:2px;background:rgba(27,58,75,.14);overflow:hidden;position:relative}
  .sm-sr-steps i::after{content:"";position:absolute;inset:0;background:var(--terra,#CC4A22);transform-origin:0 50%;transform:scaleX(var(--f,0))}
}

/* 4. landkaarten (.cc) met 3D-kanteling + glans (alleen muis; JS zet de klassen) */
.sm-fine .sm-tilt{rotate:var(--ax,0) var(--ay,0) 0 var(--aa,0deg);transition:transform .45s var(--sm-e),box-shadow .45s var(--sm-e),background-color .3s,rotate .6s var(--sm-e);transform-style:preserve-3d}
.sm-fine .sm-tilt.sm-hov{transition:transform .45s var(--sm-e),box-shadow .45s var(--sm-e),background-color .3s,rotate .12s linear}
.sm-persp{perspective:1000px}
.sm-glare{position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.26),rgba(255,255,255,0) 55%);transform:scale(0);transition:transform .4s var(--sm-e)}
.sm-hov>.sm-glare{transform:scale(1)}

}
@media (prefers-reduced-motion:reduce){.sm-prog,.sm-bg,.sm-glow,.sm-glare{display:none!important}.sm-head,.sm-kid,.sm-par,.sm-ic{opacity:1!important;transform:none!important}}
@media print{.sm-prog,.sm-bg,.sm-glow,.sm-glare{display:none}}