/* ============================================================
   盈波光电首页 P1.6 — 整体节奏 / 区块间距 / 动效统一
   作用范围：仅 body.site-home 首页。
   目标：不重做既有 P1.3.1 / P1.4 / P1.5 模块，只统一：
         1) Banner 高度与首屏比例；
         2) 产品 / About / 方案 / 新闻 / Footer 之间的纵向节奏；
         3) 首页容器边距和区块标题节奏；
         4) WOW 进入动画时长，减少“各模块各动各的”感觉；
         5) 移动端进一步减少无效空白。
   ============================================================ */

.site-home {
  --p16-page-bg: #eef2f7;
  --p16-divider: rgba(120, 139, 163, .15);
  --p16-ease: cubic-bezier(.22, .61, .36, 1);
}

/* 首页内容容器统一安全边距；不影响 header/footer 和其他内页。 */
.site-home .eyidx_News > .w1400,
.site-home .eyidx_about > .w1400,
.site-home .eyidx_Case > .w1400,
.site-home .home-news-section > .w1400 {
  width: min(1400px, calc(100% - 80px));
}

/* ------------------------------------------------------------
   1. Banner：超宽屏不再无限增高，减少“首屏只有大图”的压迫感。
   常规 1366 / 1440 分辨率基本维持原比例，仅 1600+ 略收紧。
   ------------------------------------------------------------ */
.site-home .apple-banner {
  height: clamp(430px, calc(100vw * 650 / 1920), 610px);
  min-height: 0;
  max-height: 610px;
  border-bottom: 1px solid rgba(148, 163, 184, .12);
  background-color: var(--p16-page-bg);
}

.site-home .apple-banner .swiper-button-next span,
.site-home .apple-banner .swiper-button-prev span {
  width: 58px;
  height: 58px;
  margin-top: -29px;
  background-size: 58px 58px;
  opacity: .62;
  transition: opacity .26s ease, transform .26s var(--p16-ease), box-shadow .26s ease;
}

.site-home .apple-banner .swiper-pagination {
  bottom: 18px;
  height: 36px;
  width: auto;
  min-width: 96px;
  padding: 0 13px;
  background: rgba(25, 39, 59, .16);
  box-shadow: 0 7px 20px rgba(15, 23, 42, .06);
}

.site-home .apple-banner .swiper-pagination-bullet {
  width: 11px;
  height: 11px;
  margin: 0 5px;
}

@media (hover: hover) and (pointer: fine) {
  .site-home .apple-banner .swiper-button-next:hover span,
  .site-home .apple-banner .swiper-button-prev:hover span {
    opacity: .82;
    transform: scale(1.035);
    box-shadow: 0 12px 28px rgba(15, 23, 42, .16);
  }
}

/* ------------------------------------------------------------
   2. 产品展示（信息卡）→ About：两块同属浅色背景，减少中间空洞，
      用一条很淡的分隔线完成视觉换段。
   ------------------------------------------------------------ */
.site-home .eyidx_News {
  padding-top: 54px;
  padding-bottom: 44px;
  background: var(--p16-page-bg);
}

.site-home .eyidx_News .eytitle {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
}

.site-home .eyidx_News .eyidxnews_tit {
  float: none;
  width: auto;
  margin: 0 0 2px auto;
}

.site-home .eyidx_News .eyidxnews_list {
  margin-top: 24px;
}

.site-home .eyidx_about {
  position: relative;
  padding-top: 22px;
  padding-bottom: 60px;
}

.site-home .eyidx_about::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: min(1400px, calc(100% - 80px));
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, var(--p16-divider) 18%, var(--p16-divider) 82%, transparent);
  pointer-events: none;
}

/* 数据卡与主 About 卡之间更紧凑，避免一段内容被拉成两段。 */
.site-home .eyidx_about .eyidxabout_data {
  padding-top: 22px;
}

/* ------------------------------------------------------------
   3. 方案/应用区：保持深色品牌段，但收敛原 450px 卡片高度。
      这是首页唯一大面积深色段，前后留白均衡即可。
   ------------------------------------------------------------ */
.site-home .eyidx_Case {
  padding-top: 66px;
  padding-bottom: 68px;
}

.site-home .eyidx_Case .h_pros_list {
  height: 410px;
  margin-top: 27px;
}

/* ------------------------------------------------------------
   4. 新闻 → Footer：新闻已由 P1.5 单独精修，这里仅收整体上下节奏。
   ------------------------------------------------------------ */
.site-home .home-news-section {
  padding-top: 60px;
  padding-bottom: 62px;
}

.site-home .home-news-section .home-news-grid {
  margin-top: 27px;
}

.site-home .home-news-section .home-news-footer {
  margin-top: 22px;
}

