.finprime-technology { color: var(--fp-ink); }
.finprime-technology .banner { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; min-height: 620px; color: #fff; background: #0c264c; }
.finprime-technology .banner-image { position: absolute; z-index: -3; inset: 0; width: 100%; height: 100%; object-fit: cover;     object-position: center -8%; }
.finprime-technology .banner-mark { position: absolute; z-index: -1; top: 79px; left: calc(50% + 107px); width: 318px; height: auto;  }
.finprime-technology .banner-outline { position: absolute; z-index: -1; top: 254px; left: calc(50% - 915px); width: 314px; height: auto;  }
.finprime-technology .banner-content { flex: 1 0 auto; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; min-height: 0; padding-top: 160px; padding-bottom: 80px; }
.finprime-technology h1 span { display: block; }
.finprime-technology .banner-content > p { max-width: 750px; margin-top: 16px; font-size: 16px; line-height: 24px; opacity: .7; }
.finprime-technology .banner-content .finprime-button { margin-top: 48px; }
.finprime-technology .banner-features { flex: none; background: #1a1a1a33; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: inset 0 0 20px #f2f2f214,inset 0 0 10px #b3b3b314; }
/* Equal thirds, not fixed widths with space-between: the leftover space would make the real gap
   differ from --feature-gap and the separator dot would no longer sit in the middle of it. */
.finprime-technology .banner-features ul { --feature-gap: 32px; max-width: 1200px; display: flex; gap: var(--feature-gap); padding: 0; margin-block: 0; list-style: none; }
.finprime-technology .banner-features li { position: relative; flex: 1; min-width: 0; padding: 24px 20px; text-align: center; line-height: 24px; }
/* The design breaks each feature at a fixed point, so the lines are content, not a width accident. */
.finprime-technology .banner-features li span { display: block; }
.finprime-technology .banner-features li + li::before { content: ''; position: absolute; width: 4px; height: 4px; background: #b4825d; border-radius: 50%; left: calc(var(--feature-gap) / -2); top: calc(50% - 2px); transform: translateX(-50%); }

/* ---------- Intro statement ---------- */
.finprime-technology .row-intro { position: relative; isolation: isolate; padding: 96px 0; color: #0c264c; background: #f6f8fc; border-block: 1px solid #c7d2e6;overflow: hidden; }
.finprime-technology .intro-pattern { position: absolute; z-index: -1; top: 0; left: max(0px,calc(50% - 900px)); height: 100%; width: auto; max-width: none; pointer-events: none; }
.finprime-technology .intro-content { text-align: center; }
.finprime-technology h2.intro-title {         margin: 0 auto;
    font-size: 56px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
    max-width: 1100px;}
.finprime-technology .intro-key { color: inherit; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 8px; transition: color .2s ease; }
.finprime-technology a.intro-key:focus-visible { outline: 2px solid #b4825d; outline-offset: 4px; }
.finprime-technology .intro-divider {     display: block;
    width: 96px;
    height: 1px;
    margin: 45px auto 40px;
    background: #0c264c4d }
.finprime-technology .intro-description {     max-width: 1000px;
    margin: 0 auto;
    font-size: 24px;
    line-height: 1.6; }

/* ---------- Shared section copy ---------- */
.finprime-technology .section-intro {    margin-top: 55px;
    /* max-width: 1040px; */
    font-size: 18px;
    line-height: 1.6; }

/* ---------- Page base ---------- */
.finprime-technology h2 { font-size: 56px; }
.finprime-technology .section-pattern { position: absolute; z-index: -1; pointer-events: none; height: auto; }
.finprime-technology.protected-page { padding: 160px 40px 80px; }

/* ---------- Multi-Asset Liquidity + Weekend Gold & Oil (shared with the home page) ---------- */
.finprime-technology .eyebrow {text-transform: uppercase; display: flex; align-items: center; gap: 4px; margin-bottom: -1px; min-height: 30px; font-size: 18px; font-weight: 500; line-height: 1.2; }
.finprime-technology .eyebrow img {     width: 30px;
    height: 30px;
    margin-right: 15px;}
.finprime-technology .row2 { padding: 80px 0; }
.finprime-technology .row2 { color: #fff; background: linear-gradient(130deg,#0c264c,#041c39); }
.finprime-technology .heading-row { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.finprime-technology .section-intro { margin-top: 55px; font-size: 18px; line-height: 1.6; }
.finprime-technology .row2 .section-intro { color: #ffffffe6; }
.finprime-technology .assets { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; margin: 40px 0 0; padding: 0; list-style: none; }
.finprime-technology .asset-card { display: flex; flex-direction: column; gap: 28px; min-width: 0; padding: 24px 24px 28px; background: #ffffff0f; border: 1px solid #ffffff1f; border-radius: 2px; transition: background-color .25s ease, border-color .25s ease; }
.finprime-technology .asset-head { display: flex; align-items: center; gap: 16px; }
.finprime-technology .asset-head h3 { font-size: 30px; line-height: 1.2; text-transform: none; }
.finprime-technology .asset-icon { position: relative; flex: none; width: 64px; height: 64px; }
.finprime-technology .asset-icon img { display: block; width: 62px; height: 62px; transition: opacity .25s ease; }
.finprime-technology .asset-icon .icon-hover { position: absolute; inset: 0; opacity: 0; }
.finprime-technology .asset-card p { font-size: 16px; line-height: 1.6; color: #ffffffe0; }
.finprime-technology .assets-watermark { display: grid; place-items: center; padding: 0 8px; }
.finprime-technology .assets-watermark img { display: block; width: 100%; max-width: 360px; height: auto; opacity: .17; }
.finprime-technology .weekend { display: grid; grid-template-columns: minmax(0,4fr) minmax(0,8fr); gap: 32px; margin-top: 90px; }
.finprime-technology .weekend-heading { padding: 0px; }
.finprime-technology .weekend-eyebrow { font-size: 18px; font-weight: 600; letter-spacing: .02em; line-height: 1.2; color: #b4825d; }
.finprime-technology .weekend-heading h3 { margin-top: 8px; font-size: 30px; line-height: 1.2; text-transform: none; }
.finprime-technology .weekend-quote { max-width: 280px; margin-top: 48px; padding-left: 16px; border-left: 3px solid #b4825d; font-size: 20px; font-weight: 600; line-height: 1.6; }
.finprime-technology .weekend-panel { display: flex; flex-direction: column; gap: 20px; padding: 66px 53px 28px; background: #ffffff0f; border: 1px solid #ffffff1f; border-radius: 2px; font-size: 20px; line-height: 1.6; color: #F6F2EAD9; }
.finprime-technology .weekend-panel .weekend-note { margin-top: 4px; font-size: 16px; font-style: italic; line-height: 1.5; color: #F6F2EA99; }




@media (max-width: 768px) {
 .finprime-technology .eyebrow { font-size: 14px; min-height: 23px; line-height: 1.1; margin-bottom: 0px; }
 .finprime-technology .eyebrow img {     width: 20px; height: 20px; margin-right: 10px;}
 .finprime-technology .row2 { padding: 32px 0; }
 .finprime-technology .row2 .heading-row { align-items: flex-start; flex-direction: column; gap: 24px; }
}
@media (max-width: 440px) {
 .finprime-technology .asset-head h3 { font-size: 20px; }
}
@media (hover: hover) and (pointer: fine) {
 .finprime-technology .asset-card:hover { background: #b4825d; border-color: #b4825d; }
 .finprime-technology .asset-card:hover .icon-default { opacity: 0; }
 .finprime-technology .asset-card:hover .icon-hover { opacity: 1; }
 .finprime-technology .asset-card:hover .asset-head::after { color: #fff; }
}
@media (max-width: 1280px) {
 .finprime-technology .asset-head h3 { font-size: 28px; }
 .finprime-technology .asset-card { padding: 24px 20px 28px; }
 .finprime-technology .asset-head { gap: 12px; }
 .finprime-technology .asset-head h3 { min-width: 0; font-size: clamp(20px,2.2vw,28px); overflow-wrap: anywhere; }
 .finprime-technology .asset-icon, .finprime-technology .asset-icon img { width: 48px; height: 48px; }
}
@media (max-width: 960px) {
 .finprime-technology .assets { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
 .finprime-technology .assets-watermark { display: none; }
 .finprime-technology .weekend { grid-template-columns: 1fr; gap: 24px; margin-top: 48px; }
 .finprime-technology .weekend-heading { padding: 0; }
 .finprime-technology .weekend-quote { max-width: none; }
}
@media (max-width: 768px) {
 .finprime-technology .section-intro { margin-top: 16px; font-size: 14px; }
 .finprime-technology .assets { grid-template-columns: 1fr; margin-top: 32px; }
 .finprime-technology .asset-card { padding: 20px; gap: 16px; }
 .finprime-technology .asset-head { gap: 12px; }
 .finprime-technology .asset-head h3 { min-width: 0; font-size: 24px; }
 .finprime-technology .asset-icon, .finprime-technology .asset-icon img { width: 48px; height: 48px; }
 .finprime-technology .assets { counter-reset: asset; }
 .finprime-technology .asset-card { counter-increment: asset; }
 .finprime-technology .asset-head::after { content: counter(asset,decimal-leading-zero); content: counter(asset,decimal-leading-zero) / ''; flex: none; margin-left: auto; align-self: flex-start; padding-top: 4px; font-size: 14px; font-weight: 700; line-height: 1; letter-spacing: .02em; color: #d9b08c; transition: color .25s ease; }
 .finprime-technology .weekend-heading h3 { font-size: 24px; }
 .finprime-technology .weekend-quote { font-size: 16px; margin-top: 20px; }
 .finprime-technology .weekend-panel { padding: 24px 20px; font-size: 15px; gap: 16px; }
 .finprime-technology .weekend-panel .weekend-note { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
 .finprime-technology .asset-card, .finprime-technology .asset-icon img { transition: none; }
}

/* ---------- Solutions ---------- */
.finprime-technology .row3 { position: relative; isolation: isolate; overflow: hidden; padding: 80px 0; background: #f6f6f4; }
.finprime-technology .row3 .section-pattern { width: 635px; left: 0; top: 220px; }
.finprime-technology .solutions-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 0; row-gap: 0; margin-top: 24px; }
.finprime-technology .solution { position: relative; display: grid; grid-template-columns: minmax(0,1fr) 120px; grid-row: span 2; align-content: start; column-gap: 16px; row-gap: 24px; min-width: 0; padding: 56px 32px 52px; border-bottom: 1pt solid #b4825d; }
/* 同一行的两个卡片共用「标题行 / 正文行」,标题顶部对齐、正文起点对齐(不支持 subgrid 的旧浏览器退回普通排布) */
@supports (grid-template-rows: subgrid) { .finprime-technology .solution { grid-template-rows: subgrid; } }
.finprime-technology .solution:nth-child(2n-1) { padding-left: 0; padding-right: 32px; }
/* 两列之间的竖线:每个右列卡片一段,只覆盖内容区,与横线相交处自然断开;颜色 #B4825D,粗细 1pt */
.finprime-technology .solution:nth-child(2n) { padding-left: 32px; padding-right: 0; }
.finprime-technology .solution:nth-child(2n)::before { content: ''; position: absolute; left: 0; top: 56px; bottom: 36px; width: 1pt; background: #b4825d; pointer-events: none; }

.finprime-technology .solution:nth-last-child(-n+2) { border-bottom: 0; }
.finprime-technology .solution h3 { grid-column: 1; grid-row: 1; align-self: start; font-size: 40px; line-height: 1.05; text-transform: none; }
.finprime-technology .solution-art { grid-column: 2; grid-row: 1; align-self: center; }
.finprime-technology .solution-art img { display: block; width: 120px; height: 120px; object-fit: contain; }
.finprime-technology .solution p { grid-column: 1 / -1; font-size: 20px; line-height: 1.6; color: #4A5875; }

/* ---------- How Our Liquidity Supports Your Operations ---------- */
.finprime-technology .row4 { padding: 80px 0; background: var(--fp-canvas); }
.finprime-technology .operations { display: grid; grid-template-columns: minmax(0,663px) minmax(0,1fr); grid-template-areas: "eyebrow eyebrow" "media text"; column-gap: 0; row-gap: 24px; align-items: center; }
.finprime-technology .operations > .eyebrow { grid-area: eyebrow; align-self: start; margin: 0; }
.finprime-technology .operations-text { grid-area: text; min-width: 0; }
.finprime-technology .operations h2 { max-width: 560px; margin: 0; }
.finprime-technology .operations-quote { max-width: 660px; margin-top: 32px; padding: 0; border: 0; font-size: 18px; line-height: 1.5; color: #4A5875; }
.finprime-technology .operations-media { grid-area: media; position: relative; isolation: isolate; justify-self: start; width: 309px; max-width: calc(100% - 91px); margin-left: 91px; }
.finprime-technology .operations-outline { position: absolute; z-index: -1; left: 3.6%; top: 4.1%; width: 103.4%; max-width: none; height: auto; pointer-events: none; } /* 描边图比主图大一点并向右下偏移(按设计稿) */
.finprime-technology .operations-image { display: block; width: 100%; height: auto; }

@media (max-width: 1280px) {
 
 .finprime-technology .solution h3 { font-size: 34px; }
 .finprime-technology .solution:nth-child(2n-1) { padding-right: 24px; }
 .finprime-technology .solution:nth-child(2n) { padding-left: 24px; }
 .finprime-technology .operations { grid-template-columns: minmax(0,1fr) minmax(0,1fr); column-gap: 32px; }
 .finprime-technology .operations-media { margin-left: 32px; max-width: calc(100% - 64px); }
 .finprime-technology h2.intro-title { font-size: 38px; }
}
@media (max-width: 960px) {
   .finprime-technology .solution { padding-inline: 16px !important; }
   .finprime-technology .row-intro { padding: 72px 0; }
 .finprime-technology .solutions-grid { grid-template-columns: minmax(0,1fr); }
 .finprime-technology .solution:nth-child(2n)::before { display: none; }
 .finprime-technology .solution:nth-last-child(-n+2) { border-bottom: 1pt solid #b4825d; }
 .finprime-technology .solution:nth-last-child(2) { border-bottom: 0; } /* 最后一个是水印,倒数第二个才是最后一项 */
 .finprime-technology .operations { column-gap: 24px; }
 .finprime-technology .operations-media { margin-left: 0; max-width: calc(100% - 24px); }
 .finprime-technology .operations h2 { font-size: clamp(34px,4.6vw,44px); }
}
@media (max-width: 768px) {
   .finprime-technology .row-intro { padding: 48px 0; }
 .finprime-technology .intro-pattern { left: -30%; opacity: .7; }
 .finprime-technology h2.intro-title { font-size: 26px; line-height: 1.35; }
 .finprime-technology .intro-key { text-underline-offset: 5px; text-decoration-thickness: 1px; }
 .finprime-technology .intro-divider { margin: 24px auto 20px; width: 64px; }
 .finprime-technology .intro-description { font-size: 16px; }
   .finprime-technology .banner-image {
    object-position: 30% ;
}
 .finprime-technology h1 { font-size: 40px; }
 .finprime-technology .banner-content { padding-top: 120px; padding-bottom: 56px; }
 .finprime-technology .banner-content > p { margin-top: 8px; font-size: 14px; line-height: 1.4; }
 .finprime-technology .banner-content .finprime-button { margin-top: 32px; min-height: 44px; padding: 12px 16px; font-size: 18px; }
 .finprime-technology .banner-features ul { flex-direction: column; gap: 0; padding-block: 4px 16px; }
 .finprime-technology .banner-features li { flex: none; width: 100%; text-align: left; padding: 16px 0 16px 16px; font-size: 14px; font-weight: 500; line-height: 1.1; }
 .finprime-technology .banner-features li span { display: inline; }
 .finprime-technology .banner-features li + li { border-top: 1px solid #ffffff33; }
 /* Both selectors are needed: `li + li::before` outranks `li::before`, so the desktop offset would stay. */
 .finprime-technology .banner-features li::before, .finprime-technology .banner-features li + li::before { content: ''; position: absolute; width: 4px; height: 4px; border-radius: 50%; background: var(--fp-gold); left: 0; top: calc(50% - 2px); transform: none; }
 .finprime-technology :is(.banner-mark,.banner-outline) { display: none; }
 .finprime-technology .row2, .finprime-technology .row3, .finprime-technology .row4 { padding: 32px 0; }
 .finprime-technology h2 { font-size: 32px; }
 .finprime-technology .row3 .section-pattern { width: 360px; top: 100px; left: -100px; }
 .finprime-technology .solutions-grid { margin-top: 8px; }
 .finprime-technology .solution { grid-template-columns: minmax(0,1fr) 72px; column-gap: 12px; row-gap: 16px; padding: 24px 0; }
 .finprime-technology .solution h3 { font-size: 24px; }
 .finprime-technology .solution-art img { width: 72px; height: 72px; }
 .finprime-technology .solution p { font-size: 14px; line-height: 1.5; }
 .finprime-technology .operations { grid-template-columns: minmax(0,1fr); grid-template-areas: "eyebrow" "text" "media"; row-gap: 24px; }
 .finprime-technology .operations > .eyebrow { margin-bottom: -8px; }
 .finprime-technology .operations h2 { font-size: 32px; }
 .finprime-technology .operations-quote { margin-top: 16px; font-size: 14px; line-height: 1.5; }
 .finprime-technology .operations-media { width: 250px; max-width: calc(100% - 20px); margin-left: 0; }
}
.finprime-technology :is(h1,h2,h3) { text-transform: capitalize; }
/* Banner = one full screen; subtract the WP admin bar for logged-in users */
/* .finprime-site.admin-bar .finprime-technology .banner { min-height: calc(100vh - 32px); min-height: calc(100svh - 32px); }
@media (max-width: 782px) { .finprime-site.admin-bar .finprime-technology .banner { min-height: calc(100vh - 46px); min-height: calc(100svh - 46px); } } */

/* 水印:放在最后一行右列,右侧超出网格边界(浮于网格之外) */
/* .finprime-technology .client-watermark { grid-column: 2; grid-row: span 2; display: flex; align-items: center; justify-content: flex-end; min-width: 0; }
.finprime-technology .client-watermark img { display: block; flex: none; width: clamp(300px, 24.4vw, 468px); max-width: none; height: auto; margin-right: clamp(-64px, -3.4vw, -24px); pointer-events: none; } */

.finprime-technology .client-watermark { grid-column: 2; grid-row: span 2; display: flex; align-items: center; justify-content: flex-start; min-width: 0; }
.finprime-technology .client-watermark img{ display: block; flex: none; width: clamp(500px, 40.6vw, 650px); max-width: none; height: auto; margin-left: clamp(64px, 3.4vw, 24px); pointer-events: none; }

@media (max-width: 960px) {
    .finprime-technology .client-watermark { display: none; }
}

.banner {
  --hero-fade-rgb: 12, 38, 76;
  --hero-fade-strength: 0.67;  /* fade darkness, 0 to 1 */
}
.banner::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(90deg,
    rgba(var(--hero-fade-rgb), 0)                                     calc(50% - 1080px),
    rgba(var(--hero-fade-rgb), calc(var(--hero-fade-strength) * .18)) calc(50% - 950px),
    rgba(var(--hero-fade-rgb), calc(var(--hero-fade-strength) * .50)) calc(50% - 792px),
    rgba(var(--hero-fade-rgb), calc(var(--hero-fade-strength) * .85)) calc(50% - 612px),
    rgba(var(--hero-fade-rgb), var(--hero-fade-strength))             calc(50% - 360px),
    rgba(var(--hero-fade-rgb), calc(var(--hero-fade-strength) * .85)) calc(50% - 108px),
    rgba(var(--hero-fade-rgb), calc(var(--hero-fade-strength) * .50)) calc(50% + 72px),
    rgba(var(--hero-fade-rgb), calc(var(--hero-fade-strength) * .18)) calc(50% + 230px),
    rgba(var(--hero-fade-rgb), 0)                                     calc(50% + 360px));
}
.banner .banner-image { filter: brightness(1.10) saturate(1.12) contrast(1.05); }
.banner::after { opacity: 0.45; }   /* existing navy tint, lightened */
.banner .banner-outline { z-index: 2; }
.banner h1,
.banner h1 span {
  line-height: 1.107;
}
@media (max-width: 1240px) {
  .banner::before {
    background: linear-gradient(90deg,
      rgba(var(--hero-fade-rgb), var(--hero-fade-strength)) 0%,
      rgba(var(--hero-fade-rgb), calc(var(--hero-fade-strength) * .6)) 55%,
      rgba(var(--hero-fade-rgb), 0) 100%);
  }
}