/* MOVA — Features directory. Uses tokens from mova.css only. */

/* Index */
.f-index { list-style:none; margin:56px 0 0; padding:0; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:0 20px; }
html body .f-index a { display:flex; flex-direction:column; gap:4px; padding:16px 0 18px; border-top:1px solid var(--line-2); color:var(--ink); }
.f-index .mono { font-size:10.5px; letter-spacing:.14em; color:var(--label); }
.f-index-k { font-size:17px; font-weight:600; letter-spacing:-0.02em; margin-top:8px; }
.f-index-t { font-size:13px; color:var(--text-2); }
html body .f-index a:hover .f-index-k { color:var(--purple); }
@media (min-width: 720px) { .f-index { grid-template-columns:repeat(4, minmax(0,1fr)); } }
@media (min-width: 1200px) { .f-index { grid-template-columns:repeat(7, minmax(0,1fr)); gap:0 16px; } }

/* Directory */
.f-dir { display:grid; grid-template-columns:minmax(0,1fr); }
.f-side { position:sticky; top:calc(var(--nav-h) + 24px); align-self:start; }
.f-side ol { list-style:none; margin:16px 0 0; padding:0; }
html body .f-side a { display:flex; align-items:center; gap:14px; padding:9px 0; font-size:15px; color:var(--label); transition:color .2s ease; }
.f-side a .mono { font-size:10.5px; letter-spacing:.12em; color:var(--cents); }
html body .f-side a[aria-current] { color:var(--ink); font-weight:600; }
.f-side a[aria-current]::after { content:''; width:5px; height:5px; border-radius:999px; background:var(--purple); }
html body .f-side a:hover { color:var(--ink); }
.f-cap { display:grid; grid-template-columns:minmax(0,1fr); gap:32px; padding:56px 0; border-top:1px solid var(--line-2); scroll-margin-top:24px; }
.f-cap:first-child { border-top:0; padding-top:0; }
.f-cap-text { display:flex; flex-direction:column; gap:18px; max-width:480px; }
.f-list { margin:6px 0 4px; }
.f-list div { padding:12px 0; border-top:1px solid var(--line-3); }
.f-list div:last-child { border-bottom:1px solid var(--line-3); }
.f-list dt { font-size:14px; font-weight:600; }
.f-list dd { margin:3px 0 0; font-size:13.5px; line-height:1.5; color:var(--text-2); }
.f-cap-vis { position:relative; min-height:300px; border-radius:var(--r-block); display:flex; align-items:center; justify-content:center; padding:32px 20px; }
.f-cap-vis > * { position:relative; }
@media (min-width: 1200px) {
  .f-dir { grid-template-columns:200px minmax(0,1fr); gap:var(--gap); }
  .f-cap { grid-template-columns:minmax(0,5fr) minmax(0,6fr); gap:48px; padding:72px 0; align-items:center; }
  .f-cap-vis { min-height:380px; }
}

