/* roulang page: index */
/* ===== 设计变量 ===== */
:root{
  --bg:#f6f3ec;
  --bg-alt:#ffffff;
  --ink:#23312d;
  --muted:#6d7a76;
  --brand:#0e6b5c;
  --brand-deep:#0a4f44;
  --brand-soft:#e5f2ed;
  --accent:#e8924e;
  --accent-deep:#c97026;
  --card:#ffffff;
  --border:#e4ded2;
  --radius:18px;
  --radius-sm:12px;
  --shadow:0 14px 40px rgba(16,51,44,.10);
  --shadow-sm:0 6px 20px rgba(16,51,44,.06);
  --transition:.25s ease;
}

/* ===== 基础 Reset ===== */
*,*::before,*::after{
  box-sizing:border-box;
}
html{
  scroll-behavior:smooth;
}
body{
  font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC","Helvetica Neue",Arial,sans-serif;
  background:var(--bg);
  color:var(--ink);
  line-height:1.7;
  margin:0;
  padding:0;
  -webkit-font-smoothing:antialiased;
}
img{
  max-width:100%;
  display:block;
}
a{
  color:var(--brand);
  text-decoration:none;
  transition:color var(--transition);
}
a:hover{
  color:var(--accent-deep);
}
ul{
  margin:0;
  padding:0;
  list-style:none;
}
button,input,select,textarea{
  font-family:inherit;
  font-size:inherit;
  color:inherit;
}
:focus-visible{
  outline:3px solid rgba(232,146,78,.6);
  outline-offset:3px;
  border-radius:4px;
}

/* ===== 通用容器与间距 ===== */
.grid-container{
  max-width:1200px;
  padding-left:20px;
  padding-right:20px;
}
.grid-margin-x{
  margin-left:-12px;
  margin-right:-12px;
}
.grid-margin-x > .cell{
  padding-left:12px;
  padding-right:12px;
  margin-bottom:24px;
}
.section{
  padding:90px 0;
}
.section-tight{
  padding:56px 0;
}
.section-head{
  max-width:780px;
  margin:0 auto 50px;
  text-align:center;
}
.section-head .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--accent-deep);
  font-weight:700;
  font-size:.85rem;
  letter-spacing:.05em;
  margin-bottom:12px;
}
.section-head .eyebrow i{
  font-size:1rem;
}
.section-head h2{
  font-size:2.1rem;
  line-height:1.3;
  margin:0 0 14px;
  font-weight:800;
  color:var(--ink);
}
.section-head p{
  color:var(--muted);
  font-size:1.02rem;
  margin:0;
}
.section-head.align-left{
  text-align:left;
  margin-left:0;
}

/* ===== 按钮 ===== */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 26px;
  border-radius:999px;
  font-weight:700;
  font-size:.98rem;
  line-height:1.2;
  border:2px solid transparent;
  cursor:pointer;
  transition:background var(--transition),color var(--transition),border-color var(--transition),transform var(--transition),box-shadow var(--transition);
}
.btn i{
  font-size:.92rem;
}
.btn-primary{
  background:var(--brand);
  color:#fff;
  box-shadow:0 8px 20px rgba(14,107,92,.22);
}
.btn-primary:hover{
  background:var(--brand-deep);
  color:#fff;
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(14,107,92,.28);
}
.btn-primary:active{
  transform:translateY(0);
  box-shadow:0 4px 12px rgba(14,107,92,.2);
}
.btn-accent{
  background:var(--accent);
  color:#23312d;
  box-shadow:0 8px 20px rgba(232,146,78,.25);
}
.btn-accent:hover{
  background:#d98037;
  color:#23312d;
  transform:translateY(-2px);
}
.btn-ghost{
  background:transparent;
  color:var(--brand);
  border-color:var(--brand);
}
.btn-ghost:hover{
  background:var(--brand);
  color:#fff;
  transform:translateY(-2px);
}
.btn-light{
  background:#fff;
  color:var(--brand);
  box-shadow:0 8px 24px rgba(0,0,0,.12);
}
.btn-light:hover{
  background:var(--brand-soft);
  color:var(--brand-deep);
  transform:translateY(-2px);
}
.btn-sm{
  padding:8px 18px;
  font-size:.88rem;
}

