/* ====================================================================
Multimax - 单页视差滚动
======================================================================= 
 主题名称: MULTIMAX
 主题URI: http://
 描述: 多用途单页模板
 作者: gecdesigns
*/

/*=================================================
 == 目录

    1. 字体排版 
    2. 全局样式
    3. 导航
    4. 页头    
    5. 关于我们
    6. 关于我们列表
    7. 技能
    8. 服务
    9. 统计
    10. 作品集
    11. 团队
    12. 准备开始
    13. 价格
    14. 流程
    15. 客户评价
    16. 博客
    17. 客户
    18. 联系我们
    19. 页脚

*/
/*---------------------------------------
  1. 字体排版                
-----------------------------------------*/
/* 字体 */
@import url("https://fonts.googleapis.com/css?family=Lato|Montserrat|Poppins");
/* --------------------------------------
  2. 全局样式
-----------------------------------------*/
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

html {
  box-sizing: border-box;
  font-size: 62.5%; }

/*------ 宽度 < 75em ------*/
@media only screen and (max-width: 75em) {
  html {
    font-size: 56.25%; } }

/*------ 宽度 < 61.94em ------*/
@media only screen and (max-width: 61.94em) {
  html {
    font-size: 53.13%; } }

/*------ 宽度 < 48em ------*/
@media only screen and (max-width: 48em) {
  html {
    font-size: 50%; } }

body {
  font-family: "Poppins", sans-serif;
  color: #353434;
  font-size: 1.6rem;
  background-color: #fff;
  line-height: 1.6;
  letter-spacing: .08rem;
  font-weight: 400; }

.heading-primary {
  font-size: 4.8rem;
  font-weight: 500;
  font-family: 'Poppins', sans-serif; }

.heading-secondary {
  font-size: 2rem;
  letter-spacing: 2px;
  margin: 2rem 0;
  font-family: 'Lato', sans-serif; }

.heading-tertiary {
  font-size: 2.2rem;
  font-weight: 700;
  font-family: 'Montserrat', sans-serif; }

p {
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #353434;
  line-height: 1.8;
  margin: 1rem 0; }

ul,
ol {
  padding: 0;
  margin: 0; }

li {
  list-style: none; }

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

a,
a:hover,
a:focus,
a:active {
  text-decoration: none;
  outline: none;
  color: #353434; }

button,
button:hover,
button:focus,
button:active {
  text-decoration: none;
  outline: none; }

.padding {
  padding: 120px 0;
  position: relative; }

/*------------ 预加载器 --------*/
#loader-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
  overflow: hidden; }

.no-js #loader-wrapper {
  display: none; }

#loader {
  position: relative;
  top: 50%;
  margin: 0 auto;
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  border: .2rem solid transparent;
  border-color: #fff;
  z-index: 1000;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22); }

#loader:before {
  content: "";
  position: absolute;
  top: .5rem;
  left: .5rem;
  right: .5rem;
  bottom: .5rem;
  border-radius: 50%;
  border: .2rem solid transparent;
  border-top-color: #001942;
  -webkit-animation: spin 1s linear infinite;
  animation: spin 1s linear infinite; }

#loader:after {
  content: "";
  position: absolute;
  top: 1.5rem;
  left: 1.5rem;
  right: 1.5rem;
  bottom: 1.5rem;
  border-radius: 50%;
  border: .2rem solid transparent;
  border-top-color: #001942;
  -webkit-animation: spin 1s linear infinite;
  animation: spin 1s linear infinite; }

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

#loader-wrapper .loader-section {
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  z-index: 999; }

#loader-wrapper .loader-section.section-left {
  left: 0; }

#loader-wrapper .loader-section.section-right {
  right: 0; }

/* Loaded styles */
.loaded #loader-wrapper .loader-section.section-left {
  -webkit-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  transform: translateX(-100%);
  -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  -o-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); }

.loaded #loader-wrapper .loader-section.section-right {
  -webkit-transform: translateX(100%);
  -ms-transform: translateX(100%);
  transform: translateX(100%);
  -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  -o-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); }

.loaded #loader {
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out; }

.loaded #loader-wrapper {
  visibility: hidden;
  -webkit-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition: all 0.3s 1s ease-out;
  -o-transition: all 0.3s 1s ease-out;
  transition: all 0.3s 1s ease-out; }

/*----------------- BUTTON STYLE----------------- */
.button:link,
.button:visited {
  margin: 10px auto 0;
  padding: 14px 15px;
  color: #353434;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  overflow: hidden;
  letter-spacing: .08em;
  border-radius: .2rem;
  -webkit-text-shadow: 0 0 1px rgba(0, 0, 0, 0.2), 0 1px 0 rgba(0, 0, 0, 0.2);
  text-shadow: 0 0 1px rgba(0, 0, 0, 0.2), 0 1px 0 rgba(0, 0, 0, 0.2);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease; }

.button.btn-hover {
  cursor: pointer;
  position: relative;
  border: 2px solid #F7CA18;
  -webkit-transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s;
  transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; }

.button.btn-hover:hover {
  color: #000 !important;
  background-color: transparent;
  text-shadow: inherit; }

.button.btn-hover:hover:before {
  left: 0%;
  right: auto;
  width: 100%; }

.button.btn-hover:before {
  display: block;
  position: absolute;
  top: 0px;
  right: 0px;
  height: 100%;
  width: 0px;
  z-index: -1;
  content: '';
  color: #000 !important;
  background: #F7CA18;
  -webkit-transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s;
  transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s; }

/*------ Scroll to Top------- */
#scroll-to-top {
  cursor: pointer;
  position: fixed;
  bottom: 20px;
  right: 20px;
  border-radius: 50%;
  display: none;
  z-index: 9;
  background: #001942;
  color: #fff;
  transition: all .3s;
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  -o-transition: all .3s;
  -ms-transition: all .3s; }

#scroll-to-top i {
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  width: 35px;
  height: 35px;
  line-height: 1; /* 重置行高，使用flexbox居中 */
  font-size: 14px;
  color: #fff; }

#scroll-to-top:hover {
  background: #fff;
  color: #001942;
  box-shadow: 0 0.5em 0.5em -0.4em #3999f2; }

/*------- hr style------ */
.hr-title {
  display: flex;
  flex-direction: row;
  align-items: center; }

.headerhr {
  flex-grow: 1;
  height: 1px;
  margin: 0 0 0 1rem;
  background-color: rgba(53, 52, 52, 0.2); }

/* --------------------------------------
  3. NAVIGATION
-----------------------------------------*/
.navbar {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  border: 0;
  background: transparent;
  z-index: 99;
  min-height: 70px;
  font-family: "Poppins", sans-serif;
  border-bottom: 0.5px solid rgba(255, 255, 255, 0.6);
  transition: all 0.3s ease; }

.navbar-brand .logo {
  width: 70%;
  height: 70%;
  margin-left: 2rem; }

.navbar .icon-bar {
  color: #353434;
  margin-right: 15px;
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
}

.navbar .icon-bar i {
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  line-height: 1; /* 重置行高，使用flexbox居中 */
}

.navbar .navbar-nav .active {
  color: #3999f2 !important; }

.navbar-collapse .navbar-nav .nav-link {
  text-align: center;
  color: #000;
  padding: 10px;
  margin: 1rem;
  font-weight: 500;
  letter-spacing: .5px; }

.nav-scroll {
  background: #fff;
  transition: background-color .5s ease 0s;
  position: fixed;
  top: -100px;
  left: 0;
  width: 100%;
  -webkit-transition: -webkit-transform .5s;
  transition: -webkit-transform .5s;
  transition: transform .5s;
  transition: transform .5s, -webkit-transform .5s;
  -webkit-transform: translateY(100px);
  transform: translateY(100px);
  -webkit-box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.05);
  box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.05); }

.nav-scroll .icon-bar {
  color: #353434;
  margin-right: 15px; }

.nav-scroll .navbar-nav .active {
  color: #3999f2 !important; }

/* 固定导航栏滚动效果 */
.navbar.navbar-scrolled {
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(10px) !important;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1) !important;
  border-bottom: 0.5px solid rgba(0, 0, 0, 0.1) !important;
}

.navbar.navbar-scrolled .navbar-nav .nav-link {
  color: #000 !important;
  font-weight: 600 !important;
}

.navbar.navbar-scrolled .navbar-brand {
  color: #000 !important;
  font-weight: 600 !important;
}

.navbar.navbar-scrolled .icon-bar {
  color: #000 !important;
}

.navbar.navbar-scrolled .language-switch {
  color: #000 !important;
  font-weight: 600 !important;
}

/* 为固定导航栏调整页面布局 */
body {
  padding-top: 0; /* 移除body的顶部间距 */
}

.home {
  margin-top: 0; /* 移除home的负边距 */
  padding-top: 0; /* 移除home的顶部间距 */
  position: relative;
  z-index: 1;
}

/* 导航栏样式 - 非首页时默认有背景 */
.navbar {
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(10px) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
}

.navbar .navbar-nav .nav-link {
  color: #000 !important;
  text-shadow: none !important;
  font-weight: 600 !important;
}

.navbar .navbar-brand {
  color: #000 !important;
  font-weight: 600 !important;
}

.navbar .icon-bar {
  color: #000 !important;
}

.navbar .language-switch {
  color: #000 !important;
  border-color: rgba(0, 0, 0, 0.3) !important;
  font-weight: 600 !important;
}

