/* style guide start */
body {
  margin: 0;
  overflow: visible !important;
}

:root {
  --primary: #008aff;
  --secondary: #fb6400;
  --black: #000000;
  --gray: #747474;
  --heading: #1e1e1e;
  --white: #fff;
}

body::after {
  content: "";
  background: url(/content/dam/carat/us/en/assets/control-center/control-center-header-us.png) no-repeat center left,
    url(/content/dam/carat/us/en/assets/control-center/control-center-header-emea.png) no-repeat center left,
    url(/content/dam/carat/us/en/assets/control-center/control-center-ph1.png) no-repeat center left,
    url(/content/dam/carat/us/en/assets/control-center/control-center-ph2.png) no-repeat center left,
    url(/content/dam/carat/us/en/assets/control-center/control-center-ph3.png) no-repeat center left,
    url(/content/dam/carat/us/en/assets/control-center/control-center-ph4.png) no-repeat center left,
    url(/content/dam/carat/us/en/assets/control-center/control-center-ph5.png) no-repeat center left;
}

body {
  margin: 0;
  overflow-x: hidden;
}

.page-wrapper h1 {
  font-weight: 300;
  font-size: 52px;
  line-height: 62.4px;
  color: var(--heading);
}

.page-wrapper h2 {
  font-weight: 300;
  font-size: 48px;
  line-height: 57.6px;
  color: var(--heading);
  margin: 0;
}

.page-wrapper h3 {
  font-weight: 300;
  font-size: 40px;
  line-height: 48px;
  color: var(--heading);
  margin: 0;
}

.page-wrapper h4 {
  font-weight: 300;
  font-size: 24px;
  line-height: 28.8px;
  color: var(--heading);
  margin: 0;
}

.page-wrapper .bodycopy1 {
  font-weight: 300;
  font-size: 18px;
  line-height: 21.6px;
  color: var(--heading);
  margin: 0;
}

.page-wrapper .bodycopy2 {
  font-weight: 300;
  font-size: 16px;
  line-height: 19.2px;
  color: var(--heading);
  margin: 0;
}

.page-wrapper .link1 {
  font-weight: 400;
  font-size: 18px;
  line-height: 24px;
  color: var(--heading);
}

.page-wrapper .link2 {
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: var(--heading);
}

.page-wrapper .orange-text {
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: var(--secondary);
  text-transform: uppercase;
  margin: 0;
}

.page-wrapper .section-label {
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  color: var(--black);
}

.page-wrapper .p-0 {
  padding: 0 !important;
}

.page-wrapper .quote {
  font-weight: 300;
  font-size: 36px;
  line-height: 43.2px;
  color: var(--black);
  font-style: italic;
}

.page-wrapper .quote-source {
  font-weight: 400;
  font-size: 16px;
  line-height: 19.2px;
  color: var(--black);
}

.page-wrapper .border-button {
  padding: 12px 16px;
  border: 1px solid var(--primary);
  font-size: 15px;
  line-height: 16px;
  font-weight: 400;
  background-color: var(--white);
}

.page-wrapper a.border-button.bg-blue {
  text-decoration: none;
  color: #008aff;
  display: inline-block;
  transition: all ease 0.5s;

  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
}

.page-wrapper a.border-button.bg-blue:hover {
  color: var(--white);
  background-color: #008aff;
  transition: all ease 0.5s;
}

.page-wrapper .border-button-bold {
  padding: 12px 16px;
  border: 2px solid var(--primary);
  font-size: 15px;
  line-height: 16px;
  font-weight: 700;
  background-color: var(--white);
}

.page-wrapper .arrow-button1 {
  font-size: 15px;
  line-height: 16px;
  font-weight: 400;
  border: none;
  display: flex;
  align-items: center;
  gap: 12px;
  background-color: var(--white);
}

.page-wrapper .arrow-button1 .arrow {
  width: 23px;
  height: 16.97px;
}

.page-wrapper .arrow-button2 {
  font-size: 15px;
  line-height: 16px;
  font-weight: 400;
  border: none;
  display: flex;
  align-items: center;
  gap: 16px;
  background-color: var(--white);
}

.page-wrapper .arrow-button2 .arrow {
  width: 23px;
  height: 16.97px;
}

.page-wrapper .icon-button1 {
  font-size: 15px;
  line-height: 16px;
  font-weight: 400;
  border: none;
  display: flex;
  align-items: center;
  gap: 12px;
  background-color: var(--white);
}

.page-wrapper .icon-button1 .icon {
  width: 24px;
  height: 24px;
}

.page-wrapper .icon-button1 .arrow {
  width: 23px;
  height: 16.97px;
}

.page-wrapper .icon-button2 {
  font-size: 15px;
  line-height: 16px;
  font-weight: 400;
  border: none;
  display: flex;
  align-items: center;
  gap: 16px;
  /* background-color: var(--white); */
}

.page-wrapper .icon-button2 .icon {
  width: 24px;
  height: 24px;
}

.page-wrapper .icon-button2 .arrow {
  width: 23px;
  height: 16.97px;
}

.page-wrapper .border-button:hover,
.page-wrapper .border-button:active,
.page-wrapper .border-button-bold:hover,
.page-wrapper .border-button-bold:active,
.page-wrapper .arrow-button1:hover,
.page-wrapper .arrow-button1:active,
.page-wrapper .arrow-button2:hover,
.page-wrapper .arrow-button2:active,
.page-wrapper .icon-button1:hover,
.page-wrapper .icon-button1:active,
.page-wrapper .icon-button2:hover,
.page-wrapper .icon-button2:active {
  color: var(--white);
  background-color: var(--primary);
}

.page-wrapper .text-center {
  text-align: center;
}