/* ===== 顶部导航 ===== */
.site-header{
  position:sticky;
  top:0;
  z-index:200;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(228,222,210,.75);
}
.nav-wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:76px;
}
.brand{
  display:flex;
  align-items:center;
  gap:10px;
}
.brand-logo{
  width:42px;
  height:42px;
  border-radius:13px;
  background:linear-gradient(135deg,var(--brand),var(--brand-deep));
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:1.25rem;
  flex:0 0 auto;
}
.brand-text{
  display:flex;
  flex-direction:column;
  line-height:1.2;
}
.brand-name{
  font-weight:800;
  color:var(--ink);
  font-size:1.28rem;
  letter-spacing:.01em;
}
.brand-tag{
  font-size:.75rem;
  color:var(--muted);
  margin-top:2px;
}
.main-nav{
  display:flex;
  align-items:center;
  gap:10px;
}
.nav-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:10px 18px;
  border-radius:999px;
  color:var(--ink);
  font-weight:600;
  font-size:.95rem;
  transition:var(--transition);
}
.nav-link i{
  font-size:.85rem;
  color:var(--muted);
}
.nav-link:hover{
  background:var(--brand-soft);
  color:var(--brand);
}
.nav-link.active{
  background:var(--brand);
  color:#fff;
  box-shadow:0 6px 16px rgba(14,107,92,.22);
}
.nav-link.active i{
  color:rgba(255,255,255,.8);
}
.nav-entry{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 22px;
  border-radius:999px;
  background:var(--accent);
  color:#23312d;
  font-weight:700;
  font-size:.92rem;
  transition:var(--transition);
}
.nav-entry:hover{
  background:var(--accent-deep);
  color:#fff;
  transform:translateY(-2px);
}
.nav-toggle{
  display:none;
  width:44px;
  height:44px;
  border-radius:12px;
  border:1px solid var(--border);
  background:#fff;
  color:var(--ink);
  font-size:1.15rem;
  cursor:pointer;
  align-items:center;
  justify-content:center;
}
.nav-toggle:hover{
  border-color:var(--brand);
  color:var(--brand);
}

