/* ==========================================================================
   一起草 (17c) · 全平台下载站 — 共享设计系统
   视觉概念：植物志 · 清新草系（Botanical Field Guide）
   一个设计令牌 + 组件库，供站内全部页面共用。
   ========================================================================== */

/* ---------- 1. 设计令牌 ---------- */
:root{
  /* 色板：以雾白纸感为底，森林绿为主，嫩芽绿为点缀，暖阳橙为行动色 */
  --mist:      #F3F8EC;
  --cream:     #FBFDF6;
  --paper:     #FFFFFF;
  --grass-900: #13270E;
  --grass-800: #1E401A;
  --grass-700: #2E7D32;
  --grass-600: #3F9142;
  --grass-500: #5FA83C;
  --grass-400: #86C554;
  --grass-300: #B7DC84;
  --grass-100: #E4F1D4;
  --sun:       #EE9E30;
  --sun-deep:  #D9821A;
  --sun-soft:  #FBDCA8;
  --ink:       #16210F;
  --ink-soft:  #4A5A41;
  --ink-mute:  #7E8D74;
  --line:      rgba(19,39,14,.14);
  --line-soft: rgba(19,39,14,.07);
  --glow:      rgba(95,168,60,.35);

  /* 字体：几何衬线做标题（中文思源宋体），无衬线做正文 */
  --font-display: "Fraunces", "Noto Serif SC", Georgia, "Songti SC", "SimSun", serif;
  --font-serif:   "Noto Serif SC", "Songti SC", Georgia, serif;
  --font-body:    "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Microsoft YaHei", "PingFang SC", sans-serif;

  /* 尺度 */
  --wrap: 1180px;
  --radius-s: 12px;
  --radius:   20px;
  --radius-l: 32px;
  --shadow-s: 0 2px 10px rgba(19,39,14,.06);
  --shadow:   0 20px 44px -20px rgba(19,39,14,.35);
  --shadow-lg:0 48px 90px -34px rgba(19,39,14,.5);
  --nav-h: 72px;
  --ease: cubic-bezier(.22,.61,.36,1);

  /* 装饰纹理：极淡的植物纤维噪点 */
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}

/* ---------- 2. 基础重置 ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.75;
  color:var(--ink);
  background:var(--mist);
  background-image:
    radial-gradient(1100px 600px at 88% -8%, rgba(134,197,84,.22), transparent 62%),
    radial-gradient(900px 520px at -6% 12%, rgba(183,220,132,.24), transparent 60%);
  background-attachment:fixed;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:"";
  position:fixed; inset:0;
  background-image:var(--grain);
  opacity:.035;
  mix-blend-mode:multiply;
  pointer-events:none;
  z-index:9999;
}
img,svg{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; cursor:pointer; }
ul,ol{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family:var(--font-serif); font-weight:700; line-height:1.2; color:var(--grass-900); margin:0; letter-spacing:-.01em; }
p{ margin:0; }
::selection{ background:var(--grass-300); color:var(--grass-900); }
:focus-visible{ outline:2.5px solid var(--grass-600); outline-offset:3px; border-radius:6px; }

/* ---------- 3. 布局工具 ---------- */
.wrap{ width:min(var(--wrap), 100% - 44px); margin-inline:auto; }
.section{ padding:96px 0; position:relative; }
.section--tight{ padding:64px 0; }
.section--paper{ background:var(--cream); }
.center{ text-align:center; }
.stack-lg > * + *{ margin-top:26px; }

.eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--font-body); font-size:12.5px; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase;
  color:var(--grass-700);
  padding:7px 15px 7px 12px;
  background:rgba(255,255,255,.7);
  border:1px solid var(--line);
  border-radius:999px;
  box-shadow:var(--shadow-s);
}
.eyebrow::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--grass-500); box-shadow:0 0 0 3px var(--grass-100); }

