@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');


@keyframes bannerAnimationTwo {
  0% {
    transform: translate(0px, 0px);
  }

  20% {
    transform: translate(20px, -5px);
  }

  40% {
    transform: translate(50px, 20px);
  }

  60% {
    transform: translate(20px, 50px);
  }

  80% {
    transform: translate(-20px, 30px);
  }

  100% {
    transform: translate(0px, 0px);
  }
}

.back-to-top-wrapper,
a,
button,
p,
input,
select,
textarea,
li,
.transition-3 {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.tp-product-details-views>span svg,
.tp-btn-white-border span {
  -webkit-transform: translateY(-1px);
  -moz-transform: translateY(-1px);
  -ms-transform: translateY(-1px);
  -o-transform: translateY(-1px);
  transform: translateY(-1px);
}

.tp-product-details-action-sm-btn svg,
.tp-product-details-wishlist-btn svg,
.tp-perspective-social-info span svg,
.tp-team-details-info-contact a svg,
.app-testimonial-review-content span svg,
.pp-service-2-banner-text p span,
.pp-service-2-banner-text a span,
.tp-service-4-solution-item-btn a span,
.pp-service-details-process-bottom span a svg,
.st-hero-btn-icon,
.pp-footer-btn span,
.postbox__comment-reply a span,
.tp-header-10-announcement-content a span,
.breadcrumb__list span:not(:last-child)::after,
.tp-btn-border-2.st span,
.tp-portfolio-details-btn span {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
}






:root {


  --tp-ff-body: 'Work Sans', sans-serif;
  --tp-ff-inter: 'Plus Jakarta Sans';
  --tp-ff-fontawesome: "Font Awesome 6 Pro";
  --tp-common-primary: #2a6d64;

  --tp-common-secondary: #8df2c4;
  --tp-common-white: #ffffff;
  --tp-common-black: #141414;
  --tp-common-black-2: #232323;
  --tp-common-black-3: #000;
  --tp-common-black-4: #0a0a0a;
  --tp-common-black-5: #121212;
  --tp-common-black-6: #212121;
  --tp-common-black-7: #0E0F11;
  --tp-common-black-8: #1a1b1e;
  --tp-common-black-9: #16302f;
  --tp-common-black-10: #21212D;
  --tp-common-cream: #f9f4e8;
  --tp-common-cream-2: #FFF6BF;
  --tp-common-cream-3: #ffffe6;
  --tp-common-yellow: #f2ffec;
  --tp-common-yellow-1: #FFF669;
  --tp-common-yellow-green: #8df2c4;
  --tp-common-green-light: #8df2c4;
  --tp-common-green-regular: #8df2c4;
  --tp-common-green-solid: #17312F;
  --tp-common-pink-light: #FDE1DA;
  --tp-common-paste: #43D4A0;
  --tp-common-paste-2: #2a6d64;

  --tp-common-red: #2a6d64;
  --tp-common-red-2: #2b6d65;

  --tp-common-blue: #2a6d64;

  --tp-grey-1: #f8f8f8;
  --tp-grey-2: #f1f1f1;
  --tp-grey-3: #F8F8FB;
  --tp-grey-4: #F6F8EF;
  --tp-common-secondary: #8df2c4;

  --tp-cream-1: #B7AB98;
  --tp-cream-2: #CFC292;
  --tp-text-body: #2e2d2d;
  --tp-theme-green: #A0FF27;


  --tp-border-1: #EAEBED;
  --tp-border-2: #e7e7e7;

  --tp-dark-blue: #001936;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

@media (min-width: 1400px) {

  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 1510px;
  }

  .container-1830 {
    max-width: 1830px;
  }

  .container-1800 {
    max-width: 1800px;
  }

  .container-1750 {
    max-width: 1750px;
  }

  .container-1730 {
    max-width: 1730px;
  }

  .container-1680 {
    max-width: 1680px;
  }

  .container-1630 {
    max-width: 1630px;
  }

  .container-1580 {
    max-width: 1580px;
  }

  .container-1550 {
    max-width: 1550px;
  }

  .container-1460 {
    max-width: 1460px;
  }

  .container-1430 {
    max-width: 1430px;
  }

  .container-1350 {
    max-width: 1350px;
  }

  .container-1330 {
    max-width: 1330px;
  }

  .container-1320 {
    max-width: 1320px;
  }

  .container-1300 {
    max-width: 1300px;
  }

  .container-1230 {
    max-width: 1230px;
  }

  .container-1200 {
    max-width: 1200px;
  }

  .container-1030 {
    max-width: 1030px;
  }
}

/*---------------------------------
	typography css start 
---------------------------------*/
body {
  font-size: 14px;
  line-height: 26px;
  font-weight: normal;
  color: var(--tp-text-body);
  font-family: var(--tp-ff-body);
}

img {
  max-width: 100%;
}

a {
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0px;
  font-weight: 600 !important;
  line-height: 1.2;
  -webkit-transition: color 0.3s ease-in-out;
  -moz-transition: color 0.3s ease-in-out;
  -ms-transition: color 0.3s ease-in-out;
  -o-transition: color 0.3s ease-in-out;
  transition: color 0.3s ease-in-out;
  color: var(--tp-common-black);
  /* font-family: 'Instrument Sans', sans-serif; */

  font-family: "Plus Jakarta Sans";

  /* */
  /* font-family: var(--tp-ff-heading); */
}

h1 {
  font-size: 40px;
}

h2 {
  font-size: 36px;
}

h3 {
  font-size: 28px;
}

h4 {
  font-size: 24px;
}

h5 {
  font-size: 20px;
}

h6 {
  font-size: 16px;
}

ul {
  margin: 0px;
  padding: 0px;
}

p {
  font-weight: 400;
  font-size: 18px;
  line-height: 1.56;
  margin-bottom: 15px;
  letter-spacing: -0.02em;
  /* font-family: var(--tp-ff-interoppins); */
  color: var(--tp-text-body);

  font-family: "Work Sans", sans-serif;
}

a:not([href]):not([class]),
a:not([href]):not([class]):hover {
  color: inherit;
  text-decoration: none;
}

a:focus,
.button:focus {
  text-decoration: none;
  outline: none;
}

a:focus,
a:hover {
  color: inherit;
  text-decoration: none;
}

a,
button {
  color: inherit;
  outline: none;
  border: none;
  background: transparent;
}

button:hover {
  cursor: pointer;
}

button:focus {
  outline: 0;
}

.uppercase {}

.capitalize {}

input[type=text],
input[type=email],
input[type=tel],
input[type=number],
input[type=password],
input[type=url],
textarea {
  outline: none;
  height: 60px;
  width: 100%;
  line-height: 60px;
  font-size: 16px;
  padding-left: 26px;
  padding-right: 26px;
  border-radius: 8px;
  background: rgb(246, 246, 249);
  color: var(--tp-common-black);
  border: 1px solid rgb(246, 246, 249);
}

input[type=text]::-webkit-input-placeholder,
input[type=email]::-webkit-input-placeholder,
input[type=tel]::-webkit-input-placeholder,
input[type=number]::-webkit-input-placeholder,
input[type=password]::-webkit-input-placeholder,
input[type=url]::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: var(--tp-common-black);
}

input[type=text]::-moz-placeholder,
input[type=email]::-moz-placeholder,
input[type=tel]::-moz-placeholder,
input[type=number]::-moz-placeholder,
input[type=password]::-moz-placeholder,
input[type=url]::-moz-placeholder,
textarea::-moz-placeholder {
  /* Firefox 19+ */
  color: var(--tp-common-black);
}

input[type=text]:-moz-placeholder,
input[type=email]:-moz-placeholder,
input[type=tel]:-moz-placeholder,
input[type=number]:-moz-placeholder,
input[type=password]:-moz-placeholder,
input[type=url]:-moz-placeholder,
textarea:-moz-placeholder {
  /* Firefox 4-18 */
  color: var(--tp-common-black);
}

input[type=text]:-ms-input-placeholder,
input[type=email]:-ms-input-placeholder,
input[type=tel]:-ms-input-placeholder,
input[type=number]:-ms-input-placeholder,
input[type=password]:-ms-input-placeholder,
input[type=url]:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  /* IE 10+  Edge*/
  color: var(--tp-common-black);
}

input[type=text]::placeholder,
input[type=email]::placeholder,
input[type=tel]::placeholder,
input[type=number]::placeholder,
input[type=password]::placeholder,
input[type=url]::placeholder,
textarea::placeholder {
  /* MODERN BROWSER */
  color: var(--tp-common-black);
}

input[type=text]:focus,
input[type=email]:focus,
input[type=tel]:focus,
input[type=number]:focus,
input[type=password]:focus,
input[type=url]:focus,
textarea:focus {
  border-color: var(--tp-common-black);
}

input[type=text]:focus::placeholder,
input[type=email]:focus::placeholder,
input[type=tel]:focus::placeholder,
input[type=number]:focus::placeholder,
input[type=password]:focus::placeholder,
input[type=url]:focus::placeholder,
textarea:focus::placeholder {
  opacity: 0;
}

textarea {
  line-height: 1.4;
  padding-top: 17px;
  padding-bottom: 17px;
}

input[type=color] {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  background: none;
  border: 0;
  cursor: pointer;
  height: 100%;
  width: 100%;
  padding: 0;
  border-radius: 50%;
}

*::-moz-selection {
  background: var(--tp-common-black);
  color: var(--tp-common-white);
  text-shadow: none;
}

::-moz-selection {
  background: var(--tp-common-black);
  color: var(--tp-common-white);
  text-shadow: none;
}

::selection {
  background: var(--tp-common-black);
  color: var(--tp-common-white);
  text-shadow: none;
}

*::-moz-placeholder {
  color: var(--tp-common-black);
  font-size: 14px;
  opacity: 1;
}

*::placeholder {
  color: var(--tp-common-black);
  font-size: 14px;
  opacity: 1;
}

.tp-line-black {
  display: inline;
  transition: all 0.3s linear;
  background-repeat: no-repeat;
  background-size: 0% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-image: linear-gradient(currentcolor, currentcolor), linear-gradient(currentcolor, currentcolor);
}

.tp-line-black:hover {
  background-size: 0% 1px, 100% 1px;
}

.tp-line-white {
  display: inline;
  transition: all 0.3s linear;
  background-repeat: no-repeat;
  background-size: 0% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-image: linear-gradient(currentcolor, currentcolor), linear-gradient(currentcolor, currentcolor);
}

.tp-line-white.green {
  background-position: 100% 100%, 0 75%;
  background-image: linear-gradient(currentcolor, currentcolor), linear-gradient(currentcolor, currentcolor);
}

.tp-line-white.cream {
  background-position: 100% 100%, 0 75%;
  background-image: linear-gradient(currentcolor, currentcolor), linear-gradient(currentcolor, currentcolor);
}

.tp-line-white.cream-2 {
  background-image: linear-gradient(currentcolor, currentcolor), linear-gradient(currentcolor, currentcolor);
}

.tp-line-white:hover {
  background-size: 0% 1px, 100% 1px;
}

.body-padding {
  padding: 0 20px;
}

@media (max-width: 767px) {
  .body-padding {
    padding: 0;
  }
}

.tp_img_reveal {
  visibility: hidden;
  overflow: hidden;
}

/*---------------------------------
    1.2 Common Classes
---------------------------------*/
.w-img img {
  width: 100%;
}

.m-img img {
  max-width: 100%;
}

.fix {
  overflow: hidden;
}

.clear {
  clear: both;
}

.z-index-1 {
  position: relative;
  z-index: 1;
}

.z-index-2 {
  position: relative;
  z-index: 2;
}

.z-index-3 {
  position: relative;
  z-index: 3;
}

.z-index-4 {
  position: relative;
  z-index: 4;
}

.z-index-5 {
  position: relative;
  z-index: 5;
}

.z-index-6 {
  position: relative;
  z-index: 6;
}

.z-index-7 {
  position: relative;
  z-index: 7;
}

.z-index-8 {
  position: relative;
  z-index: 8;
}

.z-index-9 {
  position: relative;
  z-index: 9;
}

.z-index-10 {
  position: relative;
  z-index: 10;
}

.gx-7 {
  --bs-gutter-x: 7px;
}

.gx-10 {
  --bs-gutter-x: 10px;
}

.gx-12 {
  --bs-gutter-x: 12px;
}

.gx-15 {
  --bs-gutter-x: 15px;
}

.gx-20 {
  --bs-gutter-x: 20px;
}

.gx-24 {
  --bs-gutter-x: 24px;
}

.gx-30 {
  --bs-gutter-x: 30px;
}

.gx-40 {
  --bs-gutter-x: 40px;
}

.gx-45 {
  --bs-gutter-x: 45px;
}

.gx-50 {
  --bs-gutter-x: 50px;
}

.gx-55 {
  --bs-gutter-x: 55px;
}

.gx-60 {
  --bs-gutter-x: 60px;
}

.gx-70 {
  --bs-gutter-x: 70px;
}

.gx-80 {
  --bs-gutter-x: 80px;
}

.gx-90 {
  --bs-gutter-x: 90px;
}

.gx-100 {
  --bs-gutter-x: 100px;
}

.gx-135 {
  --bs-gutter-x: 135px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .gx-135 {
    --bs-gutter-x: 30px;
  }
}

.overflow-y-visible {
  overflow-x: hidden;
  overflow-y: visible;
}

.text-capitalize {}

.text-uppercase {}

.p-relative {
  position: relative;
}

.p-absolute {
  position: absolute;
}

.include-bg {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

/* hero banner backgrounds */
.hero-banner {
  position: relative;
  padding-top: 70px;
  height: 70vh;
  display: flex;
  align-items: center;
  justify-content: center;

}

@media (max-width: 576px) {
  .hero-banner {

    height: 440px;


  }
}

/* Ensure hero titles are visible on all hero backgrounds */
.hero-banner .tp-hero-2-title {
  color: #ffffff;
  margin-bottom: 0 !important;
}

/* scroll indicator inside hero */
.hero-scroll-indicator {
  margin: -46px auto 24px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  position: absolute;
  left: 96%;
  transform: translate(-50%, -50%);
  z-index: 11;


}

@media (max-width: 767px) {
  .hero-scroll-indicator {
    left: 90%;
  }
}

.hero-scroll-indicator__wheel {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 1.5px solid rgba(255, 255, 255, 0.9);
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.25);
  animation: heroScrollPulse 1.8s ease-out infinite;
}

.hero-scroll-indicator__wheel::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  transform: translate(-50%, -50%);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px 20px;
  /* SVG arrow icon provided */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23b0aeae' d='M13 6a1 1 0 1 0-2 0v9.586l-2.293-2.293a1 1 0 0 0-1.414 1.414l4 4a1 1 0 0 0 1.414 0l4-4a1 1 0 0 0-1.414-1.414L13 15.586z'/%3E%3C/svg%3E");
}

.hero-scroll-indicator__text {
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 1);
}

@keyframes heroScrollBounce {

  0%,
  100% {
    transform: translate(-50%, 0);
  }

  50% {
    transform: translate(-50%, -5px);
  }
}

@keyframes heroScrollPulse {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.25);
    opacity: 1;
  }

  60% {
    transform: scale(1.08);
    box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
    opacity: 1;
  }

  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    opacity: 0.8;
  }
}

/* @media (max-width: 576px) {
  .hero-banner {
    padding-top: 75px;

  }

} */

.hero-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgb(0 10 40 / 60%) 0%, rgb(0 10 40 / 52%) 100%);
  z-index: 1;
}

.hero-banner .container {
  position: relative;
  z-index: 2;
}

/* page-specific hero background images (update paths/files as needed) */
/* .hero-about {
  background-image: url("../images/about-img2.jpg");
} */

.what-we-do {
  background-image: url("../images/what-we-do2.webp");

}

.resources-bg {
  background-image: url("../images/blogs3.webp");
}

.hero-about-us {
  background-image: url("../images/about-us2.webp");
}



.hero-contact-us {

  background-image: url("../images/contact-us2.webp");


}

.hero-industries {
  background-image: url("../images/industires-bg.avif");
}

/* .hero-contact {
  background-image: url("../images/who-we-serve-img3.jpg");
} */

.hero-compliance {
  background-image: url("../images/who-we-serve-img4.avif");
}




.coffe-bg {
  background-color: var(--tp-common-secondary);
}

.counter-row {
  counter-reset: count;
}

/*----------------------------------------*/
/*  2.1 Back to top
/*----------------------------------------*/
.back-to-top-wrapper {
  position: fixed;
  right: 50px;
  bottom: 0;
  height: 44px;
  width: 44px;
  cursor: pointer;
  display: block;
  border-radius: 50%;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
}

@media (max-width: 767px) {
  .back-to-top-wrapper {
    right: 20px;
    bottom: 20px;
  }
}

.back-to-top-wrapper.back-to-top-btn-show {
  visibility: visible;
  opacity: 1;
  bottom: 50px;
}

.back-to-top-btn {
  display: inline-block;
  width: 44px;
  height: 44px;
  line-height: 44px;
  text-align: center;
  border-radius: 50%;
  color: var(--tp-common-black);
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  background: var(--tp-common-white);
  box-shadow: 0px 8px 16px rgba(3, 4, 28, 0.3);
}

.back-to-top-btn svg {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
}

.back-to-top-btn:hover {
  -webkit-transform: translateY(-4px);
  -moz-transform: translateY(-4px);
  -ms-transform: translateY(-4px);
  -o-transform: translateY(-4px);
  transform: translateY(-4px);
}

/*----------------------------------------*/
/*  2.2 Buttons
/*----------------------------------------*/
.tp-btn-black {
  position: relative;
  display: inline-block;
}

.tp-btn-black-text {
  font-size: 16px;
  font-weight: 500;
  padding: 7px 22px;
  border-radius: 9999px;
  color: var(--tp-common-white);
  background-color: var(--tp-common-black);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-btn-black-text {
    font-size: 14px;
    padding: 7px 17px;
  }
}

@media (max-width: 767px) {
  .tp-btn-black-text {
    font-size: 15px;
    padding: 7px 13px;
  }
}

.tp-btn-black-filter-blur {
  position: absolute;
  top: 0;
  left: 0;
}

.tp-btn-black-circle {
  width: 36px;
  height: 36px;
  line-height: 32px;
  margin-left: -4px;
  text-align: center;
  border-radius: 9999px;
  transition-duration: 0.9s;
  background: var(--tp-common-black);
  transition-timing-function: cubic-bezier(0.135, 0.9, 0.15, 1);
}

.tp-btn-black-circle>svg {
  width: 14px;
  margin-left: 3px;
  color: var(--tp-common-white);
  transform: translateX(-2px);
}

.tp-btn-black:hover .tp-btn-black-circle {
  transform: translateX(12px) rotate(45deg);
}


.tp-btn-black.btn-red-bg .tp-btn-black-text {
  color: var(--tp-common-black);
  background-color: var(--tp-common-secondary);
}

.tp-btn-black.btn-red-bg .tp-btn-black-circle {
  background: var(--tp-common-secondary);
}

.tp-btn-black.btn-red-bg .tp-btn-black-circle svg {
  color: var(--tp-common-black);
}

.tp-btn-black.btn-red-bg:hover .tp-btn-black-circle {
  transform: translateX(12px) rotate(45deg);
}



/* Card main container */
.tp-blog-masonry-item {
  display: flex;
  flex-direction: column;
  height: 100%;

  border-radius: 12px;
  overflow: hidden;
  padding-bottom: 20px;

}

/* Image wrapper */
.tp-blog-masonry-thumb {
  flex-shrink: 0;

}

.tp-blog-masonry-thumb img {
  width: 100%;
  height: auto;
  display: block;
}

/* Content wrapper jisme text aur button hai */
.tp-blog-masonry-content {
  display: flex;
  flex-direction: column;
  flex-grow: 1;

  padding: 20px;

}

/* Button wrapper */
.tp-blog-masonry-btn {
  margin-top: auto;
  /* Ye button ko dhaka de kar hamesha bilkul bottom par le jayega */
  padding-top: 15px;
  /* border: 2px solid blue; Testing ke liye */
}

/* Text adjustments */
.tp-blog-masonry-title {
  margin-bottom: 15px;
  font-size: 1.25rem;
}

.tp-blog-masonry-content p {
  margin-bottom: 20px;
}

.tp-btn-black.btn-green-light-bg .tp-btn-black-text {
  color: var(--tp-common-black);
  background-color: var(--tp-common-green-light);
}

.tp-btn-black.btn-green-light-bg .tp-btn-black-circle {
  background-color: var(--tp-common-green-light);
}

.tp-btn-black.btn-green-light-bg .tp-btn-black-circle svg {
  color: var(--tp-common-black);
}

.tp-btn-black.btn-transparent-bg .tp-btn-black-text {
  color: var(--tp-common-white);
  background-color: #26282C;
}

.tp-btn-black.btn-transparent-bg .tp-btn-black-circle {
  background-color: #26282C;
}

.tp-btn-black.btn-transparent-bg .tp-btn-black-circle svg {
  color: var(--tp-common-white);
}





.tp-btn-black-radius {
  font-size: 16px;
  font-weight: 600;
  padding: 4px 22px;
  padding-right: 4px;
  border-radius: 38px;
  display: inline-block;
  letter-spacing: -0.01em;
  color: var(--tp-common-white);
  background-color: var(--tp-common-primary);
  gap: 10px;
}

.tp-btn-black-radius span {
  position: relative;
  z-index: 1;
  overflow: hidden;
  display: inline-block;
}

.tp-btn-black-radius span span.text-1 {
  position: relative;
  display: block;
  transition: 0.3s;
  transform: translateY(-1px);
}

.tp-btn-black-radius span span.text-2 {
  position: absolute;
  top: 100%;
  display: block;
  transition: 0.3s;
  transform: translateY(-1px);
}

.tp-btn-black-radius i {
  height: 38px;
  width: 38px;
  line-height: 38px;
  border-radius: 50%;
  margin-left: 2px;
  text-align: center;
  display: inline-block;
  background-color: var(--tp-common-white);
}

.tp-btn-black-radius i span {
  position: relative;
  overflow: hidden;
  width: 14px;
  height: 14px;
  display: inline-flex;
}

.tp-btn-black-radius i svg {
  transform: translateY(-2px);
  position: absolute;
  bottom: -1px;
  left: 1px;
  transition: all 0.2s ease-out;
}

.tp-btn-black-radius i svg:last-child {
  left: -12px;
  bottom: -12px;
  transform: translate(0, 0);
  opacity: 0;
}

.tp-btn-black-radius:hover {
  color: var(--tp-common-white);
}

.tp-btn-black-radius:hover span span.text-1 {
  -webkit-transform: translateY(-150%);
  transform: translateY(-150%);
}

.tp-btn-black-radius:hover span span.text-2 {
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.tp-btn-black-radius:hover i svg:first-child {
  transform: translate(16px, -16px);
}

.tp-btn-black-radius:hover i svg:last-child {
  opacity: 1;
  visibility: visible;
  transform: translate(13px, -13px);
}

.tp-btn-black-radius:focus {
  color: var(--tp-common-white);
}


.tp-btn-black-radius.btn-blur {
  backdrop-filter: blur(20px);
  background: rgba(255, 255, 255, 0.1);
  border: 1.5px solid rgba(255, 255, 255, 0.3);
}



.tp-btn-border:hover {
  color: var(--tp-common-black);
  border-color: var(--tp-common-cream);
  background-color: var(--tp-common-cream);
}











.tp-btn-gradient {
  display: flex;
  position: relative;
  align-items: center;
  overflow: hidden;
  font-weight: 600;
  font-size: 17px;
  line-height: 1;
  z-index: 1;
  margin: 1px;
  transition: 0.4s;
  border-radius: 14px;
  padding: 22px 30px;
  padding-top: 25px;
  display: inline-block;
  letter-spacing: -0.01em;
  color: var(--tp-common-white);
  background: linear-gradient(230deg, #FF994B 6.7%, #D34BE9 48.83%, #3188FF 90.96%);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-btn-gradient {
    font-size: 16px;
    padding: 15px 25px;
    padding-top: 18px;
  }
}

.tp-btn-gradient:hover {
  color: var(--tp-common-white);
}

.tp-btn-gradient:focus {
  color: var(--tp-common-white);
}

.tp-btn-gradient span {
  margin-right: 10px;
  display: inline-block;
}

.tp-btn-gradient span svg {
  transform: translateY(-2px);
}

.tp-btn-gradient.sm {
  padding-top: 0;
  padding: 13px 24px;
  position: relative;
}

.tp-btn-black-border {
  margin: 1px;
  display: flex;
  align-items: center;
  font-weight: 600;
  font-size: 17px;
  line-height: 1;
  border-radius: 14px;
  padding: 12px 24px;
  display: inline-block;
  letter-spacing: -0.01em;
  backdrop-filter: blur(10px);
  color: var(--tp-common-white);
  background: rgb(41, 38, 54);
  border: 1px solid rgba(255, 246, 191, 0.1);
}

.tp-btn-black-border:hover {
  color: var(--tp-common-white);
}

.tp-btn-black-border:focus {
  color: var(--tp-common-white);
}

.tp-btn-black-border span {
  margin-right: 10px;
  display: inline-block;
}

.tp-btn-black-border span svg {
  transform: translateY(-2px);
}

.tp-btn-red-circle-box {
  display: inline-flex;
  width: -moz-fit-content;
  width: fit-content;
}

.tp-btn-red-circle-box>*:nth-child(1) {
  transform: scale3d(0.5, 0.5, 1);
  margin-inline-end: -55px;
}

.tp-btn-red-circle-box>*:nth-child(2) {
  transform: scale3d(1, 1, 1);
}

.tp-btn-red-circle-box>*:nth-child(3) {
  transform: scale3d(1, 1, 1);
  margin-inline-start: 0;
}

.tp-btn-red-circle-box:hover>*:nth-child(1) {
  transform: scale3d(1, 1, 1);
  margin-inline-end: 0;
  color: var(--tp-common-white);
  background-color: var(--tp-common-red-2);
}

.tp-btn-red-circle-box:hover>*:nth-child(2) {
  position: relative;
  z-index: 1;
  transform: scale3d(1, 1, 1);
}

.tp-btn-red-circle-box:hover>*:nth-child(3) {
  transform: scale3d(0.5, 0.5, 1);
  margin-inline-start: -55px;
}






.tp-btn-red-circle-icon {
  height: 54px;
  width: 54px;
  line-height: 50px;
  border-radius: 50%;
  text-align: center;
  display: inline-block;
  color: var(--tp-common-red-2);
  border: 1px solid var(--tp-common-red-2);
}



.tp-btn-white-border {
  font-size: 15px;
  font-weight: 500;
  color: #0E0F11;
  display: inline-block;
  border-radius: 40px;
  padding: 6px 20px 6px;
  backdrop-filter: blur(10px);
  letter-spacing: -0.15px;
  background-color: var(--tp-common-white);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.tp-btn-white-border.coffee-bg {
  padding: 7px 30px;
  background-color: #4d3d30;

  color: var(--tp-common-white);
}

.tp-btn-white-border.coffee-bg:hover {
  color: #4d3d30;
  border-color: #4d3d30;
  background-color: transparent;
}

.tp-btn-white-border.coffee-bg.border-none {
  color: #4d3d30;
  border-color: #4d3d30;
  background-color: transparent;
}

.tp-btn-white-border.coffee-bg.border-none:hover {
  border-color: #4d3d30;
  color: var(--tp-common-white);
  background-color: var(--tp-common-black);
}

.tp-btn-white-border:hover {
  color: var(--tp-common-white);
  background-color: transparent;
  border-color: var(--tp-common-white);
}

.tp-btn-white-border span {
  margin-left: 4px;
  display: inline-block;
}

.tp-btn-white-border.tp-btn-transparent {
  color: var(--tp-common-white);
  background-color: transparent;
  border-color: rgba(255, 255, 255, 0.2);
}

.tp-btn-white-border.tp-btn-transparent:hover {
  color: var(--tp-common-black);
  background-color: var(--tp-common-white);
}



.tp-btn-cream-bdr {
  height: 50px;
  line-height: 50px;
  padding: 0 25px;
  font-size: 14px;
  font-weight: 500;
  display: inline-block;

  color: var(--tp-cream-2);
  font-family: var(--tp-ff-interoppins);
  border: 1px solid var(--tp-cream-2);
  transition: 0.3s;
}

.tp-btn-cream-bdr:hover {
  background-color: var(--tp-cream-2);
  color: var(--tp-common-secondary);
}

/* Glow Border Animation */
.animated-border-box {
  position: relative;
  overflow: hidden;
  z-index: 0;
  line-height: 0;
  border-radius: 14px;
  display: inline-block;
  transition: 0.4s;
}

.animated-border-box:hover {
  transform: scale(1.1);
}

.animated-border-box:before {
  content: "";
  z-index: -2;
  text-align: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(0deg);
  position: absolute;
  width: 99999px;
  height: 99999px;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-image: conic-gradient(rgba(0, 0, 0, 0), #FFF, rgba(0, 0, 0, 0) 25%);
  animation: rotate 4s linear infinite;
}

.animated-border-box.radius-style-2 {
  border-radius: 100px;
}

.animated-border-box.radius-style-2 .tp-btn-gradient.sm {
  border-radius: 100px;
}

.animated-border-box.radius-style-2::before {
  background-image: conic-gradient(rgba(0, 0, 0, 0), #21212D, rgba(0, 0, 0, 0) 25%);
}

.animated-border-box.border-icon .tp-btn-gradient span {
  padding-right: 10px;
  border-right: 1px solid rgba(255, 255, 255, 0.3);
}

.animated-border-box.border-icon::before {
  background-image: conic-gradient(rgba(0, 0, 0, 0), #21212D, rgba(0, 0, 0, 0) 25%);
}

.tp-action-btn {
  font-size: 15px;
  font-weight: 600;
  color: #4D3D30;
  width: 100%;
  padding: 11px 50px;
  background: #F4F0EA;
  display: inline-block;

  backdrop-filter: blur(10px);
  border: 1px solid rgba(77, 61, 48, 0.1);
  transform: translateY(100%);
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.tp-action-btn:hover {
  color: var(--tp-common-white);
  background-color: #4D3D30;
}

.tp-quick-view-btn {
  height: 40px;
  width: 40px;
  display: grid;
  color: #4d3d30;
  text-align: center;
  place-content: center;
  background-color: #F4F0EA;
  transform: translateX(100%);
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.tp-quick-view-btn:hover {
  color: var(--tp-common-white);
  background-color: #4D3D30;
}



/*----------------------------------------*/
/*  2.3 Animations
/*----------------------------------------*/
@keyframes rotate2 {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

@keyframes animationglob {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}

@keyframes lqdItiImgOut {
  0% {
    transform: translateY(0) scale(1);
  }

  to {
    transform: translateY(100%) scale(1.15);
  }
}

@keyframes hero-circle-2 {
  0% {
    -webkit-transform: translateX(1000px);
    -moz-transform: translateX(1000px);
    -ms-transform: translateX(1000px);
    -o-transform: translateX(1000px);
    transform: translateX(1000px);
  }

  100% {
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -ms-transform: translateX(0px);
    -o-transform: translateX(0px);
    transform: translateX(0px);
  }
}

@keyframes hero-circle-3 {
  0% {
    -webkit-transform: translateX(500px);
    -moz-transform: translateX(500px);
    -ms-transform: translateX(500px);
    -o-transform: translateX(500px);
    transform: translateX(500px);
  }

  100% {
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -ms-transform: translateX(0px);
    -o-transform: translateX(0px);
    transform: translateX(0px);
  }
}

@keyframes move1 {
  0% {
    bottom: -300px;
    left: -300px;
  }

  30% {
    bottom: 100px;
    left: 300px;
  }

  60% {
    bottom: 200px;
    left: 600px;
  }

  100% {
    bottom: -300px;
    left: 1200px;
  }
}

@keyframes move1-reverse {
  0% {
    bottom: -150px;
    left: 1400px;
  }

  40% {
    bottom: 50px;
    left: 600px;
  }

  70% {
    bottom: 200px;
    left: 300px;
  }

  100% {
    bottom: -150px;
    left: -150px;
  }
}

@keyframes animate-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.2), 0 0 0 0 rgba(255, 255, 255, 0.2);
  }

  40% {
    box-shadow: 0 0 0 50px rgba(255, 109, 74, 0), 0 0 0 0 rgba(255, 255, 255, 0.2);
  }

  80% {
    box-shadow: 0 0 0 50px rgba(255, 109, 74, 0), 0 0 0 30px rgba(255, 109, 74, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(255, 109, 74, 0), 0 0 0 30px rgba(255, 109, 74, 0);
  }
}

@keyframes animate-pulse-2 {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 246, 105, 0.1), 0 0 0 0 rgba(255, 246, 105, 0.1);
  }

  40% {
    box-shadow: 0 0 0 50px rgba(255, 109, 74, 0), 0 0 0 0 rgba(255, 246, 105, 0.1);
  }

  80% {
    box-shadow: 0 0 0 50px rgba(255, 109, 74, 0), 0 0 0 30px rgba(255, 109, 74, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(255, 109, 74, 0), 0 0 0 30px rgba(255, 109, 74, 0);
  }
}

@keyframes rotate {
  100% {
    transform: translate(-50%, -50%) rotate(1turn);
  }
}

@keyframes marquee-horizontal {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-100%);
  }
}

@-webkit-keyframes video-border {
  0% {
    transform: translate(-50%, -50%) scale(1);
  }

  60% {
    opacity: 1;
  }

  100% {
    transform: translate(-50%, -50%) scale(2);
    opacity: 0;
  }
}

@-moz-keyframes video-border {
  0% {
    transform: translate(-50%, -50%) scale(1);
  }

  60% {
    opacity: 1;
  }

  100% {
    transform: translate(-50%, -50%) scale(2);
    opacity: 0;
  }
}

@-ms-keyframes video-border {
  0% {
    transform: translate(-50%, -50%) scale(1);
  }

  60% {
    opacity: 1;
  }

  100% {
    transform: translate(-50%, -50%) scale(2);
    opacity: 0;
  }
}

@keyframes video-border {
  0% {
    transform: translate(-50%, -50%) scale(1);
  }

  60% {
    opacity: 1;
  }

  100% {
    transform: translate(-50%, -50%) scale(2);
    opacity: 0;
  }
}

@keyframes scroll-up-down {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}

@keyframes scroll1 {
  0% {
    top: 0px;
  }

  100% {
    top: 100%;
  }
}

@keyframes scroll2 {
  0% {
    top: 0px;
  }

  100% {
    top: 100%;
  }
}

@keyframes transform {
  0% {
    transform: scale(0.5);
    opacity: 0.8;
  }

  50% {
    transform: scale(1);
    opacity: 1;
  }

  100% {
    transform: scale(0.5);
    opacity: 0.8;
  }
}

@keyframes dash {
  0% {
    stroke-dashoffset: 1000;
  }

  100% {
    stroke-dashoffset: 0;
  }
}

.tp-zoom-in-out {
  -webkit-animation: tp_zoom_in_out 7s infinite linear;
  -moz-animation: tp_zoom_in_out 7s infinite linear;
  -ms-animation: tp_zoom_in_out 7s infinite linear;
  -o-animation: tp_zoom_in_out 7s infinite linear;
  animation: tp_zoom_in_out 7s infinite linear;
}

@-webkit-keyframes tp_zoom_in_out {
  0% {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
  }

  50% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }

  100% {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
  }
}

@-moz-keyframes tp_zoom_in_out {
  0% {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
  }

  50% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }

  100% {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
  }
}

@-ms-keyframes tp_zoom_in_out {
  0% {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
  }

  50% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }

  100% {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
  }
}

@keyframes tp_zoom_in_out {
  0% {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
  }

  50% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }

  100% {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
  }
}

@keyframes scroll_anim {
  0% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(10px);
  }

  100% {
    transform: translateY(0);
  }
}

@keyframes loadingAnimation {
  to {
    transform: rotate(-360deg);
  }
}

@keyframes roteted {
  0% {
    transform: rotate(0);
  }

  100% {
    transform: rotate(360deg);
  }
}

@keyframes headerSlideDown {
  0% {
    margin-top: -150px;
  }

  100% {
    margin-top: 0;
  }
}

@keyframes bar_anim {

  0%,
  100% {
    -webkit-clip-path: inset(-2px 0);
    clip-path: inset(-2px 0);
  }

  42% {
    -webkit-clip-path: inset(-2px 0 -2px 100%);
    clip-path: inset(-2px 0 -2px 100%);
  }

  43% {
    -webkit-clip-path: inset(-2px 100% -2px 0);
    clip-path: inset(-2px 100% -2px 0);
  }
}

@keyframes scrollText {
  from {
    transform: translateX(0%);
  }

  to {
    transform: translateX(-50%);
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes tpshake {
  10% {
    transform: translateY(-10px);
  }

  50% {
    transform: skew(15deg);
  }

  80% {
    transform: rotate(10deg);
  }

  100% {
    transform: translate(0);
  }
}

@-moz-keyframes tpshake {
  10% {
    transform: translateY(-10px);
  }

  50% {
    transform: skew(15deg);
  }

  80% {
    transform: rotate(10deg);
  }

  100% {
    transform: translate(0);
  }
}

@-ms-keyframes tpshake {
  10% {
    transform: translateY(-10px);
  }

  50% {
    transform: skew(15deg);
  }

  80% {
    transform: rotate(10deg);
  }

  100% {
    transform: translate(0);
  }
}

@keyframes tpshake {
  10% {
    transform: translateY(-10px);
  }

  50% {
    transform: skew(15deg);
  }

  80% {
    transform: rotate(10deg);
  }

  100% {
    transform: translate(0);
  }
}

/*----------------------------------------*/
/*  2.4 Preloader
/*----------------------------------------*/
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1000;
  /* background-color: var(--tp-common-blue); */
  overflow: hidden !important;
  background: #fff !important;
}

.preloader {
  /* width: 50px;
  height: 50px; */
  display: inline-block;
  padding: 0px;
  text-align: left;
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* margin-left: -25px;
  margin-top: -25px; */
  overflow: hidden !important;
}


.preloader-logo {
  width: 350px;
  animation: preloaderPulse 1.1s ease-in-out infinite;
}

@media (max-width: 768px) {
  .preloader-logo {
    width: 250px;
  }
}

/* .preloader span {
  position: absolute;
  display: inline-block;
  width: 50px;
  height: 50px;
  border-radius: 100%;
  background: var(--tp-common-black);
  animation: preloader 1.3s linear infinite;
  -webkit-animation: preloader 1.3s linear infinite;
} */

/* .preloader span:last-child {
  animation-delay: -0.9s;
  -webkit-animation-delay: -0.9s;
}

@keyframes preloader {
  0% {
    transform: scale(0, 0);
    opacity: 0.5;
  }

  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}

@keyframes preloaderPulse {
  0% {
    transform: scale(0.9);
    opacity: 0;
  }

  40% {
    opacity: 1;
  }

  60% {
    transform: scale(1);
  }

  100% {
    transform: scale(0.9);
    opacity: 0.9;
  }
}

@-webkit-keyframes preloader {
  0% {
    -webkit-transform: scale(0, 0);
    opacity: 0.5;
  }

  100% {
    -webkit-transform: scale(1, 1);
    opacity: 0;
  }
} */

/*--- end of preloader ---*/
/*----------------------------------------*/
/*  2.5 Background
/*----------------------------------------*/
.grey-bg {
  background-color: var(--tp-grey-1);
}

.grey-bg-2 {
  background-color: var(--tp-grey-4);
}

.green-bg {
  background-color: var(--tp-theme-green);
}

.white-bg {
  background-color: var(--tp-common-white);
}

.black-bg {
  background-color: var(--tp-common-black);
}

.black-bg-3 {
  background-color: var(--tp-common-black-3);
}

.black-bg-4 {
  background-color: var(--tp-common-black-4);
}

.black-bg-5 {
  background-color: var(--tp-common-black-5);
}

.black-bg-6 {
  background-color: var(--tp-common-black-6);
}

.black-bg-7 {
  background-color: var(--tp-common-black-7);
}

.black-bg-8 {
  background-color: var(--tp-common-black-8);
}

.pink-light-bg {
  background-color: var(--tp-common-pink-light);
}

.yellow-bg {
  background-color: var(--tp-common-yellow);
}

.red-bg {
  background-color: var(--tp-common-red-2);
}

.red-bg-2 {
  background-color: var(--tp-common-secondary);
}

.yellow-green-bg {
  background-color: var(--tp-common-yellow-green);
}

.green-regular-bg {
  background-color: var(--tp-common-green-regular);
}

.paste-bg-2 {
  background-color: var(--tp-common-paste-2);
}

[data-bg-color=footer-bg-grey] {
  background-color: var(--tp-footer-grey-1);
}

[data-bg-color=footer-bg-white] {
  background-color: var(--tp-common-white);
}











.it-faq-wrap {
  margin-left: 40px;
  position: relative;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-faq-wrap {
    margin-left: 100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-faq-wrap {
    margin-left: 0;
  }
}

@media (max-width: 767px) {
  .it-faq-wrap {
    margin-left: 0;
  }
}

.it-faq-wrap::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 8px;
  height: 100%;
  border-radius: 20px;
  background-color: rgba(0, 0, 0, 0.1);
}

.it-faq-wrap .accordion-items {
  padding-left: 70px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-faq-wrap .accordion-items {
    padding-left: 60px;
  }
}

@media (max-width: 767px) {
  .it-faq-wrap .accordion-items {
    padding-left: 50px;
  }
}

.it-faq-wrap .accordion-items {
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.10);
  transition: border-color 0.3s ease;
}

.it-faq-wrap .accordion-items:not(:last-child) {
  margin-bottom: 12px;
}

.it-faq-wrap .accordion-items:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

/* Active / open step gets a green bottom border */
.it-faq-wrap .accordion-items.faq-active {
  /* border-bottom-color: #41bc84; */
}

@media (max-width: 767px) {
  .it-faq-wrap .accordion-items:not(:last-child) {
    margin-bottom: 24px;
  }

  .it-faq-wrap .accordion-items {
    padding-bottom: 24px;
  }
}

.it-faq-wrap .accordion-buttons {
  text-align: left;
}

.it-faq-wrap .accordion-buttons i {
  font-weight: 700;
  font-size: 13px;
  line-height: 1.18;
  font-style: normal;
  margin-bottom: 12px;
  display: inline-block;
  letter-spacing: 0.12em;

  color: #41bc84;
  font-family: var(--tp-ff-inter);
  background: rgba(65, 188, 132, 0.10);
  padding: 4px 12px;
  border-radius: 20px;
}

@media (min-width: 574px) and (max-width: 767px) {
  .it-faq-wrap .accordion-buttons i {
    margin-bottom: 20px;
  }
}

.it-faq-wrap .accordion-buttons span {
  font-weight: 600;
  font-size: 28px;
  /* line-height: 0.7; */
  display: block;
  letter-spacing: 0.04em;
  color: var(--tp-common-black);
  font-family: var(--tp-ff-inter);
}

@media (min-width: 574px) and (max-width: 767px) {
  .it-faq-wrap .accordion-buttons span {
    font-size: 32px;
  }
}

@media (min-width: 280px) and (max-width: 576px) {
  .it-faq-wrap .accordion-buttons span {
    font-size: 24px;
  }
}


.it-faq-wrap .accordion-body {
  padding: 0;
  padding: 18px 85px 0 0;
}

@media (max-width: 767px) {
  .it-faq-wrap .accordion-body {
    padding: 18px 15px 0 0;
  }
}

.it-faq-wrap .accordion-body p {
  /* font-weight: 500; */
  /* font-size: 16px; */
  /* line-height: 1.5;
  margin-bottom: 0; */
  /* color: var(--tp-common-black); */
}

/*----------------------------------------*/
/*  2.9 Section Title
/*----------------------------------------*/

.tp-hero-video {
  width: 140px;

}







.ar-title-mlr {
  margin-left: 100px;
  margin-right: 100px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ar-title-mlr {
    margin-left: 0;
    margin-right: 0;
  }
}

.tp-section-subtitle {
  font-weight: 400;
  font-size: 18px;
  line-height: 1;
  display: inline-block;

  color: var(--tp-common-black);
}

.tp-section-subtitle.pre::before {
  content: "";
  height: 8px;
  width: 8px;
  margin-right: 12px;
  border-radius: 4px;
  display: inline-block;
  transform: translateY(-2px);
  background-color: var(--tp-common-secondary);
}

.tp-section-subtitle.subtitle-black {
  font-weight: 400;
  font-size: 16px;
  line-height: 1.2;

  color: var(--tp-common-black);
}

.tp-section-subtitle.fs-17 {
  font-weight: 400;
  font-size: 17px;
  line-height: 1;

  color: var(--tp-common-white);
}

.tp-section-subtitle.fs-17.pre-circle::before {
  content: "";
  height: 8px;
  width: 8px;
  margin-right: 12px;
  border-radius: 50%;
  display: inline-block;
  transform: translateY(-2px);
  background-color: var(--tp-common-white);
}

.tp-section-subtitle-clash {
  font-size: 14px;
  line-height: 1.1;
  color: #f9f4e8;

  font-family: var(--tp-ff-inter);
}

.tp-section-subtitle-clash i {
  margin-left: 10px;
}

.tp-section-subtitle-clash.clash-subtitle-pos {
  display: inline-block;
  transform: translateY(60px);
}

@media (max-width: 767px) {
  .tp-section-subtitle-clash.clash-subtitle-pos {
    transform: translateY(0px);
    margin-bottom: 20px;
  }
}

.tp-section-subtitle-clash.clash-subtitle-pos.body-ff {
  font-size: 18px;
  font-weight: 600;

  transform: translateY(5px);
  font-family: var(--tp-ff-inter);
}

.tp-section-subtitle-clash.clash-subtitle-pos.about-us-2 {
  color: var(--tp-common-black-10);
}

.tp-section-subtitle-clash.color-red {
  color: var(--tp-common-red);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-section-subtitle-clash.color-red {
    padding-bottom: 20px;
  }
}

.tp-section-subtitle-gradient {
  font-weight: 600;
  font-size: 14px;
  line-height: 1;
  display: inline-block;

  background: linear-gradient(139deg, #9968ff 0%, #ff6cb2 49%, #ffaf56 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.tp-section-subtitle-gradient div img {
  margin-bottom: 13px;
  display: inline-block;
}

.tp-section-subtitle-gradient.icon-left div {
  display: inline-block;
}

.tp-section-subtitle-gradient.icon-left div img {
  margin-bottom: 0;
  margin-right: 10px;
  transform: translateY(-3px);
}

.tp-section-subtitle-gradient.ct {
  font-size: 16px;
  font-weight: 500;
  padding: 7px 20px;
  border-radius: 20px;
  margin-bottom: 15px;

  font-family: var(--tp-ff-inter);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

@media (max-width: 767px) {
  .tp-section-subtitle-gradient.ct {
    font-size: 14px;
  }
}

.tp-section-subtitle-satisfy {
  font-weight: 400;
  font-size: 26px;
  line-height: 1;
  display: inline-block;
  color: var(--tp-common-red-2);
  font-family: var(--tp-ff-inter);
}

.tp-section-subtitle-teko {
  font-weight: 500;
  font-size: 30px;
  line-height: 1;
  display: inline-block;
  font-family: var(--tp-ff-inter);
  color: var(--tp-common-cream-3);
}

@media (max-width: 767px) {
  .tp-section-subtitle-teko {
    font-size: 25px;
  }
}

.tp-section-subtitle-teko i {
  font-style: normal;
  color: var(--tp-common-yellow-green);
}

.tp-section-subtitle.border-bg {
  font-size: 14px;
  font-weight: 500;
  padding: 7px 12px;
  border-radius: 40px;
  margin-bottom: 16px;

  color: var(--tp-common-black-10);
  border: 1px solid rgba(33, 33, 45, 0.06);
  box-shadow: 0px 0px 2px 0px rgba(39, 39, 46, 0.04);
  backdrop-filter: blur(10px);
}

.tp-section-subtitle.border-bg.bg-color {
  font-size: 15px;
  font-weight: 600;
  background: var(--tp-common-white);
  border: 1px solid rgba(33, 33, 45, 0.06);
  box-shadow: 0px 0px 2px 0px rgba(39, 39, 46, 0.04);
}

.tp-section-subtitle-platform {
  font-size: 24px;
  font-weight: 400;
  font-style: italic;
  display: inline-block;
  letter-spacing: 0.04em;
  color: var(--tp-common-white);
  font-family: var(--tp-ff-inter);
}

@media (max-width: 767px) {
  .tp-section-subtitle-platform {
    font-size: 20px;
  }
}

.tp-section-subtitle-platform.platform-text-black {
  color: var(--tp-common-black-10);
}

.tp-section-subtitle.st {
  font-weight: 500;
  color: #494949;
  margin-bottom: 20px;
}

.tp-section-subtitle.orange-color {
  color: var(--tp-common-secondary);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-subtitle.orange-color {
    margin-right: 50px;
  }
}

.tp-section-title {
  font-size: 35px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.02em;

}

@media only screen and (min-width: 1701px) and (max-width: 1800px) {
  .tp-section-title {
    font-size: 35px;
  }
}

@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .tp-section-title {
    font-size: 35px;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title {
    font-size: 35px;
  }
}

@media (max-width: 767px) {
  .tp-section-title {
    font-size: 42px;
  }
}

.tp-section-title.fs-140 {
  line-height: 0.89;
  font-size: 110px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title.fs-140 {
    font-size: 90px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title.fs-140 {
    font-size: 90px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title.fs-140 {
    font-size: 75px;
    letter-spacing: 0;
  }
}

@media (max-width: 767px) {
  .tp-section-title.fs-140 {
    letter-spacing: 0;
    font-size: 65px;
  }
}

@media (min-width: 280px) and (max-width: 576px) {
  .tp-section-title.fs-140 {
    letter-spacing: 0;
    font-size: 50px;
  }
}

.tp-section-title.fs-64 {
  font-weight: 600;
  font-size: 64px;
  line-height: 1.1;
  letter-spacing: -0.02em;

  color: var(--tp-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title.fs-64 {
    font-size: 55px;
  }
}

@media (max-width: 767px) {
  .tp-section-title.fs-64 {
    font-size: 42px;
  }
}

.tp-section-title.fs-44 {
  font-weight: 600;
  font-size: 44px;
  line-height: 1.18;
  margin-bottom: 0;
  letter-spacing: -0.03em;

  color: var(--tp-common-white);
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title.fs-44 {
    font-size: 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-section-title.fs-44 {
    font-size: 38px;
  }

  .tp-section-title.fs-44 br {
    display: none;
  }
}

.tp-section-title.fs-54 {
  font-weight: 700;
  font-size: 54px;
  line-height: 1.15;
  letter-spacing: -0.04em;

  color: var(--tp-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title.fs-54 {
    font-size: 45px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title.fs-54 {
    font-size: 40px;
  }
}

@media (max-width: 767px) {
  .tp-section-title.fs-54 {
    font-size: 35px;
  }
}

.tp-section-title.fs-54 span {
  height: 55px;
  width: 50px;
  display: inline-block;
}

.tp-section-title.fs-54.fs-60 {
  font-size: 60px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title.fs-54.fs-60 {
    font-size: 55px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title.fs-54.fs-60 {
    font-size: 45px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title.fs-54.fs-60 {
    font-size: 55px;
  }
}

@media (max-width: 767px) {
  .tp-section-title.fs-54.fs-60 {
    font-size: 40px;
  }
}

.tp-section-title.lts {
  /* letter-spacing: -2.4px; */

}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-section-title.lts {
    font-size: 34px;
  }
}

@media (max-width: 767px) {
  .tp-section-title.lts {
    letter-spacing: 0;
  }
}

@media (max-width: 767px) {
  .tp-section-title.lts br {
    display: none;
  }
}

.tp-section-title-mango {
  font-weight: 300;
  font-size: 56px;
  line-height: 1;
  color: var(--tp-common-cream);
  font-family: var(--tp-ff-mango);
}

.tp-section-title-mango.fs-100 {
  font-size: 100px;
  font-family: var(--tp-ff-mango-semibold);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-mango.fs-100 {
    font-size: 80px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-mango.fs-100 {
    font-size: 50px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-mango {
    font-size: 50px;
  }
}

.tp-section-title-grotesk {
  font-size: 45px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--tp-common-black);
  font-family: var(--tp-ff-inter);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title-grotesk {
    font-size: 55px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-grotesk {
    font-size: 50px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-grotesk br {
    display: none;
  }
}

.tp-section-title-grotesk>span {
  display: inline-block;
}

.tp-section-title-shape {
  position: absolute;
  bottom: -12px;
  left: 0;
  z-index: -1;
}

.tp-section-title-dirtyline {
  font-weight: 400;
  font-size: 200px;
  line-height: 0.8;
  color: #e0eeee;
  letter-spacing: -0.02em;
  font-family: var(--tp-ff-inter);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title-dirtyline {
    font-size: 160px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-dirtyline {
    font-size: 130px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-dirtyline {
    font-size: 130px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-dirtyline {
    font-size: 80px;
  }
}

.tp-section-title-dirtyline.fs-140 {
  font-size: 140px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title-dirtyline.fs-140 {
    font-size: 110px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-dirtyline.fs-140 {
    font-size: 80px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-dirtyline.fs-140 {
    font-size: 70px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-section-title-dirtyline.fs-140 br {
    display: none;
  }
}

.tp-section-title-clash {
  font-size: 130px;
  line-height: 0.79;
  letter-spacing: -0.03em;

  color: var(--tp-common-red);
  font-family: var(--tp-ff-inter);
}

@media only screen and (min-width: 1801px) and (max-width: 1850px),
only screen and (min-width: 1701px) and (max-width: 1800px) {
  .tp-section-title-clash {
    font-size: 120px;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-section-title-clash {
    font-size: 115px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title-clash {
    font-size: 110px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-clash {
    font-size: 100px;
  }

  .tp-section-title-clash br {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-clash {
    font-size: 85px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-clash {
    font-size: 40px;
    letter-spacing: 0;
  }

  .tp-section-title-clash br {
    display: none;
  }
}

.tp-section-title-clash span {
  display: inline-block;
}

@media (max-width: 767px) {
  .tp-section-title-clash span br {
    display: none;
  }
}

.tp-section-title-clash span.clash-subtitle-space-1 {
  padding-left: 230px;
}

@media (max-width: 767px) {
  .tp-section-title-clash span.clash-subtitle-space-1 {
    padding-left: 0;
  }

  .tp-section-title-clash span.clash-subtitle-space-1 br {
    display: none;
  }
}

.tp-section-title-clash.fs-170 {
  font-size: 170px;

}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-section-title-clash.fs-200 {
    font-size: 170px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title-clash.fs-200 {
    font-size: 135px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-clash.fs-200 {
    font-size: 125px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-clash.fs-200 {
    font-size: 125px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-clash.fs-200 {
    font-size: 60px;
  }
}

.tp-section-title-clash-600 {
  font-weight: 600;
  font-size: 80px;
  line-height: 1;
  letter-spacing: -0.02em;

  color: var(--tp-common-black);
  font-family: var(--tp-ff-inter);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title-clash-600 {
    font-size: 60px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-clash-600 {
    font-size: 60px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-clash-600 {
    font-size: 50px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-clash-600 {
    font-size: 45px;
  }
}

.tp-section-title-clash-600.fs-60 {
  font-size: 60px;
  line-height: 1.1;
  letter-spacing: 0;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-section-title-clash-600.fs-60 {
    font-size: 55px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title-clash-600.fs-60 {
    font-size: 45px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-clash-600.fs-60 {
    font-size: 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-clash-600.fs-60 {
    font-size: 45px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-clash-600.fs-60 {
    font-size: 30px;
  }
}

.tp-section-title-clash-600.fw-400 {
  font-family: var(--tp-ff-inter);
}

.tp-section-title-teko {
  font-weight: 600;
  font-size: 72px;
  line-height: 0.9;
  letter-spacing: -0.01em;
  font-family: var(--tp-ff-inter);
  color: var(--tp-common-cream-3);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title-teko {
    font-size: 60px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-teko {
    font-size: 55px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-teko {
    font-size: 60px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-teko {
    font-size: 44px;
  }
}

.tp-section-title-teko span {
  color: var(--tp-common-yellow-green);
}

.tp-section-title-teko.fs-150 {
  line-height: 0.73;
  font-size: 150px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title-teko.fs-150 {
    font-size: 130px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-teko.fs-150 {
    font-size: 115px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-teko.fs-150 {
    font-size: 100px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-teko.fs-150 {
    font-size: 80px;
  }
}

.tp-section-title-teko.fs-80 {
  font-size: 80px;
  font-weight: 500;
  letter-spacing: -0.8px;
  color: var(--tp-common-white);
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-section-title-teko.fs-80 {
    font-size: 70px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title-teko.fs-80 {
    font-size: 60px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-section-title-teko.fs-80 {
    font-size: 50px;
  }
}

.tp-section-title-teko.fs-80 span {
  color: rgba(255, 255, 255, 0.3);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-section-title-teko.fs-80 br {
    display: none;
  }
}

.tp-section-title-teko.fs-120 {
  font-size: 120px;
  letter-spacing: -1.2px;
  color: var(--tp-common-white);
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-section-title-teko.fs-120 {
    font-size: 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title-teko.fs-120 {
    font-size: 85px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-teko.fs-120 {
    font-size: 75px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-teko.fs-120 {
    font-size: 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-section-title-teko.fs-120 {
    font-size: 75px;
  }
}

.tp-section-title-teko.fs-120 span {
  color: rgba(255, 255, 255, 0.3);
}

.tp-section-title-phudu {
  font-size: 45px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -1px;

  color: var(--tp-common-black-10);
  margin-bottom: 35px !important;

}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-phudu {
    font-size: 75px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-phudu {
    font-size: 65px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-phudu {
    font-size: 50px;
    letter-spacing: 0;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-section-title-phudu {
    font-size: 60px;
    letter-spacing: 0;
  }
}

@media (max-width: 767px) {
  .tp-section-title-phudu br {
    display: none;
  }
}

.tp-section-title-phudu.fs-70 {
  font-size: 55px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-phudu.fs-70 {
    font-size: 45px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-phudu.fs-70 {
    font-size: 45px;
    letter-spacing: 0;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-section-title-phudu.fs-70 {
    font-size: 40px;
    letter-spacing: 0;
  }
}

@media only screen and (min-width: 280px) and (max-width: 576px) {
  .tp-section-title-phudu.fs-70 {
    font-size: 40px;
    letter-spacing: 0;
  }
}

.tp-section-title-phudu.ff-inter {
  font-size: 70px;
  letter-spacing: -2px;
  text-transform: inherit;
  font-family: var(--tp-ff-inter);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-phudu.ff-inter {
    font-size: 62px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-phudu.ff-inter {
    font-size: 50px;
    letter-spacing: 0;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-section-title-phudu.ff-inter {
    font-size: 60px;
    letter-spacing: 0;
  }
}

.tp-section-title-platform {
  font-weight: 500;
  font-size: 60px;
  line-height: 1;
  color: var(--tp-common-black);
  font-family: var(--tp-ff-inter);
}

@media (max-width: 767px) {
  .tp-section-title-platform {
    font-size: 45px;
  }
}

.tp-section-title-platform.platform-text-black {
  color: var(--tp-common-black-10);
}

.tp-section-title-platform.fs-200 {
  font-size: 120px;
  /* font-style: italic; */
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title-platform.fs-200 {
    font-size: 115px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-platform.fs-200 {
    font-size: 100px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-platform.fs-200 {
    font-size: 60px;
  }
}


@media (min-width: 280px) and (max-width: 767px) {
  .tp-section-title-platform.fs-200 {
    font-size: 50px;
    ;
  }
}


.tp-section-title-platform.fs-84 {
  font-size: 66px;
  line-height: 0.88;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-platform.fs-84 {
    font-size: 60px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-platform.fs-84 {
    font-size: 60px;
  }
}


@media (min-width: 280px) and (max-width: 576px) {
  .tp-section-title-platform.fs-84 {
    font-size: 40px;
  }
}


.tp-section-title-playfair {
  font-size: 80px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -1.6px;
  color: var(--tp-common-brown);
  font-family: var(--tp-ff-interoppins);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title-playfair {
    font-size: 70px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-playfair {
    font-size: 60px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-playfair {
    font-size: 45px;
  }

  .tp-section-title-playfair br {
    display: none;
  }
}

.tp-section-title-playfair span {
  font-style: italic;
  color: rgba(69, 48, 48, 0.6);
  font-family: var(--tp-ff-inter);
}

.tp-section-title-onest {
  font-size: 54px;
  font-weight: 600;
  line-height: 1.1;
  margin-bottom: 25px;
  letter-spacing: -2.16px;
  color: var(--tp-common-white);
  font-family: var(--tp-ff-inter);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-section-title-onest {
    font-size: 42px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-onest br {
    display: none;
  }
}

.tp-section-title-onest.fs-72 {
  font-size: 72px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-onest.fs-72 {
    font-size: 55px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-onest.fs-72 {
    font-size: 50px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-onest.fs-72 {
    font-size: 45px;
  }
}

.tp-section-title-onest.fs-44 {
  font-size: 44px;
}

.tp-section-title-5 {
  font-size: 120px;
  font-weight: 500;
  line-height: 0.9;
  letter-spacing: -4.8px;
  color: var(--tp-cream-1);

  font-family: var(--tp-ff-interoppins);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-5 {
    font-size: 100px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-5 {
    font-size: 70px;
  }
}

.tp-section-title-5.fs-140 {
  font-size: 140px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -8.4px;

  color: var(--tp-cream-2);
  font-family: var(--tp-ff-inter);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-title-5.fs-140 {
    font-size: 120px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-5.fs-140 {
    font-size: 85px;
  }
}

@media (max-width: 767px) {
  .tp-section-title-5.fs-140 {
    font-size: 50px;
    letter-spacing: -1.4px;
    line-height: 1.2;
  }
}

.tp-section-title-5.fs-140 span {
  transform: translateY(-15px);
  display: inline-block;
  margin: 0px 30px;
  white-space: nowrap;
}

@media (max-width: 767px) {
  .tp-section-title-5.fs-140 span {
    white-space: inherit;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-section-title-5.fs-140 span {
    margin: 0;
  }
}

.tp-section-title-5.fs-140 span img {
  border-radius: 100px;
}

.tp-section-title-5.fs-140 em {
  font-style: normal;
  padding-left: 160px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-section-title-5.fs-140 em {
    padding-left: 0;
  }
}

.tp-revel-line {
  overflow: hidden;
}


/*----------------------------------------*/
/*  2.12 Magic Cursor
/*----------------------------------------*/
body.tp-magic-cursor #magic-cursor {
  display: block;
}

#magic-cursor {
  position: absolute;
  display: none;
  width: 10px;
  height: 10px;
  pointer-events: none;
  z-index: 99999;
  opacity: 0;
  top: 0;
  left: 0;
}

#ball {
  position: fixed;
  display: flex;
  align-items: center;
  pointer-events: none;
  border-radius: 50%;
  color: transparent;
  justify-content: center;
  mix-blend-mode: difference;
  background-color: var(--tp-common-black);
}

.cursor-bg-red #ball {
  background-color: #FF535B !important;
}

.cursor-bg-red #ball .ball-view {
  color: var(--tp-common-white);
}

.cursor-bg-red-2 #ball {
  background-color: #FF481F !important;
}

.cursor-bg-red-2 #ball .ball-view {
  color: var(--tp-common-white);
}

.cursor-bg-yellow #ball {
  background-color: #FFF669 !important;
}

.cursor-bg-yellow #ball .ball-view {
  color: var(--tp-common-black);
}

.cursor-white-bg #ball .ball-view {
  color: var(--tp-common-black);
}

/* Ball view 
============= */
#ball .ball-view {
  position: absolute;
  opacity: 0;
  visibility: hidden;
  padding: 0 5px;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.3;
  text-align: center;
  transform: scale(0);
  color: var(--tp-common-black);
}

/* Ball drag 
============= */
#ball .ball-drag {
  position: absolute;
  display: block;
  width: 100%;
  padding: 0 5px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  transition: all 0.3s;
  color: var(--tp-common-black);
}

#ball .ball-drag::before,
#ball .ball-drag::after {
  position: absolute;
  top: 50%;
  margin-top: -5px;
  font-size: 19px;
  height: 10px;
  line-height: 10px;
  font-weight: 900;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  color: var(--tp-common-white);
  font-family: "Font Awesome 6 Pro";
  -webkit-font-smoothing: antialiased;
}

#ball .ball-drag::before {
  content: "\f104";
  /* Font Awesome */
  left: 0;
  transform: translate3d(-30px, 0, 0);
  transition: all 0.25s;
}

#ball .ball-drag::after {
  content: "\f105";
  /* Font Awesome */
  right: 0;
  transform: translate3d(30px, 0, 0);
  transition: all 0.25s;
}

#ball.with-blur {
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

/* Ball close 
============== */
#ball.ball-close-enabled {
  opacity: 1 !important;
}

#ball .ball-close {
  position: absolute;
  padding: 0 5px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  text-align: center;
  color: var(--tp-common-black);
}

.tp-magnetic-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* HEADER CSS */
/*----------------------------------------*/
/*   3.1 Header Style
/*----------------------------------------*/
.header-transparent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9;
  width: 100%;
  background-color: white;
}

.header-fixed {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 55;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-header-ptb {
    padding: 10px 0;
  }
}

.tp-header-border {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.tp-header-menu>nav>ul>li {
  margin: 0 14px;
  list-style-type: none;
  display: inline-block;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-header-menu>nav>ul>li {
    margin: 0 8px;
    font-size: 12px !important;

  }
}

.tp-header-menu>nav>ul>li>a {
  padding: 26px 0;
  font-weight: 500;
  font-size: 17px;
  display: inline-block;
  letter-spacing: -0.01em;
  color: var(--tp-common-black);
}


@media (min-width: 1100px) and (max-width: 1300px) {
  .tp-header-menu>nav>ul>li>a {
    padding: 26px 0;
    font-weight: 500;
    font-size: 14px !important;
    display: inline-block;
    letter-spacing: -0.01em;
    color: var(--tp-common-black);
  }

}

.index3 .tp-submenu a {
  color: #000 !important;
}

.tp-header-lang a {
  font-weight: 400;
  font-size: 16px;
  line-height: 1;
  display: inline-block;
  color: rgba(255, 255, 255, 0.6);
}

.tp-header-lang a.active {
  color: var(--tp-common-white);
}

.tp-header-lang a:not(:first-child) {
  margin-left: 10px;
}

.tp-header-lang a:hover {
  color: var(--tp-common-white);
}

@media only screen and (min-width: 1600px) and (max-width: 1700px),
only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-header-box {
    padding-right: 30px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-header-box {
    padding-right: 0px;
  }
}

.tp-header-logo img {
  max-width: inherit;
}

@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .tp-header-logo {
    padding-left: 30px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-header-logo {
    padding-right: 25px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-header-logo {
    padding: 10px 0;
  }
}



.tp-header-bar button {
  width: 30px;
  color: var(--tp-common-white);
}

.tp-header-bar button i {
  height: 2px;
  width: 14px;
  display: block;
  margin-left: 0;
  background-color: var(--tp-common-black);
}

.tp-header-bar button i:nth-child(2) {
  width: 24px;
}

.tp-header-bar button i:not(:last-of-type) {
  margin: 6px auto;
}

.tp-header-bar button:hover i {
  animation: bar_anim 0.8s cubic-bezier(0.44, 1.1, 0.53, 0.99) 1 forwards;
}

@media (max-width: 767px) {
  .tp-header-2-area {
    margin-top: 20px;
  }
}

.tp-header-2-area.header-black-style .tp-header-2-bar span {
  color: var(--tp-common-black-7);
}

.tp-header-2-area.header-black-style .tp-header-2-bar span i {
  background-color: var(--tp-common-black-7);
}

.tp-header-2-bar span {
  font-weight: 500;
  font-size: 17px;
  line-height: 1;
  letter-spacing: -0.01em;
  color: var(--tp-common-white);
}

.tp-header-2-bar span i {
  height: 2px;
  width: 40px;
  display: block;
  margin: 6px 0;
  margin-left: 20px;
  background-color: var(--tp-common-white);
}

.tp-header-2-bar span:hover i {
  animation: bar_anim 0.8s cubic-bezier(0.44, 1.1, 0.53, 0.99) 1 forwards;
}






.tp-header-4-style .tp-header-menu nav ul li a {
  color: var(--tp-common-white);
}

@media (max-width: 767px) {
  .tp-header-4-style .tp-header-btn-box {
    display: none;
  }
}

.tp-header-4-style.header-4-light-style .tp-header-bar button {
  color: var(--tp-common-black);
}

.tp-header-4-style.header-4-light-style .tp-header-bar button i {
  background-color: var(--tp-common-black);
}

.tp-header-5-area.header-style-light .tp-header-5-bar span {
  background-color: var(--tp-common-black-7);
}




.tp-header-5-bar span {
  height: 2px;
  width: 60px;
  display: block;
  margin: 8px 0;
  background-color: var(--tp-common-cream);
}

.tp-header-7-wrapper {
  padding: 0px 25px;
  padding-right: 10px;
  border-radius: 16px;
  background: rgba(8, 4, 29, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-header-7-wrapper {
    padding: 10px 25px;
    padding-right: 10px;
  }
}

.tp-header-7-wrapper::after {
  content: "";
  height: 100%;
  width: 100%;
  display: block;
  backdrop-filter: blur(10px);
}

.tp-header-7-menu>nav>ul {
  margin-left: 0;
}

.tp-header-7-menu>nav>ul>li>a {
  padding: 22px 0;
  font-weight: 600;
  font-size: 16px;
  line-height: 1;
  display: inline-block;
  letter-spacing: -0.01em;
  color: var(--tp-common-white);
}

.tp-header-7-btn-box {
  line-height: 1;
}

.tp-header-7-serach {
  color: var(--tp-common-white);
}

.tp-header-8-area.header-8-style-dark .tp-header-8-bar {
  border: 1px solid rgba(255, 255, 255, 0.12);
}

.tp-header-8-area.header-8-style-dark .tp-header-8-bar span {
  color: var(--tp-common-white);
}

.tp-header-8-wrapper {
  padding: 18px 0;
}

.tp-header-8-border {
  border-bottom: 1px solid rgba(25, 25, 25, 0.08);
}

.tp-header-8-bar {
  transition: 0.3s;
  padding: 8px 22px;
  margin-right: 18px;
  border-radius: 24px;
  display: inline-block;
  border: 1px solid rgba(25, 25, 25, 0.1);
}

.tp-header-8-bar:hover {
  border-color: var(--tp-common-red-2);
  background-color: var(--tp-common-red-2);
}

.tp-header-8-bar:hover span {
  color: var(--tp-common-white);
}

.tp-header-8-bar span {
  line-height: 1;
  transition: 0.3s;
  font-size: 15px;
  letter-spacing: -0.01em;

  color: var(--tp-common-black);
  font-family: var(--tp-ff-inter);
}

.tp-header-8-bar span svg {
  margin-left: 7px;
}





.tp-header-8-btn {
  margin-left: 20px;
}

.tp-header-9-mt {
  margin-top: 40px;
}

.tp-header-9-box {
  margin-left: 90px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-header-9-box {
    margin-left: 0;
  }
}

.tp-header-9-menu.tp-header-dropdown nav ul li.has-dropdown::after {
  display: none;
}

.tp-header-9-menu>nav>ul {
  display: inline-block;
  padding: 0 10px;
  border-radius: 14px;
  background: rgba(238, 241, 234, 0.04);
  border: 1px solid rgba(238, 241, 234, 0.04);
}

.tp-header-9-menu>nav>ul>li {
  display: inline-block;
  list-style-type: none;
  padding: 8px 0;
}

.tp-header-9-menu>nav>ul>li>a {
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  border-radius: 8px;
  padding: 7px 23px;
  display: inline-block;
  letter-spacing: -0.01em;
  color: var(--tp-common-cream-3);
  background-color: transparent;
}

.tp-header-9-menu>nav>ul>li>a:hover {
  color: var(--tp-common-yellow-green);
  background-color: rgba(238, 241, 234, 0.06);
}

.tp-header-9-logo .logo-2 {
  display: none;
}

.tp-header-9-search span {
  color: var(--tp-common-cream);
}

.tp-header-10-area.header-10-dark-style .tp-header-10-wrapper {
  background: #1A1B1E;
  border: 1px solid rgba(0, 0, 0, 0.6);
}

.tp-header-10-area.header-10-dark-style .tp-header-10-menu>nav>ul>li>a {
  color: var(--tp-common-white);
}

.tp-header-10-area.header-10-dark-style .tp-header-10-offcanvas .tp-header-bar button {
  color: var(--tp-common-white);
}

.tp-header-10-area.header-10-dark-style .tp-header-10-offcanvas .tp-header-bar button i {
  background-color: var(--tp-common-white);
}

.tp-header-10-announcement-wrapper {
  padding: 10px 0;
}

.tp-header-10-announcement-content p {
  font-size: 14px;
  font-weight: 600;
  margin: 0;
  margin-right: 8px;
  color: var(--tp-common-white);
}

@media (max-width: 767px) {
  .tp-header-10-announcement-content p {
    font-size: 12px;
    margin-right: 0;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-header-10-announcement-content p {
    font-size: 14px;
    margin-right: 8px;
  }
}

.tp-header-10-announcement-content p span {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 16px;
  margin-right: 10px;

  background: #21212D;
  border-radius: 18px;
}

@media (max-width: 767px) {
  .tp-header-10-announcement-content p span {
    font-size: 10px;
    font-weight: 500;
    padding: 4px 10px;
    margin-right: 5px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-header-10-announcement-content p span {
    padding: 4px 16px;
  }
}

.tp-header-10-announcement-content a {
  position: relative;
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
  color: var(--tp-common-white);
}

.tp-header-10-announcement-content a::after {
  position: absolute;
  content: "";
  height: 1px;
  width: 100%;
  bottom: 0;
  left: 0;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  background-color: rgba(255, 255, 255, 0.5);
}

.tp-header-10-announcement-content a:hover::after {
  opacity: 0;
  visibility: hidden;
}

.tp-header-10-announcement-content a:hover span {
  transform: rotate(45deg);
}

.tp-header-10-announcement-content a span {
  display: inline-block;
  margin-left: 5px;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.tp-header-10-announcement-close {
  position: absolute;
  top: 7px;
  right: 60px;
}

.tp-header-10-announcement-close button {
  display: inline-block;
  height: 26px;
  width: 26px;
  line-height: 7px;
  border-radius: 50%;
  color: var(--tp-common-black);
  background: var(--tp-common-white);
}

.tp-header-10-announcement-close button:hover {
  transform: scale(1.1);
}

@media (max-width: 767px) {
  .tp-header-10-announcement-close button {
    display: none;
  }
}

.tp-header-10-menu {
  margin-left: -70px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-header-10-menu {
    margin-left: -15px;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1600px) and (max-width: 1700px),
only screen and (min-width: 1701px) and (max-width: 1800px),
only screen and (min-width: 1801px) and (max-width: 1850px) {
  .tp-header-10-menu {
    margin-left: -60px;
  }
}

.tp-header-10-menu::before {
  position: absolute;
  content: "";
  height: 30px;
  width: 1px;
  top: 15px;
  left: -10px;
  background: rgba(33, 33, 45, 0.06);
}

.tp-header-10-menu>nav>ul {
  margin-left: 0;
}

.tp-header-10-menu>nav>ul>li {
  margin: 0 20px;
}

.tp-header-10-menu>nav>ul>li>a {
  padding: 22px 0;
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  display: inline-block;
  letter-spacing: -0.16px;
  color: var(--tp-common-black-10);
}

.tp-header-10-menu.tp-header-dropdown nav ul li.has-dropdown::after {
  display: none;
}

.tp-header-10-wrapper {
  padding: 1px 30px;
  border-radius: 60px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  background: rgba(247, 247, 253, 0.2);
  box-shadow: 0px 20px 30px 0px rgba(33, 33, 45, 0.03);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-header-10-wrapper {
    padding: 10px 20px;
  }
}

.tp-header-10-btn-box {
  line-height: 1;
}

.tp-header-10-offcanvas .tp-header-bar button {
  color: var(--tp-common-black);
}

.tp-header-10-offcanvas .tp-header-bar button i {
  background-color: var(--tp-common-black);
}

.tp-header-11-style .tp-header-10-wrapper {
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.6);
  box-shadow: 0 20px 30px 0 rgba(33, 33, 45, 0.03);
}

.tp-header-11-style .tp-header-10-wrapper::after {
  content: "";
  height: 100%;
  width: 100%;
  backdrop-filter: blur(10px);
}

.tp-header-11-style .tp-header-10-menu {
  margin-left: -100px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-header-11-style .tp-header-10-menu {
    margin-left: 0;
  }
}

.tp-header-11-style.header-11-dark-style .tp-header-10-wrapper {
  background: #1A1B1E;
  border: 1px solid rgba(0, 0, 0, 0.6);
}

.tp-header-11-style.header-11-dark-style .tp-header-10-menu>nav>ul>li>a {
  color: var(--tp-common-white);
}

.tp-header-11-style.header-11-dark-style .tp-header-10-offcanvas .tp-header-bar button {
  color: var(--tp-common-white);
}

.tp-header-11-style.header-11-dark-style .tp-header-10-offcanvas .tp-header-bar button i {
  background-color: var(--tp-common-white);
}

.tp-header-11-style.header-11-dark-style .tp-btn-black-radius {
  background-color: #fff;
  color: var(--tp-common-black);
}

.tp-header-11-style.header-11-dark-style .tp-btn-black-radius i {
  color: var(--tp-common-white);
  background-color: var(--tp-common-black);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-header-12-ptb {
    padding: 10px 0;
  }
}

.tp-header-12-ptb.sticky-black-bg .tp-header-12-menu>nav>ul>li>a {
  color: var(--tp-common-white);
}

.tp-header-12-ptb.sticky-black-bg .tp-header-12-menu>nav>ul>li.has-dropdown::after {
  color: var(--tp-common-white);
}

.tp-header-12-menu>nav>ul {
  margin-left: 0;
}

.tp-header-12-menu>nav>ul>li {
  margin: 0 20px;
}

.tp-header-12-menu>nav>ul>li>a {
  position: relative;
  padding: 41px 0;
  font-size: 17px;
  font-weight: 500;
  line-height: 1;
  color: #616161;
  display: inline-block;
  letter-spacing: -0.17px;
}

.tp-header-12-menu.about-us-4 nav ul li a {
  color: #111013;
}

.tp-header-12-menu.tp-header-dropdown nav ul li.has-dropdown::after {
  color: #616161;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-header-13-ptb {
    padding: 10px 0;
  }
}

.tp-header-13-menu>nav>ul {
  margin-left: 270px;
}

@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .tp-header-13-menu>nav>ul {
    margin-left: 100px;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-header-13-menu>nav>ul {
    margin-left: 0;
  }
}

.tp-header-13-menu>nav>ul>li {
  margin: 0 20px;
}

.tp-header-14-main {
  position: relative;
  z-index: 999;
}

.tp-header-14-wrapper {
  padding: 18px 0;
}

.tp-header-14-info a {
  font-size: 15px;
  font-weight: 600;
  color: var(--tp-common-white);
}

.tp-header-14-bar-wrap .tp-header-8-bar {
  margin-right: 0;
  padding: 8px 18px;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.tp-header-14-bar-wrap .tp-header-8-bar:hover {
  background-color: var(--tp-common-white);
}

.tp-header-14-bar-wrap .tp-header-8-bar:hover span {
  color: var(--tp-common-black);
}

.tp-header-14-bar-wrap .tp-header-8-bar span {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: -0.14px;

  color: var(--tp-common-white);
  font-family: var(--tp-ff-inter);
}

.tp-header-15-style .tp-header-14-info a {
  color: #653624;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-header-15-style .tp-header-14-info a {
    color: var(--tp-cream-2);
  }
}

.tp-header-15-style .tp-header-14-bar-wrap .tp-header-8-bar {
  border-color: #653624;
}

.tp-header-15-style .tp-header-14-bar-wrap .tp-header-8-bar span {
  color: #653624;
}

.tp-header-15-style .tp-header-14-bar-wrap .tp-header-8-bar:hover {
  background-color: #653624;
}

.tp-header-15-style .tp-header-14-bar-wrap .tp-header-8-bar:hover span {
  color: var(--tp-common-white);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-header-15-style .tp-header-14-bar-wrap .tp-header-8-bar {
    border-color: var(--tp-cream-2);
  }

  .tp-header-15-style .tp-header-14-bar-wrap .tp-header-8-bar span {
    color: var(--tp-cream-2);
  }

  .tp-header-15-style .tp-header-14-bar-wrap .tp-header-8-bar:hover {
    background-color: var(--tp-cream-2);
  }

  .tp-header-15-style .tp-header-14-bar-wrap .tp-header-8-bar:hover span {
    color: var(--tp-common-black);
  }
}

.tp-header-inner-style .tp-header-menu>nav>ul {
  padding: 0 10px;
  border-radius: 30px;
  display: inline-block;
  background-color: rgb(246, 246, 249);
}

.tp-header-inner-style .tp-header-menu>nav>ul>li>a {
  padding: 10px 0;
  color: var(--tp-common-black);
}

.tp-header-inner-style .tp-header-dropdown nav ul li.has-dropdown::after {
  color: var(--tp-common-black);
}

.tp-header-inner-style .tp-header-dropdown nav ul li .tp-submenu {
  top: 110%;
}

.tp-header-inner-style .tp-header-14-bar-wrap .tp-header-8-bar {
  border: 0;
  background-color: rgb(246, 246, 249);
}

.tp-header-inner-style .tp-header-14-bar-wrap .tp-header-8-bar span {
  color: var(--tp-common-black);
}

.tp-header-inner-style .tp-header-14-bar-wrap .tp-header-8-bar:hover {
  background-color: var(--tp-common-black);
}

.tp-header-inner-style .tp-header-14-bar-wrap .tp-header-8-bar:hover span {
  color: var(--tp-common-white);
}

.tp-header-inner-style.header-inner-white .tp-header-menu>nav>ul {
  background-color: #1D1D1F;
}

.tp-header-inner-style.header-inner-white .tp-header-menu>nav>ul>li>a {
  color: #BFBFC0;
}

.tp-header-inner-style.header-inner-white .tp-header-menu>nav>ul>li:hover>a {
  color: var(--tp-common-white);
}

.tp-header-inner-style.header-inner-white .tp-header-dropdown>nav>ul>li.has-dropdown::after {
  color: #BFBFC0;
}

.tp-header-inner-style.header-inner-white .tp-header-dropdown>nav>ul>li:hover.has-dropdown::after {
  color: var(--tp-common-white);
}

.tp-header-inner-style.header-inner-white .tp-header-14-bar-wrap .tp-header-8-bar {
  background-color: #1D1D1F;
}

.tp-header-inner-style.header-inner-white .tp-header-14-bar-wrap .tp-header-8-bar span {
  color: var(--tp-common-white);
}

.tp-header-inner-style.header-inner-white .tp-header-14-bar-wrap .tp-header-8-bar:hover {
  background-color: var(--tp-common-white);
}

.tp-header-inner-style.header-inner-white .tp-header-14-bar-wrap .tp-header-8-bar:hover span {
  color: var(--tp-common-black);
}

.tp-header-inner-style .tp-megamenu-wrapper {
  top: 110%;
}





.header-lang-submenu {
  position: absolute;
  top: 110%;
  right: 0px;
  width: 120px;
  z-index: 9;
  opacity: 0;
  padding: 15px 20px;
  visibility: hidden;
  background: #4D3D30;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  box-shadow: 0 30px 70px 6px rgba(11, 6, 70, 0.08);
}

.header-lang-submenu li {
  list-style: none;
}

.header-lang-submenu li a {
  font-size: 13px;

  color: var(--tp-common-white);
}

.header-lang-submenu.open {
  top: 100%;
  opacity: 1;
  visibility: visible;
}

.tp-header-14-yellow-bg .tp-header-8-bar:hover {
  color: var(--tp-common-white);
  border-color: var(--tp-common-black);
  background-color: var(--tp-common-black);
}

/*----------------------------------------*/
/*  4.1 Main Menu
/*----------------------------------------*/
.header-sticky {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  opacity: 1;
  width: 100%;
  z-index: 10;
  visibility: visible;
  background: rgba(38, 37, 40, 0.9);
  box-shadow: 0 2px 6px 0 rgba(19, 19, 22, 0.08);
  animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
  -webkit-animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
}

.header-sticky .tp-header-menu>nav>ul>li>a {
  padding: 22px 0;
}

.header-sticky.sticky-white-bg {
  background: rgba(255, 255, 255, 0.9);
}

.header-sticky.sticky-white-bg .tp-header-menu>nav>ul>li>a {
  color: var(--tp-common-black);
}

.header-sticky.sticky-white-bg .tp-header-dropdown nav ul li.has-dropdown::after {
  color: var(--tp-common-black);
}

.header-sticky.sticky-white-bg .logo-white {
  display: none;
}

.header-sticky.sticky-white-bg .logo-black {
  display: block !important;
}

.header-sticky.sticky-white-bg .tp-header-lang a {
  color: rgba(0, 0, 0, 0.6);
}

.header-sticky.sticky-white-bg .tp-header-lang a.active {
  color: var(--tp-common-black);
}

.header-sticky.sticky-white-bg .tp-header-bar button i {
  background-color: var(--tp-common-black);
}

.header-sticky.sticky-white-bg .tp-header-7-serach {
  color: var(--tp-common-black);
}



.header-sticky.sticky-white-bg .tp-header-btn-box .tp-btn-white-border:hover {
  color: var(--tp-common-black);
  border-color: rgba(0, 0, 0, 0.6);
}

.header-sticky.sticky-white-bg .animated-border-box::before {
  background-image: conic-gradient(rgb(255, 255, 255), #000, rgb(255, 255, 255) 25%);
}

.header-sticky.sticky-white-bg .tp-btn-white-border.tp-btn-light-bg {
  color: #0E0F11;
  background-color: transparent;
  border: 1px solid rgba(0, 0, 0, 0.1);
}

.header-sticky.sticky-white-bg .tp-btn-white-border.tp-btn-light-bg:hover {
  color: var(--tp-common-white);
  border-color: var(--tp-common-black);
  background-color: var(--tp-common-black);
}

.header-sticky.tp-header-blur::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  backdrop-filter: blur(40px);
  z-index: -1;
  background: #fff;
}





@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .header-sticky.tp-header-9-sticky {
    padding: 10px 0;
  }
}

.header-sticky.tp-header-border {
  border-bottom: 0;
}

.header-sticky .tp-header-logo {
  padding: 0;
}

.header-sticky .tp-header-7-wrapper {
  padding: 0;
  padding-right: 0;
  border-radius: 0;
  background: initial;
  border: none;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .header-sticky .tp-header-7-wrapper {
    padding: 10px 0;
  }
}

.header-sticky.tp-header-9-sticky .tp-header-9-logo .logo-1 {
  display: none;
}

.header-sticky.tp-header-9-sticky .tp-header-9-logo .logo-2 {
  display: block !important;
}

.header-sticky.tp-header-9-sticky .tp-header-9-menu>nav>ul>li>a {
  padding: 25px 0;
  margin: 0 15px;
  color: var(--tp-common-black);
}

.header-sticky.tp-header-9-sticky .tp-header-9-menu>nav>ul>li {
  padding: 0;
}

.header-sticky.tp-header-9-sticky .tp-header-9-menu>nav>ul {
  padding: 0;
}

.header-sticky.tp-header-9-sticky .tp-header-9-box {
  margin-left: 0;
}

.header-sticky.tp-header-9-sticky .tp-header-9-search span {
  color: var(--tp-common-black);
}

.header-sticky.tp-header-9-sticky .tp-header-9-btn .tp-btn-yellow-green {
  color: #fff;
  background-color: #2A4C3A;
}

.header-sticky.tp-header-10-sticky .tp-header-10-wrapper {
  margin-top: 0;
  border-radius: 0;
  border: 0;
  box-shadow: none;
  background: transparent;
}

.header-sticky.tp-header-11-style .tp-header-10-wrapper {
  border: 0;
  background: 0;
  margin-top: 0;
  box-shadow: none;
  backdrop-filter: initial;
}

.header-sticky.tp-header-inner-style .tp-header-menu>nav>ul {
  padding: 0;
  border-radius: 0;
  display: inline-block;
  margin-bottom: 0;
  background-color: transparent;
}

.header-sticky.tp-header-inner-style .tp-header-dropdown nav ul li .tp-submenu {
  top: 104%;
}

.header-sticky.tp-header-inner-style .tp-megamenu-wrapper {
  top: 104%;
}

.sticky-white-bg .tp-megamenu-list ul li a span {
  font-weight: 700;
}

.sticky-white-bg .tp-megamenu-list ul li a span.new {
  color: rgb(182, 74, 222);
  background: rgba(182, 74, 222, 0.08);
}

.sticky-white-bg .tp-megamenu-list ul li a span.pop {
  color: #0db50e;
  background-color: rgba(13, 181, 14, 0.08);
}

.tp-header-dropdown nav ul li {
  position: relative;
  list-style: none;
}

.tp-header-dropdown nav ul li.p-static {
  position: static;
}

.tp-header-dropdown nav ul li.has-dropdown::after {
  content: "\f107";
  font-size: 16px;
  font-weight: 400;
  margin-left: 2px;
  display: inline-block;
  color: var(--tp-common-white);
  transition: all 0.3s 0s ease-out;
  font-family: var(--tp-ff-fontawesome);
}

.tp-header-dropdown nav ul li.has-dropdown:hover::after {
  transform: rotate(-180deg);
}

.tp-header-dropdown nav ul li .tp-submenu {
  position: absolute;
  top: 100%;
  left: 0;
  width: 260px;
  z-index: 99;
  opacity: 0;
  padding: 12px 0;
  transition: 0.5s;
  text-align: start;
  visibility: hidden;
  border-radius: 14px;
  transform-origin: 0 0;
  transform: scale(1, 0);
  backdrop-filter: blur(40px);
  background: rgba(38, 37, 40, 0.9);
  box-shadow: 0 20px 30px -8px rgba(19, 19, 22, 0.1);
}

.tp-header-dropdown nav ul li .tp-submenu li {
  width: 100%;
  padding: 0 12px;
  border-radius: 8px;
}

.tp-header-dropdown nav ul li .tp-submenu li a {
  position: relative;
  border-radius: 8px;
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  color: #bfbfc0;
  padding: 12px 18px;
  display: inline-block;
  letter-spacing: -0.01em;
  text-align: start;
  width: 100%;
}

@media only screen and (min-width: 1600px) and (max-width: 1700px),
only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-header-dropdown nav ul li .tp-submenu li a {
    font-size: 14px;
  }
}

.tp-header-dropdown nav ul li .tp-submenu li .tp-submenu {
  top: 0;
  left: 100%;
}

.tp-header-dropdown nav ul li .tp-submenu li:hover>a {
  background-color: #2c2b2e;
  color: var(--tp-common-white);
}

.tp-header-dropdown nav ul li .tp-submenu li.menu-item-has-children>a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.tp-header-dropdown nav ul li .tp-submenu li.menu-item-has-children>a::after {
  content: "\f107";
  font-size: 16px;
  font-weight: 400;
  margin-left: 2px;
  color: #bfbfc0;
  display: inline-block;
  transform: rotate(-90deg);
  transition: all 0.3s 0s ease-out;
  font-family: var(--tp-ff-fontawesome);
}

.tp-header-dropdown nav ul li .tp-submenu li.menu-item-has-children:hover a::after {
  transform: rotate(0deg);
  color: var(--tp-common-white);
}

.tp-header-dropdown nav ul li:hover>.tp-submenu {
  visibility: visible;
  opacity: 1;
  transform: scale(1);
}

.tp-header-dropdown nav ul li:hover>.tp-megamenu-wrapper {
  visibility: visible;
  opacity: 1;
  transition-duration: 0.2s;
  -webkit-transform: perspective(300px) rotateX(0deg);
  -moz-transform: perspective(300px) rotateX(0deg);
  -ms-transform: perspective(300px) rotateX(0deg);
  -o-transform: perspective(300px) rotateX(0deg);
  transform: perspective(300px) rotateX(0deg);
}

.tp-megamenu-wrapper {
  position: absolute;
  transition: 0.3s;
  opacity: 0;
  visibility: hidden;
  padding-top: 45px;
  top: 100%;
  left: 0;
  right: 0;
  max-width: 1760px;
  margin: 0 auto;
  overflow: hidden;
  border-radius: 14px;
  transform-origin: top;
  transition-duration: 0.1s;
  -webkit-transform: perspective(300px) rotateX(-18deg);
  -moz-transform: perspective(300px) rotateX(-18deg);
  -ms-transform: perspective(300px) rotateX(-18deg);
  -o-transform: perspective(300px) rotateX(-18deg);
  transform: perspective(300px) rotateX(-18deg);
}

@media only screen and (min-width: 1600px) and (max-width: 1700px),
only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-megamenu-wrapper {
    max-width: calc(100% - 40px);
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-megamenu-wrapper {
    padding-top: 25px;
  }
}

.tp-megamenu-wrapper.megamenu-black-bg {
  backdrop-filter: blur(40px);
  background: rgba(38, 37, 40, 0.9);
  box-shadow: 0 20px 30px -8px rgba(19, 19, 22, 0.1);
}

.tp-megamenu-wrapper.megamenu-white-bg {
  backdrop-filter: blur(40px);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 2px 6px 0 rgba(19, 19, 22, 0.1);
}

.tp-megamenu-wrapper.megamenu-white-bg .tp-megamenu-title {
  color: #111013;
  border-bottom: 1px solid #F3F3F6;
}

.tp-megamenu-wrapper.megamenu-white-bg .tp-megamenu-list ul::after {
  background-color: #F3F3F6;
}

.tp-megamenu-wrapper.megamenu-white-bg .tp-megamenu-list ul li a {
  color: #636368;
}

.tp-megamenu-wrapper.megamenu-white-bg .tp-megamenu-list ul li a:hover {
  background-color: #f8f8fb;
  color: var(--tp-common-black);
}

.tp-megamenu-title {
  font-weight: 600;
  font-size: 13px;
  line-height: 1;
  margin-bottom: 0;
  padding-left: 40px;
  padding-bottom: 25px;
  text-align: start;

  color: var(--tp-common-white);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-megamenu-title {
    padding-left: 23px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-megamenu-title {
    padding-left: 20px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-megamenu-title {
    padding-left: 20px;
  }
}

.tp-megamenu-list {
  height: 100%;
}

.tp-megamenu-list ul {
  position: relative;
  height: 100%;
  padding-top: 18px;
  padding-bottom: 50px;
}

.tp-megamenu-list ul::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 1px;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.06);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-megamenu-list ul::after {
    display: none;
  }
}

.tp-megamenu-list ul li {
  padding: 0px 20px;
}

@media only screen and (min-width: 1600px) and (max-width: 1700px),
only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-megamenu-list ul li {
    padding: 0px 10px;
  }
}

.tp-megamenu-list ul li:not(:last-child) {
  margin-bottom: 10px;
}

.tp-megamenu-list ul li a {
  position: relative;
  width: 100%;
  font-weight: 600;
  font-size: 16px;
  line-height: 1;
  color: #bfbfc0;
  padding: 12px 18px;
  border-radius: 8px;
  display: inline-block;
  letter-spacing: -0.01em;
  text-align: start;
}

@media only screen and (min-width: 1701px) and (max-width: 1800px),
only screen and (min-width: 1600px) and (max-width: 1700px) {
  .tp-megamenu-list ul li a {
    font-size: 14px;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-megamenu-list ul li a {
    font-size: 14px;
    padding: 12px 12px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-megamenu-list ul li a {
    font-size: 14px;
    padding: 12px 8px;
  }
}

.tp-megamenu-list ul li a span {
  font-size: 13px;
  line-height: 1;
  font-weight: 800;
  padding: 6px 8px;
  border-radius: 20px;
  display: inline-block;
  margin-left: 3px;

  letter-spacing: 0.7px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-megamenu-list ul li a span {
    font-size: 8px;
    padding: 5px 6px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-megamenu-list ul li a span {
    display: none;
  }
}

.tp-megamenu-list ul li a span.hot {
  color: #FF535B;
  background-color: rgba(255, 83, 91, 0.08);
}

.tp-megamenu-list ul li a span.new {
  color: #fff669;
  background-color: rgba(255, 246, 105, 0.08);
}

.tp-megamenu-list ul li a span.pop {
  color: #19e41a;
  background-color: rgba(25, 228, 26, 0.08);
}

.tp-megamenu-list ul li a:hover {
  background-color: #2c2b2e;
  color: var(--tp-common-white);
}

.tp-megamenu-thumb {
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  width: 17%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-megamenu-thumb {
    display: none;
  }
}

.tp-megamenu-thumb img {
  height: 100%;
  object-fit: cover;
  width: 100%;
  overflow: hidden;
}

.dropdown-white-bg nav ul li .tp-submenu {
  background: rgba(255, 255, 255, 0.9);
}

.dropdown-white-bg nav ul li .tp-submenu li a {
  color: #636368;
}

.dropdown-white-bg nav ul li .tp-submenu li:hover>a {
  background-color: #F8F8FB;
  color: var(--tp-common-black);
}

.dropdown-white-bg nav ul li .tp-submenu li.menu-item-has-children>a::after {
  color: #636368;
}

.dropdown-white-bg nav ul li .tp-submenu li.menu-item-has-children:hover>a::after {
  color: var(--tp-common-black);
}

/*----------------------------------------*/
/*  4.2 Mobile Menu
/*----------------------------------------*/
.tp-offcanvas-menu {
  margin-bottom: 14px;
}

.tp-offcanvas-menu ul {
  list-style: none;
}

.tp-offcanvas-menu ul li {
  position: relative;
}

.tp-offcanvas-menu ul li>a {
  padding: 10px 0;
  display: block;
  font-size: 20px;
  font-weight: 500;
}

.tp-offcanvas-menu ul li.active>a {
  color: var(--tp-common-secondary);
}

.tp-offcanvas-menu ul li.active>.tp-menu-close i {
  top: 10px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}

.tp-offcanvas-menu ul li .submenu {
  display: none;
}

.tp-offcanvas-menu ul li .submenu .submenu {
  margin-left: 30px;
}

.tp-offcanvas-menu .tp-megamenu-wrapper.megamenu-white-bg {
  backdrop-filter: none;
  background: transparent;
  box-shadow: none;
}

.tp-offcanvas-menu .mega-menu {
  width: auto;
  opacity: 1;
  visibility: visible;
  transition: none;
  position: static;
  display: none;
  -webkit-transform: perspective(0) rotateX(0);
  -moz-transform: perspective(0) rotateX(0);
  -ms-transform: perspective(0) rotateX(0);
  -o-transform: perspective(0) rotateX(0);
  transform: perspective(0) rotateX(0);
}

.tp-offcanvas-menu .tp-megamenu-list ul li {
  padding: 0;
}

.tp-offcanvas-menu .tp-megamenu-list ul li a {
  padding: 8px 20px;
  font-size: 17px;
}

.tp-offcanvas-menu .tp-submenu li a {
  padding: 8px 20px;
  border-radius: 10px;
  font-size: 17px;
}

.tp-offcanvas-menu .tp-submenu li a:hover {
  background-color: #f8f8fb;
  color: var(--tp-common-black);
}

.tp-menu-close {
  position: absolute;
  right: 7px;
  top: 12px;
}

.tp-menu-close i {
  transition: all 0.3s;
  font-size: 18px;
  font-weight: 500;
}

.menu-item-has-children .tp-menu-close {
  right: 14px;
  top: 9px;
}

/*----------------------------------------*/
/*  4.3 offcanvas Menu
/*----------------------------------------*/
.body-overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  width: 100%;
  height: 100%;
  visibility: hidden;
  opacity: 0;
  transition: 0.45s ease-in-out;
  background: rgba(24, 24, 24, 0.4);
}

.body-overlay.opened {
  opacity: 1;
  visibility: visible;
}

.tp-offcanvas-wrapper {
  position: fixed;
  top: 0;
  right: 0;
  width: 450px;
  height: 100vh;
  z-index: 999;
  padding: 50px 34px;
  overflow-y: scroll;
  transition: all 0.3s;
  background: #FFF;
  overscroll-behavior-y: contain;
  -webkit-transform: translateX(calc(100% + 80px));
  -moz-transform: translateX(calc(100% + 80px));
  -ms-transform: translateX(calc(100% + 80px));
  -o-transform: translateX(calc(100% + 80px));
  transform: translateX(calc(100% + 80px));
}

@media (max-width: 767px) {
  .tp-offcanvas-wrapper {
    width: 100%;
    padding: 24px 24px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-offcanvas-wrapper {
    width: 450px;
  }
}

.tp-offcanvas-wrapper .logo-2 {
  display: none;
}

.tp-offcanvas-wrapper.offcanvas-black-bg {
  background: #1C1D20;
}

.tp-offcanvas-wrapper.offcanvas-black-bg .logo-1 {
  display: none;
}

.tp-offcanvas-wrapper.offcanvas-black-bg .logo-2 {
  display: block !important;
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-close-btn {
  color: var(--tp-common-white);
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-menu ul li>a {
  color: var(--tp-common-white);
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-menu ul li.active>a {
  color: var(--tp-common-secondary);
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-menu .tp-submenu li a:hover {
  background-color: #2c2b2e;
  color: var(--tp-common-white);
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-menu-close i {
  color: var(--tp-common-white);
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-megamenu-wrapper.megamenu-black-bg {
  backdrop-filter: initial;
  background: transparent;
  box-shadow: none;
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-title.sm {
  color: var(--tp-common-white);
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-contact ul li a {
  color: rgba(255, 255, 255, 0.8);
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-contact ul li a:hover {
  color: var(--tp-common-white);
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-contact ul li a::after {
  background-color: var(--tp-common-white);
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-social ul li a {
  color: var(--tp-common-white);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-social ul li a:hover {
  color: var(--tp-common-black);
  border-color: var(--tp-common-white);
  background-color: var(--tp-common-white);
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-title {
  color: var(--tp-common-white);
}

.tp-offcanvas-wrapper.offcanvas-black-bg .tp-offcanvas-content p {
  color: rgba(255, 255, 255, 0.8);
}

.tp-offcanvas-area.opened .tp-offcanvas-wrapper {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
}

.tp-offcanvas-top {
  margin-bottom: 40px;

}

.tp-offcanvas-close-btn {
  color: black;
}

.tp-offcanvas-close-btn:hover {
  opacity: 1;
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

.tp-offcanvas-content {
  margin-bottom: 45px;
}

.tp-offcanvas-content p {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: #414144;
}

.tp-offcanvas-title {
  font-size: 40px;
  line-height: 1;
  letter-spacing: -0.8px;
  font-weight: 700;
  margin-bottom: 15px;
  color: var(--tp-common-black);
}

.tp-offcanvas-title.sm {
  font-size: 20px;
  font-weight: 700 !important;
  margin-bottom: 15px;

  color: var(--tp-common-black);
}

.tp-offcanvas-gallery {
  margin-bottom: 65px;
}

.tp-offcanvas-gallery-img img {
  transition: 0.9s;
}

.tp-offcanvas-gallery-img:hover img {
  transform: scale(1.2) rotate(-2deg);
}

.tp-offcanvas-contact {
  margin-bottom: 55px;
}

.tp-offcanvas-contact ul li {
  list-style: none;
}

.tp-offcanvas-contact ul li:not(:last-child) {
  margin-bottom: 2px;
}

.tp-offcanvas-contact ul li a {
  display: inline-block;
  color: #414144;
  font-size: 16px;
  position: relative;
}

.tp-offcanvas-contact ul li a::after {
  position: absolute;
  bottom: 2px;
  right: 0;
  width: 0;
  height: 1px;
  content: "";
  transition: 0.4s;
  background-color: #1e1e1e;
}

.tp-offcanvas-contact ul li a:hover {
  color: var(--tp-common-black);
}

.tp-offcanvas-contact ul li a:hover::after {
  width: 100%;
  right: auto;
  left: 0;
}

.tp-offcanvas-social ul {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
}

.tp-offcanvas-social ul li {
  list-style: none;
}

.tp-offcanvas-social ul li:not(:last-child) {
  margin-right: 8px;
}

.tp-offcanvas-social ul li a {
  display: inline-block;
  text-align: center;
  width: 40px;
  height: 40px;
  line-height: 38px;
  border-radius: 40px;
  transition: all 0.3s;
  color: var(--tp-common-black);
  border: 1px solid rgba(2, 11, 24, 0.1);
}

.tp-offcanvas-social ul li a:hover {
  background-color: var(--tp-common-black);
  border-color: var(--tp-common-black);
  color: var(--tp-common-white);
}

.tp-offcanvas-social ul li a svg {
  -webkit-transform: translateY(-1px);
  -moz-transform: translateY(-1px);
  -ms-transform: translateY(-1px);
  -o-transform: translateY(-1px);
  transform: translateY(-1px);
}

.tp-offcanvas-2-area {
  position: relative;
}

.tp-offcanvas-2-area.opened .animated-text>nav>ul>li a::after {
  visibility: visible;
  opacity: 1;
  bottom: 35px;
}

.tp-offcanvas-2-area.opened .animated-text>nav>ul>li a::before {
  width: 100%;
}

.tp-offcanvas-2-area.opened .animated-text>nav>ul>li a .tp-text-hover-effect-word .single-char span {
  -webkit-transform: translateZ(0.1px);
  -moz-transform: translateZ(0.1px);
  -ms-transform: translateZ(0.1px);
  -o-transform: translateZ(0.1px);
  transform: translateZ(0.1px);
}

.tp-offcanvas-2-area.opened .tp-offcanvas-2-left,
.tp-offcanvas-2-area.opened .tp-offcanvas-2-right {
  visibility: visible;
  opacity: 1;
}

.tp-offcanvas-2-area.opened .tp-offcanvas-2-wrapper {
  visibility: visible;
  opacity: 1;
}

.tp-offcanvas-2-area.opened .tp-offcanvas-2-bg.is-left,
.tp-offcanvas-2-area.opened .tp-offcanvas-2-bg.is-right {
  -webkit-transform: scale(1, 1);
  -moz-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -o-transform: scale(1, 1);
  transform: scale(1, 1);
  transition-delay: 0s;
}

.tp-offcanvas-2-area.opened .tp-offcanvas-2-menu {
  transition-delay: 0s;
}

.tp-offcanvas-2-area.opened .tp-offcanvas-2-close {
  visibility: visible;
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
  transition-delay: 0.9s;
}

.tp-offcanvas-2-area .tp-offcanvas-menu>nav>ul>li>a {
  font-weight: 700;
  font-size: 50px;
  line-height: 1;
  color: #717172;
  letter-spacing: -0.02em;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-offcanvas-2-area .tp-offcanvas-menu>nav>ul>li>a {
    font-size: 35px;
  }
}

@media (max-width: 767px) {
  .tp-offcanvas-2-area .tp-offcanvas-menu>nav>ul>li>a {
    font-size: 30px;
  }
}

.tp-offcanvas-2-area .tp-offcanvas-menu>nav>ul>li>a::after {
  position: absolute;
  left: 0;
  top: 3px;
  font-weight: 500;
  font-size: 13px;
  content: "0" counter(count);
  counter-increment: count;
  color: rgba(113, 113, 114, 0.8);
}

.tp-offcanvas-2-area .tp-offcanvas-menu>nav>ul>li.is-active>a {
  color: var(--tp-common-white);
}

.tp-offcanvas-2-area .tp-offcanvas-menu>nav>ul>li.is-active .tp-menu-close i {
  color: var(--tp-common-white);
}

.tp-offcanvas-2-area .tp-offcanvas-menu>nav>ul>li>ul>li>a {
  font-weight: 600;
  font-size: 30px;
  line-height: 1;
  transition: 0.3s;
  color: #717172;
  letter-spacing: -0.02em;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-offcanvas-2-area .tp-offcanvas-menu>nav>ul>li>ul>li>a {
    font-size: 20px;
  }
}

.tp-offcanvas-2-area .tp-offcanvas-menu>nav>ul>li>ul>li>a:hover {
  transform: translateX(15px);
  color: var(--tp-common-white);
}

.tp-offcanvas-2-area .tp-offcanvas-menu .tp-submenu li a:hover {
  background-color: initial;
  color: var(--tp-common-white);
}

.tp-offcanvas-2-area .tp-offcanvas-menu ul li:not(:last-child)>a {
  border-bottom: 0;
}

.tp-offcanvas-2-area .tp-offcanvas-menu ul li>a {
  padding: 0;
  padding-left: 30px;
}

.tp-offcanvas-2-area .tp-offcanvas-menu ul>li:not(:last-child) {
  margin-bottom: 45px;
}

.tp-offcanvas-2-area .tp-offcanvas-menu ul li .submenu {
  padding-left: 20px;
  margin-top: 40px;
  margin-bottom: 56px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-offcanvas-2-area .tp-offcanvas-menu ul li .submenu {
    padding-left: 0;
  }
}

.tp-offcanvas-2-area .tp-offcanvas-menu ul li .submenu li:not(:last-child) {
  margin-bottom: 30px;
}

.tp-offcanvas-2-area.offcanvas-2-white-bg .tp-offcanvas-2-bg.is-left {
  background: var(--tp-common-white);
}

.tp-offcanvas-2-area.offcanvas-2-white-bg .tp-offcanvas-2-logo .logo-1 {
  display: none;
}

.logo-1 {
  width: 300px;
}

@media (max-width: 767px) {
  .logo-1 {
    width: 190px;
  }
}

.tp-offcanvas-2-area.offcanvas-2-white-bg .tp-offcanvas-menu>nav>ul>li.is-active>a {
  color: var(--tp-common-black);
}

.tp-offcanvas-2-area.offcanvas-2-white-bg .tp-offcanvas-menu>nav>ul>li.is-active .tp-menu-close i {
  color: var(--tp-common-black);
}

.tp-offcanvas-2-area.offcanvas-2-white-bg .tp-offcanvas-menu>nav>ul>li>a {
  color: #D5D5D5;
}

.tp-offcanvas-2-area.offcanvas-2-white-bg .tp-offcanvas-menu>nav>ul>li>ul>li>a {
  color: var(--tp-common-black);
}

.tp-offcanvas-2-area.offcanvas-2-white-bg .tp-offcanvas-menu .tp-submenu li a:hover {
  background-color: initial;
  color: var(--tp-common-black);
}

.tp-offcanvas-2-area.offcanvas-2-white-bg .tp-offcanvas-2-bg.is-right {
  background-color: #F6F6F9;
}

.tp-offcanvas-2-area.offcanvas-2-white-bg .tp-offcanvas-2-right-info-title {
  color: var(--tp-common-black);
}

.tp-offcanvas-2-area.offcanvas-2-white-bg .tp-offcanvas-2-right-info-item>a {
  color: var(--tp-common-black);
}

.tp-offcanvas-2-area.offcanvas-2-white-bg .tp-offcanvas-2-right-social a {
  color: var(--tp-common-black);
  border: 1px solid rgba(0, 0, 0, 0.1);
}

.tp-offcanvas-2-area.offcanvas-2-white-bg .tp-offcanvas-2-right-social a:hover {
  color: var(--tp-common-white);
  border-color: var(--tp-common-black);
  background-color: var(--tp-common-black);
}

.tp-offcanvas-2-area.offcanvas-2-white-bg .tp-offcanvas-2-close-btn .text {
  color: var(--tp-common-black);
}

.tp-offcanvas-2-area.offcanvas-2-white-bg .tp-offcanvas-2-close-btn {
  color: var(--tp-common-black);
}

.tp-offcanvas-2-area.offcanvas-2-black-bg .tp-offcanvas-2-logo .logo-2 {
  display: none !important;
}

.tp-offcanvas-2-bg.left-box {
  position: fixed;
  top: 0;
  height: 100%;
  width: 60%;
  -webkit-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
  -moz-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
  -ms-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
  -o-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
  transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
  z-index: 1111;
}

@media (max-width: 767px) {
  .tp-offcanvas-2-bg.left-box {
    width: 100%;
  }
}

.tp-offcanvas-2-bg.right-box {
  position: fixed;
  top: 0;
  height: 100%;
  width: 40%;
  -webkit-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
  -moz-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
  -ms-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
  -o-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
  transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
  z-index: 1111;
}

@media (max-width: 767px) {
  .tp-offcanvas-2-bg.right-box {
    width: 100%;
  }
}

.tp-offcanvas-2-bg.is-left {
  left: 0;
  -webkit-transform: scale(1, 0);
  -moz-transform: scale(1, 0);
  -ms-transform: scale(1, 0);
  -o-transform: scale(1, 0);
  transform: scale(1, 0);
  transform-origin: top center;
  background: var(--tp-common-black);
  transition-delay: 1s;
}

.tp-offcanvas-2-bg.is-right {
  right: 0;
  transform-origin: bottom center;
  -webkit-transform: scale(1, 0);
  -moz-transform: scale(1, 0);
  -ms-transform: scale(1, 0);
  -o-transform: scale(1, 0);
  transform: scale(1, 0);
  background-color: #1C1D20;
  transition-delay: 1s;
}

.tp-offcanvas-2-wrapper .left-box {
  position: fixed;
  top: 0;
  width: 60%;
  height: 100vh;
  z-index: 9999;
  overflow-y: scroll;
  pointer-events: auto;
  scrollbar-width: none;
  padding: 40px 80px 50px 80px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-offcanvas-2-wrapper .left-box {
    padding: 40px 40px;
  }
}

@media (max-width: 767px) {
  .tp-offcanvas-2-wrapper .left-box {
    width: 100%;
    padding: 40px 40px;
  }
}

.tp-offcanvas-2-wrapper .left-box .tp-offcanvas-menu {
  padding: 0px 125px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-offcanvas-2-wrapper .left-box .tp-offcanvas-menu {
    padding: 0 70px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-offcanvas-2-wrapper .left-box .tp-offcanvas-menu {
    padding: 0 20px;
  }
}

@media (max-width: 767px) {
  .tp-offcanvas-2-wrapper .left-box .tp-offcanvas-menu {
    padding: 0;
  }
}

.tp-offcanvas-2-wrapper .right-box {
  position: fixed;
  top: 0;
  width: 40%;
  height: 100vh;
  z-index: 9999;
  padding: 50px 100px 50px 0;
  scrollbar-width: none;
  overscroll-behavior-y: contain;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-offcanvas-2-wrapper .right-box {
    padding-right: 40px;
  }
}

.tp-offcanvas-2-wrapper .right-box::-webkit-scrollbar {
  display: none;
}

@media (max-width: 767px) {
  .tp-offcanvas-2-wrapper .right-box {
    width: 100%;
  }
}

.tp-offcanvas-2-wrapper .tp-menu-close {
  top: 10px;
  height: 0;
  width: 0;
}

@media (max-width: 767px) {
  .tp-offcanvas-2-wrapper .tp-menu-close {
    top: 0;
    right: 20px;
  }
}

.tp-offcanvas-2-wrapper .tp-menu-close i {
  font-size: 20px;
  color: #717172;
}

.tp-offcanvas-2-left {
  visibility: hidden;
  opacity: 0;
  left: 0;
  transition: 0.3s;
  transition-delay: 0.8s;
}

@media (max-width: 767px) {
  .tp-offcanvas-2-left-wrap {
    margin-bottom: 80px;
  }
}

.tp-offcanvas-2-right {
  visibility: hidden;
  opacity: 0;
  right: 0;
  transition: 0.3s;
  transition-delay: 0.8s;
}

.tp-offcanvas-2-right-inner {
  height: 100%;
  padding: 100px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-offcanvas-2-right-inner {
    padding-left: 50px;
    padding-right: 50px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-offcanvas-2-right-inner {
    padding: 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-offcanvas-2-right-inner {
    padding: 30px;
  }
}

.tp-offcanvas-2-right-info-box {
  padding: 0 200px;
}

@media only screen and (min-width: 1801px) and (max-width: 1850px),
only screen and (min-width: 1701px) and (max-width: 1800px) {
  .tp-offcanvas-2-right-info-box {
    padding-right: 100px;
  }
}

@media only screen and (min-width: 1600px) and (max-width: 1700px),
only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-offcanvas-2-right-info-box {
    padding: 0 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-offcanvas-2-right-info-box {
    padding: 0 100px;
    padding-right: 0;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-offcanvas-2-right-info-box {
    padding: 0 70px;
    padding-right: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-offcanvas-2-right-info-box {
    padding: 0 60px;
    padding-right: 0;
    margin-top: 130px;
  }
}

.tp-offcanvas-2-right-info-title {
  font-weight: 700;
  font-size: 30px;
  line-height: 1;
  margin-bottom: 35px;
  color: var(--tp-common-white);
}

.tp-offcanvas-2-right-info-item {
  margin-bottom: 30px;
}

.tp-offcanvas-2-right-info-item label {
  font-weight: 500;
  font-size: 15px;
  line-height: 1;
  display: block;
  color: #717172;
}

.tp-offcanvas-2-right-info-item>a {
  font-weight: 600;
  font-size: 18px;
  line-height: 1;
  letter-spacing: -0.01em;
  color: var(--tp-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-offcanvas-2-right-info-item>a br {
    display: none;
  }
}

.tp-offcanvas-2-right-social a {
  height: 40px;
  width: 40px;
  transition: 0.3s;
  line-height: 35px;
  text-align: center;
  border-radius: 50%;
  display: inline-block;
  color: var(--tp-common-white);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.tp-offcanvas-2-right-social a:hover {
  color: var(--tp-common-black);
  border-color: var(--tp-common-white);
  background-color: var(--tp-common-white);
}

.tp-offcanvas-2-close {
  visibility: hidden;
  opacity: 0;
  transition: 0.3s;
  transition-delay: 0.5s;
  -webkit-transform: translateY(20px);
  -moz-transform: translateY(20px);
  -ms-transform: translateY(20px);
  -o-transform: translateY(20px);
  transform: translateY(20px);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-offcanvas-2-close {
    padding-right: 30px;
  }
}

.tp-offcanvas-2-close-btn {
  font-size: 14px;
  font-weight: 500;

  color: var(--tp-common-white);
}

.tp-offcanvas-2-close-btn .text {
  width: 60px;
  height: 20px;
  transition: 0.3s;
  overflow: hidden;
  display: inline-block;
  transform: translateY(4px);
  color: var(--tp-common-white);
}

.tp-offcanvas-2-close-btn .text span {
  transition: 0.3s;
  display: inline-block;
  -webkit-transform: translateX(120%);
  -moz-transform: translateX(120%);
  -ms-transform: translateX(120%);
  -o-transform: translateX(120%);
  transform: translateX(120%);
}

.tp-offcanvas-2-close-btn:hover .text span {
  transform: translateX(0%);
}

.tp-offcanvas-2-close-btn:hover span svg {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

.tp-offcanvas-2-text {
  right: 0;
  bottom: 0;
  position: absolute;
  transform: rotate(-90deg) translateY(100%);
}

.tp-offcanvas-2-text span {
  font-size: 320px;
  font-weight: 700;
  color: rgba(33, 35, 41, 0.3);
}

.tp-offcanvas-2-logo {
  margin-bottom: 105px;
}

@media (max-width: 767px) {
  .tp-offcanvas-2-logo {
    margin-bottom: 0;
  }
}

.tp-offcanvas-2-logo .logo-2 {
  display: block !important;
}



.basic-pagination {
  margin-bottom: 40px;
}

.basic-pagination ul li {
  list-style: none;
  display: inline-block;
  margin-right: 5px;
}

@media (max-width: 767px) {
  .basic-pagination ul li {
    margin-right: 5px;
  }
}

.basic-pagination ul li:hover a {
  border-color: #D0FF71;
  background-color: #D0FF71;
  color: var(--tp-common-black);
}

.basic-pagination ul li>a {
  height: 50px;
  width: 50px;
  line-height: 49px;
  text-align: center;
  font-weight: 600;
  font-size: 16px;
  border-radius: 50%;
  display: inline-block;
  color: var(--tp-common-white);
  transition: all 0.3s ease-in-out;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.basic-pagination ul li .current {
  height: 50px;
  width: 50px;
  font-weight: 600;
  line-height: 49px;
  text-align: center;
  font-size: 16px;
  border-radius: 50%;
  display: inline-block;
  border-color: #D0FF71;
  background-color: #D0FF71;
  color: var(--tp-common-black);
  transition: all 0.3s ease-in-out;
}

.basic-pagination-label span {
  font-weight: 500;
  font-size: 15px;
  line-height: 1.33;
  color: #525356;
  display: inline-block;
}

@media (max-width: 767px) {
  .basic-pagination-label span {
    margin-bottom: 15px;
  }
}

.basic-pagination.product-pagination ul li>a {
  color: #4d3d30;
  border: 1px solid rgb(77, 61, 48);
}

.basic-pagination.product-pagination ul li:hover a {
  background-color: #4d3d30;
  color: var(--tp-common-white);
}

.basic-pagination.product-pagination ul li .current {
  background-color: #4d3d30;
  color: var(--tp-common-white);
}



/*----------------------------------------*/
/*  5.2 Recent Post css
/*----------------------------------------*/
.rc-post-thumb {
  flex: 0 0 auto;
  overflow: hidden;
  margin-right: 30px;
  border-radius: 14px;
}

.rc-post-thumb img {
  transition: 0.9s;
  border-radius: 14px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .rc-post-thumb img {
    height: 100px;
    width: 100px;
  }
}

.rc-post:hover .rc-post-thumb img {
  transform: scale(1.1);
}






.rc-post-meta span {
  font-weight: 600;
  font-size: 13px;
  line-height: 1;
  color: rgba(255, 255, 255, 0.6);
}

.rc-post-wrap .rc-post:not(:last-child) {
  padding-bottom: 25px;
  margin-bottom: 25px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/*----------------------------------------*/
/*  5.3 Sidebar css
/*----------------------------------------*/


.sidebar-wrapper {
  padding-left: 35px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .sidebar-wrapper {
    padding-left: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .sidebar-wrapper {
    padding-left: 0;
    margin-top: 70px;
  }
}

.sidebar-blog-grid-wrap .sidebar-wrapper {
  padding-left: 2px;
}










/* Who We Serve tweaks */
.who-serve-card {
  padding: 32px 28px;
  margin-bottom: 24px;
  border: 1px solid #e0e7ff;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 12px 40px rgba(9, 44, 76, 0.06);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.who-serve-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 50px rgba(9, 44, 76, 0.12);
}

.who-serve-info {
  gap: 28px;
}

.who-serve-thumb {
  border-radius: 12px;
  overflow: hidden;
  width: 100%;
  max-width: 260px;
}

.who-serve-thumb img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
}

@media (max-width: 991px) {
  .who-serve-card {
    padding: 26px 22px;
  }

  .who-serve-thumb {
    max-width: 100%;
    margin-top: 20px;
  }

  .who-serve-thumb img {
    height: 220px;
  }
}

@media (max-width: 767px) {
  .who-serve-info {
    gap: 18px;
  }

  .who-serve-thumb img {
    height: 260px;
  }
}








.crp-blog-shape {
  position: absolute;
  top: 145px;
  right: 0;
  z-index: -1;
}

.crp-blog-title {
  font-weight: 600;
  font-size: 180px;
  line-height: 0.7;
  margin-bottom: 0;
  opacity: 0.1;
  margin-left: -100px;
  letter-spacing: -0.02em;

  writing-mode: vertical-lr;
  transform: translateY(-40px) rotate(180deg);
  font-family: var(--tp-ff-inter);
  color: var(--tp-common-cream-3);
}

@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .crp-blog-title {
    font-size: 175px;
    margin-left: 0;
    transform: translateY(0);
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .crp-blog-title {
    font-size: 150px;
    margin-left: 0;
    transform: translateY(0);
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .crp-blog-title {
    margin-left: 0;
    font-size: 110px;
    margin-bottom: 40px;
    writing-mode: inherit;
    transform: translateY(0);
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .crp-blog-title {
    margin-left: 0;
    font-size: 84px;
    margin-bottom: 40px;
    writing-mode: inherit;
    transform: translateY(0px);
  }
}

@media (max-width: 767px) {
  .crp-blog-title {
    font-size: 67px;
    margin-left: 0;
    margin-bottom: 40px;
    writing-mode: inherit;
    transform: translateY(0px);
  }
}

.crp-blog-title-sm {
  font-weight: 500;
  font-size: 54px;
  line-height: 1;
  margin-bottom: 30px;
  letter-spacing: -0.02em;
  font-family: var(--tp-ff-inter);
  color: var(--tp-common-cream-3);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .crp-blog-title-sm {
    font-size: 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .crp-blog-title-sm {
    font-size: 35px;
  }
}

.crp-blog-meta {
  font-weight: 600;
  font-size: 15px;
  line-height: 1;
  margin-bottom: 22px;
  display: inline-block;
  color: var(--tp-common-cream-3);
}

.crp-blog-thumb {
  /* border-radius: 20px; */
  overflow: hidden;
}

.crp-blog-thumb img {
  width: 100%;
  height: 350px;
  transition: 0.9s;
  /* border-radius: 20px; */
  object-fit: cover;
}

.crp-blog-thumb:hover img {
  transform: scale(1.1) rotate(-2deg);
}

.crp-blog-category span {
  font-weight: 600;
  font-size: 12px;
  line-height: 1;
  transition: 0.3s;
  padding: 7px 18px;
  border-radius: 10px;
  display: inline-block;

  color: var(--tp-common-cream-3);
  border: 1px solid rgba(255, 255, 230, 0.1);
}

.crp-blog-category span:not(:last-child) {
  margin-right: 7px;
}

.crp-blog-category span:hover {
  background-color: rgba(255, 255, 230, 0.1);
}

@media (max-width: 767px) {
  .crp-blog-item {
    flex-wrap: wrap;
  }
}

.crp-blog-content {
  margin-left: 55px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .crp-blog-content {
    margin-left: 40px;
  }
}

@media (max-width: 767px) {
  .crp-blog-content {
    margin-left: 0;
  }
}

@media (max-width: 767px) {
  .crp-blog-content {
    margin-top: 30px;
  }
}




@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-blog-heading-wrap {
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-blog-heading-wrap {
    padding-bottom: 60px;
  }
}

.tp-blog-heading-wrap .tp-section-subtitle {
  margin-bottom: 16px;
  color: var(--tp-common-white);
}

.tp-blog-heading-wrap .tp-section-subtitle.pre::before {
  background: #D0FF71;
}

.tp-blog-title {
  font-size: 120px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -4.8px;
  color: var(--tp-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-blog-title {
    font-size: 100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-blog-title {
    font-size: 85px;
  }
}

@media (max-width: 767px) {
  .tp-blog-title {
    font-size: 55px;
    letter-spacing: 0;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-blog-title {
    font-size: 65px;
    letter-spacing: 0;
  }
}

.tp-blog-title a {
  height: 90px;
  width: 90px;
  line-height: 70px;
  text-align: center;
  border-radius: 50%;
  display: inline-block;
  background-color: #1A1B1E;
}

@media (max-width: 767px) {
  .tp-blog-title a {
    display: none;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-blog-title a {
    line-height: 80px;
    display: inline-block;
  }
}

@media (max-width: 767px) {
  .tp-blog-title img {
    display: none;
  }
}

.tp-blog-title.fs-100 {
  font-size: 100px;
  font-weight: 600;
  letter-spacing: -4px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-blog-title.fs-100 {
    font-size: 85px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-blog-title.fs-100 {
    font-size: 75px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-blog-title.fs-100 {
    font-size: 65px;
  }
}

@media (max-width: 767px) {
  .tp-blog-title.fs-100 {
    font-size: 55px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-blog-title.fs-100 br {
    display: none;
  }
}

.tp-blog-shape {
  position: absolute;
  top: 10%;
  right: 16%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-blog-shape {
    display: none;
  }
}

.tp-blog-masonry-item {
  padding: 30px 15px;
  border-radius: 20px;
  transition: 0.9s;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.tp-blog-masonry-item:hover .tp-blog-masonry-thumb img {
  transform: scale(1.1);
}

.tp-blog-masonry-item-top {
  padding: 0 15px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-blog-masonry-item-top {
    padding: 0;
  }
}

.tp-blog-masonry-item-user-thumb {
  margin-right: 12px;
}

.tp-blog-masonry-item-user-thumb img {
  border-radius: 50%;
}

.tp-blog-masonry-item-user-content span {
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 8px;
  display: inline-block;
  letter-spacing: -0.16px;
  color: rgba(255, 255, 255, 0.9);
}

.tp-blog-masonry-item-user-content p {
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  margin: 0;
  color: rgba(255, 255, 255, 0.6);
}

.tp-blog-masonry-item-time span {
  font-size: 15px;
  font-weight: 500;
  display: inline-block;
  color: rgba(255, 255, 255, 0.6);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-blog-masonry-item-time span {
    font-size: 13px;
  }
}

.tp-blog-masonry-item-time span svg {
  margin-right: 5px;
}

.tp-blog-masonry-item-2 {
  padding: 30px 15px;
  border-radius: 20px;
  background: #19191B;
}

.tp-blog-masonry-item-2 .tp-blog-masonry-item-top {
  margin-bottom: 40px;
  padding-bottom: 30px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.tp-blog-masonry-item-3 {
  padding: 40px 30px;
  border-radius: 20px;
  background: #19191B;
}

.tp-blog-masonry-item-icon span {
  display: grid;
  height: 64px;
  width: 64px;
  margin-bottom: 30px;
  border-radius: 50%;
  text-align: center;
  place-content: center;
  background: #29292B;
}

.tp-blog-masonry-item-text span {
  font-size: 22px;
  font-weight: 500;
  line-height: 1.34;
  margin-bottom: 40px;
  display: inline-block;
  letter-spacing: -0.44px;
  color: var(--tp-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-blog-masonry-item-text span br {
    display: none;
  }
}

.tp-blog-masonry-item-text p {
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  color: var(--tp-common-white);
}

.tp-blog-masonry-content {
  padding: 0 15px;
}

@media (min-width: 280px) and (max-width: 767px) {
  .tp-blog-masonry-content {
    padding: 0 6px;
  }
}


.tp-blog-masonry-tag span {
  font-size: 15px;
  font-weight: 500;
  display: inline-block;
  color: rgba(255, 255, 255, 0.6);
}

.tp-blog-masonry-tag span svg {
  margin-right: 5px;
}

.tp-blog-masonry-thumb {
  overflow: hidden;
  /* border-radius: 14px; */
  height: 320px;
}

.tp-blog-masonry-thumb img {
  width: 100%;
  transition: 0.9s;
  /* border-radius: 14px; */
  object-fit: cover;
  height: 100%;
}

.tp-blog-masonry-thumb-video {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  transform: translate(-50%, -50%);
}

.tp-blog-masonry-thumb-video span {
  display: grid;
  height: 65px;
  width: 65px;
  border-radius: 50%;
  text-align: center;
  place-content: center;
  background-color: var(--tp-common-white);
  animation: animate-pulse 3s linear infinite;
}

.tp-blog-masonry-thumb-video span svg {
  transform: translateX(2px);
}

.tp-blog-masonry-title {
  font-size: 20px;
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 2px;
  letter-spacing: -0.52px;
  color: var(--tp-common-white);
}

/* Ensure blog card descriptions show on a single line (with ellipsis) */
/* #down .tp-blog-masonry-content p.fs-6 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;  
} */

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 767px) {
  .tp-blog-masonry-title {
    font-size: 20px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-blog-masonry-title br {
    display: none;
  }
}

.tp-blog-masonry-title.fs-30 {
  font-size: 30px;
  font-weight: 700;
}

.tp-blog-masonry-btn a {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.1;
  color: #D0FF71;
  overflow: hidden;
  display: inline-block;
  padding-right: 5px;
}

.tp-blog-masonry-btn a span {
  position: relative;
  overflow: hidden;
  margin-left: 5px;
}

.tp-blog-masonry-btn a span svg {
  bottom: -1px;
  left: 1px;
  transform: translateY(-2px);
  transition: all 0.2s ease-out;
}

.tp-blog-masonry-btn a span svg:last-child {
  position: absolute;
  left: -22px;
  bottom: -22px;
  transform: translate(0, 0);
}

.tp-blog-masonry-btn a:hover span svg:first-child {
  opacity: 0;
  transform: translate(20px, -20px);
}

.tp-blog-masonry-btn a:hover span svg:last-child {
  transform: translate(23px, -23px);
}

.tp-blog-list-item {
  padding-top: 40px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.tp-blog-list-item:hover .tp-blog-list-item-thumb img {
  transform: scale(1.1);
}

.tp-blog-list-item-wrap .tp-blog-list-item:last-child {
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.tp-blog-list-item-tags p {
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  margin-bottom: 14px;
  color: rgba(255, 255, 255, 0.4);
}

.tp-blog-list-item-tags-name {
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 35px;
  display: block;
  letter-spacing: -0.8px;
  color: var(--tp-common-white);
}

.tp-blog-list-item-meta {
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  color: #D0FF71;
  padding: 6px 15px;
  border-radius: 96px;
  display: inline-block;
  border: 1px solid rgba(208, 255, 113, 0.1);
}

.tp-blog-list-item-title {
  font-size: 34px;
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -1.36px;
  color: var(--tp-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-blog-list-item-title {
    font-size: 30px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-blog-list-item-title br {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-blog-list-item-title-box {
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-blog-list-item-content {
    margin-bottom: 30px;
  }
}

.tp-blog-list-item-thumb {
  overflow: hidden;
}

.tp-blog-list-item-thumb img {
  width: 100%;
  transition: 0.9s;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-blog-details-ptb {
    padding-top: 80px;
  }
}

@media (max-width: 767px) {
  .tp-blog-details-ptb {
    padding-top: 50px;
  }
}

.tp-blog-details-without-ptb {
  padding-top: 220px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-blog-details-without-ptb {
    padding-top: 185px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-blog-details-without-ptb {
    padding-top: 150px;
  }
}


.tp-blog-details-banner {
  height: 830px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-blog-details-banner {
    height: 600px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-blog-details-banner {
    height: 500px;
  }
}

@media (max-width: 767px) {
  .tp-blog-details-banner {
    height: 240px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-blog-details-banner {
    margin-bottom: 60px;
  }
}

.tp-blog-details-banner img {
  width: 100%;
}







.text-scale-anim {
  white-space: pre-wrap;
  transform-origin: top left;
}

.tp-letter-span {
  display: inline-block;
}

.tp-word-span {
  display: inline-block;
}
















/*----------------------------------------*/
/*  6.9 Footer Style 9
/*----------------------------------------*/
.crp-footer-bg {
  background-color: #335341;
}

.crp-footer-logo {
  margin-bottom: 20px;
}

/* .crp-footer-widget {
  margin-bottom: 90px;
} */

@media (min-width: 280px) and (max-width: 767px) {
  .crp-footer-widget {
    margin-bottom: 20px;
  }
}

.crp-footer-widget p {
  font-weight: 500;
  font-size: 16px;
  line-height: 1.6;
  margin-bottom: 35px;
  color: var(--tp-common-cream-3);
}

@media (min-width: 280px) and (max-width: 767px) {
  .crp-footer-widget p {
    margin-bottom: 16px;
  }
}

.crp-footer-widget-title {
  font-weight: 600;
  font-size: 30px;
  line-height: 1;
  margin-bottom: 15px;
  letter-spacing: 0.5px;
  font-family: var(--tp-ff-inter);
  color: var(--tp-common-cream-3);
}

@media (min-width: 280px) and (max-width: 576px) {
  .crp-footer-widget-title {

    font-size: 20px;

  }
}


.crp-footer-widget-menu ul li {
  list-style-type: none;
}

.crp-footer-widget-menu ul li:not(:last-child) {
  margin-bottom: 10px;
}

@media (min-width: 280px) and (max-width: 576px) {
  .crp-footer-widget-menu ul li:not(:last-child) {
    margin-bottom: 2px;
  }
}

.crp-footer-widget-menu ul li a {
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  color: var(--tp-common-cream-3);
}


@media (min-width: 280px) and (max-width: 576px) {
  .crp-footer-widget-menu ul li a {
    font-weight: 500;
    font-size: 13px;
    line-height: 1;
    color: var(--tp-common-cream-3);

  }

}

.crp-footer-widget-info a {
  font-weight: 500;
  font-size: 16px;
  line-height: 1.6;
  color: var(--tp-common-cream-3);
}

@media (min-width: 280px) and (max-width: 576px) {
  .crp-footer-widget-info a {
    font-weight: 500;
    font-size: 13px;
    line-height: 1.6;
    color: var(--tp-common-cream-3);
  }

}


.crp-footer-widget-info a.tel {
  font-weight: 600;
  font-size: 22px;
  display: block;
  letter-spacing: -0.02em;
}

.crp-footer-social a {
  height: 42px;
  width: 42px;
  line-height: 39px;
  border-radius: 50%;
  text-align: center;
  display: inline-block;
  color: var(--tp-common-cream-3);
  background-color: rgba(255, 255, 230, 0.1);
}

.crp-footer-social a img{
  width: 18px;
}

.crp-footer-social a:not(:last-child) {
  margin-right: 5px;
}

.crp-footer-social a:hover {
  color: #325341;
  background-color: var(--tp-common-yellow-green);
}

.crp-footer-big-text {
  padding: 21px 40px;
  padding-top: 40px;
  border-radius: 20px;
  background-color: #2a4c3a;
  font-weight: 600;
  font-size: 150px;
  line-height: 0.6;
  width: 100%;
  display: inline-block;
  letter-spacing: -0.02em;

  font-family: var(--tp-ff-inter);
  color: var(--tp-common-yellow-green);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .crp-footer-big-text {
    font-size: 110px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .crp-footer-big-text {
    font-size: 95px;
    padding-top: 20px;

  }
}

@media (max-width: 767px) {
  .crp-footer-big-text {
    font-size: 50px;
    letter-spacing: -0.02em;
    line-height: 0.8;

  }
}

.crp-footer-big-text span {
  position: relative;
  z-index: 1;
  overflow: hidden;
  display: inline-block;
}

.crp-footer-big-text span span {
  padding-top: 17px;
}

.crp-footer-big-text span span.text-1 {
  position: relative;
  display: block;
  transition: 0.4s ease-in-out;
}

.crp-footer-big-text span span.text-2 {
  position: absolute;
  bottom: 100%;
  display: block;
  transition: 0.4s ease-in-out;
}

.crp-footer-big-text i {
  position: relative;
  overflow: hidden;
  width: 85px;
  height: 85px;
  margin-left: 40px;
  display: inline-flex;
  transform: translateY(-11px);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .crp-footer-big-text i {
    transform: translateY(11px);
  }
}

@media (max-width: 767px) {
  .crp-footer-big-text i {
    width: 30px;
    height: 30px;
    margin-left: 0;
    transform: translateY(0);
  }
}

.crp-footer-big-text i svg {
  transform: translateY(-2px);
  position: absolute;
  bottom: -1px;
  left: 1px;
  transition: all 0.3s ease-out;
}

.crp-footer-big-text i svg:last-child {
  left: -80px;
  bottom: -80px;
  transform: translate(0, 0);
  opacity: 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .crp-footer-big-text i svg {
    width: 60px;
    transform: translateY(-7px);
  }
}

@media (max-width: 767px) {
  .crp-footer-big-text i svg {
    width: 20px;
    height: 20px;
    margin-top: 10px;
    transform: translateY(0px);
  }
}

.crp-footer-big-text:hover {
  color: var(--tp-common-yellow-green);
}

.crp-footer-big-text:hover span span.text-1 {
  -webkit-transform: translateY(150%);
  transform: translateY(150%);
}

.crp-footer-big-text:hover span span.text-2 {
  bottom: 50%;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
}

.crp-footer-big-text:hover i svg:first-child {
  transform: translate(85px, -85px);
}

.crp-footer-big-text:hover i svg:last-child {
  opacity: 1;
  visibility: visible;
  transform: translate(80px, -80px);
}

.crp-footer-big-text:focus {
  color: var(--tp-common-yellow-green);
}

.crp-footer-shape {
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
}

.crp-footer-col-3 {
  padding-left: 50px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .crp-footer-col-3 {
    padding-left: 0;
  }
}

.crp-copyright-text p {
  font-weight: 500;
  font-size: 16px;
  line-height: 1.6;
  margin-bottom: 0;
  color: var(--tp-common-cream-3);
  margin: 50px 0;
}

@media (min-width: 280px) and (max-width: 576px) {
  .crp-copyright-text p {
    margin: 20px 0;
  }
}

.crp-copyright-text p span {
  color: var(--tp-common-yellow-green);
}



.app-copyright-text p {
  margin: 0;
  color: #61616A;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.14px;
}

.app-copyright-text p a:hover {
  border-bottom: 1px solid black;
}

/*----------------------------------------*/
/*  6.11 Footer Style 11
/*----------------------------------------*/
.it-footer-style.crp-footer-bg {


  background: linear-gradient(to right, #2a6d65, #2a6d65, #2a6d65) !important;
}


.it-footer-style .crp-footer-big-text {
  /* background: linear-gradient(to right, #097EFE, #29B6E2, #4eafc5); */

  background-color: #19524b;

  /* background-color: #003166; */
  color: var(--tp-common-white);
}

.it-footer-style .crp-footer-widget p {
  color: var(--tp-common-white);
}

.it-footer-style .crp-footer-social a {
  color: var(--tp-common-white);
  background-color: rgba(255, 255, 255, 0.1);
}

.it-footer-style .crp-footer-social a:hover {
  /* color: var(--tp-common-black);
  background-color: var(--tp-common-white); */
  transform: translateY(-5px);
}

.it-footer-style .crp-footer-widget-title {
  color: var(--tp-common-white);
}

.it-footer-style .crp-footer-widget-menu ul li a {
  color: rgba(255, 255, 255, 0.7);
}

.it-footer-style .crp-footer-widget-menu ul li a:hover {
  color: var(--tp-common-white);
}

.it-footer-style .crp-footer-widget-info a,
span {
  /* color: rgba(255, 255, 255, 0.7); */
}

.it-footer-style .crp-footer-widget-info a:hover {
  color: var(--tp-common-white);
}

.it-footer-style .crp-copyright-text p span {
  color: var(--tp-common-white);
}

.it-footer-style .crp-copyright-text p {
  color: rgba(255, 255, 255, 0.7);
}

.it-footer-shape {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -1;
}









.tp-hero-shape-1 {
  margin-left: 25px;
  margin-top: -30px;
}

.tp-hero-video {
  margin-right: 30px;
  border-radius: 200px;
  transform: translateY(-21px);
  box-shadow: 0 4px 4px 0 rgba(20, 20, 20, 0.2);
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-hero-video {
    transform: translateY(-9px);
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-video {
    width: 220px;
    transform: translateY(-4px);
  }
}

.tp-hero-content-wrap {
  margin-left: 60px;
  height: 100%;
}

@media only screen and (min-width: 1600px) and (max-width: 1700px),
only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-hero-content-wrap {
    margin-left: 0;
  }
}

@media (max-width: 767px) {
  .tp-hero-content-wrap {
    flex-wrap: wrap;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-content-wrap {
    flex-wrap: wrap;
    flex-direction: row-reverse;
  }
}




.tp-hero-avater {
  padding: 12px 20px 35px 11px;
}

.tp-hero-avater span {
  font-weight: 600;
  font-size: 16px;
  line-height: 1.62;
  letter-spacing: -0.01em;
  color: var(--tp-common-black);
}

.tp-hero-link {
  padding: 15px;
}

@media (max-width: 767px) {
  .tp-hero-link {
    padding: 20px;
  }
}

.tp-hero-link a {
  display: inline-block;
  border-radius: 30px;
  padding: 8px 24px;
  font-weight: 600;
  font-size: 17px;
  letter-spacing: -0.01em;
  color: var(--tp-common-white);
  background-color: var(--tp-common-black);
}

.tp-hero-link a:hover {
  background-color: var(--tp-common-secondary);
}

.tp-hero-line {
  position: absolute;
  top: 65px;
  right: 100%;
  height: 1px;
  width: 60px;
  display: inline-block;
  background-color: var(--tp-common-white);
}

.tp-hero-line::before {
  content: "";
  height: 9px;
  width: 9px;
  border-radius: 50%;
  display: inline-block;
  transform: translateY(-14px);
  background-color: var(--tp-common-white);
}

.tp-hero-2-title {
  font-weight: 500;
  font-size: 60px;
  line-height: 1.2;
  letter-spacing: -0.02em;

  color: var(--tp-common-white);
  position: relative;
  z-index: 99;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-2-title {
    font-size: 54px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-2-title {
    font-size: 54px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-2-title {
    font-size: 54px;
  }
}

@media (max-width: 767px) {
  .tp-hero-2-title {
    font-size: 54px;
  }
}

@media only screen and (min-width: 280px) and (max-width: 576px) {
  .tp-hero-2-title {
    font-size: 30px;
  }
}



.tp-hero-2-subtitle {
  font-weight: 400;
  font-size: 18px;
  line-height: 1.5;
  margin-bottom: 10px;
  display: inline-block;
  letter-spacing: -0.02em;
  color: var(--tp-common-white);
  max-width: 80%;
  margin: auto;




}



@media (min-width: 280px) and (max-width: 576px) {
  .tp-hero-2-subtitle {
    font-size: 16px !important;
    letter-spacing: 0.05em !important;
    max-width: 100%;
  }
}



.tp-hero-2-img-1 img {
  transform: rotate(-14deg);
  position: relative;
  z-index: 3;
}

.tp-hero-2-img-2 img {
  margin-top: -190px;
  margin-bottom: 115px;
  transform: rotate(14deg);
  position: relative;
  z-index: 3;
}

.tp-hero-2-img-3 {
  position: relative;
  z-index: 1;
}

.tp-hero-2-img-3 img {
  transform: rotate(-16deg);
  margin-right: 280px;
}

.tp-hero-2-img-box.last-item {
  margin-bottom: 900px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-2-img-box.last-item {
    margin-bottom: 700px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-2-img-box.last-item {
    margin-bottom: 640px;
  }
}

.tp-hero-2-img-wrap {
  margin-top: -800px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-2-img-wrap {
    margin-top: -630px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-2-img-wrap {
    margin-top: -600px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-2-img-wrap {
    margin-top: -530px;
  }
}

@media (max-width: 767px) {
  .tp-hero-2-area {
    padding-bottom: 0;
  }
}



.creative-hero-bg {
  padding-top: 155px;
}

@media (min-width: 280px) and (max-width: 767px) {
  .creative-hero-bg {
    padding-top: 120px;

  }
}


@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .creative-hero-bg {
    /* padding-bottom: 30px; */
  }
}

/* Usability Nation: simplify hero title "cut-out" into a single clean rectangle card */
.creative-hero-title-box {
  display: inline-block;
  background-color: #fff;
  /* border-radius: 22px; */
  padding: 26px 30px 22px;
  /* box-shadow: 0 18px 45px rgba(14, 15, 17, 0.10); */
  border-radius: 0 0 12px 0;


}

@media (max-width: 1200px) {
  .creative-hero-title-box {
    display: inline-block;
    background-color: #fff;
    /* border-radius: 22px; */
    padding: 26px 30px 22px;
    /* box-shadow: 0 18px 45px rgba(14, 15, 17, 0.10); */
    border-radius: 0 0 0 0;


  }

}

@media (max-width: 767px) {
  .creative-hero-title-box {
    border-radius: 18px;
    padding: 18px 18px 16px;
  }
}

.creative-hero-title {
  font-weight: 600;
  font-size: 54px;
  line-height: 1.05;
  letter-spacing: -0.04em;
  color: var(--tp-common-black);
  margin-bottom: 0;
  display: block;
  background-color: transparent;
  padding: 0;
}





@media only screen and (min-width: 767px) and (max-width:1199px) {
  .creative-hero-title {
    font-size: 44px;
  }
}

@media (max-width: 767px) {
  .creative-hero-title {
    font-size: 36px;
  }

  .creative-hero-title br {
    display: none;
  }
}

.creative-hero-title em {
  font-style: normal;
  background-color: transparent;
  display: inline;
  padding: 0;
  position: static;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .creative-hero-title em {
    padding: 0;
    background-color: transparent;
  }
}

@media (max-width: 767px) {
  .creative-hero-title em br {
    display: none;
  }
}

.creative-hero-title em::before {
  content: none;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .creative-hero-title em::before {
    bottom: 75px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .creative-hero-title em::before {
    display: none;
  }
}

/* .creative-hero-title em::after {
  content: "";
  position: absolute;
  background-color: transparent;
  bottom: 0;
  right: -19px;
  height: 40px;
  width: 20px;
  border-bottom-left-radius: 20px;
  box-shadow: 0px 18px 0 0 #0e0f11;
} */

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .creative-hero-title em::after {
    display: none;
  }
}

.creative-hero-title em span {
  font-style: italic;
  font-weight: 500;
  font-size: 68px;
  line-height: 1;
  padding-left: 0;
  letter-spacing: -0.04em;

  font-family: var(--tp-ff-inter);
}

@media (min-width: 768px) and (max-width: 991px) {
  .creative-hero-title em span {
    font-size: 50px;
    padding-left: 0;
  }
}

@media (max-width: 767px) {
  .creative-hero-title em span {
    font-size: 42px;
    padding-left: 0;
  }
}

.creative-hero-title i {
  font-style: normal;
  background-color: transparent;
  border-radius: 0;
  padding: 0;
  display: inline;
  position: static;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .creative-hero-title i {
    padding: 0;
    background-color: transparent;
  }
}

.creative-hero-title img {
  transform: translateY(-10px);
  margin-left: -15px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .creative-hero-title-box {
    /* margin-left: 80px; */
  }
}

.creative-hero-banner {
  width: 100%;
  height: 700px;
  overflow: hidden;
  border-radius: 20px;
  position: relative;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .creative-hero-banner {
    height: 500px;
  }
}

@media (max-width: 767px) {
  .creative-hero-banner {
    height: 400px;
  }
}

.creative-hero-banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: inherit;
}

.creative-hero-banner video {
  height: 100%;
  width: 100%;
  background-position: center center;
  background-size: cover;
  object-fit: cover;
  display: block;
  border-radius: inherit;
}

.creative-hero-banner-area {
  margin-top: -285px;
}

@media only screen and (min-width: 768px) and (max-width: 1200px),
(max-width: 767px) {
  .creative-hero-banner-area {
    margin-top: 0;
  }
}

.creative-hero-btn {
  /* padding: 0 35px; */
  margin-top: 18px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  background-color: transparent;
  border-radius: 0;
  position: relative;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .creative-hero-btn {
    margin-top: 14px;
    padding: 0;
    background-color: transparent;
  }
}

/* .creative-hero-btn::before {
  content: "";
  position: absolute;
  background-color: transparent;
  bottom: 45px;
  right: -20px;
  height: 40px;
  width: 20px;
  border-top-left-radius: 20px;
  box-shadow: 0px -18px 0 0 #0e0f11;
} */

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .creative-hero-btn::before {
    display: none;
  }
}

.creative-hero-black-box {
  position: absolute;
  top: 0;
  left: 0;
  height: 134px;
  width: 180px;
  z-index: 1;
  display: inline-block;
  background-color: #0e0f11;
  border-top-left-radius: 20px;


}

@media (min-width: 280px) and (max-width:1200px) {
  .creative-hero-black-box {
    display: none;

  }

}


.creative-hero-black-box::before {
  content: "";
  position: absolute;
  /* background-color: transparent; */

  background-color: #700000;
  bottom: 0px;
  right: 5px;
  height: 40px;
  width: 20px;
  border-top-right-radius: 20px;
  box-shadow: 0px -18px 0 0 #0e0f11;
  right: -590px;
}

.shape-top-radius {
  content: "";
  position: absolute;
  /* background-color: transparent; */

  background-color: #700000;
  bottom: 0px;
  right: 5px;
  height: 40px;
  width: 20px;
  border-top-right-radius: 20px;
  box-shadow: 0px -18px 0 0 #0e0f11;
  right: -590px;
}

.creative-hero-black-box::after {
  content: "";
  position: absolute;
  background-color: #00000000;
  bottom: -190px;
  left: 0;
  height: 40px;
  width: 20px;
  border-top-left-radius: 20px;
  box-shadow: 0px -18px 0 0 #ffffff;
  z-index: 111;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .creative-hero-black-box::after {
    display: none;
  }
}

.creative-hero-avater img {
  flex: 0 0 auto;
  border-radius: 50%;
  margin-right: 13px;
  height: 54px;
  width: 54px;
}

.creative-hero-avater-box {
  position: absolute;
  bottom: 0;
  right: 0;
  margin: 20px;
  padding: 10px;
  padding-right: 42px;
  border-radius: 100px;
  background-color: var(--tp-common-black-7);
}

.creative-hero-avater-info {
  line-height: 1;
}

.creative-hero-avater-info h4 {
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  margin-bottom: 8px;
  letter-spacing: -0.03em;
  color: var(--tp-common-white);
}

.creative-hero-avater-info span {
  font-weight: 400;
  font-size: 15px;
  line-height: 1;
  letter-spacing: -0.03em;
  color: rgba(255, 255, 255, 0.6);
}


.content__img {
  width: 250px;
  aspect-ratio: 1.1;
  border-radius: 10px;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  overflow: hidden;
  will-change: transform, filter;
}

.content__img-inner {
  background-position: 50% 50%;
  width: calc(100% + 20px);
  height: calc(100% + 20px);
  background-size: cover;
  position: absolute;
  top: -10px;
  left: -10px;
}



.ai-hero-subtitle {
  font-weight: 600;
  font-size: 13px;
  line-height: 1;
  margin-bottom: 25px;
  padding: 9px 16px;
  border-radius: 28px;
  display: inline-block;

  color: var(--tp-common-white);
  backdrop-filter: blur(10px);
  background: rgba(255, 255, 255, 0.08);
}

.ai-hero-title {
  font-weight: 600;
  font-size: 64px;
  line-height: 0.96;
  margin-bottom: 30px;
  letter-spacing: 0.01em;
  color: var(--tp-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .ai-hero-title {
    font-size: 75px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .ai-hero-title {
    font-size: 70px;
  }
}

@media (min-width: 577px) and (max-width: 767px) {
  .ai-hero-title {
    font-size: 40px;
    margin-bottom: 30px;
    line-height: 40px;
  }
}

@media (min-width: 280px) and (max-width: 576px) {
  .ai-hero-title {
    font-size: 30px;
    margin-bottom: 30px;
    line-height: 38px;
  }
}




.ai-hero-title img {
  transform: translateY(-8px);
}

.ai-hero-title-box {
  /* padding-left: 350px; */



}

@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .ai-hero-title-box {
    /* padding-left: 260px; */
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .ai-hero-title-box {
    /* padding-left: 130px; */
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .ai-hero-title-box {
    /* padding-left: 30px; */
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .ai-hero-title-box {
    padding-left: 15px;
  }
}

@media (max-width: 767px) {
  .ai-hero-title-box {
    padding-left: 0px;
  }
}

.ai-hero-area {
  padding: 100px 0 100px 0;
}

@media (max-width: 576px) {
  .ai-hero-title-box {
    padding-left: 66px 0;
  }
}



.ai-hero-video video {
  height: 100%;
  width: 100%;
  background-position: center center;
  background-size: cover;
  object-fit: cover;
}

.ai-hero-ptb {
  padding-top: 70px;
}

@media (max-width: 767px) {
  .ai-hero-ptb {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}




.ai-hero-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  overflow: hidden;
}

.ai-hero-video img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.ai-hero-video::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* background: linear-gradient(16deg, rgba(0, 0, 0, 0.6) 0%, rgba(66, 139, 130, 0.7) 100%); */
  z-index: 1;
}




.crp-hero-ptb {
  padding-top: 220px;
  padding-bottom: 220px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .crp-hero-ptb {
    padding-top: 190px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .crp-hero-ptb {
    padding-top: 200px;
    padding-bottom: 70px;
  }
}

@media (max-width: 767px) {
  .crp-hero-ptb {
    padding-top: 190px;
    padding-bottom: 70px;
  }
}

.crp-hero-title {
  font-size: 150px;
  font-weight: 600;
  line-height: 0.8;
  color: var(--tp-common-cream-3);
  font-family: var(--tp-ff-inter);
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .crp-hero-title {
    font-size: 130px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .crp-hero-title {
    font-size: 105px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .crp-hero-title {
    font-size: 90px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .crp-hero-title {
    font-size: 100px;
  }
}

@media (max-width: 767px) {
  .crp-hero-title {
    font-size: 65px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .crp-hero-title {
    font-size: 80px;
  }
}

.crp-hero-title span {
  color: var(--tp-common-yellow-green);
}

.crp-hero-title.fs-100 {
  font-size: 100px;
  letter-spacing: -2px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .crp-hero-title.fs-100 {
    font-size: 82px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 767px) {
  .crp-hero-title.fs-100 {
    font-size: 70px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .crp-hero-title.fs-100 {
    font-size: 65px;
  }
}

@media (max-width: 767px) {
  .crp-hero-title.fs-100 {
    letter-spacing: 0;
  }
}

@media (max-width: 767px) {
  .crp-hero-title.fs-100 br {
    display: none;
  }
}

.crp-hero-bg {
  background-size: cover;
  background-repeat: no-repeat;
}

.crp-hero-ratting {
  line-height: 1;
}

.crp-hero-ratting-text {
  flex: 0 0 auto;
  margin-right: 18px;
}

.crp-hero-ratting-text span {
  font-weight: 600;
  font-size: 50px;
  line-height: 0.8;
  display: inline-block;
  transform: translateY(7px);
  font-family: var(--tp-ff-inter);
  color: var(--tp-common-cream-3);
}

.crp-hero-ratting-details {
  line-height: 1;
}

.crp-hero-ratting-details a {
  font-weight: 600;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0;

  color: rgba(238, 241, 234, 0.7);
  border-bottom: 1px solid rgba(238, 241, 234, 0.2);
}

.crp-hero-ratting-details a:hover {
  color: var(--tp-common-white);
}

.crp-hero-ratting-details a span svg {
  margin-left: 2px;
  display: inline-block;
  transform: translateY(-1px);
}

.crp-hero-ratting-icon {
  line-height: 1;
}

.crp-hero-ratting-icon span {
  margin-bottom: 7px;
  display: inline-block;
}

@media (max-width: 767px) {
  .crp-hero-ratting-box {
    flex-wrap: wrap;
  }
}

.crp-hero-avater {
  flex: 0 0 auto;
  margin-right: 30px;
}

@media (max-width: 767px) {
  .crp-hero-avater {
    margin-right: 0;
    margin-bottom: 20px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .crp-hero-avater {
    margin-right: 20px;
    margin-bottom: 20px;
  }
}

.crp-hero-funfact-bg {
  width: 400px;
  padding: 30px;
  background-repeat: no-repeat;
  margin-right: 20px;
}

@media (min-width: 280px) and (max-width: 576px) {
  .crp-hero-funfact-bg {
    width: 100%;
  }
}

.crp-hero-funfact-top-content {
  padding-right: 60px;
  margin-bottom: 45px;
}

.crp-hero-funfact-top-content h4 {
  font-weight: 600;
  font-size: 28px;
  color: #17312f;
  margin-bottom: 7px;
  font-family: var(--tp-ff-inter);
}

.crp-hero-funfact-top-content p {
  font-weight: 400;
  font-size: 17px;
  line-height: 1.4;
  letter-spacing: -0.01em;
  color: rgba(23, 49, 47, 0.8);
}

.crp-hero-funfact-item h4 {
  font-weight: 500;
  font-size: 70px;
  color: #17312f;
  margin-bottom: 8px;
  line-height: 0.7;
  font-family: var(--tp-ff-inter);
}

.crp-hero-funfact-more-details p {
  font-weight: 500;
  font-size: 16px;
  line-height: 1.5;
  margin-bottom: 0;
  letter-spacing: -0.01em;
  color: rgba(23, 49, 47, 0.8);
}

.crp-hero-funfact-wrap {
  /* margin-left: 20px; */
  /* background-color: var(--tp-common-primary); */

  background: #F8F8FB;
  border-radius: 12px;
  margin-top: 40px !important;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .crp-hero-funfact-wrap {
    margin-left: 0;
    /* margin-left: -40px; */
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .crp-hero-funfact-wrap {
    margin-left: 0;
    /* margin-left: -60px; */
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .crp-hero-funfact-wrap {
    margin-left: 0;
    /* margin-left: -30px; */
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .crp-hero-funfact-wrap {
    margin-left: 0;
    margin-bottom: 60px;
  }
}

.crp-hero-funfact-wrap .crp-hero-funfact-item:not(:last-child) {
  margin-bottom: 30px;
  padding-bottom: 30px;
  border-bottom: 1px solid rgba(23, 49, 47, 0.1);
}

.crp-hero-funfact-line {
  position: absolute;
  top: 120px;
  right: 100%;
  height: 1px;
  width: 80px;
  display: inline-block;
  background-color: var(--tp-common-yellow-green);
}

.crp-hero-funfact-line::before {
  content: "";
  height: 15px;
  width: 15px;
  border-radius: 50%;
  display: inline-block;
  transform: translateY(-11px);
  background-color: var(--tp-common-yellow-green);
}

.crp-hero-funfact-img {
  position: absolute;
  top: 3px;
  right: 3px;
}

@media (max-width: 767px) {
  .crp-hero-review-box {
    flex-wrap: wrap;
  }
}


.box {
  display: inline-flex;
}

.box .eye {
  position: relative;
  width: 74px;
  height: 74px;
  display: block;
  background: var(--tp-common-yellow-green);
  margin: 0 5px;
  border-radius: 50%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .box .eye {
    width: 64px;
    height: 64px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .box .eye {
    width: 54px;
    height: 54px;
  }
}

.box .eye:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 22px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #17312f;
  transform: translate(-50%, -50%);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .box .eye:before {
    width: 25px;
    height: 25px;
  }
}










/*----------------------------------------*/
/*  7.2 About Css
/*----------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-about-area {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

.tp-about-wrap {
  margin-left: 70px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-about-wrap {
    margin-left: 0;
  }
}
















@media (max-width: 767px) {
  .tp-about-us-area {
    /* padding-bottom: 40px; */


  }
}











@media only screen and (min-width: 768px) and (max-width: 991px) {
  .creative-about-area {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

.creative-about-text p {
  font-weight: 600;
  font-size: 44px;
  line-height: 1.18;
  margin-bottom: 40px;
  letter-spacing: -0.03em;
  color: var(--tp-common-white);
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .creative-about-text p {
    font-size: 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .creative-about-text p {
    font-size: 35px;
  }
}

@media (max-width: 767px) {
  .creative-about-text p {
    font-size: 29px;
  }
}

.creative-about-text p span {
  padding-left: 150px;
  display: inline-block;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .creative-about-text p span {
    padding-left: 0;
  }
}

.creative-brand-item {
  text-align: center;
}






.ai-about-thumb {
  position: relative;
}

.ai-about-thumb.thumb-1 {
  margin-top: 190px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ai-about-thumb.thumb-1 {
    margin-top: 0;
    margin-right: 20px;
  }
}

.ai-about-thumb.thumb-2 {
  margin-left: -190px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ai-about-thumb.thumb-2 {
    margin-left: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ai-about-thumb-box {
    margin-bottom: 30px;
  }
}

.ai-about-thumb.tp--hover-img canvas {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
}

.ai-about-thumb img {
  width: 100%;
  display: block;
  object-fit: cover;
}

.ai-about-right {
  margin-left: 80px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .ai-about-right {
    margin-left: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ai-about-right {
    margin-left: 0px;
  }
}



@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ar-about-area {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

.ar-about-thumb {
  margin-left: 130px;
  display: inline-block;
  height: 500px;
  width: 400px;
  overflow: hidden;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .ar-about-thumb {
    margin-left: 0;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .ar-about-thumb {
    margin-left: 0;
    width: auto;
  }
}

@media (max-width: 767px) {
  .ar-about-thumb {
    margin-left: 0;
    width: auto;
    margin-bottom: 40px;
  }
}

.ar-about-thumb img {
  margin-top: -60px;
}

.ar-about-shape {
  position: absolute;
  bottom: 0;
  left: -62%;
  z-index: -1;
  max-width: inherit;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ar-about-shape {
    left: 0;
  }
}







.ar-about-exp-box {
  margin-left: -30px;
  padding: 30px;
  background-position: bottom;
  background-repeat: no-repeat;
  display: inline-block;
  border: 1px solid rgba(20, 20, 20, 0.06);
  border-top: 4px solid var(--tp-common-red-2);
}

@media (max-width: 767px) {
  .ar-about-exp-box {
    width: 100%;
  }
}

.ar-about-exp-box span {
  font-size: 15px;
  line-height: 1.2;
  margin-bottom: 17px;
  display: inline-block;
  letter-spacing: 1px;

  color: var(--tp-common-red-2);
  font-family: var(--tp-ff-inter);
}

.ar-about-exp-box h4 {
  font-size: 160px;
  line-height: 0.69;
  margin-bottom: 0;

  color: var(--tp-common-red-2);
  font-family: var(--tp-ff-inter);
}

.ar-about-us-4-hero-ptb {
  padding-top: 195px;
  padding-bottom: 100px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .ar-about-us-4-hero-ptb {
    padding-bottom: 60px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ar-about-us-4-hero-ptb {
    padding-bottom: 40px;
  }
}

@media (max-width: 767px) {
  .ar-about-us-4-hero-ptb {
    padding-top: 150px;
  }
}

.ar-about-us-4-hero-ptb.pb-70 {
  padding-bottom: 60px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ar-about-us-4-hero-ptb.pb-70 {
    padding-bottom: 40px;
  }
}

.ar-about-us-4-title {
  color: #111013;
  font-size: 100px;
  font-weight: 800;
  line-height: 1;
  margin-bottom: 50px;
  letter-spacing: -4px;

}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .ar-about-us-4-title {
    font-size: 90px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ar-about-us-4-title {
    font-size: 70px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ar-about-us-4-title-box {
    flex-wrap: wrap;
    justify-content: start !important;
  }
}

.ar-about-us-4-title-box p {
  color: #111013;
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ar-about-us-4-title-box p br {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ar-about-us-4-title-box p {
    padding-top: 20px;
  }
}

.ar-about-us-4-title-box .tp-section-subtitle {
  margin-right: 15px;
}

.ar-about-us-4-title-box .ar-about-us-4-icon {
  margin-right: 75px;
}

.ar-about-us-4-shape {
  position: absolute;
  top: 31%;
  right: 10%;
}

@media (max-width: 767px) {
  .ar-about-us-4-shape {
    display: none;
  }
}

.ar-about-us-4-text-warp.title-black-color .ar-about-us-4-text-title {
  color: #111013;
}

.ar-about-us-4-text-title {
  font-size: 200px;
  font-weight: 800;
  letter-spacing: -8px;

  color: rgba(249, 244, 232, 0.1);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .ar-about-us-4-text-title {
    font-size: 145px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ar-about-us-4-text-title {
    font-size: 90px;
    letter-spacing: -5px;
  }
}

.ar-about-funfact-color .crp-hero-funfact-line {
  background-color: var(--tp-common-secondary);
}

.ar-about-funfact-color .crp-hero-funfact-line::before {
  background-color: var(--tp-common-secondary);
}

.ar-about-funfact-top-content h4 {
  font-size: 34px;
  font-weight: 800;
  line-height: 36px;
  margin-bottom: 35px;
  letter-spacing: -0.68px;

  color: var(--tp-common-white);
}

.ar-about-funfact-item:not(:last-of-type) {
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.ar-about-funfact-item-icon {
  margin-right: 35px;
}

.ar-about-funfact-item-icon span {
  display: grid;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  place-content: center;
  border: 1px solid rgb(0 0 0 / 39%);
}

.ar-about-funfact-item-content p {
  margin: 0;
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 3px;
  color: var(--tp-common-black);
}

.ar-about-funfact-item-content a {
  font-size: 18px;
  font-weight: 500;
  color: var(--tp-common-black);

  word-break: break-all !important;
}

.ar-about-funfact-item-bottom p {
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  color: rgba(255, 255, 255, 0.7);
}

.ar-about-funfact-item-bottom p span {
  font-weight: 600;
  color: var(--tp-common-white);
}







@media (max-width: 767px) {
  .it-about-ptb {
    padding-top: 100px;
    padding-bottom: 0;
  }
}



.it-about-thumb img {
  border-radius: 12px;
  max-width: inherit;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-thumb img {
    max-width: 100%;
  }
}

.it-about-thumb img.img-2 {
  margin-left: -150px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-thumb img.img-2 {
    margin-left: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-thumb img.img-2 {
    margin-bottom: 60px;
  }
}

.it-about-thumb-inner {
  width: 100%;
  height: 500px;
  overflow: hidden;
  border-radius: 12px;
  object-fit: cover;
}

.it-about-thumb-inner img {
  /* margin-top: -100px;
  margin-left: -100px; */
  object-fit: cover;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-thumb-inner img {
    margin-left: 0;
    margin-top: 0;
  }
}

.it-about-info-wrap {
  position: absolute;
  display: grid;
  top: 15%;
  right: -10%;
  z-index: 2;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-about-info-wrap {
    right: 0;
  }
}

@media (max-width: 767px) {
  .it-about-info-wrap {
    display: none;
  }
}

.it-about-info-item {
  padding: 28px;
  margin: 6px 0;
  padding-right: 22px;
  border-radius: 12px;
  display: inline-block;
  background: #f6f9fe;
  box-shadow: inset 0 20px 40px 0 rgba(255, 255, 255, 0.45);
}

.it-about-info-item i {
  font-weight: 500;
  font-size: 45px;
  line-height: 0.7;
  font-style: normal;
  margin-right: 20px;
  color: var(--tp-common-black-10);
  font-family: var(--tp-ff-inter);
}

.it-about-info-item p {
  font-weight: 500;
  font-size: 17px;
  margin-bottom: 0;
  line-height: 1.35;
  color: var(--tp-common-black-10);
}

.it-about-shape-1 {
  position: absolute;
  bottom: 0;
  left: 0;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-about-shape-1 {
    bottom: -7%;
  }
}

.it-about-shape-2 {
  position: absolute;
  top: -5%;
  right: 0;
  z-index: 2;
}

@media (max-width: 991px) {
  .it-about-shape-2 {
    display: none;
  }
}

@media (max-width: 767px) {
  .st-about-ptb {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

.st-about-shape {
  position: absolute;
  bottom: 20%;
  left: 10%;
}

@media (max-width: 767px) {
  .st-about-shape {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-about-wrap {
    padding-left: 0;
    padding-bottom: 40px;
  }
}


.st-about-card {
  padding: 40px;
  width: 375px;
  border-radius: 15px;
  background-color: var(--tp-common-white);
}

@media (max-width: 767px) {
  .st-about-card {
    width: 100%;
  }
}

.st-about-card-tag span {
  color: #494949;
  font-size: 17px;
  font-weight: 400;
  border-radius: 16px;
  padding: 2px 11px;
  display: inline-block;
  letter-spacing: -0.34px;

  border: 1px solid rgba(69, 48, 48, 0.15);
}

.st-about-card-btn a {
  width: 36px;
  height: 36px;
  display: grid;
  border-radius: 50%;
  place-content: center;
  color: var(--tp-common-white);
  background-color: var(--tp-common-brown);
}

.st-about-card-bottom span {
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
  display: inline-block;
  letter-spacing: -0.36px;

  color: var(--tp-common-brown);
  font-family: var(--tp-ff-interoppins);
}

.st-about-card-thumb img {
  animation: roteted 6s linear infinite;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-about-box {
    padding-bottom: 40px;
  }
}




.st-about-box .tp-about-avater-info {
  border-color: rgba(69, 48, 48, 0.15);
}

.st-about-thumb-box img {
  border-radius: 15px;
}


.tp-about-5-title-box {
  display: inline-block;
}

.tp-about-5-title-box p {
  text-align: left;
  max-width: 245px;
  font-size: 15px;
  font-weight: 400;
  line-height: 22px;
  color: var(--tp-cream-2);
  font-family: var(--tp-ff-interoppins);
  position: absolute;
  bottom: 15px;
  left: 50px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-5-title-box p {
    bottom: 3px;
    left: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-about-5-title-box p {
    position: static;
    text-align: center;
    margin: 0 auto;
    margin-top: 30px;
  }
}

.tp-about-5-subtitle {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;

  color: var(--tp-cream-2);
  font-family: var(--tp-ff-interoppins);
  display: inline-block;
  position: absolute;
  top: 50px;
  left: 80px;
  z-index: 5;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-5-subtitle {
    top: 40px;
    left: 0px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-about-5-subtitle {
    position: static;
    margin-bottom: 20px;
  }
}






















.creative-text-item {
  display: flex;
  align-items: center;
}

.creative-text-item span {
  font-weight: 400;
  font-size: 200px;
  line-height: 0.8;
  color: #e0eeee;
  white-space: nowrap;
  letter-spacing: -0.02em;
  font-family: var(--tp-ff-inter);
}

@media (max-width: 767px) {
  .creative-text-item span {
    font-size: 120px;
  }
}

.creative-text-item span::after {
  content: "";
  height: 8px;
  width: 210px;
  margin: 0 20px;
  display: inline-block;
  transform: translateY(-50px);
  background-color: #e0eeee;
}





.crp-text-shape-wrap {
  position: absolute;
  top: 8%;
  right: 18%;
  z-index: 55;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .crp-text-shape-wrap {
    top: 0;
  }
}

.crp-text-shape-wrap.app {
  top: -16%;
}

.crp-text-shape-2 {
  position: absolute;
  top: 16px;
  left: 16px;
  animation: rotate2 15s linear infinite;
}




.slide-transtion {
  -webkit-transition-timing-function: linear;
  transition-timing-function: linear;
}

/*----------------------------------------*/
/*  7.5 Service Css
/*----------------------------------------*/





















.ar-service-mr {
  margin-right: 210px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .ar-service-mr {
    margin-right: 0;
  }
}

.ar-service-height {
  height: 800px;
  display: flex;
}

@media (max-width: 767px) {
  .ar-service-height {
    height: 600px;
  }
}

.ar-service-bg {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: -2;
  opacity: 0;
  visibility: hidden;
  transition: 0.4s linear;
  transform: scale(1);
  background-size: cover;
  background-repeat: no-repeat;
}

.ar-service-bg::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(20, 20, 20, 0.3);
}

.ar-service-title {
  font-size: 18px;
  line-height: 1.2;

  letter-spacing: 1px;
  color: var(--tp-common-white);
  font-family: var(--tp-ff-inter);
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  margin-bottom: 50px;
  margin-right: 50px;
}

.ar-service-title::before {
  content: "";
  height: 0px;
  width: 2px;
  margin-bottom: 5px;
  transition: all 0.4s;
  display: inline-block;
  transform: translateY(-4px);
  background-color: var(--tp-common-white);
}

.ar-service-item {
  height: 100%;
  width: 25%;
  cursor: pointer;
}

.ar-service-item:not(:last-child) {
  border-right: 1px solid rgba(255, 255, 255, 0.2);
}

.ar-service-item.active .ar-service-bg {
  opacity: 1;
  visibility: visible;
  transform: scale(1.03);
}

.ar-service-item:hover .ar-service-title::before {
  height: 30px;
}

.ar-service-title-box {
  position: absolute;
  top: 0;
  left: 0;
  margin: 150px 100px 100px 100px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .ar-service-title-box {
    margin: 60px 60px 60px 60px;
  }
}

@media (max-width: 767px) {
  .ar-service-title-box {
    margin: 40px;
  }
}



@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-service-ptb {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-service-heading {
    margin-bottom: 30px;
  }
}

.st-service-heading .tp-section-subtitle {
  color: var(--tp-common-white);
}

.st-service-heading .tp-section-title-playfair {
  color: var(--tp-common-white);
}

.st-service-heading .tp-section-title-playfair span {
  color: rgba(255, 255, 255, 0.6);
}

.st-service-heading p {
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.65);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-service-heading p br {
    display: none;
  }
}

.st-service-item {
  padding: 40px 0;
  border-top: 1px solid #00000033;
}

.st-service-item:last-child {
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}

.st-service-item:hover .row [class*=col-] .st-service-item-wrap {
  transform: translateX(0);
}

.st-service-item-wrap {
  transition: 0.9s;
  transform: translateX(-340px);

}

/* First child ki image by default show kare */
.st-service-item:first-child .st-service-item-wrap {
  transform: translateX(0) !important;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-service-item-wrap {
    transform: translateX(0);
  }
}

@media (max-width: 767px) {
  .st-service-item-wrap {
    flex-wrap: wrap;
  }
}

.st-service-item-thumb {
  flex: 0 0 auto;
  margin-right: 50px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-service-item-thumb {
    margin-right: 35px;
  }
}

@media (max-width: 767px) {
  .st-service-item-thumb {
    width: 100%;
  }
}

.st-service-item-thumb img {
  border-radius: 10px;
  width: 290px;

}

@media (max-width: 767px) {
  .st-service-item-thumb img {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .st-service-item-text {
    padding-top: 30px;
  }
}

.st-service-item-title {
  margin: 0;
  line-height: 1;
  font-size: 50px;
  font-weight: 600;
  letter-spacing: -1px;
  color: var(--tp-common-black);
  font-family: var(--tp-ff-interoppins);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .st-service-item-title {
    font-size: 44px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-service-item-title {
    font-size: 40px;
  }
}

.st-service-item-tags {
  flex: none;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
  animation: marquee-horizontal 30s linear infinite;
}

.st-service-item-tags span {
  font-size: 14px;
  font-weight: 500;
  margin-right: 6px;
  padding: 1px 15px;
  border-radius: 20px;
  white-space: nowrap;
  display: inline-block;

  color: var(--tp-common-black);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(000, 000, 000, 0.2);

}




.st-service-item-wrapper {
  height: 100%;
  text-align: end;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-service-item-btn {
    margin-bottom: 30px;
  }
}

.st-service-item-btn a {
  display: inline-block;
}

.st-service-item-btn a span {
  height: 60px;
  width: 60px;
  display: grid;
  border-radius: 30px;
  place-content: center;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  color: var(--tp-common-black);
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.st-service-item-btn a:hover span {
  color: var(--tp-common-black);
  background-color: var(--tp-common-white);
}


@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .pp-service-ptb {
    padding-bottom: 100px;
  }
}

.pp-service-shape {
  position: absolute;
  top: -15%;
  left: 0;
  z-index: 2;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .pp-service-shape {
    display: none;
  }
}

.pp-service-shape.service-details-shape {
  top: auto;
  bottom: 10%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .pp-service-shape.service-details-shape {
    display: none;
  }
}

.pp-service-heading {
  margin-bottom: 50px;
}

.pp-service-heading span {
  font-size: 18px;
  font-weight: 600;
  display: inline-block;
  color: var(--tp-common-white);
}

.pp-service-wrapper .active-bg {
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  z-index: -1;
  position: absolute;
  -webkit-transition: 0.7s;
  -moz-transition: 0.7s;
  -ms-transition: 0.7s;
  -o-transition: 0.7s;
  transition: 0.7s;
  background: var(--tp-common-yellow-1);
}

.pp-service-item {
  display: block;
  padding: 30px 0 0px 242px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .pp-service-item {
    padding: 30px 0 0px 160px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .pp-service-item {
    padding: 30px 0 0px 95px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pp-service-item {
    padding: 30px 0 0px 70px;
  }
}

@media (max-width: 767px) {
  .pp-service-item {
    padding: 25px 0 15px 30px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .pp-service-item {
    padding: 25px 0 15px 50px;
  }
}

.pp-service-item::before {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  content: "";
  background: var(--tp-common-yellow-1);
  -webkit-clip-path: inset(50% 0 50% 0);
  clip-path: inset(50% 0 50% 0);
  -webkit-transition: -webkit-clip-path 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: -webkit-clip-path 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: clip-path 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: clip-path 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-clip-path 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  z-index: 2;
}

.pp-service-item:first-child {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.pp-service-item:hover::before {
  -webkit-clip-path: inset(0);
  clip-path: inset(0);
  -webkit-transition: -webkit-clip-path 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: -webkit-clip-path 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: clip-path 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: clip-path 0.6s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-clip-path 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.pp-service-item:hover .pp-service-item-title {
  color: #120F10;
}

.pp-service-item-title {
  position: relative;
  z-index: 2;
  font-size: 180px;
  font-weight: 600;
  line-height: 0.7;
  letter-spacing: -5.4px;
  display: inline-block;
  vertical-align: middle;

  color: var(--tp-common-white);
  font-family: var(--tp-ff-inter);
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .pp-service-item-title {
    font-size: 150px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .pp-service-item-title {
    font-size: 120px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pp-service-item-title {
    font-size: 85px;
    line-height: 1;
    letter-spacing: -1.4px;
  }
}

@media (max-width: 767px) {
  .pp-service-item-title {
    font-size: 45px;
    letter-spacing: 0;
    line-height: 1;
  }
}







@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-inner-service-area {
    padding-top: 20px;
    padding-bottom: 0;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-inner-service-item {
    margin-bottom: 50px;
  }
}








/*----------------------------------------*/
/*  7.6 Project Css
/*----------------------------------------*/












.tp_text_invert>div {
  background-image: linear-gradient(to right, #111013 50%, #e4e4e4 50%);
  background-size: 200% 100%;
  background-position: 100%;
  color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
}

.tp_text_invert_2>div {
  background-image: linear-gradient(to right, #e0eeee 50%, #383C3E 50%);
  padding: 10px 0;
  background-size: 200% 100%;
  background-position: 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.tp_text_invert_3>div {
  background-image: linear-gradient(to right, #f9f4e8 50%, #383C3E 50%);
  padding: 10px 0;
  background-size: 200% 100%;
  background-position: 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.tp-text-right-scroll {
  display: inline-block;
}

.tp-text-left-scroll {
  display: inline-block;
}

.tp-reveal-line {
  overflow: hidden;
}






















.tp--hover-item {
  position: relative;
}

.tp--hover-img canvas {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
}

/*----------------------------------------*/
/*  7.7 Funfact Css
/*----------------------------------------*/


.ar-funfact-item h4 {
  line-height: 0.8;
  font-size: 100px;
  letter-spacing: -0.04em;
  color: var(--tp-common-black);
  font-family: var(--tp-ff-inter);
}

.ar-funfact-item h4 i {
  font-style: normal;
}

.ar-funfact-item span {
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  letter-spacing: 1px;

  color: var(--tp-common-black);
  font-family: var(--tp-ff-inter);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .ar-funfact-item span {
    font-size: 15px;
  }
}

.ar-funfact-bg {
  padding: 45px 0;
  padding-bottom: 0;
}

.st-counter-wrapper {
  border-top: 1px solid rgba(69, 48, 48, 0.15);
  border-bottom: 1px solid rgba(69, 48, 48, 0.15);
}

@media (min-width: 280px) and (max-width: 767px) {
  .st-counter-wrapper {
    border: none;
  }
}

.st-counter-wrapper .row [class*=col-]:not(:last-child) {
  border-right: 1px solid rgba(69, 48, 48, 0.15);
}

@media (max-width: 767px) {
  .st-counter-wrapper .row [class*=col-]:not(:last-child) {
    border: none;
  }
}



/*----------------------------------------*/
/*  7.8 Work Css
/*----------------------------------------*/




.creative-work-icon img {
  margin-bottom: 20px;
}

.creative-work-item {
  padding: 45px;
  border-radius: 20px;
  background-color: #0E0F11;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .creative-work-item {
    padding: 35px;
  }
}

.creative-work-bg {
  padding: 110px 100px;
  padding-bottom: 80px;
  border-radius: 20px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .creative-work-bg {
    padding: 110px 70px;
    padding-bottom: 80px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .creative-work-bg {
    padding: 110px 30px;
    padding-bottom: 80px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .creative-work-bg {
    padding: 110px 50px;
    padding-bottom: 80px;
  }
}

@media (max-width: 767px) {
  .creative-work-bg {
    padding: 110px 20px;
    padding-bottom: 80px;
  }
}

.creative-work-square-box {
  position: absolute;
  top: 0;
  left: 0;
  height: 100px;
  width: 400px;
  display: inline-block;
  border-radius: 0 0 20px 0;
  background-color: #0E0F11;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .creative-work-square-box {
    top: -50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .creative-work-square-box {
    display: none;
  }
}

.creative-work-square-box::after,
.creative-work-square-box::before {
  content: "";
  position: absolute;
  bottom: 60px;
  right: -20px;
  height: 40px;
  width: 20px;
  border-top-left-radius: 20px;
  background-color: transparent;
  box-shadow: 0px -18px 0 0 #0e0f11;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .creative-work-square-box::after {
    bottom: 10px;
  }
}

.creative-work-square-box::before {
  bottom: -40px;
  left: 0px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .design-work-area {
    text-align: center;
    padding-bottom: 80px;
  }
}

.design-work-item img {
  width: 100%;
  border-radius: 30px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .design-work-item img {
    margin-bottom: 60px;
  }
}

@media (max-width: 767px) {
  .design-work-item img {
    margin-bottom: 30px;
  }
}





.fraction-wrapper {
  position: absolute;
  bottom: -80px;
  left: 50%;
  width: 270px;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 1;
  height: 12px;
}

.fraction-wrapper #paginations span {
  font-size: 16px;
  color: var(--tp-common-black);
}

.fraction-wrapper #paginations span:last-child {
  float: right;
}

#paginations {
  position: absolute;
  bottom: -7px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 1;
}













@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .design-social-area {
    padding-top: 0;
    padding-bottom: 0;
  }
}




@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-award-ptb {
    margin-bottom: 100px;
  }
}

.st-award-title {
  font-size: 36px;
  font-weight: 600;
  letter-spacing: -0.36px;
  color: var(--tp-common-brown);
  font-family: var(--tp-ff-interoppins);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-award-title br {
    display: none;
  }
}

.st-award-title span {
  color: rgba(69, 48, 48, 0.4);
}


.st-award-list-thumb-wrap {
  width: 50%;
  height: 78%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .st-award-list-thumb-wrap {
    width: 62%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-award-list-thumb-wrap {
    display: none;
  }
}

.st-award-list-thumb-1,
.st-award-list-thumb-2,
.st-award-list-thumb-3,
.st-award-list-thumb-4,
.st-award-list-thumb-5 {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  visibility: hidden;
  position: absolute;
  border-radius: 10px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {

  .st-award-list-thumb-1,
  .st-award-list-thumb-2,
  .st-award-list-thumb-3,
  .st-award-list-thumb-4,
  .st-award-list-thumb-5 {
    position: static;
    width: inherit;
    height: inherit;
  }
}

.st-award-thumb-shape {
  position: absolute;
  width: 175px;
  height: 70px;
  bottom: 0;
  left: 0;
  border-radius: 5px;
  background-color: #FFCF27;
  -webkit-transform: rotate(-55deg) translate(-100%, 150%);
  transform: rotate(-55deg) translate(-100%, 150%);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  z-index: 1;
  opacity: 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-award-thumb-shape {
    display: none;
  }
}

#st-award-thumb img {
  transform-origin: bottom left;
}

#st-award-thumb.st-award-list-thumb-1 .st-award-list-thumb-1 {
  opacity: 1;
  visibility: visible;
  transition: all 0.5s;
  transform: rotate(15deg) translateX(30px) translateY(0px);
}

#st-award-thumb.st-award-list-thumb-1 .current {
  visibility: visible;
  -webkit-transform: rotate(-55deg) translate(30px, 150%);
  transform: rotate(-55deg) translate(30px, 150%);
  opacity: 1;
}

#st-award-thumb.st-award-list-thumb-2 .st-award-list-thumb-2 {
  opacity: 1;
  visibility: visible;
  transition: all 0.5s;
  transform: rotate(15deg) translateX(30px) translateY(0px);
}

#st-award-thumb.st-award-list-thumb-2 .current {
  visibility: visible;
  -webkit-transform: rotate(-55deg) translate(30px, 150%);
  transform: rotate(-55deg) translate(30px, 150%);
  opacity: 1;
}

#st-award-thumb.st-award-list-thumb-3 .st-award-list-thumb-3 {
  opacity: 1;
  visibility: visible;
  transition: all 0.5s;
  transform: rotate(15deg) translateX(30px) translateY(0px);
}

#st-award-thumb.st-award-list-thumb-3 .current {
  visibility: visible;
  -webkit-transform: rotate(-55deg) translate(30px, 150%);
  transform: rotate(-55deg) translate(30px, 150%);
  opacity: 1;
}

#st-award-thumb.st-award-list-thumb-4 .st-award-list-thumb-4 {
  opacity: 1;
  visibility: visible;
  transition: all 0.5s;
  transform: rotate(15deg) translateX(30px) translateY(0px);
}

#st-award-thumb.st-award-list-thumb-4 .current {
  visibility: visible;
  -webkit-transform: rotate(-55deg) translate(30px, 150%);
  transform: rotate(-55deg) translate(30px, 150%);
  opacity: 1;
}

#st-award-thumb.st-award-list-thumb-5 .st-award-list-thumb-5 {
  opacity: 1;
  visibility: visible;
  transition: all 0.5s;
  transform: rotate(15deg) translateX(30px) translateY(0px);
}

#st-award-thumb.st-award-list-thumb-5 .current {
  visibility: visible;
  -webkit-transform: rotate(-55deg) translate(30px, 150%);
  transform: rotate(-55deg) translate(30px, 150%);
  opacity: 1;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .pp-award-ptb {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}



/*----------------------------------------*/
/*  8.1 Video Css
/*----------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-video-area.video-inner-style {
    margin-bottom: 80px;
  }
}

.tp-video-thumb {
  width: 32.5%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-video-thumb {
    width: 100%;
    margin-bottom: 0;
  }
}

.tp-video-thumb-wrap {
  transform-origin: top center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.tp-video-thumb video {
  height: 100%;
  width: 100%;
  background-position: center center;
  background-size: cover;
  object-fit: cover;
}

.tp-video-thumb img {
  width: 100%;
  height: 100%;

}

.design-video-thumb {
  height: 850px;
  overflow: hidden;
}

@media (max-width: 767px) {
  .design-video-thumb {
    height: 450px;
  }
}

.design-video-thumb img {
  margin-top: -150px;
}

@media (max-width: 767px) {
  .design-video-thumb img {
    margin-top: 100px;
  }
}


.st-video-img {
  height: 900px;
  overflow: hidden;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .st-video-img {
    height: 750px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .st-video-img {
    height: 600px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .st-video-img {
    height: 470px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px) {
  .st-video-img {
    height: 400px;
  }
}

@media (max-width: 767px) {
  .st-video-img {
    height: 240px;
  }
}





.st-video-text-wrapper .slide-transtion {
  -webkit-transition-timing-function: linear;
  transition-timing-function: linear;
}

.st-video-text-title {
  font-size: 120px;
  font-weight: 700;
  line-height: 1;
  display: inline-block;
  letter-spacing: -3.6px;
  color: var(--tp-common-white);
  font-family: var(--tp-ff-interoppins);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .st-video-text-title {
    font-size: 85px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .st-video-text-title {
    font-size: 80px;
  }
}

@media (max-width: 767px) {
  .st-video-text-title {
    font-size: 35px;
  }
}

.st-video-text-title i {
  font-style: normal;
  color: rgba(255, 255, 255, 0.4);
}

.tp-video-15-wrap {
  line-height: 0;
}

.tp-video-15-wrap video {
  height: 800px;
  width: 100%;
  object-fit: cover;
}












.slide-transtion {
  -webkit-transition-timing-function: linear;
  transition-timing-function: linear;
}






.tp-border-line {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 18.8%;
  z-index: -1;
  border-right: 1px solid rgba(255, 255, 255, 0.06);
}

@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .tp-border-line {
    width: 12.5%;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-border-line {
    width: 7.2%;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-border-line {
    width: 3.8%;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-border-line {
    width: 3%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-border-line {
    display: none;
  }
}

.tp-border-line::after {
  position: absolute;
  top: 300px;
  right: -1px;
  width: 1px;
  opacity: 0.5;
  height: 100px;
  content: "";
  animation: scroll1 15s ease-out infinite;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 100%);
}

.tp-border-line.line-2 {
  width: 81.2%;
}

@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .tp-border-line.line-2 {
    width: 87.5%;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-border-line.line-2 {
    width: 93%;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-border-line.line-2 {
    width: 96.2%;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-border-line.line-2 {
    width: 97%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-border-line.line-2 {
    display: none;
  }
}

.tp-border-line.line-2::after {
  animation: scroll2 20s ease-out infinite;
}






.tp-team-bg {
  padding-top: 160px;
  padding-bottom: 200px;
  border-radius: 50px 50px 0 0;
}

.tp-team-item-thumb {
  transition: 0.6s;
  border-radius: 300px;
}

.tp-team-item-thumb::after {
  position: absolute;
  content: "";
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: 0.4s;
  visibility: hidden;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(14, 15, 17, 0) 0%, #0e0f11 150%);
}



.tp-team-item-thumb:hover::after {
  opacity: 1;
  border-radius: 300px;
  visibility: visible;
}

.tp-team-item-thumb:hover img {
  border-radius: 300px;
}

.tp-team-item-thumb img {
  height: 500px;
  transition: 0.6s;
  object-fit: cover;
  border-radius: 20px;
}

@media (max-width: 767px) {
  .tp-team-item-thumb img {
    width: 100%;
  }
}



@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-team-hero-subtitle {
    margin-bottom: 20px;
  }
}

.tp-team-hero-subtitle span {
  display: inline-block;
  color: #111013;
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  letter-spacing: -0.32px;

}

.tp-team-hero-text p {
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  color: #111013;
  letter-spacing: -0.36px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-team-hero-text p br {
    display: none;
  }
}

.tp-team-inner-ptb .tp-career-shape-1 {
  position: absolute;
  top: 30%;
  right: 18%;
}

.tp-team-inner-thumb {
  width: 100%;
  height: 760px;
  overflow: hidden;
  border-radius: 40px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-team-inner-thumb {
    height: 600px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-team-inner-thumb {
    height: 380px;
  }
}

.tp-team-inner-thumb img {
  width: 100%;
  margin-top: -100px;
}

@media (max-width: 767px) {
  .tp-team-inner-thumb img {
    margin-top: 0px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-team-inner-thumb-box {
    margin-bottom: 100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-team-inner-thumb-box {
    margin-bottom: 80px;
  }
}





/*----------------------------------------*/
/*  8.4 Step Css
/*----------------------------------------*/












.ar-step-right-wrap {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.it-step-bg {
  /* margin-top: -5px; */
}

.it-step-title-box {
  margin-bottom: 70px;

}

@media (min-width: 280px) and (max-width: 576px) {
  .it-step-title-box {
    margin-bottom: 40px;
  }
}

.it-step-title-box p {
  font-weight: 500;
  font-size: 18px;
  margin-bottom: 0;
  line-height: 1.56;
  color: rgba(254, 255, 249, 0.7);

}

@media (max-width: 767px) {
  .it-step-title-box p br {
    display: none;
  }
}

.it-step-thumb {
  margin-left: -115px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-step-thumb {
    margin-left: 0;
  }
}

.it-step-thumb img {
  border-radius: 30px;
  max-width: inherit;
  object-fit: contain;
}

@media (max-width: 767px) {
  .it-step-thumb img {
    width: 100%;
  }
}

.it-step-thumb-shape-1 {
  position: absolute;
  top: 27%;
  right: -8%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .it-step-thumb-shape-1 {
    right: 0;
  }
}

@media (max-width: 767px) {
  .it-step-thumb-shape-1 {
    display: none;
  }
}

.it-step-thumb-shape-2 {
  position: absolute;
  bottom: 4%;
  left: -18%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-step-thumb-shape-2 {
    left: 7%;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px) {
  .it-step-thumb-shape-2 {
    left: 6%;
  }
}

@media (max-width: 767px) {
  .it-step-thumb-shape-2 {
    display: none;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-step-thumb-shape-2 {
    display: block;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-step-thumb-wrap {
    margin-bottom: 80px;
  }
}

.it-step-thumb-img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 30px;
}

.it-step-shape-1 {
  position: absolute;
  left: 0%;
  top: 13%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-step-shape-1 {
    left: -8%;
  }
}

.it-step-shape-2 {
  position: absolute;
  right: 0;
  bottom: -47%;
  z-index: 1;
}










.st-choose-bg::after {
  position: absolute;
  content: "";
  right: 0;
  bottom: 7%;
  height: 340px;
  width: 945px;
  z-index: -1;
  background-color: #FFFBF6;
  border-radius: 10px 0px 0px 10px;
}




#lineMarker {
  position: absolute;
  top: 5px;
  height: 36px;
  z-index: -1;
  transition: 0.4s;
  border-radius: 6px;
  display: inline-block;
  background: var(--tp-common-white);
}






.it-faq-shape-1 {
  position: absolute;
  left: 0;
  bottom: -30px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-faq-shape-1 {
    left: -10%;
  }
}

.it-faq-shape-2 {
  margin-left: 75px;
}

@media (max-width: 767px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-faq-shape-2 {
    margin-left: 0;
  }
}

.it-faq-accordion .faq-active {
  position: relative;
}

.it-faq-accordion .faq-active::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 8px;
  height: 0;
  transition: 0.5s;
  /* background: #2a6d64; */



  border-radius: 20px;
}

.it-faq-accordion .accordion-items.faq-active::before {
  top: auto;
  bottom: 0;
  height: 100%;
  transition: 0.5s;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-faq-text p br {
    display: none;
  }
}



/*----------------------------------------*/
/*  8.8 Success Css
/*----------------------------------------*/

/*----------------------------------------*/
/*  8.9 Instagram Css
/*----------------------------------------*/
.ai-instagram-img {
  overflow: hidden;
}

.ai-instagram-img img {
  width: 100%;
  transition: 0.9s;
}

.ai-instagram-img:hover img {
  transform: scale(1.1);
}

.ai-instagram-shape-1 {
  position: absolute;
  left: -2%;
  z-index: -1;
  top: -125%;
}


/*----------------------------------------*/
/*  9.0 Feature Css
/*----------------------------------------*/
.app-feature-border-style .row [class*=col-]:first-child .app-feature-item {
  border-radius: 24px 0 0 24px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 767px) {
  .app-feature-border-style .row [class*=col-]:first-child .app-feature-item {
    border-radius: 0;
  }
}

.app-feature-border-style .row [class*=col-]:last-child .app-feature-item {
  border-radius: 0px 24px 24px 0px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 767px) {
  .app-feature-border-style .row [class*=col-]:last-child .app-feature-item {
    border-radius: 0;
  }
}

.app-feature-heading p {
  /* color: #61616A; */
}

.app-feature-item {
  padding: 50px 40px 30px;
  background-color: #fbfbff;
}

@media (max-width: 767px) {
  .app-feature-item {
    padding: 50px 30px 30px;
  }
}

.app-feature-item-icon {
  margin-bottom: 30px;
}

.app-feature-item-icon i {
  font-size: 40px;
  color: #097efe !important;
}

.app-feature-item-content p {
  font-size: 15px;
  color: #61616A;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 767px) {
  .app-feature-item-content p br {
    display: none;
  }
}

.app-feature-title {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 10px;

  font-family: var(--tp-ff-inter);
  color: var(--tp-common-black-10);
}

.app-feature-bottom p {
  margin: 0;
  font-size: 16px;
  color: #61616A;
  display: inline-block;
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .app-feature-bottom p {
    font-size: 16px;
  }
}

@media (max-width: 767px) {
  .app-feature-bottom p {
    font-size: 14px;
  }
}

.app-feature-bottom p span {
  font-weight: 600;
  padding: 4px 17px;
  margin-right: 10px;
  border-radius: 30px;
  color: var(--tp-common-black-10);
  border: 1px solid rgba(0, 0, 0, 0.1);
  background-color: var(--tp-common-white);
  box-shadow: 0px 20px 40px 0px rgba(33, 33, 45, 0.1);
}

.app-feature-bottom p a {
  font-weight: 500;
  text-decoration: underline;
  color: var(--tp-common-black-10);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .app-feature-2-ptb {
    padding-bottom: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .app-feature-2-ptb {
    padding-top: 120px;
    padding-bottom: 60px;
  }
}

.app-feature-2-bg {
  position: absolute;
  top: 0%;
  left: 22%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .app-feature-2-bg {
    left: 17%;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .app-feature-2-bg {
    left: 18%;
    top: 11%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .app-feature-2-bg {
    display: none;
  }
}

.app-feature-2-bg .shape-1 {
  position: absolute;
  top: 37%;
  left: 23%;
}

.app-feature-2-bg .shape-2 {
  position: absolute;
  top: 46%;
  left: 31%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .app-feature-2-bg .shape-2 {
    left: 40%;
    top: 47%;
  }
}

.app-feature-2-bg .shape-3 {
  position: absolute;
  top: 56%;
  right: 13%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .app-feature-2-bg .shape-3 {
    right: 0;
    top: 60%;
  }
}

.app-feature-2-thumb {
  padding-top: 75px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .app-feature-2-thumb {
    padding-top: 0;
  }
}

@media (max-width: 767px) {
  .app-feature-2-thumb {
    padding-top: 45px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .app-feature-2-thumb img {
    transform: scale(0.7);
  }
}

.app-feature-2-content {
  padding-left: 40px;
}

@media (max-width: 767px) {
  .app-feature-2-content {
    padding-left: 0;
  }
}

.app-feature-2-content .tp-section-subtitle.border-bg {
  position: relative;
  font-size: 17px;
  font-weight: 400;
  letter-spacing: -0.17px;
  padding: 11px 26px;
  margin-bottom: 25px;
  border-radius: 30px;
  border: 1px solid #FFF;
  background: rgba(255, 255, 255, 0.5);
  box-shadow: 0px 20px 40px 0px rgba(33, 33, 45, 0.1);
  backdrop-filter: blur(10px);
}

.app-feature-2-content-icon {
  margin-left: 25px;
}

.app-feature-2-content-icon span {
  display: inline-block;
  margin-right: 15px;
  transform: translateY(5px);
}

.app-feature-2-content-icon p {
  color: #61616A;
  font-size: 15px;
  margin: 0;
}

.app-feature-2-brd {
  height: 30px;
  width: 2px;
  margin-left: 35px;
  margin-bottom: 18px;
  background: rgba(34, 34, 46, 0.08);
}

.it-feature-ptb {
  padding-top: 60px;
}






/*----------------------------------------*/
/*  9.1 Review Css
/*----------------------------------------*/
@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .app-review-ptb {
    padding-bottom: 120px;
  }
}

.app-review-bg {
  padding: 40px;
  border-radius: 30px;
  background: linear-gradient(265deg, rgba(208, 242, 240, 0.8) 16.29%, rgba(197, 224, 252, 0.8) 84.71%);
}

.app-review-img {
  position: absolute;
  bottom: 0;
  left: 20%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .app-review-img {
    bottom: -54px;
    left: 22%;
    transform: scale(0.6);
  }
}

@media (max-width: 767px) {
  .app-review-img {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px) {
  .app-review-img {
    bottom: -26px;
    left: auto;
    transform: scale(0.8);
    right: 0;
    display: block;
  }
}

.app-review-title {
  font-size: 30px;
  font-weight: 600;

  font-family: var(--tp-ff-inter);
  line-height: 1;
  margin-bottom: 10px;
  background: linear-gradient(293deg, #3188FF -3.2%, #D34BE9 48.62%, #FF994B 102.56%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .app-review-heading {
    margin-bottom: 50px;
  }
}

@media (max-width: 767px) {
  .app-review-heading {
    margin-bottom: 30px;
  }
}

.app-review-heading p {
  color: #61616A;
  font-size: 14px;
}

.app-review-heading p span {
  font-weight: 700;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .app-review-item {
    margin-bottom: 50px;
  }
}

@media (max-width: 767px) {
  .app-review-item {
    margin-bottom: 30px;
  }
}

.app-review-item.ml {
  margin-left: -5px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .app-review-item.ml {
    margin-left: 0;
  }
}

.app-review-item.mr {
  margin-left: 10px;
  margin-right: -12px;
}

.app-review-item-icon {
  margin-bottom: 18px;
}

.app-review-item-content p {
  color: #61616A;
  font-size: 14px;
  margin: 0;
}

.app-review-item-title {
  font-size: 44px;
  font-weight: 500;
  line-height: 1;
  margin-bottom: 10px;
  letter-spacing: -0.44px;
  font-family: var(--tp-ff-inter);
  color: var(--tp-common-black-10);
}

/*----------------------------------------*/
/*  9.2 Stack Css
/*----------------------------------------*/








@media (max-width: 767px) {
  .tp-benefit-ptb {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media (max-width: 767px) {
  .tp-benefit-heading {
    margin-bottom: 50px;
  }
}





/*----------------------------------------*/
/*  9.4 Cta Css
/*----------------------------------------*/
.app-cta-wrap {
  border-radius: 30px;
  background: linear-gradient(265deg, #D0F2F0 16.29%, #C5E0FC 84.71%);
}

.app-cta-wrapper {
  /* padding-left: 170px; */
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .app-cta-wrapper {
    /* padding-left: 135px; */
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .app-cta-wrapper {
    /* padding-left: 100px; */
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .app-cta-wrapper {
    /* padding-left: 50px; */
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .app-cta-wrapper {
    /* padding-left: 30px; */
    padding-bottom: 30px;
  }
}

@media (max-width: 767px) {
  .app-cta-wrapper {
    padding-top: 45px;
    /* padding-right: 30px; */
  }
}

.app-cta-heading p {
  color: #61616A;
  letter-spacing: -0.18px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .app-cta-heading p br {
    display: none;
  }
}

.app-cta-store {
  display: flex;
  width: 184px;
  align-items: center;
  border-radius: 12px;
  padding: 9px 20px;
  transition: 0.4s;
  background: var(--tp-common-white);
  box-shadow: 0px 14px 24px 0px rgba(3, 46, 65, 0.2);
}

@media (max-width: 767px) {
  .app-cta-store {
    margin-bottom: 20px;
  }
}

.app-cta-store:hover {
  transform: scale(1.1);
}

.app-cta-store-icon {
  margin-right: 10px;
}

.app-cta-store-content p {
  margin: 0;
  font-size: 12px;
  color: var(--tp-common-black-10);
}

.app-cta-store-content span {
  font-size: 21px;
  font-weight: 600;
}

@media (max-width: 767px) {
  .app-cta-store-box {
    flex-wrap: wrap;
  }
}

.app-cta-thumb-2 {
  position: absolute;
  bottom: 0;
  right: 12%;
}

.st-cta-ptb {
  overflow: hidden;
  padding-top: 180px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-cta-ptb {
    padding-top: 120px;
    padding-bottom: 100px;
  }
}

.st-cta-bg-circle {
  position: absolute;
  top: 0;
  left: -3.5%;
  height: 1000px;
  width: 107%;
  display: inline-block;
  right: 0;
  margin: 0 auto;
  text-align: center;
}

.st-cta-wrapper .tp-section-title-playfair {
  font-size: 120px;
  color: var(--tp-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .st-cta-wrapper .tp-section-title-playfair {
    font-size: 100px;
  }
}

@media (max-width: 767px) {
  .st-cta-wrapper .tp-section-title-playfair {
    font-size: 62px;
  }
}

.st-cta-wrapper .tp-section-title-playfair span {
  color: var(--tp-common-white);
}

.st-cta-wrapper p {
  margin-bottom: 45px;
  color: var(--tp-common-white);
  font-family: var(--tp-ff-interoppins);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .st-cta-wrapper p br {
    display: none;
  }
}




@media (max-width: 767px) {
  .cr-cta-ptb {
    /* padding-top: 100px; */
  }
}

.cr-cta-bg {
  position: absolute;
  bottom: -30%;
  left: 0;
  right: 0;
  z-index: -1;
  margin: 0 auto;
  text-align: center;
}

@media (max-width: 767px) {
  .cr-cta-shape {
    display: none;
  }
}

.cr-cta-shape span {
  height: 5px;
  width: 5px;
  border-radius: 50%;
  background: #D9D9D9;
  display: inline-block;
}

/* Reusable dot cluster for other sections (right-side accent) */
.section-dots-right,
.section-dots-center {
  position: absolute;
  top: 8%;
  right: 4%;
  width: 160px;
  height: 160px;
  pointer-events: none;
  z-index: 0;
}

/* Center cluster: same movement, but positioned in the center */
.section-dots-center {
  top: 50%;
  left: 50%;
  right: auto;
  transform: translate(-50%, -50%);
}

.section-dots-right span,
.section-dots-center span {
  height: 5px;
  width: 5px;
  border-radius: 50%;
  background: #D9D9D9;
  display: inline-block;
  position: absolute;
  animation: bannerAnimationTwo 10s infinite linear;
}

.section-dots-right .dot-1 {
  top: 10%;
  left: 10%;
  animation-duration: 8s;
}

.section-dots-right .dot-2 {
  top: 25%;
  right: 5%;
  animation-duration: 9s;
}

.section-dots-right .dot-3 {
  top: 45%;
  left: 20%;
  animation-duration: 11s;
}

.section-dots-right .dot-4 {
  top: 65%;
  right: 12%;
  animation-duration: 7s;
}

.section-dots-right .dot-5 {
  top: 80%;
  left: 40%;
  animation-duration: 10s;
}

/* Dots inside center cluster (same feel as right cluster) */
.section-dots-center .dot-1 {
  top: 12%;
  left: 14%;
  animation-duration: 8s;
}

.section-dots-center .dot-2 {
  top: 26%;
  right: 10%;
  animation-duration: 9s;
}

.section-dots-center .dot-3 {
  top: 48%;
  left: 18%;
  animation-duration: 11s;
}

.section-dots-center .dot-4 {
  top: 66%;
  right: 16%;
  animation-duration: 7s;
}

.section-dots-center .dot-5 {
  top: 82%;
  left: 44%;
  animation-duration: 10s;
}

.section-dots-center .dot-6 {
  top: 67%;
  right: 44%;
  animation-duration: 15s;
}

.section-dots-center .dot-7 {
  top: 95%;
  right: 10%;
  animation-duration: 9s;

}

@media (max-width: 767px) {

  .section-dots-right,
  .section-dots-center {
    display: none;
  }
}

.cr-cta-shape .shape-1 {
  position: absolute;
  animation: bannerAnimationTwo 8s infinite linear;
}

.cr-cta-shape .shape-2 {
  position: absolute;
  animation: bannerAnimationTwo 9s infinite linear;
}

.cr-cta-shape .shape-3 {
  position: absolute;
  animation: bannerAnimationTwo 10s infinite linear;
}

.cr-cta-shape .shape-4 {
  position: absolute;
  animation: bannerAnimationTwo 11s infinite linear;
}

.cr-cta-shape .shape-5 {
  position: absolute;
  animation: bannerAnimationTwo 7s infinite linear;
}

.cr-cta-shape .shape-6 {
  position: absolute;
  animation: bannerAnimationTwo 8s infinite linear;
}

.cr-cta-shape .shape-7 {
  position: absolute;
  animation: bannerAnimationTwo 9s infinite linear;
}

.cr-cta-shape .shape-8 {
  position: absolute;
  animation: bannerAnimationTwo 10s infinite linear;
}

.cr-cta-shape .shape-9 {
  position: absolute;
  animation: bannerAnimationTwo 11s infinite linear;
}

.cr-cta-shape .shape-10 {
  position: absolute;
  animation: bannerAnimationTwo 7s infinite linear;
}

.cr-cta-shape .shape-11 {
  position: absolute;
  animation: bannerAnimationTwo 8s infinite linear;
}

.cr-cta-shape .shape-12 {
  position: absolute;
  animation: bannerAnimationTwo 9s infinite linear;
}

.cr-cta-shape .shape-13 {
  position: absolute;
  animation: bannerAnimationTwo 10s infinite linear;
}

.cr-cta-shape .shape-14 {
  position: absolute;
  animation: bannerAnimationTwo 11s infinite linear;
}

.cr-cta-shape .shape-15 {
  position: absolute;
  animation: bannerAnimationTwo 7s infinite linear;
}

.cr-cta-shape .shape-1 {
  bottom: 15%;
  left: 35%;
}

.cr-cta-shape .shape-2 {
  bottom: 8%;
  right: 45%;
}

.cr-cta-shape .shape-3 {
  bottom: 20%;
  left: 40%;
}

.cr-cta-shape .shape-4 {
  bottom: 16%;
  right: 37%;
}

.cr-cta-shape .shape-5 {
  bottom: 10%;
  left: 40%;
}

.cr-cta-shape .shape-6 {
  bottom: 20%;
  left: 45%;
}

.cr-cta-shape .shape-7 {
  bottom: 9%;
  right: 35%;
}

.cr-cta-shape .shape-8 {
  bottom: 30%;
  left: 50%;
}

.cr-cta-shape .shape-9 {
  bottom: 22%;
  right: 31%;
}

.cr-cta-shape .shape-10 {
  bottom: 15%;
  left: 24%;
}

.cr-cta-shape .shape-11,
.cr-cta-shape .shape-12,
.cr-cta-shape .shape-13,
.cr-cta-shape .shape-14,
.cr-cta-shape .shape-15 {
  width: 1px;
  height: 1px;
}

.cr-cta-shape .shape-11 {
  bottom: 10%;
  left: 35%;
}

.cr-cta-shape .shape-12 {
  bottom: 15%;
  right: 35%;
}

.cr-cta-shape .shape-13 {
  bottom: 20%;
  left: 50%;
}

.cr-cta-shape .shape-14 {
  bottom: 26%;
  right: 27%;
}

.cr-cta-shape .shape-15 {
  bottom: 10%;
  left: 30%;
}

.cr-cta-text {
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 35px;
  color: rgba(255, 255, 255, 0.5);
}







/*----------------------------------------*/
/*  9.6 Project Slider Css
/*----------------------------------------*/


.char-wrap {
  display: inline-block;
  position: relative;
  overflow: hidden;
  display: inline-flex;
}













.tp-perspective-scroll a {
  font-size: 17px;
  font-weight: 400;
  line-height: 1;

  color: var(--tp-common-white);
  font-family: var(--tp-ff-inter);
}









/*----------------------------------------*/
/*  9.7 Career Css
/*----------------------------------------*/




/*----------------------------------------*/
/*  9.8 Contact Css
/*----------------------------------------*/
.tp-contact-main-ptb {
  padding-top: 195px;
}

@media (max-width: 767px) {
  .tp-contact-main-ptb {
    padding-top: 150px;
  }
}



.tp-contact-main-bottom {
  margin-top: -200px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-contact-main-bottom {
    margin-top: 0px;
  }
}

.tp-contact-map-ptb {
  margin-top: -200px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-contact-map-ptb {
    margin-top: 0;
  }
}

@media (max-width: 767px) {
  .tp-contact-map-ptb {
    padding-bottom: 100px;
  }
}

.tp-contact-map-wrapper {
  width: 100%;
  height: 760px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-contact-map-wrapper {
    height: 600px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-contact-map-wrapper {
    height: 500px;
  }
}

@media (max-width: 767px) {
  .tp-contact-map-wrapper {
    height: 450px;
  }
}

.tp-contact-map-wrapper iframe {
  width: 100%;
  height: 100%;
}

.tp-contact-map-icon {
  position: relative;
}

.tp-contact-map-icon::after {
  position: absolute;
  content: "";
  top: -5px;
  left: -5px;
  margin: 0 auto;
  height: 120px;
  width: 120px;
  z-index: -1;
  border-radius: 140px;
  backdrop-filter: blur(7px);
  transform: translate(-20%, -20%);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--tp-common-white);
  animation: animate-pulse 3s linear infinite;
  box-shadow: 0px 20px 50px 0px rgba(17, 16, 19, 0.14);
}

.tp-contact-map-icon span {
  display: grid;
  height: 60px;
  width: 60px;
  z-index: 2;
  text-align: center;
  border-radius: 50%;
  place-content: center;
  background-color: var(--tp-common-secondary);
}

.tp-contact-map-icon-box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@media (max-width: 767px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-contact-form-ptb {
    padding-bottom: 100px;
  }
}

.tp-contact-form-input label {
  font-size: 16px;
  font-weight: 500;
  color: #111013;
  line-height: 1;
  margin-bottom: 12px;
}

.tp-contact-form-input input,
.tp-contact-form-input textarea {
  border-radius: 8px;
  background: #F8F8FB;
  border-color: #F8F8FB;
}

.tp-contact-form-input input:focus,
.tp-contact-form-input textarea:focus {
  background: var(--tp-common-white);
  border-color: var(--tp-common-secondary);
}

.tp-contact-form-input textarea {
  resize: none;
  height: 160px;
}

.tp-contact-form-btn button {
  font-size: 18px;
  font-weight: 600;
  line-height: 1;
  border-radius: 999px;
  padding: 18px 46px;
  letter-spacing: -0.18px;
  border: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #fff;
  background: linear-gradient(135deg, #41bc84, #86f2c8);
  /* box-shadow: 0 14px 40px rgba(65, 188, 132, 0.35); */

  box-shadow: 0 2px 18px rgba(65, 188, 132, 0.35);
  transition: background 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}

/* .tp-contact-form-btn button:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 45px rgba(65, 188, 132, 0.45);
} */

.tp-contact-form-btn button:active {
  transform: translateY(0);
  box-shadow: 0 8px 26px rgba(65, 188, 132, 0.3);
}

.tp-contact-form-btn button:focus-visible {
  outline: 2px solid #41bc84;
  outline-offset: 3px;
}

.tp-contact-form-btn button span {
  position: relative;
  z-index: 1;
  line-height: 1;
  overflow: hidden;
  display: inline-block;
}

.tp-contact-form-btn button span span.text-1 {
  position: relative;
  display: block;
  transition: 0.3s;
}

.tp-contact-form-btn button span span.text-2 {
  position: absolute;
  top: 100%;
  display: block;
  transition: 0.3s;
}

.tp-contact-form-btn button:hover span span.text-1 {
  -webkit-transform: translateY(-150%);
  transform: translateY(-150%);
}

.tp-contact-form-btn button:hover span span.text-2 {
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.tp-contact-category-btn {
  font-size: 18px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  border-radius: 12px;
  padding: 20px 43px;
  margin-bottom: 10px;
  margin-right: 10px;
  display: inline-block;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  color: var(--tp-common-white);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.tp-contact-category-btn:hover,
.tp-contact-category-btn.active {
  background-color: #FFF669;
  color: var(--tp-common-black-7);
}

@media (max-width: 767px) {
  .tp-contact-category-btn {
    font-size: 16px;
    padding: 16px 36px;
  }
}





@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .cn-contactform-support-area {
    margin-bottom: 80px;
  }
}

.cn-contactform-support-bg {
  background-repeat: no-repeat;
  background-size: cover;
  object-fit: cover;
  height: 385px;
}

.cn-contactform-support-text span {
  font-size: 44px;
  font-weight: 500;
  line-height: 52px;
  max-width: 755px;
  margin: 0 auto;
  display: inline-block;
  letter-spacing: -0.88px;
  color: var(--tp-common-white);
}

@media (max-width: 767px) {
  .cn-contactform-support-text span {
    font-size: 40px;
  }
}























@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-2-ptb {
    padding-top: 150px;
  }
}

@media (max-width: 767px) {
  .tp-pd-2-ptb {
    padding-bottom: 50px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-pd-2-area {
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-2-area {
    padding-bottom: 80px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-pd-2-top {
    padding-bottom: 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-2-top {
    padding-bottom: 40px;
  }
}

.tp-pd-2-title {
  font-size: 140px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -7px;
  color: var(--tp-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-pd-2-title {
    font-size: 110px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-pd-2-title {
    font-size: 100px;
    letter-spacing: 0;
  }
}

@media (max-width: 767px) {
  .tp-pd-2-title {
    font-size: 60px;
    letter-spacing: 0;
  }
}


@media (max-width: 767px) {
  .tp-pd-2-bottom {
    flex-wrap: wrap;
  }
}

.tp-pd-2-bottom .tp-pd-2-banner {
  height: 950px;
  overflow: hidden;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-pd-2-banner {
    height: 680px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-pd-2-banner {
    height: 600px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-pd-2-banner {
    height: 500px;
  }
}

@media (max-width: 767px) {
  .tp-pd-2-banner {
    height: 250px;
  }
}

.tp-pd-2-banner img {
  width: 100%;
  margin-top: -150px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-pd-2-banner img {
    margin-top: -100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-pd-2-banner img {
    margin-top: -20px;
  }
}

@media (max-width: 767px) {
  .tp-pd-2-banner img {
    margin-top: -50px;
  }
}







.tp-pd-2-dot .swiper-pagination-bullet {
  width: 6px;
  height: 6px;
  opacity: 1;
  transition: 0.3s;
  border-radius: 50%;
  display: inline-block;
  background: rgba(255, 255, 255, 0.3);
}

.tp-pd-2-dot .swiper-pagination-bullet.swiper-pagination-bullet-active {
  width: 24px;
  border-radius: 10px;
  background-color: var(--tp-common-white);
}

@media (max-width: 767px) {
  .tp-pd-2-step-heading {
    padding-bottom: 40px;
  }
}

.tp-pd-2-step-title {
  font-size: 40px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -1.2px;
  color: var(--tp-common-white);
}

@media (max-width: 767px) {
  .tp-pd-2-step-title {
    font-size: 35px;
    letter-spacing: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-2-step-title br {
    display: none;
  }
}

.tp-pd-2-step-item-title {
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 10px;
  color: var(--tp-common-white);
}

.tp-pd-2-step-item span {
  font-size: 15px;
  font-weight: 500;
  line-height: 24px;
  display: inline-block;
  color: rgba(255, 255, 255, 0.6);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-2-step-item span br {
    display: none;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-pd-2-thumb-ptb {
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-2-thumb-ptb {
    padding-bottom: 80px;
  }
}

.tp-pd-2-thumb-item {
  overflow: hidden;
  height: 600px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-pd-2-thumb-item {
    height: 500px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-pd-2-thumb-item {
    height: 400px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-pd-2-thumb-item {
    height: 450px;
  }
}

@media (max-width: 767px) {
  .tp-pd-2-thumb-item {
    height: 250px;
  }
}

.tp-pd-2-thumb-item img {
  margin-top: -100px;
  width: 100%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-pd-2-thumb-item img {
    margin-top: -60px;
  }
}

@media (max-width: 767px) {
  .tp-pd-2-thumb-item img {
    margin-top: -40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-2-np-ptb {
    padding-bottom: 80px;
  }
}

.tp-pd-2-np-content a {
  width: 180px;
  height: 180px;
  font-size: 16px;
  font-weight: 600;
  margin: 0 -14px;
  text-align: center;
  line-height: 180px;
  border-radius: 50%;
  display: inline-block;
  color: var(--tp-common-white);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.tp-pd-2-np-content a:hover {
  color: var(--tp-common-black);
  background-color: var(--tp-common-white);
}

.tp-pd-2-np-content a svg {
  margin: 0 4px;
}

.tp-pd-4-ptb {
  padding-top: 220px;
  padding-bottom: 50px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-4-ptb {
    padding-top: 150px;
  }
}

.tp-pd-4-title {
  font-size: 100px;
  font-weight: 400;
  line-height: 1;
  color: #E0EEEE;
  letter-spacing: -2px;
  font-family: var(--tp-ff-inter);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-pd-4-title {
    font-size: 80px;
    letter-spacing: 0;
  }
}

@media (max-width: 767px) {
  .tp-pd-4-title {
    font-size: 65px;
    letter-spacing: 0;
  }
}



@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-4-banner-ptb {
    padding-top: 80px;
  }
}

.tp-pd-4-banner-thumb {
  margin-bottom: -275px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-pd-4-banner-thumb {
    margin-bottom: -100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-4-banner-thumb {
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-pd-4-heading {
    margin-bottom: 60px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-4-heading {
    margin-bottom: 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-4-heading-bottom {
    flex-wrap: wrap;
  }

  .tp-pd-4-heading-bottom .tp-pd-2-bottom-item {
    margin-right: 20px;
    padding-bottom: 0;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-pd-4-about-ptb {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-4-about-ptb {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

.tp-pd-4-about-sub {
  font-size: 20px;
  font-weight: 400;
  color: #E0EEEE;
  letter-spacing: -0.4px;
  font-family: var(--tp-ff-inter);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-4-about-sub {
    letter-spacing: 0;
  }
}






@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-4-thumb-ptb {
    padding-bottom: 80px;
  }
}

.tp-pd-4-thumb-wrap {
  height: 950px;
  border-radius: 20px;
  background-color: #FFF669;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-pd-4-thumb-wrap {
    height: 750px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-pd-4-thumb-wrap {
    height: 650px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-pd-4-thumb-wrap {
    height: 500px;
  }
}

@media (max-width: 767px) {
  .tp-pd-4-thumb-wrap {
    height: 300px;
  }
}

.tp-pd-4-thumb-item {
  margin-bottom: -100%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-4-thumb-item {
    margin-bottom: 0;
  }
}

.tp-pd-4-thumb-box {
  height: 800px;
  border-radius: 20px;
  overflow: hidden;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-pd-4-thumb-box {
    height: 520px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-pd-4-thumb-box {
    height: 420px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-pd-4-thumb-box {
    height: 450px;
  }
}

@media (max-width: 767px) {
  .tp-pd-4-thumb-box {
    height: 250px;
  }
}

.tp-pd-4-thumb-box img {
  width: 100%;
  margin-top: -40px;
  object-fit: cover;
  border-radius: 20px;
}


.tp-pd-5-hero-black-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  z-index: 1;
  background-color: #000;
  transition: opacity 0.2s ease;
}

.tp-pd-5-hero-white-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  z-index: 1;
  background-color: #fff;
  transition: opacity 0.4s ease;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-5-hero-ptb {
    padding-top: 150px;
    padding-bottom: 120px;
  }
}

.tp-pd-5-hero-title {
  font-size: 80px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 24px;
  letter-spacing: -4px;
  color: var(--tp-common-white);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-pd-5-hero-title {
    font-size: 75px;
  }
}

@media (max-width: 767px) {
  .tp-pd-5-hero-title {
    font-size: 60px;
    letter-spacing: 0;
  }
}

.tp-pd-5-hero-heading p {
  font-size: 16px;
  font-weight: 500;
  line-height: 26px;
  margin-bottom: 50px;
  color: rgba(255, 255, 255, 0.7);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 767px) {
  .tp-pd-5-hero-heading p br {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-5-hero-top {
    padding-bottom: 40px;
  }
}

.tp-pd-5-hero-info-ptb {
  transition: 0.3s;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-5-hero-info-ptb {
    padding-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-5-hero-info-item {
    padding-bottom: 30px;
  }
}

.tp-pd-5-hero-info-item-title {
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.9px;
  color: var(--tp-common-black);
}

.tp-pd-5-hero-info-item-title span {
  font-size: 12px;
  display: inline-block;
  transform: translate(-9px, -13px);
}

.tp-pd-5-hero-info-item-content {
  padding-left: 80px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-5-hero-info-item-content {
    padding-left: 0;
  }
}

.tp-pd-5-hero-info-item-content p {
  font-size: 18px;
  font-weight: 500;
  line-height: 26px;
  color: rgba(0, 0, 0, 0.6);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-5-hero-info-item-content p br {
    display: none;
  }
}

.tp-pd-5-light-ptb {
  padding-top: 120px;
  padding-bottom: 200px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-pd-5-light-ptb {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-5-light-ptb {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-5-light-heading {
    padding-bottom: 35px;
  }
}

.tp-pd-5-light-title {
  font-size: 50px;
  font-weight: 700;
  color: #0E0F11;
  line-height: 1;
  letter-spacing: -1.5px;
}

.tp-pd-5-light-slider-thumb img {
  width: 100%;
  border-radius: 30px;
  border: 1px solid rgba(0, 0, 0, 0.0705882353);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-pd-5-mockup-ptb {
    padding-top: 100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-5-mockup-ptb {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

.tp-pd-5-mockup-title {
  font-size: 50px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 20px;
  letter-spacing: -1.5px;
  color: var(--tp-common-white);
}

.tp-pd-5-mockup-heading {
  padding-bottom: 30px;
}

.tp-pd-5-mockup-heading p {
  font-size: 18px;
  font-weight: 500;
  line-height: 26px;
  color: rgba(255, 255, 255, 0.6);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-5-mockup-heading p br {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .tp-pd-5-slider-ptb {
    padding-bottom: 80px;
  }
}





.video-progress-btn-wrap {
  position: absolute;
  left: 40px;
  right: 40px;
  bottom: 80px;
}




.subscribe-popup {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 1099;
  background-color: rgba(0, 0, 0, 0.5);
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s;
  margin: 0 auto;
  text-align: center;
}

.subscribe-popup.show {
  visibility: visible;
  opacity: 1;
}

.subscribe-popup .close i {
  position: absolute;
  right: 20px;
  top: 20px;
  font-size: 20px;
  cursor: pointer;
  font-weight: 400;
  color: var(--tp-common-black);
  transition: 0.3s;
}

.subscribe-popup .close:hover i {
  transform: rotate(180deg);
}

@keyframes zoomInOut {

  0%,
  100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.1);
  }
}





.modal .modal-dialog {
  width: 100%;
  max-width: 100%;
  margin-top: 0;
  margin-bottom: 0;
}

.modal-wrapper {
  position: relative;
  z-index: 999999999;
}

.modal {
  overflow-y: scroll;
  overflow-x: hidden;
  --bs-modal-border-width: 0;
  --bs-modal-border-radius: 0;
}

.btn-close {
  position: absolute;
  top: 35px;
  right: 35px;
  z-index: 99999999999;
  padding: 0;
  margin: 0;
  height: 50px;
  width: 50px;
  border-radius: 50%;
  color: var(--tp-common-black);
  background-color: #fff !important;
  border: 1px solid rgba(25, 25, 26, 0.2);
  opacity: 1;
  transition: 0.3s;
}

.btn-close:hover {
  border-color: var(--tp-common-black) !important;
  transform: rotate(180deg);
}

.btn-close:focus {
  outline: 0;
  box-shadow: none;
  opacity: 1;
}

.modal-body {
  padding: 0;
}

.modal-header {
  padding: 0;
  border-bottom: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}







.tp-return-customer {
  display: none;
  margin-top: 14px;
  padding: 40px 40px;
  background-color: var(--tp-common-white);
}

.tp-return-customer-input {
  margin-bottom: 20px;
}

.tp-return-customer-input label {
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 12px;
  color: var(--tp-common-black);
}

.tp-return-customer-input label span {
  color: red;
}

.tp-return-customer-input input,
.tp-return-customer-input textarea {
  width: 100%;
  padding: 0 26px;
  line-height: 56px;
  font-size: 14px;

  border: 1px solid transparent;
  color: var(--tp-common-black);
  background: #F4F0EA;
}

.tp-return-customer-input input::placeholder,
.tp-return-customer-input textarea::placeholder {
  font-size: 14px;
  line-height: 56px;

  color: rgba(0, 0, 0, 0.4);
}

.tp-return-customer-input input:focus,
.tp-return-customer-input textarea:focus {
  background: transparent;
  border-color: var(--tp-common-black);
}

.tp-return-customer-remeber input {
  display: none;
}

.tp-return-customer-remeber input:checked~label::after {
  border-color: var(--tp-common-black);
  background-color: var(--tp-common-black);
}

.tp-return-customer-remeber input:checked~label::before {
  opacity: 1;
  visibility: visible;
}

.tp-return-customer-remeber label {
  font-size: 15px;
  color: #55585B;
  position: relative;
  padding-left: 26px;
  z-index: 1;
}

.tp-return-customer-remeber label::after {
  position: absolute;
  content: "";
  top: 4px;
  left: 0;
  width: 18px;
  height: 18px;
  line-height: 16px;
  text-align: center;
  border: 1px solid #C3C7C9;
  z-index: -1;
  transition: all 0.4s ease;
}

.tp-return-customer-remeber label::before {
  position: absolute;
  content: url("../img/login/check.svg");
  top: 4px;
  left: 0;
  width: 18px;
  height: 18px;
  line-height: 16px;
  text-align: center;
  visibility: hidden;
  opacity: 0;
  color: var(--tp-common-white);
  transition: all 0.4s ease;
}

.tp-return-customer-remeber label a:hover {
  color: var(--tp-common-black);
}

.tp-return-customer-remeber label:hover {
  cursor: pointer;
}

.tp-return-customer-forgot a {
  font-weight: 400;
  font-size: 15px;
  color: var(--tp-common-black);
  position: relative;
  display: inline-block;
}

.tp-return-customer-forgot a::after {
  position: absolute;
  content: url("../img/login/check.svg");
  left: auto;
  right: 0;
  bottom: 4px;
  width: 0%;
  height: 1px;
  background-color: var(--tp-common-black);
  transition: all 0.4s ease;
}

.tp-return-customer-forgot a:hover::after {
  left: 0;
  right: auto;
  width: 100%;
}

.tp-order-details {
  padding: 70px 100px 55px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-order-details {
    padding: 70px 70px 55px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-order-details {
    padding: 70px 30px 55px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-order-details {
    padding: 70px 50px 55px;
  }
}

@media (max-width: 767px) {
  .tp-order-details {
    padding: 40px 30px 45px;
  }
}

.tp-order-details-icon {
  margin-bottom: 22px;
}

.tp-order-details-icon span {
  display: inline-block;
  width: 120px;
  height: 120px;
  line-height: 118px;
  text-align: center;
  font-size: 55px;
  color: var(--tp-common-white);
  border-bottom: 1px solid #E0E2E3;
  border-radius: 50%;
}

.tp-order-details-icon span svg {
  transform: translateY(-1px);
}

.tp-order-details-title {
  font-size: 30px;
  font-weight: 600;
  color: var(--tp-common-white);
  margin-bottom: 7px;
}

.tp-order-details-content p {
  font-size: 16px;
  color: var(--tp-common-white);
  line-height: 1.38;
}

.tp-order-details-item {
  margin-bottom: 38px;
}

.tp-order-details-item-wrapper .row [class*=col-]:nth-child(2n) .tp-order-details-item {
  padding-left: 40px;
}

@media (max-width: 767px) {
  .tp-order-details-item-wrapper .row [class*=col-]:nth-child(2n) .tp-order-details-item {
    padding-left: 0;
  }
}

.tp-order-details-item h4 {
  font-size: 18px;
  color: var(--tp-common-white);
  margin-bottom: 0;
  font-weight: 400;
}

.tp-order-details-item p {
  font-weight: 700;
  font-size: 18px;
  color: var(--tp-common-white);
  margin-bottom: 0;
}

.tp-order-info-wrapper {
  padding: 42px 50px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-order-info-wrapper {
    padding: 42px 40px;
  }
}

@media (max-width: 767px) {
  .tp-order-info-wrapper {
    padding: 42px 30px;
  }
}

.tp-order-info-title {
  font-size: 26px;
  font-weight: 600;
  margin-bottom: 40px;
}

.tp-order-info-list ul li {
  list-style: none;
  padding: 15px 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.tp-order-info-list ul li:not(:last-child) {
  border-bottom: 1px solid #E0E2E3;
}

.tp-order-info-list ul li span {
  font-size: 15px;
  color: var(--tp-common-black);
}

.tp-order-info-list ul li.tp-order-info-list-header {
  padding-top: 0;
  padding-bottom: 12px;
}

.tp-order-info-list ul li.tp-order-info-list-header h4 {
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 0;
}

.tp-order-info-list ul li.tp-order-info-list-desc p {
  font-size: 15px;
  margin-bottom: 0;
}

.tp-order-info-list ul li.tp-order-info-list-desc p span {
  font-size: 15px;
  font-weight: 500;
}

.tp-order-info-list ul li.tp-order-info-list-subtotal span:last-child {
  color: var(--tp-common-black);
}

.tp-order-info-list ul li.tp-order-info-list-shipping span input {
  display: none;
}

.tp-order-info-list ul li.tp-order-info-list-shipping span input:checked~label::after {
  border-color: #4d3d30;
}

.tp-order-info-list ul li.tp-order-info-list-shipping span input:checked~label::before {
  opacity: 1;
  visibility: visible;
}

.tp-order-info-list ul li.tp-order-info-list-shipping span label {
  font-size: 14px;
  position: relative;
  padding-right: 27px;
}

.tp-order-info-list ul li.tp-order-info-list-shipping span label span {
  color: var(--tp-common-black);
}

.tp-order-info-list ul li.tp-order-info-list-shipping span label:hover {
  cursor: pointer;
}

.tp-order-info-list ul li.tp-order-info-list-shipping span label::after {
  position: absolute;
  content: "";
  right: 0;
  top: 5px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 1px solid #BCBCBC;
  transition: all 0.4s ease;
}

.tp-order-info-list ul li.tp-order-info-list-shipping span label::before {
  position: absolute;
  content: "";
  right: 4px;
  top: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #4d3d30;
  visibility: hidden;
  opacity: 0;
  transition: all 0.4s ease;
}

.tp-order-info-list ul li.tp-order-info-list-total {
  padding: 14px 0;
}

.tp-order-info-list ul li.tp-order-info-list-total span {
  font-size: 16px;
  font-weight: 500;
}

.tp-order-inner {
  background-color: var(--tp-common-white);
  box-shadow: 0px 30px 70px rgba(1, 15, 28, 0.1);
}
















/*----------------------------------------*/
/*  10.6 Error Css
/*----------------------------------------*/
.tp-error-title {
  font-weight: 700;
  font-size: 64px;
  margin-bottom: 50px;
  color: var(--tp-common-black);
}

.tp-error-title-sm {
  font-weight: 600;
  font-size: 26px;
  line-height: 1;

  color: var(--tp-common-black);
}

.tp-error-content p {
  font-weight: 400;
  font-size: 18px;
  color: #57575a;
  margin-bottom: 30px;
}

.tp-error-content .tp-btn {
  height: 60px;
  line-height: 55px;
  border-radius: 40px;
  padding: 0 18px 0 24px;
  font-weight: 500;
  font-size: 18px;
  letter-spacing: 0.03em;
  z-index: 9;
  overflow: hidden;
  display: inline-block;

  position: relative;
  transition: all 0.3s;
  background-color: var(--tp-common-black);
  color: var(--tp-common-white);
  border: 2px solid transparent;
}

.tp-error-content .tp-btn:hover {
  background-color: transparent;
  color: var(--tp-common-black);
  border-color: var(--tp-common-black);
}

.tp-error-wrapper img {
  margin-bottom: 55px;
}

/*----------------------------------------*/
/*  10.7 Dark Css Start
/*----------------------------------------*/
.agntix-dark body {
  background-color: #0E0F11;
}

.agntix-dark .tp-section-subtitle {
  color: var(--tp-common-white);
}

.agntix-dark .tp-about-text p {
  color: var(--tp-common-white);
}

.agntix-dark .tp-about-avater-info p {
  color: rgba(255, 255, 255, 0.6);
}







.agntix-dark .tp_text_invert>div {
  background-image: linear-gradient(to right, #fff 50%, #383C3E 50%);
}






.agntix-dark .tp-section-title {
  color: var(--tp-common-white);
}



.agntix-dark .tp-about-avater-info {
  border-color: rgba(255, 255, 255, 0.1);
}




.agntix-dark .tp-section-title-grotesk {
  color: var(--tp-common-white);
}










.agntix-dark .ar-hero-title {
  color: var(--tp-common-white);
}





.agntix-dark .tp-section-title-clash-600 {
  color: var(--tp-common-white);
}


.agntix-dark .tp-btn-black-solid {
  color: var(--tp-common-black);
  border: 1px solid transparent;
  background-color: var(--tp-common-white);
}

.agntix-dark .tp-btn-black-solid:hover {
  color: var(--tp-common-white);
  background-color: var(--tp-common-red-2);
  border-color: var(--tp-common-red-2);
}

.agntix-dark .ar-banner-shape img {
  filter: invert(1);
}


.agntix-dark .ar-about-exp-box {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-top: 4px solid var(--tp-common-red-2);
}





.agntix-dark .tp-btn-red-circle-icon {
  color: var(--tp-common-white);
  background-color: var(--tp-common-red-2);
  border: 1px solid var(--tp-common-red-2);
}



.agntix-dark .tp-btn-red-circle-box:hover> :nth-child(1) {
  border-color: transparent;
}

.agntix-dark .ar-funfact-item h4 {
  color: var(--tp-common-white);
}

.agntix-dark .ar-funfact-item span {
  color: var(--tp-common-white);
}


.agntix-dark .fraction-wrapper #paginations span {
  color: var(--tp-common-white);
}












.agntix-dark .ar-brand-item img {
  filter: invert(1);
}

.agntix-dark .ar-blog-title-sm {
  color: var(--tp-common-white);
}

.agntix-dark .ar-blog-meta {
  color: rgba(255, 255, 255, 0.6);
}

.agntix-dark .tp-header-8-border {
  border-bottom: 1px solid rgba(252, 252, 252, 0.08);
}



.agntix-dark .tp-section-subtitle.border-bg.bg-color {
  background: var(--tp-common-black);
}

.agntix-dark .tp-section-title-phudu {
  color: var(--tp-common-white);
}

.agntix-dark .app-feature-heading p {
  color: rgba(255, 255, 255, 0.6);
}

.agntix-dark .app-feature-item {
  background-color: #1A1B1E;
}

.agntix-dark .app-feature-item-icon span {
  color: var(--tp-common-white);
}

.agntix-dark .app-feature-title {
  color: var(--tp-common-white);
}

.agntix-dark .app-feature-item-content p {
  color: rgba(255, 255, 255, 0.6);
}

.agntix-dark .app-feature-bottom p {
  color: rgba(255, 255, 255, 0.6);
}

.agntix-dark .app-feature-bottom p a {
  color: var(--tp-common-white);
}

.agntix-dark .app-feature-2-bg .main-bg {
  opacity: 0.1;
}

.agntix-dark .app-feature-2-brd {
  background: rgba(255, 255, 255, 0.08);
}

.agntix-dark .app-feature-2-content-icon span {
  filter: invert(1);
}

.agntix-dark .app-feature-2-content-icon p {
  color: rgba(255, 255, 255, 0.6);
}

.agntix-dark .app-review-bg {
  background: linear-gradient(265deg, rgba(208, 242, 240, 0.1) 16.29%, rgba(197, 224, 252, 0.1) 84.71%);
}

.agntix-dark .app-review-heading p {
  color: rgba(255, 255, 255, 0.6);
}

.agntix-dark .app-review-item-title {
  color: var(--tp-common-white);
}

.agntix-dark .app-review-item-content p {
  color: rgba(255, 255, 255, 0.6);
}



.agntix-dark .tp-gsap-bg {
  background-color: #1a1b1e;
}



.agntix-dark .crp-price-item {
  border: none;
  background: rgb(26, 27, 30);
}





.agntix-dark .app-cta-heading p {
  color: rgba(255, 255, 255, 0.6);
}



.agntix-dark .app-copyright-text p {
  color: rgba(255, 255, 255, 0.6);
}

.agntix-dark .app-copyright-text p a {
  color: var(--tp-common-white);
}




.agntix-dark .app-copyright-text p a:hover {
  border-bottom: 1px solid white;
}

.agntix-dark .tp-copyright-2-border.app-copyright-border {
  border-color: rgba(255, 255, 255, 0.06);
}

.agntix-dark .app-feature-2-content .tp-section-subtitle.border-bg {
  border-color: rgba(0, 0, 0, 0.1);
}


.agntix-dark .tp-btn-black-radius.btn-blue-bg.btn-border {
  color: var(--tp-common-white);
  border: 1px solid rgba(255, 255, 255, 0.1);
}




.agntix-dark .tp-section-subtitle-platform.platform-text-black {
  color: var(--tp-common-white);
}

.agntix-dark .tp-section-title-platform.platform-text-black {
  color: var(--tp-common-white);
}




.agntix-dark .it-about-shape-2 {
  filter: invert(1);
}

.agntix-dark .it-about-shape-1 {
  filter: invert(1);
}




.agntix-dark .it-comparison-bg {
  background: #1A1B1E;
}

.agntix-dark .it-comparison-logo {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.agntix-dark .it-comparison-logo img {
  filter: invert(1);
}

.agntix-dark .it-comparison-content span {
  color: rgba(255, 255, 255, 0.6);
}

.agntix-dark .it-comparison-content span i {
  color: var(--tp-common-white);
}

.agntix-dark .it-comparison-item {
  border-right: 3px solid #0e0f11;
}





.agntix-dark .it-faq-shape-1 {
  filter: invert(1);
}

.agntix-dark .it-faq-shape-2 {
  filter: invert(1);
}





.agntix-dark .st-brand-heading span {
  color: var(--tp-common-white);
}

.agntix-dark .st-brand-border {
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.agntix-dark .st-brand-border::after {
  background-color: rgba(255, 255, 255, 0.15);
}

.agntix-dark .st-brand-item img {
  filter: invert(1);
}



.agntix-dark .st-about-card {
  background-color: #1A1B1E;
}

.agntix-dark .st-about-card-tag span {
  color: rgba(255, 255, 255, 0.6);
}

.agntix-dark .st-about-card-btn a {
  color: var(--tp-common-black);
  background-color: var(--tp-common-white);
}

.agntix-dark .st-about-card-bottom span {
  color: var(--tp-common-white);
}

.agntix-dark .st-about-shape {
  filter: invert(1);
}

.agntix-dark .tp-section-title-playfair {
  color: var(--tp-common-white);
}

.agntix-dark .tp-section-title-playfair span {
  color: rgba(255, 255, 255, 0.6);
}




.agntix-dark .st-award-title {
  color: var(--tp-common-white);
}

.agntix-dark .st-award-title span {
  color: rgba(255, 255, 255, 0.4);
}



.agntix-dark .st-counter-wrapper {
  border-color: rgba(255, 255, 255, 0.15);
}

.agntix-dark .st-counter-wrapper .row [class*=col-]:not(:last-child) {
  border-right: 1px solid rgba(255, 255, 255, 0.15);
}










.agntix-dark .ar-about-us-4-title-box .ar-about-us-4-icon {
  filter: invert(1);
}

.agntix-dark .ar-about-us-4-title-box.shape-color .ar-about-us-4-icon {
  filter: invert(0);
}











.agntix-dark .tp-footer-style-6 .tp-footer-widget-title {
  color: var(--tp-common-white);
}

.agntix-dark .tp-footer-style-6 .tp-footer-widget-info a {
  color: var(--tp-common-white);
}

.agntix-dark .tp-footer-style-6 .tp-footer-widget-title-sm {
  color: var(--tp-common-white);
}





.agntix-dark .ar-about-us-4-title {
  color: var(--tp-common-white);
}

.agntix-dark .ar-about-us-4-title-box p {
  color: rgba(249, 244, 232, 0.6);
}

.agntix-dark .ar-about-us-4-text-title {
  color: var(--tp-common-white);
}



















.agntix-dark .service-4-price {
  background: #282a2e !important;
}

.agntix-dark .service-4-price .crp-price-item {
  background: transparent;
}

.agntix-dark .tp-section-subtitle {
  color: var(--tp-common-white);
}










.agntix-dark .tp-faq-text p {
  color: rgba(255, 255, 255, 0.9);
}

.agntix-dark .tp-team-hero-subtitle span {
  color: var(--tp-common-white);
}

.agntix-dark .tp-team-hero-text p {
  color: rgba(249, 244, 232, 0.9);
}




.agntix-dark .tp-team-part-shape img {
  filter: invert(1);
}

.agntix-dark .ar-hero-title-box p {
  color: rgba(255, 255, 255, 0.7);
}






.agntix-dark .tp-error-title {
  color: var(--tp-common-white);
}

.agntix-dark .tp-error-wrapper img {
  filter: invert(1);
}

.agntix-dark .tp-error-title-sm {
  color: var(--tp-common-white);
}

.agntix-dark .tp-error-content .tp-btn {
  background-color: var(--tp-common-white);
  color: var(--tp-common-black);
}

.agntix-dark .tp-error-content .tp-btn:hover {
  color: var(--tp-common-white);
  border-color: var(--tp-common-white);
  background-color: transparent;
}

.agntix-dark .tp-contact-form-input input,
.agntix-dark .tp-contact-form-input textarea {
  background: #1D1D1F;
  border-color: #1D1D1F;
  color: var(--tp-common-white);
}

.agntix-dark .tp-contact-form-input input:focus,
.agntix-dark .tp-contact-form-input textarea:focus {
  background: transparent;
  border-color: var(--tp-common-secondary);
}

.agntix-dark .tp-contact-form-input label {
  color: var(--tp-common-white);
}

.agntix-dark .tp-shop-section-subtitle {
  color: rgba(255, 255, 255, 0.6);
}

.agntix-dark .tp-shop-section-title {
  color: var(--tp-common-white);
}

.agntix-dark .tp-product-cats a {
  color: var(--tp-common-white);
  border-color: #59493D;
}



.agntix-dark .basic-pagination.product-pagination ul li>a {
  color: var(--tp-common-white);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.agntix-dark .basic-pagination.product-pagination ul li .current {
  background-color: var(--tp-common-white);
  color: var(--tp-common-black);
}

.agntix-dark .basic-pagination.product-pagination ul li:hover a {
  background-color: var(--tp-common-white);
  color: var(--tp-common-black);
}










.agntix-light .des-text-item.sm span {
  color: rgba(0, 0, 0, 0.1);
}

.agntix-light .des-text-moving-area {
  padding-bottom: 60px;
}

.agntix-light .des-about-area {
  padding-top: 160px;
}

.agntix-light .tp_text_invert_3>div {
  background-image: linear-gradient(to right, #000 50%, #e4e4e4 50%);
}

.agntix-light .des-text-title {
  color: var(--tp-common-black);
  background-color: var(--tp-common-white);
}

.agntix-light .des-text-title-wrap::after {
  background-color: rgba(0, 0, 0, 0.06);
}

.agntix-light .des-text-title-box p {
  color: var(--tp-common-black);
}

.agntix-light .des-text-moving-top.active .des-text-item.sm span {
  color: var(--tp-common-black);
}

.agntix-light .tp-section-subtitle {
  color: var(--tp-common-black);
}

.agntix-light .tp-section-title-mango {
  color: var(--tp-common-black);
}



.agntix-light .des-brand-item.black-style .des-brand-item-inner {
  background-color: rgb(246, 246, 249);
}

.agntix-light .des-brand-item.black-style .des-brand-item-inner img {
  filter: invert(0);
}

.agntix-light .tp-header-4-style .tp-header-menu nav ul li a {
  color: var(--tp-common-black);
}

.agntix-light .tp-header-4-style .tp-header-dropdown nav ul li.has-dropdown::after {
  color: var(--tp-common-black);
}

.agntix-light .creative-hero-black-box {
  background-color: var(--tp-common-black);
}

.agntix-light .creative-hero-title em {
  background-color: var(--tp-common-white);
}

.agntix-light .creative-hero-title {
  color: var(--tp-common-black);
}

.agntix-light .creative-hero-title i {
  background-color: var(--tp-common-white);
}

.agntix-light .creative-hero-btn {
  background-color: var(--tp-common-white);
}

.agntix-light .creative-hero-black-box::before {
  box-shadow: 0px -18px 0 0 #fff;
}

.agntix-light .creative-hero-title em::before {
  box-shadow: 0px -18px 0 0 #fff;
}

.agntix-light .creative-hero-title i::before {
  box-shadow: 0px 18px 0 0 #fff;
}

.agntix-light .creative-hero-btn::before {
  box-shadow: 0px -18px 0 0 #fff;
}

.agntix-light .creative-hero-title img {
  filter: invert(1);
}

.agntix-light .creative-hero-banner::after {
  box-shadow: 0px -18px 0 0 #fbfbfb;
}

.agntix-light .tp-header-border {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.agntix-light .creative-hero-avater-box {
  background-color: var(--tp-common-white);
}

.agntix-light .creative-hero-avater-info h4 {
  color: var(--tp-common-black);
}

.agntix-light .creative-hero-avater-info span {
  color: var(--tp-text-body);
}

.agntix-light .tp-section-subtitle.fs-17.pre-circle::before {
  background-color: var(--tp-common-black);
}

.agntix-light .creative-about-text p {
  color: var(--tp-common-black);
}

.agntix-light .creative-brand-item img {
  filter: invert(1);
}

.agntix-light .tp-section-title.fs-64 {
  color: var(--tp-common-black);
}


.agntix-light .tp-section-title.fs-44 {
  color: var(--tp-common-black);
}







.agntix-light .creative-work-square-box {
  background-color: var(--tp-common-white);
}

.agntix-light .creative-work-square-box::after,
.agntix-light .creative-work-square-box::before {
  box-shadow: 0px -18px 0 0 #fff;
}

.agntix-light .creative-work-item {
  background-color: var(--tp-common-white);
}

.agntix-light .creative-work-icon img {
  filter: invert(1);
}





.agntix-light .tp_text_invert_2>div {
  background-size: 200% 100%;
  background-position: 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  background-image: linear-gradient(to right, #111013 50%, #e4e4e4 50%);
}











.agntix-light .tp-btn-sky-border.solid-bg {
  color: var(--tp-common-white);
  background-color: #0e0f11;
}

.agntix-light .tp-btn-sky-border.solid-bg:hover {
  color: var(--tp-common-black-7);
  background-color: transparent;
}

.agntix-light .creative-text-item span {
  color: var(--tp-common-black-7);
}

.agntix-light .creative-text-item span::after {
  background-color: var(--tp-common-black-7);
}
















.agntix-light .tp-section-subtitle-clash {
  color: var(--tp-common-black-7);
}





.agntix-light .tp-section-title.fs-54 {
  color: var(--tp-common-black);
}









.agntix-light .ai-faq-video a {
  background: rgba(0, 0, 0, 0.06);
  border: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
}




.agntix-light .tp-section-subtitle-teko {
  color: #2A4C3A;
}

.agntix-light .tp-section-subtitle-teko i {
  color: #2A4C3A;
}

.agntix-light .tp-section-title-teko {
  color: #2A4C3A;
}

.agntix-light .tp-section-title-teko span {
  color: #2A4C3A;
}





.agntix-light .tp-btn-yellow-border {
  color: #2A4C3A;
  border: 1px solid #2A4C3A;
}



.agntix-light .crp-process-title-sm {
  color: #2A4C3A;
}

.agntix-light .crp-process-content p {
  color: rgba(0, 0, 0, 0.7);
}

.agntix-light .crp-blog-title {
  color: var(--tp-common-black);
}

.agntix-light .crp-blog-meta {
  color: rgba(0, 0, 0, 0.7);
}

.agntix-light .crp-blog-title-sm {
  /* color: #2A4C3A; */
  /* color: var(--tp-common-primary); */
  color: var(--tp-common-black);
}

.agntix-light .crp-blog-category span {

  border: 1px solid rgba(0, 0, 0, 0.1);

  color: var(--tp-dark-blue);
}

.agntix-light .crp-price-title-box .tp-section-subtitle-teko {
  color: var(--tp-common-white);
}

.agntix-light .crp-price-title-box .tp-section-title-teko {
  color: var(--tp-common-cream-3);
}

.agntix-light .crp-price-title-box .tp-section-title-teko span {
  color: var(--tp-common-yellow-green);
}

.agntix-light .crp-price-btn-box .tp-btn-yellow-border {
  color: var(--tp-common-yellow-green);
  border: 1px solid var(--tp-common-yellow-green);
}




.agntix-light .tp-price-light-anim .animated-border-box::before {
  background-image: conic-gradient(rgb(255, 255, 255), #000, rgb(255, 255, 255) 25%);
}





.agntix-light .cr-multi-border {
  border-color: rgba(0, 0, 0, 0.06);
}

.agntix-light .cr-multi-border::after,
.agntix-light .cr-multi-border::before {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000 100%);
}

.agntix-light .ca-brand-sub img {
  filter: invert(1);
}

.agntix-light .tp-btn-white-border.tp-btn-light-bg {
  color: #0E0F11;
  background-color: var(--tp-common-white);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.agntix-light .tp-btn-white-border.tp-btn-light-bg:hover {
  color: var(--tp-common-white);
  border-color: var(--tp-common-white);
  background-color: transparent;
}

.agntix-light .cr-brand-heading p {
  color: rgba(0, 0, 0, 0.5);
}



.agntix-light .cr-brand-bottom img {
  filter: invert(1);
}

.agntix-light .tp-section-subtitle-gradient.ct {
  border-color: rgba(0, 0, 0, 0.1);
}

.agntix-light .tp-section-title-onest {
  color: var(--tp-common-black);
}

.agntix-light .cr-feature-heading p {
  color: rgba(0, 0, 0, 0.5);
}

.agntix-light .cr-feature-heading {
  border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}

.agntix-light .cr-multi-border-bottom {
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.agntix-light .cr-feature-2-bg {
  filter: invert(1);
}

.agntix-light .cr-feature-2-heading p {
  color: rgba(0, 0, 0, 0.5);
}

.agntix-light .cr-feature-2-btn .tp-btn-white-border {
  color: var(--tp-common-white);
  border: 1px solid rgba(0, 0, 0, 0.1);
  background-color: var(--tp-common-black);
}

.agntix-light .cr-feature-2-btn .tp-btn-white-border:hover {
  color: var(--tp-common-black);
  background-color: transparent;
  border-color: var(--tp-common-black);
}

.agntix-light .cr-feature-2-item {
  border-color: #ebebeb;
}

.agntix-light .cr-feature-2-item span {
  background-color: #ebebeb;
}

.agntix-light .cr-feature-2-ptb {
  border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}

.agntix-light .cr-feature-3-border-box {
  border-color: rgba(0, 0, 0, 0.07);
}

.agntix-light .cr-feature-3-border-box::after,
.agntix-light .cr-feature-3-border-box::before {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000 100%);
}

.agntix-light .cr-feature-3-border {
  border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}

.agntix-light .cr-service-item {
  border-left: 1px dashed rgba(0, 0, 0, 0.08);
}

.agntix-light .cr-service-item-icon span {
  border: 1px solid rgba(0, 0, 0, 0.1);
}

.agntix-light .cr-service-item-icon span svg {
  filter: invert(1);
}

.agntix-light .cr-service-item-title {
  color: var(--tp-common-black);
}

.agntix-light .cr-feature-3-heading .tp-section-title-onest {
  color: var(--tp-common-white);
}

.agntix-light .cr-service-item-content p {
  color: rgba(0, 0, 0, 0.5);
}

.agntix-light .cr-hero-heading .tp-section-title-onest {
  color: var(--tp-common-white);
}

.agntix-light .cr-service-ptb {
  border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}



.agntix-light .cr-blog-item {
  border: 1px solid rgba(0, 0, 0, 0.08);
}

.agntix-light .cr-blog-item-category {
  color: var(--tp-common-black);
}

.agntix-light .cr-blog-item-title {
  color: var(--tp-common-black);
}

.agntix-light .cr-blog-item-meta {
  color: rgba(0, 0, 0, 0.5);
}

.agntix-light .cr-blog-bottom-text {
  color: var(--tp-common-black);
}

.agntix-light .cr-blog-bottom-border {
  border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}

.agntix-light .cr-cta-text {
  color: rgba(0, 0, 0, 0.5);
}

.agntix-light .cr-cta-bg {
  filter: invert(1);
}

.agntix-light .cr-footer-border-wrap {
  border-color: rgba(0, 0, 0, 0.06);
}

.agntix-light .cr-cta-btn .tp-btn-white-border {
  color: var(--tp-common-white);
  border: 1px solid rgba(0, 0, 0, 0.1);
  background-color: var(--tp-common-black);
}

.agntix-light .cr-cta-btn .tp-btn-white-border:hover {
  background-color: transparent;
  color: var(--tp-common-black);
  border-color: var(--tp-common-black);
}





.agntix-light .tp-about-5-subtitle {
  color: var(--tp-common-black-8);
}

.agntix-light .tp-section-title-5.fs-140 {
  color: var(--tp-common-black-8);
}

.agntix-light .tp-about-5-title-box p {
  color: var(--tp-common-black-8);
}









.agntix-light .pp-service-heading span {
  color: var(--tp-common-black);
}

.agntix-light .pp-service-item {
  border-color: rgba(0, 0, 0, 0.1);
}

.agntix-light .pp-service-item-title {
  color: var(--tp-common-black);
}

.agntix-light .pp-banner-wrap img {
  opacity: 1;
}

















.agntix-light .crp-hero-subtitle .tp-section-subtitle-teko {
  color: var(--tp-common-cream-3);
}

.agntix-light .tp-work-item.about-us-3-bg {
  border: 4px solid #fff;
  background-color: #edf2ef;
}

.agntix-light .crp-price-shape-2 {
  filter: invert(1);
  opacity: 0.1;
}










.agntix-light .basic-pagination ul li .current {
  border-color: #FF5722;
  background-color: #FF5722;
  color: var(--tp-common-white);
}

.agntix-light .basic-pagination ul li:hover a {
  border-color: #FF5722;
  background-color: #FF5722;
  color: var(--tp-common-white);
}




.agntix-light .rc-post-wrap .rc-post:not(:last-child) {
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.agntix-light .tp-btn-yellow-green.sidebar-btn {
  color: var(--tp-common-white);
  background-color: var(--tp-common-secondary);
}













.agntix-light .crp-inner-style .pp-about-heading .tp-section-title-teko {
  color: #2A4C3A;
}



@keyframes animate-pulse-2 {
  0% {
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.1), 0 0 0 0 rgba(0, 0, 0, 0.1);
  }

  40% {
    box-shadow: 0 0 0 50px rgba(0, 0, 74, 0), 0 0 0 0 rgba(0, 0, 0, 0.1);
  }

  80% {
    box-shadow: 0 0 0 50px rgba(0, 0, 74, 0), 0 0 0 30px rgba(0, 0, 74, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(0, 0, 74, 0), 0 0 0 30px rgba(0, 0, 74, 0);
  }
}

.agntix-light .tp-career-shape-1 {
  filter: invert(1);
}

.agntix-light .tp-slider-elegant-title {
  color: var(--tp-common-black);
}

.agntix-light .tp-footer-widget-menu ul li a {
  color: var(--tp-common-black);
  background-color: var(--tp-common-white);
}

.agntix-light .tp-header-14-info a {
  color: var(--tp-common-black);
}



.agntix-light .tp-footer-style-6 .tp-footer-widget-title {
  color: var(--tp-common-white);
}

.agntix-light .tp-footer-style-6 .tp-footer-widget-title-sm {
  color: var(--tp-common-white);
}

.agntix-light .tp-footer-style-6 .tp-footer-widget-info a {
  color: var(--tp-common-white);
}

.agntix-light .tp-footer-style-6 .tp-footer-widget-info a:hover {
  color: var(--tp-common-red-2);
}

.agntix-light .tp-copyright-style-6 .tp-copyright-left span {
  color: var(--tp-common-white);
}

.agntix-light .tp-copyright-style-6 .tp-copyright-right a {
  color: var(--tp-common-white);
}

.agntix-light .tp-btn-white-border {
  color: var(--tp-common-white);
  background-color: var(--tp-common-black);
  border: 1px solid rgba(0, 0, 0, 0.1);
}

.agntix-light .tp-btn-white-border:hover {
  color: var(--tp-common-black);
  background-color: transparent;
  border-color: var(--tp-common-black);
}

.agntix-light .tp-btn-white-border.tp-btn-transparent {
  color: var(--tp-common-black);
  background-color: transparent;
  border-color: rgba(0, 0, 0, 0.2);
}

.agntix-light .tp-btn-white-border.tp-btn-transparent:hover {
  color: var(--tp-common-white);
  background-color: var(--tp-common-black);
}

.agntix-light .tp-portfolio-slicer-title-sm {
  color: var(--tp-common-black);
}



.agntix-light .tp-perspective-social-info span {
  color: var(--tp-common-black);
}

.agntix-light .tp-perspective-scroll a {
  color: var(--tp-common-black);
}


.agntix-light .tp-header-14-bar-wrap .tp-header-8-bar {
  background-color: transparent;
  border: 1px solid rgba(0, 0, 0, 0.2);
}

.agntix-light .tp-header-14-bar-wrap .tp-header-8-bar span {
  color: var(--tp-common-black);
}

.agntix-light .tp-header-14-bar-wrap .tp-header-8-bar:hover {
  border-color: var(--tp-common-black);
  background-color: var(--tp-common-black);
}

.agntix-light .tp-header-14-bar-wrap .tp-header-8-bar:hover span {
  color: var(--tp-common-white);
}



.agntix-light .tp-section-title-teko.fs-80 span {
  color: rgba(0, 0, 0, 0.3);
}

.agntix-light .tp-section-title-teko.fs-80 {
  color: var(--tp-common-black);
}












.agntix-light .ar-about-us-4-text-title {
  color: rgba(0, 0, 0, 0.1);
}














.agntix-light .basic-pagination ul li>a {
  border: 1px solid rgba(0, 0, 0, 0.08);
  color: var(--tp-common-black);
}










.agntix-light .tp-blog-title {
  color: var(--tp-common-black);
}

.agntix-light .tp-blog-heading-wrap .tp-section-subtitle.pre::before {
  background: #ff5722;
}

.agntix-light .tp-blog-title a {
  background-color: #F6F6F9;
}

.agntix-light .tp-blog-list-item-title {
  color: var(--tp-common-black);
}

.agntix-light .tp-blog-list-item-tags p {
  color: rgba(0, 0, 0, 0.4);
}

.agntix-light .tp-blog-list-item-tags-name {
  color: var(--tp-common-black);
}

.agntix-light .tp-blog-list-item-meta {
  color: #141414;
  border: 1px solid rgba(0, 0, 0, 0.1);
}

.agntix-light .tp-blog-list-item {
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.agntix-light .tp-blog-list-item-wrap .tp-blog-list-item:last-child {
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.agntix-light .tp-blog-masonry-item {
  border: 1px solid rgb(146 146 146 / 30%);
  height: 100%;
}

.agntix-light .tp-blog-masonry-item-user-content span {
  color: rgba(0, 0, 0, 0.9);
}

.agntix-light .tp-blog-masonry-item-user-content p {
  color: rgba(0, 0, 0, 0.6);
}

.agntix-light .tp-blog-masonry-item-time span {
  color: rgba(0, 0, 0, 0.6);
}

.agntix-light .tp-blog-masonry-tag span {
  color: rgba(0, 0, 0, 0.6);
}

.agntix-light .tp-blog-masonry-title {
  color: var(--tp-common-black);
}

.agntix-light .tp-blog-masonry-btn a {
  color: #2a6d64;
}

.agntix-light .tp-blog-masonry-item-2 {
  background: #F6F6F9;
}

.agntix-light .tp-blog-masonry-item-3 {
  background: #F6F6F9;
}

.agntix-light .tp-blog-masonry-item-icon span {
  background: #e3e3e5;
}

.agntix-light .tp-blog-masonry-item-text span {
  color: var(--tp-common-black);
}

.agntix-light .tp-blog-masonry-item-text p {
  color: var(--tp-common-black);
}









.agntix-light .tp-contact-category-btn {
  border: 1px solid rgba(0, 0, 0, 0.08);
  color: var(--tp-common-black);
}



.agntix-light .tp-career-title {
  color: var(--tp-common-black);
}


.agntix-light .cn-contactform-support-text span {
  color: var(--tp-common-black);
}



.agntix-light .tp-portfolio-inner-tab-wrap nav .nav-tabs .nav-link {
  color: var(--tp-common-black);
  border: 1px solid rgba(0, 0, 0, 0.1);
}


















.agntix-light .tp-pd-2-title {
  color: var(--tp-common-black);
}

.agntix-light .tp-pd-2-bottom-item span {
  color: rgba(0, 0, 0, 0.7);
}

.agntix-light .tp-pd-2-bottom-item h6 {
  color: var(--tp-common-black);
}



.agntix-light .tp-pd-2-dot .swiper-pagination-bullet {
  background: rgba(0, 0, 0, 0.3);
}

.agntix-light .tp-pd-2-dot .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: var(--tp-common-black);
}

.agntix-light .tp-pd-2-step-title {
  color: var(--tp-common-black);
}

.agntix-light .tp-pd-2-step-item-title {
  color: var(--tp-common-black);
}

.agntix-light .tp-pd-2-step-item span {
  color: rgba(0, 0, 0, 0.6);
}

.agntix-light .tp-pd-2-np-content a {
  color: var(--tp-common-black);
  border: 1px solid rgba(0, 0, 0, 0.1);
}

.agntix-light .tp-pd-2-np-content a:hover {
  color: var(--tp-common-white);
  background-color: var(--tp-common-black);
}

.agntix-light .tp-pd-4-title {
  color: var(--tp-common-black);
}

.agntix-light .tp-pd-4-bottom-btn .tp-portfolio-details-btn {
  color: var(--tp-common-black);
  border-color: var(--tp-common-black);
}

.agntix-light .tp-pd-4-bottom-btn .tp-portfolio-details-btn:hover {
  color: var(--tp-common-white);
  background-color: var(--tp-common-black);
  border: 1px solid var(--tp-common-black);
}

.agntix-light .tp-pd-4-about-sub {
  color: var(--tp-common-black);
}

.agntix-light .tp-pd-1-about-text.color-cng {
  color: var(--tp-common-black);
}




.agntix-light .project-details-1-navigation a:hover i {
  color: var(--tp-common-white);
  background: var(--tp-common-black);
  border-color: var(--tp-common-black);
}

.agntix-light .tp-header-light .tp-header-14-info a {
  color: var(--tp-common-white);
}

.agntix-light .tp-header-light .tp-header-14-bar-wrap .tp-header-8-bar {
  background-color: transparent;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.agntix-light .tp-header-light .tp-header-14-bar-wrap .tp-header-8-bar span {
  color: var(--tp-common-white);
}

.agntix-light .tp-header-light .tp-header-14-bar-wrap .tp-header-8-bar:hover {
  border-color: var(--tp-common-white);
  background-color: var(--tp-common-white);
}

.agntix-light .tp-header-light .tp-header-14-bar-wrap .tp-header-8-bar:hover span {
  color: var(--tp-common-black);
}




.object-fit-cover {
  object-fit: cover !important;
}


.industry-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 30px;
  margin-bottom: 40px;
  box-shadow: 0px 10px 40px rgba(9, 126, 254, 0.05);

  border: 1px solid rgba(220, 230, 245, 0.5);
  transition: all 0.3s ease;
}

.industry-card:hover {
  transform: translateY(-5px);
  box-shadow: 0px 15px 50px rgba(9, 126, 254, 0.1);
}

.industry-content {
  padding: 20px 30px 20px 10px;
}


.industry-badge-wrap {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

.industry-number {
  font-size: 30px;
  font-weight: 700;
  color: #e0e7f3;
  /* Very light grey/blue */
  margin-right: 15px;
  line-height: 1;
}

.industry-badge {
  padding: 6px 16px;
  border-radius: 50px;
  font-size: 13px;
  font-weight: 600;

  letter-spacing: 0.5px;
}


@media (min-width: 280px) and (max-width: 576px) {

  .industry-badge {
    padding: 6px 12px;
    border-radius: 50px;
    font-size: 10px;

  }

}


.blue-badge {
  background-color: rgba(9, 126, 254, 0.1);
  color: #097EFE;
}



/* Titles & Text */
.industry-title a {
  font-size: 32px;
  font-weight: 700;
  color: #0a2540;
  text-decoration: none;
  transition: color 0.3s;
}

.industry-title a:hover {
  color: #097EFE;
}

.industry-desc {
  font-size: 18px;
  line-height: 1.7;
  color: #556070;
  margin-top: 15px;
  margin-bottom: 25px;
}

.industry-link {
  font-weight: 600;
  color: #097EFE;
  text-decoration: none;
  font-size: 15px;
}

.industry-link i {
  margin-left: 5px;
  transition: margin-left 0.3s;
}

.industry-link:hover i {
  margin-left: 10px;
}

/* Image Styling */
.industry-thumb {
  border-radius: 15px;
  overflow: hidden;
  height: 320px;
  /* Fixed height for consistency */
  width: 100%;
}

.industry-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Ensures image fills the box without stretching */
  transition: transform 0.5s ease;
}

.industry-card:hover .industry-thumb img {
  transform: scale(1.05);
  /* Slight zoom on hover */
}

/* Mobile Responsiveness */
@media (max-width: 991px) {
  .industry-card {
    padding: 20px;
  }

  .industry-thumb {
    height: 250px;
    margin-bottom: 20px;
  }

  .industry-content {
    padding: 0;
  }

  .industry-title a {
    font-size: 24px;
  }
}







/* Sticky Left Content */
.sticky-content {
  position: sticky;
  top: 120px;
  /* Adjust based on your header height */
  padding-right: 30px;
}




/* Icon */
.card-icon {
  margin-bottom: 25px;
}

.card-icon img {
  width: 50px;
  height: 50px;
}

/* Typography */
.card-title {
  font-size: 24px;
  font-weight: 700;
  color: #0a2540;
  margin-bottom: 15px;
}

.card-desc {
  font-size: 16px;
  line-height: 1.6;
  color: #556070;
  margin-bottom: 30px;
  flex-grow: 1;
}

/* Read More Link */
.card-link {
  font-size: 14px;
  font-weight: 700;

  color: #0a2540;
  text-decoration: none;
  letter-spacing: 0.5px;
  display: flex;
  align-items: center;
  gap: 10px;
  transition: color 0.3s;
}

.card-link i {
  transform: rotate(-45deg);
  /* Angled arrow like reference */
  transition: transform 0.3s;
}



/* Mobile Responsiveness */
@media (max-width: 991px) {


  .sticky-content {
    position: relative;
    top: 0;
    margin-bottom: 40px;
  }
}











.cat-green {
  background-color: rgba(78, 175, 197, 0.1);
  color: #4eafc5;
}



/* Arrow Button (Orange/Brand Color style from reference) */
.arrow-btn {
  display: inline-flex;
  color: #ff5722;
  /* Orange color from your reference image, or use #097EFE for Blue */
  transition: transform 0.3s;
}

/* Agar aapko Blue arrow chahiye to ye line uncomment karein: */
/* .arrow-btn { color: #097EFE; } */

.arrow-btn svg {
  width: 32px;
  height: 32px;
}




.service-card {
  border-radius: 30px;
  padding: 30px;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease;
  border: none;
}

.service-card:hover {
  transform: translateY(-5px);
}

.icon-box {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(0, 0, 0, 0.1);
  background-color: rgba(255, 255, 255, 0.3);
}

.img-container img {
  border-radius: 20px;
  object-fit: cover;
  height: 200px;
  width: 100%;
}

.card-cyan {
  background-color: #f0fdfa;
}

.card-lime {
  background-color: #faffe3;
}

.card-pink {
  background-color: #fff8fe;
}

.card-purple {
  background-color: #f7f4ff;
}

.card-orange {
  background-color: #fffcf9;
}

.bg-blue {
  background-color: #001e41 !important;
}

.branding-section {
  position: relative;
  overflow: hidden;
}

.section-number {
  font-size: 0.9rem;
  color: #999;
  font-weight: 500;
}

.section-title {
  color: #1a1a1a;
  font-weight: 400;
}

.section-desc {
  font-size: 1rem;
  line-height: 1.6;
  max-width: 300px;
}

.timeline-dot {
  position: absolute;
  left: -40px;
  top: 50%;
  width: 8px;
  height: 8px;
  background-color: #000;
  border-radius: 50%;
}

.image-wrapper {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 350px;
  filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.1));
}

.custom-shape-img {
  width: 100%;
  height: 400px;
  object-fit: cover;
  clip-path: polygon(5% 0%, 95% 0%, 85% 100%, 15% 100%);
  background-color: #6db3df;
  border-radius: 20px;
}

.services-list li {
  font-size: 1.1rem;
  color: #333;
  margin-bottom: 20px;
  cursor: pointer;
  transition: color 0.3s ease;
}

.services-list li:hover {
  color: #000;
  font-weight: 500;
}

@media (max-width: 991px) {
  .timeline-dot {
    display: none;
  }

  .services-list {
    margin-top: 20px;
    text-align: center;
    padding-left: 0 !important;
  }

  .section-desc {
    max-width: 100%;
  }
}

/* External Code there */



.dark-blue {
  /* background-color: var(--tp-dark-blue) !important; */

  /* background: linear-gradient(to right, #003064, #003e83, #4eafc5) !important; */

  /* background: linear-gradient(to right, #2a6d65, #2a6d65, #2a6d65) !important; */

  /* background: linear-gradient(to right, #2a6d65, #2a6d65, #8ff1d4) !important; */

  background: #f7f7f7;
}


.gradient-light {

  background: linear-gradient(to right, #d2e7ff, #f0f7ff, #bff3ff) !important;

}



.cta {
  position: relative;
  border-radius: 30px;
  overflow: hidden;
  background-image: url("../images/cta-bg.avif");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.cta::before {
  content: "";
  position: absolute;
  inset: 0;
  /* background: rgba(0, 0, 0, 0.55); */
  z-index: 0;

  background: linear-gradient(to right, #d2e7ff, #f0f7ff, #bff3ff) !important;
}

.cta .app-cta-wrap {
  background: transparent;
}

.cta .app-cta-wrapper,
.cta .app-cta-heading {
  position: relative;
  z-index: 1;
}

.cta .tp-section-title-phudu {
  color: #fff;
}

.cta .cta-text {
  color: rgba(255, 255, 255, 0.88);
  font-size: 18px;
}

.cta .cta-btn {
  position: relative;
  z-index: 1;
}

.cta .cta-btn-filter {
  filter: url(#ctaButtonFilter);
}







/* Link */
.details-link {
  color: #fff;
  /* Teal color */
  font-weight: 700;

  font-size: 14px;
  text-decoration: none;
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.4s ease 0.2s;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

/* --- STATES: Hover & Active & Mobile --- */



.why-choose-us {
  background: url('../images/why-choose-us-bg.svg') no-repeat;
  background-position: center center;
  background-size: auto;
  padding: 100px 0;
}

.why-choose-item {
  display: flex;
  border-bottom: 1px solid var(--divider-color);
  padding-bottom: 45px;
  margin-bottom: 45px;
}

.why-choose-item:last-child {
  border: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.why-choose-item .icon-box {
  position: relative;
  padding: 5px 0px 0px 5px;
  margin-right: 20px;
}

.why-choose-item .icon-box::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--accent-color);
  opacity: 10%;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  z-index: 0;
  transition: all 0.5s ease-in-out;
}

.why-choose-item .icon-box img {
  position: relative;
  max-width: 32px;
  z-index: 1;
}

.why-choose-content {
  width: calc(100% - 52px);
  padding-left: 12px;

}

.why-choose-content h3 {
  font-size: 20px;
  font-weight: 600;

  margin-bottom: 10px;
}

.why-choose-content p {
  margin: 0;
  font-size: 14px !important;
}

.why-choose-image {
  position: relative;
  text-align: center;
}

.why-choose-image::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: url('../images/why-choose-car-img.png') no-repeat;
  background-position: bottom center;
  background-size: 100% auto;
  z-index: 1;
}

.why-choose-image img {
  aspect-ratio: 1 / 1.65;
  object-fit: cover;
  border-radius: 200px;
  padding: 50px;
}

.tp-about-us-area.pt-180 {

  /* background: linear-gradient(16deg, rgb(0 0 0) 0%, rgb(0 69 148) 100%); */
}


/* Ceo */


/* --- Premium Service Box Styling --- */

.feature-card-premium {
  background-color: #ffffff;
  border: 1px solid #eef0f4;
  border-radius: 12px;
  padding: 35px 30px;
  height: 100%;
  transition: all 0.3s ease-in-out;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.03);
  position: relative;
  overflow: hidden;
}

.feature-card-premium:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08);
  border-color: transparent;
}

/* Soft accent glow */
.feature-card-premium::before {
  content: "";
  position: absolute;
  inset: -2px;
  background: radial-gradient(60% 60% at 15% 15%, rgb(185 211 249 / 18%) 0%, rgb(48 132 255 / 0%) 60%), radial-gradient(55% 55% at 85% 25%, rgb(171 226 255 / 14%) 0%, rgba(12, 170, 255, 0) 58%);
  pointer-events: none;
  opacity: 0.75;
}

/* Keep content above the glow */
.feature-card-premium .app-feature-item-icon,
.feature-card-premium .app-feature-item-content {
  position: relative;
  z-index: 1;
}

/* Icon Styling */
.feature-card-premium .icon-large span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 14px;
  /* background: var(--tp-common-yellow); */
  border: 1px solid rgba(13, 110, 253, 0.16);

}

.feature-card-premium .icon-large i {
  font-size: 34px;
  color: var(--tp-common-black) !important;
}

/* Title Styling */
.feature-card-premium .title-large {
  margin-bottom: 18px;
  text-transform: none;
  letter-spacing: 0;
}

/* Badge / pill heading */
.service-title-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgb(212 219 231 / 16%), rgba(13, 110, 253, 0.06));
  border: 1px solid rgba(13, 110, 253, 0.18);
  color: #0b5ed7;
  font-size: 15px;
  font-weight: 500;
  line-height: 1;
}

/* Content List Styling */
.feature-details-list .detail-block {
  margin-bottom: 20px;
  /* padding-left: 14px; */
  /* border-left: 1px solid rgb(0 0 0 / 19%); */
}

.feature-details-list .detail-block:last-child {
  margin-bottom: 0;
}

/* Label (e.g., Medical Coding) */
.feature-details-list .detail-label {
  display: block;
  font-size: 14px;

  letter-spacing: 1px;
  font-weight: 700;
  color: var(--tp-common-black);
  /* Brand color */
  margin-bottom: 8px;
}

/* Description Text */
.feature-details-list .detail-text {
  font-size: 16px;
  line-height: 1.65;
  color: #444444;
  /* Darker grey for better contrast */
  margin: 0;
  font-weight: 500;
}

/* Fallback styling for simple paragraph-based cards (no feature-details-list) */
.feature-card-premium .app-feature-item-content>p {
  padding-left: 14px;
  border-left: 3px solid rgba(13, 110, 253, 0.22);
  font-size: 16px;
  line-height: 1.65;
  color: #444444;
  margin-bottom: 18px;
}

.feature-card-premium .app-feature-item-content>p:last-child {
  margin-bottom: 0;
}

.feature-card-premium .app-feature-item-content>p strong {
  display: block;
  font-size: 14px;

  letter-spacing: 1px;
  font-weight: 700;
  color: #0d6efd;
  margin-bottom: 6px;
}

/* Services page layout enhancements */
.service-section {
  /* margin-bottom: 70px; */

}

.service-section .crp-blog-item {
  /* margin-bottom: 45px; */
}

.service-section+.service-section {
  padding-top: 70px;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.service-details-header {
  display: flex;
  align-items: center;
  margin-bottom: 28px;
}

.service-details-label {
  display: inline-flex;
  align-items: center;
  padding: 7px 18px;
  border-radius: 999px;
  font-size: 11px;
  letter-spacing: 0.14em;

  font-weight: 700;
  background: rgba(13, 110, 253, 0.06);
  color: #0b5ed7;
}

.service-details-header::after {
  /* content: ""; */
  flex: 1;
  height: 1px;
  margin-left: 18px;
  background: linear-gradient(to right, rgba(148, 163, 184, 0.7), rgba(148, 163, 184, 0));
}

.service-section-title {
  font-family: var(--tp-ff-inter) !important;
  font-size: 22px !important;
}

.st-about-wrapper {
  padding-left: 80px !important;
}

/* --- Approach Distinction Section Styles --- */

/* Card Styling to match reference image */
.approach-card-2 {
  background-color: #ffffff;
  padding: 20px 30px;
  border-radius: 20px;
  box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.05);
  transition: all 0.3s ease-in-out;
  border: 1px solid rgba(0, 0, 0, 0.03);
}

.approach-card-2:hover {
  transform: translateY(-5px);
  box-shadow: 0px 15px 40px rgba(13, 110, 253, 0.1);
  /* Slight blue shadow on hover */
  border-color: rgba(13, 110, 253, 0.2);
}

/* Icon Styling */
.approach-card-icon {
  margin-bottom: 25px;
}

.approach-card-icon span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  background-color: rgba(13, 110, 253, 0.1);
  /* Light blue bg */
  color: #0d6efd;
  /* Primary blue color */
  border-radius: 50%;
  font-size: 24px;
  transition: all 0.3s ease;
}

.approach-card-2:hover .approach-card-icon span {
  background-color: #0d6efd;
  color: #ffffff;
}

/* Title and Text Styling */
.approach-card-title {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 15px;
  color: #1a1a1a;
}

.approach-card-content p {
  margin-bottom: 0;

  font-size: 14px !important;
  color: var(--tp-text-body);
}


/* Center Image Styling */
.approach-center-img img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

/* --- Calm Pulse Animation for Center Image --- */
.tp-pulse-anim {
  animation: tp-pulse-float 4s ease-in-out infinite;
}

@keyframes tp-pulse-float {
  0% {
    transform: translateY(0px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  }

  50% {
    transform: translateY(-15px);
    /* Moves up slightly */
    box-shadow: 0 20px 40px rgba(13, 110, 253, 0.15);
    /* Shadow grows and gets bluer */
  }

  100% {
    transform: translateY(0px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  }
}

/* ============================================
   COMPLIANCE & SECURITY SECTION STYLING
   ============================================ */

.compliance-security-section {
  position: relative;
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
  overflow: hidden;
}

.compliance-security-bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 20% 30%, rgba(13, 110, 253, 0.03) 0%, transparent 50%),
    radial-gradient(circle at 80% 70%, rgba(23, 181, 249, 0.03) 0%, transparent 50%);
  pointer-events: none;
  z-index: 0;
}

.compliance-security-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(45deg, transparent, transparent 2px, rgba(13, 110, 253, 0.02) 2px, rgba(13, 110, 253, 0.02) 4px);
  opacity: 0.5;
}

.compliance-content-wrapper {
  position: relative;
  z-index: 2;
}

.compliance-section-badge {
  display: inline-flex;
  align-items: center;
  padding: 8px 20px;
  background: linear-gradient(135deg, rgba(13, 110, 253, 0.1), rgba(23, 181, 249, 0.08));
  border: 1px solid rgba(13, 110, 253, 0.2);
  border-radius: 50px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1px;

  color: #0d6efd;
}

.compliance-section-badge i {
  font-size: 14px;
}

.compliance-main-title {
  font-size: 56px;
  font-weight: 700;
  line-height: 1.1;
  color: #1a1a1a;
  margin-bottom: 24px;
}

@media (max-width: 991px) {
  .compliance-main-title {
    font-size: 42px;
  }
}

.compliance-intro-text {
  font-size: 18px;
  line-height: 1.7;
  color: #4a5568;
  margin-bottom: 32px;
}

/* HIPAA & HITECH Badge Cards */
.compliance-badges-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 32px;
}

@media (max-width: 575px) {
  .compliance-badges-row {
    grid-template-columns: 1fr;
  }
}

.compliance-badge-card {
  position: relative;
  background: #ffffff;
  border: 2px solid #e2e8f0;
  border-radius: 16px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
}

.compliance-badge-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  border-color: rgba(13, 110, 253, 0.3);
}

/* .hipaa-badge {
  border-left: 4px solid #0d6efd;
} */

/* .hitech-badge {
  border-left: 4px solid #17b5f9;
} */

.icon-wrap i {
  color: #0d6efd;
}

.badge-icon-wrapper {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: #ffffff;
  margin-bottom: 4px;
}

.hipaa-badge .badge-icon-wrapper {
  background: linear-gradient(135deg, #0d6efd, #0b5ed7);
}

.hitech-badge .badge-icon-wrapper {
  background: linear-gradient(135deg, #17b5f9, #0d8cc0);
}

.badge-content {
  flex: 1;
}

.badge-label {
  display: block;
  font-size: 22px;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 4px;
  letter-spacing: -0.5px;
}

.badge-subtitle {
  display: block;
  font-size: 12px;
  line-height: 1.4;
  color: #64748b;
  font-weight: 500;
}

.badge-status {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: #10b981;
  margin-top: auto;
}

.badge-status i {
  font-size: 14px;
}

/* Compliance Features List */
.compliance-features-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 32px;
}

.compliance-feature-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: rgba(255, 255, 255, 0.8);
  border-radius: 10px;
  border-left: 3px solid #0d6efd;
  font-size: 15px;
  color: #334155;
  transition: all 0.2s ease;
}

.compliance-feature-item:hover {
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  transform: translateX(4px);
}

.compliance-feature-item i {
  font-size: 18px;
  color: #0d6efd;
  min-width: 20px;
}

.compliance-closing-text {
  font-size: 16px;
  line-height: 1.7;
  color: #475569;
  margin-bottom: 32px;
}

.compliance-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 16px 32px;
  background: linear-gradient(135deg, #0d6efd, #0b5ed7);
  color: #ffffff;
  font-size: 16px;
  font-weight: 600;
  border-radius: 50px;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 4px 16px rgba(13, 110, 253, 0.3);
}

.compliance-cta-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(13, 110, 253, 0.4);
  color: #ffffff;
}

.compliance-cta-btn i {
  font-size: 14px;
  transition: transform 0.3s ease;
}

.compliance-cta-btn:hover i {
  transform: translateX(4px);
}

/* Visual Wrapper */
.compliance-visual-wrapper {
  position: relative;
  z-index: 2;
}

.compliance-image-container {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.12);
  margin-bottom: 24px;
}

.compliance-main-image {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 20px;
}

.security-overlay-pattern {
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(13, 110, 253, 0.03) 10px, rgba(13, 110, 253, 0.03) 20px);
  pointer-events: none;
  z-index: 1;
}

.security-badge-floating {
  position: absolute;
  top: 20px;
  right: 20px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.9));
  backdrop-filter: blur(10px);
  border: 2px solid rgba(13, 110, 253, 0.2);
  border-radius: 16px;
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
  z-index: 2;
  animation: securityPulse 2s ease-in-out infinite;
}

@keyframes securityPulse {

  0%,
  100% {
    transform: scale(1);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
  }

  50% {
    transform: scale(1.05);
    box-shadow: 0 12px 32px rgba(13, 110, 253, 0.2);
  }
}

.security-badge-floating i {
  font-size: 32px;
  color: #0d6efd;
  margin-bottom: 4px;
}

.security-badge-floating span {
  font-size: 28px;
  font-weight: 700;
  color: #1a1a1a;
  line-height: 1;
}

.security-badge-floating small {
  font-size: 11px;
  color: #64748b;

  letter-spacing: 1px;
  font-weight: 600;
}

/* Security Stats Grid */
.security-stats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

@media (max-width: 991px) {
  .security-stats-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
  }
}

@media (max-width: 575px) {
  .security-stats-grid {
    grid-template-columns: 1fr;
  }
}

.security-stat-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-align: center;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
}

.security-stat-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  border-color: rgba(13, 110, 253, 0.3);
}

.stat-icon {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(13, 110, 253, 0.1), rgba(13, 110, 253, 0.05));
  color: #0d6efd;
  font-size: 24px;
}

.stat-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.stat-number {
  font-size: 24px;
  font-weight: 700;
  color: #1a1a1a;
  line-height: 1;
}

.stat-label {
  font-size: 11px;
  color: #64748b;
  font-weight: 600;
  line-height: 1.3;

  letter-spacing: 0.5px;
}


/* --- Compliance Section Styling --- */

/* Intro Text */
.compliance-intro-text {
  font-size: 18px;
  line-height: 1.6;
}

/* Feature Boxes */
.compliance-feature-box {
  padding: 25px;
  background-color: #f8f9fa;
  /* Light Gray */
  border-radius: 8px;
  border-left-width: 4px;
  border-left-style: solid;
  transition: transform 0.3s ease;
}

.compliance-feature-box:hover {
  transform: translateY(-5px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}

.box-primary {
  border-left-color: transparent;
}

.box-info {
  border-left-color: transparent;
}

.feature-title {
  display: block;
  font-weight: 700;
  margin-bottom: 10px;
  font-size: 18px;
}

.feature-desc {
  margin-bottom: 0;
  font-size: 14px;
  line-height: 1.5;
  color: #555;
}



/* Image Wrapper */
.compliance-image-wrap {
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}

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

/* Floating Badge */
.compliance-badge {
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #fff;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  margin: 0 0 40px -30px;
  border-left: 5px solid #104a8b;
  z-index: 2;
}

.elementor-icon svg {
  width: 50px;
  height: 50px;
  fill: #01244d;
  color: #01244d;
}

.whatsapp-btn {
  bottom: 0.8rem;
  right: 0.5rem;
  z-index: 1050;
}

.sticky-icon {
  z-index: 1;
  position: fixed;
  top: 70%;
  right: 0%;
  width: 220px;
  display: flex;
  flex-direction: column;
}

.sticky-icon a {
  transform: translate(160px, 0px);
  border-radius: 50px 0px 0px 50px;
  text-align: left;
  margin: 2px;
  text-decoration: none;

  padding: 4px 10px;
  font-size: 15px;
  font-family: 'Oswald', sans-serif;
  transition: all 0.8s;
}

.sticky-icon a:hover {
  color: #FFF;
  transform: translate(0px, 0px);
}

.sticky-icon a:hover i {
  transform: rotate(360deg);
}

/*.search_icon a:hover i  {
	transform:rotate(360deg);}*/
.Facebook {
  background-color: #2C80D3;
  color: #FFF;
}

.Youtube {
  background-color: #fa0910;
  color: #FFF;
}

.Twitter {
  background-color: #53c5ff;
  color: #FFF;
}

.Instagram {
  background-color: #FD1D1D;
  color: #FFF;
}

.Google {
  background-color: #d34836;
  color: #FFF;
}

.sticky-icon a i {
  background-color: #FFF;
  height: 24px;
  width: 24px;
  color: #000;
  text-align: center;
  line-height: 25px;
  border-radius: 50%;
  margin-right: 20px;
  transition: all 0.5s;
  font-size: 16px !important;
}

.sticky-icon a i.fa-facebook-f {
  background-color: #FFF;
  color: #2C80D3;
}

.sticky-icon a i.fa-google-plus-g {
  background-color: #FFF;
  color: #d34836;
}

.sticky-icon a i.fa-instagram {
  background-color: #FFF;
  color: #FD1D1D;
}

.sticky-icon a i.fa-youtube {
  background-color: #FFF;
  color: #fa0910;
}

.sticky-icon a i.fa-twitter {
  background-color: #FFF;
  color: #53c5ff;
}

.fas fa-shopping-cart {
  background-color: #FFF;
}

#myBtn {
  height: 50px;
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  text-align: center;
  padding: 10px;
  text-align: center;
  line-height: 40px;
  border: none;
  outline: none;
  background-color: #1e88e5;
  color: white;
  cursor: pointer;
  border-radius: 50%;
}

.fa-arrow-circle-up {
  font-size: 30px;
}

.WhatsApp {
  background-color: #25D366;
  color: #FFF;
}

#myBtn:hover {
  background-color: #555;
}


/* What we do */
/* Parent Section */
.tp-what-we-do-area {
  background-color: #ffffff;
}

/* Image Wrapper */
.tp-what-we-do-thumb img {
  width: 100%;
  height: auto;
  object-fit: cover;

  /* Subtle medical blue shadow */
  box-shadow: 0 15px 45px rgba(13, 110, 253, 0.1);
}

.list-icon {
  width: 47px;
  height: 47px;
  background: #cef3be;

  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  flex-shrink: 0;
  transition: all 0.3s ease;
  background: var(--tp-common-yellow);
}

.tp-what-we-do-list li:hover .list-icon {
  background: #d4ece9;
  /* Medical Blue on hover */
  color: #ffffff !important;
  /* transform: scale(1.1); */
}

.tp-what-we-do-list li:hover .list-icon i {
  color: #ffffff !important;
}

/* Typography Adjustments */
.tp-what-we-do-list h5 {
  font-size: 18px;
  color: #1a1a1a;
  line-height: 1.4;
  transition: color 0.3s ease;
}

.tp-what-we-do-list li:hover h5 {
  color: var(--tp-common-primary);
}




.how-it-work-inner {
  position: relative;
}

.how-it-work-inner .hills-line {
  position: absolute;
  top: -9px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 70%;
}

.how-it-work-inner.arrow-line .single-work-inner:after {
  content: "";
  position: absolute;
  left: 100%;
  margin-left: -40px;
  top: 35px;
  background-image: none;
  height: 50px;
  width: 100%;
  background-repeat: no-repeat;
}

.how-it-work-inner.arrow-line .col-lg-2:last-child .single-work-inner:after,
.how-it-work-inner.arrow-line .col-lg-3:last-child .single-work-inner:after,
.how-it-work-inner.arrow-line .col-lg-4:last-child .single-work-inner:after,
.how-it-work-inner.arrow-line .col-lg-6:last-child .single-work-inner:after {
  display: none;
}

.about-img-1 img {
  width: 100%;
  object-fit: cover;
  border-radius: 12px;
  height: 400px;
}

.expert-card {
  position: relative;
  padding: 40px 32px 32px;
  border: 1px solid #eee;
  background-color: #ffffff;
  text-align: center;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

@media (max-width: 576px) {
  .expert-card {
    padding: 40px 12px 32px;

  }
}

.expert-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
  border-color: var(--tp-common-primary);
}

.expert-img-wrapper {
  width: 250px;
  height: 250px;
  margin: 0 auto 36px;

  overflow: hidden;
  background: #f8fafc;
  display: flex;
  align-items: center;
  justify-content: center;
}

.expert-img-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform 0.5s ease;
}

.expert-card:hover .expert-img-wrapper img {
  transform: scale(1.05);
}

.expert-body h3 {
  font-size: 24px;
  letter-spacing: -0.5px;
}

.expert-copy {
  font-size: 16px;
  line-height: 1.7;
  text-wrap: balance;
}

.expert-contact-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  margin-top: 20px;
  color: var(--tp-common-primary);
  border: 1px solid rgba(0, 0, 0, 0.05);
  background-color: #ffffff;
  transition: all 0.3s ease;
}

.expert-contact-btn i {
  font-size: 18px;
}

.expert-card:hover .expert-contact-btn {
  background-color: var(--tp-common-primary);
  color: #ffffff;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
}

.text-primary {
  color: #0d6efd !important;
}

.support-tags-wrapper {
  max-width: 1000px;
  margin: 0 auto;
}

.support-tag {
  display: inline-flex;
  align-items: center;
  padding: 12px 28px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 50px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  cursor: default;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
}

.support-tag .icon {
  margin-right: 12px;
  color: #64748b;
  font-size: 16px;
  display: flex;
  align-items: center;
}

.support-tag .text {
  font-size: 16px;
  font-weight: 600;
  color: #1e293b;

}

/* Hover Effect: RED theme jesa ap ne manga tha */
.support-tag:hover {
  transform: translateY(-3px);
  border-color: var(--tp-common-primary);
  background-color: #fffafb;
  box-shadow: 0 10px 20px rgba(220, 53, 69, 0.08);
}

.support-tag:hover .icon {
  color: #dc3545;
}

.support-tag:hover .text {
  color: var(--tp-common-primary);
}

.footer-logo {
  width: 300px;
}








.about-content:hover {
  transform: translateY(-5px);
}







/* General Reset & Typography */

.about-us-details {
  /* background: linear-gradient(135deg, #ffffff 0%, #f3f7ff 100%); */
  position: relative;
  overflow: hidden;
}




.about-content:hover {
  transform: translateY(-5px);
}




/* Cta  Section */


/* --- CTA Section Styles --- */
.cr-cta-section {
  position: relative;
  background-image: url('../images/home-cta-bg.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 12px;
  overflow: hidden;
  text-align: center;
  z-index: 2;


}

/* Background Overlay */
.cr-cta-section .cr-cta-section__overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.55);
  /* Improved contrast */
  z-index: 1;
}

/* Content Container */
.cr-cta-section .cr-cta-section__content {
  position: relative;
  padding: 80px 40px;
  z-index: 2;
}

/* Heading Styling */
.cr-cta-section .cr-cta-section__title {
  color: #ffffff;
  font-size: 40px;
  font-weight: 700;
  margin-bottom: 20px;
  line-height: 1.2;
}

/* Paragraph Styling */
.cr-cta-section .cr-cta-section__description {
  color: rgba(255, 255, 255, 0.9);
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 35px;
}

/* Button Customization */
.cr-cta-section .cr-cta-section__btn {
  display: inline-flex;
  align-items: center;
  background-color: #fff;
  color: #000;
  padding: 14px 30px;
  border-radius: 50px;
  text-decoration: none;
  font-weight: 600;
  transition: all 0.3s ease;
  filter: url(#buttonFilter);
  /* Applying the Gooey Filter */
}

.cr-cta-section .cr-cta-section__btn:hover {
  background-color: #ffffff;
  color: #000000;
  transform: translateY(-3px);
}

.cr-cta-section .cr-cta-section__btn-icon {
  margin-left: 10px;
  display: flex;
  align-items: center;
  transition: transform 0.3s ease;
}

.cr-cta-section .cr-cta-section__btn:hover .cr-cta-section__btn-icon {
  transform: rotate(45deg);
}

/* Mobile Responsive */
@media (max-width: 768px) {
  .cr-cta-section .cr-cta-section__content {
    padding: 50px 20px;
  }

  .cr-cta-section .cr-cta-section__title {
    font-size: 24px;
  }

  .cr-cta-section .cr-cta-section__description {
    font-size: 16px;
  }
}


.footer-first-column {
  padding-left: 100px;
}

@media (max-width: 1400px) {
  .footer-first-column {
    padding-left: 16px !important;
  }

}

.blogs-sticky-sidebar {
  position: sticky;
  top: 100px;
}

.tp-header-menu>nav>ul>li>a.active {
  color: #57b98c !important;
  font-weight: 600;
}

.header-sticky.sticky-white-bg .tp-header-menu>nav>ul>li>a.active {
  color: #57b98c !important;
}

.how-we-work-advanced {
  background: #ffffff;
}

.section-tag {
  color: #dc3545;
  font-weight: 700;

  font-size: 13px;
  letter-spacing: 1.5px;
}

.work-card {
  background: #f8f9fa;
  padding: 50px;
  border-radius: 20px;
  height: 100%;
  transition: all 0.3s ease;
  border: 1px solid transparent;
}

.work-card:hover {
  background: #ffffff;
  border-color: #dc3545;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.card-icon {
  font-size: 40px;
  color: #dc3545;
  margin-bottom: 25px;
}

.work-card h3 {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 15px;
}

.consultant-responsibility-box {
  background: #1a1a1a;
  color: #ffffff;
  padding: 30px 40px;
  border-radius: 15px;
}

.icon-main {
  font-size: 30px;
  color: #dc3545;
}


/* How we work */
.how-we-work-authority {

  border-top: 1px solid #f2f2f2;
}

.eyebrow {
  color: #dc3545;
  font-weight: 700;

  font-size: 13px;
  letter-spacing: 2px;
  display: block;
  margin-bottom: 10px;
}

.auth-title {
  font-family: 'Inter', sans-serif;
  font-size: 48px;
  font-weight: 800;
  color: #1a1a1a;
  line-height: 1.1;
}

.auth-content-main {

  border-left: 1px solid #e0e0e0;
  padding-left: 50px;
}

.auth-bullet-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.auth-bullet-list li {
  position: relative;
  margin-top: 27px !important;
}

.auth-bullet-list li:first-child {
  margin-top: 0 !important;
}

.auth-bullet-list li:first-child {
  padding-top: 0;
}

.auth-bullet-list li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}



.auth-text {
  /* font-family: 'Inter', sans-serif; */
  font-size: 18px;
  /* Symmetrical size for all 3 */
  /* line-height: 1.7; */
  /* color: #333333; */
  margin-bottom: 44px;
  /* font-weight: 400; */
}

.auth-bullet-list .auth-text {
  margin-bottom: 0;
}

/* Sirf bold keywords ko prominence dene ke liye */
.auth-text strong {
  color: #1a1a1a;
  font-weight: 600;
}

/* Last paragraph ka margin khatam karne ke liye */
.auth-text:last-child {
  margin-bottom: 0;
}

@media (max-width: 991px) {
  .auth-content-main {
    border-left: none;
    padding-left: 0;
    margin-top: 40px;
  }

  .auth-title {
    font-size: 36px;
  }

  .auth-text {
    font-size: 19px;
  }
}

/* Home blogs additional css  */
/* Heading ko line-limit aur fixed area dena */
/* Card Setup */
.tp-blog-masonry-item {
  background: transparent;
  /* Ya jo background color tumne rakha hai */
  transition: transform 0.3s ease;
  height: 100%;
}

/* Heading - full show, no cut */
.tp-blog-masonry-title {
  /* font-size: 22px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom:; */
  margin-top: 16px;
}

.tp-blog-masonry-title a {

  text-decoration: none;
}

.blog-desc {

  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 15px;
}

/* Alignment Hack */
.mt-auto {
  margin-top: auto !important;
}

.flex-grow-1 {
  flex-grow: 1;
}

.tp-blog-masonry-btn a {
  font-weight: 600;
  font-size: 14px;
  text-transform: none;
  color: #86f2c8;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.tp-blog-masonry-btn a:hover {
  color: #41bc84;
}

/* =============================================
   BCG-STYLE SERVICES SECTION (what-we-do.php)
   ============================================= */

.services-bcg-section {
  background: #fff;
  padding-bottom: 0;
}

.services-bcg-label-row {
  padding: 40px 60px 0;
}

.services-bcg-top-label {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.1em;

  color: #666;
}

.services-bcg-grid {
  border-top: 1px solid #e5e7eb;
}

.services-bcg-panel {
  border-right: 1px solid #e5e7eb;
  border-bottom: 1px solid #e5e7eb;
}

.services-bcg-panel:nth-child(even) {
  border-right: none;
}

.services-bcg-panel-inner {
  padding: 56px 60px 64px;
}

.services-bcg-title {
  font-size: clamp(32px, 3.5vw, 36px);
  font-weight: 700;
  line-height: 1.1;
  color: #0d0d0d;
  margin-bottom: 20px;
  letter-spacing: -0.02em;
}

.services-bcg-desc {
  font-size: 18px;


  margin-bottom: 40px;
  max-width: 420px;
}

.services-bcg-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.services-bcg-item {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  border-top: 1px solid #d1d5db;
  /* padding: 18px 0; */
  cursor: pointer;
  transition: background 0.2s ease, padding 0.2s ease;
}

.services-bcg-item:last-child {
  border-bottom: 1px solid #d1d5db;
}

.services-bcg-item-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 0;
  gap: 16px;
}

.services-bcg-item-name {
  font-size: 20px;
  font-weight: 500;
  color: #111;
  transition: color 0.2s ease;
}

@media (min-width: 280px) and (max-width: 767px) {
  .services-bcg-item-name {
    font-size: 18px;

  }
}


.services-bcg-item-name .arrow {
  color: #999;
  font-weight: 400;
  margin-left: 6px;
  transition: color 0.2s ease;
  display: none;
}

.services-bcg-item-toggle {
  width: 30px;
  height: 30px;
  border: 1px solid #ccc;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 300;
  color: #888;
  flex-shrink: 0;
  transition: all 0.2s ease;
}

.services-bcg-body {
  padding-top: 10px;
  font-size: 15px;
  color: #555;
  line-height: 1.7;
  max-width: 460px;
}

.services-bcg-item:hover .services-bcg-item-name {
  color: var(--tp-common-primary);
}

.services-bcg-item:hover .services-bcg-item-name .arrow {
  color: var(--tp-common-primary);
}

.services-bcg-item:hover .services-bcg-item-toggle {
  background: var(--tp-common-primary);
  border-color: var(--tp-common-primary);
  color: #fff;
}

@media (max-width: 991px) {
  .services-bcg-panel {
    border-right: none;
  }

  .services-bcg-panel-inner {
    padding: 40px 24px 48px;
  }

  .services-bcg-label-row {
    padding: 32px 24px 0;
  }
}

/* =============================================
   RESOURCES DETAILS PAGE (resources-details.php)
   ============================================= */




/* Back Link */
.rd-back-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  color: #555;
  text-decoration: none;
  transition: color 0.2s ease;
}

.rd-back-link:hover {
  color: var(--tp-common-primary);
}

/* Article Meta */
.rd-article-meta {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.rd-article-category {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;

  color: #fff;
  background: var(--tp-common-primary);
  padding: 4px 14px;
  border-radius: 100px;
}

.rd-article-date,
.rd-article-read {
  font-size: 14px;
  color: #888;
}

/* Article Title */
.rd-article-title {
  font-size: clamp(28px, 4vw, 48px);
  font-weight: 700;
  line-height: 1.2;
  color: #0d0d0d;
  letter-spacing: -0.02em;
  margin: 0;
}

/* Article Body */
.rd-article-body p {
  font-size: 17px;
  line-height: 1.8;
  color: #333;
  margin-bottom: 24px;
}

/* WYSIWYG body typography */
.rd-article-body h2 {
  font-size: 26px;
  font-weight: 700;
  color: #0d0d0d;
  line-height: 1.2;
  letter-spacing: -0.01em;
  margin: 50px 0 20px;
}

.rd-article-body h3 {
  font-size: 22px;
  font-weight: 700;
  color: #0d0d0d;
  line-height: 1.2;
  letter-spacing: -0.01em;
  margin: 40px 0 16px;
}

.rd-article-body h4 {
  font-size: 18px;
  font-weight: 700;
  color: #0d0d0d;
  line-height: 1.3;
  margin: 32px 0 12px;
}

.rd-article-body img {
  display: block;
  width: 100%;
  /* max-width: 760px; */
  height: 400px;
  object-fit: cover;
  margin: 0 auto;
  border-radius: 18px;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.08);
  margin-bottom: 24px;
}

.rd-article-body ul,
.rd-article-body ol {
  margin: 0 0 24px;
  padding-left: 20px;
  color: #333;
}

.rd-article-body ul li,
.rd-article-body ol li {
  font-size: 17px;
  line-height: 1.8;
  margin-bottom: 8px;
}

.rd-article-body strong {
  font-weight: 700;
  color: #111;
}

.rd-article-body hr {
  border: 0;
  border-top: 1px solid #e5e7eb;
  margin: 40px 0;
}

.rd-article-hero {
  margin-bottom: 32px;
}

.rd-article-hero img {
  display: block;
  width: 100%;
  /* max-width: 760px; */
  ;
  height: 400px;
  object-fit: cover;
  margin: 0 auto;
  border-radius: 18px;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.08);
}

.rd-article-subheading {
  font-size: 26px;
  font-weight: 700;
  color: #0d0d0d;
  letter-spacing: -0.01em;
}

/* Article List */
.rd-article-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-top: 1px solid #e5e7eb;
}

/* .rd-list-item {
  padding: 22px 0;
  border-bottom: 1px solid #e5e7eb;
} */

.rd-list-item strong {
  display: block;
  font-size: 16px;
  font-weight: 700;
  color: #111;
  margin-bottom: 6px;
}

.rd-list-item p {
  font-size: 16px;
  color: #555;
  line-height: 1.7;
  margin: 0;
}

/* Expert Authors Section */
.rd-authors-section {
  background: #f8f8f6;
  border-top: 1px solid #e5e7eb;
}

.rd-authors-heading {
  font-size: 22px;
  font-weight: 700;
  color: #0d0d0d;
  padding-bottom: 20px;
  border-bottom: 2px solid #0d0d0d;
}

.rd-author-card {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.rd-author-photo {
  width: 80px;
  height: 80px;
  /* border-radius: 50%; */
  overflow: hidden;
  flex-shrink: 0;
}

.rd-author-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rd-author-name {
  font-size: 16px;
  font-weight: 700;
  color: #111;
  margin-bottom: 2px;
}

.rd-author-role {
  font-size: 13px;
  color: #777;
  display: block;
  margin-bottom: 8px;
}

.rd-author-profile-link {
  font-size: 13px;
  font-weight: 600;
  color: var(--tp-common-primary);
  text-decoration: none;
  display: inline-block;
  margin-bottom: 12px;
  transition: opacity 0.2s ease;
}

.rd-author-profile-link:hover {
  opacity: 0.75;
}

.rd-author-bio {
  font-size: 14px;
  color: #555;
  line-height: 1.7;
  margin: 0;
}

@media (max-width: 576px) {
  .rd-author-card {
    flex-direction: column;
  }
}

.team-detail {
  background: #ffffff;
}


/* Hero */
.team-hero {
  padding: 135px 0 30px;
  background: linear-gradient(120deg, #e6fff4 0%, #f7fbff 60%, #ffffff 100%);
  border-bottom: 1px solid #e5e7eb;
}

.team-hero-header {
  max-width: 620px;
}

.team-back-link {
  font-size: 14px;
  color: #555;
  text-decoration: none;
}

.team-back-link:hover {
  color: var(--tp-common-primary);
}

.team-hero-name {
  font-size: clamp(32px, 4vw, 42px);
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 4px;
}

.team-hero-role {
  font-size: 16px;
  font-weight: 500;
  color: #111827;
  margin-bottom: 4px;
}

.team-hero-expertise {
  font-size: 14px;
  color: #4b5563;
  margin-bottom: 12px;
}

.team-hero-summary {
  font-size: 16px;
  line-height: 1.8;
  color: #333;
  max-width: 540px;
}

.team-hero-link {
  font-size: 14px;
  font-weight: 600;
  /* color: var(--tp-common-primary); */
  text-decoration: none;
  margin-top: 4px;
}

.team-hero-link:hover {
  opacity: 0.8;
}

/* Photo */
.team-hero-photo-wrap {
  position: relative;
}

.team-hero-photo {
  display: inline-block;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.16);
}

.team-hero-photo img {
  display: block;
  width: 100%;
  height: auto;
}

/* Body */
.team-detail-body {
  background: #ffffff;
}

.team-section-title {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 20px;
}

.team-detail-main p {
  font-size: 16px;
  line-height: 1.8;
  color: #333;
  margin-bottom: 20px;
  letter-spacing: -0.6px;
}

.team-subsection-title {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 12px;
}

.team-detail-list {
  padding-left: 20px;
  margin-bottom: 24px;
}

.team-detail-list li {
  font-size: 15px;
  line-height: 1.7;
  margin-bottom: 6px;
}

/* Sidebar */
.team-detail-sidebar {
  padding-left: 24px;
  border-left: 1px solid #e5e7eb;
}

.team-sidebar-title {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 12px;
}

.team-sidebar-list {
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
}

.team-sidebar-list li {
  font-size: 14px;
  color: #555;
  padding: 4px 0;
}

.team-sidebar-text {
  font-size: 14px;
  color: #555;
}

@media (max-width: 991px) {
  .team-detail-sidebar {
    margin-top: 40px;
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid #e5e7eb;
    padding-top: 24px;
  }
}

.team-sidebar-photo {
  display: flex;
  justify-content: center;
}


.about-intro-text {
  font-size: 18px;
  line-height: 1.7;
  margin-bottom: 18px;
}

.about-intro-text-left {
  width: 70%;

  font-size: 24px !important;
}

@media (max-width: 768px) {
  .about-intro-text-left {
    width: 100% !important;

    font-size: 20px !important;


  }

}

.team-sidebar-photo img {
  height: 320px;
  margin: auto;
  object-fit: contain;
}

/* Preloader */
/* From Uiverse.io by Juanes200122 */
#svg-global {
  zoom: 1.2;
  overflow: visible;
}

@keyframes fade-particles {

  0%,
  100% {
    opacity: 1;
  }

  50% {
    opacity: 0.5;
  }
}

@keyframes floatUp {
  0% {
    transform: translateY(0);
    opacity: 0;
  }

  10% {
    opacity: 1;
  }

  100% {
    transform: translateY(-40px);
    opacity: 0;
  }
}

#particles {
  animation: fade-particles 5s infinite alternate;
}

.particle {
  animation: floatUp linear infinite;
}

.p1 {
  animation-duration: 2.2s;
  animation-delay: 0s;
}

.p2 {
  animation-duration: 2.5s;
  animation-delay: 0.3s;
}

.p3 {
  animation-duration: 2s;
  animation-delay: 0.6s;
}

.p4 {
  animation-duration: 2.8s;
  animation-delay: 0.2s;
}

.p5 {
  animation-duration: 2.3s;
  animation-delay: 0.4s;
}

.p6 {
  animation-duration: 3s;
  animation-delay: 0.1s;
}

.p7 {
  animation-duration: 2.1s;
  animation-delay: 0.5s;
}

.p8 {
  animation-duration: 2.6s;
  animation-delay: 0.2s;
}

.p9 {
  animation-duration: 2.4s;
  animation-delay: 0.3s;
}

@keyframes bounce-lines {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-3px);
  }
}

#line-v1,
#line-v2,
#node-server,
#panel-rigth,
#reflectores,
#particles {
  animation: bounce-lines 3s ease-in-out infinite alternate;
}

#line-v2 {
  animation-delay: 0.2s;
}

#node-server,
#panel-rigth,
#reflectores,
#particles {
  animation-delay: 0.4s;
}

.ajax-response.error {
  color: red !important;

}

/* header new design */

/* ===== Usability Nation: Modern Hero with Deep Blend & Fade ===== */
.un-client-hero {
  position: relative;

  background-color: #f7fbfa;

  background-image:
    radial-gradient(rgba(15, 42, 39, 0.08) 1.5px, transparent 1.5px),
    radial-gradient(circle at 10% 10%, rgba(125, 255, 196, 0.18) 0%, transparent 55%),
    radial-gradient(circle at 80% 20%, rgba(15, 42, 39, 0.04) 0%, transparent 70%);
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-size: 1100px auto, 100% 100%, 100% 100%;
  background-position: left 12% center, left top, right top;
  overflow: hidden;
  display: flex;
  align-items: center;
  min-height: 100vh;
  animation: un-hero-network-drift 32s ease-in-out infinite alternate;
}


@keyframes un-hero-network-drift {
  0% {
    background-position: left 10% center, left top, right top;
  }

  50% {
    background-position: left 14% center, left top, right 4% top;
  }

  100% {
    background-position: left 18% center, left top, right top;
  }
}

/* Background Illustration Layer */
.un-client-hero::before {
  content: '';
  position: absolute;
  top: 120px;
  right: 0;

  width: 52%;
  height: 80%;
  background-image: var(--un-client-hero-before-image, url("../images/client-illustration.png"));
  background-repeat: no-repeat;
  background-position: right center;
  background-size: contain;

  opacity: 1;

  mask-image: linear-gradient(to right, rgb(0 0 0) 0%, rgb(0 0 0 / 35%) 7%, #10232457 14%, #000 100%);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  z-index: 1;
  pointer-events: none;
}


@media (max-width: 1300px) {
  .un-client-hero::before {
    width: 42%;

  }
}

@media (max-width: 576px) {
  .un-client-hero::before {
    display: none;
  }
}

.un-client-hero::after {
  content: '';
  position: absolute;
  width: 700px;
  height: 700px;
  top: -150px;
  right: -100px;
  background: radial-gradient(circle, rgba(125, 255, 196, 0.4) 0%, rgba(37, 111, 100, 0.1) 50%, transparent 70%);
  filter: blur(80px);
  z-index: 0;
  pointer-events: none;
}


.un-client-hero .container {
  position: relative;
  z-index: 5;
}

.un-client-hero__content .tp-btn-black-text {
  font-size: 18px !important;
  padding: 13px 22px !important;
}

@media (max-width: 767px) {
  .un-client-hero__content .tp-btn-black-text {
    font-size: 15px !important;
    padding: 13px 17px !important;
  }
}

.un-client-hero__content .tp-btn-black-circle {
  width: 47px !important;
  height: 47px !important;
  line-height: 47px !important;

}

.un-client-hero__content {
  max-width: 750px;
  padding-top: 120px;
  padding-bottom: 60px;
  position: relative;
  z-index: 5;
  /* Gently nudge content toward center on large screens */
  margin-left: 0px;
}

@media (max-width: 768px) {
  .un-client-hero__content {
    padding-top: 50px;
    margin-left: 0;
    padding-bottom: 0 !important;
  }
}


.un-client-hero__content h1 {
  font-weight: 800;
  font-size: 56px;
  line-height: 1.1;
  color: #0f2a27;
  margin-bottom: 24px;
}


@media (min-width: 576px) and (max-width :1199px) {

  .un-client-hero__content h1 {
    font-weight: 800;
    font-size: 48px;
    line-height: 1.1;
    color: #0f2a27;

    margin-bottom: 24px;
  }
}

.un-client-hero__para {
  font-size: 20px;
  line-height: 1.6;
  color: #3d504e;
  max-width: 580px;
  margin-bottom: 8px;
}

.un-client-hero__actions {
  display: flex;
  gap: 16px;
  align-items: center;
}

/* Slightly larger primary button in hero */
.un-client-hero__actions .tp-btn-black,
.un-client-hero__actions .btn-red-bg {
  /* padding: 14px 30px; */
  font-size: 16px;
}

@media (max-width: 575px) {

  .un-client-hero__actions .tp-btn-black,
  .un-client-hero__actions .btn-red-bg {
    width: auto;
    padding-inline: 26px;
  }
}

/* Mobile Responsive Fixes */
@media (max-width: 991px) {
  .un-client-hero {
    padding: 120px 0 80px;
    text-align: center;
  }

  .un-client-hero::before {
    width: 100%;
    opacity: 0.15;
    top: 0;
    display: none;
  }

  .un-client-hero__content {
    margin: 0 auto;
  }

  .un-client-hero__actions {
    justify-content: center;
  }

  .un-client-hero__content h1 {
    font-size: 40px;
  }
}

@media (max-width: 575px) {
  .un-client-hero__content h1 {
    font-size: 32px;
  }
}

.service-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border-top: 4px solid transparent !important;
}

.service-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1) !important;
  border-top: 4px solid #2a6d64 !important;
}

.transition-all {
  transition: all 0.3s ease-in-out;
}

@media (min-width: 768px) {
  .mt-md-4 {
    margin-top: 2rem !important;

  }
}

.service-box-card {
  display: flex;
  flex-direction: column;
  align-items: center;
}


.un-whatwedo {
  background: #fff;
}

.un-whatwedo__heading {
  font-weight: 800;
}

.un-whatwedo__subtitle {
  margin: 0 auto;
  max-width: 720px;
  font-size: 18px;
  line-height: 1.7;
  /* color: #666; */
}

.un-service-card {
  height: 100%;
  padding: 34px 28px;
  background: #fff;
  border: 1px solid rgba(16, 24, 40, 0.08);
  border-radius: 18px;
  text-align: center;
  box-shadow: 0 10px 30px rgba(16, 24, 40, 0.06);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.un-service-card:hover {
  transform: translateY(-4px);
  border-color: rgba(42, 109, 100, 0.22);
  box-shadow: 0 16px 40px rgba(16, 24, 40, 0.10);
}

.un-service-card__icon {
  width: 68px;
  height: 68px;
  margin: 0 auto 18px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(42, 109, 100, 0.08);
  border: 1px solid rgba(42, 109, 100, 0.12);
}

.un-service-card__icon svg {
  width: 34px;
  height: 34px;
}

.un-service-card__title {
  margin: 0;
  font-size: 18px;
  line-height: 1.35;
  color: #101828;
  font-weight: 600;
}

@media (max-width: 767.98px) {
  .un-whatwedo__subtitle {
    font-size: 16px;
  }

  .un-service-card {
    padding: 28px 18px;
    border-radius: 16px;
  }
}

.desc-wrapper {
  padding-top: 12px !important;
}

.what-we-do-cards {
  width: 80%;

}

@media (max-width: 768px) {
  .what-we-do-cards {
    width: 100%;
  }
}

.section-right-divider {
  /* border: 2px solid red; */
  border-left: 1px solid #e0e0e0;
  padding-left: 50px;
}


@media (max-width: 768px) {
  .section-right-divider {
    border-left: none;
    padding-left: 0;
  }
}

.contact-submit-btn {
  font-size: 18px;
  font-weight: 600;
  line-height: 1;
  border-radius: 999px;
  padding: 18px 46px;
  letter-spacing: -0.18px;
  border: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #fff;
  background: linear-gradient(135deg, #41bc84, #86f2c8);
  /* box-shadow: 0 14px 40px rgba(65, 188, 132, 0.35); */
  box-shadow: 0 2px 18px rgba(65, 188, 132, 0.35);
  transition: background 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
  width: 100%;
}

.wpcf7 form .wpcf7-response-output{
  margin: 0.2em 0.5em 1em !important;
  border-radius: 10px !important;

}

.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
  border-color: #ff3e3e;
  color: red;
}
.wpcf7-not-valid-tip {
  color: #dc3232;
  font-size: 13px !important;
  font-weight: normal;
  display: block;
}