.elementor-kit-6{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-1eb1d39:#193783;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* =========================================================
   Rijbewijskeuring Zaanstad — Ultra Strak Elementor Kit (v2)
   Elementor Pro + Containers
   ========================================================= */

/* ---------- Design tokens ---------- */
:root{
  /* Zaanstad palette */
  --za-cyan:#00A5C7;      /* hoofdaccent */
  --za-blue:#0066B3;      /* CTA / links */
  --za-red:#BC0B4F;       /* alert / important */
  --za-green:#00AB4E;     /* success */
  --za-violet:#4B3369;    /* contrast / donkeraccent */
  --za-purple:#9B258F;    /* extra accent */

  /* Neutrals */
  --za-text:#111111;
  --za-body:#2A2F36;
  --za-muted:#5B6470;
  --za-bg:#F6F8FB;
  --za-white:#FFFFFF;
  --za-border:rgba(17,17,17,.10);

  /* Radius + shadow */
  --za-r-sm:12px;
  --za-r-md:16px;
  --za-r-lg:20px;

  --za-shadow-sm:0 8px 22px rgba(0,0,0,.08);
  --za-shadow-md:0 14px 38px rgba(0,0,0,.10);

  /* Spacing */
  --za-pad-x:clamp(14px, 2.2vw, 22px);
  --za-section-y:clamp(34px, 5vw, 66px);

  /* Type */
  --za-font: Arial, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
}

/* ---------- Base ---------- */
html{ scroll-behavior:smooth; }
body{
  font-family:var(--za-font);
  color:var(--za-body);
  background:
    radial-gradient(900px 420px at 10% 0%, rgba(0,165,199,.10), transparent 60%),
    radial-gradient(900px 420px at 90% 0%, rgba(0,102,179,.08), transparent 60%),
    var(--za-white);
}

:where(a, button, input, textarea, select){
  -webkit-tap-highlight-color: transparent;
}

:focus-visible{
  outline:3px solid rgba(0,165,199,.45);
  outline-offset:3px;
  border-radius:10px;
}

/* Elementor typography polish (safe) */
.elementor h1,.elementor h2,.elementor h3,.elementor h4,.elementor h5,.elementor h6{
  color:var(--za-text);
  letter-spacing:-0.02em;
}
.elementor p{ line-height:1.7; }
.elementor .elementor-widget-text-editor{ color:var(--za-body); }

/* Links */
.elementor a{
  color:var(--za-blue);
  text-decoration-thickness:2px;
  text-underline-offset:3px;
}
.elementor a:hover{ color:var(--za-violet); }

/* ---------- Utility classes (gebruik in Advanced → CSS Classes) ---------- */

/* Strakke section spacing */
.za-section{
  padding-block: var(--za-section-y);
}
.za-section--alt{
  background:var(--za-bg);
}
.za-section--soft{
  background:
    radial-gradient(900px 420px at 20% 0%, rgba(0,165,199,.10), transparent 55%),
    radial-gradient(900px 420px at 80% 0%, rgba(75,51,105,.07), transparent 55%),
    var(--za-bg);
}

/* Max-width wrapper (alleen als je zelf wilt sturen) */
.za-wrap{
  max-width: 1180px;
  margin-inline: auto;
  padding-inline: var(--za-pad-x);
}

/* Cards */
.za-card{
  background:var(--za-white);
  border:1px solid var(--za-border);
  border-radius:var(--za-r-md);
  box-shadow:var(--za-shadow-sm);
  padding: clamp(18px, 2.4vw, 26px);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.za-card:hover{
  transform: translateY(-2px);
  box-shadow:var(--za-shadow-md);
  border-color: rgba(0,165,199,.22);
}

/* Card title accent */
.za-title{
  position:relative;
  padding-bottom:12px;
  margin-bottom:10px;
}
.za-title:after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:68px;
  height:4px;
  border-radius:999px;
  background:var(--za-cyan);
}

/* Badge / pill */
.za-badge{
  display:inline-flex;
  align-items:center;
  gap:.5em;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(0,165,199,.22);
  background: rgba(0,165,199,.08);
  color: var(--za-text);
  font-weight:700;
  font-size: 14px;
}

/* ---------- Buttons (class-based) ---------- */
.za-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55em;

  padding: 14px 22px;
  border-radius: 14px;
  font-weight: 800;
  text-decoration: none !important;
  border: 1px solid transparent;

  box-shadow: 0 12px 26px rgba(0,0,0,.10);
  transition: transform .16s ease, filter .16s ease, box-shadow .16s ease;
  will-change: transform;
}
.za-btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 16px 34px rgba(0,0,0,.12);
}
.za-btn--primary{
  background: var(--za-blue);
  color: #fff !important;
}
.za-btn--primary:hover{ filter: brightness(.94); }