/* ===== Hero ===== */
.hero{
  position:relative;
  padding:96px 0 104px;
  overflow:hidden;
  background:
    radial-gradient(900px 500px at 90% -10%,rgba(14,107,92,.12),transparent 60%),
    radial-gradient(700px 400px at -10% 110%,rgba(232,146,78,.14),transparent 60%),
    var(--bg);
}
.hero-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:var(--brand-soft);
  color:var(--brand-deep);
  font-weight:700;
  font-size:.86rem;
  padding:8px 18px;
  border-radius:999px;
  margin-bottom:22px;
}
.hero h1{
  font-size:2.55rem;
  line-height:1.25;
  font-weight:800;
  margin:0 0 20px;
  color:var(--ink);
  letter-spacing:-.01em;
}
.hero h1 span{
  color:var(--brand);
}
.hero-desc{
  font-size:1.05rem;
  color:var(--muted);
  max-width:560px;
  margin:0 0 32px;
}
.hero-ctas{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-bottom:38px;
}
.hero-kpi{
  display:flex;
  flex-wrap:wrap;
  gap:34px;
}
.kpi-item{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.kpi-item strong{
  font-size:1.9rem;
  font-weight:800;
  color:var(--brand);
  line-height:1.1;
}
.kpi-item span{
  font-size:.88rem;
  color:var(--muted);
}
.hero-visual{
  position:relative;
  padding:30px 0 30px 28px;
}
.hero-visual__bg{
  position:absolute;
  top:14px;
  left:6px;
  width:calc(100% - 20px);
  height:calc(100% - 20px);
  border-radius:36px;
  background:linear-gradient(135deg,rgba(14,107,92,.16),rgba(232,146,78,.2));
  transform:rotate(4deg);
}
.hero-visual__img{
  position:relative;
  border-radius:30px;
  aspect-ratio:5/7;
  max-width:420px;
  margin-left:auto;
  overflow:hidden;
  box-shadow:var(--shadow);
  transform:rotate(-2deg);
  border:6px solid #fff;
}
.hero-visual__img img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.float-badge{
  position:absolute;
  bottom:38px;
  left:-4px;
  background:#fff;
  border-radius:18px;
  box-shadow:var(--shadow);
  padding:14px 20px;
  display:flex;
  align-items:center;
  gap:12px;
  z-index:3;
}
.float-badge .badge-icon{
  width:44px;
  height:44px;
  border-radius:14px;
  background:var(--accent);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.2rem;
}
.float-badge strong{
  display:block;
  font-size:.98rem;
  line-height:1.2;
}
.float-badge span{
  font-size:.82rem;
  color:var(--muted);
}

/* ===== 品牌故事 ===== */
.story{
  background:var(--bg-alt);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.story-photo{
  position:relative;
  border-radius:28px;
  overflow:hidden;
  box-shadow:var(--shadow);
  min-height:360px;
  background-size:cover;
  background-position:center;
}
.story-photo::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(14,107,92,.2),transparent 60%);
}
.story-photo-float{
  position:absolute;
  left:20px;
  bottom:20px;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(8px);
  border-radius:14px;
  padding:10px 16px;
  font-weight:700;
  font-size:.9rem;
  color:var(--brand-deep);
  z-index:2;
  box-shadow:var(--shadow-sm);
}
.story-text{
  font-size:1.02rem;
  color:var(--muted);
  margin-bottom:20px;
}
.story-feature-list{
  display:flex;
  flex-direction:column;
  gap:14px;
  margin:24px 0 30px;
}
.story-feature-list li{
  display:flex;
  align-items:flex-start;
  gap:12px;
  background:#faf8f3;
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px 16px;
  transition:var(--transition);
}
.story-feature-list li:hover{
  border-color:var(--brand);
  transform:translateX(4px);
}
.story-feature-list i{
  color:var(--brand);
  font-size:1.15rem;
  margin-top:4px;
}
.story-feature-list strong{
  display:block;
  font-size:.98rem;
  color:var(--ink);
}
.story-feature-list span{
  font-size:.9rem;
  color:var(--muted);
}

/* ===== 精选内容卡 ===== */
.featured{
  background:var(--bg);
}
.feature-card{
  background:var(--card);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow-sm);
  transition:var(--transition);
  height:100%;
  display:flex;
  flex-direction:column;
  border:1px solid rgba(228,222,210,.6);
}
.feature-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow);
}
.feature-card-media{
  aspect-ratio:16/10;
  overflow:hidden;
  position:relative;
}
.feature-card-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .6s ease;
}
.feature-card:hover .feature-card-media img{
  transform:scale(1.05);
}
.feature-card-tag{
  position:absolute;
  left:16px;
  top:16px;
  background:rgba(255,255,255,.92);
  color:var(--brand-deep);
  font-size:.8rem;
  font-weight:700;
  padding:6px 14px;
  border-radius:999px;
  backdrop-filter:blur(6px);
}
.feature-card-body{
  padding:24px;
  flex:1;
  display:flex;
  flex-direction:column;
}
.feature-card-body h3{
  font-size:1.18rem;
  line-height:1.4;
  margin:0 0 10px;
  color:var(--ink);
  font-weight:700;
}
.feature-card-body p{
  color:var(--muted);
  font-size:.94rem;
  margin:0;
  line-height:1.75;
}
.feature-card-more{
  margin-top:auto;
  padding-top:18px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-weight:700;
  font-size:.9rem;
  color:var(--brand);
}

