/*
============================================================
RHB Landing Page - Main Stylesheet

Visual state: Visual Freeze v1.0
Docs: see /docs and /knowledge
Warning: preserve visual design. Change only after checking real selectors.
============================================================
*/

@font-face{font-family:siteFont;src:local("IRANSans"),local("Vazirmatn"),local("Tahoma");font-display:swap}
:root{
  --bg:#f6f7ff;--ink:#07112d;--muted:#667085;--line:rgba(116,83,255,.15);
  --blue:#315bff;--violet:#6f3dff;--pink:#e853da;--glass:rgba(255,255,255,.66);
  --shadow:0 22px 70px rgba(55,70,140,.11);--deep:#06102a;--r:30px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);font-family:siteFont,Tahoma,Arial,sans-serif;color:var(--ink);overflow-x:hidden}a{text-decoration:none;color:inherit}img{display:block;max-width:100%}.site-bg{position:fixed;inset:0;z-index:-3;background:radial-gradient(circle at 12% 38%,rgba(124,58,237,.05),transparent 24%),radial-gradient(circle at 90% 55%,rgba(49,91,255,.06),transparent 28%),#f7f8ff}.page{width:min(1488px,calc(100% - 54px));margin:18px auto 0}.glass{background:var(--glass);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.58);box-shadow:var(--shadow)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:15px;height:48px;padding:0 22px;font-weight:800;font-size:14px;transition:.25s ease;white-space:nowrap}.btn:hover{transform:translateY(-3px)}.btn-primary{color:#fff;background:linear-gradient(90deg,#24408f 0%,#3d57b0 100%);box-shadow:0 14px 35px rgba(111,61,255,.28)}.btn-ghost{background:rgba(255,255,255,.52);border:1px solid rgba(120,120,180,.18);color:#26324e}.btn-dark{height:42px;border:1px solid rgba(255,255,255,.25);color:#d9d8ff;background:rgba(255,255,255,.04)}.play{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#2d42a0;background:#fff;border:1px solid rgba(111,61,255,.18)}.eyebrow{display:inline-flex;align-items:center;gap:9px;font-weight:900;font-size:14px;color:#2F4CA8}.eyebrow span{width:8px;height:8px;border-radius:50%;background:linear-gradient(90deg,#2F4CA8 0%,#6A4DA8 55%,#C25AA5 100%);box-shadow:0 0 18px rgba(111,61,255,.5)}
.header{height:76px;border-radius:24px;padding:0 24px;display:grid;grid-template-columns:260px 1fr 185px;align-items:center;position:absolute;z-index:30;top:18px;left:24px;right:24px}.brand{justify-self:end}.brand img{width:220px;height:auto}.nav{display:flex;justify-content:center;gap:38px;font-size:14px;font-weight:800}.nav a{position:relative}.nav a.active{color:var(--violet)}.nav a.active:after{content:"";position:absolute;bottom:-23px;right:0;left:0;margin:auto;width:42px;height:3px;border-radius:99px;background:linear-gradient(90deg,var(--blue),var(--pink))}.header-btn{justify-self:start;height:50px;border-radius:14px}
.hero-wrap{position:relative}.hero{position:relative;height:742px;border-radius:0 0 34px 34px;overflow:hidden}.hero-bg{position:absolute;inset:0;background:url('../img/hero-bg.jpg') center center/cover no-repeat;animation:bgBreath 18s ease-in-out infinite}.hero-fade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(247,248,252,.86) 0%,rgba(247,248,252,.54) 28%,rgba(247,248,252,.02) 62%)}@keyframes bgBreath{50%{transform:scale(1.018) translateY(-7px);filter:brightness(1.03)}}.hero-content{position:absolute;z-index:5;top:176px;right:146px;width:520px;text-align:center;transform:translateX(-70px)}.hero h1{font-size:104px;line-height:.96;letter-spacing:-4px;margin:26px 0 0;font-weight:950;color:#07112d;text-shadow:0 14px 30px rgba(0,0,0,.16)}.hero p{width:470px;margin:24px auto 0;color:#424b67;font-size:16px;line-height:2.05;font-weight:600}.hero-actions{margin-top:26px;display:flex;align-items:center;justify-content:center;gap:26px}.social-side{position:absolute;z-index:6;left:90px;top:180px;display:flex;align-items:center;flex-direction:column;gap:20px;color:#111827;opacity:.9}.social-side a{font-weight:900;font-size:17px;width:22px;height:22px;display:grid;place-items:center}.side-line{height:86px;width:1px;background:linear-gradient(var(--violet),transparent)}.side-line.short{height:62px}.tech-list{position:absolute;z-index:5;right:auto;left:90px;top:185px;text-align:left;direction:ltr;display:flex;flex-direction:column;gap:44px}.tech-item{position:relative;padding-right:22px}.tech-item:after{content:"";position:absolute;right:0;top:8px;width:8px;height:8px;border-radius:50%;background:var(--violet);box-shadow:0 0 16px rgba(111,61,255,.5)}.tech-item b{font-size:19px}.tech-item small{display:block;color:#516079;font-size:12px;margin-top:3px}.scroll-note{position:absolute;z-index:5;left:74px;bottom:112px;text-align:center;color:#34405b;font-size:12px}.mouse{display:block;width:26px;height:42px;border:2px solid rgba(111,61,255,.65);border-radius:15px;margin:0 auto 8px;position:relative}.mouse:after{content:"";position:absolute;right:50%;top:8px;transform:translateX(50%);width:4px;height:8px;border-radius:9px;background:var(--violet);animation:mouse 1.8s infinite}@keyframes mouse{50%{top:19px;opacity:.3}}
.brand-strip{position:absolute;z-index:8;right:90px;left:90px;bottom:16px;height:82px;border-radius:24px;display:flex;align-items:center;overflow:hidden}.brand-badge{width:255px;height:100%;display:grid;place-items:center;font-size:13px;color:#535f78;background:rgba(255,255,255,.58);border-radius:24px 0 0 24px}.brand-logos{height:100%;flex:1;display:flex;align-items:center;justify-content:space-around;gap:24px;padding:0 34px;font-size:21px;color:#5a6073;font-weight:900;filter:grayscale(1);opacity:.78}.brand-logos span{white-space:nowrap}
.section{position:relative;margin-top:76px}.services-section{min-height:470px;display:grid;grid-template-columns:.85fr 1.25fr;align-items:center;gap:38px;padding:0 54px}.molecule-bg{position:absolute;left:-80px;right:auto;top:-65px;width:420px;opacity:.55;pointer-events:none}.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.service-card{min-height:162px;border-radius:27px;padding:24px 22px;text-align:center;background:rgba(255,255,255,.42);border:1px solid rgba(47,76,168,.12);box-shadow:0 18px 55px rgba(47,76,168,.06);transition:.25s}.service-card:hover{transform:translateY(-7px);background:#fff}.service-card i{width:46px;height:46px;border-radius:17px;display:grid;place-items:center;margin:0 auto 15px;color:#2F4CA8;font-size:25px;background:rgba(47,76,168,.08);font-style:normal}.service-card h3{font-size:17px;margin:0 0 9px}.service-card p{font-size:12px;line-height:1.85;color:#667085;margin:0}.section-copy{text-align:right}.section-copy h2{font-size:45px;line-height:1.35;margin:13px 0 17px;letter-spacing:-1px}.section-copy p{font-size:15px;line-height:2;color:#667085;max-width:440px;margin:0}.services-copy{text-align:right}.stats-panel{margin:70px auto 0;width:calc(100% - 72px);min-height:132px;border-radius:24px;background:radial-gradient(circle at 75% 0,rgba(232,83,218,.42),transparent 32%),linear-gradient(135deg,#050d2a,#0a1360 55%,#32106f);display:grid;grid-template-columns:repeat(4,1fr);align-items:center;padding:26px 40px;color:#fff;box-shadow:0 24px 70px rgba(15,18,70,.28);overflow:hidden}.stat{display:flex;align-items:center;justify-content:center;gap:12px;border-left:1px solid rgba(255,255,255,.22)}.stat:last-child{border-left:0}.stat strong{font-size:40px;line-height:1}.stat small{display:block;margin-top:8px;color:rgba(255,255,255,.82);font-weight:700}.stat i{font-size:36px;color:#d8a4ff;font-style:normal;text-shadow:0 0 18px rgba(192,132,252,.55)}.process-section{display:grid;grid-template-columns:360px 1fr;gap:34px;align-items:start;padding:18px 54px 0}.process-copy h2{font-size:54px;line-height:1.25}.steps-line{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;position:relative}.steps-line:before{content:"";position:absolute;top:54px;right:10%;left:10%;height:4px;background:linear-gradient(90deg,#4f7cff,#c64cff);border-radius:999px;box-shadow:0 0 14px rgba(111,61,255,.35)}.step{text-align:center;position:relative;z-index:1}.step div{width:108px;height:108px;border-radius:50%;display:grid;place-items:center;margin:0 auto 15px;font-size:34px;color:var(--violet);background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.8);box-shadow:0 18px 55px rgba(49,91,255,.12), inset 0 1px 0 rgba(255,255,255,.9)}.step b{color:var(--violet);font-size:14px}.step h3{font-size:15px;margin:7px 0}.step p{font-size:12px;line-height:1.85;color:#667085;margin:0}.projects-panel{position:relative;margin:80px auto 0;width:calc(100% - 72px);border-radius:26px;background:#071025;min-height:345px;padding:32px;display:grid;grid-template-columns:285px repeat(3,1fr);gap:24px;color:#fff;box-shadow:0 24px 70px rgba(0,0,0,.18)}.projects-copy small{color:#c084fc;font-weight:900}.projects-copy h2{font-size:36px;line-height:1.35;margin:16px 0}.projects-copy p{font-size:14px;line-height:2;color:rgba(255,255,255,.74)}.project-arrows{margin-top:28px;display:flex;gap:22px;color:#fff;opacity:.7}.project-card{position:relative;border:1px solid rgba(255,255,255,.14);border-radius:22px;overflow:hidden;min-height:275px;background:#0b1534;padding:16px;display:flex;flex-direction:column;justify-content:flex-end}.project-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.84}.project-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(2,8,24,.86))}.project-card h3,.project-card span{position:relative;z-index:1}.project-card h3{margin:0 0 12px;font-size:17px}.project-card span{align-self:flex-start;border-radius:999px;background:rgba(111,61,255,.28);color:#e9d5ff;font-size:12px;padding:6px 12px}.slider-next{position:absolute;left:-22px;top:50%;width:48px;height:48px;border-radius:50%;border:0;background:#0b1028;color:#fff;font-size:22px;box-shadow:0 15px 35px rgba(0,0,0,.25)}.cta-panel{position:relative;margin:56px auto 0;width:calc(100% - 26px);height:170px;border-radius:28px;overflow:hidden;background:rgba(255,255,255,.66);border:1px solid rgba(111,61,255,.14);display:grid;grid-template-columns:420px 1fr;align-items:center;box-shadow:var(--shadow)}.cta-art{height:100%;overflow:hidden}.cta-art img{width:100%;height:100%;object-fit:cover}.cta-copy{text-align:right;padding:0 42px}.cta-copy h2{font-size:34px;margin:0 0 10px}.cta-copy p{color:#667085;line-height:1.9;margin:0 0 18px}.cta-copy .btn{height:44px}.footer{margin:22px auto 0;width:calc(100% - 30px);border-radius:28px 28px 0 0;padding:38px 42px 18px;display:grid;grid-template-columns:1.35fr repeat(4,1fr);gap:34px}.footer img{width:210px;margin-bottom:14px}.footer p,.footer a{display:block;color:#667085;font-size:13px;line-height:1.9;margin:8px 0}.footer h4{font-size:15px;margin:0 0 14px}.footer-social{display:flex;gap:18px;margin-top:20px}.copyright{grid-column:1/-1;text-align:center;border-top:1px solid rgba(111,61,255,.12);padding-top:16px;color:#98a2b3;font-size:12px}
@media(max-width:1100px){.page{width:100%;padding:0 14px}.header{grid-template-columns:210px 1fr 150px}.nav{gap:18px}.hero-content{right:70px}.brand-strip{right:40px;left:40px}.services-section,.process-section{grid-template-columns:1fr}.projects-panel{grid-template-columns:1fr 1fr}.footer{grid-template-columns:1fr 1fr}.cta-panel{grid-template-columns:1fr}.cta-art{display:none}}
@media(max-width:720px){.header{height:auto;grid-template-columns:1fr;gap:14px;padding:16px}.brand,.header-btn{justify-self:center}.nav{flex-wrap:wrap;gap:18px}.hero{height:780px}.hero-bg{background-position:67% center}.hero-content{top:160px;right:22px;left:22px;width:auto}.hero h1{font-size:58px;letter-spacing:-2px}.hero p{width:auto;font-size:14px}.social-side,.tech-list,.scroll-note{display:none}.brand-strip{height:auto;min-height:94px;right:18px;left:18px;bottom:18px;flex-direction:column}.brand-badge{width:100%;height:34px;border-radius:24px 24px 0 0}.brand-logos{font-size:12px;gap:12px;padding:10px;flex-wrap:wrap}.services-grid,.steps-line,.stats-panel{grid-template-columns:1fr}.stats-panel{width:100%}.projects-panel{width:100%;grid-template-columns:1fr}.footer{width:100%;grid-template-columns:1fr}.section-copy h2{font-size:32px}.services-section,.process-section{padding:0 12px}.steps-line:before{display:none}}

/* =====================================================
   FIX PASS 01 - Header/Hero alignment against reference
   هدف: جلوگیری از بیرون‌زدن آیتم‌های هدر و برگرداندن اجزای کناری به جای درست
===================================================== */
.header{
  position:absolute !important;
  top:18px !important;
  right:24px !important;
  left:24px !important;
  height:76px !important;
  padding:0 24px !important;
  display:block !important;
  overflow:hidden !important;
  z-index:40 !important;
}
.header .brand{
  position:absolute !important;
  right:26px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:230px !important;
  display:block !important;
}
.header .brand img{
  width:220px !important;
  height:auto !important;
}
.header .nav{
  position:absolute !important;
  top:50% !important;
  left:50% !important;
  transform:translate(-50%,-50%) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:38px !important;
  width:auto !important;
  white-space:nowrap !important;
}
.header .header-btn{
  position:absolute !important;
  left:24px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  height:46px !important;
  min-width:145px !important;
  border-radius:14px !important;
}
.header .header-btn:hover{
  transform:translateY(calc(-50% - 3px)) !important;
}

.hero-content{
  left:140px !important;
  right:auto !important;
  top:170px !important;
  width:520px !important;
  text-align:center !important;
}
.hero h1{
  font-size:96px !important;
  line-height:.96 !important;
}

.tech-list{
  right:52px !important;
  left:auto !important;
  top:184px !important;
  text-align:right !important;
  direction:rtl !important;
  gap:48px !important;
  z-index:9 !important;
}
.tech-item{
  padding-right:24px !important;
  padding-left:0 !important;
}
.tech-item:after{
  right:0 !important;
  left:auto !important;
}

.scroll-note{
  right:74px !important;
  left:auto !important;
  bottom:112px !important;
  z-index:9 !important;
}

.social-side{
  left:34px !important;
  right:auto !important;
  top:170px !important;
  z-index:9 !important;
  opacity:.9 !important;
}

.brand-strip{
  direction:rtl !important;
  right:88px !important;
  left:88px !important;
  bottom:16px !important;
  height:78px !important;
}
.brand-badge{
  width:245px !important;
  order:1 !important;
  border-radius:24px 0 0 24px !important;
}
.brand-logos{
  order:2 !important;
  font-size:20px !important;
}

@media(max-width:1100px){
  .header .nav{gap:18px !important;font-size:12px !important;}
  .header .brand{width:190px !important;right:18px !important;}
  .header .brand img{width:185px !important;}
  .hero-content{left:70px !important;}
}
@media(max-width:720px){
  .header{position:absolute !important;height:auto !important;min-height:122px !important;overflow:visible !important;}
  .header .brand,.header .nav,.header .header-btn{position:static !important;transform:none !important;margin:8px auto !important;display:flex !important;justify-content:center !important;}
  .header .nav{flex-wrap:wrap !important;white-space:normal !important;}
  .hero-content{left:22px !important;right:22px !important;width:auto !important;}
}

/* =====================================================
   FIX PASS 02 - Code review items 1..7
   فقط اصلاحات هدر/هیرو/نوار برند، بدون تولید تصویر و بدون دستکاری سکشن‌های بعدی.
===================================================== */

/* 1 + 3) هدر: لوگو سمت راست + نام صحیح برند با متن مشکی */
.header .brand{
  position:absolute !important;
  right:28px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:auto !important;
  min-width:250px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:12px !important;
  color:#07112d !important;
  text-align:right !important;
}
.header .brand .brand-icon{
  width:54px !important;
  height:54px !important;
  object-fit:contain !important;
  flex:0 0 auto !important;
}
.header .brand .brand-copy{
  display:flex !important;
  flex-direction:column !important;
  line-height:1.05 !important;
  color:#07112d !important;
}
.header .brand .brand-copy strong{
  font-size:18px !important;
  font-weight:950 !important;
  color:#07112d !important;
  letter-spacing:-.4px !important;
}
.header .brand .brand-copy small{
  margin-top:5px !important;
  font-size:10px !important;
  font-weight:800 !important;
  letter-spacing:.8px !important;
  color:#07112d !important;
  direction:ltr !important;
}

/* 2) منو: خط زیر هیچ آیتمی در حالت عادی دیده نشود؛ فقط hover */
.nav a,
.header .nav a{
  position:relative !important;
  color:#07112d !important;
  padding-bottom:10px !important;
}
.nav a.active,
.header .nav a.active{
  color:#07112d !important;
}
.nav a.active:after,
.header .nav a.active:after{
  content:none !important;
}
.nav a::after,
.header .nav a::after{
  content:"" !important;
  position:absolute !important;
  right:50% !important;
  bottom:-12px !important;
  width:42px !important;
  height:3px !important;
  border-radius:99px !important;
  background:linear-gradient(90deg,var(--blue),var(--pink)) !important;
  opacity:0 !important;
  transform:translateX(50%) scaleX(0) !important;
  transform-origin:center !important;
  transition:opacity .22s ease, transform .22s ease !important;
}
.nav a:hover::after,
.header .nav a:hover::after{
  opacity:1 !important;
  transform:translateX(50%) scaleX(1) !important;
}
.nav a:hover,
.header .nav a:hover{
  color:#2F4CA8 !important;
}

/* 4) تصویر هیرو: زوم کمتر، فضای سمت چپ برای متن */
.hero-bg{
  
  background-position:92% center !important;
  background-repeat: no-repeat;
}
.hero-fade{
  background:linear-gradient(90deg,
    rgba(247,248,252,.94) 0%,
    rgba(247,248,252,.74) 27%,
    rgba(247,248,252,.20) 48%,
    rgba(247,248,252,0) 68%) !important;
}
.hero-content{
  left:128px !important;
  right:auto !important;
  top:175px !important;
  width:485px !important;
  text-align:center !important;
}
.hero h1{
  font-size:88px !important;
  line-height:.95 !important;
  letter-spacing:-3.2px !important;
}
.hero p{
  width:450px !important;
}

/* 5) CTA داخل هیرو: رنگی سمت چپ، شیشه‌ای سمت راست */
.hero-actions{
  flex-direction:row-reverse !important;
  justify-content:center !important;
}
.hero-actions .btn-primary{
  order:2 !important;
}
.hero-actions .btn-ghost{
  order:1 !important;
}

/* 6) شبکه اجتماعی: پایین‌تر و ترتیب لینکدین، اینستاگرام، تلگرام */
.social-side{
  left:36px !important;
  top:260px !important;
  gap:18px !important;
}
.social-side .social-link{
  font-size:18px !important;
  color:#111827 !important;
  opacity:.9 !important;
}
.social-side .side-line{
  height:74px !important;
}
.social-side .side-line.short{
  height:58px !important;
}

/* 7) نوار همراهان: نصف بیرون از هیرو */
.brand-strip{
  right:88px !important;
  left:88px !important;
  bottom:-38px !important;
  height:78px !important;
  z-index:20 !important;
}
.hero{
  margin-bottom:50px !important;
  overflow:visible !important;
}
.hero-bg,
.hero-fade{
  border-radius:0 0 34px 34px !important;
  overflow:hidden !important;
}

@media(max-width:1100px){
  .header .brand{min-width:210px !important;right:20px !important;}
  .header .brand .brand-icon{width:45px !important;height:45px !important;}
  .header .brand .brand-copy strong{font-size:15px !important;}
  .header .brand .brand-copy small{font-size:8px !important;}
  .hero-bg{background-position:80% center !important;}
  .hero-content{left:62px !important;width:430px !important;}
}

/* =====================================================
   FIX PASS 03 - user review 2026-05-30
   Header untouched. Only Hero image, social rail, CTA order,
   brand strip overlap and scroll interaction are adjusted.
===================================================== */

/* 2) Hero image: use the full-width artwork, not a small/contained crop */
.hero-bg{
  
  background-position:center center !important;
  background-repeat: no-repeat;
}
.hero-fade{
  background:linear-gradient(90deg,
    rgba(247,248,252,.88) 0%,
    rgba(247,248,252,.60) 25%,
    rgba(247,248,252,.12) 48%,
    rgba(247,248,252,0) 68%) !important;
}

/* 3 + 4) Social icons: lower, more left, and real Instagram/Telegram icons */
.social-side{
  left:18px !important;
  top:315px !important;
  gap:18px !important;
}
.social-side .social-link{
  width:24px !important;
  height:24px !important;
  display:grid !important;
  place-items:center !important;
  color:#111827 !important;
  opacity:.95 !important;
  font-size:17px !important;
  line-height:1 !important;
}
.social-side .social-link svg{
  width:19px !important;
  height:19px !important;
  fill:none !important;
  stroke:currentColor !important;
  stroke-width:2 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}
.social-side .social-linkedin{
  font-weight:950 !important;
  font-family:Arial, sans-serif !important;
}

/* 5) Hero CTA order: purple button left, glass button right */
.hero-actions{
  direction:ltr !important;
  flex-direction:row !important;
  justify-content:center !important;
}
.hero-actions .btn-primary{
  order:1 !important;
}
.hero-actions .btn-ghost{
  order:2 !important;
}
.hero-actions .btn span,
.hero-actions .btn i{
  direction:rtl !important;
}

/* 6) Partner island: half inside hero, half outside */
.brand-strip{
  bottom:-39px !important;
  height:78px !important;
  z-index:22 !important;
}
.hero{
  overflow:visible !important;
  margin-bottom:66px !important;
}

/* 7) Scroll button must be clickable and smoothly scroll to page end */
.scroll-note{
  cursor:pointer !important;
  text-decoration:none !important;
  color:#34405b !important;
}
.scroll-note:hover .mouse{
  border-color:rgba(111,61,255,.95) !important;
  box-shadow:0 0 20px rgba(111,61,255,.18) !important;
}

@media(max-width:1100px){
  .hero-bg{background-position:70% center !important;}
  .social-side{left:12px !important;top:315px !important;}
}

/* =====================================================
   FIX PASS 04 - user review 2026-05-30
   Header layout and partner island are intentionally untouched.
   Only: hero artwork fitting, CTA icon/visual weight, tech timeline dots.
===================================================== */

/* 2) Hero artwork: no artificial zoom, stick to both left/right edges of hero panel */
.hero-bg{
  
  background-position:center center !important;
  background-repeat: no-repeat;
  transform:none !important;
}
@keyframes bgBreath{
  0%,100%{filter:brightness(1)}
  50%{filter:brightness(1.018)}
}
.hero-bg{animation:bgBreath 22s ease-in-out infinite !important;}

/* Because the artwork is now wider, spread hero UI a bit too */
.hero-content{
  left:112px !important;
  width:520px !important;
}
.tech-list{
  right:48px !important;
}
.scroll-note{
  right:70px !important;
}
.social-side{
  left:16px !important;
}

/* 3) CTA arrows removed; gradient made quieter so buttons stop stealing all focus */
.header-btn i,
.hero-actions .btn-primary i{
  display:none !important;
}
.btn-primary{
  background:linear-gradient(135deg,#4262ff 0%,#884dff 54%,#d94ed0 100%) !important;
  box-shadow:0 12px 26px rgba(111,61,255,.20) !important;
}
.header-btn,
.hero-actions .btn-primary{
  padding-inline:24px !important;
}
.btn-primary:hover{
  box-shadow:0 14px 30px rgba(111,61,255,.24) !important;
}

/* 4) Right-side AI / DATA / CLOUD: soft orb markers + subtle vertical timeline */
.tech-list{
  position:absolute !important;
  padding-right:28px !important;
}
.tech-list::before{
  content:"";
  position:absolute;
  right:3px;
  top:10px;
  bottom:10px;
  width:1px;
  background:linear-gradient(
    180deg,
    rgba(111,61,255,0),
    rgba(111,61,255,.28) 18%,
    rgba(111,61,255,.28) 82%,
    rgba(111,61,255,0)
  );
  pointer-events:none;
}
.tech-item{
  padding-right:30px !important;
}
.tech-item::after{
  right:-1px !important;
  top:7px !important;
  width:11px !important;
  height:11px !important;
  border-radius:50% !important;
  background:radial-gradient(circle at 35% 30%,#ffffff 0%,#f6f1ff 34%,rgba(153,120,255,.42) 68%,rgba(111,61,255,.18) 100%) !important;
  border:1px solid rgba(255,255,255,.75) !important;
  box-shadow:0 0 0 4px rgba(255,255,255,.28),0 0 18px rgba(111,61,255,.16) !important;
  opacity:.64 !important;
  transition:opacity .25s ease, box-shadow .25s ease, transform .25s ease, background .25s ease !important;
}
.tech-item:hover::after{
  opacity:1 !important;
  transform:scale(1.15) !important;
  background:radial-gradient(circle at 35% 30%,#ffffff 0%,#d9ccff 28%,#7b4dff 72%,#e853da 100%) !important;
  box-shadow:0 0 0 5px rgba(255,255,255,.38),0 0 26px rgba(111,61,255,.45) !important;
}

@media(max-width:1100px){
  .hero-bg{background-position:center center !important;}
  .hero-content{left:62px !important;}
}

/* =====================================================
   FIX PASS 05 - user review
   Header and partner island are intentionally untouched.
   Only hero background, hero CTA, tech timeline, smooth scroll, hero eyebrow orb.
===================================================== */

/* 5) Hero image: full viewport width horizontally, still clipped vertically by hero area */
.hero-bg,
.hero-fade{
  left:50% !important;
  right:auto !important;
  width:100vw !important;
  transform:translateX(-50%) !important;
}
.hero-bg{
  
  background-position:center center !important;
  background-repeat: no-repeat;
}
@keyframes bgBreath{
  0%,100%{filter:brightness(1)}
  50%{filter:brightness(1.012)}
}
.hero-bg{
  animation:bgBreath 26s ease-in-out infinite !important;
}

/* 2) Right-side timeline: line must pass exactly through the orb centers */
.tech-list{
  padding-right:34px !important;
}
.tech-list::before{
  right:5px !important;
  top:13px !important;
  bottom:13px !important;
  width:1px !important;
  z-index:0 !important;
  background:linear-gradient(
    180deg,
    rgba(111,61,255,0),
    rgba(111,61,255,.22) 14%,
    rgba(111,61,255,.34) 50%,
    rgba(111,61,255,.22) 86%,
    rgba(111,61,255,0)
  ) !important;
}
.tech-item{
  position:relative !important;
  padding-right:34px !important;
  z-index:1 !important;
}
.tech-item::after{
  right:0 !important;
  top:7px !important;
  z-index:2 !important;
}

/* 3) Hero CTA buttons: more glass, less loud. Header button untouched. */
.hero-actions .btn-primary{
  background:linear-gradient(135deg,rgba(49,91,255,.88),rgba(124,58,237,.82) 58%,rgba(232,83,218,.78)) !important;
  box-shadow:0 10px 24px rgba(111,61,255,.16) !important;
  border:1px solid rgba(255,255,255,.34) !important;
  backdrop-filter:blur(12px) !important;
}
.hero-actions .btn-ghost{
  background:rgba(255,255,255,.38) !important;
  border:1px solid rgba(255,255,255,.58) !important;
  box-shadow:0 10px 24px rgba(49,91,255,.06) !important;
  backdrop-filter:blur(14px) !important;
}
.hero-actions .btn:hover{
  transform:translateY(-2px) !important;
}

/* 6) Hero eyebrow dot: simple soft orb, no glow/hover effect */
.hero-content .eyebrow span{
  width:9px !important;
  height:9px !important;
  border-radius:50% !important;
  background:radial-gradient(circle at 35% 30%,#ffffff 0%,#ece5ff 34%,#8b5cf6 74%,#e853da 100%) !important;
  box-shadow:none !important;
  border:1px solid rgba(255,255,255,.72) !important;
}

@media(max-width:1100px){
  .hero-bg{}
}

/* =====================================================
   FIX PASS 06 - user review
   Header, partner island, and full-width hero structure untouched.
   Only: tech timeline alignment, hero CTA glassiness, remove any remaining hero zoom.
===================================================== */

/* 2) Timeline line through exact center of AI / DATA / CLOUD orbs */
.tech-list{
  padding-right:38px !important;
}
.tech-list::before{
  right:6px !important;
  top:13px !important;
  bottom:13px !important;
  width:1px !important;
  z-index:0 !important;
  background:linear-gradient(
    180deg,
    rgba(111,61,255,0) 0%,
    rgba(111,61,255,.20) 14%,
    rgba(111,61,255,.34) 50%,
    rgba(111,61,255,.20) 86%,
    rgba(111,61,255,0) 100%
  ) !important;
}
.tech-item{
  padding-right:38px !important;
  position:relative !important;
  z-index:1 !important;
}
.tech-item::after{
  right:0 !important;
  top:6px !important;
  width:12px !important;
  height:12px !important;
  z-index:2 !important;
}

/* 3) Hero CTA buttons: softer glass, less visual dominance */
.hero-actions .btn{
  height:46px !important;
  padding:0 22px !important;
  font-weight:700 !important;
}
.hero-actions .btn-primary{
  color:#fff !important;
  background:linear-gradient(135deg,rgba(49,91,255,.74),rgba(124,58,237,.68) 54%,rgba(232,83,218,.62)) !important;
  border:1px solid rgba(255,255,255,.46) !important;
  box-shadow:0 10px 26px rgba(111,61,255,.12), inset 0 1px 0 rgba(255,255,255,.22) !important;
  backdrop-filter:blur(16px) saturate(130%) !important;
}
.hero-actions .btn-ghost{
  color:#22304d !important;
  background:rgba(255,255,255,.34) !important;
  border:1px solid rgba(255,255,255,.70) !important;
  box-shadow:0 10px 24px rgba(49,91,255,.045), inset 0 1px 0 rgba(255,255,255,.34) !important;
  backdrop-filter:blur(18px) saturate(120%) !important;
}
.hero-actions .btn:hover{
  transform:translateY(-1px) !important;
}

/* 5) Remove all artwork zoom. Keep full-viewport width, no scale animation. */
.hero-bg{
  
  background-position:center center !important;
  background-repeat: no-repeat;
  animation:none !important;
  filter:none !important;
}
@media(max-width:1100px){
  .hero-bg{background-position:center center !important;}
}
@media(max-width:720px){
  .hero-bg{background-position:center center !important;}
}


/* =====================================================
   FIX PASS 07 - user review
   Keep header structure, partner island, and full-width hero untouched.
   Only: real hero image URL/no effects, header CTA glass, timeline center, slower scroll support.
===================================================== */
html{scroll-behavior:auto !important;}

/* 2 + 5) Use the exact WordPress hero image, no animation/filter/overlay/zoom effect */
.hero-bg{
  background-image:url('../img/hero-final.webp') !important;
  
  background-position:center center !important;
  background-repeat: no-repeat;
  animation:none !important;
  filter:none !important;
}
.hero-fade{
  display:none !important;
  background:none !important;
}

/* 3) Header CTA: less bold, more glassy, but same position/layout */
.header .header-btn{
  background:linear-gradient(135deg,rgba(49,91,255,.70),rgba(124,58,237,.62) 55%,rgba(232,83,218,.58)) !important;
  border:1px solid rgba(255,255,255,.58) !important;
  box-shadow:0 10px 24px rgba(111,61,255,.12), inset 0 1px 0 rgba(255,255,255,.26) !important;
  backdrop-filter:blur(16px) saturate(125%) !important;
  font-weight:700 !important;
}
.header .header-btn:hover{
  transform:translateY(-1px) !important;
  box-shadow:0 12px 26px rgba(111,61,255,.16), inset 0 1px 0 rgba(255,255,255,.30) !important;
}

/* 2) Tech timeline: line exactly through orb centers */
.tech-list{
  padding-right:38px !important;
}
.tech-list::before{
  content:"" !important;
  position:absolute !important;
  right:6px !important;
  top:12px !important;
  bottom:12px !important;
  width:1px !important;
  z-index:0 !important;
  background:linear-gradient(180deg,
    rgba(111,61,255,0) 0%,
    rgba(111,61,255,.20) 13%,
    rgba(111,61,255,.36) 50%,
    rgba(111,61,255,.20) 87%,
    rgba(111,61,255,0) 100%) !important;
}
.tech-item{
  position:relative !important;
  padding-right:38px !important;
  z-index:1 !important;
}
.tech-item::after{
  right:0 !important;
  top:6px !important;
  width:12px !important;
  height:12px !important;
  z-index:2 !important;
}

@media(max-width:1100px){
  .hero-bg{background-position:center center !important;}
}
@media(max-width:720px){
  .hero-bg{background-position:center center !important;}
}

/* =====================================================
   FIX PASS 09 - user review
   Do NOT change: header structure, partner island, hero full width, hero image, scroll function.
   Only: tech label position, social rail position, scroll button position,
   softer header CTA hover, glassy nav hover.
===================================================== */

/* 1) AI / DATA / CLOUD: 50px more right and 50px lower */
.tech-list{
  right:98px !important;
  top:234px !important;
}

/* 2) Social rail: balanced edge distance and 50px lower */
.social-side{
  left:98px !important;
  top:365px !important;
}

/* 3) Scroll button: 50px more right, no behavior changes */
.scroll-note{
  right:120px !important;
}

/* 4) Header CTA hover: smaller movement, keep vertical centering intact */
.header .header-btn:hover{
  transform:translateY(calc(-50% - 1px)) !important;
  box-shadow:0 11px 24px rgba(111,61,255,.14), inset 0 1px 0 rgba(255,255,255,.30) !important;
}

/* 5) Header nav hover: softer glassy gradient, no always-on underline */
.header .nav a,
.nav a{
  border-radius:14px !important;
  transition:background .22s ease, color .22s ease, box-shadow .22s ease, transform .22s ease !important;
}
.header .nav a:hover,
.nav a:hover{
  color:#2f4ca8 !important;
  background:linear-gradient(135deg,rgba(255,255,255,.32),rgba(47,76,168,.075) 34%,rgba(107,77,168,.07) 66%,rgba(194,90,165,.09)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 8px 20px rgba(47,76,168,.09) !important;
  backdrop-filter:blur(10px) saturate(120%) !important;
}
.header .nav a::after,
.nav a::after{
  background:linear-gradient(90deg,#2f4ca8 0%,#6b4da8 55%,#c25aa5 100%) !important;
  height:2px !important;
  box-shadow:0 0 12px rgba(107,77,168,.18) !important;
}

/* =====================================================
   FIX PASS 12 - viewport based edge positioning only
   Do not change header, brand strip, hero image, hero width, scroll behavior.
===================================================== */
.hero{
  overflow:visible !important;
}

.tech-list{
  left:auto !important;
  right:calc(50px - ((100vw - 100%) / 2)) !important;
  top:234px !important;
  text-align:right !important;
  direction:rtl !important;
}

.scroll-note{
  left:auto !important;
  right:calc(50px - ((100vw - 100%) / 2)) !important;
}

.social-side{
  right:auto !important;
  left:calc(50px - ((100vw - 100%) / 2)) !important;
  top:365px !important;
}

@media(max-width:720px){
  .hero{overflow:hidden !important;}
  .social-side,.tech-list,.scroll-note{display:none !important;}
}

.services-grid{position:relative}.services-grid:before,.services-grid:after{content:"";position:absolute;background:rgba(92,122,255,.18)}.services-grid:before{left:16.6%;right:16.6%;top:50%;height:1px}.services-grid:after{top:16.6%;bottom:16.6%;left:50%;width:1px}



/* =====================================================
   FIX PASS 15 - Full-bleed after-hero background
   The background must NOT sit inside the services box.
   It spans the full viewport width and continues behind the
   Services, Stats, Process, Projects, CTA and Footer area.
===================================================== */
.page{
  position:relative !important;
  overflow:visible !important;
}

.services-section{
  position:relative !important;
  overflow:visible !important;
  background:none !important;
  z-index:1 !important;
}

.molecule-bg{
  display:none !important;
}

.services-grid,
.services-copy,
.stats-panel,
.process-section,
.projects-panel,
.cta-panel,
.footer{
  position:relative !important;
  z-index:2 !important;
}

@media(max-width:720px){
  }

.page{
  position:relative !important;
}
.page::before{
  content:"" !important;
  position:absolute !important;
  top:-320px !important;
  left:50% !important;
  width:100vw !important;
  height:calc(100% + 430px) !important;
  transform:translateX(-50%) !important;
  background:
    url('../img/page-wave-transparent.png') bottom center / 100% auto no-repeat,
    linear-gradient(180deg, #f2f3fb 0%, #f5f3ff 30%, #efeaff 58%, #8d72ff 100%) !important;
  z-index:-1 !important;
  pointer-events:none !important;
}



/* =====================================================
   FIX PASS 26 - Services section visual polish
   Scope: Services only. Header/Hero/Partners/Stats/Process/Projects/CTA/Footer untouched.
===================================================== */

.services-section{
  min-height:590px !important;
  display:grid !important;
  grid-template-columns:minmax(620px, 1.35fr) minmax(360px, .75fr) !important;
  align-items:center !important;
  gap:52px !important;
  padding:42px 66px 8px !important;
}

.services-copy{
  justify-self:start !important;
  max-width:430px !important;
  padding-top:4px !important;
}

.services-copy .eyebrow{
  justify-content:flex-start !important;
  color:#7a3cff !important;
  font-size:13px !important;
  font-weight:900 !important;
  margin-bottom:12px !important;
}

.services-copy .eyebrow span{
  width:9px !important;
  height:9px !important;
  background:linear-gradient(135deg,#8b5cf6,#d946ef) !important;
  box-shadow:0 0 18px rgba(139,92,246,.38) !important;
}

.services-copy h2{
  font-size:43px !important;
  line-height:1.28 !important;
  letter-spacing:-1.4px !important;
  margin:0 0 20px !important;
  color:#07132f !important;
}

.services-copy p{
  max-width:420px !important;
  font-size:14px !important;
  line-height:2.15 !important;
  color:#667085 !important;
}

.services-grid{
  position:relative !important;
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:18px !important;
  max-width:760px !important;
  justify-self:end !important;
  isolation:isolate !important;
  padding:8px !important;
}

/* شبکه اتصال خیلی ظریف بین کارت‌ها */
.services-grid::before{
  content:"" !important;
  position:absolute !important;
  inset:42px 30px !important;
  pointer-events:none !important;
  z-index:0 !important;
  background:
    linear-gradient(90deg, transparent 0 6%, rgba(114,183,255,.32) 6% 94%, transparent 94% 100%) 50% 28% / 100% 1px no-repeat,
    linear-gradient(90deg, transparent 0 6%, rgba(114,183,255,.28) 6% 94%, transparent 94% 100%) 50% 72% / 100% 1px no-repeat,
    linear-gradient(180deg, transparent 0 7%, rgba(114,183,255,.25) 7% 93%, transparent 93% 100%) 33.333% 50% / 1px 100% no-repeat,
    linear-gradient(180deg, transparent 0 7%, rgba(114,183,255,.25) 7% 93%, transparent 93% 100%) 66.666% 50% / 1px 100% no-repeat;
  filter:drop-shadow(0 0 7px rgba(80,150,255,.18)) !important;
}

/* نودهای آبی کوچک بین کارت‌ها */
.services-grid::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;
  z-index:3 !important;
  background:
    radial-gradient(circle, #2ea7ff 0 3px, rgba(46,167,255,.38) 3px 6px, transparent 7px) 33.333% 28% / 12px 12px no-repeat,
    radial-gradient(circle, #2ea7ff 0 3px, rgba(46,167,255,.38) 3px 6px, transparent 7px) 66.666% 28% / 12px 12px no-repeat,
    radial-gradient(circle, #2ea7ff 0 3px, rgba(46,167,255,.38) 3px 6px, transparent 7px) 33.333% 72% / 12px 12px no-repeat,
    radial-gradient(circle, #2ea7ff 0 3px, rgba(46,167,255,.38) 3px 6px, transparent 7px) 66.666% 72% / 12px 12px no-repeat,
    radial-gradient(circle, #7c3cff 0 3px, rgba(124,60,255,.36) 3px 6px, transparent 7px) 16.6% 50% / 12px 12px no-repeat,
    radial-gradient(circle, #7c3cff 0 3px, rgba(124,60,255,.36) 3px 6px, transparent 7px) 50% 50% / 12px 12px no-repeat,
    radial-gradient(circle, #7c3cff 0 3px, rgba(124,60,255,.36) 3px 6px, transparent 7px) 83.4% 50% / 12px 12px no-repeat;
}

.service-card{
  position:relative !important;
  z-index:2 !important;
  min-height:177px !important;
  border-radius:30px !important;
  padding:27px 22px 24px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.46)) !important;
  border:1px solid rgba(124,93,255,.18) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.82),
    0 20px 52px rgba(52,74,140,.075) !important;
  backdrop-filter:blur(12px) saturate(135%) !important;
  -webkit-backdrop-filter:blur(12px) saturate(135%) !important;
  overflow:hidden !important;
}

.service-card::before{
  content:"" !important;
  position:absolute !important;
  inset:10px !important;
  border-radius:24px !important;
  border:1px solid rgba(255,255,255,.62) !important;
  pointer-events:none !important;
}

.service-card:hover{
  transform:translateY(-5px) !important;
  background:rgba(255,255,255,.78) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    0 26px 65px rgba(79,70,229,.12) !important;
}

.service-card i{
  width:47px !important;
  height:47px !important;
  border-radius:17px !important;
  margin:0 auto 17px !important;
  color:#6737ff !important;
  font-size:25px !important;
  background:
    radial-gradient(circle at 35% 25%, rgba(255,255,255,.92), rgba(255,255,255,0) 42%),
    linear-gradient(135deg, rgba(111,61,255,.14), rgba(190,123,255,.08)) !important;
  box-shadow:0 10px 25px rgba(111,61,255,.08) !important;
}

.service-card h3{
  font-size:17px !important;
  line-height:1.45 !important;
  margin:0 0 9px !important;
  color:#07132f !important;
  font-weight:900 !important;
}

.service-card p{
  font-size:12px !important;
  line-height:1.9 !important;
  color:#667085 !important;
  max-width:175px !important;
  margin:0 auto !important;
}

/* جلوگیری از شلوغی در موبایل، همان تمدن حداقلی */
@media(max-width:980px){
  .services-section{
    grid-template-columns:1fr !important;
    padding:34px 22px 0 !important;
    gap:28px !important;
  }
  .services-copy{
    justify-self:stretch !important;
    text-align:center !important;
    margin:0 auto !important;
  }
  .services-grid{
    grid-template-columns:1fr 1fr !important;
    max-width:100% !important;
    justify-self:stretch !important;
  }
  .services-grid::before,
  .services-grid::after{
    display:none !important;
  }
}

@media(max-width:620px){
  .services-grid{
    grid-template-columns:1fr !important;
  }
  .services-copy h2{
    font-size:31px !important;
  }
}



/* =====================================================
   FIX PASS 27 - Services section reference refinement
   Changes:
   1) swap text/cards position
   2) add parent glass frame around card matrix
   3) add stronger organic/vascular connection mesh between cards
   Scope: Services only.
===================================================== */

.services-section{
  grid-template-columns:minmax(360px,.78fr) minmax(650px,1.32fr) !important;
  gap:48px !important;
}

/* متن سمت چپ، کارت‌ها سمت راست */
.services-copy{
  grid-column:1 !important;
  grid-row:1 !important;
  justify-self:end !important;
  max-width:430px !important;
}

.services-grid{
  grid-column:2 !important;
  grid-row:1 !important;
  justify-self:start !important;
  max-width:790px !important;
  padding:24px !important;
  border-radius:36px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.38), rgba(255,255,255,.18)) !important;
  border:1px solid rgba(124,93,255,.13) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.72),
    0 24px 70px rgba(49,91,255,.065) !important;
  backdrop-filter:blur(10px) saturate(125%) !important;
  -webkit-backdrop-filter:blur(10px) saturate(125%) !important;
}

/* قاب داخلی نزدیک به کارت‌ها */
.services-grid > .service-card{
  position:relative !important;
}

.services-grid{
  --mesh-blue: rgba(51,156,255,.36);
  --mesh-violet: rgba(124,60,255,.28);
}

/* شبکه آوندی پشت کارت‌ها */
.services-grid::before{
  content:"" !important;
  position:absolute !important;
  inset:52px 46px !important;
  pointer-events:none !important;
  z-index:1 !important;
  background:
    /* خطوط افقی */
    linear-gradient(90deg, transparent 0 4%, var(--mesh-blue) 4% 96%, transparent 96% 100%) 50% 25% / 100% 1px no-repeat,
    linear-gradient(90deg, transparent 0 4%, rgba(51,156,255,.30) 4% 96%, transparent 96% 100%) 50% 75% / 100% 1px no-repeat,

    /* خطوط عمودی */
    linear-gradient(180deg, transparent 0 6%, rgba(51,156,255,.25) 6% 94%, transparent 94% 100%) 31.5% 50% / 1px 100% no-repeat,
    linear-gradient(180deg, transparent 0 6%, rgba(51,156,255,.25) 6% 94%, transparent 94% 100%) 68.5% 50% / 1px 100% no-repeat,

    /* اتصال‌های مورب */
    linear-gradient(35deg, transparent 0 45%, rgba(124,60,255,.22) 45% 55%, transparent 55% 100%) 50% 50% / 48% 48% no-repeat,
    linear-gradient(-35deg, transparent 0 45%, rgba(51,156,255,.20) 45% 55%, transparent 55% 100%) 50% 50% / 48% 48% no-repeat;
  filter:drop-shadow(0 0 9px rgba(80,150,255,.16)) !important;
}

/* نودهای اتصال روشن‌تر، شبیه مفصل‌های شبکه */
.services-grid::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;
  z-index:4 !important;
  background:
    radial-gradient(circle, #2ea7ff 0 3px, rgba(46,167,255,.42) 3px 7px, transparent 8px) 33% 29% / 14px 14px no-repeat,
    radial-gradient(circle, #2ea7ff 0 3px, rgba(46,167,255,.42) 3px 7px, transparent 8px) 67% 29% / 14px 14px no-repeat,
    radial-gradient(circle, #2ea7ff 0 3px, rgba(46,167,255,.42) 3px 7px, transparent 8px) 33% 71% / 14px 14px no-repeat,
    radial-gradient(circle, #2ea7ff 0 3px, rgba(46,167,255,.42) 3px 7px, transparent 8px) 67% 71% / 14px 14px no-repeat,

    radial-gradient(circle, #7c3cff 0 3px, rgba(124,60,255,.34) 3px 7px, transparent 8px) 50% 50% / 14px 14px no-repeat,
    radial-gradient(circle, rgba(255,255,255,.95) 0 2px, rgba(124,60,255,.30) 2px 6px, transparent 7px) 16.5% 50% / 14px 14px no-repeat,
    radial-gradient(circle, rgba(255,255,255,.95) 0 2px, rgba(124,60,255,.30) 2px 6px, transparent 7px) 83.5% 50% / 14px 14px no-repeat;
}

/* کارت‌ها روی قاب و شبکه بنشینند */
.service-card{
  z-index:3 !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.82), rgba(255,255,255,0) 38%),
    linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,.50)) !important;
  border:1px solid rgba(124,93,255,.16) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.88),
    0 18px 46px rgba(49,91,255,.07) !important;
}

/* موبایل */
@media(max-width:980px){
  .services-section{
    grid-template-columns:1fr !important;
  }

  .services-copy,
  .services-grid{
    grid-column:auto !important;
    grid-row:auto !important;
    justify-self:stretch !important;
  }

  .services-copy{
    text-align:center !important;
  }

  .services-grid{
    padding:16px !important;
  }
}



/* =====================================================
   FIX PASS 28 - Services card grid closer to reference
   Scope: services cards only.
   - Text/cards positions kept as in reference pass.
   - Removes visible parent frame.
   - Adds soft depth/glow zone behind cards instead of boxed container.
   - Organic/vascular mesh with diamond nodes.
   - Card borders become soft individual glass frames.
===================================================== */

/* متن چپ، کارت‌ها راست */
.services-section{
  grid-template-columns:minmax(360px,.78fr) minmax(650px,1.32fr) !important;
  gap:46px !important;
}

.services-copy{
  grid-column:1 !important;
  grid-row:1 !important;
  justify-self:end !important;
  max-width:430px !important;
}

.services-grid{
  grid-column:2 !important;
  grid-row:1 !important;
  justify-self:start !important;
  max-width:770px !important;
  gap:14px !important;
  padding:18px !important;
  border-radius:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  isolation:isolate !important;
}

/* Soft depth zone پشت کارت‌ها، نه قاب مادر */
.services-grid .service-card:nth-child(1)::after{
  content:"" !important;
  position:absolute !important;
  inset:-46px -540px -252px -28px !important;
  border-radius:46px !important;
  background:
    radial-gradient(ellipse at 45% 35%, rgba(255,255,255,.62), rgba(255,255,255,.12) 48%, transparent 75%),
    radial-gradient(ellipse at 65% 70%, rgba(139,92,246,.12), transparent 62%) !important;
  box-shadow:
    inset 0 0 70px rgba(255,255,255,.34),
    0 0 80px rgba(111,61,255,.055) !important;
  z-index:-3 !important;
  pointer-events:none !important;
}

/* شبکه آوندی واقعی‌تر پشت کارت‌ها */
.services-grid::before{
  content:"" !important;
  position:absolute !important;
  inset:55px 46px !important;
  z-index:1 !important;
  pointer-events:none !important;
  background:
    /* افقی بالا و پایین */
    linear-gradient(90deg, transparent 0 4%, rgba(111,185,255,.28) 4% 96%, transparent 96% 100%) 50% 26% / 100% 1px no-repeat,
    linear-gradient(90deg, transparent 0 4%, rgba(111,185,255,.26) 4% 96%, transparent 96% 100%) 50% 74% / 100% 1px no-repeat,

    /* عمودی بین ردیف‌ها */
    linear-gradient(180deg, transparent 0 7%, rgba(111,185,255,.20) 7% 93%, transparent 93% 100%) 32.6% 50% / 1px 100% no-repeat,
    linear-gradient(180deg, transparent 0 7%, rgba(111,185,255,.20) 7% 93%, transparent 93% 100%) 67.4% 50% / 1px 100% no-repeat,

    /* رگه‌های مورب خیلی محو */
    linear-gradient(34deg, transparent 0 46%, rgba(124,60,255,.16) 46% 54%, transparent 54% 100%) 50% 50% / 54% 54% no-repeat,
    linear-gradient(-34deg, transparent 0 46%, rgba(66,165,255,.14) 46% 54%, transparent 54% 100%) 50% 50% / 54% 54% no-repeat;
  filter:drop-shadow(0 0 7px rgba(80,150,255,.15)) !important;
}

/* نودهای اتصال لوزی، نه دایره */
.services-grid::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;
  z-index:5 !important;
  background:
    linear-gradient(45deg, transparent 0 31%, #36a9ff 31% 69%, transparent 69% 100%) 33.1% 30% / 9px 9px no-repeat,
    linear-gradient(45deg, transparent 0 31%, #36a9ff 31% 69%, transparent 69% 100%) 66.9% 30% / 9px 9px no-repeat,
    linear-gradient(45deg, transparent 0 31%, #36a9ff 31% 69%, transparent 69% 100%) 33.1% 70% / 9px 9px no-repeat,
    linear-gradient(45deg, transparent 0 31%, #36a9ff 31% 69%, transparent 69% 100%) 66.9% 70% / 9px 9px no-repeat,

    linear-gradient(45deg, transparent 0 29%, #7b4dff 29% 71%, transparent 71% 100%) 16.5% 50% / 8px 8px no-repeat,
    linear-gradient(45deg, transparent 0 29%, #7b4dff 29% 71%, transparent 71% 100%) 50% 50% / 8px 8px no-repeat,
    linear-gradient(45deg, transparent 0 29%, #7b4dff 29% 71%, transparent 71% 100%) 83.5% 50% / 8px 8px no-repeat;
  filter:
    drop-shadow(0 0 4px rgba(54,169,255,.55))
    drop-shadow(0 0 7px rgba(124,77,255,.22)) !important;
}

/* کارت‌ها نزدیک‌تر و با قاب گلاسی جداگانه */
.service-card{
  min-height:168px !important;
  border-radius:26px !important;
  padding:25px 21px 22px !important;
  position:relative !important;
  z-index:3 !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.86), rgba(255,255,255,0) 42%),
    linear-gradient(180deg, rgba(255,255,255,.68), rgba(255,255,255,.42)) !important;
  border:1px solid rgba(255,255,255,.68) !important;
  box-shadow:
    inset 0 0 0 1px rgba(124,93,255,.105),
    inset 0 1px 0 rgba(255,255,255,.92),
    0 15px 42px rgba(49,91,255,.052) !important;
  backdrop-filter:blur(12px) saturate(120%) !important;
  -webkit-backdrop-filter:blur(12px) saturate(120%) !important;
  overflow:hidden !important;
}

/* خط قاب داخلی هر کارت */
.service-card::before{
  content:"" !important;
  position:absolute !important;
  inset:9px !important;
  border-radius:20px !important;
  border:1px solid rgba(255,255,255,.68) !important;
  box-shadow:inset 0 0 22px rgba(255,255,255,.24) !important;
  pointer-events:none !important;
  z-index:1 !important;
}

/* محتوا بالای قاب داخلی */
.service-card > *{
  position:relative !important;
  z-index:2 !important;
}

/* بک‌پلیت آیکون کم‌رنگ‌تر */
.service-card i{
  width:43px !important;
  height:43px !important;
  border-radius:15px !important;
  margin:0 auto 14px !important;
  color:#6538ff !important;
  font-size:24px !important;
  background:
    radial-gradient(circle at 35% 25%, rgba(255,255,255,.82), rgba(255,255,255,0) 46%),
    linear-gradient(135deg, rgba(111,61,255,.095), rgba(190,123,255,.045)) !important;
  box-shadow:0 8px 20px rgba(111,61,255,.055) !important;
}

.service-card h3{
  font-size:16.5px !important;
  margin-bottom:8px !important;
}

.service-card p{
  font-size:11.7px !important;
  line-height:1.85 !important;
}

.service-card:hover{
  transform:translateY(-4px) !important;
}

/* موبایل */
@media(max-width:980px){
  .services-grid{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }
  .services-grid::before,
  .services-grid::after,
  .services-grid .service-card:nth-child(1)::after{
    display:none !important;
  }
}



/* =====================================================
   FIX PASS 29 - Services: reserve Orb space + stronger glass cards
   Scope: Services only.
===================================================== */

.services-section{
  grid-template-columns:minmax(300px,.62fr) minmax(640px,1.18fr) !important;
  gap:34px !important;
  padding-left:300px !important;
  padding-right:54px !important;
  min-height:620px !important;
}

.services-copy{
  grid-column:1 !important;
  grid-row:1 !important;
  justify-self:end !important;
  max-width:410px !important;
}

.services-grid{
  grid-column:2 !important;
  grid-row:1 !important;
  max-width:735px !important;
  gap:12px !important;
  padding:16px !important;
  justify-self:start !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
}

/* ناحیه عمق پشت کارت‌ها، بدون قاب مادر */
.services-grid .service-card:nth-child(2)::after{
  content:"" !important;
  position:absolute !important;
  inset:-58px -270px -260px -270px !important;
  border-radius:54px !important;
  background:
    radial-gradient(ellipse at 50% 48%, rgba(255,255,255,.46), rgba(255,255,255,.13) 54%, transparent 76%),
    radial-gradient(ellipse at 50% 72%, rgba(132,102,255,.14), transparent 68%) !important;
  z-index:-4 !important;
  pointer-events:none !important;
}

/* کارت‌ها گلاسی‌تر */
.service-card{
  min-height:178px !important;
  border-radius:27px !important;
  padding:27px 22px 23px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.94), rgba(255,255,255,.20) 45%, transparent 74%),
    linear-gradient(180deg, rgba(255,255,255,.70), rgba(255,255,255,.36)) !important;
  border:1px solid rgba(255,255,255,.82) !important;
  box-shadow:
    inset 0 0 0 1px rgba(128,98,255,.13),
    inset 0 1px 0 rgba(255,255,255,.96),
    inset 0 -20px 40px rgba(132,102,255,.045),
    0 18px 50px rgba(49,91,255,.07) !important;
  backdrop-filter:blur(18px) saturate(145%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(145%) !important;
}

.service-card::before{
  content:"" !important;
  position:absolute !important;
  inset:8px !important;
  border-radius:21px !important;
  border:1px solid rgba(255,255,255,.78) !important;
  box-shadow:
    inset 0 0 28px rgba(255,255,255,.34),
    0 0 18px rgba(255,255,255,.18) !important;
  pointer-events:none !important;
  z-index:1 !important;
}

.service-card > *{
  position:relative !important;
  z-index:2 !important;
}

/* هایلایت لبه کارت‌ها */
.service-card:not(:nth-child(2))::after{
  content:"" !important;
  position:absolute !important;
  top:0 !important;
  left:18% !important;
  right:18% !important;
  height:1px !important;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.9), transparent) !important;
  box-shadow:0 0 16px rgba(255,255,255,.58) !important;
  z-index:2 !important;
  pointer-events:none !important;
}

/* خطوط آوندی روشن‌تر و ظریف */
.services-grid::before{
  inset:54px 42px !important;
  background:
    linear-gradient(90deg, transparent 0 4%, rgba(104,183,255,.34) 4% 96%, transparent 96% 100%) 50% 26% / 100% 1px no-repeat,
    linear-gradient(90deg, transparent 0 4%, rgba(104,183,255,.31) 4% 96%, transparent 96% 100%) 50% 74% / 100% 1px no-repeat,
    linear-gradient(180deg, transparent 0 7%, rgba(104,183,255,.24) 7% 93%, transparent 93% 100%) 32.6% 50% / 1px 100% no-repeat,
    linear-gradient(180deg, transparent 0 7%, rgba(104,183,255,.24) 7% 93%, transparent 93% 100%) 67.4% 50% / 1px 100% no-repeat,
    linear-gradient(34deg, transparent 0 46%, rgba(124,60,255,.20) 46% 54%, transparent 54% 100%) 50% 50% / 54% 54% no-repeat,
    linear-gradient(-34deg, transparent 0 46%, rgba(66,165,255,.18) 46% 54%, transparent 54% 100%) 50% 50% / 54% 54% no-repeat !important;
  filter:drop-shadow(0 0 10px rgba(80,150,255,.18)) !important;
}

.services-grid::after{
  filter:
    drop-shadow(0 0 5px rgba(54,169,255,.65))
    drop-shadow(0 0 10px rgba(124,77,255,.25)) !important;
}

/* آیکون‌ها شفاف‌تر */
.service-card i{
  width:45px !important;
  height:45px !important;
  border-radius:16px !important;
  background:
    radial-gradient(circle at 35% 25%, rgba(255,255,255,.88), rgba(255,255,255,0) 48%),
    linear-gradient(135deg, rgba(111,61,255,.075), rgba(190,123,255,.035)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.68),
    0 10px 24px rgba(111,61,255,.06) !important;
}

@media(max-width:980px){
  .services-section{
    padding-left:22px !important;
    padding-right:22px !important;
    grid-template-columns:1fr !important;
  }
  .services-grid .service-card:nth-child(2)::after{
    display:none !important;
  }
}



/* FIX PASS 30 - Services reference match */
.services-section{grid-template-columns:minmax(330px,.72fr) minmax(720px,1.28fr)!important;gap:34px!important;padding-left:270px!important;padding-right:54px!important;min-height:620px!important}
.services-grid{max-width:840px!important;gap:11px!important;padding:18px!important;background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important}
.services-grid .service-card:nth-child(2)::after{content:""!important;position:absolute!important;inset:-60px -320px -270px -320px!important;border-radius:58px!important;background:radial-gradient(ellipse at 50% 46%,rgba(255,255,255,.72),rgba(255,255,255,.22) 48%,transparent 78%),radial-gradient(ellipse at 50% 74%,rgba(116,90,255,.20),transparent 68%)!important;box-shadow:inset 0 0 80px rgba(255,255,255,.42),0 0 90px rgba(111,61,255,.08)!important;z-index:-5!important;pointer-events:none!important}
.service-card{min-height:184px!important;border-radius:28px!important;padding:28px 23px 24px!important;background:radial-gradient(circle at 50% 6%,rgba(255,255,255,.96),rgba(255,255,255,.42) 42%,rgba(255,255,255,.24) 75%),linear-gradient(180deg,rgba(255,255,255,.66),rgba(244,240,255,.34))!important;border:1px solid rgba(255,255,255,.86)!important;box-shadow:inset 0 0 0 1px rgba(116,90,255,.14),inset 0 1px 0 rgba(255,255,255,.98),inset 0 -22px 42px rgba(125,93,255,.06),0 20px 54px rgba(49,91,255,.08)!important;backdrop-filter:blur(20px) saturate(155%)!important;-webkit-backdrop-filter:blur(20px) saturate(155%)!important}
.service-card::before{content:""!important;position:absolute!important;inset:8px!important;border-radius:22px!important;border:1px solid rgba(255,255,255,.82)!important;box-shadow:inset 0 0 34px rgba(255,255,255,.36),0 0 22px rgba(255,255,255,.20)!important;pointer-events:none!important;z-index:1!important}
.service-card::after{content:""!important;position:absolute!important;inset:0!important;border-radius:28px!important;background:linear-gradient(90deg,transparent,rgba(255,255,255,.86),transparent) 50% 0/54% 1px no-repeat,linear-gradient(180deg,transparent,rgba(255,255,255,.62),transparent) 0 50%/1px 64% no-repeat,linear-gradient(180deg,transparent,rgba(255,255,255,.62),transparent) 100% 50%/1px 64% no-repeat!important;filter:drop-shadow(0 0 10px rgba(255,255,255,.55))!important;pointer-events:none!important;z-index:2!important}
.services-grid::before{content:""!important;position:absolute!important;inset:52px 34px!important;z-index:1!important;pointer-events:none!important;background:linear-gradient(90deg,transparent 0 2.5%,rgba(107,185,255,.42) 2.5% 97.5%,transparent 97.5% 100%) 50% 27%/100% 1px no-repeat,linear-gradient(90deg,transparent 0 2.5%,rgba(107,185,255,.38) 2.5% 97.5%,transparent 97.5% 100%) 50% 73%/100% 1px no-repeat,linear-gradient(180deg,transparent 0 5%,rgba(107,185,255,.32) 5% 95%,transparent 95% 100%) 32.8% 50%/1px 100% no-repeat,linear-gradient(180deg,transparent 0 5%,rgba(107,185,255,.32) 5% 95%,transparent 95% 100%) 67.2% 50%/1px 100% no-repeat,linear-gradient(30deg,transparent 0 47%,rgba(124,84,255,.22) 47% 53%,transparent 53% 100%) 50% 50%/52% 52% no-repeat,linear-gradient(-30deg,transparent 0 47%,rgba(65,164,255,.18) 47% 53%,transparent 53% 100%) 50% 50%/52% 52% no-repeat!important;filter:drop-shadow(0 0 8px rgba(72,166,255,.24))!important}
.services-grid::after{content:""!important;position:absolute!important;inset:0!important;z-index:5!important;pointer-events:none!important;background:linear-gradient(45deg,transparent 0 26%,#34aaff 26% 74%,transparent 74% 100%) 33% 31%/10px 10px no-repeat,linear-gradient(45deg,transparent 0 26%,#34aaff 26% 74%,transparent 74% 100%) 67% 31%/10px 10px no-repeat,linear-gradient(45deg,transparent 0 26%,#34aaff 26% 74%,transparent 74% 100%) 33% 69%/10px 10px no-repeat,linear-gradient(45deg,transparent 0 26%,#34aaff 26% 74%,transparent 74% 100%) 67% 69%/10px 10px no-repeat,linear-gradient(45deg,transparent 0 26%,#8257ff 26% 74%,transparent 74% 100%) 16.2% 50%/10px 10px no-repeat,linear-gradient(45deg,transparent 0 26%,#8257ff 26% 74%,transparent 74% 100%) 50% 50%/10px 10px no-repeat,linear-gradient(45deg,transparent 0 26%,#8257ff 26% 74%,transparent 74% 100%) 83.8% 50%/10px 10px no-repeat!important;filter:drop-shadow(0 0 5px rgba(54,170,255,.8)) drop-shadow(0 0 12px rgba(130,87,255,.32))!important}
.service-card i{width:48px!important;height:48px!important;border-radius:17px!important;margin:0 auto 16px!important;background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.92),rgba(255,255,255,0) 52%),linear-gradient(135deg,rgba(111,61,255,.09),rgba(190,123,255,.045))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 10px 24px rgba(111,61,255,.07)!important}
.service-card i svg{width:31px!important;height:31px!important;display:block!important;margin:auto!important;fill:none!important;stroke:#6737ff!important;stroke-width:4.2!important;stroke-linecap:round!important;stroke-linejoin:round!important;filter:drop-shadow(0 0 3px rgba(103,55,255,.18))!important}
.service-card h3{font-size:16.8px!important;margin-bottom:8px!important}.service-card p{font-size:11.8px!important;line-height:1.88!important}
@media(max-width:980px){.services-section{padding-left:22px!important;padding-right:22px!important;grid-template-columns:1fr!important}.services-grid .service-card:nth-child(2)::after,.services-grid::before,.services-grid::after{display:none!important}}



/* FIX PASS 31 - services reference attempt */
.services-section{min-height:635px!important;grid-template-columns:minmax(330px,.72fr) minmax(760px,1.28fr)!important;gap:32px!important;padding-left:285px!important;padding-right:52px!important}
.services-grid{width:850px!important;max-width:850px!important;gap:9px!important;padding:18px!important;background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important;isolation:isolate!important}
.services-grid .service-card:first-child::after{content:""!important;position:absolute!important;inset:-66px -560px -275px -40px!important;border-radius:58px!important;background:radial-gradient(ellipse at 48% 38%,rgba(255,255,255,.82),rgba(255,255,255,.30) 42%,rgba(255,255,255,0) 76%),radial-gradient(ellipse at 52% 68%,rgba(129,98,255,.20),rgba(129,98,255,0) 70%)!important;box-shadow:inset 0 0 95px rgba(255,255,255,.50),0 0 100px rgba(111,61,255,.09)!important;z-index:-4!important;pointer-events:none!important}
.service-card{min-height:190px!important;border-radius:30px!important;padding:30px 24px 24px!important;background:radial-gradient(circle at 50% 4%,rgba(255,255,255,.98),rgba(255,255,255,.52) 44%,rgba(255,255,255,.25) 76%),linear-gradient(180deg,rgba(255,255,255,.72),rgba(246,242,255,.36))!important;border:1px solid rgba(255,255,255,.92)!important;box-shadow:inset 0 0 0 1px rgba(117,88,255,.16),inset 0 1px 0 #fff,inset 0 -28px 54px rgba(132,102,255,.075),0 22px 60px rgba(41,67,145,.09)!important;backdrop-filter:blur(22px) saturate(165%)!important;-webkit-backdrop-filter:blur(22px) saturate(165%)!important;overflow:visible!important}
.service-card::before{content:""!important;position:absolute!important;inset:8px!important;border-radius:23px!important;border:1px solid rgba(255,255,255,.88)!important;box-shadow:inset 0 0 38px rgba(255,255,255,.40),0 0 26px rgba(255,255,255,.24)!important;pointer-events:none!important;z-index:1!important}
.service-card:not(:first-child)::after{content:""!important;position:absolute!important;inset:0!important;border-radius:30px!important;background:linear-gradient(90deg,transparent,rgba(255,255,255,.95),transparent) 50% 0/60% 1px no-repeat,linear-gradient(180deg,transparent,rgba(255,255,255,.72),transparent) 0 50%/1px 70% no-repeat,linear-gradient(180deg,transparent,rgba(255,255,255,.72),transparent) 100% 50%/1px 70% no-repeat!important;filter:drop-shadow(0 0 12px rgba(255,255,255,.58))!important;pointer-events:none!important;z-index:2!important}
.services-grid::before{content:""!important;position:absolute!important;inset:52px 30px!important;z-index:1!important;pointer-events:none!important;background:linear-gradient(90deg,transparent 0 1.8%,rgba(93,176,255,.52) 1.8% 98.2%,transparent 98.2%) 50% 27%/100% 1px no-repeat,linear-gradient(90deg,transparent 0 1.8%,rgba(93,176,255,.47) 1.8% 98.2%,transparent 98.2%) 50% 73%/100% 1px no-repeat,linear-gradient(180deg,transparent 0 4%,rgba(93,176,255,.40) 4% 96%,transparent 96%) 32.9% 50%/1px 100% no-repeat,linear-gradient(180deg,transparent 0 4%,rgba(93,176,255,.40) 4% 96%,transparent 96%) 67.1% 50%/1px 100% no-repeat,linear-gradient(30deg,transparent 0 47%,rgba(126,86,255,.27) 47% 53%,transparent 53%) 50% 50%/50% 50% no-repeat,linear-gradient(-30deg,transparent 0 47%,rgba(75,170,255,.23) 47% 53%,transparent 53%) 50% 50%/50% 50% no-repeat!important;filter:drop-shadow(0 0 10px rgba(72,166,255,.34))!important}
.services-grid::after{content:""!important;position:absolute!important;inset:0!important;z-index:6!important;pointer-events:none!important;background:linear-gradient(45deg,transparent 0 22%,#37aeff 22% 78%,transparent 78%) 33.2% 30.7%/11px 11px no-repeat,linear-gradient(45deg,transparent 0 22%,#37aeff 22% 78%,transparent 78%) 66.8% 30.7%/11px 11px no-repeat,linear-gradient(45deg,transparent 0 22%,#37aeff 22% 78%,transparent 78%) 33.2% 69.3%/11px 11px no-repeat,linear-gradient(45deg,transparent 0 22%,#37aeff 22% 78%,transparent 78%) 66.8% 69.3%/11px 11px no-repeat,linear-gradient(45deg,transparent 0 22%,#8a5cff 22% 78%,transparent 78%) 16.1% 50%/11px 11px no-repeat,linear-gradient(45deg,transparent 0 22%,#8a5cff 22% 78%,transparent 78%) 50% 50%/11px 11px no-repeat,linear-gradient(45deg,transparent 0 22%,#8a5cff 22% 78%,transparent 78%) 83.9% 50%/11px 11px no-repeat!important;filter:drop-shadow(0 0 5px rgba(55,174,255,.95)) drop-shadow(0 0 14px rgba(138,92,255,.38))!important}
.service-card i{width:50px!important;height:50px!important;border-radius:18px!important;margin:0 auto 17px!important;background:radial-gradient(circle at 35% 24%,rgba(255,255,255,.96),rgba(255,255,255,0) 52%),linear-gradient(135deg,rgba(111,61,255,.105),rgba(190,123,255,.055))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.82),0 12px 28px rgba(111,61,255,.08)!important}
.service-card i svg{width:32px!important;height:32px!important;display:block!important;margin:auto!important;fill:none!important;stroke:#6737ff!important;stroke-width:4.4!important;stroke-linecap:round!important;stroke-linejoin:round!important;filter:drop-shadow(0 0 4px rgba(103,55,255,.22))!important}
.service-card h3{font-size:17px!important;margin-bottom:8px!important}.service-card p{font-size:11.8px!important;line-height:1.9!important}
@media(max-width:980px){.services-section{padding-left:22px!important;padding-right:22px!important;grid-template-columns:1fr!important}.services-grid{width:auto!important;max-width:100%!important}.services-grid::before,.services-grid::after,.services-grid .service-card:first-child::after{display:none!important}}



/* =====================================================
   FIX PASS 32 - Rebuild services grid from reference logic
   Scope: Services only
===================================================== */

.services-section{
  min-height:610px !important;
  grid-template-columns:820px 410px !important;
  gap:52px !important;
  padding-left:245px !important; /* reserved empty area for future Neural Orb */
  padding-right:58px !important;
  align-items:center !important;
}

.services-grid{
  grid-column:1 !important;
  grid-row:1 !important;
  width:820px !important;
  max-width:820px !important;
  display:grid !important;
  grid-template-columns:repeat(3, 1fr) !important;
  gap:12px !important;
  padding:24px 22px !important;
  justify-self:end !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
  isolation:isolate !important;
  position:relative !important;
}

.services-copy{
  grid-column:2 !important;
  grid-row:1 !important;
  justify-self:start !important;
  max-width:410px !important;
  text-align:right !important;
}

/* حذف تزئینات قبلی که خروجی را شلخته می‌کرد */
.services-grid::before,
.services-grid::after,
.services-grid .service-card:first-child::after,
.services-grid .service-card:nth-child(2)::after{
  display:none !important;
}

/* SVG mesh واقعی پشت کارت‌ها */
.service-mesh{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  z-index:2 !important;
  pointer-events:none !important;
  overflow:visible !important;
}

.service-mesh .mesh-lines{
  fill:none !important;
  stroke:rgba(88,173,255,.36) !important;
  stroke-width:1.25 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}

.service-mesh .mesh-nodes rect{
  fill:#4db7ff !important;
  stroke:rgba(255,255,255,.8) !important;
  stroke-width:1 !important;
  filter:drop-shadow(0 0 5px rgba(77,183,255,.8)) !important;
}

.service-mesh .mesh-nodes rect:nth-child(1),
.service-mesh .mesh-nodes rect:nth-child(5),
.service-mesh .mesh-nodes rect:nth-child(7){
  fill:#8c58ff !important;
  filter:drop-shadow(0 0 7px rgba(140,88,255,.75)) !important;
}

.service-mesh .mesh-nodes circle{
  fill:#63beff !important;
  filter:drop-shadow(0 0 6px rgba(99,190,255,.75)) !important;
}

/* depth zone پشت کارت‌ها، نه قاب مادر */
.services-grid .service-card:nth-child(3)::before{
  content:"" !important;
  position:absolute !important;
  inset:-62px -28px -250px -560px !important;
  border-radius:58px !important;
  background:
    radial-gradient(ellipse at 50% 42%, rgba(255,255,255,.62), rgba(255,255,255,.20) 50%, transparent 78%),
    radial-gradient(ellipse at 50% 75%, rgba(126,92,255,.16), transparent 72%) !important;
  box-shadow:inset 0 0 88px rgba(255,255,255,.36),0 0 90px rgba(90,80,255,.07) !important;
  z-index:-3 !important;
  pointer-events:none !important;
}

/* کارت‌ها: نزدیک، گلاسی، عمیق‌تر */
.service-card{
  min-height:174px !important;
  border-radius:28px !important;
  padding:26px 21px 22px !important;
  position:relative !important;
  z-index:4 !important;
  background:
    radial-gradient(circle at 50% 6%, rgba(255,255,255,.98), rgba(255,255,255,.52) 42%, rgba(255,255,255,.24) 72%),
    linear-gradient(180deg, rgba(255,255,255,.66), rgba(246,242,255,.34)) !important;
  border:1px solid rgba(255,255,255,.88) !important;
  box-shadow:
    inset 0 0 0 1px rgba(118,92,255,.15),
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -24px 48px rgba(126,92,255,.06),
    0 18px 50px rgba(47,69,145,.08) !important;
  backdrop-filter:blur(20px) saturate(165%) !important;
  -webkit-backdrop-filter:blur(20px) saturate(165%) !important;
  overflow:hidden !important;
}

/* قاب داخلی کارت */
.service-card > *{
  position:relative !important;
  z-index:3 !important;
}

.service-card::before{
  content:"" !important;
  position:absolute !important;
  inset:8px !important;
  border-radius:22px !important;
  border:1px solid rgba(255,255,255,.86) !important;
  box-shadow:inset 0 0 34px rgba(255,255,255,.38),0 0 24px rgba(255,255,255,.22) !important;
  pointer-events:none !important;
  z-index:2 !important;
}

/* هایلایت دور کارت */
.service-card::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  border-radius:28px !important;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.95), transparent) 50% 0/58% 1px no-repeat,
    linear-gradient(90deg, transparent, rgba(255,255,255,.72), transparent) 50% 100%/50% 1px no-repeat,
    linear-gradient(180deg, transparent, rgba(255,255,255,.72), transparent) 0 50%/1px 68% no-repeat,
    linear-gradient(180deg, transparent, rgba(255,255,255,.72), transparent) 100% 50%/1px 68% no-repeat !important;
  filter:drop-shadow(0 0 10px rgba(255,255,255,.55)) !important;
  pointer-events:none !important;
  z-index:2 !important;
}

.service-card i{
  width:48px !important;
  height:48px !important;
  border-radius:17px !important;
  margin:0 auto 15px !important;
  color:#6737ff !important;
  background:
    radial-gradient(circle at 35% 24%, rgba(255,255,255,.96), rgba(255,255,255,0) 52%),
    linear-gradient(135deg, rgba(111,61,255,.105), rgba(190,123,255,.055)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82),0 12px 28px rgba(111,61,255,.08) !important;
}

.service-card i svg{
  width:31px !important;
  height:31px !important;
  fill:none !important;
  stroke:#6737ff !important;
  stroke-width:4.2 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  display:block !important;
  margin:auto !important;
}

.service-card h3{
  font-size:16.6px !important;
  margin:0 0 7px !important;
}

.service-card p{
  font-size:11.5px !important;
  line-height:1.85 !important;
}

/* ترتیب در موبایل */
@media(max-width:980px){
  .services-section{
    padding-left:22px !important;
    padding-right:22px !important;
    grid-template-columns:1fr !important;
  }
  .services-grid{
    width:auto !important;
    max-width:100% !important;
  }
  .service-mesh{
    display:none !important;
  }
}



/* =====================================================
   FIX PASS 33 - Services: correct text/cards position + stronger glass
   Scope: Services only.
===================================================== */

/* در RTL، ستون 1 سمت راست است. پس متن ستون 1، کارت‌ها ستون 2 */
.services-section{
  grid-template-columns:410px 820px !important;
  gap:52px !important;
  padding-left:245px !important;   /* فضای رزرو Orb سمت چپ */
  padding-right:58px !important;
  min-height:620px !important;
  align-items:center !important;
}

.services-copy{
  grid-column:1 !important;
  grid-row:1 !important;
  justify-self:start !important;
  max-width:410px !important;
  text-align:right !important;
}

.services-grid{
  grid-column:2 !important;
  grid-row:1 !important;
  justify-self:end !important;
  width:820px !important;
  max-width:820px !important;
  gap:10px !important;
  padding:24px 22px !important;
}

/* کارت‌ها گلاسی‌تر و نزدیک‌تر به رفرنس */
.service-card{
  min-height:178px !important;
  border-radius:29px !important;
  padding:27px 22px 23px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.98), rgba(255,255,255,.62) 35%, rgba(255,255,255,.30) 72%),
    linear-gradient(180deg, rgba(255,255,255,.76), rgba(244,240,255,.38)) !important;
  border:1px solid rgba(255,255,255,.96) !important;
  box-shadow:
    inset 0 0 0 1px rgba(120,88,255,.16),
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -30px 58px rgba(126,92,255,.085),
    0 18px 54px rgba(42,69,145,.10),
    0 0 34px rgba(255,255,255,.18) !important;
  backdrop-filter:blur(24px) saturate(175%) !important;
  -webkit-backdrop-filter:blur(24px) saturate(175%) !important;
}

/* قاب داخلی روشن‌تر، همان حس فریم گلاسی رفرنس */
.service-card::before{
  inset:7px !important;
  border-radius:23px !important;
  border:1px solid rgba(255,255,255,.94) !important;
  box-shadow:
    inset 0 0 42px rgba(255,255,255,.44),
    0 0 26px rgba(255,255,255,.28) !important;
}

/* هایلایت‌های دور کارت بیشتر شوند */
.service-card::after{
  border-radius:29px !important;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,1), transparent) 50% 0 / 64% 1px no-repeat,
    linear-gradient(90deg, transparent, rgba(255,255,255,.82), transparent) 50% 100% / 58% 1px no-repeat,
    linear-gradient(180deg, transparent, rgba(255,255,255,.82), transparent) 0 50% / 1px 72% no-repeat,
    linear-gradient(180deg, transparent, rgba(255,255,255,.82), transparent) 100% 50% / 1px 72% no-repeat !important;
  filter:drop-shadow(0 0 13px rgba(255,255,255,.62)) !important;
}

/* عمق پشت کارت‌ها تقویت شود، بدون قاب مادر */
.services-grid .service-card:nth-child(3)::before{
  inset:-66px -34px -255px -560px !important;
  background:
    radial-gradient(ellipse at 50% 40%, rgba(255,255,255,.74), rgba(255,255,255,.26) 48%, transparent 78%),
    radial-gradient(ellipse at 50% 74%, rgba(126,92,255,.20), transparent 70%) !important;
  box-shadow:
    inset 0 0 95px rgba(255,255,255,.44),
    0 0 105px rgba(90,80,255,.09) !important;
}

/* خطوط و نودهای اتصال واضح‌تر، نه محو و مرده */
.service-mesh .mesh-lines{
  stroke:rgba(78,168,255,.48) !important;
  stroke-width:1.45 !important;
}

.service-mesh .mesh-nodes rect{
  width:11px !important;
  height:11px !important;
  fill:#35adff !important;
  stroke:rgba(255,255,255,.95) !important;
  stroke-width:1.1 !important;
  filter:
    drop-shadow(0 0 5px rgba(53,173,255,.95))
    drop-shadow(0 0 10px rgba(53,173,255,.35)) !important;
}

.service-mesh .mesh-nodes rect:nth-child(1),
.service-mesh .mesh-nodes rect:nth-child(5),
.service-mesh .mesh-nodes rect:nth-child(7){
  fill:#8a55ff !important;
  filter:
    drop-shadow(0 0 6px rgba(138,85,255,.95))
    drop-shadow(0 0 12px rgba(138,85,255,.42)) !important;
}

.service-mesh .mesh-nodes circle{
  fill:#42b6ff !important;
  filter:drop-shadow(0 0 7px rgba(66,182,255,.85)) !important;
}

/* آیکون‌ها کمی برجسته‌تر و شبیه‌تر به رفرنس */
.service-card i{
  width:50px !important;
  height:50px !important;
  border-radius:18px !important;
  background:
    radial-gradient(circle at 35% 24%, rgba(255,255,255,1), rgba(255,255,255,0) 54%),
    linear-gradient(135deg, rgba(111,61,255,.12), rgba(190,123,255,.06)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    0 12px 28px rgba(111,61,255,.10) !important;
}

.service-card i svg{
  stroke:#6536ff !important;
  stroke-width:4.35 !important;
  filter:drop-shadow(0 0 4px rgba(101,54,255,.24)) !important;
}

@media(max-width:980px){
  .services-section{
    grid-template-columns:1fr !important;
    padding-left:22px !important;
    padding-right:22px !important;
  }

  .services-copy,
  .services-grid{
    grid-column:auto !important;
    grid-row:auto !important;
    justify-self:stretch !important;
  }
}


/* FIX PASS 34 - network first rebuild */
.services-grid{
 gap:4px !important;
 padding:18px !important;
}
.service-card{
 border-radius:26px !important;
 backdrop-filter:blur(34px) saturate(190%) !important;
 -webkit-backdrop-filter:blur(34px) saturate(190%) !important;
 background:
 radial-gradient(circle at 50% 0%,rgba(255,255,255,.98),rgba(255,255,255,.70) 38%,rgba(255,255,255,.30) 72%),
 linear-gradient(180deg,rgba(255,255,255,.78),rgba(248,245,255,.34)) !important;
 box-shadow:
 inset 0 0 0 1px rgba(255,255,255,.95),
 inset 0 0 60px rgba(255,255,255,.35),
 inset 0 -30px 60px rgba(140,110,255,.08),
 0 12px 35px rgba(90,80,180,.06) !important;
}
.service-card::before{
 border-color:rgba(255,255,255,.98)!important;
 box-shadow:inset 0 0 50px rgba(255,255,255,.55)!important;
}
.service-mesh .mesh-lines{
 stroke:rgba(140,170,255,.22)!important;
 stroke-width:.9!important;
}
.service-mesh .mesh-nodes rect{
 transform-box:fill-box;
 fill:#7f67ff!important;
 filter:drop-shadow(0 0 3px rgba(127,103,255,.5))!important;
}
.service-mesh .mesh-nodes circle{
 r:2!important;
 opacity:.8!important;
}
.services-grid .service-card:nth-child(3)::before{
 background:
 radial-gradient(ellipse at center,rgba(255,255,255,.85),rgba(255,255,255,.25) 55%,transparent 80%),
 radial-gradient(ellipse at center,rgba(150,120,255,.12),transparent 70%) !important;
}



/* FIX PASS 35 - Services compact reference rebuild */
.services-section{
  min-height:455px !important;
  margin-top:42px !important;
  padding:0 54px !important;
  grid-template-columns:760px 390px !important;
  gap:44px !important;
  align-items:center !important;
}
.services-copy{
  grid-column:2 !important;
  grid-row:1 !important;
  justify-self:start !important;
  max-width:390px !important;
  text-align:right !important;
}
.services-copy h2{
  font-size:39px !important;
  line-height:1.32 !important;
  margin:10px 0 16px !important;
}
.services-copy p{
  font-size:13.5px !important;
  line-height:2.05 !important;
  max-width:380px !important;
}
.services-grid{
  grid-column:1 !important;
  grid-row:1 !important;
  width:760px !important;
  max-width:760px !important;
  display:grid !important;
  grid-template-columns:repeat(3, 1fr) !important;
  gap:8px !important;
  padding:16px !important;
  justify-self:end !important;
  position:relative !important;
  isolation:isolate !important;
  overflow:visible !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.services-grid::before,
.services-grid::after{
  display:none !important;
}
.services-grid .service-card:first-child::before{
  content:"" !important;
  position:absolute !important;
  inset:-42px -515px -220px -24px !important;
  border-radius:45px !important;
  background:
    radial-gradient(ellipse at 42% 40%, rgba(255,255,255,.88), rgba(255,255,255,.32) 48%, transparent 76%),
    radial-gradient(ellipse at 55% 65%, rgba(118,90,255,.18), transparent 70%) !important;
  box-shadow:
    inset 0 0 90px rgba(255,255,255,.46),
    0 0 100px rgba(90,90,200,.07) !important;
  z-index:-5 !important;
  pointer-events:none !important;
}
.service-mesh{
  position:absolute !important;
  inset:-8px -8px !important;
  width:calc(100% + 16px) !important;
  height:calc(100% + 16px) !important;
  z-index:2 !important;
  pointer-events:none !important;
  overflow:visible !important;
}
.service-mesh .mesh-lines{
  fill:none !important;
  stroke:rgba(88,174,255,.42) !important;
  stroke-width:1.35 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  filter:drop-shadow(0 0 6px rgba(88,174,255,.22)) !important;
}
.service-mesh .mesh-nodes rect{
  width:8px !important;
  height:8px !important;
  fill:#39b3ff !important;
  stroke:rgba(255,255,255,.85) !important;
  stroke-width:.8 !important;
  filter:drop-shadow(0 0 4px rgba(57,179,255,.75)) !important;
}
.service-mesh .mesh-nodes rect:nth-child(1),
.service-mesh .mesh-nodes rect:nth-child(5),
.service-mesh .mesh-nodes rect:nth-child(7){
  fill:#8b57ff !important;
  filter:drop-shadow(0 0 5px rgba(139,87,255,.75)) !important;
}
.service-mesh .mesh-nodes circle{
  fill:#45baff !important;
  opacity:.95 !important;
  filter:drop-shadow(0 0 4px rgba(69,186,255,.7)) !important;
}
.service-card{
  min-height:155px !important;
  border-radius:26px !important;
  padding:24px 20px 19px !important;
  z-index:5 !important;
  background:
    radial-gradient(circle at 50% 2%, rgba(255,255,255,.98), rgba(255,255,255,.62) 36%, rgba(255,255,255,.28) 72%),
    linear-gradient(180deg, rgba(255,255,255,.70), rgba(246,243,255,.34)) !important;
  border:1px solid rgba(255,255,255,.92) !important;
  box-shadow:
    inset 0 0 0 1px rgba(124,93,255,.13),
    inset 0 1px 0 #fff,
    inset 0 -24px 48px rgba(125,92,255,.07),
    0 16px 44px rgba(50,76,145,.075),
    0 0 30px rgba(255,255,255,.22) !important;
  backdrop-filter:blur(26px) saturate(170%) !important;
  -webkit-backdrop-filter:blur(26px) saturate(170%) !important;
  overflow:hidden !important;
}
.service-card::before{
  content:"" !important;
  position:absolute !important;
  inset:7px !important;
  border-radius:20px !important;
  border:1px solid rgba(255,255,255,.90) !important;
  box-shadow:
    inset 0 0 36px rgba(255,255,255,.42),
    0 0 20px rgba(255,255,255,.22) !important;
  z-index:1 !important;
  pointer-events:none !important;
  background:transparent !important;
}
.service-card::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  border-radius:26px !important;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.96), transparent) 50% 0 / 62% 1px no-repeat,
    linear-gradient(90deg, transparent, rgba(255,255,255,.72), transparent) 50% 100% / 52% 1px no-repeat,
    linear-gradient(180deg, transparent, rgba(255,255,255,.72), transparent) 0 50% / 1px 68% no-repeat,
    linear-gradient(180deg, transparent, rgba(255,255,255,.72), transparent) 100% 50% / 1px 68% no-repeat !important;
  filter:drop-shadow(0 0 11px rgba(255,255,255,.6)) !important;
  z-index:2 !important;
  pointer-events:none !important;
}
.service-card > *{
  position:relative !important;
  z-index:3 !important;
}
.service-card i{
  width:43px !important;
  height:43px !important;
  border-radius:16px !important;
  margin:0 auto 12px !important;
}
.service-card i svg{
  width:30px !important;
  height:30px !important;
  display:block !important;
  margin:auto !important;
  fill:none !important;
  stroke:#6536ff !important;
  stroke-width:4.3 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  filter:drop-shadow(0 0 3px rgba(101,54,255,.25)) !important;
}
.service-card h3{
  font-size:16px !important;
  line-height:1.35 !important;
  margin:0 0 7px !important;
}
.service-card p{
  font-size:11.3px !important;
  line-height:1.78 !important;
  max-width:165px !important;
}
.stats-panel{
  margin-top:36px !important;
}
@media(max-width:980px){
  .services-section{
    grid-template-columns:1fr !important;
    padding:0 22px !important;
    min-height:auto !important;
  }
  .services-copy,
  .services-grid{
    grid-column:auto !important;
    grid-row:auto !important;
    width:auto !important;
    max-width:100% !important;
    justify-self:stretch !important;
  }
  .service-mesh,
  .services-grid .service-card:first-child::before{
    display:none !important;
  }
}



/* =====================================================
   FIX PASS 36 - Requested final tune
   Scope: Services only
   - swap text/cards
   - lower card opacity
   - remove the three useless top diamonds
===================================================== */

/* Swap positions: text right, cards left */
.services-copy{
  grid-column:1 !important;
  grid-row:1 !important;
  justify-self:start !important;
  text-align:right !important;
}

.services-grid{
  grid-column:2 !important;
  grid-row:1 !important;
  justify-self:end !important;
}

/* Lower card opacity while keeping glass depth */
.service-card{
  background:
    radial-gradient(circle at 50% 2%, rgba(255,255,255,.82), rgba(255,255,255,.42) 36%, rgba(255,255,255,.18) 72%),
    linear-gradient(180deg, rgba(255,255,255,.52), rgba(246,243,255,.24)) !important;
  border-color:rgba(255,255,255,.72) !important;
  box-shadow:
    inset 0 0 0 1px rgba(124,93,255,.10),
    inset 0 1px 0 rgba(255,255,255,.82),
    inset 0 -22px 42px rgba(125,92,255,.055),
    0 14px 38px rgba(50,76,145,.055),
    0 0 24px rgba(255,255,255,.16) !important;
}

.service-card::before{
  border-color:rgba(255,255,255,.72) !important;
  box-shadow:
    inset 0 0 30px rgba(255,255,255,.30),
    0 0 16px rgba(255,255,255,.16) !important;
}

/* Remove the three floating diamonds above the cards */
.service-mesh .mesh-nodes rect:nth-child(1),
.service-mesh .mesh-nodes rect:nth-child(2),
.service-mesh .mesh-nodes rect:nth-child(3){
  display:none !important;
}

/* If any top decorative nodes still leak from SVG rendering, clip only the very top band */
.service-mesh{
  clip-path:inset(34px 0 0 0) !important;
}


/* =====================================================
   FIX PASS 37 - Process Section Rebuild
===================================================== */

.process-section{
  display:grid !important;
  grid-template-columns:320px 1fr !important;
  gap:48px !important;
  align-items:center !important;
  padding:40px 60px !important;
  margin-top:36px !important;
}

.process-intro h2{
  font-size:48px !important;
  line-height:1.25 !important;
}

.process-intro p{
  font-size:14px !important;
  line-height:2 !important;
  opacity:.75;
}

.process-timeline{
  position:relative !important;
  display:grid !important;
  grid-template-columns:repeat(5,1fr) !important;
  gap:10px !important;
}

.process-timeline:before{
  content:"";
  position:absolute;
  left:8%;
  right:8%;
  top:42px;
  height:3px;
  border-radius:99px;
  background:linear-gradient(90deg,#8b57ff,#47b7ff,#8b57ff);
  opacity:.8;
}

.process-step{
  text-align:center;
  position:relative;
}

.process-icon{
  width:84px;
  height:84px;
  margin:0 auto 12px;
  border-radius:50%;
  background:rgba(255,255,255,.42);
  backdrop-filter:blur(18px);
  border:1px solid rgba(255,255,255,.8);
  box-shadow:0 10px 30px rgba(120,90,255,.08);
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  z-index:2;
}

.process-number{
  color:#7c55ff;
  font-weight:700;
  margin-bottom:8px;
}



/* =====================================================
   FIX PASS 38 - Process Section V2
   Scope: Process only
===================================================== */

.process-section{
  display:grid !important;
  grid-template-columns:280px 1fr !important;
  gap:42px !important;
  align-items:start !important;
  padding:28px 58px 38px !important;
  margin-top:28px !important;
}

.process-copy,
.process-intro{
  max-width:280px !important;
  text-align:right !important;
  padding-top:6px !important;
}

.process-copy h2,
.process-intro h2{
  font-size:38px !important;
  line-height:1.34 !important;
  margin:10px 0 14px !important;
  letter-spacing:-1px !important;
}

.process-copy p,
.process-intro p{
  font-size:13px !important;
  line-height:2.05 !important;
  color:#667085 !important;
  max-width:260px !important;
}

.steps-line,
.process-timeline{
  position:relative !important;
  display:grid !important;
  grid-template-columns:repeat(5,1fr) !important;
  gap:20px !important;
  width:100% !important;
  padding-top:0 !important;
}

/* خط اصلی تایم‌لاین */
.steps-line::before,
.process-timeline::before{
  content:"" !important;
  position:absolute !important;
  top:48px !important;
  left:7% !important;
  right:7% !important;
  height:4px !important;
  border-radius:999px !important;
  background:linear-gradient(90deg,#8d5bff 0%,#cf5dff 34%,#4aa7ff 68%,#7d58ff 100%) !important;
  box-shadow:0 0 14px rgba(137,91,255,.25) !important;
  z-index:0 !important;
}

/* نودهای بین مرحله‌ها */
.steps-line::after,
.process-timeline::after{
  content:"" !important;
  position:absolute !important;
  top:43px !important;
  left:7% !important;
  right:7% !important;
  height:14px !important;
  pointer-events:none !important;
  z-index:1 !important;
  background:
    radial-gradient(circle,#7d58ff 0 4px,rgba(125,88,255,.22) 4px 8px,transparent 9px) 25% 50%/16px 16px no-repeat,
    radial-gradient(circle,#4aa7ff 0 4px,rgba(74,167,255,.22) 4px 8px,transparent 9px) 50% 50%/16px 16px no-repeat,
    radial-gradient(circle,#d45cff 0 4px,rgba(212,92,255,.20) 4px 8px,transparent 9px) 75% 50%/16px 16px no-repeat !important;
}

/* هر مرحله */
.step,
.process-step{
  text-align:center !important;
  position:relative !important;
  z-index:2 !important;
}

/* دایره آیکون‌ها */
.step div,
.process-icon{
  width:95px !important;
  height:95px !important;
  border-radius:50% !important;
  margin:0 auto 13px !important;
  display:grid !important;
  place-items:center !important;
  font-size:34px !important;
  color:#6f3dff !important;
  background:
    radial-gradient(circle at 35% 20%,rgba(255,255,255,.95),rgba(255,255,255,.46) 45%,rgba(255,255,255,.18) 100%) !important;
  border:1px solid rgba(255,255,255,.86) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -18px 38px rgba(125,92,255,.055),
    0 12px 34px rgba(80,72,170,.08) !important;
  backdrop-filter:blur(18px) saturate(150%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(150%) !important;
}

/* شماره مرحله */
.step b,
.process-number{
  display:block !important;
  color:#714cff !important;
  font-size:14px !important;
  font-weight:900 !important;
  margin:0 0 8px !important;
}

.step h3,
.process-step h3{
  font-size:14.5px !important;
  font-weight:900 !important;
  color:#07132f !important;
  line-height:1.55 !important;
  margin:0 0 6px !important;
}

.step p,
.process-step p{
  font-size:11.5px !important;
  line-height:1.85 !important;
  color:#667085 !important;
  margin:0 auto !important;
  max-width:135px !important;
}

/* جایگزینی آیکون‌های متنی با ظاهر نزدیک‌تر */
.steps-line .step:nth-child(1) div,
.process-timeline .process-step:nth-child(1) .process-icon{font-size:0 !important;}
.steps-line .step:nth-child(1) div::before,
.process-timeline .process-step:nth-child(1) .process-icon::before{content:"⌕";font-size:34px;}

.steps-line .step:nth-child(2) div,
.process-timeline .process-step:nth-child(2) .process-icon{font-size:0 !important;}
.steps-line .step:nth-child(2) div::before,
.process-timeline .process-step:nth-child(2) .process-icon::before{content:"✎";font-size:34px;}

.steps-line .step:nth-child(3) div,
.process-timeline .process-step:nth-child(3) .process-icon{font-size:0 !important;}
.steps-line .step:nth-child(3) div::before,
.process-timeline .process-step:nth-child(3) .process-icon::before{content:"</>";font-size:27px;font-weight:800;}

.steps-line .step:nth-child(4) div,
.process-timeline .process-step:nth-child(4) .process-icon{font-size:0 !important;}
.steps-line .step:nth-child(4) div::before,
.process-timeline .process-step:nth-child(4) .process-icon::before{content:"☑";font-size:33px;}

.steps-line .step:nth-child(5) div,
.process-timeline .process-step:nth-child(5) .process-icon{font-size:0 !important;}
.steps-line .step:nth-child(5) div::before,
.process-timeline .process-step:nth-child(5) .process-icon::before{content:"☏";font-size:34px;}

@media(max-width:980px){
  .process-section{
    grid-template-columns:1fr !important;
    padding:28px 22px !important;
  }
  .process-copy,
  .process-intro{
    max-width:100% !important;
    text-align:center !important;
    margin:0 auto !important;
  }
  .steps-line,
  .process-timeline{
    grid-template-columns:1fr !important;
    gap:18px !important;
  }
  .steps-line::before,
  .steps-line::after,
  .process-timeline::before,
  .process-timeline::after{
    display:none !important;
  }
}



/* =====================================================
   FIX PASS 39 - Stats Bar Art Direction
   Scope: Stats panel only
===================================================== */

.stats-panel{
  position:relative !important;
  min-height:98px !important;
  border-radius:18px !important;
  overflow:hidden !important;
  background:
    radial-gradient(circle at 18% 15%, rgba(100,87,255,.28), transparent 24%),
    radial-gradient(circle at 88% 70%, rgba(236,77,255,.22), transparent 28%),
    linear-gradient(135deg,#070d2b 0%,#101153 48%,#25115e 100%) !important;
  box-shadow:
    0 18px 55px rgba(10,12,55,.20),
    inset 0 1px 0 rgba(255,255,255,.10) !important;
}

/* star/noise + lower light waves */
.stats-panel::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;
  background:
    radial-gradient(circle,rgba(255,255,255,.42) 0 1px,transparent 1.4px) 10% 28%/42px 28px,
    radial-gradient(circle,rgba(162,137,255,.45) 0 1px,transparent 1.5px) 40% 20%/58px 34px,
    radial-gradient(circle,rgba(255,255,255,.30) 0 1px,transparent 1.5px) 80% 35%/46px 30px,
    linear-gradient(172deg,transparent 0 58%,rgba(100,95,255,.18) 59%,rgba(236,77,255,.33) 63%,transparent 69%),
    radial-gradient(ellipse at 74% 105%,rgba(242,90,255,.42),transparent 42%),
    radial-gradient(ellipse at 42% 112%,rgba(56,112,255,.34),transparent 38%) !important;
  opacity:.82 !important;
}

.stats-panel::after{
  content:"" !important;
  position:absolute !important;
  left:-4% !important;
  right:-4% !important;
  bottom:-20px !important;
  height:72px !important;
  pointer-events:none !important;
  background:
    linear-gradient(8deg,transparent 32%,rgba(105,110,255,.36) 38%,rgba(245,85,255,.55) 45%,transparent 56%),
    linear-gradient(-7deg,transparent 38%,rgba(74,132,255,.32) 44%,rgba(255,255,255,.38) 49%,transparent 59%) !important;
  filter:blur(.2px) drop-shadow(0 0 12px rgba(185,95,255,.45)) !important;
  opacity:.9 !important;
}

.stat{
  position:relative !important;
  z-index:2 !important;
  gap:18px !important;
  border-left:1px solid rgba(255,255,255,.18) !important;
}

.stat:last-child{
  border-left:0 !important;
}

.stat strong{
  font-size:42px !important;
  font-weight:900 !important;
  letter-spacing:-1px !important;
  color:#fff !important;
  text-shadow:0 0 18px rgba(255,255,255,.18) !important;
}

.stat small{
  font-size:12.5px !important;
  font-weight:800 !important;
  color:rgba(255,255,255,.88) !important;
  margin-top:7px !important;
}

.stat i{
  width:42px !important;
  height:42px !important;
  display:grid !important;
  place-items:center !important;
  font-size:0 !important;
  color:#b78cff !important;
  border-radius:50% !important;
  background:rgba(125,86,255,.07) !important;
  box-shadow:0 0 22px rgba(151,91,255,.14) !important;
}

.stat i svg{
  width:32px !important;
  height:32px !important;
  fill:none !important;
  stroke:#b88bff !important;
  stroke-width:3.2 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  filter:drop-shadow(0 0 6px rgba(184,139,255,.45)) !important;
}



/* =====================================================
   FIX PASS 40 - Stats Bar Premium Reference Tune
   Scope: Stats panel only
   - slightly taller
   - less star noise
   - remove middle glow band
   - move wave/light energy to bottom
   - show SVG icons clearly
===================================================== */

.stats-panel{
  min-height:118px !important;
  padding:26px 38px !important;
  border-radius:19px !important;
  background:
    radial-gradient(circle at 12% 20%, rgba(70,80,190,.18), transparent 23%),
    radial-gradient(circle at 88% 64%, rgba(160,70,220,.18), transparent 28%),
    linear-gradient(135deg,#07102f 0%,#0e1049 48%,#25115e 100%) !important;
  box-shadow:
    0 20px 58px rgba(10,12,55,.20),
    inset 0 1px 0 rgba(255,255,255,.11) !important;
}

/* subtle star texture + bottom-only wave, because apparently the galaxy can calm down */
.stats-panel::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;
  background:
    radial-gradient(circle, rgba(255,255,255,.30) 0 1px, transparent 1.5px) 8% 22%/84px 56px,
    radial-gradient(circle, rgba(150,135,255,.28) 0 1px, transparent 1.5px) 38% 26%/110px 64px,
    radial-gradient(circle, rgba(255,255,255,.22) 0 1px, transparent 1.5px) 82% 24%/94px 58px,
    radial-gradient(ellipse at 78% 112%, rgba(235,84,255,.34), transparent 38%),
    radial-gradient(ellipse at 34% 112%, rgba(56,112,255,.28), transparent 36%) !important;
  opacity:.62 !important;
}

/* wave must stay down, not slap the numbers in the face */
.stats-panel::after{
  content:"" !important;
  position:absolute !important;
  left:-4% !important;
  right:-4% !important;
  bottom:-8px !important;
  height:58px !important;
  pointer-events:none !important;
  background:
    linear-gradient(7deg, transparent 34%, rgba(82,98,255,.30) 42%, rgba(230,80,255,.50) 48%, transparent 62%),
    linear-gradient(-6deg, transparent 42%, rgba(55,120,255,.26) 48%, rgba(255,255,255,.30) 53%, transparent 65%) !important;
  filter:drop-shadow(0 0 12px rgba(180,90,255,.40)) !important;
  opacity:.72 !important;
}

.stat{
  z-index:3 !important;
  gap:18px !important;
  border-left:1px solid rgba(255,255,255,.20) !important;
}

.stat strong{
  font-size:44px !important;
  font-weight:900 !important;
  color:#fff !important;
  text-shadow:
    0 0 12px rgba(255,255,255,.14),
    0 0 20px rgba(150,120,255,.12) !important;
}

.stat small{
  font-size:12.8px !important;
  color:rgba(255,255,255,.88) !important;
  font-weight:850 !important;
}

.stat i{
  width:46px !important;
  height:46px !important;
  opacity:1 !important;
  background:rgba(122,86,255,.08) !important;
  box-shadow:
    0 0 22px rgba(151,91,255,.18),
    inset 0 1px 0 rgba(255,255,255,.10) !important;
}

.stat i svg{
  width:34px !important;
  height:34px !important;
  stroke:#b98cff !important;
  stroke-width:3.15 !important;
  opacity:1 !important;
  filter:
    drop-shadow(0 0 5px rgba(184,139,255,.48))
    drop-shadow(0 0 10px rgba(110,85,255,.22)) !important;
}



/* =====================================================
   FIX PASS 41 - Stats icons visibility fix
   Scope: Stats icons only
===================================================== */

.stats-panel .stat i{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:48px !important;
  min-width:48px !important;
  height:48px !important;
  opacity:1 !important;
  visibility:visible !important;
  font-size:0 !important;
  color:#b98cff !important;
  background:rgba(130,90,255,.10) !important;
  border:1px solid rgba(185,140,255,.18) !important;
  box-shadow:
    0 0 22px rgba(151,91,255,.28),
    inset 0 1px 0 rgba(255,255,255,.14) !important;
  overflow:visible !important;
}

.stats-panel .stat i svg{
  display:block !important;
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
  min-height:34px !important;
  fill:none !important;
  stroke:#c39aff !important;
  stroke-width:3.4 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  opacity:1 !important;
  visibility:visible !important;
  filter:
    drop-shadow(0 0 5px rgba(195,154,255,.75))
    drop-shadow(0 0 12px rgba(110,85,255,.35)) !important;
}

.stats-panel .stat{
  overflow:visible !important;
}



/* =====================================================
   FIX PASS 42 - Process compact reference tune
   Scope: Process section only
   - wider timeline, narrower text
   - smaller circles/icons
   - shorter total height
   - thinner purple-dominant line
   - clearer connector nodes
===================================================== */

.process-section{
  display:grid !important;
  grid-template-columns:240px 1fr !important;
  gap:34px !important;
  align-items:start !important;
  padding:20px 58px 26px !important;
  margin-top:22px !important;
}

.process-copy,
.process-intro{
  max-width:240px !important;
  text-align:right !important;
  padding-top:2px !important;
}

.process-copy h2,
.process-intro h2{
  font-size:34px !important;
  line-height:1.28 !important;
  margin:8px 0 10px !important;
  letter-spacing:-1px !important;
}

.process-copy p,
.process-intro p{
  font-size:12px !important;
  line-height:1.9 !important;
  max-width:235px !important;
  color:#667085 !important;
}

.steps-line,
.process-timeline{
  display:grid !important;
  grid-template-columns:repeat(5,1fr) !important;
  gap:18px !important;
  width:100% !important;
  padding-top:0 !important;
  position:relative !important;
}

.steps-line::before,
.process-timeline::before{
  content:"" !important;
  position:absolute !important;
  top:38px !important;
  left:7.5% !important;
  right:7.5% !important;
  height:3px !important;
  border-radius:999px !important;
  background:linear-gradient(90deg,#8d5bff 0%,#c75dff 38%,#5c8dff 68%,#8d5bff 100%) !important;
  box-shadow:0 0 10px rgba(137,91,255,.22) !important;
  z-index:0 !important;
}

.steps-line::after,
.process-timeline::after{
  content:"" !important;
  position:absolute !important;
  top:33px !important;
  left:7.5% !important;
  right:7.5% !important;
  height:13px !important;
  pointer-events:none !important;
  z-index:1 !important;
  background:
    radial-gradient(circle,#8d5bff 0 3.5px,rgba(141,91,255,.26) 3.5px 7px,transparent 8px) 25% 50%/15px 15px no-repeat,
    radial-gradient(circle,#5c8dff 0 3.5px,rgba(92,141,255,.24) 3.5px 7px,transparent 8px) 50% 50%/15px 15px no-repeat,
    radial-gradient(circle,#c75dff 0 3.5px,rgba(199,93,255,.22) 3.5px 7px,transparent 8px) 75% 50%/15px 15px no-repeat !important;
}

.step,
.process-step{
  text-align:center !important;
  position:relative !important;
  z-index:2 !important;
}

.step div,
.process-icon{
  width:76px !important;
  height:76px !important;
  border-radius:50% !important;
  margin:0 auto 9px !important;
  display:grid !important;
  place-items:center !important;
  font-size:28px !important;
  color:#6f3dff !important;
  background:
    radial-gradient(circle at 35% 18%,rgba(255,255,255,.96),rgba(255,255,255,.54) 42%,rgba(255,255,255,.18) 100%) !important;
  border:1px solid rgba(255,255,255,.86) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -14px 30px rgba(125,92,255,.045),
    0 10px 28px rgba(80,72,170,.07) !important;
  backdrop-filter:blur(16px) saturate(145%) !important;
  -webkit-backdrop-filter:blur(16px) saturate(145%) !important;
}

.step b,
.process-number{
  display:block !important;
  color:#714cff !important;
  font-size:13px !important;
  font-weight:900 !important;
  margin:0 0 6px !important;
}

.step h3,
.process-step h3{
  font-size:13.5px !important;
  font-weight:900 !important;
  color:#07132f !important;
  line-height:1.45 !important;
  margin:0 0 5px !important;
}

.step p,
.process-step p{
  font-size:10.7px !important;
  line-height:1.7 !important;
  color:#667085 !important;
  margin:0 auto !important;
  max-width:125px !important;
}

/* icon size correction */
.steps-line .step:nth-child(1) div::before,
.process-timeline .process-step:nth-child(1) .process-icon::before{font-size:28px !important;}

.steps-line .step:nth-child(2) div::before,
.process-timeline .process-step:nth-child(2) .process-icon::before{font-size:28px !important;}

.steps-line .step:nth-child(3) div::before,
.process-timeline .process-step:nth-child(3) .process-icon::before{font-size:23px !important;}

.steps-line .step:nth-child(4) div::before,
.process-timeline .process-step:nth-child(4) .process-icon::before{font-size:27px !important;}

.steps-line .step:nth-child(5) div::before,
.process-timeline .process-step:nth-child(5) .process-icon::before{font-size:28px !important;}

@media(max-width:980px){
  .process-section{
    grid-template-columns:1fr !important;
    padding:24px 22px !important;
  }
  .process-copy,
  .process-intro{
    max-width:100% !important;
    text-align:center !important;
  }
  .steps-line,
  .process-timeline{
    grid-template-columns:1fr !important;
  }
  .steps-line::before,
  .steps-line::after,
  .process-timeline::before,
  .process-timeline::after{
    display:none !important;
  }
}



/* =====================================================
   FIX PASS 43 - Stats order/numbers + Process column swap
   Scope:
   1) Stats text/numbers only, icons preserved
   2) Process: text left, timeline right
===================================================== */

/* Process columns swap:
   In RTL grid, column 1 renders on the right, column 2 on the left.
   So timeline = column 1, text = column 2. */
.process-section{
  grid-template-columns:1fr 240px !important;
}

.steps-line,
.process-timeline{
  grid-column:1 !important;
  grid-row:1 !important;
  justify-self:stretch !important;
}

.process-copy,
.process-intro{
  grid-column:2 !important;
  grid-row:1 !important;
  justify-self:start !important;
  text-align:right !important;
}

/* Keep mobile sane, because apparently layouts enjoy falling apart for sport */
@media(max-width:980px){
  .process-section{
    grid-template-columns:1fr !important;
  }
  .steps-line,
  .process-timeline,
  .process-copy,
  .process-intro{
    grid-column:auto !important;
    grid-row:auto !important;
  }
}



/* =====================================================
   FIX PASS 44 - Process layout tune only
   Scope: Process section only
   Notes:
   - Stats numbers/order are untouched.
   - Text stays left, timeline stays right.
   - Process ratio tuned closer to reference.
===================================================== */

.process-section{
  grid-template-columns: minmax(0, 1fr) 360px !important;
  gap:42px !important;
  padding:28px 58px 34px !important;
  margin-top:28px !important;
  align-items:start !important;
}

/* RTL grid: column 1 is right, column 2 is left */
.steps-line,
.process-timeline{
  grid-column:1 !important;
  grid-row:1 !important;
  justify-self:stretch !important;
  width:100% !important;
  gap:20px !important;
}

.process-copy,
.process-intro{
  grid-column:2 !important;
  grid-row:1 !important;
  justify-self:start !important;
  max-width:360px !important;
  text-align:right !important;
  padding-top:4px !important;
}

.process-copy h2,
.process-intro h2{
  font-size:36px !important;
  line-height:1.32 !important;
  margin:9px 0 13px !important;
}

.process-copy p,
.process-intro p{
  font-size:12.8px !important;
  line-height:2.05 !important;
  max-width:330px !important;
}

/* restore a little breathing room */
.step div,
.process-icon{
  width:80px !important;
  height:80px !important;
  margin-bottom:11px !important;
}

.steps-line::before,
.process-timeline::before{
  top:40px !important;
  left:7% !important;
  right:7% !important;
  height:3px !important;
}

.steps-line::after,
.process-timeline::after{
  top:35px !important;
  left:7% !important;
  right:7% !important;
}

.step b,
.process-number{
  margin-bottom:7px !important;
}

.step h3,
.process-step h3{
  font-size:13.8px !important;
  line-height:1.5 !important;
  margin-bottom:6px !important;
}

.step p,
.process-step p{
  font-size:11px !important;
  line-height:1.82 !important;
  max-width:132px !important;
}

@media(max-width:980px){
  .process-section{
    grid-template-columns:1fr !important;
    padding:24px 22px !important;
  }
  .steps-line,
  .process-timeline,
  .process-copy,
  .process-intro{
    grid-column:auto !important;
    grid-row:auto !important;
    max-width:100% !important;
  }
}



/* =====================================================
   FIX PASS 45 - Projects section layout tune
   Scope: Projects section only
   - text column narrower
   - cards area wider
   - section height reduced
   - cards smaller
   - left arrow closer to panel edge
===================================================== */

.projects-section,
.portfolio-section,
.cases-section{
  min-height:360px !important;
  padding:28px 38px !important;
  border-radius:24px !important;
}

/* common project wrapper possibilities */
.projects-inner,
.projects-wrapper,
.portfolio-inner,
.cases-inner{
  display:grid !important;
  grid-template-columns:25% 75% !important;
  gap:26px !important;
  align-items:center !important;
}

/* text side */
.projects-copy,
.projects-intro,
.portfolio-copy,
.cases-copy{
  max-width:270px !important;
  justify-self:end !important;
}

.projects-copy h2,
.projects-intro h2,
.portfolio-copy h2,
.cases-copy h2{
  font-size:38px !important;
  line-height:1.28 !important;
  margin-bottom:14px !important;
}

.projects-copy p,
.projects-intro p,
.portfolio-copy p,
.cases-copy p{
  font-size:13px !important;
  line-height:1.95 !important;
}

/* cards side */
.projects-slider,
.projects-grid,
.portfolio-slider,
.cases-slider{
  gap:24px !important;
  align-items:center !important;
}

.project-card,
.portfolio-card,
.case-card{
  min-height:255px !important;
  height:255px !important;
  border-radius:18px !important;
}

.project-card img,
.portfolio-card img,
.case-card img{
  height:175px !important;
  object-fit:cover !important;
}

.project-card h3,
.portfolio-card h3,
.case-card h3{
  font-size:16px !important;
  margin-top:12px !important;
}

/* navigation arrow: sit on panel edge, not orbiting Saturn */
.projects-nav,
.project-nav,
.slider-nav,
.projects-arrow{
  left:-22px !important;
}

.projects-nav.next,
.project-nav.next,
.slider-nav.next,
.projects-arrow.next{
  right:-22px !important;
  left:auto !important;
}

/* If current layout is flex instead of grid */
.projects-section > .container,
.portfolio-section > .container,
.cases-section > .container{
  max-width:1280px !important;
}

@media(max-width:980px){
  .projects-inner,
  .projects-wrapper,
  .portfolio-inner,
  .cases-inner{
    grid-template-columns:1fr !important;
  }

  .projects-copy,
  .projects-intro,
  .portfolio-copy,
  .cases-copy{
    max-width:100% !important;
    justify-self:stretch !important;
  }

  .project-card,
  .portfolio-card,
  .case-card{
    height:auto !important;
    min-height:240px !important;
  }
}


/* FIX 47 - real image test on first project card */

.project-card img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.project-card{
    overflow:hidden;
    position:relative;
}

.project-card::after{
    content:"";
    position:absolute;
    inset:0;
    background:
      linear-gradient(to top,
      rgba(2,8,30,.92) 0%,
      rgba(2,8,30,.45) 35%,
      rgba(2,8,30,.05) 100%);
    pointer-events:none;
}

.project-card h3,
.project-card span{
    position:absolute;
    z-index:3;
}



/* FIX 48 - project artworks */
.project-card img,
.portfolio-card img,
.case-card img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
}

.project-card::after,
.portfolio-card::after,
.case-card::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(to top,
      rgba(2,8,30,.92) 0%,
      rgba(2,8,30,.35) 35%,
      rgba(2,8,30,0) 70%);
    pointer-events:none;
}

.project-card h3,
.project-card .tag,
.portfolio-card h3,
.case-card h3{
    text-shadow:none !important;
    box-shadow:none !important;
    filter:none !important;
}


/* FIX49 project cards redesign */
.projects-panel{align-items:stretch!important}
.project-card{
display:flex!important;flex-direction:column!important;
height:360px!important;overflow:hidden!important;position:relative!important;
padding:0!important;
}
.project-card img{
width:100%!important;height:78%!important;object-fit:cover!important;display:block!important;
}
.project-card .project-content{
height:22%!important;background:#06102d!important;
display:flex!important;flex-direction:column!important;justify-content:center!important;
align-items:center!important;gap:6px;padding:10px!important;
}
.project-card h3{position:static!important;margin:0!important;text-shadow:none!important}
.project-card span{position:static!important;box-shadow:none!important;text-shadow:none!important;background:transparent!important;color:#9f8cff!important}
.project-card::after{
content:"";position:absolute;left:0;right:0;top:58%;height:20%;
background:linear-gradient(to bottom,transparent,rgba(6,16,45,.95));
pointer-events:none;
}



/* =====================================================
   FIX 50 - Clean projects cards
   Scope: Projects section only
   - taller project cards
   - remove purple labels/categories
   - remove slider arrows and controls
   - keep only image + project title
===================================================== */

/* Taller cards */
.project-card,
.portfolio-card,
.case-card{
  height:460px !important;
  min-height:460px !important;
  border-radius:20px !important;
  overflow:hidden !important;
  position:relative !important;
}

/* Image fills the visual area */
.project-card img,
.portfolio-card img,
.case-card img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}

/* Dark bottom gradient for title readability */
.project-card::after,
.portfolio-card::after,
.case-card::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:
    linear-gradient(to top,
      rgba(2,8,30,.92) 0%,
      rgba(2,8,30,.62) 18%,
      rgba(2,8,30,.18) 46%,
      rgba(2,8,30,0) 78%) !important;
  pointer-events:none !important;
  z-index:1 !important;
}

/* Keep project title only */
.project-card h3,
.portfolio-card h3,
.case-card h3{
  position:absolute !important;
  right:22px !important;
  left:22px !important;
  bottom:28px !important;
  z-index:3 !important;
  margin:0 !important;
  color:#fff !important;
  font-size:18px !important;
  line-height:1.5 !important;
  text-shadow:none !important;
  filter:none !important;
  box-shadow:none !important;
}

/* Remove purple labels/categories under titles */
.project-card .tag,
.project-card .category,
.project-card span,
.project-card small,
.portfolio-card .tag,
.portfolio-card .category,
.portfolio-card span,
.portfolio-card small,
.case-card .tag,
.case-card .category,
.case-card span,
.case-card small{
  display:none !important;
}

/* Remove slider arrows and derivatives */
.projects-nav,
.project-nav,
.slider-nav,
.projects-arrow,
.swiper-button-prev,
.swiper-button-next,
.carousel-arrow,
.project-arrow,
.projects-controls,
.slider-controls,
.swiper-pagination,
.projects-pagination{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* If there are loose arrow buttons inside the projects section */
.projects-section button[class*="arrow"],
.projects-section button[class*="nav"],
.portfolio-section button[class*="arrow"],
.portfolio-section button[class*="nav"],
.cases-section button[class*="arrow"],
.cases-section button[class*="nav"]{
  display:none !important;
}

/* Give the section enough vertical room for the taller cards */
.projects-section,
.portfolio-section,
.cases-section{
  min-height:540px !important;
  padding-top:34px !important;
  padding-bottom:34px !important;
}

/* Make sure the cards area aligns nicely */
.projects-slider,
.projects-grid,
.portfolio-slider,
.cases-slider{
  align-items:stretch !important;
}



/* =====================================================
   FIX 51 - Projects polish
   Scope: Projects section only
   - remove dark haze from top of cards
   - remove side arrow and bottom navigation
   - vertically center right text block
===================================================== */

/* Remove the full-card haze. Keep only a small bottom gradient for title readability. */
.project-card::after,
.portfolio-card::after,
.case-card::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:auto !important;
  bottom:0 !important;
  height:34% !important;
  background:linear-gradient(
    to top,
    rgba(2,8,30,.88) 0%,
    rgba(2,8,30,.42) 45%,
    rgba(2,8,30,0) 100%
  ) !important;
  pointer-events:none !important;
  z-index:1 !important;
}

/* Make sure images are not darkened by inherited filters or overlays. */
.project-card img,
.portfolio-card img,
.case-card img{
  filter:none !important;
  opacity:1 !important;
}

/* Remove big side arrow and all slider/navigation controls. */
.projects-nav,
.project-nav,
.slider-nav,
.projects-arrow,
.project-arrow,
.carousel-arrow,
.swiper-button-prev,
.swiper-button-next,
.swiper-pagination,
.projects-pagination,
.projects-controls,
.slider-controls,
.carousel-controls,
.slick-arrow,
.slick-dots{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* Catch loose arrow/control buttons inside projects area. */
.projects-section button,
.portfolio-section button,
.cases-section button{
  /* keep CTA buttons visible by restoring them below */
}

.projects-section button[class*="arrow"],
.projects-section button[class*="nav"],
.projects-section button[class*="prev"],
.projects-section button[class*="next"],
.projects-section .arrow,
.projects-section .prev,
.projects-section .next,
.portfolio-section button[class*="arrow"],
.portfolio-section button[class*="nav"],
.cases-section button[class*="arrow"],
.cases-section button[class*="nav"]{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* Restore CTA button if it was accidentally affected by generic button rules. */
.projects-copy a,
.projects-intro a,
.portfolio-copy a,
.cases-copy a,
.projects-copy .btn,
.projects-intro .btn,
.portfolio-copy .btn,
.cases-copy .btn{
  display:inline-flex !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
}

/* Vertically center the right text column relative to the cards. */
.projects-inner,
.projects-wrapper,
.portfolio-inner,
.cases-inner{
  align-items:center !important;
}

.projects-copy,
.projects-intro,
.portfolio-copy,
.cases-copy{
  align-self:center !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  height:100% !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
}

/* Keep only project title, no category/tag labels. */
.project-card .tag,
.project-card .category,
.project-card small,
.project-card span,
.portfolio-card .tag,
.portfolio-card .category,
.portfolio-card small,
.portfolio-card span,
.case-card .tag,
.case-card .category,
.case-card small,
.case-card span{
  display:none !important;
}

/* Title positioning remains clean and readable. */
.project-card h3,
.portfolio-card h3,
.case-card h3{
  bottom:28px !important;
  z-index:3 !important;
}



/* =====================================================
   FIX 52 - HARD REMOVE projects controls
   Scope: Projects / Portfolio section only
   Purpose:
   - remove big side arrow
   - remove bottom nav/pagination arrows
   - remove arrow/icon inside CTA button
   - keep CTA text/button visible
===================================================== */

/* 1) Remove every absolute/floating control inside projects area */
.projects-section .projects-nav,
.projects-section .project-nav,
.projects-section .slider-nav,
.projects-section .projects-arrow,
.projects-section .project-arrow,
.projects-section .carousel-arrow,
.projects-section .swiper-button-prev,
.projects-section .swiper-button-next,
.projects-section .swiper-pagination,
.projects-section .swiper-pagination-bullet,
.projects-section .projects-pagination,
.projects-section .project-pagination,
.projects-section .slider-pagination,
.projects-section .projects-controls,
.projects-section .project-controls,
.projects-section .slider-controls,
.projects-section .carousel-controls,
.projects-section .owl-nav,
.projects-section .owl-prev,
.projects-section .owl-next,
.projects-section .owl-dots,
.projects-section .slick-arrow,
.projects-section .slick-prev,
.projects-section .slick-next,
.projects-section .slick-dots,
.portfolio-section .projects-nav,
.portfolio-section .project-nav,
.portfolio-section .slider-nav,
.portfolio-section .projects-arrow,
.portfolio-section .project-arrow,
.portfolio-section .carousel-arrow,
.portfolio-section .swiper-button-prev,
.portfolio-section .swiper-button-next,
.portfolio-section .swiper-pagination,
.portfolio-section .swiper-pagination-bullet,
.portfolio-section .projects-pagination,
.portfolio-section .project-pagination,
.portfolio-section .slider-pagination,
.portfolio-section .projects-controls,
.portfolio-section .project-controls,
.portfolio-section .slider-controls,
.portfolio-section .carousel-controls,
.portfolio-section .owl-nav,
.portfolio-section .owl-prev,
.portfolio-section .owl-next,
.portfolio-section .owl-dots,
.portfolio-section .slick-arrow,
.portfolio-section .slick-prev,
.portfolio-section .slick-next,
.portfolio-section .slick-dots,
.cases-section .projects-nav,
.cases-section .project-nav,
.cases-section .slider-nav,
.cases-section .projects-arrow,
.cases-section .project-arrow,
.cases-section .carousel-arrow,
.cases-section .swiper-button-prev,
.cases-section .swiper-button-next,
.cases-section .swiper-pagination,
.cases-section .swiper-pagination-bullet,
.cases-section .projects-pagination,
.cases-section .project-pagination,
.cases-section .slider-pagination,
.cases-section .projects-controls,
.cases-section .project-controls,
.cases-section .slider-controls,
.cases-section .carousel-controls,
.cases-section .owl-nav,
.cases-section .owl-prev,
.cases-section .owl-next,
.cases-section .owl-dots,
.cases-section .slick-arrow,
.cases-section .slick-prev,
.cases-section .slick-next,
.cases-section .slick-dots{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
  width:0 !important;
  height:0 !important;
  min-width:0 !important;
  min-height:0 !important;
  overflow:hidden !important;
}

/* 2) Catch the large round side arrow even when it has generic classes */
.projects-section > a[aria-label*="بعد"],
.projects-section > a[aria-label*="قبل"],
.projects-section > button[aria-label*="بعد"],
.projects-section > button[aria-label*="قبل"],
.projects-section a[class*="arrow"],
.projects-section button[class*="arrow"],
.projects-section a[class*="prev"],
.projects-section button[class*="prev"],
.projects-section a[class*="next"],
.projects-section button[class*="next"],
.projects-section a[class*="slider"],
.projects-section button[class*="slider"],
.portfolio-section a[class*="arrow"],
.portfolio-section button[class*="arrow"],
.portfolio-section a[class*="prev"],
.portfolio-section button[class*="prev"],
.portfolio-section a[class*="next"],
.portfolio-section button[class*="next"],
.cases-section a[class*="arrow"],
.cases-section button[class*="arrow"],
.cases-section a[class*="prev"],
.cases-section button[class*="prev"],
.cases-section a[class*="next"],
.cases-section button[class*="next"]{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* 3) Restore the main CTA button itself, then remove only its arrow/icon */
.projects-copy a,
.projects-intro a,
.portfolio-copy a,
.cases-copy a,
.projects-copy .btn,
.projects-intro .btn,
.portfolio-copy .btn,
.cases-copy .btn,
.projects-section a.btn,
.portfolio-section a.btn,
.cases-section a.btn{
  display:inline-flex !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  width:auto !important;
  height:auto !important;
  min-width:auto !important;
  min-height:auto !important;
  overflow:visible !important;
}

.projects-copy a svg,
.projects-intro a svg,
.portfolio-copy a svg,
.cases-copy a svg,
.projects-copy a i,
.projects-intro a i,
.portfolio-copy a i,
.cases-copy a i,
.projects-copy a .icon,
.projects-intro a .icon,
.portfolio-copy a .icon,
.cases-copy a .icon,
.projects-copy a .arrow,
.projects-intro a .arrow,
.portfolio-copy a .arrow,
.cases-copy a .arrow,
.projects-copy a .btn-arrow,
.projects-intro a .btn-arrow,
.portfolio-copy a .btn-arrow,
.cases-copy a .btn-arrow,
.projects-section a.btn svg,
.projects-section a.btn i,
.projects-section a.btn .icon,
.projects-section a.btn .arrow,
.projects-section a.btn .btn-arrow{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  width:0 !important;
  margin:0 !important;
}

/* 4) Hide loose Persian/Latin arrow glyphs in projects control wrappers */
.projects-section .controls,
.projects-section .navigation,
.projects-section .nav,
.projects-section .pagination,
.portfolio-section .controls,
.portfolio-section .navigation,
.portfolio-section .nav,
.portfolio-section .pagination,
.cases-section .controls,
.cases-section .navigation,
.cases-section .nav,
.cases-section .pagination{
  display:none !important;
}

/* 5) Vertical centering for right text block remains enforced */
.projects-inner,
.projects-wrapper,
.portfolio-inner,
.cases-inner{
  align-items:center !important;
}

.projects-copy,
.projects-intro,
.portfolio-copy,
.cases-copy{
  align-self:center !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  height:100% !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
}

/* 6) Ensure card top image is clean, no dark haze over the top */
.project-card::after,
.portfolio-card::after,
.case-card::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:auto !important;
  bottom:0 !important;
  height:28% !important;
  background:linear-gradient(
    to top,
    rgba(2,8,30,.86) 0%,
    rgba(2,8,30,.38) 50%,
    rgba(2,8,30,0) 100%
  ) !important;
  pointer-events:none !important;
  z-index:1 !important;
}


/* FIX 53 - Remove CTA arrow/icon aggressively */
a.btn svg,
a.btn i,
a.btn .icon,
a.btn .arrow,
a.btn .btn-arrow,
button.btn svg,
button.btn i,
button.btn .icon,
button.btn .arrow,
button.btn .btn-arrow{
  display:none !important;
  width:0 !important;
  margin:0 !important;
  padding:0 !important;
}


/* FIX 54 - Force remove CTA arrow */
a.btn::before,
a.btn::after,
button.btn::before,
button.btn::after,
.btn-primary::before,
.btn-primary::after,
[class*="btn"] svg,
[class*="btn"] i,
[class*="btn"] .icon,
[class*="btn"] .arrow,
[class*="btn"] [class*="arrow"]{
    display:none !important;
    content:none !important;
    width:0 !important;
    margin:0 !important;
    padding:0 !important;
}


/* =====================================================
   FIX 55 REAL - CTA + Footer actual rebuild
   This targets the real classes in index.html:
   .cta-panel, .cta-art, .cta-copy, .footer
===================================================== */

/* CTA card: glass panel, image left, text right */
.cta-panel{
  width:calc(100% - 26px) !important;
  min-height:205px !important;
  height:205px !important;
  margin:48px auto 0 !important;
  border-radius:30px !important;
  overflow:hidden !important;
  display:grid !important;
  grid-template-columns:45% 55% !important;
  align-items:center !important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.78),rgba(245,242,255,.48)) !important;
  border:1px solid rgba(255,255,255,.86) !important;
  box-shadow:
    0 22px 56px rgba(60,54,135,.10),
    inset 0 1px 0 rgba(255,255,255,.95),
    inset 0 0 70px rgba(255,255,255,.25) !important;
  backdrop-filter:blur(18px) saturate(145%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(145%) !important;
}

.cta-panel::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:
    radial-gradient(circle at 30% 20%,rgba(137,91,255,.16),transparent 34%),
    radial-gradient(circle at 74% 72%,rgba(75,120,255,.11),transparent 32%) !important;
  pointer-events:none !important;
}

.cta-art{
  grid-column:1 !important;
  grid-row:1 !important;
  height:100% !important;
  width:100% !important;
  overflow:hidden !important;
}

.cta-art img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
  opacity:.95 !important;
}

.cta-copy{
  grid-column:2 !important;
  grid-row:1 !important;
  position:relative !important;
  z-index:2 !important;
  text-align:center !important;
  padding:0 58px !important;
}

.cta-copy h2{
  font-size:36px !important;
  line-height:1.35 !important;
  margin:0 0 8px !important;
  color:#07132f !important;
}

.cta-copy p{
  margin:0 0 20px !important;
  color:#667085 !important;
  font-size:14px !important;
  line-height:1.9 !important;
}

.cta-copy .btn,
.cta-copy a.btn{
  height:46px !important;
  min-width:235px !important;
  justify-content:center !important;
  gap:0 !important;
}

.cta-copy .btn::before,
.cta-copy .btn::after,
.cta-copy .btn svg,
.cta-copy .btn i,
.cta-copy .btn .icon,
.cta-copy .btn .arrow{
  display:none !important;
  content:none !important;
}

/* Footer: real 5-column glass island */
.footer.rhb-footer,
.footer{
  position:relative !important;
  width:calc(100% - 30px) !important;
  margin:22px auto 70px !important;
  border-radius:30px !important;
  padding:34px 38px 18px !important;
  display:grid !important;
  grid-template-columns:1.05fr 1fr 1fr 1fr 1.45fr !important;
  gap:0 !important;
  align-items:start !important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.78),rgba(247,244,255,.58)) !important;
  border:1px solid rgba(255,255,255,.88) !important;
  box-shadow:
    0 24px 60px rgba(62,58,135,.10),
    inset 0 1px 0 rgba(255,255,255,.95),
    inset 0 0 70px rgba(255,255,255,.26) !important;
  backdrop-filter:blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(140%) !important;
}

.footer::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  border-radius:30px !important;
  background:
    radial-gradient(circle at 8% 95%,rgba(139,91,255,.10),transparent 28%),
    radial-gradient(circle at 82% 18%,rgba(95,120,255,.08),transparent 30%) !important;
  pointer-events:none !important;
}

.footer-col{
  position:relative !important;
  z-index:2 !important;
  min-height:150px !important;
  padding:0 28px !important;
}

.footer-col:not(:last-of-type)::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  top:10px !important;
  bottom:8px !important;
  width:1px !important;
  background:linear-gradient(to bottom,transparent,rgba(111,61,255,.16),transparent) !important;
}

.footer h4{
  font-size:15px !important;
  line-height:1.7 !important;
  margin:0 0 14px !important;
  color:#07132f !important;
  font-weight:900 !important;
}

.footer p,
.footer a{
  display:block !important;
  color:#667085 !important;
  font-size:13px !important;
  line-height:1.9 !important;
  margin:7px 0 !important;
  text-decoration:none !important;
}

.footer-brand{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  text-align:right !important;
}

.footer-brand img{
  width:205px !important;
  height:auto !important;
  margin:0 0 14px !important;
}

.footer-brand p{
  max-width:310px !important;
  margin:0 0 16px !important;
}

.footer-social{
  display:flex !important;
  flex-direction:row !important;
  gap:16px !important;
  margin-top:6px !important;
}

.footer-social a{
  width:30px !important;
  height:30px !important;
  display:grid !important;
  place-items:center !important;
  margin:0 !important;
  color:#07132f !important;
  font-weight:800 !important;
  border-radius:50% !important;
  background:rgba(255,255,255,.42) !important;
  border:1px solid rgba(111,61,255,.12) !important;
}

.copyright{
  grid-column:1/-1 !important;
  position:relative !important;
  z-index:2 !important;
  text-align:center !important;
  border-top:1px solid rgba(111,61,255,.13) !important;
  padding-top:16px !important;
  margin-top:22px !important;
  color:#98a2b3 !important;
  font-size:12px !important;
}

.back-to-top{
  position:absolute !important;
  z-index:5 !important;
  left:22px !important;
  bottom:72px !important;
  width:52px !important;
  height:52px !important;
  border-radius:50% !important;
  display:grid !important;
  place-items:center !important;
  color:#07132f !important;
  font-size:24px !important;
  text-decoration:none !important;
  background:rgba(255,255,255,.58) !important;
  border:1px solid rgba(111,61,255,.14) !important;
  box-shadow:0 12px 28px rgba(62,58,135,.13), inset 0 1px 0 #fff !important;
  backdrop-filter:blur(10px) !important;
  -webkit-backdrop-filter:blur(10px) !important;
}

/* calm down the busy footer background area */
body::after,
.page::after,
.footer-bg,
.footer-waves{
  opacity:.18 !important;
}

/* Responsive footer */
@media(max-width:1100px){
  .cta-panel{
    grid-template-columns:1fr !important;
    height:auto !important;
    min-height:190px !important;
    padding:28px !important;
  }
  .cta-art{
    display:none !important;
  }
  .cta-copy{
    grid-column:1 !important;
    padding:0 !important;
  }
  .footer.rhb-footer,
  .footer{
    grid-template-columns:1fr 1fr !important;
    gap:24px !important;
  }
  .footer-col::after{
    display:none !important;
  }
}

@media(max-width:720px){
  .footer.rhb-footer,
  .footer{
    grid-template-columns:1fr !important;
    width:100% !important;
    margin-bottom:34px !important;
  }
  .footer-col{
    padding:0 !important;
  }
  .back-to-top{
    left:18px !important;
    bottom:60px !important;
  }
}


/* =====================================================
   FIX 56 - Footer final layout correction
   Scope: CTA + Footer only
===================================================== */

/* CTA closer to reference */
.cta-panel{
  width:calc(100% - 26px) !important;
  height:180px !important;
  min-height:180px !important;
  margin:44px auto 0 !important;
  border-radius:26px !important;
  grid-template-columns:55% 45% !important;
  overflow:hidden !important;
}

.cta-art{
  grid-column:1 !important;
  height:100% !important;
}

.cta-art img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
}

.cta-copy{
  grid-column:2 !important;
  padding:0 42px !important;
  text-align:center !important;
}

.cta-copy h2{
  font-size:33px !important;
  line-height:1.35 !important;
  margin:0 0 8px !important;
}

.cta-copy p{
  font-size:13.5px !important;
  margin:0 0 17px !important;
}

.cta-copy .btn,
.cta-copy a.btn{
  height:44px !important;
  min-width:220px !important;
  justify-content:center !important;
}

/* Footer compact, correct 5-column island */
.footer.rhb-footer,
footer.footer{
  direction:rtl !important;
  width:calc(100% - 30px) !important;
  min-height:260px !important;
  margin:22px auto 54px !important;
  padding:34px 38px 16px !important;
  border-radius:28px !important;
  display:grid !important;
  grid-template-columns:1.1fr 1fr 1fr 1fr 1.35fr !important;
  grid-template-areas:
    "contact solutions services links brand"
    "copyright copyright copyright copyright copyright" !important;
  gap:0 !important;
  align-items:start !important;
  background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(248,245,255,.62)) !important;
  border:1px solid rgba(255,255,255,.88) !important;
  box-shadow:
    0 22px 54px rgba(62,58,135,.10),
    inset 0 1px 0 rgba(255,255,255,.96) !important;
  backdrop-filter:blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(140%) !important;
}

.footer-contact{grid-area:contact !important;}
.footer-solutions{grid-area:solutions !important;}
.footer-services{grid-area:services !important;}
.footer-links{grid-area:links !important;}
.footer-brand{grid-area:brand !important;}

.footer-col{
  position:relative !important;
  z-index:2 !important;
  min-height:150px !important;
  padding:0 26px !important;
  text-align:right !important;
}

.footer-col::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  top:8px !important;
  bottom:10px !important;
  width:1px !important;
  background:linear-gradient(to bottom,transparent,rgba(111,61,255,.16),transparent) !important;
}

.footer-contact::after{
  display:none !important;
}

.footer h4{
  font-size:15px !important;
  margin:0 0 13px !important;
  color:#07132f !important;
  font-weight:900 !important;
}

.footer p,
.footer a{
  display:block !important;
  font-size:13px !important;
  line-height:1.85 !important;
  margin:7px 0 !important;
  color:#667085 !important;
  text-decoration:none !important;
}

.footer-brand{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
}

.footer-brand img{
  width:190px !important;
  margin:0 0 12px !important;
}

.footer-brand p{
  max-width:300px !important;
  margin:0 0 14px !important;
}

.footer-social{
  display:flex !important;
  gap:14px !important;
  margin-top:4px !important;
}

.footer-social a{
  width:30px !important;
  height:30px !important;
  border-radius:50% !important;
  display:grid !important;
  place-items:center !important;
  margin:0 !important;
  background:rgba(255,255,255,.42) !important;
  border:1px solid rgba(111,61,255,.12) !important;
  color:#07132f !important;
}

.copyright{
  grid-area:copyright !important;
  text-align:center !important;
  border-top:1px solid rgba(111,61,255,.13) !important;
  padding-top:15px !important;
  margin-top:22px !important;
  font-size:12px !important;
  color:#98a2b3 !important;
}

.back-to-top{
  position:absolute !important;
  left:24px !important;
  bottom:72px !important;
  width:50px !important;
  height:50px !important;
  border-radius:50% !important;
  display:grid !important;
  place-items:center !important;
  font-size:24px !important;
  text-decoration:none !important;
  color:#07132f !important;
  background:rgba(255,255,255,.64) !important;
  border:1px solid rgba(111,61,255,.14) !important;
  box-shadow:0 12px 28px rgba(62,58,135,.13), inset 0 1px 0 #fff !important;
}

/* Reduce purple background dominance near footer */
body::after,
.page::after,
.footer-bg,
.footer-waves{
  opacity:.12 !important;
}

@media(max-width:1100px){
  .cta-panel{
    grid-template-columns:1fr !important;
    height:auto !important;
    padding:28px !important;
  }
  .cta-art{display:none !important;}
  .cta-copy{
    grid-column:1 !important;
    padding:0 !important;
  }
  .footer.rhb-footer,
  footer.footer{
    grid-template-columns:1fr 1fr !important;
    grid-template-areas:
      "brand brand"
      "links services"
      "solutions contact"
      "copyright copyright" !important;
  }
  .footer-col::after{display:none !important;}
}

@media(max-width:720px){
  .footer.rhb-footer,
  footer.footer{
    width:100% !important;
    grid-template-columns:1fr !important;
    grid-template-areas:
      "brand"
      "links"
      "services"
      "solutions"
      "contact"
      "copyright" !important;
  }
}

/* FIX57 actual footer repair */
.footer.rhb-footer, footer.footer{
min-height:auto!important;
padding:28px 36px 14px!important;
grid-template-columns:1.6fr 1fr 1fr 1fr 1fr!important;
align-items:start!important;
}

.footer-brand{
grid-column:1!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:flex-start!important;
text-align:center!important;
min-height:auto!important;
}
.footer-brand img{width:140px!important;margin-bottom:12px!important}
.footer-brand p{max-width:280px!important;margin:0 auto 12px!important}
.footer-social{justify-content:center!important}

.footer-col{min-height:auto!important}

.back-to-top{
width:34px!important;
height:34px!important;
left:18px!important;
bottom:18px!important;
font-size:16px!important;
}

.copyright{
margin-top:10px!important;
padding-top:10px!important;
}

.footer::before{opacity:.25!important}


/* =====================================================
   FIX 58 - Integrated footer island + header logo reuse
   Scope: CTA + Footer only
===================================================== */

/* One island around CTA + footer */
.footer-island{
  position:relative !important;
  width:calc(100% - 30px) !important;
  margin:46px auto 58px !important;
  padding:0 0 18px !important;
  border-radius:30px !important;
  overflow:hidden !important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.78),rgba(248,245,255,.58)) !important;
  border:1px solid rgba(255,255,255,.90) !important;
  box-shadow:
    0 24px 60px rgba(62,58,135,.10),
    inset 0 1px 0 rgba(255,255,255,.96) !important;
  backdrop-filter:blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(140%) !important;
}

/* CTA is now nested inside footer island, not a separate lonely rectangle */
.footer-island .cta-panel{
  width:100% !important;
  margin:0 !important;
  height:185px !important;
  min-height:185px !important;
  border-radius:30px 30px 0 0 !important;
  border:0 !important;
  box-shadow:none !important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.56),rgba(247,244,255,.30)) !important;
  display:grid !important;
  grid-template-columns:55% 45% !important;
  overflow:hidden !important;
}

.footer-island .cta-panel::after{
  content:"" !important;
  position:absolute !important;
  left:28px !important;
  right:28px !important;
  bottom:0 !important;
  height:1px !important;
  background:rgba(111,61,255,.12) !important;
}

.footer-island .cta-art{
  grid-column:1 !important;
  height:100% !important;
}

.footer-island .cta-art img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
}

