/* Custom CSS Editor – paste into Zoho Sites Settings → Custom Code → CSS
 * Variables, global styles, menu, header, footer, cookie banner, SalesIQ launcher shell
 * Breakpoints: xs <576 | sm 576–767 | md 768–991 | lg 992–1199 | xl 1200+
 * Zoho Custom Fonts: Bionix (header), Space Grotesk (body), JetBrains (monospace)
 * SalesIQ iframe brand CSS: salesiq-juicebots-brand.css (uploaded separately in SalesIQ)
 */

:root{
  /* Brand colors */
  --jb-orange:#FF8C00;
  --jb-electric:#00D4FF;
  --jb-dark:#0d0221;
  --jb-dark-soft:#1a0a2e;

  /* Text opacity scale (S-R2) */
  --text-primary:rgba(255,255,255,0.95);
  --text-secondary:rgba(255,255,255,0.75);
  --text-tertiary:rgba(255,255,255,0.5);
  --text-disabled:rgba(255,255,255,0.35);

  /* Surface tokens (S-R6 / D-R4) — differentiated glassmorphism */
  --surface-card-bg:rgba(255,255,255,0.05);
  --surface-card-border:rgba(255,255,255,0.10);
  --surface-card-blur:6px;
  --surface-overlay-bg:rgba(255,255,255,0.07);
  --surface-overlay-border:rgba(255,255,255,0.12);
  --surface-overlay-blur:10px;
  --surface-form-bg:rgba(255,255,255,0.08);
  --surface-form-border:rgba(255,255,255,0.14);
  --surface-form-blur:14px;
  --surface-elevated:rgba(255,255,255,0.08);
  --surface-base:rgba(255,255,255,0.04);

  /* Form validation (S-R5) */
  --color-error:#FF6B6B;
  --color-success:#2DD4A8;

  /* Spacing scale (R-R2) */
  --space-1:0.25rem;
  --space-2:0.5rem;
  --space-3:0.75rem;
  --space-4:1rem;
  --space-6:1.5rem;
  --space-8:2rem;
  --space-12:3rem;
  --space-16:4rem;

  /* Letter-spacing scale (F-R5) */
  --ls-tight:0.02em;
  --ls-normal:0.04em;
  --ls-wide:0.08em;
  --ls-ultra:0.15em;

  /* Section padding */
  --section-padding:4rem;
  --section-padding-tablet:3.5rem;
  --section-padding-mobile:2.5rem;
  --section-padding-xs:2rem;

  /* Motion */
  --menu-radius:12px;
  --menu-ease:cubic-bezier(0.5,1,0.89,1);
  --ease-out-expo:cubic-bezier(0.16,1,0.3,1);

  /* Typography */
  --jb-font-header:'Bionix','Space Grotesk',sans-serif;
  --jb-font-body:'Space Grotesk',sans-serif;
  --jb-font-mono:'JetBrains',monospace;
}

html,body{overflow-x:hidden!important;max-width:100vw}

/* ========== GLOBAL DARK BACKGROUND — prevent white flash on load ========== */
html,body{background-color:#0d0221!important}
#thememaincontent{background-color:transparent!important}
.theme-content-area,
.theme-content-container,
.theme-content-area-inner{
  background-color:transparent!important;
}
.zpsection,
.zpsection.zpdefault-section,
.zpsection.zpdefault-section-bg,
.zpsection.zplight-section,
.zpsection.zplight-section-bg{
  background-color:#0d0221!important;
}
#thememaincontent .zpsection[id]{
  background:linear-gradient(180deg,#0d0221 0%,#1a0a2e 50%,#0d0221 100%)!important;
  background-color:#0d0221!important;
}
.hero-container,.zphero,
.zphero-slide,.zpslider-img{
  background-color:#0d0221!important;
}

/* ========== HIDE ZOHO NATIVE HEADER ========== */
.zpheader-style-01,
.theme-mobile-header-style-03,
.theme-mobile-header-fixed,
[data-megamenu-content-container].theme-header{
  display:none!important;
}

/* ========== CUSTOM OVERLAY NAVIGATION ========== */

/* --- Header bar --- */
#jb-nav-header{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  z-index:1100;
  pointer-events:none;
  box-sizing:border-box;
}
#jb-nav-header::before{
  content:'';
  position:absolute;
  inset:0;
  background:rgba(13,2,33,0.7);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,140,0,0.08);
  z-index:-1;
}
#jb-nav-header *{pointer-events:auto}
.jb-nav-header-wrap{
  position:relative;
  width:100%;
  max-width:min(1200px,100%);
  margin:0 auto;
  padding:16px clamp(0.75rem,3vw,2rem);
  display:flex;
  align-items:center;
  justify-content:space-between;
  box-sizing:border-box;
}
.jb-nav-logo-wrap{
  display:block;
  cursor:pointer;
  text-decoration:none;
}
.jb-nav-logo-img{
  height:clamp(28px,6vw,44px);
  width:auto;
  max-width:50vw;
  display:block;
  transition:opacity 0.3s ease;
}
.jb-nav-logo-wrap:hover .jb-nav-logo-img{opacity:0.85}

/* --- Right side: HUD + hamburger --- */
.jb-nav-right{
  display:flex;
  align-items:center;
  gap:clamp(0.5rem,2vw,1.25rem);
  flex-shrink:0;
}