/* ===== 卖点三连 ===== */
.points{
  background:var(--brand-deep);
  color:#fff;
  position:relative;
  overflow:hidden;
}
.points::before{
  content:"";
  position:absolute;
  top:-140px;
  right:-100px;
  width:380px;
  height:380px;
  border-radius:50%;
  background:rgba(255,255,255,.05);
}
.point-card{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.15);
  border-radius:20px;
  padding:32px 28px;
  height:100%;
  transition:var(--transition);
}
.point-card:hover{
  background:rgba(255,255,255,.14);
  transform:translateY(-4px);
}
.point-icon{
  width:56px;
  height:56px;
  border-radius:16px;
  background:var(--accent);
  color:#23312d;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.3rem;
  margin-bottom:20px;
}
.point-card h3{
  font-size:1.22rem;
  margin:0 0 12px;
  font-weight:700;
}
.point-card p{
  margin:0;
  font-size:.95rem;
  color:rgba(255,255,255,.82);
  line-height:1.8;
}
.points .section-head h2{
  color:#fff;
}
.points .section-head p{
  color:rgba(255,255,255,.75);
}
.points .section-head .eyebrow{
  color:var(--accent);
}

/* ===== 使用指南 / 时间线 ===== */
.guide{
  background:var(--bg-alt);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.timeline{
  position:relative;
  max-width:800px;
  margin:0 auto;
  padding:10px 0;
}
.timeline::before{
  content:"";
  position:absolute;
  left:34px;
  top:0;
  bottom:0;
  width:2px;
  background:linear-gradient(var(--accent),var(--brand));
  opacity:.35;
}
.timeline-item{
  position:relative;
  padding:0 0 34px 90px;
}
.timeline-item:last-child{
  padding-bottom:0;
}
.timeline-node{
  position:absolute;
  left:14px;
  top:6px;
  width:42px;
  height:42px;
  border-radius:50%;
  background:#fff;
  border:2px solid var(--brand);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  color:var(--brand);
  box-shadow:0 4px 14px rgba(14,107,92,.18);
  z-index:2;
}
.timeline-item h3{
  font-size:1.18rem;
  margin:0 0 8px;
  color:var(--ink);
  font-weight:700;
}
.timeline-item p{
  margin:0;
  color:var(--muted);
  font-size:.96rem;
  line-height:1.8;
}

/* ===== 口碑 / 评价 ===== */
.testimonial-card{
  background:var(--bg-alt);
  border-radius:20px;
  padding:28px;
  height:100%;
  box-shadow:var(--shadow-sm);
  border:1px solid var(--border);
  position:relative;
  transition:var(--transition);
}
.testimonial-card:hover{
  box-shadow:var(--shadow);
  transform:translateY(-4px);
}
.testimonial-card::before{
  content:"\201C";
  position:absolute;
  top:10px;
  right:24px;
  font-size:4rem;
  font-family:Georgia,serif;
  color:var(--brand-soft);
  line-height:1;
}
.quote-text{
  font-size:.97rem;
  color:var(--muted);
  line-height:1.8;
  margin:0 0 18px;
  position:relative;
  z-index:1;
}
.quote-user{
  display:flex;
  align-items:center;
  gap:12px;
}
.quote-avatar{
  width:42px;
  height:42px;
  border-radius:50%;
  background:var(--brand-soft);
  color:var(--brand-deep);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:.9rem;
}
.quote-user strong{
  display:block;
  font-size:.95rem;
  color:var(--ink);
}
.quote-user span{
  font-size:.83rem;
  color:var(--muted);
}

/* ===== FAQ ===== */
.faq{
  background:var(--bg-alt);
  border-top:1px solid var(--border);
}
.faq-grid{
  max-width:860px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.faq-item{
  background:#faf8f3;
  border:1px solid var(--border);
  border-radius:16px;
  padding:24px 26px;
  transition:var(--transition);
}
.faq-item:hover{
  border-color:var(--brand);
  background:#fff;
  box-shadow:var(--shadow-sm);
}
.faq-item h3{
  font-size:1.05rem;
  margin:0 0 10px;
  font-weight:700;
  color:var(--ink);
}
.faq-item p{
  margin:0;
  color:var(--muted);
  font-size:.96rem;
  line-height:1.9;
}

/* ===== 资讯区 ===== */
.news{
  background:var(--bg);
}
.news-list{
  display:flex;
  flex-direction:column;
  background:var(--card);
  border-radius:18px;
  border:1px solid var(--border);
  overflow:hidden;
  box-shadow:var(--shadow-sm);
}
.news-list li{
  border-bottom:1px solid #efe9de;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  transition:var(--transition);
}
.news-list li:last-child{
  border-bottom:none;
}
.news-list a{
  flex:1;
  padding:18px 22px;
  display:flex;
  gap:14px;
  align-items:center;
  color:var(--ink);
  font-size:.98rem;
  font-weight:600;
}
.news-list a i{
  color:var(--accent-deep);
  font-size:.85rem;
}
.news-list a:hover{
  background:var(--brand-soft);
  color:var(--brand-deep);
}
.news-list .news-date{
  padding-right:22px;
  font-size:.82rem;
  color:var(--muted);
  white-space:nowrap;
}
.side-card{
  background:var(--card);
  border-radius:18px;
  padding:26px;
  border:1px solid var(--border);
  box-shadow:var(--shadow-sm);
  margin-bottom:20px;
}
.side-card h3{
  font-size:1.05rem;
  margin:0 0 16px;
  color:var(--ink);
  font-weight:700;
  display:flex;
  align-items:center;
  gap:8px;
}
.side-card h3 i{
  color:var(--accent-deep);
}
.side-list li{
  margin-bottom:12px;
}
.side-list a{
  color:var(--muted);
  font-size:.94rem;
  display:flex;
  align-items:center;
  gap:10px;
  transition:var(--transition);
}
.side-list a::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--brand);
  flex:0 0 auto;
}
.side-list a:hover{
  color:var(--brand);
  padding-left:4px;
}
.tag-wrap{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.tag-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:var(--brand-soft);
  color:var(--brand-deep);
  font-size:.85rem;
  font-weight:600;
  padding:7px 14px;
  border-radius:999px;
  transition:var(--transition);
}
.tag-pill:hover{
  background:var(--accent);
  color:#23312d;
}

