/* =========================================================================
   最新消息：列表卡片＋文章頁共用樣式（2026-11-03）
   新增文章：複製 news/ 底下任一篇文章資料夾改內容，再把卡片加到
   news/index.html 最上面、首頁「最新消息」換成最新 3 篇。
   /assets/* 快取一年，改這支檔要換 HTML 引用的 ?v= 版本號。
   ========================================================================= */

/* ---- 列表 ---- */
.news{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:36px}
.news__card{border:1px solid var(--line);overflow:hidden;display:flex;flex-direction:column;background:#fff;color:inherit;transition:box-shadow .2s,transform .2s}
a.news__card:hover{box-shadow:0 12px 30px rgba(0,0,0,.08);transform:translateY(-2px)}
a.news__card:hover .news__title{text-decoration:underline;text-underline-offset:3px}
.news__media{position:relative;aspect-ratio:16/10;background:var(--bg-2);overflow:hidden;flex:0 0 auto}
.news__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.news__body{padding:22px;display:flex;flex-direction:column;flex:1}
.news__tag{font-size:12px;font-weight:800;letter-spacing:.1em;color:var(--sub)}
.news__title{font-size:17px;font-weight:800;margin:8px 0 8px;line-height:1.45}
.news__ex{font-size:14px;color:var(--ink-2);line-height:1.7;margin-bottom:12px}
.news__date{font-size:12px;color:var(--sub);margin-top:auto}
.news__card[hidden]{display:none}
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.filters button{font:inherit;font-size:14px;font-weight:700;padding:9px 18px;min-height:40px;border:1px solid var(--line);background:#fff;color:var(--ink-2);cursor:pointer}
.filters button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
@media(max-width:820px){.news{grid-template-columns:1fr}}

/* ---- 文章頁 ---- */
.art{max-width:780px;margin:0 auto}
.art .crumb{font-size:13px;color:var(--sub);margin-bottom:22px}
.art .crumb a:hover{color:var(--ink)}
.art__tag{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.12em;color:var(--sub);border:1px solid var(--line);padding:4px 10px}
.art h1{font-size:clamp(26px,4.2vw,40px);line-height:1.3;margin-top:14px}
.art__meta{font-size:13px;color:var(--sub);margin-top:14px;line-height:1.7}
.art__hero{margin:28px 0 8px;aspect-ratio:3/2;background:var(--bg-2);overflow:hidden}
.art__hero img{width:100%;height:100%;object-fit:cover;display:block}
.art__lead{font-size:17px;line-height:1.9;color:var(--ink);margin-top:26px;font-weight:500}
.art h2{font-size:21px;margin-top:44px;padding-top:24px;border-top:1px solid var(--line)}
.art h3{font-size:17px;margin-top:26px}
.art p,.art li{font-size:16px;line-height:1.95;color:var(--ink-2)}
.art p{margin-top:14px}
.art ul,.art ol{margin:12px 0 0 22px}
.art li{margin-top:6px}
.art a:not(.btn){text-decoration:underline;text-underline-offset:3px}
.art figure{margin:26px 0 0}
.art figure img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;background:var(--bg-2)}
.art figcaption{font-size:13px;color:var(--sub);margin-top:8px;line-height:1.6}
.art .tbl{overflow-x:auto;margin-top:16px;-webkit-overflow-scrolling:touch}
.art table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:480px}
.art th,.art td{border:1px solid var(--line);padding:11px 13px;text-align:left;vertical-align:top;line-height:1.65}
.art thead th{background:var(--bg-2);font-weight:800;white-space:nowrap}
.art tbody th{background:var(--bg-2);font-weight:700;white-space:nowrap}
.art .note{background:var(--bg-2);border-left:3px solid var(--ink);padding:16px 20px;margin-top:28px}
.art .note p{margin-top:6px;font-size:15px}
.art .note p:first-child{margin-top:0}
.art__src{margin-top:40px;padding-top:20px;border-top:1px solid var(--line);font-size:13.5px;color:var(--sub);line-height:1.8}
.art__src a{color:var(--ink-2)}
.art__cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.art__more{margin-top:56px}
.art__more h2{border-top:none;padding-top:0;margin-top:0;font-size:19px}
.art__more .news{grid-template-columns:repeat(3,1fr);margin-top:18px}
@media(max-width:820px){.art__more .news{grid-template-columns:1fr}}
@media(max-width:760px){
  .art p,.art li{font-size:15.5px}
  .art__lead{font-size:16px}
  .art h2{font-size:19px;margin-top:36px}
  .art__cta .btn{flex:1 1 100%;text-align:center}
}