.elementor-kit-4{--e-global-color-primary:#0A1628;--e-global-color-secondary:#4B5568;--e-global-color-text:#1A2233;--e-global-color-accent:#F26322;--e-global-color-vvhover:#F47B2A;--e-global-color-vvortxt:#C2410C;--e-global-color-vvred:#ED1C24;--e-global-color-vvyellow:#FCEE1D;--e-global-color-vvpeach:#FFF3EA;--e-global-color-vvmist:#F5F6F8;--e-global-color-vvwhite:#FFFFFF;--e-global-color-vvline:#E4E7EC;--e-global-color-vvfield:#7A8496;--e-global-color-vvinkm:#A9B3C7;--e-global-color-vvdeep:#060E1B;--e-global-color-vverr:#B42318;--e-global-color-vvok:#1E7A46;--e-global-typography-primary-font-family:"Bricolage Grotesque";--e-global-typography-primary-font-size:40px;--e-global-typography-primary-font-weight:700;--e-global-typography-primary-line-height:1.12em;--e-global-typography-secondary-font-family:"Instrument Sans";--e-global-typography-secondary-font-size:19px;--e-global-typography-secondary-font-weight:600;--e-global-typography-secondary-line-height:1.3em;--e-global-typography-text-font-family:"Instrument Sans";--e-global-typography-text-font-size:17px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.65em;--e-global-typography-accent-font-family:"Instrument Sans";--e-global-typography-accent-font-size:16px;--e-global-typography-accent-font-weight:600;--e-global-typography-accent-line-height:1em;--e-global-typography-vvdisplay-font-family:"Bricolage Grotesque";--e-global-typography-vvdisplay-font-size:56px;--e-global-typography-vvdisplay-font-weight:700;--e-global-typography-vvdisplay-line-height:1.06em;--e-global-typography-vvdisplay-letter-spacing:-0.02em;--e-global-typography-vvh2-font-family:"Bricolage Grotesque";--e-global-typography-vvh2-font-size:40px;--e-global-typography-vvh2-font-weight:700;--e-global-typography-vvh2-line-height:1.12em;--e-global-typography-vvh2-letter-spacing:-0.015em;--e-global-typography-vvh3-font-family:"Bricolage Grotesque";--e-global-typography-vvh3-font-size:24px;--e-global-typography-vvh3-font-weight:600;--e-global-typography-vvh3-line-height:1.25em;--e-global-typography-vvh4-font-family:"Bricolage Grotesque";--e-global-typography-vvh4-font-size:19px;--e-global-typography-vvh4-font-weight:600;--e-global-typography-vvh4-line-height:1.3em;--e-global-typography-vvlead-font-family:"Instrument Sans";--e-global-typography-vvlead-font-size:20px;--e-global-typography-vvlead-font-weight:400;--e-global-typography-vvlead-line-height:1.55em;--e-global-typography-vvsmall-font-family:"Instrument Sans";--e-global-typography-vvsmall-font-size:15px;--e-global-typography-vvsmall-font-weight:500;--e-global-typography-vvsmall-line-height:1.5em;--e-global-typography-vveyebrow-font-family:"Instrument Sans";--e-global-typography-vveyebrow-font-size:13px;--e-global-typography-vveyebrow-font-weight:600;--e-global-typography-vveyebrow-text-transform:uppercase;--e-global-typography-vveyebrow-line-height:1.3em;--e-global-typography-vveyebrow-letter-spacing:0.12em;background-color:#FFFFFF;color:#1A2233;font-family:"Instrument Sans", Sans-serif;font-size:17px;font-weight:400;line-height:1.65em;}.elementor-kit-4 button,.elementor-kit-4 input[type="button"],.elementor-kit-4 input[type="submit"],.elementor-kit-4 .elementor-button{background-color:#F26322;font-family:"Instrument Sans", Sans-serif;font-size:16px;font-weight:600;color:#0A1628;border-radius:10px 10px 10px 10px;padding:14px 26px 14px 26px;}.elementor-kit-4 button:hover,.elementor-kit-4 button:focus,.elementor-kit-4 input[type="button"]:hover,.elementor-kit-4 input[type="button"]:focus,.elementor-kit-4 input[type="submit"]:hover,.elementor-kit-4 input[type="submit"]:focus,.elementor-kit-4 .elementor-button:hover,.elementor-kit-4 .elementor-button:focus{background-color:#F47B2A;color:#0A1628;}.elementor-kit-4 e-page-transition{background-color:#FFBC7D;}.elementor-kit-4 a{color:#C2410C;}.elementor-kit-4 a:hover{color:#0A1628;}.elementor-kit-4 h1{color:#0A1628;font-family:"Bricolage Grotesque", Sans-serif;font-size:56px;font-weight:700;line-height:1.06em;letter-spacing:-0.02em;}.elementor-kit-4 h2{color:#0A1628;font-family:"Bricolage Grotesque", Sans-serif;font-size:40px;font-weight:700;line-height:1.12em;letter-spacing:-0.015em;}.elementor-kit-4 h3{color:#0A1628;font-family:"Bricolage Grotesque", Sans-serif;font-size:24px;font-weight:600;line-height:1.25em;}.elementor-kit-4 h4{color:#0A1628;font-family:"Bricolage Grotesque", Sans-serif;font-size:19px;font-weight:600;line-height:1.3em;}.elementor-kit-4 h5{color:#0A1628;}.elementor-kit-4 h6{color:#0A1628;}.elementor-kit-4 label{color:#1A2233;font-family:"Instrument Sans", Sans-serif;font-size:15px;font-weight:600;}.elementor-kit-4 input:not([type="button"]):not([type="submit"]),.elementor-kit-4 textarea,.elementor-kit-4 .elementor-field-textual{color:#1A2233;background-color:#FFFFFF;border-style:solid;border-width:2px 2px 2px 2px;border-color:#7A8496;border-radius:10px 10px 10px 10px;padding:14px 16px 14px 16px;}.elementor-kit-4 input:focus:not([type="button"]):not([type="submit"]),.elementor-kit-4 textarea:focus,.elementor-kit-4 .elementor-field-textual:focus{border-style:solid;border-width:2px 2px 2px 2px;border-color:#0A1628;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.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-kit-4{--e-global-typography-text-font-size:17px;--e-global-typography-vvdisplay-font-size:46px;--e-global-typography-vvh2-font-size:34px;--e-global-typography-vvh3-font-size:22px;--e-global-typography-vvh4-font-size:19px;--e-global-typography-vvlead-font-size:19px;--e-global-typography-vvsmall-font-size:15px;font-size:17px;}.elementor-kit-4 h1{font-size:46px;}.elementor-kit-4 h2{font-size:34px;}.elementor-kit-4 h3{font-size:22px;}.elementor-kit-4 h4{font-size:19px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}}@media(max-width:767px){.elementor-kit-4{--e-global-typography-text-font-size:16px;--e-global-typography-vvdisplay-font-size:36px;--e-global-typography-vvh2-font-size:29px;--e-global-typography-vvh3-font-size:21px;--e-global-typography-vvh4-font-size:18px;--e-global-typography-vvlead-font-size:18px;--e-global-typography-vvsmall-font-size:14px;font-size:16px;}.elementor-kit-4 h1{font-size:36px;}.elementor-kit-4 h2{font-size:29px;}.elementor-kit-4 h3{font-size:21px;}.elementor-kit-4 h4{font-size:18px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}}
/* Start custom CSS *//* ===== Novivoice – Site Settings › Custom CSS =====
   Colours, typography and spacing live in the Elementor globals.
   This file only adds what the native controls cannot do. */

/* Self-hosted fonts (no requests to Google; @font: urls are filled in by deploy.php) */
@font-face {
  font-family: "Bricolage Grotesque";
  src: url("/wp-content/uploads/novivoice/fonts/bricolage-grotesque-latin.woff2") format("woff2");
  font-weight: 600 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Instrument Sans";
  src: url("/wp-content/uploads/novivoice/fonts/instrument-sans-latin.woff2") format("woff2");
  font-weight: 400 600; font-style: normal; font-display: swap;
}

/* Brand gradient (logo "NOVI" and the letterhead): sparingly, never behind text */
:root { --vv-gradient: linear-gradient(90deg, #FCEE1D 0%, #F49B23 35%, #F26322 65%, #ED1C24 100%); }

/* Focus ring on every interactive element */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid #F26322; outline-offset: 3px; border-radius: 4px;
}
.vv-dark :where(a, button, summary):focus-visible { outline-color: #FFFFFF; }
.elementor-field-group .elementor-field:focus { outline: 3px solid #F26322; outline-offset: 1px; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition-duration: .01ms !important; scroll-behavior: auto !important;
  }
  .elementor-invisible { visibility: visible !important; }
  .vv-route__dot { animation: none !important; }
}

/* Readable line length */
.vv-prose, .vv-prose p { max-width: 62ch; }
h1, h2, h3, .elementor-heading-title { text-wrap: balance; overflow-wrap: break-word; }
/* Long Dutch compounds get a soft hyphen (U+00AD) in the content */

/* Header */
.vv-header.elementor-sticky--effects { box-shadow: 0 1px 0 #E4E7EC; }
.vv-nav .elementor-nav-menu--main .vv-menu-cta { display: none; }
.vv-nav .elementor-nav-menu--dropdown .vv-menu-cta > a {
  margin: 16px 20px; justify-content: center; background: #F26322; color: #0A1628 !important;
  border-radius: 10px; font-weight: 600;
}
.vv-nav .elementor-nav-menu--dropdown a { min-height: 48px; font-size: 18px; }
.vv-nav .elementor-nav-menu--main .sub-menu {
  border: 1px solid #E4E7EC; border-radius: 12px; box-shadow: 0 10px 28px rgba(10,22,40,.10); padding: 6px; min-width: 240px;
}
.vv-nav .elementor-nav-menu--main .sub-menu a { min-height: 44px; border-radius: 10px; }
@media (min-width: 1025px) and (max-width: 1180px) {
  .vv-header .vv-btn .elementor-button { padding: 12px 20px; font-size: 15px; }
  .vv-nav .elementor-nav-menu--main .elementor-item { padding-left: 10px; padding-right: 10px; }
}

/* Buttons: 48 px tall, squared corners (kit radius 10), arrow nudge */
.vv-btn .elementor-button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; }
.vv-btn .elementor-button-icon { transition: transform .15s ease-out; }
.vv-btn .elementor-button:hover .elementor-button-icon { transform: translateX(4px); }
.vv-btn .elementor-button-icon svg { width: 18px; height: 18px; }

/* Cards */
.vv-card { position: relative; transition: transform .2s ease-out, box-shadow .2s ease-out, border-color .2s; }
.vv-card:not(.vv-card--static):hover, .vv-card:not(.vv-card--static):focus-within {
  transform: translateY(-3px); box-shadow: 0 10px 28px rgba(10,22,40,.08); border-color: #CBD2DC !important;
}
/* The heading link covers the whole card (one link per card, large touch target) */
.vv-card .elementor-heading-title a { color: inherit; text-decoration: none; }
.vv-card .elementor-heading-title a::after { content: ""; position: absolute; inset: 0; border-radius: 16px; z-index: 1; }
.vv-card .elementor-heading-title a:focus-visible { outline: none; }
.vv-card:has(.elementor-heading-title a:focus-visible) { outline: 3px solid #F26322; outline-offset: 3px; }
.vv-card:hover .elementor-heading-title a {
  text-decoration: underline; text-decoration-color: #F26322; text-decoration-thickness: 2px; text-underline-offset: 4px;
}
.vv-card--peach { border-color: #F9D5BC !important; }
.vv-card--peach .vv-tile .elementor-icon { background-color: #FFFFFF !important; }
.vv-need p { margin: 0 0 -6px; font-weight: 600; }
.vv-more { font-weight: 600; color: #C2410C; }
.vv-card:hover .vv-more { text-decoration: underline; text-underline-offset: 3px; }
.vv-more-wrap { margin-top: auto; }
.vv-more-wrap p { margin: 0; }
.vv-on-dark a, .vv-dark .vv-more { color: #FFFFFF; }
.vv-dark .elementor-icon-list-item a:hover .elementor-icon-list-text { text-decoration: underline; }
.vv-mt { margin-top: 16px; }

/* Icon tile: 48 x 48, Mint, Lijngroen glyph */
.vv-tile .elementor-icon {
  display: inline-grid; place-items: center; width: 48px; height: 48px; padding: 0 !important; border-radius: 14px;
}
.vv-tile .elementor-icon svg { width: 24px; height: 24px; }

/* Tags (Inbegrepen / Optie) */
.vv-tag { display: inline-block; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  line-height: 1; padding: 6px 12px; border-radius: 999px; background: #F5F6F8; border: 1px solid #E4E7EC; color: #4B5568; }
.vv-tag--on { background: #FFF3EA; border-color: #F9D5BC; color: #C2410C; }

/* Hero: swoosh from the letterhead (::after: Elementor uses ::before for container overlays), top right, behind the content (decorative; a background image, so not in the
   accessibility tree). Hidden on phones, where it would crowd the text. */
.vv-hero { position: relative; overflow: hidden; }
.vv-hero::after {
  content: ""; position: absolute; top: 0; right: 0; z-index: 0; width: min(44vw, 560px); aspect-ratio: 640 / 330; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 640 330%22 aria-hidden=%22true%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 x2=%221%22 y1=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%23FCEE1D%22/%3E%3Cstop offset=%22.35%22 stop-color=%22%23F49B23%22/%3E%3Cstop offset=%22.65%22 stop-color=%22%23F26322%22/%3E%3Cstop offset=%221%22 stop-color=%22%23ED1C24%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d=%22M0 0H640V250C500 120 260 40 0 0Z%22 fill=%22url(%23g)%22/%3E%3Cpath d=%22M0 0C260 40 500 120 640 250V330C500 200 270 80 0 0Z%22 fill=%22url(%23g)%22 opacity=%22.3%22/%3E%3C/svg%3E") no-repeat top right / 100% 100%;
}
.vv-hero > .e-con-inner { position: relative; z-index: 1; }
@media (max-width: 1024px) { .vv-hero::after { width: min(60vw, 320px); opacity: .9; } }
@media (max-width: 767px) { .vv-hero::after { display: none; } }

/* Hero photo: the photo fills the visual column and the route card overlaps it. Desktop: the card covers the photo's
   left half (the corridor wall), sticking out 64 px into the column gap and 40 px at the bottom; face and phone stay clear. Tablet and mobile: the photo is full width and
   the card slides 72 px over its bottom edge, inset 16 px (the face is in the upper half, so it stays clear).
   The swoosh (.vv-hero::after, z-index 0) peeks out behind the photo's top right. */
.vv-photo-hero { position: relative; width: 100%; }
.vv-photo-hero .vv-photo, .vv-photo-hero .vv-photo .elementor-widget-container { width: 100%; }
.vv-photo-hero .vv-photo img {
  display: block; width: 100%; height: 360px; max-width: none; object-fit: cover; object-position: 72% 12%; border-radius: 16px;
}
.vv-photo-hero > .elementor-widget-html { position: relative; z-index: 2; width: auto; margin: -72px 16px 0; }
@media (max-width: 767px) { .vv-photo-hero .vv-photo img { height: 300px; } }
@media (min-width: 1025px) {
  .vv-photo-hero { margin-bottom: 40px; }
  .vv-photo-hero .vv-photo img { height: 580px; object-position: 50% 20%; }
  .vv-photo-hero > .elementor-widget-html { position: absolute; left: -64px; bottom: -40px; width: 300px; margin: 0; }
  /* Tighter card on the photo, so it hides as little of the phone and hand as possible */
  .vv-photo-hero .vv-route { padding: 20px 22px; }
  .vv-photo-hero .vv-route__cap { margin-bottom: 16px; padding-bottom: 12px; }
  .vv-photo-hero .vv-route__title { margin-top: 4px; font-size: 18px; }
  .vv-photo-hero .vv-route__step { padding-bottom: 16px; padding-left: 38px; }
  .vv-photo-hero .vv-route__step:not(:last-child)::before { left: 8.5px; }
  .vv-photo-hero .vv-route__label { font-size: 12px; margin-bottom: 2px !important; }
  .vv-photo-hero .vv-route__text { font-size: 14px; line-height: 1.45; }
  .vv-photo-hero .vv-route__note { margin-top: 16px !important; padding-top: 12px; font-size: 13px; }
}

/* 4 px brand gradient above the closing band and the footer */
.vv-cta, .vv-footer { position: relative; }
.vv-cta::after, .vv-footer::after {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--vv-gradient);
}

/* Hero: ticks under the buttons */
.vv-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; }
.vv-chips li { position: relative; padding-left: 26px; font-weight: 500; }
.vv-chips li::before {
  content: ""; position: absolute; left: 0; top: .2em; width: 18px; height: 18px; border-radius: 50%; background-color: #FFF3EA;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 6 9 17l-5-5' fill='none' stroke='%23C2410C' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 11px; background-position: center; background-repeat: no-repeat;
}
.elementor-widget-text-editor .vv-chips + p, .vv-chips { margin-bottom: 0; }

/* Route card: how an incoming call travels (the signature visual) */
.vv-route {
  margin: 0; width: 100%; box-sizing: border-box; background: #FFFFFF; border: 1px solid #E4E7EC; border-radius: 16px;
  padding: 28px; box-shadow: 0 10px 28px rgba(10,22,40,.08); font-family: "Instrument Sans", system-ui, sans-serif; color: #1A2233;
}
.vv-route p { margin: 0; }
.vv-route__cap { display: block; margin: 0 0 24px; padding-bottom: 18px; border-bottom: 1px solid #E4E7EC; }
.vv-route__status {
  display: flex; align-items: center; gap: 10px; font: 600 13px/1.3 "Instrument Sans", system-ui, sans-serif;
  letter-spacing: .12em; text-transform: uppercase; color: #4B5568;
}
.vv-route__dot {
  flex: none; width: 10px; height: 10px; border-radius: 50%; background: #F26322;
  box-shadow: 0 0 0 0 rgba(242,99,34,.5); animation: vv-ring 2.2s ease-out infinite;
}
@keyframes vv-ring { 0% { box-shadow: 0 0 0 0 rgba(242,99,34,.5); } 70%, 100% { box-shadow: 0 0 0 10px rgba(242,99,34,0); } }
.vv-route__title { display: block; margin-top: 8px; font: 600 20px/1.3 "Bricolage Grotesque", system-ui, sans-serif; color: #0A1628; }
.vv-route__steps { list-style: none; margin: 0; padding: 0; }
.vv-route__step { position: relative; margin: 0; padding: 0 0 24px 44px; }
.vv-route__step:last-child { padding-bottom: 0; }
/* Connecting line between the nodes: the brand gradient, one segment per step (yellow, orange, red) */
.vv-route__step:not(:last-child)::before {
  content: ""; position: absolute; left: 8.5px; top: 24px; bottom: 2px; width: 3px; border-radius: 2px;
  background: linear-gradient(180deg, #F49B23, #F26322);
}
.vv-route__step:nth-child(2):not(:last-child)::before { background: linear-gradient(180deg, #F26322, #ED1C24); }
.vv-route__step:nth-child(n+3):not(:last-child)::before { background: #ED1C24; }
.vv-route__node {
  position: absolute; left: 0; top: 1px; box-sizing: border-box; width: 20px; height: 20px; border-radius: 50%;
  background: #F26322; border: 2px solid #F26322; box-shadow: inset 0 0 0 3px #FFF3EA;
}
.vv-route__step--fallback .vv-route__node { background: #FFFFFF; box-shadow: none; border-style: dashed; }
.vv-route__label { font: 600 13px/1.3 "Instrument Sans", system-ui, sans-serif; letter-spacing: .04em; color: #C2410C; margin-bottom: 4px !important; }
.vv-route__text { font: 400 16px/1.5 "Instrument Sans", system-ui, sans-serif; color: #1A2233; }
.vv-route__note {
  margin-top: 24px !important; padding-top: 16px; border-top: 1px dashed #E4E7EC; font: 500 14px/1.5 "Instrument Sans", system-ui, sans-serif; color: #4B5568;
}
@media (max-width: 767px) {
  .vv-route { padding: 22px 20px; }
  .vv-route__title { font-size: 19px; }
  .vv-route__text { font-size: 15px; }
}

/* Recognition: situations with a Lijngroen rule (border set on the container) */
.vv-situation .elementor-heading-title { font-weight: 600; }

/* Proof checklist on Mint */
.vv-proof-row .elementor-widget-icon { flex: 0 0 24px; margin-top: 2px; }
.vv-proof-row .elementor-icon svg { width: 22px; height: 22px; }
.vv-proof-row p { margin: 0; }

/* Note box */
.vv-note p { margin: 0 0 8px; }
.vv-note p:last-child { margin-bottom: 0; }

/* Process steps: numbered dots and a dotted connecting line on desktop */
.vv-dot .elementor-heading-title {
  width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center;
  background: #F26322; color: #0A1628; font: 700 18px/1 "Bricolage Grotesque", system-ui, sans-serif;
}
@media (min-width: 1025px) {
  .vv-steps { position: relative; }
  .vv-steps::after {
    content: ""; position: absolute; left: 24px; right: calc(25% - 48px); height: 4px; border-radius: 2px;
    background: radial-gradient(circle at center, #F26322 1.4px, transparent 1.7px) 0 0 / 8px 4px repeat-x;
    top: calc(var(--padding-top, 32px) + 22px);
  }
  .vv-steps > .e-con { position: relative; z-index: 1; }
}

/* FAQ (nested accordion): .elementor-widget-n-accordion.vv-faq beats Elementor's own .elementor-kit-4s */
.elementor-widget-n-accordion.vv-faq .e-n-accordion { gap: 0; }
.elementor-widget-n-accordion.vv-faq .e-n-accordion-item { border-top: 1px solid #E4E7EC; }
.elementor-widget-n-accordion.vv-faq .e-n-accordion-item:last-of-type { border-bottom: 1px solid #E4E7EC; }
.elementor-widget-n-accordion.vv-faq .e-n-accordion-item-title {
  padding: 22px 0; background: transparent; border: 0; border-radius: 0; justify-content: space-between;
}
.elementor-widget-n-accordion.vv-faq .e-n-accordion-item-title-text {
  font: 600 19px/1.35 "Bricolage Grotesque", system-ui, sans-serif; color: #0A1628;
}
.elementor-widget-n-accordion.vv-faq .e-n-accordion-item-title:hover .e-n-accordion-item-title-text { color: #C2410C; }
.elementor-widget-n-accordion.vv-faq .e-n-accordion-item-title-icon { order: 2; color: #0A1628; }
.elementor-widget-n-accordion.vv-faq .e-n-accordion-item > .e-con { border: 0; padding: 0 48px 24px 0; }
@media (max-width: 767px) {
  .elementor-widget-n-accordion.vv-faq .e-n-accordion-item-title-text { font-size: 18px; }
  .elementor-widget-n-accordion.vv-faq .e-n-accordion-item > .e-con { padding-right: 0; }
}

/* Footer and addresses */
.vv-address { font-style: normal; line-height: 1.9; font-size: 15px; }
.vv-footer .vv-address { color: #A9B3C7; }
.vv-footer a { color: #FFFFFF; text-decoration: none; }
.vv-footer a:hover { text-decoration: underline; text-underline-offset: 3px; }
.vv-legal { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 0; }
.vv-next { margin: 0; padding-left: 1.2em; display: grid; gap: 8px; }

/* Closing band */
.vv-cta p { margin: 0; }
.vv-cta .elementor-widget-text-editor a { color: #FFFFFF; }

/* Breadcrumb */
.vv-crumbs { display: flex; flex-wrap: wrap; gap: 4px 8px; }
.vv-crumbs a { color: #4B5568; }
.vv-crumbs a:hover { color: #C2410C; }
.vv-crumbs [aria-current] { color: #0A1628; font-weight: 600; }

/* Anchor targets stay clear of the sticky header */
[id] { scroll-margin-top: 96px; }

/* Legal pages (phase 2) */
.vv-legal-body { max-width: 760px; }
.vv-legal-body ul, .vv-legal-body ol { padding-left: 1.2em; }
.vv-legal-body li { margin-bottom: 6px; }
.vv-notice p { margin: 0; padding: 14px 18px; border-radius: 12px; background: #FDF1DC; color: #5C3B00; max-width: 760px; }
.vv-todo { background: #FDF1DC; color: #7A4B00; padding: 0 4px; border-radius: 3px; font-weight: 600; }

/* Buttons that reopen the cookie banner. Elementor's kit styles every <button> (orange fill), so these win by
   specificity and !important. */
button.vv-linkbtn { background: none !important; border: 0 !important; padding: 0 !important; min-height: 0 !important;
  color: #FFFFFF !important; font: inherit !important; cursor: pointer; border-radius: 0 !important; }
button.vv-linkbtn:hover { background: none !important; text-decoration: underline; text-underline-offset: 3px; }
button.vv-btn-outline { background: #FFFFFF !important; border: 2px solid #0A1628 !important; color: #0A1628 !important;
  border-radius: 10px !important; padding: 12px 22px !important; min-height: 48px; font: 600 16px/1 "Instrument Sans", system-ui, sans-serif !important; cursor: pointer; }
button.vv-btn-outline:hover { background: #0A1628 !important; color: #FFFFFF !important; }

/* Complianz cookie statement: no e-mail address is published, so hide the empty line */
.cmplz-document .cmplz-contact-email, .cmplz-document .cmplz-contact-email + br { display: none; }

/* Form (phase 2): fields and radio group */
.vv-form .elementor-field-label { margin-bottom: 6px; }
.vv-form .elementor-field-textual { min-height: 48px; }
.vv-form .elementor-field-subgroup .elementor-field-option label { margin-left: 6px; }
.vv-form .elementor-message-danger { color: #B42318; }
.vv-form .elementor-message-success { color: #1E7A46; }

/* Links inside running text are underlined, not only coloured (WCAG 1.4.1) */
.elementor-widget-text-editor a, .elementor-widget-html a, .cmplz-document a {
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px;
}
.elementor-widget-text-editor a:hover, .elementor-widget-html a:hover { text-decoration-thickness: 2px; }
.vv-footer a, .vv-card a { text-decoration: none; }
#content:focus { outline: none; }

/* ===== pages_company.py: page-specific styles (vv-co-*) ===== */

/* Werkwijze: the "Wat wij doen" panel gets an orange rule, the lists breathe */
.vv-co-we { border-left: 4px solid #F26322 !important; }
.vv-co-step .elementor-widget-icon-list .elementor-icon-list-item { align-items: flex-start; }
.vv-co-step .elementor-icon-list-icon { margin-top: 3px; }

/* Service tiers: the price line sits at the bottom of each card */
.vv-co-tier { height: 100%; }
.vv-co-tier .vv-co-price-line { margin-top: auto; padding-top: 14px; border-top: 1px solid #E4E7EC; }
.vv-co-tier .vv-co-price-line p { margin: 0; }
.vv-co-tier--basis { border-color: #F9D5BC !important; }

/* Example calculations (only rendered when SHOW_EXAMPLE_PRICES is True) */
.vv-co-amount { font: 700 34px/1.1 "Bricolage Grotesque", system-ui, sans-serif; color: #0A1628; letter-spacing: -.01em; }
.vv-co-per { font-size: 15px; color: #4B5568; }
.vv-co-calc { list-style: none; margin: 0; padding: 12px 0 0; border-top: 1px solid #E4E7EC; display: grid; gap: 4px; }

/* Contact: sidebar */
.vv-co-side h2 { margin: 0; }
.vv-co-side p { margin: 0; }
.vv-co-side .vv-address { font-size: 17px; line-height: 1.7; }
.vv-co-side .vv-next { margin: 0; }
@media (min-width: 1025px) { .vv-co-side { position: sticky; top: 112px; } }

/* Form: keep the select arrow and radio rows readable */
.vv-form .elementor-field-type-radio .elementor-field-subgroup { gap: 4px 24px; }
.vv-form .elementor-field-type-select select { padding-right: 36px; }
.vv-form .elementor-button { min-height: 52px; font-weight: 600; }

/* Legal pages: tighter hero, headings inside the text column */
.vv-legal-body h3 { margin: 18px 0 4px; font: 600 19px/1.3 "Bricolage Grotesque", system-ui, sans-serif; color: #0A1628; }
.vv-legal-body p { margin: 0 0 12px; }

/* Legal texts from juridisch/*.md (legal.py): nested lists, tables, table of contents */
.vv-legal-body ol ol, .vv-legal-body ul ol { margin-top: 6px; }
.vv-co-table { width: 100%; border-collapse: collapse; margin: 4px 0 12px; font-size: 16px; line-height: 1.5; }
.vv-co-table th, .vv-co-table td { text-align: left; vertical-align: top; padding: 10px 14px 10px 0; border-bottom: 1px solid #E4E7EC; }
.vv-co-table th { font-weight: 600; color: #0A1628; border-bottom: 2px solid #0A1628; }
.vv-co-table th:first-child, .vv-co-table td:first-child { width: 42%; padding-left: 0; }
@media (max-width: 767px) { .vv-co-table th:first-child, .vv-co-table td:first-child { width: 38%; } .vv-co-table { font-size: 15px; } }
.vv-co-toc { margin: 0 0 20px; padding: 20px 24px; border: 1px solid #E4E7EC; border-radius: 14px; background: #F5F6F8; }
.vv-co-toc-title { margin: 0 0 8px !important; font: 600 17px/1.3 "Bricolage Grotesque", system-ui, sans-serif; color: #0A1628; }
.vv-co-toc ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 4px 24px; }
.vv-co-toc li { margin: 0; }
@media (min-width: 768px) { .vv-co-toc ul { grid-template-columns: 1fr 1fr; } }

/* ===== pages_locations.py: municipality pages and directory (vv-loc-*) ===== */

/* Table of area codes / municipalities: server-rendered, scrolls sideways instead of breaking the layout */
.vv-loc-tablewrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.vv-loc-table { width: 100%; border-collapse: collapse; font: 400 17px/1.5 "Instrument Sans", system-ui, sans-serif; color: #1A2233; }
.vv-loc-table th, .vv-loc-table td { text-align: left; vertical-align: top; padding: 12px 20px 12px 0; border-bottom: 1px solid #E4E7EC; }
.vv-loc-table th { font: 600 15px/1.4 "Bricolage Grotesque", system-ui, sans-serif; color: #0A1628; border-bottom: 2px solid #0A1628; white-space: nowrap; }
.vv-loc-table td:last-child, .vv-loc-table th:last-child { padding-right: 0; }
.vv-loc-table a { color: #0A1628; font-weight: 600; text-underline-offset: 3px; }
.vv-loc-table a:hover { color: #C2410C; }
.vv-loc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 767px) {
  .vv-loc-table { font-size: 16px; }
  .vv-loc-table th, .vv-loc-table td { padding-right: 14px; }
}

/* Label above the example situation */
.vv-loc-label p { margin: 0; }

/* ===== pages_solutions.py: page-specific styles (vv-sol-*) ===== */
/* Oplossingen: one wide card per proposition. The card is static (several links inside), so no lift. */
.vv-sol-quote p { margin: 0; font-style: italic; }
.vv-sol-row .elementor-icon-list-text { line-height: 1.5; }

/* ===== pages_topics.py: page-specific styles (vv-topics-*) ===== */

/* Hero list card (Belplan): same look as the route card, numbered rows */
.vv-top-list {
  margin: 0; width: 100%; box-sizing: border-box; background: #FFFFFF; border: 1px solid #E4E7EC; border-radius: 16px;
  padding: 28px; box-shadow: 0 10px 28px rgba(10,22,40,.08); font-family: "Instrument Sans", system-ui, sans-serif; color: #1A2233;
}
.vv-top-list p { margin: 0; }
.vv-top-list__cap { display: block; margin: 0 0 22px; padding-bottom: 18px; border-bottom: 1px solid #E4E7EC; }
.vv-top-list__kicker { display: block; font: 600 13px/1.3 "Instrument Sans", system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #4B5568; }
.vv-top-list__title { display: block; margin-top: 8px; font: 600 20px/1.3 "Bricolage Grotesque", system-ui, sans-serif; color: #0A1628; }
.vv-top-list__rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.vv-top-list__row { position: relative; margin: 0; padding-left: 44px; }
.vv-top-list__no {
  position: absolute; left: 0; top: 0; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
  background: #F26322; color: #0A1628; font: 700 14px/1 "Bricolage Grotesque", system-ui, sans-serif;
}
.vv-top-list__label { font: 600 16px/1.35 "Bricolage Grotesque", system-ui, sans-serif; color: #0A1628; margin-bottom: 2px !important; }
.vv-top-list__text { font: 400 15px/1.5 "Instrument Sans", system-ui, sans-serif; color: #4B5568; }
.vv-top-list__note {
  margin-top: 22px !important; padding-top: 16px; border-top: 1px dashed #E4E7EC; font: 500 14px/1.5 "Instrument Sans", system-ui, sans-serif; color: #4B5568;
}
@media (max-width: 767px) {
  .vv-top-list { padding: 22px 20px; }
  .vv-top-list__title { font-size: 19px; }
}

/* Three example routes: equal height, the route card fills its column */
.vv-top-route .vv-route { height: 100%; }
.vv-top-route .elementor-widget-html { flex: 1 1 auto; }
.vv-top-route .elementor-widget-html .elementor-widget-container { height: 100%; }

/* Horizontal steps (3 columns): dotted line behind the numbers on desktop */
@media (min-width: 1025px) {
  .vv-top-steps { position: relative; }
  .vv-top-steps::after {
    content: ""; position: absolute; left: 24px; height: 4px; border-radius: 2px;
    background: radial-gradient(circle at center, #F26322 1.4px, transparent 1.7px) 0 0 / 8px 4px repeat-x;
    top: calc(var(--padding-top, 32px) + 22px);
  }
  .vv-top-steps--3::after { right: calc(33.333% - 48px); }
  .vv-top-steps > .e-con { position: relative; z-index: 1; }
}

/* Vertical timeline (Overstappen): dot on the left, dotted line down to the next step */
.vv-top-tl__step { position: relative; padding-bottom: 36px; }
.vv-top-tl__step:last-child { padding-bottom: 0; }
.vv-top-tl__step:not(:last-child)::after {
  content: ""; position: absolute; left: 23px; top: 56px; bottom: 8px; width: 4px;
  background: radial-gradient(circle at center, #F26322 1.4px, transparent 1.7px) 0 0 / 4px 8px repeat-y;
}
.vv-top-tl__step > .elementor-widget-heading { flex: 0 0 48px; width: 48px; }
.vv-top-tl__step > .e-con { flex: 1 1 auto; min-width: 0; }
.vv-top-who p { margin: 0 0 4px; }
.vv-top-who p:last-child { margin-bottom: 0; }
.vv-top-who { padding-top: 6px; }
@media (max-width: 767px) {
  .vv-top-tl__step { gap: 16px; }
}/* End custom CSS */