.footer-island .cta-copy{
  grid-column:2 !important;
  padding:0 44px !important;
  text-align:center !important;
}

.footer-island .cta-copy h2{
  font-size:33px !important;
  line-height:1.35 !important;
}

.footer-island .cta-copy .btn{
  min-width:220px !important;
}

/* Footer lives inside same glass island */
.footer-island .footer,
.footer-island footer.footer{
  width:100% !important;
  margin:0 !important;
  min-height:235px !important;
  padding:30px 38px 14px !important;
  border:0 !important;
  border-radius:0 0 30px 30px !important;
  box-shadow:none !important;
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

/* Enforce compact real 5 columns */
.footer-island .footer.rhb-footer,
.footer-island footer.footer{
  display:grid !important;
  grid-template-columns:1.1fr 1fr 1fr 1fr 1.35fr !important;
  grid-template-areas:
    "contact solutions services links brand"
    "copyright copyright copyright copyright copyright" !important;
  gap:0 !important;
  align-items:start !important;
}

.footer-island .footer-brand{grid-area:brand !important;}
.footer-island .footer-links{grid-area:links !important;}
.footer-island .footer-services{grid-area:services !important;}
.footer-island .footer-solutions{grid-area:solutions !important;}
.footer-island .footer-contact{grid-area:contact !important;}

.footer-island .footer-col{
  min-height:145px !important;
  padding:0 26px !important;
}

.footer-island .footer-brand{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  text-align:right !important;
}

.footer-island .footer-brand img{
  width:210px !important;
  max-width:210px !important;
  height:auto !important;
  margin:0 0 12px !important;
  object-fit:contain !important;
}

.footer-island .footer-brand p{
  max-width:310px !important;
  margin:0 0 12px !important;
}

.footer-island .footer-social{
  display:flex !important;
  gap:14px !important;
  margin-top:4px !important;
}

.footer-island .back-to-top{
  left:24px !important;
  bottom:68px !important;
  width:46px !important;
  height:46px !important;
  font-size:22px !important;
  background:rgba(255,255,255,.62) !important;
}

/* Lower footer height and empty vertical space */
.footer-island .copyright{
  margin-top:16px !important;
  padding-top:13px !important;
}

/* Dim the outside purple background, because it was yelling */
body::after,
.page::after,
.footer-bg,
.footer-waves{
  opacity:.10 !important;
}

@media(max-width:1100px){
  .footer-island .cta-panel{
    grid-template-columns:1fr !important;
    height:auto !important;
    min-height:170px !important;
    padding:26px !important;
  }
  .footer-island .cta-art{display:none !important;}
  .footer-island .cta-copy{
    grid-column:1 !important;
    padding:0 !important;
  }
  .footer-island .footer.rhb-footer,
  .footer-island footer.footer{
    grid-template-columns:1fr 1fr !important;
    grid-template-areas:
      "brand brand"
      "links services"
      "solutions contact"
      "copyright copyright" !important;
  }
}

@media(max-width:720px){
  .footer-island{
    width:100% !important;
  }
  .footer-island .footer.rhb-footer,
  .footer-island footer.footer{
    grid-template-columns:1fr !important;
    grid-template-areas:
      "brand"
      "links"
      "services"
      "solutions"
      "contact"
      "copyright" !important;
  }
}

/* FIX59 */
.footer-island{padding-bottom:0!important}
.footer-island .cta-panel{grid-template-columns:45% 55%!important;height:170px!important;min-height:170px!important}
.footer-island .cta-copy{order:2!important}
.footer-island .cta-art{order:1!important}
.footer-island .footer{min-height:170px!important;padding:20px 35px 8px!important}
.footer-island .footer-brand{align-self:start!important}
.footer-island .footer-brand img{width:260px!important}
.footer-island .footer-col{min-height:90px!important}
.footer-island .footer-brand p{font-size:14px!important;line-height:2!important}
.back-to-top{left:auto!important;right:20px!important;bottom:20px!important;width:44px!important;height:44px!important}
.footer-social{margin-top:12px!important}



/* =====================================================
   FIX 60 - Final CTA background integration
   Scope: CTA only
===================================================== */

.footer-island .cta-panel,
.cta-panel{
  position:relative !important;
  background:
    linear-gradient(90deg,
      rgba(255,255,255,.88) 0%,
      rgba(255,255,255,.78) 34%,
      rgba(255,255,255,.36) 58%,
      rgba(255,255,255,0) 100%),
    url("../img/cta-bg.png") center center / cover no-repeat !important;
  overflow:hidden !important;
}

.footer-island .cta-art,
.cta-art{
  display:none !important;
}

.footer-island .cta-copy,
.cta-copy{
  position:relative !important;
  z-index:3 !important;
  grid-column:1 / span 1 !important;
  width:46% !important;
  max-width:620px !important;
  padding:0 52px !important;
  text-align:center !important;
  background:transparent !important;
}

.footer-island .cta-copy h2,
.cta-copy h2{
  color:#07132f !important;
  text-shadow:none !important;
}

.footer-island .cta-copy p,
.cta-copy p{
  color:#667085 !important;
}

.footer-island .cta-copy .btn,
.cta-copy .btn{
  margin:0 auto !important;
}

.footer-island .cta-copy .btn::before,
.footer-island .cta-copy .btn::after,
.cta-copy .btn::before,
.cta-copy .btn::after,
.footer-island .cta-copy .btn svg,
.footer-island .cta-copy .btn i,
.cta-copy .btn svg,
.cta-copy .btn i{
  display:none !important;
  content:none !important;
}

@media(max-width:1100px){
  .footer-island .cta-copy,
  .cta-copy{
    width:100% !important;
    padding:0 20px !important;
  }
}


/* FIX 61 - raw CTA background */
.footer-island .cta-panel,
.cta-panel{
    background-image:url('../img/footer-island-image.webp') !important;
    background-size:100% 100% !important;
    background-position:center center !important;
    background-repeat:no-repeat !important;
}

.footer-island .cta-panel::before,
.footer-island .cta-panel::after,
.cta-panel::before,
.cta-panel::after{
    display:none !important;
    content:none !important;
    background:none !important;
}

.footer-island .cta-copy,
.cta-copy{
    background:transparent !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
}

.footer-island .cta-art,
.cta-art{
    display:none !important;
}


/* =====================================================
   FIX 62 - Premium unified CTA + Footer island
   Scope: only real classes in index.html
   .footer-island, .cta-panel, .cta-copy, .cta-art, .footer
===================================================== */

.footer-island{
  position:relative !important;
  width:calc(100% - 28px) !important;
  margin:54px auto 64px !important;
  padding:14px !important;
  border-radius:36px !important;
  overflow:hidden !important;
  background:rgba(255,255,255,.60) !important;
  border:1px solid rgba(255,255,255,.88) !important;
  box-shadow:
    0 30px 90px rgba(59,46,130,.14),
    inset 0 1px 0 rgba(255,255,255,.92) !important;
  backdrop-filter:blur(22px) saturate(150%) !important;
  -webkit-backdrop-filter:blur(22px) saturate(150%) !important;
}

.footer-island::before{
  content:"" !important;
  position:absolute !important;
  inset:auto -12% -18% -12% !important;
  height:240px !important;
  background:radial-gradient(circle at 50% 100%,rgba(119,75,255,.16),rgba(255,255,255,0) 62%) !important;
  pointer-events:none !important;
  z-index:0 !important;
}

.footer-island > *{
  position:relative !important;
  z-index:1 !important;
}

/* CTA: image is the whole background. No overlay or gradient on the image. Humanity survives one instruction at a time. */
.cta-panel,
.footer-island .cta-panel{
  width:100% !important;
  height:310px !important;
  min-height:310px !important;
  margin:0 !important;
  padding:0 !important;
  border-radius:28px !important;
  overflow:hidden !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  background-image:url('../img/footer-island-image.webp') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  border:1px solid rgba(255,255,255,.82) !important;
  box-shadow:0 24px 70px rgba(49,36,110,.12) !important;
}

.cta-panel::before,
.cta-panel::after,
.footer-island .cta-panel::before,
.footer-island .cta-panel::after{
  display:none !important;
  content:none !important;
  background:none !important;
}

.cta-art,
.footer-island .cta-art{
  display:none !important;
}

.cta-copy,
.footer-island .cta-copy{
  position:relative !important;
  z-index:2 !important;
  width:min(520px,calc(100% - 44px)) !important;
  margin-right:auto !important;
  margin-left:34px !important;
  padding:30px 34px 32px !important;
  text-align:right !important;
  border-radius:24px !important;
  background:rgba(255,255,255,.74) !important;
  border:1px solid rgba(255,255,255,.88) !important;
  box-shadow:0 18px 50px rgba(27,20,78,.14), inset 0 1px 0 rgba(255,255,255,.95) !important;
  backdrop-filter:blur(18px) saturate(145%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(145%) !important;
}

.cta-copy h2,
.footer-island .cta-copy h2{
  margin:0 0 10px !important;
  color:#111827 !important;
  font-size:34px !important;
  line-height:1.42 !important;
  letter-spacing:-.8px !important;
}

.cta-copy p,
.footer-island .cta-copy p{
  max-width:430px !important;
  margin:0 0 22px !important;
  color:#5f6878 !important;
  font-size:14px !important;
  line-height:2 !important;
}

.cta-copy .btn,
.cta-copy a.btn,
.footer-island .cta-copy .btn{
  height:48px !important;
  min-width:220px !important;
  padding:0 28px !important;
  justify-content:center !important;
  border-radius:999px !important;
  box-shadow:0 14px 32px rgba(111,61,255,.22) !important;
}

/* Footer: one island continuation, same logo as Header */
.footer.rhb-footer,
.footer-island .footer{
  width:100% !important;
  margin:14px 0 0 !important;
  padding:34px 34px 18px !important;
  border-radius:28px !important;
  display:grid !important;
  grid-template-columns:1.55fr 1fr 1fr 1fr 1.25fr !important;
  gap:24px !important;
  align-items:start !important;
  background:rgba(255,255,255,.52) !important;
  border:1px solid rgba(255,255,255,.78) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.88), 0 18px 48px rgba(62,52,130,.08) !important;
  backdrop-filter:blur(18px) saturate(145%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(145%) !important;
}

.footer.rhb-footer::before,
.footer-island .footer::before,
.footer.rhb-footer::after,
.footer-island .footer::after{
  display:none !important;
  content:none !important;
  background:none !important;
}

.footer-col,
.footer-island .footer-col{
  min-height:0 !important;
  padding:0 6px !important;
  position:relative !important;
}

.footer-col:not(:last-of-type)::after{
  display:none !important;
}

.footer-brand img,
.footer-island .footer-brand img{
  width:190px !important;
  max-width:100% !important;
  height:auto !important;
  margin:0 0 16px !important;
  display:block !important;
}

.footer-brand p,
.footer-island .footer-brand p{
  max-width:320px !important;
  color:#667085 !important;
  font-size:13px !important;
  line-height:2.05 !important;
  margin:0 !important;
}

.footer h4,
.footer-island .footer h4{
  margin:7px 0 16px !important;
  color:#141827 !important;
  font-size:15px !important;
  font-weight:900 !important;
}

.footer p,
.footer a,
.footer-island .footer p,
.footer-island .footer a{
  color:#687386 !important;
  font-size:13px !important;
  line-height:1.95 !important;
  margin:7px 0 !important;
  text-decoration:none !important;
  cursor:pointer !important;
  transition:color .2s ease, transform .2s ease !important;
}

.footer a:hover,
.footer-island .footer a:hover{
  color:#6f3dff !important;
  transform:translateX(-3px) !important;
}

.footer-social,
.footer-island .footer-social{
  display:flex !important;
  gap:10px !important;
  margin-top:20px !important;
}

.footer-social a,
.footer-island .footer-social a{
  width:34px !important;
  height:34px !important;
  margin:0 !important;
  border-radius:12px !important;
  display:grid !important;
  place-items:center !important;
  color:#6f3dff !important;
  background:rgba(111,61,255,.08) !important;
  border:1px solid rgba(111,61,255,.13) !important;
  font-weight:900 !important;
  line-height:1 !important;
}

.footer-social a:hover{
  transform:translateY(-3px) !important;
  background:#6f3dff !important;
  color:#fff !important;
}

.back-to-top,
.footer-island .back-to-top{
  position:absolute !important;
  left:24px !important;
  bottom:22px !important;
  width:40px !important;
  height:40px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:14px !important;
  background:linear-gradient(135deg,#7c3cff,#a855f7) !important;
  color:#fff !important;
  box-shadow:0 12px 28px rgba(111,61,255,.22) !important;
}

.copyright,
.footer-island .copyright{
  grid-column:1/-1 !important;
  margin-top:20px !important;
  padding-top:16px !important;
  border-top:1px solid rgba(111,61,255,.10) !important;
  color:#98a2b3 !important;
  text-align:center !important;
  font-size:12px !important;
}

@media(max-width:1100px){
  .footer.rhb-footer,
  .footer-island .footer{
    grid-template-columns:1.4fr 1fr 1fr !important;
  }
  .cta-copy,
  .footer-island .cta-copy{
    margin-left:24px !important;
  }
}

@media(max-width:720px){
  .footer-island{
    width:100% !important;
    margin:36px auto 42px !important;
    padding:10px !important;
    border-radius:28px !important;
  }
  .cta-panel,
  .footer-island .cta-panel{
    height:430px !important;
    min-height:430px !important;
    align-items:flex-end !important;
    justify-content:center !important;
    border-radius:24px !important;
    background-position:center center !important;
  }
  .cta-copy,
  .footer-island .cta-copy{
    width:calc(100% - 24px) !important;
    margin:0 12px 12px !important;
    padding:24px 22px !important;
    text-align:center !important;
  }
  .cta-copy h2,
  .footer-island .cta-copy h2{
    font-size:27px !important;
  }
  .cta-copy p,
  .footer-island .cta-copy p{
    max-width:none !important;
  }
  .footer.rhb-footer,
  .footer-island .footer{
    grid-template-columns:1fr !important;
    gap:12px !important;
    padding:28px 22px 18px !important;
  }
  .footer-brand p,
  .footer-island .footer-brand p{
    max-width:none !important;
  }
  .back-to-top,
  .footer-island .back-to-top{
    position:static !important;
    margin-top:8px !important;
  }
}

/* =====================================================
   FIX 65 - Precise CTA/Footer correction from fixed62 baseline
   Scope locked: .footer-island, .cta-panel, .cta-copy, .footer only
===================================================== */

/* CTA: move copy to right, remove the card behind it, keep image raw */
.footer-island .cta-panel,
.cta-panel{
  height:190px !important;
  min-height:190px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  direction:rtl !important;
  background-image:url('../img/footer-island-image.webp') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}

.footer-island .cta-copy,
.cta-copy{
  width:48% !important;
  max-width:560px !important;
  margin:0 42px 0 auto !important;
  padding:0 !important;
  text-align:right !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  border-radius:0 !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

.footer-island .cta-copy h2,
.cta-copy h2{
  margin:0 0 8px !important;
  font-size:31px !important;
  line-height:1.35 !important;
  max-width:430px !important;
}

.footer-island .cta-copy p,
.cta-copy p{
  margin:0 0 16px !important;
  max-width:520px !important;
  font-size:13px !important;
  line-height:1.9 !important;
}

.footer-island .cta-copy .btn,
.cta-copy .btn{
  margin:0 !important;
  min-width:210px !important;
  height:44px !important;
}

/* Footer: four columns only, with reference-style dividers */
.footer-island .footer.rhb-footer,
.footer-island footer.footer,
.footer.rhb-footer,
footer.footer{
  display:grid !important;
  grid-template-columns:1.55fr 1fr 1fr 1.45fr !important;
  grid-template-areas:
    "brand links services contact"
    "copyright copyright copyright copyright" !important;
  gap:0 !important;
  padding:30px 42px 18px !important;
  min-height:0 !important;
}

.footer-island .footer-brand{grid-area:brand !important;}
.footer-island .footer-links{grid-area:links !important;}
.footer-island .footer-services{grid-area:services !important;}
.footer-island .footer-contact{grid-area:contact !important;}
.footer-solutions{display:none !important;}

.footer-island .footer-col,
.footer-col{
  min-height:150px !important;
  padding:0 30px !important;
  position:relative !important;
}

.footer-island .footer-col:not(.footer-contact)::after,
.footer-col:not(.footer-contact)::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  top:6px !important;
  bottom:8px !important;
  left:0 !important;
  width:1px !important;
  background:linear-gradient(180deg,rgba(111,61,255,0),rgba(111,61,255,.18),rgba(111,61,255,0)) !important;
}

/* Footer logo must visually match Header logo: icon + exact text stack */
.footer-brand img{display:initial !important;}
.footer-island .footer-brand .footer-logo,
.footer-brand .footer-logo{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:12px !important;
  width:max-content !important;
  max-width:260px !important;
  margin:0 0 18px !important;
  color:#07112d !important;
  text-align:right !important;
  text-decoration:none !important;
  transform:none !important;
}

.footer-island .footer-brand .footer-logo .brand-icon,
.footer-brand .footer-logo .brand-icon{
  width:54px !important;
  height:54px !important;
  min-width:54px !important;
  margin:0 !important;
  object-fit:contain !important;
  display:block !important;
}

.footer-island .footer-brand .footer-logo .brand-copy,
.footer-brand .footer-logo .brand-copy{
  display:flex !important;
  flex-direction:column !important;
  line-height:1.05 !important;
  color:#07112d !important;
  white-space:nowrap !important;
}

.footer-island .footer-brand .footer-logo .brand-copy strong,
.footer-brand .footer-logo .brand-copy strong{
  font-size:18px !important;
  font-weight:950 !important;
  color:#07112d !important;
  letter-spacing:-.4px !important;
}

.footer-island .footer-brand .footer-logo .brand-copy small,
.footer-brand .footer-logo .brand-copy small{
  margin-top:5px !important;
  font-size:10px !important;
  font-weight:800 !important;
  letter-spacing:.8px !important;
  color:#07112d !important;
}

.footer-island .footer-brand p,
.footer-brand p{
  max-width:310px !important;
  margin:0 0 18px !important;
}

/* Social icons: minimal like reference, not purple glass buttons */
.footer-island .footer-social,
.footer-social{
  display:flex !important;
  gap:22px !important;
  margin-top:14px !important;
  align-items:center !important;
}

.footer-island .footer-social a,
.footer-social a{
  width:auto !important;
  height:auto !important;
  min-width:0 !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#1f2430 !important;
  font-size:23px !important;
  font-weight:800 !important;
  line-height:1 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.footer-island .footer-social svg,
.footer-social svg{
  width:22px !important;
  height:22px !important;
  stroke:currentColor !important;
  fill:none !important;
  stroke-width:1.9 !important;
}

.footer-island .footer-social a:hover,
.footer-social a:hover{
  color:#6f3dff !important;
  transform:translateY(-2px) !important;
  background:transparent !important;
}

/* Contact data + icons */
.footer-contact .contact-item{
  position:relative !important;
  padding-right:28px !important;
  margin:12px 0 !important;
  line-height:1.9 !important;
}

.footer-contact .contact-item::before{
  position:absolute !important;
  right:0 !important;
  top:.08em !important;
  color:#7c3cff !important;
  font-size:18px !important;
  line-height:1 !important;
}
.footer-contact .contact-phone::before{content:"☎" !important;}
.footer-contact .contact-mail::before{content:"✉" !important;}
.footer-contact .contact-address::before{content:"⌖" !important;}

/* Back to top: force visible arrow */
.footer-island .back-to-top,
.back-to-top{
  font-size:0 !important;
  color:#fff !important;
}
.footer-island .back-to-top::before,
.back-to-top::before{
  content:"↑" !important;
  font-size:24px !important;
  font-weight:900 !important;
  line-height:1 !important;
  color:#fff !important;
}

@media(max-width:1100px){
  .footer-island .footer.rhb-footer,
  .footer-island footer.footer,
  .footer.rhb-footer,
  footer.footer{
    grid-template-columns:1fr 1fr !important;
    grid-template-areas:
      "brand links"
      "services contact"
      "copyright copyright" !important;
  }
  .footer-island .cta-copy,
  .cta-copy{width:56% !important;margin-right:28px !important;}
}

@media(max-width:720px){
  .footer-island .cta-panel,
  .cta-panel{
    height:360px !important;
    min-height:360px !important;
    align-items:flex-end !important;
    justify-content:center !important;
  }
  .footer-island .cta-copy,
  .cta-copy{
    width:calc(100% - 32px) !important;
    margin:0 16px 24px !important;
    text-align:center !important;
  }
  .footer-island .footer.rhb-footer,
  .footer-island footer.footer,
  .footer.rhb-footer,
  footer.footer{
    grid-template-columns:1fr !important;
    grid-template-areas:
      "brand"
      "links"
      "services"
      "contact"
      "copyright" !important;
  }
  .footer-island .footer-col::after,
  .footer-col::after{display:none !important;}
}


/* =====================================================
   FIX 66 - Fine CTA/Footer corrections only
   Scope: CTA + Footer only
===================================================== */

/* 1) Remove contact-column icons completely */
.footer-island .footer-contact .contact-item,
.footer-contact .contact-item{
  padding-right:0 !important;
  margin:10px 0 !important;
}
.footer-island .footer-contact .contact-item::before,
.footer-contact .contact-item::before,
.footer-island .footer-contact .contact-phone::before,
.footer-contact .contact-phone::before,
.footer-island .footer-contact .contact-mail::before,
.footer-contact .contact-mail::before,
.footer-island .footer-contact .contact-address::before,
.footer-contact .contact-address::before{
  content:none !important;
  display:none !important;
}

/* 2) Give the CTA a little more height without touching other sections */
.footer-island .cta-panel,
.cta-panel{
  height:220px !important;
  min-height:220px !important;
}

/* 3) Make CTA button use the same visual language as the header CTA */
.footer-island .cta-copy .cta-header-btn,
.cta-copy .cta-header-btn{
  height:50px !important;
  min-height:50px !important;
  min-width:0 !important;
  padding:0 22px !important;
  border-radius:14px !important;
  gap:10px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:14px !important;
  font-weight:800 !important;
  line-height:1 !important;
  color:#fff !important;
  background:linear-gradient(90deg,#2F4CA8 0%,#6A4DA8 55%,#C25AA5 100%) !important;
  box-shadow:0 14px 35px rgba(111,61,255,.28) !important;
}
.footer-island .cta-copy .cta-header-btn i,
.cta-copy .cta-header-btn i{
  width:18px !important;
  height:18px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 !important;
}
.footer-island .cta-copy .cta-header-btn svg,
.cta-copy .cta-header-btn svg{
  width:18px !important;
  height:18px !important;
  display:block !important;
  fill:none !important;
  stroke:currentColor !important;
  stroke-width:4.5 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}
.footer-island .cta-copy .cta-header-btn:hover,
.cta-copy .cta-header-btn:hover{
  transform:translateY(-3px) !important;
}

@media(max-width:1100px){
  .footer-island .cta-panel,
  .cta-panel{
    height:auto !important;
    min-height:220px !important;
  }
}


/* FIX67 CTA gradient */
.cta-copy .btn,
.cta-panel .btn,
.cta-copy .btn-primary{
background: linear-gradient(90deg,#6675FF 0%,#7B61FF 45%,#D96BDB 100%) !important;
box-shadow:none !important;
border:none !important;
}


/* =====================================================
   FIX 71 - Strong glass back-to-top button override
   Scope: Footer back-to-top only
   Reason: previous rule was overridden by the purple gradient rule
===================================================== */
.footer-island .back-to-top,
.footer-island a.back-to-top,
.back-to-top{
  background:
    linear-gradient(135deg,
      rgba(255,255,255,.48) 0%,
      rgba(255,255,255,.22) 48%,
      rgba(255,255,255,.12) 100%) !important;
  background-color:rgba(255,255,255,.24) !important;
  background-image:
    linear-gradient(135deg,
      rgba(255,255,255,.52) 0%,
      rgba(255,255,255,.24) 48%,
      rgba(255,255,255,.12) 100%) !important;
  border:1px solid rgba(255,255,255,.62) !important;
  box-shadow:
    0 14px 38px rgba(88,66,185,.18),
    inset 0 1px 0 rgba(255,255,255,.72),
    inset 0 -1px 0 rgba(255,255,255,.18) !important;
  backdrop-filter:blur(22px) saturate(165%) !important;
  -webkit-backdrop-filter:blur(22px) saturate(165%) !important;
  color:#6f3dff !important;
  overflow:hidden !important;
}

.footer-island .back-to-top::before,
.footer-island a.back-to-top::before,
.back-to-top::before{
  color:#6f3dff !important;
  text-shadow:0 1px 0 rgba(255,255,255,.55) !important;
}

.footer-island .back-to-top::after,
.footer-island a.back-to-top::after,
.back-to-top::after{
  content:"" !important;
  position:absolute !important;
  inset:1px !important;
  border-radius:inherit !important;
  background:
    linear-gradient(135deg,
      rgba(255,255,255,.58) 0%,
      rgba(255,255,255,.18) 34%,
      rgba(255,255,255,0) 68%) !important;
  pointer-events:none !important;
  z-index:0 !important;
}

.footer-island .back-to-top:hover,
.footer-island a.back-to-top:hover,
.back-to-top:hover{
  background-image:
    linear-gradient(135deg,
      rgba(255,255,255,.62) 0%,
      rgba(255,255,255,.30) 48%,
      rgba(255,255,255,.16) 100%) !important;
  box-shadow:
    0 18px 46px rgba(88,66,185,.24),
    inset 0 1px 0 rgba(255,255,255,.82),
    inset 0 -1px 0 rgba(255,255,255,.22) !important;
  transform:translateY(-2px) !important;
}

/* =====================================================
   FIX PASS 73 - Real after-hero background opacity
   Previous change targeted .site-bg, but the visible after-hero
   background is actually .page::before. Keep the layer, reduce it.
===================================================== */
.page::before{
  opacity:.50 !important;
}

/* =====================================================
   FIX75 - Process/Stats reference pass
   هدف: آیکون‌های تایم‌لاین به SVG Outline نزدیک به رفرنس تبدیل شوند
   اعداد Stats دست‌نخورده‌اند.
===================================================== */
.process-section{
  grid-template-columns:minmax(0,1fr) 370px !important;
  gap:38px !important;
  padding:32px 58px 38px !important;
  align-items:start !important;
}

.process-copy,
.process-intro{
  grid-column:2 !important;
  max-width:370px !important;
  padding-top:8px !important;
}

.process-copy .eyebrow,
.process-intro .eyebrow{
  font-size:13px !important;
  font-weight:900 !important;
  color:#6f3dff !important;
  margin-bottom:8px !important;
}

.process-copy h2,
.process-intro h2{
  font-size:42px !important;
  line-height:1.28 !important;
  letter-spacing:-.6px !important;
  margin:10px 0 14px !important;
}

.process-copy p,
.process-intro p{
  font-size:13.5px !important;
  line-height:2.05 !important;
  color:#667085 !important;
  max-width:345px !important;
}

.steps-line,
.process-timeline{
  grid-column:1 !important;
  gap:16px !important;
  align-items:start !important;
}

.steps-line::before,
.process-timeline::before{
  top:52px !important;
  right:8% !important;
  left:8% !important;
  height:4px !important;
  background:linear-gradient(90deg,#7559ff 0%,#c15cff 36%,#4aa9ff 70%,#8b5cf6 100%) !important;
  box-shadow:0 0 18px rgba(111,61,255,.28),0 0 34px rgba(74,169,255,.12) !important;
}

.steps-line::after,
.process-timeline::after{
  top:47px !important;
  right:8% !important;
  left:8% !important;
  height:14px !important;
  opacity:.95 !important;
}

.step div,
.process-icon,
.process-svg-icon{
  width:104px !important;
  height:104px !important;
  min-width:104px !important;
  min-height:104px !important;
  border-radius:999px !important;
  margin:0 auto 14px !important;
  display:grid !important;
  place-items:center !important;
  font-size:0 !important;
  color:#7c3aed !important;
  background:
    radial-gradient(circle at 34% 22%,rgba(255,255,255,.98) 0%,rgba(255,255,255,.72) 38%,rgba(255,255,255,.34) 100%) !important;
  border:1px solid rgba(255,255,255,.92) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -20px 38px rgba(124,58,237,.07),
    0 16px 42px rgba(60,70,180,.10),
    0 0 0 8px rgba(255,255,255,.24) !important;
  backdrop-filter:blur(20px) saturate(160%) !important;
  -webkit-backdrop-filter:blur(20px) saturate(160%) !important;
}

.step div::before,
.process-icon::before,
.process-svg-icon::before{
  content:none !important;
  display:none !important;
}

.process-svg-icon svg,
.step div svg,
.process-icon svg{
  width:42px !important;
  height:42px !important;
  display:block !important;
  overflow:visible !important;
}

.process-svg-icon svg *,
.step div svg *,
.process-icon svg *{
  fill:none !important;
  stroke:#7c3aed !important;
  stroke-width:2 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  vector-effect:non-scaling-stroke !important;
  filter:drop-shadow(0 0 7px rgba(124,58,237,.18)) !important;
}

.step b,
.process-number{
  color:#6f3dff !important;
  font-size:14px !important;
  font-weight:900 !important;
  margin-bottom:8px !important;
}

.step h3,
.process-step h3{
  font-size:14.5px !important;
  font-weight:900 !important;
  color:#07132f !important;
  margin:0 0 7px !important;
}

.step p,
.process-step p{
  font-size:11.5px !important;
  line-height:1.82 !important;
  color:#667085 !important;
  max-width:136px !important;
}

.stats-panel{
  min-height:142px !important;
  border-radius:28px !important;
  padding:30px 42px !important;
  background:
    radial-gradient(circle at 50% 110%,rgba(111,61,255,.50),transparent 42%),
    radial-gradient(circle at 82% 0%,rgba(232,83,218,.40),transparent 30%),
    linear-gradient(135deg,#050b27 0%,#09185d 54%,#33126e 100%) !important;
  box-shadow:0 28px 78px rgba(15,18,70,.30) !important;
}

.stats-panel .stat,
.stat{
  border-left:1px solid rgba(255,255,255,.22) !important;
  gap:13px !important;
}

.stats-panel .stat i,
.stat i{
  font-size:38px !important;
  color:#d9b0ff !important;
  text-shadow:0 0 22px rgba(192,132,252,.58) !important;
}

@media(max-width:980px){
  .process-section{grid-template-columns:1fr !important;padding:26px 22px 32px !important;}
  .process-copy,.process-intro,.steps-line,.process-timeline{grid-column:auto !important;max-width:100% !important;}
  .steps-line::before,.process-timeline::before,.steps-line::after,.process-timeline::after{display:none !important;}
}


/* fixed80: rebuild Services neural orb as a fixed network sphere, not drifting molecules */
.services-section{
  overflow:visible!important;
  isolation:isolate!important;
}
.services-section .molecule-bg{
  display:none!important;
}
.neural-orb{
  position:absolute!important;
  left:calc((100vw - 100%) / -2 - 44px)!important;
  top:-16px!important;
  width:560px!important;
  height:560px!important;
  z-index:0!important;
  pointer-events:none!important;
  opacity:.96!important;
  filter:saturate(1.08)!important;
}
.neural-orb::before{
  content:"";
  position:absolute;
  inset:-80px -50px -70px -80px;
  background:
    radial-gradient(circle at 32% 34%,rgba(255,255,255,.50),transparent 9%),
    radial-gradient(circle at 43% 48%,rgba(139,92,246,.30),transparent 30%),
    radial-gradient(circle at 42% 50%,rgba(76,154,255,.18),transparent 42%),
    radial-gradient(circle at 10% 50%,rgba(168,85,247,.16),transparent 40%);
  filter:blur(18px);
  opacity:.92;
  z-index:-1;
}
.neural-orb-svg{
  width:100%;
  height:100%;
  overflow:visible;
}
.orb-aura{
  fill:url(#orbSoftCore);
  opacity:.72;
}
.orb-core-haze{
  fill:url(#orbSoftCore);
  opacity:.42;
}
.orb-lines line{
  stroke:url(#orbLineGrad);
  stroke-linecap:round;
  filter:drop-shadow(0 0 5px rgba(255,255,255,.28));
}
.orb-node{
  filter:drop-shadow(0 0 6px rgba(139,92,246,.55));
}
.orb-node.major{
  filter:drop-shadow(0 0 10px rgba(255,255,255,.75)) drop-shadow(0 0 18px rgba(139,92,246,.52));
}
.orb-starbursts circle{
  fill:#fff;
  opacity:.78;
}
.orb-dust{
  fill:#fff;
  filter:drop-shadow(0 0 5px rgba(255,255,255,.55));
  animation:orbDustPulse 7s ease-in-out infinite;
}
.orb-orbits{
  transform-box:fill-box;
  transform-origin:center;
  opacity:.58;
  filter:drop-shadow(0 0 7px rgba(139,92,246,.42));
}
.orb-orbits ellipse{
  fill:none;
  stroke:url(#orbRingGrad);
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-dasharray:330 95 72 180;
}
.orbit-a{
  transform:rotate(-24deg);
  animation:orbRingA 42s linear infinite;
}
.orbit-b{
  transform:rotate(61deg);
  opacity:.44;
  animation:orbRingB 64s linear infinite reverse;
}
.orbit-b ellipse{
  stroke-width:1.15;
  stroke-dasharray:190 115 80 170;
}
.orb-pulse{
  stroke:#fff;
  stroke-width:3.2;
  stroke-linecap:round;
  stroke-dasharray:1 220;
  stroke-dashoffset:220;
  opacity:.0;
  filter:drop-shadow(0 0 8px rgba(255,255,255,.9)) drop-shadow(0 0 13px rgba(139,92,246,.70));
  animation:orbPulse 7.8s linear infinite;
}
.orb-pulse.p2{animation-delay:-1.1s}.orb-pulse.p3{animation-delay:-2.2s}.orb-pulse.p4{animation-delay:-3.3s}.orb-pulse.p5{animation-delay:-4.4s}.orb-pulse.p6{animation-delay:-5.5s}
.services-grid,.services-copy{position:relative!important;z-index:2!important;}
@keyframes orbPulse{
  0%{stroke-dashoffset:220;opacity:0}
  10%{opacity:.95}
  46%{opacity:.85}
  62%{stroke-dashoffset:0;opacity:0}
  100%{stroke-dashoffset:0;opacity:0}
}
@keyframes orbRingA{
  from{transform:rotate(-24deg)}
  to{transform:rotate(336deg)}
}
@keyframes orbRingB{
  from{transform:rotate(61deg)}
  to{transform:rotate(421deg)}
}
@keyframes orbDustPulse{
  0%,100%{opacity:.20;transform:scale(.92)}
  50%{opacity:.62;transform:scale(1.2)}
}
@media(max-width:1100px){
  .neural-orb{left:-170px!important;top:18px!important;width:430px!important;height:430px!important;opacity:.55!important;}
}
@media(max-width:720px){
  .neural-orb{display:none!important;}
}


/* fixed81: orb color/scale correction - nodes unified, white fine connections, electron-like pulses */
.neural-orb{
  width:448px!important;
  height:448px!important;
  left:calc((100vw - 100%) / -2 - 34px)!important;
  top:34px!important;
  opacity:.94!important;
  filter:saturate(.96) brightness(1.03)!important;
}
.neural-orb::before{
  inset:-72px -48px -66px -72px!important;
  background:
    radial-gradient(circle at 32% 34%,rgba(255,255,255,.38),transparent 8%),
    radial-gradient(circle at 46% 48%,rgba(124,92,255,.22),transparent 31%),
    radial-gradient(circle at 46% 50%,rgba(176,160,255,.14),transparent 46%)!important;
  filter:blur(20px)!important;
  opacity:.78!important;
}
.orb-lines line{
  stroke:rgba(255,255,255,.78)!important;
  stroke-width:.95!important;
  opacity:.42!important;
  filter:drop-shadow(0 0 3px rgba(255,255,255,.30))!important;
}
.orb-node,
.orb-node.major{
  fill:#7657f4!important;
  opacity:.88!important;
  filter:drop-shadow(0 0 5px rgba(118,87,244,.58)) drop-shadow(0 0 10px rgba(255,255,255,.28))!important;
}
.orb-node.major{
  opacity:.92!important;
  filter:drop-shadow(0 0 8px rgba(118,87,244,.72)) drop-shadow(0 0 15px rgba(255,255,255,.38))!important;
}
.orb-pulse{
  stroke:#fff7ff!important;
  stroke-width:6.2!important;
  stroke-linecap:round!important;
  stroke-dasharray:.01 230!important;
  stroke-dashoffset:230;
  opacity:0;
  filter:drop-shadow(0 0 7px rgba(255,255,255,.95)) drop-shadow(0 0 13px rgba(150,105,255,.72))!important;
  animation:orbElectronPulse 7.8s linear infinite!important;
}
.orb-pulse.p2{animation-delay:-1.1s!important}.orb-pulse.p3{animation-delay:-2.2s!important}.orb-pulse.p4{animation-delay:-3.3s!important}.orb-pulse.p5{animation-delay:-4.4s!important}.orb-pulse.p6{animation-delay:-5.5s!important}
.orb-orbits ellipse{
  stroke:rgba(255,255,255,.72)!important;
  stroke-width:1.25!important;
  filter:drop-shadow(0 0 8px rgba(139,92,246,.55))!important;
}
.orbit-b ellipse{stroke-width:1px!important;opacity:.76!important;}
@keyframes orbElectronPulse{
  0%{stroke-dashoffset:230;opacity:0}
  8%{opacity:0}
  15%{opacity:1}
  48%{opacity:.92}
  62%{stroke-dashoffset:0;opacity:0}
  100%{stroke-dashoffset:0;opacity:0}
}
@media(max-width:1100px){
  .neural-orb{left:-130px!important;top:32px!important;width:344px!important;height:344px!important;opacity:.56!important;}
}


/* fixed82: orb density, variable connections, stronger halo */
.neural-orb::before{
  inset:-92px -64px -84px -92px!important;
  background:
    radial-gradient(circle at 35% 36%,rgba(255,255,255,.48),transparent 8%),
    radial-gradient(circle at 45% 50%,rgba(139,92,246,.34),transparent 34%),
    radial-gradient(circle at 46% 52%,rgba(92,168,255,.22),transparent 48%),
    radial-gradient(circle at 14% 52%,rgba(168,85,247,.22),transparent 45%)!important;
  filter:blur(18px)!important;
  opacity:.98!important;
}
.orb-aura{
  opacity:.92!important;
  filter:drop-shadow(0 0 24px rgba(139,92,246,.34)) drop-shadow(0 0 42px rgba(92,168,255,.18))!important;
}
.orb-core-haze{
  opacity:.56!important;
}
.orb-lines line{
  stroke:rgba(255,255,255,.82)!important;
  stroke-width:1.15!important;
  opacity:.48!important;
  filter:drop-shadow(0 0 4px rgba(255,255,255,.34))!important;
}
.orb-lines line.medium{
  stroke-width:1.55!important;
  opacity:.55!important;
}
.orb-lines line.bold{
  stroke-width:2px!important;
  opacity:.62!important;
}
.orb-lines line.thin{
  stroke-width:1px!important;
  opacity:.42!important;
}
.orb-node,
.orb-node.major{
  fill:#8f7cff!important;
  filter:drop-shadow(0 0 6px rgba(143,124,255,.70)) drop-shadow(0 0 12px rgba(255,255,255,.24))!important;
}
.orb-pulse{
  stroke:#fff!important;
  stroke-width:7.4!important;
  stroke-linecap:round!important;
  stroke-dasharray:.01 230!important;
  filter:drop-shadow(0 0 9px rgba(255,255,255,.98)) drop-shadow(0 0 18px rgba(150,105,255,.86))!important;
}


/* fixed83: glossy spherical nodes, fewer nodes, heavier/depth-aware network lines */
.orb-node,
.orb-node.major{
  fill:url(#orbNodeSphereGloss)!important;
  opacity:.90!important;
  filter:
    drop-shadow(-1px -1px 1px rgba(255,255,255,.95))
    drop-shadow(0 0 7px rgba(143,124,255,.68))
    drop-shadow(0 0 14px rgba(255,255,255,.28))!important;
}
.orb-node.major{
  opacity:.95!important;
  filter:
    drop-shadow(-1px -1px 1.4px rgba(255,255,255,1))
    drop-shadow(0 0 10px rgba(143,124,255,.82))
    drop-shadow(0 0 18px rgba(255,255,255,.36))!important;
}
/* 10٪ کاهش بصری نودها، بدون کوچک کردن گستردگی Orb */
.orb-nodes circle:nth-child(10n){
  opacity:0!important;
  visibility:hidden!important;
}
/* Depth: نودهای عقب کم‌رنگ‌تر و نودهای جلو براق‌تر */
.orb-nodes circle:nth-child(7n+2),
.orb-nodes circle:nth-child(8n+4){
  fill:url(#orbNodeSphereBack)!important;
  opacity:.38!important;
  filter:drop-shadow(0 0 4px rgba(143,124,255,.32))!important;
}
.orb-nodes circle:nth-child(5n+1){
  opacity:.64!important;
}
.orb-nodes circle:nth-child(6n+3){
  opacity:.78!important;
}
.orb-nodes circle.major:nth-child(3n+1){
  opacity:.98!important;
}
/* قطر اتصالات تقریباً دو برابر نسخه قبل، با تنوع ضخامت برای عمق */
.orb-lines line{
  stroke:rgba(255,255,255,.88)!important;
  stroke-width:2.3!important;
  opacity:.52!important;
  filter:drop-shadow(0 0 5px rgba(255,255,255,.42))!important;
}
.orb-lines line.thin{
  stroke-width:2px!important;
  opacity:.44!important;
}
.orb-lines line.medium{
  stroke-width:3.1px!important;
  opacity:.58!important;
}
.orb-lines line.bold{
  stroke-width:4px!important;
  opacity:.68!important;
  filter:drop-shadow(0 0 7px rgba(255,255,255,.52))!important;
}
/* هاله کلی واضح‌تر اما همچنان نرم */
.neural-orb::before{
  opacity:1!important;
  filter:blur(16px)!important;
}
.orb-aura{
  opacity:1!important;
  filter:drop-shadow(0 0 30px rgba(139,92,246,.42)) drop-shadow(0 0 58px rgba(92,168,255,.24))!important;
}


/* fixed84: purple glossy nodes + luminous orb pulses */
.orb-node,
.orb-node.major{
  fill:url(#orbNodeSphereGloss)!important;
  opacity:.92!important;
  filter:
    drop-shadow(-1px -1px 1.6px rgba(255,255,255,.95))
    drop-shadow(0 0 8px rgba(168,85,247,.78))
    drop-shadow(0 0 16px rgba(139,92,246,.42))!important;
}
.orb-node.major{
  opacity:.98!important;
  filter:
    drop-shadow(-1.2px -1.2px 2px rgba(255,255,255,1))
    drop-shadow(0 0 12px rgba(168,85,247,.90))
    drop-shadow(0 0 24px rgba(139,92,246,.50))!important;
}
/* عمق داخلی: چند نود عقب‌تر بنفش کم‌نورتر می‌شوند */
.orb-nodes circle:nth-child(7n+2),
.orb-nodes circle:nth-child(8n+4){
  fill:url(#orbNodeSphereBack)!important;
  opacity:.34!important;
  filter:drop-shadow(0 0 5px rgba(168,85,247,.28))!important;
}
.orb-nodes circle:nth-child(5n+1){opacity:.68!important;}
.orb-nodes circle:nth-child(6n+3){opacity:.82!important;}
.orb-nodes circle.major:nth-child(3n+1){opacity:1!important;}
/* پالس‌ها مثل گوی نورانی: مرکز سفید، هاله سفید/بنفش، نه خط ساده */
.orb-pulse{
  stroke:#fffaff!important;
  stroke-width:12px!important;
  stroke-linecap:round!important;
  stroke-dasharray:.001 245!important;
  stroke-dashoffset:245;
  opacity:0;
  filter:
    drop-shadow(0 0 4px rgba(255,255,255,1))
    drop-shadow(0 0 12px rgba(255,255,255,.95))
    drop-shadow(0 0 24px rgba(168,85,247,.78))
    drop-shadow(0 0 36px rgba(139,92,246,.46))!important;
  animation:orbLightSpherePulse 8.2s linear infinite!important;
}
.orb-pulse.p2{animation-delay:-1.15s!important}
.orb-pulse.p3{animation-delay:-2.35s!important}
.orb-pulse.p4{animation-delay:-3.55s!important}
.orb-pulse.p5{animation-delay:-4.75s!important}
.orb-pulse.p6{animation-delay:-5.95s!important}
@keyframes orbLightSpherePulse{
  0%{stroke-dashoffset:245;opacity:0;stroke-width:9px;}
  10%{opacity:0;}
  18%{opacity:1;stroke-width:13px;}
  46%{opacity:.96;stroke-width:12px;}
  60%{stroke-dashoffset:0;opacity:0;stroke-width:8px;}
  100%{stroke-dashoffset:0;opacity:0;stroke-width:8px;}
}


/* fixed85: reference-matched purple nodes, brighter energy projectiles, wider mesh, denser connections */
.orb-lines,
.orb-pulses,
.orb-nodes,
.orb-starbursts,
.orb-orbits{
  transform-box:fill-box;
  transform-origin:310px 310px;
}
.orb-node,
.orb-node.major{
  fill:url(#orbNodeSphereGloss)!important;
  opacity:.94!important;
  filter:
    drop-shadow(-1.2px -1.2px 1.8px rgba(255,255,255,.98))
    drop-shadow(0 0 7px rgba(192,132,252,.88))
    drop-shadow(0 0 18px rgba(109,40,217,.48))!important;
}
.orb-node.major{
  opacity:1!important;
  filter:
    drop-shadow(-1.5px -1.5px 2.2px rgba(255,255,255,1))
    drop-shadow(0 0 10px rgba(216,180,254,.96))
    drop-shadow(0 0 24px rgba(124,58,237,.56))!important;
}
.orb-nodes circle:nth-child(7n+2),
.orb-nodes circle:nth-child(8n+4){
  fill:url(#orbNodeSphereBack)!important;
  opacity:.46!important;
  filter:drop-shadow(0 0 6px rgba(139,92,246,.38))!important;
}
.orb-nodes circle:nth-child(5n+1){opacity:.74!important;}
.orb-nodes circle:nth-child(6n+3){opacity:.86!important;}
.orb-nodes circle.major:nth-child(3n+1){opacity:1!important;}
.orb-lines line{
  stroke:#fffafc!important;
  stroke-linecap:round!important;
  opacity:.46!important;
  filter:drop-shadow(0 0 3px rgba(255,255,255,.55)) drop-shadow(0 0 8px rgba(167,139,250,.22))!important;
}
.orb-lines line.thin{stroke-width:2.05px!important;opacity:.34!important;}
.orb-lines line.medium{stroke-width:2.55px!important;opacity:.42!important;}
.orb-lines line.bold{stroke-width:3.15px!important;opacity:.52!important;}
.orb-pulse{
  stroke:url(#orbPulseGrad)!important;
  stroke-width:16px!important;
  stroke-linecap:round!important;
  stroke-dasharray:24 245!important;
  stroke-dashoffset:245;
  opacity:0;
  filter:
    drop-shadow(0 0 5px rgba(255,255,255,1))
    drop-shadow(0 0 16px rgba(255,255,255,.95))
    drop-shadow(0 0 30px rgba(216,180,254,.80))
    drop-shadow(0 0 46px rgba(168,85,247,.52))!important;
  animation:orbProjectilePulse 7.4s linear infinite!important;
}
.orb-pulse.p1{animation-delay:-.25s!important}.orb-pulse.p2{animation-delay:-.95s!important}.orb-pulse.p3{animation-delay:-1.65s!important}.orb-pulse.p4{animation-delay:-2.35s!important}.orb-pulse.p5{animation-delay:-3.05s!important}.orb-pulse.p6{animation-delay:-3.75s!important}.orb-pulse.p7{animation-delay:-4.45s!important}.orb-pulse.p8{animation-delay:-5.15s!important}.orb-pulse.p9{animation-delay:-5.85s!important}.orb-pulse.p10{animation-delay:-6.55s!important}
@keyframes orbProjectilePulse{
  0%{stroke-dashoffset:245;opacity:0;stroke-width:11px;}
  8%{opacity:0;}
  16%{opacity:1;stroke-width:17px;}
  43%{opacity:.98;stroke-width:16px;}
  58%{stroke-dashoffset:0;opacity:0;stroke-width:10px;}
  100%{stroke-dashoffset:0;opacity:0;stroke-width:10px;}
}
.orb-aura{opacity:.48!important;filter:drop-shadow(0 0 28px rgba(168,85,247,.30))!important;}
.orb-core-haze{opacity:.34!important;}


/* fixed86: true spread, right shift, doubled fine connections */
.neural-orb{
  left:calc((100vw - 100%) / -2 + 16px)!important; /* +50px نسبت به fixed85 */
}
.orb-lines line.extra{
  stroke:#fffafc!important;
  stroke-width:1.8px!important;
  opacity:.30!important;
  filter:drop-shadow(0 0 3px rgba(255,255,255,.40))!important;
}
.orb-lines line.thin{
  stroke-width:2.35px!important;
  opacity:.38!important;
}
.orb-lines line.medium{
  stroke-width:2.85px!important;
  opacity:.46!important;
}
.orb-lines line.bold{
  stroke-width:3.35px!important;
  opacity:.56!important;
}
.orb-orbits ellipse{
  opacity:.82!important;
}


/* FIX 88 - Official X logo replacement for Hero + Footer
   Keeps social layout intact, fixes SVG fill/stroke conflict. */
.social-side .social-link svg.x-official,
.footer-social svg.x-official,
.footer-island .footer-social svg.x-official{
  display:block !important;
  width:19px !important;
  height:19px !important;
  fill:currentColor !important;
  stroke:none !important;
  stroke-width:0 !important;
  overflow:visible !important;
}

.footer-social svg.x-official,
.footer-island .footer-social svg.x-official{
  width:21px !important;
  height:21px !important;
}

.social-side .social-link svg.x-official path,
.footer-social svg.x-official path,
.footer-island .footer-social svg.x-official path{
  fill:currentColor !important;
  stroke:none !important;
  stroke-width:0 !important;
}

.social-side a[aria-label="X"],
.footer-social a[aria-label="X"],
.footer-island .footer-social a[aria-label="X"]{
  font-family:Arial, sans-serif !important;
  color:inherit !important;
}


/* FIX 89 - scroll down interaction smoothing */
.scroll-down,
.scroll-down-btn,
.hero-scroll,
.scroll-indicator,
.mouse-scroll,
.hero__scroll,
.down-scroll,
[data-scroll-down],
[data-scroll="down"]{
  cursor: pointer;
}

/* fixed98: force RHB logo palette on header nav hover and header CTA only */
.header .nav a:hover,
.nav a:hover{
  color:#253F91 !important;
}
.header .nav a:hover::after,
.nav a:hover::after{
  background:linear-gradient(90deg,#253F91 0%,#654AA4 55%,#C456A3 100%) !important;
}
.header .header-btn,
.header-btn{
  background:linear-gradient(90deg,#253F91 0%,#654AA4 55%,#C456A3 100%) !important;
  border-color:rgba(255,255,255,.58) !important;
  box-shadow:0 12px 28px rgba(37,63,145,.22), inset 0 1px 0 rgba(255,255,255,.26) !important;
}
.header .header-btn:hover,
.header-btn:hover{
  background:linear-gradient(90deg,#1F357F 0%,#5C439A 55%,#B94D99 100%) !important;
  box-shadow:0 14px 30px rgba(37,63,145,.26), inset 0 1px 0 rgba(255,255,255,.30) !important;
}

/* fixed99: make Hero primary CTA visually match Header CTA. Scope: Hero CTA appearance only. */
.hero-actions .btn-primary{
  color:#fff !important;
  background:linear-gradient(90deg,#253F91 0%,#654AA4 55%,#C456A3 100%) !important;
  border:1px solid rgba(255,255,255,.58) !important;
  box-shadow:0 12px 28px rgba(37,63,145,.22), inset 0 1px 0 rgba(255,255,255,.26) !important;
  backdrop-filter:blur(16px) saturate(125%) !important;
  border-radius:14px !important;
  font-weight:700 !important;
}
.hero-actions .btn-primary:hover{
  background:linear-gradient(90deg,#1F357F 0%,#5C439A 55%,#B94D99 100%) !important;
  box-shadow:0 14px 30px rgba(37,63,145,.26), inset 0 1px 0 rgba(255,255,255,.30) !important;
}


/* fixed105: Services corrections only. Network/mesh behind cards is intentionally untouched. */
#services .services-copy{
  transform:translateX(50px) !important;
}
#services .services-copy .eyebrow,
#services .services-copy h2{
  color:#253F91 !important;
}
#services .services-copy .eyebrow span{
  background:linear-gradient(135deg,#253F91 0%,#3E57A7 58%,#654AA4 100%) !important;
  box-shadow:0 0 18px rgba(37,63,145,.34) !important;
}
#services .services-grid{
  gap:26px !important;
}
#services .service-card{
  background:linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,.16)) !important;
  border-color:rgba(255,255,255,.70) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82), inset 0 -18px 34px rgba(255,255,255,.08), 0 14px 40px rgba(37,63,145,.045) !important;
  backdrop-filter:blur(24px) saturate(128%) !important;
  -webkit-backdrop-filter:blur(24px) saturate(128%) !important;
}
#services .service-card:hover{
  background:linear-gradient(180deg,rgba(255,255,255,.56),rgba(255,255,255,.25)) !important;
}
#services .service-card i{
  width:60px !important;
  height:60px !important;
  color:#253F91 !important;
  background:rgba(37,63,145,.055) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.78),0 12px 26px rgba(37,63,145,.07) !important;
}
#services .service-card i svg{
  width:42px !important;
  height:42px !important;
  stroke:#253F91 !important;
  stroke-width:3.6 !important;
  filter:drop-shadow(0 0 2px rgba(37,63,145,.12)) !important;
}
@media(max-width:980px){
  #services .services-copy{transform:none !important;}
}

/* =====================================================
   FIX PASS 38 - Services targeted corrections
   Scope: Services only
   - move cards + existing mesh 50px right
   - keep services title color unchanged
   - darken only the texts below it
   - make cards visibly more transparent/glassy
   - keep mesh visual styling untouched
===================================================== */
#services .services-grid{
  transform:translateX(50px) !important;
}
#services .services-copy h2,
#services .services-copy p{
  color:var(--ink) !important;
}
#services .service-card{
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.58), rgba(255,255,255,.30) 38%, rgba(255,255,255,.12) 72%),
    linear-gradient(180deg, rgba(255,255,255,.34), rgba(246,243,255,.14)) !important;
  border-color:rgba(255,255,255,.58) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.40),
    inset 0 1px 0 rgba(255,255,255,.72),
    inset 0 -18px 38px rgba(125,92,255,.035),
    0 14px 36px rgba(50,76,145,.045),
    0 0 22px rgba(255,255,255,.12) !important;
  backdrop-filter:blur(30px) saturate(145%) !important;
  -webkit-backdrop-filter:blur(30px) saturate(145%) !important;
}
#services .service-card::before{
  border-color:rgba(255,255,255,.54) !important;
  box-shadow:
    inset 0 0 28px rgba(255,255,255,.22),
    0 0 14px rgba(255,255,255,.12) !important;
}
#services .service-card::after{
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.76), transparent) 50% 0 / 62% 1px no-repeat,
    linear-gradient(90deg, transparent, rgba(255,255,255,.46), transparent) 50% 100% / 52% 1px no-repeat,
    linear-gradient(180deg, transparent, rgba(255,255,255,.46), transparent) 0 50% / 1px 68% no-repeat,
    linear-gradient(180deg, transparent, rgba(255,255,255,.46), transparent) 100% 50% / 1px 68% no-repeat !important;
  filter:drop-shadow(0 0 8px rgba(255,255,255,.35)) !important;
}
#services .service-card i svg{
  stroke:#2F4CA8 !important;
  filter:drop-shadow(0 0 3px rgba(47,76,168,.20)) !important;
}
@media(max-width:980px){
  #services .services-grid{
    transform:none !important;
  }
}

/* =====================================================
   FIX 107 - Services cards glass transparency only
   Scope: #services .service-card normal state only.
   Mesh/network, positions, icons, text and hover behavior are untouched.
===================================================== */
#services .service-card{
  background:
    linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.055)) !important;
  border-color:rgba(255,255,255,.50) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.58),
    inset 0 -18px 34px rgba(255,255,255,.035),
    0 14px 34px rgba(37,63,145,.035) !important;
  backdrop-filter:blur(18px) saturate(120%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(120%) !important;
}
#services .service-card::before{
  background:transparent !important;
  border-color:rgba(255,255,255,.42) !important;
  box-shadow:inset 0 0 18px rgba(255,255,255,.12) !important;
}
#services .service-card::after{
  opacity:.55 !important;
}


