/* Main Slider Widget Styles - Scoped under .slider-wrapper */
.slider-wrapper {
  overflow: hidden;
}

.slider-wrapper a{
text-decoration: none;
}
.slider-wrapper .main-slider {
  position: relative;
  display: block;
  background-color: var(--primary_color_font);
  z-index: 91;
}

.slider-wrapper .main-slider .swiper-slide {
  position: relative;
  background-color: var(--primary_color_font);
}

.slider-wrapper .main-slider__bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: opacity 1000ms ease-in, -webkit-transform 7000ms ease;
  transition: opacity 1000ms ease-in, -webkit-transform 7000ms ease;
  transition: transform 7000ms ease, opacity 1000ms ease-in;
  transition: transform 7000ms ease, opacity 1000ms ease-in, -webkit-transform 7000ms ease;
}

.slider-wrapper .main-slider__bg:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(17, 17, 17, .95);
  z-index: -1;
}

.slider-wrapper .main-slider .swiper-slide-active .main-slider__bg {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.slider-wrapper .main-slider__img {
  position: absolute;
  bottom: 0px;
  right: 0px;
  opacity: 0;
  -webkit-transform: perspective(400px) rotateY(0deg) translateX(400px) scale(0.9);
  -ms-transform: perspective(400px) rotateY(0deg) translateX(400px) scale(0.9);
  transform: perspective(400px) rotateY(0deg) translateX(400px) scale(0.9);
  -webkit-transform-origin: center;
  -ms-transform-origin: center;
  transform-origin: center;
  visibility: hidden;
  -webkit-transition: all 1000ms ease;
  -moz-transition: all 1000ms ease;
  -ms-transition: all 1000ms ease;
  -o-transition: all 1000ms ease;
  transition: all 1000ms ease;
}

.slider-wrapper .main-slider__img img {
  width: auto;
  animation: leftRight 4s ease-in-out infinite;
}

.slider-wrapper .main-slider .swiper-slide-active .main-slider__img {
  visibility: visible;
  opacity: 1;
  -webkit-transform: perspective(400px) rotateY(0deg) translateX(0px) scale(1);
  -ms-transform: perspective(400px) rotateY(0deg) translateX(0px) scale(1);
  transform: perspective(400px) rotateY(0deg) translateX(0px) scale(1);
  -webkit-transition-delay: 2600ms;
  -moz-transition-delay: 2600ms;
  -ms-transition-delay: 2600ms;
  -o-transition-delay: 2600ms;
  transition-delay: 2600ms;
}

.slider-wrapper .main-slider__shape-1 {
  position: absolute;
  top: 0;
  right: 0;
  width: 570px;
  height: 50%;
  background-color: var(--primary_color);
  clip-path: polygon(0% 0, 100% 0, 100% 100%, 0 0%);
  mix-blend-mode: soft-light;
  -moz-transform: skew(0deg, 0deg) translateX(100%);
  -webkit-transform: skew(0deg, 0deg) translateX(100%);
  -o-transform: skew(0deg, 0deg) translateX(100%);
  -ms-transform: skew(0deg, 0deg) translateX(100%);
  transform: skew(0deg, 0deg) translateX(100%);
  opacity: 0;
  -webkit-transition: all 1000ms ease;
  -moz-transition: all 1000ms ease;
  -ms-transition: all 1000ms ease;
  -o-transition: all 1000ms ease;
  transition: all 1000ms ease;
  z-index: -1;
}

.slider-wrapper .main-slider .swiper-slide-active .main-slider__shape-1,
.slider-wrapper .main-slider .swiper-slide-active .main-slider__shape-2,
.slider-wrapper .main-slider .swiper-slide-active .main-slider__shape-3,
.slider-wrapper .main-slider .swiper-slide-active .main-slider__shape-4 {
  opacity: 1;
  -moz-transform: skew(0deg, 0deg) translate(0);
  -webkit-transform: skew(0deg, 0deg) translate(0);
  -o-transform: skew(0deg, 0deg) translate(0);
  -ms-transform: skew(0deg, 0deg) translate(0);
  transform: skew(0deg, 0deg) translate(0);
  -webkit-transition-delay: 2000ms;
  -moz-transition-delay: 2000ms;
  -ms-transition-delay: 2000ms;
  -o-transition-delay: 2000ms;
  transition-delay: 2000ms;
}

.slider-wrapper .main-slider__shape-2 {
  position: absolute;
  top: 0;
  right: 0;
  width: 590px;
  height: 53%;
  background-color: var(--primary_color);
  clip-path: polygon(0% 0, 100% 0, 100% 100%, 0 0%);
  mix-blend-mode: soft-light;
  -moz-transform: skew(0deg, 0deg) translateX(100%);
  -webkit-transform: skew(0deg, 0deg) translateX(100%);
  -o-transform: skew(0deg, 0deg) translateX(100%);
  -ms-transform: skew(0deg, 0deg) translateX(100%);
  transform: skew(0deg, 0deg) translateX(100%);
  opacity: 0;
  -webkit-transition: all 1000ms ease;
  -moz-transition: all 1000ms ease;
  -ms-transition: all 1000ms ease;
  -o-transition: all 1000ms ease;
  transition: all 1000ms ease;
  z-index: -1;
}

.slider-wrapper .main-slider__shape-3 {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 570px;
  height: 50%;
  background-color: var(--primary_color);
  clip-path: polygon(100% 0, 0 100%, 100% 100%);
  mix-blend-mode: soft-light;
  -moz-transform: skew(0deg, 0deg) translateX(100%);
  -webkit-transform: skew(0deg, 0deg) translateX(100%);
  -o-transform: skew(0deg, 0deg) translateX(100%);
  -ms-transform: skew(0deg, 0deg) translateX(100%);
  transform: skew(0deg, 0deg) translateX(100%);
  opacity: 0;
  -webkit-transition: all 1000ms ease;
  -moz-transition: all 1000ms ease;
  -ms-transition: all 1000ms ease;
  -o-transition: all 1000ms ease;
  transition: all 1000ms ease;
  z-index: -1;
}

.slider-wrapper .main-slider__shape-4 {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 590px;
  height: 53%;
  background-color: var(--primary_color);
  clip-path: polygon(100% 0, 0 100%, 100% 100%);
  mix-blend-mode: soft-light;
  -moz-transform: skew(0deg, 0deg) translateX(100%);
  -webkit-transform: skew(0deg, 0deg) translateX(100%);
  -o-transform: skew(0deg, 0deg) translateX(100%);
  -ms-transform: skew(0deg, 0deg) translateX(100%);
  transform: skew(0deg, 0deg) translateX(100%);
  opacity: 0;
  -webkit-transition: all 1000ms ease;
  -moz-transition: all 1000ms ease;
  -ms-transition: all 1000ms ease;
  -o-transition: all 1000ms ease;
  transition: all 1000ms ease;
  z-index: -1;
}

.slider-wrapper .main-slider__shape-5 {
  position: absolute;
  bottom: 45px;
  left: -85px;
  -moz-transform: skew(0deg, 0deg) translateX(-100%);
  -webkit-transform: skew(0deg, 0deg) translateX(-100%);
  -o-transform: skew(0deg, 0deg) translateX(-100%);
  -ms-transform: skew(0deg, 0deg) translateX(-100%);
  transform: skew(0deg, 0deg) translateX(-100%);
  opacity: 0;
  -webkit-transition: all 1000ms ease;
  -moz-transition: all 1000ms ease;
  -ms-transition: all 1000ms ease;
  -o-transition: all 1000ms ease;
  transition: all 1000ms ease;
  z-index: -1;
}

.slider-wrapper .main-slider__shape-5 img {
  width: auto;
  animation: topBottom 3s ease-in-out infinite;
}

.slider-wrapper .main-slider .swiper-slide-active .main-slider__shape-5 {
  opacity: 1;
  -moz-transform: skew(0deg, 0deg) translate(0);
  -webkit-transform: skew(0deg, 0deg) translate(0);
  -o-transform: skew(0deg, 0deg) translate(0);
  -ms-transform: skew(0deg, 0deg) translate(0);
  transform: skew(0deg, 0deg) translate(0);
  -webkit-transition-delay: 3200ms;
  -moz-transition-delay: 3200ms;
  -ms-transition-delay: 3200ms;
  -o-transition-delay: 3200ms;
  transition-delay: 3200ms;
}

.slider-wrapper .main-slider__shape-6 {
  position: absolute;
  bottom: 0;
  right: 0;
  -moz-transform: skew(0deg, 0deg) translateX(100%);
  -webkit-transform: skew(0deg, 0deg) translateX(100%);
  -o-transform: skew(0deg, 0deg) translateX(100%);
  -ms-transform: skew(0deg, 0deg) translateX(100%);
  transform: skew(0deg, 0deg) translateX(100%);
  opacity: 0;
  -webkit-transition: all 1000ms ease;
  -moz-transition: all 1000ms ease;
  -ms-transition: all 1000ms ease;
  -o-transition: all 1000ms ease;
  transition: all 1000ms ease;
  z-index: -1;
}

.slider-wrapper .main-slider__shape-6 img {
  width: auto;
}

.slider-wrapper .main-slider .swiper-slide-active .main-slider__shape-6 {
  opacity: 1;
  -moz-transform: skew(0deg, 0deg) translate(0);
  -webkit-transform: skew(0deg, 0deg) translate(0);
  -o-transform: skew(0deg, 0deg) translate(0);
  -ms-transform: skew(0deg, 0deg) translate(0);
  transform: skew(0deg, 0deg) translate(0);
  -webkit-transition-delay: 3000ms;
  -moz-transition-delay: 3000ms;
  -ms-transition-delay: 3000ms;
  -o-transition-delay: 3000ms;
  transition-delay: 3000ms;
}

.slider-wrapper .main-slider .container {
  position: relative;
  z-index: 30;
}

.slider-wrapper .main-slider__content {
  position: relative;
  display: block;
  padding-top: 318px;
  padding-bottom: 180px;
  z-index: 15;
}

.slider-wrapper .main-slider__sub-title {
  position: relative;
  display: block;
  font-size: 16px;
  color: var(--primary_color);
  font-weight: 600;
  line-height: 1em;
  text-transform: uppercase;
  opacity: 0;
  -webkit-transform: perspective(400px) rotateY(0deg) translateY(-80px);
  -ms-transform: perspective(400px) rotateY(0deg) translateY(-80px);
  transform: perspective(400px) rotateY(0deg) translateY(-80px);
  -webkit-transform-origin: bottom;
  -ms-transform-origin: bottom;
  transform-origin: bottom;
  -webkit-transition: all 1000ms ease;
  -moz-transition: all 1000ms ease;
  -ms-transition: all 1000ms ease;
  -o-transition: all 1000ms ease;
  transition: all 1000ms ease;
}

.slider-wrapper .main-slider .swiper-slide-active .main-slider__sub-title {
  opacity: 1;
  -webkit-transform: perspective(400px) rotateY(0deg) translateY(0px);
  -ms-transform: perspective(400px) rotateY(0deg) translateY(0px);
  transform: perspective(400px) rotateY(0deg) translateY(0px);
  -webkit-transition-delay: 1200ms;
  -moz-transition-delay: 1200ms;
  -ms-transition-delay: 1200ms;
  -o-transition-delay: 1200ms;
  transition-delay: 1200ms;
}

.slider-wrapper .main-slider__title {
  position: relative;
  font-size: 60px;
  color: #fff;
  font-weight: 700;
  line-height: 1.2em;
  text-transform: capitalize;
  margin-top: 24px;
  opacity: 0;
  -webkit-transform: perspective(400px) rotateY(0deg) translateY(-80px);
  -ms-transform: perspective(400px) rotateY(0deg) translateY(-80px);
  transform: perspective(400px) rotateY(0deg) translateY(-80px);
  -webkit-transform-origin: bottom;
  -ms-transform-origin: bottom;
  transform-origin: bottom;
  -webkit-transition: all 1000ms ease;
  -moz-transition: all 1000ms ease;
  -ms-transition: all 1000ms ease;
  -o-transition: all 1000ms ease;
  transition: all 1000ms ease;
}

.slider-wrapper .main-slider__title span {
  color: var(--primary_color);
}

.slider-wrapper .main-slider .swiper-slide-active .main-slider__title {
  opacity: 1;
  -webkit-transform: perspective(400px) rotateY(0deg) translateY(0px);
  -ms-transform: perspective(400px) rotateY(0deg) translateY(0px);
  transform: perspective(400px) rotateY(0deg) translateY(0px);
  -webkit-transition-delay: 900ms;
  -moz-transition-delay: 900ms;
  -ms-transition-delay: 900ms;
  -o-transition-delay: 900ms;
  transition-delay: 900ms;
}

.slider-wrapper .main-slider__text {
  position: relative;
  display: block;
  font-size: 18px;
  color: rgba(255, 255, 255, .70);
  font-weight: 400;
  margin-top: 20px;
  margin-bottom: 44px;
  opacity: 0;
  -webkit-transform: perspective(400px) rotateY(0deg) translateY(80px);
  -ms-transform: perspective(400px) rotateY(0deg) translateY(80px);
  transform: perspective(400px) rotateY(0deg) translateY(80px);
  -webkit-transform-origin: bottom;
  -ms-transform-origin: bottom;
  transform-origin: bottom;
  -webkit-transition: all 1000ms ease;
  -moz-transition: all 1000ms ease;
  -ms-transition: all 1000ms ease;
  -o-transition: all 1000ms ease;
  transition: all 1000ms ease;
  z-index: 1;
}

.slider-wrapper .main-slider .swiper-slide-active .main-slider__text {
  opacity: 1;
  -webkit-transform: perspective(400px) rotateY(0deg) translateY(0px);
  -ms-transform: perspective(400px) rotateY(0deg) translateY(0px);
  transform: perspective(400px) rotateY(0deg) translateY(0px);
  -webkit-transition-delay: 1400ms;
  -moz-transition-delay: 1400ms;
  -ms-transition-delay: 1400ms;
  -o-transition-delay: 1400ms;
  transition-delay: 1400ms;
}

.slider-wrapper .main-slider__btn-and-review-box {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 30px;
  opacity: 0;
  -webkit-transform: perspective(400px) rotateY(0deg) translateY(80px);
  -ms-transform: perspective(400px) rotateY(0deg) translateY(80px);
  transform: perspective(400px) rotateY(0deg) translateY(80px);
  -webkit-transform-origin: bottom;
  -ms-transform-origin: bottom;
  transform-origin: bottom;
  -webkit-transition: all 1000ms ease;
  -moz-transition: all 1000ms ease;
  -ms-transition: all 1000ms ease;
  -o-transition: all 1000ms ease;
  transition: all 1000ms ease;
}

.slider-wrapper .main-slider .swiper-slide-active .main-slider__btn-and-review-box {
  opacity: 1;
  -webkit-transform: perspective(400px) rotateY(0deg) translateY(0px);
  -ms-transform: perspective(400px) rotateY(0deg) translateY(0px);
  transform: perspective(400px) rotateY(0deg) translateY(0px);
  -webkit-transition-delay: 2000ms;
  -moz-transition-delay: 2000ms;
  -ms-transition-delay: 2000ms;
  -o-transition-delay: 2000ms;
  transition-delay: 2000ms;
}

.slider-wrapper .main-slider__btn-box {
  position: relative;
  display: block;
}

.slider-wrapper .main-slider__btn-box .thm-btn::before,
.slider-wrapper .main-slider__btn-box .thm-btn::after {
  background-color: #fff;
}

.slider-wrapper .main-slider__btn-box .thm-btn:hover {
  color: var(--primary_color);
}

.slider-wrapper .main-slider__btn-box .thm-btn:hover>span {
  background-color: var(--primary_color);
  color: #fff;
}

.slider-wrapper .main-slider__review-box {
  position: relative;
  display: flex;
  align-items: center;
}

.slider-wrapper .main-slider__review-box ul {
  position: relative;
  display: block;
}

.slider-wrapper .main-slider__review-box ul li {
  position: relative;
  display: block;
  float: left;
}

.slider-wrapper .main-slider__review-box ul li+li {
  margin-left: -20px;
}

.slider-wrapper .main-slider__review-box ul li .img-box {
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid var(--primary_color);
}

.slider-wrapper .main-slider__review-box ul li .img-box img {
  width: 100%;
}

.slider-wrapper .main-slider__review-box .text-box {
  position: relative;
  display: block;
  margin-left: 10px;
  flex: 1;
}

.slider-wrapper .main-slider__review-box .text-box h2 {
  color: #fff;
  font-size: 22px;
  line-height: 30px;
  font-weight: 600;
  text-transform: capitalize;
}

.slider-wrapper .main-slider__review-box .text-box p {
  color: #fff;
  font-size: 16px;
  line-height: 22px;
  font-weight: 500;
}

.slider-wrapper #main-slider-pagination {
  position: absolute;
  left: 60px;
  right: auto;
  top: 55%;
  bottom: 0;
  transform: translateY(-50%);
  padding: 0;
  margin: 0;
  height: 80px;
  width: auto;
  z-index: 100;
}

.slider-wrapper #main-slider-pagination::before {
  position: absolute;
  top: -105px;
  left: 50%;
  width: 4px;
  height: 85px;
  background: rgb(255, 255, 255);
  background: linear-gradient(0deg, rgba(255, 255, 255, 1) 14%, rgba(255, 255, 255, 0.7595413165266106) 35%, rgba(255, 255, 255, 0.5746673669467788) 57%, rgba(255, 255, 255, 0.19371498599439774) 95%);
  transform: translateX(-50%);
  opacity: 0.3;
  content: "";
}

