/* Klus Expert — gedeelde motion-laag + footer-verfrissing */
:root{--ke-ease:cubic-bezier(.2,.7,.2,1)}

/* ── 1. Scroll-reveal ───────────────────────────── */
.ke-rv{opacity:0;transform:translateY(20px)}
.ke-rv.ke-in{opacity:1;transform:none;transition:opacity .7s var(--ke-ease),transform .7s var(--ke-ease)}

/* ── 2. Grow / hover ────────────────────────────── */
.dienst-card{transition:transform .28s var(--ke-ease),box-shadow .28s var(--ke-ease)}
.dienst-card:hover,.dienst-card:focus-visible{transform:translateY(-6px) scale(1.012);box-shadow:0 22px 48px rgba(0,0,0,.16)}
.dienst-card>img{transition:transform .55s var(--ke-ease)}
.dienst-card:hover>img{transform:scale(1.06)}
#galerij figure,#werk figure{overflow:hidden;border-radius:14px}
#galerij figure img,#werk figure img{transition:transform .55s var(--ke-ease)}
#galerij figure:hover img,#werk figure:hover img{transform:scale(1.05)}

/* ── 3. Carrousel (dots · pijlen · snap · auto-slide) ── */
.ke-car{position:relative}
.ke-car-track{display:flex!important;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;padding-bottom:6px;scrollbar-width:thin}
.ke-car-track::-webkit-scrollbar{height:6px}
.ke-car-track::-webkit-scrollbar-thumb{background:var(--primary-light,#F0925A);border-radius:99px}
.ke-car-track::-webkit-scrollbar-track{background:transparent}
.ke-car-track>*{flex:0 0 auto;scroll-snap-align:start;width:calc((100% - 32px)/3);margin:0}
@media(max-width:900px){.ke-car-track>*{width:calc((100% - 16px)/2)}}
@media(max-width:640px){.ke-car-track>*{width:86%}}
.ke-car-nav{position:absolute;top:44%;transform:translateY(-50%);z-index:3;width:44px;height:44px;border-radius:50%;border:0;background:#fff;color:var(--primary-dark,#C24A18);box-shadow:0 8px 22px rgba(0,0,0,.18);display:grid;place-items:center;cursor:pointer;transition:transform .2s var(--ke-ease),opacity .2s}
.ke-car-nav:hover{transform:translateY(-50%) scale(1.1)}
.ke-car-nav:disabled{opacity:.3;cursor:default}
.ke-car-nav:disabled:hover{transform:translateY(-50%)}
.ke-car-prev{left:-12px}.ke-car-next{right:-12px}
@media(max-width:1080px){.ke-car-prev{left:2px}.ke-car-next{right:2px}}
@media(max-width:640px){.ke-car-nav{display:none}}
.ke-car-dots{display:flex;justify-content:center;gap:8px;margin-top:1.2rem}
.ke-car-dots button{width:9px;height:9px;border-radius:50%;border:0;padding:0;background:rgba(0,0,0,.18);cursor:pointer;transition:width .25s var(--ke-ease),background .25s}
.ke-car-dots button[aria-current="true"]{background:var(--accent,#E85D24);width:26px;border-radius:99px}
.section--soft .ke-car-dots button{background:rgba(0,0,0,.22)}

/* ── 4. Footer: merk-kleuren + VOLLEDIGE gedeelde layout (alle paginas) ─────── */
/* Merk-getinte donkere basis: leesbaar, subtiel oranje/blauw brand-glow + brand-haarlijn. */
.site-footer{
  position:relative;
  padding-top:clamp(3rem,6vw,4.5rem);
  color:rgba(255,255,255,.78);
  background:
    radial-gradient(1200px 420px at 12% -12%,rgba(232,93,36,.18),transparent 60%),
    radial-gradient(1000px 360px at 100% 0%,rgba(79,116,239,.12),transparent 55%),
    linear-gradient(180deg,#20202F 0%,#191D2C 55%,#131725 100%);
}
.site-footer::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--brand-grad,linear-gradient(90deg,#E85D24,#F6B02A,#E0407A,#8B3FD0,#4F74EF))}

/* -- gedeelde layout (voorheen alleen inline op index.html) -- */
.footer-inner{width:100%;max-width:var(--wrap,1200px);margin-inline:auto;padding-inline:clamp(1.1rem,4vw,2rem);display:grid;grid-template-columns:1.6fr 1fr 1.1fr;gap:clamp(2rem,4vw,3.5rem);padding-bottom:2.8rem}
.brand--footer{display:inline-flex;align-items:center;gap:.6rem;color:#fff;font-size:1.4rem;text-decoration:none}
.site-footer .brand-logo{height:64px;width:auto;background:#fff;border-radius:50%;padding:2px;flex:none}
.footer-tag{margin-top:1.1rem;color:rgba(255,255,255,.75);font-size:.98rem;max-width:44ch}
.footer-rating{display:flex;align-items:center;gap:.7rem;margin-top:1.4rem}
.footer-rating .stars{color:var(--star,#F5A623);display:inline-flex;gap:1px}
.footer-rating-text{font-size:.92rem;color:rgba(255,255,255,.86)}
.footer-rating-text strong{color:#fff}
.footer-links,.footer-contact{list-style:none;margin:0;padding:0}
.footer-links li,.footer-contact li{margin-bottom:.7rem}
.footer-contact li{display:flex;align-items:center;gap:.7rem}
.fc-ico{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:rgba(255,255,255,.08);color:var(--primary-light,#F0925A);flex:none}
.footer-links a{font-size:.98rem;display:inline-block;transition:color .18s var(--ke-ease),padding .18s var(--ke-ease)}
.footer-links a:hover{padding-left:4px}
.footer-cta{display:inline-block;margin-top:1.4rem;padding:.72rem 1.5rem;border-radius:var(--r-pill,999px);background:var(--accent,#E85D24);color:#fff!important;font-weight:700;text-decoration:none;box-shadow:0 10px 24px rgba(232,93,36,.32);transition:transform .2s var(--ke-ease),box-shadow .2s var(--ke-ease),background .2s var(--ke-ease)}
.footer-cta:hover,.footer-cta:focus-visible{background:var(--accent-dark,#CF4C17);transform:translateY(-2px);box-shadow:0 14px 30px rgba(232,93,36,.4)}
.footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem;max-width:var(--wrap,1200px);margin:.5rem auto 0;padding:1.5rem clamp(1.1rem,4vw,2rem);border-top:1px solid rgba(255,255,255,.1);font-size:.85rem;color:rgba(255,255,255,.55)}
.footer-bottom p{margin:0}
.footer-legal{color:rgba(255,255,255,.45)}

/* -- merk-getinte koppen + links -- */
.site-footer .footer-heading{color:var(--primary-light,#F0925A);font-size:.95rem;text-transform:uppercase;letter-spacing:.1em;margin-bottom:1.2rem;position:relative;padding-bottom:.55rem}
.site-footer .footer-heading::after{content:"";position:absolute;left:0;bottom:0;width:28px;height:2px;background:var(--accent,#E85D24);border-radius:2px}
.site-footer .footer-tag{color:rgba(255,255,255,.75)}
.site-footer .footer-rating-text{color:rgba(255,255,255,.86)}
.site-footer a{color:rgba(255,255,255,.78);transition:color .2s var(--ke-ease)}
.site-footer a:hover,.site-footer a:focus-visible{color:var(--primary-light,#F0925A)}
.site-footer .footer-cta,.site-footer .footer-cta:hover,.site-footer .footer-cta:focus-visible{color:#fff}

@media(max-width:860px){.footer-inner{grid-template-columns:1fr 1fr;gap:2rem}.footer-brand{grid-column:1 / -1}}
@media(max-width:560px){.footer-inner{grid-template-columns:1fr}.footer-bottom{flex-direction:column}}

/* ── 5. Reduced motion ──────────────────────────── */
@media(prefers-reduced-motion:reduce){
  .ke-rv,.ke-rv.ke-in{opacity:1;transform:none;transition:none}
  .ke-car-track{scroll-behavior:auto}
  .dienst-card:hover,.dienst-card:focus-visible{transform:none}
  .dienst-card:hover>img,#galerij figure:hover img,#werk figure:hover img{transform:none}
  .ke-car-nav:hover{transform:translateY(-50%)}
}

/* ── Reviews-marquee (naar voorbeeld martis-dakonderhoud.nl) ── */
.krev{position:relative;overflow:hidden;padding:6px 0 4px;margin-top:8px}
.krev::before,.krev::after{content:"";position:absolute;top:0;bottom:0;width:90px;z-index:2;pointer-events:none}
.krev::before{left:0;background:linear-gradient(to right,var(--white,#fff),rgba(255,255,255,0))}
.krev::after{right:0;background:linear-gradient(to left,var(--white,#fff),rgba(255,255,255,0))}
.krev-track{display:flex;width:max-content;animation:krev-scroll 34s linear infinite;will-change:transform}
.krev:hover .krev-track,.krev:focus-within .krev-track{animation-play-state:paused}
@keyframes krev-scroll{from{transform:translate3d(0,0,0)}to{transform:translate3d(-33.3333%,0,0)}}
.krev-card{flex:0 0 360px;width:360px;box-sizing:border-box;background:var(--white,#fff);border:1px solid var(--line,#e6edee);border-radius:18px;padding:22px 24px;box-shadow:0 10px 30px rgba(17,20,28,.08);display:flex;flex-direction:column;margin-right:20px}
.krev-top{display:flex;align-items:center;gap:13px;margin-bottom:10px}
.krev-av{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:15px;letter-spacing:.4px;flex-shrink:0}
.krev-meta{display:flex;flex-direction:column;min-width:0}
.krev-name{font-weight:700;color:var(--secondary,#1c2333);font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.krev-date{font-size:.8rem;color:var(--ink-soft,#64748b)}
.krev-g{margin-left:auto;flex-shrink:0;display:flex}
.krev-stars{color:#F5A623;letter-spacing:2px;font-size:1rem;line-height:1}
.krev-text{margin:10px 0 0;color:var(--secondary,#1c2333);font-size:.94rem;line-height:1.55;display:-webkit-box;-webkit-line-clamp:7;-webkit-box-orient:vertical;overflow:hidden}
@media(max-width:640px){.krev-card{flex:0 0 290px;width:290px;padding:18px 19px;margin-right:14px}.krev::before,.krev::after{width:44px}}
@media(prefers-reduced-motion:reduce){.krev-track{animation:none}.krev{overflow-x:auto;scroll-snap-type:x mandatory}.krev-card{scroll-snap-align:start}}

/* ── FAB's wegduiken bij de footer (blokkeerden de tekst op mobiel) ── */
#ke-fab,#ke-wa,.wa-fab{transition:transform .38s var(--ke-ease),opacity .28s ease}
html.ke-footer-in #ke-wa,html.ke-footer-in .wa-fab,html.ke-footer-in #ke-fab{transform:translateY(190%) scale(.92);opacity:0;pointer-events:none}
/* chat open? knop blijft staan */
html.ke-footer-in:has(#ke-panel.on) #ke-fab{transform:none;opacity:1;pointer-events:auto}
@media(prefers-reduced-motion:reduce){#ke-fab,#ke-wa,.wa-fab{transition:opacity .01s}}


/* ══ Fase 2 — Apple-polish (additief, 2026-07-10) ══════════ */
#ke-progress{position:fixed;top:0;left:0;height:3px;width:0;z-index:9999;background:var(--brand-grad,linear-gradient(90deg,#E85D24,#F6B02A,#E0407A,#8B3FD0,#4F74EF));pointer-events:none;border-radius:0 3px 3px 0;box-shadow:0 1px 6px rgba(232,93,36,.35)}
.section-head--center h2{position:relative}
.section-head--center h2::after{content:"";display:block;width:52px;height:4px;margin:.75rem auto 0;border-radius:99px;background:var(--brand-grad,linear-gradient(90deg,#E85D24,#F6B02A))}