/* ============================================================
   AI 社會研究中心 — 深空宇宙版（多頁，每頁對應星球色）
   設計語言：深空底 · 每頁星球強調色（--red/--gold 由 body[data-planet] 覆寫）
   （暖色版備份於 ai-center-warm.css）
   ============================================================ */

:root {
  --paper:   #070b18;   /* 深空底 */
  --paper2:  #0a1024;
  --panel:   #0f1630;   /* 卡片面板 */
  --panel2:  #141c3a;
  --bright:  #eef2ff;   /* 標題近白 */
  --txt:     #c9d4ef;   /* 內文 */
  --dim:     #97a3c6;   /* 弱化 */
  --faint:   #5d6890;
  --red:     #4ee1e6;   /* 強調主色（各頁 data-planet 覆寫） */
  --red-deep:#2bb3a3;
  --gold:    #9d7bff;   /* 強調次色 */
  --orange:  #3e7bfa;
  --hair:    #1c2749;   /* 細線 */
  --hair2:   #2a3768;
  --grad:    linear-gradient(90deg, var(--red), var(--gold));

  --sans: 'Noto Sans TC', -apple-system, 'PingFang TC', sans-serif;
  --mono: 'IBM Plex Mono', 'SF Mono', Menlo, monospace;

  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-ink: cubic-bezier(.19,1,.22,1);
  --sheet: 1440px;
  --pad-x: clamp(20px, 4.5vw, 60px);
  --edge: max(var(--pad-x), calc((100% - var(--sheet)) / 2));
  --nav-h: 64px;
}

