/* 沧澜资本 — 暮色城市 hero
   所有建筑用 background 渐变层层叠出，不引用任何图片 */

:root{
  --ink:#0a121c;
  --paper:#f4f0e8;
  --paper-dim:rgba(244,240,232,.66);
  --amber:#e8a24c;
  --amber-soft:rgba(232,162,76,.16);
  --line:rgba(244,240,232,.14);
  --sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",system-ui,-apple-system,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
h1,h2,h3,p{margin:0}
:focus-visible{
  outline:2px solid var(--amber);
  outline-offset:3px;
  border-radius:4px;
}

/* ── 导航 ────────────────────────── */
.nav{
  position:fixed;
  inset:0 0 auto 0;
  z-index:50;
  display:flex;
  align-items:center;
  gap:32px;
  padding:26px clamp(20px,4vw,56px);
  transition:background .35s ease,padding .35s ease,backdrop-filter .35s ease;
}
.nav.solid{padding:14px clamp(20px,4vw,56px)}
/* 毛玻璃放到伪元素上，避免 backdrop-filter 把文字一起吃掉 */
.nav.solid::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:rgba(10,18,28,.84);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.brand{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:15px;
  letter-spacing:.16em;
  font-weight:500;
}
.mark{
  width:18px;height:18px;
  border-radius:50%;
  background:conic-gradient(from 210deg,var(--amber),transparent 62%);
  border:1px solid rgba(232,162,76,.55);
}
.nav nav{margin-left:auto}
.nav ul{display:flex;gap:30px;list-style:none;margin:0;padding:0;font-size:14px}
.nav ul a{
  color:var(--paper-dim);
  padding-bottom:2px;
  border-bottom:1px solid transparent;
  transition:color .25s ease,border-color .25s ease;
}
.nav ul a:hover,.nav ul a.on{color:var(--paper);border-bottom-color:var(--amber)}
.cta{
  font-size:13px;
  letter-spacing:.06em;
  padding:9px 18px;
  border:1px solid rgba(244,240,232,.3);
  border-radius:100px;
  transition:background .25s ease,color .25s ease,border-color .25s ease;
}
.cta:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}

/* ── Hero ────────────────────────── */
.hero{
  position:relative;
  min-height:100svh;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:0 clamp(20px,4vw,56px) clamp(56px,9vh,120px);
}
.sky{
  position:absolute;inset:0;
  background:
    radial-gradient(88% 52% at 64% 76%,rgba(255,170,98,.5),rgba(255,122,72,.1) 48%,transparent 70%),
    linear-gradient(to bottom,#050a12 0%,#0a1523 28%,#182236 50%,#3d2c34 68%,#7b4636 86%,#ab6440 96%,#c0764a 100%);
}

.skyline{
  position:absolute;
  left:0;right:0;bottom:0;
  width:100%;
  height:54%;
  display:block;
  pointer-events:none;
}
.sk{will-change:transform}

/* 水面：压暗楼脚，模拟暮色湖面 */
.water{
  position:absolute;left:0;right:0;bottom:0;
  height:15%;
  background:
    repeating-linear-gradient(to bottom,rgba(255,196,140,.05) 0 1px,transparent 1px 8px),
    linear-gradient(to bottom,rgba(20,34,50,.3),rgba(7,13,21,.88) 78%);
  pointer-events:none;
}

/* 压住左下文案，同时保留楼缝里的余晖 */
.hero::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:82%;
  background:
    linear-gradient(to top,rgba(6,11,18,.9) 0%,rgba(6,11,18,.5) 26%,transparent 62%),
    radial-gradient(62% 56% at 12% 94%,rgba(6,11,18,.56),transparent 76%);
  pointer-events:none;
  z-index:1;
}

