/* news-detail page-only layout, color, media and module styling. */

.article-page { padding: 54px 0 62px; background: linear-gradient(135deg,#f8fbff 0%,#edf6ff 58%,#f8fbff 100%); }

.article-shell { max-width: 1120px; }

.article-card { padding: 48px 54px 0; overflow: hidden; border: 1px solid #dce8f7; border-radius: 12px; background: #fff; box-shadow: 0 13px 38px rgba(30,77,139,.10); }

.article-header { padding-bottom: 25px; text-align: center; border-bottom: 1px solid #dce5f1; }

.article-header h1 { margin: 0; color: #102341; line-height: 1.45; letter-spacing: .5px; }

.article-header p { display: flex; justify-content: center; gap: 42px; margin: 15px 0 0; color: #7b899d; }

.article-content { max-width: 900px; margin: 30px auto 0; color: #000000; }

.article-content p { margin: 0 0 21px; line-height: 2; text-align: justify; text-indent: 2rem; font-size: var(--font-size-h4);}

.article-content img { max-width: 100%; height: auto !important; display: block; margin: 24px auto; object-fit: contain; }

.article-content .pic { margin: 24px 0 30px; text-align: center; }

.article-content .pic img { margin: 0 auto; }

.article-content ul { margin: 20px 0 26px; padding-left: 1.5em; line-height: 1.8; }

.article-content .ts-1 { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; padding: 0; list-style: none; }

.article-content .ts-1 li { min-width: 0; padding: 16px; color: #53647c; text-align: center; border: 1px solid #dce8f7; border-radius: 8px; background: #f7faff; }

.article-content .ts-1 img { margin: 12px auto 0; }

.article-content .display_flex { display: flex; }

.article-content .flex-direction_column { flex-direction: column; }

.article-content .align-items_flex-end { align-items: flex-end; }

.article-content .dot-text { color: #000000; font-weight: 600; }
.article-content .dot-text::before { content: "•"; color: black; margin-right: 0.5em; font-size: 1.2em;}

.article-content .list-check::before { display: inline-grid; width: 1.4em; height: 1.4em; place-items: center; margin-right: .55em; color: #000000; border-radius: 50%; content: "✓"; font-size: .8em; }

.article-content blockquote { position: relative; min-height: 64px; display: flex; align-items: center; gap: 16px; margin: 24px 0 26px; padding: 13px 22px; color: #086ce9; border: 1px solid #4f9cff; border-radius: 6px; background: linear-gradient(90deg,#f1f7ff,#fbfdff); }

.article-content blockquote span { height: 38px; color: var(--blue); line-height: 1; }

.article-content blockquote strong { letter-spacing: .3px; }

.article-content section h2 { position: relative; margin: 25px 0 12px; padding-left: 16px; color: #112a51; line-height: 1.5; }

.article-content section h2::before { position: absolute; top: 5px; bottom: 5px; left: 0; width: 4px; border-radius: 3px; background: var(--blue); content: ""; }

.ai-architecture { position: relative; display: grid; grid-template-columns: 1fr 24px 1fr 24px 1.55fr 24px 1fr 24px 1fr; align-items: stretch; gap: 5px; margin: 26px 0 28px; padding: 24px 16px 47px; color: #44617f; border: 1px solid #c6ddfa; border-radius: 8px; background: linear-gradient(180deg,#f5faff,#edf6ff); }

.architecture-stage { min-width: 0; display: flex; flex-direction: column; gap: 9px; padding: 11px 8px; text-align: center; border: 1px solid #d5e5f8; border-radius: 6px; background: rgba(255,255,255,.76); }

.architecture-stage h3 { margin: 0 0 4px; color: #1677ff; }

.architecture-stage span { padding: 5px 2px; border-radius: 4px; background: #f0f6ff; white-space: nowrap; }

.architecture-core { align-items: center; }

.architecture-core img { width: 82px; height: 82px; object-fit: contain; }

.architecture-core span { white-space: normal; }

.ai-architecture > i { align-self: center; color: var(--blue); font-style: normal; }

.ai-architecture > p { position: absolute; right: 18px; bottom: 12px; left: 18px; margin: 0; color: #1677ff; text-align: center; font-weight: 600; }

.ai-architecture > p::before,.ai-architecture > p::after { width: 28%; height: 1px; display: inline-block; margin: 0 12px 4px; content: ""; background: repeating-linear-gradient(90deg,#5ba5ff 0 3px,transparent 3px 6px); }

.article-siblings { display: grid; grid-template-columns: 1fr 1fr; gap: 34px; margin-top: 34px; padding: 23px 2px; border-top: 1px solid #dce5f1; }

.article-siblings a { min-width: 0; overflow: hidden; color: #5e6e83; text-overflow: ellipsis; white-space: nowrap; transition: color .2s ease; }

.article-siblings a:hover { color: var(--blue); }

.article-siblings a:last-child { text-align: right; }

.article-siblings .article-siblings-back:last-child { text-align: left; }

.article-siblings span { margin: 0 9px; color: var(--blue); }

@media (max-width: 960px) {
.article-card { padding-right: 38px; padding-left: 38px; }
.ai-architecture { grid-template-columns: repeat(5,1fr); gap: 8px; }
.ai-architecture > i { display: none; }
.architecture-stage span { white-space: normal; }
}

@media (max-width: 700px) {
.article-page { padding: 28px 0 38px; }
.article-shell { width: min(100% - 24px,var(--page)); }
.article-card { padding: 28px 18px 0; border-radius: 9px; }
.article-header { padding-bottom: 20px; }
.article-header h1 { line-height: 1.5; }
.article-header p { display: block; margin-top: 12px; line-height: 1.8; }
.article-header p span { display: block; }
.article-content { margin-top: 22px; }
.article-content > p,.article-content section > p { line-height: 1.9; }
.article-content .ts-1 { grid-template-columns: 1fr; gap: 14px; }
.article-content blockquote { align-items: flex-start; padding: 14px 15px; }
.article-content blockquote span { height: 27px; }
.article-content blockquote strong { padding-top: 5px; line-height: 1.65; }
.ai-architecture { grid-template-columns: 1fr; gap: 8px; padding: 15px 14px 45px; }
.architecture-stage { padding: 12px; }
.architecture-core img { width: 72px; height: 72px; }
.ai-architecture > p::before,.ai-architecture > p::after { width: 14%; margin-right: 7px; margin-left: 7px; }
.article-siblings { grid-template-columns: 1fr; gap: 12px; margin-top: 25px; padding: 18px 0; }
.article-siblings a,.article-siblings a:last-child { text-align: left; white-space: normal; line-height: 1.6; }
.article-siblings a:last-child span { float: right; }
}