/* =============================================
   MENUSOFT WEBSITE — SHARED STYLES
   ============================================= */
@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;600;700;800;900&display=swap');

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

:root {
  --primary:       #077BF9;
  --primary-dk:    #0560c9;
  --primary-lt:    #4d9dff;
  --primary-glow:  rgba(7,123,249,.28);
  --secondary:     #FB7102;
  --secondary-dk:  #d56000;
  --secondary-glow:rgba(251,113,2,.28);
  --dark:          #0f172a;
  --dark-lt:       #1e293b;
  --g600:          #475569;
  --g400:          #94a3b8;
  --g200:          #e2e8f0;
  --g100:          #f1f5f9;
  --white:         #ffffff;
  --grad-primary:  linear-gradient(135deg,#077BF9 0%,#4d9dff 100%);
  --grad-secondary:linear-gradient(135deg,#FB7102 0%,#ff9a4d 100%);
  --grad-hero:     linear-gradient(160deg,#077BF9 0%,#0a2a6e 50%,#1a0a30 100%);
  --grad-text:     linear-gradient(135deg,#077BF9 0%,#FB7102 100%);
  --sh-sm:  0 2px 8px rgba(7,123,249,.08);
  --sh-md:  0 8px 30px rgba(7,123,249,.12);
  --sh-lg:  0 20px 60px rgba(7,123,249,.15);
  --sh-xl:  0 30px 80px rgba(7,123,249,.2);
  --r-sm:12px; --r-md:20px; --r-lg:28px; --r-xl:40px; --r-full:9999px;
  --ease: .3s cubic-bezier(.4,0,.2,1);
}

body {
  font-family:'Vazirmatn',sans-serif;
  background:linear-gradient(180deg,#f8fafc 0%,#e2e8f0 100%);
  color:var(--dark);
  line-height:1.7;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6 { font-weight:800; line-height:1.3; }

.gradient-text {
  background:var(--grad-text);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

/* ── NAVBAR ── */
.navbar-ms {
  position:fixed; top:0; left:0; right:0; z-index:1050;
  padding:1rem 0;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(20px) saturate(180%);
  border-bottom:1px solid rgba(255,255,255,.3);
  box-shadow:var(--sh-sm);
  transition:var(--ease);
}
.navbar-ms.scrolled { padding:.6rem 0; background:rgba(255,255,255,.97); box-shadow:var(--sh-md); }
.nav-brand {
  display:flex; align-items:center; gap:.65rem;
  text-decoration:none; font-weight:900; font-size:1.5rem;
  background:var(--grad-text);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.nav-brand img { width:40px; height:40px; border-radius:var(--r-sm); }
.nav-link-ms {
  position:relative; padding:.5rem 1rem !important; font-weight:600;
  color:var(--g600) !important; text-decoration:none;
  border-radius:var(--r-sm); transition:var(--ease);
}
.nav-link-ms::after {
  content:''; position:absolute; bottom:0; right:50%;
  width:0; height:3px; background:var(--grad-primary);
  border-radius:var(--r-full); transition:var(--ease); transform:translateX(50%);
}
.nav-link-ms:hover,.nav-link-ms.active { color:var(--primary) !important; }
.nav-link-ms:hover::after,.nav-link-ms.active::after { width:60%; }
.nav-link-ms.active-page { color:var(--primary) !important; }
.nav-link-ms.active-page::after { width:60%; }

/* Services dropdown in nav */
.nav-dropdown { position:relative; }
.nav-dropdown-menu {
  position:absolute; top:calc(100% + 8px); right:0;
  background:#fff; border-radius:var(--r-md); box-shadow:var(--sh-lg);
  padding:.75rem; min-width:220px; opacity:0; visibility:hidden;
  transform:translateY(-8px); transition:var(--ease);
  border:1px solid var(--g200); z-index:100;
}
.nav-dropdown:hover .nav-dropdown-menu { opacity:1; visibility:visible; transform:translateY(0); }
.nav-dropdown-menu a {
  display:flex; align-items:center; gap:.65rem;
  padding:.65rem 1rem; border-radius:var(--r-sm);
  color:var(--g600); text-decoration:none; font-size:.9rem; font-weight:600;
  transition:var(--ease);
}
.nav-dropdown-menu a:hover { background:var(--g100); color:var(--primary); }
.nav-dropdown-menu a i { width:18px; text-align:center; color:var(--primary); }

/* ── SIDEBAR MOBILE ── */
.sidebar-overlay { position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:1040; opacity:0; visibility:hidden; transition:var(--ease); }
.sidebar-overlay.active { opacity:1; visibility:visible; }
.sidebar-mob {
  position:fixed; top:0; right:-320px; width:300px; height:100%;
  background:#fff; z-index:1060; padding:2rem;
  overflow-y:auto; transition:var(--ease); box-shadow:-10px 0 30px rgba(0,0,0,.1);
}
.sidebar-mob.active { right:0; }
.sidebar-mob-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:2rem; padding-bottom:1rem; border-bottom:2px solid var(--g200); }
.sidebar-close-btn { width:40px; height:40px; display:flex; align-items:center; justify-content:center; background:var(--g100); border:none; border-radius:50%; font-size:1.2rem; cursor:pointer; transition:var(--ease); }
.sidebar-close-btn:hover { background:var(--primary); color:#fff; }
.sidebar-nav-list { list-style:none; padding:0; }
.sidebar-nav-list li { margin-bottom:.5rem; }
.sidebar-nav-list a { display:flex; align-items:center; gap:1rem; padding:1rem 1.25rem; color:var(--dark); text-decoration:none; font-weight:600; border-radius:var(--r-md); transition:var(--ease); }
.sidebar-nav-list a:hover,.sidebar-nav-list a.active { background:linear-gradient(135deg,rgba(7,123,249,.1),rgba(251,113,2,.1)); color:var(--primary); }
.sidebar-nav-list a i { width:24px; text-align:center; }
.sidebar-mob-footer { margin-top:2rem; padding-top:1rem; border-top:1px solid var(--g200); }
.sidebar-socials { display:flex; gap:1rem; justify-content:center; }
.sidebar-socials a { width:44px; height:44px; display:flex; align-items:center; justify-content:center; background:var(--g100); border-radius:50%; color:var(--dark); font-size:1.1rem; text-decoration:none; transition:var(--ease); }
.sidebar-socials a:hover { background:var(--grad-primary); color:#fff; transform:translateY(-3px); }

/* ── BUTTONS ── */
.btn-primary-ms {
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.875rem 2rem; font-weight:700; font-size:1rem; color:#fff;
  background:var(--grad-primary); border:none; border-radius:var(--r-full);
  box-shadow:var(--sh-md),0 4px 20px var(--primary-glow); text-decoration:none;
  cursor:pointer; overflow:hidden; transition:var(--ease); font-family:'Vazirmatn',sans-serif;
}
.btn-primary-ms:hover { transform:translateY(-3px); box-shadow:var(--sh-lg),0 0 30px var(--primary-glow); color:#fff; }
.btn-secondary-ms {
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.875rem 2rem; font-weight:700; font-size:1rem; color:#fff;
  background:var(--grad-secondary); border:none; border-radius:var(--r-full);
  box-shadow:var(--sh-md),0 4px 20px var(--secondary-glow); text-decoration:none;
  cursor:pointer; transition:var(--ease); font-family:'Vazirmatn',sans-serif;
}
.btn-secondary-ms:hover { transform:translateY(-3px); box-shadow:var(--sh-lg),0 0 30px var(--secondary-glow); color:#fff; }
.btn-outline-ms {
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.875rem 2rem; font-weight:700; font-size:1rem; color:var(--primary);
  background:transparent; border:2px solid var(--primary); border-radius:var(--r-full);
  text-decoration:none; cursor:pointer; transition:var(--ease); font-family:'Vazirmatn',sans-serif;
}
.btn-outline-ms:hover { background:var(--grad-primary); color:#fff; border-color:transparent; transform:translateY(-3px); }
.btn-white-ms {
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.875rem 2rem; font-weight:700; font-size:1rem; color:var(--primary);
  background:#fff; border:none; border-radius:var(--r-full);
  box-shadow:var(--sh-md); text-decoration:none; cursor:pointer; transition:var(--ease); font-family:'Vazirmatn',sans-serif;
}
.btn-white-ms:hover { transform:translateY(-3px); box-shadow:var(--sh-lg); color:var(--primary-dk); }

/* ── HERO ── */
.hero-ms {
  position:relative; min-height:100vh; display:flex; align-items:center;
  padding:8rem 0 5rem; background:var(--grad-hero); overflow:hidden;
}
.hero-ms.short { min-height:75vh; padding:7rem 0 4rem; }
.hero-bg-orbs { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.orb {
  position:absolute; border-radius:50%; filter:blur(60px); opacity:.5;
  animation:orbFloat 8s ease-in-out infinite;
}
.orb-1 { width:400px; height:400px; background:var(--primary); top:-100px; right:-100px; }
.orb-2 { width:300px; height:300px; background:var(--secondary); bottom:10%; left:-50px; animation-delay:-2s; }
.orb-3 { width:200px; height:200px; background:var(--primary-lt); top:40%; right:20%; animation-delay:-4s; }
@keyframes orbFloat {
  0%,100% { transform:translate(0,0) scale(1); }
  33% { transform:translate(30px,-30px) scale(1.05); }
  66% { transform:translate(-20px,20px) scale(.95); }
}
.hero-grid-lines {
  position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
  background-size:60px 60px; pointer-events:none;
}
.hero-badge-ms {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.5rem 1rem;
  background:rgba(255,255,255,.15); backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.2); border-radius:var(--r-full);
  color:#fff; font-size:.875rem; font-weight:600; margin-bottom:1.5rem;
}
.hero-badge-ms i { color:var(--secondary); }
.hero-title-ms { font-size:clamp(2rem,5vw,3.4rem); font-weight:900; color:#fff; line-height:1.2; margin-bottom:1.5rem; }
.hero-title-ms span { background:linear-gradient(135deg,#fff 0%,#a5d6ff 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hero-sub-ms { font-size:1.1rem; color:rgba(255,255,255,.85); line-height:1.8; margin-bottom:2.5rem; }
.hero-btns { display:flex; flex-wrap:wrap; gap:1rem; }
.hero-img-wrap { position:relative; }
.hero-img-box {
  border-radius:var(--r-xl); overflow:hidden;
  box-shadow:var(--sh-xl),0 0 100px rgba(7,123,249,.3);
  transform:perspective(1000px) rotateY(-5deg) rotateX(5deg);
  transition:var(--ease);
}
.hero-img-box:hover { transform:perspective(1000px) rotateY(0) rotateX(0); }
.hero-img-box img { width:100%; display:block; }
.hero-float {
  position:absolute; background:rgba(255,255,255,.95);
  backdrop-filter:blur(10px); border-radius:var(--r-md);
  padding:1rem 1.5rem; box-shadow:var(--sh-lg);
  animation:floatBounce 3s ease-in-out infinite;
  display:flex; align-items:center; gap:.75rem;
}
.hero-float-1 { top:10%; right:-30px; }
.hero-float-2 { bottom:15%; left:-30px; animation-delay:-1.5s; }
.hero-float-icon { width:40px; height:40px; border-radius:var(--r-sm); background:var(--grad-primary); display:flex; align-items:center; justify-content:center; color:#fff; }
.hero-float-text { font-weight:700; font-size:.875rem; }
.hero-float-sub  { font-size:.75rem; color:var(--g400); }
@keyframes floatBounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }

/* ── SECTION ── */
.section-ms { padding:6rem 0; }
.section-ms.bg-white { background:#fff; }
.section-ms.bg-light { background:var(--g100); }
.sec-badge {
  display:inline-flex; align-items:center; gap:.5rem;
  background:linear-gradient(135deg,rgba(7,123,249,.1),rgba(251,113,2,.1));
  color:var(--primary); font-weight:700; font-size:.8rem;
  padding:.4rem 1rem; border-radius:var(--r-full); margin-bottom:1rem;
}
.sec-title { font-size:clamp(1.6rem,3.5vw,2.5rem); font-weight:900; margin-bottom:1rem; }
.sec-sub { color:var(--g600); max-width:600px; margin:0 auto; }

/* ── FEATURE CARDS ── */
.feat-card {
  background:#fff; border-radius:var(--r-lg); padding:2rem;
  box-shadow:var(--sh-sm); border:1px solid var(--g200);
  transition:var(--ease); height:100%;
}
.feat-card:hover { transform:translateY(-6px); box-shadow:var(--sh-lg); border-color:var(--primary-lt); }
.feat-icon {
  width:64px; height:64px; border-radius:var(--r-md);
  background:linear-gradient(135deg,rgba(7,123,249,.1),rgba(251,113,2,.1));
  display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; color:var(--primary); margin-bottom:1.25rem;
  transition:var(--ease);
}
.feat-card:hover .feat-icon { background:var(--grad-primary); color:#fff; transform:scale(1.1) rotate(-5deg); }
.feat-title { font-size:1.1rem; font-weight:800; margin-bottom:.75rem; }
.feat-desc { color:var(--g600); font-size:.95rem; line-height:1.7; }

/* ── STEP CARDS ── */
.step-card { text-align:center; padding:2.5rem 1.5rem; position:relative; }
.step-num {
  width:70px; height:70px; border-radius:50%;
  background:var(--grad-primary); color:#fff;
  font-size:1.8rem; font-weight:900;
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 1.5rem; box-shadow:0 8px 24px var(--primary-glow);
}
.step-title { font-size:1.2rem; font-weight:800; margin-bottom:.75rem; }
.step-connector {
  position:absolute; top:35px; left:0; width:50%;
  height:3px; background:linear-gradient(90deg,transparent,var(--primary));
  display:none;
}
@media(min-width:768px){ .step-connector { display:block; } }

/* ── TESTIMONIALS ── */
.testi-card {
  background:#fff; border-radius:var(--r-lg); padding:2rem;
  box-shadow:var(--sh-sm); border:1px solid var(--g200);
  transition:var(--ease); height:100%;
}
.testi-card:hover { transform:translateY(-4px); box-shadow:var(--sh-md); }
.testi-head { display:flex; align-items:center; gap:1rem; margin-bottom:1rem; }
.testi-avatar { width:56px; height:56px; border-radius:50%; object-fit:cover; border:3px solid var(--primary-lt); }
.testi-name { font-weight:800; font-size:.95rem; }
.testi-role { font-size:.8rem; color:var(--g400); }
.testi-stars { color:#f59e0b; margin-bottom:.75rem; font-size:.9rem; }
.testi-text { color:var(--g600); font-size:.95rem; line-height:1.75; font-style:italic; }

/* ── PRICING ── */
.price-card {
  background:#fff; border-radius:var(--r-xl); padding:2.5rem;
  box-shadow:var(--sh-sm); border:1px solid var(--g200);
  transition:var(--ease); height:100%; position:relative; overflow:hidden;
}
.price-card:hover { transform:translateY(-6px); box-shadow:var(--sh-lg); }
.price-card.popular {
  background:var(--grad-hero); border-color:transparent;
  transform:scale(1.04);
}
.price-card.popular:hover { transform:scale(1.04) translateY(-6px); }
.price-popular-badge {
  position:absolute; top:16px; left:16px;
  background:var(--grad-secondary); color:#fff;
  padding:.3rem .9rem; border-radius:var(--r-full); font-size:.75rem; font-weight:700;
}
.price-title { font-size:1.2rem; font-weight:800; margin-bottom:.5rem; }
.price-card.popular .price-title { color:#fff; }
.price-sub { font-size:.85rem; color:var(--g400); margin-bottom:1.5rem; }
.price-card.popular .price-sub { color:rgba(255,255,255,.7); }
.price-amount { font-size:2.2rem; font-weight:900; color:var(--primary); line-height:1; }
.price-card.popular .price-amount { color:#fff; }
.price-period { font-size:.85rem; color:var(--g400); margin-bottom:1.5rem; }
.price-card.popular .price-period { color:rgba(255,255,255,.7); }
.price-features { list-style:none; padding:0; margin-bottom:2rem; }
.price-features li { display:flex; align-items:center; gap:.65rem; padding:.5rem 0; font-size:.9rem; color:var(--g600); border-bottom:1px solid var(--g100); }
.price-features li:last-child { border-bottom:none; }
.price-features li i { color:var(--primary); flex-shrink:0; }
.price-features li.disabled { color:var(--g400); }
.price-features li.disabled i { color:#cbd5e1; }
.price-card.popular .price-features li { color:rgba(255,255,255,.85); border-color:rgba(255,255,255,.1); }
.price-card.popular .price-features li.disabled { color:rgba(255,255,255,.4); }
.price-card.popular .price-features li i { color:#fb7102; }

/* ── PARTNERS CAROUSEL ── */
.partner-slide { text-align:center; padding:2rem; }
.partner-logo { max-height:80px; max-width:200px; object-fit:contain; filter:grayscale(100%); transition:var(--ease); margin-bottom:1rem; }
.partner-logo:hover { filter:none; transform:scale(1.05); }
.partner-slide h3 { font-size:1.1rem; font-weight:700; margin-bottom:.25rem; }
.partner-slide a { color:var(--primary); font-size:.85rem; text-decoration:none; }

/* ── FOOTER ── */
.footer-ms { background:var(--dark); color:#fff; padding:5rem 0 0; }
.footer-brand { display:flex; align-items:center; gap:.75rem; text-decoration:none; margin-bottom:1rem; }
.footer-brand img { width:42px; border-radius:var(--r-sm); }
.footer-brand span { font-size:1.4rem; font-weight:900; background:var(--grad-text); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.footer-title { font-size:1rem; font-weight:800; color:#fff; margin-bottom:1.25rem; }
.footer-links { list-style:none; padding:0; }
.footer-links li { margin-bottom:.65rem; }
.footer-links a { color:var(--g400); text-decoration:none; font-size:.9rem; display:inline-flex; align-items:center; gap:.5rem; transition:var(--ease); }
.footer-links a:hover { color:#fff; transform:translateX(-4px); }
.social-icons { display:flex; gap:.75rem; }
.social-icon { width:46px; height:46px; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.1); border-radius:50%; color:#fff; font-size:1.1rem; text-decoration:none; transition:var(--ease); }
.social-icon:hover { background:var(--grad-primary); transform:translateY(-4px) rotate(8deg); color:#fff; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); margin-top:3rem; padding:2rem 0; text-align:center; color:var(--g400); font-size:.875rem; }
.footer-trust { display:flex; justify-content:center; align-items:center; gap:2rem; flex-wrap:wrap; margin-top:1.5rem; }
.footer-trust img { height:46px; filter:grayscale(100%) brightness(1.5); transition:var(--ease); }
.footer-trust img:hover { filter:none; }

/* ── SCROLL REVEAL ── */
.reveal { opacity:0; transform:translateY(36px); transition:opacity .7s ease,transform .7s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }

/* ── BACK TO TOP ── */
.back-top {
  position:fixed; bottom:2rem; left:2rem; z-index:500;
  width:48px; height:48px; border-radius:50%;
  background:var(--grad-primary); color:#fff; font-size:1.1rem;
  display:flex; align-items:center; justify-content:center;
  box-shadow:var(--sh-md); cursor:pointer; border:none;
  opacity:0; visibility:hidden; transform:translateY(20px); transition:var(--ease);
}
.back-top.visible { opacity:1; visibility:visible; transform:translateY(0); }
.back-top:hover { transform:translateY(-4px); box-shadow:var(--sh-lg); }

/* ── MOSAIC ── */
.mosaic-wrap { position:relative; border-radius:var(--r-xl); overflow:hidden; background:var(--g100); height:350px; }
.mosaic-bg { position:absolute; inset:0; background:linear-gradient(135deg,rgba(7,123,249,.05),rgba(251,113,2,.05)); }
#mosaicContainer { position:relative; width:100%; height:100%; }
.mosaic-img {
  position:absolute; width:110px; height:110px; border-radius:var(--r-md);
  object-fit:cover; box-shadow:var(--sh-md);
  animation:mosaicIn .5s ease both;
  transition:var(--ease);
}
.mosaic-img:hover { transform:scale(1.1); z-index:10; }
@keyframes mosaicIn { from{opacity:0;transform:scale(.7)} to{opacity:1;transform:scale(1)} }

/* AI section special */
.ai-card {
  background:linear-gradient(135deg,#0f172a 0%,#1e293b 100%);
  border-radius:var(--r-xl); padding:4rem 3rem;
  position:relative; overflow:hidden;
}
.ai-glow { position:absolute; width:400px; height:400px; border-radius:50%; background:rgba(7,123,249,.2); filter:blur(80px); top:-100px; right:-100px; pointer-events:none; }
.ai-glow-2 { position:absolute; width:300px; height:300px; border-radius:50%; background:rgba(251,113,2,.15); filter:blur(60px); bottom:-50px; left:-50px; pointer-events:none; }
.ai-feature-list { list-style:none; padding:0; }
.ai-feature-list li { display:flex; align-items:center; gap:.75rem; padding:.75rem 0; border-bottom:1px solid rgba(255,255,255,.07); color:rgba(255,255,255,.8); font-size:.95rem; }
.ai-feature-list li:last-child { border-bottom:none; }
.ai-feature-list li i { color:var(--secondary); flex-shrink:0; }

/* HERO STATS */
.hero-stats { display:flex; gap:3rem; margin-top:4rem; padding-top:2rem; border-top:1px solid rgba(255,255,255,.1); }
.hero-stat-num { font-size:2.2rem; font-weight:900; color:#fff; line-height:1; }
.hero-stat-num span { color:var(--secondary); }
.hero-stat-label { font-size:.85rem; color:rgba(255,255,255,.65); margin-top:.4rem; }

/* ── RESPONSIVE ── */
@media(max-width:991.98px) {
  .hero-ms { padding:7rem 0 4rem; text-align:center; }
  .hero-stats { justify-content:center; }
  .hero-img-wrap { margin-top:3rem; }
  .hero-img-box { transform:none !important; }
  .hero-float { display:none; }
  .price-card.popular { transform:scale(1); }
}
@media(max-width:767.98px) {
  .section-ms { padding:4rem 0; }
  .hero-btns { justify-content:center; }
  .hero-stats { flex-direction:column; gap:1.5rem; }
  .ai-card { padding:2.5rem 1.5rem; }
}

::-webkit-scrollbar { width:8px; }
::-webkit-scrollbar-track { background:var(--g100); }
::-webkit-scrollbar-thumb { background:var(--grad-primary); border-radius:var(--r-full); }
::selection { background:var(--primary); color:#fff; }