/* ── Hero 文案 ───────────────────── */
.copy{
  position:relative;
  z-index:2;
  max-width:min(920px,92%);
}
/* 文案区暗晕：压住身后的窗格点阵 */
.copy::before{
  content:"";
  position:absolute;
  inset:-10% -16% -14% -12%;
  background:radial-gradient(58% 58% at 24% 54%,rgba(6,11,18,.74),transparent 74%);
  z-index:-1;
  pointer-events:none;
}
.copy h1{
  font-size:clamp(2.4rem,5.2vw,4.85rem);
  line-height:1.06;
  font-weight:500;
  letter-spacing:-.025em;
  margin-bottom:.5em;
  text-wrap:balance;
}
.copy h1 .thin{
  font-weight:300;
  color:rgba(244,240,232,.58);
  margin:0 .12em;
}
.lede{
  max-width:36em;
  color:var(--paper-dim);
  font-size:clamp(.95rem,1.5vw,1.06rem);
  margin-bottom:2.1em;
}
.acts{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.btn{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:14px 26px;
  border-radius:100px;
  font-size:14.5px;
  letter-spacing:.03em;
  transition:transform .3s cubic-bezier(.2,.7,.3,1),background .25s ease,color .25s ease,border-color .25s ease;
}
.btn:hover{transform:translateY(-2px)}
.solid{background:var(--paper);color:#111a24;font-weight:500}
.solid:hover{background:#fff}
.ghost{border:1px solid rgba(244,240,232,.34);color:var(--paper)}
.ghost:hover{border-color:var(--paper);background:rgba(244,240,232,.08)}
.arw{display:inline-flex;transition:transform .3s ease}
.btn:hover .arw{transform:translateX(3px)}
.arw svg{width:12px;height:12px}

/* 右下浮动标语 */
.chip{
  position:absolute;
  right:clamp(20px,4vw,56px);
  bottom:calc(clamp(56px,9vh,120px) + 4px);
  z-index:3;
  display:flex;
  align-items:center;
  gap:0;
  padding:11px 20px;
  border-radius:100px;
  font-size:13px;
  letter-spacing:.1em;
  color:rgba(244,240,232,.9);
  background:rgba(12,22,34,.55);
  border:1px solid rgba(244,240,232,.16);
  backdrop-filter:blur(12px);
}
.chip i{
  display:block;
  width:3px;height:3px;
  border-radius:50%;
  background:var(--amber);
  margin:0 11px;
}

.scroll-hint{
  position:absolute;
  left:50%;bottom:26px;
  transform:translateX(-50%);
  width:1px;height:44px;
  background:linear-gradient(to bottom,transparent,rgba(244,240,232,.4));
  overflow:hidden;
}
.scroll-hint span{
  position:absolute;top:0;left:0;
  width:1px;height:16px;
  background:var(--amber);
  animation:drip 2.2s cubic-bezier(.6,0,.4,1) infinite;
}
@keyframes drip{
  0%{transform:translateY(-18px)}
  100%{transform:translateY(46px)}
}

/* ── 三件事 ──────────────────────── */
.band{
  position:relative;
  z-index:2;
  background:var(--ink);
  border-top:1px solid var(--line);
  padding:clamp(64px,10vh,120px) clamp(20px,4vw,56px);
}
.band-in{max-width:1180px;margin:0 auto}
.eyebrow{
  font-size:12.5px;
  letter-spacing:.26em;
  color:var(--amber);
  margin-bottom:44px;
}
.trio{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(24px,4vw,56px);
}
.trio article{border-top:1px solid var(--line);padding-top:22px}
.trio b{
  display:block;
  font-size:12px;
  letter-spacing:.16em;
  color:rgba(244,240,232,.4);
  font-weight:400;
  margin-bottom:14px;
}
.trio h2{
  font-size:1.32rem;
  font-weight:500;
  letter-spacing:-.01em;
  margin-bottom:.55em;
}
.trio p{color:var(--paper-dim);font-size:14.5px;line-height:1.85}

/* ── 引用 ────────────────────────── */
.quote{
  background:linear-gradient(to bottom,#0a121c,#0d1724);
  border-top:1px solid var(--line);
  padding:clamp(64px,11vh,130px) clamp(20px,4vw,56px);
}
.quote blockquote{max-width:900px;margin:0 auto;text-align:center}
.quote p{
  font-size:clamp(1.3rem,3vw,2.05rem);
  line-height:1.55;
  font-weight:400;
  color:rgba(244,240,232,.94);
  letter-spacing:-.01em;
  margin-bottom:1.4em;
}
.quote footer{
  font-size:13px;
  letter-spacing:.1em;
  color:rgba(244,240,232,.45);
}
.quote cite{font-style:normal;color:var(--amber)}

/* ── 页脚 ────────────────────────── */
.foot{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:16px 32px;
  padding:36px clamp(20px,4vw,56px);
  border-top:1px solid var(--line);
  background:var(--ink);
}
.fbrand{font-size:14px;letter-spacing:.16em;font-weight:500}
.fmeta{font-size:12.5px;color:rgba(244,240,232,.42);letter-spacing:.04em}
.fmeta:last-child{margin-left:auto}
.fmeta a:hover{color:var(--paper)}

/* ── 进场 ────────────────────────── */
.copy h1,.lede,.acts{animation:rise .95s cubic-bezier(.16,.8,.3,1) both}
.lede{animation-delay:.12s}
.acts{animation-delay:.22s}
.chip{animation:fadein 1.2s ease .5s both}
@keyframes rise{
  from{opacity:0;transform:translateY(26px)}
  to{opacity:1;transform:none}
}
@keyframes fadein{from{opacity:0}to{opacity:1}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
}

/* ── 响应式 ──────────────────────── */
@media (max-width:900px){
  .trio{grid-template-columns:1fr;gap:32px}
  .nav ul{display:none}
  .cta{margin-left:auto}
  .chip{position:static;margin-top:34px;display:inline-flex}
  .hero{padding-bottom:52px}
}
@media (max-width:560px){
  .copy h1{font-size:clamp(2.1rem,10vw,2.9rem)}
  .band{padding-block:56px}
  .foot{flex-direction:column;gap:8px}
  .fmeta:last-child{margin-left:0}
}

/* ══ 内页（组合 / 合伙人） ══════════ */
.page{padding-top:0}
.sheet{
  max-width:1080px;
  margin:0 auto;
  padding:clamp(120px,17vh,190px) clamp(20px,4vw,56px) clamp(70px,10vh,120px);
}
.sheet .eyebrow{margin-bottom:26px}
.ph{
  font-size:clamp(2.1rem,4.6vw,3.5rem);
  line-height:1.16;
  font-weight:500;
  letter-spacing:-.03em;
  margin-bottom:.6em;
}
.sheet .lede{max-width:52em;font-size:15.5px;line-height:1.9;margin-bottom:clamp(48px,7vh,86px)}

/* 组合列表 */
.rows{list-style:none;margin:0 0 clamp(40px,6vh,72px);padding:0;border-top:1px solid var(--line)}
.rows li{border-bottom:1px solid var(--line)}
.rows a{
  display:grid;
  grid-template-columns:1.5fr 1fr auto;
  align-items:baseline;
  gap:20px;
  padding:22px 10px;
  transition:background .3s ease,padding-left .3s ease;
}
.rows a:hover{background:rgba(232,162,76,.06);padding-left:20px}
.rows b{font-size:1.06rem;font-weight:500;letter-spacing:-.01em}
.rows span{font-size:13.5px;color:rgba(244,240,232,.5)}
.rows em{
  font-style:normal;
  font-size:12.5px;
  letter-spacing:.06em;
  color:var(--amber);
  opacity:.82;
}
.note{
  max-width:40em;
  font-size:13.5px;
  line-height:1.95;
  color:rgba(244,240,232,.42);
  padding-left:18px;
  border-left:2px solid var(--amber-soft);
}

/* 合伙人 */
.people{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(30px,5vw,56px) clamp(30px,5vw,64px);
  margin-bottom:clamp(60px,9vh,110px);
}
.face{
  aspect-ratio:1;
  border-radius:14px;
  margin-bottom:22px;
  border:1px solid var(--line);
  background-color:#101d2b;
}
.f1{
  background-image:
    radial-gradient(circle at 62% 38%,rgba(232,162,76,.62) 0 26%,transparent 27%),
    linear-gradient(118deg,transparent 46%,rgba(232,162,76,.24) 46% 54%,transparent 54%);
}
.f2{
  background-image:
    repeating-radial-gradient(circle at 50% 55%,transparent 0 22px,rgba(232,162,76,.16) 22px 23px);
}
.f3{
  background-image:
    repeating-linear-gradient(132deg,rgba(232,162,76,.11) 0 1.5px,transparent 1.5px 22px);
}
.f4{
  background-image:
    radial-gradient(circle at 50% 50%,rgba(232,162,76,.5) 0 3px,transparent 4px),
    repeating-linear-gradient(90deg,transparent 0 33px,rgba(244,240,232,.09) 33px 34px),
    repeating-linear-gradient(0deg,transparent 0 33px,rgba(244,240,232,.09) 33px 34px);
  background-size:66px 66px,auto,auto;
}
.people h2{font-size:1.24rem;font-weight:500;margin-bottom:.2em}
.role{
  font-size:12.5px;
  letter-spacing:.06em;
  color:var(--amber);
  margin-bottom:.9em;
}
.people article p:last-child{
  font-size:14px;
  line-height:1.9;
  color:rgba(244,240,232,.6);
}

/* 条款 */
.terms{margin-bottom:clamp(60px,9vh,110px)}
.sh{
  font-size:12.5px;
  letter-spacing:.26em;
  font-weight:400;
  color:var(--amber);
  margin-bottom:30px;
}
.terms dl{margin:0;border-top:1px solid var(--line)}
.terms dl > div{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:24px;
  padding:24px 0;
  border-bottom:1px solid var(--line);
}
.terms dt{font-size:14px;color:rgba(244,240,232,.92);font-weight:500}
.terms dd{margin:0;font-size:14.5px;line-height:1.9;color:rgba(244,240,232,.6)}

/* 联系 */
.contact{border-top:1px solid var(--line);padding-top:clamp(40px,6vh,64px)}
.contact p{
  max-width:38em;
  font-size:15px;
  line-height:1.95;
  color:rgba(244,240,232,.66);
  margin-bottom:32px;
}

@media (max-width:760px){
  .people{grid-template-columns:1fr}
  .rows a{grid-template-columns:1fr;gap:6px}
  .rows em{justify-self:start}
  .terms dl > div{grid-template-columns:1fr;gap:8px}
}