@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");

/* Boxicons */

@font-face {
  font-family: boxicons;
  src: url("../fonts/boxicons/boxicons.ttf");
}

/* Root Styling */

:root {
  --c1: #4a64f6;
  --c2: #fafdff;
  --c3: #0f151d;
  --f1: "Inter", sans-serif;
}

html,
body {
  scroll-behavior: smooth;
  overflow-x: hidden;
}
p.ParaTable {
  margin-bottom: 50px !important;
}
.img__contain {
  width: 100%;
  height: 100%;
}
@media screen and (min-width:1400px){
  p.ParaTableone {
    margin-bottom: 55px !important;
  }
  p.ParaTable {
    margin-bottom: 30px !important;
  }
}
@media screen and (max-width:1400px){
  p.ParaTableone {
    margin-bottom: 55px !important;
  }
  p.ParaTable {
    margin-bottom: 50px !important;
  }
}
@media screen and (max-width:1300px){

  p.ParaTable {
    margin-bottom: 30px !important;
  }
}
@media screen and (max-width:1200px){

  p.ParaTableone {
    margin-bottom: 30px !important;
  }
  p.ParaTable {
    margin-bottom: 50px !important;
  }
}
@media screen and (max-width:991px){

  p.ParaTable {
    margin-bottom: 30px !important;
  }
  .packages .row{

    gap: 20px;
  }
  .package_card{
    margin: 0 !important;
  }
}
@media screen and (min-width:1300px) and (max-width: 1400px) {
    p.ParaTableone {
        margin-bottom: 30px !important;
    }
}
 @media only screen and (max-width: 768px) {
    .package_card {
width: 100% !important;
    }
}


@media screen and (min-width: 1200px) and (max-width: 1300px) {
    p.deParaTableone {
        margin-bottom: 30px !important;
    }
}


.img__cover {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* General Styling */

body {
  background: #fafdff;
}

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  text-decoration: none !important;
  list-style-type: none;
  font-family: "Roboto", sans-serif;
}

::selection {
  background-color: var(--c1);
  color: #fff;
}

a {
  display: inline-block;
  color: #000;
  transition: all 300ms ease-in-out;
}

a:hover {
  color: #000;
}

ul,
ol,
dl {
  margin-bottom: 0;
  padding: 0;
}

p,
li,
a,
span,
input,
input::placeholder,
button {
  font-family: var(--f1);
}

.imgFluid {
  max-width: 100%;
  height: auto;
}

button {
  cursor: pointer;
  transition: all 300ms ease-in-out;
  outline: 0;
}

i.bx {
  font-family: boxicons;
  vertical-align: middle;
}

/* button style */

.themebtn {
  padding: 10px 20px;
  background: var(--c1);
  color: transparent;
  font-size: 16px;
  border-radius: 50px;
  position: relative;
  overflow: hidden;
  z-index: 11;
  box-shadow: 0px 0px 0px 1px var(--c1);
  /* border-radius: 20px; */
  color: #fff;
  font-weight: 300;
}

.themebtn:hover {
  background: var(--c1);
  color: var(--c1);
  box-shadow: 0 0 0 1px var(--c1);
}

.themebtn::before {
  position: absolute;
  top: 0;
  left: -75%;
  z-index: 2;
  display: block;
  content: "";
  width: 50%;
  height: 100%;
  background: -webkit-linear-gradient(
          left,
          rgba(255, 255, 255, 0) 0%,
          rgba(255, 255, 255, 0.3) 100%
  );
  background: linear-gradient(
          to right,
          rgba(255, 255, 255, 0) 0%,
          rgba(255, 255, 255, 0.3) 100%
  );
  -webkit-transform: skewX(-25deg);
  transform: skewX(-25deg);
  -webkit-animation: shine 0.75s;
  animation: shine 2s linear infinite;
}

.themebtn::after {
  position: absolute;
  content: "";
  width: 0;
  right: 0;
  height: 100%;
  background-color: var(--c2);
  top: 0;
  transition: 400ms ease;
  z-index: -1;
}

.themebtn:hover::after {
  width: 100%;
  left: 0;
}

.themebtn:hover span {
  animation: tada 1s;
}

/* button style */

/* animations */

@-webkit-keyframes shine {
  100% {
    left: 125%;
  }
}

@keyframes shine {
  100% {
    left: 125%;
  }
}

@keyframes handShake {
  0% {
    transform: rotate(0deg);
  }
  25% {
    transform: rotate(-8deg);
  }
  50% {
    transform: rotate(0deg);
  }
  75% {
    transform: rotate(8deg);
  }
  100% {
    transform: rotate(deg);
  }
}

@keyframes menu {
  0% {
    width: 100%;
  }
  50% {
    width: 50%;
  }
  100% {
    width: 100%;
  }
}

/* animation */

.main_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.header .container {
  padding: 0 30px;
}
.logo {
  width: 150px;
}

.header_nav {
  display: flex;
  align-items: center;
  gap: 50px;
}

.header_right {
  display: flex;
  align-items: center;
  gap: 58px;
}

.header_nav li a {
  font-size: 16px;
  position: relative;
}

.header_nav > li > a:before {
  position: absolute;
  bottom: 0;
  width: 0;
  height: 1px;
  background: var(--c1);
  transition: 500ms all;
  content: "";
}

.header_nav > li > a:hover:before {
  width: 100%;
}

.header_nav > li > a:hover {
  color: var(--c1);
}

.menu_btn {
  height: 25px;
  width: 25px;
  cursor: pointer;
  display: none;
  transform: rotate(180deg);
}

.menu_btn span {
  width: 100%;
  height: 3px;
  background: #000;
  display: block;
  margin: 4px 0;
  animation: menu 3s linear infinite;
}

.menu_btn span:nth-child(2) {
  animation-delay: 0.5s;
}

.menu_btn span:nth-child(3) {
  animation-delay: 1s;
}

.responsive_header {
  position: fixed;
  width: 100%;
  background: #fff;
  z-index: 9999;
  box-shadow: 0 0 15px 1px #4444;
  transform: translatey(-100%);
  transition: 500ms all;
}

.crs_btn {
  position: absolute;
  width: 30px;
  height: 30px;
  font-size: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  right: 10px;
  top: 10px;
}

.responsive_nav {
  margin: 30px 0 0;
}

.responsive_nav li a {
  padding: 10px 20px;
  width: 100%;
  border-bottom: 1px solid #4444;
  position: relative;
}

.responsive_nav li a:before {
  position: absolute;
  width: 0;
  height: 100%;
  content: "";
  background: var(--c1);
  transition: 500ms all;
  z-index: -1;
  inset: 0;
}

.responsive_nav li a:hover:before {
  width: 100%;
}

.responsive_nav li a:hover {
  color: #fff;
}

