/* =================================================================
   明腦 / MingNow · Brand Token System v2.0 · 2026-05-16
   Pin: project_mingnow_logo_pinned.md
   Canonical brand.svg at /brand.svg
   ================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@400;600;700;900&family=Noto+Sans+TC:wght@300;400;500;700;900&family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=JetBrains+Mono:wght@400;500;600&display=swap');
@import url('https://cdn.jsdelivr.net/npm/@callmebill/lxgw-wenkai-web@latest/style.css');

:root {
  /* ── PAPER · 紙底（不是純白）─────────────────── */
  --paper-0: #FAF6ED;        /* 主背景，宣紙感 */
  --paper-1: #F4EFE2;        /* 次背景，淺鬆木 */
  --paper-2: #EBE4D2;        /* 卡底，米褐 */
  --surface-elev: #F8F2E4;   /* 浮卡 */
  --surface-sunken: #EFE8D8; /* 沈卡 */

  /* ── INK · 墨色（不是純黑）─────────────────── */
  --ink-0: #1C1815;          /* 主文字 */
  --ink-1: #2D2925;          /* 副文字 */
  --ink-2: #4A453E;          /* 註解、icon */
  --ink-3: #7A746A;          /* placeholder */
  --ink-line: #C8C0B0;       /* 分隔線 */

  /* ── CINNABAR · 朱印（單一 accent）─────────── */
  --vermillion: #9B2D20;
  --vermillion-deep: #6B1F15;
  --vermillion-soft: #C9594D;
  --vermillion-tint: rgba(155, 45, 32, 0.08);

  /* ── SEMANTIC · 克制使用 ─────────────────── */
  --warning: #B07A1A;        /* 茶褐 */
  --success: #5D7660;        /* 銅綠 */
  --danger: #8B2E1F;

  /* ── TYPOGRAPHY ───────────────────────────── */
  --serif-tc: "Noto Serif TC", "Songti TC", serif;
  --sans-tc: "Noto Sans TC", "PingFang TC", sans-serif;
  --kai-tc: "LXGW WenKai TC", "LXGW WenKai", "Kaiti TC", "Noto Serif TC", serif;
  --serif-en: "Fraunces", Georgia, serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* ── LAYOUT GRAMMAR ─────────────────────── */
  --r-1: 4px;
  --r-2: 6px;
  --r-3: 8px;
  --r-max: 12px;
  --gap-section-y: 96px;
  --shadow-lg: none;          /* v2 禁陰影 */

  /* ════════════════════════════════════════
     舊 mingcha tokens 的 backward-compat alias
     （僅供原從 mingcha 複製過來的頁面使用，
      新頁面請直接用 v2 變數）
     ════════════════════════════════════════ */
  --accent: var(--vermillion);
  --accent-text: var(--vermillion);
  --fg: var(--ink-0);
  --fg-muted: var(--ink-2);
  --fg-subtle: var(--ink-3);
  --fg-faint: var(--ink-line);
  --fg-inverse: var(--paper-0);
  --bg: var(--paper-0);
  --bg-elev: var(--surface-elev);
  --bg-sunken: var(--surface-sunken);
  --bg-inverse: var(--ink-0);
  --rule: var(--ink-line);
  --rule-soft: rgba(200, 192, 176, 0.5);
  --font-display: var(--serif-tc);
  --font-sans: var(--sans-tc);
  --font-tc: var(--sans-tc);
  --font-mono: var(--mono);
  --prussian-950: var(--ink-0);
  --prussian-900: var(--ink-0);
  --prussian-800: var(--ink-0);
  --prussian-700: var(--ink-1);
  --prussian-600: var(--surface-sunken);
  --prussian-500: var(--ink-2);
  --amber-900: var(--vermillion-deep);
  --amber-800: var(--vermillion-deep);
  --amber-700: var(--vermillion-deep);
  --amber-600: var(--vermillion);
  --amber-500: var(--vermillion);
  --amber-400: var(--vermillion-soft);
  --amber-300: var(--vermillion-soft);
  --amber-200: var(--vermillion-tint);
  --amber-100: var(--vermillion-tint);

  /* Scale aliases */
  --t-eyebrow: 11px;
  --t-meta: 12px;
}

/* ── BASE ──────────────────────────────── */
* { box-sizing: border-box; }
html, body {
  margin: 0;
  padding: 0;
  background: var(--paper-0);
  color: var(--ink-0);
  font-family: var(--sans-tc);
  font-weight: 400;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ── PAPER TEXTURE（非常 subtle）─── */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image:
    radial-gradient(rgba(122, 116, 106, 0.05) 1px, transparent 1.2px),
    radial-gradient(rgba(122, 116, 106, 0.04) 1px, transparent 1.2px);
  background-size: 7px 7px, 13px 13px;
  background-position: 0 0, 3px 5px;
  z-index: 0;
  mix-blend-mode: multiply;
  opacity: 0.7;
}

