/* ===========================================================
   SI! Media – eigen aanpassingen (los van WordPress/Elementor)
   =========================================================== */

/* ---------- Logo-marquee ("Wij werken voor") ---------- */
.si-logo-marquee{
  --si-logo-size: 110px;
  --si-logo-gap: 40px;
  width:100%;
  overflow:hidden;
  padding:8px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);
}
.si-logo-track{
  display:flex;
  align-items:center;
  gap:var(--si-logo-gap);
  width:max-content;
  animation:si-logo-scroll 55s linear infinite;
  will-change:transform;
}
.si-logo-marquee:hover .si-logo-track{ animation-play-state:paused; }
.si-logo{
  flex:0 0 auto;
  display:block;
  line-height:0;
}
.si-logo img{
  width:var(--si-logo-size);
  height:var(--si-logo-size);
  border-radius:1000px;
  object-fit:cover;
  display:block;
  transition:transform .3s ease;
  background:#fff;
}
.si-logo:hover img{ transform:scale(1.06); }

@keyframes si-logo-scroll{
  from{ transform:translateX(0); }
  to{ transform:translateX(calc(-50% - (var(--si-logo-gap) / 2))); }
}

@media (max-width:1024px){
  .si-logo-marquee{ --si-logo-size:92px; --si-logo-gap:32px; }
}
@media (max-width:600px){
  .si-logo-marquee{ --si-logo-size:78px; --si-logo-gap:24px; }
  .si-logo-track{ animation-duration:40s; }
}

@media (prefers-reduced-motion:reduce){
  .si-logo-track{ animation:none; flex-wrap:wrap; justify-content:center; width:100%; }
}

/* ===========================================================
   Reviews-carrousel (Google-reviews) – SI! Media huisstijl
   Structuur overgenomen van houwenonline.nl, kleuren = SI! Media
   =========================================================== */
