/* 「关于 Alpenrise」页(/about/ 与 /zh/ 共用)。原名 about.css,2026-09-27 改名:旧版同名文件被 alpenrise.app 的边缘缓存(静态文件 4 小时)盖住,
   线上一度整页无样式。2026-09-27 改版:「海拔」编辑式排版(Michael 给的参考稿 About Alpenrise B - Altitude)
   + 纸雕美术(hero.webp / band.webp 由 gpt-image 出,16 座小屋等取自 climb-src/art)。
   2026-10-07 统一外壳:字体、颜色令牌、页头、页脚都在 /site.css(两页先引它)。这里只留编辑式版面与自己的两根细线 --hair / --hair2。
   🔴 全站只有夜色,别再加 prefers-color-scheme 分支。/zh/* 的 CSP 不放内联样式,所有版面都在这一份文件里。
   🔴 改完跑 `python3 web/shell/build_shell.py`(按内容哈希改写两页的 ?v=,别再手动加一)。
   颜色名对照(本文件原名 → site.css):--bg → --night、--bg2 → --night2、--fg → --ink、--mute → --ink4、--mute2 → --ink3、
   --acc → --lamp、--ink(按钮上的深色字)→ --lampink、--line / --line2(半透明细线)→ --hair / --hair2。 */
:root{ --hair:rgba(238,242,248,.16); --hair2:rgba(238,242,248,.08); --plate:#121e2a; }
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--night);color:var(--ink);font:16px/1.55 var(--sans);-webkit-font-smoothing:antialiased;min-height:100vh}
a{color:var(--lamp);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:4px}
img{max-width:100%;height:auto}
h1,h2,h3,p,ul,ol,figure{margin:0}
h1,h2,h3,.btn,.plan .ph span,.summit .big,.camps .cap h3{font-family:var(--disp)}
.page{max-width:1440px;margin:0 auto}
.gx{padding-left:clamp(20px,4vw,48px);padding-right:clamp(20px,4vw,48px)}
.mono{font:500 12px/1.5 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink4)}
.mono.acc{color:var(--lamp)}
.rule{border-bottom:1px solid var(--hair)}


/* 首屏:巨型标题 + 导语 / CTA 两栏 + 纸雕横幅 */
.hero{padding-top:clamp(40px,7vw,96px)}
.meta{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.hero h1{font-weight:800;font-size:clamp(54px,12vw,184px);line-height:.88;letter-spacing:-.05em;text-wrap:balance}
.hero-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:clamp(24px,4vw,64px);
  padding:clamp(36px,5vw,64px) 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);margin-top:clamp(32px,4vw,56px)}
.lead{font-size:clamp(18px,1.7vw,22px);line-height:1.45;text-wrap:pretty;max-width:760px}
@media(min-width:1024px){.lead{grid-column:span 2}}
.cta{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.btn{display:flex;justify-content:space-between;gap:24px;width:100%;max-width:340px;background:var(--lamp);color:var(--lampink);padding:18px 24px;font-weight:600;font-size:18px}
.btn:hover{text-decoration:none;filter:brightness(1.06)}
.btn:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.ctanote{font:13px/1.5 var(--mono);color:var(--ink4)}
.more{font-weight:600}
.band{margin-top:clamp(32px,4vw,56px);border:1px solid var(--hair);background:var(--plate);overflow:hidden}
.band img{display:block;width:100%;height:auto}

/* 六个要点:细线网格,每格底线 */
.feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.feat{padding:32px 24px 40px 0;border-bottom:1px solid var(--hair);display:flex;flex-direction:column;gap:14px}
.feat h3{font-weight:600;font-size:24px;line-height:1.1;letter-spacing:-.02em}
.feat p{line-height:1.55;color:var(--ink4)}

/* 章节:海拔标签 + 大标题 + 正文,右侧图版 */
.chapters{padding-top:clamp(64px,8vw,112px)}
.chapter{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:clamp(24px,4vw,56px);padding-bottom:clamp(48px,6vw,80px);border-bottom:1px solid var(--hair)}
.chapter .text{display:flex;flex-direction:column;gap:20px}
.chapter h2{font-weight:800;font-size:clamp(40px,6vw,88px);line-height:.9;letter-spacing:-.045em}
.chapter p{font-size:18px;line-height:1.55;color:var(--ink4);max-width:560px;text-wrap:pretty}
.chapter p strong{color:var(--ink);font-weight:600}
.plate{border:1px solid var(--hair);background:var(--plate);overflow:hidden;align-self:start}
.plate img{display:block;width:100%;height:auto}

/* 十六座营地:四条山脊 × 四座小屋,细线表格 */
.camps{border-bottom:1px solid var(--hair)}
.camps .cap{padding:clamp(28px,4vw,44px) 0 18px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:baseline}
.camps .cap h3{font-weight:600;font-size:24px;letter-spacing:-.02em}
.ridge{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--hair)}
.ridge .rl{grid-column:1/-1;padding:14px 0 4px;display:flex;align-items:center;gap:10px}
.ridge .rl i{width:10px;height:10px;border-radius:2px;background:var(--rc,var(--lamp))}
.ridge.maths{--rc:#2dd4bf}.ridge.science{--rc:#7dd3fc}.ridge.english{--rc:#ffb042}.ridge.humanities{--rc:#f0a6c2}
.hut{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 8px 22px;text-align:center;border-left:1px solid var(--hair2)}
.hut:first-of-type{border-left:0}
.hut img{height:96px;width:auto;filter:drop-shadow(0 10px 14px rgba(0,0,0,.35))}
.hut figcaption{font:500 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink4)}
@media(min-width:760px){
  .ridge{grid-template-columns:160px repeat(4,1fr)}
  .ridge .rl{grid-column:auto;padding:18px 0}
  .hut{border-left:1px solid var(--hair2)}
  .hut:first-of-type{border-left:1px solid var(--hair2)}
}