/* --- HUD progress bar (inline in header on desktop, fixed bottom-left on mobile) --- */
#jb-hud-top{
  display:flex;
  align-items:center;
  gap:0.5rem;
  font-family:var(--jb-font-mono,'JetBrains',monospace);
  font-size:0.6rem;
  letter-spacing:0.15em;
  color:rgba(255,255,255,0.4);
  text-transform:uppercase;
  opacity:0;
  animation:jb-hud-fade-in 0.6s ease 1s forwards;
}
#jb-hud-pct{
  font-size:0.6rem;
  letter-spacing:0.15em;
  color:rgba(255,255,255,0.4);
  flex-shrink:0;
}
.jb-hud-bar{
  width:clamp(3rem,8vw,6rem);
  height:2px;
  min-height:1px;
  background:rgba(255,255,255,0.15);
  position:relative;
  overflow:hidden;
  flex-shrink:0;
  transform:translateZ(0);
}
.jb-hud-bar-fill{
  position:absolute;
  top:0;left:0;bottom:0;
  width:0%;
  background:linear-gradient(90deg,var(--jb-orange,#FF8C00),var(--jb-electric,#00D4FF));
  transition:width 0.1s linear;
}
#jb-hud-caption{
  font-size:0.55rem;
  color:var(--jb-orange,#FF8C00);
  letter-spacing:0.12em;
  white-space:nowrap;
}

/* --- Hamburger icon (Iconoir) --- */
.jb-nav-but-wrap{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.jb-menu-icon{
  position:relative;
  z-index:2;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
}
.jb-menu-icon__open,
.jb-menu-icon__close{
  font-size:26px;
  color:var(--jb-orange);
  transition:opacity 0.25s ease,transform 0.3s ease;
}
.jb-menu-icon__close{
  position:absolute;
  opacity:0;
  transform:rotate(-90deg);
}
.jb-menu-icon:hover .jb-menu-icon__open,
.jb-menu-icon:hover .jb-menu-icon__close{
  filter:drop-shadow(0 0 6px rgba(255,140,0,0.4));
}

/* --- Hamburger → X swap (body.jb-nav-active) --- */
body.jb-nav-active .jb-menu-icon__open{
  opacity:0;
  transform:rotate(90deg);
}
body.jb-nav-active .jb-menu-icon__close{
  opacity:1;
  transform:rotate(0deg);
}

/* --- Two-layer overlay reveal --- */
.jb-nav-overlay{
  position:fixed;
  z-index:1050;
  visibility:hidden;
}
.jb-nav-overlay::before,
.jb-nav-overlay::after{
  content:"";
  position:fixed;
  width:100vw;
  height:100vh;
  top:0;left:0;
  background:linear-gradient(135deg,rgba(255,140,0,0.25) 0%,rgba(0,212,255,0.2) 40%,rgba(13,2,33,0.6) 70%);
  border-bottom-left-radius:200%;
  z-index:-1;
  transform:translateX(100%) translateY(-100%);
  transition:transform cubic-bezier(0.77,0,0.175,1) 0.6s,border-radius linear 0.8s;
}
.jb-nav-overlay::after{
  background:rgba(13,2,33,0.88);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  transition-delay:0s;
}
.jb-nav-overlay::before{
  transition-delay:0.2s;
}

body.jb-nav-active .jb-nav-overlay{
  visibility:visible;
}
body.jb-nav-active .jb-nav-overlay::before,
body.jb-nav-active .jb-nav-overlay::after{
  transform:translateX(0%) translateY(0%);
  border-radius:0;
}
body.jb-nav-active .jb-nav-overlay::after{
  transition-delay:0.1s;
}
body.jb-nav-active .jb-nav-overlay::before{
  transition-delay:0s;
}

/* --- Overlay content --- */
.jb-nav-overlay__content{
  position:fixed;
  visibility:hidden;
  top:50%;
  margin-top:20px;
  transform:translate(0%,-50%);
  width:100%;
  text-align:center;
  z-index:1060;
}
body.jb-nav-active .jb-nav-overlay__content{
  visibility:visible;
}

/* --- Menu list --- */
.jb-nav-overlay__list{
  position:relative;
  padding:0;
  margin:0;
  list-style:none;
  z-index:2;
}
.jb-nav-overlay__list-item{
  position:relative;
  display:block;
  transition-delay:0.8s;
  opacity:0;
  text-align:center;
  color:#fff;
  overflow:hidden;
  font-family:var(--jb-font-header);
  font-size:5.6vh;
  font-weight:900;
  line-height:1.15;
  letter-spacing:2px;
  transform:translate(100px,0%);
  transition:opacity 0.2s ease,transform 0.3s ease;
  margin:0;
}
.jb-nav-overlay__list-item a{
  position:relative;
  text-decoration:none;
  color:rgba(255,255,255,0.6);
  overflow:hidden;
  cursor:pointer;
  padding-left:5px;
  padding-right:5px;
  font-weight:900;
  z-index:2;
  display:inline-block;
  text-transform:uppercase;
  transition:all 200ms linear;
}
.jb-nav-overlay__list-item a::after{
  position:absolute;
  content:'';
  bottom:0;
  left:50%;
  width:0;
  height:0;
  opacity:0;
  background-color:var(--jb-orange);
  z-index:1;
  transition:all 200ms linear;
}
.jb-nav-overlay__list-item a:hover::after{
  height:4px;
  opacity:1;
  left:0;
  width:100%;
  background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric));
}
.jb-nav-overlay__list-item a:hover{
  background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric));
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
}
.jb-nav-overlay__list-item.jb-nav-active-item a{
  background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric));
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
}
.jb-nav-overlay__list-item.jb-nav-active-item a::after{
  height:4px;
  opacity:1;
  left:0;
  width:100%;
  background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric));
}

/* --- CTA button in overlay --- */
.jb-nav-overlay__cta-item{
  margin-top:1.6rem;
}
.jb-nav-overlay__cta{
  font-family:var(--jb-font-body)!important;
  font-size:1rem!important;
  font-weight:600!important;
  letter-spacing:0.08em!important;
  text-transform:uppercase!important;
  color:var(--jb-orange)!important;
  -webkit-text-fill-color:var(--jb-orange)!important;
  border:2px solid var(--jb-orange)!important;
  padding:0.75rem 2.5rem!important;
  border-radius:8px!important;
  transition:all 0.3s ease!important;
  display:inline-block!important;
}
.jb-nav-overlay__cta:hover{
  background:var(--jb-orange)!important;
  color:var(--jb-dark)!important;
  -webkit-text-fill-color:var(--jb-dark)!important;
  box-shadow:0 0 20px rgba(255,140,0,0.4)!important;
}
.jb-nav-overlay__cta::after{display:none!important}

/* --- Staggered item reveal on body.jb-nav-active --- */
body.jb-nav-active .jb-nav-overlay__list-item{
  opacity:1;
  transform:translateX(0%);
  transition:opacity 0.3s ease,transform 0.3s ease,color 0.3s ease;
}
body.jb-nav-active .jb-nav-overlay__list-item:nth-child(1){transition-delay:0.7s}
body.jb-nav-active .jb-nav-overlay__list-item:nth-child(2){transition-delay:0.8s}
body.jb-nav-active .jb-nav-overlay__list-item:nth-child(3){transition-delay:0.9s}
body.jb-nav-active .jb-nav-overlay__list-item:nth-child(4){transition-delay:1.0s}
body.jb-nav-active .jb-nav-overlay__list-item:nth-child(5){transition-delay:1.1s}
body.jb-nav-active .jb-nav-overlay__list-item:nth-child(6){transition-delay:1.2s}
body.jb-nav-active .jb-nav-overlay__list-item:nth-child(7){transition-delay:1.3s}
body.jb-nav-active .jb-nav-overlay__list-item:nth-child(8){transition-delay:1.4s}

/* --- HUD hiding + scroll lock when overlay open --- */
body.jb-nav-active #jb-hud-top{opacity:0!important;pointer-events:none!important}
body.jb-nav-active{overflow:hidden!important}

