:root{--bg:#020817;--panel:#061126;--line:rgba(94,195,255,.18);--text:#f5f8ff;--muted:#a8b8cf;--cyan:#55d9ff;--blue:#2587ff;--green:#29e0bd}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);}html[dir=ltr] body{}a{color:inherit;text-decoration:none}.site-header{height:86px;position:fixed;z-index:100;top:0;left:0;right:0;display:grid;grid-template-columns:290px 1fr 290px;align-items:center;padding:0 4%;background:rgba(2,8,23,.88);border-bottom:1px solid var(--line);backdrop-filter:blur(18px)}.brand img,.footer-logo img{width:255px;max-height:76px;object-fit:contain}.nav{display:flex;justify-content:center;gap:38px;font-size:15px;color:#c6d0df}.nav a{padding:31px 0 27px;position:relative}.nav a.active:after,.nav a:hover:after{content:"";position:absolute;height:2px;left:0;right:0;bottom:12px;background:linear-gradient(90deg,var(--cyan),var(--blue))}.header-actions{display:flex;direction:ltr;justify-content:flex-end;gap:14px}.lang-switch,.demo-btn{border:1px solid var(--line);border-radius:14px;height:48px;padding:0 20px;background:#071126;color:#dbe7f7;font:inherit}.demo-btn{display:flex;align-items:center;gap:28px;background:linear-gradient(135deg,#2588ff,#215fe5);font-weight:600}.menu-toggle{display:none}.hero{height:100vh;min-height:760px;position:relative;overflow:hidden;display:flex;align-items:center;padding:110px 8% 70px}.hero-bg,.cta>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(1,7,20,.18),rgba(1,7,20,.54) 45%,rgba(1,7,20,.96) 82%),linear-gradient(0deg,#020817 0%,transparent 35%)}html[dir=ltr] .hero-shade{transform:scaleX(-1)}.hero-copy{position:relative;z-index:2;width:min(720px,54%);margin-left:0;margin-right:auto}html[dir=rtl] .hero-copy{text-align:right}html[dir=ltr] .hero-copy{text-align:left}.eyebrow,.kicker{font-weight:600;font-size:12px;line-height:1.4;letter-spacing:.25em;color:var(--cyan)}.eyebrow i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);margin:0 12px}.hero h1,.section-copy h2,.section-head h2,.value h2,.cta h2,.footer-message h2{font-size:clamp(48px,5.2vw,88px);line-height:1.07;margin:24px 0 24px;letter-spacing:-.04em}.hero h1 em,.section-copy h2 em,.section-head h2 em,.value h2 em,.cta h2 em,.footer-message h2 em{font-style:normal;background:linear-gradient(90deg,#70e1ff,#248cff);-webkit-background-clip:text;color:transparent}.hero-copy>p,.section-copy>p,.value-inner>p,.cta-copy>p{font-size:18px;line-height:2;color:var(--muted);max-width:680px}.hero-actions{display:flex;gap:14px;margin-top:34px}.primary,.ghost{padding:16px 25px;border-radius:13px;font-weight:600;border:1px solid var(--line)}.primary{background:linear-gradient(135deg,#2588ff,#215fe5)}.ghost{background:rgba(4,16,37,.52)}.hero-stat{position:absolute;z-index:2;bottom:58px;left:8%;right:auto;border-left:2px solid var(--cyan);border-right:0;padding-left:20px;padding-right:0;display:flex;flex-direction:column;gap:6px;color:var(--muted)}html[dir=rtl] .hero-stat{text-align:right}html[dir=ltr] .hero-stat{text-align:left}.hero-stat b{color:#fff}.predictive{min-height:900px;display:grid;grid-template-columns:43% 57%;align-items:center;padding:120px 7%;gap:60px;background:radial-gradient(circle at 75% 50%,rgba(0,112,255,.1),transparent 35%)}.num{display:inline-flex;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;align-items:center;justify-content:center;color:#6ca6d9;font-weight:500;font-size:12px;margin-bottom:24px}.section-copy h2,.section-head h2,.value h2,.cta h2{font-size:clamp(42px,4.3vw,72px)}.three{display:grid;grid-template-columns:repeat(3,1fr);margin-top:45px;border-top:1px solid var(--line);padding-top:25px;gap:20px}.three div{display:flex;flex-direction:column;gap:10px}.three b{color:var(--cyan);font-weight:600;font-size:12px}.three span{font-size:14px;color:#c2d0e3}.predictive-visual{height:650px;position:relative;border:1px solid var(--line);border-radius:34px;overflow:hidden}.predictive-visual img{width:100%;height:100%;object-fit:cover}.predictive-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(1,7,20,.75),transparent 55%)}.signal{position:absolute;z-index:2;padding:10px 15px;border:1px solid rgba(69,213,255,.38);background:rgba(2,13,31,.75);backdrop-filter:blur(10px);border-radius:999px;font-size:12px}.s1{top:30%;right:8%}.s2{bottom:12%;left:8%}.scenarios{padding:130px 7%}.section-head{max-width:950px;margin-bottom:70px}.scenario-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.scenario{height:590px;border:1px solid var(--line);border-radius:28px;overflow:hidden;position:relative}.scenario img{width:100%;height:100%;object-fit:cover;transition:transform .8s}.scenario:hover img{transform:scale(1.035)}.scenario .shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(1,7,20,.96),rgba(1,7,20,.04) 70%)}.scenario .copy{position:absolute;z-index:2;bottom:0;padding:40px}.scenario .copy>span{font-weight:600;font-size:11px;letter-spacing:.22em;color:var(--cyan)}.scenario h3{font-size:32px;margin:13px 0}.scenario p{color:#b6c4d8;line-height:1.9;margin:0;max-width:620px}.value{padding:120px 7%;text-align:center}.value-inner{max-width:1150px;margin:auto;padding:90px 6%;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:radial-gradient(circle,rgba(22,108,255,.08),transparent 65%)}.value-inner>p{margin-inline:auto}.value-row{display:flex;justify-content:center;align-items:center;gap:30px;margin-top:42px;color:#d9e8fa}.value-row i{width:5px;height:5px;background:var(--green);border-radius:50%}.cta{height:720px;position:relative;display:flex;align-items:center;padding:7%;overflow:hidden}.cta-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(1,7,20,.25),rgba(1,7,20,.92) 70%),linear-gradient(0deg,#020817,transparent 40%)}.cta-copy{position:relative;z-index:2;width:min(720px,60%);margin-inline-start:auto}.cta-copy>span{font-weight:600;font-size:12px;letter-spacing:.24em;color:var(--cyan)}.site-footer{border-top:1px solid var(--line);padding-top:75px;background:#020817}.footer-inner{width:min(1660px,88%);margin:auto}.footer-main{display:grid;grid-template-columns:300px 1fr 260px;gap:70px;align-items:center}.footer-message h2{font-size:48px;margin:15px 0}.footer-message p{color:var(--muted)}.footer-demo{height:76px;border-radius:17px;background:linear-gradient(135deg,#2588ff,#215fe5);display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-weight:600}.footer-links-row{display:flex;justify-content:center;gap:70px;padding:45px 0}.footer-nav{display:grid;grid-template-columns:repeat(3,max-content);gap:12px 40px;color:#aab9cd}.footer-trust{display:flex;flex-direction:column;gap:14px}.footer-trust span{display:flex;align-items:center;gap:10px}.footer-trust i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}.footer-bottom{width:100%;border-top:1px solid var(--line);padding:18px 24px 20px;display:flex;justify-content:center;gap:10px;flex-wrap:wrap;color:rgba(190,207,231,.78);font-size:14px;text-align:center}.footer-bottom p{margin:0}.footer-bottom u{color:#7fdcff;font-weight:700}.reveal{opacity:0;transform:translateY(28px);transition:.8s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:1050px){.site-header{grid-template-columns:1fr auto}.brand img{width:210px}.nav{position:fixed;top:86px;left:0;right:0;background:#030b1c;display:none;flex-direction:column;padding:25px 7%;gap:0}.nav.open{display:flex}.nav a{padding:14px}.menu-toggle{display:block;width:46px;height:46px;border:1px solid var(--line);background:transparent;border-radius:12px}.menu-toggle i{display:block;width:20px;height:1px;background:white;margin:6px auto}.demo-btn{display:none}.predictive{grid-template-columns:1fr}.predictive-visual{height:520px}.footer-main{grid-template-columns:1fr 1fr}.footer-logo{grid-column:1/-1}.footer-links-row{justify-content:flex-start}}
@media(max-width:720px){.site-header{height:72px;padding:0 16px}.brand img{width:175px}.header-actions{gap:8px}.lang-switch{height:42px;padding:0 12px}.nav{top:72px}.hero{min-height:780px;padding:105px 22px 60px;align-items:flex-start}.hero-bg{object-position:62% center}.hero-shade{background:linear-gradient(0deg,#020817 3%,rgba(1,7,20,.45) 55%,rgba(1,7,20,.78))}.hero-copy{width:100%;margin-top:65px}.hero h1{font-size:45px}.hero-copy>p{font-size:15px}.hero-actions{flex-direction:column}.hero-stat{display:none}.predictive,.scenarios,.value{padding:85px 22px}.predictive-visual{height:430px}.three{grid-template-columns:1fr}.scenario-grid{grid-template-columns:1fr}.scenario{height:520px}.scenario .copy{padding:26px}.scenario h3{font-size:27px}.cta{height:650px;padding:22px}.cta-copy{width:100%}.cta h2{font-size:43px}.footer-inner{width:88%}.footer-main{display:flex;flex-direction:column;align-items:stretch;gap:35px}.footer-logo img{width:220px}.footer-message h2{font-size:42px}.footer-links-row{flex-direction:column;gap:35px}.footer-nav{grid-template-columns:1fr;gap:14px}.footer-bottom{font-size:12px}.footer-bottom p{width:100%}.footer-bottom>b{display:none}}


/* =========================================================
   HERO V3 — premium dark-side composition
   Keeps both Arabic and English copy inside the dark area.
   ========================================================= */
.hero{
  isolation:isolate;
}
.hero-bg{
  object-position:center center;
  filter:brightness(.94) saturate(1.12) contrast(1.04);
  transform:scale(1.025);
  animation:heroImageBreath 11s ease-in-out infinite alternate;
  will-change:transform,filter;
}
@keyframes heroImageBreath{
  0%{transform:scale(1.025);filter:brightness(.90) saturate(1.08) contrast(1.04)}
  100%{transform:scale(1.055);filter:brightness(1.02) saturate(1.18) contrast(1.07)}
}

/* Dark readable zone on the left + visual focus over elevator/building */
.hero-shade{
  transform:none !important;
  background:
    linear-gradient(90deg,
      rgba(1,7,20,.98) 0%,
      rgba(1,7,20,.93) 25%,
      rgba(1,7,20,.70) 45%,
      rgba(1,7,20,.24) 68%,
      rgba(1,7,20,.10) 100%),
    radial-gradient(circle at 78% 46%,rgba(45,148,255,.16),transparent 29%),
    linear-gradient(0deg,#020817 0%,transparent 32%);
  z-index:1;
}
.hero::before{
  content:"";
  position:absolute;
  z-index:1;
  inset:-10% -8% -10% 45%;
  pointer-events:none;
  background:radial-gradient(ellipse at 62% 48%,rgba(76,192,255,.18) 0%,rgba(32,126,255,.07) 28%,transparent 63%);
  mix-blend-mode:screen;
  opacity:.85;
  animation:heroFocusPulse 5.5s ease-in-out infinite;
}
.hero::after{
  content:"";
  position:absolute;
  z-index:1;
  top:0;
  bottom:0;
  width:20%;
  left:48%;
  pointer-events:none;
  opacity:.34;
  background:linear-gradient(105deg,transparent 10%,rgba(97,214,255,.13) 47%,transparent 72%);
  filter:blur(7px);
  transform:translateX(-150%) skewX(-8deg);
  animation:heroLightSweep 8s ease-in-out infinite;
}
@keyframes heroFocusPulse{0%,100%{opacity:.52;filter:blur(0)}50%{opacity:.95;filter:blur(2px)}}
@keyframes heroLightSweep{0%,22%{transform:translateX(-180%) skewX(-8deg);opacity:0}42%{opacity:.36}63%,100%{transform:translateX(240%) skewX(-8deg);opacity:0}}

/* Same physical copy zone in both languages */
.hero-copy{
  position:absolute;
  z-index:4;
  left:7.2%;
  right:auto;
  top:51%;
  transform:translateY(-50%);
  width:min(620px,42vw);
  margin:0 !important;
}
html[dir="rtl"] .hero-copy{
  left:7.2%;
  right:auto;
  text-align:right;
}
html[dir="ltr"] .hero-copy{
  left:7.2%;
  right:auto;
  text-align:left;
}

.hero h1{
  font-size:clamp(42px,4.15vw,68px);
  line-height:1.08;
  margin:20px 0 22px;
  letter-spacing:-.035em;
  text-wrap:balance;
}
html[dir="rtl"] .hero h1{
  font-size:clamp(40px,3.75vw,62px);
  line-height:1.14;
  letter-spacing:-.025em;
}
.hero-copy>p{
  max-width:610px;
  font-size:17px;
  line-height:1.9;
}

/* Cinematic staggered entrance */
.hero-copy.reveal{opacity:1;transform:translateY(-50%)}
.hero-copy .eyebrow,
.hero-copy h1,
.hero-copy>p,
.hero-copy .hero-actions{
  opacity:0;
  transform:translateY(24px);
  filter:blur(7px);
}
.hero-copy.visible .eyebrow{animation:heroTextIn .72s cubic-bezier(.2,.72,.2,1) .08s forwards}
.hero-copy.visible h1{animation:heroTextIn .88s cubic-bezier(.2,.72,.2,1) .20s forwards}
.hero-copy.visible>p{animation:heroTextIn .82s cubic-bezier(.2,.72,.2,1) .38s forwards}
.hero-copy.visible .hero-actions{animation:heroTextIn .78s cubic-bezier(.2,.72,.2,1) .54s forwards}
@keyframes heroTextIn{to{opacity:1;transform:translateY(0);filter:blur(0)}}

/* Premium CTA buttons */
.hero-actions{gap:16px;margin-top:30px;align-items:center}
.hero-actions .primary,
.hero-actions .ghost{
  position:relative;
  overflow:hidden;
  min-height:58px;
  padding:0 27px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:16px;
  letter-spacing:.01em;
  transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease,background .28s ease;
}
.hero-actions .primary{
  border:1px solid rgba(118,221,255,.62);
  background:linear-gradient(135deg,#258cff 0%,#1d6df1 55%,#1256db 100%);
  box-shadow:0 13px 38px rgba(18,101,255,.25),inset 0 1px 0 rgba(255,255,255,.20);
}
.hero-actions .primary::before,
.hero-actions .ghost::before{
  content:"";
  position:absolute;
  inset:-2px;
  transform:translateX(-135%) skewX(-18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.20),transparent);
  transition:transform .65s ease;
}
.hero-actions .ghost{
  border:1px solid rgba(102,199,255,.26);
  background:linear-gradient(135deg,rgba(7,25,55,.78),rgba(3,13,31,.64));
  backdrop-filter:blur(16px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.hero-actions .primary:hover,
.hero-actions .ghost:hover{
  transform:translateY(-3px);
  border-color:rgba(104,222,255,.72);
}
.hero-actions .primary:hover{box-shadow:0 18px 48px rgba(18,111,255,.38),0 0 24px rgba(75,201,255,.15)}
.hero-actions .ghost:hover{background:rgba(10,33,70,.78);box-shadow:0 12px 34px rgba(1,8,22,.28)}
.hero-actions .primary:hover::before,
.hero-actions .ghost:hover::before{transform:translateX(145%) skewX(-18deg)}

/* Supporting statement stays beneath the copy instead of competing with CTA */
.hero-stat{
  z-index:4;
  left:7.2%;
  right:auto;
  bottom:38px;
  max-width:520px;
  opacity:.92;
}
html[dir="rtl"] .hero-stat{
  left:7.2%;
  right:auto;
  border-left:0;
  border-right:2px solid var(--cyan);
  padding-left:0;
  padding-right:18px;
  text-align:right;
}
html[dir="ltr"] .hero-stat{
  left:7.2%;
  right:auto;
  border-left:2px solid var(--cyan);
  border-right:0;
  padding-left:18px;
  padding-right:0;
  text-align:left;
}

@media(max-width:1250px){
  .hero-copy{width:min(575px,47vw);left:6%}
  html[dir="rtl"] .hero-copy,html[dir="ltr"] .hero-copy{left:6%}
  .hero h1{font-size:clamp(40px,4.2vw,60px)}
  html[dir="rtl"] .hero h1{font-size:clamp(39px,4vw,57px)}
}

@media(max-width:720px){
  .hero-bg{object-position:66% center;animation:none;transform:scale(1.02);filter:brightness(.82) saturate(1.1)}
  .hero-shade{background:linear-gradient(0deg,#020817 2%,rgba(1,7,20,.58) 58%,rgba(1,7,20,.82) 100%)}
  .hero::before,.hero::after{display:none}
  .hero-copy,
  html[dir="rtl"] .hero-copy,
  html[dir="ltr"] .hero-copy{
    position:relative;
    left:auto;
    right:auto;
    top:auto;
    transform:none;
    width:100%;
    margin-top:65px !important;
  }
  .hero-copy.reveal{transform:none}
  .hero h1,html[dir="rtl"] .hero h1{font-size:42px;line-height:1.13}
  .hero-actions .primary,.hero-actions .ghost{width:100%;min-height:56px}
}

@media(prefers-reduced-motion:reduce){
  .hero-bg,.hero::before,.hero::after{animation:none!important}
  .hero-copy .eyebrow,.hero-copy h1,.hero-copy>p,.hero-copy .hero-actions{opacity:1;transform:none;filter:none;animation:none!important}
}


/* =========================================================
   HERO V4 — English balance fix only
   Arabic composition remains unchanged.
   ========================================================= */
@media (min-width: 721px){
  html[dir="ltr"] .hero-copy{
    left:7.2%;
    right:auto;
    top:49%;
    width:min(650px,43vw);
  }

  html[dir="ltr"] .hero h1{
    font-size:clamp(39px,3.45vw,58px);
    line-height:1.12;
    letter-spacing:-.03em;
    margin:18px 0 20px;
    max-width:650px;
  }

  html[dir="ltr"] .hero-copy>p{
    max-width:630px;
    font-size:16px;
    line-height:1.78;
  }

  html[dir="ltr"] .hero-actions{
    margin-top:25px;
    gap:14px;
  }

  html[dir="ltr"] .hero-actions .primary,
  html[dir="ltr"] .hero-actions .ghost{
    min-height:55px;
    padding:0 24px;
  }

  html[dir="ltr"] .hero-stat{
    left:7.2%;
    bottom:24px;
    max-width:560px;
  }
}

@media (min-width:721px) and (max-width:1250px){
  html[dir="ltr"] .hero-copy{
    left:6%;
    width:min(590px,48vw);
  }
  html[dir="ltr"] .hero h1{
    font-size:clamp(37px,3.75vw,52px);
  }
  html[dir="ltr"] .hero-stat{left:6%}
}


/* =========================================================
   PREDICTIVE VISUAL V5 — live interactive image
   Scoped to section 01 only. No other section is changed.
   ========================================================= */
.predictive-visual{
  --mx:0px;
  --my:0px;
  isolation:isolate;
  perspective:1200px;
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 0 1px rgba(79,201,255,.05) inset,
    0 0 58px rgba(24,129,255,.08);
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease,border-color .45s ease;
  background:#031022;
}
.predictive-visual:hover{
  border-color:rgba(85,217,255,.38);
  box-shadow:
    0 34px 100px rgba(0,0,0,.42),
    0 0 0 1px rgba(85,217,255,.12) inset,
    0 0 78px rgba(37,135,255,.16);
}
.predictive-visual img{
  position:relative;
  z-index:0;
  transform:scale(1.035) translate(var(--mx),var(--my));
  transform-origin:center;
  filter:brightness(.88) saturate(1.08) contrast(1.04);
  transition:transform .25s ease-out,filter .55s ease;
  will-change:transform,filter;
}
.predictive-visual.visual-live img{
  animation:predictiveImageBreath 8s ease-in-out infinite alternate;
}
.predictive-visual:hover img{
  filter:brightness(.98) saturate(1.18) contrast(1.06);
}
@keyframes predictiveImageBreath{
  from{filter:brightness(.87) saturate(1.08) contrast(1.04)}
  to{filter:brightness(.96) saturate(1.15) contrast(1.055)}
}

/* soft technological focus over the elevator */
.predictive-visual::before{
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 59% 46%,rgba(67,194,255,.17),transparent 27%),
    radial-gradient(circle at 47% 58%,rgba(18,118,255,.10),transparent 38%);
  mix-blend-mode:screen;
  opacity:.52;
  animation:predictiveFocus 4.8s ease-in-out infinite;
}
.predictive-visual:after{
  z-index:2;
  background:
    linear-gradient(0deg,rgba(1,7,20,.68),transparent 50%),
    linear-gradient(90deg,rgba(1,7,20,.10),transparent 35%,rgba(1,7,20,.05));
  pointer-events:none;
}
@keyframes predictiveFocus{0%,100%{opacity:.38}50%{opacity:.78}}

/* scanning light — only visible while section is on screen */
.predictive-scan{
  position:absolute;
  z-index:3;
  left:-12%;
  right:-12%;
  top:-8%;
  height:14%;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(180deg,transparent,rgba(85,217,255,.03) 30%,rgba(85,217,255,.34) 52%,rgba(37,135,255,.08) 66%,transparent);
  filter:blur(.2px);
  mix-blend-mode:screen;
}
.predictive-visual.visual-live .predictive-scan{
  animation:predictiveScan 5.8s cubic-bezier(.45,0,.2,1) infinite;
}
@keyframes predictiveScan{
  0%,12%{transform:translateY(-30%);opacity:0}
  20%{opacity:.68}
  70%{opacity:.38}
  82%,100%{transform:translateY(790%);opacity:0}
}

/* animated sensor nodes */
.pulse{
  position:absolute;
  z-index:4;
  width:11px;
  height:11px;
  border-radius:50%;
  background:#55d9ff;
  box-shadow:0 0 0 0 rgba(85,217,255,.48),0 0 18px rgba(85,217,255,.85);
  opacity:0;
  pointer-events:none;
}
.pulse::before,.pulse::after{
  content:"";
  position:absolute;
  inset:50%;
  width:10px;
  height:10px;
  border:1px solid rgba(85,217,255,.58);
  border-radius:50%;
  transform:translate(-50%,-50%);
}
.predictive-visual.visual-live .pulse{opacity:1;animation:predictivePulse 2.8s ease-out infinite}
.predictive-visual.visual-live .pulse::after{animation:predictiveRing 2.8s ease-out infinite}
.p1{left:52.5%;top:23%}.p2{left:58.5%;top:55%}.p3{left:43.5%;top:63%}
.p2,.p2::after{animation-delay:.8s!important}.p3,.p3::after{animation-delay:1.55s!important}
@keyframes predictivePulse{0%,100%{transform:scale(.82);box-shadow:0 0 0 0 rgba(85,217,255,.42),0 0 14px rgba(85,217,255,.75)}48%{transform:scale(1.1);box-shadow:0 0 0 9px rgba(85,217,255,0),0 0 24px rgba(85,217,255,.95)}}
@keyframes predictiveRing{0%{width:10px;height:10px;opacity:.8}75%,100%{width:52px;height:52px;opacity:0}}

/* tiny moving data packets, following the direction already present in the artwork */
.data-dot{
  position:absolute;
  z-index:4;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#7ceaff;
  box-shadow:0 0 10px #55d9ff,0 0 22px rgba(37,135,255,.8);
  opacity:0;
  pointer-events:none;
}
.predictive-visual.visual-live .data-dot{animation:dataPacket 4.6s ease-in-out infinite}
.d1{left:18%;top:31%;--dx:250px;--dy:130px}
.d2{left:26%;top:47%;--dx:210px;--dy:88px;animation-delay:1.1s!important}
.d3{left:33%;top:66%;--dx:170px;--dy:-18px;animation-delay:2.1s!important}
.d4{left:39%;top:39%;--dx:150px;--dy:70px;animation-delay:3.05s!important}
@keyframes dataPacket{
  0%,9%{transform:translate(0,0) scale(.55);opacity:0}
  18%{opacity:.95}
  72%{opacity:.72}
  88%,100%{transform:translate(var(--dx),var(--dy)) scale(1.15);opacity:0}
}

/* status chips feel connected to live data */
.signal{
  z-index:6;
  display:flex;
  align-items:center;
  gap:9px;
  overflow:hidden;
  box-shadow:0 10px 32px rgba(0,0,0,.22),0 0 24px rgba(40,162,255,.07);
  transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease,background .35s ease;
}
.signal::before{
  content:"";
  width:7px;
  height:7px;
  flex:0 0 7px;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 12px var(--green);
}
.signal::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width:55px;
  left:-75px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent);
  transform:skewX(-18deg);
}
.predictive-visual.visual-live .signal::after{animation:signalShine 5s ease-in-out infinite}
.predictive-visual.visual-live .s1{animation:signalFloat1 4.2s ease-in-out infinite}
.predictive-visual.visual-live .s2{animation:signalFloat2 4.8s ease-in-out infinite}
.predictive-visual:hover .signal{border-color:rgba(85,217,255,.58);background:rgba(2,13,31,.88);box-shadow:0 12px 36px rgba(0,0,0,.30),0 0 26px rgba(37,135,255,.13)}
@keyframes signalShine{0%,58%{left:-75px;opacity:0}68%{opacity:1}84%,100%{left:125%;opacity:0}}
@keyframes signalFloat1{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes signalFloat2{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}

@media(max-width:1050px){
  .d1{--dx:180px;--dy:95px}.d2{--dx:150px;--dy:60px}.d3{--dx:125px;--dy:-12px}.d4{--dx:105px;--dy:48px}
}
@media(max-width:720px){
  .predictive-visual{perspective:none}
  .predictive-visual img{transform:scale(1.03)!important}
  .data-dot{display:none}
  .pulse{transform:scale(.82)}
  .signal{font-size:10px;padding:9px 12px}
  .s1{right:4%}.s2{left:4%}
}
@media(prefers-reduced-motion:reduce){
  .predictive-visual img,.predictive-scan,.pulse,.pulse::after,.data-dot,.signal,.signal::after{animation:none!important;transition:none!important}
}


/* =========================================================
   SECTION 02 V6 — Live scenario visuals only
   Keeps copy/layout/languages untouched.
   ========================================================= */
.scenario{
  isolation:isolate;
  transition:transform .55s cubic-bezier(.2,.75,.2,1),
             border-color .55s ease,
             box-shadow .55s ease;
  box-shadow:0 24px 70px rgba(0,0,0,.22);
}
.scenario img{
  transform:scale(1.025);
  transition:transform 1.35s cubic-bezier(.2,.75,.2,1),filter .8s ease;
  will-change:transform;
}
.scenario:hover{
  transform:translateY(-5px);
  border-color:rgba(85,217,255,.34);
  box-shadow:0 30px 90px rgba(0,68,145,.20),0 0 0 1px rgba(85,217,255,.05) inset;
}
.scenario:hover img{transform:scale(1.065)}
.scenario .shade{
  z-index:1;
  background:
    linear-gradient(0deg,rgba(1,7,20,.97) 0%,rgba(1,7,20,.72) 27%,rgba(1,7,20,.08) 72%),
    linear-gradient(90deg,rgba(2,8,23,.20),transparent 48%,rgba(3,14,34,.16));
}
.scenario-live-layer{
  position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden;
}
.scenario-live-layer:before{
  content:"";position:absolute;inset:-20%;
  background:linear-gradient(108deg,transparent 37%,rgba(87,218,255,.02) 44%,rgba(87,218,255,.15) 49%,rgba(87,218,255,.035) 53%,transparent 61%);
  transform:translateX(-65%);
  opacity:0;
}
.scenario.scenario-live .scenario-live-layer:before{
  opacity:1;animation:scenarioSweep 5.8s ease-in-out infinite;
}
.scenario-glow{
  position:absolute;width:190px;height:190px;border-radius:50%;
  background:radial-gradient(circle,rgba(38,139,255,.18),rgba(38,139,255,.055) 40%,transparent 72%);
  filter:blur(2px);opacity:.35;
  animation:scenarioGlow 5s ease-in-out infinite alternate;
}
.scenario-glow.g1{top:9%;right:7%}
.scenario-glow.g2{bottom:25%;left:7%;animation-delay:-2.2s}
.scenario-node{
  position:absolute;width:7px;height:7px;border-radius:50%;
  background:#58ddff;box-shadow:0 0 0 0 rgba(88,221,255,.45),0 0 16px #3bbdff;
  opacity:.8;
}
.scenario-node:after{
  content:"";position:absolute;left:50%;top:50%;width:1px;height:70px;
  background:linear-gradient(rgba(88,221,255,.38),transparent);
  transform-origin:top;
}
.scenario-node.n1{top:23%;right:19%}
.scenario-node.n2{top:44%;left:14%;animation-delay:-1.3s}
.scenario-node.n3{top:57%;right:38%;animation-delay:-2.5s}
.scenario.scenario-live .scenario-node{animation:scenarioPulse 2.8s ease-out infinite}
.scenario-techline{
  position:absolute;height:1px;width:28%;opacity:.35;
  background:linear-gradient(90deg,transparent,#58ddff,transparent);
  filter:drop-shadow(0 0 5px rgba(88,221,255,.55));
}
.scenario-techline.l1{top:31%;right:5%;transform:rotate(-8deg)}
.scenario-techline.l2{top:54%;left:4%;transform:rotate(7deg)}
.scenario-status{
  position:absolute;top:24px;z-index:3;
  display:flex;align-items:center;gap:9px;
  padding:9px 13px;border:1px solid rgba(85,217,255,.26);
  border-radius:999px;background:rgba(2,10,25,.60);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  font-weight:600;font-size:10px;line-height:1;letter-spacing:.13em;color:#dcecff;
  opacity:0;transform:translateY(-8px);
  transition:.7s .18s ease;
}
html[dir=rtl] .scenario-status{left:24px}
html[dir=ltr] .scenario-status{right:24px}
.scenario-status i{
  width:6px;height:6px;border-radius:50%;background:#29e0bd;
  box-shadow:0 0 12px #29e0bd;
}
.scenario.scenario-live .scenario-status{opacity:1;transform:none}
.scenario .copy{z-index:4}
.scenario.scenario-live img{animation:scenarioBreathe 9s ease-in-out infinite alternate}

@keyframes scenarioSweep{
  0%,15%{transform:translateX(-70%);opacity:0}
  25%{opacity:1}
  65%{opacity:.75}
  82%,100%{transform:translateX(70%);opacity:0}
}
@keyframes scenarioPulse{
  0%{box-shadow:0 0 0 0 rgba(88,221,255,.42),0 0 14px #3bbdff}
  65%{box-shadow:0 0 0 13px rgba(88,221,255,0),0 0 20px #3bbdff}
  100%{box-shadow:0 0 0 0 rgba(88,221,255,0),0 0 14px #3bbdff}
}
@keyframes scenarioGlow{
  from{transform:scale(.9);opacity:.22}
  to{transform:scale(1.12);opacity:.48}
}
@keyframes scenarioBreathe{
  from{transform:scale(1.025)}
  to{transform:scale(1.055)}
}
@media (prefers-reduced-motion:reduce){
  .scenario,.scenario img,.scenario-live-layer:before,.scenario-node,.scenario-glow{animation:none!important;transition:none!important}
}
@media(max-width:720px){
  .scenario:hover{transform:none}
  .scenario-status{top:18px}
  html[dir=rtl] .scenario-status{left:18px}
  html[dir=ltr] .scenario-status{right:18px}
  .scenario-node.n2,.scenario-techline.l2,.scenario-glow.g2{display:none}
}


/* =========================================================
   SECTION 03 V7 — Premium reveal animation only
   Keeps content/layout/languages untouched.
   ========================================================= */
.value{
  overflow:hidden;
  position:relative;
}
.value-inner{
  position:relative;
  isolation:isolate;
}
.value-inner::before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  width:0;
  height:1px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,#55d9ff 24%,#2587ff 50%,#55d9ff 76%,transparent);
  box-shadow:0 0 14px rgba(85,217,255,.45);
  opacity:0;
  z-index:2;
}
.value-inner::after{
  content:"";
  position:absolute;
  inset:12% 18%;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(circle,rgba(37,135,255,.13),rgba(37,135,255,.035) 42%,transparent 72%);
  filter:blur(18px);
  opacity:0;
  transform:scale(.78);
}

/* Initial state */
.value .num{
  opacity:0;
  transform:translateY(-12px) scale(.78);
  box-shadow:0 0 0 rgba(85,217,255,0);
}
.value .kicker{
  opacity:0;
  transform:translateY(18px);
  letter-spacing:.48em;
}
.value h2{
  opacity:0;
  transform:translateY(42px);
  filter:blur(9px);
  clip-path:inset(0 0 100% 0);
}
.value h2 em{
  background-size:220% 100%;
  background-position:100% 50%;
}
.value-inner>p{
  opacity:0;
  transform:translateY(24px);
  filter:blur(4px);
}
.value-row span,
.value-row i{
  opacity:0;
  transform:translateY(15px);
}

/* Active state */
.value.value-live .value-inner::before{
  animation:valueLineDraw 1.25s .08s cubic-bezier(.2,.75,.2,1) forwards;
}
.value.value-live .value-inner::after{
  animation:valueAura 1.3s .18s ease-out forwards,valueAuraBreathe 5.5s 1.5s ease-in-out infinite alternate;
}
.value.value-live .num{
  animation:valueBadge .72s .12s cubic-bezier(.17,.84,.44,1) forwards;
}
.value.value-live .kicker{
  animation:valueKicker .8s .28s cubic-bezier(.2,.75,.2,1) forwards;
}
.value.value-live h2{
  animation:valueHeadline 1s .42s cubic-bezier(.16,.84,.44,1) forwards;
}
.value.value-live h2 em{
  animation:valueGradient 2.8s 1.1s ease-in-out infinite alternate;
}
.value.value-live .value-inner>p{
  animation:valueDesc .8s .82s ease forwards;
}
.value.value-live .value-row span:nth-of-type(1){animation:valueChip .62s 1.05s ease forwards}
.value.value-live .value-row i:nth-of-type(1){animation:valueDot .55s 1.18s ease forwards}
.value.value-live .value-row span:nth-of-type(2){animation:valueChip .62s 1.28s ease forwards}
.value.value-live .value-row i:nth-of-type(2){animation:valueDot .55s 1.40s ease forwards}
.value.value-live .value-row span:nth-of-type(3){animation:valueChip .62s 1.50s ease forwards}

.value.value-live .value-row i{
  box-shadow:0 0 0 rgba(41,224,189,0);
}
.value.value-live .value-row i:nth-of-type(1),
.value.value-live .value-row i:nth-of-type(2){
  animation-name:valueDot,valueDotPulse;
  animation-duration:.55s,2.8s;
  animation-delay:1.18s,1.8s;
  animation-iteration-count:1,infinite;
  animation-fill-mode:forwards,none;
}

@keyframes valueLineDraw{
  0%{width:0;opacity:0}
  30%{opacity:1}
  100%{width:68%;opacity:.9}
}
@keyframes valueAura{
  from{opacity:0;transform:scale(.78)}
  to{opacity:1;transform:scale(1)}
}
@keyframes valueAuraBreathe{
  from{transform:scale(.96);opacity:.62}
  to{transform:scale(1.08);opacity:1}
}
@keyframes valueBadge{
  0%{opacity:0;transform:translateY(-12px) scale(.78)}
  70%{opacity:1;transform:translateY(2px) scale(1.06);box-shadow:0 0 26px rgba(85,217,255,.18)}
  100%{opacity:1;transform:none;box-shadow:0 0 16px rgba(85,217,255,.08)}
}
@keyframes valueKicker{
  from{opacity:0;transform:translateY(18px);letter-spacing:.48em}
  to{opacity:1;transform:none;letter-spacing:.25em}
}
@keyframes valueHeadline{
  0%{opacity:0;transform:translateY(42px);filter:blur(9px);clip-path:inset(0 0 100% 0)}
  55%{opacity:1;filter:blur(1px)}
  100%{opacity:1;transform:none;filter:none;clip-path:inset(0)}
}
@keyframes valueGradient{
  from{background-position:100% 50%}
  to{background-position:0% 50%}
}
@keyframes valueDesc{
  from{opacity:0;transform:translateY(24px);filter:blur(4px)}
  to{opacity:1;transform:none;filter:none}
}
@keyframes valueChip{
  from{opacity:0;transform:translateY(15px)}
  to{opacity:1;transform:none}
}
@keyframes valueDot{
  0%{opacity:0;transform:scale(.3)}
  70%{opacity:1;transform:scale(1.6)}
  100%{opacity:1;transform:scale(1)}
}
@keyframes valueDotPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(41,224,189,.24)}
  50%{box-shadow:0 0 0 8px rgba(41,224,189,0)}
}

@media (prefers-reduced-motion:reduce){
  .value .num,
  .value .kicker,
  .value h2,
  .value-inner>p,
  .value-row span,
  .value-row i{
    opacity:1!important;
    transform:none!important;
    filter:none!important;
    clip-path:none!important;
    animation:none!important;
  }
  .value-inner::before,
  .value-inner::after{animation:none!important;opacity:.45!important}
}


/* =========================================================
   FINAL CTA V8 — premium cinematic closing section only
   Keeps all previous sections untouched.
   ========================================================= */
.cta{
  min-height:760px;
  height:auto;
  position:relative;
  display:flex;
  align-items:center;
  overflow:hidden;
  padding:7vw;
  isolation:isolate;
  border-top:1px solid rgba(85,217,255,.10);
}
.cta>img{
  position:absolute;
  inset:-4%;
  width:108%;
  height:108%;
  object-fit:cover;
  object-position:center 58%;
  z-index:-4;
  transform:scale(1.035);
  filter:saturate(1.08) contrast(1.06) brightness(.86);
  will-change:transform,filter;
}
.cta-shade{
  position:absolute;
  inset:0;
  z-index:-3;
  background:
    radial-gradient(circle at 70% 45%,rgba(34,135,255,.08),transparent 34%),
    linear-gradient(90deg,rgba(2,8,22,.95) 0%,rgba(2,8,22,.82) 43%,rgba(2,8,22,.28) 72%,rgba(2,8,22,.16) 100%),
    linear-gradient(0deg,rgba(2,8,22,.96) 0%,transparent 34%,rgba(2,8,22,.12) 100%);
}
html[dir="rtl"] .cta-shade{
  background:
    radial-gradient(circle at 30% 45%,rgba(34,135,255,.08),transparent 34%),
    linear-gradient(270deg,rgba(2,8,22,.95) 0%,rgba(2,8,22,.82) 43%,rgba(2,8,22,.28) 72%,rgba(2,8,22,.16) 100%),
    linear-gradient(0deg,rgba(2,8,22,.96) 0%,transparent 34%,rgba(2,8,22,.12) 100%);
}
.cta::before{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(85,217,255,.65),transparent);
  box-shadow:0 0 18px rgba(85,217,255,.22);
  opacity:.5;
}
.cta::after{
  content:"";
  position:absolute;
  width:520px;
  height:520px;
  border-radius:50%;
  right:8%;
  top:50%;
  transform:translateY(-50%) scale(.8);
  background:radial-gradient(circle,rgba(31,127,255,.12),rgba(31,127,255,.035) 43%,transparent 72%);
  filter:blur(16px);
  opacity:0;
  pointer-events:none;
  z-index:-2;
}
html[dir="rtl"] .cta::after{
  right:auto;
  left:8%;
}
.cta-copy{
  position:relative;
  z-index:2;
  width:min(700px,48vw);
  margin-inline-start:0;
  padding:42px 44px 40px;
  border:1px solid rgba(120,210,255,.16);
  border-radius:28px;
  background:linear-gradient(180deg,rgba(3,14,34,.58),rgba(2,9,23,.42));
  box-shadow:
    0 30px 90px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.04);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
html[dir="ltr"] .cta-copy{
  margin-right:auto;
}
html[dir="rtl"] .cta-copy{
  margin-left:auto;
  text-align:right;
}
.cta-copy>span{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:700;font-size:11px;line-height:1;
  letter-spacing:.28em;
  color:#59dbff;
  text-transform:uppercase;
}
.cta-copy>span::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:#29e0bd;
  box-shadow:0 0 14px #29e0bd;
}
.cta h2{
  max-width:620px;
  margin:18px 0 18px;
  font-size:clamp(46px,4.7vw,76px);
  line-height:1.03;
  letter-spacing:-.04em;
}
html[dir="rtl"] .cta h2{
  letter-spacing:0;
  line-height:1.16;
  font-size:clamp(44px,4.3vw,68px);
}
.cta h2 em{
  font-style:normal;
  background:linear-gradient(90deg,#7fe1ff,#3dbbff 44%,#2588ff);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  background-size:180% 100%;
}
.cta-copy>p{
  max-width:610px;
  margin:0 0 28px;
  font-size:17px;
  line-height:1.85;
  color:#b7c8de;
}
.cta .primary{
  position:relative;
  min-width:220px;
  min-height:60px;
  padding:0 24px;
  border-radius:16px;
  overflow:hidden;
  background:linear-gradient(135deg,#2a8dff,#2565e8);
  box-shadow:
    0 14px 34px rgba(33,109,255,.28),
    inset 0 1px 0 rgba(255,255,255,.24);
  border:1px solid rgba(132,205,255,.34);
  transform:translateZ(0);
}
.cta .primary::before{
  content:"";
  position:absolute;
  top:-120%;
  left:-45%;
  width:34%;
  height:340%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);
  transform:rotate(18deg);
  transition:left .7s ease;
}
.cta .primary:hover{
  transform:translateY(-3px);
  box-shadow:
    0 20px 42px rgba(33,109,255,.34),
    0 0 28px rgba(75,190,255,.12),
    inset 0 1px 0 rgba(255,255,255,.26);
}
.cta .primary:hover::before{
  left:125%;
}

/* reveal */
.cta .cta-copy{
  opacity:0;
  transform:translateY(38px) scale(.985);
  filter:blur(8px);
}
.cta .cta-copy>span,
.cta .cta-copy h2,
.cta .cta-copy>p,
.cta .cta-copy .primary{
  opacity:0;
  transform:translateY(18px);
}
.cta.cta-live .cta-copy{
  animation:ctaCardIn .9s cubic-bezier(.2,.78,.2,1) forwards;
}
.cta.cta-live .cta-copy>span{animation:ctaItem .6s .24s ease forwards}
.cta.cta-live .cta-copy h2{animation:ctaItem .75s .38s ease forwards}
.cta.cta-live .cta-copy>p{animation:ctaItem .68s .58s ease forwards}
.cta.cta-live .cta-copy .primary{animation:ctaItem .65s .76s ease forwards}
.cta.cta-live h2 em{animation:ctaGradient 3.3s 1s ease-in-out infinite alternate}
.cta.cta-live::after{animation:ctaAura 1.2s .25s ease-out forwards,ctaAuraBreath 5.5s 1.6s ease-in-out infinite alternate}
.cta.cta-live>img{animation:ctaImageDrift 11s 1s ease-in-out infinite alternate}

@keyframes ctaCardIn{
  from{opacity:0;transform:translateY(38px) scale(.985);filter:blur(8px)}
  to{opacity:1;transform:none;filter:none}
}
@keyframes ctaItem{
  from{opacity:0;transform:translateY(18px)}
  to{opacity:1;transform:none}
}
@keyframes ctaGradient{
  from{background-position:100% 50%}
  to{background-position:0% 50%}
}
@keyframes ctaAura{
  from{opacity:0;transform:translateY(-50%) scale(.8)}
  to{opacity:1;transform:translateY(-50%) scale(1)}
}
@keyframes ctaAuraBreath{
  from{opacity:.55;transform:translateY(-50%) scale(.96)}
  to{opacity:1;transform:translateY(-50%) scale(1.08)}
}
@keyframes ctaImageDrift{
  from{transform:scale(1.035) translate3d(0,0,0);filter:saturate(1.08) contrast(1.06) brightness(.86)}
  to{transform:scale(1.07) translate3d(-.6%, -.4%,0);filter:saturate(1.13) contrast(1.07) brightness(.92)}
}

@media (max-width:900px){
  .cta{
    min-height:700px;
    padding:70px 6vw;
  }
  .cta-copy{
    width:min(680px,100%);
  }
}
@media (max-width:720px){
  .cta{
    min-height:680px;
    padding:50px 20px;
    align-items:flex-end;
  }
  .cta>img{
    object-position:58% center;
  }
  .cta-shade,
  html[dir="rtl"] .cta-shade{
    background:
      linear-gradient(0deg,rgba(2,8,22,.98) 0%,rgba(2,8,22,.82) 49%,rgba(2,8,22,.34) 100%);
  }
  .cta-copy{
    width:100%;
    padding:28px 24px 26px;
    border-radius:22px;
  }
  .cta h2,
  html[dir="rtl"] .cta h2{
    font-size:clamp(36px,11vw,48px);
  }
  .cta-copy>p{
    font-size:15px;
  }
  .cta .primary{
    width:100%;
    min-width:0;
  }
}
@media (prefers-reduced-motion:reduce){
  .cta .cta-copy,
  .cta .cta-copy>span,
  .cta .cta-copy h2,
  .cta .cta-copy>p,
  .cta .cta-copy .primary{
    opacity:1!important;
    transform:none!important;
    filter:none!important;
    animation:none!important;
  }
  .cta::after,
  .cta>img{
    animation:none!important;
  }
}


/* Unified main-site Header + Footer compatibility for Business page */
.site-header .official-brand img{display:block;width:100%;height:auto}
.site-header .menu-toggle i{display:block;width:18px;height:1px;background:#fff;margin:5px auto}
.site-header .unified-demo{white-space:nowrap}
.site-footer{position:relative}
.site-footer .footer-message .footer-kicker{display:inline-block}


/* =========================================================
   BUSINESS FOOTER — EXACT HOMEPAGE STYLE SYNC
   Must stay at the end so older business footer rules cannot override it.
   ========================================================= */
/* =========================================================
   WATCHOPS24 — FINAL HOMEPAGE FOOTER v25
   ========================================================= */
.site-footer{
    position:relative;
    overflow:hidden;
    padding:0;
    border-top:1px solid rgba(92,185,255,.22);
    background:linear-gradient(180deg,#020817 0%,#01040c 100%);
    color:#fff;
}
.site-footer .footer-glow{
    position:absolute;inset:-120px 0 auto;height:260px;pointer-events:none;
    background:radial-gradient(ellipse at 50% 0,rgba(30,150,255,.18),transparent 65%);
    filter:blur(18px)
}
.footer-inner{position:relative;z-index:2;max-width:1480px;margin:0 auto;padding:72px clamp(28px,5vw,88px) 28px}
.footer-main{display:grid;grid-template-columns:240px minmax(340px,1fr) auto;align-items:center;gap:clamp(34px,5vw,88px);padding-bottom:54px}
.footer-logo img{display:block;width:min(230px,100%);height:auto;filter:drop-shadow(0 0 24px rgba(25,139,255,.10))}
.footer-message{max-width:650px}
.footer-kicker{display:inline-block;margin-bottom:14px;color:#59dcff;font-weight:700;font-size:10px;line-height:1;letter-spacing:3.2px}
.footer-message h2{margin:0;font-size:clamp(38px,3.4vw,58px);line-height:1.04;letter-spacing:-.035em}
.footer-message h2 em{font-style:normal;background:linear-gradient(90deg,#7ce4ff,#168dff);-webkit-background-clip:text;background-clip:text;color:transparent}
.footer-message p{margin:18px 0 0;max-width:590px;color:#98adc5;font-size:15px;line-height:1.85}
.footer-demo{display:inline-flex;align-items:center;gap:30px;min-width:190px;justify-content:space-between;padding:18px 20px;border-radius:16px;background:linear-gradient(135deg,#1377ff,#2356da);border:1px solid rgba(107,194,255,.42);box-shadow:0 15px 45px rgba(17,95,230,.22);color:#fff;text-decoration:none;font-weight:700;transition:.35s}
.footer-demo:hover{transform:translateY(-3px);box-shadow:0 22px 55px rgba(17,95,230,.34)}
.footer-demo i{font-style:normal;font-size:18px}
.footer-links-row{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:27px 0;border-top:1px solid rgba(119,176,235,.12);border-bottom:1px solid rgba(119,176,235,.12)}
.footer-nav{display:flex;align-items:center;flex-wrap:wrap;gap:11px 28px}
.footer-nav a{color:#9eb1c8;text-decoration:none;font-size:13px;transition:.25s}.footer-nav a:hover{color:#67ddff}
.footer-trust{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.footer-trust span{display:inline-flex;align-items:center;gap:8px;color:#9eb1c8;font-size:12px}.footer-trust i{width:6px;height:6px;border-radius:50%;background:#25dec1;box-shadow:0 0 12px #25dec1}.footer-trust b{font-weight:500}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:25px;padding-top:25px;color:#637991;font-weight:500;font-size:11px;line-height:1.5;letter-spacing:.04em}
.footer-bottom p{margin:0}.footer-bottom span{direction:ltr}
html[dir="rtl"] .footer-message{text-align:right}html[dir="ltr"] .footer-message{text-align:left}
@media(max-width:980px){.footer-main{grid-template-columns:1fr;gap:30px}.footer-logo img{width:200px}.footer-demo{width:max-content}.footer-links-row{align-items:flex-start;flex-direction:column}.footer-bottom{align-items:flex-start;flex-direction:column}.footer-inner{padding-top:58px}}
@media(max-width:560px){.footer-inner{padding-inline:20px}.footer-nav{gap:12px 18px}.footer-message h2{font-size:40px}.footer-main{padding-bottom:42px}}

/* =========================================================
   WATCHOPS24 — FOOTER RTL/LTR ALIGNMENT FIX v28
   Footer only. Keeps all completed page sections unchanged.
   ========================================================= */

/* Lock the three main footer blocks into predictable areas. */
.footer-main{
    grid-template-areas:"brand message demo";
}
.footer-logo{grid-area:brand}
.footer-message{grid-area:message}
.footer-demo{grid-area:demo}

/* English: logo -> message -> CTA, left to right. */
html[dir="ltr"] .footer-main{
    direction:ltr;
    grid-template-areas:"brand message demo";
}
html[dir="ltr"] .footer-links-row,
html[dir="ltr"] .footer-nav,
html[dir="ltr"] .footer-trust{
    direction:ltr;
}
html[dir="ltr"] .footer-nav{
    justify-content:flex-start;
    text-align:left;
}
html[dir="ltr"] .footer-trust{
    justify-content:flex-end;
    text-align:left;
}

/* Arabic: logo on the right, message center/right, CTA on the left. */
html[dir="rtl"] .footer-main{
    direction:ltr; /* grid areas stay physical and do not auto-flip */
    grid-template-areas:"demo message brand";
}
html[dir="rtl"] .footer-logo,
html[dir="rtl"] .footer-message,
html[dir="rtl"] .footer-demo{
    direction:rtl;
}
html[dir="rtl"] .footer-message{
    text-align:right;
}
html[dir="rtl"] .footer-links-row{
    direction:rtl;
    flex-direction:row;
}
html[dir="rtl"] .footer-nav{
    direction:rtl;
    justify-content:flex-start;
    text-align:right;
}
html[dir="rtl"] .footer-nav a{
    direction:rtl;
    unicode-bidi:plaintext;
}
html[dir="rtl"] .footer-trust{
    direction:rtl;
    justify-content:flex-end;
    text-align:right;
}
html[dir="rtl"] .footer-bottom{
    direction:rtl;
    text-align:right;
}
html[dir="rtl"] .footer-bottom > span{
    direction:ltr;
    text-align:left;
}

@media(max-width:980px){
    .footer-main,
    html[dir="ltr"] .footer-main,
    html[dir="rtl"] .footer-main{
        grid-template-areas:
            "brand"
            "message"
            "demo";
    }
    html[dir="rtl"] .footer-main{direction:rtl}
    html[dir="rtl"] .footer-links-row,
    html[dir="ltr"] .footer-links-row{
        flex-direction:column;
    }
    html[dir="rtl"] .footer-trust,
    html[dir="ltr"] .footer-trust{
        justify-content:flex-start;
    }
}

/* =========================================================
   WATCHOPS24 — FOOTER FINAL RTL STRUCTURE FIX v29
   Footer only: restore Arabic logo + stack navigation vertically.
   ========================================================= */

/* Keep the footer's three primary blocks balanced in both languages. */
.footer-main{
    grid-template-columns:200px minmax(420px,1fr) 200px;
}

.footer-logo{
    display:flex;
    align-items:center;
    width:100%;
    min-width:0;
}
.footer-logo img{
    display:block;
    width:230px;
    max-width:100%;
    height:auto;
    opacity:1;
    visibility:visible;
}

html[dir="ltr"] .footer-main{
    direction:ltr;
    grid-template-areas:"brand message demo";
}
html[dir="ltr"] .footer-logo{
    justify-content:flex-start;
}
html[dir="ltr"] .footer-demo{
    justify-self:end;
}

/* Arabic mirrors the English composition without hiding the brand. */
html[dir="rtl"] .footer-main{
    direction:ltr;
    grid-template-areas:"demo message brand";
}
html[dir="rtl"] .footer-logo{
    direction:ltr;
    justify-content:flex-end;
    justify-self:end;
}
html[dir="rtl"] .footer-demo{
    direction:rtl;
    justify-self:start;
}

/* Navigation links are one clean vertical list in BOTH languages. */
.footer-nav{
    display:flex;
    flex-direction:column;
    flex-wrap:nowrap;
    align-items:flex-start;
    gap:12px;
    min-width:150px;
}
.footer-nav a{
    display:block;
    width:100%;
    line-height:1.45;
}
html[dir="ltr"] .footer-nav{
    direction:ltr;
    text-align:left;
    align-items:flex-start;
}
html[dir="rtl"] .footer-nav{
    direction:rtl;
    text-align:right;
    align-items:flex-end;
}
html[dir="rtl"] .footer-nav a{
    text-align:right;
}

@media(max-width:1100px){
    .footer-main{
        grid-template-columns:210px minmax(320px,1fr) 210px;
        gap:30px;
    }
    .footer-logo img{width:200px}
}

@media(max-width:980px){
    .footer-main,
    html[dir="ltr"] .footer-main,
    html[dir="rtl"] .footer-main{
        grid-template-columns:1fr;
        grid-template-areas:
            "brand"
            "message"
            "demo";
    }
    html[dir="rtl"] .footer-main{direction:rtl}
    html[dir="rtl"] .footer-logo{justify-content:flex-start;justify-self:stretch}
    html[dir="ltr"] .footer-logo{justify-content:flex-start}
    html[dir="rtl"] .footer-demo,
    html[dir="ltr"] .footer-demo{justify-self:start}
}


/* =========================================================
   WATCHOPS24 — FOOTER BOTTOM BAR FIX v30
   Footer only: full-width copyright + LiN Developer credit.
   ========================================================= */
.footer-bottom{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    padding:24px 0 4px;
    margin-top:2px;
    border-top:1px solid rgba(119,176,235,.12);
    color:#7f95ad;
    font-weight:500;font-size:13px;line-height:1.6;
    letter-spacing:0;
    text-align:center;
    direction:ltr;
}
.footer-bottom p{
    margin:0;
    width:auto;
    max-width:none;
    white-space:normal;
}
.footer-copyright{
    unicode-bidi:plaintext;
}
html[dir="rtl"] .footer-copyright{
    direction:rtl;
}
html[dir="ltr"] .footer-copyright{
    direction:ltr;
}
.footer-bottom-separator{
    color:#26d9ff;
    opacity:.75;
    line-height:1;
}
.footer-credit{
    direction:ltr;
    color:#8ea6bf;
}
.footer-credit span{
    color:#a9c7e3;
    font-weight:700;
    text-decoration:underline;
    text-underline-offset:3px;
    text-decoration-color:rgba(86,202,255,.55);
}

/* Prevent old RTL footer-bottom rules from pushing content into a narrow side column. */
html[dir="rtl"] .footer-bottom,
html[dir="ltr"] .footer-bottom{
    direction:ltr;
    text-align:center;
    justify-content:center;
}
html[dir="rtl"] .footer-bottom > span,
html[dir="ltr"] .footer-bottom > span{
    direction:ltr;
    text-align:center;
}

@media(max-width:700px){
    .footer-bottom{
        flex-wrap:wrap;
        gap:6px 10px;
        padding-top:20px;
        font-size:12px;
    }
    .footer-bottom-separator{display:none}
    .footer-copyright,
    .footer-credit{width:100%;text-align:center}
}

/* Homepage copyright strip sync */
/* Footer copyright strip — fixed at the true bottom of the footer */
    .site-footer {
      display: flex !important;
      flex-direction: column !important;
    }

    .site-footer .footer-inner {
      width: 100% !important;
    }

    .site-footer .footer-bottom {
      position: relative !important;
      left: auto !important;
      right: auto !important;
      top: auto !important;
      bottom: auto !important;
      transform: none !important;

      width: 100% !important;
      max-width: none !important;
      margin: 42px 0 0 !important;
      padding: 18px 24px 20px !important;

      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      gap: 10px !important;
      flex-wrap: wrap !important;

      text-align: center !important;
      direction: ltr !important;

      border-top: 1px solid rgba(88, 195, 255, .16) !important;
      background: rgba(1, 7, 20, .42) !important;
      box-sizing: border-box !important;
      z-index: 20 !important;
    }

    .site-footer .footer-bottom p {
      margin: 0 !important;
      padding: 0 !important;
      width: auto !important;
      max-width: none !important;
      min-width: 0 !important;

      color: rgba(190, 207, 231, .78) !important;
      font-size: 14px !important;
      line-height: 1.6 !important;
      white-space: normal !important;
      text-align: center !important;
    }

    .site-footer .footer-copyright,
    .site-footer .footer-credit {
      position: static !important;
      inset: auto !important;
      transform: none !important;
    }

    .site-footer .footer-credit span {
      color: #7fdcff !important;
      font-weight: 700 !important;
      text-decoration: underline !important;
      text-underline-offset: 3px !important;
    }

    .site-footer .footer-bottom-separator {
      color: rgba(61, 216, 255, .55) !important;
      display: inline-block !important;
    }

    html[dir="rtl"] .site-footer .footer-bottom,
    body[dir="rtl"] .site-footer .footer-bottom {
      direction: rtl !important;
    }

    @media (max-width: 720px) {
      .site-footer .footer-bottom {
        margin-top: 30px !important;
        padding: 15px 18px 17px !important;
        gap: 5px 8px !important;
      }

      .site-footer .footer-bottom p {
        width: 100% !important;
        font-size: 12px !important;
      }

      .site-footer .footer-bottom-separator {
        display: none !important;
      }
    }