/* =====================================================
   KUAILIAN / SLETSVPN 主题（蓝紫系 + 渐变）
   - 统一变量
   - 固定磨砂导航（蓝紫渐变）
   - 首屏 Hero
   - 左对齐渐变下载徽章（两枚）
   - 内容段 / 卡片 / 走马灯 / 页脚
   - 旧版 Home 模块兼容
===================================================== */

/* ============== 基础变量 & Reset ============== */
:root{
  /* 尺寸 */
  --wrap: 1100px;

  /* 品牌与文本 */
  --brand: #3a66ff;
  --brand-2: #7a57ff;
  --txt-main:#111;
  --txt-muted:#6b7a90;

  /* 渐变与阴影（可按需微调） */
  --grad-start:#3a66ff;            /* 蓝 */
  --grad-mid:#7a57ff;              /* 紫 */
  --grad-end:#ff4fb2;              /* 粉 */
  --grad-bg-start:#eef3ff;         /* 背景浅蓝 */
  --grad-bg-mid:#f2ecff;           /* 背景浅紫 */
  --grad-bg-end:#ffeaf7;           /* 背景粉紫 */
  --grad-shadow: rgba(58, 102, 255, .28);

  /* 边框/磨砂 */
  --border-light: rgba(0,0,0,.08);
  --hdr-border: rgba(21,44,91,.08);
  --hdr-glass: rgba(255,255,255,.66);
  --hdr-grad-start: rgba(122,87,255,.22);
  --hdr-grad-end: rgba(58,102,255,.22);

  /* 组件用色（兼容老代码） */
  --wa-green: #3a66ff;
  --wa-dark: #111;
  --wa-gray: #555;
}

*{ box-sizing:border-box; }
html, body{
  margin:0;
  padding:0;
  font:16px/1.7 system-ui, Segoe UI, Arial;
  color:var(--txt-main);
  overflow-x:hidden;
}

/* 背景：整页顶部渐变（不是框在 hero 里） */
body{
  position:relative;
  background: linear-gradient(180deg, #eef3ff 0%, #f6f8ff 380px, #ffffff 820px, #ffffff 100%);
}

body::before{
  content:"";
  position:absolute;
  left:0; top:0; right:0;
  height:760px;
  pointer-events:none;
  background:
    radial-gradient(circle at 84% 22%, rgba(255,255,255,.22) 0%, rgba(255,255,255,0) 55%),
    radial-gradient(circle at 92% 60%, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 60%),
    radial-gradient(circle at 10% 10%, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 62%),
    linear-gradient(115deg, var(--grad-start) 0%, var(--grad-mid) 52%, var(--grad-end) 100%);
  z-index:-1;
}

/* 链接 */
a{ color: var(--brand); text-decoration:none; transition: transform 0.3s ease, color 0.3s ease; /* 动画过渡效果 */ }
a:hover{ text-decoration: none; transform: translateY(-6px); /* 鼠标悬停时上移3px */}

/* 包裹容器 */
.wrap, .container{
  position:relative; max-width:var(--wrap); margin:0 auto; padding:0 16px;
}

/* ============== 导航栏：顶部透明，下拉后显示渐变背景 ============== */
.site-header{
  position:fixed; top:0; left:0; width:100%;
  background: transparent;                 /* 顶部默认透明 */
  border-bottom:1px solid transparent;
  box-shadow:none;
  z-index:999;

  /* 过渡更自然 */
  transition: background .25s ease, box-shadow .25s ease, border-color .25s ease;
}

/* 下拉后：加渐变背景（跟你页面主渐变同款） */
.site-header.is-scrolled{
  background: linear-gradient(115deg, var(--grad-start) 0%, var(--grad-mid) 52%, var(--grad-end) 100%);
  border-bottom:1px solid rgba(255,255,255,.16);
  box-shadow: 0 10px 30px rgba(12, 18, 42, .14);
}

.site-header .wrap{
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; height:64px;
}

/* Logo/文字白色 */
.logo{
  font-weight:800;
  color:rgba(255,255,255,.96);
  display:flex; align-items:center; gap:8px;
}
.logo img{ height:32px; }

.nav{ display:flex; gap:20px; }

/* 导航文字白色（顶部透明时也能在渐变背景上看清） */
.nav a{
  position:relative;
  margin-left:14px;
  font-weight:700;
  color:rgba(255,255,255,.92);
  letter-spacing:.2px;
  text-decoration:none;
  opacity:.95;
  transition: opacity .15s ease, transform .15s ease;
}
.nav a:hover{ opacity:1; transform: translateY(-1px); }

/* 下划线高亮 */
.nav a::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-6px;
  height:2px;
  background: linear-gradient(90deg, rgba(255,255,255,.95), rgba(255,255,255,.45));
  transform: scaleX(0);
  transform-origin:left;
  transition: transform .2s ease;
  border-radius:2px;
}
.nav a:hover::after,
.nav a.is-active::after{ transform: scaleX(1); }