/* ---------- 各頁對應星球色（沿用首頁星球色相） ---------- */
body[data-planet="mission"]    { --red:#e0a01e; --red-deep:#b57d12; --gold:#f5cf6a; --orange:#cf8a1e; }  /* 琥珀岩石 */
body[data-planet="people"]     { --red:#2bb3a3; --red-deep:#1d8b7f; --gold:#e879ab; --orange:#4ee1d0; }  /* 青綠＋粉衛星 */
body[data-planet="directors"]  { --red:#cfa64a; --red-deep:#a5822f; --gold:#ecd27a; --orange:#b58f3a; }  /* 金色土星 */
body[data-planet="courses"]    { --red:#3e7bfa; --red-deep:#2a5bd0; --gold:#6f9dff; --orange:#4f8bff; }  /* 藍色氣態 */
body[data-planet="activities"] { --red:#e2622b; --red-deep:#b5481f; --gold:#ff8a4d; --orange:#c9531f; }  /* 橘紅熔岩 */
body[data-planet="research"]   { --red:#8f6bff; --red-deep:#6a49d0; --gold:#b79cff; --orange:#7a58e6; }  /* 星雲紫 */
body[data-planet="global"]     { --red:#3f8fd2; --red-deep:#2d6ea8; --gold:#5ed684; --orange:#4aa0dd; }  /* 藍綠地球 */
body[data-planet="students"]   { --red:#e0609a; --red-deep:#b23b78; --gold:#f5a8cf; --orange:#c94080; }  /* 玫紅新星 */

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: var(--paper);
  background-image:
    radial-gradient(880px 540px at 88% -10%, color-mix(in srgb, var(--gold) 18%, transparent), transparent 60%),
    radial-gradient(760px 520px at -5% 10%, color-mix(in srgb, var(--red) 10%, transparent), transparent 55%),
    radial-gradient(900px 700px at 50% 118%, color-mix(in srgb, var(--orange) 12%, transparent), transparent 60%);
  background-attachment: fixed;
  color: var(--txt);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.95;
  -webkit-font-smoothing: antialiased;
}

::selection { background: color-mix(in srgb, var(--gold) 45%, transparent); color: var(--bright); }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }

.wrap { width: 100%; padding-inline: var(--edge); }

/* ---------- 進場薄紗 ---------- */
.veil {
  position: fixed; inset: 0; z-index: 999;
  background: var(--paper2);
  pointer-events: none;
  animation: veil-lift .9s var(--ease-ink) .1s forwards;
}
@keyframes veil-lift { to { opacity: 0; visibility: hidden; } }
@media (prefers-reduced-motion: reduce) { .veil { display: none; } }

/* ---------- 導覽列 ---------- */
#nav {
  position: sticky; top: 0; z-index: 100;
  height: var(--nav-h);
  display: flex; align-items: center; justify-content: space-between;
  padding-inline: var(--edge);
  background: rgba(7,11,24,.82);
  backdrop-filter: saturate(140%) blur(12px);
  -webkit-backdrop-filter: saturate(140%) blur(12px);
  border-bottom: 1px solid var(--hair);
}
#nav.is-scrolled { border-bottom-color: var(--hair2); }

.brand { display: flex; align-items: baseline; gap: 10px; }
.brand,
.brand :first-child { font-weight: 800; font-size: 1.13rem; letter-spacing: .02em; }
.brand :first-child { background: linear-gradient(90deg, var(--red), var(--gold)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.brand .en {
  font-family: var(--mono);
  font-size: .66rem; font-weight: 400;
  letter-spacing: .16em; text-transform: uppercase;
  color: var(--faint);
}

.navlinks { list-style: none; display: flex; align-items: center; gap: 1.6rem; margin: 0; padding: 0; }
.navlinks a {
  font-size: .875rem; color: var(--dim);
  position: relative; padding-block: .35em;
  transition: color .3s var(--ease);
}
.navlinks a:hover { color: var(--red); }
.navlinks a.is-current { color: var(--red); font-weight: 700; }
.navlinks a.lang {
  font-family: var(--mono);
  font-size: .75rem; letter-spacing: .1em;
  color: var(--red);
  border: 1px solid color-mix(in srgb, var(--red) 40%, transparent);
  border-radius: 999px;
  padding: .3em 1em;
}
.navlinks a.lang:hover { background: color-mix(in srgb, var(--gold) 14%, transparent); box-shadow: 0 4px 18px -8px var(--red); }

.nav-toggle {
  display: none;
  background: none; border: 0; cursor: pointer;
  width: 32px; height: 24px; padding: 0;
  flex-direction: column; justify-content: space-between;
}
.nav-toggle span {
  display: block; height: 1.5px; width: 100%;
  background: var(--bright);
  transition: transform .4s var(--ease-ink), opacity .3s var(--ease);
}
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(10.5px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-10.5px) rotate(-45deg); }

/* ---------- Hero（首頁） ---------- */
.center-hero {
  position: relative;
  padding: clamp(64px, 8vw, 110px) var(--edge) clamp(44px, 5.5vw, 64px);
  border-bottom: 1px solid var(--hair);
  overflow: hidden;
}
.center-hero::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    linear-gradient(color-mix(in srgb, var(--red) 6%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--gold) 10%, transparent) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(720px 480px at 30% 20%, #000 30%, transparent 75%);
  -webkit-mask-image: radial-gradient(720px 480px at 30% 20%, #000 30%, transparent 75%);
  pointer-events: none;
}
.center-hero > * { position: relative; }
.center-hero .est {
  font-family: var(--mono);
  font-size: .78rem; letter-spacing: .22em;
  color: var(--orange); text-transform: uppercase;
  margin: 0 0 1.2rem;
}
.center-hero h1 {
  font-weight: 800;
  font-size: clamp(1.9rem, 4.8vw, 3.4rem);
  line-height: 1.3;
  letter-spacing: .01em;
  color: var(--bright);
  margin: 0 0 .5rem;
}
.center-hero h1 .accent {
  background: linear-gradient(90deg, var(--red), var(--gold));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.center-hero .en-name {
  font-family: var(--mono);
  font-size: clamp(.82rem, 1.4vw, .95rem);
  letter-spacing: .08em;
  color: var(--faint);
  margin: 0 0 1.6rem;
}
.center-hero .hero-sub { max-width: 46em; color: var(--dim); margin: 0; font-size: 1.02rem; }

.anchor-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 2rem; }
.anchor-row a {
  font-family: var(--mono);
  font-size: .78rem;
  color: var(--red);
  border: 1px solid color-mix(in srgb, var(--red) 35%, transparent);
  border-radius: 999px;
  padding: .38em 1.05em;
  background: rgba(255,255,255,.4);
  transition: background .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.anchor-row a:hover {
  background: color-mix(in srgb, var(--gold) 16%, transparent);
  border-color: var(--red);
  box-shadow: 0 6px 22px -10px var(--red);
}

/* ---------- 章節通用 ---------- */
.chapter { padding: clamp(44px, 5.5vw, 60px) 0 24px; }
.chapter > .wrap { padding-inline: var(--edge); }

.sec-index {
  font-family: var(--mono);
  font-size: .7rem; letter-spacing: .22em; text-transform: uppercase;
  color: var(--orange);
  margin: 0 0 .8rem;
}
.sec-index::before { content: '❖ '; color: var(--gold); }
.sec-title {
  font-weight: 800;
  font-size: clamp(1.55rem, 2.6vw, 1.95rem);
  line-height: 1.35;
  color: var(--bright);
  margin: 0 0 1.1rem;
}
.sec-title .en {
  display: block;
  font-family: var(--mono);
  font-size: .72rem; font-weight: 400;
  letter-spacing: .2em; text-transform: uppercase;
  color: var(--faint);
  margin-top: .55rem;
}
.sec-body { font-size: 1rem; color: var(--dim); margin: 0 0 1.1rem; max-width: 62em; }
.sec-body:last-of-type { margin-bottom: 1.8rem; }
h3 { color: var(--bright); }

/* 焦點清單 */
.focus-list {
  list-style: none; padding: 0;
  margin: 1.6rem 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 14px 28px;
}
.focus-list li {
  font-size: .93rem; line-height: 1.85; color: var(--txt);
  padding-left: 1.5em; position: relative;
}
.focus-list li::before {
  content: '◆'; position: absolute; left: 0; top: .1em;
  color: var(--red); font-size: .72em;
}

.note-line { font-size: .85rem; color: var(--faint); margin-top: 1.4rem; }
.note-line a, .sec-body a { color: var(--red) !important; border-bottom: 1px solid var(--hair2); }
.note-line a:hover, .sec-body a:hover { border-bottom-color: var(--red); }

/* ---------- 執行長 ---------- */
.director {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 2fr);
  gap: clamp(24px, 4vw, 56px);
  align-items: start;
  background: linear-gradient(160deg, color-mix(in srgb, var(--gold) 16%, transparent), var(--panel) 55%);
  border: 1px solid var(--hair2);
  border-radius: 16px;
  padding: clamp(24px, 3.5vw, 44px);
  margin-top: 2rem;
  position: relative;
}
.director::before {
  content: '';
  position: absolute; inset: -1px auto auto -1px; width: 100%; height: 3px;
  background: linear-gradient(90deg, var(--red), var(--gold));
  border-radius: 16px 16px 0 0;
}
.director .photo img {
  width: 100%; max-width: 320px;
  border-radius: 14px;
  display: block;
  border: 1px solid var(--hair2);
  box-shadow: 0 22px 48px -22px rgba(0,0,0,.5);
}
.director h3 { font-size: 1.6rem; font-weight: 800; margin: 0 0 .2rem; color: var(--bright); }
.director .title { color: var(--faint); font-size: .88rem; font-family: var(--mono); margin: 0 0 1.1rem; }
.director p { font-size: .95rem; line-height: 1.95; color: var(--txt); margin: 0 0 1rem; }
.director a { color: var(--red); border-bottom: 1px solid var(--hair2); }
.director a:hover { border-bottom-color: var(--red); }
@media (max-width: 720px) { .director { grid-template-columns: 1fr; } }

/* ---------- 成員卡片 ---------- */
.people-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: clamp(18px, 2.2vw, 28px);
  margin-top: 2rem;
}
.person {
  background: var(--panel);
  border: 1px solid var(--hair);
  border-radius: 14px;
  padding: 24px 24px 22px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 12px 30px -22px rgba(0,0,0,.35);
}
.person::before {
  content: '';
  position: absolute; top: 0; left: 0; width: 100%; height: 3px;
  background: linear-gradient(90deg, var(--red), transparent 70%);
}
.person:nth-child(2n)::before { background: linear-gradient(90deg, var(--gold), transparent 70%); }
.person:nth-child(3n)::before { background: linear-gradient(90deg, var(--orange), transparent 70%); }
.person .role {
  font-family: var(--mono);
  font-size: .68rem; letter-spacing: .18em;
  color: var(--red);
  margin: 0 0 .7rem;
}
.person:nth-child(2n) .role { color: var(--orange); }
.person h4 { font-size: 1.22rem; font-weight: 800; margin: 0 0 .15rem; color: var(--bright); }
.person .title { font-size: .82rem; color: var(--faint); font-family: var(--mono); margin: 0 0 .85rem; }
.person p.bio { font-size: .9rem; line-height: 1.85; color: var(--dim); margin: 0; }
.person p.bio a { color: var(--red); border-bottom: 1px solid var(--hair2); }
.person p.bio a:hover { border-bottom-color: var(--red); }

/* ---------- 課程卡片 ---------- */
.course-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: clamp(18px, 2.2vw, 26px);
  margin-top: 2rem;
}
.ccard {
  background: var(--panel);
  border: 1px solid var(--hair);
  border-radius: 14px;
  padding: 22px 24px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 12px 30px -24px rgba(0,0,0,.4);
  transition: border-color .3s var(--ease), box-shadow .3s var(--ease), transform .3s var(--ease);
}
.ccard::before {
  content: '';
  position: absolute; top: 0; left: 0; width: 100%; height: 3px;
  background: linear-gradient(90deg, var(--red), transparent 75%);
}
.ccard:nth-child(3n+2)::before { background: linear-gradient(90deg, var(--gold), transparent 75%); }
.ccard:nth-child(3n)::before   { background: linear-gradient(90deg, var(--orange), transparent 75%); }
.ccard:hover { border-color: var(--hair2); box-shadow: 0 20px 44px -22px rgba(0,0,0,.5); transform: translateY(-2px); }
.ccard .cno {
  font-family: var(--mono);
  font-size: .7rem; letter-spacing: .1em;
  color: var(--faint);
  margin: 0 0 .55rem;
}
.ccard h4 { font-size: 1.12rem; font-weight: 800; margin: 0 0 .3rem; color: var(--bright); }
.ccard .who { font-size: .8rem; color: var(--orange); font-family: var(--mono); margin: 0 0 .7rem; }
.ccard p { font-size: .88rem; line-height: 1.85; color: var(--dim); margin: 0; }

/* ---------- 模組流程 ---------- */
.module-flow {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 18px;
  margin-top: 1.6rem;
}
.module-step {
  background: var(--panel);
  border: 1px solid var(--hair);
  border-radius: 14px;
  padding: 22px 24px;
}
.module-step .mno {
  font-family: var(--mono);
  font-size: .7rem; letter-spacing: .18em;
  color: var(--red);
  margin: 0 0 .5rem;
}
.module-step h5 { font-size: 1.05rem; font-weight: 800; margin: 0 0 .5rem; color: var(--bright); }
.module-step p { font-size: .86rem; line-height: 1.85; color: var(--dim); margin: 0; }

/* ---------- 表格 ---------- */
.table-scroll { overflow-x: auto; margin-top: 1.6rem; border: 1px solid var(--hair2); border-radius: 12px; background: var(--panel); }
table.center-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .88rem;
  line-height: 1.75;
  min-width: 520px;
}
table.center-table th {
  font-family: var(--mono);
  font-weight: 600;
  font-size: .78rem;
  letter-spacing: .1em;
  text-align: left;
  color: var(--bright);
  background: color-mix(in srgb, var(--red) 16%, var(--panel2));
  border-bottom: 1px solid color-mix(in srgb, var(--red) 45%, var(--hair2));
  padding: .7em 1em;
  white-space: nowrap;
}
table.center-table td {
  padding: .7em 1em;
  border-bottom: 1px solid var(--hair);
  color: var(--dim);
  vertical-align: top;
}
table.center-table tr:nth-child(even) td { background: color-mix(in srgb, var(--gold) 7%, transparent); }
table.center-table tr:last-child td { border-bottom: 0; }
table.center-table td.job { font-weight: 700; color: var(--bright); white-space: nowrap; }

/* ---------- 年度數字帶 ---------- */
.stat-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 16px;
  margin-top: 2rem;
}
.stat {
  background: var(--panel);
  border: 1px solid var(--hair);
  border-radius: 14px;
  padding: 18px 20px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 12px 30px -24px rgba(0,0,0,.4);
}
.stat::before {
  content: '';
  position: absolute; top: 0; left: 0; width: 100%; height: 3px;
  background: linear-gradient(90deg, var(--red), transparent 70%);
}
.stat:nth-child(2)::before { background: linear-gradient(90deg, var(--gold), transparent 70%); }
.stat:nth-child(3)::before { background: linear-gradient(90deg, var(--orange), transparent 70%); }
.stat:nth-child(4)::before { background: linear-gradient(90deg, var(--red-deep), transparent 70%); }
.stat:nth-child(5)::before { background: linear-gradient(90deg, var(--gold), transparent 70%); }
.stat .num {
  font-family: var(--mono);
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 1.15;
  background: linear-gradient(90deg, var(--red), var(--gold));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.stat .lbl { font-size: .84rem; color: var(--dim); line-height: 1.6; margin-top: .3rem; }

/* ---------- 系列標籤 ---------- */
.series-tag {
  display: inline-block;
  font-family: var(--mono);
  font-size: .7rem;
  letter-spacing: .06em;
  color: var(--red-deep);
  border: 1px solid var(--hair2);
  border-radius: 999px;
  padding: .12em .8em;
  white-space: nowrap;
  background: color-mix(in srgb, var(--gold) 14%, transparent);
}

/* ---------- 實驗室特寫框 ---------- */
.lab-box {
  background: linear-gradient(170deg, color-mix(in srgb, var(--gold) 20%, transparent), var(--panel) 45%);
  border: 1px solid var(--hair2);
  border-radius: 18px;
  padding: clamp(24px, 3.5vw, 42px);
  margin-top: 2.4rem;
  position: relative;
  overflow: hidden;
}
.lab-box::before {
  content: '';
  position: absolute; top: 0; left: 0; width: 100%; height: 3px;
  background: linear-gradient(90deg, var(--red), var(--gold));
}
.lab-box .lab-kicker {
  font-family: var(--mono);
  font-size: .72rem; letter-spacing: .2em;
  color: var(--orange);
  margin: 0 0 .7rem;
}
.lab-box h3 { font-size: 1.45rem; font-weight: 800; margin: 0 0 .3rem; color: var(--bright); }
.lab-box .lab-en {
  font-family: var(--mono);
  font-size: .78rem; letter-spacing: .1em;
  color: var(--faint);
  margin: 0 0 1.3rem;
}
.lab-box p { font-size: .93rem; line-height: 1.9; color: var(--txt); margin: 0 0 1rem; }
.lab-cols {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin-top: 1.4rem;
}
.lab-col {
  background: var(--panel);
  border: 1px solid var(--hair);
  border-radius: 12px;
  padding: 18px 20px;
}
.lab-col h6 { font-size: .98rem; font-weight: 800; margin: 0 0 .5rem; color: var(--red); }
.lab-col ul { margin: 0; padding-left: 1.2em; }
.lab-col li { font-size: .86rem; line-height: 1.85; color: var(--dim); }
.lab-col li::marker { color: var(--gold); }

/* ---------- 活動卡片 ---------- */
.activity {
  border-left: 3px solid var(--gold);
  padding: 6px 0 6px 24px;
  margin-top: 2rem;
  position: relative;
}
.activity::before {
  content: '';
  position: absolute; left: -6px; top: 12px;
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--red);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--red) 20%, transparent);
}
.activity .when {
  font-family: var(--mono);
  font-size: .74rem; letter-spacing: .12em;
  color: var(--orange);
  margin: 0 0 .4rem;
}
.activity h4 { font-size: 1.18rem; font-weight: 800; margin: 0 0 .45rem; color: var(--bright); }
.activity p { font-size: .92rem; line-height: 1.9; color: var(--dim); margin: 0 0 .4rem; }
.activity a { color: var(--red); border-bottom: 1px solid var(--hair2); }
.activity a:hover { border-bottom-color: var(--red); }

/* ---------- 清單群組 ---------- */
.pub-group { margin-bottom: 3.2rem; }
.pub-group > h3 {
  display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap;
  font-size: 1.4rem; font-weight: 800;
  color: var(--bright);
  margin: 0 0 .4rem;
  border-top: 3px solid transparent;
  border-image: linear-gradient(90deg, var(--red), transparent 60%) 1;
  padding-top: 16px;
}
.pub-group:nth-of-type(2n) > h3 { border-image: linear-gradient(90deg, var(--gold), transparent 60%) 1; }
.pub-group > h3 .en {
  font-family: var(--mono);
  font-size: .66rem; font-weight: 400;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--faint);
}
.pub-list { list-style: none; margin: 0; padding: 0; }
.pub-list li {
  display: grid;
  grid-template-columns: 108px 1fr;
  gap: 20px;
  padding: 15px 0;
  border-top: 1px solid var(--hair);
}
.pub-list li:first-child { border-top: 0; }
.pub-list .yr {
  font-family: var(--mono);
  font-size: .78rem;
  color: var(--orange);
  padding-top: .25em;
}
.pub-list p { margin: 0; font-size: .94rem; line-height: 1.85; color: var(--txt); }
.pub-list .venue { color: var(--faint); }
.pub-list a { color: var(--red); border-bottom: 1px solid var(--hair2); }
.pub-list a:hover { border-bottom-color: var(--red); }

