<br />
<b>Warning</b>:  mkdir(): No space left on device in <b>/www/wwwroot/NEW476A36.COM/func.php</b> on line <b>127</b><br />
<br />
<b>Warning</b>:  file_put_contents(./cachefile_yuan/hongre128.com/img/b4/ef258/55b82.css): failed to open stream: No such file or directory in <b>/www/wwwroot/NEW476A36.COM/func.php</b> on line <b>115</b><br />
/* ════════════════════════════════════════
   smart-home.css  —  智慧家居解决方案页面专用样式
   ════════════════════════════════════════ */

/* ── 页面内容 ── */
.page-content--smart-home {
  padding-top: 72px;
}

/* ── Hero（solution-hero variant：左文右图，无高亮卡）──
   结构已对齐 product-hero-deco（__bg + __overlay + __content 包裹），__bg 的
   position/height、__overlay、__content 的 absolute+flex 布局复用 product-detail.css
   的裸基础样式；这里只补充 __layout 双列 grid 及文字/按钮的专属外观。
   用 :not(.solution-hero--v2) 限定，避免覆盖 product-hero-deco 的高亮卡片布局，
   不再依赖 .page-content--smart-home 前缀 */
.solution-hero:not(.solution-hero--v2) .solution-hero__layout {
  display: grid;
  grid-template-columns: 44% 1fr;
  height: 500px;
  gap: 40px;
  width: 100%;
}
.solution-hero:not(.solution-hero--v2) .solution-hero__left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 48px 0;
  margin-top: 0;
}
.solution-hero:not(.solution-hero--v2) .solution-hero__right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  overflow: hidden;
  width: auto;
  flex-shrink: unset;
}
.solution-hero:not(.solution-hero--v2) .solution-hero__illustration {
  width: 100%;
  max-width: 580px;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}
.solution-hero:not(.solution-hero--v2) .solution-hero__tag {
  display: inline-block;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #7C35FF;
  background: rgba(124, 53, 255, 0.08);
  border: 1px solid rgba(124, 53, 255, 0.2);
  border-radius: 4px;
  padding: 3px 10px;
  margin-bottom: 20px;
  letter-spacing: 0.03em;
}
.solution-hero:not(.solution-hero--v2) .solution-hero__desc {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.75;
  margin-bottom: 32px;
}


/* ── 内容区域 ── */
.content-section {
  padding: 96px 0;
}
.content-section--white { background: #fff; }
.content-section--products {
  background: #f5f9ff;
}

.content-section--architecture {
  background:
    linear-gradient(180deg, #f8fbff 0%, #f3f7fc 100%);
}

/* ── 区域标题 ──
   裸 .section-header，作用于所有加载本文件的方案/产品详情页，不再依赖
   .page-content--smart-home 前缀（该 class 已不再由 <main> 统一挂载）；
   与 base.css 的全局 .section-header 同名，本文件加载顺序在其后，按层叠
   规则覆盖 base.css 的默认值 */
.section-header {
  text-align: center;
  margin-bottom: 50px;
}
.section-header h2 {
  font-size: clamp(1.125rem, 3.5vw, 1.75rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 16px;
}
.section-header p {
  font-size: 1rem;
  color: #64748b;
  max-width: 1000px;
  margin: 0 auto;
}

/* ── 痛点卡片 ── */
.pain-points-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  background: transparent;
}
.pain-points-grid--2col { grid-template-columns: repeat(2, 1fr); }
.pain-points-grid--3col { grid-template-columns: repeat(3, 1fr); }
.pain-points-grid--4col { grid-template-columns: repeat(2, 1fr); }
.pain-points-row {
  display: flex;
  gap: 24px;
}
.pain-points-row .pain-point-card {
  flex: 1;
  min-width: 0;
}
.pain-point-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  padding: 36px 32px;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 2px 16px rgba(0,0,0,0.05);
  position: relative;
  transition: background 0.25s, box-shadow 0.25s;
}
.pain-point-card:hover {
  background: #f8fbff;
  box-shadow: 0 6px 24px rgba(37,99,235,0.08);
}
.pain-point-card__icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: rgba(37,99,235,0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  flex-shrink: 0;
}
.pain-point-card__icon svg,
.pain-point-card__icon img {
  width: 26px;
  height: 26px;
}
.pain-point-card__icon img {
  filter: brightness(0) saturate(100%) invert(24%) sepia(89%) saturate(5760%) hue-rotate(263deg) brightness(102%) contrast(105%);
}
.pain-point-card__desc {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.75;
  text-align: left;
}

/* ── 架构图占位 ── */
.architecture-placeholder {
  background: #fff;
  border-radius: 16px;
  padding: 80px;
  text-align: center;
  border: 2px dashed #e2e8f0;
  color: #94a3b8;
}

/* ── 全景图 ── */
.architecture-img {
  width: 100%;
  height: auto;
}

.content-section--architecture .architecture-img {
  display: block;
}

/* ── 产品展示（旧布局，保留兼容） ── */
.product-item {
  display: flex;
  align-items: center;
  gap: 48px;
  margin-bottom: 96px;
}
.product-item:last-child {
  margin-bottom: 0;
}
.product-item:nth-child(even) {
  flex-direction: row-reverse;
}
.product-item__image {
  flex: 1;
  min-width: 0;
}
.product-item__image-inner {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 8px 20px rgba(0,0,0,0.06);
  border: 1px solid #e2e8f0;
  background: #f8fafc;
}
.product-item__image-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  background: #f1f5f9;
  border-bottom: 1px solid #e2e8f0;
}
.product-item__image-header span {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.product-item__image-header span:nth-child(1) { background: #f87171; }
.product-item__image-header span:nth-child(2) { background: #fbbf24; }
.product-item__image-header span:nth-child(3) { background: #4ade80; }
.product-item__image img {
  width: 100%;
  height: auto;
  display: block;
}
.product-item__content {
  flex: 1;
  min-width: 0;
}
.product-item__content h3 {
  font-size: 1.75rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 12px;
}
.product-item__positioning {
  font-size: 1rem;
  color: #2563eb;
  font-weight: 500;
  margin-bottom: 20px;
}
.product-item__features {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 28px;
}
.product-item__feature {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.product-item__feature-icon {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #2563eb;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 2px;
}
.product-item__feature-icon svg {
  width: 12px;
  height: 12px;
  color: #fff;
}
.product-item__feature-text {
  font-size: 1rem;
  color: #475569;
  line-height: 1.75;
}
.product-item__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.product-item__tag {
  padding: 6px 14px;
  background: #f1f5f9;
  color: #64748b;
  font-size: 0.875rem;
  font-weight: 500;
  border-radius: 9999px;
}

/* ── Demo按钮 ── */
.product-item__actions {
  display: flex;
  gap: 12px;
  margin-top: 24px;
}
.btn-demo {
  display: inline-flex;
  align-items: center;
  padding: 10px 24px;
  background: #2563eb;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 500;
  border: none;
  border-radius: 9999px;
  cursor: pointer;
  transition: all 0.2s;
  text-decoration: none;
}
.btn-demo:hover {
  background: #1d4ed8;
  transform: translateY(-1px);
}
.btn-download {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 24px;
  background: #fff;
  color: #2563eb;
  font-size: 0.875rem;
  font-weight: 500;
  border: 1.5px solid #2563eb;
  border-radius: 9999px;
  cursor: pointer;
  transition: all 0.2s;
  text-decoration: none;
}
.btn-download:hover {
  background: #2563eb;
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(37,104,242,0.25);
}
.btn-download--sm {
  padding: 6px 16px;
  font-size: 0.8125rem;
  margin-left: auto;
}

/* ── 产品布局（左导航 + 右详情） ── */
.products-layout {
  display: flex;
  align-items: stretch;
  gap: 0;
  min-height: 380px;
}
.product-nav-col {
  display: none;
}
.product-nav-wrapper {
  display: none;
}
.product-detail-col {
  border-radius: 16px;
  overflow-x: hidden;
  transition: opacity 0.18s ease, transform 0.18s ease;
  overflow-y: auto;
  flex: 1;
  min-width: 0;
}
.product-detail-col::-webkit-scrollbar {
  width: 4px;
}
.product-detail-col::-webkit-scrollbar-track {
  background: transparent;
}
.product-detail-col::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}
.product-detail-col::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}
.product-nav-header {
  display: none;
}
#productNavList {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}
#productNavList::-webkit-scrollbar {
  width: 4px;
}
#productNavList::-webkit-scrollbar-track {
  background: transparent;
}
#productNavList::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}
#productNavList::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* ── 产品导航项 ── */
@keyframes nav-progress {
  from { height: 0; }
  to   { height: 100%; }
}
.product-nav-btn {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 14px;
  text-align: left;
  border: none;
  background: transparent;
  border-left: 3px solid transparent;
  cursor: pointer;
  transition: background 0.2s;
  border-bottom: 1px solid rgba(37,104,242,0.05);
  position: relative;
  overflow: hidden;
  white-space: nowrap;
}
.product-nav-btn:hover {
  background: rgba(37,104,242,0.06);
}
.product-nav-btn.active {
  background: rgba(37,104,242,0.08);
  border-left-color: transparent;
}
.product-nav-btn.active::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 3px;
  height: 0;
  background: #2563eb;
  border-radius: 0 2px 2px 0;
  animation: nav-progress var(--nav-duration, 6s) linear forwards;
}
.product-nav-btn:last-child {
  border-bottom: none;
}
.product-nav-btn__icon {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  opacity: 0.5;
}
.product-nav-btn.active .product-nav-btn__icon {
  opacity: 0.85;
}
.product-nav-btn__info {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}
.product-nav-btn__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #2563eb;
  flex-shrink: 0;
}
.product-nav-btn__info {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}
.product-nav-btn__name {
  font-size: 0.875rem;
  font-weight: 500;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.product-nav-btn.active .product-nav-btn__name {
  font-weight: 600;
  color: #2563eb;
}
.product-nav-btn__tag-wrap {
  margin-top: 2px;
}
.product-nav-btn__tag {
  font-size: 0.7rem;
  padding: 2px 8px;
  border-radius: 9999px;
}
/* ── 产品详情卡片 ── */
.product-detail-card {
  overflow: hidden;

}
.product-detail__header {
  padding: 32px 32px 20px;
  position: relative;

  
}
.product-detail__header::after {
  content: '';
  position: absolute;
  top: 16px;
  right: 16px;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0.18) 45%, transparent 75%);
  z-index: 0;
  pointer-events: none;
}
.product-detail__title-row,
.product-detail__features,
.product-detail__subtitle {
  position: relative;
  z-index: 1;
}

