/* gs-halo.css — "security-print halo" around the lead form on gold service pages.
   Two woven guilloche bands centred on the form + one small emblem in the gap.
   Every name is prefixed fx- (the site has .card, @keyframes spin …). Only
   transform / opacity / stroke-dashoffset animate; rotating parts are divs. */
.gs-fx,.gs-fx-scene{display:none!important}   /* v1 hook elements, unused now */
.gs-hero.fx-on::after{opacity:0}
.fx-host{isolation:isolate}   /* lets the clip sit at z-index:-1: above the hero's own background, below its content */
.fx-clip{position:absolute;inset:0;overflow:hidden;z-index:-1;pointer-events:none}
.fx-halo{position:absolute;pointer-events:none}
.fx-emb{position:absolute;pointer-events:none;width:180px;height:180px;transform-origin:50% 50%}
.fx-l{position:absolute;inset:0}
.fx-l svg{display:block;overflow:visible}
.fx-c{position:absolute;left:50%;top:50%;width:0;height:0}   /* origin for offset-path movers */

/* lace — strands draw in once, then the bands turn very slowly */
.fx-ros{will-change:transform;animation:fx-spin var(--spin,300s) linear infinite}
.fx-rp{fill:none;stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-in 3.2s var(--dly,0s) cubic-bezier(.4,0,.2,1) forwards}
.fx-o{stroke:rgb(var(--acr)/.13)}
.fx-i{stroke:rgb(var(--acr)/.24)}
@keyframes fx-in{to{stroke-dashoffset:0}}
@keyframes fx-spin{to{transform:rotate(360deg)}}
@keyframes fx-spinr{to{transform:rotate(-360deg)}}