.responsive_header.active {
  transform: translate(0);
}

/* banner css start  */

.main__banner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 70vh;
  position: relative;
  padding: 54px 73px;
  border-radius: 20px;
  overflow: hidden;
}

.banner_img {
  position: absolute;
  width: 100%;
  height: 100%;
  inset: 0;
  z-index: -1;
}

.banner__mainContent {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 60vh;
}

.header {
  padding: 40px 0;
}

.banner_topContent h1 {
  font-size: 40px;
  color: var(--c2);
  font-family: var(--f1);
  font-weight: 400;
}

.banner_bottomContent h2 {
  font-size: 50px;
  font-family: var(--f1);
  font-weight: 500;
  color: var(--c2);
  margin: 0;
}

.banner_topContent h1 b {
  font-family: var(--f1);
  font-weight: 600;
}

.banner_btn {
  margin: 38px 0 0;
}

.banner_topContent h1 span {
  width: 40px;
  height: 40px;
  display: inline-block;
  transform-origin: bottom;
  animation: handShake 1s linear infinite;
}

/* momentum css start here   */

.mainMomentum {
  padding: 100px 0 100px 70px;
  background: var(--c3);
  border-radius: 20px;
  margin: 120px 0;
}

.partner {
  display: flex;
  align-items: center;
  gap: 9px;
  width: fit-content;
  padding: 5px 14px;
  border: 1px solid #0f151d70;
  border-radius: 30px;
}

.partner--alt {
  display: flex;
  align-items: center;
  gap: 9px;
  width: fit-content;
  padding: 5px 14px;
  border: 1px solid var(--c2);
  border-radius: 30px;
}

