.elementor-kit-9{--e-global-color-primary:#B6F23D;--e-global-color-secondary:#3DD7F0;--e-global-color-text:#9AA6B4;--e-global-color-accent:#FF9D3D;--e-global-color-22b56f5:#E9EEF3;--e-global-color-360a38d:#16202E;--e-global-color-e044534:#232C3A;--e-global-color-027ec18:#6B7686;--e-global-typography-primary-font-family:"Space Grotesk";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Space Grotesk";--e-global-typography-secondary-font-weight:500;--e-global-typography-text-font-family:"Space Grotesk";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Space Grotesk";--e-global-typography-accent-font-weight:500;}.elementor-kit-9 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 *//* ============================================================
   OPEN MAKER LABS — Elementor "bridge" stylesheet
   Paste ALL of this into:  Appearance → Customize → Additional CSS
   (works in Elementor Free AND Pro)

   It does two jobs:
   1. Sets the global blueprint background + base typography so
      every Elementor page inherits the look automatically.
   2. Defines helper CLASSES you add to widgets via
      Advanced → CSS Classes  (e.g. type "oml-card" into that box).
   ============================================================ */

:root{
  --oml-bg:#16202e; --oml-panel:#232c3a; --oml-panel-2:#2a3445;
  --oml-ink:#e9eef3; --oml-muted:#9aa6b4; --oml-faint:#6b7686;
  --oml-line:rgba(125,195,220,.14); --oml-line-2:rgba(125,195,220,.08);
  --oml-lime:#b6f23d; --oml-cyan:#3dd7f0; --oml-orange:#ff9d3d;
  --oml-mono:"JetBrains Mono",ui-monospace,monospace;
}

/* ---- 1. global page background: dark + blueprint grid ---- */
body{
  background-color:var(--oml-bg)!important;
  color:var(--oml-muted);
  background-image:
    linear-gradient(rgba(125,195,220,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(125,195,220,.05) 1px,transparent 1px),
    linear-gradient(rgba(125,195,220,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(125,195,220,.07) 1px,transparent 1px);
  background-size:34px 34px,34px 34px,170px 170px,170px 170px;
  background-attachment:fixed;
}
/* let the grid show through Elementor's wrappers */
.elementor-section,.e-con,.e-con-inner{background-color:transparent;}

h1,h2,h3,h4,h5,h6{color:var(--oml-ink);}
a{color:var(--oml-cyan);}

/* ---- 2. helper classes (add via Advanced → CSS Classes) ---- */

/* mono text */
.oml-mono{font-family:var(--oml-mono)!important;letter-spacing:.06em;}

/* eyebrow pill — put on a Heading/Text widget */
.oml-eyebrow{
  display:inline-flex;align-items:center;gap:10px;white-space:nowrap;
  font-family:var(--oml-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--oml-muted);border:1px solid var(--oml-line);background:rgba(35,44,58,.6);
  padding:7px 13px;border-radius:100px;
}
.oml-eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--oml-lime);box-shadow:0 0 8px var(--oml-lime);}

/* category tag pill */
.oml-tag{
  display:inline-block;font-family:var(--oml-mono);font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;padding:3px 9px;border:1px solid var(--oml-cyan);color:var(--oml-cyan);
  border-radius:100px;
}

/* datasheet CARD — put on a Container */
.oml-card{
  background:var(--oml-panel)!important;border:1px solid var(--oml-line)!important;
  border-radius:14px!important;transition:transform .2s,border-color .2s,box-shadow .2s;
}
.oml-card:hover{transform:translateY(-3px);border-color:rgba(125,195,220,.32)!important;
  box-shadow:0 16px 40px rgba(8,12,20,.5)!important;}

/* callout panel — Container; add oml-callout-cyan / -orange to recolour */
.oml-callout{background:var(--oml-panel)!important;border:1px solid var(--oml-line)!important;
  border-left:2px solid var(--oml-lime)!important;border-radius:12px!important;}
.oml-callout-cyan{border-left-color:var(--oml-cyan)!important;}
.oml-callout-orange{border-left-color:var(--oml-orange)!important;}

/* CTA band — Container */
.oml-cta{
  border:1px solid var(--oml-line)!important;border-radius:18px!important;
  background:
    radial-gradient(120% 140% at 85% 10%,rgba(40,80,110,.35),transparent 55%),
    radial-gradient(90% 120% at 5% 100%,rgba(40,70,40,.25),transparent 50%),
    var(--oml-panel)!important;
}

/* panel surface (generic lighter card) */
.oml-panel{background:var(--oml-panel)!important;border:1px solid var(--oml-line)!important;border-radius:14px!important;}

/* button looks — add oml-btn + (oml-btn-primary | oml-btn-ghost) to a Button widget */
.oml-btn-primary .elementor-button,.oml-btn-primary a.elementor-button{
  background:var(--oml-lime)!important;color:#16202e!important;border-radius:100px!important;font-weight:600!important;
}
.oml-btn-ghost .elementor-button,.oml-btn-ghost a.elementor-button{
  background:transparent!important;color:var(--oml-ink)!important;border:1px solid var(--oml-line)!important;border-radius:100px!important;font-weight:600!important;
}

/* spec row with dotted leader — for a product/spec table built as a Container per row:
   structure:  <div class="oml-spec"><span>LABEL</span><b>VALUE</b></div>  (HTML widget) */
.oml-spec{display:flex;align-items:baseline;gap:8px;font-family:var(--oml-mono);font-size:12.5px;
  padding:10px 0;border-bottom:1px solid var(--oml-line-2);}
.oml-spec span{color:var(--oml-faint);} 
.oml-spec b{color:var(--oml-ink);font-weight:500;margin-left:auto;}
.oml-spec::after{content:none;}

/* stock LED dot — span class */
.oml-led{display:inline-flex;align-items:center;gap:7px;font-family:var(--oml-mono);font-size:10px;letter-spacing:.1em;color:var(--oml-muted);}
.oml-led::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--oml-lime);box-shadow:0 0 8px var(--oml-lime);}/* End custom CSS */