/* 三段并排:定级 / 每晚 / 夜巡,各带一件仪表样式的小样 */
.tri{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(24px,4vw,56px);padding-top:clamp(48px,6vw,80px);padding-bottom:clamp(48px,6vw,80px);border-bottom:1px solid var(--hair)}
.tri .col{display:flex;flex-direction:column;gap:16px}
.tri h2{font-weight:800;font-size:clamp(32px,4vw,52px);line-height:.95;letter-spacing:-.04em}
.tri p{line-height:1.6;color:var(--ink4);text-wrap:pretty}
.inst{margin-top:auto;border:1px solid var(--hair);padding:14px 16px 16px;display:flex;flex-direction:column;gap:10px;background:var(--night2)}
.inst-h{display:flex;justify-content:space-between;gap:12px;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink4)}
.inst-h b{color:var(--ink);font-weight:500}
.row{display:grid;grid-template-columns:92px 1fr 22px;align-items:center;gap:10px;font:13px var(--mono);color:var(--ink4)}
.row .v{text-align:right;color:var(--ink)}
.seg{display:flex;gap:3px}
.seg i{flex:1;height:8px;background:var(--hair)}
.seg i.on{background:var(--lamp)}
.lamps{display:flex;justify-content:space-between;align-items:flex-end;gap:4px;padding:6px 0 2px}
.lamps img{height:46px;width:auto}
.lamps img.dim{filter:grayscale(1) brightness(.55);opacity:.7}
@media(prefers-reduced-motion:no-preference){
  .lamps img.lit{animation:flick 3.2s ease-in-out infinite alternate}
  .lamps img.lit:nth-child(2n){animation-delay:-1.1s}.lamps img.lit:nth-child(3n){animation-delay:-2s}
  @keyframes flick{from{filter:brightness(1)}to{filter:brightness(1.18)}}
}
.tl{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;position:relative}
.tl::before{content:"";position:absolute;left:8px;right:8px;top:7px;height:1px;background:var(--hair)}
.tl li{display:flex;flex-direction:column;gap:6px;font:12px/1.35 var(--mono);color:var(--ink4);position:relative;padding-top:20px}
.tl li::before{content:"";position:absolute;left:0;top:0;width:14px;height:14px;border-radius:50%;border:2px solid var(--lamp);background:var(--night2)}
.tl li.miss::before{border-color:var(--bad)}
.tl li.ok::before{background:var(--lamp)}
.tl li b{color:var(--ink);font-weight:500}

