/* TERRAUR 定制样式（由静态稿 index.html 内联样式抽取，勿手改静态稿回填） */

.header-wrap .header-bottom {
  height: 90px !important;
  display: flex;
  align-items: center;
}

.header-wrap .header-bottom .container,
.header-wrap .header-bottom .navbar {
  height: 100% !important;
  min-height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.header-wrap .navbar .navbar-nav .nav-item a {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

.main.page-wrapper {
  margin-top: 90px !important;
}

@media only screen and (min-width: 1200px) {
  .slider-area.style-one .slider-carousel .slide-item {
    min-height: 700px;
    display: flex;
    align-items: center;
  }

  .slider-area.style-one .slider-carousel .slide-item .auto-container {
    width: 100%;
  }
}

.single-cat-box {
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 8px 30px rgba(0, 67, 136, .08);
  margin-bottom: 30px;
  transition: transform .4s ease, box-shadow .4s ease;
}

.single-cat-box:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 40px rgba(0, 67, 136, .15);
}

.single-cat-box>a {
  position: relative;
  display: block;
}

.single-cat-box>a img {
  width: 100%;
  height: 300px;
  object-fit: cover;
  display: block;
}

.single-cat-box .cat-name {
  position: relative;
  background: var(--mainColor, #004388);
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: .5px;
  text-align: left;
  padding: 16px 20px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: background .3s ease;
}

.single-cat-box:hover .cat-name,
.single-cat-box .cat-name:hover {
  background: var(--secondaryColor, #00a6e2);
}

.single-cat-box .cat-arrow {
  width: 10px;
  height: 10px;
  display: inline-block;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
  transition: transform .3s ease;
  margin-left: 12px;
  flex: none;
}

.single-cat-box.closed .cat-arrow {
  transform: rotate(-45deg);
}

.single-cat-box .content {
  transition: max-height .45s ease, padding .45s ease;
  overflow: hidden;
}

.single-cat-box.closed .content {
  max-height: 0 !important;
  padding-top: 0;
  padding-bottom: 0;
}

.single-cat-box .content {
  padding: 20px 24px 24px;
}

.single-cat-box .cat-list {
  list-style: none;
  margin: 0 0 14px;
  padding: 0;
}

.single-cat-box .cat-list li {
  position: relative;
  padding: 0;
  font-size: 15px;
  color: #333;
  border-bottom: 1px solid #eef2f6;
}

.single-cat-box .cat-list li a {
  display: block;
  padding: 8px 0 8px 20px;
  color: #333;
  text-decoration: none;
  -webkit-transition: color .3s ease, padding-left .3s ease;
  -moz-transition: color .3s ease, padding-left .3s ease;
  -ms-transition: color .3s ease, padding-left .3s ease;
  -o-transition: color .3s ease, padding-left .3s ease;
  transition: color .3s ease, padding-left .3s ease;
}

.single-cat-box .cat-list li a:hover {
  color: var(--secondaryColor, #00a6e2);
  padding-left: 26px;
}

.single-cat-box .cat-list li:last-child {
  border-bottom: 0;
}

.single-cat-box .cat-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 15px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--secondaryColor, #00a6e2);
}

.single-cat-box .link-btn {
  font-size: 15px;
  font-weight: 600;
  color: var(--mainColor, #004388);
  text-transform: uppercase;
  letter-spacing: .5px;
}

.single-cat-box .link-btn:hover {
  color: var(--secondaryColor, #00a6e2);
}

.single-solution-box {
  position: relative;
  border-radius: 7px;
  margin-bottom: 30px;
  -webkit-perspective: 1000px;
  perspective: 1000px;
}

.single-solution-box .solution-front-part,
.single-solution-box .solution-back-part {
  border-radius: 7px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transition-duration: 500ms;
  transition-duration: 500ms;
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
}

.single-solution-box .solution-front-part {
  background: linear-gradient(to left top, #e6f1fb, #d8ebf9, #cce6f8, #dff0fa, #eef7fd);
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
}

.single-solution-box .solution-back-part {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to top, #dceefc, #e7f3fd, #d5e9fa, #c4e2f7, #b3daf4);
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

.single-solution-box:hover .solution-front-part {
  -webkit-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
}

.single-solution-box:hover .solution-back-part {
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
}

.single-solution-box .solution-front-part .content {
  padding: 45px 28px;
}

.single-solution-box .solution-front-part .content .solution-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--mainColor, #004388);
  color: #fff;
  font-size: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
}

.single-solution-box .solution-front-part .content h3 {
  font-size: 28px;
  font-weight: 700;
  color: var(--headingColor, #1F2730);
  margin-bottom: 12px;
}

.single-solution-box .solution-front-part .content p {
  font-size: 16px;
  color: #666;
  line-height: 1.6;
  margin-bottom: 0;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.single-solution-box .image {
  height: 100%;
}

.single-solution-box .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.single-solution-box .solution-back-part .content {
  padding: 38px 28px 24px;
}

.single-solution-box .solution-back-part .content h3 {
  font-size: 28px;
  font-weight: 700;
  color: var(--headingColor, #1F2730);
  margin-bottom: 12px;
}

.single-solution-box .solution-back-part .content p {
  font-size: 16px;
  color: #666;
  line-height: 1.6;
  margin-bottom: 12px;
}

.single-solution-box .solution-back-part .content .link-btn {
  background: var(--mainColor, #004388);
  color: #fff;
  display: inline-block;
  padding: 10px 30px;
  border-radius: 5px;
  font-size: 14px;
  font-weight: 500;
}

.single-solution-box .solution-back-part .content .link-btn:hover {
  background: var(--secondaryColor, #00a6e2);
  color: #fff;
}

/* TERRAUR 解决方案 4 卡：back 内容紧凑 */
.single-solution-box {
  height: 400px;
}

.single-solution-box .solution-front-part {
  height: 100%;
}

.single-solution-box .solution-front-part .row {
  height: 100%;
}

.single-solution-box .solution-back-part .row {
  height: 100%;
}

.about-area .about-image img {
  width: 100%;
  border-radius: 8px;
  display: block;
}

.about-content .about-slogan {
  font-size: 32px;
  font-weight: 400;
  color: var(--mainColor, #004388);
  margin-bottom: 8px;
}

.about-content .about-sub-slogan {
  font-size: 24px;
  font-weight: 400;
  color: #333333;
  letter-spacing: .5px;
  margin-bottom: 16px;
}

.about-content .about-lead {
  font-size: 16px;
  color: #555;
  line-height: 1.7;
  margin-bottom: 14px;
}

.about-content .about-lead-2 {
  font-size: 16px;
}

.single-about-advantage {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  background: #F4F6F8;
  border-radius: 6px;
  padding: 16px 14px;
  margin-bottom: 18px;
}

.single-about-advantage .about-adv-icon {
  width: 38px;
  height: 38px;
  flex: none;
  border-radius: 50%;
  background: var(--mainColor, #004388);
  color: #fff;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.single-about-advantage h4 {
  font-size: 18px;
  font-weight: 400;
  color: #333333;
  margin-bottom: 4px;
}

.single-about-advantage p {
  font-size: 16px;
  color: #666;
  line-height: 1.5;
  margin-bottom: 0;
}

.product-box .content {
  padding: 18px 12px;
  text-align: center;
}

.product-box h3 {
  font-size: 14.5px;
  line-height: 1.45;
  margin-bottom: 0;
  color: var(--headingColor, #1F2730);
}

.product-box>a {
  display: block;
  border: 1px solid #dddddd;
  border-radius: 5px 5px 0 0;
  overflow: hidden;
  background: #fff;
}

.product-box img {
  display: block;
  width: 100%;
}

.inquiry-form {
  background: #F4F6F8;
  border-radius: 8px;
  padding: 30px 28px;
  height: 100%;
}

.faq-accordion {
  height: 100%;
  flex: 1 1 0%;
  width: 100%;
}

.faq-accordion ul.accordion,
.faq-accordion .accordion-title {
  width: 100%;
}

.inquiry-form .inquiry-title {
  font-size: 24px;
  font-weight: 700;
  color: var(--headingColor, #1F2730);
  margin-bottom: 8px;
}

.inquiry-form .inquiry-tip {
  font-size: 16px;
  color: #666;
  margin-bottom: 20px;
}

.inquiry-form .form-control {
  width: 100%;
  border: 1px solid #d9dee3;
  border-radius: 5px;
  padding: 10px 14px;
  font-size: 16px;
  color: #333;
  background: #fff;
  margin-bottom: 14px;
}

.inquiry-form .btn.style1 {
  font-size: 16px;
}

.inquiry-form .form-control:focus {
  outline: none;
  border-color: var(--secondaryColor, #00a6e2);
}

.single-solution-box .solution-front-part .content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.single-solution-box .solution-back-part .content {
  padding: 24px 24px 12px;
}

.single-solution-box .solution-back-part .content h3 {
  margin-bottom: 6px;
}

.single-solution-box .solution-back-part .content p {
  font-size: 16px;
  line-height: 1.5;
  margin-bottom: 8px;
}

.single-solution-box .solution-back-part .content .link-btn {
  padding: 6px 22px;
  font-size: 13px;
}

@media only screen and (max-width:767px) {
  .single-solution-box {
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
    height: auto;
  }

  .single-solution-box .image {
    height: auto;
  }
}

/* TERRAUR 轮播调整：标语靠右（左端对齐 logo 列）；主标语一行；副标语 2 行；蒙版左→右渐变 */
.slider-area.style-one .slider-carousel .slide-item {
  display: flex;
  align-items: center;
}

.slider-area.style-one .slider-carousel .slide-item .auto-container {
  width: 100%;
  display: flex;
  justify-content: flex-start;
}

.slider-area.style-one .slider-content-box {
  max-width: 100%;
  text-align: left;
}

.slider-area.style-one .slider-carousel .slider-content-box h1 {
  font-size: 76px;
  line-height: 86px;
  font-weight: 400;
  letter-spacing: 1px;
  padding-bottom: 0;
  margin-bottom: 22px;
}

.slider-area.style-one .slider-carousel .slider-content-box .slider-eyebrow {
  display: block;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.78);
  margin-bottom: 16px;
}

.slider-area.style-one .slider-carousel .slider-content-box h1:before {
  display: none;
}

.slider-area.style-one .slider-content-box {
  width: 1320px;
  max-width: 1320px;
  flex: none;
}

.slider-area.style-one .btn-box {
  text-align: left;
}

@media only screen and (min-width: 1200px) {
  .slider-area.style-one .slider-carousel .slider-content-box {
    margin-left: -175px;
  }
}

.slider-carousel .slide-item .image-layer {
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: none;
  transition: none;
}

.slider-carousel .active .slide-item .image-layer {
  -webkit-transform: scale(1);
  transform: scale(1);
}

.slider-area.style-one .slider-carousel .slider-content-box p {
  font-size: 20px;
  line-height: 32px;
  margin-bottom: 30px;
}

.slider-area.style-one .slider-carousel .slide-item:before {
  opacity: 1;
  background: rgba(0, 20, 50, 0.6);
}

.slider-area.style-one .slider-carousel .slider-content-box h1 {
  color: #ffffff;
}

.slider-area.style-one .slider-carousel .slider-content-box p {
  color: #ffffff;
}

.slider-area.style-one .btn-box {
  text-align: left;
}

.slider-area.style-one .slider-carousel .btn-box .btn.style2 {
  background-color: transparent;
  border: 1px solid rgba(255, 255, 255, 0.9);
  color: #ffffff;
}

.slider-area.style-one .slider-carousel .btn-box .btn.style2:after,
.slider-area.style-one .slider-carousel .btn-box .btn.style2:before {
  background: #ffffff;
}

.slider-area.style-one .slider-carousel .btn-box .btn.style2:hover {
  background-color: #ffffff;
  color: #004388;
}

/* TERRAUR v4.0: custom process band */
.process-area {
  position: relative;
  overflow: hidden;
  min-height: 450px;
  height: auto;
  display: flex;
  align-items: center;
}

.process-area .process-bg {
  position: absolute;
  inset: 0;
  background: url('../image/hero/dz.jpg') center/cover no-repeat;
}

.process-area .process-bg:after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 25, 60, 0.88), rgba(0, 25, 60, 0.7) 45%, rgba(0, 25, 60, 0.5));
}

.process-area .container {
  position: relative;
  z-index: 2;
}

.process-area .section-title {
  margin-bottom: 30px;
}

.process-area .section-title h2 {
  color: #fff;
  font-size: 30px;
}

.process-area .section-title p {
  color: rgba(255, 255, 255, 0.85);
  font-size: 15px;
}

.process-col {
  display: flex;
}

.process-step {
  position: relative;
  width: 100%;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 8px;
  padding: 16px 10px 14px;
  text-align: center;
  margin: 6px 5px;
  transition: all .3s ease;
}

.process-step:hover {
  background: rgba(255, 255, 255, 0.16);
  border-color: #00a6e2;
  transform: translateY(-4px);
}

.process-num {
  position: absolute;
  top: 8px;
  right: 10px;
  font-size: 13px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.45);
}

.process-icon {
  width: 46px;
  height: 46px;
  line-height: 46px;
  border-radius: 50%;
  background: #00a6e2;
  color: #fff;
  font-size: 23px;
  margin: 0 auto 10px;
}

.process-step h4 {
  color: #fff;
  font-size: 17px;
  font-weight: 600;
  margin: 0 0 6px;
}

.process-step p {
  color: rgba(255, 255, 255, 0.78);
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
}

.footer-logo img {
  width: 300px;
  max-width: 300px !important;
}

.footer-bottom .container .row {
  -webkit-box-pack: center;
  justify-content: center;
}

.footer-bottom .container .row [class*="col-"] {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  width: auto;
  max-width: 100%;
}

.footer-bottom .copyright-text {
  text-align: center;
  margin: 0;
}

.footer-bottom .social-profile {
  -webkit-box-pack: center;
  justify-content: center;
}

.footer-bottom .container .row {
  position: relative;
}

.footer-bottom .container .row>[class*="col-"]:first-child {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  width: 100%;
  max-width: 100%;
}

.footer-bottom .copyright-text {
  text-align: center;
  margin: 0;
}

.footer-bottom .social-profile {
  position: absolute;
  right: 15px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.process-area .section-title::after {
  display: none;
}

.accordion-area {
  /* margin-top: 100px; */
}

.nav-item.mega-parent {
  position: relative;
}

.navbar-nav .dropdown-menu.mega-menu {
  display: flex;
  flex-wrap: wrap;
  width: 760px;
  padding: 18px 14px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.mega-menu .mega-col {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 33.33%;
  flex: 0 0 33.33%;
  max-width: 33.33%;
  padding: 0 8px;
}

.mega-menu .mega-title {
  display: block;
  font-weight: 700;
  color: var(--headingColor, #1F2730);
  font-size: 15px;
  padding: 6px 4px;
  margin-bottom: 6px;
  border-bottom: 1px solid var(--secondaryColor, #00a6e2);
}

.mega-menu .mega-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mega-menu .mega-list li a {
  display: block;
  padding: 5px 4px;
  font-size: 13px;
  color: #555;
  text-decoration: none;
}

.mega-menu .mega-list li a:hover {
  color: var(--secondaryColor, #00a6e2);
}

.faq-row {
  max-width: 1300px;
  margin: 0 auto;
}

/* 不写 display:flex !important：<=991px 由 main.js 的 slideUp/slideDown
   控制默认收起与点箭头展开；桌面需要的 !important 见文件末尾 min-width:992px 段。 */
.header-wrap .navbar .navbar-nav .nav-item .dropdown-menu.mega-menu {
  flex-wrap: wrap;
  width: 760px;
  padding: 18px 14px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.header-wrap .navbar .navbar-nav .nav-item:hover .dropdown-menu.mega-menu {
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.header-wrap .navbar .navbar-nav .nav-item .dropdown-menu.mega-menu .mega-col {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 33.33%;
  flex: 0 0 33.33%;
  max-width: 33.33%;
  padding: 0 8px;
}

.header-wrap .navbar .navbar-nav .nav-item .dropdown-menu.mega-menu .mega-title {
  display: block;
  font-weight: 700;
  color: var(--headingColor, #1F2730);
  font-size: 15px;
  padding: 6px 4px;
  margin: 0 0 6px;
  border-bottom: 1px solid var(--secondaryColor, #00a6e2);
  background: none;
}

.header-wrap .navbar .navbar-nav .nav-item .dropdown-menu.mega-menu .mega-title:before {
  display: none;
}

.header-wrap .navbar .navbar-nav .nav-item .dropdown-menu.mega-menu .mega-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.header-wrap .navbar .navbar-nav .nav-item .dropdown-menu.mega-menu .mega-list li {
  margin: 0;
}

.header-wrap .navbar .navbar-nav .nav-item .dropdown-menu.mega-menu .mega-list li a {
  display: block;
  padding: 5px 4px;
  font-size: 13px;
  color: #555;
  font-weight: 400;
  background: none;
}

.header-wrap .navbar .navbar-nav .nav-item .dropdown-menu.mega-menu .mega-list li a:before {
  display: none;
}

.header-wrap .navbar .navbar-nav .nav-item .dropdown-menu.mega-menu .mega-list li a:hover {
  color: var(--secondaryColor, #00a6e2);
  padding-left: 4px;
}

.hotel-area {
  /* margin-top: 30px; */
}

.header-wrap .navbar .navbar-nav .nav-link {
  font-size: 18px;
}

.header-wrap .navbar .navbar-nav>.nav-item>a {
  font-size: 18px;
}

@media only screen and (min-width: 1200px) {
  .footer-wrap .footer-top .row>[class*="col-"]:nth-child(2) {
    padding-left: 148px !important;
  }
}

.process-cta {
  margin-top: 34px;
  text-align: center;
}

.process-btn {
  display: inline-block;
  padding: 12px 36px;
  background: #00a6e2;
  color: #ffffff;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: .4px;
  border-radius: 4px;
  text-decoration: none;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}

.process-btn:hover {
  background: #ffffff;
  color: #004388;
}

/* ================================================================
   TERRAUR x WordPress 头尾适配
   ================================================================ */

/* 社媒从 footer-bottom 移到第一个 widget 后，改为常规行内排列 */
.footer-widget .social-profile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  gap: 10px;
  margin: 22px 0 0;
  padding: 0;
  position: static;
  -webkit-transform: none;
  transform: none;
}

/* 版权行独占一行居中（社媒已移走） */
.footer-bottom .container .row>[class*="col-"] {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  width: 100%;
  max-width: 100%;
}

.footer-bottom .copyright-text {
  text-align: center;
  margin: 0;
}

/* 后台菜单输出的 mega menu 内，长分类名允许换行 */
.navbar-nav .dropdown-menu.mega-menu .mega-list li a {
  white-space: normal;
}

/* ═══════════════════════════════════════════════════════════
   TERRAUR 轮播自适应修正（2026-11-05）
   桌面端 .slider-content-box 锁 1320px 定宽，中小屏把原版响应式
   断点全部盖死导致文字溢出屏幕；按原版梯度恢复自适应。
   ═══════════════════════════════════════════════════════════ */
@media only screen and (max-width: 1199px) {
  .slider-area.style-one .slider-content-box {
    width: auto;
    max-width: 100%;
    flex: 0 1 auto;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-area.style-one .slider-carousel .slider-content-box h1 {
    font-size: 50px;
    line-height: 65px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-area.style-one .slider-carousel .slider-content-box h1 {
    font-size: 30px;
    line-height: 45px;
  }
}

@media only screen and (max-width: 767px) {
  .slider-area.style-one .slider-carousel .slide-item .auto-container {
    max-width: 100%;
  }

  .slider-area.style-one .slider-carousel .slider-content-box h1 {
    font-size: 24px;
    line-height: 34px;
  }

  .slider-area.style-one .slider-carousel .slider-content-box p {
    font-size: 15px;
    line-height: 24px;
    margin-bottom: 20px;
  }

  .slider-area.style-one .slider-carousel .slider-content-box .slider-eyebrow {
    font-size: 11px;
    letter-spacing: 2.5px;
    margin-bottom: 10px;
  }

  /* 双按钮在窄屏换行，不横向溢出 */
  .slider-area.style-one .btn-box .btn {
    margin: 0 8px 12px 0;
  }
}

/* 产品卡片图片统一比例，避免后台图片比例不一破版 */
.product-box>a img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

/* ═══ Solutions 卡片：整卡为 <a> 链接、去除翻转动画、底部按钮 ═══ */
a.single-solution-box {
  display: block;
  color: inherit;
  text-decoration: none;
}

.single-solution-box:hover .solution-front-part {
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
}

a.single-solution-box:hover {
  box-shadow: 0 10px 24px rgba(0, 67, 136, 0.14);
}

.single-solution-box .solution-front-part .content .link-btn {
  display: inline-block;
  margin-top: 15px;
  font-size: 14px;
  font-weight: 500;
  color: var(--mainColor);
  border-bottom: 2px solid var(--mainColor);
  padding-bottom: 3px;
  transition: var(--transition);
}

.single-solution-box:hover .solution-front-part .content .link-btn {
  letter-spacing: 1px;
}

/* ═══ 内页 Banner（产品归档/分类页，静态稿 products.html）═══ */
.inner-banner {
  position: relative;
  height: 320px;
  background-color: #00294f;
  /* 图片加载中/图下的底色 */
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
}

/* 无图兜底：不放占位图，直接给深蓝渐变底色 */
.inner-banner.no-image {
  background: linear-gradient(90deg, #00294f 0%, #004388 70%, #005a9e 100%);
}

.inner-banner:before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 25, 60, .85) 0%, rgba(0, 25, 60, .55) 60%, rgba(0, 25, 60, .35) 100%);
}

.inner-banner.no-image:before {
  background: none;
}

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

.inner-banner h1,
.inner-banner h2 {
  font-size: 44px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px;
}

/* 面包屑：theme_breadcrumbs() 输出的 ul > li 结构 */
.inner-banner .breadcumb-inner ul {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 14px;
  color: rgba(255, 255, 255, .75);
}

.inner-banner .breadcumb-inner li {
  display: inline-block;
  vertical-align: middle;
  line-height: 1;
}

.inner-banner .breadcumb-inner li a {
  color: rgba(255, 255, 255, .85);
  text-decoration: none;
  transition: color .2s ease;
}

.inner-banner .breadcumb-inner li a:hover {
  color: #00a6e2;
}

/* 分隔符图标（ri-arrow-right-s-line） */
.inner-banner .breadcumb-inner li i {
  position: relative;
  top: 2px;
  margin: 0 8px;
  font-size: 16px;
  color: rgba(255, 255, 255, .55);
}

/* 末级当前页（纯文本 li） */
.inner-banner .breadcumb-inner li:last-child {
  color: rgba(255, 255, 255, .75);
}

/* ═══ 产品列表页：简介条 + 主体（静态稿 products.html）═══ */
.products-intro {
  padding: 50px 0 30px;
  background: #fff;
}

.products-intro h2 {
  font-size: 30px;
  font-weight: 700;
  color: #1F2730;
  margin-bottom: 14px;
}

.products-intro p {
  font-size: 16px;
  color: #555;
  line-height: 1.8;
  max-width: 960px;
  margin-bottom: 0;
}

.products-body {
  padding: 40px 0 70px;
  background: #F4F6F8;
}

.products-body .row {
  --bs-gutter-x: 30px;
}

/* 产品矩阵（右侧）：白框卡片，1:1 图 */
.prod-matrix .prod-thumb {
  background: #fff;
  border: 1px solid #dddddd;
  border-radius: 5px;
  overflow: hidden;
  margin-bottom: 24px;
  transition: box-shadow .3s ease, transform .3s ease;
}

.prod-matrix .prod-thumb:hover {
  box-shadow: 0 10px 24px rgba(0, 67, 136, .12);
  transform: translateY(-4px);
}

.prod-matrix .prod-thumb img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
  border-bottom: 1px solid #eeeeee;
}

.prod-matrix .prod-thumb .prod-name {
  padding: 14px 12px 16px;
  text-align: center;
  font-size: 16px;
  color: #1F2730;
  line-height: 1.45;
  font-weight: 500;
}

.prod-matrix .prod-thumb a {
  text-decoration: none;
  color: inherit;
  display: block;
}

.prod-matrix .prod-thumb a:hover .prod-name {
  color: #004388;
}

/* 空列表提示 */
.products-empty {
  background: #fff;
  border: 1px solid #e2e7eb;
  border-radius: 8px;
  padding: 60px 20px;
  text-align: center;
  color: #6b7683;
  font-size: 16px;
}

.products-empty p {
  margin: 0;
}

/* ═══ 分类侧栏（左侧）：可折叠两级树 ═══ */
.prod-sidebar {
  background: #fff;
  border: 1px solid #e2e7eb;
  border-radius: 8px;
  overflow: hidden;
}

.prod-sidebar .sidebar-title {
  background: #004388;
  color: #fff;
  padding: 18px 22px;
  font-size: 20px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 10px;
}

.prod-sidebar .sidebar-title i {
  font-size: 24px;
}

.prod-sidebar .side-cat {
  border-bottom: 1px solid #eef2f6;
}

.prod-sidebar .side-cat:last-child {
  border-bottom: 0;
}

.prod-sidebar .side-cat-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 22px;
  font-size: 15px;
  font-weight: 600;
  color: #1F2730;
  transition: background .2s ease;
  user-select: none;
}

.prod-sidebar .side-cat-head:hover {
  background: #F4F6F8;
}

.prod-sidebar .side-cat-head .side-cat-link {
  color: inherit;
  text-decoration: none;
  flex: 1;
}

.prod-sidebar .side-cat-head .side-cat-link.active {
  color: #004388;
}

.prod-sidebar .side-cat-head .toggle {
  width: 26px;
  height: 26px;
  border: 1px solid #d9dee3;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  color: #6b7683;
  flex: none;
  cursor: pointer;
  transition: all .25s ease;
}

.prod-sidebar .side-cat.open .side-cat-head .toggle {
  background: #004388;
  border-color: #004388;
  color: #fff;
}

.prod-sidebar .side-sub {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease;
}

.prod-sidebar .side-cat.open .side-sub {
  max-height: 800px;
}

.prod-sidebar .side-sub li a {
  display: block;
  padding: 10px 22px 10px 36px;
  font-size: 14px;
  color: #555;
  text-decoration: none;
  border-left: 3px solid transparent;
  transition: all .2s ease;
}

.prod-sidebar .side-sub li a:hover,
.prod-sidebar .side-sub li a.active {
  color: #004388;
  background: #F4F6F8;
  border-left-color: #E87722;
}

/* ═══ 产品列表页响应式 ═══ */
@media only screen and (max-width: 991px) {
  .inner-banner {
    height: 220px;
  }

  .inner-banner h1,
  .inner-banner h2 {
    font-size: 28px;
  }

  .prod-sidebar {
    margin-bottom: 30px;
  }

  .products-intro h2 {
    font-size: 24px;
  }
}

/* 全站：header 为 90px 高的白色不透明绝对定位层，主体统一让出这段高度。
   首页曾靠 front-page.php 内自带的 .main.page-wrapper 让位，模板重写时该包装层连同
   闭合 div 一起被删，导致轮播图顶部 90px 被导航盖住 —— 这里补回等价让位。
   注意：不要再给首页加 .main 类，style.css 遗留的 .main.page-wrapper margin-top
   （90px 及各断点 160/180/290px）会与此叠加，反而把首屏推下去。 */
.page-wrapper {
  padding-top: 90px;
}

/* ═══ 产品内页（静态稿 product-detail.html + 竖排缩略图轮播）═══ */
.product-main {
  padding: 50px 0 60px;
  background: #fff;
}

/* 左：画廊 = 左大图 + 右竖排缩略图（上下箭头滑动）
   缩略图列用绝对定位：高度锁定为大图高度（gallery 高度只由大图决定），
   避免缩略图内容高度参与父级高度计算、与 Swiper「按容器高度算 slide 高度」
   形成正反馈回路（slide 高度会被棘轮式撑到数十万 px） */
.product-gallery {
  position: relative;
}

.product-gallery .pg-main {
  margin-right: 106px;
  /* 让出右侧缩略图列（92px + 14px 间距） */
  border: 1px solid #e2e7eb;
  border-radius: 6px;
  overflow: hidden;
  background: #fafafa;
}

.product-gallery .pg-main img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  display: block;
}

.product-gallery .pg-thumbs {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 92px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.product-gallery .pg-thumbs .swiper {
  flex: 1;
  min-height: 0;
  overflow: hidden !important;
}

.product-gallery .pg-thumbs .swiper-slide {
  height: auto;
  border: 2px solid #e2e7eb;
  border-radius: 4px;
  overflow: hidden;
  cursor: pointer;
  background: #fff;
  opacity: .65;
  transition: border-color .2s ease, opacity .2s ease;
}

.product-gallery .pg-thumbs .swiper-slide img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
}

.product-gallery .pg-thumbs .swiper-slide:hover {
  opacity: 1;
}

.product-gallery .pg-thumbs .swiper-slide-thumb-active {
  border-color: #004388;
  opacity: 1;
}

/* 缩略图上下箭头 */
.product-gallery .pg-thumb-nav {
  height: 28px;
  flex: none;
  border: 1px solid #d9dee3;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #6b7683;
  cursor: pointer;
  background: #fff;
  transition: all .2s ease;
  user-select: none;
}

.product-gallery .pg-thumb-nav:hover {
  background: #004388;
  border-color: #004388;
  color: #fff;
}

/* 无画廊单图 */
/* 无画廊单图：不缩略图列，取消让位 */
.product-gallery-single .pg-main {
  margin-right: 0;
}

.product-gallery-single .pg-main img {
  aspect-ratio: 1 / 1;
}

/* 右：产品信息 */
.product-info .product-title {
  font-size: 28px;
  font-weight: 700;
  color: #1F2730;
  line-height: 1.35;
  margin-bottom: 18px;
}

/* 短描述大盒子：后台输什么显示什么 */
.product-info .short-desc-box {
  background: #F4F6F8;
  border: 1px solid #e8ecf0;
  border-radius: 8px;
  padding: 24px 28px;
  min-height: 200px;
  margin-bottom: 24px;
  font-size: 15px;
  color: #555;
  line-height: 1.8;
}

.product-info .short-desc-box p:last-child {
  margin-bottom: 0;
}

.product-info .short-desc-box img {
  max-width: 100%;
  height: auto;
}

/* 分享按钮排 */
.product-info .share-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 26px;
}

.product-info .share-row .share-label {
  font-size: 14px;
  font-weight: 600;
  color: #1F2730;
  margin-right: 2px;
}

.product-info .share-row .share-btn {
  width: 36px;
  height: 36px;
  border: 1px solid #d9dee3;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  color: #6b7683;
  text-decoration: none;
  transition: all .25s ease;
}

.product-info .share-row .share-btn:hover {
  background: #004388;
  border-color: #004388;
  color: #fff;
  transform: translateY(-2px);
}

/* 询盘按钮 */
.product-info .btn-inquire {
  display: inline-block;
  background: #004388;
  color: #fff;
  padding: 14px 36px;
  border-radius: 5px;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  transition: background .2s;
  border: none;
}

.product-info .btn-inquire:hover {
  background: #003366;
  color: #fff;
}

.product-info .btn-inquire i {
  margin-right: 8px;
  position: relative;
  top: 1px;
}

/* 板块标题（详情描述 / 相关产品共用） */
.detail-heading {
  font-size: 24px;
  font-weight: 700;
  color: #1F2730;
  margin-bottom: 26px;
  padding-bottom: 12px;
  border-bottom: 2px solid #004388;
  display: inline-block;
}

/* 详情描述 */
.product-detail-block {
  margin-top: 10px;
}

.product-detail-block .product-details {
  font-size: 15px;
  color: #555;
  line-height: 1.9;
}

.product-detail-block .product-details img {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
  display: inline-block;
}

.product-detail-block .product-details h2,
.product-detail-block .product-details h3 {
  color: #1F2730;
  font-size: 20px;
  font-weight: 700;
  margin: 24px 0 12px;
}

/* 相关产品 */
.related-products {
  padding: 50px 0 70px;
  background: #F4F6F8;
}

/* ═══ 产品内页响应式：手机端保持「左大图 + 右竖排缩略图」，缩略图缩小 ═══ */
@media only screen and (max-width: 767px) {
  .product-main {
    padding: 34px 0 44px;
  }

  .product-gallery .pg-main {
    margin-right: 68px;
    /* 让出右侧缩略图列（58px + 10px 间距） */
  }

  .product-gallery .pg-thumbs {
    width: 58px;
    gap: 6px;
  }

  .product-gallery .pg-thumbs .swiper-slide {
    border-width: 1px;
  }

  .product-gallery .pg-thumb-nav {
    height: 22px;
    font-size: 16px;
  }

  .product-info {
    margin-top: 6px;
  }

  .product-info .product-title {
    font-size: 22px;
  }

  .product-info .short-desc-box {
    padding: 18px 16px;
    min-height: 0;
  }

  .product-info .btn-inquire {
    padding: 12px 26px;
  }

  .detail-heading {
    font-size: 20px;
  }
}
/* ═══ 解决方案内页（静态稿 blog-details-no-sidebar：无侧栏居中排版）═══ */
.solution-detail-inner {
  max-width: 860px;
  max-width: 1200px;
  margin: 0 auto;
}

.solution-detail-title {
  font-size: 30px;
  font-weight: 700;
  color: #1F2730;
  line-height: 1.4;
  margin-bottom: 24px;
}

/* 正文：全局 p（16px/1.8/#666）基础上补块级元素规则，图片由后台正文自行插入 */
.solution-detail-content {
  font-size: 16px;
  color: #666666;
  line-height: 1.8;
}

.solution-detail-content img {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
}

.solution-detail-content h2,
.solution-detail-content h3,
.solution-detail-content h4 {
  color: #1F2730;
  font-weight: 700;
  margin: 28px 0 14px;
}

.solution-detail-content h2 {
  font-size: 24px;
}

.solution-detail-content h3 {
  font-size: 20px;
}

.solution-detail-content ul,
.solution-detail-content ol {
  padding-left: 22px;
  margin-bottom: 16px;
}

.solution-detail-content ul li,
.solution-detail-content ol li {
  margin-bottom: 6px;
}

.solution-detail-content blockquote {
  border-left: 3px solid #004388;
  background: #F4F6F8;
  padding: 16px 22px;
  margin: 20px 0;
  color: #555;
}

.solution-detail-content a {
  color: #004388;
}

/* 底部：上下篇导航 + 分享 */
.solution-detail-bottom {
  margin-top: 44px;
  border-top: 1px solid #e2e7eb;
  padding-top: 28px;
}

.solution-post-nav {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 16px;
  margin-bottom: 28px;
}

.solution-post-nav .post-nav-item {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 18px;
  background: #F4F6F8;
  border: 1px solid #e8ecf0;
  border-radius: 6px;
  text-decoration: none;
  transition: all .25s ease;
}

.solution-post-nav .post-nav-item.next {
  justify-content: flex-end;
  text-align: right;
}

.solution-post-nav .post-nav-item i {
  font-size: 22px;
  color: #004388;
  flex: none;
}

.solution-post-nav .post-nav-item .post-nav-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.solution-post-nav .post-nav-item .post-nav-label {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #9aa4ae;
  margin-bottom: 3px;
}

.solution-post-nav .post-nav-item .post-nav-title {
  font-size: 14px;
  font-weight: 600;
  color: #1F2730;
  line-height: 1.45;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.solution-post-nav a.post-nav-item:hover {
  background: #004388;
  border-color: #004388;
}

.solution-post-nav a.post-nav-item:hover i,
.solution-post-nav a.post-nav-item:hover .post-nav-title {
  color: #fff;
}

.solution-post-nav a.post-nav-item:hover .post-nav-label {
  color: rgba(255, 255, 255, .7);
}

.solution-post-nav .post-nav-item.disabled {
  opacity: .55;
  cursor: default;
}

/* 分享排：与产品内页同一套视觉（圆形图标按钮，悬停深蓝） */
.solution-detail .share-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.solution-detail .share-row .share-label {
  font-size: 14px;
  font-weight: 600;
  color: #1F2730;
  margin-right: 2px;
}

.solution-detail .share-row .share-btn {
  width: 36px;
  height: 36px;
  border: 1px solid #d9dee3;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  color: #6b7683;
  text-decoration: none;
  transition: all .25s ease;
}

.solution-detail .share-row .share-btn:hover {
  background: #004388;
  border-color: #004388;
  color: #fff;
  transform: translateY(-2px);
}

/* ═══ 解决方案内页响应式 ═══ */
@media only screen and (max-width: 767px) {
  .solution-detail-title {
    font-size: 22px;
  }

  .solution-post-nav {
    flex-direction: column;
  }

  .solution-post-nav .post-nav-item.next {
    justify-content: flex-start;
    text-align: left;
  }
}

/* ═══ 关于我们 / 联系我们：Google 地图板块 ═══ */
.contact-map-section .contact-map-frame {
  border-radius: 8px;
  overflow: hidden;
  background: #eef2f7;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .08);
}

.contact-map-section .contact-map-frame iframe {
  display: block;
  width: 100%;
  height: 450px;
  border: 0;
}

@media only screen and (max-width: 767px) {
  .contact-map-section .contact-map-frame iframe {
    height: 300px;
  }
}

/* ═══ 移动端侧滑菜单：产品 mega 子菜单 ═══
   桌面版 .dropdown-menu.mega-menu 是 760px + left:50% + translateX(-50%) 的三列面板，
   在 <=991px 的侧滑菜单里会被挤出屏幕（左列整列跑到视口外、右列越过右边界）。
   这里重置布局（宽度自适应、取消居中位移、三列改单列）并补箭头展开态反馈；
   子菜单「默认收起 / 点箭头展开」由 main.js 的 slideUp/slideDown 接管。 */
@media only screen and (max-width: 991px) {
  .header-wrap .navbar .navbar-nav .nav-item .dropdown-menu.mega-menu,
  .header-wrap .navbar .navbar-nav .nav-item:hover .dropdown-menu.mega-menu {
    position: static;
    float: none;
    width: 100%;
    max-width: 100%;
    left: auto;
    right: auto;
    margin: 0;
    padding: 0 0 0 12px;
    background: transparent;
    border: 0;
    box-shadow: none;
    -webkit-transform: none;
    transform: none;
  }

  .header-wrap .navbar .navbar-nav .nav-item .dropdown-menu.mega-menu .mega-col {
    -webkit-box-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0;
  }

  .header-wrap .navbar .navbar-nav .nav-item .dropdown-menu.mega-menu .mega-title {
    font-size: 14px;
    padding: 8px 0 6px;
  }

  .header-wrap .navbar .navbar-nav .nav-item .dropdown-menu.mega-menu .mega-list li a {
    font-size: 13px;
    padding: 6px 0 6px 10px;
  }

  /* 箭头随展开态翻转，给「点箭头展开」一个可见反馈 */
  .header-wrap .navbar .navbar-nav .nav-item > .menu-expand i {
    -webkit-transition: -webkit-transform .25s ease;
    transition: transform .25s ease;
  }

  .header-wrap .navbar .navbar-nav .nav-item.menu-open > .menu-expand i {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
}

/* ═══ 桌面 mega 面板显示（>=992px）═══
   main.js 加载时会对所有 .dropdown-menu 执行 slideUp() 并写入 inline display:none；
   桌面 hover 必须靠 !important 压过它，mega 面板才会显示。
   这条规则只给桌面，<=991px 不加载，侧滑菜单即可保持「默认收起 / 点箭头展开」。 */
@media only screen and (min-width: 992px) {
  .header-wrap .navbar .navbar-nav .nav-item .dropdown-menu.mega-menu {
    display: flex !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   公共 CTA 组件（template-parts/cta.php）
   全站统一文案 + 两个固定按钮；蓝色圆角块收在 .container 内，非通宽。
   ═══════════════════════════════════════════════════════════ */
.terraur-cta {
  padding: 0 0 80px;
}

.terraur-cta-inner {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  padding: 56px 60px;
  border-radius: 18px;
  color: #fff;
  /* 蓝底上叠三层轻纹理：右上柔光 + 滤材方格网（横向/纵向）+ 主渐变 */
  background-color: #004388;
  background-image:
    radial-gradient(circle at 84% 8%, rgba(255, 255, 255, .16) 0, rgba(255, 255, 255, 0) 42%),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 26px),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 26px),
    linear-gradient(110deg, #00356d 0%, #004388 52%, #0a5aa8 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 18px 40px rgba(0, 40, 90, .16);
}

/* 装饰全部用伪元素实现，不增加组件 HTML；绝对定位不参与 flex 布局 */
.terraur-cta-inner::before,
.terraur-cta-inner::after {
  content: "";
  position: absolute;
  z-index: 0;
  pointer-events: none;
  display: block;
}

/* 右上角同心圆环：滤芯端面的意象，三层环 + 内圈 */
.terraur-cta-inner::before {
  width: 430px;
  height: 430px;
  top: -190px;
  right: -110px;
  border: 1px solid rgba(255, 255, 255, .20);
  border-radius: 50%;
  box-shadow:
    0 0 0 52px rgba(255, 255, 255, .045),
    0 0 0 104px rgba(255, 255, 255, .028),
    inset 0 0 0 52px rgba(255, 255, 255, .028);
}

/* 左下角斜向细线纹 + 滤芯孔隙点阵：与方格网叠出编织层次 */
.terraur-cta-inner::after {
  width: 330px;
  height: 145%;
  left: -70px;
  bottom: -45%;
  opacity: .26;
  background:
    radial-gradient(rgba(255, 255, 255, .55) 1px, transparent 1.6px) 0 0 / 18px 18px,
    repeating-linear-gradient(115deg, transparent 0 22px, rgba(255, 255, 255, .35) 22px 23px);
}

/* 文案与按钮始终压在纹理之上 */
.terraur-cta-copy,
.terraur-cta-actions {
  position: relative;
  z-index: 1;
}

.terraur-cta-copy {
  max-width: 660px;
}

.terraur-cta-title {
  margin: 0 0 12px;
  font-size: 32px;
  line-height: 1.3;
  font-weight: 700;
  color: #fff;
}

.terraur-cta-desc {
  margin: 0;
  font-size: 16px;
  line-height: 1.8;
  color: rgba(255, 255, 255, .82);
}

.terraur-cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  flex-shrink: 0;
}

.terraur-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 30px;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  transition: background-color .3s ease, color .3s ease, transform .3s ease, border-color .3s ease;
}

.terraur-cta-btn i {
  font-size: 15px;
}

.terraur-cta-btn--primary {
  background: #fff;
  color: #004388;
  border: 1px solid #fff;
}

.terraur-cta-btn--primary:hover {
  background: #f7a600;
  border-color: #f7a600;
  color: #fff;
  transform: translateY(-3px);
}

.terraur-cta-btn--secondary {
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .55);
}

.terraur-cta-btn--secondary:hover {
  background: rgba(255, 255, 255, .14);
  border-color: #fff;
  color: #fff;
  transform: translateY(-3px);
}

@media only screen and (max-width: 991px) {
  .terraur-cta {
    padding: 0 0 64px;
  }

  .terraur-cta-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 28px;
    padding: 44px 40px;
    border-radius: 16px;
  }

  .terraur-cta-title {
    font-size: 28px;
  }

  .terraur-cta-inner::before {
    width: 360px;
    height: 360px;
    top: -170px;
    right: -130px;
  }

  .terraur-cta-inner::after {
    opacity: .18;
  }
}

@media only screen and (max-width: 767px) {
  .terraur-cta {
    padding: 0 0 50px;
  }

  .terraur-cta-inner {
    padding: 36px 26px;
    border-radius: 14px;
    gap: 24px;
  }

  .terraur-cta-title {
    font-size: 23px;
    line-height: 1.4;
  }

  .terraur-cta-desc {
    font-size: 14px;
    line-height: 1.75;
  }

  .terraur-cta-actions {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .terraur-cta-btn {
    width: 100%;
    padding: 15px 24px;
  }

  /* 小屏把纹理收轻，避免与文案抢视线 */
  .terraur-cta-inner::before {
    width: 270px;
    height: 270px;
    top: -155px;
    right: -145px;
    opacity: .65;
    box-shadow:
      0 0 0 32px rgba(255, 255, 255, .04),
      0 0 0 64px rgba(255, 255, 255, .02),
      inset 0 0 0 32px rgba(255, 255, 255, .025);
  }

  .terraur-cta-inner::after {
    width: 210px;
    opacity: .12;
  }
}


/* ═══════════════════════════════════════════════════════════
   Custom & OEM 页面（page-custom-oem.php）
   ═══════════════════════════════════════════════════════════ */

/* 通用：空图片位（后续把块内 <i> 换成 <img> 即可） */
.oem-media {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 10px;
  background: linear-gradient(135deg, #e6edf6 0%, #f3f7fb 52%, #dfe9f5 100%);
  border: 1px solid rgba(0, 67, 136, .08);
}

.oem-media > i {
  font-size: 44px;
  color: rgba(0, 67, 136, .20);
}

.oem-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.oem-eyebrow {
  display: inline-block;
  margin-bottom: 14px;
  padding-left: 13px;
  border-left: 3px solid var(--secondaryColor, #00a6e2);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.8px;
  line-height: 1.2;
  color: var(--mainColor, #004388);
}

/* 1. Intro */
.oem-intro {
  padding: 82px 0 74px;
  background: #fff;
}

.oem-intro-copy {
  padding-right: 44px;
}

.oem-intro-copy h2 {
  margin: 0 0 20px;
  font-size: 38px;
  line-height: 1.28;
  font-weight: 700;
  color: var(--headingColor, #1F2730);
}

.oem-intro-copy p {
  margin: 0 0 16px;
  font-size: 15px;
  line-height: 1.9;
  color: #5a6572;
}

.oem-intro-copy p.oem-lead {
  font-size: 17px;
  line-height: 1.85;
  color: #3d4a58;
  font-weight: 500;
}

.oem-intro-points {
  list-style: none;
  margin: 26px 0 30px;
  padding: 0;
}

.oem-intro-points li {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 13px;
  font-size: 15px;
  font-weight: 600;
  color: var(--headingColor, #1F2730);
}

.oem-intro-points i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(0, 166, 226, .12);
  color: #00a6e2;
  font-size: 11px;
}

.oem-intro-btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.oem-intro-btn i {
  font-size: 13px;
}

.oem-intro-media {
  position: relative;
  padding-bottom: 24px;
}

.oem-media--intro {
  height: 430px;
}

.oem-media--inset {
  position: absolute;
  left: 16px;
  bottom: 0;
  width: 36%;
  height: 168px;
  border: 6px solid #fff;
  border-radius: 8px;
  box-shadow: 0 12px 32px rgba(0, 67, 136, .16);
  z-index: 2;
}

.oem-media--inset > i {
  font-size: 30px;
}

.oem-media-tag {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 2;
  min-width: 128px;
  padding: 14px 18px;
  border-radius: 12px 0 12px 0;
  background: var(--mainColor, #004388);
  color: #fff;
  text-align: center;
  box-shadow: 0 10px 26px rgba(0, 67, 136, .22);
}

.oem-media-tag span {
  display: block;
  font-size: 12px;
  letter-spacing: 1.4px;
  color: rgba(255, 255, 255, .75);
}

.oem-media-tag strong {
  display: block;
  margin-top: 3px;
  font-size: 17px;
  letter-spacing: 1px;
}

/* 2. 可定制项清单卡 */
.oem-options {
  padding-top: 64px;
  background: var(--bgColor, #F4F6F8);
}

.oem-option-card {
  position: relative;
  height: 100%;
  margin-bottom: 26px;
  padding: 30px 28px 26px;
  background: #fff;
  border-left: 3px solid var(--mainColor, #004388);
  border-radius: 0 8px 8px 0;
  box-shadow: 0 8px 24px rgba(0, 67, 136, .06);
  transition: transform .35s ease, box-shadow .35s ease;
  overflow: hidden;
}

.oem-option-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 38px rgba(0, 67, 136, .14);
}

.oem-option-num {
  position: absolute;
  top: 14px;
  right: 20px;
  font-size: 40px;
  font-weight: 800;
  line-height: 1;
  color: rgba(0, 67, 136, .07);
}

.oem-option-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  margin-bottom: 20px;
  border-radius: 12px 0 12px 0;
  background: rgba(0, 67, 136, .07);
  color: var(--mainColor, #004388);
  font-size: 22px;
  transition: background-color .35s ease, color .35s ease;
}

.oem-option-card:hover .oem-option-icon {
  background: var(--mainColor, #004388);
  color: #fff;
}

.oem-option-card h3 {
  margin: 0 0 12px;
  font-size: 19px;
  line-height: 1.4;
  font-weight: 700;
  color: var(--headingColor, #1F2730);
}

.oem-option-card p {
  margin: 0 0 18px;
  /* font-size: 14px; */
  line-height: 1.8;
  color: #66727f;
}

.oem-option-tag {
  display: inline-block;
  padding: 5px 12px;
  border-radius: 3px;
  background: rgba(0, 166, 226, .10);
  color: #0089bd;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.2px;
}

/* 3. 交替图文能力 */
.oem-stories {
  padding-top: 72px;
  background: #fff;
}

.oem-story {
  margin-bottom: 74px;
}

.oem-story:last-child {
  margin-bottom: 0;
}

.oem-story--reverse .row {
  flex-direction: row-reverse;
}

.oem-story > .row > .col-lg-6:first-child {
  position: relative;
}

.oem-media--story {
  height: 400px;
}

.oem-media-float {
  position: absolute;
  right: -18px;
  bottom: -22px;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 22px;
  border-radius: 10px 0 10px 0;
  background: var(--mainColor, #004388);
  color: #fff;
  box-shadow: 0 14px 34px rgba(0, 67, 136, .24);
}

.oem-story--reverse .oem-media-float {
  right: auto;
  left: -18px;
}

.oem-media-float strong {
  font-size: 30px;
  line-height: 1;
  font-weight: 800;
}

.oem-media-float span {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.1px;
  line-height: 1.45;
  color: rgba(255, 255, 255, .82);
}

.oem-story-copy {
  padding-left: 48px;
}

.oem-story--reverse .oem-story-copy {
  padding-left: 0;
  padding-right: 48px;
}

.oem-story-copy h2 {
  margin: 0 0 18px;
  font-size: 32px;
  line-height: 1.3;
  font-weight: 700;
  color: var(--headingColor, #1F2730);
}

.oem-story-copy p {
  margin: 0 0 22px;
  /* font-size: 15px; */
  line-height: 1.9;
  color: #5a6572;
}

.oem-check-list {
  list-style: none;
  margin: 0 0 26px;
  padding: 0;
}

.oem-check-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid rgba(0, 67, 136, .09);
  font-size: 14px;
  line-height: 1.6;
  color: #3d4a58;
}

.oem-check-list i {
  margin-top: 2px;
  color: #00a6e2;
  font-size: 16px;
}

.oem-text-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 15px;
  font-weight: 700;
  color: var(--mainColor, #004388);
}

.oem-text-link i {
  font-size: 13px;
  transition: transform .3s ease;
}

.oem-text-link:hover {
  color: #00a6e2;
}

.oem-text-link:hover i {
  transform: translateX(5px);
}

/* 4. 垂直时间线 */
.oem-timeline {
  padding-top: 64px;
  background: var(--bgColor, #F4F6F8);
}

.oem-timeline-list {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
}

.oem-timeline-list::before {
  content: '';
  position: absolute;
  top: 26px;
  bottom: 26px;
  left: 27px;
  width: 2px;
  background: linear-gradient(180deg, #00a6e2, rgba(0, 67, 136, .25));
}

.oem-timeline-item {
  position: relative;
  padding-left: 82px;
  margin-bottom: 22px;
}

.oem-timeline-item:last-child {
  margin-bottom: 0;
}

.oem-timeline-marker {
  position: absolute;
  top: 20px;
  left: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border: 4px solid var(--bgColor, #F4F6F8);
  border-radius: 50%;
  background: var(--mainColor, #004388);
  color: #fff;
  font-size: 16px;
  font-weight: 800;
  box-shadow: 0 6px 18px rgba(0, 67, 136, .18);
}

.oem-timeline-card {
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 22px 26px;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 8px 26px rgba(0, 67, 136, .06);
  transition: transform .35s ease, box-shadow .35s ease;
}

.oem-timeline-card:hover {
  transform: translateX(6px);
  box-shadow: 0 14px 34px rgba(0, 67, 136, .13);
}

.oem-timeline-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
  border-radius: 10px;
  background: rgba(0, 166, 226, .10);
  color: #0089bd;
  font-size: 22px;
}

.oem-timeline-text h3 {
  margin: 0 0 7px;
  font-size: 19px;
  font-weight: 700;
  color: var(--headingColor, #1F2730);
}

.oem-timeline-text p {
  margin: 0;
  /* font-size: 14px; */
  line-height: 1.75;
  color: #66727f;
}

/* 5. 深蓝询价双列 */
.oem-brief {
  background: #fff;
  padding-top: 8px;
}

.oem-brief-panel {
  padding: 46px 48px;
  border-radius: 12px;
  background: linear-gradient(115deg, #00356d 0%, #004388 60%, #0a5aa8 100%);
  box-shadow: 0 18px 44px rgba(0, 67, 136, .18);
}

.oem-brief-panel .row > .col-lg-6:first-child {
  border-right: 1px solid rgba(255, 255, 255, .16);
}

.oem-brief-col {
  padding-right: 40px;
}

.oem-brief-panel .row > .col-lg-6:last-child .oem-brief-col {
  padding-right: 0;
  padding-left: 40px;
}

.oem-eyebrow--light {
  border-left-color: #f7a600;
  color: rgba(255, 255, 255, .78);
}

.oem-brief-col h2 {
  margin: 0 0 22px;
  font-size: 28px;
  line-height: 1.3;
  font-weight: 700;
  color: #fff;
}

.oem-brief-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.oem-brief-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 0;
  font-size: 14px;
  line-height: 1.65;
  color: rgba(255, 255, 255, .88);
}

.oem-brief-list i {
  flex: 0 0 18px;
  margin-top: 3px;
  color: #f7a600;
  font-size: 12px;
}

/* 6. 应用行业标签墙 */
.oem-industries {
  background: #fff;
}

.oem-industry-tags {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.oem-industry-tags li {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 22px;
  border: 1px solid rgba(0, 67, 136, .13);
  border-radius: 8px 0 8px 0;
  background: #fff;
  font-size: 14px;
  font-weight: 600;
  color: #3d4a58;
  box-shadow: 0 5px 18px rgba(0, 67, 136, .05);
  transition: background-color .3s ease, color .3s ease, transform .3s ease;
}

.oem-industry-tags li i {
  color: #00a6e2;
  font-size: 16px;
  transition: color .3s ease;
}

.oem-industry-tags li:hover {
  background: var(--mainColor, #004388);
  color: #fff;
  transform: translateY(-3px);
}

.oem-industry-tags li:hover i {
  color: #f7a600;
}

/* ── Custom & OEM 响应式 ── */
@media only screen and (max-width: 1199px) {
  .oem-intro-copy {
    padding-right: 20px;
  }

  .oem-intro-copy h2 {
    font-size: 32px;
  }

  .oem-story-copy h2 {
    font-size: 28px;
  }

  .oem-media--story {
    height: 350px;
  }
}

@media only screen and (max-width: 991px) {
  .oem-intro {
    padding: 60px 0 54px;
  }

  .oem-intro-copy {
    padding-right: 0;
    margin-bottom: 38px;
  }

  .oem-intro-media {
    max-width: 620px;
    margin: 0 auto;
  }

  .oem-story {
    margin-bottom: 60px;
  }

  .oem-story--reverse .row {
    flex-direction: column;
  }

  .oem-story > .row > .col-lg-6:first-child {
    max-width: 620px;
    margin: 0 auto;
  }

  .oem-story-copy,
  .oem-story--reverse .oem-story-copy {
    padding: 34px 0 0;
  }

  .oem-media-float,
  .oem-story--reverse .oem-media-float {
    right: 14px;
    left: auto;
    /* 收进图片内部：单列时负 bottom 会让浮标压到下方文案 */
    bottom: 14px;
  }

  .oem-brief-panel {
    padding: 38px 32px;
  }

  .oem-brief-panel .row > .col-lg-6:first-child {
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .16);
    padding-bottom: 22px;
    margin-bottom: 24px;
  }

  .oem-brief-col,
  .oem-brief-panel .row > .col-lg-6:last-child .oem-brief-col {
    padding: 0;
  }
}

@media only screen and (max-width: 767px) {
  .oem-intro-copy h2 {
    font-size: 25px;
    line-height: 1.38;
  }

  .oem-intro-copy p.oem-lead {
    font-size: 15px;
  }

  .oem-intro-copy p {
    font-size: 14px;
  }

  .oem-media--intro {
    height: 290px;
  }

  .oem-media--inset {
    width: 38%;
    height: 108px;
    border-width: 4px;
  }

  .oem-media-tag {
    top: 12px;
    right: 12px;
    min-width: 104px;
    padding: 10px 12px;
  }

  .oem-media-tag strong {
    font-size: 13px;
  }

  .oem-options,
  .oem-timeline {
    padding-top: 48px;
  }

  .oem-option-card {
    padding: 24px 22px 22px;
    margin-bottom: 20px;
  }

  .oem-option-card h3 {
    font-size: 17px;
  }

  .oem-stories {
    padding-top: 52px;
  }

  .oem-media--story {
    height: 270px;
  }

  .oem-story-copy h2 {
    font-size: 23px;
  }

  .oem-media-float {
    padding: 12px 16px;
  }

  .oem-media-float strong {
    font-size: 23px;
  }

  .oem-timeline-list::before {
    left: 20px;
  }

  .oem-timeline-item {
    padding-left: 58px;
  }

  .oem-timeline-marker {
    width: 42px;
    height: 42px;
    top: 16px;
    font-size: 13px;
  }

  .oem-timeline-card {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    padding: 18px 20px;
  }

  .oem-timeline-text h3 {
    font-size: 17px;
  }

  .oem-brief-panel {
    padding: 30px 24px;
  }

  .oem-brief-col h2 {
    font-size: 22px;
  }

  .oem-industries {
    padding-top: 52px;
  }

  .oem-industry-tags li {
    padding: 12px 16px;
    font-size: 13px;
  }
}

/* ═══════════════════════════════════════════════════════════
   About 页新增板块（v1.7.9 建 / v1.7.10 改为四卡片）：数字统计带 + 四张横向优势卡片
   类名独立，仅 page-about.php 使用，不影响其它页面。
   ═══════════════════════════════════════════════════════════ */

/* 数字统计带 */
.about-stats {
  padding: 68px 0 72px;
  background: #f2f6fb;
  border-top: 1px solid rgba(0, 67, 136, .06);
  border-bottom: 1px solid rgba(0, 67, 136, .06);
}

.about-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.about-stat {
  padding: 8px 18px;
  text-align: center;
  border-right: 1px solid rgba(0, 67, 136, .12);
}

.about-stat:last-child {
  border-right: 0;
}

.about-stat-num {
  font-size: 46px;
  line-height: 1.1;
  font-weight: 700;
  color: #004388;
  font-variant-numeric: tabular-nums;
}

.about-stat-num em {
  margin-left: 2px;
  font-size: 26px;
  font-style: normal;
}

.about-stat-label {
  margin-top: 8px;
  font-size: 14px;
  line-height: 1.5;
  color: #5c6b7a;
}

/* 四张横向卡片（铺满 container，不再限宽居中） */
.about-why {
  padding: 76px 0 60px;
}

.about-why-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.about-why-card {
  display: flex;
  flex-direction: column;
  padding: 28px 26px 30px;
  background: #fff;
  border: 1px solid rgba(0, 67, 136, .12);
  border-radius: 14px;
  box-shadow: 0 6px 20px rgba(0, 40, 90, .05);
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}

.about-why-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 22px;
}

.about-why-card-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: linear-gradient(135deg, #004388 0%, #0a5aa8 100%);
  color: #fff;
  font-size: 20px;
}

.about-why-card-index {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .08em;
  color: #c3cede;
}

.about-why-card h3 {
  margin: 0 0 10px;
  font-size: 18px;
  line-height: 1.4;
  font-weight: 700;
  color: #1f2730;
}

.about-why-card p {
  flex: 1;
  margin: 0;
  /* font-size: 14px; */
  line-height: 1.75;
  color: #5c6b7a;
}

.about-why-card:hover {
  transform: translateY(-5px);
  border-color: rgba(0, 67, 136, .28);
  box-shadow: 0 16px 34px rgba(0, 40, 90, .10);
}

@media only screen and (max-width: 991px) {
  .about-stats {
    padding: 56px 0 60px;
  }

  .about-stats-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 26px 0;
  }

  .about-stat:nth-child(2) {
    border-right: 0;
  }

  .about-stat-num {
    font-size: 40px;
  }

  .about-why {
    padding: 64px 0 12px;
  }

  .about-why-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
  }
}

@media only screen and (max-width: 767px) {
  .about-stats {
    padding: 48px 0 52px;
  }

  .about-stats-grid {
    gap: 22px 0;
  }

  .about-stat {
    padding: 6px 10px;
  }

  .about-stat-num {
    font-size: 32px;
  }

  .about-stat-num em {
    font-size: 20px;
  }

  .about-stat-label {
    font-size: 12px;
  }

  .about-why {
    padding: 52px 0 8px;
  }

  .about-why-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .about-why-card {
    padding: 22px 20px 24px;
  }

  .about-why-card-top {
    margin-bottom: 16px;
  }

  .about-why-card-icon {
    width: 46px;
    height: 46px;
    font-size: 18px;
  }

  .about-why-card h3 {
    font-size: 17px;
  }
}


/* ═══════════════════════════════════════════════════════════
   站内搜索（v1.7.11）：头部弹层 / 产品侧栏 / 搜索结果页
   只追加新规则；.search-area / .searchbtn 原有样式与 main.js 开合逻辑不动
   ═══════════════════════════════════════════════════════════ */

/* 头部弹层：form 包裹后保持静态稿布局，hidden 参数不占位 */
.search-area form {
  margin: 0;
}

.search-area input[type="hidden"],
.prod-sidebar-search input[type="hidden"] {
  display: none;
}

/* 移动端：搜索图标与汉堡按钮并排留间距，桌面该按钮为 d-lg-none 不影响 90px 头部 */
@media only screen and (max-width: 991px) {
  .mobile-bar-wrap .searchbtn {
    margin-right: 16px;
    top: -2px;
  }
}

/* 产品列表页侧栏搜索（白底侧栏内，蓝按钮与侧栏配色一致） */
.prod-sidebar-search {
  padding: 16px 22px;
  border-bottom: 1px solid #eef2f6;
  background: #fff;
}

.prod-sidebar-search form {
  display: flex;
  align-items: stretch;
  margin: 0;
}

.prod-sidebar-search input[type="search"] {
  flex: 1 1 auto;
  min-width: 0;
  /*height: 42px;*/
  padding: 0 12px;
  border: 1px solid #d9dee3;
  border-right: 0;
  border-radius: 4px 0 0 4px;
  background: #F4F6F8;
  color: #1F2730;
  font-size: 14px;
  outline: none;
}

.prod-sidebar-search input[type="search"]:focus {
  border-color: #004388;
}

.prod-sidebar-search button {
  flex: 0 0 44px;
  border: 0;
  border-radius: 0 4px 4px 0;
  background: #004388;
  color: #fff;
  font-size: 18px;
  cursor: pointer;
  transition: background .2s ease;
}

.prod-sidebar-search button:hover {
  background: #0a5aa8;
}

/* 搜索结果页：计数行 */
.search-result-meta {
  margin: -8px 0 24px;
  font-size: 15px;
  color: #6b7683;
}

@media only screen and (max-width: 767px) {
  .prod-sidebar-search {
    padding: 14px 18px;
  }

  .search-result-meta {
    font-size: 14px;
  }

  /* 手机端 container 被 style.css 改成 flex-wrap，.mobile-bar-wrap 落在第二行（约 y=100~127），
     弹层若沿用 top:76px 会压住搜索/汉堡按钮。style.css 用的是
     .header-wrap .header-bottom .container .search-area.open（特异性 0-4-0），
     这里必须用同结构选择器才能覆盖，下移到按钮行下方。 */
  .header-wrap .header-bottom .container .search-area.open {
    top: 132px;
    z-index: 50;
  }

  /* 手机端按钮行是深蓝底，默认黑色搜索图标对比度不足 */
  /* .mobile-bar-wrap .searchbtn,
  .mobile-bar-wrap .searchbtn:hover {
    color: #fff;
  } */
}