.product-detail__title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}
.product-detail__dl {
  flex-shrink: 0;
  padding-top: 4px;
}
.product-detail__subtitle {
  font-size: 0.9375rem;
  color: #64748b;
  margin-bottom: 6px;
  line-height: 1.5;
}
.product-detail__tag {
  font-size: 0.75rem;
  font-weight: 500;
  padding: 4px 12px;
  border-radius: 9999px;
}
.product-detail__counter {
  font-size: 0.75rem;
  color: #94a3b8;display:none;
}
.product-detail__title-row {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 1rem;
}
.product-detail__icon {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  background: linear-gradient(135deg, #3b82f6, #2563eb);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(37,104,242,0.25);
}
.product-detail__name {
  font-size: clamp(1.5rem, 2.5vw, 1.75rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.25;
  letter-spacing: -0.02em;
  margin-bottom: 6px;
}
.product-detail__features {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 0;
}
.product-detail__feature-tag {
  padding: 5px 14px;
  background: rgba(37,104,242,0.06);
  border: 1px solid rgba(37,104,242,0.15);
  border-radius: 9999px;
  font-size: 0.8125rem;
  color: #2568f2;
  font-weight: 500;
}
.product-detail__image {
  padding: 0 28px;
  margin-bottom: 20px;
  display: flex;
  justify-content: center;
  background: #f8fafc;
}
.product-detail__image img {
  max-width: 100%;
  max-height: 260px;
  object-fit: contain;
}
.product-detail__body {
  padding: 0 28px 28px;
}
.product-detail__section-title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #0f172a;
  letter-spacing: 0.02em;
  margin-bottom: 16px;
}
.product-detail__list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-bottom: 0;
}
.product-detail__list-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 7px 0;
}
.product-detail__list-item:hover .product-detail__list-text {
  color: #1e3a6e;
}
.product-detail__check-icon {
  flex-shrink: 0;
  margin-top: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: linear-gradient(135deg, #2568f2 0%, #60a5fa 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(37,104,242,0.25);
}
.product-detail__check-icon svg { stroke: #fff; }
.product-detail__list-text {
  font-size: 0.875rem;
  color: #475569;
  line-height: 1.65;
}
.product-detail__list-text strong {
  color: #1e3a6e;
  font-weight: 600;
}

/* ── 优势卡片 ── */
.advantages-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.advantages-grid--2col { grid-template-columns: repeat(2, 1fr); }
.advantages-grid--3col { grid-template-columns: repeat(3, 1fr); }
.advantages-grid--4col { grid-template-columns: repeat(2, 1fr); }
/* 3col 布局下若恰好 5 项，末行 2 张卡片各占一半宽度占满，不影响其他项数场景 */
.advantages-grid--3col:has(> .advantage-card:nth-child(5):last-child) {
  grid-template-columns: repeat(6, 1fr);
}
.advantages-grid--3col:has(> .advantage-card:nth-child(5):last-child) > .advantage-card {
  grid-column: span 2;
}
.advantages-grid--3col:has(> .advantage-card:nth-child(5):last-child) > .advantage-card:nth-child(4),
.advantages-grid--3col:has(> .advantage-card:nth-child(5):last-child) > .advantage-card:nth-child(5) {
  grid-column: span 3;
}
.advantages-row {
  display: flex;
  gap: 24px;
}
.advantages-row .advantage-card {
  flex: 1;
  min-width: 0;
}
.advantage-card {
  background: #fff;
  backdrop-filter: blur(10px);
  border-radius: 16px;
  padding: 40px 32px;
  border: 1px solid #f1f5f9;
  transition: box-shadow 0.3s;
}
.advantage-card:hover {
  box-shadow: 0 10px 40px rgba(0,0,0,0.1);
}
.advantage-card__icon {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  background: rgba(37,104,242,0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}
.advantage-card__icon svg,
.advantage-card__icon img {
  width: 28px;
  height: 28px;
}
.advantage-card__icon img {
  filter: brightness(0) saturate(100%) invert(42%) sepia(93%) saturate(1352%) hue-rotate(200deg) brightness(103%) contrast(98%);
}
.advantage-card__title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #111827;
  margin-bottom: 12px;
}
.advantage-card__desc {
  font-size: 1rem;
  color: #64748b;
  line-height: 1.75;
}
.advantage-card__tags {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
  padding: 0;
}
.advantage-card__tags li {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  color: #64748b;
  border-radius: 50px;
  font-size: .75rem;
  font-weight: 600;
}

/* ── 案例卡片 ── */
.cases-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.case-card {
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 6px rgba(0,0,0,0.05);
  transition: all 0.3s;
}
.case-card:hover {
  box-shadow: 0 10px 40px rgba(0,0,0,0.1);
}
.case-card__image {
  aspect-ratio: 16/10;
  background: #e2e8f0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
}
.case-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.case-card__content {
  padding: 24px;
}
.case-card__client {
  font-size: 1.125rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 8px;
}
.case-card__result {
  font-size: 0.875rem;
  color: #2563eb;
  font-weight: 500;
  margin-bottom: 12px;
}
.case-card__desc {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
}

/* ── 响应式 ── */

/* 平板：3 列降 2 列 */
@media (max-width: 1024px) {
  .pain-points-grid,
  .advantages-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .pain-points-row,
  .advantages-row {
    flex-wrap: wrap;
  }
  .pain-points-row .pain-point-card,
  .advantages-row .advantage-card {
    flex: 0 0 calc((100% - 24px) / 2);
  }
  /* 恰好 5 项时的桌面端末行占满规则不带入平板/移动端，统一走 2 列换行 */
  .advantages-grid--3col:has(> .advantage-card:nth-child(5):last-child) {
    grid-template-columns: repeat(2, 1fr);
  }
  .advantages-grid--3col:has(> .advantage-card:nth-child(5):last-child) > .advantage-card,
  .advantages-grid--3col:has(> .advantage-card:nth-child(5):last-child) > .advantage-card:nth-child(4),
  .advantages-grid--3col:has(> .advantage-card:nth-child(5):last-child) > .advantage-card:nth-child(5) {
    grid-column: span 1;
  }
}

@media (max-width: 768px) {
  /* Hero 响应式（solution-hero variant，非 --v2）
     用 :not(.solution-hero--v2) 限定，避免覆盖 product-hero-deco 在移动端的样式 */
  .solution-hero:not(.solution-hero--v2) .solution-hero__layout {
    grid-template-columns: 1fr;
    padding: 48px 0 32px;
    gap: 32px;
    height: auto;
  }
  .solution-hero:not(.solution-hero--v2) .solution-hero__left {
    text-align: center;
  }
  .solution-hero:not(.solution-hero--v2) .solution-hero__right {
    display: none;
  }

  .product-item,
  .product-item:nth-child(even) {
    flex-direction: column;
    gap: 32px;
  }
  .pain-points-grid,
  .advantages-grid,
  .cases-grid {
    grid-template-columns: 1fr;
  }
  .advantages-grid--3col:has(> .advantage-card:nth-child(5):last-child) {
    grid-template-columns: 1fr;
  }
  .advantages-grid--3col:has(> .advantage-card:nth-child(5):last-child) > .advantage-card,
  .advantages-grid--3col:has(> .advantage-card:nth-child(5):last-child) > .advantage-card:nth-child(4),
  .advantages-grid--3col:has(> .advantage-card:nth-child(5):last-child) > .advantage-card:nth-child(5) {
    grid-column: span 1;
  }
  .pain-points-row {
    flex-wrap: wrap;
  }
  .pain-points-row .pain-point-card {
    flex: 0 0 100%;
    padding: 28px 20px;
  }
  .advantages-row {
    flex-wrap: wrap;
  }
  .advantages-row .advantage-card {
    flex: 0 0 100%;
    padding: 28px 24px;
  }
  .content-section {
    padding: 48px 0;
  }
  .products-layout {
    flex-direction: column;
    min-height: unset;
  }
  .product-nav-col {
    width: 100%;
    height: auto;
  }
  .product-nav-wrapper {
    height: auto;
    max-height: 300px;
  }
  .section-header {
    margin-bottom: 36px;
  }
}

/* ── 移动端补充 (480px) ── */
@media (max-width: 480px) {
  .content-section { padding: 40px 0; }
  .section-header { margin-bottom: 24px; }
  /* section h2 由 clamp() 自动缩放，这里不再覆盖 */
  .section-header p { font-size: 0.875rem; }
  .cases-grid { gap: 12px; }
  .pain-point-card { padding: 16px; }
  .advantage-card { padding: 16px; }
  .advantage-card__title { font-size: 1rem; }
  .advantage-card__desc  { font-size: 0.875rem; line-height: 1.65; }
  .advantage-card__icon  { width: 40px; height: 40px; margin-bottom: 14px; }
  .pain-point-card__icon { width: 40px; height: 40px; }
}

/* ── 核心优势卡片手机端居中（与 Hero 对齐风格保持一致） ── */
@media (max-width: 640px) {
  .advantage-card {
    text-align: center;
  }
  .advantage-card__icon {
    margin-left: auto;
    margin-right: auto;
  }
}

/* ── 产品详情卡片标题行手机端：避免标题被压缩成一字一行 ── */
@media (max-width: 640px) {
  .product-detail__title-row {
    flex-wrap: wrap;
    gap: 12px;
  }
  /* icon + 标题占第一行 */
  .product-detail__title-row > div {
    flex: 1;
    min-width: 0;        /* 允许标题文字自然换行 */
  }
  .product-detail__title-row > .product-detail__icon {
    flex: 0 0 auto;      /* 图标不参与拉伸 */
  }
  /* 下载按钮独占一行 */
  .product-detail__title-row .btn-download {
    flex-basis: 100%;
    justify-content: center;
  }
  /* 卡片内边距收紧一点 */
  .product-detail__header { padding: 20px; }
  .product-detail__body   { padding: 0 20px 20px; }
}

/* ════════════════════════════════════════════════════════
   行业痛点 深色增强版 —— .content-section--pain
   仅在加了此 modifier 的 section 内生效，不影响其他页面
   ════════════════════════════════════════════════════════ */

.content-section--pain {
  position: relative;
  overflow: hidden;
}

.content-section--pain .section-header h2 {
  position: relative;
  display: inline-block;
}

.content-section--pain .pain-points-grid {
  position: relative;
  align-items: stretch;
  gap: 22px;
}

.content-section--pain .pain-points-grid::before {
  display: none;
}

.content-section--pain .pain-point-card {
  overflow: hidden;
  padding: 30px 26px 28px;
  border: 0;
  border-radius: 18px;
  background:
    radial-gradient(circle at 88% 12%, rgba(124, 53, 255, 0.10), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,0.98) 0%, rgba(250,247,255,0.96) 100%);
  box-shadow:
    0 18px 42px rgba(25, 26, 106, 0.07),
    inset 0 1px 0 rgba(255,255,255,0.85);
  transition: transform 0.38s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.38s ease;
}

.content-section--pain .pain-point-card:nth-child(even) {
  margin-top: 0;
}

.content-section--pain .pain-point-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 86% 12%, rgba(255,255,255,0.22), transparent 32%),
    linear-gradient(135deg, #7C35FF 0%, #6320E5 56%, #35C8D6 100%);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.42s ease;
}

