/* A quiet branded entrance, rendered before the application starts. */
#bank-intro{font-family:'DM Sans',sans-serif;isolation:isolate;opacity:1;transition:opacity .4s ease}
#bank-intro::before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 42%,#e6eee780,transparent 62%);pointer-events:none}
.intro-brand{position:absolute;top:max(42px,env(safe-area-inset-top));left:0;right:0;display:flex;align-items:center;justify-content:center;gap:11px;font-size:12px;font-weight:700;letter-spacing:.2em}
.intro-brand img{border-radius:7px}
.intro-financial{font-weight:400;letter-spacing:.16em}
.intro-content{text-align:center;padding:36px 24px;transform:translateY(-12px)}
.intro-emblem{position:relative;width:144px;height:144px;margin:0 auto 38px;display:grid;place-items:center}
.intro-ring{position:absolute;inset:0;width:100%;height:100%;stroke-width:1.5}
.intro-ring-track{stroke:#dce5de}
.intro-ring-orbit{stroke:#22765c;stroke-linecap:round;stroke-dasharray:95 314;transform-origin:72px 72px;animation:intro-orbit 2s linear infinite}
.intro-crest{width:58px;height:58px;stroke:#22614d;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;animation:intro-arrive .7s ease both}
.intro-shield{fill:#e7eee6}
.intro-chart{stroke-dasharray:65;stroke-dashoffset:65;animation:intro-draw 1.1s .15s ease forwards}
.intro-eyebrow{margin:0 0 14px;color:#517063;font-size:10px;font-weight:600;letter-spacing:.24em}
#bank-intro .intro-title{margin:0;color:#142b35;font-family:Georgia,'Times New Roman',serif;font-size:clamp(28px,5.5vw,38px);font-weight:400;line-height:1.25;letter-spacing:-.035em}
.intro-caption{margin:14px 0 0;color:#65736e;font-size:13px;letter-spacing:.015em}
.intro-progress{width:140px;height:2px;margin:30px auto 0;background:#dfe6de;overflow:hidden;border-radius:2px}
.intro-progress span{display:block;width:100%;height:100%;background:#22765c;transform:scaleX(.05);transform-origin:left;animation:intro-progress 4.5s cubic-bezier(.16,1,.3,1) forwards}
.intro-footer{position:absolute;bottom:max(35px,env(safe-area-inset-bottom));left:24px;right:24px;display:flex;justify-content:center;align-items:center;gap:8px;color:#6e7b73;font-size:11px;letter-spacing:.025em;text-align:center}
.intro-footer svg{width:14px;height:14px;flex-shrink:0}
#bank-intro.intro-leaving{opacity:0;pointer-events:none}
#bank-intro.intro-leaving .intro-progress span{animation:none;transform:scaleX(1)}
@keyframes intro-orbit{to{transform:rotate(360deg)}}
@keyframes intro-draw{to{stroke-dashoffset:0}}
@keyframes intro-arrive{from{opacity:0;transform:translateY(6px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes intro-progress{to{transform:scaleX(.92)}}
@media(max-height:500px){.intro-brand{top:18px}.intro-emblem{width:86px;height:86px;margin-bottom:16px}.intro-content{padding:65px 20px}.intro-footer{bottom:15px}.intro-progress{margin-top:16px}.intro-eyebrow{margin-bottom:8px}}
@media(prefers-reduced-motion:reduce){#bank-intro,#bank-intro *{animation:none!important;transition:none!important}.intro-chart{stroke-dashoffset:0}.intro-progress span{transform:scaleX(.6)}}