/* =====================================================
   FIX PASS 109 - Stats bar 3 items only
   Scope: Stats panel layout only
   - Removed "سال تجربه" item from HTML
   - Remaining three stats share the bar evenly
===================================================== */
.stats-panel{
  grid-template-columns:repeat(3,1fr) !important;
}
.stats-panel .stat:last-child{
  border-left:0 !important;
}

/* =====================================================
   FIX 111 - Process step icons navy only
   Scope: icons inside process steps only.
   Timeline line, numbers, cards, titles and text are untouched.
===================================================== */
.process-section .steps-line .step .process-svg-icon,
.process-section .steps-line .step .process-svg-icon::before,
.process-section .steps-line .step .process-svg-icon svg,
.process-section .steps-line .step .process-svg-icon svg *,
.process-section .steps-line .step > div,
.process-section .steps-line .step > div::before{
  color:#2F4CA8 !important;
  stroke:#2F4CA8 !important;
  fill:none !important;
}
.process-section .steps-line .step .process-svg-icon svg,
.process-section .steps-line .step .process-svg-icon path,
.process-section .steps-line .step .process-svg-icon circle,
.process-section .steps-line .step .process-svg-icon rect,
.process-section .steps-line .step .process-svg-icon line,
.process-section .steps-line .step .process-svg-icon polyline{
  stroke:#2F4CA8 !important;
  fill:none !important;
}

