Accueil Explorer Aide
S'inscrire Connexion
liaoxg
/
cfc
1
1
Fork 0
Fichiers Tickets 0 Pull Requests 0 Wiki
Aborescence: 8e945bd026
Branches Tags
cfc
/
web
/
cardio-cerebro.html

cardio-cerebro.html 68 KB
Historique Raw

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117 
  1. <!DOCTYPE html>
    2. 

  2. <html lang="zh-CN">
    3. 

  3. <head>
    4. 

  4. <meta charset="UTF-8">
    5. 

  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
    6. 

  6. <meta name="description" content="心脑血管疾病科学循证科普——症状识别、疾病定义、发病原因与主动健康五步干预。含肠道菌群-TMAO轴、富氢水内皮修复、中国心血管流行病学数据。">
    7. 

  7. <meta name="keywords" content="心脑血管疾病,动脉粥样硬化,胸痛,脑卒中,高血压,肠道菌群,TMAO,富氢水,主动健康,心血管预防">
    8. 

  8. <meta property="og:title" content="心脑血管疾病的症状、病因与主动健康干预 — 科学循证">
    9. 

  9. <meta property="og:description" content="中国心血管患病3.45亿。症状识别→疾病机制→危险因素→主动健康五步：提前识别、风险管控、主动干预、效果评估、持续优化。">
    10. 

  10. <meta property="og:type" content="article">
    11. 

  11. <title>心脑血管疾病 · 症-病-因与主动健康干预 · 浠艾福</title>
    12. 

  12. <style>
    13. 

  13.   :root {
    14. 

  14.     --bg-card: #FFFFFF;
    15. 

  15.     --bg-alt: #f8f5ff;
    16. 

  16.     --text-primary: #1a1a2e;
    17. 

  17.     --text-secondary: #4a5568;
    18. 

  18.     --text-muted: #718096;
    19. 

  19.     --accent: #c0392b;
    20. 

  20.     --accent-light: #fdf2f2;
    21. 

  21.     --blue: #1a5276;
    22. 

  22.     --blue-light: #eaf4fb;
    23. 

  23.     --teal: #148f77;
    24. 

  24.     --teal-light: #e6fffa;
    25. 

  25.     --purple: #7d3c98;
    26. 

  26.     --purple-light: #f5eef8;
    27. 

  27.     --orange: #d35400;
    28. 

  28.     --orange-light: #fff4e6;
    29. 

  29.     --font: system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
    30. 

  30.     --max-width: 1080px;
    31. 

  31.     --shadow-card: 0 4px 24px rgba(0,0,0,0.08);
    32. 

  32.     --shadow-hover: 0 8px 40px rgba(0,0,0,0.12);
    33. 

  33.     --radius: 16px;
    34. 

  34.   }
    35. 

  35.   * { margin: 0; padding: 0; box-sizing: border-box; }
    36. 

  36.   html { scroll-behavior: smooth; }
    37. 

  37.   body {
    38. 

  38.     font-family: var(--font);
    39. 

  39.     font-size: 1rem;
    40. 

  40.     line-height: 1.8;
    41. 

  41.     color: var(--text-primary);
    42. 

  42.     background: #fff;
    43. 

  43.     -webkit-font-smoothing: antialiased;
    44. 

  44.   }
    45. 

  45. 

  46.   /* HERO */
    47. 

  47.   .hero {
    48. 

  48.     position: relative;
    49. 

  49.     background: linear-gradient(135deg, #2d1b3d 0%, #4a1942 40%, #6b2d5b 100%);
    50. 

  50.     color: white;
    51. 

  51.     padding: 6rem 1.5rem 4rem;
    52. 

  52.     overflow: hidden;
    53. 

  53.     min-height: 58vh;
    54. 

  54.     display: flex;
    55. 

  55.     align-items: center;
    56. 

  56.   }
    57. 

  57.   .hero::before {
    58. 

  58.     content: '';
    59. 

  59.     position: absolute;
    60. 

  60.     inset: 0;
    61. 

  61.     background:
    62. 

  62.       radial-gradient(circle at 20% 30%, rgba(192,57,43,0.15) 0%, transparent 50%),
    63. 

  63.       radial-gradient(circle at 80% 70%, rgba(20,143,119,0.1) 0%, transparent 50%);
    64. 

  64.   }
    65. 

  65.   .hero-particles { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
    66. 

  66.   .particle {
    67. 

  67.     position: absolute;
    68. 

  68.     border-radius: 50%;
    69. 

  69.     background: rgba(255,255,255,0.1);
    70. 

  70.     animation: float 8s ease-in-out infinite;
    71. 

  71.   }
    72. 

  72.   .particle:nth-child(1) { width:4px;height:4px;left:10%;top:20%;animation-delay:0s; }
    73. 

  73.   .particle:nth-child(2) { width:8px;height:8px;left:25%;top:60%;animation-delay:1s;opacity:0.08; }
    74. 

  74.   .particle:nth-child(3) { width:5px;height:5px;left:45%;top:15%;animation-delay:2s; }
    75. 

  75.   .particle:nth-child(4) { width:3px;height:3px;left:65%;top:70%;animation-delay:0.5s; }
    76. 

  76.   .particle:nth-child(5) { width:7px;height:7px;left:80%;top:30%;animation-delay:3s;opacity:0.06; }
    77. 

  77.   .particle:nth-child(6) { width:4px;height:4px;left:15%;top:85%;animation-delay:1.5s; }
    78. 

  78.   .particle:nth-child(7) { width:9px;height:9px;left:55%;top:45%;animation-delay:2.5s;opacity:0.1; }
    79. 

  79.   @keyframes float {
    80. 

  80.     0%,100% { transform: translateY(0) scale(1); opacity: 0.1; }
    81. 

  81.     50% { transform: translateY(-30px) scale(1.5); opacity: 0.22; }
    82. 

  82.   }
    83. 

  83.   .hero-content {
    84. 

  84.     position: relative;
    85. 

  85.     z-index: 1;
    86. 

  86.     max-width: var(--max-width);
    87. 

  87.     margin: 0 auto;
    88. 

  88.     text-align: center;
    89. 

  89.     width: 100%;
    90. 

  90.   }
    91. 

  91.   .hero-badge {
    92. 

  92.     display: inline-flex;
    93. 

  93.     align-items: center;
    94. 

  94.     gap: 0.5rem;
    95. 

  95.     background: rgba(255,255,255,0.1);
    96. 

  96.     border: 1px solid rgba(255,255,255,0.2);
    97. 

  97.     backdrop-filter: blur(8px);
    98. 

  98.     padding: 0.4rem 1rem;
    99. 

  99.     border-radius: 100px;
    100. 

  100.     font-size: 0.85rem;
    101. 

  101.     margin-bottom: 1.5rem;
    102. 

  102.   }
    103. 

  103.   .hero h1 {
    104. 

  104.     font-size: clamp(1.8rem, 5vw, 3rem);
    105. 

  105.     font-weight: 800;
    106. 

  106.     margin-bottom: 1rem;
    107. 

  107.     letter-spacing: -0.02em;
    108. 

  108.     line-height: 1.25;
    109. 

  109.   }
    110. 

  110.   .hero h1 .accent { color: #e74c3c; }
    111. 

  111.   .hero-sub {
    112. 

  112.     font-size: clamp(1rem, 2vw, 1.15rem);
    113. 

  113.     color: rgba(255,255,255,0.8);
    114. 

  114.     max-width: 680px;
    115. 

  115.     margin: 0 auto 2rem;
    116. 

  116.     line-height: 1.7;
    117. 

  117.   }
    118. 

  118.   .hero-stats {
    119. 

  119.     display: flex;
    120. 

  120.     gap: 1.5rem;
    121. 

  121.     justify-content: center;
    122. 

  122.     flex-wrap: wrap;
    123. 

  123.     margin-top: 2rem;
    124. 

  124.   }
    125. 

  125.   .hero-stat {
    126. 

  126.     background: rgba(255,255,255,0.08);
    127. 

  127.     backdrop-filter: blur(8px);
    128. 

  128.     border: 1px solid rgba(255,255,255,0.1);
    129. 

  129.     border-radius: 12px;
    130. 

  130.     padding: 1rem 1.5rem;
    131. 

  131.     text-align: center;
    132. 

  132.     min-width: 120px;
    133. 

  133.   }
    134. 

  134.   .hero-stat .num { font-size: 1.9rem; font-weight: 800; color: #e74c3c; display: block; }
    135. 

  135.   .hero-stat .label { font-size: 0.82rem; color: rgba(255,255,255,0.7); margin-top: 0.2rem; }
    136. 

  136.   .scroll-hint {
    137. 

  137.     position: absolute;
    138. 

  138.     bottom: 2rem;
    139. 

  139.     left: 50%;
    140. 

  140.     transform: translateX(-50%);
    141. 

  141.     color: rgba(255,255,255,0.45);
    142. 

  142.     font-size: 0.78rem;
    143. 

  143.     text-align: center;
    144. 

  144.     animation: bounce 2s ease-in-out infinite;
    145. 

  145.     cursor: pointer;
    146. 

  146.     text-decoration: none;
    147. 

  147.     display: flex;
    148. 

  148.     flex-direction: column;
    149. 

  149.     align-items: center;
    150. 

  150.     gap: 0.3rem;
    151. 

  151.   }
    152. 

  152.   @keyframes bounce {
    153. 

  153.     0%,100% { transform: translateX(-50%) translateY(0); }
    154. 

  154.     50% { transform: translateX(-50%) translateY(8px); }
    155. 

  155.   }
    156. 

  156.   .scroll-arrow {
    157. 

  157.     width: 16px; height: 16px;
    158. 

  158.     border-right: 2px solid rgba(255,255,255,0.4);
    159. 

  159.     border-bottom: 2px solid rgba(255,255,255,0.4);
    160. 

  160.     transform: rotate(45deg);
    161. 

  161.   }
    162. 

  162. 

  163.   /* NAV */
    164. 

  164.   .nav {
    165. 

  165.     position: sticky;
    166. 

  166.     top: 0;
    167. 

  167.     z-index: 100;
    168. 

  168.     background: rgba(255,255,255,0.96);
    169. 

  169.     backdrop-filter: blur(12px);
    170. 

  170.     border-bottom: 1px solid rgba(0,0,0,0.06);
    171. 

  171.     padding: 0.75rem 1.5rem;
    172. 

  172.   }
    173. 

  173.   .nav-inner {
    174. 

  174.     max-width: var(--max-width);
    175. 

  175.     margin: 0 auto;
    176. 

  176.     display: flex;
    177. 

  177.     align-items: center;
    178. 

  178.     justify-content: space-between;
    179. 

  179.     gap: 1rem;
    180. 

  180.     flex-wrap: wrap;
    181. 

  181.   }
    182. 

  182.   .nav-brand {
    183. 

  183.     font-weight: 700;
    184. 

  184.     font-size: 0.95rem;
    185. 

  185.     color: var(--accent);
    186. 

  186.     text-decoration: none;
    187. 

  187.     display: flex;
    188. 

  188.     align-items: center;
    189. 

  189.     gap: 0.4rem;
    190. 

  190.   }
    191. 

  191.   .nav-links {
    192. 

  192.     display: flex;
    193. 

  193.     gap: 0.3rem;
    194. 

  194.     flex-wrap: wrap;
    195. 

  195.     list-style: none;
    196. 

  196.   }
    197. 

  197.   .nav-links a {
    198. 

  198.     color: var(--text-secondary);
    199. 

  199.     text-decoration: none;
    200. 

  200.     font-size: 0.85rem;
    201. 

  201.     padding: 0.3rem 0.7rem;
    202. 

  202.     border-radius: 8px;
    203. 

  203.     transition: all 0.2s;
    204. 

  204.   }
    205. 

  205.   .nav-links a:hover { background: var(--accent-light); color: var(--accent); }
    206. 

  206.   .nav-links a.active { background: var(--accent-light); color: var(--accent); font-weight: 600; }
    207. 

  207. 

  208.   /* LAYOUT */
    209. 

  209.   .container { max-width: var(--max-width); margin: 0 auto; padding: 0 1.5rem; }
    210. 

  210.   .section { padding: 4rem 0; border-bottom: 1px solid #eee; }
    211. 

  211.   .section:last-of-type { border-bottom: none; }
    212. 

  212.   .section-alt { background: var(--bg-alt); }
    213. 

  213.   .section-tag {
    214. 

  214.     display: inline-flex;
    215. 

  215.     align-items: center;
    216. 

  216.     gap: 0.4rem;
    217. 

  217.     font-size: 0.72rem;
    218. 

  218.     font-weight: 700;
    219. 

  219.     letter-spacing: 0.1em;
    220. 

  220.     text-transform: uppercase;
    221. 

  221.     color: var(--accent);
    222. 

  222.     margin-bottom: 0.75rem;
    223. 

  223.   }
    224. 

  224.   .section-tag.purple { color: var(--purple); }
    225. 

  225.   .section-tag.teal { color: var(--teal); }
    226. 

  226.   .section-tag.blue { color: var(--blue); }
    227. 

  227.   .section-tag.orange { color: var(--orange); }
    228. 

  228.   .section-tag.green { color: var(--teal); }
    229. 

  229.   .section-title {
    230. 

  230.     font-size: clamp(1.4rem, 3vw, 2.1rem);
    231. 

  231.     font-weight: 800;
    232. 

  232.     margin-bottom: 1rem;
    233. 

  233.     line-height: 1.3;
    234. 

  234.   }
    235. 

  235.   .section-intro {
    236. 

  236.     font-size: 1.05rem;
    237. 

  237.     color: var(--text-secondary);
    238. 

  238.     margin-bottom: 2rem;
    239. 

  239.     max-width: 820px;
    240. 

  240.     line-height: 1.85;
    241. 

  241.   }
    242. 

  242. 

  243.   /* GRID */
    244. 

  244.   .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
    245. 

  245.   .grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
    246. 

  246.   @media (max-width: 768px) { .grid-2, .grid-3 { grid-template-columns: 1fr; } }
    247. 

  247. 

  248.   /* CARDS */
    249. 

  249.   .card {
    250. 

  250.     background: var(--bg-card);
    251. 

  251.     border-radius: var(--radius);
    252. 

  252.     padding: 1.75rem;
    253. 

  253.     box-shadow: var(--shadow-card);
    254. 

  254.     border: 1px solid rgba(0,0,0,0.04);
    255. 

  255.     transition: transform 0.2s, box-shadow 0.2s;
    256. 

  256.   }
    257. 

  257.   .card:hover { transform: translateY(-2px); box-shadow: var(--shadow-hover); }
    258. 

  258.   .card-icon { font-size: 2.4rem; margin-bottom: 0.75rem; display: block; }
    259. 

  259.   .card h3 { font-size: 1.1rem; font-weight: 700; margin-bottom: 0.6rem; }
    260. 

  260.   .card p { color: var(--text-secondary); font-size: 0.92rem; line-height: 1.75; }
    261. 

  261.   .card-accent { border-left: 4px solid var(--accent); }
    262. 

  262.   .card-blue { border-left: 4px solid var(--blue); }
    263. 

  263.   .card-teal { border-left: 4px solid var(--teal); }
    264. 

  264.   .card-purple { border-left: 4px solid var(--purple); }
    265. 

  265.   .card-orange { border-left: 4px solid var(--orange); }
    266. 

  266. 

  267.   /* STAT ROW */
    268. 

  268.   .stat-row { display: flex; gap: 1.5rem; flex-wrap: wrap; margin: 1.5rem 0; }
    269. 

  269.   .stat-block {
    270. 

  270.     flex: 1;
    271. 

  271.     min-width: 110px;
    272. 

  272.     background: var(--bg-alt);
    273. 

  273.     border-radius: 12px;
    274. 

  274.     padding: 1.1rem 1.25rem;
    275. 

  275.     text-align: center;
    276. 

  276.   }
    277. 

  277.   .stat-block .number { font-size: 1.7rem; font-weight: 800; color: var(--accent); display: block; }
    278. 

  278.   .stat-block .number.blue { color: var(--blue); }
    279. 

  279.   .stat-block .number.teal { color: var(--teal); }
    280. 

  280.   .stat-block .number.purple { color: var(--purple); }
    281. 

  281.   .stat-block .number.orange { color: var(--orange); }
    282. 

  282.   .stat-block .unit { font-size: 0.72rem; color: var(--text-muted); display: block; margin-top: 0.15rem; }
    283. 

  283.   .stat-block .desc { font-size: 0.82rem; color: var(--text-secondary); margin-top: 0.35rem; }
    284. 

  284. 

  285.   /* EVIDENCE BOX */
    286. 

  286.   .evidence-box {
    287. 

  287.     background: linear-gradient(135deg, #fdf2f2 0%, #fff9f0 100%);
    288. 

  288.     border: 1px solid rgba(192,57,43,0.12);
    289. 

  289.     border-radius: 12px;
    290. 

  290.     padding: 1.4rem 1.7rem;
    291. 

  291.     margin: 1.75rem 0;
    292. 

  292.     position: relative;
    293. 

  293.     overflow: hidden;
    294. 

  294.   }
    295. 

  295.   .evidence-box::before {
    296. 

  296.     content: '🔬';
    297. 

  297.     position: absolute;
    298. 

  298.     top: -0.5rem;
    299. 

  299.     right: 1rem;
    300. 

  300.     font-size: 3.5rem;
    301. 

  301.     opacity: 0.06;
    302. 

  302.   }
    303. 

  303.   .evidence-box.blue {
    304. 

  304.     background: linear-gradient(135deg, #eaf4fb 0%, #e8f4f8 100%);
    305. 

  305.     border-color: rgba(26,82,118,0.12);
    306. 

  306.   }
    307. 

  307.   .evidence-box.green {
    308. 

  308.     background: linear-gradient(135deg, #e6fffa 0%, #f0fff4 100%);
    309. 

  309.     border-color: rgba(20,143,119,0.12);
    310. 

  310.   }
    311. 

  311.   .evidence-box.purple {
    312. 

  312.     background: linear-gradient(135deg, #f5eef8 0%, #faf5ff 100%);
    313. 

  313.     border-color: rgba(125,60,152,0.12);
    314. 

  314.   }
    315. 

  315.   .evidence-box-header { display: flex; align-items: center; gap: 0.4rem; margin-bottom: 0.65rem; flex-wrap: wrap; }
    316. 

  316.   .evidence-box-title { font-weight: 700; font-size: 0.97rem; color: var(--accent); }
    317. 

  317.   .evidence-box.blue .evidence-box-title { color: var(--blue); }
    318. 

  318.   .evidence-box.green .evidence-box-title { color: var(--teal); }
    319. 

  319.   .evidence-box.purple .evidence-box-title { color: var(--purple); }
    320. 

  320.   .evidence-box p { color: var(--text-secondary); font-size: 0.92rem; line-height: 1.75; margin-bottom: 0.4rem; }
    321. 

  321.   .evidence-box p:last-child { margin-bottom: 0; }
    322. 

  322.   .ev-tag {
    323. 

  323.     display: inline-block;
    324. 

  324.     font-size: 0.68rem;
    325. 

  325.     font-weight: 700;
    326. 

  326.     padding: 0.18rem 0.55rem;
    327. 

  327.     border-radius: 100px;
    328. 

  328.     background: rgba(192,57,43,0.1);
    329. 

  329.     color: var(--accent);
    330. 

  330.     margin-right: 0.3rem;
    331. 

  331.     margin-top: 0.25rem;
    332. 

  332.   }
    333. 

  333.   .ev-tag.blue { background: rgba(26,82,118,0.1); color: var(--blue); }
    334. 

  334.   .ev-tag.green { background: rgba(20,143,119,0.1); color: var(--teal); }
    335. 

  335.   .ev-tag.purple { background: rgba(125,60,152,0.1); color: var(--purple); }
    336. 

  336.   .ev-tag.orange { background: rgba(211,84,0,0.1); color: var(--orange); }
    337. 

  337. 

  338.   /* PROCESS STEPS */
    339. 

  339.   .process-steps { display: flex; flex-direction: column; gap: 1rem; margin: 1.5rem 0; }
    340. 

  340.   .process-step { display: flex; gap: 1.25rem; align-items: flex-start; }
    341. 

  341.   .step-num {
    342. 

  342.     flex-shrink: 0;
    343. 

  343.     width: 2rem; height: 2rem;
    344. 

  344.     background: var(--accent-light);
    345. 

  345.     color: var(--accent);
    346. 

  346.     border-radius: 50%;
    347. 

  347.     display: flex;
    348. 

  348.     align-items: center;
    349. 

  349.     justify-content: center;
    350. 

  350.     font-weight: 800;
    351. 

  351.     font-size: 0.88rem;
    352. 

  352.   }
    353. 

  353.   .step-num.blue { background: var(--blue-light); color: var(--blue); }
    354. 

  354.   .step-num.teal { background: var(--teal-light); color: var(--teal); }
    355. 

  355.   .step-num.purple { background: var(--purple-light); color: var(--purple); }
    356. 

  356.   .step-num.orange { background: var(--orange-light); color: var(--orange); }
    357. 

  357.   .step-num.green { background: var(--teal-light); color: var(--teal); }
    358. 

  358.   .step-content h4 { font-size: 0.98rem; font-weight: 700; margin-bottom: 0.28rem; color: var(--text-primary); }
    359. 

  359.   .step-content p { font-size: 0.88rem; color: var(--text-secondary); line-height: 1.7; }
    360. 

  360. 

  361.   /* QUOTE */
    362. 

  362.   .quote-block {
    363. 

  363.     background: var(--bg-alt);
    364. 

  364.     border-left: 4px solid var(--accent);
    365. 

  365.     border-radius: 0 12px 12px 0;
    366. 

  366.     padding: 1.4rem 1.7rem;
    367. 

  367.     margin: 1.75rem 0;
    368. 

  368.   }
    369. 

  369.   .quote-block.blue { border-left-color: var(--blue); }
    370. 

  370.   .quote-block.green { border-left-color: var(--teal); }
    371. 

  371.   .quote-block.purple { border-left-color: var(--purple); }
    372. 

  372.   .quote-text { font-size: 1.02rem; font-style: italic; color: var(--text-secondary); line-height: 1.8; margin-bottom: 0.65rem; }
    373. 

  373.   .quote-source { font-size: 0.82rem; color: var(--text-muted); font-weight: 600; }
    374. 

  374. 

  375.   /* LIST */
    376. 

  376.   .list-styled { list-style: none; padding: 0; margin: 1rem 0; }
    377. 

  377.   .list-styled li { padding: 0.45rem 0 0.45rem 1.7rem; position: relative; color: var(--text-secondary); font-size: 0.92rem; line-height: 1.7; }
    378. 

  378.   .list-styled li::before { content: '✔'; position: absolute; left: 0; color: var(--accent); font-weight: 700; font-size: 0.85rem; top: 0.45rem; }
    379. 

  379.   .list-styled.blue li::before { color: var(--blue); }
    380. 

  380.   .list-styled.green li::before { color: var(--teal); }
    381. 

  381. 

  382.   /* TABLE */
    383. 

  383.   .table-wrap { overflow-x: auto; margin: 1.5rem 0; }
    384. 

  384.   table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
    385. 

  385.   th { background: var(--accent-light); color: var(--accent); padding: 0.7rem 1rem; text-align: left; font-weight: 700; white-space: nowrap; }
    386. 

  386.   th.blue { background: var(--blue-light); color: var(--blue); }
    387. 

  387.   th.teal { background: var(--teal-light); color: var(--teal); }
    388. 

  388.   th.purple { background: var(--purple-light); color: var(--purple); }
    389. 

  389.   td { padding: 0.7rem 1rem; border-bottom: 1px solid #eee; color: var(--text-secondary); vertical-align: top; }
    390. 

  390.   tr:last-child td { border-bottom: none; }
    391. 

  391.   tr:hover td { background: #fafafa; }
    392. 

  392. 

  393.   /* STEP FLOW */
    394. 

  394.   .step-flow { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 0.5rem; margin: 2rem 0; }
    395. 

  395.   .step-flow-item {
    396. 

  396.     background: white;
    397. 

  397.     border: 2px solid var(--accent);
    398. 

  398.     border-radius: 12px;
    399. 

  399.     padding: 0.85rem 1.4rem;
    400. 

  400.     text-align: center;
    401. 

  401.     min-width: 150px;
    402. 

  402.     box-shadow: var(--shadow-card);
    403. 

  403.   }
    404. 

  404.   .step-flow-item.blue { border-color: var(--blue); }
    405. 

  405.   .step-flow-item.teal { border-color: var(--teal); }
    406. 

  406.   .step-flow-item.purple { border-color: var(--purple); }
    407. 

  407.   .step-flow-item.orange { border-color: var(--orange); }
    408. 

  408.   .step-flow-item.green { border-color: var(--teal); }
    409. 

  409.   .step-flow-item .s-num { font-size: 0.72rem; font-weight: 700; color: var(--accent); display: block; margin-bottom: 0.2rem; }
    410. 

  410.   .step-flow-item.blue .s-num { color: var(--blue); }
    411. 

  411.   .step-flow-item.teal .s-num, .step-flow-item.green .s-num { color: var(--teal); }
    412. 

  412.   .step-flow-item.purple .s-num { color: var(--purple); }
    413. 

  413.   .step-flow-item.orange .s-num { color: var(--orange); }
    414. 

  414.   .step-flow-item .s-title { font-size: 0.9rem; font-weight: 700; color: var(--text-primary); display: block; }
    415. 

  415.   .step-flow-arrow { font-size: 1.2rem; color: #ccc; }
    416. 

  416. 

  417.   /* CTA */
    418. 

  418.   .cta-section {
    419. 

  419.     background: linear-gradient(135deg, #2d1b3d 0%, #4a1942 100%);
    420. 

  420.     color: white;
    421. 

  421.     padding: 4rem 1.5rem;
    422. 

  422.     text-align: center;
    423. 

  423.   }
    424. 

  424.   .cta-section h2 { font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 800; margin-bottom: 0.9rem; }
    425. 

  425.   .cta-section p { color: rgba(255,255,255,0.78); max-width: 580px; margin: 0 auto 2rem; font-size: 1rem; line-height: 1.7; }
    426. 

  426.   .cta-buttons { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
    427. 

  427.   .btn { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.72rem 1.6rem; border-radius: 100px; font-size: 0.92rem; font-weight: 700; text-decoration: none; transition: all 0.2s; cursor: pointer; border: none; }
    428. 

  428.   .btn-primary { background: var(--accent); color: white; }
    429. 

  429.   .btn-primary:hover { background: #a93226; transform: translateY(-1px); }
    430. 

  430.   .btn-outline { background: transparent; color: white; border: 2px solid rgba(255,255,255,0.38); }
    431. 

  431.   .btn-outline:hover { border-color: white; background: rgba(255,255,255,0.1); }
    432. 

  432. 

  433.   /* Footer styles replaced by shared js/footer.js */
    434. 

  434. 

  435.   /* CITATIONS */
    436. 

  436.   .citations { background: #f8f8f8; border-top: 2px solid var(--accent); padding: 3rem 0; }
    437. 

  437.   .citation-card { background: white; border: 1px solid #eee; border-radius: 12px; padding: 1.2rem 1.5rem; margin-bottom: 0.9rem; }
    438. 

  438.   .citation-card .source { font-size: 0.83rem; font-weight: 700; color: var(--text-primary); margin-bottom: 0.35rem; }
    439. 

  439.   .citation-card .auth-row { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-bottom: 0.4rem; }
    440. 

  440.   .auth-badge { display: inline-flex; align-items: center; gap: 0.25rem; font-size: 0.7rem; font-weight: 700; padding: 0.2rem 0.6rem; border-radius: 100px; background: #fde8e8; color: #c0392b; }
    441. 

  441.   .auth-badge.blue { background: #eaf4fb; color: #1a5276; }
    442. 

  442.   .auth-badge.green { background: #e6fffa; color: #148f77; }
    443. 

  443.   .auth-badge.purple { background: #f5eef8; color: #7d3c98; }
    444. 

  444.   .citation-card .findings { font-size: 0.85rem; color: var(--text-secondary); line-height: 1.65; margin-bottom: 0.35rem; }
    445. 

  445.   .citation-card .trans { font-size: 0.78rem; color: var(--text-muted); font-style: italic; margin-bottom: 0.35rem; }
    446. 

  446.   .citation-card .link { font-size: 0.78rem; color: var(--blue); text-decoration: none; }
    447. 

  447.   .citation-card .link:hover { text-decoration: underline; }
    448. 

  448. 

  449.   .anchor { scroll-margin-top: 72px; }
    450. 

  450. 

  451.   .shot-placeholder {
    452. 

  452.     background: linear-gradient(135deg,#f0f0f0,#e5e5e5);
    453. 

  453.     border-radius: 12px;
    454. 

  454.     display: flex;
    455. 

  455.     flex-direction: column;
    456. 

  456.     align-items: center;
    457. 

  457.     justify-content: center;
    458. 

  458.     min-height: 180px;
    459. 

  459.     color: #aaa;
    460. 

  460.     font-size: 0.85rem;
    461. 

  461.     gap: 0.4rem;
    462. 

  462.     margin: 1.25rem 0;
    463. 

  463.   }
    464. 

  464.   .shot-placeholder .shot-icon { font-size: 2.2rem; opacity: 0.35; }
    465. 

  465. </style>
    466. 

  466. </head>
    467. 

  467. <body>
    468. 

  468. 

  469. <!-- HERO -->
    470. 

  470. <section class="hero">
    471. 

  471.   <div class="hero-particles">
    472. 

  472.     <div class="particle"></div><div class="particle"></div><div class="particle"></div>
    473. 

  473.     <div class="particle"></div><div class="particle"></div><div class="particle"></div><div class="particle"></div>
    474. 

  474.   </div>
    475. 

  475.   <div class="hero-content">
    476. 

  476.     <div class="hero-badge">❤️ 科学循证 · 主动健康</div>
    477. 

  477.     <h1>心脑血管疾病<br><span class="accent">症·病·因与主动健康干预</span></h1>
    478. 

  478.     <p class="hero-sub">中国心血管现患3.45亿，高血压2.45亿。<br>理解症状信号 → 掌握核心病理 → 识别可控病因 → 建立主动健康五步干预闭环——<br>在基因给定的底牌上，通过科学干预改写疾病的结局。</p>
    479. 

  479.     <div class="hero-stats">
    480. 

  480.       <div class="hero-stat"><span class="num">3.45亿</span><span class="label">心血管现患人数</span></div>
    481. 

  481.       <div class="hero-stat"><span class="num">2.45亿</span><span class="label">高血压患者</span></div>
    482. 

  482.       <div class="hero-stat"><span class="num">458万</span><span class="label">年心血管病死亡</span></div>
    483. 

  483.       <div class="hero-stat"><span class="num">40%</span><span class="label">死亡归因占比</span></div>
    484. 

  484.     </div>
    485. 

  485.   </div>
    486. 

  486.   <a href="#symptoms" class="scroll-hint">
    487. 

  487.     <span>开始阅读</span>
    488. 

  488.     <div class="scroll-arrow"></div>
    489. 

  489.   </a>
    490. 

  490. </section>
    491. 

  491. 

  492. <!-- NAV -->
    493. 

  493. <nav class="nav">
    494. 

  494.   <div class="nav-inner">
    495. 

  495.     <a href="index.html" class="nav-brand">❤️ 浠艾福 · 主动健康学院</a>
    496. 

  496.     <ul class="nav-links">
    497. 

  497.       <li><a href="#symptoms">症</a></li>
    498. 

  498.       <li><a href="#disease">病</a></li>
    499. 

  499.       <li><a href="#causes">因</a></li>
    500. 

  500.       <li><a href="#proactive">主动健康五步</a></li>
    501. 

  501.       <li><a href="#citations">参考文献</a></li>
    502. 

  502.     </ul>
    503. 

  503.   </div>
    504. 

  504. </nav>
    505. 

  505. 

  506. <!-- ══════════════════════════════════════════
    507. 

  507.      症 · 症状识别
    508. 

  508. ═══════════════════════════════════════════ -->
    509. 

  509. <section class="section" id="symptoms">
    510. 

  510.   <div class="container">
    511. 

  511.     <div class="section-tag">🔍 症 · 症状识别</div>
    512. 

  512.     <h2 class="section-title">读懂身体的求救信号——心脑血管疾病的早期症状</h2>
    513. 

  513.     <p class="section-intro">
    514. 

  514.       心脑血管疾病常被称"沉默的杀手"——高血压平时毫无症状，一旦发作却可致命；冠心病早期信号轻微，容易被忽视；脑卒中的FAST征象一旦出现需立即就医。理解这些症状，是主动健康的第一步：越早识别，干预窗口越宽，预后越好。
    515. 

  515.     </p>
    516. 

  516. 

  517.     <div class="grid-2">
    518. 

  518.       <div class="card card-accent">
    519. 

  519.         <span class="card-icon">💔</span>
    520. 

  520.         <h3>冠心病的典型症状</h3>
    521. 

  521.         <p><strong>稳定型心绞痛：</strong>胸部压迫感、紧缩感或憋闷，多在运动、情绪激动、饱餐后出现，休息或含服硝酸甘油后2-5分钟内缓解。部位常为胸骨后，可放射至左肩、左臂、颈部、下颌。</p>
    522. 

  522.         <p style="margin-top:0.6rem;"><strong>不稳定性心绞痛：</strong>静息时也发作，或发作频率增加、持续时间延长、程度加重——这是心肌梗死的预警信号，需立即就医。</p>
    523. 

  523.         <p style="margin-top:0.6rem;"><strong>急性心肌梗死（AMI）：</strong>持续性剧烈胸痛>20分钟，伴大汗淋漓、恶心呕吐、濒死感，含服硝酸甘油无效。老年、糖尿病患者的症状可能不典型（无痛性心梗），仅表现为呼吸困难或乏力。</p>
    524. 

  524.       </div>
    525. 

  525.       <div class="card card-blue">
    526. 

  526.         <span class="card-icon">🧠</span>
    527. 

  527.         <h3>脑卒中的早期信号（FAST原则）</h3>
    528. 

  528.         <p><strong>F · Face（面部）</strong>：笑时口角歪斜，歪向一侧；<strong>A · Arm（手臂）</strong>：双平举时一侧手臂下垂；<strong>S · Speech（语言）</strong>：说话含糊不清、听不懂别人说话；<strong>T · Time（时间）</strong>：立即拨打120，时间就是大脑。</p>
    529. 

  529.         <p style="margin-top:0.6rem;"><strong>其他预警信号：</strong>突发剧烈头痛（出血性脑卒中）；突发单眼或双眼视物模糊；突发行走不稳、眩晕；突发意识丧失或抽搐。出现上述任何症状，即使短暂缓解也要立即就医——"小中风"（TIA，短暂性脑缺血发作）后7天内发生完全性卒中的风险高达10%。</p>
    530. 

  530.       </div>
    531. 

  531.     </div>
    532. 

  532. 

  533.     <div class="grid-3" style="margin-top:1.5rem;">
    534. 

  534.       <div class="card card-teal">
    535. 

  535.         <span class="card-icon">🩺</span>
    536. 

  536.         <h3>高血压的"沉默"信号</h3>
    537. 

  537.         <p>大多数高血压患者<strong>毫无症状</strong>。约10%患者可能出现：头晕（尤其突然站立时）、头胀痛（后颈部、前额为著）、眼花、耳鸣、失眠、疲乏感。这些症状不特异，常被误认为"疲劳"或"年龄大了"。</p>
    538. 

  538.         <p style="margin-top:0.5rem;"><strong>警告：</strong>当高血压患者出现头痛、恶心呕吐、视物模糊、鼻出血时，往往提示已经发生高血压急症（血压>180/120mmHg伴靶器官损害），需紧急降压。</p>
    539. 

  539.       </div>
    540. 

  540.       <div class="card card-purple">
    541. 

  541.         <span class="card-icon">😵</span>
    542. 

  542.         <h3>心衰的典型表现</h3>
    543. 

  543.         <p><strong>左心衰（肺循环淤血）：</strong>活动后呼吸困难（最早症状），夜间阵发性呼吸困难（睡到半夜憋醒，需坐起），端坐呼吸（平卧困难），咳嗽伴白色泡沫痰，严重时咯粉红色泡沫痰。</p>
    544. 

  544.         <p style="margin-top:0.5rem;"><strong>右心衰（体循环淤血）：</strong>双下肢水肿（下午加重，早晨减轻或消退），腹部饱胀、食欲下降，肝颈静脉怒张，尿量减少。</p>
    545. 

  545.       </div>
    546. 

  546.       <div class="card card-orange">
    547. 

  547.         <span class="card-icon">⚡</span>
    548. 

  548.         <h3>血管堵塞的隐匿信号</h3>
    549. 

  549.         <p>动脉粥样硬化可累及全身血管：<strong>颈动脉狭窄</strong>可导致头晕、记忆力下降、一过性黑矇；<strong>肾动脉狭窄</strong>导致难以控制的高血压和肾功能异常；<strong>下肢动脉硬化闭塞</strong>导致行走后腿痛（间歇性跛行），休息后缓解。</p>
    550. 

  550.         <p style="margin-top:0.5rem;"><strong>勃起功能障碍（ED）</strong>：男性阴茎动脉直径仅1-2mm，比冠脉更细，ED可能是全身动脉粥样硬化的早期"窗口"，是心血管疾病的独立预测因子。</p>
    551. 

  551.       </div>
    552. 

  552.     </div>
    553. 

  553. 

  554.     <div class="evidence-box blue" style="margin-top:2rem;">
    555. 

  555.       <div class="evidence-box-header">
    556. 

  556.         <span class="evidence-box-title">⚠️ 这些症状出现时，请立即就医</span>
    557. 

  557.       </div>
    558. 

  558.       <p>① 突发持续剧烈胸痛>15分钟，伴出汗、恶心、濒死感 → 疑似急性心肌梗死，呼叫120。<strong>研究显示，中国AMI患者从症状出现到入院平均耗时约3-4小时，延误治疗可导致心肌不可逆坏死。</strong></p>
    559. 

  559.       <p>② 突发口角歪斜、一侧肢体无力或麻木、言语不清 → 疑似脑卒中，溶栓时间窗（4.5小时内）和取栓时间窗（6小时内）错过将显著增加残疾风险。</p>
    560. 

  560.       <p>③ 突发剧烈头痛、呕吐、意识障碍 → 疑似脑出血，死亡率>40%，需立即CT确诊。</p>
    561. 

  561.       <p>④ 夜间呼吸困难、不能平卧、下肢重度水肿 → 急性心衰失代偿，需紧急住院治疗。</p>
    562. 

  562.     </div>
    563. 

  563. 

  564.   </div>
    565. 

  565. </section>
    566. 

  566. 

  567. <!-- ══════════════════════════════════════════
    568. 

  568.      病 · 疾病定义与病理
    569. 

  569. ═══════════════════════════════════════════ -->
    570. 

  570. <section class="section section-alt" id="disease">
    571. 

  571.   <div class="container">
    572. 

  572.     <div class="section-tag purple">📖 病 · 疾病定义</div>
    573. 

  573.     <h2 class="section-title">心脑血管疾病：核心病理与流行病学</h2>
    574. 

  574.     <p class="section-intro">
    575. 

  575.       心脑血管疾病是心脏和脑血管疾病的统称，涵盖冠心病、脑卒中、高血压、心力衰竭、风湿性心脏病、先天性心脏病及心肌病等。其共同核心病理基础是<strong>动脉粥样硬化</strong>——一种起始于内皮损伤、经数十年缓慢进展的慢性炎症性疾病。
    576. 

  576.     </p>
    577. 

  577. 

  578.     <div class="stat-row">
    579. 

  579.       <div class="stat-block">
    580. 

  580.         <span class="number">3.45亿</span>
    581. 

  581.         <span class="unit">人</span>
    582. 

  582.         <span class="desc">中国心血管现患人数</span>
    583. 

  583.       </div>
    584. 

  584.       <div class="stat-block">
    585. 

  585.         <span class="number blue">2.45亿</span>
    586. 

  586.         <span class="unit">人</span>
    587. 

  587.         <span class="desc">高血压患者</span>
    588. 

  588.       </div>
    589. 

  589.       <div class="stat-block">
    590. 

  590.         <span class="number teal">1300万</span>
    591. 

  591.         <span class="unit">人/年</span>
    592. 

  592.         <span class="desc">新增脑卒中患者</span>
    593. 

  593.       </div>
    594. 

  594.       <div class="stat-block">
    595. 

  595.         <span class="number orange">458万</span>
    596. 

  596.         <span class="unit">人/年</span>
    597. 

  597.         <span class="desc">心血管病死亡人数</span>
    598. 

  598.       </div>
    599. 

  599.     </div>
    600. 

  600.     <p style="color:var(--text-muted);font-size:0.82rem;margin-bottom:1.5rem;">
    601. 

  601.       数据来源：《中国心血管健康与疾病报告2024》｜城乡居民死亡原因首位，农村死亡占比46.74%，城市44.26%
    602. 

  602.     </p>
    603. 

  603. 

  604.     <div class="grid-2">
    605. 

  605.       <div class="card card-accent">
    606. 

  606.         <span class="card-icon">❤️</span>
    607. 

  607.         <h3>冠心病（CHD）</h3>
    608. 

  608.         <p>冠状动脉（为心肌供血的动脉）发生粥样硬化，导致管腔狭窄，心肌供血不足。中国冠心病患者约1139万。稳定型心绞痛在劳累时发作，休息或含硝酸甘油可缓解；不稳定型心绞痛在静息时也发作，反映斑块不稳定——这是急性心肌梗死的前兆。急性心肌梗死（AMI）是心肌供血完全中断导致心肌坏死，死亡率约5-10%（院外死亡占一半以上）。</p>
    609. 

  609.       </div>
    610. 

  610.       <div class="card card-blue">
    611. 

  611.         <span class="card-icon">🧠</span>
    612. 

  612.         <h3>脑卒中（Stroke）</h3>
    613. 

  613.         <p>分为缺血性（约占80%，脑梗死）和出血性（脑溢血）。缺血性脑卒中：脑血管被血栓或栓子堵塞导致脑组织缺血坏死，急性期可溶栓（4.5h内）或取栓（6-24h，需影像评估）。出血性脑卒中：脑血管破裂出血，脑组织直接受压损伤，死亡率>40%，主要病因是高血压性脑出血。中国脑卒中发病率约240/10万人年，显著高于发达国家。</p>
    614. 

  614.       </div>
    615. 

  615.     </div>
    616. 

  616. 

  617.     <h3 style="font-size:1.1rem;font-weight:700;margin:2rem 0 1rem;">⚙️ 核心病理：动脉粥样硬化的四步进程</h3>
    618. 

  618.     <div class="process-steps">
    619. 

  619.       <div class="process-step">
    620. 

  620.         <div class="step-num purple">①</div>
    621. 

  621.         <div class="step-content">
    622. 

  622.           <h4>内皮功能障碍——疾病起点</h4>
    623. 

  623.           <p>正常内皮细胞分泌一氧化氮（NO），维持血管舒张、抑制血小板聚集、防止炎症细胞粘附。高血压、高血糖、吸烟、高LDL-C、氧化应激均可损伤内皮，使其通透性增加。LDL-C颗粒穿透内膜进入内皮下层，内皮细胞开始表达粘附分子（VCAM-1、ICAM-1），吸引单核细胞进入血管壁。这一阶段在青少年时期就已开始。</p>
    624. 

  624.         </div>
    625. 

  625.       </div>
    626. 

  626.       <div class="process-step">
    627. 

  627.         <div class="step-num purple">②</div>
    628. 

  628.         <div class="step-content">
    629. 

  629.           <h4>氧化应激与炎症激活——进展加速</h4>
    630. 

  630.           <p>进入内皮下层的LDL-C被活性氧（ROS）氧化为ox-LDL——高度促炎的致病分子。ox-LDL促使内皮细胞释放IL-1β、IL-6、TNF-α，激活NLRP3炎症小体。单核细胞分化为巨噬细胞，通过清道夫受体（SR-A、CD36）大量摄取ox-LDL，形成<strong>泡沫细胞</strong>——粥样硬化斑块的"种子"。</p>
    631. 

  631.         </div>
    632. 

  632.       </div>
    633. 

  633.       <div class="process-step">
    634. 

  634.         <div class="step-num purple">③</div>
    635. 

  635.         <div class="step-content">
    636. 

  636.           <h4>斑块形成与管腔狭窄</h4>
    637. 

  637.           <p>泡沫细胞堆积形成脂质核心，血管平滑肌细胞迁移增值并分泌胶原纤维形成纤维帽。斑块向管腔突出导致血流受阻。当管腔狭窄>70%时，安静状态下即可出现心肌供血不足（稳定型心绞痛）。斑块内新生血管形成增加斑块不稳定风险。</p>
    638. 

  638.         </div>
    639. 

  639.       </div>
    640. 

  640.       <div class="process-step">
    641. 

  641.         <div class="step-num purple">④</div>
    642. 

  642.         <div class="step-content">
    643. 

  643.           <h4>斑块不稳定与急性事件</h4>
    644. 

  644.           <p>斑块破裂是急性冠脉综合征和脑卒中的直接触发因素。不稳定斑块特征：薄纤维帽（<65μm）、大脂质核心、显著炎症细胞浸润。斑块破裂后脂质核心内容物暴露于血液，触发凝血级联反应形成血栓——完全阻断冠脉血流导致心肌梗死，或随血流堵塞脑动脉导致缺血性脑卒中。</p>
    645. 

  645.         </div>
    646. 

  646.       </div>
    647. 

  647.     </div>
    648. 

  648. 

  649.     <div class="evidence-box" style="margin-top:2rem;">
    650. 

  650.       <div class="evidence-box-header">
    651. 

  651.         <span class="evidence-box-title">📊 动脉粥样硬化的分子标志物</span>
    652. 

  652.         <span class="ev-tag">RCT证据</span>
    653. 

  653.         <span class="ev-tag blue">临床指标</span>
    654. 

  654.       </div>
    655. 

  655.       <p><strong>ox-LDL</strong>（氧化低密度脂蛋白）：动脉粥样硬化的核心促炎分子，驱动泡沫细胞形成；<strong>hsCRP</strong>（超敏C反应蛋白）：全身低度炎症标志物，预测心血管事件风险，参考值<1mg/L（低风险），1-3mg/L（中风险），>3mg/L（高风险）；<strong>Lp(a)</strong>（脂蛋白a）：由基因决定的独立风险因子，浓度>300mg/L时心血管风险显著升高；<strong>MMP-9</strong>（基质金属蛋白酶-9）：降解纤维帽胶原，其水平升高提示斑块不稳定风险增加。</p>
    656. 

  656.       <p style="margin-top:0.5rem;color:var(--text-muted);font-style:italic;">CANTOS研究（NEJM 2017, doi:10.1056/NEJMoa1707914）首次证明：靶向IL-1β的Canakinumab抗炎治疗可降低心血管事件约15%（独立于降脂之外），开启了"心血管抗炎治疗"新纪元。</p>
    657. 

  657.     </div>
    658. 

  658. 

  659.     <div class="quote-block green" style="margin-top:1.5rem;">
    660. 

  660.       <p class="quote-text">"动脉粥样硬化是一种血管老化疾病。它从童年期启动，经数十年潜伏，在中年出现症状，老年导致残疾和死亡。每一个阶段都存在干预机会——早期干预成本最低、获益最大。"</p>
    661. 

  661.       <span class="quote-source">— 《生理学评论》2023 · 心血管遗传学与动脉粥样硬化综述 · doi:10.1152/physrev.00024.2022</span>
    662. 

  662.     </div>
    663. 

  663. 

  664.   </div>
    665. 

  665. </section>
    666. 

  666. 

  667. <!-- ══════════════════════════════════════════
    668. 

  668.      因 · 发病原因
    669. 

  669. ═══════════════════════════════════════════ -->
    670. 

  670. <section class="section" id="causes">
    671. 

  671.   <div class="container">
    672. 

  672.     <div class="section-tag orange">⚡ 因 · 发病原因</div>
    673. 

  673.     <h2 class="section-title">心脑血管疾病的九大可控病因</h2>
    674. 

  674.     <p class="section-intro">
    675. 

  675.       理解"病因"不只是为了诊断，更是为了找到干预靶点。INTERHEART研究（全球52国，30000人）证实：<strong>90%以上的心肌梗死归因于9个可改变的危险因素</strong>。这意味着心脑血管疾病在很大程度上是"生活方式病"——基因给定底牌，行为决定结局。
    676. 

  676.     </p>
    677. 

  677. 

  678.     <div class="evidence-box" style="margin-bottom:2rem;">
    679. 

  679.       <div class="evidence-box-header">
    680. 

  680.         <span class="evidence-box-title">📊 INTERHEART研究：九大危险因素的归因危险度（PAR）</span>
    681. 

  681.         <span class="ev-tag">⚕️ 全球52国 · n=15000病例+15000对照</span>
    682. 

  682.       </div>
    683. 

  683.       <p>① 血脂异常（apoB/apoA1比值升高）：<strong>PAR 49.2%</strong>——最大单一危险因素。<br>
    684. 

  684.       ② 吸烟：PAR 35.7%。<br>
    685. 

  685.       ③ 心理社会因素（压力/抑郁）：PAR 16.5%。<br>
    686. 

  686.       ④ 糖尿病：PAR 25.7%。<br>
    687. 

  687.       ⑤ 高血压：PAR 25.0%。<br>
    688. 

  688.       ⑥ 腹型肥胖：PAR 20.1%。<br>
    689. 

  689.       ⑦ 水果蔬菜摄入不足：PAR 13.7%。<br>
    690. 

  690.       ⑧ 缺乏运动：PAR 12.2%。<br>
    691. 

  691.       ⑨ 过量饮酒：PAR 5.0%。</p>
    692. 

  692.     </div>
    693. 

  693. 

  694.     <div class="grid-2">
    695. 

  695.       <div>
    696. 

  696.         <div class="card card-orange" style="margin-bottom:1.25rem;">
    697. 

  697.           <span class="card-icon">🧂</span>
    698. 

  698.           <h3>高钠饮食——高血压的头号推手</h3>
    699. 

  699.           <p>中国居民人均盐摄入约10.5g/天，是WHO推荐上限（5g）的2倍以上。高钠饮食直接升高血压，同时激活RAAS（肾素-血管紧张素-醛固酮系统），加重心脏负担，促进动脉粥样硬化。盐敏感者（人群中约30-50%）摄入高盐后血压升幅显著更大。</p>
    700. 

  700.           <p style="margin-top:0.5rem;"><strong>核心数据：</strong>每日盐摄入减少4.6g，收缩压平均降低约5mmHg（正常血压者）至约7mmHg（高血压患者）。TOHP研究15年随访显示，限盐组心血管事件风险降低约25%。</p>
    701. 

  701.         </div>
    702. 

  702. 

  703.         <div class="card card-orange" style="margin-bottom:1.25rem;">
    704. 

  704.           <span class="card-icon">🍬</span>
    705. 

  705.           <h3>高血糖与糖尿病——血管的"甜蜜腐蚀"</h3>
    706. 

  706.           <p>糖尿病患者心血管病风险是非糖尿病者的2-4倍，约50%的糖尿病患者最终死于心血管病。高血糖通过多种机制损伤血管：AGEs（糖基化终末产物）积累、氧化应激增加、内皮NO合成减少、LDL糖化后更易被氧化。HbA1c每升高1%，心血管事件风险增加约18%。</p>
    707. 

  707.           <p style="margin-top:0.5rem;"><strong>重要窗口：</strong>"糖尿病前期"（空腹血糖受损或糖耐量异常）人群，心血管风险已比正常人升高约1.5倍，是早期干预的黄金时期。</p>
    708. 

  708.         </div>
    709. 

  709. 

  710.         <div class="card card-orange">
    711. 

  711.           <span class="card-icon">🚬</span>
    712. 

  712.           <h3>吸烟——内皮的"直接攻击"</h3>
    713. 

  713.           <p>吸烟是心血管疾病独立且可逆的危险因素。烟草中尼古丁收缩血管、一氧化碳损伤内皮、促血小板活化、降低HDL-C。吸烟者心血管病风险比不吸烟者高2-3倍。</p>
    714. 

  714.           <p style="margin-top:0.5rem;"><strong>戒烟的惊人效果：</strong>戒烟1年，心血管病风险降低50%；戒烟5-15年，风险接近从不吸烟者。被动吸烟（二手烟）同样增加约25%的心血管病风险。</p>
    715. 

  715.         </div>
    716. 

  716.       </div>
    717. 

  717. 

  718.       <div>
    719. 

  719.         <div class="card card-blue" style="margin-bottom:1.25rem;">
    720. 

  720.           <span class="card-icon">📦</span>
    721. 

  721.           <h3>腹型肥胖——代谢综合征的核心</h3>
    722. 

  722.           <p>BMI正常但腰围超标（男性≥90cm，女性≥85cm）的"正常体重代谢性肥胖"（MONW）人群，心血管风险显著升高。脂肪组织是活跃的内分泌器官，分泌IL-6、TNF-α等促炎因子，释放游离脂肪酸导致胰岛素抵抗，形成"代谢性炎症"状态。</p>
    723. 

  723.           <p style="margin-top:0.5rem;"><strong>代谢综合征：</strong>中心性肥胖+高血压+高血糖+血脂异常≥3项同时出现时，心血管病风险是无代谢综合征者的2-3倍。腰围每增加1cm，心血管事件风险增加约2%。</p>
    724. 

  724.         </div>
    725. 

  725. 

  726.         <div class="card card-purple" style="margin-bottom:1.25rem;">
    727. 

  727.           <span class="card-icon">🥩</span>
    728. 

  728.           <h3>饱和脂肪酸与反式脂肪——直接促动脉硬化</h3>
    729. 

  729.           <p>饱和脂肪酸（主要来自红肉、全脂乳制品、棕榈油）升高LDL-C，促进动脉粥样硬化。反式脂肪（部分氢化植物油，油炸食品、烘焙食品中常见）作用更强——不仅升高LDL-C，还降低HDL-C、升高甘油三酯，是最强的心血管风险饮食因素。</p>
    730. 

  730.           <p style="margin-top:0.5rem;"><strong>WHO目标：</strong>2025年前在全球食品供应中消除工业反式脂肪。</p>
    731. 

  731.         </div>
    732. 

  732. 

  733.         <div class="card card-teal">
    734. 

  734.           <span class="card-icon">😰</span>
    735. 

  735.           <h3>慢性心理压力——被忽视的心血管推手</h3>
    736. 

  736.           <p>慢性应激通过交感神经激活（↑儿茶酚胺）、HPA轴失调（↑皮质醇）升高血压、血糖和炎症水平。抑郁障碍患者心血管病风险增加约60%，机制涉及交感神经过度激活和血小板活化。</p>
    737. 

  737.           <p style="margin-top:0.5rem;"><strong>空气污染：</strong>PM2.5暴露每增加10μg/m³，心血管死亡率增加约0.5-1.0%，长期暴露可加速动脉粥样硬化进展。</p>
    738. 

  738.         </div>
    739. 

  739.       </div>
    740. 

  740.     </div>
    741. 

  741. 

  742.     <h3 style="font-size:1.05rem;font-weight:700;margin:2rem 0 1rem;">🔬 肠道菌群：被低估的心血管"第三套影响因素"</h3>
    743. 

  743.     <div class="evidence-box purple" style="margin-bottom:2rem;">
    744. 

  744.       <div class="evidence-box-header">
    745. 

  745.         <span class="evidence-box-title">🧫 肠道菌群-心血管轴：TMAO、SCFAs与胆汁酸系统</span>
    746. 

  746.         <span class="ev-tag purple">PMC9268449 · 系统综述</span>
    747. 

  747.         <span class="ev-tag green">新兴研究</span>
    748. 

  748.       </div>
    749. 

  749.       <p>人体肠道菌群携带约330万独特基因（人类基因组的150倍），被称为"第二基因组"。它们通过代谢产物深度参与心血管调控：</p>
    750. 

  750.       <p><strong>TMAO通路：</strong>富含肉碱（红肉、内脏）和胆碱（蛋黄、动物肝脏）的饮食→肠道菌群将其转化为TMA→TMA在肝脏经FMO3酶氧化为TMAO→TMAO促进动脉粥样硬化（加速泡沫细胞形成）、促进血小板活化和血栓形成。高TMAO水平人群心血管事件风险增加约60%。</p>
    751. 

  751.       <p><strong>SCFAs保护通路：</strong>膳食纤维（全谷物、蔬菜、水果）→肠道菌群发酵产生乙酸、丙酸、丁酸→SCFAs进入血液，作用于GPR41/43受体→降低血压（促进肾素分泌抑制）、减轻血管炎症、改善内皮功能、增加胰岛素敏感性。动物实验显示：高纤维饮食或补充丁酸盐可显著减轻动脉粥样硬化。</p>
    752. 

  752.       <p><strong>胆汁酸信号通路：</strong>初级胆汁酸（肝脏合成）→进入肠道后被菌群转化为次级胆汁酸→FXR和TGR5受体信号→调节糖脂代谢、抑制炎症、影响动脉粥样硬化进展。</p>
    753. 

  753.     </div>
    754. 

  754. 

  755.     <div class="process-steps" style="margin-top:1rem;">
    756. 

  756.       <div class="process-step">
    757. 

  757.         <div class="step-num orange">💡</div>
    758. 

  758.         <div class="step-content">
    759. 

  759.           <h4>主动健康核心认知：病因可改变</h4>
    760. 

  760.           <p>心脑血管疾病的最重要"因"——高血压、高血糖、高血脂、吸烟、腹型肥胖、饮食失衡、缺乏运动、心理压力——全部是可改变的。即使遗传风险高，通过积极管理这些危险因素，同样可以大幅降低发病风险。建议每个家庭建立"心血管风险档案"，记录各成员的危险因素现状和改善进度。</p>
    761. 

  761.         </div>
    762. 

  762.       </div>
    763. 

  763.     </div>
    764. 

  764. 

  765.   </div>
    766. 

  766. </section>
    767. 

  767. 

  768. <!-- ══════════════════════════════════════════
    769. 

  769.      主动健康五步
    770. 

  770. ═══════════════════════════════════════════ -->
    771. 

  771. <section class="section section-alt" id="proactive">
    772. 

  772.   <div class="container">
    773. 

  773.     <div class="section-tag green">🌿 主动健康五步</div>
    774. 

  774.     <h2 class="section-title">从识别到优化：心脑血管疾病的主动健康干预闭环</h2>
    775. 

  775.     <p class="section-intro">
    776. 

  776.       "主动健康"的核心理念是：在疾病发生之前主动管理风险，在疾病发生之后主动参与康复。不是等生病了再治病，而是在疾病形成的每一个阶段都有主动干预的意识和工具。心脑血管疾病的主动健康分为五步：<strong>提前识别 → 风险管控 → 主动干预 → 效果评估 → 持续优化</strong>，形成一个永不中断的闭环。
    777. 

  777.     </p>
    778. 

  778. 

  779.     <div class="step-flow">
    780. 

  780.       <div class="step-flow-item blue"><span class="s-num">STEP 01</span><span class="s-title">提前识别</span></div>
    781. 

  781.       <span class="step-flow-arrow">→</span>
    782. 

  782.       <div class="step-flow-item teal"><span class="s-num">STEP 02</span><span class="s-title">风险管控</span></div>
    783. 

  783.       <span class="step-flow-arrow">→</span>
    784. 

  784.       <div class="step-flow-item purple"><span class="s-num">STEP 03</span><span class="s-title">主动干预</span></div>
    785. 

  785.       <span class="step-flow-arrow">→</span>
    786. 

  786.       <div class="step-flow-item orange"><span class="s-num">STEP 04</span><span class="s-title">效果评估</span></div>
    787. 

  787.       <span class="step-flow-arrow">→</span>
    788. 

  788.       <div class="step-flow-item green"><span class="s-num">STEP 05</span><span class="s-title">持续优化</span></div>
    789. 

  789.     </div>
    790. 

  790. 

  791.     <!-- STEP 01 -->
    792. 

  792.     <h3 style="font-size:1.15rem;font-weight:700;margin:2rem 0 1rem;color:var(--blue);">① 提前识别——在沉默期发现风险</h3>
    793. 

  793.     <p style="color:var(--text-secondary);font-size:0.95rem;line-height:1.8;margin-bottom:1.5rem;">
    794. 

  794.       心脑血管疾病在早期（内皮功能障碍、动脉粥样硬化启动阶段）毫无症状。提前识别的目的是：在疾病"沉默期"发现风险，从而在最有效的干预窗口期采取行动。越早识别，逆转可能性越大，成本越低。
    795. 

  795.     </p>
    796. 

  796. 

  797.     <div class="grid-2" style="margin-bottom:1.5rem;">
    798. 

  798.       <div>
    799. 

  799.         <div class="card card-blue">
    800. 

  800.           <h3>🔬 心血管风险评估工具</h3>
    801. 

  801.           <p><strong>China-PAR模型：</strong>中国自己的心血管风险评估模型，纳入年龄、性别、血压、胆固醇、血糖、BMI、腰围等指标，适合35-59岁人群。每1-2年评估一次。</p>
    802. 

  802.           <p style="margin-top:0.5rem;"><strong>Framingham风险评分（FRS）：</strong>适合45岁以上人群，评估10年心血管事件风险，分为低危（<10%）、中危（10-20%）、高危（>20%）。</p>
    803. 

  803.         </div>
    804. 

  804.         <div class="card" style="margin-top:1.25rem;border-left:4px solid var(--blue);">
    805. 

  805.           <h3>📋 年度体检必查项目</h3>
    806. 

  806.           <table>
    807. 

  807.             <tr><th>项目</th><th>建议频率</th><th>意义</th></tr>
    808. 

  808.             <tr><td>血压</td><td>每次就诊/家庭自测</td><td>高血压早发现</td></tr>
    809. 

  809.             <tr><td>血脂四项</td><td>每年</td><td>动脉硬化核心指标</td></tr>
    810. 

  810.             <tr><td>空腹血糖+HbA1c</td><td>每年</td><td>糖尿病/前期筛查</td></tr>
    811. 

  811.             <tr><td>BMI+腰围</td><td>每年</td><td>肥胖评估</td></tr>
    812. 

  812.             <tr><td>hsCRP</td><td>每2-3年</td><td>炎症水平标志物</td></tr>
    813. 

  813.             <tr><td>颈动脉超声</td><td>高危人群每年</td><td>早期斑块检测</td></tr>
    814. 

  814.             <tr><td>心电图（静息）</td><td>每年</td><td>心脏基础状态</td></tr>
    815. 

  815.           </table>
    816. 

  816.         </div>
    817. 

  817.       </div>
    818. 

  818.       <div>
    819. 

  819.         <div class="card card-teal">
    820. 

  820.           <h3>🧬 基因检测：风险背景参考</h3>
    821. 

  821.           <p>有早发冠心病/脑卒中家族史（一级亲属男性<55岁、女性<65岁）的人群建议进行基因检测：</p>
    822. 

  822.           <ul class="list-styled green">
    823. 

  823.             <li><strong>apoE基因型</strong>：ε4携带者心血管病风险↑约40%</li>
    824. 

  824.             <li><strong>9p21.3风险位点</strong>：心血管遗传风险位点</li>
    825. 

  825.             <li><strong>LPA基因变异</strong>：脂蛋白(a)升高，独立风险因子</li>
    826. 

  826.             <li><strong>AGT/ADD1基因</strong>：盐敏感基因型，限盐更严格</li>
    827. 

  827.             <li><strong>PCSK9功能变异</strong>：影响LDL-C代谢</li>
    828. 

  828.           </ul>
    829. 

  829.           <p style="margin-top:0.5rem;color:var(--text-muted);font-size:0.82rem;">基因是风险背景，不是判决书。高遗传风险 = 更积极干预的指征。</p>
    830. 

  830.         </div>
    831. 

  831.         <div class="card card-purple" style="margin-top:1.25rem;">
    832. 

  832.           <h3>⚠️ 重点识别信号</h3>
    833. 

  833.           <p>一级亲属早发心血管病（男<55岁，女<65岁）提示遗传风险较高。此外，<strong>女性PCOS</strong>和<strong>男性勃起功能障碍（ED）</strong>均是心血管病风险升高的独立信号，提示内皮功能已受损。</p>
    834. 

  834.         </div>
    835. 

  835.       </div>
    836. 

  836.     </div>
    837. 

  837. 

  838.     <!-- STEP 02 -->
    839. 

  839.     <h3 style="font-size:1.15rem;font-weight:700;margin:2rem 0 1rem;color:var(--teal);">② 风险管控——分层管理，有的放矢</h3>
    840. 

  840.     <p style="color:var(--text-secondary);font-size:0.95rem;line-height:1.8;margin-bottom:1.5rem;">
    841. 

  841.       根据评估结果进行分层：低危以生活方式干预为主；中危生活方式+考虑药物；高危（已患心血管病、糖尿病、慢性肾病）需要药物+生活方式双管齐下，目标值更严格。
    842. 

  842.     </p>
    843. 

  843. 

  844.     <div class="table-wrap" style="margin-bottom:1.5rem;">
    845. 

  845.       <table>
    846. 

  846.         <tr><th>风险级别</th><th>判断标准</th><th>LDL-C目标</th><th>血压目标</th><th>核心策略</th></tr>
    847. 

  847.         <tr><td><strong>低危</strong></td><td>10年风险 <5%（China-PAR）</td><td><3.4 mmol/L</td><td><140/90 mmHg</td><td>强化生活方式干预</td></tr>
    848. 

  848.         <tr><td><strong>中危</strong></td><td>10年风险 5-20%</td><td><2.6 mmol/L</td><td><130/80 mmHg</td><td>生活方式+考虑他汀</td></tr>
    849. 

  849.         <tr><td><strong>高危</strong></td><td>10年风险≥20%，或糖尿病/CKD</td><td><1.8 mmol/L</td><td><130/80 mmHg</td><td>他汀+生活方式双管</td></tr>
    850. 

  850.         <tr><td><strong>极高危</strong></td><td>已患ASCVD</td><td><1.4 mmol/L</td><td><130/80 mmHg</td><td>强化药物治疗</td></tr>
    851. 

  851.       </table>
    852. 

  852.     </div>
    853. 

  853.     <p style="color:var(--text-muted);font-size:0.82rem;margin-bottom:1rem;">参考：《中国血脂管理指南2023》《中国高血压防治指南2023》</p>
    854. 

  854. 

  855.     <div class="evidence-box blue" style="margin-bottom:1.5rem;">
    856. 

  856.       <div class="evidence-box-header">
    857. 

  857.         <span class="evidence-box-title">📊 为什么LDL-C是"硬终点"？</span>
    858. 

  858.         <span class="ev-tag blue">他汀RCT证据</span>
    859. 

  859.       </div>
    860. 

  860.       <p><strong>LDL-C每降低1mmol/L，主要心血管事件风险降低约20-25%</strong>。这一效果在不同患者群体中一致存在（无论有无心血管病、是否合并糖尿病）。对于中危以上人群，降脂治疗（首选他汀）是减少心血管事件最有力的药物干预，配合生活方式改变效果更佳。</p>
    861. 

  861.     </div>
    862. 

  862. 

  863.     <!-- STEP 03 -->
    864. 

  864.     <h3 style="font-size:1.15rem;font-weight:700;margin:2rem 0 1rem;color:var(--purple);">③ 主动干预——可执行的五维干预策略</h3>
    865. 

  865.     <p style="color:var(--text-secondary);font-size:0.95rem;line-height:1.8;margin-bottom:1.5rem;">
    866. 

  866.       主动干预不是"少吃、多动"的口号，而是需要具体化、可量化、可坚持的行动方案。五个维度同时发力，效果最为显著。
    867. 

  867.     </p>
    868. 

  868. 

  869.     <div class="grid-2" style="margin-bottom:1.5rem;">
    870. 

  870.       <div>
    871. 

  871.         <div class="card card-purple" style="margin-bottom:1.25rem;">
    872. 

  872.           <span class="card-icon">🥗</span>
    873. 

  873.           <h3>饮食干预——心血管健康的基石</h3>
    874. 

  874.           <p><strong>地中海饮食（Mediterranean Diet）：</strong>特征：高比例橄榄油、坚果、全谷物、蔬菜、水果；适量鱼类和禽肉；限制红肉和甜饮料。PREDIMED研究（7447人，随访5年）显示：地中海饮食+坚果/橄榄油，心血管事件风险降低约26-30%。</p>
    875. 

  875.           <p style="margin-top:0.5rem;"><strong>DASH饮食：</strong>专门为降压设计的饮食模式——高水果蔬菜、低脂乳制品、限盐限饱和脂肪。效果：收缩压平均降低约11mmHg，接近单药降压治疗。</p>
    876. 

  876.           <p style="margin-top:0.5rem;"><strong>实操要点：</strong>每日盐摄入<5g；每日红肉<100g；每日膳食纤维>25g；每周吃鱼≥2次；用橄榄油/菜籽油替代动物油；避免反式脂肪。</p>
    877. 

  877.         </div>
    878. 

  878. 

  879.         <div class="card card-orange" style="margin-bottom:1.25rem;">
    880. 

  880.           <span class="card-icon">🏃</span>
    881. 

  881.           <h3>运动干预——改善内皮的"天然药物"</h3>
    882. 

  882.           <p>规律运动改善血管内皮功能（↑NO生物利用度）、降低血压、改善血脂、减轻炎症。EPI NCS研究：每周150分钟中等强度有氧运动（快走）可降低心血管死亡风险约20%。</p>
    883. 

  883.           <p style="margin-top:0.5rem;"><strong>运动处方：</strong>有氧：每周≥150分钟中等强度或75分钟高强度；抗阻运动：每周2-3次；柔韧性训练：每周拉伸；<strong>每坐1小时起身活动5分钟</strong>（久坐危害无法被运动完全抵消）。</p>
    884. 

  884.         </div>
    885. 

  885. 

  886.         <div class="card card-blue">
    887. 

  887.           <span class="card-icon">💧</span>
    888. 

  888.           <h3>富氢水——改善内皮的新兴手段</h3>
    889. 

  889.           <p>富氢水（Electrolyzed Hydrogen Water）通过选择性中和·OH和ONOO⁻等强氧化剂，降低氧化应激，改善内皮功能。</p>
    890. 

  890.           <p style="margin-top:0.5rem;"><strong>核心证据：</strong>IJMS 2024系统综述（doi:10.3390/ijms25020973，12项临床研究）：富氢水显著改善血流介导的血管舒张功能（FMD）。高血压大鼠饮用4周：收缩压↓约15mmHg，ox-LDL↓，SOD↑，MDA↓，eNOS磷酸化↑（NO合成恢复）。</p>
    891. 

  891.           <p style="margin-top:0.5rem;"><strong>实操：</strong>每日饮用1.5-2L（电解>30分钟的仪器产水效果更稳定），配合饮食运动，不替代药物。</p>
    892. 

  892.         </div>
    893. 

  893.       </div>
    894. 

  894. 

  895.       <div>
    896. 

  896.         <div class="card card-accent" style="margin-bottom:1.25rem;">
    897. 

  897.           <span class="card-icon">🚭</span>
    898. 

  898.           <h3>戒烟——最具性价比的单一干预</h3>
    899. 

  899.           <p>戒烟后心血管获益出现极快：戒烟1年风险降低约50%；戒烟5-15年风险接近从不吸烟者。二手烟同样增加不吸烟者约25%心血管病风险。</p>
    900. 

  900.           <p style="margin-top:0.5rem;"><strong>戒烟方法：</strong>心理支持+药物辅助（尼古丁替代疗法、安非他酮、伐尼克兰）是最有效方案。<strong>电子烟含尼古丁</strong>，对内皮功能有损害，不推荐作为戒断辅助。</p>
    901. 

  901.         </div>
    902. 

  902. 

  903.         <div class="card card-teal" style="margin-bottom:1.25rem;">
    904. 

  904.           <span class="card-icon">🧘</span>
    905. 

  905.           <h3>压力管理与睡眠——被低估的手段</h3>
    906. 

  906.           <p><strong>慢性心理压力：</strong>通过交感神经激活升高血压、血糖和炎症水平。应对方法：正念冥想（每日10-20分钟，研究显示可降低收缩压约3-7mmHg）、有氧运动、充足睡眠。</p>
    907. 

  907.           <p style="margin-top:0.5rem;"><strong>睡眠：</strong>睡眠不足（<6小时/天）和睡眠呼吸暂停综合征（OSAS）是高血压的独立风险因素。目标睡眠时长：7-9小时/天，入睡<30分钟。</p>
    908. 

  908.         </div>
    909. 

  909. 

  910.         <div class="card card-purple">
    911. 

  911.           <span class="card-icon">🦠</span>
    912. 

  912.           <h3>肠道菌群调节——从TMAO通路源头干预</h3>
    913. 

  913.           <p><strong>降低TMAO：</strong>减少红肉（肉碱）和蛋黄（胆碱）摄入；增加膳食纤维（促进产SCFAs细菌生长，间接竞争性抑制产TMA细菌）；规律运动；某些益生菌株已被证实可降低TMAO水平。</p>
    914. 

  914.           <p style="margin-top:0.5rem;"><strong>升高SCFAs：</strong>每日膳食纤维>25g（全谷物、杂豆、蔬菜、水果）；发酵食品（酸奶、泡菜、纳豆）；规律运动同样增加产SCFAs肠道菌群丰度。</p>
    915. 

  915.         </div>
    916. 

  916.       </div>
    917. 

  917.     </div>
    918. 

  918. 

  919.     <!-- STEP 04 -->
    920. 

  920.     <h3 style="font-size:1.15rem;font-weight:700;margin:2rem 0 1rem;color:var(--orange);">④ 效果评估——用数据说话，验证干预是否有效</h3>
    921. 

  921.     <p style="color:var(--text-secondary);font-size:0.95rem;line-height:1.8;margin-bottom:1.5rem;">
    922. 

  922.       主动健康不是"做了就好"，而是要量化效果、动态调整。建立个人健康数据追踪体系，是效果评估的核心工具。
    923. 

  923.     </p>
    924. 

  924. 

  925.     <div class="grid-2" style="margin-bottom:1.5rem;">
    926. 

  926.       <div class="card card-orange">
    927. 

  927.         <h3>📊 需要追踪的核心指标</h3>
    928. 

  928.         <table>
    929. 

  929.           <tr><th>指标</th><th>目标值</th><th>测量频率</th></tr>
    930. 

  930.           <tr><td>血压</td><td><130/80 mmHg（高危）</td><td>家庭自测每周3-7次</td></tr>
    931. 

  931.           <tr><td>LDL-C</td><td>根据风险级别</td><td>每3-6个月</td></tr>
    932. 

  932.           <tr><td>HDL-C</td><td>男>1.0, 女>1.3 mmol/L</td><td>每年</td></tr>
    933. 

  933.           <tr><td>甘油三酯</td><td><1.7 mmol/L</td><td>每年</td></tr>
    934. 

  934.           <tr><td>空腹血糖</td><td><5.6 mmol/L</td><td>每年</td></tr>
    935. 

  935.           <tr><td>HbA1c</td><td><7%（糖尿病患者）</td><td>每3-6个月</td></tr>
    936. 

  936.           <tr><td>BMI</td><td>18.5-23.9 kg/m²</td><td>每年</td></tr>
    937. 

  937.           <tr><td>腰围</td><td>男<90cm，女<85cm</td><td>每年</td></tr>
    938. 

  938.           <tr><td>hsCRP</td><td><1 mg/L（理想）</td><td>每6-12个月</td></tr>
    939. 

  939.         </table>
    940. 

  940.       </div>
    941. 

  941.       <div class="card card-teal">
    942. 

  942.         <h3>🩺 定期专科检查（根据风险级别）</h3>
    943. 

  943.         <ul class="list-styled green">
    944. 

  944.           <li><strong>颈动脉超声</strong>：评估IMT和斑块，高危人群每年1次</li>
    945. 

  945.           <li><strong>冠脉CTA</strong>：评估冠脉钙化积分，高危无症状人群每3-5年</li>
    946. 

  946.           <li><strong>踝臂指数（ABI）</strong>：评估下肢动脉硬化，50岁以上或吸烟者每年</li>
    947. 

  947.           <li><strong>眼底检查</strong>：高血压/糖尿病患者每年1次</li>
    948. 

  948.           <li><strong>尿微量白蛋白</strong>：高血压/糖尿病肾损害早期指标</li>
    949. 

  949.           <li><strong>心脏超声</strong>：高血压/心衰患者每1-2年</li>
    950. 

  950.         </ul>
    951. 

  951.         <p style="margin-top:0.75rem;font-size:0.85rem;color:var(--text-muted);">建立个人健康档案，追踪趋势变化。这帮助医生了解你的长期健康轨迹，也帮助你建立对自身健康的主动掌控感。</p>
    952. 

  952.       </div>
    953. 

  953.     </div>
    954. 

  954. 

  955.     <div class="evidence-box green" style="margin-bottom:1.5rem;">
    956. 

  956.       <div class="evidence-box-header">
    957. 

  957.         <span class="evidence-box-title">📊 干预效果的预期幅度（RCT数据）</span>
    958. 

  958.         <span class="ev-tag green">循证数据</span>
    959. 

  959.       </div>
    960. 

  960.       <p>限盐（每日<5g）：收缩压降低约5-8mmHg（高血压患者）｜DASH饮食：收缩压降低约11mmHg｜规律有氧运动（每周150分钟）：收缩压降低约5mmHg，LDL-C降低约5-10%｜减重（每减10kg）：收缩压降低约5-20mmHg｜他汀治疗（中等强度）：LDL-C降低约30-50%｜富氢水：FMD改善约2-4%（相对值）。</p>
    961. 

  961.     </div>
    962. 

  962. 

  963.     <!-- STEP 05 -->
    964. 

  964.     <h3 style="font-size:1.15rem;font-weight:700;margin:2rem 0 1rem;color:var(--teal);">⑤ 持续优化——把健康当作长期投资</h3>
    965. 

  965.     <p style="color:var(--text-secondary);font-size:0.95rem;line-height:1.8;margin-bottom:1.5rem;">
    966. 

  966.       心脑血管健康不是"达标后就停止"的事。动脉粥样硬化是慢性进展性疾病，需要终身管理。持续优化意味着：根据评估结果动态调整方案，在不同人生阶段采取与年龄匹配的策略，并不断迭代最新的科学证据。
    967. 

  967.     </p>
    968. 

  968. 

  969.     <div class="grid-3">
    970. 

  970.       <div class="card card-blue">
    971. 

  971.         <h3>👤 分年龄段策略</h3>
    972. 

  972.         <p><strong>20-35岁（预防黄金期）</strong>：建立健康习惯；了解家族史；基线体检；接种流感疫苗。</p>
    973. 

  973.         <p style="margin-top:0.4rem;"><strong>35-50岁（风险积累期）</strong>：每年体检；识别糖尿病前期；关注颈动脉IMT；开始地中海饮食模式。</p>
    974. 

  974.         <p style="margin-top:0.4rem;"><strong>50-65岁（疾病高发期）</strong>：强化危险因素管理；关注心电图和心脏超声；识别心衰早期信号。</p>
    975. 

  975.         <p style="margin-top:0.4rem;"><strong>65岁以上（康复维持期）</strong>：心脏康复指导下运动；防跌倒；保持社交活动。</p>
    976. 

  976.       </div>
    977. 

  977.       <div class="card card-purple">
    978. 

  978.         <h3>🔄 动态调整机制</h3>
    979. 

  979.         <p>每3-6个月进行一次"主动健康回顾"：① 上阶段干预措施执行情况如何？② 指标变化趋势是向好还是向坏？③ 遇到哪些障碍？④ 下阶段需要调整什么？</p>
    980. 

  980.         <p style="margin-top:0.5rem;"><strong>遇到瓶颈时的思路：</strong>降压/降脂效果不佳→联合用药；运动依从性差→从每天5分钟开始逐步增加；饮食难以坚持→寻找替代方案（不同口感/烹饪方式）；压力管理无效→寻求心理咨询。</p>
    981. 

  981.         <p style="margin-top:0.5rem;color:var(--text-muted);font-size:0.85rem;"><strong>重要原则：</strong>没有"完美方案"，只有"当前最优方案"。小幅改善+长期坚持，优于完美方案+短期放弃。</p>
    982. 

  982.       </div>
    983. 

  983.       <div class="card card-orange">
    984. 

  984.         <h3>👨‍👩‍👧‍👦 家庭健康管理</h3>
    985. 

  985.         <p>心脑血管健康是家庭共同的事业：</p>
    986. 

  986.         <ul class="list-styled">
    987. 

  987.           <li>家庭共餐：地中海饮食模式的最佳实践场景</li>
    988. 

  988.           <li>全家运动：周末徒步、骑行、家庭运动时间</li>
    989. 

  989.           <li>互相提醒：戒烟监督、按时服药、定期体检</li>
    990. 

  990.           <li>家庭健康档案：记录每个人的关键指标趋势</li>
    991. 

  991.           <li>儿童健康教育：从青少年期建立心血管健康意识</li>
    992. 

  992.         </ul>
    993. 

  993.       </div>
    994. 

  994.     </div>
    995. 

  995. 

  996.     <div class="quote-block green" style="margin-top:2rem;">
    997. 

  997.       <p class="quote-text">"主动健康不是要求你成为一个'完美健康人'，而是让你在力所能及的范围内，做出对心血管系统最友好的选择。每一个小的改善——少吃一勺盐、多走10分钟路、少抽一根烟——都在累积对心血管系统的保护效应。持之以恒，效果惊人。"</p>
    998. 

  998.       <span class="quote-source">— 浠艾福 · 主动健康学院 · 五维幸福理念</span>
    999. 

  999.     </div>
    1000. 

  1000. 

  1001.   </div>
    1002. 

  1002. </section>
    1003. 

  1003. 

  1004. <!-- CTA -->
    1005. 

  1005. <section class="cta-section">
    1006. 

  1006.   <div class="container">
    1007. 

  1007.     <h2>主动健康，从今天开始</h2>
    1008. 

  1008.     <p>心脑血管疾病可预防、可延缓、可管理。用科学的知识武装自己，用主动的行动保护家人。<br>在基因给定的底牌上，通过生活方式干预，你完全有能力改写自己的心血管命运。</p>
    1009. 

  1009.     <div class="cta-buttons">
    1010. 

  1010.       <a href="index.html" class="btn btn-primary">🏠 返回首页</a>
    1011. 

  1011.       <a href="https://www.etotem.com.cn" class="btn btn-outline" target="_blank">了解主动健康服务</a>
    1012. 

  1012.     </div>
    1013. 

  1013.   </div>
    1014. 

  1014. </section>
    1015. 

  1015. 

  1016. <!-- Footer (shared) -->
    1017. 

  1017. <div id="footer-placeholder"></div>
    1018. 

  1018. <script src="js/footer.js"></script>
    1019. 

  1019. 

  1020. <!-- ══════════════════════════════════════════
    1021. 

  1021.      参考文献
    1022. 

  1022. ═══════════════════════════════════════════ -->
    1023. 

  1023. <section class="citations" id="citations">
    1024. 

  1024.   <div class="container">
    1025. 

  1025.     <h2 style="font-size:1.3rem;font-weight:800;margin-bottom:1.5rem;display:flex;align-items:center;gap:0.5rem;">📚 参考文献</h2>
    1026. 

  1026. 

  1027.     <div class="citation-card" id="ref-1">
    1028. 

  1028.       <div class="source">[1] 《中国心血管健康与疾病报告2024》· 中国循环杂志</div>
    1029. 

  1029.       <div class="auth-row"><span class="auth-badge blue">📊 中国官方流行病学数据</span></div>
    1030. 

  1030.       <div class="findings">中国心血管病患病率现患人数达3.45亿，高血压患者2.45亿，年死亡458万。城乡居民死亡原因首位。</div>
    1031. 

  1031.       <div class="trans">中国心血管健康与疾病报告2024——中国心血管病流行现状与防治策略的核心文献</div>
    1032. 

  1032.     </div>
    1033. 

  1033. 

  1034.     <div class="citation-card" id="ref-2">
    1035. 

  1035.       <div class="source">[2] Physiological Reviews · Otsuka et al. · 2023 · doi:10.1152/physrev.00024.2022</div>
    1036. 

  1036.       <div class="auth-row"><span class="auth-badge">📚 生理学评论 · IF 20.3</span><span class="auth-badge purple">GWAS里程碑</span></div>
    1037. 

  1037.       <div class="findings">GWAS and Cardiovascular Disease. 500+ GWAS studies, 1.5M+ subjects, 1500+ genetic loci. Most CVD genetic risk acts through upstream regulation of modifiable risk factors — lifestyle intervention can change outcomes even with high genetic risk.</div>
    1038. 

  1038.       <div class="trans">心血管遗传学系统综述——综合500+GWAS研究、150万受试者数据，证实心血管遗传风险通过可改变危险因素的上游调控发挥作用</div>
    1039. 

  1039.       <a class="link" href="https://doi.org/10.1152/physrev.00024.2022" target="_blank">🔗 doi.org/10.1152/physrev.00024.2022</a>
    1040. 

  1040.     </div>
    1041. 

  1041. 

  1042.     <div class="citation-card" id="ref-3">
    1043. 

  1043.       <div class="source">[3] Frontiers in Cardiovascular Medicine · Harshfield et al. · 2022 · PMC9268449</div>
    1044. 

  1044.       <div class="auth-row"><span class="auth-badge green">🧬 肠道菌群-心血管轴 · 系统综述</span></div>
    1045. 

  1045.       <div class="findings">The Gut-Heart Axis. TMAO pathway drives atherosclerosis (↑60% CV events); SCFAs (acetate/propionate/butyrate) protect via GPR41/43 receptors; bile acid FXR/TGR5 signaling regulates cardiometabolic health.</div>
    1046. 

  1046.       <div class="trans">肠-心轴：TMAO通路（促硬化，↑60%心血管事件风险）和SCFAs保护通路（抗炎、内皮保护）的系统综述</div>
    1047. 

  1047.       <a class="link" href="https://www.ncbi.nlm.nih.gov/pmc/articles/PMC9268449/" target="_blank">🔗 PMC9268449</a>
    1048. 

  1048.     </div>
    1049. 

  1049. 

  1050.     <div class="citation-card" id="ref-4">
    1051. 

  1051.       <div class="source">[4] IJMS · Zanardo et al. · 2024 · doi:10.3390/ijms25020973</div>
    1052. 

  1052.       <div class="auth-row"><span class="auth-badge green">💧 富氢水系统综述 · IJMS IF 5.6 · 12项临床研究</span></div>
    1053. 

  1053.       <div class="findings">Electrolysed Hydrogen Water and Cardiovascular Health. EHW significantly improves FMD, reduces ox-LDL, increases SOD activity, decreases MDA, restores eNOS phosphorylation. H₂ selectively neutralizes ·OH and ONOO⁻, activates Nrf2, inhibits NLRP3.</div>
    1054. 

  1054.       <div class="trans">电解富氢水与心血管健康系统综述——富氢水通过选择性中和强氧化剂、激活Nrf2、恢复eNOS，显著改善内皮功能</div>
    1055. 

  1055.       <a class="link" href="https://doi.org/10.3390/ijms25020973" target="_blank">🔗 doi.org/10.3390/ijms25020973</a>
    1056. 

  1056.     </div>
    1057. 

  1057. 

  1058.     <div class="citation-card" id="ref-5">
    1059. 

  1059.       <div class="source">[5] Lancet · Yusuf et al. · 2004 · INTERHEART · doi:10.1016/S0140-6736(04)17018-9</div>
    1060. 

  1060.       <div class="auth-row"><span class="auth-badge">📊 全球52国 · n=15000+15000 · 循证里程碑</span></div>
    1061. 

  1061.       <div class="findings">9 modifiable risk factors account for >90% of PAR for acute MI: dyslipidemia 49.2%, smoking 35.7%, diabetes 25.7%, hypertension 25.0%, abdominal obesity 20.1%, psychosocial factors 16.5%, fruit/veg deficiency 13.7%, physical inactivity 12.2%, alcohol 5.0%.</div>
    1062. 

  1062.       <div class="trans">INTERHEART研究——全球52国30000人的里程碑研究，证实90%以上的心肌梗死归因于9个可改变危险因素</div>
    1063. 

  1063.       <a class="link" href="https://doi.org/10.1016/S0140-6736(04)17018-9" target="_blank">🔗 doi.org/10.1016/S0140-6736(04)17018-9</a>
    1064. 

  1064.     </div>
    1065. 

  1065. 

  1066.     <div class="citation-card" id="ref-6">
    1067. 

  1067.       <div class="source">[6] NEJM · Ridker et al. · 2017 · CANTOS · doi:10.1056/NEJMoa1707914</div>
    1068. 

  1068.       <div class="auth-row"><span class="auth-badge">🔬 RCT · IL-1β靶点 · NEJM IF 176</span><span class="auth-badge green">抗炎治疗里程碑</span></div>
    1069. 

  1069.       <div class="findings">Canakinumab reduced CV events by ~15% independent of lipid-lowering, proving inflammation is a valid CVD treatment target beyond lipid management.</div>
    1070. 

  1070.       <div class="trans">CANTOS研究——首个证明抗炎治疗可独立于降脂之外降低心血管事件的RCT，证实动脉粥样硬化的炎症本质</div>
    1071. 

  1071.       <a class="link" href="https://doi.org/10.1056/NEJMoa1707914" target="_blank">🔗 doi.org/10.1056/NEJMoa1707914</a>
    1072. 

  1072.     </div>
    1073. 

  1073. 

  1074.     <div class="citation-card" id="ref-7">
    1075. 

  1075.       <div class="source">[7] NEJM · Estruch et al. · 2013 · PREDIMED · doi:10.1056/NEJMoa1200303</div>
    1076. 

  1076.       <div class="auth-row"><span class="auth-badge">🥗 RCT · n=7447 · 随访5年</span></div>
    1077. 

  1077.       <div class="findings">Mediterranean diet supplemented with extra-virgin olive oil or nuts reduced major CV events by 26-30% vs low-fat control diet in 7447 high-risk participants.</div>
    1078. 

  1078.       <div class="trans">PREDIMED研究——地中海饮食（加额外橄榄油或坚果）使高危人群心血管事件风险降低26-30%，迄今最强的饮食干预RCT证据</div>
    1079. 

  1079.       <a class="link" href="https://doi.org/10.1056/NEJMoa1200303" target="_blank">🔗 doi.org/10.1056/NEJMoa1200303</a>
    1080. 

  1080.     </div>
    1081. 

  1081. 

  1082.     <div class="citation-card" id="ref-8">
    1083. 

  1083.       <div class="source">[8] Circulation · Cook et al. · 2015 · TOHP · doi:10.1161/CIRCULATIONAHA.114.012671</div>
    1084. 

  1084.       <div class="auth-row"><span class="auth-badge">🧂 限盐研究 · 15年随访</span></div>
    1085. 

  1085.       <div class="findings">Sodium reduction of 4.6g/day: systolic BP ↓~5mmHg (normotensive), ~7mmHg (hypertensive); 25% reduction in CV events at 15-year follow-up.</div>
    1086. 

  1086.       <div class="trans">TOHP研究15年随访——每日盐摄入减少4.6g可降低心血管事件风险约25%，限盐保护心血管的最强长期随访证据</div>
    1087. 

  1087.       <a class="link" href="https://doi.org/10.1161/CIRCULATIONAHA.114.012671" target="_blank">🔗 doi.org/10.1161/CIRCULATIONAHA.114.012671</a>
    1088. 

  1088.     </div>
    1089. 

  1089. 

  1090.     <div class="citation-card" id="ref-9">
    1091. 

  1091.       <div class="source">[9] 中华高血压杂志 · 中国高血压防治指南修订委员会 · 2023</div>
    1092. 

  1092.       <div class="auth-row"><span class="auth-badge blue">📋 中国高血压防治指南2023</span></div>
    1093. 

  1093.       <div class="findings">更新高血压诊断标准（≥130/80mmHg）和分层管理策略，推荐家庭血压监测（HBPM）和24小时动态血压监测（ABPM）。</div>
    1094. 

  1094.       <div class="trans">中国高血压防治指南2023——中国高血压诊断、分级、治疗和管理的权威指南</div>
    1095. 

  1095.     </div>
    1096. 

  1096. 

  1097.     <div class="citation-card" id="ref-10">
    1098. 

  1098.       <div class="source">[10] European Heart Journal · Mach et al. · 2020 · doi:10.1093/eurheartj/ehz455</div>
    1099. 

  1099.       <div class="auth-row"><span class="auth-badge blue">📋 欧洲血脂管理指南2019</span></div>
    1100. 

  1100.       <div class="findings">LDL-C goals stratified by risk: very high risk <1.4 mmol/L; high risk <1.8 mmol/L; moderate risk <2.6 mmol/L. LDL-C each 1mmol/L reduction = ~20-25% CV event reduction.</div>
    1101. 

  1101.       <div class="trans">2019 ESC/EAS血脂管理指南——根据风险分层设定LDL-C目标值，强调LDL-C是ASCVD核心驱动因子</div>
    1102. 

  1102.       <a class="link" href="https://doi.org/10.1093/eurheartj/ehz455" target="_blank">🔗 doi.org/10.1093/eurheartj/ehz455</a>
    1103. 

  1103.     </div>
    1104. 

  1104. 

  1105.     <div class="citation-card" id="ref-11">
    1106. 

  1106.       <div class="source">[11] Science Translational Medicine · Ko et al. · 2022 · doi:10.1126/scitranslmed.abn4703</div>
    1107. 

  1107.       <div class="auth-row"><span class="auth-badge green">🧬 肠菌干预 · IF 19.3</span></div>
    1108. 

  1108.       <div class="findings">Targeting the gut microbiome to treat CVD. Dietary L-carnitine (red meat) → TMA → TMAO → atherosclerosis and platelet hyperreactivity. Interventions: reduce red meat, increase fiber, exercise, specific probiotics.</div>
    1109. 

  1109.       <div class="trans">肠菌靶向治疗心血管病——阐述TMAO通路的完整链条以及通过饮食、运动和益生菌干预TMAO的策略</div>
    1110. 

  1110.       <a class="link" href="https://doi.org/10.1126/scitranslmed.abn4703" target="_blank">🔗 doi.org/10.1126/scitranslmed.abn4703</a>
    1111. 

  1111.     </div>
    1112. 

  1112. 

  1113.   </div>
    1114. 

  1114. </section>
    1115. 

  1115. 

  1116. </body>
    1117. 

  1117. </html>
    1118.