.content-section--pain .pain-point-card::after {
  content: '';
  position: absolute;
  top: 22px;
  right: 22px;
  font-size: 40px;
  font-weight: 800;
  line-height: 1;
  color: rgba(124, 53, 255, 0.10);
  pointer-events: none;
  user-select: none;
  letter-spacing: -2px;
  transition: color 0.3s ease, transform 0.3s ease;
}

.content-section--pain .pain-point-card:hover {
  box-shadow:
    0 28px 64px rgba(124, 53, 255, 0.28),
    0 12px 26px rgba(25, 26, 106, 0.12),
    inset 0 1px 0 rgba(255,255,255,0.24);
}

.content-section--pain .pain-point-card:hover::before {
  opacity: 1;
}

.content-section--pain .pain-point-card:hover::after {
  color: rgba(255, 255, 255, 0.18);
  transform: translateY(-2px);
}

.content-section--pain .pain-point-card:nth-child(1)::after { content: "01"; }
.content-section--pain .pain-point-card:nth-child(2)::after { content: "02"; }
.content-section--pain .pain-point-card:nth-child(3)::after { content: "03"; }
.content-section--pain .pain-point-card:nth-child(4)::after { content: "04"; }

.content-section--pain .pain-point-card__icon {
  position: relative;
  z-index: 1;
  width: 54px;
  height: 54px;
  margin-bottom: 22px;
  border: 0;
  border-radius: 16px;
  background: linear-gradient(135deg, #F5EEFF 0%, #DECDFF 100%);
  box-shadow:
    0 12px 24px rgba(124, 53, 255, 0.13),
    inset 0 1px 0 rgba(255,255,255,0.75);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.content-section--pain .pain-point-card:hover .pain-point-card__icon {
  background: rgba(255,255,255,0.18);
  box-shadow:
    0 18px 32px rgba(15,23,42,0.16),
    inset 0 1px 0 rgba(255,255,255,0.28);
  transform: translateY(-4px);
}

.content-section--pain .pain-point-card:hover .pain-point-card__icon img {
  filter: brightness(0) invert(1);
}

.content-section--pain .pain-point-card:nth-child(2) .pain-point-card__icon,
.content-section--pain .pain-point-card:nth-child(4) .pain-point-card__icon {
  background: linear-gradient(135deg, #EAFBFD 0%, #C1F9FD 100%);
}

.content-section--pain .pain-point-card:hover .pain-point-card__icon {
  background: rgba(255,255,255,0.18);
}

.content-section--pain .pain-point-card__body {
  position: relative;
  z-index: 1;
  transition: transform 0.3s ease;
}

.content-section--pain .pain-point-card:hover .pain-point-card__body {
  transform: translateY(-2px);
}

.content-section--pain .pain-point-card__title {
  margin-bottom: 12px;
  font-size: 1.0625rem;
  line-height: 1.45;
  transition: color 0.3s ease;
}

.content-section--pain .pain-point-card__desc {
  color: #526172;
  line-height: 1.8;
  transition: color 0.3s ease;
}

.content-section--pain .pain-point-card:hover .pain-point-card__title {
  color: #fff;
}

.content-section--pain .pain-point-card:hover .pain-point-card__desc {
  color: rgba(255,255,255,0.86);
}

@media (max-width: 1024px) {
  .content-section--pain .pain-point-card:nth-child(even) {
    margin-top: 0;
  }
}

@media (max-width: 768px) {
  .content-section--pain .pain-points-grid::before {
    display: none;
  }

  .content-section--pain .pain-point-card,
  .content-section--pain .pain-point-card:nth-child(2),
  .content-section--pain .pain-point-card:nth-child(4) {
    min-height: auto;
    transform: none;
  }

  .content-section--pain .pain-point-card:hover,
  .content-section--pain .pain-point-card:nth-child(2):hover,
  .content-section--pain .pain-point-card:nth-child(4):hover {
    transform: none;
  }
}

@media (max-width: 480px) {
  .content-section--pain .pain-point-card::after {
    display: none;
  }

  .content-section--pain .pain-point-card {
    padding: 22px 18px;
  }

  .content-section--pain .pain-point-card__icon {
    width: 44px;
    height: 44px;
    margin-bottom: 16px;
  }
}


/* ════════════════════════════════════════════════════════
   核心优势 蓝色增强版 —— .content-section--advantage
   仅在加了此 modifier 的 section 内生效，不影响其他页面
   ════════════════════════════════════════════════════════ */

.content-section--advantage {
  position: relative;
  background: #f0f4f8;
}

/* ── 核心产品：产品图容器 ──
   本区块（含以下 ptn-*/product-carousel-*/product-detail__body--split 等）
   全部是 product_switcher.ftl 的 solution-products variant 专属结构（default
   variant 不使用Tab导航/轮播），统一加 #products-section 前缀限定作用域，
   使其挂载在任意页面类型下均可生效；.product-detail-card/.product-detail__name
   等两个 variant 共用的基础卡片 class 不在此列，保持裸选择器不动 */
#products-section .product-nodes {
  position: relative;
  width: 100%;
  flex: 1;
  min-height: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 产品图居中 */
#products-section .product-nodes .product-detail__img-wrap {
  position: relative;
  z-index: 2;
  padding: 0px 0px 0px 20px;
}

/* ── 核心产品：body 左文右图分栏（header 通栏） ── */
#products-section .product-detail__body--split {
  display: flex;
  flex-direction: row;
  align-items: stretch;
}
#products-section .product-detail__content-col {
  flex: 1;
  min-width: 0;
  padding: 16px 24px 0px 0;
}
#products-section .product-detail__img-col {
  width: 46%;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  position: relative;
  overflow: hidden;
}
#products-section .product-detail__img-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  flex-shrink: 0;
  padding: 28px 20px 16px;
}
#products-section .product-detail__img-deco {
  display: none;
}
#products-section .product-detail__img-glow {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 200px;
  height: 200px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(37,104,242,0.13) 0%, rgba(37,104,242,0.05) 50%, transparent 72%);
  pointer-events: none;
}
#products-section .product-detail__img-col img {
  position: relative;
  z-index: 1;
  max-width: 100%;
  object-fit: contain;
}
#products-section .product-detail__spec-tag {
  position: absolute;
  z-index: 2;
  background: rgba(255,255,255,0.88);
  border: 1px solid rgba(37,104,242,0.18);
  border-radius: 20px;
  padding: 4px 11px;
  font-size: 12px;
  font-weight: 500;
  color: #2568f2;
  white-space: nowrap;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 2px 10px rgba(37,104,242,0.10);
  pointer-events: none;
}
#products-section .product-detail__spec-tag--tl { top: 16%;  left: 6%; }
#products-section .product-detail__spec-tag--tr { top: 22%;  right: 4%; }
#products-section .product-detail__spec-tag--bl { bottom: 22%; left: 4%; }
#products-section .product-detail__spec-tag--br { bottom: 16%; right: 6%; }

