.bank-hero-art:has(.bank-transform){padding:0;overflow:hidden;background:linear-gradient(145deg,#f8fbff 0%,#eef6ff 100%)}
.bank-transform{position:relative;display:grid;grid-template-columns:minmax(168px,.95fr) 58px minmax(205px,1.15fr);align-items:center;gap:22px;min-height:455px;padding:30px 28px;font-family:"Inter","Segoe UI",Arial,sans-serif;color:#0b2e61;isolation:isolate}
.bank-transform::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 52% 48%,rgba(27,110,232,.10),transparent 31%)}
.bank-transform-sources{display:grid;gap:10px}
.bank-source-card{position:relative;padding:11px 14px;border:1px solid #d5e1ee;border-radius:12px;background:rgba(255,255,255,.94);box-shadow:0 8px 20px rgba(18,61,109,.07);opacity:0;transform:translateX(-12px);animation:bank-source-in .55s cubic-bezier(.22,.8,.3,1) forwards}
.bank-source-card:nth-child(2){animation-delay:.12s}
.bank-source-card:nth-child(3){animation-delay:.24s}
.bank-source-card:nth-child(4){animation-delay:.36s}
.bank-source-type{display:block;font-size:12px;font-weight:700;letter-spacing:.01em;color:#123b72}
.bank-source-details{display:grid;grid-template-columns:auto 1fr;gap:3px 8px;margin-top:7px;font-size:8px;line-height:1.25}
.bank-source-details span:nth-child(odd){color:#718197}
.bank-source-details span:nth-child(even){font-weight:600;color:#244467;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bank-source-card.rules{border-left:3px solid #2679e8;background:#f8fbff}
.bank-source-card.rules .bank-source-type{color:#1260c4}
.bank-transform-layer{position:relative;width:44px;height:306px;justify-self:center;border:1px solid rgba(38,120,235,.42);border-radius:12px;background:linear-gradient(180deg,rgba(102,168,248,.18),rgba(39,116,226,.38),rgba(77,190,219,.18));box-shadow:0 18px 40px rgba(33,111,215,.14),inset 0 0 24px rgba(255,255,255,.58);transform:scaleY(.18);opacity:0;animation:bank-layer-on .72s .55s cubic-bezier(.22,.8,.3,1) forwards}
.bank-transform-layer::before,.bank-transform-layer::after{content:"";position:absolute;left:50%;width:15px;height:1px;background:#fff;box-shadow:0 0 8px rgba(255,255,255,.9)}
.bank-transform-layer::before{top:37%;transform:translateX(-80%)}
.bank-transform-layer::after{top:63%;transform:translateX(-20%)}
.bank-output-card{padding:22px 22px 18px;border:1px solid #cfddea;border-left:3px solid #12a89c;border-radius:16px;background:#fff;box-shadow:0 20px 44px rgba(13,48,91,.12);opacity:0;transform:translateX(14px);animation:bank-output-in .65s 1.05s cubic-bezier(.22,.8,.3,1) forwards}
.bank-output-eyebrow{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#167d8a}
.bank-output-card h3{margin:5px 0 15px;font-size:18px;letter-spacing:-.02em;color:#0b2e61}
.bank-record-grid{display:grid;grid-template-columns:auto 1fr;gap:7px 14px;padding-bottom:15px;border-bottom:1px solid #dce7f1;font-size:11px}
.bank-record-grid span:nth-child(odd){color:#6d7e92}
.bank-record-grid span:nth-child(even){font-weight:600;color:#183b67;text-align:right}
.bank-status-stack{display:grid;gap:7px;padding-top:14px}
.bank-status{display:flex;align-items:center;gap:8px;min-height:27px;padding:5px 9px;border-radius:8px;background:#effaf8;color:#087f78;font-size:11px;font-weight:700;opacity:0;transform:translateY(7px);animation:bank-status-in .4s ease-out forwards}
.bank-status::before{content:"✓";display:grid;width:17px;height:17px;place-items:center;border-radius:50%;background:#10a99d;color:#fff;font-size:11px}
.bank-status:nth-child(1){animation-delay:1.75s}
.bank-status:nth-child(2){animation-delay:2.45s}
.bank-status:nth-child(3){animation-delay:3.15s}
.bank-status:nth-child(4){animation-delay:3.85s}
@keyframes bank-source-in{to{opacity:1;transform:none}}
@keyframes bank-layer-on{to{opacity:1;transform:none}}
@keyframes bank-output-in{to{opacity:1;transform:none}}
@keyframes bank-status-in{to{opacity:1;transform:none}}
@media(max-width:700px){.bank-transform{grid-template-columns:1fr 32px 1.08fr;gap:9px;min-height:410px;padding:20px 12px}.bank-source-card{padding:9px 9px}.bank-source-type{font-size:9px}.bank-source-details{font-size:7px;gap:2px 5px}.bank-transform-layer{width:27px;height:270px}.bank-output-card{padding:14px 11px 11px}.bank-output-card h3{font-size:14px}.bank-record-grid{font-size:8px;gap:5px 6px}.bank-status{font-size:8px;padding:3px 5px;gap:5px}.bank-status::before{width:14px;height:14px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.bank-source-card,.bank-transform-layer,.bank-output-card,.bank-status{animation:none;opacity:1;transform:none}}
