/* Live page navigation dropdown helper */
    .dropbtn1 {
      background-color: transparent;
      color: white;
      padding: 16px;
      font-size: 16px;
      border: none;
      cursor: pointer;
    }

    .dropdown1 {
      position: relative;
      display: inline-block;
    }

    .dropdown-content1 {
      display: none;
      position: absolute;
      right: 0;
      background-color: white;
      min-width: 160px;
      box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
      z-index: 1;
    }

    .dropdown-content1 a {
      color: black;
      padding: 12px 16px;
      text-decoration: none;
      display: block;
    }

    .dropdown-content1 a:hover {
      background-color: #204694;
      color: white !important;
      padding: 12px 16px;
    }

    .dropdown1:hover .dropdown-content1 {
      display: block;
    }

    .dropdown1:hover .dropbtn1 {
      background-color: white;
      color: black;
    }


    /* CUSTOM INTEGRATED STYLE TOKENS FOR REDESIGNED SECTIONS */
    :root {
      --navy: #1B3A5C;
      --teal: #0E7C86;
      --teal-light: #13939F;
      --accent: #F4A622;
      --white: #FFFFFF;
      --off-white: #F7FAFC;
      --light-blue: #E8F4F8;
      --text-dark: #1A2332;
      --text-mid: #445566;
      --text-light: #7A8B99;
      --border: #DDE6EE;
      --max: 1140px;
      --radius: 12px;
    }

    /* GLOBAL TYPOGRAPHY & FIXES */
    body {
      overflow-x: clip !important;
      /* Prevents horizontal scroll without breaking position: sticky */
    }

    p {
      font-size: 16px;
    }

    /* BREADCRUMB */
    /* BREADCRUMB */
    .custom-breadcrumb {
      background: var(--off-white);
      border-bottom: 1px solid var(--border);
      padding: 12px 24px;
      font-size: 13px;
      color: var(--text-light);
      display: block !important;
      visibility: visible !important;
    }

    @media (max-width: 991px) {
      #main {
        margin-top: 25px !important;
      }

      .custom-breadcrumb {
        margin-top: 105px !important;
      }
    }

    .custom-breadcrumb a {
      color: var(--teal);
      text-decoration: none;
    }

    .custom-breadcrumb span {
      margin: 0 6px;
    }

    /* HERO */
    .hero {
      background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.95) 35%, rgba(255, 255, 255, 0) 80%), url('/images/about-us.png') no-repeat right center !important;
      background-size: cover !important;
      padding: 40px 40px !important;
      text-align: left !important;
      position: relative;
      overflow: hidden;
      border-bottom: 1px solid var(--border);
    }

    .hero .container-fluid {
      padding-left: 24px !important;
      /* Matches header logo horizontal alignment */
      padding-right: 24px !important;
      position: relative;
      z-index: 2;
    }

    .hero::before {
      content: '';
      position: absolute;
      top: -80px;
      right: -80px;
      width: 400px;
      height: 400px;
      border-radius: 50%;
      background: rgba(14, 124, 134, 0.05);
      /* Reduced opacity for light background */
      pointer-events: none;
    }

    .hero::after {
      content: '';
      position: absolute;
      bottom: -60px;
      left: -60px;
      width: 300px;
      height: 300px;
      border-radius: 50%;
      background: rgba(244, 166, 34, 0.03);
      /* Reduced opacity for light background */
      pointer-events: none;
    }

    .hero-eyebrow {
      display: inline-block;
      background: rgba(14, 124, 134, 0.1);
      color: var(--teal);
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 2px;
      text-transform: uppercase;
      padding: 6px 16px;
      border-radius: 20px;
      margin-bottom: 20px;
      border: 1px solid rgba(14, 124, 134, 0.2);
    }

    .hero h1 {
      font-size: clamp(2rem, 5vw, 3rem) !important;
      font-weight: 800;
      color: var(--navy) !important;
      /* Changed from white to navy */
      line-height: 1.2;
      max-width: 780px;
      margin: 0 0 15px 0 !important;
      text-align: left !important;
      font-family: 'Montserrat', sans-serif !important;
      text-shadow: none !important;
    }

    .hero h1 em {
      font-style: normal;
      color: #FF5722 !important;
      /* Changed to match image */
    }

    .hero-sub {
      font-size: clamp(0.95rem, 2vw, 1.1rem);
      color: var(--text-mid) !important;
      /* Changed from white to text-mid (slate) */
      max-width: 800px;
      margin: 0 0 25px 0 !important;
      text-align: left !important;
      text-shadow: none !important;
      line-height: 1.6 !important;
    }

    .hero-cta-group {
      display: flex;
      gap: 12px;
      justify-content: flex-start !important;
      flex-wrap: wrap;
    }

    .btn-primary {
      background: var(--teal);
      color: var(--white) !important;
      padding: 15px 32px;
      border-radius: 8px;
      font-size: 15px;
      font-weight: 700;
      text-decoration: none;
      border: none;
      cursor: pointer;
      transition: background 0.2s, transform 0.15s;
      display: inline-block;
    }

    .btn-primary:hover {
      background: var(--teal-light);
      transform: translateY(-1px);
    }

    .btn-ghost {
      background: transparent;
      color: var(--white) !important;
      padding: 14px 32px;
      border-radius: 8px;
      font-size: 15px;
      font-weight: 600;
      text-decoration: none;
      border: 2px solid rgba(255, 255, 255, 0.4);
      transition: border-color 0.2s, background 0.2s;
      display: inline-block;
    }

    .btn-ghost:hover {
      border-color: white;
      background: rgba(255, 255, 255, 0.08);
    }

    /* Hero Light-Background Button Overrides */
    .hero .btn-primary {
      background: var(--navy) !important;
      color: var(--white) !important;
      font-weight: 600 !important;
      padding: 12px 28px !important;
    }

    .hero .btn-primary:hover {
      background: var(--teal) !important;
    }

    .hero .btn-ghost {
      border: 2px solid var(--navy) !important;
      color: var(--navy) !important;
      font-weight: 600 !important;
      padding: 10px 28px !important;
    }

    .hero .btn-ghost:hover {
      background: rgba(27, 58, 92, 0.08) !important;
      color: var(--navy) !important;
    }

    /* TRUST BAR - MINIMAL & PROFESSIONAL */
    .trust-bar {
      background: var(--white) !important;
      /* Minimal white background */
      border-top: 1px solid var(--border) !important;
      border-bottom: 1px solid var(--border) !important;
      padding: 24px 24px !important;
      /* Slightly more compact vertical padding */
    }

    .trust-bar-inner {
      max-width: var(--max);
      margin: 0 auto;
      display: flex;
      justify-content: space-around;
      /* Distribute stats evenly */
      gap: 20px;
      flex-wrap: wrap;
    }

    .trust-stat {
      text-align: center;
      flex: 1;
      min-width: 140px;
      position: relative;
    }

    /* Vertical dividers between stats on desktop */
    .trust-stat:not(:last-child)::after {
      content: '';
      position: absolute;
      right: -10px;
      top: 25% !important;
      /* Centered, shorter divider */
      height: 50% !important;
      width: 1px;
      background: var(--border);
    }

    .trust-stat strong {
      display: inline-flex !important;
      /* Forces inline flex for caret/number alignment */
      align-items: baseline !important;
      justify-content: center !important;
      font-size: 2.2rem !important;
      /* Large, modern bold numbers */
      font-weight: 800 !important;
      color: #FF5722 !important;
      /* Image orange accent */
      line-height: 1.1 !important;
      font-family: 'Montserrat', sans-serif !important;
    }

    .trust-stat strong span,
    .trust-stat .purecounter {
      font-family: 'Montserrat', sans-serif !important;
      font-weight: 800 !important;
      font-size: 2.2rem !important;
      color: #FF5722 !important;
      line-height: 1.1 !important;
    }

    /* Custom override for text elements like Pan-India to keep them proportional */
    .trust-stat strong.text-stat {
      font-size: 1.6rem !important;
      font-weight: 700 !important;
      letter-spacing: -0.5px !important;
      line-height: 1.3 !important;
    }

    .trust-stat span {
      font-size: 11px !important;
      /* Slightly smaller for premium minimal look */
      font-weight: 700 !important;
      color: var(--text-light) !important;
      text-transform: uppercase;
      letter-spacing: 1px !important;
      margin-top: 6px !important;
      display: block;
      line-height: 1.3 !important;
    }

    /* SECTION UTILITY */
    .purpose-section,
    .how-section,
    .services-section,
    .journey-section,
    .diff-section,
    .clients-section,
    .contact-section,
    .faq-section {
      padding: 80px 24px;
    }

    .custom-container {
      max-width: var(--max);
      margin: 0 auto;
    }

    .section-label {
      display: block !important;
      /* Forces vertical stacking on its own line */
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 2.5px;
      text-transform: uppercase;
      color: var(--teal);
      margin-bottom: 12px;
      text-align: left;
    }

    .section-title {
      font-size: clamp(1.6rem, 3vw, 2.4rem);
      font-weight: 800;
      color: var(--navy);
      line-height: 1.25;
      margin-bottom: 16px;
      text-align: left;
      font-family: 'Montserrat', sans-serif !important;
    }

    .section-body {
      font-size: 16px;
      color: var(--text-mid);

      line-height: 1.75;
      text-align: left;
    }

    /* WHY WE EXIST */
    .purpose-section {
      background: var(--off-white);
    }

    .purpose-grid {
      display: grid;
      grid-template-columns: 1.15fr 0.85fr;
      gap: 64px;
      align-items: stretch;
      /* Stretches both columns to the same height */
    }

    .purpose-copy p {
      margin-bottom: 18px;
      font-size: 1.05rem;
      color: var(--text-mid);
      line-height: 1.75;
      text-align: left;
    }

    .purpose-copy p strong {
      color: var(--navy);
    }

    .purpose-quote {
      background: var(--white);
      border-left: 4px solid var(--teal);
      padding: 28px 32px;
      border-radius: 0 var(--radius) var(--radius) 0;
      margin-top: 24px;
      box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);
      text-align: left;
    }

    .purpose-quote blockquote {
      font-size: 1.2rem;
      font-style: italic;
      color: var(--navy);
      font-weight: 600;
      line-height: 1.6;
    }

    .purpose-quote cite {
      display: block;
      margin-top: 12px;
      font-size: 13px;
      color: var(--text-light);
      font-style: normal;
    }

    .purpose-visual {
      background: linear-gradient(145deg, var(--navy) 0%, var(--teal) 100%);
      border-radius: var(--radius);
      padding: 48px 40px;
      margin-top: 0 !important;
      color: white;
      display: flex;
      flex-direction: column;
      justify-content: center;
      /* Center the content vertically inside the stretched box */
    }

    .purpose-visual h3 {
      font-size: 1rem;
      font-weight: 700;
      letter-spacing: 1.5px;
      text-transform: uppercase;
      color: rgba(255, 255, 255, 0.85) !important;
      /* Forces high-contrast white text against the navy background */
      margin-bottom: 32px;
      text-align: left;
    }

    .pyramid-item {
      display: flex;
      align-items: center;
      gap: 16px;
      padding: 14px 0;
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      text-align: left;
    }

    .pyramid-item:last-child {
      border-bottom: none;
    }

    .pyramid-dot {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      flex-shrink: 0;
    }

    .pyramid-item-text {
      font-size: 0.95rem;
      font-weight: 600;
      color: white;
    }

    .pyramid-item-sub {
      font-size: 0.78rem;
      color: rgba(255, 255, 255, 0.5);
      margin-top: 2px;
    }

    /* HOW WE WORK */
    .how-section {
      background: var(--white);
    }

    .how-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 32px;
      margin-top: 56px;
    }

    .how-card {
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 36px 28px;
      transition: box-shadow 0.2s, border-color 0.2s;
      text-align: left;
    }

    .how-card:hover {
      box-shadow: 0 8px 32px rgba(14, 124, 134, 0.12);
      border-color: var(--teal);
    }

    .how-icon {
      width: 52px;
      height: 52px;
      background: var(--light-blue);
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 20px;
      font-size: 24px;
    }

    .how-card h3 {
      font-size: 1.1rem;
      font-weight: 700;
      color: var(--navy);
      margin-bottom: 10px;
    }

    .how-card p {
      font-size: 0.92rem;
      color: var(--text-mid);
      line-height: 1.65;
    }

    /* SERVICES */
    .services-section {
      background: var(--off-white);
    }

    .services-intro {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 64px;
      align-items: start;
      margin-bottom: 56px;
      text-align: left;
    }

    .services-list {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 20px;
      text-align: left;
    }

    .service-card {
      background: var(--white);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 24px;
      text-decoration: none;
      color: inherit;
      transition: box-shadow 0.2s, transform 0.2s;
      display: block;
    }

    .service-card:hover {
      box-shadow: 0 6px 24px rgba(27, 58, 92, 0.1);
      transform: translateY(-2px);
    }

    .service-card-badge {
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 1.5px;
      text-transform: uppercase;
      color: var(--teal);
      margin-bottom: 8px;
      display: block;
    }

    .service-card h3 {
      font-size: 1rem;
      font-weight: 700;
      color: var(--navy);
      margin-bottom: 8px;
    }

    .service-card p {
      font-size: 0.85rem;
      color: var(--text-mid);
      line-height: 1.6;
    }

    .service-card-platform {
      margin-top: 12px;
      font-size: 11px;
      color: var(--text-light);
      display: flex;
      align-items: center;
      gap: 6px;
      flex-wrap: wrap;
    }

    .platform-tag {
      background: var(--light-blue);
      color: var(--teal);
      padding: 2px 8px;
      border-radius: 4px;
      font-size: 10px;
      font-weight: 600;
    }

    /* JOURNEY */
    .journey-section {
      background: var(--white);
    }

    .timeline {
      position: relative;
      margin-top: 56px;
      padding-left: 0;
      text-align: left;
    }

    .timeline::before {
      content: '';
      position: absolute;
      left: 8px;
      top: 12px;
      bottom: 12px;
      width: 4px;
      background: linear-gradient(to bottom, var(--teal), var(--navy));
      border-radius: 2px;
    }

    .timeline-item {
      position: relative;
      padding-left: 36px;
      padding-bottom: 40px;
      display: block !important;
      /* Forces vertical block layout stacking */
      width: 100% !important;
    }

    .timeline-item:last-child {
      padding-bottom: 0;
    }

    .timeline-dot {
      position: absolute;
      left: 0px;
      top: 4px;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background: var(--teal);
      border: 4px solid var(--white);
      box-shadow: 0 0 0 4px rgba(14, 124, 134, 0.2);
      z-index: 2;
    }

    .timeline-year {
      font-size: 12px;
      font-weight: 700;
      color: var(--teal) !important;
      letter-spacing: 1.5px;
      text-transform: uppercase;
      margin-bottom: 8px !important;
      display: block !important;
    }

    .timeline-item h3 {
      font-size: 1.25rem !important;
      font-weight: 700 !important;
      color: var(--navy) !important;
      margin-bottom: 12px !important;
      display: block !important;
      line-height: 1.35 !important;
    }

    .timeline-item p {
      font-size: 0.95rem !important;
      color: var(--text-mid) !important;
      line-height: 1.65 !important;
      max-width: 720px !important;
      display: block !important;
      margin: 0 !important;
    }

    /* WHAT SETS US APART */
    .diff-section {
      background: var(--navy) !important;
      padding: 80px 24px;
    }

    .diff-section .section-label {
      color: #5DD6DF !important;
    }

    .diff-section .section-title {
      color: var(--white) !important;
    }

    .diff-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 24px;
      margin-top: 48px;
      text-align: left;
    }

    .diff-card {
      background: rgba(255, 255, 255, 0.06);
      border: 1px solid rgba(255, 255, 255, 0.1);
      border-radius: var(--radius);
      padding: 32px 28px;
    }

    .diff-number {
      font-size: 2.5rem;
      font-weight: 900;
      color: white !important;
      /* Made the card numbers solid white as requested */
      line-height: 1;
      margin-bottom: 8px;
    }

    .diff-card h3 {
      font-size: 1rem;
      font-weight: 700;
      color: white !important;
      margin-bottom: 10px;
    }

    .diff-card p {
      font-size: 0.9rem;
      color: rgba(255, 255, 255, 0.85);
      line-height: 1.65;
    }

    /* CLIENT LOGOS */
    .clients-section {
      background: var(--off-white);
      margin: 50px 0px;
    }

    .clients-intro {
      text-align: center;
      margin-bottom: 48px;
    }

    .clients-intro .section-title {
      margin-left: auto;
      margin-right: auto;
    }

    .clients-grid {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 16px;
    }

    .client-logo {
      background: var(--white);
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 20px 16px;
      text-align: center;
      font-size: 12px;
      font-weight: 600;
      color: var(--text-mid);
      min-height: 72px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    /* LEAD FORM */
    .contact-section {
      background: linear-gradient(135deg, var(--teal) 0%, var(--navy) 100%);
      padding: 96px 24px;
    }

    .contact-grid {
      max-width: var(--max);
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 80px;
      align-items: start;
      text-align: left;
    }

    .contact-copy h2 {
      font-size: clamp(1.8rem, 3vw, 2.6rem);
      font-weight: 800;
      color: white;
      line-height: 1.2;
      margin-bottom: 20px;
    }

    .contact-copy p {
      color: rgba(255, 255, 255, 0.75);
      font-size: 1.05rem;
      line-height: 1.7;
      margin-bottom: 32px;
    }

    .contact-bullets {
      list-style: none;
    }

    .contact-bullets li {
      color: rgba(255, 255, 255, 0.8);
      font-size: 0.95rem;
      padding: 8px 0;
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .contact-bullets li::before {
      content: '✓';
      color: #5DD6DF;
      font-weight: 700;
      font-size: 14px;
    }

    .contact-form {
      background: white;
      border-radius: 16px;
      padding: 40px 36px;
      box-shadow: 0 24px 64px rgba(0, 0, 0, 0.2);
      text-align: left;
    }

    .contact-form h3 {
      font-size: 1.25rem;
      font-weight: 700;
      color: var(--navy);
      margin-bottom: 6px;
    }

    .contact-form .form-sub {
      font-size: 0.88rem;
      color: var(--text-light);
      margin-bottom: 28px;
    }

    .form-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 16px;
    }

    .form-group {
      margin-bottom: 18px;
    }

    .form-group label {
      display: block;
      font-size: 13px;
      font-weight: 600;
      color: var(--text-dark);
      margin-bottom: 6px;
    }

    .form-group input,
    .form-group select,
    .form-group textarea {
      width: 100%;
      padding: 11px 14px;
      border: 1.5px solid var(--border);
      border-radius: 8px;
      font-size: 14px;
      color: var(--text-dark);
      background: white;
      transition: border-color 0.2s;
      font-family: inherit;
    }

    .form-group input:focus,
    .form-group select:focus,
    .form-group textarea:focus {
      outline: none;
      border-color: var(--teal);
      box-shadow: 0 0 0 3px rgba(14, 124, 134, 0.25) !important;
    }

    .form-group textarea {
      resize: vertical;
      min-height: 90px;
    }

    .form-submit {
      width: 100%;
      padding: 15px;
      background: var(--teal);
      color: white !important;
      font-size: 15px;
      font-weight: 700;
      border: none;
      border-radius: 8px;
      cursor: pointer;
      transition: background 0.2s;
      margin-top: 4px;
    }

    .form-submit:hover {
      background: var(--teal-light);
    }

    .form-note {
      text-align: center;
      font-size: 12px;
      color: var(--text-light);
      margin-top: 12px;
    }

    /* FAQ - INTERACTIVE BOOTSTRAP ACCORDION */
    .faq-section {
      background: var(--white) !important;
      padding: 80px 24px;
    }

    .faq-section .accordion {
      max-width: 800px;
      margin: 48px auto 0;
      border: none !important;
      background: transparent !important;
    }

    .faq-section .accordion-item {
      border: none !important;
      border-bottom: 1px solid var(--border) !important;
      background: transparent !important;
      border-radius: 0 !important;
    }

    .faq-section .accordion-item:last-child {
      border-bottom: none !important;
    }

    .faq-section .accordion-header {
      margin: 0 !important;
      padding: 0 !important;
    }

    .faq-section .accordion-button {
      background: transparent !important;
      border: none !important;
      box-shadow: none !important;
      padding: 24px 0 !important;
      font-size: 1.1rem !important;
      font-weight: 700 !important;
      color: var(--navy) !important;
      text-align: left !important;
      display: flex !important;
      justify-content: space-between !important;
      align-items: center !important;
      width: 100% !important;
      transition: color 0.2s !important;
    }

    .faq-section .accordion-button:not(.collapsed) {
      color: var(--teal) !important;
    }

    /* Style and transition caret arrow */
    .faq-section .accordion-button::after {
      background-size: 1rem !important;
      transition: transform 0.2s !important;
      filter: brightness(0.1) !important;
      /* Forces dark navy caret in collapsed state */
    }

    .faq-section .accordion-button:not(.collapsed)::after {
      filter: invert(32%) sepia(87%) saturate(542%) hue-rotate(137deg) brightness(92%) contrast(92%) !important;
      /* Converts caret to brand teal when active */
    }

    .faq-section .accordion-body {
      padding: 0 0 24px 0 !important;
      font-size: 0.95rem !important;
      color: var(--text-mid) !important;
      line-height: 1.7 !important;
    }

    /* FOOTER CTA */
    .footer-cta {
      background: var(--off-white);
      border-top: 1px solid var(--border);
      padding: 64px 24px;
      text-align: center;
    }

    .footer-cta h2 {
      font-size: clamp(1.5rem, 3vw, 2rem);
      font-weight: 800;
      color: var(--navy);
      margin-bottom: 12px;
    }

    .footer-cta p {
      font-size: 1rem;
      color: var(--text-mid);
      margin-bottom: 32px;
      max-width: 480px;
      margin-left: auto;
      margin-right: auto;
    }

    .footer-cta-group {
      display: flex;
      gap: 16px;
      justify-content: center;
      flex-wrap: wrap;
    }

    .btn-navy {
      background: var(--navy);
      color: white !important;
      padding: 15px 32px;
      border-radius: 8px;
      font-size: 15px;
      font-weight: 700;
      text-decoration: none;
      transition: background 0.2s;
      display: inline-block;
    }

    .btn-navy:hover {
      background: #142d49;
    }

    .btn-outline-navy {
      background: transparent;
      color: var(--navy) !important;
      padding: 14px 32px;
      border-radius: 8px;
      font-size: 15px;
      font-weight: 600;
      text-decoration: none;
      border: 2px solid var(--navy);
      transition: background 0.2s, color 0.2s;
      display: inline-block;
    }

    .btn-outline-navy:hover {
      background: var(--navy);
      color: white !important;
    }

    /* RESPONSIVE */
    @media (max-width: 900px) {

      .purpose-grid,
      .services-intro,
      .contact-grid,
      .how-grid,
      .diff-grid,
      .faq-grid {
        grid-template-columns: 1fr;
        gap: 40px;
      }

      .services-list {
        grid-template-columns: 1fr;
      }

      .clients-grid {
        grid-template-columns: repeat(3, 1fr);
      }

      .form-row {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 600px) {

      .purpose-section,
      .how-section,
      .services-section,
      .journey-section,
      .diff-section,
      .clients-section,
      .contact-section,
      .faq-section {
        padding: 56px 16px;
      }

      .clients-grid {
        grid-template-columns: repeat(2, 1fr);
      }

      .trust-bar-inner {
        gap: 28px;
      }
    }

  

    body {
      padding-top: 0 !important;
      /* Removed body padding to prevent double-offset white space */
    }


    /* SERVICE CARD BUTTONS & HOVER EFFECTS */
    .service-card-btn {
      display: inline-flex !important;
      align-items: center !important;
      gap: 6px !important;
      color: var(--teal) !important;
      font-size: 13px !important;
      font-weight: 700 !important;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      margin-top: auto !important;
      /* Pushes button to bottom of flex container */
      padding-top: 20px !important;
      transition: gap 0.2s ease !important;
    }

    .service-card:hover .service-card-btn {
      gap: 10px !important;
      /* Visual cue: arrow slides right slightly on card hover */
      color: var(--teal-light) !important;
    }

    /* SCROLL REVEAL ANIMATIONS */
    .reveal-on-scroll {

      transform: translateY(30px);
      transition: opacity 0.8s ease-out, transform 0.8s ease-out;
      will-change: opacity, transform;
    }

    .reveal-on-scroll.is-visible {
      opacity: 1;
      transform: translateY(0);
    }
  

  /* Header & Navbar Alignment Overrides */
  #header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 9999 !important;
    height: auto !important;
    padding: 15px 0 !important;
    background-color: #ffffff !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05) !important;
    border-bottom: 1px solid var(--border) !important;
    display: flex !important;
    align-items: center !important;
  }
    /* Header & Navbar Alignment Overrides */
    #header {
      position: fixed !important;
      top: 0 !important;
      left: 0 !important;
      right: 0 !important;
      z-index: 9999 !important;
      height: auto !important;
      padding: 15px 0 !important;
      /* Increased padding for logo breathing room */
      background-color: #ffffff !important;
      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
      border-bottom: 1px solid var(--border) !important;
      display: flex !important;
      align-items: center !important;
    }
    
    
    #main {
      margin-top: 105px !important;
      /* Perfect offset for desktop header height (75px logo + 30px padding) */
    }

    @media (max-width: 991px) {
      #main {
        margin-top: 25px !important;
        /* Slightly smaller offset for mobile headers */
      }
    }

    #header .container,
    #header .container-fluid {
      display: flex !important;
      flex-direction: row !important;
      flex-wrap: nowrap !important;
      /* Forces items to stay on a single line */
      align-items: center !important;
      justify-content: space-between !important;
      width: 100% !important;
    }

    #header .logo {
      margin: 0 !important;
      padding: 0 !important;
      display: inline-flex !important;
      align-items: center !important;
      flex-shrink: 0 !important;
      /* Prevents logo from shrinking */
    }

    #header .logo a {
      display: inline-flex !important;
      align-items: center !important;
    }

    #header .logo img {
      max-height: 85px !important;
      width: 140px !important;
      display: block !important;
    }


    @media (min-width: 992px) {
      #navbar {
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex-grow: 1 !important;
        /* Allow menu wrapper to expand and align items to the right */
      }

      #navbar ul {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        /* Forces navigation links to stay on a single row */
        align-items: center !important;
        gap: 12px !important;
        /* Comfortable spacing */
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
      }
    }

    #navbar a,
    #navbar .dropbtn1 {
      font-size: 13.5px !important;
      font-weight: 600 !important;
      color: var(--text-dark) !important;
      text-decoration: none !important;
      padding: 8px 10px !important;
      transition: color 0.2s, background-color 0.2s !important;
      border-radius: 4px !important;
      white-space: nowrap !important;
      /* Prevents text wrapping within a link */
    }

    #navbar a:hover,
    #navbar .dropdown1:hover .dropbtn1 {
      color: var(--teal) !important;
      background-color: var(--off-white) !important;
    }

    #navbar a.active {
      color: var(--teal) !important;
      background-color: var(--light-blue) !important;
    }

    #navbar a.upload-resume-btn {
      color: white !important;
      background-color: var(--teal) !important;
      padding: 8px 16px !important;
      font-weight: 700 !important;
      border-radius: 6px !important;
      white-space: nowrap !important;
    }

    #navbar a.upload-resume-btn:hover {
      background-color: var(--teal-light) !important;
    }

    /* Services Dropdown Alignment */
    .dropdown1 {
      position: relative;
      display: inline-block !important;
    }

    .dropdown1 .dropbtn1 {
      background: transparent !important;
      border: none !important;
      cursor: pointer;
      display: inline-flex !important;
      align-items: center !important;
      gap: 5px !important;
      font-family: inherit !important;
      margin: 0 !important;
      line-height: normal !important;
      height: auto !important;
    }

    .dropdown-content1 {
      display: none;
      position: absolute;
      top: 100%;
      left: 0;
      background-color: white;
      min-width: 220px;
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
      border: 1px solid var(--border);
      border-radius: 8px;
      z-index: 9999;
      margin-top: 8px;
      padding: 6px 0;
    }

    .dropdown-content1 a {
      color: var(--text-dark) !important;
      padding: 10px 18px !important;
      display: block !important;
      font-size: 13px !important;
      font-weight: 500 !important;
      text-align: left !important;
      background: none !important;
      border-radius: 0 !important;
    }

    .dropdown-content1 a:hover {
      background-color: var(--off-white) !important;
      color: var(--teal) !important;
    }

    .dropdown1:hover .dropdown-content1 {
      display: block !important;
    }

    /* Hide social links on screen sizes where layout wraps */
    @media (max-width: 1200px) {
      .header-social-links {
        display: none !important;
      }
    }

    .header-social-links {
      flex-shrink: 0 !important;
      margin-left: 20px !important;
    }
  #header .container, #header .container-fluid {
    display: flex !important;
    
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 15px !important;
  }
  #header .logo {
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
  }
  #header .logo a {
    display: inline-flex !important;
    align-items: center !important;
  }
  #header .logo img {
      max-height: 85px !important;
      width: 140px !important;
      display: block !important;
    }
  @media (min-width: 992px) {
    #navbar {
      padding: 0 !important;
      display: flex !important;
      align-items: center !important;
      justify-content: flex-end !important;
      flex-grow: 1 !important;
    }
    #navbar ul {
      display: flex !important;
      flex-direction: row !important;
      flex-wrap: wrap !important;
      align-items: center !important;
      justify-content: flex-end !important;
      gap: 5px !important;
      margin: 0 !important;
      padding: 0 !important;
      list-style: none !important;
    }
  }
  #navbar a, #navbar .dropbtn1 {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--text-dark) !important;
    text-decoration: none !important;
    padding: 8px 8px !important;
    transition: color 0.2s, background-color 0.2s !important;
    border-radius: 4px !important;
    white-space: nowrap !important;
  }
  #navbar a:hover, #navbar .dropdown1:hover .dropbtn1 {
    color: var(--teal) !important;
    background-color: var(--off-white) !important;
  }
