/* 免費包網站｜視覺系統 r002（CH8 三層提示法之「設計」層；日後對外頁面沿用同一套）
 *
 * 概念：一間安靜、可信的工作室門面。來的人沒有技術背景，進門三秒要知道
 *       「這是一個專業產品的免費入口」，而不是被丟給一份 README。
 *
 * 設計（本輪定調，r002）：
 *   1. 紙＝暖燕麥（比一般米白更深、更有紙纖維感），墨＝暖黑。
 *   2. 唯一強調色＝黃銅（brass）。**主 CTA 反而用墨黑實心**——全站最高對比落在
 *      唯一的轉化點上，其餘一律安靜。這是本站刻意的反轉：多數頁面把強調色給了
 *      按鈕，於是按鈕跟裝飾同色、權重被稀釋。
 *   3. 標題襯線、正文無襯線、數字與代碼等寬（規格明列）。
 *   4. 簽名元素＝**進度軌**：教材本身是有序列的（「先完成 04 再讀 06，順序反過來
 *      會失去對照基準」），所以編號不是裝飾，是內容。編號以等寬字懸掛在一條
 *      黃銅髮絲線旁，成為教材目錄與首頁步驟的共同骨架。
 *
 * 明確不要（規格排雷，逐項對應）：企業藍｜預設字體排版｜瀏覽器預設連結樣式｜
 *   AI 生成感漸層｜過度對稱｜圓角陰影卡片堆砌之模板感｜光暈｜表情符號當 UI｜霓虹色。
 *   （教材內文的 🔴 屬內容不屬裝飾，保留。）
 *
 * 手機優先；零外部資源請求（無 web font、無 CDN、無追蹤像素）——字體全部走本機堆疊。
 */

:root {
  /* 紙與墨 */
  --paper:    #F1EBDF;
  --paper-2:  #EAE2D2;
  --paper-3:  #E1D7C3;
  --card:     #F7F3EA;
  --ink:      #191510;
  --ink-2:    #4E463A;
  --ink-3:    #7C7161;
  --rule:     #D8CDB8;
  --rule-2:   #C4B69C;

  /* 黃銅＝唯一強調色 */
  --brass:      #9A6B14;
  --brass-2:    #7E5710;
  --brass-soft: #E7DCC2;

  /* 主 CTA＝墨黑實心（本站之反轉） */
  --cta:       #191510;
  --cta-hover: #000000;
  --cta-ink:   #F7F3EA;

  --font-serif: "Noto Serif TC", "Source Han Serif TC", "Songti TC", Georgia,
                "Times New Roman", PMingLiU, MingLiU, serif;
  --font-sans:  "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui,
                -apple-system, "Segoe UI", "Hiragino Sans TC", sans-serif;
  --font-mono:  Consolas, ui-monospace, SFMono-Regular, "Cascadia Mono",
                "Noto Sans Mono", "Courier New", monospace;

  --wide: 64rem;
  --measure: 40rem;
  --rail: 3.25rem;      /* 進度軌之懸掛欄寬 */
}

@media (prefers-color-scheme: dark) {
  :root {
    --paper:    #14120E;
    --paper-2:  #1B1813;
    --paper-3:  #241F18;
    --card:     #1C1913;
    --ink:      #EFE7D8;
    --ink-2:    #B3A894;
    --ink-3:    #8B8070;
    --rule:     #2E2820;
    --rule-2:   #443B2E;

    --brass:      #D2A24B;
    --brass-2:    #E4B764;
    --brass-soft: #2A2318;

    --cta:       #EFE7D8;
    --cta-hover: #FFFFFF;
    --cta-ink:   #14120E;
  }
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 1.85;
  letter-spacing: 0.01em;
  overflow-wrap: break-word;
  font-kerning: normal;
}

/* 連結：不用瀏覽器預設樣式（排雷項）。正文連結＝墨色＋黃銅底線，hover 才換色。 */
a { color: inherit; text-decoration: none; }
a:focus-visible, button:focus-visible, input:focus-visible {
  outline: 2px solid var(--brass); outline-offset: 3px; border-radius: 2px;
}