.si-reviews{
  --si-brown:#45322E;
  --si-brown-2:#3E2D29;
  --si-ink:#0E121B;
  --si-accent:#FF8400;
  --si-cream:#FDF7F2;
  --si-taupe:#C8B9AD;
  --si-star:#F6BA62;
  --si-line:rgba(69,50,46,.14);
  --si-muted:#6c635e;
  --si-card:#ffffff;
  --si-r:20px;
  --si-shadow:0 18px 40px -24px rgba(69,50,46,.45);
  font-family:"Neue Haas","Neue Haas Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  color:var(--si-ink);
  background:var(--si-cream);
  padding:88px 24px;
}
.si-reviews__wrap{ max-width:1200px; margin:0 auto; }
.si-reviews__eyebrow{
  display:block; font-size:.74rem; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:var(--si-accent); margin-bottom:14px;
}
.si-reviews .si-reviews__title{
  margin:0; font-family:"Neue Haas","Neue Haas Grotesk",sans-serif;
  font-weight:700; color:var(--si-brown);
  font-size:clamp(1.7rem,3.4vw,2.6rem); line-height:1.12; letter-spacing:-.02em;
}
.si-reviews__title .si-ital{
  font-family:"PP Fragment",Georgia,"Times New Roman",serif;
  font-style:italic; font-weight:500; color:var(--si-accent);
}
.si-reviews__top{
  display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:26px;
}
.si-gbadge{
  display:inline-flex; align-items:center; gap:12px; text-decoration:none; color:inherit;
  background:#fff; border:1px solid var(--si-line); padding:12px 20px; border-radius:100px;
  box-shadow:var(--si-shadow);
}
.si-gbadge .si-glogo{ font-weight:700; font-size:1rem; letter-spacing:-.01em; }
.si-gbadge .si-glogo .b{color:#4285F4}.si-gbadge .si-glogo .r{color:#EA4335}
.si-gbadge .si-glogo .y{color:#FBBC05}.si-gbadge .si-glogo .g{color:#34A853}
.si-gbadge .si-stars{ color:var(--si-star); letter-spacing:2px; font-size:1rem; }
.si-gbadge .si-grate{ font-weight:800; font-size:1.2rem; letter-spacing:-.02em; }
.si-gbadge .si-gsub{ font-size:.8rem; color:var(--si-muted); font-weight:600; }
.si-reviews__intro{ color:var(--si-muted); font-weight:600; max-width:38ch; margin:0; }

.si-rev-carousel{ position:relative; display:flex; align-items:center; gap:12px; margin-top:34px; }
.si-rev-viewport{ overflow:hidden; flex:1; }
.si-rev-track{ display:flex; gap:20px; align-items:stretch; transition:transform .55s cubic-bezier(.4,0,.2,1); will-change:transform; }
.si-rev-track .si-review{ flex:0 0 calc((100% - 40px)/3); box-sizing:border-box; }
.si-review{
  padding:28px 26px; border-radius:var(--si-r); background:var(--si-card);
  border:1px solid var(--si-line); box-shadow:var(--si-shadow);
  display:flex; flex-direction:column; gap:14px;
}
.si-review .si-stars{ color:var(--si-star); letter-spacing:2px; font-size:1rem; }
.si-review p{
  color:#332b27; font-size:.95rem; line-height:1.6; flex:1; margin:0;
  display:-webkit-box; -webkit-line-clamp:8; -webkit-box-orient:vertical; overflow:hidden;
}
.si-review .si-who{ display:flex; align-items:center; gap:12px; }
.si-review .si-av{
  width:46px; height:46px; border-radius:50%; background:var(--si-cream);
  border:2px solid var(--si-accent); display:grid; place-items:center;
  color:var(--si-brown); font-weight:800; font-size:.95rem; flex:none;
}
.si-review .si-who b{ display:block; font-size:.92rem; color:var(--si-ink); }
.si-review .si-who span{ font-size:.8rem; color:var(--si-muted); }
.si-rev-arrow{
  flex:none; width:46px; height:46px; border-radius:50%; border:1px solid var(--si-line);
  background:#fff; color:var(--si-brown); cursor:pointer; display:grid; place-items:center;
  box-shadow:var(--si-shadow); transition:transform .2s,border-color .2s,color .2s;
}
.si-rev-arrow:hover{ border-color:var(--si-accent); color:var(--si-accent); transform:translateY(-1px); }
.si-rev-arrow:focus-visible{ outline:2px solid var(--si-accent); outline-offset:2px; }

@media (max-width:900px){
  .si-rev-track .si-review{ flex-basis:calc((100% - 20px)/2); }
}
@media (max-width:620px){
  .si-reviews{ padding:64px 18px; }
  .si-rev-track .si-review{ flex-basis:100%; }
  .si-rev-arrow{ width:40px; height:40px; }
  .si-rev-carousel{ gap:6px; }
}

/* =====================================================================
   Vanilla-vervanging van Elementor-JS: menu, sticky, cookie, back-to-top
   Werkt op de bestaande Elementor-markup; originele look blijft intact.
   ===================================================================== */

/* Header-balk (.header-container is de zichtbare, fixed balk) — vloeiende overgang */
.elementor-location-header .header-container{
  transition:background .3s ease,box-shadow .3s ease,backdrop-filter .3s ease,border-color .3s ease;
  border-bottom:1px solid transparent;
}
/* Glassmorphism-balk na scroll (menu-tekst is wit → frosted bruine tint voor contrast) */
.elementor-location-header.si-scrolled .header-container{
  background:rgba(62,45,41,.55) !important;
  -webkit-backdrop-filter:blur(16px) saturate(1.3);
          backdrop-filter:blur(16px) saturate(1.3);
  box-shadow:0 10px 34px -20px rgba(0,0,0,.55);
  border-bottom-color:rgba(255,255,255,.10);
}

/* Desktop: dropdown ("Social Media beheer") op hover i.p.v. SmartMenus-JS */
@media(min-width:1025px){
  .elementor-nav-menu--main .menu-item-has-children{position:relative;}
  .elementor-nav-menu--main .menu-item-has-children > .sub-menu{
    display:block !important;position:absolute;top:100%;left:0;min-width:240px;
    opacity:0;visibility:hidden;transform:translateY(10px);pointer-events:none;
    transition:opacity .2s ease,transform .2s ease,visibility .2s ease;
    box-shadow:0 18px 40px -24px rgba(69,50,46,.5);border-radius:12px;overflow:hidden;z-index:60;
  }
  .elementor-nav-menu--main .menu-item-has-children:hover > .sub-menu{
    opacity:1;visibility:visible;transform:none;pointer-events:auto;
  }
}

/* Mobiel menu: Elementor opent op .elementor-active (toggle) via var(--menu-height).
   Die var zet Elementor normaal via JS; wij definiëren 'm zelf. */
.elementor-nav-menu__container.elementor-nav-menu--dropdown{--menu-height:80vh;}
@media(max-width:1024px){
  /* mobiel menu = volledige breedte onder de vaste balk (Elementor-JS deed dit normaal) */
  .elementor-widget-nav-menu .elementor-nav-menu--dropdown.elementor-nav-menu__container{
    position:fixed !important;left:0 !important;right:0 !important;width:100% !important;
    top:var(--si-header-h,64px) !important;margin:0 !important;border-radius:0 !important;
    max-width:none !important;
  }
  .elementor-widget-nav-menu.si-nav-open .elementor-nav-menu--dropdown.elementor-nav-menu__container{
    overflow-y:auto;box-shadow:0 20px 40px -20px rgba(0,0,0,.4);
  }
  /* submenu binnen mobiel menu: dicht tenzij open (via .si-sub-open) */
  .elementor-nav-menu--dropdown .menu-item-has-children > .sub-menu{display:none;}
  .elementor-nav-menu--dropdown .menu-item-has-children.si-sub-open > .sub-menu{display:block;}
}

/* Cookie-banner (eigen, vervangt Complianz) */
.si-cookie{position:fixed;left:20px;right:20px;bottom:20px;z-index:200;max-width:520px;margin:0 auto;
  background:#fff;border:1px solid rgba(69,50,46,.14);border-radius:18px;
  box-shadow:0 24px 60px -20px rgba(0,0,0,.4);padding:24px 26px;
  transform:translateY(160%);transition:transform .4s cubic-bezier(.4,0,.2,1);
  font-family:"Neue Haas",sans-serif;}
.si-cookie.show{transform:translateY(0);}
.si-cookie h4{font-family:"PP Fragment",Georgia,serif;font-weight:800;color:#3E2D29;margin:0 0 8px;font-size:1.15rem;}
.si-cookie p{font-size:.88rem;color:#6c635e;margin:0 0 14px;line-height:1.5;}
.si-cookie__btns{display:flex;gap:10px;flex-wrap:wrap;}
.si-cookie__btns button{font-family:inherit;font-size:13px;font-weight:500;padding:12px 22px;border-radius:100px;border:1px solid transparent;cursor:pointer;transition:background .2s,color .2s,border-color .2s;}
.si-cookie__btns .si-c-accept{background:#45322E;color:#fff;}
.si-cookie__btns .si-c-accept:hover{background:#FF8400;}
.si-cookie__btns .si-c-deny{background:transparent;color:#45322E;border-color:rgba(69,50,46,.2);}
.si-cookie__btns .si-c-deny:hover{border-color:#FF8400;color:#FF8400;}

/* Back-to-top */
.si-backtop{position:fixed;right:22px;bottom:22px;z-index:150;width:46px;height:46px;border-radius:50%;
  background:#45322E;color:#fff;border:0;display:grid;place-items:center;cursor:pointer;
  box-shadow:0 18px 40px -24px rgba(69,50,46,.6);opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .3s,transform .3s,background .2s;}
.si-backtop.show{opacity:1;visibility:visible;transform:translateY(0);}
.si-backtop:hover{background:#FF8400;}

/* JetEngine-slider zonder Swiper: forceer volledige breedte + horizontale flexrail */
.jet-listing-grid__slider{width:100%;display:block;overflow:hidden;}
.jet-listing-grid__slider > .swiper-wrapper{width:100%;box-sizing:border-box;flex-wrap:nowrap;}
.jet-listing-grid__slider .swiper-slide{height:auto;}
.si-jet-arrows{display:flex;gap:10px;justify-content:center;margin-top:18px;}
.si-jet-arrows .jet-listing-grid__slider-icon{width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid rgba(69,50,46,.14);display:grid;place-items:center;cursor:pointer;box-shadow:0 8px 24px -16px rgba(69,50,46,.5);}
.si-jet-arrows .jet-listing-grid__slider-icon svg{width:18px;height:18px;}

/* Fix: Elementor-kit zet button-color op wit (.elementor-kit-16 button) → chevrons onzichtbaar.
   Hogere specificiteit zodat de blader-pijlen weer zichtbaar zijn (currentColor drijft de SVG). */
.si-reviews .si-rev-arrow{color:var(--si-brown);}
.si-reviews .si-rev-arrow:hover{color:var(--si-accent);}
.si-reviews .si-rev-arrow svg{stroke:currentColor;}

/* Eenvoudige content-hero voor bedankt- en 404-pagina (huisstijl) */
.si-page-hero{background:var(--si-cream,#FDF7F2);padding:180px 24px 120px;text-align:center;}
.si-page-hero__inner{max-width:640px;margin:0 auto;}
.si-page-hero h1{font-family:"PP Fragment",Georgia,serif;font-weight:300;color:#45322E;font-size:clamp(2.2rem,6vw,3.6rem);line-height:1.05;margin:0 0 18px;}
.si-page-hero p{color:#6c635e;font-size:1.1rem;line-height:1.6;margin:0 0 30px;}
.si-page-hero .si-btn{display:inline-flex;align-items:center;gap:10px;background:#45322E;color:#fff;font-weight:500;font-size:14px;padding:16px 30px;border-radius:100px;text-decoration:none;transition:background .2s,transform .2s;}
.si-page-hero .si-btn:hover{background:#FF8400;transform:translateY(-2px);}

/* Cookie-banner: policy-link */
.si-cookie p a{color:#FF8400;text-decoration:underline;font-weight:600;}
/* Gerelateerde-dienst blok (cases -> dienst) */
.si-related{max-width:1140px;margin:0 auto;padding:40px 24px 10px;text-align:center;}
.si-related a{display:inline-flex;align-items:center;gap:10px;background:#45322E;color:#fff;font-family:"Neue Haas",sans-serif;font-weight:500;font-size:14px;padding:15px 28px;border-radius:100px;text-decoration:none;transition:background .2s,transform .2s;}
.si-related a:hover{background:#FF8400;transform:translateY(-2px);}

/* ---------- Social-proof / trust-row bij de hero-knop ---------- */
.si-trust{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:28px;}
.si-avatars{display:flex;}
.si-avatars span{width:46px;height:46px;border-radius:50%;border:3px solid rgba(255,255,255,.92);margin-left:-14px;overflow:hidden;box-shadow:0 4px 12px -4px rgba(0,0,0,.45);}
.si-avatars span:first-child{margin-left:0;}
.si-avatars span img{width:100%;height:100%;object-fit:cover;display:block;}
.si-sp-txt{font-family:"Neue Haas","Neue Haas Grotesk",sans-serif;font-weight:700;font-size:1rem;line-height:1.2;color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.35);letter-spacing:-.01em;}
.si-sp-txt small{display:block;color:rgba(255,255,255,.88);font-weight:500;font-size:.82rem;margin-top:2px;text-shadow:0 1px 8px rgba(0,0,0,.3);}
.si-gp{display:inline-flex;align-items:center;gap:10px;text-decoration:none;padding:7px 16px 7px 10px;border-radius:100px;background:#fff;box-shadow:0 10px 26px -12px rgba(0,0,0,.45);transition:transform .2s,box-shadow .2s;}
.si-gp:hover{transform:translateY(-1px);box-shadow:0 14px 30px -12px rgba(0,0,0,.55);}
.si-gp-g{flex:none;}
.si-gp-txt{display:flex;flex-direction:column;line-height:1.18;}
.si-gp-stars{color:#FBBC04;font-size:1rem;letter-spacing:1.5px;}
.si-gp-txt small{color:#6c635e;font-weight:600;font-size:.76rem;margin-top:1px;}
@media(max-width:600px){.si-trust{gap:14px;} .si-avatars span{width:40px;height:40px;margin-left:-13px;}}

/* Trust-widget donkere variant (op lichte CTA-sectie onderaan) */
.si-trust--dark{order:10;flex:0 0 100%;width:100%;justify-content:flex-start;margin-top:22px;}
.e-con:has(> .si-trust--dark){flex-wrap:wrap;}
@media(max-width:1024px){.si-trust--dark{justify-content:center;}}
.si-trust--dark .si-sp-txt{color:#45322E;text-shadow:none;}
.si-trust--dark .si-sp-txt small{color:#6c635e;text-shadow:none;}
.si-trust--dark .si-avatars span{border-color:#fff;box-shadow:0 4px 12px -4px rgba(69,50,46,.35);}
.si-trust--dark .si-gp{border:1px solid rgba(69,50,46,.14);box-shadow:0 8px 24px -14px rgba(69,50,46,.4);}

/* HTML-sitemap pagina */
.si-sitemap{background:#FDF7F2;padding:150px 24px 100px;}
.si-sitemap__wrap{max-width:900px;margin:0 auto;}
.si-sitemap h1{font-family:"PP Fragment",Georgia,serif;font-weight:300;color:#45322E;font-size:clamp(2rem,5vw,3rem);margin:0 0 10px;}
.si-sitemap .lead{color:#6c635e;font-size:1.05rem;margin:0 0 40px;}
.si-sitemap__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:32px;}
.si-sitemap__col h2{font-family:"Neue Haas",sans-serif;font-weight:700;color:#45322E;font-size:1.1rem;margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid rgba(69,50,46,.14);}
.si-sitemap__col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
.si-sitemap__col a{color:#4b423d;text-decoration:none;font-size:.96rem;transition:color .2s;}
.si-sitemap__col a:hover{color:#FF8400;}

/* ===== Kruimelpad (breadcrumbs) — subpagina's ===== */
.si-crumbs{max-width:1140px;margin:0 auto;padding:20px 24px 4px;}
.si-crumbs ol{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;padding:0;font-family:"Neue Haas","Neue Haas Grotesk",sans-serif;font-size:.82rem;line-height:1.4;}
.si-crumbs li{display:flex;align-items:center;gap:8px;color:#8a7d76;}
.si-crumbs li:not(:last-child)::after{content:"\203A";color:#c8bcb4;font-size:1em;}
.si-crumbs a{color:#6c635e;text-decoration:none;transition:color .2s;}
.si-crumbs a:hover{color:#FF8400;}
.si-crumbs [aria-current="page"]{color:#45322E;font-weight:600;}

/* ===== Toegankelijkheid: skip-link + focus-states ===== */
.si-skip{position:fixed;top:12px;left:12px;z-index:100001;background:#45322E;color:#fff;padding:12px 22px;border-radius:12px;font-family:"Neue Haas","Neue Haas Grotesk",sans-serif;font-weight:600;font-size:.95rem;text-decoration:none;box-shadow:0 12px 30px -12px rgba(0,0,0,.5);transform:translateY(-160%);transition:transform .18s ease;}
.si-skip:focus{transform:translateY(0);outline:3px solid #FF8400;outline-offset:3px;}
:where(a,button,input,textarea,select,summary,[tabindex="0"]):focus-visible{outline:3px solid #FF8400;outline-offset:2px;border-radius:5px;}
.si-rev-arrow:focus-visible,.si-backtop:focus-visible,.elementor-menu-toggle:focus-visible{outline:3px solid #FF8400;outline-offset:3px;}

/* ===== Oranje bolletje op de hero Get-in-touch knop (zoals de andere CTA's) ===== */
a.elementor-button:has(> .si-btn-dot){position:relative;overflow:visible;}
.si-btn-dot{position:absolute;top:-7px;right:-7px;margin:0;}

/* ===== Glim/shine op knoppen die horizontaal naast elkaar staan ===== */
.si-shine-btn{position:relative;overflow:hidden;isolation:isolate;}
.si-shine-btn::after{content:"";position:absolute;top:0;left:-160%;width:70%;height:100%;background:linear-gradient(100deg,transparent 0%,rgba(255,255,255,.55) 50%,transparent 100%);transform:skewX(-18deg);opacity:0;pointer-events:none;z-index:2;}
.si-shine-btn.si-shine::after{animation:si-sheen 1s ease;}
@keyframes si-sheen{0%{left:-160%;opacity:0;}12%{opacity:1;}100%{left:170%;opacity:0;}}
@media(prefers-reduced-motion:reduce){.si-shine-btn.si-shine::after{animation:none;}}