.industryPage {
  background: #fff;
}

.industryHeading {
  text-align: center;
}

.industryHeading h2 {
  color: #111;
  font-size: clamp(26px, .32rem, 32px);
  font-weight: 700;
}

.industryHeading i,
.leftTitle::before {
  content: '';
  width: .3rem;
  height: .06rem;
  display: block;
  margin: .15rem auto .17rem;
  border-radius: .2rem;
  background: var(--blue);
}

.industryHeading p {
  color: #777;
  font-size: clamp(14px, .2rem, 20px);
}

.industryOverview {
  padding: .55rem 0 .7rem;
}

.overviewCard {
  position: relative;
  margin-top: .55rem;
  min-height: 4.82rem;
  margin-left: .43rem;
  width: calc(100% - .43rem);
  padding: .75rem .75rem .75rem 6.08rem;
  border-radius: .1rem;
  background: #f1f5f8;
}

.overviewCard>img {
  position: absolute;
  top: .49rem;
  left: -.43rem;
  width: 5.77rem;
  height: 3.84rem;
  border-radius: .1rem;
  object-fit: cover;
}

.overviewContent {
  max-width: 7.19rem;
}

.overviewCard h3 {
  display: flex;
  align-items: center;
  font-size: clamp(25px, .32rem, 32px);
  font-weight: 700;
  line-height: .47rem;
}

.overviewIcon {
  flex: none;
  width: .47rem;
  height: .47rem;
  margin-right: .16rem;
  border-radius: 50%;
  background: #D3E6FF;
  display: flex;
  align-items: center;
  justify-content: center;
}

.overviewIcon img {
  width: .28rem;
  height: .28rem;
  margin: auto;
}

.overviewCard p {
  margin-top: .33rem;
  color: #333;
  font-size: clamp(14px, .16rem, 16px);
  line-height: 1.85;
}

.leftTitle {
  position: relative;
  padding-left: .23rem;
  color: #111;
  font-size: clamp(25px, .32rem, 32px);
  font-weight: 700;
}

.leftTitle::before {
  position: absolute;
  top: .2rem;
  left: 0;
  margin: 0;
  transform: rotate(90deg);
}

.industryLayout {
  padding: .72rem 0;
}

.industryPain {
  padding: .8rem 0 .75rem;
}

.painGrid {
  margin-top: .54rem;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .24rem;
}

.painGrid article {
  min-height: 2.49rem;
  padding: .5rem .24rem .3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: .1rem;
  background: #f4f7fc;
  text-align: center;
  transition: all .3s ease-in-out;
}

.painGrid article:hover {
  transform: translateY(-.1rem);
  box-shadow: 0 0 .1rem rgba(0, 0, 0, .1);
  background: #e6f2ff;
}

.painGrid b {
  margin-top: .21rem;
  font-size: clamp(19px, .24rem, 24px);
  font-weight: 700;
  line-height: 1.3;
}

.painGrid p {
  margin-top: .12rem;
  color: #8a8a8a;
  font-size: clamp(14px, .16rem, 16px);
  line-height: 1.65;
}

.painIcon {
  display: block;
  width: .42rem;
  height: .42rem;
  color: var(--orange);
  display: flex;
  align-items: center;
  justify-content: center;
}

.painIcon img {
  width: .42rem;
  height: .42rem;
}


