@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap");

:root {
  --primary-heading-color: #050f42;
  --secondary-heading-color: #1a1a1a;
  --primary-paragraph-color: #191f4f;
  --primary-heading-background: linear-gradient(
    to right,
    #14bfeb,
    #855ac4,
    #ce5193,
    #db4f65
  );
  --button-bg-color: #517eff;
  --primary-font-family: "Inter";
  --white-color: #ffffff;
  --secondary-text-color: #fbfbfb;
}
* {
  font-family: "Inter";
}
img {
  max-width: 100%;
  height: auto;
}
.flex {
  display: -webkit-box;
  display: -ms-box;
  display: -ms-flexbox;
  display: flex;
}
.mainBanner.newBannerShow {
  background-image: url("../../assets/img/Hero-BG.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: auto;
  margin: 0;
  padding: 175px 0 100px;
}
.mainBanner.newBannerShow h1 {
  font: normal normal 800 56px/65px Inter;
}
.mainBanner.newBannerShow p {
  width: 60%;
}
.newLandingPage .about-us {
  background: #f3f6ff 0% 0% no-repeat padding-box;
  padding: 100px;
}
.newLandingPage .about-us .col {
  width: 65%;
}
.newLandingPage .about-us .col img {
  /* height: 420px; */
  width: 86%;
  object-fit: cover;
}
.newLandingPage .about-us .col-right {
  width: 30%;
}
.newLandingPage .about-us .col-right h2 {
  font: normal normal bold 40px/50px Inter;
  width: 70%;
  margin-bottom: 20px;
}
.newLandingPage .about-us .col-right p {
  text-align: left;
  font: normal normal normal 18px/30px Inter;
  letter-spacing: 0px;
}
.services-us {
  display: flex;
  padding: 50px;
}
.newLandingPage .services-us .col-1 h2 {
  font: normal normal bold 40px/50px Inter;
  letter-spacing: 0px;
  color: #1a1a1a;
  margin-bottom: 15px;
}
.newLandingPage.automation .services-us .col-1 h2,
.newLandingPage.automation .announcement-wrap .flex h3 {
  width: 88%;
}
.newLandingPage .services-us .col-1 p {
  font: normal normal normal 18px/30px Inter;
  letter-spacing: 0px;
  color: #1a1a1a;
  width: 86%;
}
.col-1 {
  width: 50%;
}
.newLandingPage .services-us .flex {
  margin: 80px 0;
  align-items: center;
  gap: 50px;
}

.newLandingPage.cold-marketing .guidence .flex{
  gap: 0;
}
.newLandingPage.cold-marketing .guidence .col-1 p {
  width: 100%;
}
.newLandingPage.cold-marketing .guidence .flex .guide{
  padding: 0 26px;
}

.newLandingPage.aiShowPage .services-us .flex {
  gap: 75px;
}
.newLandingPage.aiShowPage .services-us .col-1 p {
  width: 75%;
}
.newLandingPage .getInTouch {
  background: #f3f6ff 0% 0% no-repeat padding-box;
  padding: 120px 0;
}
.getInTouch h2 {
  text-align: center;
  font: normal normal 800 50px/60px Inter;
  letter-spacing: 0px;
  color: #050f42;
}
.getInTouch h2 span {
  background: transparent
    linear-gradient(90deg, #14bfeb 0%, #aa71ff 30%, #ce5193 63%, #db4f65 100%)
    0% 0% no-repeat padding-box;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.getInTouch p {
  text-align: center;
  font: normal normal normal 18px/30px Inter;
  letter-spacing: 0px;
  color: #1a1a1a;
  padding-top: 20px;
}
.subscribe {
  /* position: relative;
  margin-top: 30px; */
}
.subscribe input[type="email"],
.subscribe input[type="text"] {
  background: #ffffff 0% 0% no-repeat padding-box;
  border: 1px solid #c4d4ff;
  border-radius: 28px;
  padding: 20px 30px;
  width: 100%;
  margin: 0 auto;
  display: block;
}

.subscribe .demo-free-link,
.guidence .demo-free-link  {
  background: #517eff 0% 0% no-repeat padding-box;
  text-align: center;
  font: normal normal 600 20px/24px Inter;
  letter-spacing: 0px;
  color: #ffffff;
  padding: 20px 32px;
  border: unset;
  border-radius: 50px;
  /* position: absolute; */
  right: -3px;
  top: 0;
  cursor: pointer;
  text-decoration: none;
  width: fit-content;
  display: block;
  margin: 30px auto 10px;
}
.guidence .demo-free-link  {
  width: 100%;
}
::placeholder {
  font: normal normal normal 16px/30px Inter;
  letter-spacing: 0px;
  color: #9eabd1;
}
.subscribe small {
  text-align: center;
  text-align: center;
  font: normal normal normal 14px/30px Inter;
  letter-spacing: 0px;
  color: #8c8fa7;
  display: block;
  padding-top: 10px;
}
.cold-marketing .about-us {
  padding: 100px 100px 0px;
  background-color: #fff;
}
.cold-marketing .about-us .col-right{
  width: 50%;
}
.cold-marketing h1,
.cold-marketing h1 span {
  font: normal normal 800 52px/65px Inter !important;
}
.cold-marketing.ai h1,
.cold-marketing.ai h1 span {
  font: normal normal 800 46px/65px Inter !important;
}
.cold-marketing.ai .mainBanner p {
  margin-top: 20px;
  margin-bottom: 0;
}
.cold-marketing .mainBanner.newBannerShow p{
  color: #191F4F;
}
.cold-marketing .getInTouch h2 {
  color: #1A1A1A;
  font: normal normal bold 40px/50px Inter;

}

.cold-marketing .announce.cold-sales {
  padding-top: 100px;
}
.cold-marketing .announce.cold-sales .flex .col img {
  left: 28px;
  bottom: -35px;
}
.cold-marketing .announce.cold-sales .flex p{
  width: 90%;
}
.cold-marketing .guidence {
  background: #F3F6FF 0% 0% no-repeat padding-box;
border: 1px solid #5D74E1;
border-radius: 24px;
}
@media screen and (min-width: 1024px) {
  /* .subscribe .demo-free-link{
    right: 12rem
  }
  .getInTouch .subscribe input[type="email"]{
    width: 70%;
  }
  .getInTouch .subscribe .demo-free-link {
    right: 7rem;
} */
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .newLandingPage .services-us .col-1 h2 {
    font-size: 30px;
    line-height: 38px;
  }
  .cold-marketing .announce.cold-sales .flex .col {
    width: 100%;
  }
  .cold-marketing .announce.cold-sales .flex .col img {
    left: 20px;
    bottom: -80px;
}
  .newLandingPage.automation .services-us .col-1 h2,
  .newLandingPage.automation .announcement-wrap .flex h3 {
    width: 100%;
  }
  .newLandingPage .input-box {
    width: 100%;
  }
  .newLandingPage .about-us {
    padding: 40px;
  }
  .newLandingPage .about-us .col-right h2,
  .newLandingPage .about-us .col-right p {
    width: 100%;
    text-align: center;
  }
  .newLandingPage .services-us .col-1 p {
    width: 100%;
  }
  .newLandingPage .about-us .col,
  .newLandingPage .about-us .col-right {
    width: 100%;
    text-align: center;
  }
  .about-us .flex {
    display: flex;
    flex-direction: column;
    gap: 50px;
  }
  .newLandingPage .getInTouch {
    padding: 100px 30px;
  }
  .subscribe input[type="email"],
  .subscribe input[type="text"] {
    width: 85%;
  }
  .subscribe .demo-free-link {
    right: 50px;
  }
  .newLandingPage .about-us.crm .col,
  .newLandingPage .about-us.crm .col-right,
  .newLandingPage .about-us.crm .col-right p,
  .newLandingPage .about-us.crm .col img {
    width: 100%;
    height: auto;
    padding: 0 20px;
  }
  .newLandingPage .about-us.crm .col-right h2::before {
    content: unset;
  }
  .newLandingPage .why-show .flex.second .col.right img {
    bottom: 0;
  }
  .newLandingPage .why-show .flex.third .col:last-child {
    padding: 0px 75px 50px;
  }
  .newLandingPage .why-show .flex.third .col img {
    position: unset;
    padding-top: 50px;
    width: 75%;
    float: unset;
    display: block;
    margin: 0 auto;
    text-align: center;
  }
  .newLandingPage .why-show .flex.second .col.right img,
  .newLandingPage .why-show .flex.second .col.left img {
    margin-top: 0;
  }
  .newLandingPage .why-show .flex.second .col.left h3,
  .newLandingPage .why-show .flex.second .col.right h3 {
    font: normal normal bold 30px/38px Inter;
  }
  .why-show h2::before {
    left: 43%;
  }
}
@media only screen and (max-width: 767px) {
  .cold-marketing .about-us {
    padding: 100px 0px;
    background-color: #fff;
  }
  .cold-marketing .announce.cold-sales .flex .col img {
    left: 5px;
    bottom: -42px;
}
  .cold-marketing .about-us .col-right h2,
  .cold-marketing .about-us .col-right p {
    text-align: left !important;
  }
  .cold-marketing .about-us .col-right{
    width: 50%;
    padding-bottom: 0;
  }
  .newLandingPage .mainBanner h1{

  }
  .newLandingPage.cold-marketing .mainBanner p{
    width: 100%;
  }
  .about-us .flex,
  .services-us .flex {
    display: flex;
    flex-direction: column;
  }
  .newLandingPage.automation .services-us .col-1 h2,
  .newLandingPage.automation .announcement-wrap .flex h3 {
    width: 100%;
  }
  .newLandingPage.aiShowPage .services-us .col-1 p {
    width: 100%;
  }
  .newLandingPage .about-us.crm .col-right h2::before {
    content: unset;
  }
  .newLandingPage .services-us .flex {
    margin: 50px 0;
  }
  .newLandingPage .about-us,
  .services-us {
    padding: 50px 25px;
  }
  .newLandingPage .about-us .col,
  .newLandingPage .about-us .col-right {
    width: 100%;
  }
  .newLandingPage .services-us .col-1 p {
    width: 100%;
  }
  .col-1 {
    width: 100%;
  }
  .newLandingPage .services-us .col-1 h2,
  .newLandingPage .about-us .col-right h2 {
    font-size: 30px;
    line-height: 38px;
    width: 100%;
    margin-top: 20px;
  }
  .newLandingPage .getInTouch {
    background: #f3f6ff 0% 0% no-repeat padding-box;
    padding: 100px 25px;
  }
  .getInTouch h2,
  .mainBanner.newBannerShow h1,
  .newLandingPage .mainBanner h1 span,
  .cold-marketing h1,
  .cold-marketing h1 span {
    font: normal normal 800 40px/46px Inter;
  }
  .subscribe input[type="email"],
  .subscribe input[type="text"] {
    width: 80%;
  }
  .getInTouch .subscribe input[type="email"],
  .getInTouch .subscribe input[type="text"] {
    width: 100%;
  }
  .getInTouch .subscribe .demo-free-link {
    width: 100%;
  }
  .subscribe .demo-free-link {
    position: unset;
    margin-top: 15px;
    width: 80%;
    display: block;
  }
  .newLandingPage .mainBanner p {
    max-width: 100%;
    width: 100%;
    padding: 0 20px;
  }
  .newLandingPage .about-us .col-right p,
  .newLandingPage .about-us .col-right h2 {
    text-align: center;
  }
  .newLandingPage .about-us .col img {
    width: 100%;
  }
  .newLandingPage .about-us .col-right {
    padding-top: 30px;
  }
}