#navbar a.active {
    color: var(--teal) !important;
    background-color: var(--light-blue) !important;
}
  #navbar a.upload-resume-btn {
    color: white !important;
    background-color: #0e7c86 !important;
    padding: 8px 16px !important;
    font-weight: 700 !important;
    border-radius: 6px !important;
    white-space: nowrap !important;
  }
  #navbar a.upload-resume-btn:hover {
    background-color: var(--teal-light) !important;
  }
  .dropdown1 {
    position: relative;
    display: inline-block !important;
  }
  .dropdown1 .dropbtn1 {
    background: transparent !important;
    border: none !important;
    cursor: pointer;
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-family: inherit !important;
    margin: 0 !important;
    line-height: normal !important;
    height: auto !important;
  }
  .dropdown-content1 {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: white;
    min-width: 220px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    border: 1px solid var(--border);
    border-radius: 8px;
    z-index: 9999;
    margin-top: 0px;
    margin-bottom:-10px;
    padding: 6px 0;
  }
  .dropdown-content1 a {
    color: var(--text-dark) !important;
    padding: 10px 18px !important;
    display: block !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-align: left !important;
    background: none !important;
    border-radius: 0 !important;
  }
  .dropdown-content1 a:hover {
    background-color: var(--off-white) !important;
    color: var(--teal) !important;
  }
  .dropdown1:hover .dropdown-content1 {
    display: block !important;
  }

  /* Mobile Navbar Full-Width Overrides */
  .navbar-mobile {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    background: rgba(27, 58, 92, 0.95) !important;
    z-index: 9999 !important;
    width: 100vw !important;
    height: 100vh !important;
  }
  .navbar-mobile ul {
    display: flex !important;
    flex-direction: column !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    padding: 60px 20px 20px 20px !important; 
    background-color: #fff !important;
    overflow-y: auto !important;
    border-radius: 0 !important; 
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    height: 100vh !important;
    align-items: stretch !important;
  }
  .navbar-mobile a, .navbar-mobile .dropbtn1 {
    font-size: 16px !important;
    padding: 15px 20px !important;
    color: var(--text-dark) !important;
    display: block !important;
    border-bottom: 1px solid var(--border) !important;
    white-space: normal !important;
    text-align: left !important;
    width: 100% !important;
  }
  .navbar-mobile a.upload-resume-btn {
    margin-top: 15px !important;
    text-align: center !important;
    border: none !important;
    width: auto !important;
    display: inline-block !important;
    margin-left: 20px !important;
    margin-right: 20px !important;
  }
  .navbar-mobile .dropdown-content1 {
    position: static !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
    background-color: var(--off-white) !important;
    padding: 0 !important;
    margin: 0 !important;
    display: none;
    width: 100% !important;
  }
  .navbar-mobile .dropdown1.active .dropdown-content1,
  .navbar-mobile .dropdown1:hover .dropdown-content1 {
    display: block !important;
  }
  
  /* Mobile Close Icon (bi-x) */
  .mobile-nav-toggle {
    color: var(--navy) !important;
    font-size: 32px !important;
    cursor: pointer !important;
    line-height: 0 !important;
    transition: 0.5s !important;
    z-index: 10000 !important; 
  }
  .navbar-mobile .mobile-nav-toggle {
    position: absolute !important;
    top: 15px !important;
    right: 15px !important;
    color: var(--navy) !important; /* Make sure the close icon is dark on the white background */
  }


    /* NEW PREMIUM DARK FOOTER STYLING OVERRIDES */
    .footer {
      background: #0e1d34 !important;
      /* Premium dark navy background */
      color: rgba(255, 255, 255, 0.7) !important;
      padding: 80px 0 40px !important;
      font-size: 0.95rem !important;
      line-height: 1.6 !important;
      border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
    }

    .footer h4,
    .footer-heading {
      color: var(--white) !important;
      font-size: 1.1rem !important;
      font-weight: 700 !important;
      margin-top: 0 !important;
      margin-bottom: 24px !important;
      position: relative;
      padding-bottom: 12px;
      border-bottom: 2px solid rgba(255, 255, 255, 0.08);
    }

    .footer h4::after,
    .footer-heading::after {
      content: '';
      position: absolute;
      left: 0;
      bottom: -2px;
      width: 45px;
      height: 2px;
      background: var(--teal) !important;
    }

    .footer-item {
      margin-bottom: 30px;
    }

    .footer-brand img {
      margin-bottom: 20px;
      filter: brightness(0) invert(1);
      /* Dynamically turns the dark logo white */
    }

    .footer-brand p {
      font-size: 0.9rem;
      line-height: 1.6;
      color: rgba(255, 255, 255, 0.65) !important;
    }

    .footer-social-links {
      margin-top: 20px;
      display: flex;
      gap: 12px;
    }

    .footer-social-links a {
      width: 36px;
      height: 36px;
      background: rgba(255, 255, 255, 0.06);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      color: var(--white) !important;
      transition: all 0.2s ease;
      text-decoration: none !important;
    }

    .footer-social-links a:hover {
      background: var(--teal) !important;
      color: var(--navy) !important;
      transform: translateY(-2px);
    }

    .footer-links-list {
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .footer-links-list li {
      margin-bottom: 12px;
    }

    .footer-links-list a {
      color: rgba(255, 255, 255, 0.7) !important;
      text-decoration: none;
      transition: all 0.2s ease;
      display: inline-block;
    }

    .footer-links-list a:hover {
      color: var(--teal) !important;
      transform: translateX(4px);
      /* Interactive arrow shift simulation */
    }

    .footer-contact-list {
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .footer-contact-list li {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      margin-bottom: 16px;
      color: rgba(255, 255, 255, 0.7);
      font-size: 0.9rem;
    }

    .footer-contact-list li i {
      color: var(--teal) !important;
      margin-top: 4px;
    }

    .footer-contact-list li span,
    .footer-contact-list li div {
      line-height: 1.5;
    }

    /* Scroll box and job listing style adjustments */
    .footer .scroll-box {

      padding: 16px !important;
    }

    .footer .job-item {
      border-bottom: 1px solid rgba(255, 255, 255, 0.06);
      padding: 8px 0 !important;
    }

    .footer .job-item:last-child {
      border-bottom: none;
    }

    .footer .job-item a {
      color: rgba(255, 255, 255, 0.8) !important;
      font-size: 0.85rem !important;
      font-weight: 600 !important;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      transition: color 0.2s;
    }

    .footer .job-item a:hover {
      color: var(--teal) !important;
    }

    .footer-map-wrapper {
      margin-top: 20px;
      border-radius: 8px;
      overflow: hidden;
      border: 1px solid rgba(255, 255, 255, 0.08);
    }

    /* Footer bottom details styling */
    .footer-bottom {
      margin-top: 40px;
      padding-top: 30px;
      border-top: 1px solid rgba(255, 255, 255, 0.08);
    }

    .footer-bottom p {
      margin: 0;
      font-size: 0.85rem;
      color: rgba(255, 255, 255, 0.45) !important;
    }

    .footer-bottom a {
      color: rgba(255, 255, 255, 0.6) !important;
      text-decoration: none;
      font-size: 0.85rem;
      transition: color 0.2s;
    }

    .footer-bottom a:hover {
      color: var(--teal) !important;
    }

    .review-img {
      max-height: 44px;
      width: auto;
      transition: transform 0.2s;
    }

    .review-img:hover {
      transform: scale(1.03);
    }

    .floating-call {
      position: fixed;
      left: 20px;
      bottom: 20px;
      z-index: 9999;
    }

    .call-btn {
      width: 60px;
      height: 60px;
      background: #25D366;
      color: #fff;
      border-radius: 50%;
      text-align: center;
      line-height: 60px;
      font-size: 26px;
      cursor: pointer;
      box-shadow: 0 4px 10px rgba(0, 0, 0, .3);
      animation: pulse 1.5s infinite;
    }

    .call-options {
      display: none;
      margin-bottom: 10px;
    }

    .call-options a {
      display: block;
      background: #204694;
      color: white !important;
      padding: 10px 15px;
      margin-bottom: 8px;
      border-radius: 30px;
      text-decoration: none;
      white-space: nowrap;
      box-shadow: 0 4px 10px rgba(0, 0, 0, .2);
    }

    .call-options a:hover {
      background: #16346b;
    }

    .floating-call.active .call-options {
      display: block;
    }

    @keyframes pulse {
      0% {
        transform: scale(1);
      }

      50% {
        transform: scale(1.08);
      }

      100% {
        transform: scale(1);
      }
    }

    @media(max-width:768px) {
      .floating-call {
        left: 15px;
        bottom: 20px;
      }
    }