.elementor-kit-9{--e-global-color-primary:#00E0E0;--e-global-color-secondary:#FFFFFFA3;--e-global-color-text:#9A9A9A;--e-global-color-accent:#00C611;--e-global-color-453730c:#FFFFFF;--e-global-color-b63fba0:#00000000;--e-global-color-b0bda07:#000000;--e-global-color-921f6c8:#141414;--e-global-color-6e104f0:#202020;--e-global-color-0c6f8fb:#181818;--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:"Fira Code";--e-global-typography-accent-font-weight:500;background-color:#141414;color:var( --e-global-color-secondary );font-family:"Roboto", Sans-serif;font-size:17px;font-weight:400;line-height:1.7em;letter-spacing:0px;}.elementor-kit-9 e-page-transition{background-color:var( --e-global-color-921f6c8 );}.elementor-kit-9 p{margin-block-end:20px;}.elementor-kit-9 a{color:var( --e-global-color-accent );}.elementor-kit-9 h1{font-size:52px;font-weight:600;line-height:1.1em;letter-spacing:-1px;}.elementor-kit-9 h2{font-size:40px;font-weight:600;line-height:1.15em;letter-spacing:-0.5px;}.elementor-kit-9 h3{font-size:30px;font-weight:600;line-height:1.25em;letter-spacing:0px;}.elementor-kit-9 h4{font-size:23px;font-weight:600;line-height:1.3em;letter-spacing:0px;}.elementor-kit-9 h5{font-size:19px;font-weight:500;line-height:1.4em;letter-spacing:0px;}.elementor-kit-9 h6{font-size:15px;font-weight:500;text-transform:uppercase;line-height:1.4em;letter-spacing:1.2px;}.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-kit-9 h1{font-size:42px;}.elementor-kit-9 h2{font-size:34px;}.elementor-kit-9 h3{font-size:26px;}.elementor-kit-9 h4{font-size:21px;}.elementor-kit-9 h5{font-size:18px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-9{font-size:16px;}.elementor-kit-9 h1{font-size:34px;}.elementor-kit-9 h2{font-size:28px;}.elementor-kit-9 h3{font-size:23px;}.elementor-kit-9 h4{font-size:19px;}.elementor-kit-9 h5{font-size:17px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */.futuristic-card {
  position: relative;
  border-radius: 14px;
  background: rgba(0, 0, 0, 0.75);
  padding: 20px;
  border: 1px solid rgba(0, 224, 19, 0.25);

  box-shadow:
    0 0 12px rgba(0, 224, 19, 0.18),
    0 0 30px rgba(0, 224, 19, 0.12),
    inset 0 0 20px rgba(0, 224, 19, 0.06);

  transition: all 0.3s ease;
}

/* subtle animated energy drift */
.futuristic-card::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  pointer-events: none;
  z-index: -1;

  background: radial-gradient(
    ellipse at 50% 50%,
    rgba(138, 255, 147, 0.35),
    rgba(0, 224, 19, 0.25),
    rgba(0, 122, 26, 0.15),
    transparent 70%
  );

  filter: blur(16px);

  animation: iotzCardGlow 4s ease-in-out infinite;
will-change: opacity;
}

/* breathing intensity */
@keyframes iotzCardGlow { 0%, 100% { opacity: .5 } 50% { opacity: .82 } }


/* Full-size background */
.futuristic-bg {
  width: 100%;
  height: 100%;
  z-index: -1;
  background: radial-gradient(
    ellipse at 50% 50%,
    #8AFF93 0%,
    #00e013 35%,
    #007a1a 60%,
    #000000 100%
  );
  background-size: 100% 100%;
  animation: greenPulse 4s ease-in-out infinite;
}

/* Smooth breathing animation */
@keyframes greenPulse {
  0% {
    background-position: 50% 40%;
    background-size: 180% 180%;
  }
  50% {
    background-position: 50% 60%;
    background-size: 220% 220%;
  }
  100% {
    background-position: 50% 40%;
    background-size: 180% 180%;
  }
}