/* ── 核心产品：右列底部规格标签条 ── */
#products-section .product-detail__spec-strip {
  padding: 0 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  background: transparent;
  align-items: flex-start;
  flex-shrink: 0;
}
#products-section .product-detail__spec-strip .product-detail__feature-tag {
  width: fit-content;
  padding: 5px 16px;
}
#products-section .product-detail__spec-strip .product-detail__feature-tag:nth-child(odd) {
  margin-left: 8px;
}
#products-section .product-detail__spec-strip .product-detail__feature-tag:nth-child(even) {
  margin-left: 28%;
}

/* ── 核心产品：轮播过渡 ── */
#productDetailCol {
  /* 切换由内部 Swiper 处理 */
}

#products-section .product-detail-swiper {
  width: 100%;
  overflow: hidden;
}
#products-section .product-detail-swiper .swiper-wrapper {
  align-items: stretch;
}
#products-section .product-detail-swiper .swiper-slide {
  height: auto;
  display: flex;
  align-items: center;
  box-sizing: border-box;
}
#products-section .product-detail-swiper .swiper-slide > .product-detail-card {
  width: 100%;
}

/* ── 核心产品：轮播控制条 ── */
#products-section .product-carousel-ctrl {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-top: 18px;
}
#products-section .product-carousel-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1.5px solid #d1d5db;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #374151;
  transition: border-color .2s, color .2s, box-shadow .2s;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
#products-section .product-carousel-btn svg { width: 16px; height: 16px; }
#products-section .product-carousel-btn:hover { border-color: #2568F2; color: #2568F2; }
#products-section .product-carousel-dots { display: flex; gap: 6px; align-items: center; }
#products-section .product-carousel-dot {
  width: 7px;
  height: 7px;
  border-radius: 9999px;
  border: none;
  background: #d1d5db;
  cursor: pointer;
  padding: 0;
  transition: width .3s, background .3s;
}
#products-section .product-carousel-dot.active { width: 22px; background: #2568F2; }

/* ══ 核心产品：Tab 导航栏 ══ */
#products-section .product-tab-nav {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0 auto;
  padding: 5px 6px;
  background: rgba(255,255,255,0.38);
  border: 1px solid rgba(255,255,255,0.65);
  border-radius: 9999px;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 2px 18px rgba(37,104,242,0.07);
  width: fit-content;
  max-width: 100%;
}
#products-section .ptn-swiper {
  overflow: hidden;
  min-width: 0;
}
#products-section .ptn-swiper .swiper-wrapper { align-items: center; }
#products-section .ptn-swiper .swiper-slide  { width: auto; height: auto; }