.tag_img {
  width: 20px;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.partner p {
  margin: 0;
  font-size: 14px;
  font-family: var(--f1);
  color: #0f151da6;
}

.momentum__title {
  font-size: 62px;
  color: var(--c2);
  font-family: var(--f1);
  font-weight: 500;
}

.momentum__inner {
  margin: 20px 0 0;
}

.momentum_innerContent p {
  font-family: var(--f1);
  font-size: 18px;
  color: var(--c2);
  margin: 0 0 50px;
  font-weight: 200;
  width: 90%;
}

.themebtn--blk {
  box-shadow: 0px 0px 0px 1px var(--c2);
  background: var(--c2);
  color: var(--c3);
}

.themebtn--trans {
  background: transparent;
  color: var(--c3);
  box-shadow: 0px 0px 0px 1px var(--c3);
}

.momentum_btns {
  display: flex;
  align-items: center;
  gap: 30px;
}

.themebtn--blk:hover {
  box-shadow: 0px 0px 0px 1px var(--c2);
  color: var(--c2);
  background: #fff;
}

.themebtn--trans:after {
  background: var(--c3);
}

.themebtn--trans:hover {
  color: var(--c3);
  box-shadow: 0px 0px 0px 1px var(--c2);
  background: transparent;
}

/* momentum css end here   */

/* client css start here    */

/* .section_content h4 {
  font-size: 50px;
  margin: 15px 0 100px;
  font-family: var(--f1);
  font-weight: 500;
  color: #000;
}
.section_contenth4 {
  margin: 15px 0 0px !important;
}

.client_img {
  width: 100%;
  height: 40px;
}

.client__item {
  margin: 0 10px;
}

.client_slider {
  margin: 50px 0 0;
}

.client_slider--alt {
  transform: rotate(180deg);
  margin: 70px 0 0;
}

.client_slider--alt .client_img {
  transform: rotate(180deg);
}
 */

/* client css start here    */

.section_content h4 {
  font-size: 50px;
  margin: 15px 0 100px;
  font-family: var(--f1);
  font-weight: 500;
  color: #000;
}

.section_contenth4 {
  margin: 15px 0 0px !important;
}

.client_img {
  width: 100%;
  height: 40px;
}

.client__item {
  margin: 0 10px;
}

.client_slider {
  margin: 50px 0 0;
}

.client_slider--alt {
  transform: rotate(180deg);
  margin: 70px 0 0;
}

.client_slider--alt .client_img {
  transform: rotate(180deg);
}

.client_img {
  width: 100%;
  height: 40px;
}

.service__item {
  margin: 0 10px;
}

.service_slider {
  margin: 50px 0 0;
}

.service_slider--alt {
  transform: rotate(180deg);
  margin: 0;
}

.service_slider--alt .recent_Crd {
  transform: rotate(180deg);
}

/* client css end here    */

/* client css end here    */

/* facts css start here    */

.clients {
  margin: 70px 0;
}

.facts {
  margin: 150px 0 20px;
}

.section_content > p {
  margin: 0;
  font-family: var(--f1);
  font-weight: 400;
  color: #000;
  font-size: 18px;
  width: 100%;
}

.fact_crd {
  background: #edf3f8;
  padding: 120px 0;
  text-align: -webkit-center;
  border-radius: 20px;
  min-height: 450px;
  align-content: center;
}
@media only screen and (min-width: 768px) and (max-width: 1300px) {
    .fact_crd p {
        font-size: 15px !important;
    }
    .fact_crd {
        min-height: 250px;
    }
}
@media only screen and (min-width: 520px) and (max-width: 767px) {
    .fact_crd p {
        font-size: 15px !important;
    }
    .fact_crd {
        min-height: 200px;
    }
}
@media only screen and (min-width: 0px) and (max-width: 519px) {
    .fact_crd p {
        font-size: 15px !important;
    }
    .fact_crd {
        min-height: 200px;
    }
}
.counter {
  display: flex;
  align-items: center;
  gap: 3px;
  font-size: 90px;
  justify-content: center;
  font-family: var(--f1);
  font-weight: 500;
  line-height: 54px;
  color: #000;
  margin: 0 0 20px;
}

.counter span {
  color: #4a64f6c7;
  font-size: 80px;
  display: flex;
  align-items: center;
}

.fact_crd p {
  margin: 50px 0 0 0;
  font-size: 20px;
  width: 70%;
}

.main_factCrds {
  margin: 60px 0 0;
}

/* facts css end here    */

/* recent work css start here    */

.recent_btn {
  display: flex;
  align-items: center;
  margin: 20px 0 0;
}

.recents__work {
  margin: 80px 0 0;
  background: var(--c3);
  padding: 70px 0;
}

.recent_Crd {
  margin: 40px 0 0;
  width: 100%;
}

.recent_img {
  width: 100%;
  height: auto;
  background: linear-gradient(
          181deg,
          rgba(208, 160, 177, 1) 0%,
          rgba(170, 178, 130, 1) 100%
  );
  border-radius: 20px;
  padding: 40px;
}

@media screen and (max-width: 1050px){
  .service__item .recent_title, .slick-dots li{
    display: none !important;
  }}
.recent_img img {
  width: 100%;
  object-fit: contain;
  border-radius: 20px;
}

.CaseGradient {
  background: linear-gradient(181deg, #667cf7 0%, #191e30 100%);
}
.CaseGradientNew {
  background: linear-gradient(181deg, #9c6553 0%, #01733f 100%) !important;
}
.CaseGradient2 {
  background: linear-gradient(181deg, #313131 0%, #aecf3d 100%);
}
.CaseGradient3 {
  background: linear-gradient(181deg, #cadcfa 0%, #070719 100%);
}

.recent_img img {
  transition: 500ms all;
}

.recent_title {
  margin: 20px 0 0;
  font-size: 30px;
  font-family: var(--f1);
  font-weight: 400;
  color: var(--c2);
}

.recent_Crd:hover .recent_img img {
  scale: 1.08;
}

.recent__mainCrds {
  margin: 40px 0 0;
}
.recent__mainCrds .recent_img{
  height: fit-content !important;
}
/* recent work css end here    */

/* testimonial css start here    */

.testimonials {
  background: var(--c3);
  padding: 70px 0;
}

.collen_img {
  width: 50px;
  height: auto;
  margin: 0 0 20px;
}

.test_content {
  width: 100%;
}

.test_content p {
  font-size: 40px;
  color: var(--c2);
  font-family: var(--f1);
  font-weight: 400;
  line-height: 55px;
  margin: 0 0 40px;
}

.test_bottom {
  padding: 50px 0 0px;
  border-top: 1px solid #ffffff40;
}

.Test_user {
  display: flex;
  align-items: center;
  gap: 20px;
  width: fit-content;
}

.user_img {
  width: 90px;
  aspect-ratio: 1/1;
  border-radius: 100%;
  overflow: hidden;
}

.user_name :is(p, h4) {
  color: var(--c2);
}

.user_name p {
  font-size: 14px;
  margin: 0;
  font-family: var(--f1);
}

.user_name h4 {
  font-family: var(--f1);
  font-size: 24px;
}

.test_item {
  margin: 0px;
}

.slick-arrow {
  top: 86%;
  position: absolute;
  width: 50px;
  height: 50px;
  border: 1px solid var(--c2);
  background: transparent;
  color: var(--c2);
}

.slick-next {
  right: 0;
}

.slick-prev {
  right: 60px;
}

.slick-arrow:hover {
  background: var(--c2);
}

.slick-arrow:hover:before {
  color: var(--c3);
}

.slick-arrow:before {
  font-size: 40px;
  font-family: "boxicons";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.slick-prev:before {
  content: "\ea4d";
}

.slick-next:before {
  content: "\ea50";
}

.slick-dots li button:before {
  display: none;
}

.slick-dots li button {
  width: 100%;
  height: 100%;
  background: #fdfdfd4a;
  border-radius: 100%;
  padding: 0;
}

.slick-dots li {
  margin: 0 !important;
}

.slick-dots {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  width: fit-content;
  position: absolute;
  bottom: 45px;
  right: 140px;
}

.slick-dots .slick-active button {
  background: var(--c2);
}

/* testimonial css end here    */

/* about css start here    */

.about_img {
  width: 100%;
  height: 700px;
  border-radius: 20px;
  overflow: hidden;
}

.about {
  padding: 140px 0 70px;
}

.about_content p {
  margin: 20px 0;
  font-size: 20px;
}

.about_btns {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 30px 0 0;
}

/* about css end here    */

/* service css start here    */

.servies {
  padding: 70px 0;
}

.section_content--alt h4 {
  font-size: 50px;
}

.section_content--alt p {
  margin: 15px 0 25px;
}

.accordion-body p {
  margin: 0;
  font-size: 18px;
  font-family: var(--f1);
  color: #000;
}

.accordion-item {
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--c1);
}

.accordion-button {
  padding: 30px 0;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 28px;
  color: #000 !important;
  font-family: var(--f1);
}

.accordion-body {
  padding: 0px 0 25px;
}

.accordion-button:not(.collapsed)::after {
  transform: rotate(0deg) !important;
  filter: brightness(0) !important;
  width: 25px;
  height: 25px;
  background-size: contain;
}

.accordion-button:after {
  width: 25px;
  height: 25px;
  background-size: contain;
  transform: rotate(90deg) !important;
}

.main_services {
  padding: 80px;
  background: #edf3f8;
  border-radius: 20px;
}

/* service css end here    */

/* mac section css start here */

.maic_img {
  width: 100%;
  height: 100%;
}

.mac_imgMain {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
}

.ripple_overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  inset: 0;
}

/* mac section css end here */

/* why choose section css start here */

.choose_crd {
  text-align: -webkit-center;
}

.choose_crd h5 {
  font-family: var(--f1);
  font-size: 32px;
  font-weight: 300;
  margin: 0 0 20px;
  color: var(--c2);
}

.main_whyChooseCrds {
  margin: 50px 0 0;
}

.choose_crd p {
  margin: 0;
  font-size: 18px;
  font-family: var(--f1);
  font-weight: 300;
  color: var(--c2);
  width: 90%;
}

.why__choose {
  margin: 70px 0;
}

/* why choose section css end here */

/* blog section css start here */

.blog_img {
  width: 100%;
  height: 500px;
  border-radius: 15px;
  overflow: hidden;
  position: relative;
}

.blog_img,
.single_img {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 100%; /* optional, keeps image responsive */
  overflow: hidden;
}

.blog_img::before,
.single_img::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.5); /* black overlay with 50% opacity */
  z-index: 1;
}

.blog_head,
.single_head {
  z-index: 2;
}

.blogTop {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin: 15px 0;
}

.blogTop p {
  font-size: 14px;
  font-family: var(--f1);
  margin: 0;
}

.blogTop p:nth-last-child(1) {
  color: var(--c1);
}

.blog_mainContent h4 {
  font-size: 25px;
  margin: 0 0 5px;
  font-family: var(--f1);
  font-weight: 400;
  padding: 10px 0;
}

.blog_mainContent > p {
  margin: 0;
  font-size: 18px;
  font-family: var(--f1);
  font-weight: 300;
  margin: 15px 0 0;
  color: #444;
  width: 95%;
}

.blog_crd:hover .blog_img img {
  scale: 1.3;
}

.blog_img img {
  transition: 500ms all;
}

.main_blogCrds {
  margin: 60px 0 0;
}

.blog {
  padding: 70px 0;
}

/* blog section css end here */

/* footer css start here */

.footer {
  padding: 60px 0 0;
}

.main_footer {
  padding: 40px 73px 0;
  background: #0f151d;
  border-radius: 20px 20px 0 0;
}

.footer_start {
  width: 510px;
}

.footer_start h3 {
  font-size: 46px;
  font-family: var(--f1);
  font-weight: 500;
  color: #fff;
  margin: 0 0;
}

.footer_start p {
  margin: 20px 0 30px;
  font-family: var(--f1);
  font-size: 18px;
  color: #fff;
  font-weight: 300;
}

.footer_contact {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin: 50px 0 20px;
}

.footer_contactMain h4 {
  font-size: 40px;
  font-family: var(--f1);
  color: #fff;
  text-transform: capitalize;
  font-weight: 500;
  margin: 0 0 10px;
}

.foo_contList li a {
  font-family: var(--f1);
  color: #fff;
  font-size: 16px;
  font-weight: 300;
}

.grab_para h6 {
  margin: 0;
  font-size: 24px;
  color: #fff;
  font-family: var(--f1);
  font-weight: 400;
}

.footer_bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  border-top: 1px solid #4a64f673;
  padding: 25px 0;
}

.footer_socialIcons {
  display: flex;
  align-items: center;
  gap: 10px;
}

.footer_socialIcons li a {
  font-size: 20px;
  color: #fff;
  display: flex;
  align-items: center;
}

.copy_content {
  margin: 0;
  font-size: 14px;
  font-family: var(--f1);
  color: #fff;
}

.copy_content a {
  font-size: 14px;
  font-family: var(--f1);
  color: #fff;
  text-decoration: underline !important;
}

.foo_contList li a:hover {
  padding-left: 10px;
}

.footer_socialIcons li a .medium {
  font-family: auto;
}

/* footer css end here */

/* inner banner  */

.banner_img--inner:before {
  position: absolute;
  width: 100%;
  height: 100%;
  content: "";
  background: #00000073;
}

.banner_bottomContent p {
  font-size: 20px;
  text-transform: capitalize;
  color: #fff;
  font-family: var(--f1);
  font-weight: 300;
}

/* inner banner  */

/* guarantee css  */

.guarantee {
  margin: 70px 0 0;
}

.main_guarantee {
  padding: 70px 73px;
  background: #4444441c;
  border-radius: 20px;
}

.main_guarantee h4 {
  font-size: 45px;
  font-weight: 600;
  font-family: var(--f1);
  margin: 0;
}

.guarantee_list {
  margin: 20px 0 0;
  padding-left: 20px;
}

.guarantee_list li {
  margin: 10px 0;
  font-size: 18px;
  font-family: var(--f1);
  list-style: disc;
  line-height: 26px;
}

.guarantee_innerList {
  padding-left: 40px;
  margin: 20px 0;
}

.guarantee_innerList li {
  list-style: circle;
}

.guarantee_list li a {
  font-family: var(--f1);
  color: var(--c1);
  font-weight: 600;
  text-transform: capitalize;
  text-decoration: underline !important;
}

.banner_btn {
  display: flex;
  align-items: center;
  gap: 12px;
}

.themebtn--blutrns {
  background: transparent;
  box-shadow: 0 0 0 1px #fff;
}

/* guarantee css  */

/* canvas css  */

.canva_sec {
  margin: 70px 0 0;
}

.canva_mainSec {
  padding: 70px 73px;
  background: #44444421;
  border-radius: 20px;
}

.canva_mainSec p {
  font-size: 16px;
  margin: 10px 0;
  font-family: var(--f1);
}

.canva_mainSec > a {
  font-size: 16px;
  font-family: var(--f1);
  font-weight: 600;
  color: var(--c1);
  text-decoration: underline !important;
}

.canva_boxes {
  display: flex;
  flex-wrap: wrap;
  gap: 11px;
  justify-content: center;
}

.canva_box {
  /*width: 23.6%;*/
  display: flex;
  height: 160px;
  padding: 20px 10px;
  border-radius: 20px;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  text-align: center;
  border: 1px solid #4444;
  transition: none !important;
  text-decoration: none !important;
}

.canvas_mainBoxes {
  margin: 40px 0;
}

.canva_head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-family: var(--f1);
  font-weight: 700;
  color: #000;
  font-size: 15px;
}

