/* ============================================================
   layout.css — 版型外殼（統一：首頁與文章頁共用同一套）
   .container = 內容置中；.shell = 三欄（左 / 中 / 右）
   ============================================================ */

/* 內容置中容器（header / 其他區塊用） */
.container{ max-width: var(--container); margin:0 auto; padding: 0 var(--pad-x); }

/* ---- 站頭 ---- */
header.site-header{
  border-bottom: 3px double var(--ink);
  padding: 36px 0 22px;
  background: var(--paper);
  position: relative;
}
.subtitle{ color: var(--ink-soft); font-size:.98rem; }

/* ---- 報頭（居中，全站一致） ---- */
.masthead{ text-align:center; }
.masthead h1{ font-family: var(--font-display); font-size: clamp(2rem,5vw,2.9rem); margin:.12em 0 .1em; letter-spacing:1px; color: var(--ink); }
.masthead h1 a{ text-decoration:none; color:inherit; }
.masthead h1 .dot{ color: var(--stamp-red); }
.masthead .subtitle{ margin:.3em auto 0; max-width:54ch; }

/* ---- 三欄外殼（統一） ---- */
.shell{
  max-width: var(--container); margin:0 auto; padding: 24px var(--pad-x) 70px;
  display:grid; grid-template-columns: var(--rail-left) minmax(0,1fr) var(--rail-right);
  gap: var(--gap); align-items:start;
}
.shell-left, .shell-right{ position:sticky; top:20px; }
.shell-main{ min-width:0; }

/* ---- 頁尾 ---- */
footer{ text-align:center; padding:30px 0 50px; color: var(--ink-soft); font-family: var(--font-mono); font-size:.8rem; }
.credit{ margin-top:8px; font-size:.7rem; opacity:.75; }
.credit a{ color:inherit; }
.footer-nav{ margin-bottom:10px; }
.footer-nav a{ color:inherit; text-decoration:none; margin:0 8px; }
.footer-nav a:hover{ text-decoration:underline; }

/* ---- 響應式：三欄收合成單欄 ---- */
@media (max-width:960px){
  .shell{ grid-template-columns:1fr; gap:22px; padding:24px 18px 70px; }
  .shell-left, .shell-right{ position:static; }
}

/* ---- 響應式：手機縮小報頭，避免大標題撐寬版面 ---- */
@media (max-width:600px){
  header.site-header{ padding:26px 0 18px; }
  .masthead h1{ font-size:1.7rem; letter-spacing:.5px; }
  .masthead .subtitle{ font-size:.9rem; }
}
