/* 电子与智能化工程子页 */

.page-main--engineering {
  padding-top: 0;
  /* #engineering-toc 实际高度由 js/products-electronic-engineering.js 写入，用于锚点 scroll-margin */
  --engineering-toc-height: 160px;
  /* 与维保页一致的版心：首屏文案与各模块同宽同边距 */
  --ee-max: var(--container-max-width);
  --ee-pad-x: clamp(20px, 6.94vw, 100px);
}

.engineering-hero {
  position: relative;
  color: #fff;
  text-align: left;
  /* 缩短首屏 banner，便于首屏露出「服务范围与内容」区块 */
  min-height: clamp(260px, 22vw, 360px);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  overflow: hidden;
}

.engineering-hero__media {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: cover;
  object-position: center center;
  pointer-events: none;
}

.engineering-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  /* background: linear-gradient(180deg, rgba(10, 35, 80, 0.55) 0%, rgba(12, 48, 100, 0.72) 100%); */
}

.engineering-hero__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: min(1080px, calc(100% - 2 * var(--spacing-lg)));
  margin-inline: auto;
  text-align: left;
  padding: calc(var(--header-height) + var(--spacing-lg)) var(--spacing-lg) var(--spacing-xl);
  box-sizing: border-box;
}

/* 电子工程页（及同骨架子页）：版心与首屏 inner 对齐 */
.page-main--engineering .engineering-hero__inner {
  max-width: var(--ee-max);
  padding: calc(var(--header-height) + var(--spacing-lg)) var(--ee-pad-x) var(--spacing-xl);
}

.page-main--engineering .engineering-toc.sol-detail-tabs {
  z-index: 30;
}

.page-main--engineering .engineering-toc.sol-detail-tabs .container {
  width: 100%;
  max-width: var(--ee-max);
  margin-left: auto;
  margin-right: auto;
  padding: 0 var(--ee-pad-x);
  box-sizing: border-box;
}

.page-main--engineering .engineering-strength > .container,
.page-main--engineering .engineering-scope > .container,
.page-main--engineering .engineering-future > .container,
.page-main--engineering .engineering-cases > .container.engineering-cases__inner,
.page-main--engineering .engineering-cta > .container.engineering-cta__inner {
  width: 100%;
  max-width: var(--ee-max);
  margin-left: auto;
  margin-right: auto;
  /* padding-left: var(--ee-pad-x);
  padding-right: var(--ee-pad-x); */
  box-sizing: border-box;
}

.engineering-hero__title {
  margin: 0 0 var(--spacing-md);
  font-size: clamp(28px, 4vw, 44px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.02em;
  display: flex;
  align-items: center;
  gap: 16px;
}

.engineering-hero__desc {
  margin: 0;
  max-width: 720px;
  font-size: clamp(15px, 1.6vw, 18px);
  line-height: 1.65;
  opacity: 0.94;
}

/* 产品子导航条 */
.engineering-product-strip {
  background: var(--color-bg-light);
  border-bottom: 1px solid var(--color-border);
  padding: var(--spacing-md) 0;
}

.engineering-product-strip__scroll {
  display: flex;
  gap: var(--spacing-sm);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;
  padding-bottom: 2px;
}

.engineering-product-strip__scroll::-webkit-scrollbar {
  height: 4px;
}

.engineering-product-strip__scroll::-webkit-scrollbar-thumb {
  background: var(--color-border);
  border-radius: 4px;
}

.engineering-product-strip__item {
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  flex: 0 0 auto;
  min-width: min(260px, 85vw);
  scroll-snap-align: start;
  padding: var(--spacing-md) var(--spacing-lg);
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  background: var(--color-bg-white);
  transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
}

.engineering-product-strip__item:hover {
  border-color: var(--color-border);
  box-shadow: var(--shadow-sm);
}

.engineering-product-strip__item--active {
  border-color: var(--color-primary);
  background: var(--color-primary-light);
  box-shadow: var(--shadow-sm);
}

.engineering-product-strip__icon-wrap {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.engineering-product-strip__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  text-align: left;
  min-width: 0;
}

.engineering-product-strip__name {
  font-size: 15px;
  font-weight: 600;
  color: var(--color-text-primary);
}

.engineering-product-strip__sub {
  font-size: 12px;
  color: var(--color-text-secondary);
  line-height: 1.4;
}

/* 章节锚点导航：与方案子页共用 .sol-detail-tabs*（页面需引入 css/pages/solution-detail.css） */
.page-main--engineering .engineering-toc.sol-detail-tabs,
.pm-page .engineering-toc.sol-detail-tabs {
  --sd-tab-inactive: #272b34;
  --sd-tab-pill: rgba(197, 202, 211, 0.2);
  --sd-blue: #0052d6;
}

.page-main--engineering .engineering-toc.sol-detail-tabs a.sol-detail-tabs__btn,
.pm-page .engineering-toc.sol-detail-tabs a.sol-detail-tabs__btn {
  text-decoration: none;
  color: var(--sd-tab-inactive);
  -webkit-tap-highlight-color: transparent;
}

.page-main--engineering .engineering-toc.sol-detail-tabs a.sol-detail-tabs__btn.is-active,
.pm-page .engineering-toc.sol-detail-tabs a.sol-detail-tabs__btn.is-active {
  color: #fff;
}

.page-main--engineering .engineering-toc.sol-detail-tabs a.sol-detail-tabs__btn:hover,
.pm-page .engineering-toc.sol-detail-tabs a.sol-detail-tabs__btn:hover {
  color: var(--sd-tab-inactive);
}

.page-main--engineering .engineering-toc.sol-detail-tabs a.sol-detail-tabs__btn.is-active:hover,
.pm-page .engineering-toc.sol-detail-tabs a.sol-detail-tabs__btn.is-active:hover {
  color: #fff;
}

/* 通用区块：锚点需让出顶部固定栏 + 本页 sticky TOC（高度随换行变化，由 --engineering-toc-height 同步） */
.engineering-section {
  /* 顶栏 + sticky TOC；勿加额外 px，否则会多滚一截露出上一版块 */
  scroll-margin-top: calc(var(--header-height) + var(--engineering-toc-height));
}

.engineering-section__title {
  text-align: center;
  margin-bottom: var(--spacing-4xl);
}

.engineering-strength {
  padding: var(--spacing-4xl) 0;
  background: var(--color-bg-light);
}

.engineering-strength__body {
  /* max-width: 960px; */
  width: 100%;
  /* margin-left: auto;
  margin-right: auto; */
  font-size: 16px;
  line-height: 1.85;
  color: var(--color-text-tertiary);
  text-align: center;
}

.engineering-strength__highlight {
  color: var(--color-primary);
  font-weight: 600;
}

/* 资质列表：设计稿三列两行，橙色方块 + 左对齐文案，整块居中 */
.engineering-strength__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--spacing-lg) 200px;
  max-width: var(--container-max-width);
  margin: var(--spacing-2xl) auto 0;
  padding: 0;
  list-style: none;
}