/* --- Responsive: tablet --- */
@media (max-width:991px){
  .jb-nav-header-wrap{padding-top:12px;padding-bottom:12px}
  .jb-nav-overlay__list-item{font-size:4.8vh}
  /* HUD: bottom-left slim bar on tablet+ mobile */
  #jb-hud-top{
    position:fixed!important;
    bottom:1.25rem!important;
    left:1rem!important;
    top:auto!important;
    right:auto!important;
    z-index:1000;
    flex-direction:row;
    align-items:center;
    gap:0.4rem;
    background:transparent;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    padding:0;
    border-radius:0;
    border:none;
  }
}
/* --- Responsive: mobile --- */
@media (max-width:767px){
  .jb-nav-header-wrap{padding-top:10px;padding-bottom:10px}
  .jb-nav-logo-img{height:clamp(28px,6vw,34px)}
  .jb-nav-overlay__list-item{font-size:4vh;letter-spacing:1px}
  .jb-nav-overlay__cta-item{margin-top:1.2rem}
  .jb-menu-icon__open,.jb-menu-icon__close{font-size:22px}
}
@media (max-width:575px){
  .jb-nav-overlay__list-item{font-size:3.2vh}
  .jb-menu-icon__open,.jb-menu-icon__close{font-size:20px}
  #jb-hud-top{
    bottom:1rem!important;
    left:0.75rem!important;
    font-size:0.5rem;
    gap:0.3rem;
  }
}

/* --- Reduced motion --- */
@media (prefers-reduced-motion:reduce){
  .jb-menu-icon__line,.jb-menu-icon__line-left,.jb-menu-icon__line-right{transition:none}
  .jb-nav-overlay::before,.jb-nav-overlay::after{transition:none}
  .jb-nav-overlay__list-item{transition:none}
  .jb-nav-overlay__cta{transition:none!important}
}