/* emblem base */
.fx-disc{fill:rgba(255,255,255,.72);stroke:rgb(var(--acr)/.28);stroke-width:1.2;stroke-dasharray:3 4}
.fx-dotk{fill:rgb(var(--acr)/.35)}
.fx-hub,.fx-hubf{fill:rgb(var(--acr)/.8)}
.fx-row,.fx-row2{stroke:rgba(10,19,43,.22);stroke-width:5;stroke-linecap:round}
.fx-row2{stroke:rgb(var(--acr)/.45)}
.fx-arw,.fx-post{fill:none;stroke:rgb(var(--acr)/.7);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.fx-doc{fill:rgba(255,255,255,.6);stroke:rgba(10,19,43,.25);stroke-width:1.5}
@keyframes fx-draw{0%{stroke-dashoffset:1;opacity:1}40%,82%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes fx-move{0%{offset-distance:0%}100%{offset-distance:100%}}

/* file — 31-day dial; the hand sweeps to the due day and waits */
.fx-due{fill:rgb(var(--acr));animation:fx-pulse 2.4s ease-in-out infinite}
@keyframes fx-pulse{0%,100%{opacity:.45}50%{opacity:1}}
.fx-hand-l{will-change:transform;animation:fx-hand 8s cubic-bezier(.6,0,.2,1) infinite}
@keyframes fx-hand{0%{transform:rotate(0deg)}45%,85%{transform:rotate(calc(var(--to,0deg) + 90deg))}100%{transform:rotate(360deg)}}
.fx-handp{stroke:rgb(var(--acr)/.85);stroke-width:4;stroke-linecap:round}

/* issue — a seal draws itself inside a turning dotted ring */
.fx-sealp{fill:none;stroke:rgb(var(--acr)/.75);stroke-width:1;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-draw 10s ease-in-out infinite}
.fx-dash{fill:none;stroke:rgb(var(--acr)/.55);stroke-width:2;stroke-dasharray:2 6;stroke-linecap:round}
.fx-rot-a{will-change:transform;animation:fx-spin 40s linear infinite}

/* incorporate — the steps light down a chain */
.fx-chain{fill:none;stroke:rgb(var(--acr)/.55);stroke-width:3;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-grow calc(var(--n)*1.6s) ease-in-out infinite}
@keyframes fx-grow{0%{stroke-dashoffset:1;opacity:1}70%,88%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
.fx-node{fill:#fff;stroke:rgb(var(--acr)/.7);stroke-width:3;animation:fx-node calc(var(--n)*1.6s) calc(var(--i) / (var(--n) - 1) * var(--n) * 1.12s) infinite}
@keyframes fx-node{0%{fill:#fff}4%,86%{fill:rgb(var(--acr))}100%{fill:#fff}}

/* change — one line is struck and rewritten */
.fx-old{stroke:rgba(10,19,43,.22);stroke-width:5;stroke-linecap:round}
.fx-strk{stroke:rgb(var(--acr));stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-strk 9s ease-in-out infinite}
.fx-new{stroke:rgba(19,136,8,.75);stroke-width:5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-new 9s ease-in-out infinite}
@keyframes fx-strk{0%,10%{stroke-dashoffset:1;opacity:1}28%,86%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes fx-new{0%,38%{stroke-dashoffset:1;opacity:1}58%,86%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}

/* convert — two rings; a dot moves from one into the other */
.fx-ringA{fill:none;stroke:rgba(10,19,43,.3);stroke-width:2;stroke-dasharray:4 5}
.fx-ringB{fill:rgb(var(--acr)/.08);stroke:rgb(var(--acr)/.7);stroke-width:2.2}
.fx-mover{position:absolute;left:0;top:0;width:12px;height:12px;border-radius:50%;background:rgb(var(--acr));offset-rotate:0deg;animation:fx-move 6s linear infinite}

/* renew — a turning arrow, one dot per year of validity */
.fx-rot-b{will-change:transform;animation:fx-spin 12s linear infinite}
.fx-yr{fill:rgb(var(--acr)/.2);animation:fx-yr calc(var(--n)*.8s) calc(var(--i)*.8s) infinite}
@keyframes fx-yr{0%{fill:rgb(var(--acr)/.2)}5%,60%{fill:rgb(var(--acr))}80%,100%{fill:rgb(var(--acr)/.2)}}

/* close — the ring closes, then a strike */
.fx-closing{fill:none;stroke:rgb(var(--acr)/.7);stroke-width:4;stroke-dasharray:1;stroke-dashoffset:1;transform:rotate(-90deg);animation:fx-draw 9s ease-in-out infinite}
.fx-strike{stroke:rgb(var(--acr));stroke-width:5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-strike 9s ease-in-out infinite}
@keyframes fx-strike{0%,42%{stroke-dashoffset:1;opacity:1}52%,82%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}

/* reply — the reply leaves as a paper plane */
.fx-trail{fill:none;stroke:rgb(var(--acr)/.45);stroke-width:1.8;stroke-dasharray:3 6}
.fx-env{fill:rgba(255,255,255,.7);stroke:rgb(var(--acr)/.6);stroke-width:2;stroke-linejoin:round}
.fx-plane{position:absolute;left:0;top:0;width:24px;height:16px;offset-rotate:auto 180deg;animation:fx-fly 6s cubic-bezier(.45,0,.3,1) infinite}
.fx-planep{fill:rgb(var(--acr))}
@keyframes fx-fly{0%{offset-distance:0%;opacity:0}8%{opacity:1}85%{opacity:1}100%{offset-distance:100%;opacity:0}}

/* refund — a milled coin turns backwards, arrows come home */
.fx-mill{stroke:rgb(var(--acr)/.6);stroke-width:2}
.fx-coin{fill:rgb(var(--acr)/.08);stroke:rgb(var(--acr)/.5);stroke-width:1.5}
.fx-rot-r{will-change:transform;animation:fx-spinr 30s linear infinite}
.fx-rot-r2{will-change:transform;animation:fx-spinr 9s linear infinite}

/* dispute — the beam tilts */
.fx-beam{transform-box:view-box;transform-origin:0 -46px;animation:fx-tilt 6s ease-in-out infinite}
@keyframes fx-tilt{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}

/* reconcile — the right column slides into line, links appear */
.fx-slide{will-change:transform;animation:fx-slide 8s ease-in-out infinite}
@keyframes fx-slide{0%,100%{transform:translateY(5.5%)}40%,70%{transform:translateY(0)}}
.fx-lk{stroke:rgba(19,136,8,.7);stroke-width:2;stroke-linecap:round}
.fx-link{opacity:0;animation:fx-link 8s ease-in-out infinite}
@keyframes fx-link{0%,38%{opacity:0}46%,68%{opacity:1}76%,100%{opacity:0}}

/* search — a lens roams the grid */
.fx-lens{position:absolute;left:0;top:0;width:60px;height:60px;offset-rotate:0deg;animation:fx-move 9s ease-in-out infinite}
.fx-lensc{fill:rgba(255,255,255,.55);stroke:rgb(var(--acr)/.8);stroke-width:3}
.fx-lensh{stroke:rgb(var(--acr)/.8);stroke-width:5;stroke-linecap:round}

/* draft — lines write, then the signature */
.fx-wr{stroke:rgba(10,19,43,.3);stroke-width:4;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-draw 9s calc(var(--i)*.35s) ease-in-out infinite}
.fx-sign{fill:none;stroke:rgba(27,58,138,.8);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-draw 9s 2.2s ease-in-out infinite}

/* loan / plan / setup / ongoing */
.fx-gauge{fill:none;stroke:rgb(var(--acr)/.7);stroke-width:8;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-draw 8s calc(var(--i)*.5s) ease-in-out infinite}
.fx-seg{fill:none;stroke:rgb(var(--acr)/.65);stroke-width:16;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-draw 9s calc(var(--i)*.4s) ease-in-out infinite}
.fx-trace{fill:none;stroke:rgb(var(--acr)/.7);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-draw 7s ease-in-out infinite}
.fx-month{fill:none;stroke:rgb(var(--acr));stroke-width:12;opacity:.15;animation:fx-mon 12s calc(var(--i)*1s) infinite}
@keyframes fx-mon{0%{opacity:.15}4%,70%{opacity:.85}85%,100%{opacity:.15}}


/* ── page-type emblems ── */
.fx-lcd{fill:rgb(var(--acr)/.1);stroke:rgb(var(--acr)/.45);stroke-width:1.5}
.fx-lcdv{stroke:rgb(var(--acr));stroke-width:5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-draw 5s ease-in-out infinite}
.fx-key{fill:rgba(10,19,43,.08);stroke:rgba(10,19,43,.2);stroke-width:1.2;animation:fx-key 5.4s calc(var(--i)*.6s) infinite}
@keyframes fx-key{0%,100%{fill:rgba(10,19,43,.08)}4%,14%{fill:rgb(var(--acr)/.7)}24%{fill:rgba(10,19,43,.08)}}
.fx-box{fill:rgba(255,255,255,.7);stroke:rgba(10,19,43,.3);stroke-width:1.6}
.fx-tick{fill:none;stroke:rgba(19,136,8,.9);stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-tick 8s calc(var(--i)*1.2s) ease-out infinite}
@keyframes fx-tick{0%{stroke-dashoffset:1;opacity:1}6%,70%{stroke-dashoffset:0;opacity:1}85%,100%{stroke-dashoffset:0;opacity:0}}
.fx-page{fill:rgba(255,255,255,.75);stroke:rgb(var(--acr)/.55);stroke-width:2;stroke-linejoin:round}
.fx-pagef{fill:#fff}
.fx-txt{fill:none;stroke:rgba(10,19,43,.22);stroke-width:3;stroke-linecap:round}
.fx-flip{will-change:transform;transform-origin:50% 50%;animation:fx-flip 7s cubic-bezier(.6,0,.3,1) infinite}
@keyframes fx-flip{0%,30%{transform:scaleX(1)}55%,85%{transform:scaleX(-1)}100%{transform:scaleX(-1);opacity:0}}
.fx-arwb{stroke:rgb(var(--acr));stroke-width:5}
.fx-drop{will-change:transform;animation:fx-drop 3.2s cubic-bezier(.5,0,.3,1) infinite}
@keyframes fx-drop{0%{transform:translateY(-14%);opacity:0}25%{opacity:1}70%{transform:translateY(6%);opacity:1}100%{transform:translateY(10%);opacity:0}}
.fx-bar{fill:rgb(var(--acr)/.7)}
.fx-fill{transform-origin:25.6% 50%;animation:fx-fillx 3.2s ease-in-out infinite}
@keyframes fx-fillx{0%,55%{transform:scaleX(0)}80%,100%{transform:scaleX(1)}}
.fx-shield{fill:rgb(var(--acr)/.07);stroke:rgb(var(--acr)/.75);stroke-width:3;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-draw 8s ease-in-out infinite}
.fx-tickb{fill:none;stroke:rgba(19,136,8,.9);stroke-width:6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:fx-draw 8s 1.6s ease-in-out infinite}
.fx-ripc{fill:none;stroke:rgb(var(--acr)/.6);stroke-width:2}
.fx-rip{transform-origin:50% 78.9%;animation:fx-rip 2.8s ease-out infinite}
.fx-rip2{animation-delay:1.4s}
@keyframes fx-rip{0%{transform:scale(.3);opacity:1}100%{transform:scale(1.4);opacity:0}}
.fx-pinb{fill:rgb(var(--acr)/.85)}.fx-pinh{fill:#fff}
.fx-bob{will-change:transform;animation:fx-bob 2.8s ease-in-out infinite}
@keyframes fx-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5%)}}
.fx-bub{fill:rgba(255,255,255,.85);stroke:rgba(10,19,43,.25);stroke-width:1.6;stroke-linejoin:round}
.fx-bub2{fill:rgb(var(--acr)/.14);stroke:rgb(var(--acr)/.6)}
.fx-b1{animation:fx-b1 7s ease-in-out infinite}.fx-b2{animation:fx-b2 7s ease-in-out infinite}
@keyframes fx-b1{0%{opacity:0;transform:translateY(6%)}8%,80%{opacity:1;transform:none}92%,100%{opacity:0}}
@keyframes fx-b2{0%,38%{opacity:0;transform:translateY(6%)}48%,80%{opacity:1;transform:none}92%,100%{opacity:0}}
.fx-ty{animation:fx-pulse 1.2s calc(var(--i)*.2s) ease-in-out infinite}
.fx-div{stroke:rgba(10,19,43,.18);stroke-width:2;stroke-dasharray:4 5}
.fx-base{stroke:rgba(10,19,43,.3);stroke-width:2;stroke-linecap:round}
.fx-barA{fill:rgba(10,19,43,.18)}.fx-barB{fill:rgb(var(--acr)/.65)}
.fx-cmpA,.fx-cmpB{transform-origin:50% 83.3%}
.fx-cmpA{animation:fx-cmpA 6s ease-in-out infinite}.fx-cmpB{animation:fx-cmpB 6s ease-in-out infinite}
@keyframes fx-cmpA{0%,100%{transform:scaleY(.45)}50%{transform:scaleY(.9)}}
@keyframes fx-cmpB{0%,100%{transform:scaleY(.95)}50%{transform:scaleY(.5)}}

/* dark heroes: keep the lace, soften the emblem card */
.fx-dark .fx-o{stroke:rgb(var(--acr)/.22)}
.fx-dark .fx-i{stroke:rgb(var(--acr)/.34)}
.fx-dark .fx-disc{fill:rgba(255,255,255,.06);stroke:rgba(255,255,255,.2)}
.fx-dark .fx-row,.fx-dark .fx-txt,.fx-dark .fx-old{stroke:rgba(255,255,255,.3)}
.fx-dark .fx-doc,.fx-dark .fx-box,.fx-dark .fx-bub,.fx-dark .fx-page{fill:rgba(255,255,255,.08);stroke:rgba(255,255,255,.3)}
.fx-dark .fx-key{fill:rgba(255,255,255,.08);stroke:rgba(255,255,255,.2)}
/* paused off-screen / hidden tab; still for reduced motion; gone in print */
.gs-hero.fx-off .fx-halo *,.gs-hero.fx-off .fx-emb *{animation-play-state:paused!important}
.gs-hero.fx-still .fx-halo *,.gs-hero.fx-still .fx-emb *{animation:none!important}
.gs-hero.fx-still .fx-rp{stroke-dashoffset:0}
.gs-hero.fx-still .fx-emb{display:none!important}
@media (prefers-reduced-motion:reduce){.fx-halo *{animation:none!important}.fx-rp{stroke-dashoffset:0!important}.fx-emb{display:none!important}}
@media (max-width:1024px){.fx-halo{opacity:.8}}
@media print{.fx-halo,.fx-emb{display:none!important}}