a { text-decoration: none; }
    .text-primaryc { color: var(--primary) !important; }
    .bg-navy { background-color: var(--navy); }

    .section-eyebrow {
      color: var(--primary);
      font-weight: 700;
      letter-spacing: .12em;
      font-size: .78rem;
      text-transform: uppercase;
    }
    .section-title { font-weight: 800; letter-spacing: -.02em; }

    

    /* ---------- HERO ---------- */
    .hero {
      background:
        radial-gradient(900px 500px at 80% 20%, rgb(0 14 85), transparent 60%), linear-gradient(135deg, #021257 0%, #000e49 55%, #000f56 100%);
      color: #fff;
      position: relative;
      overflow: hidden;
    }
    .hero::before {
      content: ""; position: absolute; inset: 0;
      background-image:
        radial-gradient(2px 2px at 20% 30%, rgba(255,255,255,.4), transparent),
        radial-gradient(2px 2px at 70% 60%, rgba(255,255,255,.3), transparent),
        radial-gradient(1px 1px at 40% 80%, rgba(255,255,255,.4), transparent),
        radial-gradient(1px 1px at 85% 25%, rgba(255,255,255,.3), transparent);
      opacity: .7; pointer-events: none;
    }
    .breadcrumb-bar { position: relative; z-index: 2; font-size: .85rem; }
    .breadcrumb-bar a { color: #b9c6e6; }
    .breadcrumb-bar .sep { color: #6f83b5; }
    .hero-eyebrow { color: #6ea8ff; font-weight: 700; letter-spacing: .15em; font-size: .8rem; text-transform: uppercase; }
    .hero h1 { font-weight: 800; font-size: 3.4rem; line-height: 1.05; letter-spacing: -.02em; }
    .hero h1 .accent { color: #4f97ff; }
    .hero p.lead-text { color: #c6d3ee; max-width: 520px; font-size: 1.02rem; }
    .btn-ghost {
      border: 1px solid rgba(255,255,255,.35); color: #fff; font-weight: 700;
      border-radius: 999px; padding: .7rem 1.5rem; background: transparent;
    }
    .btn-ghost:hover { background: #fff; color:#0d6efd; }
    .btn-hero {
      background: var(--primary); color:#fff; font-weight:700; border-radius:999px; padding:.7rem 1.6rem;
      box-shadow: 0 10px 26px rgba(28,92,255,.45);
    }
    .btn-hero:hover { background: #fff; color:#1a56db; }

    /* ---------- HERO ILLUSTRATION ---------- */
    .device-wrap { position: relative; z-index: 2; }
    .laptop { max-width: 470px; margin: 0 auto; position: relative; }
    .laptop-screen {
      background: #fff; border: 8px solid #1c2c52; border-radius: 14px 14px 0 0;
      padding: 14px; box-shadow: 0 26px 70px rgba(0,0,0,.5), 0 0 60px rgba(60,130,255,.35);
    }
    .laptop-base { height: 14px; background: linear-gradient(180deg,#2a3a63,#1c2c52); border-radius: 0 0 16px 16px; margin: 0 auto; width: 108%; margin-left: -4%; box-shadow: 0 12px 24px rgba(0,0,0,.4); }
    .dm-stat { background:#f5f6fc; border-radius:8px; padding:6px 8px; }
    .dm-stat .n { font-weight:800; color:var(--ink); font-size:.85rem; }
    .dm-stat small { font-size:.55rem; }
    .mini-phone {
      position:absolute; right:-24px; bottom:-8px; width:118px; background:#0c1a3c; border:5px solid #263a6b;
      border-radius:18px; padding:8px; box-shadow: 0 20px 50px rgba(0,0,0,.5);
    }
    .mini-phone .scr { background: linear-gradient(180deg,#f5f6fc,#e7ebff); border-radius:11px; padding:8px; }
    .donut {
      width:56px;height:56px;border-radius:50%;margin:0 auto;
      background: conic-gradient(var(--primary) 0 75%, #d9e2ff 75% 100%);
      display:grid;place-items:center;
    }
    .donut span{ width:36px;height:36px;background:#fff;border-radius:50%;display:grid;place-items:center;font-size:.6rem;font-weight:800;color:var(--ink);}
    .megaphone {
      position:absolute; left:-30px; top:34%; font-size:3.4rem; color:#4f97ff; z-index:2;
      filter: drop-shadow(0 10px 24px rgba(28,92,255,.5));
    }
    .float-badge {
      position:absolute; background: rgba(15,35,80,.9); border:1px solid rgba(90,140,255,.4);
      border-radius:12px; padding:8px 12px; backdrop-filter: blur(4px); z-index:3; color:#dce6ff;
      box-shadow: 0 10px 30px rgba(0,0,0,.35); font-weight:700; font-size:.8rem;
    }
    .social-badge {
      position:absolute; z-index:3; width:40px;height:40px;border-radius:50%;
      display:grid;place-items:center;color:#fff;font-size:1.1rem;
      box-shadow:0 8px 20px rgba(0,0,0,.35);
    }
    .sb-fb { background:#1877f2; top:2%; left:34%; }
    .sb-ig { background: linear-gradient(45deg,#f09433,#dc2743,#bc1888); top:14%; left:26%; }
    .sb-in { background:#0a66c2; top:28%; left:32%; }
    .side-stack { position:absolute; right:-6%; top:8%; z-index:3; }
    .side-chip { background: rgba(15,35,80,.9); border:1px solid rgba(90,140,255,.4); border-radius:12px; padding:8px 12px; margin-bottom:10px; color:#dce6ff; font-weight:700; font-size:.78rem; display:flex; align-items:center; gap:8px; }

    /* ---------- FEATURE CARDS ---------- */
    .feature-card {
      background:#fff; border:1px solid var(--border); border-radius:16px; padding:26px 22px; height:100%;
      transition:.25s; text-align:center;
    }
    .feature-card:hover { transform: translateY(-6px); box-shadow:0 18px 40px rgba(16,25,58,.1); border-color:#cfe0ff; }
    .feat-ico {
      width:56px; height:56px; border-radius:14px; background:var(--sky); color:var(--primary);
      display:grid; place-items:center; font-size:1.5rem; margin:0 auto 16px;
    }
    .feature-card h5 { font-weight:700; font-size:1.05rem; }
    .feature-card p { color:var(--muted); font-size:.9rem; margin:0; }

    /* ---------- PROCESS ---------- */
    .band { background: var(--light); border-radius: 22px; }
    .proc-ico {
      width:70px; height:70px; border-radius:50%; background:#fff; border:1px solid var(--border);
      color:var(--primary); display:grid; place-items:center; font-size:1.6rem; margin:0 auto 14px;
      box-shadow:0 10px 24px rgba(16,25,58,.06);
    }
    .proc h6 { font-weight:700; }
    .proc p { color:var(--muted); font-size:.82rem; }
    .proc-arrow { color:#9db4e8; font-size:1.1rem; }

    /* ---------- SERVICE / CHANNEL TILES ---------- */
    .soft-card { background: var(--light); border-radius:18px; }
    .svc-tile {
      background:#fff; border:1px solid var(--border); border-radius:14px; padding:18px 12px; text-align:center; height:100%;
      transition:.2s;
    }
    .svc-tile:hover { border-color:#cfe0ff; box-shadow:0 12px 28px rgba(16,25,58,.08); transform:translateY(-4px); }
    .svc-tile i { color:var(--primary); font-size:1.6rem; }
    .svc-tile small { display:block; font-weight:700; margin-top:8px; line-height:1.3; }
    .chan-tile { background:#fff; border:1px solid var(--border); border-radius:14px; padding:16px 8px; text-align:center; height:100%; transition:.2s; }
    .chan-tile:hover { border-color:#cfe0ff; box-shadow:0 12px 28px rgba(16,25,58,.08); transform:translateY(-4px); }
    .chan-tile i { font-size:1.6rem; }
    .chan-tile small { display:block; font-weight:700; margin-top:8px; line-height:1.3; }

    /* ---------- INDUSTRIES / WHY ---------- */
    .ind-card {
      border:1px solid var(--border); border-radius:14px; padding:16px 10px; text-align:center; background:#fff;
      transition:.2s;
    }
    .ind-card:hover { border-color:#cfe0ff; box-shadow:0 10px 24px rgba(16,25,58,.08); }
    .ind-card i { color:var(--primary); font-size:1.5rem; }
    .ind-card small { display:block; font-weight:700; margin-top:8px; }
    .why-item i { color:var(--primary); }
    .why-item { font-weight:600; font-size:.95rem; }
    .trophy-ico { font-size:6rem; color:#3f7bff; filter: drop-shadow(0 12px 24px rgba(28,92,255,.4)); }

    /* ---------- STATS ---------- */
    .stats {
      background: linear-gradient(135deg,#0a2050,#0b2a66); color:#fff; border-radius:18px;
    }
    .stat-ico { width:52px; height:52px; border-radius:50%; background:rgba(255,255,255,.1); display:grid; place-items:center; font-size:1.3rem; }
    .stat-num { font-weight:800; font-size:1.9rem; line-height:1; }
    .stat-lbl { color:#b9c6e6; font-size:.85rem; }

    /* ---------- CTA ---------- */
    .cta {
      background: linear-gradient(135deg,#1c5cff,#1140c9); color:#fff; border-radius:18px; overflow:hidden; position:relative;
    }
    .cta .env-ico { width:64px; height:64px; border-radius:16px; background:rgba(255,255,255,.15); display:grid; place-items:center; font-size:1.7rem; }
    .btn-white { background:#fff; color:#1a56db; font-weight:700; border-radius:999px; padding:.65rem 1.4rem; }
    .btn-white:hover { background:#1a56db; color:#eef3ff;border: 2px solid #ffffff }
    .btn-navy { background:var(--navy); color:#fff; font-weight:700; border-radius:999px; padding:.65rem 1.4rem; }
    .btn-navy:hover { background:#fff; color:#0d6efd; }

  

    @media (max-width: 991px){
      .hero h1 { font-size: 2.4rem; }
      .float-badge, .social-badge, .megaphone, .side-stack { display:none; }
      .mini-phone { display:none; }
    }