/* 首页专用样式 */
.home-hero-media img { width: 100%; }

/* ---------- 首屏图片轮播（图在文字上方，整宽） ---------- */
.home-hero { padding-top: 2.5rem; }
.home-hero .hero-inner { grid-template-columns: minmax(0, 1fr); gap: 2.5rem; align-items: stretch; }
.hero-slider { position: relative; }
.hero-slider .slider-stage { position: relative; aspect-ratio: 21 / 9; background: #1b2430; }
.hero-slider .slider-slide { position: absolute; inset: 0; margin: 0; opacity: 0; visibility: hidden; transition: opacity .45s ease; }
.hero-slider .slider-slide.is-active { opacity: 1; visibility: visible; }
.hero-slider .slider-slide img { width: 100%; height: 100%; object-fit: cover; }
.hero-slider .slider-slide figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 2.4rem 5rem .7rem 1rem; font-size: .8125rem; line-height: 1.5; color: #dce5f0; background: linear-gradient(to top, rgba(15, 21, 28, .88), rgba(15, 21, 28, 0)); }
.hero-slider .slider-arrow { display: none; }
.hero-slider .slider-dots { display: none; }
html.js .hero-slider .slider-arrow { position: absolute; top: 50%; margin-top: -19px; width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; padding: 0; border: 0; border-radius: 999px; background: rgba(19, 26, 34, .55); color: #fff; cursor: pointer; transition: background-color .2s ease, transform .2s ease; }
html.js .hero-slider .slider-arrow:hover { background: rgba(43, 127, 255, .92); color: #fff; }
html.js .hero-slider .slider-arrow:active { transform: scale(.94); }
html.js .hero-slider .slider-arrow:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
html.js .hero-slider .slider-arrow svg { width: 20px; height: 20px; }
html.js .hero-slider .slider-arrow--prev { left: 12px; }
html.js .hero-slider .slider-arrow--next { right: 12px; }
html.js .hero-slider .slider-dots { position: absolute; right: 12px; bottom: 12px; display: flex; gap: 6px; }
html.js .hero-slider .slider-dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .45); cursor: pointer; transition: background-color .2s ease, width .2s ease; }
html.js .hero-slider .slider-dot:hover { background: rgba(255, 255, 255, .8); }
html.js .hero-slider .slider-dot.is-active { width: 20px; background: var(--accent); }
html.js .hero-slider .slider-dot:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.home-highlight { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem; }
.home-highlight .card { border-top: 2px solid var(--brand); }
.home-highlight h3 { font-size: 1rem; }
.home-highlight p { font-size: .9375rem; color: var(--ink-2); }
/* ---------- 首页产品中心（左栏系列 / 推荐产品 + 右侧图片网格） ---------- */
.showcase { display: grid; grid-template-columns: 232px minmax(0, 1fr); gap: 1.75rem; align-items: start; }
.showcase-side { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.showcase-side-title { margin: 0; padding: .8rem 1rem; font-size: 1rem; font-weight: 600; color: #fff; text-align: center; letter-spacing: .06em; background: var(--brand-deep); }
.showcase-side-title--sub { border-top: 1px solid var(--line); }
.showcase-series { list-style: none; margin: 0; padding: 0; }
.showcase-series li + li { border-top: 1px solid var(--line); }
.showcase-series a { display: block; padding: .68rem 1.05rem; font-size: .9375rem; color: var(--ink-2); transition: background-color .2s ease, color .2s ease, padding-left .2s ease; }
.showcase-series a:hover { background: var(--bg-tint); color: var(--brand-dark); padding-left: 1.25rem; text-decoration: none; }
.showcase-series a:active { background: var(--bg-soft); }
.showcase-series a:focus-visible { outline: 2px solid var(--brand); outline-offset: -2px; }
.showcase-picks { margin: 0; padding: .9rem 1rem .9rem 2.5rem; }
.showcase-picks li { padding-left: .1rem; }
.showcase-picks li + li { margin-top: .3rem; }
.showcase-picks li::marker { color: #d0342c; font-weight: 700; }
.showcase-picks a { font-size: .875rem; color: var(--ink-2); transition: color .2s ease; }
.showcase-picks a:hover { color: var(--brand-dark); }
.showcase-picks a:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.showcase-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; list-style: none; margin: 0; padding: 0; }
.showcase-grid a { display: flex; flex-direction: column; height: 100%; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.showcase-grid a:hover { border-color: var(--brand); box-shadow: 0 10px 22px rgba(31, 39, 51, .1); transform: translateY(-2px); text-decoration: none; }
.showcase-grid a:active { transform: translateY(0); box-shadow: 0 4px 10px rgba(31, 39, 51, .08); }
.showcase-grid a:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.showcase-grid figure { display: flex; align-items: center; justify-content: center; margin: 0; aspect-ratio: 1 / 1; background: #fff; overflow: hidden; }
.showcase-grid img { width: 100%; height: 100%; object-fit: contain; transition: transform .3s ease; }
.showcase-grid a:hover img { transform: scale(1.04); }
.showcase-grid span { display: block; margin-top: auto; padding: .55rem .6rem; font-size: .875rem; color: #fff; text-align: center; background: var(--brand-deep); transition: background-color .2s ease; }
.showcase-grid a:hover span { background: var(--brand); }
.showcase-more { margin: 1.25rem 0 0; }
.home-about-media { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.home-industry { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.home-industry .card { background: #fff; }
.home-industry h3 { font-size: 1rem; margin-bottom: .35rem; }
.home-industry p { font-size: .875rem; color: var(--ink-2); margin: 0; }
.home-qa .faq-list { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 0 1.25rem; }
.home-qa .faq-item:last-child { border-bottom: 0; }
.home-news-list { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 0 1.25rem; }
.home-cta-media img { width: 100%; border-radius: var(--radius); }

@media (max-width: 1024px) {
  .home-highlight, .home-industry { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero-slider .slider-stage { aspect-ratio: 16 / 9; }
  .showcase { grid-template-columns: minmax(0, 1fr); }
  .showcase-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .home-highlight, .home-industry { grid-template-columns: minmax(0, 1fr); }
  .hero-slider .slider-stage { aspect-ratio: 4 / 3; }
  .hero-slider .slider-slide figcaption { padding: 2rem 4.5rem .6rem .8rem; font-size: .75rem; }
  .showcase-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
  .showcase-grid span { font-size: .8125rem; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-slider .slider-slide { transition: none; }
  .showcase-grid a, .showcase-grid img, .showcase-grid span, .showcase-series a, .showcase-picks a { transition: none; }
  .showcase-grid a:hover { transform: none; }
  .showcase-grid a:hover img { transform: none; }
}