/* 首页各主体段落用于锚点/程序滚动时，避免被固定 Header 遮挡。 */
.site-home .eyidx_News,
.site-home .eyidx_about,
.site-home .eyidx_Case,
.site-home .home-news-section {
  scroll-margin-top: 96px;
}

/* ------------------------------------------------------------
   5. 动画节奏：保留现有 WOW 动画类型，只统一时长与 easing。
   ------------------------------------------------------------ */
.site-home .wow.animated {
  animation-duration: .68s;
  animation-timing-function: var(--p16-ease);
}

/* ------------------------------------------------------------
   6. 平板
   ------------------------------------------------------------ */
@media screen and (max-width: 1199px) {
  .site-home .eyidx_News > .w1400,
  .site-home .eyidx_about > .w1400,
  .site-home .eyidx_Case > .w1400,
  .site-home .home-news-section > .w1400 {
    width: calc(100% - 48px);
  }

  .site-home .apple-banner {
    height: clamp(340px, calc(100vw * 650 / 1920), 500px);
  }

  .site-home .eyidx_News {
    padding-top: 48px;
    padding-bottom: 40px;
  }

  .site-home .eyidx_about {
    padding-top: 18px;
    padding-bottom: 52px;
  }

  .site-home .eyidx_about::before {
    width: calc(100% - 48px);
  }

  .site-home .eyidx_Case {
    padding: 56px 0 58px;
  }

  .site-home .eyidx_Case .h_pros_list {
    height: 380px;
    margin-top: 24px;
  }

  .site-home .home-news-section {
    padding: 54px 0 56px;
  }
}

/* ------------------------------------------------------------
   7. 手机：主要目标是减少纵向空白和“每一段都很大”的感觉。
   ------------------------------------------------------------ */
@media screen and (max-width: 767px) {
  .site-home .eyidx_News > .w1400,
  .site-home .eyidx_about > .w1400,
  .site-home .eyidx_Case > .w1400,
  .site-home .home-news-section > .w1400 {
    width: calc(100% - 32px);
  }

  .site-home .apple-banner {
    height: clamp(205px, 56vw, 280px);
    min-height: 0;
    max-height: 280px;
    margin-top: 0;
  }

  .site-home .apple-banner .swiper-button-next span,
  .site-home .apple-banner .swiper-button-prev span {
    width: 42px;
    height: 42px;
    margin-top: -21px;
    background-size: 42px 42px;
    opacity: .58;
  }

  .site-home .apple-banner .swiper-button-prev span {
    left: 8px;
  }

  .site-home .apple-banner .swiper-button-next span {
    right: 8px;
  }

  .site-home .apple-banner .swiper-pagination {
    bottom: 8px;
    min-width: 82px;
    height: 28px;
    padding: 0 9px;
  }

  .site-home .apple-banner .swiper-pagination-bullet {
    width: 9px;
    height: 9px;
    margin: 0 4px;
  }

  .site-home .eyidx_News {
    padding-top: 30px;
    padding-bottom: 28px;
  }

  .site-home .eyidx_News .eytitle {
    display: block;
  }

  .site-home .eyidx_News .eyidxnews_tit {
    width: 100%;
    margin: 20px 0 0;
  }

  .site-home .eyidx_News .eyidxnews_list {
    margin-top: 18px;
  }

  .site-home .eyidx_about {
    padding-top: 12px;
    padding-bottom: 36px;
  }

  .site-home .eyidx_about::before {
    width: calc(100% - 32px);
  }

  .site-home .eyidx_about .eyidxabout_data {
    padding-top: 16px;
  }

  .site-home .eyidx_Case {
    padding: 40px 0 42px;
  }

  .site-home .eyidx_Case .h_pros_list {
    height: auto;
    margin-top: 20px;
  }

  .site-home .eyidx_Case .h_pros_list ul li {
    height: 270px;
    margin-bottom: 14px;
  }

  .site-home .home-news-section {
    padding: 38px 0 42px;
  }

  .site-home .home-news-section .home-news-grid {
    margin-top: 18px;
  }

  .site-home .home-news-section .home-news-footer {
    margin-top: 16px;
  }

  .site-home .eyidx_News,
  .site-home .eyidx_about,
  .site-home .eyidx_Case,
  .site-home .home-news-section {
    scroll-margin-top: 78px;
  }
}

@media screen and (max-width: 374px) {
  .site-home .eyidx_News > .w1400,
  .site-home .eyidx_about > .w1400,
  .site-home .eyidx_Case > .w1400,
  .site-home .home-news-section > .w1400 {
    width: calc(100% - 28px);
  }

  .site-home .apple-banner {
    height: 205px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-home .wow.animated,
  .site-home .apple-banner .swiper-button-next span,
  .site-home .apple-banner .swiper-button-prev span {
    animation-duration: .01ms;
    transition: none;
  }
}