.canva_head i {
  font-size: 28px;
}

.canva_box p {
  font-size: 13px;
  color: #000;
  font-family: var(--f1);
}

.color_coding {
  display: flex;
  justify-content: center;
  margin: 20px 0 0;
  gap: 30px;
}

.color {
  width: 18px;
  height: 18px;
  border-radius: 100%;
  border: 1px solid #4444;
}

.color_coding li {
  display: flex;
  align-items: center;
  gap: 10px;
}

.canva_box--blu {
  background: #b3e5fc;
}

.color--blu {
  background: #b3e5fc;
}

.canva_box--grn {
  background: #c8e6c9;
}

.color--grn {
  background: #c8e6c9;
}

.canva_box--red {
  background: #ffccbc;
}

.color--red {
  background: #ffccbc;
}

.canvas_content h5 {
  font-size: 25px;
  font-weight: 500;
  font-family: var(--f1);
  margin: 0;
  color: #000;
  display: flex;
  align-items: center;
  gap: 10px;
}

.canvas_content {
  margin: 30px 0;
}

.canva_downSec {
  padding: 30px 0;
  border: 3px dashed #4444;
  border-left: none;
  border-right: none;
}

.canva_downSec h5 {
  font-size: 25px;
  font-weight: 500;
  font-family: var(--f1);
  margin: 0;
  color: #000;
}

.canva_downSec a {
  margin: 5px 0 0;
  font-family: var(--f1);
  font-weight: 500;
  color: var(--c1);
  text-decoration: underline !important;
}

.canva_mainSec p a {
  font-family: var(--f1);
  font-weight: 500;
  color: var(--c1);
  text-decoration: underline !important;
}

/* canvas css  */

/* oneflow Sec css  */

.mainOneFlow {
  padding: 70px 73px;
  background: #44444421;
  border-radius: 20px;
  font-size: 17px;
  font-family: var(--f1);
  font-weight: 400;
  line-height: 30px;
}

.OneFlow {
  margin: 70px 0 0;
}

.mainOneFlow h1 {
  font-size: 35px;
  font-family: var(--f1);
  font-weight: 600;
  color: #000;
  margin: 0 0 20px;
}

.mainOneFlow ul {
  padding-left: 20px !important;
}

.light-color {
  color: var(--c1);
  font-family: var(--f1);
}

.mainOneFlow ul li {
  margin: 10px 0;
  list-style: disc !important;
}

.mainOneFlow ul li a {
  font-family: var(--f1);
  font-size: 17px;
  color: var(--c1);
  text-decoration: underline !important;
}

.mainOneFlow a {
  font-family: var(--f1);
  color: var(--c1);
  text-decoration: underline !important;
}

hr.big-sep {
  border-top: 5px dashed grey;
  background: transparent !important;
  margin: 30px 0;
}

