/* ================= v50: product-first fintech =================
   Loaded last. Bigger, more confident type; pictures that say what they are (art50.js) instead of symbols;
   a hero built like a product shot (cards, an applications panel, a notification); a bento of small product views. */
:root{--z50-ink:#0B0D12;--z50-text:#1D1F24;--z50-muted:#5D6370;--z50-line:#E7E9EE;--z50-soft:#F5F6F8;--z50-ok:#067647;--z50-okbg:#E3F6EC;--z50-rv:#B54708;--z50-rvbg:#FFF2E0;
  --z50-shadow:0 1px 1px rgba(16,24,40,.04),0 24px 48px -18px rgba(16,24,40,.22);--z50-card-shadow:0 2px 4px rgba(16,24,40,.12),0 14px 28px -10px rgba(16,24,40,.35)}

/* ---------- the art ---------- */
.zv{display:inline-block;flex:none;line-height:0;vertical-align:middle}
.zv svg{display:block;width:100%;height:100%;overflow:visible}
.zv-c{width:44px;height:28px;border-radius:5px}
.zv-c svg{filter:drop-shadow(0 1px 1.5px rgba(16,24,40,.18))}
.zv-d{width:36px;height:36px}
.zv-d svg{filter:drop-shadow(0 1px 1.5px rgba(16,24,40,.14))}
.zv-b{width:48px;height:48px}
.zv-fl{display:inline-flex;align-items:center;flex:none}
.zv-fl svg{width:28px;height:28px;border-radius:50%;box-shadow:0 0 0 2px #fff}
.zv-fl.many svg+svg{margin-left:-10px}
.zv-pp{display:inline-flex;flex:none}
.zv-pp i{position:relative;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font:600 10.5px/1 var(--font,-apple-system,BlinkMacSystemFont,sans-serif);font-style:normal;letter-spacing:-.01em;box-shadow:0 0 0 2px #fff}
.zv-pp i+i{margin-left:-9px}
.zv-pp i:nth-child(1){z-index:3}.zv-pp i:nth-child(2){z-index:2}.zv-pp i:nth-child(3){z-index:1}
.zv-pp i.more{background:#F2F2F7;color:#3A3A3C}
.z50-av{display:inline-flex;align-items:center;justify-content:center;flex:none}

/* ---------- type: larger and more confident ---------- */
body{color:var(--z50-text)}
#navlinks a{font-size:15px}
.nav .btn,.btn{font-size:15px}
.btn-brand{height:46px;padding-inline:22px}
.h42-t{font-size:clamp(46px,5.5vw,78px);line-height:1.0;font-weight:700;letter-spacing:-.047em;color:var(--z50-ink)}
.z49-intro{font-size:15px;font-weight:500;color:var(--z50-muted);margin-bottom:22px}
.h42-l{font-size:21px;line-height:1.5;color:#4A505C;max-width:30em;margin-top:24px}
.h42-cta{margin-top:34px}
.h42-cta .tlink{font-size:17px}
.h42-fine{font-size:14px;color:#6B717D;margin-top:20px}
.t2,.m41-t{font-size:clamp(36px,4.2vw,58px);line-height:1.03;font-weight:700;letter-spacing:-.045em;color:var(--z50-ink)}
.lede,.m41-l{font-size:19px;line-height:1.55;color:#4A505C}
.fine,.sv44-note,.fe42-fine,.b36-fine,.z49-example-note{font-size:13px;line-height:1.5}
.sv44-note{font-size:13px}

/* ---------- hero: a product shot ---------- */
.h42{padding:84px 0 96px}
.z49-hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);gap:56px}
.z50-art{position:relative;margin:0;padding:96px 0 64px 64px;min-width:0}
.z50-fan{position:absolute;left:0;top:0;width:300px;height:190px}
.z50-fan-c{position:absolute;width:268px;border-radius:15px}
.z50-fan-c .zv-c{width:100%;height:auto;aspect-ratio:160/101;border-radius:15px}
.z50-fan-c .zv-c svg{filter:none}
.z50-fan-c{box-shadow:var(--z50-card-shadow)}
.z50-fan-c.c1{left:0;top:26px;transform:rotate(-8deg);z-index:2;animation:z50in .9s cubic-bezier(.2,.8,.2,1) .15s both}
.z50-fan-c.c2{left:74px;top:0;transform:rotate(5deg);z-index:1;animation:z50in .9s cubic-bezier(.2,.8,.2,1) .05s both}
.z50-cn,.z50-cd{position:absolute;color:#fff;font-weight:600;letter-spacing:-.01em;text-shadow:0 1px 1px rgba(0,0,0,.15)}
.z50-cn{left:20px;top:18px;font-size:15px}
.z50-cd{right:18px;bottom:16px;font-size:13px;font-variant-numeric:tabular-nums;opacity:.9}
.z50-app{position:relative;z-index:3;background:#fff;border-radius:26px;box-shadow:0 0 0 1px rgba(16,24,40,.06),0 2px 4px rgba(16,24,40,.04),0 40px 80px -28px rgba(16,24,40,.32);padding:22px 22px 8px;animation:z50in .9s cubic-bezier(.2,.8,.2,1) .3s both}
.z50-app-h{display:flex;align-items:center;gap:12px}
.z50-app-h .z50-av .zv-fl svg,.z50-app-h>.zv-fl svg{width:38px;height:38px}
.z50-who{flex:1;min-width:0}
.z50-who b{display:block;font-size:18px;letter-spacing:-.02em;color:var(--z50-ink)}
.z50-who span{display:block;font-size:14px;color:var(--z50-muted);margin-top:1px}
.z50-prof{display:flex;align-items:center}
.z50-prof .zv-d{width:34px;height:34px}
.z50-prof .zv-d+.zv-d{margin-left:-12px}
.z50-prog{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:20px 0 6px;padding:14px 16px;border-radius:16px;background:var(--z50-soft)}
.z50-prog p{margin:0;display:flex;flex-direction:column}
.z50-prog b{font-size:15px;color:var(--z50-ink)}
.z50-prog span{font-size:13px;color:var(--z50-muted)}
.z50-seg{display:flex;gap:5px;width:132px;flex:none}
.z50-seg i{flex:1;height:7px;border-radius:4px;background:#E2E5EB}
.z50-seg i.ok{background:#17B26A}
.z50-seg i.rv{background:linear-gradient(90deg,#F79009 55%,#E2E5EB 55%)}
.z50-rows{list-style:none;margin:0;padding:0}
.z50-rows li{display:grid;grid-template-columns:62px minmax(0,1fr) auto;align-items:center;gap:14px;padding:14px 2px;border-top:1px solid #EEF0F3}
.z50-rows li:first-child{border-top:0}
.z50-rows .zv-c{width:62px;height:39px}
.z50-rows b{display:block;font-size:16px;letter-spacing:-.015em;color:var(--z50-ink)}
.z50-rows div span{display:block;font-size:14px;color:var(--z50-muted);margin-top:1px}
.z50-rows em,.z50-pill{font-style:normal;font-size:13px;font-weight:600;padding:5px 11px;border-radius:999px;white-space:nowrap}
.z50-rows em.ok{background:var(--z50-okbg);color:var(--z50-ok)}
.z50-rows em.rv{background:var(--z50-rvbg);color:var(--z50-rv)}
.z50-note{position:absolute;z-index:4;right:-22px;bottom:4px;width:min(340px,82%);display:flex;gap:12px;padding:13px 15px;border-radius:22px;background:rgba(250,250,252,.82);
  -webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);box-shadow:0 0 0 1px rgba(16,24,40,.06),0 18px 40px -12px rgba(16,24,40,.3);animation:z50note .8s cubic-bezier(.2,.9,.25,1.15) 1.1s both}
.z50-note-i{flex:none;width:40px;height:40px;border-radius:10px;background:#fff;box-shadow:0 0 0 1px rgba(16,24,40,.08);display:grid;place-items:center}
.z50-note-i img{width:26px;height:26px;object-fit:contain}
.z50-note>div{min-width:0}
.z50-note p{margin:0;font-size:14px;line-height:1.35}
.z50-note .h{display:flex;justify-content:space-between;font-size:13px;color:var(--z50-muted)}
.z50-note .h b{font-weight:600;color:var(--z50-muted);text-transform:uppercase;font-size:12px;letter-spacing:.02em}
.z50-note .t{font-weight:600;color:var(--z50-ink);margin-top:2px}
.z50-note .m{color:#3C4250}
.z50-art figcaption{position:absolute;left:64px;bottom:0;font-size:12px;color:#8A909B}
@keyframes z50in{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
@keyframes z50note{from{opacity:0;translate:0 18px;scale:.96}to{opacity:1;translate:0 0;scale:1}}
html.hero-played .z50-fan-c,html.hero-played .z50-app,html.hero-played .z50-note{animation:none}

/* ---------- film heading ---------- */
.z49-film-heading h2{font-size:clamp(26px,2.6vw,36px);letter-spacing:-.035em;font-weight:700}
.z49-film-heading p{font-size:16px}
.hv-chaps span{font-size:14px}

/* ---------- services: what the business does, what it needs ---------- */
.sv44-tabs button{font-size:15px;padding:10px 16px}
.sv44-stage{padding:32px;gap:28px 44px;border-radius:30px}
.sv44-biz{padding:28px;border-radius:22px}
.sv44-k{font-size:13px;font-weight:600;color:#6B717D;margin-bottom:18px}
.sv44-co b{font-size:26px;letter-spacing:-.03em;color:var(--z50-ink)}
.sv44-co span{font-size:15px}
.sv44-acts li,.sv44-acts li[data-on]{display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:14px;padding:15px 0;font-size:16px;line-height:1.4;color:#2B303A}
.sv44-acts li .z50-av{width:44px;justify-content:flex-start}
.sv44-acts li .zv-c{width:44px;height:28px}
.sv44-acts li .zv-fl svg{width:28px;height:28px;box-shadow:0 0 0 2px #F6F7F9}
.sv44-acts li .zv-fl.many svg+svg{margin-left:-12px}
.sv44-acts li .zv-pp i{width:24px;height:24px;font-size:9px;box-shadow:0 0 0 2px #F6F7F9}
.sv44-acts li .zv-pp i+i{margin-left:-10px}
.sv44-needs{padding-top:28px}
.sv44-n{padding:20px 0 22px}
.sv44-n .h{display:flex;align-items:center;gap:18px}
.sv44-n .h .zv-c{width:66px;height:42px}
.sv44-n .h b{font-size:20px;letter-spacing:-.025em;color:var(--z50-ink)}
.sv44-n .why,.sv44-n .lgs{margin-left:84px}
.sv44-n .why{font-size:16px;line-height:1.5;color:#4A505C;margin-top:4px;max-width:34em}
.sv44-n .lgs{margin-top:12px}
.sv44-list[data-n="4"] .sv44-n{padding:15px 0}
.sv44-list[data-n="4"] .sv44-n:first-child{padding-top:0}
.sv44-bar{padding-top:20px}
.sv44-prog{display:flex;align-items:center;gap:14px;font-size:15px;color:#3C4250}
.z50-mini{display:inline-flex}
.z50-mini .zv-c{width:40px;height:25px}
.z50-mini .zv-c+.zv-c{margin-left:-18px}
.sv44-open{font-size:15px;height:46px}

/* ---------- fees: the open account ---------- */
.z50-open{margin:0;padding:28px;border-radius:30px;background:var(--z50-soft);border:1px solid var(--z50-line)}
.z50-open-card{position:relative;border-radius:16px;box-shadow:var(--z50-card-shadow)}
.z50-open-card .zv-c{width:100%;height:auto;aspect-ratio:160/101;border-radius:16px}
.z50-open-card .zv-c svg{filter:none}
.z50-open-card .n{position:absolute;left:24px;top:22px;color:#fff;font-size:20px;font-weight:600;letter-spacing:-.02em}
.z50-open-card .d{position:absolute;right:22px;bottom:20px;color:#fff;font-size:15px;opacity:.9;font-variant-numeric:tabular-nums}
.z50-open-card em{position:absolute;right:18px;top:18px;font-style:normal;font-size:13px;font-weight:600;padding:5px 11px;border-radius:999px;background:#fff;color:var(--z50-ok)}
.z50-open dl{margin:22px 0 0}
.z50-open dl div{display:flex;justify-content:space-between;gap:16px;padding:13px 2px;border-top:1px solid var(--z50-line);font-size:15px}
.z50-open dt{color:var(--z50-muted)}
.z50-open dd{margin:0;font-weight:600;color:var(--z50-ink);text-align:right}
.z50-open dl .fee dd{font-size:17px}
.z50-open figcaption{margin-top:12px;font-size:12px;color:#8A909B}
.sf42-steps h3{font-size:19px;letter-spacing:-.02em}
.sf42-steps p{font-size:16px;line-height:1.5}

/* ---------- Zypa Flow board ---------- */
.flb-h b{font-size:20px}
.flb-h span{font-size:14px}
.flb-bal p{font-size:14px;gap:10px}
.flb-bal p .zv-c{width:36px;height:23px}
.flb-list li{grid-template-columns:40px 48px minmax(0,1fr) auto;gap:12px;padding:15px 2px}
.flb-list li .z50-av{width:48px;justify-content:flex-start}
.flb-list li .zv-c{width:40px;height:25px}
.flb-list li .zv-d{width:34px;height:34px}
.flb-list li .zv-fl svg{width:30px;height:30px}
.flb-list li .zv-fl.many svg+svg{margin-left:-12px}
.flb-list li .zv-pp i{width:26px;height:26px;font-size:9.5px}
.flb-list li .zv-pp i+i{margin-left:-12px}
.flb-list p{font-size:16px}
.flb-list .d{font-size:14px}
.flb-list u{font-size:13px}
.fl44-pts h3{font-size:19px}
.fl44-pts p{font-size:16px;line-height:1.5}
.fl44-opt .s{font-size:16px}

/* ---------- the cheapest route ---------- */
.fe42-r .who .zv-c{width:40px;height:25px;margin-right:4px}
.fe42-tabs button{font-size:15px}

/* ---------- a right set: a bento of small product views ---------- */
.z50-bento{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:48px}
.z50-b{display:flex;flex-direction:column;padding:22px 22px 26px;border-radius:28px;background:var(--z50-soft);border:1px solid #EDEEF2;min-width:0}
.z50-b h3{margin:22px 0 0;font-size:24px;letter-spacing:-.03em;color:var(--z50-ink)}
.z50-b>p{margin:6px 0 0;font-size:16px;line-height:1.5;color:#4A505C}
.z50-vig{height:178px;border-radius:18px;background:#fff;box-shadow:0 0 0 1px rgba(16,24,40,.05),0 10px 24px -14px rgba(16,24,40,.25);padding:16px;display:flex;flex-direction:column;justify-content:center;gap:12px;overflow:hidden}
.z50-vig b{color:var(--z50-ink)}
.b1 .bal,.b4 .pf{display:flex;align-items:center;gap:12px}
.b1 .bal .zv-c,.b4 .pf .zv-c{width:58px;height:37px}
.b1 .bal span,.b4 .pf span{display:block;font-size:13px;color:var(--z50-muted)}
.b1 .bal b{display:block;font-size:20px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.b4 .pf b{display:block;font-size:15px}
.b1 ul{list-style:none;margin:0;padding:0}
.b1 li{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid #EEF0F3;font-size:13px;color:#4A505C}
.b1 li b{font-weight:600;font-size:13px;white-space:nowrap}
.b2 .fx{display:flex;align-items:center;gap:8px}
.b2 .fx>div{flex:1;min-width:0;padding:10px;border-radius:14px;background:var(--z50-soft)}
.b2 .fx .zv-fl svg{width:26px;height:26px;box-shadow:0 0 0 2px var(--z50-soft)}
.b2 .fx span:not(.zv-fl){display:block;font-size:12px;color:var(--z50-muted);margin-top:8px}
.b2 .fx b{display:block;font-size:15px;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap}
.b2 .fx i{font-style:normal;color:#9AA0AB;font-size:16px}
.b2 .tag{margin:0;align-self:flex-start;font-size:12.5px;font-weight:600;padding:5px 10px;border-radius:999px;background:var(--z50-okbg);color:var(--z50-ok)}
.b3 .nt{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:14px;background:var(--z50-soft)}
.b3 .nt.n2{opacity:.7;transform:scale(.97);transform-origin:top center}
.b3 .nt .zv-fl svg{width:30px;height:30px;box-shadow:0 0 0 2px var(--z50-soft)}
.b3 .nt b{display:block;font-size:14px}
.b3 .nt div span{display:block;font-size:12px;color:var(--z50-muted);line-height:1.35}
.b4 .spark{width:100%;height:70px;display:block}
.m42-mission{font-size:19px}

/* ---------- questions ---------- */
.faq button,.faq summary{font-size:20px}

/* ---------- the end: where your company is based ---------- */
.z36.z50-end{background:#0B0D12!important;color:#fff;padding:112px 0 120px;text-align:center}
.z50-end .z36-t{color:#fff!important;font-size:clamp(38px,4.6vw,64px);font-weight:700;letter-spacing:-.045em;line-height:1.03}
.z50-end-l{margin:18px auto 0;max-width:34em;font-size:19px;line-height:1.5;color:rgba(255,255,255,.66)}
.z50-pick{list-style:none;margin:44px auto 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:12px;max-width:980px}
.z50-pick a{display:inline-flex;align-items:center;gap:12px;height:60px;padding:0 24px 0 14px;border-radius:999px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);color:#fff;font-size:17px;font-weight:500;text-decoration:none;transition:background .2s,box-shadow .2s,transform .2s}
.z50-pick a:hover{background:rgba(255,255,255,.16);box-shadow:inset 0 0 0 1px rgba(255,255,255,.28);transform:translateY(-1px)}
.z50-pick a:focus-visible{outline:2px solid #fff;outline-offset:3px}
.z50-pick .zv-fl svg{width:32px;height:32px;box-shadow:none}
.z50-dot{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#1E3A8A;color:#fff;font:700 9px/1 var(--font,-apple-system,sans-serif);font-style:normal;letter-spacing:.02em}
.z50-dot.g{background:rgba(255,255,255,.14)}
.z50-dot svg{width:18px;height:18px}

/* ---------- the Services page ---------- */
.z49-service-preview a .zv-c{width:52px;height:33px}
.z49-service-preview b{font-size:17px}
.z49-service-preview small{font-size:14px}
.sx45-steps .vis.docs2{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 8px;align-content:center}
.vis.docs2 span:not(.zv){display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.sx45-steps .vis.docs2 .zv-d{width:54px;height:54px}
.sx45-steps .vis.docs2 em{font-style:normal;font-size:12px;line-height:1.25;color:#4A505C}
.z49-applications .zv-c{width:46px;height:29px}
.sx45-c .im{width:auto;height:auto;margin:0 0 4px;background:none;box-shadow:none}
.sx45-c .im .zv-c{width:84px;height:53px}
.sx45-c h4{font-size:20px;letter-spacing:-.025em}
.sx45-c .d{font-size:16px;line-height:1.5}
.sx48-t .zv-b{width:56px;height:56px;margin-bottom:6px}
.sx48-t h3{font-size:20px;letter-spacing:-.025em}
.sx48-t p{font-size:16px;line-height:1.5}
.sx45-t{font-size:clamp(42px,5vw,72px);font-weight:700;letter-spacing:-.047em;line-height:1.0}
.sx45-l{font-size:20px;line-height:1.5}
.sx45-h{font-size:clamp(32px,3.6vw,48px);font-weight:700;letter-spacing:-.04em}
.sx45-sub{font-size:19px}
.sx45-steps h3{font-size:20px}
.sx45-steps p{font-size:16px;line-height:1.5}

/* ---------- smaller screens ---------- */
@media(max-width:1180px){
 .z50-art{padding:84px 0 60px 40px}
 .z50-fan-c{width:230px}
 .z50-note{right:-8px}
}
@media(max-width:1000px){
 .z49-hero-grid{grid-template-columns:1fr;gap:40px}
 .z50-art{max-width:620px;margin:0 auto;width:100%}
 .z50-bento{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:734px){
 .h42{padding:40px 0 64px}
 .h42-t{font-size:44px;letter-spacing:-.05em}
 .h42-l{font-size:18px}
 .t2,.m41-t{font-size:36px}
 .lede,.m41-l{font-size:17px}
 .z50-art{padding:70px 0 0 18px}
 .z50-fan-c{width:190px}
 .z50-fan-c.c2{left:56px}
 .z50-cn{font-size:12px;left:14px;top:13px}.z50-cd{font-size:11px;right:12px;bottom:11px}
 .z50-app{padding:16px 14px 4px;border-radius:22px}
 .z50-prof{display:none}
 .z50-prog{padding:12px}
 .z50-seg{width:84px}
 .z50-rows li{grid-template-columns:48px minmax(0,1fr) auto;gap:10px;padding:12px 0}
 .z50-rows .zv-c{width:48px;height:30px}
 .z50-rows b{font-size:15px}.z50-rows div span{font-size:13px}
 .z50-rows em{font-size:12px;padding:4px 9px}
 .z50-note{position:relative;right:auto;bottom:auto;width:auto;margin:-14px 6px 0 10px}
 .z50-art figcaption{position:static;margin:14px 0 0}
 .sv44-stage{padding:16px;border-radius:24px}
 .sv44-biz{padding:20px}
 .sv44-co b{font-size:22px}
 .sv44-acts li,.sv44-acts li[data-on]{font-size:15px;grid-template-columns:40px minmax(0,1fr);gap:12px}
 .sv44-n .h .zv-c{width:52px;height:33px}
 .sv44-n .h b{font-size:18px}
 .sv44-n .why,.sv44-n .lgs{margin-left:0}
 .sv44-n .why{font-size:15px}
 .sv44-prog{font-size:14px}
 .z50-open{padding:18px;border-radius:24px}
 .z50-open-card .n{font-size:16px;left:18px;top:16px}
 .flb-list li{grid-template-columns:34px 42px minmax(0,1fr);gap:4px 10px}
 .flb-list p{font-size:15px}
 .z50-bento{grid-template-columns:1fr;gap:12px;margin-top:32px}
 .z50-b{padding:18px 18px 22px;border-radius:24px}
 .z50-vig{height:auto;min-height:150px}
 .z36.z50-end{padding:80px 0 88px}
 .z50-end .z36-t{font-size:38px}
 .z50-end-l{font-size:17px}
 .z50-pick{flex-direction:column;align-items:stretch;gap:10px;margin-top:32px}
 .z50-pick a{height:56px;width:100%}
 .sx45-c .im .zv-c{width:72px;height:45px}
}
@media(prefers-reduced-motion:reduce){.z50-fan-c,.z50-app,.z50-note{animation:none!important}}

/* ---------- v50 second pass: proportions ---------- */
.z49-hero-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px}
.h42-t{font-size:clamp(44px,4.9vw,70px)}
.z50-art{padding-bottom:78px}
.z50-app{padding-bottom:14px}
.z50-note{bottom:0;right:-26px}
.z50-art figcaption{bottom:2px}
.sf42-head .lede{font-size:19px}
.fe42-r .how{font-size:16px;line-height:1.5}
.sf42-more a{font-size:16px}
.flb-list .zv-pp i:nth-child(3){display:none}
/* the bento: two by two, room for each small product view */
.z50-bento{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.z50-b{padding:24px 24px 30px;border-radius:30px}
.z50-b h3{font-size:28px;margin-top:26px}
.z50-b>p{font-size:17px}
.z50-vig{height:216px;padding:22px 24px;gap:16px;border-radius:20px}
.b1 .bal .zv-c,.b4 .pf .zv-c{width:72px;height:46px}
.b1 .bal span,.b4 .pf span{font-size:14px}
.b1 .bal b{font-size:30px;letter-spacing:-.03em}
.b1 li{font-size:15px;padding:11px 0}.b1 li b{font-size:15px}
.b2 .fx{gap:14px}
.b2 .fx>div{padding:16px 18px;border-radius:16px}
.b2 .fx .zv-fl svg{width:34px;height:34px}
.b2 .fx span:not(.zv-fl){font-size:13px;margin-top:12px}
.b2 .fx b{font-size:24px;letter-spacing:-.03em}
.b2 .fx i{font-size:22px}
.b2 .tag{font-size:13.5px;padding:6px 12px}
.b3 .nt{padding:14px 16px;gap:14px;border-radius:16px}
.b3 .nt .zv-fl svg{width:38px;height:38px}
.b3 .nt b{font-size:17px}
.b3 .nt div span{font-size:14px}
.b3 .nt.n2{transform:scale(.95);opacity:.65}
.b4 .pf b{font-size:18px}
.b4 .spark{height:92px}
/* the end: five places to start from */
.z50-pick{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;max-width:1120px;margin-top:52px}
.z50-pick a{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:28px;height:148px;padding:20px;border-radius:24px;text-align:left}
.z50-pick a b{font-size:18px;font-weight:600;letter-spacing:-.02em;line-height:1.25}
.z50-pick .zv-fl svg,.z50-dot{width:40px;height:40px}
.z50-dot{font-size:10.5px}
.z50-dot svg{width:22px;height:22px}
.z50-pick .go{position:absolute;right:18px;top:18px;font-style:normal;font-size:18px;color:rgba(255,255,255,.45);transition:color .2s,transform .2s}
.z50-pick a:hover .go{color:#fff;transform:translate(2px,-2px)}
@media(max-width:1000px){.z50-pick{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:734px){
 .z50-bento{grid-template-columns:1fr}
 .z50-vig{height:auto;min-height:170px;padding:16px}
 .b1 .bal b{font-size:24px}
 .b2 .fx b{font-size:18px}
 .b2 .fx>div{padding:12px}
 .b3 .nt b{font-size:15px}
 .z50-b h3{font-size:24px}
 .z50-pick{grid-template-columns:1fr 1fr;gap:10px}
 .z50-pick a{height:120px;padding:16px;gap:16px;width:auto}
 .z50-pick a b{font-size:16px}
 .z50-pick li:last-child{grid-column:1/-1}
 .z50-pick li:last-child a{height:auto;flex-direction:row;align-items:center;gap:12px}
}

/* ---------- the film (film.html, exported to video): documents, cards and flags in place of symbols ---------- */
.f48 .zv-c{width:2.2em;height:1.39em;border-radius:.22em}
.f48 .zv-c svg{filter:drop-shadow(0 .05em .12em rgba(0,0,0,.5))}
.f48 .zv-fl svg{width:1.2em;height:1.2em;box-shadow:0 0 0 .1em rgba(28,28,30,.96)}
.f48 .zv-fl.many svg+svg{margin-left:-.42em}
.f48 .f48-sheet .row .zv-d{width:1.8em;height:1.8em;margin:-.12em 0}
.f48 .f48-sheet .row .zv-d svg{filter:drop-shadow(0 .06em .14em rgba(0,0,0,.45))}
.f48 .f48-sheet .row+.row::before{left:3.05em}
.f48 .fm-stage.tall .f48-sheet .row .zv-d{width:1.35em;height:1.35em;margin:0}
.f48 .fm-stage.tall .f48-sheet .row+.row::before{left:2.45em}
.f48 .f46-pf .r .zsi{display:inline-flex;align-items:center;justify-content:center;min-width:1.7em}
.f48 .f46-pf .r .zsi .zv-fl svg{width:1em;height:1em}
.f48 .f46-pf .r .zsi .zv-fl.many svg+svg{margin-left:-.36em}
.f48 .f46-pf .r .zsi .zv-c{width:1.5em;height:.95em}
.f48 .fm-stage.tall .f46-pf .r .zsi .zv-fl svg{width:.84em;height:.84em}
.f48 .f45-pay .ev .zv-c{width:1.9em;height:1.2em}
.f48 .f46-need .zslot{width:2.2em;height:1.39em;border-radius:.22em;background:none!important;box-shadow:none!important}
.f48 .f46-need .zslot .zv-c{position:absolute;inset:0;width:100%;height:100%}
.f48 .zcr .zv-c{width:2.2em;height:1.39em;flex:none}
.f48 .tl41 .tl-who .zv-c{width:1.9em;height:1.2em;margin:-.1em .25em -.1em 0}
.f48 .f44-total .ux .zv-c,.f48 .f43-total .set em .zv-c{width:1.9em;height:1.2em;margin-right:.15em}
.f48 .f48-note .ni .zv-c{width:2.1em;height:1.33em;margin-top:.15em}
.f48 .f46-pf .r{grid-template-columns:1.9em 4.2em minmax(0,1fr)}
.f48 .f46-pf .r .zsi{justify-content:flex-start;min-width:0}
.f48 .f46-pf .r .zsi .zv-fl svg{width:.92em;height:.92em}
.f48 .f46-pf .r .zsi .zv-fl.many svg+svg{margin-left:-.4em}
.f48 .f46-pf .r .zsi .zv-c{width:1.45em;height:.92em}
.f48 .fm-stage.tall .f46-pf .r{grid-template-columns:1.75em 4.4em minmax(0,1fr)}
.f48 .fm-stage.tall .f46-pf .r .zsi .zv-fl svg{width:.82em;height:.82em}
.f48 .fm-stage.tall .f46-pf .r .zsi .zv-fl.many svg+svg{margin-left:-.36em}
.f48 .fm-stage.tall .f46-pf .r .zsi .zv-c{width:1.3em;height:.82em}
/* the hero caption sits under the scene, clear of the notification */
.z50-art{padding-bottom:104px}
.z50-art figcaption{left:64px;bottom:0;right:auto}
@media(max-width:1180px){.z50-art figcaption{left:40px}}
@media(max-width:734px){.z50-art{padding-bottom:0}.z50-art figcaption{position:static}}
/* (after the second pass) one column below 1000px */
@media(max-width:1000px){.z49-hero-grid{grid-template-columns:1fr;gap:40px}.z50-art{max-width:600px;margin:0 auto;width:100%}}
@media(max-width:734px){.z49-hero-grid{gap:28px}.z50-art{padding:64px 0 0 14px}.h42-t{font-size:44px}}
@media(max-width:734px){
 .b2 .fx{gap:8px}.b2 .fx b{font-size:16px}.b2 .fx>div{padding:12px 10px}
 .z50-pick li:last-child a{justify-content:flex-start}
 .z50-pick li:last-child .go{top:50%;margin-top:-.6em}
 .z50-note{margin-right:0}
}
/* Services, how it works: the six documents as a 3 × 2 grid of previews */
.sx45-steps .vis.docs2{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 6px;padding:16px 12px;align-content:center}
.sx45-steps .vis.docs2>span{display:flex;flex-direction:column;align-items:center;gap:6px;padding:0;border:0;width:auto;text-align:center}
.sx45-steps .vis.docs2 .zv-d{width:48px;height:48px}
.sx45-steps .vis.docs2 em{font-size:12px;line-height:1.25;text-align:center;color:#4A505C}
.sx45-steps .vis.docs2>span:last-child{border-bottom:0}
@media(min-width:735px){.z50-art figcaption{left:auto;right:-26px;bottom:-30px}}
@media(min-width:735px) and (max-width:1180px){.z50-art figcaption{right:-8px}}
/* Wallet cards (ui50.js ZC, used in the film): the face is the shared card art */
.zc.zc50{background:#1D2433!important;color:#fff!important;overflow:hidden}
.zc.zc50::after{display:none}
.zc50 .zc-art{position:absolute;inset:0;z-index:0}
.zc50 .zc-art .zv-c{width:100%;height:100%;border-radius:0}
.zc50 .zc-art .zv-c svg{filter:none}
.zc50>:not(.zc-art){z-index:1}
.zc50 .n{color:#fff;text-shadow:0 1px 1px rgba(0,0,0,.18)}
.zc50.zc-vault .n,.zc50.zc-other .n{color:#1D2433;text-shadow:none}
.zc50 .c,.zc50 .k{color:#fff}
.zc50 .zv .mk{display:none}

/* ================= v51 ================= */
/* ---------- logos: the same visual weight whatever their shape (--k from v51.js), and "and more" after every row ---------- */
.lgs{display:flex;flex-wrap:wrap;align-items:center}
.lgs .lg:not(.sq):not(.tx),.mq .lg:not(.sq):not(.tx){height:calc(var(--lh,17px) * var(--k,1));display:inline-flex;align-items:center}
.lgs .lg:not(.sq):not(.tx) img,.mq .lg:not(.sq):not(.tx) img{height:100%;width:auto;max-height:none;max-width:none;display:block}
.lgs .lg.sq img{width:calc(var(--lh,17px) * 1.1);height:calc(var(--lh,17px) * 1.1)}
.lgs .lg.sq em{font-size:calc(var(--lh,17px) * .78);font-style:normal;font-weight:600;color:#3C4250}
.mq{--lh:24px}
.lg-more{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:999px;background:#ECEEF2;color:#555C69;font-size:13px;font-weight:500;white-space:nowrap;filter:none;opacity:1}
.sv44-n .lgs{--lh:19px;gap:10px 20px;filter:none;opacity:1}
.sv44-n .lgs .lg{filter:grayscale(1);opacity:.72}

/* ---------- hero notification: the original Zypa logo as a proper app icon, overlapping the panel on purpose ---------- */
.z50-note-i.z51-app{width:42px;height:42px;border-radius:10.5px;background:linear-gradient(160deg,#17B48A 0%,#007F61 60%,#006650 100%);box-shadow:inset 0 0 0 .5px rgba(255,255,255,.28),0 1px 2px rgba(0,0,0,.14)}
.z50-note-i.z51-app img{width:28px;height:28px}
@media(min-width:735px){
 .z50-app{padding-bottom:40px}
 .z50-note{bottom:auto;top:calc(100% - 136px)}
 .z50-art figcaption{bottom:4px}
}

/* ---------- the Services page: a pill menu for the page, and what we set up as grouped rows ---------- */
.z49-page-nav{gap:4px;width:max-content;max-width:100%;margin-top:48px;padding:5px;border:0;border-radius:999px;background:#F1F2F5}
.z49-page-nav a{min-height:0;padding:10px 20px;border-radius:999px;font-size:15px;font-weight:500;color:#3C4250}
.z49-page-nav a:hover{background:#fff;color:var(--z50-ink);box-shadow:0 1px 2px rgba(16,24,40,.08)}
.sx45-groups{display:block}
.z51-g{margin-top:52px;scroll-margin-top:96px}
.z51-g:first-child{margin-top:8px}
.z51-gh h3{margin:0;font-size:30px;font-weight:700;letter-spacing:-.035em;color:var(--z50-ink)}
.z51-gh p{margin:6px 0 0;font-size:17px;line-height:1.5;color:var(--z50-muted)}
.z51-list{margin-top:20px;background:#fff;border:1px solid var(--z50-line);border-radius:24px;overflow:hidden;box-shadow:0 1px 2px rgba(16,24,40,.04)}
.z51-row{scroll-margin-top:96px}
.z51-row+.z51-row{border-top:1px solid #EEF0F3}
.z51-row summary{list-style:none;display:grid;grid-template-columns:76px minmax(0,1fr) minmax(0,1.1fr) 24px;align-items:center;gap:24px;padding:22px 26px;cursor:pointer;transition:background .2s}
.z51-row summary::-webkit-details-marker{display:none}
.z51-row summary:hover{background:#FAFAFB}
.z51-row summary:focus-visible{outline:2px solid #0071E3;outline-offset:-2px;border-radius:24px}
.z51-im .zv-c{width:76px;height:48px}
.z51-tx b{display:block;font-size:19px;letter-spacing:-.02em;color:var(--z50-ink)}
.z51-tx>span{display:block;margin-top:4px;font-size:15px;line-height:1.45;color:var(--z50-muted)}
.z51-side{display:flex;flex-direction:column;gap:8px;min-width:0}
.z51-ex{font-size:12px;font-weight:600;color:#8A909B}
.z51-side .lgs{--lh:17px;gap:10px 18px;margin:0;filter:none;opacity:1;min-height:0}
.z51-side .lgs .lg{filter:grayscale(1);opacity:.72}
.z51-aside{font-size:15px;color:#3C4250}
.z51-chev{display:grid;place-items:center}
.z51-chev svg{width:16px;height:16px;fill:none;stroke:#8A909B;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s}
.z51-row[open] .z51-chev svg{transform:rotate(180deg)}
.z51-what{padding:2px 26px 24px 126px}
.z51-what p{margin:0 0 6px;font-size:13px;font-weight:600;color:#8A909B}
.z51-what ul{margin:0 0 14px;padding:0;list-style:none}
.z51-what li{position:relative;padding:6px 0 6px 24px;font-size:16px;line-height:1.45;color:#2B303A}
.z51-what li::before{content:"";position:absolute;left:3px;top:12px;width:9px;height:5px;border-left:2px solid #8A909B;border-bottom:2px solid #8A909B;transform:rotate(-45deg)}
.sx45-note{font-size:13px;line-height:1.5;color:#6B717D;margin-top:24px;max-width:60em}
@media(max-width:900px){
 .z51-row summary{grid-template-columns:60px minmax(0,1fr) 20px;gap:12px 16px;padding:18px}
 .z51-im .zv-c{width:60px;height:38px}
 .z51-side{grid-row:2;grid-column:2/-1}
 .z51-chev{grid-row:1;grid-column:3}
 .z51-what{padding:0 18px 20px 94px}
}
@media(max-width:734px){
 .z49-page-nav{width:100%;overflow:auto;margin-top:32px}
 .z49-page-nav a{flex:none;padding:9px 14px;font-size:14px}
 .z51-gh h3{font-size:25px}
 .z51-gh p{font-size:15px}
 .z51-list{border-radius:20px}
 .z51-row summary{grid-template-columns:48px minmax(0,1fr) 18px;padding:16px}
 .z51-im .zv-c{width:48px;height:30px}
 .z51-tx b{font-size:17px}
 .z51-tx>span{font-size:14px}
 .z51-side{grid-column:1/-1}
 .z51-side .lgs{--lh:15px;gap:8px 14px}
 .z51-what{padding:0 16px 18px}
 .sv44-n .lgs{--lh:16px}
}
/* logos: one tone, so pale brand colours (yellow, light grey) don't fade out */
.lgs .lg img,.mq .lg img{filter:grayscale(1) brightness(.78) contrast(1.25)}
.z51-what .z51-more{--lh:17px;gap:10px 18px;margin:0 0 16px}
.z51-what .z51-more .lg{opacity:.72}
.lg img[src*="binance"],.lg img[src*="kalshi"]{filter:grayscale(1) brightness(.5) contrast(1.4)}

/* ================= v52 ================= */
/* ---------- hero: one Wallet stack of every account Zypa gets for the company ---------- */
.z52-hero{position:relative;margin:0 auto;width:100%;max-width:500px;padding-top:6px}
.z52-co{display:flex;align-items:center;gap:12px;margin:0 0 20px 2px}
.z52-co .zv-fl svg{width:40px;height:40px;box-shadow:none}
.z52-co b{display:block;font-size:17px;line-height:1.25;letter-spacing:-.02em;color:var(--z50-ink)}
.z52-co b+span{display:block;font-size:14px;line-height:1.35;color:var(--z50-muted)}
.z52-wallet{position:relative;--st:52px}
.z52-wallet::before{content:"";display:block;padding-top:calc(63.125% + 4 * var(--st))}
.z52-c{position:absolute;left:0;right:0;top:calc(var(--i) * var(--st));border-radius:18px;box-shadow:0 -10px 22px -14px rgba(16,24,40,.5);animation:z52in .8s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i) * 80ms + 120ms)}
.z52-c .zv-c{display:block;width:100%;height:auto;aspect-ratio:160/101;border-radius:18px}
.z52-c .zv-c svg{filter:none}
.z52-c .zv .mk{display:none}
.z52-c b{position:absolute;left:20px;top:0;height:var(--st);display:flex;align-items:center;color:#fff;font-size:15px;font-weight:600;letter-spacing:-.01em;text-shadow:0 1px 1px rgba(0,0,0,.14)}
.z52-c em{position:absolute;right:16px;top:calc((var(--st) - 24px) / 2);height:24px;display:flex;align-items:center;padding:0 10px;border-radius:999px;background:#fff;font-style:normal;font-size:12.5px;font-weight:600;line-height:1}
.z52-c em.ok{color:var(--z50-ok)}
.z52-c em.rv{color:var(--z50-rv)}
.z52-c em.ap{color:#3C4250;background:rgba(255,255,255,.88)}
.z52-c .d{position:absolute;right:20px;bottom:18px;color:#fff;font-size:14px;letter-spacing:.04em;opacity:.92;font-variant-numeric:tabular-nums}
.z52-c.front{box-shadow:0 -10px 22px -14px rgba(16,24,40,.5),0 34px 60px -26px rgba(16,24,40,.5)}
.z52-foot{display:flex;align-items:center;gap:14px;margin:24px 0 0 2px}
.z52-docs{display:flex;align-items:center;flex:none}
.z52-docs .zv-d{width:36px;height:36px}
.z52-docs .zv-d+.zv-d{margin-left:-13px}
.z52-foot b{display:block;font-size:15px;line-height:1.3;letter-spacing:-.01em;color:var(--z50-ink)}
.z52-foot b+span{display:block;font-size:13.5px;line-height:1.35;color:var(--z50-muted)}
.z52-note{position:absolute;z-index:6;top:-4px;right:-34px;width:300px;display:flex;gap:12px;padding:12px 14px;border-radius:20px;background:rgba(250,250,252,.84);
  -webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);box-shadow:0 0 0 1px rgba(16,24,40,.06),0 18px 40px -14px rgba(16,24,40,.32);animation:z52note .7s cubic-bezier(.2,.9,.25,1.12) 1.1s both}
.z52-app{flex:none;width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(160deg,#363B45 0%,#16191F 55%,#0B0D12 100%);box-shadow:inset 0 0 0 .5px rgba(255,255,255,.2),0 1px 2px rgba(0,0,0,.2)}
.z52-app img{width:26px;height:26px;display:block}
.z52-note>div{min-width:0}
.z52-note p{margin:0;font-size:13.5px;line-height:1.35}
.z52-note .h{display:flex;justify-content:space-between;align-items:baseline;color:var(--z50-muted)}
.z52-note .h b{font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--z50-muted)}
.z52-note .h span{font-size:12px}
.z52-note .t{font-weight:600;color:var(--z50-ink);margin-top:1px}
.z52-note .m{color:#3C4250}
.z52-hero figcaption{margin:14px 0 0 2px;font-size:12px;color:#8A909B}
@keyframes z52in{from{opacity:0;translate:0 26px}to{opacity:1;translate:0 0}}
@keyframes z52note{from{opacity:0;translate:0 -14px;scale:.97}to{opacity:1;translate:0 0;scale:1}}
html.hero-played .z52-c,html.hero-played .z52-note{animation:none}
@media(prefers-reduced-motion:reduce){.z52-c,.z52-note{animation:none!important}}
@media(max-width:1180px){.z52-note{right:-14px}}
@media(max-width:1000px){.z52-hero{max-width:480px}.z52-note{right:-24px}}
@media(max-width:734px){
 .z52-hero{display:flex;flex-direction:column;max-width:none;padding-top:0}
 .z52-note{order:-1;position:relative;top:auto;right:auto;width:auto;margin:0 0 18px}
 .z52-wallet{--st:42px}
 .z52-c,.z52-c .zv-c{border-radius:14px}
 .z52-c b{left:16px;font-size:13.5px}
 .z52-c em{right:12px;font-size:11.5px;height:22px;top:calc((var(--st) - 22px) / 2);padding:0 9px}
 .z52-c .d{right:16px;bottom:14px;font-size:12.5px}
 .z52-co{margin-bottom:16px}
}
/* hero, second pass: a calmer size, "Matched by Zypa" in the header, the notification on the front card's corner */
.z52-hero{max-width:468px}
.z52-wallet{--st:46px}
.z52-co{margin-bottom:18px}
.z52-cot{flex:1;min-width:0}
.z52-by{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 13px 0 5px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px #E6E8EE,0 1px 2px rgba(16,24,40,.05);font-size:13px;font-weight:600;color:var(--z50-ink);white-space:nowrap}
.z52-app.sm{width:24px;height:24px;border-radius:7px}
.z52-app.sm img{width:16px;height:16px}
.z52-note{top:auto;bottom:-52px;right:-36px;width:296px;animation-name:z52note2}
.z52-hero figcaption{margin-top:70px}
@keyframes z52note2{from{opacity:0;translate:0 14px;scale:.97}to{opacity:1;translate:0 0;scale:1}}
.z52-c .d{left:auto;right:20px;top:auto;bottom:auto;top:calc(var(--st) + 10px);font-size:12px;font-weight:600;letter-spacing:.08em;opacity:.85}
@media(max-width:1180px){.z52-note{right:-16px}}
@media(max-width:734px){
 .z52-wallet{--st:40px}
 .z52-note{order:0;position:relative;bottom:auto;right:auto;width:auto;margin:-26px 10px 0}
 .z52-hero figcaption{margin-top:14px}
 .z52-by{height:30px;font-size:12px;padding-right:10px}
 .z52-co .zv-fl svg{width:36px;height:36px}
 .z52-co b{font-size:16px}.z52-co b+span{font-size:13px}
}
@media(max-width:380px){.z52-by{display:none}}
.z52-c .d{top:auto;right:auto;left:20px;bottom:18px;font-size:14px;font-weight:500;letter-spacing:.1em;opacity:.9}
.z52-c .n{position:absolute;left:20px;bottom:40px;color:#fff;font-size:17px;font-weight:600;letter-spacing:-.01em;text-shadow:0 1px 1px rgba(0,0,0,.14)}
.z52-note{width:322px}
@media(max-width:734px){.z52-c .n{left:16px;bottom:32px;font-size:14px}.z52-c .d{left:16px;bottom:14px;font-size:12px}.z52-note{width:auto}}

/* ---------- v52 detail pass ---------- */
/* headings and intros never leave one word on its own line */
h1,h2,h3,.t2,.lede,.h42-l,.m41-l,.z50-end-l,.sx45-l,.sx45-sub,.z51-gh p{text-wrap:balance}
p,li,dd{text-wrap:pretty}
/* fees: the steps start level with the card; values never break mid-amount */
.sf42-grid{align-items:start}
.sf42-steps{margin-top:0}
.z50-open dd{white-space:nowrap}
.z50-open-card .d{right:22px;bottom:20px}
/* Zypa Flow: two people, both initials readable */
.flb-list li .zv-pp i+i{margin-left:-6px}
.flb-list li .zv-pp i{font-size:9px}
/* Who it's for: the eight drawings carry the same visual weight */
.sx48-t .zv-b svg{transform-origin:50% 60%}
.sx48-t .zv-biz-traders svg{transform:scale(.84)}
.sx48-t .zv-biz-agency svg{transform:scale(1.1)}
.sx48-t .zv-biz-startup svg{transform:scale(1.12)}
.sx48-t .zv-biz-crypto svg{transform:scale(1.05)}
.sx48-t .zv-biz-holding svg{transform:scale(.95)}
/* How it works: the step pictures grow with their content instead of clipping it */
.sx45-steps .vis{height:auto;min-height:258px}
.sx45-steps .vis.z49-applications{display:flex;flex-direction:column;justify-content:center;padding-top:16px;padding-bottom:16px}
/* the end: flags and badges keep their round shape */
.z50-pick .zv-fl,.z50-dot{flex:none}
.z50-pick a{height:auto;min-height:148px}
@media(max-width:734px){
 .z52-by{display:none}
 .z52-note{margin-top:-18px}
 .z52-c .n{bottom:50px}
 .z52-c .d{bottom:30px}
 .z50-pick a{min-height:120px}
 .sx45-steps .vis{min-height:0}
}
.flb-list li .zv-pp i+i{margin-left:-2px}

/* ---------- v52 fixes from the independent review ---------- */
/* Who it's for on phones: the drawing spans both lines, the text has the full width */
@media(max-width:734px){
 .sx48-t{grid-template-columns:44px minmax(0,1fr);gap:2px 14px;align-items:center}
 .sx48-t .zv-b{grid-row:1/3;width:44px;height:44px;margin:0;align-self:center}
 .sx48-t h3{font-size:17px;margin:0}
 .sx48-t p{font-size:14px;margin:2px 0 0}
}
/* tabs on phones: the same rounded track and white selected pill as on desktop, scrolling sideways with a fade */
@media(max-width:734px){
 .sv44-tabs.seg,.fe42 .seg,.fe43 .seg{display:flex;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;width:auto;max-width:100%;margin:28px 0 0;padding:4px;gap:2px;border-radius:999px;background:#E9EBEF;scrollbar-width:none;
  -webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent)}
 .sv44-tabs.seg::-webkit-scrollbar,.fe42 .seg::-webkit-scrollbar{display:none}
 .sv44-tabs.seg button,.fe42 .seg button,.fe43 .seg button{flex:none;height:38px;padding:0 15px;font-size:14px;background:none;color:#555C69;box-shadow:none}
 .sv44-tabs.seg button[aria-selected="true"],.fe42 .seg button[aria-selected="true"],.fe43 .seg button[aria-selected="true"]{background:#fff;color:var(--z50-ink);box-shadow:0 1px 2px rgba(0,0,0,.08),0 2px 8px -2px rgba(0,0,0,.08)}
}
/* How it works: the three pictures share one height, so the three headings line up */
@media(min-width:735px){.sx45-steps .vis{min-height:300px}}
@media(max-width:734px){.sx45-steps .vis.docs2{gap:16px 2px;padding:16px 6px}.sx45-steps .vis.docs2 em{font-size:11.5px}}
/* Zypa Flow: one width for the board, the four points and the two offers; offers end on the same line */
.fl44-pts{max-width:980px;margin-left:auto;margin-right:auto}
.fl44-opt .s{margin-bottom:24px}
.fl44-opt .tlink,.fl44-opt .btn{margin-top:auto}
.fl44-opt .tlink{min-height:46px;display:inline-flex;align-items:center}
.flb-list li .z50-av{justify-content:center}
/* pricing: the price captions take two lines everywhere, so the lists below start level */
@media(min-width:735px){.pp42-plan .per{min-height:2.9em}}
/* the end: tiles of one height */
.z50-pick a{height:148px;min-height:0;gap:20px}
@media(max-width:734px){
 .z50-pick a{height:128px;gap:14px}
 .z50-pick li:last-child a{height:auto;padding:16px 18px}
 .z52-hero figcaption{margin-top:20px}
 .sv44-n .lgs{--lh:15px;gap:8px 12px}
}
/* home services: the business panel ends with its content */
.sv44-biz{align-self:start}
/* small text: never below 12px, and darker on tinted backgrounds */
.hv-note{font-size:12px}
.hv-chaps span{font-size:13px}
@media(max-width:1000px){.hv-chaps span{font-size:12.5px}.h42{padding-top:56px}}
.w42-note,.fl44-fine,.sv44-note,.fe42-fine,.b36-fine{color:#5D6370}
.b36-fine{color:rgba(255,255,255,.6)}
/* Services menu: four equal columns */
.fly46 .fly-in{grid-template-columns:repeat(4,minmax(0,1fr))}
.fl44-opt .tlink{display:inline-block;min-height:0;height:46px;line-height:46px}
.pp42-l,.pa42-l,.sx45-l,.z49-film-heading p{text-wrap:balance}

/* ================= v53: Amboras-style structure (bordered grids, comparison table, numbered steps, split, footer) ================= */
.z53-k{margin:0 0 14px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#6B717D}
.z53-head{max-width:780px;margin-bottom:44px}
.z53-head .lede{margin-top:16px}
section.z53-set,section.z53-vs,section.z53-steps{padding:112px 0}
/* a grid of cells divided by hairlines */
.z53-grid{display:grid;gap:1px;margin:0;padding:0;list-style:none;background:var(--z50-line);border:1px solid var(--z50-line);border-radius:22px;overflow:hidden}
.z53-g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.z53-grid>*{background:#fff;padding:30px 30px 32px;min-width:0}
.z53-grid h3{margin:20px 0 6px;font-size:18px;line-height:1.3;letter-spacing:-.02em;color:var(--z50-ink)}
.z53-grid p{margin:0;font-size:15.5px;line-height:1.55;color:var(--z50-muted)}
.z53-set .z53-grid .zv-c{width:68px;height:43px}
.z53-row{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:28px}
.z53-row p{margin:0;font-size:16px;line-height:1.5;color:#3C4250;max-width:40em}
.z53-btns{display:inline-flex;align-items:center;gap:22px;flex:none}
/* on your own, or with Zypa */
.z53-tbl{width:100%;border-collapse:collapse;font-size:15.5px;line-height:1.5}
.z53-tbl th,.z53-tbl td{padding:20px 22px;text-align:left;vertical-align:top;border-top:1px solid var(--z50-line)}
.z53-tbl thead th{padding-top:0;padding-bottom:14px;border-top:0;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#6B717D}
.z53-tbl tbody th{width:26%;font-weight:600;color:var(--z50-ink)}
.z53-tbl td{color:#6B717D;width:37%}
.z53-tbl td+td{color:var(--z50-ink);background:#F7F8FA}
.z53-tbl thead th:last-child{background:#F7F8FA;border-radius:14px 14px 0 0;padding-top:14px}
.z53-tbl tbody tr:last-child td+td{border-radius:0 0 14px 14px}
.z53-tbl tbody tr:last-child th,.z53-tbl tbody tr:last-child td{border-bottom:1px solid var(--z50-line)}
.z53-us{display:inline-flex;align-items:center;gap:8px;color:var(--z50-ink)}
.z53-us img{width:18px;height:18px}
.z53-fine{margin-top:18px}
/* how it works: dark, numbered */
.z53-steps{background:#0B0D12;color:#fff}
.z53-steps .t2{color:#fff}
.z53-steps .lede{color:rgba(255,255,255,.66)}
.z53-steps .z53-k{color:rgba(255,255,255,.5)}
.z53-steps .z53-grid{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.1)}
.z53-steps .z53-grid>*{background:#0B0D12}
.z53-n .k{display:flex;align-items:baseline;gap:10px;margin:0;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.z53-n .k span{color:#fff;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.z53-steps .z53-grid h3{margin-top:18px;color:#fff}
.z53-steps .z53-grid p:not(.k){color:rgba(255,255,255,.62)}
.z53-steps .z53-row p{color:rgba(255,255,255,.75)}
.z53-steps .z53-row b{color:#fff}
.z53-steps .tlink{color:#fff}
/* Zypa Flow: the button that matters */
.z53-cta{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:28px}
/* nav: a badge next to Zypa Flow */
.z53-flow-l{display:inline-flex!important;align-items:center;gap:7px}
.z53-badge{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:999px;background:#E5F4EC;color:#067647;font-size:11.5px;font-weight:600;letter-spacing:0;white-space:nowrap}
/* send it once: text beside a desk photograph with our real list on it */
.z53-split{padding:0;background:#F3EEE6}
.z53-sp{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);min-height:640px}
.z53-sp-t{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:96px 64px 96px max(32px,calc((100vw - 1240px)/2 + 32px))}
.z53-sp-t p:not(.z53-k){margin:16px 0 0;max-width:30em;font-size:17px;line-height:1.6;color:#4A4640}
.z53-sp-t .btn{margin-top:30px}
.z53-sp-v{position:relative;overflow:hidden;background:#D9D0C3}
.z53-sp-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.z53-sheet{position:absolute;right:max(32px,calc((100vw - 1240px)/2 + 32px));top:50%;transform:translateY(-50%);width:min(400px,80%);padding:18px 16px 10px;border-radius:24px;background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:blur(24px) saturate(160%);backdrop-filter:blur(24px) saturate(160%);box-shadow:0 0 0 1px rgba(16,24,40,.05),0 30px 60px -20px rgba(40,30,20,.35)}
.z53-sheet .h{margin:0 6px 10px;font-size:17px;font-weight:700;letter-spacing:-.02em;color:var(--z50-ink)}
.z53-sheet ul{margin:0;padding:0;list-style:none}
.z53-sheet li{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 6px;border-top:1px solid rgba(16,24,40,.07)}
.z53-sheet .zv-d{width:40px;height:40px}
.z53-sheet b{display:block;font-size:14.5px;line-height:1.3;color:var(--z50-ink)}
.z53-sheet li>span:nth-child(2)>span{display:block;font-size:12.5px;line-height:1.35;color:var(--z50-muted)}
.z53-sheet em{font-style:normal;font-size:12px;font-weight:600;padding:4px 9px;border-radius:999px;background:var(--z50-okbg);color:var(--z50-ok)}
/* questions: centred, narrower */
.q31 .faq-grid{display:block;max-width:860px;margin:0 auto}
.q31 .faq-grid>h2{text-align:center;margin-bottom:36px}
/* footer: dark, brand and mission, three columns */
.z53-ft{background:#0B0D12;color:#fff;border-top:1px solid rgba(255,255,255,.08);padding:72px 0 36px}
.z53-ft-top{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:40px}
.z53-ft .logo{display:inline-flex;align-items:center;gap:10px;color:#fff;font-weight:600;font-size:18px;text-decoration:none}
.z53-ft .logo img{width:26px;height:26px}
.z53-ft-tag{margin:22px 0 0;font-size:30px;line-height:1.15;font-weight:600;letter-spacing:-.03em}
.z53-ft-m{margin:16px 0 0;max-width:24em;font-size:14px;line-height:1.55;color:rgba(255,255,255,.55)}
.z53-ft-col{display:flex;flex-direction:column;gap:12px}
.z53-ft-col p{margin:0 0 6px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.45)}
.z53-ft-col a{font-size:15px;color:rgba(255,255,255,.78);text-decoration:none}
.z53-ft-col a:hover{color:#fff}
.z53-ft-b{margin-top:56px;padding-top:24px;border-top:1px solid rgba(255,255,255,.1);font-size:13px;line-height:1.5;color:rgba(255,255,255,.5)}
@media(max-width:1000px){
 .z53-g3{grid-template-columns:repeat(2,minmax(0,1fr))}
 .z53-sp{grid-template-columns:1fr}
 .z53-sp-t{padding:72px 32px 40px}
 .z53-sp-v{min-height:520px}
 .z53-sheet{right:50%;transform:translate(50%,-50%)}
 .z53-ft-top{grid-template-columns:1fr 1fr}
 .z53-ft-brand{grid-column:1/-1}
}
@media(max-width:734px){
 section.z53-set,section.z53-vs,section.z53-steps{padding:72px 0}
 .z53-head{margin-bottom:28px}
 .z53-g3{grid-template-columns:1fr}
 .z53-grid{border-radius:18px}
 .z53-grid>*{padding:22px 20px 24px}
 .z53-row{flex-direction:column;align-items:flex-start}
 .z53-btns{flex-direction:row-reverse}
 .z53-tbl thead{display:none}
 .z53-tbl,.z53-tbl tbody,.z53-tbl tr,.z53-tbl th,.z53-tbl td{display:block;width:auto}
 .z53-tbl tr{padding:16px 0;border-top:1px solid var(--z50-line)}
 .z53-tbl tbody th,.z53-tbl td{border:0;padding:0}
 .z53-tbl tbody th{font-size:16px;margin-bottom:8px}
 .z53-tbl td{font-size:14.5px;padding:8px 12px;border-radius:12px}
 .z53-tbl td::before{display:block;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#8A909B;margin-bottom:2px}
 .z53-tbl td:nth-of-type(1)::before{content:"On your own"}
 .z53-tbl td:nth-of-type(2)::before{content:"With Zypa"}
 .z53-tbl td+td{margin-top:6px}
 .z53-tbl tbody tr:last-child td+td{border-radius:12px}
 .z53-tbl tbody tr:last-child th,.z53-tbl tbody tr:last-child td{border-bottom:0}
 .z53-sp-t{padding:64px 20px 32px}
 .z53-sp-v{min-height:470px}
 .z53-sheet{width:calc(100% - 32px);padding:14px 10px 6px}
 .z53-sheet li{grid-template-columns:34px minmax(0,1fr) auto;gap:10px;padding:9px 4px}
 .z53-sheet .zv-d{width:34px;height:34px}
 .z53-ft{padding:56px 0 32px}
 .z53-ft-top{grid-template-columns:1fr 1fr;gap:32px 20px}
 .z53-ft-tag{font-size:26px}
 .z53-cta{flex-direction:column;gap:14px}
}
.sx48-t .zv-b svg{transform:none!important}
@media(max-width:734px){.z53-tbl tbody th,.z53-tbl td{width:auto}}

/* ---------- v53 fixes from the independent review ---------- */
/* comparison table: one baseline for the three headers; the "With Zypa" column a touch stronger */
.z53-tbl thead th{padding-top:14px}
.z53-tbl td+td,.z53-tbl thead th:last-child{background:#F2F4F7}
/* split: the photo framed so the cup stays clear of the card; stronger "Received" pills */
.z53-sp-img{object-position:left center}
.z53-sheet{background:rgba(255,255,255,.9)}
.z53-sheet em{background:#D9F2E3;color:#05603A}
.z53-sp-t p,.z53-grid p,.z53-row p{text-wrap:pretty}
@media(max-width:734px){
 .z53-sp-v{min-height:600px}
 .z53-sp-img{object-position:30% center}
 .z53-sheet{top:auto;bottom:20px;transform:none;right:16px;left:16px;width:auto}
}
@media(min-width:735px) and (max-width:1000px){.z53-sheet{top:auto;bottom:32px;transform:translateX(50%)}}
/* contrast on dark and tinted backgrounds */
.z53-steps .z53-grid p:not(.k){color:rgba(255,255,255,.74)}
.z53-n .k,.z53-steps .z53-k{color:rgba(255,255,255,.62)}
.z53-steps .lede{color:rgba(255,255,255,.74)}
.z53-steps .z53-row p{text-wrap:balance}
.z53-ft-m{color:rgba(255,255,255,.66)}
.z53-ft-b{color:rgba(255,255,255,.6)}
.z53-ft-col p{color:rgba(255,255,255,.55)}
.fl44-pts p{color:#4A505C}
.z52-hero figcaption{color:#6B717D}
.fly46 .fly-g{font-size:12px;color:#6B717D}
/* nav badge: a little more room */
.z53-flow-l{gap:9px}
/* phones: "and more" stays on the logo row; FAQ questions and footer links wrap cleanly */
@media(max-width:734px){
 .sv44-n .lgs{gap:8px 10px}
 .sv44-n .lgs .lg-more{height:22px;padding:0 8px;font-size:12px}
 .z53-ft-col a{font-size:14px}
}
.faq summary,.faq button{text-wrap:balance}
@media(max-width:734px){.sv44-n .lgs .lg:nth-child(3){display:none}}

/* ================= v55: 3D objects, a hero that tilts, a live 3D close ================= */
.zv3{display:block;height:auto;object-fit:contain;-webkit-user-drag:none;user-select:none}
/* home: the right set, each account as its object */
.z53-set .z53-grid article{display:flex;flex-direction:column;padding-top:18px}
.z53-set .z54-o{width:100%;max-width:300px;aspect-ratio:4/3;margin:0 auto 4px;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.z53-set .z53-grid article:hover .z54-o{transform:translateY(-6px) scale(1.025)}
.z53-set .z53-grid h3{margin-top:6px}
/* Services: the four groups, the rows and who it's for */
.z49-service-preview a .zv3{width:84px;height:63px;margin:-6px 0}
.z51-im .zv3{width:104px;height:78px;margin:-12px 0}
.z51-row summary{grid-template-columns:104px minmax(0,1fr) minmax(0,1.1fr) 24px}
.z51-what{padding-left:154px}
.sx48-t .zv3{width:132px;height:99px;margin:-8px 0 2px -10px;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.sx48-t:hover .zv3{transform:translateY(-5px) scale(1.03)}
@media(max-width:900px){.z51-row summary{grid-template-columns:84px minmax(0,1fr) 20px}.z51-im .zv3{width:84px;height:63px}.z51-what{padding-left:118px}}
@media(max-width:734px){
 .z51-row summary{grid-template-columns:64px minmax(0,1fr) 18px}.z51-im .zv3{width:64px;height:48px;margin:-6px 0}.z51-what{padding-left:16px}
 .sx48-t{grid-template-columns:72px minmax(0,1fr)}.sx48-t .zv3{grid-row:1/3;width:72px;height:54px;margin:0}
 .z49-service-preview a .zv3{width:64px;height:48px}
}
/* the hero: the cards lean towards the pointer, with a soft light where it is */
.z52-hero{perspective:1400px}
.z52-wallet{transform-style:preserve-3d;will-change:transform}
.z52-wallet::after{content:"";position:absolute;left:0;right:0;top:0;bottom:0;border-radius:18px;pointer-events:none;z-index:5;opacity:0;transition:opacity .4s;
  background:radial-gradient(520px circle at var(--lx,30%) var(--ly,20%),rgba(255,255,255,.22),rgba(255,255,255,0) 60%)}
.z52-hero:hover .z52-wallet::after{opacity:1}
.z52-c{transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.z52-c:not(.front):hover{transform:translateY(-10px)}
/* the end: the live 3D scene sits behind the content */
.z36.z50-end{position:relative;overflow:hidden}
.z50-end>.wrap{position:relative;z-index:1}
.z54-live{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:0;transition:opacity 1.2s ease}
.z54-live.on{opacity:1}

/* ---------- v55 Pricing: bordered plans with their objects, a dark Flow band, the quote as a grid ---------- */
.pp42-head .z53-k{margin-bottom:16px}
.pp42-plans.z54-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin-top:56px;background:var(--z50-line);border:1px solid var(--z50-line);border-radius:24px;overflow:hidden}
.pp42-plans.z54-plans>.pp42-plan{display:flex;flex-direction:column;margin:0;padding:24px 30px 32px;border:0;border-radius:0;box-shadow:none;background:#fff}
.pp42-plans.z54-plans>.pp42-plan.main{background:#F7F8FA}
.pp42-plans.z54-plans .z54-po{width:100%;max-width:280px;aspect-ratio:4/3;margin:0 auto 8px}
.pp42-plans.z54-plans .pp42-plan h2{margin-top:4px}
.pp42-plans.z54-plans .pp42-plan .btn{margin-top:auto;align-self:flex-start}
.pp42-plans.z54-plans .pp42-plan ul{margin-bottom:28px}
.z54-flowband{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:center;gap:32px;margin-top:28px;padding:44px 52px;border-radius:28px;background:#0B0D12;color:#fff}
.z54-flowband .t p:not(.n){color:rgba(255,255,255,.74);max-width:34em}
.z54-flowband .n{color:rgba(255,255,255,.6)}
.z54-flowband h2{color:#fff}
.z54-flowband .btn{margin-top:24px}
.z54-flowband .z54-fo{width:100%;max-width:380px;aspect-ratio:4/3;justify-self:center}
.pp42-what{margin-top:104px}
.pp42-what>.z53-k{text-align:left}
.pp42-f.z54-g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin-top:28px}
.pp42-f.z54-g4>div{background:#fff;padding:26px 26px 30px}
.pp42-f.z54-g4 .k{margin:0 0 12px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#6B717D}
.pp42-f.z54-g4 h3{font-size:18px;letter-spacing:-.02em}
.pp42-f.z54-g4 p:not(.k){font-size:15.5px;line-height:1.55;color:var(--z50-muted)}
.pp42-cta.z53-row{margin-top:40px;padding-top:28px;border-top:1px solid var(--z50-line)}
.pp42-cta.z53-row p{max-width:44em;font-size:15px}
/* ---------- v55 Partners: a two-column hero with its object, the two ways as a grid, who we work with as cells ---------- */
.z54-pa .pa42-head.z54-pah{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);align-items:center;gap:48px;max-width:none;margin:0;text-align:left}
.z54-pah .pa42-l{margin-left:0;margin-right:0;max-width:34em}
.z54-pah .btn{margin-top:28px}
.z54-pah .z54-ho{width:100%;max-width:560px;aspect-ratio:4/3;justify-self:center}
.z54-sec{margin-top:104px}
.pa42-two.z54-g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:0}
.pa42-two.z54-g2>.pa42-m{display:flex;flex-direction:column;margin:0;padding:24px 34px 34px;border:0;border-radius:0;box-shadow:none;background:#fff}
.pa42-two.z54-g2 .z54-po{width:100%;max-width:300px;aspect-ratio:4/3;margin:0 auto 6px}
.pa42-two.z54-g2 .tlink{margin-top:auto;padding-top:16px}
.z54-who{margin-top:0}
.z54-who li{list-style:none}
.z54-who h3{margin:0 0 6px}
.pa42-cta{margin-top:96px}
@media(max-width:1000px){
 .pp42-plans.z54-plans{grid-template-columns:1fr}
 .z54-flowband{grid-template-columns:1fr;padding:36px 32px}
 .pp42-f.z54-g4{grid-template-columns:repeat(2,minmax(0,1fr))}
 .z54-pa .pa42-head.z54-pah{grid-template-columns:1fr;gap:16px}
 .z54-pah .z54-ho{max-width:440px}
}
@media(max-width:734px){
 .pp42-plans.z54-plans{border-radius:20px;margin-top:36px}
 .pp42-plans.z54-plans>.pp42-plan{padding:18px 20px 26px}
 .pp42-plans.z54-plans .z54-po{max-width:220px}
 .z54-flowband{padding:28px 22px;border-radius:22px}
 .z54-flowband .z54-fo{max-width:260px}
 .pp42-what{margin-top:72px}
 .pp42-f.z54-g4{grid-template-columns:1fr}
 .pa42-two.z54-g2{grid-template-columns:1fr}
 .pa42-two.z54-g2>.pa42-m{padding:20px 20px 26px}
 .z54-sec{margin-top:72px}
 .pa42-cta{margin-top:64px}
}
/* one content width for every block on Pricing and Partners (as on the home page) */
.z54-pp .pp42-plans,.z54-pp .pp44-flow,.z54-pp .pp42-what,.z54-pp .pp42-cta,.z54-pa .pa42-two,.z54-pa .pa42-cta{max-width:none;margin-left:0;margin-right:0}
.z54-pp .pp42-what>h2{text-align:left}

/* ---------- v55 review fixes (11 Oct) ---------- */
/* tight display tracking squeezes the space after a comma ("Questions, answered."): give words a little room back */
h1,h2,.h42-t,.t2,.m41-t{word-spacing:.06em}
/* phone hero: three lines, never "needs." alone */
@media(max-width:734px){.h42-t{font-size:clamp(34px,10vw,44px)}}
/* Pricing: the three plans share their rows, so descriptions, prices and lists line up across columns */
@media(min-width:735px){
 .pp42-plans.z54-plans{grid-template-rows:repeat(7,auto);row-gap:0}
 .pp42-plans.z54-plans>.pp42-plan{display:grid;grid-row:span 7;grid-template-rows:subgrid;row-gap:0}
 .pp42-plans.z54-plans .pp42-plan .for,.pp42-plans.z54-plans .pp42-plan .per{min-height:0}
 .pp42-plans.z54-plans .pp42-plan .btn{align-self:end;justify-self:start}
}
.z54-pp .z54-flowband{margin-top:clamp(48px,6vw,80px)}
/* Partners: the briefcase supports the words, it doesn't lead */
.z54-pah .z54-ho{max-width:400px}
@media(max-width:734px){.z54-pah .z54-ho{max-width:290px}}
/* Services, Who it's for: tiles in a row share their rows, so a two-line title ("Agencies and consultancies")
   doesn't push its own text below its neighbours' */
@media(min-width:735px){
 .sx48-who{row-gap:0}
 .sx48-who>.sx48-t{display:grid;grid-row:span 3;grid-template-rows:subgrid;row-gap:0;margin-bottom:16px;align-content:start}
 .sx48-who>.sx48-t>h3{align-self:end}
}

/* ===================== v55 (11 Oct): Zypa Flow gets its own page; the free-setup offer stands out ===================== */
/* the offer badge: warm gold (green stays for actions and success), a gift, a slow sheen */
.z55-badge{position:relative;display:inline-flex;align-items:center;gap:5px;padding:4px 9px 4px 7px;border-radius:999px;font-size:12px;line-height:1;font-weight:650;letter-spacing:0;color:#4A3200;background:linear-gradient(135deg,#FFE9A6 0%,#FFCB4F 100%);box-shadow:inset 0 0 0 1px rgba(190,130,0,.25),0 6px 14px -8px rgba(214,150,0,.75);overflow:hidden;white-space:nowrap;vertical-align:1px;text-transform:none}
.z55-badge svg{flex:none;width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}
.z55-badge::after{content:"";position:absolute;inset:-2px;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.9) 50%,transparent 65%);transform:translateX(-130%);animation:z55sheen1 1.2s cubic-bezier(.4,0,.2,1) 1.6s 2 both;pointer-events:none}
@keyframes z55sheen1{from{transform:translateX(-130%)}to{transform:translateX(130%)}}
@keyframes z55sheen{0%,74%{transform:translateX(-130%)}100%{transform:translateX(130%)}}
@media (prefers-reduced-motion:reduce){.z55-badge::after{animation:none;display:none}}
/* nav: the Flow link and a small card that says what the badge means */
.z53-flow-l{position:relative}
.z55-fly{position:absolute;top:calc(100% + 18px);left:50%;width:290px;padding:16px 18px 15px;border-radius:18px;background:#fff;box-shadow:0 26px 60px -22px rgba(11,18,32,.3),0 0 0 1px rgba(11,18,32,.07);transform:translate(-50%,6px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .24s cubic-bezier(.4,0,.6,1),transform .24s cubic-bezier(.4,0,.6,1),visibility .24s;text-align:left;white-space:normal;z-index:30;line-height:1.4}
.z55-fly::before{content:"";position:absolute;left:50%;top:-6px;width:12px;height:12px;background:#fff;transform:translateX(-50%) rotate(45deg);box-shadow:-1px -1px 0 rgba(11,18,32,.07)}
.z55-fly b{display:block;font-size:15px;font-weight:650;letter-spacing:-.01em;color:#1D1D1F}
.z55-fly span{display:block;margin-top:5px;font-size:14px;color:#5D6370;font-weight:400}
.z55-fly em{display:block;margin-top:10px;font-style:normal;font-size:14px;font-weight:600;color:#0B7D56}
.z53-flow-l:hover .z55-fly,.z53-flow-l:focus-visible .z55-fly{opacity:1;visibility:visible;transform:translate(-50%,0)}
@media (max-width:1000px),(hover:none){.z55-fly{display:none}}

/* concept icons */
.z55-i{display:block;flex:none;width:64px;height:64px}
.z55-i img{display:block;width:100%;height:100%;object-fit:contain}
.z55-i.sm{width:48px;height:48px}
.z55-i.lg{width:132px;height:132px}

/* home: one card that leads to the Flow page */
section.z55-pr{padding:88px 0 8px;background:#fff}
.z55-pc{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:36px;padding:26px 40px 26px 28px;border-radius:28px;border:1px solid #EFE2C2;background:linear-gradient(105deg,#FFF6DF 0%,#FFFBF1 38%,#FFFFFF 70%);color:inherit;text-decoration:none;transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .32s}
.z55-pc:hover{transform:translateY(-3px);box-shadow:0 34px 64px -40px rgba(120,86,0,.45)}
.z55-pc-v{display:grid;place-items:center;width:150px;height:118px}
.z55-pc-t b{display:block;margin-top:12px;font-size:clamp(22px,2.3vw,30px);line-height:1.13;font-weight:700;letter-spacing:-.03em;color:var(--z50-ink,#1D1D1F)}
.z55-pc-l{display:block;margin-top:8px;max-width:40em;font-size:16px;line-height:1.5;color:#5D6370}
.z55-pc-go{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 22px;border-radius:999px;background:#1D1D1F;color:#fff;font-size:15px;font-weight:600;white-space:nowrap;transition:background .24s}
.z55-pc:hover .z55-pc-go{background:#000}

/* ---------- the Zypa Flow page ---------- */
#p-flow{background:#fff}
#p-flow section{padding:112px 0}
#p-flow .z53-head{margin-bottom:44px}
section.z55-fh{padding:136px 0 104px;overflow:hidden}
.z55-fh-g{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);align-items:center;gap:64px}
.z55-h1{margin:0;font-size:clamp(44px,4.6vw,66px);line-height:1.02;font-weight:700;letter-spacing:-.047em;word-spacing:.06em;color:var(--z50-ink,#1D1D1F);text-wrap:balance}
.z55-l{margin:22px 0 0;max-width:31em;font-size:clamp(18px,1.45vw,21px);line-height:1.45;color:#4A505C}
.z55-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:32px}
.z55-fine{margin:22px 0 0;font-size:14px;color:#6B717D}
/* the lock screen: Zypa prepares, the bank asks, you approve, Zypa confirms */
.z55-ls{margin:0;position:relative;justify-self:center;width:100%;max-width:410px}
.z55-ls figcaption{margin-top:14px;text-align:center;font-size:13px;color:#8A909B}
.z55-ph{position:relative;padding:13px 13px 0;border-radius:60px 60px 0 0;background:linear-gradient(180deg,#2A2D33,#1A1C20);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.12),0 70px 100px -60px rgba(11,18,32,.6);-webkit-mask-image:linear-gradient(#000 80%,transparent);mask-image:linear-gradient(#000 80%,transparent)}
.z55-ph-s{position:relative;height:560px;padding:16px 16px 0;border-radius:48px 48px 0 0;overflow:hidden;background:linear-gradient(170deg,#25406B 0%,#1C4F55 48%,#0F2027 100%);color:#fff}
.z55-ph-sb{display:flex;justify-content:space-between;align-items:center;margin:0 16px;height:26px;font-size:14px;font-weight:600}
.z55-ph-sb i{position:absolute;left:50%;top:13px;width:112px;height:32px;border-radius:20px;background:#000;transform:translateX(-50%)}
.z55-ph-sb svg{width:46px;height:12px;fill:currentColor}
.z55-ph-d{margin:30px 0 0;text-align:center;font-size:18px;font-weight:600;color:rgba(255,255,255,.85)}
.z55-ph-t{margin:0;text-align:center;font-size:88px;line-height:1.02;font-weight:600;letter-spacing:-.02em;color:rgba(255,255,255,.94);font-variant-numeric:tabular-nums}
.z55-ph-ns{display:grid;gap:8px;margin-top:40px}
.z55-nt{display:grid;grid-template-columns:38px minmax(0,1fr);gap:11px;align-items:start;padding:12px 14px 13px;border-radius:22px;background:rgba(246,246,248,.86);color:#1D1D1F;-webkit-backdrop-filter:blur(22px) saturate(1.5);backdrop-filter:blur(22px) saturate(1.5);box-shadow:0 10px 26px -14px rgba(0,0,0,.45)}
.z55-nt .z52-app{width:38px;height:38px;border-radius:10px}
.z55-nt .z52-app img{width:24px;height:24px}
.z55-nt p{margin:0}
.z55-nt .h{display:flex;justify-content:space-between;gap:8px;font-size:13px;line-height:1.25}
.z55-nt .h b{font-weight:600}
.z55-nt .h span{color:#6E6E73}
.z55-nt .t{margin-top:2px;font-size:15px;line-height:1.25;font-weight:600;letter-spacing:-.01em}
.z55-nt .m{margin-top:2px;font-size:14px;line-height:1.3;color:#3A3A3C}
.z55-bk{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:linear-gradient(160deg,#3767E0,#1F429F);box-shadow:inset 0 0 0 .5px rgba(255,255,255,.25)}
.z55-bk svg{width:22px;height:22px;fill:#fff}
#p-flow.on .z55-nt{animation:z55note .7s cubic-bezier(.2,.8,.2,1) both}
#p-flow.on .z55-nt:nth-child(1){animation-delay:.35s}
#p-flow.on .z55-nt:nth-child(2){animation-delay:1.25s}
#p-flow.on .z55-nt:nth-child(3){animation-delay:2.15s}
@keyframes z55note{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){#p-flow.on .z55-nt{animation:none}}
/* every week: six jobs */
.z55-jobs>article{display:flex;flex-direction:column;padding:30px 30px 34px}
.z55-jobs .z55-i{width:76px;height:76px;margin:0 0 18px -6px}
.z55-jobs h3,.z55-ctl-l h3{margin:0;font-size:20px;line-height:1.25;font-weight:650;letter-spacing:-.02em;color:var(--z50-ink,#1D1D1F)}
.z55-jobs p{margin:8px 0 0;font-size:16px;line-height:1.5;color:#5D6370}
/* how it works: four steps on the dark band */
.z55-g4{grid-template-columns:repeat(4,minmax(0,1fr))}
/* your control */
section.z55-ctl{background:#F5F5F7}
.z55-ctl-g{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:72px;align-items:start}
.z55-ctl-h{position:sticky;top:120px}
.z55-ctl-l{margin:0;padding:0;list-style:none;border-top:1px solid var(--z50-line,#E3E6ED)}
.z55-ctl-l li{display:grid;grid-template-columns:48px minmax(0,1fr);gap:20px;align-items:start;padding:24px 0;border-bottom:1px solid var(--z50-line,#E3E6ED)}
.z55-ctl-l p{margin:6px 0 0;font-size:16px;line-height:1.5;color:#5D6370}
/* an example week: the board, now a dark product card on a light page */
.z55-ex .fl44-board{margin:0;max-width:none;color:#F5F5F7;background:#0B0D12}
.z55-exn{margin-top:16px;color:#6B717D}
/* pricing: two ways */
.z55-opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.z55-opt{display:flex;flex-direction:column;padding:34px 34px 36px;border-radius:26px;border:1px solid var(--z50-line,#E3E6ED);background:#fff}
.z55-opt .n{display:flex;align-items:center;gap:10px;margin:0;font-size:15px;font-weight:600;color:#5D6370}
.z55-opt .p{margin:14px 0 0;font-size:clamp(34px,3.4vw,46px);line-height:1.05;font-weight:700;letter-spacing:-.035em;color:var(--z50-ink,#1D1D1F)}
.z55-opt .s{margin:12px 0 28px;max-width:30em;font-size:16px;line-height:1.5;color:#5D6370}
.z55-opt .btn,.z55-opt .tlink{margin-top:auto;align-self:flex-start}
.z55-opt.main{background:#0B0D12;border-color:#0B0D12}
.z55-opt.main .n{color:rgba(255,255,255,.7)}
.z55-opt.main .p{color:#fff}
.z55-opt.main .s{color:rgba(255,255,255,.7)}
/* the closing band */
section.z55-end{background:#0B0D12;color:#fff;text-align:center}
.z55-end-t{margin:0 auto;max-width:14em;font-size:clamp(36px,4.2vw,58px);line-height:1.04;font-weight:700;letter-spacing:-.045em;word-spacing:.06em;color:#fff;text-wrap:balance}
.z55-end-l{margin:18px auto 0;max-width:34em;font-size:18px;line-height:1.5;color:rgba(255,255,255,.68)}
.z55-end-b{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px 26px;margin-top:32px}
.z55-end .tlink{color:#fff}
/* pricing page band: two actions */
.z55-band-b{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin-top:24px}
.z55-band-b .btn{margin-top:0}
.z55-flowband .z55-band-b .tlink,.z54-flowband .z55-band-b .tlink{color:#fff}

@media (max-width:1000px){
 .z55-fh-g{grid-template-columns:1fr;gap:56px}
 .z55-g4{grid-template-columns:repeat(2,minmax(0,1fr))}
 .z55-ctl-g{grid-template-columns:1fr;gap:36px}
 .z55-ctl-h{position:static}
}
@media (max-width:734px){
 #p-flow section{padding:76px 0}
 section.z55-fh{padding:104px 0 72px}
 .z55-h1{font-size:clamp(36px,10vw,44px)}
 .z55-ph-s{height:500px}
 .z55-ph-t{font-size:72px}
 .z55-g4{grid-template-columns:1fr}
 .z55-opts{grid-template-columns:1fr}
 .z55-opt{padding:26px 22px 28px}
 section.z55-pr{padding:64px 0 0}
 .z55-pc{grid-template-columns:1fr;gap:16px;padding:24px 22px 26px}
 .z55-pc-v{width:110px;height:86px;place-items:start}
 .z55-pc-go{justify-self:start}
 .z55-jobs .z55-i{width:64px;height:64px}
}

/* the hero's offer line (v55) */
.z55-offer{display:flex;align-items:center;gap:14px;margin:28px 0 0;max-width:34em;padding:14px 20px 14px 14px;border-radius:18px;background:linear-gradient(105deg,#FFF2CC 0%,#FFF8E8 60%,#FFFBF3 100%);box-shadow:inset 0 0 0 1px #F0DDA8}
.z55-offer b{display:block;font-size:17px;line-height:1.3;font-weight:650;letter-spacing:-.01em;color:#1D1D1F}
.z55-offer>span:last-child>span{display:block;margin-top:2px;font-size:14.5px;line-height:1.4;color:#5D6370}
.z55-i.xs{width:44px;height:44px}
.z55-ctl-h .lede{margin-top:18px}
/* the lock screen keeps all three notifications in view; only the phone's lower edge fades */
.z55-ph{-webkit-mask-image:linear-gradient(#000 88%,transparent);mask-image:linear-gradient(#000 88%,transparent)}
.z55-ph-s{height:590px}
@media (max-width:734px){
 .z55-ph-s{height:548px;padding:14px 12px 0;border-radius:42px 42px 0 0}
 .z55-ph{padding:11px 11px 0;border-radius:52px 52px 0 0}
 .z55-ph-d{margin-top:22px;font-size:16px}
 .z55-ph-t{font-size:64px}
 .z55-ph-ns{margin-top:26px;gap:7px}
 .z55-nt{padding:11px 12px 12px;gap:10px;grid-template-columns:34px minmax(0,1fr)}
 .z55-nt .z52-app,.z55-bk{width:34px;height:34px;border-radius:9px}
 .z55-nt .t{font-size:14.5px}
 .z55-nt .m{font-size:13.5px}
 section.z55-fh{padding-top:120px}
}

/* ---------- v55, after the treasury-site research: the Flow page's own pieces ---------- */
/* hero offer: a plain line beside its icon, no tinted box */
.z55-offer{gap:12px;margin-top:26px;padding:0;background:none;box-shadow:none;border-radius:0}
.z55-offer b{font-size:18px}
/* five weekly jobs, one row on wide screens */
.z55-jobs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;margin:0;padding:0;list-style:none;background:var(--z50-line,#E3E6ED);border:1px solid var(--z50-line,#E3E6ED);border-radius:22px;overflow:hidden}
.z55-jobs>li{display:flex;flex-direction:column;min-width:0;padding:28px 24px 30px;background:#fff}
.z55-jobs .z55-i{width:72px;height:72px;margin:0 0 18px -4px}
/* a week with Flow: step 03 is the one with "you" in it */
.z55-how .z53-grid>li.you{background:#0F211B}
.z55-how li.you .k,.z55-how li.you .k span{color:var(--jade-bright,#3DD39B)}
.z55-how .fl44-board{max-width:none;margin:40px 0 0;background:#14171E;color:#F5F5F7;box-shadow:inset 0 0 0 1px rgba(255,255,255,.09),0 50px 90px -50px rgba(0,0,0,.9)}
.z55-how .z55-exn{margin:14px 0 0;font-size:13px;color:rgba(255,255,255,.5)}
/* who does what */
section.z55-who{background:#F5F5F7}
.z55-led{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.z55-led-c{padding:26px 30px 10px;border-radius:24px;background:#fff;border:1px solid var(--z50-line,#E3E6ED)}
.z55-led-c.you{background:#0B0D12;border-color:#0B0D12}
.z55-led-h{display:flex;align-items:center;gap:10px;margin:0 0 10px;font-size:16px;font-weight:650;color:#1D1D1F}
.z55-led-c.you .z55-led-h{color:#fff}
.z55-you{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:#fff;color:#0B0D12;font-size:12px;font-weight:700}
.z55-led ul{margin:0;padding:0;list-style:none}
.z55-led li{padding:16px 0;border-top:1px solid var(--z50-line,#E3E6ED);font-size:17px;line-height:1.4;color:#4A505C}
.z55-led li b{font-weight:650;color:#1D1D1F}
.z55-led-c.you li{border-top-color:rgba(255,255,255,.12);color:rgba(255,255,255,.7)}
.z55-led-c.you li b{color:#fff}
.z55-never{margin:24px 0 0;max-width:62em;font-size:15px;line-height:1.55;color:#5D6370}
/* what it costs: the usual way beside Flow, the condition in the same view */
section.z55-cost{background:#0B0D12;color:#fff}
.z55-cost .t2{color:#fff}
.z55-cost .lede{color:rgba(255,255,255,.7)}
.z55-cost .z53-k{color:rgba(255,255,255,.5)}
.z55-cost .tlink{color:#fff}
.z55-cost-g{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:center}
.z55-slip{position:relative;padding:30px 32px 24px;border-radius:24px;background:#fff;color:#1D1D1F;box-shadow:0 40px 80px -40px rgba(0,0,0,.7)}
.z55-slip-i{position:absolute;right:20px;top:-50px;width:112px;height:112px}
.z55-slip table{width:100%;margin:0;border-collapse:collapse}
.z55-slip table+table{margin-top:24px}
.z55-slip caption{padding:0 0 10px;text-align:left;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#6B717D}
.z55-slip th,.z55-slip td{padding:15px 12px 15px 0;border-top:1px solid #E3E6ED;text-align:left;vertical-align:baseline;font-size:15px;line-height:1.35;color:#6B717D}
.z55-slip th{width:28%;font-weight:600}
.z55-slip td.v{padding-right:0;text-align:right;white-space:nowrap;font-weight:650}
.z55-slip tr.on th,.z55-slip tr.on td.v{color:#1D1D1F}
.z55-slip tr.on td.v{font-size:17px}
.z55-slip-n{margin:14px 0 0;font-size:14px;color:#5D6370}
.z55-end-n{margin:22px auto 0;max-width:40em;font-size:14px;line-height:1.5;color:rgba(255,255,255,.55)}
@media (max-width:1100px){
 .z55-jobs{grid-template-columns:repeat(2,minmax(0,1fr))}
 .z55-jobs>li:last-child{grid-column:1/-1}
}
@media (max-width:1000px){
 .z55-cost-g{grid-template-columns:1fr;gap:80px}
 .z55-led{grid-template-columns:1fr}
}
@media (max-width:734px){
 .z55-jobs{grid-template-columns:1fr}
 .z55-jobs>li{display:grid;grid-template-columns:56px minmax(0,1fr);column-gap:16px;padding:20px 18px 22px}
 .z55-jobs>li:last-child{grid-column:auto}
 .z55-jobs .z55-i{grid-row:1/3;width:56px;height:56px;margin:0}
 .z55-led-c{padding:22px 20px 6px}
 .z55-led li{font-size:16px}
 .z55-slip{padding:24px 20px 20px}
 .z55-slip tr{display:block;border-top:1px solid #E3E6ED;padding:12px 0}
 .z55-slip th,.z55-slip td{display:block;width:auto;padding:0;border-top:0}
 .z55-slip td.v{margin-top:4px;text-align:left}
 .z55-slip-i{top:-40px;right:12px;width:86px;height:86px}
}
.z55-cost-t .lede{margin:18px 0 0;max-width:30em}
.z55-cost-t .z55-cta{margin-top:30px}

/* ---------- v55 icons: one graphite-and-gold family, shown as objects on the page (no tiles), square ---------- */
.zi5{display:block;object-fit:contain;-webkit-user-drag:none;user-select:none} /* v56: the renders carry their own soft shadow */
.z54-o .zv3,.z54-po .zv3,.z54-fo .zv3,.z54-ho .zv3{width:100%;height:100%}
.z53-set .z54-o{width:128px;height:128px;max-width:none;aspect-ratio:auto;margin:6px 0 20px -8px}
.z53-set .z53-grid article:hover .z54-o{transform:translateY(-4px) rotate(-2deg)}
.z49-service-preview a .zi5{width:58px;height:58px;margin:-4px 0}
.z51-im .zi5{width:72px;height:72px;margin:-8px 0}
.sx48-t .zi5{width:92px;height:92px;margin:-4px 0 10px -6px}
.sx48-t:hover .zi5{transform:translateY(-4px) rotate(-2deg)}
.pp42-plans.z54-plans .z54-po{width:120px;height:120px;max-width:none;aspect-ratio:auto;margin:0 0 12px -8px}
.z54-flowband .z54-fo{width:220px;height:220px;max-width:none;aspect-ratio:auto}
.z54-pah .z54-ho{width:250px;height:250px;max-width:none;aspect-ratio:auto}
.pa42-two.z54-g2 .z54-po{width:120px;height:120px;max-width:none;aspect-ratio:auto;margin:0 0 12px -8px}
.z55-i .zi5{width:100%;height:100%}
@media(max-width:900px){.z51-im .zi5{width:60px;height:60px}}
@media(max-width:734px){
 .z53-set .z54-o{width:104px;height:104px;margin:0 0 14px -6px}
 .z51-im .zi5{width:52px;height:52px;margin:-4px 0}
 .sx48-t .zi5{width:60px;height:60px;margin:0}
 .z49-service-preview a .zi5{width:50px;height:50px}
 .pp42-plans.z54-plans .z54-po,.pa42-two.z54-g2 .z54-po{width:96px;height:96px}
 .z54-flowband .z54-fo{width:160px;height:160px}
 .z54-pah .z54-ho{width:180px;height:180px}
}
.z55-jobs .z55-i{width:88px;height:88px;margin:-4px 0 16px -8px}
@media(max-width:734px){.z55-jobs .z55-i{width:60px;height:60px;margin:0}}

/* ---------- v55 review fixes (independent review, 11 Oct) ---------- */
/* icons line their visible left edge up with the text under them (--pl = the icon's empty left margin) */
.z53-set .z54-o{margin-left:calc(var(--pl,0) * -128px)}
.sx48-t .zi5{margin-left:calc(var(--pl,0) * -92px)}
.pp42-plans.z54-plans .z54-po,.pa42-two.z54-g2 .z54-po{margin-left:calc(var(--pl,0) * -120px)}
.z55-jobs .z55-i{margin-left:calc(var(--pl,0) * -88px)}
.z55-offer .z55-i{margin-left:calc(var(--pl,0) * -44px)}
.z55-slip .z55-slip-i{width:112px;height:112px}
/* the home Flow card has room on both sides */
section.z55-pr{padding:88px 0 96px}
/* the film's chapters sit closer to the next section */
.h42 + .z53-set{padding-top:80px}
/* the example week reads on the dark band: brighter small labels, outlined card thumbnails */
.z55-how .flb-h span,.z55-how .flb-bal p,.z55-how .flb-list .d{color:rgba(245,245,247,.74)}
.z55-how .flb-bal p .zv-c,.z55-how .flb-list .zv-c{box-shadow:0 0 0 1px rgba(255,255,255,.24);border-radius:5px}
/* hero trust line: the first sentence carries the weight */
.z55-fine b{font-weight:600;color:#1D1D1F}
/* Pricing: the Flow band's label and button match the rest of the site; the quote heading is a section heading */
.z54-flowband .n{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.pp44-flow.z54-flowband .btn.btn-brand{background:var(--jade,#0B7D56);color:#fff}
.pp44-flow.z54-flowband .btn.btn-brand:hover{background:#09694A}
.z54-pp .pp42-what>h2{font-size:clamp(36px,4.2vw,58px);line-height:1.03;font-weight:700;letter-spacing:-.045em;word-spacing:.06em;color:var(--z50-ink,#1D1D1F)}
/* lone last words in row descriptions and the comparison table */
.z51-tx span,.z53-tbl td,.z53-tbl th,.sx48-t p,.z55-led li{text-wrap:pretty}
/* the Services closing heading */
.sx45-end h2{line-height:1.1}
@media(max-width:734px){
 .z53-set .z54-o{margin-left:calc(var(--pl,0) * -104px)}
 .pp42-plans.z54-plans .z54-po,.pa42-two.z54-g2 .z54-po{margin-left:calc(var(--pl,0) * -96px)}
 .sx48-t .zi5,.z55-jobs .z55-i{margin-left:0}
 section.z55-pr{padding:64px 0 64px}
 .z55-pc .z55-i.lg{width:96px;height:96px}
 .z55-pc-v{width:96px;height:96px}
 .z49-page-nav{justify-content:space-between}
 .z49-page-nav a{padding:9px 10px;font-size:13px}
 .z55-slip .z55-slip-i{width:86px;height:86px}
}
/* phone film: the controls keep clear of the caption in the picture */
@media(max-width:734px){.hv-ctl{right:8px;bottom:8px;gap:6px}.hv-ctl button{width:32px;height:32px}}

/* ---------- v56: one Blender icon family (blue, pearl, gold), each icon sized in proportion to its card ---------- */
.sx48-t .zi5{width:112px;height:112px;margin:-6px 0 6px calc(var(--pl,0) * -112px)}
.z55-jobs .z55-i{width:100px;height:100px;margin:-6px 0 12px calc(var(--pl,0) * -100px)}
@media(max-width:734px){
 .sx48-t .zi5{width:64px;height:64px;margin:0}
 .z55-jobs .z55-i{width:60px;height:60px;margin:0}
}
/* the Partners hero object fills its side of the hero */
.z54-pah .z54-ho{width:320px;height:320px}
/* phones: the six account cards on Home become a list (icon left, words right), like Who it's for */
@media(max-width:734px){
 .z54-pah .z54-ho{width:200px;height:200px}
 .z53-set .z53-grid article{display:grid;grid-template-columns:72px minmax(0,1fr);column-gap:16px;align-content:start;padding-top:20px}
 .z53-set .z53-grid article .z54-o{grid-row:1/3;width:72px;height:72px;margin:-6px 0 0 calc(var(--pl,0) * -72px)}
 .z53-set .z53-grid article h3{margin-top:2px}
}


/* ===================== v57 (13 Oct): v56's look, made clearer (owner: keep v56 and the film; fix; shorter; product
   screens where they explain). The earlier v57-v59 were deleted. ===================== */
/* Type: one web font for every visitor (Mac/iPhone used to get SF Pro, everyone else Inter with SF's tracking):
   Hanken Grotesk (SIL OFL 1.1), as wide as Inter, the nearest free face to Revolut's Aeonik. Headlines lighter and less
   tight, as at Revolut, Stripe and Wise (600 at -0.03em, no word-spacing prop). */
:root{--font:"Hanken Grotesk",Inter,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,"PingFang TC","Noto Sans TC",sans-serif}
body{letter-spacing:-.006em}
:is(h1,h2,.h42-t,.t2,.m41-t,.z36-t,.z55-h1,.z55-end-t){font-weight:600!important;letter-spacing:-.03em!important;word-spacing:0!important}
:is(h3,.z51-tx b){font-weight:600;letter-spacing:-.015em!important}
/* Layout bugs found in the review (tested): the header fits a 360 px phone; the currency board fits at 1024 px; small
   grey labels pass contrast */
@media(max-width:380px){.nav .wrap{gap:8px;padding-inline:14px}}
@media(max-width:1060px){.b36-board .bd-grp.rail,.b36-board .h-rail{display:none}}
.z51-ex,.z51-what>p{color:#6B7180}
/* the cheapest route: the month's two numbers lead, big; one payment's detail is one click away */
.fe42 .fe42-month{margin-top:28px}
.fe42 .fe42-month .nums b{font-size:clamp(44px,6vw,76px)!important;letter-spacing:-.035em!important;font-weight:600!important;line-height:1}
.z57-one{margin-top:22px;text-align:center}.z57-one[open]{text-align:left}
.z57-one>summary{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:16px;font-weight:600;color:#0066CC;list-style:none}
.z57-one>summary::-webkit-details-marker{display:none}
.z57-one>summary::after{content:"›";transition:transform .2s}
.z57-one[open]>summary::after{transform:rotate(90deg)}
.z57-one[open]>summary{margin-bottom:18px}
.fe42-fine{text-align:center}
/* Services: the catalogue as four cards side by side; each account a short line with its icon and example providers */
@media(min-width:900px){
 .sx45-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start;margin-top:32px}
 .sx45-groups .z51-g{margin:0!important;padding:28px 28px 12px;border-radius:28px;background:#F5F5F7}
 .sx45-groups .z51-gh h3{font-size:26px;letter-spacing:-.025em}
 .sx45-groups .z51-gh p{font-size:15px}
 .sx45-groups .z51-list{margin-top:16px;border:0;box-shadow:none;background:transparent;border-radius:0;overflow:visible}
 .sx45-groups .z51-row{background:#fff;border-radius:18px;margin-bottom:10px}
 .sx45-groups .z51-row+.z51-row{border-top:0}
 .sx45-groups .z51-row summary{grid-template-columns:56px minmax(0,1fr) 20px;gap:8px 14px;padding:16px 18px;border-radius:18px}
 .sx45-groups .z51-im{grid-column:1;grid-row:1/3;align-self:center}
 .sx45-groups .z51-im .zi5{width:56px!important;height:56px!important;margin:0!important}
 .sx45-groups .z51-tx{grid-column:2;grid-row:1}
 .sx45-groups .z51-side{grid-column:2;grid-row:2;flex-direction:row;align-items:center;gap:12px}
 .sx45-groups .z51-chev{grid-column:3;grid-row:1}
 .sx45-groups .z51-ex{display:none}
 .sx45-groups .z51-tx b{font-size:17px}
 .sx45-groups .z51-tx>span{font-size:14px}
 .sx45-groups .z51-what{padding:0 18px 16px}
}
/* Flow page: one dark moment (the week board), not three: what it costs and the closing call are light */
section.z55-cost{background:#F5F5F7!important;color:#1D1D1F}
.z55-cost .t2{color:#1D1D1F!important}
.z55-cost .lede{color:#4B5160!important}
.z55-cost .z53-k{color:#6B7180!important}
.z55-cost .tlink{color:#0066CC!important}
.z55-slip{box-shadow:0 1px 2px rgba(16,24,40,.05),0 30px 60px -36px rgba(16,24,40,.35)!important}
section.z55-end{background:#fff!important;color:#1D1D1F}
.z55-end-t{color:#1D1D1F!important}
.z55-end-l{color:#4B5160!important}
.z55-end .tlink{color:#0066CC!important}

/* ---------- v57: product, not pictures (owner, 12-13 Oct): where the page describes something Zypa produces, it shows a
   crop of it. The Flow jobs: one small product card each; the Pricing Flow band: the approval notifications; the
   Partners hero: a client's set of accounts. Home's account cards: real provider logos. Services rows: the logos only. */
.z57-ui{display:block;width:100%;margin:0 0 18px}
.u-card{box-sizing:border-box;height:128px;padding:12px 13px;border-radius:14px;background:#fff;border:1px solid #E6E9EF;box-shadow:0 1px 2px rgba(16,24,40,.04),0 10px 24px -16px rgba(16,24,40,.28);font-size:11.5px;line-height:1.3;color:#1D2230;overflow:hidden;position:relative;text-align:left}
.u-h{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:10px}
.u-h b{font-size:12px;font-weight:650;letter-spacing:-.01em;white-space:nowrap}
.u-h em{font-style:normal;color:#7A8090;font-size:10.5px;white-space:nowrap}
.u-chip{font-style:normal;font-size:10px;font-weight:650;line-height:1;padding:4px 7px;border-radius:999px;background:#EEF2FE;color:#2343B8;white-space:nowrap}
.u-chip.g{background:#E7F5EE;color:#0B6B49}
.u-chip.a{background:#FFF4DB;color:#8A5A00}
.u-bars{display:flex;align-items:flex-end;gap:10px;height:52px;padding:0 2px}
.u-bars span{flex:1;display:flex;align-items:flex-end;gap:3px;height:100%;position:relative}
.u-bars i{flex:1;border-radius:3px 3px 1px 1px;background:#2D62F5}
.u-bars i.o{background:#C9D1E3}
.u-bars em{position:absolute;left:0;right:0;bottom:-15px;text-align:center;font-style:normal;font-size:9.5px;color:#8A909B}
.u-leg{display:flex;align-items:center;gap:5px;margin-top:21px;font-size:10px;color:#6B7180}
.u-leg i{width:8px;height:8px;border-radius:2px;background:#2D62F5}.u-leg i.o{background:#C9D1E3;margin-left:8px}
.u-fx{display:flex;align-items:center;gap:8px;margin:2px 0 10px}
.u-cur{display:inline-grid;place-items:center;height:30px;padding:0 10px;border-radius:9px;background:#F3F5F9;border:1px solid #E3E7EE;font-weight:700;font-size:12.5px;letter-spacing:.02em}
.u-arr{color:#2D62F5;font-weight:700;font-size:15px}
.u-sub{margin:0;font-size:11px;color:#6B7180}
.u-big{margin:0 0 2px;font-size:14px;font-weight:650;letter-spacing:-.01em}
.u-btn{display:inline-block;margin-top:10px;padding:6px 10px;border-radius:999px;background:#1D1D1F;color:#fff;font-size:10.5px;font-weight:600}
.u-acct{display:grid;grid-template-columns:76px 1fr;align-items:center;gap:8px;margin:0 0 9px;font-size:11px;color:#3C4250}
.u-acct i{display:block;height:8px;border-radius:4px;background:linear-gradient(90deg,#AEB6C6 var(--w),#EEF1F5 var(--w))}
.u-acct.r i{background:linear-gradient(90deg,#2D62F5 var(--w),#EEF1F5 var(--w))}
.u-acct.r span{font-weight:650;color:#1D2230}
.u-spark{display:block;width:100%;height:34px;margin:-2px 0 6px;overflow:visible}
.u-spark polyline{fill:none;stroke:#2D62F5;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.u-next{margin:6px 0 0;font-size:10.5px;font-weight:600;color:#1D2230}
/* the approval notifications on the dark Flow band */
.z54-flowband .z57-ui-big{justify-self:center;width:100%;max-width:400px;margin:0}
.u-ls .u-n{display:flex;gap:11px;align-items:flex-start;margin:0 0 10px;padding:12px 14px;border-radius:18px;background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#fff;text-align:left}
.u-ls .u-n img,.u-ls .u-bank{flex:none;width:34px;height:34px;border-radius:8px}
.u-ls .u-bank{display:grid;place-items:center;background:#fff;overflow:hidden}.u-ls .u-bank img{width:30px;height:30px;object-fit:contain}
.u-ls .u-n p{margin:0;font-size:13px;line-height:1.35;color:rgba(255,255,255,.78)}
.u-ls .u-n p:first-child{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;letter-spacing:.02em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.u-ls .u-n p:first-child b{font-weight:600}.u-ls .u-n p:first-child em{font-style:normal;text-transform:none}
.u-ls .u-n p.t{margin-top:3px;font-weight:650;color:#fff}
.u-note{margin:8px 2px 0;font-size:11px;color:rgba(255,255,255,.5)}
/* a client's set of accounts on the Partners hero */
.z54-pah .z57-ui-big{justify-self:center;width:100%;max-width:420px;margin:0}
.u-client{height:auto;padding:20px 22px 16px;border-radius:22px;font-size:14px;box-shadow:0 1px 2px rgba(16,24,40,.04),0 30px 60px -36px rgba(16,24,40,.35)}
.u-client .u-h{margin-bottom:14px}.u-client .u-h b{font-size:16px}.u-client .u-h em{font-size:12.5px}
.u-client .u-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 0;border-top:1px solid #EEF1F5;font-size:14px}
.u-client .u-chip{font-size:11.5px;padding:5px 9px}
.u-client .u-note{color:#8A909B;margin-top:10px;font-size:12px}
/* the crops keep their own small type inside the cards around them */
.u-card p,.u-ls p{margin:0;text-wrap:wrap}
.u-card p.u-sub{font-size:11px;line-height:1.35;color:#6B7180}
.u-card p.u-big{margin:0 0 2px;font-size:14px;line-height:1.3;font-weight:650;color:#1D2230}
.u-card p.u-next{margin:6px 0 0;font-size:10.5px;line-height:1.3;font-weight:600;color:#1D2230}
.u-client p.u-note{font-size:12px;line-height:1.4;color:#8A909B;margin-top:10px}
.u-ls p.u-note{font-size:11px;color:rgba(255,255,255,.5);margin:8px 2px 0}
/* phones: the Flow jobs stack (product card above its words) */
@media(max-width:734px){.z55-jobs li{display:block!important}.z55-jobs .z57-ui{max-width:340px;margin-bottom:14px}}
/* the film is light now (tools/render-film-v57.mjs): its frame, controls and note follow */
.hv{background:#EDEDF0!important;box-shadow:0 1px 2px rgba(16,24,40,.04),0 40px 80px -48px rgba(16,24,40,.35)}
.hv-note{color:rgba(29,29,31,.5)!important}
.hv-ctl button{background:rgba(29,29,31,.08)!important;color:#1D1D1F!important}
.hv-pp svg{fill:#1D1D1F!important}.hv-fs svg{stroke:#1D1D1F!important}