.industryPlan {
  padding: .75rem 0 .35rem;
  background: linear-gradient(to bottom, #f3faff 0, #fff 7.87rem);
}

.planIntro {
  max-width: 14.23rem;
  margin: .25rem .12rem 0;
  color: #333;
  font-size: clamp(14px, .24rem, 24px);
  line-height: 1.75;
}

.planGrid {
  margin-top: .25rem;
}

.planItem {
  min-height: 6.36rem;
  padding: .55rem 0 .97rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 6.76rem;
  align-items: center;
  border-bottom: 1px solid #e8e8e8;
}

.planItemReverse {
  grid-template-columns: 6.76rem minmax(0, 1fr);
}

.planItem img {
  width: 6.76rem;
  height: 4.39rem;
  border-radius: .1rem;
  object-fit: cover;
}

.planContent {
  max-width: 5.6rem;
  padding-left: .52rem;
}

.planItemReverse .planContent {
  padding-left: 1.59rem;
  max-width: none;
}

.planContent strong {
  display: block;
  color: var(--blue);
  font-size: clamp(18px, .4rem, 40px);
  font-weight: 700;
  line-height: 1.3;
}

.planContent h3 {
  margin-top: .3rem;
  font-size: clamp(17px, .32rem, 32px);
  font-weight: 700;
  line-height: 1.35;
}

.planContent p {
  margin-top: .24rem;
  color: #333;
  font-size: clamp(14px, .18rem, 18px);
  line-height: 1.72;
}

.industryApplications {
  padding: .9rem 0 .75rem;
}

.applicationGrid {
  margin-top: .33rem;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .2rem .24rem;
}

.applicationGrid article {
  min-height: 2.49rem;
  padding: .34rem .38rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border-radius: .1rem;
  background: #f4f7fc;
  color: var(--blue);
}

.applicationGrid b {
  margin-top: .17rem;
  color: #111;
  font-size: clamp(18px, .2rem, 20px);
  line-height: 1.3;
}

.applicationGrid span {
  margin-top: .13rem;
  color: #333;
  font-size: clamp(14px, .2rem, 20px);
  line-height: 1.7;
}

.applicationGrid span:last-child {
  font-size: clamp(14px, .16rem, 16px);
}

.applicationIcon {
  position: relative;
  display: block;
  width: .44rem;
  height: .44rem;
  color: inherit;
}

.industryCases {
  padding: .75rem 0 .84rem;
  background: #fff;
}

.industryCaseGrid {
  margin-top: .33rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .26rem;
}

.industryCaseGrid a {
  height: 3rem;
  position: relative;
  overflow: hidden;
  background: #0c2d69;
}

.industryCaseGrid a::after {
  display: none;
}

.industryCaseGrid img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}

.industryCaseGrid a:hover img {
  transform: scale(1.06);
}

.industryCaseGrid span {
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: 0;
  left: 0;
  height: .65rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, .65);
  color: #fff;
  font-size: clamp(15px, .18rem, 18px);
  font-weight: 400;
}

@media (max-width: 768px) {
  .leftTitle::before{ top: .3rem;}
  .industryOverview, .industryLayout, .industryPain, .industryPlan, .industryApplications, .industryCases { padding: .5rem 0; }
  .overviewCard { width: 100%; min-height: 0; margin: .28rem 0 0; padding: .18rem; }
  .overviewCard > img { width: 100%; height: 2.45rem; position: static; border-radius: .07rem; }
  .overviewContent { max-width: none; padding: .2rem .04rem .08rem; }
  .overviewCard h3 { font-size: clamp(20px, .26rem, 26px); }
  .overviewCard p { margin-top: .16rem; line-height: 1.65; }

  .painGrid, .applicationGrid { grid-template-columns: repeat(2, 1fr); gap: .14rem; margin-top: .27rem; }
  .painGrid article, .applicationGrid article { min-height: 2.15rem; padding: .24rem .15rem; }
  .painGrid b, .applicationGrid b { margin-top: .1rem; font-size: clamp(15px, .19rem, 19px); }
  .painGrid p, .applicationGrid span { font-size: clamp(12px, .14rem, 14px); line-height: 1.55; }

  .planIntro { margin: .18rem 0 0; font-size: clamp(14px, .17rem, 17px); }
  .planItem, .planItemReverse { min-height: 0; padding: .3rem 0; display: flex; flex-direction: column; align-items: stretch; }
  .planItemReverse { flex-direction: column-reverse; }
  .planItem img { width: 100%; height: 2.5rem; order: 0; }
  .planContent, .planItemReverse .planContent { max-width: none; padding: .2rem .04rem 0; }
  .planContent strong { font-size: clamp(22px, .3rem, 30px); }
  .planContent h3 { margin-top: .13rem; font-size: clamp(18px, .23rem, 23px); }
  .planContent p { margin-top: .12rem; font-size: clamp(13px, .16rem, 16px); line-height: 1.65; }

  .industryCaseGrid { grid-template-columns: 1fr; gap: .16rem; margin-top: .25rem; }
  .industryCaseGrid a { height: 2.45rem; }
}