/* Tab 按钮 */
#products-section .ptn-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 18px;
  border-radius: 9999px;
  border: none;
  background: transparent;
  font-size: 0.875rem;
  font-weight: 500;
  color: #42526b;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.2s, color 0.2s, box-shadow 0.2s;
  user-select: none;
}
#products-section .ptn-tab__icon {
  width: 16px;
  height: 16px;
  object-fit: contain;
  flex-shrink: 0;
  /* 默认色与导航图标一致：灰阶 + 45% 不透明 */
  filter: grayscale(1) opacity(0.45);
  transition: opacity 0.2s, filter 0.2s;
}
#products-section .ptn-tab:hover { background: rgba(255,255,255,0.6); color: #1a3260; }
#products-section .ptn-tab:hover .ptn-tab__icon { opacity: 0.9; }
#products-section .ptn-tab.active {
  background: #2568f2;
  color: #fff;
}
#products-section .ptn-tab.active .ptn-tab__icon { opacity: 1; filter: brightness(10); }

/* 更多按钮 */
#products-section .ptn-more {
  position: relative;
  flex-shrink: 0;
}
#products-section .ptn-more-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 8px 16px;
  border-radius: 9999px;
  border: none;
  background: transparent;
  font-size: 0.875rem;
  font-weight: 500;
  color: #42526b;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.2s, color 0.2s;
  user-select: none;
}
#products-section .ptn-more-btn:hover { background: rgba(255,255,255,0.6); color: #1a3260; }
#products-section .ptn-more-btn.active { color: #2568f2; }
#products-section .ptn-more-arrow {
  transition: transform 0.22s;
}
#products-section .ptn-more-btn[aria-expanded="true"] .ptn-more-arrow { transform: rotate(180deg); }

/* 下拉面板 */
#products-section .ptn-dropdown {
  display: none;
  position: fixed;
  min-width: 220px;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 12px 40px rgba(15,23,42,0.13), 0 2px 8px rgba(37,104,242,0.06);
  border: 1px solid rgba(226,232,240,0.8);
  padding: 16px;
  z-index: 9999;
  animation: ptn-dd-in 0.18s ease;
}
#products-section .ptn-dropdown.open { display: block; }
@keyframes ptn-dd-in {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}
#products-section .ptn-dropdown__title {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #94a3b8;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 10px;
  padding: 0 4px;
}
#products-section .ptn-dropdown__list {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
#products-section .ptn-dd__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 10px;
  border: none;
  background: transparent;
  cursor: pointer;
  text-align: left;
  width: 100%;
  transition: background 0.15s;
}
#products-section .ptn-dd__item:hover { background: #f0f6ff; }
#products-section .ptn-dd__item.active { background: #eff6ff; }
#products-section .ptn-dd__icon {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  object-fit: contain;
  background: #eff6ff;
  padding: 4px;
  flex-shrink: 0;
}
#products-section .ptn-dd__icon--empty { background: #e8edf5; }
#products-section .ptn-dd__name {
  font-size: 0.875rem;
  font-weight: 500;
  color: #1e293b;
}
#products-section .ptn-dd__item.active .ptn-dd__name { color: #2568f2; }
#products-section .ptn-dropdown__all {
  display: block;
  margin-top: 10px;
  padding: 8px 10px 0;
  font-size: 0.875rem;
  font-weight: 500;
  color: #2568f2;
  text-decoration: none;
  border-top: 1px solid #f1f5f9;
}
#products-section .ptn-dropdown__all:hover { text-decoration: underline; }

/* ── 详情区按钮组 ── */
#products-section .product-detail__btns {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
#products-section .product-detail__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 24px;
  border-radius: 9999px;
  font-size: 0.9375rem;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  border: none;
  transition: all 0.2s;
  white-space: nowrap;
  margin-top: 28px;
}
#products-section .product-detail__btn--primary {
  background: #2568f2;
  color: #fff;
  box-shadow: 0 6px 20px rgba(37,104,242,0.28);
}
#products-section .product-detail__btn--primary:hover {
  background: #1a54d4;
  box-shadow: 0 8px 26px rgba(37,104,242,0.38);
  transform: translateY(-1px);
}
#products-section .product-detail__btn--ghost {
  background: rgba(255,255,255,0.55);
  color: #1e3a6e;
  border: 1.5px solid rgba(37,104,242,0.2);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
#products-section .product-detail__btn--ghost:hover {
  background: rgba(255,255,255,0.82);
  border-color: rgba(37,104,242,0.4);
}

/* ── 描述列表 ── */
.product-detail__list-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.product-detail__list-title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.4;
}
.product-detail__list-text {
  font-size: 0.875rem;
  color: #475569;
  line-height: 1.6;
}

/* ── 响应式 ── */
@media (max-width: 900px) {
  #products-section .product-detail__body--split { flex-direction: column; }
  #products-section .product-detail__img-col { width: 100%; max-height: 200px; border-left: none; margin-top: 24px; }
  #products-section .product-detail__img-wrap { min-height: unset; padding: 12px 16px; }
  #products-section .product-detail__img-col img { max-height: 160px; }
}
@media (max-width: 640px) {
  #products-section .product-detail__content-col { padding: 16px 16px 20px; }
  .product-detail__name { font-size: 1.25rem; }
  #products-section .product-detail__btns { gap: 10px; }
  #products-section .product-detail__btn { padding: 10px 18px; font-size: 0.875rem; }
}

/* ── 标杆客户 ── */
.swiper.sh-cases-swiper .swiper-slide {
  height: auto;
  align-self: stretch;
}

/* ── 核心优势：三列独立卡片，参照 core_capability 风格 ── */
.content-section--advantage .advantages-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  background: none;
  box-shadow: none;
  border-radius: 0;
  padding: 0;
}

.content-section--advantage .advantage-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  padding: 28px 28px 24px;
  background: #ffffff;
  border: none;
  border-radius: 16px;
  box-shadow: var(--shadow-md);
  position: relative;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.content-section--advantage .advantage-card::before {
  display: none;
}

.content-section--advantage .advantage-card::after {
  display: none;
}

.content-section--advantage .advantage-card:hover {
  box-shadow: 0 20px 44px -12px rgba(124, 53, 255, 0.18), 0 6px 14px -4px rgba(124, 53, 255, 0.08);
}

/* 卡片内容层 */
.content-section--advantage .advantage-card__icon,
.content-section--advantage .advantage-card__body {
  position: relative;
  z-index: 1;
}

.content-section--advantage .advantage-card__icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: linear-gradient(135deg, #08E6F5 0%, #7C35FF 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  flex-shrink: 0;
  box-shadow: 0 0 0 rgba(124, 53, 255, 0);
  transition: background 0.5s cubic-bezier(0.4, 0, 0.2, 1),
              box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.content-section--advantage .advantage-card:hover .advantage-card__icon {
  background: linear-gradient(135deg, #08E6F5 0%, #7C35FF 100%);
  box-shadow: 0 6px 18px rgba(124, 53, 255, 0.25);
}

.content-section--advantage .advantage-card__icon img {
  width: 22px;
  height: 22px;
  filter: brightness(0) invert(1);
  transition: filter 0.5s ease;
}

.content-section--advantage .advantage-card:hover .advantage-card__icon img {
  filter: brightness(0) invert(1);
}

.content-section--advantage .advantage-card__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.content-section--advantage .advantage-card__title {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 8px;
  transition: color 0.4s ease;
}

.content-section--advantage .advantage-card:hover .advantage-card__title {
  color: #7C35FF;
}

.content-section--advantage .advantage-card__desc {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.65;
  text-align: left;
  transition: color 0.4s ease;
}

.content-section--advantage .advantage-card:hover .advantage-card__desc {
  color: #475569;
}



@media (max-width: 900px) {
  .content-section--advantage .advantages-row {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .content-section--advantage .advantage-card {
    padding: 24px 24px 20px;
  }
}

/* cases-carousel-section 样式已迁移至 product-detail.css */


.cases-carousel-section .cases-carousel-header {
  margin-bottom: 32px;
}

.cases-carousel-section .cases-carousel-header--center .pf-carousel-nav {
  position: absolute;
  right: 0;
  bottom: 0;
  margin-top: 0;
}

.cases-carousel-section .pf-carousel-btn {
  border-color: rgba(124, 53, 255, 0.16);
  color: #7C35FF;
  background: rgba(255,255,255,0.78);
  box-shadow: 0 8px 22px rgba(124, 53, 255, 0.08);
}

.cases-carousel-section .pf-carousel-btn:hover {
  border-color: rgba(124, 53, 255, 0.36);
  background: #F3EBFF;
}

.cases-carousel-section .case-carousel-card {
  background: #fff;
  border: 0;
  box-shadow:
    0 8px 12px rgba(15,23,42,0.055),
    0 1px 0 rgba(15,23,42,0.035),
    inset 0 1px 0 rgba(255,255,255,0.88);
}

.cases-carousel-section .case-carousel-card:hover {
  border-color: transparent !important;
  box-shadow:
    0 8px 12px rgba(15,23,42,0.07),
    0 1px 0 rgba(15,23,42,0.035),
    inset 0 1px 0 rgba(255,255,255,0.86) !important;
}

.cases-carousel-section .case-carousel-card__image {
  box-shadow: 0 5px 12px rgba(15,23,42,0.06);
}


.cases-carousel-section .case-carousel-card__link {
  color: #7C35FF;
}

/* Smart home: keep section backgrounds consistent with the broader site */
.page-content--smart-home .content-section--pain,
.page-content--smart-home .content-section--advantage {
  background: #fff;
}

#products-section {
  position: relative;
  overflow: hidden;
  padding: 96px 0;
}

#products-section::before {
  display: none;
}

#products-section > .container {
  position: relative;
  z-index: 1;
}


