/* 1. Use a more-intuitive box-sizing model */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* 2. Remove default margin */
*:not(dialog) {
  margin: 0;
}

body {
  /* 4. Add accessible line-height */
  line-height: 1.5;
  /* 5. Improve text rendering */
  -webkit-font-smoothing: antialiased;
  font-family: sans-serif;
}

/* 6. Improve media defaults */
img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

/* 7. Inherit fonts for form controls */
input,
button,
textarea,
select {
  font: inherit;
}

/* 8. Avoid text overflows */
p,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}

/* 9. Improve line wrapping */
p {
  text-wrap: pretty;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  text-wrap: balance;
}

a {
  text-decoration: none;
}

/*
  10. Create a root stacking context
*/
#root,
#__next {
  isolation: isolate;
}

.ppsPageContainer span,
.ppsPageContainer p {
  margin: 0px;
  padding: 0px;
}

.ppsPageContainer {
  color: rgb(38, 53, 70);
}

.ppsHeroSection {
  display: flex;
  position: relative;
  width: 100%;
  max-width: 1240px;
  margin: 30px auto;
  padding: 20px;
  align-items: center;
}

@media (max-width: 1100px) {
  .ppsHeroSection {
    flex-direction: column;
  }

  .ppsHeroSectionLeft {
    margin-bottom: 40px;
    margin-top: 40px;
  }
}

.ppsHeroSectionLeft {
  width: 100%;
  max-width: 450px;
}

.ppsHeroSectionTitle {
  font-size: 46px;
  font-weight: 700;
  font-style: normal;
  color: rgb(38, 53, 70);
  line-height: 46px;
  letter-spacing: -0.046em;
}

.ppsHeroSectionSubtitle {
  font-size: 37px;
  font-weight: 700;
  line-height: 37px;
  letter-spacing: -0.046em;
  font-style: normal;
  color: rgb(13, 131, 141);
  margin-top: 10px;
}

.ppsHeroSectionTitle span {
  display: block;
}

.ppsHeroSectionLeft img {
  width: 100%;
  max-width: 250px;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ppsHeroSectionRight {
  display: block;
  position: relative;
}

.ppsHeroSectionRightBg {
  width: 100%;
  max-width: 750px;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  z-index: 1;
}

.ppsHeroSectionRightTablet {
  display: inline-block;
  position: absolute;
  z-index: 9;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-width: 480px;
  height: 270px;
}

.ppsHeroSectionRightTabletEmpty {
  display: block;
  position: absolute;
  width: 100%;
  z-index: 9;
  left: 0px;
  top: 0px;
}

.ppsHeroSectionRightTabletScreen01 {
  display: block;
  position: absolute;
  width: calc(100% - 20px);
  z-index: 1;
  left: 10px;
  top: 10px;
  max-height: 260px;
  border-radius: 10px;
}

.ppsHeroSectionRightTablet {
  transition: transform 0.25s ease;
}

.ppsHeroSectionRightTablet:hover {
  transform: translate(-50%, -50%) scale(1.1);
}

.tablet-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  z-index: 10;
  pointer-events: none;
}

.screens-wrapper {
  position: absolute;
  left: 15px;
  top: 10px;
  right: 15px;
  bottom: 10px;
  border-radius: 10px;
  overflow: hidden;
  background: white;
}

.screen {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 0;
  transition: opacity 0.9s ease-in-out;
}

.screen-1 {
  animation: slideshow 12s infinite;
}
.screen-2 {
  animation: slideshow 12s infinite 4s;
}
.screen-3 {
  animation: slideshow 12s infinite 8s;
}

