/* 关于页（Morning Glory 阿斯特赖亚科技与 MolAstria）：只用 shared-nav.css 的变量。 */
.about{max-width:860px}
.mg-hero{text-align:center;padding:12px 0 18px}
.mg-mark{width:64px;height:64px;color:var(--gold);margin-bottom:10px}
.mg-hero h1{font-family:var(--font-num);font-weight:400;font-size:clamp(28px,4.4vw,46px);letter-spacing:-.5px;margin:0 0 4px}
.mg-slogan-zh{font-family:var(--font-serif);font-size:19px;color:var(--accent-2);margin:0 0 14px}
.mg-sub{font-family:var(--font-num);font-style:italic;font-size:16px;color:var(--ink-2);margin:0}
.mg-sub-zh{font-size:13px;color:var(--muted);margin:2px 0 0}
.lead-left{font-size:16px!important;color:var(--ink)!important;border-left:3px solid var(--gold);padding-left:12px;margin:18px 0}
.mg-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px 18px;margin:8px 0 0}
.mg-facts div{border-bottom:1px solid var(--line);padding:6px 0}
.mg-facts dt{font-size:12px;color:var(--muted)}
.mg-facts dd{margin:0;font-size:14.5px;color:var(--ink)}
.mg-tree{display:flex;flex-direction:column;align-items:center;margin:14px 0 6px}
.mg-node{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 14px;text-align:center;display:flex;flex-direction:column;gap:2px;min-width:0}
.mg-node b{font-size:14.5px;color:var(--ink);letter-spacing:.3px}
.mg-node span{font-size:12.5px;color:var(--muted)}
.mg-entity{border-style:dashed}
.mg-brand{border:2px solid var(--gold);background:var(--gold-soft);padding:12px 26px}
.mg-brand b{letter-spacing:2px}
.mg-live{border:2px solid var(--accent-2)}
.mg-stem{width:2px;height:18px;background:var(--line-strong)}
.mg-branches{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;width:100%;position:relative;padding-top:16px}
.mg-branches::before{content:"";position:absolute;top:0;left:12.5%;right:12.5%;border-top:2px solid var(--line-strong)}
.mg-branches .mg-node{position:relative}
.mg-branches .mg-node::before{content:"";position:absolute;top:-17px;left:50%;width:2px;height:16px;background:var(--line-strong)}
.mg-tag{align-self:center;font-style:normal;font-size:11px;font-weight:700;border-radius:99px;padding:1px 8px;margin-top:4px}
.mg-tag.live{background:color-mix(in srgb,var(--ok) 16%,transparent);color:var(--ok)}
.mg-tag.plan{background:var(--surface-2);color:var(--muted);box-shadow:inset 0 0 0 1px var(--line-strong)}
.mg-note{font-size:13px!important;color:var(--muted)!important}
.mg-dirs{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:10px}
.mg-dir{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.mg-dir h3{margin:0;font-size:16px;display:flex;gap:8px;align-items:baseline}
.mg-dir h3 span{font:400 15px var(--font-num);color:var(--gold-ink)}
.mg-dir p{margin:6px 0 0;font-size:13.5px!important;line-height:1.75!important}
.mg-dir .mg-en{margin:0;font-size:12px!important;color:var(--muted)!important;letter-spacing:.3px}
.mg-now{border-top:1px solid var(--line);padding-top:6px}
.mg-list{margin:4px 0 0;padding-left:18px}
.mg-list li{font-size:13.5px!important;line-height:1.7!important}
.mg-plan{color:var(--muted)!important}
.about .mg-stages{list-style:none;padding:0;counter-reset:st;display:grid;gap:8px}
.mg-stages li{counter-increment:st;display:grid;grid-template-columns:34px 1fr;column-gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 14px}
.mg-stages li::before{content:counter(st);grid-row:span 3;font:400 24px/1 var(--font-num);color:var(--gold);align-self:center;text-align:center}
.mg-stages b{font-size:14.5px;color:var(--ink)}
.mg-stages span{font-size:13.5px;color:var(--ink-2)}
.mg-stages span+span{color:var(--muted);font-size:12.5px}
@media (max-width:640px){
  .mg-branches{grid-template-columns:1fr 1fr}
  .mg-branches::before,.mg-branches .mg-node::before{display:none}
  .mg-dirs{grid-template-columns:1fr}
}
html[lang=en] .mg-dir .mg-en{display:none}

/* MolAstria 品牌故事（#story，story.js 按语言画）：星图与分子的连线、罗马数字章节、逐级深入的台阶、引文与结语。 */
.story{position:relative;margin:30px 0 34px;padding:30px clamp(18px,4vw,44px) 34px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(180deg,var(--gold-soft),transparent 380px),var(--surface);text-align:center}
.story-mark{width:min(220px,70%);height:auto;color:var(--gold);margin:0 auto 8px;display:block}
.story .eyebrow{margin:0 0 8px;letter-spacing:2.4px}
.story h2{font-family:var(--font-serif);font-weight:600;font-size:clamp(22px,3.4vw,30px);line-height:1.45;margin:0;border:0;padding:0;text-wrap:balance}
html[lang=en] .story h2,html[lang=en] .story-ch h3{font-family:var(--font-num)}
.story-en{font-family:var(--font-num);font-style:italic;color:var(--muted);font-size:14px!important;letter-spacing:.2px}
.story-ch{text-align:left;max-width:640px;margin:32px auto 0;padding-top:26px;border-top:1px solid var(--line)}
.story-ch h3{display:flex;align-items:baseline;gap:12px;margin:0;font-family:var(--font-serif);font-size:19px;font-weight:600;color:var(--ink)}
.story-num{font:400 22px/1 var(--font-num);color:var(--gold);min-width:28px}
.story-ch>.story-en{margin:2px 0 0 40px!important}
.story-ch>h3+p:not(.story-en),.story-ch>.story-en+*{margin-top:14px!important}
.story-ch p{font-size:15px!important;line-height:1.95!important;color:var(--ink-2);margin:0 0 10px}
html[lang=en] .story-ch p{line-height:1.8!important}
.story-ch strong{color:var(--ink);font-weight:600}
.story-ch em{font-family:var(--font-num);font-style:italic}
.story-key{margin:16px 0!important;padding:2px 0 2px 14px;border-left:2px solid var(--gold);font-family:var(--font-serif);font-size:16px!important;color:var(--ink)!important}
html[lang=en] .story-key{font-family:var(--font-num);font-style:italic;font-size:16.5px!important}
.story-why{text-align:center;margin:14px 0 18px!important;font:400 26px/1.4 var(--font-serif)!important;letter-spacing:1px;color:var(--gold)!important}
.story-why strong{color:inherit;font-weight:600}
/* 一层层往下：每一级多缩进一点，左边一条金色的线把台阶连起来。 */
.story-ladder{list-style:none;margin:16px 0 18px;padding:0;counter-reset:lad}
.story-ladder li{counter-increment:lad;position:relative;margin:0 0 4px calc(var(--i,0) * 18px);padding:6px 0 8px 30px;border-left:1px solid color-mix(in srgb,var(--gold) 55%,transparent);font-size:14.5px;line-height:1.85;color:var(--ink-2)}
.story-ladder li::before{content:counter(lad);position:absolute;left:-11px;top:8px;width:21px;height:21px;border-radius:50%;background:var(--surface);box-shadow:inset 0 0 0 1px var(--gold);font:400 12px/21px var(--font-num);color:var(--gold);text-align:center}
.story-ladder li:nth-child(2){--i:1}.story-ladder li:nth-child(3){--i:2}.story-ladder li:nth-child(4){--i:3}.story-ladder li:nth-child(5){--i:4}
.story-questions{list-style:none;padding:0;margin:12px 0 16px;display:grid;gap:8px}
.story-questions li{position:relative;padding:8px 14px 8px 34px;background:var(--surface-2);border-radius:10px;font-family:var(--font-serif);font-size:15px;line-height:1.7;color:var(--ink)}
html[lang=en] .story-questions li{font-family:var(--font-num);font-style:italic}
.story-questions li::before{content:"?";position:absolute;left:13px;top:7px;font:italic 400 17px var(--font-num);color:var(--gold)}
.story-stanza{list-style:none;margin:22px 0 4px;padding:18px 0 0;border-top:1px dashed var(--line-strong);text-align:center;display:grid;gap:4px}
.story-stanza li{font-family:var(--font-serif);font-size:16px;line-height:1.9;color:var(--ink)}
html[lang=en] .story-stanza li{font-family:var(--font-num);font-style:italic}
.story-stanza li:last-child{margin-top:6px;color:var(--gold)}
.story-quote{margin:20px 0 6px;padding:16px 20px;border-left:3px solid var(--gold);background:var(--gold-soft);border-radius:0 10px 10px 0}
.story-quote p{margin:0!important;font-family:var(--font-num);font-style:italic;font-size:17px!important;line-height:1.6!important;color:var(--ink)}
.story-quote p.story-zh{font-family:var(--font-serif);font-style:normal;font-size:14.5px!important;color:var(--ink-2);margin-top:6px!important}
.story-quote p.story-cite{font-family:var(--font-sans);font-style:normal;font-size:12px!important;color:var(--muted);letter-spacing:.3px;margin-top:8px!important}
.story-coda{margin:38px auto 0;padding-top:30px;border-top:1px solid var(--line);max-width:640px}
.story-coda p{margin:0}
.story-coda-name{font:400 13px var(--font-num);letter-spacing:4px;text-transform:uppercase;color:var(--gold);margin-bottom:10px!important}
.story-coda-en{font-family:var(--font-num);font-size:clamp(18px,2.6vw,23px)!important;line-height:1.5!important;color:var(--ink);font-weight:600;text-wrap:balance}
.story-coda .story-zh{font-family:var(--font-serif);font-size:15px!important;color:var(--accent-2);margin-top:6px!important}
.story-rule{display:block;width:56px;height:1px;margin:20px auto;background:var(--gold)}
.story-coda-line{font-family:var(--font-num);font-style:italic;font-size:16px!important;line-height:1.6!important;color:var(--ink-2);text-wrap:balance}
@media (max-width:640px){
  .story-ch>.story-en{margin-left:0!important}
  .story-ladder li{margin-left:calc(var(--i,0) * 8px)}
}
