section,
section * {
  font-family: Sora;
}

section h2 {
  font-size: 48px;
  font-style: normal;
  font-weight: 600;
  line-height: 64px;
}

.section-fsm,
.section-tailored,
.section-process {
  padding: 100px 0;
}

.section-fsm h1 {
  font-size: 52px;
  font-style: normal;
  font-weight: 400;
}

.section-fsm p {
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 170%;
  margin: 30px 0px;
}

.section-fsm .row>div:last-child {
  padding-left: 50px;
}

.section-fsm img {
  width: 100%;
}

.section-tailored {
  background: #F5F5F5;
}

.section-tailored .heading-group {
  max-width: 700px;
  margin: 0 auto;
}

.section-tailored .heading-group p {
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 170%;
  margin-bottom: 50px;
}

.section-tailored .three-grid .tg-item {
  background: #fff;
  border-radius: 24px;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.section-tailored .three-grid .tg-item img {
  border-top-left-radius: 24px;
  border-top-right-radius: 24px;
}

.section-tailored .three-grid .tg-item h3 {
  color: #171717;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  margin-bottom: 10px;
}

.section-tailored .three-grid .tg-item div {
  padding: 24px;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}

.section-tailored .three-grid .tg-item a {
  border-radius: 12px;
  background: #171717;
  color: #fff!important;
  padding: 16px 24px;
  display: block;
  text-decoration: unset;
  margin-top: auto;
  text-align: center;
}
.section-tailored .three-grid .tg-item a:hover {
  background: #FBD033;
  color: #000;
}

.section-tailored .three-grid .tg-item ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 24px;
}

.section-tailored .three-grid .tg-item ul li {
  position: relative;
  padding-left: 32px;
  margin-bottom: 8px;
}

.section-tailored .three-grid .tg-item ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cg clip-path='url(%23clip0_2143_994)'%3E%3Cpath d='M12 2.25C10.0716 2.25 8.18657 2.82183 6.58319 3.89317C4.97982 4.96451 3.73013 6.48726 2.99218 8.26884C2.25422 10.0504 2.06114 12.0108 2.43735 13.9021C2.81355 15.7934 3.74215 17.5307 5.10571 18.8943C6.46928 20.2579 8.20656 21.1865 10.0979 21.5627C11.9892 21.9389 13.9496 21.7458 15.7312 21.0078C17.5127 20.2699 19.0355 19.0202 20.1068 17.4168C21.1782 15.8134 21.75 13.9284 21.75 12C21.7473 9.41498 20.7192 6.93661 18.8913 5.10872C17.0634 3.28084 14.585 2.25273 12 2.25ZM16.2806 10.2806L11.0306 15.5306C10.961 15.6004 10.8783 15.6557 10.7872 15.6934C10.6962 15.7312 10.5986 15.7506 10.5 15.7506C10.4014 15.7506 10.3038 15.7312 10.2128 15.6934C10.1218 15.6557 10.039 15.6004 9.96938 15.5306L7.71938 13.2806C7.57865 13.1399 7.49959 12.949 7.49959 12.75C7.49959 12.551 7.57865 12.3601 7.71938 12.2194C7.86011 12.0786 8.05098 11.9996 8.25 11.9996C8.44903 11.9996 8.6399 12.0786 8.78063 12.2194L10.5 13.9397L15.2194 9.21937C15.2891 9.14969 15.3718 9.09442 15.4628 9.0567C15.5539 9.01899 15.6515 8.99958 15.75 8.99958C15.8486 8.99958 15.9461 9.01899 16.0372 9.0567C16.1282 9.09442 16.2109 9.14969 16.2806 9.21937C16.3503 9.28906 16.4056 9.37178 16.4433 9.46283C16.481 9.55387 16.5004 9.65145 16.5004 9.75C16.5004 9.84855 16.481 9.94613 16.4433 10.0372C16.4056 10.1282 16.3503 10.2109 16.2806 10.2806Z' fill='%23171717'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_2143_994'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}

.section-process {
  background: #fff;
  padding: 100px 0;
}

.process-container {
  max-width: 700px;
  margin: 50px auto 0;
}

.section-implementation .process-container {
  max-width: 1020px;
}

.process-list {
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
}

.process-list::before {
  content: '';
  position: absolute;
  left: 20px;
  top: 0;
  bottom: 0;
  width: 2px;
  background: #e0e0e0;
  z-index: 0;
  height: 88%;
  top: 50%;
  transform: translateY(-50%);
}

.process-step {
  display: flex;
  align-items: flex-start;
  margin-bottom: 32px;
  position: relative;
  align-items: center;
}

.process-step-number {
  z-index: 1;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  background: #171717;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: bold;
  position: relative;
  margin-right: 24px;
  margin-left: 0;
}

.process-step-content {
  display: flex;
  align-items: center;
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 16px;
  flex: 1;
}

.process-step-content div {
  padding: 16px;
}

