/* ============================================================
   base.css — 重置 / 排版 / 容器 / 通用动画
   ============================================================ */
*,
*::before,
*::after { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

body {
  font-family: var(--font);
  color: var(--text);
  background: var(--bg);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;            /* 整屏滚动由 Swiper 接管 */
}

img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul, dl, dd { margin: 0; padding: 0; list-style: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
h1, h2, h3, h4, p { margin: 0; }

/* 容器 */
.container {
  width: 100%;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

/* 通用按钮 */
.btn-enter {
  display: inline-block;
  padding: 16px 54px;
  background: var(--brand);
  color: #fff;
  font-size: 18px;
  letter-spacing: 2px;
  border-radius: 40px;
  transition: background .3s var(--ease), transform .3s var(--ease);
}
.btn-enter:hover { background: var(--brand-deep); transform: translateY(-2px); }

.btn-line {
  display: inline-block;
  padding: 12px 38px;
  border: 1px solid currentColor;
  border-radius: 40px;
  font-size: 15px;
  letter-spacing: 1px;
  transition: all .3s var(--ease);
}
.btn-line:hover {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
}

/* Swiper 基础 */
.home-swiper { width: 100%; height: 100vh; }
.home-swiper .swiper-slide { overflow: hidden; }

/* 通用区块标题 */
.section-head { text-align: center; margin-bottom: 56px; }
.section-head h2 {
  font-size: 40px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text);
}
.section-head p {
  margin-top: 14px;
  font-size: 16px;
  color: var(--text-3);
  letter-spacing: 1px;
}

/* ---------- 入场动画（CSS 等价 swiperAnimate） ---------- */
/* 默认隐藏，激活屏才播放 */
.ani { opacity: 0; }
.ani[data-ani="slideInUp"]  { transform: translateY(40px); }
.ani[data-ani="slideInLeft"]{ transform: translateX(-40px); }
.ani[data-ani="slideInRight"]{ transform: translateX(40px); }
.ani[data-ani="fade"]       { transform: none; }

.swiper-slide-active .ani {
  opacity: 1;
  transform: none;
  transition: opacity .8s var(--ease), transform .8s var(--ease);
}
/* 错峰延迟 */
.swiper-slide-active .ani:nth-child(1) { transition-delay: .10s; }
.swiper-slide-active .ani:nth-child(2) { transition-delay: .22s; }
.swiper-slide-active .ani:nth-child(3) { transition-delay: .34s; }
.swiper-slide-active .ani:nth-child(4) { transition-delay: .46s; }
.swiper-slide-active .ani:nth-child(5) { transition-delay: .58s; }

@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes spin { to { transform: rotate(360deg); } }

/* 小屏容器收窄 */
@media (max-width: 1260px) {
  :root { --gutter: 24px; }
  .container { max-width: 100%; }
}
@media (max-width: 767px) {
  :root { --gutter: 16px; --header-h: 60px; }
  body { font-size: 14px; }
  .section-head h2 { font-size: 26px; }
  .section-head { margin-bottom: 30px; }
}