/* rijen kaarten die even hoog moeten zijn */
.iotz-card-row,
.iotz-card-row > .e-con-inner {
  align-items: stretch;
}

.iotz-card-row .futuristic-card {
  flex-grow: 1;
}

/* ---- hero met oscilloscoop ---- */
.iotz-hero{position:relative;overflow:hidden}
.iotz-hero .iotz-scope{position:absolute !important;top:0;left:0;right:0;bottom:0;width:100% !important;max-width:none !important;height:100%;margin:0 !important;padding:0 !important;z-index:0;pointer-events:none}
.iotz-hero .iotz-scope-svg{position:absolute;top:0;left:0;width:100%;height:100%;display:block}
.iotz-hero::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse 46% 42% at 50% 50%,rgba(20,20,20,.72) 0%,rgba(20,20,20,.45) 55%,rgba(20,20,20,0) 80%)}
.iotz-hero .iotz-hero-content{position:relative;z-index:2}

.iotz-hero-logo{width:190px;max-width:190px;margin:-6px auto}
.iotz-hero-logo svg{display:block;width:100%;height:auto}
.iotz-hero-logo svg .s0,.iotz-hero-logo svg path{fill:var(--e-global-color-accent) !important}
@media (max-width:767px){.iotz-hero-logo{width:140px;max-width:140px}}

.iotz-scope-svg .sc-grid-line{fill:none;stroke:rgba(0,198,17,.17);stroke-width:1;vector-effect:non-scaling-stroke}
.iotz-scope-svg .sc-glow{fill:none;stroke-linecap:butt;stroke-linejoin:miter;vector-effect:non-scaling-stroke;stroke:rgb(150,255,160);stroke-width:2.5;filter:drop-shadow(0 0 6px rgba(0,224,19,.9)) drop-shadow(0 0 18px rgba(0,224,19,.5));animation-timing-function:linear;animation-iteration-count:infinite;opacity:0;visibility:hidden}
.iotz-scope-svg .sc-sweep{animation-name:iotzSweepX;animation-timing-function:linear;animation-iteration-count:infinite;will-change:transform}
.iotz-scope-svg .sc-sweep.t0{animation-duration:6s}
.iotz-scope-svg .sc-sweep.t1{animation-duration:9.4s;animation-delay:-2s}
.iotz-scope-svg .sc-sweep.t2{animation-duration:7.4s;animation-delay:-4s}
.iotz-scope-svg .r0{animation-duration:30s}
.iotz-scope-svg .r1{animation-duration:47s;animation-delay:-2s}
.iotz-scope-svg .r2{animation-duration:37s;animation-delay:-4s}
.iotz-scope-svg .v0{animation-name:scVis0}
.iotz-scope-svg .v1{animation-name:scVis1}
.iotz-scope-svg .v2{animation-name:scVis2}
.iotz-scope-svg .v3{animation-name:scVis3}
.iotz-scope-svg .v4{animation-name:scVis4}

@keyframes scVis0{0%{opacity:1;visibility:visible}19.99%{opacity:1;visibility:visible}20%{opacity:0;visibility:hidden}100%{opacity:0;visibility:hidden}}
@keyframes scVis1{0%{opacity:0;visibility:hidden}19.99%{opacity:0;visibility:hidden}20%{opacity:1;visibility:visible}39.99%{opacity:1;visibility:visible}40%{opacity:0;visibility:hidden}100%{opacity:0;visibility:hidden}}
@keyframes scVis2{0%{opacity:0;visibility:hidden}39.99%{opacity:0;visibility:hidden}40%{opacity:1;visibility:visible}59.99%{opacity:1;visibility:visible}60%{opacity:0;visibility:hidden}100%{opacity:0;visibility:hidden}}
@keyframes scVis3{0%{opacity:0;visibility:hidden}59.99%{opacity:0;visibility:hidden}60%{opacity:1;visibility:visible}79.99%{opacity:1;visibility:visible}80%{opacity:0;visibility:hidden}100%{opacity:0;visibility:hidden}}
@keyframes scVis4{0%{opacity:0;visibility:hidden}79.99%{opacity:0;visibility:hidden}80%{opacity:1;visibility:visible}100%{opacity:1;visibility:visible}}
@keyframes iotzSweepX{from{transform:translateX(0)}to{transform:translateX(2400px)}}