.za-btn--secondary{
  background: rgba(0,165,199,.14);
  border-color: rgba(0,165,199,.28);
  color: var(--za-text) !important;
}
.za-btn--secondary:hover{ filter: brightness(.98); }

/* ---------- Elementor buttons (site-wide strak, zonder classes) ---------- */
/* (Als je dit té dwingend vindt: zeg het, dan zet ik het “opt-in” via .za-skin) */
.elementor a.elementor-button,
.elementor .elementor-button{
  border-radius:14px !important;
  font-weight:800 !important;
  box-shadow: 0 12px 26px rgba(0,0,0,.10);
  transition: transform .16s ease, filter .16s ease, box-shadow .16s ease;
}
.elementor a.elementor-button:hover,
.elementor .elementor-button:hover{
  transform: translateY(-1px);
  box-shadow: 0 16px 34px rgba(0,0,0,.12);
}

/* ---------- Forms (Elementor Pro Forms) ---------- */
.elementor-form input:not([type="checkbox"]):not([type="radio"]),
.elementor-form textarea,
.elementor-form select{
  background: #fff;
  border: 1px solid rgba(17,17,17,.14) !important;
  border-radius: 14px !important;
  padding: 14px 14px !important;
  color: var(--za-text) !important;
  transition: border-color .16s ease, box-shadow .16s ease;
}
.elementor-form input:focus,
.elementor-form textarea:focus,
.elementor-form select:focus{
  border-color: rgba(0,165,199,.55) !important;
  box-shadow: 0 0 0 4px rgba(0,165,199,.18) !important;
}
.elementor-form .elementor-message{
  border-radius:14px;
}

/* Submit button: standaard in CTA-blauw */
.elementor-form .elementor-button{
  background: var(--za-blue) !important;
  color:#fff !important;
  border:1px solid rgba(0,0,0,.05) !important;
}
.elementor-form .elementor-button:hover{ filter:brightness(.94); }

/* ---------- Accordion / FAQ (Elementor Accordion) ---------- */
.elementor-accordion .elementor-tab-title{
  border-radius: 14px !important;
  border:1px solid var(--za-border) !important;
  padding: 16px 16px !important;
  background:#fff !important;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.elementor-accordion .elementor-tab-title:hover{
  transform: translateY(-1px);
  box-shadow: var(--za-shadow-sm);
  border-color: rgba(0,165,199,.22) !important;
}
.elementor-accordion .elementor-tab-content{
  border:1px solid var(--za-border) !important;
  border-top:none !important;
  border-radius: 0 0 14px 14px !important;
  background:#fff !important;
}

/* ---------- Icon List netter ---------- */
.elementor-icon-list-item{
  padding-block:6px;
}
.elementor-icon-list-icon i,
.elementor-icon-list-icon svg{
  color: var(--za-cyan) !important;
}

/* ---------- “Locatie cards” grid helper ---------- */
.za-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 2.2vw, 20px);
}
@media (max-width: 1024px){
  .za-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px){
  .za-grid{ grid-template-columns: 1fr; }
}

/* Optional: CTA row die altijd netjes blijft */
.za-cta-row{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}
.za-cta-row > *{ flex: 0 0 auto; }
@media (max-width: 520px){
  .za-cta-row > *{
    width:100%;
  }
}

/* ---------- Subtiele “medisch-clean” separators ---------- */
.za-divider{
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(0,165,199,.35), transparent);
  border-radius:999px;
}

/* Avoid anchor jumps behind sticky headers (pas aan indien nodig) */
:where(.elementor a[id], .elementor h2[id], .elementor h3[id]){ scroll-margin-top: 90px; }
/* Temvez CTA links altijd als button behandelen */
a.za-btn[href*="app.temvez.nl"]{
  text-decoration:none !important;
}
a[href*="app.temvez.nl"]::after{
  content:" ↗";
  font-weight:700;
  opacity:.65;
}
.za-btn[href*="app.temvez.nl"]::after{
  content:"";
}
/* STOER: dark premium background (single pages) */
body.single{
  background:#0b1220;
}

