:root{
  --blue:#0052CC;
  --teal:#00C7BE;
  --grey:#F4F5F7;
  --dark:#091E42;
  --radius:12px;
  --max:1100px;
}
*{box-sizing:border-box;margin:0;padding:0;font-family:'Inter',sans-serif;color:var(--dark);}
body{background:#fff;line-height:1.6;}
h1,h2,h3{font-weight:700;}
h1{font-size:2.5rem;}
h2{font-size:2rem;margin-bottom:1.5rem;text-align:center;}
img{max-width:100%;display:block;border-radius:var(--radius);}
section{padding:4rem 1.5rem;}
a.cta{display:inline-block;background:var(--blue);color:#fff;padding:.9rem 1.8rem;border-radius:var(--radius);text-decoration:none;font-weight:600;margin-top:1rem;transition:.25s;}
a.cta:hover{background:var(--teal);}
.hero{display:flex;flex-wrap:wrap;align-items:center;gap:2rem;max-width:var(--max);margin:auto;}
.hero-left{flex:1 1 400px;}
.hero-right{flex:1 1 400px;}
.trust{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:1rem;background:var(--grey);}
.trust img{height:40px;filter:grayscale(100%);opacity:.7;}
.how .steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:2rem;max-width:var(--max);margin:auto;text-align:center;}
.how article{background:var(--grey);padding:2rem;border-radius:var(--radius);}
.demo{text-align:center;}
.player{position:relative;max-width:800px;margin:auto;}
.play-btn{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#fff;border:none;font-size:2.5rem;width:70px;height:70px;border-radius:50%;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.2);}
.features .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:2rem;max-width:var(--max);margin:auto;}
.bottom-cta{text-align:center;background:var(--grey);}
footer{text-align:center;padding:2rem 1rem;font-size:.85rem;background:#fafafa;}
/* scroll animation */
.fade-up{opacity:0;transform:translateY(30px);transition:.6s;}
.fade-up.visible{opacity:1;transform:translateY(0);}

/* ===== 移动优先补丁 ===== */
@media (max-width: 768px) {
  h1 { font-size: 1.8rem; }
  h2 { font-size: 1.5rem; }
  h3 { font-size: 1.2rem; }
  .hero {flex-direction: column;text-align: center;}
  .hero-left {padding: 0 1rem;}
  .cta {display: block;width: 100%;box-sizing: border-box;}
  .how .steps {grid-template-columns: 1fr;}
  .features .grid {grid-template-columns: 1fr;}
  .trust {flex-wrap: wrap;gap: 0.5rem 1.5rem;}
  .trust img {height: 28px;}
  .player img {width: 100%;height: auto;}
  .play-btn {width: 60px;height: 60px;font-size: 2rem;}
  #lang-switch {top: 0.5rem;left: 0.5rem;font-size: 0.8rem;padding: 0.3rem 0.6rem;}
}
@media (max-width: 360px) {
  h1 { font-size: 1.5rem; }
  .cta { font-size: 1rem; }
}

/* ===== 故事墙 · 横向跑马灯 ===== */
.story-wall{
  overflow:hidden;                      /* 隐藏超出部分 */
  padding:4rem 1.5rem;
  background:var(--grey);
}
.story-wall h2{text-align:center;margin-bottom:2rem;}
.story-track{position:relative;}
.story-slides{
  display:flex;                         /* 横向排列 */
  gap:1.5rem;
  width:max-content;                    /* 内容多宽轨道就多宽 */
  animation:scroll 25s linear infinite; /* 25 秒一圈，可改快慢 */
}
.story-card{
  flex:0 0 280px;                       /* 固定卡片宽度，文字再长也不变形 */
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:var(--radius);
  padding:1.5rem;
  display:flex;                         /* 图标 + 文字垂直居中 */
  flex-direction:column;
  align-items:center;
  text-align:center;
  box-shadow:0 2px 8px rgba(0,0,0,.05);
}
.story-card img{
  width:60px;
  height:60px;
  object-fit:contain;
  flex-shrink:0;                        /* 图片不被挤压 */
  margin-bottom:1rem;
}
.story-card h3{font-size:1.1rem;color:var(--blue);margin:0 0 .5rem;}
.story-card p{
  font-size:.95rem;
  color:var(--dark);
  margin:0;
  word-break:break-word;               /* 长单词/数字自动换行 */
  line-height:1.5;
}

/* 悬停即停 */
.story-wall:hover .story-slides{animation-play-state:paused;}

/* 无缝循环：两套卡片 */
@keyframes scroll{
  0%{transform:translateX(0);}
  100%{transform:translateX(-50%);}
}

/* 移动端：停止动画 + 单列卡片 */
@media (max-width:768px){
  .story-slides{flex-direction:column;animation:none;width:auto;}
  .story-card{flex:0 0 auto;width:100%;}
}

/* ===== 故事墙 · 横向跑马灯 ===== */
.story-wall{
  overflow:hidden;              /* 隐藏超出部分 */
  padding:4rem 1.5rem;
  background:var(--grey);
}
.story-wall h2{text-align:center;margin-bottom:2rem;}
.story-track{position:relative;}
.story-slides{
  display:flex;                 /* 横向排列 */
  gap:1.5rem;
  width:max-content;            /* 内容多宽轨道就多宽 */
  animation:scroll 25s linear infinite;
}
.story-card{
  flex:0 0 280px;               /* 固定卡片宽度，文字再长也不变形 */
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:var(--radius);
  padding:1.5rem;
  display:flex;                 /* 图标 + 文字垂直居中 */
  flex-direction:column;
  align-items:center;
  text-align:center;
  box-shadow:0 2px 8px rgba(0,0,0,.05);
}
.story-card img{
  width:60px;
  height:60px;
  object-fit:contain;
  flex-shrink:0;
  margin-bottom:1rem;
}
.story-card h3{font-size:1.1rem;color:var(--blue);margin:0 0 .5rem;}
.story-card p{
  font-size:.95rem;
  color:var(--dark);
  margin:0;
  word-break:break-word;   /* 长单词/数字自动换行 */
  line-height:1.5;
}
.story-wall:hover .story-slides{animation-play-state:paused;} /* 悬停即停 */

/* 无缝循环：两套卡片 */
@keyframes scroll{
  0%{transform:translateX(0);}
  100%{transform:translateX(-50%);}
}

/* 移动端：停止动画 + 单列卡片 */
@media (max-width:768px){
  .story-slides{flex-direction:column;animation:none;width:auto;}
  .story-card{flex:0 0 auto;width:100%;}
}