.engineering-strength__item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
  color: var(--color-text-first);
  text-align: left;
}

.engineering-strength__bullet {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  margin-top: 0.42em;
  background: #ff7a00;
  border-radius: 1px;
}

.engineering-strength__text {
  min-width: 0;
}

.engineering-strength__more {
  margin-top: var(--spacing-xl);
  text-align: center;
  font-size: 15px;
}

.engineering-strength__more a {
  color: var(--color-primary);
  font-weight: 600;
}

.engineering-strength__more a:hover {
  text-decoration: underline;
}

/* 服务范围 */
.engineering-scope {
  padding: var(--spacing-xl) 0;
  background: var(--color-bg-white);
}

.engineering-scope__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  gap: 60px;
  align-items: start;
}

.engineering-scope__subtitle {
  font-size: 20px;
  font-weight: 600;
  color: var(--color-text-primary);
  margin: 0 0 var(--spacing-md);
}

.engineering-scope__lead {
  margin: 0;
  font-size: 15px;
  line-height: 1.8;
  color: var(--color-text-tertiary);
}

.engineering-scope__tags {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--spacing-md);
  margin: 0;
  padding: 0;
  list-style: none;
}

.engineering-scope__tag {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  /* padding: var(--spacing-sm) var(--spacing-md); */
  font-size: 14px;
  font-weight: 500;
  color:#DD670E;
  text-align: center;
  background: #fff;
  border-radius: 4px;
  border: 1px solid #F6F6F9;
  box-shadow: 2px 4px 8px 0 #F5F5F5;
}


/* 案例区 */
.engineering-cases {
  position: relative;
  padding: var(--spacing-4xl) 0;
  overflow: hidden;
}

.engineering-cases__bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.engineering-cases__bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
}

.engineering-cases__overlay {
  position: absolute;
  inset: 0;
  /* background: linear-gradient(105deg, rgba(255, 255, 255, 0.92) 0%, rgba(255, 255, 255, 0.78) 42%, rgba(247, 248, 250, 0.55) 100%); */
}

.engineering-cases__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  gap: var(--spacing-3xl);
  align-items: start;
}

.engineering-cases__title {
  margin: 0 0 var(--spacing-2xl);
  font-size: clamp(24px, 2.5vw, 32px);
  font-weight: 600;
  color: #fff
}

.engineering-cases__lead {
  margin-bottom: 16px;
  font-size: 15px;
  line-height: 1.8;
  color: #fff;
  max-width: 420px;
  font-weight: 400;
}

.engineering-cases__card {
  background: var(--color-bg-white);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  border: 1px solid var(--color-border);
  padding: var(--spacing-lg);
}

.engineering-cases__tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  gap: var(--spacing-sm);
  margin-bottom: var(--spacing-lg);
  /* padding-bottom: var(--spacing-md); */
  border-bottom: 1px solid var(--color-border);
}

.engineering-cases__tab {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-sm);
  min-height: 44px;
  padding: 20px 14px;
  font-size: 14px;
  font-weight: 500;
  color: var(--color-text-secondary);
  /* background: var(--color-bg-light); */
  /* border-radius: var(--radius-md); */
  border-bottom: 1px solid transparent;
  transition: color 0.2s, border-color 0.2s, background 0.2s;
}