@media only screen and (max-width: 768px) {
  .page-wrapper h1 {
    font-size: 48px;
    line-height: 57.6px;
  }

  .page-wrapper h2 {
    font-size: 36px;
    line-height: 43.2px;
  }
}

/* style guide end */

/* control center page start */
/* .page-wrapper .container:has( #enhanced-reporting-swiper) {
  padding: 0;
} */

.page-wrapper #enhanced-reporting-swiper {
  padding: 0 64px;
}

.page-wrapper img {
  max-width: 100%;
}

.page-wrapper .mb-100 {
  margin-bottom: 100px !important;
}

.page-wrapper .mb-20 {
  margin-bottom: 20px;
}

.page-wrapper .container {
  box-sizing: border-box;
  max-width: 1220px;
  margin: 0 auto;
  padding: 0 62px;
}

.page-wrapper .pos-rel {
  position: relative;
}

/* Animation style start */
.page-wrapper .gs_reveal {
  opacity: 0;
  visibility: hidden;
  will-change: transform, opacity;
}

/* Animation style end */

/* Banner start */
.banner-sec {
  height: 100%;
  width: 100%;
  margin: 0 auto;
  min-height: 600px;
  max-height: 600px;
  position: relative;
  /* background: #f7f9fb; */
  background: linear-gradient(180deg,
      rgba(190, 212, 234, 0) 0%,
      rgba(190, 212, 234, 0.12) 100%);
  display: flex;
}

.banner-sec .banner-cnt {
  text-align: start;
  color: #fff;
  min-height: 600px;
  max-height: 600px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  margin-left: calc((100% - 1220px) / 2);
  max-width: calc(1060px / 14 * 6);
  padding-left: 62px;
  box-sizing: unset;
}

.banner-sec .charts-lottie {
  width: 100%;
  max-width: 1000px;
}

.banner-sec .charts-lottie svg {
  transform: translate(0) !important;
}

.banner-sec .banner-small-title {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  gap: 12px;
}

.banner-sec .banner-small-title .small-title {
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  color: #000000;
}

.banner-sec .main-title {
  font-size: 52px;
  font-style: normal;
  font-weight: 300;
  line-height: 62.4px;
  margin: 0 0 24px 0;
  color: #000000;
}

.banner-sec .para {
  color: #2e2e2e;

  font-size: 18px;
  font-style: normal;
  font-weight: 300;
  line-height: 21.6px;
  margin: 0 0 24px 0;
}

.banner-sec .banner-img-sec1,
.banner-img-sec2 {
  display: flex;
  justify-content: center;
}

.banner-sec .border-button {
  background-color: transparent;
  border: 1px solid #008aff;
  color: #008aff;
  padding: 12px 45px;
}

@media only screen and (max-width: 1220px) {
  .banner-sec .banner-cnt {
    width: 50%;
    margin: 0;
    max-width: unset;
  }

  .banner-sec .charts-lottie {
    width: 50%;
  }
}

/* Banner end */

