/* Desktop Alternating layout calculations */
    @media (min-width: 768px) {
        body{
            overflow:hidden !important;
        }
      .process-card-left {
        margin-right: 50px;
        text-align: right;
      }
      .process-card-right {
        margin-left: 50px;
        text-align: left;
      }
    }

    /* Mobile Timeline responsiveness adjustments */
    @media (max-width: 767.98px) {
      .workflow-container::before {
        left: 20px;
      }
      .process-badge {
        left: 20px;
        transform: none;
      }
      .process-card {
        margin-left: 50px !important;
        text-align: left !important;
      }
    }

      @media (max-width: 767.98px) {
      .timeline-container::before {
        left: 20px;
        transform: none;
      }
      .process-badge {
        left: 20px;
        transform: translate(-50%, -50%);
      }
      .process-node:hover .process-badge {
        transform: translate(-50%, -50%) scale(1.1);
      }
      .process-card {
        padding: 1.5rem;
        margin-left: 25px;
      }
      .process-card::before {
        left: 0 !important;
        right: auto !important;
        border-radius: 4px 0 0 4px !important;
      }
      .process-node {
        margin-bottom: 2.5rem;
      }
    }
          /* Custom adjustment to center arrows nicely on larger viewports */
        @media (min-width: 768px) {
            .carousel-inner {
                padding: 0 3.5rem;
            }
        }

            /* Responsive Overrides */
    @media (max-width: 767.98px) {
      .card-content {
        padding: 2rem 1.5rem;
      }
      .border-end-custom-md {
        border-end: none !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
        padding-bottom: 2rem;
        margin-bottom: 2rem;
      }
      .position-sticky

 {
    position: -webkit-sticky!important;
    position: relative !important;
}


      
    }

    @media (min-width: 768px) {
      .border-end-custom-md {
        border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
      }
    }


    /* Section 6 Custom Grid & Timeline */
@media (min-width: 992px) {
  .col-lg-2-4 {
    flex: 0 0 20%;
    max-width: 20%;
  }
  .timeline-row {
    margin-top: 2.5rem;
  }
}

@media (max-width: 768px) {
    .logo {
        width: 60px;
    }
}

@media (max-width: 576px) {
    .logo {
        width: 50px;
    }
}

@media (max-width: 768px) {
    .bg-grediant {
        width: 100%;
        height: 250px;
    }
}