/* =====================================================================
   v2 · 参考 apollo.com/jp 的克制风格（2026-09-29）
   叠加在 site.css 之后，只改外观不改结构。原则：
   - 暖白纸底 + 墨黑文字，几乎只有两色；色块只用极淡的米、雾蓝、灰绿
   - 首屏保留东京塔视频；其余深色大块全部改成浅色
   - 标题更大更细，左标题右正文；按钮改为「⊙ 箭头 + 文字」的细链接
   ===================================================================== */
:root{
  --paper:#FAF6F1; --stone:#EDE8E2; --mist:#E3EAF1; --sage:#D6E6E1; --sage2:#A9CFC6;
  --ink:#1C1B19; --muted:#5F5A54; --line:#D8D1C8;
  --navy:#1C1B19; --navy-2:#1C1B19;           /* 原来的深蓝一律换成墨色（只用于文字、细节） */
  --gold:#1C1B19; --gold-lt:#FAF6F1;          /* 金色退场：强调改用墨色 */
  --on-dark:#FFFFFF;
}
body{background:var(--paper);color:var(--ink)}
::selection{background:var(--sage)}

/* ---------- 字体：更细、更大 ---------- */
h1,h2,h3{font-weight:400;letter-spacing:-.01em}
h2{font-size:clamp(2.1rem,3.6vw,3.2rem);line-height:1.12}
html[lang="zh"] h1,html[lang="ja"] h1,html[lang="zh"] h2,html[lang="ja"] h2,html[lang="zh"] h3,html[lang="ja"] h3{font-weight:500}
.eyebrow{color:var(--muted);letter-spacing:.18em}
.eyebrow.rule::after{background:var(--line);opacity:1}
p,.lede{color:var(--muted)}
h1 em{color:inherit;font-style:italic}
html[lang="zh"] h1 em,html[lang="ja"] h1 em{color:inherit}

/* ---------- 按钮 → Apollo 式箭头链接 ---------- */
.btn,.btn.gold,.btn.line,.btn.navy,.btn.line.dark{
  background:transparent!important;border:0!important;color:inherit!important;
  padding:.4em 0!important;letter-spacing:.06em;text-transform:none;font-size:.95rem;font-weight:500;gap:.7em;border-radius:0}
.btn::before{content:"";width:26px;height:26px;border-radius:50%;flex:none;
  background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 12h10M13 8l4 4-4 4' fill='none' stroke='%23fff' stroke-width='1.6'/%3E%3C/svg%3E") center/16px no-repeat;
  transition:transform .3s}
