/* 智慧文書系統｜資源／知識庫　樣式表　建置日 1150805
   配色沿用官網 index.html：深藍 #0C1B30 / #12253F，金 #E4C67A。
   全站唯一刻意做重的視覺是 .doc-paper（公文範例紙）——因為那就是產品本身在做的事。 */

:root{
  --navy-900:#0C1B30; --navy-800:#12253F; --navy-700:#16244F;
  --gold:#E4C67A; --gold-deep:#B08C36;
  --ink-900:#101828; --ink-700:#344054; --ink-500:#667085;
  --line:#E4E7EC; --line-soft:#F0F2F5;
  --bg:#FFFFFF; --bg-soft:#F7F9FC;
  --blue-600:#2563EB;
  --paper:#FFFDF7; --paper-line:#E3DCC8;
  --kai:"DFKai-SB","BiauKai","標楷體","TW-Kai","Noto Serif TC",serif;
  --sans:"Inter","Noto Sans TC","PingFang TC","Microsoft JhengHei",-apple-system,system-ui,sans-serif;
  --wrap:min(100% - 2.4rem, 1080px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink-900);font-family:var(--sans);
  font-size:17px;line-height:1.85;letter-spacing:.01em}
.wrap{width:var(--wrap);margin-inline:auto}
a{color:var(--blue-600);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
.skip{position:absolute;left:-9999px}
.skip:focus{left:1rem;top:1rem;z-index:99;background:#fff;padding:.6rem 1rem;border-radius:8px}

/* ── 頁首 ───────────────────────────────────────── */
.top{background:var(--navy-900);color:#fff;position:sticky;top:0;z-index:20;
  border-bottom:1px solid rgba(228,198,122,.22)}
.top-in{display:flex;align-items:center;gap:1.2rem;min-height:60px}
.brand{display:flex;align-items:center;gap:.62rem;line-height:0;flex:0 0 auto}
.brand img{height:34px;width:auto;display:block}
.brand:focus-visible{outline:2px solid var(--gold);outline-offset:4px;border-radius:4px}
.bwm{display:flex;flex-direction:column;justify-content:center;line-height:1}
.bwm-1{font-size:1.02rem;font-weight:700;letter-spacing:.19em;color:#fff;white-space:nowrap}
.bwm-1 i{font-style:normal;color:#7FB0F0}
.bwm-2{margin-top:.26rem;font-size:.66rem;font-weight:500;letter-spacing:.3em;
  color:#C7D2E6;white-space:nowrap;text-indent:.3em}
.foot-brand-lk{display:flex;align-items:center;gap:.62rem}
@media(max-width:520px){.brand img{height:28px}.bwm-1{font-size:.9rem}.bwm-2{display:none}}
.topnav{display:flex;gap:1.15rem;margin-left:auto;font-size:.93rem;flex-wrap:wrap}
.topnav a{color:#C7D2E6}
.topnav a:hover{color:#fff;text-decoration:none}
.topnav a.is-on{color:var(--gold)}
.cta{border:1px solid rgba(228,198,122,.5);color:var(--gold);padding:.34rem .85rem;
  border-radius:999px;font-size:.88rem;white-space:nowrap}
.cta:hover{background:rgba(228,198,122,.12);text-decoration:none}
@media(max-width:720px){.top-in{flex-wrap:wrap;padding-block:.6rem}.cta{display:none}}

/* ── 麵包屑 ─────────────────────────────────────── */
.crumb{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;font-size:.85rem;
  color:var(--ink-500);margin:1.6rem 0 .8rem}
.crumb span[aria-hidden]{color:#C0C7D2}

/* ── 文章 ───────────────────────────────────────── */
.art{padding-bottom:3rem}
.post-h h1{font-size:clamp(1.6rem,3.4vw,2.25rem);line-height:1.35;margin:.2rem 0 .55rem;
  letter-spacing:-.01em}
.post-m{color:var(--ink-500);font-size:.86rem;margin:0 0 1rem}
.lede{font-size:1.06rem;color:var(--ink-700);border-left:3px solid var(--gold);
  padding-left:1rem;margin:1rem 0 1.6rem}
.post-b h2{font-size:1.38rem;margin:2.6rem 0 .8rem;padding-bottom:.45rem;
  border-bottom:1px solid var(--line);letter-spacing:-.005em}
.post-b h3{font-size:1.12rem;margin:1.9rem 0 .6rem;color:var(--navy-800)}
.post-b h4{font-size:1rem;margin:1.4rem 0 .5rem;color:var(--ink-700)}
.post-b p{margin:.9rem 0}
.post-b ul,.post-b ol{padding-left:1.5rem;margin:.9rem 0}
.post-b li{margin:.38rem 0}
.post-b blockquote{margin:1.2rem 0;padding:.15rem 0 .15rem 1.1rem;
  border-left:3px solid var(--line);color:var(--ink-700)}
.post-b code{background:var(--line-soft);padding:.1em .38em;border-radius:5px;
  font-size:.9em;font-family:ui-monospace,Menlo,monospace}
.post-b pre{background:var(--navy-900);color:#E6EDF6;padding:1rem 1.1rem;border-radius:10px;
  overflow-x:auto;font-size:.9rem;line-height:1.7}
.post-b pre code{background:none;color:inherit;padding:0}
.post-b hr{border:0;border-top:1px solid var(--line);margin:2.2rem 0}
.anch{opacity:0;margin-left:.4rem;color:var(--gold-deep);font-weight:400;text-decoration:none}
h2:hover .anch,h3:hover .anch{opacity:1}

/* 表格：窄螢幕自己捲，頁面本體不橫向捲 */
.tw{overflow-x:auto;margin:1.3rem 0;border:1px solid var(--line);border-radius:10px}
table{border-collapse:collapse;width:100%;font-size:.94rem;min-width:520px}
thead th{background:var(--navy-800);color:#fff;font-weight:600;text-align:left;
  padding:.7rem .85rem;white-space:nowrap}
td{padding:.65rem .85rem;border-top:1px solid var(--line);vertical-align:top}
tbody tr:nth-child(even){background:var(--bg-soft)}

/* ── 目錄 ───────────────────────────────────────── */
.toc{background:var(--bg-soft);border:1px solid var(--line);border-left:3px solid var(--gold);
  border-radius:10px;padding:1rem 1.2rem;margin:1.8rem 0}
.toc-t{margin:0 0 .5rem;font-size:.84rem;font-weight:700;letter-spacing:.08em;
  color:var(--ink-500)}
.toc ul{margin:0;padding:0;list-style:none;font-size:.94rem}
.toc li{margin:.26rem 0}
.toc ul ul{margin:.2rem 0 .4rem;padding-left:1.1rem;font-size:.9rem}
.toc ul ul li{margin:.15rem 0}
.toc ul ul li::before{content:"–　";color:#B9C1CC}
.toc a{color:var(--ink-700)}
.toc a:hover{color:var(--blue-600)}

/* ── 提醒方框 ───────────────────────────────────── */
.box{margin:1.5rem 0;padding:1rem 1.15rem;border-radius:10px;border:1px solid var(--line);
  background:var(--bg-soft)}
.box .box-t{margin:0 0 .4rem;font-weight:700;font-size:.92rem;letter-spacing:.02em}
.box p:last-child{margin-bottom:0}
.box-note{border-left:3px solid var(--navy-700)}
.box-note .box-t{color:var(--navy-800)}
.box-warn{border-left:3px solid var(--gold-deep);background:#FEFAF0;border-color:#F2E6C9}
.box-warn .box-t{color:#8A6A18}

/* ══════════════════════════════════════════════════
   公文範例紙 — 本站招牌
   ══════════════════════════════════════════════════ */
.doc-paper{
  position:relative;margin:2rem 0;padding:2.1rem 2.2rem 1.7rem;
  background:var(--paper);
  border:1px solid var(--paper-line);border-top:3px solid var(--gold);
  border-radius:4px;
  box-shadow:0 1px 2px rgba(16,24,40,.05),0 12px 28px -18px rgba(12,27,48,.5);
}
.doc-flag{
  position:absolute;top:0;right:1.4rem;transform:translateY(-50%);
  background:var(--navy-900);color:var(--gold);
  font-size:.68rem;letter-spacing:.16em;padding:.24rem .7rem;border-radius:3px;
  font-family:var(--sans)
}
.doc-head{border-bottom:1px dashed var(--paper-line);padding-bottom:.9rem;margin-bottom:1.2rem}
.doc-arch{display:flex;justify-content:flex-end;gap:1.6rem;font-family:var(--kai);
  font-size:.86rem;color:#8C826A;letter-spacing:.05em}
.doc-meta{display:flex;flex-wrap:wrap;gap:.35rem 1.8rem;margin-top:.6rem;
  font-family:var(--kai);font-size:.94rem;color:#4A4433}
.doc-meta b{font-weight:400;color:#8C826A}
.doc-body{font-family:var(--kai);font-size:1.06rem;line-height:2.05;color:#1A1A1A;
  letter-spacing:.03em}
.doc-body p{margin:.5rem 0}
/* 主旨／說明／辦法：段名吊掛，回行對齊首字，和實際公文一樣 */
.doc-body .d-seg{padding-left:5em;text-indent:-5em}
.doc-body .d-item.d-1{padding-left:7em;text-indent:-2em}
.doc-body .d-item.d-2{padding-left:9.5em;text-indent:-2.5em}
.doc-body .d-qa{padding-left:2.4em;text-indent:-2.4em}
.doc-paper > .doc-body:first-of-type{margin-top:.4rem}
.doc-cap{margin-top:1.3rem;padding-top:.8rem;border-top:1px dashed var(--paper-line);
  font-family:var(--sans);font-size:.85rem;color:var(--ink-500);line-height:1.7}
@media(max-width:640px){
  .doc-paper{padding:1.6rem 1.1rem 1.3rem}
  .doc-body{font-size:1rem;line-height:1.95}
  .doc-body .d-seg{padding-left:3.4em;text-indent:-3.4em}
  .doc-body .d-item.d-1{padding-left:4.6em;text-indent:-1.6em}
  .doc-body .d-item.d-2{padding-left:6.2em;text-indent:-1.9em}
  .doc-body .d-qa{padding-left:2.2em;text-indent:-2.2em}
  .doc-arch{flex-direction:column;gap:.15rem;align-items:flex-end}
}

/* ── 延伸閱讀 / 卡片 ────────────────────────────── */
.rel{margin-top:3rem}
.rel h2{font-size:1.2rem;border-bottom:1px solid var(--line);padding-bottom:.45rem}
/* auto-fill（非 auto-fit）：分類底下只有一篇時，卡片不會被拉成整列寬 */
.rel-grid,.grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.rel-card,.card{display:block;border:1px solid var(--line);border-radius:12px;padding:1.1rem 1.2rem;
  background:#fff;transition:border-color .15s,box-shadow .15s,transform .15s;color:inherit}
.rel-card:hover,.card:hover{border-color:var(--gold);text-decoration:none;transform:translateY(-2px);
  box-shadow:0 10px 24px -18px rgba(12,27,48,.55)}
.rel-k,.card-k{display:inline-block;font-size:.72rem;letter-spacing:.1em;color:var(--gold-deep);
  border:1px solid #EADFC2;background:#FDF8EC;padding:.1rem .5rem;border-radius:999px}
.rel-t{display:block;font-weight:700;margin:.55rem 0 .35rem;color:var(--navy-800);line-height:1.5}
.rel-d,.card p{display:block;font-size:.9rem;color:var(--ink-500);line-height:1.7;margin:.35rem 0 0}
.card h3{margin:.6rem 0 .3rem;font-size:1.06rem;color:var(--navy-800);line-height:1.5}
.card-m{display:block;margin-top:.7rem;font-size:.78rem;color:#98A2B3}

/* ── 頁內導購（克制）────────────────────────────── */
.promo{margin:3rem 0 0;padding:1.5rem 1.6rem;border-radius:14px;
  background:linear-gradient(180deg,var(--navy-900),var(--navy-800));color:#D7E0EE}
.promo-t{margin:0 0 .5rem;color:var(--gold);font-weight:700;font-size:1.05rem}
.promo p{margin:.5rem 0;font-size:.95rem;line-height:1.8}
.btn{display:inline-block;margin:.7rem .6rem 0 0;padding:.55rem 1.15rem;border-radius:999px;
  background:var(--gold);color:var(--navy-900);font-weight:700;font-size:.92rem}
.btn:hover{text-decoration:none;filter:brightness(1.06)}
.btn-ghost{background:transparent;color:var(--gold);border:1px solid rgba(228,198,122,.5)}

/* ── 知識庫首頁 ─────────────────────────────────── */
.kb{padding-bottom:3rem}
.kb-h h1{font-size:clamp(1.7rem,3.6vw,2.3rem);margin:.2rem 0 .7rem}
.kb-sub{font-size:.88rem;color:var(--ink-500)}
.cat{margin-top:2.4rem}
.cat h2{font-size:1.16rem;border-bottom:1px solid var(--line);padding-bottom:.45rem;
  margin-bottom:1.1rem}

/* ── 頁尾 ───────────────────────────────────────── */
.foot{margin-top:3.5rem;background:var(--navy-900);color:#AFBBD0;font-size:.86rem;
  padding:2.2rem 0 2.6rem;line-height:1.85}
.foot a{color:#D7E0EE;text-decoration:underline}
.foot-logo{height:34px;width:auto;display:block;margin:0 0 1.3rem;opacity:.85}
.foot-dis{border:1px dashed rgba(228,198,122,.32);border-radius:8px;padding:.9rem 1.1rem;
  margin:0 0 1.3rem;color:#C5D0E2}
.foot-org{margin:0 0 1.2rem}
.foot-org b{color:#fff}
.foot-bot{margin:0;padding-top:1.1rem;border-top:1px solid rgba(255,255,255,.1);
  font-size:.8rem;color:#8A97AE}

/* ── 列印：把公文範例紙印得像公文 ───────────────── */
@media print{
  .top,.promo,.rel,.toc,.foot-bot,.cta{display:none!important}
  body{font-size:12pt}
  .doc-paper{box-shadow:none;border:1px solid #999;page-break-inside:avoid}
  a{color:inherit;text-decoration:none}
}