/* 首页特殊样式 - 透明背景白色文字 */
body.home .navbar {
  background: transparent !important;
  border-bottom: 0.5px solid rgba(255, 255, 255, 0.3) !important;
  box-shadow: none !important;
}

body.home .navbar .navbar-nav .nav-link {
 
  text-shadow: 1px 1px 2px rgba(0,0,0,0.5) !important;
}

body.home .navbar .navbar-brand {
  /* color: #fff !important; */
}

body.home .navbar .icon-bar {
  /* color: #fff !important; */
}

body.home .navbar .language-switch {
  /* color: #fff !important; */
  border-color: rgba(255,255,255,0.3) !important;
}

/*------ width < 991px ------*/
@media (max-width: 991px) {
  .navbar-collapse {
    background: #fff; }  }

/*------- line ---------*/
.line li a {
  position: relative; }

.line li a:after {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 0%;
  content: '.';
  color: transparent;
  background: #000;
  height: 1px;
  -webkit-transition: all .5s;
  transition: all .5s; }

.nav-scroll .line li a:after {
  background: #001942; }

.line li a:hover:after {
  width: 100%; }

/* 语言切换按钮样式 */
.language-switch {
  background: none;
  border: none;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 5px;
}

.language-switch:hover {
  color: #3999f2 !important;
}

.language-switch .fa-globe {
  font-size: 14px;
}

.language-switch .lang-text {
  font-weight: 500;
  letter-spacing: .5px;
}

/*---------------------------------------
  4. HEADER                
-----------------------------------------*/

/*--------------home-------------------*/
.home {
  background: #fff;
  
  width: 100%;
  position: relative; }

/*----slideWiz slideslow-----*/
.slideWiz {
  position: relative;
  z-index: 1;
  margin-top: 0;
  padding-top: 0;
}

.home .btn {
  padding: 14px 15px;
  background: #fff;
  color: #001942;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  overflow: hidden;
  letter-spacing: .08em;
  border-radius: 0; }

.home .main-image-box {
  width: 250px;
  height: 200px;
  margin-top: 60px;
  right: 5%; }

.home .detail-box {
  background: rgba(255, 255, 255, 0.7);
  background: -moz-linear-gradient(top, rgba(53, 52, 52, 0) 0%, white 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(53, 52, 52, 0)), color-stop(100%, white));
  background: -webkit-linear-gradient(right, rgba(53, 52, 52, 0) 0%, white 100%);
  background: -o-linear-gradient(right, rgba(53, 52, 52, 0) 0%, white 100%);
  background: -ms-linear-gradient(right, rgba(53, 52, 52, 0) 0%, white 100%);
  background: linear-gradient(to left, rgba(53, 52, 52, 0) 0%, white 100%); }

.home .detail-title {
  font-family: "Poppins", sans-serif;
  font-size: 6rem;
  font-weight: 700;
  color: #001942;
  margin: 2px; }

.home .detail-desc {
  font-family: "Poppins", sans-serif;
  font-size: 3rem;
  color: #353434;
  margin-bottom: 2px; }

.home .half-circle-next,
.home .half-circle-prev {
  z-index: 3;
  opacity: 0;
  background: rgba(0, 25, 66, 0.5);
  transition: all .3s;
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  -o-transition: all .3s;
  -ms-transition: all .3s; }

.home .half-circle-next:hover,
.home .half-circle-prev:hover {
  opacity: 1; }

/*------ width < 991px ------*/
@media (max-width: 991px) {
  .home .main-image-box {
    display: none; }
  .home .detail-box {
    width: 100%; } }

/*------ width < 768px------*/
@media (max-width: 768px) {
  .home .detail-box {
    width: 90%; } }


/* --------------------------------------
  5. ABOUT
-----------------------------------------*/
.about .hr-title h2 {
  flex-grow: 0; }

.about .about-content {
  padding-left: 50px; }

/*------ width < 991px ------*/
@media (max-width: 991px) {
  .about .about-content {
    padding-left: 15px; } }

/*------ width < 600px ------*/
@media (max-width: 600px) {
  .about .about-content {
    margin-top: 20px; } }

/* ========================================
  移动端优化样式
======================================== */

/* 移动端基础优化 */
@media (max-width: 768px) {
  /* 字体大小调整 */
  .heading-primary {
    font-size: 3.2rem !important;
  }
  
  .heading-secondary {
    font-size: 1.6rem !important;
  }
  
  .heading-tertiary {
    font-size: 1.8rem !important;
  }
  
  /* 间距调整 */
  .padding {
    padding: 60px 0 !important;
  }
  
  /* 容器内边距 */
  .container {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  
  /* 导航栏优化 */
  .navbar {
    min-height: 50px !important;
  }
  
  /* .navbar-brand .logo {
    height: 35px !important;
  } */
  
  /* 首页banner优化 */
  .home .detail-title {
    font-size: 3.5rem !important;
  }
  
  .home .detail-desc {
    font-size: 1.8rem !important;
  }
  
  /* 关于我们区域优化 */
  .about .about-content {
    padding-left: 0 !important;
    text-align: center !important;
  }
  
  .about .col-lg-6.order-first.order-lg-last {
    margin-bottom: 30px !important;
  }
  
  /* 关于我们列表优化 */
  .about-list .about-item {
    margin-bottom: 20px !important;
  }
  
  .about-list .about-item .text-center {
    padding: 20px 15px !important;
  }
  
  .about-list .about-item .icon {
    width: 80px !important;
    height: 80px !important;
    line-height: 80px !important;
    font-size: 30px !important;
  }
  
  /* 服务区域优化 */
  .services .content-box {
    margin-bottom: 30px !important;
    padding: 20px 15px !important;
  }
  
  /* 统计区域优化 */
  .counts .count-item {
    margin-bottom: 30px !important;
  }
  
  .counts .counter .count {
    font-size: 2.5rem !important;
  }
  
  /* 作品集优化 */
  .portfolio .port-title h2 {
    font-size: 2.5rem !important;
  }
  
  .portfolio .port-title p {
    font-size: 1rem !important;
  }
  
  .portfolio .simplefilter {
    flex-wrap: wrap !important;
    justify-content: center !important;
  }
  
  .portfolio .simplefilter li {
    margin: 5px !important;
    font-size: 0.9rem !important;
  }
  
  /* 流程区域优化 */
  .process .p-list {
    margin-bottom: 30px !important;
    text-align: center !important;
  }
  
  /* 博客区域优化 */
  .blog .blog-item {
    margin-bottom: 30px !important;
  }
  
  .blog .blog-img {
    height: 200px !important;
  }
  
  /* 联系表单优化 */
  .contact .info {
    margin-bottom: 30px !important;
  }
  
  .contact .info li {
    margin-bottom: 20px !important;
    text-align: center !important;
  }
  
  .contact-form .form-group {
    margin-bottom: 15px !important;
  }
  
  /* 按钮优化 */
  .button.btn-hover {
    padding: 12px 20px !important;
    font-size: 0.9rem !important;
  }
  
  /* 返回顶部按钮优化 */
  #scroll-to-top {
    right: 15px !important;
    bottom: 15px !important;
    width: 40px !important;
    height: 40px !important;
  }
  
  #scroll-to-top i {
    font-size: 16px !important;
    line-height: 40px !important;
  }
}

/* 超小屏幕优化 */
@media (max-width: 480px) {
  .heading-primary {
    font-size: 2.8rem !important;
  }
  
  .heading-secondary {
    font-size: 1.4rem !important;
  }
  
  .heading-tertiary {
    font-size: 1.6rem !important;
  }
  
  .padding {
    padding: 40px 0 !important;
  }
  
  .home .detail-title {
    font-size: 3rem !important;
  }
  
  .home .detail-desc {
    font-size: 1.5rem !important;
  }
  
  .about-list .about-item .text-center {
    padding: 15px 10px !important;
  }
  
  .about-list .about-item .icon {
    width: 70px !important;
    height: 70px !important;
    line-height: 70px !important;
    font-size: 25px !important;
  }
  
  .services .content-box {
    padding: 15px 10px !important;
  }
  
  .counts .counter .count {
    font-size: 2rem !important;
  }
  
  .portfolio .simplefilter li {
    font-size: 0.8rem !important;
    padding: 8px 12px !important;
  }
  
  .contact .info li {
    padding: 0 10px !important;
  }
  
  .button.btn-hover {
    padding: 10px 16px !important;
    font-size: 0.85rem !important;
  }
}

/* 横屏模式优化 */
@media (max-width: 768px) and (orientation: landscape) {
  .home {
    height: 100vh !important;
  }
  
  .slideWiz {
    height: 100vh !important;
  }
  
  .padding {
    padding: 40px 0 !important;
  }
}

/* --------------------------------------
  6. ABOUT-LIST
-----------------------------------------*/
.about-list {
  /* 移除灰色背景图片 */
  background: none; }

/* 确保行容器使用flexbox布局 */
.about-list .row {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch; /* 确保所有卡片高度一致 */
}

/* 确保卡片容器使用flexbox */
.about-list .about-item {
  display: flex;
  flex-direction: column;
  height: 100%; /* 确保卡片占满容器高度 */
}

.about-list .about-item .text-center {
  margin: .5rem;
  padding: 30px 30px;
  background: #fff;
  display: flex; /* 使用flexbox布局 */
  flex-direction: column; /* 垂直排列 */
  align-items: center; /* 水平居中 */
  justify-content: flex-start; /* 从顶部开始排列 */
  height: 100%; /* 占满容器高度 */
  text-align: center; /* 文本居中 */
}

.about-list .about-item .text-center:hover {
  -webkit-box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.2);
  position: relative;
  z-index: 3;
  -webkit-transition: all .4s;
  transition: all .4s; }