#products-section .product-detail-col {
  min-height: clamp(320px, 36vh, 420px);
  margin: 0 auto;
  overflow: hidden;
  border-radius: 0;
  display: block;
  width: 100%;
}

#products-section .product-detail-card {
  background: transparent;
  overflow: visible;
  width: 100%;
}

#products-section .product-detail__name {
  color: #081734;
  font-size: 1.375rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.3;
  margin-bottom: 10px;
}

#products-section .product-detail__subtitle {
  color: #42526b;
  font-size: 1rem;
  line-height: 1.7;
  margin-bottom: 20px;
}

#products-section .product-detail__body--split {
  align-items: flex-start;
  justify-content: center;
  gap: 48px;
  width: 100%;
  min-height: clamp(320px, 36vh, 420px);
  flex-direction: row-reverse;
}

#products-section .product-detail__content-col {
  flex: 1 1 0;
  padding: 30px 0 0 0;
}

#products-section .product-detail__img-col {
  width: auto;
  flex: 0 1 44%;
  min-height: clamp(320px, 36vh, 420px);
  overflow: visible;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
}

#products-section .product-nodes {
  min-height: inherit;
}

#products-section .product-detail__img-wrap {
  min-height: inherit;
  padding: 0;
}

#products-section .product-detail__img-glow {
  width: 340px;
  height: 260px;
  background: radial-gradient(circle, rgba(37,104,242,0.14) 0%, rgba(37,104,242,0.05) 50%, transparent 74%);
}

#products-section .product-detail__img-col img {
  width: 100%;
  max-width: 100%;
  filter: none;
  border-radius: 24px;
}

#products-section .product-detail__list {
  gap: 2px;
}

#products-section .product-detail__list-item {
  padding: 5px 0;
}

#products-section .product-detail__list-text {
  color: #64748b;
  font-size: 1rem;
  line-height: 1.8;
}
#products-section .product-detail__list-text strong {
  font-weight: 600;
  color: #1e3a6e;
}

/* ── 导航栏默认展示 ── */
#products-section .product-tab-nav.ptn-nav--visible {
  margin-top: 40px;
  opacity: 1;
  pointer-events: auto;
}

/* ── 底部切换按钮 ──
   product_switcher.ftl 当前未渲染这批 class（死代码），但同属 ptn-* 专属命名族，
   为保持一致性同样加前缀，避免今后恢复该 HTML 时又暴露裸选择器风险 */
#products-section .ptn-toggle-wrap {
  display: flex;
  justify-content: center;
  margin-top: 16px;
  display: none;
}
#products-section .ptn-toggle-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: #2568f2;
  cursor: pointer;
  position: relative;
  box-shadow: none;
  transition: color 0.2s;
  padding: 0;
}
#products-section .ptn-progress-ring {
  position: absolute;
  inset: 0;
  transform: rotate(-90deg);
}
#products-section .ptn-toggle-arrow {
  position: relative;
  z-index: 1;
  transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);
}
#products-section .ptn-toggle-btn--open .ptn-toggle-arrow {
  transform: rotate(180deg);
}
#products-section .ptn-toggle-btn:hover {
  color: #1a54d4;
}
#products-section .ptn-toggle-arrow {
  transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);
}
#products-section .ptn-toggle-btn--open .ptn-toggle-arrow {
  transform: rotate(180deg);
}

/* ── Tab 导航（smart-home 专属）基础样式 ── */
#products-section .product-tab-nav {
  background: #fff;
  border: none;
  border-radius: 9999px;
  padding: 6px 10px;
  box-shadow: 0 4px 24px rgba(37,99,235,.10);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  width: auto;
  max-width: 760px;
}
#products-section .ptn-swiper {
  overflow: hidden;
}

/* Tab 按钮：无背景，统一宽松间距 */
#products-section .ptn-tab {
  border-radius: 9999px;
  color: #52647f;
  font-size: 0.9375rem;
  font-weight: 500;
  padding: 10px 28px;
  position: relative;
  background: transparent;
}
#products-section .ptn-tab::after {
  content: '';
  position: absolute;
  bottom: -6px;
  left: 10%;
  right: 10%;
  width: auto;
  transform: scaleX(0);
  transform-origin: center;
  height: 3px;
  background: #2568f2;
  border-radius: 3px 3px 0 0;
  transition: transform 0.24s cubic-bezier(0.34,1.56,0.64,1);
}
#products-section .ptn-tab:hover {
  background: transparent;
  color: #2568f2;
}
#products-section .ptn-tab.active {
  background: transparent;
  color: #2568f2;
  font-weight: 600;
}
#products-section .ptn-tab.active::after {
  transform: scaleX(1);
}
#products-section .ptn-tab.active .ptn-tab__icon {
  opacity: 1;
  filter: brightness(0) saturate(100%) invert(27%) sepia(91%) saturate(2380%) hue-rotate(214deg) brightness(103%);
}
#products-section .ptn-arrow-btn {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: #8a9bb5;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
#products-section .ptn-arrow-btn:hover {
  background: rgba(37,104,242,.07);
  color: #2568f2;
}
#products-section .ptn-arrow-btn.disabled {
  opacity: 0.3;
  pointer-events: none;
}

/* ── brief 特性标签行（死代码，未被模板使用，随所在区块统一限定作用域）── */
#products-section .product-detail__brief-tags {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
  margin-bottom: 14px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #2568f2;
  display: none;
}
#products-section .product-detail__brief-tags span { color: #2568f2; }
#products-section .product-detail__brief-tags i {
  font-style: normal;
  color: #94a3b8;
  margin: 0 8px;
  font-size: 0.75rem;
}

@media (max-width: 900px) {
  #products-section {
    padding-top: 40px;
  }
  #products-section .product-detail-col {
    min-height: auto;
    display: block;
  }
  #products-section .product-tab-nav {
    width: fit-content;
    max-width: calc(100vw - 32px);
    overflow-x: auto;
  }
  #products-section .product-detail__body--split {
    flex-direction: column;
    gap: 24px;
    min-height: unset;
  }
  #products-section .product-detail__content-col {
    flex-basis: auto;
    width: 100%;
  }
  #products-section .product-detail__img-col {
    width: 100%;
    min-height: 260px;
    max-height: none;
  }
  #products-section .product-nodes,
  #products-section .product-detail__img-wrap {
    min-height: 260px;
  }
  #products-section .product-nodes .product-detail__img-wrap {
    padding: 0;
  }
  #products-section .product-detail__img-col img {
    max-height: none;
  }
}