/* sinus-achtergrond onder de demonstratiesectie */
.iotz-waves-bg { position: relative; overflow: hidden; }
.iotz-waves-bg .iotz-waves {
  position: absolute !important; inset: 0;
  width: 100% !important; max-width: none !important; height: 100%;
  margin: 0 !important; padding: 0 !important;
  z-index: 0; pointer-events: none;
}
.iotz-waves-svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; }
.iotz-waves-bg::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(ellipse 55% 60% at 50% 50%,
    rgba(20,20,20,.82) 0%, rgba(20,20,20,.55) 55%, rgba(20,20,20,0) 82%);
}

.iotz-waves-svg .wv-grid {
  fill: none; stroke: rgba(0,198,17,.17); stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

/* beweging van de golven — elk zijn eigen periode */
.iotz-waves-svg .wv-bright {
  fill: none;
  stroke: rgb(150,255,160);
  stroke-width: 2.5;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 0 6px rgba(0,224,19,.9))
          drop-shadow(0 0 18px rgba(0,224,19,.5));
}

.iotz-waves-svg .wv-a0,
.iotz-waves-svg .wv-a1,
.iotz-waves-svg .wv-a2,
.iotz-waves-svg .wv-sweep { will-change: transform; }

.iotz-waves-svg .wv-a0 { animation: iotzWaveShiftA 14s linear infinite; }
.iotz-waves-svg .wv-a1 { animation: iotzWaveShiftB 40s linear infinite; }
.iotz-waves-svg .wv-a2 { animation: iotzWaveShiftC  5s linear infinite; }

@keyframes iotzWaveShiftA { to { transform: translateX(-208px) } }
@keyframes iotzWaveShiftB { to { transform: translateX(-416px) } }
@keyframes iotzWaveShiftC { to { transform: translateX(-104px) } }

/* de sweeps — elk een eigen ritme */
.iotz-waves-svg .wv-sweep-a { animation: iotzWaveSweep  7s linear infinite; }
.iotz-waves-svg .wv-sweep-b { animation: iotzWaveSweep 11s linear infinite; animation-delay: -3s; }
.iotz-waves-svg .wv-sweep-c { animation: iotzWaveSweep 16s linear infinite; animation-delay: -7s; }

@keyframes iotzWaveSweep {
  from { transform: translateX(400px); }
  to   { transform: translateX(4400px); }
}

@media (prefers-reduced-motion: reduce) {
  .iotz-waves-svg .wv-a0,
  .iotz-waves-svg .wv-a1,
  .iotz-waves-svg .wv-a2,
  .iotz-waves-svg .wv-sweep { animation: none; }
  .iotz-waves-svg .wv-bright { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .iotz-waves-svg .wv { animation: none; }
}

/* ---- toelichtende tekst onder een sectie ---- */
.iotz-aside{font-size:15px;max-width:720px;margin:8px auto 0}

@media (prefers-reduced-motion:reduce){
  .iotz-scope-svg .sc-sweep{animation:none;transform:translateX(1200px)}
}

/* mautic form space */
.iotz-form-card.futuristic-card { padding: 56px 44px; }
@media (max-width: 767px) {
  .iotz-form-card.futuristic-card { padding: 40px 24px; }
}

/* keep footer at bottom */
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

#content,
main.site-main {
  flex: 1 0 auto;
}/* End custom CSS */