/* ========== MENU (legacy Zoho brand overrides — kept as fallback) ========== */
.zpheader-style-01.theme-header-fixed .theme-header,.zpheader-style-01 .theme-header .zpcontainer,.theme-header[data-header="zptheme-data-header-transparent"],.theme-header[data-header="zptheme-data-header-transparent"] .zpcontainer,.zpheader-style-01 .theme-header .theme-branding-info,.zpheader-style-01 .theme-header .theme-logo-parent,.zpheader-style-01 .theme-header .theme-navigation-and-icons,.zpheader-style-01 .theme-header .theme-menu-area,[data-megamenu-content-container].theme-header,[data-megamenu-content-container].theme-header .zpcontainer,[data-megamenu-content-container].theme-header .theme-branding-info,[data-megamenu-content-container].theme-header .theme-logo-parent,[data-megamenu-content-container].theme-header .theme-navigation-and-icons,[data-megamenu-content-container].theme-header .theme-responsive-menu-area,[data-megamenu-content-container].theme-header .theme-responsive-menu-container{background:linear-gradient(180deg,#0d0221 0%,#1a0a2e 50%,#0d0221 100%)!important;background-color:#0d0221!important}
.zpheader-style-01 .theme-menu>ul>li>a,.theme-menu>ul>li>a{color:rgba(255,255,255,0.8)!important;background:transparent!important;transition:color 0.3s ease,-webkit-text-fill-color 0.3s ease,background 0.3s ease,background-clip 0.3s ease}
.zpheader-style-01 .theme-menu>ul>li>a .theme-menu-name,.zpheader-style-01 .theme-menu>ul>li>a span,.theme-menu>ul>li>a .theme-menu-name,.theme-menu>ul>li>a span{color:inherit!important}
.theme-menu>ul>li.theme-menu-selected>a,.theme-menu>ul>li.theme-menu-selected>a .theme-menu-name,.theme-menu>ul>li.theme-menu-selected>a span{background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important}
.theme-menu>ul>li:hover>a,.theme-menu>ul>li:hover>a .theme-menu-name,.theme-menu>ul>li:hover>a span{background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important;text-shadow:0 0 12px rgba(255,140,0,0.3)!important}
/* Submenu – brand colors only; Zoho controls layout/behavior */
.theme-sub-menu{background:rgba(13,2,33,0.98)!important;border-color:rgba(255,140,0,0.35)!important}
.theme-sub-menu li{background:transparent!important}
.theme-sub-menu li a,.theme-sub-menu li .theme-menu-name,.theme-sub-menu li span{color:rgba(255,255,255,0.95)!important;-webkit-text-fill-color:rgba(255,255,255,0.95)!important}
.theme-sub-menu li a{background:transparent!important}
.theme-sub-menu li.theme-menu-selected a,.theme-sub-menu li.theme-menu-selected .theme-menu-name,.theme-sub-menu li.theme-menu-selected span{background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important}
.theme-sub-menu li:hover a,.theme-sub-menu li:hover .theme-menu-name,.theme-sub-menu li:hover span{background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important}
.theme-sub-menu li a .theme-menu-name{color:inherit!important}
/* Desktop submenu (incl. theme-sub-menu-position-change in mobile header context) */
.theme-sub-menu.theme-sub-menu-position-change,.zpheader-style-01.theme-mobile-header-style-03 .theme-sub-menu,[data-megamenu-content-container] .theme-sub-menu{background:rgba(13,2,33,0.98)!important;border-color:rgba(255,140,0,0.35)!important}
.theme-sub-menu.theme-sub-menu-position-change li,.theme-sub-menu.theme-sub-menu-position-change li a,.theme-sub-menu.theme-sub-menu-position-change li .theme-menu-name,.theme-sub-menu.theme-sub-menu-position-change li span,.zpheader-style-01.theme-mobile-header-style-03 .theme-sub-menu li,.zpheader-style-01.theme-mobile-header-style-03 .theme-sub-menu li a,.zpheader-style-01.theme-mobile-header-style-03 .theme-sub-menu li .theme-menu-name,.zpheader-style-01.theme-mobile-header-style-03 .theme-sub-menu li span,[data-megamenu-content-container] .theme-sub-menu li,[data-megamenu-content-container] .theme-sub-menu li a,[data-megamenu-content-container] .theme-sub-menu li .theme-menu-name,[data-megamenu-content-container] .theme-sub-menu li span{color:rgba(255,255,255,0.95)!important;-webkit-text-fill-color:rgba(255,255,255,0.95)!important;font-family:var(--jb-font-mono)!important}
.theme-sub-menu.theme-sub-menu-position-change li,.zpheader-style-01.theme-mobile-header-style-03 .theme-sub-menu li,[data-megamenu-content-container] .theme-sub-menu li{background:transparent!important}
.theme-sub-menu.theme-sub-menu-position-change li a,[data-megamenu-content-container] .theme-sub-menu li a{background:transparent!important}
.theme-sub-menu.theme-sub-menu-position-change li.theme-menu-selected a,.theme-sub-menu.theme-sub-menu-position-change li.theme-menu-selected .theme-menu-name,.theme-sub-menu.theme-sub-menu-position-change li.theme-menu-selected span,.zpheader-style-01.theme-mobile-header-style-03 .theme-sub-menu li.theme-menu-selected a,.zpheader-style-01.theme-mobile-header-style-03 .theme-sub-menu li.theme-menu-selected .theme-menu-name,.zpheader-style-01.theme-mobile-header-style-03 .theme-sub-menu li.theme-menu-selected span,[data-megamenu-content-container] .theme-sub-menu li.theme-menu-selected a,[data-megamenu-content-container] .theme-sub-menu li.theme-menu-selected .theme-menu-name,[data-megamenu-content-container] .theme-sub-menu li.theme-menu-selected span{background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important}
.theme-sub-menu.theme-sub-menu-position-change li:hover a,.theme-sub-menu.theme-sub-menu-position-change li:hover .theme-menu-name,.theme-sub-menu.theme-sub-menu-position-change li:hover span,.zpheader-style-01.theme-mobile-header-style-03 .theme-sub-menu li:hover a,.zpheader-style-01.theme-mobile-header-style-03 .theme-sub-menu li:hover .theme-menu-name,.zpheader-style-01.theme-mobile-header-style-03 .theme-sub-menu li:hover span,[data-megamenu-content-container] .theme-sub-menu li:hover a,[data-megamenu-content-container] .theme-sub-menu li:hover .theme-menu-name,[data-megamenu-content-container] .theme-sub-menu li:hover span{background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important}
.zpheader-style-01 .theme-header .theme-menu,.zpheader-style-01 .theme-menu-area .theme-menu{background:transparent!important}

/* Responsive menu (hamburger panel) – brand colors only */
.theme-responsive-menu.theme-menu-area,.theme-responsive-menu .theme-menu,.theme-responsive-menu .theme-menu.theme-toggle-animate{background:linear-gradient(180deg,#0d0221 0%,#1a0a2e 100%)!important;background-color:#0d0221!important}
.theme-responsive-menu .theme-menu>ul>li{background:transparent!important}
.theme-responsive-menu .theme-menu>ul>li>a,.theme-responsive-menu .theme-menu>ul>li>a .theme-menu-name,.theme-responsive-menu .theme-menu>ul>li>a span,.theme-responsive-menu .theme-menu .theme-menu-name,.theme-responsive-menu .theme-menu a{font-family:var(--jb-font-mono)!important;color:rgba(255,255,255,0.95)!important;-webkit-text-fill-color:rgba(255,255,255,0.95)!important}
.theme-responsive-menu .theme-menu>ul>li.theme-menu-selected>a,.theme-responsive-menu .theme-menu>ul>li.theme-menu-selected>a .theme-menu-name,.theme-responsive-menu .theme-menu>ul>li.theme-menu-selected>a span{background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important}
.theme-responsive-menu .theme-menu>ul>li:hover>a,.theme-responsive-menu .theme-menu>ul>li:hover>a .theme-menu-name,.theme-responsive-menu .theme-menu>ul>li:hover>a span{background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important;text-shadow:0 0 12px rgba(255,140,0,0.3)!important}
.theme-responsive-menu .theme-sub-menu{background:rgba(13,2,33,0.98)!important;border-color:rgba(255,140,0,0.35)!important}
.theme-responsive-menu .theme-sub-menu li{background:transparent!important}
.theme-responsive-menu .theme-sub-menu li a,.theme-responsive-menu .theme-sub-menu li .theme-menu-name,.theme-responsive-menu .theme-sub-menu li span{font-family:var(--jb-font-mono)!important;color:rgba(255,255,255,0.95)!important;-webkit-text-fill-color:rgba(255,255,255,0.95)!important}
.theme-responsive-menu .theme-sub-menu li:hover a,.theme-responsive-menu .theme-sub-menu li:hover .theme-menu-name,.theme-responsive-menu .theme-sub-menu li:hover span{background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important}

/* ========== MOBILE HEADER STYLE 03 (top + bottom bars) ========== */
.theme-mobile-header-style-03.theme-mobile-header-top,.theme-mobile-header-style-03.theme-mobile-header-top .theme-mobile-header-nav-wrapper{background:linear-gradient(180deg,#0d0221 0%,#1a0a2e 50%,#0d0221 100%)!important;background-color:#0d0221!important}
.theme-mobile-header-style-03.theme-mobile-header-bottom{background:linear-gradient(180deg,#0d0221 0%,#1a0a2e 50%,#0d0221 100%)!important;background-color:#0d0221!important;border-top:1px solid rgba(255,140,0,0.25)!important}
.theme-mobile-header-style-03 .theme-mobile-header-site-name,.theme-mobile-header-style-03 .theme-mobile-header-site-caption,.theme-mobile-header-style-03 .theme-mobile-header-pagename{color:rgba(255,255,255,0.95)!important;-webkit-text-fill-color:rgba(255,255,255,0.95)!important}
.theme-mobile-header-style-03 .theme-mobile-header-icon,.theme-mobile-header-style-03 .theme-mobile-header-icon a{color:rgba(255,255,255,0.9)!important}
.theme-mobile-header-style-03 .theme-mobile-header-icon svg,.theme-mobile-header-style-03 .theme-mobile-header-search-icon{fill:rgba(255,255,255,0.9)!important}
.theme-mobile-header-style-03 .theme-mobile-header-icon:hover,.theme-mobile-header-style-03 .theme-mobile-header-icon:hover svg{color:var(--jb-orange)!important;fill:var(--jb-orange)!important}
.theme-mobile-header-style-03 .theme-mobile-header-goback a,.theme-mobile-header-style-03 .theme-mobile-header-goback svg{color:rgba(255,255,255,0.9)!important;fill:rgba(255,255,255,0.9)!important}
.theme-mobile-header-style-03 .theme-mobile-header-goback a:hover,.theme-mobile-header-style-03 .theme-mobile-header-goback a:hover svg{color:var(--jb-orange)!important;fill:var(--jb-orange)!important}
.theme-mobile-header-style-03 .theme-mobile-header-search-back svg{fill:rgba(255,255,255,0.9)!important}
.theme-mobile-header-style-03.theme-mobile-header-slidewrapper,.theme-mobile-header-style-03 .theme-mobile-header-slide,.theme-mobile-header-style-03.theme-mobile-header-slidewrapper.active .theme-mobile-header-slide{background:linear-gradient(180deg,#0d0221 0%,#1a0a2e 100%)!important;background-color:#0d0221!important}
.theme-mobile-header-style-03 .theme-mobile-header-slide-header,.theme-mobile-header-style-03.theme-mobile-header-slidewrapper.active .theme-mobile-header-slide-header{background:linear-gradient(180deg,#0d0221 0%,#1a0a2e 100%)!important;background-color:#0d0221!important;border-bottom:1px solid rgba(255,140,0,0.25)!important}
.theme-mobile-header-style-03 .theme-mobile-header-slide-content,.theme-mobile-header-style-03 .theme-mobile-header-slide-content.active,.theme-mobile-header-style-03.theme-mobile-header-slidewrapper.active .theme-mobile-header-slide-content,.theme-mobile-header-style-03.theme-mobile-header-slidewrapper.active .theme-mobile-header-slide-content.active{background:linear-gradient(180deg,#0d0221 0%,#1a0a2e 100%)!important;background-color:#0d0221!important}
.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-responsive-menu,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-responsive-menu .theme-menu,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-responsive-menu-area,.theme-mobile-header-style-03.theme-mobile-header-slidewrapper.active .theme-mobile-header-slide-content .theme-responsive-menu,.theme-mobile-header-style-03.theme-mobile-header-slidewrapper.active .theme-mobile-header-slide-content .theme-responsive-menu .theme-menu,.theme-mobile-header-style-03.theme-mobile-header-slidewrapper.active .theme-mobile-header-slide-content .theme-responsive-menu-area{background:transparent!important}
.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-menu>ul>li>a,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-menu .theme-menu-name,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-menu a,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-responsive-menu a,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-responsive-menu .theme-menu-name,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-mobile-header-navigation a,.theme-mobile-header-style-03 .theme-mobile-header-slide-content[data-zs-drawer-content="navigation"] a{font-family:var(--jb-font-mono)!important;color:rgba(255,255,255,0.95)!important;-webkit-text-fill-color:rgba(255,255,255,0.95)!important}
.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-menu>ul>li.theme-menu-selected>a,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-menu>ul>li.theme-menu-selected>a .theme-menu-name,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-menu>ul>li.theme-menu-selected>a span,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-responsive-menu .theme-menu-selected>a,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-responsive-menu .theme-menu-selected .theme-menu-name{background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important}
.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-menu>ul>li:hover>a,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-menu>ul>li:hover>a .theme-menu-name,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-menu>ul>li:hover>a span,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-responsive-menu .theme-menu>ul>li:hover>a,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-responsive-menu .theme-menu>ul>li:hover .theme-menu-name{background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important;text-shadow:0 0 12px rgba(255,140,0,0.3)!important}
.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-sub-menu{background:rgba(13,2,33,0.98)!important;border-color:rgba(255,140,0,0.35)!important}
.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-sub-menu li a,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-sub-menu li .theme-menu-name,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-sub-menu li span{font-family:var(--jb-font-mono)!important;color:rgba(255,255,255,0.95)!important;-webkit-text-fill-color:rgba(255,255,255,0.95)!important}
.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-sub-menu li:hover a,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-sub-menu li:hover .theme-menu-name,.theme-mobile-header-style-03 .theme-mobile-header-slide-content .theme-sub-menu li:hover span{background:linear-gradient(90deg,var(--jb-orange),var(--jb-electric))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important}
.theme-mobile-header-style-03 .theme-mobile-header-slide-close{color:rgba(255,255,255,0.9)!important}
.theme-mobile-header-style-03 .theme-mobile-header-slide-close svg{fill:currentColor!important}
.theme-mobile-header-style-03 .theme-mobile-header-slide-close:hover{color:var(--jb-orange)!important}

/* ========== FOOTER ========== */
.theme-footer-area,.theme-footer-area.zpdark-section,.theme-footer-area.zpdark-section-bg{background:linear-gradient(180deg,#0d0221 0%,#1a0a2e 50%,#0d0221 100%)!important;background-color:#0d0221!important;padding:clamp(2rem,4vw,3rem) 0 clamp(1.5rem,3vw,2rem)!important}
.theme-footer-area .zplight-section,.theme-footer-area .zplight-section-bg,.theme-footer-area .zpdefault-section,.theme-footer-area .zpdefault-section-bg{background:transparent!important}
.theme-footer-area .footer-container,.theme-footer-area .zpcontent-container{background:transparent!important}
.theme-footer-area .zpheading,.theme-footer-area h4,.theme-footer-area h5,.theme-footer-area h6{font-family:var(--jb-font-body)!important;font-weight:700!important;font-size:clamp(1rem,2vw,1.1rem)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;letter-spacing:0.06em!important;text-transform:uppercase!important;text-shadow:0 2px 12px rgba(0,0,0,0.4)}
.theme-footer-area .zptext p,.theme-footer-area .zptext p span,.theme-footer-area p{color:rgba(255,255,255,0.85)!important;-webkit-text-fill-color:rgba(255,255,255,0.85)!important;font-size:clamp(0.875rem,1.5vw,0.95rem)!important;line-height:1.6!important;text-shadow:0 1px 3px rgba(0,0,0,0.25)}
.theme-footer-area .zpapp .theme-menu>ul>li>a,.theme-footer-area .zpapp .theme-menu-name,.theme-footer-area .zpapp a{color:rgba(255,255,255,0.85)!important;-webkit-text-fill-color:rgba(255,255,255,0.85)!important;font-family:var(--jb-font-body)!important;font-weight:600!important;font-size:clamp(0.85rem,1.5vw,0.9rem)!important;transition:color 0.2s ease;padding:0.5rem 0!important}
.theme-footer-area .zpapp .theme-menu>ul>li>a:hover,.theme-footer-area .zpapp a:hover{color:var(--jb-orange)!important;-webkit-text-fill-color:var(--jb-orange)!important;text-shadow:0 0 8px rgba(255,140,0,0.3)}
.theme-footer-area .zpdivider-common,.theme-footer-area .zpdivider-container .zpdivider-common{border-color:rgba(255,255,255,0.12)!important;border-top-width:1px!important}
.theme-footer-area .zpsocialprofile-wrapper,.theme-footer-area .zpsocialprofile{transition:transform 0.2s ease,filter 0.2s ease}
.theme-footer-area .zpsocialprofile-wrapper:hover,.theme-footer-area .zpsocialprofile:hover{transform:scale(1.1);filter:drop-shadow(0 0 8px rgba(255,140,0,0.5))}
.theme-footer-area .zpsocialprofile-instagram .zpsocialprofile,.theme-footer-area .zpsocialprofile-instagram svg{fill:currentColor}
.theme-footer-area .zpsocialprofile-container a{color:rgba(255,255,255,0.85)!important}
.theme-footer-area .zpsocialprofile-container a:hover{color:var(--jb-orange)!important}
.theme-footer-area .zpimage-container img{border:none!important}
.theme-footer-area .zpshape-divider-bottom,.theme-footer-area .zpshape-divider-section .zpshape-divider-bottom{color:#0d0221!important}
.theme-footer-area .zpshape-divider-bottom svg,.theme-footer-area .zpshape-divider-bottom svg use,.theme-footer-area .zpshape-divider-section .zpshape-divider-bottom svg,.theme-footer-area .zpshape-divider-section .zpshape-divider-bottom svg use{fill:#0d0221!important}
.theme-footer-area .zpdivider-container+.zptext p,.theme-footer-area .zptext.zptext-align-center p{color:rgba(255,255,255,0.6)!important;-webkit-text-fill-color:rgba(255,255,255,0.6)!important;font-size:clamp(0.8rem,1.5vw,0.85rem)!important;letter-spacing:0.03em}
@media (max-width:768px){.theme-footer-area{padding:2rem 0 1.25rem!important}}
@media (max-width:575px){.theme-footer-area{padding:1.5rem 0 1rem!important}}

/* ========== HERO – mobile overflow & white line (when snippet is in zphero) ========== */
@media (max-width: 768px) {
  .theme-banner:has(#jb-hero-snippet) + .theme-content-area,
  .theme-banner:has(.jb-hero-snippet) + .theme-content-area {
    background: #0d0221 !important;
  }
}

/* ========== HERO – when snippet is in zpsection (not zphero) ========== */
#thememaincontent > .zpsection:has(#jb-hero-snippet),
#thememaincontent > .zpsection:has(.jb-hero-snippet) {
  position: relative !important;
  overflow: hidden !important;
  min-height: calc(var(--jb-vh, 1vh) * 100) !important;
  height: calc(var(--jb-vh, 1vh) * 100) !important;
  max-height: calc(var(--jb-vh, 1vh) * 100) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  background: linear-gradient(180deg, #0d0221 0%, #1a0a2e 50%, #0d0221 100%) !important;
  background-color: #0d0221 !important;
  clip-path: none !important;
}
#thememaincontent > .zpsection:has(#jb-hero-snippet) .zpshape-divider,
#thememaincontent > .zpsection:has(#jb-hero-snippet) .zpshape-divider-top,
#thememaincontent > .zpsection:has(#jb-hero-snippet) .zpshape-divider-bottom,
#thememaincontent > .zpsection:has(.jb-hero-snippet) .zpshape-divider,
#thememaincontent > .zpsection:has(.jb-hero-snippet) .zpshape-divider-top,
#thememaincontent > .zpsection:has(.jb-hero-snippet) .zpshape-divider-bottom {
  display: none !important;
}
#thememaincontent > .zpsection:has(#jb-hero-snippet) .zpcontainer-fluid,
#thememaincontent > .zpsection:has(#jb-hero-snippet) .zpcontainer,
#thememaincontent > .zpsection:has(#jb-hero-snippet) .zprow,
#thememaincontent > .zpsection:has(#jb-hero-snippet) .zpelem-col,
#thememaincontent > .zpsection:has(#jb-hero-snippet) .zpelement,
#thememaincontent > .zpsection:has(#jb-hero-snippet) .zpsnippet-container,
#thememaincontent > .zpsection:has(.jb-hero-snippet) .zpcontainer-fluid,
#thememaincontent > .zpsection:has(.jb-hero-snippet) .zpcontainer,
#thememaincontent > .zpsection:has(.jb-hero-snippet) .zprow,
#thememaincontent > .zpsection:has(.jb-hero-snippet) .zpelem-col,
#thememaincontent > .zpsection:has(.jb-hero-snippet) .zpelement,
#thememaincontent > .zpsection:has(.jb-hero-snippet) .zpsnippet-container {
  background: transparent !important;
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-height: 0 !important;
}
#thememaincontent > .zpsection:has(#jb-hero-snippet) .zprow,
#thememaincontent > .zpsection:has(.jb-hero-snippet) .zprow {
  align-items: stretch !important;
}
#thememaincontent > .zpsection:has(#jb-hero-snippet) .zpelem-col,
#thememaincontent > .zpsection:has(.jb-hero-snippet) .zpelem-col {
  width: 100% !important;
  max-width: 100% !important;
  align-self: stretch !important;
}
#thememaincontent > .zpsection:has(#jb-hero-snippet) .zpsnippet-container,
#thememaincontent > .zpsection:has(.jb-hero-snippet) .zpsnippet-container {
  min-height: 100% !important;
}
/* Anchor scroll indicator to .zpsnippet-container (not tall .jb-hero-snippet flex box) */
#thememaincontent > .zpsection:has(#jb-hero-snippet) .jb-hero-snippet,
#thememaincontent > .zpsection:has(.jb-hero-snippet) .jb-hero-snippet {
  position: static !important;
}
/* Scroll indicator at bottom of hero section */
#thememaincontent > .zpsection:has(#jb-hero-snippet) #jb-scroll-indicator,
#thememaincontent > .zpsection:has(.jb-hero-snippet) #jb-scroll-indicator {
  position: absolute !important;
  bottom: calc(1.5rem + env(safe-area-inset-bottom, 0px)) !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 auto !important;
}
/* Hero image – container query so max-width/max-height are relative to .zpsnippet-container */
#thememaincontent > .zpsection:has(#jb-hero-snippet) .zpsnippet-container,
#thememaincontent > .zpsection:has(.jb-hero-snippet) .zpsnippet-container {
  container-type: size;
  container-name: hero-snippet;
  position: relative !important;
}
/* Hero section – mobile: tighter scroll cue + safe area */
@media (max-width: 768px) {
  #thememaincontent > .zpsection:has(#jb-hero-snippet) #jb-scroll-indicator,
  #thememaincontent > .zpsection:has(.jb-hero-snippet) #jb-scroll-indicator {
    bottom: calc(1rem + env(safe-area-inset-bottom, 0px)) !important;
  }
}
@media (max-width: 575px) {
  #thememaincontent > .zpsection:has(#jb-hero-snippet) #jb-scroll-indicator,
  #thememaincontent > .zpsection:has(.jb-hero-snippet) #jb-scroll-indicator {
    bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* ========== DARK SECTION – reusable for Mission, Footer, etc. ========== */
/* Inner <section class="jb-dark-section"> stays transparent so the Zoho wrapper gradient shows through.
   Gradient is applied on the Zoho section wrapper — not only on .zpshape-divider-top — so backgrounds
   survive when shape dividers are disabled or missing (Features had no div#Features snippet overrides). */
.jb-dark-section {
  background: transparent !important;
}
.zpsection:has(.jb-dark-section),
.zplight-section:has(.jb-dark-section),
.zplight-section-bg:has(.jb-dark-section),
.zpdefault-section:has(.jb-dark-section),
.zpdefault-section-bg:has(.jb-dark-section),
#Features:has(.jb-dark-section),
#Performance:has(.jb-dark-section) {
  background: linear-gradient(180deg, #0d0221 0%, #1a0a2e 50%, #0d0221 100%) !important;
  background-color: #0d0221 !important;
}
.jb-dark-section .zplight-section,
.jb-dark-section .zplight-section-bg,
.jb-dark-section .zpdefault-section,
.jb-dark-section .zpdefault-section-bg,
.zpsection:has(.jb-dark-section) .zplight-section,
.zpsection:has(.jb-dark-section) .zplight-section-bg,
.zpsection:has(.jb-dark-section) .zpdefault-section,
.zpsection:has(.jb-dark-section) .zpdefault-section-bg,
.zpsection:has(.jb-dark-section) .zpcontainer,
.zpsection:has(.jb-dark-section) .zpcontainer-fluid,
.zpsection:has(.jb-dark-section) .zprow,
.zpsection:has(.jb-dark-section) .zpelem-col,
.zpsection:has(.jb-dark-section) .zpelement,
.zpsection:has(.jb-dark-section) .zpsnippet-container,
.jb-dark-section .zpcontainer,
.jb-dark-section .zpcontainer-fluid,
.jb-dark-section .zprow,
.jb-dark-section .zpelem-col,
.jb-dark-section .zpelement,
.jb-dark-section .zpsnippet-container {
  background: transparent !important;
}
/* Shape divider only – carries the dark brand background */
.zpsection:has(.jb-dark-section) .zpshape-divider-top,
#Features:has(.jb-dark-section) .zpshape-divider-top,
#Performance:has(.jb-dark-section) .zpshape-divider-top {
  background: linear-gradient(180deg, #0d0221 0%, #1a0a2e 50%, #0d0221 100%) !important;
  background-color: #0d0221 !important;
  color: var(--jb-dark) !important;
}
.zpsection:has(.jb-dark-section) .zpshape-divider-top svg,
.zpsection:has(.jb-dark-section) .zpshape-divider-top svg use,
#Features:has(.jb-dark-section) .zpshape-divider-top svg,
#Features:has(.jb-dark-section) .zpshape-divider-top svg use,
#Performance:has(.jb-dark-section) .zpshape-divider-top svg,
#Performance:has(.jb-dark-section) .zpshape-divider-top svg use {
  fill: currentColor !important;
}

/* ========== MONOSPACE ========== */
pre, code, .zpcode { font-family: var(--jb-font-mono) !important; }

/* ========== COOKIE BANNER ========== */
#zcb-banner,#zcb-banner.zcb-bar,#zcb-banner.zplight-section,#zcb-banner.zplight-section-bg{background:linear-gradient(180deg,#0d0221 0%,#1a0a2e 50%,#0d0221 100%)!important;background-color:#0d0221!important;border-top:1px solid rgba(255,140,0,0.25)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 -4px 24px rgba(0,0,0,0.3),0 0 20px rgba(255,140,0,0.08)!important;font-family:var(--jb-font-body)!important;padding:clamp(0.875rem,2vw,1rem) clamp(1rem,3vw,1.5rem)!important}
#zcb-banner #zcb-info,#zcb-banner .zcb-btn{background:transparent!important;border:none!important;box-shadow:none!important;padding:0!important}
#zcb-banner,#zcb-banner *{color:rgba(255,255,255,0.9)!important;-webkit-text-fill-color:rgba(255,255,255,0.9)!important}
#zcb-banner a,#zcb-banner button{background:transparent!important;border:1px solid var(--jb-orange)!important;color:var(--jb-orange)!important;-webkit-text-fill-color:var(--jb-orange)!important;font-family:var(--jb-font-body)!important;font-weight:600!important;font-size:clamp(0.85rem,1.5vw,0.9rem)!important;padding:0.5rem 1rem!important;border-radius:8px!important;transition:all 0.2s ease;min-height:44px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}
#zcb-banner a:hover,#zcb-banner button:hover{background:rgba(255,140,0,0.15)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:0 0 8px rgba(255,140,0,0.3)}
@media (max-width:768px){#zcb-banner{padding:1rem!important}}
@media (max-width:575px){#zcb-banner{padding:0.875rem 1rem!important}}

/* ========== SAFE AREAS (notched devices) ========== */
@supports (padding: env(safe-area-inset-bottom)){
  .theme-footer-area{padding-bottom:calc(env(safe-area-inset-bottom) + clamp(1.5rem,3vw,2rem))!important}
  #zcb-banner{padding-bottom:calc(env(safe-area-inset-bottom) + 1rem)!important}
}
@supports (padding: env(safe-area-inset-top)){
  .theme-header{padding-top:env(safe-area-inset-top)!important}
}

/* ========== NOISE TEXTURE (D-R5) ========== */
body::after{
  content:'';
  position:fixed;
  inset:0;
  z-index:9999;
  pointer-events:none;
  opacity:0.025;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-repeat:repeat;
  background-size:256px 256px;
}

/* ========== SCROLL REVEAL (D-R1) ========== */
.jb-reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity 0.8s var(--ease-out-expo),transform 0.8s var(--ease-out-expo);
  will-change:opacity,transform;
}
.jb-reveal.jb-reveal-left{transform:translateX(-24px)}
.jb-reveal.jb-reveal-right{transform:translateX(24px)}
.jb-reveal.jb-reveal-scale{transform:scale(0.95);opacity:0}
.jb-reveal.visible{
  opacity:1;
}
.jb-reveal.visible:not([class*="jb-entrance-"]):not([class*="jb-parallax-"]){
  transform:translateY(0) translateX(0) scale(1);
}
@media (max-width:991px){
  .jb-reveal.jb-reveal-left.visible,
  .jb-reveal.jb-reveal-right.visible{
    transform:translateX(0)!important;
  }
}
@media (prefers-reduced-motion:reduce){
  .jb-reveal{opacity:1;transform:none;transition:none}
}

/* ========== SECTION DIVIDER (R-R5) ========== */
.jb-section-divider{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  height:0;
  border:none;
  border-top:1px solid rgba(255,140,0,0.1);
}

/* ========== SECONDARY CTA (S-R3 / D-R7) ========== */
.jb-cta-secondary{
  color:var(--jb-electric)!important;
  -webkit-text-fill-color:var(--jb-electric)!important;
  border-color:var(--jb-electric)!important;
}
.jb-cta-secondary:hover{
  color:var(--jb-dark)!important;
  -webkit-text-fill-color:var(--jb-dark)!important;
  background:var(--jb-electric)!important;
  box-shadow:0 0 20px rgba(0,212,255,0.4)!important;
}

/* ========== FORM VALIDATION (S-R5) ========== */
.jb-field-error input,.jb-field-error select,.jb-field-error textarea{border-color:var(--color-error)!important;box-shadow:0 0 0 3px rgba(255,107,107,0.15)!important}
.jb-field-error-msg{font-family:var(--jb-font-body);font-size:0.8rem;color:var(--color-error);margin-top:0.25rem;display:none}
.jb-field-error .jb-field-error-msg{display:block}
.jb-field-success input,.jb-field-success select,.jb-field-success textarea{border-color:var(--color-success)!important;box-shadow:0 0 0 3px rgba(45,212,168,0.15)!important}

@keyframes jb-hud-fade-in{
  to{opacity:1}
}

/* ========== SCROLL-DRIVEN ENTRANCE UTILITIES ========== */
/* These use --jb-sp (0→1) set by the scroll engine on each section.
   0 = section just entering viewport bottom
   1 = section top at viewport top (fully scrolled in) */

.jb-entrance-slide-left{
  transform:translateX(calc((1 - var(--jb-sp,0)) * -80px));
  opacity:calc(var(--jb-sp,0) * 2.5) !important;
  will-change:transform,opacity;
}
.jb-entrance-slide-right{
  transform:translateX(calc((1 - var(--jb-sp,0)) * 80px));
  opacity:calc(var(--jb-sp,0) * 2.5) !important;
  will-change:transform,opacity;
}
.jb-entrance-scale-up{
  transform:scale(calc(0.85 + var(--jb-sp,0) * 0.15));
  opacity:calc(var(--jb-sp,0) * 2.5) !important;
  will-change:transform,opacity;
}
.jb-entrance-scale-rotate{
  transform:scale(calc(0.85 + var(--jb-sp,0) * 0.15)) rotate(calc((1 - var(--jb-sp,0)) * -2deg));
  opacity:calc(var(--jb-sp,0) * 2.5) !important;
  will-change:transform,opacity;
}
.jb-entrance-clip-left{
  clip-path:inset(0 calc((1 - var(--jb-sp,0)) * 100%) 0 0);
  will-change:clip-path;
}
.jb-entrance-clip-right{
  clip-path:inset(0 0 0 calc((1 - var(--jb-sp,0)) * 100%));
  will-change:clip-path;
}
.jb-entrance-rise{
  transform:translateY(calc((1 - var(--jb-sp,0)) * 60px));
  opacity:calc(var(--jb-sp,0) * 2.5) !important;
  will-change:transform,opacity;
}

/* ========== PARALLAX TEXT UTILITY ========== */
.jb-parallax-text{
  transform:translateY(calc((var(--jb-sp,0.5) - 0.5) * -30px));
  will-change:transform;
}
.jb-parallax-text-subtle{
  transform:translateY(calc((var(--jb-sp,0.5) - 0.5) * -15px));
  will-change:transform;
}
.jb-parallax-text-strong{
  transform:translateY(calc((var(--jb-sp,0.5) - 0.5) * -50px));
  will-change:transform;
}

/* ========== PREFERS-REDUCED-MOTION ========== */
@media (prefers-reduced-motion:reduce){
  .jb-reveal{opacity:1;transform:none;transition:none}
  .jb-entrance-slide-left,
  .jb-entrance-slide-right,
  .jb-entrance-scale-up,
  .jb-entrance-scale-rotate,
  .jb-entrance-clip-left,
  .jb-entrance-clip-right,
  .jb-entrance-rise{
    transform:none!important;
    clip-path:none!important;
    opacity:1!important;
    will-change:auto;
  }
  .jb-parallax-text,
  .jb-parallax-text-subtle,
  .jb-parallax-text-strong{
    transform:none!important;
    will-change:auto;
  }
  #jb-hud-top{animation:none;opacity:1}
}

/* ========== SALESIQ — FLOAT / LAUNCHER SHELL (parent page) ==========
   These elements live in YOUR page, NOT inside the chat iframe.
   Pair with: salesiq-juicebots-brand.css uploaded in SalesIQ.
   ===================================================================== */

/* Minimize / close icon on the float strip */
#zs_fl_close.siqico-close,
#zs_fl_close.zsiq-close-icn {
  color: #ff8c00 !important;
  transition: color 0.2s ease, transform 0.15s ease !important;
}
#zs_fl_close:hover {
  color: #e67e00 !important;
  transform: scale(1.1) !important;
}

/* Launcher chat icon — Iconoir "chat-bubble" via mask-image */
#zs_fl_chat.siqico-chat::before {
  font-family: initial !important;
  content: ' ' !important;
  display: block !important;
  background: currentColor !important;
  width: 1em !important;
  height: 1em !important;
  mask-size: cover !important;
  -webkit-mask-size: cover !important;
  mask-image: url('data:image/svg+xml;charset=utf-8,<svg width="24" height="24" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M17 12.5C17.2761 12.5 17.5 12.2761 17.5 12C17.5 11.7239 17.2761 11.5 17 11.5C16.7239 11.5 16.5 11.7239 16.5 12C16.5 12.2761 16.7239 12.5 17 12.5Z" fill="currentColor" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M12 12.5C12.2761 12.5 12.5 12.2761 12.5 12C12.5 11.7239 12.2761 11.5 12 11.5C11.7239 11.5 11.5 11.7239 11.5 12C11.5 12.2761 11.7239 12.5 12 12.5Z" fill="currentColor" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M7 12.5C7.27614 12.5 7.5 12.2761 7.5 12C7.5 11.7239 7.27614 11.5 7 11.5C6.72386 11.5 6.5 11.7239 6.5 12C6.5 12.2761 6.72386 12.5 7 12.5Z" fill="currentColor" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 13.8214 2.48697 15.5291 3.33782 17L2.5 21.5L7 20.6622C8.47087 21.513 10.1786 22 12 22Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/></svg>') !important;
  -webkit-mask-image: url('data:image/svg+xml;charset=utf-8,<svg width="24" height="24" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M17 12.5C17.2761 12.5 17.5 12.2761 17.5 12C17.5 11.7239 17.2761 11.5 17 11.5C16.7239 11.5 16.5 11.7239 16.5 12C16.5 12.2761 16.7239 12.5 17 12.5Z" fill="currentColor" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M12 12.5C12.2761 12.5 12.5 12.2761 12.5 12C12.5 11.7239 12.2761 11.5 12 11.5C11.7239 11.5 11.5 11.7239 11.5 12C11.5 12.2761 11.7239 12.5 12 12.5Z" fill="currentColor" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M7 12.5C7.27614 12.5 7.5 12.2761 7.5 12C7.5 11.7239 7.27614 11.5 7 11.5C6.72386 11.5 6.5 11.7239 6.5 12C6.5 12.2761 6.72386 12.5 7 12.5Z" fill="currentColor" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 13.8214 2.48697 15.5291 3.33782 17L2.5 21.5L7 20.6622C8.47087 21.513 10.1786 22 12 22Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/></svg>') !important;
}

/* Robot eyes — injected into #zs_fl_chat by JS, cursor-tracking */
#zs_fl_chat.siqico-chat::before{
  transition:opacity 0.3s ease !important;
}
#zs_fl_chat.jb-eyes-active.siqico-chat::before{
  opacity:0 !important;
}
.jb-robot-face{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  opacity:0;
  transition:opacity 0.3s ease;
  pointer-events:none;
  z-index:1;
}
#zs_fl_chat.jb-eyes-active .jb-robot-face{
  opacity:1;
}
.jb-robot-eye{
  width:16px;
  height:16px;
  background:#FF8C00;
  border-radius:50%;
  position:relative;
  box-shadow:0 0 12px rgba(255,140,0,0.6),0 0 4px rgba(255,140,0,0.3);
  animation:jb-blink 4s infinite;
  overflow:hidden;
}
.jb-robot-pupil{
  width:7px;
  height:7px;
  background:#0d0221;
  border-radius:50%;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  transition:transform 0.08s linear;
}
@keyframes jb-blink{
  0%,90%,100%{transform:scaleY(1);}
  95%{transform:scaleY(0.1);}
}

/* Float strip container */
#zsiq_float {
  filter: drop-shadow(0 4px 20px rgba(0, 0, 0, 0.25));
}

/* Chat iframe wrapper — clean frame over dark site */
#zsiq_chat_wrap.chat-iframe-wrap {
  border-radius: 16px !important;
  box-shadow:
    0 20px 60px rgba(0, 0, 0, 0.3),
    0 0 0 1px rgba(255, 140, 0, 0.2) !important;
  overflow: hidden !important;
}

/* Anchor scroll offset – keep the fixed nav header from covering target sections.
   Uses the runtime --jb-header-h set by footer-code.html, with a 75px fallback.
   NOTE: do NOT add `html { scroll-behavior: smooth }` here — it fights the JS
   smoothScrollToY animation in footer-code.html (anchor clicks would stall). */
section[id="System"],
section[id="Features"],
section[id="Opportunity"],
section[id="Partnership"],
section[id="Performance"],
section[id="Branding"],
section[id="Story"],
section[id="Contact"] {
  scroll-margin-top: calc(var(--jb-header-h, 75px) + 16px);
}