img, svg { max-width: 100%; height: auto; }

.wrap { width: 100%; max-width: var(--wide); margin: 0 auto; padding: 0 1.5rem; }
.narrow { max-width: calc(var(--measure) + 3rem); }

.skip {
  position: absolute; left: -9999px; top: 0; background: var(--ink);
  color: var(--cta-ink); padding: 0.6rem 1rem; z-index: 100;
}
.skip:focus { left: 0; }

/* ---------- 頁首：髮絲線，不做玻璃感 ---------- */
.site-header {
  position: sticky; top: 0; z-index: 40;
  background: var(--paper);
  border-bottom: 1px solid var(--rule);
}
.site-header .wrap {
  display: flex; align-items: center; gap: 1rem;
  min-height: 3.5rem; justify-content: space-between;
}
.brand { display: flex; align-items: baseline; gap: 0.55rem; color: var(--ink); min-width: 0; }
.brand b {
  font-family: var(--font-serif); font-size: 1.06rem; font-weight: 600;
  letter-spacing: 0.01em; white-space: nowrap;
}
.brand span {
  font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.1em;
  color: var(--ink-3); text-transform: uppercase; white-space: nowrap;
}
/* 窄螢幕：品牌名不斷行、標籤讓位、導覽收緊——否則頁首會塌成直排 */
@media (max-width: 27rem) {
  .brand b { font-size: 0.92rem; }
  .brand span { display: none; }
}
.nav { display: flex; align-items: center; gap: 1.25rem; font-size: 0.88rem; flex: none; }
.nav a { white-space: nowrap; }
@media (max-width: 30rem) { .nav { gap: 0.9rem; font-size: 0.84rem; } }
.nav a { color: var(--ink-2); padding: 0.2rem 0; border-bottom: 1px solid transparent; }
.nav a:hover { color: var(--ink); border-bottom-color: var(--brass); }
.nav .nav-cta { display: none; }
@media (min-width: 46rem) { .nav .nav-cta { display: inline-flex; } }

/* ---------- 按鈕 ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.55rem;
  padding: 0.9rem 1.6rem; border-radius: 2px;
  font-family: var(--font-sans); font-size: 1rem; font-weight: 600; line-height: 1.3;
  border: 1px solid transparent; cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
/* 主 CTA＝墨黑實心，全站唯一 */
.btn-primary { background: var(--cta); color: var(--cta-ink); border-color: var(--cta); }
.btn-primary:hover { background: var(--cta-hover); border-color: var(--cta-hover); color: var(--cta-ink); }
/* 次要＝只有一條線，明確低一階 */
.btn-ghost { border-color: var(--rule-2); color: var(--ink); background: transparent; }
.btn-ghost:hover { border-color: var(--ink); }
.btn-sm { padding: 0.42rem 0.9rem; font-size: 0.85rem; }

/*
 * 待啟用態（規格：「待補連結」改為設計過的待啟用態，非死鏈感）
 * 作法：保留主 CTA 的**版位與體積**（讓首屏權重不塌），改為黃銅描邊 + 墨色字，
 * 右側掛一枚等寬字標記。不用灰色、不用虛線——那兩樣正是死鏈感的來源。
 */
.btn[data-pending] { cursor: default; }
/* 主 CTA 之待啟用態：**保留完整的墨黑實心量體**，只把狀態寫在那枚等寬標記上。
 * 不降成灰色或淡色——一降，首屏最重的元素就消失了，而規格要的正是它最重。
 * 連結補上之後只是標記消失，版面權重零位移。 */
.btn-primary[data-pending] { background: var(--cta); color: var(--cta-ink); border-color: var(--cta); }
.btn-primary[data-pending]:hover { background: var(--cta); border-color: var(--cta); }
.btn-primary[data-pending] .pending { color: var(--cta-ink); opacity: 0.82; }
/* 次要元素之待啟用態才走安靜路線 */
.btn-ghost[data-pending] { background: transparent; color: var(--ink-3); border-color: var(--rule); }
.pending {
  display: inline-block; font-family: var(--font-mono);
  font-size: 0.64rem; font-weight: 600; letter-spacing: 0.06em;
  color: var(--brass); background: transparent;
  border: 1px solid currentColor; border-radius: 2px;
  padding: 0.12rem 0.42rem; vertical-align: 0.12em; white-space: nowrap;
}