.mainOneFlow h3 {
  font-size: 25px;
  font-family: var(--f1);
  font-weight: 500;
  color: #000;
  margin: 35px 0 15px;
}

.mainOneFlow h2 {
  font-size: 24px;
  margin: 30px 0 20px;
  padding: 0 0 10px;
  border-bottom: 1px solid #4444;
  font-weight: 500;
  font-family: "Inter";
  color: #000;
}

code {
  display: inline-block;
}

.mainOneFlow h {
  font-size: 18px;
  font-family: var(--f1);
  font-weight: 600;
  color: var(--c1);
}

/* oneflow Sec css  */

/* blog Sec css  */

.mainBlog {
  padding: 70px 73px;
  border-radius: 20px;
  background: #44444414;
  font-size: 17px;
  font-family: var(--f1);
  color: #000;
  line-height: 28px;
}

.blogs {
  margin: 70px 0 0;
}

.mainBlog h1 {
  font-family: var(--f1);
  font-weight: 500;
  color: #000;
  margin: 0 0 20px;
  font-size: 35px;
}

.mainBlog p span {
  font-family: var(--f1);
  font-weight: 600;
  color: var(--c1);
}

.btn--primary {
  color: var(--c1) !important;
  padding: 0;
  text-decoration: underline !important;
  font-family: var(--f1);
  border: none !important;
  background: transparent !important;
  width: fit-content !important;
}

.btn {
  background: var(--c3);
  color: #fff;
  margin: 4px 0;
  width: 290px;
  border: 1px solid var(--c3);
}

.btn:hover {
  background: transparent;
  color: var(--c3);
}

.mainBlog h3 {
  font-size: 24px;
  font-family: var(--f1);
  font-weight: 500;
  margin: 30px 0 7px;
}

/* blog Sec css  */

/* 404 css  */

.main_errorSec {
  display: flex;
  align-items: end;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 100vh;
  position: relative;
  padding: 30px 0;
}

.error_img {
  position: absolute;
  width: 100%;
  height: 100%;
  inset: 0;
  z-index: -1;
}

/* 404 css  */

.main__banner--inner {
  min-height: 70vh;
}

.main__banner--inner .banner_img:before {
  display: none !important;
}

.resource_crd {
  padding: 20px;
  border: 1px solid #4444;
  height: 290px;
  display: grid;
  place-content: center;
  margin: 20px 0;
  border-radius: 20px;
  background: #44444417;
}

.resource_head {
  font-size: 25px;
  font-family: var(--f1);
  font-weight: 500;
  margin: 0 0 10px;
  line-height: 30px;
}

p.resource__Para {
  margin: 10px 0 0;
  font-size: 16px;
  font-family: var(--f1);
  line-height: 25px;
}

.resource_crd:hover {
  scale: 1.03;
}

.learn_moreSec {
  text-align: -webkit-center;
  margin: 30px 0 0;
}

.learn_moreSec h4 {
  font-size: 25px;
  font-family: var(--f1);
  margin: 0 0 10px;
  font-weight: 600;
  color: #000;
}

.learn_moreSec p {
  font-size: 16px;
  font-family: var(--f1);
  margin: 15px 0;
}

.resource_sec {
  padding: 70px 0 0;
}

.themebtn--trans {
  color: var(--c2);
  box-shadow: 0 0 0 1px var(--c2);
}
.themebtn--trans:hover:after {
  background: var(--c2);
}

.themebtn--blk:hover::after {
  width: 100%;
  left: 0;
}

.themebtn--blk:hover span {
  animation: tada 1s;
}
.themebtn--trans::after {
  position: absolute;
  content: "";
  width: 0;
  right: 0;
  height: 100%;
  background-color: var(--c2);
  top: 0;
  transition: 400ms ease;
  z-index: -1;
}

.themebtn--blk::after {
  position: absolute;
  content: "";
  width: 0;
  right: 0;
  height: 100%;
  background-color: var(--c3);
  top: 0;
  transition: 400ms ease;
  z-index: -1;
}

.partner--alt p {
  margin: 0;
  font-size: 16px;
  font-weight: 200;
  font-family: var(--f1);
  color: var(--c2);
}

.section_content--wht :is(h4, p) {
  color: var(--c2);
}

.themebtn--dark {
  color: var(--c2);
  background: var(--c3) !important;
  box-shadow: 0 0 0 1px var(--c3);
}

.themebtn--dark:hover:after {
  background: var(--c2) !important;
}

.themebtn--dark:hover {
  color: var(--c3) !important;
  box-shadow: 0 0 0 1px var(--c3) !important;
}

.themebtn--light {
  background: transparent !important;
  color: var(--c3) !important;
  box-shadow: 0 0 0 1px var(--c3) !important;
}

.themebtn--light:hover:after {
  background: var(--c3);
}

.themebtn--light::after {
  position: absolute;
  content: "";
  width: 0;
  right: 0;
  height: 100%;
  background-color: var(--c3);
  top: 0;
  transition: 400ms ease;
  z-index: -1;
}

.themebtn--light:hover {
  color: var(--c2) !important;
}

.main__choose {
  padding: 100px 50px;
  background: var(--c3);
  border-radius: 20px;
}

.blogTags {
  display: flex;
  align-items: center;
  gap: 15px;
  margin: 20px 0;
  flex-wrap: wrap;
}

.blogTags li {
  padding: 5px 15px;
  border: 1px solid #4444;
  font-size: 14px;
  border-radius: 50px;
  color: #444444d1;
}

.blog_head {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 60px;
  width: 100%;
  text-align: center;
  font-family: var(--f1);
  font-weight: 600;
  background: linear-gradient(
          90deg,
          rgb(166 240 255) 0%,
          rgb(239 157 196) 100%
  );
  color: transparent;
  -webkit-background-clip: text;
  padding: 0 20px;
}

