/* ===== Stage 8: patterns adapted from Vetra (glass, 3D reveal, scroll motion), Bain, PitchBook — in ZhongTai Bridge colours ===== */

/* frosted glass header once the page scrolls (Vetra nav) */
.top{transition:background-color .35s,box-shadow .35s,backdrop-filter .35s}
.top.scrolled{background:rgba(255,255,255,.72)!important;-webkit-backdrop-filter:blur(18px) saturate(170%);backdrop-filter:blur(18px) saturate(170%);box-shadow:0 1px 0 rgba(30,39,68,.08),0 6px 15px -10px rgba(30,39,68,.35)}
.top.scrolled .bar{padding-top:9px;padding-bottom:9px;transition:padding .3s}

/* dark "glass" sections: navy field, slow-moving brand-colour light, translucent cards */
.glass-sec{position:relative;overflow:hidden;isolation:isolate;background:#151c33!important;color:#E6EBF2}
.glass-sec::before,.glass-sec::after{content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(80px);pointer-events:none}
.glass-sec::before{width:620px;height:620px;left:-140px;top:-180px;background:radial-gradient(circle,rgba(62,101,86,.85),rgba(62,101,86,0) 68%);animation:orbA 22s ease-in-out infinite alternate}
.glass-sec::after{width:560px;height:560px;right:-120px;bottom:-200px;background:radial-gradient(circle,rgba(70,96,160,.55),rgba(70,96,160,0) 68%);animation:orbB 26s ease-in-out infinite alternate}
@keyframes orbA{to{transform:translate3d(180px,120px,0) scale(1.15)}}
@keyframes orbB{to{transform:translate3d(-200px,-90px,0) scale(1.1)}}
.glass-sec h2,.glass-sec h3{color:#fff}
.glass-sec .eyebrow{color:var(--sage-lt)}
.glass-sec .lead,.glass-sec .lead.muted,.glass-sec p.muted{color:#C9D2DF}
.glass-sec .trust-it,.glass-sec .frame,.glass-sec .method div{background:linear-gradient(140deg,rgba(255,255,255,.09),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 15px 30px -20px rgba(0,0,0,.6)}
.glass-sec .trust-it p,.glass-sec .frame p,.glass-sec .method p{color:#C2CCDA}
.glass-sec .trust-ic{background:rgba(169,192,180,.16);color:var(--sage-lt)}
.glass-sec .trust-it:hover{border-color:rgba(169,192,180,.45)}
.glass-sec .frame>div{border-color:rgba(255,255,255,.1)!important}
.glass-sec .frame .tag{background:rgba(169,192,180,.18);color:var(--sage-lt)}
.glass-sec .method div{border-radius:14px;padding:20px 22px;border-top:2px solid var(--sage)}
.glass-sec .frame{background:rgba(255,255,255,.04)}

/* spotlight that follows the pointer across glass cards */
.glass-sec .trust-it,.glass-sec .frame>div{position:relative}
.glass-sec .trust-it::after,.glass-sec .frame>div::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(169,192,180,.18),transparent 60%)}
.glass-sec .trust-it:hover::after,.glass-sec .frame>div:hover::after{opacity:1}

/* animated gradient border on the cards that matter most */
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
.glow-border{position:relative}
.glow-border::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;pointer-events:none;
  background:conic-gradient(from var(--ang),rgba(169,192,180,0) 0deg,rgba(169,192,180,.9) 60deg,rgba(62,101,86,0) 140deg,rgba(169,192,180,0) 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:spinb 6s linear infinite}
@keyframes spinb{to{--ang:360deg}}

/* headline reveal: words rise into place */
.hw{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em;margin-bottom:-.06em}
.hw>span{display:inline-block;transform:translateY(105%);transition:transform .8s cubic-bezier(.22,.61,.36,1);transition-delay:calc(var(--i,0)*45ms)}
.hw-in .hw>span,.no-motion .hw>span{transform:none}

/* industry tiles: compact glass label so the photograph stays visible */
.ind a{min-height:360px}
.ind .in{margin:12px;padding:14px 16px 15px;border-radius:12px;background:linear-gradient(135deg,rgba(14,20,40,.55),rgba(14,20,40,.35));border-color:rgba(255,255,255,.18)}
.ind h3{font-size:20px}
.ind p{font-size:14px;margin-top:4px}
.ind a::before{background:linear-gradient(0deg,rgba(12,17,34,.5) 0%,rgba(12,17,34,0) 45%)}

/* about: more breathing room between the text and the photograph */
.team-split{gap:clamp(40px,6vw,88px);align-items:center;margin-bottom:12px}
.team-split img{min-height:420px;border-radius:20px}

/* partners & investors: solid text panel on the left, clear photograph on the right */
.inv2::after{background:linear-gradient(90deg,rgba(14,20,40,.92) 0%,rgba(14,20,40,.82) 38%,rgba(14,20,40,.15) 66%,rgba(14,20,40,0) 100%)!important}
.inv2-card{background:rgba(21,28,51,.9)!important}
.inv2-pts li{background:rgba(21,28,51,.72)!important}
@media (max-width:900px){.inv2::after{background:rgba(14,20,40,.78)!important}}

/* PitchBook-style closing capture in the final call to action */
.cta-form{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px;max-width:440px}
.cta-form input{flex:1 1 220px;min-height:48px;border-radius:10px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#fff;padding:0 16px;font:inherit;font-size:15px}
.cta-form input::placeholder{color:#AAB6C8}
.cta-form .btn{margin:0}
.cta-form .formmsg{flex-basis:100%;color:var(--sage-lt);font-size:14px}

@media (prefers-reduced-motion:reduce){.glass-sec::before,.glass-sec::after,.glow-border::before{animation:none}.hw>span{transform:none}}