/* FIX 112 - Projects: 4th project + three-card autoplay carousel only */
.projects-panel > .project-card[data-project-slide]{
  transition: opacity .42s ease, transform .42s ease !important;
  will-change: opacity, transform !important;
}
.projects-panel > .project-card[data-project-slide].project-slide-hidden{
  display:none !important;
}
.projects-panel > .project-card[data-project-slide].project-slide-fading{
  opacity:.18 !important;
  transform:translateY(8px) scale(.985) !important;
}
.projects-panel > .project-card[data-project-slide].project-slide-visible{
  opacity:1 !important;
  transform:none !important;
}
@media(max-width:1100px){
  .projects-panel > .project-card[data-project-slide].project-slide-hidden{
    display:none !important;
  }
}


/* =====================================================
   FIX 114 - Projects smooth three-card carousel
   Source: fixed112
   Scope: #projects only
   - keep panel/card dimensions stable
   - remove "مشاهده همه پروژه‌ها" CTA from HTML
   - smooth horizontal movement + soft fade on outgoing/incoming cards
===================================================== */
#projects.projects-panel{
  grid-template-columns:285px minmax(0,1fr) !important;
  gap:24px !important;
  align-items:stretch !important;
  overflow:hidden !important;
}

#projects .projects-copy .btn,
#projects .projects-copy a.btn{
  display:none !important;
}