/* 大本营:家长周报的小样 + 正文 */
.parent{padding-top:clamp(64px,8vw,112px);padding-bottom:clamp(64px,8vw,112px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:clamp(24px,4vw,56px)}
.week{border:1px solid var(--hair);background:var(--night2);padding:18px 20px 20px;display:flex;flex-direction:column;gap:14px;align-self:start}
.week .wk{display:grid;grid-template-columns:112px 1fr;align-items:center;gap:12px;font:13px var(--mono);color:var(--ink4)}
.bar{height:10px;background:var(--hair2);position:relative}
.bar i{position:absolute;left:0;top:0;bottom:0;background:var(--lamp)}
.w1{width:12.5%}.w2{width:25%}.w3{width:37.5%}.w4{width:50%}.w5{width:62.5%}.w6{width:75%}.w7{width:87.5%}.w8{width:100%}
.week .one{border-top:1px solid var(--hair);padding-top:12px;font-size:15px;line-height:1.5}
.week .one b{display:block;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--lamp);margin-bottom:4px}
.week .wk-free{border-top:1px dashed var(--hair);padding-top:12px;font:13px/1.5 var(--mono);color:var(--ink4)}
.week .wk-free b{display:block;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink4);margin-bottom:4px}
.parent .text{display:flex;flex-direction:column;gap:20px}
.parent h2{font-weight:800;font-size:clamp(40px,6vw,88px);line-height:.9;letter-spacing:-.045em}
.parent p{font-size:17px;line-height:1.6;color:var(--ink4);text-wrap:pretty}
.parent p strong{color:var(--ink);font-weight:600}

/* 免费与 Pro */
.plans{background:var(--night2);padding-top:clamp(64px,8vw,112px);padding-bottom:clamp(64px,8vw,112px)}
.plans h2{font-weight:800;font-size:clamp(40px,6vw,88px);line-height:.9;letter-spacing:-.045em;margin-bottom:clamp(32px,4vw,56px)}
.plan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:0 clamp(0px,3vw,48px);border-top:2px solid var(--ink)}
.plan{padding-top:28px;display:flex;flex-direction:column;gap:18px}
.plan .ph{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.plan .ph span{font-weight:600;font-size:28px;letter-spacing:-.02em}
.plan.pro .ph span{color:var(--lamp)}
.plan ul{list-style:none;padding:0;font-size:17px;line-height:1.4}
.plan li{padding:12px 0;border-bottom:1px solid var(--hair)}
.plan .fine{font:13px/1.5 var(--mono);color:var(--ink4)}
.plan li strong{color:var(--ink);font-weight:600}
.plan.pro .ph span{font-size:24px}

/* 词汇:八个词,两栏定义列表(2026-09-27,Michael:「rung 这类专有名词需要解释吗」) */
.gloss{padding-top:clamp(48px,6vw,80px);padding-bottom:clamp(24px,3vw,40px);border-bottom:1px solid var(--hair)}
.gloss .sech{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;border-bottom:1px solid var(--hair);padding-bottom:6px;margin-bottom:8px}
.gloss .sech h2{font:700 24px var(--disp);letter-spacing:-.02em}
.gl{margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:0 clamp(24px,4vw,56px)}
.gl div{display:grid;grid-template-columns:110px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--hair2)}
.gl dt{font-weight:600;color:var(--ink)}
.gl dd{margin:0;color:var(--ink4);line-height:1.5;font-size:14.5px}
html[lang="zh-Hans"] .gl div{grid-template-columns:130px 1fr}
@media(max-width:480px){.gl div{grid-template-columns:1fr;gap:2px}}

/* 峰顶:收束句 */
.summit{padding-top:clamp(72px,10vw,160px);padding-bottom:clamp(72px,10vw,160px);display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end}
.summit .big{font-weight:800;font-size:clamp(36px,6vw,92px);line-height:.95;letter-spacing:-.045em;margin-top:16px;text-wrap:balance}
.summit img{height:clamp(120px,14vw,210px);width:auto;filter:drop-shadow(0 16px 22px rgba(0,0,0,.4))}
@media(max-width:600px){.summit{grid-template-columns:1fr}.summit img{order:-1;height:110px}}