/* ---------- 首屏 ---------- */
.hero { padding: 4.5rem 0 3.25rem; border-bottom: 1px solid var(--rule); }
@media (min-width: 60rem) {
  .hero .wrap {
    display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
    gap: 0 3.5rem; align-items: start;
  }
  .hero .eyebrow { grid-column: 1 / -1; }
  .hero h1, .hero .actions { grid-column: 1; }
  /* lede 與 fineprint 同欄，右欄才不會在 lede 之後留下一片空洞 */
  .hero .lede { grid-column: 2; grid-row: 2; align-self: start; margin-top: 0.55rem; }
  .hero .fineprint { grid-column: 2; grid-row: 3; align-self: start; margin-top: 0; }
}
.eyebrow {
  font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.22em;
  text-transform: uppercase; color: var(--ink-3);
  margin: 0 0 1.5rem; display: flex; align-items: center; gap: 0.75rem;
}
.eyebrow::after {
  content: ""; flex: 1; height: 1px; background: var(--rule-2); max-width: 6rem;
}
.hero h1 {
  font-family: var(--font-serif);
  font-size: clamp(1.9rem, 4.6vw, 2.75rem); line-height: 1.34;
  font-weight: 600; letter-spacing: -0.005em; margin: 0 0 1.6rem;
  text-wrap: balance;
}
/* lede 不再做成引言框（那是文件感）；改為受控行寬的旁註，靠一條黃銅短線起手 */
.hero .lede, .hero .lede.doc { margin: 0 0 2rem; max-width: 30em; }
.hero .lede p {
  margin: 0; font-size: 1.02rem; line-height: 1.95; color: var(--ink-2);
  padding-left: 1.1rem; border-left: 2px solid var(--brass);
}
.actions { display: flex; flex-wrap: wrap; gap: 0.85rem; align-items: center; }
.actions + .fineprint { margin-top: 1.25rem; }
.fineprint { font-size: 0.84rem; line-height: 1.75; color: var(--ink-3); max-width: 34em; }

/* ---------- 區塊節奏：刻意不等距，避免過度對稱 ---------- */
.section { padding: 3.5rem 0; border-bottom: 1px solid var(--rule); }
.section + .section { padding-top: 3rem; }
.section-quiet { background: var(--paper-2); }
.section > .wrap > h2, .section > .wrap > .cta-card h2 {
  font-family: var(--font-serif); font-weight: 600;
  font-size: clamp(1.35rem, 3.2vw, 1.85rem); line-height: 1.5;
  letter-spacing: 0; margin: 0 0 1.25rem;
}
.section-note { color: var(--ink-2); margin: 0 0 2rem; max-width: 34em; font-size: 0.96rem; }

/* ---------- 影片：空態不做成一塊大死灰 ---------- */
.video-frame {
  position: relative; width: 100%; max-width: 46rem;
  aspect-ratio: 16 / 9;
  background: var(--card); border: 1px solid var(--rule);
  overflow: hidden; display: flex; align-items: center; justify-content: center;
}
.video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-facade {
  appearance: none; background: none; border: 0; width: 100%; height: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 0.8rem; cursor: pointer; color: var(--ink-2); font-family: inherit; font-size: 0.95rem;
}
.video-facade .play {
  width: 3.4rem; height: 3.4rem; border-radius: 50%;
  border: 1px solid var(--brass); color: var(--brass);
  display: flex; align-items: center; justify-content: center; font-size: 1rem;
}
.video-empty {
  text-align: center; color: var(--ink-3); font-family: var(--font-mono);
  font-size: 0.8rem; letter-spacing: 0.06em; line-height: 2; padding: 1.5rem; margin: 0;
}
.video-caption { font-size: 0.88rem; color: var(--ink-2); margin-top: 1rem; max-width: 40em; }

