/* The two wallet rows are the moving cards themselves, never screenshot clones. */
.hero--wallet { padding-top:18px; }
.hero--wallet .hero__grid { grid-template-columns:.93fr 1.07fr; gap:20px; min-height:630px; }
.hero--wallet .hero__copy { padding-bottom:0; }
.wallet-showcase { --sw-green:#17513f; --sw-cycle:24s; --sw-idr-out:translate(-31%,-10%) rotate(-6deg) scale(1.25); --sw-idr-exit:translate(-63%,-30%) rotate(-19deg) scale(1.13); --sw-usd-out:translate(27%,9%) rotate(5deg) scale(1.27); --sw-usd-exit:translate(61%,26%) rotate(18deg) scale(1.13); position:relative; width:100%; max-width:610px; margin:0; container-type:inline-size; isolation:isolate; pointer-events:none; }
.wallet-showcase:focus { outline:none; }
.sw-stage { position:relative; width:100%; aspect-ratio:600/650; }
.sw-halo { position:absolute; inset:9% -4% 9%; border-radius:50%; background:radial-gradient(ellipse at 48% 44%,#cee2d2 0%,#e6eee0 43%,#edf1e600 71%); transform:rotate(-18deg); }
.sw-orbit { position:absolute; width:83%; height:65%; top:16%; left:7%; border:1px solid #b9d0bd66; border-radius:50%; transform:rotate(-26deg); }
.sw-orbit::after { content:""; position:absolute; width:1.4cqw; height:1.4cqw; border-radius:50%; left:9%; top:13%; background:#8ba98f; box-shadow:0 0 0 1.1cqw #e9eee3; }
.sw-ground { position:absolute; width:52%; height:4%; left:25%; bottom:5%; border-radius:50%; background:#173c2c2b; filter:blur(2.6cqw); }
.sw-leaf-orbit { position:absolute; inset:0; transform-origin:50% 48%; pointer-events:none; }
.sw-leaf-orbit--one,.sw-leaf-orbit--two { z-index:1; }
.sw-leaf { position:absolute; width:11%; height:7%; border-radius:5% 90% 5% 90%; background:linear-gradient(140deg,#d8e8c6,#85aa92); box-shadow:inset 0 1px 1px #fff8; transform:rotate(-32deg); }
.sw-leaf::after { content:""; position:absolute; left:12%; top:50%; width:76%; height:1px; background:#47785c33; transform:rotate(35deg); }
.sw-leaf--one { left:12%; top:29%; }
.sw-leaf--two { width:7%; height:4%; right:9%; bottom:23%; transform:rotate(19deg); background:linear-gradient(130deg,#e9e3c4,#b8bc8d); }
.sw-leaf-orbit--three { z-index:1; }.sw-leaf--three { left:7%; top:47%; width:5.2%; height:3.8%; background:linear-gradient(135deg,#d3e6c5,#60967a); }
.sw-leaf-orbit--four { z-index:1; }.sw-leaf--four { right:7%; top:47%; width:4%; height:2.8%; background:linear-gradient(135deg,#e9e5ca,#b2c99d); }
.sw-leaf-orbit--five { z-index:1; }.sw-leaf--five { left:4%; bottom:21%; width:3.1%; height:2.2%; background:linear-gradient(135deg,#c7ddbd,#7eaa85); }
.sw-leaf-orbit--six { z-index:1; }.sw-leaf--six { right:4%; top:21%; width:5.8%; height:4.2%; background:linear-gradient(135deg,#c6dfc5,#6da48c); }
.sw-leaf-orbit--seven { z-index:1; }.sw-leaf--seven { left:7%; top:24%; width:4%; height:2.7%; background:linear-gradient(135deg,#f1e8cf,#b5c39a); }
.sw-leaf-orbit--eight { z-index:1; }.sw-leaf--eight { right:7%; bottom:24%; width:3%; height:2.1%; background:linear-gradient(135deg,#dce9c9,#86ae91); }
.sw-spark { position:absolute; width:4%; height:4%; color:#88ad95; fill:none; stroke:currentColor; stroke-width:1.1; }
.sw-spark--one { right:16%; top:17%; transform:rotate(12deg); }
.sw-spark--two { left:13%; bottom:22%; width:3%; height:3%; color:#b7a976; }
.sw-phone { position:absolute; z-index:2; width:49%; height:89%; left:25.5%; top:3.5%; padding:1.25cqw; border:1px solid #5e6f61; border-radius:7.5cqw; background:linear-gradient(120deg,#a4afa2,#263a2f 9%,#0d1d15 50%,#667a68 90%,#bec8b8); box-shadow:inset 0 0 0 .35cqw #b8c0b0,0 3.5cqw 6cqw -2cqw #21412c44,0 .5cqw .9cqw #132d2024; transform:rotate(-2deg); }
.sw-phone::before,.sw-phone::after { content:""; position:absolute; width:.5cqw; border-radius:.5cqw; background:#627665; box-shadow:inset 1px 0 #b9c8b4; }
.sw-phone::before { height:7%; top:20%; left:-.5cqw; box-shadow:inset 1px 0 #b9c8b4,0 6cqw #627665; }
.sw-phone::after { height:11%; top:25%; right:-.5cqw; }
.sw-glass { position:relative; height:100%; border-radius:6.3cqw; background:#faf7f1; color:#211f1b; box-shadow:0 0 0 .35cqw #102017; }
.sw-status { height:6.8%; padding:2cqw 3.7cqw 0; display:flex; justify-content:space-between; align-items:flex-start; font-size:1.6cqw; font-weight:600; line-height:1; }
.sw-island { position:absolute; left:50%; top:1.4cqw; translate:-50% 0; width:13.5cqw; height:3.7cqw; border-radius:3cqw; background:#101914; }
.sw-island::after { content:""; position:absolute; right:1.2cqw; top:1.1cqw; width:1.2cqw; height:1.2cqw; border-radius:50%; background:#19322b; box-shadow:inset 0 0 0 .3cqw #243d36; }
.sw-signals { display:flex; align-items:center; gap:.7cqw; }
.sw-signals svg { width:2.7cqw; height:1.8cqw; fill:none; stroke:currentColor; stroke-width:1.8; }
.sw-signals i { width:2.8cqw; height:1.4cqw; padding:.2cqw; border:1px solid currentColor; border-radius:.3cqw; }
.sw-signals i::after { content:""; display:block; width:85%; height:100%; background:currentColor; border-radius:.1cqw; }
.sw-app { padding:0 2.25cqw; }
.sw-appbar { height:6cqw; display:flex; align-items:center; gap:1cqw; }
.sw-appbar img { width:3.8cqw; height:3.8cqw; }
.sw-appbar b { font-size:1.7cqw; letter-spacing:.04em; font-weight:700; }
.sw-appbar>svg { margin-left:auto; width:2.7cqw; height:2.7cqw; fill:none; stroke:var(--sw-green); stroke-width:1.6; }
.sw-title { display:flex; justify-content:space-between; align-items:center; margin:2cqw 0 2.5cqw; }
.sw-title strong { font-size:3.2cqw; font-weight:650; letter-spacing:-.04em; line-height:1.2; }
.sw-title span { color:#77776b; font-size:1.55cqw; }
.sw-summary { border-radius:2.4cqw; padding:2.3cqw; background:#123d31; color:#faf7f1; }
.sw-summary>span { display:flex; justify-content:space-between; align-items:center; color:#c9c3b8; font-size:1.65cqw; }
.sw-summary>span svg { width:2.5cqw; height:2.5cqw; fill:none; stroke:currentColor; stroke-width:1.6; }
.sw-summary>strong { display:block; margin:1.4cqw 0 2cqw; font-size:4.25cqw; line-height:1.1; letter-spacing:-.055em; font-weight:600; font-variant-numeric:tabular-nums; }
.sw-summary>strong small { font-size:2.5cqw; color:#c9c3b8; font-weight:400; letter-spacing:0; margin-right:.5cqw; }
.sw-split { display:grid; grid-template-columns:1.3fr 1fr; gap:1cqw; }
.sw-split span { display:grid; gap:.4cqw; padding:1.1cqw; background:#ffffff0c; border-radius:1cqw; font-size:1.5cqw; color:#c9c3b8; }
.sw-split b { color:#faf7f1; font-weight:500; font-size:1.8cqw; font-variant-numeric:tabular-nums; }
.sw-list-head { display:flex; justify-content:space-between; align-items:center; margin:3.1cqw 0 1.2cqw; font-size:2.3cqw; font-weight:550; }
.sw-list-head span { color:#7a776d; font-weight:400; font-size:1.7cqw; }
.sw-wallets { position:relative; border:1px solid #e7e0d3; border-radius:2.6cqw; background:#fff; }
.sw-card { position:relative; z-index:3; display:grid; grid-template-columns:5.8cqw 1fr auto; align-items:center; gap:1.3cqw; min-height:13.3cqw; padding:2.2cqw 1.7cqw; border:1px solid transparent; border-radius:2.5cqw; background:#fffef9; color:#211f1b; transform-origin:50% 50%; box-shadow:0 1.5cqw 3.7cqw -1cqw #20452d2c; }
.sw-card--idr { z-index:5; transform:translate(-27%,-12%) rotate(-6deg) scale(1.22); }
.sw-card--usd { z-index:6; transform:translate(28%,12%) rotate(5deg) scale(1.22); }
.sw-card__icon { display:grid; place-items:center; width:5.8cqw; height:5.8cqw; border-radius:1.7cqw; color:#219a6f; background:#e5f3e9; }
.sw-card__icon svg { width:3.2cqw; height:3.2cqw; fill:none; stroke:currentColor; stroke-width:1.6; }
.sw-card--usd .sw-card__icon { color:#41719a; background:#eaf0f5; }
.sw-card__name { display:grid; min-width:0; gap:.55cqw; }
.sw-card__name b { display:flex; align-items:center; gap:.7cqw; font-size:2.05cqw; line-height:1.3; font-weight:550; white-space:nowrap; }
.sw-card__name b svg { width:1.4cqw; height:1.4cqw; fill:#b49750; color:#b49750; }
.sw-card__name small { font-size:1.6cqw; line-height:1.5; color:#777367; }
.sw-card__money { display:grid; justify-items:end; gap:.55cqw; font-variant-numeric:tabular-nums; white-space:nowrap; }
.sw-card__money strong { font-size:2.25cqw; font-weight:550; line-height:1.3; letter-spacing:-.025em; }
.sw-card__money small { font-size:1.65cqw; line-height:1.5; color:#777367; }
.sw-card--usd .sw-card__money small { color:#4d725e; }
.sw-bottom-nav { position:absolute; left:2cqw; right:2cqw; bottom:2.2cqw; display:flex; justify-content:space-around; align-items:center; padding-top:1.8cqw; border-top:1px solid #e7e0d3; }
.sw-bottom-nav>span { display:grid; justify-items:center; gap:.4cqw; color:#847e72; font-size:1.25cqw; }
.sw-bottom-nav>span:nth-child(2) { color:var(--sw-green); }.sw-bottom-nav svg { width:2.8cqw; height:2.8cqw; fill:none; stroke:currentColor; stroke-width:1.6; }
.sw-bottom-nav .sw-add { width:5.4cqw; height:5.4cqw; display:grid; place-items:center; background:var(--sw-green); color:white; border-radius:50%; font-size:3cqw; margin-top:-2cqw; line-height:1; }
.sw-home { position:absolute; bottom:.75cqw; left:37%; width:26%; height:.45cqw; border-radius:1cqw; background:#23372a; }
.sw-caption { position:absolute; bottom:0; left:0; width:100%; margin:0; height:3cqw; font-size:1.95cqw; color:#5c7161; line-height:1.5; text-align:center; }
.sw-caption>span { position:absolute; inset:0; opacity:0; }.sw-caption>.sw-caption__rest { opacity:1; }
.sw-caption>span::before { content:""; display:inline-block; vertical-align:middle; margin-right:1.6cqw; height:.8cqw; width:.8cqw; border-radius:50%; background:#769b7e; box-shadow:0 0 0 .7cqw #e7eee1; }
.sw-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(max-width:1099px) and (min-width:760px) { .hero--wallet .hero__grid { grid-template-columns:.9fr 1.1fr; min-height:560px; gap:0; }.hero--wallet .h1 { font-size:clamp(38px,4.7vw,51px); } }
@media(max-width:759px) { .hero--wallet { padding-top:31px; }.hero--wallet .hero__grid { grid-template-columns:1fr; gap:14px; min-height:0; }.wallet-showcase { max-width:480px; margin:8px auto 0; }.hero--wallet .account-strip { padding-top:25px; } }
@media(max-width:519px) { .hero--wallet .wallet-showcase { width:calc(100% + 24px); max-width:none; margin-inline:-12px; } }
@container(max-width:450px) {
 .sw-stage { aspect-ratio:600/850; --sw-idr-out:translate(-14%,-10%) rotate(-5deg) scale(1.14); --sw-idr-exit:translate(-35%,-25%) rotate(-17deg) scale(1.05); --sw-usd-out:translate(13%,9%) rotate(4deg) scale(1.16); --sw-usd-exit:translate(34%,24%) rotate(17deg) scale(1.05); }
 .sw-phone { width:65%; height:89%; left:17.5%; padding:1.55cqw; border-radius:9.3cqw; }.sw-glass { border-radius:7.9cqw; }.sw-island { width:18cqw; height:4.6cqw; top:1.8cqw; }.sw-island::after { top:1.4cqw; right:1.5cqw; width:1.4cqw; height:1.4cqw; }.sw-status { padding:2.5cqw 4.8cqw 0; font-size:2cqw; }.sw-signals { gap:.8cqw; }.sw-signals svg { width:3.4cqw; height:2.5cqw; }.sw-signals i { width:3.6cqw; height:1.9cqw; }
 .sw-app { padding-inline:2.8cqw; }.sw-appbar { height:7cqw; gap:1.4cqw; }.sw-appbar img { width:4.6cqw; height:4.6cqw; }.sw-appbar b { font-size:2.1cqw; }.sw-appbar>svg { width:3.4cqw; height:3.4cqw; }.sw-title { margin:2cqw 0 2.7cqw; }.sw-title strong { font-size:4.2cqw; }.sw-title span { font-size:2.1cqw; }
 .sw-summary { padding:2.9cqw; border-radius:3cqw; }.sw-summary>span { font-size:2.25cqw; }.sw-summary>span svg { width:3cqw; height:3cqw; }.sw-summary>strong { font-size:5.7cqw; margin:1.8cqw 0 2.4cqw; }.sw-summary>strong small { font-size:3.3cqw; }.sw-split span { font-size:2cqw; padding:1.5cqw; }.sw-split b { font-size:2.3cqw; }.sw-list-head { font-size:3cqw; margin-top:3.3cqw; }.sw-list-head span { font-size:2.2cqw; }
 .sw-card { min-height:16cqw; grid-template-columns:6.6cqw 1fr auto; gap:1.5cqw; padding:2.4cqw 2cqw; border-radius:3cqw; }.sw-card__icon { width:6.6cqw; height:6.6cqw; border-radius:2cqw; }.sw-card__icon svg { width:3.9cqw; height:3.9cqw; }.sw-card__name b { font-size:max(2.75cqw,10px); }.sw-card__name b svg { width:1.7cqw; height:1.7cqw; }.sw-card__name small { font-size:max(2.1cqw,8px); }.sw-card__money strong { font-size:max(2.85cqw,11px); }.sw-card__money small { font-size:max(2.2cqw,8px); }
 .sw-card--idr { transform:translate(-13%,-12%) rotate(-5deg) scale(1.13); }.sw-card--usd { transform:translate(12%,12%) rotate(4deg) scale(1.13); }
 .sw-bottom-nav>span { font-size:1.7cqw; }.sw-bottom-nav svg { width:3.7cqw; height:3.7cqw; }.sw-bottom-nav .sw-add { width:6.5cqw; height:6.5cqw; font-size:3.6cqw; }.sw-caption { font-size:2.8cqw; height:4.2cqw; }
 .sw-orbit { width:92%; left:4%; }.sw-leaf--one { left:4%; top:20%; width:9%; }.sw-leaf--two { right:2%; bottom:21%; }.sw-spark--one { right:8%; top:12%; }.sw-spark--two { left:5%; bottom:20%; }
}

/* Both wallets lift together, then sweep out directly into Jatah in <3 seconds. */
.wallet-showcase[data-sw-motion="ready"] { --sw-play-state:paused; }
.wallet-showcase[data-sw-running="true"] { --sw-play-state:running; }
.wallet-showcase[data-sw-motion="ready"] .sw-phone { animation:sw-phone-arrive 850ms cubic-bezier(.2,.7,.2,1) both; animation-play-state:var(--sw-play-state); }
.wallet-showcase[data-sw-motion="ready"] .sw-card--idr { animation:sw-wallet-idr var(--sw-cycle) cubic-bezier(.4,0,.2,1) infinite both; animation-play-state:var(--sw-play-state); }
.wallet-showcase[data-sw-motion="ready"] .sw-card--usd { animation:sw-wallet-usd var(--sw-cycle) cubic-bezier(.4,0,.2,1) infinite both; animation-play-state:var(--sw-play-state); }
.wallet-showcase[data-sw-motion="ready"] .sw-card--usd .sw-card__money small { animation:sw-valuation var(--sw-cycle) ease infinite both; animation-play-state:var(--sw-play-state); }
.wallet-showcase[data-sw-motion="ready"] .sw-caption>span { animation-duration:var(--sw-cycle); animation-iteration-count:infinite; animation-fill-mode:both; animation-play-state:var(--sw-play-state); }
.wallet-showcase[data-sw-motion="ready"] .sw-caption__rest { animation-name:sw-caption-rest; }
.wallet-showcase[data-sw-motion="ready"] :is(.sw-leaf-orbit,.sw-orbit,.sw-halo) { animation-duration:var(--sw-cycle); animation-iteration-count:infinite; animation-timing-function:cubic-bezier(.45,0,.2,1); animation-fill-mode:both; animation-play-state:var(--sw-play-state); }
.wallet-showcase[data-sw-motion="ready"] .sw-leaf-orbit--one { animation-name:sw-leaf-orbit-one; }
.wallet-showcase[data-sw-motion="ready"] .sw-leaf-orbit--two { animation-name:sw-leaf-orbit-two,sw-leaf-layer; }
.wallet-showcase[data-sw-motion="ready"] .sw-orbit { animation-name:sw-orbit-swish; }
.wallet-showcase[data-sw-motion="ready"] .sw-halo { animation-name:sw-halo-swish; }
@keyframes sw-phone-arrive { from { transform:translateY(20px) rotate(-2deg); opacity:0; } to { transform:translateY(0) rotate(-2deg); opacity:1; } }
@keyframes sw-wallet-idr {
 0%,1.5%,14%,100% { transform:translate(0,0) rotate(0deg) scale(1); opacity:1; box-shadow:none; border-color:transparent; }
 4%,9.5% { transform:var(--sw-idr-out); opacity:1; box-shadow:0 1.5cqw 3.7cqw -1cqw #20452d2c; border-color:#e2ebdc; }
 12% { transform:var(--sw-idr-exit); opacity:0; box-shadow:0 1.5cqw 3.7cqw -1cqw #20452d2c; border-color:#e2ebdc; }
}
@keyframes sw-wallet-usd {
 0%,1.5%,14%,100% { transform:translate(0,0) rotate(0deg) scale(1); opacity:1; box-shadow:none; border-color:transparent; }
 4%,9.5% { transform:var(--sw-usd-out); opacity:1; box-shadow:0 1.5cqw 3.7cqw -1cqw #20452d2c; border-color:#e2ebdc; }
 12% { transform:var(--sw-usd-exit); opacity:0; box-shadow:0 1.5cqw 3.7cqw -1cqw #20452d2c; border-color:#e2ebdc; }
}
@keyframes sw-valuation { 0%,1.5%,14%,100% { color:#777367; } 4%,9.5% { color:#17513f; } }
@keyframes sw-caption-rest { 0%,9%,99%,100% { opacity:1; } 12%,97% { opacity:0; } }
@keyframes sw-leaf-orbit-one { 0%,9.5% { transform:rotate(0deg); } 12%,39% { transform:rotate(360deg); } 42%,53% { transform:rotate(720deg); } 56%,93% { transform:rotate(1080deg); } 97%,100% { transform:rotate(1440deg); } }
@keyframes sw-leaf-orbit-two { 0%,9.5% { transform:rotate(0deg); } 12%,39% { transform:rotate(-360deg); } 42%,53% { transform:rotate(-720deg); } 56%,93% { transform:rotate(-1080deg); } 97%,100% { transform:rotate(-1440deg); } }
@keyframes sw-leaf-layer { 0%,9.4%,12.1%,38.9%,42.1%,52.9%,56.1%,92.9%,97.1%,100% { z-index:1; } 9.5%,12%,39%,42%,53%,56%,93%,97% { z-index:3; } }
@keyframes sw-orbit-swish { 0%,9.5%,12%,39%,42%,53%,56%,93%,97%,100% { transform:rotate(-26deg) scale(1); opacity:1; } 10.75%,40.5%,54.5%,95% { transform:rotate(-7deg) scale(1.035); opacity:.6; } }
@keyframes sw-halo-swish { 0%,9.5%,12%,39%,42%,53%,56%,93%,97%,100% { transform:rotate(-18deg) scale(1); } 10.75%,40.5%,54.5%,95% { transform:rotate(5deg) scale(1.055); } }
@media(prefers-reduced-motion:reduce) {
 .wallet-showcase .sw-phone,.wallet-showcase .sw-card,.wallet-showcase .sw-card__money small,.wallet-showcase .sw-caption>span,.wallet-showcase .sw-leaf-orbit,.wallet-showcase .sw-orbit,.wallet-showcase .sw-halo { animation:none !important; }
}