/* 知識專欄 /journal/ 與文章頁 /journal/{slug}/ */
.j-head{padding-top:64px;row-gap:24px}
.j-head .breadcrumb{grid-column:1/-1;margin-bottom:24px}
.j-head__title{grid-column:1/span 6;display:flex;flex-direction:column;gap:20px}
.j-head__lede{grid-column:8/span 5;align-self:end;font-size:17px;line-height:1.9;color:var(--c-ink-2)}

.j-list{padding-bottom:var(--section-y)}
.j-list__cats{display:flex;flex-direction:column;gap:12px;border-top:1px solid var(--c-ink);padding-top:16px;align-self:start}
.j-list__cats span{display:flex;justify-content:space-between;font-size:15px;color:var(--c-ink-2)}
.j-list__cats b{font-weight:400;font-family:var(--f-mono);font-size:11px}
.post-row.is-soon{color:var(--c-ink-2)}
.post-row.is-soon .post-row__title{color:var(--c-ink-2)}
.post-row.is-soon:hover .post-row__title{color:var(--c-ink-2)}
.post-row__soon{color:var(--c-accent)}
.post-row .media__placeholder{font-size:9px;letter-spacing:.08em;padding:4px}

/* 文章 */
.article{padding-top:64px}
.article__grid{row-gap:0}
.article__meta{grid-column:1/span 3;position:sticky;top:calc(var(--header-h-compact) + 32px);align-self:start;display:flex;flex-direction:column;gap:24px}
.article__meta .kv__row{grid-template-columns:64px 1fr;padding:10px 0}
.article__meta .kv__row dd{font-family:var(--f-mono);font-size:12px;letter-spacing:.04em}
.article__main{grid-column:5/span 7;min-width:0}
.article__header{display:flex;flex-direction:column;gap:20px;padding-bottom:40px}
.article__title{font-family:var(--f-serif);font-weight:600;font-size:44px;line-height:1.3;letter-spacing:-0.01em}
.article__lede{font-size:18px;line-height:1.9;color:var(--c-ink-2)}
.article__figure{margin:0 0 48px}
.article__figure .media{aspect-ratio:4/3}
.article__figure figcaption{margin-top:12px}

.prose{max-width:680px;font-size:17px;line-height:1.95}
.prose>*+*{margin-top:1.2em}
.prose h2{font-family:var(--f-serif);font-weight:600;font-size:26px;line-height:1.4;margin-top:2.2em;padding-top:20px;border-top:1px solid var(--c-line);display:flex;gap:16px;align-items:baseline}
.prose h2 .n{font-family:var(--f-mono);font-size:12px;font-weight:400;letter-spacing:.14em;color:var(--c-accent);flex:none}
.prose h3{font-family:var(--f-serif);font-weight:500;font-size:19px;line-height:1.5;margin-top:1.8em}
.prose strong{font-weight:500;color:var(--c-ink)}
.prose a{color:var(--c-ink);border-bottom:1px solid var(--c-ink)}
.prose a:hover{color:var(--c-accent);border-color:var(--c-accent)}
.prose ul{display:flex;flex-direction:column;gap:6px}
.prose ul li{position:relative;padding-left:20px}
.prose ul li::before{content:"—";position:absolute;left:0;color:var(--c-ink-2)}
.prose .numbered-list,.prose .compare,.prose .spec-table{margin-top:24px}
.prose .numbered-list li{padding:14px 0;font-size:16px;line-height:1.7}
.prose .numbered-list .code{font-family:var(--f-mono);font-size:12px;color:var(--c-accent);margin-left:8px;white-space:nowrap}
.prose .compare__row{grid-template-columns:120px 1fr 1fr;gap:20px;padding:16px 0}
.prose .compare__a,.prose .compare__b{font-size:14px}
.prose .compare__k{font-size:16px}
.prose .note{font-size:13px;line-height:1.8;color:var(--c-ink-2);border-left:1px solid var(--c-ink);padding-left:20px}
.prose .quote{margin-top:32px}
.prose .quote .quote-text{font-size:22px}

.article__end{margin-top:72px;border-top:1px solid var(--c-ink);padding-top:24px;display:flex;flex-direction:column;gap:8px}
.related{padding-top:96px}
.related .post-list{margin-top:24px}

.j-cta{margin-top:var(--section-y)}
.j-cta__title{font-family:var(--f-serif);font-weight:600;font-size:40px;line-height:1.3}
.j-cta p{margin-top:16px;max-width:460px}

@media (max-width:1100px){
  .article__title{font-size:36px}
  .article__main{grid-column:5/span 8}
}
@media (max-width:767px){
  .j-head{padding-top:32px}
  .j-head .breadcrumb{margin-bottom:8px}
  .j-head__lede{font-size:16px}
  .j-list__cats{display:none}
  .article{padding-top:32px}
  .article__meta{position:static;gap:16px;margin-bottom:24px}
  .article__meta .kv{display:none}
  .article__title{font-size:28px}
  .article__lede{font-size:16px}
  .article__header{padding-bottom:28px}
  .article__figure{margin-bottom:32px}
  .prose{font-size:16px}
  .prose h2{font-size:21px}
  .prose .compare__row{grid-template-columns:1fr 1fr;gap:6px 12px}
  .prose .compare__a,.prose .compare__b{font-size:13px}
  .article__end{margin-top:48px}
  .related{padding-top:64px}
  .j-cta__title{font-size:26px}
}

/* 文章內表格與文末常見問題 */
.prose .j-table{margin:24px 0}
.prose .j-table td,.prose .j-table th{font-size:13px}
.article__faq{margin-top:64px;display:flex;flex-direction:column;gap:20px}
.article__faq .faq__text{font-size:18px}
@media (max-width:767px){.article__faq{margin-top:48px}.article__faq .faq__text{font-size:16px}}