.footer_startMain {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.footer_newsLetter p {
  font-size: 18px;
  font-weight: 300;
  color: var(--c2);
  font-family: var(--f1);
  margin: 0;
}

.inputFeild input {
  width: 100%;
  padding: 13px 20px;
  font-size: 14px;
  border-radius: 14px;
  background: #999999;
  border: none !important;
  outline: none !important;
  color: var(--c2);
}

.inputFeild input::placeholder {
  color: var(--c2);
}

.inputFeild {
  margin: 15px 0;
}

.label_feild {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}

.label_feild label {
  color: var(--c2);
  font-size: 14px;
  font-family: var(--f1);
  font-weight: 300;
}

.label_feild input {
  background: transparent;
  width: 15px;
  height: 15px;
}

.field_btn button {
  border: none !important;
  outline: none !important;
}

@media screen and (min-width: 1400px) {
  .container {
    max-width: 1400px !important;
  }
}
@media screen and (max-width: 1400px) {
  .container {
    max-width: 1200px !important;
  }
}
@media screen and (max-width: 1200px) {
  .container {
    max-width: 1000px !important;
  }
}

/* marquee */

.client_slider {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 50px;
  max-width: 1340px !important;
}
.marquee-wrapper {
  width: 100%;
  overflow-x: hidden; /* Allow horizontal scrolling */
  position: relative;
  padding: 10px 0px; /* Adjusted for mobile */
}

.client_slider.marqueeLeft,
.client_slider.marqueeRight {
  --duration: 20s;
  --gap: 40px;
  animation: scroll-left var(--duration) linear infinite;
}

.client_slider.marqueeRight {
  animation: scroll-right var(--duration) linear infinite;
}

.client_img:hover {
  filter: opacity(1);
}
.client_img {
  filter: opacity(0.8);
}

.client_img {
  height: 50px;
  display: flex;
  align-items: center;
}

.ClientImg {
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}

/* Duplicate content via ::after for loop effect */
.client_slider::after {
  content: attr(data-content);
  display: inline-block;
  white-space: nowrap;
}

@keyframes scroll-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@keyframes scroll-right {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}

.CaseDiv {
  display: flex;
  justify-content: center;
  align-items: center;
  background-size: cover !important;
}

.CaseImg {
  width: 520px;
  height: 100%;
  border-radius: 20px;
}

/* New */

.gr {
  background-color: #edf3f8 !important;
  color: black !important;
}

.gr .partner--alt p {
  color: #0f151d !important;
}

.gr .partner--alt {
  border: 1px solid #0f151d70 !important;
}

.gr .momentum__title {
  color: black !important;
}

.gr .momentum_innerContent p {
  color: black !important;
}

.web__momentum--alt .mainMomentum {
  background: #edf3f8;
  margin: 0px 0;
}

.recents__work--alt {
  background: transparent;
  margin: 0;
}

.recents__work--alt .recent_title {
  color: #000;
}

.innerBannerContent h3 {
  font-size: 72px;
  font-family: var(--f1);
  font-weight: 600;
  color: #000;
}

.innerBannerContent p {
  font-family: var(--f1);
  font-weight: 400;
  width: 55%;
  color: #000;
  margin: 20px 0 0;
}

.innerBanner {
  padding: 90px 0;
}

.imageSec {
  background: linear-gradient(
          181deg,
          rgba(208, 160, 177, 1) 0%,
          rgba(170, 178, 130, 1) 100%
  );
  padding: 90px;
}

.sec_img {
  width: 68%;
  height: auto;
  margin: 0 auto;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 0 15px 1px #4444;
}

.pro_detailMain {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.pro_detail h5 {
  font-family: var(--f1);
  font-weight: 500;
  color: #000;
  font-size: 20px;
  margin: 0 0 5px;
}

.pro_detail :is(p, a) {
  font-size: 14px;
  font-family: var(--f1);
  color: #000;
  font-weight: 400;
  margin: 10px 0 0;
}

.pro_detail a {
  text-decoration: underline !important;
}

.pro_detail--bot {
  margin: 50px 0 0;
}

.pro_services li a {
  padding: 6px 9px;
  text-decoration: none !important;
  color: #1e2a38;
  border: 1px solid #1e2a38;
  width: fit-content;
  text-align: center;
  border-radius: 50px;
  margin: 0;
  cursor: unset !important;
}

.pro_services li {
  margin: 12px 0;
}

.prject_detail {
  padding: 120px 0;
}

.project_detailPara {
  width: 68%;
  margin: 120px auto 0;
}

.project_detailPara p {
  margin: 0;
  font-size: 36.2px;
  color: #000;
  font-family: var(--f1);
  font-weight: 400;
}

.tab_innerImg {
  width: 100%;
  height: 107vh;
  border-radius: 20px;
  overflow: hidden;
}

.contant_secContent {
  width: 68%;
  margin: 0 auto;
}

.content_sec {
  padding: 100px 0;
}

.contant_secContent h4 {
  font-size: 56px;
  font-family: var(--f1);
  font-weight: 500;
  margin: 0 0 20px;
}

.contant_secContent p {
  width: 670px;
  margin: 0;
}

.main_projectImg {
  background: #edf3f8;
  text-align: center;
  padding: 70px 0;
  border-radius: 20px;
}

.main_projectImg img {
  width: 68%;
  height: auto;
  border-radius: 20px;
  box-shadow: 0 0 15px 1px #44444400;
}

.project_sec {
  padding: 40px 0;
}

.template_img {
  width: 70%;
  margin: 0 auto;
  border-radius: 20px;
  overflow: hidden;
  /* height: 970px; */
}

.template_crd {
  padding: 100px 0;
  background: #edf3f8;
  border-radius: 20px;
}

.templateSec {
  padding: 70px 0 140px;
}

.test_innerImg {
  width: 100%;
  height: 420px;
  border-radius: 20px;
  overflow: hidden;
}

.collen_innerImg {
  width: 80px;
}

.InnerTestCont > p {
  font-size: 19px;
  font-family: var(--f1);
  font-weight: 500;
  margin: 60px 0;
}

.test_innerDetail h6 {
  font-size: 16px;
  font-weight: 600;
  font-family: var(--f1);
  margin: 0;
}

.test_innerDetail p {
  margin: 0;
  font-size: 14px;
  font-family: var(--f1);
  color: #444;
}

.innerTestimonial {
  padding: 70px 0;
}

/* contact page css  */
.main_contact {
  background: var(--c3);
  padding: 100px 70px;
  border-radius: 20px;
}

.contact_content h3 {
  font-size: 54px;
  font-family: var(--f1);
  color: #fff;
}

.contact_content p {
  font-size: 16px;
  color: #fff;
  font-family: var(--f1);
  font-weight: 200;
  margin: 10px 0 0;
}
.sec_img .img__cover{
  object-fit: contain !important;
}
.sec_img{
  height: 100%;
}
.contact_bot {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin: 100px 0 0;
}

@media screen and (max-width: 832px){
  .mailbtn{
    font-size: 12px !important;
  }
}
.alex_btns a {
  font-size: 14px;
  display: block;
  text-align: center;
  margin: 10px;
  width: fit-content;
}

.alex_img {
  width: 200px;
  height: 200px;
  border-radius: 100%;
  overflow: hidden;
}

.cont_head {
  font-size: 26px;
  color: #fff;
  font-family: var(--f1);
  font-weight: 400;
  margin: 0 0 15px;
}

.input_feild :is(input, textarea) {
  width: 100%;
  padding: 10px;
  background: transparent;
  outline: none;
  border: 1px solid #fff;
  border-radius: 30px;
  font-size: 15px;
  color: #fff;
}

.input_feild label {
  font-size: 16px;
  font-family: var(--f1);
  font-weight: 500;
  color: #fff;
  margin: 0px 0 12px;
}

.input_feild {
  margin: 20px 0;
}

.input_feildBtn {
  margin: 10px 0 0;
}

.input_feild textarea {
  height: 140px;
  border-radius: 20px;
}

/* Style entire calendar wrapper */
.flatpickr-calendar.inline {
  border: none;
  box-shadow: none;
  width: auto;
}

/* All days light grey background */
.flatpickr-day {
  background-color: #f2f2f2;
  color: #333;
  border-radius: 4px;
}

/* Selected days darker color */
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.inRange {
  background-color: #4a64f62b !important;
  color: var(--c1) !important;
  border: none !important;
}

/* Style weekends lighter */
.flatpickr-day.weekend {
  background-color: #f6f6f6;
  color: #999 !important;
}

/* Spacing between days */
.flatpickr-day {
  margin: 2px;
}

@media screen and (max-width: 991px) {
  .main_datepicSec,
  .main_contact {
    padding: 100px 20px !important;
  }
  .fact_crd1{
    padding: 40px 20px !important;
  }
}
@media screen and (max-width: 500px) {
  .date_picContent h3 {
    font-size: 35px !important;
  }
  .single_img {
    height: 400px !important;
  }
  .single_head {
    font-size: 30px !important;
  }
  .section_contenth4.py-3 {
    font-size: 40px !important;
  }
  .contact_content h3 {
    font-size: 50px !important;
  }
  .alex_img {
    width: 50%;
    margin: 0 0 30px;
    height: 100%;
  }
  .alex_btns {
    margin-bottom: 30px;
  }
  .contact_bot {
    display: block;
  }
  .contact_bot {
    margin-top: 100px !important;
  }
  .containIMG {
    object-fit: contain;
  }
}
.single_top_div li {
  list-style: inside !important;
}
.blogTags li {
  list-style: none !important;
}

.Mobile {
  display: none;
}
.Desktop {
  display: block;
}

@media screen and (max-width: 768px) {
  .Mobile {
    display: block;
  }
  .Desktop {
    display: none;
  }
  .ErrorMainBanner {
    height: 30vh !important;
  }
  .ErrorMainBanner {
    min-height: 0 !important;
  }
}

.main_datepicSec {
  padding: 100px 70px;
  background: #edf3f8;
  border-radius: 20px;
  margin: 70px 0 0;
}

.user_innerImg {
  width: 60px;
  height: 60px;
  border-radius: 100%;
  overflow: hidden;
}

.meet_sec p {
  font-size: 14px;
  font-family: var(--f1);
  font-weight: 400;
  color: #444444bf;
  margin: 5px 0 0;
}

.meet_sec h5 {
  font-family: var(--f1);
  font-weight: 600;
  font-size: 26px;
  color: var(--c3);
}

.meet_timeList li {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 14px;
  color: #444444bf;
  margin: 7px 0;
}

.meet_timeList li i {
  font-size: 20px;
}

.main_calenderSection {
  background: #fff;
  padding: 0px 23px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 95%;
  margin: 0 auto;
  position: relative;
}

.meet_timeList {
  margin: 30px 0 0;
}

.meet_sec {
  padding-right: 50px;
  width: 50%;
}

.main_calenderSec {
  padding-left: 50px;
  border-left: 1px solid #44444429;
  width: 50%;
  padding-bottom: 60px;
  padding-top: 40px;
}

.cookies_btn {
  color: var(--c1);
  font-family: var(--f1);
  font-weight: 500;
  font-size: 14px;
  position: absolute;
  bottom: 15px;
  left: 26px;
}

.flatpickr-current-month .flatpickr-monthDropdown-months {
  background: transparent !important;
  font-size: 15px !important;
  width: 83px !important;
  font-family: var(--f1) !important;
  font-weight: 500 !important;
}

.flatpickr-current-month input.cur-year {
  font-size: 15px !important;
  font-family: var(--f1) !important;
  font-weight: 500 !important;
}

.flatpickr-current-month .flatpickr-monthDropdown-months:hover {
  color: var(--c1) !important;
}

.flatpickr-day {
  background: #f6f6f6 !important;
  font-family: var(--f1) !important;
  font-weight: 500 !important;
}

.flatpickr-weekdays {
  margin: 10px 0 0 !important;
}

.main_calenderSec h5 {
  font-family: var(--f1);
  font-weight: 600;
  font-size: 20px;
  color: var(--c3);
  margin: 0 0 30px;
}
.zone_feild label {
  font-family: var(--f1);
  font-size: 14px;
  font-weight: 700;
  color: #000;
}

.select_Time {
  display: flex;
  align-items: center;
  margin: 10px 0 0;
  gap: 5px;
}

.zone_feild {
  margin: 40px 0 0;
}

.select_Time i {
  font-size: 18px;
}

.select_Time select {
  width: 300px;
  font-size: 14px;
  font-family: var(--f1);
  font-weight: 500;
  background: transparent;
  border: none;
  outline: none;
}
.date_picContent h3 {
  font-family: var(--f1);
  font-size: 53px;
  font-weight: 500;
  color: #000;
}

.date_picContent p {
  margin: 20px 0 0;
  font-family: var(--f1);
  color: #444444d6;
}

/* Service  */

.service .partner--alt {
  border: 1px solid var(--c3);
}

.service .partner--alt p {
  color: var(--c3);
}

.service .momentum__title {
  color: var(--c3);
}

.service .momentum_innerContent p {
  color: var(--c3);
}

.service .themebtn--blk {
  background: var(--c3);
  color: var(--c2);
}

.service .themebtn--trans {
  color: var(--c3);
  box-shadow: 0 0 0 1px var(--c3);
}

.mainMomentum.service {
  background: #ebf3f7;
}

.service_items .recent_img {
  width: fit-content;
}

.service_page_para .section_content p {
  width: 72%;
  font-size: 24px;
}

.main_services.service {
  background: var(--c3);
}

.service {
}

.service .partner {
  border: 1px solid #0f151d;
  color: #0f151d !important;
}

.service .partner p {
  color: #0f151d !important;
}

.service .section_content h4 {
  color: var(--c2);
}

.service .section_content p {
  color: var(--c2);
}

.service .themebtn--light {
  background: var(--c2) !important;
  border: none;
}

.service .accordion-button {
  color: var(--c2) !important;
}

.service .accordion-body p {
  color: var(--c2);
}

.service .accordion-button::after {
  filter: brightness(0.5) invert(1);
}

.service .accordion-button:not(.collapsed)::after {
  filter: brightness(0) invert(1) !important;
}

.faqs {
  padding: 120px 0px 70px;
}

.package_card {
  background: #ebf3f7;
  width: 85%;
  margin: 0 auto;
  padding: 80px 50px;
  border-radius: 16px;
}

.package_card .momentum__title {
  color: var(--c3);
  font-size: 37px;
}

.package_card .momentum_innerContent p {
  color: var(--c3);
  width: 100%;
}

.momentum__inner h5 {
  font-size: 20px;
  margin: 16px 0px;
}

.momentum__inner p {
  font-size: 17px;
  font-family: var(--f1);
  margin: 0px 0px 30px;
}

.packages_point li {
  padding: 14px 0px 18px;
  border-bottom: 2px solid #c9d2d8;
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
  font-family: var(--f1);
  font-weight: 500;
  font-size: 14px;
}

.packages_point li i {
  font-size: 28px;
}

/* .packages {
  padding: 120px 0px 70px;
} */

.faqs .partner {
  display: flex;
  justify-content: center;
  margin: 0 auto;
  text-transform: uppercase;
}

.faqs h4 {
  font-family: var(--f1);
  text-transform: capitalize;
  margin-top: 25px;
  font-size: 42px;
}

.service_page_para {
  padding: 70px 0px;
}

.about_logos {
  line-height: 5.8;
}

.about_logos li {
  width: 200px;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
}

.about_logos li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section_contenth4.py-3 {
  width: 82%;
  font-size: 57px;
}

.single_top_div .blogTags {
  justify-content: center;
  display: flex;
}

.single_heading {
  font-size: 52px;
  font-family: var(--f1);
  color: #000;
  margin: 30px 0px;
  text-align: center;
}

.person_info {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 auto;
  width: fit-content;
}

.person_name {
  display: grid;
  justify-content: flex-start;
  align-items: center;
}

.person_img {
  width: 70px;
  height: 70px;
  overflow: hidden;
}

.person_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50px;
}

.person_name h4 {
  font-size: 18px;
  font-family: var(--f1);
  font-weight: 700;
  margin: 0;
}

.person_name p {
  font-family: var(--f1);
  font-size: 15px;
  font-weight: 400;
}

.single_img {
  width: 100%;
  height: 720px;
  border-radius: 15px;
  overflow: hidden;
  position: relative;
  margin: 30px 0px 70px;
}

.single_head {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 60px;
  width: 60%;
  text-align: center;
  font-family: var(--f1);
  font-weight: 600;
  background: linear-gradient(
          90deg,
          rgb(166 240 255) 0%,
          rgb(239 157 196) 100%
  );
  color: transparent;
  -webkit-background-clip: text;
}

.section_content > p {
  font-size: 21px;
  width: 70%;
  margin: 10px 0px 30px;
}

.single_top_div .section_content h4 {
  margin: 20px 0px;
  font-size: 24px;
  font-family: var(--f1);
  font-weight: 700;
}

.single_top_div .test_content p {
  color: var(--c3);
  font-size: 34px;
  width: 95%;
}

.single_top_div .user_name h4 {
  color: var(--c3);
}

.single_top_div .user_name p {
  color: var(--c3);
}

.single_top_div .collen_img {
  filter: invert(1) brightness(0);
}

.single_top_div .test_bottom {
  padding: 0px 0px 60px;
}


/* contactForm */
/* Toast styling (shared for both) */
#success-toast-desktop, #success-toast-mobile {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  background: #0f151d;
  color: #bff990;
  padding: 15px 25px;
  border-radius: 6px;
  font-size: 16px;
  font-weight: 200;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.5s ease-in-out;
  z-index: 9999;
  width: 90%;
  text-align: center;
}