/* ===== CTA 订阅 / 进店 ===== */
.cta-panel{
  position:relative;
  background-size:cover;
  background-position:center;
  border-radius:30px;
  overflow:hidden;
  padding:72px 30px;
  text-align:center;
}
.cta-panel::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(10,79,68,.9),rgba(14,107,92,.76));
}
.cta-content{
  position:relative;
  z-index:2;
  max-width:680px;
  margin:0 auto;
  color:#fff;
}
.cta-content .eyebrow{
  color:var(--accent);
  font-weight:700;
  font-size:.88rem;
  letter-spacing:.06em;
  display:block;
  margin-bottom:12px;
}
.cta-content h2{
  font-size:2.15rem;
  font-weight:800;
  line-height:1.3;
  margin:0 0 16px;
}
.cta-content p{
  color:rgba(255,255,255,.85);
  font-size:1.02rem;
  margin:0 0 32px;
  line-height:1.8;
}
.cta-btns{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:14px;
}

/* ===== 底部转化条 ===== */
.bottom-cta{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:150;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-top:1px solid var(--border);
  box-shadow:0 -6px 24px rgba(0,0,0,.08);
  padding:12px 0;
}
.bottom-cta__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.bottom-cta__text{
  display:flex;
  align-items:center;
  gap:12px;
}
.bottom-cta__text i{
  width:38px;
  height:38px;
  border-radius:12px;
  background:var(--brand-soft);
  color:var(--brand);
  display:flex;
  align-items:center;
  justify-content:center;
}
.bottom-cta__text strong{
  font-size:.98rem;
  color:var(--ink);
  display:block;
  line-height:1.3;
}
.bottom-cta__text span{
  font-size:.82rem;
  color:var(--muted);
}