/* 中文页:CJK 不压行距、不收字距 */
html[lang="zh-Hans"] .hero h1{font-size:clamp(46px,10.5vw,160px);line-height:1.02;letter-spacing:-.01em}
html[lang="zh-Hans"] .chapter h2,html[lang="zh-Hans"] .parent h2,html[lang="zh-Hans"] .plans h2{line-height:1.05;letter-spacing:-.01em}
html[lang="zh-Hans"] .tri h2{line-height:1.1;letter-spacing:0}
html[lang="zh-Hans"] .summit .big{line-height:1.15;letter-spacing:-.01em}
html[lang="zh-Hans"] .feat h3{line-height:1.25;letter-spacing:0}

/* 2026-10-07:.tri / .parent 原来用 padding 简写,把 .gx 的左右边距清零了(手机上正文贴边、宽屏上贴到 1440 版心边),改成只设上下。
   周日页样张搬去了 /family/,关于页的「给家长」只剩文字,收成一栏 */
.parent.solo{grid-template-columns:minmax(0,880px)}

/* 家长页 /family/(2026-10-07 第三期「两扇门」,与关于页同一套版式) */
.ticks{list-style:none;padding:0;display:flex;flex-direction:column;border-top:1px solid var(--hair)}
.ticks li{padding:14px 0;border-bottom:1px solid var(--hair2);color:var(--ink4);line-height:1.55;font-size:16.5px}
.ticks li strong{color:var(--ink);font-weight:600}
.plans-more{margin-top:28px;font-size:16px;color:var(--ink4)}
.aside{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(24px,4vw,56px);padding-top:clamp(56px,7vw,96px);padding-bottom:clamp(48px,6vw,80px);border-bottom:1px solid var(--hair)}
.aside>div{display:flex;flex-direction:column;gap:14px}
.aside h2{font-weight:800;font-size:clamp(28px,3vw,40px);line-height:1;letter-spacing:-.035em}
.aside p{line-height:1.6;color:var(--ink4);text-wrap:pretty}
.summit .fine-note{margin-top:22px;max-width:620px;font:13px/1.6 var(--mono);color:var(--ink3)}
/* 2026-10-07 考试道一节(3,200 m)的商标 / 原创小字 */
.parent .fine-note{font:13px/1.6 var(--mono);color:var(--ink3);max-width:760px}
html[lang="zh-Hans"] .aside h2{line-height:1.15;letter-spacing:-.01em}
.band.crop{aspect-ratio:1536/560}
.band.crop img{height:100%;object-fit:cover;object-position:50% 64%}
@media(max-width:600px){.band.crop{aspect-ratio:4/3}}