.process-step-content img {
  width: auto;
  height: 132px;
  object-fit: cover;
  border-top-left-radius: 16px;
  border-bottom-left-radius: 16px;
}

.process-step-content strong {
  display: block;
  font-size: 1.2rem;
  margin-bottom: 4px;
}

.section-implementation .process-step-content strong {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
.section-implementation .process-step-content strong span {
  color: #4D4D4D;
  font-size: 14px;
  font-weight: 700;
  border-radius: 999px;
  background: var(--Black-100, #E6E6E6);
  padding: 4px 12px;
  margin-left: 10px;
}

.process-step-content p {
  margin: 0;
  color: #444;
}

.section-cta {
  background: #E6E6E6;
  padding: 56px 48px;
  border-radius: 24px;
  position: relative;
  margin-bottom: 100px;
}
.section-cta h3 {
  font-size: 36px;
  font-style: normal;
  font-weight: 600;
  line-height: 56px;
  color: #171717;
}
.section-cta p {
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 170%;
  color: #000;
}
.section-cta a {
  padding: 16px 24px;
  border-radius: 12px;
  background: #171717;
  color: #fff!important;
  display: inline-block;
  font-weight: 700;
  text-decoration: none;
  font-family: "Sora",sans-serif;
}
.csbtnwhite a {
  color: #fff!important;
}
.csbtnwhite a:hover {
  color: #000!important;
}
.section-cta a:hover {
  background: #FBD033;
  color: #000!important;
  text-decoration: none!important;
}
.section-cta svg {
  position: absolute;
  right: 30px;
  bottom: 30px;
  width: 65px;
  height: 65px;
}

.section-bottomnote {
  background: #F5F5F5;
  padding: 16px;
}
.section-bottomnote .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.section-bottomnote .sb-inner {
  display: flex;
  align-items: center;
}
.section-bottomnote h4 {
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  margin: 0;
  margin-left: 16px;
}
.section-bottomnote a {
  padding: 16px 24px;
  border-radius: 12px;
  background: #171717;
  color: #fff!important;
  text-decoration: unset;
}
.section-bottomnote a:hover {
  background: #FBD033;
  color: #000;
}
.section-bottomnote a:hover svg path {
  fill: #000;
}

.show-mobile { display: none!important; }
.show-desktop { display: flex!important; }

/* -------- WMS Mobile Customization -------- */
.section-code {
  background: #F5F5F5;
  padding: 100px 0;
}
.section-code h2 {
  margin-bottom: 40px;
}
.section-code h3 {
  color: #171717;
  font-size: 24px;
  font-weight: 700;
  line-height: 150%;
}
.section-code .sc-grid > div {
  margin: 8px 0px;
  padding: 0px 8px;
}
.section-code .sc-grid .sc-item {
  border-radius: 16px;
  border: 1px solid var(--Black-200, #CCC);
  background: var(--WHITE, #FFF);
  padding: 40px 32px;
  height: 100%;
}
.section-code .sc-grid .sc-item > div {
  display: flex;
  margin-bottom: 24px;
}
.section-code .sc-grid .sc-item > div svg {
  width: 48px;
  height: 48px;
  margin-right: 16px;
}
.section-code .sc-grid .sc-item ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0px;
}

.section-code .sc-grid .sc-item ul li {
  position: relative;
  padding-left: 32px;
}
.section-code .sc-grid .sc-item ul li:not(:last-child) {
  margin-bottom: 24px;
}
.section-code .sc-grid .sc-item ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cg clip-path='url(%23clip0_2143_994)'%3E%3Cpath d='M12 2.25C10.0716 2.25 8.18657 2.82183 6.58319 3.89317C4.97982 4.96451 3.73013 6.48726 2.99218 8.26884C2.25422 10.0504 2.06114 12.0108 2.43735 13.9021C2.81355 15.7934 3.74215 17.5307 5.10571 18.8943C6.46928 20.2579 8.20656 21.1865 10.0979 21.5627C11.9892 21.9389 13.9496 21.7458 15.7312 21.0078C17.5127 20.2699 19.0355 19.0202 20.1068 17.4168C21.1782 15.8134 21.75 13.9284 21.75 12C21.7473 9.41498 20.7192 6.93661 18.8913 5.10872C17.0634 3.28084 14.585 2.25273 12 2.25ZM16.2806 10.2806L11.0306 15.5306C10.961 15.6004 10.8783 15.6557 10.7872 15.6934C10.6962 15.7312 10.5986 15.7506 10.5 15.7506C10.4014 15.7506 10.3038 15.7312 10.2128 15.6934C10.1218 15.6557 10.039 15.6004 9.96938 15.5306L7.71938 13.2806C7.57865 13.1399 7.49959 12.949 7.49959 12.75C7.49959 12.551 7.57865 12.3601 7.71938 12.2194C7.86011 12.0786 8.05098 11.9996 8.25 11.9996C8.44903 11.9996 8.6399 12.0786 8.78063 12.2194L10.5 13.9397L15.2194 9.21937C15.2891 9.14969 15.3718 9.09442 15.4628 9.0567C15.5539 9.01899 15.6515 8.99958 15.75 8.99958C15.8486 8.99958 15.9461 9.01899 16.0372 9.0567C16.1282 9.09442 16.2109 9.14969 16.2806 9.21937C16.3503 9.28906 16.4056 9.37178 16.4433 9.46283C16.481 9.55387 16.5004 9.65145 16.5004 9.75C16.5004 9.84855 16.481 9.94613 16.4433 10.0372C16.4056 10.1282 16.3503 10.2109 16.2806 10.2806Z' fill='%23171717'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_2143_994'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}
.section-code a {
  padding: 16px 24px;
  border-radius: 12px;
  background: #171717;
  color: #fff;
  display: block;
  width: 150px;
  text-align: center;
  margin: 40px auto 0;
  font-weight: 700;
  text-decoration: none;
  font-family: "Sora",sans-serif;
}
.section-code a:hover {
  background: #FBD033;
  color: #000;
  text-decoration: none!important;
}
.section-how {
  margin-bottom: 100px;
}
.section-how h3 {
  color: #171717;
  font-size: 36px;
  font-style: normal;
  font-weight: 600;
  line-height: 56px;
}
.section-how p {
  color: #000;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 170%; 
  max-width: 760px;
  margin: 0 auto;
}
.section-ready {
  background: #FDE89B;
  padding: 56px 48px!important;
}
.section-ready a {
  margin-top: 15px;
}

@media (max-width: 1122px) {
  /* .headermain-tp nav.nav-item ul.desktop-nv {
    display: block;
  } */
}
@media (min-width: 801px) {
  .tg-item {
    display: flex;
    flex-direction: column;
    height: 100%;
  }
  .tg-item > div {
    margin-top: auto;
  }
}
@media (max-width: 800px) {
  .show-mobile { display: flex!important; }
  .show-desktop { display: none!important; }

  .section-fsm,
  .section-tailored,
  .section-process {
    padding: 50px 0;
  }

  .section-fsm {
    text-align: center;
  }
  .section-fsm h1 {
    font-size: 40px;
    margin: 0 auto 30px;
    max-width: 90%;
  }
  .section-fsm p {
    font-size: 20px;
    margin-bottom: 0px;
  }
  .section-fsm .row>div:last-child {
    padding: 12px;
    margin-top: 30px;
  }

  section h2 {
    font-size: 32px;
    line-height: 42px;
  }
  .section-tailored .heading-group p {
    font-size: 18px;
    line-height: 150%;
  }

  .section-tailored .three-grid .tg-item {
    margin: 0 16px;
    height: 80%;
  }
  .section-code .sc-grid .sc-item {
    margin: 0 16px;
    height: auto;
  }

  .process-container,
  .section-implementation .process-container {
    max-width: 100%;
    padding: 0 10px;
  }


  .process-step-content {
    flex-direction: column;
    align-items: flex-start;
  }

  .process-step-content img {
    margin-bottom: 12px;
    margin-right: 0;
    width: 100%;
    height: auto;
    border-top-right-radius: 16px;
    border-bottom-left-radius: 0;
  }

  .process-step {
    align-items: flex-start;
  }
  .process-list::before {
    top: 0;
    transform: unset;
    height: 85%;
  }

  .slick-list,
  .slick-track {
    height: auto !important;
    min-height: 0 !important;
  }
  .slick-slide {
    height: auto !important;
    display: block !important;
  }

  .section-cta {
    margin: 0 16px;
    padding-left: 30px!important;
    padding-right: 30px!important;
    width: calc(100% - 32px)!important;
  }
  .section-cta h3 {
    font-size: 28px;
    line-height: 34px;
    z-index: 1;
    position: relative;
    margin-bottom: 20px;
  }
  .section-cta svg {
    top: 30px;
    bottom: unset;
  }
  
  .section-bottomnote {
    margin-top: 50px;
    border-top: 1px solid #CCC;
  }
  .section-bottomnote h4 {
    margin-top: 20px;
  }
  .section-bottomnote .container,
  .section-bottomnote .sb-inner {
    display: block;
    text-align: center;
  }
  .section-bottomnote a {
    display: block;
    margin-top: 20px;
  }

  .section-code a {
    width: 100%;
    margin-top: 40px;
  }
  .section-code .sc-grid {
    margin-bottom: 70px!important;
  }
  .section-implementation .process-step-content img {
    margin-bottom: 0px;
  }
  .section-implementation .process-step-content strong {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
  }
  .section-implementation .process-step-content strong span {
    margin-left: 0px;
    margin-bottom: 5px;
  }
  .section-how h3 {
    font-size: 32px;
    line-height: 42px;
  }
  .section-ready {
    margin-bottom: 50px;
    text-align: center;
  }
}