/* ── COMMON HELPERS ─────────────────── */
.wrap { max-width: 1240px; margin: 0 auto; padding: 0 32px; position: relative; z-index: 1; }
.eyebrow { font-family: var(--mono); font-size: 11px; letter-spacing: 0.24em; color: var(--vermillion); text-transform: uppercase; }

/* ── NAV (default for all pages) ─────── */
.nav {
  position: sticky; top: 0; z-index: 50;
  display: flex; justify-content: space-between; align-items: center;
  padding: 18px 32px;
  background: rgba(250, 246, 237, 0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--ink-line);
}
.nav__brand { display: flex; align-items: center; gap: 14px; text-decoration: none; }
.nav__brand-text { display: flex; flex-direction: column; }
.nav__brand-text .cn { font-family: var(--serif-tc); font-weight: 900; font-size: 20px; color: var(--ink-0); line-height: 1; letter-spacing: 0.04em; }
.nav__brand-text .en { font-family: var(--serif-en); font-weight: 600; font-style: italic; font-size: 12px; color: var(--ink-2); margin-top: 3px; letter-spacing: 0.02em; }
.nav__links { display: flex; gap: 32px; font-family: var(--serif-tc); font-weight: 500; font-size: 14px; }
.nav__links a { color: var(--ink-1); text-decoration: none; letter-spacing: 0.04em; transition: color 0.2s; }
.nav__links a:hover, .nav__links a.is-active { color: var(--vermillion); }
.nav__cta { display: flex; align-items: center; gap: 14px; }

/* ── BUTTON (默認 v2 風格) ──────────── */
.btn { display: inline-flex; align-items: center; gap: 10px; padding: 14px 26px; font-family: var(--serif-tc); font-weight: 500; font-size: 15px; letter-spacing: 0.06em; text-decoration: none; border-radius: 4px; transition: background 0.2s, color 0.2s; cursor: pointer; border: none; }
.btn--primary { background: var(--vermillion); color: var(--paper-0); }
.btn--primary:hover { background: var(--vermillion-deep); }
.btn--ghost { background: transparent; color: var(--vermillion); box-shadow: inset 0 0 0 1px var(--vermillion); }
.btn--ghost:hover { background: var(--vermillion-tint); }
.btn .arr { font-family: var(--mono); font-weight: 400; font-size: 13px; }

/* ── FOOTER (default for all pages) ─── */
.foot { padding: 56px 32px 36px; background: var(--paper-0); border-top: 1px solid var(--ink-line); position: relative; z-index: 1; }
.foot__grid { max-width: 1240px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 40px; padding-bottom: 28px; border-bottom: 1px solid var(--ink-line); }
.foot__col h5 { font-family: var(--mono); font-size: 11px; color: var(--vermillion); letter-spacing: 0.2em; text-transform: uppercase; margin-bottom: 14px; }
.foot__col ul { list-style: none; padding: 0; margin: 0; font-family: var(--serif-tc); font-size: 13px; line-height: 2; color: var(--ink-1); }
.foot__col a { color: var(--ink-1); text-decoration: none; transition: color 0.2s; }
.foot__col a:hover { color: var(--vermillion); }
.foot__bot { max-width: 1240px; margin: 0 auto; padding-top: 24px; display: flex; justify-content: space-between; font-family: var(--mono); font-size: 11px; letter-spacing: 0.16em; color: var(--ink-3); text-transform: uppercase; }

/* ── SECTION DEFAULT ────────────────── */
.section { padding: var(--gap-section-y) 0; position: relative; z-index: 1; }
.section__head { display: grid; grid-template-columns: 1fr 2.4fr; gap: 32px; margin-bottom: 56px; align-items: baseline; }
.section__head .meta { padding-top: 8px; }
.section__head .eyebrow { display: block; }
.section__head h2 { font-family: var(--serif-tc); font-weight: 900; font-size: 44px; line-height: 1.15; color: var(--ink-0); margin: 0 0 14px; letter-spacing: -0.005em; }
.section__head p { font-family: var(--serif-tc); font-size: 16px; line-height: 1.75; color: var(--ink-2); }

/* ── RESPONSIVE ─────────────────────── */
@media (max-width: 880px) {
  .nav { padding: 14px 20px; }
  .nav__links { display: none; }
  .section__head { grid-template-columns: 1fr; gap: 16px; }
  .section__head h2 { font-size: 30px; }
  .foot__grid { grid-template-columns: 1fr 1fr; gap: 28px; }
  .foot__bot { flex-direction: column; gap: 8px; }
}