/* 家长页「为什么」(2026-10-07 第二批,取自纪录短片《一年两次》):成绩单小样 → 一年两次的出处 → 委员会原话 → 四条线一稳一卡 → 不是老师的错;右侧两分钟短片 */
.why{padding-top:clamp(64px,8vw,112px);padding-bottom:clamp(48px,6vw,80px);border-bottom:1px solid var(--hair)}
.why-head{display:flex;flex-direction:column;gap:14px;max-width:760px;margin-bottom:clamp(20px,3vw,36px)}
.why-head h2 .nb{white-space:nowrap}
.why-head h2{font-weight:800;font-size:clamp(40px,6vw,88px);line-height:.9;letter-spacing:-.045em}
.why-head p{font-size:18px;line-height:1.5;color:var(--ink4)}
.why-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,340px);gap:clamp(28px,5vw,80px);align-items:start}
.why-beats{display:flex;flex-direction:column}
.beat{display:flex;flex-direction:column;gap:12px;padding:30px 0;border-top:1px solid var(--hair)}
.beat h3{font:700 clamp(24px,2.6vw,34px)/1.05 var(--disp);letter-spacing:-.03em}
.beat p{color:var(--ink4);line-height:1.6;max-width:640px;text-wrap:pretty}
.beat blockquote{margin:0;padding:14px 18px;border-left:3px solid var(--lamp);background:var(--night2);max-width:680px}
.beat blockquote p{color:var(--ink);font-size:17px;line-height:1.5}
.beat blockquote.big p{font:600 clamp(19px,1.9vw,24px)/1.4 var(--disp);letter-spacing:-.01em}
.beat cite{display:block;margin-top:8px;font:500 11.5px/1.55 var(--mono);letter-spacing:.03em;font-style:normal;color:var(--ink3)}
.report{background:var(--paper);color:var(--paperdeep);border-radius:6px;padding:16px 18px 14px;max-width:440px;transform:rotate(-1.2deg);box-shadow:0 18px 40px rgba(0,0,0,.45);margin:0 0 14px 4px}
.report .rp-h{display:flex;justify-content:space-between;gap:12px;font:600 11px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--paperink);border-bottom:1px solid var(--paperline);padding-bottom:8px;margin-bottom:6px}
.report .rp-row{display:grid;grid-template-columns:118px 1fr;gap:10px;padding:7px 6px;font-size:15px;line-height:1.35}
.report .rp-row b{font-weight:600}
.report .rp-row span{font-style:italic;color:var(--paperink)}
.report .rp-row.hot{background:rgba(194,65,12,.12);box-shadow:inset 3px 0 0 #c2410c}
.report .rp-c{margin-top:8px;font-size:13px;font-style:italic;color:var(--paperink)}
.strands4{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-width:440px}
.strands4 div{border:1px solid var(--hair);padding:10px 12px;display:flex;flex-direction:column;gap:2px;background:var(--night2)}
.strands4 b{font-weight:600}
.strands4 span{font:500 12px var(--mono);color:var(--ink3);text-transform:uppercase;letter-spacing:.08em}
.strands4 .ok span{color:var(--aur)}
.strands4 .stuck{border-color:#c2410c}
.strands4 .stuck span{color:var(--bad)}
.why-film{position:sticky;top:24px;padding-top:30px}
.why-film figure{display:flex;flex-direction:column;gap:10px}
.why-film video{display:block;width:100%;height:auto;aspect-ratio:9/16;background:#141210;border:1px solid var(--hair)}
.why-film figcaption{font:12.5px/1.6 var(--mono);color:var(--ink3)}
.why-film figcaption b{color:var(--ink);font-weight:600}
@media (max-width:860px){.why-grid{grid-template-columns:minmax(0,1fr)}.why-film{position:static;max-width:300px;padding-top:8px}}
html[lang="zh-Hans"] .why-head h2{line-height:1.05;letter-spacing:-.01em}
html[lang="zh-Hans"] .beat h3{line-height:1.2;letter-spacing:0}

/* 首页(2026-10-07 第三批):首屏两扇门、产品图、FAQ、周日页下的 CTA */
.doors{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px;align-self:start}
.door{display:flex;flex-direction:column;gap:6px;padding:18px 20px 16px;background:var(--lamp);color:var(--lampink);text-decoration:none;border:1px solid transparent}
.door .mono{color:inherit;opacity:.75}
.door b{font:700 clamp(20px,1.8vw,24px)/1.1 var(--disp);letter-spacing:-.02em}
.door span:last-child{font-size:13.5px;line-height:1.45;opacity:.85}
.door:hover{text-decoration:none;filter:brightness(1.06)}
.door.quiet{background:var(--night2);color:var(--ink);border-color:var(--hair)}
.door.quiet .mono{color:var(--ink3);opacity:1}
.door.quiet span:last-child{color:var(--ink4);opacity:1}
.door.quiet:hover{border-color:var(--line3);filter:none}
.door:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
@media(min-width:1024px){.hero-grid:has(.doors){grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}.hero-grid:has(.doors) .lead{grid-column:auto}}
.plate-wide{margin-top:clamp(32px,4vw,56px);border:1px solid var(--hair);background:var(--plate);overflow:hidden}
.plate-wide img{display:block;width:100%;height:auto}
.plate-wide figcaption{padding:12px 16px 14px;font:12.5px/1.6 var(--mono);color:var(--ink3);border-top:1px solid var(--hair)}
.plate-wide figcaption b{color:var(--ink);font-weight:600}
.faq{grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:0 clamp(24px,4vw,64px)}
.faq div{grid-template-columns:1fr;gap:6px;padding:18px 0;align-content:start}
.faq dt{font:600 19px/1.3 var(--disp);letter-spacing:-.015em}
.faq dd{font-size:15.5px;line-height:1.55;max-width:560px}
.cta-row{display:flex;flex-direction:column;gap:10px;align-items:flex-start;margin-top:6px}
/* 中文大标题:按词组成段(span.nb),只在词组之间换行,不把「学到」这类词拆成两行(2026-10-07) */
.hero h1 .nb{display:inline-block}
html[lang="zh-Hans"] .hero h1.long{font-size:clamp(40px,8.2vw,124px)}   /* 长一点的中文标题(/family/zh/):桌面收成两行 */