@media screen and (min-width: 991px) {
  #success-toast-desktop {
    width: auto;
  }
}

#success-toast-desktop.show,
#success-toast-mobile.show {
  opacity: 1;
}

.real_hover:hover{
    opacity:0.7;
    transform: translateY(-5px);
    
}

          .hook-section {
      max-width: 1100px;
      margin: auto;
      padding: 80px 20px;
      text-align: center;
    }

    .hook-section h2 {
      font-size: 3rem;
      margin-bottom: 15px;
      color: #111;
    }

    .pain-points {
      margin: 40px 0;
      text-align: left;
      display: inline-block;
    }

    .pain-points li {
      font-size: 1.4rem;
      margin: 15px 0;
      list-style: none;
      position: relative;
      padding-left: 35px;
      opacity: 0;
      transform: translateX(-50px);
      transition: all 0.6s ease;
    }

    .pain-points li::before {
      content: "*";
      position: absolute;
      left: 0;
      top: 0;
      font-size: 1.4rem;
      color: #000000;
    }

    .pain-points li.show {
      opacity: 1;
      transform: translateX(0);
    }

    .solution {
      background: #fff;
      padding: 40px;
      border-radius: 15px;
      box-shadow: 0 10px 25px rgba(0,0,0,0.08);
      margin-top: 40px;
      opacity: 0;
      transform: translateY(50px);
      transition: all 0.7s ease;
    }

    .solution.show {
      opacity: 1;
      transform: translateY(0);
    }

    .solution h3 {
      font-size: 2.6rem;
      margin-bottom: 15px;
      color: #0077ff;
    }

    .solution p {
      font-size: 1.4rem;
      color: #555;
      margin-bottom: 20px;
      line-height: 1.6;
    }

    .cta-btn {
      display: inline-block;
      background: #0077ff;
      color: #fff;
      padding: 14px 28px;
      border-radius: 50px;
      font-size: 1.1rem;
      text-decoration: none;
      transition: background 0.3s ease;
    }

    .cta-btn:hover {
      background: #005ad3;
    }
    
    
    
    .thankyou-hero {
    position: relative;
    min-height: 70vh;
    display: grid;
    place-items: center;
    padding: 4rem 1.25rem;
    background: #ffffff;
    overflow: hidden;
  }

  .thankyou-hero__inner {
    width: 100%;
    max-width: 900px;
    text-align: center;
  }

  .thankyou-hero__title {
    font-size: clamp(2rem, 3.5vw + 1rem, 4rem);
    line-height: 1.2;
    margin: 0;
    font-weight: 800;
    color: #0f172a;
  }

  .thankyou-hero__title span {
    display: block;
    margin-top: 0.5em;
    font-weight: 700;
    background: linear-gradient(90deg, #7c3aed, #06b6d4);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  /* Decorative gradient blobs */
  .ty-decor {
    position: absolute;
    width: clamp(200px, 25vw, 350px);
    aspect-ratio: 1/1;
    border-radius: 50%;
    filter: blur(70px);
    opacity: 0.25;
    pointer-events: none;
  }
  .ty-decor--1 {
    top: -6rem;
    left: -6rem;
    background: radial-gradient(circle, #7c3aed, transparent 70%);
  }
  .ty-decor--2 {
    bottom: -6rem;
    right: -6rem;
    background: radial-gradient(circle, #06b6d4, transparent 70%);
  }