.elementor-kit-27{--e-global-color-primary:#000000;--e-global-color-secondary:#00A3CC;--e-global-color-text:#171717;--e-global-color-accent:#00A3CC;--e-global-color-lichtblauw:#CFECF4;--e-global-color-staalgrijs:#84939F;--e-global-color-grijs:#8B8B8A;--e-global-color-offwhite:#F6F6F6;--e-global-color-zwart:#000000;--e-global-typography-primary-font-family:"Evogria";--e-global-typography-primary-font-weight:400;--e-global-typography-primary-line-height:1.12em;--e-global-typography-primary-letter-spacing:-0.03em;--e-global-typography-secondary-font-family:"Evogria";--e-global-typography-secondary-font-weight:400;--e-global-typography-secondary-line-height:1.25em;--e-global-typography-text-font-family:"Epilogue";--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.6em;--e-global-typography-accent-font-family:"Evogria";--e-global-typography-accent-font-weight:600;--e-global-typography-accent-line-height:1.4em;--e-global-typography-03823d9-font-family:"Futura";--e-global-typography-03823d9-font-size:clamp(1.5rem, 0.4615rem + 4.6154vw, 3.75rem);--e-global-typography-03823d9-font-weight:700;--e-global-typography-9acd1f9-font-family:"Futura";--e-global-typography-9acd1f9-font-size:clamp(1.25rem, 0.6731rem + 2.5641vw, 2.5rem);--e-global-typography-9acd1f9-font-weight:700;--e-global-typography-5402d94-font-family:"Futura";--e-global-typography-5402d94-font-size:clamp(1.125rem, 1.0673rem + 0.2564vw, 1.25rem);--e-global-typography-5402d94-font-weight:700;--e-global-typography-2170821-font-family:"Poppins";--e-global-typography-2170821-font-size:18px;--e-global-typography-2170821-font-weight:400;--e-global-typography-fd410d0-font-family:"Futura";--e-global-typography-fd410d0-font-size:16px;--e-global-typography-fd410d0-font-weight:500;color:#171717;font-family:"Epilogue", Sans-serif;font-size:16px;font-weight:400;line-height:1.6em;}.elementor-kit-27 button,.elementor-kit-27 input[type="button"],.elementor-kit-27 input[type="submit"],.elementor-kit-27 .elementor-button{background-color:#00A3CC;font-family:"Evogria", Sans-serif;font-size:16px;font-weight:400;text-transform:uppercase;letter-spacing:1px;color:#FFFFFF;border-radius:0px 0px 0px 0px;padding:14px 22px 14px 22px;}.elementor-kit-27 button:hover,.elementor-kit-27 button:focus,.elementor-kit-27 input[type="button"]:hover,.elementor-kit-27 input[type="button"]:focus,.elementor-kit-27 input[type="submit"]:hover,.elementor-kit-27 input[type="submit"]:focus,.elementor-kit-27 .elementor-button:hover,.elementor-kit-27 .elementor-button:focus{background-color:#008BAF;color:#FFFFFF;}.elementor-kit-27 e-page-transition{background-color:#FFBC7D;}.elementor-kit-27 a{color:var( --e-global-color-secondary );}.elementor-kit-27 h1{color:#000000;font-family:"Evogria", Sans-serif;font-size:86px;font-weight:400;line-height:1.05em;letter-spacing:0em;}.elementor-kit-27 h2{color:#000000;font-family:"Evogria", Sans-serif;font-size:42px;font-weight:400;line-height:1em;letter-spacing:0em;}.elementor-kit-27 h3{color:#000000;font-family:"Evogria", Sans-serif;font-size:26px;font-weight:400;line-height:1.15em;letter-spacing:0em;}.elementor-kit-27 h4{color:#000000;font-family:"Evogria", Sans-serif;font-size:21px;font-weight:400;line-height:1.25em;letter-spacing:0em;}.elementor-kit-27 h5{color:#000000;font-family:"Evogria", Sans-serif;font-size:18px;font-weight:400;line-height:1.35em;letter-spacing:0em;}.elementor-kit-27 h6{color:#000000;font-family:"Evogria", Sans-serif;font-size:16px;font-weight:400;line-height:1.4em;letter-spacing:0em;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1504px;}.e-con{--container-max-width:1504px;--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){margin-block-end:0px;}.elementor-element{--widgets-spacing:0px 0px;--widgets-spacing-row:0px;--widgets-spacing-column:0px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1366px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:90%;}.e-con{--container-max-width:90%;}}@media(max-width:1200px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:90%;}.e-con{--container-max-width:90%;}}@media(max-width:1080px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:80%;}.e-con{--container-max-width:80%;}}@media(max-width:880px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:80%;}.e-con{--container-max-width:80%;}}@media(max-width:720px){.elementor-kit-27 h1{font-size:40px;}.elementor-kit-27 h2{font-size:28px;}.elementor-kit-27 h3{font-size:22px;}.elementor-kit-27 h4{font-size:19px;}.elementor-kit-27 h5{font-size:17px;}.elementor-kit-27 h6{font-size:16px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:85%;}.e-con{--container-max-width:85%;}}/* Start custom CSS *//* =============================================================================
   Maatwerk-CSS voor een DYsign-klantsite in Elementor.
   Hoort in Site Settings → Custom CSS (de global kit), niet in een plugin of child theme,
   zodat het team het op één plek vindt.

   Dit bestand doet twee dingen:
   1. Het repareert vier eigenaardigheden van Elementor die je anders sectie per sectie tegenkomt.
   2. Het levert de handvol dingen die Elementor niet kan uitdrukken: beeldverhoudingen,
      bijschriften over beeld, een vaste header en een mobiele actiebalk.

   Vervang de kleurwaarden onderaan door die van de klant.
   ============================================================================= */

/* --- 1. reparaties ---------------------------------------------------------- */

/* Elke <p> in een tekstwidget houdt zijn ondermarge van 14px. Dat duwt tekst in tags
   en balken naar boven en zet overal losse gaten waar je ze niet vraagt. */
.elementor-widget-text-editor p:last-of-type{margin-bottom:0}

/* De veilige zone blijft op elk scherm gelijk; de buitenpadding van de sectie regelt de marge.
   Zonder dit versmalt Elementor de container naar 90% en 80% op tussenmaten. */
.e-con{--container-max-width:1504px}

/* De header vastzetten hoort op de theme-wrapper. Op de container erin is sticky begrensd
   door zijn eigen hoogte, en Elementor Pro's sticky-functie kloont de container in de DOM. */
header.elementor-location-header{position:sticky;top:0;z-index:100}

/* Een container die als los element in een rij staat mag niet uitrekken. */
.gv-auto{width:auto!important;flex:0 0 auto}

/* --- 2. beeldverhoudingen --------------------------------------------------- */
/* Zet de klasse op de container róndom het beeld, niet op het image-widget:
   Elementor bewaart maar één klasse per container en widget-klassen sneuvelen.
   !important is nodig omdat de widget-CSS van Elementor ná de kit-CSS laadt. */
.gv-imgwrap img{width:100%!important;aspect-ratio:16/9!important;object-fit:cover!important;display:block}
.gv-caseimg img{width:100%!important;aspect-ratio:4/3!important;object-fit:cover!important;display:block}
.gv-portret img{width:100%!important;aspect-ratio:4/5!important;object-fit:cover!important;display:block}
/* Grafieken, rapporten en tomogrammen nooit bijsnijden. */
.gv-contain img{width:100%!important;aspect-ratio:4/3!important;object-fit:contain!important;padding:12px;display:block}

/* --- 3. overlays op beeld --------------------------------------------------- */
.gv-imgwrap,.gv-caseimg,.gv-figure{position:relative}
.gv-figcap{position:absolute;left:12px;right:12px;bottom:12px;width:auto!important}
.gv-tag{position:absolute;top:16px;left:16px;width:auto!important;z-index:2}

/* --- 4. kaarten ------------------------------------------------------------- */
.gv-card{transition:transform .18s ease,box-shadow .18s ease}
.gv-card:hover{transform:translateY(-2px)}
.gv-card img{transition:transform .4s ease}
.gv-card:hover .gv-imgwrap img{transform:scale(1.03)}

/* --- 5. accordeon ----------------------------------------------------------- */
/* Zet géén border-instelling op het accordeon-widget zelf: die komt rondom te staan. */
.elementor-accordion .elementor-accordion-item{border:0!important;border-bottom:1px solid var(--gv-lijn)!important}
.elementor-accordion .elementor-accordion-item:last-child{border-bottom:0!important}
.elementor-accordion .elementor-tab-content{border-top:0!important}
.elementor-accordion .elementor-tab-content a{color:var(--gv-accent);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* --- 6. formulieren --------------------------------------------------------- */
/* Minimaal 48px hoog, met een zichtbare focusring in plaats van alleen een kleurtje. */
.elementor-field-textual{min-height:48px!important;padding-top:12px!important;padding-bottom:12px!important}
textarea.elementor-field-textual{min-height:96px!important}
.elementor-field-textual:focus{outline:none;box-shadow:0 0 0 3px var(--gv-focus)}

/* --- 7. ankers onder de vaste header --------------------------------------- */
[id]{scroll-margin-top:130px}

/* --- 8. lopende band (certificaten, USP's) ---------------------------------- */
/* Elementor heeft geen marquee-widget. Zet twee identieke lijsten naast elkaar in een
   container met deze klasse; de band schuift de helft op en herhaalt naadloos. */
.gv-strip{width:max-content!important;flex-wrap:nowrap!important;animation:gv-schuif 42s linear infinite}
.gv-strip .elementor-widget{width:auto!important;--container-widget-width:auto}
.gv-strip .elementor-icon-list-items{display:flex;flex-wrap:nowrap;gap:0}
.gv-strip .elementor-icon-list-item{margin:0!important;padding:0 28px!important;white-space:nowrap}
@keyframes gv-schuif{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.gv-strip{animation:none}}

/* --- 9. mobiel -------------------------------------------------------------- */
@media(max-width:767px){
  /* tikdoelen minstens 44px, ook tekstlinks in lijsten */
  .gv-flist a{display:inline-flex;align-items:center;min-height:44px}
  .gv-flist{gap:0}

  /* een pilvormige tag met tekst over twee regels wordt een stadion; maak er een label van */
  .gv-badge{border-radius:16px!important;padding:10px 14px!important;gap:10px!important;flex-wrap:nowrap!important}
  .gv-badge img{width:24px!important;height:24px!important}
  .gv-badge p{font-size:13px!important;line-height:1.35!important}
  .gv-badge .elementor-widget{width:auto!important;--container-widget-width:auto}
  .gv-badge .elementor-widget-text-editor{flex:1 1 auto!important;min-width:0}

  /* een schuine verloop-overlay werkt niet op een smal scherm */
  .gv-hero-overlay::before{background-image:none!important;background-color:var(--gv-overlay)!important;opacity:1!important}

  body{padding-bottom:0}
  [id]{scroll-margin-top:90px}

  /* Elke knop haalt het tikdoel van 44px, ook de twee compacte CTA's in de navigatie. */
  .elementor-button{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
}

/* --- 10. mobiele actiebalk -------------------------------------------------- */
.gv-sticky{display:none}
@media(max-width:767px){
  .gv-sticky{display:grid!important;grid-template-columns:1fr 1fr;gap:12px;position:fixed;left:0;right:0;bottom:0;z-index:99;background:rgba(255,255,255,.97);border-top:1px solid var(--gv-lijn);padding:12px 16px}
  .gv-sticky .elementor-widget-button,.gv-sticky .elementor-button{width:100%}
}

/* --- klantkleuren ----------------------------------------------------------- */
:root{
  --gv-lijn:#E3E7EA;
  --gv-accent:#00A3CC;
  --gv-focus:rgba(0,163,204,.20);
  --gv-overlay:rgba(0,0,0,.55);
}

/* --- Maxicon-specifiek ------------------------------------------------------
   Alle waarden komen uit ../METINGEN.md, gemeten op www.maxicon.be bij 1710px.
   -------------------------------------------------------------------------- */

/* Evogria heeft één snede en staat op de site altijd in kapitalen. */
h1,h2,h3,h4,h5,h6,.elementor-heading-title{text-transform:uppercase}
h1,.elementor-widget-heading h1.elementor-heading-title{font-size:clamp(40px,5vw,86px)}
.gv-card,.elementor-button{border-radius:0}

/* --- filterbalk: schuift 106px over de hero heen -------------------------- */
.mx-filterbalk{margin-top:-106px;position:relative;z-index:5}
.mx-filter__form{display:grid;grid-template-columns:repeat(4,1fr) auto;gap:24px;align-items:end;
  background:#fff;padding:28px 32px;box-shadow:0 10px 40px rgba(0,0,0,.10)}
.mx-filter__veld{display:flex;flex-direction:column;gap:8px;min-width:0}
.mx-filter__veld label{font:500 15px/1.3 Epilogue,sans-serif;color:#171717}
.mx-filter__veld input,.mx-filter__veld select{height:48px;border:1px solid #C9D2D8;background:#fff;
  padding:0 14px;font:400 15px/1 Epilogue,sans-serif;color:#171717;width:100%}
.mx-filter__veld input:focus,.mx-filter__veld select:focus{outline:none;box-shadow:0 0 0 3px var(--gv-focus);border-color:var(--gv-accent)}
.mx-filter__knop{height:48px;min-width:132px;border:0;background:var(--gv-accent);color:#fff;cursor:pointer;
  font:400 15px/1 Evogria,sans-serif;letter-spacing:1px;text-transform:uppercase}
.mx-filter__knop:hover{background:#008BAF}

/* --- vacaturekaarten ------------------------------------------------------ */
.mx-vacaturekaart{height:100%}
.mx-pin{display:inline-block;width:13px;height:17px;margin-right:8px;vertical-align:-3px;
  background:currentColor;-webkit-mask:no-repeat center/contain;mask:no-repeat center/contain;
  -webkit-mask-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 18'%3E%3Cpath d='M7 0C3.13 0 0 3.13 0 7c0 5.25 7 11 7 11s7-5.75 7-11c0-3.87-3.13-7-7-7zm0 9.5A2.5 2.5 0 1 1 7 4.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 18'%3E%3Cpath d='M7 0C3.13 0 0 3.13 0 7c0 5.25 7 11 7 11s7-5.75 7-11c0-3.87-3.13-7-7-7zm0 9.5A2.5 2.5 0 1 1 7 4.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E")}

/* --- divisiekaarten ------------------------------------------------------- */
.mx-divisie{position:relative;overflow:hidden}
.mx-divisie .elementor-widget-image img{aspect-ratio:1/1!important;object-fit:cover!important;
  width:100%!important;display:block;filter:grayscale(1) contrast(1.05);transition:filter .35s ease,transform .5s ease}
.mx-divisie:hover .elementor-widget-image img{filter:grayscale(0);transform:scale(1.04)}
.mx-divisie::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.12);z-index:1;
  transition:background .35s ease;pointer-events:none}
.mx-divisie:hover::after{background:rgba(0,0,0,0)}

/* --- citaat + foto + lint -------------------------------------------------- */
.mx-citaatrij{position:relative;overflow:hidden}
.mx-citaatblok{flex:0 0 821px;width:821px!important}
.mx-portret{flex:0 0 570px;width:570px!important}
.mx-citaatblok{position:relative;z-index:2}
.mx-citaat{font:400 34px/1.25 Evogria,sans-serif;color:#fff;margin:0 0 24px;text-transform:none}
.mx-citaat__naam{font:400 18px/1.4 Epilogue,sans-serif;color:#00A3CC;margin:0}
.mx-portret{position:relative;z-index:2}
.mx-portret img{width:100%!important;height:100%!important;object-fit:cover!important;
  filter:grayscale(1);display:block}
.mx-portret,.mx-portret .elementor-widget-image,.mx-portret .elementor-widget-container{height:100%}
/* Het lint loopt achter de foto door en steekt er bovenaan rechts bovenuit. */
.mx-lint{position:absolute!important;left:40%;top:-90px;width:78%;z-index:1;pointer-events:none}
.mx-lint img{width:100%;height:auto;display:block}

/* --- tellers --------------------------------------------------------------- */
.mx-tellers{grid-auto-flow:row}
.mx-teller{grid-row-end:span 2;text-align:center}
.mx-teller:nth-child(2n){grid-row-start:1}
.mx-teller:nth-child(2n+1){grid-row-start:2}
.mx-meter{position:relative;width:96px!important;height:96px;border:3px solid #00A3CC;
  border-radius:50%;background:#fff;flex:0 0 auto}
.mx-meter .elementor-widget-image{position:absolute;bottom:50%;left:calc(50% - 13px);width:26px;
  transform-origin:center bottom;transform:rotate(var(--meter-degree,0deg));transition:transform .3s}
.mx-teller:hover .mx-meter .elementor-widget-image{transform:rotate(calc(var(--meter-degree,0deg) + 90deg))}
.mx-meter img{width:26px;height:26px;display:block}
.mx-teller1{--meter-degree:5deg}
.mx-teller2{--meter-degree:-145deg}
.mx-teller3{--meter-degree:124deg}
.mx-teller4{--meter-degree:-100deg}
.mx-teller5{--meter-degree:-55deg}
.mx-teller .elementor-counter{margin-top:14px}
.mx-teller .elementor-counter-number-wrapper{justify-content:center}
.mx-teller .elementor-widget-text-editor{max-width:200px;text-align:center}

/* --- Onze fans: horizontaal accordeon -------------------------------------- */
/* Elementor zet zelf background-image op .e-con, dus hier !important. */
.mx-fansband{background-image:linear-gradient(128deg,#CFECF4 0%,#FFFFFF 100%)!important}
.mx-fans{overflow:hidden;min-height:350px;align-items:center!important}
.mx-fan{position:relative;flex:0 0 auto!important;width:210px;padding:56px 40px!important;
  transition:width .45s cubic-bezier(.4,0,.2,1);overflow:hidden}
/* schuine scheidingslijn, dezelfde 18 graden als het origineel */
.mx-fan+.mx-fan::before{content:"";position:absolute;top:-60px;bottom:-60px;left:0;width:1px;
  background:rgba(23,23,23,.14);transform:rotate(18deg)}
.mx-fan__logo{flex:0 0 150px;width:150px!important}
.mx-fan__logo img{max-height:70px!important;width:auto!important;max-width:150px!important;object-fit:contain!important}
 /* max-width:0 alleen is niet genoeg: de tekst breekt dan af per letter en wordt
    honderden pixels hoog. Het origineel zet daarom ook de hoogte op 0. */
.mx-fan__tekst{max-width:0;height:0;opacity:0;overflow:hidden;
  transition:max-width .45s cubic-bezier(.4,0,.2,1),opacity .3s ease}
.mx-fan1{width:642px}
.mx-fan1 .mx-fan__tekst{max-width:600px;height:auto;opacity:1}
.mx-fans:hover .mx-fan{width:210px}
.mx-fans:hover .mx-fan1 .mx-fan__tekst{max-width:0;height:0;opacity:0}
.mx-fans .mx-fan:hover{width:642px}
.mx-fans .mx-fan:hover .mx-fan__tekst{max-width:600px;height:auto;opacity:1}

/* --- nieuws ---------------------------------------------------------------- */
.mx-nieuwsbeeld img{aspect-ratio:455/500!important;object-fit:cover!important;width:100%!important;
  display:block;filter:grayscale(1);transition:filter .4s ease}
.mx-nieuwskaart:hover .mx-nieuwsbeeld img{filter:grayscale(0)}

/* --- header ---------------------------------------------------------------- */
@media(max-width:1200px){
  .mx-navrij{flex-wrap:wrap!important;justify-content:flex-end!important}
}
@media(max-width:1024px){
  .mx-topbar{display:none!important}
  .mx-header .e-con-inner > .e-con:last-child{flex-wrap:nowrap!important;align-items:center!important}
  .mx-navrij{flex-wrap:nowrap!important;justify-content:flex-end!important;gap:10px!important;
    width:auto!important;flex:0 1 auto;min-width:0}
  .mx-navrij > .elementor-widget{flex:0 0 auto;width:auto!important;--container-widget-width:auto}
  .mx-navrij .elementor-button{padding-left:16px!important;padding-right:16px!important}
  .mx-cta-talent{display:none!important}
  .mx-header .elementor-widget-image img{max-width:170px!important}
}

/* --- mobiel ---------------------------------------------------------------- */
@media(max-width:1024px){
  .mx-filter__form{grid-template-columns:1fr 1fr;gap:16px}
  .mx-filter__knop{grid-column:1/-1;width:100%}
  .mx-lint{display:none}
  .mx-citaatblok,.mx-portret{width:100%!important;flex:1 1 100%!important}
  .mx-fans{flex-wrap:wrap!important;min-height:0}
  .mx-fan,.mx-fan1{width:100%!important;padding:28px 0!important}
  .mx-fan__tekst,.mx-fan1 .mx-fan__tekst{max-width:100%!important;opacity:1!important}
  .mx-fan+.mx-fan::before{display:none}
  .mx-fans:hover .mx-fan{width:100%}
  .mx-fans:hover .mx-fan1 .mx-fan__tekst{max-width:100%;opacity:1}
}
@media(max-width:767px){
  .mx-filterbalk{margin-top:-40px}
  .mx-filter__form{grid-template-columns:1fr;padding:20px}
  .mx-teller:nth-child(2n),.mx-teller:nth-child(2n+1){grid-row-start:auto}
  .mx-teller:nth-child(2){grid-row-start:2;grid-column:2}
  .mx-citaat{font-size:24px}
  .mx-citaatblok{padding:40px 24px!important}
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Evogria';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://maxicon.dysign.be/wp-content/uploads/elementor/custom-fonts/Evogria.woff2') format('woff2'),
		url('https://maxicon.dysign.be/wp-content/uploads/elementor/custom-fonts/Evogria.woff') format('woff');
}
/* End Custom Fonts CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Futura';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://maxicon.dysign.be/wp-content/uploads/2024/02/Future-Bold.ttf') format('truetype');
}
@font-face {
	font-family: 'Futura';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url('https://maxicon.dysign.be/wp-content/uploads/2024/02/Futura-Medium.ttf') format('truetype');
}
/* End Custom Fonts CSS */