/* config section start */
.config-sec {
  background: linear-gradient(180deg, #fff 0%, #f8fbfd 111.76%);
}

.config-sec .config-sec-bg {
  padding: 150px 0;
  background-image: url("/content/dam/carat/us/en/assets/control-center/conf-analytics-reporting-desktop.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top;
  width: 100%;
  position: relative;
  max-width: 1440px;
  margin: 0 auto;
}

.config-sec .content-wrapper {
  max-width: 67%;
  margin: 0 auto;
}

.config-sec .small-orng-title {
  color: #fb6400;

  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-transform: uppercase;
  text-align: center;
}

.config-sec .black-main-title {
  color: #000;
  text-align: center;

  font-size: 48px;
  font-style: normal;
  font-weight: 300;
  margin: 8px auto;
  line-height: 57.6px;
}

.config-sec .sec-para {
  color: #2e2e2e;
  text-align: center;

  font-size: 16px;
  font-weight: 300;
  margin: 0 auto;
  line-height: 19.2px;
}

/* config section end */

/* enhanced reporting section start */
.enhanced-reporting {
  padding: 120px 0 90px 0;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.enhanced-reporting .content-wrapper {
  max-width: 67%;
  margin: 0 auto;
}

.enhanced-reporting h2 {
  margin: 0 auto 24px auto;
  color: #000;
}

.enhanced-reporting .bodycopy1 {
  color: #2e2e2e;
  font-size: 16px;
  line-height: 19.2px;
}

.enhanced-reporting .spec {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 36px;
  padding-top: 60px;
  padding-bottom: 30px;
  width: 100%;
}

.enhanced-reporting .spec .spec-div {
  width: calc((100% - 72px) / 3);
  box-shadow: 0px 3.593442678451538px 25.154098510742188px 0px #00000014;
  background-color: #ffffff;
  height: auto;
}

.enhanced-reporting .spec .spec-div .spec-content {
  padding: 25.2px 35.9px;
}

.enhanced-reporting .spec-title {
  font-size: 21.56px;
  line-height: 25.87px;
  font-weight: 300;
  color: #000;
  margin: 7.19px 0 3.59px 0;
}

.enhanced-reporting .spec-details {
  font-size: 16px;
  line-height: 19.2px;
  font-weight: 400;
  margin: 0;
  color: #2e2e2e;
}

.enhanced-reporting-background {
  position: absolute;
  max-width: 1440px;
  width: 100%;
  top: 0;
  z-index: -1;
  right: 0;
}

/* enhanced reporting section end */

/* fingertips section start */
.finger-tips-sec {
  background-color: #f8fbfd;
  padding: 120px 0;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
}

.finger-tips-sec .finger-tips {
  display: flex;
  align-items: center;
  gap: 40px;
  position: relative;
}

.finger-tips-sec .finger-tips .firstChild {
  width: 45%;
}

.finger-tips-sec .finger-tips .lastChild {
  width: 55%;
}

/* .finger-tips-sec .finger-tips .insight-lottie {
  transform: scale(1.2);
} */

.finger-tips-sec .finger-tips .lastChild>svg {
  transform: scale(1.2) !important;
}

.finger-tips-sec .finger-tips h2 {
  margin: 24px 0;
  color: #000;
}

.finger-tips-sec .finger-tips .bodycopy2 {
  color: #2e2e2e;
  max-width: 85%;
}

.finger-tips-sec .finger-tips img {
  width: 100%;
}

.finger-tips-background {
  max-width: 1440px;
  width: 100%;
  position: absolute;
  top: 0;
  z-index: 0;
  right: 0;
}

/* fingertips section end */

/* Idea section start  */
.idea-sec.idea-blug-bg {
  background: linear-gradient(0deg,
      rgba(190, 212, 234, 0.1) 0%,
      rgba(190, 212, 234, 0.1) 100%),
    #fff;
}

.idea-sec {
  padding: 120px 0 120px 0;
}

.idea-sec .content-wrapper {
  max-width: 67%;
  margin: 0 auto;
}

.idea-sec h3 {
  text-align: center;
  margin: 0 0 80px 0;
  color: #000;
}

.idea-sec .idea-sub {
  position: relative;
  backdrop-filter: blur(10px);
  box-shadow: 0px 8px 40px 0px #00000014;
  background-color: #ffffff;
}

.idea-sec .overlay-cnt {
  position: absolute;
  bottom: 0;
  border-radius: var(--Auto-Number, 0px);
  backdrop-filter: blur(10px);
  background: #00000033;
  width: 100%;
}

.idea-sec .overlay-cnt2 {
  border-radius: var(--Auto-Number, 0px);
  background: rgba(255, 255, 255, 0.85);
  padding: 28px;
}

.idea-sec .overlay-cnt p {
  font-size: 16px;
  line-height: 19.2px;
  color: #ffffff !important;
  margin: 0;
  padding: 10px 28px;
}

.idea-sec .overlay-cnt2 h4 {
  margin: 0;
  /* min-height: 86.35px; */
  color: #000;
}

.idea-sec .idea-flex {
  display: flex;
  gap: 20px;
}

.idea-sec .idea-flex .idea-sub {
  width: calc((100% - 40px) / 3);
  cursor: pointer;
  height: auto;
}

.idea-sec .idea-flex .idea-sub img {
  width: 100%;
  display: block;
}

/*  */
.idea-sec a {
  text-decoration: none;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.idea-sec .idea-flex .idea-sub:hover .overlay-cnt2 h4 {
  color: var(--secondary);
}

.idea-sec .swiper {
  overflow: visible;
}

.idea-sec .swiper .swiper-pagination {
  display: none;
}

@media only screen and (max-width: 767px) {
  .idea-sec .swiper .swiper-pagination {
    display: block;
  }

  .idea-sec .swiper {
    overflow: hidden;
  }
}

/* Idea section end */

/* control center icon section start */
.cntrl-cntr-icon-sec {
  background: #f7f8fa;
  /* border-top: 1px solid #E1F1FE; */
}

.cntrl-cntr-icon-sec .cntrl-cntr-sec-bg {
  padding: 40px 0;
  background-image: url("/content/dam/carat/us/en/assets/control-center/bg-line-icon-left.svg"),
    url("/content/dam/carat/us/en/assets/control-center/bg-line-icon-right.svg");
  background-repeat: no-repeat;
  background-position: 15%, 90%;
  background-size: contain;
}

.cntrl-cntr-icon-sec .cntrl-cntr-icon {
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.cntrl-cntr-icon-sec .cntrl-cntr-icon a {
  text-align: center;
  text-decoration: none;
  padding: 34.16px;
  width: 20%;
  min-height: 79.24px;
  /* transition: all 0.5s ease-in-out; */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-sizing: unset;
}

.cntrl-cntr-icon-sec .cntrl-cntr-icon a:hover,
.cntrl-cntr-icon-sec .cntrl-cntr-icon a.active {
  border-radius: var(--Auto-Number, 0px);
  background: #fff;
  /* box-shadow: 0px 10.24688px 27.325px 6.83125px rgba(0, 0, 0, 0.04); */
  box-shadow: 0px 12px 32px 8px rgba(0, 0, 0, 0.04);
  backdrop-filter: blur(2px);
  transition: background 0.5s ease-in-out;
}

.cntrl-cntr-icon-sec .cntrl-cntr-icon img,
.cntrl-cntr-icon span {
  display: block;
  margin: 0 auto;
}

.cntrl-cntr-icon-sec .cntrl-cntr-icon img {
  width: 34.156px;
  height: 37.073px;
  transition: all 0.5s ease-in-out;
  margin-bottom: 8.54px;
  box-sizing: unset;
}

.cntrl-cntr-icon-sec .cntrl-cntr-icon a:hover img,
.cntrl-cntr-icon-sec .cntrl-cntr-icon a.active img {
  transition: all 0.5s ease-in-out;
  transform: scale(1.5);
  margin-bottom: 5px;
  padding-bottom: 10px;
}

.cntrl-cntr-icon-sec .cntrl-cntr-icon span {
  font-size: 12.809px;
  font-weight: 400;
  line-height: 13.663px;
  color: var(--black);
}

.cntrl-cntr-icon-sec .cntrl-cntr-icon a:hover span,
.cntrl-cntr-icon-sec .cntrl-cntr-icon a.active span {
  transition: all 0.3s ease-in-out;
}

/* control center icon section end */
@media only screen and (min-width: 1600px) {
  /* .page-wrapper .container {
        max-width: 100%;
    } */
}

@media only screen and (max-width: 1280px) {

  .config-sec .content-wrapper,
  .enhanced-reporting .content-wrapper,
  .idea-sec .content-wrapper {
    max-width: 85%;
  }
}

@media (max-width: 1024px) and (min-width: 991px) {
  .finger-tips-background {
    width: 125%;
  }

  .finger-tips-background .finger-tips-lottie {
    transform: translateX(10%);
  }
}

@media only screen and (max-width: 1024px) {

  /* Banner start */
  .banner-sec .main-title {
    max-width: 100%;
    margin-top: 0;
  }

  .banner-sec {
    background: linear-gradient(to bottom,
        rgba(190, 212, 234, 0) 0%,
        rgba(190, 212, 234, 0.12) 80%,
        #ffffff 20%);
    width: unset;
    max-height: unset;
    min-height: unset;
    flex-direction: column;
    align-items: center;
    padding: 100px 35px 40px;
  }

  .banner-sec .charts-lottie {
    width: 100%;
  }

  .banner-sec .banner-cnt {
    width: unset;
    align-items: center;
    text-align: center;
    max-height: unset;
    min-height: unset;
    height: auto;
    padding: 0 0 0 0;
  }

  .banner-sec .banner-small-title {
    justify-content: center;
    margin-bottom: 24px;
  }

  .banner-sec {
    min-height: 750px;
  }

  /* Banner end */
}

@media only screen and (max-width: 991px) {
  .page-wrapper .container {
    max-width: 100%;
    padding: 0 35px;
    width: 100%;
  }

  .config-sec .content-wrapper,
  .enhanced-reporting .content-wrapper,
  .idea-sec .content-wrapper {
    max-width: 100%;
  }

  .page-wrapper h2 {
    line-height: 57.6px;
  }

  /* config section start */

  .config-sec {
    padding: 100px 0;
    background-image: url("/content/dam/carat/us/en/assets/control-center/conf-analytics-reporting-tab.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
  }

  .config-sec .config-sec-bg {
    padding: 0;
    background-image: none;
  }

  .config-sec .sec-para {
    max-width: 100%;
  }

  /* config section end */

  /* enhanced reporting section start */
  .enhanced-reporting h2 {
    font-size: 48px;
    line-height: 57.6px;
  }

  .enhanced-reporting .spec {
    gap: 20px;
  }

  .enhanced-reporting .spec .spec-div {
    width: calc((100% - 20px) / 2);
  }

  .enhanced-reporting .spec-title {
    font-size: 24px;
    line-height: 28.8px;
  }

  /* .enhanced-reporting-lottie {
    display: none;
  } */

  /* enhanced reporting section end */
  /* fingertips section start */
  .finger-tips-sec .finger-tips {
    flex-wrap: wrap;
  }

  .finger-tips-sec .finger-tips .firstChild {
    width: 70%;
  }

  .finger-tips-sec .finger-tips .lastChild {
    width: 100%;
    margin: 0 auto;
    text-align: center;
  }

  .finger-tips-sec .finger-tips h2 {
    font-size: 48px;
    max-width: 80%;
  }

  .finger-tips-sec .finger-tips .bodycopy2 {
    max-width: 75%;
  }

  .finger-tips-sec {
    padding: 100px 0;
  }

  .finger-tips-background {
    width: 1440px;
  }

  /* fingertips section end */

  /* Idea section start */
  .idea-sec {
    padding: 100px 0 100px 0;
  }

  .idea-sec .idea-flex {
    flex-wrap: wrap;
    gap: 20px;
  }

  .idea-sec .idea-flex .idea-sub img {
    display: block;
    object-fit: none;
    height: 240px;
  }

  .idea-sec .overlay-cnt2 {
    position: relative;
    background: #fff;
    box-shadow: 0px 8px 40px 0px #00000014;
    flex: 1;
  }

  .idea-sec .overlay-cnt2 h4 {
    max-width: 100%;
  }

  .idea-sec .idea-flex .idea-sub {
    display: flex;
    flex-direction: column;
    height: auto;
  }

  /* Idea section end */

  /* control center icon section start */
  /* .page-wrapper .container:has( #enhanced-reporting-swiper) {
    padding: 0;
  } */
  .page-wrapper #enhanced-reporting-swiper {
    padding: 0 35px;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon a {
    padding: 22.83px;
  }

  .cntrl-cntr-icon-sec {
    padding: 40px 0;
    /* background-image: url("/content/dam/carat/us/en/assets/control-center/bg-line-icon-left.png"),
      url("/content/dam/carat/us/en/assets/control-center/bg-line-icon-right.png"); */
    /* background-repeat: no-repeat;
    background-position: 34% center, 103% center; */
    background-size: contain;
    position: relative;
  }

  .cntrl-cntr-icon-sec::before {
    content: "";
    background-image: url("/content/dam/carat/us/en/assets/control-center/bg-line-icon-left.svg"),
      url("/content/dam/carat/us/en/assets/control-center/bg-line-icon-right.svg");
    background-repeat: no-repeat;
    background-position: 34% center, 101% center;
    position: absolute;
    top: 0;
    left: 0;
    /* z-index: 1; */
    width: 100%;
    height: 100%;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-sec-bg {
    background-image: none;
    padding: 0;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon span {
    min-height: 27.31px;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon a:hover img,
  .cntrl-cntr-icon-sec .cntrl-cntr-icon a.active img {
    padding-top: 10px;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon a:hover span,
  .cntrl-cntr-icon-sec .cntrl-cntr-icon a.active span {
    display: flex;
    align-items: center;
  }

  /* control center icon section end */
}

@media only screen and (max-width: 767px) {
  .page-wrapper .container {
    padding: 0 32px;
  }

  /* Banner start */
  .banner-sec {
    padding: 58px 32px 40px;
  }

  .banner-sec .banner-cnt {
    padding: 0 0 58px 0;
  }

  .banner-sec .main-title {
    font-size: 48px;
    line-height: 57.6px;
  }

  .banner-sec .para {
    max-width: 100%;
  }

  .banner-sec .mb-100 {
    margin-bottom: 59px !important;
  }

  /* Banner end */

  /* config section start */
  .config-sec .black-main-title {
    font-size: 36px;
    line-height: 43.2px;
  }

  .config-sec {
    background-image: url("/content/dam/carat/us/en/assets/control-center/conf-analytics-reporting-mobile.png");
  }

  /* config section end */

  /* enhanced reporting section start */
  .enhanced-reporting {
    padding: 100px 0 90px 0;
  }

  .enhanced-reporting .container-mobile-fluid {
    padding: 0;
  }

  .enhanced-reporting .spec {
    flex-wrap: nowrap;
    gap: 0;
    padding: 50px 0 30px 0;
  }

  .enhanced-reporting .spec .spec-div {
    width: fit-content;
  }

  .enhanced-reporting h2 {
    font-size: 36px;
    line-height: 43.2px;
  }

  .enhanced-reporting .bodycopy1 {
    font-size: 16px;
    line-height: 19.2px;
  }

  .enhanced-reporting .spec-title {
    font-size: 22.155px;
    line-height: 26.587px;
  }

  #enhanced-reporting-swiper {
    padding: 0 20px;
  }

  .enhanced-reporting-text {
    margin-bottom: 70px !important;
  }

  /* .enhanced-reporting-lottie {
    display: none;
  } */
  .enhanced-reporting-background {
    width: 150%;
  }

  /* enhanced reporting section end */

  /* fingertips section start */
  .finger-tips-sec .finger-tips .firstChild {
    width: 100%;
    padding: 0 32px;
  }

  .finger-tips-sec .finger-tips h2 {
    font-size: 36px;
    line-height: 43.2px;
    margin: 24px 0;
    max-width: 100%;
  }

  .finger-tips-sec .finger-tips {
    gap: 64px;
  }

  .finger-tips-sec .finger-tips .lastChild {
    overflow: hidden;
  }

  /* .finger-tips-sec .finger-tips .insight-lottie {
    transform: scale(1.2);
  } */

  .finger-tips-sec .finger-tips .lastChild>svg {
    transform: scale(1.2) !important;
  }

  .finger-tips-sec .container-mobile-fluid {
    padding: 0;
  }

  /* fingertips section end */

  /* Idea section start */
  .idea-sec .idea-flex {
    flex-wrap: nowrap;
    gap: unset;
  }

  .idea-sec h3 {
    font-size: 36px;
    line-height: 43.2px;
    margin: 0 0 56px 0;
  }

  .idea-sec .idea-flex .idea-sub {
    width: fit-content;
    height: auto;
    display: flex;
    flex-direction: column;
  }

  .idea-sec .container-mobile-fluid {
    padding: 0;
  }

  .idea-sec .idea-flex .idea-sub img {
    height: auto;
    object-fit: contain;
  }

  /* Idea section end */

  /* control center icon section start */
  /* .page-wrapper .container:has( #enhanced-reporting-swiper) {
    padding: 0;
  } */
  .page-wrapper #enhanced-reporting-swiper {
    padding: 0 20px;
  }

  .cntrl-cntr-icon-sec::before {
    content: "";
    background-image: url("/content/dam/carat/us/en/assets/control-center/bg-line-icon-left.svg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: -30%;
    position: absolute;
    top: 0;
    left: 0;
    /* z-index: 1; */
    width: 100%;
    height: 100%;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon {
    flex-wrap: nowrap;
    flex-direction: column;
    position: relative;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon a {
    width: 100%;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon a {
    padding: 0;
    min-height: unset;
    display: block;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon img {
    padding-bottom: 0;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon a img {
    display: none;
    position: absolute;
    top: 30%;
    width: 51.23px;
    height: 55.61px;
    margin-bottom: 0;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon a:first-child img {
    display: block;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon span {
    margin: 0 auto 0 83.22px;
    text-align: left;
    position: relative;
    padding: 8px 0;
    white-space: nowrap;
    font-size: 16px;
    width: fit-content;
    line-height: 19.2px;
    font-weight: 300;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon span::after {
    content: url("/content/dam/carat/us/en/assets/control-center/footer-arrow.svg");
    position: absolute;
    right: -30px;
    padding-top: 2px;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon a:hover span::after,
  .cntrl-cntr-icon-sec .cntrl-cntr-icon a.active span::after {
    display: none;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon a:hover span,
  .cntrl-cntr-icon-sec .cntrl-cntr-icon a.active span {
    font-weight: 700;
  }

  .cntrl-cntr-icon-sec {
    background-position: -18% center, 200%;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon a:hover img,
  .cntrl-cntr-icon-sec .cntrl-cntr-icon a.active img {
    padding-bottom: 0;
    margin-bottom: 0;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon a:hover img,
  .cntrl-cntr-icon-sec .cntrl-cntr-icon a.active img {
    transform: scale(1);
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon a:hover,
  .cntrl-cntr-icon-sec .cntrl-cntr-icon a.active {
    background: unset;
    box-shadow: unset;
    backdrop-filter: unset;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon span {
    min-height: unset;
  }

  .cntrl-cntr-icon-sec .cntrl-cntr-icon a:hover img,
  .cntrl-cntr-icon-sec .cntrl-cntr-icon a.active img {
    padding-top: 0;
  }

  /* control center icon section end */

  /* mobile swiper start */
  .page-wrapper .mySwiper .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    background: var(--primary);
    opacity: 1;
  }

  .page-wrapper .mySwiper .swiper-pagination-bullet-active {
    width: 12px;
    height: 12px;
  }

  .page-wrapper .mySwiper .swiper-pagination-bullet.swiper__10X {
    width: 10px;
    height: 10px;
  }

  .page-wrapper .mySwiper .swiper-pagination-bullet.swiper__8X {
    width: 8px;
    height: 8px;
  }

  #idea-swiper .swiper-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative !important;
    margin-top: 56px;
    top: 0;
    bottom: 0;
  }

  /* mobile swiper end */
}

/* control center page end */

/* /////////////////////////////// */

/* Monitor section  */

.control-center-monitor-container {
  background-color: #f8fbfd;
  width: 100%;
  height: 100%;
}

.control-center-monitor {
  /* max-width: 1440px; */
  margin: 0 auto;
  display: flex;
  /* padding: 0 0 0 40px; */
}

.monitor-container {
  flex: 1 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 45% !important;
}

.control-center-lottieSide {
  display: flex;
  align-items: center;
  justify-content: center;
  position: sticky;
  top: 1px;
  width: 55% !important;
  height: 100vh !important;
  color: #fff;
  z-index: 3;
  overflow: hidden;
}

.monitor-container {
  overflow: hidden;
}

.monitor-container .monitor-main-container {
  padding-left: calc(((100vw - 1096px) / 2));
}

.monitor-main-container section {
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

.section_03 {
  display: flex;
  flex-direction: row;
}

._div_01 {
  width: 10rem;
}

.monitor-main-container {
  position: relative;
}

.control-center .monitor-scrollbar {
  width: 23px;
  height: 253px;
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 50%;
  transform: translateY(-50%) translateX(0%);
  opacity: 0;
}

.monitor-section-05 {
  position: relative;
}

.control-center .monitor-scrollbar .line {
  width: 2px;
  background-color: #d6d6d6;
  margin: 0 auto;
  height: 100%;
  position: relative;
}

.control-center .monitor-scrollbar .count_val {
  margin: 11px 0;
  text-align: center;
  color: var(--secondary);
}

.control-center .monitor-scrollbar .scrollbar_line {
  height: 35px;
  position: absolute;
  top: calc(20% - 2.15rem);
  transition: 1s;
  background-color: var(--secondary);
  width: 2px;
}

.monitor-section ._div_02 {
  width: calc(100% - 10rem);
  height: 100%;
  display: flex;
  flex-direction: row;
  z-index: 5;
}

.monitor-main-container .monitor-section {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
}

.monitor-section ._sec_01,
.monitor-section ._sec_02 {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.monitor-section ._sec_01 {
  padding: 20px 63px;
  box-sizing: unset;
}

.monitor-section ._sec_02 {
  position: relative;
}

._sec_02 img {
  position: absolute;
  display: none;
}

.content-container .h2 {
  margin-bottom: 1.5rem;

  font-size: 48px;
  font-weight: 300;
  line-height: 58px;
  letter-spacing: 0em;
  text-align: left;
  display: flex;
  flex-direction: column;
  white-space: nowrap;
  color: #000000;
}

.content-container .h2 .text_01 {
  color: #000000;
}

.content-container .h2 .text_02 {
  color: #fb6400;
}

.content-container .monitor-text-content {
  font-size: 16px;
  font-weight: 300;
  line-height: 24px;
  letter-spacing: 0em;
  text-align: left;
  color: #2e2e2e;
  width: 100%;
  line-height: 1.2;
}

.content-container {
  /* width: 75%; */
}

.control-center-monitor {
  /* padding: 0 0 0 100px; */
}

/* monitor-animation */

.monitor-main-container section {
  position: relative !important;
  overflow: hidden;
}

.lottie-mob-container {
  width: 100%;
}

.lottie-mob-container .monitor-animation {
  height: 100vh;
  filter: blur(0px);
  overflow: hidden;
}

.lottie-mob-container .monitor-animation>svg {
  width: 100%;
  height: 100%;
  padding-left: 10%;
  transform: scale(1.5) translateX(0) translateY(4%) !important;
}

.lottie_parent,
.monitor-animation-head {
  position: relative !important;
}

.background_ani {
  position: absolute;
  max-width: 1440px !important;
  height: 100vh !important;
  max-height: 100vh !important;
  left: 30% !important;
}

.lottie_parent>.pin-spacer {
  display: flex !important;
  justify-content: center !important;
  max-width: 1440px !important;
}

/* .background_lottie-control {
  position: absolute;
  transform: scale(1.5) translateX(-34%) translateY(16%);
} */
.background_lottie-control svg {
  width: 100%;
  height: 100vh !important;
}

.background_lottie-control {
  position: absolute;
  right: 0;
  width: 100%;
  /* transform: scale(1.5) translateX(-16%) translateY(16%); */
}

/* Monitor section ends  */

@media screen and (min-width: 1440px) {
  .lottie-mob-container .monitor-animation>svg {
    transform: scale(1) translateX(0) translateY(4%) !important;
  }

  .lottie-mob-container .monitor-animation>svg {
    padding-left: 0;
  }
}

@media screen and (max-width: 1096px) {
  .monitor-container .monitor-main-container {
    padding-left: 62px;
  }
}

@media screen and (max-width: 1024px) {
  .control-center-monitor {
    padding: 0;
  }
}

@media screen and (max-width: 1024px) {
  .lottie-mob-container .monitor-animation {
    width: 130%;
  }

  .lottie-mob-container .monitor-animation>svg {
    padding-left: 0;
    transform: scale(1) translateX(-10%) translateY(4%) !important;
  }

  .content-container .h2 {
    font-size: 42px;
    line-height: 1.2;
  }
}

@media screen and (max-width: 768px) {
  .monitor-section ._div_02 {
    z-index: 1;
  }

  .background_lottie-control {
    transform: scale(1) translateX(32%) translateY(0);
  }

  .finger-tips-lottie {
    transform: scale(1) translateX(32%) translateY(0);
  }

  .monitor-container .monitor-main-container {
    padding-left: 35px;
  }

  .monitor-section ._div_02 {
    flex-direction: column;
    width: calc(100% - 3rem);
  }

  .monitor-container {
    width: 100% !important;
  }

  .control-center-lottieSide {
    width: 100% !important;
    margin-left: -100%;
    z-index: 0;
  }

  .monitor-section ._sec_01,
  .monitor-section ._sec_02 {
    width: 100%;
  }

  .lottie-mob-container .monitor-animation>svg {
    transform: scale(1) translateX(0) translateY(25%) !important;
    padding-left: 0;
  }

  .control-center-lottieSide .lottie-mob-container {
    position: relative;
    height: 100vh;
    overflow: hidden;
  }

  .control-center .monitor-scrollbar {
    top: 24%;
  }

  .monitor-section ._sec_01 {
    width: 67%;
    height: 45%;
  }

  .content-container {
    width: 100%;
  }
}

@media screen and (max-width: 430px) {
  .monitor-container .monitor-main-container {
    padding-left: 32px;
  }

  .monitor-section ._div_02 {
    flex-direction: column;
    width: 100%;
  }

  .monitor-section ._sec_02 {
    width: 100%;
  }

  .monitor-section ._sec_01 {
    width: 100%;
    padding-left: 50px;
    box-sizing: border-box;
    padding-right: 0;
  }

  .monitor-section .content-container .h2 {
    white-space: unset;
  }

  .monitor-animation_mob {
    height: 50vh !important;
    width: 100% !important;
    top: 50% !important;
  }

  .control-center .monitor-scrollbar {
    top: 30%;
  }

  .monitor-section ._sec_01 {
    height: 55%;
  }

  .content-container .monitor-text-content {
    font-size: 14px;
  }

  .content-container {
    width: 100%;
    padding-right: 32px;
    box-sizing: border-box;
  }

  /* .content-container .h2 {
    font-size: 36px;
    line-height: 43.2px;
  } */
  .content-container .h2 {
    font-size: 28px;
    line-height: 1.2;
    margin-bottom: 18px;
  }

  .lottie-mob-container .monitor-animation {
    height: 75vh;
    margin-top: 25vh;
  }

  .lottie-mob-container .monitor-animation>svg {
    transform: scale(1) translateX(0) translateY(15%) !important;
  }

  .background_lottie-control {
    transform: scale(1) translateX(0%) translateY(0);
  }
}

@media screen and (min-width: 2000px) {

  .banner-sec .banner-cnt,
  .banner-sec {
    min-height: 720px;
  }

  .config-sec .config-sec-bg {
    padding: 160px 0;
  }
}

/*lottie placeholder*/
/*top banner*/
.control-center-banner-lottie .placeholder-banner-svg-us,
.control-center-banner-lottie .placeholder-banner-svg-emea {
  display: none;
}

.control-center-banner-lottie .placeholder-banner-svg-us.active,
.control-center-banner-lottie .placeholder-banner-svg-emea.active {
  display: block;
}

.control-center-banner-lottie .placeholder-banner-svg-us,
.control-center-banner-lottie .placeholder-banner-svg-emea {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}

.control-center-banner-lottie .placeholder-banner-svg-us::after {
  content: "";
  background-size: contain !important;
  background: url(/content/dam/carat/us/en/assets/control-center/control-center-header-us.png) no-repeat center;
  position: absolute;
  width: 100%;
  height: 100%;
}

.control-center-banner-lottie .placeholder-banner-svg-emea::after {
  content: "";
  background-size: contain !important;
  background: url(/content/dam/carat/us/en/assets/control-center/control-center-header-emea.png) no-repeat center;
  position: absolute;
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 1024px) {

  .control-center-banner-lottie .placeholder-banner-svg-us,
  .control-center-banner-lottie .placeholder-banner-svg-emea {
    height: 711px;
  }
}

@media screen and (max-width: 768px) {

  .control-center-banner-lottie .placeholder-banner-svg-us,
  .control-center-banner-lottie .placeholder-banner-svg-emea {
    height: 520px;
  }
}

@media screen and (max-width: 430px) {

  .control-center-banner-lottie .placeholder-banner-svg-us,
  .control-center-banner-lottie .placeholder-banner-svg-emea {
    height: 261px;
  }
}

@media screen and (max-width: 380px) {

  .control-center-banner-lottie .placeholder-banner-svg-us,
  .control-center-banner-lottie .placeholder-banner-svg-emea {
    height: 231px;
  }
}

/*end top banner*/
/* lottie placeholder image style */
.monitor-animation {
  flex-direction: column-reverse;
  display: flex;
}

.monitor-animation .placeholder-svg {
  display: none;
}

.monitor-animation .placeholder-svg.active {
  display: block;
}

.monitor-animation .placeholder-svg {
  width: 100%;
  height: 100%;
  position: absolute;
  background-size: cover !important;
  transform: scale(1.5) translate(10%, 4%);
}

@media screen and (min-width: 1440px) {
  .monitor-animation .placeholder-svg {
    transform: scale(1) translate(0%, 4%);
  }
}

.control-center-monitor.img1 .monitor-animation .placeholder-svg {
  background: url(/content/dam/carat/us/en/assets/control-center/control-center-ph1.png) no-repeat center left;
}

.control-center-monitor.img2 .monitor-animation .placeholder-svg {
  background: url(/content/dam/carat/us/en/assets/control-center/control-center-ph2.png) no-repeat center left;
}

.control-center-monitor.img3 .monitor-animation .placeholder-svg {
  background: url(/content/dam/carat/us/en/assets/control-center/control-center-ph3.png) no-repeat center left;
}

.control-center-monitor.img4 .monitor-animation .placeholder-svg {
  background: url(/content/dam/carat/us/en/assets/control-center/control-center-ph4.png) no-repeat center left;
}

.control-center-monitor.img5 .monitor-animation .placeholder-svg {
  background: url(/content/dam/carat/us/en/assets/control-center/control-center-ph5.png) no-repeat center left;
}

@media screen and (max-width: 1024px) {
  .monitor-animation .placeholder-svg {
    transform: scale(1) translate(-10%, 4%);
    height: 100%;
  }
}

@media screen and (max-width: 768px) {
  .monitor-animation .placeholder-svg {
    transform: scale(1.42) translate(15%, 10%);
    height: 70%;
  }
}

@media screen and (max-width: 430px) {
  .monitor-animation .placeholder-svg {
    background-size: cover !important;
    transform: scale(1.35) translate(13%, 2%);
    height: 100vw;
  }
}

/* cta button with arrow styles */
.page-wrapper .transparent-button {
  font-size: 15px;
  line-height: 16px;
  font-weight: 400;
  width: fit-content;
  border: none;
  display: flex;
  align-items: center;
  gap: 16px;
  color: var(--primary);
  transition: all 0.5s ease-in-out;
  text-decoration: none;
}

.page-wrapper .transparent-button:hover {
  text-decoration: underline;
}

.page-wrapper .transparent-button .arrow {
  width: 23px;
  height: 16.97px;
}

.page-wrapper .transparent-button .arrow img {
  transition: all 0.2s;
}

.page-wrapper .transparent-button .btn-text {
  color: #0076db;
  font-size: 15px;
  font-weight: bold;
  line-height: 16px;
}

.page-wrapper .transparent-button:hover .arrow img {
  margin-left: 10px;
}

@media screen and (max-width: 991px) {
  .page-wrapper .transparent-button {
    margin: 0 auto;
  }
}

/* scrollTop */
.scrollTop {
  position: fixed;
  opacity: 0;
  right: 20px;
  bottom: 15px;
  font-size: 16px;
  transition: 1s;
  z-index: 999;
}

.scrollTop .goTop {
  background-color: #bdbdbda3;
  outline: none;
  border: none;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.scrollTop .goTop:hover {
  background-color: #0000009e;
}

.scrollTop .goTop .goTop_img {
  width: 40px;
  height: 40px;
  margin-left: 2px;
}

.scrollTop.inactive {
  display: none;
  opacity: 0;
}

.scrollTop.active {
  display: block;
  opacity: 1;
}

._evh-link {
  left: 0 !important;
  right: auto !important;
}

/* ////////////////////////// */

/* placeholder style  */
.monitor-animation .placeholder-svg.active+svg {
  opacity: 0;
}

/* placeholder style  ends*/


/* new styles for column starts*/
.nw-section {
  padding-top: 60px !important;
}

.nw-section .nw-row {
  display: flex;
  margin-bottom: 60px;
  column-gap: 50px;
}

.nw-section .nw-row .nw-col-lg-6, .nw-section .nw-row .nw-col-lg-8, .nw-section .nw-row .nw-col-lg-4 {
  width: 100%;
}

.nw-section .nw-row .monitor-text-content {
  font-size: 16px;
  font-weight: 300;
  line-height: 24px;
  letter-spacing: 0em;
  text-align: left;
  color: #2e2e2e;
  width: 100%;
  line-height: 1.2;
  margin-bottom: 24px;
}

.nw-section .nw-row .h2 {
  margin: 8px 0 16px 0;
  font-size: 48px;
  font-weight: 300;
  line-height: 58px;
  letter-spacing: 0em;
  text-align: left;
  display: flex;
  flex-direction: column;
  white-space: normal;
  color: #000000;
}

.nw-section .nw-row .h2 .text_02 {
  color: #fb6400;
}

.nw-section .nw-row .h2 .text_02.nw-count {
  display: block;
  font-size: 38px;
}

.config-sec .config-sec-bg, .config-sec {
  background: none;
}

.config-sec .config-sec-bg {
  padding-top: 50px;
  padding-bottom: 0;
}

.config-sec .content-wrapper {
  max-width: 100%;
}

.config-sec .small-orng-title, .config-sec .black-main-title, .config-sec .sec-para {
  text-align: left;
}

.nw-section .nw-row .nw-lottie {
  width: 75%;
  margin: auto;
}

@media(min-width:992px) {
  .nw-section .nw-row .nw-col-lg-6 {
    width: 50%;
  }

  .nw-section .nw-row .nw-col-lg-8 {
    width: 60%;
  }

  .nw-section .nw-row .nw-col-lg-4 {
    width: 40%;
  }


  .nw-section .nw-row.nw-align-items-center {
    align-items: center;

  }
}

@media(min-width:1200px) {
  .nw-section .nw-row .nw-lottie {
    width: 70%;
  }
}

@media screen and (max-width: 430px) {
  .nw-section .nw-row .monitor-text-content {
    font-size: 14px;
  }

  .nw-section .nw-row .h2 {
    font-size: 28px;
    line-height: 1.2;
  }
}

@media(max-width:991.98px) {
  .nw-section .nw-row .nw-col-lg-6.nw-order-2, .nw-section .nw-row .nw-col-lg-8.nw-order-2 {
    order: 2;
  }

  .nw-section .nw-row .nw-col-lg-6.nw-order-1, .nw-section .nw-row .nw-col-lg-4.nw-order-1 {
    order: 1;
  }

  .nw-section .nw-row {
    flex-wrap: wrap;
  }

  .nw-section .nw-row .nw-img {
    margin-top: 20px;
  }

  .config-sec {
    padding-top: 0px;
    padding-bottom: 0;
  }

  .config-sec .config-sec-bg {
    padding-top: 30px;
  }

  .nw-section .nw-row .h2 .text_02.nw-count {
    font-size: 28px;

  }

  .nw-section .nw-row .h2 {
    display: block;
  }
}

/* new styles for column ends*/