@media (max-width: 640px) {
  #products-section .section-header {
    margin-bottom: 28px;
  }
  #products-section .product-detail__name {
    font-size: 1.75rem;
  }
  #products-section .product-detail__btns {
    flex-direction: column;
  }
  #products-section .product-detail__btn {
    width: 100%;
    justify-content: center;
  }
}


/* 只有一个标杆客户时：居中显示卡片，隐藏导航按钮 */
.cases-carousel-section .sh-cases-swiper .swiper-wrapper:has(> .swiper-slide:only-child) {
  justify-content: center;
}
.cases-carousel-section:has(.sh-cases-swiper .swiper-wrapper > .swiper-slide:only-child) .pf-carousel-nav {
  display: none;
}

/* ========================================================
   核心产品 (.content-section--products) 主色调整为 Mystic Purple
   仅在 .page-content--smart-home 的核心产品 section 内生效，
   不影响页面其它 section 的蓝色主调。
   ======================================================== */
:root {
  --sh-cp-primary:        #7C35FF;  /* Mystic Purple   主色 */
  --sh-cp-primary-strong: #6320e5;  /* 主色加深        hover */
  --sh-cp-primary-deep:   #191A6A;  /* Abyss Intellect 深色文字态 */
  --sh-cp-primary-08:     rgba(124, 53, 255, 0.08);
  --sh-cp-primary-12:     rgba(124, 53, 255, 0.12);
  --sh-cp-primary-16:     rgba(124, 53, 255, 0.16);
  --sh-cp-primary-tint:   #f7f0ff;  /* Misty Purple 调淡 */
  --sh-cp-primary-tint-2: #f4ecff;
}

#products-section .product-carousel-btn:hover {
  border-color: var(--sh-cp-primary);
  color: var(--sh-cp-primary);
}
#products-section .product-carousel-dot.active {
  background: var(--sh-cp-primary);
}

/* Tab 导航：阴影、active 颜色、hover 文字色、下划线 */
#products-section .product-tab-nav {
  box-shadow: 0 4px 24px var(--sh-cp-primary-12);
}
#products-section .ptn-tab::after {
  background: var(--sh-cp-primary);
}
#products-section .ptn-tab:hover {
  color: var(--sh-cp-primary);
}
#products-section .ptn-tab.active {
  color: var(--sh-cp-primary);
}
/* active 态的 PNG 图标着紫色：用 hue-rotate 调到紫色调；
   原值是把黑色 icon 转成 #2568f2，这里改成 ~ #7c35ff */
#products-section .ptn-tab.active .ptn-tab__icon {
  filter: brightness(0) saturate(100%) invert(28%) sepia(95%) saturate(5500%) hue-rotate(258deg) brightness(100%) contrast(101%);
}
#products-section .ptn-arrow-btn:hover {
  background: var(--sh-cp-primary-08);
  color: var(--sh-cp-primary);
}

/* 图片区光晕：换成紫色发光 */
#products-section .product-detail__img-glow {
  background: radial-gradient(circle,
    var(--sh-cp-primary-16) 0%,
    rgba(124, 53, 255, 0.05) 50%,
    transparent 74%);
}

/* 底部切换按钮：颜色与 hover */
#products-section .ptn-toggle-btn {
  color: var(--sh-cp-primary);
}
#products-section .ptn-toggle-btn:hover {
  color: var(--sh-cp-primary-strong);
}

/* brief 特性标签行（隐藏中但保留色系一致） */
#products-section .product-detail__brief-tags,
#products-section .product-detail__brief-tags span {
  color: var(--sh-cp-primary);
}

/* ── 通用 .ptn-* 在核心产品内的紫色覆盖（hover / active 浅底 / 文字） ── */
#products-section .ptn-tab:hover {
  color: var(--sh-cp-primary);
}
#products-section .ptn-more-btn:hover {
  background: rgba(255,255,255,0.6);
  color: var(--sh-cp-primary-deep);
}
#products-section .ptn-more-btn.active {
  color: var(--sh-cp-primary);
}
#products-section .ptn-dropdown {
  box-shadow: 0 12px 40px rgba(15,23,42,0.13), 0 2px 8px var(--sh-cp-primary-12);
}
#products-section .ptn-dd__item:hover {
  background: var(--sh-cp-primary-tint);
}
#products-section .ptn-dd__item.active {
  background: var(--sh-cp-primary-tint-2);
}
#products-section .ptn-dd__icon {
  background: var(--sh-cp-primary-tint-2);
}
#products-section .ptn-dd__item.active .ptn-dd__name {
  color: var(--sh-cp-primary);
}
#products-section .ptn-dropdown__all {
  color: var(--sh-cp-primary);
}

/* 主按钮：实色紫 + 紫色阴影 */
#products-section .product-detail__btn--primary {
  background: var(--sh-cp-primary);
  color: #fff;
  box-shadow: 0 6px 20px rgba(124, 53, 255, 0.28);
}
#products-section .product-detail__btn--primary:hover {
  background: var(--sh-cp-primary-strong);
  box-shadow: 0 8px 26px rgba(124, 53, 255, 0.38);
}

/* check icon：紫色渐变圆（主色 → Astral Purple #BE9AFF），勾保持白色 */
#products-section .product-detail__check-icon {
  background: linear-gradient(135deg, #08E6F5 0%, #7C35FF 100%);
  box-shadow: 0 2px 6px rgba(124, 53, 255, 0.25);
}


/* ══════════════════════════════════════════════
   端侧智能页（page 110 端侧模型与产品）专属样式
   来源：statics/static/yunzhi/edge-ai.html 内联样式迁移
   作用域：#edge-model / #edge-products 为页面内 block 唯一 id，
   与其他 solution 页面（page-content--smart-home 同类页）不冲突
   ══════════════════════════════════════════════ */

/* ---- 端侧模型区：左右无缝衔接为一个整体，外层统一圆角 ---- */
.edge-model-card {
  display: grid;
  grid-template-columns: minmax(0, 340px) 1fr;
  align-items: stretch;
  gap: 28px;
}
.edge-model-card__right {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.edge-model-card__intro {
  position: relative;
  padding: 44px 32px 40px;
  display: flex;
  flex-direction: column;
  background: linear-gradient(150deg, #6420E0 0%, #7C35FF 46%, #C4A8FF 100%);
  border-radius: 16px;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .08);
  overflow: hidden;
  min-height: 100%;
}
.edge-model-card__intro::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 92% 4%, rgba(8,230,245,.4) 0%, transparent 40%),
    radial-gradient(circle at -6% 108%, rgba(190,154,255,.4) 0%, transparent 58%);
  pointer-events: none;
}

.edge-model-card__intro > * { position: relative; z-index: 1; }
.edge-model-card__name {
  font-size: 1.625rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.45;
  letter-spacing: -0.01em;
  margin-bottom: 20px;
}
.edge-model-card__rule {
  width: 32px;
  height: 3px;
  border-radius: 2px;
  background: linear-gradient(90deg, #08E6F5 0%, rgba(255,255,255,.5) 100%);
  margin-bottom: 20px;
  position: relative;
  z-index: 1;
}
.edge-model-card__desc {
  font-size: .875rem;
  color: rgba(255,255,255,.78);
  line-height: 1.9;
}
.edge-model-card__img {
  margin-top: auto;
  padding-top: 32px;
  display: flex;
  justify-content: center;
}
.edge-model-card__img img {
  max-width: 220px;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 20px 32px rgba(20, 6, 60, .35));
}
/* 模型切换 tab（当前仅一个模型，预留多模型切换） */
.edge-model-tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-bottom: 40px;
}
.edge-model-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  background: #fff;
  border: 1px solid transparent;
  border-radius: 50px;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .08);
  font-size: .875rem;
  font-weight: 600;
  color: var(--color-text-secondary);
  cursor: pointer;
  transition: border-color .2s, color .2s, box-shadow .2s, background .2s;
}
.edge-model-tab img {
  width: 18px; height: 18px;
  opacity: .5;
  filter: grayscale(1);
}
.edge-model-tab.is-active {
  border-color: var(--color-accent);
  color: #fff;
  background: var(--color-accent);
  box-shadow: 0 4px 14px rgba(124,53,255,.14);
}
.edge-model-tab.is-active img {
  opacity: 1;
  filter: brightness(0) invert(1);
}
.edge-model-panel { display: none; }
.edge-model-panel.is-active {
  display: block;
}