/* Capability details */
.f-send { width:340px; max-width:100%; border-radius:32px; padding:22px 24px; color:#FFFFFF; position:relative; overflow:hidden; background:radial-gradient(135% 105% at 12% 118%, #FFD24A 0%, #FFB23A 12%, #F08A3C 22%, #A24BE0 48%, #6B23C4 70%, #37116F 100%); }
.f-send::before { content:''; position:absolute; inset:0; background-image:var(--dots-card); background-size:9px 9px; -webkit-mask-image:linear-gradient(to top, #000, transparent 55%); mask-image:linear-gradient(to top, #000, transparent 55%); }
.f-send > * { position:relative; }
.f-send-top { display:flex; justify-content:space-between; align-items:center; font-size:13px; color:rgba(255,253,249,.85); }
.f-pill { display:inline-flex; align-items:center; gap:6px; background:rgba(17,17,18,.85); color:#FFFFFF; border-radius:999px; padding:5px 11px 5px 6px; font-size:12px; font-weight:600; }
.f-send-amt { font-size:64px; font-weight:600; letter-spacing:-0.055em; line-height:1; margin:28px 0 22px; }
.f-send-rows div { display:flex; justify-content:space-between; gap:12px; padding:9px 0; border-top:1px solid rgba(255,253,249,.28); font-size:12.5px; }
.f-send-rows span:first-child { color:rgba(255,253,249,.8); }
.f-send-rows span:last-child { font-weight:600; }
.f-send-rows em { font-style:normal; font-weight:400; color:rgba(255,253,249,.7); }

.f-hold { width:470px; max-width:100%; height:262px; }
.f-acct { position:absolute; width:230px; height:136px; border-radius:26px; padding:16px 18px; display:flex; flex-direction:column; gap:6px; box-shadow:var(--shadow-object); }
.f-acct-n { font-size:12px; font-weight:600; }
.f-acct-v { font-size:26px; font-weight:600; letter-spacing:-0.045em; }
.f-acct--usd { left:0; top:0; background:var(--grad-card); color:#FFFFFF; }
.f-acct--usd .cents { color:inherit; opacity:.6; }
.f-acct--eur { left:120px; top:63px; background:#FFFFFF; border:1px solid #E6E3DD; }
.f-acct--gbp { left:240px; top:126px; background:var(--dark); color:#FFFFFF; }
.f-acct--gbp .cents { color:inherit; opacity:.5; }
@media (max-width: 719.98px) { .f-hold { transform:scale(.8); transform-origin:center; } }

.f-chart { width:100%; max-width:480px; }
.f-chart-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.f-chart-v { font-size:40px; font-weight:600; letter-spacing:-0.05em; line-height:1; margin-top:4px; }
.f-chart-v span { font-size:13px; font-weight:600; letter-spacing:0; color:var(--purple); vertical-align:middle; }
.f-chart .seg button { pointer-events:none; }
.f-chart svg { display:block; width:100%; height:150px; margin-top:22px; overflow:visible; }
.f-chart-axis { display:flex; justify-content:space-between; font-size:10.5px; color:var(--label); margin-top:10px; }

.f-recv { width:340px; max-width:100%; padding:20px 22px 8px; }
.f-recv-head { display:flex; align-items:center; gap:12px; margin-bottom:8px; }
.f-recv-head .n { font-size:15px; font-weight:600; }
.f-recv-head .s { font-size:12px; color:var(--label); margin-top:2px; }
.f-recv .ledger > div:last-child { border-bottom:0; }

.f-track { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); width:100%; max-width:480px; }
.f-track-s { position:relative; display:flex; flex-direction:column; gap:6px; padding-top:28px; font-size:13px; }
.f-track-s::before { content:''; position:absolute; left:0; right:0; top:9px; height:1.5px; background:var(--purple); }
.f-track-s--next::before { background:none; border-top:1.5px dashed #D3CFC8; height:0; }
.f-track-s:last-child::before { right:auto; width:0; }
.f-track-dot { position:absolute; left:0; top:0; width:20px; height:20px; border-radius:999px; background:var(--purple); z-index:1; }
.f-track-s--done .f-track-dot::after { content:''; position:absolute; inset:6px; border-radius:999px; background:#FFFFFF; }
.f-track-s--now .f-track-dot { box-shadow:0 0 0 6px rgba(107,35,196,.12); }
.f-track-s--next .f-track-dot { background:var(--field-soft); border:1.5px solid var(--line-strong); }
.f-track-s .mono { font-size:10.5px; letter-spacing:.12em; color:var(--label); }
.f-track-s--now .mono { color:var(--purple); }
.f-track-l { font-weight:600; }
.f-track-s--next .f-track-l { color:var(--muted); }
.js .f-track[data-animate] .f-track-s { opacity:0; transition:opacity .5s ease; transition-delay:calc(var(--i) * .3s); }
.js .f-track[data-animate].is-in .f-track-s { opacity:1; }

.f-tx { width:380px; max-width:100%; }
.f-sec { width:360px; max-width:100%; padding:6px 22px; }
.f-sec-row { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:15px 0; border-bottom:1px solid var(--row-line); }
.f-sec-row:last-child { border-bottom:0; }
.f-sec-row .n { font-size:15px; font-weight:600; }
.f-sec-row .s { font-size:12.5px; color:var(--label); margin-top:2px; }
.f-toggle { width:44px; height:26px; border-radius:999px; background:var(--purple); padding:3px; display:flex; justify-content:flex-end; flex:none; }
.f-toggle::after { content:''; width:20px; height:20px; border-radius:999px; background:#FFFFFF; }

/* Comparison */
.f-compare .table-wrap { margin-top:48px; }
.f-table th[scope="row"] { font-family:inherit; font-size:15px; font-weight:500; letter-spacing:-0.01em; text-transform:none; color:var(--ink); padding:18px 16px 18px 0; border-bottom:1px solid var(--line-3); white-space:normal; }
.f-table .c { text-align:center; width:140px; }
.f-table thead a { color:var(--label); }
.f-yes { color:var(--purple); font-size:12px; }
.f-no { color:var(--cents); }