/**
 * Stylesheet:  style.css
 * Theme:       Labotrex - Laboratory & Science Research HTML5 Template
 * Version:     1.0
 * Author:     	BoomDevs
 * 
 */
/* Table of contents
=========================
// 1.Preloader
// 2.Scrollup
// 3.Nav Menu
// 4.Slider Section
// 5.Info Card
// 6.Icon Card
// 7.About Image Card
// 8.About Info Card
// 9.Counter Card
// 10.Brand Marquee
// 11.Testimonial Card
// 12.Accordion Card
// 13.Client Logo Card
// 14.Post Card
// 15.Skill Progress Card
// 16.Call To Action Card
// 17.Title Card
// 18.Breadcrumb
// 19.Pagination's
// 20.Project Details Page
// 21.Sidebar
// 22.Comment List
// 23. Image Card
// 24.Comment Form
// 25.Team Member
// 26.Portfolio
// 27.Video Popup Modal Card
// 28.Portfolio Slider
// 29.Flip Image Card
// About Page
// Contact Page
// Service Page
// Team Page
// Footer


===========================*/
/* 全站字体（2026-11-09）：不再自托管 Urbanist / Questrial 字体文件，
   统一用 Arial（Windows / macOS 都自带，无需加载任何字体文件）；
   Arial 没有中文字形，中文自动回落到 苹方 / 微软雅黑 / 思源黑体。
   所有 font-family 一律引用这个变量，想换字体只改这一行。
   注意：.fa-* 图标属于 Font Awesome 图标字体，不在此列。 */
:root {
  --yt-font: Arial, "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", "Source Han Sans SC", sans-serif;
}

/* Theme Default CSS */
* {
  margin: 0;
  border: 0;
  outline: none;
}

html,
body {
  height: 100%;
  font-size: 18px;
  font-weight: 400;
  font-family: var(--yt-font);
  color: #525256;
  vertical-align: baseline;
  line-height: 32px;
  direction: ltr;
}

p {
  margin: 0 0 15px;
}

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

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  color: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--yt-font);
  font-weight: 600;
  color: #292929;
  font-style: normal;
  transition: all 0.5s ease-out;
}

h1 {
  font-size: 64px;
  font-weight: 600;
  line-height: 77px;
  letter-spacing: -0.96px;
}

h2 {
  font-size: 48px;
  font-weight: 600;
  line-height: 58px;
  letter-spacing: -0.72px;
}

h3 {
  font-size: 36px;
  font-weight: 600;
  line-height: 46px;
  letter-spacing: -0.54px;
}

h4 {
  font-size: 28px;
  font-weight: 600;
  line-height: 36px;
  letter-spacing: -0.42px;
}

h5 {
  font-size: 20px;
  line-height: 34px;
  font-weight: 600;
}

h6 {
  font-size: 18px;
  line-height: 26px;
  font-weight: 600;
}

label {
  color: #525256;
  cursor: pointer;
  font-size: 16px;
  font-weight: 400;
}

button {
  cursor: pointer;
  transition: all 0.5s ease-out;
}

a:not([href]):not([tabindex]) {
  text-decoration: none;
}

a,
.button {
  text-decoration: none;
  transition: all 0.5s ease-out;
}

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

a:focus {
  color: #025e43;
  text-decoration: none;
  transition: all 0.5s ease-out;
}

a,
button {
  color: #025e43;
  outline: medium none;
  transition: all 0.5s ease-out;
}
a:hover,
button:hover {
  color: #025e43;
  transition: all 0.5s ease-out;
}

button:focus,
input:focus,
input:focus,
textarea,
textarea:focus {
  outline: 0;
}

ul {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}

::-moz-selection {
  background: #292929;
  text-shadow: none;
  color: #fff;
}

::selection {
  background: #292929;
  text-shadow: none;
  color: #fff;
}

textarea:focus,
input:focus {
  outline: none;
}

.background-black {
  background-color: #025f43;
}

.background-gray {
  background-color: #F4F4F4;
}

.background-orange {
  background-color: #03c785;
}

.page-bg {
  background-color: #292929;
}

.bg-gray-100 {
  background-color: #D9EAFD;
}

.page-area {
  padding-top: 113px;
  padding-bottom: 100px;
}

.blog-area {
  padding-top: 120px;
  padding-bottom: 80px;
}

@media (max-width: 991px) {
  .page-area,
  .blog-area {
    padding-top: 100px;
    padding-bottom: 52px;
  }
}
@media (max-width: 767px) {
  .page-area,
  .blog-area {
    padding-top: 80px;
    padding-bottom: 32px;
  }
}
.page-area .page-links,
.blog-area .page-links {
  margin-bottom: 20px;
}

.border-radius-12 {
  border-radius: 12px;
}

.text-white-100 {
  color: rgba(255, 255, 255, 0.7019607843);
}

code {
  color: #03c785;
}

.theme-btn,
.wp-block-loginout a,
input.theme-btn {
  padding: 25px 44px;
  font-family: var(--yt-font);
  font-size: 20px;
  line-height: initial;
  font-weight: 600;
  background-color: #03c588;
  color: #fff;
  border-radius: 50px;
  text-transform: capitalize;
  white-space: nowrap;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .theme-btn,
  .wp-block-loginout a,
  input.theme-btn {
    padding: 17px 38px;
  }
}
@media (max-width: 1199px) {
  .theme-btn,
  .wp-block-loginout a,
  input.theme-btn {
    padding: 14px 32px;
    font-size: 18px;
    line-height: 32px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .theme-btn,
  .wp-block-loginout a,
  input.theme-btn {
    padding: 12px 28px;
  }
}
.theme-btn:hover,
.wp-block-loginout a:hover,
input.theme-btn:hover {
  background-color: #025d45;
  color: #ffffff;
  transition: all 0.5s ease-out;
}

.btn-wrapper {
  display: inline-flex;
  align-items: center;
}
.btn-wrapper:hover .theme-btn,
.btn-wrapper:hover .circle-arrow-btn {
  background-color: #025d45;
  color: #ffffff;
  transition: all 0.5s ease-out;
}
.btn-wrapper .circle-arrow-btn {
  width: 74px;
  height: 74px;
  flex: 0 0 auto; /* 绝不允许被 flex 压缩：一旦横向被挤，width 变小而 height 不变，圆就成了椭圆 */
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background-color: #03c588;
  color: #fff;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .btn-wrapper .circle-arrow-btn {
    width: 68px;
    height: 68px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .btn-wrapper .circle-arrow-btn {
    width: 60px;
    height: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .btn-wrapper .circle-arrow-btn {
    width: 60px;
    height: 60px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .btn-wrapper .circle-arrow-btn {
    width: 60px;
    height: 60px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .btn-wrapper .circle-arrow-btn {
    width: 56px;
    height: 56px;
  }
}
.btn-wrapper .circle-arrow-btn i {
  font-size: 24px;
  transform: rotate(-45deg);
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .btn-wrapper .circle-arrow-btn i {
    font-size: 22px;
  }
}

.simple-btn {
  color: #292929;
  font-size: 18px;
  font-weight: 400;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 24px;
  font-family: var(--yt-font);
}
.simple-btn:hover {
  color: #03c785;
  transition: all 0.5s ease-out;
}

.wp-block-loginout a {
  position: relative;
}

.contact-form-btn {
  justify-content: center;
  width: 100%;
  display: block;
  line-height: 42px;
}
.contact-form-btn .icon {
  float: right;
}

input.theme-btn {
  display: inline-block !important;
  width: inherit !important;
  border: 0 !important;
}

.circle-btn-text {
  position: absolute;
  z-index: 99;
  width: 300px;
  height: 300px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  overflow: hidden;
}
.circle-btn-text text {
  font-family: var(--yt-font);
  font-size: 16px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 2px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .circle-btn-text text {
    font-size: 13px;
  }
}
.circle-btn-text svg {
  animation-name: rotate;
  animation-duration: 5s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

.animate-move-left-right {
  animation: MoveLeftRight 1.5s linear infinite alternate;
}

.animate-move-top-bottom {
  animation: MoveUpDown 1.5s linear infinite alternate;
}

.slider-nav-btn-wrapper {
  display: flex;
  gap: 18px;
}
.slider-nav-btn-wrapper a {
  width: 72px;
  height: 72px;
  border-radius: 50px;
  background-color: #ffffff;
  border: 1px solid #C0C0C0;
  font-size: 24px;
  color: #292929;
  transition: all 0.5s ease-out;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .slider-nav-btn-wrapper a {
    width: 50px;
    height: 50px;
    font-size: 18px;
  }
}
.slider-nav-btn-wrapper a:hover {
  background-color: #03c785;
  color: #292929;
  border: 1px solid #03c785;
}

.circle-rotate-wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
.circle-rotate-wrapper .circle-rotate-inner {
  position: absolute;
  width: 160px;
  height: 160px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.circle-rotate-text {
  transform-origin: center center;
  animation: spin 6s linear infinite;
  position: absolute !important;
  width: 100%;
  height: 100% !important;
  top: 0;
  left: 0;
}
.circle-rotate-text span {
  font-family: var(--yt-font);
  font-size: 16px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #fff;
}

.gx-6 {
  --bs-gutter-x: 7.55rem;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .gx-6 {
    --bs-gutter-x: 1rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .gx-6 {
    --bs-gutter-x: 1rem;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .gx-6 {
    --bs-gutter-x: 1rem;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .gx-6 {
    --bs-gutter-x: 2rem;
  }
}

.elementor-column-gap-default > .elementor-column > .elementor-element-populated {
  padding: 0 12px !important;
}

@media only screen and (min-width: 0px) and (max-width: 767px) {
  .elementor-section.elementor-section-boxed > .elementor-container {
    max-width: 540px !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .elementor-section.elementor-section-boxed > .elementor-container {
    max-width: 720px !important;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .elementor-section.elementor-section-boxed > .elementor-container {
    max-width: 960px !important;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .elementor-section.elementor-section-boxed > .elementor-container {
    max-width: 1140px !important;
  }
}

/* Deafult Margin & Padding */
/*-- Margin Top --*/
.mt-5 {
  margin-top: 5px;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

/*-- Margin Bottom --*/
.mb-5 {
  margin-bottom: 5px;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

/*-- Padding Top --*/
.pt-5 {
  padding-top: 5px;
}

.pt-10 {
  padding-top: 10px;
}

.pt-15 {
  padding-top: 15px;
}

.pt-20 {
  padding-top: 20px;
}

.pt-21 {
  padding-top: 21px;
}

.pt-22 {
  padding-top: 22px;
}

.pt-23 {
  padding-top: 23px;
}

.pt-24 {
  padding-top: 24px;
}

.pt-25 {
  padding-top: 25px;
}

.pt-30 {
  padding-top: 30px;
}

.pt-35 {
  padding-top: 35px;
}

.pt-40 {
  padding-top: 40px;
}

.pt-45 {
  padding-top: 45px;
}

.pt-50 {
  padding-top: 50px;
}

.pt-55 {
  padding-top: 55px;
}

.pt-60 {
  padding-top: 60px;
}

.pt-65 {
  padding-top: 65px;
}

.pt-70 {
  padding-top: 70px;
}

.pt-75 {
  padding-top: 75px;
}

.pt-80 {
  padding-top: 80px;
}

.pt-85 {
  padding-top: 85px;
}

.pt-86 {
  padding-top: 85px;
}

.pt-87 {
  padding-top: 85px;
}

.pt-88 {
  padding-top: 85px;
}

.pt-89 {
  padding-top: 85px;
}

.pt-90 {
  padding-top: 90px;
}

.pt-95 {
  padding-top: 95px;
}

.pt-100 {
  padding-top: 100px;
}

.pt-105 {
  padding-top: 105px;
}

.pt-110 {
  padding-top: 110px;
}

.pt-115 {
  padding-top: 115px;
}

.pt-120 {
  padding-top: 120px;
}

.pt-125 {
  padding-top: 125px;
}

.pt-130 {
  padding-top: 130px;
}

.pt-135 {
  padding-top: 135px;
}

.pt-140 {
  padding-top: 64px;
}

.pt-145 {
  padding-top: 145px;
}

.pt-150 {
  padding-top: 150px;
}

.pt-155 {
  padding-top: 155px;
}

.pt-160 {
  padding-top: 160px;
}

.pt-165 {
  padding-top: 165px;
}

.pt-170 {
  padding-top: 170px;
}

.pt-175 {
  padding-top: 175px;
}

.pt-180 {
  padding-top: 180px;
}

.pt-185 {
  padding-top: 185px;
}

.pt-190 {
  padding-top: 190px;
}

.pt-195 {
  padding-top: 195px;
}

.pt-200 {
  padding-top: 200px;
}

.pt-250 {
  padding-top: 250px;
}

/*-- Padding Bottom --*/
.pb-5 {
  padding-bottom: 5px;
}

.pb-10 {
  padding-bottom: 10px;
}

.pb-15 {
  padding-bottom: 15px;
}

.pb-20 {
  padding-bottom: 20px;
}

.pb-21 {
  padding-bottom: 21px;
}

.pb-22 {
  padding-bottom: 22px;
}

.pb-23 {
  padding-bottom: 23px;
}

.pb-24 {
  padding-bottom: 24px;
}

.pb-25 {
  padding-bottom: 25px;
}

.pb-30 {
  padding-bottom: 30px;
}

.pb-35 {
  padding-bottom: 35px;
}

.pb-40 {
  padding-bottom: 40px;
}

.pb-45 {
  padding-bottom: 45px;
}

.pb-50 {
  padding-bottom: 50px;
}

.pb-55 {
  padding-bottom: 55px;
}

.pb-60 {
  padding-bottom: 60px;
}

.pb-65 {
  padding-bottom: 65px;
}

.pb-70 {
  padding-bottom: 70px;
}

.pb-75 {
  padding-bottom: 75px;
}

.pb-80 {
  padding-bottom: 80px;
}

.pb-85 {
  padding-bottom: 85px;
}

.pb-90 {
  padding-bottom: 90px;
}

.pb-95 {
  padding-bottom: 95px;
}

.pb-100 {
  padding-bottom: 100px;
}

.pb-105 {
  padding-bottom: 105px;
}

.pb-110 {
  padding-bottom: 110px;
}

.pb-115 {
  padding-bottom: 115px;
}

.pb-120 {
  padding-bottom: 120px;
}

.pb-125 {
  padding-bottom: 125px;
}

.pb-130 {
  padding-bottom: 130px;
}

.pb-135 {
  padding-bottom: 135px;
}

.pb-140 {
  padding-bottom: 140px;
}

.pb-145 {
  padding-bottom: 145px;
}

.pb-150 {
  padding-bottom: 150px;
}

.pb-155 {
  padding-bottom: 155px;
}

.pb-160 {
  padding-bottom: 160px;
}

.pb-165 {
  padding-bottom: 165px;
}

.pb-170 {
  padding-bottom: 170px;
}

.pb-175 {
  padding-bottom: 175px;
}

.pb-180 {
  padding-bottom: 180px;
}

.pb-185 {
  padding-bottom: 185px;
}

.pb-190 {
  padding-bottom: 190px;
}

.pb-195 {
  padding-bottom: 195px;
}

.pb-200 {
  padding-bottom: 200px;
}

/*-- Padding Left --*/
.pl-0 {
  padding-left: 0px;
}

.pl-5 {
  padding-left: 5px;
}

.pl-10 {
  padding-left: 10px;
}

.pl-15 {
  padding-left: 15px;
}

.pl-20 {
  padding-left: 20px;
}

.pl-25 {
  padding-left: 35px;
}

.pl-30 {
  padding-left: 30px;
}

.pl-35 {
  padding-left: 35px;
}

.pl-35 {
  padding-left: 35px;
}

.pl-40 {
  padding-left: 40px;
}

.pl-45 {
  padding-left: 45px;
}

.pl-50 {
  padding-left: 50px;
}

.pl-55 {
  padding-left: 55px;
}

.pl-60 {
  padding-left: 60px;
}

.pl-65 {
  padding-left: 65px;
}

.pl-70 {
  padding-left: 70px;
}

.pl-75 {
  padding-left: 75px;
}

.pl-80 {
  padding-left: 80px;
}

.pl-85 {
  padding-left: 80px;
}

.pl-90 {
  padding-left: 90px;
}

.pl-95 {
  padding-left: 95px;
}

.pl-100 {
  padding-left: 100px;
}

.pl-105 {
  padding-left: 105px;
}

.pl-110 {
  padding-left: 110px;
}

.pl-115 {
  padding-left: 115px;
}

.pl-120 {
  padding-left: 120px;
}

.pl-125 {
  padding-left: 125px;
}

.pl-130 {
  padding-left: 130px;
}

.pl-135 {
  padding-left: 135px;
}

.pl-140 {
  padding-left: 140px;
}

.pl-145 {
  padding-left: 145px;
}

.pl-150 {
  padding-left: 150px;
}

.pl-155 {
  padding-left: 155px;
}

.pl-160 {
  padding-left: 160px;
}

.pl-165 {
  padding-left: 165px;
}

.pl-170 {
  padding-left: 170px;
}

.pl-180 {
  padding-left: 180px;
}

.pl-185 {
  padding-left: 185px;
}

.pl-190 {
  padding-left: 190px;
}

.pl-195 {
  padding-left: 195px;
}

.pl-100 {
  padding-left: 100px;
}

.pl-200 {
  padding-left: 200px;
}

/*-- Padding Right --*/
.pr-0 {
  padding-right: 0px;
}

.pr-5 {
  padding-right: 5px;
}

.pr-10 {
  padding-right: 10px;
}

.pr-15 {
  padding-right: 15px;
}

.pr-20 {
  padding-right: 20px;
}

.pr-25 {
  padding-right: 35px;
}

.pr-30 {
  padding-right: 30px;
}

.pr-35 {
  padding-right: 35px;
}

.pr-35 {
  padding-right: 35px;
}

.pr-40 {
  padding-right: 40px;
}

.pr-45 {
  padding-right: 45px;
}

.pr-50 {
  padding-right: 50px;
}

.pr-55 {
  padding-right: 55px;
}

.pr-60 {
  padding-right: 60px;
}

.pr-65 {
  padding-right: 65px;
}

.pr-70 {
  padding-right: 70px;
}

.pr-75 {
  padding-right: 75px;
}

.pr-80 {
  padding-right: 80px;
}

.pr-85 {
  padding-right: 80px;
}

.pr-90 {
  padding-right: 90px;
}

.pr-95 {
  padding-right: 95px;
}

.pr-100 {
  padding-right: 100px;
}

.pr-105 {
  padding-right: 105px;
}

.pr-110 {
  padding-right: 110px;
}

.pr-115 {
  padding-right: 115px;
}

.pr-120 {
  padding-right: 120px;
}

.pr-125 {
  padding-right: 125px;
}

.pr-130 {
  padding-right: 130px;
}

.pr-135 {
  padding-right: 135px;
}

.pr-140 {
  padding-right: 140px;
}

.pr-145 {
  padding-right: 145px;
}

.pr-150 {
  padding-right: 150px;
}

.pr-155 {
  padding-right: 155px;
}

.pr-165 {
  padding-right: 165px;
}

.pr-170 {
  padding-right: 170px;
}

.pr-175 {
  padding-right: 175px;
}

.pr-180 {
  padding-right: 180px;
}

.pr-185 {
  padding-right: 185px;
}

.pr-190 {
  padding-right: 190px;
}

.pr-195 {
  padding-right: 195px;
}

.pr-200 {
  padding-right: 200px;
}

/** padding top & bottom **/
.py-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}

.py-15 {
  padding-top: 15px;
  padding-bottom: 15px;
}

.py-20 {
  padding-top: 20px;
  padding-bottom: 20px;
}

.py-25 {
  padding-top: 25px;
  padding-bottom: 25px;
}

.py-30 {
  padding-top: 30px;
  padding-bottom: 30px;
}

.py-35 {
  padding-top: 35px;
  padding-bottom: 35px;
}

.py-40 {
  padding-top: 40px;
  padding-bottom: 40px;
}

.py-45 {
  padding-top: 45px;
  padding-bottom: 45px;
}

.py-50 {
  padding-top: 50px;
  padding-bottom: 50px;
}

.py-55 {
  padding-top: 55px;
  padding-bottom: 55px;
}

.py-60 {
  padding-top: 60px;
  padding-bottom: 60px;
}

.py-65 {
  padding-top: 65px;
  padding-bottom: 65px;
}

.py-70 {
  padding-top: 70px;
  padding-bottom: 70px;
}

.py-75 {
  padding-top: 75px;
  padding-bottom: 75px;
}

.py-80 {
  padding-top: 80px;
  padding-bottom: 80px;
}

.py-85 {
  padding-top: 85px;
  padding-bottom: 85px;
}

.py-90 {
  padding-top: 90px;
  padding-bottom: 90px;
}

.py-95 {
  padding-top: 95px;
  padding-bottom: 95px;
}

.py-100 {
  padding-top: 100px;
  padding-bottom: 100px;
}

.py-105 {
  padding-top: 105px;
  padding-bottom: 105px;
}

.py-110 {
  padding-top: 110px;
  padding-bottom: 110px;
}

.py-115 {
  padding-top: 115px;
  padding-bottom: 115px;
}

.py-120 {
  padding-top: 120px;
  padding-bottom: 120px;
}

.py-125 {
  padding-top: 125px;
  padding-bottom: 125px;
}

.py-130 {
  padding-top: 130px;
  padding-bottom: 130px;
}

.py-135 {
  padding-top: 135px;
  padding-bottom: 135px;
}

.py-140 {
  padding-top: 90px;
  padding-bottom: 0px;
}

.py-145 {
  padding-top: 145px;
  padding-bottom: 145px;
}

.py-150 {
  padding-top: 150px;
  padding-bottom: 150px;
}

.py-155 {
  padding-top: 155px;
  padding-bottom: 155px;
}

.py-160 {
  padding-top: 160px;
  padding-bottom: 160px;
}

.py-165 {
  padding-top: 165px;
  padding-bottom: 165px;
}

.py-170 {
  padding-top: 170px;
  padding-bottom: 170px;
}

.py-175 {
  padding-top: 175px;
  padding-bottom: 175px;
}

.py-180 {
  padding-top: 180px;
  padding-bottom: 180px;
}

.py-185 {
  padding-top: 185px;
  padding-bottom: 185px;
}

.py-190 {
  padding-top: 190px;
  padding-bottom: 190px;
}

.py-195 {
  padding-top: 195px;
  padding-bottom: 195px;
}

.py-200 {
  padding-top: 200px;
  padding-bottom: 200px;
}

.py-205 {
  padding-top: 205px;
  padding-bottom: 205px;
}

.py-210 {
  padding-top: 210px;
  padding-bottom: 210px;
}

.py-215 {
  padding-top: 215px;
  padding-bottom: 215px;
}

.py-220 {
  padding-top: 220px;
  padding-bottom: 220px;
}

.py-225 {
  padding-top: 225px;
  padding-bottom: 225px;
}

.py-230 {
  padding-top: 230px;
  padding-bottom: 230px;
}

.py-235 {
  padding-top: 235px;
  padding-bottom: 235px;
}

.py-240 {
  padding-top: 240px;
  padding-bottom: 240px;
}

.py-250 {
  padding-top: 250px;
  padding-bottom: 250px;
}

.py-260 {
  padding-top: 260px;
  padding-bottom: 260px;
}

.py-270 {
  padding-top: 270px;
  padding-bottom: 270px;
}

.py-280 {
  padding-top: 280px;
  padding-bottom: 280px;
}

.py-290 {
  padding-top: 290px;
  padding-bottom: 290px;
}

.py-300 {
  padding-top: 300px;
  padding-bottom: 300px;
}

.py-310 {
  padding-top: 310px;
  padding-bottom: 310px;
}

.py-320 {
  padding-top: 320px;
  padding-bottom: 320px;
}

.py-330 {
  padding-top: 330px;
  padding-bottom: 330px;
}

.py-340 {
  padding-top: 340px;
  padding-bottom: 340px;
}

.py-350 {
  padding-top: 350px;
  padding-bottom: 350px;
}

/** padding left & right **/
.px-10 {
  padding-left: 10px;
  padding-right: 10px;
}

.px-15 {
  padding-left: 15px;
  padding-right: 15px;
}

.px-20 {
  padding-left: 20px;
  padding-right: 20px;
}

.px-25 {
  padding-left: 25px;
  padding-right: 25px;
}

.px-30 {
  padding-left: 30px;
  padding-right: 30px;
}

.px-35 {
  padding-left: 35px;
  padding-right: 35px;
}

.px-40 {
  padding-left: 40px;
  padding-right: 40px;
}

.px-45 {
  padding-left: 45px;
  padding-right: 45px;
}

.px-50 {
  padding-left: 50px;
  padding-right: 50px;
}

.px-55 {
  padding-left: 55px;
  padding-right: 55px;
}

.px-60 {
  padding-left: 60px;
  padding-right: 60px;
}

.px-65 {
  padding-left: 65px;
  padding-right: 65px;
}

.px-70 {
  padding-left: 70px;
  padding-right: 70px;
}

.px-75 {
  padding-left: 75px;
  padding-right: 75px;
}

.px-80 {
  padding-left: 80px;
  padding-right: 80px;
}

.px-85 {
  padding-left: 85px;
  padding-right: 85px;
}

.px-90 {
  padding-left: 90px;
  padding-right: 90px;
}

.px-95 {
  padding-left: 95px;
  padding-right: 95px;
}

.px-100 {
  padding-left: 100px;
  padding-right: 100px;
}

.px-105 {
  padding-left: 105px;
  padding-right: 105px;
}

.px-110 {
  padding-left: 110px;
  padding-right: 110px;
}

.px-115 {
  padding-left: 115px;
  padding-right: 115px;
}

.px-120 {
  padding-left: 120px;
  padding-right: 120px;
}

.px-125 {
  padding-left: 125px;
  padding-right: 125px;
}

.px-130 {
  padding-left: 130px;
  padding-right: 130px;
}

.px-135 {
  padding-left: 135px;
  padding-right: 135px;
}

.px-140 {
  padding-left: 140px;
  padding-right: 140px;
}

.px-145 {
  padding-left: 145px;
  padding-right: 145px;
}

.px-150 {
  padding-left: 150px;
  padding-right: 150px;
}

.px-155 {
  padding-left: 155px;
  padding-right: 155px;
}

.px-160 {
  padding-left: 160px;
  padding-right: 160px;
}

.px-165 {
  padding-left: 165px;
  padding-right: 165px;
}

.px-170 {
  padding-left: 170px;
  padding-right: 170px;
}

.px-175 {
  padding-left: 175px;
  padding-right: 175px;
}

.px-180 {
  padding-left: 180px;
  padding-right: 180px;
}

.px-185 {
  padding-left: 185px;
  padding-right: 185px;
}

.px-190 {
  padding-left: 190px;
  padding-right: 190px;
}

.px-195 {
  padding-left: 195px;
  padding-right: 195px;
}

.px-200 {
  padding-left: 200px;
  padding-right: 200px;
}

.px-205 {
  padding-left: 205px;
  padding-right: 205px;
}

.px-210 {
  padding-left: 210px;
  padding-right: 210px;
}

.px-215 {
  padding-left: 215px;
  padding-right: 215px;
}

.px-220 {
  padding-left: 220px;
  padding-right: 220px;
}

.px-225 {
  padding-left: 225px;
  padding-right: 225px;
}

.px-230 {
  padding-left: 230px;
  padding-right: 230px;
}

.px-235 {
  padding-left: 235px;
  padding-right: 235px;
}

.px-240 {
  padding-left: 240px;
  padding-right: 240px;
}

.px-250 {
  padding-left: 250px;
  padding-right: 250px;
}

.px-260 {
  padding-left: 260px;
  padding-right: 260px;
}

.px-270 {
  padding-left: 270px;
  padding-right: 270px;
}

.px-280 {
  padding-left: 280px;
  padding-right: 280px;
}

.px-290 {
  padding-left: 290px;
  padding-right: 290px;
}

.px-300 {
  padding-left: 300px;
  padding-right: 300px;
}

.px-310 {
  padding-left: 310px;
  padding-right: 310px;
}

.px-320 {
  padding-left: 320px;
  padding-right: 320px;
}

.px-330 {
  padding-left: 330px;
  padding-right: 330px;
}

.px-340 {
  padding-left: 340px;
  padding-right: 340px;
}

.px-350 {
  padding-left: 350px;
  padding-right: 350px;
}

@media only screen and (min-width: 0px) and (max-width: 767px) {
  .py-sm-60 {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .py-md-80 {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .py-lg-100 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 0px) and (max-width: 767px) {
  .pt-sm-40 {
    padding-top: 40px;
  }
}

@media only screen and (min-width: 0px) and (max-width: 767px) {
  .pt-sm-60 {
    padding-top: 60px;
  }
}

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

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .pt-lg-100 {
    padding-top: 100px;
  }
}

@media only screen and (min-width: 0px) and (max-width: 767px) {
  .pb-sm-40 {
    padding-bottom: 40px;
  }
}

@media only screen and (min-width: 0px) and (max-width: 767px) {
  .pb-sm-60 {
    padding-bottom: 60px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pb-md-60 {
    padding-bottom: 60px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pb-md-80 {
    padding-bottom: 80px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .pb-lg-80 {
    padding-bottom: 80px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .pb-lg-100 {
    padding-bottom: 100px;
  }
}

/* WordPress Core
===================*/
body {
  -ms-word-wrap: break-word;
  word-wrap: break-word;
  overflow-x: hidden;
}

dl, ol, ul {
  margin-top: 0;
  margin-bottom: 25px;
}

ol {
  padding-left: 20px;
}

ul {
  list-style: disc;
  padding-left: 20px;
}

/* Protected Post Type */
.post-password-form label {
  width: 100%;
  display: block;
  font-weight: 500;
  margin-bottom: 10px;
}
.post-password-form input[type=password] {
  font-size: 1.2rem;
  line-height: 20px;
  padding: 12px 20px;
  border: 1px solid #E4E4F2;
  width: 100%;
}
.post-password-form input[type=submit] {
  background-color: #03c785;
  border: none;
  padding: 10px 40px;
  color: #ffffff;
  cursor: pointer;
  font-weight: 500;
  transition: all 0.5s ease-out;
}
.post-password-form input[type=submit]:hover {
  background-color: #292929;
}

.textwidget p > strong {
  color: #292929;
}

/* Table */
table {
  margin-bottom: 20px;
  width: 100%;
}
table caption {
  border: 1px solid #D9EAFD;
  padding: 6px 10px;
  border-top: 0;
  color: #525256;
}
table th,
table td {
  background-color: transparent;
  border: 1px solid #D9EAFD;
  text-align: center;
  padding: 8px;
  transition: 0.3s;
  color: #525256;
}
table th#today,
table td#today {
  background: #03c785;
  color: #292929;
}
table th#today a,
table td#today a {
  color: #292929;
}

.page-content .size-full.alignright {
  margin-bottom: 15px;
  margin-top: 20px;
}
.page-content figure.wp-caption.aligncenter {
  margin-top: 40px;
}
.page-content dl, .page-content ol, .page-content ul {
  margin-bottom: 11px;
}
.page-content .comment-respond {
  margin-top: 78px;
  margin-bottom: 20px;
}
.page-content .latest-comments .comment-respond {
  margin-bottom: 40px;
}
.page-content .post-comments {
  margin-top: 80px;
}

/* Text meant only for screen readers. */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
  background-color: #eee;
  clip: auto !important;
  clip-path: none;
  color: #444;
  display: block;
  font-size: 1em;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}

/*
 Caption
============================*/
.wp-caption {
  margin-bottom: 1.5em;
  max-width: 100%;
}

.wp-caption img[class*=wp-image-] {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.wp-caption .wp-caption-text {
  margin: 0.8075em 0;
  font-size: 14px;
  font-style: italic;
}

.wp-caption-text {
  text-align: center;
}

/*
 Galleries
============================*/
.gallery {
  margin-bottom: 10px;
}

.gallery-item {
  display: inline-block;
  max-width: 33.33%;
  text-align: center;
  vertical-align: top;
  width: 100%;
  padding-right: 5px !important;
}

.gallery-columns-1 .gallery-item {
  max-width: 100%;
  width: 100%;
}

.gallery-columns-2 .gallery-item {
  max-width: 50%;
}

.gallery-columns-3 .gallery-item {
  max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
  max-width: 25%;
}

.gallery-columns-5 .gallery-item {
  max-width: 20%;
}

.gallery-columns-6 .gallery-item {
  max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
  max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
  max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
  max-width: 11.11%;
}

.gallery-caption {
  display: block;
}

.size-thumbnail {
  margin-bottom: 20px;
}

img.emoji {
  width: 15px;
  height: 15px;
}

/*
 Alignments
============================*/
.alignleft {
  display: inline;
  float: left;
  margin-right: 1.5em !important;
}

.alignright {
  display: inline;
  float: right;
  margin-left: 1.5em !important;
}

.aligncenter {
  clear: both;
  display: block;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center;
}

/*
 Block Unit Test Widget
============================*/
.wp-block-search__input {
  border: 1px solid #D9EAFD !important;
}

.wp-block-search__button {
  margin-left: 0 !important;
}

.wp-block-social-links {
  padding-left: 0 !important;
}
.wp-block-social-links li {
  padding-top: 0 !important;
}

.single-post-item.format-quote blockquote {
  padding: 45px;
}
@media (max-width: 767px) {
  .single-post-item.format-quote blockquote {
    padding: 35px;
  }
}

blockquote {
  overflow: hidden;
  margin: 40px 0;
  position: relative;
  z-index: 1;
  padding: 40px 60px !important;
}
blockquote p {
  font-family: var(--yt-font);
  font-size: 28px;
  color: #292929;
  line-height: 36px;
  font-weight: 600;
  margin: 0 !important;
  letter-spacing: -0.42px;
}
blockquote p a {
  color: #292929;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.24px;
  text-transform: uppercase;
  font-family: var(--yt-font);
  text-decoration: none;
}
blockquote footer {
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 700;
  text-transform: capitalize;
  color: #292929;
  margin-top: 20px;
}

.wp-block-group.has-background p,
.wp-block-columns.has-background p,
.wp-block-columns .has-background p {
  color: #292929;
}

.wp-block-quote, blockquote {
  border-left: 2px solid #03c785;
}

.wp-block-pullquote {
  border-top: 2px solid #03c785 !important;
  border-bottom: 2px solid #03c785 !important;
  background-color: #f4f4f4;
}
.wp-block-pullquote.is-style-solid-color {
  background-color: #D9EAFD !important;
}
.wp-block-pullquote.is-style-solid-color .blockquote {
  background-color: #ffffff;
}

.wp-block-quote__citation, .wp-block-quote cite, .wp-block-quote footer {
  margin-top: 10px;
  display: block;
}

.wp-block-column:not(:first-child), .wp-block-column:nth-child(2n) {
  margin-left: 10px;
}

.wp-block-column:not(:last-child) {
  margin-right: 10px;
}

.wp-block-column:nth-child(2n+1) {
  margin-right: 10px;
}

.post-content > .alignwide {
  margin-left: 0;
  margin-right: 0;
  width: calc(100% + 20px);
  max-width: calc(100% + 20px);
}

.post-content h2.has-small-font-size {
  line-height: 24px;
}
.post-content h2.has-medium-font-size {
  line-height: 32px;
}
.post-content h2.has-large-font-size {
  line-height: 48px;
}
.post-content p.has-large-font-size {
  font-size: 36px;
  line-height: 1.2;
}
.post-content .wp-block-search {
  margin-bottom: 15px;
}
.post-content .wp-block-file {
  margin-top: 20px;
  margin-bottom: 20px;
}
.post-content .wp-block-group__inner-container p {
  margin-top: 0 !important;
}

.has-very-light-gray-color.has-very-light-gray-color {
  color: #fff;
  background: #03c785 !important;
}

.wp-block-button {
  margin-bottom: 10px;
}

.wp-block-archives select,
.wp-block-categories select {
  height: 62px;
  width: 200px;
  border: 1px solid #D9EAFD;
  padding: 0 10px;
  margin-bottom: 10px;
  border-radius: 50px;
  background-color: #ffffff;
}

.wp-block-latest-comments {
  padding-left: 0 !important;
}

.wp-block-cover p.wp-block-cover-text,
.wp-block-cover.is-light .wp-block-cover__inner-container {
  color: #fff !important;
}

.wp-block-cover-text a {
  color: #fff;
}

.wp-block-rss {
  padding-left: 0 !important;
}

.widget .wp-block-archives-dropdown,
.widget .wp-block-categories-dropdown,
.widget .wp-block-loginout,
.widget .wp-block-social-links,
.widget.widget_archive select,
.widget.widget_categories select,
.widget.widget_text select,
.widget.widget_search .search-form,
.widget.widget_tag_cloud .tagcloud,
.widget .wp-block-tag-cloud {
  margin-bottom: 6px;
}

.wp-block-latest-posts .wp-block-latest-posts__post-title {
  display: inline-block;
  width: 100%;
}

nav.wp-calendar-nav {
  justify-content: space-between;
  display: flex;
}
nav.wp-calendar-nav a {
  color: #525256;
}
nav.wp-calendar-nav a:hover {
  color: #03c785;
}

.blog-search-content .search-form input {
  width: 50%;
  border: 1px solid #C0C0C0;
}
@media (max-width: 991px) {
  .blog-search-content .search-form input {
    width: 100%;
  }
}

/* Search Widget */
.search-form {
  display: flex !important;
}
.search-form button {
  width: 62px;
  flex-shrink: 0;
}

.wp-block-search {
  margin-bottom: -2px;
}

.wp-block-search,
.search-form {
  display: inline-block;
  width: 100%;
  overflow: hidden;
  gap: 10px;
}
.wp-block-search .wp-block-search__inside-wrapper,
.search-form .wp-block-search__inside-wrapper {
  display: flex;
  padding: 0 !important;
  gap: 10px;
}
.wp-block-search .wp-block-search__inside-wrapper button.wp-block-search__button.wp-element-button,
.search-form .wp-block-search__inside-wrapper button.wp-block-search__button.wp-element-button {
  border-radius: 50px;
  width: unset !important;
  height: unset !important;
}
.wp-block-search .wp-block-search__inside-wrapper button.wp-block-search__button.has-icon.wp-element-button,
.search-form .wp-block-search__inside-wrapper button.wp-block-search__button.has-icon.wp-element-button {
  height: 62px !important;
  width: 62px !important;
  flex-shrink: 0;
}
.wp-block-search label,
.search-form label {
  font-size: 24px;
  display: block;
  line-height: 28px;
  font-weight: 500;
  margin-bottom: 30px;
  color: #292929;
  font-family: var(--yt-font);
}
.wp-block-search input,
.search-form input {
  border: 1px solid #D9EAFD;
  padding: 0 25px;
  height: 60px;
  width: 100%;
  color: #525256;
  font-size: 18px;
  border-radius: 50px;
}
.wp-block-search button,
.search-form button {
  color: #ffffff;
  padding: 0 20px;
  position: relative;
  right: 0;
  background-color: #03c785;
  border-radius: 50%;
  top: 0;
  line-height: 0;
  border: 0;
  margin-left: 0 !important;
}

/*
 Media
============================*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
  border: none;
  margin-bottom: 0;
  margin-top: 0;
  padding: 0;
}

embed,
iframe,
object {
  max-width: 100%;
}

figure.wp-block-embed {
  overflow: hidden;
}

.comment-respond.style-two .wpcf7-form .wpcf7-not-valid-tip {
  color: #d9c0b8 !important;
}
.comment-respond .wpcf7-form .wpcf7-not-valid {
  border-color: #dc3232 !important;
}
.comment-respond .wpcf7-form .wpcf7-not-valid-tip {
  font-size: 16px;
  margin-top: 5px;
}
.comment-respond .wpcf7-form.sent .wpcf7-response-output {
  font-weight: 500;
  font-size: 16px;
  line-height: 21px;
  letter-spacing: -0.01em;
  color: #72DC60;
  padding: 15px 20px;
  text-align: center;
  position: relative;
  background: #F4FFF5;
  border: 1px solid #CDF5C8 !important;
  border-radius: 10px;
}
.comment-respond .wpcf7-form.invalid .wpcf7-response-output {
  font-weight: 500;
  font-size: 16px;
  line-height: 21px;
  letter-spacing: -0.01em;
  color: #dc3232;
  padding: 15px 20px;
  text-align: center;
  position: relative;
  background: #FFF7F7;
  border: 1px solid #FED8D8 !important;
  border-radius: 10px;
}

input[type=checkbox],
input[type=radio] {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
  width: 22px !important;
  height: 22px !important;
  border-color: #e3e4e5;
  border-radius: 6px !important;
  background-color: #e3e4e5 !important;
  transform: scale(1);
  transition: 0.3s;
  position: relative !important;
  padding: 0 !important;
  cursor: pointer;
  margin-top: 0 !important;
  display: flex;
  align-self: center;
  flex-shrink: 0;
  box-shadow: none !important;
}

input[type=radio]::before {
  position: absolute;
  content: "";
  height: 8px;
  width: 8px;
  transition: 0.3s;
  transform: scale(0);
  background-color: #03c785;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
}

input[type=checkbox]::before {
  position: absolute;
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg width='9' height='8' viewBox='0 0 9 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.44899 7.76355C3.36328 7.84971 3.24641 7.89784 3.12495 7.89784C3.00349 7.89784 2.88662 7.84971 2.80091 7.76355L0.213156 5.17534C-0.0554271 4.90676 -0.0554271 4.47134 0.213156 4.20321L0.537198 3.87917C0.805781 3.61059 1.24074 3.61059 1.50932 3.87917L3.12495 5.4948L7.49057 1.12917C7.75916 0.860589 8.19457 0.860589 8.4627 1.12917L8.78674 1.45321C9.05532 1.7218 9.05532 2.15721 8.78674 2.42534L3.44899 7.76355Z' fill='white'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 8px;
  height: 100%;
  width: 100%;
  transition: 0.3s;
  transform: scale(0);
  background-color: #03c785;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
}

input[type=checkbox]:checked::before,
input[type=radio]:checked::before {
  transform: scale(1);
  box-sizing: inherit !important;
}

input[type=checkbox]:checked,
input[type=radio]:checked {
  border-color: #03c785 !important;
}

.wpcf7-form-control {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.wpcf7-form-control .wpcf7-list-item {
  margin: 0;
}
.wpcf7-form-control .wpcf7-list-item label {
  display: flex;
  align-content: center;
  margin: 0;
  gap: 10px;
}
.wpcf7-form-control .wpcf7-list-item label .wpcf7-list-item-label {
  font-size: 16px;
  font-weight: 400;
}

.logged-in .comment-respond textarea {
  margin-bottom: 12px;
}

.zoom-instagram-widget p {
  color: #ffffff;
}
.zoom-instagram-widget p a {
  color: #03c785;
}
.zoom-instagram-widget ul {
  list-style: none;
}
.zoom-instagram-widget ul li {
  color: #ffffff;
}

/* Recent Comment List Block Widget & Latest Post Widget Block */
.has-avatars.has-dates.has-excerpts.wp-block-latest-comments li.wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta,
.has-dates.has-excerpts.wp-block-latest-comments li.wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta {
  font-weight: 500;
  color: #292929;
}
.has-avatars.has-dates.has-excerpts.wp-block-latest-comments li.wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-author,
.has-avatars.has-dates.has-excerpts.wp-block-latest-comments li.wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-link,
.has-dates.has-excerpts.wp-block-latest-comments li.wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-author,
.has-dates.has-excerpts.wp-block-latest-comments li.wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-link {
  font-weight: 500;
}

.wp-block-latest-comments li.wp-block-latest-comments__comment,
.wp-block-latest-posts li.wp-block-latest-comments__comment {
  margin-bottom: 0;
}
.wp-block-latest-comments li .wp-block-latest-comments__comment-meta,
.wp-block-latest-comments li .wp-block-latest-posts__post-title,
.wp-block-latest-posts li .wp-block-latest-comments__comment-meta,
.wp-block-latest-posts li .wp-block-latest-posts__post-title {
  line-height: 28px;
  font-weight: 400;
}
.wp-block-latest-comments li .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-date,
.wp-block-latest-comments li .wp-block-latest-posts__post-title .wp-block-latest-comments__comment-date,
.wp-block-latest-posts li .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-date,
.wp-block-latest-posts li .wp-block-latest-posts__post-title .wp-block-latest-comments__comment-date {
  font-size: 14px !important;
  margin-bottom: 10px;
  position: relative;
  color: #525256;
}
.wp-block-latest-comments li .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-date:before,
.wp-block-latest-comments li .wp-block-latest-posts__post-title .wp-block-latest-comments__comment-date:before,
.wp-block-latest-posts li .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-date:before,
.wp-block-latest-posts li .wp-block-latest-posts__post-title .wp-block-latest-comments__comment-date:before {
  content: "\f274";
  font-family: "Font Awesome 6 Pro";
  padding-right: 8px;
}
.wp-block-latest-comments li a,
.wp-block-latest-posts li a {
  color: #292929;
}
.wp-block-latest-comments li a.wp-block-latest-comments__comment-author, .wp-block-latest-comments li a.wp-block-latest-comments__comment-link,
.wp-block-latest-posts li a.wp-block-latest-comments__comment-author,
.wp-block-latest-posts li a.wp-block-latest-comments__comment-link {
  display: inline !important;
  text-transform: capitalize;
  line-height: 28px;
  font-weight: 400;
}
.wp-block-latest-comments li a:hover,
.wp-block-latest-posts li a:hover {
  color: #03c785;
}
.wp-block-latest-comments li .wp-block-latest-comments__comment-excerpt p,
.wp-block-latest-posts li .wp-block-latest-comments__comment-excerpt p {
  font-size: 16px;
  line-height: 28px;
  margin: 0;
}

body.admin-bar .header-menu-area.sticky_menu {
  top: 30px;
}
@media (max-width: 600px) {
  body.admin-bar .header-menu-area.sticky_menu {
    top: 0;
  }
}

.page-template-default.page-id-146 .page-content p:last-child {
  margin-bottom: 10px;
}
.page-template-default.page-id-156 .page-content-wrapper .page-content > p {
  margin-bottom: 10px;
}
.page-template-default.page-id-1133 .page-content .comment-respond {
  margin-top: 78px;
  display: inline-block;
  width: 100%;
}
.page-template-default.page-id-3 .page-area {
  padding-top: 120px;
}
.page-template-default.page-id-3 .page-area .page-content {
  margin-top: -9px;
}

.post-template-default.postid-163 .blog-details-wrapper .single-post-item .post-content {
  margin-bottom: 34px;
}
.post-template-default.postid-150 .blog-details-wrapper .single-post-item .post-content {
  margin-bottom: 34px;
}
.post-template-default.postid-150 .blog-details-wrapper .single-post-item .post-content .wp-block-group.is-layout-constrained:last-child {
  border: 1px solid #000;
}
.post-template-default.postid-51 .blog-details-wrapper .single-post-item .post-content {
  margin-bottom: 25px;
}
.post-template-default.postid-51 .blog-details-wrapper .single-post-item .post-content p:last-child {
  margin-bottom: 0;
}
.post-template-default.postid-1163 .blog-details-wrapper .single-post-item .post-content .wp-caption, .post-template-default.postid-568 .blog-details-wrapper .single-post-item .post-content .wp-caption {
  margin-top: 20px;
}
.post-template-default.postid-1785 .blog-details-wrapper .single-post-item .post-content .wp-block-button__link {
  color: #ffffff !important;
}
.post-template-default.postid-555 .blog-details-wrapper .single-post-item .post-content .gallery {
  margin-top: 20px;
}
.post-template-default.postid-1786 .blog-details-wrapper .single-post-item .post-title {
  margin-bottom: 20px;
}
.post-template-default.postid-1780 .blog-details-wrapper .single-post-item .wp-block-button {
  margin-top: 20px;
  margin-bottom: 40px;
}

.blog-area .single-post-item.sticky .post-content-wrapper {
  padding: 40px;
}

.error-404.not-found {
  margin-top: -20px;
  margin-bottom: 40px;
}
.error-404.not-found .error-content .error-btn-bh {
  margin-top: 20px;
}

@keyframes MovefadeUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(60px);
    transform: translateY(60px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
.MovefadeUp {
  -webkit-animation-name: MovefadeUp;
  animation-name: MovefadeUp;
}

@-webkit-keyframes ripple {
  70% {
    -webkit-box-shadow: 0 0 0 30px rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 30px rgba(255, 255, 255, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}
@keyframes ripple {
  70% {
    -webkit-box-shadow: 0 0 0 30px rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 30px rgba(255, 255, 255, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}
@-webkit-keyframes pulse {
  to {
    box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
  }
}
@-moz-keyframes pulse {
  to {
    box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
  }
}
@-ms-keyframes pulse {
  to {
    box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
  }
}
@keyframes pulse {
  to {
    box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
  }
}
@-webkit-keyframes animatelinebar {
  0% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
  100% {
    -webkit-transform: translateX(25px);
    transform: translateX(25px);
  }
}
@keyframes animatelinebar {
  0% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
  100% {
    -webkit-transform: translateX(25px);
    transform: translateX(25px);
  }
}
@-webkit-keyframes slideUpIn {
  0% {
    -webkit-transform: translateY(40px);
  }
  100% {
    -webkit-transform: translateY(0);
  }
  0% {
    -webkit-transform: translateY(40px);
  }
}
@keyframes slideUpIn {
  0% {
    transform: translateY(40px);
  }
  100% {
    transform: translateY(0);
  }
  0% {
    transform: translateY(40px);
  }
}
@-webkit-keyframes MoveLeftRight {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-20px);
  }
}
@keyframes MoveLeftRight {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-20px);
  }
}
@-webkit-keyframes MoveUpDown {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-30px);
  }
}
@keyframes MoveUpDown {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-30px);
  }
}
@-webkit-keyframes Animated3 {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-20px);
  }
}
@keyframes Animated3 {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-20px);
  }
}
@-webkit-keyframes Animated4 {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-10px);
  }
}
@keyframes Animated4 {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-10px);
  }
}
@keyframes UpToDown {
  49% {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
  }
  50% {
    opacity: 0;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
  }
  51% {
    opacity: 1;
  }
}
@keyframes Scroll {
  0% {
    transform: translateX(-50vw);
    transform: translateX(-50vw);
  }
  100% {
    transform: translateX(50vw);
    transform: translateX(50vw);
  }
}
@keyframes spin {
  100% {
    transform: rotate(359deg);
  }
}
@keyframes borderAnimation {
  from {
    background-position: 0 0, -23px 0, 100% -23px, 0 100%;
  }
  to {
    background-position: 0 -23px, 0 0, 100% 0, -23px 100%;
  }
}
@keyframes icon-bounce {
  0%, 100%, 20%, 50%, 80% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-20px);
  }
  60% {
    transform: translateY(-10px);
  }
}
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  background-color: #fff;
  z-index: 9999999;
  right: 0;
  bottom: 0;
}

#preloader-status {
  height: 210px;
  width: 210px;
  background-repeat: no-repeat;
  background-position: center;
  margin: -100px 0 0 -100px;
  position: absolute;
  left: 50%;
  top: 50%;
}

.scrollup-wrapper {
  position: fixed;
  right: 40px;
  bottom: 20px;
  z-index: 9999;
}

.scrollup-btn {
  display: flex;
  align-content: center;
  justify-content: center;
  font-size: 26px;
  color: #292929;
  text-decoration: none;
  width: 50px;
  height: 50px;
  background-color: #03c785;
  border-radius: 50px;
  align-items: center;
  cursor: pointer;
}
.scrollup-btn i {
  margin-top: -3px;
  display: block;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-area.style-4 .search-btn-with-btn .cta-btn {
    display: none;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .header-area.style-4 .search-btn-with-btn .cta-btn {
    display: none;
  }
}
.header-area.style-1 .header-menu-area {
  top: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-area.style-1 .search-btn-with-btn .search-input {
    display: none;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .header-area.style-1 .search-btn-with-btn .search-input {
    display: none;
  }
}
.header-area.style-1 .search-btn-with-btn .search-btn-wrapper .search-btn {
  border-color: #292929;
  background-color: transparent;
}

.header-top {
  background-color: #025e43;
  display: flex;
  align-items: center;
  gap: 5px 20px;
  justify-content: space-between;
  padding: 4px 40px;
  flex-wrap: wrap;
}
@media (max-width: 991px) {
  .header-top {
    display: none;
  }
}
.header-top .header-top-content {
  display: flex;
  align-items: center;
  gap: 5px 30px;
  flex-wrap: wrap;
}
.header-top .header-top-slogan {
  color: #ffffff;
}
.header-top .header-top-info {
  display: flex;
  gap: 0 24px;
}
@media (max-width: 1199px) {
  .header-top .header-top-info {
    justify-content: space-between;
    width: 100%;
  }
}
@media (max-width: 991px) {
  .header-top .header-top-info {
    padding-bottom: 10px;
  }
}
.header-top .header-contact-info {
  display: flex;
  align-items: center;
  gap: 0 24px;
  padding: 6px 0;
  flex-wrap: wrap;
}
.header-top .header-contact-info span {
  display: flex;
  align-items: center;
  gap: 24px;
  color: #ffffff;
  font-size: 16px;
  font-weight: 400;
  font-family: var(--yt-font);
}
.header-top .header-contact-info span:first-child:before {
  display: none;
}
.header-top .header-contact-info span:before {
  background-color: rgb(255, 255, 255);
  opacity: 0.361;
  width: 1px;
  display: inline-flex;
  height: 12px;
  content: "";
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .header-top .header-contact-info span:before {
    display: none;
  }
}
.header-top .header-contact-info span.contact-info-item {
  gap: 0 10px !important;
}
.header-top .header-contact-info span a {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #ffffff;
  font-size: 16px;
  font-weight: 400;
  font-family: var(--yt-font);
}
.header-top .social-profile {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: flex-end;
}
.header-top .social-profile .social-profile-title {
  color: #ffffff;
}
.header-top .social-profile a {
  font-size: 16px;
  color: #ffffff;
  transition: 0.3s;
  transform: scale(1);
  background-color: transparent;
}
.header-top .social-profile a:hover {
  transition: all 0.5s ease-out;
  transform: scale(1.4);
}

.header-menu-area {
  position: fixed;
  top: 20px;
  left: 0;
  width: 100%;
  z-index: 999;
  padding: 0 30px;
  transition: all 0.5s ease-out;
}
.header-menu-area .search-btn-with-btn {
  gap: 16px;
}
@media (max-width: 991px) {
  .header-menu-area .search-btn-with-btn {
    display: none;
  }
}
.header-menu-area .search-btn-with-btn .search-input {
  display: flex;
  border: 1.5px solid #292929;
  border-radius: 50px;
  align-self: stretch;
  align-items: center;
  padding: 0 20px;
}
.header-menu-area .search-btn-with-btn .search-input input {
  background-color: transparent;
}
.header-menu-area .search-btn-with-btn .search-input .search-input-btn {
  background-color: transparent;
  font-size: 20px;
  color: #292929;
  padding: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-menu-area .search-btn-with-btn .btn-wrapper {
    display: none;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .header-menu-area .search-btn-with-btn .btn-wrapper i {
    display: none;
  }
}
.header-menu-area .search-btn-with-btn .search-btn-wrapper .search-btn {
  color: #fff;
  align-self: stretch;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 56px;
  width: 56px;
  font-size: 18px;
  border: 1.5px solid #03c785;
  background-color: #03c785;
  border-radius: 50px;
}
.header-menu-area .search-btn-with-btn .search-btn-wrapper .search-btn:hover {
  background-color: #025f43;
  color: #ffffff;
  border-color: #025f43;
}
.header-menu-area .search-btn-with-btn .search-btn-wrapper .search-btn:hover i{ color: #fff;}
.header-menu-area.sticky-header {
  width: 100%;
  z-index: 999;
  transition: all 0.4s ease 0s;
}
.header-menu-area.sticky-header.sticky_menu .search-btn-wrapper .search-btn {
  color: #fff;
}
.header-menu-area.sticky-header.sticky_menu .search-btn-wrapper .search-btn:hover {
  color: #025e43;
}
.header-menu-area.sticky_menu {
  left: 0;
  right: 0;
  top: 0;
  position: fixed;
  z-index: 9999;
  background-color: #ffffff;
  box-shadow: 0 7px 24px 0 rgba(0, 0, 0, 0.05);
}
.header-menu-area.sticky_menu .logo {
  height: 84px;
}
.header-menu-area.sticky_menu .logo:before {
  display: none;
}
.header-menu-area.sticky_menu .logo .standard-logo {
  display: none;
}
.header-menu-area.sticky_menu .logo .sticky-logo {
  display: block;
}
.header-menu-area.sticky_menu .logo .sticky-logo img {
  transition: all 0.5s ease-out;
}
.header-menu-area.sticky_menu .main-menu ul li.active > a, .header-menu-area.sticky_menu .main-menu ul li.current-menu-ancestor > a {
  color: #025e43;
}
.header-menu-area.sticky_menu .main-menu ul li.active > a:after, .header-menu-area.sticky_menu .main-menu ul li.current-menu-ancestor > a:after {
  display: none;
}
.header-menu-area.sticky_menu .main-menu ul li a {
  padding: 27px 24px;
  color: #292929;
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-menu-area.sticky_menu .main-menu ul li a {
    padding: 27px 15px;
  }
}
.header-menu-area.sticky_menu .main-menu ul li a:hover {
  color: #025e43;
}
.header-menu-area.sticky_menu .main-menu ul li ul.submenu li.active > a {
  color: #ffffff;
}
.header-menu-area.sticky_menu .main-menu ul li ul li a {
  padding: 10px 20px;
}
.header-menu-area.sticky_menu .main-menu ul li ul li a:hover {
  color: #ffffff;
}
.header-menu-area.sticky_menu .ct-header-btn .content-wrapper span {
  color: #292929;
}
.header-menu-area .logo {
  position: relative;
  z-index: 999;
  height: 116px;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-menu-area .logo {
    height: 100px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .header-menu-area .logo {
    height: 80px;
  }
}
.header-menu-area .logo .standard-logo img {
  transition: all 0.5s ease-out;
}
.header-menu-area .logo .sticky-logo {
  display: none;
}
.header-menu-area .logo .sticky-logo img {
  transition: all 0.5s ease-out;
}
.header-menu-area .logo .retina-logo {
  display: none;
}

.main-menu ul {
  margin: 0;
  padding: 0;
  position: relative;
}
.main-menu ul li {
  display: inline-block;
  padding: 0;
  position: relative;
}
.main-menu ul li.active, .main-menu ul li.current-menu-ancestor {
  position: relative;
}
.main-menu ul li.active > a, .main-menu ul li.current-menu-ancestor > a {
  color: #035d47;
}
.main-menu ul li.dropdown > a {
  padding-right: 30px !important;
}
.main-menu ul li.dropdown > a:before {
  visibility: visible;
}
.main-menu ul li.dropdown .dropdown > a:before {
  visibility: visible;
  right: 15px;
  transform: rotate(-90deg);
  margin-top: -4px;
}
.main-menu ul li ul.submenu li.active > a {
  position: relative;
  z-index: 2;
  background-color: #025e43;
  color: #ffffff !important;
}
.main-menu ul li ul.submenu li.active > a:after {
  display: none;
}
.main-menu ul li a {
  display: block;
  padding: 42px 14px;
  text-decoration: none;
  text-transform: capitalize;
  transition: all 0.5s ease-out;
  position: relative;
  color: #292929;
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 500;
}
.main-menu ul li a:before {
  position: absolute;
  content: "\f107";
  font-family: "Font Awesome 6 Pro";
  display: inline-block;
  padding: 3px;
  font-size: 14px;
  top: 50%;
  right: 6px;
  line-height: 0;
  visibility: hidden;
}
.main-menu ul li a:hover {
  color: #025e43;
}
.main-menu ul li:hover > ul {
  visibility: visible;
  transition: all 300ms ease;
  opacity: 1;
  transform: scaleY(1);
}
.main-menu ul li ul li:hover ul {
  visibility: visible;
  top: -2px;
}
.main-menu ul ul {
  background-color: #ffffff;
  left: 0;
  opacity: 0;
  position: absolute;
  text-align: left;
  top: 100%;
  visibility: hidden;
  z-index: 99999;
  transition: all 300ms ease;
  border-top: 2px solid #03c588;
  box-shadow: 0px 10px 20px 0px rgba(8, 0, 42, 0.08);
  transform-origin: top;
  transform: scaleY(0);
  padding: 20px;
  border-radius: 9px;
}
.main-menu ul ul li {
  float: none;
  min-width: 210px;
}
.main-menu ul ul li ul {
  visibility: hidden;
}
.main-menu ul ul li i {
  float: right;
}
.main-menu ul ul li a {
  line-height: initial;
  padding: 10px 0;
  color: #292929;
  margin-left: 0;
  font-size: 16px;
  border-radius: 50px;
  transition: all 0.5s ease-out;
}
.main-menu ul ul li a:hover {
  background-color: #025e43;
  color: #ffffff;
  padding: 10px 20px;
  transition: all 0.5s ease-out;
}
.main-menu ul ul li:last-child a {
  border-bottom: 0;
}
.main-menu ul ul ul {
  left: 100%;
  transition: all 0.3s ease 0s;
  opacity: 0;
  border-top: 0px;
  border-top: 2px solid #025e43;
}

.animation {
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

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

.search-btn-with-btn {
  display: flex;
  align-items: center;
  margin-left: auto;
}
.search-btn-with-btn .cta-btn {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-right: 8px;
}
.search-btn-with-btn .cta-btn .icon {
  font-size: 20px;
  font-weight: 600;
  color: #292929;
}
.search-btn-with-btn .cta-btn .btn-content {
  display: flex;
  flex-direction: column;
  text-align: left;
}
.search-btn-with-btn .cta-btn .btn-content .phone-number {
  font-size: 20px;
  font-weight: 600;
  font-family: var(--yt-font);
  color: #292929;
}
.search-btn-with-btn .cta-btn-wrapper .theme-btn {
  padding: 16px 34px;
  font-size: 18px;
  gap: 10px;
  display: flex;
  align-items: center;
}

.search-form-wrapper {
  position: fixed;
  width: 100%;
  height: 0;
  left: 0;
  top: 0;
  background-color: rgba(0, 0, 0, 0.6);
  opacity: 0;
  z-index: 999;
  visibility: hidden;
  transition: all 0.5s ease-out;
}
.search-form-wrapper.active {
  visibility: visible;
  opacity: 1;
  height: 100%;
  transition: all 0.5s ease-out;
}
.search-form-wrapper .search-form-inner {
  width: 768px;
  position: relative;
  top: 50%;
  transform: translate(-50%, -50%);
  left: 50%;
}
.search-form-wrapper .search-form-inner .search-content-filed {
  display: flex;
  align-items: center;
  gap: 30px;
}
.search-form-wrapper .search-form-inner .search-content-filed .search-close {
  cursor: pointer;
  font-size: 30px;
  color: #ffffff;
}
.search-form-wrapper .search-form-inner .search-form {
  background: #FFFFFF;
  box-shadow: 0 30px 70px rgba(208, 225, 242, 0.3);
  padding: 15px 30px;
  flex: 1;
  border-radius: 9px;
}
.search-form-wrapper .search-form-inner .search-form .search-form-input {
  display: flex;
  align-items: center;
  width: 100%;
}
.search-form-wrapper .search-form-inner .search-form .search-form-input .theme-btn {
  display: inline-block;
  height: 100%;
  width: auto;
  padding: 0 40px;
  border-radius: 9px;
  background-color: #03c785;
  color: #fff;
}
.search-form-wrapper .search-form-inner .search-form .search-form-input .search-icon {
  display: flex;
}
.search-form-wrapper .search-form-inner .search-form .search-form-input button.submit-search-btn {
  padding: 15px 24px !important;
}
.search-form-wrapper .search-form-inner .search-form input[type=search] {
  margin-top: 0 !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 12px !important;
  flex-grow: 1;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-area.style-2 .search-btn-with-btn .cta-btn {
    display: none;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .header-area.style-2 .search-btn-with-btn .cta-btn {
    display: none;
  }
}
.header-area.style-2 .header-menu-area {
  top: 19px;
  padding: 0 30px;
}
.header-area.style-2 .header-menu-area .border-radius-shape {
  position: absolute;
  bottom: -35px;
  right: 20px;
}
@media (max-width: 1199px) {
  .header-area.style-2 .header-menu-area .border-radius-shape {
    display: none;
  }
}
@media (max-width: 991px) {
  .header-area.style-2 .header-menu-area .mobile-menu-bar a i {
    color: #ffffff;
  }
}
.header-area.style-2 .header-menu-area.sticky_menu {
  top: 0;
}
.header-area.style-2 .header-menu-area.sticky_menu .border-radius-shape,
.header-area.style-2 .header-menu-area.sticky_menu .border-radius-top-shape {
  visibility: hidden;
  opacity: 0;
}
@media (max-width: 991px) {
  .header-area.style-2 .header-menu-area.sticky_menu .mobile-menu-bar a i {
    color: #292929;
  }
}
@media (max-width: 1199px) {
  .header-area.style-2 .header-menu-area.sticky_menu .main-menu ul li a {
    color: #292929;
  }
}
@media (max-width: 1199px) {
  .header-area.style-2 .header-menu-area.sticky_menu .main-menu ul li ul li a {
    color: #292929;
  }
}
.header-area.style-2 .main-menu-wrapper {
  background-color: #ffffff;
  position: relative;
}
@media (max-width: 1199px) {
  .header-area.style-2 .main-menu-wrapper {
    background-color: transparent;
  }
}
.header-area.style-2 .main-menu-wrapper:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  right: -100%;
  margin-left: -10px;
  top: 0;
  background-color: #fff;
}
@media (max-width: 1199px) {
  .header-area.style-2 .main-menu-wrapper:before {
    display: none;
  }
}
.header-area.style-2 .main-menu-wrapper .border-radius-top-shape,
.header-area.style-2 .main-menu-wrapper .border-radius-bottom-shape {
  position: absolute;
}
.header-area.style-2 .main-menu-wrapper .border-radius-top-shape {
  top: 0px;
  left: -92px;
}
@media (max-width: 1199px) {
  .header-area.style-2 .main-menu-wrapper .border-radius-top-shape {
    display: none;
  }
}
@media (max-width: 1199px) {
  .header-area.style-2 .main-menu ul li a {
    color: #ffffff;
  }
}
@media (max-width: 1199px) {
  .header-area.style-2 .main-menu ul li ul li a {
    color: #292929;
  }
}

.header-area.style-3 .header-menu-area {
  top: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-area.style-3 .search-btn-with-btn .cta-btn-wrapper {
    display: none;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .header-area.style-3 .search-btn-with-btn .cta-btn-wrapper {
    display: none;
  }
}

.mean-container a.meanmenu-reveal {
  display: none;
}

.mean-container .mean-nav {
  background: none;
}

.mean-container .mean-bar {
  padding: 0;
  min-height: auto;
  background: none;
}

.mean-container .mean-nav > ul {
  padding: 0;
  margin: 0;
  width: 100%;
  list-style-type: none;
  display: block !important;
}

.mean-container a.meanmenu-reveal {
  display: none !important;
}

.mean-container .mean-nav ul li a {
  width: 100%;
  padding: 10px 0;
  color: #ffffff;
  border-top: 1px solid #C0C0C0;
  font-size: 16px;
  text-transform: capitalize;
  line-height: 1.5;
  font-weight: 500;
}

.mean-container .mean-nav ul li a.mean-expand {
  /* 原来用 margin-top:5px 顶着，行高变了（译文变长/字重不同）就会忽高忽低，
     截图里 Product 那行的「+」看着贴在上边缘。改成相对整行垂直居中。 */
  margin-top: 0;
  padding: 0 !important;
  border: 1px solid #C0C0C0 !important;
  height: 30px;
  width: 30px;
  line-height: 30px;
  color: #ffffff;
  top: 50%;
  transform: translateY(-50%);
  font-weight: 400;
}

.mean-container .mean-nav ul li > a > i {
  display: none;
}

.mean-container .mean-nav ul li > a.mean-expand i {
  display: inline-block;
}

.mean-container .mean-nav > ul > li:first-child > a {
  border-top: 0;
}

.mean-container .mean-nav ul li.dropdown-opened a.mean-expand.mean-clicked {
  background-color: #03c785;
  border-color: #03c785 !important;
}

.mean-container .mean-nav ul li.dropdown-opened a.mean-expand.mean-clicked i {
  color: #292929;
}

.mean-container .mean-nav ul li a.mean-expand.mean-clicked {
  color: #292929;
}

.mean-container .mean-nav ul li a.mean-expand.mean-clicked i {
  transform: rotate(45deg);
  color: #292929;
}

/* 展开态对齐修复：子菜单展开后 <li> 高度会从 45px 涨到整块（含子菜单），
   而上面 a.mean-expand 用的是 top:50% + translateY(-50%)，会按整块高度居中，
   于是「−」按钮被推到子菜单中间、压住某一项（典型表现：绿色方块压住
   Fruit & Vegetable Powder）。展开态改成从 li 顶部定位，钉在父级那一行：
   首行高 45px = 上边框 1 + 上下 padding 20 + 行高 24，按钮 30px，
   故 margin-top = (45 - 30) / 2 = 7px（不用 em，.mean-expand 带内联 font-size:18px）。 */
.mean-container .mean-nav ul li.dropdown-opened > a.mean-expand {
  top: 0;
  transform: none;
  margin-top: 7px;
}

.mobile-menu-bar a {
  display: flex;
  align-items: center;
  justify-content: center;
}
.mobile-menu-bar a i {
  color: #292929;
  font-size: 22px;
}

.menu-sidebar-area {
  position: fixed;
  right: -485px;
  top: 0;
  width: 465px;
  height: 100%;
  background-color: #292929;
  overflow-y: scroll;
  transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  z-index: 9999;
}
@media (max-width: 560px) {
  .menu-sidebar-area {
    width: 350px;
  }
}
.menu-sidebar-area .menu-sidebar-logo {
  display: inline-block;
  width: 180px;
}
.menu-sidebar-area .menu-sidebar-wrapper {
  position: relative;
  padding: 40px;
}
.menu-sidebar-area.active {
  right: 0;
}
.menu-sidebar-area .menu-sidebar-close {
  position: absolute;
  top: 40px;
  right: 40px;
}
.menu-sidebar-area .menu-sidebar-close .menu-sidebar-close-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  height: 45px;
  width: 45px;
  border-radius: 50px;
  background-color: #03c785;
  color: #292929;
  transition: all 0.5s ease-out;
}
.menu-sidebar-area .menu-sidebar-close .menu-sidebar-close-btn:hover {
  background-color: #ffffff;
  color: #292929;
  transition: all 0.5s ease-out;
}
.menu-sidebar-area .menu-sidebar-content .menu-sidebar-single-widget {
  display: inline-block;
  margin-top: 20px;
  width: 100%;
  border-bottom: 1px solid #C0C0C0;
}
.menu-sidebar-area .menu-sidebar-content .menu-sidebar-single-widget:last-child {
  border-bottom: 0;
}
.menu-sidebar-area .menu-sidebar-content .menu-sidebar-single-widget .menu-sidebar-title {
  margin-bottom: 5px;
  color: #ffffff;
}
.menu-sidebar-area .menu-sidebar-content .menu-sidebar-single-widget .header-contact-info {
  display: flex;
  align-items: center;
  gap: 0 24px;
  padding: 6px 0;
  flex-wrap: wrap;
  flex-direction: column;
  color: #ffffff;
}
.menu-sidebar-area .menu-sidebar-content .menu-sidebar-single-widget .header-contact-info span {
  display: flex;
  align-items: center;
  gap: 13px;
  color: #ffffff;
  font-size: 16px;
  font-weight: 400;
  font-family: var(--yt-font);
  width: 100%;
}
.menu-sidebar-area .menu-sidebar-content .menu-sidebar-single-widget .header-contact-info span.contact-info-item {
  gap: 0 10px !important;
}
.menu-sidebar-area .menu-sidebar-content .menu-sidebar-single-widget .header-contact-info span a {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #ffffff;
  font-size: 16px;
  font-weight: 400;
  font-family: var(--yt-font);
}
.menu-sidebar-area .menu-sidebar-content .menu-sidebar-single-widget .header-contact-info span a:hover {
  color: #03c785;
}
.menu-sidebar-area .menu-sidebar-content .menu-sidebar-single-widget .social-profile {
  margin-top: 20px;
  border-top: 1px solid #dfe2e9;
  width: 100%;
  padding-top: 20px;
}
.menu-sidebar-area .menu-sidebar-content .menu-sidebar-single-widget .social-profile a {
  color: #292929;
  font-size: 22px;
  background-color: #ffffff;
  transition: all 0.5s ease-out;
  transform: scale(1);
}
.menu-sidebar-area .menu-sidebar-content .menu-sidebar-single-widget .social-profile a:hover {
  transform: scale(1.1);
  transition: all 0.5s ease-out;
}

.body-overlay {
  background-color: rgba(0, 0, 0, 0.6);
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 999;
  left: 0;
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s ease-out;
}
.body-overlay.active {
  opacity: 1;
  visibility: visible;
}
.body-overlay:hover {
  cursor: pointer;
}

.section-title {
  margin-bottom: 60px;
  display: flex;
  flex-direction: column;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .section-title {
    margin-bottom: 40px;
  }
}
.section-title .short-title-wrapper {
  border-bottom: 1px solid #C0C0C0;
  margin-bottom: 24px;
  padding-bottom: 6px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .section-title .short-title-wrapper {
    padding-bottom: 10px;
    margin-bottom: 18px;
  }
}
.section-title .short-title-wrapper .short-title {
  font-family: var(--yt-font);
  font-size: 16px;
  font-weight: 700;
  line-height: 22.4px;
  letter-spacing: -0.24px;
  text-transform: uppercase;
  color: #292929;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.section-title .main-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .section-title .main-content {
    flex-direction: column;
    align-items: start;
    gap: 24px;
  }
}
.section-title .sec-content {
  display: flex;
  flex-direction: column;
  z-index: 2;
  position: relative;
}
.section-title .sec-content .desc {
  margin-top: 24px;
  margin-bottom: 0;
}
@media (max-width: 550px) {
  .section-title .sec-content {
    width: 100%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-title .sec-content .sec-desc p br {
    display: none;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .section-title .sec-content .sec-desc p br {
    display: none;
  }
}
.section-title .sec-content .title,
.section-title .sec-content .desc,
.section-title .sec-content .btn-wrapper {
  -webkit-animation-name: MovefadeUp;
  animation-name: MovefadeUp;
  -webkit-animation-fill-mode: both;
}
.section-title .sec-content .title {
  animation-delay: 0.7s;
  animation-duration: 0.7s;
  transition: all 0.5s ease-out;
}
.section-title .sec-content .desc {
  animation-delay: 0.9s;
  animation-duration: 0.9s;
  transition: all 0.5s ease-out;
}
.section-title .sec-content .btn-wrapper {
  animation-delay: 1s;
  animation-duration: 1s;
  transition: all 0.5s ease-out;
}
.section-title .title {
  font-family: var(--yt-font);
  font-size: 64px;
  font-weight: 600;
  line-height: 77px;
  letter-spacing: -0.96px;
  color: #292929;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .section-title .title {
    font-size: 48px;
    line-height: 60px;
    letter-spacing: -0.72px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-title .title {
    font-size: 48px;
    line-height: 60px;
    letter-spacing: -0.72px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1024px) {
  .section-title .title {
    font-size: 47px;
    line-height: 58px;
    letter-spacing: -0.72px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-title .title {
    font-size: 38px;
    line-height: 48px;
    letter-spacing: -0.34px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .section-title .title {
    font-size: 32px;
    line-height: 42px;
    letter-spacing: -0.24px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .section-title .title {
    font-size: 28px;
    line-height: 42px;
    letter-spacing: -0.24px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .section-title .title br {
    display: none;
  }
}
.section-title .title span {
  color: #03c785;
}
.section-title .desc {
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 400;
  line-height: 32px;
  color: #525256;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .section-title .desc {
    font-size: 16px;
    line-height: 30px;
  }
}

.slider-area.style-1 {
  padding-top: 50px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .slider-area.style-1 {
    padding-top: 40px;
  }
}
.slider-area.style-1 .section-title {
  margin-bottom: 0;
}
.slider-area.style-1 .section-title .title {
  font-size: 65px;
  line-height: 90px;
  letter-spacing: -1.425px; margin-top: 15px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .slider-area.style-1 .section-title .title {
    font-size: 70px;
    line-height: 76px;
    letter-spacing: -0.96px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-area.style-1 .section-title .title {
    font-size: 48px;
    line-height: 58px;
    letter-spacing: -0.72px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-area.style-1 .section-title .title {
    font-size: 64px;
    line-height: 76px;
    letter-spacing: -0.96px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .slider-area.style-1 .section-title .title {
    font-size: 48px;
    line-height: 58px;
    letter-spacing: -0.72px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .slider-area.style-1 .section-title .title {
    font-size: 32px;
    line-height: 48px;
    letter-spacing: -0.34px;
  }
}
.slider-area.style-1 .section-title .sec-desc {
  margin-top: 22px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .slider-area.style-1 .section-title .sec-desc {
    margin-left: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-area.style-1 .section-title .sec-desc {
    margin-top: 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-area.style-1 .section-title .sec-desc {
    margin-top: 40px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .slider-area.style-1 .section-title .sec-desc {
    margin-top: 20px;
  }
}
.slider-area.style-1 .section-title .sec-desc .desc {
  margin-bottom: 32px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-area.style-1 .section-title .sec-desc .desc {
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-area.style-1 .section-title .sec-desc .desc {
    max-width: 570px;
    margin-bottom: 24px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .slider-area.style-1 .section-title .sec-desc .desc {
    margin-bottom: 24px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .slider-area.style-1 .section-title .sec-desc .desc {
    font-size: 16px;
    line-height: 24px;
  }
}

.slider-area.style-2 {
  border-radius: 30px;
  overflow: hidden;
  margin: 20px 20px 0 20px;
}
.slider-area.style-2:hover .slider-wrapper-six .slick-arrow.prev-btn {
  transform: translateX(0);
}
.slider-area.style-2:hover .slider-wrapper-six .slick-arrow.next-btn {
  transform: translateX(0);
}
.slider-area.style-2 .slider-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.slider-area.style-2 .slider-bg img {
  width: 100%;
  height: 100%;
  padding: 0;
}
.slider-area.style-2 .slider-wrapper-six:hover .slick-arrow.prev-btn {
  transform: translateX(0);
}
.slider-area.style-2 .slider-wrapper-six:hover .slick-arrow.next-btn {
  transform: translateX(0);
}
.slider-area.style-2 .slider-wrapper-six .slick-arrow {
  position: absolute;
  top: 50%;
  z-index: 1;
  transform: translate(0, -100%);
  width: 72px;
  height: 72px;
  font-size: 24px;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #ffffff;
  color: #ffffff;
  background-color: transparent;
  transition: all 0.5s ease-out;
}
.slider-area.style-2 .slider-wrapper-six .slick-arrow.prev-btn {
  left: 80px;
  transform: translateX(-150px);
}
.slider-area.style-2 .slider-wrapper-six .slick-arrow.next-btn {
  right: 80px;
  transform: translateX(150px);
}
.slider-area.style-2 .slider-wrapper-six .slick-arrow:hover {
  background-color: #03c785;
  color: #292929;
  border: 1px solid #03c785;
  transition: all 0.5s ease-out;
}
.slider-area.style-2 .slider-wrapper-six .slick-dots {
  margin: 45px 0 30px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .slider-area.style-2 .slider-wrapper-six .slick-dots {
    padding-right: 24px;
    margin: 24px 0 0;
  }
}
.slider-area.style-2 .single-slider-wrapper {
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
  height: 940px;
  width: 100%;
  display: flex;
  align-items: center;
  border-radius: 30px;
}
@media (max-width: 1199px) {
  .slider-area.style-2 .single-slider-wrapper {
    height: 740px;
  }
}
.slider-area.style-2 .single-slider-wrapper .slider-overlay {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  border-radius: 30px;
  z-index: 1;
}
.slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom {
  position: absolute;
  bottom: 0;
  right: 0;
  background-color: #ffffff;
  border-radius: 30px 0 0 0;
  width: 264px;
  height: 135px;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  z-index: 2;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom {
    bottom: -1px;
    right: -1px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom {
    width: 245px;
    height: 115px;
  }
}
.slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom .sticky-right {
  position: absolute;
  top: -34px;
  right: 0;
  transform: rotate(90deg);
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom .sticky-right {
    top: -34px;
  }
}
.slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom .sticky-bottom {
  position: absolute;
  bottom: 0px;
  left: -34px;
  transform: rotate(90deg);
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom .sticky-bottom {
    left: -34px;
  }
}
.slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom .review-card {
  padding: 16px 24px;
  background-color: #03c785;
  border-radius: 25px;
  width: 240px;
  height: 110px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom .review-card {
    width: 230px;
    height: 100px;
  }
}
.slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom .review-card .title {
  font-weight: 600;
  font-size: 36px;
  line-height: 46.8px;
  letter-spacing: -0.54px;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom .review-card .title {
    line-height: 34.8px;
  }
}
.slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom .review-card .desc {
  margin: 0;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom .review-card .desc {
    font-size: 16px;
  }
}
.slider-area.style-2 .single-slider-wrapper.slick-active .single-slider {
  position: relative;
  z-index: 2;
}
.slider-area.style-2 .single-slider-wrapper .slider-content-wrapper {
  margin: 0;
  z-index: 10;
}
.slider-area.style-2 .single-slider-wrapper .slider-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 92px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-area.style-2 .single-slider-wrapper .slider-content {
    padding: 0 18px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-area.style-2 .single-slider-wrapper .slider-content {
    padding: 0 70px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .slider-area.style-2 .single-slider-wrapper .slider-content {
    text-align: start;
    padding: 0 20px;
  }
}
.slider-area.style-2 .single-slider-wrapper .slider-content .slider-short-title {
  color: #03c785;
  animation-delay: 0.3s;
  animation-duration: 0.3s;
  transition: all 0.5s ease-out;
}
.slider-area.style-2 .single-slider-wrapper .slider-content .slider-title {
  font-size: 95px;
  font-weight: 600;
  line-height: 104.5px;
  letter-spacing: -1.425px;
  margin-bottom: 24px;
  animation-delay: 0.5s;
  animation-duration: 0.5s;
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .slider-area.style-2 .single-slider-wrapper .slider-content .slider-title {
    font-size: 80px;
    line-height: 96px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-area.style-2 .single-slider-wrapper .slider-content .slider-title {
    font-size: 58px;
    line-height: normal;
  }
}
@media (max-width: 991px) {
  .slider-area.style-2 .single-slider-wrapper .slider-content .slider-title {
    font-size: 54px;
    line-height: normal;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .slider-area.style-2 .single-slider-wrapper .slider-content .slider-title {
    font-size: 42px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .slider-area.style-2 .single-slider-wrapper .slider-content .slider-title {
    font-size: 28px;
  }
}
.slider-area.style-2 .single-slider-wrapper .slider-content .slider-short-desc {
  margin-bottom: 40px;
  animation-delay: 0.7s;
  animation-duration: 0.7s;
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .slider-area.style-2 .single-slider-wrapper .slider-content .slider-short-desc {
    font-size: 16px;
    line-height: 30px;
  }
}
@media (max-width: 1399px) {
  .slider-area.style-2 .single-slider-wrapper .slider-content .slider-short-desc br {
    display: none;
  }
}
.slider-area.style-2 .single-slider-wrapper .slider-content .btn-wrapper {
  /* 原来是写死 264px，但「Learn More」195.81 + 圆按钮 74 = 269.81，
     差 5.81px 会被 flex 从圆按钮上扣掉（宽 68.19 / 高 74 → 椭圆）。改成按内容撑开。 */
  width: max-content;
  max-width: 100%;
  justify-content: center;
  margin: 0;
  animation-delay: 0.9s;
  animation-duration: 0.9s;
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .slider-area.style-2 .single-slider-wrapper .slider-content .btn-wrapper {
    margin-bottom: 60px;
  }
}
.slider-area.style-2 .single-slider-wrapper .slider-content .btn-wrapper:hover .theme-btn,
.slider-area.style-2 .single-slider-wrapper .slider-content .btn-wrapper:hover .circle-arrow-btn {
  background-color: #ffffff;
  color: #292929;
  transition: all 0.5s ease-out;
}
.slider-area.style-2 .slick-active .slider-content .slider-short-title,
.slider-area.style-2 .slick-active .slider-content .slider-title,
.slider-area.style-2 .slick-active .slider-content .slider-short-desc,
.slider-area.style-2 .slick-active .slider-content .slider-btn-wrapper,
.slider-area.style-2 .slick-active .slider-content .btn-wrapper {
  -webkit-animation-name: MovefadeUp;
  animation-name: MovefadeUp;
  -webkit-animation-fill-mode: both;
}
.slider-area.style-2 .slick-active .slider-content .slider-short-title {
  animation-delay: 0.3s;
  animation-duration: 0.3s;
  transition: all 0.5s ease-out;
}
.slider-area.style-2 .slick-active .slider-content .slider-title {
  animation-delay: 0.5s;
  animation-duration: 0.5s;
  transition: all 0.5s ease-out;
}
.slider-area.style-2 .slick-active .slider-content .slider-short-desc {
  animation-delay: 0.7s;
  animation-duration: 0.7s;
  transition: all 0.5s ease-out;
}
.slider-area.style-2 .slick-active .slider-content .slider-btn-wrapper, .slider-area.style-2 .slick-active .slider-content .btn-wrapper {
  animation-delay: 0.9s;
  animation-duration: 0.9s;
  transition: all 0.5s ease-out;
}

.slider-area.style-3 {
  padding-top: 120px;
  background-color: transparent;
}
.slider-area.style-3 .section-title {
  margin-bottom: 0;
}
.slider-area.style-3 .section-title .title {
  color: #292929;
  font-family: var(--yt-font);
  font-size: 95px;
  font-weight: 600;
  line-height: 105px;
  letter-spacing: -1.425px;
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .slider-area.style-3 .section-title .title {
    font-size: 70px;
    line-height: 86px;
    letter-spacing: -0.92px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-area.style-3 .section-title .title {
    font-size: 58px;
    line-height: normal;
  }
}
@media (max-width: 991px) {
  .slider-area.style-3 .section-title .title {
    font-size: 58px;
    line-height: normal;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .slider-area.style-3 .section-title .title {
    font-size: 42px;
  }
}
.slider-area.style-3 .section-title .title .counter {
  color: #292929;
  margin-right: 10px;
}
.slider-area.style-3 .section-title .desc {
  max-width: 665px;
}
.slider-area.style-3 .section-title .btn-wrapper {
  margin-top: 32px;
}
.slider-area.style-3 .section-title .title,
.slider-area.style-3 .section-title .desc,
.slider-area.style-3 .section-title .btn-wrapper {
  -webkit-animation-name: MovefadeUp;
  animation-name: MovefadeUp;
  -webkit-animation-fill-mode: both;
}
.slider-area.style-3 .section-title .title {
  animation-delay: 0.7s;
  animation-duration: 0.7s;
  transition: all 0.5s ease-out;
}
.slider-area.style-3 .section-title .desc {
  animation-delay: 0.9s;
  animation-duration: 0.9s;
  transition: all 0.5s ease-out;
}
.slider-area.style-3 .section-title .btn-wrapper {
  animation-delay: 1s;
  animation-duration: 1s;
  transition: all 0.5s ease-out;
}
.slider-area.style-3 .image-wrapper {
  position: relative;
}
.slider-area.style-3 .image-wrapper .image {
  border-radius: 30px;
  overflow: hidden;
}
.slider-area.style-3 .image-wrapper .achieve-area {
  background-color: #292929;
  border-radius: 25px;
  padding: 32px;
  width: 366px;
  height: 289px;
  position: absolute;
  bottom: 0;
  left: 0;
}

.info-card:hover .icon img {
  animation: icon-bounce 0.8s 1;
}
.info-card .title {
  font-size: 28px;
  font-weight: 600;
  line-height: 36.4px;
  letter-spacing: -0.42px;
  color: #292929;
  margin-top: 18px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .info-card .title {
    font-size: 26px;
    line-height: 32px;
    letter-spacing: -0.34;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .info-card .title {
    font-size: 24px;
    line-height: 32px;
    letter-spacing: -0.24;
  }
}
.info-card .desc {
  margin-top: 16px;
  margin-bottom: 0;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .info-card .desc {
    font-size: 15px;
    line-height: 28px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .info-card .desc {
    font-size: 16px;
    line-height: 28px;
  }
}
.info-card.style-1 {
  background-color: #cde8e0;
  border-radius: 30px;
  padding: 42px 48px;
  width: 528px;
  margin: 0 12px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .info-card.style-1 {
    width: unset;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .info-card.style-1 {
    width: unset;
    padding: 35px 35px 25px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .info-card.style-1 {
    width: unset;
    padding: 20px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .info-card.style-1 {
    width: unset;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .info-card.style-1 {
    width: unset;
    padding: 25px 25px 16px;
  }
}
.info-card.style-1 .content-wrapper .icon {
  flex-shrink: 0;
}
.info-card.style-1 .content-wrapper .title {
  margin-top: 0px;
}
.info-card.style-1 .content-wrapper .desc {
  margin-top: 15px;
   line-height: 28px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
}
.info-card.style-1 .content-wrapper .view-more {
  margin-top: 32px;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .info-card.style-1 .content-wrapper .view-more {
    margin-top: 24px;
  }
}
.info-card.style-1 .content-wrapper .view-more a {
  font-family: var(--yt-font);
  font-size: 20px;
  line-height: 34px;
  font-weight: 600;
  color: #292929;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 2px;
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .info-card.style-1 .content-wrapper .view-more a {
    font-size: 18px;
    line-height: 30px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .info-card.style-1 .content-wrapper .view-more a {
    font-size: 18px;
    line-height: 30px;
  }
}
.info-card.style-1 .content-wrapper .view-more a:hover {
  color: #025e43;
}
.info-card.style-1 .content-wrapper .view-more a:hover i {
  color: #025e43;
  transform: rotate(0deg);
  margin-left: 5px;
}
.info-card.style-1 .content-wrapper .view-more a i {
  font-size: 22px;
  transform: rotate(-45deg);
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .info-card.style-1 .content-wrapper .view-more a i {
    font-size: 20px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .info-card.style-1 .content-wrapper .view-more a i {
    font-size: 20px;
  }
}

.info-card-wrapper {
  display: flex;
  gap: 50px;
  align-items: center;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .info-card-wrapper {
    flex-direction: column;
    gap: 40px;
  }
}
.info-card-wrapper .title {
  margin-top: 22px;
}

.info-card.style-3 {
  height: 100%;
  padding: 40px;
  border-radius: 30px;
  background-color: #cde8e0;
  position: relative;
  overflow: hidden;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .info-card.style-3 {
    padding: 30px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .info-card.style-3 {
    padding: 30px;
  }
}
.info-card.style-3 .overlay {
  position: absolute;
  bottom: -20%;
  right: -27%;
  overflow: hidden;
  mix-blend-mode: soft-light;
  opacity: 0.8;
}
.info-card.style-3 .info-card-inner {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 90px;
  position: relative;
  z-index: 5;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .info-card.style-3 .info-card-inner {
    justify-content: space-between;
  }
}
@media (max-width: 991px) {
  .info-card.style-3 .info-card-inner {
    gap: 100px;
  }
}
.info-card.style-3 .info-card-inner .title {
  font-size: 36px;
  font-weight: 600;
  line-height: 46.8px;
  letter-spacing: -0.54px;
  margin: 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .info-card.style-3 .info-card-inner .title {
    font-size: 34px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .info-card.style-3 .info-card-inner .title {
    font-size: 30px;
  }
}
.info-card.style-3 .info-card-inner .desc {
  margin-top: 8px;
}
.info-card.style-3 .info-card-inner .theme-btn {
  text-transform: capitalize;
  background-color: #ffffff;
  color: #045c49;
}
.info-card.style-3 .info-card-inner .theme-btn:hover {
  background-color: #025f44;
  color: #ffffff;
  transition: all 0.5s ease-out;
}

.icon-card.style-1 {
  display: flex;
  flex-direction: column;
  background-color: #D9EAFD;
  border-radius: 30px;
  align-items: center;
  padding: 40px;
  gap: 32px;
}
.icon-card.style-1 .icon {
  width: 92px;
  height: 92px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: #ffffff;
  flex-shrink: 0;
}
.icon-card.style-1 .content {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 16px;
}
.icon-card.style-1 .content .desc {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.icon-card.style-1 .content .desc a, .icon-card.style-1 .content .desc p {
  color: #585866;
  text-align: center;
  margin-bottom: 0;
}
.icon-card.style-1.primary {
  background-color: #03c785;
}
.icon-card.style-1.secondary {
  background-color: #FFF089;
}

.about-image-card.style-2 {
  position: relative;
  width: 100%;
  height: 600px;
  border-radius: 30px;
  overflow: hidden;
}
.about-image-card.style-2 .bg-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.about-image-card.style-2 .bg-wrapper img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 30px;
}
.about-image-card.style-2 .bottom-image-wrapper {
  position: absolute;
  bottom: 0;
  right: 0;
  padding-left: 24px;
  padding-top: 24px;
  border-radius: 30px 0 30px 0;
  background-color: #ffffff;
  z-index: 1;
}
.about-image-card.style-2 .bottom-image-wrapper .sticky-corner {
  position: absolute;
  transform: rotate(90deg);
}
.about-image-card.style-2 .bottom-image-wrapper .sticky-corner.top-right-corner {
  top: -35px;
  right: 0;
}
.about-image-card.style-2 .bottom-image-wrapper .sticky-corner.bottom-corner {
  bottom: 0;
  left: -35px;
}
.about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner {
  border-radius: 25px;
  background-color: #03c785;
  padding: 24px;
}
.about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .card-text {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 24px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .card-text {
    gap: 20px;
  }
}
.about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .card-text .title {
  font-size: 28px;
  font-weight: 600;
  line-height: 36.4px;
  letter-spacing: -0.42px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .card-text .title {
    font-size: 24px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .card-text .title {
    font-size: 20px;
  }
}
.about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .card-text .btn-wrapper .circle-arrow-btn {
  width: 48px;
  height: 48px;
  background-color: #ffffff;
  transition: all 0.5s ease-out;
}
.about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .card-text .btn-wrapper .circle-arrow-btn:hover {
  color: #292929;
}
.about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .card-text .btn-wrapper .circle-arrow-btn:hover i {
  transform: rotate(0deg);
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .card-text .btn-wrapper .circle-arrow-btn {
    width: 40px;
    height: 40px;
  }
  .about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .card-text .btn-wrapper .circle-arrow-btn i {
    font-size: 18px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .card-text .btn-wrapper .circle-arrow-btn {
    width: 40px;
    height: 40px;
  }
  .about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .card-text .btn-wrapper .circle-arrow-btn i {
    font-size: 18px;
  }
}
.about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .bottom-image {
  position: relative;
  width: 318px;
  height: 168px;
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 25px;
  display: flex;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .bottom-image {
    width: 250px;
    height: 140px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .bottom-image {
    width: 100%;
    height: 130px;
  }
}
.about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .bottom-image .video-card-wrapper {
  margin: auto;
}
.about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .bottom-image .video-card-wrapper .video-icon,
.about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .bottom-image .video-card-wrapper .video-card-wrapper {
  width: 66px;
  height: 66px;
  border-radius: 50%;
  background-color: #03c785;
  flex-shrink: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .bottom-image .video-card-wrapper .video-icon,
  .about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .bottom-image .video-card-wrapper .video-card-wrapper {
    width: 55px;
    height: 55px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .bottom-image .video-card-wrapper .video-icon,
  .about-image-card.style-2 .bottom-image-wrapper .bottom-image-inner .bottom-image .video-card-wrapper .video-card-wrapper {
    width: 55px;
    height: 55px;
  }
}

.about-image-card.style-1 {
  display: flex;
  gap: 24px;
  align-items: flex-start;
}
@media only screen and (min-width: 1400px) and (max-width: 1699px) {
  .about-image-card.style-1 {
    margin-left: -70px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about-image-card.style-1 {
    gap: 12px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-image-card.style-1 {
    gap: 12px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .about-image-card.style-1 {
    flex-direction: column;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .about-image-card.style-1 .main-img-wrapper {
    width: 100%;
  }
}
.about-image-card.style-1 .main-img-wrapper .main-img-inner {
  width: 414px;
  height: 600px;
  position: relative;
}
@media only screen and (min-width: 1400px) and (max-width: 1699px) {
  .about-image-card.style-1 .main-img-wrapper .main-img-inner {
    width: 360px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about-image-card.style-1 .main-img-wrapper .main-img-inner {
    width: 300px;
    height: 575px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-image-card.style-1 .main-img-wrapper .main-img-inner {
    width: 380px;
    height: 500px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .about-image-card.style-1 .main-img-wrapper .main-img-inner {
    width: 100%;
    height: 500px;
    max-width: 400px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .about-image-card.style-1 .main-img-wrapper .main-img-inner {
    width: 100%;
    height: 450px;
  }
}
.about-image-card.style-1 .main-img-wrapper .main-img-inner img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 30px;
}
.about-image-card .trusted-user-card {
  position: relative;
  display: flex;
  align-self: end;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .about-image-card .trusted-user-card {
    align-self: flex-start;
  }
}
.about-image-card .trusted-user-card .trusted-user-card-wrapper {
  position: relative;
  max-width: 366px;
  z-index: 1;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about-image-card .trusted-user-card .trusted-user-card-wrapper {
    max-width: 240px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-image-card .trusted-user-card .trusted-user-card-wrapper {
    max-width: unset;
  }
}
/* 右上角这块 126×108 的白色「内凹角」本是模板里与图片卡拼合的造型。
   但实际布局中卡片始终在图片右侧（l 值比图片右边界还大 24px），
   缺口后面永远是页面白底，两个 sticky-corner 弧形还会飘到卡片外侧，
   在 320 / 390 / 768 / 1440 各尺寸下看起来都是「被切掉一角 + 游离弧线」。
   2026-11-09 全站停用，卡片恢复 trusted-user-card-inner 自带的完整圆角。 */
.about-image-card .trusted-user-card .trusted-user-card-wrapper .rectangle-shape {
  display: none;
  content: "";
  position: absolute;
  top: 0px;
  right: 0px;
  width: 126px;
  height: 108px;
  background-color: #ffffff;
  border-radius: 0 30px 0 30px;
  z-index: 1;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .rectangle-shape {
    width: 70px;
    height: 80px;
  }
}
.about-image-card .trusted-user-card .trusted-user-card-wrapper .rectangle-shape .sticky-corner {
  position: absolute;
  z-index: 2;
}
.about-image-card .trusted-user-card .trusted-user-card-wrapper .rectangle-shape .sticky-corner.left-corner {
  left: -35px;
  top: 0;
}
.about-image-card .trusted-user-card .trusted-user-card-wrapper .rectangle-shape .sticky-corner.right-corner {
  bottom: -35px;
  right: 0;
}
.about-image-card .trusted-user-card .trusted-user-card-wrapper .trusted-user-card-inner {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  align-items: flex-start;
  gap: 167px;
  background-color: #035d47;
  padding: 30px 39px 40px;
  border-radius: 30px;
  background: linear-gradient(to bottom, #00b366 0%, #005933 100%);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .trusted-user-card-inner {
    gap: 100px;
    padding: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .trusted-user-card-inner {
    gap: 120px;
    padding: 20px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .trusted-user-card-inner {
    gap: 120px;
    padding: 20px;
  }
}
.about-image-card .trusted-user-card .trusted-user-card-wrapper .trusted-user-card-inner .user-img-wrapper {
  display: flex;
  align-items: flex-start;
}
.about-image-card .trusted-user-card .trusted-user-card-wrapper .trusted-user-card-inner .user-img-wrapper .image {
  width: 60px;
  height: 60px;
  border: 2px solid #ffffff;
  border-radius: 100%;
  margin-left: -10px;
  position: relative;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .trusted-user-card-inner .user-img-wrapper .image {
    width: 45px;
    height: 45px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .trusted-user-card-inner .user-img-wrapper .image {
    width: 50px;
    height: 50px;
  }
}
.about-image-card .trusted-user-card .trusted-user-card-wrapper .trusted-user-card-inner .user-img-wrapper .image img {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 100%;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.about-image-card .trusted-user-card .trusted-user-card-wrapper .user-review .title {
  font-size: 48px;
  font-family: var(--yt-font);
  font-weight: 600;
  line-height: 57.6px;
  letter-spacing: -0.72px;
  color: #fff;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .user-review .title {
    font-size: 34px;
    line-height: 42px;
    letter-spacing: -0.42px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .user-review .title {
    font-size: 38px;
    line-height: 48px;
    letter-spacing: -0.42px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .user-review .title {
    font-size: 42px;
    line-height: 56px;
    letter-spacing: -0.42px;
  }
}
.about-image-card .trusted-user-card .trusted-user-card-wrapper .user-review .desc {
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 400;
  line-height: 32.4px;
  color: #fff;
  margin: 8px 0 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .user-review .desc {
    font-size: 16px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .user-review .desc {
    font-size: 16px;
  }
}

.about-image-card.style-4 {
  position: relative;
  margin-left: 40px;
}
.about-image-card.style-4 .main-img-wrapper .main-img-inner img {
  border-radius: 30px;
  overflow: hidden;
}
.about-image-card.style-4 .trusted-user-card.style-2 {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 24px 24px 0 0;
  background-color: #fff;
  border-radius: 0 25px 0 0;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .about-image-card.style-4 .trusted-user-card.style-2 {
    position: relative;
    padding-right: 0;
  }
}
.about-image-card.style-4 .trusted-user-card.style-2 .sticky-corner {
  position: absolute;
  transform: rotate(180deg);
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .about-image-card.style-4 .trusted-user-card.style-2 .sticky-corner {
    display: none;
  }
}
.about-image-card.style-4 .trusted-user-card.style-2 .sticky-corner.left-corner {
  top: -35px;
  left: 0;
}
.about-image-card.style-4 .trusted-user-card.style-2 .sticky-corner.right-corner {
  bottom: 0;
  right: -35px;
}
.about-image-card.style-4 .trusted-user-card.style-2 .trusted-user-card-wrapper .trusted-user-card-inner {
  gap: 16px;
  padding: 32px;
}
.about-image-card.style-4 .trusted-user-card.style-2 .trusted-user-card-wrapper .user-review .title {
  font-size: 64px;
  line-height: 76.8px;
  letter-spacing: -0.96px;
}

.about-info-card {
  margin: 0;
}
.about-info-card .section-title {
  margin-bottom: 48px;
}
.about-info-card .section-title .title {
  margin-bottom: 24px;
}
.about-info-card .section-title .description {
  margin: 0;
}

.circle-shape-wrapper {
  display: flex;
  align-items: center;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .circle-shape-wrapper {
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .circle-shape-wrapper {
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .circle-shape-wrapper {
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1699px) {
  .circle-shape-wrapper {
    justify-content: center;
  }
}

.counter-card.style-1 {
  position: relative;
  text-align: center;
  transition: all 0.5s ease-out;
}
.counter-card.style-1:hover {
  z-index: 5;
  transform: scale(1.04);
  transition: all 0.5s ease-out;
}
.counter-card.style-1:nth-child(1) {
  margin-top: 90px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .counter-card.style-1:nth-child(1) {
    margin: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter-card.style-1:nth-child(1) {
    margin: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .counter-card.style-1:nth-child(1) {
    margin: 0;
  }
}
.counter-card.style-1:nth-child(2) {
  margin-top: -90px;
  z-index: 4;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .counter-card.style-1:nth-child(2) {
    margin: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter-card.style-1:nth-child(2) {
    margin: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .counter-card.style-1:nth-child(2) {
    margin: 0;
  }
}
.counter-card.style-1:nth-child(2) .content {
  background-color: #03c785;
  border: none;
  margin-left: -58px;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .counter-card.style-1:nth-child(2) .content {
    margin: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter-card.style-1:nth-child(2) .content {
    margin: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .counter-card.style-1:nth-child(2) .content {
    margin: 0;
  }
}
.counter-card.style-1:nth-child(3) {
  margin-top: 90px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .counter-card.style-1:nth-child(3) {
    margin: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter-card.style-1:nth-child(3) {
    margin: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .counter-card.style-1:nth-child(3) {
    margin: 0;
  }
}
.counter-card.style-1:nth-child(3) .content {
  margin-left: -58px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .counter-card.style-1:nth-child(3) .content {
    margin: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter-card.style-1:nth-child(3) .content {
    margin: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .counter-card.style-1:nth-child(3) .content {
    margin: 0;
  }
}
.counter-card.style-1:nth-child(4) {
  margin-top: -90px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .counter-card.style-1:nth-child(4) {
    margin: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter-card.style-1:nth-child(4) {
    margin: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .counter-card.style-1:nth-child(4) {
    margin: 0;
  }
}
.counter-card.style-1:nth-child(4) .content {
  background-color: #FFF089;
  border: none;
  margin-left: -58px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .counter-card.style-1:nth-child(4) .content {
    margin: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter-card.style-1:nth-child(4) .content {
    margin: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .counter-card.style-1:nth-child(4) .content {
    margin: 0;
  }
}
.counter-card.style-1 .content {
  width: 450px;
  height: 450px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 70px;
  background-color: #ffffff;
  border: 1px solid #025e43;
  border-radius: 50%;
  gap: 12px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .counter-card.style-1 .content {
    width: 322px;
    height: 322px;
    padding: 35px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter-card.style-1 .content {
    width: 335px;
    height: 335px;
    padding: 30px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .counter-card.style-1 .content {
    width: 318px;
    height: 318px;
    padding: 30px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1699px) {
  .counter-card.style-1 .content {
    width: 400px;
    height: 400px;
  }
}
.counter-card.style-1 .content .number {
  font-size: 70px;
  font-weight: 600;
  line-height: 104.5px;
  letter-spacing: -1.425px;
  width: max-content;
  max-width: none;
  white-space: nowrap;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .counter-card.style-1 .content .number {
    font-size: 68px;
    line-height: 76px;
    letter-spacing: -0.96px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .counter-card.style-1 .content .number {
    font-size: 68px;
    line-height: 76px;
    letter-spacing: -0.96px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .counter-card.style-1 .content .number {
    font-size: 68px;
    line-height: 76px;
    letter-spacing: -0.96px;
  }
}
.counter-card.style-1 .content .title {
  font-family: var(--yt-font);
  font-size: 13px;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: #025e43;
}
.counter-card.style-1 .content .desc {
  font-family: var(--yt-font);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: #525256;
  margin: 0;
}
/* 绿色圆底上改用深绿字，保证对比度 */
.counter-card.style-1:nth-child(2) .content .title {
  color: #04372a;
}
.counter-card.style-1:nth-child(2) .content .desc {
  color: #0c4435;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .counter-card.style-1 .content .title {
    font-size: 12px;
    line-height: 18px;
  }
  .counter-card.style-1 .content .desc {
    font-size: 13px;
    line-height: 20px;
  }
}

.counter-card.style-2 .content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 9px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .counter-card.style-2 .content {
    gap: 0;
  }
}
.counter-card.style-2 .content .number {
  font-size: 48px;
  font-weight: 600;
  line-height: 57.6px;
  letter-spacing: -0.72px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .counter-card.style-2 .content .number {
    font-size: 38px;
    line-height: 48.6px;
  }
}
.counter-card.style-2 .content .title {
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 400;
  line-height: 32.4px;
  color: #525256;
  letter-spacing: initial;
}

/* ==========================================================================
   品牌跑马灯（纯 CSS 循环滚动）
   原实现靠 Swiper 的 slidesPerView 固定份数（6/5/4…），slide 宽度被钉成 容器/N，
   文案一长（如 Fruit and vegetable powder 实测 433px，而 slide 只有 317px）就会溢出
   自己的 slide，和左右的文案叠在一起。
   现在：轨道宽度由内容决定（width: max-content），复制 4 组内容后整体左移 25%（正好一组）循环，
   文案怎么改都不会重叠，4K 以内宽度首尾都无缝。快慢改 @keyframes 的时长即可。
   ========================================================================== */
.brand-marquee-area {
  padding: 28px 0;
  background-color: #D9EAFD;
  overflow: hidden;
}

.brand-marquee-track {
  display: flex;
  width: max-content;
  animation: brandMarquee 12s linear infinite;
  will-change: transform;
}

.brand-marquee-group {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
}

.brand-marquee-item {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 60px;
  padding: 0 30px;
}

.brand-marquee-area .brand-marquee-title {
  font-family: var(--yt-font);
  font-size: 36px;
  font-weight: 600;
  line-height: 46.8px;
  color: #292929;
  letter-spacing: -0.52px;
  white-space: nowrap;
}

/* 4 组内容等宽，左移 25%（= 一整组）后画面与起点完全一致 → 无缝衔接 */
@keyframes brandMarquee {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-25%, 0, 0);
  }
}

/* 小屏把字号和间距收一收，最长的一条（Fruit and vegetable powder）也能整句看全 */
@media only screen and (max-width: 991px) {
  .brand-marquee-item {
    gap: 40px;
    padding: 0 20px;
  }
  .brand-marquee-area .brand-marquee-title {
    font-size: 28px;
    line-height: 38px;
  }
}
@media only screen and (max-width: 575px) {
  .brand-marquee-area {
    padding: 20px 0;
  }
  .brand-marquee-item {
    gap: 26px;
    padding: 0 13px;
  }
  .brand-marquee-area .brand-marquee-title {
    font-size: 21px;
    line-height: 29px;
    letter-spacing: -0.3px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .brand-marquee-track {
    animation: none;
  }
}

.testimonial-card {
  padding: 40px 48px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  position: relative;
  background-color: #ECF4FE;
  border-radius: 30px;
  margin: 0 12px;
  width: 528px;
  overflow: hidden;
}
.testimonial-card:hover .btn-wrapper {
  transform: translate(-8px, 8px);
}
.testimonial-card:hover .shape {
  transform: translate(60px, -60px);
  transition: all 0.5s ease-out;
}
@media (max-width: 1399px) {
  .testimonial-card {
    width: unset;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .testimonial-card {
    padding: 24px;
  }
}
.testimonial-card .btn-wrapper {
  position: absolute;
  z-index: 5;
  top: 0;
  right: 0;
  transition: all 0.5s ease-out;
}
.testimonial-card .btn-wrapper .circle-arrow-btn {
  width: 56px;
  height: 56px;
}
.testimonial-card .btn-wrapper .circle-arrow-btn i {
  transform: rotate(0deg);
}
.testimonial-card .shape {
  width: auto;
  height: auto;
  position: absolute;
  top: 0;
  right: 0;
  overflow: hidden;
  border-radius: 0 30px 0 0;
  transition: all 0.5s ease-out;
}
.testimonial-card .shape svg {
  width: 100px;
  height: 100px;
  transition: all 0.5s ease-out;
}
.testimonial-card .content-wrapper {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.testimonial-card .content-wrapper .rating-icon {
  font-family: "Font Awesome 6 Pro";
  font-size: 18px;
  font-weight: 900;
  color: #292929;
  margin-bottom: 0;
}
.testimonial-card .content-wrapper .description {
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 400;
  line-height: 32px;
  color: #525256;
  margin: 0;
}
.testimonial-card .user-info-wrapper {
  display: flex;
  gap: 16px;
  align-items: center;
  flex-shrink: 0;
}
.testimonial-card .user-info-wrapper .user-img {
  display: flex;
  justify-content: center;
  align-self: flex-start;
  flex-shrink: 0;
  width: 60px;
  height: 60px;
  border: 2px solid #ffffff;
  border-radius: 50%;
  position: relative;
}
.testimonial-card .user-info-wrapper .user-img img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
  border-radius: 50%;
}
.testimonial-card .user-info-wrapper .user-meta .name {
  font-family: var(--yt-font);
  font-size: 20px;
  font-weight: 600;
  line-height: 34px;
  color: #292929;
  margin-bottom: 5px;
  letter-spacing: initial;
}
.testimonial-card .user-info-wrapper .user-meta .designation {
  font-family: var(--yt-font);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: #292929;
  margin: 0;
  letter-spacing: -0.21px;
}
.testimonial-card.style-1 {
  width: unset;
  margin: 0;
  padding: 0;
  background: none;
}
.testimonial-card.style-1 .content-wrapper .description {
  max-width: 430px;
}

.slider-area-wrapper.style-1 {
  margin-right: -9999px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-area-wrapper.style-1 {
    margin-right: unset;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-area-wrapper.style-1 {
    margin-right: unset;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .slider-area-wrapper.style-1 {
    margin-right: unset;
  }
}

.testimonial-slider-wrapper {
  position: relative;
}
.testimonial-slider-wrapper .slick-arrow {
  width: 72px;
  height: 72px;
  border-radius: 50px;
  background-color: #ffffff;
  border: 1px solid #C0C0C0;
  font-size: 24px;
  color: #292929;
  transition: all 0.5s ease-out;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: absolute;
  top: -209px;
  right: 0;
}
.testimonial-slider-wrapper .slick-arrow.prev-btn {
  right: 90px;
}
.testimonial-slider-wrapper.style-1 {
  padding-left: 10px;
}
.testimonial-slider-wrapper.style-1 .slick-list {
  margin: 0 -12px;
}
.testimonial-slider-wrapper.style-1 .slick-dots {
  position: absolute;
  z-index: 5;
  right: -13px;
  bottom: -80px;
  margin: 0;
  padding: 0;
  transform: translateY(24px);
}
@media (max-width: 991px) {
  .testimonial-slider-wrapper.style-1 .slick-dots {
    bottom: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .testimonial-slider-wrapper.style-1 .slick-dots {
    bottom: -50px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .testimonial-slider-wrapper.style-1 .slick-dots {
    transform: translate(0, 75px);
    right: 0;
  }
}
.testimonial-slider-wrapper.style-1 .slick-dots li {
  cursor: pointer;
}
.testimonial-slider-wrapper.style-2 .slick-list {
  margin: 0 -999px 0 -12px;
}
@media (max-width: 1399px) {
  .testimonial-slider-wrapper.style-2 .slick-list {
    margin: 0 -12px;
  }
}

.slick-dots {
  display: flex;
  align-items: center;
  justify-content: end;
  margin-top: 100px;
  gap: 5px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .slick-dots {
    padding-left: 0;
  }
}
.slick-dots li {
  list-style: none;
  line-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  padding: 5px;
  border-radius: 50%;
  transition: all 0.5s ease-out;
}
.slick-dots li.slick-active {
  border: 1px solid #025e43;
  transition: all 0.5s ease-out;
}
.slick-dots li button {
  position: relative;
  width: 11px;
  height: 11px;
  font-size: 0;
  line-height: 0;
  padding: 0;
  margin: 0;
  white-space: 0;
  letter-spacing: 0;
  border-radius: 50%;
  background-color: #025e43;
  transition: all 0.5s ease-out;
}

.accordion-wrapper .accordion-list-item {
  background-color: #ECF4FE;
  border-radius: 25px;
}
.accordion-wrapper .accordion-list-item .accordion-head {
  padding: 32px 32px 25px 40px;
  display: flex;
  align-items: center;
  gap: 25px;
  position: relative;
  justify-content: space-between;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .accordion-wrapper .accordion-list-item .accordion-head {
    padding-top: 28px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .accordion-wrapper .accordion-list-item .accordion-head {
    padding: 24px;
  }
}
.accordion-wrapper .accordion-list-item .accordion-head:after {
  background-color: #ffffff;
  border-radius: 50%;
  color: #292929;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  content: "\f068";
  font-family: "Font Awesome 6 Pro";
  font-weight: 500;
}
.accordion-wrapper .accordion-list-item .accordion-head.collapsed {
  border-color: #D9EAFD;
}
.accordion-wrapper .accordion-list-item .accordion-head.collapsed:after {
  background-color: #ffffff;
  border-radius: 50%;
  color: #292929;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  position: relative;
  content: "+";
  font-family: "Font Awesome 6 Pro";
  font-weight: 500;
}
.accordion-wrapper .accordion-list-item .accordion-head .accordion-title {
  font-size: 28px;
  font-weight: 600;
  line-height: 36.4px;
  color: #292929;
  letter-spacing: -0.42px;
  margin-bottom: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .accordion-wrapper .accordion-list-item .accordion-head .accordion-title {
    font-size: 24px;
    line-height: 32px;
  }
}
.accordion-wrapper .accordion-list-item:last-child .accordion-head {
  border-bottom: transparent;
}
.accordion-wrapper .accordion-list-item .accordion-item-body {
  max-width: 435px;
  padding: 0 0 32px 40px;
  transition: all 0.5s ease-out;
}
@media (max-width: 1199px) {
  .accordion-wrapper .accordion-list-item .accordion-item-body {
    margin-right: 15px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .accordion-wrapper .accordion-list-item .accordion-item-body {
    padding: 0 0 24px 24px;
  }
}
.accordion-wrapper .accordion-list-item .accordion-item-body p {
  font-size: 18px;
  color: #525256;
  font-weight: 400;
  line-height: 32.4px;
  margin-bottom: 0;
}

.brand-slider-area.style-1 .client-logo-slider-wrapper {
  border-top: 1px solid #c0c0c0;
  padding: 64px 0;
}

.client-logo-wrapper .client-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  overflow: hidden;
  transition: all 0.5s ease-out;
}
.client-logo-wrapper .client-logo img {
  filter: grayscale(100%);
  transition: all 0.5s ease-out;
  /* 6 张 logo 已统一成 210x56 画布、墨迹高度一致（tools/normalize_brand_logos.py），
     这里只用宽度约束，高度按比例走，保证一行里每个 logo 视觉大小一致、间距也均匀 */
  max-width: 100%;
  height: auto;
  object-fit: contain;
}
.client-logo-wrapper .client-logo:hover {
  transform: scale(1.03);
}
.client-logo-wrapper .client-logo:hover img {
  filter: none;
  opacity: 1;
}

.page-header {
  border-left: 4px solid #dfe2e9;
  padding-left: 45px;
  margin-bottom: 50px;
}
@media (max-width: 991px) {
  .page-header {
    padding-left: 30px;
  }
}
.page-header .page-title {
  font-size: 48px;
  line-height: 60px;
}
@media (max-width: 991px) {
  .page-header .page-title {
    font-size: 38px;
    line-height: 48px;
  }
}

.blog-area ol,
.blog-area ul {
  padding-left: 20px;
}
.blog-area ol li,
.blog-area ul li {
  padding-top: 7px;
}

.single-post-item {
  background-color: #ffffff;
  overflow: hidden;
  margin-bottom: 64px;
  /* Quote Format Post */
  /* Sticky Post */
}
.single-post-item:hover .post-thumbnail img,
.single-post-item:hover .post-video img {
  transform: scale(1.06);
  transition: all 0.5s ease-out;
}
.single-post-item iframe {
  width: 100%;
  height: 522px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .single-post-item iframe {
    height: 350px;
  }
}
.single-post-item .post-content-wrapper {
  padding-right: 110px;
}
@media (max-width: 1399px) {
  .single-post-item .post-content-wrapper {
    padding-right: 0;
  }
}
.single-post-item .post-content-wrapper .read-more .btn-wrapper {
  margin-top: 30px;
}
.single-post-item.format-quote .post-content {
  margin: 0;
}
.single-post-item.format-quote blockquote {
  margin: 0;
}
.single-post-item.format-quote blockquote p {
  margin-top: 0;
}
.single-post-item.format-quote blockquote cite a {
  font-family: var(--yt-font);
  font-size: 16px;
  font-weight: 500;
  text-transform: capitalize;
  color: #525256;
  margin-top: 20px;
  font-style: normal;
  transition: all 0.5s ease-out;
}
.single-post-item.format-quote blockquote cite a:hover {
  transition: all 0.5s ease-out;
  color: #03c785;
}
.single-post-item.sticky {
  border: 2px solid #03c785;
}
.single-post-item.sticky .post-content {
  margin-bottom: 0;
}
.single-post-item.sticky .post-content p {
  margin-bottom: 0;
}
.single-post-item .post-title {
  font-size: 33px;
  line-height: 40px;
  font-weight: 600;
  letter-spacing: -0.72px;
  margin-bottom: 0;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .single-post-item .post-title {
    font-size: 28px;
    line-height: 38px;
    margin-top: 5px;
  }
}
.single-post-item .post-title:hover a {
  color: #03c785;
  transition: all 0.5s ease-out;
}
.single-post-item .post-content p {
  margin-top: 17px;
}
.single-post-item .post-content h2,
.single-post-item .post-content h3,
.single-post-item .post-content h4,
.single-post-item .post-content h5,
.single-post-item .post-content h6 {
  margin-bottom: 10px;
}
.single-post-item .post-content p {
  margin-bottom: unset;
}
.single-post-item .single-post-meta {
  display: inline-flex;
  align-items: flex-start;
  padding-top: 15px;
  margin-top: 0;
  margin-bottom: 20px;
  width: 100%;
}
.single-post-item .social-share {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
}
.single-post-item .social-share a {
  width: 40px;
  height: 40px;
  background-color: #03c785;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #292929;
}
.single-post-item .social-share .social-share-title {
  font-size: 18px;
  font-weight: 700;
  font-family: var(--yt-font);
  color: #292929;
  margin-right: 5px;
  white-space: nowrap;
}
.single-post-item .blog-post-tag {
  display: inline-flex;
}
.single-post-item .blog-post-tag span {
  font-size: 16px;
  font-weight: 500;
  display: inline-block;
  font-family: var(--yt-font);
  color: #292929;
  margin-bottom: 0;
  margin-right: 30px;
  text-transform: uppercase;
  float: left;
  line-height: 24px;
}
.single-post-item .blog-post-tag .post-tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  line-height: 0;
  margin-bottom: 16px;
}
.single-post-item .blog-post-tag .post-tag-list a {
  font-family: var(--yt-font);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -0.21px;
  background-color: #D9EAFD;
  border-radius: 50px;
  padding: 10px 25px;
  color: #292929;
  display: inline-block;
  line-height: initial;
  text-transform: uppercase;
  transition: all 0.5s ease-out;
}
.single-post-item .blog-post-tag .post-tag-list a:hover {
  color: #292929;
  background-color: #03c785;
  transition: all 0.5s ease-out;
}
.single-post-item .post-thumbnail,
.single-post-item .post-video,
.single-post-item .post-gallery,
.single-post-item .post-audio {
  position: relative;
  overflow: hidden;
  margin-bottom: 40px;
  border-radius: 30px;
}
.single-post-item .post-thumbnail img,
.single-post-item .post-video img,
.single-post-item .post-gallery img,
.single-post-item .post-audio img {
  transform: scale(1);
  transition: all 0.5s ease-out;
}
/* 新闻列表缩略图：统一 1140×480（19:8）定高，避免不同比例图片导致高度参差 */
.blog-area .single-post-item .post-thumbnail {
  aspect-ratio: 1140 / 480;
}
.blog-area .single-post-item .post-thumbnail > a {
  display: block;
  width: 100%;
  height: 100%;
}
.blog-area .single-post-item .post-thumbnail img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.single-post-item .post-thumbnail .popup-video-wrapper,
.single-post-item .post-video .popup-video-wrapper,
.single-post-item .post-gallery .popup-video-wrapper,
.single-post-item .post-audio .popup-video-wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.single-post-item .post-thumbnail .video-btn a,
.single-post-item .post-video .video-btn a,
.single-post-item .post-gallery .video-btn a,
.single-post-item .post-audio .video-btn a {
  width: 70px;
  height: 70px;
  box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7);
  background-color: #ffffff;
  border-radius: 50%;
  background-size: cover;
  background-repeat: no-repeat;
  animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  display: flex;
  align-items: center;
  justify-content: center;
}
.single-post-item .post-thumbnail .video-btn a i,
.single-post-item .post-video .video-btn a i,
.single-post-item .post-gallery .video-btn a i,
.single-post-item .post-audio .video-btn a i {
  color: #03c785;
  font-size: 18px;
}
.single-post-item .post-thumbnail .video-btn a:hover,
.single-post-item .post-video .video-btn a:hover,
.single-post-item .post-gallery .video-btn a:hover,
.single-post-item .post-audio .video-btn a:hover {
  animation: none;
}
.single-post-item button.post-gallery-btn {
  position: absolute;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  transition: 0.3s;
  z-index: 99;
  background-color: #ffffff;
  cursor: pointer;
  top: 50%;
  transform: translateY(-50%);
  overflow: hidden;
}
.single-post-item button.post-gallery-btn.prev-btn {
  left: 30px;
}
.single-post-item button.post-gallery-btn.next-btn {
  right: 30px;
}
.single-post-item button.post-gallery-btn i {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #292929;
  font-size: 17px;
  transition: all 0.5s ease-out;
}
.single-post-item button.post-gallery-btn:hover {
  transition: all 0.5s ease-out;
  background-color: #03c785;
}
.single-post-item button.post-gallery-btn:hover i {
  color: #ffffff;
  transition: all 0.5s ease-out;
}
.single-post-item .post-audio iframe {
  width: 100%;
}
.single-post-item .post-meta {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 20px;
  flex-wrap: wrap;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .single-post-item .post-meta {
    gap: 10px;
    width: 100%;
  }
}
.single-post-item .post-meta .author-img {
  width: 37px;
  height: 37px;
  position: relative;
  border-radius: 50%;
  overflow: hidden;
}
.single-post-item .post-meta .author-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}
.single-post-item .post-meta span {
  font-size: 18px;
  font-weight: 400;
  color: #525256;
  text-transform: capitalize;
  display: flex;
  align-items: center;
  gap: 10px;
}
.single-post-item .post-meta span.icon i {
  color: #C0C0C0;
  font-size: 6px;
}
.single-post-item .post-meta span a {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #525256;
  transition: all 0.5s ease-out;
}
.single-post-item .post-meta span a:hover {
  color: #03c785;
  transition: all 0.5s ease-out;
}
/* 新闻列表「查看更多」——绿色胶囊按钮，配色与圆角取首页 .theme-btn（#03c588 / hover #025d45 / 50px） */
.single-post-item .post-content-wrapper .btn-wrapper {
  margin-top: 28px;
}
.single-post-item .post-content-wrapper .btn-wrapper .text-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 28px;
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
  color: #ffffff;
  background-color: #03c588;
  border-radius: 50px;
  transition: all 0.5s ease-out;
}
.single-post-item .post-content-wrapper .btn-wrapper .text-btn:hover {
  background-color: #025d45;
  color: #ffffff;
  transition: all 0.5s ease-out;
}
.single-post-item .post-content-wrapper .btn-wrapper .text-btn i {
  transform: rotate(-45deg);
  transition: all 0.5s ease-out;
}
.single-post-item .post-content-wrapper .btn-wrapper .text-btn:hover i {
  transform: rotate(0deg);
  transition: all 0.5s ease-out;
}

.post-card {
  background-color: #ffffff;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .post-card {
    gap: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .post-card {
    gap: 30px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .post-card {
    gap: 30px;
  }
}
.post-card:hover .image img {
  transform: scale(1.03);
  transition: all 0.5s ease-out;
}
.post-card:hover .image:before {
  visibility: visible;
  opacity: 1;
  transition: all 0.5s ease-out;
}
.post-card:hover .image .circle-btn-wrapper {
  background-color: rgba(0, 0, 0, 0.5);
  transition: all 0.5s ease-out;
}
.post-card:hover .image .circle-btn {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1);
  visibility: visible;
  opacity: 1;
  transition: all 0.5s ease-out;
}
.post-card .image {
  overflow: hidden;
  position: relative;
  border-radius: 30px;
  height: 268px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .post-card .image {
    height: 250px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .post-card .image {
    height: 220px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .post-card .image {
    height: 220px;
  }
}
.post-card .image img {
  position: absolute;
  top: 0;
  left: 0;
  transform: scale(1.001);
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.5s ease-out;
}
.post-card .image .circle-btn-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all 0.5s ease-out;
}
.post-card .image .circle-btn {
  width: 72px;
  height: 72px;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #03c785;
  color: #292929;
  font-size: 24px;
  text-decoration: none;
  position: absolute;
  top: 70%;
  left: 20%;
  transform: translate(-50%, -50%) scale(0.3);
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s ease-out;
  z-index: 2;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .post-card .image .circle-btn {
    width: 60px;
    height: 60px;
    font-size: 22px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .post-card .image .circle-btn {
    width: 50px;
    height: 50px;
    font-size: 20px;
  }
}
.post-card .image .circle-btn i {
  transform: rotate(-45deg);
  transition: all 0.5s ease-out;
}
.post-card .image .circle-btn:hover {
  background-color: #ffffff;
  transition: all 0.5s ease-out;
}
.brand-slider-area{ margin-top: 40px;}
.post-card .image .circle-btn:hover i {
  transform: rotate(0deg);
  transition: all 0.5s ease-out;
}
.post-card .content {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .post-card .content {
    gap: 12px;
  }
}
.post-card .content .tag-wrapper {
  display: flex;
  align-items: center;
  gap: 8px;
}
.post-card .content .tag-wrapper .single-tag {
  padding: 8px 24px;
  border-radius: 50px;
  font-family: var(--yt-font);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: -0.21px;
  color: #292929;
  background-color: #D9EAFD;
  text-transform: uppercase;
}
.post-card .content .title {
  font-family: var(--yt-font);
  font-size: 24px;
  font-weight: 600;
  line-height: 36px;
  letter-spacing: -0.42px;
  margin-bottom: 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .post-card .content .title {
    font-size: 24px;
    line-height: 32px;
    letter-spacing: -0.32;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .post-card .content .title {
    font-size: 22px;
    line-height: 30px;
    letter-spacing: -0.32;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .post-card .content .title {
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.42px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .post-card .content .title {
    font-size: 22px;
    line-height: 30px;
    letter-spacing: -0.32;
  }
}
.post-card .content .desc {
  font-family: var(--yt-font);
  font-size: 16px;
  font-weight: 400;
  line-height: 25px;
  color: #525256;
  margin-bottom: 0;
}
.post-card .post-meta {
  display: inline-flex;
  gap: 16px;
  align-items: center;
  margin-top: 8px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .post-card .post-meta {
    gap: 8px;
  }
}
.post-card .post-meta .single-post-meta {
  color: #525256;
  font-size: 18px;
  line-height: 32px;
  font-weight: 400;
  font-family: var(--yt-font);
}
.post-card .post-meta .dots::before {
  position: absolute;
  content: "";
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #C0C0C0;
}

.post-card.style-1 {
  height: 100%;
}
.post-card.style-1 .content {
  flex: 1;
}
.post-card.style-1 .content .post-meta {
  margin-top: 0;
}
.post-card.style-1 .content .btn-wrapper {
  margin-top: auto;
  display: flex;
  justify-content: flex-end;
}
.post-card.style-1 .content .btn-wrapper .text-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 600;
  line-height: 32px;
  color: #292929;
  transition: all 0.5s ease-out;
}
.post-card.style-1 .content .btn-wrapper .text-btn:hover {
  gap: 12px;
  transition: all 0.5s ease-out;
}
.post-card.style-1 .content .btn-wrapper .text-btn i {
  transform: rotate(-45deg);
  transition: all 0.5s ease-out;
}
.post-card.style-1 .content .btn-wrapper .text-btn:hover i {
  transform: rotate(0deg);
  transition: all 0.5s ease-out;
}

.post-card.style-2 {
  position: relative;
  overflow: hidden;
}
.post-card.style-2:hover .btn-wrapper {
  transform: translate(-8px, 8px);
  transition: all 0.5s ease-out;
}
.post-card.style-2:hover .shape {
  visibility: hidden;
  opacity: 0;
  transform: translate(60px, -60px);
  transition: all 0.5s ease-out;
}
.post-card.style-2 .content {
  background-color: #ECF4FE;
  padding: 42px 48px 46px;
  border-radius: 30px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .post-card.style-2 .content {
    padding: 28px;
  }
}
.post-card.style-2 .content .post-meta {
  margin-top: 0;
  margin-bottom: 24px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .post-card.style-2 .content .title {
    font-size: 22px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .post-card.style-2 .content .title {
    font-size: 24px;
  }
}
.post-card.style-2 .content .btn-wrapper {
  margin-top: 64px;
  display: flex;
  justify-content: end;
  position: relative;
}
.post-card.style-2 .content .btn-wrapper .text-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-family: var(--yt-font);
  font-size: 20px;
  font-weight: 600;
  line-height: 34px;
  color: #292929;
  transition: all 0.5s ease-out;
}
.post-card.style-2 .content .btn-wrapper .text-btn:hover {
  gap: 12px;
  transition: all 0.5s ease-out;
}
.post-card.style-2 .content .btn-wrapper .text-btn:hover i {
  transform: rotate(0deg);
  transition: all 0.5s ease-out;
}
.post-card.style-2 .content .btn-wrapper .text-btn i {
  transform: rotate(-45deg);
  transition: all 0.5s ease-out;
}
.post-card.style-2 .btn-wrapper {
  position: absolute;
  z-index: 5;
  top: 0;
  right: 0;
  transition: all 0.5s ease-out;
}
.post-card.style-2 .btn-wrapper .circle-arrow-btn {
  width: 64px;
  height: 64px;
}
.post-card.style-2 .shape {
  position: absolute;
  top: 0;
  right: 0;
  transition: all 0.5s ease-out;
}

.post-card.style-3 {
  flex-direction: row;
  background-color: #ECF4FE;
  border-radius: 30px;
  gap: unset;
  position: relative;
  margin: 0 12px;
}
.post-card.style-3:hover .btn-wrapper {
  transform: translate(-8px, 8px);
  transition: all 0.5s ease-out;
}
.post-card.style-3:hover .shape {
  visibility: hidden;
  opacity: 0;
  transform: translate(60px, -60px);
  transition: all 0.5s ease-out;
}
@media (max-width: 1399px) {
  .post-card.style-3 {
    flex-direction: column;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .post-card.style-3 {
    flex-direction: row;
  }
}
.post-card.style-3 .image {
  width: 330px;
  height: unset;
  flex-shrink: 0;
}
@media (max-width: 1399px) {
  .post-card.style-3 .image {
    width: auto;
    height: 250px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .post-card.style-3 .image {
    width: 330px;
    height: unset;
  }
}
.post-card.style-3 .content {
  padding: 42px 46px 48px;
}
@media (max-width: 1399px) {
  .post-card.style-3 .content {
    padding: 42px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .post-card.style-3 .content {
    padding: 24px;
  }
}
.post-card.style-3 .content .post-content p {
  margin-bottom: 0;
}
.post-card.style-3 .btn-wrapper {
  position: absolute;
  z-index: 5;
  top: 0;
  right: 0;
  transition: all 0.5s ease-out;
}
.post-card.style-3 .btn-wrapper .circle-arrow-btn {
  width: 64px;
  height: 64px;
}
.post-card.style-3 .shape {
  position: absolute;
  top: 0;
  right: 0;
  transition: all 0.5s ease-out;
}

.blog-details-wrapper .comment-respond {
  margin-top: 72px;
  margin-bottom: 40px;
}
.blog-details-wrapper .wp-block-group.has-background .wp-block-button .wp-block-button__link {
  color: #ffffff !important;
}
.blog-details-wrapper .single-post-item {
  overflow: visible;
  box-shadow: none;
}
.blog-details-wrapper .single-post-item .post-title {
  margin-bottom: 20px;
}
.blog-details-wrapper .single-post-item img {
  border-radius: 30px;
}
.blog-details-wrapper .single-post-item .gallery-image-wrapper {
  display: flex;
  gap: 30px;
  align-items: center;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .blog-details-wrapper .single-post-item .gallery-image-wrapper {
    flex-direction: column;
  }
}
.blog-details-wrapper .single-post-item .gallery-image-wrapper .gallery-image {
  flex-shrink: 1;
  min-width: 0;
  max-width: 100%;
  border-radius: 30px;
}
.blog-details-wrapper .single-post-item .gallery-image-wrapper .gallery-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 30px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .blog-details-wrapper .single-post-item .gallery-image-wrapper .gallery-image {
    margin-bottom: 0;
  }
}
.blog-details-wrapper .single-post-item .gallery-image-wrapper .gallery-image-content p {
  margin-bottom: 0;
}
.blog-details-wrapper .single-post-item blockquote {
  background-color: #03c785;
  border-radius: 30px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .blog-details-wrapper .single-post-item blockquote {
    padding: 20px;
  }
}
.blog-details-wrapper .single-post-item .single-post-meta {
  margin-bottom: 0;
  gap: 20px;
  justify-content: space-between;
  position: relative;
  align-items: center;
  border-top: 1px solid #E7E7E7;
  padding-top: 34px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .blog-details-wrapper .single-post-item .single-post-meta {
    flex-direction: column;
  }
}
.blog-details-wrapper .single-post-item .single-post-meta .post-tag-list {
  margin-bottom: 0;
}
.blog-details-wrapper .single-post-item .single-post-meta .blog-post-tag .tag-icon {
  color: #03c785;
  font-size: 20px;
}
.blog-details-wrapper .single-post-item iframe {
  width: 100%;
  height: 522px;
}
.blog-details-wrapper .single-post-item .post-meta {
  margin-bottom: 20px;
  margin-top: -8px;
}
.blog-details-wrapper .single-post-item .post-gallery:hover img {
  transform: scale(1) !important;
}
.blog-details-wrapper .single-post-item .post-thumbnail,
.blog-details-wrapper .single-post-item .post-video,
.blog-details-wrapper .single-post-item .post-gallery,
.blog-details-wrapper .single-post-item .postbox-audio,
.blog-details-wrapper .single-post-item .wp-block-post-featured-image {
  overflow: hidden;
  margin-bottom: 30px;
  position: relative;
}
.blog-details-wrapper .single-post-item .post-thumbnail:hover img,
.blog-details-wrapper .single-post-item .post-video:hover img,
.blog-details-wrapper .single-post-item .post-gallery:hover img,
.blog-details-wrapper .single-post-item .postbox-audio:hover img,
.blog-details-wrapper .single-post-item .wp-block-post-featured-image:hover img {
  transform: scale(1.06);
  transition: all 0.5s ease-out;
}
.blog-details-wrapper .single-post-item .post-thumbnail img,
.blog-details-wrapper .single-post-item .post-video img,
.blog-details-wrapper .single-post-item .post-gallery img,
.blog-details-wrapper .single-post-item .postbox-audio img,
.blog-details-wrapper .single-post-item .wp-block-post-featured-image img {
  transform: scale(1);
  transition: all 0.5s ease-out;
}
.blog-details-wrapper .single-post-item .post-content-wrapper {
  padding: 0;
}
.blog-details-wrapper .single-post-item .post-content {
  margin-bottom: 17px;
  /* Unit Test Data Compatibility Start */
  /* Unit Test Data Compatibility End */
}
.blog-details-wrapper .single-post-item .post-content .list-item-wrapper .list-item .text {
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 700;
  line-height: 27px;
  color: #292929;
}
.blog-details-wrapper .single-post-item .post-content .wp-block-archives li a,
.blog-details-wrapper .single-post-item .post-content .wp-block-tag-cloud a {
  color: #525256;
}
.blog-details-wrapper .single-post-item .post-content .wp-block-archives li a:hover,
.blog-details-wrapper .single-post-item .post-content .wp-block-tag-cloud a:hover {
  color: #03c785;
}
.blog-details-wrapper .single-post-item .post-content .wp-block-query .wp-block-post-template {
  padding-left: 0;
}
.blog-details-wrapper .single-post-item .post-content .wp-block-query .wp-block-post-template .wp-block-post {
  margin-bottom: 30px;
}
.blog-details-wrapper .single-post-item .post-content .wp-block-navigation__responsive-container-content .wp-block-page-list {
  padding-left: 0;
}
.blog-details-wrapper .single-post-item .post-content .wp-block-group {
  margin: 15px 0;
}
.blog-details-wrapper .single-post-item .post-content .wp-block-group p {
  margin-bottom: 0;
}
.blog-details-wrapper .single-post-item .post-content p {
  margin-bottom: 20px;
}
.blog-details-wrapper .single-post-item .post-content p img {
  margin: 20px 0;
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .blog-details-wrapper .single-post-item .post-content .gallery-image {
    margin-bottom: 30px;
  }
}
.blog-details-wrapper .single-post-item.post-1786 .post-meta-info {
  margin-bottom: 20px;
  display: block;
}
.blog-details-wrapper .single-post-item.post-1778 .post-content-wrapper p {
  line-height: normal;
}
.blog-details-wrapper .single-post-item.post-1782 .post-content-wrapper {
  padding-top: 0;
}
.blog-details-wrapper .wp-block-calendar {
  margin-bottom: 30px;
}

.author-info {
  background-color: #ECF4FE;
  padding: 40px;
  display: flex;
  gap: 30px;
  border-radius: 30px;
  position: relative;
  justify-content: center;
  margin-top: 80px;
  margin-bottom: 80px;
}
.author-info .author-thumb {
  flex-shrink: 0;
}
.author-info .author-thumb a {
  flex-shrink: 0;
  width: 165px;
  height: 165px;
  border-radius: 50px;
  overflow: hidden;
}
.author-info .author-thumb img {
  border-radius: 50%;
}
.author-info .author-text h3 {
  font-size: 28px;
  font-weight: 600;
  margin-bottom: 10px;
  line-height: 36px;
}
.author-info .author-text .designation {
  font-size: 16px;
  font-style: italic;
  color: #8f939b;
  font-family: var(--yt-font);
  text-transform: capitalize;
}
.author-info .author-text p {
  margin-top: 10px;
  margin-bottom: 0;
  color: #292929;
  font-size: 18px;
  font-family: var(--yt-font);
}
.author-info .author-social-profiles {
  margin-top: 20px;
  display: flex;
  gap: 10px;
  justify-content: center;
}
.author-info .author-social-profiles a {
  font-size: 18px;
  color: #ffffff;
  transition: all 0.5s ease-out;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #03c785;
  border-radius: 10px;
}
.author-info .author-social-profiles a:hover {
  transition: all 0.5s ease-out;
  background-color: #ffffff;
  color: #03c785;
}
.author-info .author-post a {
  font-size: 16px;
  font-weight: 500;
  font-family: var(--yt-font);
  color: #292929;
  border-bottom: 2px solid #03c785;
  margin-top: 30px;
  display: inline-block;
}
.author-info .author-post a:hover {
  color: #03c785;
}

.blog-post-nav {
  margin: 40px 0;
  background: #fff;
  display: flex;
  justify-content: space-between;
  gap: 30px;
  border-top: 1px solid #E7E7E7;
}
@media only screen and (min-width: 992px) and (max-width: 1024px) {
  .blog-post-nav {
    padding: 30px;
    margin: 30px 0;
  }
}
@media (max-width: 767px) {
  .blog-post-nav {
    flex-direction: column;
    padding: 30px;
    margin: 30px 0;
  }
}
.blog-post-nav .divider {
  background-color: rgb(223, 226, 233);
  width: 1px;
}
@media only screen and (min-width: 992px) and (max-width: 1024px) {
  .blog-post-nav .divider {
    width: 100%;
    height: 1px;
  }
}
@media (max-width: 767px) {
  .blog-post-nav .divider {
    width: 100%;
    height: 1px;
  }
}
.blog-post-nav .post-navigation {
  display: flex;
  gap: 20px;
  flex-basis: 0;
  flex-grow: 1;
  width: 50%;
  padding: 30px 0;
}
@media (max-width: 374px) {
  .blog-post-nav .post-navigation {
    flex-direction: column !important;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1024px) {
  .blog-post-nav .post-navigation {
    width: 100%;
  }
}
@media (max-width: 767px) {
  .blog-post-nav .post-navigation {
    width: 100%;
  }
}
.blog-post-nav .post-navigation:last-child {
  flex-direction: row-reverse;
}
.blog-post-nav .post-navigation:last-child .text {
  text-align: right;
}
@media (max-width: 374px) {
  .blog-post-nav .post-navigation:last-child .text {
    text-align: left;
  }
}
.blog-post-nav .post-navigation .post-img {
  width: 96px;
  height: 96px;
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  flex-shrink: 0;
}
@media (max-width: 374px) {
  .blog-post-nav .post-navigation .post-img {
    width: 100% !important;
    height: 150px !important;
  }
}
.blog-post-nav .post-navigation .post-img img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  left: 0;
  top: 0;
}
.blog-post-nav .post-navigation .text {
  width: 100%;
}
.blog-post-nav .post-navigation .text span a {
  font-size: 14px;
  font-family: var(--yt-font);
  text-transform: capitalize;
  font-weight: 600;
  color: #292929;
  display: inline-block;
  padding: 10px 20px;
  border-radius: 50px;
  background-color: #D9EAFD;
  line-height: initial;
  margin-bottom: 10px;
}
.blog-post-nav .post-navigation .text span a:hover {
  background-color: #03c785;
  color: #292929;
}
.blog-post-nav .post-navigation .text .post-title {
  font-size: 18px;
  margin: 0;
  line-height: 27px;
  text-transform: capitalize;
}
.blog-post-nav .post-navigation .text .post-title a {
  color: #292929;
  font-weight: 700;
  font-size: 18px;
  line-height: 27px;
  text-transform: capitalize;
  transition: all 0.5s ease-out;
}
.blog-post-nav .post-navigation .text .post-title a:hover {
  color: #03c785;
  transition: all 0.5s ease-out;
}

.skill-progressbar-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 20px;
}

.skill-progressbar .progress-inner-item {
  position: relative;
  margin-bottom: 10px;
  line-height: inherit;
}
.skill-progressbar .skill-title {
  z-index: 100;
  color: #292929;
  font-size: 18px;
  font-weight: 500;
  font-family: var(--yt-font);
}
.skill-progressbar .progressbar-number {
  width: 100%;
  z-index: 10;
}
.skill-progressbar .progress-number-count {
  padding: 0 8px;
  position: absolute;
  transform: translateX(-50%);
}
.skill-progressbar .progressbar-number,
.skill-progressbar .progress-number-count {
  font-size: 16px;
  line-height: 41px;
  height: 8px;
  letter-spacing: 0px;
  font-weight: 400;
  text-transform: none;
  font-family: var(--yt-font);
  color: #525256;
}
.skill-progressbar .progress-content-outter {
  height: 8px;
  background-color: rgb(234, 234, 234);
  border-radius: 20px;
}
.skill-progressbar .progress-content {
  height: 8px;
  background-color: #03c785;
  width: 0%;
  border-radius: 20px;
}

.cta-area.style-1 {
  padding-top: 60px;
  position: relative;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta-area.style-1 {
    padding: 100px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-1 {
    padding-top: 50px;
  }
}
.cta-area.style-1 .cta-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 1;
  height: 391px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta-area.style-1 .cta-wrapper {
    height: 340px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-1 .cta-wrapper {
    height: unset;
    flex-direction: column;
    gap: 24px;
  }
}
/* ≥1200 两列并排时，左列原来写死 391px、右卡是 height:100% 跟着行高走，
   宽度越窄右侧文案换行越多 → 1200 时右卡比左边高出 79px，三张卡底部不齐。
   改成让左列撑满行高，行高由内容最高的那一列决定，三张卡自然等高。 */
@media only screen and (min-width: 1200px) {
  .cta-area.style-1 .col-xl-8 {
    display: flex;
    flex-direction: column;
  }
  .cta-area.style-1 .cta-wrapper {
    height: auto;
    flex: 1 1 auto;
  }
}
.cta-area.style-1 .section-title {
  background-color: #03c785;
  width: 27%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin: 0;
  padding: 40px;
  border-radius: 35px 35px 0;
  position: relative;
  z-index: 10;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .cta-area.style-1 .section-title {
    padding: 30px;
    width: 30%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta-area.style-1 .section-title {
    padding: 30px;
    width: 30%;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-1 .section-title {
    width: 100%;
    height: 300px;
    border-radius: 25px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .cta-area.style-1 .section-title {
    padding: 30px;
  }
}
.cta-area.style-1 .section-title .btn-inner {
  padding: 20px 0;
}
@media (max-width: 991px) {
  .cta-area.style-1 .section-title .btn-inner {
    padding-bottom: 16px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-1 .section-title .btn-inner {
    padding: 12px 0;
  }
}
.cta-area.style-1 .section-title span {
  font-family: var(--yt-font);
  font-size: 24px;
  font-weight: 600;
  line-height: initial;
  letter-spacing: -0.36px;
  color: #292929;
  text-transform: capitalize;
  text-decoration: none;
  transition: all 0.5s ease-out;
}
.cta-area.style-1 .section-title .sec-content .title {
  font-size: 24px;
  line-height: normal;
  letter-spacing: -0.34px;
  margin-bottom: 8px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .cta-area.style-1 .section-title .sec-content .title {
    font-size: 22px;
    letter-spacing: -0.32px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta-area.style-1 .section-title .sec-content .title {
    font-size: 20px;
    line-height: 32px;
    letter-spacing: -0.28px;
  }
}
.cta-area.style-1 .section-title .sec-content .number {
  font-size: 95px;
  line-height: 104.5px;
  letter-spacing: -1.425px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .cta-area.style-1 .section-title .sec-content .number {
    font-size: 80px;
    line-height: 92px;
    letter-spacing: -1.04px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta-area.style-1 .section-title .sec-content .number {
    font-size: 80px;
    line-height: 92px;
    letter-spacing: -1.04px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-1 .section-title .sec-content .number {
    font-size: 68px;
  }
}
.cta-area.style-1 .section-title .info-card-inner .btn-wrapper {
  width: unset;
}
.cta-area.style-1 .section-title .info-card-inner .btn-wrapper .theme-btn {
  font-size: 24px;
  text-transform: capitalize;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .cta-area.style-1 .section-title .info-card-inner .btn-wrapper .theme-btn {
    font-size: 20px;
    margin-left: -15px;
  }
}
.cta-area.style-1 .section-title .info-card-inner .btn-wrapper .theme-btn:hover {
  background-color: #ffffff;
  transition: all 0.5s ease-out;
}
.cta-area.style-1 .service-btn-area {
  width: 221px;
  height: 158px;
  background-color: #03c785;
  border-radius: 0 35px 35px 0;
  position: absolute;
  z-index: 4;
  bottom: 0;
  left: 100%;
  display: flex;
  justify-content: start;
  align-items: center;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .cta-area.style-1 .service-btn-area {
    width: 200px;
    height: 130px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta-area.style-1 .service-btn-area {
    width: 185px;
    height: 130px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-1 .service-btn-area {
    width: unset;
    height: unset;
    bottom: 30px;
    left: unset;
    right: 40px;
    background: none;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .cta-area.style-1 .service-btn-area {
    right: 15px;
  }
}
.cta-area.style-1 .service-btn-area .theme-btn {
  margin-left: 17px;
  line-height: initial;
  text-transform: capitalize;
  border-radius: 50px;
  background-color: #ffffff;
  color: #016042;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-1 .service-btn-area .theme-btn {
    margin: 0;
  }
}
.cta-area.style-1 .service-btn-area .theme-btn:hover {
  color: #ffffff;
  background-color: #045e44;
}
.cta-area.style-1 .service-btn-area .left-sticky-corner {
  position: absolute;
  transform: rotate(180deg);
  top: -34.5px;
  left: -1.5px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-1 .service-btn-area .left-sticky-corner {
    display: none;
  }
}
.cta-area.style-1 .image-wrapper {
  width: 70.5%;
  height: 100%;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 35px;
  position: relative;
  margin-top: 0;
  z-index: 2;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .cta-area.style-1 .image-wrapper {
    width: 66%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta-area.style-1 .image-wrapper {
    width: 66%;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-1 .image-wrapper {
    width: 100%;
    height: 250px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .cta-area.style-1 .image-wrapper {
    height: 200px;
  }
}
.cta-area.style-1 .image-wrapper .rectangle-shape {
  width: 221px;
  height: 183px;
  border-radius: 0 30px 0 0;
  background-color: #ffffff;
  position: absolute;
  z-index: 3;
  bottom: 0;
  left: 0;
  top: unset;
  z-index: 4;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .cta-area.style-1 .image-wrapper .rectangle-shape {
    width: 200px;
    height: 160px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta-area.style-1 .image-wrapper .rectangle-shape {
    width: 185px;
    height: 155px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-1 .image-wrapper .rectangle-shape {
    display: none;
  }
}
.cta-area.style-1 .image-wrapper .rectangle-shape .top-sticky-corner {
  position: absolute;
  top: -35px;
  left: -2px;
  transform: rotate(-180deg);
}
.cta-area.style-1 .image-wrapper .rectangle-shape .right-sticky-corner {
  position: absolute;
  bottom: 0px;
  right: -34px;
  transform: rotate(-180deg);
}
.cta-area.style-2 {
  padding-top: 140px;
  padding-bottom: 132px;
  position: relative;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta-area.style-2 {
    padding: 100px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-2 {
    padding: 80px 0;
  }
}
.cta-area.style-2 .cta-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
}
@media (max-width: 991px) {
  .cta-area.style-2 .cta-wrapper {
    margin-right: 0;
  }
}
.cta-area.style-2 .section-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 0px;
  gap: 10px;
}
.cta-area.style-2 .section-title .sec-content .title {
  font-size: 64px;
  line-height: 76.8px;
  letter-spacing: -0.96px;
  text-align: start;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .cta-area.style-2 .section-title .sec-content .title {
    text-align: center;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .cta-area.style-2 .section-title .sec-content .title {
    text-align: center;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta-area.style-2 .section-title .sec-content .title {
    font-size: 54px;
    line-height: 64.8px;
    text-align: center;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-2 .section-title .sec-content .title {
    font-size: 48px;
    line-height: 60.8px;
    text-align: center;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .cta-area.style-2 .section-title .sec-content .title {
    font-size: 32px;
    line-height: 48.8px;
  }
}
.cta-area.style-2 .section-title .sec-content .video-popup-btn {
  height: 100%;
  justify-content: start;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .cta-area.style-2 .section-title .sec-content .video-popup-btn {
    justify-content: center;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .cta-area.style-2 .section-title .sec-content .video-popup-btn {
    justify-content: center;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta-area.style-2 .section-title .sec-content .video-popup-btn {
    justify-content: center;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-2 .section-title .sec-content .video-popup-btn {
    justify-content: center;
  }
}
.cta-area.style-2 .section-title .sec-content .content {
  font-size: 36px;
  line-height: 46.8px;
  letter-spacing: -0.54px;
  margin-top: 10px;
  text-align: start;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .cta-area.style-2 .section-title .sec-content .content {
    text-align: center;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .cta-area.style-2 .section-title .sec-content .content {
    text-align: center;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta-area.style-2 .section-title .sec-content .content {
    font-size: 32px;
    text-align: center;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-2 .section-title .sec-content .content {
    font-size: 32px;
    text-align: center;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .cta-area.style-2 .section-title .sec-content .content {
    font-size: 24px;
    line-height: 38.8px;
  }
}
.cta-area.style-2 .section-title .sec-content .content img {
  width: 123px;
  height: 48px;
  border-radius: 24px;
  object-fit: cover;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .cta-area.style-2 .section-title .sec-content .content img {
    width: 115px;
    height: 35px;
  }
}

.section-title {
  margin-bottom: 60px;
  display: flex;
  flex-direction: column;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .section-title {
    margin-bottom: 40px;
  }
}
.section-title .short-title-wrapper {
  border-bottom: 1px solid #C0C0C0;
  margin-bottom: 24px;
  padding-bottom: 6px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .section-title .short-title-wrapper {
    padding-bottom: 10px;
    margin-bottom: 18px;
  }
}
.section-title .short-title-wrapper .short-title {
  font-family: var(--yt-font);
  font-size: 16px;
  font-weight: 700;
  line-height: 22.4px;
  letter-spacing: -0.24px;
  text-transform: uppercase;
  color: #292929;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.section-title .main-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .section-title .main-content {
    flex-direction: column;
    align-items: start;
    gap: 24px;
  }
}
.section-title .sec-content {
  display: flex;
  flex-direction: column;
  z-index: 2;
  position: relative;
}
.section-title .sec-content .desc {
  margin-top: 24px;
  margin-bottom: 0;
}
@media (max-width: 550px) {
  .section-title .sec-content {
    width: 100%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-title .sec-content .sec-desc p br {
    display: none;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .section-title .sec-content .sec-desc p br {
    display: none;
  }
}
.section-title .sec-content .title,
.section-title .sec-content .desc,
.section-title .sec-content .btn-wrapper {
  -webkit-animation-name: MovefadeUp;
  animation-name: MovefadeUp;
  -webkit-animation-fill-mode: both;
}
.section-title .sec-content .title {
  animation-delay: 0.7s;
  animation-duration: 0.7s;
  transition: all 0.5s ease-out;
  margin-top: 10px;
}
.section-title .sec-content .desc {
  animation-delay: 0.9s;
  animation-duration: 0.9s;
  transition: all 0.5s ease-out;
}
.section-title .sec-content .btn-wrapper {
  animation-delay: 1s;
  animation-duration: 1s;
  transition: all 0.5s ease-out;
}
.section-title .title {
  font-family: var(--yt-font);
  font-size: 64px;
  font-weight: 600;
  line-height: 77px;
  letter-spacing: -0.96px;
  color: #292929;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .section-title .title {
    font-size: 48px;
    line-height: 60px;
    letter-spacing: -0.72px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-title .title {
    font-size: 48px;
    line-height: 60px;
    letter-spacing: -0.72px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1024px) {
  .section-title .title {
    font-size: 47px;
    line-height: 58px;
    letter-spacing: -0.72px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-title .title {
    font-size: 38px;
    line-height: 48px;
    letter-spacing: -0.34px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .section-title .title {
    font-size: 32px;
    line-height: 42px;
    letter-spacing: -0.24px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .section-title .title {
    font-size: 28px;
    line-height: 42px;
    letter-spacing: -0.24px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .section-title .title br {
    display: none;
  }
}
.section-title .title span {
  color: #03c785;
}
.section-title .desc {
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 400;
  line-height: 32px;
  color: #525256;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .section-title .desc {
    font-size: 16px;
    line-height: 30px;
  }
}

.page-breadcrumb-area {
  padding-top: 240px;
  padding-bottom: 140px;
  position: relative;
  z-index: 2;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  background-color: #ECF4FE;
  border-radius: 30px;
  margin: 20px 20px 0 20px;
}
@media (max-width: 767px) {
  .page-breadcrumb-area {
    padding-top: 150px;
    padding-bottom: 100px;
  }
}
.page-breadcrumb-area.style-2 {
  padding-bottom: 440px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .page-breadcrumb-area.style-2 {
    padding-bottom: 140px;
  }
}

.page-overlay {
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.7) 100%);
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  z-index: -1;
  display: none;
}

.page-heading h3,
.page-heading .page-title {
  font-size: 64px;
  letter-spacing: -0.96px;
  margin-bottom: 0;
  text-transform: capitalize;
  line-height: 76.8px;
  /* 原来是 600：Arial 只有 400/700 两档，600 会被浏览器直接映射成 Bold，
     内页标题和面包屑都像加粗过度（用户 2026-11-09 要求英文不加粗）。 */
  font-weight: 400;
  text-align: center;
  color: #fff;
}
@media (max-width: 375px) {
  .page-heading h3,
  .page-heading .page-title {
    font-size: 32px;
    line-height: 42px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .page-heading h3,
  .page-heading .page-title {
    font-size: 42px;
    line-height: 52px;
  }
}

.breadcrumb-wrapper {
  padding: 0px;
}
@media (max-width: 1199px) {
  .breadcrumb-wrapper {
    padding: 0;
  }
}

.breadcrumb-list {
  text-align: center;
}
.breadcrumb-list ul {
  margin-bottom: 0;
  padding-left: 0;
  display: inline-flex;
  gap: 0 12px;
  flex-wrap: wrap;
  justify-content: center;
  text-align: left;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .breadcrumb-list ul {
    align-items: center;
  }
}
.breadcrumb-list ul li {
  list-style: none;
  display: inline-flex;
  gap: 0 12px;
  align-items: center;
  color: #fff;
}
.breadcrumb-list ul li a {
  font-family: var(--yt-font);
  font-size: 16px;
  color: #fff;
  text-transform: capitalize;
  line-height: 22.4px;
  font-weight: 400;
  margin-bottom: 0;
  letter-spacing: -0.24px;
  transition: all 0.5s ease-out;
  
}
.breadcrumb-list ul li a:hover {
  transition: all 0.5s ease-out;
}
.breadcrumb-list ul li:before {
  content: "\f054";
  font-size: 12px;
  font-family: "Font Awesome 6 Pro";
  display: inline-flex;
  color: #fff;
}
.breadcrumb-list ul li:first-child:before {
  display: none;
}
@media (max-width: 375px) {
  .breadcrumb-list ul li:first-child:before {
    display: block !important;
  }
}

.wp-block-query-pagination,
.navigation.posts-navigation,
.comment-navigation {
  display: flex;
  align-items: center;
}
.wp-block-query-pagination .wp-block-query-pagination-numbers,
.navigation.posts-navigation .wp-block-query-pagination-numbers,
.comment-navigation .wp-block-query-pagination-numbers {
  width: inherit;
}
.wp-block-query-pagination .nav-links,
.navigation.posts-navigation .nav-links,
.comment-navigation .nav-links {
  display: flex;
  gap: 20px;
}
.wp-block-query-pagination .wp-block-query-pagination-previous,
.wp-block-query-pagination .wp-block-query-pagination-next,
.wp-block-query-pagination .nav-next a,
.wp-block-query-pagination .nav-previous a,
.navigation.posts-navigation .wp-block-query-pagination-previous,
.navigation.posts-navigation .wp-block-query-pagination-next,
.navigation.posts-navigation .nav-next a,
.navigation.posts-navigation .nav-previous a,
.comment-navigation .wp-block-query-pagination-previous,
.comment-navigation .wp-block-query-pagination-next,
.comment-navigation .nav-next a,
.comment-navigation .nav-previous a {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #525256;
  background-color: #ffffff;
  height: 53px;
  padding: 0 20px;
  transition: all 0.5s ease-out;
  font-size: 18px;
  font-weight: 500;
  border: 1px solid #D9EAFD;
  text-transform: capitalize;
}
@media (max-width: 767px) {
  .wp-block-query-pagination .wp-block-query-pagination-previous,
  .wp-block-query-pagination .wp-block-query-pagination-next,
  .wp-block-query-pagination .nav-next a,
  .wp-block-query-pagination .nav-previous a,
  .navigation.posts-navigation .wp-block-query-pagination-previous,
  .navigation.posts-navigation .wp-block-query-pagination-next,
  .navigation.posts-navigation .nav-next a,
  .navigation.posts-navigation .nav-previous a,
  .comment-navigation .wp-block-query-pagination-previous,
  .comment-navigation .wp-block-query-pagination-next,
  .comment-navigation .nav-next a,
  .comment-navigation .nav-previous a {
    height: 40px;
  }
}
.wp-block-query-pagination .wp-block-query-pagination-previous:hover,
.wp-block-query-pagination .wp-block-query-pagination-next:hover,
.wp-block-query-pagination .nav-next a:hover,
.wp-block-query-pagination .nav-previous a:hover,
.navigation.posts-navigation .wp-block-query-pagination-previous:hover,
.navigation.posts-navigation .wp-block-query-pagination-next:hover,
.navigation.posts-navigation .nav-next a:hover,
.navigation.posts-navigation .nav-previous a:hover,
.comment-navigation .wp-block-query-pagination-previous:hover,
.comment-navigation .wp-block-query-pagination-next:hover,
.comment-navigation .nav-next a:hover,
.comment-navigation .nav-previous a:hover {
  background: #03c785 !important;
  color: #ffffff;
  border-color: #03c785;
  transition: all 0.5s ease-out;
}

.basic-pagination,
.page-links,
.wp-block-query-pagination-numbers {
  display: inline-flex;
  width: 100%;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 40px;
}
.basic-pagination ul,
.page-links ul,
.wp-block-query-pagination-numbers ul {
  display: inline-flex;
  width: 100%;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  list-style: none;
  margin-bottom: 0;
  padding-left: 0;
}
.basic-pagination ul li,
.page-links ul li,
.wp-block-query-pagination-numbers ul li {
  padding-top: 0;
}
.basic-pagination ul .prev span,
.basic-pagination ul .next span,
.page-links ul .prev span,
.page-links ul .next span,
.wp-block-query-pagination-numbers ul .prev span,
.wp-block-query-pagination-numbers ul .next span {
  display: none;
}
.basic-pagination .post-page-numbers,
.page-links .post-page-numbers,
.wp-block-query-pagination-numbers .post-page-numbers {
  background-color: rgba(71, 112, 247, 0.1) !important;
}
.basic-pagination .page-numbers,
.basic-pagination .post-page-numbers,
.page-links .page-numbers,
.page-links .post-page-numbers,
.wp-block-query-pagination-numbers .page-numbers,
.wp-block-query-pagination-numbers .post-page-numbers {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #292929;
  background-color: rgba(217, 234, 253, 0.4);
  border-radius: 8px;
  height: 48px;
  width: 50px;
  transition: all 0.5s ease-out;
  font-size: 20px;
  font-weight: 500;
  text-transform: capitalize;
  font-family: var(--yt-font);
}
@media (max-width: 767px) {
  .basic-pagination .page-numbers,
  .basic-pagination .post-page-numbers,
  .page-links .page-numbers,
  .page-links .post-page-numbers,
  .wp-block-query-pagination-numbers .page-numbers,
  .wp-block-query-pagination-numbers .post-page-numbers {
    width: 40px;
    height: 40px;
    font-size: 16px;
  }
}
.basic-pagination .page-numbers:hover,
.basic-pagination .post-page-numbers:hover,
.page-links .page-numbers:hover,
.page-links .post-page-numbers:hover,
.wp-block-query-pagination-numbers .page-numbers:hover,
.wp-block-query-pagination-numbers .post-page-numbers:hover {
  background: #03c785 !important;
  color: #292929;
  transition: all 0.5s ease-out;
}
.basic-pagination .page-numbers.current,
.basic-pagination .post-page-numbers.current,
.page-links .page-numbers.current,
.page-links .post-page-numbers.current,
.wp-block-query-pagination-numbers .page-numbers.current,
.wp-block-query-pagination-numbers .post-page-numbers.current {
  background: #03c785 !important;
  color: #292929;
  transition: all 0.5s ease-out;
}

.project-details .section-title {
  margin-bottom: 33px;
}
.project-details .section-title .desc {
  margin-top: 6px;
}

.project-details-image {
  border-radius: 12px;
  position: relative;
  margin-bottom: 56px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .project-details-image {
    margin-bottom: 32px;
  }
}
.project-details-image img {
  border-radius: 24px;
  width: 100%;
  height: 464px;
  object-fit: cover;
}

.project-details-video .video-popup-card {
  margin-top: 56px;
  margin-bottom: 36px;
}

.project-details-title {
  font-size: 24px;
  line-height: 28px;
  font-weight: 700;
  color: #292929;
}

.project-info-widget {
  padding: 40px 48px 35px 48px;
  border-radius: 12px;
  display: flex;
  justify-content: space-between;
  box-shadow: 0px 24px 64px 0px rgba(199, 206, 218, 0.25);
  border: 1px solid #292929;
  margin: 0 40px;
  z-index: 10;
  position: relative;
  background-color: #FFF089;
}
@media (max-width: 991px) {
  .project-info-widget {
    margin: 40px 12px;
    flex-direction: column;
    gap: 12px;
    box-shadow: none;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .project-info-widget {
    margin: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .project-info-widget {
    padding: 28px 40px;
    margin: 0;
  }
}
.project-info-widget .info-item {
  display: flex;
  flex-direction: column;
}
.project-info-widget .info-item h6 {
  margin: 0;
  color: #292929;
  font-size: 20px;
  font-weight: 500;
  line-height: 34px;
  letter-spacing: -0.2px;
}
.project-info-widget .info-item p {
  margin: 0;
  color: #292929;
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 400;
  line-height: 32px;
}

.simillar-project-title h2 {
  font-size: 36px;
  line-height: 50px;
  font-weight: 700;
  color: #292929;
  margin: 0;
}
@media (max-width: 767px) {
  .simillar-project-title h2 {
    font-size: 28px;
    line-height: 32px;
  }
}
@media (max-width: 991px) {
  .simillar-project-title {
    margin-bottom: 30px;
  }
}

.info-wrapper {
  display: flex;
  gap: 40px;
}

.project-details-title h3, .project-details-title p {
  margin: 0;
}
.project-details-title p {
  margin-top: 16px;
  color: #292929;
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 400;
  line-height: 32px;
}

.image-wrapper {
  display: inline-flex;
  gap: 40px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .image-wrapper {
    flex-direction: column;
    gap: 30px;
  }
}
.image-wrapper .image {
  border-radius: 24px;
  overflow: hidden;
}
.image-wrapper .image img {
  transform: scale(1.01);
  transition: all 0.5s ease-out;
}
.image-wrapper .image:hover img {
  transform: scale(1.03);
  transition: all 0.5s ease-out;
}

.list-item-wrapper {
  margin-top: 32px;
}
.list-item-wrapper ul {
  margin-bottom: 0;
  list-style: none;
  padding-left: 0;
}
.list-item-wrapper ul li {
  align-items: center;
  position: relative;
  display: flex;
  align-items: center;
  justify-self: center;
  gap: 13px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .list-item-wrapper ul li {
    align-items: start;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .list-item-wrapper ul li {
    align-items: start !important;
  }
  .list-item-wrapper ul li:before {
    margin-top: 6px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .list-item-wrapper ul li {
    align-items: start;
  }
}
.list-item-wrapper ul li:before {
  content: "\f00c";
  font-family: "Font Awesome 6 Pro";
  font-size: 12px;
  font-weight: 600;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background-color: #03c785;
  left: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 0;
  flex-shrink: 0;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .list-item-wrapper ul li:before {
    margin-top: 6px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .list-item-wrapper ul li:before {
    margin-top: 8px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .list-item-wrapper ul li:before {
    margin-top: 4px;
  }
}

@media only screen and (min-width: 0px) and (max-width: 767px) {
  .more-project-area .section-title-wrapper {
    flex-direction: column;
    gap: 24px;
  }
}
.more-project-area .project-card {
  margin-top: 56px;
}

.project-info-widget {
  padding: 40px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  border: 1px solid #D9EAFD;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .project-info-widget {
    flex-direction: column;
    justify-content: space-between;
  }
}
.project-info-widget .divider {
  width: 100%;
  height: 1px;
  background-color: rgba(41, 41, 41, 0.2);
}
.project-info-widget .info-item {
  display: flex;
  flex-direction: column;
}
.project-info-widget .info-item p {
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 400;
  line-height: 32px;
  color: #525256;
  margin-bottom: 0;
}
.project-info-widget .info-item h6 {
  font-family: var(--yt-font);
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  color: #292929;
  margin-bottom: 0;
}

.list-item-wrapper {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .list-item-wrapper {
    gap: 10px;
  }
}
.list-item-wrapper .list-item {
  display: flex;
  gap: 15px;
  flex-wrap: nowrap;
  align-items: center;
}
.list-item-wrapper .list-item .icon {
  font-size: 20px;
  color: #03c785;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border-radius: 50%;
}
.list-item-wrapper .list-item .text {
  font-size: 16px;
  font-weight: 400;
  line-height: initial;
  margin-bottom: 0;
  color: #525256;
}
.list-item-wrapper .list-item.style-two {
  gap: 10px;
}
.list-item-wrapper .list-item.style-two .icon {
  font-size: 8px;
}

@media (max-width: 991px) {
  .sidebar {
    padding-left: 0;
    padding-top: 40px;
  }
}

.page-sidebar {
  margin-bottom: 50px;
  padding-left: 18px;
}

/* Widget */
.widget {
  background-color: #ECF4FE;
  padding: 32px;
  margin-bottom: 40px;
  border-radius: 30px;
  /* Widget Instagram Feed */
  /* Widget Title */
  /* Social Widget Block */
  /* Recent Comment List Block Widget & Latest Post Widget Block */
  /* Social Widget */
  /* Select Option  */
  /* Login Widget */
  /* Tagcloud Widget */
  /* Default Widget */
}
@media (max-width: 991px) {
  .widget {
    padding: 20px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .widget {
    padding: 20px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .widget {
    padding: 30px;
  }
}
.widget:last-child {
  margin-bottom: 0;
}
.widget ol,
.widget ul {
  margin-bottom: 0;
}
.widget .widget-instagram-feed {
  width: 315px;
}
@media only screen and (min-width: 992px) and (max-width: 1280px) {
  .widget .widget-instagram-feed {
    width: 220px;
  }
}
@media (max-width: 374px) {
  .widget .widget-instagram-feed {
    width: 200px;
  }
}
.widget .widget-instagram-feed .single-instagram-feed {
  width: 96px;
  height: 96px;
}
.widget .wp-block-heading,
.widget .widget-title,
.widget .wp-block-search__label {
  font-size: 24px;
  display: flex;
  align-items: center;
  line-height: 30px;
  font-weight: 700;
  margin-bottom: 26px;
  color: #292929;
  position: relative;
}
.widget .wp-block-social-links .wp-social-link {
  padding: 0;
  margin: 0;
  line-height: 0;
}
.widget .wp-block-social-links .wp-social-link a {
  width: 44px;
  height: 44px;
  padding: 0;
  display: flex;
  justify-content: center;
}
.widget .has-avatars.has-dates.has-excerpts.wp-block-latest-comments li.wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta,
.widget .has-dates.has-excerpts.wp-block-latest-comments li.wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta {
  font-weight: 500;
  color: #292929;
}
.widget .has-avatars.has-dates.has-excerpts.wp-block-latest-comments li.wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-author,
.widget .has-avatars.has-dates.has-excerpts.wp-block-latest-comments li.wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-link,
.widget .has-dates.has-excerpts.wp-block-latest-comments li.wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-author,
.widget .has-dates.has-excerpts.wp-block-latest-comments li.wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-link {
  font-weight: 500;
}
.widget .wp-block-latest-comments li.wp-block-latest-comments__comment,
.widget .wp-block-latest-posts li.wp-block-latest-comments__comment {
  margin-bottom: 0;
}
.widget .wp-block-latest-comments li .wp-block-latest-comments__comment-meta,
.widget .wp-block-latest-comments li .wp-block-latest-posts__post-title,
.widget .wp-block-latest-posts li .wp-block-latest-comments__comment-meta,
.widget .wp-block-latest-posts li .wp-block-latest-posts__post-title {
  line-height: 28px;
  font-weight: 400;
}
.widget .wp-block-latest-comments li .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-date,
.widget .wp-block-latest-comments li .wp-block-latest-posts__post-title .wp-block-latest-comments__comment-date,
.widget .wp-block-latest-posts li .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-date,
.widget .wp-block-latest-posts li .wp-block-latest-posts__post-title .wp-block-latest-comments__comment-date {
  font-size: 14px !important;
  margin-bottom: 10px;
  position: relative;
  color: #525256;
}
.widget .wp-block-latest-comments li .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-date:before,
.widget .wp-block-latest-comments li .wp-block-latest-posts__post-title .wp-block-latest-comments__comment-date:before,
.widget .wp-block-latest-posts li .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-date:before,
.widget .wp-block-latest-posts li .wp-block-latest-posts__post-title .wp-block-latest-comments__comment-date:before {
  content: "\f274";
  font-family: "Font Awesome 6 Pro";
  padding-right: 8px;
}
.widget .wp-block-latest-comments li a,
.widget .wp-block-latest-posts li a {
  color: #292929;
}
.widget .wp-block-latest-comments li a.wp-block-latest-comments__comment-author, .widget .wp-block-latest-comments li a.wp-block-latest-comments__comment-link,
.widget .wp-block-latest-posts li a.wp-block-latest-comments__comment-author,
.widget .wp-block-latest-posts li a.wp-block-latest-comments__comment-link {
  display: inline !important;
  text-transform: capitalize;
  line-height: 28px;
  font-weight: 400;
}
.widget .wp-block-latest-comments li a:hover,
.widget .wp-block-latest-posts li a:hover {
  color: #03c785;
}
.widget .wp-block-latest-comments li .wp-block-latest-comments__comment-excerpt p,
.widget .wp-block-latest-posts li .wp-block-latest-comments__comment-excerpt p {
  font-size: 18px;
  line-height: 28px;
  margin: 0;
}
.widget .social-profile {
  justify-content: flex-start;
}
.widget .social-profile a {
  width: 60px;
  height: 60px;
  background-color: #03c785;
  color: #ffffff;
  transition: all 0.5s ease-out;
  border-radius: 50px;
  flex-shrink: 0;
  flex-wrap: wrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 1199px) {
  .widget .social-profile a {
    width: 40px;
    height: 40px;
  }
}
.widget .social-profile a.facebook {
  background-color: #1877f2;
}
.widget .social-profile a.twitter {
  background-color: #1da1f2;
}
.widget .social-profile a.linkedin {
  background-color: #0a66c2;
}
.widget .social-profile a.instagram {
  background-color: #405de6;
}
.widget .social-profile a:hover {
  color: #ffffff;
  transition: all 0.5s ease-out;
  background-color: #03c785;
}
.widget select {
  max-width: 100%;
  height: 62px;
  width: 100%;
  border: 1px solid #D9EAFD;
  padding: 0 10px;
  border-radius: 50px;
  color: #525256;
  margin-bottom: 0;
  background-color: #ffffff;
}
.widget .has-login-form .login-username label,
.widget .has-login-form .login-password label {
  margin-bottom: 10px;
}
.widget .has-login-form .login-username input,
.widget .has-login-form .login-password input {
  max-width: 100%;
  height: 50px;
  width: 100%;
  border: 1px solid #D9EAFD;
  padding: 0 10px;
  border-radius: 50px;
  color: #525256;
}
.widget .has-login-form .login-remember label {
  display: flex;
  align-items: center;
  gap: 10px;
}
.widget .has-login-form .login-submit {
  margin-bottom: 0;
}
.widget .has-login-form .login-submit input.button-primary {
  display: inline-flex;
  background: #03c785;
  color: #292929;
  padding: 12px 32px;
  text-align: center;
  font-weight: 700;
  font-family: var(--yt-font);
  text-transform: capitalize;
  position: relative;
  z-index: 1;
  transition: 0.3s;
  font-size: 18px;
  align-items: center;
  gap: 10px;
  border-radius: 50px;
  transition: all 0.5s ease-out;
}
.widget .has-login-form .login-submit input.button-primary:hover {
  background-color: #292929;
  color: #ffffff;
  transition: all 0.5s ease-out;
}
.widget .tagcloud,
.widget .wp-block-tag-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
}
.widget .tagcloud a,
.widget .wp-block-tag-cloud a {
  color: #292929;
  display: inline-block;
  font-size: 14px;
  font-family: var(--yt-font);
  font-weight: 600;
  line-height: initial;
  padding: 11px 24px;
  letter-spacing: -0.21px;
  transition: all 0.5s ease-out;
  background-color: #ffffff;
  text-transform: uppercase;
  border-radius: 50px;
}
.widget .tagcloud a:hover,
.widget .wp-block-tag-cloud a:hover {
  color: #292929;
  background: #03c785;
  transition: all 0.5s ease-out;
}
.widget ul,
.widget ol {
  margin-bottom: 0;
  padding-left: 0;
  /* Tag Cloud Widget */
}
.widget ul li,
.widget ol li {
  display: block;
  padding: 7px 0;
  border-bottom: 1px solid #D9EAFD;
  /* Recent Comment Widget */
}
.widget ul li:first-child,
.widget ol li:first-child {
  padding-top: 0;
}
.widget ul li:last-child,
.widget ol li:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}
.widget ul li.recentcomments .comment-author-link a:before,
.widget ol li.recentcomments .comment-author-link a:before {
  display: block;
}
.widget ul li.recentcomments a,
.widget ol li.recentcomments a {
  padding-left: 0;
  display: inline;
}
.widget ul li.recentcomments a:before,
.widget ol li.recentcomments a:before {
  display: none;
}
.widget ul li a,
.widget ol li a {
  color: #292929;
  position: relative;
  display: inline-block;
  text-transform: capitalize;
  font-size: 18px;
  font-family: var(--yt-font);
  font-weight: 400;
  transition: all 0.5s ease-out;
  /* RSS Widget */
}
.widget ul li a:hover,
.widget ol li a:hover {
  color: #03c785;
  transition: all 0.5s ease-out;
}
.widget ul li a.rsswidget,
.widget ol li a.rsswidget {
  padding-left: 0;
  font-weight: 500;
  display: block;
}
.widget ul li a.rsswidget:before,
.widget ol li a.rsswidget:before {
  display: none;
}
.widget ul li ul,
.widget ol li ul {
  padding-left: 25px;
  padding-top: 10px;
}
.widget ul.wp-tag-cloud li,
.widget ol.wp-tag-cloud li {
  display: inline-block;
  padding: 0;
  border: 0;
}
.widget ul.wp-tag-cloud li a:before,
.widget ol.wp-tag-cloud li a:before {
  display: none;
}
.widget .wp-block-categories li,
.widget .wp-block-archives li {
  text-align: right;
  display: inline-block;
  width: 100%;
}
.widget .wp-block-categories li.cat-item,
.widget .wp-block-archives li.cat-item {
  text-align: right;
  display: inline-block;
  width: 100%;
}
.widget .wp-block-categories li a,
.widget .wp-block-archives li a {
  float: left;
}
.widget.widget_categories ul li, .widget.widget_archive ul li {
  text-align: right;
  display: inline-block;
  width: 100%;
}
.widget.widget_categories ul li.cat-item, .widget.widget_archive ul li.cat-item {
  text-align: right;
  display: inline-block;
  width: 100%;
}
.widget.widget_categories ul li a, .widget.widget_archive ul li a {
  float: left;
}

/* About Info Widget*/
.widget-about-info {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.widget-about-info .about-desc {
  text-align: left;
}
.widget-about-info .about-desc .about-title {
  font-size: 20px;
}
.widget-about-info .about-image {
  width: 140px;
  height: 140px;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 20px;
}
.widget-about-info .social-profile {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 30px;
  border-top: 1px solid #292929;
  width: 100%;
  margin-top: 10px;
}
.widget-about-info .social-profile a {
  transition: all 0.5s ease-out;
  width: 44px;
  height: 44px;
  background-color: #292929;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #292929;
  transition: all 0.5s ease-out;
}
.widget-about-info .social-profile a:hover {
  color: #ffffff;
  transition: all 0.5s ease-out;
  background-color: #03c785;
}

/* Latest Post Widget*/
.has-dates.has-author.wp-block-latest-posts .wp-block-latest-posts__post-title {
  display: inline-block;
  width: 100%;
  font-weight: 500;
}

.widget_rss .wp-block-heading:before,
.widget_rss .widget-title:before {
  display: none;
}
.widget_rss .rss-widget-icon {
  margin-right: 6px;
}
.widget_rss ul li a.rsswidget {
  color: #292929;
}
.widget_rss ul li a.rsswidget:hover {
  color: #03c785;
}

.wp-block-latest-posts .wp-block-rss__item-title,
.wp-block-rss .wp-block-rss__item-title,
.widget_rss .wp-block-rss__item-title {
  display: inline-block;
  width: 100%;
  font-weight: 500;
}
.wp-block-latest-posts .wp-block-rss__item-title > a,
.wp-block-rss .wp-block-rss__item-title > a,
.widget_rss .wp-block-rss__item-title > a {
  color: #292929;
  font-weight: 500;
}
.wp-block-latest-posts .wp-block-latest-posts__post-author,
.wp-block-latest-posts .wp-block-rss__item-publish-date,
.wp-block-rss .wp-block-latest-posts__post-author,
.wp-block-rss .wp-block-rss__item-publish-date,
.widget_rss .wp-block-latest-posts__post-author,
.widget_rss .wp-block-rss__item-publish-date {
  margin-right: 10px;
}
.wp-block-latest-posts .wp-block-latest-posts__post-author,
.wp-block-latest-posts .wp-block-latest-posts__post-date,
.wp-block-latest-posts .wp-block-rss__item-publish-date,
.wp-block-latest-posts .wp-block-rss__item-author,
.wp-block-latest-posts .rss-date,
.wp-block-rss .wp-block-latest-posts__post-author,
.wp-block-rss .wp-block-latest-posts__post-date,
.wp-block-rss .wp-block-rss__item-publish-date,
.wp-block-rss .wp-block-rss__item-author,
.wp-block-rss .rss-date,
.widget_rss .wp-block-latest-posts__post-author,
.widget_rss .wp-block-latest-posts__post-date,
.widget_rss .wp-block-rss__item-publish-date,
.widget_rss .wp-block-rss__item-author,
.widget_rss .rss-date {
  display: inline-block;
  font-size: 14px !important;
  font-weight: 500;
  text-transform: capitalize;
  position: relative;
}
.wp-block-latest-posts .wp-block-latest-posts__post-date:before,
.wp-block-latest-posts .wp-block-rss__item-publish-date:before,
.wp-block-latest-posts .rss-date:before,
.wp-block-rss .wp-block-latest-posts__post-date:before,
.wp-block-rss .wp-block-rss__item-publish-date:before,
.wp-block-rss .rss-date:before,
.widget_rss .wp-block-latest-posts__post-date:before,
.widget_rss .wp-block-rss__item-publish-date:before,
.widget_rss .rss-date:before {
  content: "\f274";
  font-family: "Font Awesome 6 Pro";
  padding-right: 8px;
}
.wp-block-latest-posts .wp-block-latest-posts__post-author:before,
.wp-block-latest-posts .wp-block-rss__item-author:before,
.wp-block-rss .wp-block-latest-posts__post-author:before,
.wp-block-rss .wp-block-rss__item-author:before,
.widget_rss .wp-block-latest-posts__post-author:before,
.widget_rss .wp-block-rss__item-author:before {
  content: "\f007";
  font-family: "Font Awesome 6 Pro";
  padding-right: 8px;
}
.wp-block-latest-posts .wp-block-latest-posts__post-excerpt,
.wp-block-latest-posts .wp-block-rss__item-excerpt,
.wp-block-latest-posts .rssSummary,
.wp-block-rss .wp-block-latest-posts__post-excerpt,
.wp-block-rss .wp-block-rss__item-excerpt,
.wp-block-rss .rssSummary,
.widget_rss .wp-block-latest-posts__post-excerpt,
.widget_rss .wp-block-rss__item-excerpt,
.widget_rss .rssSummary {
  margin-top: 10px;
  margin-bottom: 0;
}

.widget_latest_post ul li {
  display: flex;
  gap: 24px;
  margin-bottom: 10px;
  border: 0;
  align-items: center;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .widget_latest_post ul li {
    gap: 10px;
  }
}
.widget_latest_post ul li:hover .latest-post-thumb img {
  transform: scale(1.2);
  transition: all 0.5s ease-out;
}
.widget_latest_post ul li:last-child {
  margin-bottom: 0;
}
.widget_latest_post ul li a {
  padding-left: 0;
}
.widget_latest_post ul li a:before {
  display: none;
}
.widget_latest_post ul li .latest-post-thumb {
  flex-shrink: 0;
  overflow: hidden;
  width: 102px;
  height: 102px;
  border-radius: 12px;
  position: relative;
}
.widget_latest_post ul li .latest-post-thumb a {
  width: 100%;
  height: 100%;
}
.widget_latest_post ul li .latest-post-thumb img {
  width: 100%;
  height: 100%;
  position: absolute;
  object-fit: cover;
  top: 0;
  left: 0;
  transform: scale(1);
  transition: all 0.5s ease-out;
}
.widget_latest_post ul li .latest-post-desc {
  flex-direction: column-reverse;
  display: flex;
}
.widget_latest_post ul li .latest-post-desc .latest-post-title {
  margin-bottom: 8px;
  font-size: 28px;
  line-height: 36px;
  letter-spacing: -0.42px;
  color: #292929;
  font-family: var(--yt-font);
  font-weight: 600;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .widget_latest_post ul li .latest-post-desc .latest-post-title {
    font-size: 18px;
    height: auto;        /* 原为 height:60px + overflow:hidden，会把较长标题裁成两行 */
    overflow: visible;
  }
}
.widget_latest_post ul li .latest-post-desc .latest-post-title a {
  /* 标题最多显示 2 行，超出以省略号收尾 */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  font-size: 18px;
  line-height: 27px;
  color: #292929;
  font-weight: 700;
  position: relative;
  text-transform: capitalize;
  transition: all 0.5s ease-out;
  font-family: var(--yt-font);
}
/* 侧栏「最近文章」个别标题需按原文大小写显示（模板默认 capitalize 会把每个词首字母强制大写） */
.widget_latest_post ul li .latest-post-desc .latest-post-title a.no-caps {
  text-transform: none;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .widget_latest_post ul li .latest-post-desc .latest-post-title a {
    font-size: 18px;
    line-height: normal;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .widget_latest_post ul li .latest-post-desc .latest-post-title a {
    font-size: 18px;
  }
}
.widget_latest_post ul li .latest-post-desc .latest-post-title a:hover {
  color: #03c785;
  transition: all 0.5s ease-out;
}
.widget_latest_post ul li .latest-post-desc .latest-post-meta {
  font-size: 14px;
  display: flex;
  align-items: center;
  font-weight: 400;
  gap: 8px;
  color: #292929;
  font-family: var(--yt-font);
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .widget_latest_post ul li .latest-post-desc .latest-post-meta {
    font-size: 15px;
    line-height: normal;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .widget_latest_post ul li .latest-post-desc .latest-post-meta {
    font-size: 14px;
    line-height: normal;
  }
}

.widget-instagram-feed {
  display: grid;
  flex-wrap: wrap;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 12px;
  width: 240px;
}
@media only screen and (min-width: 992px) and (max-width: 1280px) {
  .widget-instagram-feed {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 767px) {
  .widget-instagram-feed {
    grid-template-columns: repeat(2, 1fr);
    width: auto !important;
  }
}
.widget-instagram-feed .single-instagram-feed {
  border-radius: 6px;
  width: 72px;
  height: 72px;
  overflow: hidden;
  position: relative;
  flex-shrink: 0;
}
.widget-instagram-feed .single-instagram-feed:hover img {
  transform: scale(1.1);
  transition: all 0.5s ease-out;
}
.widget-instagram-feed .single-instagram-feed img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  left: 0;
  top: 0;
  transform: scale(1);
  transition: all 0.5s ease-out;
}

.widget_promotion {
  padding-top: 50px;
  padding-bottom: 50px;
  text-align: center;
  background-color: #292929;
}
.widget_promotion .wp-block-heading {
  width: 100%;
  text-align: center;
  color: #ffffff;
  font-size: 40px;
  line-height: 56px;
  margin-bottom: 10px;
}
.widget_promotion .secondary-btn {
  display: inline-block;
  background: #03c785;
  color: #292929;
  padding: 12px 104px;
  font-weight: 500;
  font-family: var(--yt-font);
  text-transform: capitalize;
  position: relative;
  z-index: 1;
  transition: all 0.5s ease-out;
  font-size: 18px;
  align-items: center;
  gap: 10px;
  border-radius: 10px;
}
.widget_promotion .secondary-btn i {
  color: #fff;
  font-size: 18px;
}
.widget_promotion .secondary-btn:hover {
  transition: all 0.5s ease-out;
  background-color: #ffffff;
  border-color: #ffffff;
}
.widget_promotion p {
  color: rgba(255, 255, 255, 0.53);
  margin-bottom: 32px;
}

.single-post-item .single-post-meta {
  gap: 32px;
}

@media (max-width: 767px) {
  .service-sidebar {
    margin-top: 56px !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-sidebar {
    margin-top: 80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .service-sidebar {
    margin-top: 100px;
  }
}
.service-sidebar .service-widget {
  margin-bottom: 40px;
  background-color: #ECF4FE;
  padding: 32px;
  border-radius: 30px;
}
.service-sidebar .service-widget:last-child {
  margin-bottom: 0;
}
.service-sidebar .service-widget .title {
  color: #525256;
  font-size: 36px;
  font-style: normal;
  font-weight: 600;
  line-height: 47px;
  letter-spacing: -0.54px;
  margin-bottom: 32px;
}
.service-sidebar .service-widget.widget_luxelife_contact_info_widget {
  background-color: #ECF4FE;
  padding: 32px;
  margin-bottom: 40px;
}
.service-sidebar .service-widget.contact {
  text-align: center;
  background-color: #FFF089;
}
.service-sidebar .service-widget.contact .btn-wrapper:hover .theme-btn, .service-sidebar .service-widget.contact .btn-wrapper:hover .circle-arrow-btn {
  background-color: #292929;
  transition: all 0.5s ease-out;
}
.service-sidebar .service-widget.contact .btn-wrapper .theme-btn, .service-sidebar .service-widget.contact .btn-wrapper .circle-arrow-btn {
  background-color: #ffffff;
  transition: all 0.5s ease-out;
}

.widget_contact_form .comment-respond {
  padding: 0;
  border: 0;
  margin: 0;
}

.widget_service_categories {
  margin-bottom: 50px;
  padding: 0px;
  background: transparent;
}
.widget_service_categories ul {
  padding-left: 0;
  list-style: none;
}
.widget_service_categories ul li {
  background-color: #ffffff;
  width: 100%;
  padding: 17px 25px;
  border-radius: 15px;
  margin-bottom: 15px;
  transition: all 0.5s ease-out;
}
.widget_service_categories ul li a {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
  color: #525256;
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 700;
  line-height: 28px;
  width: 100%;
}
.widget_service_categories ul li a:after {
  content: "\e09f";
  color: #525256;
  font-family: "Font Awesome 6 Pro";
  font-size: 16px;
  transition: all 0.5s ease-out;
}
.widget_service_categories ul li a i {
  color: #03c785;
  font-size: 24px;
  font-weight: 600;
  transition: all 0.5s ease-out;
}
.widget_service_categories ul li:hover {
  background: #03c785;
  color: #525256;
  transition: all 0.5s ease-out;
}
.widget_service_categories ul li:hover:after {
  color: #525256;
}
.widget_service_categories ul li:hover i {
  color: #525256;
  transition: all 0.5s ease-out;
}
.widget_service_categories ul li.active {
  background: #03c785;
}
.widget_service_categories ul li.active a {
  color: #525256;
}
.widget_service_categories ul li.active a:after {
  color: #525256;
}
.widget_service_categories ul li.active a i {
  color: #525256;
}

.footer-widget-info {
  position: relative;
}
.footer-widget-info ul {
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}
.footer-widget-info ul li {
  display: flex;
  align-items: center;
  gap: 17px;
  color: #292929;
  padding: 0;
  margin-top: 5px;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 32px;
}
.footer-widget-info ul li a {
  color: #292929;
}
.footer-widget-info ul li p {
  margin-bottom: 0;
}
.footer-widget-info ul li i {
  color: #130F26;
  font-weight: 600;
  font-size: 20px;
}
.footer-widget-info ul li:first-child {
  margin-top: 0;
}
.footer-widget-info ul li .contact-icon {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background-color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.footer-widget-info ul li .contact-text .sub-title {
  font-size: 16px;
  font-weight: 400;
  line-height: 27px;
}
.footer-widget-info ul li .contact-text .contact-title {
  font-weight: 500;
  line-height: 28px;
  color: #04144E;
}
.footer-widget-info .extra-info .time-slot {
  display: flex;
  align-items: center;
  gap: 17px;
  color: #292929;
}
.footer-widget-info .extra-info .time-slot p {
  margin-bottom: 0;
}
.footer-widget-info .wp-block-heading {
  color: #ffffff;
  font-size: 30px;
}
.footer-widget-info .wp-block-heading::before {
  display: none;
}
.footer-widget-info .promotion-card {
  position: relative;
  z-index: 0;
  display: flex;
  flex-direction: column;
  gap: 50px;
}
.footer-widget-info .promotion-card .short-desc {
  font-size: 18px;
  line-height: 30px;
  font-weight: 400;
}
.footer-widget-info .promotion-card h4 {
  color: #ffffff;
  font-family: var(--yt-font);
  font-size: 24px;
  line-height: 36px;
  font-weight: 500;
  margin: 0;
}
.footer-widget-info .promotion-card .secondary-btn {
  display: flex;
  align-items: center;
  gap: 18px;
}
.footer-widget-info .promotion-card .secondary-btn .icon {
  width: 60px;
  height: 60px;
  border-radius: 50px;
  background: #03c785;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 18px;
}
.footer-widget-info .promotion-card .secondary-btn .icon i {
  color: #ffffff;
}
.footer-widget-info .promotion-card .secondary-btn .btn-text {
  display: flex;
  flex-direction: column;
  justify-content: start;
}
.footer-widget-info .promotion-card .secondary-btn .btn-text p {
  margin: 0;
  text-align: start;
  color: #ffffff;
  font-family: var(--yt-font);
  font-size: 14px;
  line-height: 30px;
  font-weight: 400;
}
.footer-widget-info .promotion-card .secondary-btn .btn-text h4 {
  margin: 0;
  text-align: start;
  color: #ffffff;
  font-family: var(--yt-font);
  font-size: 18px;
  line-height: 30px;
  font-weight: 500;
}

.widget_service_brochura {
  padding: 38px;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 5px;
  background-color: #F4F4F4;
}
.widget_service_brochura .widget-title-wrapper {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.widget_service_brochura .widget-title-wrapper .widget-subtitle {
  color: #FFF089;
  font-family: var(--yt-font);
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
  margin: 0;
}
.widget_service_brochura .widget-title-wrapper .widget-title {
  color: #292929;
  font-family: var(--yt-font);
  font-size: 24px;
  line-height: 36px;
  font-weight: 700;
}
.widget_service_brochura .widget-title-wrapper .widget-title:before {
  display: none;
}
.widget_service_brochura .button-wrapper {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.widget_service_brochura .button-wrapper .btn-text {
  color: #ffffff;
  font-family: var(--yt-font);
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
}
.widget_service_brochura .button-wrapper .pdf {
  padding: 18px;
  background-color: #03c785;
}
.widget_service_brochura .button-wrapper .pdf:hover {
  background-color: #292929;
}
.widget_service_brochura .button-wrapper .doc {
  padding: 18px;
  background-color: #292929;
}
.widget_service_brochura .button-wrapper .doc:hover {
  background-color: #03c785;
}

.blog-coment-title h2,
.blog-coment-title .wp-block-comments-title,
.wp-block-comments h2,
.wp-block-comments .wp-block-comments-title {
  font-size: 48px;
  line-height: 56px;
  margin-bottom: 0;
  font-weight: 500;
  margin-top: -10px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .blog-coment-title h2,
  .blog-coment-title .wp-block-comments-title,
  .wp-block-comments h2,
  .wp-block-comments .wp-block-comments-title {
    font-size: 32px;
    line-height: 34px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-coment-title h2,
  .blog-coment-title .wp-block-comments-title,
  .wp-block-comments h2,
  .wp-block-comments .wp-block-comments-title {
    font-size: 38px;
    line-height: 42px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-coment-title h2,
  .blog-coment-title .wp-block-comments-title,
  .wp-block-comments h2,
  .wp-block-comments .wp-block-comments-title {
    font-size: 42px;
    line-height: 56px;
  }
}

/* Block Comment Start */
.wp-block-comments .wp-block-comment-template {
  padding-left: 0;
}
.wp-block-comments .wp-block-comment-template .wp-block-comment-reply-link {
  margin-top: 15px;
}
.wp-block-comments .wp-block-comment-template li .wp-block-columns {
  padding: 50px;
  border: 1px solid #dfe2e9;
  margin-bottom: 24px;
}
.wp-block-comments .wp-block-comment-template li .wp-block-columns .wp-block-column:first-child {
  flex-basis: 80px !important;
}
.wp-block-comments .wp-block-comment-template li .wp-block-columns .wp-block-avatar {
  width: 100px;
  flex-shrink: 0;
  border-radius: 50%;
  overflow: hidden;
}
.wp-block-comments .wp-block-comment-template li .wp-block-columns .wp-block-avatar img {
  width: 100%;
}
.wp-block-comments .wp-block-comment-template li .wp-block-columns .wp-block-comment-author-name a {
  font-size: 21px;
  margin-bottom: 5px;
  font-weight: 500;
  font-family: var(--yt-font);
  color: #292929;
}
.wp-block-comments .wp-block-comment-template li .wp-block-columns .wp-block-comment-edit-link a {
  color: #03c785;
}
.wp-block-comments .wp-block-comment-template li .wp-block-columns .wp-block-comment-date a,
.wp-block-comments .wp-block-comment-template li .wp-block-columns .wp-block-comment-edit-link a {
  color: #9ba8c3;
  font-size: 16px;
  font-weight: 400;
  font-family: var(--yt-font);
}
.wp-block-comments .wp-block-comment-template li .wp-block-columns .wp-block-comment-reply-link a {
  font-size: 14px;
  font-weight: 500;
  color: #292929;
  border: 1px solid #03c785;
  padding: 4px 26px;
  display: inline-block;
}
.wp-block-comments .wp-block-comment-template li .wp-block-columns .wp-block-comment-reply-link a:hover {
  background-color: #03c785;
  color: #ffffff;
  transition: all 0.5s ease-out;
}

/* Block Comment End */
.latest-comments .comment-respond {
  margin-top: 30px;
}
.latest-comments li.comment {
  padding: 0;
}
.latest-comments li.comment .comments-box {
  padding-top: 48px;
  padding-bottom: 13px;
  border-top: 1px solid #D9EAFD;
}
.latest-comments li.comment .comments-box blockquote {
  box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.05);
  background-color: #ffffff;
  margin-right: 40px;
}
.latest-comments li.comment .children li.comment .comments-box {
  border-top: 1px solid #D9EAFD;
}
.latest-comments li.comment:first-child .comments-box {
  border-top: 0;
}
.latest-comments li .children {
  padding-left: 0;
}
.latest-comments li .children .comments-box {
  margin-left: 106px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .latest-comments li .children .comments-box {
    margin-left: 0;
  }
}
.latest-comments li .comments-box .comments-avatar {
  float: left;
  width: 104px;
  height: 104px;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  margin-right: 30px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .latest-comments li .comments-box .comments-avatar {
    float: inherit;
    margin-bottom: 20px;
  }
}
.latest-comments li .comments-box .comments-avatar img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  top: 0;
  left: 0;
}
.latest-comments li .comments-box .comments-text {
  overflow: hidden;
}
.latest-comments li .comments-box .comments-text p {
  font-size: 18px;
  line-height: 30px;
  margin-bottom: 20px;
  color: #525256;
  font-family: var(--yt-font);
}
.latest-comments li .comments-box .comments-text .avatar-name {
  margin-bottom: 10px;
  position: relative;
}
.latest-comments li .comments-box .comments-text .avatar-name h5 {
  font-size: 18px;
  margin-bottom: 5px;
  font-weight: 600;
  line-height: 27px;
  font-family: var(--yt-font);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.latest-comments li .comments-box .comments-text .avatar-name span {
  color: #525256;
  font-size: 14px;
  font-weight: 400;
  font-family: var(--yt-font);
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .latest-comments li .comments-box .comments-text .avatar-name span {
    display: inline-block;
    width: 100%;
  }
}
.latest-comments li .comments-box .comments-text .comment-reply-link {
  display: inline-flex;
  align-items: center;
  font-size: 16px;
  font-weight: 600;
  color: #292929;
  border: 1px solid transparent;
  padding: 5px 24px;
  gap: 8px;
  position: absolute;
  top: 0;
  right: 0;
  background-color: #D9EAFD;
  border-radius: 50px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .latest-comments li .comments-box .comments-text .comment-reply-link {
    position: unset;
    margin-top: 10px;
  }
}
.latest-comments li .comments-box .comments-text .comment-reply-link:hover {
  background-color: #03c785;
  color: #292929;
  transition: all 0.5s ease-out;
}

.post-comments .latest-comments > ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
}

.comments-text > ul, .comments-text > ol {
  margin-bottom: 20px;
}

ul.children {
  list-style: none;
}

.image-card {
  background-color: #ffffff;
}
.image-card:hover .image img {
  transform: scale(1.03);
  transition: all 0.5s ease-out;
}
.image-card .image {
  position: relative;
  overflow: hidden;
}
.image-card .image img {
  width: 100%;
  transform: scale(1);
  transition: all 0.5s ease-out;
}
.image-card .image .icon {
  position: absolute;
  top: 10px;
  left: 10px;
  width: 100px;
  height: 100px;
  padding: 17px;
  background-color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .image-card .image .icon {
    width: 80px;
    height: 80px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .image-card .image .icon {
    width: 80px;
    height: 80px;
  }
}
.image-card .image .icon img {
  width: auto;
}
.image-card .content-wrapper {
  padding: 30px 40px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.image-card .content-wrapper .title {
  font-size: 24px;
  line-height: 30px;
  font-weight: 700;
  margin: 0;
  color: #292929;
  transition: all 0.6s ease;
}
.image-card .content-wrapper .content p {
  margin-bottom: 0;
}

/*Comment Input Filed*/
.post-comments-title .sub-title {
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 700;
  line-height: 27px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: #03c785;
  display: inline-block;
  width: 100%;
  margin-bottom: 10px;
}
.post-comments-title h2 {
  font-family: var(--yt-font);
  font-size: 48px;
  font-weight: 700;
  line-height: 60px;
  color: #292929;
  margin-bottom: 32px;
  display: flex;
  justify-content: space-between;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .post-comments-title h2 {
    font-size: 42px;
    line-height: 56px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .post-comments-title h2 {
    font-size: 28px;
    line-height: 42px;
    margin-bottom: 24px;
  }
}
.post-comments-title h2 small {
  font-size: 16px;
  font-family: var(--yt-font);
  color: #03c785;
}
.post-comments-title .desc {
  font-family: var(--yt-font);
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  color: #D9EAFD;
  margin-bottom: 30px;
}

.comment-respond {
  position: relative;
  background-color: #ECF4FE;
  padding: 32px;
  border-radius: 30px;
}
.comment-respond .contacts-email,
.comment-respond .contacts-name,
.comment-respond .single-input-field,
.comment-respond .contacts-message {
  margin-bottom: 20px;
  position: relative;
}
.comment-respond .contacts-email label,
.comment-respond .contacts-name label,
.comment-respond .single-input-field label,
.comment-respond .contacts-message label {
  font-size: 18px;
  color: #292929;
  margin-bottom: 8px;
}
.comment-respond .checkbox-field-wrapper {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
  padding: 15px 0;
}
.comment-respond .checkbox-field-wrapper p {
  margin: 0;
}
.comment-respond .checkbox-field-wrapper .single-checkbox-field {
  margin-bottom: 0;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 16px;
  font-weight: 400;
  font-family: var(--yt-font);
}
.comment-respond .comment-form-cookies-consent {
  display: none;
}
.comment-respond input[type=number] {
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}
.comment-respond input,
.comment-respond select {
  padding: 0 20px;
  height: 60px;
  width: 100%;
  color: #525256;
  opacity: 1;
  border: 1px solid #ffffff !important;
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  background-color: #ffffff;
  font-family: var(--yt-font) !important;
  border-radius: 12px;
}
.comment-respond .theme-btn {
  padding: 10px 30px;
  line-height: 34px;
}
.comment-respond *::-webkit-input-placeholder {
  color: #525256;
}
.comment-respond *:-moz-placeholder {
  color: #525256;
  opacity: 1;
}
.comment-respond *::-moz-placeholder {
  color: #525256;
  opacity: 1;
}
.comment-respond *:-ms-input-placeholder {
  color: #525256;
}
.comment-respond *::-ms-input-placeholder {
  color: #525256;
}
.comment-respond *::placeholder {
  color: #525256;
}
.comment-respond .contacts-message {
  margin-bottom: 10px;
}
.comment-respond textarea {
  resize: vertical;
  padding: 20px;
  width: 100%;
  color: #525256;
  border: 1px solid #ffffff !important;
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  background-color: #ffffff;
  font-family: var(--yt-font) !important;
  height: 150px;
  margin-bottom: 0;
  border-radius: 12px;
}
.comment-respond input:focus,
.comment-respond textarea:focus,
.comment-respond .form-select:focus {
  outline: none !important;
  box-shadow: none;
  border-color: #03c785 !important;
  transition: all 0.4s ease 0s;
}

.team-member-card {
  position: relative;
  top: 0;
  transition: all 0.5s ease-out;
}
.team-member-card:hover {
  top: -5px;
  transition: all 0.5s ease-out;
}
.team-member-card:hover .image:before {
  height: 250%;
  transition: all 900ms linear;
  background-color: transparent;
}
.team-member-card:hover .image img {
  transform: scale(1.1);
  transition: all 0.5s ease-out;
}
.team-member-card:hover .image .social-profile a {
  visibility: visible;
  opacity: 1;
  transform: translateX(0);
  transition: all 0.5s ease-out;
}
.team-member-card.style-1 {
  overflow: hidden;
}
.team-member-card.style-1:hover .image-card-wrapper .icon-shape {
  transform: translate(-8px, 8px);
  transition: all 0.5s ease-out;
}
.team-member-card.style-1:hover .image-card-wrapper .sticky-corner {
  transform: translate(60px, -60px);
  visibility: hidden;
  opacity: 0;
  transition: all 0.5s ease-out;
}
.team-member-card.style-1 .image-card-wrapper {
  position: relative;
}
.team-member-card.style-1 .image-card-wrapper .icon-shape {
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  transition: all 0.5s ease-out;
}
.team-member-card.style-1 .image-card-wrapper .icon-shape a {
  width: 64px;
  height: 64px;
  background-color: #03c785;
  border-radius: 50%;
  color: #292929;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 24px;
  transition: all 0.5s ease-out;
}
.team-member-card.style-1 .image-card-wrapper .icon-shape a:hover {
  background-color: #292929;
  color: #ffffff;
  transition: all 0.5s ease-out;
}
.team-member-card.style-1 .image-card-wrapper .icon-shape a i {
  transform: rotate(-45deg);
}
.team-member-card.style-1 .image-card-wrapper .icon-shape .sticky-corner {
  position: absolute;
  z-index: -1;
  width: auto;
  height: auto;
  top: 0;
  right: 0;
  transition: all 0.5s ease-out;
}
.team-member-card .image {
  overflow: hidden;
  position: relative;
  border-radius: 30px;
}
.team-member-card .image:before {
  position: absolute;
  width: 200%;
  height: 0%;
  left: 50%;
  top: 50%;
  background-color: rgba(255, 255, 255, 0.3);
  transform: translate(-50%, -50%) rotate(-45deg);
  content: "";
  z-index: 1;
}
.team-member-card .image img {
  width: 100%;
  height: 100%;
  transform: scale(1);
  transition: all 0.5s ease-out;
}
.team-member-card .image .social-profile {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transform: translateY(-50%);
}
.team-member-card .image .social-profile :nth-child(1) {
  transform: translateX(-35px);
}
.team-member-card .image .social-profile :nth-child(1) i {
  transform: translateX(0);
}
.team-member-card .image .social-profile :nth-child(2) {
  transform: translateX(-60px);
}
.team-member-card .image .social-profile :nth-child(2) i {
  transform: translateX(0);
}
.team-member-card .image .social-profile :nth-child(3) {
  transform: translateX(-35px);
}
.team-member-card .image .social-profile :nth-child(3) i {
  transform: translateX(0);
}
.team-member-card .image .social-profile :nth-child(4) {
  transform: translateX(-60px);
}
.team-member-card .image .social-profile :nth-child(4) i {
  transform: translateX(0);
}
.team-member-card .image .social-profile a {
  width: 44px;
  height: 44px;
  font-size: 20px;
  color: #292929;
  background-color: #ffffff;
  border-radius: 50%;
  visibility: hidden;
  opacity: 0;
  transition: all 0.5s ease-out;
}
.team-member-card .image .social-profile a:hover {
  background-color: #03c785;
  transition: all 0.5s ease-out;
}
.team-member-card .content-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 100%;
  margin-top: 24px;
  z-index: 2;
}
.team-member-card .content-wrapper .content {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  z-index: 1;
  gap: 8px;
}
.team-member-card .content-wrapper .content .title {
  font-size: 28px;
  line-height: 36.4px;
  font-weight: 600;
  letter-spacing: -0.42px;
  color: #292929;
  margin: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .team-member-card .content-wrapper .content .title {
    font-size: 24px;
  }
}
@media (max-width: 991px) {
  .team-member-card .content-wrapper .content .title {
    font-size: 22px;
  }
}
.team-member-card .content-wrapper .content .desc {
  font-size: 16px;
  line-height: 22.4px;
  font-weight: 600;
  color: #292929;
  letter-spacing: -0.24px;
  text-transform: uppercase;
  font-family: var(--yt-font);
  margin: 0;
}
@media (max-width: 991px) {
  .team-member-card .content-wrapper .content .desc {
    font-size: 14px;
  }
}
.team-member-card .content-wrapper .social {
  background: #03c785;
  padding: 18px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 22px;
  width: 94%;
  margin-top: -60px;
  z-index: -1;
  transition: all 0.5s ease-out;
}
.team-member-card .content-wrapper .social a:hover {
  color: #03c785;
  transition: all 0.5s ease-out;
}
.team-member-card .content-wrapper .social i {
  color: #ffffff;
}
.team-member-card:hover .content-wrapper .content {
  z-index: 1;
}
.team-member-card:hover .content-wrapper .social {
  margin-top: 0;
  z-index: 0;
}

.portfolio-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 40px 0;
  border-bottom: 1px solid #C0C0C0;
  cursor: default;
  position: relative;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .portfolio-card {
    flex-direction: column;
    text-align: center;
    gap: 20px;
    padding: 24px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .portfolio-card {
    gap: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .portfolio-card {
    gap: 16px;
  }
}
.portfolio-card:first-child {
  border-top: 1px solid #C0C0C0;
}
.portfolio-card:hover .btn-wrapper .arrow-btn {
  background-color: #03c785;
  border: 1px solid #03c785;
  transition: all 0.5s ease-out;
}
.portfolio-card:hover .image {
  opacity: 1;
  visibility: visible;
  transform: translateY(-30%) skewY(0) scaleZ(1) rotate(9deg);
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .portfolio-card:hover .image {
    transform: translateY(0) skewY(0) scaleZ(1.1) rotate(0);
  }
  .portfolio-card:hover .image img {
    transform: scale(1.1);
    transition: all 0.5s ease-out;
  }
}
.portfolio-card .title {
  font-size: 48px;
  font-weight: 600;
  line-height: 57.6px;
  letter-spacing: -0.72px;
  color: #292929;
  margin-bottom: 0;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .portfolio-card .title {
    font-size: 38px;
  }
}
.portfolio-card .image {
  position: absolute;
  border-radius: 30px;
  overflow: hidden;
  right: 22%;
  top: 0;
  opacity: 0;
  visibility: hidden;
  z-index: 1;
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .portfolio-card .image {
    position: relative;
    opacity: 1;
    visibility: visible;
    right: unset;
    width: 100%;
    height: 350px;
  }
}
.portfolio-card .image img {
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .portfolio-card .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
.portfolio-card .content {
  padding-right: 36px;
  flex-grow: 1;
  position: relative;
}
.portfolio-card .content .short-title {
  font-size: 16px;
  font-weight: 400;
  display: block;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .portfolio-card .content .short-title {
    font-size: 18px;
    margin-bottom: 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .portfolio-card .content .short-title {
    font-size: 18px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .portfolio-card .content .short-title {
    font-size: 18px;
  }
}
.portfolio-card .btn-wrapper .arrow-btn {
  width: 64px;
  height: 64px;
  border: 1px solid #292929;
  color: #292929;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  font-size: 20px;
  transition: all 0.5s ease-out;
}

.portfolio-fullscreen-image {
  height: 100%;
  width: 100%;
  position: relative;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .portfolio-fullscreen-image {
    min-height: 400px;
    margin: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .portfolio-fullscreen-image {
    min-height: 350px;
    margin: 0;
  }
}
.portfolio-fullscreen-image .tabimg {
  transform: scale(1.1);
  opacity: 0;
  transition: all 0.5s ease-out;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  left: 0;
  max-width: 645px;
  width: 100%;
  height: 100%;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .portfolio-fullscreen-image .tabimg {
    max-width: 100%;
  }
}
.portfolio-fullscreen-image .tabimg.active {
  transform: scale(1);
  opacity: 1;
}

.video-popup-card {
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 600px;
  padding: 60px;
  display: flex;
  justify-content: space-between;
  align-items: end;
  position: relative;
}
@media (max-width: 991px) {
  .video-popup-card {
    flex-direction: column-reverse;
    align-items: start;
    height: 550px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .video-popup-card {
    height: 450px;
    padding: 40px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .video-popup-card {
    padding: 40px;
  }
}
.video-popup-card .image {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 35px;
}
.video-popup-card .image .overlay {
  background-color: #292929;
  opacity: 0.5;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 35px;
}
.video-popup-card .content {
  position: relative;
  z-index: 2;
}
.video-popup-card .content .short-btn {
  padding: 8px 20px;
  border-radius: 50px;
  font-family: var(--yt-font);
  font-size: 14px;
  font-weight: 600;
  line-height: 19px;
  letter-spacing: -0.21px;
  text-transform: uppercase;
  color: #292929;
  background-color: #ffffff;
  transition: all 0.5s ease-out;
}
.video-popup-card .content .short-btn:hover {
  background-color: #292929;
  color: #ffffff;
  transition: all 0.5s ease-out;
}
.video-popup-card .content .title {
  font-family: var(--yt-font);
  font-size: 64px;
  font-weight: 600;
  line-height: 76px;
  letter-spacing: -0.96px;
  color: #ffffff;
  margin-top: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .video-popup-card .content .title {
    font-size: 48px;
    line-height: 60px;
    width: 80%;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .video-popup-card .content .title {
    font-size: 48px;
    line-height: 58px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .video-popup-card .content .title {
    font-size: 38px;
    line-height: 52px;
  }
}
@media (max-width: 1199px) {
  .video-popup-card .content .title br {
    display: none;
  }
}

.video-popup-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 2;
}
.video-popup-btn a {
  width: 66px;
  height: 66px;
  padding: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  text-transform: capitalize;
  background-color: #03c785;
  border-radius: 50%;
  box-shadow: 0 0 0 0 rgb(207, 244, 128);
  animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .video-popup-btn a {
    width: 70px;
    height: 70px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .video-popup-btn a {
    width: 70px;
    height: 70px;
  }
}
.video-popup-btn a i {
  color: #ffffff;
  font-size: 24px;
  margin-left: 6px;
  color: #292929;
}

.video-popup-card.style-3 .video-popup-btn {
  background-color: initial;
  border-radius: 50%;
  padding: 15px;
}
.video-popup-card.style-3 .video-popup-btn a {
  border: 1px solid #ffffff;
  background-color: initial;
  width: 130px;
  height: 130px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .video-popup-card.style-3 .video-popup-btn a {
    width: 100px;
    height: 100px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .video-popup-card.style-3 .video-popup-btn a {
    width: 80px;
    height: 80px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .video-popup-card.style-3 .video-popup-btn a {
    width: 80px;
    height: 80px;
  }
}
.video-popup-card.style-3 .video-popup-btn a i {
  color: #03c785;
  font-size: 46px;
  margin-top: 8px;
  margin-left: 6px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .video-popup-card.style-3 .video-popup-btn a i {
    font-size: 28px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .video-popup-card.style-3 .video-popup-btn a i {
    font-size: 24px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .video-popup-card.style-3 .video-popup-btn a i {
    font-size: 24px;
    margin-top: 0;
  }
}

.project-card {
  position: relative;
  height: 496px;
  border-radius: 35px;
  overflow: hidden;
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .project-card {
    height: 400px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .project-card {
    height: 400px;
  }
}
.project-card:hover .image img {
  transform: scale(1.03);
  transition: all 0.5s ease-out;
}
.project-card:hover .image .sticky-corner {
  z-index: 1;
}
.project-card:hover .main-content .main-content-wrapper {
  transform: translateY(0%);
  visibility: visible;
  opacity: 1;
  transition: all 0.5s ease-out;
}
.project-card:hover .main-content .btn-wrapper {
  transform: translate(0px, 0px);
  transition: all 0.5s ease-out;
}
.project-card:hover .main-content .btn-wrapper .circle-arrow-btn {
  background-color: #04c68a;color: #fff;
}
.project-card:hover .main-content .btn-wrapper .circle-arrow-btn:hover {
  background-color: #05c48d; color: #fff;
}
.project-card:hover .main-content .shape svg {
  opacity: 1;
  transform: translate(0, 0);
  transition: all 0.5s ease-out;
}
.project-card .main-content .main-content-wrapper {
  transform: translateY(70%);
  visibility: hidden;
  opacity: 0;
  transition: all 0.5s ease-out;
}
.project-card .image {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 35px;
}
.project-card .image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 35px;
  object-fit: cover;
  transform: scale(1.001);
  transition: all 0.5s ease-out;
}
.project-card .main-content {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 20px;
}
.project-card .main-content .btn-wrapper {
  position: absolute;
  z-index: 5;
  top: 0;
  right: 0;
  transform: translate(-8px, 8px);
  transition: all 0.5s ease-out;
}
.project-card .main-content .btn-wrapper .circle-arrow-btn {
  width: 64px;
  height: 64px;
  background-color: #ffffff;
  color: #035d46;
}
.project-card .main-content .shape {
  width: auto;
  height: auto;
  position: absolute;
  top: 0;
  right: 0;
  overflow: hidden;
  border-radius: 0 30px 0 0;
}
.project-card .main-content .shape svg {
  opacity: 0;
  transform: translate(60px, -60px);
  transition: all 0.5s ease-out;
}
.project-card .main-content .main-content-wrapper {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 16px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .project-card .main-content .main-content-wrapper {
    padding: 4px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .project-card .main-content .main-content-wrapper {
    padding: 4px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .project-card .main-content .main-content-wrapper {
    padding: 16px 24px;
  }
}
.project-card .main-content .main-content-wrapper .content {
  position: relative;
  padding: 24px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .project-card .main-content .main-content-wrapper .content {
    padding: 12px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .project-card .main-content .main-content-wrapper .content {
    padding: 12px;
  }
}
.project-card .main-content .main-content-wrapper .content .overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 25px;
  background-color: #025d45;
  opacity: 0.9;
  z-index: 5;
}
.about-us-area{ padding-top: 120px;}
.project-card .main-content .main-content-wrapper .content .content-inner {
  position: relative;
  z-index: 10;
}
.project-card .main-content .main-content-wrapper .short-text {
  background-color: #ffffff;
  color: #292929;
  padding: 8px 20px;
  border-radius: 50px;
  text-transform: uppercase;
  font-size: 14px;
  font-family: var(--yt-font);
  font-weight: 600;
  line-height: 20px;
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .project-card .main-content .main-content-wrapper .short-text {
    padding: 6px 16px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .project-card .main-content .main-content-wrapper .short-text {
    padding: 6px 16px;
  }
}
.project-card .main-content .main-content-wrapper .title {
  width: 100%;
  font-family: var(--yt-font);
  font-size: 28px;
  /* 2026-11-09 用户要求「不要加粗」，电脑端同步；Arial 写 600 会被映射成 Bold */
  font-weight: 400;
  line-height: 36px;
  letter-spacing: -0.42px;
  color: #fff;
  display: inline-block;
  margin-top: 10px;
}
@media only screen and (min-width: 1401px) and (max-width: 1450px) {
  .project-card .main-content .main-content-wrapper .title {
    font-size: 22px;
    line-height: 30px;
    letter-spacing: -0.32px;
  }
}
@media only screen and (min-width: 1451px) and (max-width: 1550px) {
  .project-card .main-content .main-content-wrapper .title {
    font-size: 24px;
    line-height: 32px;
  }
}
@media only screen and (min-width: 1551px) and (max-width: 1650px) {
  .project-card .main-content .main-content-wrapper .title {
    font-size: 26px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .project-card .main-content .main-content-wrapper .title {
    font-size: 20px;
    line-height: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .project-card .main-content .main-content-wrapper .title {
    font-size: 24px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .project-card .main-content .main-content-wrapper .title {
    font-size: 20px;
    line-height: 30px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .project-card .main-content .main-content-wrapper .title {
    font-size: 22px;
  }
}
.project-card .main-content .main-content-wrapper .title a:hover {
  color: #ffffff;
}

.project-card.style-2 {
  overflow: visible;
}
/* 带 .default-open 的 style-2 卡片（APPLICATIONS 区块第一张大卡）：默认即呈现悬停展开状态
   —— 图片放大 / 内容框展开 / 箭头按钮归位并转绿 / 白色装饰角显示。
   其余 style-2 卡片保持模板原有交互（默认收起，悬停才展开）。 */
.project-card.style-2.default-open .image img {
  transform: scale(1.03);
}
.project-card.style-2.default-open .main-content .main-content-wrapper {
  transform: translateY(0%);
  visibility: visible;
  opacity: 1;
}
.project-card.style-2.default-open .main-content .btn-wrapper {
  transform: translate(0px, 0px);
}
.project-card.style-2.default-open .main-content .btn-wrapper .circle-arrow-btn {
  background-color: #04c68a;
  color: #fff;
}
.project-card.style-2.default-open .main-content .shape svg {
  opacity: 1;
  transform: translate(0, 0);
}
.project-card.style-2 .main-content .main-content-wrapper {
  max-width: 440px;
  left: unset;
  right: 0;
  margin-bottom: -56px;
}
.project-card.style-2 .main-content .main-content-wrapper.only-one {
  max-width: 470px;
  right: 25px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .project-card.style-2 .main-content .main-content-wrapper.only-one {
    right: 0;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .project-card.style-2 .main-content .main-content-wrapper {
    margin-bottom: -40px;
    max-width: 250px;
    right: 4px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .project-card.style-2 .main-content .main-content-wrapper {
    right: 6px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .project-card.style-2 .main-content .main-content-wrapper {
    max-width: 335px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .project-card.style-2 .main-content .main-content-wrapper {
    margin-bottom: -40px;
    max-width: 250px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .project-card.style-2 .main-content .main-content-wrapper {
    max-width: unset;
  }
}
.project-card.style-2 .main-content .main-content-wrapper .content {
  padding: 24px 24px 35px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .project-card.style-2 .main-content .main-content-wrapper .content {
    padding: 12px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .project-card.style-2 .main-content .main-content-wrapper .content {
    padding: 12px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .project-card.style-2 .main-content .main-content-wrapper .content {
    padding: 16px;
  }
}

.flip-image-card {
  position: relative;
}
.flip-image-card:hover .flip-box .flip-front {
  transform: rotateY(-180deg);
  transform-style: preserve-3d;
}
.flip-image-card:hover .flip-box .flip-back {
  transform: rotateY(0deg);
  transform-style: preserve-3d;
}
.flip-image-card .flip-box {
  transform-style: preserve-3d;
  perspective: 1000px;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .flip-image-card .flip-box {
    display: flex;
    justify-content: center;
  }
}
.flip-image-card .image {
  position: relative;
  background-size: cover;
  background-position: center;
  transition: transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
  backface-visibility: hidden;
  text-align: center;
  width: 390px;
  height: 390px;
  border-radius: 50%;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .flip-image-card .image {
    width: 258px;
    height: 258px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .flip-image-card .image {
    width: 455px;
    height: 455px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .flip-image-card .image {
    width: 333px;
    height: 333px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .flip-image-card .image {
    width: 243px;
    height: 243px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .flip-image-card .image {
    width: 300px;
    height: 300px;
  }
}
.flip-image-card .image.flip-front {
  transform: rotateY(0deg);
  transform-style: preserve-3d;
}
.flip-image-card .image.flip-back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  transform: rotateY(180deg);
  transform-style: preserve-3d;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .flip-image-card .image.flip-back {
    width: 300px;
    left: unset;
  }
}
.flip-image-card .image .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.4;
  background-color: #292929;
  border-radius: 50%;
}
.flip-image-card .image .inner {
  position: relative;
  z-index: 5;
  left: 0;
  width: 100%;
  padding: 60px;
  outline: 1px solid transparent;
  perspective: inherit;
  z-index: 2;
  transform: translateY(-50%) translateZ(60px) scale(0.94);
  top: 50%;
}
.flip-image-card .image .inner .number {
  font-family: var(--yt-font);
  font-size: 95px;
  font-weight: 600;
  line-height: 104px;
  letter-spacing: -1.425px;
  color: #ffffff;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .flip-image-card .image .inner .number {
    font-size: 72px;
    line-height: 86px;
    letter-spacing: -0.92px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .flip-image-card .image .inner .number {
    font-size: 72px;
    line-height: 86px;
    letter-spacing: -0.92px;
  }
}
.flip-image-card .box-item-content {
  margin-top: 24px;
  text-align: center;
}
.flip-image-card .box-item-content .name {
  font-family: var(--yt-font);
  font-size: 28px;
  font-weight: 600;
  line-height: 36px;
  letter-spacing: -0.42px;
  color: #292929;
  margin-bottom: 8px;
}
.flip-image-card .box-item-content .sub-title {
  margin: 0;
  font-family: var(--yt-font);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.24px;
  text-transform: uppercase;
  color: #292929;
}
/* 服务流程四步的补充说明 */
.flip-image-card .box-item-content .desc {
  margin: 12px auto 0;
  max-width: 300px;
  font-family: var(--yt-font);
  font-size: 16px;
  line-height: 26px;
  color: #585866;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .feature-area.style-1 {
    padding: 120px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .feature-area.style-1 {
    padding: 100px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .feature-area.style-1 {
    padding: 80px 0;padding-bottom: 10px!important;
  }
}
.feature-area.style-1 .info-card-slider .slick-arrow {
  display: none !important;
}
.feature-area.style-1 .info-card-slider .slick-list {
  margin: 0 -999px 0 -12px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .feature-area.style-1 .info-card-slider .slick-list {
    margin: 0 -12px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .feature-area.style-1 .info-card-slider .slick-list {
    margin: 0 -12px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .feature-area.style-1 .info-card-slider .slick-list {
    margin: 0 -12px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .feature-area.style-1 .info-card-slider .slick-list {
    margin: 0 -12px;
  }
}

.about-us-area.style-1 .info-card.style-2 {
  padding-right: 8px;
}

.project-area.style-1 {
  padding: 80px 0 80px;
  overflow: hidden;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .project-area.style-1 {
    padding: 140px 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .project-area.style-1 {
    padding: 120px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .project-area.style-1 {
    padding: 100px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .project-area.style-1 {
    padding: 80px 0;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .team-area.style-1 {
    padding: 120px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .team-area.style-1 {
    padding: 100px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .team-area.style-1 {
    padding: 80px 0;
  }
}

@media only screen and (min-width: 0px) and (max-width: 767px) {
  .latest-posts-area.style-1 {
    padding: 80px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .latest-posts-area.style-1 {
    padding: 100px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .latest-posts-area.style-1 .section-title {
    margin-bottom: 50px;
  }
}

.about-us-area.style-2 {
  padding-top: 136px;
  padding-bottom: 140px;
}
.about-us-area.style-2 .section-title {
  margin-bottom: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-us-area.style-2 .section-title {
    margin-left: 40px;
  }
}
.about-us-area.style-2 .main-content {
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}
.about-us-area.style-2 .main-content .counter-card-wrapper {
  display: flex;
  gap: 80px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-us-area.style-2 .main-content .counter-card-wrapper {
    gap: 30px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .about-us-area.style-2 .main-content .counter-card-wrapper {
    gap: 12px;
    flex-direction: column;
  }
}
.about-us-area.style-2 .video-popup-btn a i {
  font-size: 24px;
  color: #292929;
  margin-left: 6px;
}

.testimonial-slider-area {
  position: relative;
}
.testimonial-slider-area.style-1 {
  padding-top: 110px;
}
.testimonial-slider-area.style-1 .testimonial-bg-wrapper {
  background-color: #FFF089;
  border-radius: 30px;
  position: relative;
}
.testimonial-slider-area.style-1 .testimonial-bg-wrapper .shape-one {
  position: absolute;
  width: 100%;
  height: 165px;
  top: 0;
  left: 0;
  border-radius: 0 0 30px 0;
  background-color: #ffffff;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .shape-one {
    display: none;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .shape-one {
    display: none;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .shape-one {
    height: 100px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .shape-one {
    height: 130px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .shape-one {
    height: 140px;
  }
}
.testimonial-slider-area.style-1 .testimonial-bg-wrapper .shape-one .sticky-left {
  position: absolute;
  left: 0;
  bottom: -35px;
  transform: rotate(-90deg);
}
.testimonial-slider-area.style-1 .testimonial-bg-wrapper .shape-one .sticky-top-right {
  position: absolute;
  top: 0;
  right: -35px;
  transform: rotate(-90deg);
}
.testimonial-slider-area.style-1 .testimonial-bg-wrapper .shape-two {
  position: absolute;
  width: 230px;
  height: 82px;
  bottom: 0;
  right: 0;
  border-radius: 30px 0 0 0;
  background-color: #ffffff;
  z-index: 1;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .shape-two {
    display: none;
  }
}
.testimonial-slider-area.style-1 .testimonial-bg-wrapper .shape-two .sticky-bottom-right {
  position: absolute;
  left: -35px;
  bottom: 0px;
  transform: rotate(90deg);
}
.testimonial-slider-area.style-1 .testimonial-bg-wrapper .shape-two .sticky-right {
  position: absolute;
  top: -35px;
  right: 0;
  transform: rotate(90deg);
}
.testimonial-slider-area.style-1 .testimonial-bg-wrapper .image {
  margin-right: 60px;
  margin-bottom: -36px;
  position: relative;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .image {
    margin-right: 100px;
    width: 100%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .image {
    margin-right: 30px;
    width: 100%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .image {
    margin-right: 0;
    padding: 40px;
    margin-bottom: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .image {
    margin-right: 0;
    margin-bottom: 0;
  }
}
.testimonial-slider-area.style-1 .testimonial-bg-wrapper .image img {
  border-radius: 35px;
  position: relative;
  left: 72px;
  top: -110px;
  object-fit: cover;
  z-index: 2;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .image img {
    width: 500px;
    height: 730px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .image img {
    width: 440px;
    height: 670px;
    top: -60px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .image img {
    top: -50px;
    left: 40px;
    width: 390px;
    height: 620px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .image img {
    left: 0px;
    top: 0px;
    height: 350px;
    width: 100%;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .testimonial-slider-area.style-1 .testimonial-bg-wrapper .image img {
    left: 0px;
    top: 0;
    border-radius: 30px 30px 0 0;
    height: 350px;
    width: 100%;
  }
}
.testimonial-slider-area.style-1 .content-wrapper {
  gap: 18px;
}
.testimonial-slider-area.style-1 .btn-wrapper {
  justify-content: flex-end;
  width: 100%;
}
.testimonial-slider-area.style-1 .btn-wrapper .comma-btn {
  margin-bottom: 10px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-slider-area.style-1 .btn-wrapper .comma-btn {
    margin-bottom: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .testimonial-slider-area.style-1 .btn-wrapper .comma-btn {
    width: 60px;
  }
}
.testimonial-slider-area.style-1 .slider-area-wrapper {
  padding: 48px 48px 48px 0;
  padding-left: 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .testimonial-slider-area.style-1 .slider-area-wrapper {
    padding-bottom: 140px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .testimonial-slider-area.style-1 .slider-area-wrapper {
    padding-bottom: 110px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-slider-area.style-1 .slider-area-wrapper {
    padding-left: 48px;
    padding-top: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .testimonial-slider-area.style-1 .slider-area-wrapper {
    padding: 40px 24px;
  }
}
.testimonial-slider-area.style-1 .slider-area-wrapper .section-title {
  margin-bottom: 58px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .testimonial-slider-area.style-1 .slider-area-wrapper .section-title {
    margin-bottom: 35px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .testimonial-slider-area.style-1 .slider-area-wrapper .section-title {
    margin-bottom: 30px;
  }
}
.testimonial-slider-area.style-1 .slider-area-wrapper .section-title .short-title-wrapper {
  border-bottom: 1px solid rgba(41, 41, 41, 0.3);
}

.project-area.style-3 {
  padding-top: 60px;
  padding-bottom: 140px;
}
.project-area.style-3 .subscribe-form-area {
  display: flex;
  align-items: end;
  width: 100%;
  height: 100%;
  padding: 40px;
  position: relative;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .project-area.style-3 .subscribe-form-area {
    padding: 30px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .project-area.style-3 .subscribe-form-area {
    padding: 30px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .project-area.style-3 .subscribe-form-area .subscribe-form-widget .mc4wp-form-fields {
    flex-direction: column;
  }
}
@media (max-width: 991px) {
  .project-area.style-3 .subscribe-form-area .subscribe-form-widget .mc4wp-form-fields {
    align-items: start;
  }
}
.project-area.style-3 .subscribe-form-area .subscribe-form-widget .submit-btn {
  flex-shrink: 0;
}
.project-area.style-3 .subscribe-form-area .subscribe-form-widget .submit-btn:hover {
  background-color: #292929;
  color: #ffffff;
  transition: all 0.5s ease-out;
}
.project-area.style-3 .subscribe-form-area .image {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 35px;
}
.project-area.style-3 .subscribe-form-area .image .overlay {
  background-color: #292929;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 35px;
  opacity: 0.4;
}
.project-area.style-3 .subscribe-form-area .content {
  position: relative;
  z-index: 5;
  width: 100%;
}
.project-area.style-3 .subscribe-form-area .short-btn {
  padding: 8px 20px;
  border-radius: 50px;
  font-family: var(--yt-font);
  font-size: 14px;
  font-weight: 600;
  line-height: 19px;
  letter-spacing: -0.21px;
  color: #292929;
  background-color: #ffffff;
  text-transform: uppercase;
  transition: all 0.5s ease-out;
}
.project-area.style-3 .subscribe-form-area .short-btn:hover {
  background-color: #292929;
  color: #ffffff;
  transition: all 0.5s ease-out;
}
.project-area.style-3 .subscribe-form-area .title {
  font-family: var(--yt-font);
  font-size: 48px;
  font-weight: 600;
  line-height: 58px;
  letter-spacing: -0.72px;
  color: #ffffff;
  margin: 16px 0 32px;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .project-area.style-3 .subscribe-form-area .title {
    font-size: 42px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .project-area.style-3 .subscribe-form-area .title br {
    display: none;
  }
}
.project-area.style-3 .subscribe-form-area .single-field {
  width: 100%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .feature-area.style-3 .section-title .title {
    font-size: 45px;
  }
}
.feature-area.style-3 .section-title .desc {
  margin: 24px 0 40px;
}
.feature-area.style-3 .info-card {
  width: 100%;
  padding: 42px 42px 32px;
  margin: 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .feature-area.style-3 .info-card {
    padding: 32px 22px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .feature-area.style-3 .info-card {
    padding: 24px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .feature-area.style-3 .info-card .desc {
    font-size: 16px;
  }
}

.latest-posts-area.style-3 .post_card_slider .slick-arrow {
  display: none !important;
}
.latest-posts-area.style-3 .post_card_slider .slick-list {
  margin: 0 -12px;
}

.production-area {
  padding-top: 80px;
  padding-bottom: 110px;
}
.production-area .section-title {
  margin-bottom: 47px;
}

.bg-black-900 {
  background-color: #292929;
}

@media only screen and (min-width: 0px) and (max-width: 767px) {
  .service-list-card-wrapper {
    padding: 0 12px;
  }
}
.service-list-card-wrapper .single-service-item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .service-list-card-wrapper .single-service-item {
    border-bottom: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-list-card-wrapper .single-service-item {
    border-bottom: none;
  }
}
.service-list-card-wrapper .single-service-item .service-card-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 50px 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-list-card-wrapper .single-service-item .service-card-content {
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .service-list-card-wrapper .single-service-item .service-card-content {
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .service-list-card-wrapper .single-service-item .service-card-content {
    padding: 30px 0;
  }
}
.service-list-card-wrapper .single-service-item .service-card-content:hover .content-wrapper .counter-number {
  color: #03c785;
  transition: all 0.5s ease-out;
}
.service-list-card-wrapper .single-service-item .service-card-content:hover .icon i {
  color: #03c785;
  transform: rotate(-30deg);
  transition: all 0.5s ease-out;
}
.service-list-card-wrapper .single-service-item .service-card-content.odd {
  border-right: 1px solid rgba(255, 255, 255, 0.15);
  margin-right: -12px;
  padding-right: 54px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-list-card-wrapper .single-service-item .service-card-content.odd {
    border-right: none;
    margin-right: 0;
    padding-right: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .service-list-card-wrapper .single-service-item .service-card-content.odd {
    border-right: none;
    margin-right: 0;
    padding-right: 0;
  }
}
.service-list-card-wrapper .single-service-item .service-card-content.even {
  padding-left: 30px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .service-list-card-wrapper .single-service-item .service-card-content.even {
    padding-left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-list-card-wrapper .single-service-item .service-card-content.even {
    padding-left: 0;
  }
}
.service-list-card-wrapper .single-service-item .service-card-content .content-wrapper {
  display: flex;
  gap: 48px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .service-list-card-wrapper .single-service-item .service-card-content .content-wrapper {
    align-items: center;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-list-card-wrapper .single-service-item .service-card-content .content-wrapper {
    gap: 70px;
    align-items: center;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .service-list-card-wrapper .single-service-item .service-card-content .content-wrapper {
    gap: 70px;
    align-items: center;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .service-list-card-wrapper .single-service-item .service-card-content .content-wrapper {
    gap: 40px;
  }
}
.service-list-card-wrapper .single-service-item .service-card-content .content-wrapper .counter-number {
  font-family: var(--yt-font);
  font-size: 68px;
  font-weight: 700;
  line-height: 78px;
  color: #292929;
  -webkit-text-stroke: 1px #03c785;
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .service-list-card-wrapper .single-service-item .service-card-content .content-wrapper .counter-number {
    font-size: 60px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .service-list-card-wrapper .single-service-item .service-card-content .content-wrapper .counter-number {
    font-size: 60px;
  }
}
.service-list-card-wrapper .single-service-item .service-card-content .content-wrapper .title {
  font-family: var(--yt-font);
  font-size: 32px;
  font-weight: 700;
  line-height: 41px;
  text-transform: capitalize;
  color: #ffffff;
  margin-top: 12px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .service-list-card-wrapper .single-service-item .service-card-content .content-wrapper .title {
    font-size: 26px;
    margin-top: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-list-card-wrapper .single-service-item .service-card-content .content-wrapper .title {
    font-size: 26px;
    margin-top: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .service-list-card-wrapper .single-service-item .service-card-content .content-wrapper .title {
    font-size: 26px;
    margin-top: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .service-list-card-wrapper .single-service-item .service-card-content .content-wrapper .title {
    font-size: 20px;
    margin-top: 0;
  }
}
.service-list-card-wrapper .single-service-item .service-card-content .icon i {
  font-family: "Font Awesome 6 Pro";
  font-size: 34px;
  font-weight: 900;
  color: #ffffff;
  justify-items: end;
  transform: rotate(0deg);
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .service-list-card-wrapper .single-service-item .service-card-content .icon i {
    font-size: 26px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-list-card-wrapper .single-service-item .service-card-content .icon i {
    font-size: 26px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .service-list-card-wrapper .single-service-item .service-card-content .icon i {
    font-size: 24px;
  }
}

.our-team-area.style-2 {
  background-color: #282B33;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .our-team-area.style-2 {
    padding: 100px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .our-team-area.style-2 {
    padding: 80px 0;
  }
}
.our-team-area.style-2 .section-title {
  margin-bottom: 38px;
}
.our-team-area.style-2 .team-member-card {
  background-color: #282828;
  border: none;
  position: relative;
  top: 0;
  transition: all 0.5s ease-out;
}
.our-team-area.style-2 .team-member-card:before {
  content: "";
  background-color: #FFF089;
  width: 100%;
  height: 5px;
  position: absolute;
  top: 0;
  left: 0;
  transform: scaleX(0);
  z-index: 1;
  transition: all 0.5s ease-out;
}
.our-team-area.style-2 .team-member-card:hover {
  top: -10px;
  transition: all 0.5s ease-out;
}
.our-team-area.style-2 .team-member-card:hover:before {
  transform: scale(1);
}
.our-team-area.style-2 .team-member-card .content .title {
  color: #ffffff;
}
.our-team-area.style-2 .team-member-card .content .desc {
  color: #ffffff;
}
.our-team-area.style-2 .section-img {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
}
.our-team-area.style-2 .section-img img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
  transition: all 0.5s ease-out;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .our-team-area.style-2 .section-img img {
    position: initial;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .our-team-area.style-2 .section-img img {
    position: initial;
  }
}
.our-team-area.style-2 .section-img img:hover {
  transform: scale(1.05);
  transition: all 0.5s ease-out;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-us-area.style-5 {
    padding: 100px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .about-us-area.style-5 {
    padding: 80px 0;
  }
}
.about-us-area.style-5 .about-image-card.style-5 {
  width: 100%;
  height: 100%;
  margin-right: 0;
}

@media only screen and (min-width: 0px) and (max-width: 767px) {
  .video-popup-area.style-3 .video-popup-image img {
    height: 200px;
  }
}

.portfolio-area.style-2 {
  padding-top: 123px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .portfolio-area.style-2 {
    padding-top: 100px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .portfolio-area.style-2 {
    padding-top: 80px;
    padding: 80px 12px 0 12px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .portfolio-area.style-2 .section-title {
    margin-bottom: 50px;
  }
}
.portfolio-area.style-2 .section-title .desc {
  margin-bottom: 0;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .portfolio-area.style-2 .section-title .desc {
    text-align: justify;
  }
}
.portfolio-area.style-2 .portfolio-wrapper {
  margin-right: 0;
}

.latest-gallery-area.style-2 {
  padding-top: 120px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .latest-gallery-area.style-2 {
    padding-top: 100px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .latest-gallery-area.style-2 {
    padding-top: 80px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .latest-gallery-area.style-2 {
    padding-left: 0px;
    padding-right: 0px;
  }
}
.latest-gallery-area.style-2 .section-title {
  margin-bottom: 40px;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .latest-gallery-area.style-2 .section-title {
    margin-bottom: 20px;
  }
}
.latest-gallery-area.style-2 .project-card.style-2 {
  height: 630px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .latest-gallery-area.style-2 .project-card.style-2 {
    height: 520px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .latest-gallery-area.style-2 .project-card.style-2 {
    height: 420px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .latest-gallery-area.style-2 .project-card.style-2 {
    height: 450px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .latest-gallery-area.style-2 .project-card.style-2 {
    height: 520px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .latest-gallery-area.style-2 .project-card.style-2 {
    height: 420px;
  }
}
.latest-gallery-area.style-2 .project-card.style-2 .main-content {
  height: 100%;
  width: 100%;
  padding: 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .latest-gallery-area.style-2 .project-card.style-2 .main-content {
    padding: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .latest-gallery-area.style-2 .project-card.style-2 .main-content {
    padding: 0;
  }
}
.latest-gallery-area.style-2 .project-card.style-2 .main-content .main-content-wrapper {
  padding: 40px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .latest-gallery-area.style-2 .project-card.style-2 .main-content .main-content-wrapper {
    padding: 25px;
  }
}
.latest-gallery-area.style-2 .project-card.style-2 .main-content .main-content-wrapper .content-inner {
  padding: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .latest-gallery-area.style-2 .project-card.style-2 .main-content .main-content-wrapper .content-inner .title {
    font-size: 20px;
  }
}
.latest-gallery-area.style-2 .project-card.style-2 .main-content .main-content-wrapper .content-inner .desc {
  max-width: 280px;
}

.testimonial-slider-area.style-5 {
  position: relative;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-slider-area.style-5 {
    padding: 100px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .testimonial-slider-area.style-5 {
    padding: 80px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .testimonial-slider-area.style-5 .title {
    margin-bottom: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .testimonial-slider-area.style-5 .slider-nav-btn-wrapper {
    display: none;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .testimonial-slider-area.style-5 .slider-nav-btn-wrapper {
    margin-top: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-slider-area.style-5 .slider-nav-btn-wrapper {
    margin-top: 60px;
  }
}
.testimonial-slider-area.style-5 .slider-nav-btn-wrapper .slider-nav-prev-btn,
.testimonial-slider-area.style-5 .slider-nav-btn-wrapper .slider-nav-next-btn {
  background: none;
  border: 1px solid #03c785;
  color: #ffffff;
  margin-top: -25px;
  transition: all 0.5s ease-out;
}
.testimonial-slider-area.style-5 .slider-nav-btn-wrapper .slider-nav-prev-btn:hover,
.testimonial-slider-area.style-5 .slider-nav-btn-wrapper .slider-nav-next-btn:hover {
  background-color: #03c785;
}
.testimonial-slider-area.style-5 .testimonial-card.style-3 {
  gap: 26px;
}
.testimonial-slider-area.style-5 .testimonial-card.style-3 .name {
  display: flex;
  align-items: center;
  gap: 10px;
}
.testimonial-slider-area.style-5 .testimonial-card.style-3 .name::before {
  content: "";
  width: 60px;
  height: 2px;
  background-color: #03c785;
  display: inline-block;
}

.latest-posts-area.style-5 {
  margin: 0 53px;
  position: relative;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .latest-posts-area.style-5 {
    padding: 100px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .latest-posts-area.style-5 {
    padding: 80px 0;
    margin: 0;
  }
}
.latest-posts-area.style-5 .section-title {
  margin-bottom: 40px;
}
.latest-posts-area.style-5 .post-card.style-5 .image {
  height: 268px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-form-area.style-2 .comment-respond {
    margin-top: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .contact-form-area.style-2 .comment-respond {
    margin-top: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-us-area.style-6 {
    padding: 100px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .about-us-area.style-6 {
    padding: 80px 0;
  }
}

@media only screen and (min-width: 0px) and (max-width: 576px) {
  .about-info-card.style-6 .section-title {
    gap: 0px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-info-card.style-6 .section-title .title {
    font-size: 40px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about-info-card.style-6 .section-title .title br {
    display: none;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-info-card.style-6 .section-title .title br {
    display: none;
  }
}
.about-info-card.style-6 .list-item-wrapper {
  gap: 20px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .about-info-card.style-6 .list-item-wrapper {
    gap: 15px;
  }
}
.about-info-card.style-6 .list-item-wrapper .list-item {
  gap: 10px;
}
.about-info-card.style-6 .list-item-wrapper .list-item .text {
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 700;
  line-height: 27px;
  color: #ffffff;
}

.cta-area.style-6 {
  padding: 206px 0;
  margin: 0 100px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .cta-area.style-6 {
    margin: 0;
    padding: 150px 0;
    transition: all 0.5s ease-out;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .cta-area.style-6 {
    margin: 0;
    padding: 120px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta-area.style-6 {
    margin: 0;
    padding: 100px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cta-area.style-6 {
    margin: 0;
    padding: 80px 0;
  }
}
.cta-area.style-6 .cta-overlay {
  background: none;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .feature-area.style-1 .info-card.style-1 .info-card-inner {
    padding: 0 4px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .feature-area.style-6 {
    padding-bottom: 2px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .feature-area.style-6 {
    padding-top: 100px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .feature-area.style-6 {
    padding-top: 80px;
  }
}
.feature-area.style-6 .info-card.style-2 {
  border: none;
  background-color: #282B33;
  transition: all 0.5s ease-out;
  position: relative;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .feature-area.style-6 .info-card.style-2 {
    padding: 30px 24px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .feature-area.style-6 .info-card.style-2 {
    padding: 30px 24px;
  }
}
.feature-area.style-6 .info-card.style-2:before {
  content: "";
  background-color: #FFF089;
  width: 100%;
  height: 1px;
  position: absolute;
  bottom: 0;
  left: 0;
  transform: scaleX(0);
  transition: all 0.5s ease-out;
}
.feature-area.style-6 .info-card.style-2:hover {
  transition: all 0.5s ease-out;
}
.feature-area.style-6 .info-card.style-2:hover:before {
  transform: scale(1);
}
.feature-area.style-6 .info-card.style-2 .icon-wrapper {
  justify-content: start;
  gap: 20px;
}
.feature-area.style-6 .info-card.style-2 .icon-wrapper .title {
  color: #ffffff;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .feature-area.style-6 .info-card.style-2 .icon-wrapper .title br {
    display: none;
  }
}
.feature-area.style-6 .info-card.style-2 .content {
  gap: 40px;
}
.feature-area.style-6 .info-card.style-2 .content .desc {
  color: #ffffff;
}
.feature-area.style-6 .info-card.style-2 .content .read-more a {
  color: #ffffff;
}
.feature-area.style-6 .info-card.style-2 .content .read-more a i {
  font-family: "Font Awesome 6 Pro";
  font-size: 16px;
  font-weight: 900;
  color: #FFF089;
  margin-left: 12px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .portfolio-section.style-6 {
    padding: 100px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .portfolio-section.style-6 {
    padding: 80px 0;
  }
}
.portfolio-section.style-6 .section-title {
  margin-bottom: 60px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .portfolio-section.style-6 .section-title {
    flex-direction: column;
    align-items: start;
    gap: 40px;
    margin-bottom: 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .portfolio-section.style-6 .section-title .sec-content .title {
    font-size: 42px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .portfolio-section.style-6 .section-title .sec-content .title {
    font-size: 32px;
  }
}
.portfolio-section.style-6 .section-title .sec-desc .desc {
  width: 625px;
  font-size: 16px;
  font-family: var(--yt-font);
  font-weight: 400;
  line-height: 30px;
  color: #ffffff;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .portfolio-section.style-6 .section-title .sec-desc .desc {
    width: 545px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .portfolio-section.style-6 .section-title .sec-desc .desc {
    width: 450px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .portfolio-section.style-6 .section-title .sec-desc .desc {
    width: 335px;
    font-size: 14px;
    line-height: 25px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .portfolio-section.style-6 .section-title .sec-desc .desc {
    width: 100%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .portfolio-section.style-6 .project-card.style-2 .main-content {
    padding: 0;
  }
}

.testimonial-slider-area.style-6 {
  background-color: #282B33;
  padding-bottom: 190px;
  position: relative;
  z-index: 5;
  overflow: hidden;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-slider-area.style-6 {
    padding: 100px 0 170px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .testimonial-slider-area.style-6 {
    padding: 80px 0 150px;
  }
}

.counter-up-area.style-6 {
  margin-top: -90px;
  padding-bottom: 0;
}
.counter-up-area.style-6 .counter-card {
  position: relative;
  z-index: 10;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .latest-posts-area.style-6 {
    padding: 100px 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .latest-posts-area.style-6 {
    padding: 80px 0;
  }
}

.video-popup-area.style-1 {
  margin-top: -300px;
  position: relative;
  z-index: 2;
  padding-bottom: 140px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .video-popup-area.style-1 {
    margin-top: 0;
    padding-top: 60px;
  }
}

.book-appointment-area .comment-respond {
  margin-top: 0;
}
.book-appointment-area .comment-respond .theme-btn {
  margin-top: 10px;
}
.book-appointment-area .comment-respond .contacts-message {
  margin-bottom: 25px;
}
.book-appointment-area h5 {
  margin-bottom: 10px;
}
.book-appointment-area .single-checkbox {
  margin-bottom: 30px;
}
.book-appointment-area .form-check {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 5px;
}
.book-appointment-area .form-check input {
  background-image: none !important;
  border-radius: 50px !important;
}
.book-appointment-area .form-check input:before {
  border-radius: 50px;
}

@media (max-width: 991px) {
  .apartment-details {
    margin-top: 60px;
  }
}
.apartment-details h3 {
  margin-bottom: 17px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .apartment-details h3 {
    font-size: 27px;
  }
}
.apartment-details h4 {
  margin-bottom: 10px;
  margin-top: 10px;
}
.apartment-details p {
  margin-bottom: 20px;
}
.apartment-details .image-wrapper {
  margin-bottom: 30px;
}
.apartment-details .list-item {
  display: flex;
  align-items: center;
  gap: 10px;
}
.apartment-details .list-item i {
  color: #03c785;
  font-size: 16px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .apartment-details .list-item i {
    margin-top: 16px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .apartment-details .list-item {
    align-items: start;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .apartment-details .list-item h4 {
    font-size: 21px;
  }
}
.apartment-details p:last-child {
  margin-bottom: 0;
}

.faq-area .image {
  position: relative;
  height: 100%;
  margin-right: 52px;
}
@media (min-width: 1200px) {
  .faq-area .image {
    min-height: 492px;
  }
}
@media (max-width: 1399px) {
  .faq-area .image {
    margin-right: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .faq-area .image {
    height: 400px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .faq-area .image {
    height: 300px;
  }
}
.faq-area .image img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
  border-radius: 35px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .faq-area .image {
    height: 100%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .faq-area .image {
    height: 100%;
  }
}
.faq-area .search-form {
  border: 1px solid #D9EAFD;
  margin-top: 30px;
}
.faq-area .search-form input {
  height: 50px;
}
.faq-area .search-form button {
  background-color: transparent;
}
.faq-area .search-form button i {
  color: #D9EAFD;
}
.faq-area .accordion-box-wrapper {
  display: flex;
  flex-direction: column;
  gap: 24px;
  height: auto !important;
}

.video-popup-area.style-1 {
  margin-top: -300px;
  position: relative;
  z-index: 2;
  padding-bottom: 140px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .video-popup-area.style-1 {
    margin-top: 0;
    padding-top: 60px;
  }
}

.contact-form-area {
  position: relative;
}
.contact-form-area .shape-overlay-wrapper {
  position: relative;
}
.contact-form-area .shape-overlay-wrapper .shape-overlay {
  background-color: #ECF4FE;
  width: 100%;
  height: 758px;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 35px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .contact-form-area .shape-overlay-wrapper .shape-overlay {
    height: 715px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area .shape-overlay-wrapper .shape-overlay {
    height: 690px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-form-area .shape-overlay-wrapper .shape-overlay {
    height: 1412px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .contact-form-area .shape-overlay-wrapper .shape-overlay {
    height: 1235px;
    border-radius: 25px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .contact-form-area .shape-overlay-wrapper .shape-overlay {
    height: 1050px;
  }
}
.contact-form-area .shape-overlay-wrapper .shape-overlay .shape-one {
  background-color: #ffffff;
  border-radius: 0 30px 0 0;
  width: 753px;
  height: 213px;
  position: absolute;
  bottom: 0;
  left: 0;
}
@media only screen and (min-width: 1401px) and (max-width: 1700px) {
  .contact-form-area .shape-overlay-wrapper .shape-overlay .shape-one {
    width: 46%;
    height: 150px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .contact-form-area .shape-overlay-wrapper .shape-overlay .shape-one {
    width: 520px;
    height: 105px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area .shape-overlay-wrapper .shape-overlay .shape-one {
    width: 470px;
    height: 85px;
    border-radius: 0 20px 0 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-form-area .shape-overlay-wrapper .shape-overlay .shape-one {
    display: none;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .contact-form-area .shape-overlay-wrapper .shape-overlay .shape-one {
    display: none;
  }
}
.contact-form-area .shape-overlay-wrapper .shape-overlay .shape-one .sticky-left {
  transform: rotate(180deg);
  width: 35px;
  height: 35px;
  position: absolute;
  left: 0;
  top: -35px;
}
.contact-form-area .shape-overlay-wrapper .shape-overlay .shape-one .sticky-right {
  transform: rotate(180deg);
  width: 35px;
  height: 35px;
  position: absolute;
  right: -34px;
  bottom: 0;
}
.contact-form-area .shape-overlay-wrapper .shape-overlay .sticky-left {
  transform: rotate(180deg);
  position: absolute;
  left: 0;
  top: -35px;
}
.contact-form-area .shape-overlay-wrapper .shape-overlay .sticky-right {
  transform: rotate(180deg);
  position: absolute;
  right: -35px;
  bottom: 0;
}
.contact-form-area .image {
  width: 75%;
  height: 776px;
  position: relative;
  z-index: 5;
  margin: 72px 0 0 72px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .contact-form-area .image {
    width: 83%;
    height: 670px;
    margin: 40px 0 0 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area .image {
    width: 90%;
    height: 660px;
    margin: 30px 0 0 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-form-area .image {
    width: 80%;
    height: 650px;
    margin: 60px auto;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .contact-form-area .image {
    width: 80%;
    height: 550px;
    margin: 60px auto;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .contact-form-area .image {
    width: 90%;
    height: 400px;
    margin: 40px auto;
  }
}
.contact-form-area .image img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
  border-radius: 35px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .contact-form-area .image img {
    border-radius: 25px;
  }
}
.contact-form-area .shape-1 {
  position: absolute;
  bottom: 0;
  left: 0;
}
.contact-form-area .shape-2 {
  position: absolute;
  bottom: 0;
  right: 0;
}
.contact-form-area .contact-info-area {
  box-shadow: 0px 0px 60px 0px rgba(0, 0, 0, 0.05);
  padding: 46px 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .contact-form-area .contact-info-area {
    padding: 40px 20px;
    flex-direction: column;
    align-items: start;
    gap: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-form-area .contact-info-area {
    padding: 40px 30px;
    flex-direction: column;
    align-items: start;
    gap: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area .contact-info-area {
    padding: 40px 20px;
  }
}
.contact-form-area .contact-info-area .divider {
  width: 1px;
  height: 28px;
  background-color: #D9EAFD;
}
@media (max-width: 991px) {
  .contact-form-area .contact-info-area .divider {
    width: 100%;
    height: 1px;
  }
}
.contact-form-area .contact-info-area .contact-card {
  display: flex;
  gap: 20px;
}
.contact-form-area .contact-info-area .contact-card .icon {
  margin-top: 8px;
}
.contact-form-area .contact-info-area .contact-card .icon i {
  font-size: 24px;
  color: #03c785;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .contact-form-area .contact-info-area .contact-card .icon i {
    font-size: 18px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area .contact-info-area .contact-card .icon i {
    font-size: 18px;
  }
}
.contact-form-area .contact-info-area .contact-card .desc {
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  color: #525256;
  font-family: var(--yt-font);
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .contact-form-area .contact-info-area .contact-card .info-title {
    font-size: 24px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area .contact-info-area .contact-card .info-title {
    font-size: 24px;
  }
}
.contact-form-area .comment-respond {
  position: relative;
  margin: 140px 72px 0 0;
  background-color: transparent;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .contact-form-area .comment-respond {
    margin: 80px 40px 0 0;
    padding-right: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area .comment-respond {
    margin: 75px 30px 0 20px;
    padding: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-form-area .comment-respond {
    width: 80%;
    margin: 0 auto 60px;
    padding: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .contact-form-area .comment-respond {
    width: 80%;
    margin: 0 auto 60px;
    padding: 0;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .contact-form-area .comment-respond {
    width: 90%;
    margin: 0 auto 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area .comment-respond .post-comments-title h2 {
    font-size: 40px;
  }
}
.contact-form-area .comment-respond .contacts-email,
.contact-form-area .comment-respond .contacts-name,
.contact-form-area .comment-respond .single-input-field,
.contact-form-area .comment-respond .contacts-message {
  margin-bottom: 16px;
  position: relative;
  border-radius: 12px;
}
.contact-form-area .comment-respond .contacts-email label,
.contact-form-area .comment-respond .contacts-name label,
.contact-form-area .comment-respond .single-input-field label,
.contact-form-area .comment-respond .contacts-message label {
  font-size: 18px;
  color: #292929;
  margin-bottom: 8px;
}
.contact-form-area .comment-respond .checkbox-field-wrapper {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
  padding: 15px 0;
}
.contact-form-area .comment-respond .checkbox-field-wrapper p {
  margin: 0;
}
.contact-form-area .comment-respond .checkbox-field-wrapper .single-checkbox-field {
  margin-bottom: 0;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 16px;
  font-weight: 400;
  font-family: var(--yt-font);
}
.contact-form-area .comment-respond .comment-form-cookies-consent {
  display: none;
}
.contact-form-area .comment-respond input[type=number] {
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}
.contact-form-area .comment-respond input,
.contact-form-area .comment-respond select {
  border-radius: 12px;
  padding: 0 20px;
  height: 60px;
  width: 100%;
  color: #525256;
  opacity: 1;
  border: none;
  font-size: 18px;
  font-weight: 400;
  line-height: 32px;
  background-color: #ffffff;
  font-family: var(--yt-font) !important;
}
.contact-form-area .comment-respond input[type=submit] {
  height: 70px;
  background-color: #03c785;
  border-color: #03c785;
  color: #ffffff;
  font-size: 18px;
  font-weight: 500;
}
.contact-form-area .comment-respond *::-webkit-input-placeholder {
  color: #525256;
}
.contact-form-area .comment-respond *:-moz-placeholder {
  color: #525256;
  opacity: 1;
}
.contact-form-area .comment-respond *::-moz-placeholder {
  color: #525256;
  opacity: 1;
}
.contact-form-area .comment-respond *:-ms-input-placeholder {
  color: #525256;
}
.contact-form-area .comment-respond *::-ms-input-placeholder {
  color: #525256;
}
.contact-form-area .comment-respond *::placeholder {
  color: #525256;
}
.contact-form-area .comment-respond .contacts-message {
  height: 152px;
  margin-bottom: 32px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area .comment-respond .contacts-message {
    height: 125px;
    margin-bottom: 24px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .contact-form-area .comment-respond .contacts-message {
    margin-bottom: 16px;
  }
}
.contact-form-area .comment-respond textarea {
  border-radius: 12px;
  resize: vertical;
  padding: 20px;
  width: 100%;
  color: #525256;
  border: none;
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  background-color: #ffffff;
  font-family: var(--yt-font) !important;
  height: 100%;
  margin-bottom: 0;
}
.contact-form-area .comment-respond input:focus,
.contact-form-area .comment-respond textarea:focus,
.contact-form-area .comment-respond .form-select:focus {
  outline: none !important;
  box-shadow: none;
  border-color: #03c785 !important;
  transition: all 0.4s ease 0s;
}
.contact-form-area .comment-respond .theme-btn {
  padding: 20px 44px;
  font-family: var(--yt-font);
  font-size: 20px;
  line-height: 34px;
  font-weight: 600;
  background-color: #03c785;
  color: #fff;
  border-radius: 50px;
  margin-top: 24px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area .comment-respond .theme-btn {
    padding: 14px 30px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .contact-form-area .comment-respond .theme-btn {
    padding: 14px 30px;
  }
}
.contact-form-area .comment-respond .theme-btn:hover {
  background-color: #025d46;
  color: #ffffff;
  transition: all 0.5s ease-out;
}
.contact-form-area .image-wrapper {
  text-align: right;
  height: 100%;
}
.contact-form-area .image-wrapper img {
  height: 100%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area .image-wrapper img {
    object-fit: cover;
    height: 100%;
  }
}
.contact-form-area .map-widget {
  padding-left: 20px;
  height: 100%;
}
@media (max-width: 991px) {
  .contact-form-area .map-widget {
    padding-left: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area .map-widget {
    padding-left: 0;
  }
}
.contact-form-area .map-widget iframe {
  height: 100%;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .contact-form-area.style-2 .shape-overlay {
    height: 1150px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-form-area.style-2 .shape-overlay {
    height: 1492px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area.style-2 .shape-overlay {
    height: 750px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .contact-form-area.style-2 .shape-overlay {
    height: 650px;
  }
}

.contact-info-area .icon-card.style-1 {
  text-align: center;
  height: 100%;
}
/* 绿卡底色深，模板默认的 #585866 文字对比度不足，改为白色 */
.contact-info-area .icon-card.style-1.primary .content .desc a,
.contact-info-area .icon-card.style-1.primary .content .desc p {
  color: #ffffff;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-info-area .icon-card.style-1 {
    padding: 32px;
  }
}
@media (max-width: 991px) {
  .contact-info-area .icon-card.style-1 {
    padding: 32px 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-info-area .icon-card.style-1 h3 {
    font-size: 28px;
    line-height: normal;
  }
}
@media (max-width: 1199px) {
  .contact-info-area .icon-card.style-1 .desc br {
    display: none;
  }
}

.process-step-area.style-1 {
  padding-top: 120px;
  padding-bottom: 115px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .process-step-area.style-1 {
    padding-top: 80px;
    padding-bottom: 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-step-area.style-1 {
    padding-top: 100px;
    padding-bottom: 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .process-step-area.style-1 {
    padding-top: 120px;
    padding-bottom: 35px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .process-step-area.style-1 .process-step.style-1 {
    margin-bottom: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .process-step-area.style-1 .process-step.style-1 {
    margin-bottom: 80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .process-step-area.style-1 .process-step.style-1 {
    margin-bottom: 80px;
    padding: 0 20px;
  }
}

/* 优势页（栅格版，非轮播）：卡片宽度交给栅格、等高、CTA 贴底 */
.feature-area.style-2 .info-card.style-1 {
  margin: 0;
  width: auto;
  height: 100%;
}
.feature-area.style-2 .info-card.style-1 .info-card-inner {
  height: 100%;
}
.feature-area.style-2 .info-card.style-1 .content-wrapper {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.feature-area.style-2 .info-card.style-1 .content {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.feature-area.style-2 .info-card.style-1 .view-more {
  margin-top: auto;
}
/* 栅格版卡片比轮播版窄，5 行截断会切掉正文，这里放开限制显示完整描述 */
.feature-area.style-2 .info-card.style-1 .content-wrapper .desc {
  display: block;
  overflow: visible;
  text-overflow: clip;
  -webkit-line-clamp: unset;
}
.service-details-page {
  padding-top: 80px;
  padding-bottom: 60px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .service-details-page {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service-details-page {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .service-details-page {
    padding-bottom: 120px;
  }
}
.service-details-page .service-details-wrapper {
  padding-right: 38px;
}
@media (max-width: 1399px) {
  .service-details-page .service-details-wrapper {
    padding-right: 12px;
  }
}
.service-details-page .details-content .feature-image {
  overflow: hidden;
  margin-bottom: 30px;
  position: relative;
}
.service-details-page .details-content .feature-image .icon {
  width: 60px;
  height: 60px;
  flex-shrink: 0;
  padding: 8px;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  left: 30px;
  top: 30px;
}
.service-details-page .details-content .feature-image .icon img {
  width: auto;
}
.service-details-page .details-content .feature-image img {
  width: 100%;
  border-radius: 30px;
}
.service-details-page .details-content .image {
  overflow: hidden;
  border-radius: 30px;
}
.service-details-page .details-content .image img {
  width: 100%;
  border-radius: 30px;
  transform: scale(1);
  transition: all 0.5s ease-out;
}
.service-details-page .details-content .image:hover img {
  transform: scale(1.03);
  transition: all 0.5s ease-out;
}
.service-details-page .details-content .text {
  margin-bottom: 30px;
}
.service-details-page .details-content .text .title {
  color: #292929;
  margin-bottom: 20px;
}
.service-details-page .details-content .text p {
  font-size: 18px;
  font-weight: 400;
  line-height: 32px;
  margin-bottom: 30px;
}
.service-details-page .details-content .list-item-wrapper {
  margin-top: 0;
}
.service-details-page .details-content .member-court {
  margin-top: 10px;
  margin-bottom: 20px;
  display: inline-block;
}
.service-details-page .details-content .member-court .desc {
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 700;
  line-height: 27px;
  color: #292929;
  margin-bottom: 0;
}
.service-details-page .details-content p {
  font-size: 18px;
  font-weight: 400;
  line-height: 32px;
  margin-bottom: 0;
}
.service-details-page .details-content .info-card.style-2 .content .desc {
  padding-right: 60px;
}
@media (max-width: 991px) {
  .service-details-page .details-content .info-card.style-2 .content .desc {
    padding-right: 0;
  }
}

.key-featured-area {
  padding-top: 44px;
  padding-bottom: 40px;
}
.key-featured-area .gx-8 {
  --bs-gutter-x: 8rem;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .key-featured-area .gx-8 {
    --bs-gutter-x: 1rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .key-featured-area .gx-8 {
    --bs-gutter-x: 1rem;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .key-featured-area .gx-8 {
    --bs-gutter-x: 1rem;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .key-featured-area .gx-8 {
    --bs-gutter-x: 2rem;
  }
}
.key-featured-area .key-featured-title {
  font-size: 36px;
  color: #292929;
  line-height: initial;
  margin-bottom: 40px;
  display: block;
}
.key-featured-area .single-key-featured {
  margin-bottom: 40px;
}
.key-featured-area .single-key-featured .title-wrapper {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 20px;
}
.key-featured-area .single-key-featured .title-wrapper .title {
  font-size: 21px;
  color: #292929;
  line-height: initial;
  margin-bottom: 0;
}

.details-overview-area {
  display: flex;
  flex-direction: column;
  gap: 60px;
}
.details-overview-area .overview-item {
  display: flex;
  align-items: center;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .details-overview-area .overview-item {
    flex-direction: column;
    gap: 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .details-overview-area .overview-item {
    gap: 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .details-overview-area .overview-item {
    gap: 40px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .details-overview-area .overview-item {
    gap: 40px;
  }
}
.details-overview-area .overview-item:nth-child(even) {
  flex-direction: row-reverse;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .details-overview-area .overview-item:nth-child(even) {
    flex-direction: column;
  }
}
.details-overview-area .overview-item:hover .image img {
  transform: scale(1.03);
  transition: all 0.5s ease-out;
}
.details-overview-area .overview-item .image,
.details-overview-area .overview-item .content {
  width: 50%;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .details-overview-area .overview-item .image,
  .details-overview-area .overview-item .content {
    width: 100%;
  }
}
.details-overview-area .overview-item .image {
  border-radius: 12px;
  overflow: hidden;
}
.details-overview-area .overview-item .image img {
  width: 100%;
  transform: scale(1);
  transition: all 0.5s ease-out;
}
.details-overview-area .overview-item .content .title {
  font-size: 36px;
  line-height: initial;
  margin-bottom: 25px;
}
.details-overview-area .overview-item .content .list-item {
  margin-bottom: 0 !important;
}
.details-overview-area .overview-item .content .list-item ul {
  margin-bottom: 0 !important;
}

.faq-area.style-3 {
  padding-top: 60px;
  padding-bottom: 105px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .faq-area.style-3 {
    padding-bottom: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .faq-area.style-3 {
    padding-bottom: 85px;
  }
}
.faq-area.style-3 .faq-title {
  font-size: 36px;
  margin-bottom: 30px;
}

.team-details-area {
  padding-top: 130px;
  padding-bottom: 120px;
  padding-left: 210px;
  padding-right: 210px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .team-details-area {
    padding: 140px 100px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .team-details-area {
    padding: 120px 80px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .team-details-area {
    padding: 80px 40px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .team-details-area {
    padding: 80px 40px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .team-details-area {
    padding: 80px 20px;
  }
}
.team-details-area .image-wrapper {
  position: relative;
  padding-right: 60px;
}
.team-details-area .image-wrapper img {
  width: 100%;
  border-radius: 30px;
}
.team-details-area .team-details-wrapper p {
  margin-top: 24px;
  margin-bottom: 40px;
}
.team-details-area .team-details-wrapper .main-title {
  margin-bottom: 10px;
  font-weight: 700;
  line-height: 60px;
  text-transform: capitalize;
}
.team-details-area .team-details-wrapper .sub-title {
  font-family: var(--yt-font);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 30px;
  margin-bottom: 20px;
}
.team-details-area .team-details-wrapper .content {
  color: #525256;
  margin-bottom: 30px;
}
.team-details-area .team-details-wrapper .sort-title {
  margin-bottom: 20px;
}
.team-details-area .team-details-wrapper .skill-wrapper {
  margin-bottom: 40px;
}
.team-details-area .team-details-wrapper .skill-progress-card {
  display: block;
}
.team-details-area .team-details-wrapper .skill-progress-card .skill-progressbar {
  margin-bottom: 20px;
}
.team-details-area .social-share {
  display: flex;
  gap: 25px;
  margin-top: 28px;
}
.team-details-area .social-share a {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background-color: #D9EAFD;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #292929;
}

.our-team-area.style-3 .section-title {
  margin-bottom: 60px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .our-team-area.style-3 .section-title {
    margin-bottom: 40px;
  }
}
@media (max-width: 1199px) {
  .our-team-area.style-3 .section-title {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .our-team-area.style-3 .section-title .title br {
    display: none;
  }
}
.our-team-area.style-3 .section-img {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
}
.our-team-area.style-3 .section-img img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
  transition: all 0.5s ease-out;
}
.our-team-area.style-3 .section-img img:hover {
  transform: scale(1.05);
  transition: all 0.5s ease-out;
}

.footer {
  position: relative;
  z-index: 2;
  overflow: hidden;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.footer .footer-wrapper {
  border-radius: 30px;
  margin: 0 20px 20px 20px;
}
.footer .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(35, 38, 45, 0.9) 0%, #23262d 100%);
}
.footer .divider {
  color: inherit;
  border: 0;
  border-top: 1px solid;
  opacity: 0.25;
  margin-top: 30px;
}
.footer .footer-sec {
  padding-top: 80px;
}
.footer .footer-sec hr {
  margin: 10px 0 0 0;
  border-color: rgba(192, 192, 192, 1);
}
.footer .footer-top-area {
  margin-bottom: 48px;
}
.footer .footer-top-area hr {
  margin-top: 48px;
}
.footer .footer-top-area .subscribe-footer-widget .subscribe-widget {
  display: flex;
  justify-content: space-between;
  gap: 40px;
}
@media (max-width: 991px) {
  .footer .footer-top-area .subscribe-footer-widget .subscribe-widget {
    gap: 30px;
    flex-direction: column;
  }
}
.footer .footer-top-area .subscribe-footer-widget .subscribe-widget .subscribe-form-title .title {
  color: #ffffff;
  font-size: 52px;
  font-weight: 600;
  line-height: 62px;
  letter-spacing: -0.78px;
}
@media (max-width: 991px) {
  .footer .footer-top-area .subscribe-footer-widget .subscribe-widget .subscribe-form-title .title {
    font-size: 30px;
    line-height: 48px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer .footer-top-area .subscribe-footer-widget .subscribe-widget .subscribe-form-title .title {
    font-size: 30px;
    line-height: 48px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .footer .footer-top-area .subscribe-footer-widget .subscribe-widget .subscribe-form-title .title {
    font-size: 44px;
    line-height: 62px;
  }
}
.footer .footer-top-area .subscribe-footer-widget .subscribe-widget .subscribe-form-widget {
  width: 530px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .footer .footer-top-area .subscribe-footer-widget .subscribe-widget .subscribe-form-widget {
    width: 100%;
  }
}
.footer .footer-top-area .subscribe-footer-widget .subscribe-widget .subscribe-form-widget .description {
  color: #ffffff;
  margin-bottom: 30px;
}
.footer .footer-bg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.footer .footer-bg img {
  width: 100%;
  height: 100%;
}

.footer-widget-title {
  font-family: var(--yt-font);
  font-size: 24px;
  line-height: 30px;
  color: #ffffff;
  position: relative;
  margin-bottom: 30px;
  font-weight: 700;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .footer-widget-title {
    margin-bottom: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-widget-title {
    margin-bottom: 25px;
  }
}

.footer-widget {
  margin-bottom: 30px;
  position: relative;
}
@media (max-width: 991px) {
  .footer-widget {
    margin-bottom: 40px;
  }
}
.footer-widget ul {
  padding-left: 0;
}
.footer-widget .footer-logo {
  margin-bottom: 40px;
  margin-top: -25px;
}
.footer-widget.widget_boomdevs-latest-posts-footer {
  margin-top: -5px;
}
@media (max-width: 767px) {
  .footer-widget.zoom-instagram-widget {
    margin-bottom: 0;
    margin-top: -10px;
  }
}
@media (max-width: 767px) {
  .footer-widget.widget_boomdevs_contact_info_widget {
    margin-bottom: 18px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1399px) {
  .footer-widget .widget-instagram-feed {
    width: 170px;
  }
}
.footer-widget .footer-widget-info {
  position: relative;
}
.footer-widget .footer-widget-info p {
  color: #ffffff;
  margin-bottom: 40px;
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
}
@media (min-width: 1400px) {
  .footer-widget .footer-widget-info p {
    padding-right: 40px;
  }
}
.footer-widget .footer-widget-info .footer-logo {
  margin-bottom: 40px;
  display: inline-block;
  margin-top: -25px;
  width: 180px;
  height: 40px;
}
.footer-widget .footer-widget-info .footer-logo a img {
  object-fit: cover;
}
.footer-widget .footer-widget-info .info-form-and-social-icon {
  display: flex;
  align-items: center;
  gap: 50px;
}
.footer-widget .footer-widget-info .info-form-and-social-icon .subscribe-form-widget {
  border-radius: 6px;
}
.footer-widget .footer-widget-info .info-form-and-social-icon .subscribe-form-widget .single-field input {
  height: 60px;
}
.footer-widget .footer-widget-info .info-form-and-social-icon .social-profile {
  margin-top: 0;
}
.footer-widget .footer-widget-info .social-profile {
  gap: 20px;
  margin-top: 30px;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .footer-widget .footer-widget-info .info-form-and-social-icon {
    flex-direction: column;
    align-items: start;
    gap: 30px;
  }
}
.footer-widget.widget_nav_menu ul {
  margin-top: -5px;
  padding-left: 0;
  margin-bottom: 0;
}
.footer-widget.widget_nav_menu li {
  position: relative;
  display: inline-block;
  width: 100%;
  padding-bottom: 0px;
}
.footer-widget.widget_nav_menu li:last-child {
  padding-top: 0;
  padding-bottom: 0;
}
.footer-widget.widget_nav_menu li a {
  color: #ffffff;
  text-transform: capitalize;
  font-size: 18px;
  transition: all 0.5s ease-out;
  position: relative;
  font-family: var(--yt-font);
  display: flex;
  align-items: center;
  gap: 8px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-widget.widget_nav_menu li a {
    align-items: start;
  }
}
.footer-widget.widget_nav_menu li a:before {
  content: "\f105";
  font-family: "Font Awesome 6 Pro";
  font-size: 18px;
  color: #ffffff;
  display: none;
}
.footer-widget.widget_nav_menu li a:hover {
  transition: all 0.5s ease-out;
  color: #03c785;
}
.footer-widget .footer-widget-info .extra-info {
  display: none;
}
.footer-widget .footer-widget-contact p {
  color: #ffffff;
  margin-bottom: 20px;
}
.footer-widget .footer-widget-contact .footer-contact {
  margin-top: 20px;
}
.footer-widget .footer-widget-contact .footer-contact ul {
  list-style: none;
  margin-bottom: 0;
}
.footer-widget .footer-widget-contact .footer-contact ul li {
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  line-height: 30px;
  gap: 10px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-widget .footer-widget-contact .footer-contact ul li {
    align-items: start;
  }
}
.footer-widget .footer-widget-contact .footer-contact ul li:last-child {
  margin-bottom: 0;
}
.footer-widget .footer-widget-contact .footer-contact ul li .contact-icon {
  border-radius: 50px;
  float: left;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  display: none;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-widget .footer-widget-contact .footer-contact ul li .contact-icon {
    margin-top: 7px;
  }
}
.footer-widget .footer-widget-contact .footer-contact ul li .contact-icon i {
  font-family: "Font Awesome 6 Pro";
  font-size: 18px;
  font-weight: 900;
  color: #03c785;
}
.footer-widget .footer-widget-contact .footer-contact ul li .contact-text {
  color: #ffffff;
  font-size: 18px;
  line-height: 30px;
  font-weight: 400;
  overflow: hidden;
  font-family: var(--yt-font);
}
.footer-widget .footer-widget-contact .footer-contact ul li .contact-text a {
  color: #ffffff;
}
.footer-widget .footer-widget-contact .footer-contact ul li .contact-text a:hover span {
  color: #03c785;
  transition: all 0.5s ease-out;
}
.footer-widget .footer-widget-contact .footer-contact ul li .contact-text span,
.footer-widget .footer-widget-contact .footer-contact ul li .contact-text p,
.footer-widget .footer-widget-contact .footer-contact ul li .contact-text a {
  font-size: 18px;
  line-height: 30px;
  font-weight: 400;
  display: inline-block;
  width: 100%;
  margin-bottom: 0;
  font-family: var(--yt-font);
  transition: all 0.5s ease-out;
}
.footer-widget .footer-widget-contact .extra-info .extra-title {
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 700;
  line-height: 27px;
  color: rgba(255, 255, 255, 0.7176470588);
  margin-bottom: 10px;
}
.footer-widget .widget_latest_post ul li {
  margin-bottom: 40px;
}
.footer-widget .widget_latest_post ul li .latest-post-thumb {
  width: 80px;
  height: 80px;
  border-radius: 50%;
}
.footer-widget .widget_latest_post ul li .latest-post-desc .latest-post-title {
  margin-bottom: 0;
  font-size: 18px;
  line-height: 30px;
  color: #ffffff;
  font-weight: 400;
  font-family: var(--yt-font);
}
.footer-widget .widget_latest_post ul li .latest-post-desc .latest-post-title a {
  font-size: 18px;
  line-height: 30px;
  color: #ffffff;
  position: relative;
  text-transform: capitalize;
  font-weight: 400;
  font-family: var(--yt-font);
  transition: all 0.5s ease-out;
}
.footer-widget .widget_latest_post ul li .latest-post-desc .latest-post-title a:hover {
  color: #03c785;
  transition: all 0.5s ease-out;
}
.footer-widget .widget_latest_post ul li .latest-post-desc .latest-post-meta {
  font-size: 18px;
  display: flex;
  align-items: center;
  font-weight: 400;
  gap: 10px;
  color: #ffffff;
  font-family: var(--yt-font);
}

.footer-bottom-menu ul {
  list-style: none;
  display: flex;
  gap: 0 40px;
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 0;
  padding-left: 0;
  flex-wrap: wrap;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .footer-bottom-menu ul {
    gap: 10px;
  }
}
@media (max-width: 991px) {
  .footer-bottom-menu ul {
    justify-content: flex-start;
  }
}
.footer-bottom-menu ul li a {
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  text-transform: capitalize;
  color: rgba(255, 255, 255, 0.6);
  font-family: var(--yt-font);
  transition: all 0.5s ease-out;
}
.footer-bottom-menu ul li a:hover {
  transition: all 0.5s ease-out;
  color: #03c785;
}

.footer-bottom-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px 40px;
  flex-wrap: wrap-reverse;
}
.footer-bottom-wrapper .footer-widget {
  margin-bottom: 0;
}

.footer-bottom-menu-wrapper {
  display: flex;
  align-items: center;
  gap: 10px 40px;
  flex-wrap: wrap-reverse;
  flex-grow: 1;
  justify-content: space-between;
}

.footer-bottom-area {
  position: relative;
}
.footer-bottom-area .footer-bottom-wrapper {
  padding: 25px 0;
}
.footer-bottom-area .copyright-text p {
  color: rgba(255, 255, 255, 0.6);
  margin-bottom: 0;
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
}
.footer-bottom-area .copyright-text p a {
  color: #ffffff;
  font-weight: 400;
  font-family: var(--yt-font);
  font-size: 18px;
  line-height: 30px;
}
.footer-bottom-area .copyright-text p a:hover {
  color: #03c785;
}
.footer-bottom-area .credit-text p {
  color: rgba(255, 255, 255, 0.7019607843);
  margin-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  font-family: var(--yt-font);
}
.footer-bottom-area .credit-text a {
  color: #03c785;
  font-family: var(--yt-font);
}
.footer-bottom-area .social-profile {
  gap: 25px;
}
.footer-bottom-area .social-profile a {
  border-radius: 50px;
}

.subscribe-form-wrapper p {
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  color: #ffffff;
  font-family: var(--yt-font);
  margin-bottom: 20px;
}

.subscribe-form-widget {
  position: relative;
}
.subscribe-form-widget .mc4wp-form-fields {
  display: flex;
  align-items: center;
  gap: 18px;
}
@media only screen and (min-width: 0px) and (max-width: 576px) {
  .subscribe-form-widget .mc4wp-form-fields {
    flex-wrap: wrap;
  }
}
.subscribe-form-widget .single-field {
  width: 100%;
}
.subscribe-form-widget .single-field input {
  padding: 12px 24px;
  width: 100%;
  border: none;
  border-radius: 50px;
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 400;
  line-height: 32px;
  color: #525256;
  background: #ffffff;
}
.subscribe-form-widget .single-field *::-webkit-input-placeholder {
  color: #525256;
}
.subscribe-form-widget .single-field *:-moz-placeholder {
  color: #525256;
  opacity: 1;
}
.subscribe-form-widget .single-field *::-moz-placeholder {
  color: #525256;
  opacity: 1;
}
.subscribe-form-widget .single-field *:-ms-input-placeholder {
  color: #525256;
}
.subscribe-form-widget .single-field *::-ms-input-placeholder {
  color: #525256;
}
.subscribe-form-widget .single-field *::placeholder {
  color: #525256;
}
.subscribe-form-widget .submit-btn {
  background-color: #03c58a;
  color: #fff;
  cursor: pointer;
  padding: 12px 32px;
  border-radius: 50px;
  border: none;
  text-transform: capitalize;
  font-family: var(--yt-font);
  font-size: 18px;
  line-height: 30px;
  font-weight: 600;
  white-space: nowrap;
}
.subscribe-form-widget .mc4wp-response {
  position: relative;
  top: 15px;
}
.subscribe-form-widget .mc4wp-response .mc4wp-alert.mc4wp-error p, .subscribe-form-widget .mc4wp-response .mc4wp-alert.mc4wp-success p, .subscribe-form-widget .mc4wp-response .mc4wp-alert.mc4wp-notice p {
  color: #fff;
  position: relative;
}

.social-profile {
  display: flex;
  align-items: center;
  gap: 10px;
}
.social-profile a {
  color: #ffffff;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background-color: rgba(244, 244, 244, 0.1);
  border-radius: 50px;
  transition: all 0.5s ease-out;
}
.social-profile a:hover {
  transition: all 0.5s ease-out;
  color: #FFF089;
}

.map-widget iframe {
  width: 100%;
  height: 320px;
  border-radius: 12px;
}

.footer .widget-menu-wrapper {
  padding-left: 50px;
  padding-right: 30px;
}
@media (max-width: 991px) {
  .footer .widget-menu-wrapper {
    padding-left: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer .widget-menu-wrapper {
    padding-left: 12px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1399px) {
  .footer .widget-menu-wrapper {
    padding-right: 0;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .footer .widget-menu-wrapper {
    padding-right: 0;
  }
}
.footer.style-2 .footer-top-area .footer-top-widget-title {
  margin-bottom: 30px;
}
.footer.style-2 .footer-top-area .footer-top-widget-title .title {
  color: #ffffff;
}
.footer.style-2 .footer-widget-info .extra-info {
  margin-top: 20px;
}
.footer.style-2 .footer-widget-info .extra-info .time-slot {
  margin-bottom: 0;
}
.footer.style-2 .footer-widget-info p,
.footer.style-2 .footer-widget.widget_nav_menu li a,
.footer.style-2 .footer-bottom-menu ul li a,
.footer.style-2 .footer-bottom-area .copyright-text p {
  color: rgba(255, 255, 255, 0.7019607843);
}
.footer.style-2 .footer-widget.widget_nav_menu li a:hover,
.footer.style-2 .footer-bottom-menu ul li a:hover {
  color: #03c785;
}
.footer.style-2 .footer-bottom-area .copyright-text p a {
  color: #8f939b;
  font-weight: 700;
}
.footer.style-2 .footer-bottom-area .copyright-text p a:hover {
  color: #03c785;
}
.footer.style-2 .footer-bottom-menu {
  display: flex;
  flex-grow: 1;
  justify-content: end;
}
@media (max-width: 991px) {
  .footer.style-2 .footer-bottom-menu {
    justify-content: start;
  }
}
@media (max-width: 991px) {
  .footer.style-2 .copyright-text {
    margin-right: 0;
    margin-bottom: 20px;
  }
}
.footer.style-2 .footer-widget .social-profile a {
  color: unset;
  background-color: transparent;
}
.footer.style-2 .footer-widget .social-profile a i {
  color: #ffffff;
}
.footer.style-2 .footer-widget .social-profile a:hover i {
  color: #03c785;
}
.footer.style-2 .footer-widget.widget_nav_menu li a:before {
  display: none;
}
.footer.style-2 .footer-widget .footer-widget-contact p {
  margin-bottom: 0;
}
.footer.style-2 .footer-widget .footer-widget-contact .footer-contact ul li {
  align-items: start;
}
.footer.style-2 .footer-widget .footer-widget-contact .footer-contact ul li .contact-icon {
  margin-top: 8px;
}
.footer.style-2 .footer-widget .footer-widget-contact .footer-contact ul li .contact-text a, .footer.style-2 .footer-widget .footer-widget-contact .footer-contact ul li .contact-text span {
  color: rgba(255, 255, 255, 0.7019607843);
}
.footer .subscribe-form-widget.style-2 .mc4wp-form-fields {
  border-color: rgb(199, 199, 225);
  display: block;
}
.footer .subscribe-form-widget.style-2 .submit-btn {
  color: #292929;
  width: auto;
  margin-top: 20px;
  padding: 12px 19px;
}
.footer .subscribe-form-widget.style-2 .submit-btn i {
  display: none;
}
.footer .subscribe-form-widget.style-2 .submit-btn span {
  display: block;
  text-transform: uppercase;
  color: #ffffff;
  font-size: 16px;
  font-weight: 700;
  line-height: 32px;
  letter-spacing: 1.28px;
  font-family: var(--yt-font);
}
.footer .subscribe-form-widget.style-2 .single-field input {
  height: 60px;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.footer.style-3 .footer-top-area {
  position: relative;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .footer.style-3 .footer-top-area {
    margin-bottom: 30px;
  }
}
.footer.style-3 .footer-top-area .footer-widget-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer.style-3 .footer-top-area .footer-widget-info {
    flex-direction: column;
    gap: 30px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .footer.style-3 .footer-top-area .footer-widget-info {
    flex-direction: column;
    gap: 30px;
    align-items: start;
  }
}
.footer.style-3 .footer-top-area .footer-widget-info .footer-widget-contact .footer-contact ul {
  display: flex;
  align-items: center;
  gap: 45px;
  padding: 0;
  margin-bottom: 0;
  list-style: none;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .footer.style-3 .footer-top-area .footer-widget-info .footer-widget-contact .footer-contact ul {
    flex-direction: column;
    align-items: start;
    gap: 20px;
  }
}
.footer.style-3 .footer-top-area .footer-widget-info .footer-widget-contact .footer-contact ul li {
  display: flex;
  gap: 10px;
  color: #ffffff;
}
.footer.style-3 .footer-top-area .footer-widget-info .footer-widget-contact .footer-contact ul li p {
  margin-bottom: 0;
}
.footer.style-3 .footer-top-area .footer-widget-info .footer-widget-contact .footer-contact ul li i {
  color: #03c785;
}
.footer.style-3 .footer-top-area .footer-widget-info .footer-widget-contact .footer-contact ul li a {
  color: #ffffff;
}
.footer.style-3 .footer-widget .social-profile a:hover {
  color: #ffffff;
  background-color: #03c785;
}
.footer.style-3 .footer-widget.widget_nav_menu li a:before {
  display: none;
}/*# sourceMappingURL=style.css.map */

/* 顶部导航防换行：1200-1640px 压缩菜单项间距与字号，保证菜单单行显示。
   注意 ≤1199px 已由汉堡菜单接管（见 js/custom.js 的 meanScreenWidth: "1199"），
   汉堡按钮同步改为 d-xl-none。这里用 `> ul > li > a` 精确匹配顶级菜单项，避免影响下拉子菜单。 */
@media (min-width: 1200px) and (max-width: 1399px) {
  .main-menu > ul > li > a {
    padding-left: 4px;
    padding-right: 4px;
    font-size: 15px;
  }
  /* 下拉项要给箭头留位置；原规则带 !important，这里必须同样加才能覆盖 */
  .main-menu > ul > li.dropdown > a {
    padding-right: 16px !important;
  }
  .header-menu-area.sticky_menu .main-menu > ul > li > a {
    padding-left: 4px;
    padding-right: 4px;
  }
  .header-menu-area.sticky_menu .main-menu > ul > li.dropdown > a {
    padding-right: 16px !important;
  }
  /* 2026-11-09 全站字体改回系统默认后，Segoe UI 比原来的 Urbanist 宽，
     英文态下 15px 也放不下（实测 1200 宽时 Contact 被挤到第二行、头部 116→232）。
     这里让英文也跟着 fitNav() 算出的 --nav-fs 走；放得下时不写变量，仍用 15px。 */
  html[lang="en"] .main-menu > ul {
    white-space: nowrap;
  }
  html[lang="en"] .main-menu > ul > li > a {
    font-size: var(--nav-fs, 15px);
    white-space: nowrap;
    /* 字号变化别走 0.5s 过渡，否则 fitNav 量到中间值算不准（同非英文规则） */
    transition: color .3s ease-out;
  }
}
@media (min-width: 1400px) and (max-width: 1640px) {
  .main-menu > ul > li > a {
    padding-left: 8px;
    padding-right: 8px;
    font-size: 17px;
  }
  .main-menu > ul > li.dropdown > a {
    padding-right: 25px !important;
  }
  .header-menu-area.sticky_menu .main-menu > ul > li > a {
    padding-left: 8px;
    padding-right: 8px;
  }
  .header-menu-area.sticky_menu .main-menu > ul > li.dropdown > a {
    padding-right: 25px !important;
  }
}

/* ==========================================================================
   资质认证页（certification.html）
   ========================================================================== */
.cert-area {
  background-color: #ffffff;
}
.cert-area .section-title .cert-intro {
  max-width: 920px;
  margin: 20px auto 0;
  font-family: var(--yt-font);
  font-size: 17px;
  line-height: 30px;
  color: #585866;
}
.cert-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 26px;
  margin-top: 60px;
}
.cert-card {
  display: flex;
  flex-direction: column;
  background-color: #ffffff;
  border: 1px solid #e9ecea;
  border-radius: 20px;
  padding: 14px 14px 22px;
  text-decoration: none;
  transition: all 0.4s ease-out;
}
.cert-card:hover {
  border-color: #03c588;
  box-shadow: 0 18px 40px rgba(3, 197, 136, 0.14);
  transform: translateY(-6px);
  transition: all 0.4s ease-out;
}
.cert-thumb {
  display: block;
  width: 100%;
  aspect-ratio: 210 / 297;
  background-color: #eceef0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(41, 41, 41, 0.06);
}
.cert-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.cert-info {
  display: block;
  margin-top: 18px;
  text-align: center;
}
.cert-name {
  display: block;
  margin: 0;
  font-family: var(--yt-font);
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
  color: #292929;
}
.cert-sub {
  display: block;
  margin: 6px 0 0;
  font-family: var(--yt-font);
  font-size: 14px;
  line-height: 20px;
  color: #7c7c88;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .cert-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .cert-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin-top: 44px;
  }
  .cert-name {
    font-size: 17px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .cert-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 34px;
  }
  .cert-card {
    padding: 10px 10px 16px;
    border-radius: 16px;
  }
  .cert-thumb {
    border-radius: 10px;
  }
  .cert-info {
    margin-top: 12px;
  }
  .cert-name {
    font-size: 15px;
    line-height: 20px;
  }
  .cert-sub {
    font-size: 12px;
    line-height: 17px;
  }
}
/* 灯箱：证书大图 */
.mfp-cert .mfp-figure figure {
  margin: 0;
}
.mfp-cert img.mfp-img {
  border-radius: 6px;
}
/* 灯箱层级高于固定页头（页头 z-index:999，magnific 默认 18000/20000 已够，这里再抬一档以防被其它层压住） */
.mfp-bg {
  z-index: 99990;
}
.mfp-wrap {
  z-index: 99991;
}
/* 灯箱内可点击元素的手型光标
   magnific 自带 `.mfp-zoom-out-cur .mfp-image-holder .mfp-close{cursor:zoom-out}`（优先级 0,3,0）
   盖掉了 `button.mfp-close{cursor:pointer}`（0,1,1），导致悬停在 × 上是放大镜而不是小手。
   下面用 0,3,1 的选择器改回 pointer。 */
.mfp-wrap .mfp-image-holder .mfp-close,
.mfp-wrap .mfp-iframe-holder .mfp-close,
.mfp-wrap .mfp-close-btn-in .mfp-close,
.mfp-wrap .mfp-close,
.mfp-wrap .mfp-arrow {
  cursor: pointer;
}

/* ============================================================
   about 页：工厂 / 提取车间实景轮播（替换原「科学家团队」版块）
   ============================================================ */
.factory-area .section-title .main-content {
  align-items: flex-end;
}
.factory-nav {
  display: flex;
  align-items: center;
  gap: 12px;
}
.factory-nav-btn {
  width: 56px;
  height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid #d7dbd9;
  border-radius: 50%;
  background-color: #ffffff;
  color: #025d45;
  font-size: 17px;
  line-height: 1;
  cursor: pointer;
  transition: all 0.3s ease-out;
}
.factory-nav-btn:hover {
  background-color: #03c588;
  border-color: #03c588;
  color: #ffffff;
}
.factory-nav-btn:focus-visible {
  outline: 2px solid #03c588;
  outline-offset: 2px;
}
/* 卡片之间的 gutter 只留右侧一条：模板的 .container 是全宽 + 12px 内边距，
   所以这里不能再用负 margin（会把右边撑出屏幕），只靠卡片 padding 制造间隔 */
.factory-slider {
  margin-top: 0px;
}
.factory-slider .factory-card {
  padding-right: 20px;
  box-sizing: border-box;
}
.factory-thumb {
  position: relative;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  border-radius: 24px;
  background-color: #eceef0;
}
.factory-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.6s ease-out;
}
.factory-card:hover .factory-thumb img {
  transform: scale(1.04);
}
.factory-info {
  padding: 18px 2px 0;
}
.factory-name {
  font-size: 22px;
  line-height: 30px;
  font-weight: 600;
  letter-spacing: -0.3px;
  margin-bottom: 4px;
  color: #292929;
}
.factory-sub {
  font-size: 15px;
  line-height: 24px;
  margin-bottom: 0;
  color: #585866;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .factory-area .section-title .main-content {
    align-items: flex-start;
  }
  .factory-slider {
    margin-top: 32px;
  }
  .factory-slider .factory-card {
    padding-right: 16px;
  }
  .factory-thumb {
    border-radius: 18px;
  }
  .factory-name {
    font-size: 19px;
    line-height: 26px;
  }
  .factory-sub {
    font-size: 14px;
    line-height: 22px;
  }
  .factory-nav-btn {
    width: 46px;
    height: 46px;
    font-size: 15px;
  }
}

/* ---------- Company Profile（about.html 公司简介） ---------- */
.company-profile-area {
  padding-bottom: 100px;
}
.company-profile-head {
  margin-bottom: 29px;
}
.company-profile-title {
  font-family: var(--yt-font);
  font-size: 54px;
  line-height: 65px;
  font-weight: 600;
  letter-spacing: -0.96px;
  color: #292929;
  margin-bottom: 36px;
}
.company-profile-left {
  display: flex;
  flex-direction: column;
}
.company-profile-media {
  flex: 1 1 auto;
  min-height: 320px;
  width: 100%;
  border-radius: 30px;
  overflow: hidden;
  background-color: #eceef0;
}
.company-profile-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.company-profile-text p {
  font-size: 17px;
  line-height: 30px;
  color: #525256;
  margin-bottom: 16px;
}
.company-profile-text p:last-child {
  margin-bottom: 0;
}
.company-profile-text .company-profile-lead {
  font-size: 20px;
  line-height: 26px;
  font-weight: 600;
  color: #025d45;
  margin-bottom: 22px;
}
.company-profile-cta {
  margin-top: 28px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .company-profile-title {
    font-size: 42px;
    line-height: 52px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 1399px) {
  .company-profile-title {
    font-size: 40px;
    line-height: 50px;
    margin-bottom: 30px;
  }
  .company-profile-left {
    display: block;
  }
  .company-profile-media {
    flex: none;
    min-height: 0;
    width: 100%;
    max-width: 720px;
    aspect-ratio: 16 / 10;
  }
}
/* 双栏布局下：左侧图片收窄，图与右侧正文之间的留白加大 */
@media only screen and (min-width: 1400px) {
  .company-profile-left .company-profile-media {
    width: 94%;
    max-width: 94%;
  }
  .company-profile-text {
    padding-left: 8px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  .company-profile-area {
    padding-bottom: 56px;
  }
  .company-profile-head {
    margin-bottom: 28px;
  }
  .company-profile-title {
    font-size: 30px;
    line-height: 39px;
    letter-spacing: -0.5px;
    margin-bottom: 24px;
  }
  .company-profile-media {
    flex: none;
    min-height: 0;
    width: 100%;
    max-width: none;
    aspect-ratio: 3 / 2;
    border-radius: 22px;
  }
  .company-profile-text p {
    font-size: 16px;
    line-height: 30px;
  }
  .company-profile-text .company-profile-lead {
    font-size: 17px;
    line-height: 28px;
    margin-bottom: 20px;
  }
}

/* ---------- 卡片图片整块可点击（applications.html 行业列表） ---------- */
/* 1) 图片外层加一层覆盖整块的链接
   注意：z-index 必须是 0，不能是 1。
   .main-content 与 .main-content-wrapper 都是 z-index:auto 的定位元素，按 DOM 顺序绘制；
   若这里给正数 z-index，图片会绘制到悬浮标签框之上，把标签盖住（只剩悬挂在卡片外的一段可见）。
   取 0 时二者同层按 DOM 顺序排，图片在前、标签在后，层级正确；
   点击穿透仍由下面的 pointer-events:none 保证。 */
.project-card.has-image-link .image .image-link {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  border-radius: 35px;
}
/* 2) .main-content 覆盖整张卡片（100% 宽高），会截走点击 —— 让它对指针透明 */
.project-card.has-image-link .main-content {
  pointer-events: none;
}
/* 3) 把真正需要交互的部分重新打开：
   - 右上角箭头
   - 整个悬浮标签框（它靠负 margin 悬挂在卡片下方，必须保持可命中，
     否则鼠标移下去时 :hover 会断掉、标签缩回去） */
.project-card.has-image-link .main-content .btn-wrapper,
.project-card.has-image-link .main-content .main-content-wrapper {
  pointer-events: auto;
}
/* 4) 标签框里的深绿遮罩层盖住了整块，会让点击落不到链接上 —— 对它透明 */
.project-card.has-image-link .main-content .main-content-wrapper .content .overlay {
  pointer-events: none;
}
/* 5) 用标题链接的伪元素把可点区域扩到整个标签框，点标签任意位置都能进详情
   style-2 是 h3.title > a；style-1 直接就是 a.title 本身，两种都覆盖。
   伪元素的定位父级是 .content-inner（position:relative），而 .content 还有一圈
   padding（≥1400 是 24px，以下 12px）——用负 inset 吃掉这圈，标签的圆角和边缘才不是死区 */
.project-card.has-image-link .main-content .main-content-wrapper .title a::before,
.project-card.has-image-link .main-content .main-content-wrapper .content-inner > a.title::before {
  content: "";
  position: absolute;
  inset: -24px;
  z-index: 1;
}
@media only screen and (max-width: 1399px) {
  .project-card.has-image-link .main-content .main-content-wrapper .title a::before,
  .project-card.has-image-link .main-content .main-content-wrapper .content-inner > a.title::before {
    inset: -12px;
  }
}

/* ---------- Applications detail（行业详情页，版式同 service-details） ---------- */
/* 侧栏配色统一到品牌绿：模板默认浅蓝 #ECF4FE + 黄 #FFF089，与全站绿色不搭。
   applications-details 与 products/<slug> 共用同一套侧栏，选择器并列。 */
.app-details-page .service-sidebar .service-widget,
.app-details-page .service-sidebar .service-widget.widget_luxelife_contact_info_widget,
.product-detail-page .service-sidebar .service-widget,
.product-detail-page .service-sidebar .service-widget.widget_luxelife_contact_info_widget {
  background-color: #eef5f1;
}
.app-details-page .service-sidebar .service-widget.contact,
.product-detail-page .service-sidebar .service-widget.contact {
  background-color: #025d45;
}
.app-details-page .service-sidebar .service-widget.contact .title,
.product-detail-page .service-sidebar .service-widget.contact .title {
  color: #ffffff;
}
/* 模板给黄底白按钮 + 白字，字看不见；这里改成亮绿底白字、hover 反白 */
.app-details-page .service-sidebar .service-widget.contact .btn-wrapper .theme-btn,
.app-details-page .service-sidebar .service-widget.contact .btn-wrapper .circle-arrow-btn,
.product-detail-page .service-sidebar .service-widget.contact .btn-wrapper .theme-btn,
.product-detail-page .service-sidebar .service-widget.contact .btn-wrapper .circle-arrow-btn {
  background-color: #03c588;
  color: #ffffff;
}
.app-details-page .service-sidebar .service-widget.contact .btn-wrapper:hover .theme-btn,
.app-details-page .service-sidebar .service-widget.contact .btn-wrapper:hover .circle-arrow-btn,
.product-detail-page .service-sidebar .service-widget.contact .btn-wrapper:hover .theme-btn,
.product-detail-page .service-sidebar .service-widget.contact .btn-wrapper:hover .circle-arrow-btn {
  background-color: #ffffff;
  color: #025d45;
}
/* 分类列表：模板本身给白底，这里只收一点字号（不要覆盖背景色，否则会压掉 .active 的绿色高亮） */
.app-details-page .widget_service_categories ul li a {
  font-size: 17px;
  font-weight: 600;
  line-height: 26px;
}
/* 同一行的两张图强制等高：源图比例不一致（warehouse 1.5 / blending 1.33），
   用 aspect-ratio + object-fit:cover 统一，裁掉一点边而不是把整行撑高 */
.app-details-page .details-content .row .image {
  aspect-ratio: 3 / 2;
}
.app-details-page .details-content .row .image img {
  height: 100%;
  object-fit: cover;
}
/* 模板在 ≤1399 把 .service-details-wrapper 的右内边距压到 12px，而栅格 gutter 是 13.5px，
   单列布局（<1200）下嵌套 .row 的 -13.5px 负边距会比列内容宽 1.5px，把页面顶宽。
   这里把右内边距还原成标准 gutter 的一半。三个详情页（service / applications / products）共用。 */
@media (max-width: 1199px) {
  .service-details-page .service-details-wrapper {
    padding-right: calc(var(--bs-gutter-x) * 0.5);
  }
}

/* ==========================================================================
   Products list page  (.products-page)
   ========================================================================== */
.products-page {
  padding-top: 80px;
  padding-bottom: 110px;
}
.products-page .section-title {
  margin-bottom: 28px;
}
.products-page .section-title .title {
  max-width: 1080px;
  font-size: 44px;
  line-height: 56px;
  letter-spacing: -0.6px;
}
.products-lead {
  max-width: 860px;
  margin-bottom: 34px;
  color: #5c6b66;
  font-size: 16.5px;
  line-height: 28px;
}
.product-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-bottom: 42px;
}
.product-filter .filter-btn {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 13px 21px 13px 23px;
  border: 0;
  border-radius: 999px;
  background-color: #ffffff;
  color: #26332e;
  font-family: var(--yt-font);
  font-size: 15px;
  font-weight: 600;
  line-height: 22px;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: inset 0 0 0 1px #e4eae7, 0 1px 2px rgba(16, 40, 33, 0.04);
  transition: transform 0.25s ease-out, background-color 0.25s ease-out, color 0.25s ease-out,
    box-shadow 0.25s ease-out;
}
.product-filter .filter-btn span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  padding: 2px 8px;
  border-radius: 999px;
  background-color: #f1f5f3;
  color: #7c8b85;
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
  transition: background-color 0.25s ease-out, color 0.25s ease-out;
}
.product-filter .filter-btn:hover {
  transform: translateY(-2px);
  color: #025d45;
  box-shadow: inset 0 0 0 1px #03c785, 0 10px 20px rgba(3, 199, 133, 0.16);
}
.product-filter .filter-btn:hover span {
  background-color: #e3f8f0;
  color: #025d45;
}
.product-filter .filter-btn:focus-visible {
  outline: 2px solid #03c785;
  outline-offset: 3px;
}
.product-filter .filter-btn.is-active {
  background-image: linear-gradient(135deg, #025d45 0%, #03c785 100%);
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18), 0 8px 18px rgba(2, 93, 69, 0.2);
}
.product-filter .filter-btn.is-active span {
  background-color: rgba(255, 255, 255, 0.22);
  color: #ffffff;
}
.product-filter .filter-btn.is-active:hover {
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.26), 0 10px 22px rgba(2, 93, 69, 0.26);
}
.product-card {
  display: block;
  height: 100%;
  background-color: #ffffff;
  border: 1px solid #eef1ef;
  border-radius: 24px;
  overflow: hidden;
  transition: all 0.3s ease-out;
}
.product-card:hover {
  border-color: #cfe9de;
  box-shadow: 0 18px 42px rgba(2, 93, 69, 0.1);
  transform: translateY(-4px);
}
.product-card .product-thumb {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background-color: #ffffff;
}
.product-card .product-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform 0.45s ease-out;
}
.product-card:hover .product-thumb img {
  transform: scale(1.04);
}
.product-card .product-body {
  padding: 16px 20px 22px;
  border-top: 1px solid #f2f5f3;
}
.product-card .product-cat {
  display: block;
  color: #03c785;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 18px;
  text-transform: uppercase;
}
.product-card .product-name {
  margin: 6px 0 12px;
  color: #12241f;
  font-family: var(--yt-font);
  font-size: 20px;
  /* 2026-11-09 用户要求「不要加粗」：Arial 只有 400/700，写 600 会被映射成 Bold */
  font-weight: 400;
  line-height: 27px;
}
.product-card .product-more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #025d45;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
}
.product-card .product-more i {
  transition: transform 0.3s ease-out;
}
.product-card:hover .product-more i {
  transform: translateX(4px);
}
.product-empty {
  padding: 40px 0;
  color: #7b8a84;
  font-size: 16px;
}

/* ==========================================================================
   Product detail page  (.product-detail-page)
   ========================================================================== */
/* 顶部区：左侧图库（大图 + 下方缩略图），右侧产品信息 */
.product-detail-page .product-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 44px;
  align-items: center;
  margin-bottom: 34px;
}
.product-detail-page .gallery-main {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  border: 1px solid #eef1ef;
  border-radius: 24px;
  overflow: hidden;
  background-color: #ffffff;
}
.product-detail-page .gallery-main img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.product-detail-page .gallery-thumbs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(64px, 1fr));
  gap: 10px;
  margin-top: 14px;
}
.product-detail-page .gallery-thumb {
  width: auto;
  height: auto;
  aspect-ratio: 1 / 1;
  padding: 0;
  border: 2px solid #e8eeeb;
  border-radius: 14px;
  overflow: hidden;
  background-color: #f7f9f8;
  cursor: pointer;
  transition: all 0.25s ease-out;
}
.product-detail-page .gallery-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.product-detail-page .gallery-thumb:hover {
  border-color: #9fdec5;
}
.product-detail-page .gallery-thumb.is-active {
  border-color: #03c785;
  box-shadow: 0 0 0 3px rgba(3, 199, 133, 0.14);
}

/* ---- 放大镜：对齐参考站 imagezoomsl 的实际表现
        取景框 = 白色 30% 透明 + 1px 黑边，鼠标为十字准星；
        图片右侧 15px 弹出放大面板（白底 + 1px 黑边，尺寸同图片，
        面板按原图像素 1:1 呈现，故倍率 = 原图宽 / 显示宽） ---- */
.product-detail-page .gallery-main {
  position: relative;
  cursor: crosshair;
  touch-action: manipulation;
}
.product-detail-page .gallery-lens {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  box-sizing: border-box;
  border: 1px solid #000000;
  background-color: rgba(255, 255, 255, 0.3);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease-out;
}
.product-detail-page .gallery-main.is-zooming .gallery-lens {
  opacity: 1;
}
.gallery-zoompanel {
  position: fixed;
  z-index: 9998;
  box-sizing: border-box;
  border: 1px solid #000000;
  background-color: #ffffff;
  background-repeat: no-repeat;
  pointer-events: none;
  opacity: 0;
  transform: scale(0.97);
  transform-origin: left center;
  transition: opacity 0.15s ease-out, transform 0.15s ease-out;
}
.gallery-zoompanel.is-on {
  opacity: 1;
  transform: scale(1);
}
/* 触屏设备没有 hover，隐藏放大镜，改用点击全屏查看 */
@media (hover: none), (pointer: coarse) {
  .product-detail-page .gallery-lens,
  .gallery-zoompanel {
    display: none;
  }
  .product-detail-page .gallery-main {
    cursor: pointer;
  }
}
/* 单列布局（≤991）图片占满整行，右侧放不下面板，一并隐藏 */
@media only screen and (max-width: 991px) {
  .product-detail-page .gallery-lens,
  .gallery-zoompanel {
    display: none;
  }
  .product-detail-page .gallery-main {
    cursor: pointer;
  }
}

/* ---- 全屏查看（点击大图触发） ---- */
.product-zoom {
  position: fixed;
  inset: 0;
  z-index: 99998;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4vmin;
  background-color: rgba(6, 16, 13, 0.93);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.22s ease-out, visibility 0.22s ease-out;
}
.product-zoom.is-open {
  opacity: 1;
  visibility: visible;
}
.product-zoom img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  border-radius: 16px;
  background-color: #ffffff;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.55);
  transform: scale(0.96);
  transition: transform 0.22s ease-out;
}
.product-zoom.is-open img {
  transform: scale(1);
}
.product-zoom-close,
.product-zoom-prev,
.product-zoom-next {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.45);
  border-radius: 50%;
  background-color: rgba(6, 16, 13, 0.55);
  color: #ffffff;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  transition: all 0.2s ease-out;
}
.product-zoom-close:hover,
.product-zoom-prev:hover,
.product-zoom-next:hover {
  border-color: #03c785;
  background-color: #03c785;
}
.product-zoom-close {
  top: 22px;
  right: 22px;
  width: 46px;
  height: 46px;
  font-size: 24px;
}
.product-zoom-prev,
.product-zoom-next {
  top: 50%;
  width: 46px;
  height: 46px;
  margin-top: -23px;
  font-size: 28px;
  line-height: 0.9;
}
.product-zoom-prev {
  left: 22px;
}
.product-zoom-next {
  right: 22px;
}
.product-zoom-count {
  position: absolute;
  left: 50%;
  bottom: 20px;
  transform: translateX(-50%);
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
  letter-spacing: 1px;
}
@media only screen and (max-width: 767px) {
  .product-zoom {
    padding: 3vmin;
  }
  .product-zoom-close {
    top: 12px;
    right: 12px;
    width: 40px;
    height: 40px;
  }
  .product-zoom-prev,
  .product-zoom-next {
    width: 38px;
    height: 38px;
    margin-top: -19px;
  }
  .product-zoom-prev {
    left: 8px;
  }
  .product-zoom-next {
    right: 8px;
  }
}
.product-detail-page .product-name {
  margin: 0 0 10px;
  color: #12241f;
  font-family: var(--yt-font);
  font-size: 36px;
  font-weight: 600;
  line-height: 46px;
  letter-spacing: -0.5px;
}
.product-detail-page .product-sub {
  margin: 0 0 20px;
  color: #5c6b66;
  font-size: 16.5px;
  font-style: italic;
  line-height: 27px;
}
.product-detail-page .product-info p {
  margin-bottom: 14px;
  color: #3d4d48;
  font-size: 16px;
  line-height: 28px;
}
.product-detail-page .product-actions {
  margin: 26px 0 0;
}
.product-detail-page .btn-coa {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 16px 34px;
  border-radius: 50px;
  background-color: #03c588;
  color: #ffffff;
  font-family: var(--yt-font);
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  transition: all 0.25s ease-out;
}
.product-detail-page .btn-coa:hover {
  background-color: #025d45;
  color: #ffffff;
}
.product-detail-page .product-share {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  margin-top: 26px;
  padding-top: 22px;
  border-top: 1px solid #eef1ef;
}
.product-detail-page .product-share a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  color: #9aa8a2;
  font-size: 19px;
  line-height: 1;
  transition: color 0.2s ease-out;
}
.product-detail-page .product-share a[data-share="facebook"] { color: #1877f2; }
.product-detail-page .product-share a[data-share="twitter"] { color: #111111; }
.product-detail-page .product-share a[data-share="whatsapp"] { color: #25d366; }
.product-detail-page .product-share a[data-share="pinterest"] { color: #e60023; }
.product-detail-page .product-share a[data-share="tumblr"] { color: #35465c; }
.product-detail-page .product-share a[data-share="linkedin"] { color: #0a66c2; }
.product-detail-page .product-share a:hover {
  opacity: 0.72;
}
.product-detail-page .details-content h4.product-sec-title {
  margin: 34px 0 16px;
  color: #12241f;
  font-family: var(--yt-font);
  font-size: 25px;
  font-weight: 600;
  line-height: 34px;
}
.product-detail-page .spec-table-wrap {
  margin-bottom: 26px;
  border: 1px solid #eef1ef;
  border-radius: 20px;
  overflow: hidden;
}
.product-detail-page .spec-table {
  width: 100%;
  margin: 0;
  border-collapse: collapse;
}
.product-detail-page .spec-table th,
.product-detail-page .spec-table td {
  padding: 14px 20px;
  border-bottom: 1px solid #f1f4f2;
  font-size: 15.5px;
  line-height: 26px;
  text-align: left;
  vertical-align: top;
}
.product-detail-page .spec-table tr:last-child th,
.product-detail-page .spec-table tr:last-child td {
  border-bottom: none;
}
.product-detail-page .spec-table th {
  width: 32%;
  color: #025d45;
  font-weight: 600;
  background-color: #f7fbf9;
}
.product-detail-page .spec-table td {
  color: #3d4d48;
}
.product-detail-page .product-check-list {
  display: grid;
  gap: 12px;
  margin: 0 0 26px;
  padding: 0;
  list-style: none;
}
.product-detail-page .product-check-list li {
  position: relative;
  padding-left: 30px;
  color: #3d4d48;
  font-size: 16px;
  line-height: 28px;
}
.product-detail-page .product-check-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background-color: rgba(3, 199, 133, 0.15);
}
.product-detail-page .product-check-list li::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 13px;
  width: 5px;
  height: 3px;
  border-left: 2px solid #03c785;
  border-bottom: 2px solid #03c785;
  transform: rotate(-45deg);
}
.product-detail-page .product-check-list li strong {
  display: block;
  color: #12241f;
  font-weight: 600;
}
.product-detail-page .product-disclaimer {
  padding: 16px 20px;
  border-left: 3px solid #03c785;
  border-radius: 0 12px 12px 0;
  background-color: #f7fbf9;
  color: #6b7a74;
  font-size: 14.5px;
  line-height: 25px;
}
.product-detail-page .product-faq {
  margin-bottom: 10px;
  border: 1px solid #eef1ef;
  border-radius: 16px;
  padding: 20px 24px;
}
.product-detail-page .product-faq h5 {
  margin: 0 0 8px;
  color: #12241f;
  font-size: 17px;
  font-weight: 600;
  line-height: 26px;
}
.product-detail-page .product-faq p {
  margin: 0;
  color: #5c6b66;
  font-size: 15.5px;
  line-height: 26px;
}
.product-detail-page .widget_service_categories ul li a {
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
}
/* 模板把 .active 的文字色写死成 #525256，压在绿底上对比度不足，这里改成白字 */
.product-detail-page .widget_service_categories ul li.active a,
.product-detail-page .widget_service_categories ul li.active a:after,
.product-detail-page .widget_service_categories ul li:hover a,
.product-detail-page .widget_service_categories ul li:hover a:after {
  color: #ffffff;
}
.product-detail-page .service-sidebar .service-widget + .service-widget {
  margin-top: 24px;
}
.product-detail-page .product-cta-note {
  margin: 18px 0 0;
  color: #e9f5ef;
  font-size: 14.5px;
  line-height: 24px;
}

@media only screen and (max-width: 1199px) {
  .product-detail-page .product-top {
    gap: 30px;
  }
  .product-detail-page .product-name {
    font-size: 30px;
    line-height: 40px;
  }
  .product-detail-page .gallery-thumbs {
    grid-template-columns: repeat(auto-fit, minmax(56px, 1fr));
    gap: 9px;
  }
}
@media only screen and (max-width: 991px) {
  .product-detail-page .product-top {
    grid-template-columns: 1fr;
    gap: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .products-page {
    padding-top: 56px;
    padding-bottom: 72px;
  }
  .products-page .section-title .title {
    font-size: 28px;
    line-height: 38px;
    letter-spacing: -0.2px;
  }
  .product-filter {
    flex-wrap: nowrap;
    gap: 8px;
    margin-bottom: 30px;
    padding-bottom: 8px;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .product-filter::-webkit-scrollbar {
    display: none;
  }
  .product-filter .filter-btn {
    flex: 0 0 auto;
    gap: 7px;
    padding: 10px 14px 10px 16px;
    font-size: 13.5px;
    line-height: 20px;
    white-space: nowrap;
  }
  .product-filter .filter-btn span {
    min-width: 22px;
    padding: 1px 6px;
    font-size: 11px;
    line-height: 17px;
  }
  .product-card .product-name {
    font-size: 18px;
    line-height: 25px;
  }
  .product-detail-page .gallery-main {
    border-radius: 20px;
  }
  .product-detail-page .gallery-thumbs {
    grid-template-columns: repeat(auto-fit, minmax(52px, 1fr));
    gap: 8px;
    margin-top: 10px;
  }
  .product-detail-page .gallery-thumb {
    border-radius: 10px;
  }
  .product-detail-page .product-name {
    font-size: 26px;
    line-height: 34px;
  }
  .product-detail-page .btn-coa {
    padding: 14px 26px;
    font-size: 15px;
  }
  .product-detail-page .product-share {
    gap: 14px;
  }
  .product-detail-page .details-content h4.product-sec-title {
    margin-top: 26px;
    font-size: 22px;
    line-height: 30px;
  }
  .product-detail-page .spec-table th,
  .product-detail-page .spec-table td {
    padding: 11px 14px;
    font-size: 14.5px;
    line-height: 24px;
  }
  .product-detail-page .spec-table th {
    width: 38%;
  }
  .product-detail-page .product-check-list li {
    font-size: 15px;
    line-height: 26px;
  }
}

/* ==========================================================================
   Inner page banner overlay
   所有内页的 .page-breadcrumb-area 统一压一层黑色半透明遮罩，
   保证 banner 换成浅色照片后标题和面包屑仍然可读。
   遮罩用伪元素而不是额外 DOM，图片/纯色底都适用；纯黑底叠加后仍是黑，无副作用。
   ========================================================================== */
.page-breadcrumb-area::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
  background-color: rgba(0, 0, 0, 0.5);
  pointer-events: none;
}
.page-breadcrumb-area > .container,
.page-breadcrumb-area .container {
  position: relative;
  z-index: 1;
}

/* 顶部信息区放不下的简介段落，落到图库下方继续 */
.product-detail-page .product-lead-rest {
  margin-bottom: 26px;
}

/* ==========================================================================
   共用产品详情页（product-details.html）
   加载态 / 未选产品的空状态
   ========================================================================== */
.product-detail-page .pd-loading {
  padding: 40px 0;
  font-size: 16px;
  color: #6b7280;
}
.product-detail-page .pd-notice {
  padding: 10px 0 26px;
}
.product-detail-page .pd-notice h2 {
  font-size: 30px;
  line-height: 1.3;
  margin-bottom: 12px;
}
.product-detail-page .pd-notice p {
  font-size: 16px;
  line-height: 28px;
  color: #4b5563;
  margin-bottom: 18px;
}
.product-detail-page .pd-notice .btn-coa {
  display: inline-flex;
  align-items: center;
  padding: 14px 30px;
  border-radius: 50px;
  background-color: #03c588;
  color: #fff;
  font-weight: 600;
}
.product-detail-page .pd-index ul {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.product-detail-page .pd-index ul li a {
  font-size: 15px;
  line-height: 26px;
  color: #025d45;
}
.product-detail-page .pd-index ul li a:hover {
  text-decoration: underline;
}

/* ==========================================================================
   about.html 专属：团队专区与「OUR DATA」数据区之间补足上下间距
   （只在 about-page 下生效，首页 index.html 的同名区块不受影响）
   ========================================================================== */
@media only screen and (min-width: 1200px) {
  .about-page .about-us-area.style-1 {
    padding-bottom: 100px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .about-page .about-us-area.style-1 {
    padding-bottom: 80px;
  }
}

/* 图库下方长文案的小节标题：左侧渐变竖条 + 虚线分隔，做出更精致的层次 */
.product-detail-page .product-lead-rest h4.product-sec-title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 18px;
  padding-bottom: 13px;
  border-bottom: 1px dashed #dbe4df;
  font-size: 26px;
  line-height: 34px;
  letter-spacing: -0.3px;
}
.product-detail-page .product-lead-rest h4.product-sec-title::before {
  content: "";
  flex: 0 0 auto;
  width: 5px;
  height: 24px;
  border-radius: 999px;
  background-image: linear-gradient(180deg, #025d45 0%, #03c588 100%);
}

@media only screen and (min-width: 0px) and (max-width: 767px) {
  .product-detail-page .product-lead-rest h4.product-sec-title {
    gap: 10px;
    margin-bottom: 14px;
    padding-bottom: 11px;
    font-size: 22px;
    line-height: 30px;
  }
  .product-detail-page .product-lead-rest h4.product-sec-title::before {
    width: 4px;
    height: 20px;
  }
}

/* ==========================================================================
   头部自适应修复（style-2 白底胶囊导航）
   问题1：白 logo 与白色导航条左侧的弧形色块重叠 → 文字被白色「吃掉」，看起来像被裁掉
   问题2：logo 固定 256px，在 1140 容器下撑破 25% 的列，一路顶到白色导航条下面
   问题3：992–1199 区间汉堡按钮是深色（#292929），压在深色 banner 上几乎看不见
   问题4：992–1199 的 Language 按钮和汉堡按钮挤在一起
   思路：logo 按断点限宽；汉堡按钮 1200 以下统一白色
   ⚠️ 弧形色块 .border-radius-top-shape（93×116）**必须与导航条等高**，只能等比整体缩放。
      曾经为了避开 logo 把它改成 66×82，结果弧形只画到 82px，导航条底部（116px）露出 34px 直角白边，
      在 1400–1599（也就是 1600px 窗口减去滚动条后的 1584）表现为阶梯状「多出来一块」。
   ========================================================================== */

/* 1) logo 按断点限宽（等比缩放，height:auto 保持比例） */
.header-area .logo img {
  display: block;
  height: auto;
}
@media only screen and (max-width: 575px) {
  .header-area .logo img { width: 170px; }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .header-area .logo img { width: 200px; }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-area .logo img { width: 220px; }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-area .logo img { width: 230px; }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .header-area .logo img { width: 200px; }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .header-area .logo img { width: 212px; }
}
@media only screen and (min-width: 1600px) {
  .header-area .logo img { width: 256px; }
}

/* 2) 导航条左侧弧形色块：必须与导航条等高（116px），否则弧形只画到一半、底部露出一截直角白边
      只允许等比整体缩放（保持 93:116），不改高度 */

/* 3) 平板/手机汉堡按钮：白底深色前一律白色，滚动吸顶后恢复深色 */
@media only screen and (max-width: 1199px) {
  .header-area.style-2 .header-menu-area .mobile-menu-bar a i { color: #ffffff; }
  .header-area.style-2 .header-menu-area.sticky_menu .mobile-menu-bar a i { color: #292929; }
}

/* 4) 992–1199 平板布局：导航已由汉堡接管，语言按钮保留（收成小尺寸，见下方语言切换块），
      这里只把汉堡和它之间的间距撑开，避免两个按钮贴在一起 */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-area.style-2 .header-menu-area .mobile-menu-bar { margin-left: 18px; }
}

/* ==========================================================================
   语言切换（国旗下拉 + 整页机器翻译，由 js/lang-switch.js 驱动）
   结构：.lang-switch > .lang-trigger + .lang-panel > .lang-item
   注意：面板横向右对齐，不要在 .header-menu-area 上加 overflow:hidden
   兼容：间距一律用 margin，不用 flex gap —— 旧版 iOS Safari（<14.1）和部分
        国产内核不支持 flex gap，用了会变成国旗和文字粘在一起
   ========================================================================== */
.lang-switch { position: relative; }
.lang-trigger {
  display: flex;
  align-items: center;
  padding: 11px 18px 11px 14px;
  border: 0;
  border-radius: 50px;
  background-color: #03c588;
  color: #fff;
  font-family: var(--yt-font);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  white-space: nowrap;
  transition: background-color .4s ease-out;
}
.lang-trigger:hover,
.lang-switch.is-open .lang-trigger { background-color: #025d45; color: #fff; }
.lang-trigger .lang-flag {
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  margin-right: 9px;
  border-radius: 5px;
  object-fit: cover;
  display: block;
  box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .9), 0 2px 5px rgba(0, 0, 0, .22);
}
.lang-trigger .lang-caret {
  width: 10px;
  height: 10px;
  flex: 0 0 10px;
  margin-left: 9px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-3px) rotate(45deg);
  transition: transform .3s ease;
}
.lang-switch.is-open .lang-trigger .lang-caret { transform: translateY(1px) rotate(-135deg); }

.lang-panel {
  position: absolute;
  right: 0;
  top: calc(100% + 16px);
  width: 234px;
  padding: 2px 0;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 18px 48px rgba(13, 40, 32, .18), 0 2px 8px rgba(13, 40, 32, .08);
  z-index: 1300;
  max-height: 620px; /* 老内核兜底 */
  max-height: min(80vh, 620px);
  overflow-y: auto;
  overscroll-behavior: contain;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity .24s ease, transform .24s ease, visibility .24s;
}
.lang-switch.is-open .lang-panel { opacity: 1; visibility: visible; transform: translateY(0); }
.lang-panel::-webkit-scrollbar { width: 6px; }
.lang-panel::-webkit-scrollbar-thumb { background: #dcdcdc; border-radius: 6px; }

.lang-item {
  display: flex;
  align-items: center;
  padding: 9px 18px;
  color: #3b3b3b;
  font-family: var(--yt-font);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
  border-bottom: 1px solid #efefef;
  transition: background-color .2s ease, color .2s ease;
}
.lang-item:last-child { border-bottom: 0; }
.lang-item:hover { background-color: #f4faf7; color: #03a271; }
.lang-item.is-active { background-color: #f1faf6; color: #03855c; font-weight: 700; }
.lang-item .lang-flag {
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  margin-right: 14px;
  border-radius: 6px;
  object-fit: cover;
  display: block;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .2);
}
/* 语言名 + 右侧对勾：用 flex 撑开，不依赖 float（阿语等从右往左文字更稳） */
.lang-item span {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.lang-item.is-active span::after {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 12px;
  margin-left: 12px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
}

/* 992–1199：导航已交给汉堡，语言按钮保留但收成小尺寸 */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .lang-trigger { padding: 9px 14px 9px 11px; font-size: 15px; }
  .lang-trigger .lang-flag { width: 22px; height: 22px; flex: 0 0 22px; margin-right: 7px; }
  .lang-trigger .lang-caret { margin-left: 7px; }
  .lang-panel { width: 214px; }
  .lang-item { padding: 10px 16px; font-size: 15px; }
  .lang-item .lang-flag { width: 26px; height: 26px; flex: 0 0 26px; margin-right: 12px; }
}
@media (max-width: 991px) {
  /* 手机上保留语言切换（放在汉堡左侧），搜索按钮仍收起 */
  .header-area.style-2 .header-menu-area .search-btn-with-btn { display: flex; margin-left: 0; }
  .header-area.style-2 .header-menu-area .search-btn-with-btn .search-btn-wrapper { display: none; }
  .header-area.style-2 .header-menu-area .mobile-menu-bar { margin-left: 10px; }
  .lang-trigger { padding: 8px 12px 8px 9px; font-size: 15px; }
  .lang-trigger .lang-flag { width: 22px; height: 22px; flex: 0 0 22px; margin-right: 7px; }
  .lang-trigger .lang-caret { margin-left: 7px; }
  .lang-panel { width: 208px; top: calc(100% + 12px); }
  .lang-item { padding: 9px 15px; font-size: 15px; }
  .lang-item .lang-flag { width: 25px; height: 25px; flex: 0 0 25px; margin-right: 12px; }
}
@media (max-width: 575px) {
  .lang-current { display: none; }
  .lang-trigger { padding: 8px 10px; }
  .lang-trigger .lang-flag { margin-right: 6px; }
  .lang-trigger .lang-caret { margin-left: 6px; }
  .lang-panel { right: -6px; width: 200px; }
}

/* 翻译进行中：顶部细进度条 + 国旗呼吸，提示「正在翻，别急」 */
html.is-translating body::after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  width: 100%;
  z-index: 99999;
  background: linear-gradient(90deg, rgba(3, 197, 136, 0) 0%, #03c588 45%, #7fe0c1 55%, rgba(3, 197, 136, 0) 100%);
  background-size: 45% 100%;
  background-repeat: no-repeat;
  animation: langProgress 1.1s linear infinite;
  pointer-events: none;
}
html.is-translating body { cursor: progress; }
html.is-translating .lang-trigger .lang-flag { animation: langFlagPulse 1.1s ease-in-out infinite; }
@keyframes langProgress {
  0% { background-position: -50% 0; }
  100% { background-position: 150% 0; }
}
@keyframes langFlagPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .45; }
}
/* 系统开了「减少动态效果」就不跑进度条/呼吸动画，只留静态提示 */
@media (prefers-reduced-motion: reduce) {
  html.is-translating body::after,
  html.is-translating .lang-trigger .lang-flag { animation: none; }
  .lang-panel,
  .lang-trigger .lang-caret { transition: none; }
}

/* 非英文语种：译文普遍比英文更长（俄语/德语/法语尤为明显），顶级菜单禁止换行，
   字号由 js/lang-switch.js 里 fitNav() 按「实际译文宽度 ÷ 可用宽度」算出写进
   --nav-fs（10.5px–14.5px），保证 1200–1600 各宽度都不换行、不撑高头部。
   不用固定断点字号是因为译文长度不可预知（微软/腾讯两条通道结果也不一样）。
   右侧留给下拉箭头的 20px / 17px 由下面的箭头规则统一给，这里不覆盖。
   二级菜单不加 nowrap：子菜单宽度固定，俄语/阿语长词会溢出白底，换行更稳 */
html:not([lang="en"]) .main-menu > ul { white-space: nowrap; }
html:not([lang="en"]) .main-menu > ul > li > a {
  font-size: var(--nav-fs, 14.5px);
  padding-left: 6px;
  padding-right: 6px;
  white-space: nowrap;
  /* 模板给 .main-menu ul li a 写的是 transition: all .5s，字号变化也会走 0.5 秒动画，
     会让 fitNav() 量到过渡中的中间值、算不准。非英文态只保留颜色过渡。 */
  transition: color .3s ease-out;
}

/* 翻译接口不可用时的提示条 */
.lang-toast {
  position: fixed;
  left: 24px;
  bottom: 24px;
  max-width: 340px;
  padding: 12px 18px;
  border-radius: 10px;
  background: #1f2a26;
  color: #fff;
  font-size: 14px;
  line-height: 1.5;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .25);
  z-index: 99998;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity .3s ease, transform .3s ease, visibility .3s;
}
.lang-toast.is-show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* ==========================================================================
   顶级菜单下拉箭头：贴字问题修复
   原实现是 Font Awesome 字形（\f107），盒子宽 18.25px、right:6px，
   实际字形画在距右边 9–21px 的位置；而链接的文字内边距只有 16–18px，
   于是箭头直接压在文字上（译成阿语/中文后文字变短更明显）。
   这里换成固定尺寸的 CSS 箭头：6px 方框旋转 45°，水平占位约 8.5px，
   垂直用 translateY(-50%) 精确居中，不受字体度量影响。
   ========================================================================== */
.main-menu > ul > li.dropdown > a:before {
  content: "";
  width: 6px;
  height: 6px;
  padding: 0;
  border-right: 1.8px solid currentColor;
  border-bottom: 1.8px solid currentColor;
  font-size: 0;
  line-height: 0;
  top: 50%;
  right: 5px;
  margin-top: 0;
  transform: translateY(-50%) rotate(45deg);
  visibility: visible;
}
/* 文字与箭头之间固定留 8px 左右：箭头占 3.8–12.2px，文字止于 20px */
.main-menu > ul > li.dropdown > a {
  padding-right: 20px !important;
}
/* 吸顶态（sticky_menu）原来单独写了 25px，这里拉齐，避免滚动后箭头又飘远 */
.header-menu-area.sticky_menu .main-menu > ul > li.dropdown > a {
  padding-right: 20px !important;
}
@media (min-width: 1200px) and (max-width: 1399px) {
  .main-menu > ul > li.dropdown > a {
    padding-right: 17px !important;
  }
  .header-menu-area.sticky_menu .main-menu > ul > li.dropdown > a {
    padding-right: 17px !important;
  }
}
/* 下拉子菜单（二级/三级）的箭头沿用原 Font Awesome 实现，上面的规则只作用于顶级菜单 */

/* ==========================================================================
   手机端适配统一（≤767px）  2026-11-06
   --------------------------------------------------------------------------
   改这里之前先看这三条实测问题（都是模板遗留）：
   1) 版心留白三套并存：正文 13.5px（bootstrap gutter .75rem，根字号 18 → 13.5）、
      头部 43.5px（.header-menu-area 自带 30px + container 13.5）、hero 卡片 20px。
      统一成 20px，和 hero / 产品卡 / banner 卡片的圆角边距对齐。
   2) 手机上所有内容卡片的标题是「悬停才显示」（.project-card 的 .main-content-wrapper
      默认 visibility:hidden + opacity:0），触屏没有 hover → 应用页整屏只有图片、没有文字。
   3) 交互热区普遍过小：汉堡 19×22、轮播圆点 21×21、社交图标 22×22。
   另外：产品卡图片里的产品名是烧进 jpg 的，所以列表**必须保持单列**，不能改两列，
        否则图片里的字会缩到看不清。
   ========================================================================== */
@media only screen and (max-width: 767px) {

  /* ---------- 1. 版心与左右留白统一 20px ---------- */
  /* 模板写的是 .header-area.style-2 .header-menu-area{padding:0 30px}，
     选择器比我下面这条高一级，必须写成同样的层级才压得住（否则 320 宽下
     头部只剩 260px，logo 会压住语言按钮） */
  .header-area.style-2 .header-menu-area,
  .header-area .header-menu-area {
    padding-left: 0;
    padding-right: 0;
  }
  .container {
    width: 100%;
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }
  /* 栅格负边距跟着留白走，否则列背景会比正文宽出 6.5px */
  .row {
    --bs-gutter-x: 40px;
  }
  /* 头部 logo 再往右挪 12px（20 → 32）。左侧白色弧形色块会把 logo 挤得视觉上贴边，
     实测 390 宽下 logo 右边缘 190、语言按钮左边缘 266，留 76px；
     320 宽（logo 142）也还有 43px 余量，加 12px 不会压住语言按钮。
     只给 logo 加外边距，不动 container 内边距，右侧语言/汉堡位置保持不变。 */
  .header-area .logo {
    margin-left: 12px;
  }
  /* ---------- 1b. 吸顶头部（2026-11-09） ----------
     问题：.header-menu-area 带 transition: all .5s，滚动加 sticky_menu 时
     top 19px→0、背景 transparent→#fff、高度 80→84 都在过渡/跳变，
     滚动瞬间白条会「飘」一下、顶端露出一条缝、背景半透明时正文会透出来。
     处理：手机端不做过渡；吸顶与非吸顶高度统一 72px（滚动不跳变）；
     白底页面上加 1px 分隔线 + 稍实的阴影，让头部与正文有明确边界。 */
  /* 过渡只留 top：原规则是 transition: all，会把背景色也从透明渐变到白，
     滚动那 0.5s 里头部是半透明的，正文会透出来；背景现在瞬时生效。 */
  .header-menu-area {
    transition: top 0.25s ease-out;
  }
  .header-area .header-menu-area .logo,
  .header-area .header-menu-area.sticky_menu .logo {
    height: 72px;
  }
  .header-area .header-menu-area.sticky_menu,
  .header-menu-area.sticky_menu {
    border-bottom: 1px solid #eef0f2;
    box-shadow: 0 6px 18px rgba(2, 93, 69, 0.08);
  }
  /* 抽屉式侧边菜单停在视口右侧外面（right:-485px），在 320 宽机型上会把文档
     可滚动宽度撑到 361px。⚠️ 不能用 html{overflow-x:hidden/clip} 去裁：
     实测会让 window.scrollY 恒为 0，吸顶头部和返回顶部按钮全部失效。
     改成把抽屉自己挪出去（translateX），下面第 12 节单独处理。 */


  /* ---------- 2. 正文字号：18px/32 → 16px/28 ---------- */
  body {
    font-size: 16px;
    line-height: 28px;
  }
  p {
    font-size: 16px;
    line-height: 28px;
  }
  /* 区块小标签（OUR PRODUCTS / ABOUT US…）原来只有 11px，提到 12px */
  .short-title {
    font-size: 12px;
    letter-spacing: 0.14em;
    line-height: 20px;
  }

  /* ---------- 3. 标题层级：桌面 28/42 在 390 宽里过大，且行高过松 ----------
     模板给每个区块单独写了 h2.title 的字号（28/32/42 混用，选择器层级还各不相同，
     如 .about-us-area .section-title .title 是 32px、.slider-area.style-1 … 是 42px），
     用 !important 才能压成同一套；否则同一页面会出现 24 / 32 两种标题。 */
  .section-title .title {
    font-size: 24px !important;
    line-height: 1.38 !important;
    letter-spacing: -0.2px !important;
  }
  .section-title {
    margin-bottom: 26px;
  }
  .page-breadcrumb-area .page-title {
    font-size: 28px;
    line-height: 36px;
  }
  .slider-area .slider-title {
    font-size: 26px !important;
    line-height: 34px !important;
  }
  /* 数字卡（320 / 100 / 35+ / 10,000m²）：68px 在 300px 宽的圆/卡里会顶到边，
     用 vw 跟着屏宽走，320 宽也不会溢出 */
  .number {
    font-size: clamp(40px, 13.5vw, 60px) !important;
    line-height: 1.15 !important;
  }

  /* ---------- 4. 区块上下间距：统一到 32 ----------
     模板的 py-140 / py-sm-60 / py-md-80 是工具类，每个区块生效值不同
     （实测 56 / 72 / 80 三种并存），区块挨着区块时上下 padding 相加
     会让手机上一个空档达到 112–160px。2026-11-09 用户再次反馈「红框高度太大」，
     统一收到 32 → 相邻区块的空白从 112 降到 64。 */
  .about-us-area,
  .project-area,
  .feature-area,
  .latest-posts-area,
  .circle-area,
  .cta-area,
  .info-card-slider-area,
  .brand-marquee-area,
  .testimonial-area,
  .faq-area,
  .company-profile-area,
  .factory-area,
  .production-area,
  .cert-area,
  .blog-area,
  .products-page,
  .service-details-page,
  .contact-form-area {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }
  /* 这两块下面是紧接的兄弟区块，底部留白由兄弟的 padding-top 提供，这里保持 0 */
  .about-us-area,
  .contact-info-area {
    padding-bottom: 0 !important;
  }
  .contact-info-area {
    padding-top: 32px !important;
  }
  /* CTA 绿卡里的「Contact Us」原本是 absolute 贴在右下角，和左侧「Partner Clients」
     是同一水平带：320 宽实测直接压字（卡片内可用宽 220，文字 152 + 按钮 122 打架），
     而且站上 11 种语言译文长短不一，靠调字号治不了。这里改成正常流式排布，左对齐堆叠。 */
  .cta-area.style-1 .section-title {
    height: auto !important;
    padding: 28px 24px 26px !important;
    justify-content: flex-start;
    gap: 0;
  }
  .cta-area.style-1 .section-title .btn-inner {
    padding: 10px 0 0;
  }
  .cta-area.style-1 .section-title span {
    font-size: 16px;
  }
  .cta-area.style-1 .service-btn-area {
    position: static;
    right: auto;
    bottom: auto;
    width: auto;
    height: auto;
    margin-top: 18px;
    align-self: flex-start;
    background: none;
  }
  .cta-area.style-1 .service-btn-area .theme-btn {
    margin: 0;
  }
  .cta-area.style-1 .service-btn-area .left-sticky-corner {
    display: none;
  }
  /* 模板的间距工具类（py-140 / py-sm-60 / py-md-80 / pt-140…）在手机上是 60–140px，
     太浪费屏高；统一压到 32，和上面第 4 节的区块规则保持一致。 */
  .py-140,
  .py-sm-60,
  .py-md-80,
  .py-lg-100 {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }
  .pt-140,
  .pt-sm-60,
  .pt-md-80,
  .pt-lg-100 {
    padding-top: 32px !important;
  }
  .pb-140,
  .pb-sm-60,
  .pb-md-80,
  .pb-lg-100 {
    padding-bottom: 32px !important;
  }
  /* 新闻区 → 客户 logo → 页脚这一段原来叠了 56+40+64+64+80 = 304px 空白
     （390 宽实测），手机上几乎一屏全是空档。逐段收紧：
       新闻卡底 → 细线：56 → 32（区块 padding-bottom 收一半 + logo 区 margin-top 40→24）
       细线 → 客户 logo：64 → 32（.client-logo-slider-wrapper 的上下 padding）
       客户 logo → 页脚：64 → 32
       页脚内顶部：80 → 48（见下面第 11 节） */
  .latest-posts-area {
    padding-bottom: 32px !important;
  }
  /* 新闻卡之间的垂直间距：模板用的是 .row.gy-5，--bs-gutter-y 为 3rem，
     而根字号是 18px → 每张卡上方固定 54px 空白（Bootstrap 的 .row>* margin-top）。
     手机端单列堆叠后，「View more → 下一张卡片图片」被拉开 54px，压到 32。 */
  .latest-posts-area .row {
    --bs-gutter-y: 32px;
  }
  /* 新闻列表页（news.html）的相邻两条同病：模板 .single-post-item margin-bottom:64px，
     单列微信式阅读下太松，收到 32 与首页新闻卡同一节奏；最后一条不收，
     否则和 .blog-area 的 padding-bottom 叠成 64。 */
  .blog-area .single-post-item {
    margin-bottom: 32px;
  }
  .blog-area .single-post-item:last-child {
    margin-bottom: 0;
  }
  /* 新闻列表的标题模板在手机端是 28px/38px，长标题能占四行、行距也松；
     图 → 标签的 40px、标签 → 标题的 16px、标题 → 日期的 20px 一并收紧。 */
  .single-post-item .post-title {
    font-size: 21px;
    line-height: 28px;
    letter-spacing: -0.2px;
    margin-top: 2px;
  }
  .single-post-item .post-thumbnail {
    margin-bottom: 24px;
  }
  .single-post-item .blog-post-tag .post-tag-list {
    margin-bottom: 10px;
  }
  .single-post-item .post-meta {
    margin-top: 12px;
  }
  .brand-slider-area {
    margin-top: 24px;
  }
  .brand-slider-area.style-1 .client-logo-slider-wrapper {
    padding: 32px 0;
  }
  /* contact / advantages / certification 三页的「表单 → 客户 logo 分隔线」
     原本都是按钮下面 84px 空白（区块 padding-bottom 32 + 栅格留白 28 + logo 区
     margin-top 24），按钮已经贴到蓝底边缘了，线却孤悬在中间。
     这里把区块底部内边距收到 8、logo 区 margin-top 收到 8，
     按钮 → 细线 = 44px，细线 → logo 仍是 32px，视觉上线变成 logo 区的上边界。
     .contact-form-area 只在这三页 + index（注释里）出现，不会误伤。 */
  .contact-form-area {
    padding-bottom: 8px !important;
  }
  .contact-form-area + .brand-slider-area {
    margin-top: 8px;
  }
  /* 客户 logo 滑块手机上改成一行 3 个（js/custom.js 里 slidesToShow 也已改 3），
     320 宽时每格只有 93px，图按自身宽度会溢出、两个 logo 贴在一起，
     这里留出左右间隙 + 宽度跟着格子走。
     6 张图已统一成 210x56、墨迹高度一致（tools/normalize_brand_logos.py），
     所以 320 / 390 / 768 / 桌面各宽度下渲染高度天然相同（80x21 / 103x27.5 / 210x56）。 */
  .client-logo-wrapper {
    padding: 0 7px;
  }
  .client-logo-wrapper .client-logo img {
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
  }

  /* ---------- 5. 点击热区 ≥ 40px ---------- */
  /* 汉堡：原来只有 19×22，手指很难点中 */
  .header-area .mobile-menu-bar .mobile-menu-toggle-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-left: -10px;
  }
  .header-area .mobile-menu-bar .mobile-menu-toggle-btn i {
    font-size: 22px;
    line-height: 1;
  }
  /* 轮播圆点：原来整颗只有 11×11，手指点不中。
     视觉大小保持不变（改大小会破坏选中环），用 ::after 把热区扩到 31×31 */
  .slick-dots li button::after {
    content: "";
    position: absolute;
    inset: -10px;
    border-radius: 50%;
  }
  .slick-dots {
    margin-top: 36px;
    justify-content: center;
  }
  /* 详情页左右翻页箭头 / 社交图标 */
  .product-detail-page .product-share a,
  .social-profile a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    min-height: 36px;
  }

  /* ---------- 6. 悬停才显示的卡片内容：手机上一律常显 ---------- */
  .project-card .main-content .main-content-wrapper {
    transform: none;
    visibility: visible;
    opacity: 1;
  }
  .project-card .main-content .btn-wrapper {
    transform: translate(0, 0);
  }
  .project-card .main-content .btn-wrapper .circle-arrow-btn {
    background-color: #04c68a;
    color: #fff;
  }
  .project-card .main-content .shape svg {
    opacity: 1;
    transform: translate(0, 0);
  }
  /* 卡片高度原来是死值 400px，图片被裁得只剩中间一条；改成按比例 */
  .project-card {
    height: auto;
  }
  .project-card .image {
    position: relative;
    height: 0;
    padding-bottom: 78%;
  }
  .project-card .main-content {
    position: absolute;
    inset: auto 0 0 0;
  }

  /* ---------- 7. 通用按钮：18px/56 → 15px/48 ---------- */
  .theme-btn {
    font-size: 15px;
    line-height: 20px;
    padding: 14px 24px;
  }

  /* ---------- 8. 产品筛选条：单排横向滑动（用户要求整排能滑，不要换行铺满） ----------
     模板在 ≤767 已经是 nowrap + overflow-x:auto，但容器右边界停在 370，
     最后一个胶囊被切在可视区内，看起来像坏图。
     这里让筛选条向右出血到屏幕边缘（容器 padding 是 20，用 -20 抵消），
     滑动区内容在"屏幕外"继续延伸，视觉上是明确的「还有内容」，
     同时隐藏滚动条、给末尾留 20px 内边距，滚到底不会贴边。 */
  .product-filter {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    gap: 8px;
    margin-right: -20px;
    margin-bottom: 24px;
    padding: 0 20px 0 0;
    -webkit-mask-image: none;
    mask-image: none;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .product-filter::-webkit-scrollbar {
    display: none;
  }
  /* 标题分割线到筛选条、筛选条到产品卡：模板叠了
     .section-title 40 + wrapper 18 + .product-filter 42 + .row gy-4 27 ≈ 127px，全收掉 */
  .products-page .section-title {
    margin-bottom: 4px;
  }
  .products-page .section-title .short-title-wrapper {
    padding-bottom: 8px;
    margin-bottom: 16px;
  }
  .products-page .row {
    --bs-gutter-y: 20px;
  }
  /* 按钮外阴影在横向滚动容器里会被 overflow-y:hidden 齐边裁掉，
     变成胶囊下方一条硬边「假阴影」；手机端只保留 1px 描边的内阴影。 */
  .product-filter .filter-btn {
    flex: 0 0 auto;
    gap: 6px;
    padding: 8px 12px 8px 14px;
    font-size: 12.5px;
    line-height: 18px;
    white-space: nowrap;
    box-shadow: inset 0 0 0 1px #e4eae7;
  }
  .product-filter .filter-btn.is-active {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
  }
  .product-card .product-name {
    font-size: 17px;
    line-height: 24px;
  }
  .product-card .product-cat {
    font-size: 12px;
    letter-spacing: 0.06em;
  }
  /* 筛选按钮上的数量角标跟着胶囊一起收 */
  .product-filter .filter-btn span {
    font-size: 10.5px;
    min-width: 20px;
    padding: 1px 5px;
    line-height: 15px;
  }

  /* ---------- 9. 联系卡片（Mobile / Email / Address）：模板 padding 40 + gap 32 + 92px 圆，
     一张卡在手机上就占满一屏 ---------- */
  .icon-card.style-1 {
    padding: 26px 22px;
    gap: 18px;
    border-radius: 22px;
  }
  .icon-card.style-1 .icon {
    width: 64px;
    height: 64px;
  }
  .icon-card.style-1 .icon img {
    max-width: 28px;
    height: auto;
  }
  .icon-card.style-1 .content {
    gap: 10px;
  }
  .icon-card.style-1 .content h3 {
    font-size: 20px;
    line-height: 28px;
  }
  .icon-card.style-1 .content .desc a,
  .icon-card.style-1 .content .desc p {
    font-size: 15px;
    line-height: 24px;
  }

  /* ---------- 9b. 100+ 绿色数据卡（首页 / 关于页的 trusted-user-card） ----------
     右上角那块白色「内凹角」装饰已在全局停用（见 .rectangle-shape 处注释），
     手机端卡片是整行满宽堆在图片下方，更要保持完整圆角。
     这里只收 inner 的 gap:120px（手机上一大片死绿）与内边距。 */
  /* wrapper 原本写死 max-width:366px，390 宽恰好等于容器宽看不出问题，
     但 430 宽起图片是 390 / 440 / 536 / 727，卡片停在 366，
     右边缘比上方图片短 24~361px（截图里就是右侧缺一条）。改成整行满宽。
     父级 .trusted-user-card 在 ≤767 是 align-self:flex-start，宽度按内容收缩，
     只给 wrapper 设 width:100% 会跟着内容走（576 宽实测只有 465.8），
     所以这里把父级一起改成 stretch。 */
  .about-image-card .trusted-user-card {
    align-self: stretch;
  }
  .about-image-card .trusted-user-card .trusted-user-card-wrapper {
    width: 100%;
    max-width: 100%;
  }
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .trusted-user-card-inner {
    gap: 34px;
    padding: 22px 20px 26px;
    border-radius: 24px;
  }
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .trusted-user-card-inner .user-img-wrapper .image {
    width: 44px;
    height: 44px;
    margin-left: -8px;
  }
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .trusted-user-card-inner .user-img-wrapper .image:first-child {
    margin-left: 0;
  }
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .user-review .title {
    font-size: 40px;
    line-height: 1.2;
  }
  .about-image-card .trusted-user-card .trusted-user-card-wrapper .user-review .desc {
    font-size: 15px;
    line-height: 24px;
    margin-top: 6px;
  }

  /* ---------- 9c. 圆形数据卡（our data：35+ / 15 / 10,000m² / 4,000+）----------
     模板在 ≤576 给的是 318×318 死尺寸，一个圆几乎顶满一屏，四个圆竖向吃掉 1400px+，
     而且圆里放长句（尤其德语/俄语译文）会被圆弧切掉。
     这里改成 2×2 圆角卡片：字能换行、四块并排、总高不到原来的四分之一。 */
  .circle-area .circle-shape-wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 12px;
  }
  .circle-area .counter-card.style-1 {
    flex: 1 1 calc(50% - 6px);
    max-width: calc(50% - 6px);
    margin: 0 !important;
    transform: none !important;
    display: flex;
    flex-direction: column;
  }
  .circle-area .counter-card.style-1 .content {
    width: 100%;
    height: 100%;
    min-height: 128px;
    padding: 18px 14px;
    gap: 6px;
    border-radius: 22px;
    justify-content: center;
  }
  .circle-area .counter-card.style-1 .content .number {
    font-size: clamp(23px, 7.4vw, 30px) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.5px !important;
    width: auto;
    max-width: 100%;
  }
  .circle-area .counter-card.style-1 .content .title {
    font-size: 12px;
    line-height: 17px;
    letter-spacing: 0.06em;
  }
  .circle-area .counter-card.style-1 .content .desc {
    font-size: 13px;
    line-height: 19px;
  }

  /* ---------- 10. 跑马灯：左右切边加渐隐，滚动时不会像被裁掉 ---------- */
  .brand-marquee-area {
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 7%, #000 93%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0, #000 7%, #000 93%, transparent 100%);
  }
  .brand-marquee-title {
    font-size: 18px;
  }

  /* ---------- 10b. 新闻详情页「上一篇 / 下一篇」卡片化（2026-11-09） ----------
     模板在 ≤767 只是把两块纵向堆起来，仍然沿用桌面的 padding:30 + gap:20，
     单块高 241px（96px 图 + 5 行粗标题），两块之间还夹着 30px 外边距，
     右对齐的 Next 块标题参差不齐，看着像没排完。
     做法：两块各自做成白底圆角卡（图 64 + 文字两行 + 小号标签），
     图文统一左对齐、垂直居中，标题限 2 行，块间距 10px。 */
  .blog-post-nav {
    flex-direction: column;
    gap: 10px;
    margin: 28px 0 0;
    padding: 0;
    border-top: 0;
  }
  .blog-post-nav .post-navigation,
  .blog-post-nav .post-navigation:last-child {
    width: 100%;
    gap: 12px;
    padding: 12px;
    align-items: center;
    /* 模板在 ≤374 用 !important 把这块改成竖排 + 整宽图，320 宽会变成
       一张 150px 大图压着两行字，跟 390 完全是两套版式；这里拉回横排。 */
    flex-direction: row !important;
    border: 1px solid #eef1ef;
    border-radius: 16px;
    background-color: #fff;
    transition: border-color 0.25s ease-out, box-shadow 0.25s ease-out;
  }
  .blog-post-nav .post-navigation:last-child .text {
    text-align: left;
  }
  .blog-post-nav .post-navigation .post-img {
    width: 64px !important;
    height: 64px !important;
    border-radius: 12px;
  }
  .blog-post-nav .post-navigation .text span a {
    font-size: 11px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 4px 12px;
    margin-bottom: 6px;
    line-height: 16px;
    background-color: #eaf5ef;
    color: #025d45;
  }
  .blog-post-nav .post-navigation .text .post-title {
    font-size: 15px;
    line-height: 21px;
  }
  .blog-post-nav .post-navigation .text .post-title a {
    font-size: 15px;
    line-height: 21px;
    font-weight: 400;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .blog-post-nav .divider {
    display: none;
  }

  /* ---------- 11. 页脚 ---------- */
  /* 手机端精简（2026-11-09）：
     a) Quick links / Socials 两块在小屏纯堆高度（各 4–6 条链接），隐藏；
        页脚内只有这两个 .widget_nav_menu，不影响别处。
     b) 顶部 subscribe 到 logo 之间两处 80px 空档收到 32px：
        实测 390 宽下「Contact 按钮底 → hr」80px、「hr → logo」76px，
        一屏里全是空白，压到 32px 后整段省 92px。 */
  .footer .widget_nav_menu {
    display: none;
  }
  .footer .footer-top-area hr {
    margin-top: 32px;
  }
  .footer .footer-top-area {
    margin-bottom: 32px;
  }
  /* 页脚顶部 80px 在手机上过空（上方就是客户 logo 带），收到 48 */
  .footer .footer-sec {
    padding-top: 48px;
  }
  .footer-top-area .footer-widget-title {
    font-size: 17px;
    line-height: 26px;
    margin-bottom: 14px;
  }
  .footer-area .footer-widget ul li a,
  .footer-widget .footer-widget-info p {
    font-size: 15px;
    line-height: 24px;
  }
  .footer-widget ul li {
    margin-bottom: 6px;
  }
  /* 联系块（页脚 / 产品详情侧栏复用同一套 .footer-contact 结构）：
     里面有邮箱这种长串不可断词，flex 子项 min-width:auto 会顶到最小内容宽，
     320 宽实测把整个文档撑到 362（innerWidth 跟着变，全页被缩小）。
     模板的 overflow:hidden 只写在 .footer-widget 上下文中，侧栏那套没命中，所以这里统一兜住。 */
  .footer-contact ul li,
  .footer-contact .contact-text,
  .footer-contact .contact-text h5,
  .footer-contact .contact-text p,
  .footer-contact .contact-title {
    min-width: 0;
  }
  .footer-contact .contact-text {
    overflow-wrap: anywhere;
    word-break: break-word;
    
  }
  .footer-widget .footer-widget-contact .footer-contact ul li .contact-text span{ font-size: 14px!important;}
  .footer-widget .footer-widget-contact .footer-contact ul li .contact-text a{ font-size: 14px!important;}
  .footer-contact .contact-title {
    overflow-wrap: anywhere;
  }
  .footer-widget .footer-widget-info p{ margin-bottom: 10px;}
  .footer-widget .footer-widget-info .footer-logo{ margin-bottom: 15px;}
  /* 联系块行距：14px 字号配 30px 行高 + 10px 行间距，每行之间近 42px，
     地址折行时更散；行高收到 22、行间距 8、末行归零。 */
  .footer-widget .footer-widget-contact .footer-contact ul li {
    line-height: 22px;
    margin-bottom: 6px;
    gap: 8px;
  }
  .footer-widget .footer-widget-contact .footer-contact ul li:last-child {
    margin-bottom: 0;
  }
  .footer-widget .footer-widget-contact .footer-contact ul li .contact-text,
  .footer-widget .footer-widget-contact .footer-contact ul li .contact-text span,
  .footer-widget .footer-widget-contact .footer-contact ul li .contact-text p,
  .footer-widget .footer-widget-contact .footer-contact ul li .contact-text a {
    font-size: 14px;
    line-height: 22px;
    /* 模板给 span/a 是 inline-block，行盒会多出 ~8px 基线下沉，
       手机上每行实际占 30px；改成 block 后行高才是真正的 22。
       同时去掉页脚链接统一加的 4px 上下热区内边距（这里行高已经是 22）。 */
    display: block;
    padding: 0;
  }
  .footer-widget {
    margin-bottom: 10px;
  }
    .footer-bottom-area .copyright-text p{ font-size: 14px;}
    .footer .footer-top-area .subscribe-footer-widget .subscribe-widget .subscribe-form-widget .description{ margin-bottom: 10px;}
    .footer-widget-title{ margin-bottom: 0;}
    .footer-widget .footer-widget-contact .footer-contact{ margin-top: 0;}
        .footer .footer-top-area .subscribe-footer-widget .subscribe-widget .subscribe-form-title .title {
        font-size: 24px;
        line-height: 32px;
    }
.footer .footer-top-area .subscribe-footer-widget .subscribe-widget{ gap:10px;}


  
  /* 页脚导航链接原来行盒只有 22px 高，手指点容易点空，撑到 32
     （页脚根节点是 .footer.style-1，不是 .footer-area，两套都写上） */
  .footer .footer-widget ul li a,
  .footer-area .footer-widget ul li a,
  .footer-widget .footer-widget-info p a {
    display: inline-block;
    padding: 4px 0;
  }
  .footer-contact .contact-title {
    display: inline-block;
    padding: 2px 0;
  }

  /* 返回顶部按钮：原来距右 40px、直径 50，在 390 宽里会压住正文末行 */
  .scrollup-wrapper {
    right: 16px;
    bottom: 16px;
  }
  .scrollup-btn {
    width: 46px;
    height: 46px;
    font-size: 20px;
  }

  /* 锚点跳转时别被吸顶头部盖住（产品分类从别的页面跳过来会用到） */
  [id] {
    scroll-margin-top: 96px;
  }

  /* ---------- 12. 侧滑抽屉 ----------
     模板给的是固定 350px（≤560）+ padding 40，320 宽手机上抽屉比屏幕还宽，
     左边被推出屏幕、右边露出滚动条白边。改成跟视口挂钩。 */
  .menu-sidebar-area {
    width: min(350px, 88vw);
    scrollbar-width: none;
  }
  .menu-sidebar-area::-webkit-scrollbar {
    display: none;
    width: 0;
  }
  .menu-sidebar-area .menu-sidebar-wrapper {
    padding: 26px 22px 36px;
  }
  .menu-sidebar-area .menu-sidebar-close {
    top: 22px;
    right: 22px;
  }
  .menu-sidebar-area .menu-sidebar-logo {
    width: 156px;
  }
  .menu-sidebar-area .header-contact-info span {
    font-size: 15px;
    line-height: 24px;
  }
  .menu-sidebar-area .social-profile a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    min-height: 36px;
  }

  /* ---------- 13. 联系表单字号（2026-11-09） ----------
     模板给的是 18px/32、输入框 60px 高；390 宽下框内宽只有 315，18px 的
     占位文字比全站 16px 正文还大，视觉上「一个字顶两个」。降到 15px，
     框高 60 → 52、左右内边距 20 → 16 保持比例；多行留言同款处理。
     提交按钮 20px → 17px（模板 .contact-form-area .comment-respond .theme-btn
     的特异性高于通用 .theme-btn，必须在同层级覆盖）。 */
  .contact-form-area .comment-respond input,
  .contact-form-area .comment-respond select,
  .contact-form-area .comment-respond textarea,
  .contact-form-area .comment-respond *::placeholder {
    font-size: 15px;
  }
  .contact-form-area .comment-respond input,
  .contact-form-area .comment-respond select {
    height: 52px;
    padding: 0 16px;
    line-height: 22px;
  }
  .contact-form-area .comment-respond textarea {
    padding: 14px 16px;
    line-height: 24px;
  }
  .contact-form-area .comment-respond .contacts-message {
    height: 128px;
  }
  .contact-form-area .comment-respond .theme-btn {
    font-size: 17px;
    line-height: 24px;
    padding: 13px 28px;
  }

  /* ---------- 14. About 页「About us」分割线 → 大标题的间距（2026-11-09） ----------
     实测分割线到下划线底部 → h2 顶部是 44px（.short-title-wrapper 的 18px
     margin-bottom + .company-profile-head 的 26px 叠加），手机上显得断层，
     收到 18px。 */
  .company-profile-head {
    margin-bottom: 18px;
  }
  .company-profile-head .short-title-wrapper {
    margin-bottom: 0;
  }
  /* 图片 → 绿色副标题（2026-11-10）：.row.gy-5 的 --bs-gutter-y 是 3rem（根字号 18px
     → 54px），单列堆叠后图和正文之间固定空 54px，用户反馈偏大。收到 24px。 */
  .company-profile-area .row {
    --bs-gutter-y: 24px;
  }

  /* ---------- 15. 联系表单蓝底块：跟着内容走（2026-11-09） ----------
     底色块 .shape-overlay 是绝对定位 + 写死高度（.contact-form-area.style-2 在
     ≤767 是 1150px），表单内容一变就露出大片多余蓝边（实测按钮下方空了 114px）。
     改成把定位上下文提到 .container，让色块 top:0 / bottom:0 自撑满整个内容高度，
     再把 .comment-respond 的 40px 下外边距收到 28，作为卡片自身的底部留白。 */
  .contact-form-area .container {
    position: relative;
  }
  .contact-form-area .shape-overlay-wrapper {
    position: static;
  }
  /* 2026-11-10：不只 .style-2，advantages / certification 的 .contact-form-area
     也是同一结构、同一张写死高度的蓝底（手机端 1050px），内容短的时候蓝底直接
     溢出到下面的客户 logo 分隔线后面。所以这里去掉 .style-2 限定，全站统一。 */
  .contact-form-area .shape-overlay-wrapper .shape-overlay {
    top: 0;
    bottom: 0;
    height: auto;
    /* .container 在手机端是全宽的（20px 留白加在行/列上），所以这里要自己内缩 20px，
       否则底色块会通到屏幕两边 */
    left: 20px;
    right: 20px;
    width: auto;
  }
  .contact-form-area .comment-respond {
    margin-bottom: 28px;
  }

  /* ---------- 16. 首页 hero「35 years」统计卡：字号与卡片一起收（2026-11-09） ----------
     模板 ≤576 是 230x100 固定盒子配 36px/34.8 的数字，数字几乎顶满卡片宽度、
     底下「Industry experience」被挤到卡片边缘。按比例缩到 210x86 + 26px 数字。 */
  .slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom .review-card {
    width: 210px;
    height: 86px;
    padding: 12px 20px;
    border-radius: 20px;
  }
  .slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom .review-card .title {
    font-size: 26px;
    line-height: 30px;
    letter-spacing: -0.4px;
  }
  .slider-area.style-2 .single-slider-wrapper .sticky-shape-bottom .review-card .desc {
    font-size: 13px;
    line-height: 18px;
  }

  /* ---------- 17. 入场动画不再做左右位移（2026-11-09） ----------
     现象：手机上下滑，吸顶头部会突然变宽 / 右侧露出一条空白，整页像被缩小。
     根因：wow.js 只在元素进入视口时才播放动画，animate.css 的
     fadeInRight / fadeInLeft 起始帧是 translateX(±60px)，配合
     animation-fill-mode: both，未播放的元素会一直停在起始帧上，
     把文档撑宽 60px（390 → 450）。手机上 Chrome 会按文档宽度重新算视口
     （innerWidth 390 → 450），而吸顶头部是 position:fixed、宽度跟着视口走，
     于是头比屏幕宽、右侧多出一条空白 —— 只在滚动到这些区块时才出现，所以
     看着像"下滑才出问题"。
     处理：手机上把这两个动画换成纯淡入（保留"进场"手感，去掉横向位移）。
     不要再改回带 translateX 的 keyframes，否则这个 bug 会回来。
     注意：不能改成 html{overflow-x:hidden/clip} 去裁，会让 scrollY 恒为 0、
     吸顶头部和回到顶部全部失效（2026-11-06 已踩过）。 */
  .animate__fadeInRight,
  .animate__fadeInLeft {
    animation-name: ytFadeInOnly !important;
  }

  /* ---------- 18. 首页「OUR ADVANTAGES」滑块：箭头 → 第一张卡片 的间距收紧（2026-11-10）----------
     .section-title 自带 margin-bottom:26，而 .info-card-slider-area 又被第 4 节
     统一压了 padding-top:32，两段叠在箭头按钮底下空了 58px（用户截图红框处）。
     这里只针对 .feature-area.style-1 这一块，收成 8 + 10 = 18px；
     不要动全局 .section-title 的 26，其他区块的标题还靠它和正文拉开。 */
  .feature-area.style-1 .section-title {
    margin-bottom: 8px;
  }
  .feature-area.style-1 .info-card-slider-area {
    padding-top: 10px !important;
  }

  /* ---------- 19. 页脚版权上方的「Contact Us」手机端去掉（2026-11-10）----------
     桌面它排在版权右侧（.footer-bottom-menu），手机上因为 flex-wrap-reverse
     掉到版权上面单独占一行，用户要求去掉。桌面端保持不动。 */
  .footer .footer-bottom-menu {
    display: none;
  }

  /* ---------- 20. 首页 CTA 绿卡 + Extraction Workshop 卡：文字整体收一档（2026-11-10）----------
     用户反馈这两块字太大。绿卡里 h4 跟着第 3 节统一成了 24px、数字是 13.5vw
     （390 宽实测 52.6px/60.5 行高）、「Partner Clients」原来 20px；右边卡标题
     .info-card.style-3 .title 是模板自带 30px，比全站 h2 的 24px 还大。
     这两块全站只有 index.html 各一处，可以放心单独收：19 / 38 / 22。
     数字继续用 clamp 跟屏宽走（320 宽约 32px），避免又出现"某个宽度顶到边"。 */
  .cta-area.style-1 .section-title h4.title {
    font-size: 19px !important;
    line-height: 1.32 !important;
  }
  .cta-area.style-1 .section-title .number {
    font-size: clamp(30px, 10vw, 40px) !important;
    line-height: 1.12 !important;
  }
  .info-card.style-3 .title {
    font-size: 22px !important;
    line-height: 1.35 !important;
  }
}

/* CTA 区块（首页绿卡 + Extraction Workshop 卡）在 ≤1199 都是整宽堆叠
   （右侧 col-xl-4 要到 1200 才和左边并排），这里处理两处空白： */
@media only screen and (max-width: 1199px) {
  /* 1) 卡片内部：.info-card-inner 是 justify-content:space-between + gap:100px
        （≤991 还专门加到 100），desc 和 View More 之间空出一条 100px 的带子
        （用户标注「留的太高了」）。收到 24。1200 以上两栏并排、三卡等高，保持不动。 */
  .info-card.style-3 .info-card-inner {
    gap: 24px;
  }
  /* 2) 卡片下方：.cta-area 的 32/60/80 padding-bottom 会和下一区块的 padding-top
       叠成 64–150px（用户标注「间距问题」）。按第 4 节里 .about-us-area /
       .contact-info-area 的老办法把本区块底部归零，空白交给兄弟区块的 padding-top。 */
  .cta-area.style-1 {
    padding-bottom: 0 !important;
  }
}

/* 平板（768~991）同样处理：同一批 fadeInRight 元素在 768 宽下仍会把文档
   撑到 804（+36px），吸顶头部照样露白条。手机那段在 ≤767 已覆盖，
   这里补 768~991 一段，两段共用上面同一个 keyframes。 */
@keyframes ytFadeInOnly {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@media only screen and (max-width: 991px) {
  .animate__fadeInRight,
  .animate__fadeInLeft {
    animation-name: ytFadeInOnly !important;
  }
}

/* ≤355：头部 logo 170px 会把语言按钮压住（320 宽实测重叠 31px），按断点收窄 */
@media only screen and (max-width: 355px) {
  .header-area .logo img {
    width: 142px;
  }
  .header-area .mobile-menu-bar .mobile-menu-toggle-btn {
    width: 36px;
    height: 36px;
  }
  .lang-trigger {
    padding-left: 7px;
    padding-right: 8px;
  }
  
  
  
  
}


@media (max-width: 800px){
	.menu-sidebar-area .menu-sidebar-content .menu-sidebar-single-widget .header-contact-info span{ font-size: 15px;}
	.menu-sidebar-area .menu-sidebar-content .menu-sidebar-single-widget .header-contact-info span a{ font-size: 15px;}
	.mean-container .mean-nav ul li a{ font-size: 15px;}
	.menu-sidebar-area .menu-sidebar-content .menu-sidebar-single-widget .menu-sidebar-title{ font-size: 18px;}
	.footer-widget-title{ font-size: 20px;}
	.footer-bottom-area .footer-bottom-wrapper{padding: 6px 0;}
	.footer .footer-top-area .subscribe-footer-widget .subscribe-widget .subscribe-form-widget .description{ font-size: 15px; line-height: 20px;}
	
	.subscribe-form-widget .submit-btn{ font-size: 15px;padding: 8px 32px;}
	.footer .footer-sec {
        padding-top: 25px;
    }
    .footer .footer-top-area hr {
        margin-top: 20px;
    }
    .project-card .main-content .main-content-wrapper .title{ font-size: 20px;}
    .cert-area .section-title .cert-intro{font-size: 16px;
    line-height: 22px;max-width: 100%;}
    .page-breadcrumb-area .page-title{ font-size: 22px;}
    .breadcrumb-list ul li a{ font-size: 15px;}
    .info-card.style-1 .content-wrapper .desc{ font-size: 14px; line-height: 20px; margin-bottom: 20px;}
    .info-card .title{ font-size: 21px;}
	.flip-image-card .box-item-content .name{ font-size: 24px;}
	.flip-image-card .box-item-content .desc{max-width: 100%;font-size: 15px;
    line-height: 22px;}
    
    .post-comments-title h2{font-size: 22px;
        line-height: 33px;}
   
    .contact-form-area .image{height: 313px;
        margin: 24px auto;}
        .contact-form-area{ margin-top: -40px;}
        .info-card .desc {
        font-size: 15px;
        line-height: 23px;
        margin-top: 10px;
    }
    .info-card-wrapper .title {
    margin-top: 12px;
}
.company-profile-text p {
        font-size: 15px;
        line-height: 25px;
    }
.section-title .sec-content .title{ margin-bottom: 10px!important;}
.about-info-card .section-title {
    margin-bottom: 20px;
}
.slider-area.style-1 .section-title .sec-desc {
        margin-top: 8px;
    }
    .slider-area.style-1 {
        padding-top: 20px;
    }
    .post-card .post-meta .single-post-meta{ font-size: 15px;}

    
    
}