/* ---------- 自媒體：一列一項，不做卡片堆砌 ---------- */
.social-grid {
  display: grid; gap: 0; max-width: 46rem;
  grid-template-columns: 1fr;
  border-top: 1px solid var(--rule);
}
@media (min-width: 40rem) { .social-grid { grid-template-columns: 1fr 1fr; column-gap: 2.5rem; } }
.social-item {
  display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem;
  padding: 0.95rem 0.15rem; border-bottom: 1px solid var(--rule);
  color: var(--ink); font-size: 0.96rem;
}
.social-item:hover { color: var(--brass); }
.social-item[data-pending] { color: var(--ink-3); cursor: default; }
.social-item[data-pending]:hover { color: var(--ink-3); }

/* ================= 簽名元素：進度軌 ================= *
 * 編號懸掛於左，一條黃銅髮絲線貫穿；序號是內容（順序有意義），不是裝飾。
 */
.doc-list { list-style: none; margin: 0 0 2.5rem; padding: 0; position: relative; }
.doc-list::before {
  content: ""; position: absolute; top: 1.2rem; bottom: 1.4rem;
  left: calc(var(--rail) - 1.05rem); width: 1px; background: var(--rule-2);
}
.doc-list li { position: relative; }
.doc-list a {
  display: grid; grid-template-columns: var(--rail) minmax(0, 1fr);
  gap: 0 0.9rem; align-items: baseline;
  padding: 1rem 0.15rem; color: var(--ink);
  border-bottom: 1px solid var(--rule);
}
.doc-list li:first-child a { border-top: 1px solid var(--rule); }
.doc-list a:hover { color: var(--brass); }
.doc-list a:hover .num { color: var(--cta-ink); background: var(--brass); border-color: var(--brass); }
.doc-list .num {
  font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.05em;
  color: var(--ink-3); justify-self: start;
  border: 1px solid var(--rule-2); border-radius: 2px;
  padding: 0.15rem 0.42rem; background: var(--paper);
  position: relative; z-index: 1; line-height: 1.5;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.doc-list a > span:not(.num):not(.desc) {
  font-family: var(--font-serif); font-size: 1.08rem; font-weight: 600; line-height: 1.6;
}
.doc-list .desc {
  grid-column: 2; display: block; font-size: 0.86rem; color: var(--ink-3);
  line-height: 1.75; margin-top: 0.2rem;
}
.group-title {
  font-family: var(--font-sans); font-size: 0.74rem; letter-spacing: 0.08em;
  color: var(--brass); margin: 2.75rem 0 0.9rem; font-weight: 700;
  display: flex; align-items: center; gap: 0.7rem;
}
.group-title::after { content: ""; flex: 1; height: 1px; background: var(--rule); max-width: 4rem; }
.group-title:first-of-type { margin-top: 1.5rem; }

/* 首頁區塊內的有序清單也走進度軌（那些同樣是步驟，不是文件裡的隨手列點） */
.section .doc > ol {
  list-style: none; counter-reset: step; margin: 0 0 1.5rem; padding: 0;
  position: relative; max-width: var(--measure);
}
.section .doc > ol::before {
  content: ""; position: absolute; top: 0.6rem; bottom: 0.6rem;
  left: 0.85rem; width: 1px; background: var(--rule-2);
}
.section .doc > ol > li {
  counter-increment: step; position: relative;
  padding: 0.55rem 0 0.55rem 3rem; margin: 0;
}
.section .doc > ol > li::before {
  content: counter(step, decimal-leading-zero);
  position: absolute; left: 0; top: 0.72rem;
  font-family: var(--font-mono); font-size: 0.68rem; color: var(--ink-3);
  background: var(--paper); border: 1px solid var(--rule-2); border-radius: 2px;
  padding: 0.1rem 0.34rem; line-height: 1.5;
}
.section-quiet .doc > ol > li::before { background: var(--paper-2); }

/* ---------- 教材內文 ---------- */
/* 🔴 兩欄 grid 只給「有側欄的內文頁」；教材目錄用 .narrow，不得套用
 *    （前一版此處未加 :not(.narrow)，導致目錄頁的十幾個子元素被交錯塞進兩格） */
.doc-layout { display: block; padding: 3rem 0 4rem; }
@media (min-width: 64rem) {
  .doc-layout .wrap:not(.narrow) {
    display: grid; grid-template-columns: minmax(0, 1fr) 15rem; gap: 3.5rem; align-items: start;
  }
  .doc-layout .wrap:not(.narrow) .toc { position: sticky; top: 5rem; }
}
.doc { max-width: var(--measure); }
.doc-layout .wrap.narrow > h1 {
  font-family: var(--font-serif) !important; font-weight: 600;
  line-height: 1.4; letter-spacing: 0;
}
.doc h1 {
  font-family: var(--font-serif); font-size: clamp(1.75rem, 4.6vw, 2.4rem);
  line-height: 1.42; margin: 0 0 1.75rem; font-weight: 600; letter-spacing: 0;
}
.doc h2 {
  font-family: var(--font-serif); font-size: 1.35rem; margin: 2.75rem 0 1rem;
  font-weight: 600; letter-spacing: 0; line-height: 1.55;
}
.doc h3 { font-family: var(--font-serif); font-size: 1.14rem; margin: 2.1rem 0 0.75rem; font-weight: 600; }
.doc h4, .doc h5, .doc h6 {
  font-family: var(--font-sans); font-size: 0.98rem; margin: 1.7rem 0 0.5rem; font-weight: 700;
  letter-spacing: 0.02em; color: var(--ink-2);
}
.doc h2::after {
  content: ""; display: block; width: 1.75rem; height: 2px;
  background: var(--brass); margin-top: 0.7rem;
}
.doc p { margin: 0 0 1.2rem; }
/* 正文連結：墨字＋黃銅底線（非瀏覽器預設） */
.doc p a, .doc li a, .section-note a, .fineprint a, .video-caption a {
  color: var(--ink);
  border-bottom: 1px solid var(--brass);
  padding-bottom: 0.05em;
}
.doc p a:hover, .doc li a:hover, .section-note a:hover, .fineprint a:hover { color: var(--brass); }
.doc ul, .doc ol { margin: 0 0 1.3rem; padding-left: 1.4rem; }
.doc li { margin: 0.35rem 0; }
.doc li::marker { color: var(--ink-3); }
.doc li > ul, .doc li > ol { margin: 0.35rem 0 0.45rem; }
.doc li.task { list-style: none; margin-left: -1.4rem; padding-left: 0.1rem; }
.doc li.task input { margin-right: 0.45rem; accent-color: var(--brass); }
.doc blockquote {
  margin: 1.5rem 0; padding: 0.2rem 0 0.2rem 1.2rem;
  background: transparent; border-left: 2px solid var(--brass);
  color: var(--ink-2);
}
.doc blockquote > :last-child { margin-bottom: 0; }
.doc hr { border: 0; border-top: 1px solid var(--rule); margin: 2.6rem 0; }
.doc code {
  font-family: var(--font-mono); font-size: 0.86em;
  background: var(--paper-3); padding: 0.12em 0.36em; border-radius: 2px;
}
.code-block {
  margin: 1.5rem 0; background: var(--card); border: 1px solid var(--rule);
  border-left: 2px solid var(--brass); overflow-x: auto;
}
.code-block pre { margin: 0; padding: 1.1rem 1.25rem; }
.code-block code { background: none; padding: 0; font-size: 0.85rem; line-height: 1.8; }
.table-wrap { margin: 1.6rem 0; overflow-x: auto; border: 1px solid var(--rule); }
table { border-collapse: collapse; width: 100%; font-size: 0.9rem; }
th, td { padding: 0.7rem 0.95rem; border-bottom: 1px solid var(--rule); text-align: left; vertical-align: top; }
th {
  background: var(--paper-2); font-family: var(--font-mono); font-weight: 600;
  font-size: 0.76rem; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--ink-2); white-space: nowrap;
}
tbody tr:last-child td { border-bottom: 0; }