.badge {
  display: inline-block;
  font-family: var(--mono);
  font-size: .62rem; font-weight: 700;
  letter-spacing: .08em;
  color: var(--bright);
  background: color-mix(in srgb, var(--red) 24%, var(--panel));
  border: 1px solid var(--red);
  border-radius: 5px;
  padding: 2px 8px;
  margin-left: .5em;
  vertical-align: middle;
  white-space: nowrap;
}

/* ---------- CTA ---------- */
.cta {
  display: inline-flex; align-items: center; gap: .7em;
  font-family: var(--mono);
  font-size: .8rem; letter-spacing: .06em;
  color: var(--red);
  transition: gap .3s var(--ease);
}
.cta:hover { gap: 1em; text-decoration: underline; text-underline-offset: 5px; }
.cta .arrow { transition: transform .35s var(--ease-ink); }
.cta:hover .arrow { transform: translateX(3px); }
.page-cta { margin: 3rem 0 0; }

/* ---------- 頁尾 ---------- */
footer {
  padding: 34px var(--edge);
  border-top: 1px solid var(--hair2);
  background: var(--panel);
  display: flex; flex-wrap: wrap; gap: 14px;
  align-items: center; justify-content: space-between;
  margin-top: 48px;
}
footer .wrap { padding-inline: 0; display: contents; }
footer .f-name {
  font-size: .95rem; font-weight: 800;
  background: linear-gradient(90deg, var(--red), var(--gold));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
footer .f-links { display: flex; gap: 22px; }
footer a { font-size: .81rem; color: var(--dim); transition: color .3s var(--ease); }
footer a:hover { color: var(--red); }
footer .f-copy {
  width: 100%;
  font-family: var(--mono);
  font-size: .7rem; letter-spacing: .1em;
  color: var(--faint);
  margin: 0;
  padding-top: 1.2rem;
  border-top: 1px solid var(--hair2);
}

/* ---------- 捲動揭露 ---------- */
.js .reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .9s var(--ease-ink), transform .9s var(--ease-ink);
}
.js .reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .js .reveal { opacity: 1; transform: none; transition: none; }
}

