/* ============================================================
   article-t10.css - GuitarMasta 2.0 文章模板 T10
   路径：/css/article-t10.css
   设计语言：故事叙述型 · 首字下沉 + 章节引文 + 情感化排版
   点缀元素：首字装饰 + 章节分隔符 + 引用高亮
   ============================================================ */

.article-t10 { background: #FDFCFA; }

.article-t10 .article-main {
    max-width: 700px;
    margin: 0 auto;
    padding: var(--sp-8) var(--sp-5);
}

.article-t10 h1 {
    font-family: var(--font-serif);
    font-size: 2.5rem;
    line-height: 1.15;
    text-align: center;
    margin-bottom: var(--sp-6);
    letter-spacing: -0.8px;
    color: var(--c-secondary);
    font-weight: 700;
}

.article-t10 h1::after {
    content: '❦';
    display: block;
    font-size: 1.5rem;
    color: var(--c-primary);
    margin-top: var(--sp-4);
    text-align: center;
}

.article-t10 .article-main > p:first-of-type::first-letter {
    font-family: var(--font-serif);
    font-size: 4.5rem;
    font-weight: 700;
    float: left;
    line-height: 0.85;
    margin: 6px 12px 0 0;
    color: var(--c-primary);
}

.article-t10 h2 {
    font-family: var(--font-serif);
    font-size: 1.6rem;
    text-align: center;
    margin: var(--sp-8) 0 var(--sp-4);
    color: var(--c-secondary);
    font-weight: 700;
}

.article-t10 h2::after {
    content: '◆ ◆ ◆';
    display: block;
    font-size: 0.75rem;
    letter-spacing: 10px;
    color: var(--c-border);
    margin-top: var(--sp-3);
    text-align: center;
}

.article-t10 h3 {
    font-family: var(--font-serif);
    font-size: 1.25rem;
    margin-top: var(--sp-6);
    margin-bottom: var(--sp-3);
    color: var(--c-secondary-light);
    font-style: italic;
}

.article-t10 p {
    font-size: 1.0625rem;
    line-height: 1.95;
    color: #3A3A3A;
    margin-bottom: var(--sp-5);
}

.article-t10 blockquote {
    background: transparent;
    border: none;
    border-left: 3px solid var(--c-primary);
    border-radius: 0;
    padding: var(--sp-4) 0 var(--sp-4) var(--sp-6);
    font-family: var(--font-serif);
    font-style: italic;
    font-size: 1.1875rem;
    color: var(--c-secondary);
    margin: var(--sp-6) 0;
    line-height: 1.7;
    position: relative;
}

.article-t10 blockquote::before {
    content: '';
    position: absolute;
    left: -6px;
    top: 0;
    bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, var(--c-primary), transparent);
}

.article-t10 .cta-box {
    background: linear-gradient(135deg, rgba(194,94,58,0.06), rgba(212,162,76,0.06));
    border-radius: var(--radius-card);
    padding: var(--sp-6);
    margin: var(--sp-6) 0;
    text-align: center;
    border: 1px solid rgba(194,94,58,0.15);
    position: relative;
}

.article-t10 .cta-box::before {
    content: '❦';
    position: absolute;
    top: -16px;
    left: 50%;
    transform: translateX(-50%);
    background: #FDFCFA;
    padding: 0 var(--sp-4);
    color: var(--c-primary);
    font-size: 1.25rem;
}

.article-t10 .pull-quote {
    font-family: var(--font-serif);
    font-size: 1.375rem;
    line-height: 1.5;
    color: var(--c-secondary);
    text-align: center;
    padding: var(--sp-6) var(--sp-5);
    margin: var(--sp-6) 0;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    font-style: italic;
}

@media (max-width: 768px) {
    .article-t10 .article-main { padding: var(--sp-5) var(--sp-4); }
    .article-t10 h1 { font-size: 1.75rem; }
    .article-t10 h2 { font-size: 1.3rem; }
    .article-t10 .article-main > p:first-of-type::first-letter { font-size: 3.25rem; }
    .article-t10 .pull-quote { font-size: 1.125rem; padding: var(--sp-5) var(--sp-4); }
}