.about-list .about-item:hover .icon {
  color: #fff; }

.about-list .about-item:hover .icon:after {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1); }

.about-list .about-item .icon {
  width: 100px;
  height: 100px;
  line-height: 1; /* 重置行高，使用flexbox居中 */
  color: #F7CA18;
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  font-size: 40px;
  margin-bottom: 15px;
  position: relative;
  z-index: 3;
  background-color: #fff;
  background: -webkit-gradient(linear, left top, right bottom, from(#3999f2), to(#001942));
  background: linear-gradient(to bottom right, #3999f2, #001942);
  border-radius: 10px 0px 200px 200px;
  -moz-border-radius: 10px 0px 200px 200px;
  -webkit-border-radius: 10px 0px 200px 200px; }

.about-list .about-item .icon:after {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  border: 2px solid #F7CA18;
  top: 0;
  right: 0;
  background-color: #fff;
  background: -webkit-gradient(linear, left top, right bottom, from(#001942), to(#3999f2));
  background: linear-gradient(to bottom right, #001942, #3999f2);
  border-radius: 10px 0px 200px 200px;
  -moz-border-radius: 10px 0px 200px 200px;
  -webkit-border-radius: 10px 0px 200px 200px;
  z-index: -1;
  -webkit-transform: scale(0, 0);
  transform: scale(0, 0);
  -webkit-transition: all .4s;
  transition: all .4s; }

.about-list .about-item h5 {
  font-weight: 500;
  font-size: 18px;
  margin-bottom: 10px; }

.about-list .about-item h6 {
  color: #001942;
  font-size: 12px;
  font-weight: 400;
  margin-bottom: 20px; }

.about-list .about-item p {
  flex-grow: 1; /* 让描述文本占据剩余空间 */
  margin-bottom: 0; /* 移除底部边距 */
}

/*------ width < 991px ------*/
@media (max-width: 991px) {
  .about-list .text-center p {
    padding: 0 10px; } }

/* --------------------------------------
  7. SKILLS
-----------------------------------------*/
.skills {
  background: url("../img/skill-bg.png") no-repeat center;
  background-size: cover; }

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

@media (max-width: 991px) {
  .skills-left {
    text-align: center; } }

.skills .content .skill .progress-item {
  margin-top: 30px; }

.skills .content .skill h6 {
  font-size: 14px;
  font-weight: 400;
  color: #000;
  position: relative;
  margin-bottom: 1rem; }

.skills .content .skill .skills-progress {
  width: 100%;
  padding: 8px;
  border-radius: 20px;
  background: #fff;
  -webkit-box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.25);
  box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.25);
  position: relative; }

.skills .content .skill .skills-progress span {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 10%;
  border-radius: 20px;
  background-color: #353434;
  background-size: 5rem 5rem;
  -webkit-transition: all 1s;
  transition: all 1s; }

.skills .content .skill .skills-progress span:after {
  content: attr(data-value);
  position: absolute;
  float: right;
  right: 10px;
  font-size: 11px;
  color: #fff; }

.skills .skills-progress {
  background-color: #353434; }

.skills .content .skill .skills-progress span {
  background: #001942;
  background: -moz-linear-gradient(left, rgba(57, 153, 242, 0.8) 10%, rgba(0, 25, 66, 0.85) 100%);
  background: -webkit-linear-gradient(left, rgba(57, 153, 242, 0.8) 10%, rgba(0, 25, 66, 0.85) 100%);
  background: linear-gradient(to left, rgba(57, 153, 242, 0.8) 10%, rgba(0, 25, 66, 0.85) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba($color-secondary, 0.8)',endColorstr='rgba($color-primary, 0.85)',GradientType=0 ); }

/* --------------------------------------
  8. SERVICES
-----------------------------------------*/
.services {
  /* background: url("../img/service-bg.png") no-repeat center; */
  background-size: cover; }

/* 确保服务行容器使用flexbox布局 */
.services .row {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch; /* 确保所有卡片高度一致 */
  margin: 0 -15px; /* 重置默认边距 */
}

/* 确保服务卡片容器使用flexbox */
.services .col-lg-4,
.services .col-md-6,
.services .col-sm-12 {
  display: flex;
  flex-direction: column;
  padding: 0 15px; /* 添加列间距 */
  margin-bottom: 30px; /* 添加行间距 */
}

.content-box {
  display: flex; /* 使用flexbox布局 */
  flex-direction: column; /* 垂直排列 */
  height: 100%; /* 占满容器高度 */
  background: #fff;
  padding: 40px 30px;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
  margin: 0; /* 移除默认边距 */
}

.content-box:hover {
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
  transform: translateY(-5px);
}

/* 确保标题区域固定高度 */
.content-box .hr-title {
  flex-shrink: 0; /* 防止收缩 */
  margin-bottom: 20px;
}

.hr-title .outer-circle {
  flex-grow: 0; }

.content-box-icon i {
  width: 100px;
  height: 100px;
  line-height: 1; /* 重置行高，使用flexbox居中 */
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  font-size: 4rem;
  text-align: center;
  color: #353434;
  position: relative;
  border-radius: 50%;
  margin: 0 auto; /* 确保图标容器居中 */
}

.outer-circle {
  background-image: linear-gradient(#001942, #3999f2, #001942);
  width: 100px;
  height: 100px;
  border-style: solid;
  border-color: transparent;
  border-radius: 50%;
  border-width: 0;
  -webkit-animation: rotateCircle 2s linear infinite;
  animation: rotateCircle 2s linear infinite;
  padding: 2px;
  display: flex; /* 使用flexbox确保内容居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  margin: 0 auto; /* 确保外圆居中 */
}

.outer-circle .inner-circle {
  background: #fff;
  height: 100px;
  width: 100px;
  border-style: solid;
  border-color: transparent;
  border-radius: 50%;
  border-width: 1px;
  animation: rotateCircle 2s linear infinite reverse;
  display: flex; /* 使用flexbox确保内容居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  text-align: center;
}

/*------ rotateCircle ------*/
@-webkit-keyframes rotateCircle {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0); }
  25% {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg); }
  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg); }
  75% {
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

/*------ rotateCircle ------*/
@keyframes rotateCircle {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0); }
  25% {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg); }
  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg); }
  75% {
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

/* --------------------------------------
  9. FACTS
-----------------------------------------*/
.counts {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  padding: 80px 0;
  position: relative;
  overflow: hidden; }

.counts::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.1);
  pointer-events: none; }

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

.counts .count-item {
  padding: 20px 10px; }

.counts .counter {
  background: rgba(255, 255, 255, 0.95);
  border-radius: 15px;
  padding: 40px 30px;
  color: #333;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden; }

.counts .counter::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #F7CA18, #f39c12);
  transform: scaleX(0);
  transition: transform 0.3s ease; }

.counts .counter:hover::before {
  transform: scaleX(1); }

.counts .counter:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15); }

.counts .counting-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: auto;
  margin: 0 auto 20px;
  position: relative;
  transition: all 0.3s ease; }

.counts .counting-icon i {
  font-size: 2.5rem;
  color: #F7CA18;
  line-height: 1;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease; }

.counts .counter:hover .counting-icon i {
  color: #f39c12;
  transform: scale(1.1); }

.counts .counts-c .count {
  font-size: 3.5rem;
  font-weight: 700;
  color: #2c3e50;
  line-height: 1;
  margin-bottom: 10px;
  display: block;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); }

.counts .counts-c h4 {
  font-size: 1rem;
  margin: 0;
  text-transform: uppercase;
  font-weight: 600;
  color: #7f8c8d;
  letter-spacing: 1px; }

/*------ width < 768px ------*/
@media (max-width: 768px) {
  .counts {
    padding: 60px 0; }
  
  .counts .counter {
    padding: 30px 20px; }
  
  .counts .counting-icon {
    width: auto;
    height: auto;
    margin-bottom: 15px; }
  
  .counts .counting-icon i {
    font-size: 2rem; }
  
  .counts .counts-c .count {
    font-size: 2.5rem; }
  
  .counts .counts-c h4 {
    font-size: 0.9rem; } }

/*------ width < 575px ------*/
@media (max-width: 575px) {
  .counts {
    padding: 50px 0; }
  
  .counts .counter {
    padding: 25px 15px; }
  
  .counts .counting-icon {
    width: auto;
    height: auto;
    margin-bottom: 12px; }
  
  .counts .counting-icon i {
    font-size: 1.8rem; }
  
  .counts .counts-c .count {
    font-size: 2rem; }
  
  .counts .counts-c h4 {
    font-size: 0.8rem; } }