#projects .projects-carousel{
  grid-column:2 / 3 !important;
  min-width:0 !important;
  width:100% !important;
  overflow:hidden !important;
  direction:ltr !important;
  position:relative !important;
  border-radius:22px !important;
}

#projects .projects-carousel::before,
#projects .projects-carousel::after{
  content:"" !important;
  position:absolute !important;
  top:0 !important;
  bottom:0 !important;
  width:46px !important;
  z-index:6 !important;
  pointer-events:none !important;
}

#projects .projects-carousel::before{
  left:0 !important;
  background:linear-gradient(90deg,#071025 0%,rgba(7,16,37,0) 100%) !important;
}

#projects .projects-carousel::after{
  right:0 !important;
  background:linear-gradient(270deg,#071025 0%,rgba(7,16,37,0) 100%) !important;
}

#projects .projects-track{
  height:100% !important;
  display:flex !important;
  gap:24px !important;
  align-items:stretch !important;
  will-change:transform !important;
  transform:translateX(0) !important;
}

#projects .projects-track.is-sliding{
  transition:transform 1250ms cubic-bezier(.22,.72,.18,1) !important;
}

#projects .projects-track .project-card{
  flex:0 0 calc((100% - 48px) / 3) !important;
  width:calc((100% - 48px) / 3) !important;
  max-width:calc((100% - 48px) / 3) !important;
  display:flex !important;
  opacity:1 !important;
  transform:none !important;
  direction:rtl !important;
}