.engineering-cases__tab:hover {
  color: var(--color-primary);
  border-color: var(--color-border);
}

.engineering-cases__tab.is-active {
  color: var(--color-primary);
  /* background: var(--color-primary-light); */
  border-color: var(--color-primary);
  font-weight: 600;
}

.engineering-cases__tab-icon {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  object-fit: contain;
}

.engineering-cases__panel {
  display: none;
  height: 118px;
}

.engineering-cases__panel.is-active {
  display: block;
}

.engineering-cases__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.engineering-cases__list li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 0 5px var(--spacing-2xl);
  font-size: 18px;
  color: #001133;
  font-weight: 500;
}

.engineering-cases__list li:last-child {
  border-bottom: none;
}


/* 未来战略 */
.engineering-future {
  padding: var(--spacing-4xl) 0;
  background: var(--color-bg-white);
}

.engineering-future__intro {
  text-align: center;
  max-width: 720px;
  margin: -8px auto var(--spacing-3xl);
  font-size: 15px;
  line-height: 1.75;
  color: var(--color-text-secondary);
}

.engineering-future__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--spacing-lg);
}

.engineering-future__card {
  padding: var(--spacing-xl);
 
  text-align: center;
  transition: box-shadow 0.2s, border-color 0.2s;
}

.engineering-future__card:hover {
  border-color: rgba(21, 93, 209, 0.25);
  box-shadow: var(--shadow-sm);
}

.engineering-future__icon {
  margin: 0 auto var(--spacing-md);
  width: 64px;
  height: 64px;
  object-fit: contain;
}

.engineering-future__card-title {
  margin: 0 0 var(--spacing-sm);
  font-size: 17px;
  font-weight: 600;
  color: var(--color-text-primary);
}

.engineering-future__card-text {
  margin: 0;
  font-size: 14px;
  line-height: 1.65;
  color: var(--color-text-tertiary);
  text-align: center;
}

/* 底部 CTA */
.engineering-cta {
  position: relative;
  padding: var(--spacing-4xl) 0;
  text-align: center;
  color: #fff;
  overflow: hidden;
}

.engineering-cta__bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.engineering-cta__bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
}

.engineering-cta__inner {
  position: relative;
  z-index: 1;
}

.engineering-cta__title {
  margin: 0 0 var(--spacing-md);
  font-size: clamp(22px, 3vw, 32px);
  font-weight: 600;
}

.engineering-cta__desc {
  margin: 0 auto var(--spacing-3xl);
  max-width: 560px;
  font-size: 15px;
  line-height: 1.65;
  opacity: 0.95;
}

.engineering-cta__btn {
  min-height: 44px;
  padding: 10px 32px;
  font-size: 15px;
  font-weight: 600;
  background: #fff;
  color: var(--color-primary);
  /* border-radius: var(--radius-md); */
  box-shadow: var(--shadow-sm);
}

.engineering-cta__btn:hover {
  background: var(--color-primary-light);
  color: #0d4bb5;
}

@media (max-width: 1024px) {
  .engineering-scope__grid {
    grid-template-columns: 1fr;
    gap: var(--spacing-xl);
  }

  .engineering-scope__tags {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .engineering-cases__inner {
    grid-template-columns: 1fr;
    gap: var(--spacing-xl);
  }

  .engineering-cases__lead {
    max-width: none;
  }

  .engineering-future__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .engineering-strength__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--spacing-md) var(--spacing-lg);
    max-width: none;
  }
}

@media (max-width: 768px) {
  .engineering-hero {
    min-height: clamp(160px, 34vw, 240px);
  }

  .page-main--engineering .engineering-hero__inner {
    padding: calc(var(--header-height) + var(--spacing-xl)) var(--ee-pad-x) var(--spacing-2xl);
  }

  .engineering-product-strip__item {
    min-width: min(240px, 78vw);
  }

  .engineering-toc.sol-detail-tabs a.sol-detail-tabs__btn {
    font-size: 13px;
    padding: 4px 12px;
  }

  .engineering-strength,
  .engineering-scope,
  .engineering-cases,
  .engineering-future {
    padding: var(--spacing-3xl) 0;
  }

  .engineering-section__title {
    margin-bottom: var(--spacing-xl);
  }

  .engineering-strength__body {
    font-size: 15px;
    text-align: left;
  }

  .engineering-strength__grid {
    grid-template-columns: 1fr;
    gap: var(--spacing-md);
    margin-top: var(--spacing-xl);
  }

  .engineering-strength__item {
    font-size: 14px;
  }

  .engineering-scope__tags {
    grid-template-columns: 1fr;
  }

  .engineering-cases__tabs {
    flex-direction: column;
  }

  .engineering-cases__tab {
    width: 100%;
    justify-content: flex-start;
  }

  .engineering-future__grid {
    grid-template-columns: 1fr;
  }

  .engineering-future__card-text {
    text-align: left;
  }

  .engineering-cta {
    padding: var(--spacing-3xl) 0;
  }
}