/* ===== 页脚 ===== */
.site-footer{
  background:#10231e;
  color:#b7cac4;
  padding:60px 0 40px;
  font-size:.92rem;
}
.footer-brand{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:20px;
}
.footer-brand .brand-logo{
  background:rgba(255,255,255,.12);
  color:#fff;
}
.footer-brand .brand-name{
  color:#fff;
  font-size:1.15rem;
}
.footer-brand .brand-tag{
  color:#93adc1;
}
.footer-desc{
  color:#93adc1;
  font-size:.92rem;
  line-height:1.8;
  max-width:380px;
  margin-bottom:20px;
}
.footer-cols{
  display:flex;
  flex-wrap:wrap;
  gap:36px;
}
.footer-cols h4{
  color:#fff;
  font-size:.98rem;
  font-weight:700;
  margin-bottom:16px;
}
.footer-links li{
  margin-bottom:10px;
}
.footer-links a{
  color:#93adc1;
  transition:var(--transition);
}
.footer-links a:hover{
  color:var(--accent);
}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);
  margin-top:40px;
  padding-top:22px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  font-size:.85rem;
  color:#7f9a93;
}
.footer-bottom a{
  color:#7f9a93;
}
.footer-bottom a:hover{
  color:#fff;
}

/* ===== 响应式 ===== */
@media (max-width:1024px){
  .section{
    padding:72px 0;
  }
  .hero{
    padding:80px 0 88px;
  }
  .hero h1{
    font-size:2.15rem;
  }
  .hero-visual__img{
    max-width:360px;
  }
  .footer-cols{
    gap:24px;
  }
}
@media (max-width:768px){
  .section{
    padding:60px 0;
  }
  .section-head{
    margin-bottom:36px;
  }
  .section-head h2{
    font-size:1.72rem;
  }
  .hero{
    padding:60px 0 72px;
  }
  .hero h1{
    font-size:1.8rem;
  }
  .hero-desc{
    font-size:.98rem;
  }
  .hero-visual{
    padding:30px 10px 20px;
  }
  .hero-visual__img{
    max-width:100%;
    aspect-ratio:4/3;
  }
  .hero-visual__img img{
    object-position:center 30%;
  }
  .kpi-item strong{
    font-size:1.6rem;
  }
  .main-nav{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    background:#fff;
    border-bottom:1px solid var(--border);
    padding:16px 20px;
    flex-direction:column;
    align-items:stretch;
    gap:8px;
    box-shadow:var(--shadow);
  }
  .main-nav.open{
    display:flex;
  }
  .nav-link{
    padding:14px 16px;
  }
  .nav-entry{
    justify-content:center;
  }
  .nav-toggle{
    display:inline-flex;
  }
  .footer-cols{
    flex-direction:column;
    gap:28px;
  }
  .bottom-cta__text span{
    display:none;
  }
}
@media (max-width:520px){
  .grid-container{
    padding-left:16px;
    padding-right:16px;
  }
  .section{
    padding:48px 0;
  }
  .hero h1{
    font-size:1.55rem;
  }
  .hero-desc{
    font-size:.94rem;
  }
  .hero-ctas .btn{
    width:100%;
  }
  .hero-kpi{
    gap:22px;
  }
  .kpi-item strong{
    font-size:1.4rem;
  }
  .point-card{
    padding:24px 20px;
  }
  .timeline::before{
    left:22px;
  }
  .timeline-item{
    padding-left:62px;
  }
  .timeline-node{
    left:2px;
    width:34px;
    height:34px;
    font-size:.9rem;
  }
  .news-list a{
    flex-direction:column;
    gap:4px;
    align-items:flex-start;
  }
  .news-list .news-date{
    padding:0 22px 14px;
  }
  .cta-panel{
    padding:48px 20px;
  }
  .cta-content h2{
    font-size:1.5rem;
  }
  .bottom-cta__text strong{
    font-size:.86rem;
  }
  .bottom-cta__text i{
    display:none;
  }
  .bottom-cta__inner{
    padding:0 8px;
  }
  .btn-sm{
    padding:8px 14px;
    font-size:.84rem;
  }
  .footer-bottom{
    flex-direction:column;
    text-align:center;
  }
}

/* 页脚底部安全间距 */
body{
  padding-bottom:76px;
}
@media (min-width:769px){
  body{
    padding-bottom:0;
  }
  .bottom-cta{
    display:none;
  }
}
@media (max-width:768px){
  .bottom-cta{
    display:block;
  }
}