.slider-wrapper #main-slider-pagination::after {
  position: absolute;
  bottom: -105px;
  left: 50%;
  width: 4px;
  height: 85px;
  background: rgb(255, 255, 255);
  background: linear-gradient(180deg, rgba(255, 255, 255, 1) 14%, rgba(255, 255, 255, 0.7595413165266106) 35%, rgba(255, 255, 255, 0.5746673669467788) 57%, rgba(255, 255, 255, 0.19371498599439774) 95%);
  transform: translateX(-50%);
  opacity: 0.3;
  content: "";
}

.slider-wrapper #main-slider-pagination .swiper-pagination-bullet {
  position: relative;
  display: block;
  width: 10px;
  height: 10px;
  padding: 0;
  margin: 0;
  background: rgba(255, 255, 255, 0.4);
  border-radius: 50%;
  opacity: 1;
  transition: all 200ms linear;
  transition-delay: 0.1s;
}

.slider-wrapper #main-slider-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: rgba(255, 255, 255, 1);
}

.slider-wrapper #main-slider-pagination .swiper-pagination-bullet::before {
  position: absolute;
  top: -8px;
  left: -8px;
  bottom: -8px;
  right: -8px;
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 50%;
  transform: scaleX(0);
  transition: all 200ms linear;
  transition-delay: 0.1s;
  content: "";
}

.slider-wrapper #main-slider-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::before,
.slider-wrapper #main-slider-pagination .swiper-pagination-bullet:hover {
  transform: scaleX(1.0);
  border: 1px solid rgba(255, 255, 255, 1.0);
}

.slider-wrapper #main-slider-pagination .swiper-pagination-bullet+.swiper-pagination-bullet {
  margin-top: 25px;
}

/* Button Styles */
.slider-wrapper .thm-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  vertical-align: middle;
  -webkit-appearance: none;
  outline: none !important;
  background-color: var(--primary_color);
  color: #fff;
  font-size: 17px;
  line-height: 17px;
  font-weight: 600;
  padding: 5px 30px 5px;
  padding-right: 8px;
  overflow: hidden;
  border-radius: 30px;
  transition: all 0.5s linear;
  text-transform: capitalize;
  z-index: 1;
}

.slider-wrapper .thm-btn>span {
  position: relative;
  font-size: 18px;
  height: 44px;
  width: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--primary_color_font);
  border-radius: 50%;
  color: #fff;
  transition: all 0.5s linear;
}

.slider-wrapper .thm-btn:hover>span {
  background-color: #fff;
  color: var(--primary_color);
}

.slider-wrapper .thm-btn::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 50%;
  height: 0;
  visibility: hidden;
  background-color: var(--primary_color_font);
  opacity: 0;
  z-index: -1;
  transition: all 0.4s ease-in-out;
}

.slider-wrapper .thm-btn:hover:before {
  width: 100%;
  height: 100%;
  visibility: visible;
  opacity: 1;
}

.slider-wrapper .thm-btn::after {
  position: absolute;
  background-color: var(--primary_color_font);
  bottom: 0;
  right: 0;
  content: "";
  width: 50%;
  height: 0;
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: all 0.4s ease-in-out;
}

.slider-wrapper .thm-btn:hover::after {
  width: 100%;
  height: 100%;
  visibility: visible;
  opacity: 1;
}

.slider-wrapper .thm-btn:hover {
  color: #fff;
}

/* Clearfix */
.slider-wrapper .clearfix::after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive Styles for Main Slider */

/* Medium Large: 1200px - 1319px */
@media only screen and (min-width: 1200px) and (max-width: 1319px) {
  .slider-wrapper .main-slider__img {
    right: -190px;
  }

  .slider-wrapper .main-slider__img img {
    width: 80%;
  }

  .slider-wrapper #main-slider-pagination {
    left: auto;
    right: 60px;
  }
}

/* Medium: 992px - 1199px */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-wrapper .main-slider__img,
  .slider-wrapper .main-slider__shape-5 {
    display: none;
  }

  .slider-wrapper #main-slider-pagination {
    left: auto;
    right: 60px;
  }
}

/* Tablet: 768px - 991px */
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-wrapper .main-slider__img,
  .slider-wrapper .main-slider__shape-5 {
    display: none;
  }

  .slider-wrapper #main-slider-pagination {
    left: auto;
    right: 25px;
  }

  .slider-wrapper .main-slider__content {
    padding-top: 268px;
  }

  .slider-wrapper .main-slider__shape-1 {
    width: 400px;
  }

  .slider-wrapper .main-slider__shape-2 {
    width: 420px;
  }

  .slider-wrapper .main-slider__shape-3 {
    width: 400px;
  }

  .slider-wrapper .main-slider__shape-4 {
    width: 420px;
  }
}

/* Mobile: max-width 767px */
@media only screen and (max-width: 767px) {
  .slider-wrapper .main-slider__shape-1,
  .slider-wrapper .main-slider__shape-2,
  .slider-wrapper .main-slider__shape-3,
  .slider-wrapper .main-slider__shape-4 {
    display: none;
  }

  .slider-wrapper .main-slider__img,
  .slider-wrapper .main-slider__shape-5,
  .slider-wrapper .main-slider__shape-6 {
    display: none;
  }

  .slider-wrapper #main-slider-pagination {
    display: none;
  }

  .slider-wrapper .main-slider__title {
    font-size: 25px;
    line-height: 1.5em;
  }

  .slider-wrapper .main-slider__text br {
    display: none;
  }

  .slider-wrapper .main-slider__content {
    padding-top: 188px;
    padding-bottom: 100px;
  }
}

/* Small Mobile: max-width 500px */
@media only screen and (max-width: 500px) {
  .slider-wrapper .main-slider__title br {
    display: none;
  }

  .slider-wrapper .main-slider__review-box {
    flex-direction: column;
    align-items: baseline;
  }

  .slider-wrapper .main-slider__review-box .text-box {
    margin-left: 0;
    margin-top: 15px;
  }
}

/* Extra Large: 1320px - 1550px */
@media only screen and (min-width: 1320px) and (max-width: 1550px) {
  .slider-wrapper .main-slider__img {
    right: -190px;
  }

  .slider-wrapper .main-slider__img img {
    width: 80%;
  }
}

/* Extra Large: 1200px - 1770px */
@media only screen and (min-width: 1200px) and (max-width: 1770px) {
  .slider-wrapper .main-slider__shape-5 {
    display: none;
  }
}


/* ============================================
   Widget Services - Estilos Scoped
   Todos los estilos están scoped bajo .services-widget
   ============================================ */
   .services-widget a{
  text-decoration: none;
  }

  .services-widget {
   background-color: #fafafa;
  }