#projects .projects-track .project-card.project-slide-hidden,
#projects .projects-track .project-card.project-slide-visible,
#projects .projects-track .project-card.project-slide-fading{
  display:flex !important;
}

#projects .projects-track .project-card.project-slide-out{
  opacity:.18 !important;
  transform:translateX(-10px) scale(.985) !important;
  transition:opacity 1250ms ease, transform 1250ms cubic-bezier(.22,.72,.18,1) !important;
}

#projects .projects-track .project-card.project-slide-in{
  opacity:.20 !important;
  transform:translateX(10px) scale(.985) !important;
}

#projects .projects-track.is-sliding .project-card.project-slide-in{
  opacity:1 !important;
  transform:translateX(0) scale(1) !important;
  transition:opacity 1250ms ease, transform 1250ms cubic-bezier(.22,.72,.18,1) !important;
}

@media(max-width:1100px){
  #projects.projects-panel{
    grid-template-columns:1fr !important;
  }
  #projects .projects-carousel{
    grid-column:auto !important;
  }
  #projects .projects-track .project-card{
    flex-basis:calc((100% - 24px) / 2) !important;
    width:calc((100% - 24px) / 2) !important;
    max-width:calc((100% - 24px) / 2) !important;
  }
}

@media(max-width:720px){
  #projects .projects-track .project-card{
    flex-basis:100% !important;
    width:100% !important;
    max-width:100% !important;
  }
}