.twitter-link{ margin-left:15px; display:flex; align-items:center; }
.twitter-link img{
  width:24px; height:24px; display:block;
  filter: brightness(0) invert(1);
  opacity:.92;
}
.twitter-link:hover img{ opacity:1; }


/* 页面主体与页脚 */
.site-main{
  position:relative;
  z-index:1;
  padding:88px 50px 24px;
}
.site-footer{
  border-top:1px solid var(--border-light); background:#fff; margin-top:32px;
}
.site-footer .wrap{ padding:18px 0; color:#666; }


.wa-hero{
  position:relative;
  isolation:isolate;           
  overflow:visible;

  display:flex; align-items:center; justify-content:space-between;
  gap:40px; max-width:1200px; margin:28px auto 30px; padding:74px 20px 120px;
  background:transparent;
  border-radius:0;
  box-shadow:none;
}

.wa-hero::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-300px;
  width:240vw;
  height:100px;
  transform:translateX(-50%);
  background:#fff;            
  border-radius:50%;
  pointer-events:none;
  z-index:-1;               
}


.wa-hero__content{ flex:1; position:relative; z-index:1; }
.wa-hero h1{
  font-size:40px;
  line-height:1.22;
  color:#fff;
  margin:0 0 16px;
  font-weight:900;
  letter-spacing:.2px;
}
.wa-hero h1 strong{
  color:#fff;
  background:none;
  -webkit-background-clip:initial;
  background-clip:initial;
}
.wa-badge{
  display:inline-block; font-size:14px; color:#fff;
  padding:4px 12px; border-radius:20px; margin-bottom:10px;
  background:linear-gradient(90deg, var(--grad-start), var(--grad-end));
  box-shadow:0 6px 16px var(--grad-shadow);
}
.wa-hero p{
  font-size:18px;
  color:rgba(255,255,255,.88);
  margin-bottom:22px;
  line-height:1.68;
}
.wa-hero p.hero-cert{
  margin:0 0 24px;
  font-size:17px;
  color:rgba(255,255,255,.92);
  line-height:1.35;
  font-weight:700;
}

.hero-metrics{
  display:flex;
  gap:16px;
  margin:0 0 24px;
  flex-wrap:wrap;
}
.hero-metric{
  width:132px;
  height:132px;
  border-radius:50%;
  border:3px solid rgba(255,255,255,.72);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:#fff;
  background:rgba(255,255,255,.04);
}
.hero-metric strong{
  font-size:32px;
  font-weight:900;
  line-height:1;
}
.hero-metric span{
  margin-top:6px;
  font-size:17px;
  line-height:1;
  color:rgba(255,255,255,.92);
}

/* 右侧图 */
.wa-hero__image{ flex:1; text-align:right; position:relative; z-index:1; }
.wa-hero__image img{
  width:520px;
  margin-top:-6px;
  filter: drop-shadow(0 18px 44px rgba(12, 18, 42, .18));
}

/* ============== 左对齐下载徽章（两枚） ============== */
.wa-hero__actions{ display:flex; gap:14px; flex-wrap:wrap; }
.wa-hero__actions.dl-left{ justify-content:flex-start; align-items:center; }
/* 电脑端：两枚下载按钮同一行；手机端在下方媒体查询里改为纵向 */
.wa-hero__actions.hero-cta{
  gap:16px;
  flex-direction:row;
  flex-wrap:nowrap;
  align-items:center;
}

/* 徽章骨架 */
.dl-badge{
  width:auto; max-width:none; height:64px; min-height:64px;
  display:inline-flex; align-items:center; gap:12px;
  padding:0 30px 0 22px; border-radius:999px; text-decoration:none; box-sizing:border-box;
  white-space:nowrap; line-height:1.1;
  transition: transform .15s ease, box-shadow .2s ease, filter .2s ease, background .25s ease;
  will-change: transform, filter;
  position:relative;
}