.toc { font-size: 0.85rem; line-height: 1.7; }
.toc-title {
  font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--brass); margin: 0 0 0.8rem; font-weight: 600;
}
.toc ul { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--rule-2); }
.toc li { margin: 0; }
.toc a { display: block; padding: 0.28rem 0 0.28rem 0.9rem; color: var(--ink-2); }
.toc a:hover { color: var(--brass); }
.toc .lv3 a { padding-left: 1.7rem; font-size: 0.81rem; color: var(--ink-3); }
@media (max-width: 63.99rem) {
  .toc { margin-bottom: 2.25rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--rule); }
}

.doc-meta {
  font-family: var(--font-mono); font-size: 0.74rem; letter-spacing: 0.05em;
  color: var(--ink-3); margin: 0 0 2.25rem;
  padding-bottom: 1rem; border-bottom: 1px solid var(--rule);
}
.doc-meta code { font-size: 0.95em; background: none; padding: 0; }
.doc-foot { max-width: var(--measure); margin-top: 3.25rem; padding-top: 1.75rem; border-top: 1px solid var(--rule); }
.doc-foot .actions { margin-bottom: 1.25rem; }

/* ---------- CTA 區塊：不做圓角陰影卡片，改為墨線包框 ---------- */
.cta-card {
  background: var(--card);
  border: 1px solid var(--rule-2);
  border-top: 3px solid var(--brass);
  padding: 2rem 1.75rem;
}
.cta-card h2 { margin-top: 0; }
.cta-card .fineprint { color: var(--ink-2); }