.h-sec{ font-size:clamp(28px, 3.6vw, 46px); }
.lead{ font-size:clamp(16px,1.35vw,19px); color:var(--ink-soft); max-width:62ch; }
.muted{ color:var(--ink-mute); }
.mono{ font-family:ui-monospace,"SFMono-Regular",Consolas,monospace; font-size:.88em; }

/* ---------- 4. 按钮 ---------- */
.btn{
  --btn-bg:var(--grass-700); --btn-fg:#fff;
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:14px 26px; border-radius:999px; border:1px solid transparent;
  font-weight:700; font-size:15px; line-height:1; letter-spacing:.01em;
  background:var(--btn-bg); color:var(--btn-fg);
  box-shadow:0 12px 26px -12px rgba(46,125,50,.7);
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease);
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); box-shadow:0 20px 34px -14px rgba(46,125,50,.82); }
.btn:active{ transform:translateY(0); }
.btn svg{ width:17px; height:17px; }
.btn--sun{ --btn-bg:var(--sun); --btn-fg:#3A2503; box-shadow:0 12px 26px -12px rgba(238,158,48,.85); }
.btn--line{ --btn-bg:transparent; --btn-fg:var(--grass-800); border-color:var(--line); box-shadow:none; }
.btn--line:hover{ background:rgba(255,255,255,.75); box-shadow:var(--shadow-s); }
.btn--sm{ padding:10px 18px; font-size:13.5px; }
.btn--block{ width:100%; }
.btn-group{ display:flex; flex-wrap:wrap; gap:13px; }
.btn-group--center{ justify-content:center; }

/* ---------- 5. 卡片 ---------- */
.card{
  background:var(--paper);
  border:1px solid var(--line-soft);
  border-radius:var(--radius);
  padding:28px;
  box-shadow:var(--shadow-s);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
  position:relative; overflow:hidden;
}
.card:hover{ transform:translateY(-5px); box-shadow:var(--shadow); border-color:var(--line); }
.card__icon{
  width:52px; height:52px; border-radius:15px;
  display:grid; place-items:center;
  background:linear-gradient(140deg, var(--grass-100), #fff);
  border:1px solid var(--line-soft);
  color:var(--grass-700); margin-bottom:18px;
}
.card__icon svg{ width:26px; height:26px; }
.card h3{ font-size:20px; margin-bottom:9px; }
.card p{ color:var(--ink-soft); font-size:15px; }

.grid{ display:grid; gap:22px; }
.grid--3{ grid-template-columns:repeat(3,1fr); }
.grid--2{ grid-template-columns:repeat(2,1fr); }
.grid--4{ grid-template-columns:repeat(4,1fr); }

/* ---------- 6. 顶部导航 ---------- */
.nav{
  position:sticky; top:0; z-index:200;
  height:var(--nav-h);
  display:flex; align-items:center;
  background:rgba(243,248,236,.72);
  backdrop-filter:blur(14px) saturate(1.3);
  border-bottom:1px solid transparent;
  transition:box-shadow .3s var(--ease), background .3s var(--ease), border-color .3s var(--ease);
}
.nav.is-stuck{ box-shadow:0 10px 30px -18px rgba(19,39,14,.5); background:rgba(243,248,236,.9); border-color:var(--line-soft); }
.nav__inner{ display:flex; align-items:center; gap:26px; width:min(var(--wrap),100% - 44px); margin-inline:auto; }
.brand{ display:flex; align-items:center; gap:11px; font-family:var(--font-serif); font-weight:700; font-size:19px; color:var(--grass-900); }
.brand__mark{ width:38px; height:38px; border-radius:12px; background:linear-gradient(150deg,var(--grass-400),var(--grass-700)); display:grid; place-items:center; box-shadow:0 10px 20px -10px rgba(46,125,50,.9); }
.brand__mark svg{ width:22px; height:22px; }
.brand__tag{ font-family:var(--font-body); font-size:11px; font-weight:700; letter-spacing:.14em; color:var(--grass-600); border:1px solid var(--line); border-radius:999px; padding:2px 8px; }
.nav__links{ display:flex; align-items:center; gap:4px; margin-left:auto; }
.nav__links a{
  padding:9px 15px; border-radius:10px; font-size:14.5px; font-weight:500; color:var(--ink-soft);
  transition:color .2s, background .2s;
}
.nav__links a:hover{ color:var(--grass-800); background:rgba(255,255,255,.8); }
.nav__links a.is-active{ color:var(--grass-800); font-weight:700; background:rgba(183,220,132,.36); }
.nav__cta{ margin-left:8px; }
.burger{ display:none; margin-left:auto; width:44px; height:44px; border-radius:12px; border:1px solid var(--line); background:rgba(255,255,255,.7); align-items:center; justify-content:center; flex-direction:column; gap:5px; }
.burger span{ width:19px; height:2px; border-radius:2px; background:var(--grass-800); transition:transform .3s var(--ease), opacity .3s; }
.burger.is-open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.burger.is-open span:nth-child(2){ opacity:0; }
.burger.is-open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.mobile-menu{
  position:fixed; inset:var(--nav-h) 0 auto 0; z-index:190;
  background:rgba(251,253,246,.98);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
  padding:18px 0 26px;
  transform:translateY(-12px); opacity:0; pointer-events:none;
  transition:transform .3s var(--ease), opacity .3s var(--ease);
  box-shadow:var(--shadow);
}
.mobile-menu.is-open{ transform:none; opacity:1; pointer-events:auto; }
.mobile-menu a{ display:block; padding:14px 22px; font-size:17px; font-weight:600; color:var(--grass-900); border-bottom:1px solid var(--line-soft); }
.mobile-menu .btn{ margin:18px 22px 0; }

/* ---------- 7. 首页 Hero ---------- */
.hero{ position:relative; padding:74px 0 90px; overflow:hidden; }
.hero__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; position:relative; z-index:2; }
.hero h1{ font-size:clamp(38px,5.4vw,68px); font-weight:900; letter-spacing:-.02em; margin:22px 0 0; }
.hero h1 em{ font-style:normal; color:var(--grass-600); position:relative; white-space:nowrap; }
.hero h1 em::after{
  content:""; position:absolute; left:-2%; right:-2%; bottom:.06em; height:.34em; z-index:-1;
  background:linear-gradient(90deg,var(--grass-300),rgba(183,220,132,.25));
  border-radius:6px;
}
.hero__sub{ margin-top:22px; font-size:clamp(16px,1.4vw,18.5px); color:var(--ink-soft); max-width:52ch; }
.hero__actions{ margin-top:34px; }
.hero__meta{ margin-top:26px; display:flex; flex-wrap:wrap; gap:22px; color:var(--ink-mute); font-size:13.5px; }
.hero__meta div{ display:flex; align-items:center; gap:8px; }
.hero__meta svg{ width:16px; height:16px; color:var(--grass-600); }

/* 手机模型 */
.phone-stage{ position:relative; display:grid; place-items:center; }
.phone{
  width:min(300px,80%); aspect-ratio:9/18.6; border-radius:46px; padding:12px;
  background:linear-gradient(160deg,#2B4A22,#13270E);
  box-shadow:var(--shadow-lg), inset 0 0 0 2px rgba(255,255,255,.08);
  position:relative; z-index:3;
  animation:float 7s ease-in-out infinite;
}
@keyframes float{ 0%,100%{ transform:translateY(0) rotate(-1.4deg);} 50%{ transform:translateY(-16px) rotate(1.4deg);} }
.phone__screen{
  width:100%; height:100%; border-radius:36px; overflow:hidden;
  background:linear-gradient(175deg,#EAF6DC 0%, #FBFDF6 46%, #F1F8E6 100%);
  display:flex; flex-direction:column; padding:20px 16px; gap:14px;
}
.phone__notch{ width:74px; height:6px; border-radius:999px; background:rgba(19,39,14,.22); margin:0 auto 4px; }
.phone__app{ display:flex; align-items:center; gap:11px; }
.phone__app .logo{ width:44px; height:44px; border-radius:13px; background:linear-gradient(150deg,var(--grass-400),var(--grass-700)); display:grid; place-items:center; box-shadow:0 8px 18px -8px rgba(46,125,50,.9); }
.phone__app .logo svg{ width:26px; height:26px; }
.phone__app b{ font-family:var(--font-serif); font-size:17px; display:block; line-height:1.3; }
.phone__app small{ color:var(--ink-mute); font-size:11.5px; }
.phone__bar{ height:9px; border-radius:999px; background:linear-gradient(90deg,var(--grass-500),var(--grass-300)); }
.phone__bar.w70{ width:70%; background:rgba(19,39,14,.1); }
.phone__bar.w45{ width:45%; background:rgba(19,39,14,.1); }
.phone__tile{ flex:1; border-radius:16px; background:var(--paper); border:1px solid var(--line-soft); display:flex; flex-direction:column; gap:9px; padding:14px; }
.phone__tile .row{ display:flex; gap:9px; align-items:center; }
.phone__dot{ width:26px; height:26px; border-radius:9px; background:var(--grass-100); flex:none; }
.phone__line{ height:7px; border-radius:999px; background:rgba(19,39,14,.09); flex:1; }
.phone__line.short{ max-width:58%; }
.phone__cta{ height:40px; border-radius:13px; background:linear-gradient(120deg,var(--sun),var(--sun-deep)); display:grid; place-items:center; color:#fff; font-size:13px; font-weight:700; }
.blob{ position:absolute; border-radius:50%; filter:blur(6px); z-index:1; }
.blob--a{ width:300px; height:300px; background:radial-gradient(circle at 40% 40%, rgba(134,197,84,.5), transparent 66%); top:-40px; left:-30px; animation:float 9s ease-in-out infinite; }
.blob--b{ width:260px; height:260px; background:radial-gradient(circle at 60% 40%, rgba(238,158,48,.32), transparent 66%); bottom:-30px; right:-10px; animation:float 11s ease-in-out infinite reverse; }
.leaf-deco{ position:absolute; color:var(--grass-400); opacity:.55; z-index:1; }
.leaf-deco--1{ top:16%; right:4%; width:64px; animation:sway 8s ease-in-out infinite; }
.leaf-deco--2{ bottom:12%; left:2%; width:48px; animation:sway 10s ease-in-out infinite reverse; }
@keyframes sway{ 0%,100%{ transform:rotate(-6deg);} 50%{ transform:rotate(8deg);} }

/* ---------- 8. 跑马灯 ---------- */
.marquee{ overflow:hidden; border-block:1px solid var(--line-soft); background:var(--cream); padding:20px 0; }
.marquee__track{ display:flex; gap:52px; width:max-content; animation:scrollX 34s linear infinite; }
.marquee__track span{ font-family:var(--font-serif); font-size:clamp(18px,2vw,26px); color:var(--grass-800); opacity:.72; display:flex; align-items:center; gap:52px; white-space:nowrap; }
.marquee__track span::after{ content:"✦"; color:var(--grass-400); font-size:.7em; }
@keyframes scrollX{ to{ transform:translateX(-50%); } }

/* ---------- 9. 数据条 ---------- */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.stat{ text-align:center; padding:24px 12px; }
.stat b{ font-family:var(--font-display); font-size:clamp(30px,3.6vw,44px); color:var(--grass-700); display:block; line-height:1; font-weight:600; }
.stat span{ display:block; margin-top:9px; font-size:13.5px; color:var(--ink-mute); letter-spacing:.04em; }

/* ---------- 10. 下载平台卡 ---------- */
.platform{
  display:flex; flex-direction:column; gap:16px;
  background:var(--paper); border:1px solid var(--line-soft); border-radius:var(--radius);
  padding:26px; box-shadow:var(--shadow-s);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s;
  position:relative; overflow:hidden;
}
.platform::after{ content:""; position:absolute; inset:auto -30% -60% auto; width:200px; height:200px; background:radial-gradient(circle,var(--glow),transparent 68%); opacity:0; transition:opacity .4s; }
.platform:hover{ transform:translateY(-6px); box-shadow:var(--shadow); border-color:var(--grass-300); }
.platform:hover::after{ opacity:.55; }
.platform__head{ display:flex; align-items:center; gap:14px; }
.platform__os{ width:50px; height:50px; border-radius:15px; display:grid; place-items:center; background:var(--grass-100); color:var(--grass-700); flex:none; }
.platform__os svg{ width:26px; height:26px; }
.platform__head h3{ font-size:19px; }
.platform__head small{ color:var(--ink-mute); font-size:12.5px; }
.platform__specs{ display:grid; grid-template-columns:1fr 1fr; gap:8px 14px; font-size:13px; color:var(--ink-soft); }
.platform__specs div{ display:flex; justify-content:space-between; gap:8px; border-bottom:1px dashed var(--line-soft); padding-bottom:6px; }
.platform__specs b{ font-weight:600; color:var(--ink); }

.chips{ display:flex; flex-wrap:wrap; gap:10px; }
.chip{
  padding:9px 18px; border-radius:999px; border:1px solid var(--line); background:rgba(255,255,255,.7);
  font-size:14px; font-weight:600; color:var(--ink-soft); transition:all .22s var(--ease);
}
.chip:hover{ border-color:var(--grass-500); color:var(--grass-800); }
.chip.is-active{ background:var(--grass-700); color:#fff; border-color:var(--grass-700); box-shadow:0 10px 20px -12px rgba(46,125,50,.9); }
[data-cat].is-hidden{ display:none; }

/* 下载表格 */
.table-wrap{ overflow-x:auto; border:1px solid var(--line-soft); border-radius:var(--radius); background:var(--paper); box-shadow:var(--shadow-s); }
table{ width:100%; border-collapse:collapse; font-size:14.5px; min-width:640px; }
thead th{ text-align:left; padding:16px 20px; background:var(--grass-100); color:var(--grass-800); font-weight:700; font-size:13.5px; letter-spacing:.03em; }
tbody td{ padding:15px 20px; border-top:1px solid var(--line-soft); color:var(--ink-soft); }
tbody tr:hover{ background:rgba(228,241,212,.4); }
tbody td:first-child{ color:var(--ink); font-weight:600; }

/* 二维码 */
.qr-box{ display:flex; align-items:center; gap:22px; background:var(--paper); border:1px solid var(--line-soft); border-radius:var(--radius); padding:22px; box-shadow:var(--shadow-s); }
.qr{ width:118px; height:118px; flex:none; border-radius:14px; background:#fff; border:1px solid var(--line-soft); padding:8px; }
.qr svg{ width:100%; height:100%; }

/* ---------- 11. 功能分区（图文交替） ---------- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.split--rev .split__media{ order:2; }
.split__media{
  border-radius:var(--radius-l); padding:30px; min-height:280px;
  background:linear-gradient(155deg,#fff, var(--grass-100));
  border:1px solid var(--line-soft); box-shadow:var(--shadow-s);
  display:grid; place-items:center; position:relative; overflow:hidden;
}
.split__media svg{ width:100%; max-width:340px; height:auto; }
.split h2{ font-size:clamp(24px,2.8vw,36px); }
.feat-list{ display:grid; gap:16px; margin-top:24px; }
.feat-list li{ display:flex; gap:13px; align-items:flex-start; }
.feat-list svg{ width:22px; height:22px; color:var(--grass-600); flex:none; margin-top:3px; }
.feat-list b{ display:block; color:var(--ink); font-weight:700; }
.feat-list span{ color:var(--ink-soft); font-size:14.5px; }

/* ---------- 12. 时间线（更新日志） ---------- */
.timeline{ position:relative; padding-left:34px; }
.timeline::before{ content:""; position:absolute; left:9px; top:6px; bottom:6px; width:2px; background:linear-gradient(var(--grass-400),var(--grass-100)); }
.tl-item{ position:relative; padding-bottom:34px; }
.tl-item:last-child{ padding-bottom:0; }
.tl-item::before{ content:""; position:absolute; left:-33px; top:5px; width:14px; height:14px; border-radius:50%; background:var(--paper); border:3px solid var(--grass-500); box-shadow:0 0 0 4px var(--grass-100); }
.tl-item time{ font-size:12.5px; font-weight:700; letter-spacing:.06em; color:var(--grass-600); }
.tl-item h3{ font-size:19px; margin:6px 0 8px; }
.tl-item p{ color:var(--ink-soft); font-size:14.5px; }
.tl-item .badge{ display:inline-block; font-size:11.5px; font-weight:700; padding:2px 9px; border-radius:999px; background:var(--sun-soft); color:var(--sun-deep); margin-left:8px; vertical-align:middle; }

/* ---------- 13. FAQ 手风琴 ---------- */
.faq{ display:grid; gap:14px; max-width:880px; margin-inline:auto; }
.acc{ background:var(--paper); border:1px solid var(--line-soft); border-radius:var(--radius-s); overflow:hidden; transition:border-color .25s, box-shadow .25s; }
.acc[open]{ border-color:var(--grass-300); box-shadow:var(--shadow-s); }
.acc summary{
  list-style:none; cursor:pointer; padding:20px 24px; font-weight:700; font-size:16.5px; color:var(--grass-900);
  display:flex; align-items:center; gap:14px; justify-content:space-between;
}
.acc summary::-webkit-details-marker{ display:none; }
.acc summary .q-idx{ flex:none; width:26px; height:26px; border-radius:8px; background:var(--grass-100); color:var(--grass-700); display:grid; place-items:center; font-size:12.5px; font-weight:700; font-family:var(--font-body); }
.acc summary .plus{ flex:none; width:22px; height:22px; position:relative; }
.acc summary .plus::before,.acc summary .plus::after{ content:""; position:absolute; inset:50% 0 auto 0; height:2px; background:var(--grass-600); border-radius:2px; transform:translateY(-50%); transition:transform .3s var(--ease); }
.acc summary .plus::after{ transform:translateY(-50%) rotate(90deg); }
.acc[open] summary .plus::after{ transform:translateY(-50%) rotate(0deg); }
.acc__body{ padding:0 24px 22px 64px; color:var(--ink-soft); font-size:15px; }
.acc__body p + p{ margin-top:10px; }

/* ---------- 14. CTA 横幅 ---------- */
.cta-band{
  position:relative; overflow:hidden; border-radius:var(--radius-l);
  background:linear-gradient(135deg,var(--grass-800),var(--grass-600) 60%,var(--grass-500));
  color:#fff; padding:62px 46px; text-align:center; box-shadow:var(--shadow-lg);
}
.cta-band::before{ content:""; position:absolute; inset:0; background-image:var(--grain); opacity:.08; }
.cta-band h2{ color:#fff; font-size:clamp(26px,3.2vw,40px); position:relative; }
.cta-band p{ color:rgba(255,255,255,.86); margin-top:14px; position:relative; }
.cta-band .btn-group{ margin-top:30px; position:relative; }
.cta-band .btn--line{ --btn-fg:#fff; border-color:rgba(255,255,255,.44); }
.cta-band .btn--line:hover{ background:rgba(255,255,255,.14); }

/* ---------- 15. 页脚 ---------- */
.footer{ background:var(--grass-900); color:rgba(255,255,255,.7); padding:66px 0 30px; margin-top:20px; }
.footer a:hover{ color:#fff; }
.footer__grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:36px; }
.footer__brand{ display:flex; align-items:center; gap:12px; color:#fff; font-family:var(--font-serif); font-size:20px; font-weight:700; margin-bottom:16px; }
.footer__brand .brand__mark{ box-shadow:none; }
.footer p{ font-size:14px; line-height:1.8; }
.footer h4{ color:#fff; font-family:var(--font-body); font-size:13px; letter-spacing:.14em; text-transform:uppercase; margin-bottom:16px; opacity:.85; }
.footer ul{ display:grid; gap:11px; font-size:14px; }
.footer__bottom{ margin-top:44px; padding-top:24px; border-top:1px solid rgba(255,255,255,.12); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:13px; }
.footer__bottom span{ opacity:.7; }

/* ---------- 16. 回到顶部 ---------- */
.to-top{
  position:fixed; right:26px; bottom:26px; z-index:180;
  width:48px; height:48px; border-radius:15px; border:1px solid var(--line);
  background:var(--paper); color:var(--grass-700);
  display:grid; place-items:center; box-shadow:var(--shadow);
  opacity:0; transform:translateY(14px); pointer-events:none;
  transition:opacity .3s var(--ease), transform .3s var(--ease);
}
.to-top.is-show{ opacity:1; transform:none; pointer-events:auto; }
.to-top:hover{ background:var(--grass-700); color:#fff; }

/* ---------- 17. 弹窗 ---------- */
.modal{ position:fixed; inset:0; z-index:300; display:grid; place-items:center; padding:24px; opacity:0; pointer-events:none; transition:opacity .28s var(--ease); }
.modal.is-open{ opacity:1; pointer-events:auto; }
.modal__mask{ position:absolute; inset:0; background:rgba(13,26,9,.55); backdrop-filter:blur(4px); }
.modal__box{
  position:relative; width:min(520px,100%); background:var(--cream); border-radius:var(--radius);
  padding:34px; box-shadow:var(--shadow-lg); border:1px solid var(--line-soft);
  transform:translateY(16px) scale(.97); transition:transform .32s var(--ease);
}
.modal.is-open .modal__box{ transform:none; }
.modal__box h3{ font-size:23px; margin-bottom:12px; }
.modal__close{ position:absolute; top:16px; right:16px; width:36px; height:36px; border-radius:11px; border:1px solid var(--line); background:rgba(255,255,255,.8); display:grid; place-items:center; color:var(--ink-soft); }
.modal__close:hover{ color:var(--grass-800); }
.modal__list{ display:grid; gap:10px; margin-top:18px; font-size:14.5px; color:var(--ink-soft); }
.modal__list li{ display:flex; gap:10px; align-items:flex-start; }
.modal__list svg{ width:19px; height:19px; color:var(--grass-600); flex:none; margin-top:3px; }

/* ---------- 18. 滚动显现 ---------- */
[data-reveal]{ opacity:0; transform:translateY(26px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
[data-reveal].is-in{ opacity:1; transform:none; }
.no-js [data-reveal]{ opacity:1; transform:none; }

/* ---------- 19. 响应式 ---------- */
@media (max-width:1024px){
  .hero__grid{ grid-template-columns:1fr; gap:44px; }
  .phone-stage{ order:-1; }
  .grid--4{ grid-template-columns:repeat(2,1fr); }
  .split{ grid-template-columns:1fr; gap:34px; }
  .split--rev .split__media{ order:0; }
  .footer__grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:820px){
  .nav__links,.nav__cta{ display:none; }
  .burger{ display:flex; }
  .section{ padding:70px 0; }
  .grid--3{ grid-template-columns:1fr; }
  .stats{ grid-template-columns:repeat(2,1fr); }
  .cta-band{ padding:46px 24px; }
}
@media (max-width:560px){
  .wrap{ width:calc(100% - 32px); }
  .grid--4,.grid--2{ grid-template-columns:1fr; }
  .footer__grid{ grid-template-columns:1fr; gap:28px; }
  .qr-box{ flex-direction:column; text-align:center; }
  .acc__body{ padding-left:24px; }
}
@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  [data-reveal]{ opacity:1; transform:none; }
}