.milestone .milestone-container {
          position: relative;
          width: 1100px;
          height: 1000px;
          background: #ffffff;
          margin: 0px auto 4rem;
          border-radius: 20px;
          padding: 40px 20px;
        }

        .milestone {
            padding: 6rem 2rem;
            background: linear-gradient(135deg, var(--warm-cream) 0%, var(--soft-peach) 100%);
        }

        .milestone .our-story.milestone-story {
            background: unset;
            padding: 0px 0px;
        }

        .milestone .our-story.milestone-story .story-stats {
            box-shadow: unset;
        }

        .milestone .milestone-container .timeline-svg {
          position: absolute;
          top: -20px;
          left: 0;
          width: 100%;
          height: 100%;
          z-index: 1;
        }

        .milestone .sub-title {
            font-size: 1.25rem;
            color: #6c757d;
            font-weight: 400;
            max-width: 700px;
            margin: 0rem auto 0;
            line-height: 1.6;
        }

        .milestone .milestone-container .node {
          position: absolute;
          z-index: 2;
          width: 280px;
          top: 50px;
        }

        .milestone .milestone-container .node.first {
          left: 160px;
        }

        .milestone .milestone-container .node.second {
          left: 560px;
        }

        .milestone .milestone-container .node.thired {
          left: 690px;
        }

        .milestone .milestone-container .node.fourth {
          left: 310px;
        }

        .milestone .milestone-container .node.fifth {
          left: 160px;
        }

        .milestone .milestone-container .node.sixth {
          left: 510px;
        }

        .milestone .milestone-container .node.seventh {
          left: 710px;
        }

        .milestone .milestone-container .node.eight {
          left: 170px;
        }

        .milestone .milestone-container .icon {
          width: 50px;
          height: 50px;
          display: block;
          margin-left: 40px;
          font-size: 20px;
          background: var(--brand-yellow);
          border-radius: 50%;
          display: flex;
          align-items: center;
          justify-content: center;
          color: #ffffff;
        }

        .milestone .milestone-container .top-wrapper {
          display: flex;
          gap: 10px;
          align-items: center;
          /* margin-bottom: 10px; */
        }

        .milestone .milestone-container .year-row {
          display: flex;
          align-items: center;
          font-size: 28px;
          font-weight: 900;
          color: #34495e;
          gap: 15px;
          margin-bottom: 0px;
          position: relative;
          left: 50px;
          background: #ffffff;
          bottom: -11px;
          width: 40px;
          height: 30px;
          justify-content: center;
        }

        .milestone .milestone-container .year-text {
          border-radius: 4px;
          color: var(--text-dark);
          font-size: 22px;
          font-weight: 700;
          line-height: 1;
        }

        .milestone .milestone-container h3 {
          line-height: 1;
          margin: 25px 0px 5px;
          font-size: 16px;
        }

        .milestone .milestone-container .dot.p-teal {
          width: 20px;
          height: 20px;
          border-radius: 50%;
          flex-shrink: 0;
          border: 4px solid var(--brand-green);
        }

        .milestone .milestone-container .year-row {
          width: 25px;
          height: 25px;
        }

        .milestone .milestone-container .dot.p-green {
          width: 26px;
          height: 26px;
          border-radius: 50%;
          flex-shrink: 0;
          border: 5px solid var(--brand-green);
          background: white;
        }

        .milestone .milestone-container .content h4 {
          margin: 5px 0;
          font-size: 18px;
          font-weight: 700;
        }

        .milestone .milestone-container .content p {
          margin: 0;
          font-size: 14px;
          color: #95a5a6;
          line-height: 1.3;
        }

        /* Color Palette */
        .milestone .milestone-container .p-teal {
          background-color: var(--brand-green);
        }

        .milestone .milestone-container .p-green {
          background-color: var(--brand-green);
        }

        .milestone .milestone-container .main-header {
          position: absolute;
          bottom: 50px;
          right: 50px;
          width: 400px;
          text-align: left;
        }

        .milestone .milestone-container .main-header h1 {
          font-size: 42px;
          color: #2c3e50;
          margin: 0 0 10px 0;
        }

        .milestone .milestone-container .node.second-row {
          top: 290px !important;
        }

        .milestone .milestone-container .node.thierd-row {
          top: 531px !important;
        }

        .milestone .milestone-container .node.fourth-row {
          top: 775px !important;
        }

        .milestone .milestone-container .node.last-text {
          left: 260px !important;
        }

        .milestone .milestone-container .node.last-text h2 {
          font-size: 35px;
          line-height: 1.3;
          margin-bottom: 0px;
        }

        .milestone .mobile-view {
          display: none;
        }

        @media (max-width: 1200px) {
          .milestone-container {
            width: 100%;
          }
        }

        @media (max-width: 1100px) {
          .milestone .milestone-container {
            width: 100%;
          }
        }

        @media (max-width: 1024px) {
          .milestone .milestone-container .node {
            top: 65px;
          }

          .milestone .milestone-container .node.second-row {
            top: 294px !important;
          }

          .milestone .milestone-container .node.thierd-row {
            top: 526px !important;
          }

          .milestone .milestone-container .node.fourth-row {
            top: 760px !important;
          }

          .milestone .milestone-container .node.last-text {
            left: 180px !important;
          }

          .milestone .milestone-container .node.fourth {
            left: 160px;
          }

          .milestone .milestone-container .node.thired,
          .milestone .milestone-container .node.sixth,
          .milestone .milestone-container .node.seventh {
            left: 560px;
          }
        }

        @media (max-width: 820px) {
          .milestone .milestone-container .node.first {
            left: 0px;
            position: unset;
          }

          .milestone .milestone-container .node.second {
            left: 0px;
            position: unset;
          }

          .milestone .milestone-container .node.thired {
            left: 0px;
            position: unset;
          }

          .milestone .milestone-container .node.fourth {
            left: 0px;
            position: unset;
          }

          .milestone .milestone-container .node.fifth {
            left: 0px;
            position: unset;
          }

          .milestone .milestone-container .node.sixth {
            left: 0px;
            position: unset;
          }

          .milestone .milestone-container .node.seventh {
            left: 0px;
            position: unset;
          }

          .milestone .milestone-container .node.fourth-row {
            top: 760px !important;
            position: unset;
          }

          .milestone .mobile-view {
            display: block;
            position: relative;
            padding-left: 30px;
          }

          .milestone .desktop-view {
            display: none;
          }

          .milestone .milestone-container .node {
            margin-bottom: 30px;
            width: 100%;
          }

          .milestone .milestone-container .icon {
            margin-left: 0px;
          }

          .milestone .mobile-view:before {
            position: absolute;
            content: '';
            top: 0;
            left: 0;
            width: 8px;
            height: 100%;
            background-color: #e5e9ed;
            border-radius: 20px;
          }

          .milestone .milestone-container .dot.p-teal {
            width: 15px;
            height: 15px;
          }

          .milestone .milestone-container .year-row {
            left: -39px;
            height: 0px;
          }

          .milestone .milestone-container {
            height: 100%;
            margin: 0px auto 2rem;
          }

          .milestone .milestone-container .node.last-text {
            left: 0 !important;
            top: unset !important;
            position: relative;
          }

          .milestone .milestone-container .node.last-text h2 {
            font-size: 24px;
          }
        }

        @media (max-width: 768px) {
            .milestone {
                padding: 4rem 2rem;
            }
        }

        @media (max-width: 640px) {
          .milestone .milestone-container .icon {
            width: 40px;
            height: 40px;
            font-size: 15px;
          }

          .milestone {
            padding: 3rem 1.5rem;
            }
        }