.page-hero { background: linear-gradient(160deg, #0F0F1A 0%, #1A0A0A 40%, #0F0F1A 70%, #1A0F0F 100%); }
.page-hero::before { background: radial-gradient(ellipse 60% 50% at 30% 60%, rgba(214,48,49,0.15), transparent 70%), radial-gradient(ellipse 40% 60% at 70% 30%, rgba(255,118,117,0.06), transparent 70%); }
.page-hero h1 { text-shadow: 0 2px 20px rgba(214,48,49,0.4); }
/* 危机卡片 */
.crisis-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; margin: 32px 0; }
.crisis-card { background: #fff; border-radius: 12px; padding: 24px 20px; box-shadow: 0 2px 16px rgba(0,0,0,0.04); border: 1px solid #EDE8E0; transition: all 0.35s; position: relative; overflow: hidden; }
.crisis-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; transition: height 0.3s; }
.crisis-card:hover { transform: translateY(-6px); box-shadow: 0 12px 32px rgba(0,0,0,0.08); }
.crisis-card:hover::before { height: 6px; }
.crisis-card:nth-child(1)::before { background: linear-gradient(90deg, #D63031, #FF7675); }
.crisis-card:nth-child(2)::before { background: linear-gradient(90deg, #E17055, #FAB1A0); }
.crisis-card:nth-child(3)::before { background: linear-gradient(90deg, #FDCB6E, #FFEAA7); }
.crisis-card:nth-child(4)::before { background: linear-gradient(90deg, #00B894, #55EFC4); }
.crisis-card:nth-child(5)::before { background: linear-gradient(90deg, #6C5CE7, #A29BFE); }
.crisis-icon { font-size: 2rem; margin-bottom: 10px; }
.crisis-card h3 { font-size: 1.1rem; margin-bottom: 8px; font-family: var(--font-display); }
.crisis-card p { font-size: 0.85rem; color: #666; line-height: 1.5; }
/* 数据高亮 */
.stat-alert { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 28px 0; }
.stat-alert-item { text-align: center; padding: 24px 16px; border-radius: 12px; position: relative; }
.stat-alert-item:nth-child(1) { background: linear-gradient(135deg, rgba(214,48,49,0.08), rgba(255,118,117,0.04)); border: 1px solid rgba(214,48,49,0.15); }
.stat-alert-item:nth-child(2) { background: linear-gradient(135deg, rgba(225,112,85,0.08), rgba(250,177,160,0.04)); border: 1px solid rgba(225,112,85,0.15); }
.stat-alert-item:nth-child(3) { background: linear-gradient(135deg, rgba(0,184,148,0.08), rgba(85,239,196,0.04)); border: 1px solid rgba(0,184,148,0.15); }
.stat-big { font-size: 2.2rem; font-weight: 800; font-family: serif; }
.stat-alert-item:nth-child(1) .stat-big { color: #D63031; }
.stat-alert-item:nth-child(2) .stat-big { color: #E17055; }
.stat-alert-item:nth-child(3) .stat-big { color: #00B894; }
.stat-label { font-size: 0.9rem; color: #444; margin-top: 4px; }
.stat-desc { font-size: 0.78rem; color: #999; margin-top: 4px; }
/* UNESCO 评估 */
.unesco-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 24px 0; }
.unesco-item { background: #fff; border: 1px solid #EDE8E0; border-radius: 10px; padding: 20px; box-shadow: 0 2px 10px rgba(0,0,0,0.03); transition: all 0.3s; }
.unesco-item:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,0.06); }
.unesco-meter { height: 6px; background: #EEE; border-radius: 3px; margin: 10px 0; overflow: hidden; }
.unesco-fill { height: 100%; border-radius: 3px; }
.unesco-fill.good { background: #00B894; width: 85%; }
.unesco-fill.warn { background: #FDCB6E; width: 55%; }
.unesco-fill.danger { background: #D63031; width: 30%; }
.unesco-item h5 { font-size: 0.95rem; margin-bottom: 4px; }
.unesco-item .u-status { font-size: 0.8rem; font-weight: 600; }
.u-status.good { color: #00B894; } .u-status.warn { color: #E17055; } .u-status.danger { color: #D63031; }
@media (max-width: 768px) { .stat-alert, .unesco-grid { grid-template-columns: 1fr; } }