/* --------------------------------------
  10. PORTFOLIO
-----------------------------------------*/
.portfolio {
  background: #001942;
  color: #353434; }

.portfolio .port-title {
  float: none;
  margin: 0 auto;
  margin-bottom: 20px; }

.portfolio .port-title p {
  padding: 0 10rem; }

.portfolio .filter-port {
  margin: 0 auto;
  text-align: center;
  margin-bottom: 60px;
  margin-left: 15px; }

.portfolio .filter-port .btn {
  z-index: 1;
  color: #d8d7d79c; }

.portfolio .filter-port li {
  padding: 7px 30px;
  cursor: pointer;
  font-size: 16px;
  margin: 0 1px;
  border-radius: 2px;
  -o-border-radius: 2px;
  -ms-border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  display: inline-block; }

.portfolio .filter-port .active {
  color: #fff;
  box-shadow: 0 0.5em 0.5em -0.4em #F7CA18; }

.portfolio .filtr-item {
  padding: 10px; }

.portfolio .port-caption {
  position: relative; }

.portfolio .port-caption img {
  height: auto;
  width: 100%;
  max-width: 100%;
  border-radius: 2px; }

.portfolio .port-caption .overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  -webkit-transition: ease-out .3s;
  -moz-transition: ease-out .3s;
  -o-transition: ease-out .3s;
  transition: ease-out .3s;
  opacity: 0;
  -webkit-transform: translateX(10px);
  -moz-transform: translateX(10px);
  -ms-transform: translateX(10px);
  -o-transform: translateX(10px);
  transform: translateX(10px); }

.portfolio .port-caption .overlay:focus {
  outline: none; }

.portfolio .port-caption .overlay span,
.portfolio .port-caption .overlay i {
  color: #fff; }

.portfolio .filtr-item:hover .overlay {
  margin: 1.5rem;
  background: #001942;
  background: -webkit-linear-gradient(to left, rgba(57, 153, 242, 0.5), rgba(0, 25, 66, 0.5));
  background: linear-gradient(to left, rgba(57, 153, 242, 0.5), rgba(0, 25, 66, 0.5));
  opacity: 1;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  -moz-transform: translateX(0);
  transform: translateX(0); }

.portfolio .port-caption .info-content {
  position: absolute;
  top: 20px;
  left: 20px;
  text-align: left; }

.portfolio .port-caption .info-content h4 {
  color: #fff;
  font-size: 20px;
  position: relative; }

.portfolio .port-caption .info-content p {
  font-size: 15px;
  color: #d8d7d79c; }

.portfolio .port-caption .view-more {
  position: absolute;
  bottom: 20px;
  right: 20px;
  text-align: left; }

.portfolio .port-caption:focus,
.portfolio .filtr-item:focus,
.portfolio .port-caption img:focus,
.portfolio .port-caption a:focus {
  outline: none; }

/*------ width < 991px ------*/
@media (max-width: 991px) {
  .portfolio .port-title p {
    padding: 0 5rem; } }

/*------ width < 575px ------*/
@media (max-width: 575px) {
  .portfolio .port-title p {
    padding: 0; }
  .portfolio .filter-port {
    padding: 0 15px; }
  .portfolio .filter-port li {
    margin-bottom: 7px; } }

/* --------------------------------------
  11.TEAM
-----------------------------------------*/
.team .team-info {
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
  text-align: center; }

.team .team-info:before {
  content: "";
  width: 100%;
  height: 100%;
  background: rgba(0, 25, 66, 0.5);
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: all .35s ease 0s; }

.team .team-info:hover:before {
  opacity: 1; }

.team .team-info .view-content {
  width: 90%;
  height: 90%;
  position: absolute;
  top: 5%;
  left: 5%; }

.team .team-info .view-content:after,
.team .team-info .view-content:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  opacity: 0;
  transition: all .7s ease 0s; }

.team .team-info .view-content:before {
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  transform: scale(0, 1);
  transform-origin: 0 0 0; }

.team .team-info .view-content:after {
  border-left: 1px solid rgba(255, 255, 255, 0.5);
  border-right: 1px solid rgba(255, 255, 255, 0.5);
  transform: scale(1, 0);
  transform-origin: 100% 0 0; }

.team .team-info:hover .view-content:after,
.team .team-info:hover .view-content:before {
  opacity: 1;
  transform: scale(1);
  transition-delay: .15s; }

.team .team-info .title {
  font-size: 21px;
  font-weight: 700;
  color: #fff;
  margin-top: 60px;
  opacity: 0;
  transform: translate3d(0, -50px, 0);
  transition: transform .5s ease 0s; }

.team .team-info:hover .title {
  opacity: 1;
  transform: translate3d(#000); }

.team .team-info .post {
  font-size: 14px;
  color: #fff;
  padding: 10px;
  background: #001942;
  opacity: 0;
  border-radius: 0 19px;
  transform: translate3d(0, -50px, 0);
  transition: all .7s ease 0s;
  text-transform: capitalize;
  display: inline-block; }

.team .team-info .icon {
  padding: 0; }

.team .team-info:hover .post {
  opacity: 1;
  transform: translate3d(#000);
  transition-delay: .15s; }

.team .team-info .icon {
  width: 100%;
  margin: 0;
  position: absolute;
  bottom: -10px;
  left: 0;
  opacity: 0;
  z-index: 1;
  transition: all .7s ease 0s; }

.team .team-info:hover .icon {
  bottom: 20px;
  opacity: 1;
  transition-delay: .15s; }

.team .team-info .icon li {
  display: inline-block; }

.team .team-info .icon li a {
  display: block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  background: #fff;
  color: #001942;
  border-radius: 50%;
  font-size: 14px;
  margin-right: 5px;
  transition: all .4s ease 0s; }

.team .team-info .icon li a:hover {
  color: #fff;
  background: #001942; }

/*------ width < 991px ------*/
@media (max-width: 991px) {
  .team .team-info {
    margin-bottom: 30px; } }

/* ------------------------------
  12. READY
---------------------------------*/
.ready {
  background: linear-gradient(rgba(0, 25, 66, 0.8), rgba(57, 153, 242, 0.8)), url("../img/hero-02.jpg") no-repeat fixed center;
  background-size: cover; }

.ready .cta {
  padding: 5rem;
  background-color: rgba(255, 255, 255, 0.7); }

.ready .button {
  z-index: 1; }

.ready .button:hover {
  animation: animate 1s linear infinite; }

/*------ animate ------*/
@keyframes animate {
  0% {
    box-shadow: 0 0 0 0 rgba(247, 202, 24, 0.4); }
  100% {
    box-shadow: 0 0 0 20px rgba(247, 202, 24, 0); } }

/* --------------------------------------
  13. PRICES
-----------------------------------------*/
.price .item {
  margin-top: 2rem;
  padding-bottom: 5rem;
  background-color: #fff;
  -webkit-box-shadow: 0px 15px 40px -5px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 15px 40px -5px rgba(0, 0, 0, 0.1);
  border-radius: 5px; }

.price .type h4 {
  font-size: 20px;
  margin-bottom: 25px;
  padding: 25px 0;
  background: #001942;
  color: #fff;
  border-radius: 2px; }

.price .value {
  margin-bottom: 30px;
  padding-bottom: 30px;
  position: relative; }

.price .value:after {
  content: '';
  width: 100px;
  height: 1px;
  background: #d8d7d79c;
  position: absolute;
  bottom: 0;
  left: calc(50% - 50px); }

.price .value h3 {
  font-size: 50px;
  display: inline-block;
  position: relative; }

.price .value h3 span {
  font-size: 12px;
  position: absolute;
  top: 0;
  left: -10px; }

.price .features {
  margin-bottom: 30px; }

.price .features li {
  font-size: 13px;
  color: #353434;
  margin-bottom: 15px; }

.price .features li:last-child {
  margin-bottom: 0; }

.price .order .button {
  z-index: 1; }

.price .active {
  -webkit-box-shadow: 0px 20px 40px -10px rgba(0, 0, 0, 0.5);
  box-shadow: 0px 20px 40px -10px rgba(0, 0, 0, 0.5);
  background-color: #001942;
  color: #fff; }

.price .active .type h4 {
  background: #fff;
  color: #001942;
  font-weight: 500; }

.price .active .features li {
  color: #fff; }

.price .active .button {
  color: #fff; }

/* --------------------------------------
  14.PROCESS
-----------------------------------------*/
.process {
  background: #d8d7d79c; }

/* 流程部分容器居中优化 */
.process .row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center; /* 水平居中排列 */
  align-items: stretch; /* 确保所有卡片高度一致 */
  margin: 0 -15px; /* 重置默认边距 */
}

/* 流程部分列容器居中优化 */
.process .col-lg-3,
.process .col-md-6,
.process .col-sm-6 {
  display: flex;
  flex-direction: column;
  padding: 0 15px; /* 添加列间距 */
  margin-bottom: 30px; /* 添加行间距 */
  justify-content: center; /* 垂直居中 */
}

.process .p-list {
  text-align: center;
  border-radius: 4px;
  padding: 30px 20px; /* 增加上下内边距 */
  display: flex; /* 使用flexbox布局 */
  flex-direction: column; /* 垂直排列 */
  align-items: center; /* 水平居中 */
  justify-content: center; /* 垂直居中 */
  height: 100%; /* 占满容器高度 */
  background: #fff; /* 添加白色背景 */
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* 添加阴影效果 */
  transition: all 0.3s ease; /* 添加过渡效果 */
}

.process .p-list:hover {
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15); /* 悬停时增强阴影 */
  transform: translateY(-5px); /* 悬停时轻微上移 */
}

.process .p-list .icon {
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  position: relative;
  cursor: pointer;
  margin: 1.5rem auto 1rem; /* 减少上下边距，水平居中 */
  width: 70px; /* 缩小图标容器 */
  height: 70px; /* 缩小图标容器 */
  background: linear-gradient(135deg, #3999f2, #2676c7); /* 添加渐变背景 */
  box-shadow: 0 4px 12px rgba(57, 153, 242, 0.3); /* 更柔和的阴影 */
  padding: 8px; /* 减少内边距 */
  color: white; /* 图标颜色改为白色 */
  font-size: 28px; /* 缩小图标字体 */
  line-height: 1; /* 重置行高，使用flexbox居中 */
  border-radius: 50%; /* 使用百分比确保完美圆形 */
  overflow: hidden; /* 隐藏超出区域的图标部分 */
  transition: all 0.3s ease; /* 简化过渡效果 */ }

.process .p-list .icon:hover {
  transform: translateY(-5px) scale(1.05); /* 简化悬停效果，轻微上移并放大 */
  box-shadow: 0 6px 16px rgba(57, 153, 242, 0.4); /* 悬停时增强阴影 */ }

.process .p-list h6 {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 15px; /* 增加底部间距 */
  color: #001942; /* 使用主题色 */
  text-align: center; /* 确保标题居中 */
  width: 100%; /* 确保标题占满宽度 */
}

.process .p-list p {
  font-size: 15px;
  line-height: 1.6; /* 增加行高提高可读性 */
  color: #666; /* 使用灰色提高对比度 */
  text-align: center; /* 确保描述文字居中 */
  width: 100%; /* 确保描述文字占满宽度 */
  margin: 0; /* 移除默认边距 */
}

/* --------------------------------------
  15.TESTIMONIALS
-----------------------------------------*/
.test {
  background: linear-gradient(rgba(0, 25, 66, 0.8), rgba(57, 153, 242, 0.8)), url("../img/hero-04.jpg") no-repeat fixed center;
  background-size: cover; }

.testimonials .client-area {
  margin-bottom: 20px; }

.testimonials .client-area .img {
  display: inline-block; }

.testimonials .client-area .author {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  overflow: hidden;
  margin: 0 auto 15px; }

.testimonials .client-area h6 {
  font-weight: 400;
  font-size: 20px;
  text-transform: uppercase;
  margin-bottom: 5px;
  color: #fff; }

.testimonials .client-area span {
  font-size: 12px;
  letter-spacing: 1px;
  color: #d8d7d79c; }

.testimonials p {
  margin-bottom: 15px;
  color: rgba(255, 255, 255, 0.7); }

.owl-carousel .owl-dots .owl-dot.active span,
.owl-carousel .owl-dots .owl-dot:hover span {
  background: #001942;
  -webkit-transform: translate3d(0px, -50%, 0px) scale(0.7);
  transform: translate3d(0px, -50%, 0px) scale(0.7); }

.owl-carousel .owl-dots {
  display: inline-block;
  width: 100%;
  text-align: center;
  margin-top: 2rem; }

.owl-carousel .owl-dots .owl-dot {
  display: inline-block; }

.owl-carousel .owl-dots .owl-dot span {
  background: #fff;
  display: inline-block;
  height: 20px;
  width: 20px;
  border-radius: 50px;
  -moz-border-radius: 50px;
  -webkit-border-radius: 50px;
  margin: 0 2px 5px;
  -webkit-transform: translate3d(0px, -50%, 0px) scale(0.3);
  transform: translate3d(0px, -50%, 0px) scale(0.3);
  -webkit-transform-origin: 50% 50% 0;
  transform-origin: 50% 50% 0;
  transition: all 250ms ease-out 0s;
  width: 20px; }

/* --------------------------------------
  16. BLOG
-----------------------------------------*/
.blog {
  /* background: url("../img/blog-bg.png") no-repeat center; */
  background-size: cover; }

/* 确保blog行容器使用flexbox布局 */
.blog .row {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch; /* 确保所有卡片高度一致 */
  margin: 0 -15px; /* 重置默认边距 */
}

/* 确保blog卡片容器使用flexbox */
.blog .col-lg-4,
.blog .col-md-6,
.blog .col-sm-12 {
  display: flex;
  flex-direction: column;
  padding: 0 15px; /* 添加列间距 */
  margin-bottom: 30px; /* 添加行间距 */
}

.blog .text-center p {
  padding-bottom: 5rem; }

.blog-item {
  color: #353434;
  background: #fff;
  padding: 25px;
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  margin-bottom: 0; /* 移除底部边距，由容器控制 */
  display: flex; /* 使用flexbox布局 */
  flex-direction: column; /* 垂直排列 */
  height: 100%; /* 占满容器高度 */
}

.blog-item:hover {
  -webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2); }

.blog-img {
  position: relative;
  flex-shrink: 0; /* 防止图片区域收缩 */
  margin-bottom: 20px; }

.blog-img .post-date {
  background: #001942;
  color: #fff;
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  padding: 0;
  margin: 1rem;
  width: 40px;
  height: 40px;
  text-align: center;
  transition: all 0.50s ease;
  border-radius: 50px; }

.blog-img .date {
  display: block;
  font-size: 15px;
  font-weight: 700; }

.blog-img .month {
  display: block;
  font-size: 8px;
  text-transform: uppercase; }

.blog-item .headerhr {
  margin: 0; }

.blog-item .post-meta {
  font-size: 12px;
  font-weight: 400;
  padding-top: 2rem;
  flex-shrink: 0; /* 防止元数据区域收缩 */
  margin-top: auto; /* 将元数据推到底部 */
}

.blog-item .post-meta ul li {
  margin-right: 10px;
  display: inline-block;
  font-style: italic; }

.blog-item .post-meta ul li i {
  padding-right: 2px; }

.blog-item .post-title {
  margin: 10px 0;
  flex-shrink: 0; /* 防止标题区域收缩 */
}

.blog-item .post-title a {
  transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out; }

.blog-item .post-title h3 {
  font-size: 20px;
  font-family: "Poppins", sans-serif;
  color: #353434; }

.blog-item:hover h3 {
  color: #001942; }

.blog-item .post-content {
  flex-grow: 1; /* 让内容区域占据剩余空间 */
  display: flex;
  flex-direction: column;
}

.blog-item .post-content p {
  color: rgba(53, 52, 52, 0.7);
  font-size: 13.2px;
  font-weight: 400;
  flex-grow: 1; /* 让描述文本占据剩余空间 */
  margin-bottom: 15px; }

.blog-item .post-content .button {
  z-index: 1;
  padding: 0;
  color: #353434;
  font-weight: normal;
  text-transform: initial;
  text-shadow: none;
  flex-shrink: 0; /* 防止按钮收缩 */
  margin-top: auto; /* 将按钮推到底部 */
}

.blog-item .fa-long-arrow-right {
  margin-left: 15px;
  transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out; }

.blog-item:hover .fa-long-arrow-right {
  -webkit-animation: push 2s infinite;
  animation: push 2s infinite; }

/* 响应式调整 */
@media (max-width: 991px) {
  .blog .row {
    margin: 0 -10px;
  }
  
  .blog .col-lg-4,
  .blog .col-md-6,
  .blog .col-sm-12 {
    padding: 0 10px;
    margin-bottom: 20px;
  }
}

@media (max-width: 768px) {
  .blog .row {
    margin: 0 -5px;
  }
  
  .blog .col-lg-4,
  .blog .col-md-6,
  .blog .col-sm-12 {
    padding: 0 5px;
    margin-bottom: 15px;
  }
}

/* -------- push animation ------- */
@-webkit-keyframes push {
  0%,
  20%,
  50%,
  80%,
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0); }
  40% {
    -webkit-transform: translateX(15px);
    transform: translateX(15px); }
  60% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px); } }

/*------ push animation ------*/
@-moz-keyframes push {
  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translateX(0); }
  40% {
    transform: translateX(15px); }
  60% {
    transform: translateX(10px); } }

/*------ push animation ------*/
@keyframes push {
  0%,
  20%,
  50%,
  80%,
  100% {
    -ms-transform: translateX(0);
    transform: translateX(0); }
  40% {
    -ms-transform: translateX(15px);
    transform: translateX(15px); }
  60% {
    -ms-transform: translateX(10px);
    transform: translateX(10px); } }

/* ----------------------------------------------------------------
  17. Clients Logo
-----------------------------------------------------------------*/
.clients {
  padding: 80px 0;
  background: #001942;
  background: -webkit-linear-gradient(to left, #3999f2, #001942);
  background: linear-gradient(to left, #3999f2, #001942); }

.clients .owl-carousel {
  margin-bottom: -20px; }

.clients .client-logo {
  opacity: 1; }

.clients .client-logo:hover {
  opacity: .7; }

.clients img {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  -webkit-transition: all .5s;
  transition: all .5s; }

.clients img:hover {
  -webkit-filter: none;
  filter: none; }

/* --------------------------------------
  18. CONTACT
-----------------------------------------*/
.contact {
  font-family: "Poppins", sans-serif;
  /* background: url("../img/contact-bg.png") no-repeat center; */
  background-size: cover; }

.contact .info {
  margin-top: 30px; }

.contact .info li {
  margin-bottom: 15px; }

.contact .info li:last-child {
  margin-bottom: 0; }

.contact .info li .icon,
.contact .info li i {
  float: left;
  color: #fff;
  background: #001942;
  display: block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  font-size: 14px;
  border-radius: 50px;
  -moz-border-radius: 50px;
  -webkit-border-radius: 50px;
  z-index: 1; }

.contact .info li p {
  display: inline-block;
  color: #353434;
  margin-left: 15px;
  font-size: 15px; }

.contact .info li h5 span {
  font-weight: 700;
  margin-left: 15px;
  display: inline-block;
  font-size: 16px; }

.contact .contact-form input {
  border-radius: .2rem; }

.contact .contact-form .button {
  display: inline-block;
  width: 40%;
  margin: 0 auto;
  padding: 1rem;
  z-index: 1;
  background: #fff;
  border-radius: .2rem; }

.contact .contact-form {
  margin-top: 30px; }

.contact .contact-info .item {
  margin-top: 30px; }

.contact .contact-info .item .icon {
  float: left;
  font-size: 25px;
  color: #d8d7d79c; }

.contact .contact-info .item .cont {
  margin-left: 50px; }

.contact .contact-info .item .cont h6 {
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 5px; }

.contact .contact-info .item .cont p {
  font-size: 13px; }

.contact .form input,
.contact .form textarea {
  width: 100%;
  padding: 10px;
  border: 0;
  background-color: #fff; }

.contact .form input:focus,
.contact .form textarea:focus {
  border: none;
  outline: none; }

.contact .form textarea {
  height: 160px;
  max-height: 160px;
  max-width: 100%; }

/* --------------------------------------
  MAP
-----------------------------------------*/
#map {
  height: 500px;
  position: relative; }

/* --------------------------------------
  19. FOOTER - 网格布局样式
-----------------------------------------*/
.footer {
  background: #001942;
  color: #fff;
  padding: 4rem 0 2rem;
  position: relative;
}

/* 页脚网格布局 */
.footer-grid {
  margin-bottom: 3rem;
}

.footer-row {
  display: flex;
  flex-wrap: nowrap; /* 强制不换行 */
  gap: 2rem;
  align-items: stretch;
  justify-content: space-between;
}

/* 确保2个区域分布，左侧较窄，右侧较宽 */
.footer-row .footer-cell {
  min-width: 0; /* 移除最小宽度限制 */
}

/* 左侧卡片（公司信息）宽度较小 */
.footer-row .footer-cell.company-info {
  /* flex: 0 0 35%; */
  /* max-width: 35%; */
}

/* 右侧卡片（联系方式）宽度较大 */
.footer-row .footer-cell.contact-info {
  /* flex: 0 0 65%; */
  /* max-width: 70%; */
}

.footer-cell {
  flex: 1;
  min-width: 0; /* 移除最小宽度限制 */
  padding: 1.5rem;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  transition: all 0.3s ease;
}

.footer-cell:hover {
  background: rgba(255, 255, 255, 0.08);
  transform: translateY(-2px);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

/* 公司信息样式 */
.footer-title {
  font-size: 1.8rem;
  font-weight: 600;
  margin-bottom: 1rem;
  color: #fff;
  position: relative;
}

.footer-title::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 0;
  width: 40px;
  height: 3px;
  background: linear-gradient(90deg, #3999f2, #001942);
  border-radius: 2px;
}

.footer-description {
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.6;
  margin-bottom: 1.5rem;
}

/* 公司统计信息 */
.company-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-top: 1.5rem;
}

.stat-item {
  text-align: center;
  padding: 1rem;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.stat-number {
  display: block;
  font-size: 1.5rem;
  font-weight: 700;
  color: #3999f2;
  margin-bottom: 0.5rem;
}

.stat-label {
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.7);
}

/* 页脚子标题 */
.footer-subtitle {
  font-size: 1.5rem;
  font-weight: 600;
  margin-bottom: 1rem;
  color: #fff;
  position: relative;
}

.footer-subtitle::after {
  content: '';
  position: absolute;
  bottom: -6px;
  left: 0;
  width: 30px;
  height: 2px;
  background: #3999f2;
  border-radius: 1px;
}

/* 页脚链接列表 */
.footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-links li {
  margin-bottom: 0.8rem;
  padding: 0;
}

.footer-links a {
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
  transition: all 0.3s ease;
  display: inline-block;
  position: relative;
  padding-left: 0;
}

.footer-links a::before {
  content: '→';
  margin-right: 8px;
  color: #3999f2;
  transition: all 0.3s ease;
}

.footer-links a:hover {
  color: #fff;
  transform: translateX(5px);
}

.footer-links a:hover::before {
  transform: translateX(3px);
}

/* 联系信息样式 */
.contact-details {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.contact-item {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  color: rgba(255, 255, 255, 0.8);
}

.contact-item i {
  color: #3999f2;
  font-size: 1.1rem;
  width: 20px;
  height: 1.2rem; /* 设置固定高度 */
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 社交媒体部分样式 */
.social-section {
  margin-top: 2rem; /* 增加与上方内容的间距 */
  padding-top: 1.5rem; /* 增加内边距 */
  border-top: 1px solid rgba(255, 255, 255, 0.1); /* 添加分隔线 */
}

/* 事业部分类联系方式布局 */
.departments-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.2rem;
  margin-top: 1.5rem;
}

.department-column {
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 8px;
  padding: 1.2rem;
  transition: all 0.3s ease;
  backdrop-filter: blur(10px);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.department-column:hover {
  background: rgba(255, 255, 255, 0.12);
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
  border-color: rgba(255, 255, 255, 0.2);
}

.department-title {
  color: #fff;
  font-size: 1.4rem;
  font-weight: 600;
  margin-bottom: 1.2rem;
  text-align: center;
  position: relative;
  letter-spacing: 0.5px;
}

.department-title::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 40px;
  height: 3px;
  background: linear-gradient(90deg, #3999f2, #001942);
  border-radius: 2px;
}

.department-contacts {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: flex-start; /* 确保整个联系信息区域左对齐 */
}

.department-contacts .contact-item {
  display: flex;
  align-items: center; /* 垂直居中对齐 */
  gap: 0.8rem;
  color: rgba(255, 255, 255, 0.9);
  font-size: 1.2rem;
  line-height: 1.4; /* 设置行高确保文字垂直居中 */
  padding: 0.3rem 0;
  transition: all 0.2s ease;
  justify-content: flex-start; /* 确保左对齐 */
  text-align: left; /* 文本左对齐 */
  min-height: 1.6rem; /* 确保最小高度 */
}

.department-contacts .contact-item:hover {
  color: #fff;
  transform: translateX(3px);
}

.department-contacts .contact-item i {
  color: #3999f2;
  font-size: 1.3rem;
  width: 20px;
  height: 1.4rem; /* 设置固定高度与文字行高匹配 */
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  flex-shrink: 0; /* 防止图标被压缩 */
}

.department-contacts .contact-item:hover i {
  color: #5bb3ff;
  transform: scale(1.1);
}

.department-contacts .contact-item span {
  text-align: left; /* 确保文字左对齐 */
  word-break: break-word; /* 防止长文本溢出 */
  display: flex;
  align-items: center; /* 确保文字垂直居中 */
  line-height: 1.4; /* 与容器行高保持一致 */
}

/* 订阅表单样式 */
.newsletter-desc {
  color: rgba(255, 255, 255, 0.8);
  margin-bottom: 1.5rem;
  line-height: 1.6;
}

.newsletter-form .input-group {
  display: flex;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.newsletter-form .form-control {
  border: none;
  padding: 12px 16px;
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  border-radius: 0;
}

.newsletter-form .form-control::placeholder {
  color: rgba(255, 255, 255, 0.6);
}

.newsletter-form .form-control:focus {
  background: rgba(255, 255, 255, 0.15);
  box-shadow: none;
  outline: none;
}

.btn-subscribe {
  background: #3999f2;
  border: none;
  color: #fff;
  padding: 12px 20px;
  border-radius: 0;
  transition: all 0.3s ease;
}

.btn-subscribe:hover {
  background: #2980b9;
  transform: translateX(2px);
}

/* 社交媒体链接 */
.social-links {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

.social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 45px;
  height: 45px;
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  border-radius: 50%;
  text-decoration: none;
  transition: all 0.3s ease;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.social-link:hover {
  background: #3999f2;
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 4px 15px rgba(57, 153, 242, 0.3);
}

.social-link i {
  font-size: 1.4rem;
}

/* 页脚底部 */
.footer-bottom {
  margin-top: 3rem;
}

.footer-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  margin-bottom: 2rem;
}

.footer-bottom-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
}

.copyright p {
  color: rgba(255, 255, 255, 0.7);
  margin: 0;
  font-size: 0.9rem;
}

.footer-links-bottom {
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
}

.footer-links-bottom a {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  font-size: 0.9rem;
  transition: color 0.3s ease;
}

.footer-links-bottom a:hover {
  color: #3999f2;
}

/* 响应式设计 */
@media (max-width: 991px) {
  .footer-row {
    flex-wrap: wrap; /* 在中等屏幕上允许换行 */
  }
  
  .footer-row .footer-cell {
    flex: 1 1 calc(50% - 1rem);
    max-width: calc(50% - 1rem);
  }
}

@media (max-width: 768px) {
  .footer {
    padding: 3rem 0 1.5rem;
  }
  
  .footer-row {
    flex-wrap: wrap; /* 在小屏幕上允许换行 */
    flex-direction: column;
    gap: 1.5rem;
  }
  
  .footer-row .footer-cell {
    flex: 1 1 100% !important;
    max-width: 100% !important;
  }
  
  .footer-cell {
    flex: none;
    min-width: auto;
    padding: 1.2rem;
  }
  
  /* 小屏幕上的事业部分类布局 */
  .departments-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  
  .department-column {
    padding: 1rem;
  }
  
  .department-title {
    font-size: 1.3rem;
    margin-bottom: 1rem;
  }
  
  .department-contacts .contact-item {
    font-size: 1.1rem;
  }
  
  .department-contacts .contact-item:hover {
    transform: translateX(2px);
  }
  
  .company-stats {
    grid-template-columns: repeat(3, 1fr);
    gap: 0.8rem;
  }
  
  .stat-number {
    font-size: 1.3rem;
  }
  
  .stat-label {
    font-size: 0.8rem;
  }
  
  .footer-bottom-content {
    flex-direction: column;
    text-align: center;
  }
  
  .footer-links-bottom {
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .footer-grid {
    gap: 1.5rem;
  }
  
  .footer-cell {
    padding: 1rem;
  }
  
  .company-stats {
    grid-template-columns: 1fr;
    gap: 0.8rem;
  }
  
  .social-links {
    justify-content: center;
  }
  
  .footer-links-bottom {
    flex-direction: column;
    gap: 1rem;
  }
}

/* 保留动画关键帧，可能在其他地方使用 */
@-webkit-keyframes bounceRight {
  0%,
  20%,
  50%,
  80%,
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0); }
  40% {
    -webkit-transform: translateX(-15px);
    transform: translateX(-15px); }
  60% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px); } }

@-moz-keyframes bounceRight {
  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translateX(0); }
  40% {
    transform: translateX(-15px); }
  60% {
    transform: translateX(-10px); } }

@keyframes bounceRight {
  0%,
  20%,
  50%,
  80%,
  100% {
    -ms-transform: translateX(0);
    transform: translateX(0); }
  40% {
    -ms-transform: translateX(-15px);
    transform: translateX(-15px); }
  60% {
    -ms-transform: translateX(-10px);
    transform: translateX(-10px); } }

/* --------------------------------------
  卡片高度一致样式
-----------------------------------------*/

/* 行容器使用flexbox确保卡片高度一致 */
.about-list .row,
.services .row,
.team .row,
.pricing-tables .row,
.blog .row {
  display: flex;
  flex-wrap: wrap;
}

.about-list .row > [class*="col-"],
.services .row > [class*="col-"],
.team .row > [class*="col-"],
.pricing-tables .row > [class*="col-"],
.blog .row > [class*="col-"] {
  display: flex;
  flex-direction: column;
}

/* 关于我们列表卡片高度一致 */
.about-list .about-item {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.about-list .about-item .text-center {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 30px 20px;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
  align-items: center; /* 确保内容水平居中 */
  text-align: center; /* 确保文本居中 */
}

.about-list .about-item .text-center:hover {
  transform: translateY(-5px);
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
}

.about-list .about-item .text-center p {
  flex-grow: 1;
  margin-bottom: 0;
}

/* 图标居中样式优化 */
.about-list .about-item .icon {
  width: 100px;
  height: 100px;
  line-height: 100px;
  color: #F7CA18;
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  font-size: 40px;
  margin: 0 auto 15px auto; /* 上下左右都居中 */
  position: relative;
  z-index: 3;
  background-color: #fff;
  background: -webkit-gradient(linear, left top, right bottom, from(#3999f2), to(#001942));
  background: linear-gradient(to bottom right, #3999f2, #001942);
  border-radius: 10px 0px 200px 200px;
  -moz-border-radius: 10px 0px 200px 200px;
  -webkit-border-radius: 10px 0px 200px 200px;
}

.about-list .about-item .icon:after {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  border: 2px solid #F7CA18;
  top: 0;
  right: 0;
  background-color: #fff;
  background: -webkit-gradient(linear, left top, right bottom, from(#001942), to(#3999f2));
  background: linear-gradient(to bottom right, #001942, #3999f2);
  border-radius: 10px 0px 200px 200px;
  -moz-border-radius: 10px 0px 200px 200px;
  -webkit-border-radius: 10px 0px 200px 200px;
  z-index: -1;
  -webkit-transform: scale(0, 0);
  transform: scale(0, 0);
  -webkit-transition: all .4s;
  transition: all .4s;
}

.about-list .about-item h5 {
  font-weight: 500;
  font-size: 18px;
  margin-bottom: 10px;
  text-align: center; /* 确保标题居中 */
}

.about-list .about-item h6 {
  color: #001942;
  font-size: 12px;
  font-weight: 400;
  margin-bottom: 20px;
  text-align: center; /* 确保副标题居中 */
}

/* 服务部分卡片高度一致 */
.services .content-box {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 40px 30px;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
  margin-bottom: 30px;
}

.services .content-box:hover {
  transform: translateY(-5px);
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
}

/* 确保服务卡片内容布局 */
.services .content-box .heading-secondary {
  flex-shrink: 0; /* 防止收缩 */
  margin: 20px 0 15px 0;
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  color: #001942;
}

.services .content-box p {
  flex-grow: 1; /* 让描述文本占据剩余空间 */
  margin-bottom: 0; /* 移除底部边距 */
  text-align: center;
  line-height: 1.6;
  color: #666;
}

/* 团队卡片高度一致 */
.team .team-info {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
}

.team .team-info:hover {
  transform: translateY(-5px);
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
}

.team .team-info .view-content {
  flex-grow: 1;
  padding: 20px;
  display: flex;
  flex-direction: column;
}

.team .team-info .view-content .title {
  margin-bottom: 10px;
}

.team .team-info .view-content .post {
  margin-bottom: 15px;
}

.team .team-info .view-content ul {
  margin-top: auto;
}

/* 价格卡片高度一致 */
.pricing-tables .item {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
}

.pricing-tables .item:hover {
  transform: translateY(-5px);
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
}

.pricing-tables .item .features {
  flex-grow: 1;
  padding: 20px;
}

.pricing-tables .item .features ul {
  margin-bottom: 0;
}

/* 博客卡片高度一致 */
.blog .blog-item {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
}

.blog .blog-item:hover {
  transform: translateY(-5px);
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
}

.blog .blog-item .post-content {
  flex-grow: 1;
  padding: 20px;
  display: flex;
  flex-direction: column;
}

.blog .blog-item .post-content p {
  flex-grow: 1;
  margin-bottom: 15px;
}

/* 响应式调整 */
@media (max-width: 768px) {
  .about-list .about-item .text-center,
  .services .content-box,
  .team .team-info,
  .pricing-tables .item,
  .blog .blog-item {
    margin-bottom: 20px;
  }
}

/* 图标垂直居中对齐优化 */
/* 关于我们列表部分图标垂直居中 */
.about-list .about-item .icon {
  width: 100px;
  height: 100px;
  line-height: 100px;
  color: #F7CA18;
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  font-size: 40px;
  margin-bottom: 15px;
  position: relative;
  z-index: 3;
  background-color: #fff;
  background: -webkit-gradient(linear, left top, right bottom, from(#3999f2), to(#001942));
  background: linear-gradient(to bottom right, #3999f2, #001942);
  border-radius: 10px 0px 200px 200px;
  -moz-border-radius: 10px 0px 200px 200px;
  -webkit-border-radius: 10px 0px 200px 200px; }

/* 流程部分图标垂直居中 */
.process .p-list .icon {
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  position: relative;
  cursor: pointer;
  margin: 2rem;
  width: 100px;
  height: 100px;
  box-shadow: 0 2px 2px #3999f2;
  padding: 10px;
  color: #353434;
  font-size: 45px;
  line-height: 1; /* 重置行高，使用flexbox居中 */
  border-radius: 50px;
  -moz-border-radius: 50px;
  -webkit-border-radius: 50px;
  overflow: hidden; /* 隐藏超出区域的图标部分 */
  -moz-transition: -moz-transform 1s, cubic-bezier(0.075, 0.82, 0.165, 1) ease 0.4s;
  -o-transition: -o-transform 1s, cubic-bezier(0.075, 0.82, 0.165, 1) ease 0.4s;
  -webkit-transition: -webkit-transform 1s, cubic-bezier(0.075, 0.82, 0.165, 1) ease 0.4s;
  transition: transform 1s, cubic-bezier(0.075, 0.82, 0.165, 1) ease 0.4s; }

/* 统计部分图标垂直居中 */
.counts .counting-icon {
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  color: #F7CA18;
  width: 100%; /* 确保容器占满宽度 */
  height: auto; /* 自适应高度 */
  margin-bottom: 15px; }

.counts .counting-icon i {
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  width: 100%; /* 确保图标占满容器 */
  height: 100%; /* 确保图标占满容器 */
  line-height: 1; /* 重置行高，使用flexbox居中 */
  font-size: 2rem; /* 保持原有字体大小 */
  color: #F7CA18; }

/* 服务部分图标垂直居中 */
.content-box-icon i {
  width: 100px;
  height: 100px;
  line-height: 1; /* 重置行高，使用flexbox居中 */
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  font-size: 4rem;
  text-align: center;
  color: #353434;
  position: relative;
  border-radius: 50%;
  margin: 0 auto; /* 确保图标容器居中 */
}

/* 响应式优化 - 小屏幕设备 */
@media (max-width: 768px) {
  /* 关于我们列表部分图标响应式优化 */
  .about-list .about-item .icon {
    width: 80px !important;
    height: 80px !important;
    line-height: 1 !important; /* 重置行高，使用flexbox居中 */
    font-size: 30px !important;
    display: flex !important; /* 使用flexbox确保图标居中 */
    align-items: center !important; /* 垂直居中 */
    justify-content: center !important; /* 水平居中 */
  }
  
  /* 流程部分图标响应式优化 */
  .process .p-list .icon {
    width: 60px !important;
    height: 60px !important;
    line-height: 1 !important; /* 重置行高，使用flexbox居中 */
    font-size: 24px !important;
    display: flex !important; /* 使用flexbox确保图标居中 */
    align-items: center !important; /* 垂直居中 */
    justify-content: center !important; /* 水平居中 */
    overflow: hidden !important; /* 隐藏超出区域的图标部分 */
    margin: 1rem auto 0.5rem !important; /* 减少边距 */
  }
  
  /* 统计部分图标响应式优化 */
  .counts .counting-icon i {
    font-size: 1.8rem !important;
    display: flex !important; /* 使用flexbox确保图标居中 */
    align-items: center !important; /* 垂直居中 */
    justify-content: center !important; /* 水平居中 */
  }
  
  /* 服务部分图标响应式优化 */
  .content-box-icon i {
    width: 80px !important;
    height: 80px !important;
    line-height: 1 !important; /* 重置行高，使用flexbox居中 */
    font-size: 3rem !important;
    display: flex !important; /* 使用flexbox确保图标居中 */
    align-items: center !important; /* 垂直居中 */
    justify-content: center !important; /* 水平居中 */
  }
}

/* 超小屏幕设备优化 */
@media (max-width: 480px) {
  /* 关于我们列表部分图标超小屏幕优化 */
  .about-list .about-item .icon {
    width: 70px !important;
    height: 70px !important;
    line-height: 1 !important; /* 重置行高，使用flexbox居中 */
    font-size: 25px !important;
    display: flex !important; /* 使用flexbox确保图标居中 */
    align-items: center !important; /* 垂直居中 */
    justify-content: center !important; /* 水平居中 */
  }
  
  /* 流程部分图标超小屏幕优化 */
  .process .p-list .icon {
    width: 50px !important;
    height: 50px !important;
    line-height: 1 !important; /* 重置行高，使用flexbox居中 */
    font-size: 20px !important;
    display: flex !important; /* 使用flexbox确保图标居中 */
    align-items: center !important; /* 垂直居中 */
    justify-content: center !important; /* 水平居中 */
    overflow: hidden !important; /* 隐藏超出区域的图标部分 */
    margin: 0.8rem auto 0.3rem !important; /* 减少边距 */
  }
  
  /* 统计部分图标超小屏幕优化 */
  .counts .counting-icon i {
    font-size: 1.6rem !important;
    display: flex !important; /* 使用flexbox确保图标居中 */
    align-items: center !important; /* 垂直居中 */
    justify-content: center !important; /* 水平居中 */
  }
  
  /* 服务部分图标超小屏幕优化 */
  .content-box-icon i {
    width: 70px !important;
    height: 70px !important;
    line-height: 1 !important; /* 重置行高，使用flexbox居中 */
    font-size: 2.5rem !important;
    display: flex !important; /* 使用flexbox确保图标居中 */
    align-items: center !important; /* 垂直居中 */
    justify-content: center !important; /* 水平居中 */
  }
}

/* 博客部分meta信息图标垂直居中 */
.blog-item .post-meta ul li {
  display: flex; /* 使用flexbox布局 */
  align-items: center; /* 垂直居中 */
  gap: 5px; /* 图标与文字之间的间距 */
}

.blog-item .post-meta ul li i {
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  line-height: 1; /* 重置行高，使用flexbox居中 */
  font-size: 12px; /* 保持原有字体大小 */
  color: #353434; /* 保持原有颜色 */
}

/* 响应式优化 - 小屏幕设备 */
@media (max-width: 768px) {
  .blog-item .post-meta ul li {
    justify-content: center; /* 在小屏幕上居中对齐 */
  }
  
  .blog-item .post-meta ul li i {
    font-size: 11px !important;
  }
}

/* 超小屏幕设备优化 */
@media (max-width: 480px) {
  .blog-item .post-meta ul li {
    justify-content: center; /* 在超小屏幕上居中对齐 */
  }
  
  .blog-item .post-meta ul li i {
    font-size: 10px !important;
  }
}

/* 导航栏图标垂直居中 */
.navbar .icon-bar {
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
}

.navbar .icon-bar i {
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  line-height: 1; /* 重置行高，使用flexbox居中 */
}

/* 返回顶部按钮图标垂直居中 */
#scroll-to-top {
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
}

#scroll-to-top i {
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  line-height: 1; /* 重置行高，使用flexbox居中 */
  font-size: 16px;
  color: #fff;
}

/* 作品集搜索图标垂直居中 */
.portfolio .port-caption .view-more a {
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  width: 100%;
  height: 100%;
}

.portfolio .port-caption .view-more i {
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  line-height: 1; /* 重置行高，使用flexbox居中 */
  color: #fff;
}

/* 响应式优化 - 小屏幕设备 */
@media (max-width: 768px) {
  .navbar .icon-bar i {
    font-size: 1.5rem !important;
  }
  
  #scroll-to-top i {
    font-size: 14px !important;
  }
}

/* 超小屏幕设备优化 */
@media (max-width: 480px) {
  .navbar .icon-bar i {
    font-size: 1.3rem !important;
  }
  
  #scroll-to-top i {
    font-size: 12px !important;
  }
}

/* 业务流程区域图标与标题位置居中优化 */
.process {
  background: #d8d7d79c; }

/* 流程部分容器居中优化 */
.process .row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center; /* 水平居中排列 */
  align-items: stretch; /* 确保所有卡片高度一致 */
  margin: 0 -15px; /* 重置默认边距 */
}

/* 流程部分列容器居中优化 */
.process .col-lg-3,
.process .col-md-6,
.process .col-sm-6 {
  display: flex;
  flex-direction: column;
  padding: 0 15px; /* 添加列间距 */
  margin-bottom: 30px; /* 添加行间距 */
  justify-content: center; /* 垂直居中 */
}

.process .p-list {
  text-align: center;
  border-radius: 4px;
  padding: 30px 20px; /* 增加上下内边距 */
  display: flex; /* 使用flexbox布局 */
  flex-direction: column; /* 垂直排列 */
  align-items: center; /* 水平居中 */
  justify-content: center; /* 垂直居中 */
  height: 100%; /* 占满容器高度 */
  background: #fff; /* 添加白色背景 */
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* 添加阴影效果 */
  transition: all 0.3s ease; /* 添加过渡效果 */
}

.process .p-list:hover {
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15); /* 悬停时增强阴影 */
  transform: translateY(-5px); /* 悬停时轻微上移 */
}

.process .p-list .icon {
  display: flex; /* 使用flexbox确保图标居中 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
  position: relative;
  cursor: pointer;
  margin: 0 auto 2rem; /* 居中并添加底部间距 */
  width: 100px;
  height: 100px;
  box-shadow: 0 2px 2px #3999f2;
  padding: 10px;
  color: #353434;
  font-size: 45px;
  line-height: 1; /* 重置行高，使用flexbox居中 */
  border-radius: 50px;
  -moz-border-radius: 50px;
  -webkit-border-radius: 50px;
  background: #fff; /* 确保图标背景为白色 */
  -moz-transition: -moz-transform 1s, cubic-bezier(0.075, 0.82, 0.165, 1) ease 0.4s;
  -o-transition: -o-transform 1s, cubic-bezier(0.075, 0.82, 0.165, 1) ease 0.4s;
  -webkit-transition: -webkit-transform 1s, cubic-bezier(0.075, 0.82, 0.165, 1) ease 0.4s;
  transition: transform 1s, cubic-bezier(0.075, 0.82, 0.165, 1) ease 0.4s; }

.process .p-list .icon:hover {
  -moz-transform: translateY(-10px);
  -ms-transform: translateY(-10px);
  -webkit-transform: translateY(-10px);
  transform: translateY(-10px); }

.process .p-list h6 {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 15px; /* 增加底部间距 */
  color: #001942; /* 使用主题色 */
  text-align: center; /* 确保标题居中 */
  width: 100%; /* 确保标题占满宽度 */
}

.process .p-list p {
  font-size: 15px;
  line-height: 1.6; /* 增加行高提高可读性 */
  color: #666; /* 使用灰色提高对比度 */
  text-align: center; /* 确保描述文字居中 */
  width: 100%; /* 确保描述文字占满宽度 */
  margin: 0; /* 移除默认边距 */
}

/* 响应式优化 - 小屏幕设备 */
@media (max-width: 768px) {
  .process .p-list {
    padding: 20px 15px; /* 减少内边距 */
    margin-bottom: 20px; /* 减少底部间距 */
  }
  
  .process .p-list .icon {
    width: 80px !important;
    height: 80px !important;
    line-height: 1 !important; /* 重置行高，使用flexbox居中 */
    font-size: 35px !important;
    margin-bottom: 1.5rem !important; /* 减少底部间距 */
  }
  
  .process .p-list h6 {
    font-size: 14px !important;
    margin-bottom: 12px !important;
  }
  
  .process .p-list p {
    font-size: 13px !important;
    line-height: 1.5 !important;
  }
}

/* 超小屏幕设备优化 */
@media (max-width: 480px) {
  .process .p-list {
    padding: 15px 10px; /* 进一步减少内边距 */
  }
  
  .process .p-list .icon {
    width: 70px !important;
    height: 70px !important;
    line-height: 1 !important; /* 重置行高，使用flexbox居中 */
    font-size: 30px !important;
    margin-bottom: 1rem !important; /* 减少底部间距 */
  }
  
  .process .p-list h6 {
    font-size: 13px !important;
    margin-bottom: 10px !important;
  }
  
  .process .p-list p {
    font-size: 12px !important;
    line-height: 1.4 !important;
  }
}