.elementor-kit-7{--e-global-color-primary:#159FDC;--e-global-color-secondary:#0A6E9E;--e-global-color-text:#E8ECF2;--e-global-color-accent:#B9C1CC;--e-global-color-ce2d5c5:#0A0D12;--e-global-color-08e268d:#0C1017;--e-global-color-0601744:#12161F;--e-global-color-9473c62:#151B26;--e-global-color-b0ecae2:#233042;--e-global-color-f2a5593:#8A93A3;--e-global-color-1426973:#5B6576;--e-global-color-a64a873:#F7FAFC;--e-global-color-f670915:#38D996;--e-global-typography-primary-font-family:"Archivo";--e-global-typography-primary-font-weight:900;--e-global-typography-secondary-font-family:"Archivo";--e-global-typography-secondary-font-weight:800;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"JetBrains Mono";--e-global-typography-accent-font-weight:500;}.elementor-kit-7 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);}body{--the7-btn-s-font-family:"Archivo", Sans-serif;--the7-btn-m-font-family:"Archivo", Sans-serif;--the7-btn-l-font-family:"Archivo", Sans-serif;--the7-btn-lg-font-family:"Archivo", Sans-serif;--the7-btn-xl-font-family:"Archivo", Sans-serif;--the7-btn-s-font-weight:700;--the7-btn-m-font-weight:700;--the7-btn-l-font-weight:700;--the7-btn-lg-font-weight:700;--the7-btn-xl-font-weight:700;--the7-h1-font-family:"Archivo", Sans-serif;--the7-h2-font-family:"Archivo", Sans-serif;--the7-h3-font-family:"Archivo", Sans-serif;--the7-h4-font-family:"Archivo", Sans-serif;--the7-h5-font-family:"Archivo", Sans-serif;--the7-h6-font-family:"Archivo", Sans-serif;}body.rtl .elementor-labels-inline .elementor-field-group > .elementor-field-label{padding-left:0px;}body:not(.rtl) .elementor-labels-inline .elementor-field-group > .elementor-field-label{padding-right:0px;}body .elementor-labels-above .elementor-field-group > .elementor-field-label{padding-bottom:0px;}body .woocommerce-Reviews .elementor-field-group > label{margin-bottom:0px;}#the7-body{--the7-base-color:#E8ECF2;--the7-base-font-family:"Inter", Sans-serif;--the7-text-big-font-size:17px;--the7-text-small-font-size:17px;--the7-base-font-size:17px;--the7-base-font-weight:400;--the7-text-big-line-height:1.7em;--the7-text-small-line-height:1.7em;--the7-base-line-height:1.7em;--the7-links-color:#159FDC;--the7-title-color:#F7FAFC;--the7-h1-font-size:40px;--the7-h1-font-weight:800;--the7-h1-line-height:1.12em;--the7-h1-letter-spacing:-0.5px;--the7-h2-font-size:32px;--the7-h2-font-weight:800;--the7-h2-line-height:1.15em;--the7-h2-letter-spacing:-0.3px;--the7-h3-font-size:26px;--the7-h3-font-weight:700;--the7-h3-line-height:1.2em;--the7-h3-letter-spacing:-0.2px;--the7-h4-font-size:21px;--the7-h4-font-weight:700;--the7-h4-line-height:1.3em;--the7-h5-font-size:18px;--the7-h5-font-weight:700;--the7-h5-line-height:1.35em;--the7-h6-font-size:15px;--the7-h6-font-weight:600;--the7-h6-line-height:1.4em;--the7-h6-letter-spacing:0.5px;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}#the7-body{--the7-text-big-font-size:16px;--the7-text-small-font-size:16px;--the7-base-font-size:16px;--the7-h1-font-size:32px;--the7-h2-font-size:26px;--the7-h3-font-size:22px;--the7-h4-font-size:19px;--the7-h5-font-size:17px;--the7-h6-font-size:14px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ===== 911SI reusable classes ===== */

/* Display heading styles — added ON TOP of the base H1/H2 tags via a CSS class.
   The element stays a real <h1>/<h2>; these just enlarge the look on landing pages. */
.si-display{font-family:"Archivo",sans-serif!important;font-weight:900!important;
  font-size:clamp(2.4rem,6vw,4.9rem)!important;line-height:1.02!important;
  letter-spacing:-1.5px!important;color:#F7FAFC!important}
.si-h2-display{font-family:"Archivo",sans-serif!important;font-weight:800!important;
  font-size:clamp(1.8rem,3.6vw,2.9rem)!important;line-height:1.06!important;
  letter-spacing:-1px!important;color:#F7FAFC!important}
.si-accent-word{color:#159FDC!important}

/* Eyebrow label */
.si-eyebrow{font-family:"JetBrains Mono",monospace;font-size:12px;letter-spacing:3px;
  text-transform:uppercase;color:#159FDC;display:inline-flex;align-items:center;gap:.55rem}
.si-eyebrow::before{content:"";width:26px;height:1px;background:#159FDC;display:inline-block}

/* Viewfinder corner brackets — OUTER (hero / panels) */
.si-vf{position:relative}
.si-vf::before,.si-vf::after{content:"";position:absolute;inset:-14px;pointer-events:none;z-index:3}
.si-vf::before{background:
  linear-gradient(#159FDC,#159FDC) top left/34px 2px no-repeat,
  linear-gradient(#159FDC,#159FDC) top left/2px 34px no-repeat,
  linear-gradient(#159FDC,#159FDC) bottom right/34px 2px no-repeat,
  linear-gradient(#159FDC,#159FDC) bottom right/2px 34px no-repeat}
.si-vf::after{background:
  linear-gradient(#159FDC,#159FDC) top right/34px 2px no-repeat,
  linear-gradient(#159FDC,#159FDC) top right/2px 34px no-repeat,
  linear-gradient(#159FDC,#159FDC) bottom left/34px 2px no-repeat,
  linear-gradient(#159FDC,#159FDC) bottom left/2px 34px no-repeat}

/* Card hover lift + viewfinder brackets on hover */
.si-card{transition:transform .2s ease,border-color .2s ease,background .2s ease;position:relative}
.si-card:hover{transform:translateY(-4px);border-color:rgba(21,159,220,.45)!important;background:#151B26!important}
.si-card::before,.si-card::after{content:"";position:absolute;inset:10px;pointer-events:none;opacity:0;transition:opacity .2s ease;z-index:2}
.si-card:hover::before,.si-card:hover::after{opacity:.9}
.si-card::before{background:linear-gradient(#159FDC,#159FDC) top left/16px 2px no-repeat,linear-gradient(#159FDC,#159FDC) top left/2px 16px no-repeat}
.si-card::after{background:linear-gradient(#159FDC,#159FDC) bottom right/16px 2px no-repeat,linear-gradient(#159FDC,#159FDC) bottom right/2px 16px no-repeat}

/* Chip pill hover */
.si-chip{transition:border-color .15s ease,color .15s ease}
.si-chip:hover{border-color:#159FDC!important;color:#F7FAFC!important}

/* Pulsing live/online dot */
.si-live-dot{width:8px;height:8px;border-radius:50%;background:#38D996;display:inline-block;
  box-shadow:0 0 0 0 rgba(56,217,150,.6);animation:si-pulse 2.2s infinite}
@keyframes si-pulse{0%{box-shadow:0 0 0 0 rgba(56,217,150,.55)}70%{box-shadow:0 0 0 8px rgba(56,217,150,0)}100%{box-shadow:0 0 0 0 rgba(56,217,150,0)}}

/* Faint monitoring grid overlay */
.si-grid-bg{position:relative}
.si-grid-bg::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);
  background-size:60px 60px;-webkit-mask-image:radial-gradient(120% 100% at 50% 0,#000 30%,transparent 78%);mask-image:radial-gradient(120% 100% at 50% 0,#000 30%,transparent 78%)}
.si-grid-bg > *{position:relative;z-index:1}

/* Nav link underline */
.si-navlink{position:relative}
.si-navlink::after{content:"";position:absolute;left:0;bottom:-6px;height:2px;width:0;background:#159FDC;transition:width .2s ease}
.si-navlink:hover::after{width:100%}

@media(prefers-reduced-motion:reduce){.si-live-dot{animation:none}}



.si-chip{
  display:inline-flex!important;
  width:auto!important;
  flex:0 0 auto!important;
  max-width:max-content;
}



/* Hero: monitoring grid (::before) + moving scan light (::after) */
.si-hero{position:relative;overflow:hidden}
.si-hero::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);
  background-size:60px 60px;
  -webkit-mask-image:radial-gradient(120% 100% at 50% 0,#000 30%,transparent 78%);
          mask-image:radial-gradient(120% 100% at 50% 0,#000 30%,transparent 78%)}
.si-hero::after{content:"";position:absolute;left:0;right:0;top:0;height:180px;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(80,180,240,.12),transparent);
  animation:si-scan 7s linear infinite}
@keyframes si-scan{0%{transform:translateY(-200px)}100%{transform:translateY(100vh)}}
.si-hero > *{position:relative;z-index:1}
@media(prefers-reduced-motion:reduce){.si-hero::after{animation:none;opacity:0}}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'JetBrains Mono';
	font-display: auto;
	src: url('https://911si.aswd.net.za/wp-content/uploads/2026/08/JetBrainsMono-VariableFont_wght.ttf') format('truetype');
}
/* End Custom Fonts CSS */