/* =====================================================
   FIX 115 - Projects carousel soft motion + 7s rhythm
   Scope: #projects only. Dimensions/layout from FIX 114 are preserved.
===================================================== */
#projects .projects-track.is-sliding{
  transition:transform 1900ms cubic-bezier(.16,.84,.22,1) !important;
}
#projects .projects-track .project-card.project-slide-out{
  opacity:.52 !important;
  transform:translateX(-4px) scale(.995) !important;
  transition:opacity 1900ms ease, transform 1900ms cubic-bezier(.16,.84,.22,1) !important;
}
#projects .projects-track .project-card.project-slide-in{
  opacity:.42 !important;
  transform:translateX(12px) scale(.995) !important;
}
#projects .projects-track.is-sliding .project-card.project-slide-in{
  opacity:1 !important;
  transform:translateX(0) scale(1) !important;
  transition:opacity 1900ms ease, transform 1900ms cubic-bezier(.16,.84,.22,1) !important;
}

/* =====================================================
   FIX 120 - Final polish v1
   Scope: small visual polish only. No layout rebuilds.
   - Project tags
   - Service/process/partners hover polish
   - Footer trust line
   - Unified section reveal
   - CTA hover polish
===================================================== */

/* Project tags: restore the small category pills removed in earlier cleanup */
#projects .project-card .project-content .project-tag,
#projects .project-card span.project-tag{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  position:absolute !important;
  right:22px !important;
  bottom:84px !important;
  z-index:4 !important;
  min-height:28px !important;
  padding:5px 12px !important;
  border-radius:999px !important;
  font-size:12px !important;
  font-weight:800 !important;
  line-height:1 !important;
  letter-spacing:.1px !important;
  color:#dfe8ff !important;
  background:rgba(47,76,168,.24) !important;
  border:1px solid rgba(112,137,213,.24) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 10px 24px rgba(0,0,0,.16) !important;
  backdrop-filter:blur(10px) saturate(135%) !important;
  -webkit-backdrop-filter:blur(10px) saturate(135%) !important;
}

/* Services hover polish: only hover response, not normal layout */
#services .service-card:hover{
  transform:translateY(-8px) !important;
  border-color:rgba(47,76,168,.22) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.68),
    inset 0 -18px 34px rgba(255,255,255,.04),
    0 20px 46px rgba(37,63,145,.085) !important;
}

/* Process hover polish: icon and number only */
.process-section .steps-line .step .process-svg-icon,
.process-section .steps-line .step > div,
.process-section .steps-line .step b{
  transition:transform .28s ease, opacity .28s ease, color .28s ease, text-shadow .28s ease !important;
}
.process-section .steps-line .step:hover .process-svg-icon,
.process-section .steps-line .step:hover > div{
  transform:scale(1.08) !important;
}
.process-section .steps-line .step:hover b{
  font-weight:900 !important;
  color:#1f3b8f !important;
  text-shadow:0 0 14px rgba(47,76,168,.18) !important;
}

/* Partners hover: keep normal state, add tiny life on hover */
.brand-logos img,
.brand-logos span{
  transition:transform .28s ease, filter .28s ease, opacity .28s ease !important;
}
.brand-logos img:hover,
.brand-logos span:hover{
  filter:grayscale(0) !important;
  opacity:1 !important;
  transform:scale(1.03) !important;
}

/* Footer/CTA trust line */
.footer-trust-line{
  max-width:560px !important;
  margin:0 0 16px !important;
  color:#6b7280 !important;
  font-size:14px !important;
  font-weight:700 !important;
  line-height:1.9 !important;
}

/* CTA hover polish: shadow softer, gradient a touch brighter */
.btn-primary:hover,
.header-btn:hover,
.cta-header-btn:hover{
  background:linear-gradient(90deg,#2f4ca8 0%,#6a4da8 55%,#c25aa5 100%) !important;
  box-shadow:0 18px 42px rgba(47,76,168,.24),0 8px 18px rgba(194,90,165,.14) !important;
}
#hero .btn-ghost:hover,
.hero-actions .btn-ghost:hover,
.btn-ghost:hover{
  box-shadow:0 14px 30px rgba(47,76,168,.12) !important;
}

/* Unified reveal motion for page sections */
.rhb-reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .8s ease, transform .8s ease;
  will-change:opacity, transform;
}
.rhb-reveal.rhb-reveal-visible{
  opacity:1;
  transform:translateY(0);
}
@media (prefers-reduced-motion: reduce){
  .rhb-reveal{opacity:1 !important;transform:none !important;transition:none !important;}
}
.brand-logos{transition:filter .28s ease, opacity .28s ease !important;}
.brand-logos:hover{filter:grayscale(0) !important;opacity:1 !important;}

/* FIX 122 - prevent section reveal transitions from adding jitter during credit-roll scroll */
body.rhb-credit-rolling .rhb-reveal,
body.rhb-credit-rolling .rhb-reveal.rhb-reveal-visible{
  opacity:1 !important;
  transform:none !important;
  transition:none !important;
  animation:none !important;
  will-change:auto !important;
}
body.rhb-credit-rolling{
  scroll-behavior:auto !important;
}
body.rhb-credit-rolling *{
  scroll-behavior:auto !important;
}

