/* ============================================================
   关于我们页样式（about.html）
   ============================================================ */
.ab-wrap { max-width: 896px; margin: 0 auto; padding: 40px 16px 60px; min-height: 70vh; }
.ab-card {
    background: #fff;
    border-radius: 24px;
    box-shadow: 0 1px 3px rgba(0,0,0,.05);
    border: 1px solid #f3f4f6;
    padding: 32px 24px;
}

/* 头部 */
.ab-hero { text-align: center; margin-bottom: 40px; }
.ab-logo {
    width: 96px; height: 96px;
    margin: 0 auto 24px;
    border-radius: 24px;
    background: linear-gradient(135deg, #3b82f6, #4f46e5);
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 10px 15px -3px rgba(59,130,246,.3);
}
.ab-logo i { font-size: 38px; color: #fff; }
.ab-hero h1 { font-size: 30px; font-weight: 800; color: #111827; margin: 0 0 8px; }
.ab-hero p { color: #6b7280; margin: 0; }

.ab-section { margin-bottom: 36px; }
.ab-section h2 {
    font-size: 20px; font-weight: 700; color: #111827;
    margin: 0 0 16px;
    display: flex; align-items: center;
}
.ab-section h2 i { color: #3b82f6; margin-right: 12px; }

.ab-intro {
    background: #f9fafb;
    border: 1px solid #f3f4f6;
    border-radius: 16px;
    padding: 24px;
}
.ab-intro p { color: #4b5563; line-height: 1.8; margin: 0 0 10px; }
.ab-intro p:last-child { margin-bottom: 0; }

/* 联系方式 */
.ab-contacts { display: grid; grid-template-columns: 1fr; gap: 16px; }
.ab-contact {
    background: #f9fafb;
    border: 1px solid #f3f4f6;
    border-radius: 16px;
    padding: 20px;
    display: flex; align-items: center;
    transition: border-color .2s;
}
.ab-contact:hover { border-color: #bfdbfe; }
.ab-c-icon {
    width: 48px; height: 48px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    margin-right: 16px; font-size: 20px; flex-shrink: 0;
}
.ab-c-icon.green { background: #dcfce7; color: #22c55e; }
.ab-c-icon.wechat { background: #22c55e; color: #fff; }
.ab-c-text { flex: 1; min-width: 0; }
.ab-c-label { font-size: 13px; color: #6b7280; }
.ab-c-value { font-weight: 500; color: #111827; word-break: break-all; }
.ab-copy {
    padding: 8px 16px;
    background: #3b82f6; color: #fff;
    border: none; border-radius: 12px;
    font-size: 13px; cursor: pointer;
    display: flex; align-items: center; gap: 6px;
    flex-shrink: 0;
    transition: background .2s;
}
.ab-copy:hover { background: #2563eb; }
.ab-copy.ok { background: #10b981; }

/* 时间线 */
.ab-timeline-wrap { border-top: 1px solid #f3f4f6; padding-top: 36px; margin-top: 36px; }
.ab-tl-title { font-size: 20px; font-weight: 700; color: var(--c-text); margin: 0 0 24px; display: flex; align-items: center; }
.ab-tl-title i { color: var(--c-primary-dark); margin-right: 12px; }
.ab-timeline { position: relative; border-left: 2px solid #dbeafe; margin-left: 16px; }
.ab-tl-item { position: relative; padding-left: 32px; margin-bottom: 32px; }
.ab-tl-item:last-child { margin-bottom: 0; }
.ab-tl-dot {
    position: absolute; left: -9px; top: 4px;
    width: 16px; height: 16px; border-radius: 50%;
    background: #3b82f6;
    border: 4px solid #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,.1);
}
.ab-tl-dot.old { background: #d1d5db; }
.ab-tl-head {
    display: flex; flex-direction: column;
    margin-bottom: 8px;
}
.ab-tl-ver { font-size: 18px; font-weight: 700; color: #111827; }
.ab-tl-date { font-size: 13px; color: #6b7280; }
.ab-tl-body {
    background: #f9fafb;
    border: 1px solid #f3f4f6;
    border-radius: 16px;
    padding: 18px 20px;
    margin-top: 10px;
}
.ab-tl-body ul { margin: 0; padding: 0; list-style: none; }
.ab-tl-body li { display: flex; align-items: flex-start; color: #4b5563; margin-bottom: 10px; font-size: 14px; line-height: 1.6; }
.ab-tl-body li:last-child { margin-bottom: 0; }
.ab-tl-body li i { margin: 3px 12px 0 0; flex-shrink: 0; }
.ab-tl-body li i.blue { color: #3b82f6; }
.ab-tl-body li i.green { color: #22c55e; }
.ab-tl-body li i.yellow { color: #eab308; }

@media (min-width: 640px) {
    .ab-card { padding: 48px; }
    .ab-contacts { grid-template-columns: 1fr 1fr; }
    .ab-timeline { margin-left: 24px; }
    .ab-tl-head { flex-direction: row; align-items: center; justify-content: space-between; }
}

/* ============================================================
   暗黑模式适配
   ============================================================ */
html[data-theme="dark"] body { background: var(--c-bg); }
html[data-theme="dark"] .ab-card { background: var(--c-surface); border-color: var(--c-border); box-shadow: 0 1px 3px rgba(0,0,0,.4); }
html[data-theme="dark"] .ab-hero h1 { color: var(--c-text); }
html[data-theme="dark"] .ab-hero p { color: var(--c-text-3); }
html[data-theme="dark"] .ab-section h2 { color: var(--c-text); }
html[data-theme="dark"] .ab-section h2 i { color: #47a3f3; }
html[data-theme="dark"] .ab-intro { background: var(--c-bg-2); border-color: var(--c-border); }
html[data-theme="dark"] .ab-intro p { color: var(--c-text-2); }
html[data-theme="dark"] .ab-contact { background: var(--c-bg-2); border-color: var(--c-border); }
html[data-theme="dark"] .ab-contact:hover { border-color: rgba(71,163,243,.45); }
html[data-theme="dark"] .ab-c-icon.green { background: rgba(34,197,94,.15); }
html[data-theme="dark"] .ab-c-label { color: var(--c-text-3); }
html[data-theme="dark"] .ab-c-value { color: var(--c-text); }
html[data-theme="dark"] .ab-timeline-wrap { border-top-color: var(--c-border); }
html[data-theme="dark"] .ab-timeline { border-left-color: rgba(71,163,243,.35); }
html[data-theme="dark"] .ab-tl-dot { background: #47a3f3; border-color: var(--c-surface); box-shadow: 0 1px 2px rgba(0,0,0,.4); }
html[data-theme="dark"] .ab-tl-dot.old { background: #4b5563; }
html[data-theme="dark"] .ab-tl-ver { color: var(--c-text); }
html[data-theme="dark"] .ab-tl-date { color: var(--c-text-3); }
html[data-theme="dark"] .ab-tl-body { background: var(--c-bg-2); border-color: var(--c-border); }
html[data-theme="dark"] .ab-tl-body li { color: var(--c-text-2); }
html[data-theme="dark"] .ab-tl-body li i.blue { color: #47a3f3; }