@keyframes slideshow {
  0% {
    opacity: 0;
  }
  3% {
    opacity: 1;
  }
  30% {
    opacity: 1;
  }
  33% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@media (max-width: 500px) {
  .ppsHeroSectionRightTablet {
    max-width: 320px;
    height: 180px;
  }
  .screens-wrapper {
    right: 10px;
    left: 10px;
    bottom: 5px;
    top: 5px;
  }
}

.ppsHeroSectionCtaBtn {
  display: inline-block;
  position: relative;
  margin-top: 50px;
  border-radius: 40px;
  padding: 15px 50px;
  font-size: 19px;
  font-weight: 600;
  color: black;
  text-transform: uppercase;
  background: rgb(255, 190, 43);
}

.ppsHeroSectionCtaBtn:hover {
  background: rgb(255, 190, 43);
  color: black;
  text-decoration: none;
}

.ppsFvtSection {
  display: block;
  position: relative;
  background: rgb(235, 241, 248);
  padding: 60px 0px;
}

.ppsFvtSectionInner {
  display: block;
  position: relative;
  width: 100%;
  max-width: 1240px;
  padding: 20px;
  margin: 0px auto;
  background: rgb(235, 241, 248);
}

.ppsFvtSectionR1 {
  color: rgb(38, 53, 70);
  font-size: 24px;
  line-height: 24px;
  margin-bottom: 60px;
}

.ppsFvtSectionTitle {
  font-size: 38px;
  font-weight: bold;
  line-height: 38px;
  margin-bottom: 30px;
}

.ppsFvtSectionSubtitle {
  font-size: 22px;
  line-height: 22px;
  margin-bottom: 40px;
}

.ppsFvtSectionCols {
  display: flex;
  position: relative;
  flex-direction: row;
  justify-content: space-between;
}

@media (max-width: 800px) {
  .ppsFvtSectionCols {
    flex-direction: column;
    align-items: center;
  }
}

.ppsFvtSectionCol {
  display: flex;
  position: relative;
  width: 100%;
  padding: 20px;
  max-width: 330px;
  flex-direction: column;
  align-items: center;
}

.ppsFvtSectionColIcon {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ppsFvtSectionColTitle {
  text-align: center;
  font-size: 24px;
  line-height: 24px;
  padding: 10px 0px;
  font-weight: bold;
}

.ppsFvtSectionColSubtitle {
  text-align: center;
  font-size: 21px;
  line-height: 21px;
  padding: 10px 0px;
}

.ppsHiwSection {
  display: block;
  position: relative;
  background: white;
  padding: 60px 0px;
}

.ppsHiwSectionInner {
  display: block;
  position: relative;
  width: 100%;
  max-width: 1240px;
  padding: 20px;
  margin: 0px auto;
  background: white;
}

.ppsHiwSectionR1 {
  color: rgb(38, 53, 70);
  font-size: 24px;
  line-height: 24px;
  margin-bottom: 60px;
}

.ppsHiwSectionTitle {
  font-size: 38px;
  font-weight: bold;
  line-height: 38px;
  margin-bottom: 30px;
}

.ppsHiwSectionSubtitle {
  font-size: 22px;
  line-height: 22px;
  margin-bottom: 40px;
}

.ppsHiwSectionCols {
  display: flex;
  position: relative;
  flex-direction: row;
  justify-content: space-between;
}

.ppsHiwSectionColIcon {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

@media (max-width: 800px) {
  .ppsHiwSectionCols {
    flex-direction: column;
    align-items: center;
  }
}

.ppsHiwSectionCol {
  display: flex;
  position: relative;
  width: 100%;
  padding: 20px;
  max-width: 330px;
  flex-direction: column;
  align-items: center;
}

.ppsHiwSectionColTitle {
  text-align: center;
  font-size: 24px;
  line-height: 24px;
  padding: 10px 0px;
  font-weight: bold;
}

.ppsHiwSectionColSubtitle {
  text-align: center;
  font-size: 21px;
  line-height: 21px;
  padding: 10px 0px;
}

.ppsPfSection {
  display: block;
  position: relative;
  background: rgb(235, 241, 248);
  padding: 60px 0px;
}

.ppsPfSectionInner {
  display: block;
  position: relative;
  width: 100%;
  max-width: 1240px;
  padding: 20px;
  margin: 0px auto;
  background: rgb(235, 241, 248);
}

.ppsPfSectionR1 {
  color: rgb(38, 53, 70);
  font-size: 24px;
  line-height: 24px;
  margin-bottom: 60px;
}

.ppsPfSectionTitle {
  font-size: 38px;
  font-weight: bold;
  line-height: 38px;
  margin-bottom: 30px;
}

.ppsPfSectionSubtitle {
  font-size: 22px;
  line-height: 22px;
  margin-bottom: 40px;
}

.ppsPfSectionCols {
  display: flex;
  position: relative;
  flex-direction: row;
  justify-content: space-between;
}

@media (max-width: 800px) {
  .ppsPfSectionCols {
    flex-direction: column;
    align-items: center;
  }
}

.ppsPfSectionCol {
  display: flex;
  position: relative;
  width: 100%;
  padding: 20px;
  max-width: 450px;
  flex-direction: column;
  align-items: center;
}

.ppsPfSectionColIcon {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ppsPfSectionColTitle {
  text-align: center;
  font-size: 24px;
  line-height: 24px;
  padding: 10px 0px;
  font-weight: bold;
}

.ppsPfSectionColSubtitle {
  text-align: center;
  font-size: 21px;
  line-height: 21px;
  padding: 10px 0px;
}

.ppsPfSectionSubtitle2 {
  font-size: 24px;
  line-height: 24px;
  margin-bottom: 10px;
  font-weight: bold;
}

.ppsPfSectionSubtitle3 {
  font-size: 24px;
  line-height: 24px;
  margin: 20px 0px;
  font-weight: bold;
  text-align: center;
}

.ppsPfSectionCols2 {
  display: flex;
  position: relative;
  flex-direction: row;
  justify-content: center;
}

@media (max-width: 800px) {
  .ppsPfSectionCols2 {
    flex-direction: column;
    align-items: center;
  }
}

.ppsPfSectionCols2 .ppsPfSectionCol {
  display: flex;
  position: relative;
  width: 100%;
  padding: 20px;
  max-width: 450px;
  flex-direction: column;
  align-items: center;
}

.ppsPfSectionCols2 .ppsPfSectionColSubtitle {
  text-align: left;
}

.ppsDfdSection {
  display: block;
  position: relative;
  background: white;
  padding: 60px 0px;
}

.ppsDfdSectionInner {
  display: block;
  position: relative;
  width: 100%;
  max-width: 1240px;
  padding: 20px;
  margin: 0px auto;
  background: white;
}

.ppsDfdSectionR1 {
  color: rgb(38, 53, 70);
  font-size: 24px;
  line-height: 24px;
  margin-bottom: 60px;
}

.ppsDfdSectionTitle {
  font-size: 38px;
  font-weight: bold;
  line-height: 38px;
  margin-bottom: 30px;
}

.ppsDfdSectionSubtitle {
  font-size: 22px;
  line-height: 22px;
  margin-bottom: 40px;
}

.ppsDfdSectionCols {
  display: flex;
  position: relative;
  flex-direction: row;
  justify-content: center;
}

.ppsDfdSectionColIcon {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

@media (max-width: 800px) {
  .ppsDfdSectionCols {
    flex-direction: column;
    align-items: center;
  }
}

.ppsDfdSectionCol {
  display: flex;
  position: relative;
  width: 100%;
  padding: 20px;
  max-width: 400px;
  flex-direction: column;
  align-items: center;
}

.ppsDfdSectionColTitle {
  text-align: center;
  font-size: 24px;
  line-height: 24px;
  padding: 10px 0px;
  font-weight: bold;
}

.ppsDfdSectionColSubtitle {
  text-align: center;
  font-size: 21px;
  line-height: 21px;
  padding: 10px 0px;
}

.ppsDfdSectionSubtitle2 {
  font-size: 24px;
  line-height: 24px;
  font-weight: bold;
  text-align: center;
  margin: 10px;
}

.ppsCapSection {
  display: block;
  position: relative;
  background: rgb(235, 241, 248);
  padding: 60px 0px;
}

.ppsCapSectionInner {
  display: block;
  position: relative;
  width: 100%;
  max-width: 1240px;
  padding: 20px;
  margin: 0px auto;
  background: rgb(235, 241, 248);
}

.ppsCapSectionR1 {
  color: rgb(38, 53, 70);
  font-size: 24px;
  line-height: 24px;
  margin-bottom: 60px;
}

.ppsCapSectionTitle {
  font-size: 38px;
  font-weight: bold;
  line-height: 38px;
  margin-bottom: 30px;
}

.ppsCapSectionSubtitle {
  font-size: 22px;
  line-height: 22px;
}

.ppsCapSectionCols {
  display: flex;
  position: relative;
  flex-direction: row;
  justify-content: space-around;
}

@media (max-width: 800px) {
  .ppsCapSectionCols {
    flex-direction: column;
    align-items: center;
  }
}

.ppsCapSectionCol {
  display: flex;
  position: relative;
  width: 100%;
  padding: 20px;
  max-width: 500px;
  flex-direction: column;
  align-items: center;
}

.ppsCapSectionColIcon {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border-radius: 20px;
}

.ppsCapSectionColTitle {
  text-align: center;
  font-size: 24px;
  line-height: 24px;
  padding: 10px 0px;
  font-weight: bold;
}

.ppsCapSectionColSubtitle {
  text-align: center;
  font-size: 21px;
  line-height: 21px;
  padding: 10px 0px;
}

.ppsCasSection {
  display: block;
  position: relative;
  background: white;
  padding: 60px 0px;
}

.ppsCasSectionInner {
  display: block;
  position: relative;
  width: 100%;
  max-width: 1240px;
  padding: 20px;
  margin: 0px auto;
  background: white;
}

.ppsCasSectionTitle {
  font-size: 38px;
  font-weight: bold;
  line-height: 38px;
  margin-bottom: 30px;
}

.ppsCasSectionSubtitle {
  font-size: 22px;
  line-height: 22px;
  margin-bottom: 40px;
}

.ppsCasSectionSubtitleList {
  font-size: 21px;
  line-height: 27px;
  margin-bottom: 40px;
}

.ppsCasSectionSubtitleList ul {
  list-style: square;
  padding-left: 20px;
}

.ppsCasSectionSubtitleList ul li {
  list-style: square;
}

.ppsCasSectionExamples {
  display: block;
  position: relative;
  margin-bottom: 20px;
}

.ppsCasSectionExample {
  display: block;
  position: relative;
  margin-bottom: 20px;
}

.ppsCasSectionExampleTitle {
  display: block;
  position: relative;
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 10px;
}

.ppsListSection {
  display: block;
  position: relative;
  padding: 60px 0px;
}

.ppsListSectionInner {
  display: block;
  position: relative;
  width: 100%;
  max-width: 1240px;
  padding: 20px;
  margin: 0px auto;
}

.ppsListSectionTitle {
  font-size: 38px;
  font-weight: bold;
  line-height: 38px;
  margin-bottom: 30px;
}

.ppsListSectionSubtitle {
  font-size: 21px;
  line-height: 21px;
  margin-bottom: 40px;
}

.ppsListSectionSubtitle2 {
  text-align: center;
  font-size: 21px;
  line-height: 21px;
  padding: 10px 0px;
  font-weight: bold;
}

.ppsListSectionCtaBtn {
  display: inline-block;
  position: relative;
  margin: 30px auto;
  border-radius: 40px;
  padding: 15px 50px;
  font-size: 19px;
  font-weight: 600;
  color: black;
  text-transform: uppercase;
  background: rgb(255, 190, 43);
}

.ppsListSectionCtaBtn:hover {
  background: rgb(255, 190, 43);
  color: black;
  text-decoration: none;
}

.ppsGarSection {
  display: block;
  position: relative;
  background: white;
  padding: 60px 0px;
}

.ppsGarSectionInner {
  display: block;
  position: relative;
  width: 100%;
  max-width: 1240px;
  padding: 20px;
  margin: 0px auto;
  background: white;
}

.ppsGarSectionTitle {
  display: inline-block;
  position: relative;
  font-size: 38px;
  font-weight: bold;
  line-height: 38px;
  margin-bottom: 60px;
}

.ppsGarSectionTitleDivider {
  display: block;
  position: absolute;
  width: 80%;
}

.ppsGarSectionSubtitle {
  font-size: 22px;
  line-height: 22px;
  font-weight: bold;
  margin-bottom: 20px;
}

.ppsGarSectionSubtitle2 {
  font-size: 22px;
  line-height: 22px;
  margin-bottom: 40px;
}

.ppsGarInnerSection {
  display: flex;
  position: relative;
  width: 100%;
  align-items: center;
}

.ppsGarInnerSectionLeft {
  width: 100%;
  max-width: 430px;
  flex-shrink: 0;
  padding-right: 20px;
}

.ppsGarInnerSectionRight {
  background: #ebf1f8;
  border-radius: 30px;
  padding: 20px;
}

.ppsGarInnerSectionRight p {
  margin-bottom: 20px;
  font-size: 23px;
  line-height: 28px;
}

@media (max-width: 1000px) {
  .ppsGarInnerSection {
    flex-direction: column;
  }

  .ppsGarInnerSectionLeft {
    max-width: 300px;
    padding-right: 0px;
  }
}

.ppsFeatSection {
  display: block;
  position: relative;
  background: rgb(235, 241, 248);
  padding: 60px 0px;
}

.ppsFeatSectionInner {
  display: block;
  position: relative;
  width: 100%;
  max-width: 1240px;
  padding: 20px;
  margin: 0px auto;
  background: rgb(235, 241, 248);
}

.ppsFeatSectionR1 {
  color: rgb(38, 53, 70);
  font-size: 24px;
  line-height: 24px;
  margin-bottom: 60px;
}

.ppsFeatSectionTitle {
  font-size: 38px;
  font-weight: bold;
  line-height: 38px;
  margin-bottom: 30px;
}

.ppsFeatSectionSubtitle {
  font-size: 22px;
  line-height: 22px;
  margin-bottom: 40px;
}

.ppsFeatSectionCols {
  display: flex;
  position: relative;
  flex-direction: row;
  justify-content: space-between;
}

@media (max-width: 800px) {
  .ppsFeatSectionCols {
    flex-direction: column;
    align-items: center;
  }
}

.ppsFeatSectionCol {
  display: flex;
  position: relative;
  width: 100%;
  padding: 20px;
  max-width: 330px;
  flex-direction: column;
  align-items: center;
}

.ppsFeatSectionColIcon {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /* max-width: 100px;
  width: 100%; */
  max-height: 120px;
}

.ppsFeatSectionColTitle {
  text-align: center;
  font-size: 24px;
  line-height: 24px;
  padding: 10px 0px;
  font-weight: bold;
}

.ppsFeatSectionColSubtitle {
  text-align: center;
  font-size: 21px;
  line-height: 21px;
  padding: 10px 0px;
}

.ppsFeatSectionTitle2 {
  text-align: center;
  font-size: 24px;
  line-height: 24px;
  padding: 10px 0px;
  margin-top: 20px;
  font-weight: bold;
}

.ppsFeatSectionSubtitle2 {
  text-align: center;
  font-size: 21px;
  line-height: 21px;
  padding: 10px 0px;
}

.ppsFeatSectionSubtitle3 {
  text-align: center;
  font-size: 21px;
  line-height: 21px;
  padding: 10px 0px;
}

.ppsFeat2Section {
  display: block;
  position: relative;
  background: rgb(235, 241, 248);
  padding: 60px 0px;
}

.ppsFeat2SectionInner {
  display: block;
  position: relative;
  width: 100%;
  max-width: 1240px;
  padding: 20px;
  margin: 0px auto;
  background: rgb(235, 241, 248);
}

.ppsFeat2SectionR1 {
  color: rgb(38, 53, 70);
  font-size: 24px;
  line-height: 24px;
  margin-bottom: 60px;
}

.ppsFeat2SectionTitle {
  font-size: 38px;
  font-weight: bold;
  line-height: 38px;
  margin-bottom: 30px;
}

.ppsFeat2SectionSubtitle {
  font-size: 22px;
  line-height: 22px;
  margin-bottom: 40px;
}

.ppsFeat2SectionCols {
  display: flex;
  position: relative;
  flex-direction: row;
  justify-content: space-between;
}

@media (max-width: 800px) {
  .ppsFeat2SectionCols {
    flex-direction: column;
    align-items: center;
  }
}

.ppsFeat2SectionCol {
  display: flex;
  position: relative;
  width: 100%;
  padding: 20px;
  max-width: 330px;
  flex-direction: column;
  align-items: center;
}

.ppsFeat2SectionColIcon {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  max-width: 140px;
  width: 100%;
}

.ppsFeat2SectionColTitle {
  text-align: center;
  font-size: 24px;
  line-height: 24px;
  padding: 10px 0px;
  font-weight: bold;
}

.ppsFeat2SectionColSubtitle {
  text-align: center;
  font-size: 21px;
  line-height: 21px;
  padding: 10px 0px;
}

.ppsFeat2SectionTitle2 {
  text-align: center;
  font-size: 24px;
  line-height: 24px;
  padding: 10px 0px;
  margin-top: 20px;
  font-weight: bold;
}

.ppsFeat2SectionSubtitle2 {
  text-align: center;
  font-size: 21px;
  line-height: 21px;
  padding: 10px 0px;
}

.ppsFeat2SectionSubtitle3 {
  text-align: center;
  font-size: 21px;
  line-height: 21px;
  padding: 10px 0px;
}

.ppsPrsSection {
  display: block;
  position: relative;
  background: white;
  padding: 60px 0px;
}

.ppsPrsSectionInner {
  display: block;
  position: relative;
  width: 100%;
  max-width: 1240px;
  padding: 20px;
  margin: 0px auto;
  background: white;
}

.ppsPrsSectionTitle {
  font-size: 38px;
  font-weight: bold;
  line-height: 38px;
  margin-bottom: 30px;
}

.ppsPrsSectionSubtitle {
  font-size: 22px;
  line-height: 22px;
  margin-bottom: 40px;
}

.ppsPrsSectionSubtitle2 {
  font-size: 22px;
  line-height: 22px;
  margin-bottom: 40px;
  margin-top: 30px;
  font-weight: bold;
  text-align: center;
}

.ppsSupSection {
  display: block;
  position: relative;
  background: rgb(235, 241, 248);
  padding: 60px 0px;
}

.ppsSupSectionInner {
  display: block;
  position: relative;
  width: 100%;
  max-width: 1240px;
  padding: 20px;
  margin: 0px auto;
  background: rgb(235, 241, 248);
}

.ppsSupSectionTitle {
  font-size: 43px;
  font-weight: bold;
  line-height: 51px;
  margin-bottom: 30px;
}

.ppsSupSectionSubtitle {
  font-size: 22px;
  line-height: 22px;
  margin-bottom: 40px;
}

.ppsSupSectionInnerContainer {
  display: flex;
  position: relative;
  width: 100%;
  align-items: center;
}

.ppsSupSectionInnerLeft {
  padding-right: 40px;
}

@media (max-width: 1200px) {
  .ppsSupSectionInnerContainer {
    flex-direction: column;
  }

  .ppsSupSectionInnerLeft {
    padding-right: 0px;
  }
}

.ppsSupSectionInnerRight {
  max-width: 500px;
  width: 100%;
  flex-shrink: 0;
}

.ppsSupSectionSubtitle p {
  margin-bottom: 20px;
}

.ppsSupSectionInnerRight img {
  border-radius: 20px;
}

.ppsSupSectionTitle2 {
  font-size: 26px;
  font-weight: bold;
  line-height: 26px;
  margin-bottom: 20px;
}

.ppsSupSectionSubtitle2 {
  font-size: 22px;
  line-height: 22px;
  margin-bottom: 40px;
}

.supPricing {
  max-width: 100% !important;
}

.ppsCasSectionMain {
  display: block;
  position: relative;
}

.ppsCasSectionMainLeft {
  display: inline-block;
  position: relative;
  max-width: calc(100% - 400px);
  width: 100%;
  float: left;
}

.ppsCasSectionMainRight {
  display: inline-block;
  position: relative;
  max-width: 400px;
  padding-left: 30px;
  width: 100%;
}

.ppsCasSectionMainRight h3 {
  font-size: 21px;
  font-weight: bold;
  margin-bottom: 20px;
  margin-top: 30px;
  text-align: center;
}

.ppsCasSectionMain:after {
  display: block;
  position: relative;
  content: " ";
  clear: both;
}

@media (max-width: 1000px) {
  .ppsCasSectionMainLeft {
    float: none;
    max-width: 1000px;
  }

  .ppsCasSectionMainRight {
    max-width: 1000px;
  }
}

.pps-hero-popup-overlay {
  position: fixed;
  inset: 0;
  background: rgb(99 99 99 / 85%);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  z-index: 999999;
  display: none;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.pps-hero-popup-overlay.active {
  display: flex;
  opacity: 1;
}

.pps-hero-popup-content {
  position: relative;
  width: 90%;
  max-width: 1200px;
  aspect-ratio: 16 / 9;
  background: #000;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6);
}

.pps-hero-popup-video-wrapper {
  width: 100%;
  height: 100%;
}

.pps-hero-popup-close {
  position: fixed;
  top: 0px;
  right: 0px;
  width: 44px;
  height: 44px;
  background: #000;
  color: #fff;
  border: none;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
}

.pps-hero-popup-close:hover {
  background: #222;
  transform: scale(1.1);
}

@media (max-width: 768px) {
  .pps-hero-popup-content {
    width: 96%;
    border-radius: 12px;
  }

  .pps-hero-popup-close {
    width: 38px;
    height: 38px;
    font-size: 24px;
    display: none;
  }
}