/* ---------- 內頁頭部 ---------- */
.page-head {
  padding: clamp(44px, 6vw, 72px) 0 0;
  position: relative;
}
.page-head .wrap { padding-inline: var(--edge); }
.page-head h1 {
  font-weight: 800;
  font-size: clamp(2rem, 4.4vw, 3.1rem);
  line-height: 1.25;
  color: var(--bright);
  margin: .9rem 0 1.1rem;
}
.page-head h1 .en {
  display: block;
  font-family: var(--mono);
  font-size: .72rem; font-weight: 400;
  letter-spacing: .24em; text-transform: uppercase;
  color: var(--orange);
  margin-top: .8rem;
}
.page-head .lede {
  max-width: 760px;
  margin: 0;
  font-size: clamp(1rem, 1.6vw, 1.13rem);
  line-height: 1.95;
  color: var(--dim);
}
.back-link {
  font-family: var(--mono);
  font-size: .7rem; letter-spacing: .16em; text-transform: uppercase;
  color: var(--faint);
}
.back-link:hover { color: var(--red); }
.page-head + section.chapter { padding-top: clamp(28px, 4vw, 44px); }

/* ---------- 首頁導覽卡 ---------- */
.home-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: clamp(18px, 2.2vw, 26px);
  margin-top: 2rem;
}
.home-cards a {
  display: block;
  background: var(--panel);
  border: 1px solid var(--hair);
  border-radius: 14px;
  padding: 24px 26px 22px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 14px 34px -26px rgba(0,0,0,.45);
  transition: border-color .3s var(--ease), box-shadow .3s var(--ease), transform .3s var(--ease);
}
.home-cards a::before {
  content: '';
  position: absolute; top: 0; left: 0; width: 100%; height: 3px;
  background: linear-gradient(90deg, var(--red), transparent 75%);
}
.home-cards a:nth-child(3n+2)::before { background: linear-gradient(90deg, var(--gold), transparent 75%); }
.home-cards a:nth-child(3n)::before   { background: linear-gradient(90deg, var(--orange), transparent 75%); }
.home-cards a:hover { border-color: var(--hair2); box-shadow: 0 22px 48px -24px rgba(0,0,0,.55); transform: translateY(-3px); }
.home-cards .no {
  font-family: var(--mono);
  font-size: .68rem; letter-spacing: .2em;
  color: var(--red);
}
.home-cards a:nth-child(3n+2) .no { color: var(--orange); }
.home-cards h3 {
  font-size: 1.28rem; font-weight: 800;
  color: var(--bright);
  margin: .65rem 0 .55rem;
}
.home-cards p { font-size: .89rem; line-height: 1.85; color: var(--dim); margin: 0 0 1rem; }
.home-cards .go {
  font-family: var(--mono);
  font-size: .74rem; letter-spacing: .08em;
  color: var(--red);
}

