/* metaSOFT International — enterprise deep-blue theme
   Plain CSS layered on top of Tailwind CDN. */

:root {
  --ms-blue-900: #0a1f44;
  --ms-blue-800: #0f2b5b;
  --ms-blue-700: #143879;
  --ms-blue-600: #0043ce;   /* primary action */
  --ms-blue-500: #0f62fe;
  --ms-blue-50:  #edf5ff;
  --ms-ink:      #161616;
  --ms-ink-2:    #393939;
  --ms-muted:    #525252;
  --ms-line:     #e0e0e0;
  --ms-bg:       #ffffff;
  --ms-bg-alt:   #f4f4f4;
  --ms-bg-dark:  #0a1f44;
  --ms-orange:      #f97316;
  --ms-orange-dark: #ea580c;
  --ms-orange-50:   #fff7ed;
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Inter', 'IBM Plex Sans', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  color: var(--ms-ink);
  background: var(--ms-bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body[dir="rtl"] {
  font-family: 'Cairo', 'IBM Plex Sans Arabic', 'Tajawal', 'Inter', system-ui, sans-serif;
}

h1, h2, h3, h4 {
  font-family: 'IBM Plex Sans', 'Inter', system-ui, sans-serif;
  letter-spacing: -0.01em;
  color: var(--ms-ink);
}
body[dir="rtl"] h1, body[dir="rtl"] h2, body[dir="rtl"] h3, body[dir="rtl"] h4 {
  font-family: 'Cairo', 'IBM Plex Sans Arabic', sans-serif;
  letter-spacing: 0;
}

/* Accent gradients */
.ms-hero-gradient {
  background:
    radial-gradient(1200px 600px at 85% -10%, rgba(15,98,254,0.35), transparent 60%),
    radial-gradient(900px 500px at 0% 100%, rgba(0,67,206,0.25), transparent 60%),
    linear-gradient(180deg, #0a1f44 0%, #0f2b5b 55%, #143879 100%);
  color: #fff;
}

.ms-dot-bg {
  background-image: radial-gradient(rgba(255,255,255,0.08) 1px, transparent 1px);
  background-size: 22px 22px;
}

.ms-card {
  background: #fff;
  border: 1px solid var(--ms-line);
  transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.ms-card:hover {
  border-color: var(--ms-blue-600);
  box-shadow: 0 10px 30px -12px rgba(15,43,91,0.18);
  transform: translateY(-2px);
}

.ms-btn {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .85rem 1.25rem;
  font-weight: 500; font-size: .95rem;
  border: 1px solid transparent;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.ms-btn-primary { background: var(--ms-orange); color: #fff; }
.ms-btn-primary:hover { background: var(--ms-orange-dark); }
.ms-btn-ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.5); }
.ms-btn-ghost:hover { background: rgba(255,255,255,.1); border-color:#fff; }
.ms-btn-outline { background: transparent; color: var(--ms-blue-700); border-color: var(--ms-blue-700); }
.ms-btn-outline:hover { background: var(--ms-blue-700); color:#fff; }

.ms-link-arrow {
  display: inline-flex; align-items: center; gap:.35rem;
  color: var(--ms-blue-700); font-weight: 500;
}
.ms-link-arrow:hover { color: var(--ms-blue-600); }
.ms-link-arrow svg { transition: transform .2s ease; }
.ms-link-arrow:hover svg { transform: translateX(3px); }
body[dir="rtl"] .ms-link-arrow:hover svg { transform: translateX(-3px) scaleX(-1); }
body[dir="rtl"] .ms-link-arrow svg { transform: scaleX(-1); }

.ms-eyebrow {
  text-transform: uppercase; letter-spacing: .12em;
  font-size: .75rem; font-weight: 600; color: var(--ms-orange);
}

.ms-section { padding: 6rem 0; }
@media (max-width: 768px) { .ms-section { padding: 4rem 0; } }

.ms-container { max-width: 1200px; margin: 0 auto; padding-left: 1.5rem; padding-right: 1.5rem; }

.ms-divider { height: 1px; background: var(--ms-line); }

/* Header */
.ms-header { border-bottom: 1px solid var(--ms-line); background: rgba(255,255,255,.85); backdrop-filter: saturate(180%) blur(10px); }
.ms-nav a { color: var(--ms-ink-2); font-weight: 500; font-size: .95rem; }
.ms-nav a:hover { color: var(--ms-blue-600); }

/* Footer */
.ms-footer { background: var(--ms-blue-900); color: #c6c6c6; }
.ms-footer a { color: #c6c6c6; }
.ms-footer a:hover { color: #fff; }
.ms-footer h4 { color:#fff; font-size:.8rem; letter-spacing:.12em; text-transform: uppercase; }

/* Pill */
.ms-pill {
  display: inline-flex; align-items: center; gap:.4rem;
  padding: .3rem .7rem; border-radius: 999px;
  background: var(--ms-blue-50); color: var(--ms-blue-700);
  font-size: .78rem; font-weight: 500;
}

/* Simple reveal animation */
.ms-reveal { opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; }
.ms-reveal.is-visible { opacity: 1; transform: translateY(0); }

/* RTL mirror small tweaks */
body[dir="rtl"] .ms-flip-rtl { transform: scaleX(-1); }

/* ─── Module page UI components ─────────────────────────────── */

/* Hero grid overlay */
.ms-hero-grid {
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 48px 48px;
}

/* Gradient icon box – used on benefit cards and feature headers */
.ms-icon-box {
  width: 3rem; height: 3rem; flex-shrink: 0;
  border-radius: .75rem;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #1d4ed8 0%, #0284c7 100%);
  color: #fff; font-size: 1.1rem;
}
.ms-icon-box-sm {
  width: 2.5rem; height: 2.5rem; flex-shrink: 0;
  border-radius: .625rem;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #1d4ed8 0%, #0284c7 100%);
  color: #fff; font-size: .875rem;
}

/* Feature highlight card */
.ms-feature-card {
  background: #fff;
  border-radius: 1rem;
  border: 1px solid var(--ms-line);
  padding: 1.5rem;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.ms-feature-card:hover {
  border-color: #bfdbfe;
  box-shadow: 0 12px 40px -12px rgba(29,78,216,.15);
}

/* Benefit card — use alongside ms-card for module pages */
.ms-benefit-card {
  background: #fff;
  border-radius: 1rem;
  border: 1px solid var(--ms-line);
  padding: 1.75rem;
  transition: border-color .2s ease, box-shadow .25s ease, transform .2s ease;
}
.ms-benefit-card:hover {
  border-color: var(--ms-blue-600);
  box-shadow: 0 16px 48px -16px rgba(29,78,216,.2);
  transform: translateY(-3px);
}

/* Dark navy section for "Part of HMS" */
.ms-dark-section { background: #0f172a; }

/* Module pill – dark bg variant */
.ms-module-pill-dark {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .45rem 1rem;
  border-radius: 9999px;
  font-size: .875rem; font-weight: 500;
  background: rgba(255,255,255,.07);
  color: rgba(255,255,255,.75);
  border: 1px solid rgba(255,255,255,.14);
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.ms-module-pill-dark:hover {
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.28);
  color: #fff;
}

/* Stat block used in hero */
.ms-stat-val { font-size: 1.875rem; font-weight: 700; color: var(--ms-orange); line-height: 1; }
.ms-stat-lbl { font-size: .8rem; color: rgba(255,255,255,.48); margin-top: .25rem; }

/* Check list for feature bullets */
.ms-check-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .6rem; }
.ms-check-list li { display: flex; gap: .6rem; align-items: flex-start; font-size: .875rem; color: var(--ms-muted); line-height: 1.5; }

/* ─── Mega menu ──────────────────────────────────────────── */
.ms-mega-wrapper { position: relative; display: inline-flex; align-items: center; }

@keyframes ms-mega-in {
  from { opacity: 0; transform: translateY(-8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.ms-mega-panel {
  position: fixed;
  top: 64px; left: 0; right: 0;
  background: #ffffff;
  border-top: 3px solid #1d4ed8;
  box-shadow: 0 8px 40px -4px rgba(10,31,68,.14), 0 2px 8px rgba(10,31,68,.08);
  z-index: 38;
  display: none;
}
.ms-mega-panel.is-open {
  display: block;
  animation: ms-mega-in .18s cubic-bezier(.16,1,.3,1) both;
}
@media (max-width: 1023px) { .ms-mega-panel { display: none !important; } }

.ms-mega-col-label {
  font-size: .65rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  color: #1d4ed8;
  padding-bottom: .55rem; margin-bottom: .65rem;
  border-bottom: 1px solid #e8f0fe;
}

.ms-mega-item {
  display: flex; align-items: flex-start; gap: .8rem;
  padding: .6rem .7rem; border-radius: .6rem;
  text-decoration: none;
  transition: background .12s ease, box-shadow .12s ease;
  margin-bottom: .1rem;
}
.ms-mega-item:hover { background: #eff6ff; }

.ms-mega-item-name {
  display: block; font-size: .875rem; font-weight: 600;
  color: #0a1f44; line-height: 1.3;
  transition: color .12s ease;
}
.ms-mega-item:hover .ms-mega-item-name { color: #1d4ed8; }

.ms-mega-item-desc {
  display: block; font-size: .72rem;
  color: #64748b; margin-top: .15rem; line-height: 1.45;
}

.ms-mega-sub-link {
  display: flex; align-items: center; gap: .45rem;
  font-size: .78rem; font-weight: 500;
  color: #334155;
  text-decoration: none; transition: color .12s ease;
}
.ms-mega-sub-link:hover { color: #1d4ed8; }

.ms-mega-all-link {
  display: inline-flex; align-items: center; gap: .45rem;
  font-size: .8rem; font-weight: 600; color: #1d4ed8;
  text-decoration: none;
  transition: color .15s ease, gap .15s ease;
}
.ms-mega-all-link:hover { color: #0a1f44; gap: .6rem; }


/* ═══════════════════════════════════════════════════════════
   UI INITIATIVE ADDITIONS
   ═══════════════════════════════════════════════════════════ */

/* DARK MODE */
[data-theme="dark"] {
  --ms-bg:#0f172a;--ms-bg-alt:#1e293b;--ms-ink:#e2e8f0;--ms-ink-2:#cbd5e1;
  --ms-muted:#94a3b8;--ms-line:#334155;--ms-blue-50:#1e3a5f;
}
[data-theme="dark"] body { background:#0f172a; }
[data-theme="dark"] .ms-header { background:rgba(15,23,42,.96) !important;border-color:#334155; }
[data-theme="dark"] .ms-card { background:#1e293b;border-color:#334155; }
[data-theme="dark"] .ms-card h3,[data-theme="dark"] .ms-card h4 { color:#e2e8f0; }
[data-theme="dark"] h1,[data-theme="dark"] h2,[data-theme="dark"] h3,[data-theme="dark"] h4 { color:#e2e8f0; }
[data-theme="dark"] .ms-mega-panel { background:#1e293b; }
[data-theme="dark"] .ms-mega-col-label { color:#60a5fa;border-color:#334155; }
[data-theme="dark"] .ms-mega-item-name { color:#e2e8f0; }
[data-theme="dark"] .ms-mega-item:hover { background:#334155; }
[data-theme="dark"] .ms-mega-item-desc { color:#64748b; }
[data-theme="dark"] .ms-mega-all-link { color:#60a5fa; }
[data-theme="dark"] .ms-mega-panel > div:last-child { background:#111827 !important;border-color:#334155 !important; }
[data-theme="dark"] .tp-pill { background:#334155;color:#93c5fd;border-color:#475569; }
[data-theme="dark"] .tp-cat-icon { background:#1e3a5f; }
[data-theme="dark"] .tp-ha-card { background:#1e293b;border-color:#334155; }
[data-theme="dark"] .bg-white { background:#1e293b !important; }

.ms-dark-toggle {
  width:2rem;height:2rem;border:none;background:none;cursor:pointer;
  color:var(--ms-ink-2);display:inline-flex;align-items:center;justify-content:center;
  border-radius:.4rem;transition:background .15s,color .15s;flex-shrink:0;
}
.ms-dark-toggle:hover { background:var(--ms-bg-alt);color:var(--ms-ink); }

/* COMMAND PALETTE */
.ms-cmd-overlay {
  position:fixed;inset:0;background:rgba(10,31,68,.55);
  backdrop-filter:blur(4px);z-index:300;
  display:none;align-items:flex-start;justify-content:center;padding-top:12vh;
}
.ms-cmd-overlay.is-open { display:flex;animation:ms-cmd-fade .15s ease both; }
@keyframes ms-cmd-fade { from{opacity:0}to{opacity:1} }
.ms-cmd-box {
  width:100%;max-width:560px;margin:0 1rem;background:#fff;border-radius:1rem;
  box-shadow:0 24px 80px -10px rgba(0,0,0,.35),0 0 0 1px rgba(0,0,0,.06);overflow:hidden;
}
[data-theme="dark"] .ms-cmd-box { background:#1e293b;box-shadow:0 24px 80px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.06); }
.ms-cmd-input-row { display:flex;align-items:center;gap:.75rem;padding:.9rem 1.25rem;border-bottom:1px solid #e8f0fe; }
[data-theme="dark"] .ms-cmd-input-row { border-color:#334155; }
.ms-cmd-input-row svg { color:#94a3b8;flex-shrink:0; }
.ms-cmd-input { flex:1;border:none;outline:none;font-size:1rem;background:transparent;color:var(--ms-ink);font-family:inherit; }
.ms-cmd-input::placeholder { color:#94a3b8; }
[data-theme="dark"] .ms-cmd-input { color:#e2e8f0; }
.ms-cmd-results { max-height:360px;overflow-y:auto;padding:.5rem; }
.ms-cmd-group-label { font-size:.65rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8;padding:.5rem .75rem .3rem; }
.ms-cmd-item {
  display:flex;align-items:center;gap:.75rem;padding:.625rem .75rem;border-radius:.5rem;
  cursor:pointer;text-decoration:none;transition:background .1s;
}
.ms-cmd-item:hover,.ms-cmd-item.is-active { background:#eff6ff; }
[data-theme="dark"] .ms-cmd-item:hover,[data-theme="dark"] .ms-cmd-item.is-active { background:#334155; }
.ms-cmd-item-icon { width:2rem;height:2rem;border-radius:.4rem;display:flex;align-items:center;justify-content:center;flex-shrink:0; }
.ms-cmd-item-name { display:block;font-size:.875rem;font-weight:600;color:var(--ms-ink);line-height:1.3; }
[data-theme="dark"] .ms-cmd-item-name { color:#e2e8f0; }
.ms-cmd-item-cat { display:block;font-size:.7rem;color:#64748b;margin-top:.1rem; }
.ms-cmd-empty { padding:2rem;text-align:center;font-size:.875rem;color:#94a3b8; }
.ms-cmd-footer { border-top:1px solid #e8f0fe;padding:.5rem 1.25rem;display:flex;gap:1.25rem;align-items:center; }
[data-theme="dark"] .ms-cmd-footer { border-color:#334155; }
.ms-cmd-shortcut { display:inline-flex;align-items:center;gap:.35rem;font-size:.7rem;color:#94a3b8; }
.ms-cmd-shortcut kbd {
  display:inline-flex;align-items:center;justify-content:center;padding:.15rem .4rem;
  border-radius:.3rem;background:#f1f5f9;border:1px solid #e2e8f0;font-size:.65rem;
  font-family:inherit;color:#475569;min-width:1.4rem;
}
[data-theme="dark"] .ms-cmd-shortcut kbd { background:#334155;border-color:#475569;color:#94a3b8; }
.ms-cmd-trigger {
  display:none;align-items:center;gap:.5rem;padding:.35rem .75rem;
  border:1px solid var(--ms-line);border-radius:.5rem;font-size:.78rem;
  color:var(--ms-muted);cursor:pointer;background:transparent;font-family:inherit;
  transition:border-color .15s,background .15s;
}
@media(min-width:1024px){ .ms-cmd-trigger{ display:inline-flex; } }
.ms-cmd-trigger:hover { border-color:#1d4ed8;background:var(--ms-blue-50); }
.ms-cmd-trigger kbd { padding:.1rem .4rem;border-radius:.25rem;background:var(--ms-bg-alt);border:1px solid var(--ms-line);font-size:.65rem; }

/* STAGGER ANIMATIONS */
.ms-stagger > * { opacity:0;transform:translateY(22px);transition:opacity .5s ease,transform .5s ease; }
.ms-stagger.is-visible > *:nth-child(1)  { opacity:1;transform:none;transition-delay:0ms }
.ms-stagger.is-visible > *:nth-child(2)  { opacity:1;transform:none;transition-delay:60ms }
.ms-stagger.is-visible > *:nth-child(3)  { opacity:1;transform:none;transition-delay:120ms }
.ms-stagger.is-visible > *:nth-child(4)  { opacity:1;transform:none;transition-delay:180ms }
.ms-stagger.is-visible > *:nth-child(5)  { opacity:1;transform:none;transition-delay:240ms }
.ms-stagger.is-visible > *:nth-child(6)  { opacity:1;transform:none;transition-delay:300ms }
.ms-stagger.is-visible > *:nth-child(7)  { opacity:1;transform:none;transition-delay:360ms }
.ms-stagger.is-visible > *:nth-child(8)  { opacity:1;transform:none;transition-delay:420ms }
.ms-stagger.is-visible > *:nth-child(9)  { opacity:1;transform:none;transition-delay:480ms }
.ms-stagger.is-visible > *:nth-child(n+10) { opacity:1;transform:none;transition-delay:540ms }

/* FLOATING WIDGET */
.ms-float-widget { position:fixed;bottom:2rem;right:2rem;z-index:150;display:flex;flex-direction:column;align-items:flex-end;gap:.75rem; }
.ms-float-btn {
  display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 1.2rem;
  background:var(--ms-orange);color:#fff;border:none;border-radius:9999px;
  cursor:pointer;font-size:.85rem;font-weight:600;font-family:inherit;
  box-shadow:0 4px 20px rgba(249,115,22,.4);transition:background .15s,transform .15s,box-shadow .15s;white-space:nowrap;
}
.ms-float-btn:hover { background:var(--ms-orange-dark);transform:translateY(-2px);box-shadow:0 8px 28px rgba(249,115,22,.5); }
.ms-float-card {
  background:#fff;border-radius:1rem;width:290px;
  box-shadow:0 16px 60px rgba(0,0,0,.18),0 0 0 1px rgba(0,0,0,.06);
  overflow:hidden;display:none;flex-direction:column;
}
[data-theme="dark"] .ms-float-card { background:#1e293b; }
.ms-float-card.is-open { display:flex;animation:ms-float-in .2s ease both; }
@keyframes ms-float-in { from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none} }
.ms-float-card-head { background:linear-gradient(135deg,#0a1f44,#1d4ed8);padding:1.1rem 1.25rem;color:#fff;display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem; }
.ms-float-card-head h4 { font-size:.9rem;font-weight:700;margin:0;line-height:1.3;color:#fff; }
.ms-float-card-head p { font-size:.72rem;color:rgba(255,255,255,.65);margin:.25rem 0 0;line-height:1.4; }
.ms-float-close { background:rgba(255,255,255,.15);border:none;border-radius:.375rem;width:1.75rem;height:1.75rem;cursor:pointer;color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0; }
.ms-float-close:hover { background:rgba(255,255,255,.25); }
.ms-float-card-body { padding:1.1rem;display:flex;flex-direction:column;gap:.6rem; }
.ms-float-input {
  width:100%;padding:.55rem .8rem;border:1px solid var(--ms-line);border-radius:.5rem;
  font-size:.82rem;font-family:inherit;color:var(--ms-ink);background:var(--ms-bg);
  outline:none;box-sizing:border-box;transition:border-color .15s;
}
.ms-float-input:focus { border-color:#1d4ed8; }
[data-theme="dark"] .ms-float-input { background:#0f172a;color:#e2e8f0; }
.ms-float-submit { width:100%;padding:.6rem;background:#1d4ed8;color:#fff;border:none;border-radius:.5rem;font-size:.85rem;font-weight:600;font-family:inherit;cursor:pointer;transition:background .15s; }
.ms-float-submit:hover { background:#1e40af; }
.ms-float-success { text-align:center;padding:1.5rem 1.1rem;font-size:.875rem;color:#059669;font-weight:600; }

/* GLASS CARDS */
.ms-glass-card { backdrop-filter:blur(12px) saturate(180%);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:1rem;transition:background .2s,border-color .2s; }
.ms-glass-card:hover { background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.28); }

/* INTERACTIVE LAYER ROWS */
.tp-layer-row { display:flex;gap:1rem;align-items:flex-start;padding:.875rem 1rem;border-radius:.75rem;cursor:pointer;border:1px solid #e2e8f0;background:#f8fafc;transition:border-color .15s,background .15s,box-shadow .15s;margin-bottom:.5rem; }
.tp-layer-row:hover { border-color:#93c5fd;background:#f0f7ff; }
.tp-layer-row.is-active { border-color:#1d4ed8;background:#eff6ff;box-shadow:0 0 0 3px rgba(29,78,216,.08); }
.tp-layer-row.is-active .tp-layer-num { background:#1d4ed8; }
.tp-layer-detail { display:none;margin-bottom:.5rem;padding:.875rem 1rem 1rem;border-radius:.75rem;background:#fff;border:1px solid #bfdbfe;font-size:.8rem;line-height:1.65;color:#334155;animation:ms-cmd-fade .2s ease both; }
.tp-layer-detail.is-open { display:block; }
[data-theme="dark"] .tp-layer-row { background:#1e293b;border-color:#334155; }
[data-theme="dark"] .tp-layer-row:hover { background:#334155;border-color:#60a5fa; }
[data-theme="dark"] .tp-layer-detail { background:#1e293b;border-color:#334155;color:#cbd5e1; }

/* REGION MAP */
.ms-map-section { background:#0a1f44;padding:5rem 0; }
.ms-map-container { position:relative;width:100%;max-width:820px;margin:0 auto;border-radius:1.25rem;overflow:hidden;border:1px solid rgba(255,255,255,.08); }
.ms-map-svg { width:100%;height:auto;display:block; }
.ms-map-dot-group { cursor:pointer; }
.ms-map-dot-group circle.pulse { animation:map-pulse 2.5s ease-out infinite; }
.ms-map-dot-group:nth-child(2n) circle.pulse { animation-delay:.6s; }
.ms-map-dot-group:nth-child(3n) circle.pulse { animation-delay:1.3s; }
.ms-map-dot-group:nth-child(5n) circle.pulse { animation-delay:1.9s; }
@keyframes map-pulse { 0%{r:6;opacity:.7}70%{r:16;opacity:0}100%{r:6;opacity:0} }
.ms-map-dot-group text { font-family:inherit;fill:rgba(0,0,0,0);transition:fill .2s;pointer-events:none;font-size:10px;font-weight:600; }
.ms-map-dot-group:hover text { fill:rgba(255,255,255,.95); }
.ms-map-stat-row { display:flex;flex-wrap:wrap;justify-content:center;gap:3rem;margin-top:2.5rem; }
.ms-map-stat { text-align:center; }
.ms-map-stat-num { font-size:2.25rem;font-weight:700;color:#fff;line-height:1; }
.ms-map-stat-lbl { font-size:.7rem;color:rgba(255,255,255,.4);text-transform:uppercase;letter-spacing:.12em;margin-top:.35rem; }

/* COMPARISON TABLE */
.ms-compare-check { display:flex;align-items:center;gap:.5rem;margin-top:1rem;font-size:.78rem;font-weight:500;color:var(--ms-muted);cursor:pointer;user-select:none; }
.ms-compare-check input { accent-color:#1d4ed8;width:1rem;height:1rem;cursor:pointer; }
.ms-compare-bar {
  position:fixed;bottom:0;left:0;right:0;background:#0a1f44;color:#fff;
  padding:.875rem 1.5rem;display:none;align-items:center;justify-content:space-between;
  gap:1rem;z-index:100;box-shadow:0 -4px 24px rgba(0,0,0,.3);flex-wrap:wrap;
}
.ms-compare-bar.is-open { display:flex;animation:ms-bar-in .2s ease both; }
@keyframes ms-bar-in { from{transform:translateY(100%)}to{transform:none} }
.ms-compare-bar-items { display:flex;gap:.5rem;align-items:center;flex-wrap:wrap; }
.ms-compare-chip { display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .75rem;background:rgba(255,255,255,.12);border-radius:9999px;font-size:.78rem;font-weight:500; }
.ms-compare-chip button { background:none;border:none;cursor:pointer;color:rgba(255,255,255,.6);padding:0;line-height:1; }
.ms-compare-chip button:hover { color:#fff; }
.ms-compare-actions { display:flex;gap:.75rem;align-items:center;flex-shrink:0; }
.ms-compare-btn { padding:.55rem 1.1rem;border-radius:.5rem;font-size:.82rem;font-weight:600;cursor:pointer;font-family:inherit;border:none;transition:background .15s; }
.ms-compare-btn-primary { background:var(--ms-orange);color:#fff; }
.ms-compare-btn-primary:hover { background:var(--ms-orange-dark); }
.ms-compare-btn-clear { background:rgba(255,255,255,.1);color:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.15); }
.ms-compare-btn-clear:hover { background:rgba(255,255,255,.18);color:#fff; }
.ms-compare-modal-overlay { position:fixed;inset:0;background:rgba(10,31,68,.6);backdrop-filter:blur(4px);z-index:200;display:none;align-items:flex-start;justify-content:center;padding:3rem 1rem;overflow-y:auto; }
.ms-compare-modal-overlay.is-open { display:flex;animation:ms-cmd-fade .2s ease both; }
.ms-compare-modal { background:#fff;border-radius:1.25rem;width:100%;max-width:900px;box-shadow:0 24px 80px rgba(0,0,0,.25);overflow:hidden; }
[data-theme="dark"] .ms-compare-modal { background:#1e293b; }
.ms-compare-modal-head { padding:1.5rem 2rem;border-bottom:1px solid var(--ms-line);display:flex;align-items:center;justify-content:space-between; }
.ms-compare-modal-head h3 { font-size:1.1rem;font-weight:700;margin:0;color:var(--ms-ink); }
.ms-compare-modal-close { background:none;border:none;cursor:pointer;color:var(--ms-muted);font-size:1.4rem;padding:.25rem;line-height:1; }
.ms-compare-modal-close:hover { color:var(--ms-ink); }
.ms-compare-table { width:100%;border-collapse:collapse; }
.ms-compare-table th,.ms-compare-table td { padding:.875rem 1.25rem;text-align:left;border-bottom:1px solid var(--ms-line);font-size:.85rem; }
.ms-compare-table th { background:#f8fafc;font-weight:600;font-size:.75rem;color:var(--ms-muted);text-transform:uppercase;letter-spacing:.06em; }
[data-theme="dark"] .ms-compare-table th { background:#111827;color:#64748b; }
.ms-compare-table tr:last-child td { border-bottom:none; }
.ms-compare-table td:first-child { color:var(--ms-muted);font-size:.78rem;font-weight:500; }
.ms-check-yes { color:#059669;font-weight:700;font-size:1rem; }
.ms-check-no  { color:#e2e8f0; }

/* ═══════════════════════════════════════════════════════
   SITE-WIDE ANIMATION LAYER
═══════════════════════════════════════════════════════ */

/* Scroll progress bar */
.ms-scroll-bar {
  position:fixed;top:0;left:0;height:3px;width:0%;z-index:9999;
  background:linear-gradient(90deg,#f97316 0%,#1d4ed8 60%,#8cb4ff 100%);
  transition:width .08s linear;pointer-events:none;
}

/* ── Hero entrance animations ─────────────────────── */
@keyframes ms-hero-up {
  from { opacity:0; transform:translateY(28px) scale(.98); filter:blur(4px); }
  to   { opacity:1; transform:none; filter:none; }
}
.ms-hero-gradient .ms-eyebrow { animation:ms-hero-up .8s cubic-bezier(.16,1,.3,1) .05s both; }
.ms-hero-gradient h1          { animation:ms-hero-up .9s cubic-bezier(.16,1,.3,1) .18s both; }
.ms-hero-gradient > .ms-container > div > p,
.ms-hero-gradient > .ms-container > div > div > p {
                                animation:ms-hero-up .9s cubic-bezier(.16,1,.3,1) .32s both; }
.ms-hero-gradient .flex.flex-wrap.gap-3 { animation:ms-hero-up .9s cubic-bezier(.16,1,.3,1) .46s both; }
.ms-hero-gradient dl          { animation:ms-hero-up .9s cubic-bezier(.16,1,.3,1) .6s both; }

/* ── Scroll reveal — blur-slide-up ───────────────── */
.ms-reveal {
  opacity:0;
  transform:translateY(22px);
  filter:blur(6px);
  transition:opacity .75s cubic-bezier(.16,1,.3,1),
             transform .75s cubic-bezier(.16,1,.3,1),
             filter .6s ease;
}
.ms-reveal.is-visible { opacity:1; transform:none; filter:none; }

/* ── Card hover: lift + glow shadow ──────────────── */
.ms-card {
  position:relative;overflow:hidden;
  transition:transform .28s cubic-bezier(.34,1.56,.64,1),
             box-shadow .28s ease;
}
.ms-card:hover {
  transform:translateY(-5px) scale(1.013);
  box-shadow:0 18px 48px rgba(10,31,68,.14), 0 0 0 1.5px rgba(29,78,216,.18);
}

/* Card shimmer sweep on hover */
.ms-card::after {
  content:'';position:absolute;inset:0;
  background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.1) 50%,transparent 65%);
  transform:translateX(-100%);transition:transform .55s ease;
  pointer-events:none;border-radius:inherit;
}
.ms-card:hover::after { transform:translateX(100%); }

/* ── Button: ripple on click ─────────────────────── */
.ms-btn { position:relative;overflow:hidden; }
.ms-ripple {
  position:absolute;border-radius:50%;
  background:rgba(255,255,255,.32);
  transform:scale(0);animation:ms-ripple-go .55s ease-out forwards;
  pointer-events:none;
}
@keyframes ms-ripple-go {
  to { transform:scale(4.5); opacity:0; }
}

/* ── CTA button pulse glow ───────────────────────── */
@keyframes ms-btn-glow {
  0%,100% { box-shadow:0 0 0 0 rgba(249,115,22,.4); }
  50%     { box-shadow:0 0 0 8px rgba(249,115,22,0); }
}
.ms-btn-primary { animation:ms-btn-glow 2.8s ease-in-out infinite; }
.ms-btn-primary:hover { animation:none; }

/* ── Floating animation (hero right panel) ───────── */
@keyframes ms-float {
  0%,100% { transform:translateY(0px); }
  50%     { transform:translateY(-9px); }
}
.ms-hero-float { animation:ms-float 5s ease-in-out infinite; }

/* ── Stagger children: improved easing ──────────── */
.ms-stagger > * {
  opacity:0;
  transform:translateY(20px) scale(.98);
  transition:opacity .6s cubic-bezier(.16,1,.3,1),
             transform .6s cubic-bezier(.16,1,.3,1);
}
.ms-stagger.is-visible > * { opacity:1; transform:none; }
.ms-stagger.is-visible > *:nth-child(1) { transition-delay:.04s; }
.ms-stagger.is-visible > *:nth-child(2) { transition-delay:.1s; }
.ms-stagger.is-visible > *:nth-child(3) { transition-delay:.16s; }
.ms-stagger.is-visible > *:nth-child(4) { transition-delay:.22s; }
.ms-stagger.is-visible > *:nth-child(5) { transition-delay:.28s; }
.ms-stagger.is-visible > *:nth-child(6) { transition-delay:.34s; }
.ms-stagger.is-visible > *:nth-child(7) { transition-delay:.40s; }
.ms-stagger.is-visible > *:nth-child(8) { transition-delay:.46s; }
.ms-stagger.is-visible > *:nth-child(9) { transition-delay:.52s; }

/* ── Trust-bar logo hover ────────────────────────── */
.ms-trust-logo { transition:filter .3s,transform .3s; }
.ms-trust-logo:hover { filter:grayscale(0%) opacity(1) !important; transform:scale(1.08); }

/* ── Section eyebrow shimmer ─────────────────────── */
@keyframes ms-eyebrow-in {
  from { opacity:0; letter-spacing:.4em; }
  to   { opacity:1; letter-spacing:.12em; }
}
.ms-reveal.is-visible .ms-eyebrow,
.is-visible.ms-eyebrow {
  animation:ms-eyebrow-in .7s ease both;
}

/* ── Map container — image background ───────────── */
.ms-map-container {
  position:relative;width:100%;max-width:820px;margin:0 auto;
  border-radius:1.25rem;overflow:hidden;border:1px solid rgba(255,255,255,.08);
}

/* ── Nav link animated underline ─────────────────── */
.ms-nav a {
  position:relative;
}
.ms-nav a::after {
  content:'';position:absolute;left:0;bottom:-3px;width:0;height:2px;
  background:var(--ms-orange);border-radius:2px;
  transition:width .25s cubic-bezier(.16,1,.3,1);
}
.ms-nav a:hover::after { width:100%; }

/* ── Stat counter flip-in ────────────────────────── */
@keyframes ms-stat-in {
  from { transform:translateY(-60%);opacity:0; }
  to   { transform:none;opacity:1; }
}
[data-count].is-counted { animation:ms-stat-in .45s cubic-bezier(.34,1.56,.64,1) both; }

/* ═══════════════════════════════════════════════════════
   EXTENDED ANIMATION EFFECTS
═══════════════════════════════════════════════════════ */

/* ── Cursor spotlight ────────────────────────────── */
.ms-spotlight {
  position:fixed;pointer-events:none;z-index:1;
  width:480px;height:480px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(29,78,216,.13) 0%,rgba(29,78,216,.04) 40%,transparent 70%);
  opacity:0;transition:opacity .4s ease;
  will-change:left,top;
}

/* ── Gradient animated eyebrow text ─────────────── */
@keyframes ms-grad-shift {
  0%   { background-position:0% 50%; }
  50%  { background-position:100% 50%; }
  100% { background-position:0% 50%; }
}
.ms-hero-gradient .ms-eyebrow {
  background:linear-gradient(90deg,#8cb4ff,#f97316,#8cb4ff);
  background-size:200% auto;
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
  animation:ms-hero-up .8s cubic-bezier(.16,1,.3,1) .05s both,
            ms-grad-shift 4s ease infinite 1s;
  color:transparent;
}

/* ── Section shimmer bg ──────────────────────────── */
@keyframes ms-section-shimmer {
  0%   { background-position:200% center; }
  100% { background-position:-200% center; }
}
.ms-section-shimmer {
  background:linear-gradient(105deg,var(--ms-bg) 40%,rgba(237,245,255,.6) 50%,var(--ms-bg) 60%);
  background-size:300% 100%;
  animation:ms-section-shimmer 8s linear infinite;
}
[data-theme="dark"] .ms-section-shimmer {
  background:linear-gradient(105deg,var(--ms-bg) 40%,rgba(30,58,138,.15) 50%,var(--ms-bg) 60%);
  background-size:300% 100%;
}

/* ── Card: animated border glow on hover ─────────── */
@keyframes ms-border-glow {
  0%,100% { box-shadow:0 18px 48px rgba(10,31,68,.14),0 0 0 1.5px rgba(29,78,216,.18); }
  50%     { box-shadow:0 22px 56px rgba(29,78,216,.2), 0 0 0 1.5px rgba(249,115,22,.35); }
}
.ms-card:hover { animation:ms-border-glow 2s ease-in-out infinite; }

/* ── Reveal: slide from left/right for feature rows ─ */
@keyframes ms-slide-left  { from{opacity:0;transform:translateX(-30px)} to{opacity:1;transform:none} }
@keyframes ms-slide-right { from{opacity:0;transform:translateX(30px)} to{opacity:1;transform:none} }
.ms-reveal-left  { opacity:0; }
.ms-reveal-right { opacity:0; }
.ms-reveal-left.is-visible  { animation:ms-slide-left  .75s cubic-bezier(.16,1,.3,1) both; }
.ms-reveal-right.is-visible { animation:ms-slide-right .75s cubic-bezier(.16,1,.3,1) both; }

/* ── Hero canvas: brighter glow ─────────────────── */
canvas[style*="position:absolute"] { mix-blend-mode:screen; }

/* ── Image hover zoom (applied via JS) ───────────── */
.ms-card figure, .ms-card .img-wrap { overflow:hidden; }

/* ── Animated gradient on section eyebrows ────────── */
section .ms-eyebrow {
  transition: letter-spacing .6s ease;
}
section .ms-eyebrow.is-visible { letter-spacing:.14em; }

/* ── Floating dots decoration on hero ────────────── */
@keyframes ms-dot-float {
  0%,100% { transform:translateY(0) scale(1); opacity:.6; }
  50%     { transform:translateY(-16px) scale(1.1); opacity:1; }
}
.ms-hero-decoration {
  position:absolute;border-radius:50%;pointer-events:none;
  animation:ms-dot-float var(--dur,5s) ease-in-out infinite;
  animation-delay:var(--delay,0s);
  background:var(--col,rgba(249,115,22,.5));
  filter:blur(1px);
}

/* ── Number count-up: scale-bounce ──────────────── */
@keyframes ms-num-bounce {
  0%   { transform:scale(.8);   opacity:0; }
  60%  { transform:scale(1.12); opacity:1; }
  100% { transform:scale(1);    opacity:1; }
}
[data-count].is-counted {
  animation:ms-num-bounce .55s cubic-bezier(.34,1.56,.64,1) both;
}

/* ── HA cards: slide up on reveal ───────────────── */
.tp-ha-card {
  transition: transform .3s cubic-bezier(.34,1.2,.64,1), box-shadow .3s ease;
}
.tp-ha-card:hover {
  transform:translateX(6px);
  box-shadow:4px 0 0 0 #1d4ed8, 0 8px 24px rgba(10,31,68,.1);
}

/* ── Tech stack card ─────────────────────────────── */
.tp-stack-card {
  background:#fff;
  border:1px solid #cdd5e3;
  border-top:3px solid #1e3a8a;
  border-radius:.75rem;
  padding:1.5rem;
  transition:transform .25s cubic-bezier(.16,1,.3,1),box-shadow .25s;
}
.tp-stack-card:hover {
  transform:translateY(-4px);
  box-shadow:0 16px 40px rgba(30,58,138,.1),0 4px 10px rgba(0,0,0,.05);
}
.tp-stack-head {
  display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;
}
.tp-stack-icon {
  width:36px;height:36px;border-radius:.45rem;
  display:flex;align-items:center;justify-content:center;
  font-size:.85rem;flex-shrink:0;
}
.tp-stack-title {
  font-size:.82rem;font-weight:700;color:#0c1e3e;letter-spacing:.01em;
  text-transform:uppercase;
}

/* ── Tech pill hover ─────────────────────────────── */
.tp-pill {
  transition:background .2s,color .2s,transform .2s,box-shadow .2s;
  cursor:default;
}
.tp-pill:hover {
  background:#dbeafe;color:#1d4ed8;border-color:#93c5fd;
  transform:translateY(-2px) scale(1.04);
  box-shadow:0 4px 12px rgba(29,78,216,.15);
}

/* ── Standards card hover ────────────────────────── */
.tp-std-card {
  transition:background .25s,transform .25s,border-color .25s;
}
.tp-std-card:hover {
  background:rgba(255,255,255,.12);
  border-color:rgba(255,255,255,.25);
  transform:translateY(-4px);
}

/* ── Scroll progress bar polish ─────────────────── */
.ms-scroll-bar {
  box-shadow:0 0 8px rgba(249,115,22,.5);
}

/* ── Footer link hover ───────────────────────────── */
.ms-footer a { transition:color .2s,padding-left .2s; }
.ms-footer a:hover { padding-left:4px; }

/* ═══════════════════════════════════════════════════════
   FEATURE BLOCK: CAROUSEL, WHATSAPP, RTL, TIMELINE,
   STICKY CTA, COOKIE, BACK-TO-TOP, SVG DASHBOARD
═══════════════════════════════════════════════════════ */

/* ── Logo marquee carousel ─────────────────────────── */
.ms-marquee-wrap { overflow:hidden;position:relative; }
.ms-marquee-wrap::before,.ms-marquee-wrap::after {
  content:'';position:absolute;top:0;bottom:0;width:100px;z-index:2;pointer-events:none;
}
.ms-marquee-wrap::before { left:0;background:linear-gradient(90deg,var(--ms-bg-alt),transparent); }
.ms-marquee-wrap::after  { right:0;background:linear-gradient(-90deg,var(--ms-bg-alt),transparent); }
.ms-marquee { display:flex;animation:ms-marquee-scroll 32s linear infinite;width:max-content; }
.ms-marquee:hover { animation-play-state:paused; }
@keyframes ms-marquee-scroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.ms-marquee-item { flex-shrink:0;width:160px;display:flex;align-items:center;justify-content:center;padding:0 20px; }
.ms-marquee-item img { max-height:60px;max-width:120px;filter:grayscale(100%) opacity(.5);object-fit:contain;transition:filter .3s,transform .3s; }
.ms-marquee-item img:hover { filter:grayscale(0%) opacity(1);transform:scale(1.08); }


/* ── Back to top button ────────────────────────────── */
.ms-back-top {
  position:fixed;bottom:36px;right:20px;z-index:200;
  width:44px;height:44px;border-radius:50%;
  background:#0a1f44;color:#fff;border:2px solid rgba(255,255,255,.15);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  opacity:0;transform:translateY(12px);
  transition:opacity .3s,transform .3s,background .2s;
  box-shadow:0 4px 14px rgba(10,31,68,.3);
}
.ms-back-top.is-visible { opacity:1;transform:none; }
.ms-back-top:hover { background:#1d4ed8;border-color:rgba(255,255,255,.3); }


/* ── Sticky sidebar CTA ────────────────────────────── */
.ms-sticky-cta {
  position:fixed;right:0;top:50%;transform:translateY(-50%) translateX(100%);
  z-index:150;transition:transform .4s cubic-bezier(.16,1,.3,1);
}
.ms-sticky-cta.is-visible { transform:translateY(-50%) translateX(0); }
.ms-sticky-cta-inner {
  writing-mode:vertical-rl;text-orientation:mixed;
  background:#f97316;color:#fff;font-size:.78rem;font-weight:700;
  font-family:Inter,sans-serif;letter-spacing:.06em;
  padding:1rem .6rem;border-radius:.5rem 0 0 .5rem;
  cursor:pointer;text-decoration:none;
  display:flex;align-items:center;gap:.5rem;
  box-shadow:-4px 0 16px rgba(249,115,22,.35);
  transition:background .2s,box-shadow .2s;
  white-space:nowrap;
}
.ms-sticky-cta-inner:hover { background:#ea580c;box-shadow:-6px 0 20px rgba(249,115,22,.5); }

/* ── Cookie consent banner ─────────────────────────── */
.ms-cookie-bar {
  position:fixed;bottom:0;left:0;right:0;z-index:300;
  background:#0a1f44;border-top:1px solid rgba(255,255,255,.1);
  padding:1rem 1.5rem;display:flex;align-items:center;
  justify-content:space-between;gap:1rem;flex-wrap:wrap;
  transform:translateY(100%);transition:transform .4s cubic-bezier(.16,1,.3,1);
  box-shadow:0 -4px 24px rgba(0,0,0,.3);
}
.ms-cookie-bar.is-visible { transform:none; }
.ms-cookie-bar p { color:rgba(255,255,255,.75);font-size:.82rem;margin:0;max-width:640px;font-family:Inter,sans-serif; }
.ms-cookie-bar a { color:#8cb4ff;text-decoration:underline; }
.ms-cookie-actions { display:flex;gap:.5rem;flex-shrink:0; }
.ms-cookie-btn { padding:.45rem 1rem;border-radius:.5rem;font-size:.8rem;font-weight:600;cursor:pointer;font-family:inherit;border:none;transition:background .15s; }
.ms-cookie-accept { background:#1d4ed8;color:#fff; }
.ms-cookie-accept:hover { background:#1e40af; }
.ms-cookie-decline { background:rgba(255,255,255,.08);color:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.15); }
.ms-cookie-decline:hover { background:rgba(255,255,255,.15);color:#fff; }


/* ── Solutions section ─────────────────────────────── */
.ms-solutions-section {
  background: #e8edf5;
  padding: 5rem 0 4rem;
  position: relative;
  overflow: hidden;
}
.ms-solutions-section::before {
  content:'';position:absolute;inset:0;
  background-image: radial-gradient(rgba(15,40,100,.07) 1px, transparent 1px);
  background-size: 28px 28px;
  pointer-events: none;
}
.ms-solutions-section::after {
  content:'';position:absolute;
  top:-200px;right:-200px;
  width:600px;height:600px;border-radius:50%;
  background:radial-gradient(circle,rgba(15,40,100,.06) 0%,transparent 70%);
  pointer-events:none;
}
.ms-sol-card {
  position: relative;
  background: #fff;
  border: 1px solid #cdd5e3;
  border-left: 4px solid #1e3a8a;
  border-radius: .75rem;
  padding: 1.75rem 1.75rem 1.75rem 1.5rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s;
  text-decoration: none;
  overflow: hidden;
}
.ms-sol-card:hover {
  transform: translateY(-6px) scale(1.01);
  box-shadow: 0 20px 50px rgba(15,40,100,.14), 0 4px 12px rgba(0,0,0,.08);
}
.ms-sol-featured {
  background: linear-gradient(135deg,#dbeafe 0%,#fff 55%);
  border-color: #93c5fd;
  border-left-color: #1e3a8a;
  box-shadow: 0 4px 20px rgba(30,58,138,.12);
}
.ms-sol-featured:hover {
  box-shadow: 0 20px 50px rgba(30,58,138,.2), 0 4px 12px rgba(0,0,0,.08);
}
.ms-sol-num {
  position: absolute;
  top: 1.1rem; right: 1.1rem;
  font-size: .68rem; font-weight: 700;
  color: rgba(10,31,68,.18);
  letter-spacing: .1em;
  font-family: 'IBM Plex Sans', monospace;
}
.ms-sol-icon {
  width: 44px; height: 44px;
  border-radius: .55rem;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  margin-bottom: .3rem;
}
.ms-sol-badge {
  display: inline-block;
  font-size: .62rem; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase;
  background: #1e3a8a;
  color: #fff;
  padding: .18rem .5rem;
  border-radius: 999px;
  margin-bottom: .2rem;
  width: fit-content;
}
.ms-sol-title {
  font-size: 1rem; font-weight: 700;
  color: #0c1e3e;
  line-height: 1.3;
}
.ms-sol-desc {
  font-size: .83rem;
  color: #4a5f7e;
  line-height: 1.6;
  flex: 1;
}
.ms-sol-link {
  display: inline-flex; align-items: center; gap: .3rem;
  font-size: .8rem; font-weight: 700;
  color: #1e3a8a;
  margin-top: .6rem;
  transition: gap .2s;
  letter-spacing: .01em;
}
.ms-sol-card[style*="f97316"] .ms-sol-link { color: #c2410c; }
.ms-sol-card:hover .ms-sol-link { gap: .55rem; }
.ms-sol-footer-btn {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .75rem 1.75rem;
  border-radius: .5rem;
  border: 2px solid #1e3a8a;
  color: #1e3a8a;
  font-size: .9rem; font-weight: 700;
  text-decoration: none;
  transition: background .2s, color .2s, box-shadow .2s;
  letter-spacing: .01em;
}
.ms-sol-footer-btn:hover {
  background: #1e3a8a;
  color: #fff;
  box-shadow: 0 6px 20px rgba(30,58,138,.35);
}

/* ── Company timeline ──────────────────────────────── */
.ms-timeline { position:relative;padding:0 0 2rem; }
.ms-timeline-line {
  position:absolute;left:50%;top:0;bottom:0;width:2px;
  background:linear-gradient(180deg,#1d4ed8,rgba(29,78,216,.08));
  transform:translateX(-50%);
}
@media (max-width:768px) {
  .ms-timeline-line { left:20px; }
}
.ms-tl-item {
  display:flex;align-items:flex-start;gap:0;margin-bottom:2.5rem;position:relative;
}
.ms-tl-item:nth-child(odd)  { flex-direction:row; }
.ms-tl-item:nth-child(even) { flex-direction:row-reverse; }
.ms-tl-card {
  flex:1;max-width:calc(50% - 2rem);background:var(--ms-bg-alt);
  border:1px solid var(--ms-line);border-radius:.875rem;padding:1.25rem 1.5rem;
  opacity:0;transform:translateY(16px);
  transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1);
}
.ms-tl-item:nth-child(odd)  .ms-tl-card { margin-right:2rem; }
.ms-tl-item:nth-child(even) .ms-tl-card { margin-left:2rem; }
.ms-tl-card.is-visible { opacity:1;transform:none; }
.ms-tl-year {
  position:absolute;left:50%;top:1rem;transform:translateX(-50%);
  width:56px;height:56px;border-radius:50%;
  background:#1d4ed8;color:#fff;font-weight:700;font-size:.8rem;
  display:flex;align-items:center;justify-content:center;
  border:3px solid white;z-index:1;text-align:center;
  box-shadow:0 0 0 4px rgba(29,78,216,.2);
  font-family:Inter,sans-serif;
}
.ms-tl-title { font-weight:700;font-size:.95rem;color:var(--ms-ink);margin-bottom:.35rem; }
.ms-tl-desc  { font-size:.8rem;color:var(--ms-muted);line-height:1.5; }
.ms-tl-tag   { display:inline-block;margin-bottom:.5rem;font-size:.7rem;font-weight:600;color:#1d4ed8;background:#eff6ff;padding:.15rem .6rem;border-radius:9999px;text-transform:uppercase;letter-spacing:.06em; }
@media (max-width:768px) {
  .ms-tl-item { flex-direction:column!important;padding-left:52px; }
  .ms-tl-card { max-width:100%!important;margin:0!important; }
  .ms-tl-year { left:20px;top:0; }
  .ms-timeline-line { left:20px; }
}

/* ── HMS dashboard SVG ─────────────────────────────── */
.ms-dashboard-svg { display:block;width:100%;border-radius:1rem; }
.db-txt { font-family:Inter,system-ui,sans-serif; }