.services-widget {
  /* ============================================
     Estilos base de tipografía
     ============================================ */
  font-size: 16px;
  line-height: 1.7;
  font-family: var(--primary_font);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  
  /* Section wrapper - padding consistente (contenido central) */
  > .tmp-service-area {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    > .tmp-service-area {
      padding-top: 80px !important;
      padding-bottom: 80px !important;
    }
  }
  @media only screen and (max-width: 767px) {
    > .tmp-service-area {
      padding-top: 60px !important;
      padding-bottom: 60px !important;
    }
  }
  
  /* ============================================
     Estilos de Sección (tmp-section-gap)
     ============================================ */
  
  .tmp-section-gap {
    padding: 120px 0 !important;
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .tmp-section-gap {
      padding: 80px 0 !important;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-section-gap {
      padding: 60px 0 !important;
    }
  }
  
  /* ============================================
     Estilos de Título de Sección (tmp-section-title-border)
     ============================================ */
  
  .tmp-section-title-border .subtitle {
    display: flex;
    color: var(--primary_color);
    font-size: 13px;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    align-items: center;
    padding: 0 15px;
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-section-title-border .subtitle {
      flex-wrap: wrap;
      justify-content: center;
    }
  }
  
  .tmp-section-title-border .subtitle .subtitle-text {
    color: var(--secondary_color_font);
    font-weight: 700;
    width: max-content;
  }
  
  .tmp-section-title-border .subtitle .number {
    color: var(--primary_color);
    transition: 0.5s;
    opacity: 0.6;
    display: none;
  }
  
  .tmp-section-title-border .title {
    margin-top: 20px;
    color: #1b1b1c;
    font-family: var(--primary_font);
    word-break: break-word;
    line-height: 1.4074;
    margin: 20px 0 20px;
  }
  
  .tmp-section-title-border .title h2,
  .tmp-section-title-border h2.title {
    font-size: 48px;
    line-height: 1.2;
    font-weight: 700;
    margin: 20px 0 20px;
  }
  
  /* Ocultar inicialmente los títulos con animación tmp-title-split */
  .tmp-section-title-border .title.tmp-title-split,
  .tmp-section-title-border h2.tmp-title-split,
  .tmp-section-title-border h1.tmp-title-split {
    opacity: 0;
  }
  
  @media only screen and (max-width: 991px) {
    .tmp-section-title-border .title h2,
    .tmp-section-title-border h2.title {
      font-size: 36px;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-section-title-border .title h2,
    .tmp-section-title-border h2.title {
      font-size: 28px;
    }
  }
  
  /* ============================================
     Estilos de Line Separator (pres-line-separator-wrapper)
     ============================================ */
  
  .line-separator {
    position: relative;
    background-image: linear-gradient(90deg, var(--primary_color), rgba(33, 38, 45, 0));
    width: 50px;
    height: 1px;
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: auto;
  }
  
  .pres-line-separator-wrapper {
    display: flex;
    position: relative;
    align-items: center;
    margin: 0 -15px;
    justify-content: center;
  }
  
  @media only screen and (max-width: 767px) {
    .pres-line-separator-wrapper {
      flex-wrap: wrap;
      justify-content: center;
    }
    
    .pres-line-separator-wrapper .line-separator {
      display: none;
    }
  }
  
  .pres-line-separator-wrapper.text-center .line-separator.line-left {
    background-image: linear-gradient(-90deg, var(--primary_color), rgba(33, 38, 45, 0));
  }
  
  .pres-line-separator-wrapper.text-center .line-separator.line-right {
    background-image: linear-gradient(90deg, var(--primary_color), rgba(33, 38, 45, 0));
  }
  
  /* ============================================
     Estilos de Servicios (service__style--1)
     ============================================ */
  
  .service.service__style--1 {
    padding: 30px 26px;
    transition: transform 0.65s cubic-bezier(0.05, 0.2, 0.1, 1), box-shadow 0.65s cubic-bezier(0.05, 0.2, 0.1, 1);
    position: relative;
    z-index: 2;
    height: 100%;
  }
  
  @media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .service.service__style--1 {
      padding: 30px 28px;
    }
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .service.service__style--1 {
      padding: 30px 25px;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .service.service__style--1 {
      padding: 30px 14px;
    }
  }
  
  .service.service__style--1 .shape-service-1 {
    position: absolute;
    right: 15px;
    top: 15px;
    z-index: 1;
    max-width: 150px;
    margin: auto;
    opacity: 0;
    display: none;
  }
  
  .service.service__style--1:hover .shape-service-1 {
    display: block;
    opacity: 0.3;
  }
  
  .service.service__style--1:hover .shape-service-1 img {
    animation: moveOut 0.4s linear;
  }
  
  .service.service__style--1 .icon {
    font-size: 45px;
    font-weight: 400;
    margin-bottom: 23px;
    color: var(--primary_color);
    text-align: center;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    transition: 0.3s;
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .service.service__style--1 .icon {
      margin-bottom: 11px;
    }
  }
  
  .service.service__style--1 .icon i {
    stroke-width: 1 !important;
    font-size: 60px;
  }
  
  .service.service__style--1 .icon svg {
    stroke-width: 2px !important;
    width: 45px;
    height: 45px;
  }
  
  .service.service__style--1 .icon img {
    max-height: 60px;
  }
  
  .service.service__style--1 .content .title {
    margin-bottom: 19px;
    transition: 0.3s;
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .service.service__style--1 .content .title {
      margin-bottom: 8px;
    }
  }
  
  .service.service__style--1 .content .title {
    color: #1b1b1c;
    font-family: var(--primary_font);
    word-break: break-word;
    line-height: 1.4074;
    margin: 0 0 19px;
  }
  
  .service.service__style--1 .content .title h4,
  .service.service__style--1 .content h4.title {
    font-size: 24px;
    line-height: 1.25;
    font-weight: 600;
  }
  
  @media only screen and (max-width: 991px) {
    .service.service__style--1 .content .title h4,
    .service.service__style--1 .content h4.title {
      font-size: 20px;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .service.service__style--1 .content .title h4,
    .service.service__style--1 .content h4.title {
      font-size: 20px;
    }
  }
  
  .service.service__style--1 .content .title a {
    color: inherit;
    transition: 0.3s;
  }
  
  .service.service__style--1 .content .title a:hover {
    color: var(--primary_color);
  }
  
  .service.service__style--1 .content .description {
    color: #363636;
    margin-bottom: 0;
    transition: 0.3s;
    font-size: 16px;
    line-height: 1.7;
    font-weight: 400;
  }
  
  .service.service__style--1 .content .discover-btn {
    text-align: center;
    display: flex;
    justify-content: center;
  }
  
  .service.service__style--1:hover {
    transform: translateY(-5px);
  }
  
  .service.service__style--1.tmp-border-none {
    border: none;
  }
  
  .service.service__style--1.tmp-border {
    border: 2px solid rgba(157, 157, 255, 0.05);
  }
  
  @media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .service.service__style--1.text-left,
    .service.service__style--1.text-start {
      padding: 40px 30px;
    }
  }
  
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .service.service__style--1.text-left,
    .service.service__style--1.text-start {
      padding: 40px 30px;
    }
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .service.service__style--1.text-left,
    .service.service__style--1.text-start {
      padding: 40px 30px;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .service.service__style--1.text-left,
    .service.service__style--1.text-start {
      padding: 30px 20px;
    }
  }
  
  .service.service__style--1.text-left .icon,
  .service.service__style--1.text-start .icon {
    justify-content: left;
  }
  
  .service.service__style--1.text-left .content .discover-btn,
  .service.service__style--1.text-start .content .discover-btn {
    justify-content: flex-start;
  }
  
  /* Cards con fondo oscuro (bg-color-card) */
  .service.service__style--1.bg-color-card {
   
    border-radius: var(--general_border_radius);
  }
  
  .service.service__style--1.bg-color-card .content .title,
  .service.service__style--1.bg-color-card .content .title a {
    color: var(--primary_color_font);
  }
  
  .service.service__style--1.bg-color-card .content .title a:hover {
    color: var(--primary_color);
  }
  
  .service.service__style--1.bg-color-card .content .description {
    color: var(--secondary_color_font);
  }
  
  /* ============================================
     Estilos tmponhover (efecto flashlight)
     ============================================ */
  
  .tmponhover {
    position: relative;
    overflow: hidden;
  }
  
  .tmponhover::before {
    content: "";
    position: absolute;
    top: var(--y);
    left: var(--x);
    transform: translate(-50%, -50%);
    background: radial-gradient(var(--primary_color), transparent, transparent);
    width: 200%;
    height: 200%;
    opacity: 0;
    transition: 0.5s, top 0s, left 0s;
    border-radius: var(--general_border_radius);
    z-index: 1;
  }
  
  .tmponhover:hover::before {
    opacity: 1;
  }
  
  .tmponhover::after {
    content: "";
    position: absolute;
    inset: 2px;
    background: #ffffff;
    border-radius: var(--general_border_radius);
    z-index: 1;
  }
  
  .tmponhover > * {
    z-index: 2;
    position: relative;
  }
  
  /* ============================================
     Estilos de Botones (.tmp-btn)
     ============================================ */
  
  .tmp-btn,
  .btn-default {
    padding: 0 28px;
    border-radius: 5px;
    background: var(--primary_color);
    transition-duration: 300ms;
    color: #ffffff;
    font-family: var(--primary_font);
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    text-decoration: none;
    display: flex;
    height: 50px;
    line-height: 49px;
    letter-spacing: 0.5px;
    width: max-content;
    transition: all 0.6s;
    border: 0 none;
    position: relative;
    z-index: 1;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-btn,
    .btn-default {
      padding: 0 16px;
      height: 42px;
      line-height: 42px;
    }
  }
  
  .tmp-btn::after,
  .btn-default::after {
    position: absolute;
    content: "";
    width: 200%;
    height: 200%;
    left: 50%;
    top: 110%;
    background: var(--primary_color);
    transform: translateX(-50%);
    transition: all 0.6s;
    transition-duration: 800ms;
    opacity: 0.5;
    border-radius: 50%;
    z-index: -1;
  }
  
  .tmp-btn:hover,
  .btn-default:hover {
    background-color: transparent;
    color: #ffffff;
    transform: translate3d(0, -2px, 0);
    box-shadow: 0 0 20px 5px rgba(82, 55, 249, 0.33);
  }
  
  .tmp-btn:hover::after,
  .btn-default:hover::after {
    opacity: 1;
    top: -30%;
  }
  
  .tmp-btn i,
  .btn-default i {
    padding-left: 6px;
    display: inline-block;
    top: 2px;
    position: relative;
    font-size: 17px;
  }
  
  .tmp-btn i.image-icon,
  .btn-default i.image-icon {
    top: inherit;
    transition: 0.4s;
  }
  
  .tmp-btn .btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  
  .tmp-btn .btn-icon i {
    padding-left: 6px;
    padding-right: 0;
    top: 0;
    font-size: 17px;
    display: inline-block;
  }
  
  .tmp-btn.btn-small,
  .btn-default.btn-small {
    height: 44px;
    line-height: 40px;
    padding: 0 20px;
    font-size: 14px;
    font-weight: 500;
  }
  
  .tmp-btn.btn-border,
  .btn-default.btn-border {
    background: transparent;
    border-color: #e3e3e3;
    border-width: 2px;
    border-style: solid;
    color: #1b1b1b;
  }
  
  .tmp-btn.btn-border.btn-small,
  .btn-default.btn-border.btn-small {
    line-height: 36px;
  }
  
  .tmp-btn.btn-border:hover,
  .btn-default.btn-border:hover {
    background-color: var(--primary_color);
    border-color: var(--primary_color) !important;
    color: #ffffff;
  }
  
  .tmp-btn.round,
  .btn-default.round {
    border-radius: var(--general_border_radius);
  }
  
  .tmp-btn:focus,
  .btn-default:focus {
    box-shadow: none;
    border: none;
    background-color: unset;
    background: var(--primary_color);
  }
  
  /* Botón hover-icon-reverse */
  .tmp-btn.hover-icon-reverse .icon-reverse-wrapper,
  .btn-default.hover-icon-reverse .icon-reverse-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .tmp-btn.hover-icon-reverse .btn-text,
  .btn-default.hover-icon-reverse .btn-text {
    display: inline-block;
    transition: transform 0.6s 0.125s cubic-bezier(0.1, 0.75, 0.25, 1);
    margin-inline-start: -23px;
  }
  
  .tmp-btn.hover-icon-reverse .btn-icon,
  .btn-default.hover-icon-reverse .btn-icon {
    
    transition: opacity 0.4s 0.25s, transform 0.6s 0.25s;
    transition-timing-function: cubic-bezier(0.1, 0.75, 0.25, 1);
  }
  
  .tmp-btn.hover-icon-reverse .btn-icon + .btn-icon,
  .btn-default.hover-icon-reverse .btn-icon + .btn-icon {
    margin-inline-end: 0;
    margin-inline-start: 0;
    display: inline-block;
    opacity: 0;
    transform: translateX(-10px);
    transition-delay: 0s;
    order: -2;
    line-height: 1;
  }
  
  .tmp-btn.hover-icon-reverse .btn-icon + .btn-icon i,
  .btn-default.hover-icon-reverse .btn-icon + .btn-icon i {
    padding-left: 0;
    padding-right: 6px;
  }
  
  .tmp-btn:hover.hover-icon-reverse .btn-text,
  .btn-default:hover.hover-icon-reverse .btn-text {
    transition-delay: 0.1s;
    transform: translateX(23px);
  }
  
  .tmp-btn:hover.hover-icon-reverse .btn-icon,
  .btn-default:hover.hover-icon-reverse .btn-icon {
    opacity: 0;
    transition-delay: 0s;
    transform: translateX(10px);
  }
  
  .tmp-btn:hover.hover-icon-reverse .btn-icon + .btn-icon,
  .btn-default:hover.hover-icon-reverse .btn-icon + .btn-icon {
    opacity: 1;
    transform: translateX(0);
    transition-delay: 0.225s;
    line-height: 1;
  }
  
  /* ============================================
     Utilidades
     ============================================ */
  
  .radius {
    border-radius: var(--general_border_radius);
  }
  
  .text-center {
    text-align: center;
  }
  
  .text-start {
    text-align: left;
  }
  
  .w-600 {
    font-weight: 600 !important;
  }
  
  .w-700 {
    font-weight: 700 !important;
  }
  
  .mb--0 {
    margin-bottom: 0 !important;
  }
  
  .mb--10 {
    margin-bottom: 10px !important;
  }
  
  .mt--10 {
    margin-top: 10px !important;
  }
  
  .mt--30 {
    margin-top: 30px !important;
  }
}

/* ============================================
   Keyframes (fuera del scope para que funcionen)
   ============================================ */

@keyframes moveOut {
  0% {
    -webkit-clip-path: polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%);
    clip-path: polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%);
  }
  100% {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
}

/* ============================================
   Widget About Services - Estilos Scoped
   Todos los estilos están scoped bajo .about-services-widget
   ============================================ */

.about-services-widget {
  /* ============================================
     Estilos base de tipografía
     ============================================ */
  font-size: 16px;
  line-height: 1.7;
  font-family: var(--primary_font);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  
  a {
    text-decoration: none;
    transition: 0.3s;
  }
  
  img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
  }

  /* Section wrapper - padding consistente (contenido central) */
  > .tmp-about-area {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    > .tmp-about-area {
      padding-top: 80px !important;
      padding-bottom: 80px !important;
    }
  }
  @media only screen and (max-width: 767px) {
    > .tmp-about-area {
      padding-top: 60px !important;
      padding-bottom: 60px !important;
    }
  }

  /* ============================================
     Section Gap Bottom
     ============================================ */
  .tmp-section-gapBottom {
    padding-bottom: 120px !important;
    
    @media only screen and (min-width: 768px) and (max-width: 991px) {
      padding-bottom: 80px !important;
    }
    
    @media only screen and (max-width: 767px) {
      padding-bottom: 60px !important;
    }
  }

  /* ============================================
     Video Popup
     ============================================ */
  .video-popup {
    position: relative;
    display: block;
    
    &.about-relative-thumb {
      position: relative;
    }
    
    .thumbnail {
      img {
        width: 100%;
      }
      
      &.invers-anime {
        position: relative;
        overflow: hidden;
        
        &::after {
          content: "";
          position: absolute;
          width: 200%;
          height: 0%;
          left: 50%;
          top: 50%;
          background-color: rgba(255, 255, 255, 0.3);
          transform: translate(-50%, -50%) rotate(45deg);
          z-index: 1;
          pointer-events: none;
        }
        
        &:hover::after {
          height: 250%;
          transition: all 600ms linear;
          background-color: transparent;
        }
      }
    }
    
    .video-icon {
      position: absolute;
      content: "";
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      margin-top: 10px;
      transition: 0.4s;
    }
    
    &.icon-center {
      .video-icon {
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
      }
    }
  }

  .overlay-content {
    position: relative;
  }

  /* ============================================
     Absolute Rating Area
     ============================================ */
  .absolute-rating-area {
    position: absolute;
    padding: 20px 32px;
    background: #fefefe;
    border-radius: 6px;
    bottom: 9%;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    
    img {
      margin-bottom: 15px;
    }
    
    .stars-area {
      display: flex;
      align-items: center;
      gap: 7px;
      margin-bottom: 10px;
      
      img {
        max-width: 20px;
        margin-bottom: 0;
      }
    }
    
    p {
      font-size: 18px;
      color: var(--primary_color_font);
      font-weight: 500;
      margin-bottom: 0;
    }
  }
  
  /* ============================================
     Profile Share mb-0 utility
     ============================================ */
  .profile-share.mb-0 {
    margin-bottom: 0;
  }

  .about-relative-thumb .absolute-rating-area {
    position: absolute;
    left: -10%;
    padding: 20px 32px;
    background: #fefefe;
    border-radius: 6px;
    bottom: 9%;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    right: auto !important;
    border: 1px solid rgba(157, 157, 255, 0.05);
    
    @media only screen and (min-width: 1200px) and (max-width: 1599px) {
      left: 7%;
    }
    
    @media only screen and (max-width: 1199px) {
      left: 15%;
    }
    
    @media only screen and (max-width: 991px) {
      left: 50%;
    }
    
    @media only screen and (max-width: 767px) {
      left: 15%;
    }
    
    @media only screen and (max-width: 575px) {
      padding: 5px 16px;
      bottom: 10px;
    }
    
    img {
      margin-bottom: 15px;
    }
    
    .profile-share a img {
      max-width: 45px;
    }
    
    .stars-area {
      display: flex;
      align-items: center;
      gap: 7px;
      margin-bottom: 10px;
      
      img {
        max-width: 20px;
        margin-bottom: 0;
      }
    }
    
    p {
      font-size: 18px;
      color: var(--primary_color_font);
      font-weight: 500;
      margin-bottom: 0;
    }
    
    &::after {
      position: absolute;
      top: -5%;
      right: -6%;
      content: "";
      height: 100%;
      width: 100%;
      border-radius: 6px;
      z-index: -1;
      background: #1b1b1c;
    }
    
    &::before {
      position: absolute;
      bottom: -5%;
      left: -6%;
      content: "";
      height: 100%;
      width: 100%;
      border-radius: 6px;
      z-index: -1;
      background: #1b1b1c;
    }
  }
  
  /* ============================================
     Images Left Right Float
     ============================================ */
  .images-left-right-float {
    right: -110px !important;
    
    @media only screen and (max-width: 575px) {
      right: -223px !important;
    }
  }

  /* ============================================
     Profile Share
     ============================================ */
  .profile-share {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 15px;
    
    &.justify-content-start {
      justify-content: flex-start;
    }
    
    a {
      position: relative;
      z-index: 1;
      transition: 0.3s;
      
      &:nth-child(2) {
        margin-left: -12px;
      }
      
      &:nth-child(3) {
        margin-left: -12px;
      }
      
      img {
        max-width: 60px;
        border-radius: 50%;
        border: 3px solid rgba(157, 157, 255, 0.05);
        transition: 0.3s;
      }
    }
  }

  .about-relative-thumb .absolute-rating-area .profile-share a img {
    max-width: 45px;
  }

  /* ============================================
     Avatar Tooltip (estilos completos de tooltip.scss)
     ============================================ */
  .profile-share {
    a {
      &:hover {
        z-index: 2;
        transform: translateY(-3px) scale(1.1);
      }
    }
  }

  .avatar {
    position: relative;

    &::after,
    &::before {
      --scale: 0;
      --arrow-size: 8px;
      position: absolute;
      top: -5px;
      left: 50%;
      transform: translateX(-50%) translateY(var(--translate-y, 0)) scale(var(--scale));
      transition: 150ms transform;
      transform-origin: bottom center;
    }

    &::before {
      --translate-y: calc(-100% - var(--arrow-size));
      content: attr(data-tooltip);
      color: #fff;
      padding: 5px 8px;
      background: var(--primary_color);
      width: max-content;
      border-radius: 5px;
      text-align: center;
      font-size: 12px;
      margin: 1px;
    }

    &::after {
      --translate-y: calc(-1 * var(--arrow-size));
      content: '';
      border: var(--arrow-size) solid transparent;
      border-top-color: var(--primary_color);
    }

    &:hover {
      &::before,
      &::after {
        --scale: 1;
      }
    }
  }

  /* ============================================
     Section Title Border
     ============================================ */
  .tmp-section-title-border {
    .subtitle {
      display: flex;
      color: var(--secondary_color_font);
      font-size: 13px;
      margin: 0;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      align-items: center;
      padding: 0 15px;
      
      @media only screen and (max-width: 767px) {
        flex-wrap: wrap;
        justify-content: center;
      }
      
      .subtitle-text {
        color: var(--secondary_color_font);
        font-weight: 700;
        width: max-content;
      }
      
      .number {
        color: var(--secondary_color_font);
        transition: 0.5s;
        opacity: 0.6;
        display: none;
      }
    }
  }

  /* ============================================
     Pres Line Separator Wrapper
     ============================================ */
  .pres-line-separator-wrapper {
    display: flex;
    position: relative;
    align-items: center;
    margin: 0 -15px;
    justify-content: center;
    
    @media only screen and (max-width: 767px) {
      flex-wrap: wrap;
      justify-content: center;
    }
    
    &.text-start {
      justify-content: flex-start !important;
    }
    
    .line-separator {
      position: relative;
      background-image: linear-gradient(90deg, var(--primary_color), rgba(33, 38, 45, 0));
      width: 50px;
      height: 1px;
      
      @media only screen and (max-width: 767px) {
        display: none;
      }
    }
  }

  /* ============================================
     About Style 4
     ============================================ */
  .about-style-4 {
    .title {
      font-weight: 400;
      margin-bottom: 35px;
      color: var(--primary_color_font);
      font-family: var(--primary_font);
      
      @media only screen and (min-width: 1200px) and (max-width: 1599px) {
        font-size: 26px;
      }
      
      @media only screen and (max-width: 1199px) {
        font-size: 26px;
      }
      
      @media only screen and (max-width: 991px) {
        margin-bottom: 15px;
      }
      
      @media only screen and (max-width: 575px) {
        font-size: 26px;
        margin-bottom: 15px;
      }
      
      @media only screen and (max-width: 479px) {
        font-size: 26px;
      }
      
      strong {
        color: var(--primary_color);
      }
    }
    
    .feature-list {
      padding: 0;
      list-style: none;
      
      @media only screen and (max-width: 1199px) {
        margin-bottom: 15px;
      }
      
      li {
        display: flex;
        
        .icon {
          background: var(--primary_color);
          width: 30px;
          height: 30px;
          border-radius: 100%;
          color: #fff;
          text-align: center;
          min-width: 30px;
          
          i {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100%;
          }
        }
        
        .title-wrapper {
          margin-left: 13px;
          
          .title {
            font-size: 18px;
            margin: 0;
            color: var(--primary_color_font);
            font-family: var(--primary_font);
          }
          
          .text {
            font-size: 16px;
            margin-bottom: 20px;
            max-width: 80%;
            margin-top: 13px;
            color: var(--secondary_color_font);
            
            @media only screen and (max-width: 1199px) {
              max-width: 100%;
            }
            
            @media only screen and (max-width: 575px) {
              max-width: 100%;
            }
          }
        }
      }
    }
  }

  /* ============================================
     Tmp Button
     ============================================ */
  .tmp-btn {
    padding: 0 28px;
    border-radius: 5px;
    background: var(--primary_color);
    transition-duration: 300ms;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    text-decoration: none;
    display: flex;
    height: 50px;
    line-height: 49px;
    letter-spacing: 0.5px;
    width: max-content;
    transition: 0.4s;
    border: 0 none;
    position: relative;
    z-index: 1;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    font-family: var(--primary_font);
    
    @media only screen and (max-width: 767px) {
      padding: 0 16px;
      height: 42px;
      line-height: 42px;
    }

    &.btn-large {
      height: 60px;
      line-height: 59px;
      padding: 0 37px;
      font-size: 17px;
      
      @media only screen and (max-width: 767px) {
        padding: 0 18px;
        font-size: 14px;
      }
    }

    &.round {
      border-radius: var(--general_border_radius);
    }

    &.btn-border {
      background: transparent;
      border-color: rgba(157, 157, 255, 0.05);
      border-width: 2px;
      border-style: solid;
      color: var(--primary_color_font);
      
      &:hover {
        background-color: var(--primary_color);
        border-color: var(--primary_color) !important;
        color: #fff;
      }
    }

    &.rounded-player {
      border-radius: 100%;
      width: 100px;
      height: 100px;
      padding: 0;
      line-height: 100px;
      display: inline-block;
      position: relative;
      
      @media only screen and (max-width: 767px) {
        width: 70px;
        height: 70px;
        line-height: 70px;
      }

      span {
        display: inline-block;
        
        i {
          display: inline-block;
          position: absolute;
          left: 50%;
          top: 50% !important;
          transform: translate(-50%, -50%);
          font-size: 30px;
          padding-left: 0;
        }
      }

      &:focus {
        outline: none;
        color: #fff;
      }

      &:hover {
        transform: scale(1.1);
        background: var(--primary_color);
      }
    }
    
    &:hover {
      background-color: var(--secondary_color);
      color: #fff;
      transform: translate3d(0, -2px, 0);
    }
  }

  /* ============================================
     Radius Small
     ============================================ */
  .radius-small {
    border-radius: var(--general_border_radius);
  }

  /* ============================================
     Font Weight 700
     ============================================ */
  .w-700 {
    font-weight: 700 !important;
  }

  /* ============================================
     Tmp Title Split (inicialmente oculto)
     ============================================ */
  .tmp-title-split {
    opacity: 0;
    visibility: hidden;
  }

  .tmp-title-split-p {
    opacity: 0;
    visibility: hidden;
  }

  /* ============================================
     Margin Utilities
     ============================================ */
  .mb--10 {
    margin-bottom: 10px;
  }

  .mb--30 {
    margin-bottom: 30px;
  }

  .mt--40 {
    margin-top: 40px;
  }

  .text-start {
    text-align: left;
  }

  .read-more-btn {
    margin-top: 40px;
  }
}

/* Keyframes DEBEN estar fuera del scope */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}


/* Video One Widget Styles - Scoped under .video-wrapper */
.video-wrapper {
  overflow: hidden;
}

@keyframes ripple {
  70% {
    box-shadow: 0 0 0 40px rgba(255, 255, 255, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}

@keyframes swing-x {
  0% {
    transform: rotate(25deg);
  }
  100% {
    transform: rotate(0deg);
  }
}

.video-wrapper a {
  text-decoration: none;
}

.video-wrapper .video-one {
  position: relative;
  display: block;
  overflow: hidden;
  background-color: var(--primary_color);
  z-index: 1;
}

.video-wrapper .video-one__inner {
  position: relative;
  display: block;
  text-align: center;
  padding: 120px 0 120px;
}

.video-wrapper .video-one__bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: .30;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  z-index: -1;
}

.video-wrapper .video-one__video-link {
  position: relative;
  display: block;
}

.video-wrapper .video-one__video-icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 70px;
  line-height: 70px;
  text-align: center;
  font-size: 20px;
  color: var(--primary_color);
  background-color: rgba(255, 255, 255, 1);
  border-radius: 50%;
  transition: all 0.5s ease;
  margin: 0 auto;
  z-index: 1;
}

.video-wrapper .video-one__video-icon:hover {
  background-color: var(--primary_color);
  color: rgba(255, 255, 255, 1);
}

.video-wrapper .video-one__video-icon:before {
  content: "";
  position: absolute;
  top: -5px;
  left: -5px;
  right: -5px;
  bottom: -5px;
  border: 5px solid rgba(255, 255, 255, 0.30);
  border-radius: 50%;
  z-index: -1;
}

.video-wrapper .video-one__video-link .ripple,
.video-wrapper .video-one__video-icon .ripple:before,
.video-wrapper .video-one__video-icon .ripple:after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
  animation: ripple 3s infinite;
}