/* ---------- 響應式 ---------- */
@media (max-width: 760px) {
  .nav-toggle { display: flex; }
  .navlinks {
    position: absolute;
    top: 100%; left: 0; right: 0;
    flex-direction: column; align-items: flex-start;
    gap: 0;
    background: var(--paper);
    border-bottom: 1px solid var(--hair2);
    box-shadow: 0 24px 48px -30px rgba(61,36,23,.5);
    padding: 10px 20px 24px;
    opacity: 0; visibility: hidden;
    transform: translateY(-10px);
    transition: opacity .35s var(--ease), transform .35s var(--ease-ink), visibility .35s;
  }
  .navlinks.is-open { opacity: 1; visibility: visible; transform: none; }
  .navlinks li { width: 100%; border-bottom: 1px solid var(--hair); list-style: none; }
  .navlinks li:last-child { border-bottom: 0; }
  .navlinks a { display: block; padding: .95em 0; font-size: .94rem; }
  .navlinks a.lang { display: inline-block; margin-top: 1rem; }

  body { font-size: 15.5px; }
  .pub-list li { grid-template-columns: 1fr; gap: .35rem; }
  .pub-list .yr { padding-top: 0; }
  footer { flex-direction: column; align-items: flex-start; }
}

/* ---------- 首頁：機構入口最新資訊區（仿中研院社會所） ---------- */
.news-zone {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: clamp(18px, 2.2vw, 28px);
  margin-top: 2rem;
}
.news-col {
  background: var(--panel);
  border: 1px solid var(--hair);
  border-radius: 14px;
  padding: 20px 22px 16px;
  box-shadow: 0 12px 30px -24px rgba(0,0,0,.4);
  display: flex;
  flex-direction: column;
}
.news-col > h3 {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 1.05rem; font-weight: 800;
  color: var(--bright);
  margin: 0 0 .6rem;
  padding-bottom: .55rem;
  border-bottom: 3px solid var(--red);
}
.news-col:nth-child(2) > h3 { border-bottom-color: var(--gold); }
.news-col:nth-child(3) > h3 { border-bottom-color: var(--orange); }
.news-col:nth-child(4) > h3 { border-bottom-color: var(--red-deep); }
.news-col > h3 .more {
  font-family: var(--mono);
  font-size: .68rem; font-weight: 400;
  letter-spacing: .08em;
  color: var(--red);
}
.news-col > h3 .more:hover { text-decoration: underline; text-underline-offset: 4px; }
.news-list { list-style: none; margin: 0; padding: 0; flex: 1; }
.news-list li {
  padding: .65rem 0;
  border-bottom: 1px dashed var(--hair);
  font-size: .88rem;
  line-height: 1.7;
  color: var(--txt);
}
.news-list li:last-child { border-bottom: 0; }
.news-list .d {
  display: block;
  font-family: var(--mono);
  font-size: .7rem;
  letter-spacing: .06em;
  color: var(--red);
  margin-bottom: .1rem;
}
.news-list .tag {
  display: inline-block;
  font-size: .68rem;
  font-family: var(--mono);
  color: var(--red-deep);
  background: color-mix(in srgb, var(--gold) 16%, transparent);
  border-radius: 4px;
  padding: 0 .5em;
  margin-right: .4em;
  vertical-align: .08em;
}

/* ---------- 內頁頁首：對應星球色光暈 ---------- */
.page-head { position: relative; }
.page-head .wrap { position: relative; z-index: 1; }
.page-head::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(760px 360px at 12% -30%, color-mix(in srgb, var(--red) 24%, transparent), transparent 70%),
    radial-gradient(520px 300px at 92% -10%, color-mix(in srgb, var(--gold) 18%, transparent), transparent 65%);
  pointer-events: none;
}

/* ---------- 國際視野表格：AI 中心連結 ---------- */
.center-table td a { color: var(--red); border-bottom: 1px solid var(--hair2); }
.center-table td a:hover { border-bottom-color: var(--red); }
.center-table td.job a { color: inherit; border-bottom-color: var(--red); }

/* ---------- 成員卡頭像 ---------- */
.person .avatar {
  width: 92px; height: 92px;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 14px;
  border: 1px solid var(--hair2);
  box-shadow: 0 10px 26px -14px rgba(0,0,0,.55);
}