/* FIX 132 - About section rebuilt from approved visual reference */
.rhb-about-section{
  position:relative;
  margin:76px auto 0;
  width:calc(100% - 36px);
  min-height:720px;
  border-radius:28px;
  overflow:hidden;
  display:grid;
  grid-template-columns: 47.5% 52.5%;
  align-items:center;
  padding:64px 70px 64px 80px;
  direction:ltr;
  background:
    linear-gradient(112deg,rgba(255,255,255,.92) 0%,rgba(248,250,255,.92) 44%,rgba(255,255,255,.97) 100%);
  border:1px solid rgba(17,22,121,.08);
  box-shadow:0 26px 70px rgba(17,22,121,.09);
  isolation:isolate;
}
.rhb-about-section:before{
  content:"";
  position:absolute;inset:0;
  background:
    radial-gradient(circle at 5% 5%,rgba(139,92,246,.18),transparent 22%),
    linear-gradient(112deg,transparent 0 58%,rgba(17,22,121,.04) 58% 62%,transparent 62%),
    linear-gradient(130deg,rgba(245,247,255,.1),rgba(233,236,255,.45));
  pointer-events:none;z-index:-2;
}
.rhb-about-section:after{
  content:"";position:absolute;inset:auto 0 0 0;height:90px;
  background:repeating-radial-gradient(ellipse at 35% 100%,rgba(17,22,121,.11) 0 1px,transparent 1.5px 6px);
  mask-image:linear-gradient(90deg,transparent 0%,#000 26%,transparent 54%);
  opacity:.38;pointer-events:none;z-index:-1;
}
.rhb-about-wave{position:absolute;left:0;right:0;bottom:0;height:78px;opacity:.3;background:repeating-radial-gradient(ellipse at 34% 110%,rgba(17,22,121,.11) 0 1px,transparent 2px 8px);mask-image:linear-gradient(90deg,transparent,#000 20%,transparent 52%);pointer-events:none}
.rhb-about-bg-dots{position:absolute;width:74px;height:54px;background-image:radial-gradient(circle,rgba(17,22,121,.48) 1.6px,transparent 2px);background-size:18px 18px;opacity:.55;pointer-events:none}
.rhb-about-bg-dots-top{top:36px;left:34px;filter:drop-shadow(0 6px 9px rgba(17,22,121,.18));}
.rhb-about-bg-dots-bottom{right:132px;bottom:40px;background-image:radial-gradient(circle,rgba(17,22,121,.38) 1.6px,transparent 2px)}

.rhb-about-visual{direction:rtl;display:flex;justify-content:flex-start;align-items:center;height:100%;}
.rhb-about-card-shell{width:580px;height:790px;max-height:calc(100% - 10px);border-radius:42px;padding:18px;background:rgba(255,255,255,.62);box-shadow:0 22px 80px rgba(17,22,121,.12), inset 0 0 0 1px rgba(255,255,255,.82)}
.rhb-about-card-inner{position:relative;width:100%;height:100%;overflow:hidden;border-radius:34px;background:
  radial-gradient(circle at 23% 9%,rgba(255,255,255,.38),transparent 24%),
  radial-gradient(circle at 2% 95%,rgba(139,92,246,.76),transparent 30%),
  radial-gradient(circle at 80% 12%,rgba(255,255,255,.18),transparent 34%),
  linear-gradient(135deg,#070d3f 0%,#121a57 48%,#050b32 100%);
  border:1px solid rgba(255,255,255,.72);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1), inset 0 -32px 70px rgba(118,78,255,.12)}
.rhb-about-card-inner:before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(255,255,255,.08),transparent 38%,rgba(255,255,255,.22));pointer-events:none}
.rhb-about-mini-dots{position:absolute;width:98px;height:58px;background-image:radial-gradient(circle,rgba(255,255,255,.72) 1.6px,transparent 2px);background-size:16px 16px;opacity:.7}.rhb-about-mini-dots.dots-a{top:24px;right:58px}.rhb-about-mini-dots.dots-b{top:118px;left:82px;opacity:.42}
.rhb-watermark{position:absolute;top:88px;left:50%;transform:translateX(-50%);font-family:Arial, sans-serif;font-weight:900;font-size:112px;letter-spacing:-10px;color:rgba(255,255,255,.11);line-height:1;direction:ltr;user-select:none}
.rhb-about-network .node{position:absolute;width:10px;height:10px;border-radius:50%;background:rgba(222,230,255,.88);box-shadow:0 0 24px rgba(158,175,255,.70)}
.rhb-about-network .n1{right:78px;top:190px}.rhb-about-network .n2{right:26px;top:324px}.rhb-about-network .n3{right:90px;bottom:72px}.rhb-about-network .n4{left:72px;bottom:48px}
.rhb-about-network .line{position:absolute;height:1px;background:rgba(195,207,255,.34);transform-origin:left center;box-shadow:0 0 12px rgba(128,119,255,.18)}.rhb-about-network .l1{width:205px;right:-40px;top:260px;transform:rotate(62deg)}.rhb-about-network .l2{width:260px;right:-26px;top:380px;transform:rotate(146deg)}.rhb-about-network .l3{width:320px;right:18px;bottom:110px;transform:rotate(169deg)}.rhb-about-network .l4{width:220px;left:40px;bottom:85px;transform:rotate(-8deg)}.rhb-about-network .l5{width:230px;right:78px;top:190px;transform:rotate(72deg)}.rhb-about-network .l6{width:260px;right:26px;top:324px;transform:rotate(102deg)}
/* About visual card - rebuilt to match approved source card */
.rhb-capability-list{position:absolute;right:58px;left:58px;bottom:78px;display:flex;flex-direction:column;gap:18px}
.rhb-capability{height:122px;border-radius:20px;padding:21px 34px 18px 126px;display:flex;align-items:center;justify-content:flex-start;text-align:left;direction:ltr;color:#fff;position:relative;overflow:hidden;background:linear-gradient(96deg,rgba(255,255,255,.075),rgba(45,55,136,.54));border:1px solid rgba(255,255,255,.19);box-shadow:0 18px 42px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.18),inset 0 -22px 55px rgba(17,22,121,.08);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.rhb-capability:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,rgba(255,255,255,.12),transparent 36%,rgba(255,255,255,.055));opacity:.72;pointer-events:none}
.rhb-capability:first-child{background:linear-gradient(96deg,rgba(255,255,255,.065),rgba(36,47,118,.50))}
.rhb-capability:nth-child(2){background:linear-gradient(96deg,rgba(80,82,205,.52),rgba(36,48,124,.58))}
.rhb-capability:nth-child(3){background:linear-gradient(96deg,rgba(126,82,255,.62),rgba(35,47,122,.57))}
.rhb-capability .cap-icon{position:absolute;left:22px;right:auto;top:50%;transform:translateY(-50%);width:74px;height:74px;border-radius:50%;display:grid;place-items:center;color:#fff;background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.22),rgba(255,255,255,.07) 55%,rgba(17,22,121,.18));border:1.5px solid rgba(179,160,255,.70);box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 0 32px rgba(139,92,246,.23)}
.rhb-capability svg{width:39px;height:39px;fill:none;stroke:currentColor;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round;opacity:.94}
.rhb-capability h3{position:relative;z-index:1;margin:0 0 13px;font-size:20px;line-height:1;font-weight:900;letter-spacing:-.2px;text-shadow:0 0 18px rgba(255,255,255,.22)}
.rhb-capability p{position:relative;z-index:1;margin:0;font-size:11.7px;line-height:1.9;color:rgba(255,255,255,.88);direction:rtl;text-align:right;max-width:365px}

.rhb-about-content{direction:rtl;text-align:right;align-self:center;padding:0 0 0 16px;max-width:650px;justify-self:end;color:#0f172a}.rhb-about-kicker{position:relative;display:inline-flex;align-items:center;gap:12px;font-size:16px;font-weight:900;color:#0f172a;margin-bottom:34px}.rhb-about-kicker span{width:8px;height:8px;border-radius:50%;background:#111679;box-shadow:0 0 16px rgba(17,22,121,.32);order:-1}.rhb-about-kicker:after{content:"";position:absolute;right:0;bottom:-18px;width:74px;height:2px;background:#111679;border-radius:4px}.rhb-about-title{margin:18px 0 18px;font-size:56px;line-height:1.18;font-weight:950;letter-spacing:-2.2px;white-space:nowrap}.rhb-about-title .title-dark{color:#0f172a}.rhb-about-title .title-navy{color:#111679;background:linear-gradient(90deg,#2447b8 0%,#1a2f9a 48%,#111679 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-fill-color:transparent}.rhb-about-divider{height:16px;display:flex;align-items:center;justify-content:center;gap:18px;margin:6px 0 28px;direction:ltr}.rhb-about-divider i{display:block;width:92px;height:1px;background:linear-gradient(90deg,transparent,rgba(17,22,121,.22),transparent)}.rhb-about-divider b{display:block;width:13px;height:13px;background:#111679;transform:rotate(45deg);box-shadow:none}.rhb-about-intro{max-width:612px;margin:0 auto 40px;color:#4b5563;font-size:17px;line-height:2.18;text-align:center;font-weight:500}.rhb-about-features{display:flex;flex-direction:column;gap:0}.rhb-about-feature{position:relative;min-height:132px;border-bottom:1px solid rgba(100,116,139,.14);display:grid;grid-template-columns:92px 46px minmax(0,1fr);align-items:center;column-gap:0;direction:rtl}.rhb-about-feature:last-child{border-bottom:0}.rhb-about-feature .feature-icon{grid-column:1;width:86px;height:86px;border-radius:50%;display:grid;place-items:center;color:#111679;background:rgba(255,255,255,.92);border:1px solid rgba(17,22,121,.06);box-shadow:0 14px 32px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.9)}.rhb-about-feature .feature-icon svg{width:42px;height:42px;fill:none;stroke:currentColor;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}.rhb-about-feature .feature-dot{grid-column:2;width:8px;height:8px;border-radius:50%;background:#111679;justify-self:center;box-shadow:0 0 12px rgba(17,22,121,.32)}.rhb-about-feature .feature-copy{grid-column:3;text-align:right;padding-right:2px}.rhb-about-feature h3{margin:0 0 12px;font-size:20px;line-height:1.55;color:#0f172a;font-weight:950}.rhb-about-feature p{margin:0;color:#64748b;font-size:14.2px;line-height:2.05;font-weight:500;max-width:480px}

@media(max-width:980px){.rhb-about-section{grid-template-columns:1fr;padding:42px 24px;gap:28px}.rhb-about-visual{justify-content:center}.rhb-about-card-shell{width:min(580px,100%);height:690px}.rhb-about-content{justify-self:center;text-align:center;padding:0}.rhb-about-title{font-size:38px;white-space:normal}.rhb-about-feature{grid-template-columns:80px 28px minmax(0,1fr)}.rhb-about-feature .feature-icon{width:72px;height:72px}.rhb-about-feature h3{font-size:17px}.rhb-about-feature p{font-size:13px}.rhb-capability-list{right:34px;left:34px}.rhb-capability{padding-right:90px}}


/* fixed134: About visual uses the approved exported left-card image */
.rhb-about-image-shell{
  padding:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible;
}
.rhb-about-card-image{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  border:0;
  border-radius:42px;
}

/* =====================================================
   FIX138 - Hero source reset from fixed136
   Only two requested changes:
   1) Remove initial top gap so page starts with Hero.
   2) Replace Hero background image with supplied 9.jpg.
   Keep all sizing, zoom, position, layout and other sections unchanged.
===================================================== */
.page{
  margin-top:0 !important;
}
.hero-bg{
  background-image:url('../img/9.webp') !important;
}


/* =====================================================
   FIX140 - Hero brand logotype SVG only
   Replace the typed hero title with the supplied vector logotype.
   This affects only the hero brand mark and no global typography.
===================================================== */
.hero-brand-logo{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  margin:24px auto 0 !important;
  width:190px !important;
  max-width:62% !important;
  line-height:0 !important;
  filter:drop-shadow(0 14px 24px rgba(0,0,0,.10)) !important;
}
.hero-brand-logo img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
}
@media(max-width:720px){
  .hero-brand-logo{width:138px !important;margin-top:18px !important;}
}

/* =====================================================
   FIX142 - Hero layout polish only
   - Remove visual dominance of hero CTA area
   - Give the brand logotype more breathing room
   - Make the hero eyebrow orb navy
   No hero image sizing/zoom/position changes.
===================================================== */
.hero-content{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
}
.hero-content .eyebrow span{
  background:#24408f !important;
  box-shadow:0 0 16px rgba(36,64,143,.28) !important;
}
.hero-brand-logo{
  margin-top:34px !important;
  margin-bottom:0 !important;
}
.hero-content p{
  margin-top:30px !important;
  margin-bottom:0 !important;
}
.hero-actions{
  display:none !important;
}
@media(max-width:720px){
  .hero-brand-logo{margin-top:26px !important;}
  .hero-content p{margin-top:24px !important;}
}

/* =====================================================
   FIX146 - Responsive QA final pass
   Scope: mobile/tablet only. Desktop visual freeze is preserved.
   Goals:
   - No horizontal overflow
   - Stable header/nav on tablet and mobile
   - Hero keeps artwork sizing while content breathes
   - Services/About/Stats/Process/Projects/Footer stack cleanly
   - No changes above 1180px
===================================================== */
@media (max-width:1180px){
  html,body{max-width:100% !important;overflow-x:hidden !important;}
  *,*::before,*::after{box-sizing:border-box;}
  .page{width:100% !important;max-width:100% !important;padding-left:14px !important;padding-right:14px !important;overflow-x:hidden !important;}
  .panel,.glass{max-width:100% !important;}
  img,svg,video{max-width:100%;}

  /* Header: keep layout calm on tablet widths */
  .header{
    width:100% !important;
    max-width:100% !important;
    grid-template-columns:minmax(190px,220px) minmax(0,1fr) auto !important;
    gap:16px !important;
    padding-left:18px !important;
    padding-right:18px !important;
  }
  .nav{gap:16px !important;min-width:0 !important;}
  .nav a{white-space:nowrap !important;font-size:13px !important;}
  .header-btn{min-width:132px !important;white-space:nowrap !important;}

  /* Hero tablet: avoid cramped title/content without scaling the hero image */
  .hero{height:760px !important;}
  .hero-content{
    top:168px !important;
    right:54px !important;
    left:auto !important;
    width:420px !important;
    transform:none !important;
  }
  .hero-brand-logo{width:168px !important;max-width:58% !important;}
  .hero-content p{width:min(390px,100%) !important;font-size:15px !important;line-height:2.05 !important;}
  .tech-list{left:48px !important;gap:34px !important;}
  .social-side{left:44px !important;}
  .scroll-note{left:42px !important;bottom:96px !important;}
  .brand-strip{right:32px !important;left:32px !important;}

  /* Services tablet: remove desktop forced width/padding that can overflow */
  .services-section{
    width:100% !important;
    max-width:100% !important;
    grid-template-columns:1fr !important;
    min-height:auto !important;
    padding:42px 22px 28px !important;
    gap:34px !important;
  }
  .services-copy{order:-1 !important;text-align:center !important;margin:0 auto !important;max-width:680px !important;}
  .services-copy p{margin-left:auto !important;margin-right:auto !important;max-width:610px !important;}
  .services-grid{
    width:100% !important;
    max-width:860px !important;
    margin:0 auto !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:14px !important;
    padding:14px !important;
  }
  .services-grid::before,.services-grid::after,.services-grid .service-card:first-child::before,.services-grid .service-card:first-child::after,.services-grid .service-card:nth-child(2)::after,.services-grid .service-card:nth-child(3)::before{display:none !important;}
  .neural-orb,.molecule-bg{display:none !important;}

  /* About tablet */
  .rhb-about-section{
    width:calc(100% - 28px) !important;
    grid-template-columns:1fr !important;
    min-height:auto !important;
    padding:46px 26px !important;
    gap:34px !important;
  }
  .rhb-about-visual{order:2 !important;justify-content:center !important;width:100% !important;}
  .rhb-about-content{order:1 !important;justify-self:center !important;text-align:center !important;max-width:720px !important;padding:0 !important;}
  .rhb-about-title{font-size:44px !important;white-space:normal !important;letter-spacing:-1.4px !important;}
  .rhb-about-intro{max-width:650px !important;}
  .rhb-about-card-shell{width:min(520px,100%) !important;height:auto !important;aspect-ratio:580/790 !important;max-height:none !important;}
  .rhb-about-feature{grid-template-columns:82px 30px minmax(0,1fr) !important;min-height:118px !important;text-align:right !important;}

  /* Stats tablet: 2x2 instead of tight 4 columns */
  .stats-panel{
    width:calc(100% - 28px) !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:0 !important;
    padding:26px 22px !important;
  }
  .stat{min-height:96px !important;border-left:0 !important;border-bottom:1px solid rgba(255,255,255,.18) !important;}
  .stat:nth-last-child(-n+2){border-bottom:0 !important;}

  /* Process tablet: readable rows, timeline hidden */
  .process-section{
    width:100% !important;
    grid-template-columns:1fr !important;
    padding:34px 22px 0 !important;
    gap:24px !important;
  }
  .process-copy,.process-intro{text-align:center !important;max-width:680px !important;margin:0 auto !important;}
  .process-copy h2,.process-intro h2{font-size:42px !important;}
  .steps-line{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:22px 18px !important;
  }
  .steps-line::before{display:none !important;}
  .step{padding:18px 14px !important;border-radius:22px !important;background:rgba(255,255,255,.44) !important;border:1px solid rgba(47,76,168,.08) !important;}

  /* Projects tablet */
  .projects-panel{
    width:calc(100% - 28px) !important;
    grid-template-columns:1fr 1fr !important;
    padding:28px !important;
    gap:20px !important;
  }
  .projects-copy{grid-column:1/-1 !important;text-align:center !important;max-width:650px !important;margin:0 auto !important;}
  .project-card{min-height:260px !important;}

  /* CTA/Footer tablet */
  .cta-panel{width:calc(100% - 28px) !important;height:auto !important;min-height:168px !important;grid-template-columns:1fr !important;padding:28px !important;}
  .cta-art{display:none !important;}
  .cta-copy{text-align:center !important;padding:0 !important;}
  .footer{width:calc(100% - 28px) !important;grid-template-columns:1fr 1fr !important;gap:28px !important;padding:34px 28px 18px !important;}
}

@media (max-width:760px){
  .page{padding-left:10px !important;padding-right:10px !important;}
  .section{margin-top:52px !important;}

  /* Mobile header */
  .header{
    height:auto !important;
    grid-template-columns:1fr !important;
    gap:14px !important;
    padding:14px 12px !important;
    border-radius:0 0 24px 24px !important;
  }
  .brand{justify-self:center !important;}
  .brand-icon{width:44px !important;height:44px !important;}
  .brand-copy strong{font-size:14px !important;}
  .brand-copy small{font-size:9px !important;}
  .nav{
    width:100% !important;
    justify-content:center !important;
    flex-wrap:wrap !important;
    gap:8px 12px !important;
  }
  .nav a{font-size:12px !important;padding:6px 4px !important;}
  .header-btn{justify-self:center !important;height:38px !important;min-width:132px !important;font-size:12px !important;}

  /* Mobile hero: keep background image unchanged, move text to safe readable block */
  .hero{height:760px !important;border-radius:0 0 28px 28px !important;}
  .hero-bg{background-position:72% center !important;background-size:cover !important;}
  .hero-fade{background:linear-gradient(180deg,rgba(247,248,252,.90) 0%,rgba(247,248,252,.58) 43%,rgba(247,248,252,.10) 100%) !important;}
  .hero-content{
    top:118px !important;
    right:18px !important;
    left:18px !important;
    width:auto !important;
    transform:none !important;
    padding:0 8px !important;
  }
  .hero-content .eyebrow{font-size:12px !important;line-height:1.9 !important;justify-content:center !important;}
  .hero-brand-logo{width:132px !important;margin-top:24px !important;}
  .hero-content p{width:100% !important;max-width:330px !important;font-size:13px !important;line-height:2.05 !important;margin-top:22px !important;}
  .social-side,.tech-list,.scroll-note{display:none !important;}
  .brand-strip{
    right:14px !important;
    left:14px !important;
    bottom:14px !important;
    height:auto !important;
    min-height:96px !important;
    flex-direction:column !important;
  }
  .brand-badge{width:100% !important;height:34px !important;border-radius:24px 24px 0 0 !important;font-size:12px !important;}
  .brand-logos{gap:10px !important;padding:10px !important;flex-wrap:wrap !important;justify-content:center !important;}
  .brand-logos img{max-width:86px !important;}

  /* Mobile services */
  .services-section{padding:34px 8px 20px !important;gap:24px !important;}
  .services-copy h2,.section-copy h2{font-size:31px !important;line-height:1.45 !important;}
  .services-copy p,.section-copy p{font-size:13px !important;line-height:2.05 !important;}
  .services-grid{grid-template-columns:1fr !important;gap:14px !important;padding:0 !important;}
  .service-card{min-height:auto !important;padding:22px 18px !important;border-radius:22px !important;}

  /* Mobile about */
  .rhb-about-section{width:100% !important;margin-top:52px !important;padding:34px 16px !important;border-radius:24px !important;gap:26px !important;}
  .rhb-about-kicker{font-size:14px !important;margin-bottom:26px !important;}
  .rhb-about-title{font-size:31px !important;line-height:1.45 !important;letter-spacing:-.8px !important;}
  .rhb-about-divider{margin:4px 0 22px !important;gap:12px !important;}
  .rhb-about-divider i{width:62px !important;}
  .rhb-about-intro{font-size:13.5px !important;line-height:2.15 !important;margin-bottom:22px !important;text-align:center !important;}
  .rhb-about-feature{
    grid-template-columns:62px 20px minmax(0,1fr) !important;
    min-height:auto !important;
    padding:16px 0 !important;
  }
  .rhb-about-feature .feature-icon{width:56px !important;height:56px !important;}
  .rhb-about-feature .feature-icon svg{width:30px !important;height:30px !important;}
  .rhb-about-feature h3{font-size:15px !important;line-height:1.7 !important;margin-bottom:7px !important;}
  .rhb-about-feature p{font-size:12.5px !important;line-height:2 !important;}
  .rhb-about-card-shell{width:min(330px,100%) !important;}

  /* Mobile stats */
  .stats-panel{width:100% !important;grid-template-columns:1fr !important;border-radius:22px !important;padding:18px !important;}
  .stat{border-bottom:1px solid rgba(255,255,255,.18) !important;justify-content:center !important;min-height:86px !important;}
  .stat:nth-last-child(-n+2){border-bottom:1px solid rgba(255,255,255,.18) !important;}
  .stat:last-child{border-bottom:0 !important;}
  .stat strong{font-size:32px !important;}
  .stat i{font-size:30px !important;}

  /* Mobile process */
  .process-section{padding:28px 8px 0 !important;}
  .process-copy h2,.process-intro h2{font-size:32px !important;line-height:1.45 !important;}
  .steps-line{grid-template-columns:1fr !important;gap:14px !important;}
  .step div{width:82px !important;height:82px !important;font-size:27px !important;}

  /* Mobile projects */
  .projects-panel{width:100% !important;margin-top:54px !important;grid-template-columns:1fr !important;padding:22px !important;border-radius:24px !important;}
  .projects-copy h2{font-size:28px !important;}
  .projects-copy p{font-size:13px !important;}
  .project-card{min-height:285px !important;}
  .slider-next{display:none !important;}

  /* Mobile CTA/Footer */
  .cta-panel{width:100% !important;margin-top:46px !important;padding:24px 18px !important;border-radius:24px !important;}
  .cta-copy h2{font-size:26px !important;line-height:1.5 !important;}
  .cta-copy p{font-size:13px !important;}
  .footer{width:100% !important;grid-template-columns:1fr !important;text-align:center !important;padding:30px 22px 16px !important;border-radius:24px 24px 0 0 !important;}
  .footer img{margin-left:auto !important;margin-right:auto !important;max-width:190px !important;}
  .footer-social{justify-content:center !important;}
  .footer-trust-line{margin-left:auto !important;margin-right:auto !important;}
}

@media (max-width:390px){
  .hero{height:740px !important;}
  .hero-content{top:106px !important;}
  .hero-brand-logo{width:118px !important;}
  .hero-content p{font-size:12.5px !important;max-width:300px !important;}
  .brand-logos img{max-width:78px !important;}
  .rhb-about-title{font-size:28px !important;}
  .services-copy h2,.section-copy h2,.process-copy h2,.process-intro h2{font-size:28px !important;}
  .projects-copy h2{font-size:25px !important;}
}


/* ============================================================
   CONSULTATION MODAL
   Purpose: Premium consultation form UI. Backend-ready, no visual impact on existing sections.
   ============================================================ */
.rhb-consultation-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  padding:18px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .32s ease, visibility .32s ease;
}
.rhb-consultation-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.rhb-consultation-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.42);
  backdrop-filter:blur(18px);
}
.rhb-consultation-dialog{
  position:relative;
  width:min(820px,calc(100vw - 36px));
  max-height:min(86vh,760px);
  overflow:auto;
  border-radius:30px;
  padding:28px;
  background:
    radial-gradient(circle at 14% 12%,rgba(47,76,168,.18),transparent 34%),
    radial-gradient(circle at 88% 8%,rgba(107,83,255,.12),transparent 30%),
    rgba(255,255,255,.86);
  border:1px solid rgba(255,255,255,.70);
  box-shadow:0 34px 110px rgba(15,23,42,.28);
  transform:translateY(18px) scale(.985);
  transition:transform .34s cubic-bezier(.2,.8,.2,1);
}
.rhb-consultation-modal.is-open .rhb-consultation-dialog{transform:translateY(0) scale(1);}
.rhb-consultation-close{
  position:absolute;
  top:18px;
  left:18px;
  width:42px;
  height:42px;
  border:0;
  border-radius:999px;
  cursor:pointer;
  color:#1f3b8f;
  background:rgba(255,255,255,.78);
  box-shadow:0 12px 30px rgba(15,23,42,.12);
  font-size:28px;
  line-height:1;
}
.rhb-consultation-head{max-width:680px;margin:0 auto 20px;text-align:center;}
.rhb-consultation-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:#1f3b8f;
  font-weight:800;
  font-size:14px;
  margin-bottom:12px;
}
.rhb-consultation-kicker::before,.rhb-consultation-kicker::after{
  content:"";
  width:28px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,#2f4ca8,#1f3b8f);
}
.rhb-consultation-head h2{
  margin:0 0 12px;
  font-size:clamp(28px,3.3vw,40px);
  line-height:1.35;
  color:#0f172a;
  letter-spacing:-1px;
}
.rhb-consultation-head p{
  margin:0 auto;
  max-width:720px;
  color:#4b5563;
  font-size:15px;
  line-height:1.95;
}
.rhb-consultation-form{display:grid;gap:12px;}
.rhb-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.rhb-consultation-form label{display:grid;gap:8px;}
.rhb-consultation-form label span{
  color:#1f2937;
  font-size:13px;
  font-weight:800;
}
.rhb-consultation-form input,
.rhb-consultation-form textarea{
  width:100%;
  border:1px solid rgba(47,76,168,.16);
  border-radius:18px;
  background:rgba(255,255,255,.72);
  color:#111827;
  outline:none;
  padding:11px 14px;
  font:inherit;
  line-height:1.7;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.rhb-consultation-form textarea{resize:vertical;min-height:104px;}
.rhb-consultation-form input:focus,
.rhb-consultation-form textarea:focus{
  border-color:rgba(47,76,168,.55);
  background:rgba(255,255,255,.92);
  box-shadow:0 0 0 4px rgba(47,76,168,.10);
}
.rhb-form-full{grid-column:1/-1;}
.rhb-hp-field{position:absolute !important;opacity:0 !important;pointer-events:none !important;width:1px !important;height:1px !important;}
.rhb-consultation-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-top:2px;
}
.rhb-consultation-submit{border:0;cursor:pointer;min-width:208px;background:linear-gradient(90deg,#253F91 0%,#654AA4 55%,#C456A3 100%) !important;box-shadow:0 12px 28px rgba(37,63,145,.22), inset 0 1px 0 rgba(255,255,255,.26) !important;}
.rhb-consultation-actions small{
  max-width:460px;
  color:#6b7280;
  font-size:12px;
  line-height:1.9;
}
.rhb-consultation-status{
  border:1px solid rgba(47,76,168,.16);
  background:rgba(47,76,168,.08);
  border-radius:20px;
  padding:16px 18px;
  color:#1f3b8f;
  line-height:1.9;
}
.rhb-consultation-status strong{display:block;font-size:15px;margin-bottom:2px;}
.rhb-consultation-status span{display:block;color:#334155;font-size:13px;}

.rhb-consultation-submit:hover{
  background:linear-gradient(90deg,#2f4ca8 0%,#6a4da8 55%,#c25aa5 100%) !important;
  box-shadow:0 18px 42px rgba(47,76,168,.24),0 8px 18px rgba(194,90,165,.14) !important;
}
@media (max-width:480px){
  .rhb-consultation-modal{padding:8px;}
  .rhb-consultation-dialog{max-height:94vh;padding:22px 14px 16px;border-radius:24px 24px 0 0;}
  .rhb-consultation-kicker{font-size:12.5px;margin-bottom:8px;}
  .rhb-consultation-kicker::before,.rhb-consultation-kicker::after{width:20px;}
  .rhb-consultation-form{gap:10px;}
  .rhb-form-grid{gap:10px;}
  .rhb-consultation-form textarea{min-height:92px;}
}
@media (min-width:761px) and (max-height:760px){
  .rhb-consultation-dialog{max-height:92vh;padding:24px;}
  .rhb-consultation-head{margin-bottom:14px;}
  .rhb-consultation-head h2{font-size:32px;margin-bottom:8px;}
  .rhb-consultation-head p{font-size:14px;line-height:1.85;}
  .rhb-consultation-form textarea{min-height:88px;}
}

body.rhb-modal-open{overflow:hidden;}
body.rhb-modal-open .rhb-consultation-modal{direction:rtl;}

@media (max-width:760px){
  .rhb-consultation-modal{padding:12px;align-items:end;}
  .rhb-consultation-dialog{width:100%;max-height:92vh;border-radius:26px 26px 0 0;padding:24px 16px 18px;}
  .rhb-consultation-close{top:12px;left:12px;width:38px;height:38px;font-size:25px;}
  .rhb-consultation-head{margin-bottom:16px;}
  .rhb-consultation-head h2{font-size:25px;}
  .rhb-consultation-head p{font-size:12.8px;line-height:1.9;}
  .rhb-form-grid{grid-template-columns:1fr;gap:12px;}
  .rhb-consultation-form input,.rhb-consultation-form textarea{border-radius:15px;padding:10px 12px;font-size:13px;}
  .rhb-consultation-actions{display:grid;gap:10px;}
  .rhb-consultation-submit{width:100%;min-width:0;}

}

/* =====================================================
   FIX 152 - Correct local after-hero and footer island imagery
   Scope: self-contained visual assets only.
   - Uses exact uploaded after-Hero background.
   - Uses exact uploaded footer island image.
   No external URLs.
===================================================== */
.page::before{
  background:
    linear-gradient(180deg, rgba(247,248,255,.60) 0%, rgba(247,248,255,.46) 36%, rgba(239,234,255,.62) 68%, rgba(141,114,255,.18) 100%),
    url('../img/after-hero-background.webp') top center / cover no-repeat,
    linear-gradient(180deg, #f7f8ff 0%, #f4f1ff 52%, #efeaff 100%) !important;
}

.cta-panel,
.footer-island .cta-panel{
  background-image:
    linear-gradient(90deg, rgba(255,255,255,.12), rgba(255,255,255,.02)),
    url('../img/footer-island-image.webp') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}

.footer-island::before{
  background:
    radial-gradient(circle at 50% 100%,rgba(119,75,255,.16),rgba(255,255,255,0) 62%),
    url('../img/after-hero-background.webp') center bottom / cover no-repeat !important;
  opacity:.42 !important;
}

/* =====================================================
   FIX 153 - Footer glass surface isolation
   هدف: بکگراند موج‌دار 55.jpg فقط پشت فوتر دیده شود، نه داخل کارت فوتر.
   - CTA island image remains footer-island-image.jpg.
   - Footer content panel gets a clean glass/white surface.
   - Layout, height, spacing and content are not changed.
===================================================== */
.footer-island{
  isolation:isolate !important;
}

.footer-island::before{
  z-index:0 !important;
  pointer-events:none !important;
}

.footer-island > .cta-panel,
.footer-island > .footer,
.footer-island > footer.footer{
  position:relative !important;
  z-index:2 !important;
}

.footer-island .footer.rhb-footer,
.footer-island footer.footer,
.footer.rhb-footer{
  background:
    linear-gradient(180deg, rgba(255,255,255,.86) 0%, rgba(255,255,255,.72) 100%) !important;
  -webkit-backdrop-filter:blur(24px) saturate(145%) !important;
  backdrop-filter:blur(24px) saturate(145%) !important;
  border-color:rgba(255,255,255,.72) !important;
  box-shadow:
    0 26px 74px rgba(54,54,120,.10),
    inset 0 1px 0 rgba(255,255,255,.82) !important;
  overflow:hidden !important;
}

.footer-island .footer.rhb-footer::before,
.footer-island footer.footer::before,
.footer.rhb-footer::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.78), rgba(255,255,255,.56), rgba(255,255,255,.76)) !important;
  opacity:1 !important;
  pointer-events:none !important;
}

.footer-island .footer.rhb-footer::after,
.footer-island footer.footer::after,
.footer.rhb-footer::after{
  content:"" !important;
  position:absolute !important;
  inset:auto 36px 48px 36px !important;
  height:1px !important;
  z-index:1 !important;
  background:linear-gradient(90deg, transparent, rgba(47,76,168,.14), transparent) !important;
  pointer-events:none !important;
}

.footer-island .footer.rhb-footer > *,
.footer-island footer.footer > *,
.footer.rhb-footer > *{
  position:relative !important;
  z-index:2 !important;
}

/* =====================================================
   FIX 154 - Final footer visual lock
   هدف: فوتر دقیقاً مثل نمونه مرجع باشد؛ بدون هیچ لایه/نوار/افکت اضافه.
   - after-hero-background.jpg فقط پشت فوتر استفاده می‌شود.
   - footer-island-image.jpg فقط داخل CTA بالای فوتر استفاده می‌شود.
   - کارت فوتر سطح شیشه‌ای تمیز و مستقل دارد.
===================================================== */
.footer-island{
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
  background:
    linear-gradient(180deg, rgba(247,248,255,.54) 0%, rgba(244,240,255,.40) 42%, rgba(160,126,255,.18) 100%),
    url('../img/after-hero-background.webp') center bottom / cover no-repeat !important;
}
.footer-island::before,
.footer-island::after{
  content:none !important;
  display:none !important;
  background:none !important;
}
.footer-island .cta-panel{
  position:relative !important;
  z-index:2 !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.08), rgba(255,255,255,.02)),
    url('../img/footer-island-image.webp') center center / cover no-repeat !important;
  overflow:hidden !important;
}
.footer-island .cta-panel::before,
.footer-island .cta-panel::after{
  content:none !important;
  display:none !important;
}
.footer-island .footer.rhb-footer,
.footer-island footer.footer,
.footer.rhb-footer{
  position:relative !important;
  z-index:2 !important;
  background:linear-gradient(180deg, rgba(255,255,255,.84) 0%, rgba(255,255,255,.68) 100%) !important;
  -webkit-backdrop-filter:blur(22px) saturate(135%) !important;
  backdrop-filter:blur(22px) saturate(135%) !important;
  border:1px solid rgba(255,255,255,.78) !important;
  box-shadow:0 26px 76px rgba(70,64,130,.10), inset 0 1px 0 rgba(255,255,255,.86) !important;
  overflow:hidden !important;
}
.footer-island .footer.rhb-footer::before,
.footer-island footer.footer::before,
.footer.rhb-footer::before,
.footer-island .footer.rhb-footer::after,
.footer-island footer.footer::after,
.footer.rhb-footer::after{
  content:none !important;
  display:none !important;
  background:none !important;
}
.footer-island .footer.rhb-footer > *,
.footer-island footer.footer > *,
.footer.rhb-footer > *{
  position:relative !important;
  z-index:2 !important;
}
.footer-island .copyright{
  border-top:1px solid rgba(111,61,255,.12) !important;
  background:transparent !important;
}


/* =====================================
   FIX155 - Logo spacing polish
   Scope: Header + Footer brand logo only.
   Purpose: increase only the gap between logo icon and text.
   Do not change icon, text, size, color, or placement.
===================================== */
.header .brand,
.footer-island .footer-brand .footer-logo,
.footer-brand .footer-logo{
  gap:22px !important;
}


/* =====================================================
   FIX 163 - Performance pass
   هدف: کاهش زمان لود و TBT بدون تغییر ظاهر دسکتاپ.
   - استفاده از WebP برای تصاویر سنگین
   - حذف انیمیشن پس‌زمینه‌های تزئینی غیرضروری
   - تثبیت compositing برای کارت‌ها
===================================================== */
.project-card img,.rhb-about-card-image,.brand-strip img{content-visibility:auto;}
.project-card,.service-card,.step,.stat-card{will-change:transform;}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important;}}