/* ==========================================================================
   超级少年计划：翻页式 H5
   风格：大字开场 + 数据叙事；配色：水泥橙
   ========================================================================== */

:root {
  --paper: #e6e6e3;
  --ink: #000;
  --muted: #6a6a66;
  --rule: #cacac5;
  --signal: #ff5a00;      /* 唯一强调色 */
  --signal-weak: #f7b38c; /* 弱化的数据 */
  --signal-deep: #c24400;
  --turn-bg: #ff5a00;
  --turn-fg: #000;
  --turn-muted: #5a2400;

  --sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Noto Sans CJK SC", "Microsoft YaHei", sans-serif;
  --num: "DIN Condensed", "Bahnschrift Condensed", "Roboto Condensed", "Arial Narrow", sans-serif;

  --vh: 1vh;              /* 由 deck.js 按 innerHeight 校正，规避微信里 100vh 不准 */
  --page-h: calc(var(--vh) * 100);
  --gutter: 22px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html {
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}

html, body {
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;   /* 禁止下拉露出微信底色 */
}

body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none;
  user-select: none;
}

button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
:focus-visible { outline: 3px solid var(--signal); outline-offset: 3px; }

/* ---------- 翻页框架 ---------- */
.deck {
  position: relative;
  height: var(--page-h);
  overflow: hidden;
  touch-action: none;
}
.track { will-change: transform; }
.track.is-animating { transition: transform .65s cubic-bezier(.7, 0, .2, 1); }

.page {
  position: relative;
  height: var(--page-h);
  min-height: 520px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding-bottom: env(safe-area-inset-bottom);
}
/* 标题区 / 内容区的外框：手机上不参与布局，宽屏上分成左右两栏 */
.cover__text, .dp__aside, .dp__main { display: contents; }