.btn:hover::before{transform:translateX(4px)}
.btn:hover{background:transparent!important;color:inherit!important}
.hero .btn::before,.phero .btn::before,.band .btn::before{background-color:#fff;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 12h10M13 8l4 4-4 4' fill='none' stroke='%231C1B19' stroke-width='1.6'/%3E%3C/svg%3E")}
.btn.small{font-size:.85rem}
.more{color:var(--ink)!important;letter-spacing:.04em;text-transform:none;font-size:.9rem;font-weight:500}
.more::after{display:none}
.more::before{content:"";width:22px;height:22px;border-radius:50%;margin-right:.2em;
  background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 12h10M13 8l4 4-4 4' fill='none' stroke='%23fff' stroke-width='1.6'/%3E%3C/svg%3E") center/14px no-repeat}

/* ---------- 顶栏：视频上透明，滚动后变纸色 ---------- */
.brand .mark{border-color:currentColor}.brand .mark::after{background:currentColor}
.brand .word small{color:inherit;opacity:.75}
.top.solid,.top.open{background:rgba(250,246,241,.96);color:var(--ink);box-shadow:0 1px 0 var(--line)}
.drawer{background:var(--paper);color:var(--ink);border-top-color:var(--line)}
.drawer a{border-bottom-color:var(--line)}
.drawer .dlangs a{border-color:var(--line)}
.drawer .dlangs a[aria-current]{background:var(--ink);border-color:var(--ink);color:#fff}
.nav .links a::after{background:currentColor}
.langs a[aria-current]{border-color:currentColor}
.top .appt::before{background-color:#fff}
.top.solid .appt::before,.top.open .appt::before{background-color:var(--ink);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 12h10M13 8l4 4-4 4' fill='none' stroke='%23fff' stroke-width='1.6'/%3E%3C/svg%3E")}

/* ---------- 首屏：保留视频，去金色 ---------- */
.hero{background:#111}
.agent2 .frame::before{border-color:rgba(255,255,255,.5)}
.agent2 span,.agent2 .cred{color:rgba(255,255,255,.85)!important}
.agent2 .cap{border-color:rgba(255,255,255,.3)!important}
.hero .agent2{border-top-color:rgba(255,255,255,.25)!important}

/* ---------- 数字：Apollo 式浅色方块 ---------- */
.stats{background:var(--paper);color:var(--ink);border:0;padding-block:72px}
.stats .row{gap:14px}
.stat{background:var(--sage);padding:28px 24px!important;border:0!important;min-height:150px;display:flex;flex-direction:column;justify-content:flex-end}
.stat:nth-child(2){background:var(--sage2)}
.stat:nth-child(3){background:var(--mist)}
.stat:nth-child(4){background:var(--stone)}
.stat .n{color:var(--ink)!important}
.stat .l{color:var(--muted)}
@media (max-width:820px){.stats .row{row-gap:14px}}

/* ---------- 深色区块全部改浅 ---------- */
.case,.smart,.invest,.contact,.process{background:var(--paper)!important;color:var(--ink)}
.case>img,.invest>video{display:none}
.case::before,.invest::before{display:none}
.case .eyebrow,.smart .eyebrow,.invest .eyebrow,.process .eyebrow,.contact .eyebrow{color:var(--muted)!important}
.case .big,.sfact .n{color:var(--ink)}
.case .sum,.smart .head p,.invest .box p,.contact p,.step p{color:var(--muted)}
.case li,.case li:last-child{border-color:var(--line)}
.case li b{color:var(--muted)}
.case .more,.band .more,.invest .more{color:var(--ink)!important}
.smart{border-top:1px solid var(--line)}
.sgrid{border-top-color:var(--ink);gap:14px}
.sfact,.sfact+.sfact{border:0!important;background:var(--mist);padding:28px 24px!important}
.sfact:nth-child(2){background:var(--sage)}
.sfact:nth-child(3){background:var(--stone)}
.sfact .l{color:var(--muted)}
.smart .note,.smart .note a{color:var(--muted)}
.invest{padding-block:104px}
.invest .box{background:var(--stone);border:0;backdrop-filter:none}
.invest li{border-color:var(--line)}
.process .steps{border-top-color:var(--ink)}
.step::before{background:var(--ink)}
.step .n{color:var(--muted)}
.contact{background:var(--stone)!important}
.reach .item,.reach .item:last-of-type{border-color:var(--line)!important}
.reach .lab{color:var(--muted)!important}
.reach .val:hover{color:var(--muted)}
.reach button{color:var(--muted)!important;border-color:var(--line)!important}

/* 一个保留的照片横幅：3,700 万（Apollo 的「グローバル拠点」同类） */
.band::before{background:linear-gradient(90deg,rgba(10,10,10,.55),rgba(10,10,10,.15))}
.band .big{color:#fff}

/* ---------- 其余区块 ---------- */
.help article{border-top-color:var(--ink)}
.help .k{color:var(--muted)}
.yen{background:var(--mist)}
.fx .fill{background:var(--ink)}
.fx .fill.now{background:var(--sage2);color:var(--ink)}
.area span{color:rgba(255,255,255,.85)}
.cv dt{color:var(--muted)}
.cv dd a.ext,.career strong a.ext,.legal a.ext{border-bottom-color:var(--ink)}
.cv dd a.ext::after,.career strong a.ext::after,.legal a.ext::after{color:inherit}
.cv dd a.ext:hover{color:var(--muted)}

/* 内页首屏：照片更亮、文字仍白 */
.phero::before{background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.1) 40%,rgba(0,0,0,.6))}
.phero .eyebrow{color:rgba(255,255,255,.85)}
.phero.plain{background:var(--stone);color:var(--ink)}
.phero.plain::before{display:none}
.phero.plain .eyebrow{color:var(--muted)}
.subnav a:hover{color:var(--ink)}
.svc.alt{background:var(--stone)}
.svc .num{color:var(--muted)}
.ticks li::before{background:var(--ink)}
.card .n,.hood .n,.hood .kind{color:var(--muted)}
.hood.flip .copy{background:var(--stone)}
.cta{background:var(--mist)}
.facts{border-top-color:var(--ink)}
.fact dt{color:var(--muted)}
.prose a{color:var(--ink);text-decoration:underline}
.fld span,.choice legend{color:var(--muted)}
.fld input:focus,.fld textarea:focus{border-bottom-color:var(--ink)}
.choice input{accent-color:var(--ink)}
.choice.pills input:checked+span{background:var(--ink);border-color:var(--ink)}
.maplink{color:var(--ink)}

/* ---------- 页脚：Apollo 式深暖灰 ---------- */
.foot{background:#45413D;color:rgba(255,255,255,.72);border-top:0}
.fgrid h4{color:rgba(255,255,255,.9)}
.fgrid a:hover{color:#fff}
.fbrand .brand,.foot .brand{color:#fff}
.foot .maplink{color:rgba(255,255,255,.85)}
.foot .btn::before{background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 12h10M13 8l4 4-4 4' fill='none' stroke='%2345413D' stroke-width='1.6'/%3E%3C/svg%3E")}
.legal{border-top-color:rgba(255,255,255,.15)}

/* ---------- 浮动元素 ---------- */
.mcta{background:rgba(250,246,241,.96);color:var(--ink);border-color:var(--line)}
.mcta .mark{border-color:var(--ink)}.mcta .mark::after{background:var(--ink)}
.totop{background:rgba(250,246,241,.95);color:var(--ink);border-color:var(--line)}
.totop:hover{background:var(--ink);color:#fff}
.skip{background:var(--ink)}
a:focus-visible,button:focus-visible{outline-color:var(--ink)}
/* 照片上的文字保持白色（上面的 p{color:muted} 不能作用到这里） */
.hero p,.hero .lede,.phero p,.phero .lede,.band p,.area span,.area h3{color:rgba(255,255,255,.88)}
.phero h1,.hero h1,.band .big{color:#fff}
.foot p,.foot .legal,.foot .legal p{color:rgba(255,255,255,.62)}
.foot .legal a{color:rgba(255,255,255,.8)}

/* ================= v2.1 · Apollo 首页结构 ================= */
/* 首屏：静态大图，品牌居中，大标题左下 */
.hero{min-height:min(820px,92svh)}
.hero>img.bg{object-position:50% 40%}
.hero::before{background:linear-gradient(180deg,rgba(0,0,0,.28) 0%,rgba(0,0,0,0) 22%,rgba(0,0,0,0) 55%,rgba(0,0,0,.45) 100%)}
.hero .wrap{grid-template-columns:1fr;padding-block:0 64px}
.hero h1{font-size:clamp(3rem,7vw,6.2rem);line-height:1.04;font-weight:400;max-width:12em}
html[lang="zh"] .hero h1,html[lang="ja"] .hero h1{font-size:clamp(2.6rem,6vw,5.4rem);line-height:1.18;font-weight:500}
.hero .eyebrow{display:none}
.hero .lede{font-size:.95rem;max-width:30em;margin-top:18px}
.hero .ctas{margin-top:26px}
.cue{display:none}
@media (min-width:981px){
  .top .bar{display:grid;grid-template-columns:1fr auto 1fr;height:84px}
  .top .brand{grid-column:2;justify-self:center}
  .top .nav{grid-column:3;justify-self:end}
  .top .bar>.nav .links{display:none}
  .top .burger{display:block}
  .drawer{display:none}
  .top.open .drawer{display:block!important}
}
@media (min-width:981px) and (max-width:1320px){.drawer{display:none}}

/* 介绍：左大字宣言，右正文 + Kylin */
.intro{padding-block:96px 72px;border-top:1px solid var(--line)}
.intro .grid{display:grid;grid-template-columns:1.05fr 1fr;gap:72px;align-items:start}
.intro .statement{font-size:clamp(1.9rem,3.2vw,2.8rem);line-height:1.22}
html[lang="zh"] .intro .statement,html[lang="ja"] .intro .statement{line-height:1.45}
.intro .side>p{font-size:.95rem;line-height:1.9}
.intro a.agent2{display:grid;grid-template-columns:120px 1fr;gap:22px;align-items:end;max-width:none;margin:34px 0 8px;padding-top:28px;border-top:1px solid var(--line)}
.intro a.agent2 .frame::before{display:none}
.intro a.agent2 img{box-shadow:none}
.intro a.agent2 .cap{margin-top:0}
.intro a.agent2 strong{color:var(--ink);font-size:1.35rem}
.intro .agent2 span,.intro .agent2 .cred,.intro .agent2 .langs3{color:var(--muted)!important}
.intro .agent2 .cred{border-color:var(--line)!important}
@media (max-width:860px){.intro{padding-block:64px 48px}.intro .grid{grid-template-columns:1fr;gap:28px}.intro a.agent2{grid-template-columns:88px 1fr}}
.p-index .about{display:none}   /* 关于已并入上面的介绍 */
@media (max-width:700px){
  .hero{min-height:88svh}
  .p-index .hero .wrap{padding-block:0 40px}
  .p-index .hero h1{font-size:2.4rem}
  html[lang="zh"] .p-index .hero h1,html[lang="ja"] .p-index .hero h1{font-size:2.1rem}
}
.top .appt::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 12h10M13 8l4 4-4 4' fill='none' stroke='%231C1B19' stroke-width='1.6'/%3E%3C/svg%3E")}
/* 蚕茧大厦仰拍（Unsplash 免费）：电脑 v21 横图，手机 v7 竖图 */
.hero picture{position:absolute;inset:0}
.hero picture img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 35%}
@media (max-width:700px) and (orientation:portrait){.hero picture img.bg{object-position:50% 30%}}
.p-index .hero::before{background:linear-gradient(180deg,rgba(0,0,0,.25) 0%,rgba(0,0,0,0) 20%,rgba(0,0,0,.05) 45%,rgba(0,0,0,.55) 100%),linear-gradient(90deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,0) 60%)}
/* 业主购买的正版图（japan-header-day-2k-4）：蓝天为主，高楼四角收拢 */
.hero picture img.bg{object-position:50% 50%}
.p-index .hero::before{background:linear-gradient(180deg,rgba(0,0,0,.2) 0%,rgba(0,0,0,0) 20%,rgba(0,0,0,0) 50%,rgba(0,0,0,.35) 100%),linear-gradient(90deg,rgba(0,0,0,.3) 0%,rgba(0,0,0,0) 55%)}
/* 首屏铺满整个屏幕（业主：满屏才震撼） */
.p-index .hero{min-height:100vh;min-height:100svh}
@media (max-width:700px){.p-index .hero{min-height:100svh}}

/* ================= v2.2 · 为什么投资东京 + 办公室 + 照片框对齐 ================= */
/* 照片框：不再错开，框均匀包住照片（纽约朋友：「照片不在框里」） */
.agent2 .frame{padding:10px;border:1px solid rgba(255,255,255,.55)}
.agent2 .frame::before{display:none!important}
.phero .agent2 .frame{border-color:rgba(255,255,255,.55)}
.intro a.agent2 .frame{padding:6px;border-color:var(--line)}
.about .portrait .ph{padding:10px;border:1px solid var(--line);background:none}

/* 为什么投资东京：五条，横排 */
.whytokyo{border-top:1px solid var(--line);padding-block:88px}
.wlist{list-style:none;margin:0 0 36px;padding:0;display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--ink)}
.witem{padding:26px 22px 0 0;display:flex;flex-direction:column;gap:10px}
.witem+.witem{padding-left:22px;border-left:1px solid var(--line)}
.wn{font-family:var(--display);font-size:1rem;color:var(--muted)}
.wk{font-size:.7rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
html[lang="zh"] .wk,html[lang="ja"] .wk{letter-spacing:.08em;font-size:.8rem}
.witem h3{font-size:1.35rem;line-height:1.3}
.witem p{font-size:.9rem}
@media (max-width:1100px){.wlist{grid-template-columns:repeat(2,1fr);row-gap:28px}.witem+.witem{border-left:0;padding-left:0}.witem:nth-child(even){padding-left:22px;border-left:1px solid var(--line)}}
@media (max-width:600px){.wlist{grid-template-columns:1fr}.witem,.witem:nth-child(even){padding:20px 0 0;border-left:0;border-top:1px solid var(--line)}.witem:first-child{border-top:0}}

/* 办公室：左文字，右照片拼图 */
.office{background:var(--stone);padding-block:96px}
.office .grid{display:grid;grid-template-columns:1fr 1.5fr;gap:64px;align-items:center}
.office .otext{display:flex;flex-direction:column;gap:18px}
.office .addr{font-size:.85rem;color:var(--muted)}
.ogrid{display:grid;grid-template-columns:1.3fr 1fr;grid-template-rows:1fr 1fr;gap:10px;aspect-ratio:1.45}
.ogrid figure{margin:0;overflow:hidden}
.ogrid img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s ease}
.ogrid figure:hover img{transform:scale(1.03)}
.ogrid .o1{grid-row:1/3}
.ogrid .o4{display:none}
@media (max-width:860px){.office{padding-block:64px}.office .grid{grid-template-columns:1fr;gap:28px}.ogrid{aspect-ratio:1.1}}
.p-contact .office{margin-top:0}
/* 首屏换回东京塔视频（业主女朋友 2026-09-29）：视频较亮处给标题加一点底 */
@media (max-width:700px){.p-index .hero::before{background:linear-gradient(180deg,rgba(0,0,0,.3) 0%,rgba(0,0,0,0) 25%,rgba(0,0,0,.15) 50%,rgba(0,0,0,.72) 100%)}}
/* 首页宣言：中日文按句分行，整句不拆 */
.statement .ln{display:block;white-space:nowrap}
html[lang="zh"] .intro .statement,html[lang="ja"] .intro .statement{font-size:clamp(1.2rem,2.15vw,2.1rem);line-height:1.55}
@media (max-width:860px){html[lang="zh"] .intro .statement,html[lang="ja"] .intro .statement{font-size:clamp(1.15rem,5.2vw,1.9rem)}}

/* v2.3 · 电脑首屏：标志左、菜单右，贴屏幕两边；标题靠左，给中间的东京塔让位（业主 09-29） */
@media (min-width:981px){
  .top .bar{max-width:none;padding-inline:clamp(28px,4vw,72px);display:flex;justify-content:space-between;grid-template-columns:none}
  .top .brand{grid-column:auto;justify-self:auto}
  .top .nav{grid-column:auto;justify-self:auto}
  .p-index .hero .wrap{max-width:none;padding-inline:clamp(28px,4vw,72px);padding-bottom:clamp(56px,9vh,110px)}
  .p-index .hero h1{max-width:min(44vw,10.5em)}
  html[lang="zh"] .p-index .hero h1,html[lang="ja"] .p-index .hero h1{font-size:clamp(2.6rem,4.4vw,5rem)}
  .p-index .hero .lede{max-width:min(36vw,30em)}
  .p-index .hero::before{background:linear-gradient(90deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.25) 38%,rgba(0,0,0,0) 60%),linear-gradient(180deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,0) 18%,rgba(0,0,0,0) 60%,rgba(0,0,0,.4) 100%)}
}
/* 顶栏与首屏文字往中间收（业主：太靠边）：统一放进最宽 1320px 的居中栏 */
@media (min-width:981px){
  .top .bar{max-width:1320px;margin-inline:auto;padding-inline:40px}
  .p-index .hero .wrap{max-width:1320px;margin-inline:auto;padding-inline:40px}
}

/* 为什么是东京页：手机上首屏已是高楼，紧跟的虎之门照片重复，隐藏 */
@media (max-width:860px){.yen-t .ph{display:none}}