/* 能力详情：右侧 2 列网格，图标+标题同行、描述左对齐，行间以分隔线区隔 */
.edge-cap-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 56px;
}
.edge-cap-item {
  text-align: left;
  padding: 20px 0;
  border-bottom: 1px solid var(--color-border-light);
}
.edge-cap-list > .edge-cap-item:last-child,
.edge-cap-list > .edge-cap-item:nth-last-child(2):nth-child(odd) {
  border-bottom: none;
}
/* 左右结构：编号单独居左，标题+描述在右侧上下排列 */
.edge-cap-item--row {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin: 0 -16px;
  padding-left: 16px;
  padding-right: 16px;
  border-radius: 16px;
  transition: background .3s cubic-bezier(.22,1,.36,1), transform .3s cubic-bezier(.22,1,.36,1);
}
.edge-cap-item--row:hover {
  background: linear-gradient(135deg, #7C35FF 0%, #6320E5 55%, #35C8D6 100%);
  transform: translateX(4px);
}
.edge-cap-item__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 2px;
  font-family: var(--font-num);
  font-size: .875rem;
  font-weight: 700;
  color: var(--color-accent);
  background: var(--color-accent-soft);
  width: 30px; height: 30px;
  border-radius: 9px;
  transition: background .3s, color .3s;
}
.edge-cap-item--row:hover .edge-cap-item__num {
  background: rgba(255,255,255,.16);
  color: #fff;
}
.edge-cap-item--row:hover .edge-cap-item__title,
.edge-cap-item--row:hover .edge-cap-item__desc {
  color: #fff;
}
.edge-cap-item--row:hover .edge-cap-item__desc {
  color: rgba(255,255,255,.8);
}
.edge-cap-item--row:hover .edge-cap-item__metric {
  color: #fff;
}
.edge-cap-item__body {
  flex: 1;
  min-width: 0;
}
.edge-cap-item__title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text-primary);
  line-height: 1.4;
  margin-bottom: 12px;
  transition: color .3s;
}
.edge-cap-item__desc {
  font-size: .875rem;
  color: var(--color-text-secondary);
  line-height: 1.85;
  text-align: left;
  transition: color .3s;
}
/* 色块式变体：每项独立色块，图标悬浮右下角作装饰，用于 edge-model-card__right 内的能力列表 */
.edge-cap-list:has(.edge-cap-item--card) {
  flex: 1;
  column-gap: 16px;
  row-gap: 16px;
  align-content: stretch;
}
.edge-cap-item--card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 22px 20px;
  margin: 0;
  border: none;
  border-radius: 14px;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .08);
  overflow: hidden;
}
.edge-cap-item--card::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity .5s ease;
  pointer-events: none;
}
.edge-cap-item--card:hover::before {
  opacity: 1;
}
.edge-cap-item--card > * {
  position: relative;
  z-index: 1;
}
.edge-cap-item--card:hover .edge-cap-item__icon {
  opacity: .75;
  transform: scale(1.08);
}
.edge-cap-item--card .edge-cap-item__title,
.edge-cap-item--card .edge-cap-item__desc {
  color: #1f2937;
  transition: color .3s ease;
}
.edge-cap-item--card:hover .edge-cap-item__title,
.edge-cap-item--card:hover .edge-cap-item__desc {
  color: #fff;
}
.edge-cap-item--card:nth-child(1) { background: linear-gradient(150deg, #ece4fe 0%, #ece4fe 100%); }
.edge-cap-item--card:nth-child(2) { background: linear-gradient(150deg, #dcf0ff 0%, #dcf0ff 100%); }
.edge-cap-item--card:nth-child(3) { background: linear-gradient(150deg, #dbe1fb 0%, #cdd7f9 100%); }
.edge-cap-item--card:nth-child(4) { background: linear-gradient(150deg, #ece0fe 0%, #e3cffd 100%); }
.edge-cap-item--card:nth-child(5) { background: linear-gradient(150deg, #ffe9d2 0%, #ffdcb3 100%); }
.edge-cap-item--card::before { background: linear-gradient(135deg, #08e6f5 0%, #45a3ff 38%, #7c35ff 100%); }
.edge-cap-item--card .edge-cap-item__icon {
  position: absolute;
  right: 16px;
  bottom: 14px;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  opacity: .7;
  transition: opacity .3s, transform .3s;
}
.edge-cap-item--card .edge-cap-item__icon img {
  width: 34px;
  height: 34px;
  object-fit: contain;
  filter: brightness(0) saturate(100%) invert(24%) sepia(90%) saturate(3500%) hue-rotate(255deg) brightness(96%) contrast(103%);
  transition: filter .3s ease;
}
.edge-cap-item--card:hover .edge-cap-item__icon img {
  filter: brightness(0) invert(1);
}
.edge-cap-item--card .edge-cap-item__body {
  min-width: 0;
  padding-right: 40px;
}
.edge-cap-item--wide {
  grid-column: 1 / -1;
}
.edge-cap-item__metric {
  color: var(--color-accent);
  font-weight: 700;
}

/* ---- 端侧产品区：规格卡片 ---- */
.edge-product-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
.edge-product-card {
  background: #fff;
  border-radius: 16px;
  padding: 32px;
  box-shadow: 0 2px 16px rgba(0,0,0,.04);
  transition: box-shadow .3s, transform .3s;
  display: flex;
  flex-direction: column;
}
.edge-product-card:hover {
  box-shadow: 0 16px 40px rgba(25,26,106,.12);
  transform: translateY(-4px);
}
.edge-product-card__head {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}
.edge-product-card__icon {
  position: relative;
  flex-shrink: 0;
  width: 64px; height: 64px;
  border-radius: 50%;
  background: linear-gradient(145deg, #A78BFA 0%, #8B5CF6 100%);
  display: flex; align-items: center; justify-content: center;
  transition: box-shadow .3s;
}
.edge-product-card__icon::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: linear-gradient(145deg, var(--color-accent) 0%, #6D28D9 100%);
  opacity: 0;
  transition: opacity .3s;
}
.edge-product-card__icon img { position: relative; z-index: 1; width: 28px; height: 28px; filter: brightness(0) invert(1); }
.edge-product-card:hover .edge-product-card__icon {
  box-shadow: 0 8px 20px rgba(139,92,246,.35);
}
.edge-product-card:hover .edge-product-card__icon::before {
  opacity: 1;
}
.edge-product-card__title-col {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.edge-product-card__name {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-text-primary);
}
.edge-product-card__desc {
  font-size: .875rem;
  color: var(--color-text-secondary);
  line-height: 1.8;
  margin-bottom: 24px;
}
.edge-product-card__divider {
  height: 1px;
  background: var(--color-border-light);
  margin-bottom: 20px;
}
.edge-product-card__tags {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.edge-product-card__tags li {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  background: var(--color-bg-subtle);
  border: 1px solid var(--color-border-light);
  color: var(--color-text-secondary);
  border-radius: 50px;
  font-size: .75rem;
  font-weight: 600;
}

@media (max-width: 1024px) {
  .edge-model-card { grid-template-columns: 1fr; }
  .edge-model-card__intro { padding: 40px 32px; }
  .edge-model-card__right { padding: 40px 32px 12px; }
  .edge-cap-item:not(.edge-cap-item--card) { border-bottom: 1px solid var(--color-border-light) !important; }
  .edge-cap-list > .edge-cap-item:last-child:not(.edge-cap-item--card) { border-bottom: none !important; }
  .edge-product-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .edge-cap-list { grid-template-columns: 1fr; }
  .edge-product-grid { grid-template-columns: 1fr; }
}