/* ========================================
   CUSTOM HEADER & FOOTER STYLES
   Lightweight - No Elementor/Mega Menu Bloat
   ======================================== */

/* ========================================
   RESET & OVERRIDES - Combat Theme CSS
   ======================================== */
   /* Enforce site font globally to avoid Elementor/footer kit side-effects */
   html body {
       font-family: 'Montserrat', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;
   }
   .custom-header ul,
   .custom-header li,
   .custom-footer ul,
   .custom-footer li {
       list-style: none !important;
       margin: 0 !important;
       padding: 0 !important;
   }
   
   .custom-header a,
   .custom-footer a {
       text-decoration: none !important;
   }
   
   /* Force horizontal menu layout */
   .header-nav ul {
       display: flex !important;
       flex-direction: row !important;
       flex-wrap: nowrap !important;
   }
   
   .header-nav ul li {
       display: inline-block !important;
       float: none !important;
   }
   
   /* Mega menu positioning fix */
   .main-menu .has-mega-menu {
       position: relative;
   }
   
   .main-menu .has-mega-menu .mega-menu-wrapper {
       max-width: 100vw;
       box-sizing: border-box;
   }
   
   /* ========================================
      TOP BAR
      ======================================== */
   .custom-top-bar {
       background: linear-gradient(135deg, #3b3d99 0%, #2e3191 100%);
       color: #fff;
       padding: 8px 0;
       font-size: 14px;
   }
   
   .custom-top-bar .container {
       max-width: 91%;
       margin: 0 auto;
       padding: 0 15px;
   }
   
   .custom-top-bar .top-bar-content {
       display: flex;
       justify-content: space-between;
       align-items: center;
   }
   
   .custom-top-bar .top-bar-left span {
       font-weight: 400;
   }
   
   .custom-top-bar .top-bar-right a {
       color: #fff;
       text-decoration: none;
       font-weight: 500;
       transition: opacity 0.3s ease;
   }
   
   .custom-top-bar .top-bar-right a:hover {
       opacity: 0.8;
       text-decoration: none;
   }
   
   .custom-top-bar .top-bar-right i {
       margin-right: 5px;
   }
   
   /* ========================================
      MAIN HEADER
      ======================================== */
   .custom-header {
       background: #fff;
       padding: 20px 0;
       box-shadow: 0 2px 10px rgba(0,0,0,0.05);
       position: sticky;
       top: 0;
       z-index: 999;
   }
   
   .custom-header .container {
       max-width: 91%;
       margin: 0 auto;
       padding: 0 15px;
   }
   
   .custom-header .header-content {
       display: flex !important;
       flex-direction: row !important;
       align-items: center;
       justify-content: space-between;
       gap: 30px;
       flex-wrap: nowrap;
   }
   
   /* Logo - Keep in left corner */
   .header-logo {
       flex-shrink: 0;
       margin-right: 30px;
   }
   
   .header-logo img {
       max-height: 50px;
       width: auto;
       display: block;
   }
   
   .header-logo a {
       display: inline-block;
       line-height: 1;
   }
   
   /* Navigation */
   .header-nav {
       flex: 1;
       display: flex !important;
       justify-content: center;
   }
   
   .main-menu {
       display: flex !important;
       flex-direction: row !important;
       list-style: none !important;
       margin: 0 !important;
       padding: 0 !important;
       gap: 18px;
       align-items: center;
   }
   
   .main-menu li {
       position: relative;
       display: inline-block !important;
   }
   
   .main-menu > li > a {
       color: #1E1E1E;
       text-decoration: none;
       font-weight: 700;
       font-size: 15px;
       padding: 10px 8px;
       display: flex;
       align-items: center;
       gap: 5px;
       transition: color 0.3s ease;
       white-space: nowrap;
   }
   
   .main-menu > li > a:hover {
       color: #3b3d99;
       text-decoration: none;
   }
   
   .main-menu > li > a i {
       font-size: 9px;
   }
   
   /* Mega Menu - Dropdown Box Format (Hidden by Default) */
   .main-menu .has-mega-menu {
       position: relative !important;
   }
   
   .mega-menu-wrapper {
       position: absolute !important;
       top: 100% !important;
       left: 0 !important;
       background: #fff !important;
       box-shadow: 0 10px 40px rgba(0,0,0,0.15) !important;
       border-radius: 12px !important;
       padding: 30px !important;
       margin-top: 15px !important;
       z-index: 99999 !important;
       
       /* HIDDEN BY DEFAULT */
       display: none !important;
       visibility: hidden !important;
       opacity: 0 !important;
       
       box-sizing: border-box !important;
   }
   
   /* SHOW ON HOVER ONLY */
   .main-menu .has-mega-menu:hover .mega-menu-wrapper {
       display: grid !important;
       visibility: visible !important;
       opacity: 1 !important;
   }

  /* Hover persistence: keep panel open when hovering the panel itself */
  .mega-menu-wrapper:hover {
      display: grid !important;
      visibility: visible !important;
      opacity: 1 !important;
      pointer-events: auto !important;
  }

  /* Small transparent hover bridge above the panel to avoid flicker when moving cursor down */
  .mega-menu-wrapper::before {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      top: -20px;
      height: 20px; /* larger invisible buffer for easier cursor travel */
  }

  /* Safety: ensure panel isn't clipped and stays interactive */
  .custom-header,
  .main-menu,
  .mega-menu-wrapper {
      overflow: visible !important;
  }

  /* Optional: JS can toggle this class to force menu open (matches hover visuals) */
  .has-mega-menu.mm-open > .mega-menu-wrapper {
      display: grid !important;
      visibility: visible !important;
      opacity: 1 !important;
      pointer-events: auto !important;
  }
   
   /* About Menu - 2 Column Layout */
   .mega-menu-wrapper.about-menu {
       width: 760px !important;
       grid-template-columns: 1fr 1fr !important;
       gap: 30px !important;
       left: -200px !important;
   }
   
   /* Services Menu - 2 Columns: Left Stack + Right Full Stack */
   .mega-menu-wrapper.services-menu {
       width: 950px !important;
       grid-template-columns: 1fr 1fr !important;
       grid-template-rows: auto auto auto !important;
       gap: 25px 40px !important;
       left: -300px !important;
       padding: 30px !important;
       box-sizing: border-box !important;
       max-width: calc(100vw - 40px) !important;
   }
   
   /* Left Column Sections - Design, Crossplatform, Native */
   .services-menu .mega-menu-column:nth-child(1) {
       grid-column: 1;
       grid-row: 1;
   }
   
   .services-menu .mega-menu-column:nth-child(3) {
       grid-column: 1;
       grid-row: 2;
   }
   
   .services-menu .mega-menu-column:nth-child(2) {
       grid-column: 1;
       grid-row: 3;
   }
   
   /* Right Column - Full Stack Spans Full Height */
   .services-menu .mega-menu-column:nth-child(4) {
       grid-column: 2;
       grid-row: 1 / 4;
   }
   
   /* Column Structure */
   .mega-menu-column {
       display: flex !important;
       flex-direction: column !important;
       min-width: 0 !important;
       overflow: hidden !important;
       max-width: 100% !important;
   }
   
   .mega-menu-column h4 {
       font-size: 13px !important;
       font-weight: 700 !important;
       color: #3b3d99 !important;
       margin: 0 0 10px 0 !important;
       padding-bottom: 5px !important;
       border-bottom: 2px solid #e8e8e8 !important;
       white-space: nowrap !important;
       overflow: hidden !important;
       text-overflow: ellipsis !important;
   }
   
   .mega-menu-column ul {
       list-style: none !important;
       padding: 0 !important;
       margin: 0 !important;
       display: flex !important;
       flex-direction: column !important;
       gap: 4px !important;
   }
   
   .mega-menu-column ul li {
       margin: 0 !important;
       padding: 0 !important;
   }
   
   .mega-menu-column ul li a {
       display: flex !important;
       align-items: center !important;
       gap: 8px !important;
       padding: 8px 8px !important;
       color: #555 !important;
       text-decoration: none !important;
       font-size: 14px !important;
       font-weight: 500 !important;
       border-radius: 5px !important;
       transition: all 0.3s ease !important;
       line-height: 1.4 !important;
   }
   
   .mega-menu-column ul li a:hover {
       background: #f5f7fa !important;
       color: #3b3d99 !important;
       padding-left: 12px !important;
   }
   
  .mega-menu-column ul li a i {
    color: #2e3191 !important;
    background: #eef3ff !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    line-height: 28px !important;
    font-size: 14px !important;
    box-shadow: 0 0 0 1px #e2e7ff inset !important;
    flex-shrink: 0 !important;
    text-align: center !important;
}

/* Ensure mobile device glyph appears solid and centered */
.mega-menu-column ul li a i.fa-mobile,
.mega-menu-column ul li a i.fa-mobile-alt,
.mega-menu-column ul li a i.fa-mobile-screen,
.mega-menu-column ul li a i.fa-mobile-screen-button {
    font-weight: 900 !important;
}

  /* Override icon for UI/UX Design menu item to a design-friendly glyph */
  .mega-menu-wrapper .mega-menu-column a[href*="/ui-ux-design/"] i::before {
      content: "\f5ae" !important; /* fa-pen-ruler */
      font-family: "Font Awesome 6 Free" !important;
      font-weight: 900 !important;
  }

  /* Wireframing */
  .mega-menu-wrapper .mega-menu-column a[href*="/wireframing"] i::before,
  .mega-menu-wrapper .mega-menu-column a[href*="/wireframing/"] i::before {
      content: "\f247" !important; /* fa-object-group */
      font-family: "Font Awesome 6 Free" !important;
      font-weight: 900 !important;
  }

  /* Flutter App Development */
  .mega-menu-wrapper .mega-menu-column a[href*="/flutter"] i::before,
  .mega-menu-wrapper .mega-menu-column a[href*="/flutter-app"] i::before {
      content: "\f3cd" !important; /* fa-mobile-alt */
      font-family: "Font Awesome 6 Free" !important;
      font-weight: 900 !important;
  }

  /* Prestashop Developers */
  .mega-menu-wrapper .mega-menu-column a[href*="/prestashop"] i::before,
  .mega-menu-wrapper .mega-menu-column a[href*="/prestashop-developer"] i::before,
  .mega-menu-wrapper .mega-menu-column a[href*="/prestashop-developers"] i::before {
      content: "\f54e" !important; /* fa-store */
      font-family: "Font Awesome 6 Free" !important;
      font-weight: 900 !important;
  }

  /* BigCommerce */
  .mega-menu-wrapper .mega-menu-column a[href*="/bigcommerce"] i::before {
      content: "\f07a" !important; /* fa-shopping-cart (cart-shopping) */
      font-family: "Font Awesome 6 Free" !important;
      font-weight: 900 !important;
  }
   
   .mega-menu-column ul li a span {
       flex: 1 !important;
       line-height: 1.4 !important;
       white-space: nowrap !important;
       overflow: hidden !important;
       text-overflow: ellipsis !important;
   }
   
   /* Full Stack Column - Single Column Layout */
   .services-menu .mega-menu-column:nth-child(4) ul {
       display: flex !important;
       flex-direction: column !important;
       gap: 4px !important;
   }
   
   /* About Menu - Allow Text Wrapping for Descriptions */
   .about-menu .mega-menu-column ul li a {
       align-items: flex-start !important;
   }
   
   .about-menu .mega-menu-column ul li a span {
       white-space: normal !important;
       line-height: 1.5 !important;
   }
   
   /* CTA Button */
   .header-cta {
       flex-shrink: 0;
   }
   
   .header-cta .cta-button {
       display: inline-block;
       padding: 12px 28px;
       border: 2px solid #3b3d99;
       color: #3b3d99;
       font-weight: 600;
       font-size: 15px;
       border-radius: 50px;
       text-decoration: none;
       transition: all 0.3s ease;
   }
   
   .header-cta .cta-button:hover {
       background: #3b3d99;
       color: #fff;
       text-decoration: none;
   }
   
   /* Mobile Menu Toggle */
   .mobile-menu-toggle {
       display: none;
       flex-direction: column;
       gap: 5px;
       background: none;
       border: none;
       cursor: pointer;
       padding: 10px;
       z-index: 10000;
       position: relative;
   }
   
   .mobile-menu-toggle:hover {
       opacity: 0.8;
   }
   
   .mobile-menu-toggle span {
       display: block;
       width: 28px;
       height: 3px;
       background: #1E1E1E;
       transition: all 0.3s ease;
       border-radius: 2px;
   }
   
   /* Mobile Menu */
   .mobile-menu {
       position: fixed;
       top: 0;
       right: -100%;
       width: 300px;
       height: 100vh;
       background: #fff;
       box-shadow: -5px 0 20px rgba(0,0,0,0.1);
       z-index: 9999;
       transition: right 0.3s ease;
       overflow-y: auto;
       padding: 80px 20px 30px;
   }
   
   .mobile-menu.active {
       right: 0;
   }
   
   .mobile-menu-close {
       position: absolute;
       top: 20px;
       right: 20px;
   }
   
   .mobile-menu-close button {
       background: none;
       border: none;
       font-size: 32px;
       color: #1E1E1E;
       cursor: pointer;
       padding: 5px;
       line-height: 1;
   }
   
   .mobile-menu-list {
       list-style: none;
       margin: 0;
       padding: 0;
   }
   
   .mobile-menu-list li {
       margin-bottom: 5px;
   }
   
   .mobile-menu-list > li > a {
       display: block;
       padding: 12px 15px;
       color: #1E1E1E;
       text-decoration: none;
       font-weight: 600;
       font-size: 16px;
       border-radius: 6px;
       transition: background 0.3s ease;
   }
   
   .mobile-menu-list > li > a:hover {
       background: #f8f9fa;
       text-decoration: none;
   }
   
   .mobile-menu-list .submenu {
       list-style: none;
       padding-left: 20px;
       margin-top: 5px;
       display: none;
   }
   
   .mobile-menu-list .has-submenu.active .submenu {
       display: block;
   }
   
   .mobile-menu-list .submenu a {
       display: block;
       padding: 8px 15px;
       color: #555;
       text-decoration: none;
       font-size: 14px;
       font-weight: 500;
       border-radius: 6px;
   }
    /* Mobile menu icon visibility */
    .mobile-menu-list > li > a i,
    .mobile-menu-list .submenu a i {
        color: #2e3191 !important;
        font-size: 18px !important;
        width: 22px !important;
        min-width: 22px !important;
        margin-right: 8px !important;
        text-align: center !important;
    }
   
   .mobile-menu-list .submenu a:hover {
       background: #f8f9fa;
       color: #3b3d99;
       text-decoration: none;
   }
  /* Mobile submenu caret size and alignment */
  .mobile-menu-list .has-submenu > a {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      gap: 8px !important;
  }
  .mobile-menu-list .has-submenu > a i {
      font-size: 14px !important;
      line-height: 1 !important;
      flex: 0 0 auto !important;
  }
  /* Hide any theme-generated pseudo-caret */
  .mobile-menu-list .has-submenu > a::after { content: none !important; }
   
   .mobile-menu-cta {
       margin-top: 30px;
   }
   
   .mobile-menu-cta .cta-button {
       display: block;
       text-align: center;
       padding: 14px 20px;
       background: #3b3d99;
       color: #fff;
       font-weight: 600;
       border-radius: 50px;
       text-decoration: none;
   }
   
   .mobile-menu-overlay {
       position: fixed;
       top: 0;
       left: 0;
       width: 100%;
       height: 100vh;
       background: rgba(0,0,0,0.5);
       z-index: 9998;
       opacity: 0;
       visibility: hidden;
       transition: all 0.3s ease;
   }
   
   .mobile-menu-overlay.active {
       opacity: 1;
       visibility: visible;
   }
   
   /* ========================================
      FOOTER - EXACT COLORS FROM SCREENSHOT
      ======================================== */
  .custom-footer {
      background: #f3f8fe !important;
       margin-top: 0;
       padding-top: 0;
   }
   
   .footer-main {
       width: 100%;
       max-width: 100%;
       margin: 0;
       padding: 0;
       display: flex;
       background: transparent;
       border-radius: 0;
       box-sizing: border-box;
   }
   
   /* Footer Sidebar - Light Blue Background */
   .footer-sidebar {
       background: #f3f8fe !important;
       width: 300px;
       min-width: 300px;
       max-width: 300px;
       flex-shrink: 0;
       padding: 40px 20px 30px 30px;
       box-sizing: border-box;
   }
   
   .footer-sidebar h1,
   .footer-sidebar h2,
   .footer-sidebar h3,
   .footer-sidebar h4,
   .footer-sidebar h5,
   .footer-sidebar h6 {
       color: #333 !important;
   }
   
   .footer-sidebar-content {
       position: sticky;
       top: 20px;
   }
   
   .footer-logo {
       margin-bottom: 33px;
   }
   
   .footer-logo img {
        max-width: 246px;
        height: 63px;
       /* filter: brightness(0) invert(1); */
   }
   
   .footer-contact-section {
       margin-bottom: 20px;
   }
   
   .footer-btn {
        background: #2e3191 !important;
        color: #fff !important;
        border: none !important;
        border-left: 0px solid #2e3191 !important;
        padding: 13px 46px 12px !important;
        font-weight: 600 !important;
        font-size: 15px !important;
        border-radius: 0px 24px 24px 0px !important;
        width: 100% !important;
        margin-bottom: 15px !important;
        cursor: pointer !important;
        transition: all 0.3s ease !important;
        text-align: center !important;
        display: block !important;
        box-sizing: border-box !important;
   }
   
   .footer-btn:hover {
       background: #1e216f !important;
       transform: translateY(-2px) !important;
       box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
       border-left-color: #7a7dd4 !important;
   }
   
   .footer-contact-info {
       font-size: 16px !important;
       color: #fff !important;
       line-height: 1.8 !important;
   }
   
   .footer-contact-info p {
       margin-bottom: 8px !important;
       display: flex !important;
       align-items: center !important;
       gap: 10px !important;
       color: #333 !important;
   }
   
   .footer-contact-info i {
       width: 18px !important;
       flex-shrink: 0 !important;
       color: #fff !important;
       font-size: 14px !important;
       background: #3b5998 !important;
       border-radius: 50% !important;
       padding: 7px !important;
       display: flex !important;
       align-items: center !important;
       justify-content: center !important;
       width: 32px !important;
       height: 32px !important;
       box-sizing: border-box !important;
   }
   
    .footer-contact-info a {
        color: #333 !important;
        text-decoration: none !important;
        font-size: 15px !important;
        font-weight: 500 !important;
        padding: 0px;
        padding-bottom: 0px;
        padding-top: 0px;
    }
   
   .footer-contact-info a:hover {
       text-decoration: underline;
       color: #fff !important;
   }
   
   /* Footer Columns - White Section (Matching Live Site) */
  .footer-columns {
      flex: 1;
      width: calc(100% - 300px);
      padding: 40px 25px 30px 40px; /* gutter between sidebar and first column */
      background: #f3f8fe;
      box-sizing: border-box;
  }
   
   .footer-columns .container-fluid {
       max-width: 100%;
       margin: 0;
       padding: 0 !important;
       width: 100%;
       box-sizing: border-box;
   }
   
.footer-columns .row {                                             
    margin: 0 !important;
    width: 100% !important;
    display: grid;
    grid-template-columns: 1fr; /* mobile-first: single column */
    column-gap: 24px; 
    row-gap: 20px;
}

/* Ensure the actual footer grid used in markup is responsive */
.custom-footer .footer-grid {
    display: grid !important;
    grid-template-columns: 1fr !important; /* mobile */
    column-gap: 24px !important;
    row-gap: 20px !important;
    margin-left: 0 !important;
}
   
 .footer-columns .footer-column {
     padding: 0; 
     min-width: 0;
     width: auto;
     max-width: none;
     box-sizing: border-box;
 }

  /* Force 3 equal columns on desktop with no trailing whitespace */
  @media (min-width: 992px) {
      .custom-footer .footer-columns .container-fluid { padding: 0 !important; }
      .custom-footer .footer-columns .row {
          display: grid !important;
          grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
          column-gap: 48px !important;
          row-gap: 0 !important;
          align-items: start !important;
      }
      .custom-footer .footer-columns .footer-column {
          width: auto !important;
          max-width: none !important;
          flex: 0 0 auto !important;
      }
     /* Desktop-only: badges in one horizontal line inside sidebar */
     .footer-sidebar-badges { display: flex !important; flex-wrap: nowrap !important; align-items: center !important; gap: 12px !important; padding-top: 18px !important; justify-content: flex-start !important; width: 100% !important; }
      .footer-sidebar-badges .badge-item { flex: 0 0 auto !important; }
      
    /* Use spacer + ordering; nth-last-child rules removed */
      
      .footer-sidebar-badges .badge-item img { max-height: 38px !important; height: auto !important; width: auto !important; }
  }

  /* Badges bar below columns */
  .footer-badges-bar { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px 0 0; }
  .footer-badges-bar .badges-left, .footer-badges-bar .badges-right { display:flex; align-items:center; gap:22px; width:auto!important; flex:0 0 auto!important; }
  .footer-badges-bar .badge-item { display:flex; align-items:center; }
  .footer-badges-bar .badge-item img { height: 72px; width:auto; display:block; }
  .footer-badges-bar .badge-item.small img { height: 60px; }
  .footer-badges-bar .badge-item.large img { height: 110px; }

  /* Scale badges down for tablets and phones */
  @media (max-width: 991px) {
      .footer-badges-bar .badge-item img { height: 56px; }
      .footer-badges-bar .badge-item.small img { height: 48px; }
      .footer-badges-bar .badge-item.large img { height: 80px; }
  }
  @media (max-width: 575px) {
      .footer-badges-bar { flex-direction: column; align-items: flex-start; gap:16px; }
      .footer-badges-bar .badges-left, .footer-badges-bar .badges-right { gap:14px; flex-wrap: wrap; }
      .footer-badges-bar .badge-item img { height: 44px; }
      .footer-badges-bar .badge-item.small img { height: 40px; }
      .footer-badges-bar .badge-item.large img { height: 60px; }
  }

  /* Sidebar badges visible (no duplicates section exists) */
  .footer-sidebar-badges { display: flex !important; flex-wrap: wrap; gap: 18px; }
   
   .footer-columns .footer-column:last-of-type:not(:nth-child(4)) {
       padding-right: 0 !important;
   }
   
   /* Hide 4th column */
   .footer-columns .footer-column:nth-child(4) {
       display: none !important;
   }
   
   .footer-column {
       margin-bottom: 25px;
   }
   
    .footer-title {
        font-size: 20px !important;
        font-weight: 800 !important;
        color: #273171 !important;
        /* margin-bottom: 25px !important; */
        /* padding-bottom: 0 !important; */
        border-bottom: none !important;
        display: block !important;
        line-height: 2.3 !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
        padding-top: 0px;
    }
   
   .footer-links {
       list-style: none !important;
       padding: 0 !important;
       margin: 0 !important;
   }
   
   .footer-links li {
       margin-bottom: 3px !important;
   }
   
    .footer-links a {
        color: #343a40 !important;
        text-decoration: none !important;
        font-size: 15px !important;
        font-weight: 499 !important;
        line-height: 1.6 !important;
        transition: all 0.3s ease !important;
        display: inline-block !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
        padding-top: 3px;
    }
   
   .footer-links a:hover {
       color: #3b3d99 !important;
       padding-left: 5px !important;
       text-decoration: none !important;
   }
   
   /* Footer Badges - Single Horizontal Row */
   .footer-badges {
       display: flex;
       flex-direction: row !important;
       flex-wrap: wrap;
       align-items: center;
       justify-content: flex-start;
       gap: 15px;
   }
   
   /* All badges in one row */
   .badges-row-left,
   .badges-row-right {
       display: flex;
       align-items: center;
       gap: 15px;
       flex-wrap: wrap;
   }
   
   /* Clutch Badge */
   .clutch-badge {
       display: inline-flex;
       flex-direction: column;
       align-items: center;
       text-align: center;
       background: transparent;
       padding: 0;
       border-radius: 0;
       box-shadow: none;
   }
   
   .clutch-badge img {
       max-width: 90px;
       height: auto;
       margin-bottom: 3px;
   }
   
   .clutch-badge p {
       font-size: 9px;
       color: #666;
       font-weight: 700;
       margin: 0;
       text-align: center;
   }
   
   /* Certification Badges Row */
   .certification-badges {
       display: flex;
       gap: 12px;
       flex-wrap: wrap;
       align-items: center;
       justify-content: flex-start;
       background: transparent;
       padding: 0;
       border-radius: 0;
       box-shadow: none;
   }
   
   .certification-badges img {
       max-width: 60px;
       height: auto;
   }
   
   /* Security Badges */
   .security-badges {
       display: flex;
       gap: 12px;
       flex-wrap: wrap;
       align-items: center;
       background: transparent;
       padding: 0;
       border-radius: 0;
       box-shadow: none;
   }
   
   .security-badges img {
       max-width: 60px;
       height: auto;
   }
   
   /* Individual Badge Items */
   .badge-item {
       display: inline-flex;
       align-items: center;
       justify-content: center;
   }
   
    .badge-item img {
        max-width: 222px;
        height: auto;
        display: block;
    }
   
   .badge-item.nasscom-badge img {
       max-width: 70px;
   }
   
   /* Trustpilot Widget */
   .trustpilot-widget {
       margin-top: 0;
       text-align: right;
       display: inline-block;
   }
   
   .trustpilot-widget iframe {
       width: 160px !important;
       height: auto !important;
   }
  /* Centering wrapper to match page margins */
    .custom-footer .footer-container {
        max-width: 1457px;
        margin: 0 auto;
        padding: 0 20px;
        box-sizing: border-box;
    }
   
   /* Footer Sidebar Badges - Plain Style Inside Sidebar */
   .footer-sidebar-badges {
        margin-top: -20px;
        padding-top: 30px;
        display: flex;
       flex-wrap: wrap;
        gap: 18px;
        align-items: center;
        justify-content: flex-start;
        width: 100% !important;
        max-width: 100% !important;
        margin-bottom: 8px !important;
        position: relative;
    }
   
   .footer-sidebar-badges .badge-item {
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
       gap: 6px;
       background: transparent !important;
       border: none !important;
       padding: 5px !important;
   }
   
  /* Right group container: push to far right and keep inline */
    .footer-sidebar-badges .badges-right-corner { margin-left: 381px; display: flex; flex-direction: column; align-items: center; gap: 10px; }
  .footer-sidebar-badges .badges-right-corner .badge-row { display: flex; align-items: center; gap: 18px; }
  .footer-sidebar-badges .badges-right-corner .badge-item { display: flex; align-items: center; }
   .footer-sidebar-badges .trustpilot-row { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 16px; color: #000; line-height: 1; font-family: inherit; white-space: nowrap; }
   .footer-sidebar-badges .trustpilot-row .tp-star { flex-shrink: 0; }
   .footer-sidebar-badges .trustpilot-row .tp-label { color: #000; font-weight: 700; margin-left: 4px; }
   
   .footer-sidebar-badges .badge-item img {
       max-height: 75px !important;
       min-height: 55px;
       width: auto;
       height: auto;
       display: block;
       object-fit: contain;
   }
   
   
   .footer-sidebar-badges .badge-item span {
       display: none;
   }
   
   /* Footer Bottom - Dark Blue Bar */
   .footer-bottom {
       background: #2e3191 !important;
       padding: 18px 30px;
       width: 100%;
       box-sizing: border-box;
   }
   
   .footer-bottom .container {
       max-width: 100%;
       width: 100%;
       margin: 0;
       padding: 0;
       box-sizing: border-box;
   }
   
   .footer-bottom-content {
       display: flex;
       justify-content: space-between;
       align-items: center;
       flex-wrap: wrap;
       gap: 20px;
   }
   
   .footer-copyright {
       color: #fff;
       font-size: 13px;
       flex-shrink: 0;
   }
   
   .footer-copyright p {
       margin: 0;
       font-size:15px;
       font-weight: 400;
   }
   
   .footer-social {
       display: flex;
       gap: 12px;
   }
   
   .footer-social a {
       display: flex;
       align-items: center;
       justify-content: center;
       width: 38px;
       height: 38px;
       border-radius: 50%;
       /*background: rgba(255,255,255,0.15);*/
       color: #fff;
       text-decoration: none;
       transition: all 0.3s ease;
       font-size: 16px;
       border: 1px solid #fff;
   }
   
   .footer-social a:hover {
       background: #fff;
       color: #3b3d99;
       transform: translateY(-3px);
   }
   
   .footer-links-bottom {
       display: flex;
       gap: 20px;
       flex-wrap: wrap;
   }
   
   .footer-links-bottom a {
    color: #fff;
    text-decoration: none;
    font-size: 15px;
    transition: color 0.3s ease;
    border-left: 2px solid #fff;
    padding-left: 15px;
   }
    .footer-links-bottom > a:first-child {
      border-left: none;
    }

   
   .footer-links-bottom a:hover {
       /*color: #aaa;*/
       text-decoration: underline;
   }
   .badgeContainer {
    display: flex;
    column-gap: 30px;
}
   /* ========================================
      RESPONSIVE DESIGN
      ======================================== */
  /* Desktop-only: make default theme header sticky globally */
  @media (min-width: 992px) {
      #main-header { position: relative; z-index: 1000; }
      #main-header .main-navigation { position: sticky; top: 0; z-index: 1000; }
  }
   @media (max-width: 1199px) {
       .main-menu {
           gap: 12px;
       }
       
       .main-menu > li > a {
           font-size: 13px;
       }
       
       /* Adjust mega menu for smaller screens */
       .mega-menu-wrapper {
           width: 700px !important;
           padding: 20px;
           gap: 20px;
       }
       
       .mega-menu-wrapper.about-menu {
           width: 500px !important;
       }
       
       .mega-menu-wrapper.services-menu {
           width: 750px !important;
       }
       
       .mega-menu-column h4 {
           font-size: 14px;
       }
       
       .mega-menu-column ul li a {
           font-size: 12px;
           padding: 5px 8px !important;
       }
       
       .mega-menu-column ul li a i {
           font-size: 14px;
           width: 18px;
       }
   }
   
   @media (max-width: 991px) {
      /* WhatsApp floater – keep small and unobtrusive on mobile */
      .ftwhasapp { position: fixed; right: 14px; bottom: 18px; z-index: 99999; }
      .ftwhasapp img { width: 56px !important; height: 56px !important; object-fit: contain; }

       /* Hide desktop navigation and mega menu */
       .header-nav {
           display: none !important;
       }
       
       .mega-menu-wrapper {
           display: none !important;
       }
       
       .header-cta {
           display: none;
       }
       
       /* Show mobile menu toggle */
       .mobile-menu-toggle {
           display: flex;
       }
       
       /* Footer becomes vertical */
       .footer-main {
           flex-direction: column;
           padding: 0;
           width: 100%;
       }
       
       .footer-sidebar {
           width: 100% !important;
           min-width: 100% !important;
           max-width: 100% !important;
           padding: 30px 20px;
       }
       
       .footer-columns {
           width: 100% !important;
           padding: 30px 20px;
       }
       
       .footer-columns .container-fluid {
           padding: 0;
       }
       
      .footer-columns .row {
          display: grid !important;
          grid-template-columns: 1fr !important;
          column-gap: 16px !important;
          row-gap: 14px !important;
      }
      .custom-footer .footer-columns .container-fluid .footer-grid {
          display: grid !important;
          grid-template-columns: 1fr !important;
          column-gap: 16px !important;
          row-gap: 14px !important;
          width: 100% !important;
          margin-left: 0 !important;
      }
      .custom-footer .footer-grid {
          grid-template-columns: 1fr !important;
          column-gap: 16px !important;
          row-gap: 14px !important;
          margin-left: 0 !important;
      }
       
       .footer-columns .footer-column {
           width: 100% !important;
           max-width: 100% !important;
           padding: 0 10px;
           margin-bottom: 25px;
       }
       
       .footer-columns .footer-column:nth-child(4) {
           display: none !important;
       }
       
       .footer-bottom {
           padding: 18px 20px;
       }
       
     .footer-bottom .container {
         padding: 0;
     }
     
     .footer-bottom-content {
         flex-direction: column;
         text-align: center;
         gap: 15px;
     }
     
     .footer-copyright {
         order: 1;
     }
     
     .footer-social {
         order: 2;
     }
     
     /* Badges in Sidebar - Mobile */
    .footer-sidebar-badges { gap: 12px 10px; justify-content: flex-start; }
    .footer-columns { padding: 15px 20px; }

    /* Mobile contact rows - prevent horizontal scroll and keep icons tidy */
     .footer-contact-info p { gap: 8px !important; align-items: center !important; min-height: 28px !important; }
     .footer-contact-info i { width: 24px !important; height: 24px !important; padding: 0 !important; font-size: 12px !important; line-height: 24px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; }
    .footer-contact-info a { overflow-wrap: anywhere !important; word-break: break-word !important; font-size: 14px !important; }
     
    /* Mobile: keep group container, allow natural wrapping */
     .footer-sidebar-badges { margin-bottom: 6px !important; }
     .footer-sidebar-badges .badges-right-corner { margin-left: 0 !important; flex-basis: 100% !important; align-items: flex-start !important; }
     .footer-sidebar-badges .badges-right-corner .badge-row { justify-content: flex-start !important; gap: 12px !important; }
     /* Unify badge sizes on mobile for clean look */
     .footer-sidebar-badges .badge-item img { height: 58px !important; max-height: 58px !important; width: auto !important; object-fit: contain !important; }
     
     .footer-sidebar-badges .badge-item span {
         font-size: 8px;
     }
     
     /* 3 columns in mobile */
     .footer-columns .footer-column {
         width: 100% !important;
         max-width: 100% !important;
     }
      
      .footer-links-bottom {
          order: 3;
          justify-content: center;
      }

      /* Top bar: center text perfectly on mobile */
      .custom-top-bar .top-bar-content { flex-direction: column; align-items: center; gap: 6px; text-align: center; }
      .custom-top-bar .top-bar-right a { display: inline-block; line-height: 1.3; }
      
      /* Header logo padding for breathing room on mobile */
      .custom-header .header-content { padding: 8px 0; }
      .header-logo a { padding: 6px 0; }
   }
   
   @media (max-width: 767px) {
       .custom-top-bar .top-bar-content {
           flex-direction: column;
           gap: 5px;
           text-align: center;
       }
       
       .custom-header {
           padding: 15px 0;
       }
       
       .header-logo img {
           max-height: 40px;
       }
       
       .footer-sidebar {
           padding: 30px 20px;
       }
       
       .footer-columns {
           padding: 30px 20px;
       }
       
       .footer-column {
           margin-bottom: 25px;
       }
       /* FAQ mobile spacing fixes */
       .service-faq-section.section-padding { padding-top: 6px !important; padding-bottom: 12px !important; }
       .service-faq-section .service-section-title { margin-bottom: 6px !important; }
       .service-faq-section .service-section-subtitle { margin: 0 0 8px !important; }
       .service-faq-wrapper { margin-top: 0 !important; }
       .service-faq-item { padding: 8px 0 !important; }
       .service-faq-question h4 { margin: 0 !important; font-size: 16px !important; line-height: 1.4 !important; }
       
      .footer-badges {
          align-items: center;
      }
      
      .footer-badges-bottom {
          gap: 10px;
      }
      
      .footer-badges-bottom .badge-item img {
          max-height: 30px;
      }
      
      .footer-badges-bottom .clutch-badge-bottom img {
          max-height: 35px;
      }
      
      .certification-badges,
      .security-badges {
          justify-content: center;
      }
       /* Hide any breaking separators and normalize social icon size */
       .footer-links-bottom a::before { content: none !important; }
       .footer-links-bottom a { border: 0 !important; }
       .footer-social a { width: 32px !important; height: 32px !important; font-size: 14px !important; }
       .footer-social a i { font-size: 14px !important; line-height: 1 !important; }
   }
   
  @media (max-width: 480px) {
      .custom-top-bar {
          font-size: 12px;
          padding: 6px 0;
      }
      
      .main-menu .dropdown-menu {
          min-width: 200px;
      }
      
      .footer-badges-bottom {
          gap: 8px;
      }
      
      .footer-badges-bottom .badge-item img {
          max-height: 25px;
      }
      
      .footer-badges-bottom .clutch-badge-bottom img {
          max-height: 30px;
      }
      
      .footer-badges-bottom .clutch-badge-bottom span {
          font-size: 7px;
      }
      
      .footer-social {
          gap: 10px;
      }
      
       .footer-social a { width: 30px; height: 30px; font-size: 13px; }
      
      .footer-links-bottom {
          flex-direction: column;
          gap: 10px;
      }
  }
   
   /* Performance Optimizations */
   * {
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;
   }
   
   img {
       max-width: 100%;
       height: auto;
   }
   
   /* Accessibility */
   .skip-to-content {
       position: absolute;
       top: -40px;
       left: 0;
       background: #3b3d99;
       color: #fff;
       padding: 8px;
       text-decoration: none;
       z-index: 100;
   }
   
   .skip-to-content:focus {
       top: 0;
   }
   
   /* ========================================
      ADDITIONAL OVERRIDES - Force Visibility
      ======================================== */
   
   /* Force footer sidebar visibility */
   .footer-sidebar,
   .footer-sidebar-content,
   .footer-logo,
   .footer-contact-section,
   .footer-btn,
   .footer-contact-info,
   .footer-contact-info p,
   .footer-contact-info a {
       visibility: visible !important;
       opacity: 1 !important;
       display: block !important;
   }
   
    .footer-btn {
        display: block !important;
        width: 100% !important;
        margin-bottom: 15px !important;
    }
   
   .footer-contact-info {
       display: block !important;
       padding-top: 0px;
   }
   
   .footer-contact-info p {
       display: flex !important;
   }
   
   /* Ensure header menu is horizontal */
   .custom-header .main-menu {
       flex-direction: row !important;
       align-items: center !important;
   }
   
   .custom-header .main-menu > li {
       display: inline-block !important;
       vertical-align: middle !important;
   }
   
   /* Override any theme styles trying to hide elements */
   .custom-header *,
   .custom-footer * {
       visibility: visible !important;
       opacity: 1 !important;
   }
   
   /* Specific footer text color enforcement */
   .footer-sidebar .footer-btn {
       color: #fff !important;
       background: #2e3191 !important;
   }
   
   .footer-sidebar .footer-contact-info p,
   .footer-sidebar .footer-contact-info a {
       color: #333 !important;
   }
   
    .footer-sidebar .footer-contact-info i {
        color: #fff !important;
        background: #2E3191 !important;
    }
   
   /* Make sure container is visible */
   .footer-sidebar .container,
   .footer-columns .container,
   .footer-columns .container-fluid {
       display: block !important;
       visibility: visible !important;
       opacity: 1 !important;
   }

  /* Force-hide any legacy/theme/Elementor footers so only custom footer shows */
  #footer-section.footer-section.main-footer,
  .elementor-location-footer,
  .e-site-footer,
  #hfe-footer,
  .hfe-footer,
  [data-elementor-type="footer"] {
      display: none !important;
  }
  body footer.custom-footer { display: block !important; }
   
  /* Ensure row and columns display properly */
  .footer-columns .row {
      display: grid !important;
      grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
      column-gap: 48px !important;
      row-gap: 0 !important;
      align-items: start !important;
  }
   
   .footer-column {
       display: block !important;
       visibility: visible !important;
   }

  /* Service template: replace Font Awesome with SVG/text fallbacks */
  body.service-template .footer-contact-info i {
      color: transparent !important; /* hide any font glyphs */
      background-repeat: no-repeat !important;
      background-position: center !important;
      background-size: 60% 60% !important;
  }
  /* Envelope */
  body.service-template .footer-contact-info i.fa-envelope {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z'/></svg>") !important;
  }
  /* Phone */
  body.service-template .footer-contact-info i.fa-phone {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M6.6 10.8c1.5 3 3.6 5.1 6.6 6.6l2.2-2.2c.3-.3.8-.4 1.2-.3 1 .3 2 .5 3.1.5.7 0 1.3.6 1.3 1.3V20a2 2 0 0 1-2 2C10.5 22 2 13.5 2 4a2 2 0 0 1 2-2h2.3C7 2 7.6 2.6 7.6 3.3c0 1 .2 2.1.5 3.1.1.4 0 .8-.3 1.2l-2.2 2.2z'/></svg>") !important;
  }
  /* Socials: use text fallbacks; hide <i> and show pseudo-text */
  body.service-template .footer-social a { position: relative; }
  body.service-template .footer-social a i { display: none !important; }
  body.service-template .footer-social a::before {
      content: '';
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      color: currentColor; /* follow anchor color so hover stays visible */
      font-weight: 800;
      font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
      font-size: 16px;
  }
  body.service-template .footer-social a[aria-label="Facebook"]::before { content: 'f'; }
  body.service-template .footer-social a[aria-label="Twitter"]::before { content: 'X'; }
  body.service-template .footer-social a[aria-label="LinkedIn"]::before { content: 'in'; font-size: 14px; }
  body.service-template .footer-social a[aria-label="YouTube"]::before { content: '▶'; }
  body.service-template .footer-social a[aria-label="Instagram"]::before { content: 'IG'; font-size: 13px; }

  /* ===== Service template: Mega menu SVG icon fallbacks (no Font Awesome) ===== */
  body.service-template .mega-menu-column ul li a i::before { content: none !important; } /* hide FA glyphs */
  body.service-template .mega-menu-column ul li a i {
      background-repeat: no-repeat !important;
      background-position: center !important;
      background-size: 70% 70% !important;
  }
  /* UI/UX (pen/ruler) */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/ui-ux-design/"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232e3191'><path d='M7 17l-4 1 1-4 9-9 3 3-9 9zm11.7-11.3l-1.4 1.4-3-3 1.4-1.4c.4-.4 1-.4 1.4 0l1.6 1.6c.4.4.4 1 0 1.4z'/></svg>") !important;
  }
  /* Wireframing (object group) */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/wireframing"] i,
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/wireframing/"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232e3191'><rect x='3' y='4' width='8' height='6' rx='1'/><rect x='13' y='4' width='8' height='6' rx='1'/><rect x='3' y='12' width='8' height='8' rx='1'/><rect x='13' y='12' width='8' height='8' rx='1'/></svg>") !important;
  }
  /* Flutter / Mobile */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/flutter"] i,
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/flutter-app"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232e3191'><path d='M17 1H7C5.9 1 5 1.9 5 3v18c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V3c0-1.1-.9-2-2-2zm0 17H7V6h10v12z'/></svg>") !important;
  }
  /* Prestashop (store) */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/prestashop"] i,
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/prestashop-developer"] i,
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/prestashop-developers"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232e3191'><path d='M4 6l2-3h12l2 3v4c0 4.4-3.6 8-8 8S4 14.4 4 10V6zm2 15h12v2H6z'/></svg>") !important;
  }
  /* BigCommerce / Cart */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/bigcommerce"] i,
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/big-commerce"] i,
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/big-commerce/"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232e3191'><path d='M7 18c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm10 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zM6.2 6l.8 2h11.3l-1.6 6H8.1l-2-8H3V4h3.2l0 .1z'/></svg>") !important;
  }
  /* Web Development (code brackets) */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/web-development"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232e3191'><path d='M8.2 16.6L3.6 12l4.6-4.6L7 6.2 1.2 12 7 17.8l1.2-1.2zm7.6 0l1.2 1.2L23.8 12 17 6.2l-1.2 1.2L20.4 12l-4.6 4.6zM14.6 5l-5.2 14 1.9.7 5.2-14L14.6 5z'/></svg>") !important;
  }
  /* Node.js (hexagon N) */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/node-js"] i,
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/nodejs"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%232e3191' d='M12 2l9 5v10l-9 5-9-5V7l9-5z'/><text x='12' y='15' text-anchor='middle' font-family='Segoe UI,Arial' font-size='9' fill='%23fff'>N</text></svg>") !important;
  }
  /* WooCommerce (bag) */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/woocommerce"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232e3191'><path d='M6 7h12l1 12H5L6 7zm3-3a3 3 0 0 1 6 0v3h-2V4a1 1 0 1 0-2 0v3H9V4z'/></svg>") !important;
  }
  /* WooCommerce (explicit slug variant) */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/wordpress-woocommerce-customization"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232e3191'><path d='M6 7h12l1 12H5L6 7zm3-3a3 3 0 0 1 6 0v3h-2V4a1 1 0 1 0-2 0v3H9V4z'/></svg>") !important;
  }
  /* React (atom) */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/react"] i,
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/react-native"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g fill='none' stroke='%232e3191' stroke-width='1.8'><circle cx='12' cy='12' r='2.2' fill='%232e3191'/><ellipse cx='12' cy='12' rx='9' ry='4.5'/><ellipse cx='12' cy='12' rx='4.5' ry='9' transform='rotate(60 12 12)'/><ellipse cx='12' cy='12' rx='4.5' ry='9' transform='rotate(120 12 12)'/></g></svg>") !important;
  }
  /* Angular (shield A) */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/angular"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%232e3191' d='M12 2l9 3-1.6 12.5L12 22l-7.4-4.5L3 5l9-3z'/><path fill='%23fff' d='M12 7l3.2 8h-1.8l-.7-2H11l-.7 2H8.6L12 7zm.6 4.6l-.6-1.9-.6 1.9h1.2z'/></svg>") !important;
  }
  /* Shopify (bag with S) */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/shopify"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%232e3191' d='M6 7h12l1 12H5L6 7zm3-3a3 3 0 0 1 6 0v3h-2V4a1 1 0 1 0-2 0v3H9V4z'/><text x='12' y='16' text-anchor='middle' font-family='Segoe UI,Arial' font-size='9' fill='%23fff'>S</text></svg>") !important;
  }
  /* Shopify (explicit slug variant) */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/hire-shopify-developers"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%232e3191' d='M6 7h12l1 12H5L6 7zm3-3a3 3 0 0 1 6 0v3h-2V4a1 1 0 1 0-2 0v3H9V4z'/><text x='12' y='16' text-anchor='middle' font-family='Segoe UI,Arial' font-size='9' fill='%23fff'>S</text></svg>") !important;
  }
  /* Android */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/android"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232e3191'><path d='M7 8h10v9a2 2 0 0 1-2 2h-6a2 2 0 0 1-2-2V8zm8.3-3.9l1.2-2 .9.5-1.2 2A5.9 5.9 0 0 1 17 6H7c.2-.6.6-1.2 1.1-1.7l-1.2-2 .9-.5 1.2 2c.9-.5 1.9-.8 3-.8s2.1.3 3 .8zM5 10h2v5H5v-5zm12 0h2v5h-2v-5z'/></svg>") !important;
  }
  /* iOS (Apple) */
  body.service-template .mega-menu-wrapper .mega-menu-column a[href*="/ios"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232e3191'><path d='M16 13c0 3.3 2.7 4.4 2.8 4.5-.1.3-.4 1-1 1.9-.6 1-1.3 1.9-2.3 1.9-1 .1-1.3-.6-2.5-.6s-1.6.6-2.6.6-1.7-.9-2.3-1.9C7.1 18.6 6 16.3 6 14c0-2.8 1.8-4.2 3.5-4.2 1 .1 1.8.7 2.4.7s1.6-.8 2.8-.7c.5 0 2 .2 3 1.6-.1.1-1.7 1-1.7 2.6zM14.9 5.8c.5-.6.9-1.5.8-2.5-.8 0-1.8.5-2.4 1.2-.5.6-.9 1.5-.8 2.5.9.1 1.8-.5 2.4-1.2z'/></svg>") !important;
  }

  /* Caret/down arrow for menu titles (no FA) */
  body.service-template .main-menu > li > a i::before {
      content: '▾';
      display: inline-block;
      font-size: 12px;
      line-height: 1;
  }

  /* ===== About menu: About Us + Founders icons ===== */
  body.service-template .about-menu .mega-menu-column a[href*="/about-us"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232e3191'><path d='M3 21V8l9-5 9 5v13h-7v-6H10v6H3z'/></svg>") !important;
  }
  body.service-template .about-menu .mega-menu-column a[href*="/founders"] i {
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232e3191'><path d='M9 21h6v-2H9v2zm3-20C7.9 1 5 3.9 5 7c0 2.4 1.3 4.5 3.3 5.6L8 15h8l-.3-2.4C17.7 11.5 19 9.4 19 7c0-3.1-2.9-6-7-6z'/></svg>") !important;
  }
  /* Minimal Font Awesome glyph mapping (footer + social icons) */
  .fa, .fas { font-family: "Font Awesome 6 Free" !important; font-weight: 900; font-style: normal; }
  .fab { font-family: "Font Awesome 6 Brands" !important; font-weight: 400; font-style: normal; }
  .fa::before, .fas::before, .fab::before { display: inline-block; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
  .fa-envelope::before { content: "\f0e0"; }
  .fa-phone::before { content: "\f095"; }
  .fa-facebook-f::before { content: "\f39e"; }
  .fa-twitter::before { content: "\f099"; }
  .fa-linkedin-in::before { content: "\f0e1"; }
  .fa-youtube::before { content: "\f167"; }
  .fa-instagram::before { content: "\f16d"; }
  
  /* Ensure hamburger toggle is always clickable and on top on mobile */
  @media (max-width: 991px) {
      .hamburger-menu .menu-collapsed { position: relative; z-index: 10001; }
      .main-mobile-nav { position: sticky; top: 0; z-index: 1000; }
  }
   @media (max-width: 1024px) {
  /* Header: use mobile header at <=1024px */
  .header-nav { display: none !important; }
  .mega-menu-wrapper { display: none !important; }
  .header-cta { display: none !important; }
  .mobile-menu-toggle { display: flex !important; }
  .custom-header .header-content { padding: 8px 0; }

  .footer-sidebar-badges .badges-right-corner {
    margin-left: -19%;
    display: flex;
    gap: 8px;
    margin-bottom: -10%;
    flex-direction: column;
    align-content: stretch;
    justify-content: space-evenly;
    align-items: flex-end;
  }
  .footer-sidebar-badges {
    margin-top: 176px;
    gap: 18px;
    max-width: 209% !important;
    margin-bottom: 18px !important;
    margin-left: -32px;
}

  .footer-title {
    font-size: 18px !important;
    font-weight: 800 !important;
    color: #273171 !important;
    border-bottom: none !important;
    display: block !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    padding-top: 0px !important;
  }

  .footer-columns {
    margin-top: 46px !important;
    margin-left: 0px !important;
    margin-right: -32px !important;
  }

  .footer-copyright {
    color: #fff !important;
    font-size: 13px !important;
    flex-shrink: 0 !important;
    margin-left: 13px !important;
  }

  .custom-footer .footer-grid {
    column-gap: 19px !important;
  }
}