﻿/* ===============================
   ARTICLE PAGE (APPLE STYLE)
   =============================== */

.article-page {
    padding: 48px 0 80px;
    background: #fff;
}

/* 核心：居中容器 */
.article-inner {
    max-width: 820px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 副标题（小字） */
.article-kicker {
    font-size: 13px;
    font-weight: 600;
    color: rgba(0,0,0,.45);
    margin-bottom: 10px;
}

/* 主标题 */
.article-title {
    margin: 0;
    font-size: clamp(34px, 4vw, 56px);
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: #111;
}

/* 摘要 */
.article-summary {
    margin-top: 16px;
    font-size: 20px;
    line-height: 1.6;
    color: rgba(0,0,0,.65);
    max-width: 48ch;
}

/* 封面图 */
.article-cover-wrap {
    margin-top: 32px;
}

.article-cover {
    width: 100%;
    display: block;
    border-radius: 20px;
}

/* 正文 */
.article-content {
    margin-top: 36px;
    font-size: 17px;
    line-height: 1.9;
    color: #111;
}

    /* 段落间距 */
    .article-content p {
        margin: 0 0 1.4em;
    }

    /* 小标题 */
    .article-content h2 {
        font-size: 26px;
        margin: 2em 0 .6em;
    }

    .article-content h3 {
        font-size: 20px;
        margin: 1.6em 0 .5em;
    }

    /* 图片 */
    .article-content img {
        display: block;
        max-width: 100%;
        height: auto;
        margin: 24px auto;
        border-radius: 16px;
    }

    /* 引用 */
    .article-content blockquote {
        margin: 24px 0;
        padding-left: 16px;
        border-left: 3px solid #ddd;
        color: #666;
    }

    /* 列表 */
    .article-content ul {
        padding-left: 20px;
        margin: 16px 0;
    }

    .article-content li {
        margin-bottom: 6px;
    }

/* 移动端 */
@media (max-width: 768px) {
    .article-page {
        padding: 32px 0 60px;
    }

    .article-summary {
        font-size: 17px;
    }

    .article-content {
        font-size: 16px;
    }
}

.article-header {
    margin-bottom: 8px;
}