/* 白色胶囊按钮（符合截图） */
.dl-badge--grad{
  background: #fff;
  border: 1px solid rgba(255,255,255,.78);
  box-shadow: 0 10px 28px rgba(12, 18, 42, .16);
}
.dl-badge--grad:hover{
  transform: translateY(-1px);
  filter: brightness(1.02);
  box-shadow: 0 16px 42px rgba(12, 18, 42, .18);
}
.dl-badge--grad:active{ transform: translateY(0); filter: brightness(.99); }
.dl-badge--grad:focus-visible{ outline:2px solid rgba(255,255,255,.9); outline-offset:2px; }

/* 图标与文字 */
.dl-ic{ width:30px; height:30px; flex:0 0 30px; display:block; }
.dl-text{ display:flex; flex-direction:column; }
.dl-text em{ font-style:normal; font-size:12px; color:rgba(58, 102, 255, .78); letter-spacing:.02em; }
.dl-text b{
  font-size:26px;
  font-weight:800;
  color:#3a4cff;
  line-height:1;
  letter-spacing:.4px;
}

.dl-corner{
  position:absolute;
  left:14px;
  top:-10px;
  display:inline-flex;
  align-items:center;
  height:18px;
  padding:0 8px;
  border-radius:999px;
  background:linear-gradient(90deg,#f8a129,#ffcf63);
  color:#fff;
  font-size:11px;
  font-weight:700;
  line-height:1;
  box-shadow:0 4px 12px rgba(248,161,41,.35);
}

/* Hero 目录（可选） */
.wa-toc{ display:flex; gap:14px; margin-top:14px; flex-wrap:wrap; }
.wa-toc a{
  font-size:14px;
  color:rgba(255,255,255,.92);
  font-weight:700;
  text-decoration:none;
  opacity:.92;
}
.wa-toc a:hover{ text-decoration:underline; opacity:1; }

/* Hero 响应式 */
@media (max-width: 768px){
  .wa-hero{ flex-direction:column; text-align:left; padding:56px 18px 120px; }
  .wa-hero h1{ font-size:34px; }
  .wa-hero p.hero-cert{ font-size:15px; }
  .hero-metrics{ gap:10px; margin-bottom:18px; }
  .hero-metric{
    width:100px;
    height:100px;
  }
  .hero-metric strong{ font-size:30px; }
  .hero-metric span{ font-size:14px; }
  .wa-hero__actions.hero-cta{
    flex-direction:column;
    align-items:stretch;
    width:min(100%, 360px);
    gap:12px;
  }
  .dl-badge{
    width:100%;
    justify-content:flex-start;
    height:58px;
    min-height:58px;
    padding:0 18px;
  }
  .dl-ic{ width:24px; height:24px; flex-basis:24px; }
  .dl-text b{ font-size:28px; }
  .dl-corner{
    left:10px;
    top:-9px;
    font-size:10px;
    height:16px;
    padding:0 7px;
  }
  .wa-toc{ gap:10px; margin-top:12px; }
  .wa-toc a{ font-size:13px; }
  .wa-hero__image{ text-align:center; }
  .wa-hero__image img{ width:260px; margin-top:18px; }
  .wa-hero__actions{ justify-content:flex-start; }
}

/* ============== 通用内容段（wa-section） ============== */
.wa-section{
  max-width:1200px; margin:80px auto; padding:0 20px;
  display:flex; align-items:center; gap:40px;
}
.wa-section.reverse{ flex-direction: row-reverse; }
.wa-text{ flex:1; }
.wa-text h2{
  font-size:32px; margin:0 0 16px; color:#0f1b36;
  background: linear-gradient(90deg, #0f1b36 0%, #213a8b 80%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.wa-text p{ font-size:18px; line-height:1.65; color:#3b4661; margin:0; }
.wa-text ul{ margin:16px 0; padding-left:20px; }
.wa-text ul li{ margin-bottom:10px; font-size:17px; line-height:1.6; color:#162146; }
.wa-text strong{ color: var(--wa-green); }
.wa-img{ flex:1; text-align:center; }
.wa-img img{ max-width:100%; height:auto; border-radius:12px; box-shadow:0 12px 30px rgba(45,72,200,.12); }

@media (max-width: 768px){
  .wa-section{ flex-direction:column; text-align:center; }
  .wa-section.reverse{ flex-direction:column; }
  .wa-img img{ max-width:80%; }
}

/* ============== VPN 首屏说明段 ============== */
.vpn-section{
  position:relative;
  z-index:2;
  padding:60px 20px;
  text-align:center;
}
.vpn-section .text-box{ max-width:800px; margin:0 auto; }
.vpn-section .title{
  font-size:28px; font-weight:800; margin-bottom:18px; line-height:1.3;
  color:#1f2d57; /* fallback color for browsers without text-clip */
  background:linear-gradient(90deg, var(--grad-start), var(--grad-mid), var(--grad-end));
}
@supports ((-webkit-background-clip: text) or (background-clip: text)){
  .vpn-section .title{
    color:transparent;
    -webkit-background-clip:text;
    background-clip:text;
  }
}
.vpn-section .desc{
  font-size:16.5px; color:#48547a; line-height:1.85; margin:0; white-space:pre-line;
}

/* 补充：你首页用到了这几个类 */
.wa-feature-list{
  margin:22px auto 0;
  padding:0;
  list-style:none;
  counter-reset: feature-item;
  max-width:900px;
  text-align:left;
  color:#1d2b52;
}
.wa-feature-list li{
  counter-increment: feature-item;
  position:relative;
  margin:10px 0;
  padding:14px 16px 14px 60px;
  line-height:1.72;
  font-size:16px;
  border-radius:14px;
  background:rgba(255,255,255,.86);
  border:1px solid rgba(58,102,255,.14);
  box-shadow:0 6px 18px rgba(21, 46, 128, .06);
}
.wa-feature-list li::before{
  content: counter(feature-item);
  position:absolute;
  left:16px;
  top:50%;
  transform:translateY(-50%);
  width:30px;
  height:30px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  font-weight:800;
  color:#fff;
  background:linear-gradient(135deg, #3a66ff 0%, #7a57ff 100%);
  box-shadow:0 6px 14px rgba(58,102,255,.35);
}

@media (max-width: 768px){
  .wa-feature-list li{
    padding:12px 12px 12px 50px;
    font-size:15px;
    border-radius:12px;
  }
  .wa-feature-list li::before{
    left:12px;
    width:26px;
    height:26px;
    font-size:13px;
  }
}

.wa-steps{
  margin:14px 0 0;
  padding-left:18px;
  color:#1d2b52;
}
.wa-steps li{ margin:10px 0; line-height:1.7; }
.tip{ margin-top:10px; color:#64748b; font-size:14px; }

/* ============== 统计卡片 ============== */
.stats-section{ max-width:1200px; margin:80px auto; text-align:center; padding:0 20px; }
.stats-title{
  font-size:28px; font-weight:800; margin-bottom:48px; line-height:1.4;
  color:transparent;
  background:linear-gradient(90deg, var(--grad-start), var(--grad-mid), var(--grad-end));
  -webkit-background-clip:text; background-clip:text;
}
.stats-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:24px; }
.stat-card{
  background:#ffffffcc; border-radius:16px; padding:32px 20px;
  box-shadow:0 2px 8px rgba(0,0,0,0.05), 0 10px 26px rgba(45,72,200,.06);
  transition: transform .2s ease, box-shadow .2s ease;
  border:1px solid rgba(70, 90, 220, .08);
}
.stat-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.08), 0 16px 38px rgba(45,72,200,.10);
}
.stat-number{ font-size:30px; font-weight:900; color:#213a8b; margin-bottom:10px; }
.stat-label{ font-size:16px; color:#42517a; }

/* ============== Why / Features 三列卡片 ============== */
.why-telegram{ max-width:1100px; margin:36px auto 24px; padding:0 16px; }
.why-title{ margin:0 0 18px; text-align:center; font-size:22px; line-height:1.4; color:#1f3147; }
.why-title span{ color:#3a66ff; }

.features-grid{
  display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:28px 36px;
}
.feature-card{ text-align:center; padding:10px 12px; background:#ffffffcc; border-radius:16px; }
.feature-card img{
  width:140px; height:auto; display:block; margin:0 auto 10px;
  image-rendering:-webkit-optimize-contrast;
  will-change: transform, filter;
  transition: transform .2s ease, filter .2s ease;
}
.feature-card:hover img{ transform: translateY(-4px); filter: drop-shadow(0 8px 18px rgba(58,102,255,.22)); }
.feature-card h3{ margin:6px 0 6px; font-size:16px; font-weight:700; color:#182446; }
.feature-card p{ margin:0; font-size:13.5px; line-height:1.6; color:#58648a; }

/* 响应式：平板两列，手机一列 */
@media (max-width: 960px){
  .features-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); gap:22px 24px; }
}
@media (max-width: 560px){
  .features-grid{ grid-template-columns:1fr; gap:18px; }
  .feature-card img{ width:128px; }
}

/* ============== 旧版“Home”模块（兼容） ============== */
.home-hero{ display:block; margin-top:10px; }
.home-hero__left{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  max-width:500px; margin:0 auto;
}
.home-logo{ width:110px; height:110px; display:block; margin:6px auto 10px; }
.home-title h1{ margin:0; font-size:36px; font-weight:700; color:#192448; }
.home-subtitle{ margin:6px 0 16px; font-size:16px; color:#6a77a0; }

/* 设备展示（去背景/阴影/边框） */
.device-mac, .device-phones .phone{
  background:none !important; background-color:transparent !important;
  box-shadow:none !important; border:none !important; text-align:center; padding:6px 0 18px;
}
.device-mac img{
  display:block; width:100%; max-width:400px; height:auto; margin:6px auto 8px;
  background:none !important; box-shadow:none !important; border:none !important;
}
.desktop-link{
  display:flex; justify-content:center; align-items:center; gap:8px;
  margin:6px 0 18px; color:#3a66ff; font-size:14px;
}
.desktop-link .icon{ width:16px; height:16px; }

/* 双手机并排 */
.device-phones{
  display:grid; grid-template-columns: repeat(2, minmax(220px, 380px));
  gap:64px; justify-content:center; align-items:start; margin:24px 0 6px;
}
.device-phones .phone img{
  height:300px; width:auto; display:block; margin:0 auto;
  background:none !important; box-shadow:none !important; border:none !important;
}
.device-phones .phone figcaption{
  display:flex; justify-content:center; align-items:center; gap:8px;
  margin-top:8px; font-size:14px; color:#3a66ff;
}
.device-phones .phone figcaption .icon{ width:16px; height:16px; }

/* 装饰线 */
.icon{ width:26px; height:26px; }
.accent{
  height:4px; width:68%; margin:14px auto 0; border-radius:3px;
  background:linear-gradient(90deg, var(--grad-start), var(--grad-end));
  opacity:.9; transition: width .25s ease, opacity .2s ease;
}
.device-mac:hover .accent, .phone:hover .accent{ width:86%; opacity:1; }

/* 旧版响应式 */
@media (max-width: 960px){
  .home-aside-floating{ position: static; width:auto; margin:0 0 16px 0; }
  .home-hero__left{ max-width:92vw; }
  .device-phones{ grid-template-columns:1fr; gap:22px; }
  .device-phones .phone img{ height:280px; }
  .home-title h1{ font-size:28px; }
  .home-logo{ width:96px; height:96px; }
}

/* 右侧浮动资讯 */
.home-aside-floating{ position:absolute; top:0; right:0; width:280px; }
.aside-box{ border-left:4px solid #3a66ff; padding-left:12px; }
.aside-title{ font-size:14px; margin:0 0 6px; color:#3a66ff; }
.aside-news{ list-style:none; margin:0; padding:0; }
.aside-news li{ margin:6px 0 10px; }
.aside-news .d{ font-size:11px; color:#7a8797; margin-bottom:2px; }
.aside-news .t{ font-size:12px; color:#1a3d7a; text-decoration:none; line-height:1.4; }
.aside-news .t:hover{ text-decoration:underline; }

/* ============== 走马灯条（wa-strip） ============== */
.wa-strip{
  background:linear-gradient(180deg, #ffffff, #F4F7FF);
  border:1px solid rgba(70,90,220,.08);
  border-radius:28px; padding:28px 18px 38px; margin:32px auto; max-width:1280px;
  box-shadow:0 12px 26px rgba(45,72,200,.08);
}
.wa-strip__head{
  display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin:0 6px 14px;
}
.wa-strip__title{
  font-size:clamp(24px,4.5vw,40px); line-height:1.15; margin:0;
  color:transparent; background:linear-gradient(90deg, var(--grad-start), var(--grad-mid), var(--grad-end));
  -webkit-background-clip:text; background-clip:text;
}
.wa-strip__desc{ margin:0; color:#334155; font-size:14.5px; max-width:720px; }

.wa-strip__viewport{
  position:relative; display:flex; align-items:center; gap:8px; padding:8px 40px;
}
.wa-strip__viewport::before,
.wa-strip__viewport::after{
  content:""; position:absolute; top:0; bottom:0; width:60px; pointer-events:none; transition:opacity .2s ease;
}
.wa-strip__viewport::before{
  left:0; background:linear-gradient(90deg,#fff 45%, rgba(233,251,227,0)); opacity:0;
}
.wa-strip__viewport::after{
  right:0; background:linear-gradient(-90deg,#fff 45%, rgba(233,251,227,0)); opacity:0;
}
.wa-strip__viewport.is-left::before{ opacity:1; }
.wa-strip__viewport.is-right::after{ opacity:1; }

.wa-carousel{
  display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch; padding:6px 2px; --visible:4;
}
.wa-carousel::-webkit-scrollbar{ height:8px; }
.wa-carousel::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, var(--grad-start), var(--grad-end));
  border-radius:999px;
}
@media (max-width:1100px){ .wa-carousel{ --visible:3; } }
@media (max-width:820px){  .wa-carousel{ --visible:2; } }
@media (max-width:520px){  .wa-carousel{ --visible:1; } }

.wa-item{
  flex:0 0 calc((100% - (var(--visible) - 1) * 16px) / var(--visible));
  min-width:240px; background:#fff;
  border:1px solid rgba(70,90,220,.10);
  border-radius:20px; padding:18px 16px;
  box-shadow:0 8px 20px rgba(24,155,235,.08);
  scroll-snap-align:start;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.wa-item:hover{
  transform: translateY(-2px);
  box-shadow:0 12px 28px rgba(16,24,40,.12);
  border-color: rgba(36,48,211,.45);
}
.wa-item__title{ font-size:16.5px; margin:0 0 8px; color:#14234a; }
.wa-item__text{ font-size:14.5px; line-height:1.72; color:#334155; margin:0; }

.wa-arrow{
  position:absolute; z-index:2; top:50%; transform:translateY(-50%);
  width:44px; height:44px; border-radius:50%;
  border:1px solid rgba(38,35,201,.16); background:#fff; color:#3a66ff; font-size:24px; line-height:1;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.wa-arrow:hover{
  transform:translateY(calc(-50% - 1px));
  border-color:#3a66ff; box-shadow:0 8px 18px rgba(58,102,255,.22);
}
.wa-arrow--prev{ left:4px; }
.wa-arrow--next{ right:4px; }

/* ============== 浅色四列页脚（lite） ============== */
.wa-lite-footer{ background:transparent; color:#0b1320; }
.wa-lite__inner{
  max-width:1280px; margin:0 auto; padding:48px 20px 56px;
  display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:48px 40px;
}
.wa-lite__logo{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.wa-lite__logo-img{ height:24px; width:auto; display:block; }
.wa-lite__logo-text{ font-size:28px; font-weight:700; letter-spacing:.2px; }
.wa-lite__headline{ font-size:28px; font-weight:800; margin:8px 0 6px; }
.wa-lite__sub{ margin:0; font-size:16px; color:#6b7280; }

.wa-lite__title{ margin:0 0 16px; font-size:22px; font-weight:800; }
.wa-lite__list{ list-style:none; margin:0; padding:0; }
.wa-lite__link{
  display:block; padding:10px 0; font-size:18px; color:#0b1320; text-decoration:none;
  transition: color .15s ease, opacity .15s ease;
}
.wa-lite__link:hover{ color:var(--brand); opacity:.9; }

/* 页脚响应式 */
@media (max-width: 920px){
  .wa-lite__inner{ grid-template-columns: 1fr 1fr; }
  .wa-lite__headline{ font-size:24px; }
}
@media (max-width: 520px){
  .wa-lite__inner{ grid-template-columns: 1fr; gap:28px; }
}

/* ============== 其它小模块 ============== */
h1{ margin:0 0 16px; }

.whatsapp-section{ text-align:center; margin:60px auto; max-width:900px; }
.whatsapp-section .title{ font-size:32px; font-weight:700; margin-bottom:16px; color:#182446; }
.whatsapp-section .desc{ font-size:18px; color:#3b4661; line-height:1.8; }

/* ============== 响应式补充（栅格/特性） ============== */
@media (max-width: 1024px){
  .stats-grid{ grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 640px){
  .stats-grid{ grid-template-columns: 1fr; }
}