/* Naeem Insights V5.3.6 — Targeted Solutions Card Motion & Sticky Browser
   Preserves V5.3.5 content/structure and the locked V5.3.4 footer. */

/* Fix sticky browser: the former page overflow prevented reliable sticky positioning. */
body[data-page="solutions"]{overflow-x:clip}
body[data-page="solutions"] .page-main{overflow:visible!important}
body[data-page="solutions"] .sol-v535-browser-wrap{
  position:sticky!important;
  top:94px!important;
  z-index:96!important;
  padding:7px 0 4px!important;
  background:rgba(248,251,255,.975)!important;
  border-top:1px solid rgba(218,230,244,.75);
  border-bottom:1px solid #d7e4f2!important;
  box-shadow:0 8px 18px rgba(15,56,105,.055);
  backdrop-filter:blur(16px);
}
body[data-page="solutions"] .sol-v535-browser-head{margin-bottom:5px!important}
body[data-page="solutions"] .sol-v535-browser-head strong{
  display:flex;align-items:center;gap:7px;font-size:12.5px!important
}
body[data-page="solutions"] .sol-v535-browser-head strong::before{
  content:"";width:8px;height:8px;border-radius:50%;background:#1764c3;
  box-shadow:0 0 0 5px rgba(23,100,195,.09);animation:v536-browser-pulse 2.8s ease-in-out infinite
}
body[data-page="solutions"] .sol-v535-browser-head span{font-size:9.8px!important}
body[data-page="solutions"] .sol-v535-browser{padding-bottom:5px!important}
body[data-page="solutions"] .sol-v535-browser a{
  min-height:31px!important;padding:6px 10px!important;border-radius:999px!important;
  font-size:9.6px!important;background:linear-gradient(180deg,#fff,#f8fbff)!important;
}
body[data-page="solutions"] .sol-v535-browser a:hover,
body[data-page="solutions"] .sol-v535-browser a:focus{
  background:#0d57a9!important;color:#fff!important;border-color:#0d57a9!important
}
@keyframes v536-browser-pulse{0%,100%{box-shadow:0 0 0 4px rgba(23,100,195,.07)}50%{box-shadow:0 0 0 7px rgba(23,100,195,.025)}}

/* Slightly larger, clearer service number without making the card bulky. */
body[data-page="solutions"] .sol-v535-num{
  width:37px!important;height:37px!important;border-radius:10px!important;
  font-size:11.5px!important;letter-spacing:.02em!important;
  background:linear-gradient(145deg,#e8f2ff,#f5f9ff)!important;
  border:1px solid #d8e6f6;color:#0d58ac!important;
  box-shadow:0 4px 12px rgba(20,85,160,.07)
}

/* Dynamic but compact card top. */
body[data-page="solutions"] .sol-v535-card-top{
  display:grid!important;grid-template-columns:37px 1fr auto!important;
  align-items:center!important;gap:8px!important;min-height:40px
}
.sol-v536-top-motion{display:flex;align-items:center;justify-content:flex-end;min-width:72px}
.sol-v536-motion{
  display:inline-grid;place-items:center;width:68px;height:40px;
  border:1px solid #dbe7f5;border-radius:10px;
  background:linear-gradient(145deg,#fbfdff,#eef5fd);
  overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease
}
.sol-v536-motion svg{display:block;width:62px;height:38px}
.sol-v535-card:hover .sol-v536-motion{
  transform:translateY(-1px) scale(1.035);border-color:#b9d1ec;
  box-shadow:0 7px 15px rgba(18,73,136,.08),inset 0 1px 0 #fff
}

/* Animated vector vocabulary */
.sol-v536-motion .m-line,.sol-v536-motion .m-soft,.sol-v536-motion .m-gold{
  fill:none;stroke:#286cc5;stroke-width:2;stroke-linecap:round;stroke-linejoin:round
}
.sol-v536-motion .m-soft{stroke:#abc6e8;stroke-width:1.5}.sol-v536-motion .m-gold{stroke:#dea318}
.sol-v536-motion .m-dot{fill:#286cc5}.sol-v536-motion .m-gold-dot{fill:#e4aa1d}
.sol-v536-motion .m-box{fill:#eaf3ff;stroke:#286cc5;stroke-width:1.5}.sol-v536-motion .m-gold-box{fill:#fff4d4;stroke:#dea318;stroke-width:1.5}
.sol-v536-motion .m-fill{fill:#367bd1}.sol-v536-motion .m-gold-fill{fill:#e7ad22}
.sol-v536-motion .m-ai{font:800 11px/1 Inter,Aptos,"Segoe UI",Arial,sans-serif;fill:#286cc5}

.m-pulse{transform-box:fill-box;transform-origin:center;animation:v536-pulse 2.5s ease-in-out infinite var(--v536-delay)}
.m-pulse2{transform-box:fill-box;transform-origin:center;animation:v536-pulse 2.8s ease-in-out infinite calc(var(--v536-delay) + .35s)}
.m-pulse3{transform-box:fill-box;transform-origin:center;animation:v536-pulse 3s ease-in-out infinite calc(var(--v536-delay) + .65s)}
.m-float{animation:v536-float 3.8s ease-in-out infinite var(--v536-delay)}.m-float2{animation:v536-float2 4.1s ease-in-out infinite var(--v536-delay)}
.m-draw{stroke-dasharray:5 5;animation:v536-draw 4.8s linear infinite var(--v536-delay)}
.m-spin{transform-box:fill-box;transform-origin:center;animation:v536-spin 7s linear infinite var(--v536-delay)}
.m-spin-rev{transform-box:fill-box;transform-origin:center;animation:v536-spin-rev 6s linear infinite var(--v536-delay)}
.m-scan{animation:v536-scan 3.6s ease-in-out infinite var(--v536-delay)}
.m-scan-v{animation:v536-scan-v 3.2s ease-in-out infinite var(--v536-delay)}
.m-rise{transform-box:fill-box;transform-origin:center bottom;animation:v536-rise 2.9s ease-in-out infinite var(--v536-delay)}
.m-rise2{transform-box:fill-box;transform-origin:center bottom;animation:v536-rise 3.2s ease-in-out infinite calc(var(--v536-delay) + .2s)}
.m-rise3{transform-box:fill-box;transform-origin:center bottom;animation:v536-rise 3.5s ease-in-out infinite calc(var(--v536-delay) + .4s)}
.m-wave{animation:v536-wave 3s ease-in-out infinite var(--v536-delay)}.m-wave2{animation:v536-wave 3s ease-in-out infinite calc(var(--v536-delay) + .25s)}.m-wave3{animation:v536-wave 3s ease-in-out infinite calc(var(--v536-delay) + .5s)}
.m-shimmer{animation:v536-shimmer 2.9s ease-in-out infinite var(--v536-delay)}
.m-bounce{animation:v536-bounce 3.4s ease-in-out infinite var(--v536-delay)}

@keyframes v536-pulse{0%,100%{opacity:.42;transform:scale(.82)}50%{opacity:1;transform:scale(1.18)}}
@keyframes v536-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-2.5px)}}
@keyframes v536-float2{0%,100%{transform:translate(0,0)}50%{transform:translate(1px,-2px)}}
@keyframes v536-draw{to{stroke-dashoffset:-38}}
@keyframes v536-spin{to{transform:rotate(360deg)}}@keyframes v536-spin-rev{to{transform:rotate(-360deg)}}
@keyframes v536-scan{0%,100%{opacity:.35;transform:translateX(-2px)}50%{opacity:1;transform:translateX(4px)}}
@keyframes v536-scan-v{0%,100%{opacity:.35;transform:translateY(-4px)}50%{opacity:1;transform:translateY(10px)}}
@keyframes v536-rise{0%,100%{transform:scaleY(.68);opacity:.72}50%{transform:scaleY(1);opacity:1}}
@keyframes v536-wave{0%,100%{opacity:.32}50%{opacity:1}}
@keyframes v536-shimmer{0%,100%{opacity:.35;stroke-dasharray:3 8}50%{opacity:1;stroke-dasharray:14 2}}
@keyframes v536-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}

/* Card surface: preserve same dimensions/content, add depth and clearer hierarchy. */
body[data-page="solutions"] .sol-v535-card{
  border-color:#d8e5f3!important;
  background:
    radial-gradient(circle at 94% 8%,rgba(39,111,202,.055),transparent 25%),
    linear-gradient(180deg,#fff 0%,#fcfdff 100%)!important;
  box-shadow:0 5px 16px rgba(15,61,114,.035)!important
}
body[data-page="solutions"] .sol-v535-card::before{
  content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;
  border-radius:0 4px 4px 0;background:linear-gradient(#2c73d2,#e0a516);
  opacity:.45;transform:scaleY(.32);transition:transform .22s ease,opacity .22s ease
}
body[data-page="solutions"] .sol-v535-card:hover::before{transform:scaleY(1);opacity:1}
body[data-page="solutions"] .sol-v535-card:hover{
  transform:translateY(-3px)!important;border-color:#9cbce4!important;
  box-shadow:0 12px 26px rgba(15,61,114,.085)!important
}
body[data-page="solutions"] .sol-v535-card-badge{font-size:7.7px!important;padding:5px 7px!important}
body[data-page="solutions"] .sol-v535-card h3{margin-top:9px!important}

/* Keep anchor targets visible below sticky header + sticky service browser. */
body[data-page="solutions"] .sol-v535-card,
body[data-page="solutions"] .sol-v535-group{scroll-margin-top:180px}

@media(max-width:1020px){
  body[data-page="solutions"] .sol-v535-browser-wrap{top:94px!important}
  .sol-v536-motion{width:62px}.sol-v536-motion svg{width:57px}
}
@media(max-width:720px){
  body[data-page="solutions"] .sol-v535-browser-wrap{position:sticky!important;top:0!important;z-index:98!important}
  body[data-page="solutions"] .sol-v535-browser-head span{display:none}
  body[data-page="solutions"] .sol-v535-card-top{grid-template-columns:37px 1fr auto!important}
  .sol-v536-top-motion{min-width:58px}.sol-v536-motion{width:55px;height:36px}.sol-v536-motion svg{width:51px;height:33px}
  body[data-page="solutions"] .sol-v535-card,
  body[data-page="solutions"] .sol-v535-group{scroll-margin-top:120px}
}
@media(prefers-reduced-motion:reduce){
  body[data-page="solutions"] .sol-v535-browser-head strong::before,
  .sol-v536-motion *{animation:none!important;transition:none!important}
}