.video-wrapper .video-one__video-icon .ripple:before {
  animation-delay: 0.9s;
  content: "";
  position: absolute;
}

.video-wrapper .video-one__video-icon .ripple:after {
  animation-delay: 0.6s;
  content: "";
  position: absolute;
}

.video-wrapper .video-one__title {
  font-size: 40px;
  color: rgba(255, 255, 255, 1);
  line-height: 1.25em;
  font-weight: 700;
  text-transform: capitalize;
  margin: 40px 0 25px;
}

.video-wrapper .video-one__btn-box {
  position: relative;
  display: inline-block;
}

.video-wrapper .video-one__btn-box .thm-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  vertical-align: middle;
  outline: none !important;
  background-color: var(--primary_color);
  color: rgba(255, 255, 255, 1);
  font-size: 17px;
  line-height: 17px;
  font-weight: 600;
  padding: 5px 30px 5px;
  padding-right: 8px;
  overflow: hidden;
  border-radius: 30px;
  transition: all 0.5s linear;
  text-transform: capitalize;
  z-index: 1;
}

.video-wrapper .video-one__btn-box .thm-btn>span {
  position: relative;
  font-size: 18px;
  height: 44px;
  width: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--primary_color_font);
  border-radius: 50%;
  color: rgba(255, 255, 255, 1);
  transition: all 0.5s linear;
}

.video-wrapper .video-one__btn-box .thm-btn:hover>span {
  background-color: rgba(255, 255, 255, 1);
  color: var(--primary_color);
}

.video-wrapper .video-one__btn-box .thm-btn::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 50%;
  height: 0;
  visibility: hidden;
  background-color: rgba(255, 255, 255, 1);
  opacity: 0;
  z-index: -1;
  transition: all 0.4s ease-in-out;
}

.video-wrapper .video-one__btn-box .thm-btn:hover:before {
  width: 100%;
  height: 100%;
  visibility: visible;
  opacity: 1;
}

.video-wrapper .video-one__btn-box .thm-btn::after {
  position: absolute;
  background-color: rgba(255, 255, 255, 1);
  bottom: 0;
  right: 0;
  content: "";
  width: 50%;
  height: 0;
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: all 0.4s ease-in-out;
}

.video-wrapper .video-one__btn-box .thm-btn:hover::after {
  width: 100%;
  height: 100%;
  visibility: visible;
  opacity: 1;
}

.video-wrapper .video-one__btn-box .thm-btn:hover {
  color: var(--primary_color);
}

.video-wrapper .video-one__shape-1 {
  position: absolute;
  right: -90px;
  bottom: -50px;
  animation: swing-x 1s ease-in-out 1s forwards infinite alternate;
}

.video-wrapper .video-one__shape-1 img {
  width: auto;
}

/* Responsive Styles */
@media only screen and (max-width: 767px) {
  .video-wrapper .video-one__title br {
    display: none;
  }

  .video-wrapper .video-one__title {
    font-size: 35px;
  }

  .video-wrapper .video-one__shape-1 {
    display: none;
  }

  .video-wrapper .video-one__inner {
    padding: 80px 0 80px;
  }
}


/* Counter One Widget Styles - Scoped under .counter-wrapper */
.counter-wrapper {
  font-family: var(--primary_font);
  overflow: hidden;
}

.counter-wrapper a {
  text-decoration: none;
}

/* Counter One Base Styles */
.counter-wrapper .counter-one {
  position: relative;
  display: block;
  padding: 120px 0 90px;
  background: linear-gradient(0deg, rgba(131, 58, 180, 0) 0%, rgba(217, 2, 2, 0.07) 50%, rgba(252, 176, 69, 0) 100%);
  z-index: 1;
}

.counter-wrapper .counter-one__single {
  position: relative;
  display: block;
  text-align: center;
  margin-bottom: 30px;
}

.counter-wrapper .counter-one__icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 80px;
  width: 80px;
  margin: 0 auto;
  background-color: var(--primary_color);
  border-radius: 50%;
  transition: all 500ms ease;
  z-index: 5;
}

.counter-wrapper .counter-one__single:hover .counter-one__icon {
  background-color: var(--primary_color_font);
}

.counter-wrapper .counter-one__icon:before {
  content: "";
  position: absolute;
  top: -8px;
  left: -8px;
  right: -8px;
  bottom: -8px;
  background-color: rgba(217, 2, 2, 0.30);
  border-radius: 50%;
  transition: all 500ms ease;
  z-index: -1;
}

.counter-wrapper .counter-one__single:hover .counter-one__icon:before {
  background-color: rgba(17, 17, 17, 0.30);
}

.counter-wrapper .counter-one__icon span {
  position: relative;
  display: inline-block;
  font-size: 48px;
  color: #ffffff;
  transition: all 500ms linear;
  transition-delay: 0.1s;
  transform: scale(1);
}

.counter-wrapper .counter-one__single:hover .counter-one__icon span {
  transform: scale(0.9);
  color: #ffffff;
}

.counter-wrapper .counter-one__content {
  position: relative;
  display: block;
  background-color: #ffffff;
  padding: 68px 30px 36px;
  border-radius: var(--general_border_radius);
  box-shadow: 0px 0px 60px 0px rgba(4, 23, 26, 0.10);
  margin-top: -40px;
  z-index: 1;
}

.counter-wrapper .counter-one__content::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--primary_color);
  border-radius: 15px;
  transform: scaleX(0.7) rotateX(20deg);
  opacity: 0;
  transition: all 0.4s linear;
  z-index: -1;
}

.counter-wrapper .counter-one__single:hover .counter-one__content::before {
  transform: scaleX(1.0) rotateX(0deg);
  transition: all 0.4s linear;
  opacity: 1;
}

.counter-wrapper .counter-one__count {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.counter-wrapper .counter-one__count h3 {
  font-size: 60px;
  font-weight: 700;
  line-height: 60px !important;
  color: var(--primary_color);
  font-family: var(--primary_font) !important;
  transition: all 500ms ease;
}

.counter-wrapper .counter-one__single:hover .counter-one__count h3 {
  color: #ffffff;
}

.counter-wrapper .counter-one__count span {
  font-size: 60px;
  font-weight: 700;
  line-height: 60px;
  color: var(--primary_color);
  transition: all 500ms ease;
}

.counter-wrapper .counter-one__single:hover .counter-one__count span {
  color: #ffffff;
}

.counter-wrapper .counter-one__count-text {
  font-size: 18px;
  color: var(--primary_color_font);
  font-weight: 600;
  line-height: 28px;
  margin-top: 3px;
  transition: all 500ms ease;
}

.counter-wrapper .counter-one__single:hover .counter-one__count-text {
  color: #ffffff;
}

/* Responsive Styles */
@media only screen and (max-width: 767px) {
  .counter-wrapper .counter-one {
    padding: 80px 0 50px;
  }
}


/* About Three Widget Styles - Scoped under .about-wrapper */
.about-wrapper {
  font-family: var(--primary_font);
  overflow: hidden;
}

.about-wrapper a {
  text-decoration: none;
}

/* Keyframes */
@keyframes ripple {
  70% {
    box-shadow: 0 0 0 40px rgba(217, 2, 2, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(217, 2, 2, 0);
  }
}

@keyframes topBottom {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(10px);
  }
  100% {
    transform: translateY(0px);
  }
}

@keyframes ImgBounce {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
}

/* Section Title Styles */
.about-wrapper .section-title {
  position: relative;
  display: block;
  margin-top: -13px;
  margin-bottom: 48px;
  z-index: 1;
}

.about-wrapper .section-title__tagline-box {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 12px;
}

.about-wrapper .section-title__tagline {
  position: relative;
  display: block;
  color: var(--primary_color);
  text-transform: uppercase;
  font-weight: 700;
  font-size: 14px;
  line-height: 14px;
  letter-spacing: 1.5px;
}

.about-wrapper .section-title__tagline-border {
  position: relative;
  display: block;
  width: 40px;
  height: 1px;
  border: 1px solid var(--primary_color);
}

.about-wrapper .section-title__shape-1 {
  position: absolute;
  right: -1px;
  top: -4px;
}

.about-wrapper .section-title__shape-1 > .section-title__circle {
  position: relative;
  display: block;
  height: 8px;
  width: 8px;
  border-radius: 50%;
  background-color: var(--primary_color);
}

.about-wrapper .section-title__shape-2 {
  position: absolute;
  left: -1px;
  top: -4px;
}

.about-wrapper .section-title__shape-2 > .section-title__circle {
  position: relative;
  display: block;
  height: 8px;
  width: 8px;
  border-radius: 50%;
  background-color: var(--primary_color);
}

.about-wrapper .section-title__title {
  font-size: 45px;
  line-height: 1.2em;
  font-weight: 700;
  text-transform: capitalize;
}

.about-wrapper .section-title__title span {
  color: var(--primary_color);
}

.about-wrapper .about-three__right .section-title {
  margin-bottom: 20px;
}

/* Thm Btn Styles */
.about-wrapper .thm-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  vertical-align: middle;
  -webkit-appearance: none;
  outline: none !important;
  background-color: var(--primary_color);
  color: #ffffff;
  font-size: 17px;
  line-height: 17px;
  font-weight: 600;
  padding: 5px 30px 5px;
  padding-right: 8px;
  overflow: hidden;
  border-radius: 30px;
  transition: all 0.5s linear;
  text-transform: capitalize;
  z-index: 1;
}

.about-wrapper .thm-btn>span {
  position: relative;
  font-size: 18px;
  height: 44px;
  width: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--primary_color_font);
  border-radius: 50%;
  color: #ffffff;
  transition: all 0.5s linear;
}

.about-wrapper .thm-btn:hover>span {
  background-color: #ffffff;
  color: var(--primary_color);
}

.about-wrapper .thm-btn::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 50%;
  height: 0;
  visibility: hidden;
  background-color: var(--primary_color_font);
  opacity: 0;
  z-index: -1;
  transition: all 0.4s ease-in-out;
}

.about-wrapper .thm-btn:hover:before {
  width: 100%;
  height: 100%;
  visibility: visible;
  opacity: 1;
}

.about-wrapper .thm-btn::after {
  position: absolute;
  background-color: var(--primary_color_font);
  bottom: 0;
  right: 0;
  content: "";
  width: 50%;
  height: 0;
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: all 0.4s ease-in-out;
}

.about-wrapper .thm-btn:hover::after {
  width: 100%;
  height: 100%;
  visibility: visible;
  opacity: 1;
}

.about-wrapper .thm-btn:hover {
  color: #ffffff;
}

/* About Three Styles */
.about-wrapper .about-three {
  position: relative;
  display: block;
  padding: 120px 0 0px;
  z-index: 1;
}

.about-wrapper .about-three__shape-1 {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -1;
}

.about-wrapper .about-three__shape-1 img {
  width: auto;
}

.about-wrapper .about-three__left {
  position: relative;
  display: block;
  margin-left: 100px;
  margin-right: 50px;
}

.about-wrapper .about-three__img-box {
  position: relative;
  display: block;
}

.about-wrapper .about-three__img {
  position: relative;
  display: block;
  z-index: 1;
}

.about-wrapper .about-three__img:before {
  content: "";
  position: absolute;
  top: 0;
  left: -30px;
  width: 20px;
  bottom: 0;
  background-color: var(--primary_color);
  border-radius: var(--general_border_radius);
  animation: topBottom 3s ease-in-out infinite;
  z-index: -1;
}

.about-wrapper .about-three__img:after {
  content: "";
  position: absolute;
  top: 120px;
  left: -60px;
  width: 20px;
  bottom: 0;
  background-color: var(--primary_color);
  border-radius: var(--general_border_radius);
  -webkit-animation: ImgBounce 5s ease-in-out 0s infinite alternate;
  animation: ImgBounce 5s ease-in-out 0s infinite alternate;
  z-index: -1;
}

.about-wrapper .about-three__img img {
  width: 100%;
  border-radius: var(--general_border_radius);
}

.about-wrapper .about-three__img-two {
  position: absolute;
  bottom: -124px;
  left: -100px;
  z-index: 2;
}

.about-wrapper .about-three__img-two:before {
  content: "";
  position: absolute;
  top: -10px;
  left: 0;
  right: -10px;
  bottom: 0;
  background-color: #ffffff;
  border-radius: var(--general_border_radius);
  z-index: -1;
}

.about-wrapper .about-three__img-two img {
  width: auto;
  border-radius: var(--general_border_radius);
}

.about-wrapper .about-three__video-and-experience-box {
  position: absolute;
  bottom: -124px;
  left: 135px;
  right: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 30px;
  background-color: var(--primary_color);
  border-radius: var(--general_border_radius);
  padding: 18px 20px 18px;
  z-index: 3;
}

.about-wrapper .about-three__video-link {
  position: relative;
  display: block;
}

.about-wrapper .about-three__video-icon {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  line-height: 80px;
  text-align: center;
  font-size: 20px;
  color: var(--primary_color_font);
  background-color: #ffffff;
  box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.20);
  border-radius: 50%;
  transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
}

.about-wrapper .about-three__video-icon:hover {
  background-color: var(--primary_color_font);
  color: #ffffff;
}

.about-wrapper .about-three__video-link .ripple,
.about-wrapper .about-three__video-icon .ripple:before,
.about-wrapper .about-three__video-icon .ripple:after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -ms-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
  -o-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
  -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
  box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
  -webkit-animation: ripple 3s infinite;
  animation: ripple 3s infinite;
}

.about-wrapper .about-three__video-icon .ripple:before {
  -webkit-animation-delay: 0.9s;
  animation-delay: 0.9s;
  content: "";
  position: absolute;
}

.about-wrapper .about-three__video-icon .ripple:after {
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
  content: "";
  position: absolute;
}

.about-wrapper .about-three__experience-box {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  z-index: 1;
}

.about-wrapper .about-three__experience-count {
  position: relative;
  display: flex;
  align-items: center;
}

.about-wrapper .about-three__experience-count h3 {
  font-size: 50px;
  color: #ffffff;
  font-weight: 700;
  line-height: 50px !important;
  font-family: var(--primary_font) !important;
}

.about-wrapper .about-three__experience-count span {
  font-size: 50px;
  font-weight: 700;
  line-height: 50px;
  color: #ffffff;
  font-family: var(--primary_font);
}

.about-wrapper .about-three__experience-count-text {
  color: #ffffff;
  font-weight: 500;
  font-size: 16px;
  line-height: 26px;
}

.about-wrapper .about-three__right {
  position: relative;
  display: block;
  margin-right: -70px;
}

.about-wrapper .about-three__text {
  position: relative;
  display: block;
  font-size: 18px;
  line-height: 26px;
  font-weight: 400;
  color: var(--secondary_color_font);
  margin-top: 20px;
  margin-bottom: 0;
}

.about-wrapper .about-three__progress-box-outer {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 60px;
  margin-top: 32px;
  margin-bottom: 37px;
}

.about-wrapper .about-three__progress-single {
  position: relative;
  display: flex;
  align-items: center;
}

.about-wrapper .about-three__progress-box {
  position: relative;
  display: inline-block;
  height: 100px;
}

.about-wrapper .about-three__progress-box canvas {
  transform: rotate(72deg);
}

.about-wrapper .about-three__progress-box .about-three__pack {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  text-align: center;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
}

.about-wrapper .about-three__progress-box .about-three__pack p {
  font-size: 20px;
  font-weight: 700;
  color: var(--primary_color_font);
  line-height: 20px;
}

.about-wrapper .about-three__progress-box .about-three__pack span {
  font-size: 20px;
  font-weight: 700;
  color: var(--primary_color_font);
  line-height: 20px;
}

.about-wrapper .about-three__progress-content {
  margin-left: 25px;
}

.about-wrapper .about-three__progress-content p {
  font-size: 22px;
  color: var(--primary_color_font);
  font-weight: 700;
  line-height: 30px;
}

