/* -------- 全局容器：居中 + 1071px 宽 -------- */
#micromyu-homepage {
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 5%;
}

/* 让每个 section 的 container 都居中收口 */
#micromyu-homepage section > .solutions-container,
#micromyu-homepage section > .industry-container,
#micromyu-homepage section > .updates-container,
#micromyu-homepage section > .vision-container {
  width: 100%;
  max-width: var(--page-max);
  margin-inline: auto;
  padding-inline: 16px;          /* 细边距，避免贴边 */
}

/* -------- 核心解决方案：上大卡 + 下三卡 + 操作行 -------- */
.solutions-section,
.solutions-hero-card { position: relative; z-index: 5; }

.solutions-hero-card {
  display: grid;
  grid-template-columns: 1.2fr .9fr;   /* 左文右图 */
  gap: 28px;
  padding: 28px;
  background: var(--panel);
  border: 2px solid var(--panel-border);
  border-radius: var(--radius, 14px);
  box-shadow: var(--shadow, 0 10px 28px rgba(0,0,0,.35));
}

.solutions-hero-content { align-self: center; }
.solutions-hero-image img {
  width: 100%;
  height: 100%;
  max-height: 340px;
  object-fit: cover;
  border-radius: calc(var(--radius) - 4px);
}

/* 三张服务卡：三列网格 */
.solutions-services-wrapper {
  margin-top: 18px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.solution-card {
  border: 2px solid rgba(0,0,0,.08);
  border-radius: var(--radius);
  padding: 22px;
  outline: 2px solid rgba(0, 224, 255, .25);
  box-shadow: 0 12px 24px rgba(0, 224, 255, .12)
}
.solution-card-featured {
  outline: 2px solid rgba(0, 224, 255, .25);
  box-shadow: 0 12px 24px rgba(0, 224, 255, .12);
}

/* 行动区：两列 */
.solutions-action-row {
  margin-top: 18px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.solution-action-card {
  border: 2px solid rgba(0,0,0,.08);
  border-radius: var(--radius);
  padding: 22px;
  outline: 2px solid rgba(0, 224, 255, .25);
  box-shadow: 0 12px 24px rgba(0, 224, 255, .12)
}
.solution-action-highlight {
  outline: 2px solid rgba(0, 255, 200, .35);
  box-shadow: 0 16px 28px rgba(0, 255, 200, .15);
}

/* -------- 行业应用：上大卡 + 下 3x2 网格 -------- */
.industry-featured-card {
  margin-top: 36px;
  display: grid;
  grid-template-columns: 1.2fr .9fr;
  gap: 28px;
  padding: 28px;
  background: var(--panel);
  border: 2px solid var(--panel-border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.industry-featured-image img {
  width: 100%;
  height: 100%;
  max-height: 320px;
  object-fit: cover;
  border-radius: calc(var(--radius) - 4px);
}

.industry-grid {
  margin-top: 18px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.industry-card {
  border: 2px solid rgba(0,0,0,.08);
  border-radius: var(--radius);
  padding: 18px 18px 16px;
  outline: 2px solid rgba(0, 255, 200, .35);
  box-shadow: 0 12px 24px rgba(0, 255, 200, .12);
}
.industry-card-cta {
  outline: 2px solid rgba(0, 255, 200, .35);
  box-shadow: 0 12px 24px rgba(0, 255, 200, .12);
}

/* -------- 最新动态：左导轨 + 右内容列 -------- */
.updates-container {
  margin-top: 36px;
  display: grid;
  grid-template-columns: 1.1fr .95fr;
  gap: 24px;
}
.updates-lead-rail .updates-milestone-cards {
  display: grid;
  gap: 14px;
}
.update-card {
  border: 2px solid rgba(0,0,0,.08);
  border-radius: var(--radius);
  padding: 16px 18px;
  outline: 2px solid rgba(0, 224, 255, .25);
}
.update-card-milestone {
  outline: 2px solid rgba(0, 224, 255, .25);
}

/* 右列 spotlight 卡片 */
.spotlight-card {
  display: grid;
  grid-template-columns: .9fr 1.2fr;  /* 图文并排 */
  gap: 14px;
  border: 2px solid rgba(0,0,0,.08);
  border-radius: var(--radius);
  padding: 14px;
  margin-top: 5px;
  outline: 2px solid rgba(0, 224, 255, .25);
}

.spotlight-card2 {
  display: grid;
  /* grid-template-columns: .9fr 1.2fr;  图文并排 */
  gap: 14px;
  border: 2px solid rgba(0,0,0,.08);
  border-radius: var(--radius);
  padding: 14px;
  margin-top: 5px;
  outline: 2px solid rgba(0, 224, 255, .25);
}

.spotlight-image img {
  width: 100%; height: 100%;
  max-height: 160px; object-fit: cover;
  border-radius: calc(var(--radius) - 6px);
}
.updates-cta {
  margin-top: 12px;
  padding: 16px;
  background: linear-gradient(180deg, rgba(0,255,200,.12), transparent 60%);
  border: 2px solid var(--panel-border);
  border-radius: var(--radius);
  text-align: center;
}

/* -------- 愿景：左大面板 + 右 2x2 卡 -------- */
.vision-container {
  margin-top: 36px;
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 24px;
}
.vision-lead-panel {
  background: var(--panel);
  border: 2px solid var(--panel-border);
  border-radius: var(--radius);
  padding: 22px;
  box-shadow: var(--shadow);
}
.vision-image img {
  width: 100%;
  max-height: 260px;
  object-fit: cover;
  border-radius: calc(var(--radius) - 4px);
  margin: 12px 0;
}
.vision-cluster {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.vision-card {
  border: 2px solid rgba(0,0,0,.08);
  border-radius: var(--radius);
  padding: 16px;
}

/* -------- 响应式（≤ 1080 与 ≤ 768） -------- */
@media (max-width: 1080px) {
  :root { --page-max: 100%; } /* 小于 1080 时让容器吃满可视宽（仍居中） */
}

@media (max-width: 768px) {
  .solutions-hero-card,
  .industry-featured-card,
  .updates-container,
  .vision-container,
  .spotlight-card {
    grid-template-columns: 1fr;   /* 手机改单列 */
  }
  .solutions-services-wrapper,
  .industry-grid,
  .solutions-action-row {
    grid-template-columns: 1fr;   /* 三列/两列栅格改单列 */
  }
  .solutions-hero-image img,
  .industry-featured-image img { max-height: 220px; }
}