/* ---------- 頁尾 ---------- */
.site-footer { padding: 3rem 0 3rem; font-size: 0.87rem; color: var(--ink-2); border-top: 1px solid var(--rule); }
.site-footer .support {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.5rem 0.85rem;
  padding-bottom: 1.4rem; margin-bottom: 1.4rem; border-bottom: 1px solid var(--rule);
}
.site-footer .support p { margin: 0; color: var(--ink-3); max-width: 30em; }
.site-footer .support a { font-weight: 600; color: var(--ink); border-bottom: 1px solid var(--brass); }
.site-footer .cols { display: grid; gap: 1.6rem; grid-template-columns: 1fr; }
@media (min-width: 40rem) { .site-footer .cols { grid-template-columns: 2fr 1fr 1fr; } }
.site-footer h3 {
  font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass); margin: 0 0 0.7rem; font-weight: 600;
}
.site-footer ul { list-style: none; margin: 0; padding: 0; }
.site-footer li { margin: 0.25rem 0; }
.site-footer a { color: var(--ink-2); }
.site-footer a:hover { color: var(--ink); }
.colophon {
  margin-top: 2rem; padding-top: 1.25rem; border-top: 1px solid var(--rule);
  color: var(--ink-3); font-family: var(--font-mono); font-size: 0.72rem;
  letter-spacing: 0.04em; line-height: 2;
}
.colophon code { font-family: var(--font-mono); font-size: 1em; background: none; padding: 0; }

/* ---------- 手機常駐 CTA ---------- */
.cta-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
  padding: 0.65rem 1rem calc(0.65rem + env(safe-area-inset-bottom));
  background: var(--paper);
  border-top: 1px solid var(--rule-2);
}
.cta-bar .btn { width: 100%; }
@media (min-width: 46rem) { .cta-bar { display: none; } }
/* 手機有常駐 CTA 條時，頁尾留出空間，避免最後一行被壓住 */
@media (max-width: 45.99rem) { .site-footer { padding-bottom: 7rem; } }

/* ---------- 轉址頁 ---------- */
.redirect-page { min-height: 70vh; display: flex; align-items: center; }
.redirect-card { max-width: 32rem; margin: 0 auto; text-align: center; padding: 2rem 0; }
.redirect-card h1 { font-family: var(--font-serif); font-size: 1.5rem; font-weight: 600; margin: 0 0 0.9rem; }
.redirect-card p { color: var(--ink-2); margin: 0 0 1.5rem; }