.about-wrapper .about-three__points-and-founder-box {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.about-wrapper .about-three__point-two {
  position: relative;
  display: block;
  max-width: 315px;
  width: 100%;
}

.about-wrapper .about-three__point-two li {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.about-wrapper .about-three__point-two li+li {
  margin-top: 9px;
}

.about-wrapper .about-three__point-two li .icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 20px;
  width: 20px;
  background-color: var(--primary_color);
  border-radius: 50%;
}

.about-wrapper .about-three__point-two li .icon span {
  position: relative;
  display: inline-block;
  font-size: 10px;
  color: #ffffff;
}

.about-wrapper .about-three__point-two li .text {
  position: relative;
  display: block;
  flex: 1;
}

.about-wrapper .about-three__point-two li .text p {
  font-size: 16px;
  line-height: 26px;
  font-weight: 400;
  color: var(--primary_color_font);
}

.about-wrapper .about-three__author-details {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 15px;
  background-color: var(--secondary_color);
  padding: 20px 30px 20px;
  border-radius: var(--general_border_radius);
}

.about-wrapper .about-three__author-img-box {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 72px;
  width: 72px;
  border: 4px solid var(--primary_color);
  border-radius: 50%;
}

.about-wrapper .about-three__author-img {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 72px;
  width: 72px;
  border-radius: 50%;
  overflow: hidden;
}

.about-wrapper .about-three__author-img img {
  width: 100%;
  border-radius: 50%;
}

.about-wrapper .about-three__author-content {
  position: relative;
  display: block;
  flex: 1;
}

.about-wrapper .about-three__author-content h4 {
  font-size: 20px;
  font-weight: 600;
  line-height: 1em;
  margin-bottom: 6px;
  color: var(--primary_color_font);
}

.about-wrapper .about-three__author-content p {
  font-size: 16px;
  line-height: 26px;
  font-weight: 400;
  color: var(--secondary_color_font);
}

.about-wrapper .about-three__btn-and-review-box {
  position: relative;
  display: flex;
  align-items: center;
  gap: 25px;
  flex-wrap: wrap;
  margin-top: 23px;
}

.about-wrapper .about-three__btn-box {
  position: relative;
  display: block;
}

.about-wrapper .about-three__review-box {
  position: relative;
  display: flex;
  align-items: center;
  gap: 15px;
}

.about-wrapper .about-three__review-list {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.about-wrapper .about-three__review-list li {
  position: relative;
  display: block;
}

.about-wrapper .about-three__review-list li+li {
  margin-left: -15px;
}

.about-wrapper .about-three__review-img {
  position: relative;
  display: block;
  height: 54px;
  width: 54px;
  border-radius: 50%;
  box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.20);
  background-color: #ffffff;
}

.about-wrapper .about-three__review-img img {
  width: 100%;
  border-radius: 50%;
  border: 2px solid #ffffff;
}

.about-wrapper .about-three__review-star-and-text {
  position: relative;
  display: block;
}

.about-wrapper .about-three__review-star {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 10px;
}

.about-wrapper .about-three__review-star span {
  font-size: 15px;
  color: var(--primary_color);
  position: relative;
  display: inline-block;
}

.about-wrapper .about-three__review-text {
  font-weight: 500;
  font-size: 16px;
  line-height: 26px;
  color: var(--secondary_color_font);
}

/* Responsive Styles */
@media only screen and (min-width: 1200px) and (max-width: 1319px) {
  .about-wrapper .about-three__video-and-experience-box {
    gap: 10px;
    padding: 18px 10px 18px;
  }

  .about-wrapper .about-three__experience-count h3 {
    font-size: 30px;
    line-height: 30px !important;
  }

  .about-wrapper .about-three__experience-count span {
    font-size: 30px;
    line-height: 30px;
  }

  .about-wrapper .about-three__video-icon {
    width: 70px;
    height: 70px;
    line-height: 70px;
  }

  .about-wrapper .about-three__video-link .ripple,
  .about-wrapper .about-three__video-icon .ripple:before,
  .about-wrapper .about-three__video-icon .ripple:after {
    width: 70px;
    height: 70px;
  }

  .about-wrapper .about-three__right {
    margin-left: -30px;
  }

  .about-wrapper .about-three__right .section-title__title {
    font-size: 40px;
  }

  .about-wrapper .about-three__shape-1 {
    display: none;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-wrapper .about-three__left {
    max-width: 600px;
    margin: 0 auto 0;
  }

  .about-wrapper .about-three__right {
    max-width: 600px;
    margin: 184px auto 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-wrapper .about-three__left {
    max-width: 600px;
    margin: 0 auto 0;
  }

  .about-wrapper .about-three__right {
    max-width: 600px;
    margin: 184px auto 0;
  }

  .about-wrapper .about-three__shape-1 {
    display: none;
  }
}

@media only screen and (max-width: 767px) {
  .about-wrapper .about-three__left {
    margin-left: 0;
    margin-right: 0;
  }

  .about-wrapper .about-three__img-two {
    position: relative;
    bottom: 0;
    left: 0;
    max-width: 225px;
    margin-top: 20px;
  }

  .about-wrapper .about-three__video-and-experience-box {
    position: relative;
    bottom: 0;
    left: 0;
    right: 0;
    max-width: 300px;
    flex-direction: column;
    align-items: baseline;
    margin-top: 30px;
  }

  .about-wrapper .about-three__right {
    margin-right: 0;
    margin-top: 50px;
  }

  .about-wrapper .about-three__progress-box-outer {
    gap: 30px;
    flex-direction: column;
    align-items: baseline;
  }

  .about-wrapper .about-three__points-and-founder-box {
    flex-direction: column;
    align-items: baseline;
  }

  .about-wrapper .about-three__author-details {
    margin-top: 25px;
  }

  .about-wrapper .about-three__btn-and-review-box {
    flex-direction: column;
    align-items: baseline;
  }

  .about-wrapper .about-three__review-box {
    gap: 10px;
    flex-direction: column;
    align-items: baseline;
  }

  .about-wrapper .about-three__shape-1 {
    display: none;
  }

  .about-wrapper .about-three {
    padding: 80px 0 0px;
  }
}


/* ============================================
   Widget Counter Agency - Estilos Scoped
   Todos los estilos están scoped bajo .counter-agency-widget
   ============================================ */

.counter-agency-widget {
  /* ============================================
     Estilos base de tipografía
     ============================================ */
  font-size: 16px;
  line-height: 1.7;
  font-family: var(--primary_font);
  font-weight: 400;
  color: var(--primary_color_font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
background-color: #f3f3f3;
  a {
    text-decoration: none;
    transition: 0.3s;
    color: var(--primary_color_font);
  }

  img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
  }

  /* Section wrapper - padding consistente (contenido central) */
  > .tmp-counterup-area {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    > .tmp-counterup-area {
      padding-top: 80px !important;
      padding-bottom: 80px !important;
    }
  }
  @media only screen and (max-width: 767px) {
    > .tmp-counterup-area {
      padding-top: 60px !important;
      padding-bottom: 60px !important;
    }
  }

  /* ============================================
     Section Gap Top
     ============================================ */
  .tmp-section-gapTop {
    padding-top: 120px !important;

    @media only screen and (min-width: 768px) and (max-width: 991px) {
      padding-top: 80px !important;
    }

    @media only screen and (max-width: 767px) {
      padding-top: 60px !important;
    }
  }

  /* ============================================
     Tmp Counterup Area
     ============================================ */
  .tmp-counterup-area {
    position: relative;
  }

  /* ============================================
     Tmp Section Title Border
     ============================================ */
  .tmp-section-title-border {
    .subtitle {
      display: flex;
      color: var(--primary_color_font);
      font-size: 13px;
      margin: 0;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      align-items: center;
      padding: 0 15px;

      @media only screen and (max-width: 767px) {
        flex-wrap: wrap;
        justify-content: center;
      }

      .subtitle-text {
        color: var(--primary_color_font);
        font-weight: 700;
        width: max-content;
      }

      .number {
        color: var(--primary_color_font);
        transition: 0.5s;
        opacity: 0.6;
        display: inline-block;
        margin-right: 5px;
      }
    }

    .title {
      font-size: 48px;
      font-weight: 700;
      margin-bottom: 0;
      color: var(--primary_color_font);

      @media only screen and (min-width: 992px) and (max-width: 1199px) {
        font-size: 42px;
      }

      @media only screen and (min-width: 768px) and (max-width: 991px) {
        font-size: 38px;
      }

      @media only screen and (max-width: 767px) {
        font-size: 32px;
      }
    }
  }

  /* ============================================
     Pres Line Separator Wrapper
     ============================================ */
  .pres-line-separator-wrapper {
    display: flex;
    position: relative;
    align-items: center;
    margin: 0 -15px;
    justify-content: center;

    @media only screen and (max-width: 767px) {
      flex-wrap: wrap;
      justify-content: center;
    }

    &.text-center {
      justify-content: center;

      .line-separator.line-left {
        background-image: linear-gradient(-90deg, var(--primary_color), rgba(33, 38, 45, 0));
      }

      .line-separator.line-right {
        background-image: linear-gradient(90deg, var(--primary_color), rgba(33, 38, 45, 0));
      }
    }

    .line-separator {
      position: relative;
      background-image: linear-gradient(90deg, var(--primary_color), rgba(33, 38, 45, 0));
      width: 50px;
      height: 1px;

      @media only screen and (max-width: 767px) {
        display: none;
      }
    }
  }

  /* ============================================
     Single Fun Facts One
     ============================================ */
  .signle-fun-facts-one {
    text-align: center;
    background: #fefefe;
    padding: 30px;
    border-radius: 6px;
    position: relative;

    .icon {
      height: 92px;
      width: 92px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: auto;
      border-radius: 50%;
      margin-bottom: 20px;
      background: var(--primary_color);

      img {
        max-width: 50px;
        max-height: 50px;
        width: auto;
        height: auto;
      }
    }

    .title {
      font-size: 48px;
      margin-bottom: 5px;
      color: var(--primary_color_font);
      font-weight: 700;
      line-height: 1.2;

      @media only screen and (max-width: 767px) {
        font-size: 32px;
      }

      .odometer {
        color: var(--primary_color_font);
        font-weight: 700;
      }
    }

    span.bototm {
      font-size: 18px;
      color: var(--primary_color_font);
      font-weight: 400;
      display: block;
    }
  }

  /* ============================================
     Tmp On Hover (Flashlight Effect)
     ============================================ */
  .tmponhover {
    position: relative;
    overflow: hidden;

    &::before {
      content: "";
      position: absolute;
      top: var(--y);
      left: var(--x);
      transform: translate(-50%, -50%);
      background: radial-gradient(var(--primary_color), transparent, transparent);
      width: 200%;
      height: 200%;
      opacity: 0;
      transition: 0.5s, top 0s, left 0s;
      border-radius: 6px;
    }

    &:hover::before {
      opacity: 1;
    }

    &::after {
      content: "";
      position: absolute;
      inset: 2px;
      background: #fefefe;
      border-radius: 6px;
    }

    > * {
      z-index: 2;
      position: relative;
    }
  }

  /* ============================================
     Font Weight Utilities
     ============================================ */
  .w-700 {
    font-weight: 700 !important;
  }

  /* ============================================
     Margin & Padding Utilities
     ============================================ */
  .mb--10 {
    margin-bottom: 10px !important;
  }

  .mt--0 {
    margin-top: 0 !important;
  }

  /* ============================================
     Text Center
     ============================================ */
  .text-center {
    text-align: center;
  }
}


/* ============================================
   Widget Timeline Working - Estilos Scoped
   Todos los estilos están scoped bajo .timelineworking-widget
   ============================================ */

.timelineworking-widget {
  background-color: #fafafa;
  /* ============================================
     Estilos base de tipografía
     ============================================ */
  font-size: 16px;
  line-height: 1.7;
  font-family: var(--primary_font);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  
  a {
    text-decoration: none;
    color: #1b1b1c;
  }
  
  a:hover,
  a:focus,
  a:active {
    text-decoration: none;
    outline: none;
    color: var(--primary_color);
  }
  
  img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
  }

  /* Section wrapper - padding consistente (contenido central) */
  > .tmp-timeline-area {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    > .tmp-timeline-area {
      padding-top: 80px !important;
      padding-bottom: 80px !important;
    }
  }
  @media only screen and (max-width: 767px) {
    > .tmp-timeline-area {
      padding-top: 60px !important;
      padding-bottom: 60px !important;
    }
  }
  
  /* ============================================
     Estilos de Sección
     ============================================ */
  
  .tmp-section-gapTop {
    padding-top: 120px !important;
  }
  
  .tmp-section-gap {
    padding: 120px 0 !important;
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .tmp-section-gapTop {
      padding-top: 80px !important;
    }
    
    .tmp-section-gap {
      padding: 80px 0 !important;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-section-gapTop {
      padding-top: 60px !important;
    }
    
    .tmp-section-gap {
      padding: 60px 0 !important;
    }
  }
  
  /* ============================================
     Estilos de Título de Sección (tmp-section-title-border)
     ============================================ */
  
  .tmp-section-title-border {
    position: relative;
  }
  
  .tmp-section-title-border .subtitle {
    display: flex;
    color: #363636;
    font-size: 13px;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    align-items: center;
    padding: 0 15px;
    font-family: var(--primary_font);
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-section-title-border .subtitle {
      flex-wrap: wrap;
      justify-content: center;
    }
  }
  
  .tmp-section-title-border .subtitle .subtitle-text {
    color: #363636;
    font-weight: 700;
    width: max-content;
    font-family: var(--primary_font);
  }
  
  .tmp-section-title-border .subtitle .number {
    color: #363636;
    transition: 0.5s;
    opacity: 0.6;
    display: none;
  }
  
  .tmp-section-title-border .title {
    margin-top: 20px;
    color: #1b1b1c;
    font-family: var(--primary_font);
    word-break: break-word;
    line-height: 1.4074;
    margin: 20px 0 20px;
    font-size: 48px;
    line-height: 1.2;
    font-weight: 700;
  }
  
  .tmp-section-title-border .title.tmp-title-split {
    opacity: 0;
  }
  
  @media only screen and (max-width: 991px) {
    .tmp-section-title-border .title {
      font-size: 36px;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-section-title-border .title {
      font-size: 28px;
    }
    
    .tmp-section-title-border .title br {
      display: none;
    }
  }
  
  .tmp-section-title-border .b1 {
    font-size: 18px;
    line-height: 1.7;
    color: #363636;
    margin: 0 0 30px;
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-section-title-border .b1 {
      font-size: 16px;
    }
  }
  
  .tmp-section-title-border.text-start {
    text-align: left;
  }
  
  .tmp-section-title-border.text-center {
    text-align: center;
  }
  
  /* ============================================
     Estilos de Line Separator (pres-line-separator-wrapper)
     ============================================ */
  
  .line-separator {
    position: relative;
    background-image: linear-gradient(90deg, var(--primary_color), rgba(33, 38, 45, 0));
    width: 50px;
    height: 1px;
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: auto;
  }
  
  .line-separator.line-left {
    background-image: linear-gradient(90deg, rgba(33, 38, 45, 0), var(--primary_color));
  }
  
  .pres-line-separator-wrapper {
    display: flex;
    position: relative;
    align-items: center;
    margin: 0 -15px;
    justify-content: start;
  }
  
  .pres-line-separator-wrapper.text-center {
    justify-content: center !important;
  }
  
  .pres-line-separator-wrapper.text-start {
    justify-content: flex-start !important;
  }
  
  @media only screen and (max-width: 767px) {
    .pres-line-separator-wrapper {
      flex-wrap: wrap;
      justify-content: center;
    }
    
    .pres-line-separator-wrapper .line-separator {
      display: none;
    }
  }
  
  .mb--10 {
    margin-bottom: 10px !important;
  }
  
  .mb--20 {
    margin-bottom: 20px !important;
  }
  
  .mt--10 {
    margin-top: 10px !important;
  }
  
  .mt--40 {
    margin-top: 40px !important;
  }
  
  .mt--50 {
    margin-top: 50px !important;
  }
  
  .w-700 {
    font-weight: 700 !important;
  }
  
  /* ============================================
     Estilos Timeline Style One
     ============================================ */
  
  .tmp-timeline-area {
    position: relative;
  }
  
  .tmp-timeline-wrapper {
    position: relative;
  }
  
  .timeline-style-one {
    position: relative;
  }
  
  .timeline-line {
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: hsla(0, 0%, 76.9%, 0.22);
  }
  
  .timeline-line::before,
  .timeline-line::after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
  }
  
  .timeline-line::before {
    height: 100%;
    bottom: 0;
    background: #ffffff;
  }
  
  .timeline-line::after {
    height: 200px;
    top: 0;
    background: linear-gradient(180deg, #ffffff, rgba(19, 19, 19, 0));
  }
  
  .timeline-dot {
    position: absolute;
    top: 50%;
    left: 0;
  }
  
  .timeline-dot::before,
  .timeline-dot::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    border-radius: 50%;
    transform: translate(-50%, -50%);
  }
  
  .timeline-dot::before {
    z-index: 1;
    width: 2.1rem;
    height: 2.1rem;
    border-radius: 50%;
    background: var(--primary_color);
    box-shadow: 0 0 15px rgba(82, 56, 255, 0.5);
  }
  
  .timeline-dot::after {
    border: 5px solid #ffffff;
    background: radial-gradient(50% 50% at 50% 50%, #ffffff 48.96%, #ffffff 100%);
    z-index: 0;
    width: 31px;
    height: 31px;
  }
  
  .timeline-dot .time-line-circle {
    position: absolute;
    top: 50%;
    border-radius: 50%;
    left: 50%;
    width: 100px;
    height: 100px;
    background: radial-gradient(50% 50% at 50% 50%, rgba(242, 201, 76, 0) 40.62%, rgba(82, 56, 255, 0.5) 100%);
    transform: translate(-50%, -50%);
    will-change: transform;
    animation: radialanimation 2.2s cubic-bezier(0.26, 1.04, 0.54, 1) infinite;
  }
  
  .single-timeline {
    position: sticky;
    padding-left: 100px;
    top: 100px;
  }
  
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .single-timeline {
      padding-left: 54px;
    }
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .single-timeline {
      padding-left: 50px;
      top: 0;
      position: relative;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .single-timeline {
      padding-left: 30px;
      position: relative;
      top: 0;
    }
  }
  
  .single-timeline .single-content {
    background: #ffffff;
    backdrop-filter: blur(4px) opacity(0.95);
    border-radius: 16px;
    padding: 50px;
  }
  
  .single-timeline .single-content::before,
  .single-timeline .single-content::after {
    border-radius: 16px;
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .single-timeline .single-content {
      padding: 30px;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .single-timeline .single-content {
      padding: 20px;
    }
  }
  
  .single-timeline .single-content .inner .content .title {
    margin-bottom: 0;
    font-weight: 700;
    font-size: 38px;
    color: #1b1b1c;
    line-height: 1.2;
  }
  
  .single-timeline .single-content .inner .content .title.tmp-title-split {
    opacity: 0;
  }
  
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .single-timeline .single-content .inner .content .title {
      font-size: 32px;
    }
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .single-timeline .single-content .inner .content .title {
      font-size: 32px;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .single-timeline .single-content .inner .content .title {
      font-size: 30px;
    }
  }
  
  .theme-gradient {
    color: var(--primary_color);
  }
  
  .working-list {
    margin-bottom: 30px;
  }
  
  .working-title {
    font-size: 20px;
    font-weight: 600;
    color: #1b1b1c;
    margin-bottom: 10px;
    line-height: 1.4;
  }
  
  .working-list p {
    font-size: 16px;
    line-height: 1.7;
    color: #363636;
    margin: 0;
  }
  
  .read-morebtn {
    margin-top: 30px;
  }
  
  .single-timeline .single-content .thumbnail img {
    border-radius: var(--general_border_radius);
  }
  
  .row--30 {
    margin-left: -15px;
    margin-right: -15px;
  }
  
  .row--30 > [class*="col"] {
    padding-left: 15px;
    padding-right: 15px;
  }
  
  /* ============================================
     Estilos Timeline Style Two
     ============================================ */
  
  .timeline-style-two {
    position: relative;
    border-radius: 16px;
  }
  
  .bg-color-blackest {
    background-color: #ffffff;
    padding: 40px 30px;
    border-radius: 16px;
  }
  
  @media only screen and (max-width: 767px) {
    .bg-color-blackest {
      padding: 30px 20px;
    }
  }
  
  .row--0 {
    margin-left: 0px;
    margin-right: 0px;
  }
  
  .row--0 > [class*="col"],
  .row--0 > [class*="col-"] {
    padding-left: 0px;
    padding-right: 0px;
  }
  
  .tmp-timeline-single {
    margin-top: 30px;
  }
  
  .tmp-timeline-single .tmp-timeline {
    text-align: center;
  }
  
  .tmp-timeline-single .title {
    margin-bottom: 33px;
    font-size: 20px;
    color: #1b1b1c;
    font-weight: 600;
  }
  
  .tmp-timeline-single .description {
    padding: 0 10%;
    margin-top: 15px;
    margin-bottom: 0;
    color: #363636;
    font-size: 16px;
    line-height: 1.7;
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .tmp-timeline-single .description {
      padding: 0 10px;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-timeline-single .description {
      padding: 0 10px;
    }
  }
  
  .tmp-timeline-single .tmp-timeline .progress-line {
    position: relative;
    border-radius: 0px;
    height: 6px;
    box-shadow: none;
    margin: 20px 0;
    width: 100%;
    background-color: #e1e4e8;
  }
  
  .tmp-timeline-single .tmp-timeline .progress-line .line-inner {
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    text-align: center;
    white-space: nowrap;
    transition: width 0.6s ease;
    background: var(--primary_color);
    width: 100%;
    display: flex;
    height: 100%;
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-timeline-single .tmp-timeline .progress-line .line-inner {
      display: none;
    }
  }
  
  .tmp-timeline-single:first-child .tmp-timeline .progress-line {
    width: 50%;
    left: 50%;
  }
  
  .tmp-timeline-single:last-child .tmp-timeline .progress-line {
    width: 50%;
  }
  
  .tmp-timeline-single .tmp-timeline .progress-dot {
    position: relative;
    height: 30px;
    display: block;
    width: 100%;
    margin-top: -39px;
    margin-left: -15px;
  }
  
  .tmp-timeline-single .tmp-timeline .progress-dot .dot-level {
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    background: var(--primary_color);
    position: absolute;
    width: 28px;
    height: 28px;
    display: block;
    display: inline-block;
    text-align: center;
    border-radius: 50%;
  }
  
  .tmp-timeline-single .tmp-timeline .progress-dot .dot-level .dot-inner {
    width: 12px;
    height: 12px;
    border-radius: 50px;
    position: absolute;
    top: 8px;
    left: 8px;
    background-color: #ffffff;
  }
  
  .tmp-timeline-single.no-gradient .tmp-timeline .progress-line .line-inner {
    background-image: inherit;
    background: var(--primary_color);
  }
  
  .tmp-timeline-single.no-gradient .tmp-timeline .progress-dot .dot-level {
    background-image: inherit;
    background: var(--primary_color);
  }
  
  /* ============================================
     Estilos de Botones (.tmp-btn)
     ============================================ */
  
  .tmp-btn,
  .btn-default {
    padding: 0 28px;
    border-radius: 5px;
    background: var(--primary_color);
    transition-duration: 300ms;
    color: #ffffff;
    font-family: var(--primary_font);
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.05);
    display: inline-flex;
    height: 50px;
    line-height: 49px;
    letter-spacing: 0.5px;
    width: max-content;
    transition: all 0.6s;
    border: 0 none;
    position: relative;
    z-index: 1;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-btn,
    .btn-default {
      padding: 0 16px;
      height: 42px;
      line-height: 42px;
    }
  }
  
  .tmp-btn::after,
  .btn-default::after {
    position: absolute;
    content: "";
    width: 200%;
    height: 200%;
    left: 50%;
    top: 110%;
    background: var(--primary_color);
    transform: translateX(-50%);
    transition: all 0.6s;
    transition-duration: 800ms;
    opacity: 0.5;
    border-radius: 50%;
    z-index: -1;
  }
  
  .tmp-btn:hover,
  .btn-default:hover {
    background-color: transparent;
    color: #ffffff;
    transform: translate3d(0, -2px, 0);
    box-shadow: 0 0 20px 5px rgba(82, 55, 249, 0.33);
  }
  
  .tmp-btn:hover::after,
  .btn-default:hover::after {
    opacity: 1;
    top: -30%;
  }
  
  .tmp-btn i,
  .btn-default i {
    padding-left: 6px;
    display: inline-block;
    top: 2px;
    position: relative;
    font-size: 17px;
  }
  
  .tmp-btn.round,
  .btn-default.round {
    border-radius: var(--general_border_radius);
  }
  
  .tmp-btn.icon-hover .btn-text,
  .btn-default.icon-hover .btn-text {
    transition-timing-function: cubic-bezier(0, 0.71, 0.4, 1);
    display: inline-block;
    transition: transform 0.5s;
    transform: translateX(7px);
  }
  
  .tmp-btn.icon-hover .btn-icon,
  .btn-default.icon-hover .btn-icon {
    margin-inline-start: -7px;
    display: inline-block;
  }
  
  .tmp-btn.icon-hover .btn-icon i,
  .btn-default.icon-hover .btn-icon i {
    transition-timing-function: cubic-bezier(0, 0.71, 0.4, 1);
    display: inline-block;
    opacity: 0;
    transform: translateX(-7px);
    transition: opacity 0.25s, transform 0.5s;
    padding-left: 0;
  }
  
  .tmp-btn:hover.icon-hover .btn-text,
  .btn-default:hover.icon-hover .btn-text {
    transform: translateX(-7px);
  }
  
  .tmp-btn:hover.icon-hover .btn-icon i,
  .btn-default:hover.icon-hover .btn-icon i {
    opacity: 1;
    transform: translateX(7px);
  }
  
  .tmp-btn:focus,
  .btn-default:focus {
    box-shadow: none;
    border: none;
    background-color: unset;
    background: var(--primary_color);
    color: #ffffff;
  }
}

/* ============================================
   Keyframes (fuera del scope para que funcionen)
   ============================================ */

@keyframes radialanimation {
  0% {
    opacity: 1;
    transform: translate3d(-50%, -50%, 0) scale(0.1);
  }
  to {
    opacity: 0;
    transform: translate3d(-50%, -50%, 0) scale(1);
  }
}


/* Scoped styles for mediox_team widget */
.team-wrapper {
  /* Section Space Two */
}

.team-wrapper .section-space-two {
  padding-top: 118px;
  padding-bottom: 120px;
}

@media (max-width: 767px) {
  .team-wrapper .section-space-two {
    padding-top: 96px;
    padding-bottom: 100px;
  }
}

@media (max-width: 575px) {
  .team-wrapper .section-space-two {
    padding-top: 76px;
    padding-bottom: 80px;
  }
}

/* Sec Title */
.team-wrapper .sec-title--center {
  text-align: center;
  margin-bottom: 49px;
}

.team-wrapper .sec-title--center .sec-title__top {
  justify-content: center;
}

.team-wrapper .sec-title__top {
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.team-wrapper .sec-title__top img {
  max-width: 100%;
  height: auto;
  animation: rotate 3s linear infinite;
}

.team-wrapper .sec-title__tagline {
  margin: 0;
  font-family: var(--primary_font);
  font-size: 16px;
  color: var(--primary_color);
  font-weight: 600;
  line-height: 1.5;
  text-transform: capitalize;
}

@media (max-width: 767px) {
  .team-wrapper .sec-title__tagline {
    font-size: 14px;
  }
}

.team-wrapper .sec-title__title {
  margin: 0;
  font-size: 45px;
  font-weight: 800;
  text-transform: capitalize;
  line-height: 1.222;
  font-family: var(--primary_font);
}

@media (max-width: 767px) {
  .team-wrapper .sec-title__title {
    font-size: 40px;
  }
}

@media (max-width: 575px) {
  .team-wrapper .sec-title__title {
    font-size: 35px;
  }
}

/* Team Two */
.team-wrapper .team-two {
  position: relative;
  background-color: #FFFFFF;
}

/* Social Links */
.team-wrapper .social-links {
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
}

.team-wrapper .social-links a {
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  color: #707882;
  border: 1px solid rgba(217, 225, 235, 0.2);
  border-radius: 50%;
  text-decoration: none;
  transition: all 500ms ease;
}

.team-wrapper .social-links a svg {
  width: 1em;
  height: 1em;
  fill: currentColor;
}

.team-wrapper .social-links a:hover {
  color: #FFFFFF;
  background-color: var(--primary_color);
  border-color: var(--primary_color);
}

/* Team Card Two */
.team-wrapper .team-card-two {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

@media (min-width: 576px) {
  .team-wrapper .team-card-two--top-identity {
    margin-top: 35px;
    flex-direction: column-reverse;
  }
}

.team-wrapper .team-card-two__image {
  position: relative;
  padding: 15px;
  width: 270px;
  height: 316px;
  background-color: var(--primary_color);
  -webkit-mask: url('data:image/svg+xml;utf8,<svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 789.000000 900.000000"><g transform="translate(0.000000,900.000000) scale(0.100000,-0.100000)" stroke="none"> <path d="M3716 8924 c-126 -35 -103 -23 -529 -273 -76 -44 -140 -81 -143 -81 -3 0 -17 -8 -32 -19 -28 -19 -312 -185 -490 -287 -57 -33 -114 -66 -127 -74 -12 -8 -54 -32 -92 -54 -37 -21 -88 -51 -113 -66 -25 -15 -99 -59 -165 -97 -196 -115 -688 -405 -720 -424 -16 -10 -39 -23 -50 -28 -11 -5 -72 -40 -135 -78 -63 -38 -137 -82 -165 -97 -27 -16 -90 -52 -140 -81 -49 -29 -160 -94 -245 -143 -189 -111 -217 -130 -303 -212 -142 -135 -226 -298 -250 -486 -17 -137 -15 -3796 2 -3897 25 -145 104 -304 210 -419 106 -114 110 -117 578 -387 70 -41 198 -115 283 -166 85 -50 186 -109 223 -131 76 -43 71 -40 275 -160 78 -46 208 -123 290 -170 81 -48 163 -97 182 -109 48 -31 242 -142 280 -161 8 -4 38 -22 65 -39 58 -37 142 -86 229 -133 34 -18 78 -45 99 -58 22 -14 130 -78 240 -141 111 -64 219 -127 241 -140 88 -56 306 -179 371 -209 112 -53 211 -74 344 -74 187 0 312 37 498 148 54 32 186 110 293 172 107 63 269 157 360 211 91 53 211 123 268 155 57 32 113 66 126 74 13 8 50 30 82 49 414 241 611 357 724 424 74 44 164 96 200 117 36 20 153 89 260 152 107 63 245 143 305 178 61 35 128 74 150 88 22 13 92 54 155 90 147 85 170 102 253 181 100 96 174 211 219 341 48 138 48 136 48 2062 0 1874 -2 1950 -41 2073 -39 119 -105 236 -180 318 -86 94 -151 145 -289 224 -193 111 -424 245 -580 338 -85 51 -184 108 -220 129 -36 20 -72 41 -80 46 -22 14 -317 188 -365 215 -22 12 -67 39 -100 58 -33 20 -82 49 -110 65 -27 16 -90 53 -140 82 -49 29 -106 62 -125 73 -19 10 -71 41 -115 67 -44 27 -145 85 -225 131 -80 45 -163 94 -185 109 -22 14 -89 55 -150 89 -60 34 -117 66 -125 71 -460 275 -561 328 -685 364 -124 36 -308 36 -439 0z"/> </g> </svg>');
  mask: url('data:image/svg+xml;utf8,<svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 789.000000 900.000000"><g transform="translate(0.000000,900.000000) scale(0.100000,-0.100000)" stroke="none"> <path d="M3716 8924 c-126 -35 -103 -23 -529 -273 -76 -44 -140 -81 -143 -81 -3 0 -17 -8 -32 -19 -28 -19 -312 -185 -490 -287 -57 -33 -114 -66 -127 -74 -12 -8 -54 -32 -92 -54 -37 -21 -88 -51 -113 -66 -25 -15 -99 -59 -165 -97 -196 -115 -688 -405 -720 -424 -16 -10 -39 -23 -50 -28 -11 -5 -72 -40 -135 -78 -63 -38 -137 -82 -165 -97 -27 -16 -90 -52 -140 -81 -49 -29 -160 -94 -245 -143 -189 -111 -217 -130 -303 -212 -142 -135 -226 -298 -250 -486 -17 -137 -15 -3796 2 -3897 25 -145 104 -304 210 -419 106 -114 110 -117 578 -387 70 -41 198 -115 283 -166 85 -50 186 -109 223 -131 76 -43 71 -40 275 -160 78 -46 208 -123 290 -170 81 -48 163 -97 182 -109 48 -31 242 -142 280 -161 8 -4 38 -22 65 -39 58 -37 142 -86 229 -133 34 -18 78 -45 99 -58 22 -14 130 -78 240 -141 111 -64 219 -127 241 -140 88 -56 306 -179 371 -209 112 -53 211 -74 344 -74 187 0 312 37 498 148 54 32 186 110 293 172 107 63 269 157 360 211 91 53 211 123 268 155 57 32 113 66 126 74 13 8 50 30 82 49 414 241 611 357 724 424 74 44 164 96 200 117 36 20 153 89 260 152 107 63 245 143 305 178 61 35 128 74 150 88 22 13 92 54 155 90 147 85 170 102 253 181 100 96 174 211 219 341 48 138 48 136 48 2062 0 1874 -2 1950 -41 2073 -39 119 -105 236 -180 318 -86 94 -151 145 -289 224 -193 111 -424 245 -580 338 -85 51 -184 108 -220 129 -36 20 -72 41 -80 46 -22 14 -317 188 -365 215 -22 12 -67 39 -100 58 -33 20 -82 49 -110 65 -27 16 -90 53 -140 82 -49 29 -106 62 -125 73 -19 10 -71 41 -115 67 -44 27 -145 85 -225 131 -80 45 -163 94 -185 109 -22 14 -89 55 -150 89 -60 34 -117 66 -125 71 -460 275 -561 328 -685 364 -124 36 -308 36 -439 0z"/> </g> </svg>');
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-size: auto;
  mask-size: auto;
}

@media (min-width: 576px) and (max-width: 767px) {
  .team-wrapper .team-card-two__image {
    width: 240px;
    height: 277px;
  }
}

@media (max-width: 575px) {
  .team-wrapper .team-card-two__image {
    margin-left: auto;
    margin-right: auto;
  }
}

.team-wrapper .team-card-two__image::after {
  content: "";
  width: calc(100% - 1px);
  height: calc(100% - 1px);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #FFFFFF;
  z-index: 1;
  -webkit-mask: url('data:image/svg+xml;utf8,<svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 789.000000 900.000000"><g transform="translate(0.000000,900.000000) scale(0.100000,-0.100000)" stroke="none"> <path d="M3716 8924 c-126 -35 -103 -23 -529 -273 -76 -44 -140 -81 -143 -81 -3 0 -17 -8 -32 -19 -28 -19 -312 -185 -490 -287 -57 -33 -114 -66 -127 -74 -12 -8 -54 -32 -92 -54 -37 -21 -88 -51 -113 -66 -25 -15 -99 -59 -165 -97 -196 -115 -688 -405 -720 -424 -16 -10 -39 -23 -50 -28 -11 -5 -72 -40 -135 -78 -63 -38 -137 -82 -165 -97 -27 -16 -90 -52 -140 -81 -49 -29 -160 -94 -245 -143 -189 -111 -217 -130 -303 -212 -142 -135 -226 -298 -250 -486 -17 -137 -15 -3796 2 -3897 25 -145 104 -304 210 -419 106 -114 110 -117 578 -387 70 -41 198 -115 283 -166 85 -50 186 -109 223 -131 76 -43 71 -40 275 -160 78 -46 208 -123 290 -170 81 -48 163 -97 182 -109 48 -31 242 -142 280 -161 8 -4 38 -22 65 -39 58 -37 142 -86 229 -133 34 -18 78 -45 99 -58 22 -14 130 -78 240 -141 111 -64 219 -127 241 -140 88 -56 306 -179 371 -209 112 -53 211 -74 344 -74 187 0 312 37 498 148 54 32 186 110 293 172 107 63 269 157 360 211 91 53 211 123 268 155 57 32 113 66 126 74 13 8 50 30 82 49 414 241 611 357 724 424 74 44 164 96 200 117 36 20 153 89 260 152 107 63 245 143 305 178 61 35 128 74 150 88 22 13 92 54 155 90 147 85 170 102 253 181 100 96 174 211 219 341 48 138 48 136 48 2062 0 1874 -2 1950 -41 2073 -39 119 -105 236 -180 318 -86 94 -151 145 -289 224 -193 111 -424 245 -580 338 -85 51 -184 108 -220 129 -36 20 -72 41 -80 46 -22 14 -317 188 -365 215 -22 12 -67 39 -100 58 -33 20 -82 49 -110 65 -27 16 -90 53 -140 82 -49 29 -106 62 -125 73 -19 10 -71 41 -115 67 -44 27 -145 85 -225 131 -80 45 -163 94 -185 109 -22 14 -89 55 -150 89 -60 34 -117 66 -125 71 -460 275 -561 328 -685 364 -124 36 -308 36 -439 0z"/> </g> </svg>');
  mask: url('data:image/svg+xml;utf8,<svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 789.000000 900.000000"><g transform="translate(0.000000,900.000000) scale(0.100000,-0.100000)" stroke="none"> <path d="M3716 8924 c-126 -35 -103 -23 -529 -273 -76 -44 -140 -81 -143 -81 -3 0 -17 -8 -32 -19 -28 -19 -312 -185 -490 -287 -57 -33 -114 -66 -127 -74 -12 -8 -54 -32 -92 -54 -37 -21 -88 -51 -113 -66 -25 -15 -99 -59 -165 -97 -196 -115 -688 -405 -720 -424 -16 -10 -39 -23 -50 -28 -11 -5 -72 -40 -135 -78 -63 -38 -137 -82 -165 -97 -27 -16 -90 -52 -140 -81 -49 -29 -160 -94 -245 -143 -189 -111 -217 -130 -303 -212 -142 -135 -226 -298 -250 -486 -17 -137 -15 -3796 2 -3897 25 -145 104 -304 210 -419 106 -114 110 -117 578 -387 70 -41 198 -115 283 -166 85 -50 186 -109 223 -131 76 -43 71 -40 275 -160 78 -46 208 -123 290 -170 81 -48 163 -97 182 -109 48 -31 242 -142 280 -161 8 -4 38 -22 65 -39 58 -37 142 -86 229 -133 34 -18 78 -45 99 -58 22 -14 130 -78 240 -141 111 -64 219 -127 241 -140 88 -56 306 -179 371 -209 112 -53 211 -74 344 -74 187 0 312 37 498 148 54 32 186 110 293 172 107 63 269 157 360 211 91 53 211 123 268 155 57 32 113 66 126 74 13 8 50 30 82 49 414 241 611 357 724 424 74 44 164 96 200 117 36 20 153 89 260 152 107 63 245 143 305 178 61 35 128 74 150 88 22 13 92 54 155 90 147 85 170 102 253 181 100 96 174 211 219 341 48 138 48 136 48 2062 0 1874 -2 1950 -41 2073 -39 119 -105 236 -180 318 -86 94 -151 145 -289 224 -193 111 -424 245 -580 338 -85 51 -184 108 -220 129 -36 20 -72 41 -80 46 -22 14 -317 188 -365 215 -22 12 -67 39 -100 58 -33 20 -82 49 -110 65 -27 16 -90 53 -140 82 -49 29 -106 62 -125 73 -19 10 -71 41 -115 67 -44 27 -145 85 -225 131 -80 45 -163 94 -185 109 -22 14 -89 55 -150 89 -60 34 -117 66 -125 71 -460 275 -561 328 -685 364 -124 36 -308 36 -439 0z"/> </g> </svg>');
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-size: auto;
  mask-size: auto;
  transition: all 500ms ease;
}

.team-wrapper .team-card-two__image__inner {
  position: relative;
  overflow: hidden;
  z-index: 2;
  -webkit-mask: url('data:image/svg+xml;utf8,<svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720.000000 819.000000"><g transform="translate(0.000000,819.000000) scale(0.100000,-0.100000)" stroke="none"> <path d="M3395 8135 c-22 -8 -50 -15 -62 -15 -12 0 -34 -6 -50 -14 -15 -8 -55 -28 -88 -44 -66 -31 -124 -63 -170 -93 -16 -10 -39 -23 -50 -29 -11 -6 -33 -19 -50 -30 -16 -11 -40 -24 -53 -30 -12 -5 -50 -28 -83 -50 -33 -22 -67 -40 -74 -40 -8 0 -17 -5 -20 -11 -4 -5 -17 -15 -28 -20 -12 -5 -35 -18 -52 -29 -16 -11 -39 -24 -50 -30 -11 -6 -33 -19 -50 -30 -16 -11 -39 -24 -50 -29 -11 -5 -37 -21 -58 -35 -21 -14 -42 -26 -48 -26 -6 0 -25 -11 -42 -24 -18 -14 -43 -30 -57 -35 -14 -6 -38 -20 -55 -31 -16 -11 -39 -24 -50 -30 -21 -11 -34 -18 -103 -62 -24 -16 -48 -28 -53 -28 -6 0 -25 -11 -42 -24 -18 -14 -43 -30 -57 -35 -14 -6 -38 -20 -55 -31 -16 -11 -39 -24 -50 -30 -11 -6 -33 -19 -50 -30 -16 -11 -39 -24 -50 -30 -11 -5 -27 -14 -35 -19 -32 -20 -166 -98 -180 -104 -8 -4 -28 -16 -45 -27 -16 -11 -39 -24 -50 -30 -11 -6 -33 -19 -50 -29 -16 -11 -48 -29 -70 -41 -22 -12 -59 -35 -83 -51 -24 -16 -48 -29 -54 -29 -6 0 -19 -7 -28 -15 -15 -13 -72 -48 -125 -75 -11 -6 -33 -19 -50 -30 -16 -11 -41 -25 -55 -31 -14 -5 -39 -21 -57 -35 -17 -13 -36 -24 -42 -24 -6 0 -27 -12 -48 -26 -21 -14 -47 -30 -58 -35 -11 -5 -33 -18 -50 -29 -16 -11 -39 -24 -50 -30 -11 -6 -33 -19 -50 -30 -16 -11 -39 -24 -50 -30 -111 -56 -292 -222 -328 -300 -4 -8 -16 -28 -27 -45 -39 -60 -78 -163 -99 -265 -16 -76 -10 -3526 6 -3585 18 -66 34 -106 72 -183 57 -117 65 -127 182 -244 58 -57 112 -97 211 -155 73 -44 140 -83 148 -86 8 -4 29 -16 45 -27 17 -11 39 -24 50 -30 11 -6 34 -19 50 -30 17 -11 37 -23 45 -27 16 -7 254 -146 280 -163 8 -6 24 -15 35 -20 11 -6 34 -19 50 -30 17 -11 37 -23 45 -27 15 -7 251 -145 280 -163 8 -6 24 -15 35 -20 11 -6 34 -19 50 -30 17 -11 37 -23 45 -27 8 -4 58 -32 110 -63 52 -31 102 -59 110 -63 8 -4 29 -16 45 -27 17 -11 39 -24 50 -30 11 -6 34 -19 50 -30 17 -11 37 -23 45 -27 16 -7 254 -146 280 -163 8 -6 24 -15 35 -20 11 -6 34 -19 50 -30 17 -11 37 -23 45 -27 8 -3 56 -31 105 -61 50 -30 99 -58 110 -63 11 -5 34 -18 50 -29 17 -11 39 -24 50 -30 11 -6 34 -19 50 -30 17 -11 37 -23 45 -27 12 -5 176 -100 230 -133 8 -5 49 -26 90 -46 41 -20 82 -40 92 -45 9 -4 54 -17 101 -28 115 -28 312 -29 412 -1 104 28 195 65 250 99 17 11 53 32 80 46 28 15 64 38 82 51 17 13 36 24 42 24 5 0 29 12 53 28 69 44 82 51 103 62 11 6 34 19 50 30 17 11 41 25 55 31 14 5 39 21 57 35 17 13 36 24 42 24 5 0 29 12 53 28 69 44 82 51 103 62 11 6 34 19 50 30 17 11 39 24 50 29 11 5 37 21 58 35 21 14 42 26 47 26 5 0 28 13 52 29 24 16 61 39 83 51 22 12 54 30 70 41 17 10 39 23 50 29 11 6 34 19 50 30 17 11 44 26 60 33 17 8 54 31 84 51 29 20 59 36 66 36 8 0 17 5 20 11 4 5 17 15 28 20 12 5 36 18 52 29 17 11 39 24 50 30 11 6 34 19 50 30 17 11 41 25 55 31 14 5 39 21 57 35 17 13 36 24 42 24 5 0 29 12 53 28 69 44 82 51 103 62 11 6 34 19 50 30 17 11 39 24 50 29 11 5 37 21 58 35 21 14 42 26 47 26 5 0 28 13 52 29 24 16 61 39 83 51 22 12 54 30 70 41 17 10 39 23 50 28 11 5 37 21 58 35 21 14 41 26 45 26 5 0 39 20 76 45 38 25 73 45 77 45 11 0 131 82 155 106 11 11 31 28 45 39 67 52 219 287 219 338 0 7 4 17 10 23 5 5 14 34 20 64 6 30 17 60 25 66 13 10 15 223 15 1758 0 1480 -2 1746 -14 1746 -15 0 -26 30 -26 71 0 14 -7 34 -15 45 -8 10 -15 27 -15 36 0 14 -40 98 -86 179 -13 23 -97 122 -134 158 -42 40 -162 127 -215 156 -27 14 -63 35 -80 46 -16 10 -39 23 -50 29 -11 5 -27 14 -35 19 -8 5 -62 37 -120 71 -58 33 -112 65 -120 70 -8 6 -24 15 -35 20 -11 6 -33 19 -50 30 -16 11 -37 23 -45 27 -16 7 -255 147 -280 163 -8 6 -24 15 -35 20 -11 6 -33 19 -50 30 -16 11 -37 23 -45 27 -8 4 -69 39 -135 78 -66 39 -127 75 -135 78 -8 4 -28 16 -45 27 -16 11 -39 24 -50 30 -11 6 -33 19 -50 30 -16 11 -39 24 -50 29 -17 7 -181 103 -225 131 -8 6 -24 15 -35 20 -11 6 -33 19 -50 30 -16 11 -39 24 -50 29 -11 5 -72 40 -135 78 -63 38 -122 72 -130 76 -8 4 -28 16 -45 27 -16 11 -37 23 -45 27 -8 4 -69 39 -135 78 -66 39 -127 75 -135 78 -8 4 -28 16 -45 27 -16 11 -39 24 -50 30 -11 6 -33 19 -50 29 -100 64 -281 151 -314 151 -10 0 -35 7 -54 15 -50 21 -334 20 -392 0z"/> </g> </svg>');
  mask: url('data:image/svg+xml;utf8,<svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720.000000 819.000000"><g transform="translate(0.000000,819.000000) scale(0.100000,-0.100000)" stroke="none"> <path d="M3395 8135 c-22 -8 -50 -15 -62 -15 -12 0 -34 -6 -50 -14 -15 -8 -55 -28 -88 -44 -66 -31 -124 -63 -170 -93 -16 -10 -39 -23 -50 -29 -11 -6 -33 -19 -50 -30 -16 -11 -40 -24 -53 -30 -12 -5 -50 -28 -83 -50 -33 -22 -67 -40 -74 -40 -8 0 -17 -5 -20 -11 -4 -5 -17 -15 -28 -20 -12 -5 -35 -18 -52 -29 -16 -11 -39 -24 -50 -30 -11 -6 -33 -19 -50 -30 -16 -11 -39 -24 -50 -29 -11 -5 -37 -21 -58 -35 -21 -14 -42 -26 -48 -26 -6 0 -25 -11 -42 -24 -18 -14 -43 -30 -57 -35 -14 -6 -38 -20 -55 -31 -16 -11 -39 -24 -50 -30 -21 -11 -34 -18 -103 -62 -24 -16 -48 -28 -53 -28 -6 0 -25 -11 -42 -24 -18 -14 -43 -30 -57 -35 -14 -6 -38 -20 -55 -31 -16 -11 -39 -24 -50 -30 -11 -6 -33 -19 -50 -30 -16 -11 -39 -24 -50 -30 -11 -5 -27 -14 -35 -19 -32 -20 -166 -98 -180 -104 -8 -4 -28 -16 -45 -27 -16 -11 -39 -24 -50 -30 -11 -6 -33 -19 -50 -29 -16 -11 -48 -29 -70 -41 -22 -12 -59 -35 -83 -51 -24 -16 -48 -29 -54 -29 -6 0 -19 -7 -28 -15 -15 -13 -72 -48 -125 -75 -11 -6 -33 -19 -50 -30 -16 -11 -41 -25 -55 -31 -14 -5 -39 -21 -57 -35 -17 -13 -36 -24 -42 -24 -6 0 -27 -12 -48 -26 -21 -14 -47 -30 -58 -35 -11 -5 -33 -18 -50 -29 -16 -11 -39 -24 -50 -30 -11 -6 -33 -19 -50 -30 -16 -11 -39 -24 -50 -30 -111 -56 -292 -222 -328 -300 -4 -8 -16 -28 -27 -45 -39 -60 -78 -163 -99 -265 -16 -76 -10 -3526 6 -3585 18 -66 34 -106 72 -183 57 -117 65 -127 182 -244 58 -57 112 -97 211 -155 73 -44 140 -83 148 -86 8 -4 29 -16 45 -27 17 -11 39 -24 50 -30 11 -6 34 -19 50 -30 17 -11 37 -23 45 -27 16 -7 254 -146 280 -163 8 -6 24 -15 35 -20 11 -6 34 -19 50 -30 17 -11 37 -23 45 -27 15 -7 251 -145 280 -163 8 -6 24 -15 35 -20 11 -6 34 -19 50 -30 17 -11 37 -23 45 -27 8 -4 58 -32 110 -63 52 -31 102 -59 110 -63 8 -4 29 -16 45 -27 17 -11 39 -24 50 -30 11 -6 34 -19 50 -30 17 -11 37 -23 45 -27 16 -7 254 -146 280 -163 8 -6 24 -15 35 -20 11 -6 34 -19 50 -30 17 -11 37 -23 45 -27 8 -3 56 -31 105 -61 50 -30 99 -58 110 -63 11 -5 34 -18 50 -29 17 -11 39 -24 50 -30 11 -6 34 -19 50 -30 17 -11 37 -23 45 -27 12 -5 176 -100 230 -133 8 -5 49 -26 90 -46 41 -20 82 -40 92 -45 9 -4 54 -17 101 -28 115 -28 312 -29 412 -1 104 28 195 65 250 99 17 11 53 32 80 46 28 15 64 38 82 51 17 13 36 24 42 24 5 0 29 12 53 28 69 44 82 51 103 62 11 6 34 19 50 30 17 11 41 25 55 31 14 5 39 21 57 35 17 13 36 24 42 24 5 0 29 12 53 28 69 44 82 51 103 62 11 6 34 19 50 30 17 11 39 24 50 29 11 5 37 21 58 35 21 14 42 26 47 26 5 0 28 13 52 29 24 16 61 39 83 51 22 12 54 30 70 41 17 10 39 23 50 29 11 6 34 19 50 30 17 11 44 26 60 33 17 8 54 31 84 51 29 20 59 36 66 36 8 0 17 5 20 11 4 5 17 15 28 20 12 5 36 18 52 29 17 11 39 24 50 30 11 6 34 19 50 30 17 11 41 25 55 31 14 5 39 21 57 35 17 13 36 24 42 24 5 0 29 12 53 28 69 44 82 51 103 62 11 6 34 19 50 30 17 11 39 24 50 29 11 5 37 21 58 35 21 14 42 26 47 26 5 0 28 13 52 29 24 16 61 39 83 51 22 12 54 30 70 41 17 10 39 23 50 28 11 5 37 21 58 35 21 14 41 26 45 26 5 0 39 20 76 45 38 25 73 45 77 45 11 0 131 82 155 106 11 11 31 28 45 39 67 52 219 287 219 338 0 7 4 17 10 23 5 5 14 34 20 64 6 30 17 60 25 66 13 10 15 223 15 1758 0 1480 -2 1746 -14 1746 -15 0 -26 30 -26 71 0 14 -7 34 -15 45 -8 10 -15 27 -15 36 0 14 -40 98 -86 179 -13 23 -97 122 -134 158 -42 40 -162 127 -215 156 -27 14 -63 35 -80 46 -16 10 -39 23 -50 29 -11 5 -27 14 -35 19 -8 5 -62 37 -120 71 -58 33 -112 65 -120 70 -8 6 -24 15 -35 20 -11 6 -33 19 -50 30 -16 11 -37 23 -45 27 -16 7 -255 147 -280 163 -8 6 -24 15 -35 20 -11 6 -33 19 -50 30 -16 11 -37 23 -45 27 -8 4 -69 39 -135 78 -66 39 -127 75 -135 78 -8 4 -28 16 -45 27 -16 11 -39 24 -50 30 -11 6 -33 19 -50 30 -16 11 -39 24 -50 29 -17 7 -181 103 -225 131 -8 6 -24 15 -35 20 -11 6 -33 19 -50 30 -16 11 -39 24 -50 29 -11 5 -72 40 -135 78 -63 38 -122 72 -130 76 -8 4 -28 16 -45 27 -16 11 -37 23 -45 27 -8 4 -69 39 -135 78 -66 39 -127 75 -135 78 -8 4 -28 16 -45 27 -16 11 -39 24 -50 30 -11 6 -33 19 -50 29 -100 64 -281 151 -314 151 -10 0 -35 7 -54 15 -50 21 -334 20 -392 0z"/> </g> </svg>');
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-size: auto;
  mask-size: auto;
}

.team-wrapper .team-card-two__image__inner::after {
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba(11, 34, 65, 0.6);
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 1;
  transition: all 500ms ease;
}

.team-wrapper .team-card-two__image__inner img {
  width: 100%;
  display: block;
}

.team-wrapper .team-card-two:hover .team-card-two__image__inner::after {
  opacity: 1;
}

.team-wrapper .team-card-two__social {
  position: absolute;
  left: 50%;
  bottom: 70px;
  transform: translateX(-50%);
  z-index: 2;
  flex-wrap: nowrap;
  gap: 10px;
  transition: all 500ms ease;
}

@media (min-width: 576px) and (max-width: 767px) {
  .team-wrapper .team-card-two__social {
    gap: 8px;
  }
}

.team-wrapper .team-card-two__social a {
  width: 36px;
  height: 36px;
  color: #FFFFFF;
  border-color: #FFFFFF;
  opacity: 0;
  transform: translateY(70px);
}

.team-wrapper .team-card-two__social a:nth-child(1) {
  transition: all 500ms ease 50ms;
}

.team-wrapper .team-card-two__social a:nth-child(2) {
  transition: all 500ms ease 110ms;
}

.team-wrapper .team-card-two__social a:nth-child(3) {
  transition: all 500ms ease 170ms;
}

.team-wrapper .team-card-two__social a:nth-child(4) {
  transition: all 500ms ease 230ms;
}

.team-wrapper .team-card-two:hover .team-card-two__social a {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 575px) {
  .team-wrapper .team-card-two__identity {
    text-align: center;
  }
}

.team-wrapper .team-card-two__name {
  margin: 0;
  margin-bottom: 4px;
  font-size: 18px;
  font-weight: 700;
  text-transform: capitalize;
  line-height: 1.388;
  font-family: var(--primary_font);
}

.team-wrapper .team-card-two__name:hover {
  color: var(--primary_color);
}

.team-wrapper .team-card-two__name a {
  color: inherit;
  background: linear-gradient(to right, currentcolor 0%, currentcolor 100%) 0px 95%/0px 1px no-repeat;
  transition: all 500ms ease;
  text-decoration: none;
}

.team-wrapper .team-card-two__name a:hover {
  background-size: 100% 1px;
}

.team-wrapper .team-card-two__designation {
  margin: 0;
  font-size: 12px;
  color: var(--primary_color);
  font-weight: 500;
  text-transform: capitalize;
  line-height: 1.25;
  font-family: var(--primary_font);
}

/* Owl Carousel */
.team-wrapper .mediox-owl__carousel--basic-nav.owl-carousel .owl-nav {
  display: none !important;
}

.team-wrapper .mediox-owl__carousel--basic-nav.owl-carousel .owl-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  margin-top: 50px;
}

.team-wrapper .mediox-owl__carousel--basic-nav.owl-carousel .owl-dots .owl-dot {
  outline: 0;
  border: 0;
  position: relative;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #707882;
  transition: all 400ms ease;
}

.team-wrapper .mediox-owl__carousel--basic-nav.owl-carousel .owl-dots .owl-dot::after {
  content: "";
  width: calc(100% + 20px);
  height: calc(100% + 20px);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.85);
  opacity: 0;
  border-radius: inherit;
  background-color: rgba(0, 165, 241, 0.1);
  transition: all 400ms ease;
}

.team-wrapper .mediox-owl__carousel--basic-nav.owl-carousel .owl-dots .owl-dot span {
  display: none;
}

.team-wrapper .mediox-owl__carousel--basic-nav.owl-carousel .owl-dots .owl-dot.active {
  background-color: var(--primary_color);
}

.team-wrapper .mediox-owl__carousel--basic-nav.owl-carousel .owl-dots .owl-dot.active::after {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

/* Animations */
@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}


/* ============================================
   Widget Contact - Estilos Scoped
   Todos los estilos están scoped bajo .contact-widget
   ============================================ */

.contact-widget {
  /* ============================================
     Estilos base de tipografía
     ============================================ */
  font-size: 16px;
  line-height: 1.7;
  font-family: var(--primary_font);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: #fafafa;
  
  a {
    text-decoration: none;
    color: #1b1b1c;
  }
  
  a:hover,
  a:focus,
  a:active {
    text-decoration: none;
    outline: none;
    color: var(--primary_color);
  }
  
  img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
  }

  /* Section wrapper - padding consistente (contenido central) */
  > .tmp-contact-area {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    > .tmp-contact-area {
      padding-top: 80px !important;
      padding-bottom: 80px !important;
    }
  }
  @media only screen and (max-width: 767px) {
    > .tmp-contact-area {
      padding-top: 60px !important;
      padding-bottom: 60px !important;
    }
  }
  
  /* ============================================
     Estilos de Sección (tmp-section-gap, tmp-section-gapBottom)
     ============================================ */
  
  .tmp-section-gap {
    padding: 120px 0 !important;
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .tmp-section-gap {
      padding: 80px 0 !important;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-section-gap {
      padding: 60px 0 !important;
    }
  }
  
  .tmp-section-gapBottom {
    padding-bottom: 120px !important;
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .tmp-section-gapBottom {
      padding-bottom: 80px !important;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-section-gapBottom {
      padding-bottom: 60px !important;
    }
  }
  
  /* ============================================
     Estilos de Título de Sección (tmp-section-title-border)
     ============================================ */
  
  .tmp-section-title-border {
    position: relative;
  }
  
  .tmp-section-title-border.text-center {
    text-align: center;
  }
  
  .tmp-section-title-border .subtitle {
    display: flex;
    color: #363636;
    font-size: 13px;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    align-items: center;
    padding: 0 15px;
    font-family: var(--primary_font);
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-section-title-border .subtitle {
      flex-wrap: wrap;
      justify-content: center;
    }
  }
  
  .tmp-section-title-border .subtitle .subtitle-text {
    color: #363636;
    font-weight: 700;
    width: max-content;
  }
  
  .tmp-section-title-border .subtitle .number {
    color: #363636;
    transition: 0.5s;
    opacity: 0.6;
    margin-right: 10px;
  }
  
  .tmp-section-title-border .subtitle .number a {
    color: #363636;
    text-decoration: none;
  }
  
  .tmp-section-title-border .title {
    font-size: 48px;
    line-height: 1.2;
    font-weight: 700;
    color: #1b1b1c;
    margin: 0;
    font-family: var(--primary_font);
    word-break: break-word;
  }
  
  /* Ocultar inicialmente los títulos con animación tmp-title-split */
  .tmp-section-title-border .title.tmp-title-split {
    opacity: 0;
  }
  
  @media only screen and (max-width: 991px) {
    .tmp-section-title-border .title {
      font-size: 36px;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-section-title-border .title {
      font-size: 28px;
    }
  }
  
  .w-700 {
    font-weight: 700 !important;
  }
  
  .mt--20 {
    margin-top: 20px !important;
  }
  
  .mt--30 {
    margin-top: 30px !important;
  }
  
  /* ============================================
     Estilos de Separadores de Línea
     ============================================ */
  
  .line-separator {
    position: relative;
    background-image: linear-gradient(90deg, var(--primary_color), rgba(33, 38, 45, 0));
    width: 50px;
    height: 1px;
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: auto;
  }
  
  .pres-line-separator-wrapper {
    display: flex;
    position: relative;
    align-items: center;
    margin: 0 -15px;
    justify-content: center;
  }
  
  @media only screen and (max-width: 767px) {
    .pres-line-separator-wrapper {
      flex-wrap: wrap;
      justify-content: center;
    }
    
    .pres-line-separator-wrapper .line-separator {
      display: none;
    }
  }
  
  .pres-line-separator-wrapper.text-center .line-separator.line-left {
    background-image: linear-gradient(-90deg, var(--primary_color), rgba(33, 38, 45, 0));
  }
  
  .pres-line-separator-wrapper.text-center .line-separator.line-right {
    background-image: linear-gradient(90deg, var(--primary_color), rgba(33, 38, 45, 0));
  }
  
  .mb--10 {
    margin-bottom: 10px !important;
  }
  
  /* ============================================
     Estilos de Contact Address (tmp-contact-address)
     ============================================ */
  
  .tmp-contact-address {
    position: relative;
  }
  
  .mt_dec--30 {
    margin-top: -30px;
  }
  
  /* ============================================
     Estilos de Address Cards (tmp-address)
     ============================================ */
  
  .tmp-address {
    padding: 22px 20px;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
    transition: 0.3s;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
  }
  
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .tmp-address {
      padding: 30px 20px;
    }
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .tmp-address {
      padding: 30px 20px;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-address {
      padding: 30px 20px;
    }
  }
  
  .tmp-address.tmponhover::before {
    content: "";
    position: absolute;
    top: var(--y);
    left: var(--x);
    transform: translate(-50%, -50%);
    background: radial-gradient(var(--primary_color), transparent, transparent);
    width: 200%;
    height: 200%;
    opacity: 0;
    transition: 0.5s, top 0s, left 0s;
    border-radius: 10px;
    z-index: 0;
  }
  
  .tmp-address.tmponhover:hover::before {
    opacity: 1;
  }
  
  .tmp-address.tmponhover::after {
    content: "";
    position: absolute;
    inset: 2px;
    background: #ffffff;
    border-radius: 10px;
    z-index: 1;
    pointer-events: none;
  }
  
  .tmp-address.tmponhover > * {
    position: relative;
    z-index: 2;
  }
  
  .tmp-address .icon {
    color: var(--primary_color);
    border-radius: 100%;
    font-size: 40px;
    display: inline-block;
    margin-bottom: 0;
    line-height: 1;
    margin-right: 20px;
    flex-shrink: 0;
  }
  
  .tmp-address .icon i {
    display: inline-block;
    font-size: inherit;
    line-height: inherit;
  }
  
  .tmp-address .inner {
    flex: 1;
  }
  
  .tmp-address .inner h4.title {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 8px;
    color: #1b1b1c;
    font-family: var(--primary_font);
  }
  
  .tmp-address .inner p {
    font-size: 18px;
    margin-bottom: 0;
    color: #363636;
    font-family: var(--primary_font);
  }
  
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .tmp-address .inner p {
      font-size: 16px;
    }
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .tmp-address .inner p {
      font-size: 16px;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-address .inner p {
      font-size: 16px;
    }
  }
  
  .tmp-address .inner p a {
    color: #363636;
    transition: 0.3s;
  }
  
  .tmp-address .inner p a:hover {
    color: var(--primary_color);
  }
  
  .tmp-address:hover {
    transform: translateY(-5px);
  }
  
  /* ============================================
     Estilos de Appointment Area (inv-appoinment-area-start)
     ============================================ */
  
  .inv-appoinment-area-start {
    position: relative;
  }
  
  /* ============================================
     Estilos de Imagen de Appointment
     ============================================ */
  
  .aapoiment-left-area-thumbnail {
    width: 100%;
    height: 100%;
  }
  
  .aapoiment-left-area-thumbnail img {
    border-radius: 10px;
    width: 100%;
    height: auto;
    object-fit: cover;
  }
  
  /* ============================================
     Estilos de Formulario (appoinment-form-wrapper)
     ============================================ */
  
  .appoinment-form-wrapper {
    padding: 30px;
    background: #ffffff;
    border-radius: 10px;
    height: 100%;
  }
  
  @media only screen and (max-width: 575px) {
    .appoinment-form-wrapper {
      padding: 15px;
    }
  }
  
  .appoinment-form-wrapper .form-group-wrapper {
    display: flex;
    align-items: center;
    gap: 25px;
  }
  
  @media only screen and (max-width: 575px) {
    .appoinment-form-wrapper .form-group-wrapper {
      flex-direction: column;
      gap: 0;
    }
  }
  
  .appoinment-form-wrapper .form-group-wrapper .form-group {
    width: 100%;
  }
  
  /* ============================================
     Estilos de Form Group
     ============================================ */
  
  .contact-form-1 .form-group {
    display: block;
    margin-bottom: 25px;
  }
  
  .contact-form-1 .form-group.mb-0 {
    margin-bottom: 0;
  }
  
  /* ============================================
     Estilos de Input y Textarea
     ============================================ */
  
  .form-group input,
  .form-group textarea {
    border: 2px solid #e3e3e3;
    border-radius: var(--general_border_radius);
    font-size: 16px;
    padding: 0 15px;
    width: 100%;
    font-family: var(--primary_font);
    color: #1b1b1c;
    background: #ffffff;
    transition: all 0.3s;
  }
  
  .form-group input {
    height: 50px;
  }
  
  .form-group input:focus,
  .form-group textarea:focus {
    outline: none;
    border-color: var(--primary_color);
  }
  
  .form-group input::placeholder,
  .form-group textarea::placeholder {
    color: #848788;
    font-family: var(--primary_font);
  }
  
  .contact-form-1 .form-group input {
    height: 70px;
    padding: 0 20px;
  }
  
  .contact-form-1 .form-group textarea {
    min-height: 193px;
    padding-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    resize: none;
  }
  
  .form-group input.error,
  .form-group textarea.error {
    border-color: #dc3545;
  }
  
  /* ============================================
     Estilos de Efecto tmponhover para Form Group
     ============================================ */
  
  .form-group.tmponhover {
    position: relative;
    overflow: hidden;
    border-radius: 6px;
  }
  
  .form-group.tmponhover::before {
    content: "";
    position: absolute;
    top: var(--y);
    left: var(--x);
    transform: translate(-50%, -50%);
    background: radial-gradient(var(--primary_color), transparent, transparent);
    width: 200%;
    height: 200%;
    opacity: 0;
    transition: 0.5s, top 0s, left 0s;
    border-radius: 6px;
    z-index: 0;
  }
  
  .form-group.tmponhover:hover::before {
    opacity: 1;
  }
  
  .form-group.tmponhover::after {
    content: "";
    position: absolute;
    inset: 4px;
    background: #ffffff;
    border-radius: 6px;
    z-index: 1;
    pointer-events: none;
  }
  
  .form-group.tmponhover input,
  .form-group.tmponhover textarea {
    position: relative;
    z-index: 2;
    background: transparent;
  }
  
  .form-group.tmponhover button,
  .form-group.tmponhover .tmp-btn,
  .form-group.tmponhover .btn-default {
    position: relative;
    z-index: 3;
  }
  
  .appoinment-form-wrapper.tmponhover {
    position: relative;
    overflow: hidden;
  }
  
  .appoinment-form-wrapper.tmponhover::before {
    content: "";
    position: absolute;
    top: var(--y);
    left: var(--x);
    transform: translate(-50%, -50%);
    background: radial-gradient(var(--primary_color), transparent, transparent);
    width: 200%;
    height: 200%;
    opacity: 0;
    transition: 0.5s, top 0s, left 0s;
    border-radius: 10px;
    z-index: 0;
  }
  
  .appoinment-form-wrapper.tmponhover:hover::before {
    opacity: 1;
  }
  
  .appoinment-form-wrapper.tmponhover::after {
    content: "";
    position: absolute;
    inset: 2px;
    background: #ffffff;
    border-radius: 10px;
    z-index: 1;
    pointer-events: none;
  }
  
  .appoinment-form-wrapper.tmponhover > * {
    position: relative;
    z-index: 2;
  }
  
  /* ============================================
     Estilos de Botones (.tmp-btn)
     ============================================ */
  
  .tmp-btn,
  .btn-default {
    padding: 0 28px;
    border-radius: 5px;
    background: var(--primary_color);
    transition-duration: 300ms;
    color: #ffffff;
    font-family: var(--primary_font);
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    text-decoration: none;
    display: flex;
    height: 50px;
    line-height: 49px;
    letter-spacing: 0.5px;
    width: max-content;
    transition: all 0.6s;
    border: 0 none;
    position: relative;
    z-index: 3;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-btn,
    .btn-default {
      padding: 0 16px;
      height: 42px;
      line-height: 42px;
    }
  }
  
  .tmp-btn::after,
  .btn-default::after {
    position: absolute;
    content: "";
    width: 200%;
    height: 200%;
    left: 50%;
    top: 110%;
    background: var(--primary_color);
    transform: translateX(-50%);
    transition: all 0.6s;
    transition-duration: 800ms;
    opacity: 0.5;
    border-radius: 50%;
    z-index: -1;
  }
  
  .tmp-btn:hover,
  .btn-default:hover {
    background-color: transparent;
    color: #ffffff;
    transform: translate3d(0, -2px, 0);
    box-shadow: 0 0 20px 5px rgba(82, 55, 249, 0.33);
  }
  
  .tmp-btn:hover::after,
  .btn-default:hover::after {
    opacity: 1;
    top: -30%;
  }
  
  .tmp-btn.btn-large,
  .btn-default.btn-large {
    height: 60px;
    line-height: 59px;
    font-size: 18px;
    font-weight: 500;
  }
  
  .tmp-btn:focus,
  .btn-default:focus {
    box-shadow: none;
    border: none;
    background-color: unset;
    background: var(--primary_color);
    color: #ffffff;
  }
  
  /* ============================================
     Estilos de Mensajes de Error y Éxito
     ============================================ */
  
  .error-msg {
    color: #dc3545;
    font-size: 14px;
    margin-top: 10px;
    font-family: var(--primary_font);
  }
  
  .success-msg {
    color: #28a745;
    font-size: 14px;
    margin-top: 10px;
    font-family: var(--primary_font);
  }
  
  .XSuccess {
    padding: 15px;
    background: #d4edda;
    border: 1px solid #c3e6cb;
    border-radius: var(--general_border_radius);
    color: #155724;
    margin-top: 20px;
    font-family: var(--primary_font);
  }
  
  .XSuccess.d-none {
    display: none;
  }
  
  /* ============================================
     Estilos de Map Area (tmp-map-area)
     ============================================ */
  
  .tmp-map-area {
    position: relative;
  }
  
  .tmp-map-area iframe {
    width: 100%;
    height: 550px;
    border: 0;
    border-radius: 10px;
    filter: grayscale(0);
  }
  
  @media only screen and (max-width: 767px) {
    .tmp-map-area iframe {
      height: 400px;
    }
  }
  
  /* ============================================
     Utilidades
     ============================================ */
  
  .mb--20 {
    margin-bottom: 20px;
  }
  
  .mb--10 {
    margin-bottom: 10px;
  }
  
  .mb-0 {
    margin-bottom: 0 !important;
  }
}