/* 右侧页码：数字页码 + 页码点 */
.indicator {
  position: fixed;
  right: 3px; top: 50%;
  transform: translateY(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  width: 16px;
  z-index: 10;
  pointer-events: none;
}
/* 右上角页码：03 / 07 */
.pager {
  position: fixed;
  top: 16px; right: var(--gutter);
  display: flex; align-items: baseline; gap: 4px;
  font-family: var(--num); line-height: 1;
  z-index: 10;
  pointer-events: none;
}
.pager b { font-size: 20px; font-weight: 700; color: var(--ink); }
.pager span { font-size: 13px; color: var(--muted); }
.dots { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.dots i { width: 4px; height: 4px; border-radius: 2px; background: var(--ink); opacity: .25; transition: height .3s ease, opacity .3s ease; }
.dots i.is-current { height: 14px; opacity: .9; }


.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.next-btn {
  flex: none;
  width: 36px; height: 36px;
  border-radius: 50%;
  border: 1.5px solid currentColor;
  display: grid; place-items: center;
}
.next-btn svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.page.is-active .next-btn { animation: bob 1.6s ease-in-out 3.8s infinite; }

/* ==========================================================================
   封面：超级少年培养计划
   水泥灰底 + 黑色大字 + 从底部冲起的橙色成长柱：与内页同一套配色，保留开场冲击
   ========================================================================== */
.cover {
  justify-content: flex-start;
  padding: clamp(40px, calc(var(--vh) * 10), 100px) var(--gutter) calc(clamp(78px, calc(var(--vh) * 11.5), 104px) + env(safe-area-inset-bottom));
  /* 水泥灰底，右下角透出橙色柔光，增加纵深 */
  background:
    radial-gradient(ellipse 90% 45% at 88% 100%, rgba(255, 90, 0, .14), transparent 70%),
    var(--paper);
  color: var(--ink);
}

/* 深色细网格，下半部分最清晰，向上淡出 */
.cover::before {
  content: "";
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(0, 0, 0, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 0, 0, .05) 1px, transparent 1px);
  background-size: 24px 24px;
  -webkit-mask-image: linear-gradient(to top, #000 20%, transparent 85%);
  mask-image: linear-gradient(to top, #000 20%, transparent 85%);
  pointer-events: none;
}
.cover > *, .cover__text > * { position: relative; }

.cover__age {
  align-self: flex-start;
  margin-bottom: clamp(14px, calc(var(--vh) * 2.6), 24px);
  padding: 4px 14px;
  border-radius: 999px;
  font-size: 13px; font-weight: 600;
  color: var(--signal-deep);
  background: rgba(255, 90, 0, .12);
  opacity: 0;
}
.cover.is-active .cover__age { animation: fade .5s ease .1s forwards; }

.cover__title { align-self: flex-start; font-weight: 600; }
.cover__name, .cover__sub { display: block; opacity: 0; transform: translateY(14px); }
.cover__name {
  font-size: min(66px, 17vw, calc(var(--vh) * 8.6));
  line-height: 1.08;
  letter-spacing: .02em;
  color: var(--ink);
}
.cover__sub { margin-top: 10px; font-size: min(21px, 5.4vw); font-weight: 400; letter-spacing: .55em; color: var(--muted); }
.cover__slogan {
  position: relative;
  margin-top: clamp(16px, calc(var(--vh) * 3), 28px);
  padding-top: 14px;
  font-size: min(18px, 4.8vw, calc(var(--vh) * 2.6));
  line-height: 1.6;
  font-weight: 600;
  color: var(--ink);
  opacity: 0; transform: translateY(10px);
}
.cover__slogan::before { content: ""; position: absolute; left: 0; top: 0; width: 32px; height: 3px; background: var(--signal); }
.cover.is-active .cover__name { animation: in .7s cubic-bezier(.2, .8, .2, 1) .15s forwards; }
.cover.is-active .cover__sub { animation: in .6s cubic-bezier(.2, .8, .2, 1) .35s forwards; }
.cover.is-active .cover__slogan { animation: in .6s cubic-bezier(.2, .8, .2, 1) .55s forwards; }

/* 主视觉：橙色成长柱从底部冲起，最后一根最高、实心，顶端圆点向外扩散光圈 */
.cover__art { width: 100%; margin-top: auto; }
.cover__bars {
  position: relative;
  display: flex; align-items: flex-end; gap: 10px;
  height: clamp(150px, calc(var(--vh) * 34), 320px);
  border-bottom: 1.5px solid var(--ink);
}
.cover__bars i {
  position: relative;
  flex: 1;
  height: var(--h);
  background: var(--signal-weak);
  border-radius: 8px 8px 0 0;
  transform: scaleY(0);
  transform-origin: bottom;
}
.cover__bars .cover__top { background: var(--signal); box-shadow: 0 0 36px rgba(255, 90, 0, .35); }
.cover__top::after, .cover__top::before {
  content: "";
  position: absolute; left: 50%; bottom: calc(100% + 12px);
  width: 16px; height: 16px; margin-left: -8px;
  border-radius: 50%;
  background: var(--signal);
  opacity: 0;
}
.cover.is-active .cover__bars i { animation: shoot .8s cubic-bezier(.2, 1.25, .35, 1) forwards; animation-delay: calc(var(--i) * .1s + .7s); }
.cover.is-active .cover__bars .cover__top { animation-duration: 1s; }
.cover.is-active .cover__top::after { animation: pop .45s cubic-bezier(.2, 1.6, .4, 1) 1.8s forwards; }
.cover.is-active .cover__top::before { animation: ring 2.2s ease-out 2.2s infinite; }

.cover__steps { display: flex; gap: 10px; margin: 8px 0 0; padding: 0; list-style: none; }
.cover__steps li {
  flex: 1;
  text-align: center;
  font-size: min(12px, 3.1vw);
  line-height: 1.3;
  color: var(--muted);
  white-space: nowrap;
  opacity: 0;
}
.cover__steps li:last-child { color: var(--signal-deep); font-weight: 600; }
.cover.is-active .cover__steps li { animation: fade .4s ease 1.5s forwards; }

.cover__hint {
  position: absolute;
  left: 50%; bottom: calc(18px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  padding: 6px 16px;
  font-size: 13px; color: var(--muted);
  opacity: 0;
}
.cover__hint svg { width: 16px; height: 16px; fill: none; stroke: var(--ink); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cover.is-active .cover__hint { animation: fade .4s ease 2.3s forwards; }
.cover.is-active .cover__hint svg { animation: nudge 1.4s ease-in-out 2.8s infinite; }

@keyframes shoot { 0% { transform: scaleY(0); } 100% { transform: scaleY(1); } }

/* ==========================================================================
   数据页（.dp）：顶栏 + 大字提问 + 图表 + 出处 + 橙色结论横幅
   动画只在 .is-active 时播放，翻回来会重播
   ========================================================================== */
.dp__top { padding: 18px calc(var(--gutter) + 70px) 0 var(--gutter); display: flex; justify-content: space-between; gap: 12px; font-size: 13px; }
.dp__top b { flex: none; font-size: 15px; letter-spacing: .08em; }
.dp__top span { color: var(--muted); text-align: right; }

.dp__headline {
  padding: clamp(14px, calc(var(--vh) * 3.4), 34px) var(--gutter) 0;
  font-weight: 600;
  font-size: min(42px, 9.5vw, calc(var(--vh) * 5.8));
  line-height: 1.16;
  letter-spacing: -.02em;
}
.dp__headline span { display: block; opacity: 0; transform: translateY(12px); }
.dp__ask { margin-top: .18em; }
.dp.is-active .dp__headline span { animation: in .5s cubic-bezier(.2, .8, .2, 1) forwards; }
.dp.is-active .dp__headline span:nth-child(2) { animation-delay: .15s; }
.dp.is-active .dp__headline span:nth-child(3) { animation-delay: .5s; }

/* ---------- AI 时代的机遇：成长路径 + 三个价值方向 ---------- */
.dp__lead { margin: clamp(14px, calc(var(--vh) * 2.4), 22px) var(--gutter) 0; padding-left: 14px; border-left: 3px solid var(--signal); font-size: min(15px, 3.9vw, calc(var(--vh) * 2.2)); line-height: 1.8; color: var(--muted); }
.dp__lead-key { font-size: min(17px, 4.4vw, calc(var(--vh) * 2.5)); font-weight: 600; color: var(--ink); }
.dp__lead-key + p { margin-top: 6px; }
.dp__lead em { font-style: normal; font-weight: 600; color: var(--signal-deep); }

/* ---------- 第 2 页手机适配：内容较多，整体收紧，保证一屏放下 ---------- */
.opp .dp__headline, .degree .dp__headline, .cgy .dp__headline, .jmr .dp__headline, .quad .dp__headline, .offer .dp__headline {
  padding-top: clamp(10px, calc(var(--vh) * 2), 26px);
  font-size: min(31px, 7.8vw, calc(var(--vh) * 4.2));
  line-height: 1.18;
}
.opp .dp__lead { margin-top: clamp(8px, calc(var(--vh) * 1.4), 18px); font-size: min(14px, 3.6vw); line-height: 1.55; }
.opp .dp__lead-key { font-size: min(17px, 4.4vw); }
.opp .dp__lead-key + p { margin-top: 4px; }
.opp .opp__board { gap: clamp(8px, calc(var(--vh) * 1.4), 22px); margin-top: clamp(8px, calc(var(--vh) * 1.2), 18px); }
.opp .path button { padding-top: 30px; font-size: min(14px, 3.6vw); }
.opp .values li { grid-template-columns: min(112px, 28.5vw) 1fr; padding: clamp(7px, calc(var(--vh) * 1.1), 12px) 0; }
.opp .values b { font-size: min(15px, 3.85vw); white-space: nowrap; }
.opp .values span { font-size: min(14px, 3.6vw); line-height: 1.5; }
.opp .dp__turn, .degree .dp__turn, .cgy .dp__turn, .jmr .dp__turn, .quad .dp__turn, .offer .dp__turn { margin-top: clamp(10px, calc(var(--vh) * 1.6), 18px); padding-top: clamp(12px, calc(var(--vh) * 2), 20px); padding-bottom: calc(clamp(12px, calc(var(--vh) * 2), 20px) + env(safe-area-inset-bottom)); }
.opp .dp__turn p, .degree .dp__turn p, .cgy .dp__turn p, .jmr .dp__turn p, .quad .dp__turn p, .offer .dp__turn p { font-size: min(21px, 5.4vw, calc(var(--vh) * 2.9)); }
.opp .dp__turn small, .degree .dp__turn small, .cgy .dp__turn small, .jmr .dp__turn small, .quad .dp__turn small, .offer .dp__turn small { margin-top: 4px; font-size: 13px; }

.opp__board { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: clamp(16px, calc(var(--vh) * 3), 32px); margin: clamp(12px, calc(var(--vh) * 2), 20px) var(--gutter) 0; }

/* 成长路径：可点击的四阶段进度线
   --p 为当前选中的阶段序号（0–3），进度线长度与点亮的圆点都跟随它变化 */
.path {
  --p: 0;
  position: relative;
  display: grid; grid-template-columns: repeat(4, 1fr);
  margin: 0; padding: 0; list-style: none;
}
/* 底线与进度线：从第一个圆点中心连到最后一个圆点中心 */
.path::before, .path::after {
  content: "";
  position: absolute; left: 12.5%; right: 12.5%; top: 12px;
  height: 2px;
  background: var(--rule);
}
.path::after {
  background: var(--signal);
  transform: scaleX(calc(var(--p) / 3)); transform-origin: left;
  transition: transform .45s cubic-bezier(.65, 0, .35, 1);
}

/* 节奏：进度线 0.45 秒走到下一站 → 0.32 秒时圆点与文字点亮；熄灭不等待 */
.path li { position: relative; color: var(--muted); transition: color .25s ease; }
.path button {
  position: relative;
  display: block; width: 100%;
  padding: 32px 0 4px;
  text-align: center;
  font-size: min(13px, 3.4vw);
  color: inherit;
  -webkit-tap-highlight-color: transparent;
}
/* 圆点：放大用 transform，过渡更顺滑，也不会挤动文字 */
.path button::before {
  content: "";
  position: absolute; left: 50%; top: 5px;
  width: 14px; height: 14px; margin-left: -7px;
  border-radius: 50%;
  background: var(--paper);
  box-shadow: inset 0 0 0 2px var(--rule);
  z-index: 1;
  transition: background-color .25s ease, box-shadow .25s ease, transform .35s cubic-bezier(.2, .8, .2, 1);
}
/* 已走过的阶段：点亮 */
.path li.is-lit { color: var(--ink); transition-delay: .32s; }
.path li.is-lit button::before { background: var(--signal); box-shadow: inset 0 0 0 2px var(--signal); transition-delay: .32s; }
/* 当前阶段：圆点放大并持续发光 */
.path li.is-current button { font-weight: 600; }
.path li.is-current button::before { transform: scale(1.7); animation: glow 2.4s ease-out 1s infinite; }

/* 阶段内容：四组叠放在同一格，区域高度取最高的一组，切换时页面不跳动 */
.stage-panels { display: grid; border-top: 1px solid var(--rule); }
.stage-panels .values { grid-area: 1 / 1; align-self: start; border-top: 0; }
/* 切换：旧内容 0.15 秒整组淡出；新内容在其后一项接一项淡入并轻微上浮（每项间隔 0.08 秒） */
.stage-panels .values[hidden] { display: block; visibility: hidden; opacity: 0; transition: opacity .15s ease, visibility 0s linear .15s; }
.stage-panels .values:not([hidden]) li { animation: panel-in .4s cubic-bezier(.22, .61, .36, 1) both; animation-delay: calc(.12s + var(--k, 0) * .08s); }
.stage-panels .values li:nth-child(2) { --k: 1; }
.stage-panels .values li:nth-child(3) { --k: 2; }
.stage-panels .values li:nth-child(4) { --k: 3; }
@keyframes panel-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* 三个价值方向 / 各阶段核心内容 */
.values { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--rule); }
.values li { display: grid; grid-template-columns: min(98px, 26vw) 1fr; align-items: baseline; gap: 10px; padding: clamp(10px, calc(var(--vh) * 1.7), 16px) 0; border-bottom: 1px solid var(--rule); }
.values b { font-size: min(15px, 3.9vw, calc(var(--vh) * 2.2)); }
.values span { font-size: min(14px, 3.7vw, calc(var(--vh) * 2.1)); line-height: 1.6; color: var(--muted); }

@keyframes glow { 0% { box-shadow: 0 0 0 0 rgba(255, 90, 0, .45); } 100% { box-shadow: 0 0 0 12px rgba(255, 90, 0, 0); } }

/* ---------- 趋势：中美大厂新闻列表（公司名 + 一句话 + 出处） ---------- */
.corps {
  flex: 1;
  display: flex; flex-direction: column; justify-content: center;
  margin: clamp(10px, calc(var(--vh) * 2), 20px) var(--gutter) 0;
}
.corps h2 { margin: 0 0 4px; font-size: 13px; font-weight: 600; color: var(--muted); }
.corps ul + h2 { margin-top: clamp(10px, calc(var(--vh) * 2), 18px); }
.corps ul { margin: 0; padding: 0; list-style: none; }
.corps li {
  display: grid; grid-template-columns: min(84px, 22vw) 1fr; align-items: start; gap: 8px;
  padding: clamp(5px, calc(var(--vh) * 1), 10px) 0;
  border-bottom: 1px solid var(--rule);
}
.corps li:first-child { border-top: 1.5px solid var(--ink); }
.corps b {
  justify-self: start;
  padding: 1px 6px;
  font-size: min(12.5px, 3.3vw); font-weight: 600; line-height: 1.6;
  color: var(--paper); background: var(--ink);
  border-radius: 3px;
  white-space: nowrap;
}
.corps p { font-size: min(14.5px, 3.8vw, calc(var(--vh) * 2.15)); font-weight: 600; line-height: 1.5; }
.corps span { margin-left: 6px; font-size: 11.5px; font-weight: 400; color: var(--muted); white-space: nowrap; }

/* 第 3 页：与第 2 页版式一致（分组标题 = 第 2 页副标题样式；条目 = 公司名 + 出处 | 说明） */
.degree .corps { margin-top: clamp(8px, calc(var(--vh) * 1.4), 18px); }
.degree .corps h2 {
  margin: 0 0 6px;
  padding-left: 14px;
  border-left: 3px solid var(--signal);
  font-size: min(17px, 4.4vw); font-weight: 600; line-height: 1.4;
  color: var(--ink);
}
.degree .corps ul + h2 { margin-top: clamp(12px, calc(var(--vh) * 2), 22px); }
.degree .corps ul { border-top: 1.5px solid var(--ink); }
.degree .corps li {
  display: grid;
  grid-template-columns: min(100px, 26vw) 1fr;
  grid-template-areas: "corp text" "src text";
  grid-template-rows: auto 1fr;
  column-gap: 10px;
  padding: clamp(5px, calc(var(--vh) * .75), 10px) 0;
  border-top: 0; border-bottom: 1px solid var(--rule);
}
.degree .corps li:first-child { border-top: 0; }
.degree .corps li:last-child { border-bottom: 0; }
.degree .corps b {
  grid-area: corp;
  justify-self: start;
  padding: 0;
  font-size: min(16px, 4.1vw); font-weight: 700; line-height: 1.4;
  color: var(--ink); background: none; border-radius: 0;
}
.degree .corps p { grid-area: text; font-size: min(14px, 3.6vw); font-weight: 400; line-height: 1.55; color: #2b2b29; }
.degree .corps span {
  grid-area: src;
  margin: 2px 0 0;
  font-size: 10.5px; line-height: 1.35;
  color: var(--muted);
  white-space: nowrap;
}

/* ---------- 人物案例页（姜睦然、陈广宇）---------- */
.reveal { opacity: 0; transform: translateY(12px); }
.dp.is-active .reveal { animation: in .5s cubic-bezier(.2, .8, .2, 1) forwards; animation-delay: var(--d); }

.who { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; margin: clamp(8px, calc(var(--vh) * 1.6), 14px) var(--gutter) 0; }
.who b { font-size: min(20px, 5.2vw); }
.who span { font-size: 13px; color: var(--muted); }

/* 名人评价引用（如马斯克） */
.praise {
  margin: clamp(8px, calc(var(--vh) * 1.4), 12px) var(--gutter) 0;
  padding: 6px 12px;
  border-left: 3px solid var(--signal);
  background: rgba(255, 255, 255, .5);
}
.praise p { font-family: Georgia, "Times New Roman", serif; font-style: italic; font-size: min(18px, 4.7vw, calc(var(--vh) * 2.7)); font-weight: 600; line-height: 1.35; }
.praise p b { margin-left: 8px; font-family: var(--sans); font-style: normal; font-size: 13px; font-weight: 600; color: var(--muted); white-space: nowrap; }
.praise cite { display: block; margin-top: 2px; font-style: normal; font-size: 12px; color: var(--muted); }

.timeline { flex: 1; display: flex; flex-direction: column; justify-content: center; margin: clamp(6px, calc(var(--vh) * 1.4), 14px) var(--gutter) 0; padding: 0; list-style: none; }
.timeline li { display: grid; grid-template-columns: min(78px, 21vw) 1fr; gap: 10px; padding: clamp(6px, calc(var(--vh) * 1.3), 12px) 0; border-top: 1px solid var(--rule); }
.timeline li:last-child { border-bottom: 1px solid var(--rule); }
.timeline b { font-family: var(--num); font-weight: 700; font-size: min(18px, 4.6vw); line-height: 1.3; color: var(--muted); }
.timeline p { font-size: min(14px, 3.7vw, calc(var(--vh) * 2.2)); line-height: 1.45; }
/* 每一步对应的能力标签 */
.timeline em {
  display: inline-block;
  margin-right: 6px;
  padding: 0 5px;
  font-style: normal; font-size: 11.5px; font-weight: 600; line-height: 1.6;
  color: var(--signal-deep);
  border: 1px solid var(--signal);
  border-radius: 3px;
  vertical-align: 1px;
}
.timeline .is-key em { color: var(--ink); background: var(--signal); }
.timeline .is-key b { color: var(--signal); }
.timeline .is-key p { font-weight: 600; }

/* 陈广宇、姜睦然页：与第 2、3 页同一套紧凑版式，时间线每条尽量一行 */
.cgy .who, .jmr .who { margin-top: clamp(10px, calc(var(--vh) * 1.8), 18px); }
.cgy .praise, .jmr .praise { margin-top: clamp(10px, calc(var(--vh) * 1.6), 16px); padding: 8px 14px; }
.cgy .praise cite, .jmr .praise cite { margin-top: 3px; font-size: 12.5px; }
/* 视频号链接：放在引语框右下角，与中文评价同一行 */
.cgy .praise, .jmr .praise { position: relative; }
.cgy .praise cite, .jmr .praise cite { padding-right: 92px; }
.praise__video {
  position: absolute; right: 12px; bottom: 7px;
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 10px;
  font-size: 12px; font-weight: 600; line-height: 1.4; color: #fff; text-decoration: none;
  background: var(--ink); border-radius: 999px;
}
.praise__video svg { width: 10px; height: 10px; fill: var(--signal); }
/* 姜睦然页：与陈广宇页的引语框同一版式，首行为正文字体 */
.jr-praise p { font-family: var(--sans); font-style: normal; font-size: min(16px, 4.1vw); line-height: 1.45; }
.cgy .timeline, .jmr .timeline { margin-top: clamp(10px, calc(var(--vh) * 1.6), 18px); }
.cgy .timeline li, .jmr .timeline li { grid-template-columns: min(72px, 19vw) 1fr; align-items: baseline; padding: clamp(10px, calc(var(--vh) * 2.1), 22px) 0; }
.cgy .timeline li, .jmr .timeline li { padding: clamp(7px, calc(var(--vh) * 1.1), 13px) 0; }
.cgy .timeline b, .jmr .timeline b { font-size: min(17px, 4.4vw); }
.cgy .timeline p, .jmr .timeline p { font-size: min(14px, 3.6vw); line-height: 1.55; }

/* ---------- 姜睦然页：简介 + 三个大数字 + 成长路径 ---------- */

/* 成长路径：一条竖线串起各阶段，重点阶段为橙色圆点 */
.jr-path {
  flex: 1;
  --gap: clamp(8px, calc(var(--vh) * 1.6), 20px);
  display: flex; flex-direction: column; justify-content: center; gap: var(--gap);
  margin: clamp(12px, calc(var(--vh) * 2.2), 24px) var(--gutter) 0;
  padding: 0 0 0 18px; list-style: none;
  position: relative;
}
.jr-path li { position: relative; }
/* 竖线只连接相邻两个圆点 */
.jr-path li:not(:last-child)::after { content: ""; position: absolute; left: -14px; top: calc(.5em + 10px); bottom: calc(-1 * var(--gap) - .5em); width: 2px; background: var(--rule); }
.jr-path li::before { content: ""; position: absolute; left: -18px; top: .5em; width: 10px; height: 10px; border-radius: 50%; background: var(--paper); box-shadow: inset 0 0 0 2px var(--muted); }
.jr-path li.is-key::before { background: var(--signal); box-shadow: 0 0 0 3px rgba(255, 90, 0, .2); }
.jr-path p { font-size: min(14px, 3.6vw); line-height: 1.6; color: #2b2b29; }
.jr-path b { margin-right: 6px; font-family: var(--num); font-size: min(17px, 4.4vw); font-weight: 700; color: var(--muted); vertical-align: -1px; }
.jr-path em {
  display: inline-block; margin-right: 6px; padding: 0 5px;
  font-style: normal; font-size: 11.5px; font-weight: 600; line-height: 1.6;
  color: var(--signal-deep); border: 1px solid var(--signal); border-radius: 3px; vertical-align: 1px;
}
.jr-path .is-key b { color: var(--signal); }
.jr-path .is-key em { color: var(--ink); background: var(--signal); }
.jr-path .is-key p { font-weight: 600; color: var(--ink); }
@media (max-height: 820px) {
  .jr-path p { line-height: 1.5; }
  .jmr .dp__source { display: none; }   /* 较矮屏幕上省去资料来源一行 */
}
@media (max-height: 780px) { .jr-path p { line-height: 1.45; } }

/* 姜睦然页横幅第二行较长：按钮改为贴右下角浮动，文字可用满整行宽度（小字较短，不会与按钮重叠） */
.jmr .dp__turn { position: relative; }
.jmr .dp__turn .next-btn { position: absolute; right: var(--gutter); bottom: calc(clamp(12px, calc(var(--vh) * 2), 20px) + env(safe-area-inset-bottom)); }

/* ---------- 投入理念：天赋 × 兴趣四象限 ---------- */
.quad__lead { margin: clamp(10px, calc(var(--vh) * 1.8), 18px) var(--gutter) 0; font-size: min(14px, 3.6vw); line-height: 1.55; color: var(--muted); }

.quad__chart {
  flex: none;
  height: min(372px, 96vw, calc(var(--vh) * 44));
  display: grid;
  grid-template-columns: 20px 1fr;
  grid-template-rows: 1fr 22px;
  /* 左侧给“天赋”文字留了 20px，整体左移 10px，让四个方块在页面中水平居中 */
  margin: clamp(14px, calc(var(--vh) * 2.6), 28px) calc(var(--gutter) + 10px) clamp(8px, calc(var(--vh) * 1.4), 16px) calc(var(--gutter) - 10px);
  min-height: 0;
}
.quad__grid {
  position: relative;
  grid-column: 2; grid-row: 1;
  display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 6px;
  width: 100%; height: 100%;
  align-self: center; justify-self: center;
  margin-top: 12px;          /* 给纵轴箭头留出位置 */
  padding: 0 0 6px 6px;
  border-left: 2px solid var(--ink); border-bottom: 2px solid var(--ink);
}
/* 坐标轴箭头：画在两条轴线的末端 */
.quad__grid::before, .quad__grid::after { content: ""; position: absolute; width: 0; height: 0; }
.quad__grid::before {   /* 纵轴：顶端向上 */
  left: -7px; top: -11px;
  border-left: 6px solid transparent; border-right: 6px solid transparent;
  border-bottom: 11px solid var(--ink);
}
.quad__grid::after {    /* 横轴：右端向右 */
  right: -11px; bottom: -7px;
  border-top: 6px solid transparent; border-bottom: 6px solid transparent;
  border-left: 11px solid var(--ink);
}
/* 坐标轴文字：贴着箭头 */
.quad__axis { position: absolute; margin: 0; font-size: 13px; font-weight: 600; line-height: 1.2; }
.quad__axis--y { left: -26px; top: -8px; writing-mode: vertical-rl; letter-spacing: .1em; }
.quad__axis--x { right: -10px; bottom: -28px; letter-spacing: .1em; }

.quad__cell {
  display: flex; flex-direction: column; justify-content: center;
  padding: 10px 12px;
  border-radius: 6px;
  opacity: 0; transform: scale(.92);
}
.quad__cell b { font-size: min(19px, 4.9vw); line-height: 1.25; }
.quad__cell span { margin-top: 6px; font-size: min(13px, 3.4vw); opacity: .8; }
/* 颜色深浅 = 投入力度 */
.quad__cell.is-all-in { background: var(--signal); color: var(--ink); }
.quad__cell.is-focus { background: var(--signal-weak); color: var(--ink); }
.quad__cell.is-careful { background: #fff; color: var(--ink); box-shadow: inset 0 0 0 1px var(--rule); }
.quad__cell.is-no { background: var(--rule); color: var(--muted); }
.quad__cell.is-no b { text-decoration: line-through; text-decoration-thickness: 2px; }

.quad.is-active .quad__cell { animation: tile .45s cubic-bezier(.2, 1.3, .4, 1) forwards; animation-delay: var(--d); }
.quad.is-active .quad__cell.is-all-in { animation: tile .45s cubic-bezier(.2, 1.3, .4, 1) var(--d) forwards, pulse .6s ease 2.3s; }

/* 说明文字 + 四象限作为一组，在标题下方的剩余空间里垂直居中 */
.quad .quad__lead { margin-top: auto; }
.quad .dp__turn { margin-top: auto; }

/* 象限可点击 */
.quad__cell { text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.quad__cell:active { filter: brightness(.94); }

/* ---------- 底部弹窗：四象限解读 ---------- */
.sheet { position: fixed; inset: 0; z-index: 50; }
.sheet[hidden] { display: none; }
.sheet__mask { position: absolute; inset: 0; background: rgba(0, 0, 0, .45); animation: mask-in .25s ease; }
.sheet__panel {
  position: absolute; left: 0; right: 0; bottom: 0;
  max-width: 480px; margin: 0 auto;
  padding: 22px var(--gutter) calc(18px + env(safe-area-inset-bottom));
  background: var(--paper); color: var(--ink);
  border-radius: 16px 16px 0 0;
  animation: sheet-up .32s cubic-bezier(.2, .8, .2, 1);
  outline: none;
}
.sheet__tag { display: inline-block; padding: 2px 8px; font-size: 12px; font-weight: 600; border-radius: 4px; }
.sheet__title { margin-top: 10px; font-size: 24px; font-weight: 700; line-height: 1.3; }
.sheet__body p { margin-top: 10px; font-size: 15px; line-height: 1.7; color: #2b2b29; }
.sheet__close { display: block; width: 100%; margin-top: 20px; padding: 12px 0; font-size: 16px; font-weight: 600; color: #fff; background: var(--ink); border-radius: 8px; }
/* 标签颜色与象限一致 */
.sheet[data-note="all-in"] .sheet__tag { background: var(--signal); }
.sheet[data-note="focus"] .sheet__tag { background: var(--signal-weak); }
.sheet[data-note="careful"] .sheet__tag { background: #fff; box-shadow: inset 0 0 0 1px var(--rule); }
.sheet[data-note="no"] .sheet__tag { background: var(--rule); color: var(--muted); }
@keyframes sheet-up { from { transform: translateY(100%); } to { transform: none; } }
@keyframes mask-in { from { opacity: 0; } }

@keyframes tile { to { opacity: 1; transform: none; } }
@keyframes pulse { 50% { transform: scale(1.04); } }

.dp__source { padding: 6px var(--gutter) 0; font-size: 10.5px; line-height: 1.5; color: var(--muted); }

.dp__turn {
  margin-top: clamp(10px, calc(var(--vh) * 2), 20px);
  margin-bottom: calc(-1 * env(safe-area-inset-bottom));
  padding: clamp(16px, calc(var(--vh) * 3), 26px) var(--gutter) calc(clamp(16px, calc(var(--vh) * 3), 26px) + env(safe-area-inset-bottom));
  background: var(--turn-bg); color: var(--turn-fg);
  display: flex; justify-content: space-between; align-items: flex-end; gap: 16px;
  transform: translateY(100%);
}
.dp.is-active .dp__turn { animation: slide .6s cubic-bezier(.2, .8, .2, 1) 3s forwards; }
/* 第 2 页：横幅等四个阶段播放完（main.js 加上 .is-done）再滑入 */
.opp.is-active .dp__turn { animation: none; }
.opp.is-active.is-done .dp__turn { animation: slide .6s cubic-bezier(.2, .8, .2, 1) 1.2s forwards; }
.opp.is-active .next-btn { animation: none; }
.opp.is-active.is-done .next-btn { animation: bob 1.6s ease-in-out 2s infinite; }
.dp__turn p { font-weight: 600; font-size: min(24px, 6.2vw, calc(var(--vh) * 3.3)); line-height: 1.35; }
.dp__turn small { display: block; margin-top: 6px; font-size: 14px; font-weight: 400; color: var(--turn-muted); }

/* ---------- 项目价值：四步递进（发现 → 转化 → 赋能 → 落地） ---------- */
.offer__list {
  flex: 1;
  display: flex; flex-direction: column; justify-content: center;
  margin: clamp(10px, calc(var(--vh) * 2), 20px) var(--gutter) 0;
  padding: 0; list-style: none;
}
.offer__list li {
  position: relative;
  display: grid; grid-template-columns: 46px 1fr; gap: 10px;
  padding: clamp(8px, calc(var(--vh) * 1.6), 14px) 0;
  border-top: 1px solid var(--rule);
}
.offer__list li:first-child { border-top: 1.5px solid var(--ink); }
.offer__list li:last-child { border-bottom: 1px solid var(--rule); }
.offer__list b { font-family: var(--num); font-weight: 700; font-size: min(30px, 7.8vw, calc(var(--vh) * 4)); line-height: 1; color: var(--signal-weak); }
.offer__list h2 { font-size: min(17px, 4.4vw, calc(var(--vh) * 2.4)); line-height: 1.35; }
.offer__list p { margin-top: 3px; font-size: min(13.5px, 3.5vw, calc(var(--vh) * 2)); line-height: 1.5; color: var(--muted); }
.offer__list .is-end b { color: var(--signal); }
.offer__list .is-end h2 { color: var(--signal-deep); }
/* 与第 2–6 页统一的紧凑字号；行距随屏幕高度伸展 */
.offer .offer__list { margin-top: clamp(14px, calc(var(--vh) * 2.4), 26px); }
.offer .offer__list li { grid-template-columns: 40px 1fr; align-items: baseline; padding: clamp(10px, calc(var(--vh) * 2), 20px) 0; }
.offer .offer__list b { font-size: min(24px, 6.2vw); }
.offer .offer__list h2 { font-size: min(16px, 4.1vw); }
.offer .offer__list p { margin-top: 4px; font-size: min(14px, 3.6vw); line-height: 1.55; }

/* ---------- 培养体系：四级进阶卡片 ----------
   每张卡片左侧是“等级格”（像信号格），第几阶段就点亮几格；最后一级为橙色，是整个体系的落点。
   卡片可点击，跳到对应阶段的详情页 */
.levels-list {
  flex: 1;
  display: flex; flex-direction: column; justify-content: center; gap: 8px;
  margin: clamp(12px, calc(var(--vh) * 2.2), 22px) var(--gutter) 0;
  padding: 0; list-style: none;
}
.levels-list li { opacity: 0; transform: translateX(-16px); }
.levels-list a {
  display: grid; grid-template-columns: 22px 30px 1fr 14px; align-items: center; column-gap: 10px;
  padding: clamp(10px, calc(var(--vh) * 1.6), 14px) 12px clamp(10px, calc(var(--vh) * 1.6), 14px) 14px;
  background: #fff;
  color: inherit; text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  transition: transform .2s ease, box-shadow .2s ease;
}
.levels-list a:active { transform: scale(.98); }
@media (hover: hover) { .levels-list a:hover { box-shadow: 0 6px 18px rgba(0, 0, 0, .08); } }
.levels-list b { font-family: var(--num); font-weight: 700; font-size: min(24px, 6.2vw, calc(var(--vh) * 3.2)); line-height: 1; color: var(--signal-weak); }
.levels-list h2 { font-size: min(15.5px, 4vw, calc(var(--vh) * 2.25)); line-height: 1.35; }
.levels-list p { margin-top: 2px; font-size: min(12.5px, 3.3vw); line-height: 1.45; color: var(--muted); }

/* 等级格：四根由矮到高的竖条，按阶段点亮 */
.levels { display: flex; align-items: flex-end; gap: 2px; height: 18px; }
.levels i { width: 4px; background: var(--rule); border-radius: 1px; }
.levels i:nth-child(1) { height: 6px; }
.levels i:nth-child(2) { height: 10px; }
.levels i:nth-child(3) { height: 14px; }
.levels i:nth-child(4) { height: 18px; }
/* 进入页面后，卡片出现时点亮对应格数 */
.levels i { transition: background-color .3s ease; transition-delay: calc(var(--i) * .22s + 1.1s); }
.system.is-active .levels-list li:nth-child(1) .levels i:nth-child(-n+1),
.system.is-active .levels-list li:nth-child(2) .levels i:nth-child(-n+2),
.system.is-active .levels-list li:nth-child(3) .levels i:nth-child(-n+3) { background: var(--signal); }

.levels__go { width: 14px; height: 14px; fill: none; stroke: var(--muted); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* 最后一级：橙色底，体系的落点 */
.levels-list li:last-child a { background: var(--signal); }
.levels-list li:last-child b { color: var(--ink); }
.levels-list li:last-child p { color: var(--turn-muted); }
.levels-list li:last-child .levels__go { stroke: var(--ink); }
.system.is-active .levels-list li:last-child .levels i { background: var(--ink); }

.levels-list__hint { margin: 10px var(--gutter) 0; font-size: 12.5px; color: var(--muted); }

.system.is-active .levels-list li { animation: in .45s cubic-bezier(.2, .8, .2, 1) forwards; animation-delay: calc(var(--i) * .22s + .8s); }
@media (max-height: 700px) { .levels-list__hint { display: none; } }

/* ---------- 阶段页（第 9–12 页）：阶段名 + 内容 + 阶段成果 ---------- */
.stage__meta {
  display: flex; align-items: baseline; gap: 10px;
  margin: clamp(8px, calc(var(--vh) * 1.6), 14px) var(--gutter) 0;
  font-size: min(14px, 3.7vw); color: var(--muted);
}

.modules { flex: 1; display: flex; flex-direction: column; justify-content: center; margin: clamp(8px, calc(var(--vh) * 1.6), 16px) var(--gutter) 0; padding: 0; list-style: none; counter-reset: mod; }
.modules li { position: relative; padding: clamp(8px, calc(var(--vh) * 1.4), 12px) 0 clamp(8px, calc(var(--vh) * 1.4), 12px) 16px; border-top: 1px solid var(--rule); }
.modules li:first-child { border-top: 1.5px solid var(--ink); }
.modules li:last-child { border-bottom: 1px solid var(--rule); }
.modules li::before { content: ""; position: absolute; left: 0; top: calc(clamp(8px, calc(var(--vh) * 1.4), 12px) + .5em); width: 6px; height: 6px; border-radius: 50%; background: var(--signal); }
.modules h2 { font-size: min(16px, 4.2vw, calc(var(--vh) * 2.3)); line-height: 1.35; }
.modules p { margin-top: 2px; font-size: min(13.5px, 3.5vw, calc(var(--vh) * 2)); line-height: 1.5; color: var(--muted); }
/* 较矮屏幕（如 390×760）：收紧条目间距，第一阶段说明较长时横幅仍能完整显示 */
@media (max-height: 780px) {
  .modules li { padding-top: 7px; padding-bottom: 7px; }
  .modules li::before { top: calc(7px + .5em); }
}

.stage__output {
  display: flex; align-items: baseline; gap: 10px;
  margin: clamp(8px, calc(var(--vh) * 1.6), 14px) var(--gutter) 0;
  padding: 10px 12px;
  font-size: min(14px, 3.7vw); font-weight: 600; line-height: 1.5;
  background: #fff; border-left: 3px solid var(--signal);
}
.stage__output b { flex: none; font-size: 12px; color: var(--signal-deep); }

/* 阶段 2：兴趣发展四阶段 */
/* 兴趣发展四阶段：左侧成长轨道，节点由浅到深、由小到大，表示兴趣逐步增强 */
.growth { flex: 1; display: flex; flex-direction: column; justify-content: center; margin: clamp(10px, calc(var(--vh) * 2), 20px) var(--gutter) 0; }
.growth ol { margin: 0; padding: 0; list-style: none; }
.growth__group, .growth li { --rail: 11px; position: relative; padding-left: 34px; opacity: 0; transform: translateY(10px); }
.growth__group { display: flex; align-items: baseline; gap: 8px; padding-top: clamp(4px, calc(var(--vh) * .8), 8px); padding-bottom: clamp(4px, calc(var(--vh) * .8), 8px); font-size: 13px; font-weight: 600; letter-spacing: .1em; }
.growth__group span { font-size: 12px; font-weight: 400; letter-spacing: 0; color: var(--muted); }
.growth__group::after { content: ""; flex: 1; align-self: center; border-top: 1px solid var(--rule); }
.growth li { display: grid; grid-template-columns: 30px 1fr; align-items: center; column-gap: 8px; padding-top: clamp(7px, calc(var(--vh) * 1.2), 11px); padding-bottom: clamp(7px, calc(var(--vh) * 1.2), 11px); }
/* 轨道线：贯穿四个节点，第一段从节点起，最后一段到节点止 */
.growth li::before { content: ""; position: absolute; left: calc(var(--rail) - 1px); top: 0; bottom: 0; width: 2px; background: var(--signal-weak); }
.growth .growth__group:first-child + ol li:first-child::before { top: 50%; }
.growth ol:last-child li:last-child::before { bottom: 50%; }
.growth__group:not(:first-child)::before { content: ""; position: absolute; left: calc(var(--rail) - 1px); top: 0; bottom: 0; width: 2px; background: var(--signal-weak); }
/* 节点 */
.growth li::after {
  content: ""; position: absolute; top: 50%; left: var(--rail);
  --dot: 10px;
  width: var(--dot); height: var(--dot); border-radius: 50%;
  transform: translate(-50%, -50%);
}
.growth ol:first-of-type li:nth-child(1)::after { background: #fff; box-shadow: inset 0 0 0 2px var(--signal-weak); }
.growth ol:first-of-type li:nth-child(2)::after { --dot: 12px; background: #fbd6c0; box-shadow: inset 0 0 0 2px var(--signal-weak); }
.growth ol:last-of-type li:nth-child(1)::after { --dot: 14px; background: var(--signal-weak); }
.growth ol:last-of-type li:nth-child(2)::after { --dot: 18px; background: var(--signal); box-shadow: 0 0 0 5px rgba(255, 90, 0, .18); }
.growth b { font-family: var(--num); font-weight: 700; font-size: min(24px, 6.2vw, calc(var(--vh) * 3.2)); line-height: 1; color: var(--signal-weak); }
.growth h2 { font-size: min(17px, 4.4vw, calc(var(--vh) * 2.4)); line-height: 1.3; }
.growth p { margin-top: 2px; font-size: min(13.5px, 3.5vw, calc(var(--vh) * 2)); line-height: 1.45; color: var(--muted); }
.growth ol:last-of-type li:last-child b { color: var(--signal); }
.growth ol:last-of-type li:last-child h2 { color: var(--signal-deep); }
.stage.is-active .growth li, .stage.is-active .growth__group { animation: in .45s cubic-bezier(.2, .8, .2, 1) forwards; animation-delay: calc(var(--i) * .3s + .9s); }
@media (max-height: 760px) {
  .growth__group span { display: none; }
  .growth li { padding-top: 5px; padding-bottom: 5px; }
}
.phases__note { margin: 10px var(--gutter) 0; font-size: 13px; color: var(--muted); }

/* 阶段 4：两条路线 */
.tracks { flex: 1; display: grid; grid-template-columns: 1fr 1fr; align-content: center; gap: 10px; margin: clamp(10px, calc(var(--vh) * 2), 20px) var(--gutter) 0; }
.tracks section { padding: 12px; border-top: 3px solid var(--signal); background: rgba(255, 255, 255, .5); }
.tracks h2 { font-size: min(17px, 4.4vw); }
.tracks ol { margin: 8px 0 0; padding: 0; list-style: none; counter-reset: step; }
.tracks li { position: relative; padding: 5px 0 5px 22px; font-size: min(13.5px, 3.5vw); line-height: 1.4; counter-increment: step; }
.tracks li::before { content: counter(step); position: absolute; left: 0; top: 5px; width: 16px; height: 16px; border-radius: 50%; background: var(--ink); color: var(--paper); font-family: var(--num); font-size: 11px; line-height: 16px; text-align: center; }

/* ---------- 培养团队与遴选 ---------- */
.faculty { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 10px; margin: clamp(12px, calc(var(--vh) * 2.2), 22px) var(--gutter) 0; }
.faculty__org { padding: clamp(10px, calc(var(--vh) * 1.6), 14px) 16px clamp(12px, calc(var(--vh) * 1.8), 16px); background: #fff; border-top: 3px solid var(--signal); }
.faculty__org h2 {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  padding-bottom: clamp(6px, calc(var(--vh) * 1), 9px);
  border-bottom: 1px solid var(--rule);
  font-size: 15px; letter-spacing: .06em;
}
.faculty__org small { font-family: var(--num); font-size: 11px; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.faculty__org ul { margin: 0; padding: 0; list-style: none; }
.faculty__org li { display: flex; flex-direction: column; padding-top: clamp(8px, calc(var(--vh) * 1.3), 12px); }
.faculty__org li + li { margin-top: clamp(8px, calc(var(--vh) * 1.3), 12px); border-top: 1px dashed var(--rule); }
.faculty__org b { font-size: min(18px, 4.6vw, calc(var(--vh) * 2.6)); line-height: 1.3; }
.faculty__org i { position: relative; margin-top: 3px; padding-left: 12px; font-style: normal; font-size: 13px; color: var(--signal-deep); }
.faculty__org i::before { content: ""; position: absolute; left: 0; top: .55em; width: 6px; height: 6px; border-radius: 50%; background: var(--signal); }

.admit {
  display: grid; grid-template-columns: 1fr 1fr;
  margin: clamp(10px, calc(var(--vh) * 1.8), 18px) var(--gutter) 0;
  padding: clamp(10px, calc(var(--vh) * 1.6), 14px) 16px;
  background: var(--ink); color: var(--paper);
}
.admit div + div { padding-left: 16px; border-left: 1px solid rgba(255, 255, 255, .2); }
.admit dt { font-size: 12.5px; letter-spacing: .08em; color: #a3a39e; }
.admit dd { margin: 4px 0 0; font-size: min(18px, 4.6vw, calc(var(--vh) * 2.6)); font-weight: 600; line-height: 1.2; }
.admit dd b { font-family: var(--num); font-size: 1.5em; letter-spacing: .02em; color: var(--signal); }
.admit div:last-child dd { color: var(--signal); }

/* ---------- 寒假培养：时间、费用、联系人 ---------- */
.camp__info { display: flex; flex-direction: column; gap: 8px; margin: clamp(14px, calc(var(--vh) * 2.6), 26px) var(--gutter) 0; }
.camp__info div { padding: clamp(10px, calc(var(--vh) * 1.6), 14px) 14px; background: #fff; border-left: 3px solid var(--signal); }
.camp__info dt { font-size: 13px; color: var(--muted); }
.camp__info dd { margin: 4px 0 0; font-size: min(20px, 5.2vw, calc(var(--vh) * 2.8)); font-weight: 600; line-height: 1.3; }
.camp__info dd b { font-family: var(--num); font-size: 1.7em; line-height: 1; color: var(--signal-deep); letter-spacing: .02em; }

.camp__contact {
  flex: 1; display: flex; align-items: center; gap: 16px;
  margin: clamp(12px, calc(var(--vh) * 2.2), 22px) var(--gutter) 0;
}
.camp__contact img {
  flex: none; display: block;
  width: min(150px, 38vw, calc(var(--vh) * 19)); height: auto;
  padding: 10px; background: #fff;
}
.camp__label { font-size: 13px; color: var(--muted); }
.camp__name { margin-top: 2px; font-size: min(24px, 6vw, calc(var(--vh) * 3.2)); font-weight: 600; }
.camp__tip { margin-top: 8px; font-size: 13px; line-height: 1.6; color: var(--muted); }

/* 矮屏（如微信内的小屏手机）：收紧数据页的间距，保证结论横幅完整显示 */
@media (max-height: 680px) {
  .dp__top { padding-top: 12px; }
  .dp__headline { line-height: 1.08; }
  .dp__source { font-size: 10px; line-height: 1.4; }
  .dp__turn {
    padding-top: 12px;
    padding-bottom: calc(12px + env(safe-area-inset-bottom));
  }
  .dp__turn small { margin-top: 3px; }
}

/* 陈广宇、姜睦然页经历较多，屏幕高度不足 840 时隐藏次要的一条 */
@media (max-height: 840px) {
  .cgy .timeline .is-minor, .jmr .timeline .is-minor, .cgy .jr-path .is-minor { display: none; }
}
/* 新闻页、人物页在较矮屏幕上隐藏次要信息（微信内常见高度约 700–780px） */
@media (max-height: 800px) {
  .timeline .is-minor { display: none; }
}
/* 第 3 页新闻列表：只在高度不足 750 的屏幕上隐藏次要条目 */
@media (max-height: 750px) {
  .corps .is-minor, .degree .corps .is-minor { display: none; }
}
@media (max-height: 700px) {
  .praise cite { display: none; }
  .timeline li { padding: 5px 0; }
  .corps ul + h2 { margin-top: 6px; }
  .corps li { padding: 5px 0; }
  .opp__board { gap: 8px; }
  .values li { padding: 6px 0; }
}

/* ---------- 动画 ---------- */
@keyframes in { to { opacity: 1; transform: none; } }
@keyframes grow { to { transform: scaleY(1); } }
@keyframes slide { to { transform: none; } }
@keyframes bob { 50% { transform: translateY(4px); } }
@keyframes ring { 0% { opacity: .45; transform: scale(1); } 100% { opacity: 0; transform: scale(3.2); } }
@keyframes pop { from { opacity: 0; transform: scale(0); } to { opacity: 1; transform: scale(1); } }
@keyframes nudge { 50% { transform: translateY(-5px); } }
@keyframes fade { to { opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-delay: 0s !important; }
  .track.is-animating { transition-duration: .01ms; }
  .cover.is-active .cover__top::before, .page.is-active .next-btn, .cover.is-active .cover__hint svg { animation: none; }
  .path li.is-current button::before { animation: none; }
}

/* ==========================================================================
   三端适配
   手机（< 768px）：上面的默认版式
   平板竖屏（≥ 768px）：沿用手机版式，内容居中、两侧加宽留白
   平板横屏、电脑（≥ 1024px 且横屏）：左栏标题、右栏内容，结论横幅横跨底部
   ========================================================================== */
@media (min-width: 768px) {
  :root { --gutter: max(40px, calc((100vw - 600px) / 2)); }
  .sheet__panel { max-width: 600px; border-radius: 16px 16px 0 0; }

  /* 屏幕更高：内容不再拉伸填满，而是作为一组在顶栏与横幅之间垂直居中 */
  .dp__aside > *, .dp__main > * { flex: none; }
  .page.dp .dp__top { margin-bottom: auto; }
  .page.dp .dp__turn { margin-top: auto; }
  .page.quad .quad__lead { margin-top: clamp(16px, calc(var(--vh) * 3), 28px); }
}
/* 平板竖屏：正文整体放大一档，与屏幕尺寸相称（标题与横幅已按屏幕取值，不再放大） */
@media (min-width: 768px) and (orientation: portrait) {
  :root { --gutter: max(40px, calc((100vw - 640px) / 2)); }
  /* 放大的元素里边距也会被放大，所以先除以 1.2，保证左右边缘与标题对齐 */
  .dp__aside > :not(.dp__headline), .dp__main > *, .dp__source { zoom: 1.2; --gutter: max(33.33px, calc((100vw - 640px) / 2.4)); }
  .page.dp .dp__headline { font-size: min(52px, 6.4vw, calc(var(--vh) * 5.8)); }
  .page.dp .dp__turn p { font-size: min(28px, 3.6vw, calc(var(--vh) * 3.2)); }
  .page.dp .dp__turn small { font-size: 16px; }
  .cover__name { font-size: min(96px, 12vw, calc(var(--vh) * 9)); }
  .cover__sub { font-size: min(28px, 3.6vw); }
  .cover__slogan { font-size: min(24px, 3.1vw); }
  .cover__steps li { font-size: 14px; }
}

@media (min-width: 1024px) and (orientation: landscape) {
  :root {
    --gutter: max(56px, calc((100vw - 1360px) / 2));   /* 内容最宽 1360px，居中 */
    --col-gap: clamp(48px, 6vw, 112px);
  }

  /* ---------- 封面：左大字，右成长柱 ---------- */
  .cover {
    display: grid;
    grid-template-columns: var(--gutter) minmax(0, 1fr) var(--col-gap) minmax(0, 1fr) var(--gutter);
    grid-template-rows: minmax(0, 1fr);
    align-items: center;
    padding: clamp(56px, calc(var(--vh) * 9), 96px) 0 clamp(88px, calc(var(--vh) * 12), 120px);
  }
  .cover__text { grid-column: 2; display: flex; flex-direction: column; align-items: flex-start; }
  .cover__art { grid-column: 4; margin-top: 0; }
  .cover__name { font-size: min(104px, 7.2vw, calc(var(--vh) * 12)); }
  .cover__sub { margin-top: 14px; font-size: min(28px, 2vw); }
  .cover__slogan { margin-top: clamp(24px, calc(var(--vh) * 4), 40px); font-size: min(24px, 1.7vw, calc(var(--vh) * 3)); }
  .cover__bars { height: min(440px, calc(var(--vh) * 52)); gap: 14px; }
  .cover__steps { gap: 14px; }
  .cover__steps li { font-size: 14px; }

  /* ---------- 内容页：顶栏 / 左栏 + 右栏 / 资料来源 / 结论横幅 ---------- */
  .dp {
    display: grid;
    grid-template-columns: var(--gutter) minmax(0, 1fr) var(--col-gap) minmax(0, 1fr) var(--gutter);
    grid-template-rows: auto minmax(0, 1fr) auto auto;
  }
  .dp__top, .dp__turn { grid-column: 1 / -1; }
  .dp__turn { grid-row: 4; }
  .dp__aside, .dp__main {
    --gutter: 0px;      /* 栏内元素不再单独留边 */
    grid-row: 2;
    display: flex; flex-direction: column; justify-content: center;
    min-height: 0;
    padding: clamp(16px, calc(var(--vh) * 3), 40px) 0;
  }
  .dp__aside { grid-column: 2; }
  .dp__main { grid-column: 4; }
  .page.dp .dp__top { margin-bottom: 0; }
  .dp__source { grid-column: 2 / 5; grid-row: 3; padding: 0 0 4px; }

  .page.dp .dp__headline {
    padding-top: 0;
    font-size: min(52px, 3.6vw, calc(var(--vh) * 6.4));
    line-height: 1.18;
  }
  .page.opp .dp__lead { margin-top: clamp(20px, calc(var(--vh) * 3.4), 36px); font-size: 15px; line-height: 1.8; }
  .page.opp .dp__lead-key { font-size: 18px; }
  .page.quad .quad__lead { margin-top: clamp(16px, calc(var(--vh) * 3), 28px); font-size: 15px; }
  .page.quad .quad__chart { height: min(440px, calc(var(--vh) * 54)); margin-top: 0; }
  .stage__meta { margin-top: clamp(16px, calc(var(--vh) * 3), 28px); font-size: 16px; }

  /* 结论横幅：宽屏上一行写完，按钮居中对齐 */
  .page.dp .dp__turn {
    margin-top: 0;
    padding-top: clamp(16px, calc(var(--vh) * 2.6), 28px);
    padding-bottom: calc(clamp(16px, calc(var(--vh) * 2.6), 28px) + env(safe-area-inset-bottom));
    align-items: center;
  }
  .page.dp .dp__turn p { font-size: min(26px, 2vw, calc(var(--vh) * 3.2)); }
  .page.dp .dp__turn p br { display: none; }
  .page.dp .dp__turn small { margin-top: 4px; font-size: 15px; }
  .page.jmr .dp__turn .next-btn { position: static; }
}
/* 电脑屏幕较大时，正文整体放大一档 */
@media (min-width: 1280px) and (min-height: 760px) and (orientation: landscape) {
  .dp__main { zoom: 1.2; }
  .dp__aside > :not(.dp__headline), .dp__source { zoom: 1.15; }
}