body.single::before{
  content:"";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;

  background:
    /* zachte grid / tech vibe */
    repeating-linear-gradient(
      0deg,
      rgba(255,255,255,.035) 0,
      rgba(255,255,255,.035) 1px,
      transparent 1px,
      transparent 64px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(255,255,255,.028) 0,
      rgba(255,255,255,.028) 1px,
      transparent 1px,
      transparent 64px
    ),

    /* Zaanstad glow (blauw + rood) */
    radial-gradient(900px 420px at 18% 12%, rgba(11,94,168,.28), transparent 62%),
    radial-gradient(820px 380px at 86% 22%, rgba(215,38,43,.18), transparent 60%),

    /* basis verloop */
    linear-gradient(180deg, #0b1220 0%, #0a1020 55%, #070b14 100%);
}

}

/* optioneel: content “kaart” effect verbeteren (als je veel witte blokken hebt) */
body.single .elementor-section-wrap > .elementor-section,
body.page .elementor-section-wrap > .elementor-section{
  position: relative;
}
/* ===== Zaanstad Header (scoped) ===== */
.za-topbar, .za-nav { width:100%; }
.elementor-location-header{ z-index:9999; }

/* Topbar */
.za-topbar{
  background: linear-gradient(90deg, rgba(11,94,168,.96), rgba(11,94,168,.72));
  color: rgba(255,255,255,.94);
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.za-topbar .za-wrap{
  max-width: 1320px;
  margin: 0 auto;
  padding: 10px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  flex-wrap:wrap;
}
.za-topbar-left{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.za-topbar-right{ opacity:.9; }

.za-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 10px 18px rgba(0,0,0,.10);
  color:#fff;
  text-decoration:none;
  transform: translateZ(0);
}
.za-pill:hover{ background: rgba(255,255,255,.18); transform: translateY(-1px); }

/* Strakke iconen (SVG) */
.za-pill--tel::before,
.za-pill--mail::before{
  content:"";
  width:16px; height:16px;
  display:inline-block;
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  opacity:.95;
}
.za-pill--tel::before{
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='%23ffffff'%20d='M6.62%2010.79a15.053%2015.053%200%200%200%206.59%206.59l2.2-2.2a1%201%200%200%201%201.01-.24c1.12.37%202.33.57%203.58.57a1%201%200%200%201%201%201V20a1%201%200%200%201-1%201C10.07%2021%203%2013.93%203%205a1%201%200%200%201%201-1h3.5a1%201%200%200%201%201%201c0%201.25.2%202.46.57%203.59a1%201%200%200%201-.25%201.01l-2.2%202.19z'/%3E%3C/svg%3E");
}
.za-pill--mail::before{
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='%23ffffff'%20d='M20%204H4a2%202%200%200%200-2%202v12a2%202%200%200%200%202%202h16a2%202%200%200%200%202-2V6a2%202%200%200%200-2-2zm0%204-8%205-8-5V6l8%205%208-5v2z'/%3E%3C/svg%3E");
}

/* Nav (sticky glass) */
.za-nav{
  position: sticky;
  top: 0;
  z-index: 9999;
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.80));
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(17,24,39,.10);
  box-shadow: 0 10px 26px rgba(17,24,39,.08);
}
.za-nav::after{
  content:"";
  display:block;
  height: 3px;
  background: linear-gradient(90deg, #0b5ea8, #d7262b);
  opacity:.95;
}
.za-nav .za-wrap{
  max-width: 1320px;
  margin: 0 auto;
  padding: 18px 20px; /* lekker wat hoger */
  display:flex;
  align-items:center;
  gap:16px;
}

/* CTA knop */
.za-header-cta .elementor-button{
  background: linear-gradient(90deg, #d7262b, #b91c1c) !important;
  border-radius: 14px !important;
  font-weight: 800 !important;
  box-shadow: 0 14px 30px rgba(215,38,43,.22);
}
.za-header-cta .elementor-button:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 38px rgba(215,38,43,.30);
}

/* Mobiel: topbar compacter */
@media (max-width: 900px){
  .za-topbar-right{ display:none; }
  .za-topbar .za-wrap{ justify-content:center; padding: 8px 12px; }
  .za-nav .za-wrap{ padding: 14px 14px; }
}/* End custom CSS */